@charset "utf-8";
/* CSS Document */
html{height:100%;font-size:10px}
body{
	min-height: 100%;
	margin: 0;
	padding: 0;
	font-family: 'Microsoft YaHei UI';
	line-height: 20px;
	position: relative;
	background-image: url(image/asteroids.jpg);
}
div, h1, h2, h3, h4, p, form, ul, label, input, textarea, img, span{margin:0; padding:0;}
table{border-collapse:collapse;}
a { text-decoration: none;color: #454545;}
a:hover { color:#d60000;}
ul { padding:0; margin:0;}
li { list-style-type: none;}
.clear { clear: both;}
img { border: none;}
p{ line-height:180%;}

.top{width: 100%; height: 55px}
.t-box{
	width: 440px;
	margin: 0 auto;
	font-size: 16px;
	color: #fff;
	font-weight: 400;
	line-height: 45px;
	text-align: center;
	padding-top: 10px;
}
.content{width: 440px; margin: 0 auto; padding-bottom: 50px;}
.listbox{margin: 10px; width: 200px; height: 200px; float: left; text-decoration: none; background: rgba(83,83,83,.8);}
.list-1 { width: 100%; height: 60%; text-align:center; margin-top:10px;  }
.list-1 p { font-size: 18px; font-weight: 400; color: #bfbfbf;}
.list-2 { width: 200px; height:30%; text-align: left; }
.list-2 p {font-size: 28px; font-weight: 400; color: #ffe051; line-height: 40px; text-indent: 20px;}
.footer{ width:100%; height:45px; margin:0px;position:absolute; bottom: 0px;background: rgba(0,0,0,.5);}
.f-box{width: 440px; margin: 0 auto; font-size: 14px; color: #00b7ee; font-weight: 400; line-height: 45px; text-align:center;}




@media screen and (max-width: 440px){
.top{width: 100%; height: 55px}
.t-box{
	width: 100%;
	margin: 0 auto;
	font-size:1.6rem;
	color: #fff;
	font-weight: 400;
	line-height: 45px;
	text-align: center;
	padding-top: 10px;
}
.content{width: 100%; margin: 0 auto; padding-bottom: 100px;}
.listbox{margin: 2%; width: 46%; height: 170px; float: left; text-decoration: none; background: rgba(83,83,83,.5);}
.list-1 { width: 100%; height: 60%; text-align:center; margin-top:10px; }
.list-1 p { font-size: 1.8rem; font-weight: 400; color: #bfbfbf;}
.list-2 { width: 200px; height:30%; text-align: left; }
.list-2 p {font-size: 2.8rem; font-weight: 400; color: #FFFFFF; line-height: 40px; text-indent: 20px;}
.footer{ width:100%; height:45px; margin:0px; background: rgba(0,0,0,.5);position:absolute; bottom: 0px;}
.f-box{width: 100%; margin: 0 auto; font-size: 1.4rem; color: #00b7ee; font-weight: 400; line-height: 45px; text-align:center;}
	
	}
@media screen and (max-width: 350px){
.listbox{height:120px;}
.list-1 p { font-size: 1.1rem; }	
.list-2 p {font-size: 1.8rem;}	
}
