:root {
  --scale-unit: calc(100vw / 640);
}
.section {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
}
.section__img {
  display: block;
  width: 100%;
  height: auto;
}
.section__link {
  position: absolute;
  transition: background-color 0.3s ease;
}
button.section__link {
  border: none;
  background: transparent;
  cursor: pointer;
}
@media (min-width: 641px) {
  .section__link:hover {
    background-color: rgba(255, 255, 255, 0.5);
  }
}

.section__link--mv {
  width: 110px;
  padding-bottom: 3.6%;
  bottom: 2%;
  left: 29.7%;
}
@media (max-width: 640px) {
  .section__link--mv {
    width: calc(73 * var(--scale-unit));
  }
}
.section__link--summary-1,
.section__link--summary-2 {
  width: 110px;
  padding-bottom: 4%;
  bottom: 26%;
  left: 21%;
}
.section__link--summary-2 {
  left: auto;
  right: 21%;
}
@media (max-width: 640px) {
  .section__link--summary-1,
  .section__link--summary-2 {
    width: calc(73 * var(--scale-unit));
  }
}
.section__link--summary-3 {
  width: 335px;
  padding-bottom: 3.4%;
  bottom: 8.6%;
  left: 4%;
}
@media (min-width: 641px) {
  .section__link--summary-3:hover {
    background-color: rgb(255 252 235 / 50%);
  }
}
@media (max-width: 640px) {
  .section__link--summary-3 {
    width: calc(222 * var(--scale-unit));
  }
}

.section__link--cta-1-1 {
  width: 826px;
  padding-bottom: 13%;
  top: 5.6%;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 641px) {
  .section__link--cta-1-1:hover {
    background-color: rgb(255 247 208 / 50%);
  }
}
@media (max-width: 640px) {
  .section__link--cta-1-1 {
    width: calc(547 * var(--scale-unit));
  }
}
.section__link--cta-1-2,
.section__link--cta-1-3 {
  width: 331px;
  padding-bottom: 10.6%;
  bottom: 31.2%;
  left: 17%;
}
.section__link--cta-1-3 {
  width: 295px;
  left: auto;
  right: 17%;
}
@media (min-width: 641px) {
  .section__link--cta-1-2:hover,
  .section__link--cta-1-3:hover {
    background-color: rgb(255 223 208 / 50%);
  }
}
@media (max-width: 640px) {
  .section__link--cta-1-2 {
    width: calc(222 * var(--scale-unit));
  }
  .section__link--cta-1-3 {
    width: calc(198 * var(--scale-unit));
  }
}
.section__link--cta-2-1 {
  width: 826px;
  padding-bottom: 13%;
  top: 6.4%;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 641px) {
  .section__link--cta-2-1:hover {
    background-color: rgb(255 247 208 / 50%);
  }
}
@media (max-width: 640px) {
  .section__link--cta-2-1 {
    width: calc(547 * var(--scale-unit));
  }
}
.section__link--cta-2-2,
.section__link--cta-2-3 {
  width: 331px;
  padding-bottom: 10.6%;
  bottom: 35.2%;
  left: 17%;
}
.section__link--cta-2-3 {
  width: 295px;
  left: auto;
  right: 17%;
}
@media (min-width: 641px) {
  .section__link--cta-2-2:hover,
  .section__link--cta-2-3:hover {
    background-color: rgb(255 223 208 / 50%);
  }
}
@media (max-width: 640px) {
  .section__link--cta-2-2 {
    width: calc(222 * var(--scale-unit));
  }
  .section__link--cta-2-3 {
    width: calc(198 * var(--scale-unit));
  }
}
