body{
	background-repeat:no-repeat;
	background-image:url(../images/solution_l2_bg.jpg);
	background-size:100% auto;
	background-position:25vw 100vw;
}

.common-tab a{
	width: 15em;
}



section .title{
	text-align:center;
}
section .title h3{
	font-size:3em;
	font-weight:500;
	line-height: 1.33;
}



.sec1{
	padding:5% 0 4.95%;
}
.sec1 .title{
	margin-bottom:7%;
}
.sec1 .title h3{
	color:var(--theme-blue);
	margin-bottom:0.67em;
}
.sec1 .title ul{
	display:inline-block;
	vertical-align:top;
	list-style-type:disc;
	padding-left:1em;
	font-size: 1.125em;
	line-height: 1.78;
	text-align:left;
}
.sec1 .video-box{
	position:relative;
	overflow:hidden;
}
.sec1 .video-box .swiper.gallery{
	border-radius:0.9375em;
}
.sec1 .video-box .swiper.thumbs{
	position:absolute;
	right:1.74%;
	bottom:3.74%;
}
.sec1 .video-box .swiper.thumbs .swiper-slide{
	width:11.875em;
	border-radius:0.625em;
	cursor:pointer;
	border:1px solid rgba(255,255,255,0.5);
	backdrop-filter: blur(0.6875em);
	background-color: rgba(255, 255, 255, 0.15);
	padding:0.5em;
}
.sec1 .video-box .swiper.thumbs .img-box{
	position:relative;
	border: 1px solid rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(0.6875em);
	border-radius: 0.625em;
	overflow:hidden;
}
.sec1 .video-box .swiper.thumbs .swiper-slide-thumb-active .img-box{
	border-color:#fff;
}
.sec1 .video-box .swiper.thumbs .img-box::before{
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#000;
	opacity:0.73;
}
.sec1 .video-box .swiper.thumbs .swiper-slide-thumb-active .img-box::before{
	opacity:0;
}
.sec1 .video-box .bg{
	width:100%;
	height:100%;
	object-fit:cover;
	vertical-align:top;
}
.sec1 .video-box .cover{
	background-color:rgba(0,0,0,0.55);
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	display:none;
}
.sec1 .video-box .cover.active{
	display:block;
}
.sec1 .video-box .play{
	width:5em;
	height:5em;
	border-radius:50%;
	background-color:#fff;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-2.5em;
	margin-top:-2.5em;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
}
.sec1 .video-box .play::before{
	content:"";
	border-radius:50%;
	background-color:#fff;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	animation:sec1play 2s infinite;
}
@keyframes sec1play{
	100%{
		transform:scale(1.7);
		opacity:0;
	}
}
.sec1 .video-box .play::after{
	content:"\f04b";
    font-family: 'FontAwesome';
    font-weight: 900;
    color:var(--theme-blue);
    font-size:1.5em;
    margin-left:0.25em;
    position:relative;
    z-index:1;
}



.sec2{
	padding:4.95% 0 14%;
}
.sec2 .title{
	margin-bottom:3%;
}
.sec2 .flex-box{
	display:flex;
	align-items:stretch;
	justify-content:flex-start;
	flex-direction:row;
	background-color:#F1F2F6;
	border-radius:0.9375em;
	overflow:hidden;
}
.sec2 .video-box{
	width:70%;
	overflow:hidden;
	border-radius:0.9375em;
}
.sec2 .video-box video{
	display:none;
	width:100%;
	object-fit:cover;
}
.sec2 .video-box video.active{
	display:block;
}
.sec2 .text-box{
	width:30%;
	display:flex;
	align-items:flex-start;
	justify-content:center;
	padding-top:5.625em;
}
.sec2 .text-box > div{
	max-width:85%;
}
.sec2 .text-box h5{
	color:#999;
	font-size:1.75em;
	font-weight:normal;
	margin-bottom:1.2em;
}
.sec2 .text-box h5 span{
	cursor:pointer;
	transition:color 0.3s;
	border-bottom:1px solid #999;
	display:inline-block;
	padding:0.5em 0;
}
.sec2 .text-box h5 span:first-child{
	padding-top:0;
}
.sec2 .text-box h5 span:last-child{
	border-bottom:0 none;
	padding-bottom:0;
}
.sec2 .text-box h5 span.active{
	color:var(--theme-blue);
}
.sec2 .text-box li{
	display:none;	
}
.sec2 .text-box li.active{
	display:block;
}
.sec2 .text-box p{
	font-size:1.125em;
	color:#666;
	line-height:2.22;
	padding-left:1em;
	display:flex;
}
.sec2 .text-box p i{
	display:block;
	width:0.3em;
	height:0.3em;
	background-color:#666;
	margin-left:-1em;
	margin-right:0.7em;
	border-radius:50%;
	font-style:normal;
	margin-top:0.96em;
	flex-shrink:0;
}



