.bg {
  background-image: url(../img/registerbg.png);
  background-repeat: no-repeat;
  background-position: 100% 105%;
  background-size: 70%;
}

.register {
  padding: .30rem .22rem;
  position: relative;
}

.register .register-box {
  background-color: #FFFFFF;
  box-shadow: 0px 6px 16px rgba(87, 107, 143, .2);
  border-radius: 4px;
  padding: .30rem .19rem;
  min-height: 4.75rem;
}

.register .register-box.help-txt,
.register .register-box.register-second,
.register .register-box.register-third {
  display: none;
}

.register .register-box .item {
  margin-bottom: .16rem;
  position: relative;
}

.register .register-box .h2 {
  font-size: .22rem;
  line-height: .33rem;
  color: #262626;
  text-align: center;
  margin-bottom: .02rem;
}

.register .register-box p {
  font-size: .11rem;
  line-height: .16rem;
  color: #777777;
  margin-bottom: .24rem;
  text-align: center;
}

.register .register-box .item-label {
  display: flex;
}

.register .register-box .item-label .icon {
  color: #FF1F1F;
  position: absolute;
  left: -.13rem;
  top: .10rem;
  font-size: .20rem;
}

.register .register-box .item-label .code {
  width: .88rem;
  flex-shrink: 0;
  font-size: .10rem;
  color: #4385FF;
  background: #F7FAFF;
  border: 1px solid #4385FF;
  border-radius: 4px;
  margin-left: .18rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.register .register-box .item-label .code.email {
  background: #4385FF;
  color: #fff;
  font-size: .14rem;
}

.register .register-box .item-label .code.send {
  background: #F4F4F4;
  border-color: #F4F4F4;
  color: #8C8C8C;
  pointer-events: none;
}

.register .register-box .email-tip {
  font-size: .10rem;
  line-height: .15rem;
  text-align: left;
  margin-top: .08rem;
  margin-bottom: .40rem;
  color: #595959;
  opacity: .7;
}

.register .register-box .upload {
  display: flex;
  align-items: center;
}

.register .register-box .upload a {
  font-size: .12rem;
  line-height: .15rem;
  color: #4385FF;
}

.register .register-box .upload img {
  margin-left: .05rem;
  width: .09rem;
}

.register .register-box .item-tip {
  position: absolute;
  left: 0;
  height: .16rem;
  line-height: .16rem;
  color: #8C8C8C;
  font-size: .08rem;
  display: none;
}

.register .register-box .item-tip img {
  vertical-align: middle;
}

.register .register-box .item-tip span {
  font-size: .08rem;
}

.register .register-box .agreement {
  color: #8c8c8c;
  font-size: .11rem;
  line-height: 1.75em;
  /*display: flex;*/
  /*align-items: center;*/
  /*flex-wrap: wrap;*/
}

.register .register-box .agreement img {
  width: .08rem;
  height: .08rem;
  margin-right: .03rem;
}

.register .register-box .agreement a {
  color: #4385FF;
  font-size: inherit;
}

.register .register-box .btn {
  display: block;
  background: #4385FF;
  border-radius: 4px;
  border: none;
  height: .42rem;
  width: 100%;
  font-size: .14rem;
  color: #fff;
  margin-top: .40rem;
}

.register .register-box .btn.disabled {
  background: #7CAAFF;
  pointer-events: none;
}

.register .register-box .help {
  text-align: right;
  color: #8c8c8c;
  margin-top: .09rem;
  font-size: .10rem;
}

.register .register-box .help a,
.register .register-box .help span {
  font-size: .10rem;
  color: #4385ff;
}

.register .register-box input {
  color: #262626;
  height: .40rem;
  border: 1px solid #D9D9D9;
  border-radius: 4px;
  padding-left: .10rem;
  width: 100%;
  box-sizing: border-box;
}

.register .register-box input.error {
  border-color: #ff1313;
}

.register .register-box input:focus {
  border-color: #40A9FF;
  outline: none;
}

.register .register-box input::placeholder {
  color: #8C8C8C;
}

.register .register-box .succeed .succeed-top {
  text-align: center;
  border-bottom: 1px solid #eee;
  margin-bottom: .46rem;
}

.register .register-box .succeed .succeed-top img {
  width: .40rem;
  height: .40rem;
  margin-bottom: .16rem;
}

.register .register-box .succeed .succeed-top .h2 {
  font-size: .22rem;
  line-height: .33rem;
  color: #262626;
  margin-bottom: .02rem;
}

.register .register-box .succeed .succeed-top p {
  font-size: .10rem;
  line-height: .15rem;
  color: #595959;
  margin-bottom: .70rem;
}

.register .register-box .succeed .succeed-bot {
  display: flex;
  justify-content: center;
}

.register .register-box .succeed .succeed-bot .c {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.register .register-box .succeed .succeed-bot img {
  width: .99rem;
  width: .99rem;
  margin-right: .16rem;
}

.register .register-box .succeed .succeed-bot .h2 {
  font-size: .16rem;
  line-height: .24rem;
  margin-bottom: .06rem;
}

.register .register-box .succeed .succeed-bot p {
  font-size: .12rem;
  line-height: .18rem;
  margin-bottom: 0;
  color: #595959;
}

.register .register-box .help-box .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .16rem;
  font-weight: 600;
  line-height: .24rem;
  border-bottom: 1px solid #eee;
  padding-bottom: .16rem;
  margin-bottom: .30rem;
  color: #262626;
}

.register .register-box .help-box .title img {
  width: .1131rem;
  height: .1131rem;
}

.register .register-box .help-box p {
  text-align: left;
}

.register .register-box .help-box .p1 {
  font-size: .12rem;
  line-height: .18rem;
  color: #262626;
  margin-bottom: .24rem;
}

.register .register-box .help-box .p2 {
  font-size: .10rem;
  line-height: .15rem;
  color: #595959;
  margin-bottom: .16rem;
}

.register .register-box .help-box .p3 {
  font-size: .10rem;
  line-height: .18rem;
  color: #262626;
  border-top: 1px solid #eee;
  padding-top: .08rem;
}

.register .register-box .help-box .p3 a {
  color: #4385FF;
}

.register .register-box .help-box .guwen {
  color: #262626;
  margin-bottom: 1.48rem;
  text-align: left;
}

.register .register-box .help-box .guwen .h2 {
  font-size: .14rem;
  line-height: .21rem;
  margin-bottom: .07rem;
  text-align: left;
}

.register .register-box .help-box .guwen p {
  font-size: .12rem;
  line-height: .18rem;
  color: #262626;
}