.section--marquee {
  background: var(--background);
}

.section--marquee .marquee {
  position: relative;
  display: flex;
  overflow-x: hidden;
  overflow-y: hidden;
  user-select: none;
  gap: var(--gap);
}

.section--marquee .marquee__content {
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  gap: var(--gap);
  min-width: 10%;
  padding: 0;
  margin: 0;
}

.section--marquee .marquee__item {
  list-style-type: none;
  line-height: normal;
  letter-spacing: var(--text-letter-spacing);
  color: var(--text-color);
  font-size: var(--font-size);
  display: flex;
  align-items: center;
  gap: 15px;
}

.section--marquee .marquee__item .block--image,
.section--marquee .marquee__item .block--image .box-ratio {
  padding-bottom: 0 !important;
  height: var(--section-height);
}

.section--marquee .marquee__item .block--image .box-ratio img {
  object-fit: cover;
  object-position: center;
  height: 100%;
}

.section--marquee .marquee__item span {
  white-space: nowrap;
}

.section--marquee .marquee__letter {
  letter-spacing: var(--text-letter-spacing);
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - var(--gap)));
  }
}

@media (prefers-reduced-motion: reduce) {
  .section--marquee .marquee__content {
    animation-play-state: paused !important;
  }
}

.section--marquee .marquee--fit-content {
  max-width: fit-content;
}

.section--marquee .marquee--pos-absolute .marquee__content:last-child {
  position: absolute;
  top: 0;
  left: 0;
}

.section--marquee .enable-animation .marquee--pos-absolute .marquee__content:last-child {
  animation-name: scroll-abs;
}

@keyframes scroll-abs {
  from {
    transform: translateX(calc(100% + var(--gap)));
  }
  to {
    transform: translateX(0);
  }
}

.section--marquee .marquee__content > * {
    flex: 0 0 auto;
    text-align: center;
}