.newweb-head {
    height: 80px;
    min-height: 80px;
    background: linear-gradient(45deg, #014baa, #0099ff);
}

.kg-login {
    height: 50px;
}

.base-title-line {
    width: 320px;
    margin: 0 auto;
    padding-top: 20px;
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
}

    .base-title-line .sp1, .base-title-line .sp3 {
        width: 130px;
        height: 2px;
        background: var(--mrlight)
    }

    .base-title-line .sp2 {
        width: 60px;
        height: 20px;
        position: relative;
    }

        .base-title-line .sp2:before {
            position: absolute;
            left: calc(50% - 10px);
            width: 20px;
            height: 20px;
            display: block;
            background: var(--mrlight);
            content: "";
            webkit-transform: rotate(45deg);
            transform: rotate(45deg);
            transform-origin: center center;
        }

.form-container {
    margin: 0 20px;
    background: #fff;
    border-radius: 10px;
    background: #fff;
    padding: 50px 30px;
    width: auto;
    height: auto;
    box-shadow: 0px 0px 3px 0 rgba(0, 0, 0, .13);
}

.get-code-tabs {
    border-bottom: 1px #ddd solid;
}

    .get-code-tabs .get-code-type-tab {
        padding: 0px 0 20px 0;
        width: 240px;
        text-align: center;
        font-size: 30px;
        position: relative;
        background: #fff;
    }

        .get-code-tabs .get-code-type-tab.active {
            color: var(--mr);
            font-weight: bold;
        }

            .get-code-tabs .get-code-type-tab.active:before {
                position: absolute;
                bottom: -2px;
                height: 4px;
                left: 0;
                width: 100%;
                content: "";
                background: var(--mr);
                border-radius: 3px;
            }

.login-title {
    font-size: var(--size);
    line-height: 1;
    padding-bottom: 10px;
}

.login-title-wrod {
    padding-left: 10px;
}

/*手機登錄*/
.number-div {
    position: relative;
    height: 80px;
}

    .number-div .num-852 {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 80px;
        padding-left: 20px;
        font-size: var(--size-s1);
    }

    .number-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 100px;
        padding-right: 20px;
        font-size: var(--size);
        width: 100%;
    }

#phone-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0px;
}

/*郵箱登錄*/
.email-div {
    position: relative;
    height: 80px;
}

    .email-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 20px;
        padding-right: 20px;
        font-size: var(--size);
        width: 100%;
    }

#email-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0px;
}

/*密碼*/
.password-div {
    position: relative;
    height: 80px;
}

    .password-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 20px;
        padding-right: 100px;
        font-size: var(--size);
        width: 100%;
    }

#password-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0px;
}

#password-toggle {
    position: absolute;
    top: 0;
    right: 0;
    padding-right: 20px;
    padding-left: 20px;
    line-height: 80px;
    font-size: var(--size);
}
/*驗證碼  */

.captcha-div {
    position: relative;
    height: 80px;
}

    .captcha-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 20px;
        padding-right: 20px;
        font-size: var(--size);
        width: 100%;
    }

#captcha-code-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0px;
}

#captcha-image-base64 {
    height: 80px;
    margin-left: 20px;
}

/*登錄按鈕*/
#submit-button, #get-code-button {
    font-size: var(--size-b1);
    height: 80px;
    line-height: 80px;
    border-radius: 80px;
    width: 100%;
    display: block;
}

.form-container #submit-button.disabled-control,
.form-container #get-code-button.disabled-control {
    background: var(--light);
    color: var(--mr);
}

.form-container #submit-button,
.form-container #get-code-button {
    background: var(--mr);
    color: var(--white);
}

.sign-title {
    font-size: var(--size);
    line-height: 1;
    padding-bottom: 10px
}

.sign-title-wrod {
    padding-left: 10px
}


/*忘記密碼*/
.button-signup-login {
    font-size: var(--size-s1);
    height: 72px;
    line-height: 72px;
    border-radius: 72px;
    border: 1px var(--light) solid;
    color: var(--mr);
    padding: 0 60px;
    background: #f4f4f4;
}

.button-signup {
    font-size: var(--size-s1);
    height: 72px;
    line-height: 72px;
    border-radius: 72px;
    border: 1px var(--light) solid;
    color: var(--mr);
    padding: 0 60px;
    background: #f4f4f4;
}

.sign-tipsword {
    font-size: var(--size-s2);
    color: #666;
    line-height: 1.4
}


.code-div {
    position: relative;
    height: 80px;
}

    .code-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 60px;
        padding-right: 20px;
        font-size: var(--size);
        width: 100%;
    }

    .code-div .fa-mobile {
        font-size: var(--size-b2);
        margin-right: 10px;
        display: block;
        line-height: 80px;
        height: 80px;
        position: absolute;
        left: 0;
        top: 0;
        padding-left: 20px;
    }

    .code-div .fa-mail {
        font-size: var(--size-b2);
        margin-right: 10px;
        display: block;
        line-height: 80px;
        height: 80px;
        position: absolute;
        left: 0;
        top: 0;
        padding-left: 20px;
    }

#open-get-code-modal {
    font-size: var(--size-b1);
    height: 80px;
    line-height: 80px;
    border-radius: 80px;
    width: 100%;
    display: block
}

    #open-get-code-modal.disabled-control {
        background: var(--light);
        color: var(--mr)
    }

#open-get-code-modal {
    background: var(--mr);
    color: var(--white)
}

#code-input-group {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    grid-gap: 20px
}

    #code-input-group .code-input {
        height: 80px;
        line-height: 80px;
        text-align: center;
        font-size: var(--size-b2)
    }

#code-success .mask-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
}

#phone-email-mask {
    color: var(--orange-dark);
    font-weight: bold;
}

#code-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0
}

.password-div {
    position: relative;
    height: 80px
}

    .password-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 60px;
        padding-right: 100px;
        font-size: var(--size);
        width: 100%
    }

    .password-div i.fa-lock {
        font-size: var(--size);
        margin-right: 10px;
        display: block;
        line-height: 80px;
        position: absolute;
        top: 0;
        left: 0;
        padding-left: 20px
    }

#password-strength .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0;
    color: #ef4444 !important
}

#password-strength.strength-weak .error-word {
    color: #ef4444 !important
}

#password-strength.strength-medium .error-word {
    color: #f59e0b !important
}

#password-strength.strength-strong .error-word {
    color: #10b981 !important
}

#password-error .error-word, #confirm-password-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 0;
    color: var(--red)
}

#password-toggle, #confirm-password-toggle {
    position: absolute;
    top: 0;
    right: 0;
    padding-right: 20px;
    padding-left: 20px;
    line-height: 80px;
    font-size: var(--size)
}

#submit-button {
    font-size: var(--size-b1);
    height: 80px;
    line-height: 80px;
    border-radius: 80px;
    width: 100%;
    display: block
}

.form-container #submit-button.disabled-control {
    background: var(--light);
    color: var(--mr)
}

.form-container #submit-button {
    background: var(--mr);
    color: var(--white)
}

.email-div {
    position: relative;
    height: 80px
}

    .email-div i.fa-envelope {
        font-size: var(--size-s2);
        margin-right: 10px;
        display: block;
        line-height: 80px;
        position: absolute;
        top: 0;
        left: 0;
        padding-left: 20px
    }

    .email-div input {
        height: 80px;
        line-height: 78px;
        padding-left: 60px;
        padding-right: 20px;
        font-size: var(--size);
        width: 100%
    }

#email-error .error-word {
    font-size: var(--size-s2);
    padding-top: 10px;
    padding-left: 20px
}