.login { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: calc(100vh - 72px); background: url("../images/login-background.svg") no-repeat center/cover; padding: 40px 0; }

@media (max-width: 1024px) { .login > div { width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } }

.login__section { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 400px; }

@media (max-width: 1280px) { .login__section { width: 343px; } }

@media (max-width: 576px) { .login__section { width: 100%; padding: 0 16px; } }

.login__section--left .form-group--input { margin-bottom: 16px; }

@media (max-width: 576px) { .login__section--left .form-group--input { margin-bottom: 16px !important; } }

.login__section--left .toast-header--error { padding: 16px; }

.login__section--left .toast-header--error span { font-size: 1.2rem; }

@media (max-width: 576px) { .login__section--left .toast-header--error span { line-height: 18px; } }

@media (max-width: 576px) { .login__section--left .button { min-height: 48px !important; } }

.login__section--right { margin-left: 120px; }

@media (max-width: 1280px) { .login__section--right { margin-left: 40px; } }

@media (max-width: 1024px) { .login__section--right { margin-left: 0; } }

@media (max-width: 1024px) { .login__section--right .login__section__title { margin-bottom: 24px; text-align: center; } }

.login__section--right .login__section__desc { margin-bottom: 56px; }

@media (max-width: 1024px) { .login__section--right .login__section__desc { margin-bottom: 24px; text-align: center; } }

.login__section--right button { margin-bottom: 40px; }

@media (max-width: 576px) { .login__section--right button { min-height: 48px !important; } }

.login__section--right img { width: 100%; }

.login__section__title { color: #212121; font-size: 2.4rem; font-weight: 400; margin-bottom: 40px; }

@media (max-width: 576px) { .login__section__title { font-size: 2rem; font-weight: 300; margin-bottom: 24px; } }

.login__section__desc { color: #212121; font-size: 1.6rem; font-weight: 600; line-height: 24px; margin-bottom: 32px; }

@media (max-width: 576px) { .login__section__desc { font-size: 1.4rem; font-weight: 600; line-height: 21px; margin-bottom: 24px; } }

.login__section__dash { display: none; width: 100%; margin-top: 24px; padding-top: 24px; border-top: 1px solid #e0e0e0; }

@media (max-width: 1024px) { .login__section__dash { display: block; } }

.login__suggest { background-color: #fff2ef; border-radius: 6px; padding: 12px; font-size: 1.3rem; font-weight: 300 !important; margin-bottom: 32px; }

@media (max-width: 576px) { .login__suggest { margin-bottom: 24px; } }

.login__suggest p { color: #ff2e2e; }

.login__suggest p a { font-size: 1.3rem; }

.login__suggest__warning { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.login__suggest__warning .svg-icon { width: 16px; height: 16px; margin-right: 4px; fill: #9e9e9e; -ms-flex-item-align: start; align-self: flex-start; }

.login__suggest__warning span { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; line-height: 14px; }

@media (max-width: 1280px) { .login__suggest__warning span { line-height: 16px; } }