﻿[data-v-200ec4a0]:export {
    menuText: #7D8DA6;
    menuActiveText: #FFFFFF;
    subMenuActiveText: #FFFFFF;
    menuBg: #FFFFFF;
    menuHover: linear-gradient(90deg,#518BFF 0%,#0E5EFF 100%);
    subMenuBg: #fff;
    subMenuHover: linear-gradient(90deg,#518BFF 0%,#518BFF 100%);
    sideBarWidth: 248px
}

.home[data-v-200ec4a0] {
    background: #0C0E15;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 640px) {
    .home[data-v-200ec4a0] {
        margin-bottom:.5rem
    }

    .ml-3[data-v-200ec4a0] {
        margin-left: .3rem
    }

    .container[data-v-200ec4a0] {
        width: 100vw;
        position: relative
    }

    .content[data-v-200ec4a0] {
        position: relative;
        z-index: 5
    }

    .bg-img[data-v-200ec4a0] {
        width: 100vw;
        height: 14.22rem;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
        z-index: 0
    }

    .app-img[data-v-200ec4a0] {
        width: 100vw
    }

    .title[data-v-200ec4a0] {
        text-align: center;
        font-size: .7rem;
        font-weight: 600;
        color: #f5f6f8;
        margin: .5rem 0 .3rem
    }

    .subtitle[data-v-200ec4a0] {
        font-size: .44rem;
        color: #f5f6f8;
        font-weight: 600;
        line-height: .58rem;
        text-align: center
    }

    .subtitle .key[data-v-200ec4a0] {
        background: #24C373;
        color: #0c0e15;
        padding: 0 .1rem;
        margin-left: .1rem
    }

    .desc[data-v-200ec4a0] {
        font-size: .25rem;
        color: #f5f6f8;
        font-weight: 400;
        padding: 0 .64rem;
        text-align: justify;
        margin-top: .4rem;
        line-height: .38rem;
        margin-bottom: .5rem
    }

    .plat-item[data-v-200ec4a0] {
        width: 2.62rem;
        height: 1rem;
        background: #FFFFFF;
        border-radius: .35rem;
        color: #0c0e15;
        font-size: .29rem;
        font-weight: 400;
        position: relative;
        margin-top: .28rem
    }

    .plat-item .icon[data-v-200ec4a0] {
        width: .37rem;
        height: .37rem;
        margin-right: .1rem
    }
}

@media screen and (min-width: 640px) {
    .home[data-v-200ec4a0] {
        min-width:1088px;
        min-height: 588px;
        position: relative
    }

    .home .container[data-v-200ec4a0] {
        margin: 0 auto;
        height: 100%;
        padding: 0 32px;
        position: absolute;
        top: calc(50% + 100px);
        left: 50%;
        transform: translate(-50%,-50%);
        background: url(../image/home-bg-d30f2800.png) no-repeat;
        background-size: 100% 100%
    }

    .home .container .app-img[data-v-200ec4a0] {
        width: 488px;
        height: 588px
    }

    .home .container .content[data-v-200ec4a0] {
        width: 535px;
        color: #fff
    }

    .home .container .content .title[data-v-200ec4a0] {
        font-size: 54px;
        font-weight: 600
    }

    .home .container .content .subtitle[data-v-200ec4a0] {
        font-size: 34px;
        font-weight: 600;
        margin: 27px 0 46px
    }

    .home .container .content .subtitle .key[data-v-200ec4a0] {
        height: 52px;
        background: #24C373;
        line-height: 52px;
        color: #0c0e15;
        padding: 0 5px;
        display: block;
        margin-left: 5px
    }

    .home .container .content .desc[data-v-200ec4a0] {
        font-size: 16px;
        line-height: 26px;
        font-weight: 400;
        text-align: justify
    }

    .home .container .content .platform[data-v-200ec4a0] {
        margin-top: 60px
    }

    .home .container .content .platform .plat-item[data-v-200ec4a0] {
        width: 142px;
        background: #FFFFFF;
        border-radius: 20px;
        color: #0c0e15;
        font-size: 16px;
        font-weight: 400;
        position: relative
    }

    .home .container .content .platform .plat-item .icon[data-v-200ec4a0] {
        width: 22px;
        height: 22px;
        margin-right: 5px
    }

    .home .container .content .platform .plat-item .btn[data-v-200ec4a0] {
        line-height: 54px
    }

    .home .container .content .platform .plat-item[data-v-200ec4a0]:hover {
        border-radius: 20px 20px 0 0
    }

    .home .container .content .platform .plat-item:hover .qr[data-v-200ec4a0] {
        display: block
    }

    .home .container .content .platform .plat-item .qr[data-v-200ec4a0] {
        width: 100%;
        padding-bottom: 10px;
        display: none;
        position: absolute;
        top: 53px;
        left: 0;
        background: #fff;
        border-radius: 0 0 20px 20px
    }

    .home .container .content .platform .plat-item .qr .qr-img[data-v-200ec4a0] {
        width: 120px;
        height: 120px;
        margin: 0 auto;
        display: block
    }

    .poper .poper-title[data-v-200ec4a0] {
        font-size: 16px;
        color: #0c0e15;
        font-weight: 400
    }

    .poper .poper-title[data-v-200ec4a0]:last-of-type {
        margin-top: 18px
    }

    .poper .poper-tip[data-v-200ec4a0] {
        font-size: 14px;
        color: #7c808c;
        font-weight: 400;
        line-height: 26px
    }

    .poper .download-link[data-v-200ec4a0] {
        font-size: 14px;
        color: #24c373;
        font-weight: 400;
        text-decoration: underline
    }
}
