@charset "utf-8";

/* global definitions */
body {
    margin: 0px auto;
    padding: 0px;
    text-align: center;
    background: #fff;
    font-size: 12px;
    color: #000;
    font-family: Helvetica, Tahoma, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", STXihei, STHeiti, Heiti, SimSun, sans-serif;
}

div, table, tr, td {
    margin: 0;
    padding: 0;
    font-size: 12;
}

form, ul, li, img, p {
    margin: 0;
    padding: 0;
    border: 0;
}

hr {
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 1px;
}

h1, h2, h3, h4, h5 {
    margin: 0;
    padding: 0;
}

ul, li {
    list-style-type: none;
}

input {
    outline: none
}

::-webkit-input-placeholder {
    color: #bbb;
    font-size: 14px;
}

:-moz-placeholder {
    color: #bbb !important;
    font-size: 14px;
}

::-moz-placeholder {
    color: #bbb !important;
    font-size: 14px;
}

:-ms-input-placeholder {
    color: #bbb !important;
    font-size: 14px;
}

@media screen and (min-width:1200px) {
    .area {
        width: 1200px;
        margin: 0 auto;
    }

    #showcaseBox {
        width: 100%;
        min-width: 1200px;
    }

    .loginbox {
        margin-left: 240px;
    }
}

@media screen and (max-width:1200px) {
    .area {
        width: 1000px;
        margin: 0 auto;
    }

    #showcaseBox {
        width: 100%;
        min-width: 1000px;
    }

    .loginbox {
        margin-left: 140px;
    }
}

.header {
    width: 100%;
    height: 52px;
    margin: 0 auto;
    padding: 20px 0;
    background: #fff;
}

    .header .logo {
        height: 52px;
        float: left;
        margin-left: 10px;
    }

    .header .greeting {
        height: 30px;
        float: left;
        margin: 16px 12px 0;
        line-height: 30px;
        color: #666;
        font-size: 24px;
        text-align: left;
    }

    .header .menu {
        height: 30px;
        float: right;
        margin: 20px 10px 0;
        line-height: 30px;
        color: #999;
        font-size: 14px;
        text-align: left;
    }

        .header .menu a {
            color: #999;
            text-decoration: none;
        }

            .header .menu a:hover {
                color: #333;
                text-decoration: underline;
            }

    .header .myShopDownloadWarp {
        float: left;
        margin-top: 16px;
        position: relative;
    }

        .header .myShopDownloadWarp .spanText {
            height: 32px;
            padding: 0px 12px 0px 24px;
            line-height: 32px;
            border-radius: 100px;
            background: rgba(0, 136, 221, 0.10);
            text-align: left;
            color: #08D;
            font-family: "PingFang SC";
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            cursor: pointer;
        }

            .header .myShopDownloadWarp .spanText:before {
                content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='14' viewBox='0 0 10 14' fill='none'%3E%3Cpath d='M8.214.5H1.786C1.076.5.5 1.082.5 1.8v10.4c0 .718.576 1.3 1.286 1.3h6.428c.71 0 1.286-.582 1.286-1.3V1.8c0-.718-.576-1.3-1.286-1.3z' stroke='%2308D' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 10.5a1 1 0 1 1 1 1 1 1 0 0 1-1-1z' fill='%2308D'/%3E%3C/svg%3E");
                width: 10px;
                height: 14px;
                position: absolute;
                left: 12px;
                top: 9px;
            }

        .header .myShopDownloadWarp .popContainer {
            display: none;
            text-align: left;
            background: #fff;
            padding: 20px 24px 16px;
            border-radius: 2px;
            box-shadow: 0px 2px 24px 0px rgba(191, 191, 191, 0.50);
            z-index: 99999;
            transform: translateX(-50%);
            left: 50%;
            width: 344px;
            height: 236px;
            box-sizing: border-box;
            color: #222222;
            position: absolute;
            top: 44px;
            cursor: pointer;
            height: auto;
        }

            .header .myShopDownloadWarp .popContainer:before {
                position: absolute;
                content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0L0 8h14L7 0z' fill='%23fff'/%3E%3C/svg%3E");
                width: 14px;
                height: 8px;
                top: -8px;
                left: 50%;
                transform: translateX(-50%);
            }

            .header .myShopDownloadWarp .popContainer .wrapTitle {
                color: #222;
                font-family: "PingFang SC";
                font-size: 16px;
                font-style: normal;
                font-weight: 600;
                line-height: 24px;
            }
        .header .myShopDownloadWarp .andriodDownloadQrCode {
            float: left;
            margin-top: 12px;
            text-align: center;
        }

        .header .myShopDownloadWarp .iosDownloadQrCode {
            float: right;
            margin-top: 12px;
            text-align: center;
        }

        .header .myShopDownloadWarp .downQrCode {
            width: 132px;
            height: 132px;
        }
        .header .myShopDownloadWarp .deviceType {
            font-family: PingFang SC;
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            text-align: center;
            color: #333333;
            margin-top: 12px;
        }

    .loginbox {
        width: 320px;
        height: 420px;
        float: left;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-top: -220px;
        background: #fff;
        background: rgba(255,255,255,.9);
        border-radius: 2px;
        box-shadow: 0 0 10px rgba(0,0,0,.2);
        z-index: 9999;
    }

    .loginbox h1 {
        width: 100%;
        height: 60px;
        float: left;
        border-bottom: 1px solid #ddd;
        color: #8b949b;
        font-size: 20px;
        font-weight: normal;
        line-height: 60px;
        text-align: left;
        text-indent: 20px;
    }

    .loginbox .toScanLogin {
        cursor: pointer;
        position: absolute;
        right: 0;
    }

    .loginbox .toAccountSignIn {
        position: absolute;
        height: 60px;
        line-height: 60px;
        right: 20px;
        color: #08d;
        font-size: 16px;
        cursor: pointer;
    }

