/* CSS Document */

/***头部***/
.header {display:block;}
.m-header {display:none;}

.header {position:fixed; top:0; left:0; width:100%; background-color:rgba(0, 0, 0, 0.6); z-index:9;}
.header .main {height:90px; position:relative;}
.header:hover {background-color:rgba(0, 0, 0, 0.9);}

.header-logo {float:left; margin-top:19px; width:406px;}

.nav {float:right; margin-top:38px;}
.nav li {float:left; margin-left:40px; font-size:16px; position:relative;margin-bottom:10px;}
.nav li a {display:inline-block; padding:4px 0 10px 0; height:24px; line-height:24px; color:#fff;}
.nav h2 {font-size:16px;}
.nav ul>li.intro>h2:before {content: "";position:absolute; width:70px; height:2px; background-color:#ff6600; left:50%; margin-left:-35px; bottom:0;}
.nav ul>li.intro>h2:before a{color:#F60;}

#nav_hover_bg {width:100%; height:0; background-color:rgba(0, 0, 0, 0.85); position:absolute; top:90px; z-index:99; overflow:hidden;}
.sub-nav {width:100%; height:0; z-index:999; background:#F30; padding-top:100px;}
.sub-nav .sub-nav-list {position:relative; float:left; margin-right:40px; margin-top:20px;}
.sub-nav .sub-nav-list>h3 {color:#fff; font-weight:600; margin-bottom:10px; font-size:14px; height:30px; line-height:30px; border-bottom:1px solid #555;}
.sub-nav .sub-nav-list .list a {float:left; display:block; width:180px; height:24px; line-height:24px; font-size:14px; color:#ccc;}
.sub-nav .sub-nav-list .list a:hover {color:#fff;}

.top-bar {position:absolute; top:5px; right:0; height:28px; line-height:28px;}
.top-bar a, .top-bar span {display:inline-block; margin-left:15px; height:28px; color:#dbdbdb;}
.top-bar a:hover {color:#fff;}


@media screen and (max-width:768px) {
.header {display:none;}
.m-header {display:block; position:fixed; top:0; left:0; z-index:99; width:100%; background-color:rgba(0, 0, 0, 0.85);}

.m-header .main {padding:5px 3%; overflow:hidden; width:94%;}
.m-header-logo {float:left; width:180px;}
.m-header-logo img{ width:100%;}

.nav-btn {position:relative; float:right; margin:9px -9px 0 0; width:50px; height:30px; cursor:pointer;}
.nav-btn span {position:absolute; left:10px; display:block; width:30px; height:2px; background:#fff; transition:all ease 0.35s;}
.nav-btn span:nth-of-type(1){top:0;}
.nav-btn span:nth-of-type(2){top:10px;}
.nav-btn span:nth-of-type(3){top:20px;}
.nav-btn-se span:nth-of-type(1){top:10px; transform:rotate(45deg);}
.nav-btn-se span:nth-of-type(2){width:0}
.nav-btn-se span:nth-of-type(3){top:10px; transform:rotate(-45deg);}

.m-nav {position:fixed; top:-100%; left:0; z-index:9999; width:100%; height:calc(100% - 100px); font-size:16px; line-height:42px; background:#eee; overflow:auto; overflow-x:hidden; transition:top ease 0.35s; opacity:.95;}
.nav-show {top:49px; height:100%;}
.nav-show ul {border-bottom:1px #ddd solid;}
.m-nav ul li i {position:absolute; top:5px; right:0px; border-left:1px #ddd solid; height:30px; padding:0 17px 0 17px;}
.m-nav ul li i svg {transform:rotate(-90deg); transition:all ease 0.35s;}
.m-nav ul li .m-nav-i-se svg {transform:rotate(0deg);}
.m-nav ul li {position:relative; padding-left:20px; line-height:40px; font-size:15px; border-top:1px #ddd solid;}
.m-nav >ul >li:last-child {border-bottom:1px #ddd solid;}
.m-nav ul li ul {display:none;}
.m-nav ul li a {color:#000;width:80%;}
.m-nav ul li ul li a {display:block; font-size:14px; color:#6a6a6a; line-height:36px; text-align:left;}
.m-nav ul li i svg {width:20px; height:20px; fill:#555;}
.m-nav ul li .m-nav-i-se svg {fill:#008cd6;}
.m-nav ul li ul li>ul {margin-left:10px;}
}