@charset "gb2312";
body,h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ul,ol,li,form,fieldset,legend,button,input,textarea,th,td,div,input{margin:0;padding:0;word-wrap:break-word;}
body,html,input{font:12px "Microsoft Yahei",arial,\5b8b\4f53,"Helvetica Neue",Helvetica,STHeiTi,sans-serif;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
h1{font-size:34px;}h2{font-size:24px;}h3{font-size:18px;}h4{font-size:16px;}h5{font-size:14px;}h6{font-size:12px;}
input,label,img,th{vertical-align:middle;}
ul,ol,li{list-style:none;}
img{margin: 0;padding: 0;border: none;}
body{overflow: hidden;margin: 0 auto;}
input{-webkit-appearance:none;border:none;outline: none;}

.box{width: 100%;height: 100%;position: relative;}
.common{position: absolute;width:100%;height:100%;left:0;top:0;}
.scale{-webkit-transform-origin:0 0;transform-origin:0 0;width: 640px;height: 1040px;}

.load{background: url(../images/loading.jpg) no-repeat;position:absolute;z-index:99999;background-size:100% auto;}
.loading{position:absolute;left:0;top:68%;margin-top:-1rem;z-index:999999;width:100%;height:100px;}
.loadEffect{position:relative;width:100px;height:100px;-webkit-transform:scale(0.6);margin: 0 auto;}
.loadEffect span{position:absolute;display:inline-block;width:15px;height:15px;border-radius:50%;background:#b89155;-webkit-animation:load 1.04s ease infinite}

.loadEffect span:nth-child(1) {left:0;top:50%;margin-top:-10px;-webkit-animation-delay:.13s;}
.loadEffect span:nth-child(2) {left:14px;top:14px;-webkit-animation-delay:.26s;}
.loadEffect span:nth-child(3) {left:50%;top:0;margin-left:-10px;-webkit-animation-delay:.39s;}
.loadEffect span:nth-child(4) {top:14px;right:14px;-webkit-animation-delay:.52s;}
.loadEffect span:nth-child(5) {right:0;top:50%;margin-top:-10px;-webkit-animation-delay:.65s;}
.loadEffect span:nth-child(6) {right:14px;bottom:14px;-webkit-animation-delay:.78s;}
.loadEffect span:nth-child(7) {bottom:0;left:50%;margin-left:-10px;-webkit-animation-delay:.91s;}
.loadEffect span:nth-child(8) {bottom:14px;left:14px;-webkit-animation-delay:1.04s;}

.cover{background: url(../images/cover.jpg) no-repeat;background-size:100% auto;}
.cover p{position: absolute;}
.cover p:nth-of-type(1){top:204px;left:26px;width:0;height:120px;background:url(../images/fm_1.png) no-repeat;background-size:auto auto;}
.cover p:nth-of-type(2){top:246px;left:69px;width:0;height:200px;background:url(../images/fm_2.png) no-repeat;background-size:auto auto;}
/*.cover p:nth-of-type(3){top:320px;left:125px;width:0;height:180px;background:url(../images/fm_3.png) no-repeat;background-size:auto auto;}*/
.cover p:nth-of-type(4){top:100px;left:25px;width:234px;height:173px;background:url(../images/fm_4.png) no-repeat;background-size:100% auto;}
.cover p:nth-of-type(5){top:555px;left:50%;width:547px;height:185px;margin-left:-273px;background:url(../images/fm_5.png) no-repeat;background-size:100% auto;opacity:0;}
.cover p:nth-of-type(6){top:754px;left:78px;width:199px;height:22px;background:url(../images/fm_6.png) no-repeat;background-size:100% auto;opacity:0;}
.cover p:nth-of-type(7){top:739px;left:295px;width:268px;height:51px;background:url(../images/fm_7.png) no-repeat;background-size:100% auto;opacity:0;}

.arrow{position:absolute;bottom:150px;left:50%;width:39px;height:28px;margin-left:-20px;background-image:url(../images/arrow.png);background-size:100% auto;opacity:0;-webkit-animation:changeArrow 2s ease-out 0s infinite;animation:changeArrow 2s ease-out 0s infinite;}

.wrap_box{height: 100%;overflow-y:auto;-webkit-overflow-scrolling:touch;position: relative;}
.wrapImg{background: url(../images/wrapImg.jpg);height: 10500px;background-size:100% auto;}
.arrow1{position:absolute;top:750px;left:50%;width:39px;height:28px;margin-left:-20px;background-image:url(../images/arrow.png);background-size:100% auto;opacity:0;}
.swiper-slide-active .arrow1{-webkit-animation:topArrow 2s linear 1s 5;animation:topArrow 2s linear 1s 5;}
.hand{position:absolute;left:50%;top:10350px;width:65px;height:80px;margin-left:65px;background-image:url(../images/hand.png);background-size:100% auto;}
.btn1{position:absolute;left:50%;top:10350px;width:232px;height:90px;margin-left:-116px;background-image:url(../images/btn1.png);background-size:100% auto;}
.care{background:url(../images/care.jpg) no-repeat;background-size:100% auto;}

.care ul li{position: absolute;}
.care ul li input{position:absolute;top:0;right:10px;width:40px;height:40px;background:url(../images/checkbox.png) no-repeat;background-size:100% auto;}
.care ul li input.checked{background:url(../images/checked.png) no-repeat;}


.xz ul li.care_2 input {right:15px;}
.xz ul li.care_3 input {top:-5px;}
.xz ul li.care_5 input {right:120px;}
.xz ul li.care_6 input {top:-10px;right:70px;}
.xz ul li.care_7 input {right:30px;}
.xz ul li.care_8 input {top:-10px;right:0;}
.xz ul li.care_9 input {right:20px;}
.xz ul li.care_10 input {top:-20px;right:25px;}
.care ul li.care_1{top:306px;left:78px;width:142px;height:144px;background:url(../images/care_1.png) no-repeat;background-size:100% auto;}
.care ul li.care_2{top:267px;left:277px;width:175px;height:176px;background:url(../images/care_2.png) no-repeat;background-size:100% auto;}
.care ul li.care_3{top:340px;left:448px;width:144px;height:145px;background:url(../images/care_3.png) no-repeat;background-size:100% auto;}
.care ul li.care_4{top:444px;left:42px;width:150px;height:151px;background:url(../images/care_4.png) no-repeat;background-size:100% auto;}
.care ul li.care_5{top:407px;left:202px;width:187px;height:188px;background:url(../images/care_5.png) no-repeat;background-size:100% auto;}
.care ul li.care_6{top:451px;left:381px;width:132px;height:134px;background:url(../images/care_6.png) no-repeat;background-size:100% auto;}
.care ul li.care_7{top:594px;left:76px;width:187px;height:188px;background:url(../images/care_7.png) no-repeat;background-size:100% auto;}
.care ul li.care_8{top:597px;left:255px;width:109px;height:111px;background:url(../images/care_8.png) no-repeat;background-size:100% auto;}
.care ul li.care_9{top:549px;left:389px;width:209px;height:211px;background:url(../images/care_9.png) no-repeat;background-size:100% auto;}
.care ul li.care_10{top:714px;left:297px;width:124px;height:126px;background:url(../images/care_10.png) no-repeat;background-size:100% auto;}

.care_hand{position:absolute;left:225px;top:324px;width:69px;height:85px;background-image:url(../images/care_hand.png);background-size:100% auto;-webkit-animation:pulse1 2s linear 0s infinite;animation:pulse1 2s linear 0s infinite;}
.goPrev{position:absolute;top:859px;left:100px;width:175px;height:74px;background:url(../images/goPrev.png) no-repeat;background-size:100% auto;}
.goNext{display:none;position:absolute;top:859px;right:100px;width:175px;height:74px;background:url(../images/goNext.png) no-repeat;background-size:100% auto;}

#pic_bg{display: none;}
.reChioce{position:absolute;top:820px;left:50%;width:157px;height:50px;margin-left:-78px;background:url(../images/reChioce.png) no-repeat;}

.creatPic .newBg{width:100%;height:auto;}
.creatPic ul {position:absolute;top:330px;left:50%;margin-left:-190px;width:380px;height:330px;display: none;}
.creatPic ul li{height:60px;line-height:60px;vertical-align:middle;font-size:42px;color:#d40004;text-align:center;}

.save{position:absolute;top:750px;left:560px;width:71px;height:70px;background:url(../images/save.png) no-repeat;}

.dianZan{position:absolute;top:684px;left:400px;width:58px;height:77px;background:url(../images/dianZan.png) no-repeat;}

.music{position: absolute;top: 8px;right: 8px;z-index: 1000;width: 40px;height: 40px;background-image: url(../images/musicOn.png);background-repeat: no-repeat;background-size: 40px auto;-webkit-tap-highlight-color: rgba(255, 0, 0, 0);}
.music.on{-webkit-animation: rotate 3s linear 0s infinite; -moz-animation: rotate 3s linear 0s infinite; -ms-animation: rotate 3s linear 0s infinite;animation: rotate 3s linear 0s infinite;}
.music.off{background-image:url(../images/musicOff.png);}

.swiper-slide-active .dianZan {
	-webkit-animation:pulse1 1.5s linear 0s 3;
	animation:pulse1 1.5s linear 0s 3
}

.swiper-slide-active li.care_1,.swiper-slide-active .hand {
	-webkit-animation:pulse1 5s linear 0s infinite;
	animation:pulse1 5s linear 0s infinite
}
.swiper-slide-active li.care_2 {
	-webkit-animation:pulse1 5.2s linear 0s infinite;
	animation:pulse1 5.2s linear 0s infinite
}
.swiper-slide-active li.care_3 {
	-webkit-animation:pulse1 4.5s linear 0s infinite;
	animation:pulse1 4.5s linear 0s infinite
}
.swiper-slide-active li.care_4 {
	-webkit-animation:pulse1 4.8s linear 0s infinite;
	animation:pulse1 4.8s linear 0s infinite
}
.swiper-slide-active li.care_5 {
	-webkit-animation:pulse1 5.3s linear 0s infinite;
	animation:pulse1 5.3s linear 0s infinite
}
.swiper-slide-active li.care_6 {
	-webkit-animation:pulse1 4s linear 0s infinite;
	animation:pulse1 4s linear 0s infinite
}
.swiper-slide-active li.care_7 {
	-webkit-animation:pulse1 5.1s linear 0s infinite;
	animation:pulse1 5.1s linear 0s infinite
}
.swiper-slide-active li.care_8 {
	-webkit-animation:pulse1 3s linear 0s infinite;
	animation:pulse1 3s linear 0s infinite
}
.swiper-slide-active li.care_9 {
	-webkit-animation:pulse1 5.5s linear 0s infinite;
	animation:pulse1 5.5s linear 0s infinite
}
.swiper-slide-active li.care_10 {
	-webkit-animation:pulse1 4.9s linear 0s infinite;
	animation:pulse1 4.9s linear 0s infinite
}

.swiper-slide-active .cover p:nth-of-type(1) {
	-webkit-animation:changeWidth 1s ease-out 0s forwards;
	animation:changeWidth 1s ease-out 0s forwards
}
.swiper-slide-active .cover p:nth-of-type(2) {
	-webkit-animation:changeWidth 1s ease-out 1s forwards;
	animation:changeWidth 1s ease-out 1s forwards
}
.swiper-slide-active .cover p:nth-of-type(3) {
	-webkit-animation:changeWidth 1s ease-out 2s forwards;
	animation:changeWidth 1s ease-out 2s forwards
}
.swiper-slide-active .cover p:nth-of-type(4) {
	-webkit-animation:write 3s ease 0s forwards;
	animation:write 3s ease 0s forwards
}
.swiper-slide-active .cover p:nth-of-type(5) {
	-webkit-animation:smallToBig 1.1s linear 2.5s forwards;
	animation:smallToBig 1.1s linear 2.5s forwards
}
.swiper-slide-active .cover p:nth-of-type(6) {
	-webkit-animation:fadeInLeft .5s linear 3.5s forwards;
	animation:fadeInLeft .5s linear 3.5s forwards
}
.swiper-slide-active .cover p:nth-of-type(7) {
	-webkit-animation:fadeInRight .5s linear 3.5s forwards;
	animation:fadeInRight .5s linear 3.5s forwards
}

@-webkit-keyframes load {
	0% {
		-webkit-transform:scale(1.1);
		opacity:1
	}
	100% {
		-webkit-transform:scale(0.3);
		opacity:.5
	}
}


@-webkit-keyframes changeWidth {
	0% {
	opacity:0;
	width:0
}
100% {
	opacity:1;
	width:400px
}
}
@keyframes changeWidth {
	0% {
	opacity:0;
	width:0
}
100% {
	opacity:1;
	width:400px
}

}@-webkit-keyframes write {
	0% {
	top:100px;
	left:25px
}
25% {
	top:54px;
	left:246px
}
50% {
	top:280px;
	left:100px
}
75% {
	top:160px;
	left:441px
}
100% {
	top:360px;
	left:360px
}
}@keyframes write {
	0% {
	top:100px;
	left:25px
}
25% {
	top:54px;
	left:246px
}
50% {
	top:280px;
	left:100px
}
75% {
	top:160px;
	left:441px
}
100% {
	top:360px;
	left:360px
}
}

@-webkit-keyframes pulse1 {
	0% {
	opacity:.7;
	-webkit-transform:scale3d(1,1,1);
	transform:scale3d(1,1,1)
}
50% {
	opacity:1;
	-webkit-transform:scale3d(1.1,1.1,1.1);
	transform:scale3d(1.1,1.1,1.1)
}
100% {
	opacity:.7;
	-webkit-transform:scale3d(1,1,1);
	transform:scale3d(1,1,1)
}
}@keyframes pulse1 {
	0% {
	opacity:.7;
	-webkit-transform:scale3d(1,1,1);
	-ms-transform:scale3d(1,1,1);
	transform:scale3d(1,1,1)
}
50% {
	opacity:1;
	-webkit-transform:scale3d(1.1,1.1,1.1);
	-ms-transform:scale3d(1.1,1.1,1.1);
	transform:scale3d(1.1,1.1,1.1)
}
100% {
	opacity:.7;
	-webkit-transform:scale3d(1,1,1);
	-ms-transform:scale3d(1,1,1);
	transform:scale3d(1,1,1)
}
}





@-webkit-keyframes changeArrow {
	0% {
	   bottom:150px
	}
	50% {
		opacity:1
	}
	100% {
		opacity:0;
		bottom:250px
	}
}
@keyframes changeArrow {
	0% {
	    bottom:150px
	}
	50% {
		opacity:1
	}
	100% {
		opacity:0;
		bottom:250px
	}
}
@-webkit-keyframes topArrow {
	0% {
	top:750px
}
50% {
	opacity:1
}
100% {
	opacity:0;
	top:650px
}
}@keyframes topArrow {
	0% {
	top:750px
}
50% {
	opacity:1
}
100% {
	opacity:0;
	top:650px
}
}


@-webkit-keyframes smallToBig {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.1,.1,.1);
		transform: scale3d(0.1,.1,.1)
	}

	50%,100% {
		opacity: 1
	}
}

@keyframes smallToBig {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(0.1,.1,.1);
		transform: scale3d(0.1,.1,.1)
	}

	50%,100% {
		opacity: 1
	}
}

@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-200px);
		transform: translateX(-200px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-200px);
		-ms-transform: translateX(-200px);
		transform: translateX(-200px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0)
	}
}

@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(200px);
		transform: translateX(200px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(200px);
		-ms-transform: translateX(200px);
		transform: translateX(200px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0)
	}
}



@-webkit-keyframes rotate {
    from { - webkit - transform: rotate(0deg)
    }
    to { - webkit - transform: rotate(360deg)
    }
}@-moz-keyframes rotating {
    from { - moz - transform: rotate(0deg)
    }
    to { - moz - transform: rotate(360deg)
    }
}
@keyframes rotate {
    from {transform: rotate(0deg)
    }
    to {transform: rotate(360deg)
    }
}