﻿@charset "utf-8";



/*==========================================公共 开始=============================================*/



/* ---------- Responsive accurate ---------- */

@media (max-width:1920px){html{font-size:16px;}}

@media (min-width:471px) and (max-width:639px){html{font-size:13px;}}

@media (min-width:329px) and (max-width:470px){html{font-size:12px;}}

@media (max-width:328px){html{font-size:12px;}}





/*====header====*/

#header{height: 80px;width: 100%;background-color: #000;position:fixed; top:0; left:0;z-index: 99;box-shadow: 0 0 20px rgba(0,0,0,0.1); border-bottom:3px solid #DB2800;}

#header .left{width: 15%; float:left;}

#header .left img{max-width: 100%;}

#top_bar{ border-bottom: 1px solid #e7e7e9; height: 55px; line-height: 55px; vertical-align: middle;}

.top_padding{ padding-top: 130px;}

#logo{display:table-cell; height: 4.875rem;vertical-align:middle;}

#sousuo,#buy {display: inline-block;width: 1.875rem;height: 4.875rem;vertical-align:  middle;}

#logo a img{ vertical-align:middle; width:100%;}

#header .right{text-align:right;display:table;float:  right;font-size: 0;     width: 20%;}

#header .center{position: static; width: 64%; float:left;} 

#sousuo svg,#buy svg{display: inline;width: 1rem;height: 1rem;vertical-align: middle;margin-top: 0.4rem;}


#header .right .lan{height: 4.875rem;display: inline-block;vertical-align: middle; margin-right:10px;}

#header .right .lan ul{display: inline-block;height:1.75rem;width:60px;vertical-align:middle; background:#434343;text-align:center;margin: 1.5rem 0;margin-left: 0.5rem; border-radius:20px;}

#header .right .lan ul li{display:inline-block;font-size:0.8125rem;height: 1.75rem;line-height: 1.75rem;vertical-align: top; width:50%;}
#header .right .lan ul li:nth-of-type(1){ background:#025E9F;border-radius:20px;}

#header .right .lan ul li span{margin: 0 2px;color:#fff;vertical-align: top;}

#header .right .lan ul li a{ color:#fff; font-size:0.8125rem; margin-left:5px; margin-right:5px;}
#header .right .lan ul li a:hover{ color:#fff;}

#header .right #licheng{ display: inline-block;vertical-align: middle;}

#header .right #sousuo{margin-left: 0.3rem;}

#header .right #sousuo i,#header .right #buy i{cursor:pointer;width:1.875rem;height: 1.875rem;background:#DB2800;display: inline-block;text-align: center;margin: 1.5rem 0;padding: 0;}

#header .right #sousuo i{ background:#DB2800}

.visible-lg-block{ display:none !important}



/*====导航====*/

#nav{}

#nav ul{text-align: center;font-size: 0;margin-bottom: 0;}

#nav li{display:inline-block;min-width:30px;position:relative; padding:0 20px;}

#nav li:first-child { background: none;}

