/* load */
.loader{position: fixed; font-size:18px;width: 100%; height: 100%; background: #1e1e1e; left: 0; top: 0; right: 0; left: 0; z-index: 9999;}
.unloaded .loader{display: block;}
.loader-cont{width: 370px; height: 80px; position: absolute; top: 50%; left: 50%; margin: -40px 0 0 -225px;}
.loader-cont p{line-height: 35px; height: 35px; text-align: center; color: #afafaf;}
.schedule .loading2{position: absolute; left: -27px; top: 2px;}
.schedule .ending{height: 4px; width: 100%; border-radius:2px; background: #464646; position: relative; z-index: 3;}
.schedule .ending span{float: left;display: inline;position: relative;width: 20%;background: #6d312a;height: 100%;border-radius:2px;overflow: inherit !important;}
.schedule .ending span i{position: absolute; right: -11px; top: -9px; -webkit-animation:xz 3s linear infinite;animation:xz 3s linear infinite;}

/*flower*/
/*.flowers1{
	position: absolute;
	top: 0;
	z-index: 9;
}
.flowers1 i{
	width: 98px;
	height: 99px;
	top: 100px;
	display: block;
}
.flowers1 i:nth-child(1){
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/flower.png);
	background-size:98px auto;
	top: 350px;
}
.flowers1 i:nth-child(2){
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/flower.png);
	background-size:98px auto;
	background-position: 0 -99px;
}
.flowers1 i:nth-child(3){
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/flower.png);
	background-size:98px auto;
	background-position: 0 -198px;
}
.flowers1 i:nth-child(4){
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/flower.png);
	background-size:98px auto;
	background-position: 0 -198px;
}
.flowers1 i:nth-child(5){
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/flower.png);
	background-size:98px auto;
	background-position: 0 -297px;
}
*/
/* flower */
.flower-wrap{position: relative;z-index: 3;}
.flower-wrap li i{display: block;width: 98px;height: 99px;background-image: url(../png/flower.png);background-repeat: no-repeat;}
.flower1,.flower2{position: absolute;top: 0;}
.flower1{left: 12%;margin-top: 7%;}
.flower2{right: 13%;margin-top: 5%;}
.flower li{position: absolute;}
.flower li:first-child{top:0;left: 0;}
.flower li:nth-child(2){top:-40px;left:-40px;}
.flower li:nth-child(3){top: -60px;left: 60px;}
.flower li:nth-child(4){top:20px;left: -188px;}
.flower li:nth-child(5){top:-100px;left: 80px;}
.flower li:nth-child(6){top:-120px;left: 0px;}
.flower li:nth-child(7){top: -80px;left: -130px;}
.flower li:last-child{}
.flower li:first-child i{background-position: 0 0;}
.flower li:nth-child(2) i{background-position: 0 -99px;}
.flower li:nth-child(3) i{background-position: 0 -198px;}
.flower li:nth-child(4) i{background-position: 0 -297px;}
.flower li:nth-child(5) i{background-position: 0 -297px;}
.flower li:nth-child(6) i{background-position: 0 -99px;}
.flower li:nth-child(7) i{background-position: 0 -198px;}
.flower li:last-child i{background-position: 0 0px;}
@keyframes rotate1{
  from{transform:rotate(-2deg);transform-origin: top center;}
  to{transform:rotate(2deg);transform-origin: top center;}
}
@-webkit-keyframes rotate1{
  from{-webkit-transform:rotate(-2deg);-webkit-transform-origin: top center;}
  to{-webkit-transform:rotate(2deg);-webkit-transform-origin: top center;}
}
@-webkit-keyframes drop01{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(-180px, 520px, 0);opacity: 0;}
}
@keyframes drop01{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(-180px, 520px, 0);opacity: 0;}
}
@-webkit-keyframes drop02{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(180px, 520px, 0);opacity: 0;}
}
@keyframes drop02{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(180px, 520px, 0);opacity: 0;}
}
@-webkit-keyframes flower{
	0%{-webkit-transform: rotate(70deg);}
	100%{-webkit-transform: rotate(-70deg);}
}
@keyframes flower{
	0%{transform: rotate(70deg);}
	100%{transform: rotate(-70deg);}
}
.flower li{
	opacity: 0;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count:infinite;
}
.flower1 li{
	animation-name: drop01;
	-webkit-animation-name:drop01;
}
.flower2 li{
	animation-name: drop02;
	-webkit-animation-name:drop02;
}
.flower1 li:first-child,.flower2 li:nth-child(2){
	animation-duration: 9s;
	-webkit-animation-duration:9s;
}
.flower1 li:nth-child(2),.flower2 li:nth-child(5){
	animation-duration: 9.8s;
	-webkit-animation-duration:9.8s;
	animation-delay: 2s;
	-webkit-animation-delay:2s;
}
.flower1 li:nth-child(3),.flower2 li:nth-child(4){
	animation-duration: 10s;
	-webkit-animation-duration:10s;
	animation-delay: 2.9s;
	-webkit-animation-delay:2.9s;
}
.flower1 li:nth-child(4),.flower2 li:last-child{
	animation-duration: 11.2s;
	-webkit-animation-duration:11.2s;
	animation-delay: 1.6s;
	-webkit-animation-delay:1.6s;
}
.flower1 li:nth-child(5),.flower2 li:nth-child(3){
	animation-duration: 8.9s;
	-webkit-animation-duration:8.9s;
	animation-delay: 4.2s;
	-webkit-animation-delay:4.2s;
}
.flower1 li:nth-child(6),.flower2 li:first-child{
	animation-duration: 11s;
	-webkit-animation-duration:11s;
	animation-delay: 2.6s;
	-webkit-animation-delay:2.6s;
}
.flower1 li:nth-child(7),.flower2 li:nth-child(6){
	animation-duration: 9.5s;
	-webkit-animation-duration:9.5s;
	animation-delay: .8s;
	-webkit-animation-delay:.8s;
}
.flower1 li:last-child{
	animation-duration: 10.2s;
	-webkit-animation-duration:10.2s;
	animation-delay: 3.5s;
	-webkit-animation-delay:3.5s;
}

