﻿@charset "utf-8";
/* CSS Document */


* { margin:0; padding:0; list-style:none; text-decoration:none;border:0; font-style:normal; font-weight:normal; font-family:"微软雅黑";}
/*清楚浮动*/
.clearfix:after,.clearfix:before{ content:""; display:table;}
.clearfix:after{ clear:both;}
.clearfix{*zoom:1;}


/* =============banner=========== */
.banner {position:relative;}
.banner:after {content:""; display:block; width:100%; height:2px; background-color:#fff; position:absolute;bottom:2px;z-index:10;}
.banner_img{width:100%; height:550px;background-repeat:no-repeat; background-position:center top; background-size:cover;}


/* ==========logo,语言=========== */
.menu,.menu-close {display:none;}
.logo { position:absolute;top:20px;left:8%;z-index:9;width:14%; min-width:120px; max-width:160px;}
.public-lang{width: 80px;height: 25px;border-radius: 12px;background:rgba(0,0,0,.85);position: absolute;right:8%;top: 28px;z-index: 10;text-align: center;}
.public-lang a{display: inline-block;width: 30px;height: 19px; color:#fff;font-family: "微软雅黑";margin-top: 3px;line-height: 19px;border-radius: 7px;}
.public-lang a.on{background: rgba(255,255,255,.2);}


/* ================nav=========== */
.nav {diplay:block;text-align:center;padding:35px 0 35px 0;}
.nav li {display:inline-block; padding:0 3.5%;height:24px; line-height:24px; background:url(../images/lin1.jpg) right center no-repeat;}
.nav li:nth-of-type(5) {background:none;}
.nav li:last-of-type {display:none;}
.nav a {display:block;padding-bottom:4px;font-size:16px;color:#333; position:relative;}
.nav a:after {content:"";display:block;width:0;height:1px; background-color:#999; margin:0 auto; position:absolute;bottom:0;left:0;right:0;
-webkit-transition: all .7s;
   -moz-transition: all .7s;
    -ms-transition: all .7s;
     -o-transition: all .7s;
        transition: all .7s;
}
.nav a:hover:after {width:100%;}


/* ==============产品列表=========== */
body {width:100%; height:auto; background-color:#f5f5f5;}
.content {width:70%; margin:0 auto; overflow:hidden;}
.content .con_left {width:15%;padding-right:3%;float:left;}
.con_left ul {border:1px solid #cbcbcb; border-bottom:none;}
.con_left h1 {text-align:center;height:60px; line-height:60px;background:#dfdedc; font-size:24px;color:#333;}
.con_left li a {display:block;height:48px; line-height:48px;border-bottom:1px solid #cbcbcb; font-size:14px;color:#666;padding-left:5px;}
.con_left li:hover .big_tit {color:#000;}
.nTab .TabTitle .active  a{color:#000;}
.nTab .TabTitle .normal a {color:#666;}
.big_tit{background:url(../images/gai_sanjiao.png) no-repeat 8px center;text-indent:16px;}
.big_tit span {display:none;}
.none {display:none;}
.left_menu_body {display:none;}
.con_left li .left_menu_body a{padding-left:30px;background:url(../images/gai_dot.png) no-repeat 20px center; }
.con_left li .left_menu_body a:hover {color:#000;}
.cat_tit {background:#dadada;line-height:60px; text-indent:15px;}

.con_right {width:82%; float:left; }
.con_right ul li {width:24.25%; float:left;margin-right:1%; margin-bottom:20px;text-align:center;}
.con_right ul li:nth-of-type(4n) {margin-right:0;}
.con_right ul li a {display:block;border:1px solid #ccc;}
.con_right ul li .pic {overflow:hidden;background-color:#fff;}
.con_right ul li img { width:100%;
-webkit-transition: all 2s;
   -moz-transition: all 2s;
    -ms-transition: all 2s;
     -o-transition: all 2s;
        transition: all 2s;
}
.content .con_right ul li:hover img {
-webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
    -ms-transform: scale(1.1,1.1);
     -o-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1);
}
.content .con_right ul li p {height:40px; line-height:40px;font-size:14px;color:#202020;
-webkit-transition: all .7s;
   -moz-transition: all .7s;
    -ms-transition: all .7s;
     -o-transition: all .7s;
        transition: all .7s;
}
.content .con_right ul li:hover p{ background:#d8d7d6;}


/* =============页码=========== */
.page {width:100%;padding:30px 0 20px 0; text-align:center;}
.page span {display:inline-block;width:30px;height:30px; line-height:30px; cursor: pointer;margin:0 5px;color:#fff;background:#ccc;border-radius:50%;}
.page a {display:inline-block;width:30px;margin:0 5px; height:30px; line-height:30px; color:#555;}
.page a:hover { background:#ccc; color:#fff; border-radius:50%;color:#fff;}


/* ============footer=========== */
.footer p {width:100%; height:60px; line-height:60px; text-align:center;font-size:12px;color:#bababa;border-top:1px solid #A4A4A4;}



@media (max-width: 1024px) {
.content {width:84%;}
.content .con_left {width:20%;}	
.content .con_right {width:77%;}	
.con_right ul li {width:32%;margin-right:2%;}
.con_right ul li:nth-of-type(4n) {margin-right:2%;}
.con_right ul li:nth-of-type(3n) {margin-right:0;}
} 
@media (max-width: 768px) {
#slb .item {height:calc(100vh - 30px);background-position:80% top;}
.nav {position:absolute;top:0;left:0;width:100%; height:100vh; background-color:#fff; z-index:12; display:none;padding:0;}
.nav li {display:block;height:50px; line-height:50px;border-bottom:1px #000 solid; color:#000; background:none;padding:0;}
.nav li:last-of-type {display:block;}
.nav a:hover:after {width:0;}
.public-lang {display:none;}
.menu,.menu-close {display:block;position: absolute;top:21px;right:8%;z-index:10;background: rgba(0,0,0,0.5);width: 40px;height: 40px;text-align: center;line-height: 45px;border-radius: 9px;}
.menu-close {display:block;position: relative;top:21px;right:-87%;}	
	
.content .con_left {width:100%; padding-left:0; margin:40px 0;}	
.content .con_right {width:100%;}	
} 
@media (max-width: 640px) {
.content {width:90.625%;}
.con_right ul li {width:49%;}
.con_right ul li:nth-of-type(4n),.con_right ul li:nth-of-type(3n) {margin-right:2%;}
.con_right ul li:nth-of-type(2n){margin-right:0;}	
}

