﻿@charset "utf-8";
/* -----------------------------------------
1st : 2021.09.30 hs-kim - 엠로 디자인팀
2nd : 2021.10.12 hs-kim - 엠로 디자인팀
3rd : 2021.10.15 hs-kim - 엠로 디자인팀
----------------------------------------- */

/* RESET */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, hr, pre, code, form, fieldset, legend, input, textarea, button,  p, blockquote, th, td, a {margin:0; padding:0;}
html, body {width:100%; height:100%;line-height: 1;}
body {font-size:12px;line-height:1.5em;font-family:'Malgun Gothic', 맑은 고딕, dotum, '돋움', gulim, '굴림', Arial, AppleGothic, verdana, sans-serif, helvetica; color:#424242;-webkit-text-size-adjust:none;}
h1, h2, h3, h4, h5, h6 {font-size:100%;font-family:'Malgun Gothic', 맑은 고딕, dotum, '돋움', gulim, '굴림', Arial, AppleGothic, verdana, sans-serif, helvetica;}
li {list-style:none;}
img, fieldset {border:0 none;}
img {vertical-align:middle;}
legend, hr {display:none;}
legend {position:absolute; top:0; left:0; width:0; height:0; display:block; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
caption {padding:0;width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}
select, textarea {font-size:100%; color:#424242; }
input {-webkit-appearance:none; border-radius:0;color:#666;}
button {overflow:visible;border:0 none;background:transparent;vertical-align:top;cursor:pointer;font-family:'돋움','dotum','Tahoma';}
button::-moz-focus-inner {border:0;padding:0;}
em, address {font-style:normal;}
table {border-spacing:0;}
a, a:link, a:visited {cursor:pointer;text-decoration:none; color:#424242;}
a:hover {color:#333333;}
p, a, h2, h3 {word-wrap:break-word;}
a, em, label, span, strong, button {display:inline-block;}
div, a {box-sizing: border-box;}

.mgl20{margin-left : 23px;}
.mgt10 {margin-top: 10px !important;}
.mt-20 {margin-top: 20px !important;}
.mt-55 {margin-top: 55px !important;}
.mb-10 {margin-bottom: 10px !important;}
.mb-15 {margin-bottom: 15px !important;}
.mb-20 {margin-bottom: 20px !important;}
.pt-15 {padding-top: 15px !important;}
.plr-10 {padding-left: 10px; padding-right: 10px;}
.flt-r {float: right !important;}
.flx {display: flex;justify-content: space-between !important;}

/* 웹접근성 */
#skip {position: absolute;overflow: hidden;width: 100%;margin: 0 auto;z-index: 901;}
#skip a {display: block;width: 100%;font-size: 0;line-height: 0; }
#skip a:hover,
#skip a:active,
#skip a:focus {padding-top: 5px;font-size: 13px;line-height: 1.6;color:#ffffff;font-weight: bold;text-align: center;background: #464646;}
#wrap{width: 100%;height: 100%;position: absolute;}
#wrap h3{display: none;}

/** -------------------------  내부 로그인  ----------------------------- **/
.in_Wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-content: space-between;
  width: 100%;
  height: 100%;
  min-width: 1200px;
  min-height: 900px;
}
#inner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 550px;
  height: 320px;
  margin-left: -275px;
  margin-top: -250px;  /*2021.10.15 hs-kim 수정*/
}
/*** 로고영역 ***/
.logoWrap { /*2021.10.15 hs-kim 수정*/
  height: 140px;
  text-align: center;
  padding-top: 70px;
}
/* 2021.10.15 hs-kim 삭제
.logoWrap .tit_bar { /*2021.10.12 hs-kim 추가
  width: 30px;
  height: 3px;
  border: 2px solid #25abe1;
  margin: 15px auto 0;
}
*/
/*** 로그인 영역 ***/
.loginWrap {
  height: 680px; /*2021.10.15 hs-kim 수정*/
  background: #4C93BC url(../img/login_img.png) repeat-x center;
  position: relative;
  width: 100%;
  box-sizing: border-box;
}
#inner .slogan {   /*2021.10.15 hs-kim 추가*/
  font-size: 24px;
  font-family: Arial;
  color: #fff;
  text-align: center;
  margin-bottom: 70px;
  line-height: 1.5;
  letter-spacing: 0.7px;
  opacity: 0.9;
}
#inner .loginBox {
  width: 100%;
  height: 100%;
  border-radius: 3px;
  background: #fff;
  padding: 60px;
  box-shadow: 0 20px 50px rgb(0 0 0 / 4%);
}
#inner .loginBox .tit_login {
  font-size: 30px;
  font-family: Arial;
  font-weight: normal;
  color: #083873;
  line-height: 1;
  margin-bottom: 15px;
}
#inner .btn_Area {
  float: right;
  width: 121px;
}
#inner .login_ico {
  padding: 37px 0 0 10px;
}
/* 로그인 : input */
.input_Area {
  float: left;
  width: 300px;
}
.input_Area .inputBox ul li:nth-child(1) {
	padding-bottom: 5px;
}
.input_Area .inputBox ul li:nth-child(2) {
	padding-bottom: 5px;
}
.input_Area .inputBox ul li input {
  width: 100%;
  height: 37px;
  padding: 0 20px;
  border: 1px solid #bebebe;
  background: #F8F8F8;
  border-radius: 2px;
  font-family: Arial;
	font-size: 15px;
  color: #666;
	box-sizing: border-box;
}
.input_Area .inputBox ul li input::placeholder {
  font-size: 14px;
	color: #999999;
}
/* 콤보박스 */
.loginBox .selectBox::after {
  content: '';
  display: block;
  clear: both;
}
.loginBox .selectBox select.in_plant {
  float: left;
  width:195px;
  height:37px;
  font-size: 15px;
  line-height:32px;
  padding:0 20px;
  border:1px solid #7DA2CE;
  border-radius:2px;
  color:#4A6E9B;
  font-family: Arial;
  background: #E4EEF9 url('../img/select_arr.png') no-repeat 90% 50%;
  box-sizing:border-box;
}
.loginBox .selectBox select.in_lang {
  float: right;
  width:100px;
  height:37px;
  font-size: 12px;
  line-height:32px;
  padding:0 20px;
  border:1px solid #7DA2CE;
  border-radius:2px;
  color:#4A6E9B;
  font-family: Arial;
  background: #fff url('../img/select_arr.png') no-repeat 83% 50%;
  box-sizing:border-box;
}
/* select_화살표 안나오게 */
select{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}
select::-ms-expand {
  display:none;
}
.in_container section .check_box {
  font-size:13px;
  color:#939393;
}
/* 로그인 옵션 : ID저장 */
.option {
  box-sizing: border-box;
}
.option p {
	display: inline-block;
	float: left;
	color: #888;
	font-weight: 500;
	line-height: 1;
    margin-right: 10px;
}
.option p input[type="checkbox"]:not(old) {
	width: 0;
	margin: 0;
	padding: 0;
	background: url(../img/ico_main.png) no-repeat 0 -436px;
	opacity: 0;
}
.option p input[type="checkbox"]:not(old) + label {
	display: inline-block;
	height: 15px;
	padding-left: 22px;
	background: url(../img/ico_main.png) no-repeat 0 -436px;
	text-align: left;
	vertical-align: top;
	cursor: pointer;
}
.option p input[type="checkbox"]:not(old):checked + label {
	background: url(../img/ico_main.png) no-repeat -151px -436px;
}
.option p label + span {
	padding-top: 1px;
	vertical-align: top;
  color: #5C5C5C;
}
.option div {
	display: inline-block;
	float: right;
  margin-top: -2px;
}
.loginBox a.id{
	padding-right: 5px;
	color: #888;
	font-weight: 500;
}
.option .pw_reset {
  color: #5C5C5C;
}
.option .pw_reset:hover {
  text-decoration: underline;
}

