@charset "utf-8";

*{margin:0;	padding:0;}
html {-ms-touch-action:none;} /* 阻止windows Phone 的默认触摸事件 */
ul {list-style:none;}
body {
	width:100%;
	*cursor:default;
	overflow:hidden;
	font:16px/1.5 "Microsoft YaHei",Helvetica,STHeiti STXihei,Microsoft JhengHei,Arial;
}
#pageContain {
	overflow:hidden;
}
.page {
	width:100%;
	height:100%;
	overflow:hidden;
	position:absolute;
	background:#F3F4EC;
	/*top:0;
	left:0;*/
}
.contain {
	display:none;
	width:100%;
	height:100%;
	overflow:hidden;
	position:relative;
}
.contain ul {position:absolute; width:100%; height:100%; margin:0; padding:0;}
.contain li img,.contain li span{position:absolute; z-index:10;}
.current .contain,.slide .contain {
	display:block;
}
.current {
	display:block;
	z-index:1;
}
.slide {
	display:block;
	z-index:2;
}
.swipe {
	display:block;
	z-index:3;
	transition-duration:0ms !important;
	-webkit-transition-duration:0ms !important;
}

/* 页面导航 */
#navBar {
	z-index:3;
	position:absolute;
	top:10%;
	right:3%;
}
#navBar .active {
	background:#ccc;
}
#navBar li {
	cursor:pointer;
	margin-bottom:10px;
	transition:all .7s ease;
	border-radius:50%;
	line-height:0.3rem;
	text-align:center;
	width:0.3rem;
	height:0.3rem;
}

/* 页面加载 */
.loading{ width:100%; height:100%; background:#fff; position:absolute; margin:0 auto; z-index:10000;}
.loading img{ position:absolute; top:50%; left:50%; margin-top:-47px; margin-left:-78px;  z-index:10001;}

/* 音乐标志 */
#music_btn{position:fixed; width:0.5rem; height:auto; top:0.1rem; right:0.1rem; z-index:999; cursor:pointer;}

/* 箭头 */
.arrow_up {position:fixed; background-image:url("../images/arrow_u.png"); background-size:100%; bottom:0.1rem; left:50%; width:0.4rem; height:0.33rem; z-index:9999;
-webkit-transform:translateX(-50%);
transform:translateX(-50%);
-webkit-animation:arrow_up 1s linear 0s infinite alternate;
animation:arrow_up 1s linear 0s infinite alternate;
}
@-webkit-keyframes arrow_up {
from {bottom:0.1rem;}
to {bottom:0.3rem;}
}
@keyframes arrow_up {
from {bottom:0.1rem;}
to {bottom:0.3rem;}
}

/* 页面背景 */
.page1{background:url(../images/001.jpg) no-repeat 50%;}
.page2{background:url(../images/002.jpg) no-repeat 50%;}
.page3{background:url(../images/003.jpg) no-repeat 50%;}
.page4{background:url(../images/004.jpg) no-repeat 50%;}
.page5{background:url(../images/005.jpg) no-repeat 50%;}
.page6{background:url(../images/006.jpg) no-repeat 50%;}
.page7{background:url(../images/007.jpg) no-repeat 50%;}
.page8{background:url(../images/008.jpg) no-repeat 50%;}
/*.page1,.page2,.page3,.page4,.page5{
-webkit-background-size:cover;
-moz-background-size:cover;
-ms-background-size:cover;
-o-background-size:cover;
background-size:cover;
}*/
.page1,.page2,.page3,.page4,.page5,.page6,.page7,.page8{
filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";
-webkit-background-size:100% 100%;
-moz-background-size:100% 100%;
-ms-background-size:100% 100%;
-o-background-size:100% 100%;
background-size:100% 100%;
}

/* 自适应框架（设计图宽度） */
body{
	max-width:6.4rem;
	margin:0 auto;
}
body *{
	max-width:6.4rem;
}

/* 扩展动画 */
.myResize {
	-webkit-animation-name:myResize;
	animation-name:myResize;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
}

@-webkit-keyframes myResize{
0%  {transform: scale(0,1)}
100% {transform: scale(1,1)}
}

@keyframes myResize{
0%  {transform: scale(0,1)}
100% {transform: scale(1,1)}
}

.myRotate{
	-webkit-animation-name:myRotate;
	animation-name:myRotate;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
}

@-webkit-keyframes myRotate{
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}

@keyframes myRotate{
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}

.myRotateH{
	-webkit-animation-name:myRotateH;
	animation-name:myRotateH;
	-webkit-animation-timing-function:ease-in;
	animation-timing-function:ease-in;
}

@-webkit-keyframes myRotateH{
0% {transform:rotate(0deg); opacity:0;}
99% {transform:rotate(360deg); opacity:1;}
100% {opacity:0;}
}

@keyframes myRotateH{
0% {transform:rotate(0deg); opacity:0;}
99% {transform:rotate(360deg); opacity:1;}
100% {opacity:0;}
}

.myMoveRight{
	-webkit-animation-name:myMoveRight;
	animation-name:myMoveRight;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
}

@-webkit-keyframes myMoveRight{
0% {transform: translate3d(0, 0, 0);}
50% {transform: translate3d(50px, 0, 0);}
100% {transform: translate3d(0, 0, 0);}
}

@keyframes myMoveRight{
0% {transform: translate3d(0, 0, 0);}
50% {transform: translate3d(50px, 0, 0);}
100% {transform: translate3d(0, 0, 0);}
}

.myMoveLeft{
	-webkit-animation-name:myMoveLeft;
	animation-name:myMoveLeft;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
}

@-webkit-keyframes myMoveLeft{
0% {transform: translate3d(0, 0, 0);}
50% {transform: translate3d(-50px, 0, 0);}
100% {transform: translate3d(0, 0, 0);}
}

@keyframes myMoveLeft{
0% {transform: translate3d(0, 0, 0);}
50% {transform: translate3d(-50px, 0, 0);}
100% {transform: translate3d(0, 0, 0);}
}

/*微信分享*/
#mcover{
display:none;
position:fixed;
width:100%;
height:100%;
background:rgba(0, 0, 0, 0.7);
z-index:10000;
}
#mcover img{
position:fixed;
top:0.1rem;
width:6.4rem;
height:auto;
z-index:10001;
}
.wx_btn{position:relative; z-index:9999; cursor:pointer;}

.sz_answer{ background:rgba(0,0,0,0.5); z-index:999;}
.btn_next,.btn_end,.btn_pic,.btn_yes,.btn_no{ cursor:pointer;}
.btn_yes{ position:relative; width:2rem; height:0.5rem;}
.btn_yes .btn_select{position:absolute; right:0; top:0; width:0.5rem; height:0.41rem;}
.point{ font-weight:normal; font-size:0.7rem;}
.none{ display:none;}

@-webkit-keyframes bounce-down {
    25% {
        -webkit-transform: translateY(-6px);
    }
    50%, 100% {
        -webkit-transform: translateY(0);
    }
    75% {
        -webkit-transform: translateY(6px);
    }
}
 
@keyframes bounce-down {
    25% {
        transform: translateY(-6px);
    }
    50%, 100% {
        transform: translateY(0);
    }
    75% {
        transform: translateY(6px);
    }
}
 
.animate-bounce-down{
    -webkit-animation: bounce-down 1.5s linear infinite;
    animation: bounce-down 1.5s linear infinite;
}