@charset "UTF-8";



/*=============================================v

 * body

 *=============================================*/

body {

   background-color: #0b0c10;

   color: #fff;

   font-family: 'Noto Sans JP', sans-serif;

   font-weight: normal;

   font-size: 16px;

   line-height: 32px;

   letter-spacing: 0.06em;

   -webkit-font-smoothing: antialiased;

   -moz-osx-font-smoothing: grayscale;

   min-width: inherit;

   min-height: inherit;

   max-height: 100%;

}



body:not(.home) {

   background-color: #1a1a1a;

}



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

   body {

      font-size: 14px;

      line-height: 24px;

   }

}



/*=============================================

 * fonts

 *=============================================*/

.fnt-mincho {

   font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

}



.fnt-meiryo {

   font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}



.fnt-gothic {

   font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;

}



.fnt-baskerville-display {

   font-family: baskerville-display-pt, serif;

}



.fnt-TrajanPro {

   font-family: 'Trajan Pro', serif;

}



.fnt-A-OTFA1MinchoStdBold {

   font-family: 'A-OTF A1 Mincho Std Bold', "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif;

}



.fnt-NotoSansJP {

   font-family: 'Noto Sans JP', sans-serif;

}



/*=============================================

 * <main>

 *=============================================*/

main {

   clear: both;

   width: 100%;

   position: relative;

   overflow: hidden;

   padding-top: 190px;

}



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

   main {

      padding-top: 80px;

   }

}



/* -- -- */

.wrap {

   width: 100%;

   max-width: 1200px;

   margin: 0 auto;

   box-sizing: border-box;

   position: relative;

}



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

   .wrap {

      max-width: 960px;

   }

}



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

   .wrap {

      max-width: 720px;

   }

}



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

   .wrap {

      max-width: 100%;

      padding: 0 4.6875%;

   }

}



a {

   transition: all 0.3s;

}



a:hover {

   opacity: 0.6;

   text-decoration: none;

}



a[href^="tel:"] {

   pointer-events: none;

   cursor: text;

}



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

   a[href^="tel:"] {

      pointer-events: auto;

      cursor: pointer;

   }

}



.pc {

   display: block;

}



.ipd {

   display: none;

}



.sp {

   display: none;

}



@media screen and (min-width: 768px) and (max-width: 991px) {

   .ipd {

      display: block;

   }

}



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

   .pc {

      display: none;

   }



   .sp {

      display: block;

   }

}



/*=============================================

 * <header>

 *=============================================*/

.hamburger {

   width: 51px;

   height: 26px;

   padding: 0;

   position: relative;

   z-index: 2;

}



.hamburger .hamburger-box {

   display: block;

   width: 100%;

   height: 100%;

}



.hamburger .hamburger-inner,

.hamburger .hamburger-inner:after,

.hamburger .hamburger-inner:before {

   width: 100%;

   height: 1px;

   background-color: #fff;

   border-radius: 0;

   margin: 0;

}



.hamburger .hamburger-inner {

   top: 0;

}



.hamburger .hamburger-inner:before {

   top: 12px;

}



.hamburger .hamburger-inner:after {

   top: 25px;

}



.hamburger--slider.is-active .hamburger-inner {

   transform: translate3d(0, 11px, 0) rotate(45deg);

}



.hamburger--slider.is-active .hamburger-inner:after {

   transform: translate3d(0, -23px, 0) rotate(-90deg);

}



header {

   height: 170px;

   box-sizing: border-box;

   padding: 38px 0;

   position: fixed;

   top: 0;

   left: 0;

   z-index: 100;

}


header .h_row {

   display: flex;

   flex-wrap: wrap;

   align-items: flex-start;

}



header .logo {

   flex: auto;

}



header .logo a {

   display: block;

   width: 168px;

}



header .btn-insta {

   width: 30px;

   padding-top: 20px;

}



header .hamburger {

   margin-top: 25px;

   margin-left: 32px;

}



#navbar {

   width: 100%;

   height: 100vh;

   background-color: #000;

   box-sizing: border-box;

   overflow: hidden auto;

   font-size: 18px;

   padding: 200px 0;

   position: fixed;

   top: 0;

   left: 0;

   z-index: -1;

   opacity: 0;

   visibility: hidden;

   transition: all 0.5s ease;

}



