body {
	color:#333;
	background-color: #fbfaf9;
	height:100%;
	line-height: 1.6;
	font-size: 14px;
}

.top_wrap {
	position: absolute;
  width: 100%;
	height: 100%;
}

.top_wrap h1{
  position: absolute;
  left: 50%; top: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  text-align: center;
	margin-top: -40px;
}
.top_wrap h1 img{
  width: 310px;
}
@media screen and (max-width: 350px) {
	.top_wrap h1 img{
	  width: 280px;
	}
}

.top-nav {
	font-family: "Arimo", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	position: absolute;
  bottom: 0;
  left: 0;
	box-sizing:border-box;
	padding: 16px;
	width: 100%;
}
.top-nav ul {
	list-style: none;
	font-size:12px;
}
.top-nav ul li {
	overflow:hidden;
}
.top-nav ul li .info-date {
	font-size:10px;
	color: #999;
	display: block;
}
.top-nav ul li .info-atl {
	line-height: 1.4;
	overflow:hidden;
	display: block;
}
.top-nav ul li .info-atl a {
	text-decoration: none;
}
.top-nav ul li .info-atl a:link, .top-nav ul li .info-atl a:visited {
	color: #555;
}
.top-nav ul li .info-atl a:hover {
	color: #999;
}
/*
.mask-in {
	opacity: 1;
	transition: 1s ease-out;
}
.mask-show {
	opacity: 1;
}
*/
.fade-in0{
	opacity:0;
	animation-name: fade-in00;
	animation-duration: 3s;
	animation-fill-mode: forwards;
}
@keyframes fade-in00 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
.fade-in1{
	opacity:0;
	animation-name: fade-in01;
	animation-duration: 2s;
	animation-delay: 250ms;
	animation-fill-mode: forwards;
}
@keyframes fade-in01 {
0% {opacity: 0; /*margin-bottom: -20px;*/}
	100% {opacity: 1; /*margin-bottom: 0;*/}
}