html,body{
	font-size: calc( 100vw/ 19.2 );
	color: #333;
	font-family: 'Microsoft YaHei','华文细黑','平方';
	-moz-user-select:none;
	-webkit-user-select:none;
	user-select:none;
	overflow: hidden;
	background: #3a4e5e url(../images/happy/bg.png) center center no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
}

.index-wrap{
	width: 100%;
	height: 100;
	/*display: none;*/
}
.index-wrap svg{
	width: 19.2rem;
	height: 10.8rem;
}
.second-wrap{
	width: 100%;
	height: 100%;
	display: none;
}
.second-wrap p{
	color: #fff;
	font-size: 0.24rem;
	text-align: center;
	margin-top: 1rem;
}

.second-wrap .circle1{
	width: 1.28rem;
	height: 1.72rem;
	position: absolute;
	top: 7.7rem;
	left: 4.8rem;
}

.second-wrap .circle2{
	width: 1.28rem;
	height: 1.72rem;
	position: absolute;
	top: 7.7rem;
	left: 8.95rem;
}

.second-wrap .circle3{
	width: 1.28rem;
	height: 1.72rem;
	position: absolute;
	top: 7.7rem;
	left: 13.1rem;
}

.second-wrap .nextBtn{
	width: 2.32rem;
	height: 0.74rem;
	position: absolute;
	top: 8.7rem;
	right: 1rem;
	cursor: pointer;
	display: none;
}

.second-wrap .airball{
	width: 1.3rem;
	height: 2.6rem;
	position: absolute;
	top: 3.4rem;
	left: 8.8rem;
	font-size: 0.18rem;
	color: #fff;
}
.second-wrap .airball img{
	width: 1.28rem;
	height: 2.53rem;
	cursor: pointer;
}
.second-wrap .airball .txt{
	text-align: center;
	width: 100%;
	position: absolute;
	top: 0.6rem;
}

.third-wrap{
	width: 100%;
	height: 100%;
	display: none;
}

.third-wrap p{
	font-size: 0.22rem;
	text-align: center;
	color: #fff;
	margin-top: 1.38rem;
	margin-bottom: 0.7rem;
}
.third-wrap .desc{
	display: block;
	margin: 0 auto;
	width: 11.38rem;
}

.third-wrap .needle{
	width: 1.18rem;
	height: 1.78rem;
	position: absolute;
	top: 5.6rem;
	left: 3.4rem;
}
.third-wrap .next{
	position: absolute;
	top: 8.7rem;
	left: 8.6rem;
	width: 2.32rem;
}
.third-wrap .done{
	width: 2.32rem;
	position: absolute;
	top: 8.7rem;
	left: 14.6rem;
}
.third-wrap .circle4{
	position: absolute;
	width: 1.19rem;
	top: 7.38rem;
	left: 9.15rem;
	z-index: 9999;
}

.third-wrap .airball{
	width: 1.3rem;
	height: 2.6rem;
	position: absolute;
	top: 5.05rem;
	left: 8.8rem;
	font-size: 0.18rem;
	color: #fff;
}
.third-wrap .airball .txt{
	text-align: center;
	width: 100%;
	position: absolute;
	top: 0.6rem;
}

.third-wrap .airball img{
	width: 1.28rem;
	height: 2.53rem;
	cursor: pointer;

}

.fourth-wrap{
	width: 100%;
	height: 100%;
	display: none;
}
.fourth-wrap textarea{
	width: 13.729rem;
	height: 1.89rem;
	border-radius: 0.3rem;
	background: #506678;
	position: absolute;
	left: 2.34rem;
	top: 4.9rem;
	outline: none;
	font-size: 0.24rem;
	padding: 0.4rem 0.5rem;
	color: #9ca7af;
	border: none;
	color: #8894a0;
}
textarea::placeholder{
	color:#8894a0;
}
.like-text-box-border{
	width: 14.54rem;
	height: 2.3rem;
	border-radius: 0.3rem;
	border:0.1rem solid rgba(0,0,0,.16);
	margin: 1.3rem auto 0 auto;
}
.fourth-wrap .like-text-box{
	width: 14.54rem;
	height: 1.94rem;
	border-radius: 0.2rem;
	background: #213545;
	text-align: center;
	color: #fff;
	font-size: 0.24rem;
	padding-top: 0.36rem;
	overflow: auto;
}
.fourth-wrap .done{
	width: 2.32rem;
	position: absolute;
	top: 8.7rem;
	left: 8.45rem;
	cursor: pointer;
}

