body:has(#story_251113_01) {
  height: 800dvh;
  overflow: hidden;
}

html:has(#story_251113_01).menu-open,
body:has(#story_251113_01).menu-open {
  touch-action: none;
}

#story_251113_01 {
  position: relative;
}

#story_251113_01 .cmn-heading-l3 {
  background: none;
  height: 100%;
}

#story_251113_01 .cmn-heading-l3::after {
  display: none;
}

#story_251113_01 #fixed-movie {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 0;
}

#story_251113_01 #fixed-movie .video-wrap {
  background: #000;
}

#story_251113_01 #fixed-movie video {
  opacity: 0.5;
  width: 100%;
  height: 100dvh;
  object-fit: cover;
  object-position: 50% 50%;
}

#story_251113_01 #fixed-bg {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  z-index: 0;
  transition: all 0.3s;
}

#story_251113_01 #fixed-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#story_251113_01 .sec7-wrapper {
  width: 100%;
  height: 100%;
}

#story_251113_01 .section {
  height: 100dvh;
  transform-origin: center center;
  transform: scale(0.8);
  will-change: transform;
  position: relative;
  z-index: 1;
}

#story_251113_01 .section .bg {
  position: absolute;
  inset: 0;
}

#story_251113_01 .section .bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#story_251113_01 .section .content:not(:has(.split)) {
  opacity: 0;
  position: absolute;
  left: 4vw;
  bottom: 7.3333333333vw;
  width: 92vw;
}

#story_251113_01 .section .content:has(.split) {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max-content;
  text-align: center;
}

#story_251113_01 .section .content:has(.logo) {
  opacity: 0;
  position: absolute;
  top: 20%;
  left: 50% !important;
  bottom: auto !important;
  transform: translate(-50%, -50%);
  width: auto !important;
}

#story_251113_01 .section .content:has(.logo) .logo {
  width: 62.6666666667vw;
  filter: drop-shadow(1.6vw 1.6vw 2.6666666667vw rgba(var(--color-font-rgb), 0.25));
}

#story_251113_01 .section .text {
  position: relative;
  color: var(--color-purple);
  line-height: 2;
  font-weight: 900;
  font-size: 6.4vw;
}

#story_251113_01 .section .text.stroke {
  position: absolute;
  top: 0;
  left: 0;
  paint-order: stroke;
  -webkit-text-stroke: 1.3333333333vw var(--color-white);
  text-stroke: 1.3333333333vw var(--color-white);
  color: transparent;
  filter: blur(0.1333333333vw);
}

#story_251113_01 .section .content:has(.split) .text {
  paint-order: stroke;
  -webkit-text-stroke: 1.3333333333vw var(--color-white);
  text-stroke: 1.3333333333vw var(--color-white);
}

#story_251113_01 .section .text:not(.stroke) {
  z-index: 2;
}

#story_251113_01 #sec1 {
  transform: scale(1) !important;
}

#story_251113_01 #sec1 .content {
  opacity: 1 !important;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#story_251113_01 #sec8 {
  transform: scale(1) !important;
}

#story_251113_01 #sec8-1,
#story_251113_01 #sec8-2 {
  height: 100dvh;
  position: relative;
}

#story_251113_01 #freeScroll {
  height: 100%;
  overflow: auto;
}

#story_251113_01 .dot-nav {
  filter: drop-shadow(0 0 6px rgba(var(--color-font-rgb), 0.5));
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  flex-direction: column;
  z-index: 100;
  right: 4vw;
  gap: 2.6666666667vw;
  display: none;
}

#story_251113_01 .dot-nav button {
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  mask: url(../img/common/ic_pagination.svg) no-repeat;
  mask-size: 100% auto;
  background: var(--color-white);
  transition: background 0.3s;
  width: 4vw;
}

#story_251113_01 .dot-nav button:nth-child(9),
#story_251113_01 .dot-nav button:nth-child(10) {
  display: none !important;
}

#story_251113_01 .dot-nav button.active {
  background: var(--color-light-purple);
}

#story_251113_01 .split_letter {
  display: inline-block;
}

#story_251113_01 .sec-button {
  padding-bottom: 16vw;
}

#story_251113_01 #footer {
  position: relative;
  z-index: 1;
  padding-top: 16vw;
}

@media screen and (min-width: 768px) {
  #story_251113_01 #fixed-movie video {
    min-height: 768px;
  }

  #story_251113_01 .section .content:not(:has(.split)) {
    left: min(80px, min( calc(80 / 1280 * 100vw)));
    bottom: min(80px, min( calc(80 / 1280 * 100vw)));
    width: auto;
  }

  #story_251113_01 .section .content:has(.logo) {
    top: 35%;
  }

  #story_251113_01 .section .content:has(.logo) .logo {
    width: min(330px, min( calc(330 / 1280 * 100vw)));
    filter: drop-shadow(min(6px, min(calc(6 / 768 * 100vh), calc(6 / 1440 * 100vw))) min(6px, min(calc(6 / 768 * 100vh), calc(6 / 1440 * 100vw))) min(10px, min(calc(10 / 768 * 100vh), calc(10 / 1440 * 100vw))) rgba(var(--color-font-rgb), 0.25));
  }

  #story_251113_01 .section .text {
    font-size: min(32px, min( calc(32 / 1280 * 100vw)));
  }

  #story_251113_01 .section .text.stroke {
    -webkit-text-stroke: min(6px, min( calc(6 / 1280 * 100vw))) var(--color-white);
    text-stroke: min(6px, min( calc(6 / 1280 * 100vw))) var(--color-white);
    filter: blur(min(1px, min( calc(1 / 1280 * 100vw))));
  }

  #story_251113_01 .section .content:has(.split) .text {
    -webkit-text-stroke: min(6px, min( calc(6 / 1280 * 100vw))) var(--color-white);
    text-stroke: min(6px, min( calc(6 / 1280 * 100vw))) var(--color-white);
  }

  #story_251113_01 .dot-nav {
    display: flex;
    right: 20px;
    gap: 10px;
  }

  #story_251113_01 .dot-nav button {
    width: 20px;
  }

  #story_251113_01 .sec-button {
    padding-bottom: 80px;
  }

  #story_251113_01 #footer {
    background-position: center bottom;
    background-size: 158px auto;
    padding-top: 80px;
  }
}

@media screen and (min-width: 768px) and (hover: hover) {
  #story_251113_01 .dot-nav button:hover {
    background: var(--color-light-purple);
  }
}

@media screen and (min-width: 768px) and (-ms-high-contrast: active), screen and (min-width: 768px) and (-ms-high-contrast: none) {
  #story_251113_01 .dot-nav button:hover {
    background: var(--color-light-purple);
  }
}