@charset "utf-8";
/* CSS Document */
.banner-prodbg {
	position:relative;
	overflow:hidden;
	height:235px;
	background:url(../home/bg_valueadd_banner.jpg) center top no-repeat;
	background-size:auto 235px;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#216EB2', endColorstr='#3FBFE9',GradientType=0);
}

.banner-prod1 {
	position:absolute;
	top:0;
	left:175px;
	animation: banner-prodl 1s;
	-moz-animation: banner-prodl 1s;
	-webkit-animation: banner-prodl 1s;
	-o-animation: banner-prodl 1s;
}

.banner-prod2 {
	position:absolute;
	top:50px;
	right:280px;
	animation: banner-prodt 1s;
	-moz-animation: banner-prodt 1s;
	-webkit-animation: banner-prodt 1s;
	-o-animation: banner-prodt 1s;
}

@keyframes banner-prodl {
	from {
		top:-100px;
		opacity:0;
	} to {
		top:0px;
		opacity:1;
	}
}

@-moz-keyframes banner-prodl {
	from {
		top:-100px;
		opacity:0;
	} to {
		top:0px;
		opacity:1;
	}
}

@-webkit-keyframes banner-prodl {
	from {
		top:-100px;
		opacity:0;
	} to {
		top:0px;
		opacity:1;
	}
}

@-o-keyframes banner-prodl {
	from {
		top:-100px;
		opacity:0;
	} to {
		top:0px;
		opacity:1;
	}
}

@keyframes banner-prodt {
	from {
		right:-360px;
		opacity:0;
	} to {
		right:280px;
		opacity:1;
	}
}

@-moz-keyframes banner-prodt {
	from {
		right:-360px;
		opacity:0;
	} to {
		right:280px;
		opacity:1;
	}
}

@-webkit-keyframes banner-prodt {
	from {
		right:-360px;
		opacity:0;
	} to {
		right:280px;
		opacity:1;
	}
}

@-o-keyframes banner-prodt {
	from {
		right:-360px;
		opacity:0;
	} to {
		right:280px;
		opacity:1;
	}
}

.valueaddMessage{
	width:100%;
	height:auto;
	background:#F5F5F5;
	margin:0 auto;
	padding:80px 0 0;
}

.valueaddMessageMain{
	width:1120px;
	height:auto;
	margin:0 auto;
}

.valueaddMessageLeft{
	width:607px;
	height:auto;
	display:inline-block;
	float:left;
}

.valueaddMessageLeft h2{
	width:607px;
	height:auto;
	line-height:140%;
	font-size:32px;
	color:#555555;
	display:block;
}

.valueaddMessageLeft h2 i{
	color:#DF0027;
	font-style:normal;
}

.valueaddMessageLeftLine{
	width:57px;
	height:3px;
	background:#DF0029;
	display:block;
	margin-top:8px;
}

.valueaddMessageLeftContent{
	width:607px;
	height:auto;
	line-height:180%;
	font-size:16px;
	color:#5B5B5B;
	margin-top:28px;
}

.valueaddMessageRight{
	width:476px;
	height:auto;
	display:inline-block;
	float:right;
}

.valueaddMessageRight img{
	width:100%;
	height:auto;
	display:block;
}

.valueadd400{
	width:1120px;
	height:auto;
	margin:0 auto;
	padding:118px 0 154px;
}

.valueadd400Left{
	width:551px;
	height:auto;
	display:inline-block;
	float:left;
}

.valueadd400Left img{
	width:100%;
	height:auto;
	display:block;
}

.valueadd400Right{
	width:524px;
	height:auto;
	display:inline-block;
	float:right;
}

.valueadd400Right h2{
	width:524px;
	height:auto;
	line-height:140%;
	font-size:32px;
	color:#555555;
	text-align:right;
	display:block;
}

.valueadd400Right h2 i{
	color:#DF0027;
	font-style:normal;
}

.valueadd400RightLine{
	width:57px;
	height:3px;
	background:#DF0029;
	display:block;
	margin-top:8px;
}

.valueadd400RightContent{
	width:524px;
	height:auto;
	line-height:180%;
	font-size:16px;
	color:#5B5B5B;
	margin-top:28px;
}

