@charset "utf-8";
/*详情页切换卡*/
.menu_show{
border-bottom:#cccccc 1px solid;
height:40px;
margin-bottom:10px;
}
.menu_show li{
width:400;
text-align:left;
height:40px;
font-size:13px;
line-height:40px;
float:left;
}
.menu_show li a{
width:200px;
text-align:center;
height:40px;
line-height:40px;
color:#1085D3;
display: inline-block;
border-top:#cccccc 1px solid;
border-left:#cccccc 1px solid;
border-right:#cccccc 1px solid;
border-radius:5px 5px 0 0;
float:left;
margin-right:5px;
}
.menu_show li.active a{
width:200px;
text-align:center;
height:40px;
line-height:40px;
color:#ffffff;
background-color:#1085D3;
border-radius:5px 5px 0 0;
border-top:#1085D3 1px solid;
border-left:#1085D3 1px solid;
border-right:#1085D3 1px solid;
float:left;
}
@media only screen and (max-width: 750px) {
.menu_show li{
width:25%;
}
.menu_show li a{
width:100%;
}
.menu_show li.active a{
width:100%;
}
}
/*一行三列显示*/
.BoxList {width:100%;}
.BoxList li{
	float: left; 
	width: 293px; 
	margin: 0px 10.5px 10px 0px; 
	border:#D4D4D4 1px solid;
	 background-image:url(/images/public/pro_bg.jpg);
	 background-repeat: no-repeat;
	 background-size:100% 100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	height:auto;
	}
.BoxList li img{
	width:100%;
	height:auto;
	}
.BoxList li:nth-child(3n+0){
	margin: 0px 0px 10px 0px; 
	}
.BoxList li a{position: relative; display: block;overflow: hidden;}
.BoxList li a>img{width: 100%;height:auto;}
.BoxList li a h3{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: rgba(0,0,0,0.7);
	color: #fff;
	font-size: 16px;
	padding: 6px;
	z-index: 2;
	transition: .3s;
	text-overflow:ellipsis;
	white-space: nowrap;
	overflow:hidden;}
.BoxList li a .hy-mask{position: absolute;top:0; left: 0;right:0;width: 100%; height: 100%;padding:10px;background-color: rgba(0,0,0,.4); text-align: center; color: #fff; opacity: 0;transform: translateY(30px); transition: .3s; z-index: 1;}
.BoxList li a .hy-mask p{padding-top: 0px;width:90%; text-align: left; font-size: 13px; line-height: 24px;}
.BoxList li a:hover h3{
	transition: all 0.5s;
	background-color: rgba(16,133,211,.8);
	}
.BoxList li a:hover img{
	transform:scale(1.14);
	transition: all 0.5s;
	filter: brightness(1.1);
	}
.BoxList li a:hover .hy-mask{transform: translateY(0);opacity:1;}
@media only screen and (max-width: 750px) {
.BoxList li{
	float:none;
	width:100%;
	margin: 10px 0px 10px 0px; 
	height:auto;
	}
}
/*详情页*/
.mobilecontent_top{display:none;}
.content_top{
	width:900px;
	height: 540px;
	margin:0 auto;
	padding:0px;
	overflow: hidden;
	background: #fff;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	 box-sizing:border-box; 
	}
.content_top_left{
	width:410px;
	height:auto;
	float: left;
	margin-right:20px;
	}
.content_top_right{float: left;width:470px; position:relative;}
.content_top_right .show_top1{
	background:#1085D3;
	font-size:15px;
	line-height:20px;
	color:#FFF;
	width:100%;
	padding:8px 10px 9px 10px;
	}
.content_top_right .show_top2{
padding:8px 8px 13px 10px;
background:url(/images/products/pro_class_bg.png) repeat-x left bottom;
line-height:20px; 
position:relative; 
color:#999;
width:100%;
}
.content_top_right .show_top3{
position:absolute;
right:0;
top:0;
right:18px;
margin-top:38px;
_margin-top:38px;
cursor:pointer;
}
.content_top_right .show_top4{
color:#1085D3;font-size:18px;line-height:20px;font-weight:bold;margin-top:20px;}
.content_top_right .show_top5{color:#888;font-size:14px;line-height:36px;margin-top:40px;line-height:26px;width:100%;}
.show{width: 410px;height: 410px;margin-bottom: 10px;position: relative;border:1px solid #E8E8E8;cursor:move}
.show img{width: 410px;height: 410px;}
.mask{width: 215px;height: 215px;background: #000;filter: Alpha(opacity=50);opacity:0.5;position: absolute;top: 0;left: 0;display: none;}
.bigshow{width: 430px;height: 430px;background-color:#FFF;overflow: hidden;display: none;border:1px solid #E8E8E8; position:absolute;top:0;}
.bigshow img{width: 900px;height: 900px;}
.smallshow{width: 100%;height: 70px;position: relative}
.smallshow img{width:100%;border:1px solid #e8e8e8;box-sizing: border-box;transition: all 0.5s}
.smallshow>.middle_box{margin-left: 30px;margin-right: 30px;width:364px;overflow: hidden;height: 70px;}
.smallshow .middle{overflow: hidden;transition: all 0.5s;height: 70px;}
.smallshow .middle>li{width: 64px;height: 64px;float: left;cursor:pointer;padding:0 4px;}
.smallshow>p{position: absolute;top:50%;width: 22px;height: 32px;margin-top: -16px;}
.smallshow>.prev{left: 0;background: url(/images/public/hover-prev.png) no-repeat;transition: all 0.5s}
.smallshow>.next{right: 0;background: url(/images/public/hover-next.png) no-repeat;transition: all 0.5s}
.smallshow>.prev.prevnone{left: 0;background: url(/images/public/prev.png) no-repeat;cursor: not-allowed}
.smallshow>.next.nextnone{right: 0;background: url(/images/public/next.png) no-repeat;cursor: not-allowed}
@media only screen and (max-width: 750px) {
.mobilecontent_top{display:block;}
.mobilecontent_top img{width:100%;height:auto;margin-bottom:6px;}
.content_top{width:100%;height:auto;}
.content_top_left{display:none;}
.content_top_right{float:none;width:100%;margin-bottom:14px;}
.content_top_right .show_top3{
position:absolute;
right:0;
top:0;
right:0px;
margin-top:38px;
_margin-top:38px;
cursor:pointer;
}
.bigshow{display:none;}
}
