@charset "utf-8";
/* CSS Document */
body{margin:0;padding:0; font:12px Arial, "microsoft yahei"; color:#333; background:#eee;}
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0; }

ul,li,ol{list-style:none;}

a{text-decoration:none; color:#333;}
a:hover{text-decoration:none; color:#4cb035;}
.clear{clear:both;}
img{border:0}

.l{ float:left;}
.r{ float:right;}

input,textarea,select{  font-family:"Microsoft YaHei"; font-size:12px;}
input:focus,textarea:focus,select:focus{ outline:none;}


/* header */
.header{ width:100%; height:50px; background:#4cb035; position:relative;}
.header_logo{ margin-left:12px; height:26px; padding:12px 0;}
.header_nav a{position: absolute;z-index:99; right:0; border:none; background:url(../images/icon_open.png) 10px 10px no-repeat; width:50px; height:50px; display:block; cursor:pointer; outline:none;}
.header_nav a.active{position: fixed;  background:rgba(0, 0, 0, 0.9) url(../images/icon_close.png) 10px 10px no-repeat; margin-right:100px; border:none; outline:none; -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}

.cbp-spmenu{background:rgba(0, 0, 0, 0.9); position: fixed;z-index:9999;}
.cbp-spmenu h3{color:#fff; font-size:16px; line-height:50px; height:50px; margin:0; font-weight:bold; background:rgba(0, 0, 0, 0.2); padding-left:16px;}
.cbp-spmenu-right{right: -100px; width:100px; height:100%; top:0; z-index:1000;}
.cbp-spmenu-right.cbp-spmenu-open{right:0px;}
.cbp-spmenu,.cbp-spmenu-push{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}

.subNavBox{width:100%; border-top:solid 1px #333; margin:0 auto;}
.subNav{border-bottom:solid 1px #333; cursor:pointer; font-weight:bold; line-height:50px; padding-left:16px;}
.subNav a{ font-size:14px; color:#fff;}
.subNav:hover{color:#fff; background:#4cb035; border-bottom:solid 1px #4cb035;}
.navContent{display: none; border-bottom:solid 1px #333;}
.navContent li a{display:block; width:100%; heighr:40px; background:#444; padding-left:30px; font-size:14px; line-height:40px; color:#999; border-bottom:solid 1px #555;}
.navContent li a:hover{color:#fff; background:#4cb035;}


/* banner */
.banner{position:relative; overflow:hidden; margin:0 auto;}
.banner .hd{ position: absolute; bottom:8px; text-align: center; width: 100%;}
.banner .hd li{display: inline-block; width:8px; height:8px; margin: 0 4px; background: #fff; filter: alpha(Opacity=60); opacity: .6; text-indent:-100px; border-radius:4px; overflow:hidden; }
.banner .hd li.on{ filter: alpha(Opacity=100); opacity: .9; background: #4cb035; width:20px; height:8px;}
.banner .bd{position:relative; z-index:0;}
.banner .bd li{position:relative; text-align:center;}
.banner .bd li img{background:url(../images/loading.gif) center center no-repeat;  vertical-align:top; width:100%;}
.banner .bd li a{-webkit-tap-highlight-color:rgba(0,0,0,0);}


/* nav */
.nav { width:100%; overflow:hidden; padding:0; background:#fff;}
.nav ul{ width:100%; overflow:hidden; margin:auto; padding:10px 0 5px;}
.nav a{ display:block; width: 33.33%; overflow: hidden; float:left;text-align: center; margin:5px 0;}
.nav a span { height:32px; line-height:32px; font-size:12px;}
.nav a img { display:block; width:40%; margin:auto; }

/* about */
.about{ width:96%; padding:20px 2% 10px; background:#f1f1f1 url(../images/about.jpg) center bottom no-repeat; text-align:center;}
.about .top{ width:100%; font-size:20px; color:#333; margin-top:10px; text-transform:uppercase; font-weight:bold;}
.about .cont{ font-size:14px; color:#999; text-align: left; line-height:30px; margin-top:10px;}
.about .cont span{ color:#4cb035; font-weight:bold;}
.about h5{ font-size:16px; color:#4cb035; margin-top:15px;}
.about .more{ width:30%; margin:20px auto ; height:35px; font-size:14px; line-height:35px; border:solid 1px #4cb035; border-radius:3px;}
.about .more a{ display:block; color:#4cb035; font-size: 14px;} 
.about .more:hover{ background:#4cb035;}
.about .more:hover a{ color:#fff;}

/* titleTop */
.titleTop{ width: 100%; margin:  auto; padding: 5% 0;}
.titleTop .name{ width: 100%;  position: relative; text-align: center; }
.titleTop .name p{display: inline-block; margin-top: -5px; height:1px;width:5%;background:#ddd;overflow:hidden;vertical-align: middle;}
.titleTop .name span{ padding: 0 15px; font-size: 20px; color: #4cb035; font-weight: bold;  }
.titleTop .secondary{ text-align: center; font-size: 14px; color: #999; margin-top: 5px;  text-transform: uppercase;}


/* product */
.product{ width: 100%; background-color: #fff; padding: 0 0  4% 0; margin-top: 0;}
.proList{ width:100%; overflow:hidden; margin:0 auto 0;  background:#fff;}
.proList .hd{ height:45px; line-height:45px; font-size:14px; overflow:hidden; width:100%; padding:0;  background:#fff;}
.proList .hd li{ float:left; padding:0; height:45px; vertical-align:top; width:33.33%; text-align:center; background-color: #eee;}
.proList .hd li.on a{ color:#fff; background-color:#4cb035; display:block; }
.proList .bd{ background:#fff;}
.proList .bd ul{ width:98%; margin:auto; padding: 1%; }
.proList .bd ul li{ float:left; width:48%; margin: 1%; position: relative;  }
.proList .bd ul li img{ width:100%; position: relative; z-index: 1;}
.proList .bd ul li p{ width:100%; position: relative; line-height: 30px; text-align: center; overflow: hidden;white-space: nowrap;text-overflow: ellipsis; z-index: 2; color: #333;}
.proList .bd ul li:hover p{ color: #4cb035;}




/* news */
.news{ width: 100%; background-color: #fff; padding: 0 0  4% 0; margin-top: 8px;}
.newsList{ width:100%; overflow:hidden; margin:0 auto 0;  background:#fff;}
.newsList .hd{ height:45px; line-height:45px; font-size:14px; overflow:hidden; width:100%; padding:0;  background:#fff;}
.newsList .hd li{ float:left; padding:0; height:45px; vertical-align:top; width:50%; text-align:center; background-color: #eee;}
.newsList .hd li.on a{ color:#fff; background-color:#4cb035; display:block; }
.newsList .bd{ background:#fff;}
.newsList .bd ul{ width:100%; margin:auto; padding: 0; }
.newsList .bd ul li{ float:left; width:96%; border-bottom: solid 1px #eee; padding:2%;  }
.newsList .bd ul li .img{ width:30%;}
.newsList .bd ul li .img img{ width:100%;}
.newsList .bd ul li .cont{ width:68%;}
.newsList .bd ul li .title{ float:left; width:100%; font-size:14px; color:#333;}
.newsList .bd ul li .time{ float:left; width:100%; font-size:10px; color:#999; margin:2px 0;}
.newsList .bd ul li .con{ float:left; width:100%; font-size:10px; color:#666; line-height:20px; margin-top:5px;}
.newsList .more{ text-align: center; width: 30%; height: 38px; line-height: 38px; border: solid 1px #eee; margin: 4% auto ; border-radius:3px;}
.newsList .more a{  display: block; font-size: 14px;}
.newsList .more:hover{ background-color: #4cb035; border-color: #4cb035;}
.newsList .more:hover a{ color: #fff;}



/* tel */
.tel{background:#fff; padding:16px 10px; margin:12px auto 0;}
.tel_l p{ font-size:16px; font-weight:bold; line-height:18px; height:18px;}
.tel_l span{ font-size:12px; color:#aaa; line-height:14px; height:14px;}
.tel_r img{ height:24px; margin:4px 0;}


/* footer */
.footer{ line-height:20px; text-align:center; margin-bottom:46px; padding:12px; color:#aaa; font-size:12px;}
.footer a{ color:#aaa;}
.footer a:hover{ color:#4cb035;}
.footer img{ width: 5%;}

.gotop {height:44px; width:44px; position: fixed; right:5px; bottom:60px; z-index:99;cursor: pointer;}


/* footernav */
.mui-bar{position:fixed; z-index:10; right:0; left:0; height:46px; bottom:0; display:table; width:100%; padding:0; table-layout:fixed;}
.footernavtxt{ display: block; font-size: 12px; color:#fff; line-height:20px;}
.footernavimg{ display: block; padding:6px 0 0;}
.footernavimg img{ width: 20px; height: 20px; display: block; margin:auto;}
.footernav{ background:rgba(76, 176, 53, 0.9); box-shadow: none; padding:3px 0;}
.footernavli{ display: block; width: 25%; float: left; text-align: center;}


/* page */
.crumbs{ line-height:36px; height:36px; padding-left:12px; background:#fff; color:#999; margin-bottom:8px;}
.crumbs span{ margin:0 5px;}

.pages { font-size:14px; margin:20px 0; text-align:center;}
.pages a { display:inline-block; height:28px; line-height:28px; background:#fff; border:1px solid #eee; text-align:center; color:#21282e; padding:0 10px; border-radius:3px; margin:0 3px;}
.pages a:hover { background:#4cb035; color:#fff; text-decoration:none; border:1px solid #4cb035; }
.pages span { display:inline-block; height:28px; line-height:28px; background:#4cb035; border:1px solid #4cb035; color:#fff; text-align:center; padding:0 10px; border-radius:3px; margin:0 3px;}

.paging{ padding:0; width:100%;}
.paging span{ width:50%; float:left; display: inline-block; text-align:center; line-height:46px; font-size:16px; font-weight:bold; background:#4cb035; color:#fff;}
.paging span a{color:#fff;}

.pageCont .cont{ font-size:14px; line-height:28px; padding:2%; width:96%; background:#fff;}
.pageCont .cont img{ width:100%;}
.pageCont .img{padding:2%; width:96%; background:#fff;}
.pageCont .img img{ width:100%;}


/* page_nav */
.page_nav{ width:100%; margin:8px auto; background:#fff;  padding:5px 0;}
.page_nav ul{ width:98%; margin:0 auto;}
.page_nav li{ float:left; margin:1%; width:31.3%; padding:7px 0; background:#ccc; text-align:center}
.page_nav li a{ font-size:14px; color:#fff; display:block;}
.page_nav li:hover{ background:#4cb035;}
.page_nav .select{ background:#4cb035;}

.page_nav ul.p2{ width:98%; margin:0 auto;}
.page_nav ul.p2 li{ float:left; margin:1%; width:48%; padding:7px 0; background:#ccc; text-align:center}
.page_nav ul.p2 li a{ font-size:14px; color:#fff; display:block;}
.page_nav ul.p2 li:hover{ background:#4cb035;}
.page_nav ul.p2 .select{ background:#4cb035;}

/* pageImg */
.pageImg{ width: 98%; padding: 1%; background-color: #fff;}
.pageImg li{ float: left; width: 48%; margin: 1%; position: relative;}
.pageImg li img{ width: 100%;}
.pageImg li p{ text-align: center; line-height: 30px; font-size: 14px; color: #333; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.pageImg li:hover p{ color: #4cb035;  }





/* pageNews */
.pageNews{width:100%; overflow:hidden; margin:10px auto 0; background:#fff; }
.pageNews ul{ width:100%; padding:0 ; margin-top:1px; background:#fff;}
.pageNews ul li{ float:left; width:96%; border-bottom: solid 1px #eee; padding:2%;  }
.pageNews ul li .img{ width:30%;}
.pageNews ul li .img img{ width:100%;}
.pageNews ul li .cont{ width:68%;}
.pageNews ul li .title{ float:left; width:100%; font-size:14px; color:#333;}
.pageNews ul li .time{ float:left; width:100%; font-size:10px; color:#999; margin:2px 0;}
.pageNews ul li .con{ float:left; width:100%; font-size:10px; color:#666; line-height:20px; margin-top:5px;}



.pageDetail{ width:100%; overflow:hidden; margin:0 auto; background:#fff;}
.pageDetail .title{ text-align:center; font-size:16px; width:96%; font-weight: bold; line-height:24px; padding:10px 2% 5px; border-bottom:dashed 1px #ddd;}
.pageDetail .title p{ font-size:12px; color:#aaa; font-weight:normal; margin-top:5px;}
.pageDetail .summary{ width:90%; margin:10px 3% 0; padding:2%; color:#999; font-size:12px; background:#fafafa; border:solid 1px #eee; line-height:22px;}
.pageDetail .cont{ font-size:14px; line-height:28px; padding:2%; width:96%;}
.pageDetail .cont img{ width:100%;}
.pageDetail .share{ line-height:14px; height:14px; border-top:solid 1px #eee; border-bottom:solid 1px #eee; padding:10px 2%; width:96%; margin-top:20px;}
.pageDetail .paging{ padding:0; width:100%;}
.pageDetail .paging span{ width:50%; float:left; display: inline-block; text-align:center; line-height:46px; font-size:16px; font-weight:bold; background:#4cb035; color:#fff;}
.pageDetail .paging span a{color:#fff;}

.pageDetail .parameter{ float: left; width: 100%; margin:3% 0;}
.pageDetail .parameter p{ float: left; width: 96%; line-height: 22px; font-size: 14px; color: #666; border-bottom: dotted 1px #eee; padding: 2% ;}
.pageDetail .parameter p span{ color: #333;}
.pageDetail .depict{ float: left; width: 100%; margin:0 0; font-size: 16px; color: #333; border-bottom: dotted 1px #eee; padding:0 2% 10px;}
.pageDetail .banner{ width: 96%; margin: 2%;}
.pageDetail video{ max-width: 100%;}


/* pageAbout */
.pageAbout {width:100%; overflow:hidden; margin:8px auto 0;}
.pageAbout .top { width:96%; padding:0 2%; height:46px; line-height:46px; font-size:16px; background:#fff; border-bottom:solid 1px #eee;}
.pageAbout .top em{width:3px; height:16px; background:#4cb035; margin:15px 5px 15px 0; float:left;}
.pageAbout .AboutList{ width:96%; font-size:14px; line-height:24px; background:#fff; padding:10px 2%; color:#666; }
.pageAbout .AboutList img{max-width:100%; margin-top:10px; }


/* pageContact */
.pageContact {width:100%; overflow:hidden; margin:8px auto 0; background:#fff; padding-bottom:10px;}
.pageContact li{ float: left; width: 96%; padding: 2%; border-bottom: dotted 1px #ddd;}
.pageContact li .name{ width: 100%; font-size: 16px; color: #4cb035;}
.pageContact li .dis{ font-size: 14px; line-height: 22px; margin-top: 10px; color: #666;}





/* PageMessage */
.PageMessage{width:100%; margin:8px auto 0;  display:inline-block; background:#fff; padding:5% 0;}
.messageBox{ width:96%; padding:6px 2%; display:block;}
.messageBox p{margin:0 0 0 0; width:100%; float:left;}
.messageBox input.txt{ border:0; padding:10px 2%; width:95.8%; border:solid 1px #eee; background:#fff; margin:6px 0; height:28px; line-height:28px; font-size:14px; color: #666; }
.messageBox select{border:0; padding:0 2%; width:32.70%; border:solid 1px #eee; background:#fff; margin:6px 0 12px 0; height:48px; line-height:48px; font-size:14px; color: #666; }
.messageBox input.btn{ border:0; background:#4cb035; width:100%; height:48px; cursor:pointer; text-align:center; font-size:16px; color:#fff; margin:0;  float:left;}
.messageBox textarea.txt{ border:0; padding:10px 2%; width:95.8%; border:solid 1px #eee; background:#fff; margin:6px 0; height:60px; line-height:28px; font-size:14px; color: #666; }




/* hr */
.hrList{width:96%; padding:2%; margin:8px auto 0; overflow:hidden; background:#fff;}
.hrList .hrListTitle{ cursor:pointer; height:46px; line-height:46px; font-size:16px; border-bottom:1px solid #eee;}
.hrList .hrListTitle em{width:3px; height:16px; background:#4cb035; margin:15px 5px 15px 0; float:left;}
.hrList .hrListTitle i{float:right; font-style:normal; font-size:14px; color:#aaa;}
.hrList .on{border-bottom:1px solid #4cb035;}
.hrList .hrListCon{ padding:2% 0; display:none; font-size:14px; line-height:26px; border-bottom:1px solid #4cb035;}