@charset "UTF-8";

body{
  font-family: 'Noto Serif SC', serif;
  font-weight: 200;
  font-size: 16px;
}

/* フォント */
.notoJP_light{
  font-family: 'Noto Serif SC', serif;
  font-weight: 200;
}
.notoJP_regular{
  font-family: 'Noto Serif SC', serif;
  font-weight: 400;
}
.notoJP_medium{
  font-family: 'Noto Serif SC', serif;
  font-weight: 500;
}
.notoserif{
  font-family: 'Noto Serif SC', serif;
}
.athelas{
  font-family: 'Athelas';
  letter-spacing: 1px;
}
.kokoro{
  font-family: 'Kokoro', 'Noto Serif SC', serif;
}
.courgette{
  font-family: 'Courgette', cursive;
  letter-spacing: 1px;
}
.mincho{
  font-family: 'Noto Serif SC', "游明朝", "Yu Mincho", "游明朝体", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
.gothic{
  font-family: 'Noto Sans SC', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
.black{
  color: #000;
}
.white{
  color: #fff;
}
.gray{
  color: #666;
}


.fs10{ font-size:10px;}
.fs12{ font-size:12px;}
.fs13{ font-size:13px;}
.fs14{ font-size:14px;}
.fs15{ font-size:15px;}
.fs16{ font-size:16px;}
.fs17{ font-size:17px;}
.fs18{ font-size:18px;}
.fs19{ font-size:19px;}
.fs20{ font-size:20px;}
.fs21{ font-size:21px;}
.fs22{ font-size:22px;}
.fs23{ font-size:23px;}
.fs24{ font-size:24px;}
.fs25{ font-size:25px;}
.fs26{ font-size:26px;}
.fs27{ font-size:27px;}
.fs28{ font-size:28px;}
.fs29{ font-size:29px;}
.fs30{ font-size:30px;}
.fs31{ font-size:31px;}
.fs32{ font-size:32px;}
.fs33{ font-size:33px;}
.fs34{ font-size:34px;}
.fs35{ font-size:35px;}
.fs36{ font-size:36px;}
.fs37{ font-size:37px;}
.fs38{ font-size:38px;}
.fs39{ font-size:39px;}
.fs40{ font-size:40px;}
.fs44{ font-size:44px;}
.fs48{ font-size:48px;}
.fs50{ font-size:50px;}
h1{
  font-weight: normal;
}
h2{
  font-weight: normal;
}
h3{
  font-weight: normal;
}
h4{
  font-weight: normal;
}
h5{
  font-weight: normal;
}
h5{
  font-weight: normal;
}

/* style */
.bg_black{
  background: #1e160b;
}
.bg_white{
  background: #fff;
}
.bg_gray{
  background: #efede6;
}

.inner_1040{
  width: 98%;
  max-width: 1040px;
  margin: 0 auto;
}
.inner_1100{
  width: 98%;
  max-width: 1100px;
  margin: 0 auto;
}
.inner_1280{
  width: 98%;
  max-width: 1280px;
  margin: 0 auto;
}
.inner_1600{
  width: 98%;
  max-width: 1600px;
  margin: 0 auto;
}
.inner_2000{
  width: 98%;
  max-width: 2000px;
  margin: 0 auto;
}

.sp{
  display: none;
}
.inline-block{
  display: inline-block;
}
.flex{
  display: flex;
}
.flex_between{
  display: flex;
  justify-content: space-between;
}
.flex_center{
  display: flex;
  justify-content: center;
}
.flex_end{
  display: flex;
  justify-content: flex-end;
}

.flex_wrap{
  flex-wrap: wrap;
}
.ta_center{
  text-align: center;
}
.relative{
  position: relative;
}
.absolute{
  position: absolute;
}
.ls1{
  letter-spacing: 1px;
}
.ls2{
  letter-spacing: 2px;
}
.ls3{
  letter-spacing: 3px;
}
.ls4{
  letter-spacing: 4px;
}
.ls5{
  letter-spacing: 5px;
}
.ls7{
  letter-spacing: 7px;
}
.tate{
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
 }
.clearfix::after{
  content: "";
  display: block;
  clear: both;
}
a{
  color: #000;
  text-decoration: none;
}
a:hover{
  opacity: .5;
  transition: .3s;
}
img{
  display: block;
  width: 100%;
}
ul,
ol{
  list-style: none;
  margin: 0;
  padding: 0;
}
.btn{
  display: block;
  width: 100%;
  max-width: 225px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  margin: 0 auto;
}
.btn_bk{
  color: #fff;
  background: url(../images/common/btn_brown.png) no-repeat;
  background-size: cover;
}
.btn_w{
  background: url(../images/common/btn_w.png) no-repeat;
  background-size: cover;
}
.btn:hover{
  cursor: pointer;
  opacity: .5;
  transition: .3s;
}

/* animation */
.fadein {
	opacity : 0;
	transform : translate(0px, 100px);
	transition : all 900ms;
	}
.fadein.scrollin {
	opacity : 1;
	transform : translate(0px, 0px);
	}

/* .fadein:nth-of-type(2) {
	-moz-transition-delay:200ms;
	-webkit-transition-delay:200ms;
	-o-transition-delay:200ms;
	-ms-transition-delay:200ms;
	}
.fadein:nth-of-type(3) {
	-moz-transition-delay:400ms;
	-webkit-transition-delay:400ms;
	-o-transition-delay:400ms;
	-ms-transition-delay:400ms;
	}
.fadein:nth-of-type(4) {
	-moz-transition-delay:600ms;
	-webkit-transition-delay:600ms;
	-o-transition-delay:600ms;
	-ms-transition-delay:600ms;
	}
.fadein:nth-of-type(5) {
	-moz-transition-delay:800ms;
	-webkit-transition-delay:800ms;
	-o-transition-delay:800ms;
	-ms-transition-delay:800ms;
	}
.fadein:nth-of-type(5) {
	-moz-transition-delay:1000ms;
	-webkit-transition-delay:1000ms;
	-o-transition-delay:1000ms;
	-ms-transition-delay:1000ms;
	}

.fadein:nth-of-type(6) {
	-moz-transition-delay:1200ms;
	-webkit-transition-delay:1200ms;
	-o-transition-delay:1200ms;
	-ms-transition-delay:1200ms;
	}
.fadein:nth-of-type(7) {
	-moz-transition-delay:1400ms;
	-webkit-transition-delay:1400ms;
	-o-transition-delay:1400ms;
	-ms-transition-delay:1400ms;
	}
.fadein:nth-of-type(8) {
	-moz-transition-delay:1600ms;
	-webkit-transition-delay:1600ms;
	-o-transition-delay:1600ms;
	-ms-transition-delay:1600ms;
	}
.fadein:nth-of-type(9) {
	-moz-transition-delay:1800ms;
	-webkit-transition-delay:1800ms;
	-o-transition-delay:1800ms;
	-ms-transition-delay:1800ms;
	}
.fadein:nth-of-type(10) {
	-moz-transition-delay:2000ms;
	-webkit-transition-delay:2000ms;
	-o-transition-delay:2000ms;
	-ms-transition-delay:2000ms;
	} */

/* header */
.header{

  display: none;

  width: 100%;
  height: 80px;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 10;
  background: #1e160b;
  transform: translate3d(0,0,0);
}
.header .inner{
  display: flex;
  align-items: center;
  height: 100%;
}
.header .logo{
  width: 10%;
  max-width: 74px;
}
.header .header_nav{
  width: 75%;
  max-width: 705px;
}

.header .header_nav .ja{
  font-family: 'Kokoro', 'Noto Serif SC', serif;
  display: block;
  text-align: center;
  color: #fff;
}
.header .header_nav .en{
  font-family: 'Courgette', cursive;
  color: #666;
  display: block;
  text-align: center;

}

.top_fix{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  z-index: 9;
}
.top_fix a{
  color: #fff;
}
.top_fix .tel{
  display: inline-block;
  margin-left: 10px;
}
.top_fix .language{
  background: #fff;
  width: 140px;
  margin-left: 15px;
}
.top_fix .language p{
  height: 40px;
  line-height: 40px;
  padding: 0 7px 0 23px;
  background: url(../images/common/language_icon.svg) no-repeat;
  background-size: 10px auto;
  background-position: right 10px center;
}
.top_fix .language:hover{
  cursor: pointer;
}
.top_fix .language:hover ul{
  opacity: 1;
  transition: .3s;
}

.top_fix .language ul{
  opacity: 0;
  position: absolute;
  width: 140px;
}
.top_fix .language li{
  background: #fff;
  border-top: 1px solid #000;
  height: 40px;
  line-height: 40px;
  padding-left: 23px;

}
.top_fix .language li a{
  color: #000;
}

/* footerlink */
.footerlink_outer{
  background: #fff;
  position: relative;
}
.footerlink{
  padding: 60px 0 100px;
}
.footerlink .box{
  width: 33.333%;
  border-right: 1px solid #bebebe;
}
.footerlink .box:last-child{
  border-right: none;
}
.footerlink .icon{
  width: 35px;
  margin: 10px auto;
}
.footerlink .img{
  width: 93%;
  height: 440px;
  margin: 15px auto 30px;
  background: gray;
  overflow: scroll;
}
.footerlink .insta .img{
  background: none;
  overflow: inherit;
}
/* footer */
.footer{
  color: #fff;
  background: #1e160b;
  padding: 45px 0;
}

.footer .logo{
  width: 40%;
}
.footer .logo img{
  max-width: 230px;
  margin: 0 auto;
}
.footer .address{
  width: 60%;
}
.footer .address p{
  margin-bottom: 8.5px;
}
.footer .address .banner{
  display: block;
  width: 200px;
  height: auto;
  margin: 15px 0 10px;
  background: #fff;
}

.footer .footer_nav{
  margin: 95px 0;
}

.footer .footer_nav ul a{
  color: #fff;
  border-right: 1px solid #fff;
  padding: 0 15px;
}
.footer .footer_nav ul li{
  margin-bottom: 20px;
}
.footer .footer_nav li:last-child a{
  border-right: none;
  padding-right: 0;
}
.footer .footer_nav .follow span{
  vertical-align: middle;
}
.footer .footer_nav .follow img{
  display: inline-block;
  width: 32px;
  vertical-align: middle;
  margin-left: 5px;
}

.footer .copy{
  display: block;
  width: 100%;
}

/* link to top */
.linktop{
  width: 55.5px;
  height: auto;
  position: absolute;
  right: 0;
  top: -105px;
  z-index: 10;
}
.linktop:hover{
  cursor: pointer;
  opacity: .5;
  transition: .9s;
}

.bottom_fix{
  position: fixed;
  right: 1.5%;
  bottom: 30px;
  z-index: 10;
  width: 62px;
  height: 143px;
  background: url(../images/common/linktop2.png) top center no-repeat;
}
.bottom_fix:hover{
  background: url(../images/common/linktop2_hover.png) top center no-repeat;
  transition: .9s;
}


@media screen and (max-width: 970px){
  .header .add{
    display: none;
  }
}

@media screen and (max-width: 768px){
  html, body{
    /* overflow: auto; */
    height: 100%;
    -webkit-overflow-scrolling: touch
  }
  .inner_1040,
  .inner_1280{
    width: 100%;
  }
  .flex,
  .flex_between,
  .flex_center{
    display: block;
  }
  .sp{
    display: block;
  }
  .pc{
    display: none;
  }
  .block_768{
    display: block;
  }
  .fadein {
  	opacity : 0;
  	transform : translate(0px, 40px);
  	transition : all 400ms;
  	}
  .fadein.scrollin {
  	opacity : 1;
  	transform : translate(0px, 0px);
  	}

  /* header logo */
  .header{
    padding: 5px;
    /* top: 40px; */
  }
  .header .logo {
    width: auto;
    height: 100%;
  }
  .header .logo h1{
    height: 100%;
  }
  .header .logo h1 img{
    display: block;
    width: auto;
    height: 100%;
  }
  .header .btns{
    width: 35%;
    max-width: 250px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .header .btns .tel,
  .header .btns .mbtn_menu{
    display: block;
    width: 80px;
    max-width: 80px;
    margin-left: 5px;
  }
  .header .btns .mbtn_menu:hover{
    cursor: pointer;
  }


  /* language */
  .top_fix{
    z-index: 20;
  }
  .top_fix .language{
    width: 100%;
    margin-left: 0;
    text-align: center;
    /* position: fixed;
    top: 0; */
  }
  .top_fix .language ul{
    width: 100%;
    display: none;
  }
  .top_fix .language li {
    padding-left: 18px;
  }
  .top_fix .language:hover ul{
    display: block;
    transition: .3s;
  }


  /* スマホメニュー */
  .spmenu{
    position: fixed;
    top: 80px;
    left: 100%;
    width: 100%;
    height: calc(100vh - 120px);
    overflow-y: scroll;
    z-index: 10;
    color: #fff;
    background: #1e160b;
    padding: 20px 4%;
  }
  .spmenu a{
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dotted #fff;
    padding: 20px 10px;
  }
  .spmenu li .en{
    font-family: 'Courgette', cursive;
    color: #666;
    }
  .spmenu .spmenu_tel{
    border: 1px dotted #fff;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    margin: 30px 0;
  }
  .spmenu .spmenu_tel .tel{
    margin-left: .5em;
  }

  .spmenu .spmenu_close{
    text-align: center;
  }
  .spmenu .spmenu_close:hover{
    cursor: pointer;
  }
  .spmenu .spmenu_close img{
    display: inline-block;
    width: 18px;
    margin-right: 10px;
    vertical-align: middle;
  }
  .spmenu .spmenu_close span{
    vertical-align: middle;
  }


  /* footerlink */
  .footerlink {
      padding: 40px 0;
  }

  .footerlink .box{
    width: 96%;
    max-width: 340px;
    margin: 0 auto 30px;
    border-right: none
  }

  /* footer */
  .footer{
    padding-bottom: 80px;
  }
  .footer .logo {
    width: 26%;
    max-width: 150px;
    margin: 0 auto 20px;
  }
  .footer .address {
    width: 96%;
    max-width: 480px;
    margin: 0 auto;
  }
  .footer .footer_nav {
    margin: 40px 0;
  }
  .footer .footer_nav ul{
    display: flex;
    padding: 0 2%;
  }
  .footer .footer_nav ul li{
    margin-bottom: 10px;
    font-size: 16px;
  }
  .footer .footer_nav .follow{
    text-align: center;
    margin-top: 15px;
  }

  .bottom_fix{
    bottom: 10px;
    display: none;
  }



}
@media screen and (max-width: 500px){

  .fs36{ font-size:28.8px;}

  .fs48{ font-size:38.4px;}

  .fs66{
    font-size:52.8px;
    line-height: .8;
  }
  .fs88{
    font-size:70.4px;
    line-height: .8;
  }

}