@charset "UTF-8";

/* MV上に80%枠のスライドを重ねる */
.mv-overlay-slider{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none; /* ボタン以外は下の要素を邪魔しない */
}

.mv-overlay-slider__inner{
  width:80%;
  height:80%;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  box-shadow:0 12px 40px rgba(0,0,0,.25);
  pointer-events:auto; /* ボタン操作できるように戻す */
}

.mv-overlay-slider__track{
  height:100%;
  display:flex;
  transition:transform .5s ease;
}

.mv-overlay-slider__slide{
  min-width:100%;
  height:100%;
}

.mv-overlay-slider__slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* ボタン */
/* .mv-overlay-slider__btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  width:44px;
  height:44px;
  border-radius:999px;
  border:none;
  background:rgba(0,0,0,.45);
  color:#fff;
  font-size:28px;
  line-height:44px;
  cursor:pointer;
} */

/* .mv-overlay-slider__btn--prev{ left:12px; }
.mv-overlay-slider__btn--next{ right:12px; } */

.mv-overlay-slider__slide img{
  user-select:none;
  -webkit-user-drag:none;
}

/* スマホは少し余裕を見て縮める例 */
@media (max-width: 767px){
  .mv-overlay-slider__inner{
    width:92%;
    height:70%;
    border-radius:12px;
  }
}