@charset "utf-8";
*{margin:0;padding:0; touch-action: pan-y;}
body{font-size:14px;font-family:'microsoft yahei',Tahoma,\5b8b\4f53,Arial,sans-serif;color:#444;background:#FFF;}
input{font-family:'microsoft yahei'; font-weight:normal;}
ul{list-style-type:none;}
img{border:none;}
.clear{clear:both;}
.hide{display:none;}
.show{display:block}
.fl{float:left;}
.fr{float:right;}
.tc{text-align:center;}
a{text-decoration:none;color:#333;}
a:hover{color:#51A5F7}
#top{background:#FFF;border-bottom:1px solid #CCC;font-size:14px;line-height:34px;}
#top dt,.sub p,.main{max-width:1180px; margin:0 auto;}
#top dt{ display:block;}
#top dt span{ float:right; font-size:12px;padding-top:35px}
#top dt span a{ display:inline-block; margin-left:8px;}
#top dt img{ vertical-align:middle; margin-top:20px;}
#top dt { height:110px; }
#top dt b{ position:absolute; z-index:200; width:168px; margin-top:44px; background:#FFF; display:none;}
#top dt span a{color:#444; display:block; width:72px; text-align:center; float:left;}
#top dt span a.act,#top dt span a:hover{border-bottom:2px solid #087dc2; color:#069;}
#footer{background:#FFF;line-height:30px;color:#606060;text-align:center;padding:15px 0 15px 0;}
#top dt.nav2{ display:none;}
#top dd { height:44px; }
#top dd b{ position:absolute; z-index:200; width:168px; margin-top:44px; background:#FFF; display:none;}
#top dd a{color:#444; display:block; width:168px; text-align:center; float:left;}
#top dd a.act,#top dd a:hover{background:#51A5F7; color:#FFF;}
.home dd.product-list{background: #087dc2;}
.home dd.product-list h2{ color: #FFF;}
.product-list li{ width:370px;float: left; padding-right:30px;}
.pro-pc { padding: 20px;}
.product-list li span,.pro-pc span,.pro-m span{color:#FFF;font-size:16px;line-height:36px;border-radius:5px;
display:block;width:190px;margin:20px auto;border:1px solid #CCC; text-align: center;}
.m-banner{ display: none;}

.sbanner{background:url(../img/sbg.jpg) center center no-repeat; height:240px; width:100%; }
.sbanner p{ padding-top:60px;text-align: center; color:#FFF;}
.sbanner b{font-size: 30px; display: block; padding:5px 0;}
.sbanner a{ color: #FFF;}
.topbar{background: #087dc2; line-height:50px; color: #FFF; font-size: 12px;}
.topbar a{color: #FFF;}
.topbar a:hover{text-decoration:underline}
.topbar span,.topbar b a{display: inline-block; line-height:50px; border-left:1px solid rgba(255,255,255,0.3); padding:0 20px;}
.topbar b{ float: right;  color: #FFF;}

#warp{background:#F9F9F9;}
.main{ padding:28px 0;}
.main h1{ font-size:30px;  padding-bottom:21px; font-weight:normal;border-bottom:1px dashed #444; margin-bottom:31px;}
.home dd{ background:#FFF; text-align:center;  line-height:24px; padding-top:50px;}
.home dd.fa{ background:#FFF;}
.home dd a{color:#51A5F7;}
.home dd h2{ font-size:32px; font-weight:normal; line-height:32px; padding-bottom:21px; width:1180px; margin:0 auto;}
.home dd h2.t1{padding:22px 0 60px 0;}
.home dd .txts{ padding-bottom:40px; width:1180px; margin:0 auto;color: #BBB;}
.home dd .txts a{ display:block;}
.home dd form{ width:506px; margin:0 auto; padding:58px 0 38px 0;}
.home dd form label{ width:80px; display:inline-block; vertical-align:top; text-align:right;}
.home dd form p{ padding-bottom:18px;}
.home dd form input,.home dd form textarea{ width:418px;vertical-align:top; height:30px; line-height:30px; background:#FFF; border:1px #ECECEC solid;}
.home dd form textarea{ height:80px; }
.home dd form input.btn,.btn{ width:124px; height:45px; background:#51A5F7; color:#FFF; font-size:18px; text-align:center; border:0;}
.home dd ul{max-width:1200px; margin:0 auto; text-align:left; padding-bottom: 20px;}
.home dd ul a{ color:#444;}
.home dd ul a:hover{ color:#51A5F7;}


.flogo{ padding:30px 0; color:#63798F; background:#FAFAFA; text-align:center;}
.flogo img{ margin-bottom:21px;}
.help{ background:#343537; padding:30px 0; }
.help ul {max-width:1180px;margin:0 auto;  color: #FFF;}
.help ul h3{ padding-bottom:17px;}
.help li{ float:left; width:32%; padding: 0 1%;text-align:left;}
.help li a{ color: #FFF; display:block; padding-bottom:10px;}
.help li.qrcode{ float:right; width:auto; text-align:center;}
.help li.one a{display:inline-block; vertical-align:top; width:140px;}
.help li.ft2{ height:200px;}

.detail_article { padding:38px; line-height: 26px; background:#FFF;}
.detail_article img{ max-width:100%}
.detail_article h2{ width:280px; height:2px; background:#DDD;margin:0 auto;}
.detail_article h4{ width:280px; height:2px; background:#DDD;margin:0 auto;}
.detail_article h4 hr{ width:70px; height:3px; background:#1A8ECB ; border:0; margin-bottom:2px;margin:0 auto;}

/*banner*/
.banner{background:#FFF;color:#FFF;font-size:120%; }
.banner dd{max-width:1920px; margin:0 auto;}
.banner i{font-style:normal;display:block;width:100%; line-height:38px; max-width:1920px;}
.banner p img{ width:100%; max-width:1920px; display:none;}
.banner span{}
.banner span b{font-weight:normal; display:inline-block; font-size:0px; height:10px; width:60px; margin:0 5px; background:#EDEDED}
.banner span b.act{ background:#51A5F7;}


.about{text-align:center}
.services li{width:29%;padding:0 2%;margin-top:25px;text-align:center; display:inline-block; vertical-align:top;}
.services li a{padding-top:2%; display:block;}
.services li strong{ display:block; font-size:140%; margin-bottom:5px;}
.services li i{background:url(../img/icon.png) 0 0 no-repeat; width:60px; height:60px; display:inline-block;}
.services li.i2 i{background-position:0 -60px;}
.services li.i3 i{background-position:0 -120px;}
.services li.i4 i{background-position:0 -180px;}
.services li.i5 i{background-position:0 -240px;}
.services li.i6 i{background-position:0 -300px;}

.lists1 ul{ padding-top:10px;}
.lists1 li img{ float:left; margin-right:30px;}
.lists1 li{ height:200px; overflow:hidden; font-size:16px; margin-bottom:30px; padding-bottom: 30px; border-bottom:1px solid #CCC; line-height:30px;}
.lists1 li h3{ padding-bottom:20px; font-size:18px; font-weight:normal;}

.lists2 ul{margin-right:-20px;}
.lists2 li{ float:left;text-align:center; margin-right:20px; }
.lists2 li span a{ display:block; line-height:68px;}
.lists2 li span a:hover{ background:#51A5F7; color:#FFF;}
.lists2 li span a b{ height:68px;width:380px; max-width:100%; overflow:hidden;text-overflow:ellipsis; font-weight:normal;  white-space:nowrap; display:block; }

.lists5{ padding:38px; background:#FFF;}
.lists5 ul{margin-right:-30px;}
.lists5 li {float:left; margin:0 2% 2% 0; line-height:350px;height:350px; width:350px; border:1px solid #ddd; text-align:center;}
.lists5 li img{ max-height:340px; max-width:340px;vertical-align:middle;}


.lists8{ padding-top:10px;}
.lists8 ul{margin-right:-85px;}
.lists8 li {float:left; margin:0 40px 40px 0; width:250px;text-align: center; padding:10px; background: #FFF;}
.lists8 li img{width:250px;}
.lists8 li p {padding:10px 0;line-height:30px;}
.lists8 li img.lists8qrcode{width:100px;}

.home dd ul.lists8 li {margin:0 30px 30px 0;}

.lists6 li{line-height:26px;}
.lists6 li a{ display:block;border-bottom:1px dashed #BABABA; line-height:44px;}
.lists6 li .txt{ padding:12px 10px 20px 10px; display:none;border-bottom:1px dashed #BABABA;}
.lists6 li.nls{border-top:0;}

.lists3 ul,.lists4 ul,.lists7 ul{margin-right:-2%;}
.lists3 li,.lists4 li,.lists7 li{ float:left;margin-right:2%;width:48%;}
.lists3 h3,.lists4 h3,.lists7 li h3{text-align:center;line-height:44px; background:#E7E7E7;}
.lists3 li.clear,.lists4 li.clear,.lists7 li.clear{ float:none; clear:both; height:25px;}

.lists4 h3{margin-bottom:25px;}
.lists7 li a{ display:block;}
.lists7 li a span{float:right; display:none;}
.lists7 li a:hover span{display:block;}
.lists3 li p,.lists7 li p{line-height:49px; height:49px; overflow:none;border-bottom:1px dashed #BABABA;}
.lists7 img{ vertical-align:middle; margin-right:3px;}
.brands{ height:300px; background:#1A8ECB;}
.cases{ min-height:500px; width:1000px; margin:0 auto; padding:35px 0; line-height:30px;}

.sub {height:44px;line-height:44px; padding-bottom:35px;}
.sub a{ display:block;font-size:18px; background:#E7E7E7;border:1px solid #E7E7E7;width:231px;text-align:center; float:left; margin-left:3px; }
.sub a.act{ background:#FFF;color:#51A5F7}
.sub a.nl{ margin-left:0;}
.backnav{padding-bottom:18px; font-size:12px;}
.backnav a{}
.web-icon li{ float:left; width:31%; padding:1%; text-align:center;}
.web-pic dd{ float:left; width:48%; padding:0 1%;}
.shop-txt dl dd{ float:left; width:46%; padding:0 2%;}
.shop-txt ul li{ float:left; width:180px; padding:0 6px; text-align:center;}

.mainpage { padding:30px; text-align:center;}
.mainpage b{color:#FFF;font-size:11px;}
.mainpage a{padding:4px 8px;vertical-align:middle;margin:0 3px;background:#CCC;font:11px Verdana; color:#FFF}
.mainpage input{font-size:14px;}
.mainpage input.pagetxt{width:30px;height:18px;}
.mainpage a:hover{background:#51A5F7;color:#FFF;}
.mainpage a.act,.mainpage a.act:hover{color:#FFF;background:#51A5F7;}

#showqq{top:200px; }
#jiathis{top:350px;height:420px; }
.showqq {position:fixed;right:0px;_position:absolute; z-index:999;width:155px;right:-155px;}
.showqq .showqq_logo{float:left;margin-left:-38px; height:120px;font-size:14px; width:38px;background:#738DAA;color:#FFF;
border-top-left-radius:10px;border-bottom-left-radius:10px; text-align:center; padding-top:15px;}
.showqq a{ display:block; height:30px;margin-bottom:5px; }
.showqq b{float:right;width:26px; height:25px; cursor:pointer;}
.showqq p{background:#FFF;padding:15px;}
.showqq img{ vertical-align:middle; margin-bottom:5px;}
#jiathis .showqq_logo{ height:80px;}

.form_tablel {text-align:left;table-layout:fixed; background:#FFF;width:100%;border-collapse:collapse;font-size:14px;margin-bottom:10px;}
.form_tablel tr{line-height:22px;}
.form_tablel td,.form_tablel th{padding:5px 6px;border:1px #DDD solid;}
.form_tablel th{background:#f3f3f3; font-weight:normal; width:10%}
.help li{ height: 180px;}
.help li.ft1{ line-height: 26px;}
.help li.ft2 h3{padding-left:12px}
.help li.ft2 span{ display:block;width: 21%;padding:0 0px 3% 3%; float: left;}
.help li.ft2 span img{ width: 95%;}
.help li.one {  width:30%;line-height:36px;}
.m-logo,.m-show{ display: none;}
#lists5,.pro-pc{ display:none ;}
.home dd span a{ color: #FFF;}
.sub_types{ display: block;}
.footnav{ padding-bottom:15px;}
.footnav a{ display: block; color: #FFF; padding: 0 10px; line-height: 26px; font-size: 12px; }

@media screen and (max-width:1050px){
	.home dd h2{ font-size:28px;line-height:30px;width:auto;padding:0 10px;}
	.home dd .txts{width:auto;padding:0 10px;}
	.flogo{ padding:20px;}
	#top dd,.main,.home dd ul{padding:20px;}
	.sub a{ width: 150px;}
	#top dt span a{ width: 54px;}
	#top dt img{width: 300px;}
	#top dt{height: 90px;}
	#top dt span{ padding-top: 25px;}
	.lists1 li{ font-size: 14px;}
}

@media screen and (max-width:800px){
	/* .pc-banner{ display: none;}
	.m-banner{ display: block;} */
	#top dt span a{ width: 50px; margin-left: 5px;}
	#top dt img{width:220px;}
	#top dt{height:80px;}
	#top dt span{ padding-top: 20px;}
	.lists2 ul{ margin-right:0;}
	.lists2 li{ height:auto; margin:0;width: 50%; }
	.lists2 li img{ width:100%;}
}

@media screen and (max-width:500px){
	.sub_types{ display: none;}
	.pro-m{ display: none;}
	.pro-pc{ display:block;}
	.product-list li{ width: 300px; margin: 0 auto; float: none; padding: 0;}
	#lists5{ display:block ;}
	#lists5-pc{ display:none ;}
	.lists8 li img.lists8qrcode{ width:66px;}
	#top dt img.m-logo{ display:block; width: 70px;}
	.m-none,.pc-logo,.pc-show{ display: none;}
	.m-show{ display:block;}
	.lists2 li span a{ line-height: 40px;}
	.lists2 li span a b{height: 40px;}
	.lists1 li h3{ font-size: 15px; padding-bottom: 5px; width: 99%; line-height:24px;height:24px; white-space: nowrap;overflow: hidden;text-overflow:ellipsis;}
	.help li{width:94%; padding: 0 3%;}
	.help{ padding:20px 10px; }
	.help li.ft1{ line-height: 25px;}
	.help li.one {width:94%; padding: 0 3%;line-height:25px; height:120px;}
	.help li.ft2{width:100%; padding:0;}
	.help ul h3{padding-bottom:7px}
	#top dd,.main,.home dd ul{padding:12px;}
	.topbar{ display: none;}
	#top dt{ height: auto;}
	.home dd .txts{ color: #BBB;}
	.home dd{ padding:15px 0px;}
	.home dd form{ width:100%;}
	.home dd form label{ width:15%;}
	.home dd form input,.home dd form textarea{ width:75%;}
	.home dd h2{ font-size:18px;line-height:20px; }
	.home dd form input.btn{ margin-right:4%;}
	.detail_article{ padding:10px;}
	.lists3 li, .lists4 li, .lists7 li{ width:98%;}
	.main h1{ font-size:20px; padding-bottom:10px; margin-bottom:10px;}
	.backnav{ display:none;}
	#top dd{ position:fixed; z-index:1000;}
	.lists2 ul{ margin-right:0;}
	.lists2 li{ height:auto; margin:0;width: 50%; }
	.lists1 li img{ width:100%; margin-bottom:10px;}
	.lists1 li{ height:auto; padding-bottom:10px; margin-bottom: 10px; font-size: 12px; line-height: 20px;}
	.lists2 li img{ width:100%;}
	.flogo{ display:none;}
	#top dd { right:0; border-top:1px solid #DDD; padding:0; display:none;}
	#top dd a{ float:none; background:#FFF; border-bottom:1px solid #ddd;border-left:1px solid #ddd;border-right:1px solid #ddd;}
	#top{ line-height:40px;}
	.sub { height:auto;}
	.sub a{ width:auto; font-size:13px; padding:0 6px; line-height:30px;}
	.sub a.act{ width:auto;}
	.sub p{ padding:0 0 5px 0;}
	.sub p{padding:0}
	#top dt img{ width:250px; margin:0 0px 0 0;}
	#top dt span{ display:none;}
	#top dt.nav2{ display:block; background:#F5F5F5;line-height:22px; width:92%; padding:3% 4%; }
	#top dt.nav2 b{ float:right;font-size:12px; font-weight:normal;}
	#top dt.nav2 a{color: #666;}
	.nav2 u{ text-underline:initial; color: #CCC; font-size: 10px;}
	#footer{ padding:15px;}
	.banner span b{ width:8px; height:8px; border-radius: 50%; margin-top:10px;}
	.showqq{ display:none;}
	.home dd h2.t1{ padding:0;}
	.lists8{ background: #FFF;}
	.lists8 ul{margin:0}
	.lists8 li{ width:50%; height:80px; margin:0 0 0 0; line-height: 24px; padding: 0;}
	.lists8 li img{ width: 156px;}
	.home dd ul.lists8 li{ margin: 0;}
	.lists8a{ display: none;}
	.sbanner p{ padding-top:20px;}
	.sbanner {height:130px;}
	.lists5{ padding:0px;background:none;}
    .lists5 ul{margin-right:0px;}
	.lists5 li {height:auto;width:100%;margin:0 0 2% 0;border:0; line-height: 20px;}
	.lists5 li img{ height:auto; vertical-align:middle;}
	.copyright{font-size:12px;}
	.gh0 .nav2{padding:10px 0; max-width: 100%;box-shadow: 0 2px 6px rgba(0,0,0,.1) ; z-index: 98; background: #fff; top:0; position:fixed; }
	.gh0 dd{ margin-top: -25px;}
}


@media screen and (max-width:361px){
	.sub a{padding: 0 5px;margin-left:2px; font-size: 12px;}
	.help li.ft1 {line-height:22px;}
}

@media screen and (max-width:321px){
	.sub a{padding: 0 3px;}
}