﻿.video-carousel {
  position: relative;
  width: 100%;
  max-width: 100%;
  height:100%;
  margin: 0 auto;
  /*overflow: hidden;*/
  z-index:1000;
}

.carousel-container {
  display: flex;
  transition: transform 0.5s ease;
}

.image_m{
  display: none;
  transition: transform 0.5s ease;
  height:600px;
  width:100%;
}
.swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit:cover;
  /*z-index:1000;*/
}
.swiper-slide .m-caption {
  
    position:absolute;
  /*margin-top: 20px;
  padding: 100px;*/
  bottom: 65px;
    left: 0;
    right: 0;
    display:flex;
    justify-content: center;
    text-align: center;
  background: rgba(0,0,0,0.1);
  border-radius: 5px;
  font-size:18px;
  font-weight:400;
  color:#fff;

}
.image_m .my-pagination-clickable {
    /*width:auto;
    bottom:26px;
    right:30px;
    text-align:center;*/
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 20px;
    text-align: center;
}
/*.image_m .swiper-pagination {
    position: absolute;
    bottom: 20px;
    left: 50%;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
    text-align: center;
}*/

/*圆点变横线，修改背景色*/
.image_m .swiper-pagination-bullet-active,
.image_m .swiper-pagination-bullet {
        width: 48px;
        height: 4px;
        border-radius: 0px;
        background-color: #000;
        opacity: .2;
        display:inline-block;
    }
/*修改选中的颜色*/
.image_m .swiper-pagination-bullet-active {
        background-color: #0d8ebd;
        opacity: 1;
    }
    
/*修改边距*/
.image_m .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 4px 20px;
    }



.video-slide {
  min-width: 100%;
  box-sizing: border-box;
  /*z-index:1000;*/
  display:none;
}

.video-slide.active {
    display:block;
}

.video-slide video {
  width: 100%;
  height: auto;
  display: block;
  /*z-index:1000;*/
}

.video-slide img {
  width: 100%;
  height: auto;
  display: block;
  /*z-index:1000;*/
}

.video-content{
    /*display:none;*/
}
.video-content .show{
    /*display:block;*/
}

.video-title {
    text-align: left;
    color: #fff;
    position: absolute;
    top: 49%;
    left: 10%;
    margin: auto;
    max-width: 600px;
    z-index: 3;
    width: 100%;
    transform: translate(0, -49%);
    padding-top:600px;
}

.video-title the-title {
    color:#fff;
}

.video-desc {
    display: flex;
}

.play-button {
    margin-top: 33px;
    margin-left: 14px;
    margin-right: 22px;
    transition: 0.4s;
}

.play-button a {
    border: 4px solid #ffffff;
    border-radius: 50%;
    padding: 12px 15px;
    color: #fff;
    transition: 0.4s;
}

.play-button:hover {
    transform: translateY(10px);
}


.carousel-prev, .carousel-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  z-index: 10;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  font-size: 18px;
}

.carousel-prev {
  left: 20px;
}

.carousel-next {
  right: 20px;
}

.carousel-indicators {
  position: absolute;
  /*bottom: 10px;*/
  /*top: calc(60vh + 160px);*/
  left: 50%;
  bottom:7vh;
  /*right: 0;*/
  display:flex;
  justify-content: center;
  gap: 20px;
  text-align:center;
  opacity:0.6;
}

.indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  /*background-color: rgba(255, 255, 255, 0.5);*/
  cursor: pointer;
  background-color: white;
}

.indicator.active {
   background-color: #003892;
}

/* 轮播文字内容 */
.video-captions {
    opacity:0.8;
    position:absolute;
    display: flex;
    align-items:center;
    justify-content:center;
    bottom:10vh;
    left:15%;
    /*transform: translateY(-50%);*/
    background-color: rgba(0,0,0,0.3);
    color:#fff;
    font-size:18px;
    font-weight:400;
    width:70%;
    height:100px;
    line-height:80px;
    text-align:center;
    /*text-align:justify;*/
    padding: 10px;
}
.video-captions .length{
    line-height: 1.6rem;

}
.video-captions .video-caption {
    display: none;
}
.video-captions .video-caption.active{
    display: block;
}


/* Media queries */

/*@media (min-width: 1200px) {
	.video-carousel {
		width: 1230px;
	}
}*/

@media (min-width: 768px) and (max-width: 979px) {
   .image_m {
        display:flex;

    }
    .video_pc {
        display:none;
    }
    /*.carousel-prev .carousel-next .carousel-indicators{
        display:none;
    }*/
    .intro-content {
        padding:50px 0 0;
    }
}

@media (max-width:767px) {
    .image_m {
        display:flex;

    }
    .video_pc {
        display:none;
    }
    /*.carousel-prev .carousel-next .carousel-indicators{
        display:none;
    }*/
    .intro-content {
        padding:60px 0 0;
    }
}

/*@media (max-width:480px) {
		
}

@media (max-width:320px) {
	
}*/