#nav li .a{display:block;text-align:center;position: relative;height: 4.875rem;line-height: 4.875rem;}
.a:hover{color: #DB2800;}

#nav li .a p{line-height: 80px;height: 80px;font-size: 0.9375rem;color: #fff; font-weight:bold;text-align:center;display:block;position:relative;z-index:2;margin: 0; text-transform:uppercase;}

#nav li .a strong{font-size:12px; line-height: 14px; text-transform: uppercase; display:block;color:#bdc0c2;  text-align:center;position:relative;z-index:1}

#nav li .a span{position:absolute;bottom:20%;left: 50%;margin-left: -1.875rem;text-align:center;}

#nav li .a i{margin:0 auto;text-align:center;z-index:1;height:3px;width:0;background:#e3212a;overflow: hidden; display: none;}

#nav li.on .a p{color: #DB2800;margin: 0;}

#nav li.on i{width:100%;}

/*#nav li.on .a span{width: 3.75rem;height: 2px;background: #0054a3; color:#0054a3;}*/

#nav li .a:hover{color: #DB2800;}
#nav li .a:hover i{width:100%;}

#nav li .a:hover p{ color: #DB2800;}

#nav li.on .a:hover i{transform:rotateX(0);-webkit-transform:rotateX(0);-moz-transform:rotateX(0);color:#DB2800;}

#nav.title{position:relative}

#nav .list{width: 180px;left: 50%;margin-left: -90px;max-height:0;position:absolute;top: 80px; border-top:3px solid #DB2800;z-index:0;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease;opacity: 0;filter:alpha(opacity=0);-moz-transform:scale(0);-o-moz-transform:scale(0);-o-moz-transform:scale(0);-webkit-moz-transform:scale(0);transform: scale(0);}

#nav .list::before{ display: block; position:absolute;top:-10px;right:50%; overflow:hidden;width:0;height:0;border:10px solid #DB2800;border-color:#DB2800 transparent;border-top:0; margin-right: -9px; content: "";}

#nav .list a{width: 100%;height:36px;line-height:36px;text-align:center;color:#fff;display:block;font-size:14px;text-decoration:none;opacity:1;background-color:#000;border-bottom:#333 1px solid;-webkit-transition:opacity .4s,-webkit-transform .5s;-moz-transition:opacity .4s,-moz-transform .5s;-ms-transition:opacity .4s,-ms-transform .5s;transition:opacity .4s,transform .5s;}

#nav .list a:hover{background:#DB2800; color:#fff;}

#nav li:focus .list,#nav li:hover .list{max-height:2000px;z-index:10;opacity:1;filter:alpha(opacity=100);-moz-transform:scale(1);-o-moz-transform:scale(1);-o-moz-transform:scale(1);-webkit-moz-transform:scale(1);transform:scale(1);}

#nav .l_chanpin .dui-dropdown-menu{background:#f5f6f8;position: absolute;top: 4.875rem;left: 0;width: 100%;height:0;z-index: 10;-moz-transition: all 0.36s ease-in-out;-webkit-transition: all 0.36s ease-in-out;-o-transition: all 0.36s ease-in-out;-ms-transition: all 0.36s ease-in-out;transition: all 0.36s ease-in-out;}

#nav .l_chanpin .dui-dropdown-menu .list01{position: relative;display:block;opacity:1;filter:alpha(opacity=100);-moz-transform:scale(1);-o-moz-transform:scale(1);-o-moz-transform:scale(1);-webkit-moz-transform:scale(1);transform:scale(1);margin: 0 0 0 5%;width: 140px;text-align: center; display:none; float:left;}

#nav .l_chanpin{position: static; }

#nav .l_chanpin .dui-dropdown-menu .list01 a{width: 100%;height: 30px;line-height: 30px;text-align:center;color:#222;display:block;font-size:14px;text-decoration:none;opacity:1;-webkit-transition:opacity .4s,-webkit-transform .5s;-moz-transition:opacity .4s,-moz-transform .5s;-ms-transition:opacity .4s,-ms-transform .5s;transition:opacity .4s,transform .5s;}

#nav .l_chanpin .dui-dropdown-menu .list01 a:hover{color:#DB2800;}

#nav .l_chanpin .dui-dropdown-menu .list01 h3 img{ display:inline-block}

#nav .l_chanpin:hover .dui-dropdown-menu{ height:auto; padding:3rem 0; }

#nav .l_chanpin:hover .dui-dropdown-menu .list01{ display:block}

#nav .l_chanpin .dui-dropdown-menu .list02{margin: 0 0 0 36.5%;}

@media (max-width:1260px){
#header .center{ width:62%;}
#header .right{ width:22%;}
#nav li{padding:0 18px;}
}

/*====移动端头部====*/

#m_header{display: none;height: 50px;width: 100%;z-index: 9999; border-bottom:3px solid #DB2800;}

#m_logo{ position: absolute; top: 0; left: 10px; }

#m_logo img{height: 30px;margin: 10px 0 0 0;}

#m_bnt_top_search{ position: absolute; top: 0; display: block; width: 50px; line-height: 50px; text-align: center; right: 50px; font-size: 2.4rem; color: #1ea78a;}

#m_header .lan{position: absolute;right: 50px;display: inline-block;vertical-align: middle; margin-top:12px;}

#m_header .lan ul{display: inline-block;height: 28px; line-height:28px;width:5.5rem;vertical-align:middle;text-align:center;margin-left: 1.5rem; background:#434343;border-radius:28px;}

#m_header .lan ul li{font-size:0.8125rem;height: 28px;line-height: 28px;vertical-align: middle; float:left; width:50%;}
#m_header .lan ul li:nth-of-type(1){ background:#025E9F;border-radius:28px;}

#m_header .lan ul li span{margin: 0 2px;color:#303233;vertical-align: top;}

#m_header .lan ul li a{color:#fff;font-size: 14px;}

#m_header #licheng{position: absolute;right: 50px; margin-top:10px;}

#m_header #sousuo01{position: absolute;right: 86px;top: 50%;margin-top: -15px;}

#m_header #buy01{position: absolute;right: 50px;top: 50%;margin-top: -15px;}

#m_header #sousuo01 i,#m_header #buy01 i{cursor:pointer;width: 30px;height: 30px;background: #3B9766;display: inline-block;text-align: center;padding: 0;}

#sousuo01 svg,#buy01 svg{display: inline;width: 16px;height: 16px;vertical-align: middle;margin-top: 6px;}

#m_header #buy01 i{ background:#e3212a}



/*====移动端导航====*/

#m_bnt_nav{position: absolute;top: 0;right: 0;cursor: pointer;width: 50px;height:50px;text-align: center;}

#m_bnt_nav .point{display: inline-block;width: 22px;height: 22px;margin-top: 12px;position: relative;}

#m_bnt_nav .point:hover .navbtn,

#m_bnt_nav .point:hover .navbtn::after,

#m_bnt_nav .point:hover .navbtn::before{width: 22px;}

#m_bnt_nav .navbtn{position: absolute;top: 14px;right: 0;display: inline-block;width: 24px;height: 2px;-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #fff;border-radius: 3px;}

#m_bnt_nav .navbtn::after,

#m_bnt_nav .navbtn::before{position: absolute;right: 0;display: inline-block;width: 20px;height: 2px;content: '';-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #fff;border-radius: 3px;}

#m_bnt_nav .navbtn::after{top: -6px;}

#m_bnt_nav .navbtn::before{top: 6px;}

#m_bnt_nav .point.on .navbtn{background: transparent;}

#m_bnt_nav .point.on .navbtn::after{-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);top: 0px;}

#m_bnt_nav .point.on .navbtn::before{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);top: 0px;}

 

#m_nav{position:absolute;top:53px;left:0;display:none;width:100%;z-index:999; }

#m_nav{filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#E51e316c', endColorstr='#E51e316c');background: rgba(0,0,0,0.9);}

#m_nav li{display:block;width:100%;border-bottom: 1px solid #333; }

#m_nav li .a{display:block;text-align: left;position:relative;height:40px;padding: 0 1rem;line-height: 40px;}

#m_nav li .a p{display: inline-block;font-size: 13px;color:#fff;padding-right: 10px;margin: 0; text-transform:uppercase;}

#m_nav li .a strong{ display: inline-block; text-transform:uppercase; font-size:14px; line-height:40px;height:40px;color:#fff; z-index:11; opacity:.8;filter:alpha(opacity=80);}

#m_nav li .a i{opacity:0;filter:alpha(opacity=0);position:absolute;right: 1em;top:0;text-align:center;z-index:4;color: #fff;font-size: 1.5rem;height:40px;line-height:40px;overflow: hidden;}

#m_nav .on .a{ }

#m_nav .on .a strong{color:#fff;}

#m_nav .on.title .a i{ transform:rotate(270deg);-webkit-transform:rotate(270deg); -moz-transform:rotate(270deg);}

#m_nav .title .a i{  opacity:1;filter:alpha(opacity=100);}

#m_nav .title .a {margin: 0 0;}

#m_nav .title .list{display:none;position:relative; }

#m_nav .title{position:relative}

#m_nav .title .list{position:relative;width:100%;z-index:9;padding: 0 1.7em;}

#m_nav .title .list .box{padding:0 30px 10px 30px;background:#f5f5f5}



#m_nav .title .list a{display:block;font-size: 14px;color: rgba(255,255,255,0.5);text-align: left;line-height:3rem;}



#j_seach_box{ position:fixed; z-index:9999; top:0;  left:0; display:none; height:100%; width:100%; }

#j_seach_box .bg_box{ position:fixed; z-index:9994; top:0px; display:none;  height:100%; width:100%;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#D8000000', endColorstr='#D8000000');background:rgba(0,0,0,0.85);}

#j_seach_box form{position:absolute;border-radius: 4px;overflow: hidden;top:50%;z-index:9999;background: #fff;height: 60px;width: 50%;left:50%;margin-left: -25%;margin-top:-40px;}

#j_seach_box input[type="text"]{border: none;width: 94%;display: block;height: 60px;text-align: left;color: #434343;font-size: 14px;background:none;line-height: 60px;padding:0 20px;}

#j_seach_box input[type="text"]:focus{ text-align: left;}

#j_seach_box input[type="submit"]{position:absolute;right:0;top: 50%;padding: 0;z-index:2;background:url(../images/icon_search.png) center no-repeat;height: 60px;width: 70px;cursor:pointer;border:none;background-size: 20px 20px;margin-top: -30px;}

#j_seach_box input[type="submit"]:hover{background:url(../images/icon_search_hover.png) center no-repeat; background-size: 20px 20px;}








/*====内页banner====*/

#n_banner{display:block;width:100%;height: 350px;position: relative; margin-top:80px;}

#m_n_banner{position: absolute;left: 0;top: 0;width: 100%;height: 160px;display: none;}

#n_banner .main_box{display: table;width: 100%;height: 100%;}

#n_banner .box{ display: table-cell; vertical-align: middle;   overflow:hidden; text-align:center; }

#n_banner h1{font-size: 1.625rem;color: rgba(255,255,255,1);display:block;text-transform:uppercase;font-weight: bold;line-height: 2rem;}

#n_banner h3{display:block;margin: 0;font-size: 1.5625rem;color: #fff;text-transform:uppercase;margin-bottom: 0.3rem;}

#n_banner h6{ text-align:center;}

#n_banner h6 i{display: inline-block;width: 1.5625rem;height:3px;background: #0054A3;}



/* footer */
.f_bg{ background:url(../images/footer_bg.jpg) center top no-repeat #00002c; color:#ccc; font-size:14px; clear:both; padding-top:20px; text-align:left; }
.f_bg_div{ max-width:1280px; width:96%; margin:0 auto;}
.f_bg a{color:#ccc; text-decoration:none;}
.f_bg a:hover{ color:#db2800;}
.f_bg .h2{ height:62px; line-height:62px; font-weight:bold; font-size:18px;color:#fff; }
.f_bg .links{ float:left; width:16.5%;overflow:hidden;  margin-bottom:30px;vertical-align:top;}
.f_bg .links ul li{ display:block; height:25px; line-height:25px; overflow:hidden;}
.f_bg .links ul li a{transition:all 0.3s; padding-right:5px; }
.f_bg .links ul li a:hover{ margin-left:2px; padding-right:0;}
.f_bg .f_div2_r2{ float:right;text-align:left;}
.f_bg .f_div2_r2 .f_div2_img{ float:left; margin-right:35px; width:120px; line-height:34px; text-align:center;}
.f_bg .f_div2_r2 .f_div2_img img{ width:100px; height:100px; margin:0 auto; display:block; margin-top:24px;}
.f_bg .f_div2_r2 .f_div2_r2_con{ float:right; text-align:right; margin-top:20px;}
.f_bg .f_div2_r2 .tels{ color:#ccc; display:block; transition:all 0.3s; position:relative; overflow:hidden;}
.f_bg .f_div2_r2 .tels span{ color:#fff; display:block;margin-top:5px; margin-bottom:5px; font-size:24px;}
.f_bg .f_div2_r2 .tels:hover span{filter: Alpha(Opacity=80);opacity: 0.8;}
/*.f_bg .f_div2_r2 .tels:after{ content:""; position:absolute; bottom:0; right:0; height:2px; width:22px; background:#525252;}*/
.f_div3 a:hover{color:#fff;transition:all 0.3s;filter: Alpha(Opacity=80);opacity: 0.8;}
.f_div3{ line-height:24px; min-height:24px; text-align:center; border-top:1px solid #0b1746;  margin-top:10px;  color:#ccc; font-size:14px; padding-top:20px; padding-bottom:30px;}
.f_div3 a{ color:#666666;}
.f_bg .f_div2_r2 a img:hover{transition:all 0.3s;filter: Alpha(Opacity=80);opacity: 0.8; color:#fff;}


@media screen and (max-width: 1260px) {
.f_bg .links{ width:14%;}
.f_bg .f_div2_r2{ text-align:right;}
.f_bg .f_div2_r2 .f_div2_img{ margin-right:0; float:none; display:inline-block; margin-top:0px;}
.f_bg .f_div2_r2 .f_div2_r2_con{ float:none;}
}

@media screen and (max-width: 1100px) {
.f_bg{ font-size:13px;}
.f_bg .h2{ height:50px; line-height:50px;}
}

@media screen and (max-width: 960px) {
.f_bg{ padding-top:30px;}
.f_bg .links{ display:none;}
.f_bg .f_div2_r2{ float:none; text-align:center;}
.f_bg .f_div2_r2 .f_div2_r2_con{ text-align:center; margin-top:0;}
/*.f_bg .f_div2_r2 .tels:after{ left:50%; margin-left:-10px;}*/
.f_bg_div{ text-align:center; padding-bottom:10px;}
.foot_a{ margin-bottom:20px; text-align:center;}
.f_bg .f_div2_r2 .tels span{ margin-top:10px; margin-bottom:10px; }
}

@media screen and (max-width: 780px) {
.f_div3 .l{ float:none; display:block;}
.f_div3 .r{ float:none; display:block;}
}

@media screen and (max-width: 640px) {
.f_bg{ padding-top:20px;}
.f_div3{ font-size:13px; line-height:20px; min-height:20px; padding-bottom:0;}
.f_div3 span{ display:block;}
.f_div3 .l{ float:none;}
.f_div3 .r{ float:none;}
.foot_a{ margin-bottom:10px;}
}




@media(max-width: 1200px){

	#header{ display:none}
	#m_header{display:block;position:fixed; background:#000;box-shadow: 0 0 20px rgba(0,0,0,0.1);}

	#n_banner{ margin-top:0;}
}




@media(max-width: 992px){

	#banner{ display:none}
	#m_banner, #m_header, #m_n_nav{ display:block}

	.n_title{ display:none}

	

	.n_menu{width: 100%;padding: 2.5rem 1rem 2.5rem;margin-bottom: 2rem;}
	.n_menu ul li{width: 49%;float: left;margin-right: 2%;}
	.n_menu ul li:nth-child(2n){ margin-right:0}
	.n_menu .more{ width:100%}


}



@media(max-width: 768px){
	#banner, .n_title{ display:none}
	#m_banner{ display:block}

	/*====banner====*/

	#n_banner{height: 200px; margin:0; padding-top:50px;}
	#m_n_banner{ display:block}

	#n_banner h1{ font-size:16px;}
	#n_banner h3{ font-size:13px;}

  }