@charset "UTF-8";

/**********************************************************
 * 無限に横スクロールする画像
 **********************************************************/
.marquee {
  overflow: hidden;
}
.track {
  --track-width: 0px; /* フォールバック値 */
  display: flex;
  gap: 63px;
  width: max-content;
  animation: scroll 40s linear infinite;
}

/* 1トラックぶん左へ移動したら0に戻す */
@keyframes scroll {
  to{ transform: translateX(calc(-1 * var(--track-width))); }
}

.items {
  display: flex;
  gap: 63px;
}
.items img {
  display: block;
  width: 149px;
  height: auto;
}

/* モーション軽減設定の尊重 */
@media (prefers-reduced-motion: reduce){
  .track{ animation: none; }
}

@media (768px <= width < 1920px) {
  .track {
    gap: 3.281vw;
  }
  .items {
    gap: 3.281vw;
  }
  .items img {
    width: 8.536vw;
  }
}

@media (width < 768px) {
  .track {
    gap: 6.667vw;
  }
  .items {
    gap: 6.667vw;
  }
  .items img {
    width: 17.7064vw;
  }
}