.myShopQrCodeContainer {
    position: relative;
    height: 172px;
    padding-top: 32px;
    clear: both;
}

    .myShopQrCodeContainer .qrCode {
        width: 172px;
        height: 172px;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
    }

    .myShopQrCodeContainer .refreshQrCodeBg {
        width: 172px;
        height: 172px;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        background: #000000;
        opacity: 0.6;
        color: #FFFFFF;
    }

    .myShopQrCodeContainer .refreshQrCode {
        color: #FFFFFF;
        position: absolute;
        left: 0;
        right: 0;
        top: 92px;
        margin: auto;
        width: 100px;
        cursor: pointer;
    }

.myShopScanTips {
    margin: 12px 0;
    font-size: 16px;
    line-height: 24px;
    color: #555555;
}

    .myShopScanTips span.icon_myShop {
        font-weight: 600;
    }

        .myShopScanTips span.icon_myShop:before {
            position: relative;
            display: inline-block;
            top: 2px;
            content: ' ';
            width: 20px;
            height: 16px;
            background: url('/images/icon_myShop_logo.png') no-repeat;
        }

.myShopDownloadTips {
    margin: 12px 0;
    font-size: 16px;
    line-height: 24px;
    color: #999999;
}

    .myShopDownloadTips span.fontWeight600 {
        font-weight: 600;
    }

    .myShopDownloadTips span.myShopDownload {
        margin-left: 12px;
        color: #08d;
        cursor: pointer;
        position: relative;
    }

.accountSigninDiv {
    height: 359px;
}

.myShopScanSigninDiv {
    height: 359px;
    clear: both;
}

/*.loginbox input{width:240px; height:16px; padding:12px 8px 12px 30px; line-height:16px; font-size:14px; color:#666; text-align:left; margin:20px 20px 0; float:left; background:#fff; border:1px solid #ccc; border-radius:2px;}
.loginbox input[type="text"]{background-position:8px top;}
.loginbox input[type="password"]{background-position:8px bottom;}
.loginbox input[type="text"]:focus, input[type="password"]:focus{outline:none !important; box-shadow:none; border:1px solid #bbb; box-shadow:inset 0 3px 1px rgba(0,0,0,.1); color:#09c;}
.loginbox input.on{color:#09c;}*/

