body{
    background-color: #1A2E6F;
}
.bk{
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    background:url("../img/bg.png") 100%  100%;
}
.info-block{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.img-center{
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}

.line{
    width: 100%;
    z-index: 1;
}

@keyframes fadeOut {
    from  {
        opacity:0;
    }
    to {
        opacity:1;
    }
}

@-webkit-keyframes fadeOut {
    from  {
        opacity:0;
    }
    to {
        opacity:1;
    }
}

.line-fade-out {
    animation: fadeOut 3s forwards;
    -webkit-animation: fadeOut 3s forwards;
}

/* 手机等小屏幕手持设备 */
@media screen and (min-width: 320px) and (max-width: 480px) {
    .log{
        top: 15%;
        z-index: 3;
        width: 50%;
    }
    .solagon{
        top: 30%;
        width: 80%;
        z-index: 3;
    }
    .line-top{
        top: 23%;
    }
    .line-bottom{
        top: 37%;
    }
    .assetin-block{
        position: absolute;
        width: 100%;
        bottom: 20px;
        left: 0;
        z-index: 10;
        text-align: center;
    }

    .qrcode{
        width: 50%;
    }

    .text-block{
        margin-left: 10px;
        margin-top: 15px;
    }

    .assetin-text{
        font-size: 14px;
        font-weight: bold;
        line-height: 20px;
        color: #fff;
    }
	
	.beian-link{
		font-size: 14px;
        font-weight: bold;
        line-height: 20px;
        color: #fff;
		text-decoration: none;
	}
}
/* 平板之类的宽度 1024 以下设备 */
@media only screen and (min-width: 481px) and (max-width: 1024px) {
    .log{
        top: 20%;
        z-index: 3;
        width: 30%;
    }
    .solagon {
        top: 38%;
        width: 70%;
        z-index: 3;
    }
    .line-top{
        top: 28%;
    }
    .line-bottom{
        top: 48%;
    }
    .assetin-block{
        position: absolute;
        height: 120px;
        width: 900px;
        left: 60px;
        z-index: 10;
        bottom: 60px;
    }

    .qrcode{
        float: left;
        width: 120px;
    }

    .text-block{
        float: left;
        margin-left: 10px;
        margin-top: 15px;
        width: 770px;
    }

    .assetin-text{
        font-size: 18px;
        line-height: 30px;
        color: #fff;
    }
	
	.beian-link{
		font-size: 18px;
        line-height: 30px;
        color: #fff;
		text-decoration: none;
	}
}
/* PC客户端或大屏幕设备: 1028px 至更大 */
@media only screen and (min-width: 1024px) {
    .log{
        top: 20%;
        z-index: 3;
        width: 20%;
    }
    .solagon {
        top: 45%;
        width: 70%;
        z-index: 3;
    }
    .line-top{
        top: 31%;
    }
    .line-bottom{
        top: 58%;
    }

    .assetin-block{
        position: absolute;
        height: 120px;
        width: 900px;
        left: 100px;
        bottom: 60px;
        z-index: 10;
    }

    .qrcode{
        float: left;
        width: 120px;
    }

    .text-block{
        float: left;
        margin-left: 10px;
        margin-top: 15px;
        width: 770px;
    }

    .assetin-text{
        font-size: 20px;
        line-height: 30px;
        color: #fff;
    }
	
	.beian-link{
		font-size: 20px;
        line-height: 30px;
        color: #fff;
		text-decoration: none;
	}
}