.mp4-swiper-box{
  padding-top:36px;
  position:relative;
  z-index:10;
}
.mp4-swiper-box-canyou{
  position:absolute;
  width:100%;
  height:100%;
  left:0;
  top:0;
  z-index:10;
}
.mp4-swiper-box .main-box{
  position:relative;
  z-index:99;
}
.mp4-swiper{
  width:993px;
  height:calc(993px * 9 / 16);
  margin-left:0;
}
.mp4-swiper-slide-linear{
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index:99;
}
.mp4-swiper-slide-bac {
  position: relative;
  z-index: 10;
}
.mp4-swiper-slide-icon-box{
  position: absolute;
  z-index:199;
  left:19px;
  bottom:19px;
}
.mp4-swiper-slide-icon{
  width: 86px;
}
.mp4-swiper-box-inner{
  position:relative;
}
.mp4-swiper-menu{
  position:absolute;
  width:269px;
  height:100%;
  padding-top:40px;
  background-image: linear-gradient(to bottom, 
    rgba(0, 0, 0, 0) 0%, 
    rgba(0, 0, 0, 0.21) 4%, 
    #000000 50%, 
    rgba(0, 0, 0, 0.27) 96%, 
    rgba(0, 0, 0, 0) 100%);
  z-index:99;
  top:0;
  right:0;
}
.mp4-swiper-menu-unit{
  color:#ffffff;
  font-size: 18px;
  line-height: 27px;
  margin-top:29px;
  padding-left:25px;
  padding-right:25px;
}
.mp4-swiper-menu-unit-active{
  background-image: linear-gradient(to left, rgb(132 1 10), #b5040f);
}
.mp4-swiper-menu-unit:first-of-type{
  margin-top:0;
}
.mp4-swiper-slide-title-box{
  display:none;
}
.mp4-swiper-button-next,.mp4-swiper-button-prev{
  width: 28px;
  background-color: #9a9a9a;
  border-radius: 8px;
  height: 50px;
  transition:0.5s;
  opacity: 0.5;
  display:none;
}
.mp4-swiper-button-next:hover,.mp4-swiper-button-prev:hover{
  background-color: #b5020e;
}
.mp4-swiper-button-next:after,.mp4-swiper-button-prev:after{
  font-size:26px;
  color:#ffffff;
}
@media (max-width:1400px){
  .mp4-swiper{
    width: 68vw;
    height:calc( 68vw * 9 / 16 );
  }
  .mp4-swiper-menu{
    padding-top:2vw;
    width:20vw;
  }
  .mp4-swiper-menu-unit{
    font-size: 1.4vw;
    margin-top: 1.5vw;
    line-height: 1.8vw;
  }
  .mp4-swiper-button-next, .mp4-swiper-button-prev{
    width: 2vw;
    height: 3.5vw;
  }
  .mp4-swiper-button-next:after, .mp4-swiper-button-prev:after{
    font-size: 1.8vw;
  }
}
@media (max-width:1099px){
  .mp4-swiper-menu-unit {
    font-size: 1.7vw;
    line-height: 2vw;
  }
}
@media (max-width:767px){
  .mp4-swiper-menu{
    display:none;
  }
  .mp4-swiper{
    width: 100%;
    height: calc((100vw - 1.87vw * 2) * 9 / 16);
  }
  .mp4-swiper-slide-icon{
    width:11.47vw;
  }
  .mp4-swiper-box{
    padding-top:3vw;
  }
  .mp4-swiper-slide-title-box{
    position:absolute;
    bottom:0;
    left:0;
    z-index:99;
    background-image: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.7));
    padding: 3vw 2vw 2vw;
    width: 100%;
    display:block;
  }
  .mp4-swiper-slide-title{
    color:#ffffff;
    font-size:4.27vw;
    line-height:5vw;
  }
  .mp4-swiper-slide-icon-box{
    left: 50%;
    top: 50%;
    bottom:unset;
    transform: translate(-50%,-50%);
  }
  .mp4-swiper-button-next, .mp4-swiper-button-prev{
    width: 6.5vw;
    height: 12vw;
    border-radius: 1.2vw;
    display:flex;
  }
  .mp4-swiper-button-next:after, .mp4-swiper-button-prev:after{
    font-size:4.5vw;
  }
  .mp4-swiper-button-next{
    right:2vw;
  }
  .mp4-swiper-button-prev{
    left:2vw;
  }
}