@charset "UTF-8";

.login-wrapper {
  background: url(../image/login/login_bg.png) center 0 / auto 100% no-repeat;
}

.login-wrapper .page-container {
  height: 4rem;
  padding: .64rem 0 .25rem;
}

.login-wrapper .left {
  overflow: hidden;
}

.login-wrapper .left .title {
  padding-top: .22rem;
  text-align: center;
  font-size: .17rem;
  font-weight: 400;
  color: #1F6FB8;
  line-height: .3rem;
}

.page-container.partner .login-box{
  padding-bottom: .32rem;
}

.login-box {
  float: right;
  width: 560px;
  margin: 0 auto;
  padding-bottom: .17rem;
  background: #FFFFFF;
  box-shadow: 0px 0px 20px 0px rgba(36, 49, 67, 0.12);
}

#wxLogin {
  display: none;
}

.login-box .nav {}

.login-box .nav li {
  position: relative;
}

.login-box .nav li::after {
  content: '';
  position: absolute;
  right: 0;
  top: .15rem;
  width: 1px;
  height: .1rem;
  background: #CCCCCC;
}

.login-box .nav li:last-of-type::after {
  display: none;
}

.login-box .nav .login-a {
  height: .4rem;
  line-height: .4rem;
  padding: 0;
  font-size: .1rem;
  color: #999999;
  border-radius: 0;
  background: #fff;
  border-bottom: 1px solid #CEDDF0;
}

.login-box .nav .login-a:hover {
  color: #1F6FB8;
  background: transparent;
}

.login-box .nav li.active .login-a {
  color: #1F6FB8;
  border-bottom: 2px solid #1F6FB8;
}

.login-box .tab-content {
  padding: .25rem .25rem 0;
}

.login-box .tab-pane {}

.login-box .input-box {
  position: relative;
}

.login-box .input-box .tit {
  position: absolute;
  left: .06rem;
  top: .08rem;
  padding-right: .08rem;
  font-size: .07rem;
  font-weight: 300;
  color: #333333;
  line-height: .08rem;
  border-right: 1px solid #E6E9EB;
}

.login-box .input-mobile input {
  padding-left: .36rem;
}

.login-box .input-code input {
  padding-right: .55rem;
}

.login-box .input-box .get-code {
  position: absolute;
  right: .1rem;
  top: .08rem;
  width: .5rem;
  padding-left: .1rem;
  text-align: center;
  font-size: .07rem;
  font-weight: 400;
  color: #1F6FB8;
  line-height: .08rem;
  border-left: 1px solid #ccc;
}

.login-box .input-box .get-code.disabled {
  color: #666;
}

.login-box .submit-btn {
  display: block;
  height: .24rem;
  line-height: .24rem;
  text-align: center;
  font-size: .07rem;
  font-weight: 400;
  color: #FFFFFF;
  background: #1F6FB8;
  border-radius: 2px;
}

.login-box .new-user {
  margin-top: .15rem;
  text-align: center;
}

.login-box .new-user a {
  display: inline-block;
  line-height: 20px;
  font-size: .07rem;
  font-weight: 300;
  color: #333;
}


.login-box .new-user .message {
  position: relative;
  margin-right: 20px;
  padding-right: 20px;
  color: #1F6FB8;
}

.login-box .new-user .message::after {
  content: '';
  position: absolute;
  top: 2px;
  right: 0;
  width: 1px;
  height: 15px;
  background: #D8D8D8;
}

.login-box .new-user .register {
  position: relative;
  margin-right: 20px;
  padding-right: 20px;
  /* color: #1F6FB8; */
}

.login-box .new-user .register::after {
  content: '';
  position: absolute;
  top: 2px;
  right: 0;
  width: 1px;
  height: 15px;
  background: #D8D8D8;
}

.login-box .new-user .forget {}

.login-box .other-login {
  margin: .16rem .25rem 0;
  text-align: center;
}

.login-box .other-login .title {
  position: relative;
}

.login-box .other-login .title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
  background: #D8D8D8;
}

.login-box .other-login .title span {
  position: relative;
  display: inline-block;
  padding: 0 14px;
  font-size: .07rem;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
  background: #fff;
}

.login-box .other-box {
  padding: 20px;
  font-size: 0;
  line-height: 1;
}

.login-box .other-box .other {
  font-size: 28px;
}

.login-box .other-box .icon-alipay {
  margin-right: 10px;
  color: #5BB2FF;
}

.login-box .other-box .icon-wechat {
  color: #53CB96;
}

.input-password.error .error-icon {
  right: .24rem;
}

.input-code.error .error-icon {
  right: .65rem;
}

.wx-box {
  padding: .25rem .25rem .08rem;
  text-align: center;
}

.wx-box .title, .bind-mobile .title {
  position: relative;
  text-align: center;
}

.wx-box .title::before, .bind-mobile .title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
  background: #D8D8D8;
}

.wx-box .title span, .bind-mobile .title span {
  position: relative;
  display: inline-block;
  padding: 0 .12rem;
  font-size: .12rem;
  font-weight: 400;
  color: #333;
  font-family: PingFangSC-Regular, PingFang SC;
  line-height: .16rem;
  background: #fff;
}

.wx-box .qrcode-box {
  width: 1.25rem;
  height: 1.25rem;
  margin: .14rem auto 0;
  border: 1px solid #CEDDF0;
}

.wx-box .qrcode-box img {
  display: block;
  width: 100%;
  height: 100%;
}

.wx-box .tit {
  margin-top: .1rem;
  font-size: .07rem;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #999999;
  line-height: .1rem;
}

.wx-box .btn-box {
  margin-top: .25rem;
  font-size: 0;
}

.wx-box .change-btn {
  font-size: .07rem;
  font-family: PingFangSC-Light, PingFang SC;
  font-weight: 300;
  color: #1F6FB8;
  line-height: .1rem;
}

.login-box .bind-mobile {
  padding-bottom: .6rem;
}

.bind-mobile>.tit {
  margin: .2rem 0 .1rem;
  font-size: .07rem;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #999999;
  line-height: .1rem;
}

.login_message{
  display:none;
}

@media (max-width: 768px) {
  .login-wrapper .page-container {
    height: auto;
    padding: 20px;
  }

  .login-box {
    float: none;
  }

  .login-box .nav {}

  .login-box .nav li {
    float: left;
    width: 50%;
    margin: 0;
  }

  .login-box .nav .login-a {
    display: block;
  }
}

@media (max-width: 600px) {
  .login-box {
    width: 100%;
  }
}