.header{
	background-color: #131313;
}
.header .phone-bar{
	position:absolute;
	z-index:9;
	left:0;
	top:0px;
	width: 44px;
	height: 44px;
	color:#fff;
	font-size:22px;
	text-align: center;
	line-height: 44px;
	background-color: #faaf40;
	display: none;
}
.header .logo-cooper{
	padding:34px 0px;
}
.header .logo-cooper .line-v{
	display: inline-block;
	width: 1px;
	height: 48px;
	margin:0px 30px;
	background-color: #232323;
	vertical-align: middle;
	display:none;
}
.header .phone-operation{
	position: absolute;
	top:50%;
	right:0px;
	margin-top:-19px;
}
.header .phone-operation .phone,
.header .phone-operation .phone-icon-small,
.header .phone-operation .phone-number,
.header .phone-operation a[href],
.header .phone-operation a[href] span,
.header .phone-operation .register-icon,
.header .phone-operation .login-icon{
	display: inline-block;
	color:#fff;
	vertical-align: middle;
}
.header .phone-operation a[href]{
	padding:0px 20px;
	margin-left:15px;
	line-height: 38px;
	background-color: #faaf40;
	border-radius:2px;
	transition: border-radius 0.3s;
	-webkit-transition: border-radius 0.3s;
	-moz-transition: border-radius 0.3s;
	-ms-transition: border-radius 0.3s;
}
.header .phone-operation a[href]:hover{
	border-radius:19px;
}
.header .phone-operation .register-icon{
	width:14px;
	height: 14px;
	margin-right:10px;
	background: url("../images/register-icon.png") center center no-repeat;
}
.header .phone-operation .login-icon{
	width:15px;
	height: 15px;
	margin-right:10px;
	background: url("../images/login-icon.png") center center no-repeat;
}
.header .phone-operation .phone-icon-small{
	width: 14px;
	height:14px;
	background: url("../images/phone-small.png") center center no-repeat;
}
.header .phone-operation .phone-number{
	margin:0px 15px 0px 10px;
	font-size:12px;
}


.header .nav-language{
	background-color: #1a1a1a;
}
.header .nav>li{
	position: relative;
	float:left;
}
.header .nav>li:hover{
	text-decoration:none;
	
}
.header .nav>li a:link,
.header .nav>li a:active,
.header .nav>li a:visited{
	background-color: transparent;
}
.header .nav>li>a{
	padding:22px 30px;
	color:#fff;
	cursor: pointer;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
}
.header .nav>li:first-child>a{
	margin-left:-30px;
}
.header .nav>li:hover>a{
	background-color: transparent;
	color:#faaf40;
}
.header .nav>li .nav-line{
	position: absolute;
	right:0px;
	top:50%;
	margin-top:-1px;
	width:2px;
	height:2px;
	background-color: #faaf40;
}
.header .nav>li>ul{
	position: absolute;
	z-index:999;
	top:100%;
	left:30px;
	background-color: #131313;
	display: none;
}
.header .nav>li>ul li{
	line-height: 44px;
}
.header .nav>li>ul li + li{
	border-top:1px dashed #2a2a2a;
}
.header .nav>li>ul li a{
	padding:0px 25px 0px 15px;
	color:#eee;
	white-space: nowrap;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
}
.header .nav>li>ul li:hover a{
	color:#faaf40;
	text-decoration: none;
}
/*
.header .nav>li.enter .nav-line{
	height:1px;
	animation: lineEnter 0.3s both;
	-webkit-animation: lineEnter 0.3s both;
}
.header .nav>li.enter>ul.nav-child{
	animation: childEnter 0.3s linear both;
	-webkit-animation: childEnter 0.3s linear both;
}*/
.header .nav>li.leave .nav-line{
	animation: lineLeave 0.3s;
	-webkit-animation: lineLeave 0.3s;
}
.header .nav>li.leave>ul.nav-child{
	animation: childLeave 0.3s both;
	-webkit-animation: childLeave 0.3s both;
}


.header .lang{
	position: absolute;
	right:0px;
	top:50%;
	margin-top:-32px;
	line-height: 64px;
	display:none;
}
.header .lang .choose-language{
	cursor: pointer;
}
.header .lang span{
	display: inline-block;
	margin-left:10px;
	vertical-align: middle;
	color:#888;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
}
.header .lang-list{
	position:absolute;
	z-index:999;
	right:0px;
	top:64px;
	line-height: 44px;
	white-space: nowrap;
	background-color: #131313;
	display: none;
}
.header .lang-list li{
	padding:0px 25px 0px 15px;
}
.header .lang-list li + li{
	border-top:1px dashed #2a2a2a;
}
.header .lang-list li:hover span{
	color:#fff;
}
.header .lang.enter .lang-list{
	animation: langEnter 0.3s linear both;
	-webkit-animation: langEnter 0.3s linear both;
}
.header .lang.leave .lang-list{
	animation: langLeave 0.3s linear both;
	-webkit-animation: langLeave 0.3s linear both;
}


