@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: 1.6rem;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: 4rem;height: 1.58rem;background-size: 100% 100%;left: 1.75rem;top: .5rem;}
.title2{background: url(../images/text_2.png);background-size: 100% 100%;width: 5rem;height: 1.95rem;left: 1.25rem;top: 2rem;}
.hammer{background: url(../images/icon_4.png);background-size: 100% 100%;width: 4.35rem;height: 3.29rem;left: 1.575rem;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: 7.5rem;background:url(../images/icon_2.png);height: 3.28rem;top: 0rem;left: 0rem;background-size: 100% 100%;}

.progress{background:url(../images/icon_3.png);width: 5.84rem;height: .32rem;top: .42rem;left: .98rem;position: absolute;background-size: cover;z-index: 10;}
.timer{color: #fff;text-align: center;position: absolute;top: .7rem;width: 100%;font-size: .9rem;padding-left: .25rem;}
.drum{background: url(../images/drum.png);width: 7.5rem;height: 8.31rem;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: 2.445rem;}
.start{background: url(../images/start.png);width: 2.63rem;height: .82rem;background-size: 100% 100%;left: 2.435rem;bottom: 1.8rem;}
.hammer1{background: url(../images/icon_1.png);width: 4.51rem;height: 5.26rem;background-size: 100% 100%;left: -2.5rem;bottom: -1.8rem;}
.shine{width: 7.5rem;background: url(../images/shine.png);height: 6.75rem;background-size: 100% 100%;position: absolute;left: 0;top:1.5rem;display: none;}
.hammer2{background: url(../images/icon_1.png);width: 4.51rem;height: 5.26rem;background-size: 100% 100%;right: -2.5rem;bottom: -1.8rem;-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: 2.26rem;height: 1.69rem;top: .9rem;}
.barrage span:nth-of-type(2){width: 1.91rem;height: 1.67rem;top: 1.2rem;}
.barrage span:nth-of-type(3){width: 2.08rem;height: 1.66rem;top: 1.5rem;}
.barrage span:nth-of-type(4){width: 2.03rem;height: 1.61rem;top: 2.5rem;}
.barrage span:nth-of-type(5){width: 3.3rem;height: 2.2rem;top: 0.3rem;}
.barrage span:nth-of-type(6){width: 3.72rem;height: 3.11rem;top:.9rem;}

.barrage.on span:nth-of-type(1){animation: 5s bar1 linear;-webkit-animation: 5s bar1 linear;}
.barrage.on span:nth-of-type(2){animation: 4s bar1 linear;-webkit-animation: 4s bar1 linear;}
.barrage.on span:nth-of-type(3){animation: 7s bar1 linear;-webkit-animation: 7s bar1 linear;}
.barrage.on span:nth-of-type(4){animation: 9s bar1 linear;-webkit-animation: 9s bar1 linear;}
.barrage.on span:nth-of-type(5){animation: 12s bar1 linear;-webkit-animation: 12s bar1 linear;}
.barrage.on span:nth-of-type(6){animation: 3.2s bar1 linear;-webkit-animation: 3.2s 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: 2.12rem;margin-bottom: 1rem;}
.conut p{font-size: .5rem;line-height: 1.3rem;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: 5rem;}
.pack p{line-height: 1.2rem;font-size: .6rem;}

.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: 4rem;height: 5rem;left: 1.75rem;top: 4.5rem;background-size: auto 100%;}
.fu_shine{background: url(../images/fu_shine.png);width: 7rem;height: 7.53rem;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%;}
.share{background: url(../images/bg_5.png);width: 100%;height: 100%;}
.wish{width: 100%;height: 100%;left: 0;top: 0;}

.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.5rem;
	}
}
@-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.5rem;
}