.running_line {
  --size: clamp(10rem, 1rem + 40vmin, 16rem);
  --gap: calc(var(--size) / 15);
  --duration: 80s;
  --scroll-start: 0;
  --scroll-end: calc(-100% - var(--gap));
  padding: 0.8rem 0;
  background: #AF87F8;
}
@media only screen and (min-width: 768px) {
  .running_line {
    --gap: calc(var(--size) / 7);
  }
}
.running_line__wrap {
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: var(--gap);
}
.running_line__wrap__group {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: var(--gap);
  min-width: 100%;
  animation: scroll-x var(--duration) linear infinite;
}
.running_line__wrap__group p {
  color: #512D8D;
  font-size: clamp(2.2rem, 4vw, 4.5rem);
  font-weight: 300;
  line-height: 110%;
  letter-spacing: -0.04em;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  text-transform: uppercase;
}
.running_line__wrap__group p::after {
  content: "";
  display: flex;
  width: 1rem;
  height: 1rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='10' viewBox='0 0 11 10' fill='none'%3E%3Cpath d='M5.48438 0.03125C5.48438 2.56723 3.42855 4.62305 0.892578 4.62305C3.42855 4.62305 5.48438 6.67887 5.48438 9.21484C5.48438 6.67887 7.5402 4.62305 10.0762 4.62305C7.5402 4.62305 5.48438 2.56723 5.48438 0.03125Z' fill='%23512D8D'/%3E%3C/svg%3E") no-repeat center center;
  background-size: contain;
}
@media only screen and (min-width: 768px) {
  .running_line__wrap__group p::after {
    width: 1.8rem;
    height: 1.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .running_line__wrap__group p {
    gap: 3rem;
  }
}
@keyframes scroll-x {
  from {
    transform: translateX(var(--scroll-start));
  }
  to {
    transform: translateX(var(--scroll-end));
  }
}