html,body{
	height: 100%;
	width: 100%;
	overflow: hidden;
	padding: 0;
	margin: 0;
	font-family: "webFont";
}
i{font-style:normal;}
*{
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-appearance : none ;
}
.clear{
	clear: both;
}
.hidden{
	display:none;
}

/*@font-face {*/
	/*font-family: "webFont";*/
	/*src: url(http://game.demo.yingxiong.com/font/webfont.ttf) format('truetype');*/
	/*font-style: normal;*/
	/*font-weight: normal;*/
/*}*/
.wrap {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	left: 0;
	top: 0;
	z-index: 11;
	background:url("../images/bg.jpg") no-repeat;
	background-size:cover;
}
.swiper-container,.swiper-slide,.swiper-wrapper {
	height:100%;
	width: 100%;
	position:relative;
	z-index:101;
}
/*.content_box{*/
	/*overflow:hidden;*/
	/*width: 18.03125rem;*/
	/*height: 22.8125rem;*/
	/*background:url("../images/con_bg.png");*/
	/*background-size: 100% 100%;*/
	/*text-align: center;*/
	/*position: absolute;*/
	/*left: 50%;*/
	/*top: 50%;*/
	/*margin-top: -12.5rem;*/
	/*margin-left: -9.015625rem;*/
/*}*/
.page1 .content_box .title{
	width: 16.5625rem;
	height: 8.0625rem;
	margin: 0 auto;
	margin-top: 2rem;
}
.page1 .content_box .title img{
	width: 16.5625rem;
	height: 8.0625rem;
}
.page1 .content_box .light{
	width: 7.625rem;
	height: 8.9375rem;
	margin: 0 auto;
	margin-top: -1rem;
}
.page1 .content_box .light img{
	width:7.625rem;
	height: 8.9375rem;
}
.page1 .content_box .box1{
	 width: 12.34375rem;
	 height: 0.96875rem;
	 line-height: 0.96875rem;
	 text-align: center;
	 margin: 0 auto;
	 margin-top: .4rem;
	 background: url(../images/box1.png) no-repeat;
	 background-size: 100% 100%;
	 font-size: 0.5875rem;
	 letter-spacing: -0.05rem;
}
.content_box .box2{
	position: absolute;
	bottom: .5rem;
	left: 50%;
	width: 15rem;
	height: 2.53125rem;
	line-height: 2.53125rem;
	text-align: center;
	margin: 0 auto;
	margin-left: -7.5rem;
	background: url(../images/box2.png) no-repeat;
	background-size: 100% 100%;
	font-size: 1.5165625rem;
	letter-spacing: -0.05rem;
}
.content_box .box2:before{
	display: inline-block;
	content: "";
	width: 0.75rem;
	height: 1.0625rem;
	background: url(../images/next.png) no-repeat;
	background-size: 100% 100%;
	margin-right: .4rem;
}
.content_box .box2:after{
	display: inline-block;
	content: "";
	width: 0.75rem;
	height: 1.0625rem;
	background: url(../images/next.png) no-repeat;
	background-size: 100% 100%;
	margin-left: .4rem;
}
.page2 .content_box .box3{
	width: 11.28125rem;
	height: 2.5rem;
	line-height: 2.5rem;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 1.25rem;
	background: url(../images/box3.png) no-repeat;
	background-size: 100% 100%;
	font-size: 1.316875rem;
}
.page2 .content_box .box3:first-child{margin-top:2.1875rem;}
.page2 .content_box .box3.active{
	background: url(../images/box3-1.png) no-repeat;
	background-size: 100% 100%;
}
.page3 .content_box .zs{
	width: 9.3125rem;
	height: 10.875rem;
	margin: 0 auto;
	margin-top: -6.2rem;
}
.page3 .content_box .zs img{
	width: 9.3125rem;
	height:10.875rem;
}
.page3 .content_box .name{
	font-size: 1.316875rem;
	margin-top: 6rem;
	margin-bottom: 0;
}
.page3 .content_box .name_input{
	width: 12.1875rem;
	height: 2.5rem;
	margin: 0 auto;
}
.page3 .content_box .name_input input{
	width: 12.1875rem;
	height: 2.5rem;
	border: none;
	outline: none;
	border-bottom: 4px solid #231815;
	font-size: 1.2rem;
	text-align: center;
	font-family: "webfont";
}
/*.page4{*/
	/*background:url("../images/bg.jpg") no-repeat;*/
	/*background-size:cover;*/
