.banner{
	position: relative;
}
.banner .text{
	position: absolute;
	left: 0;
	top: 40%;
	width: 100%;
	text-align: center;
}
.banner h5{
	font-size: 66px;
	font-weight: bold;
	color: #fff;
}


.sec1{
	margin: 7.96875% 0;
}
.sec1 .left{
	display: inline-block;
	vertical-align: middle;
	width: 60%;
}
.sec1 .right{
	vertical-align: middle;
	width: 40%;
	-webkit-display: inline-flex;
	-webkit-align-items: center;
	-webkit-justify-content: center;
	-webkit-flex-direction: column;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.sec1 .right h5{
	font-size: 38px;
	color: #00437c;
	font-weight: bold;
	position: relative;
}
.sec1 .right h5 span{
	color: #12c2fa;
}
.sec1 .right h5 img{
	height: 4.158em;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
}
.sec1 .right p{
	font-size: 18px;
	color: #333;
	margin: 16.83% 0 1.3%;
}
.sec1 .right .img-box{
	position: relative;
	max-width: 63.4%;
}
.sec1 .right .img-box .icon{
	position: absolute;
	right: 29.38%;
	top: 40.15%;
	width: 3.1%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-animation: sec1icon 1s infinite;
	animation: sec1icon 1s infinite;
}
@keyframes sec1icon{
	100%{
		transform: translateY(0%);
	}
}
@-webkit-keyframes sec1icon{
	100%{
		-webkit-transform: translateY(0%);
	}
}


.sec2{
	margin-bottom: 6.25%;	
	text-align: center;
	overflow: hidden;
}
.sec2 .text{
	display: inline-block;
	vertical-align: middle;
	width: 27.7%;
	margin-right: 3.7%;
}
.sec2 .text h5{
	font-size: 38px;
	color: #00437c;
	font-weight: bold;
	position: relative;
	margin-bottom: 30%;
}
.sec2 .text h5 img{
	height: 4.158em;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
}
.sec2 .text p{
	font-size: 18px;
	color: #333;
}
.sec2 ul{
	vertical-align: middle;
	width: 68.6%;
	-webkit-display: inline-flex;
	-webkit-align-items: stretch;
	-webkit-justify-content: space-between;
	-webkit-flex-wrap: wrap;
	-webkit-flex-direction: row;
	display: inline-flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: wrap;
	flex-direction: row;
}
.sec2 li{
	display: inline-block;
	vertical-align: middle;
	width: 31.7%;
	margin-right: 2.45%;
	-webkit-transform: translateX(75vw);
	transform: translateX(75vw);
	-webkit-transition-property: transform;
	-webkit-transition-duration: 1.5s;
	transition-property: transform;
	transition-duration: 1.5s;
}
.sec2 li:last-child{
	margin-right: 0;
}
.sec2 li.actived{
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.sec2 li:nth-child(2){
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.5s;
}
.sec2 li:nth-child(3){
	-webkit-transition-delay: 1s;
	transition-delay: 1s;
}
.sec2 .img-box p{
	font-size: 14px;
	color: #00437c;
	font-weight: bold;
	padding: 1.6em 0 1em;
	border-bottom: 1px solid #eee;
}
.sec2 .img-box p b{
	margin: 0 0.3em;
	font-size: 2em;
	font-style: italic;
}
.sec2 .img-box p b.noleftmargin{
	margin-left: 0;
}



.sec3{
	text-align: right;
	background-repeat: no-repeat;
	background-image: url(../images/product_sec3_bg.jpg);
	background-position: center center;
	background-size: auto 100%;
	padding: 9.64% 0;
}
.sec3 .text{
	background-color: #00437c;
	padding: 4% 3.14% 5.23%;
	display: inline-block;
	vertical-align: top;
}
.sec3 h3{
	font-size: 42px;
	color: #fff;
	font-weight: bold;
	width: 7em;
}
.sec3 h5{
	font-size: 18px;
	color: #fff;
	font-weight: bold;
	line-height: 1.56;
}
.sec3 .icon1{
	width: 30.88%;
	margin-bottom: 7.35%;
}
.sec3 .img-box{
	width: 11%;
	margin: 9.2% 0 10.3%;
	overflow: hidden;
	position: relative;
	display: inline-block;
	vertical-align: top;
}
.sec3 .img-box .bg{
	opacity: 0;
}
.sec3 .img-box .icon{
	position: absolute;
	left: 0;
	top: -100%;
	width: 100%;
}
.sec3 .img-box.actived .icon{
	-webkit-animation: anchor 2s infinite both;
	animation: anchor 2s infinite both;
}
@-webkit-keyframes anchor{
	0%{
		top: -100%;
	}
	100%{
		top: 0;
	}
}
@keyframes anchor{
	0%{
		top: -100%;
	}
	100%{
		top: 0;
	}
}


.sec4{
	padding: 6.927% 0 14.792%;
	overflow: hidden;
}
.sec4 .img-box{
	width: 41.9%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 9.7%;
	-webkit-transform: translateX(-50vw);
	transform: translateX(-50vw);
	-webkit-transition: transform 1s;
	transition: transform 1s;
}
.sec4 .img-box.actived{
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.sec4 .text-box{
	width: 48.4%;
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: translateX(50vw);
	transform: translateX(50vw);
	-webkit-transition: transform 1s;
	transition: transform 1s;
}
.sec4 .text-box.actived{
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.sec4 .text-box h3{
	font-size: 38px;
	color: #00437c;
	font-weight: bold;
}
.sec4 .text-box h3 span{
	color: #12c2fa;
}
.sec4 .text-box p{
	font-size: 18px;
	color: #333333;
	margin: 3.77% 0 8.9%;
}
.sec4 .text-box table{
	width: 100%;
	text-align: center;
	font-size: 16px;
	color: #333;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	background-image: url(../images/product_sec4_tablebg.jpg);
	line-height: 1.625;
}
.sec4 .text-box td{
	border: 1px solid #eee;
	background-color: #fff;
	height: 7.5em;
}
.sec4 .text-box th:nth-child(2),.sec4 .text-box td:nth-child(2){
	color: #bbb;
}
.sec4 .text-box th:nth-child(3),.sec4 .text-box td:nth-child(3){
	background-color: transparent;
	color: #fff;
	border-bottom-color: rgba(6,158,255,0.3);
}
.sec4 .text-box tr:nth-child(1) th{
	height: 3.333em;
}
.sec4 .text-box th{
	background-color: #fff;
	border: 1px solid #eee;
	font-size: 1.125em;
	font-weight: normal;
}
.sec4 .text-box th span{
	color: #12c2fa;
}
.sec4 .text-box td img{
	display: block;
	margin: 0 auto 0.5em;
	width: auto;
	height: 0.875em;
}

.sec5{
	background-repeat: no-repeat;
	background-image: url(../images/product_sec5_bg.jpg);
	background-size: 100% 100%;
	text-align: center;
	padding-bottom: 5.46875%;
}
.sec5 .img-box{
	margin-top: -10.784%;
	width: 96.4%;
	position: relative;
	vertical-align: top;
	display: inline-block;
}
.sec5 .img-box img{
	width: 100%;
}
.sec5 .img-box .icon-box img{
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 1s;
	transition-property: opacity;
	transition-duration: 1s;
}
.sec5 .img-box .icon-box img:nth-child(1){
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.5s;
}
.sec5 .img-box .icon-box img:nth-child(2){
	-webkit-transition-delay: 1s;
	transition-delay: 1s;
}
.sec5 .img-box .icon-box img:nth-child(3){
	-webkit-transition-delay: 1.5s;
	transition-delay: 1.5s;
}
.sec5 .img-box .icon-box img:nth-child(4){
	-webkit-transition-delay: 2s;
	transition-delay: 2s;
}
.sec5 .img-box .icon-box img:nth-child(5){
	-webkit-transition-delay: 2.5s;
	transition-delay: 2.5s;
}
.sec5 .img-box.actived .icon-box img{
	opacity: 1;
}


.sec6{
	margin: 4.95% 0 6.823%;
}
.sec6 .left{
	width: 40%;
	display: inline-block;
	vertical-align: top;
	margin-right: 9%;
}
.sec6 .left h5{
	font-size: 18px;
	color: #333;
	font-weight: normal;
	line-height: 1.78;
}
.sec6 .left h5 b{
	color: #00437c;
}
.sec6 .left .img-box{
	margin: 4.9% 0 8.16%;
	display: inline-block;
	vertical-align: top;
	width: 4.9%;
	position: relative;
	overflow: hidden;
}
.sec6 .left .img-box img{
	width: 100%;
}
.sec6 .left .img-box .bg{
	opacity: 0;
}
.sec6 .left .img-box .icon{
	position: absolute;
	left: 0;
	top: -100%;
	width: 100%;
}
.sec6 .left .img-box.actived .icon{
	-webkit-animation: anchor 2s infinite both;
	animation: anchor 2s infinite both;
}
.sec6 .left h3{
	font-size: 26px;
	color: #333333;
	font-weight: bold;
	margin-bottom: 3.6%;
}
.sec6 .left p{
	font-size: 14px;
	color: #999;
	line-height: 1.7;
}
.sec6 .right{
	display: inline-block;
	vertical-align: top;
	width: 51%;
}
.sec6 .right ul{
	-webkit-display: flex;
	-webkit-align-items: stretch;
	-webkit-justify-content: space-between;
	-webkit-flex-direction: row;
	-webkit-flex-wrap: wrap;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	background-repeat: repeat-y;
	background-size: 3px auto;
	background-position: center top;
	background-image: url(../images/product_sec6_right_line_ver.png);
}
.sec6 .right li{
	width: 50%;
	text-align: center;
}
.sec6 .right h5{
	font-size: 22px;
	color: #00437c;
	font-weight: bold;
	margin-bottom: 3.7%;
}
.sec6 .right h5 img{
	width: auto;
	height: 0.636em;
	margin-right: 0.5em;
}
.sec6 .right h5 span,.sec6 .right h5 img{
	vertical-align: middle;
}
.sec6 .right .relativebox{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 68.22%;
}
.sec6 .right .echart-box{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.sec7{
	margin-bottom: 6.93%;
}
.sec7 .inner{
	background-repeat: no-repeat;
	background-image: url(../images/product_sec7_bg.jpg);
	background-size: auto 100%;
	background-position: center center;
}
.sec7 p{
	font-size: 22px;
	color: #fff;
	font-weight: bold;
	padding: 9% 10%;
	line-height: 1.73;
}


.sec8{
	background-repeat: no-repeat;
	background-image: url(../images/product_sec8_bg_web.jpg);
	background-size: auto 100%;
	background-position: center center;
	text-align: right;
}
.sec8 .text{
	display: inline-block;
	vertical-align: top;
	text-align: justify;
	padding: 14.8366% 0 18.235%;
	margin-right: 5.36%;
}
.sec8 h5{
	font-size: 38px;
	color: #fff;
	font-weight: normal;
	margin-bottom: 12%; 
}
.sec8 p{
	font-size: 18px;
	color: #fff;
	line-height: 1.56;
	width: 29em;
}


.sec9{
	text-align: center;
	padding: 4.95% 0 5.83%;
}
.sec9 h3{
	font-size: 38px;
	color: #00437c;
	font-weight: bold;
}
.sec9 p{
	font-size: 18px;
	color: #999;
	margin: 1.56em 0 3em;
}
.sec9 img{
	width: 62.222%;
}


.sec10{
	position: relative;
}
.sec10 .swiper-container{
	width: 100%;
}
.sec10 .inner{
	position: absolute;
	top: 30%;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 51;
	text-align: center;
}
.sec10 .swiper-slide img{
	vertical-align: top;
}
.sec10 .swiper-pagination{
	position: static;
}
.sec10 .swiper-pagination-bullet{
	margin: 0 12px;
	width: 17px;
	height: 17px;
	border-radius: 0;
	opacity: 1;
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: 29.4% auto;
	background-position: center center;
	vertical-align: middle;
	cursor: pointer;
	background-image: url(../images/product_sec10_pagebullut.png);
}
.sec10 .swiper-pagination-bullet.swiper-pagination-bullet-active{
	background-size: 100% auto;
	background-image: url(../images/index_pagebullut_active.png);
}
.sec10 h3{
	position: relative;
	font-size: 38px;
	color: #fff;
	font-weight: normal;
}
.sec10 h3 img{
	position: absolute;
	left: 50%;
	top: 50%;
	height: 4.16em;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
}
.sec10 ul{
	margin: 6.73% 0 5.36%;
}
.sec10 li{
	display: inline-block;
	vertical-align: top;
	cursor: pointer;
	font-size: 18px;
	color: #fff;
	margin: 0 2.6%;
	padding-bottom: 0.44em;
	border-bottom: 1px solid transparent;
}
.sec10 li.active{
	color: #5fc7e2;
	border-bottom-color: #5fc7e2;
}
.sec10 .relativebox{
	position: relative;
}
.sec10 .swiper-next,.sec10 .swiper-prev{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	cursor: pointer;
}
.sec10 .swiper-next.swiper-button-disabled,.sec10 .swiper-prev.swiper-button-disabled{
	cursor: default;
	opacity: 0.5;
}
.sec10 .swiper-prev{
	right: 100%;
}
.sec10 .swiper-next{
	left: 100%;
}

@media only screen and (max-width:1430px){
	.sec4 .text-box h3{
		font-size: 35px;
	}
}
@media only screen and (max-width:1400px){
	.sec1 .right h5,.sec2 .text h5,.sec4 .text-box h3,.sec8 h5,.sec9 h3,.sec10 h3{
		font-size: 32px;
	}
	.sec1 .right p,.sec2 .text p,.sec3 h5,.sec4 .text-box p,.sec6 .left h5,.sec8 p,.sec9 p,.sec10 li{
		font-size: 15px;
	}
	.sec2 .img-box p,.sec6 .left p{
		font-size: 12px;
	}
	.sec3 h3{
		font-size: 35px;
	}
	.sec4 .text-box table{
		font-size: 14px;
	}
	.sec6 .left h3{
		font-size: 22px;
	}
	.sec6 .right h5{
		font-size: 18px;
	}
}
@media only screen and (max-width:1366px){
	.sec2 .text{
		margin-right: 0;
	}
	.sec2 ul{
		width: 72.3%;
	}
}
@media only screen and (max-width:1200px){
	.sec2 .img-box p{
		font-size: 10px;
	}
	.sec4 .img-box{
		margin-right: 5%;
	}
	.sec4 .text-box{
		width: 53.1%;
	}
}
@media only screen and (max-width:1100px){
	.sec4 .text-box h3{
		font-size: 30px;
	}
}
@media only screen and (max-width:1024px){
	.banner h5{
		font-size: 2rem;
	}


	.sec1 .right h5,.sec2 .text h5,.sec4 .text-box h3,.sec8 h5,.sec9 h3,.sec10 h3{
		font-size: 1.5rem;
	}
	.sec1 .right p,.sec2 .text p,.sec3 h5,.sec4 .text-box p,.sec6 .left h5,.sec8 p,.sec9 p,.sec10 li{
		font-size: 0.75rem;
	}

	.sec1{
		margin: 2rem 0 1rem;
	}
	.sec1 .left{
		width: 100%;
		margin-bottom: 3rem;
	}
	.sec1 .right{
		width: 100%;
	}
	.sec1 .right p{
		margin: 3rem 0 0.5rem;
	}
	.sec1 .right .img-box{
		max-width: 80%;
	}


	.sec2{
		margin-bottom: 2rem;
	}
	.sec2 .text{
		width: 100%;
		margin-right: 0;
		margin-bottom: 2rem;
	}
	.sec2 .text h5{
		margin-bottom: 3rem;
	}
	.sec2 ul{
		display: none;
	}
	.sec2 .img-box p{
		font-size: 0.625rem;
		padding: 1em 0;
	}
	.sec2 .swiper-container{
		width: 100%;
	}



	.sec3{
		background-position: 30% center;
	}
	.sec3 h3{
		font-size: 1.375rem;
	}


	.sec4{
		padding: 2rem 0 4rem;
	}
	.sec4 .img-box{
		width: 100%;
		margin-right: 0;
		margin-bottom: 2rem;
	}
	.sec4 .text-box{
		width: 100%;
	}
	.sec4 .text-box h3{
		font-size: 1.25rem;
	}
	.sec4 .text-box p{
		margin: 1rem 0 1.5rem;
	}
	.sec4 .text-box table{
		font-size: 0.625rem;
	}

	.sec5{
		padding-top: 2.5rem;
		padding-bottom: 1.5625rem;
		background-size: auto 100%;
	}
	.sec5 .img-box{
		width: 100%;
		margin-top: 0;
	}


	.sec6{
		margin: 2rem 0;
	}
	.sec6 .left{
		width: 100%;
		margin-right: 0;
		margin-bottom: 1.5rem;
	}
	.sec6 .left h3{
		font-size: 0.8125rem;
		margin-bottom: 0.625rem;
	}
	.sec6 .left p{
		font-size: 0.5625rem;
	}
	.sec6 .right{
		width: 100%;
	}
	.sec6 .right ul{
		background-size: 3px auto;
	}
	.sec6 .right h5{
		font-size: 0.875rem;
		margin-bottom: 1rem;
	}

	.sec7{
		margin-bottom: 2rem;
	}
	.sec7 p{
		font-size: 0.75rem;
		padding: 10% 5%;
	}


	.sec8{
		background-size: 100% auto;
		background-image: url(../images/product_sec8_bg_mobile.jpg);
		background-position: center 34%;
	}
	.sec8 .text{
		padding: 24rem 0 3rem;
		margin-right: 0;
	}
	.sec8 h5{
		margin-bottom: 1rem; 
	}
	.sec8 p{
		width: 100%;
	}


	.sec9{
		padding: 2rem 0;
	}
	.sec9 img{
		width: 92%;
	}


	.sec10 .swiper-pagination-bullet{
		margin: 0 0.5rem;
		width: 1rem;
		height: 1rem;
	}
	.sec10 .inner{
		height: 50%;
		top: 25%;
	}
	.sec10 .relativebox{
		position: static;
	}
	.sec10 .relativebox ul{
		display: none;
	}
	.sec10 .swiper-prev{
		right: 96%;
	}
	.sec10 .swiper-next{
		left: 96%;
	}
	.sec10 .swiper-container.swiper2{
		position: absolute;
		left: 0;
		top: 50%;
		text-align: center;
	}
	.sec10 .swiper2 p{
		display: inline-block;
		vertical-align: top;
		font-size: 0.75rem;
		padding-bottom: 0.44em;
		border-bottom: 1px solid transparent;
		color: #fff;
		text-align: center;
		margin-bottom: 1px;
	}
	.sec10 .swiper2 .swiper-slide.swiper-slide-active p{
		color: #5fc7e2;
		border-bottom-color: #5fc7e2;
	}
	.sec10 .swiper-pagination{
		position: absolute;
		bottom: -40%;
		width: 100%;
	}

}