html,body{
    width: 100%;height: 100%;
    background: url(../images/bg.jpg) no-repeat left top;
    background-size: cover;
}
/* 登录 */
.login_box{
    width: 1020px;
    height: 530px;
    position: absolute;top: 50%;left: 50%;
    transform: translate(-50%,-50%);
}
.login_box .left{
    width: 400px;
}
.login_box .left .head_logo{
    display: block;width: 400px;height: 88px;margin-top: 8px;
}
.login_box .left .slogan{
    font-size: 24px;color: #fff;letter-spacing:20px;
    margin-top: 35px;
}
.login_box .right{
    width: 480px;height: 530px;background: #fff;border-radius: 5px;
}
.login_box .right .form_box{
    width: 320px;
    margin: 0 auto;
    text-align: center;
}
.login_box .right .form_box .title{
    font-size: 30px;margin-top: 40px;margin-bottom: 42px;
}
.login_box .right .form_box .item_input{
    width: 100%;
    height: 40px;
    display: block;
    background:#fff;
    border:1px solid #DADADA;
    border-radius:2px;
    padding-left: 13px;
    box-sizing: border-box;
    margin-bottom: 30px;
}
.login_box .right .form_box .item_input::placeholder
{
    color: #B3B3B3;
}

.login_box .right .form_box .item_line .reg_text,
.login_box .right .form_box .item_line .quick_login_text{
    line-height: 40px;margin-right: 20px;
}
.login_box .right .form_box .item_line .login_btn{
    width:100px;
    height:40px;
    background:#F5F5F5;
    border:1px solid #DADADA !important;
    border-radius:2px;
    font-size: 16px;color: #ccc;
    border: 0;
}
.login_box .right .form_box .item_line .login_btn.active{
    background: #1279F0;color: #fff;border-color: #1279F0 !important;
}
.login_box .right .form_box .sign_box,
.register_box .right .form_box .sign_box{
    margin-top: 155px;line-height: 30px;color: #999;
}
.quick_login .right .form_box .sign_box{
    margin-top: 100px;
}
.login_box .right .form_box .sign_box .sign,
.register_box .right .form_box .sign_box .sign{
    display: block;width: 30px;height: 30px;margin-left: 10px;
}
.login_box .right .form_box .sign_box .sign .icon_img,
.register_box .right .form_box .sign_box .sign .icon_img{
    display: block;width: 30ps;height: 30px;
}
.login_box .home_box{
    width: 64px;
    display: block;
    position: absolute;
    bottom: -108px;
    left: 180px;
    color: #fff;
    text-align: center;
    font-size: 16px;
}
.login_box .home_box .logo_box{
    width: 62px;height: 62px;
    border: 2px solid #fff;
    margin-bottom: 18px;
    box-sizing: border-box;
    border-radius: 2px;
    position: relative;
}
.login_box .home_box .logo_box .logo{
    display: block;width: 47px;height: 47px;
    position: absolute;
    top: 50%;left: 50%;
    transform: translate(-50%,-50%);
}

