/*-------- swiper ---------*/
.swiper-container-mv .swiper-slide-active .slide-img,
.swiper-container-mv .swiper-slide-duplicate-active .slide-img,
.swiper-container-mv .swiper-slide-prev .slide-img{
  animation: fadezoom 15s 0s forwards;
}
@keyframes fadezoom {
  0% {
      transform: scale(1);
  }
  100% {
      transform: scale(1.1);  // 拡大率はお好きなように
  }
}


/*--------　文字アニメーション　---------*/
.main-visual__copy .mv_bg1,
.main-visual__copy .mv_bg2{
  animation:fadeIn 0.1s 0.5s; 
  animation-fill-mode: both;
}
.main-visual__copy .mv_bg1:after,
.main-visual__copy .mv_bg2:after{  
  animation: secondaryImageOverlayIn 0s 0s cubic-bezier(.77,0,.175,1),
             secondaryImageOverlayOut 15s 0.6s infinite cubic-bezier(.77,0,.175,1);
  animation-fill-mode:both;
}
.main-visual__copy .mv_bg2:after{  
    animation-delay: 7.5s;
}
/*keyframesの設定*/
/*文字が消えている状態から現れるアニメーション*/
@keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
/*はじめにブロックを伸ばすアニメーション*/
@keyframes secondaryImageOverlayIn {
    0% {
      width: 0;
    }
    100% {
      width:  100%;
    }
  }
/*のび太ブロックを横に追いやるアニメーション*/
  @keyframes secondaryImageOverlayOut {
    0% {
      transform: translateY(0);
    }
    10%{
      transform: translateY(102%);

    }
    100% {
      transform: translateY(102%);
    }
  }


@media (max-width: 754px) {
  @keyframes secondaryImageOverlayOut {
    0% {
      transform: translateX(0);
    }
    10%{
      transform: translateX(102%);
    }
    100% {
      transform: translateX(102%);
    }
  }
}