/*input::-webkit-input-placeholder {color: #fede9e !important; }
input::-moz-placeholder {color: #fede9e !important; }
input::-moz-placeholder {color: #fede9e !important;}
input::-ms-input-placeholder {color: #fede9e !important;}*/
html,body{overflow-x: hidden;}
.divBox{width: 1200px;margin:0 auto;}
.mobile i,.divBox,.nav li a:after,.nav{
	transition: all .8s cubic-bezier(.35,.75,.55,1);
	-webkit-transition: all .8s cubic-bezier(.35,.75,.55,1);
	-moz-transition: all .8s cubic-bezier(.35,.75,.55,1);
}


header{height: 50px;background: transparent;line-height: 50px;position: fixed;width: 100%;z-index: 33;top:40px}

.mobile{display: inline-block;float: right;width: 35px;line-height: 3px;cursor: pointer;margin-top: 25px;position: relative;z-index: 100;}
.mobile i{display: inline-block;width: 100%;height: 3px;background: #003069;margin-top:8px;border-radius: 3px;}


.mobile i:nth-child(2),.mobile i:nth-child(3){width: 43%;}
.mobile.active i:nth-child(1){transform: rotate(45deg) translateY(8px) translateX(8px);
	transition: all .5s cubic-bezier(.35,.75,.55,1) .2s;
	-webkit-transition: all .5s cubic-bezier(.35,.75,.55,1) .2s;
	-moz-transition: all .5s cubic-bezier(.35,.75,.55,1) .2s;
}
.mobile.active i:nth-child(4){transform: rotate(-45deg) translateY(-8px) translateX(8px);}
.mobile.active i:nth-child(2){transform: translateX(-30px);opacity: 0;}
.mobile.active i:nth-child(3){transform: translateX(30px);opacity: 0;}


header.active .divBox{width: 95%;}
.nav{position: fixed;top:0;right:-400px;background: rgba(246,246,248,.9);width: 250px;z-index: -1;height: 100%;box-sizing: border-box;line-height: 65px;padding-top: 150px;box-shadow: 0 0 10px 0 lightgray;}
.nav li{box-sizing: border-box;border-bottom: 1px solid lightgray;position: relative;}
.nav li:first-child{border-top: 1px solid lightgray;}
.nav li a{display: block;font-size: 14px;color: #333;box-sizing: border-box;padding-left: 60px;}
.nav li a:after{content: '';display: block;width: 0%;height: 100%;background:#003069;position: absolute;z-index: -1;top:0;left: 0;}
.nav li:hover a:after,.nav li.active a:after{width: 100%;}
.nav li:hover a,.nav li.active a{color: white;}
.nav.active{right:0;z-index: 20;}



.nav li{transform:translateY(100px);opacity: 0;}

.nav.active li{transform:translateY(0px);opacity: 1;}
.nav li:nth-child(1){transition: 0.4s ease-in-out 0.1s;}
.nav li:nth-child(2){transition: 0.4s ease-in-out 0.2s;}
.nav li:nth-child(3){transition: 0.4s ease-in-out 0.3s;}
.nav li:nth-child(4){transition: 0.4s ease-in-out 0.4s;}
.nav li:nth-child(5){transition: 0.4s ease-in-out 0.5s;}
.nav li:nth-child(6){transition: 0.4s ease-in-out 0.6s;}
.nav li:nth-child(7){transition: 0.4s ease-in-out 0.7s;}
.nav li:nth-child(8){transition: 0.4s ease-in-out 0.8s;}
.nav li:nth-child(9){transition: 0.4s ease-in-out 0.9s;}


.logo img{width: 90px;}
.mobile{width: 25px;margin-top: 12px;}
.mobile i:nth-child(2), .mobile i:nth-child(3){width: 40%;}
.mobile i{margin-top:5px;}
.mobile.active i:nth-child(4) {transform: rotate(-45deg) translateY(-7px) translateX(7px);}
.mobile.active i:nth-child(1) {transform: rotate(45deg) translateY(4px) translateX(5px);}
.nav{line-height: 40px;}
.nav li,.nav li:nth-child(1){border-color: #eee;}



.cbl{position: fixed;top: 50%;right: 0;z-index: 99;transform: translateY(-50%);}
.cbl h6{display: block;width: 50px;height: 50px;line-height: 50px;text-align: center;background: #003069;color: #fff;font-size: 24px;cursor: pointer;
	transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
}
.cbl h6:hover{background: #265b9f;color: #fff;}

