/* ========================================
   Lenis Smooth Scroll Styles
   ======================================== */

/* wrapperのposition: fixedを解除してスクロール可能に */

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip;
}

.lenis [data-lenis-prevent],
.lenis [data-lenis-prevent-wheel],
.lenis [data-lenis-prevent-touch] {
  overscroll-behavior: contain;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

.lenis.lenis-autoToggle {
  transition-property: overflow;
  transition-duration: 1ms;
  transition-behavior: allow-discrete;
}

/* ========================================
   Custom Styles
   ======================================== */

/* Main Container */
/* main {
  background-color: #f5f5f4;
} */

/* Hero Section */
.mv {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* background-color: #1c1917;  */
  color: white;
  margin-bottom: 0px;
  overflow: hidden;
}

.mv .mv-text {
  transition: 1s;
}
.mv.-scrm .mv-text {
  transform: translateY(-130px);
}
@media screen and (max-width: 767px) {
  .mv.-scrm .mv-text {
  transform: translateY(0);
}

}

.mv-image {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.mv-image picture {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Scene Sections */
.scene-section {
  overflow: hidden;
}

.parallax {
  position: sticky;
  top: 0;
  height: 100vh;
}

.scene-overlap {
  margin-top: -800px;
  margin-bottom: 1300px;
  z-index: 0;
}

.scene-z-high {
  z-index: 8;
}

.parallax .image-box {
  position: absolute;
  inset: 0;
  z-index: 0;
}

#concept {
  position: relative;
  z-index: 8;
}

/* #concept.scene-section .scene-bg {
  background-color: #1f2533;
} */

#parallax01,
#parallax02 {
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 5;
  clip-path: inset(100% 0 0 0);
}

#position {
  position: relative;
  z-index: 8;
}

/* #position.scene-section .scene-bg {
  background-color: #777;
} */
.parallax-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#position {
  margin-bottom: 100dvh;
}

#invitation {
  position: relative;
  z-index: 8;
}
.scene-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.2);
}

/* Scene Sections */
.scene-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
}

.scene-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

#concept,
#position {
  position: relative;
  z-index: 8;
}
#position {
  margin-bottom: 100dvh;
}
.parallax {
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 5;
  clip-path: inset(100% 0 0 0);
}
