html, body, menu, ul, ol, li, p, div, form, h1, h2, h3, h4, h5, h6, img, a img, input, button, textarea, fieldset{ padding: 0; margin: 0; border: 0;font-family:"\5FAE\8F6F\96C5\9ED1"; }
ul, ol, li { list-style: none }
h1, h2, h3, h4, h5, h6, b, i, em {font-size: 1em; font-weight: normal; font-style: normal }
body, input, button, textarea, select { -webkit-text-size-adjust: none; font: normal 14px/1.5 helvetica, verdana, san-serif; outline: 0;color: #000; }
body { margin: 0 auto; background: #fff; /*min-width:320px; width:320px*/ }
input[type="text"], input[type="password"], input[type="button"], input[type="submit"], button, textarea { -webkit-appearance: none }
option { height: 24px }
a { text-decoration: none;color: #1fd3ca;; }

.img img, video { vertical-align: middle }
.btn { display: inline-block; vertical-align: middle }
a:hover { color: #1fd3ca; text-decoration: none; }
img { border: none }
ol, ul, li { list-style: none; }
i, em { font-style: normal; }

html, body {
    -webkit-user-select: none;   /* 禁止选中文本（如无文本选中需求，此为必选项） */
    user-select: none;
}
html{height:100%;}
body{overflow:hidden;height:100%;}

@media (max-width: 380px) {
	body{ font-size:14px; }
}

@media (max-width: 325px) {
	body{ font-size:12px; }
}

@media (min-width: 760px) {
	body{ font-size:22px; }
}

.swiper-container {
  width: 100%;
  height: 100%;
  text-align: center;
}

.swiper-slide{
	width:100%;
	height:100%;
	overflow: hidden;
	position: relative;
	background-size: 100% 100%;
}

.abs{
	position: absolute;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}


#audio_btn {
	width: 2em;
	height: 2em;
	background-size: contain;
	background: url(images/music.png) no-repeat;
	background-size: 100%;
	position: absolute;
	right: 2%;
	top: 2%;
	cursor: pointer;
	z-index: 1000;
}
.rotate {
	-webkit-animation: rotating 1.2s linear infinite;
	-moz-animation: rotating 1.2s linear infinite;
	-o-animation: rotating 1.2s linear infinite;
	animation: rotating 1.2s linear infinite
}
 @-webkit-keyframes rotating {
 from {
 -webkit-transform: rotate(0)
}
 to {
 -webkit-transform: rotate(360deg)
}
}
 @keyframes rotating {
 from {
 transform: rotate(0)
}
 to {
 transform: rotate(360deg)
}
}
 @-moz-keyframes rotating {
 from {
 -moz-transform: rotate(0)
}
 to {
 -moz-transform: rotate(360deg)
}
}

.swiper-slide{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#page1{ background-image:url("images/page1-bg.jpg"); }
#page2{ background-image:url("images/page2-bg.jpg"); }
#page3{ background-image:url("images/page3-bg.jpg"); }
#page4{ background-image:url("images/page4-bg.jpg"); }
#page5{ background-image:url("images/page5-bg.jpg"); }
#page6{ background-image:url("images/page3-bg.jpg"); }
#page7{ background-image:url("images/page3-bg.jpg"); }
#page8{ background-image:url("images/page3-bg.jpg"); }
#page9{ background-image:url("images/page3-bg.jpg"); }
#page10{ background-image:url("images/page6-bg.jpg"); }
#page11{ background-image:url("images/page6-bg.jpg"); }
#page12{ background-image:url("images/page6-bg.jpg"); }
#page13{ background-image:url("images/page6-bg.jpg"); }
#page14{ background-image:url("images/page6-bg.jpg"); }
#page15{ background-image:url("images/page6-bg.jpg"); }
#page16{ background-image:url("images/page6-bg.jpg"); }
#page17{ background-image:url("images/page6-bg.jpg"); }





@media screen and (orientation: landscape) {
	.swiper-container{ width:28vw !important; margin:0 auto;}
	#audio_btn{ right:50%; margin-right:-13vw;}
}



#anniu{
	width:3em;
	position:absolute;
	bottom:6%;
	left:50%;
	margin-left:-1.5em;
    z-index: 9999;
}
#anniu img{ width:100%; height:auto;}
@-ms-keyframes anniu{
	from{ bottom:2%;}
	to{ }
}
@-moz-keyframes anniu{
	from{ bottom:2%;}
	to{ }
}
@-o-keyframes anniu{
	from{ bottom:2%;}
	to{ }
}
@-webkit-keyframes anniu{
	from{ bottom:2%;}
	to{ }
}
@keyframes anniu{
	from{ bottom:2%;}
	to{ }
}
#anniu{
	animation:'anniu' 1.5s linear 0s infinite;
	-ms-animation:anniu 1.5s linear 0s infinite;
	-moz-animation:anniu 1.5s linear 0s infinite;
	-o-animation:'anniu' 1.5s linear 0s infinite;
	-webkit-animation:'anniu' 1.5s linear 0s infinite;
}


.topic1 {
    width: 87.87%;
    height: 29.69%;
    left: 6%;
    top: 16.57%;
    background-image: url(images/topic1.png);
}

.topic2 {
    width: 43.73%;
    height: 4.12%;
    left: 28.13%;
    top: 10.94%;
    background-image: url(images/topic2.png);
}
.logo {
    width: 21.87%;
    height: 3.3%;
    left: 4.53%;
    top: 2.17%;
    background-image: url(images/logo.png);
}
.topic3 {
    width: 80%;
    height: 88.08%;
    left: 12.27%;
    top: 8.85%;
    background-image: url(images/topic3.png);
}
.flower {
    width: 45.47%;
    height: 28.04%;
    left: 0%;
	bottom: 0%;
    background-image: url(images/flower.png);
	background-position:bottom left;
}
.bird {
    width: 27.87%;
    height: 13.42%;
    right: 4.27%;
    top: 1.95%;
    background-image: url(images/bird.png);
}
.topic4 {
    width: 67.87%;
    height: 12.27%;
    left: 15.74%;
    top: 29.46%;
    background-image: url(images/topic4.png);
}
.topic5 {
    width: 45.47%;
    height: 4.05%;
    left: 26.93%;
    top: 39.96%;
    background-image: url(images/topic5.png);
}
.topic6 {
    width: 78.67%;
    height: 24.59%;
    left: 11.73%;
    top: 42.28%;
    background-image: url(images/topic6.png);
}
.topic7 {
    width: 70.13%;
    height: 26.84%;
    left: 8.8%;
    top: 8.1%;
    background-image: url(images/topic7.png);
}

.topic8 {
    width: 70.13%;
    height: 26.84%;
    left: 22.67%;
    top: 8.4%;
    background-image: url(images/topic8.png);
}

.topic9 {
    width: 68.8%;
    height: 6.75%;
    left: 15.6%;
    top: 21.74%;
    background-image: url(images/topic9.png);
}
.topic10 {
    width: 87.73%;
    height: 35%;
    left: 6.4%;
    top: 32.46%;
    background-image: url(images/topic10.png);
}
.topic11 {
    width: 69.47%;
    height: 18.74%;
    left: 15.73%;
    top: 22.26%;
    background-image: url(images/topic11.png);
}
.topic12 {
    width: 91.33%;
    height: 19.79%;
    left: 4.53%;
    top: 46.63%;
    background-image: url(images/topic12.png);
}
.topic13 {
    width: 74.4%;
    height: 7.87%;
    left: 14.53%;
    top: 32%;
    background-image: url(images/topic13.png);
}
.topic14 {
    width: 91.2%;
    height: 13.12%;
    left: 4.67%;
    top: 47.6%;
    background-image: url(images/topic14.png);
}
.topic15 {
    width: 69.2%;
    height: 15%;
    left: 15.47%;
    top: 34.86%;
    background-image: url(images/topic15.png);
}
.tit {
    width: 82.13%;
    height: 10.35%;
    left: 8.67%;
    top: 14.62%;
    
}
.tit1{background-image: url(images/tit1.png);}
.tit2{background-image: url(images/tit2.png);top: 18.22%;}
.tit3{background-image: url(images/tit3.png);}
.tit4{background-image: url(images/tit4.png);}
.tit5{background-image: url(images/tit5.png);top: 18.22%;}
.tit6{background-image: url(images/tit6.png);top: 18.22%;}
.tit7{background-image: url(images/tit7.png);}
.tit8{background-image: url(images/tit8.png);}
.tit9{background-image: url(images/tit9.png);}
.tit10{background-image: url(images/tit10.png);}


.text {
    width: 81.33%;
    height: 9.6%;
    left: 9.33%;
    top: 27.36%;
    
}
.text1{background-image: url(images/text1.png);}
.text2{background-image: url(images/text2.png); height:5.92%; top:30.96%;}
.text3{background-image: url(images/text3.png);}
.text4{background-image: url(images/text4.png);}
.text5{background-image: url(images/text5.png);height:5.92%; top:30.96%;}
.text6{background-image: url(images/text6.png);height:5.92%; top:30.96%;}
.text7{background-image: url(images/text7.png);}
.text8{background-image: url(images/text8.png); height:13.22%;top: 26.36%;}
.text9{background-image: url(images/text9.png);}
.text10{background-image: url(images/text10.png);}


.pic {
    width: 83.87%;
    height: 27.51%;
    left: 9.6%;
    top: 40.78%;
    
}
.pic1{background-image: url(images/pic1.png);}
.pic2{background-image: url(images/pic2.png);}
.pic3{background-image: url(images/pic3.png);}
.pic4{background-image: url(images/pic4.png);}
.pic5{background-image: url(images/pic5.png);}
.pic6{background-image: url(images/pic6.png);}
.pic7{background-image: url(images/pic7.png);}
.pic8{background-image: url(images/pic8.png);}
.pic9{background-image: url(images/pic9.png);}
.pic10{background-image: url(images/pic10.png);}


.lun {
    width: 15.47%;
    height: 18.89%;
    left: 7.6%;
    top: 62.22%;
    background-image: url(images/lun.png);
	z-index:100;
	background-position:top left;
}
.topic16 {
    width: 72%;
    height: 39.13%;
    left: 12.67%;
    top: 19.57%;
    background-image: url(images/topic16.png);
}
.topic17 {
    width: 59.07%;
    height: 13.42%;
    left: 30.67%;
    top: 58.47%;
    background-image: url(images/topic17.png);
}




@-ms-keyframes topic1 {
  from {
	transform: scale(0, 0);
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes topic1 {
  from {
	transform: scale(0, 0);
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes topic1 {
  from {
	transform: scale(0, 0);
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes topic1 {
  from {
	transform: scale(0, 0);
  }
  to {
    opacity: 1;
  }
}
@keyframes topic1 {
  from {
	transform: scale(0, 0);
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .topic1,.topic1,.swiper-slide-active .topic15,.swiper-slide-active .topic16 {
  animation: 'topic1' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic1 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic1 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic1' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic1' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}




@-ms-keyframes topic2 {
  from {
	margin-top:-2em;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes topic2 {
  from {
	margin-top:-2em;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes topic2 {
  from {
	margin-top:-2em;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes topic2 {
  from {
	margin-top:-2em;
  }
  to {
    opacity: 1;
  }
}
@keyframes topic2 {
  from {
	margin-top:-2em;
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .topic2,.topic2 {
  animation: 'topic2' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: topic2 0.5s ease-in-out 0.6s forwards;
  -moz-animation: topic2 0.5s ease-in-out 0.6s forwards;
  -o-animation: 'topic2' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'topic2' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}
.swiper-slide-active .topic3,.swiper-slide-active .topic4,.swiper-slide-active .topic7 {
  animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic2 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic2 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}
.swiper-slide-active .topic9 {
  animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic2 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic2 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic2' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}
.swiper-slide-active .pic {
  animation: 'topic2' 0.5s ease-in-out 1.1s forwards;
  -ms-animation: topic2  0.5s ease-in-out 1.1s forwards;
  -moz-animation: topic2  0.5s ease-in-out 1.1s forwards;
  -o-animation: 'topic2' 0.5s ease-in-out 1.1s forwards;
  -webkit-animation: 'topic2' 0.5s ease-in-out 1.1s forwards;
  opacity: 0;
}





@-ms-keyframes logo {
  from {
	margin-left:-2em;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes logo {
  from {
	margin-left:-2em;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes logo {
  from {
	margin-left:-2em;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes logo {
  from {
	margin-left:-2em;
  }
  to {
    opacity: 1;
  }
}
@keyframes logo {
  from {
	margin-left:-2em;
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .logo,.logo {
  animation: 'logo' 0.5s ease-in-out 1.1s forwards;
  -ms-animation: logo 0.5s ease-in-out 1.1s forwards;
  -moz-animation: logo 0.5s ease-in-out 1.1s forwards;
  -o-animation: 'logo' 0.5s ease-in-out 1.1s forwards;
  -webkit-animation: 'logo' 0.5s ease-in-out 1.1s forwards;
  opacity: 0;
}
.swiper-slide-active .tit {
  animation: 'logo' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: logo 0.5s ease-in-out 0.2s forwards;
  -moz-animation: logo 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'logo' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'logo' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}
.swiper-slide-active .topic5,.swiper-slide-active .topic12 {
  animation: 'logo' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: logo  0.5s ease-in-out 0.6s forwards;
  -moz-animation: logo  0.5s ease-in-out 0.6s forwards;
  -o-animation: 'logo' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'logo' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}






@-ms-keyframes bird {
  from {
	margin-right:-3em;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes bird {
  from {
	margin-right:-3em;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes bird {
  from {
	margin-right:-3em;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes bird {
  from {
	margin-right:-3em;
  }
  to {
    opacity: 1;
  }
}
@keyframes bird {
  from {
	margin-right:-3em;
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .bird {
  animation: 'bird' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: bird  0.5s ease-in-out 0.6s forwards;
  -moz-animation: bird  0.5s ease-in-out 0.6s forwards;
  -o-animation: 'bird' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'bird' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}





@-ms-keyframes topic5 {
  from {
	margin-left:2em;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes topic5 {
  from {
	margin-left:2em;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes topic5 {
  from {
	margin-left:2em;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes topic5 {
  from {
	margin-left:2em;
  }
  to {
    opacity: 1;
  }
}
@keyframes topic5 {
  from {
	margin-left:2em;
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .topic6,.swiper-slide-active .text {
  animation: 'topic5' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: topic5  0.5s ease-in-out 0.6s forwards;
  -moz-animation: topic5  0.5s ease-in-out 0.6s forwards;
  -o-animation: 'topic5' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'topic5' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}
.swiper-slide-active .topic11 {
  animation: 'topic5' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic5 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic5 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic5' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic5' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}





@-ms-keyframes topic7 {
  from {
	  margin-top:2em;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes topic7 {
  from {
	  margin-top:2em;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes topic7 {
  from {
	  margin-top:2em;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes topic7 {
  from {
	  margin-top:2em;
  }
  to {
    opacity: 1;
  }
}
@keyframes topic7 {
  from {
	  margin-top:2em;
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .topic10,.swiper-slide-active .topic17 {
  animation: 'topic7' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: topic7  0.5s ease-in-out 0.6s forwards;
  -moz-animation: topic7  0.5s ease-in-out 0.6s forwards;
  -o-animation: 'topic7' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'topic7' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}
.swiper-slide-active .topic8 {
  animation: 'topic7' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic7 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic7 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic7' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic7' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}



@-ms-keyframes topic8 {
  from {
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes topic8 {
  from {
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes topic8 {
  from {
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes topic8 {
  from {
  }
  to {
    opacity: 1;
  }
}
@keyframes topic8 {
  from {
  }
  to {
    opacity: 1;
  }
}
.swiper-slide-active .topic13 {
  animation: 'topic8' 0.5s ease-in-out 0.2s forwards;
  -ms-animation: topic8 0.5s ease-in-out 0.2s forwards;
  -moz-animation: topic8 0.5s ease-in-out 0.2s forwards;
  -o-animation: 'topic8' 0.5s ease-in-out 0.2s forwards;
  -webkit-animation: 'topic8' 0.5s ease-in-out 0.2s forwards;
  opacity: 0;
}
.swiper-slide-active .topic14 {
  animation: 'topic8' 0.5s ease-in-out 0.6s forwards;
  -ms-animation: topic8 0.5s ease-in-out 0.6s forwards;
  -moz-animation: topic8 0.5s ease-in-out 0.6s forwards;
  -o-animation: 'topic8' 0.5s ease-in-out 0.6s forwards;
  -webkit-animation: 'topic8' 0.5s ease-in-out 0.6s forwards;
  opacity: 0;
}