
html,body,h1,h2,h3,h4,h5,h6,p,span,b,i,a,ul,li,dl,dt,dd,label,input,textarea,select,option,button,img,artical,em,table,
form,video,embed{padding: 0;margin: 0;font-style: normal;list-style: none;
	font-family: "Microsoft YaHei",verdana,Arial,Helvetica,sans-serif;box-sizing:border-box;-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;border: 0;font-weight: normal;}
a{text-decoration: none;outline: none;}
a:focus{outline: none;}
a{blr:expression(this.onFocus=this.blur());}
img{display: block;outline: none;}
input,button,textarea,select{font-family:"Microsoft YaHei";outline:none;}
button,textarea{ -webkit-appearance: none; }
body{background: #fff;}

.container{width: 1200px;margin: 0 auto;}
.clearfix{clear:both;}
.fl{float: left;}
.fr{float: right;}

@media screen and (max-width: 1200px){
	.container{width: 92%;}
}

/*top-box*/
.top-box{width: 100%;height: 134px;background: #232221;position: fixed;left: 0;top: 0;z-index: 1000;}
.top-box .top{width: 80%;margin: 0 auto;overflow: hidden;position: relative;}
.logo{display: inline-block;width: 150px;margin-top: 35px;}
.logo img{width: 100%;}
.nav{margin-left: 8%;overflow: hidden;margin-top: 50px;}
.nav li{float: left;font-size: 16px;margin: 0 20px;}
.nav li a{color: #fff;}
.nav li a::after,.nav-drop li a::after{content: '';display: block;width: 0;height: 2px;background: #fff;margin-top: 20px;opacity: 0;
	filter: alpha(opacity=0);transition: all 0.5s linear;-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;-ms-transition: all 0.5s linear;-o-transition: all 0.5s linear;}
.nav li a:hover::after,.nav-drop li a:hover::after{width: 100%;opacity: 1;filter: alpha(opacity=100);}
.nav li a.on::after,.nav-drop li a.on::after{width: 100%;opacity: 1;filter: alpha(opacity=100);}
.search{display: inline-block;margin-top: 50px;width: 220px;height: 38px;padding: 4px;background: #fff;border-radius: 4px;}
.search input,.search a{display: inline-block;vertical-align: middle;}
.search input{width: 88%;height: 30px;color: #333;}
.search a{width: 18px;height: 30px;background: url(../images/ico.png) no-repeat center center;
	background-size: 18px auto;margin-left: 5px;}
.menu{width: 40px;position: absolute;right: 5px;top: 52px;display: none;}
.nav-drop{width: 100%;text-align: center;background: rgba(30,30,30,0.8);padding: 10px 0;
	position: fixed;left: 0;top: 134px;z-index: 100;display: none;height: 100%; }
.nav-drop li{padding: 10px 0;width: 80%;margin: 0 auto;}
.nav-drop li a{color: #fff;}
.nav-drop li a::after{margin-top: 20px;}
.close{width: 24px;position: absolute;top: 15px;right: 15px;cursor: pointer;transition: all 0.5s linear;
	-webkit-transition: all 0.5s linear;-moz-transition: all 0.5s linear;-ms-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;}
.close:hover{transform: rotate(180deg);-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);-o-transform: rotate(180deg);}

/*在线咨询*/
.online{position: fixed;top: 300px;right: 0;z-index: 1000;}
.online .on-box{margin-bottom: 10px;position: relative;}
.on-box .on-ico{width: 50px;height: 50px;background: #f0f0f0;overflow: hidden;position: relative;
	border: solid 1px #cecece;}
.on-box .on-ico img{width: 34px;margin: 0 auto;margin-top: 5px;}
.on-box .on-ico img.on-qq{width: 30px;margin-top: 8px;}
.on-box .on-ico p{width: 50px;height:50px;font-size: 14px;text-align: center;color: #222;padding: 5px 10px 0;
	background: #ddd;position: absolute;left: -100%;bottom: -100%;transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;}
.on-box .on-ico:hover p{left: 0;bottom: 0;}
.on-weixin .on-ico p{padding: 0;text-align: center;line-height: 50px;}
.on-box .on-hov{position: absolute;top: 0px;right: 100%;background: #fff;border: solid 1px #ddd;padding: 10px;
	width: 120px;display: none;}
.on-box .on-hov p{width: 100%;background: #b1e5fd;color: #222;font-size: 14px;border: solid 1px #85cef1;
	border-radius: 2px;padding: 2px 4px;}
.on-box .on-hov p a{color: #222;display: block;}
.on-box .on-hov p img{width: 20px;display: inline-block;vertical-align: middle;margin-right: 5px;}
.on-box .on-hov p span{display: inline-block;vertical-align: middle;}
.on-weixin .on-hov{width: 150px;padding: 10px 0;}
.on-weixin .on-hov p{padding: 0;background: 0;border: 0;text-align: center;margin-bottom: 10px;}
.on-weixin .on-hov img{width: 120px;margin: 0 auto;}
.on-box:hover .on-hov{display: block;}

@media screen and (max-width: 1600px){
	.nav{margin-left: 5%;}
}

@media screen and (max-width: 1550px){
	.top-box .top{width: 84%;}
	.logo{width: 140px;margin-top: 45px;}	
}

@media screen and (max-width: 1470px){
	.top-box .top{width: 88%;}
	.logo{width: 130px;}		
}

@media screen and (max-width: 1390px){
	.top-box .top{width:92%;}
	.logo{width: 110px;margin-top: 50px;}
	.search{width: 200px;}
}

@media screen and (max-width: 1280px){
	.top-box .top{width:96%;}
	.nav{margin-left: 3%;}
	.nav li{margin: 0 16px;}
	.search{width: 180px;}
	.search input{width: 86%;}
}

@media screen and (max-width: 1120px){
	.top-box{height: 100px;}
	.top-box .top{width: 92%;}
	.logo{width: 130px;margin-top: 25px;}
	.nav{display: none;}
	.search{float: left !important;margin-left: 100px;width: 300px;margin-top: 32px;}
	.search input{width: 90%;}
	.menu{display: block;top: 36px;}
	.nav-drop{top: 100px;}
}

@media screen and (max-width: 720px){
	.search{margin-left: 9%;}
}

@media screen and (max-width: 640px){
	.logo{width: 20%;margin-top: 6%;min-width: 74px;}
	.search{margin-left: 8%;width: 58%;}
	.search input{width: 88%;}
}

@media screen and (max-width: 540px){
	.logo{margin-top: 8%;}
}

@media screen and (max-width: 480px){
	.search{margin-left: 7%;}
	.search input{width: 86%;}
	.menu{width: 36px;}
	.close{width: 20px;}
}

@media screen and (max-width: 420px){
	.top-box{height: 80px;}
	.search{margin-top: 22px;}
	.menu{width: 32px;top: 28px;}
	.nav-drop{top: 80px;}
	.on-box .on-hov{display: none !important;}
	.on-box .on-hov:hover{display: none;}
	.on-weixin .on-hov{width: 110px;}
	.on-weixin:hover .on-hov{display: block !important;}
	.on-weixin .on-hov img{width: 90px;}
}

@media screen and (max-width: 380px){
	.search{width: 50%;height: 34px;margin-left: 6%;margin-top: 24px;}
	.search input{width: 84%;}
	.nav-drop li{padding: 8px 0;}
	.nav-drop li a::after{margin-top: 15px;}
}

@media screen and (max-width: 360px){
	.logo{margin-top: 9%;}
	.search input{width: 80%;}
	.menu{right: 0;}
	.nav-drop li{padding: 7px 0;}
	.nav-drop li a::after{margin-top: 10px;}
}

@media screen and (max-width: 340px){
	.online{top: 200px;}
	.on-box .on-ico{width: 40px;height: 40px;}
	.on-box .on-ico img{width: 24px;margin-top: 5px;}
	.on-box .on-ico img.on-qq{width: 20px;margin-top: 8px;}
	.on-box .on-ico p{width: 40px;height:40px;padding: 2px 5px 0;}
	.on-weixin .on-ico p{line-height: 40px;padding: 0;}
}

@media screen and (max-width: 320px){
	.logo{margin-top: 10t%;}
	.nav-drop li a::after{margin-top: 8px;}
}

/*footer*/
.footer{padding: 50px;text-align: center;font-size: 14px;color: #666;}
.footer p{line-height: 30px;}
.footer p a{color: #666;}
.footer p a:hover{color: #000;text-decoration: underline;}

@media screen and (max-width: 768px){
	.footer{padding: 30px 0;}
}