@charset "UTF-8";

@import url("../../../common/css/app.css");

*, ::after, ::before { box-sizing: border-box; } /* 기존 bootstrap에 있던 부분 */
button, input, optgroup, select, textarea { font-family: inherit; line-height: inherit; }

body { font-family: 'Pretendard',sans-serif !important; font-size: 12px; font-weight: normal; }
body *{font-family: 'Pretendard',sans-serif !important;}
#loginWrap {
	position:absolute; 
	min-width:320px; 
	width:100%; 
	height:100%; 
	background-repeat: no-repeat;
	background-size: cover;
	float:left; overflow: hidden;
}
#loginWrap.wrap_c{background-image: url("../img/bg_login_c.png"); }
#loginWrap.wrap_d{background-image: url("../img/bg_login_d.png"); }
 
#loginWrap .alarm{width: 997px; height: 52px; background: url("../img/login_alarm.png") no-repeat; position: absolute; left: 151px; top: 4px; transform: rotate(0.1deg);}


#loginWrap .login_cont {
	position:relative;
	width: 455px;
	height: 487px;
	top:calc(50% - 243.5px);
	left: 238px;
}

#loginWrap .login_cont li {
	position:relative; 
	display:inline-block; 
	width: 100%; 
	float:left;
}

#loginWrap .login_cont .title {
	height:63px; 
	line-height: 58px; 
	margin-top: 40px; 
	letter-spacing: 1.3px; 
	font-family:'NanumSquareR',sans-serif; 
	color:#dcdcdc; 
	font-size: 40px;  
	text-align: center;
}

#loginWrap .login_cont .tit_dsc {
	height:20px; 
	margin-top: 1px;
}

#loginWrap .login_cont .tit_dsc .logo {
	display:inline-block; 
	width:158px; 
	height:14px; 
	margin-left: 77px; 
	margin-top:5px; 
	background: url("../img/logo_newzenSolution.png") no-repeat; 
	float:left
}

#loginWrap .login_cont .tit_dsc .logo + div {
	display:inline-block; 
	margin-left: 10px; 
	letter-spacing: 0.8px; 
	line-height: 22px; 
	font-weight: 600; 
	font-family:'NanumSquareL',sans-serif; 
	color:#dcdcdc; 
	font-size: 17px; 
	float:left
}

.loginTab { 
	width:210px; 
	height:38px; 
	display:inline-block; 
	font-family:NanumSquareRoundR; 
	padding-top:11px; 
	font-size:15px; 
    line-height: 1.1; 
    text-align:center; 
    color:#000000; 
    border-radius:20px; 
    cursor:pointer; 
}

#btnAgent { 
	background-color:#5e3a00; 
	border:1px solid #5e3a00; 
	margin-right:16px; 
}

#btnAgent:hover { 
	border-color:#ff9b00; 
	color:#ff9b00;
}

#btnAgent.on { 
	background-color:#ff9b00; 
	border-color:#ff9b00; 
}

#btnAgent.on:hover { 
	
	color:#000;
}

#btnUser { 
	background-color:#0c3c63; 
	border:1px solid #0c3c63; 
}

#btnUser:hover { 
	border-color:#008cff; 
	color:#008cff;
}

#btnUser.on { 
	background-color:#008cff; 
	border-color:#008cff; 
}

#btnUser.on:hover { 
	color:#000;
}


#loginWrap .userInput {
	/*margin-top: 64px;*/
	margin-top: 53px; 
	padding:0 8px; 
}

#loginWrap .userInput .inputBox {
	display:inline-block; 
	width: 267px; 
	height: 91px; 
	margin-right:12px; 
	float:left;
}

#loginWrap .userInput .inputBox > div {
	height: 39px; 
	margin-bottom: 13px;
} 

#loginWrap .userInput .inputBox div label {
	width:74px; 
	height:100%; 
	line-height:38px;  
	font-weight: 400; 
	font-size: 15px; 
	color:#fff; 
	float:left; 
}

#loginWrap .userInput .inputBox div input {
	width:calc(100% - 74px); 
	height:100%; 
	padding:0 10px; 
	color:#333333; 
	font-size:15px; 
	font-weight: 400; 
	border: 1px solid rgba(131,131,131,0.5); 
	float:left; 
}

#loginWrap .userInput .inputBox div input::-webkit-input-placeholder {
	font-family: 'NanumSquareRoundL',sans-serif;  
	color:#b6b6b6; 
	font-size:12px; 
	font-weight: bold;
}

#loginWrap .userInput .inputBox div input:-ms-input-placeholder {
	font-family: 'NanumSquareRoundL',sans-serif; 
	color:#b6b6b6; 
	font-size:12px; 
	font-weight: bold;
}