.flower li i{
	animation-name: flower;
	-webkit-animation-name:flower;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count:infinite;
	animation-direction: alternate;
	-webkit-animation-direction:alternate;
	transform-origin: 50% 100%;
	-webkit-transform-origin:50% 100%;
}
.flower li:first-child i{
	animation-duration: 7s;
	-webkit-animation-duration:7s;
}
.flower li:nth-child(2) i{
	animation-duration: 7.8s;
	-webkit-animation-duration:7.8s;
}
.flower li:nth-child(3) i{
	animation-duration: 8s;
	-webkit-animation-duration:8s;
}
.flower li:nth-child(4) i{
	animation-duration: 6.2s;
	-webkit-animation-duration:6.2s;
}
.flower li:nth-child(5) i{
	animation-duration: 6.9s;
	-webkit-animation-duration:6.9s;
}
.flower li:nth-child(6) i{
	animation-duration: 9s;
	-webkit-animation-duration:9s;
}
.flower li:nth-child(7) i{
	animation-duration: 7.5s;
	-webkit-animation-duration:7.5s;
}
.flower li:last-child i{
	animation-duration: 8.2s;
	-webkit-animation-duration:8.2s;
}

@keyframes chipsfade {
    0%{transform: rotate(0);opacity: 0;}
    10%{opacity: 1;}
    95%{transform: rotate(320deg);right: 15px;top: 1px;}
    100%{opacity: 0;}
}

