@charset "UTF-8";
/* ------------------------
  スクロールしたら - ベース
-------------------------- */
.scroll_In {
  opacity: 0;
  will-change: transform, opacity;
}

.scroll_In.scroll_In_on {
  opacity: 1;
  will-change: auto;
}

/* ------------------------
  アニメーションパターン
-------------------------- */
.scroll_In.anime_ptn_01 {
  transform: translate3d(0, 40px, 0);
  transition: transform 1.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 1.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll_In.anime_ptn_01.scroll_In_on {
  transform: translate3d(0, 0, 0);
}

/* ------------------------
  遅延時間
-------------------------- */
.scroll_In.delay_01 {
  transition-delay: 0.1s;
}

.scroll_In.delay_02 {
  transition-delay: 0.2s;
}

.scroll_In.delay_03 {
  transition-delay: 0.3s;
}

.scroll_In.delay_04 {
  transition-delay: 0.4s;
}

.scroll_In.delay_05 {
  transition-delay: 0.5s;
}

.scroll_In.delay_06 {
  transition-delay: 0.6s;
}

.scroll_In.delay_07 {
  transition-delay: 0.7s;
}

.scroll_In.delay_08 {
  transition-delay: 0.8s;
}

.scroll_In.delay_09 {
  transition-delay: 0.9s;
}

.scroll_In.delay_10 {
  transition-delay: 1s;
}