.headArea {
  position: relative;
}

.headBackground {
  position: relative;
  height: 68rem;
  overflow: hidden;
}

.headBackground>img {
  width: 100vw;
}

.swiperArea {
  position: absolute;
  top: 33rem;
  width: 45rem;
  height: 25.3rem;
  background-color: black;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 1.175rem;
  overflow: hidden;
}

.swiper-pagination {
  width: 60vw;
  top: 60rem;
  left: 0;
  right: 0;
  margin: auto;
}

.bullet {
  background: rgba(255, 255, 255, 0.5);
}

.bullet-active {
  background: rgba(255, 255, 255, 1);
}

.bullet,
.bullet-active {
  position: relative;
  display: inline-block;
  border-radius: calc(8 / 750 * 100vw);
  width: calc(8 / 750 * 100vw);
  height: calc(8 / 750 * 100vw);
  margin: 0 calc(7.5 / 750 * 100vw);
}

.item {
  position: absolute;
  top: 63rem;
  height: 5.2rem;
  width: 82vw;
  left: 0;
  right: 0;
  margin: auto;
  background-color: rgba(255, 255, 255, 0.5);
  text-align: center;
}

.item>img {
  position: absolute;
  width: calc(565.4 / 750 * 100vw);
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}