@charset "UTF-8";

/*=============================================
 * body
 *=============================================*/
body {
   background-color: #F6F6F6;
   color: #141414;
   font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
   font-weight: 500;
   font-style: normal;
   font-size: 17px;
   line-height: 43px;
   letter-spacing: 0.02em;
   min-width: inherit;
   min-height: inherit;
   max-height: 100%;
   position: relative;
}

@media screen and (max-width: 1680px) {
   body {
      font-size: 14px;
      line-height: 32px;
   }
}

@media screen and (max-width: 767px) {
   body {
      font-family: 'Noto Serif JP', serif;
      font-size: 14px;
      line-height: 26px;
   }
}

/*=============================================
 * 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;
}

/*=============================================
 * <main>
 *=============================================*/
main {
   clear: both;
   width: 100%;
   box-sizing: border-box;
   overflow: hidden;
   position: relative;
}

/*=============================================
 * <header>
 *=============================================*/
/* -- -- */
header {
   position: relative;
   z-index: 100;
}

header .wrap {
   max-width: 100%;
}

header .logo a {
   display: block;
}

.navbar__nav {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row-reverse;
   gap: 35px;
}

.navbar__nav a {
   display: block;
   width: 21px;
   font-weight: 500;
   font-size: 21px;
   letter-spacing: 0.02em;
   line-height: 30px;
}

.header__home {
   width: 100%;
   height: 100vh;
   color: #fff;
   position: absolute;
   top: 0;
   left: 0;
}

.header__home .wrap {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row-reverse;
   align-items: flex-end;
   gap: 50px;
   margin: 0;
   position: absolute;
   bottom: 17.5%;
   right: 100px;
}

.header__home .logo {
   padding-bottom: 80px;
}

.header__home .logo img {
   filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(0,0,0,0.7));
}

.header__child .wrap {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: row-reverse;
   padding: 80px 80px;
}

.header__child .logo {
   width: calc(50% - 45px);
}

.header__child .logo a {
   display: block;
   width: 52px;
   margin-left: auto;
}

.header__child #navbar {
   width: calc(50% - 45px);
}

.header__child .navbar__nav {
   justify-content: flex-end;
}

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

   .header__home .logo a,
   .header__child .logo a {
      width: 40px;
   }

   .navbar__nav a {
      font-size: 17px;
   }
}

@media screen and (max-width: 991px) {
   .hamburger {
      display: block;
      background-color: #fff;
      padding: 12px 5px;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1000;
   }

   body.navOpen .hamburger {
      background-color: transparent;
   }

   .hamburger span {
      width: 36px;
      top: 50%;
      left: 5px;
   }

   #navbar {
      width: 100%;
      height: 100vh;
      background-color: rgba(30, 30, 30, 0.95);
      background-image: url('/uploads/2023/05/parallax01.jpg');
      background-size: cover;
      background-position: center;
      background-blend-mode: overlay;
      color: #fff;
      box-sizing: border-box;
      position: fixed;
      top: 0;
      left: 0;
      transition: all 0.5s ease-in-out;
      opacity: 0;
      visibility: hidden;
      overflow: auto;
      padding: 80px 20px 150px;
      z-index: 999;
   }

   .navbar__logo {
      display: block;
      width: 30px;
      position: absolute;
      top: 20px;
      right: 20px;
   }

   .navbar__logo img {
      filter: brightness(0) invert(1);
   }

   .navbar__nav {
      justify-content: space-between;
      gap: 0;
      padding-right: 18vw;
   }

   .header__home .wrap {
      display: block;
      position: relative;
      bottom: auto;
      right: auto;
      padding: 0 20px;
   }

   .header__home .logo {
      width: 30px;
      margin-left: auto;
      padding: 20px 0 0;
   }

   .header__child .wrap {
      min-height: 220px;
      padding: 20px 20px;
   }

   .header__child .logo {
      width: auto;
      position: absolute;
      top: 20px;
      right: 20px;
   }

   .header__child .logo a {
      width: 30px;
   }

   .header__child #navbar {
      width: 100%;
      position: fixed;
      top: 0;
      left: 0;
      transform: translateY(0);
   }

   .header__child .navbar__nav {
      justify-content: space-between;
   }

   .navOpen #navbar {
      opacity: 1;
      visibility: visible;
   }
}

/*=============================================
 * <section>
 *=============================================*/
/* --- --- */
section {
   width: auto;
   box-sizing: border-box;
   margin: 0;
}

.copyright01 {
   font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
   font-size: 13px;
   letter-spacing: 0.02em;
   line-height: 26px;
   position: absolute;
   top: 35px;
   left: 45px;
   z-index: 1;
}

.copyright01 .txt-latin {
   letter-spacing: 0.02em;
}

@media screen and (max-width: 991px) {
   .copyright01 {
      font-size: 10px;
      line-height: 20px;
      top: 40px;
      left: 0;
   }
}
@media screen and (max-width: 767px) {
   .copyright01 {
      line-height: 14px;
   }
}
/* --- --- */
/*=============================================
 * <footer>
 *=============================================*/
