@keyframes ticker-slide {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
}

.ticker-container--2 .ticker-track {
  transform: translate3d(-50%, 0, 0);
  animation: ticker-horizontal-reverse 24s linear infinite;
}

/* 1024px以上（縦流れ切り替え時） */
@media (min-width: 1024px) {
  /* 縦流れ時：逆方向スライダーの初期位置を最初からY軸-50%ずらしておく */
  .ticker-container--2 .ticker-track {
    transform: translate3d(0, -50%, 0);
    animation: ticker-vertical-reverse 25s linear infinite;
  }
}

/* ----------------------------------
   @keyframes アニメーション定義
---------------------------------- */

/* 横流れ：標準 (左移動) */
@keyframes ticker-horizontal {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
}

/* 横流れ：逆方向 (右移動) */
@keyframes ticker-horizontal-reverse {
  0% {
    transform: translate3d(-50%, 0, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

/* 縦流れ：標準 (上移動) */
@keyframes ticker-vertical {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(0, -50%, 0);
  }
}

/* 縦流れ：逆方向 (下移動) */
@keyframes ticker-vertical-reverse {
  0% {
    transform: translate3d(0, -50%, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}