body{margin:0;padding:0;font-family:"Microsoft YaHei";background:#ceedfe;}
p{margin:2% 5%;line-height:28px;font-size:16px;text-align:justify;text-indent: 2em;}

.tips_blk{z-index:99999999999;position:absolute;left:50%;bottom:10px;width:130px;height: 20px;margin-left:-65px;text-align:center;}
.tips_blk p{z-index:99999999999;font-size:10px;color:#FFF;}
.tips_blk_hide p{z-index:99999999999;display:none;}
.music_blk{z-index:99999999999;position:absolute;left:10px;bottom:10px;}
.music{display:block;width:23px;height:23px;background:url('http://h5.cyol.com/special/science10/images/music.png') no-repeat;background-size:23px 23px;}
.music_on{-webkit-animation:music 1.2s linear infinite;animation:music 1.2s linear infinite;}

.loading{position:absolute;width:100%;height:100%;background:url('../images/loading.jpg') no-repeat 0 0;background-size:100% 100%;}
.suggest{position:fixed;bottom:0;width:100%;color:white;font-size:12px;}
.suggest p{text-align:center;text-indent:0;}
.load_val{width:100%;height: 100%;position:absolute;}
.loading_line{width:60%;height:8px;position:absolute;left:23%;top:46%;background:#0ff9ff;border-radius:5px;}
.loading_line_blank{width:0%;height:100%;background: #f3076c;border-radius:5px;}
.loading_pic{top:38.5%;right:17%;position:absolute;width:11%;height:7%;}
.coypright{position:fixed;bottom:13%;width:32%;left: 35%;}

section{display:none;position:absolute;width:100%;height:100%;}
section div{position:absolute;}
.ac{display:block;}
#p0{background:url('../images/p0.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p0 .w1{background:url('../images/p0.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w2{background:url('../images/p0.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w3{background:url('../images/p0.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w4{background:url('../images/p0.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w5{background:url('../images/p0.5.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w6{background:url('../images/p0.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p0 .w7{background:url('../images/p0.7.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;opacity:0;}
#p0 .b1{width:42%;height:9%;bottom: 4%;left: 29%;}
#p0.ac .w1{-webkit-animation:fadeInLeft 3s ease both;animation:fadeInLeft 3s ease both;}
#p0.ac .w2{-webkit-animation:fadeInRight 3s ease both;animation:fadeInRight 3s ease both;}
#p0.ac .w3{-webkit-animation:fadeInDown 1s 2s ease both;animation:fadeInDown 1s 2s ease both;}
#p0.ac .w4{-webkit-animation:fadeInDown 1s 3s ease both;animation:fadeInDown 1s 3s ease both;}
#p0.ac .w5{-webkit-animation:fadeInDown 1s 4s ease both;animation:fadeInDown 1s 4s ease both;}
#p0.ac .w6{-webkit-animation:fadeIn 1s 4.5s ease both;animation:fadeIn 1s 4.5s ease both;}
#p0.ac .w7{-webkit-animation:flash .5s 4.5s ease infinite;animation:flash .5s 4.5s ease infinite;}

#p1{background:url('../images/p1.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p1 .w1{background:url('../images/p1.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w2{background:url('../images/p1.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w3{background:url('../images/p1.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w4{background:url('../images/p1.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w5{background:url('../images/p1.5.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w6{background:url('../images/p1.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .w7{background:url('../images/p1.7.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p1 .b1{width:16%;height:4%;top: 50%;left: 20%;}
#p1 .b2{width:16%;height:4%;top: 56%;left: 22%;}
#p1 .b3{width:16%;height:4%;top: 56%;left: 48%;}
#p1 .b4{width:16%;height:4%;top: 57%;left: 72%;}
#p1 .b5{width:16%;height:4%;top: 64%;left: 33%;}
#p1 .b6{width:42%;height:9%;bottom: 10%;left: 29%;}
#p1.ac .w1{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}
#p1.ac .w6{-webkit-animation:flash .5s ease infinite;animation:flash .5s ease infinite;}


#p2{background:url('../images/p2.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p2 .w1{background:url('../images/p2.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p2 .w2{background:url('../images/p2.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p2 .w3{background:url('../images/p2.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p2 .w4{background:url('../images/p2.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p2.ac .w4{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}

#p3{background:url('../images/p3.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p3 .w1{background:url('../images/p3.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p3 .w2{background:url('../images/p3.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p3 .w3{background:url('../images/p3.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p3 .w4{background:url('../images/p3.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p3 .w5{background:url('../images/p3.5.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p3 .w6{background:url('../images/p3.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;display:none;}
#p3.ac .w4{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}
#p3 .b1{width:16%;height:10%;top: 36%;left: 15%;}

#p4{background:url('../images/p4.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p4 .w1{background:url('../images/p4.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w2{background:url('../images/p4.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w3{background:url('../images/p4.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w4{background:url('../images/p4.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w5{background:url('../images/p4.5.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w6{background:url('../images/p4.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w7{background:url('../images/p4.7.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w8{background:url('../images/p4.8.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w9{background:url('../images/p4.9.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w10{background:url('../images/p4.10.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4 .w11{background:url('../images/p4.11.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p4.ac .w11{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}
#p4.ac .w2{-webkit-animation:fadeIn .6s .6s ease both;animation:fadeIn .6s .6s ease both;}
#p4.ac .w3{-webkit-animation:fadeIn .6s 1.2s ease both;animation:fadeIn .6s 1.2s ease both;}
#p4.ac .w4{-webkit-animation:fadeIn .6s 1.8s ease both;animation:fadeIn .6s 1.8s ease both;}
#p4.ac .w5{-webkit-animation:fadeIn .6s 2.4s ease both;animation:fadeIn .6s 2.4s ease both;}
#p4.ac .w6{-webkit-animation:fadeIn .6s 3s ease both;animation:fadeIn .6s 3s ease both;}
#p4.ac .w7{-webkit-animation:fadeIn .6s 3.6s ease both;animation:fadeIn .6s 3.3s ease both;}
#p4.ac .w8{-webkit-animation:fadeIn .6s 4.2s ease both;animation:fadeIn .6s 4.2s ease both;}
#p4.ac .w9{-webkit-animation:fadeIn .6s 4.8s ease both;animation:fadeIn .6s 4.8s ease both;}

#p5{background:url('../images/p5.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p5 .w1{background:url('../images/p5.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p5 .w2{background:url('../images/p5.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p5 .w3{background:url('../images/p5.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p5.ac .w3{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}

#p6{background:url('../images/p6.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p6 .w1{background:url('../images/p6.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w2{background:url('../images/p6.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w3{background:url('../images/p6.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w4{background:url('../images/p6.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
.frame{width:96%;height:100%;overflow-y:scroll;display:none;z-index:10;}
#p6 .w5{width:100%;height:180%;background:url('../images/p6.5.png') no-repeat 0 0;background-size:100% 100%;}
#p6 .w6{background:url('../images/p6.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w7{background:url('../images/p6.7.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w8{background:url('../images/p6.8.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w9{background:url('../images/p6.9.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w10{background:url('../images/p6.10.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w11{background:url('../images/p6.11.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w12{background:url('../images/p6.12.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w13{background:url('../images/p6.13.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w14{background:url('../images/p6.14.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w15{background:url('../images/p6.15.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w16{background:url('../images/p6.16.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w17{background:url('../images/p6.17.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p6 .w18{width:16%;height:6%;bottom: 0%;left: 42%;}
#p6.ac .w3{-webkit-animation:fadeIn 1s .6s ease both;animation:fadeIn 1s .6s ease both;}

#p7{background:url('../images/p7.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p7 .w1{background:url('../images/p7.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p7 .w2{background:url('../images/p7.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p7 .w3{background:url('../images/p7.3.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p7 .w4{background:url('../images/p7.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p7 .b1{width:16%;height:10%;bottom: 0%;left: 42%;}
#p7.ac .w1{-webkit-animation:fadeInUp 1s ease both;animation:fadeInUp 1s ease both;}
#p7.ac .w2{-webkit-animation:fadeInUp 1s 1s ease both;animation:fadeInUp 1s 1s ease both;}
#p7.ac .w3{-webkit-animation:fadeInUp 1s 2s ease both;animation:fadeInUp 1s 2s ease both;}
#p7.ac .w4{-webkit-animation:fadeInUp 1s 3s ease both;animation:fadeInUp 1s 3s ease both;}

#p8{background:url('../images/p8.jpg') no-repeat 0 0 white;background-size:100% 100%;}
#p8 .w1{background:url('../images/p8.1.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w2{background:url('../images/p8.2.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w3{background:url('../images/p8.3.png?1') no-repeat 0 0;background-size:100% 100%;width:18%;height:8%;top:24%;}
#p8 .w4{background:url('../images/p8.4.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w5{background:url('../images/p8.5.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w6{background:url('../images/p8.6.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w7{background:url('../images/p8.7.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w8{background:url('../images/p8.8.png') no-repeat 0 0;background-size:100% 100%;width:100%;height:100%;}
#p8 .w9{width:92%;top:21%;color:white;font-size:400%;}
#p8 .w9 span{margin:2%;float:right;}
#p8.ac .w1{-webkit-animation:fadeInRight 1s ease both;animation:fadeInRight 1s ease both;}
#p8.ac .w2{-webkit-animation:fadeInRight 1s .5s ease both;animation:fadeInRight 1s .5s ease both;}
#p8.ac .w6{-webkit-animation:fadeIn .6s 2s ease both;animation:fadeIn .6s 2s ease both;}
#p8.ac .w5{-webkit-animation:fadeIn .6s 2.5s ease both;animation:fadeIn .6s 2.5s ease both;}
#p8.ac .w8{-webkit-animation:fadeIn .6s 3s ease both;animation:fadeIn .6s 3s ease both;}
#p8.ac .w7{-webkit-animation:flash 1s 3.5s ease infinite;animation:flash 1s 3.5s ease infinite;}

.close{width:16%;height:10%;bottom: 0%;left: 42%;}
.window{width:72%;height:35%;margin: 14%;top:27%;}


@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@-moz-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}

@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@keyframes music{
	0%{transform: rotate(0)}
	100%{transform: rotate(360deg)}
}
@-webkit-keyframes music{
	0%{transform: rotate(0); -webkit-transform: rotate(0)}
	100%{transform: rotate(360deg); -webkit-transform: rotate(360deg)}
}


@keyframes flash{
	0%{opacity:0;}
	50%{opacity:1;}
	100%{opacity:0;}
}
@-webkit-keyframes music{
	0%{opacity:0;}
	50%{opacity:1;}
	100%{opacity:0;}
}