#navbar a {

   display: block;

   border-bottom: 1px solid #555;

   padding-bottom: 20px;

}



#navbar a+a {

   padding-top: 20px;

}



.navOpen {

   overflow: hidden;

}



.navOpen #navbar {

   opacity: 1;

   visibility: visible;

}

header.fixed {
   background-color: #000;
   height: 130px;
   padding: 20px 0;
}
header.fixed .logo a {
   width: 128px;
}

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

   header {

      padding: 30px 30px;

   }

}



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

   header {

      height: 80px;

      padding: 0 0;

   }



   header .wrap {

      align-items: center;

      height: 100%;

   }



   header .logo a {

      width: 90px;

   }



   header .btn-insta {

      width: 25px;

      padding-top: 0;

   }



   header .hamburger {

      width: 40px;

      margin-top: 0;

      margin-left: 15px;

   }



   #navbar {

      font-size: 15px;

      padding: 100px 0 120px;

   }



   #navbar a {

      padding-bottom: 10px;

   }



   #navbar a+a {

      padding-top: 10px;

   }

   header.fixed {
      height: 80px;
      padding: 0 0;
   }
   header.fixed .logo a {
      width: 90px;
   }

}



/* --- --- */

/*=============================================

 * <footer>

 *=============================================*/

/* -- -- */

footer {

   background-color: #1a1a1a;

   font-size: 14px;

   line-height: 32px;

   letter-spacing: 0.06em;

   padding: 30px 0;

}



footer .wrap {

   display: flex;

   flex-wrap: wrap;

   align-items: flex-end;

}



footer .logo {

   width: 137px;

}



footer .col {

   padding-left: 150px;

}



footer nav p {

   display: inline-block;

}

footer p {
	margin-top:15px;
	font-size:11px;

}



footer nav p:after {

   content: '|';

   display: inline-block;

   padding: 0 18px;

}



footer nav p:last-child:after {

   display: none;

}



footer nav p a:hover {

   text-decoration: underline;

   opacity: 1;

}



footer address {

   text-align: left;

}



.bnr_fixed_r {

   width: 240px;

   position: fixed;

   bottom: 30px;

   right: 30px;

   z-index: 90;

}

.bnr_fixed_r2 {

   width: 240px;

   position: fixed;

   bottom: 30px;

   right: 290px;

   z-index: 90;

}



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

   footer .col {

      padding-left: 80px;

   }

}



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

   footer {

      padding-bottom: 105px;

   }



   .bnr_fixed_r {

      width: 220px;

      bottom: 20px;

      right: 20px;

   }
 .bnr_fixed_r2 {

      width: 220px;

      bottom: 20px;
   right: 250px;


   }





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

   footer {

      line-height: 24px;

      text-align: center;

      padding: 30px 0 100px;

   }



   footer .wrap {

      display: block;

   }



   footer .logo {

      margin: 0 auto;

      padding-bottom: 15px;

   }



   footer .col {

      padding-left: 0;

   }



   footer nav {

      padding-top: 15px;

   }



   footer nav p {

      display: block;

      padding-bottom: 20px;

      position: relative;

   }



   footer nav p:after {

      content: "";

      display: block;

      width: 20px;

      border-top: 1px solid #fff;

      padding: 0;

      position: absolute;

      bottom: 10px;

      left: 50%;

      transform: translateX(-50%);

   }



   footer address {

      text-align: center;

      padding-top: 15px;

   }



   .bnr_fixed_r {

      width: 50%;

      background-color: #8a6f2e;

      text-align: center;

      bottom: 0;

      right: 50%;

      opacity: 0;

      visibility: hidden;

      transition: all 0.3s;

   }



   .bnr_fixed_r.visible {

      opacity: 1;

      visibility: visible;

   }



   .bnr_fixed_r img {

      width: 100%;

      height:auto;

   }
	
.bnr_fixed_r2 {

      width: 50%;

      background-color: #047504;

      text-align: center;

      bottom: 0px;

      right: 0;

      opacity: 0;


      transition: all 0.3s;

   }



   .bnr_fixed_r2.visible {

      opacity: 1;

      visibility: visible;

   }



   .bnr_fixed_r2 img {

      width: 100%;

      height:auto;

   }

}



/*=============================================

 * <Section>

 *=============================================*/