@charset "utf-8";

div.pj-bt{
	text-align: center;
	margin-bottom: 10px;
}
div.pj-bt a{
	width: 150px;
	height: 35px;
	cursor: pointer;
	line-height: 35px;
	color: #333e46;
	font-weight:lighter;
	display: inline-block;
	text-align: center;
	position:relative;
	border:2px solid #6b737a;
}
div.pj-bt a:hover{
	color: #5b646a;
	border:2px solid #fee7bd;
	background: rgba(252,176,38,.3);
}
div.pj-bt a:first-child{margin-right:13px;}
div.pj-bt a:after{
	content:'';
	width:0%;
	height:100%;
	background:#fcb026;
	position:absolute;
	left:0;
	bottom:0;
	z-index:1;
}
div.pj-bt a font{
	position:relative;
	font-size: 16px;
	z-index:2;
}
div.pj-bt a.on{
	border-color:#fcb026;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
div.pj-bt a.on:hover{
	opacity:0.8;
}
div.pj-bt a.on:after{
	width:100%;
	transition:all 0.5s ease;
}
div.pj-bt a.in{
	border-color:#fcb026;
	-webkit-transition: none;
	transition: none;
}
div.pj-bt a.in:hover{
	opacity:0.8;
}
div.pj-bt a.in:after{
	width:100%;
}


#pj{
	background: url(pattern-2.jpg);
	height: auto;
	width: 100%;
	overflow: hidden;
	padding-top: 21px;
}

div.pj_dh{
	height: 40px;
}
div.pj_dh ul>li{
	float: left;
	height: 38px;
	line-height: 38px;
	margin-right: 25px;
	color: #666666;
	font-size: 14px;
}
div.pj_dh ul>li a{
	color: #666666;
	font-size: 14px;
	font-style: normal;
	display: block;
	height: 38px;
	transition: all 0.1s ease;
}
div.pj_dh ul>li a.hover{
	color: #ff3333;
	border-bottom: 2px solid #ff3333;
}
div.pj_dh a:hover{
	color: #ff3333;
	border-bottom: 2px solid #ff3333;
}


#pj .pj_nr{
	//border-top: 1px solid #dedede;
	height: auto;
	margin: 0 auto;
}
#pj .pj_nr .bt{
	height: 25px;
	line-height: 25px;
}
#pj .pj_nr .bt:first-child{
    margin-top: 15px;
}
#pj .pj_nr .bt strong{
	border-left: 3px solid #fe9225;
	font-size: 14px;
	color: #303133;
	padding-left: 10px;
}

#pj .pj_nr ul{
	width: 1410px;
	height: auto;
	overflow: hidden;
	padding: 20px;
	margin-left: -20px;
}

@media only screen and (min-width: 750px){
	#pj .pj_nr ul>li{
		width: 270px;
		height: auto;
		float: left;
		overflow: hidden;
		padding: 10px 20px;
		background: #fff;
		margin: 0 40px 38px 0;
		border-radius: 3px;
		transition: transform 0.25s ease;
	    transition-delay: 0s;
		transition-delay: 0.1s;
		box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1); 
	}
	#pj .pj_nr ul>li:hover{
		transform: translate(0, -10px);
	    
	}
}

#pj .pj_nr ul>li>a{
	width: 270px;
	height: 394px;
	display: block;
}

#pj .pj_nr ul>li>a h3{
	height: 40px;
	line-height: 20px;
	font-size: 14px;
	color: #666666;
	overflow: hidden;
}

#pj .pj_nr ul>li div.img_box{
	width: 270px;
	height: 270px;
	overflow:hidden;
	position:relative;
}
#pj .pj_nr ul>li div.img_box img{
	width:100%;
	height:100%;
	display:block;
}
#pj .pj_nr ul>li div.xh{
	width: 270px;
	height: 74px;
	position: relative;
}
#pj .pj_nr ul>li div.xh>p{
	height: 40px;
	line-height: 20px;
	color: #999999;
	font-size: 12px;
	overflow: hidden;
}
#pj .pj_nr ul>li div.xh object>a{
	width: 80px;
	height: 28px;
	display: block;
	text-align: center;
	line-height: 28px;
	color: #ff7200;
	border: 1px solid #ff7200;
	border-radius: 3px;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -35px;
	z-index: 1;
}
#pj .pj_nr ul>li div.xh object>a:hover{
	color: red;
	border: 1px solid red;
	text-decoration: none;
	background: #fef0e5;
}

@media (max-width: 1481px){
/*css 1200px*/
    #pj .pj_nr ul{
		width: 1250px;
		height: auto;
		overflow: hidden;
		padding: 20px;
		margin-left: -20px;
	}
	#pj .pj_nr ul>li{
		width: 236px;
		margin: 0 32px 30px 0;
	}
	#pj .pj_nr ul>li>a{
		width: 236px;
		height: 360px;
	}
	#pj .pj_nr ul>li div.img_box{
		width: 236px;
		height: 236px;
	}
	#pj .pj_nr ul>li div.xh{
		width: 236px;
		height: 74px;
		position: relative;
	}
/*css 1200px-end*/
}
@media (max-width: 1261px){
/*css 1000px*/
	#pj .pj_nr ul{
		width: 1050px;
		height: auto;
		overflow: hidden;
		padding: 20px;
		margin-left: -20px;
	}
	#pj .pj_nr ul>li{
		width: 186px;
	}
	#pj .pj_nr ul>li>a{
		width: 186px;
		height: 310px;
	}
	#pj .pj_nr ul>li div.img_box{
		width: 186px;
		height: 186px;
	}
	#pj .pj_nr ul>li div.xh{
		width: 186px;
		height: 74px;
		position: relative;
	}
/*css 1000px-end*/
}

@media (max-width: 1023px){
/*css 750px*/
	#pj {
	    min-height: 500px;
	    margin: 0 auto;
	    overflow: hidden;
	}
	div.pj_dh{
		height: auto;
	}
	div.pj_dh ul{
		height: auto;
		overflow: hidden;
		padding-bottom: 2px;
	}
	
	#pj .pj_nr ul{
		width: 800px;
	}

	#pj .pj_nr ul>li{
		width: 196px;
		padding: 10px 20px;
		float: left;
		background: #fff;
		margin: 0 21px 20px 0;
	}
	#pj .pj_nr ul>li>a{
		width: 196px;
		height: 320px;
	}
	#pj .pj_nr ul>li div.img_box{
		width: 196px;
		height: 196px;
	}
	#pj .pj_nr ul>li div.xh{
		width: 196px;
	}
/*css 750px-end*/
}
@media (max-width: 750px){
	div.pj_dh{
		padding-left: 2%;
	}
	div.pj_dh ul>li{
		margin-right: 8px;
	}
	#pj .pj_nr .bt{
		padding-left: 2%;
	}

	#pj .pj_nr ul{
		width: 100%;
	}

	#pj .pj_nr ul>li{
		width: 42%;
		padding: 2%;
		float: left;
		background: #fff;
		margin: 0 2% 4%;
	}
	#pj .pj_nr ul>li>a{
		width: 100%;
		height: auto;
		overflow: hidden;
	}
	#pj .pj_nr ul>li div.img_box{
		width: 100%;
		height: 12.55rem;
	}
	#pj .pj_nr ul>li div.xh{
		width: 100%;
	}

}


