*{outline: none}
html,body,div,h1,h2,h3,strong,span,img,a,p,label,ul,li,dl,dt,dd,ol,table,tr,td,input,nav,section,header,footer,i{
	margin: 0;
	padding:0;
	-webkit-tap-highlight-color:rgba(255,0,0,0);
}
h1,h2,h3,h4 {
	font-weight: normal;
}
ul li {
	list-style-type: none;
}
html,
button,
input,
select,
textarea {
    font-family: 'Arial', 'Microsoft Yahei';
}

html, body {
	height: 100%;
}
body {
	background-color: #fff;
}
a {text-decoration: none;}

img {
	display: block;
	width: 100%;
	height: auto;
}


.fl {
	float: left;
}
.fr {
	float: right;
}
.dn {
	display: none;
}
.music-btn {
	position: absolute;
	top: 40px;
	right: 40px;
	width: 54px;
	height: 44px;
	background: url('../images/music_play.png') no-repeat center center;
	z-index: 10;
}
.music-btn.pause {
	background: url('../images/music_pause.png') no-repeat center center;
}
.wrap {
	max-width: 750px;
	height: 100%;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	background: url('../images/bg_page01.jpg') no-repeat;
}
.page-box {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 750px;
	height: 1334px;
	margin: -667px 0 0 -375px;
	transform-origin: 50% 50% 0;
	-webkit-transform-origin: 50% 50% 0;
}
.wrap-load .load-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 268px;
	height: 278px;
	background: url('../images/load_icon.png') no-repeat;
	margin-left: -134px;
	margin-top: -260px;
}
.wrap-load .load-plan-box {
	position: absolute;
	top: 50%;
	left: 169px;
	width: 353px;
	height: 21px;
	box-sizing: border-box;
	margin-top: 30px;
}
.wrap-load .load-plan-box .load-plan {
	display: block;
	width: 0;
	height: 100%;
	background: url('../images/load_plan.png') no-repeat;
	border-radius: 50px / 10px;
}
.wrap-load .load-num {
	position: absolute;
	top: 50%;
	right: 170px;
	line-height: 40px;
	font-size: 24px;
	color: #000;
	margin-top: 20px;
	font-weight: bold;
}
.wrap-load .load-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -212px;
	margin-top: 157px;
}
/*首页START*/
.wrap-home {
	background: url('../images/bg_home.jpg') no-repeat center center;
	background-size: cover;
}
.wrap-home .home-scene01 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url('../images/bg_excess.gif') no-repeat center center;
	background-size: cover;
}
.home-theme01 {
	position: absolute;
	top: 55px;
	left: 70px;
	width: 207px;
	height: 412px;
	background: url('../images/home_theme01.png') no-repeat;
}
.home-theme02 {
	position: absolute;
	top: 340px;
	left: 168px;
	width: 191px;
	height: 452px;
	background: url('../images/home_theme02.png') no-repeat;
}
.home-people {
	position: absolute;
	top: 240px;
	right: 100px;
	width: 553px;
	height: 772px;
	background: url('../images/home_people.png') no-repeat;
	transform-origin: 100% 50% 0;
	-webkit-transform-origin: 100% 50% 0;
	transform: scale(.9);
	-webkit-transform: scale(.9);
}
.home-btn {
	position: absolute;
	bottom: 176px;
	left: 50%;
	margin-left: -230px;
}
.home-btn-rule {
	position: absolute;
	bottom: 96px;
	left: 100px;
}
.home-btn-award {
	position: absolute;
	bottom: 96px;
	right: 100px;
}

/*首页END*/

/*穿越*/
.wrap-page02 .page-scene01 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url('../images/bg_page02.gif') no-repeat center center;
	background-size: cover;
}
/*指示*/
.wrap-page02 .page-prople {
	position: absolute;
	top: 150px;
	left: 50%;
	width: 675px;
	height: 1058px;
	margin-left: -338px;
	background: url('../images/page_prople01.png') no-repeat;
}
/*答题*/
.wrap-answer .page-info {
	background: url('../images/bg_page01.jpg') no-repeat;
	background-size: cover;
}
.wrap-answer01 .page-inset {
	background: url('../images/bg_page03.jpg') no-repeat center center;
	background-size: cover;
}
.wrap-answer01 .answer-inset {
	position: absolute;
	top: 110px;
	left: 50%;
	width: 750px;
	height: 1080px;
	margin-left: -375px;
	background: url('../images/page_inset01.png') no-repeat;
}