.loginbox .item {
    width: 278px;
    float: left;
    margin: 20px 20px 0;
    border: 1px solid #ccc;
    border-radius: 2px;
    text-align: left;
    background: #fff;
    position: relative;
    transition: border .3s ease;
}

    .loginbox .item label {
        width: 40px;
        height: 40px;
        line-height: 40px;
        float: left;
        border-right: 1px solid #ccc;
        background: #E8E8E8;
        transition: border .3s ease, background .3s ease;
    }

        .loginbox .item label::after {
            content: " ";
            width: 22px;
            height: 18px;
            margin: 11px 9px;
            line-height: 18px;
            float: left;
            text-align: left;
            text-indent: -9999px;
            overflow: hidden;
            background: url(../images/loginIcon.png);
        }

    .loginbox .item input[type="text"], .item input[type="password"] {
        width: 218px;
        height: 20px;
        line-height: 20px;
        color: #333;
        font-size: 16px;
        padding: 10px 10px 10px 9px;
        border: 0;
        float: left;
        background: #fff;
        margin: 0;
    }

    .loginbox .item input.empty {
        color: #bbb;
        font-size: 14px;
    }

    .loginbox .item.error {
        border: 1px solid #f55;
    }

        .loginbox .item.error label {
            background: #FCE0E4;
            border-color: #e67;
        }

    .loginbox .item.focus {
        border: 1px solid #bbb;
    }

        .loginbox .item.focus label {
            background: #ddd;
            border-right: 1px solid #bbb;
        }

    .loginbox .item.userName label::after {
        background-position: 0 0;
    }

    .loginbox .item.userName.focus label::after {
        background-position: -22px 0;
    }

    .loginbox .item.userName.error label::after {
        background-position: -44px 0;
    }

    .loginbox .item.passWord label::after {
        background-position: 0 -18px;
    }

    .loginbox .item.passWord.focus label::after {
        background-position: -22px -18px;
    }

    .loginbox .item.passWord.error label::after {
        background-position: -44px -18px;
    }

    .loginbox .item.cashierJobName label::after {
        background-position: 0 -47px;
    }

    .loginbox .item.cashierJobName.focus label::after {
        background-position: -22px -47px;
    }

    .loginbox .item.cashierJobName.error label::after {
        background-position: -44px -47px;
    }

.loginbox .submit {
    width: 280px;
    height: 40px;
    margin: 20px 20px 0;
    float: left;
    background: #08d;
    color: #fff;
    text-align: center;
    font-size: 20px;
    line-height: 40px;
    font-weight: normal;
    border-radius: 2px;
    cursor: pointer;
}

    .loginbox .submit:hover {
        background: #25A6EB;
    }

    .loginbox .submit:active {
        background: #016BB8;
    }

.loginbox .forget {
    width: 280px;
    height: 40px;
    margin: 0 20px;
    float: left;
    line-height: 40px;
    font-size: 14px;
    color: #999;
    text-align: right;
}

    .loginbox .forget a {
        color: #999;
        text-decoration: none;
    }

        .loginbox .forget a:hover {
            color: #09c;
            text-decoration: underline;
        }

    .loginbox .forget .operation {
        color: #08d;
        cursor: pointer;
        font-size: 14px;
        float: left;
    }

.loginbox .blank {
    float: left;
    height: 40px;
    width: 100%;
}

.loginbox .registbox {
    width: 280px;
    height: 40px;
    float: left;
    padding: 10px 20px;
    margin-top: 34px;
    background: #edf4fc;
    background: rgba(0,0,0,.03);
    border-top: 1px solid rgba(0,0,0,.05);
}

    .loginbox .registbox span {
        height: 40px;
        line-height: 40px;
        float: left;
        text-align: left;
        font-size: 14px;
        color: #999;
    }

    .loginbox .registbox a {
        width: 160px;
        height: 40px;
        line-height: 42px;
        float: right;
        text-align: center;
        text-indent: -24px;
        font-size: 16px;
        color: #fff;
        background: #ff5555;
        text-decoration: none;
        cursor: pointer;
        border-radius: 2px;
        position: relative;
    }

        .loginbox .registbox a:hover {
            background: #FF4455;
        }

        .loginbox .registbox a:active {
            background: #ff3344;
        }

        .loginbox .registbox a::before {
            content: " ";
            width: 15px;
            height: 12px;
            top: 14px;
            right: 36px;
            position: absolute;
            background: url(../images/loginIcon.png) 0 -36px;
        }

        .loginbox .registbox a:hover::before {
            animation: buzz-out .75s linear infinite;
        }

@keyframes buzz-out {
    25% {
        transform: translateX(3px);
    }

    75% {
        transform: translateX(-3px);
    }
}

