body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, p, blockquote, th, td { padding: 0; margin: 0;}
fieldset, img { border: 0;}
table {border-collapse: collapse;border-spacing: 0;}
ol, ul {list-style:none;}
address, caption, cite, code, dfn, em, th, var {font-weight: normal;font-style: normal;}
caption, th {text-align: left;}
h1, h2, h3, h4, h5, h6 {font-weight: normal;font-size: 100%;}
p:before, q:after {content: '';}
abbr, acronym { border: 0;}
a{text-decoration:none;}
.clr {HEIGHT: 0px; VISIBILITY: hidden; CLEAR: both; FONT-SIZE: 0px; OVERFLOW: hidden}
BODY {FONT-SIZE: 12px; color:#000; font-family:"微软雅黑" }
samp{font-family:"微软雅黑"}
img{ vertical-align:bottom}
input[type="text"],input[type="hidden"],input[type="password"],input[type="radio"],input[type="button"],input[type="submit"],button,textarea,select{outline: none; border: none; -webkit-appearance: none;-moz-appearance:none; appearance: none; border-radius: 0; font-family: 'Microsoft YaHei',"Arial",'SimSun', Serif;}

/*加载字体*/
@font-face{font-family:'dinmedium'; src: url('../fonts/DIN Medium.ttf');}
@font-face{font-family:'kzhei'; src: url('../fonts/kzhei.ttf');}
@font-face{font-family:'DINPro'; src: url('../fonts/DINPro-Regular.otf');}
@font-face{font-family:'zhankuhei'; src: url('../fonts/zhankuhei.TTF');}
@font-face{font-family:'sszhhei'; src: url('../fonts/sszhhei.ttf');}

/*header*/
.header{ width:100%; height:72px; background:#fff; position:fixed;left:0px;top:0px; z-index:12345;box-shadow:0px 0px 10px rgba(0,0,0,0.1)}
.logo{ /*float:left;*//* width:200px; height:100%; overflow:hidden; background:#108cee; text-align:center*/}
/*.logo:before{ height:100%; content:""; display:inline-block; vertical-align:middle}
.logo a{ width:100%; height:auto; display:inline-block; vertical-align:middle;}
.logo a img{ height:40px}*/

.header-menu{ float:left; width:90px; height:100%; position:relative;  }
.header-button{ float:left; width:100%; height:100%; overflow:hidden;cursor:pointer}
.header-button span{ float:left; width:100%; overflow:hidden; background:url(../images/icon-1.png) no-repeat center; height:20px; margin-top:16px;transition:all 0.2s linear}
.header-button p{ float:left; width:100%; overflow:hidden; font-size:14px; color:#324b5c; text-align:center; margin-top:2px;opacity:1;transition:opacity 0.15s linear 0.2s}
.header .active .header-button span{ background:url(../images/icon-2.png) no-repeat center; margin-top:26px}
.header .active .header-button p{opacity:0}
.header-drop{ width:auto; position:absolute;left:0px;top:100%;box-shadow:0 5px 10px inset rgba(2, 2, 2, 0.1);opacity:1; visibility:hidden;transform:translateY(40px);transition:transform 0.3s, opacity 0.35s, visibility 0.1s; overflow:hidden; }
.header-drop:before{content: '';width: 0;height: 0;border-left: 20px solid transparent;border-right: 20px solid transparent;border-bottom: 20px solid #e6e6e6;position: absolute;top: -10px;left: 25px;}
.header-drop ul{ width:260px; padding:1.5vw 0 4.5vw;background:#e6e6e6;height:calc(465px + 6vw);box-sizing:border-box;}
.header .active .header-drop{overflow: inherit;opacity: 1;visibility: visible;-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);-webkit-transition: transform 0.3s, opacity 0.35s, visibility 0s;-moz-transition: transform 0.3s, opacity 0.35s, visibility 0s;-ms-transition: transform 0.3s, opacity 0.35s, visibility 0s;transition: transform 0.3s, opacity 0.35s, visibility 0s;}

.header .active .header-drop ul,.header .active .header-drop:before{opacity:1}
.header-drop ul li{ float:left; width:100%; text-align:left}
.header-drop ul li a{ display:block; line-height:42px; font-size:15px; color:#464646; padding:0px 30px}
.header-drop ul .sub>a{ background:url(../images/icon-3.png) no-repeat 85% center}
.header-drop ul li a:hover{ background:#f0f0f0; color:#108cee}
.header-drop ul .sub.open>a{ background:#f0f0f0 url(../images/icon-4.png) no-repeat 85% center; color:#108cee}

.sub-drop{ width:auto; position:absolute;left:260px;top:0px; z-index:1; height:100%; visibility:hidden; overflow:hidden}
.sub-drop ul{ height:100%; background:#f0f0f0;transform:translateX(-100%);transition-delay:1s}
.sub-drop .ul3{ background:#fafafa}
.sub-drop ul h3{ width:200px; overflow:hidden; margin:0px auto 5px; padding-bottom:5px; line-height:32px; font-size:16px; color:#464646; border-bottom:1px solid #dddddd; font-weight:bold;transform: translateX(-110%);transition: transform 0.3s 1s, opacity 0.2s 0s;opacity:0}
.header-drop ul .open>.sub-drop{ visibility:visible; width:520px; z-index:3}
.header-drop ul .open>.sub-drop>.ul2,.header-drop ul .open>.sub-drop>.ul3{transform:translateX(0%);transition: transform 0.2s linear;transition-delay:.2s;}
.header-drop ul .open>.sub-drop>.ul2 h3,.header-drop ul .open>.sub-drop>.ul3 h3{opacity:1;transform:translateX(0%);transition-delay:0.2s,0.3s}
.header-drop ul .sub-drop>.ul2>li>a,.header-drop ul .sub-drop>.ul3>li>a{ opacity: 0;-webkit-transform: translateX(-110%);-moz-transform: translateX(-110%);-ms-transform: translateX(-110%);transform: translateX(-110%);-webkit-transition: transform 0.3s 1s, opacity 0.2s 0s;-moz-transition: transform 0.3s 1s, opacity 0.2s 0s;-ms-transition: transform 0.3s 1s, opacity 0.2s 0s;transition: transform 0.3s 1s, opacity 0.2s 0s;}
.header-drop ul .open>.sub-drop>.ul2>li>a,.header-drop ul .open>.sub-drop>.ul3>li>a{opacity:1;transform:translateX(0%);transition-delay:0.2s,0.3s}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(2)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(2)>a{transition-delay: 218ms, 318ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(3)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(3)>a{transition-delay: 236ms, 336ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(4)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(4)>a{transition-delay: 254ms, 354ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(5)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(5)>a{transition-delay: 272ms, 372ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(6)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(6)>a{transition-delay: 290ms, 390ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(7)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(7)>a{transition-delay: 308ms, 408ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(8)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(8)>a{transition-delay: 326ms, 426ms;}
.header-drop ul .open>.sub-drop>.ul2>li:nth-child(9)>a,.header-drop ul .open>.sub-drop>.ul3>li:nth-child(9)>a{transition-delay: 344ms, 444ms;}
.header-drop ul .sub-drop ul p{width:100%; position:absolute;left:0px;bottom:10px}
.header-drop ul .sub-drop ul p a{display:block; line-height:42px; font-size:15px; color:#108cee; padding:0px 30px;opacity:0;transition:0.2s ease 0.5s}
.header-drop ul .open>.sub-drop>.ul3>p a{opacity:1}
.header-drop ul .sub-drop ul .sub.open>a{ background-color:#fafafa}
.header-drop ul .sub-drop .ul3 li a:hover{ background-color:#fff}
.nav2{ float:right; width:auto; overflow:hidden; margin-right:80px}
.nav2 ul{ float:left; width:auto; overflow:hidden}
.nav2 ul li{ float:left; width:auto; margin-left:45px; line-height:72px; font-size:16px; color:#324b5c}
.nav2 ul li a{ color:#324b5c; cursor:pointer; display:block; position:relative}
.nav2 ul li a:before{ width:0%; content:""; position:absolute;left:0px;bottom:0px; z-index:12; height:3px; background:#108cee;transition:all 0.3s ease}
.nav2 ul li a:hover:before{ width:100%}
.header-drop ul .close>.sub-drop{visibility: hidden; width:0px}
.header-drop ul .close>.sub-drop ul {transition-delay: 0s;}
.nav-home{ float:left; width:140px; height:42px; margin-left:70px; line-height:42px; text-align:center; background:#108cee;border-radius:3px; margin-top:15px} 
.nav-home a{ background:url(../images/icon-5.png) no-repeat left center; padding-left:26px; font-size:16px; color:#fff}
.nav-home:hover{ background:#0b7ad2}

.menu-slide{ display:none}

/*footer*/
.footer{ width:100%; overflow:hidden; background:#091924; padding-top:4.58vw;}
.footer-s{ width:90%; overflow:hidden;max-width:1440px; margin:0px auto}
.footer-1{ width:100%; overflow:hidden; position:relative; text-align:center; padding-left:4.5vw; box-sizing:border-box; padding-bottom:10px}
.footer-left{ width:auto; position:absolute;left:0px;top:0px; padding-left:4vw; background:url(../images/icon-6.svg) no-repeat left top; background-size:2.6vw auto; text-align:left;box-sizing:border-box}
.footer-phone{ display:block; box-sizing:border-box}
.footer-phone:nth-child(1){ padding-bottom:30px}
.footer-phone span{ display:block; font-size:18px; color:#fff}
.footer-phone p{ display:block; font-size:32px; color:#108cee;font-family:'dinmedium'}

.footer-center{ width:auto; display:inline-block; margin:0px auto; padding:0 7.8vw; text-align:left; border-left:1px solid #3a4750; border-right:1px solid #3a4750}
.footer-item{ display:inline-block; vertical-align:top;margin-right:4vw}
.footer-item h3{ font-size:18px; color:#fff}
.footer-item ul{ margin-top:30px}
.footer-item ul li{ display:block; margin-bottom:15px}
.footer-item ul li a{ font-size:14px; display:block; color:#c7c7c7;transition:all 500ms ease; position:relative}
.footer-item ul li a:before{content: '';width: 0;height:1px;background: #108cee;position: absolute;left: 0;bottom: 0;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-ms-transition: all 500ms ease;transition: all 500ms ease;}
.footer-item ul li a:hover{ color:#108cee}
.footer-item ul li a:hover:before{ width:60px}
.footer-item:last-child{ margin-right:0px}

.footer-right{ width:170px; position:absolute;right:0px;top:0px; text-align:left}
.footer-ra{ float:left; width:100%;}
.footer-ra span{ float:left; width:40px; height:30px; background:url(../images/icon-7.svg) no-repeat; background-size:18px auto; cursor:pointer; position:relative}
.footer-ra span:before{ width:auto; height:auto; content:""; position:absolute;left:5px;bottom:0px; z-index:12;border-bottom:5px #fff solid;border-left:5px transparent solid;border-right:5px transparent solid}
.footer-ra samp{ float:left; width:40px; height:30px; background:url(../images/icon-8.svg) no-repeat; background-size:16px auto; cursor:pointer; position:relative}
.footer-ra samp:hover{ background-image:url(../images/icon-9.svg); }

.footer-drop{ width:130px; height:70px; background:#fff; position:absolute;left:0px;top:50px; z-index:12;text-align:center;box-sizing:border-box; padding-top:16px;opacity:0; visibility:hidden;transition:all 0.4s ease}
.footer-drop:before{width:auto; height:auto; content:""; position:absolute;left:5px;top:-5px; z-index:12;border-bottom:5px #fff solid;border-left:5px transparent solid;border-right:5px transparent solid; }
.footer-drop a:nth-child(n){display: inline-block;vertical-align: top;float: none;margin: 0 5px 0 5px;width: 36px;height: 36px;border-radius: 50%;border: 1px solid #108cee;padding: 0;background-position: center;background-repeat: no-repeat;}
.footer-drop a:nth-child(1){ background:url(../images/icon-6.png) no-repeat center}
.footer-drop a:nth-child(2){ background:url(../images/icon-8.png) no-repeat center}
.footer-ra samp:hover .footer-drop{opacity:1; visibility:visible; top:30px}
.footer-rb{ float:left; width:100%; overflow:hidden}
.footer-wx{ float:left; width:140px; overflow:hidden}
.footer-wx span{ float:left; width:100%; overflow:hidden; display:none}
.footer-wx span img{ float:left; width:100%; height:auto}
.footer-wx span em{ float:left; width:100%; overflow:hidden; font-size:14px; color:#c7c7c7; line-height:30px}
.footer-wx .active{ display:block}
.footer-slide{ float:left; width:30px; overflow:hidden; height:140px; background:#fff}
.footer-slide span{ float:left; width:100%; height:70px; text-align:center; overflow:hidden; font-size:14px; color:#fff; background:#108cee;box-sizing:border-box;padding:0px 5px; cursor:pointer; padding-top:8px; line-height:17px}
.footer-slide .active{color:#108cee; background:#fff}

.footer-2{ width:100%; overflow:hidden; position:relative;margin-top: 2.6vw;padding-bottom:1.25vw;border-bottom: 1px solid #3a4750;}
.footer-logo{ position:absolute;left:0px;top:0px;}
.footer-logo img{ width:118px; height:auto}
.footer-link{ float:left; width:100%; overflow:hidden; padding-left:120px;box-sizing:border-box}
.footer-link a{display: inline-block;vertical-align: top;margin: 5px 0 5px 2.6vw;font-size: 14px;color: #c7c7c7;line-height: 20px;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-ms-transition: all 500ms ease;transition: all 500ms ease;}
.footer-link a:hover{ color:#108cee}

.footer-3{ width:100%; overflow:hidden;padding: 1.25vw 0px;font-size: 14px;color: #c7c7c7;}
.footer-3 em{ float:left; width:auto; overflow:hidden}
.footer-3 p{ float:right; width:auto; overflow:hidden}
.footer-3 p a{ color:#c7c7c7; margin-right:22px}



@media screen and (max-width:1440px){
/*header*/
.header{ height:60px;}
.header-button span{ margin-top:10px;}

.nav2{ margin-right:60px}
.nav2 ul li{ margin-left:35px; line-height:60px; font-size:15px; }
.nav-home{ width:120px; height:40px; margin-left:50px; line-height:40px; margin-top:10px} 
.nav-home a{ font-size:14px;}

}

@media screen and (max-width:1280px){
/*header*/
.nav2{ margin-right:40px}
.nav2 ul li{ margin-left:22px;font-size:14px; }
.nav-home{ width:100px; height:36px; margin-left:30px; line-height:36px; margin-top:12px} 
.nav-home a{ font-size:12px;}

/*footer*/
.footer-1{ padding-bottom:18px}
.footer-phone:nth-child(1){ padding-bottom:30px}
.footer-phone span{font-size:16px;}
.footer-phone p{font-size:26px;}
.footer-center{ padding:0px 5vw}
.footer-item h3{ font-size:16px;}
.footer-item ul{ margin-top:20px}
.footer-item ul li a{ font-size:14px; }
.footer-3 em{width:100%; text-align:center}
.footer-3 p{width:100%; text-align:center; margin-top:5px}
.footer-3 p a{ margin-right:22px}

}


@media screen and (max-width:996px){
/*header*/
.header{ height:50px}
.header-menu{ display:none}
.logo{ width:140px}
.logo a img{ height:30px}
.nav2{ width:100%; margin:0px; position:fixed;left:0px;top:50px; z-index:23456; background:rgba(255,255,255,0.9);box-shadow: 0 0 10px rgba(0,0,0,.1); display:none}	
.nav2 ul{ width:100%; padding:15px 30px;box-sizing:border-box}
.nav2 ul li{ width:20%; margin:0px; line-height:30px; height:30px; text-align:center}	
.nav-home{ display:none}	
.nav-active{ display:block}
	
.menu-slide{float:right; width:24px; margin-right:20px; margin-top:17px; display:block; cursor:pointer}
.menu-slide span{ float:left; width:24px; height:2px; overflow:hidden; background:#333}
.menu-slide span:nth-child(1){transition:all 0.3s ease}
.menu-slide span:nth-child(2){transition:all 0.3s ease; margin-top:5px}
.menu-slide span:nth-child(3){transition:all 0.3s ease; margin-top:5px}
.menu-active span:nth-child(1){transform: rotate(45deg);margin-top: 7px;}
.menu-active span:nth-child(2){ display:none}
.menu-active span:nth-child(3){transform: rotate(-45deg);margin-top:-1px}

/*footer*/
.footer{ padding-top:0.58vw}
.footer-1{ display:none}
.footer-logo{ float:left; width:100%; text-align:center; position:relative;left:0px;top:0px; overflow:hidden}
.footer-link{ padding-left:0px; text-align:center; margin-top:10px}
.footer-3 p a{ width:100%; display:inline-block}
}


@media screen and (max-width:768px){
/*header*/
.nav2 ul{ padding:15px 20px;}
.nav2 ul li{ width:33.33%; font-size:12px}	

.header{ width:100%; height:50px; background:#fff; position:fixed;left:0px;top:0px; z-index:12345;box-shadow:0px 0px 10px rgba(0,0,0,0.1)}
.logo{ float:left; width:140px; height:100%; overflow:hidden; padding:10px 0px; text-align:center}
.logo a{ width:100%; height:auto; display:inline-block; vertical-align:middle;}
.logo a img{ height:30px}

.navbar { background:#fff; position:fixed; left:0px; top:0px; width:100%; z-index:99999; }
.navPop.pra { position:fixed; }

.footer { position:relative; bottom:auto; height:auto; }
}