.wrap-answer02 .answer-inset {
	position: absolute;
	top: 110px;
	left: 50%;
	width: 750px;
	height: 1075px;
	margin-left: -375px;
	background: url('../images/page_inset02.png') no-repeat;
}
.wrap-answer03 .answer-inset {
	position: absolute;
	top: 110px;
	left: 50%;
	width: 750px;
	height: 1054px;
	margin-left: -375px;
	background: url('../images/page_inset03.png') no-repeat;
}
.wrap-answer04 .answer-inset {
	position: absolute;
	top: 110px;
	left: 50%;
	width: 750px;
	height: 990px;
	margin-left: -375px;
	background: url('../images/page_inset04.png') no-repeat;
}
.wrap-answer05 .answer-inset {
	position: absolute;
	top: 110px;
	left: 50%;
	width: 750px;
	height: 1096px;
	margin-left: -375px;
	background: url('../images/page_inset05.png') no-repeat;
}

.answer-info {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 668px;
	height: 1035px;
	margin: -518px 0 0 -334px;
}
.answer-info .answer-btn {
	position: absolute;
}
.wrap-answer01 .answer-info {
	background: url('../images/page_answer01.png') no-repeat;
}
.wrap-answer02 .answer-info {
	background: url('../images/page_answer02.png') no-repeat;
}
.wrap-answer03 .answer-info {
	background: url('../images/page_answer03.png') no-repeat;
}
.wrap-answer04 .answer-info {
	background: url('../images/page_answer04.png') no-repeat;
}
.wrap-answer05 .answer-info {
	background: url('../images/page_answer05.png') no-repeat;
}
.wrap-answer01 .answer-info .answer-btn.btn01 {
	top: 354px;
	left: 90px;
	width: 445px;
	height: 113px;
}
.wrap-answer01 .answer-info .answer-btn.btn02 {
	top: 588px;
	left: 90px;
	width: 465px;
	height: 156px;
}
.wrap-answer02 .answer-info .answer-btn.btn01 {
	top: 357px;
	left: 87px;
	width: 472px;
	height: 182px;
}
.wrap-answer02 .answer-info .answer-btn.btn02 {
	top: 590px;
	left: 87px;
	width: 496px;
	height: 112px;
}
.wrap-answer03 .answer-info .answer-btn.btn01 {
	top: 360px;
	left: 90px;
	width: 494px;
	height: 104px;
}
.wrap-answer03 .answer-info .answer-btn.btn02 {
	top: 590px;
	left: 90px;
	width: 494px;
	height: 155px;
}
.wrap-answer04 .answer-info .answer-btn.btn01 {
	top: 360px;
	left: 87px;
	width: 497px;
	height: 148px;
}
.wrap-answer04 .answer-info .answer-btn.btn02 {
	top: 590px;
	left: 87px;
	width: 497px;
	height: 107px;
}
.wrap-answer05 .answer-info .answer-btn.btn01 {
	top: 360px;
	left: 87px;
	width: 515px;
	height: 121px;
}
.wrap-answer05 .answer-info .answer-btn.btn02 {
	top: 560px;
	left: 87px;
	width: 515px;
	height: 119px;
}
.answer-next {
	position: absolute;
	bottom: 50px;
	left: 50%;
	margin-left: -38px;
	z-index: 10;
}

/*领奖页*/
.award-theme {
	position: absolute;
	top: 120px;
	left: 30px;
	width: 682px;
	height: 571px;
	background: url('../images/award_theme.png') no-repeat;
}
.award-input-box {
	position: absolute;
	top: 710px;
	left: 50%;
	width: 590px;
	margin-left: -295px;
}
.award-input-box li {
	margin-bottom: 30px;
	display: -webkit-box;
	-webkit-box-pack: justify;
	-webkit-box-align: center;
	display: flex;
	justify-content: space-between;
	align-items: center;
	display: -webkit-flex;
	-webkit-justify-content: space-between;
	-webkit-align-items: center;
}
.award-input-box li input {
	display: block;
	width: 100%;
	height: 86px;
	box-sizing: border-box;
	padding: 30px;
	background-color: #fff;
	border: 3px solid #a5271a;
	border-radius: 8px;
	font-size: 28px;
	box-shadow: 0 -4px 8px rgba(0,0,0,.64) inset;
	-webkit-box-shadow: 0 -4px 8px rgba(0,0,0,.64) inset;
}
.award-input-box li input.w340 {
	width: 340px;
}
.award-input-box li .code-btn {
	display: block;
	width: 240px;
	height: 80px;
	border-radius: 8px;
	background-color: #e43341;
	line-height: 80px;
	text-align: center;
	font-size: 28px;
	color: #fff;
}
.award-btn {
	position: absolute;
	bottom: 190px;
	left: 50%;
	margin-left: -212px;
}
.award-prompt {
	position: absolute;
	bottom: 30px;
	left: 0;
	width: 100%;
	line-height: 26px;
	text-align: center;
	font-size: 20px;
	color: #000;
}

