@charset "utf-8";
*{ margin:0; padding:0;}
body{ min-width: 1200px; overflow-x: hidden;}
body,p,h1,h2,h3,h4,h5,table,ul,li,form,input{ margin:0; padding:0; color:#000; font-family:"Microsoft yahei"; }
body,p{ font-size:14px; border:none;}
a{ font-size:14px; color:#999; text-decoration:none; border:none; padding:0; margin:0;}
table{border-collapse:collapse;}
img{ border:0; margin:0; padding:0;}
ul,li{ list-style:none; border:0; margin:0; padding:0;}
dl,dt,dd{ margin:0; padding:0; -webkit-margin-start:0;}
h1,h2,h3,h4,h5{ font-weight:normal; font-size:12px; display:block;}
strong,b{ font-weight:normal;}
table,tr,td{ border-spacing:0;}
em,i,b{ font-style:normal;}
p{ line-height: 170%; color: #555; }
input{ border: none; background: none; }
figcaption{ display: block;}
input:focus{ outline: none; }
::-webkit-input-placeholder { /* WebKit browsers */ font-size:14px; color: #dfdfdf; } 
::-ms-input-placeholder { /* Internet Explorer 10+ */ font-size:14px;color: #dfdfdf; } 
.fl{float:left;}
.fr{float:right;}
.clearfix{*zoom:1;} 
.clearfix:before,.clearfix:after{display:table; line-height:0; content:"";}
.clearfix:after{clear:both;}
.w1200{ width: 1200px; margin: 0 auto; }
.etxt{height: auto!important;overflow: auto!important;}
.top{  background-color: #322344;}
.top .logo{ display: block; }
.navbar{ margin-left: 25px; float: left;}
.navbar li{float: left; width: 110px; text-align: center; height: 104px; transition: all 0.7s; margin-left: 20px;position: relative;}
.navbar li a{ display: block; }
.navbar li span{ display: block; font-size: 16px; color: #fff;}
.navbar li i{ display: block; background-image: url(../img/icon.png); background-repeat: no-repeat; margin:20px auto 0 auto; transition: all 0.7s;
}
.nav{  z-index:1;  }
.nav a{ color:#fff;  }
.nav .nLi{ float:left;  position:relative; display:inline;  }
.nav .nLi h3{ float:left;  }
.nav .nLi h3 a{ display:block; padding:0 20px; font-size:14px; font-weight:bold;  }
.nav .sub{ display:none; width:110px; left:0; top:82px;  position:absolute; background:#322344;  line-height:40px; padding:7px 0; z-index: 99; }
.nav .sub li{ zoom:1; }
.nav .sub a{ display:block; padding:0 10px;font-size: 15px; }
.nav .sub a:hover{ background:#6d6d6d; color:#fff;  }
.nav .on h3 a{ background:#4E4E4E; color:#fff;   }
.sub {margin-top: 22px;}
.sub li{margin-left: 0!important;height: auto!important;}
.sub a{height: auto!important;}
.navbar li:nth-child(1) i,.navbar li.on i{ background-position: -290px -29px;  width: 30px; height: 35px;  }
.navbar li:nth-child(1):hover i,.navbar li.on i{background-position: -290px 0; }
.navbar li:nth-child(2) i{ background-position: 0  -27px;  width: 30px; height: 40px;  margin-top: 18px; }
.navbar li:nth-child(2):hover i{background-position:0  0px; }
.navbar li:nth-child(2).on i{background-position:0  0px; }
.navbar li:nth-child(3) i{ background-position: -118px -31px;  width: 30px; height: 35px;  }
.navbar li:nth-child(3):hover i{background-position: -118px 0; }
.navbar li:nth-child(3).on i{background-position: -118px 0; }
.navbar li:nth-child(4) i{ background-position: -237px -29px;  width: 30px; height: 35px;  }
.navbar li:nth-child(4):hover i{background-position: -237px 0; }
.navbar li:nth-child(4).on i{background-position: -237px 0; }
.navbar li:nth-child(5) i{ background-position: -55px -23px;  width: 30px; height: 30px; margin-top: 25px;  }
.navbar li:nth-child(5):hover i{background-position: -55px 0; }
.navbar li:nth-child(5).on i{background-position: -55px 0; }
.navbar li:nth-child(6) i{ background-position: -180px -22px;  width: 30px; height: 30px; margin-top: 25px;  }
.navbar li:nth-child(6):hover i{background-position: -180px 0; }
.navbar li:nth-child(6).on i{background-position: -180px 0; }
.navbar li:nth-child(7) i{ background-position: -340px -27px;  width: 30px; height: 35px;  }
.navbar li:nth-child(7):hover i{background-position: -340px 0; }
.navbar li:nth-child(7).on i{background-position: -340px 0; }

.navbar li:hover,.navbar li.on{ background: #FFFFFF;}
.navbar li:hover span,.navbar li.on span{ color: #322344;}

.tel{display: none; /*background: url(../img/icon.png) no-repeat -100px -124px ;*/  width: 210px; height: 106px;}
.tel h2{ 	font-family: Impact;	font-size: 22px;	font-weight: normal;	font-stretch: normal;	line-height: 1;	letter-spacing: 0px;
	color:#fff; font-size:21px; text-align: center;  padding-top: 15px; margin-bottom: 5px;}
.tel h4{  	color:#fff; font-size: 16px;	font-weight: normal;	letter-spacing: 0px;	 text-align: center;}

.banner{ display: block; width: 100%; overflow: hidden;  height: 520px; position: relative;}
.banner img { display: block; vertical-align: top; width: 100%; height: 520px; overflow: hidden;}
.banner .hd{ position: absolute; left: 48%;  bottom: 10px;}
.banner .hd li{ display: inline-block; width: 10px; height: 10px; background: #fff; border-radius: 100%; cursor: pointer; margin:0 5px}
.banner .hd li.on{ background:#322344;}

.tit{ background: url(../img/line.png) no-repeat center; padding-bottom: 40px;}
.tit h3{ font-size: 18px;	line-height: 30px;	letter-spacing: 0px;	color: #c3c3c3;
 font-family: Century751BT-RomanB; text-transform: uppercase; text-align: center;} 
.tit h1{  color: #322344; font-size: 30px; font-weight: bold; text-align: center;}

.chanpin-wrap{ background: #f5f5f5;}
.chanpin{ padding:40px;  position: relative;}
.chanpin li figure,.chanpin li figure img{  width: 285px;	height: 200px; overflow: hidden; transition: all 0.7s;}
.chanpin li:hover figure img{ transform: scale(1.1);}
.chanpin .scrollBox{ margin-left:20px;}
.chanpin li{ float: left; width: 285px;	 margin-right: 20px; transition: all 0.7s;}
.chanpin li i{ display: block; background-image: url(../img/icon.png); background-repeat: no-repeat; margin:0 auto 28px auto;
transition: all 0.7s;}
.chanpin li:nth-child(1) i{ background-position: -428px 0; width: 40px;	height: 44px;} 
.chanpin li:nth-child(2) i{ background-position: -470px 0; width: 40px;	height: 40px;} 
.chanpin li:nth-child(3) i{ background-position: -515px 0; width: 25px;	height: 40px;} 
.chanpin li:nth-child(4) i{ background-position: -550px 0; width: 40px;	height: 44px;} 
.chanpin li:nth-child(1):hover i{ background-position: -428px -30px; width: 40px;} 
.chanpin li:nth-child(2):hover i{ background-position: -470px -30px; width: 40px;	} 
.chanpin li:nth-child(3):hover i{ background-position: -515px -30px; width: 25px;}
.chanpin li:nth-child(4):hover i{ background-position: -550px -30px; width: 40px;;} 
.chanpin li:hover figcaption{background:#322344;}
.chanpin li:hover figcaption h6{background:#FFF;}
.chanpin li:hover figcaption h3{color: #fff;}
.chanpin li:hover figcaption span{background:#fff; }

.chanpin li figcaption{ background: #fff; height: 226px; padding-top: 50px; transition: all 0.7s;}
.chanpin li h3{  color: #333333; font-size: 18px; text-align: center; padding-top: 25px;}
.chanpin li span{ color: #9a9a9a; font-size: 14px; width: 120px;	height: 35px;	border: solid 1px #cdcdcd; display: block; margin:auto;
text-align: center; line-height: 35px; margin-top: 40px; }
.chanpin li h6{ width: 120px;	height: 1px;	background-color: #d3d3d3; margin:auto;}

.pageBtn{ position: absolute; width: 1330px; left: 0; right: 0; top: 50%; margin-top: -32px; }
.pageBtn .next{ background: url(../img/icon.png) no-repeat -467px -74px; width: 35px; height: 64px; display: block; float: right; cursor: pointer;}
.pageBtn .prev{ background: url(../img/icon.png) no-repeat -506px -74px; width: 35px; height: 64px; display: block; float: left; cursor: pointer;}
.pageBtn .list{ display: none;}

.case{ padding:40px 0;}
#wrapper2 {	height: 360px;width: 100%;max-width: 100%; position: relative;}
#wrapper2  h2{ background:rgba(0,0,0,0.6); text-align: center; color: #fff; font-size: 14px; height: 36px; line-height: 36px;
 position: absolute; left: 0; right: 0; bottom: -40px; height: 40px; line-height: 40px; transition: all 0.7s;}
#wrapper2 div:hover h2{ bottom: 0;}
#wrapper2 .prev{  width: 41px; height: 40px; 
 background: url(../img/prev.png) no-repeat center;  display: block;}
#wrapper2 .next{ width: 41px; height: 40px; background: url(../img/next.png) no-repeat center; 
display: block;}

.caseBox{ padding:40px;  position: relative;}
.caseBox li figure,.caseBox li figure img{  width: 285px !important;	height: 200px; overflow: hidden; transition: all 0.7s;}
.caseBox li:hover figure img{ transform: scale(1.1);}
.caseBox .caseBox{ margin-left:20px;}
.caseBox li{ float: left; width: 285px !important;	 margin-right: 20px; transition: all 0.7s;}
.caseBox li figcaption{ background: #fff;  transition: all 0.7s;}
.caseBox li h3{  color: #333333; font-size: 16px;height: 45px;  line-height:45px; text-align: center; }
.caseBox .pageBtn{margin-left: -25px;}

.news{ padding:40px 0; background: #F5F5F5; margin-top: 50px;}
.news .left{ float: left;  width: 480px;
height: 319px; overflow: hidden; position: relative;}
.news .right{ float: right;  width: 690px; overflow: hidden;}
.news .left .bd img,.news .left .bd li{ width: 480px; height: 319px; overflow: hidden; transition: all 0.7s;}
.news .left .hd li {  width: 15px;	height: 8px;	background-color: #fff;	border-radius: 4px; display: inline-block; margin:0 5px; cursor: pointer;}
.news .left .hd li.on{ background: #322344;}
.news .left .hd{ position: absolute; left: 0; right: 0; bottom: 0; height: 40px; line-height: 40px; background: rgba(0,0,0,0.85);
text-align: right; padding-right: 10px;}
.news .left:hover img{ transform: scale(1.1);}

.news .right li{ border-radius:  20px 0  20px 0; background: #fff; height: 100px; margin-bottom: 10px;}
.news .right li a{ display: block; overflow: hidden; clear: both; position: relative; z-index: 1;  height: 100px; overflow: hidden; }
.news .right li a::before{ position: absolute; display: block; content: ''; left: 0; right: 0; bottom: 0; top: 0;
transform: scale(1,0); transition: all 0.7s; border-radius:  20px 0  20px 0; z-index: -1; }
.news .right .time{ float: left; background: #322344; height: 100px; border-top-left-radius: 20px; width: 100px;}
.news .right .time strong{  color: #ffffff; font-size: 24px; display: block; text-align: center; padding-top: 20px;}
.news .right .time span{ display: block; color: #fff ; font-size: 18px; text-align: center;}
.news .right .wen{ padding:5px 20px 10px 20px; float: left;  width: 540px;}
.news .right .wen h3{  color: #666666; line-height: 30px; font-size: 16px;  transition: all 0.7s;}
.news .right .wen p{  color: #999999; line-height: 30px; font-size: 14px;  transition: all 0.7s;}

.news .right li:hover a::before{ transform: scale(1); background: #322344; }
.news .right li:hover h3,.news .right li:hover p{ color: #fff;}

.hezuo{ padding:40px 0; }
.hezuo-nei{  overflow: hidden;}
.hezuo .slide li { clear: both; overflow: hidden; margin-right: -15px; }
.hezuo li a{ display: block;  width: 227px;	height: 100px; border: solid 1px #f0f0f0; float: left;  
margin:0 13px 15px 0; transition: all 0.7s;}
.hezuo li a img{  width: 130px; height: 68px; margin:auto; margin-top: 16px; display: block; transition: all 0.7s; }
.hezuo li a:hover  img{ transform: scale(1.1);} 
.hezuo li a:hover{ border-color: #322344;}
.hezuo-nei .list{ text-align: center; padding:30px 0 0 0;}
.hezuo-nei .list li{  width: 15px; height: 15px; display: inline-block; border-radius: 100%;
margin:0 5px; display: inline-block;  border:1px solid #322344; background: #fff; cursor: pointer;}
.hezuo-nei .list li.on{ background: #322344; }

.about{ background: #F5F5F5; padding:40px 0;}
.about .right{ float: right; width: 610px;	height: 293px; overflow: hidden;}
.about .right img{ width: 610px;	height: 293px; display: block; transition: all 0.6s;}
.about .right:hover img{ transform: scale(1.1);}
.about .left{ width: 510px; float: left; position: relative;}
.about .left h2{ color: #322344; 	font-size: 48px; 	line-height: 60px; font-weight: bold; width: 300px;
 padding-bottom: 5px;}
.about .left h4{  color: #322344; font-size: 20px; font-weight: bold;}
.about .left .title{ background: url(../img/border.png) no-repeat top center; width: 206px; height: 202px;
padding-left: 120px; padding-top: 80px; }
.about .left p{ position: absolute; left: 120px; top: 180px; 	color: #464646; line-height: 30px; 	font-size: 14px;}
.about .left a{ display: inline-block; color: #dd1e32; font-size: 14px; transition: all 0.6s;}
.about .left a:hover{ transform: translateX(5px);}

.footer{  width: 100%; background: #212121; padding:25px 0 0 0 ; overflow: hidden;}
.footer .div{ float: left; }
.footer .div1{ background: url(../img/icon.png) no-repeat -2px -273px; padding-left: 100px; margin-top: 50px; }
.footer .div1 h2{color: #ffffff; line-height: 24px; font-size: 18px;}
.footer .div1 h1{color: #ffffff; font-family: Impact; font-size: 30px;}
.footer .div2{ padding:0 100px;}
.footer .div2 p a{ display: inline-block; color: #fff; padding:20px 10px;}
.footer .div2 .logo-bt img{ display: block; margin:auto}
.footer .div2 h5{ color: #fff; font-size: 14px; text-align: center;  }
.footer .div2 h5 img{ display: inline-block; vertical-align: middle; margin-right: 10px;}
.footer .div3{ margin-top: 20px; }
.footer .link{ width:1200px; margin:0 auto; height:90px; padding:10px 0; margin-top:10px;}
.footer .linkright{float:left;margin-left:10px;width:1110px;}
.footer .link h3{ display:block;width:70px; float:left;line-height:30px; font-size:14px; color:#fff; margin-right:5px; }
.footer .link a{ display:block; padding:0 5px; float:left;line-height:30px; font-size:14px; color:#fff; }
.copyright{ color: #999999; padding:20px 0; text-align: center; font-size: 14px; border-top: 1px solid #2f2f2f; margin-top: 10px;}

.to-top{ display:block;	width:55px;	height:35px; position:fixed; right:5%; 	bottom:80px; z-index:888; transition:500ms;}
.to-top.tophide{transform:translateY(60px);	-webkit-transform:translateY(60px);	opacity:0;	display:none\9;	}


.neibanner{ position: relative;}
.neibanner .pos{ position: absolute; width: 100%; text-align: center; padding:80px 0  50px 0;} 
.neibanner .pos h2{ font-size: 24px; text-align: center; color: #fff; font-weight: bold;}
.neibanner .pos p{ color: #fff; font-size: 14px; padding:35px 0;}
.neibanner .pos a{ display: inline-block; background:#fff; padding:10px 30px; color: #000;
margin:0 15px; border-radius: 5px; font-size: 16px;}
.neibanner .pos a.on{ background-color: #322344; color: #fff;}


.neipage{ padding:40px 0 ; background: #f5f5f5;}
.casepage,.newspage2,.newspage{ background: #fff; padding:20px; width: 1160px;}
.neipage  .left{ float: right; width: 930px;  }
.neipage .casepage   .left{ float: right; width: 930px;  margin-right: -20px; }
.casepage .left li{ float: left; width: 290px; overflow: hidden; margin-right: 20px; margin-bottom: 20px;
 position: relative; box-shadow: 0 0 10px #ccc;}
.casepage .left li figure,.casepage li figure img{ display: block; width: 290px; height: 200px; overflow: hidden; transition: all 0.6s; position: relative;}
.casepage .left li:hover figure img{ transform: scale(1.3);}
.casepage .left  li .mask{ position: absolute; top: 0; left: 0; transform: scale(1);  height: 100%; width: 100%; bottom: 0; background: #000; opacity: 0;
filter:alpha(opacity=0); box-sizing: border-box;  transition: all 1s; }
.casepage .left li:hover .mask{ background: #000; opacity: 0.3; filter:alpha(opacity=30); }
.casepage .left li .line{ position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border:4px solid  rgba(255,255,255,0.8); transition: all 0.7s;
transform: scale(1); box-sizing: border-box; z-index: 33; opacity: 0; filter:alpha(opacity=0); }
.casepage .left li:hover .line{ transform: scale(0.9); filter:alpha(opacity=100); opacity:1; }

.casepage .left li figcaption{ padding:25px 15px; background: #fff;}
.casepage .left li figcaption h2{ float: left; font-size: 16px; color: #000; }
.casepage .left li figcaption span{ display: block; float: right; background: url(../img/arrow3.png) no-repeat 0 -14px; width: 28px; height: 14px;
margin-top: 4px; transition: all 0.36s;}
.casepage .left li:hover span{  background: url(../img/arrow3.png) no-repeat 0 0px;}
.neipage  .right{ width:180px; float:left; overflow:hidden;}

.toubu{ width:100%; height:39px; line-height:39px; border-bottom:1px #e0e0e0 solid;}
.toubu h2{ display:block; border-bottom:2px #322344 solid; float:left; font-size:16px;}
.neirong{ width:100%; overflow:hidden; padding:20px 0 20px;}
.neirong li a{ display:block; line-height:36px; overflow:hidden; color:#333; font-size:14px; transition: all 0.36s;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.neirong li a:hover{ color:#322344; }
.fenye{ text-align: center; }
.fenye a{ display: inline-block; font-size: 16px; padding:10px 15px; cursor: pointer; margin-top: 20px;}
.fenye span{ display: inline-block; color: #322344; font-weight: bold; font-size: 16px; padding:10px 15px; cursor: pointer; margin-top: 20px;}
.fenye span.on,.fenye span:hover { font-weight: bold; color: #322344;}

.newspage .left li{ margin:0 0 30px 0; padding:20px;  border:1px solid #f5f5f5; transition: all 0.7s; position: relative; overflow: hidden;  z-index: 3;}
.newspage .left li a{ display: block; overflow: hidden; clear: both; }
.newspage .left li figure{ display: block; float: left; width: 200px; height: 150px; overflow: hidden;}
.newspage .left li figure img{ display: block; float: left; width: 200px; height: 150px; overflow: hidden; transition: all 0.7s;}
.newspage .left li figcaption{ display: block; float: left; padding-left: 30px; width: 600px;}
.newspage .left li h3{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; color: #333;
 padding-bottom: 5px; padding-top: 15px; transition: all 0.6s ease;}
.newspage .left li p{ color: #666; font-size: 14px; line-height: 36px; height: 72px; overflow: hidden; transition: all 0.6s ease;}
.newspage .left li h5 span{ display: inline-block; color: #999; font-size: 14px; margin-right: 10px; transition: all 0.6s ease;}
.newspage .left li h5 span img{ display: inline-block; margin-right: 5px;}
.newspage .left li:hover figure img{ transform: scale(1.1);}
.newspage .left li:hover{ box-shadow:  0 0 10px #666; }
.newspage .left li::before{ display: block; content: ''; position: absolute; left: 50%; top: 50%;  transform:translate(-150%,-150%); 
transition: all 0.6s ease; z-index: -1; width: 100%; height: 100%;/* opacity: 0;*/ }
.newspage .left li:hover::before{ background:rgba(0,0,0,0.05); width:150%; height: 150%; transform:translate(-5%,-5%);  transform:rotate(-35deg); display: none\9; }


.de-tit{ padding-bottom: 20px;}
.de-tit h1{ font-size: 20px; color: #333; text-align: center; padding:15px 0; font-weight: bold; }
.de-tit p{ text-align: center; border-bottom:1px solid #f5f5f5; padding:0 0 20px 0; } 
.de-tit p span{ display: inline-block; margin:0 15px; font-size: 14px; color: #888;  }
.de-cont { line-height: 38px; font-size: 14px; color: #666;  }
.de-cont img{ max-width:100%;margin:0 auto;  }
.de-cont p{ line-height: 38px; font-size: 14px; color: #666;  }


.fenpian{ padding:50px 0;  border-top: 1px solid #f6f6f6; margin-top: 40px;}
.fenpian>div{ padding:15x 0; }
.fenpian span{ display: block; font-size: 14px; color: #222; float: left;  vertical-align: middle; line-height: 30px; }
.fenpian p a{ font-size: 14px; color: #555; float: left; display: block; line-height: 30px; }
.fenpian a:hover{ color: #322344; }
.de-img{ text-align: center; padding:20px 0; }
.de-img img{ display: inline-block; max-width: 100%; }

.fenpian .fanhui{ display: block; float: right; width: 150px; height: 40px; line-height: 40px; text-align: center; background: #222; border-radius: 10px;
 color: #fff; cursor: pointer; transition: all 0.6s;}
.fenpian .fanhui:hover{ color: #fff; background: #322344;} 



/**/
.online{ padding:20px 40px; background:#fff; overflow:hidden; position:relative; }
.online h1{ font-size:40px; line-height:50px; font-weight:bold; text-align:center; font-family:Arial;}
.online h2{ text-align:center; font-size:16px; padding-bottom:40px; overflow:hidden;}
.online .zxly{ width:550px; overflow:hidden;}
.online .zxly li{ overflow:hidden; margin-top:15px;}
.online .zxly li:nth-child(1){ margin:0;}
.online .zxly li input.text{ padding:0 10px; color:#555; height:75px; line-height:75px; width:480px; background:#f8f8f8; border:none;}
.online .xxnr{ width:550px; overflow:hidden;}
.online .xxnr textarea{ padding:10px; overflow:hidden; background:#f8f8f8; width:530px; height:325px; border:none; outline:none;}
.online .ljtj{ width:100%; overflow:hidden; padding-top:15px;}
.online .ljtj input.sub{ background:#373636; line-height:60px; height:60px; color:#fff; border:none; font-size:18px; width:100%; cursor:pointer;}



/**/
.online{ padding:20px 40px; background:#fff; overflow:hidden; position:relative; margin:0 auto;}
.online h1{ font-size:40px; line-height:50px; font-weight:bold; text-align:center; font-family:Arial;}
.online h2{ text-align:center; font-size:16px; padding-bottom:40px; overflow:hidden;}
.online .zxly{ width:750px; overflow:hidden;}
.online .zxly li{ overflow:hidden; margin-top:15px;}
.online .zxly li:nth-child(1){ margin:0;}
.online .zxly li input.text{ padding:0 10px; color:#555; height:75px; line-height:75px; width:750px; background:#f8f8f8; border:none;}
.online .xxnr{ width:750px; overflow:hidden; margin-top:30px;}
.online .xxnr textarea{ padding:10px; overflow:hidden; background:#f8f8f8; width:740px; height:325px; border:none; outline:none;}
.online .ljtj{ width:750px; overflow:hidden; padding-top:15px;}
.online .ljtj input.sub{ background:#373636; line-height:60px; height:60px; color:#fff; border:none; font-size:18px; width:750px; cursor:pointer;}