a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

#app {
    width: 100%;
    height: 110%;
    position: relative;
    background: #000;
    overflow: hidden;
}

.main {
    background: url(img/pc_bg.jpg) 50% no-repeat;
    background-position: center top;
    background-size: cover;
    position: relative;
    width: 100%;
    height: 88%;
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.right_share {
    position: absolute;
    z-index: 98;
    right: 0;
    top: 50%;
    transform: translateY(-80%);
    cursor: pointer;
    width: 96px;
    height: 300px
}

.public_con {
    position: absolute;
    z-index: 98;
    right: 96px;
    top: 65%;
    transform: translateY(-50%);
    display: none;
}

.public_img {

}

.left_con {
    left: 14%;
    top: 1rem;
    position: absolute;
    padding: 0px;
    width: 72px;
    display: flex;
    flex-direction: column;
}
.main_con {
    width: 100%;
}
.main_btns {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: end;
    height: 100vh;
    margin-bottom: 0.7rem;
}

.middle_con {
    position: absolute;
 }
.btn_con {
    position: relative;
    top: -25px;
    left: 100px;
    display: flex;
    flex-direction: row;
}
.btn_enter {
    position: absolute;
    right: 0.7rem;
    top: 0.5rem;
}
.btn_enter img {
    width: 1.5rem;
}
.right_con {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

.cadpa {
    padding-bottom: 3.1rem;
    position: relative;
    height: auto;
    display: flex;
    flex-direction: column;
}

.qrcode {
    padding-top: 0px;
    width: 195px;
    height: 179px;
}

.erweima_wrapper {
    position: relative;
}

.erweima_line {
    position: absolute;
    top: 12px;
    left: 17px;
    width: 165px;
    height: auto;
    animation: scanLine 2s linear infinite alternate
}

@keyframes scanLine {
    0% {
        top: 12px
    }

    to {
        top: 145px
    }
}

.btn {
    cursor: pointer;
}

.footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 12%;
    font-size: 0.12em;
    color: hsla(0, 0%, 100%, .8);
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (max-width: 1024px) {
    .main {
        background: url(img/m_bg.jpg) 50% no-repeat;
        background-position: center top;
        background-size: cover;
        position: relative;
        width: 100%;
        height: 90%;
        text-align: center;
        font-size: 18px;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    
     .right_share {
	    position: absolute;
	    z-index: 98;
	    right: 0;
	    top: 40%;
	    transform: translateY(-50%);
	    cursor: pointer;
	    width: 0.9rem;
	    height: auto;
	}
    .share_img {
        width: 0.9rem;
        height: auto;
    }
    .cadpa_m {
        position: absolute;
        top: 0.5rem;
        left: 0.5rem;
        width: 0.8rem;
        height: auto;
    }
    .cadpa_m_img {
     	 width: 0.8rem;
        height: auto;
    }
    
    .public_con {
        position: absolute;
        z-index: 98;
        right: 0.9rem;
        top: 50%;
        transform: translateY(-50%);
        width: 1.3rem;
        display: none;
    }
    .public_img {
        width: 1.3rem;
    }
    
    .public_con_m {
        position: absolute;
        z-index: 99;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.9);
    	 overflow: hidden;
    	 display: none;
    }
    .public_img_m {
    	padding-top: 3rem;
       width: 5rem;
    }
    .close {
    	width: 0.5rem;
    	vertical-align: top;
    	padding-top: 2.5rem;
    	cursor: pointer;
    }
    
    .download_con {
    	 position: absolute;
        z-index: 99;
        width: 100%;
        height: 100%;
        overflow: hidden;
        background: url(img/download.jpg) 50% no-repeat;
    	 background-position: center top;
    	 background-size: cover;
    	 display: none;
    }
}

@media (max-width: 1024px) {
    .hidden_m {
        display:none!important
    }
}

@media (min-width: 1025px) {
    .hidden_pc {
        display:none!important
    }
}

@media (min-width: 780px) and  (max-width: 918px) {
     .download_m {
        position: absolute;
        bottom: 30px;
        width: 7rem;
    }
    .download_m_img {
        width: 3rem;
        cursor: pointer;
    }
}

@media (min-width: 710px) and  (max-width: 780px) {
    .download_m {
        position: absolute;
        bottom: 30px;
        width: 7rem;
    }
    .download_m_img {
        width: 3rem;
        cursor: pointer;
    }
}

@media (min-width: 918px) and (max-width: 1024px) {
    .download_m {
        position: absolute;
        bottom: 30px;
        width: 7rem;
    }
    .download_m_img {
        width: 3rem;
        cursor: pointer;
    }
}

@media (max-width: 710px) {
    .download_m {
        position: absolute;
        bottom: 30px;
        width: 7rem;
    }
    .download_m_img {
        width: 3rem;
        cursor: pointer;
    }
}