html,body{height: 100%;}
.clear-fix:after{content: " "; clear: both; display: table;}
body, div, header, footer, span, ul, li, img, dl, dd, dt, a, label, input{margin: 0; padding: 0; border: 0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}

/*表单样式*/
.form-body{}
.form-body .error-alert{color: red; text-align: center;}
.form-body .error-alert .msg-wrap{position: relative;}
.form-body .form-group{padding-top: 12px; position: relative; border-bottom: 1px solid #ededed;}
.form-body .form-group>input{height: 48px; width: 100%; border: 0; padding: 0 15px; font-size: 20px; color: #333;}
.form-body .form-group>input.has-icon{padding-left: 56px;}
.form-body .form-group>input.has-label{padding-left: 130px;}
.form-body .form-group>input::-webkit-input-placeholder{font-size:16px; color: #848589; font-weight: 300;}
.form-body .form-group>input:-moz-placeholder{font-size:16px; color: #848589; font-weight: 300;}
.form-body .form-group>input::-moz-placeholder{font-size:16px; color: #848589; font-weight: 300;}
.form-body .form-group>input:-ms-input-placeholder{font-size:16px; color: #848589; font-weight: 300;}
.form-body .form-group>.icon{position: absolute; width: 28px; height: 28px; left: 0; bottom: 10px;}
.form-body .form-group>.icon.user{background: url(../images/login_icon_user.png) no-repeat center; background-size: contain;}
.form-body .form-group>.icon.password{background: url(../images/login_icon_password.png) no-repeat center; background-size: contain;}
.form-body .form-group>.icon.verification{background: url(../images/login_icon_verification.png) no-repeat center; background-size: contain;}
.form-body .form-group>.label{position: absolute; width: 100px; line-height: 32px; text-align: center; height: 32px; left: 0; bottom: 6px; border-right: 1px solid #ededed;}
.form-body .form-group>.label.telephone-code{color: #0e97e6; font-size: 22px; cursor: pointer; padding-right: 32px; background: url(../images/login_btn_unfolded.png) no-repeat center right 20px;}
.form-body .form-group>.telephone-code-select{position: absolute; width: 100px; height: 32px; left: 0; bottom: 6px; color: transparent;}
.form-body .form-group>.telephone-code-select>option{color: #333; font-size: 16px;}
.form-body .form-group .verification-img{height: 46px; position: absolute; right: 0; top: 50%; margin-top: -23px;}
.form-body .form-group .verification-img img{height: 100%;}
.form-body .form-group .verification-time{display: inline-block; height: 32px; line-height: 32px; width: 64px; border-radius: 4px; border: 1px solid #0e97e6; color: #0e97e6; font-size: 16px; text-align: center; position: absolute; right: 0; top: 50%; margin-top: -16px;}
.form-body .form-group .verification-time.disabled{border: 1px solid #ededed; color: #b2b2b2;}
.form-action{}
.form-action .btn{display:block; width: 100%;height: 46px; border-radius: 6px; background-color: #0e97e6; text-align: center; line-height: 46px;font-size: 18px; color: #fff; margin-top: 36px;}
.form-action .btn:hover{opacity: 0.8;}

.login-page{height: 100%; padding-top: 80px; position: relative;}
.login-page .screen-inner{width: 1160px; margin: 0 auto;}
.login-page .screen-inner:before, .login-page .screen-inner:after{display: table; content: " ";}
.login-page .login-header{width: 100%; background-color: #fff; position: absolute; left: 0; top: 0;}
.login-page .login-header .logo-bar{}
.login-page .login-header .logo-bar .logo-text{height: 80px; line-height: 74px; background: url(../images/home_defoult_icon_logo.png) no-repeat left center; padding-left: 216px; padding-top: 6px; font-size: 20px; color: #848589;}
.login-page .login-content{height: 100%; min-height: 560px; background-color: #e7f3fb;}
.login-page .login-content .login-wrap{height: 100%; background: url(../../../../images/login-ad.png) no-repeat 100px center; position: relative; display: none;}
.login-page .login-content .modal-box{width: 420px; height: 560px; background-color: #fff; box-shadow: 3px 2px 3px 0 rgba(0, 0, 0, 0.1); border: 1px solid #bce5fd; position: absolute; right: 0; top: 50%; margin-top: -280px; padding: 30px;}
.login-page .login-content .modal-box .login-type-switch{height: 50px; width: 50px; position: absolute; top: 10px; right: 10px; cursor: pointer;}
.login-page .login-content .modal-box .login-type-switch.pc{background: url(../images/login_btn_pc.png) no-repeat;}
.login-page .login-content .modal-box .login-type-switch.qrcode{background: url(../images/login_btn_qrcode.png) no-repeat;}

/*登陆-注册*/
.login-page .login-content .modal-box .tab-bar{}
.login-page .login-content .modal-box .tab-bar .tab-header{}
.login-page .login-content .modal-box .tab-bar .tab-header .tab-list{padding: 0 50px;white-space: nowrap; text-align: center;}
.login-page .login-content .modal-box .tab-bar .tab-header .tab-list .tab-record{width: 50%; display: inline-block; text-align: center;}
.login-page .login-content .modal-box .tab-bar .tab-header .tab-list .tab-record>span{display: inline-block; font-size: 24px; padding: 0 6px; font-weight: 500; color: #333; line-height: 45px; border-bottom: 2px solid transparent;}
.login-page .login-content .modal-box .tab-bar .tab-header .tab-list .tab-record.active>span{color: #0e97e6; border-bottom: 2px solid #0e97e6;}
.login-page .login-content .modal-box .tab-bar .tab-content{}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record{display: none;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record.active{display: block;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list{margin-top: 20px; height: 20px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list .remember-password{display: inline-block; float: left; line-height: 20px; padding-left: 28px; background: url(../images/login_choosekbox.png) no-repeat left center;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list .remember-password.active{background: url(../images/login_choosekbox_sel.png) no-repeat left center;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list .forgot-password{display: inline-block; float: right; line-height: 20px; font-size: 14px; color: #0e97e6;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list .agreement{line-height: 20px; width: 100%; text-align: center;font-size: 14px; color: #b2b2b2;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-option-list .agreement>a{color: #0e97e6;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other{margin-top: 30px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-title{position: relative; text-align: center; line-height: 20px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-title:after{content: ""; width: 100%; border-bottom: 1px solid #ededed; position: absolute; left: 0; top: 50%; margin-top: -0.5px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-title>span{font-size: 14px; padding: 0 10px; text-align: center; color: #b2b2b2; background-color: #fff;position: relative; z-index: 1;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-list{text-align: center; margin-top: 20px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-list .login-other-record{display: inline-block; width: 44px; height: 44px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-list .login-other-record.weixin{background: url(../images/login_icon_wechat.png) no-repeat center; background-size: 100%;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .login-body{padding-top: 26px;}
.login-page .login-content .modal-box .tab-bar .tab-content .content-record .register-body{padding-top: 26px;}

/*扫码登陆*/
.login-page .login-content .modal-box .qrcode-bar,.login-page .login-content .modal-box .register-qrcode-bar{display: none;}
.login-page .login-content .modal-box .qrcode-bar .qrcode-content{}
.login-page .login-content .modal-box .qrcode-bar .qrcode-content .qrcode-img,
.login-page .login-content .modal-box .register-qrcode-bar .register-qrcode-content .register-qrcode-img{text-align: center;}
.login-page .login-content .modal-box .qrcode-bar .qrcode-content .other-option,
.login-page .login-content .modal-box .register-qrcode-bar .register-qrcode-content .other-option{margin-top: 42px; text-align: center;}
.login-page .login-content .modal-box .qrcode-bar .qrcode-content .other-option .option-record,
.login-page .login-content .modal-box .register-qrcode-bar .register-qrcode-content .other-option .option-record{font-size: 18px; text-align: center; color: #333; display: inline-block; line-height: 20px; padding: 0 20px; border-right: 1px solid #979797;}
.login-page .login-content .modal-box .qrcode-bar .qrcode-content .other-option .option-record:last-child,
.login-page .login-content .modal-box .register-qrcode-bar .register-qrcode-content .other-option .option-record:last-child{border-right: 0;}

/*重置密码*/
.login-page .login-content .modal-box .password-bar{display: none;}
.login-page .login-content .modal-box .password-bar .verification-body{display: none;}
.login-page .login-content .modal-box .password-bar .reset-body{display: none;}
.login-page .login-content .modal-box .password-bar .password-bar-head{font-size: 24px; text-align: center; color: #333; padding-top: 41px;}
.login-page .login-content .modal-box .password-bar .body-content{margin-top: 52px;}
.login-page .login-content .modal-box .password-bar .body-content .login-now{font-size: 18px; text-align: center; color: #333; margin-top: 86px;}
.login-page .login-content .modal-box .password-bar .body-content .login-now>a{color: #0e97e6;}

/*重置成功*/
.login-page .login-content .reset-success-wrap{padding-top: 120px; display: none;}
.login-page .login-content .reset-success-wrap .success-content{padding-top: 150px; background: url(../images/login_icon_success.png) no-repeat top center;}
.login-page .login-content .reset-success-wrap .success-content .success-text{line-height: 48px; font-size: 34px; text-align: center; color: #0e97e6;}
.login-page .login-content .reset-success-wrap .success-content .success-operate{margin-top: 50px; text-align: center;}
.login-page .login-content .reset-success-wrap .success-content .success-operate>a{font-size: 18px; color: #333; display: inline-block; line-height: 25px;}

@media (max-width: 1280px) and (min-width: 992px) {
    .login-page .screen-inner{width: 960px; margin: 0 auto;}
}

@media (max-width: 992px) and (min-width: 320px) {
    .form-body .form-group{padding-top: 6px;}
    .form-body .form-group>.icon{bottom: 8px; width: 20px; height: 20px;}
    .form-body .form-group>.label{height: 24px; line-height: 24px; width: 80px;}
    .form-body .form-group>.label.telephone-code{background: url(../images/login_btn_unfolded.png) no-repeat center right 10px; font-size: 16px;}
    .form-body .form-group>.telephone-code-select{height: 24px; width: 80px;}
    .form-body .form-group>input{height: 36px;}
    .form-body .form-group>input::-webkit-input-placeholder{font-size:14px;}
    .form-body .form-group>input:-moz-placeholder{font-size:14px;}
    .form-body .form-group>input::-moz-placeholder{font-size:14px;}
    .form-body .form-group>input:-ms-input-placeholder{font-size:14px;}
    .form-body .form-group>input.has-icon{padding-left: 40px;}
    .form-body .form-group>input.has-label{padding-left: 100px;}
    .form-body .form-group .verification-time{height: 24px; line-height: 24px; width: 50px; font-size: 12px; margin-top: -12px;}
    .form-body .form-group .verification-img{height: 32px; margin-top: -16px;}
    .login-page .login-header .logo-bar .logo-text{padding: 0; width: 100%; background-position: center;}
    .login-page .login-header .logo-bar .logo-text>span{display: none;}
    .login-page .screen-inner{width: 100%; margin: 0 auto; padding: 0 15px; overflow-x: hidden;}
    .login-page .login-content{min-height: 380px;}
    .login-page .login-content .modal-box{width: 90%; height: 360px; padding: 12px; margin-top: 0; right: 5%; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%);}
    .login-page .login-content .modal-box .login-type-switch{display: none !important;}
    .login-page .login-content .modal-box .tab-bar .tab-header .tab-list .tab-record>span{font-size: 20px;}
    .login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other{margin-top: 15px; display: none !important;}
    .login-page .login-content .modal-box .tab-bar .tab-content .content-record .form-action .login-other .login-other-list{margin-top: 10px;}
    .login-page .login-content .modal-box .tab-bar .tab-content .content-record .register-body {padding-top: 10px;}
    .login-page .login-content .modal-box .tab-bar .tab-content .content-record .login-body {padding-top: 10px;}
    .login-page .login-content .reset-success-wrap{padding-top: 80px;}
    .login-page .login-content .reset-success-wrap .success-content .success-text{font-size: 20px;}
    .login-page .login-content .reset-success-wrap .success-content .success-operate>a{font-size: 14px;}
}