/* 注册 */
.register_box{
    width: 975px;height: 600px;
    position: absolute;top: 50%;left: 50%;
    transform: translate(-50%,-50%);
}
.register_box .left{
    width: 340px;color: #fff;text-align: center;
}
.register_box .left .title{
    font-size: 24px;margin: 20px 0;
}
.register_box .left .subtitle{
    font-weight: 300;margin-bottom: 52px;
}
.register_box .left .logo_box{
    display: block;
    width: 157px;height: 157px;border: 2px solid #fff;
    border-radius: 2px;line-height: 157px;
    margin: 0 auto;
    position: relative;
}
.register_box .left .logo_box .logo{
    display: block;width: 96px;height: 88px;
    position: absolute;top: 50%;left: 50%;
    transform: translate(-50%,-50%);
}
.register_box .left .nav_box{
    width: 300px;
    margin: 0 auto;
    margin-top: 264px;
    position: relative;
}
.register_box .left .nav_box::before{
    display: block;
    content: "";
    width: 32px;height: 3px;background: #fff;
    position: absolute;
    top: -24px;left: 50%;
    transform: translate(-50%);
}
.register_box .left .nav_box .nav_list li a{
    color: #fff;
}
.register_box .left .nav_box .nav_list li::after{
    display: inline-block;
    content: "|";
    margin: 0 10px;
}
.register_box .left .nav_box .nav_list li:last-of-type::after{
    display: none;
}
.register_box .right{
    width: 480px;height: 650px;background: #fff;border-radius: 5px;
}
.register_box .right .form_box{
    width: 320px;margin: 0 auto;
}
.register_box .right .form_box .title{
    font-size: 30px;margin: 40px 0 20px;text-align: center;
}
.register_box .right .form_box .item_input{
    display: block;
    width: 320px;height: 40px;
    border: 1px solid #DADADA;
    border-radius: 2px;
    margin-bottom: 30px;
    padding-left: 13px;
    box-sizing: border-box;
}
.register_box .right .form_box .item_input::placeholder{
    color: #B3B3B3;
}
.register_box .right .form_box .smscode{margin-bottom: 30px;}
.register_box .right .form_box .smscode .item_input{
    width: 170px;margin-bottom: 0;
}
.register_box .right .form_box .smscode .smsbtn{
    width:134px;
    height:40px;
    background:#f5f5f5;
    border-radius:4px;
    border: 1px solid #DADADA;
    color: #B3B3B3;
    margin-left: 15px;
}
.register_box .right .form_box .smscode .smsbtn.active{
    background: #333;
    color: #fff;
    border-color: #333;
}
.register_box .right .form_box .item_line .checkbox{
    color: #999;
}
.register_box .right .form_box .item_line .checkbox .checkbox_input{
    display: none;
}
.register_box .right .form_box .item_line .checkbox .checkbox_text .proto{
    color: #116DD8;
}
.register_box .right .form_box .item_line .checkbox .checkbox_text::before{
    display: block;
    float: left;
    content: "";
    width: 20px;height: 20px;
    background: url(../images/cheack.png) no-repeat;
    background-size: 100% 100%;
    margin-right: 8px;
}
.register_box .right .form_box .item_line .checkbox .checkbox_input:checked+.checkbox_text::before{
    background: url(../images/cheack_on.png);
}
.register_box .right .form_box .regbtn{
    width:100px;
    height:40px;
    background:#F5F5F5;
    border:1px solid #DADADA;
    border-radius:2px;
    font-size: 16px;
    color: #ccc;
    margin-top: 40px;
}
.register_box .right .form_box .regbtn.active{
    background: #1279F0;color: #fff;border-color: #1279F0;
}
.register_box .right .form_box .sign_box{
    margin-top: 35px;
}
/* 手机号快捷登录 */
.login_box.quick_login .form_box .item_sms_box{
    width: 320px;
}
.login_box.quick_login .form_box .item_sms_box .sms_input{
    width:190px;
    height:40px;
    background:#fff;
    border:1px solid #DADADA;
    border-radius:2px;
    padding-left: 13px;
}
.login_box.quick_login .form_box .item_sms_box .sms_input::placeholder{
    color: #B3B3B3;
    padding-left: 13px;
}
.login_box.quick_login .form_box .item_sms_box .sms_btn{
    width:121px;
    height:40px;
    background:#F5F5F5;
    border:1px solid #DADADA;
    border-radius:2px;
    font-size: 14px;
    color: #B3B3B3;
}
.login_box.quick_login .form_box .item_sms_box .sms_btn.active{
    background: #333;
    color: #fff;
    border-color: #333;
}
.login_box.quick_login .form_box .item_bottom{
    margin-top: 28px;
}
.login_box.quick_login .form_box .item_bottom .reg_btn,
.login_box.quick_login .form_box .item_bottom .pwd_login_btn{
    display: block;
    font-size: 14px;
    color: #333;
    line-height: 40px;
    margin-right: 20px;
}
.login_box.quick_login .form_box .item_bottom .login_btn{
    width:100px;
    height:40px;
    background:#F5F5F5;
    border:1px solid #DADADA;
    border-radius:2px;
    font-size: 16px;
    color: #ccc;
}
.login_box.quick_login .form_box .item_bottom .login_btn.active{
    background: #1279F0;
    color: #fff;
    border-color: #1279F0;
}

.form_box .form-item{
    width: 320px;
    margin-bottom: 30px;
}
.form_box .form-item .items-imgcode .item-input{
    height: 40px;
    display: flex;
}
.form_box .form-item .items-imgcode .item-input #imgcode{
    width: 190px;
    height: 40px;
    margin-right: 10px;
    border:1px solid #DADADA;
    padding-left: 13px;
}
.form_box .form-item .items-imgcode .item-input #imgcode::placeholder{
    color: #B3B3B3;
}
.form_box .form-item .items-imgcode .item-input .verifycode{
    width: 120px;
}


input[type=number] {  
    -moz-appearance:textfield;  
}  
input[type=number]::-webkit-inner-spin-button,  
input[type=number]::-webkit-outer-spin-button {  
    -webkit-appearance: none;  
    margin: 0;  
}