/*结束页*/
.wrap-over {
	overflow-x: hidden;
	overflow-y: auto;
}
.page-over {
	width: 100%;
	min-height: 100%;
	box-sizing: border-box;
	background: url('../images/bg_page04.jpg') no-repeat center top;
	background-size: cover;
	padding-top: 950px;
	padding-bottom: 40px;
	position: relative;
}
.over-theme {
	position: absolute;
	top: 140px;
	left: 50%;
	width: 666px;
	height: 782px;
	margin-left: -333px;
	background: url('../images/over_theme.png') no-repeat;
}
.over-theme.award {
	background: url('../images/over_theme_award.png') no-repeat;
}
.over-award-box {
	margin: 0 auto 60px;
}
.over-award-box .over-award-text {
	display: block;
	width: 100%;
	height: 35px;
	margin-bottom: 28px;
}
.over-move-btn {
	display: block;
	margin: 0 auto;
}
.over-other-box {
	margin: 10px auto 0;
	box-sizing: border-box;
	padding: 38px 0 0 23px;
}
.over-other-box .over-other-text {
	display: block;
	width: 612px;
	height: 72px;
	margin-bottom: 35px;
}
.over-prompt {
	height: 50px;
	line-height: 50px;
	text-align: center;
	margin-top: 40px;
}
.over-prompt a {
	font-size: 28px;
	color: #604d44;
	text-decoration: underline;
}

.share-btn {
	position: absolute;
	top: 7px;
	right: 45px;
}

/*弹窗*/
.pop-mask {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.7);
	z-index: 100;
}
.pop-close {
	position: absolute;
	bottom: -120px;
	left: 50%;
	margin-left: -29px;
}
.pop-box {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 620px;
	margin-left: -310px;
	box-sizing: border-box;
	background: url('../images/pop_bg01.png') no-repeat center center #fff;
	background-size: 600px 100%;
	border: 1px solid #7c401f;
}
.pop-box:before {
	content: '';
	position: absolute;
	top: 50%;
	left: -30px;
	width: 52px;
	background: url('../images/pop_deco01.png') no-repeat;
	background-size: 100% 100%;
}
.pop-box:after {
	content: '';
	position: absolute;
	top: 50%;
	right: -30px;
	width: 52px;
	background: url('../images/pop_deco01.png') no-repeat;
	background-size: 100% 100%;
}
.pop-box .pop-info {
	width: 94%;
	height: 100%;
	margin: 0 auto;
	position: relative;
	background-color: #fff;
	overflow: hidden;
}
.pop-box .pop-btn01 {
	position: absolute;
	bottom: 20px;
	left: 50%;
	width: 240px;
	height: 80px;
	margin-left: -120px;
	background-color: #e43341;
	border-radius: 8px;
}
.pop-box .pop-btn01 i {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -17px 0 0 -40px;
}
.pop-box .pop-btn01 i.text01 {
	margin: -20px 0 0 -82px;
}
.pop-box01 {
	height: 400px;
	margin-top: -200px;
	padding: 30px 10px;
}
.pop-box01:before,.pop-box01:after {
	height: 470px;
	margin-top: -235px;
}
.pop-box02 {
	height: 290px;
	margin-top: -145px;
	padding: 20px 10px;
}
.pop-box02:before,.pop-box02:after {
	height: 360px;
	margin-top: -180px;
}
.pop-box01 .title {
	position: absolute;
	top: 20px;
	left: 50%;
	margin-left: -98px;
}
.pop-box01 .input {
	position: absolute;
	top: 90px;
	left: 50%;
	width: 510px;
	height: 70px;
	margin-left: -255px;
	display: -webkit-box;
	-webkit-box-pack: justify;
	-webkit-box-align: center;
	display: flex;
	justify-content: space-between;
	align-items: center;
	display: -webkit-flex;
	-webkit-justify-content: space-between;
	-webkit-align-items: center;
}
.pop-box01 .input input {
	display: block;
	width: 354px;
	height: 70px;
	box-sizing: border-box;
	background-color: #fff;
	border: 3px solid #a5271a;
	border-radius: 8px;
	text-align: center;
	font-size: 28px;
	box-shadow: 0 -4px 8px rgba(0,0,0,.64) inset;
	-webkit-box-shadow: 0 -4px 8px rgba(0,0,0,.64) inset;
}
.pop-box01 .input a.btn {
	display: block;
	width: 140px;
	height: 65px;
	background-color: #e43341;
	border-radius: 8px;
	position: relative;
}
.pop-box01 .input a i {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -18px 0 0 -41px;
}
.pop-box01 .input p.prompt {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 470px;
	line-height: 30px;
	font-size: 20px;
	color: #e43341;
	margin-top: 5px;
	margin-left: -235px;
}
.pop-box01 .input p.prompt a {
	display: block;
	font-size: 20px;
	color: #e43341;
	text-decoration: underline;
}
.pop-box01 .text {
	position: absolute;
	top: 0;
	left: 50%;
	width: 520px;
	height: 200px;
	margin-left: -260px;
	font-size: 32px;
	color: #000;
	display: -webkit-box;
	-webkit-box-pack: center;
	-webkit-box-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	display: -webkit-flex;
	-webkit-justify-content: center;
	-webkit-align-items: center;
}
.pop-box02 .text {
	position: absolute;
	top: 0;
	left: 50%;
	width: 520px;
	height: 140px;
	margin-left: -260px;
	font-size: 32px;
	color: #000;
	display: -webkit-box;
	-webkit-box-pack: center;
	-webkit-box-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	display: -webkit-flex;
	-webkit-justify-content: center;
	-webkit-align-items: center;
}

