#banBox {
	width: 100%;
	max-height: 100vh;
	overflow: hidden;
	position: relative;
}

#banBox .banImg {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#banBox video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#banBox .textBox {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
    padding: 0.16rem 1.3rem;
}

#banBox .p_btitle {
	font-weight: bold;
	color: #fff;
}

#banBox .p_subtitle {
	color: #fff;
	/*display: none;*/
}

#banBox .p_summer {
	color: #fff;
	font-size: 12px;
	max-width: 900px;
	zoom: 0.7;
	margin-top: 3vw;
}


#banBox .swiper_ban {
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
	bottom: 5%;
	z-index: 5;
	display: none;
}


#banBox .swiper_ban>span {
	display: inline-block;
	margin: 0 10px;
	width: 38px;
	height: 38px;
	position: relative;
	z-index: 6;
	opacity: 1;
	background: transparent;
}

#banBox .swiper_ban>span svg {
	display: block;
	width: 38px;
	height: 38px;
	position: relative;
	transform: rotate(-45deg);
}

#banBox .swiper_ban>span svg circle {
	stroke-width: 2px;
	stroke: #fff;
	stroke-dasharray: 300%;
	stroke-dashoffset: 300%;
	transition: stroke-dashoffset 0.6s ease-out;
}

#banBox .swiper_ban>span.swiper-pagination-bullet-active svg circle {
	stroke-dashoffset: 0;
	transition: stroke-dashoffset 4s ease-out;
}

#banBox .swiper_ban>span i {
	position: absolute;
	z-index: 11;
	top: 0;
	left: 0;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	transition: border-color 0.3s ease-out;
	display: block;
}

#banBox .swiper_ban>span i:after {
	content: "";
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: rgba(255 255 255 / 40%);
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

#banBox .swiper_ban>span.swiper-pagination-bullet-active i {
	border-color: rgba(255, 255, 255, 0.3);
}

#banBox .swiper_ban>span.swiper-pagination-bullet-active i:after {
	background-color: rgba(255 255 255);
}





#banBox .right {
	right: -1px;
}

#banBox .left {
	left: -1px;
}

#banBox .swiper-pagination-bullet-active .rightcircle {
	-webkit-animation: circleProgressLoad_right 6s linear infinite;
	animation: circleProgressLoad_right 6s linear infinite;
}

#banBox .swiper-pagination-bullet-active .leftcircle {
	-webkit-animation: circleProgressLoad_left 6s linear infinite;
	animation: circleProgressLoad_left 6s linear infinite;
}

#banBox .swiper-pagination-bullet-active .wrapper_con {
	display: block;
}

@media only screen and (max-width: 768px) {
   /*banner*/
	#banBox {
		margin-top: 66px;
	}

	#banBox .banLi {
		height: 380px;
	}
	#banBox .textBox{
	    width: 100%;
        padding: 10px 10px;
	}
	
	#banBox .p_btitle {
		width: 100%;
		margin: 10px auto 15px;
		font-size: 24px;
	}

	#banBox .p_subtitle {
	    width: 100%;
		margin: 10px auto 15px;
		font-size: 24px;
	}

	#banBox .swiper_ban>span {
		zoom: 0.6;
	} 
}