* {
    padding: 0;
    margin: 0;
}

body,
html {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}
.wap-inapp {
    position: fixed;
    z-index: 300;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #3d3d3d;
}
.wap-inapp img {
    width: 100%;
}
.wap-download {
    height: 3rem;
    position: absolute;
    bottom: 4rem;
    z-index: 10;
}
.wap-fullpage {
    width: 100vw;
    height: 100vh !important;
}
.wap-bg {
    width: 100%;
    height: 100%;
    background-image: url("../img/wap/bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    position: relative;
    overflow: hidden;
}
.wap-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.8rem 0 1.2rem;
    position: relative;
    z-index: 100;
}
.wap-logo {
    height: 1.2rem;
}
.wap-service {
    height: 0.55rem;
}

.wap-main {
    /* position: relative; */
    height: 100%;
}
.wap-main.op0 .center,
.wap-main.op0 .left,
.wap-main.op0 .right {
    opacity: 0;
}
.wap-main .left {
    height: 8rem;
    position: absolute;
    left: 0.1rem;
    bottom: 6rem;
}
.wap-main .right {
    height: 9rem;
    position: absolute;
    right: 0.6rem;
    bottom: 6rem;
}
.wap-main .center {
    height: 15rem;
    position: absolute;
    bottom: 2rem;
    left: -0.5rem;
    margin-right: 0.55rem;
    z-index: 10;
}
.wap-main .footer {
    height: 0.88rem;
    position: absolute;
    bottom: 0.5rem;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.wap-notice {
    display: none;
    position: fixed;
    z-index: 200;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.7);
}
.wap-notice-content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wap-notice-bg {
    background: url("../img/wap/notice_bg.png") no-repeat center;
    background-size: 100% 100%;
    width: 8.32rem;
    height: 7.56rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.wap-notice-bg .text {
    margin-bottom: 0.6rem;
    width: 7rem;
    height: 4.3rem;
}
.wap-notice-bg .ok {
    width: 5rem;
    height: 1rem;
    margin: 0.4rem 0;
}

.pc {
    width: 100vw;
    height: 100vh;
}
.pc-top {
    height: 1rem;
    position: relative;
    z-index: 10;
}
.pc-logo {
    position: absolute;
    top: 50%;
    left: 0.8rem;
    transform: translateY(-50%);
    height: 0.35rem;
}
.pc-nav {
    position: absolute;
    top: 50%;
    right: 0rem;
    transform: translate(-0.8rem, -50%);
    display: flex;
    justify-content: center;
}
.pc-nav img {
    width: 0.37rem;
    height: 0.37rem;
    margin-left: 0.2rem;
    cursor: pointer;
}
.pc-scanbox {
    background: url("../img/pc/scaner.png") no-repeat center;
    background-size: 100%;
    position: absolute;
    z-index: 10;
    left: 85%;
    bottom: 15%;
    transform: translate(-85%, -15%);
    width: 1.7rem;
    height: 2.5rem;
    display: flex;
    justify-content: center;
}
.pc-scanbox img {
    width: 0.92rem;
    height: 0.92rem;
    margin-top: 0.4rem;
}
.pc-bottom {
    position: absolute;
    z-index: 10;
    left: 50%;
    bottom: 0;
    transform: translate(-50%);
    background: hsla(0, 0%, 100%, 0.7);
    height: 0.47rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pc-bottom img {
    height: 0.13rem;
}
.pc-video{
    width: 100vw;
    height: 100vh;
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
}
.pc-video video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (min-width: 768px) {
    /*.wap {*/
    /*    display: none;*/
    /*}*/
    /*.pc {*/
    /*    display: block;*/
    /*}*/
}

.open-broswer {
    position: fixed;
    display: flex;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background-color: rgb(61 61 61);
}

.open-broswer img {
    width: auto;
    height: 400px;
}