.pop-rule {
	position: absolute;
	top: 5%;
	left: 50%;
	width: 660px;
	height: 76%;
	margin-left: -330px;
	box-sizing: border-box;
	background-color: #fff;
	padding: 10px 0;
}
.pop-rule:before {
	content: '';
	position: absolute;
	top: -30px;
	left: 50%;
	width: 746px;
	height: 56px;
	margin-left: -373px;
	background: url('../images/pop_deco02.png') no-repeat;
}
.pop-rule:after {
	content: '';
	position: absolute;
	bottom: -30px;
	left: 50%;
	width: 746px;
	height: 56px;
	margin-left: -373px;
	background: url('../images/pop_deco02.png') no-repeat;
}
.pop-rule .pop-rule-box {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	overflow: hidden;
	background: url('../images/pop_bg02.png');
}
.pop-rule .pop-rule-box .pop-rule-info {
	width: 100%;
	height: 100%;
	padding: 25px 0;
	box-sizing: border-box;
}
.pop-rule .pop-rule-box .pop-rule-info .pop-rule-item {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	background-color: #fff;
	padding: 50px 20px 30px;
	position: relative;
	overflow-x: hidden;
	overflow-y: auto;
}
.pop-rule .pop-rule-box .pop-rule-info .title {
	position: absolute;
	top: 12px;
	left: 50%;
	margin-left: -65px;
}
.pop-rule .pop-rule-box .pop-rule-info p {
	min-height: 30px;
	line-height: 30px;
	font-size: 24px;
	color: #151515;
}
.pop-rule .pop-rule-box .pop-rule-info p.rule-title {
	font-weight: bold;
}

/*答题结果*/
.pop-answer {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 645px;
	height: 1126px;
	margin: -563px 0 0 -323px;
}
.pop-answer .pop-answer-text {
	position: absolute;
	top: 480px;
	left: 50%;
	width: 430px;
	margin-left: -215px;
}
.pop-answer .pop-answer-text h1 {
	line-height: 40px;
	text-align: center;
	font-size: 26px;
	color: #cc2a1e;
	font-weight: bold;
	margin-bottom: 10px;
}
.pop-answer .pop-answer-text p {
	line-height: 34px;
	font-size: 26px;
	color: #4f4f4f;
	text-indent: 54px;
}
.pop-answer .pop-answer-btn {
	position: absolute;
	bottom: 120px;
	left: 50%;
	margin-left: -230px;
}
.pop-answer.pop-answer-correct {
	background: url('../images/bg_answer_correct.png') no-repeat;
}
.pop-answer.pop-answer-error {
	background: url('../images/bg_answer_error.png') no-repeat;
}