/*light*/
.light-wrap{position: relative;z-index: 3;}
.light-wrap li i{display: block;width: 125px;height: 88px;background-image: url(../png/light.png);background-repeat: no-repeat;}
.light1,.light2{position: absolute;top: 0;}
.light1{left: 12%;margin-top: 7%;}
.light2{right: 13%;margin-top: 5%;}
.light li{position: absolute;}
.light li:first-child{top:0;left: 0;}
.light li:nth-child(2){top:-40px;left:-40px;}
.light li:nth-child(3){top: -60px;left: 60px;}
.light li:nth-child(4){top:20px;left: -188px;}
.light li:nth-child(5){top:-100px;left: 80px;}
.light li:nth-child(6){top:-120px;left: 0px;}
.light li:nth-child(7){top: -80px;left: -130px;}
.light li:last-child{}
.light li:first-child i{background-position: 0 0;}
.light li:nth-child(2) i{background-position: 0 -88px;}
.light li:nth-child(3) i{background-position: 0 -176px;}
.light li:nth-child(4) i{background-position: 0 -264px;}
.light li:nth-child(5) i{background-position: 0 -352px;}
.light li:last-child i{background-position: 0 -440px;}
/*@keyframes rotate1{
  from{transform:rotate(-2deg);transform-origin: top center;}
  to{transform:rotate(2deg);transform-origin: top center;}
}
@-webkit-keyframes rotate1{
  from{-webkit-transform:rotate(-2deg);-webkit-transform-origin: top center;}
  to{-webkit-transform:rotate(2deg);-webkit-transform-origin: top center;}
}*/
@-webkit-keyframes lightdrop01{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(180px, 520px, 0);opacity: 0;}
}
@keyframes lightdrop01{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(180px, 520px, 0);opacity: 0;}
}
@-webkit-keyframes lightdrop02{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(-300px, 520px, 0);opacity: 0;}
}
@keyframes lightdrop02{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(-300px, 520px, 0);opacity: 0;}
}
@-webkit-keyframes light{
	0%{-webkit-transform: rotate(70deg);}
	100%{-webkit-transform: rotate(-70deg);}
}
@keyframes light{
	0%{transform: rotate(70deg);}
	100%{transform: rotate(-70deg);}
}
.light li{
	opacity: 0;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count:infinite;
}
.light1 li{
	animation-name: lightdrop01;
	-webkit-animation-name:lightdrop01;
}
.light2 li{
	animation-name: lightdrop02;
	-webkit-animation-name:lightdrop02;
}
.light1 li:first-child,.light2 li:nth-child(2){
	animation-duration: 15s;
	-webkit-animation-duration:15s;
}
.light1 li:nth-child(2),.light2 li:nth-child(5){
	animation-duration: 15.8s;
	-webkit-animation-duration:15.8s;
	animation-delay: 2s;
	-webkit-animation-delay:2s;
}
.light1 li:nth-child(3),.light2 li:nth-child(4){
	animation-duration: 13s;
	-webkit-animation-duration:13s;
	animation-delay: 2.9s;
	-webkit-animation-delay:2.9s;
}
.light1 li:nth-child(4),.light2 li:last-child{
	animation-duration: 14s;
	-webkit-animation-duration:14s;
	animation-delay: 1.6s;
	-webkit-animation-delay:1.6s;
}
.light1 li:nth-child(5),.light2 li:nth-child(3){
	animation-duration: 15s;
	-webkit-animation-duration:15s;
	animation-delay: 6s;
	-webkit-animation-delay:6s;
}
.light1 li:nth-child(6),.light2 li:first-child{
	animation-duration: 11s;
	-webkit-animation-duration:11s;
	animation-delay: 2.6s;
	-webkit-animation-delay:2.6s;
}
.light1 li:nth-child(7),.light2 li:nth-child(6){
	animation-duration: 9.5s;
	-webkit-animation-duration:9.5s;
	animation-delay: .8s;
	-webkit-animation-delay:.8s;
}
.light1 li:last-child{
	animation-duration: 10.2s;
	-webkit-animation-duration:10.2s;
	animation-delay: 3.5s;
	-webkit-animation-delay:3.5s;
}

.light li i{
	animation-name: light;
	-webkit-animation-name:light;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count:infinite;
	animation-direction: alternate;
	-webkit-animation-direction:alternate;
	transform-origin: 50% 100%;
	-webkit-transform-origin:50% 100%;
}
.light li:first-child i{
	animation-duration: 15s;
	-webkit-animation-duration:15s;
}
.light li:nth-child(2) i{
	animation-duration: 7.8s;
	-webkit-animation-duration:7.8s;
}
.light li:nth-child(3) i{
	animation-duration: 8s;
	-webkit-animation-duration:8s;
}
.light li:nth-child(4) i{
	animation-duration: 6.2s;
	-webkit-animation-duration:6.2s;
}
.light li:nth-child(5) i{
	animation-duration: 6.9s;
	-webkit-animation-duration:6.9s;
}
.light li:nth-child(6) i{
	animation-duration: 9s;
	-webkit-animation-duration:9s;
}
.light li:nth-child(7) i{
	animation-duration: 7.5s;
	-webkit-animation-duration:7.5s;
}
.light li:last-child i{
	animation-duration: 8.2s;
	-webkit-animation-duration:8.2s;
}

/*@keyframes chipsfade {
    0%{transform: rotate(0);opacity: 0;}
    10%{opacity: 1;}
    95%{transform: rotate(320deg);right: 15px;top: 1px;}
    100%{opacity: 0;}
}

*/