.systemService { width:100%; height:39px; margin:39px auto 0; }
.systemService a { width:132px; height:39px; line-height:39px; font-size:17px; color:#fff; text-align:center; display:inline-block; margin-right:21px; }
.systemService a.a1 { background:#ff9300; }
.systemService a.a1:hover { background:#fbba62; transition:ease-in-out 0.5s; }
.systemService a.a2 { background:#df0029; }
.systemService a.a2:hover { background:#e8627b;	transition:ease-in-out 0.5s; }

@media screen and (max-width: 767px) {
	.banner-prodbg {
		position:relative;
		overflow:hidden;
		height:235px;
		background:url(../home/bg_valueadd_banner.jpg) center top no-repeat;
		background-size:auto 235px;
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#216EB2', endColorstr='#3FBFE9',GradientType=0);
	}
	
	.banner-prod1 {
		position:absolute;
		top:0;
		left:10%;
		animation: banner-prodl 1s;
		-moz-animation: banner-prodl 1s;
		-webkit-animation: banner-prodl 1s;
		-o-animation: banner-prodl 1s;
	}
	
	.banner-prod2 {
		position:absolute;
		top:50px;
		right:10%;
		animation: banner-prodt 1s;
		-moz-animation: banner-prodt 1s;
		-webkit-animation: banner-prodt 1s;
		-o-animation: banner-prodt 1s;
	}
	
	@keyframes banner-prodl {
		from {
			top:-100px;
			opacity:0;
		} to {
			top:0px;
			opacity:1;
		}
	}
	
	@-moz-keyframes banner-prodl {
		from {
			top:-100px;
			opacity:0;
		} to {
			top:0px;
			opacity:1;
		}
	}
	
	@-webkit-keyframes banner-prodl {
		from {
			top:-100px;
			opacity:0;
		} to {
			top:0px;
			opacity:1;
		}
	}
	
	@-o-keyframes banner-prodl {
		from {
			top:-100px;
			opacity:0;
		} to {
			top:0px;
			opacity:1;
		}
	}
	
	@keyframes banner-prodt {
		from {
			right:-360px;
			opacity:0;
		} to {
			right:10%;
			opacity:1;
		}
	}
	
	@-moz-keyframes banner-prodt {
		from {
			right:-360px;
			opacity:0;
		} to {
			right:10%;
			opacity:1;
		}
	}
	
	@-webkit-keyframes banner-prodt {
		from {
			right:-360px;
			opacity:0;
		} to {
			right:10%;
			opacity:1;
		}
	}
	
	@-o-keyframes banner-prodt {
		from {
			right:-360px;
			opacity:0;
		} to {
			right:10%;
			opacity:1;
		}
	}
	
	.valueaddMessage{
		width:96%;
		height:auto;
		background:#F5F5F5;
		margin:0 auto;
		padding:80px 2% 50px;
	}
	
	.valueaddMessageMain{
		width:100%;
		height:auto;
		margin:0 auto;
	}
	
	.valueaddMessageLeft{
		width:65%;
		height:auto;
		display:inline-block;
		float:left;
	}
	
	.valueaddMessageLeft h2{
		width:100%;
		height:auto;
		line-height:140%;
		font-size:32px;
		color:#555555;
		display:block;
	}
	
	.valueaddMessageLeft h2 i{
		color:#DF0027;
		font-style:normal;
	}
	
	.valueaddMessageLeftLine{
		width:57px;
		height:3px;
		background:#DF0029;
		display:block;
		margin-top:8px;
	}
	
	.valueaddMessageLeftContent{
		width:100%;
		height:auto;
		line-height:180%;
		font-size:20px;
		color:#5B5B5B;
		margin-top:28px;
	}
	
	.valueaddMessageRight{
		width:33%;
		height:auto;
		display:inline-block;
		float:right;
		margin-top:90px;
	}

	.valueaddMessageRight img{
		width:100%;
		height:auto;
		display:block;
	}
	
	.valueadd400{
		width:96%;
		height:auto;
		margin:0 auto;
		padding:60px 2%;
	}
	
	.valueadd400Left{
		width:33%;
		height:auto;
		display:inline-block;
		float:left;
		margin-top:90px;
	}

	.valueadd400Left img{
		width:100%;
		height:auto;
		display:block;
	}
	
	.valueadd400Right{
		width:65%;
		height:auto;
		display:inline-block;
		float:right;
	}
	
	.valueadd400Right h2{
		width:100%;
		height:auto;
		line-height:140%;
		font-size:32px;
		color:#555555;
		text-align:right;
		display:block;
	}
	
	.valueadd400Right h2 i{
		color:#DF0027;
		font-style:normal;
	}
	
	.valueadd400RightLine{
		width:57px;
		height:3px;
		background:#DF0029;
		display:block;
		margin-top:8px;
	}
	
	.valueadd400RightContent{
		width:100%;
		height:auto;
		line-height:180%;
		font-size:20px;
		color:#5B5B5B;
		margin-top:28px;
	}
	
	.systemService { width:100%; height:50px; margin:39px auto 0; }
	.systemService a { width:auto; height:50px; line-height:50px; font-size:22px; color:#fff; text-align:center; display:inline-block; margin-right:21px; padding:0 20px; }
	.systemService a.fR { width:auto; height:50px; line-height:50px; font-size:22px; color:#fff; text-align:center; display:inline-block; margin-left:21px; margin-right:0; padding:0 20px; }
	.systemService a.a1 { background:#ff9300; }
	.systemService a.a1:hover { background:#fbba62; transition:ease-in-out 0.5s; }
	.systemService a.a2 { background:#df0029; }
	.systemService a.a2:hover { background:#e8627b;	transition:ease-in-out 0.5s; }

}