.teaser p.logo {
  width: 14.87vw;
  aspect-ratio: 1/1;
  position: fixed;
  top: 5.38vw;
  left: 5.13vw;
  z-index: 5;
}
.teaser p.logo a {
  display: block;
}
.teaser .c-scrolldown {
  display: none;
}
.teaser img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.teaser .col_movie {
  width: 100%;
  margin-inline: auto;
  height: 100dvh;
  position: relative;
  margin-inline: auto;
}
.teaser .col_movie .c-kv_video {
  width: 100%;
  aspect-ratio: 1/1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.teaser .c-kv_text {
  width: 100%;
  padding-bottom: 26.15vw;
}
.teaser .c-kv_text h1, .teaser .c-kv_text p {
  font-weight: 800;
  text-align: center;
}
.teaser .c-kv_text h1 {
  font-size: var(--fs-28-42);
}
.teaser .c-kv_text p {
  font-size: var(--fs-15-26);
  margin-top: 6.15vw;
}
.teaser .c-links {
  padding: 16.41vw 0;
}
.teaser .c-links ul {
  width: 84.615%;
  margin-inline: auto;
  display: flex;
  flex-flow: column;
  row-gap: 16.41vw;
}
.teaser .c-links ul li {
  width: 100%;
}
.teaser .c-links ul li a {
  display: block;
}
.teaser .c-links ul li figure {
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.4);
}
.teaser .c-links ul li p {
  line-height: 1.5;
  text-align: center;
  font-weight: 800;
  white-space: nowrap;
  margin-bottom: 3.85vw;
  font-size: var(--fs-15-31);
}
.teaser .b-logo {
  width: 100%;
  height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.teaser .b-logo .logo_inner {
  width: 45.13vw;
}
.teaser .b-logo .copy {
  position: absolute;
  bottom: 20px;
}
.teaser .b-logo .copy p {
  font-size: var(--fs-copy);
  font-weight: 800;
}
.teaser .copy {
  padding: 16.41vw 0;
  text-align: center;
}
.teaser .copy p {
  font-size: var(--fs-copy);
  font-weight: 800;
}
.teaser .active .col_movie {
  width: 84.615%;
  height: 82.05vw;
  transition: width 1s ease 0s, height 1s ease 0s;
}

.c-kv_video {
  width: 100%;
  aspect-ratio: 1/1;
  position: relative;
}
.c-kv_video video {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}

@media all and (min-width: 768px) {
  .teaser .c-kv_text p br.c-sp {
    display: none;
  }
}
@media all and (min-width: 864px) {
  .teaser p.logo {
    width: min(4.74vw, 91px);
    top: min(1.67vw, 32px);
    left: min(3.02vw, 58px);
  }
  .teaser p.logo a {
    display: block;
  }
  .teaser .s-inner {
    width: 94.59%;
    max-width: 1816px;
    margin-inline: auto;
    position: relative;
  }
  .teaser .cols {
    display: flex;
    justify-content: flex-end;
    column-gap: min(2.08vw, 40px);
    position: relative;
    width: 100%;
  }
  .teaser .cols .col_movie {
    width: 100%;
    height: 100vh;
    margin: 0;
    position: absolute;
    top: 0px;
    left: 0px;
    display: flex;
    justify-content: center;
  }
  .teaser .cols .col_movie .c-kv_video {
    width: min(45.94vw, 882px);
    height: min(45.94vw, 882px);
  }
  .teaser .cols .col_r {
    width: 48.56%;
  }
  .teaser .cols .c-scrolldown {
    width: min(5.42vw, 104px);
    aspect-ratio: 1/1;
    display: block;
    position: absolute;
    right: 0px;
    top: calc(100vh - min(2.71vw, 52px) - min(5.42vw, 104px));
    background: var(--color-white);
    border-radius: 100vmax;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .teaser .cols .c-scrolldown span.c-icon {
    width: min(1.04vw, 20px);
    aspect-ratio: 12/21;
    position: relative;
  }
  .teaser .cols .c-scrolldown span.c-icon svg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    fill: var(--color-black);
  }
  .teaser .c-kv_text {
    width: 100%;
    padding-bottom: 0;
    height: 100vh;
    display: flex;
    align-items: center;
  }
  .teaser .c-kv_text h1, .teaser .c-kv_text p {
    text-align: left;
  }
  .teaser .c-kv_text p {
    margin-top: min(2.08vw, 40px);
  }
  .teaser .c-kv_text p br.c-sp {
    display: none;
  }
  .teaser .c-links {
    padding-bottom: 0px;
    padding-bottom: min(9.9vw, 190px);
  }
  .teaser .c-links ul {
    width: 82.31%;
    margin: 0;
    row-gap: min(5.31vw, 102px);
  }
  .teaser .c-links ul li figure {
    border-radius: min(0.31vw, 6px);
  }
  .teaser .c-links ul li p {
    margin-bottom: min(1.25vw, 24px);
    text-align: left;
  }
  .teaser .b-logo {
    min-height: 640px;
  }
  .teaser .b-logo .logo_inner {
    width: min(14.64vw, 281px);
  }
  .teaser .copy {
    width: 100%;
    padding: min(4.95vw, 95px) 0 min(4.06vw, 78px) 0;
    display: flex;
    justify-content: flex-end;
    text-align: right;
    position: absolute;
    bottom: 0px;
  }
  .teaser .copy .copy_inner {
    width: 48.57%;
  }
  .teaser .copy p {
    width: 82.31%;
    text-align: right;
  }
  .teaser .active .col_movie {
    width: 49.22%;
    transition: width 1.5s var(--easing) 0s, height 1.5s var(--easing) 0s;
    margin-inline: 0;
  }
  .teaser .active.stable .cols {
    justify-content: flex-start;
  }
  .teaser .active.stable .col_movie {
    position: sticky;
    bottom: 0px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  .teaser .active.stable .col_movie .c-kv_video {
    width: 100%;
    aspect-ratio: 1/1;
    height: auto;
    position: relative;
    top: 0px;
    transform: revert;
    left: auto;
  }
}
p.logo {
  transition: opacity 0.4s ease 0s, transform 0.4s ease 0s;
  transform: translate3d(10px, 0, 0);
  opacity: 0;
}

:has(#kv.stable) p.logo {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

#kv .c-kv_text h1 span {
  transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  display: inline-block;
}
#kv .c-kv_text p span {
  transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  display: inline-block;
}
#kv.stable .c-kv_text h1 span {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
#kv.stable .c-kv_text h1 span:nth-of-type(1) {
  transition-delay: 0.1s;
}
#kv.stable .c-kv_text h1 span:nth-of-type(2) {
  transition-delay: 0.2s;
}
#kv.stable .c-kv_text p span {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
#kv.stable .c-kv_text p:nth-of-type(1) span:nth-of-type(1) {
  transition-delay: 0.2s;
}
#kv.stable .c-kv_text p:nth-of-type(1) span:nth-of-type(2) {
  transition-delay: 0.3s;
}
#kv.stable .c-kv_text p:nth-of-type(1) span:nth-of-type(3) {
  transition-delay: 0.4s;
}
#kv.stable .c-kv_text p:nth-of-type(1) span:nth-of-type(4) {
  transition-delay: 0.5s;
}
#kv.stable .c-kv_text p:nth-of-type(2) span:nth-of-type(1) {
  transition-delay: 0.5s;
}
#kv.stable .c-kv_text p:nth-of-type(2) span:nth-of-type(2) {
  transition-delay: 0.6s;
}
#kv.stable .c-kv_text p:nth-of-type(2) span:nth-of-type(3) {
  transition-delay: 0.7s;
}
#kv.stable .c-kv_text p:nth-of-type(2) span:nth-of-type(4) {
  transition-delay: 0.8s;
}
#kv .c-links ul li {
  transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
  opacity: 0;
  transform: translate3d(0, 40px, 0);
}
#kv .c-links ul.animate li {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
#kv .c-links ul.animate li:nth-child(1) {
  transition-delay: 0s;
}
#kv .c-links ul.animate li:nth-child(2) {
  transition-delay: 0.1s;
}
#kv .c-links ul.animate li:nth-child(3) {
  transition-delay: 0.2s;
}
#kv .c-links ul.animate li:nth-child(4) {
  transition-delay: 0.3s;
}
#kv .b-logo h2 {
  scale: 0.9;
  opacity: 0;
  transition: scale 0.6s var(--ease-bounce) 0s, opacity 0.5s ease 0s;
}
#kv .b-logo h2.animate {
  opacity: 1;
  scale: 1;
}

