.banner-tit {

	padding: 3%;

	background-color: #008cd6;

	float: left;

	width: 500px;

}

#pros1 {

	padding: 7rem 0;

	background-color: #f4f4f4;

}

.pro-list {

	display: block;

	width: 31.5%;

	float: left;

	margin-right: 2.2%;

	margin-bottom: 2rem;

}



.pro-list:nth-child(3n+1) {

	margin-right: 0;

}



.p-l-img {

	overflow: hidden;

}



.p-l-img img {

	width: 100%;

	display: block;

	height: 21vw;

	min-height: 378px;

}



.p-l-con {

	border-top: 1px solid #aaa;

	background-color: #fff;

	padding: 9%;

	box-sizing: border-box;

	width: 100%;

	position: relative;

	transition: all 0.7s;

}


.p-l-con .con .con-tit {
    font-size: 23px;
    margin-bottom: 10px;
    width: 100%;
    overflow: hidden;
    line-height: 1.9rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.p-l-con .con .con-des {

	color: #777;

	width: 95%;

	line-height: 1.7rem;

}


.p-l-con .con-jt {
    position: absolute;
    bottom: 25%;
    right: 10%;
    font-size: 20px;
    color: #777;
}



.pro-list:hover {

	box-shadow: 0 0 10px 2px #ddd;

}



.pro-list:hover .p-l-con {

	background-color: #008cd6;

}



.pro-list:hover div,
.pro-list:hover .con-des {

	color: #fff;

}

.prourl3 {

	display: block;

	border: 1px solid #008cd6;

	color: #008cd6;

	padding: 1% 2.5%;

	z-index: 9999;

	font-size: 18px;

	transition: all 0.7s;

	border-radius: 30px;

	width: 170px;

	margin: 0 auto;

	margin-top: 50px;

}



.prourl3:hover {

	background: #008cd6;

	color: #fff;

}

.p-l-con .con .con-des {
	width: 85%;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: break-spaces;
	height: 55px
}


.banner-tit2{
			padding: 3%;
			float: left;
			width:400px;
			
		}
		.banner-tit2 p{
			background-color: #008cd6;
			padding: 2%;
			float: left;
		}
		
		#pros2{
		
			padding: 7rem 0;
		
			background-color: #f4f4f4;
		
		}
		
		
		
		.pro-list2{
		
			margin-bottom: 1%;
		
			display: block;
		
			background-color: #fff;
		
		}
		
		
		
		.pro-list2 .p-l2-img {
    float: left;
    background-color: #fff;
    width: 75%;
    border-right: 1px solid #ddd;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}
		
		
		
		.pro-list2 .p-l2-img img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
		
		
		
		.con-des.con-des2{
		
		    line-height: 1.7rem;
		
		    margin: 2rem 0 4rem;
		
		}
		
		
		
		.pro-list2 .p-l2-con{
		
			float: right;
		
			position: relative;
		
			width: 25%;
		
			padding: 3%;
		
			transition: 0.7s;
		
		}
		
		.p-l2-con .con .con-tit{
		
			font-size: 25px;
		
			margin-bottom: 1%;
		
			line-height: 2rem;
		
		}
		
		.p-l2-con .con .con-des{
		
			font-size: 14px;
		
			line-height: 27px;
		
		}
		
		
		
		.p-l2-con .conurl {
		    border: 1px solid #008cd6;
		    color: #008cd6;
		    padding: 1% 2.5%;
		    z-index: 888;
		    font-size: 14px;
		    transition: all 0.7s;
		    border-radius: 30px;
		    width: 100px;
		    position: absolute;
		    left: 12%;
		    bottom: 0%;
		}
		
		
		
		.pro-list2:hover{
		
			box-shadow: 0 0 10px 2px #ddd;
		
		}
		
		
		
		.pro-list2:hover{
		
			background-color: #008cd6;
		
		}
		
		
		
		.pro-list2:hover div,.pro-list:hover .con-des{
		
			color: #fff;
		
		}
		
		
		
		.pro-list2:hover .conurl{
		
			color: #fff;
		
			border:1px solid #fff;
		
		}