@charset "utf-8";
/* CSS Document */
/* top */
#mv {
  margin: 0 auto clamp(35px,calc(70 / 750 * 100%),70px);
  position: relative;
  display: block;
}
#mv img {
  display: block;
  margin: 0 auto;
}

.mv__sliderbox {
  margin: calc(35 / 750 * 100%) auto;
}
.mv__slideritem {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: clamp(20px,calc(40 / 750 * 100vw),40px);
  width: calc(680 / 750 * 100%);
  margin: 0 auto;
}
.mv__sliderbox .owl-carousel .owl-dots {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-align-items: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
  gap: clamp(15px,calc(30 / 750 * 100vw),30px);
  margin: clamp(20px,calc(40 / 750 * 100vw),40px) auto;
}
.mv__sliderbox .owl-carousel button.owl-dot {
  width: clamp(10px,calc(20 / 750 * 100vw),20px);
  height: clamp(10px,calc(20 / 750 * 100vw),20px);
  border-radius:  clamp(10px,calc(20 / 750 * 100vw),20px);
  background: var(--c-pink2);
  display: block;
}
.mv__sliderbox .owl-carousel button.owl-dot.active {
  background: var(--c-red);
}


.mv__sliderbox + div > .box:first-child {
  margin-top: clamp(10px,calc(20 / 750 * 100%),20px);
}

@media screen and (min-width:750px){
  .mv__sliderbox {
    margin: 0 auto;
  }
    .mv__slideritem {
      width: 470px;
    }
  .mv__sliderbox .owl-carousel .owl-dots {
    gap:16px;
    margin:25px auto;
  }
  .mv__sliderbox .owl-carousel button.owl-dot {
    width: 10px;
    height: 10px;
    border-radius: 10px;
  }
  .mv__sliderbox + div > .box:first-child {
    margin-top: clamp(10px,calc(20 / 750 * 100%),20px);
  }
}