.loginbox .tips {
    width: 280px;
    float: right;
    padding: 10px;
    border-radius: 2px;
    background: #fff;
    color: #666;
    line-height: 30px;
    text-align: left;
    font-size: 14px;
    position: absolute;
    top: 0;
    right: 302px;
    opacity: .9;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    z-index: 9999;
}

    .loginbox .tips b {
        width: 30px;
        height: 30px;
        float: left;
        font-size: 24px;
        color: #fff;
        text-align: center;
        background: #f55;
        border-radius: 15px;
        margin: 0 8px 0 0;
    }

    .loginbox .tips span {
        height: 30px;
        float: left;
        text-align: left;
    }

    .loginbox .tips a {
        color: #09c;
    }

        .loginbox .tips a:hover {
            color: #06c;
        }

    .loginbox .tips .tipstext {
        width: 280px;
        float: left;
        line-height: 24px;
        color: #999;
        text-align: left;
        border-top: 1px solid #eee;
        padding: 10px 0 0;
        margin: 10px 0 0;
    }

    .loginbox .tips.accounttips {
        top: 76px;
        display: none;
    }

    .loginbox .tips.posswordtips {
        top: 138px;
        display: none;
    }

    .loginbox .tips.cashiertips {
        top: 138px;
        display: none;
    }

    .loginbox .tips.errortips {
        top: 108px;
        display: none;
    }

    .loginbox .tips .triangle {
        height: 0;
        width: 0;
        border: 10px solid #fff;
        border-color: transparent transparent transparent #fff;
        position: absolute;
        top: 50%;
        right: -20px;
        margin: -10px 0 0;
    }

.windowshadow {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    filter: alpha(Opacity=20);
    background: #000;
    background: rgba(0,0,0,.2);
    display: none;
}

#showcaseBox {
    height: 560px;
    position: relative;
    text-align: center;
    overflow: hidden;
    min-width: 1200px;
}

.showcase {
    width: 100%;
    height: 100%;
    position: absolute;
    text-align: left;
    top: 0;
    left: 0px;
}

    .showcase .area {
        height: 100%;
        position: relative;
    }

    .showcase .linkarea {
        width: 820px;
        height: 100%;
        position: absolute;
        float: left;
        top: 0;
        left: 0;
    }

.bottom {
    width: 100%;
    margin: 0 auto;
    padding: 20px 0;
    clear: both;
    background: #fff;
}

    .bottom a {
        text-decoration: none;
    }

    .bottom .info {
        padding: 5px 0;
        text-align: center;
        font-size: 14px;
        color: #999;
        line-height: 24px;
    }

        .bottom .info a {
            color: #777;
        }

            .bottom .info a:hover {
                color: #333;
                text-decoration: underline;
            }

.bottom {
    opacity: 0.6;
    transition: opacity .5s ease;
}

    .bottom:hover {
        opacity: 1;
    }

/*检测浏览器弹窗*/
.popupBg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background: #000;
    opacity: .2;
    filter: alpha(Opacity=20);
}

.popup {
    position: absolute;
    z-index: 9999;
    top: 50%;
    left: 50%;
    background: #fff;
    border: 1px solid #d1e0ea;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(000,085,136,.4);
    float: left;
    text-align: left;
}

    .popup .popupTitle {
        width: 100%;
        height: 40px;
        float: left;
        background: #f0f9fc;
        background: none;
        border-radius: 6px 6px 0 0;
        border-bottom: 1px solid #d1e0ea;
    }

        .popup .popupTitle.bg {
            background: #f0f9fc;
        }

        .popup .popupTitle h1 {
            height: 40px;
            line-height: 40px;
            color: #09c;
            text-indent: 14px;
            font-size: 12px;
            letter-spacing: normal;
            font-weight: normal;
            overflow: hidden;
        }

        .popup .popupTitle .popupClose {
            width: 21px;
            height: 20px;
            position: absolute;
            top: 10px;
            right: 10px;
            cursor: pointer;
            line-height: 20px;
            text-indent: -2000px;
            overflow: hidden;
            background: url(../images/icon.png) -110px 0 no-repeat;
            border-radius: 3px;
            -o-transition: background-color .2s ease;
            -webkit-transition: background-color .2s ease;
            -moz-transition: background-color .2s ease;
            transition: background-color .2s ease;
        }

            .popup .popupTitle .popupClose:hover {
                background: url(../images/icon.png) -130px 0 no-repeat #6cd;
            }

            .popup .popupTitle .popupClose:active {
                background: url(../images/icon.png) -129px 1px no-repeat #09c;
            }

    .popup .popupArea {
        width: 100%;
        float: left;
        text-align: center;
    }

        .popup .popupArea .popupAreaCenter {
            padding: 15px 20px;
            font-size: 14px;
            text-align: left;
            color: #666;
            line-height: 18px;
        }

        .popup .popupArea h1 {
            font-size: 14px;
            text-align: center;
            color: #09c;
            line-height: 20px;
        }

        .popup .popupArea p {
            text-align: center;
            line-height: 24px;
        }

            .popup .popupArea p.title {
                text-align: left;
                height: 40px;
                line-height: 40px;
                font-size: 16px;
                font-weight: bold;
            }

            .popup .popupArea p.remark {
                text-align: left;
                height: 30px;
                line-height: 30px;
            }

            .popup .popupArea p.line {
                color: #ccc;
                height: 14px;
                margin: 0 0 15px;
                border-bottom: 1px dashed #ccc;
                overflow: hidden;
            }

        .popup .popupArea .browserList ul {
            padding: 16px 10px;
        }

        .popup .popupArea .browserList li {
            float: left;
            margin: 0 30px;
            width: 110px;
        }

            .popup .popupArea .browserList li img {
                width: 80px;
                height: 80px;
                border: none;
                margin: 0 15px;
            }

            .popup .popupArea .browserList li span {
                float: left;
                text-align: center;
                width: 110px;
                height: 30px;
                line-height: 30px;
                cursor: pointer;
                color: #333;
                font-size: 14px;
            }