#loginWrap .userInput .inputBox + div {
	display:inline-block; 
	width: calc(100% - 279px); 
	height: 90px; 
	float:left;
}

#loginWrap .userInput .btn_login { 
	display:inline-flex; 
	width:100%; 
	height:100%; 
	text-align:center; 
	align-items: center; justify-content: center;
	background-color:#008cff; 
	border:1px solid #008cff; 
	font-size:17px; 
	font-weight: 400; 
	color:#ffffff !important; 
	float:left
}

#loginWrap .userCheck {
	height:20px; 
	padding-left:82px; 
	margin-top: 21px;
}

#loginWrap .agentCheck {
	height:20px; 
	padding-left:82px; 
	margin-top: 21px;
}

#loginWrap .userCheck input {
	display: none;
}

#loginWrap .agentCheck input {
	display: none;
}

#loginWrap .userCheck input:checked + label:after {
	content:""; 
	display:inline-block; 
	position: absolute; 
	left:0px; 
	top:1px; 
	width:18px; 
	height:14px; 
	background: url("../img/icon_check_clear.png") no-repeat; 
	background-size: 85%;
}

#loginWrap .userCheck label:before {
	content:""; 
	display:inline-block; 
	width: 12px; 
	height: 12px; 
	margin-top:2px; 
	margin-right: 7px; 
	background-color:#ffffff; 
	border: 1px solid rgba(131,131,131,0.5); 
	float: left;
}

#loginWrap .agentCheck input:checked + label:after {
	content:""; 
	display:inline-block; 
	position: absolute; 
	left:0px; 
	top:1px; 
	width:18px; 
	height:14px; 
	background: url("../img/icon_check_clear.png") no-repeat; 
	background-size: 85%;
}

#loginWrap .agentCheck label:before {
	content:""; 
	display:inline-block; 
	width: 12px; 
	height: 12px; 
	margin-top:2px; 
	margin-right: 7px; 
	background-color:#ffffff; 
	border: 1px solid rgba(131,131,131,0.5); 
	float: left;
}

#loginWrap .footTxt {
	font-family: 'NanumSquareRoundL',sans-serif; 
	padding-top: 13px; 
	color:#dddddd; 
	font-size: 13px; 
	text-align: center;
}

#loginWrap .userCheck label {
	position: relative; 
	color: #ffffff; 
	font-size: 13px; font-weight: 400;
	float: left; 
	cursor: pointer;
}

#loginWrap .agentCheck label {
	position: relative; 
	color: #ffffff; 
	font-size: 13px; 
	letter-spacing: -0.4px; 
	float: left; 
	cursor: pointer;
}

.help { 
	padding-left:2px; 
	height:39px; 
}

.help label { 
	width:74px; 
	height:100%; 
	padding-left:2px; 
	line-height:38px;  
	font-family: 'NanumSquareRoundL',sans-serif; 
	font-weight: bold; 
	font-size: 15px; 
	color:#dcdcdc; 
	float:left; 
}

.help input[type=text] { 
	width:calc(100% - 113px); 
	height:100%; 
	padding:0 10px; 
    font-size:12px; 
    font-weight:bold; 
    border: 1px solid rgba(131,131,131,0.5); 
    float:left; 
}

.help input[type=button] {
	width:39px; 
	height:39px; 
	cursor:pointer; 
	border:none; 
	background:#ff9b00 url('../../../common/img/zoom_help.png') 50% 50% no-repeat; 
}

.help input[type=button]:hover { 
	background:#5e3a00 url('../../../common/img/zoom_help_over.png') 50% 50% no-repeat; 
}

#loginWrap .footline {
	height:7px; 
	margin-top:52px; 
	background: rgba(255,255,255,.3);
}

#loginWrap .footTxt {
	font-family: 'NanumSquareRoundL',sans-serif; 
	padding-top: 13px; 
	color: #dddddd; 
	font-size: 13px; 
	text-align: center;
}

.functionWord { 
	margin-top:18px; 
	float:right; 
}

.functionWord span { 
	line-height: initial; 
	float:left; 
	font-size:13px; font-weight: 400;
	color:#fff !important; 
	cursor:pointer; 
	margin-left:20px; 
}

.functionWord span:hover { 
	color:#008cff !important; 
}

/* Dialogs */
.dlgFindIdForm { 
	width:607px; 
	/* height:360px; */ 
	position:fixed; 
	left:calc((100% - 607px)/2); 
	/*top:calc((100% - 438px)/2);*/
	top:calc((100% - 523px)/2);  
	padding:49px 0 38px; 
	background-color:white; 
	border-radius:8px; 
	box-shadow: 0 0 24px 0;
	display: inline-block; 
}

