@charset "UTF-8";

/* ========================================================
   冬仕様
   style.css の後に読み込んで、必要なところだけ上書きする
   ON/OFF は functions.php の $season で切り替え（このファイルは消さなくてOK）
   ハロウィンと違って、変えるのはトップのはあちゃまの画像だけ（背景色・フッターは通常のまま）
   ======================================================== */

/* トップのはあちゃまアニメ：歩くイラスト → 冬のはあちゃま（images/akai-haato_winter/ の8枚）に差し替え
   画像だけ冬用の keyframes に切り替える。速さ・揺れ・大きさ・位置は style.css の通常版のまま
   数値の意味は style.css の「トップのはあちゃまアニメ」のコメント [1]〜[6] を参照 */
.title-img::before {
  content:
    url('../images/akai-haato_winter/akai-haato_1.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_2.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_3.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_4.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_5.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_6.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_7.webp?26110701')
    url('../images/akai-haato_winter/akai-haato_8.webp?26110701');
}

/* PC・スマホ共通（style.css では2か所に書いてあるけど、ここ1か所で両方上書きされる）
   コマ送り 1.6s・上下の揺れ 0.4s は通常と同じ。コマの画像だけ title-winter-cycle に替える */
.title-img {
  animation:
    title-winter-cycle 1.6s steps(1) infinite,
    title-walk-bounce 0.4s ease-in-out infinite alternate;
}

@keyframes title-winter-cycle {
  0%     { background-image: url('../images/akai-haato_winter/akai-haato_1.webp?26110701'); }
  12.5%  { background-image: url('../images/akai-haato_winter/akai-haato_2.webp?26110701'); }
  25%    { background-image: url('../images/akai-haato_winter/akai-haato_3.webp?26110701'); }
  37.5%  { background-image: url('../images/akai-haato_winter/akai-haato_4.webp?26110701'); }
  50%    { background-image: url('../images/akai-haato_winter/akai-haato_5.webp?26110701'); }
  62.5%  { background-image: url('../images/akai-haato_winter/akai-haato_6.webp?26110701'); }
  75%    { background-image: url('../images/akai-haato_winter/akai-haato_7.webp?26110701'); }
  87.5%  { background-image: url('../images/akai-haato_winter/akai-haato_8.webp?26110701'); }
}