/* 로그인 버튼 */
.btn_Area a.login-btn {
  width: 100%;
  height: 121px;
  border-radius: 3px;
  background: #083873;
  font-size: 21px;
  color: #fff;
  font-family: Arial;
  text-align: center;
  box-sizing: border-box;
  line-height: 121px;
}
.btn_Area a.login-btn:hover {
  background: #2AAAE2;
}

/* 푸터 */
.footerWrap {
  width: 100%;
  height: calc(100% - 820px); /* 로고, 로그인 영역 height 뺌 */ /*2021.10.15 hs-kim 수정*/
  background: #fff;
  padding-top: 40px;
  vertical-align: middle;
  margin-top: auto;
}
.footerWrap .copyright {
  width: 1100px;
  margin: 0 auto;
}
.footerWrap .copyright ul {
  display: inline-block;
}
.footerWrap .copyright ul li {
  display: inline-block;
  font-size: 13px;
  color: #666666;
}
.footerWrap .copyright ul li::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 11px;
  margin: 0 10px;
  background-color: #CFCFCF;
  vertical-align: -1px;
}
.footerWrap .copyright ul li:first-child::before {
  content: none;
}
.footerWrap .copyright p  {
  float: right;
  font-family: Arial;
  font-size: 13px;
  color: #666666;
}

