/*白色背景的头部*/
.header.on{background: #fff;box-shadow: 0 0px 17px 0 rgba(0,0,0,0.1);}
.header.on .logo .img1{display: none;}
.header.on .logo .img2{display: block;}
.header.on .navbar_nav li a{color: #333;}
.header.on .navbar_nav li:hover a{color: #163264;}
#navToggle{display: none;}
.m_nav{position: fixed;top: 0px;width: 100%; height: 100%;
 background: #fff;transition: all ease 0.5s; -webkit-transition: all ease 0.5s;z-index: 1000; opacity: 1;
 visibility: visible; margin-top: 0; overflow-y: auto; transition: all .6s cubic-bezier(.77, 0, .175, 1) 0ms;
 top: 0;  transform: translateX(100%);}
.m_nav.open{ transform: translateX(0);}
.m_nav .top{height: 60px;padding: 20px;box-sizing: border-box;}
.m_nav .top .closed{width: 30px;height: 30px;vertical-align: middle;float:right;cursor: pointer;}
.m_nav .logo{	width: 100%;margin:0 auto;}
.m_nav .logo img{height: 50px;display: block;margin:30px auto;}
.m_nav .ul{margin-top: 30px;}
.m_nav .ul li{padding: 0 20px;border-bottom: 1px solid #f2f2f2;transform: translateY(0);-webkit-transform: translateY(100%); transform: translateY(100%);  -webkit-transition: all .6s cubic-bezier(.77, 0, .175, 1) 0ms;
 transition: all .6s cubic-bezier(.77, 0, .175, 1) 0ms; opacity: 0;}
.m_nav.open .ul li{opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}
.m_nav .ul li:nth-child(1) { -webkit-transition: all .2s cubic-bezier(.77, 0, .175, 1) 0ms;
  transition: all .2s cubic-bezier(.77, 0, .175, 1) 0ms;}
.m_nav .ul li:nth-child(2) { -webkit-transition: all .4s cubic-bezier(.77, 0, .175, 1) 0ms;
 transition: all .4s cubic-bezier(.77, 0, .175, 1) 0ms;}
.m_nav .ul li:nth-child(3) {
    -webkit-transition: all .6s cubic-bezier(.77, 0, .175, 1) 0ms;
    transition: all .6s cubic-bezier(.77, 0, .175, 1) 0ms;
}
.m_nav .ul li:nth-child(4) {
    -webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1) 0ms;
    transition: all .8s cubic-bezier(.77, 0, .175, 1) 0ms;
}
.m_nav .ul li:nth-child(5) {
    -webkit-transition: all 1.0s cubic-bezier(.77, 0, .175, 1) 0ms;
    transition: all 1.0s cubic-bezier(.77, 0, .175, 1) 0ms;
}
.m_nav .ul li:nth-child(6) {
    -webkit-transition: all 1.2s cubic-bezier(.77, 0, .175, 1) 0ms;
    transition: all 1.2s cubic-bezier(.77, 0, .175, 1) 0ms;
}
.m_nav .ul li a{display: block;text-decoration: none;color: #333;font-size: 16px;height: 50px;line-height: 50px;
width: 100%;}
.m_nav .ul li .dropdown_menu{display: none;}
.m_nav .ul li.dropdown.active .dropdown_menu{display: block;}
.m_nav .ul li .dropdown_menu a{display: block;height: 50px;line-height: 50px;padding: 0 40px;
box-sizing: border-box;border-bottom: 1px solid #f5f5f5;}
.m_nav .ul li .dropdown_menu a:last-child{border: none;}


@media screen and (max-width: 992px){
.header{padding: 0 8px; height:50px;border-bottom:0}
.header .logo{ padding:0; height:50px;}
.header .logo img{ height:40px;}
.header #navToggle {height:50px;padding:5px 15px;margin-right: -15px;display: inline-block;float: right;}
.header #navToggle span {position: relative;width:23px;height:2px;	margin-top: 19px;}
.header #navToggle span:before,
.header #navToggle span:after {	content: '';position: relative;width: 100%;height:2px;left: 0;}
.header #navToggle span,.header #navToggle span:before,
.header #navToggle span:after {	-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;
transition: 0.3s;display: block;background: #FFF;}

.header #navToggle span:before {top:9px;}
.header #navToggle span:after {bottom: 11px;}
.header #navToggle.open span:before {top: 10px;-webkit-transform: translateY(-11px) rotate(-45deg);
-moz-transform: translateY(-11px) rotate(-45deg);-ms-transform: translateY(-11px) rotate(-45deg);
-o-transform: translateY(-11px) rotate(-45deg);	transform: translateY(-11px) rotate(-45deg);}
.header #navToggle.open span:after {	bottom: 12px;-webkit-transform: translateY(10px) rotate(45deg);
-moz-transform: translateY(10px) rotate(45deg);-ms-transform: translateY(10px) rotate(45deg);
-o-transform: translateY(10px) rotate(45deg);transform: translateY(10px) rotate(45deg);}
.header #navToggle.open span {background: none;}
.header #navToggle.open span:before,
.header #navToggle.open span:after {	background: #4f4f4f;}
.header .nav{display: none;}
.header:hover #navToggle span:after,.header:hover #navToggle span,
.header:hover #navToggle span:before{ background:#666}
.header.on #navToggle span:after,.header.on #navToggle span,
.header.on #navToggle span:before{ background:#666}
}