/* 登录 */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.login {
    background-color: #F3F3F3;
    width: 650px;
    height: 400px;
    border-radius: 8px 8px 8px 8px;
    position: fixed;
    z-index: 100000;
    left: calc(50% - 325px);
    top: calc(50% - 200px);
}

    .login header {
        padding-left: 36px;
        border-bottom: 1px solid #E8E8E8;
    }

        .login header .logo-line {
            width: 100%;
            height: 60px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

            .login header .logo-line .logo {
                width: 98px;
                height: 36px;
            }

                .login header .logo-line .logo img {
                    /*margin-top: 4px;*/
                    width: 100%;
                    height: 100%;
                }

            .login header .logo-line .logo-discribe {
                font-family: JiangChengLvDongHei, JiangChengLvDongHei;
                font-weight: 400;
                font-size: 18px;
                color: #333333;
                flex-grow: 1;
                margin-left: 20px;
            }

        .login header .quite {
            width: 28px;
            height: 28px;
            margin-right: 16px;
            overflow: hidden;
            /* border: 1px dashed ; */
            /*background: #EEEEEE;*/
            cursor: pointer;
        }

            .login header .quite img {
                width: 28px;
            }

    .login .main {
        display: flex;
        justify-content: center;
        align-items: flex-start;
    }

    .login .left {
        box-sizing: border-box;
        width: 390px;
        padding: 0 30px;
    }

        .login .left .tab {
            margin-top: 20px;
            width: 100%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            font-size: 18px;
            font-family: Microsoft YaHei, Microsoft YaHei;
            font-weight: 400;
            color: #333333;
            line-height: 20px;
        }

            .login .left .tab .wechat-login,
            .login .left .tab .phone-login,
            .login .left .tab .user-login {
                padding-bottom: 4px;
            }

            .login .left .tab .phone-login,
            .login .left .tab .user-login {
                margin-left: 30px;
            }


        /* 手机号登陆 */
        .login .left .login-by-phone {
            width: 288px;
        }

        .login .left .remind {
            height: 12px;
            font-size: 12px;
            line-height: 12px;
            color: #666666;
            padding: 20px 0 12px;
        }

        .login .left .input-phone {
            margin-top: 12px;
            width: 288px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
            display: flex;
            justify-content: center;
            align-items: center;
            align-content: center;
            overflow: hidden;
        }

            .login .left .input-phone div {
                line-height: 44px;
                margin-left: 16px;
                font-size: 15px;
            }

            .login .left .input-phone img {
                width: 10px;
                height: 10px;
                margin-left: 10px;
            }

        .login .left .verify {
            margin-top: 12px;
            width: 288px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
            font-size: 14px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            position: relative;
            /*overflow:hidden;*/
        }

.capslock_info {
    position: absolute;
    left: -12px;
    bottom: -19px;
    visibility: hidden;
    font-size: 12px;
    border: 1px solid;
    border-color: #fdb6b6;
    color: #f17878;
    padding: 4px;
    background-color: #ffffff;
    box-shadow: 0px 1px 2px;
    z-index: 10;
}

.pwd-again {
    position: relative;
}

.pwd {
    position: relative;
}

.login .left .verify .get-button {
    font-size: 14px;
    /* width: 70px; */
    color: #46C663;
    margin-right: 16px;
    flex-shrink: 0;
    text-align: center;
}

/* .login .left .verify .login-phone-code{
            position: relative;
        } */

.login .left .forget-line {
    height: 40px;
    width: 288px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
}

    .login .left .forget-line .word {
        color: #FF2E2E;
    }

    .login .left .forget-line .jump {
        font-size: 14px;
        color: #1370EB;
    }


.find-pwd .left .verify .get-button:hover {
    color: #46C663;
}



/* hover动画 上面结束*/


/* 手机号登陆  */


.login .left .login-button {
    width: 288px;
    height: 44px;
    background-color: #46C663;
    font-size: 16px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
}

.login .agreement {
    margin: 16px 0 0 0;
    text-align: center;
    font-weight: 400;
    font-size: 12px;
    color: #333333;
}

    .login .agreement a {
        text-decoration: none;
        font-weight: 400;
        font-size: 12px;
        color: #1370EB;
    }

.login .center-line {
    width: 1px;
    height: 280px;
    margin-top: 20px;
    border-left: 1px solid #E8E8E8;
}

.login .left input {
    box-sizing: border-box;
    display: block;
    border: 0px;
    width: 288px;
    height: 100%;
    font-size: 14px;
    color: #999999;
    padding: 0 16px;
    border-radius: 4px;
}


.login .right {
    box-sizing: border-box;
    width: 180px;
    /*height: 340px;*/
    flex: 1;
    padding-top: 24px;
}

    .login .right .right-header-title {
        /*text-align: center;*/
        font-family: Microsoft YaHei, Microsoft YaHei;
        font-weight: 400;
        font-size: 18px;
        color: #333333;
        line-height: 20px;
        margin-bottom: 24px;
        padding-left: 67px;
    }

    .login .right .right-content-box {
        /*text-align: center;*/
        padding-left: 50px;
        font-weight: 400;
        font-size: 16px;
        color: #333333;
        line-height: 20px;
        margin-bottom: 16px;
        display: flex;
        align-items: center;
    }

    .login .right .right-content-icon {
        width: 16px;
        height: 16px;
        margin-right: 6px;
    }

    .login .right .line-head {
        width: 100%;
        height: 58px;
        text-align: center;
        line-height: 58px;
        font-size: 18px;
        flood-color: #333333;
        font-weight: bold;
    }

.login .left .code {
    text-align: center;
    height: 180px;
    /*background-color: gray;*/
}

.login .left .line-bottom-one {
    width: 100%;
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    text-align: center;
    margin-top: 20px;
}

    .login .left .line-bottom-one .weixin {
        color: #46C663;
    }

.login .left .line-bottom-two {
    font-weight: 400;
    font-size: 12px;
    color: #666666;
    line-height: 20px;
    margin-top: 5px;
    text-align: center;
}

/* 登录 */


/* 重置密码 */
.find-pwd {
    background-color: #F3F3F3;
    width: 650px;
    height: 450px;
    border-radius: 8px 8px 8px 8px;
    position: fixed;
    z-index: 100001;
    left: calc(50% - 325px);
    top: calc(50% - 225px)
}

    .find-pwd header {
        padding-left: 36px;
        border-bottom: 1px solid #E8E8E8;
    }

        .find-pwd header .logo-line {
            width: 100%;
            height: 60px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

            .find-pwd header .logo-line .logo {
                width: 98px;
                height: 36px;
            }

                .find-pwd header .logo-line .logo img {
                    /*margin-top: 4px;*/
                    width: 100%;
                    height: 100%;
                }

            .find-pwd header .logo-line .logo-discribe {
                font-family: Microsoft YaHei, Microsoft YaHei;
                font-weight: 400;
                font-size: 20px;
                color: #333333;
                flex-grow: 1;
                margin-left: 20px;
            }

        .find-pwd header .quite {
            width: 28px;
            height: 28px;
            margin-right: 16px;
            overflow: hidden;
            /* border: 1px dashed ; */
            background: #EEEEEE;
            cursor: pointer;
        }

            .find-pwd header .quite img {
                width: 28px;
            }

    .find-pwd .main {
        width: 650px;
        height: 390px;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }

    .find-pwd .left {
        box-sizing: border-box;
        width: 390px;
        height: 340px;
        padding: 0 30px;
    }

        .find-pwd .left .tab {
            width: 100%;
            height: 50px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            font-size: 18px;
        }

            .find-pwd .left .tab .reset {
                font-weight: bold;
                font-size: 18px;
                color: #333333;
                line-height: 20px;
            }

        .find-pwd .left .remind {
            height: 12px;
            font-size: 12px;
            line-height: 12px;
            color: #666666;
            visibility: hidden;
        }

        .find-pwd .left .input-phone {
            width: 300px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
        }

        .find-pwd .left .pwd {
            margin-top: 12px;
            width: 300px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
            font-size: 14px;
        }

        .find-pwd .left .pwd-again {
            margin-top: 12px;
            width: 300px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
            font-size: 14px;
        }

        .find-pwd .left .verify {
            margin-top: 12px;
            width: 300px;
            height: 44px;
            border-radius: 4px 4px 4px 4px;
            background-color: #fff;
            font-size: 14px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

            .find-pwd .left .verify .get-button-find {
                font-size: 14px;
                width: 70px;
                color: #1370EB;
                margin-right: 16px;
                flex-shrink: 0;
                text-align: center;
            }

        .find-pwd .left .forget-line-find {
            width: 300px;
            height: 30px;
            color: #FF2E2E;
            font-size: 12px;
            line-height: 30px;
        }

        .find-pwd .left input {
            box-sizing: border-box;
            display: block;
            border: 0px;
            width: 300px;
            height: 100%;
            font-size: 14px;
            color: #999999;
            padding: 0 16px;
        }

        .find-pwd .left .submit-button {
            width: 300px;
            height: 44px;
            background-color: #46C663;
            font-size: 16px;
            color: white;
            display: flex;
            justify-content: center;
            align-items: center;
            box-shadow: 0px 1px 8px 1px rgba(70,198,99,0.5);
            border-radius: 4px 4px 4px 4px;
        }

    .find-pwd .back-button {
        font-size: 14px;
        margin-top: 16px;
        height: 14px;
        line-height: 14px;
        color: #666666;
        cursor: pointer;
    }

    .find-pwd .agreement a {
        text-decoration: none;
        color: #1370EB;
        font-weight: 400;
        font-size: 12px;
        color: #1370EB;
    }

    .find-pwd .center-line {
        width: 1px;
        height: 300px;
        margin-top: 20px;
        border-left: 1px solid #E8E8E8;
    }

    .find-pwd .right {
        box-sizing: border-box;
        width: 296px;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .find-pwd .right img {
            width: 232px;
            height: 212px;
        }

/* 重置密码 */
.background {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 10000;
    background-color: black;
    top: 0px;
    left: 0px;
}

/* 滑动滑块验证  下面开始*/
.test {
    box-sizing: content-box;
    padding: 8px;
    width: 288px;
    position: absolute;
    bottom: -8px;
    left: -8px;
    background-color: #fff;
    border: 1px solid #d7dce0;
}

.test_box {
    width: 288px;
    height: 150px;
    background: url(/Images/new_login/Img/pic2.png) no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.test_img {
    width: 38px;
    height: 52px;
    position: absolute;
    top: 54px;
    left: 0px;
    z-index: 1;
}

    .test_img .center_ {
        width: 38px;
        height: 38px;
        position: absolute;
        background-color: red;
        left: 0px;
        top: 7px;
        background: url(/Images/new_login/Img/pic2.png) no-repeat;
        background-position: 0px -63px;
        background-size: 288px 150px;
    }

    .test_img .top_,
    .test_img .bottom_ {
        width: 13px;
        height: 13px;
        border-radius: 50%;
        background-color: red;
        position: absolute;
        background: url(/Images/new_login/Img/pic2.png) no-repeat;
    }

    .test_img .top_ {
        top: 0px;
        left: 13px;
        background-position: -13px -54px;
        background-size: 288px 150px;
    }

    .test_img .bottom_ {
        top: 39px;
        left: 13px;
        background-position: -13px -93px;
        background-size: 288px 150px;
    }

.test_gap {
    width: 38px;
    height: 52px;
    position: absolute;
    top: 54px;
    left: 100px;
}

    .test_gap .center_1 {
        width: 38px;
        height: 38px;
        position: absolute;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 7px;
    }

    .test_gap .top_1,
    .test_gap .bottom_1 {
        width: 13px;
        height: 13px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        position: absolute;
    }

    .test_gap .top_1 {
        top: 0px;
        left: 13px;
    }

    .test_gap .bottom_1 {
        top: 39px;
        left: 13px;
    }


.test_result_informate {
    width: 288px;
    height: 20px;
    margin: 6px 0px;
    display: flex;
    justify-content: flex-start;
}

    .test_result_informate img {
        margin-left: 10px;
        width: 20px;
        height: 20px;
    }

    .test_result_informate .res_text {
        color: green;
        /*margin-left: 84px;*/
        font-weight: bold;
        font-size: 14px;
        line-height: 20px;
        height: 20px;
        flex-grow: 1;
        text-align: center;
    }

.test_move {
    width: 286px;
    margin: 10px 0px 0px;
    background-color: rgb(241, 241, 241);
    /* border-radius: 10px; */
    height: 38px;
    text-align: center;
    line-height: 38px;
    font-size: 16px;
    border: 1px solid rgb(0 0 0 / 30%);
    border-radius: 3px;
    position: relative;
    font-size: 14px;
}

.colorimg {
    box-sizing: border-box;
    border: 1px solid rgb(89, 253, 231);
    height: 100%;
    width: 0px;
    background-color: #46C663;
    opacity: 0.3;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
}

.test_move .slider {
    cursor: pointer;
    width: 38px;
    height: 38px;
    background-color: #fff;
    position: absolute;
    box-shadow: 0 0 3px rgb(0 0 0 / 0.84);
    border-radius: 3px;
    left: 0px;
    top: 0px;
    z-index: 2;
}

    .test_move .slider:hover {
        background-color: #46C663;
    }

.test_result {
    width: 100px;
    height: 100px;
    background-color: rgba(255, 255, 255, .8);
    box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border-radius: 8px;
    position: absolute;
    z-index: 10;
    left: calc(50% - 50px);
    top: calc(50% - 25px) !important;
}

    .test_result img {
        width: 24px;
        height: 24px;
        margin-top: 26px;
    }

    .test_result span {
        font-size: 12px;
        margin-top: 12px;
    }


/* 滑动滑块验证  截至上面 */


/*重置密码成功的弹窗 下面开始*/
.test_result {
    width: 100px;
    height: 100px;
    background-color: rgba(255, 255, 255, 1);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border-radius: 8px;
    position: absolute;
    z-index: 10;
    left: calc(50% - 50px);
    top: calc(50% - 50px);
}

    .test_result img {
        width: 24px;
        height: 24px;
        margin-top: 26px;
    }

    .test_result span {
        font-size: 12px;
        margin-top: 12px;
    }
/*重置密码成功的弹窗 上面结束*/

/* 全局属性 */
input {
    outline: none;
    color: #333333 !important;
}

.phone-login,
.user-login,
.jump,
.back,
.submit-button,
.login-button,
.get-button,
.get-button-find {
    cursor: pointer;
}

/* 全局 */