@charset "utf-8";

.header__content__logo {
  display: none;
}



.mv {
  position: relative;
  z-index: 1;
  height: 100lvh;
}
.mv__opening {
  position: absolute;
  z-index: 100;
  inset: 0;
  grid-template-columns: 10% minmax(0, auto) 10%;
  grid-template-rows: 27.5% minmax(0, auto) 27.5%;
  place-items: center;
  background: #efefef;
  overflow: hidden;
}
.mv__opening__list {
  grid-column: 2;
  grid-row: 2;
  aspect-ratio: 280 / 342;
  /* max-width: calc((280 / 1920) * (var(--window-half-width) * 2)); */
  max-height: 100%;
  grid-template-columns: minmax(0, auto);
  overflow: hidden;
  opacity: 0;
}
.mv__opening__list__item {
  grid-column: 1;
  grid-row: 1;
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.mv__opening__list__item img {
  height: 100%;
  object-fit: cover;
}
.mv__slide {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}
/* .mv__slide__list {
}
.mv__slide__list__item {
} */
.mv__slide__list__item__photo {
  position: relative;
  z-index: 1;
  height: 100%;
  background: #333;
  overflow: hidden;
}
.mv__slide__list__item__photo::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  background: #000;
  opacity: .3;
}
.mv__slide__list__item__photo img {
  position: relative;
  z-index: 1;
  height: 100%;
  object-fit: cover;
}
.mv__slide--active .mv__slide__list__item.swiper-slide-active .mv__slide__list__item__photo img,
.mv__slide--active .mv__slide__list__item.swiper-slide-duplicate-active .mv__slide__list__item__photo img,
.mv__slide--active .mv__slide__list__item.swiper-slide-prev .mv__slide__list__item__photo img {
  animation: mvSlideZoom 8.25s linear forwards;
}
@keyframes mvSlideZoom {
  0% {
    scale: 1;
  }
  100% {
    scale: 1.05;
  }
}
.mv__slide__list__item__photo .p-caption {
  z-index: 3;
}
.mv__logo {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  margin-left: calc(80 / 1920 * 100%);
  margin-bottom: calc(70 / 1920 * 100%);
  width: calc(900 / 1920 * 100%);
  max-height: 70lvh;
  aspect-ratio: 117 / 80;
  opacity: .8;
  pointer-events: none;
}
.mv__logo img {
  height: 100%;
  object-fit: contain;
  object-position: bottom left;
}
.mv__scroll {
  position: absolute;
  z-index: 2;
  bottom: 0;
  right: 0;
  margin-right: 32px;
  margin-bottom: 60px;
  grid-template-columns: auto;
  justify-content: end;
  justify-items: center;
  align-items: end;
  gap: 20px 0;
}
.mv__scroll__copy {
  width: 9px;
  height: 53px;
  font-size: 0;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9.09" height="53.16" viewBox="0 0 9.09 53.16"><path d="M3.03,1.1c-.49.03-.88.14-1.19.33-.57.37-.86,1.03-.86,1.97,0,.42.06.81.19,1.15.24.67.68,1,1.3,1,.47,0,.8-.14,1-.43.2-.29.37-.74.51-1.35l.26-1.13c.17-.74.36-1.26.57-1.57.36-.53.9-.79,1.61-.79.77,0,1.41.26,1.9.78s.74,1.26.74,2.21c0,.88-.22,1.62-.65,2.24-.44.61-1.13.92-2.09.92v-1.1c.46-.06.81-.18,1.06-.36.45-.34.67-.92.67-1.74,0-.66-.14-1.13-.43-1.42-.29-.29-.62-.43-1.01-.43-.42,0-.73.17-.93.51-.12.22-.28.73-.47,1.52l-.28,1.17c-.13.56-.31,1-.54,1.31-.4.53-.99.79-1.75.79-.95,0-1.63-.34-2.04-1.01-.41-.68-.62-1.46-.62-2.36C0,2.28.27,1.46.82.87,1.36.28,2.1-.01,3.03,0v1.1Z" fill="%23fff"/><path d="M8.23,15.63c-.57.59-1.23.92-1.96.99v-1.14c.55-.13.99-.38,1.32-.76.32-.38.49-.91.49-1.59,0-.83-.3-1.5-.89-2.02-.6-.51-1.51-.77-2.74-.77-1.01,0-1.83.23-2.45.69-.63.46-.94,1.15-.94,2.07,0,.84.33,1.49.99,1.93.35.23.8.41,1.37.52v1.14c-.91-.1-1.67-.43-2.28-1C.39,15.03.02,14.12.02,12.97c0-.99.3-1.82.91-2.49.8-.88,2.04-1.33,3.71-1.33,1.27,0,2.31.33,3.12,1,.88.72,1.33,1.71,1.33,2.97,0,1.08-.29,1.91-.86,2.51Z" fill="%23fff"/><path d="M8.86,19.54v3.91c0,.64-.1,1.18-.29,1.59-.37.79-1.04,1.19-2.03,1.19-.52,0-.94-.11-1.27-.32s-.59-.51-.79-.89c-.14.34-.32.59-.54.76s-.58.26-1.08.28l-1.15.04c-.33.01-.57.04-.73.08-.27.07-.45.2-.53.38h-.19v-1.43c.07-.04.17-.07.29-.09s.34-.04.68-.06l1.44-.07c.56-.03.94-.23,1.13-.61.11-.22.16-.56.16-1.02v-2.58H.25v-1.17h8.61ZM4.92,23.33c0,.53.11.95.33,1.26.22.31.61.46,1.18.46.61,0,1.03-.22,1.25-.65.12-.23.18-.54.18-.93v-2.77h-2.94v2.62Z" fill="%23fff"/><path d="M7.63,36.36c-.76.57-1.74.86-2.92.86-1.29,0-2.35-.33-3.21-.98-1-.77-1.5-1.86-1.5-3.28,0-1.32.44-2.37,1.31-3.12.84-.68,1.91-1.01,3.2-1.01,1.16,0,2.16.29,2.99.87,1.06.74,1.59,1.84,1.59,3.29s-.49,2.64-1.46,3.38ZM2.14,35.33c.74.46,1.58.69,2.54.69,1.01,0,1.83-.26,2.45-.79.62-.53.93-1.25.93-2.17s-.31-1.62-.92-2.18c-.61-.56-1.51-.84-2.71-.84-.95,0-1.76.24-2.41.72-.66.48-.98,1.26-.98,2.35s.37,1.77,1.11,2.23Z" fill="%23fff"/><path d="M8.86,39.8v1.17H1.28v4.32H.25v-5.48h8.61Z" fill="%23fff"/><path d="M8.86,47.68v1.17H1.28v4.32H.25v-5.48h8.61Z" fill="%23fff"/></svg>') no-repeat center/100% auto;
}
.mv__scroll__line {
  position: relative;
  z-index: 1;
  width: 1px;
  height: 150px;
  background: rgba(var(--color-white), .6);
  overflow: hidden;
}
.mv__scroll__line::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(34 / 150 * 100%);
  background: #fff;
  animation: mvScrollLine 1.8s ease-in-out infinite;
}
@keyframes mvScrollLine {
  0% {
    translate: 0 0;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    translate: 0 116px;
    opacity: 0;
  }
}
@media screen and (max-width: 767px){
  .mv__opening {
    grid-template-columns: 15% minmax(0, auto) 15%;
    grid-template-rows: 30% minmax(0, auto) 30%;
  }
  .mv__logo {
    margin-left: calc(30 / 380 * 100%);
    margin-bottom: calc((30 / 380 * 100%) + (100lvh - 100svh));
    width: calc(180 / 380 * 100%);
  }
  .mv__scroll {
    margin-right: 30px;
    margin-bottom: calc((30 / 380 * 100%) + (100lvh - 100svh));
  }
  .mv__scroll__line {
    height: 100px;
  }
  .mv__scroll__line::after {
    height: calc(34 / 100 * 100%);
  }
  @keyframes mvScrollLine {
    0% {
      translate: 0 0;
      opacity: 0;
    }
    20% {
      opacity: 1;
    }
    80% {
      opacity: 1;
    }
    100% {
      translate: 0 66px;
      opacity: 0;
    }
  }
}



