@charset "UTF-8";
input:autofill {
  -webkit-box-shadow: 0 0 0px 1000px rgba(255, 255, 255, 0) inset !important;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px rgba(255, 255, 255, 0) inset !important;
}

::-webkit-input-placeholder {
  color: #666;
  /* 设置颜色 */
}

.flex {
  display: flex;
}

.flex-direction {
  flex-direction: column;
}

* {
  position: relative;
  box-sizing: border-box;
}

html {
  width: 100vw;
  height: 100vh;
}

html body {
  width: 100vw;
  height: 100vh;
  padding: 0;
  margin: 0;
  color: black;
  overflow: hidden;
  position: relative;
  font-size: calc(100vw * 16 / 1920);
  background: url(../../images/login/body-bg.jpg) no-repeat;
  background-size: 100% 100%;
}

html body .main {
  width: 100vw;
  height: 100vh;
  position: relative;
  align-items: center;
}

html body .main .miniprogram {
  position: absolute;
  top: calc(100vh * 233 / 1080);
  right: calc(100vw * 125 / 1920);
  width: calc(100vw * 175 / 1920);
  height: calc(100vw * 220 / 1920);
  display: flex;
  flex-direction: column;
  align-items: center;
}

html body .main .miniprogram::after {
  content: '';
  position: absolute;
  bottom: 0;
  width: calc(100vw * 208 / 1920);
  height: calc(100vw * 204 / 1920);
  background: url(../../images/login/miniprogram_bg1.png) no-repeat;
  background-size: 100% 100%;
}

html body .main .miniprogram .miniprogram_bg {
  width: calc(100vw * 127 / 1920);
  height: calc(100vw * 127 / 1920);
  padding: calc(100vw * 6 / 1920);
  background: #133EB1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px #79D2FF inset;
  z-index: -1;
}

html body .main .miniprogram .miniprogram_bg .el-image {
  width: 100%;
  height: 100%;
}

