.form-qrcode-mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999999999;
}
.fr-form-pop {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width: 574.08px;
  height: 440.06px;
  padding: 43.97px 0 42.05px 0;
  box-sizing: border-box;
  background-image: url("https://src.fanruan.com/2025-website/fanruan/images/form_back01.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.fr-form-pop .form-pop-close-icon {
  position: absolute;
  height: 15.94px;
  width: 15.94px;
  right: 39.94px;
  top: 39.94px;
  cursor: pointer;
}
.fr-form-pop .form-pop-header {
  display: flex;
  align-items: center;
  margin-bottom: 43.97px;
}
.fr-form-pop .form-pop-header img {
  height: 47.04px;
  width: 41.09px;
  margin-right: 22.08px;
}
.fr-form-pop .form-pop-header span {
  font-weight: 600;
  font-size: 36.1px;
  color: #333333;
}
.fr-form-pop .form-pop-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 39.94px;
}
.fr-form-pop .form-pop-content .form-pop-desc img {
  width: 8.06px;
  height: 12.1px;
  margin-right: 8.06px;
}
.fr-form-pop .form-pop-content .form-pop-desc p span {
  color: #333333;
  line-height: 24px;
}
.fr-form-pop .form-qrcode {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 169.92px;
  height: 169.92px;
  padding: 8.06px;
  box-sizing: border-box;
  margin-right: 19.97px;
  background: #FFFFFF;
  box-shadow: 0px 1.92px 14.02px 0px rgba(171, 187, 255, 0.5);
  border-radius: 8.06px;
}
.fr-form-pop .form-qrcode img {
  height: 100%;
  width: 100%;
}
.fr-form-pop .form-pop-button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 49.92px;
  width: 269.95px;
  border-radius: 8.06px;
  text-decoration: none;
  background-color: #0069EA;
}
.fr-form-pop .form-pop-button span {
  color: #FFFFFF;
}
.fr-form-pop .qrcode-loading {
  width: 19.97px;
  height: 19.97px;
  border: 3.07px solid #eee;
  border-top: 3.07px solid #409eff;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin: 0 auto;
}
@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
.fr-form-pop .qrcode-loading-text {
  text-align: center;
  color: #888;
  font-size: 12.1px;
  margin-top: 8.06px;
  letter-spacing: 0.96px;
}
@media (max-width: 768px) {
  .form-qrcode-mask .fr-form-pop {
    width: 80%;
    height: 480px;
    border-radius: 8px;
    padding: 26px 0 20px 0;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-header {
    margin-bottom: 28px;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-header img {
    height: 36px;
    width: 33px;
    margin-right: 22px;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-header span {
    font-size: 28px;
  }
  .form-qrcode-mask .fr-form-pop .form-qrcode {
    margin-right: 0;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-content {
    flex-direction: column;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-close-icon {
    top: 20px;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-desc {
    position: relative;
    top: 20px;
  }
  .form-qrcode-mask .fr-form-pop .form-pop-desc p {
    margin: 8px 0 8px 0;
  }
}