.intro {
  padding-top: calc(180 / 1920 * 100%);
}
.intro__content {
  grid-template-columns: calc(300 / 1920 * 100%) minmax(0, 1fr) 50px calc(387 / 1920 * 100%) calc(200 / 1920 * 100%);
  align-items: center;
}
.intro__content__desc {
  grid-column: 2;
}
.intro__content__desc__heading {
  font-size: clamp(20px, calc(30 / 1200 * 100vw), 30px);
  line-height: 2;
}
.intro__content__desc__copy {
  font-size: clamp(12px, calc(16 / 1200 * 100vw), 16px);
  line-height: 2.5;
  --margin-top: 40px;
}
.intro__content__logo {
  grid-column: 4;
  width: 100%;
}
.intro__gallery {
  position: relative;
  z-index: 1;
  height: calc(100lvh - ((180 / 1920) * (var(--window-half-width) * 2)));
  margin-top: calc(180 / 1920 * 100%);
  box-sizing: border-box;
  padding-bottom: calc(140 / 1920 * 100%);
  /* grid-template-columns: calc(160 / 1920 * 100%) max-content calc(160 / 1920 * 100%); */
  grid-template-columns: 40% max-content 40%;
  grid-template-rows: 100%;
  align-items: stretch;
  background: linear-gradient(0deg, rgba(var(--color-gold), .1), rgba(var(--color-gold), .1)) no-repeat bottom left/100% calc(550 / 760 * 100%);
  overflow: hidden;
}
.intro__gallery__list {
  grid-column: 2;
  height: 100%;
  gap: 0 calc((160 / 1920) * (var(--window-half-width) * 2));
}
.intro__gallery__list__item {
  flex: 0 0 auto;
  height: calc(510 / 620 * 100%);
}
.intro__gallery__list__item:nth-child(even) {
  align-self: flex-end;
}
.intro__gallery__list__item img {
  width: auto;
  height: 100%;
}
.intro__gallery__status {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(0deg, rgba(var(--color-gold), .4), rgba(var(--color-gold), .4)) no-repeat center/100% 100% #fff;
  overflow: hidden;
}
.intro__gallery__status__fill {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 10px;
  height: 100%;
  background: rgb(var(--color-gold));
}
@media screen and (min-width: 768px) and (max-width: 1400px) {
  .intro__content {
    grid-template-columns: 2.5% minmax(0, 1fr) 50px 27% 2.5%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .intro__gallery {
    height: calc(100lvh - 20lvh);
    margin-top: 20lvh;
    padding-bottom: 20lvh;
  }
  .intro__gallery__list {
    gap: 0 20lvh;
  }
}
@media screen and (max-width: 767px){
  .intro {
    padding-top: 100px;
  }
  .intro__content {
    grid-template-columns: calc(30 / 380 * 100%) minmax(0, 1fr) calc(30 / 380 * 100%);
    align-items: start;
  }
  .intro__content__desc {
    grid-row: 1;
  }
  .intro__content__desc__heading {
    font-size: 21px;
    line-height: 2.095238095;
  }
  .intro__content__desc__copy {
    font-size: 14px;
    line-height: 2.428571429;
    --margin-top: 30px;
  }
  .intro__content__logo {
    grid-column: 2;
    grid-row: 1;
    width: calc(130 / 320 * 100%);
    align-self: end;
    margin-left: auto;
    translate: 0 50%;
  }
  .intro__gallery {
    height: calc(100lvh - 80px);
    margin-top: 80px;
    padding-bottom: 70px;
    grid-template-rows: calc((234 / 380) * (var(--window-half-width) * 2));
    align-content: center;
    /* background-size: 100% calc(202 / 304 * 100%); */
    background-size: 100% 60%;
  }
  .intro__gallery__list {
    gap: 0 calc((50 / 380) * (var(--window-half-width) * 2));
  }
  .intro__gallery__list__item {
    height: calc(204 / 234 * 100%);
  }
  .intro__gallery__status {
    height: 3px;
  }
}