.user-container{ padding-top: 1.2rem; min-height: calc( 100vh - 2.1rem ); }
.user-container.user-form-container{ padding-left: 20px; padding-right: 20px; }

.user-container.login{ background: url('../images/login-bg.png') no-repeat center; background-size: cover; }
.layui-input-block{ margin-left: 0; }
html{ background: #f5f5f5; }
/* 534 */
.w-full{ width: 100%; }
.bold{ font-weight: 700; }
.flex{ display: flex; }
.items-center{ align-items: center; }
.justify-between{ justify-content: space-between; }

/* 登录 */
.layui-form-select dl{ top: auto; }
.user-container .user-login-box{ width: 572px; background: #fff; padding: 60px 58px; margin: 0 auto; border-radius: 8px; box-shadow: 0 0 10px #f1f1f1; }
.user-container .user-login-box .user-title{ color: #222; text-align: center; line-height: 1; padding-bottom: 43px; font-weight: 600; }
.user-container .com-form-item{ height: 1rem; font-size: 16px; background: #fff; border: 1px solid #e7e7e7; border-radius: 8px; padding: 0 18px; }
.user-container .layui-form-item .select-area.com-form-item{ border: 0; width: 196px; padding: 0; }
.user-container .layui-form-item .phone.com-form-item{ width: 245px; }
.select-area .layui-form-select .layui-input{ height: 1rem; border: 0; border: 1px solid #e7e7e7; border-radius: 8px; padding-left: 18px;}
.user-container .layui-form-item{ margin-bottom: 20px; }
.user-container .user-login-box .login-btn{ height: 1rem; line-height: 1rem; background: #222; color: #fff; border-radius: 18px; margin-top: 20px; }
.user-container .user-login-box .page-jump{ margin-top: 15px; }
.user-container .user-login-box .verify-input{ width: 60%; height: 0.96rem; }
.user-container .user-login-box .get-phone-code .verify-input{ border: 0; padding-left: 0; }
.user-container .user-login-box .com-form-item { line-height: 1rem; }
.user-container .user-login-box .layui-form-item.flex::after { display: none; }
/* .user-container .user-login-box .get-phone-code{ width: 60%; } */

/* 注册 */
.user-container .user-form-box{ max-width: 1200px; margin: 0 auto; margin-bottom: 1.16rem; background: #fff; border-radius: 8px; box-shadow: 0 0 10px #f1f1f1; }
.user-container .user-form-box .user-box-top{ padding: 37px 48px; position: relative; border-bottom: 1px solid #F0F0F0; }
.user-container .user-form-box .user-box-top .go-login{ position: absolute; top: 50%; transform: translateY(-50%); right: 48px; }
.user-container .user-form-box .user-box-top .go-login>a:hover{ text-decoration: underline; color: #910782; }
.user-container .user-form-box .user-content{ width: 678px; margin: 0 auto; padding: .68rem 0 2.16rem; }
.user-container .user-form-box .user-content .layui-form-label{ width: 86px; line-height: 1rem; height: 1rem; padding: 0; margin-right: 16px; text-align: left; color: #c1c1c1; }
.user-container .user-form-box .com-form-item{ width: 566px; }
.user-container .user-form-box .layui-input::placeholder{ color: #c1c1c1; }
.user-container .user-form-box .com-form-item.verify-input{ width: 378px; }
.user-container .user-form-box .verify-img{ height: 1rem; width: 152px; object-fit: contain; }
.user-container .user-form-box .layui-input-inline{ width: 566px; }
.user-container .user-form-box .get-phone-code{ padding: 0; overflow: hidden; }
.user-container .user-form-box .get-phone-code .verify-input{ border: 0; line-height: 1rem; height: 1rem; width: 378px; }
.user-container .user-form-box .get-phone-code .get-code{ padding: 0 .32rem; cursor: pointer; user-select: none; line-height: 1rem; height: 1rem; }
.user-container .user-form-box .get-phone-code .get-code.disabled{ color: #c1c1c1; cursor: not-allowed; }
.user-container .user-form-box .submit-btn{ line-height: 1rem; height: 1rem; cursor: pointer; color: #fff; text-align: center; border-radius: 8px; background: #222222;}
.user-container .user-form-box .psw-note .layui-form-label{ height: 1px; margin-bottom: 0; }
.user-container .user-form-box .psw-note{ font-size: 13px; color: #dd0000; display: none; }
.user-container .user-form-box .re-psw-note .layui-form-label{ height: 1px; margin-bottom: 0; }
.user-container .user-form-box .re-psw-note{ font-size: 13px; color: #dd0000; display: none; }
.user-container .user-form-box .icon-caozuochenggong,
.user-container .user-form-box .icon-cuohao{ position: absolute; top: 50%; transform: translateY(-50%); right: 30px; color: #07c160; display: none; }
.user-container .user-form-box .icon-cuohao{ color: #dd0000; }
.user-container .user-form-box .password-input{ padding-right: 50px; }

/* 充值密碼 */
.user-container .user-form-box .layui-form-item .phone.com-form-item{ width: 356px; }
.user-container .user-form-box .user-content.find-psw { width: 566px; padding-bottom: 1.24rem; }
.user-container .user-form-box .user-content.find-psw .cancel-btn{ line-height: 1rem; height: 1rem; cursor: pointer; color: #222; border: 1px solid #222; text-align: center; border-radius: 8px; background: #fff; }
.nextpage{ display: none; }
.user-container .user-form-box .nextpage .submit-btn{ width: 100%; }
.user-container .user-form-box .nextpage.user-content{ padding-bottom: 1.24rem; }

.phone-info{ line-height: 1rem; cursor: not-allowed; }
@media (max-width: 1024px){
  .user-container .user-form-box .user-box-top{ padding: 20px; }
  .user-container.user-form-container{ padding-left: 15px; padding-right: 15px; }
}

@media (max-width: 500px){
  .user-container .user-login-box { padding: 40px 15px; width: 345px; }

  .user-container .user-login-box .select-area.com-form-item{ width: 100%; margin-bottom: 15px; }
  .select-area .layui-form-select .layui-input{ padding-left: 10px; }
  .user-container .user-login-box .phone.com-form-item{ width: 100%; margin-left: 0!important; }
  .user-container .user-login-box .login-btn{ margin-top: 0; }

  .layui-form-item{ display: flex; width: 100%; flex-wrap: wrap; }
  .layui-form-item .layui-input-inline, .user-container .user-form-box .layui-input-inline{ flex: 1; margin: 0; }
  .user-container .user-form-box .layui-input-inline{ width: 100%; }
  .user-container .user-form-box .com-form-item.verify-input{ width: 60%; }
  .user-container .user-form-box .com-form-item.verify-img{ max-width: 38%; }
  .user-container .user-form-box .user-content .layui-form-label{ width: 70px; }
  .user-container .user-form-box .get-phone-code .verify-input{ width: 100%; }
  .user-container .user-form-box .user-content{ padding: .68rem .3rem 2.16rem; width: 100%; padding-bottom: 1rem; }
  .user-container .user-form-box .com-form-item{ width: 100%; margin: 0; padding: 0 15px; }
  .user-container .user-form-box .layui-form-item:last-of-type .layui-form-label{ display: none; }

  .user-container .find-psw .layui-form-item .select-area.com-form-item{ width: 100%; float: none; margin-bottom: 15px; }
  .user-container .layui-form-item .phone.com-form-item{ float: none; width: 1px; flex: 1; margin-left: 0;  }
  .user-container .user-form-box .user-content.find-psw{ width: 100%; }

  .user-container .user-form-box .verify-img{ height: auto; width: 100px; }
  .user-container .user-form-box.user-register-box .verify-img{ height: auto; width: 70px; }
  .layui-form-item .layui-input-inline>.clear{ display: flex; align-items: center; justify-content: space-between; }
  .layui-form-item .layui-input-inline>.clear::before{ display: none; }
  .layui-form-item .layui-input-inline>.clear::after{ display: none; }

  .user-container .user-form-box .get-phone-code .get-code{font-size: .12rem; padding: 0 .1rem; }
  .user-container .user-form-box .get-phone-code{ padding-right: 0; }
  .user-container .user-form-box .get-phone-code .verify-input{ width: 60%; padding-left: 0; }
}

@media (max-width: 350px) {
  .user-container .user-form-box .user-box-top .user-title{ font-size: 18px; }
  .user-container .user-form-box .user-box-top .go-login{ font-size: 13px; right: 20px;}
}
.yidun.yidun--light{
  margin: 0 !important;
  width: 100% !important;
}