﻿*{margin:0; padding:0; box-sizing:border-box;}
body{ color:#353535; font-family:"Microsoft Yahei";}

ul li{list-style-type:none;}

a{color:#353535; text-decoration:none; transition:color 0.3s ease;}
a:hover{text-decoration:none;color:#04bfea;}
a.more:hover{opacity:0.7;}

.fl{float:left;}
.fr{float:right;}

.container:after,ul:after,#page:after,li:after{content:''; display:block; clear:both;}

.container{width:1200px; margin:0 auto; }
.gridwrap{margin-left:-20px; overflow:hidden;}
.grid{float:left;}

input,textarea{font-family:"Microsoft Yahei";}
/**header**/
#header{height:100px;}

#header .headl{float:left; }
#header .headl .logowrap{float:left;}
#header .headl .logowrap .logo{width:850px; height:100px; background:url(../images/logo.jpg) left top no-repeat; text-indent:-9999px; float:left; margin-top:0px;}
#header .headl .logowrap .logotxt{font:bold 28px/100px "Microsoft Yahei"; float:left; margin-left:30px;}

#header .headm{float:left; margin-left:100px;}
#header .headm form{margin-top:36px;}
#header .headm form input{border:2px solid #aace3a; height:40px; width:300px; font-size:16px;}
#header .headm form input[type=submit]{margin-left:-5px; background-color:#aace3a; width:90px; cursor:pointer;}

#header .headr{float:right;}
#header .headr .phone{margin-top:36px; padding-left:40px; padding-right:10px; line-height:38px; font-size:20px; font-weight:400; margin-left:10px; border:1px solid #bbb; background:#f9f9f9 url(../images/tophone.png) left top no-repeat;}

/**nav**/
#nav{height:53px; background:url(../images/nav_bg.gif) left bottom repeat-x;}
#nav .navbtn{display:none;}
#nav ul li{width:12.5%; height:53px; float:left;}
#nav ul li a{width:100%; height:100%; text-align:center; line-height:53px; display:block; color:#fff; background:url(../images/nav.png) left -53px no-repeat; transition:all 0.3s;}
#nav ul li a:hover{background:url(../images/nav.png) left top no-repeat;}

/**banner**/
#banner .box ul li img{width:100%;}

#banner .container{padding:0 30px; height:130px; position:relative;}
#banner .container .bprev,#banner .container .bnext{height:130px; width:30px; background:orange; display:block; position:absolute; z-index:20; text-indent:-9999px;}
#banner .container .bprev{left:0; background:url(../images/prev1.png) 5px center no-repeat orange;}
#banner .container .bnext{right:0; background:url(../images/next1.png) 6px center no-repeat orange;}

#banner .navwrap {width:100%; height:130px; position:relative; overflow:hidden;}
#banner .navwrap ul{width:800%; height:100%; position:absolute; margin-left:-30px; }
#banner .navwrap ul li{width:360px; height:100%; margin-left:30px; background:#ccc; float:left;}
#banner .navwrap ul li.hover{border:1px solid green; box-shadow: 0 0 10px #000;}
#banner .navwrap ul li .pic{height:100%;}
#banner .navwrap ul li .pic img{height:100%; width:100%;}

/**about**/
#about{margin-top:30px; padding-bottom:25px; border-bottom:1px dashed #bbb;}
#about .container{height:430px; background:#01a2ea;}

#about .pic{width:800px; height:100%; float:left;}
#about .pic img{width:100%; height:100%;}
#about .txt{width:400px; height:100%; float:right; position:relative; padding-left:20px; padding-right:10px; color:#fff;}
#about .txt .jiantou{width:20px; height:20px; background:#01a2ea; position:absolute; left:-10px; top:50%; margin-top:-15px; transform:rotate(45deg);}
#about .txt h2{margin-top:35px; margin-bottom:10px; font-size:25px; text-shadow: 0 1px 3px #000;}
#about .txt p{font-size:13px; line-height:1.8; margin-bottom:20px;}
#about .txt a.more{display:block; border:1px solid #fff; position:relative; float:left; line-height:40px; padding-right:40px;  height:42px; width:42px; overflow:hidden; transition: width 0.5s;}
#about .txt a.more p{width:40px; height:40px; background:url(../images/amo.png) 14px center no-repeat #01a2ea; position:absolute; right:0; top:0;}
#about .txt a.more span{margin-left:10px; color:#fff;}
#about .txt a.hover{width:120px;}

/**guild**/
#guild{margin-top:20px; padding-bottom:50px; border-bottom:1px dashed #bbb;}
#guild .ulwrap{margin-left:-20px; margin-top:20px;}
#guild .ulwrap ul li{width:50%; height:160px; padding-left:20px; float:left; margin-bottom:20px;}
#guild .ulwrap ul li .grid{width:100%; height:100%; background:#57842b; overflow:hidden; }
#guild .ulwrap ul li .fl{height:100%; width:220px; overflow:hidden; padding:5px;}
#guild .ulwrap ul li .fl img{height:100%; width:100%;}

#guild .ulwrap ul li .fr{width:370px; height:100%; padding-left:15px; padding-right:10px; color:#eee; position:relative;}
#guild .ulwrap ul li .fr h3{margin-top:10px; margin-bottom:10px; letter-spacing:3px; font-size:22px; color:#fff; text-shadow: 0 1px 3px #000;}
#guild .ulwrap ul li .fr p{font-size:13px; line-height:1.8;}
#guild .ulwrap ul li .fr .more{height:25px; width:80px; font-size:13px; border-radius:5px; background:#fff; display:block; text-align:center; line-height:25px; position:absolute; right:10px; bottom:10px;}
#guild .ulwrap ul li .fr .more:hover{background:#000; color:#fff;}

#guild .ulwrap ul li .tianlan{background:#D35400;}
#guild .ulwrap ul li .huang{background:#bccf02;}
#guild .ulwrap ul li .lv{background:#5bb12f;}
#guild .ulwrap ul li .shenlan{background:#4398cd;}
#guild .ulwrap ul li .fen{background:#57842b;}
#guild .ulwrap ul li .zi{background:#b172b2;}

/**proshow**/
#proshow{padding:25px 0; background:#f9f9f9;}
#proshow .container{overflow:hidden;}
#proshow .scroll-full{clear:both; padding-bottom:30px; padding-top:10px; margin-top:30px;}
#proshow .scroll{height:163px; position:relative;}
#proshow .prev,#proshow .next{position:absolute; width:30px; height:50px; top:60px; text-indent:-9999px; z-index:30;}
#proshow .prev{left:-50px; background:url("../images/prev1.png") #e6a213 center no-repeat;}
#proshow .next{right:-50px; background:url("../images/next1.png") #e6a213 center no-repeat;}
#proshow .scroll_wrap{clear:both; margin:20px auto; height:100%; width:100%; overflow:hidden; position:relative;}
#proshow .scroll_wrap ul{height:100%; position:absolute; margin-left:-15px;}
#proshow .scroll_wrap ul li{height:100%; width:228px; position:relative; float:left; margin-left:15px;}
#proshow .scroll_wrap ul li img{width:100%;}
#proshow .scroll_wrap ul li p{height:25px; background:rgba(0,0,0,0.6); position:absolute; left:0; bottom:0; width:100%; text-align:center; line-height:25px; color:#fff;}

/**footer**/
#footer{margin-top:30px; background:#252a30;}
#footer .container{position:relative; padding-top:30px; color:#f5f5f5;}
#footer .container .top{width:50px; height:50px; background:url(../images/top.png) no-repeat center #01a2ea; position:absolute; left:50%; top:0; margin-left:600px; cursor:pointer;}
#footer h2{margin-bottom:30px; letter-spacing:3px;}
#footer .contact,#footer .pro,#footer .link{width:400px; height:300px; float:left; border-right:1px solid #3e3e3e; border-bottom:1px solid #3e3e3e;}
#footer .contact p{padding-left:40px; line-height:40px; background:url(../images/phone.png) left top no-repeat; font-weight:bold; font-size:18px;}
#footer .contact span{margin-left:40px; display:block; padding-right:20px;}

#footer .pro{padding-left:20px;}
#footer .navlist{width:214px;}
#footer .link{padding-left:20px; border-right:0;}
#footer form{display:block; padding-right:25px;}
#footer form input,#footer form textarea{border:0; background:#f9f9f9; width:100%; margin-bottom:10px; height:30px; padding:10px; border-radius:3px; }
#footer form textarea{padding:0; height:70px;}
#footer form input[type=submit]{padding:0; width:100px; height:25px; float:right; cursor:pointer;}

#footer .copyRight{color:#767D84; text-align:center; line-height:40px;}

/**page**/
#page{}
#page .adv{height:332px; width:100%; background:url(../images/adv.jpg) no-repeat center;}
#pageleft,#pageright{margin-top:20px; position:relative;}
#pageleft{width:260px; float:left; background:url(../images/mainbg.jpg); box-shadow:0 5px 10px #bbb; border-radius:5px; margin-bottom:30px;}
#pageleft .navlist,#pageleft .contact{}
#pageleft .top{height:40px; background:url(../images/mainbg.jpg); text-indent:24px; padding-bottom:10px; line-height:40px; font-size:24px; font-weight:bold; color:#00923f; letter-spacing:5px; border-bottom:1px solid #00923f;}
#pageleft .con{padding:20px 23px; background:url(../images/mainbg.jpg); padding-bottom:10px; margin-bottom:20px;}
#pageleft .navlist .con ul li,#footer .navlist .con ul li{height:40px; margin-bottom:10px; background:url(../images/cbg.png); background-size:cover; line-height:38px; font-size:18px; text-indent:40px; font-weight:bold; border-radius:5px;}
#pageleft .navlist .con ul li a,#footer .navlist .con ul li a{display:block; height:100%; background:url(../images/tl02_h4.png) 1px 12.5px no-repeat; color:#353535; transition:all 0.3s cubic-bezier(0.4, 0, 1, 1);}
#pageleft .navlist .con ul li a:hover,#footer .navlist .con ul li a:hover,#pageleft .navlist .con ul li a.hover{color:#fff; background:url(../images/cehover.png) center no-repeat; background-size:cover;}
#pageleft .contact .con p{margin-bottom:10px; padding-left:40px; background:url(../images/address.png) 5px 5px no-repeat; margin-left:-15px;}
#pageleft .contact .con p strong{line-height:30px; font-size:18px;}
#pageleft .contact .con p span{font-size:14px;}
#pageleft .pagebut{width:50px; height:88px; background:url(../images/l6.png) no-repeat left center; position:absolute; top:50%; margin-top:-44px; right:-50px; cursor:pointer; display:none;}

#pageright{width:900px; float:right;}
#pageright .top{height:40px; border-bottom:2px solid #ccc; position:relative;}
#pageright .top h2{position:absolute; left:0; top:0; height:40px; border-bottom:2px solid #69aa28;}
#pageright .top span{font-size:14px; line-height:40px;}

/**culture**/
#pageright .culture{padding:20px;}
#pageright .culture ul li{margin-bottom:30px;}
#pageright .culture ul li .culture-l{width:300px; height:214px; border-radius:5px; box-shadow:0 5px 10px #ccc; overflow:hidden;}
#pageright .culture ul li .culture-l img{width:100%; cursor: pointer; height: 100%;}
#pageright .culture ul li .culture-r{width:560px; padding-left:60px;}
#pageright .culture ul li .culture-r p.tit{font-size:22px; line-height:40px; border-bottom:1px solid #bbb; margin-bottom:20px; color:#00923f;}
#pageright .culture ul li .culture-r span{font-size:14px; line-height:1.4;}
#pageright .culture ul li .culture-r span p{margin-bottom: 5px;}

/**honor**/
#pageright .honor{padding-top:20px;}
#pageright .honor ul{margin-left:-20px; position:relative;}
#pageright .honor ul li{padding-left:20px; width:33.333%; float:left; position:relative; transition: left 0.5s;}
#pageright .honor ul li .imgwrap{width:100%; padding:5px; box-shadow:0 0 10px #ccc;}
#pageright .honor ul li img{width:100%;}
#pageright .honor ul li a{position:absolute; right:10px; bottom:5px; padding:3px 10px; background:#00923f; color:#fff; border-radius:5px; font-size:14px;}
#pageright .honor ul li p{line-height:30px; padding:0 10px; padding-bottom:30px; background:#fafafa; border:1px solid #f2f2f2; margin-top:5px; color:#999;}

#imgbox{display:block; position:fixed; width:100%; height:100%; background:rgba(0,0,0,0.5); top:0; left:0;}
#imgbox #imgwrap{position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; background:#fff; max-height:85%; max-width:95%; padding:40px; border-radius:5px;}
#imgbox #imgwrap .imginput{width:100%; height:100%; overflow:scroll;  box-shadow:0 0 10px #000;  max-width:100%;}
#imgbox #imgwrap #stopdiv{width:40px; height:40px; position:absolute; right:0; top:0; background:url(../images/guan22.png) no-repeat center; cursor:pointer; transition: all 0.5s;}
#imgbox #imgwrap #stopdiv:hover{transform:rotate(360deg);}
#imgbox #imgwrap img{width:100%;}

/**subord**/
#pageright .subord{padding:20px 0;}
#pageright .subord ul li.subord-li{margin-bottom:30px; border:1px solid #bbb; height:420px; box-shadow:0 0 10px #ddd;}
#pageright .subord ul li.subord-li .subord-l{width:601px; height:100%; border-right:1px solid #bbb; overflow:hidden; position:relative;}
#pageright .subord ul li.subord-li .subord-l .sub-prev,#pageright .subord ul li.subord-li .subord-l .sub-next{z-index:2; position:absolute; width:70px; height:105px; top:50%; margin-top:-52.5px; background:url(../images/btn-prev.png) no-repeat center; text-indent:-9999px; overflow:hidden;}
#pageright .subord ul li.subord-li .subord-l .sub-prev{left:0;}
#pageright .subord ul li.subord-li .subord-l .sub-next{right:0; background-image:url(../images/btn-next.png);}
#pageright .subord ul li.subord-li .subord-l ul{height:100%; width:1000%; position:absolute; left:0; top:0;}
#pageright .subord ul li.subord-li .subord-l ul li{height:100%; float:left;}
#pageright .subord ul li.subord-li .subord-l ul li img{height:100%; width:600px;}
#pageright .subord ul li.subord-li .subord-l .subord-nav{position:absolute; left:0; bottom:0; width:100%; height:5px; background:#000; opacity:0.5;}
#pageright .subord ul li.subord-li .subord-l .subord-nav .subord-btn{height:100%; float:left; transition:all 0.45s;}
#pageright .subord ul li.subord-li .subord-l .subord-nav .hover{background:#00923f;}
#pageright .subord ul li.subord-li .subord-r{width:297px; height:100%; padding:20px; padding-right:30px;}
#pageright .subord ul li.subord-li .subord-r p{font-size:22px; font-weight:bold; line-height:40px; border-bottom:1px solid #bbb; margin-bottom:20px;}
#pageright .subord ul li.subord-li .subord-r span{font-size:15px; line-height:1.8;}

/**product**/
#pageright .product{padding:20px 0;}
#pageright .product ul{margin-left:-30px;}
#pageright .product ul li{margin-left:30px; width:280px; float:left; position:relative; padding-bottom:40px;}
#pageright .product ul li .show{width:100%;}
#pageright .product ul li .show img{width:100%;  height:200px; border:2px solid #fff;}
#pageright .product ul li .show p{text-align:center; line-height:40px;}
#pageright .product ul li .hide{height:40px; width:100%; position:absolute; left:0; bottom:40px; transition:all 0.3s;}
#pageright .product ul li .hide a{width:50%; font-size:15px; border-top:2px solid #fff; color:#fff; background:#aace3a; display:block; float:left; height:100%; text-align:center; line-height:38px; opacity:0; transition:all 0.3s;}
#pageright .product ul li .hide a:first-child{border-right:2px solid #fff;}
#pageright .product ul li .hide a:hover{background-color:#00923f;}
#pageright .product ul li .hide div{}
#pageright .product ul li:hover .show{}
#pageright .product ul li:hover .show img{border-color:#00923f;}
#pageright .product ul li:hover .show p{background-color:#00923f; color:#fff;}
#pageright .product ul li:hover .hide{bottom:0;}
#pageright .product ul li:hover .hide a{opacity:1;}
#pageright .product ul li:hover .hide div{}

p.solunav{text-align:center; font-size:14px; margin:20px 0;}
p.solunav a:first-child{display:none;}
p.solunav a, p.solunav b{border: 1px solid #f1f2f6; background: #f9f9f9; margin-right: 10px; padding: 3px 10px; border-radius:3px;}
p.solunav a:hover, p.solunav b{background-color:#00923f; border-color:#00923f; color:#fff;}

/**productcon**/
#pageright .productcon{padding:20px 0;}
#pageright .productcon .pic{}
#pageright .productcon .pic .con{height:466px; width:100%; overflow:hidden;  margin-bottom:5px;}
#pageright .productcon .pic .con img{width:700px; height:100%; display: block; float: left; border:1px solid #ccc; padding:5px; border-radius: 3px;}
#pageright .productcon .pic .con .txtcon{width:200px; float: right; padding-left:10px;}
#pageright .productcon .pic .con .txtcon p{line-height: 40px; font-size: 18px; font-family: 黑体; color:#00923f; font-weight: bold;}
#pageright .productcon .pic .btn {position:relative; height:150px;}
#pageright .productcon .pic .btn a{position:absolute; top:50%; margin-top:-35px; width:30px; height:70px; background:url(../images/conpr.png) center no-repeat; opacity:0.5;}
#pageright .productcon .pic .btn a:hover{opacity:1;}
#pageright .productcon .pic .btn a.pr{background-image:url(../images/conne.png); left:-31px;}
#pageright .productcon .pic .btn a.ne{right:0; right:-31px;}
#pageright .productcon .pic .btn .ulwrap{width:100%; height:100%; overflow:hidden; position:relative;}
#pageright .productcon .pic .btn ul{height:100%; width:500%; margin-left:-20px; position:absolute; left:0; top:0;}
#pageright .productcon .pic .btn ul li{float:left; height:100%; margin-left:20px; width:210px;}
#pageright .productcon .pic .btn ul li.hover{box-shadow:0 0 10px #00923f;}
#pageright .productcon .pic .btn ul li img{height:100%; width:100%; cursor:pointer;}

#pageright .productcon .txt{margin-top:30px;}
#pageright .productcon .txt .nav{height:30px; position:relative; border-bottom:2px solid #ccc;}
#pageright .productcon .txt .nav ul{height:30px; position:absolute; left:0; top:0;}
#pageright .productcon .txt .nav ul li{height:100%; float:left; margin-right:15px; text-align:center; line-height:28px; background:#f9f9f9; padding:0 10px; cursor:pointer; border-bottom:2px solid #ccc;}
#pageright .productcon .txt .nav ul li:hover,#pageright .productcon .txt .nav ul li.hover{background:#00923f; color:#fff; border-color:#00923f;}
#pageright .productcon .txt .con{border-bottom: 2px solid #ccc; padding-bottom: 20px;}
#pageright .productcon .txt .con .conli{padding:10px; min-height:100px;}
#pageright .productcon .txt .con .conli .tit{background-color: #f5f5f5; margin-bottom: 10px;}
#pageright .productcon .txt .con .conli .tit:after{content:""; display: table; clear: both;}
#pageright .productcon .txt .con .conli .tit h4{float: left; padding:5px 20px; background-color: #00923f; color:#fff; text-shadow:0 1px 2px #000;}

#pageright .productcon .txt .fixed{position:fixed; top:0; width:900px; background-color: #fff;}

#page #pageright .productcon .txt .bot a{position:static; float:right;}

/**news**/
#pageright .new{padding:20px 0;}
#pageright .new ul{background:url(../images/newlist.jpg); padding:30px;}
#pageright .new ul li{padding-bottom:30px; background:url(../images/newbot.jpg) left bottom no-repeat; margin-bottom:25px;}
#pageright .new ul li .new-l{width:210px; height:150px; box-shadow:0 0 3px #555;}
#pageright .new ul li .new-l img{width:100%; height:100%;}
#pageright .new ul li .new-r{width:600px; height:150px; position:relative;}
#pageright .new ul li .new-r h3{font-size:22px; margin-bottom:10px; letter-spacing:1px; color:#263471;}
#pageright .new ul li .new-r p{font-size:14px; line-height:1.8; color:#999;}
#pageright .new ul li .new-r span{position:absolute; right:0; bottom:0; color:#aaa; font-size:13px;}
#pageright .new ul li .new-r a,#pageright .newcon .bot a,#pageright .productcon .txt .bot a{
	position:absolute; left:0; bottom:0; background:#00923f; color:#fff; font-size:14px; padding:5px 20px; 
	border-radius:15px; text-shadow:1px 2px 3px #000; box-shadow:0 2px 2px #999;}

/**newscon**/
#pageright .newcon{padding:20px 0;}
#pageright .newcon > h3.tit{text-align:center; margin-bottom:20px;}
#pageright .newcon > div.con{min-height:500px; padding-bottom:20px; border-bottom:2px solid #ccc;}
#pageright .newcon > .bot,#pageright .productcon .txt .bot{padding:10px 0; margin-bottom:20px;}
#pageright .newcon .bot p{min-width:150px; padding-right:20px; line-height:30px; font-size:14px; color:#666;}
#pageright .newcon .bot a{float:right; position:static;}

/**message**/
#pageright .message{padding:20px 0;}
#pageright .message p.mestop{font-size:15px; line-height:1.8; margin-bottom:20px;}
form#contact_form{width:100%; background:url(../images/newlist.jpg); padding:20px; border-radius:5px;}
form#contact_form ul li{margin-bottom:10px;}
form#contact_form input,form#contact_form textarea{width:100%; height:30px; border-radius:5px; border:0;}
form#contact_form textarea{height:100px;}
form#contact_form label{line-height:30px; font-size:18px; font-weight:bold;}
form#contact_form span.fr{border:1px solid #ccc; border-radius:3px; padding:2px 5px; font-size:15px; background:#fff;}
form#contact_form input[type=submit]{width:100px; font-size:15px; float:right; margin-top:30px; background-color:#00923f; color:#fff; cursor:pointer;}

#footer .navlist .con ul li{overflow: hidden; margin-bottom: 5px;}
#footer .navlist .con ul li a{background: left center;}
#pageright .contact-content{background:url(../images/contact.jpg) top right no-repeat; width:100%; margin-top:30px; min-height:420px; padding-left:30px;}
























