.headerWrap {
  position: fixed;
}
header {
  position: fixed;
  top: 0;
  background: transparent;
}
header.act,
header:hover {
  background: #0F57E2;
}
.banner {
  width: 100%;
  height: 6.8rem;
  background-image: url('/assets/static/img/user/logo.png');
  position: relative;
}
.banner .text {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  top: 3.3rem;
  left: 2.6rem;
}
.banner .text .tit {
  font-weight: bold;
  font-size: 0.42rem;
  color: #F3F9FF;
  margin-bottom: 0.11rem;
}
.banner .text .txt {
  width: 6.28rem;
  height: 0.34rem;
  background: linear-gradient(94deg, rgba(255, 255, 255, 0) 0%, rgba(160, 218, 248, 0.5) 49.05%, rgba(255, 255, 255, 0) 100%);
  font-weight: normal;
  font-size: 0.14rem;
  color: #F3F9FF;
  text-align: center;
  line-height: 0.34rem;
  white-space: nowrap;
  padding: 0 0.2rem;
}
.banner form {
  width: 4.8rem;
  background: #FFFFFF;
  box-shadow: 0rem 0.02rem 0.14rem 0.01rem rgba(79, 79, 79, 0.3);
  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
  padding: 0.33rem 0.4rem 0.65rem;
  position: absolute;
  top: calc(50%);
  right: 4.16rem;
  transform: translateY(-50%);
}
.banner form .tabTit {
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 0.01rem solid #B9B8B8;
  margin-bottom: 0.3rem;
}
.banner form .tabTit .item {
  width: 50%;
  font-family: PingFang SC, PingFang SC;
  font-weight: 400;
  font-size: 0.28rem;
  color: #ACACAC;
  text-align: center;
  padding-bottom: 0.18rem;
  position: relative;
  cursor: pointer;
}
.banner form .tabTit .item.act {
  color: #333333;
}
.banner form .tabTit .item.act::after {
  content: '';
  display: block;
  width: 100%;
  height: 0.02rem;
  background: #000000;
  position: absolute;
  bottom: 0;
  left: 0;
}
.banner form .inputBox {
  display: none;
}
.banner form .inputBox.show {
  display: block;
}
.banner form .inputBox .formItem {
  display: flex;
  align-items: center;
  margin-bottom: 0.16rem;
  gap: 0.18rem;
}
.banner form .inputBox .formItem .left {
  width: 100%;
  height: 0.44rem;
  border-radius: 0.04rem 0.04rem 0.04rem 0.04rem;
  border: 0.01rem solid #EEEEEE;
  display: flex;
  align-items: center;
}
.banner form .inputBox .formItem .left .lable {
  width: 1rem;
  font-weight: 400;
  font-size: 0.16rem;
  color: #666666;
  flex-shrink: 0;
  text-align: center;
  border-right: 0.01rem solid #EEEEEE;
}
.banner form .inputBox .formItem .left input {
  width: 100%;
  height: 100%;
  font-weight: 400;
  font-size: 0.14rem;
  padding-left: 0.21rem;
}
.banner form .inputBox .formItem .left input::-webkit-input-placeholder {
  color: #D7D7D7;
}
.banner form .inputBox .formItem .left .getCode {
  font-family: Arial, Arial;
  font-weight: 400;
  font-size: 0.14rem;
  color: #017143;
  line-height: 0.24rem;
  flex-shrink: 0;
  white-space: nowrap;
  margin: 0 0.16rem;
}
.banner form .inputBox .formItem .code {
  width: 1rem;
  height: 0.4rem;
  flex-shrink: 0;
}
.banner form .inputBox .formItem .code img {
  width: 100%;
  height: 100%;
}
.banner form .bot {
  margin-bottom: 0.12rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.banner form .bot .left {
  display: flex;
  align-items: center;
  gap: 0.1rem;
  font-weight: 400;
  font-size: 0.16rem;
  color: #999999;
}
.banner form .bot a {
  font-weight: 400;
  font-size: 0.16rem;
  color: #9B9B9B;
}
.banner form button {
  width: 4rem;
  height: 0.5rem;
  background: #0F57E2;
  box-shadow: 0rem 0.03rem 0.06rem 0.01rem rgba(0, 0, 0, 0.05);
  border-radius: 0.06rem 0.06rem 0.06rem 0.06rem;
  font-weight: bold;
  font-size: 0.18rem;
  color: #FFFFFF;
}
.banner form .lastLink {
  width: fit-content;
  display: block;
  margin: 0 auto;
  font-weight: 400;
  font-size: 0.16rem;
  color: #0F57E2;
  text-decoration: underline;
  margin-top: 0.16rem;
}
.banner form .checkbox {
  position: absolute;
  bottom: 0rem;
  left: 0;
  width: 4.8rem;
  height: 0.4rem;
  background: #F5F6F8;
  border-radius: 0rem 0rem 0.16rem 0.16rem;
  display: flex;
  align-items: center;
  gap: 0.1rem;
  padding: 0 0.24rem;
}
.banner form .checkbox input {
  display: block;
}
.banner form .checkbox div {
  font-family: PingFang SC, PingFang SC;
  font-weight: 400;
  font-size: 0.14rem;
  color: #999999;
}
.banner form .checkbox div a {
  display: inline;
  font-family: PingFang SC, PingFang SC;
  font-weight: 400;
  font-size: 0.14rem;
  color: #0F57E2;
}



@media only screen and (max-width: 1024px) {
  .banner{
    margin-top: 50px;
    height: 8.8rem;
  }
  .banner .text{
    top: 0.77rem;
    left: 50%;
    transform: translate(-50%,0);
  }
  .banner .text .txt{
    font-size: 12px;
  }
  .banner form{
    top: 3rem;
    right: auto;
    left: 50%;
    transform: translate(-50%,0);
    width: 84%;
    padding: 0.33rem 0.4rem 0.8rem;
  }
  .banner form .inputBox .formItem .left .lable,.banner form .inputBox .formItem .left input,.banner form .bot .left span,.banner form .bot a,.banner form .lastLink,.banner form .checkbox div,.banner form .checkbox div a,.banner form .inputBox .formItem .left .getCode{
    font-size: 12px;
  }
  .banner form button{
    margin: auto;
    display: block;
    font-size: 12px;
  }
  .banner form .checkbox{
    height: 0.5rem;
    width: 100%;
  }
  .banner form .inputBox .formItem .left .lable{
    flex: 0 0 20%;
  }
}