﻿.dh{
	width: 100%;
	max-width: 1920px;
	overflow: hidden;
}
.dh ul{position: relative; 
	width:100%;
	height: 430px; 
	overflow: hidden;
	margin: 0px;
	padding: 0px;
}
.dh ul li.curr{width:36%;}
.dh ul li.curr1{width: 16%;}
.dh ul li.curr2{width: 16%;}
.dh ul li.curr3{width: 16%;}
.dh ul li.curr4{width: 16%;}


.dh ul li{float: left;
	width:16%;
	overflow: hidden; 
	height:100%; 
	position: relative;
	cursor: pointer;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-ms-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s;
}
.dh ul:hover li{
	width: 16%;
}
.dh ul li:hover{
	width: 36%;
}

.dh ul li img{display: block;}
.dh ul li a{display: block; width: 100%;height: 100%;}
.dh ul li .layer{position: absolute;bottom: 0;left: 0;width: 100%;background:rgba(27,29,36,0.0);height:100%;}
.dh ul li .layer .p1{position: absolute; top: 15%; width: 100%;}
.dh ul li .layer .p2{position: absolute; top: 50%; width: 100%;;}
.dh ul li .layer .p2 b,.dh ul li .layer .p2 span{display: block;}
.dh ul li .layer .p1 b,.dh ul li .layer .p1 span{display: block;}
.dh ul li .layer a,.dh ul li .layer a:hover{
	padding:2px 15px 2px 15px;
	border: #fff solid 1px;
	width: 100px;
	text-align: center;
    margin-left: 5%;
	color: #fff;
	border-radius: 20px;
}
/*.dh ul li .layer .p2 a:hover{
	border: #f7f7f7 solid 1px;
	color: #f7f7f7;
	
} */

/* .dh ul li.curr .layer .p1{left: -200%;}
.dh ul li.curr .layer .p2{left: 10px;} */


.dh ul li .layer .p2{
	text-align: left;

	color:#fff;
	font-weight: bold;
}

.col1{color: #fff; font-size: 30px;width: 200px; margin-left: 5%;  font-weight: bold;
text-align: left;

}
.col2{color: #fff; margin-left:5%; font-size: 14px; font-weight: 700;
width: 200px;
	height: 100px;
	line-height: 35px;
	text-align: left;
}
/*屏幕宽度为768px以下，手机版*/

@media screen and (max-width: 767px) {
	.dh ul{
		width: 100%;
		height: auto;
	}
	.dh ul li{
		width: 100%;
		margin-bottom: 2px;
		float: none;
	}
	.dh ul:hover li{
	width: 100%;
}
.dh ul li:hover{
	width: 100%;
}
	.dh ul li.curr{width:100%;}
.dh ul li.curr1{width: 100%;}
.dh ul li.curr2{width: 100%;}
.dh ul li.curr3{width: 100%;}
	.dh ul li.curr4{width: 100%;}
	.dh ul li img{
		width: 100%;
		height: auto;
	}
	.dh ul li .layer .p1{position: absolute; top: 5%; width: 100%;
		overflow: hidden;
	}
	.col1{
		padding: 1%;
		padding-top: 3%;
	}
	.col2{
		padding: 1%;
	}
	.dh ul li .layer .p2{position: absolute; top: 60%; width: 100%;;}
}