/*wrap*/
/*#wrap{
	background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/bg1.jpg)  ;
	overflow: hidden;
	background-repeat: no-repeat;
	max-height: 100%;
}*/
.sect1{
	background: url(../jpg/bg1.jpg)  ;
	overflow: hidden;
	background-repeat: no-repeat;
	max-height: 100%;
}
.sect2 {
    height: 370px!important;
}
.codeBox{
	width: 195px;
	height: 419px;
	background: url(../png/code-2.png) top center no-repeat;
	position: absolute;
	top: -30px;
	right: 200px;
	z-index: 999;
	animation:rotate 1.5s ease-in-out infinite alternate;
	-webkit-animation:rotate 1.5s ease-in-out infinite alternate;
}
@keyframes rotate{0%{transform: rotate(-4deg);transform-origin: top center;} 100%{transform: rotate(4deg);transform-origin: top center;}}
@-webkit-keyframes rotate{0%{-webkit-transform: rotate(-4deg);-webkit-transform-origin:top center;} 100%{-webkit-transform: rotate(4deg);-webkit-transform-origin:top center;}}
.spr{
	background: url(../png/spr.png);
	/*background-size: 500px auto;*/
}
.ios-download{
    display: block;
    width: 119px;
    height: 30px;
    background-position: 0 0;
    position: absolute;
    bottom: 115px;
    left: 50%;
    margin-left: -63px;
    z-index: 999;
}
.adr-download{
    display: block;
    width: 119px;
    height: 30px;
    background-position: -119px 0;
    position: absolute;
    bottom: 78px;
    left: 50%;
    margin-left: -63px;
    z-index: 999;
}
.bookBox{
	width: 912px;
	height: 884px;
	background: url(../png/book.png) top center no-repeat;
	margin: 55px auto 0;
	position: relative;
	z-index: 99;
	    position: absolute;
    z-index: 99;
    left: 50%;
    margin-left: -456px;
    top: 50%;
    margin-top: -442px;
}    
.book-logo{
 	width: 93px;
    height: 68px;
    background-position: -136px -50px;
    margin-left: 100px;
    margin-top: 10px;
}
.slogan-box{
	width: 422px;
	position: absolute;
    top: 289px;
    left: 50%;
    margin-left: -289px;
}
.slogan2{
	width: 121px;
	height: 42px;
	background-position: -250px 0;
	margin: 0 auto;
	margin-left: 111px;
}

.check-tips{
	display: block;
	width: 136px;
	height: 97px;
	background-position: 0 -50px;
	position: absolute;
	bottom: 170px;
	right: 0;
	animation:guide 3s ease-in-out infinite alternate;
	-webkit-animation:guide 3s ease-in-out infinite alternate;
}
@keyframes guide { 
	    0% {
	        transform: translate(20px,40px)
	    }

	    50% {
	        transform: translate(0px,0px)

	    }

	    100% {
	        transform: translate(20px,40px)
	    }
}
@-webkit-keyframes guide {
	    0% {
	        transform: translate(20px,40px)
	    }

	    50% {
	        transform: translate(0px,0px)

	    }

	    100% {
	        transform: translate(20px,40px)
	    }
}

.label{
/*    display: block;
    width: 219px;
    height: 246px;
    background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/label.png) top center no-repeat;
    position: absolute;
    top: 18px;
    left: 50%;
    margin-left: 5px;*/
        display: block;
    width: 10%;
    height: 14%;
    background: url(../png/label.png) top center no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: 5px;
    margin-top: -25%;
}
.label-btn1{
    display: block;
    width: 78px;
    height: 138px;
    position: absolute;
    transform: rotate(16deg);
}
.label-btn2{
    display: block;
    width: 55px;
    height: 118px;
    position: absolute;
    transform: rotate(16deg);
}
.label-btn3{
	display: block;
    width: 30px;
    height: 38px;
    background-position: -371px 0;
    position: absolute;

}
.ninjia.label-btn1{
	top: 163px;
    right: 152px;
}
.ninjia.label-btn2{
    top: 296px;
    right: 205px;
}
.ninjia.label-btn3{
	top: 445px;
    right: 255px;
}
.activity.label-btn1{
	top: 218px;
	right: 79px;
	transform: rotate(26deg);
}
.activity.label-btn2{
    top: 343px;
    right: 146px;
    transform: rotate(26deg);
}
.activity.label-btn3{
	top: 468px;
	right: 200px;
}

