.game-detail {
  display: grid;
  grid-template-columns: 40% 60%;
	margin-top: 4rem;
  margin-bottom: 4rem;
  gap: 2rem;
}

.game-detail .description {
  padding: 0;
}

.game-detail .text-description {
  padding: 0;
  margin-bottom: 2%;
}

.game-detail .param-description {
  color: var(--main-dark-grey);
  padding: 0;
  font-weight: bold;
  font-size: 0.95em;
}

.game-detail .param-description span {
  color: black;
  font-weight: lighter;
}

.game-detail .left {
  display: grid;
  grid-template-rows: 10% 90%;
}

.game-detail .line-circle-left {
  display: flex;
  padding-top: 0.3rem;
}

.game-detail .line-circle-left .circle {
  background-color: var(--main-brown);
	width: var(--circle-height-width);
}

.game-detail .line-circle-left .line {
  width: 112.5%;
  margin-top: 0.25rem;
  background-color: var(--main-brown);
  margin-left: -15%;
  height: var(--line-height);
}

.game-detail .price {
  margin-bottom: 2%;
}

.scroll-img {
  display: grid;
  grid-template-rows: min-content min-content;
  gap: 10px;
  justify-items: center;
}

.scroll-img .scroll {
  display: grid;
  grid-template-columns: 10% 80% 10%;
  margin-left: 1rem;
  margin-right: 1rem;
  align-items: center;
  justify-items: center;
  user-select: none;
}

.scroll-img .box-img {
  display: flex;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  overflow: hidden;
}

.scroll-img .scroll .box-img img {
  width: 25%;
  height: 100%;
  object-fit: contain;
}

.scroll-img .scroll .box-img img:last-child {
  padding-right: 0;
}

.scroll-arrow {
  cursor: pointer;
}

.scroll-arrow div {
  position: relative;
  font-size: calc(7px + 8 * (100vw - 320px) / 2240);
}

.scroll-arrow div:before,
.scroll-arrow div:after {
  content: '';
  position: absolute;
  width: 2.4em;
  height: 0.7em;
  border-radius: 0.45em;
  background-color: var(--main-dark-grey);
}

.scroll-arrow div:before {
  bottom: 0;
  transform: translate(-50%, -50%) rotate(46deg);
}

.scroll-arrow div:after {
  top: 0.6em;
  transform: translate(-50%, -50%) rotate(-46deg);
}

.scroll-arrow div:active {
  transform: translateX(2px);
}

.scroll .left-arrow {
  scale: -1;
}

.active-image {
  filter: brightness(100%);
}

.not-active-image {
  filter: brightness(70%);
  scale: 0.85;
}