@charset "gb2312";
* {margin:0;padding:0;border:0;-webkit-user-select:text}
a,img {-webkit-touch-callout:none;}
body,p {margin: 0;}
img{border: none;}
body,html {height: 100%;overflow: hidden;}

body{margin: 0 auto;}
.wrap{height: 100%;overflow: hidden;background: #fef2c0;position: relative;perspective: 300px;-webkit-perspective: 300px;}

.load_bg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #fef2c0;z-index: 100;}
.load{height: 100%;background: url(../images/bg_1.png) center top no-repeat;background-size: 6.4rem auto;position: absolute;width: 100%;top: 3rem;}
.load p{color: #ed5138;position: absolute;text-align: center;top: .9rem;font-size: .33rem;width: 100%;}
.line{background: #ff6d4a;width: 4.25rem;height: .12rem;position: absolute;top: .2rem;left: 1rem;border-radius: 3px;}

.cover{height: 100%;width: 100%;position: absolute;top: 0;left: 0;background: url(../images/bg_2.jpg) top center no-repeat;background-size: cover;}
.cover>div{position: absolute;}
.title1{background: url(../images/text_1.png);width: 6.4rem;height: 4.87rem;background-size: 100% 100%;left: 0rem;top: .5rem;}
.hammer{background: url(../images/icon_4.png);background-size: 100% 100%;width: 4.35rem;height: 3.29rem;left: 1.025rem;top: 6.5rem;}
.figure{background: url(../images/icon_5.png);background-size: 100% 100%;width: 2.57rem;height: .61rem;}
.figure1{top: 5.5rem;right: -1rem;animation: 2s right linear infinite alternate;-webkit-animation: 2s right linear infinite alternate;}
.figure2{top: 7.5rem;left: -1.5rem;animation: 2s left linear infinite alternate;-webkit-animation: 2s left linear infinite alternate;}

.cloud{background:url(../images/cloud.png);width: 1.12rem;height: .47rem;background-size: 100% 100%;}
.cloud1{left: 0;bottom: 2rem;animation: 2s left1 linear infinite alternate;}
.cloud2{right: -.5rem;bottom: 1rem;animation: 2s right2 linear infinite alternate;-webkit-animation: 2s right2 linear infinite alternate;}

.game{height: 100%;width: 100%;position: absolute;top: 0;left: 0;background: url(../images/bg_4.jpg) center top no-repeat;display: none;}
.game>div{position: absolute;}
.time{width: 6.4rem;background:url(../images/icon_2.png);height: 2.8rem;top: 0rem;left: 0rem;background-size: 100% 100%;}

.progress{background:url(../images/icon_3.png);width: 4.97rem;height: .27rem;top: .37rem;left: .83rem;position: absolute;background-size: cover;z-index: 10;}
.timer{color: #fff;text-align: center;position: absolute;top: .7rem;width: 100%;font-size: .65rem;padding-left: .25rem;}
.drum{background: url(../images/drum.png);width: 6.4rem;height: 7.09rem;background-size: 100% 100%;bottom: -.48rem;left: 0;}
.tip{background: url(../images/text_3.png);width: 2.61rem;height: 1.19rem;bottom: 3.5rem;background-size: 100% 100%;left: 1.895rem;}
.start{background: url(../images/start.png);width: 2.63rem;height: .82rem;background-size: 100% 100%;left: 1.885rem;bottom: 1.8rem;}
.hammer1{background: url(../images/icon_1.png);width: 4rem;height: 4.56rem;background-size: 100% 100%;left: -2.2rem;bottom: -1.2rem;}
.shine{width: 6.4rem;background: url(../images/shine.png);height: 5.76rem;background-size: 100% 100%;position: absolute;left: 0;top:1.5rem;display: none;}
.hammer2{background: url(../images/icon_1.png);width: 4rem;height: 4.56rem;background-size: 100% 100%;right: -2.2rem;bottom: -1.2rem;-webkit-transform:scaleX(-1);transform:scaleX(-1);}
.hammer3{left: -1.3rem;bottom: -.7rem;}
.hammer4{right: -1.3rem;bottom: -.7rem;}
.barrage{position: absolute;height: 5rem;width: 100%;left: 0;top: 1rem;z-index: 100;}
.barrage span{display: block;position: absolute;background-size: cover;left: 7.5rem;}
.barrage span:nth-of-type(1){width: 3.35rem;height: .5rem;top: .9rem;}
.barrage span:nth-of-type(2){width: 3rem;height: .5rem;top: 1.4rem;}
.barrage span:nth-of-type(3){width: 2.5rem;height: .41rem;top: 1.8rem;}
.barrage span:nth-of-type(4){width: 2.27rem;height: .42rem;top: 1.4rem;}
.barrage span:nth-of-type(5){width: 1.59rem;height: .39rem;top: .9rem;}
.barrage span:nth-of-type(6){width: 3.35rem;height: .44rem;top:1.4rem;}
.barrage span:nth-of-type(7){width: 1.96rem;height: .4rem;top:1.8rem;}
.barrage span:nth-of-type(8){width: 6.37rem;height: .4rem;top:1.8rem;}

.barrage.on span:nth-of-type(1){animation: 5s bar1 linear;-webkit-animation: 5s bar1 linear;}
.barrage.on span:nth-of-type(2){animation: 3s bar1 linear;-webkit-animation: 3s bar1 linear;}
.barrage.on span:nth-of-type(3){animation: 4s bar1 linear;-webkit-animation: 4s bar1 linear;}
.barrage.on span:nth-of-type(4){animation: 4.5s bar1 linear;-webkit-animation: 4.5s bar1 linear;}
.barrage.on span:nth-of-type(5){animation: 5s 2s bar1 linear;-webkit-animation: 5s 2s bar1 linear;}
.barrage.on span:nth-of-type(6){animation: 4.5s 1.5s bar1 linear;-webkit-animation: 4.5s 1.5s bar1 linear;}
.barrage.on span:nth-of-type(7){animation: 4s 1s bar1 linear;-webkit-animation: 4s 1s bar1 linear;}
.barrage.on span:nth-of-type(8){animation: 4.3s 1.5s bar1 linear;-webkit-animation: 4.3s 1.5s bar1 linear;}

.shine1{animation: 1s op linear infinite;-webkit-animation: 1s op linear infinite;}

.conut{width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: rgba(0,0,0,.85);z-index: 300;display: none;}
.zan{background: url(../images/zan.png);width: 3.26rem;height: 2.71rem;background-size: cover;margin-top: 2.3rem;margin-left: 1.57rem;margin-bottom: 1rem;}
.conut p{font-size: .4rem;line-height: .8rem;text-align: center;color: #fc6;text-align: center;}
.conutNum,.percent{color: #fe6533;}
.conutNum{text-align: center;padding: .2rem;font-size: .75rem;font-style: italic;}
.percent{font-size: .8rem;padding: 0 .2rem;}

.zan1{animation: 1.2s big_s linear infinite;-webkit-animation: 1.5s big_s linear infinite;}
.pack{color: #fc6;text-align: center;position: absolute;width: 100%;top: 35%;}
.pack p{line-height: 1rem;font-size: .4rem;}
.tree{background: url(../images/bg_3.jpg) top center;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background-size: cover;display: none;}
.tree>div{position: absolute;background-size: 100% 100%;}
.tree .fu{background: url(../images/du.png) center top no-repeat;width: 3rem;height: 4.77rem;left: 1.1rem;top: 4.1rem;background-size: auto 100%;}
.fu_shine{background: url(../images/fu_shine.png);width: 6.4rem;height: 6.89rem;left: 0rem;top: 2rem;display: none;}
.backOver{background: url(../images/bg_6.png);width: 100%;height: 100%;}
.scroll{background: url(../images/juanzhou.png);width: 100%;height: 100%;top: -2%;}
.share{background: url(../images/bg_5.png);width: 100%;height: 100%;}
.wish{width: 100%;height: 100%;left: 0;top: 12%;}

.reload{width: 2rem;height: 1.2rem;top: 1rem;left: .3rem;}

.fuOn{animation: 1.2s fu linear;-webkit-animation: 1.5s fu linear;}


@keyframes bar1 {
	0%{
		left:7.5rem;
	}
	100% {
		left:-3.3rem;
	}
}
@-webkit-keyframes bar1 {
	0%{
		left:7.5rem;
	}
	100% {
		left:-3.3rem;
	}
}

@keyframes left {
	0%{
		left:-1.8rem;
	}
	100% {
		left:-1.2rem;
	}
}
@-webkit-keyframes left {
	0%{
		left:-1.8rem;
	}
	100% {
		left:-1.2rem;
	}
}

@keyframes right {
	0%{
		right: -.8rem;
	}
	100% {
		right:-1.2rem;
	}
}
@-webkit-keyframes right {
	0%{
		right: -.8rem;
	}
	100% {
		right:-1.2rem;
	}
}

@keyframes left1 {
	0%{
		left:-.5rem;
	}
	100% {
		left:0rem;
	}
}
@-webkit-keyframes left1 {
	0%{
		left:-.5rem;
	}
	100% {
		left:0rem;
	}
}

@keyframes right2 {
	0%{
		right: -.5rem;
	}
	100% {
		right:0rem;
	}
}
@-webkit-keyframes right2 {
	0%{
		right: -.5rem;
	}
	100% {
		right:0rem;
	}
}

@keyframes op {
	0%{
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@-webkit-keyframes op {
	0%{
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}


@keyframes big_s {
	0%{
		transform: scale(1.2);
	}
	50%{
		transform: scale(.6);
	}
	100% {
		transform: scale(1.2);
	}
}
@-webkit-keyframes big_s {
	0%{
		-webkit-transform: scale(1.2);
	}
	50%{
		-webkit-transform: scale(.6);
	}
	100% {
		-webkit-transform: scale(1.2);
	}
}

@keyframes fu {
	0%{
		transform: scale(0) rotate(0deg);
		top:0;
	}
	50%{
		transform: scale(.7) rotate(180deg);
		top:2.3rem;
	}
	100% {
		transform: scale(1) rotate(360deg);
		top:4.1rem;
	}
}
@-webkit-keyframes fu {
	0%{
		-webkit-transform: scale(0) rotate(0);
		top:0;
	}
	50%{
		-webkit-transform: scale(.7) rotate(180deg);
		top:2.3rem;
	}
	100% {
		-webkit-transform: scale(1) rotate(360deg);
		top:4.1rem;
}