.header .nav-phone{
	position:absolute;
	z-index:9999;
	top:-44px;
	width:194px;
	left:-198px;
	padding:14px 30px 14px 22px;
	margin-left:-5%;
	line-height:26px;
	background: url(../images/bg.png);
	overflow: auto;
}
.header .nav-phone>li>a{
	color:#fff;
}
.header .nav-phone>li>ul a{
	padding-left:14px;
	color:#888;
}


@keyframes lineEnter{
	from{
		right:0px;
		width:1px;
	}
	to{
		width:70%;
		right:15%;
	}
}
@-webkit-keyframes lineEnter{
	from{
		right:0px;
		width:1px;
	}
	to{
		width:70%;
		right:15%;
	}
}
@keyframes lineLeave{
	from{
		width:70%;
		right:15%;
		height:1px;
	}
	to{
		right:0px;
		width:1px;
		height:1px;
	}
}
@-webkit-keyframes lineLeave{
	from{
		width:70%;
		right:15%;
		height:1px;
	}
	to{
		right:0px;
		width:1px;
		height:1px;
	}
}
@keyframes childEnter{
	from{
		opacity: 0;
		left:35px;
	}
	to{
		opacity: 1;
		left:15px;
	}
}
@-webkit-keyframes childEnter{
	from{
		opacity: 0;
		left:35px;
	}
	to{
		opacity: 1;
		left:15px;
	}
}
@keyframes childLeave{
	from{
		opacity: 1;
		left:15px;
	}
	to{
		opacity: 0;
		left:35px;
	}
}
@-webkit-keyframes childLeave{
	from{
		opacity: 1;
		left:15px;
	}
	to{
		opacity: 0;
		left:35px;
	}
}
@keyframes langEnter{
	from{
		opacity: 0;
		right:20px;
	}
	to{
		opacity: 1;
		right:0px;
	}
}
@-webkit-keyframes langEnter{
	from{
		opacity: 0;
		right:20px;
	}
	to{
		opacity: 1;
		right:0px;
	}
}
@keyframes langLeave{
	from{
		opacity: 1;
		right:0px;
	}
	to{
		opacity: 0;
		right:20px;
	}
}
@-webkit-keyframes langLeave{
	from{
		opacity: 1;
		right:0px;
	}
	to{
		opacity: 0;
		right:20px;
	}
}


@media screen and (max-width:1199px){
	
	.mobile-body .header .logo-cooper img{
		width: 32%;
	}
	.mobile-body .header .phone-operation{
		margin-top:-16px;
	}
	.mobile-body .header .phone-operation a[href]{
		padding:0px 12px;
		line-height: 32px;
	}
	
	
	.mobile-body .header .nav>li>a{
		padding:16px 22px;
	}
	
	
	.mobile-body .header .lang{
		margin-top:-26px;
		line-height: 52px;
	}
	.mobile-body .header .lang-list{
		top:52px;
	}
}


@media screen and (max-width:1023px){
	
	.mobile-body .header .nav>li>a{
		padding:16px 14px;
	}
	.mobile-body .header .nav>li:first-child>a{
		margin-left:-12px;
	}
}


@media screen and (max-width:767px){
	.mobile-body .header{
		position: fixed;
		z-index: 99999;
		left:0px;
		top:0px;
		width: 100%;
		transition: all 0.3s;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-ms-transition: all 0.3s;
	}
	.mobile-body .header .phone-bar{
		display: block;
	}
	.mobile-body .header.show-nav{
		left:194px;
	}
	
	.mobile-body .header .logo-cooper{
		padding:8px 0px 8px 34px;
	}
	.mobile-body .header .logo-cooper img{
		width: 58%;
	}
	.mobile-body .header .cooper-logo,
	.mobile-body .header .logo-cooper .line-v,
	.mobile-body .header .phone-operation .phone,
	.mobile-body .header .phone-operation .register-btn,
	.mobile-body .header .phone-operation .login-btn .login-icon{
		display: none;
	}
	.mobile-body .header .phone-operation .login-btn{
		padding:0px;
		background-color: transparent
	}
	.mobile-body .header .lang{
		position: absolute;
		top:-18px;
		line-height:44px;
	}
	.mobile-body .header .lang-list{
		top:44px;
	}
	.mobile-body .header .phone-operation{
		right:88px;
	}
	.mobile-body .header .phone-operation a[href]{
		padding:0px 12px;
		line-height: 32px;
	}
}


@media screen and (max-width:567px){
	.mobile-body .header .nav-phone{
		left:-196px;
	}
}