@charset "utf-8";
/* animation */
/* mainvisual */
@media screen and (min-width: 751px) {}
@media (max-width: 750px) {}
@media screen {
  .swiper-slide-active .swiper-img.zoomUp, .swiper-slide-duplicate-active .swiper-img.zoomUp, .swiper-slide-prev .swiper-img.zoomUp {
    animation: zoomUp 6s linear 0s normal both;
  }
  .swiper-slide-active .swiper-img.zoomDown, .swiper-slide-duplicate-active .swiper-img.zoomDown, .swiper-slide-prev .swiper-img.zoomDown {
    animation: zoomDown 6s linear 0s normal both;
  }
  .swiper-slide-active .swiper-img.moveUp, .swiper-slide-duplicate-active .swiper-img.moveUp, .swiper-slide-prev .swiper-img.moveUp {
    animation: moveUp 6s linear 0s normal both;
  }
  .swiper-slide-active .swiper-img.moveDown, .swiper-slide-duplicate-active .swiper-img.moveDown, .swiper-slide-prev .swiper-img.moveDown {
    animation: moveDown 6s linear 0s normal both;
  }
  .swiper-slide-active .swiper-img.moveLeft, .swiper-slide-duplicate-active .swiper-img.moveLeft, .swiper-slide-prev .swiper-img.moveLeft {
    animation: moveLeft 5.5s linear 0s normal both;
  }
  .swiper-slide-active .swiper-img.moveRight, .swiper-slide-duplicate-active .swiper-img.moveRight, .swiper-slide-prev .swiper-img.moveRight {
    animation: moveRight 5.5s linear 0s normal both;
  }
  @keyframes zoomUp {
    0% {
      transform: scale(1);
    }
    100% {
      transform: scale(1.1);
    }
  }
  @keyframes zoomDown {
    0% {
      transform: scale(1.1);
    }
    100% {
      transform: scale(1);
    }
  }
  @keyframes moveUp {
    0% {
      transform: scale(1.1) translate(0%, 4.8%);
    }
    100% {
      transform: scale(1.1) translate(0%, -4.8%);
    }
  }
  @keyframes moveDown {
    0% {
      transform: scale(1.1) translate(0%, -4.8%);
    }
    100% {
      transform: scale(1.1) translate(0%, 4.8%);
    }
  }
  @keyframes moveLeft {
    0% {
      transform: scale(1.1) translate(4.8%, 0%);
    }
    100% {
      transform: scale(1.1) translate(-4.8%, 0%);
    }
  }
  @keyframes moveRight {
    0% {
      transform: scale(1.1) translate(-4.8%, 0%);
    }
    100% {
      transform: scale(1.1) translate(4.8%, 0%);
    }
  }
  /*   kvTitleL  */
  #name .title.moveL span {
    opacity: 0;
    transform: translateX(-30vw)
  }
  #name .title.moveL span.move {
    opacity: 1;
    transform: translateX(0);
    transition-duration: 400ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;
  }

 #name .title.moveL span:nth-child(10).move {
    transition-delay: 300ms !important
  }
#name .title.moveL span:nth-child(9).move {
    transition-delay: 400ms !important
  }
 #name .title.moveL span:nth-child(8).move {
    transition-delay: 500ms !important
  }
#name .title.moveL span:nth-child(7).move {
    transition-delay: 600ms !important
  }
#name .title.moveL span:nth-child(6).move {
    transition-delay: 700ms !important
  }
#name .title.moveL span:nth-child(5).move {
    transition-delay: 800ms !important
  }
#name .title.moveL span:nth-child(4).move {
    transition-delay: 900ms !important
  }
#name .title.moveL span:nth-child(3).move {
    transition-delay: 1000ms !important
  }
#name .title.moveL span:nth-child(2).move {
    transition-delay: 1100ms !important
  }
#name .title.moveL span:nth-child(1).move {
    transition-delay: 1200ms !important
  }
    
#name .title.moveL span.move.moveout {
     opacity: 0;
    transform: translateX(20vw);
    transition-duration: 400ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;
  }
#name .title.moveL span:nth-child(10).moveout {
    transition-delay: 300ms !important 
  }
#name .title.moveL span:nth-child(9).moveout {
    transition-delay: 400ms !important
  }
#name .title.moveL span:nth-child(8).moveout {
    transition-delay: 500ms !important
  }
#name .title.moveL span:nth-child(7).moveout {
    transition-delay: 600ms !important
  }
#name .title.moveL span:nth-child(6).moveout {
    transition-delay: 700ms !important
  }
#name .title.moveL span:nth-child(5).moveout {
    transition-delay: 800ms !important
  }
#name .title.moveL span:nth-child(4).moveout {
    transition-delay: 900ms !important
  }
#name .title.moveL span:nth-child(3).moveout {
    transition-delay: 1000ms !important
  }
#name .title.moveL span:nth-child(2).moveout {
    transition-delay: 1100ms !important
  }
#name .title.moveL span:nth-child(1).moveout {
    transition-delay: 1200ms !important
  }
  /*   kvTitle  */
#name .title.moveR span {
    opacity: 0;
    transform: translateX(20vw)
  }
#name .title.moveR span.move {
    opacity: 1;
    transform: translateX(0);
    transition-duration: 400ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;
  }
#name .title.moveR span:nth-child(1).move {
    transition-delay: 300ms !important
  }
#name .title.moveR span:nth-child(2).move {
    transition-delay: 400ms !important
  }
#name .title.moveR span:nth-child(3).move {
    transition-delay: 500ms !important
  }
#name .title.moveR span:nth-child(4).move {
    transition-delay: 600ms !important
  }
#name .title.moveR span:nth-child(5).move {
    transition-delay: 700ms !important
  }
#name .title.moveR span:nth-child(6).move {
    transition-delay: 800ms !important
  }
#name .title.moveR span:nth-child(7).move {
    transition-delay: 900ms !important
  }
#name .title.moveR span:nth-child(8).move {
    transition-delay: 1000ms !important
  }
#name .title.moveR span:nth-child(9).move {
    transition-delay: 1100ms !important
  }
#name .title.moveR span:nth-child(10).move {
    transition-delay: 1200ms !important
  }
#name .title.moveR span.moveout {
    opacity: 0;
    transform: translateX(-20vw);
    transition-duration: 400ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;
  }
#name .title.moveR span:nth-child(1).moveout {
    transition-delay: 300ms !important
  }
#name .title.moveR span:nth-child(2).moveout {
    transition-delay: 400ms !important
  }
#name .title.moveR span:nth-child(3).moveout {
    transition-delay: 500ms !important
  }
  #name .title.moveR span:nth-child(4).moveout {
    transition-delay: 600ms !important
  }
#name .title.moveR span:nth-child(5).moveout {
    transition-delay: 700ms !important
  }
#name .title.moveR span:nth-child(6).moveout {
    transition-delay: 800ms !important
  }
#name .title.moveR span:nth-child(7).moveout {
    transition-delay: 900ms !important
  }
#name .title.moveR span:nth-child(8).moveout {
    transition-delay: 1000ms !important
  }
#name .title.moveR span:nth-child(9).moveout {
    transition-delay: 1100ms !important
  }
#name .title.moveR span:nth-child(10).moveout {
    transition-delay: 1200ms !important
  }
}