.part{
	width: 100%;
	height: 100%;
	overflow: hidden;
}
/*part2*/
.pop-ninjia{
	position: relative;
    display: none;
	width: 100%;
	height: 100%;
	overflow: hidden;
	top: 0!important;
	text-align: center;
}
.logo{
	width: 202px;
	height: 95px;
	background-position: 0 -147px;
	position: absolute;
	top: 50px;
	left: 50px;
}
.pop-ninjia .pop-con{
/*	width: 757px;
	height: 848px;*/
	width: 741px;
	height: 780px;
	background: url(../png/bg2.png);
	background-repeat: no-repeat;
    margin: 150px auto 0;
    z-index: 12;
    position: relative;
    overflow: hidden;
}
.pop-activity .pop-con{
/*	width: 757px;
	height: 848px;*/
	width: 741px;
	height: 780px;
	background: url(../png/bg2.png);
	background-repeat: no-repeat;
    margin: 150px auto 0;
    z-index: 12;
    position: relative;
    overflow: hidden;
}
.book-bg{
	position: absolute;
    top: 116px;
    left: 50%;
    margin-left: -373.5px;
}
.pop-con .close{
	display: block;
	width: 40px;
	height: 36px;
	background-position: -459px 0;
    position: absolute;
    top: 40px;
    right: 55px;
    z-index: 999;
}
.pop-con .next-btn{
    display: block;
    width: 75px;
    height: 80px;
    position: absolute;
    bottom: 27px;
    right: 29px;
    z-index: 99;
}
.pop-con .prev-btn{
    display: block;
    width: 75px;
    height: 80px;
    position: absolute;
    top: 25px;
    left: 33px;
    z-index: 99;
}
.pop-con .title{
	width: 346px;
	height: 47px;
	background-position: 0 -242px;
	margin: 47px auto 0;
}
.pop .home{
	display: block;
	width: 183px;
	height: 234px;
	background: url(../png/home.png) top center no-repeat;
	position: absolute;
	top: 87px;
	left: 1027px;
	z-index: 5;
}
.pop .share{
	display: block;
	width: 210px;
	height: 246px;
	background: url(../png/share.png) top center no-repeat;
	position: absolute;
	top: 78px;
	left: 1148px;
	z-index: 8;
}
.ninjia-details{
    width: 665px;
    position: relative;
    margin: 0 auto;
}

.ninjia-details .chara-photo{
	width: 361px;
	float: left;

}
.ninjia-details .chara-details li{
	width: 286px;
	/*height: 625px;*/
	height: 470px;

	float: left;

}
.text-con{
	position: relative;
	height: 100px;
	overflow-y: scroll;
}
.text-con::-webkit-scrollbar {
        width: 5px;
        height: 15px;
        background-color: #a08f7f;
    }
.text-con::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    border-radius: 20px;
    background-color: #dcd4bc;
}
.text-con::-webkit-scrollbar-thumb {
    height: 20px;
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #a08f7f;
}
.skill-choice {
    margin-top: 382px;
    overflow: hidden;
    margin-bottom: 10px;
}
.skill-choice a{
	width: 81px;
	height: 76px;
	display: inline-block;
	float: left;
	background: url(../png/skill-icon.png);
	margin-right: 10px;
}
.chara-details li{display: none;}
.chara-details li.dis{display: block;}
/*chara1*/
.chara-details li:nth-child(1){	background: url(../png/chara1-text.png) top center no-repeat;background-position-y: 50px;}
.chara-details li:nth-child(1) .skill-choice a.skill1{background-position: 0 0;}
.chara-details li:nth-child(1) .skill-choice a.skill2{background-position: -81px 0;}
.chara-details li:nth-child(1) .skill-choice a.skill3{background-position: -162px 0;}
.chara-details li:nth-child(1) .skill-choice a.skill1.on{background-position: 0 -78px;}
.chara-details li:nth-child(1) .skill-choice a.skill2.on{background-position: -81px -78px;}
.chara-details li:nth-child(1) .skill-choice a.skill3.on{background-position: -162px -78px;}


