@charset "utf-8";

#HeaderSlide{margin:0 0 10px;}
#HeaderSlide:after{clear:both; content:""; display:block;}
#HeaderSlide_thumnails{width:700px; margin:auto;}
@media screen and (max-width:1280px) {
#HeaderSlide_thumnails{ width:60%;}
}

/*
.fit {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fitsize {
  position: absolute;
}
*/

.slider {
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease;
}
.slider.slick-initialized {
  opacity: 1;
  visibility: visible;
}


.slick-slider div { transition: none; }
.slider div{
background-repeat: no-repeat; width:100%; height:0; padding-bottom:33.5%;
  background-size: cover;
  background-position: center;
  text-decoration: none; object-fit: cover;
}

/*動画*/
.slider div.top_movie{text-align:center; background-color:#EEEEEE;}
.slider div.top_movie video {
  display: block;
  position: absolute;
  top:60%;
  left: 50%;
  min-width: 100%;
/*  min-height: 100%;*/
  width: auto;
  height:650px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}


.slick-track {
  display: flex;
  align-items: center;
}


.slider div.waki{background-image:url(../../images/slider_img/slide_waki.jpg);}
.slider div.siwa{background-image:url(../../images/slider_img/slide_siwa.jpg);}
.slider div.eyes{background-image:url(../../images/slider_img/slide_eyes.jpg);}
.slider div.regener{background-image:url(../../images/slider_img/slide_regener.jpg);}


@media screen and (max-width:1080px){
.slider div.top_movie video { height:480px;}
}

@media screen and (max-width:780px){
.slider div.top_movie video { height:650px;}
.slider div{ padding-bottom:73.5%;}

.slider div.waki{background-image:url(../../images/slider_img_sp/slide_waki_sp.jpg);}
.slider div.siwa{background-image:url(../../images/slider_img_sp/slide_siwa_sp.jpg);}
.slider div.eyes{background-image:url(../../images/slider_img_sp/slide_eyes_sp.jpg);}
.slider div.regener{background-image:url(../../images/slider_img_sp/slide_regener_sp.jpg);}

.thumbnail{display:none;}
}

@media screen and (max-width:648px){
.slider div.top_movie video { height:480px;}
}

@media screen and (max-width:520px){
.slider div.top_movie video { height:380px;}
}

@media screen and (max-width:416px){
.slider div.top_movie video { height:300px;}
}
