/* ▼▼▼ スライダー全体の枠 ▼▼▼ */
  .logo-slider {
    width: 100%;
    overflow: hidden; /* 枠からはみ出た部分を隠す */
    background-color: #f9f9f9; /* 背景色（必要に応じて変更してください） */
    padding: 20px 0; /* 上下の余白 */
  }

  /* ▼▼▼ 画像を横並びにするトラック（レール） ▼▼▼ */
  .logo-track {
    display: flex;
    align-items: center;
    /* 画像の数や幅に応じて幅を自動調整 */
    width: max-content;
    /* アニメーション設定：名前 時間 進行度 ループ */
    animation: scroll-loop 40s linear infinite;
  }

  /* ▼▼▼ 各画像のスタイル ▼▼▼ */
  .logo-track img {
    height: 60px; /* ロゴの高さ（適宜調整してください） */
    width: auto;  /* 横幅は比率を維持 */
    margin: 0 30px; /* ロゴ同士の間隔 */
    pointer-events: none; /* 画像のドラッグやクリックを無効化 */
    user-select: none; /* 選択不可にする */
  }

  /* ▼▼▼ アニメーションの定義 ▼▼▼ */
  @keyframes scroll-loop {
    0% {
      transform: translateX(0);
    }
    100% {
      /* トラック全体の半分の長さ分だけ移動したら0に戻る */
      /* ※HTML側で画像を2セット用意しているため、これでループに見えます */
      transform: translateX(-50%);
    }
  }