.dlgFindIdForm .ui-widget-content { 
	background:none; 
	padding:0 !important; 
}

.dlgFindIdFormTitle { 
	/* height:31px; */ 
	display:block; 
	font-family:NanumSquareL; 
	font-size:28px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindIdFormTitle .tit1 { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindIdFormTitle .tit2 { 
	height:20px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:14px; 
	line-height:1.56; 
	color:#8f8f8f; 
	margin-top:24px; 
}

.findTable { 
	margin:30px auto 30px; 
}

.findTable th { 
	height:20px; 
	font-family:NanumSquareL; 
	font-weight:normal; 
	vertical-align:top; 
	padding-top:7px; 
	font-size:14px; 
	line-height:2.11; 
	letter-spacing:-0.45px; 
	text-align:right; 
	color:#000000; 
}

.findTable td { 
	padding-left:16px; 
	padding-bottom:13px; 
	text-align:left; 
	font-family:NanumSquareL; 
}

.findTable td .box1 { 
	width:350px; 
	height:39px; 
	border:1px solid #dcdcdc; 
	background-color:#ffffff; 
	font-family:NanumSquareL; 
	font-size:18px; 
	font-weight:normal;
    font-style:normal; 
    line-height:2.11; 
    letter-spacing:-0.45px; 
    text-align:left; 
    color:#000000; 
    padding-left:20px; 
}

.dash { 
	width:10px; 
	margin-left:5.5px; 
	margin-right:5.5px; 
}

.btn_search { 
	width:178px; 
	height:46px; 
	border-radius:3px; 
	background-color:#649ae2; 
	display:inline-block; 
	cursor:pointer; 
}

.btn_search .btn_txt { 
	width:36px; 
	height:22px; 
	font-family:NanumSquareR; 
	display:inline-block; 
	vertical-align:middle; 
	font-size:20px; 
	line-height:1.7; 
	letter-spacing:-0.5px; 
	text-align:center; 
	color:white; 
} 

.dlgFindId { 
	width:525px; 
	height:251px; 
	position:fixed; 
	left:calc((100% - 525px)/2); 
	top:calc((100% - 251px)/2); 
	padding:49px 0 38px; 
	background-color:white; 
}

.dlgFindIdSuccess { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.findMessageBox { 
	width:453px; 
	height:50px; 
	border:1px solid #dcdcdc; 
	background-color:#fff; 
	margin:19px auto 35px; 
}
	
.findMessage { 
	height:22px; 
	font-family:NanumSquareL; 
	font-size:20px; 
	line-height:1.5; 
	text-align:center; 
	color:#000000; 
	display:inline-block; 
	vertical-align:bottom; 
}

.btn_ok { 
	width:178px; 
	height:46px; 
	border-radius:3px; 
	background-color:#649ae2; 
	cursor:pointer; 
	margin:0 auto; 
}

.btn_ok .btn_txt { 
	font-family:NanumSquareR; 
	height:26px; 
	display:inline-block; 
	vertical-align:bottom; 
	font-size:15px; 
	font-weight:normal; 
	line-height:2.5; 
	letter-spacing:-0.5px; 
	color:white; 
	cursor:pointer; 
}

.dlgFindIdFailure { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindIdFailure .findMessage { 
	color:#ff5454; 
}

.dlgFindPwForm { 
	width:607px;
	/* height:384xp; */
	position:fixed; 
	left:calc((100% - 607px)/2);
	top:calc((100% - 415px)/2); 
	padding:49px 0 38px; 
	background-color:white; 
	border-radius:8px; 
	box-shadow: 0 0 24px 0; 
}

.dlgFindPwFormTitle { 
	/* 	height:31px;  */
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindPwFormTitle .tit1 { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindPwFormTitle .tit2 { 
	height:20px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:14px; 
	line-height:1.56; 
	color:#8f8f8f; 
	margin-top:27px; 
}

.dlgFindPw { 
	width:524px; 
	height:251px; 
	position:fixed; 
	left:calc((100% - 524px)/2); 
	top:calc((100% - 251px)/2); 
	padding:50px 0 0px; 
	background-color:white; 
}

.dlgFindPwSuccess { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindPwFailure { 
	height:31px; 
	display:block; 
	font-family:NanumSquareL; 
	font-size:24px; 
	line-height:1.32; 
	letter-spacing:-0.7px; 
	text-align:center; 
	color:#000000; 
}

.dlgFindPwFailure .findMessage { 
	color:#ff5454; 
	font-size:15px; 
	vertical-align:middle; 
}