/*}*/
.page4 .content_box {
	overflow: inherit!important;
	width: 18.03125rem;
	height: 17rem!important;
}
.page4 .content_box .zs{
	width: 9rem;
	height: 7.913rem;
	margin: 0 auto;
	margin-top: -2rem;
}
.page4 .content_box .zs img{
	width: 9rem;
	height: 7.913rem;
}
.page4 .content_box .type_info{
	font-size: 1.40625rem;
	margin-top: 1rem;
	padding: 0 1.5rem;
}
.page4 .content_box .txt{
	font-size: 1rem;
	padding: 0 4rem;
}

.page4 .qrcode{
	position: absolute;
	left: 50%;
	bottom:.5rem;
	width: 4.8125rem;
	height: 4.8125rem;
	margin-left: -2.40625rem;
}
.page4 .qrcode img{
	width:4.8125rem;
	height:4.8125rem;
}
.page4 .qrcode_txt{
	position: absolute;
	left: 0;
	bottom: -.3rem;
	width: 100%;
	text-align: center;
	font-size: .7rem;
}
.page5 .again{
	width: 15.40625rem;
	height: 2.34375rem;
	line-height: 2.34375rem;
	background: url(../images/box4.png);
	background-size: 100% 100%;
	position: absolute;
	left: 50%;
	top: 62.5%;
	/*margin-top: 6.5rem;*/
	margin-left: -7.703125rem;
	text-align: center;
	font-size: 1.158125rem;
}
.page5 .save{
	width: 100%;
	position: absolute;
	left: 0;
	top: 73%;
	text-align: center;
	font-size: 0.751875rem;
}
.page5 .jp_img{
	width:100%;
	height:100%;
}
.from{
	position: absolute;
	z-index: 100;
	bottom: 0;
	font-size: 0.829375rem;
	left: 0;
	width: 100%;
	/* margin-left: -8.2rem; */
	padding-bottom: .05rem;
	text-align: center;
	/* border-bottom: 1px solid #333; */
}
.from:after{
	width: 16.96875rem;
	height: 1px;
	display: inline-block;
	content: "";
	background: url(../images/line.png);
	background-size: 100% 100%;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -8.484375rem;
}
/* animation */
@keyframes icon-bounce {
	0%, 20% {
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	5% {
		-moz-transform: rotate(15deg);
		-ms-transform: rotate(15deg);
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg);
	}

	10% {
		-moz-transform: rotate(-15deg);
		-ms-transform: rotate(-15deg);
		-webkit-transform: rotate(-15deg);
		transform: rotate(-15deg);
	}

	15% {
		-moz-transform: rotate(5deg);
		-ms-transform: rotate(5deg);
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg);
	}

	17% {
		-moz-transform: rotate(-5deg);
		-ms-transform: rotate(-5deg);
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
}
@-webkit-keyframes icon-bounce {
	0%, 20% {
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	5% {
		-moz-transform: rotate(15deg);
		-ms-transform: rotate(15deg);
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg);
	}

	10% {
		-moz-transform: rotate(-15deg);
		-ms-transform: rotate(-15deg);
		-webkit-transform: rotate(-15deg);
		transform: rotate(-15deg);
	}

	15% {
		-moz-transform: rotate(5deg);
		-ms-transform: rotate(5deg);
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg);
	}

	17% {
		-moz-transform: rotate(-5deg);
		-ms-transform: rotate(-5deg);
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
}
@-moz-keyframes icon-bounce {
	0%, 20% {
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	5% {
		-moz-transform: rotate(15deg);
		-ms-transform: rotate(15deg);
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg);
	}

	10% {
		-moz-transform: rotate(-15deg);
		-ms-transform: rotate(-15deg);
		-webkit-transform: rotate(-15deg);
		transform: rotate(-15deg);
	}

	15% {
		-moz-transform: rotate(5deg);
		-ms-transform: rotate(5deg);
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg);
	}

	17% {
		-moz-transform: rotate(-5deg);
		-ms-transform: rotate(-5deg);
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
}
@-o-keyframes icon-bounce {
	0%, 20% {
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	5% {
		-moz-transform: rotate(15deg);
		-ms-transform: rotate(15deg);
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg);
	}

	10% {
		-moz-transform: rotate(-15deg);
		-ms-transform: rotate(-15deg);
		-webkit-transform: rotate(-15deg);
		transform: rotate(-15deg);
	}

	15% {
		-moz-transform: rotate(5deg);
		-ms-transform: rotate(5deg);
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg);
	}

	17% {
		-moz-transform: rotate(-5deg);
		-ms-transform: rotate(-5deg);
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
}
.createbtn {
	-webkit-animation: icon-bounce 3s infinite;
	-moz-animation: icon-bounce 3s infinite;
	-o-animation: icon-bounce 3s infinite;
	animation: icon-bounce 3s infinite;
}
@keyframes dialogLoading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@-webkit-keyframes dialogLoading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}