@charset "utf-8";
body{
	font-family:"Microsoft Yahei","SimSun";
	font-size:16px;
	color:#000;
}

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

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

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

a{
	color:#000;
}

a:hover{
	text-decoration: none;
	color: #c00 !important;
}

img{
	display:block;
	max-width: 100%;
	max-height: 100%;
}

a,input,textarea{
	outline: none;
}

table{
	font-size: 1em;
}

p,li{
	overflow: hidden;
}

.photo{
	position: relative;
}

.fw{
	color: #fff;
}

.fw a{
	color: #fff;
}

.fw a:hover{
	color: #dfdfdf !important;
}

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

.abs i{
	position: absolute;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}

#page{
	width: 100%;
	position: relative;
	overflow: hidden;
}

@media only screen and (orientation: landscape) {
	#page{ width: 1080px; margin: 0px auto;}
}

#page .bg{
	display: inline-block;
	vertical-align: top;
	width: 100%;
}


.music{
	position: fixed;
	right: 1em;
	top: 1em;
	width: 2.2em;
	height: 2.2em;
	cursor: pointer;
	z-index: 999;
}
.music.on{background:url(images/music-on.png) no-repeat; background-size:100% 100%;}
.music.off{background:url(images/music-off.png) no-repeat;background-size:100% 100%;}
.music img{display: inline-block;}
@-moz-keyframes music{from{ transform:rotate(-360deg); }to{ }}
@-o-keyframes music{from{ transform:rotate(-360deg); }to{ }}
@-webkit-keyframes music{from{ transform:rotate(-360deg); }to{ }}
@keyframes music{from{ transform:rotate(-360deg); }to{ }}
.music.on{
	animation:'music' 1.5s linear 0s infinite;
	-ms-animation:music 1.5s linear 0s infinite;
	-moz-animation:music 1.5s linear 0s infinite;
	-o-animation:'music' 1.5s linear 0s infinite;
	-webkit-animation:'music' 1.5s linear 0s infinite;
}

.topic1{ width: 50.6%; height: 1%; left: 24.7%; top: 0.23%; background-image: url("images/topic1.png"); }

.topic2{ width: 49.6%; height: 6%; left: 25.2%; top: 1.4%; }

.topic2 i{ background-image: url("images/topic2.png"); }

.above1{ width: 100%; height: 12.2%; left: 0%; top: 6.26%; background-image:url("images/above1.png"); background-size: 100% auto; }

.above2{ width: 42.3%; height: 3.2%; right: 0%; top: 44.26%; background-image:url("images/above2.png"); background-position: right center; }

.above3{ width: 15.4%; height: 2.9%; left: 62.6%; top: 60.6%; background-image:url("images/above3.png"); }

.hb1{ width: 40.4%; height: 2.5%; left: 34.3%; top: 8.6%; }

.hb2{ width: 23.4%; height: 1.7%; left: -2.2%; top: 11.1%; }

.hb3{ width: 37.7%; height: 2.2%; left: 48.1%; top: 30.9%; }

.hb4{ width: 26.1%; height: 1.5%; left: 32.2%; top: 39.4%; }

.hb5{ width: 18.7%; height: 1.2%; left: 64.3%; top: 45%; }

.hb6{ width: 33.3%; height: 1.7%; left: 64.5%; top: 61.9%; }

.hb7{ width: 47.4%; height: 2.2%; left: 48.2%; top: 69.7%; }


.hb1 i{ background-image: url("images/hb1.png"); }
.hb2 i{ background-image: url("images/hb2.png"); }
.hb3 i{ background-image: url("images/hb3.png"); }
.hb4 i{ background-image: url("images/hb4.png"); }
.hb5 i{ background-image: url("images/hb5.png"); }
.hb6 i{ background-image: url("images/hb6.png"); }
.hb7 i{ background-image: url("images/hb7.png"); }


@keyframes topic2{
	from{  }
	50%{ transform: scale(0.98,0.98); }
	to{  }
}
.topic2 i{
	animation:'topic2' 1s linear 0s infinite;
	-ms-animation:topic2 1s linear 0s infinite;
	-moz-animation:topic2 1s linear 0s infinite;
	-o-animation:'topic2' 1s linear 0s infinite;
	-webkit-animation:'topic2' 1s linear 0s infinite;
}

@keyframes move1{
	from{  }
	50%{ margin-top: -1em; }
	to{  }
}
.hb1 i{
	animation:'move1' 2s linear 0s infinite;
	-ms-animation:move1 2s linear 0s infinite;
	-moz-animation:move1 2s linear 0s infinite;
	-o-animation:'move1' 2s linear 0s infinite;
	-webkit-animation:'move1' 2s linear 0s infinite;
}

@keyframes move2{
	from{  }
	50%{ margin-left: 0.15em; margin-top: 0.05em; }
	to{  }
}
.hb2 i{
	animation:'move2' 1s linear 0s infinite;
	-ms-animation:move2 1s linear 0s infinite;
	-moz-animation:move2 1s linear 0s infinite;
	-o-animation:'move2' 1s linear 0s infinite;
	-webkit-animation:'move2' 1s linear 0s infinite;
}

@keyframes move3{
	from{  }
	50%{ margin-left: 0.5em; transform: scale(0.9,0.9); }
	to{  }
}
.hb3 i{
	animation:'move3' 2s linear 0s infinite;
	-ms-animation:move3 2s linear 0s infinite;
	-moz-animation:move3 2s linear 0s infinite;
	-o-animation:'move3' 2s linear 0s infinite;
	-webkit-animation:'move3' 2s linear 0s infinite;
}

@keyframes move4{
	from{  }
	50%{ transform: rotate(20deg); }
	to{  }
}
.hb4 i{
	animation:'move4' 2s linear 0s infinite;
	-ms-animation:move4 2s linear 0s infinite;
	-moz-animation:move4 2s linear 0s infinite;
	-o-animation:'move4' 2s linear 0s infinite;
	-webkit-animation:'move4' 2s linear 0s infinite;
}

@keyframes move5{
	from{  }
	50%{ margin-top: -1em; }
	to{  }
}
.hb5 i{
	animation:'move5' 2s linear 0s infinite;
	-ms-animation:move5 2s linear 0s infinite;
	-moz-animation:move5 2s linear 0s infinite;
	-o-animation:'move5' 2s linear 0s infinite;
	-webkit-animation:'move5' 2s linear 0s infinite;
}

@keyframes move6{
	from{  }
	25%{ margin-top: -0.5em; }
	50%{ margin-top: -2.5em; }
	75%{ margin-top: -0.5em; }
	to{  }
}
.hb6 i{
	animation:'move6' 2s linear 0s infinite;
	-ms-animation:move6 2s linear 0s infinite;
	-moz-animation:move6 2s linear 0s infinite;
	-o-animation:'move6' 2s linear 0s infinite;
	-webkit-animation:'move6' 2s linear 0s infinite;
}

@keyframes move7{
	from{  }
	50%{ transform: rotate(20deg); }
	to{  }
}
.hb7 i{
	animation:'move7' 2s linear 0s infinite;
	-ms-animation:move7 2s linear 0s infinite;
	-moz-animation:move7 2s linear 0s infinite;
	-o-animation:'move7' 2s linear 0s infinite;
	-webkit-animation:'move7' 2s linear 0s infinite;
}
