﻿@import url("kefu.css");
.item {float:left;width:100%;border: 2px solid #fff;max-width:100%;overflow:hidden;}
.item a span{float:left;width:100%;height:30px;line-height:18px;color:#fff;text-align:center;overflow:hidden;position:absolute;bottom:0px;left:0px;z-index:4;font-weight:200;font-size:14px;}
.item a img{float:none;width:100%;height:100%;max-width:100%;max-height:100%;position:relative;z-index:0;transition: all 1.2s;}
.item a i{float:left;width:100%;height:30px;background:#333;filter:alpha(opacity=30);-moz-opacity:0.6;opacity:0.6;position:absolute;bottom:0px;left:0px;z-index:2;}

.item.aa {float:left;width:33.33%;max-width:100%;border: 2px solid #fff;overflow:hidden;}
.item.aa a:hover img{transform: scale(1.1);}
.item.aa a span{line-height:30px;display:none;bottom:45%;font-size:16px;}
.item.aa a p{float:left;width:100%;height:30px;display:none;line-height:30px;overflow:hidden;position:absolute;bottom:45%;left:0px;z-index:3;background:#333;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;}
.item.aa a i{float:left;width:100%;height:100%;display:none;background:#666;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;position:absolute;bottom:0px;left:0px;z-index:2;}




.item.bb {float:left;max-width:100%;margin-left:1%;margin-right:1%;height:100%;border: 0px solid #fff;border-radius:6px;max-height:100%;overflow:hidden;padding-bottom:0px;position:relative;box-shadow: 2px 2px 8px rgba(120,120,120,.3);margin-bottom:20px;}
.item.bb:hover{box-shadow: 2px 2px 8px rgba(120,120,120,.8);}
.item.bb a span{float:left;width:100%;background:#fdfcfa;color:#000;text-align:left;padding-left:10px;overflow:hidden;position:absolute;bottom:0px;left:0px;z-index:4;font-weight:200;font-size:14px;}
.item.bb a p{float:left;width:100%;height:30px;line-height:30px;overflow:hidden;position:absolute;bottom:0px;left:0px;z-index:3;display:none;background:#fff;}
.item.bb a img{float:none;width:100%;height:100%;max-width:100%;max-height:100%;position:relative;z-index:0;border-radius:0px;}
.item.bb a i{float:left;width:100%;height:100%;display:none;background:#fff;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;position:absolute;bottom:0px;left:0px;z-index:2;}
.medium-3.bb{width:23%}


.item.dd {float:left;max-width:100%;margin-left:1%;margin-right:1%;height:auto;border: 0px solid #fff;border-radius:6px;max-height:100%;overflow:hidden;padding-bottom:0px;position:relative;box-shadow: 2px 2px 8px rgba(120,120,120,0);margin-bottom:20px;}
.item.dd:hover{box-shadow: 2px 2px 8px rgba(120,120,120,.8);}
.item.dd a span{float:left;width:100%;color:#000;text-align:center;padding-top:10px;padding-left:20px;padding-right:20px;padding-bottom:10px;height:60px;line-height:23px;overflow:hidden;position:relative;z-index:4;font-weight:200;font-size:14px;}
.item.dd a img{float:none;width:100%;height:100%;max-width:100%;max-height:100%;position:relative;z-index:0;border-radius:0px;}
.medium-4.dd{width:31%}



.products #main-row div.item.dd img{position:relative;}



@media only screen and (max-width: 700px) {
.item.aa{width:50%}
.medium-3.bb{width:48%}
.medium-4.dd{width:48%}
.item.bb {border: 2px solid #fff;}
.item a span{font-size:0.8em;padding:0px 10px 0px 10px;}
.item.bb a span{font-size:0.8em;padding:4px 10px 0px 10px;}
}

h2.titile {float:left;width:100%;height:auto;}
#content h1{float:left;width:100%;height:auto;line-height:125%;margin-top:20px;padding-bottom:10px;border-bottom: 1px solid #efefef;font-size:1.8em;padding-left:6px;}
#content .content{float:left;width:100%;height:auto;line-height:27px;MIN-height:500px;color:#666;padding :0px 6px 0px 6px;}
#content .content p{float:left;width:100%;line-height:27px;padding:0;margin:0;}

#content .showvbox{float:left;width:100%;padding :0px 6px 0px 6px;}
#content .showbox{float:left;width:100%;height:100%;color:#666;margin-bottom:20px;border: 1px solid #efefef;position:relative;}
#content .showbox .pic{float:left;width:60%;max-width:60%;text-align:center;border-right: 1px solid #efefef;}
#content .showbox .pic img{width:100%;max-width:100%;}


#content .showbox .text{float:right;width:40%;max-width:40%;height:100%;}
#content .showbox .text .tool{float:left;width:100%;height:80px;border-bottom: 1px solid #efefef;}
#content .showbox .text .title{float:left;width:100%;padding:30px 20px 10px 20px;line-height:27px;}
#content .showbox .text .con{float:left;width:100%;padding:30px;padding-bottom:80px;}

#content .showbox .text .go{display:inline-block;position:absolute;bottom:40px;right:0%;width:40%;text-align:center;}
#content .showbox .text .go a{display:inline-block;width:100px;height:40px;text-align:center;line-height:40px;color:#666;border: 1px solid #efefef;background:#fcc457;border-radius:4px;}
#content .showbox .text .go a:hover{background:#fff;color:#ff0000;}



@media only screen and (max-width: 900px) {
#content .showbox .pic{width:100%;max-width:100%;border-right: 0px solid #efefef;border-bottom: 1px solid #efefef;}
#content .showbox .text{float:left;width:100%;max-width:100%;}
#content .showbox .text .go{bottom:20px;width:100%;}
}


#content .showbox .paginate{
	padding:20px 30px;
	margin-bottom: 0;
	height:80px;
	border-bottom:1px solid #e5e5e5;
}
#content .showbox .paginate .prev,
#content .showbox .paginate .next,
#content .showbox .paginate .list{top:20px;}
.products .next{width:50px;padding:0px;}
.paginate{
	width: 100%;
	height:40px;
	margin:0 auto 20px;
	position:relative;
}

.paginate .prev,
.paginate .next,
.paginate .list{position:absolute;top:0;}

.paginate .prev{left:20px;}
.paginate .list{left:50%;margin-left:-20px;}
.paginate .next{right:20px;}

.paginate a,
.paginate span{display:block;width:40px;height:40px;}


.paginate .list a{position:relative;padding: 10px;}
.paginate .list a span{
	width: 20px;
	height: 20px;
	overflow:hidden;
	position: relative;
}
.paginate .list a i{
	display:block;
	position:absolute;
	background-color:#000;
	width:6px;
	height:0;
	-webkit-transition-property: height, -webkit-transform;
	   -moz-transition-property: height, -moz-transform;
	     -o-transition-property: height, -o-transform;
	        transition-property: height, transform;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
	     -o-transition-duration: 0.5s;
	        transition-duration: 0.5s;
	-webkit-transition-timing-function: cubic-bezier(.75,0,.3,1);
	   -moz-transition-timing-function: cubic-bezier(.75,0,.3,1);
	     -o-transition-timing-function: cubic-bezier(.75,0,.3,1);
	        transition-timing-function: cubic-bezier(.75,0,.3,1);
}

.paginate .list a i.c1{ left:0px; }
.paginate .list a i.c2{ left:7px; }
.paginate .list a i.c3{ left:14px; }

.paginate .list a i.c1.b1{ height:7px; 	-webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	-o-transform: translate(0, 0); 		transform: translate(0, 0); }
.paginate .list a i.c1.b2{ height:7px; 	-webkit-transform: translate(0, 8px); 	-moz-transform: translate(0, 8px); 	-o-transform: translate(0, 8px); 	transform: translate(0, 8px); }
.paginate .list a i.c1.b3{ height:7px; 	-webkit-transform: translate(0, 40px); 	-moz-transform: translate(0, 40px); -o-transform: translate(0, 40px); 	transform: translate(0, 40px); }
.paginate .list a i.c2.b1{ height:10px; -webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	-o-transform: translate(0, 0); 		transform: translate(0, 0); }
.paginate .list a i.c2.b2{ height:7px; 	-webkit-transform: translate(0, 11px); 	-moz-transform: translate(0, 11px); -o-transform: translate(0, 11px); 	transform: translate(0, 11px); }
.paginate .list a i.c2.b3{ height:7px; 	-webkit-transform: translate(0, 35px); 	-moz-transform: translate(0, 35px); -o-transform: translate(0, 35px); 	transform: translate(0, 35px); }
.paginate .list a i.c3.b1{ height:5px; 	-webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	-o-transform: translate(0, 0); 		transform: translate(0, 0); }
.paginate .list a i.c3.b2{ height:7px; 	-webkit-transform: translate(0, 6px); 	-moz-transform: translate(0, 6px); 	-o-transform: translate(0, 6px); 	transform: translate(0, 6px); }
.paginate .list a i.c3.b3{ height:7px; 	-webkit-transform: translate(0, 33px); 	-moz-transform: translate(0, 33px); -o-transform: translate(0, 33px); 	transform: translate(0, 33px); }

.paginate .list a:hover i.c1.b1{ height:7px; 	-webkit-transform: translate(0, -8px); 	-moz-transform: translate(0, -8px);	 -o-transform: translate(0, -8px); 	transform: translate(0, -8px); }
.paginate .list a:hover i.c1.b2{ height:7px; 	-webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	 -o-transform: translate(0, 0); 	transform: translate(0, 0); }
.paginate .list a:hover i.c1.b3{ height:7px; 	-webkit-transform: translate(0, 8px); 	-moz-transform: translate(0, 8px); 	 -o-transform: translate(0, 8px); 	transform: translate(0, 8px); }
.paginate .list a:hover i.c2.b1{ height:10px; 	-webkit-transform: translate(0, -11px); -moz-transform: translate(0, -11px); -o-transform: translate(0, -11px); transform: translate(0, -11px); }
.paginate .list a:hover i.c2.b2{ height:10px; 	-webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	 -o-transform: translate(0, 0); 	transform: translate(0, 0); }
.paginate .list a:hover i.c2.b3{ height:7px; 	-webkit-transform: translate(0, 11px); 	-moz-transform: translate(0, 11px);  -o-transform: translate(0, 11px); 	transform: translate(0, 11px); }
.paginate .list a:hover i.c3.b1{ height:5px; 	-webkit-transform: translate(0, -6px); 	-moz-transform: translate(0, -6px);  -o-transform: translate(0, -6px); 	transform: translate(0, -6px); }
.paginate .list a:hover i.c3.b2{ height:5px; 	-webkit-transform: translate(0, 0); 	-moz-transform: translate(0, 0); 	 -o-transform: translate(0, 0); 	transform: translate(0, 0); }
.paginate .list a:hover i.c3.b3{ height:7px; 	-webkit-transform: translate(0, 6px); 	-moz-transform: translate(0, 6px); 	 -o-transform: translate(0, 6px); 	transform: translate(0, 6px); }
.hover-line-links a > span:after, a.hover-line > span:after
{
        content: '';
    height: 1px;
    width: 0%;
    position: absolute;
    top: 50%;
    left: 110%;
    background-color: #000;
    -webkit-transition: width 500ms, left 500ms;
    -moz-transition: width 500ms, left 500ms;
    -o-transition: width 500ms, left 500ms;
    transition: width 500ms, left 500ms;
 }

.paginate .prev a:before,
.paginate .prev a:after,
.paginate .next a:before,
.paginate .next a:after,
.paginate .prev span:before,
.paginate .prev span:after,
.paginate .next span:before,
.paginate .next span:after{
	content:'';
	position:absolute;
	left:50%;
	top:50%;
	width:10px;
	height:2px;
	background-color:#171717;
	border-radius:1px;
	margin-left:-4px;

	-webkit-transform-origin:50% 50%;
	   -moz-transform-origin:50% 50%;
	    -ms-transform-origin:50% 50%;
	     -o-transform-origin:50% 50%;
	        transform-origin:50% 50%;
	-webkit-transition: margin-left 0.5s ease-out, -webkit-transform 0.5s ease-out;
	   -moz-transition: margin-left 0.5s ease-out, -moz-transform 0.5s ease-out;
	     -o-transition: margin-left 0.5s ease-out, -o-transform 0.5s ease-out;
	        transition: margin-left 0.5s ease-out, transform 0.5s ease-out;

}



.paginate .prev span:before,
.paginate .prev span:after,
.paginate .next span:before,
.paginate .next span:after{
	background-color:#d1d1d1;
}
.paginate .prev a:before,
.paginate .prev span:before{
	margin-top:-4px;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}

.paginate .prev a:after,
.paginate .prev span:after{
	margin-top:2px;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}

.paginate .prev a:hover:before{
	margin-left:-8px;
	-webkit-transform: rotate(135deg);
	   -moz-transform: rotate(135deg);
	    -ms-transform: rotate(135deg);
	     -o-transform: rotate(135deg);
	        transform: rotate(135deg);
}

.paginate .prev a:hover:after{
	margin-left:-8px;
	-webkit-transform: rotate(-135deg);
	   -moz-transform: rotate(-135deg);
	    -ms-transform: rotate(-135deg);
	     -o-transform: rotate(-135deg);
	        transform: rotate(-135deg);
}



.paginate .next a:before,
.paginate .next span:before{
	margin-top:-4px;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}

.paginate .next a:after,
.paginate .next span:after{
	margin-top:2px;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}

.paginate .next a:hover:before{
	margin-left:0px;
	-webkit-transform: rotate(-135deg);
	   -moz-transform: rotate(-135deg);
	    -ms-transform: rotate(-135deg);
	     -o-transform: rotate(-135deg);
	        transform: rotate(-135deg);
}

.paginate .next a:hover:after{
	margin-left:0px;
	-webkit-transform: rotate(135deg);
	   -moz-transform: rotate(135deg);
	    -ms-transform: rotate(135deg);
	     -o-transform: rotate(135deg);
	        transform: rotate(135deg);
}





footer{border-top:1px solid #e1e1e1}
footer .upper-footer:after{border-top:1px solid #e1e1e1;}
.inline li{margin-bottom:10px;}

#sitemap .columns ul{margin-top:4px;}
#sitemap .columns ul li a{color:#666;}

#homepage-block-a .content img{width:200px;height:180px;}
#main_banner_{float:left;max-width:100%;height:100%;margin-top:50px;}

@media screen and (min-width: 721px){.homead{padding:10px 0 4px}}

@media only screen and (max-width: 700px) {
#main_banner_{float:left;max-width:100%;height:100%;margin-top:0px;margin-bottom:2px;}
.sidenav a{font-family:"黑体";}
}
.products .sidenav a, .products .sidenav a:visited{color:#999;}
.products .sidenav a.on, .products .sidenav a.on{color:#ff0000;}



#page_loading{float:left;position:fixed;margin:0 auto;z-index:99999999;top:0px;left:0px;width:100%;height:100%;background:#fff;}
#page_loading_in{height:60px;width:60px;position:fixed;left:50%;top:50%;margin-top:-20px;margin-left:-20px;font-size:200%;background:url(../img/loading.gif) no-repeat center center;}

.powered{float:left;width:100%;height:20px;line-height:20px;color:#bbb;font-size:0.5em;}
.powered a{color:#bbb;}
.copyright{float:left;width:100%;height:24px;line-height:24px;color:#555;font-size:0.8em;}
.copyright a{color:#555;}


/*-返回页首-*/
#back-to-top{ position:relative;z-index:200;
    position:fixed;
    bottom:30px;
    right:1px;
display:none;
}
div#back-to-top a{cursor:pointer;
    text-align:center;
    text-decoration:none;
    color:#d1d1d1;
    display:block;
    width:40px;
    /*使用CSS3中的transition属性给跳转链接中的文字添加渐变效果*/
    -moz-transition:color 1s;
    -webkit-transition:color 1s;
    -o-transition:color 1s;
filter:alpha(opacity=80); /*IE滤镜，透明度50%*/
-moz-opacity:0.8; /*Firefox私有，透明度50%*/
opacity:0.8;/*其他，透明度50%*/
}
div#back-to-top a:hover{
    color:#979797;
filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
-moz-opacity:1; /*Firefox私有，透明度50%*/
opacity:1;/*其他，透明度50%*/

}
div#back-to-top a span{
    background:transparent url(../../gotop.png) no-repeat;
    border-radius:3px 0px 0px 3px;
    display:block;
    height:40px;
    width:40px;
    margin-bottom:5px;
    /*使用CSS3中的transition属性给<span>标签背景颜色添加渐变效果*/
    -moz-transition:background 1s;
    -webkit-transition:background 1s;
    -o-transition:background 1s;
}
#back-to-top a:hover span{
    background:transparent url(../../gotop.png) no-repeat;
filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
-moz-opacity:1; /*Firefox私有，透明度50%*/
opacity:1;/*其他，透明度50%*/
}


@media only screen and (max-width: 480px) {
#back-to-top{ position:relative;z-index:200;width:0px;height:0px;
    position:fixed;
    bottom:30px;
    right:1px;
display:none;
}
}