/* =========================================
   スクロールアニメーション (独自軽量版)
========================================= */
/* アニメーションの基本時間と状態維持の設定 */
.animate__animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

/* 下からふわっとスライドイン */
@keyframes customSlideInUp {
  0% {
    transform: translate3d(0, 50px, 0); /* 元は100%でしたが、50pxの固定距離にするとより上品で今風になります */
    opacity: 0; /* 元のAnimate.cssにはありませんでしたが、透明から現れるようにすると綺麗です */
  }
  100% {
    transform: translateZ(0);
    opacity: 1;
  }
}
.animate__slideInUp {
  animation-name: customSlideInUp;
}

/* ふわっと拡大しながら表示 */
@keyframes customZoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5);
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
.animate__zoomIn {
  animation-name: customZoomIn;
}