.multiple-images--scroll {
  /* width: 100%; */
  height: 100%;
}

.multiple-images--scroll.is-fix {
  padding: 0 1.5rem 0 1.5rem;
}

.multiple-images--scroll .multiple-track {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: space-between;
  will-change: transform;
  gap: 3.5rem;
}

.multiple-images--scroll.is-animated .multiple-track {
  animation: marquee var(--duration, 20s) linear infinite;
}

@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-1 * var(--shift, 0px)));
  }
}

@media (hover: hover) {
  .multiple-images--scroll.is-animated:hover .multiple-track {
    animation-play-state: paused;
  }
}