@keyframes fadein{from{opacity:0}to{opacity:1}}
.back{position:fixed;top:0;left:0;right:0;bottom:0;background-size:cover;background-position:center center;background-repeat:no-repeat;background-image:url(../../image/back.png);animation:fadein .3s ease-out 0s forwards}
.main{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:100%;}
.common-width{width:670px;margin:0 auto}
.top-back{width:100%;height:60px;background:rgba(0,0,0,.7);z-index:20}
.top-back .logo-box{height:60px;display:flex;display:-webkit-flex;flex-direction:row;justify-content:center;align-items:center;}
.top-back .logo-box .logo-img{width:161px;height:41px}
.content-box{display:flex;justify-content:center;z-index:10;}
.content-box img{width:65%;height:100%;}
.bottom-back{width:100%;background:rgba(0,0,0,.7);z-index:20;}
.bottom-back .footer{margin:15px auto;font-size:14px;color:#fff;text-align:center;}
.bottom-back .footer p{margin-bottom:5px;white-space:nowrap;}
.bottom-back .footer p img{width:25px;height:20px;padding-right:5px;vertical-align:text-bottom;}
.bottom-back .footer a{color:#fff;margin:5px auto;}
.bottom-back .footer a:hover{text-decoration:underline;}
@media screen and (min-device-width:320px) and (max-device-width:1024px){
    .common-width{width:80%}
    .content-box img{width:100%;height:100%;}
}
#stars{position:absolute;top:0;bottom:0;right:0;}