@keyframes scroll-text {
  0% {
    transform: translateX(var(--telop-start, 100%));
  }
  100% {
    transform: translateX(var(--telop-end, -100%));
  }
}

.scrolling-text {
  white-space: nowrap;
  display: inline-block;
  animation: scroll-text var(--telop-duration, 40s) linear 1 forwards;
  min-width: auto;
  will-change: transform;
  width: auto;
}

.telop-text {
  font-size: 2rem;
}

@media screen and (max-width: 767px) {
  .telop-text {
    font-size: 14px;
    font-weight: bold;
  }
}

.telop-block {
  display: block;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
}