/* 头部和导航 */



/**/

.navWrp{
	width: 100%;
	height: 90px;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 800;
	padding: 0 40px;
	background: rgba(0,0,0,0.4);
}

.navWrp.navPos{
	background: rgba(0,0,0,0.85);
	top: 0;
	/*box-shadow: 1px 1px 1px #eee;*/
}


.navBg1{
	background: rgba(225,236,241,0.5);
}

.navBg1 .cnav{
	max-width: 1200px;
}

.navBg1 .cnav ul{
  display: -webkit-box;
  display: -webkit-flex;
  display: box;
  display: flex;
}



.logo{
	width: 100px;
	cursor: pointer;
}

.cnav{
	max-width: 1200px;
	height: 100%;
	margin: 0 auto;
}

.cnav dd{
	width: 45px;
}

.cnav ul{
	width: 460px;
	height: 100%;
	margin: 0 80px 0 500px;
}

.cnav ul li{
	height: 100%;
}

.cnav ul li a{
	font-size: 15px;
}
.cnav ul li a:link{ color: #fff }
.cnav ul li a:visited{ color: #fff }
.cnav ul li a:hover{ color: #eee;}
.cnav ul li a:active{ color: #eee;}

.cnav ul li.cnavON{
	position: relative;
}
.cnav ul li.cnavON a{
	color: #f2e50e;
}

.cnav ul li.cnavON:after{
	content: '';
	display: block;
	width: 100%;
	height: 3px;
	background: #f2e50e;
	position: absolute;
	bottom: 0px;
	left: 0;
}

.cnav dd a{
	display: block;
}


.cnav dd i.icon_music{
	display: block;
	width: 32px;
	height: 32px;
	background: url(../images/icon_music.png) no-repeat;
	background-size: 100% 100%;
}


.cnav dd .a_music i.icon_music.musicRotate{
	animation:musicRotate 2s linear infinite;
	-webkit-animation:musicRotate 2s linear infinite;	
}

@keyframes musicRotate
{
	from {
		transform:rotate(0deg);
		-ms-transform:rotate(0deg); 	/* IE 9 */
		-moz-transform:rotate(0deg); 	/* Firefox */
		-webkit-transform:rotate(0deg); /* Safari 和 Chrome */
		-o-transform:rotate(0deg);
	}
	to {
		transform:rotate(360deg);
		-ms-transform:rotate(360deg); 	/* IE 9 */
		-moz-transform:rotate(360deg); 	/* Firefox */
		-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
		-o-transform:rotate(360deg);		
	}
}

@-webkit-keyframes musicRotate /*Safari and Chrome*/
{
	from {
		transform:rotate(0deg);
		-ms-transform:rotate(0deg); 	/* IE 9 */
		-moz-transform:rotate(0deg); 	/* Firefox */
		-webkit-transform:rotate(0deg); /* Safari 和 Chrome */
		-o-transform:rotate(0deg);
	}
	to {
		transform:rotate(360deg);
		-ms-transform:rotate(360deg); 	/* IE 9 */
		-moz-transform:rotate(360deg); 	/* Firefox */
		-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
		-o-transform:rotate(360deg);		
	}
}


.aNav{
	display: block;
	width: 60px;
	height: 60px;
	padding: 22px 0 0 0;
	position: absolute;
	right: 0;
	top: 0;
}


.aNav .icon_bar{
	display: block;
	width: 25px;
	height: 2px;
	background: #fff;
/*	margin: 0 auto;
	margin-top: 7px;*/
	position: absolute;
	left:30%;
	top: 7px;

	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;

}

.aNav .icon_bar:nth-of-type(1){
	top: 20px;
}

.aNav .icon_bar:nth-of-type(2){
	top: 28px;
}

.aNav .icon_bar:nth-of-type(3){
	top: 28px;
}

.aNav .icon_bar:nth-of-type(4){
	top: 36px;
}


.aNav.aNavOn{}


.aNav.aNavOn .icon_bar:nth-of-type(1){
	top: 17px;
	width: 0;
}

.aNav.aNavOn .icon_bar:nth-of-type(2){
	top: 26px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.aNav.aNavOn .icon_bar:nth-of-type(3){
	top: 26px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.aNav.aNavOn .icon_bar:nth-of-type(4){
	top: 35px;
	width: 0;
}


.layerNav{
	position: fixed;
	left: 0;
	top: 60px;
	width: 100%;
	height: 100%;
	background: #d8d8d8;
	padding: 0 64px;
	display: none;
}

.layerNav a{
	display: block;
	padding: 30px 0 30px;
	text-align: center;
	font-size: 18px;
	border-bottom: 1px solid #adadad;
}


.layerNav a i{
	margin: 0 auto;
}





/**/

.footer{
	width: 100%;
	height: 225px;
	margin-top: 50px;
}


.footer dd{
	position: relative;
}



.footer dd a{
	position: absolute;
	left: 9px;
	top: 18px;
	width: 419px;
	height: 57px;
}




@media (max-width: 767px) {

	body{
		width: 100%;
		height: auto;
		overflow-x: hidden;
	}

	img{
		display: block;
		width: 100%;
	}


	.navWrp{
		height: .95rem;
		padding: 0 .4rem;
	}

	.cnav dd{
		width: 2.4rem;
		margin-left: .8rem;
	}

	.cnav dd a{
		margin-right: .3rem;
	}

	.cnav dd span{
		width: 1.35rem;
		height: .75rem;
		background-size: 100% 100%;
	}

	
	.logo{
		width: .95rem;
	}
	
	.cnav dd i.icon_music{
		width: .54rem;
		height: .49rem;
		background-size: 100% 100%;
	}


	.footer {
	    width: 100%;
	    height: 1.1rem;
	    line-height: 1.1rem;
	    background: transparent;
	    text-align: center;
	    font-size: .26rem;
	    color: #476472;
	    margin: 0;
	    position: relative;
	    z-index: 10;
	}

	.footer h4{
		line-height: 1rem;
	}


}