body { width: 100%; overflow: hidden; }

.hide { display: none; }

.page { width: 100%; height: 100%; position: absolute; text-align: center; }

.page .wrap { width: 100%; }

.page .upIco { height: auto; width: 25px; position: absolute; left: 50%; top: 90%; margin-left: -12px; }

.page-1-1 { background:#b9e7ee; }

.page-2-1 { background:#f7f8fd;}

.page-3-1 { background:#98c7ff;}

.page-4-1 { background:#fd6f6e;}

.page-5-1 { background:#0bc899;}

.page-6-1 { background:#71db79;}

.page-7-1 { background:#e4639a;}

.page-8-1 { background:#ff47a6;}

.page-9-1 { background:#f47b51;}

.page-10-1 { background:#1a94ff;}

.page-11-1 { background:#ff5454;}

.page-12-1 { background:#ffa05b;}

.page-13-1 { background:#397adb;}

.page-current { z-index: 1;}

.page-1-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-1-1 .could { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 22%;}
.page-1-1 a{ display:inline-block;}
.page-1-1 .btn1 { width:38%; position: absolute; left: 6%; top: 25%; display:inline-block;}
.page-1-1 .btn2 { width:38%; position: absolute; right: 6%; top: 25%; display:inline-block;}
.page-1-1 .btn3 { width:38%; position: absolute; left: 50%; margin-left:-19%; top: 25%; margin-top:45%; display:inline-block;}
.page-1-1 .btn1 img { width:100%;}
.page-1-1 .btn2 img { width:100%;}
.page-1-1 .btn3 img { width:100%;}
.page-1-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}
.page-1-1 .ren { width:30%; position: absolute; right: 5%; bottom:13%;}

.page-2-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-2-1 .img_1 { width: 70%; position: absolute; left: 50%; top: 18%; margin-left:-35%;}
.page-2-1 .bottom { width:100%; position: absolute; left: 0; bottom:-5%;}

.page-3-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-3-1 .bg { width: 100%; position: absolute; left: 0; top: 22%;}
.page-3-1 .img_1 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-3-1 .img_2 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-3-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-4-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-4-1 .bg { width: 100%; position: absolute; left: 0; top: 22%;}
.page-4-1 .img_1 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-4-1 .img_2 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-4-1 .img_3 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-4-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-5-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-5-1 .img_1 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-5-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-6-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-6-1 .img_1 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-6-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-7-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-7-1 .img_1 { width: 100%; position: absolute; left: 0; top: 10%;}
.page-7-1 .ren1 { width:100%; position: absolute; left: 0; bottom:0;}
.page-7-1 .ren2 { width:100%; position: absolute; left: 0; bottom:0;}

.page-8-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-8-1 .img_1 { width: 90%; position: absolute; left: 0; top: 13%;}
.page-8-1 .img_2 { width: 100%; position: absolute; left: 0; top: 14%;}
.page-8-1 .bottom { width:100%; position: absolute; left: 0; bottom:-8%;}

.page-9-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-9-1 .img_1 { width: 100%; position: absolute; left: 0; top: 20%;}
.page-9-1 .img_2 { width: 100%; position: absolute; left: 0; top: 16%;}
.page-9-1 .img_3 { width: 100%; position: absolute; left: 0; top: 16%; -webkit-animation:moveFloat 3s ease infinite 1s; animation:moveFloat 3s ease infinite 1s;}
.page-9-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-10-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-10-1 .img_1 { width: 100%; position: absolute; left: 0; top: 19%;}
.page-10-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-11-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-11-1 .img_1 { width: 100%; position: absolute; left: 0; top: 18%;}
.page-11-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-12-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-12-1 .img_1 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-12-1 .img_2 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-12-1 .img_3 { width: 100%; position: absolute; left: 0; top: 22%;}
.page-12-1 .bee { width:100%; position: absolute; left: 0; bottom:10%; -webkit-animation:moveFloat 1s ease infinite; animation:moveFloat 1s ease infinite;}
.page-12-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.page-13-1 .title { width:86%; position: absolute; left: 50%; margin-left:-43%; top: 6%;}
.page-13-1 .img_1 { width: 100%; position: absolute; left: 0; top: 18%;}
.page-13-1 .btn { width: 46%; display:inline-block; left:50%; margin-left:-23%; position: absolute; bottom: 15%;}
.page-13-1 .btn img{ width:100%;}
.page-13-1 .bottom { width:100%; position: absolute; left: 0; bottom:0;}

.moveFloat{-webkit-animation:moveFloat 3s ease infinite; animation:moveFloat 3s ease infinite;}
@-webkit-keyframes moveFloat {
	0% {
	-webkit-transform:translateY(0%);
}
50% {
	-webkit-transform:translateY(10%);
}
100% {
	-webkit-transform:translateY(0%);
}
}
@keyframes moveFloat {
	0% {
	-webkit-transform:translateY(0%);
	transform:translateY(0%);
}
50% {
	-webkit-transform:translateY(10%);
	transform:translateY(10%);
}
100% {
	-webkit-transform:translateY(0%);
	transform:translateY(0%);
}
}



.layermbox {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	z-index:19891014
}
.layermmain,.laymshade {
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%
}
.layermbtn span,.layermchild {
	display:inline-block;
	position:relative
}
.laymshade {
	background-color:rgba(0,0,0,.5);
	pointer-events:auto
}
.layermmain {
	display:table;
	font-family:Helvetica,arial,sans-serif;
	pointer-events:none
}
.layermmain .section {
	display:table-cell;
	vertical-align:middle;
	text-align:center
}
.layermchild {
	text-align:left;
	background-color:#fff;
	font-size:14px;
	border-radius:6px;
	box-shadow:0 0 8px rgba(0,0,0,.1);
	pointer-events:auto;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:.18s;
	animation-duration:.18s
}
.layermborder {
	border:1px solid #999
}
@-webkit-keyframes bounceIn {
	0% {
	opacity:0;
	-webkit-transform:scale(.5);
	transform:scale(.5)
}
100% {
	opacity:1;
	-webkit-transform:scale(1);
	transform:scale(1)
}
}.layermanim {
	animation-name:bounceIn;
	-webkit-animation-name:bounceIn
}
.layermbox0 .layermchild {
	max-width:260px;
	min-width:150px
}
.layermbox1 .layermchild {
	border:none;
	border-radius:0
}
.layermbox2 .layermchild {
	width:auto;
	max-width:260px;
	min-width:40px;
	border:none;
	background-color:rgba(0,0,0,.6);
	color:#fff
}
.layermchild h3 {
	padding:0 45px 0 10px;
	height:50px;
	line-height:50px;
	font-size:16px;
	font-weight:400;
	border-radius:5px 5px 0 0;
	border-bottom:1px solid #EBEBEB
}
.layermbtn span,.layermchild h3 {
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap
}
.layermcont {
	padding:20px 15px;
	line-height:22px;
	border-radius:5px
}
.layermbox1 .layermcont {
	padding:0
}
.layermbox2 .layermcont {
	text-align:center;
	padding:30px 30px 0;
	line-height:0
}
.layermbox2 .layermcont i {
	width:1.5rem;
	height:1.5rem;
	margin-left:8px;
	display:inline-block;
	background-color:#fff;
	border-radius:100%;
	-webkit-animation:bouncedelay 1.4s infinite ease-in-out;
	animation:bouncedelay 1.4s infinite ease-in-out;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both
}
@-webkit-keyframes bouncedelay {
	0%,100%,80% {
	-webkit-transform:scale(0)
}
40% {
	-webkit-transform:scale(1)
}
}@keyframes bouncedelay {
	0%,100%,80% {
	transform:scale(0);
	-webkit-transform:scale(0)
}
40% {
	transform:scale(1);
	-webkit-transform:scale(1)
}
}.layermbox2 .layermcont i:first-child {
	margin-left:0;
	-webkit-animation-delay:-.32s;
	animation-delay:-.32s
}
.layermbox2 .layermcont i.laymloadtwo {
	-webkit-animation-delay:-.16s;
	animation-delay:-.16s
}
.layermbox2 .layermcont>div {
	line-height:22px;
	padding-top:7px;
	margin-bottom:20px;
	font-size:14px
}
.layermbtn {
	position:relative;
	height:40px;
	line-height:40px;
	font-size:0;
	text-align:center;
	border-top:1px solid #EBEBEB
}
.layermbtn span {
	width:50%;
	text-align:center;
	font-size:14px;
	cursor:pointer;
	border-radius:0 5px 0 0
}
.layermbtn span:first-child {
	height:39px;
	background-color:#fff;
	border-radius:0 0 0 5px
}
.layermbtn:before {
	content:'\20';
	position:absolute;
	width:1px;
	height:39px;
	left:50%;
	top:0;
	background-color:#EBEBEB
}
.layermend {
	position:absolute;
	right:7px;
	top:10px;
	width:30px;
	height:30px;
	border:0;
	font-weight:400;
	background:0 0;
	cursor:pointer;
	-webkit-appearance:none;
	font-size:30px
}
.layermend::after,.layermend::before {
	position:absolute;
	left:5px;
	top:13px;
	content:'';
	width:20px;
	height:2px;
	background-color:rgba(0,0,0,.3);
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	border-radius:3px
}
.layermend::after {
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg)
}