@charset "utf-8";





#banner{

	width: 100%;

	min-width: 1200px;

	margin-top: 90px;

	position: relative;

	z-index: 0;

}

#banner .bannerCon{

	height: 375px;

	background: url(../img/banner_solution.jpg) no-repeat center center;

}



#main{

	min-height: 500px;

	padding-bottom: 50px;

}

#main .solutionTitle{

	overflow: hidden;

	position: relative;

	border-bottom: 1px solid #eee;

	padding: 25px 0;

	margin-bottom: 10px;

}

#main .solutionTitle .line{

	position: absolute;

	height: 5px;

	width: 12px;

	top: 36px;

	left: 4px;

	background-color: #f39800;

}

#main .solutionTitle h1{

	color: #0e6eb8;

	font-size: 24px;

	letter-spacing: 3px;

	padding-left: 25px;

}

#main .solutionTitle h5{

	color: #999;

	font-size: 12px;

	font-weight: normal;

	padding-left: 25px;

}

#main .solutionList{

	position: relative;

	margin:25px;

	overflow: hidden;

	background-color: #f1f1f1;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;

}
#main .solutionList:hover{
	box-shadow: 0 0px 25px rgba(0,0,0,0.03);
}

#main .solutionList .solutionPic{

	float: left;

	line-height: 0;

}
#main .solutionList .solutionPic img{
	width: 291px;
	height: 218px;
}
#main .solutionList .solutionCon{

	padding: 25px 25px 0;

	height: 100%;

	padding-left: 325px;

	position: relative;

}

#main .solutionList .solutionCon h1{
	position: relative;
	font-size: 20px;

	padding-bottom: 15px;

}
#main .solutionList .solutionCon h1 span{
	position: absolute;
	width: 10px;
	height: 3px;
	background-color: #0e6eb8;
	left: -15px;
	top: 10px;
}
#main .solutionList .solutionCon .describe{

	font-size: 16px;

	text-align: justify;

	color: #000;	

	overflow: hidden;

	text-indent: 2em;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

}

#main .solutionList .solutionCon .category{

	color: #0e6eb8;

	position: absolute;

	left: 315px;

	top: 175px;

}



#main .solutionList.picRight .solutionPic{

	float: right;

	line-height: 0;

}

#main .solutionList.picRight .solutionCon{

	padding: 25px 25px 0 35px;

	padding-right: 315px;

}

#main .solutionList.picRight .solutionCon .category{

	left: 25px;

}
@media screen and (max-width: 768px) {
	#header .menu ul li.product a span.cn{
	color: #1185de;
	border-bottom:0;
	}
	#header .menu ul li.product:hover a span.cn{
		color: #fff;
	}

	#banner{
		width: 100%;
		min-width: 100%;
		margin-top: 50px;
	}
	#banner .bannerCon{
		height: 50vw;
		background: url(../img/banner_solution.jpg) no-repeat center center;
		background-size: cover;
	}

	#main{
		min-height: 500px;
		padding: 0 3% 20px;
	}
	#main .solutionList{
		position: relative;
		margin:0px;
		overflow: hidden;
		margin-bottom: 3%;
	}

	#main .solutionList .solutionPic{
		float: none;
		line-height: 0;
	}
	#main .solutionList .solutionPic img{
		width: 100%;
	}
	#main .solutionList .solutionCon{
		padding: 20px;
		height: auto;
		position: relative;
	}

	#main .solutionList .solutionCon h1{
		position: relative;
		font-size: 20px;
		padding-bottom: 15px;
	}
	#main .solutionList .solutionCon h1 span{
		position: absolute;
		width: 10px;
		height: 3px;
		background-color: #0e6eb8;
		left: -15px;
		top: 10px;
	}
	#main .solutionList .solutionCon .describe{
		font-size: 16px;
		text-align: justify;
		color: #000;	
		overflow: hidden;
		text-indent: 2em;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	#main .solutionList .solutionCon .category{
		color: #0e6eb8;
		position: relative;
		left: 0;
		top: 0;
	}

	#main .solutionList.picRight .solutionPic{
		float: none;
		line-height: 0;
	}
	#main .solutionList.picRight .solutionCon{

		padding: 20px;

		padding-right: 0;

	}

	#main .solutionList.picRight .solutionCon .category{

		left: 0;

	}
}