@charset "utf-8";

@media screen and (max-width:1920px)and (min-width:999px) {
.fadein, .fadeleft, .faderight, .fadeup {transition: 1.2s;-moz-transition: 1.2s;-ms-transition: 1.2s;-o-transition: 1.2s;-webkit-transition: 1.2s;opacity: 0}
.fadeup {transform: translateY(1500px);-moz-transform: translateY(1500px);-ms-transform: translateY(1500px);-o-transform: translateY(1500px);-webkit-transform: translateY(1500px)}
.faderight {transform: translateX(1500px);-moz-transform: translateX(1500px);-ms-transform: translateX(1500px);-o-transform: translateX(1500px);-webkit-transform: translateX(1500px)}
.fadeleft {transform: translateX(-1500px);-moz-transform: translateX(-1500px);-ms-transform: translateX(-1500px);-o-transform: translateX(-1500px);-webkit-transform: translateX(-1500px)}
.active .fadein {opacity: 1}
.active .fadeleft, .active .faderight {opacity: 1;transform: translateX(0);-moz-transform: translateX(0);-ms-transform: translateX(0);-o-transform: translateX(0);-webkit-transform: translateX(0)}
.active .fadeup {opacity: 1;transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);-o-transform: translateY(0);-webkit-transform: translateY(0)}
}
@media screen and (max-width:1919px){
#banner{ width:100%; position:relative; margin-left:0%}
}
@media screen and (max-width:1499px){
#banner{ width:130%; position:relative; margin-left:-15% }
}
@media screen and (max-width:1199px){
.wrap{ width:96%; margin:0 auto}
}
@media screen and (max-width:999px){
#sddm li{margin: 0;padding: 0;list-style: none;float: left;float:left; width:14.28%; padding-right:0%;font-size:16px; text-align:center}
#sddm li:last-child{ padding-right:0%; text-align: right}
}
@media screen and (max-width:1024px){
#banner{ width:140%; position:relative; margin-left:-20% }
}
@media screen and (max-width:899px){
#banner{ width:150%; position:relative; margin-left:-25% }

.lianxi .lxleft{ float:left; width:45%; }
.lianxi .lxright{ float:right; width:54%; }
}
@media screen and (max-width:768px){
#top { display:none}
#top .yuyanxuanze { display:none}
#leftsead{ display:none}
#header .logo{ float:left; width:80%; }
#header .tel{display:none }
.btn_menu{display:block;top:60px;}

#menu {display:none;}

#products .leibie{ width:22%; }
#products .pro{ width:75%;}
#youshi .intro .num{display: block; float:left; margin-right:20px}
#youshi .intro {background: url(../images/youshi.jpg) no-repeat center top; background-size:80% auto; padding:270px 0 20px 0;}
#youshi .intro .left{width:100%; float:none}
#youshi .intro .left .kuaiin{background:none;width:100%;}
#youshi .intro .left div div{width:89%;padding:3%; margin:6px auto}
#youshi .intro .right{width:100%; float:none}
#youshi .intro .right div div{ width:89%; margin-left:0%; padding:3%; margin:6px auto; }

#youshi .intro .left .kuaiin:nth-child(2){background: none;}

#youshi .intro .right .kuaiin{background: none;width:100%;}
#youshi .intro .right .kuaiin:nth-child(2){background:none;}

#nbanner{ height:200px; background:url(../images/nbanner01.jpg) no-repeat top center;background-size:auto 200px;}
#nbanner02{ height:200px; background:url(../images/nbanner02.jpg) no-repeat top center;background-size:auto 200px;}
#nbanner03{ height:200px; background:url(../images/nbanner03.jpg) no-repeat top center;background-size:auto 200px;}

#nbanner04{ height:200px; background:url(../images/nbanner04.jpg) no-repeat top center;background-size:auto 200px;}
#nbanner05{ height:200px; background:url(../images/nbanner05.jpg) no-repeat top center;background-size:auto 200px;}
#nbanner06{ height:200px; background:url(../images/nbanner06.jpg) no-repeat top center;background-size:auto 200px;}

#nmain .leibie{float:none; width:100%;background:none;padding-bottom:0px}
#nmain .leibie .title{ display:none;}
#nmain .intro li a {padding-left: 0px;font-size:14px}
#nmain .aboutli li{float: left; width:33.33%; text-align:center}
#nmain .productli li{float: left; width:50%; text-align:center}
#nmain .lianxili li{float: left; width:50%; text-align:center}
#nmain .shouhou{ display:none} 
#nmain .newsli li{float: left; width:50%; text-align:center}
#nmain .intro li a:hover, #nmain .intro li .cur{ color:#fff; background:#0170bf;}
#nmain .neixiang{ float:none; width:100%;  clear:both; padding-top:10px}

.newslist li .left{ float:left; width:30%;overflow:hidden; height:120px;}
.newslist li .you{float:right; width:68%;}

.lianxi .lxleft{ float:none; width:100%; }
.lianxi .lxright{ float:none; width:100%; }

.message-con-1{ float:left; width:100%; margin-bottom:25px}
.message-con-1 .tit{ float:left; color:#666; margin-right:15px; width:30%; font-size:15px; padding-top:7px; text-align:left}
.message-con-1 .input-m{ width: 60%; padding:2%; border:1px solid #ccc; outline:none; transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}

.message-con-2 .tit{ float:left;color:#666; margin-right:15px; width:30%; font-size:15px; text-align:left;padding-top:7px;}
.message-con-2 textarea{ width: 60%; padding:2%; border:1px solid #ccc; outline:none;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}
.message-con-2 .input-m{ width: 40%; padding:2%; border:1px solid #ccc; outline:none;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}
}
@media screen and (max-width:640px){







.casees li{ float:left; width:48%; margin-right:0%; margin-bottom:4%;}
.casees li:nth-child(3n){ margin-right:0}
.casees li:nth-child(3n+1){ clear:none; float:left}

.casees li:nth-child(2n){ margin-right:0; float:right}
.casees li:nth-child(2n+1){ clear:both}

.casees .wenzi{ line-height:40px; height:40px; position:relative; margin-top:-40px;}

#myscroll ul li{ float:left; width:48%; margin-right:0%; margin-bottom:4%;}
#myscroll ul li li:nth-child(2n){ margin-right:0}
#myscroll ul li li:nth-child(2n+1){ clear:none; float:left}
#myscroll ul li li:nth-child(2n){ margin-right:0; float:right}
#myscroll ul li li:nth-child(2n+1){ clear:both}
#myscroll ul li .wenzi{ line-height:40px; height:40px; position:relative; }


.btn_menu {top: 30px}
#banner{ width:170%; position:relative; margin-left:-34% }

#products{ margin:20px 0;}
#products .leibie{ float:none; width:100%; min-height:auto }
#products .pro{ float:none; width:100% }
.tabmenu{ margin-top:5px;margin-top:10px}
.tabmenu li {font-size:15px; float:left; width:45%;padding-left:5%;}
.tabmenu .cli {background:#0170bf;}

#products .wrap{background:none; padding:0}

#products .leibie .title{background-size:100% 65px; height:65px;}
#products .leibie .title h3{ ffont-size:20px; padding:12px 20px 0 20px;}
#products .leibie .title p{ padding:0 20px; }
#products .pro{ margin-top:4px}
#products .pro li{ width:47.6%; margin-right:4%;}
#products .pro li:nth-child(3n){margin-right:4%;}
#products .pro li:nth-child(2n){margin-right:0;}


#case{background: url(../images/aboutbg.jpg) #ffffff no-repeat center bottom; background-size:100% auto; padding:20px 0 80px 0;}
#about .left{ width:100%; float:none;} 
#about .right{ width:94%; float:none; background-color:#fff; padding:12% 3%}

#case{ padding:20px 0;}
#case .intro li{ float:left; width:220px; margin-right:22px}
#line3_Demo {height: 250px;}
#news .intro .left{ float:none; width:100%;}
#news .intro .right{ float:none; width:100%; margin-top:30px}

#footer .left{ float:none; width:100%; display:none;}
#footer .left .kuai01{ float:left; width:50%; text-align:center; height:180px }
#footer .left .kuai02{ float:right; width:42%;margin-left:0%;height:180px}

#footer .left .kuai03:nth-child(1){clear:both}
#footer .left .kuai03{ float:left; width:50%; margin-left:0%;}
#footer .right{ width:100%;}

#footer{ padding:20px 0; }

#quite h3{font-size:13px;}
#quite li{ float:left; width:33.2%; margin-top:15px;}
#quite li:nth-child(1){ border-left:solid 1px #ccc; }
#quite li:nth-child(4){ margin-left:15.66%; border-left:solid 1px #ccc; margin-top:15px; }

#nbanner{ height:150px; background:url(../images/nbanner01.jpg) no-repeat top center;background-size:auto 150px;}
#nbanner02{ height:150px; background:url(../images/nbanner02.jpg) no-repeat top center;background-size:auto 150px;}
#nbanner03{ height:150px; background:url(../images/nbanner03.jpg) no-repeat top center;background-size:auto 150px;}

#nbanner04{ height:150px; background:url(../images/nbanner04.jpg) no-repeat top center;background-size:auto 150px;}
#nbanner05{ height:150px; background:url(../images/nbanner05.jpg) no-repeat top center;background-size:auto 150px;}
#nbanner06{ height:150px; background:url(../images/nbanner06.jpg) no-repeat top center;background-size:auto 150px;}

#nmain{ margin:20px 0;}


.prointro li{ float:left; width:48%; margin-right:4%; margin-bottom:12px; text-align:center; }
.prointro li:nth-child(3n){margin-right:4%;}
.prointro li:nth-child(2n){margin-right:0%;}

.intropro .pic{ width:100%; float:none}
.intropro .prodetail{ width:90%; float:none; padding:5%; line-height:30px;}

.newslist li{ padding-bottom:10px; padding-top:10px; height:110px; overflow: hidden}
.newslist li .left{ float:left; width:35%;overflow:hidden; height:auto; padding-top:12px}
.newslist li .you{float:right; width:62%;}

.newslist li .you .shijian{ display:none}


}
@media screen and (max-width:480px){


#line3_Demo {

	height:222px;

}


#case .intro li{ float:left; width:205px; }
#banner{ width:180%; position:relative; margin-left:-45%; }
}