@media all and (min-width: 864px) {
  #kv .c-kv_text h1 span {
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    display: inline-block;
  }
  #kv .c-kv_text p span {
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    display: inline-block;
  }
  #kv .c-scrolldown {
    transition: opacity 0.3s ease;
    opacity: 0;
  }
  #kv.stable .c-kv_text h1 span {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  #kv.stable .c-kv_text h1 span:nth-of-type(1) {
    transition-delay: 0s;
  }
  #kv.stable .c-kv_text h1 span:nth-of-type(2) {
    transition-delay: 0.1s;
  }
  #kv.stable .c-kv_text p span {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  #kv.stable .c-kv_text p:nth-of-type(1) span.s0 {
    transition-delay: 0.2s;
  }
  #kv.stable .c-kv_text p:nth-of-type(1) span.s1 {
    transition-delay: 0.3s;
  }
  #kv.stable .c-kv_text p:nth-of-type(1) span.s2 {
    transition-delay: 0.4s;
  }
  #kv.stable .c-kv_text p:nth-of-type(1) span.s3 {
    transition-delay: 0.5s;
  }
  #kv.stable .c-kv_text p:nth-of-type(2) span.s0 {
    transition-delay: 0.5s;
  }
  #kv.stable .c-kv_text p:nth-of-type(2) span.s1 {
    transition-delay: 0.6s;
  }
  #kv.stable .c-kv_text p:nth-of-type(2) span.s2 {
    transition-delay: 0.7s;
  }
  #kv.stable .c-kv_text p:nth-of-type(2) span.s3 {
    transition-delay: 0.8s;
  }
  #kv.stable .c-scrolldown {
    opacity: 1;
    pointer-events: auto;
  }
}
@media (any-hover: hover) {
  .c-links ul li a {
    transition: opacity 0.15s linear;
  }
  .c-links ul li a:hover {
    opacity: 0.6;
  }
}