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

/* 页面宽度小于1200px
------------------------------- */
@media screen and (max-width: index.$lg) and (min-width: index.$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: index.$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: index.$us) {
	.login-container {
		.login-right {
			.login-right-warp {
				.login-right-warp-mian {
					.login-right-warp-main-title {
						font-size: 18px !important;
					}
				}
			}
		}
	}
}
