.reg-content{
  width: 360px;
  margin: 0 auto;
}
.reg-title{
  background: linear-gradient(270deg, #39B7FF 0%, #2CD2FF 100%);
  width: 100%;
  text-align: center;
  color: #fff;
  height: 70px;
  line-height: 70px;
  font-size: 20px;
}
p{
  margin: 0;
}
.reg-content .reg-top{
  width: 100%;
  height: 140px;
  background: #F2F3F5;
  border-radius: 12px;
  margin: 16px auto;
  padding: 16px 8px;
  box-sizing: border-box;
  font-size: 14px;
  color: #6F737F;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.reg-content .reg-top .reg-top-title{
  color: #1C2D57;
  font-size: 20px;
  margin-bottom: 8px;
}
.reg-form .form-top{
  display: flex;
  margin-top: 50px;
  margin-bottom: 10px;
}
.reg-form .form-top .form-line{
  width: 3px;
  height: 25px;
  background-color: #3686FA;
  margin-right: 10px;
}
.reg-form .form-top .form-title{
  color: #000;
  font-weight: 600;
}
.reg-form .form-content{
  padding: 10px;
}
.reg-form .form-content .form-input{
  margin-bottom: 15px;
}
.reg-form .form-content input{
  border: none;
  border-bottom: 1px solid #ccc;
  outline: none;
  color: #000;
  font-size: 17px;
  padding-bottom: 5px;
  width: 100%;
  padding-left: 10px;
}

.reg-form .form-content .label{
  color: #6f737f;
  margin-bottom: 5px;
}
.reg-form .form-content .label span{
  color: red;
  margin-right: 4px;
}
.reg-form .form-content .warn{
  color: red;
  margin-top: 2px;
  display: none;
}
.reg-content .reg-btn{
  width: 80%;
  height: 47px;
  text-align: center;
  line-height: 47px;
  font-size: 18px;
  background: linear-gradient(270deg,#39b7ff,#2cd2ff);
  margin: 30px auto;
  color: #fff;
  border-radius: 5px;
  cursor: pointer;
}
.reg-success{
  width: 360px;
  display: flex;
  flex-direction: column;
  position: absolute;
  left: 50%;
  top: 250px;
  transform: translate(-50%,-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden;
}
.reg-success img{
  width: 133px;
  height: 105px;
  margin-top: 50px;
}
.reg-success .success-title{
  color: #1E263C;
  font-size: 17px;
  margin-top: 11px;
  margin-bottom: 16px;
  font-weight: 600;
}
.reg-success .success-btn{
  width: 80%;
  height: 47px;
  text-align: center;
  line-height: 47px;
  font-size: 18px;
  background: linear-gradient(270deg,#39b7ff,#2cd2ff);
  margin: 30px auto;
  color: #fff;
  border-radius: 5px;
  cursor: pointer;
}
.loading-content{
  width: 600px;
  height: 600px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden;
}
.loading{
  width: 80px;
  height: 40px;
}
.loading span{
  display: inline-block;
  width: 8px;
  height: 100%;
  border-radius: 4px;
  background: lightgreen;
  -webkit-animation: load 1s ease infinite;
}
@-webkit-keyframes load{
  0%,100%{
      height: 40px;
      background: lightgreen;
  }
  50%{
      height: 70px;
      margin: -15px 0;
      background: lightblue;
  }
}
.loading span:nth-child(2){
  -webkit-animation-delay:0.2s;
}
.loading span:nth-child(3){
  -webkit-animation-delay:0.4s;
}
.loading span:nth-child(4){
  -webkit-animation-delay:0.6s;
}
.loading span:nth-child(5){
  -webkit-animation-delay:0.8s;
}