.fifth-wrap{
	width: 100%;
	height: 100%;
	display: none;
}
.fifth-wrap p{
	text-align: center;
	font-size: 0.24rem;
	color: #fff;
	margin-top: 0.93rem;
}
.fifth-wrap .done{
	width: 2.32rem;
	position: absolute;
	top: 8.7rem;
	left: 8.45rem;
	cursor: pointer;
}
.fifth-wrap .airballBox{
	width: 12.75rem;
	height: 3.6rem;
	position: absolute;
	top: 4.08rem;
	left: 3.85rem;
	color: #fff;
	font-size: 0.3rem;
}
.fifth-wrap .airballBox .ball{
	width: 2.55rem;
	height: 100%;
	float: left;
	position: relative;
}
.fifth-wrap .airballBox .ball img{
	width: 1.28rem;
}
.fifth-wrap .airballBox .ball li{
	list-style: none;
	font-size: 0.22rem;
	width: 1.5rem;
	margin-top: 0.7rem;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
}
.fifth-wrap .airballBox .num{
	width: 0.52rem;
	height: 0.52rem;
	line-height: 0.52rem;
	text-align: center;
	background: #213545;
	position: absolute;
	bottom: 0;
	left: 0.6rem;
	border-radius: 100%;
}
.fifth-wrap .txt-box{
	width: 7.67rem;
	height: 0.87rem;
	position: absolute;
	top: 2.57rem;
	left: 5.6rem;
}
.fifth-wrap .txt-box .left-arrow{
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	width: 0.86rem;
}
.fifth-wrap .txt-box .right-arrow{
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	width: 0.86rem;
}
.fifth-wrap .txt-box .txt{
	width: 5.35rem;
	height: 0.6rem;
	overflow: hidden;
	margin: 0.14rem auto 0;
}
.fifth-wrap .txt-box .txt ul{
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.fifth-wrap .txt-box ul li{
	list-style: none;
	float: left;
	margin-left: 0.05rem;
	margin-right: 0.05rem;
	height: 0.2rem;
	border-radius: 0.3rem;
	background: #213545;
	text-align: center;
	line-height: 0.2rem;
	font-size: 0.22rem;
	color: #fff;
	padding: 0.2rem 0.35rem;
}
.sixth-wrap{
	width: 100%;
	height: 100%;
	color: #fff;
	text-align: center;
	display: none;
}
.sixth-wrap p:first-child{
	margin-top: 0.6rem;
	font-size: 0.24rem;

}
.sixth-wrap p:nth-child(2){
	width: 10rem;
	overflow: auto;
	height: 1rem;
	margin: 0 auto 0.5rem;
	font-size: 0.18rem;
	padding: 0.2rem;
	background: #213545;
	border-radius: 0.3rem;
}
.sixth-wrap .table td{
	border: 1px solid #fff;
}
.sixth-wrap .table{
	width: 6.95rem;
    height: 3.65rem;
	font-size: 0.24rem;
	border: 1px solid #fff;
	text-align: center;
	border-collapse: collapse;
	margin: 0 auto;
}
.sixth-wrap .typeText{
	font-size: 0.24rem;
	margin-top: 0.3rem;
	margin-bottom: 0.3rem;
	line-height: 0.7rem;
}
.sixth-wrap .typeText .bage{
	display: inline-block;
	width: 2.8rem;
	height: 0.7rem;
	border-radius: 0.45rem;
	border: 0.1rem solid rgba(0,0,0,.16);
	text-align: center;
	position: relative;
	margin-left: 0.55rem;
}
.sixth-wrap .typeText .bage:after{
	content:'';
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 0.35rem;
	background: #213545;
	margin-top: -0.7rem;

}
.sixth-wrap .typebtn{
	cursor: pointer;
}

.seventh-wrap {
	width: 100%;
	height: 100%;
	color: #fff;
	text-align: center;
	display: none;
}
.seventh-wrap .typeText{
	font-size: 0.24rem;
	margin-top: 0.6rem;
	line-height: 0.82rem;
}
.seventh-wrap .typeText .bage{
	display: inline-block;
	width: 3.88rem;
	height: 0.82rem;
	border-radius: 0.55rem;
	border: 0.1rem solid rgba(0,0,0,.16);
	text-align: center;
	position: relative;
	margin-left: 0.55rem;
	font-size: 0.3rem;
}

.seventh-wrap .typeText .bage:after{
	content:'';
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 0.41rem;
	background: #213545;
	margin-top: -0.82rem;
}

.seventh-wrap .content{
	width: 10rem;
	height: 3rem;
	background: #213545;
	border-radius: 0.3rem;
	position: absolute;
	top: 3.52rem;
	left: 4.6rem;
	font-size: 0.22rem;
	overflow: auto;
	/*opacity:0;*/
	transition: all 1s ease;
}
.seventh-wrap .content ul{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	list-style: none;
	text-align: left;
	overflow: hidden;
}
.seventh-wrap .content ul li{
	width: 8.4rem;
	padding: 0.3rem 0.8rem;
	float: left;
	background: #213545;
	position: absolute;
	top: 0;
	left: 0;
}
.seventh-wrap .content ul li:first-child{
	z-index: 3;
}
.seventh-wrap .content ul li:nth-child(2){
	z-index: 2;
}


.seventh-wrap .occupation{
	width: 10rem;
	height: 1.52rem;
	background: #213545;
	position: absolute;
	top: 6.93rem;
	left: 4.6rem;
	border-radius: 0.3rem;
	font-size: 0.22rem;
	text-align: center;
}

.seventh-wrap .menu{
	width: 10rem;
	height: 0.68rem;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	margin-top: 1rem;
}

.seventh-wrap .menu li{
	width: 2rem;
	height: 0.48rem;
	border-radius: 0.48rem;
	border: 0.1rem solid rgba(0,0,0,.16);
	text-align: center;
	line-height: 0.48rem;
	font-size: 0.22rem;
	float: left;
	opacity: 0.5;
	cursor: pointer;

}
.seventh-wrap .menu li:after{
	content:'';
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 0.24rem;
	background: #213545;
	margin-top: -0.48rem;
}

.seventh-wrap .menu li:nth-child(2){
	margin-left: 1.7rem;
	margin-right: 1.7rem;
}
.seventh-wrap .menu li.active{
	opacity: 1;
}

.cursor{
	cursor: url('../images/happy/cur.ico'),pointer;
}

.over{
	transition: all .3s ease;
	transform: scale(1.2);
}