@charset "UTF-8";

.top-mv {
  animation: top-mv-in 1.4s ease-out 0.5s forwards;
  opacity: 0;
  filter: blur(30px);
}

.top-logo {
  animation: top-logo-in 0.8s cubic-bezier(0.16, 1, 0.3, 1) 1.75s forwards;
  opacity: 0;
  transform: scale(0.78);
  transform-origin: center;
}

.top-lead {
  animation: top-lead-in 0.55s ease-out 2.45s forwards;
  opacity: 0;
}

body.is-anime-ready .cut-2,
body.is-anime-ready .cut-3,
body.is-anime-ready .cut-4,
body.is-anime-ready .cut-5 {
  opacity: 0;
}

body.is-anime-ready .cut-2 .c-2,
body.is-anime-ready .cut-3 .c-3,
body.is-anime-ready .cut-4 .c-8,
body.is-anime-ready .cut-5 .c-9 {
  opacity: 0;
}

.cut-2.is-scroll-in,
.cut-3.is-scroll-in,
.cut-4.is-scroll-in,
.cut-5.is-scroll-in {
  animation: scroll-fadein-up 0.45s ease-out 0.08s forwards;
}

.cut-2.is-scroll-in .c-2,
.cut-3.is-scroll-in .c-3,
.cut-4.is-scroll-in .c-8,
.cut-5.is-scroll-in .c-9 {
  animation: scroll-fadein 0.35s ease-out 0.48s forwards;
}

@keyframes top-mv-in {
  0% {
    opacity: 0;
    filter: blur(16px);
  }

  100% {
    opacity: 1;
    filter: blur(0);
  }
}

@keyframes top-logo-in {
  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes top-lead-in {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes scroll-fadein-up {
  0% {
    transform: translateY(80px);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes scroll-fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .top-mv,
  .top-logo,
  .top-lead,
  .cut-2.is-scroll-in,
  .cut-3.is-scroll-in,
  .cut-4.is-scroll-in,
  .cut-5.is-scroll-in,
  .cut-2.is-scroll-in .c-2,
  .cut-3.is-scroll-in .c-3,
  .cut-4.is-scroll-in .c-8,
  .cut-5.is-scroll-in .c-9 {
    animation-duration: 0.01ms;
    animation-delay: 0s;
  }
}