html body .main .miniprogram .title {
  background: linear-gradient(0deg, #014EA4 0%, #3E9DFF 92%);
  border-radius: 2px;
  border: 1px solid;
  border-image: linear-gradient(0deg, #2A7BF4, #FFFFFF) 10 10;
  font-family: Microsoft YaHei;
  font-weight: bold;
  font-size: calc(100vw * 14 / 1920);
  height: calc(100vw * 26 / 1920);
  line-height: calc(100vw * 24 / 1920);
  color: #FFFFFF;
  width: fit-content;
  padding: 0 calc(100vw * 8 / 1920);
  z-index: 9;
  margin-top: calc(100vw * -5 / 1920);
}

html body .main .logo_box {
  margin-top: calc(100vh * 65 / 1080);
  align-items: center;
  position: relative;
}

html body .main .logo_box .logo_img .el-image {
  width: calc(100vw * 106 / 1920);
  height: calc(100vw * 106 / 1920);
}

html body .main .logo_box .logo_img .el-image:last-child {
  margin-left: calc(100vw * 10 / 1920);
}

html body .main .logo_box::after {
  content: '';
  position: absolute;
  width: calc(100vw * 622 / 1920);
  height: calc(100vw * 325 / 1920);
  background: url(../../images/login/light.png) no-repeat;
  background-size: 100% 100%;
  bottom: calc(100vw * -172 / 1920);
  left: 50%;
  transform: translate(-50%);
}

html body .main .logo_box .logo_text_cn {
  font-family: Microsoft YaHei;
  font-weight: bold;
  font-size: calc(100vh * 58 / 1080);
  color: #267AFD;
  background: linear-gradient(180deg, #D7F2FF 10.57129%, #79D2FF 88.33008%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

html body .main .logo_box .logo_text_en {
  font-family: Microsoft YaHei;
  font-weight: 400;
  font-size: calc(100vh * 22 / 1080);
  color: #79D2FF;
}

html body .main .swiper_box {
  height: calc(100vh * 402 / 1080);
  width: calc(100vh * 979 / 1080);
  margin-top: calc(100vh * 120 / 1080);
}

html body .main .swiper_box .swiper {
  width: 100%;
  height: 100%;
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: url(../../images/login/swiper-bg.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide:hover::after, html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide.active::after {
  background: url(../../images/login/swiper-active-bg.png) no-repeat;
  background-size: 100% 100%;
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide:hover .icon_box .icon, html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide.active .icon_box .icon {
  transform: translate(-50%) rotateY(360deg);
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide .icon_box {
  width: calc(100vh * 197 / 1080);
  height: calc(100vh * 142 / 1080);
  background: url(../../images/login/nav-bot.png) no-repeat;
  background-size: 100% 100%;
  margin-top: calc(100vh * 102 / 1080);
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide .icon_box .icon {
  width: calc(100vh * 93 / 1080);
  height: calc(100vh * 107 / 1080);
  position: absolute;
  z-index: 99;
  left: 50%;
  transform: translate(-50%);
  bottom: calc(100vh * 88 / 1080);
  transition: all 1s;
}

html body .main .swiper_box .swiper .swiper-wrapper .swiper-slide .name {
  font-family: Microsoft YaHei;
  font-weight: 400;
  font-size: calc(100vh * 30 / 1080);
  color: #FFFFFF;
  line-height: calc(100vh * 30 / 1080);
  margin-top: calc(100vh * 46 / 1080);
}

html body .main .foot_box {
  margin-top: auto;
  width: 100%;
  height: calc(100vh * 150 / 1080);
}

html body .main .foot_box .waves {
  width: 100%;
  height: calc(100vh * 60 / 1080);
}

html body .main .foot_box .parallax > use {
  animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.65, 0.5) infinite;
}

html body .main .foot_box .parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}

html body .main .foot_box .parallax > use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}

html body .main .foot_box .parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}

html body .main .foot_box .parallax > use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}

@keyframes move-forever {
  0% {
    transform: translate3d(-90px, 0, 0);
  }
  100% {
    transform: translate3d(85px, 0, 0);
  }
}

html body .main .foot_box .b_text {
  width: 100%;
  height: calc(100vh * 90 / 1080);
  background-color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: calc(100vh * 30 / 1080);
}

html body .main .foot_box .b_text .item {
  align-items: center;
}

html body .main .foot_box .b_text .item .icon {
  width: calc(100vh * 17 / 1080);
  min-width: calc(100vh * 17 / 1080);
  height: calc(100vh * 19 / 1080);
  margin-right: calc(100vh * 5 / 1080);
}

html body .main .foot_box .b_text .item .text {
  width: 100%;
  font-family: Microsoft YaHei;
  font-weight: 600;
  font-size: calc(100vh * 18 / 1080);
  line-height: calc(100vh * 24 / 1080);
  color: #666666;
}

html body .main .foot_box .b_text .item:nth-child(2) {
  margin: 0 calc(100vh * 50 / 1080);
}

html body .main .foot_box .b_text .item:nth-child(1) {
  position: relative;
}

html body .main .foot_box .b_text .item:nth-child(1)::before {
  content: '';
  position: absolute;
  bottom: calc(100vh * -10 / 1080);
  left: 0;
  width: 100%;
  height: calc(100vh * 1 / 1080);
  background-color: #DBDEEA;
}

html body .main .foot_box .b_text .item:nth-child(1)::after {
  content: '';
  position: absolute;
  bottom: calc(100vh * -11 / 1080);
  left: 0;
  width: calc(100vh * 90 / 1080);
  height: calc(100vh * 3 / 1080);
  background: #2153D7;
}

.el-dialog__wrapper .el-dialog {
  margin: 0 !important;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  background: transparent;
}

.el-dialog__wrapper .el-dialog .el-dialog__header {
  display: none;
}

.el-dialog__wrapper .el-dialog .el-dialog__body {
  width: calc(100vh * 517 / 1080);
  height: calc(100vh * 512 / 1080);
  background: white;
  border-radius: calc(100vh * 8 / 1080);
  padding: 0;
  position: relative;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .close {
  position: absolute;
  top: calc(100vh * 16 / 1080);
  right: calc(100vh * 20 / 1080);
  width: calc(100vh * 28 / 1080);
  height: calc(100vh * 28 / 1080);
  background: url(../../images/login/close.png) no-repeat;
  background-size: 100% 100%;
  cursor: pointer;
  transition: all 1s;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .close:hover {
  transform: rotate(360deg);
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: calc(100vh * 78 / 1080) calc(100vh * 78 / 1080);
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .title {
  font-family: Microsoft YaHei;
  font-weight: bold;
  font-size: calc(100vh * 38 / 1080);
  color: #108AF1;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form {
  margin-top: calc(100vh * 38 / 1080);
  width: 100%;
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item {
  width: 100%;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item:nth-child(1) .el-form-item__content .el-input::before {
  background: url(../../images/login/user.png) no-repeat;
  background-size: 100% 100%;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item:nth-child(2) .el-form-item__content .el-input::before {
  background: url(../../images/login/password.png) no-repeat;
  background-size: 100% 100%;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-input::before {
  content: '';
  width: calc(100vh * 20 / 1080);
  height: calc(100vh * 20 / 1080);
  position: absolute;
  left: calc(100vh * 12 / 1080);
  top: 50%;
  transform: translateY(-50%);
  z-index: 9;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-input .el-input__inner {
  padding-left: calc(100vh * 48 / 1080);
  position: relative;
  border: none;
  border-bottom: 1px solid #DBDEEA;
  font-family: Microsoft YaHei;
  font-weight: 400;
  font-size: calc(100vh * 16 / 1080);
  color: #000;
  background-color: rgba(255, 255, 255, 0);
  border-radius: 0;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-input .el-input__inner:autocomplete {
  background: #e70a0a;
  /* 自动填充时的背景色 */
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .icon_look {
  width: calc(100vw * 20 / 1920);
  height: calc(100vw * 20 / 1920);
  background: url(../../images/login/look.svg) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  right: calc(100vw * 20 / 1920);
  transform: translateY(-50%);
  cursor: pointer;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .icon_look.look_no {
  background: url(../../../images/login/look_no.svg) no-repeat;
  background-size: 100% 100%;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-button {
  width: 100%;
  height: calc(100vh * 57 / 1080);
  background: linear-gradient(49deg, #1E6AFD 0%, #4D8AFE 100%);
  border-radius: calc(100vh * 4 / 1080);
  font-family: Microsoft YaHei;
  font-weight: 400;
  font-size: calc(100vh * 24 / 1080);
  color: #FFFFFF;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-button:hover {
  opacity: 0.7;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .pop_box .el-form .el-form-item .el-form-item__content .el-button:active {
  opacity: 0.5;
}

.v-modal {
  opacity: 0.2;
}