.secondHero {
  margin-top: 4.6875rem;
  position: relative;
  overflow: hidden;
}

.secondHero p {
  display: flex;
  flex-direction: column;
  position: absolute;
  justify-content: space-around;
  z-index: 1999;
  min-width: 100vw;
  height: 9rem;
  color: #fdfdfd;
  background-color: rgba(0, 0, 0, 0.5);
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
}

.secondHero-slides {
  display: flex;
  animation: scroll 30s linear infinite;
  width: calc(13.5rem * 16);
}

.slide,
.slide img {
  width: 13.5rem;
  height: 9rem;
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-13.5rem * 8));
  }
}

@media (min-width: 48rem) {
  .secondHero p {
    font-size: 2.5rem;
    height: 15rem;
  }

  .secondHero-slides {
    width: calc(22.5rem * 16);
  }

  .slide,
  .slide img {
    width: 22.5rem;
    height: 15rem;
  }

  @keyframes scroll {
    100% {
      transform: translateX(calc(-22.5rem * 8));
    }
  }
}