/* --- --- */
#section__cta {
   padding: 0 70px;
}

#section__cta .map {
   height: 765px;
   padding: 120px 70px 0;
}

#section__cta .map>* {
   display: block;
   width: 100%;
   height: 100%;
}

#section__cta .bnr {
   padding: 120px 0;
}

#section__cta .bnr a {
   display: block;
   background-color: #000;
   border: 1px solid #000;
   color: #fff;
   text-align: center;
   font-weight: 600;
   font-size: 24px;
   letter-spacing: 0.02em;
   line-height: 60px;
   text-decoration: underline;
   padding: 64px 0;
}

#section__cta .bnr a:hover {
   background-color: #fff;
   color: #000;
   opacity: 1;
}

@media screen and (max-width: 1680px) {
   #section__cta .bnr a {
      font-size: 19px;
   }
}

@media screen and (max-width: 991px) {
   #section__cta {
      padding: 0 20px;
   }

   #section__cta .map {
      padding: 120px 0 0;
   }
}

@media screen and (max-width: 767px) {
   #section__cta .map {
      height: 80vw;
      padding: 50px 0 0;
   }

   #section__cta .bnr {
      padding: 50px 0;
   }

   #section__cta .bnr a {
      font-size: 18px;
      padding: 14px 0;
   }
}

/* --- --- */
footer {
   background-color: #fff;
   font-weight: 500;
   font-size: 21px;
   letter-spacing: 0.02em;
   line-height: 30px;
   padding: 90px 70px 50px;
}

footer .wrap {
   display: flex;
   flex-wrap: wrap;
   gap: 0px;
   max-width: 100%;
}

footer .col:nth-child(1) {
   flex: auto;
}

footer .col:nth-child(2) {
   display: flex;
   flex-wrap: wrap;
   align-items: flex-end;
   gap: 90px;
}

footer .logo {
   font-size: 15px;
   padding-bottom: 10px;
}

footer .txt {
   padding-top: 5px;
   font-size: 15px;
   line-height: 1.8;
}

footer .nav {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row-reverse;
   gap: 25px;
}

footer .nav li {
   width: 21px;
}

footer .logo-img {
   width: 96px;
}

footer address {
   width: 100%;
   font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
   font-size: 13px;
   letter-spacing: 0.02em;
   line-height: 26px;
   text-align: center;
   margin-top: 30px;
}

@media screen and (max-width: 1680px) {
   footer {
      font-size: 17px;
   }
}

@media screen and (max-width: 991px) {
   footer {
      padding: 50px 20px;
   }

   footer .col:nth-child(2) {
      gap: 40px;
   }
}

@media screen and (max-width: 767px) {
   footer {
      font-size: 16px;
      padding: 50px 0 10px;
   }

   footer .wrap {
      display: block;
   }

   footer .col:nth-child(1) {
      width: 100%;
   }

   footer .col:nth-child(2) {
      width: 100%;
      gap: 40px;
      padding-top: 40px;
   }

   footer .logo-img {
      width: 60px;
   }

   footer address {
      text-align: center;
      margin-top: 0;
      padding-top: 50px;
   }
}

/*=============================================
 * Language Toggle
 *=============================================*/
/* PC: 日語 / 中文 inline */
.lang-toggle--pc {
   display: flex;
   align-items: center;
   position: fixed;
   top: 32px;
   right: 108px;
   z-index: 100;
   background: rgba(0,0,0,0.35);
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   padding: 5px 14px;
   border-radius: 20px;
}

.lang-toggle--sp {
   display: none;
}

.lang-toggle__btn {
   background: none;
   border: none;
   cursor: pointer;
   outline: none;
   font-size: 12px;
   font-weight: 400;
   color: rgba(255,255,255,0.55);
   letter-spacing: 0.03em;
   padding: 0;
   transition: color 0.2s ease;
}

.lang-toggle__btn:hover {
   color: rgba(255,255,255,0.9);
}

.lang-toggle__btn.active {
   color: #fff;
   font-weight: 600;
}

.lang-toggle__sep {
   color: rgba(255,255,255,0.35);
   font-size: 13px;
   margin: 0 6px;
   text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Mobile: single toggle button next to hamburger */
@media screen and (max-width: 991px) {
   .lang-toggle--pc {
      display: none;
   }

   .lang-toggle--sp {
      display: flex;
      align-items: center;
      justify-content: center;
      position: fixed;
      top: 0;
      left: 52px;
      right: auto;
      height: 46px;
      padding: 0 12px;
      background-color: #fff;
      border: none;
      cursor: pointer;
      outline: none;
      z-index: 1000;
      font-size: 12px;
      font-weight: 500;
      color: #333;
      letter-spacing: 0.05em;
   }

   .lang-toggle--sp:active {
      background-color: #f0f0f0;
   }

   body.navOpen .lang-toggle--sp {
      display: none !important;
   }
}