/* XpERP 로그인 */
.xperp_login_wrap {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; box-sizing: border-box; width: 514px; padding: 88px 65px 58px; background-color: #fff; z-index: 1;}
.xperp_login_wrap .logo {display: block; margin: 0 auto; width: 140px;}
.xperp_login_wrap .title {display: block; margin: 36px 0 0; line-height: 1.5; font-family: 'Pretendard', 'Noto Sans KR', Dotum, AppleGothic, sans-serif; font-size: 26px; font-weight: 700; color: #111; text-align: center;}
.xperp_login_wrap .title em {font-style: normal; font-weight: 700; color: #FF4851;}
.xperp_login_wrap .txt {margin: 6px 0 0; line-height: 1.5; font-family: 'Pretendard', 'Noto Sans KR', Dotum, AppleGothic, sans-serif; font-size: 16px; color: #111; text-align: center;}
.xperp_login_wrap .txt em {font-style: normal; font-weight: 700; color: #5885FF;}
.xperp_login_wrap .input_wrap {margin: 0 auto; width: 100%; max-width: 300px; padding: 60px 0 0; }
.xperp_login_wrap .input_wrap .xperp_input {position: relative;}
.xperp_login_wrap .input_wrap .xperp_input::before {display: block; position: absolute; top: 50%; transform: translateY(-50%); left: 16px; width: 24px; height: 24px; background-repeat: no-repeat; background-position: center; background-size: contain; content: '';}
.xperp_login_wrap .input_wrap .xperp_input.apt_code::before {background-image: url('../images/icon/ico_input_apt_code.png');}
.xperp_login_wrap .input_wrap .xperp_input.xperp_id::before {background-image: url('../images/icon/ico_input_id.png');}
.xperp_login_wrap .input_wrap .xperp_input.xperp_pw::before {background-image: url('../images/icon/ico_input_pw.png');}
.xperp_login_wrap .input_wrap .xperp_input + .xperp_input {margin: 10px 0 0;}
.xperp_login_wrap .input_wrap .xperp_input input {display: block; box-sizing: border-box; width: 100%; height: auto; padding: 10px 10px 10px 48px; line-height: 1.5; font-family: 'Pretendard', 'Noto Sans KR', Dotum, AppleGothic, sans-serif; font-size: 16px; font-weight: 500; color: #111; text-align: left; letter-spacing: 0.1px; border: 2px solid #E8E9EF; border-radius: 8px;}
.xperp_login_wrap .input_wrap .xperp_input.xperp_pw input {font-family: 'pass', 'Dotum'}
.xperp_login_wrap .input_wrap .btn_login {display: block; margin: 36px 0 0; width: 100%; height: 50px; line-height: 50px; font-family: 'Pretendard', 'Noto Sans KR', Dotum, AppleGothic, sans-serif; font-size: 18px; font-weight: 700; color: #fff; text-align: center; letter-spacing: 0.1px; background-color: #3C70FF; border-radius: 8px; box-shadow:  0px 15px 15px 0px rgba(0, 98, 255, 0.10); cursor: pointer;}
.xperp_login_wrap .center_txt {margin: 110px 0 0; line-height: 1.5; font-family: 'Pretendard', 'Noto Sans KR', Dotum, AppleGothic, sans-serif; font-size: 16px; text-align: center;}
.xperp_login_wrap .center_txt em {display: inline-block; font-style: normal; color: #81A4FF;}
.xperp_login_wrap .center_txt a {display: inline-block; color: #5B616C; text-decoration: none;}


@media all and (max-width: 540px) { 
	.xperp_login_wrap {width: 80%; max-width: 514px; padding: 60px 30px 40px;}
	.xperp_login_wrap .logo {width: 130px;}
	.xperp_login_wrap .title {margin: 30px 0 0; font-size: 24px;}
	.xperp_login_wrap .txt {font-size :15px;}
	.xperp_login_wrap .input_wrap {padding: 40px 0 0;}
	.xperp_login_wrap .center_txt {margin: 40px 0 0;}
}

@media all and (max-width: 375px) {
	.xperp_login_wrap {width: 85%; max-width: 514px; padding: 40px 24px 30px;}
	.xperp_login_wrap .logo {width: 110px;}
	.xperp_login_wrap .title {margin: 20px 0 0; font-size: 20px;}
	.xperp_login_wrap .txt {font-size :14px;}
	.xperp_login_wrap .input_wrap {padding: 30px 0 0;}
	.xperp_login_wrap .input_wrap .xperp_input input {font-size: 14px;}
	.xperp_login_wrap .input_wrap .btn_login {margin: 20px 0 0; height: 48px; line-height: 48px; font-size: 16px;}
	.xperp_login_wrap .center_txt {margin: 30px 0 0; font-size: 13px;}
}

@media all and (max-width: 320px) {
	.xperp_login_wrap {width: 85%; max-width: 514px; padding: 30px 24px;}
	.xperp_login_wrap .logo {width: 110px;}
	.xperp_login_wrap .title {margin: 20px 0 0; font-size: 19px;}
	.xperp_login_wrap .txt {font-size :13px;}
	.xperp_login_wrap .input_wrap {padding: 26px 0 0;}
	.xperp_login_wrap .input_wrap .xperp_input input {padding: 8px 10px 8px 48px; font-size: 14px;}
	.xperp_login_wrap .input_wrap .btn_login {margin: 20px 0 0; height: 44px; line-height: 44px; font-size: 15 px;}
	.xperp_login_wrap .center_txt {margin: 26px 0 0; font-size: 13px;}
}