.logging-login-wrapper {
  border-radius: 12px;
  padding-top: 20px;
  position: relative;
}
.logging-login-wrapper .account-information {
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 10px;
}
.logging-login-wrapper .account-id-area .account-id {
  display: flex;
  flex-wrap: wrap;
  color: #666;
  font-size: 15px;
  margin-bottom: 4px;
}
.logging-login-wrapper .account-id-area .account-id p {
  width: 30%;
}
.logging-login-wrapper .account-id-area .account-id p:nth-child(3n) {
  width: 40%;
}
.logging-login-wrapper .account-id-area .account-id span {
  display: block;
  color: #fff;
  font-size: 14px;
}
.logging-login-wrapper .account-id-area .account-id span:first-child {
  font-size: 13px;
  margin-top: 10px;
  color: rgba(255, 255, 255, 0.6);
}
.logging-login-btn {
  margin-top: 20px;
}
.logging-login-btn .el-button--primary {
  background-color: rgba(0, 0, 0, 0.2);
  border: none;
  border-radius: 8px;
  box-shadow: 0 2px 8px 0 rgba(45, 140, 240, 0.15);
  font-size: 13px;
  padding: 0 20px;
  height: 37px;
  line-height: 37px;
  color: rgba(255, 255, 255, 0.8);
}
.logging-login-btn .el-button--primary:hover {
  color: #fff;
  background-color: #005ddb;
}
/* 光束动画 */
@keyframes sweep {
  0% {
    left: -100%;
  }
  100% {
    left: 200%;
  }
}
body {
  --login-theme-color: #005ddb;
  --login-thin-theme-color: #086ae5;
  --login-theme-hover-color: #337de2;
  --login-theme-txt-color: #597cc4;
  --login-theme-txt-hover-color: #94afe6;
  --login-normal-txt-color: #fff;
  --login-light-txt-color: #606266;
  --login-lighter-txt-color: #909399;
  --login-form-bgcolor: rgba(0, 0, 20, 0.2);
  --login-disabled-txt-color: #c0c4cc;
  --login-disabled-bgcolor: #317ade;
  --login-main-bgcolor: #ffffff;
  --login-txt-color: #303133;
  --login-gray-bg-color: #f9fafb;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  outline: none;
}
.clearfix:after {
  clear: both;
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  content: "";
}
.clearfix {
  zoom: 1;
}
.flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.flex_column {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
}
.flex_one {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
}
.text-right {
  text-align: right;
}
@font-face {
  font-family: "mynum";
  src: url(https://industrydown1.fang.com/fang/node-creis-login/common-fonts/statistic.woff) format("woff"), url(https://industrydown1.fang.com/fang/node-creis-login/common-fonts/statistic.ttf) format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "lgfont";
  src: url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/lgfont.b38cc240.eot);
  src: url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/lgfont.b38cc240.eot#iefix) format("embedded-opentype"), url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/lgfont.285047b6.ttf) format("truetype"), url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/lgfont.89aa4530.woff) format("woff"), url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/lgfont.f03db7b0.svg#lgfont) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^="lg-icon-"],
[class*=" lg-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "lgfont" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.lg-icon-warning-outline:before {
  content: "\e6c9";
}
.lg-icon-mobile-phone:before {
  content: "\e6d3";
}
.lg-icon-key:before {
  content: "\e6e2";
}
.lg-icon-monitor:before {
  content: "\e775";
}
.lg-icon-close:before {
  content: "\e6db";
}
.lg-icon-circle-check:before {
  content: "\e720";
}
.lg-icon-circle-close:before {
  content: "\e78d";
}
.lg-icon-error:before {
  content: "\e79d";
}
.lg-icon-more:before {
  content: "\e794";
}
.lg-icon-report:before {
  content: "\e900";
}
.lg-icon-city:before {
  content: "\e901";
}
.lg-icon-esf:before {
  content: "\e902";
}
.lg-icon-housePrice:before {
  content: "\e903";
}
.lg-icon-risk:before {
  content: "\e904";
}
.lg-icon-aerial:before {
  content: "\e905";
}
.lg-icon-macro:before {
  content: "\e906";
}
.lg-icon-furniture:before {
  content: "\e907";
}
.lg-icon-kfcloud:before {
  content: "\e908";
}
.lg-icon-brokerage:before {
  content: "\e909";
}
.lg-icon-company:before {
  content: "\e90a";
}
.lg-icon-realEstate:before {
  content: "\e90b";
}
.lg-icon-land:before {
  content: "\e90c";
}
.lg-icon-property:before {
  content: "\e90d";
}
.lg-icon-zhcloud:before {
  content: "\e90e";
}
.lg-icon-office:before {
  content: "\e90f";
}
.lg-icon-rent:before {
  content: "\e910";
}
.lg-icon-merchants:before {
  content: "\e911";
}
.lg-icon-check:before {
  content: "\e6da";
}
.lg-icon-edit-outline:before {
  content: "\e764";
}
.lg-icon-finance:before {
  content: "\e912";
}
html,
body {
  width: 100%;
  height: 100%;
  min-width: 1366px;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
input {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
input:-webkit-autofill {
  -webkit-text-fill-color: #fff !important;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  background-color: transparent;
  background-image: none;
  transition: background-color 50000s ease-in-out 0s;
}
input:-webkit-autofill::first-line {
  font-size: 16px;
}
.login-page {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.login-page .login-page-bg {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.login-page .login-page-bg img {
  display: block;
  width: 100%;
  min-height: 100%;
  object-fit: cover;
}
.login-page .login-page-bg video {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -9999;
}
.login-page .login-page-wrap {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.login-page .login-page-wrap .login-left-part {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  color: var(--login-normal-txt-color);
  opacity: 0;
}
.login-page .login-page-wrap .login-logo {
  position: absolute;
  right: 15%;
  top: 20%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.login-page .login-page-wrap .login-logo .logo-box {
  width: 440px;
  min-height: 240px;
}
.login-page .login-page-wrap .login-logo .logo-box img {
  display: block;
}
.login-page .login-page-wrap .login-logo .login-tel {
  font-size: 14px;
  margin: 6.25vw 0.52vw 1.04vw 0;
}
.login-page .login-page-wrap .login-logo .login-tel span {
  font-size: 36px;
  font-family: "mynum";
  line-height: 43px;
}
.login-page .login-page-wrap .login-logo .login-nav-link {
  margin: 0px 10px 0px 0;
}
.login-page .login-page-wrap .login-logo .login-nav-link i {
  font-style: italic;
  font-size: 12px;
  color: var(--login-lighter-txt-color);
  margin: 0 10px;
}
.login-page .login-page-wrap .login-logo .login-nav-link a {
  color: var(--login-normal-txt-color);
  font-size: 14px;
  text-decoration: none;
}
.login-page .login-page-wrap .login-logo .login-nav-link a:hover {
  color: var(--login-theme-txt-hover-color);
}
.login-page .login-page-wrap .login-right-part {
  width: 40%;
  min-width: 640px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  background-color: var(--login-form-bgcolor);
  backdrop-filter: blur(10px);
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: baseline;
  position: relative;
}
.login-page .login-page-wrap .login-form-main {
  opacity: 0;
  width: 500px;
  position: absolute;
  left: 50%;
  top: 48%;
  transform: translateX(-50%) translateY(-50%) !important;
}
.login-page .login-page-wrap .cur-version {
  position: absolute;
  right: 0;
  top: 0;
}
.login-page .login-page-wrap .cur-version .version_box {
  width: 80px;
  height: 68px;
  color: #fff;
  text-align: center;
  font-size: 13px;
  border-radius: 4px;
  padding: 14px 0 0;
  background-color: var(--login-thin-theme-color);
  position: relative;
  overflow: hidden;
}
.login-page .login-page-wrap .cur-version .version_box::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-top: 51px solid rgba(0, 0, 0, 0.1);
  border-left: 0px solid rgba(0, 0, 0, 0.1);
  border-right: 96px solid transparent;
  border-bottom: 0;
  position: absolute;
  left: 0;
  top: 0;
}
.login-page .login-page-wrap .cur-version p {
  padding-top: 4px;
}
.login-page .login-page-wrap .cur-version::after {
  content: "";
  display: block;
  width: 6px;
  height: 0px;
  border-top: 10px solid var(--login-thin-theme-color);
  border-right: 6px solid transparent;
  position: absolute;
  right: 10px;
  bottom: -10px;
}
.login-page .login-page-wrap .cur-version i {
  font-size: 16px;
}
.login-page .login-page-wrap .cur-version .check {
  position: absolute;
  background: #fff;
  transform: rotate(45deg);
  display: block;
  width: 60px;
  height: 60px;
  top: -38px;
  right: -38px;
  z-index: 5;
}
.login-page .login-page-wrap .cur-version .check .lg-icon-check {
  font-size: 12px;
  color: var(--login-theme-color);
  font-weight: bold;
  transform: rotate(-45deg);
  position: absolute;
  left: 25px;
  top: 47px;
  z-index: 2;
}
.login-page .login-page-wrap .login-tab {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  list-style: none;
  padding-bottom: 50px;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-tab {
    padding-bottom: 50px;
  }
}
.login-page .login-page-wrap .login-tab li {
  list-style: none;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  color: var(--login-normal-txt-color);
  padding: 0 20px;
  cursor: pointer;
}
.login-page .login-page-wrap .login-tab li p {
  position: relative;
}
.login-page .login-page-wrap .login-tab li p::after {
  content: "";
  display: block;
  width: 0%;
  height: 2px;
  background-color: #fff;
  position: absolute;
  left: 0;
  bottom: 0;
  opacity: 0;
  transition: all 0.2s;
}
.login-page .login-page-wrap .login-tab li:first-child {
  padding-left: 0;
}
.login-page .login-page-wrap .login-tab li:last-child {
  padding-right: 0;
}
.login-page .login-page-wrap .login-tab li.is-active p::after {
  width: 100%;
  opacity: 1;
}
.login-page .login-page-wrap .login-form-link {
  margin-top: 40px;
  text-align: center;
  line-height: 20px;
}
.login-page .login-page-wrap .login-form-link span {
  position: relative;
}
.login-page .login-page-wrap .login-form-link span .pop-float-ewm {
  display: none;
}
.login-page .login-page-wrap .login-form-link span:hover .pop-float-ewm {
  display: block;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form-link {
    margin-top: 30px;
  }
}
.login-page .login-page-wrap .login-form-link a {
  font-size: 12px;
  text-decoration: none;
  color: var(--login-normal-txt-color);
  margin: 0 10px;
}
.login-page .login-page-wrap .login-form-link a:hover {
  color: var(--login-theme-txt-hover-color);
}
.login-page .login-page-wrap .login-form-link a i {
  color: var(--login-theme-txt-color);
  margin-right: 5px;
  font-size: 16px;
  vertical-align: middle;
}
.login-page .login-page-wrap .login-form .logging-login-tit {
  font-size: 20px;
  color: #fff;
  padding: 20px 0px 30px;
  text-align: center;
  line-height: 28px;
}
.login-page .login-page-wrap .login-form .login-form-desc {
  color: rgba(255, 255, 255, 0.6);
  font-size: 16px;
  text-align: center;
  line-height: 20px;
  margin-bottom: 20px;
}
.login-page .login-page-wrap .login-form .login-tit-name {
  color: #fff;
  padding: 15px 0px;
}
.login-page .login-page-wrap .login-form .login-form-mode {
  height: 360px;
}
.login-page .login-page-wrap .login-form.login-from-blur .login-form-input,
.login-page .login-page-wrap .login-form.login-from-blur .login-ewm,
.login-page .login-page-wrap .login-form.login-from-blur .ewm-tips {
  opacity: 0;
  -webkit-transition: opacity 0.3s linear;
  transition: opacity 0.3s linear;
}
.login-page .login-page-wrap .login-form .login-btn {
  height: 46px;
  line-height: 46px;
  padding: 0;
  width: 100%;
  font-size: 16px;
  background-color: var(--login-theme-color);
  color: #fff;
  border: 0;
  cursor: pointer;
  border-radius: 4px;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form .login-btn {
    height: 40px;
    line-height: 40px;
  }
}
.login-page .login-page-wrap .login-form .login-btn:hover {
  background-color: var(--login-theme-hover-color);
}
.login-page .login-page-wrap .login-form .login-btn:focus {
  background-color: var(--login-theme-color);
}
.login-page .login-page-wrap .login-form .login-btn.is-disabled {
  cursor: not-allowed;
  background-color: var(--login-disabled-bgcolor);
  color: var(--login-disabled-txt-color);
}
.login-page .login-page-wrap .login-form input {
  width: 100%;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  height: 46px;
  line-height: 46px;
  padding: 0;
  font-size: 16px;
  color: var(--login-normal-txt-color);
  position: relative;
  z-index: 2;
  outline: none;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form input {
    height: 36px;
    line-height: 36px;
  }
}
.login-page .login-page-wrap .login-form input:focus + .login-input-placeholder {
  font-size: 13px;
  transform: translateY(-25px);
  color: var(--login-normal-txt-color);
}
.login-page .login-page-wrap .login-form input:focus + .login-input-placeholder + .login-input-line {
  animation: lineright 0.5s ease-out;
  border-bottom: 1px solid #fff;
}
.login-page .login-page-wrap .login-form .login-form-item {
  margin: 40px 0 20px;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form .login-form-item {
    margin-top: 30px;
  }
}
.login-page .login-page-wrap .login-form .login-form-input {
  position: relative;
}
.login-page .login-page-wrap .login-form .login-form-input .login-input-placeholder {
  width: 100%;
  position: absolute;
  left: 0;
  height: 20px;
  top: 50%;
  margin-top: -10px;
  z-index: 1;
  text-align: left;
  line-height: 20px;
  color: var(--login-disabled-txt-color);
  font-size: 14px;
  transition: all 0.3s;
}
.login-page .login-page-wrap .login-form .login-form-input .login-input-placeholder.up {
  font-size: 13px;
  transform: translateY(-25px);
  color: var(--login-normal-txt-color);
}
.login-page .login-page-wrap .login-form .login-form-input .login-input-line {
  position: absolute;
  left: 0;
  transition: all 0.3s;
  pointer-events: none;
  bottom: 0;
  top: initial;
  width: 100%;
  height: 0;
  border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}
.login-page .login-page-wrap .login-form .login-form-input .login-error-tips {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -10px;
  height: 20px;
  line-height: 20px;
  color: #ffb820;
  font-size: 14px;
  white-space: nowrap;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form .login-form-input .login-error-tips {
    font-size: 13px;
  }
}
.login-page .login-page-wrap .login-form .login-ewm {
  width: 200px;
  height: 200px;
  margin: 16px auto 0;
  position: relative;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form .login-ewm {
    margin: 12px auto 0;
  }
}
.login-page .login-page-wrap .login-form .login-ewm img {
  width: 100%;
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 2;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips .lg-icon-circle-check {
  font-size: 30px;
  margin-bottom: 20px;
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips .b-refesh {
  margin-top: 25px;
  height: 28px;
  line-height: 28px;
  background-color: var(--login-theme-color);
  color: #fff;
  padding: 0 15px;
  border-radius: 3px;
  font-size: 12px;
  border: 1px solid var(--login-theme-color);
  cursor: pointer;
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips .b-refesh:hover {
  background-color: var(--login-theme-hover-color);
  border-color: var(--login-theme-hover-color);
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips .b-refesh:focus {
  background-color: var(--login-theme-color);
  border-color: var(--login-theme-color);
}
.login-page .login-page-wrap .login-form .login-ewm .login-ewm-tips .b-refesh.is-disabled {
  cursor: not-allowed;
  background-color: var(--login-disabled-bgcolor);
  border-color: var(--login-disabled-bgcolor);
  color: var(--login-disabled-txt-color);
}
.login-page .login-page-wrap .login-form .login-ewm .float-load-ewm {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 20;
}
.login-page .login-page-wrap .login-form .login-ewm .float-load-ewm > img {
  display: block;
  width: 100%;
  height: 100%;
}
.login-page .login-page-wrap .login-form .ewm-tips {
  font-size: 14px;
  color: var(--login-normal-txt-color);
  text-align: center;
  margin-bottom: 40px;
}
@media screen and (max-width: 1440px) {
  .login-page .login-page-wrap .login-form .ewm-tips {
    margin-bottom: 30px;
    font-size: 13px;
  }
}
.login-page .login-page-wrap .login-form .ewm-tips span {
  margin-right: 20px;
}
.login-page .login-page-wrap .login-form .ewm-tips .cursor {
  cursor: pointer;
}
.login-page .login-page-wrap .pop-float-ewm {
  position: absolute;
  left: 50%;
  bottom: 100%;
  z-index: 40;
  transform: translateX(-50%);
}
.login-page .login-page-wrap .pop-float-ewm .ewm-code-box {
  padding: 10px;
  background-color: var(--login-main-bgcolor);
  border-radius: 3px;
  overflow: hidden;
}
.login-page .login-page-wrap .pop-float-ewm .ewm-code-box img {
  display: block;
  width: 110px;
  height: 110px;
}
.login-page .login-page-wrap .pop-float-ewm .ewm-code-box p {
  font-size: 13px;
  color: var(--login-txt-color);
  padding-top: 8px;
}
.login-form-main {
  height: 580px;
  display: flex;
  flex-direction: column;
}
.login-content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 360px;
}
.login-change-mode {
  margin-top: 40px;
  width: 100%;
}
.login-change-mode .mode-title {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.login-change-mode .mode-title::before,
.login-change-mode .mode-title::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.2);
}
.login-change-mode .mode-title span {
  padding: 0 15px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
}
.login-change-mode .mode-icons {
  display: flex;
  justify-content: center;
}
.login-change-mode .mode-icons .mode-item {
  cursor: pointer;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  transition: all 0.3s;
  margin: 0 15px;
  width: 80px;
  height: 54px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
.login-change-mode .mode-icons .mode-item:hover,
.login-change-mode .mode-icons .mode-item.active {
  color: #fff;
}
.login-change-mode .mode-icons .mode-item i,
.login-change-mode .mode-icons .mode-item .icon-svg {
  font-size: 24px;
  margin-bottom: 8px;
  display: inline-block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.login-change-mode .mode-icons .mode-item p {
  font-size: 14px;
  line-height: 1;
  margin: 0;
}
@-webkit-keyframes lineright {
  from {
    width: 1px;
  }
  to {
    width: 100%;
  }
}
@keyframes lineright {
  from {
    width: 1px;
  }
  to {
    width: 100%;
  }
}
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
.animate__fadeInLeft {
  -webkit-animation: fadeInLeft 0.5s ease-out 1 0.5s forwards;
  animation: fadeInLeft 0.5s ease-out 1 0.5s forwards;
}
@-webkit-keyframes fadeInRight {
  from {
    width: 30%;
    opacity: 0;
  }
  to {
    width: 40%;
    opacity: 1;
  }
}
@keyframes fadeInRight {
  from {
    width: 30%;
    opacity: 0;
  }
  to {
    width: 40%;
    opacity: 1;
  }
}
.animate__fadeInRight {
  -webkit-animation: fadeInRight 0.5s ease-out 1 0s forwards;
  animation: fadeInRight 0.5s ease-out 1 0s forwards;
}
@-webkit-keyframes fadeInRightSlow {
  from {
    opacity: 0;
    -webkit-transform: translate3d(40%, 0, 0);
    transform: translate3d(40%, 0, 0);
  }
  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes fadeInRightSlow {
  from {
    opacity: 0;
    -webkit-transform: translate3d(40%, 0, 0);
    transform: translate3d(40%, 0, 0);
  }
  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1;
  }
}
.animate__fadeInRightSlow {
  -webkit-animation: fadeInRightSlow 0.5s ease-out 1 1s forwards;
  animation: fadeInRightSlow 0.5s ease-out 1 1s forwards;
}
.animate__fadeInRightSlow_new {
  -webkit-animation: fadeInRightSlow 0.5s ease-out 1 0.5s forwards;
  animation: fadeInRightSlow 0.5s ease-out 1 0.5s forwards;
}
@-webkit-keyframes dialogFadeIn {
  0% {
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes dialogFadeIn {
  0% {
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@-webkit-keyframes dialogFadeout {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
    opacity: 0;
  }
}
@keyframes dialogFadeout {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
    opacity: 0;
  }
}
.fade-enter-active {
  -webkit-animation: dialogFadeIn 0.5s;
  animation: dialogFadeIn 0.5s;
}
.fade-leave-active {
  -webkit-animation: dialogFadeout 0.8s;
  animation: dialogFadeout 0.5s;
}
.login-btn-confirm {
  display: inline-block;
  height: 30px;
  line-height: 30px;
  background-color: var(--login-theme-color);
  color: #fff;
  padding: 0 15px;
  border-radius: 3px;
  border: 1px solid var(--login-theme-color);
  cursor: pointer;
}
.login-btn-confirm:hover {
  background-color: var(--login-theme-hover-color);
  border-color: var(--login-theme-hover-color);
}
.login-btn-confirm:focus {
  background-color: var(--login-theme-color);
  border-color: var(--login-theme-color);
}
.login-btn-confirm.is-disabled {
  cursor: not-allowed;
  background-color: var(--login-disabled-bgcolor);
  border-color: var(--login-disabled-bgcolor);
  color: var(--login-disabled-txt-color);
}
.login-dialog {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  left: 0;
  top: 0;
  z-index: 1000;
  transition: all 0.5s;
}
.login-dialog .login-dialog-wrap {
  width: 460px;
  margin: 15vh auto 0;
  background-color: var(--login-main-bgcolor);
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.login-dialog .login-dialog-wrap.is-guide {
  width: 980px;
  max-width: 96vw;
}
.login-dialog .login-dialog_header {
  padding: 20px 20px 10px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  line-height: 24px;
}
.login-dialog .login-dialog_header > h2 {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  font-size: 16px;
  color: var(--login-txt-color);
  line-height: 24px;
  font-weight: normal;
}
.login-dialog .login-dialog_header .lg-icon-close {
  font-size: 16px;
  cursor: pointer;
}
.login-dialog .login-dialog__body {
  padding: 10px 25px;
  font-size: 14px;
  line-height: 24px;
  color: var(--login-light-txt-color);
}
.login-dialog .login-dialog__body .login-dialog-guide {
  color: var(--login-light-txt-color);
}
.login-dialog .login-dialog__body .login-dialog-alert {
  display: flex;
  align-items: center;
  background-color: #ff4d4f;
  color: #fff;
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 20px;
}
.login-dialog .login-dialog__body .login-dialog-alert i {
  margin-right: 8px;
  font-size: 16px;
}
.login-dialog .login-dialog__body .login-dialog-desc {
  margin: 12px 0 18px;
  text-align: center;
  color: var(--login-txt-color);
}
.login-dialog .login-dialog__body .login-dialog-steps {
  border: 1px dashed #4c9dff;
  border-radius: 6px;
  padding: 18px 16px 16px;
  position: relative;
}
.login-dialog .login-dialog__body .login-dialog-steps-title {
  position: absolute;
  top: -12px;
  left: 12px;
  background-color: var(--login-main-bgcolor);
  padding: 0 10px;
  color: var(--login-txt-color);
  font-size: 14px;
}
.login-dialog .login-dialog__body .login-dialog-steps-content {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.login-dialog .login-dialog__body .login-dialog-step {
  width: 200px;
  text-align: center;
}
.login-dialog .login-dialog__body .login-dialog-step-badge {
  display: inline-block;
  background-color: #4c9dff;
  color: #fff;
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 12px;
  margin-bottom: 10px;
}
.login-dialog .login-dialog__body .login-dialog-step-image {
  width: 120px;
  height: 240px;
  margin: 0 auto 10px;
  background-color: #0f172a;
  border: 1px solid #111827;
  border-radius: 18px;
  position: relative;
  padding: 6px 5px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
}
.login-dialog .login-dialog__body .login-dialog-step-image::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 6px;
  border-radius: 10px;
  background-color: #1f2937;
}
.login-dialog .login-dialog__body .login-dialog-step-image img {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  position: relative;
  z-index: 1;
}
.login-dialog .login-dialog__body .login-dialog-step-text {
  font-size: 12px;
  line-height: 18px;
  color: var(--login-txt-color);
}
.login-dialog .login-dialog__body .login-dialog-step-text span {
  color: var(--login-theme-color);
  font-weight: bold;
}
.login-dialog .login-dialog__body .login-dialog-step-arrow {
  width: 24px;
  height: 24px;
  margin: 96px 12px 0;
  position: relative;
}
.login-dialog .login-dialog__body .login-dialog-step-arrow::before {
  content: "";
  width: 10px;
  height: 10px;
  border-top: 2px solid #4c9dff;
  border-right: 2px solid #4c9dff;
  transform: rotate(45deg);
  position: absolute;
  top: 6px;
  left: 6px;
}
.login-dialog .login-dialog__body .login-dialog-scenarios {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
}
.login-dialog .login-dialog__body .login-dialog-scenario {
  flex: 1;
  padding: 0 12px;
}
.login-dialog .login-dialog__body .login-dialog-scenario:first-child {
  padding-left: 0;
}
.login-dialog .login-dialog__body .login-dialog-scenario:last-child {
  padding-right: 0;
}
.login-dialog .login-dialog__body .login-dialog-scenario-title {
  text-align: center;
  font-size: 14px;
  color: var(--login-txt-color);
  font-weight: bold;
  margin-bottom: 16px;
}
.login-dialog .login-dialog__body .login-dialog-scenario-divider {
  width: 0;
  border-left: 2px dashed rgba(76, 157, 255, 0.4);
  margin: 0 8px;
}
.login-dialog .login-dialog_footer {
  padding: 10px 20px 20px;
  text-align: right;
}
.login-quick_links {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  position: relative;
}
.login-quick_links + .login-form-item {
  margin-top: 20px !important;
}
.login-quick_links.no-auth > li > a {
  font-weight: inherit;
  background-color: rgba(0, 0, 0, 0.4);
}
.login-quick_links.no-auth > li > a:hover {
  background-color: rgba(0, 0, 0, 0.6);
}
.login-quick_links.no-auth > li > a p,
.login-quick_links.no-auth > li > a svg {
  opacity: 0.6;
}
.login-quick_links > li {
  list-style: none;
  cursor: pointer;
  width: 25%;
}
.login-quick_links > li .beta-badge {
  position: absolute;
  top: 0px;
  width: 100%;
  right: -25px;
  background: #e6a23c;
  color: #fff;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 0 0 0 8px;
  transform: rotate(35deg);
  z-index: 10;
  font-weight: bold;
  pointer-events: none;
}
.login-quick_links > li .beta-badge-vip {
  position: absolute;
  right: 0;
  top: 0;
  width: 32px;
  height: 32px;
  background: url(https://industrydown1.fang.com/node-creis-login/2.4.6/assets/vip.d155fd11.svg) no-repeat;
  background-size: contain;
  z-index: 10;
}
.login-quick_links > li.fullW {
  width: 100%;
}
.login-quick_links > li.fullW > a {
  height: 48px;
}
@media screen and (max-width: 1440px) {
  .login-quick_links > li.fullW > a {
    height: 38px;
  }
}
.login-quick_links > li.is-active > a {
  background-color: var(--login-theme-color);
}
.login-quick_links > li.is-active > a .check {
  opacity: 1;
}
.login-quick_links > li.is-active > a:hover {
  background-color: var(--login-theme-color);
}
.login-quick_links > li > a {
  font-weight: bold;
  display: block;
  height: 72px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  margin: 1px;
  border-radius: 4px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 13px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1440px) {
  .login-quick_links > li > a {
    height: 54px;
  }
}
.login-quick_links > li > a .check {
  position: absolute;
  background: #fff;
  transform: rotate(45deg);
  display: block;
  width: 60px;
  height: 60px;
  top: -38px;
  right: -38px;
  opacity: 0;
}
.login-quick_links > li > a .check .lg-icon-check {
  font-size: 12px;
  color: var(--login-theme-color);
  font-weight: bold;
  transform: rotate(-45deg);
  position: absolute;
  left: 25px;
  top: 47px;
  z-index: 2;
}
.login-quick_links > li > a i {
  font-size: 16px;
}
.login-quick_links > li > a p {
  padding-top: 5px;
}
.login-quick_links > li > a:hover {
  background-color: #005ddb;
}
.login-quick_links.v-concise > li {
  width: 20%;
}
.login-quick_links.v-concise > li > a {
  height: 38px;
  line-height: 38px;
}
@media screen and (max-width: 1440px) {
  .login-quick_links.v-concise > li > a {
    height: 34px;
    line-height: 34px;
    border-radius: 3px;
  }
}
.login-quick_links.v-concise > li > a p {
  padding-top: 0;
}
.pop_edition {
  position: absolute;
  width: 100%;
  bottom: 100%;
  left: 0;
  background-color: rgba(0, 0, 0, 0);
  backdrop-filter: blur(10px);
  z-index: 30;
}
.pop_edition.fade-enter-active,
.pop_edition.fade-leave-active {
  -webkit-animation: none;
  animation: none;
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
}
.pop_edition.fade-leave-active,
.pop_edition.fade-enter-active {
  opacity: 0;
}
.pop_edition.new {
  position: inherit;
}
.pop_edition.new .login-quick_links li {
  width: 16.6666%;
  position: relative;
}
.pop_edition.new .login-quick_links li .sub-title {
  color: #fff;
  z-index: 1;
  position: absolute;
  bottom: 2px;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  left: 50%;
  transform: translateX(-50%);
}
.page-wrap,
.page-container {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: var(--login-gray-bg-color);
}
.bind-box {
  width: 800px;
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -60%);
}
.bind-header {
  height: 70px;
  line-height: 70px;
  text-align: center;
  background: linear-gradient(94deg, #165cd7 0%, #d2428a 100%);
}
.bind-header h1 {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  line-height: 70px;
}
.bind-container {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  padding: 30px 0 44px;
}
.bind-container .el-button--primary {
  background: var(--login-theme-color);
  border-color: var(--login-theme-color);
}
.bind-container .el-link {
  color: var(--login-light-txt-color);
}
.bind-container .el-link.el-link--primary {
  color: var(--login-theme-color);
}
.bind-container .el-link.el-link--info {
  color: var(--login-light-txt-color);
}
.bind-container .el-link:not(.el-link--info):hover {
  color: var(--login-theme-color);
}
.bind-container .el-input .el-input__inner {
  font-size: 12px;
}
.bind-container .el-input .el-input__inner:hover {
  border-color: var(--login-theme-color);
}
.bind-msg {
  font-size: 13px;
  color: var(--login-light-txt-color);
  text-align: center;
  margin-bottom: 20px;
}
.bind-title {
  width: 300px;
  margin: 40px auto 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--login-txt-color);
}
.bind-form {
  width: 300px;
  margin: 20px auto 0;
  color: var(--login-txt-color);
}
.bind-form.small .el-form-item {
  margin-bottom: 14px;
}
.bind-form .el-form-item {
  margin-bottom: 20px;
}
.bind-form .el-form-item--small {
  margin-bottom: 16px;
}
.bind-form .el-form-item--small .el-form-item__content {
  font-size: 13px;
}
.bind-form .el-form-item__label {
  float: none;
  display: block;
  line-height: 1;
  font-size: 13px;
  text-align: left;
  color: var(--login-txt-color);
  margin-bottom: 10px;
}
.bind-form .el-form-item__content {
  line-height: 1;
  margin-left: 0 !important;
}
.bind-form .el-input {
  display: block;
  width: 100%;
}
.bind-form .el-input .el-input__inner {
  border-radius: 0;
}
.bind-form .el-input .el-input__suffix {
  line-height: 40px;
}
.bind-form .el-input .el-input__suffix .el-link {
  font-size: 12px;
}
.bind-form .el-input .el-input__suffix .el-link::after {
  display: none;
}
.bind-form .el-form-item__error {
  padding-top: 2px;
}
.bind-form .bind-yzm {
  position: absolute;
  right: 0;
  top: 100%;
}
.bind-form .bind-yzm .el-button--text {
  font-size: 12px;
  color: var(--login-lighter-txt-color);
}
.bind-form .bind-yzm .el-button--text:hover {
  color: var(--login-theme-color);
}
.bind-btn {
  width: 300px;
  margin: 40px auto 0;
}
.bind-btn .el-button {
  display: block;
  width: 100%;
  font-size: 12px;
  border-radius: 0;
}
.bind-btn .el-button + .el-button {
  margin: 10px 0 0;
}
.bind-btn .el-button.el-button--primary {
  font-size: 16px;
}
.bind-tips {
  color: #f56c6d;
  line-height: 18px;
  font-size: 12px;
}
.bind-footer {
  font-size: 12px;
  color: var(--login-lighter-txt-color);
  text-align: center;
  padding: 30px 0;
  background: var(--login-gray-bg-color);
}