/** -------------------로그인 성공 및 실패 화면, 에러 화면 CSS--------------------- **/
/* message */
.messageWrap {
  background:#f1f1f1
}
.messageWrap .wrap {
  position:relative;
  width:100%;height:100%;
}
.messageWrap .container {
  position:fixed;
  left:50%;
  top:50%;
  width:500px;
  height:460px;
  margin-top:-280px;
  margin-left:-250px;
  box-shadow:0px 3px 8px #dadada;
  background:#fff;
}
.messageWrap .container2 {
  position:fixed;
  left:50%;
  top:50%;
  width:540px;
  height:500px;
  margin-top:-300px;
  margin-left:-270px;
  box-shadow:0px 3px 8px #dadada;
  background:#fff
}
.messageWrap .header {
  width:100%;
  height:52px;
  border-radius:5px 5px 0 0;
  background:#8e8c8b;
  box-sizing:border-box;
}
.messageWrap .header .logo {
  display:inline-block;
  width:152px;
  height:34px;
  background:url(../img/logo_message.png) no-repeat;
  margin:20px 0 0 25px;
  text-indent:-10000px;
}
.messageWrap .section {
  width:100%;
  box-sizing:border-box;
}
.messageWrap .section .subject {
  overflow:hidden;
  margin:80px auto 50px;
}
.messageWrap .section .subject b,
.messageWrap .section .subject span {
  display:inline-block;
  letter-spacing:-1px;
}
.messageWrap .section .subject b {
  font-size:80px;
  font-weight:normal;
  vertical-align:top;
  letter-spacing:-6px;
  line-height: 1;
}
.messageWrap .section .subject span {
  font-size:28px;
  color:#303030;
  font-weight:bold;
  line-height:1.2em;
  letter-spacing:-1px;
  padding-top:10px;
  padding-left:22px;
}
.messageWrap .section .explan {
  width:330px;
  min-height:32px;
  margin:0 auto;
  background:url(../img/ico_caution_y.png) no-repeat;
  padding-left:55px;
  font-size:12px;
  color:#7f7f7f;
  line-height:1.3em;
}
.messageWrap .section .subject2 {
  width:350px;
  margin:80px auto 50px;
}
.messageWrap .section .subject2 b {
  display:inline-block;
  min-height:32px;
  background:url(../img/ico_caution_y.png) no-repeat;
  padding-left:55px;
  padding-top:5px;
  font-size:24px;
  font-weight:bold;
}
.messageWrap .section .explan2 {
  width:370px;
  margin:0 auto;
  font-size:13px;
  color:#252424;
  line-height:1.5em;
  text-align:center;
}
.messageWrap .section .subject3 {
  width:360px;
  margin:90px auto 70px;
}
.messageWrap .section .subject3 b {
  display:inline-block;
  min-height:71px;
  background:url(../img/ico_logout_y.png) no-repeat;
  padding-left:100px;
  padding-top:5px;
  font-size:24px;
  font-weight:bold;
  line-height:1.3em;
}
.messageWrap .section .hr {
  width:360px;
  height:1px;
  background:#b1b1b1;
  margin:40px auto
}
.messageWrap .section .hr2 {
  width:400px;
  height:1px;
  background:#b1b1b1;
  margin:40px auto
}
.messageWrap .section .commt {
  text-align:center;
  font-size:15px;
  color:#252424;
  line-height:1.6em;
}
.messageWrap .section .commt b {
  font-weight:normal;
}
/*버튼 색상*/
.messageWrap .section .btn_bg_msg {
  width:280px;
  height:52px;
  border-radius:2px;
  border:0;
  background:#083873; /*버튼*/
  cursor:pointer;
  text-align:center;
  font-size:18px;
  color:#fff;
  line-height:1.3em;
}
/*버튼 Hover 색상*/
.messageWrap .section .btn_bg_msg:hover {
  background:#2AAAE2; /*Hover*/
  }
.messageWrap .section .btn_cnt {
  text-align:center;
  margin-top:25px;
}
/* 세션만료팝업 */
.messageWrap .container3 {
  position:fixed;
  left:50%;
  top:50%;
  width:500px;
  height:390px;
  margin-top:-210px;
  margin-left:-250px;
  box-shadow:0px 3px 8px #dadada;
  background:#fff;
}
.messageWrap .section .subject4 {
  width:320px;
  margin:80px auto 50px;
}
.messageWrap .section .subject4 b {
  display:inline-block;
  min-height:32px;
  background:url(../img/ico_caution_y.png) no-repeat;
  padding-left:55px;
  padding-top:5px;
  font-size:24px;
  font-weight:bold;
}

sc-window>.content-wrap>.content {/*2021.10.28 pjsuny*/
	overflow: hidden !important;
}

/** POPUP **/
sc-messagebox { /*2021.12.08 hs-kim 추가*/
	background: #fff;
}
sc-messagebox>.action>sc-button, .modal-footer a {
	background: #2AAAE2 !important;
	border: 1px solid #2AAAE2 !important;
	color: #fff !important;
	line-height: 1;
}
sc-messagebox>.action>sc-button:hover, .modal-footer a:hover {
	background: #ffffff !important;
	border: 1px solid #2AAAE2 !important;
	color: #2AAAE2 !important;
}
sc-window>sc-toolbar.header, sc-messagebox>sc-toolbar.header, sc-dialog>sc-toolbar.header {
	background: #363636 !important;
}
sc-window, sc-messagebox, sc-dialog {
	border: 1px solid #363636 !important;
	box-shadow: 5px 5px 20px #868686;
	border-radius: 5px;
}
sc-window>.header>sc-button {
    background-color: #363636;
 }
sc-window>.header>sc-button:hover {
    background-color: #666 !important;
}
#loadingWrap {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url("/ui/assets/img/login_loading.gif");
  background-position: center;
  background-repeat: no-repeat;
  background-color: rgba(37,170,225,0.1);
  z-index: 999;
  display: none;
}