body{
    background: #fafafa;
}
.main{
    width:900px;
    height:644px;
    background: #fff;
    border-radius: 4px;
    margin: 50px auto 0 auto;
}

.main-header{
    height:70px;
    background: #fafafa;
}
.main-header img{
    width:144px;
    height:30px;
    float: left;
    margin-top: 20px;
}
.main-header span{
    display: inline-block;
    height:70px;
    line-height: 88px;
    color: #333;
}
.login-prompt1{
    float: left;
    font-size: 16px;
    margin-left: 30px;
}
.login-prompt2{
    float: right;
    font-size: 14px;
    margin-right: 0px;
}
.login-prompt2 a{
    color:#ff003c;
    margin: 0 10px;
}
.login-prompt2 a:hover{
    color:#ff003c!important;
}
.main-header p{
    display: inline-block;
    width: 71px;
    height: 64px;
    line-height: 64px;
    margin:0 0 0 370px;
}
.main-header p img{
    width: 71px;
    height:24px;
    margin-top: 20px;
}

.main-title{
    width:100%;
    height:80px;
    line-height: 80px;
    text-align: center;
    color:#fff;
    font-size: 24px;
    font-weight: bold;
    background: #333;
}

.main-nav{
    width:100%;
    height:34px;
    line-height: 34px;
    text-align: center;
    color:#333;
    font-size: 18px;
    font-weight: 700;
    background: #fff;
    margin-top: 20px;
}

.main-nav span{
    display: inline-block;
    width:50%;
    float: left;
    cursor: pointer;
    border-bottom: 2px solid #e7e4e4;
}

.main-nav span.active-bind-type{
    color:#ff003c;
    border-bottom: 2px solid #ff003c;
}
.login-info{
    width:380px;
    height:335px;
    margin: 60px auto 0 auto;
}
.bind-login-info{
    width:460px;
}
.perfect-data {
    width: 100%;
    height: 48px;
    line-height: 48px;
    margin-bottom: 25px;
    position: relative;
}
.prefect-data-phone{
    position:relative;
}
.perfect-data-verify{
    height: 42px;
    line-height: 42px;
}
.perfect-data-protocol{
    height:24px;
    line-height: 24px;
}
.perfect-data-monitor{
    height: 18px;
    line-height: 18px;
}
.perfect-data-submit{
    margin-bottom: 2px;
}
.perfect-data label{
    width:80px;
    height:54px;
    line-height: 54px;
    float: left;
    text-align: right;
    font-size: 14px;
}
.perfect-data span.phone-area-code-ipt{
    display: inline-block;
    width:64px;
    height:48px;
    float: left;
    color:#333;
    background: #e7e4e4;
    text-align: center;
    cursor: pointer;
    text-indent: 1em;
    border-radius: 4px 0 0 4px;
}
.perfect-data span.phone-area-code-ipt i{
    display: inline-block;
    margin:21px 8px 0 0px;
    float: right;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-top: 6px solid #b5b2b2;
}
.country-lists{
    display: none;
    background: #fff;
    width:120px;
    height:auto;
    max-height:290px;
    overflow-y: auto;
    border:1px solid #e7e4e4;
    border-top:none;
    position: absolute;
    top:54px;
    left:0;
    z-index: 999;
    box-shadow: 0px 2px 8px 2px rgba(0,0,0,.15);
}
.prefect-data-phone .country-lists li{
    width:100%;
    height:36px;
    line-height:36px;
    margin-right: 0px;
    padding:0px 15px;
}
.country-lists li:hover{
    background: #b5b2b2;
    color:#fff;
}

.input-phone,.input-forgot-phone,.input-login-phone{
    float: left;
    width: 316px;
    height:48px;
    border: none;
    background: #e7e4e4;
    padding-left: 10px;
    font-size: 14px;
    border-radius: 0 4px 4px 0;
}
.login-phone{
    float: left;
    width: 380px;
    height:48px;
    border: none;
    background: #e7e4e4;
    padding-left: 10px;
    font-size: 14px;
    border-radius: 4px;
}
.input-code{
    width: 140px;
    height:48px;
    border: none;
    background: #e7e4e4;
    padding-left: 10px;
    border-radius: 4px;
}
.login-info button{
    width: 342px;
    height:44px;
    border: none;
    background: #ff003c;
    color:#ffffff;
    font-size: 14px;
    cursor: pointer;
    float: left;
    border-radius: 4px;
}
.login-info button.send-code{
    width: 140px;
    height:48px;
    color:#333;
    border: 1px solid #e7e4e4;
    background: #fff;
    margin-left: 10px;
}
.login-info button.ordinary-register{
    width:184px;
    margin-right: 10px;
}
.login-info button.merchant-register{
    width:184px;
    background: #e7e4e4;
    color:#333;
}
.login-info button.next-register,.login-info button.reset-password{
    width:100%;
}
.login-info button.login-submit{
    width:100%;
    font-size: 16px;
}
.login-info button.bind-login-account,
.login-info button.bind-reg-account
{
    width: 380px;
    float: right;
}
.login-info p{
    float: left;
    width: auto;
    height:24px;
    line-height: 24px;
    margin: 0 0 20px 0px;
    text-align: left;
    position: relative;
}
/*#remember{
    width:10px;
    height:10px;
    margin-right: 5px;
}*/

