@charset "utf-8";
  /* スクロールをしたら出現する要素にはじめに透過0を指定　*/
   
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger{
    opacity: 0;
}

/* その場で */
.fadeIn{
    animation-name:fadeInAnime;
    animation-duration:1s;
    animation-fill-mode:forwards;
    opacity:0;
}
  
@keyframes fadeInAnime{
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
}
  
  /* 下から */
.fadeUp {
    animation-name: fadeUpAnime;
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity: 0;
}
  
@keyframes fadeUpAnime{
    from {
      opacity: 0;
      transform: translateY(100px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
}

  /* 上から */
.fadeDown {
    animation-name:fadeDownAnime;
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity:0;
}
  
@keyframes fadeDownAnime{
    from {
      opacity: 0;
    transform: translateY(-100px);
    }
  
    to {
      opacity: 1;
    transform: translateY(0);
    }
}
  
/* 左から */
.fadeLeft{
    animation-name:fadeLeftAnime;
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity:0;
}
  
@keyframes fadeLeftAnime{
    from {
      opacity: 0;
    transform: translateX(-100px);
    }
  
    to {
      opacity: 1;
    transform: translateX(0);
    }
}
  
/* 右から */
.fadeRight{
    animation-name:fadeRightAnime;
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity:0;
}
  
@keyframes fadeRightAnime{
    from {
      opacity: 0;
    transform: translateX(100px);
    }
  
    to {
      opacity: 1;
    transform: translateX(0);
    }
}

/* 順番に表示 */
/* アニメーションスタートの遅延時間を決めるCSS*/

.delay-time02{
    animation-delay: 0.2s;
}

.delay-time03{
    animation-delay: 0.3s;
}

.delay-time04{
    animation-delay: 0.4s;
}
  
.delay-time05{
    animation-delay: 0.5s;
}
  
.delay-time06{
    animation-delay: 0.6s;
}

.delay-time07{
    animation-delay: 0.7s;
}

.delay-time08{
  animation-delay: 0.8s;
}

.delay-time09{
  animation-delay: 0.9s;
}

.delay-time10{
  animation-delay: 1.0s;
}