.js-fadeIn {
  opacity: 0;
  transition-property: opacity, transform;
  transition-duration: 0.4s;
  transition-timing-function: ease;
  transition-delay: 0.1s;
}

/* 左からスライドイン */
.js-fadeIn[data-scrollmagic="L"] {
  transform: translateX(-60px);
}

/* 右からスライドイン */
.js-fadeIn[data-scrollmagic="R"] {
  transform: translateX(60px);
}

/* 下からスライドイン（大） */
.js-fadeIn[data-scrollmagic="B"] {
  transform: translateY(60px);
}

/* 下からスライドイン（小） */
.js-fadeIn[data-scrollmagic="b"] {
  transform: translateY(30px);
}

/* 遅延制御（PC only） */
@media screen and (min-width: 768px) {
  .js-fadeIn[data-delay="0"]    { transition-delay: 0ms; }
  .js-fadeIn[data-delay="100"]  { transition-delay: 100ms; }
  .js-fadeIn[data-delay="200"]  { transition-delay: 200ms; }
  .js-fadeIn[data-delay="300"]  { transition-delay: 300ms; }
  .js-fadeIn[data-delay="400"]  { transition-delay: 400ms; }
  .js-fadeIn[data-delay="500"]  { transition-delay: 500ms; }
  .js-fadeIn[data-delay="600"]  { transition-delay: 600ms; }
  .js-fadeIn[data-delay="700"]  { transition-delay: 700ms; }
  .js-fadeIn[data-delay="800"]  { transition-delay: 800ms; }
  .js-fadeIn[data-delay="900"]  { transition-delay: 900ms; }
  .js-fadeIn[data-delay="1000"] { transition-delay: 1000ms; }
}

/* アニメーション発火後 */
.js-fadeIn.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}
