#login {
  display: flex;
  height: 100vh;
}

#login .login-left {
  height: 100%;
  width: 50%;
  position: relative;
}

#login .login-left .login-img {
  height: 100%;
  width: 100%;
}

#login .login-left .logoImg {
  position: absolute;
  left: 6.1458vw;
  top: 2.6042vw;
  width: 7.3958vw;
  height: 2.5521vw;
}

#login .login-right {
  flex: 1;
  padding: 0 8%;
  margin: auto;
}

#login .login-right .login-title {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4.1666vw;
}

#login .login-right .login-title h1 {
  color: #231815;
  font-family: Montserrat;
  font-size: 3.125vw;
  font-style: normal;
  font-family: "Montserrat-SemiBold" !important;
  line-height: 150%;
  margin-right: 0.8333vw;
}

#login .login-right .login-title img {
  width: 9.2708vw;
  height: 3.2292vw;
}

#login .login-right .login-title-mobile {
  display: none;
}

#login .login-right #loginForm label {
  color: #231815;
  font-family: Montserrat;
  font-size: 0.8333vw;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  text-transform: capitalize;
}

#login .login-right #loginForm .form-group {
  margin-bottom: 0.9375vw;
}

#login .login-right #loginForm .form-control {
  border: 0.0521vw solid rgba(0, 0, 0, 0.10);
  border-radius: 0;
  padding: 0.7813vw 2.0833vw 0.7813vw 0.8333vw;
  font-weight: 400;
  line-height: 150%;
  font-size: 0.7292vw;
  height: 2.5vw;
  background-image: unset;
  color: #231815 !important;
}

#login .login-right #loginForm .form-password {
  margin-bottom: 0;
}

#login .login-right #loginForm .form-password .input-group {
  position: relative;
}

#login .login-right #loginForm .form-password .toggle-password {
  position: absolute;
  top: 0.625vw;
  right: 0.8333vw;
  font-size: 1.25vw;
  height: 1.25vw;
  width: 1.25vw;
  cursor: pointer;
  z-index: 999;
  line-height: 1.25vw;
}

#login .login-right #loginForm .form-password .toggle-password .iconfont {
  font-size: 1.25vw;
  color: #231815;
}

#login .login-right #loginForm .invalid-feedback {
  display: block;
  opacity: 0;
}

#login .login-right #loginForm .form-forgot {
  position: unset;
  padding-left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 2.0833vw;
}

#login .login-right #loginForm .form-forgot a {
  color: rgba(35, 24, 21, 0.40);
  font-size: 0.7292vw;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25vw;
}

.is-invalid~.invalid-tooltip,
.was-validated :invalid~.invalid-feedback,
.was-validated :invalid~.invalid-tooltip {
  opacity: 1 !important;
}


#login .login-right #loginForm .form-button-box {
  display: flex;
  gap: 2.0833vw;
}

#login .login-right #loginForm .form-button-box button {
  border-radius: 2.6042vw;
  font-size: 0.8333vw;
  font-family: "Montserrat-SemiBold" !important;
  height: 2.1875vw;
  padding: 0vw 2.0833vw;
  width: calc((100% - 2.0833vw) / 2);
  border: 0.0521vw solid #3A66FB;
  background: #3A66FB;
  color: #fff;
  text-align: center;
  line-height: 2.1875vw;
  position: relative;
}

#login .login-right #loginForm .form-button-box button::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: rgba(35, 24, 21, 0.2);
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
  border-radius: 2.6042vw;
}

#login .login-right #loginForm .form-button-box button:hover::before {
  opacity: 1;
}

#login .login-right #loginForm .form-button-box #loginBtn.active {
  color: #231815 !important;
  border: 0.0521vw solid #231815 !important;
  background: #FFF !important;
}

#login .login-right #loginForm .form-button-box .signUp {
  border-radius: 2.6042vw;
  font-size: 0.8333vw;
  font-family: "Montserrat-SemiBold" !important;
  height: 2.1875vw;
  padding: 0vw 2.0833vw;
  width: calc((100% - 2.0833vw) / 2);
  border: 0.0521vw solid #231815;
  background: #FFF;
  color: #231815;
  text-align: center;
  line-height: 2.1875vw;
}

#login .login-right #loginForm .form-button-box .signUp:hover {
  border-radius: 2.6042vw;
  width: calc((100% - 2.0833vw) / 2);
  background: #3A66FB;
  border: 0.0521vw solid #3A66FB;
  color: #FFF;
  font-size: 0.8333vw;
  font-family: "Montserrat-SemiBold" !important;
  height: 2.1875vw;
  padding: 0vw 2.0833vw;
}
.loading-indicator-down {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  top: 0;
  right: 0;
  padding-right: 0.7292vw;
  pointer-events: none; /* 禁止点击事件 */
}
.loading-indicator-down .spinner {
  border: 0.2083vw solid rgba(0, 0, 0, 0.1);
  border-top: 0.2083vw solid #3a66fb;
  border-radius: 50%;
  width: 1.25vw;
  height: 1.25vw;
  animation: spin 1s linear infinite;
}
@media screen and (max-width: 1440px) {
  #login .login-right {
    padding: 0 5.5556vw;
  }

  #login .login-right .login-title {
    margin-bottom: 5.555vw
  }
}

@media screen and (max-width: 768px) {
  #login .login-left {
    display: none;
  }

  #login .login-right .login-title {
    display: none;
  }

  #login .login-right .login-title-mobile {
    display: block;
    text-align: center;
  }

  #login .login-right .login-title-mobile .logoImg {
    width: 47.4667vw;
    height: 16.5333vw;
    margin-bottom: 10.6667vw;
  }

  #login .login-right .login-title-mobile h1 {
    font-size: 6.4vw;
    line-height: 150%;
    margin-bottom: 10.6667vw;
  }

  #login .login-right #loginForm label {
    font-size: 4.2666vw;
  }

  #login .login-right #loginForm .form-control {
    font-size: 3.2vw;
    height: 12.8vw;
    padding: 4.2666vw;
  }

  #login .login-right #loginForm .form-group {
    margin-bottom: 0.8vw;
  }

  #login .login-right #loginForm .form-forgot {
    margin-bottom: 10.6667vw;
  }

  #login .login-right #loginForm .form-forgot a {
    font-size: 3.2vw;
    line-height: 150%;
  }

  #login .login-right #loginForm .form-button-box {
    gap: 4.2667vw;
    flex-direction: column;
  }

  #login .login-right #loginForm .form-button-box button {
    width: 100%;
    font-size: 3.2vw;
    height: 9.0667vw;
    line-height: 150%;
    border-radius: 6.4vw;
  }

  #login .login-right #loginForm .form-button-box .signUp {
    width: 100%;
    font-size: 3.2vw;
    height: 9.0667vw;
    line-height: 150%;
    padding: 2.1333vw 10.6667vw;
    border-radius: 6.4vw;
  }

  #login .login-right #loginForm .form-button-box .signUp:hover {
    width: 100%;
    font-size: 3.2vw;
    height: 9.0667vw;
    line-height: 150%;
    padding: 2.1333vw 10.6667vw;
    border-radius: 6.4vw;
  }

  #login .login-right #loginForm .form-password .toggle-password {
    width: 6.4vw;
    height: 6.4vw;
    line-height: 6.4vw;
    top: 4vw;
    right: 4.2666vw;
    font-size: 6.4vw;
  }

  #login .login-right #loginForm .form-password .toggle-password .iconfont {
    font-size: 6.4vw;
  }
}