/*chara2*/
.chara-details li:nth-child(2){	background: url(../png/chara2-text.png) top center no-repeat;background-position-y: 50px;}
.chara-details li:nth-child(2) .skill-choice a.skill1{background-position: 0 -156px;}
.chara-details li:nth-child(2) .skill-choice a.skill2{background-position: -81px -156px;}
.chara-details li:nth-child(2) .skill-choice a.skill3{background-position: -162px -156px;}
.chara-details li:nth-child(2) .skill-choice a.skill1.on{background-position: 0 -234px;}
.chara-details li:nth-child(2) .skill-choice a.skill2.on{background-position: -81px -234px;}
.chara-details li:nth-child(2) .skill-choice a.skill3.on{background-position: -162px -234px;}

/*chara3*/
.chara-details li:nth-child(3){	background: url(../png/chara3-text.png) top center no-repeat;background-position-y: 50px;}
.chara-details li:nth-child(3) .skill-choice a.skill1{background-position: 0 -312px;}
.chara-details li:nth-child(3) .skill-choice a.skill2{background-position: -81px -312px;}
.chara-details li:nth-child(3) .skill-choice a.skill3{background-position: -162px -312px;}
.chara-details li:nth-child(3) .skill-choice a.skill1.on{background-position: 0 -392px;}
.chara-details li:nth-child(3) .skill-choice a.skill2.on{background-position: -81px -392px;}
.chara-details li:nth-child(3) .skill-choice a.skill3.on{background-position: -162px -392px;}

.enter-activity{
	width: 42px;
	height: 159px;
	display: block;
	position: absolute;
	top: 650px;
    right: 500px;
	background-position: 0 -337px;
	display: none;
}
.enter-activity.dis{
	display: block;
}
/*activity*/
.pop-activity{
	position: relative;
    display: none;
	width: 100%;
	height: 100%;
	overflow: hidden;
	top: 0!important;
	text-align: center;
}
.enter-ninjia{
	width: 42px;
	height: 159px;
	display: block;
	position: absolute;
	top: 650px;
    right: 500px;
	background-position: -42px -337px;
	display: none;
}
.enter-ninjia.dis{
	display: block;
}

.pop-activity .title{
	width: 491px;
	height: 48px;
	background-position: 0 -289px;
	margin-left: 176px;
}
.activity-details{
    width: 665px;
    position: relative;
    margin: 0 auto;
}

.activity-con li{display: none;}
.activity-con li.dis{display: block;}
.activity-con{width: 625px;margin: 50px auto 0;margin-left: 15px;}
.pop-share{
    width: 260px;
    height: 310px;
    margin-top: -155px;
    font-size: 18px;
    color: #fff;
    text-align: center;
    line-height: 47px;
    display: none;
}
.pop-close {
    position: absolute;
    display: block;
    width: 50px;
    height: 50px;
    right: -50px;
    top: -10px;
    background: url(../png/close.png) no-repeat center center;
}




/*气氛*/
/*.light i{
    display: block;
    width: 125px;
    height: 88px;
    background: url(//game.gtimg.cn/images/hyrz/cp/a20190229xbb/light.png);
    position: absolute;
    z-index: 1;
}
.light i:nth-child(1){
	background-position: 0 0;
   -webkit-animation: snow1 11s linear infinite;
    animation: snow1 11s linear infinite;

}
.light i:nth-child(2){
	background-position: 0 -88px;
	 -webkit-animation: snow2 8s linear infinite;
    animation: snow2 8s linear infinite;
}
.light i:nth-child(3){
	background-position: 0 -176px;
}
.light i:nth-child(4){
	background-position: 0 -264px;
}
.light i:nth-child(5){
	background-position: 0 -352px;
}

@keyframes snow1{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(180px, 520px, 0);opacity: 0;}
}
@-webkit-keyframes snow1{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(180px, 520px, 0);opacity: 0;}
}

@-webkit-keyframes snow2{
	0%{-webkit-transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	76%{opacity: 1;}
	100%{-webkit-transform: translate3d(280px, 880px, 0);opacity: 0;}
}
@keyframes snow2{
	0%{transform: translate3d(0, 0, 0);opacity: 0;}
	20%{opacity: 1;}
	60%{opacity: 1;}
	100%{transform: translate3d(280px, 880px, 0);opacity: 0;}
}*/
.back-home{
    display: block;
    width: 150px;
    height: 80px;
    position: absolute;
    left: 50%;
    margin-left: 37px;
    top: 31px;
    z-index: 999;
}