/*动画*/
.anim-home01 {
	transform: translateY(-1334px);
	-webkit-transform: translateY(-1334px);
	animation: anim-home01 .5s ease-out forwards;
	-webkit-animation: anim-home01 .5s ease-out forwards;
}
.anim-home01_1 {
	transform: translateY(-1334px);
	-webkit-transform: translateY(-1334px);
	animation: anim-home01 .5s ease-out forwards .2s;
	-webkit-animation: anim-home01 .5s ease-out forwards .2s;
}
.anim-home03 {
	opacity: 0;
	-webkit-opacity: 0;
	animation: anim-home03 .5s linear forwards;
	-webkit-animation: anim-home03 .5s linear forwards;
}
.anim-home04 {
	transform-origin: 50% 50% 0;
	-webkit-transform-origin: 50% 50% 0;
	animation: anim-home04 1s linear infinite alternate;
	-webkit-animation: anim-home04 1s linear infinite alternate;
}
.anim-next {
	transform: translateY(0);
	-webkit-transform: translateY(0);
	animation: anim-next .5s linear infinite;
	-webkit-animation: anim-next .5s linear infinite;
}

.anim-pop01 {
	width: 0;
	margin-left: 0;
	animation: anim-pop01 .5s linear forwards;
	-webkit-animation: anim-pop01 .5s linear forwards;
}
.anim-pop02 {
	height: 0;
	animation: anim-pop02 .5s linear forwards .2s;
	-webkit-animation: anim-pop02 .5s linear forwards .2s;
}

@keyframes anim-home01 {
	from {transform: translateY(-1334px); -webkit-transform: translateY(-1334px);}
	to {transform: translateY(0); -webkit-transform: translateY(0);}
}
@-webkit-keyframes anim-home01 {
	from {transform: translateY(-1334px); -webkit-transform: translateY(-1334px);}
	to {transform: translateY(0); -webkit-transform: translateY(0);}
}
@keyframes anim-home03 {
	from {opacity: 0; -webkit-opacity: 0;}
	to {opacity: 1; -webkit-opacity: 1;}
}
@-webkit-keyframes anim-home03 {
	from {opacity: 0; -webkit-opacity: 0;}
	to {opacity: 1; -webkit-opacity: 1;}
}
@keyframes anim-home04 {
	from {transform: scale(1); -webkit-transform: scale(1);}
	to {transform: scale(.9); -webkit-transform: scale(.9);}
}
@-webkit-keyframes anim-home04 {
	from {transform: scale(1); -webkit-transform: scale(1);}
	to {transform: scale(.9); -webkit-transform: scale(.9);}
}
@keyframes anim-pop01 {
	from {width 0; margin-left: 0;}
	to {width: 620px; margin-left: -310px;}
}
@-webkit-keyframes anim-pop01 {
	from {width 0; margin-left: 0;}
	to {width: 620px; margin-left: -310px;}
}
@keyframes anim-pop02 {
	from {height: 0}
	to {height: 76%}
}
@-webkit-keyframes anim-pop02 {
	from {height: 0}
	to {height: 76%}
}
@keyframes anim-next {
	from {transform: translateY(0); -webkit-transform: translateY(0);}
	to {transform: translateY(10px); -webkit-transform: translateY(10px);}
}
@-webkit-keyframes anim-next {
	from {transform: translateY(0); -webkit-transform: translateY(0);}
	to {transform: translateY(10px); -webkit-transform: translateY(10px);}
}



/*sprite*/
.sprite {
	background: url('../images/sprite_icon.png') no-repeat;
}
.sprite_pop_close{height:58px;width:58px;background-position:0 0;}
.sprite_next_btn{height:62px;width:76px;background-position:0 -84px;}
.sprite_pop_text03{height:34px;width:80px;background-position:-76px 0;}
.sprite_pop_text02{height:37px;width:82px;background-position:-195px 0;}
.sprite_pop_text05{height:38px;width:82px;background-position:-104px -50px;}
.sprite_pop_text04{height:28px;width:130px;background-position:-101px -111px;}
.sprite_share_btn{height:342px;width:140px;background-position:0 -173px;}
.sprite_pop_text06{height:41px;width:163px;background-position:-294px 0;}
.sprite_pop_text01{height:48px;width:197px;background-position:-197px -51px;}
.sprite_home_btn_rule{height:45px;width:198px;background-position:-156px -239px;}
.sprite_home_btn_award{height:49px;width:198px;background-position:-156px -176px;}
.sprite_award_btn{height:99px;width:424px;background-position:-157px -302px;}
.sprite_home_btn{height:114px;width:460px;background-position:-157px -420px;}
.sprite_over_text02{height:37px;width:460px;background-position:-493px -6px;}
.sprite_answer_btn{height:114px;width:460px;background-position:0 -553px;}
.sprite_answer_btn.over{background-position:-484px -666px;}
.sprite_over_text01{height:197px;width:614px;background-position:-417px -79px;}
.sprite_over_text03{height:355px;width:672px;background-position:-653px -304px;}
.sprite_load_btn {height:99px;width:424px;background-position:0 -681px;}