@charset "utf-8";
body {
	background:#fff;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;font-size: 16px;
	margin-bottom: 0px; font-family:"Microsoft Yahei",'微软雅黑';
}
p{padding: 0; margin: 0;}
.w1200{width: 1200px; margin: 0 auto;}
.w1200::after{content: '';clear: both;display: block;}

ol, ul {list-style:none;margin:0px; padding:0px;}
.h20{ width:100%; height:20px; margin:0 auto;}
.h30{ width:100%; height:30px; margin:0 auto;}
.h50{ width:100%; height:50px; margin:0 auto;}
#map{ border: 10px solid #f1f1f1; float: right; }

.clear{ clear:both; }



.fl{float: left;}
.fr{float: right;}
.tac{text-align: center;}
.hn_logo{ width: 113px;color: #2251ad; background:url(images/3_03.png) left top no-repeat; height: 83px; margin: 5px 0;} 
.hn_logo h1{font-size: 34px;line-height: 1.2; padding-top: 15px;}
.hn_logo p{font-size: 11px; letter-spacing: 3px;}

#sy_nav{ font-weight:bold;  width: 670px;line-height: 43px; float: left;}
.sy_nav{width:670px;padding-top: 30px;}
.sy_nav a{ width:12.5%;float:left;display: block;}
.sy_nav a:hover,.sy_nav a.act{ color: #fff; background:url(images/3_09.png) center center no-repeat; }
.hn_tel{background: url(images/3_06.png) left 15px no-repeat; padding:10px 0 10px 45px;}
.hn_tel a{font-size:14px;line-height:30px;display: inline-block;}
.hn_tel img{display: inline-block;vertical-align: middle;margin-right:4px;}

.hn_tel h2{font-size: 15px;}
.hn_tel p{font-size:28px;color: #88b82a; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; }
.hn_b{background: #2251ad; color: #fff; padding: 30px 0;}
.hn_b1{background: url(images/4_40.png) center top no-repeat; margin-top: 50px;}
.hn_b1 h2{font-size: 36px; padding-top:80px;}
.hn_b1 p{text-transform: uppercase; letter-spacing: -1px;}
.mt_b1{float: left; width: 430px; margin-left: 50px;}
.mt_b2{float: left; width: 136px; margin-left: 50px;} 
.mt_b3{float: left;width: 120px; margin-left: 30px;}
.mt_b4{float: right; width: 129px;}
.mt_b h2{font-size: 16px;  font-weight: normal;padding-top: 35px;  line-height: 50px;
	border-bottom: 1px solid #B4B4B4; width: 70px;}
.mt_b4 img{ padding-top: 20px;}
.left_cpnr2 ul li{  line-height:30px;font-size:14px;  }
.left_cpnr2 ul li a{  display:block;}

.sy_nav2{  font-size:14px; margin-top: 5px; }
.sy_nav2 a{ width:120px; line-height:28px;   text-decoration:none;display:block; float: left;  }

.hn_cpl{width:30%; background: #efefef; height: 600px; }
.hn_cpl h2{padding-top: 80px; color: #2251ad;font-size: 2vw; width: 77%; margin: 0 auto; text-align: left; line-height: 3; position: relative; z-index: 1;} 
.hn_cpl h2::after{content: '';  border-bottom: 3px solid #2251ad;
position: absolute;  z-index: -1; width: 0;  top:170px; left: 0;opacity: 0; transition: all .3s}
.hn_cpl:hover h2::after{width: 60%;  opacity: 1;}

.hn_cpl b{display: block; width: 77%;  height: 176px; overflow: hidden; margin: 0 auto; line-height: 2.2; color: #8f8f8f; font-size:16px;}
.hn_cpr{width: 60%;}
.hn_cpl div{padding-top: 50px; color: #8f8f8f;width: 77%;  margin: 0 auto; text-align:left; }
.hn_cpl div a{font-weight: bold; font-size: 1.1vw; line-height: 2; padding-left: 3%;}
.hn_cpl div a:not(:last-child)::after{content: '|'; padding-left: 3%;}
.hn_cpl div a:hover{color: #2251ad;}
.hn_cpr{width:70%;}

.hn_cpr ul li{float: left; width: 50%; height: 300px; text-align: center; overflow: hidden;}
.hn_cpr ul li .hn_cp1{height: 220px;padding-top:80px;transition: all .4s; border: 1px solid #ededed; }
.hn_cpr ul li:hover .hn_cp1{margin-top: -300px;}
.hn_cpr ul li .hn_cp1 h2{font-size: 1.3vw; padding-top: 10px;}
.hn_cpr ul li .hn_cp1 p{color: #878787; font-size: 0.8vw;}
.hn_cp2{position: relative; background: #000;z-index: 1; padding-top: 80px;}
.hn_cp2 .hn_cp3{position: absolute; top: 0; bottom: 0; left: 0; right: 0;z-index: -1;}
.hn_cp2 h2{font-size: 1.3vw; padding-top: 10px;color: #fff; padding-top: 10px;}
.hn_cpr ul li .hn_cp2 p{font-size: 0.8vw;color: #fff;}


.hn_zj{background:url(images/hnhf.JPG) center top no-repeat; height: 523px;}
.hn_zjbt h2{font-size: 32px; color: #2251ad; padding-top: 53px;}
.hn_zjbt p{font-size: 17px; color: #2251ad; line-height: 3; }
.hn_zj ul{width: 1200px; padding-top: 26px;}
.hn_zj ul li{float: left; width: 400px; height: 349px; background: #fff; z-index: 1; position: relative; }
.hn_zj ul li::after{content: ''; background: #88b82a; z-index: -1; position: absolute; bottom: 0; left: 0; right: 0; opacity: 0; height: 0;transition: all 1s;}
.hn_zj ul li:hover::after { opacity: 1; height: 349px; }
.hn_zj ul li:hover{color: #fff;}

.hn_zj ul li h2{line-height: 3; }
.hn_zj ul li p{font-size: 14px; color: rgba(0, 0, 0, 0.575);}
.hn_zj ul li:hover p{color: #fff;}
.hn_gj{ background: url(images/4_37.png) center top no-repeat; height: 781px;}
.hn_gjj h2{font-size: 36px; font-weight: normal; padding-top: 100px;}
.hn_gjj p{font-size: 14px; line-height: 25px; width: 390px; padding-top: 170px;}

.hn_gj ul{width: 100%; padding-top: 120px; }
.hn_gj ul li{float: left; width: 240px;}
.hn_gj ul li h3{font-size:92px ; color: #454545; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;  transition: all .3s }
.hn_gj ul li h3 span{font-size: 42px;font-weight: normal;}
.hn_gj ul li:hover h3{ color: #88b82a;margin-top: -30px; }
.hn_xw{ background: url(images/xwbj.JPG) center top no-repeat; height: 729px;}
.hn_xwbt h2{font-size: 46px; color: #fff; text-shadow:2px 2px 8px #0c0c0c71; padding-top: 70px;}
.hn_xwbt p{font-size: 20px;color: #fff;text-shadow:2px 2px 8px #0c0c0c71; line-height: 3;}

.imgZoom img{ -moz-transition:all .8s ease 0s; -ms-transition:all .8s ease 0s; -o-transition:all .8s ease 0s; -webkit-transition:all .8s ease 0s; transition:all .8s ease 0s;}

.imgZoom { overflow:hidden; }
.imgZoom:hover img{ -moz-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); -o-transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); transform:scale(1.1,1.1);}





/*news*/
#news{width: 1220px; margin: 0 auto;padding-top:90px;}
#news a{overflow: hidden; width: 381px;display: block; margin-bottom: 20px; float: left; margin-left: 20px;}
#news a:hover div{color: #fff;}
#news a>span{display: block; width: 381px; }
#news a img{display: block; width: 100%; height: 233px;}
#news a div{ width: 360px;  padding-left: 20px;position: relative; z-index: 1; }
#news a div strong{display: block; font-size: 16px; line-height: 2.8;}
#news a div em{display: block;line-height: 1.7; font-style: normal; font-size: 14px;}
#news a div span{font-size: 14px;line-height: 2;}
#news a div::after{content: ''; display: block;  background:#88b82a;  width: 0px;height: 120px;  z-index: -1; position: absolute; top: 0; left: 0; transition: all .3s;opacity: 0;}
#news a:hover div::after{ opacity: 1;width: 500px; }

/*banner*/

#banner {position: relative;overflow: hidden;
	width: 100%
}
#banner ul {
	position: relative;
	overflow: hidden;
	width: 400%
}
#banner ul li {
	width: 25%;
	float: left
}
#banner ul li img {
	width: 100%;display: block; }

#banner aside {
	position: absolute;
	top: 0;
	bottom: 0;
	height: 0;
	width: 90%;
	right: 0;
	left: 0;
	margin: auto
}
#banner aside span {display: block;
	width: 65px;
	height: 65px;
	z-index: 63;
	background: rgba(255,255,255,0.6);
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	position: relative;
	cursor: pointer;
	opacity: 0;
	transition: all 0.3s;
	margin-top:-2%;
}
#banner:hover aside span{ 
	opacity: 1;}
#banner aside span:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 20%;
	margin: auto;
	width: 27px;
	height: 27px;
	border-top: 3px solid #1c6cb3;
	border-left: 3px solid #1c6cb3;
	-webkit-transform: rotateZ(-45deg);
	-moz-transform: rotateZ(-45deg);
	-ms-transform: rotateZ(-45deg);
	-o-transform: rotateZ(-45deg);
	transform: rotateZ(-45deg)
}
#banner aside span.prev {
	float: left;
}

#banner aside span.next {
	float: right;
}
#banner aside span.next:after {
	left: 0;
	right: 20%;
	-webkit-transform: rotateZ(135deg);
	-moz-transform: rotateZ(135deg);
	-ms-transform: rotateZ(135deg);
	-o-transform: rotateZ(135deg);
	transform: rotateZ(135deg)
}
#banner>div {
	width: 110px;
	position: absolute;
	right: 0;
	left: 0;
	bottom: 7%;
	margin: auto
}
#banner>div em {display: block;
	float: left;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border: 3px solid #fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0 4.75px;
	background: #fff;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	cursor: pointer
}
#banner>div em.act {
	background: #1c6cb3
}

.sl,.st,.st div,.sl div{
	overflow: hidden;
}



/*产品横向滚动*/
.cppichz>div{ padding-bottom: 50px;}
.cppichz a{float: left; width: 280px; margin-right: 10px;text-align: center; position: relative; }
.cppichz a span{overflow: hidden; }
.cppichz a span img{width: 100%;display: block;}
.cppichz a em{background: #f5f5f5; line-height: 2; font-size: 16px; display: block; font-style: normal;}
.cppichz a div{position: absolute;width: 100%; height: 100%; background: rgba(0,153,255,0.9); color: #fff; left: 0; top: 20px; opacity: 0; transition: all .3s;}
.cppichz a div::before{content: ''; background: url(images/356.png) center/cover; width: 60px;height: 60px; margin: auto; margin-top: 60px;display: block;}
.cppichz a:hover div{top: 0; opacity: 1;}
.cppichz a div p{position: absolute; left: 0; right: 0; bottom: 0; top: 30px; margin: auto;  line-height: 30px;font-size: 14px;text-align: center; border: 1px solid #fff;  height: 30px; width: 80px; }





/*产品竖向滚动*/
.cppicsz{width: 1200px; height: 600px; }
.cppicsz a{float: left; width: 280px; margin-right: 10px;text-align: center; position: relative;  margin-bottom: 20px;}
.cppicsz a span{overflow: hidden; }
.cppicsz a span img{width: 100%;display: block;}
.cppicsz a em{background: #f5f5f5; line-height: 2; font-size: 16px; display: block; font-style: normal;}
.cppicsz a div{position: absolute;width: 100%; height: 100%; background: rgba(0,153,255,0.9); color: #fff; left: 0; top: 20px; opacity: 0; transition: all .3s;}
.cppicsz a div::before{content: '';  background: url(images/356.png) center/cover;width: 60px;height: 60px; margin: auto; margin-top: 60px;display: block;}
.cppicsz a:hover div{top: 0; opacity: 1;}
.cppicsz a div p{position: absolute; left: 0; right: 0; bottom: 0; top: 30px; margin: auto;  line-height: 30px;font-size: 14px;text-align: center; border: 1px solid #fff;  height: 30px; width: 80px;}






#nyba{ width:100%; height:300px; background:url(images/nyba.jpg) top center no-repeat;}
#bass_box{ width:100%; height:40px;  border-bottom:solid 1px #ddd; margin:0 auto 15px auto; padding-top:5px;}
.bass{ width:1170px; height:40px; line-height:40px; background: url(images/home.jpg) left center no-repeat; margin:0 auto; font-size:16px; color:#666; padding-left:30px;}
.bass a{ color:#88b82a; font-size:18px; font-weight:bold;}



#main{ width:1200px; height:auto; margin:0 auto; overflow:hidden; position:relative;}
.ny_l{ width:260px; height:auto; margin-right:20px; float:left;z-index: 30;}
.ny_r{ width:920px; height:auto;float:right; overflow: hidden;}


.nr16{ font-size:16px; line-height:30px;}
.nr16 a{ color:#ff0000;}

.ly14{ font-size:14px; color:#ff0000;}

.cp14{ background:url(images/left2.jpg) center bottom no-repeat;font-size:16px;width:230px;height:40px; text-align:left; font-weight: normal;font-family:"Microsoft Yahei"; margin:0px auto;}
.cp14 a{height:40px;width:200px;display:block; line-height:40px; padding-left:30px; color:#333; text-decoration:none; text-align:left;}
.cp14 a:hover{ color:#fff; font-weight:bold; background:url(images/left3.jpg) center bottom no-repeat;}


.left_cptt{ width:245px; height:60px; background:#88b82a; line-height:60px; font-size:18px; font-weight:bold; color:#fff; padding-left:15px;}
.left_cpnr{ width:260px; height: auto; margin-bottom:20px; padding:10px 0px;}
.left_cpnr ul li{ font-size:16px; font-weight:bold;  line-height:45px;}
.left_cpnr ul li a{ padding-left:50px;   display:block; background: url(images/fl11.jpg) center center no-repeat;}
.left_cpnr ul li a:hover{ color:#fff; background: url(images/fl22.jpg) center center no-repeat; }

.left_lxnr{width:240px; height: auto; background:#f3f3f3; padding:10px; font-size:16px; line-height:30px; color:#000;}
.left_lxnr a{ color:#000;}


.zi16hei{ font-size:16px; color:#333;line-height:30px; font-weight:normal; font-family:"Microsoft Yahei";}
.zi16hei a{ color:#000; text-decoration:none;}
.zi16hei a:hover{ color:#ff0000; text-decoration:none;}

.zi14hei{ font-size:14px; color:#333;line-height:25px; font-weight:normal; font-family:"Microsoft Yahei";}
.zi14hei a{ color:#000; text-decoration:none;}
.zi14hei a:hover{ color:#ff0000; text-decoration:none;}

.zi16bai{ font-size:16px; color:#fff;line-height:30px; font-weight:normal; font-family:"Microsoft Yahei";}
.zi16bai a{ color:#fff; text-decoration:none; font-weight:bold;}
.zi16bai a:hover{ color:#ff0000; text-decoration:none;}

.zi14bai{ font-size:14px; color:#fff;line-height:30px; font-weight:normal; font-family:"Microsoft Yahei";}
.zi14bai a{ color:#fff; text-decoration:none; font-weight:bold;}
.zi14bai a:hover{ color:#ff0000; text-decoration:none;}






/*产品列表*/
.showlist {width:100%;float:left;}
.showlist div *{width:100%;}
.showlist li{background:#f3f3f3;border:5px solid #fff;border-radius: 5px;}
.showlist li:hover{box-shadow: 0px 0px 8px #666;background:#f0f0f0;}
.showlist li dl a{display:block;}
.showlist li img{border-radius: 5px;}
.showlist li .t{min-height:35px;display:block;}
.showlist li:hover b{color:#e30;}
.showlist dd {padding:5px;color:#fff; text-align:center; font-size: 15px;}
.showlist dd a{ color:#000;}
.showlist dd a:hover{ color:#000;}

.showlist span{text-decoration:line-through;vertical-align: middle;}
.showlist .pm{text-decoration:none;color:#00F;}
.showlist li{margin:20px auto 20px auto;width:80%;}
.showlist div{float:left;border-left:1px solid #eee;}
.showlist div:hover{background:#fafafa;}


.news3 li{ width:900px; height:180px;font-family:"Microsoft Yahei"; font-weight:normal; margin:10px; border:solid 1px #ddd;}

.news_l{ width:220px; height:180px; float:left;}
.news_l img{ width:200px; height:160px; margin:10px;}
.news_r{ width:680px; height:180px; float:left;}
.news_tt{ font-size:18px; color:#3366FF; font-weight:bold;  padding-top:20px;}
.news_tt a{ color:#000; line-height:40px; text-decoration:none;}
.news_tt a:hover{ color:#ff0000;}
.news_nr{ font-size:16px; color:#333; line-height:27px;}
.news_time{font-size:14px; text-align:left; line-height:30px; color:#999; font:italic;}

.ny_title3{ height:40px; background:#88b82a; color:#fff; font-size:18px; font-weight:bold; margin:0 auto; clear:both; line-height:40px; padding-left:20px;}
.ny_love{  height:350px; }

.page22{ width:900px; height:40px; margin:0 auto;line-height:40px; clear:both;}
.page22 li{ width:420px; height:40px; float: left; text-align:center;}
.page11{ line-height:40px; font-weight:bold; color:#333;}
.page11 i{ color:#999; font-size:14px; font-weight:normal;}