.nc-container #nc_1_wrapper, .nc-container.tb-login #nc_1_wrapper {
    width: 210px;
}

.nc_scale {
    width: auto;
    height: 40px !important;
    background: #e8e8e8;
}

.nc-container .nc_scale span {
    text-align: center;
    width: 40px;
    height: 40px !important;
    line-height: 40px !important;
}

.nc-container .scale_text.scale_text span[data-nc-lang="_startTEXT"] {
    text-indent: 36px;
}

/*验证码2.0*/
#aliyunCaptcha-errorTip {
    height: 40px !important;
    line-height: 40px !important;
    text-align: center !important;
}

#aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body {
    background: #e8e8e8 !important;
}

    #aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body #aliyunCaptcha-sliding-slider {
        border: 1px solid #ccc !important;
        background: #fff !important;
        color: #737383 !important;
    }

        #aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body #aliyunCaptcha-sliding-slider.ok {
            background: #fff !important;
            color: #76c61d !important;
            font-size: 20px !important;
        }




.loginBoxV2 {
    height: 448px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 12px;
    margin: auto;
    border-radius: 2px;
    background: #FFF;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);
    z-index: 9999;
}

.middleBox {
    width: 1200px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.scanSignIn_box {
    width: 379px;
    height: 100%;
    float: left;
    padding: 32px;
    box-sizing: border-box;
    position: relative;
}

.box_split {
    float: left;
    margin: 32px 0;
    height: 384px;
    border-right: 1px solid rgba(0, 0, 0, 0.10);
}

.regularSignIn_box {
    float: left;
    width: 384px;
    height: 100%;
    padding: 32px;
    box-sizing: border-box;
    position: relative;
}

.scan_title {
    padding-top: 72px;
    color: #262626;
    font-family: "PingFang SC";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

.scanQrCodeContainer .scan_qrCode {
    width: 148px;
    height: 148px;
    margin: auto;
    margin-top: 16px;
    margin-right: 83.5px;
    position: relative;
    transition: margin-right .6s;
    z-index: 1;
}

.scan_qrCode canvas {
    width: 148px;
    height: 148px;
    background: #CCC;
}

.box_split {
    float: left;
    margin: 32px 0;
    height: 384px;
    border-right: 1px solid rgba(0, 0, 0, 0.10);
}

.loginType {
    height: 32px;
    text-align: left;
}

    .loginType .selected {
        color: #262626;
        font-family: "PingFang SC";
        font-size: 24px;
        font-style: normal;
        font-weight: 500;
        line-height: 32px;
        text-align: left;
    }

    .loginType span {
        color: #8C8C8C;
        font-family: "PingFang SC";
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: 28px;
        text-align: center;
        margin-right: 24px;
        cursor: pointer;
    }

.inputRow {
    margin-top: 32px;
    position: relative;
    border-bottom: 1px solid #DEDEDE;
    text-align: left;
}

    .inputRow .loginInput {
        border: none;
        height: 48px;
        width: 100%;
        font-family: "PingFang SC";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 48px;
    }

        /* 设置 placeholder 的样式 */
        .inputRow .loginInput.origin {
            color: #BFBFBF;
            font-family: "PingFang SC";
            font-size: 16px;
        }

    .inputRow .forgetPassword {
        position: absolute;
        right: 0;
        bottom: 12px;
        color: #08D;
        font-family: "PingFang SC";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        cursor: pointer;
        text-decoration: none;
    }

    .inputRow.focus {
        border-color: #08d;
    }

    .inputRow.error {
        border-color: #EB1E25;
    }

        .inputRow.error .errorMsg {
            position: absolute;
            right: 0;
            bottom: -22px;
            color: #EB1E25;
            text-align: right;
            font-family: "PingFang SC";
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 20px;
        }

.submitLoginBtn {
    position: absolute;
    bottom: 72px;
    width: 320px;
    height: 40px;
    box-sizing: border-box;
    background: #08d;
    color: #FFF;
    text-align: center;
    font-family: "PingFang SC";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    cursor: pointer;
    padding: 8px 0;
    border-radius: 2px;
}

.registerTip {
    position: absolute;
    width: 320px;
    text-align: center;
    bottom: 32px;
    color: #8C8C8C;
    font-family: "PingFang SC";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
}

.registBtn {
    cursor: pointer;
    color: #08d;
    text-decoration: none;
}


.scan_tip {
    color: #595959;
    font-family: "PingFang SC";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding-top: 20px;
}

    .scan_tip .downloadMyShop {
        color: #08d;
        cursor: pointer;
        position: relative;
    }

.downloadMyShop.helpTips.active .helpTipContainer {
    display: block;
    -webkit-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;
}

.downloadMyShop.helpTips .helpTipContainer {
    display: none;
    text-align: left;
    border: 1px solid #dedede;
    background: #fff;
    padding: 20px 24px;
    position: absolute;
    border-radius: 3px;
    box-shadow: 0 2px 8px 0 rgba(191,191,191,0.50);
    bottom: 26px;
    z-index: 99;
    left: 123px;
    transform: translateX(-50%);
    width: 344px;
    height: 236px;
    box-sizing: border-box;
    color: #222222;
    height: auto;
}

    .downloadMyShop.helpTips .helpTipContainer:before {
        position: absolute;
        content: '';
        background: url(../images/setting/down_arrow_shadow.png) no-repeat top center;
        width: 100%;
        height: 20px;
        bottom: -20px;
        left: 64px;
        transform: translateX(-50%);
    }


.myShopDownlaodQrCodeContainer .andriodDownloadQrCode {
    float: left;
    margin-top: 12px;
    text-align: center;
}

.myShopDownlaodQrCodeContainer .iosDownloadQrCode {
    float: right;
    margin-top: 12px;
    text-align: center;
}

.myShopDownlaodQrCodeContainer .downQrCode {
    width: 132px;
    height: 132px;
}

.scanQrCodeContainer:not(.expired):hover .scan_qrCode {
    margin-right: 200px;
    transition: margin-right .6s;
}

.scanQrCodeContainer:not(.expired):hover .scanLoginTipImg {
    opacity: 1;
    transition: opacity .1s ease .1s;
}

.scanQrCodeContainer .scanLoginTipImg {
    position: absolute;
    right: 0;
    opacity: 0;
    top: -8px;
}

.scanQrCodeContainer {
    position: relative;
}

    .scanQrCodeContainer:not(.expired):hover .scanLoginTipImg {
        opacity: 1;
        transition: opacity .1s ease .2s;
    }

.refreshQrCodeBg {
    width: 148px;
    height: 148px;
    position: absolute;
    top: 0;
    left: 0;
    background: #000000;
    opacity: 0.6;
    color: #FFFFFF;
}

.refreshQrCodeBtn {
    width: 60px;
    height: 32px;
    line-height: 32px;
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    margin: auto;
    background: #F57D14;
    color: #FFFFFF;
    border-radius: 2px;
    cursor: pointer;
}

.refreshQrCodeTip {
    font-size: 16px;
    line-height: 24px;
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    margin: auto;
    color: #FFFFFF;
    border-radius: 2px;
}

.nodis {
    display: none !important;
}


/* WebKit, Blink, Edge */
::-webkit-input-placeholder {
    color: #BFBFBF;
    font-family: "PingFang SC";
    font-size: 16px;
}
/* Mozilla Firefox 4 to 18 */
:-moz-placeholder {
    color: #BFBFBF;
    font-family: "PingFang SC";
    font-size: 16px;
}
/* Mozilla Firefox 19+ */
::-moz-placeholder {
    color: #BFBFBF;
    font-family: "PingFang SC";
    font-size: 16px;
}
/* Internet Explorer 10-11 */
:-ms-input-placeholder {
    color: #BFBFBF;
    font-family: "PingFang SC";
    font-size: 16px;
}
/* Standard (未来标准) */
::placeholder {
    color: #BFBFBF;
    font-family: "PingFang SC";
    font-size: 16px;
}