﻿#root {
    height: 100%
}

.wrap {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    position: relative
}

.video-wrap {
    position: relative;
    top: 0;
    height: 100%
}

.center_style {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1
}

.video-wrap .video-target {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.video-wrap .video-mark {
    position: absolute;
    top: 0;
    z-index: 2;
    width: calc(100vw - 520px);
    height: 100vh
}

.wrap .left {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    width: 520px;
    background: url(data:image/png;base64,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) no-repeat,#f6f6f6;
    min-height: 100vh;
    background-size: 100% 51%;
    background-position: bottom !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

    .wrap .left .lefttop {
        width: 100%;
        height: 70px;
        background: #fff;
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.1)
    }

        .wrap .left .lefttop .header-select {
            border-right: none
        }

        .wrap .left .lefttop .header-r {
            margin-right: 20px
        }

        .wrap .left .lefttop .header-select .u-select-arrow {
            display: inline
        }

        .wrap .left .lefttop .header-select .u-select-selection-selected-value {
            margin-right: 8px
        }

    .wrap .left .logo {
        height: 20px;
        margin: 25px 0 0 20px
    }

    .wrap .left .clogo {
        height: 30px;
        margin: 20px 0 0 20px
    }

    .wrap .left .applyUse {
        width: 96px;
        height: 32px;
        border-radius: 3px;
        border: 1px solid #ee2223;
        color: #ee2223;
        text-align: center;
        line-height: 30px;
        cursor: pointer;
        float: right;
        margin: 19px 40px 0 0
    }

.login-content {
    width: 410px;
    height: 445px
}

.login-download {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    color: #a2a2a2
}

    .login-download a {
        color: #588ce9
    }

    .login-download.enus a {
        margin-left: 8px
    }

.leftbg {
    width: 400px;
    height: 385px;
    margin: 16px 5px;
    background: #fff;
    box-shadow: 0 0 39px 0 rgba(185,194,204,.3);
    border-radius: 10px
}

.iframe {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 6px;
    overflow: hidden
}

.wrap .video-mark .header span {
    font-size: 5rem;
    font-family: AlibabaPuHuiTi-Medium,AlibabaPuHuiTi;
    font-weight: 500;
    color: #fff;
    letter-spacing: 1rem;
    white-space: nowrap;
    animation: fontAnimation 1s
}

.wrap .video-mark .header.enus p, .wrap .video-mark .header.enus span {
    letter-spacing: 1px
}

.wrap .video-mark .header p {
    font-size: 2.6rem;
    font-family: AlibabaPuHuiTi-Regular,AlibabaPuHuiTi;
    font-weight: 400;
    color: #fff;
    line-height: 3.2rem;
    white-space: nowrap;
    letter-spacing: 1rem;
    margin-top: .5rem;
    animation: fontAnimation 1s
}

.wrap .left .custom {
    margin: 30px auto
}

.wrap .left .custom, .wrap .left .footer {
    font-size: 12px;
    color: #999;
    line-height: 16px;
    text-align: center
}

.wrap .left .footer {
    width: 100%;
    margin: auto auto 30px
}

.footer a {
    color: #999;
    margin-left: 10px
}

.wrap .video-mark .header {
    text-align: center;
    position: absolute;
    width: calc(100vw - 520px);
    top: 36%;
    left: 0
}

    .wrap .video-mark .header img {
        width: 44rem;
        animation: fontAnimation 1s
    }

.wrap .video-mark .header {
    background: none;
    border-bottom: none
}

.wrap.true .left {
    width: 100vw !important
}

@keyframes fontAnimation {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@media screen and (max-width: 950px) {
    .wrap .left {
        width: 100vw !important;
        min-width: 360px !important
    }

    .wrap .video-wrap {
        display: none !important
    }
}

@media screen and (max-width: 400px) {
    .wrap.true .left.zh .logo {
        width: 195px;
        height: auto !important;
        margin: 25px 0 0 5px
    }
}

.u-modal .u-modal-title {
    font-size: 14px
}

.yonbip_text {
    font-size: 16px;
    color: #6a6a6a;
    text-indent: 32px
}

    .yonbip_text a {
        color: #00c;
        cursor: pointer
    }

.button {
    background: linear-gradient(-45deg,#fc4c2f,#ee2223);
    color: #fff;
    border: none;
    box-shadow: none;
    min-width: 60px;
    min-height: 28px;
    line-height: 28px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 3px;
    outline: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center
}


ul.loginTitle {
    margin-left:-20px;
    margin-bottom: 0px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

    ul.loginTitle li {
        font-size: 18px;
        font-weight: 400;
        color: #999;
        position: relative;
        margin-right: 30px;
        line-height: 36px;
        cursor: pointer;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

        ul.loginTitle li:last-child {
            margin-right: 0;
        }

        ul.loginTitle li.select {
            color: #333;
            font-weight: bold
        }

            ul.loginTitle li.select::after {
                content: "";
                background: #EE2223;
                position: absolute;
                left: 0;
                bottom: 0;
                right: 0;
                height: 2px;
                border-radius: 2px;
            }