@use './index.scss' as *;

/* 页面宽度小于1200px
------------------------------- */
@media screen and (max-width: $lg) and (min-width: $xs) {
  .login-container {
    .login-left {
      .login-left-img {
        top: 90% !important;
        left: 12% !important;
        width: 30% !important;
        height: 18% !important;
      }
    }
    .login-right {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }
}

/* 页面宽度小于576px
------------------------------- */
@media screen and (max-width: $xs) {
  .login-container {
    .login-left {
      display: none;
    }
    .login-right {
      width: 100% !important;
      .login-right-warp {
        width: 100% !important;
        height: 100% !important;
        border: none !important;
        .login-right-warp-mian {
          .el-form-item {
            display: flex !important;
          }
          .login-right-warp-main-title {
            font-size: 20px !important;
          }
        }
        .login-right-warp-one {
          &::after {
            right: 0 !important;
          }
        }
        .login-right-warp-two {
          &::before {
            bottom: 1px !important;
          }
        }
      }
    }
  }
}

/* 页面宽度小于375px
------------------------------- */
@media screen and (max-width: $us) {
  .login-container {
    .login-right {
      .login-right-warp {
        .login-right-warp-mian {
          .login-right-warp-main-title {
            font-size: 18px !important;
          }
        }
      }
    }
  }
}
