:root {
  --pc-top: 200px;
}

* {
  box-sizing: border-box;
}

.random_banner-root {
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

.random_banner {
  z-index: 1000;
}

.random_banner__link {
  display: inline-block;
}

.random_banner img {
  display: block;
  max-width: 100%;
  height: auto;
}

.random_banner--pc {
  position: fixed;
  left: 0;
  top: 50%;
  animation: floatBanner 3.6s ease-in-out infinite;
  will-change: transform;
}

.random_banner--sp {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  text-align: center;
}

.random_banner--sp .random_banner__link {
  display: block;
  width: 100%;
}

.random_banner--sp img {
  width: 100%;
  height: auto;
}

@media (max-width: 767px) {
  .random_banner--pc {
    display: none;
  }

  .random_banner--sp {
    display: block;
  }
}

@keyframes floatBanner {
  0% {
    transform: translateY(-50%);
  }
  50% {
    transform: translateY(calc(-50% - 10px));
  }
  100% {
    transform: translateY(-50%);
  }
}
