header.head{
	margin-left: -3.6rem;
}
.footer{
	position: relative;
	overflow: hidden;
	height: 2.12rem;
}
.footer .copyright{
	padding-top: .1rem;
}
.inner img:nth-child(1){
	width: 2.06rem;
}
.inner img:nth-child(2){
	width: 1.2rem;
}
.kv_nav{
	display: none;
	width: 100%;
	height: 1.15rem;
	background: url(../images/nav.png) 0/100% 100% no-repeat;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 10;
}
.btn_nav{
	display: block;
	width: 1.92rem;
	height: .64rem;
	position: absolute;
	top: 50%;
	left: 2.4rem;
	margin-top: -.32rem;
}
.btn_store{
	display: block;
	width: 2.52rem;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
}
.kv_naver{
	display: block;
	width: 1.52rem;
	height: 1.76rem;
	background: url(../images/naver.png) 0/100% 100% no-repeat;
	position: fixed;
	bottom: .4rem;
	right: .2rem;
	z-index: 20;
	transition: all 1s;
	-webkit-transition: all 1s;
}
.kv_naver.active{
	bottom: 3.1rem;
}
.hide_naver{
	display: block;
	width: .5rem;
	height: .3rem;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}
.btn_track{
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.btn_festival{
	display: block;
	width: 2.66rem;
	height: 3.1rem;
	background: url(../../images/btn_festival.png) 0/100% 100% no-repeat;
	position: fixed;
    bottom: 1.5rem;
    right: -.36rem;
    z-index: 9;
	animation: moonbig 2s ease infinite;
	-webkit-animation: moonbig 2s ease infinite;
	transition: all 1s;
	-webkit-transition: all 1s;
}
.btn_festival.active{
	bottom: 4.2rem;
}
.wrapper {
	display: block;
	width: 100%;
	background-color: #000;
	/*padding-bottom: 1.15rem;*/
}

.flower {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	pointer-events: none;
}
.section{
	display: block;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.s1{
	height: 14rem;
	background: url(../images/bg1.jpg) top no-repeat;
	background-size: 100% 21.6rem;
}
.s2{
	height: 19.3rem;
	background: url(../images/s1_pic4.png) top no-repeat;
	background-size: 100% 10.25rem;
	background-position: 0 -4.56rem;
	z-index: 2;
}
.s3{
	height: 30rem;
	background: url(../images/bg3.jpg) 0/100% 30rem no-repeat;
}
.s4{
	height: 17.1rem;
	background: url(../images/bg4.jpg) 0/100% 17.1rem no-repeat;
}
.s5{
	height: 14.1rem;
	/*background: url(../images/s5_bg1.jpg) 0/100% 14.1rem no-repeat;*/
}
.s6{
	height: 13.3rem;
	background: url(../images/bg6.jpg) 0/100% 13.3rem no-repeat;
}

/*s1*/
.s1_slogan{
	display: block;
	width: 6.54rem;
	height: 2.42rem;
	background: url(../images/s1_slogan.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 2.5rem;
	left: 50%;
	margin-left: -3.27rem;
	opacity: 0;
}
#introVideo{
	width: 7.2rem;
	height: 13.5rem;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99999999;
	pointer-events: none;
}
.btn_change{
	display: block;
	width: 4.26rem;
	height: .9rem;
	background: url(../images/btn_change.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 3.84rem;
	left: 50%;
	margin-left: -2.13rem;
	opacity: 0;
}
.btn_change1{
	display: block;
	width: 4.26rem;
	height: .9rem;
	background: url(../images/btn_change1.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 4.2rem;
	left: 50%;
	margin-left: -2.13rem;
	opacity: 0;
	z-index: 3;
}
.download{
	display: block;
	width: 7.5rem;
	text-align: center;
	position: absolute;
	top: 8rem;
	left: 50%;
	margin-left: -3.75rem;
	z-index: 4;
}
.download a{
	display: inline-block;
	width: 3rem;
	height: .88rem;
	margin: 0 .1rem;
}
.download a:nth-child(1){
	margin: 0 2rem .2rem;
	background: url(../../images/btn_onesto.png) 0/100% 100% no-repeat;
}
.download a:nth-child(2){
	background: url(../../images/btn_store.png) 0/100% 100% no-repeat;
}
.download a:nth-child(3){
	background: url(../../images/btn_google.png) 0/100% 100% no-repeat;
}
/*.download a:nth-child(4){
	background: url(../../images/btn_mic.png) 0/100% 100% no-repeat;
	margin-top: .2rem;
}*/
.cookie{
	display: block;
	width: 100%;
	height: 3rem;
	background-color: #fff;
	z-index: 9999;
	position: fixed;
	bottom: -3.1rem;
	left: 0;
	transition: all 1s;
	-webkit-transition: all 1s;
}
.cookie.active{
	bottom: 0;
}
.cookie_close{
	display: block;
	width: .2rem;
	height: .2rem;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMzQ4LjMzM3B4IiBoZWlnaHQ9IjM0OC4zMzNweCIgdmlld0JveD0iMCAwIDM0OC4zMzMgMzQ4LjMzNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzQ4LjMzMyAzNDguMzM0OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGc+PHBhdGggZmlsbD0iIzU2NTY1NiIgZD0iTTMzNi41NTksNjguNjExTDIzMS4wMTYsMTc0LjE2NWwxMDUuNTQzLDEwNS41NDljMTUuNjk5LDE1LjcwNSwxNS42OTksNDEuMTQ1LDAsNTYuODVjLTcuODQ0LDcuODQ0LTE4LjEyOCwxMS43NjktMjguNDA3LDExLjc2OWMtMTAuMjk2LDAtMjAuNTgxLTMuOTE5LTI4LjQxOS0xMS43NjlMMTc0LjE2NywyMzEuMDAzTDY4LjYwOSwzMzYuNTYzYy03Ljg0Myw3Ljg0NC0xOC4xMjgsMTEuNzY5LTI4LjQxNiwxMS43NjljLTEwLjI4NSwwLTIwLjU2My0zLjkxOS0yOC40MTMtMTEuNzY5Yy0xNS42OTktMTUuNjk4LTE1LjY5OS00MS4xMzksMC01Ni44NWwxMDUuNTQtMTA1LjU0OUwxMS43NzQsNjguNjExYy0xNS42OTktMTUuNjk5LTE1LjY5OS00MS4xNDUsMC01Ni44NDRjMTUuNjk2LTE1LjY4Nyw0MS4xMjctMTUuNjg3LDU2LjgyOSwwbDEwNS41NjMsMTA1LjU1NEwyNzkuNzIxLDExLjc2N2MxNS43MDUtMTUuNjg3LDQxLjEzOS0xNS42ODcsNTYuODMyLDBDMzUyLjI1OCwyNy40NjYsMzUyLjI1OCw1Mi45MTIsMzM2LjU1OSw2OC42MTF6Ii8+PC9nPjwvc3ZnPg==);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	position: absolute;
	top: .2rem;
	right: .2rem;
}
.cookie_text{
	display: block;
	width: 6rem;
	height: 2.8rem;
	position: absolute;
	top: .2rem;
	left: .6rem;
}
.cookie_text p{
	display: block;
	width: 100%;
	color: #696969;
	font-size: .24rem;
	line-height: .32rem;
	font-weight: bold;
}
.cookie_text span{
	display: block;
	width: 100%;
	color: #696969;
	font-size: .18rem;
	line-height: .21rem;
	margin-top: .04rem;
}
.btn_cookie{
	display: block;
	width: 2rem;
	height: .5rem;
	line-height: .5rem;
	font-size: .22rem;
	background-color: #1f273a;
    border-color: #1f273a;
    color: #fff;
    text-align: center;
    position: absolute;
    bottom: .2rem;
    left: 50%;
    margin-left: -1rem;
}

.s1_pic1{
	display: block;
	width: 1.38rem;
	height: 2.72rem;
	position: absolute;
	top: 10rem;
	left: -.08rem;
	z-index: 3;
}
.s1_pic2{
	display: block;
	width: .98rem;
	height: 2.30rem;
	position: absolute;
	top: 9.2rem;
	right: 0;
	z-index: 3;
}
.s1_pic3{
	display: block;
	width: 6.4rem;
	height: 6.02rem;
	position: absolute;
	top: 5.2rem;
	left: 0;
}
.s1_pic4{
	display: block;
	width: 100%;
	height: 10.26rem;
	position: absolute;
	left: 0;
	top: 9.34rem;
	z-index: 2;
	pointer-events: none;
}
.s1_pic5{
	display: block;
	width: 2.74rem;
	height: 3.24rem;
	position: absolute;
	bottom: -.4rem;
	right: -.1rem;
	z-index: 3;
}
.s1_title{
	display: block;
	width: 5.78rem;
	height: 1.2rem;
	background: url(../images/s1_title.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 13.2rem;
	left: 50%;
	margin-left: -2.89rem;
	z-index: 4;
}
.s1_scroll {
	display: block;
	width: 3rem;
	height: .6rem;
	position: absolute;
	top: 11.6rem;
	left: 50%;
	margin-left: -1.5rem;
	text-align: center;
	color: #fff;
	font-size: .24rem;
	z-index: 3;
}

.s1_scroll svg {
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -14px;
}
.s1_box{
	display: block;
	width: 7.2rem;
	height: 6.3rem;
	background: url(../images/s1_box.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 14.7rem;
	left: 50%;
	margin-left: -3.6rem;
	z-index: 4;
}
.s1_box:after {
	display: block;
	content: '';
	width: 2.76rem;
	height: .26rem;
	background: url(https://www.moonlightm.com/images/s2_logo.png) 0/100% 100% no-repeat;
	position: absolute;
	bottom: 1.08rem;
	right: .3rem;
}
.s1_iframe{
	display: block;
	width: 7.12rem;
	height: 4.08rem;
	margin: .68rem auto 0;
}
.s2_left{
	display: block;
	width: 3rem;
	height: .7rem;
	position: absolute;
	bottom: 0;
	left: .46rem;
}
.s2_right{
	display: block;
	width: 3rem;
	height: .7rem;
	position: absolute;
	bottom: 0;
	right: .46rem;
}
.introVideo{
	display: block;
	width: 7.2rem;
	height: 13.5rem;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999999;
}

/*s2*/
.s2_title{
	width: 6.28rem;
	height: 1.14rem;
	position: absolute;
	top: .3rem;
	left: 50%;
	margin-left: -3.14rem;
}
.s2_pic1{
	display: block;
	width: 6.28rem;
	height: 1.88rem;
	position: absolute;
	top: 1.78rem;
	left: 50%;
	margin-left: -3.14rem;
}
.s2_pic2{
	width: .98rem;
	height: 1.78rem;
	position: absolute;
	top: 3.2rem;
	right: -.08rem;
}
.s2_pic3{
	display: block;
	width: 100%;
	height: 15.16rem;
	background: url(../images/s2_pic3.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 2.3rem;
	left: 0;
}
.s2_pic4{
	width: 7.06rem;
	height: 5.4rem;
	position: absolute;
	top: 3.04rem;
	left: .16rem;
}
.s2_box{
	display: block;
	width: 7.18rem;
	height: 8.14rem;
	background: url(../images/s2_box.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 11.2rem;
	left: .01rem;
	z-index: 3;
	overflow: hidden;
}
.s2_btn{
	display: block;
	width: 5.5rem;
	height: .84rem;
	margin: 1.04rem auto 0;
}
.s2_btn a:nth-child(1){
	display: block;
	width: 2.5rem;
	height: 100%;
	float: left;
	text-indent: -9999999px;
}
.s2_btn a:nth-child(2){
	display: block;
	width: 2.8rem;
	height: 100%;
	float: right;
	text-indent: -9999999px;
}
.s2_select{
	width: 4.2rem;
	height: .38rem;
	margin: .8rem auto 0;
}
.s2_select li{
	display: block;
	height: .38rem;
	float: left;
	position: relative;
	margin: 0 .1rem;
}
.s2_select li i{
	display: block;
	width: .22rem;
	height: .22rem;
	background-color: #fff;
	float: left;
	box-sizing: border-box;
	border-radius: 50%;
	margin: .12rem .1rem .12rem 0;
}
.s2_select li.act i{
	background-color: #061739;
	border: .04rem solid #fff;
}
.s2_select li input{
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.s2_select li:nth-child(2) img{
	display: block;
	width: 1.96rem;
	height: .38rem;
	float: left;
}
.s2_select li:nth-child(1) img{
	display: block;
	width: 1.2rem;
	height: .38rem;
	float: left;
}
.s2_input{
	display: block;
	width: 4.6rem;
	height: .8rem;
	margin: .3rem auto 0;
	position: relative;
	left: .44rem;
}
.s2_input input{
	width: 3rem;
	line-height: .74rem;
	text-align: left;
	color: #000;
	font-size: .3rem;
	border: none;
	background: none;
	outline: none;
	font-weight: bold;
}
.s2_input input::-webkit-input-placeholder{
	color: #000;
	font-size: .22rem;
}
.s2_input a{
	display: block;
	width: 1.4rem;
	height: .8rem;
	position: absolute;
	right: 0;
	top: 0;
}
.check-box {
	width: 5.4rem;
	position: relative;
	margin: .3rem auto 0;
	font-size: .2rem;
	color: #fff;
	text-align: left;
}

.check-box .btn-label {
	display: block;
	width: 100%;
	height: .24rem;
	margin: .1rem 0;
	position: relative;
}

.check-box .btn-label .info {
	float: left;
	margin-right: .06rem;
	width: .28rem;
	height: .24rem;
	position: relative;
}

.check-box .btn-label .info::before {
	content: '';
	width: .28rem;
	height: .24rem;
	position: absolute;
	top: 0;
	left: 0;
	background: url('../images/s2_chk1.png') 0/100% 100% no-repeat;
}

.check-box .btn-label input[type='checkbox']:checked + .info::after, .check-box .btn-label .info.selected::after {
	content: '';
	width: .28rem;
	height: .24rem;
	position: absolute;
	top: 0;
	left: 0;
	background: url('../images/s2_chk2.png') 0/100% 100% no-repeat;
}

.check-box .check-text{
	display: inline-block;
	line-height: .24rem;
	font-size: .16rem;
	color: #fff;
}

.check-box .s2_information {
	position: absolute;
	left: 4.42rem;
	top: .38rem;
	width: .9rem;
	height: .24rem;
	background: url('../images/s2_chk3.png') 0/100% 100% no-repeat;
	text-indent: -999em;
}



/*s3*/
.s3canvas{
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	pointer-events: none;
}
.s3_title{
	display: block;
	width: 6.32rem;
	height: 1.1rem;
	position: absolute;
	top: 1.4rem;
	left: 50%;
	margin-left: -3.16rem;
}
.s3_tips{
	display: block;
	width: 5.72rem;
	height: 1.14rem;
	position: absolute;
	top: 2.9rem;
	left: 50%;
	margin-left: -2.86rem;
}
.s3_pic1{
	display: block;
	width: 4rem;
	height: 4.3rem;
	background: url('../images/s3_moon6.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 4.1rem;
	right: 0;
	opacity: 0;
}
.s3_pic1 img{
	display: block;
	width: 100%;
	height: 100%;
	animation: moonlightAni 3s ease infinite;
	-webkit-animation: moonlightAni 3s ease infinite;
}
.s3_task1{
	display: block;
	width: 3.44rem;
	height: 2.98rem;
	position: absolute;
	top: 10.4rem;
	left: .38rem;
}
.s3_task2{
	display: block;
	width: 3.44rem;
	height: 2.98rem;
	position: absolute;
	top: 10.4rem;
	left: 3.6rem;
}
.s3_task3{
	display: block;
	width: 3.44rem;
	height: 2.98rem;
	background: url('../images/s3_task3.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 13.24rem;
	left: .38rem;
}
.s3_task4{
	display: block;
	width: 3.44rem;
	height: 2.98rem;
	position: absolute;
	top: 13.24rem;
	left: 3.6rem;
}
.s3_task5{
	display: block;
	width: 7.2rem;
	height: 3.76rem;
	background: url('../images/s3_task5.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 16.2rem;
	left: 0;
}
.s3_task6{
	display: block;
	width: 7.2rem;
	height: 4.46rem;
	background: url('../images/s3_task6.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 19.9rem;
	left: 0;
}
.s3_task6 img{
	display: block;
	width: 7.2rem;
	height: 5.35rem;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -2.84rem;
	animation:light 4s infinite linear;
	-webkit-animation:light 4s infinite linear;
}
.s3_task6 p{
	display: block;
	width: 100%;
	line-height: .24rem;
	font-size: .2rem;
	color: #fff;
	position: absolute;
	bottom: -.2rem;
	left: 0;
	text-align: center;
}
.s3_pic2{
	display: block;
	width: 7.2rem;
	height: 9.7rem;
	position: absolute;
	left: 0;
	bottom: 4.9rem;
	animation:light 6s infinite linear;
	-webkit-animation:light 6s infinite linear;
}
.s3_pic3{
	display: block;
	width: 7.2rem;
	height: 11.12rem;
	position: absolute;
	left: 0;
	bottom: -2.4rem;
	pointer-events: none;
	animation:light 3s infinite linear;
	-webkit-animation:light 3s infinite linear;
}
.s3_pic4{
	display: block;
	width: 6.68rem;
	height: 4.76rem;
	position: absolute;
	left: 0;
	bottom: 0;
	pointer-events: none;
}




/*s4*/
.s4_title{
	width: 6.3rem;
	height: 1.1rem;
	position: absolute;
	top: 1.4rem;
	left: 50%;
	margin-left: -3.15rem;
}
.s4_box{
	display: block;
	width: 6.3rem;
	height: 12.4rem;
	margin: 3.2rem auto 0;
	position: relative;
}
.s4_box li{
	display: block;
	width: 100%;
	height: 1.66rem;
	position: absolute;
	top: 0;
	left: 0;
}
.s4_box li:nth-child(2){
	top: 3.24rem;
}
.s4_box li:nth-child(3){
	top: 6.96rem;
}
.s4_box li:nth-child(4){
	top: initial;
	bottom: 0;
}
.s4_box li .s4_play{
	display: block;
	width: .6rem;
	height: .7rem;
	background: url('../images/s4_play.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -.35rem;
	margin-left: -.3rem;
	opacity: 0;
}
.s4_tit1,.s4_tit3{
	display: block;
	width: 2.34rem;
	height: 1.66rem;
	position: absolute;
	top: 0;
	left: 0;
}
.s4_tit2,.s4_tit4{
	display: block;
	width: 2.34rem;
	height: 1.66rem;
	position: absolute;
	top: 0;
	right: 0;
}
.s4_tit2{
	top: -.4rem;
}
.s4_tit3{
	top: .5rem;
}


/*s5*/
.s5_swiper{
	display: block;
	width: 100%;
	height: 100%;
}
.slide1{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg1.jpg') 0/100% 100% no-repeat;
}
.slide2{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg2.jpg') 0/100% 100% no-repeat;
}
.slide3{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg3.jpg') 0/100% 100% no-repeat;
}
.slide4{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg4.jpg') 0/100% 100% no-repeat;
}
.slide5{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg5.jpg') 0/100% 100% no-repeat;
}
.slide6{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg6.jpg') 0/100% 100% no-repeat;
}
.slide7{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg7.jpg') 0/100% 100% no-repeat;
}
.slide8{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg8.jpg') 0/100% 100% no-repeat;
}
.slide9{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg9.jpg') 0/100% 100% no-repeat;
}
.slide10{
	width: 100%;
	height: 100%;
	background: url('../images/s5_bg10.jpg') 0/100% 100% no-repeat;
}
.s5 .swiper-slide img{
	display: none;
	width: 7.2rem;
	height: auto;
	position: absolute;
	top: .8rem;
	left: 0;
}
.s5 .swiper-slide.swiper-slide-active img{
	display: block;
}
.s5 .swiper-slide .s5_play{
	display: none;
	width: .92rem;
	height: .92rem;
	background: url('../images/s5_play1.png') 0/100% 100% no-repeat;
	position: absolute;
	bottom: .8rem;
	left: .8rem;
}
/*.s5 .swiper-slide.swiper-slide-active .s5_play{
	display: block;
}*/
.s5 .swiper-slide .s5_play:after{
	display: block;
	content: '';
	width: .92rem;
	height: .92rem;
	background: url('../images/s5_play2.png') 0/100% 100% no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	animation:s5rotate 5s infinite linear;
	-webkit-animation:s5rotate 5s infinite linear;
}
.section.s5:after{
	display: block;
	content: '';
	width: .62rem;
	height: .78rem;
	background: url('../images/s5_back.png') 0/100% 100% no-repeat;
	position: absolute;
	top: .6rem;
	right: .5rem;
	z-index: 10;
	pointer-events: none;
	/*animation: backrotate 1s infinite linear;
	-webkit-animation: backrotate 1s infinite linear;
	transform-origin: bottom center;
	-webkit-transform-origin: bottom center;*/
}


/*s6*/
.s6_tab {
	display: block;
	width: 4.24rem;
	height: .5rem;
	/*background: url(../images/s6_tab.png) 0/100% 100% no-repeat;*/
	position: absolute;
	top: .84rem;
	left: 47%;
	margin-left: -2.11rem;
	z-index: 1;
}

.s6_tab a {
	display: block;
	line-height: 0.3rem;
	font-size: 0.3rem;
	text-align: center;
	color: rgba(255, 255, 255, .5);
	float: left;
	font-weight: bold;
	position: relative;
}

.s6_tab a:hover {
	color: rgba(255, 255, 255, .8);
}

.s6_tab a.s6_tab1 {
	width: 2.38rem;
}
/*.s6_tab a.s6_tab1:before{
	width: .01rem;
	height: 100%;
	content: '';
	background-color: rgba(255, 255, 255, .5);
	position: absolute;
	top: 0;
	right: .32rem;
}*/
.s6_tab a.s6_tab2 {
	width: 1.84rem;
}

.s6_tab a.s6_tab3 {
	width: 2.68rem;
}

.s6_tab a.on {
	color: #78c8f0;
}

.s6_tab a.on:after {
	display: block;
	content: '';
	width: 1.18rem;
	height: 0.04rem;
	background: url(../images/s6_tab_on.png) 0/100% 100% no-repeat;
	position: absolute;
	bottom: -.2rem;
	left: 50%;
	margin-left: -.59rem;
}
.s6_show{
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.s6_show1{
	background: url(../images/s6_bg.jpg) 0/100% 100% no-repeat;
}
.s6_show.on{
	display: block;
}
.s6_box1{
	display: block;
	width: 7.2rem;
	height: 7.8rem;
	position: absolute;
	top: .94rem;
	left: 0;
}
#s7_music{
	display: block;
	width: 5.76rem;
    height: 5.76rem;
	background: url(https://www.moonlightm.com/images/s7_music1.png) 50% 50%/7.5rem 7.5rem no-repeat;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	top: 53%;
	left: 50%;
	transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	z-index: 2;
}
#musicPic{
	display: block;
	width: 7.5rem;
	height: 7.5rem;
	position: absolute;
	top: 53%;
	left: 50%;
	transform: translate(-50%,-50%) scale(1);
}
/*.s6_box1.on #musicPic{
	animation: s7music 2s infinite linear;
	-o-animation: s7music 2s infinite linear;
	-ms-animation: s7music 2s infinite linear;
	-moz-animation: s7music 2s infinite linear;
	-webkit-animation: s7music 2s infinite linear;
}*/
.s6_box1:after{
	display: block;
	content: '';
	width: 5.3rem;
	height: 5.3rem;
	background: url(../images/s6_play6.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 1.46rem;
	left: 50%;
	margin-left: -2.65rem;
	z-index: 2;
}
.s6_box1.on:after{
	animation: s5rotate 10s infinite linear;
	-webkit-animation: s5rotate 10s infinite linear;
}
.s6_play_prev{
	display: block;
	width: .81rem;
	height: .82rem;
	background: url(../images/s6_play_prev.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 5.8rem;
	left: 1.16rem;
	text-indent: -99999px;
	z-index: 3;
}
.s6_play_next{
	display: block;
	width: .81rem;
	height: .82rem;
	background: url(../images/s6_play_next.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 5.8rem;
	right: 1.16rem;
	text-indent: -99999px;
	z-index: 3;
}
.s6_play {
	display: block;
	width: 1.02rem;
	height: 1.02rem;
	background: url(../images/s6_play.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 6.44rem;
	left: 50%;
	margin-left: -.51rem;
	z-index: 3;
}

.s6_play.on {
	display: none;
}

.s6_pause {
	display: none;
	width: 1.02rem;
	height: 1.02rem;
	background: url(../images/s6_play.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 6.44rem;
	left: 50%;
	margin-left: -.51rem;
	z-index: 3;
}

.s6_pause.on {
	display: block;
}

.s6_play:after, .s6_pause:after {
	display: block;
	content: '';
	width: .84rem;
	height: .84rem;
	background: url(../images/s6_play5.png) 0/100% 100% no-repeat;
	position: absolute;
	top: .09rem;
	left: .09rem;
}

.s6_pause.on:after {
	animation: s5rotate 10s infinite linear;
	-webkit-animation: s5rotate 10s infinite linear;
}

.s6_play img, .s6_pause img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

.s6_play i, .s6_pause i {
	width: 1.02rem;
	height: 1.02rem;
	background: url(../images/s6_play2.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}

.s6_pause.on i {
	animation: light 4s infinite linear;
	-webkit-animation: light 4s infinite linear;
}
.music_box{
	display: block;
	width: 6.04rem;
	height: 3.2rem;
	background: url(../images/s6_list.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 8rem;
	left: 50%;
	margin-left: -3.02rem;
	box-sizing: border-box;
}
.s6_list{
	display: block;
	width: 5.04rem;
	height: 2.3rem;
	overflow: hidden;
	overflow-y: auto;
	margin: .5rem;
}
.s6_list li{
	display: block;
	width: 76%;
	height: .46rem;
	line-height: .46rem;
	font-size: .24rem;
	color: rgba(255, 255, 255, .6);
	float: left;
	position: relative;
	left: 13%;
}
.s6_list li a{
	display: block;
	width: 100%;
	height: 100%;
}
.s6_list li span{
	display: none;
	width: .26rem;
	height: .24rem;
	/*background: url(../images/s6_play7.png) 0/100% 100% no-repeat;*/
	position: absolute;
	top: .11rem;
	left: 0;
	display: none;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.s6_list li.on span{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.s6_list li span i{
	display: block;
	width: calc(2 / 1920 * 100vw);
	height: calc(24 / 1920 * 100vw);
	float: left;
	margin-right: calc(3 / 1920 * 100vw);
	background-color: rgba(255, 255, 255, .6);
}
.s6_list li.on span i{
	background-color: #69aeff;
	-webkit-animation-play-state: running;
    animation-play-state: running;
    -webkit-animation: sound .8s linear infinite alternate;
    animation: sound .8s linear infinite alternate;
    -webkit-transition: height 0.8s;
    transition: height 0.8s;
}
.s6_list li span i:nth-child(1){
	height: .08rem;
	-webkit-animation-duration: .5s;
    animation-duration: .5s;
}
.s6_list li span i:nth-child(2){
	height: .16rem;
	-webkit-animation-duration: .2s;
    animation-duration: .2s;
}
.s6_list li span i:nth-child(3){
	height: .24rem;
	-webkit-animation-duration: .3s;
    animation-duration: .3s;
}
.s6_list li span i:nth-child(4){
	height: .16rem;
	-webkit-animation-duration: .2s;
    animation-duration: .2s;
}
.s6_list li span i:nth-child(5){
	height: .08rem;
	-webkit-animation-duration: .5s;
    animation-duration: .5s;
}
.s6_list li p{
	display: block;
	width: 4.5rem;
	line-height: .46rem;
	float: left;
	color: rgba(255, 255, 255, .6);
	margin-left: .4rem;
}
.s6_list li.on p{
	color: #69aeff;
}


.s6_box2{
	display: block;
	width: 6.58rem;
	height: 9.46rem;
	position: absolute;
	top: 2rem;
	left: 50%;
	margin-left: -3.29rem;
	overflow: hidden;
	overflow-y: auto;
}
.s6_box2 li{
	overflow: hidden;
}
.s6_box2 li:after{
	display: block;
	content: '';
	width: .86rem;
	height: .42rem;
	background: url(../images/logo.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 0;
	left: .08rem;
	filter: drop-shadow(0 0 .04rem rgba(0, 0, 0, .4));
}
.s6_pic1{
	display: block;
	width: 3.82rem;
	height: 2.24rem;
	position: absolute;
	top: 0;
	left: 0;
}
.s6_pic2{
	display: block;
	width: 2.76rem;
	height: 3.86rem;
	position: absolute;
	top: 0;
	right: 0;
}
.s6_pic3{
	display: block;
	width: 4.2rem;
	height: 2.52rem;
	position: absolute;
	top: 7.36rem;
	left: 0;
}
.s6_pic4{
	display: block;
	width: 2.38rem;
	height: 2.9rem;
	position: absolute;
	top: 7.36rem;
	left: 4.2rem;
}
.s6_pic5{
	display: block;
	width: 3.78rem;
	height: 1.62rem;
	position: absolute;
	top: 2.24rem;
	left: 0;
}
.s6_pic6{
	display: block;
	width: 4.5rem;
	height: 1.62rem;
	position: absolute;
	top: 3.86rem;
	left: 0;
}
.s6_pic7{
	display: block;
	width: 2.08rem;
	height: 1.62rem;
	position: absolute;
	top: 3.86rem;
	left: 4.5rem;
}
.s6_pic8{
	display: block;
	width: 4.2rem;
	height: 1.88rem;
	position: absolute;
	top: 9.88rem;
	left: 0;
}
.s6_pic9{
	display: block;
	width: 2.38rem;
	height: 1.48rem;
	position: absolute;
	top: 10.26rem;
	left: 4.2rem;
}
.s6_pic10{
	display: block;
	width: 2.1rem;
	height: 1.1rem;
	position: absolute;
	top: 11.78rem;
	left: 0;
}
.s6_pic11{
	display: block;
	width: 1.3rem;
	height: 1.1rem;
	position: absolute;
	top: 11.78rem;
	left: 2.1rem;
}
.s6_pic12{
	display: block;
	width: 2.2rem;
	height: 1.88rem;
	position: absolute;
	top: 5.48rem;
	left: 0;
}
.s6_pic13{
	display: block;
	width: 4.38rem;
	height: 1.88rem;
	position: absolute;
	top: 5.48rem;
	left: 2.2rem;
}
.s6_pic14{
	display: block;
	width: 1.7rem;
	height: 1.1rem;
	position: absolute;
	top: 12.88rem;
	left: 0;
}
.s6_pic15{
	display: block;
	width: 1.7rem;
	height: 1.1rem;
	position: absolute;
	top: 12.88rem;
	left: 1.7rem;
}
.s6_pic16{
	display: block;
	width: 3.2rem;
	height: 2.2rem;
	position: absolute;
	top: 11.78rem;
	left: 3.38rem;
}
.s6_box2 li img {
	display: block;
	width: 100%;
	height: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
}


.s6_box3{
	display: block;
	width: 6.6rem;
	height: 9.5rem;
	overflow: hidden;
	overflow-y: auto;
	position: absolute;
	top: 2rem;
	left: 50%;
	margin-left: -3.3rem;
	text-align: left;
}
.s6_box3 li{
	display: inline-block;
	width: 2.9rem;
	height: 1.64rem;
	margin: .11rem;
	position: relative;
	border: .01rem solid rgba(255, 255, 255, .4);
}
.s6_box3 li:nth-child(1){
	width: 6.1rem;
	height: 3.44rem;
	margin: 0 .11rem .11rem;
}
.s6_box3 li a{
	display: block;
	width: .4rem;
	height: .48rem;
	background: url(../images/s6_video.png) 0/100% 100% no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	z-index: 1;
}
.s6_box3 li:nth-child(1) a{
	width: .84rem;
	height: 1.02rem;
}
.s6_box3 li img{
	display: block;
	width: 2.78rem;
	height: 1.52rem;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -.76rem;
	margin-left: -1.39rem;
}
.s6_box3 li:nth-child(1) img{
	width: 5.86rem;
	height: 3.2rem;
	margin-top: -1.6rem;
	margin-left: -2.93rem;
}








/*弹窗*/
.dialog-box {
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	background: rgba(0, 0, 0, .8);
	opacity: 0;
}

.dialog-box.on {
	z-index: 9999;
	opacity: 1;
}

.pop_close {
	display: block;
	width: .4rem;
	height: .4rem;
	position: absolute;
	top: .4rem;
	right: .4rem;
	z-index: 99999;
}

.dialog-box .dialog {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	display: none;
	outline: none;
	background-repeat: no-repeat;
	background-position: top center;
	padding-top: 1px;
}

.dialog-box .dialog.on {
	display: block;
	animation: fadeInDown;
	-webkit-animation: fadeInDown;
}

.dialog-box .dialog.out {
	animation: fadeOutUp;
	-webkit-animation: fadeOutUp;
}

/*规则弹窗*/
.dialog-box .dialog1 {
	width: 6.2rem;
	height: 7.02rem;
	background: url(../images/pop1.png) 0/100% 100% no-repeat;
	text-align: center;
}
.dialog1 .pop_close{
	top: 0;
	right: 0;
}

/*视频弹窗*/
.dialog2 {
	width: 7.2rem;
	height: 4.04rem;
	background: #000;
}

.pop-player {
	display: block;
	width: 7.2rem;
	height: 4.04rem;
	position: absolute;
	top: 0;
	left: 0;
}

.pop-loading {
	display: block;
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -.16rem;
	font-size: .32rem;
	line-height: .32rem;
	text-align: center;
	color: #fff;
}

.dialog2 .pop_close {
	background: url(../images/pop_close.png) 0/100% 100% no-repeat;
	top: -.46rem;
	right: 0;
}

.pop-loading.loaded {
	display: none
}

/*大图弹窗*/
.dialog3 {
	width: 100%;
	height: 6rem;
}

.pop_pic {
	display: block;
	max-height: 100%;
	width: 7.2rem;
	height: 6rem;
	position: relative;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}

.pop_pic .pop_close {
	background: url(../images/pop_close.png) 0/100% 100% no-repeat;
	top: -.2rem;
	right: .2rem;
}

.pop_pic img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
}


/*提示弹窗*/
.dialog4 {
	width: 5.2rem;
	height: 3.74rem;
}
.pop_tips{
	display: block;
	width: 100%;
	height: 100%;
}
.pop_tips img{
	display: block;
	width: 100%;
}
.blind{
	width: 0px;
    height: 0px;
    position: absolute;
    overflow: hidden;
    font-size: 0px;
    line-height: 0px;
    z-index: -1;
    visibility: hidden;
}
.dialog4 .pop_close,
.dialog8 .pop_close{
	top: 0;
	right: 0;
}
.dialog-box .dialog8 {
	width: 5.2rem;
	height: 3.74rem;
	background: url(https://www.moonlightm.com/images/popup_r5.png) 0/100% 100% no-repeat;
	text-align: center;
}


/* scroll */
.scrollbar::-webkit-scrollbar{width:4px;height:0;border-radius:4px;}
.scrollbar::-webkit-scrollbar-thumb{box-shadow:none;-webkit-box-shadow:none;border-radius:4px;border:4px solid rgba(255,255,255,.6);}
.scrollbar::-webkit-scrollbar-track{-webkit-box-shadow:none;background-color:rgba(0,0,0,0);border-radius:4px;}
.no_scrollbar::-webkit-scrollbar{width:4px;height:0;border-radius:4px;background-color: rgba(0, 0, 0, 0);}
.no_scrollbar::-webkit-scrollbar-thumb{box-shadow:none;-webkit-box-shadow:none;border-radius:4px;border:4px solid rgba(0, 0, 0, 0);}
.no_scrollbar::-webkit-scrollbar-track{-webkit-box-shadow:none;background-color:rgba(0,0,0,0);border-radius:4px;}



/*动效*/
@keyframes light{
	0%{opacity:.4;}
	50%{opacity:1;}
	100%{opacity:.4;}
}
@-webkit-keyframes light{
	0%{opacity:.4;}
	50%{opacity:1;}
	100%{opacity:.4;}
}
@keyframes s5rotate{
	0%{transform:rotate(0);}
	100%{transform:rotate(360deg);}
}
@-webkit-keyframes s5rotate{
	0%{transform:rotate(0);}
	100%{transform:rotate(360deg);}
}
@keyframes backrotate{
	0%{transform:rotate(0);}
	50%{transform:rotate(6deg);}
	100%{transform:rotate(0);}
}
@-webkit-keyframes backrotate{
	0%{transform:rotate(0);}
	50%{transform:rotate(6deg);}
	100%{transform:rotate(0);}
}

@keyframes sound {
	0% {
		height: .08rem;
	}

	100% {
		height: .24rem;
	}

}

@-webkit-keyframes sound {
	0% {
		height: .08rem;
	}

	100% {
		height: .24rem;
	}

}

@keyframes s7music{
	0%{transform:translate(-50%,-50%) scale(1);}
	50%{transform:translate(-50%,-50%) scale(.8);}
	100%{transform:translate(-50%,-50%) scale(1);}
}
@-o-keyframes s7music{
	0%{transform:translate(-50%,-50%) scale(1);}
	50%{transform:translate(-50%,-50%) scale(.8);}
	100%{transform:translate(-50%,-50%) scale(1);}
}
@-ms-keyframes s7music{
	0%{transform:translate(-50%,-50%) scale(1);}
	50%{transform:translate(-50%,-50%) scale(.8);}
	100%{transform:translate(-50%,-50%) scale(1);}
}
@-moz-keyframes s7music{
	0%{transform:translate(-50%,-50%) scale(1);}
	50%{transform:translate(-50%,-50%) scale(.8);}
	100%{transform:translate(-50%,-50%) scale(1);}
}
@-webkit-keyframes s7music{
	0%{transform:translate(-50%,-50%) scale(1);}
	50%{transform:translate(-50%,-50%) scale(.8);}
	100%{transform:translate(-50%,-50%) scale(1);}
}
@keyframes moonlightAni {
  0% {opacity: 0;}
  50% {opacity: 1;}
  100% {opacity: 0;}
}
@-webkit-keyframes moonlightAni {
  0% {opacity: 0;}
  50% {opacity: 1;}
  100% {opacity: 0;}
}

@keyframes moonbig {
	0% {
		transform: scale(.8);
	}

	50% {
		transform: scale(1);
	}

	100% {
		transform: scale(.8);
	}

}

@-webkit-keyframes moonbig {
	0% {
		transform: scale(.8);
	}

	50% {
		transform: scale(1);
	}

	100% {
		transform: scale(.8);
	}

}

.floatingBox1{
	width: 1.89rem;
	height: 1.7rem;
	position: absolute;
	top: 6.2rem;
	right: -.1rem;
	z-index: 9;
}
.floatingBox1 a{
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/icon1.png) top center no-repeat;
	background-size: 100%;
	animation: shank 3s infinite linear;
	-webkit-animation: shank 3s infinite linear;
}
.banner_min{
	display: block;
	width: 1.02rem;
	height: 1.68rem;
	background: url(../images/banner_box.jpg) 0/100% 100% no-repeat;
	position:fixed;
	top: 6.6rem;
	left: .44rem;
	z-index:99;
	animation: shankBanner 3s infinite linear;
	-webkit-animation: shankBanner 3s infinite linear;
}
.banner_box{
	visibility:hidden;
	width:7.2rem;
	height: 11.88rem;
	position:fixed;
	top:50%;
	left:50%;
	margin-top:-5.94rem;
	margin-left:-3.6rem;
	z-index:9999999999;
	opacity:0;
	transition:all .5s;
	-o-transition:all .5s;
	-ms-transition:all .5s;
	-moz-transition:all .5s;
	-webkit-transition:all .5s;
}
.banner_box.on{
	visibility:visible;
	opacity:1;
}
.banner{
	display:block;
	width:7.2rem;
	height: 11.88rem;
	background: url(../images/banner_box.jpg) 0/100% 100% no-repeat;
	position:absolute;
	top:0;
	left:0;
}
.banner_close{
	display:block;
	width:.38rem;
	height: .38rem;
	background: url(../images/pop_close.png) 0/100% 100% no-repeat;
	position:absolute;
	top:.2rem;
	right:.2rem;
	z-index:1;
}


@keyframes shank {
	0% {
		background:url(../images/icon1.png) 0/100% 100% no-repeat;
	}
	50% {
		background:url(../images/icon2.png) 0/100% 100% no-repeat;
	}
	100% {
		background:url(../images/icon1.png) 0/100% 100% no-repeat;
	}

}

@-webkit-keyframes shank {
	0% {
		background:url(../images/icon1.png) 0/100% 100% no-repeat;
	}
	50% {
		background:url(../images/icon2.png) 0/100% 100% no-repeat;
	}
	100% {
		background:url(../images/icon1.png) 0/100% 100% no-repeat;
	}

}

@keyframes shankBanner {
	0% {
		filter: drop-shadow(0 0 .06rem #fff);
		-webkit-filter: drop-shadow(0 0 .06rem #fff);
	}
	50% {
		filter: drop-shadow(0 0 0 #fff);
		-webkit-filter: drop-shadow(0 0 0 #fff);
	}
	100% {
		filter: drop-shadow(0 0 .06rem #fff);
		-webkit-filter: drop-shadow(0 0 .06rem #fff);
	}

}

@-webkit-keyframes shankBanner {
	0% {
		filter: drop-shadow(0 0 .06rem #fff);
		-webkit-filter: drop-shadow(0 0 .06rem #fff);
	}
	50% {
		filter: drop-shadow(0 0 0 #fff);
		-webkit-filter: drop-shadow(0 0 0 #fff);
	}
	100% {
		filter: drop-shadow(0 0 .06rem #fff);
		-webkit-filter: drop-shadow(0 0 .06rem #fff);
	}

}