checkbox{
    width:100px;
    height:100px;
}
.input-c{
    zoom: 150%;
    margin: 0;
    border: 1.2px solid #dcdcdc;
    background: #ffffff;
    position: absolute;
    top:1px;
    left:0px;
    cursor: pointer;
}
.remember-pwd{
    margin-left: 22px;
}
.reg-reset-pwd{
    display: inline-block;
    float: right;
/*    margin-left: 176px  ;*/
    margin-left: 282px  ;
}
.login-info p span.remember-pwd,.login-info p span.reg-reset-pwd a{
   color:#b5b2b2;
}
.login-info p span.reg-reset-pwd a:hover{
    color:#666!important;
}
.login-info p.other-login{
    height:50px;
    line-height: 50px;
    margin-right: 30px;
}

.login-info p span{
    font-size: 14px;
    color:#666666;

}
.login-info p span a{
    color:#ff6600;
}
.login-info p span a:hover{
    color:#ff6600!important;
}

.forget-pwd{
    float: right;
}
.forget-pwd a{
    font-size: 14px;
    color:#666666;
}
.other-login{
    font-size: 14px;
    color:#666666;
}
.perfect-data ul{
    float: left;
    width:auto;
}
.perfect-data ul li{
    width: 50px;
    height: 50px;
    float: left;
    margin-right: 30px;
    cursor: pointer;
}
.wechat_login{
    background: url(../images/wechat-c.svg)no-repeat;
}
.wechat_login:hover{
    background: url(../images/wechat-t.svg)no-repeat;
}
.qq_login{
    background: url(../images/qq-c.svg)no-repeat;
}
.qq_login:hover{
    background: url(../images/qq-t.svg)no-repeat;
}
.sina_login{
    background: url(../images/sina-c.svg)no-repeat;
}
.sina_login:hover{
    background: url(../images/sina-t.svg)no-repeat;
}
.wechat_login,.qq_login,.sina_login{
    background-size: 50px 50px;
}
.wechat_login:hover,.qq_login:hover,.sina_login:hover{
    background-size: 50px 50px;
}

/*å®åèµæ*/
.input-username,.input-password{
    float: left;
    width: 380px;
    height:48px;
    border: none;
    background: #e7e4e4;
    padding-left: 10px;
    font-size: 14px;
    border-radius: 4px;
}
.login-info button.complete-register{
    width:380px;
}
.perfect-data-monitor p{
    height:18px;
    line-height: 18px;
    float: left;
    font-size: 12px;
    margin-left: 20px;
    color:#333;
}
.perfect-data-monitor p span{
    font-size: 12px;
    color:#333;
}



.login-info .select-1{
    width: 335px;
    height: 40px;
    border-radius: 4px;
    border: 1.2px solid #dcdcdc;
    background: #fafafa;
    padding-left: 7px;
    margin-bottom: 20px;
    font-size: 14px;
    cursor: pointer;
}

.input-city,.input-career{
    border: 1px solid #e5e5e5;
    background: #fafafa;
    width: 312px;
    height: 42px;
    line-height: 42px;
    border-radius: 4px;
    padding: 0 15px;
    cursor: pointer;
    margin: 0 auto 20px auto;
}
.input-city span,.input-career span{
    font-size: 14px;
    color: #666666;
    height: 42px;
    line-height: 42px;
    float: left;
}
.input-city i,.input-career i{
    display: inline-block;
    width: 9px;
    height: 6px;
    float: right;
    margin: 18px 0 0 12px;
    background: url(../images/select.svg)no-repeat;
}

/*ç»éé¡µé¢*/
.login-header{
    width:1230px;
    height:90px;
    margin: 0 auto;
}
.login-header img{
    margin-top: 30px;
}
.login-main{
    width:100%;
    height:580px;
    line-height: 580px;
    text-align: center;
    position: relative;
}
.container {
    position: relative;
}
.input-data {
    width:1230px;
    height:580px;
    /*position: absolute;*/
    /*top:-580px;*/
    /*left:0;*/
    margin: 0 auto;
}
.input-login-data{
    width:440px;
    height:500px;
    background: #fff;
    float: right;
    margin-top: 40px;
    border-radius: 4px;
}
.login-mode{
    width:auto;
    height:48px;
    margin: 20px 0 20px 30px;
}
.login-mode ul li{
    width:124px;
    height:48px;
    line-height: 48px;
    float: left;
    text-align: center;
    font-size: 16px;
    margin-right: 10px;
    cursor: pointer;
}
.login-mode li.select-login-mode{
    border-bottom: 2px solid #ff003c;
}
.input-login-data  .login-info{
    margin-top: 40px;
}