.sec3{
	padding:5.73% 0 7.3%;
	display:none;
}
.sec3 .scroll-box{
	overflow-x:auto;
}
.sec3 table{
	width:100%;
	border:1px solid #ccc;
	border-radius:0.9375em;
	text-align:justify;
	border-collapse:separate;
	table-layout:fixed;
	background: linear-gradient(180deg, #FFFFFF 0%, #E9F4FF 100%);
	padding:0.5em 3.75em 3.375em;
}
.sec3 table td{
	border-bottom:1px solid #ccc;
	padding:0.875em 2.25em;
}
.sec3 table h5{
	font-size:1.25em;
	color:var(--theme-blue);
	padding:1.75em 0;
}
.sec3 table p{
	font-size:1.125em;
	line-height:2.78;
}
.sec3 table p.dot{
	padding-left:1em;
	display:flex;
}
.sec3 table p.dot i{
	display:block;
	width:0.3em;
	height:0.3em;
	background-color:#333;
	margin-left:-1em;
	margin-right:0.7em;
	border-radius:50%;
	font-style:normal;
	margin-top:1.24em;
	flex-shrink:0;
}




.sec4{
	padding:4.95% 0 14%;
}
.sec4 .title{
	margin-bottom:3%;
}
.sec4 .flex-box{
	background: linear-gradient(261.69deg, #E9F4FF 0.33%, #FFFFFF 53.42%, #E9F4FF 99.81%);
	border: 1px solid #eee;
	border-radius: 0.625em;
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	flex-direction:row;
	padding:5.28% 7.14% 5.78%;
}
.sec4 h5{
	font-size:1.75em;
	line-height:1.32;
	color:var(--theme-blue);
	margin-bottom:0.7em;
}
.sec4 ul{
	font-size:1.125em;
	line-height:2.22;
	color:#666;
	list-style-type:disc;
	padding-left:1em;
}
.sec4 .box{
	margin-right:3%;
	max-width:48.5%;
}
.sec4 .box:last-child{
	margin-right:0;
}
@media only screen and (min-width:1025px){
	.sec2 .text-box h5 span:hover{
		color:var(--theme-blue);
	}
}
@media only screen and (max-width:1024px){
	body{
		background-size:150% auto;
		background-position:10vw 220vw;
	}




	.sec1{
		padding:10% 0 7.5%;
	}
	.sec1 .title{
		margin-bottom:10%;
	}
	.sec1 .video-box .swiper.thumbs{
		position:static;
		margin-top: 5%;
	}
	.sec1 .video-box .swiper.thumbs .swiper-slide{
		border:1px solid rgba(0,0,0,0.5);
		background-color: rgba(0, 0, 0, 0.5);
	}
	.sec1 .video-box .swiper.thumbs .img-box{
		border: 1px solid rgba(0, 0, 0, 0.5);
	}
	.sec1 .video-box .swiper.thumbs .swiper-slide-thumb-active .img-box{
		border-color:#000;
	}
	.sec1 .video-box .play{
		width:4em;
		height:4em;
		margin-left:-2em;
		margin-top:-2em;
	}



	.sec2{
		padding:7.5% 0 30%;
	}
	.sec2 .title{
		margin-bottom:10%;
	}
	.sec2 .flex-box{
		display:block;
	}
	.sec2 .video-box{
		width:100%;
	}
	.sec2 .text-box{
		width:100%;
		padding:3em 0;
	}




	.sec4{
		padding:7.5% 0 30%;
	}
	.sec4 .title{
		margin-bottom:10%;
	}
	.sec4 .flex-box{
		display:block;
		padding:10% 5%;
	}
	.sec4 .box{
		margin-bottom: 10%;
		margin-right:0;
		max-width:100%;
	}
	.sec4 .box:last-child{
		margin-bottom: 0;
	}
}