.logo_nav {
    position: relative;
    font-size: 22px;
    letter-spacing: 1px;
    width: 100%;
    background-color: white;
    height: 50px;
    box-shadow: 0 2px 4px #00000014;
}

.logo_nav img {
    width: 200px;
    cursor: pointer;
}


.center_input {
    position: relative;
    width: 500px;
    height: 500px;
    margin: 0 auto;
    text-align: center;
    padding-right: 76px;
    font-size: 16px;
}

.logoText {
    font-size: 28px;
    margin-top: 100px;
    padding-left: 50px;
    color: #30549A;
}

.emailIptDiv {
    margin-top: 45px;
}

.emailIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;
}

.verificationDiv {
    margin-top: 23px;
    padding-left: 16px;
}


.verificationIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;
}

.verificationA {
    position: absolute;
    left: 320px;
    top: 151px;
    color: #30549A;
    border-bottom: 1px solid #30539a00;
    padding: 0 2px;
}

.verificationA:hover {
    color: #586f9c;
    border-bottom: 1px solid #30549A;
}

.forget_usernameBtnDiv {
    margin-top: 30px;
    padding-left: 78px;
}

.forget_usernameBtn {
    width: 300px;
    height: 40px;
    border: 0px;
    font-size: 17px;
    border-radius: 4px;
    background: linear-gradient(90deg, #30549A,#30549A);
    color: white;
}

.not_verificationDiv {
    font-size: 10px;
    margin-top: 15px;
    padding-left: 74px;
}

.not_verificationDiv a{
    text-decoration: underline;
    cursor: pointer;
}

.not_verificationDiv a:hover {
    color: red;
}


.NextCenterBar {
    position: relative;
    width: 500px;
    height: 500px;
    margin: 0 auto;
    text-align: center;
    padding-right: 76px;
}

.NextCenterBar div {
    margin-top: 23px;
}

.logoText {
    margin-top: 100px !important;
    margin-bottom: 45px;
}

.usernameIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;
    cursor: default;
}

.username_tip {
    position: absolute;
    left: 93px;
    top: 124px;
    font-size: 13px;
    color: #ff82b6;
}

.passwordDiv {
    margin-left: 16px;
}

.passwordIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;
}

.nicknameDiv {
    margin-left: 16px;
}

.nicknameIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;
}

.sexDiv {
    margin-left: 16px;
}

.sex_ipt {
    width: 322px;
    height: 38px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding-left: 10px;
    margin-left: 10px;
    color: #757575;
}

.ageDiv {
    margin-left: 16px;
}

.ageIpt {
    width: 300px;
    height: 16px;
    font-size: 16px;
    border: 1px solid rgb(214 214 214);
    border-radius: 4px;
    outline: none;
    padding: 18px 10px;
    margin-left: 10px;

}


.establishBtnDiv {
    margin-top: 60px !important;
    margin-left: 62px;
}

.establishBtn {
    width: 300px;
    height: 40px;
    border: 0px;
    font-size: 17px;
    border-radius: 4px;
    background: linear-gradient(90deg, #30549A,#30549A);
    color: white;

}

.usernameTip {
    position: absolute;
    left: 126px;
    top: 120px;
    width: 314px;
    font-size: 14px;
    color: #ff7fb4;
}

.passwordTip {
    position: absolute;
    left: 119px;
    top: 182px;
    width: 314px;
    font-size: 14px;
    color: #ff7fb4;
}

.nicknameTip {
    position: absolute;
    left: 127px;
    top: 243px;
    width: 340px;
    font-size: 14px;
    color: #ff7fb4;
}

@media screen and (max-width: 800px) {

    body,
    html {
        background: #f8f8f8;
    }

    .Hearder_nav {
        background: white;
    }

    .logoText {
        padding: 0;
        margin-top: 2rem !important;
    }

    .center_input {
        padding: 0 3rem;
        width: auto;
    }

    .emailText,
    .verificationText {
        display: none;
    }

    .emailIpt,
    .verificationIpt {
        margin-left: 0;
        font-size: 1.3rem;
        padding: 1.5rem 1.5rem;
        text-align: center;
        border: none;
        border-radius: 5px;
        width: 100%;
    }

    .verificationDiv {
        position: relative;
        padding-left: 0;
    }

    .verificationA {
        top: 0;
        right: 0;
        left: unset;
        height: 100%;
        display: flex;
        align-items: center;
        padding: 0 1rem;
        font-size: 1.2rem;
        text-decoration: none;
    }

    .registerBtnDiv,
    .not_verificationDiv,
    .agreement_btn {
        padding: 0;
    }

    .logo_item {
        margin-top: 0;
    }

    .NextCenterBar {
        width: auto;
        padding-right: 0;
        top: 0;
    }

    .usernameText,
    .passwordText,
    .nicknameText,
    .phoneText,
    .vxText {
        display: none;
    }

    .usernameDiv,
    .passwordDiv,
    .nicknameDiv,
    .phoneDiv,
    .vxDiv {
        position: relative;
        margin-left: 0;
    }

    .next_passwordIpt,
    .usernameIpt,
    .passwordIpt,
    .nicknameIpt,
    .phoneIpt,
    .vxIpt {
        width: 100%;
        margin-left: 0;
        font-size: 1.3rem;
        padding: 1.5rem 1.5rem;
        border: none;
        text-align: center;
    }

    .usernameTip,
    .passwordTip,
    .nicknameTip,
    .phoneTip,
    .vxTip {
        width: auto;
        left: 0;
        top: 3rem;
        white-space: nowrap;
    }

    .NextCenterBar {
        padding: 0 3rem;
        width: auto;
    }

    .establishBtnDiv {
        margin-left: 0;
    }

    .registerBtn, .establishBtn {
        width: 100%;
        height: 40px;
    }

    .forget_passwordBtnDiv {
        padding-left: 0;
    }

    .next_passwordDiv {
        position: relative;
        margin-left: 0;
    }

    .next_passwordText {
        display: none;
    }

    .password_tip {
        left: 0;
        top: 3rem;
        display: none;
    }

    .next_password_tip {
        top: 3rem;
        left: 0;
        display: none;
    }

    .forget_usernameBtnDiv {
        padding-left: 0px;
        
    }

    .forget_usernameBtn {
        width: 100%;
    }

    .username_tip {
        left: 0;
        top: 3rem;
    }
}