@CHARSET "UTF-8";


/* HTML(Common) Elements
---------------------------------------------------------*/
* { margin: 0; padding: 0; box-sizing: border-box; }
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type=number] {
	-moz-appearance: textfield;
}

html { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; height: 100%;}
body { padding: 0px; padding-top: 60px; margin: 0px; height: 100%; min-height: 100%; background:#fff; position: relative; overflow: auto; color: #262930; font-family:"Noto Sans KR","AppleGothic",sans-serif; font-size:13px;	font-weight: 400; word-break: keep-all; overflow-scrolling: touch;}
audio, canvas, progress, video { display:inline-block; vertical-align:baseline }
audio:not([controls]) {
 display:none;
 height:0
}
[hidden], template {
 display:none
}
ol, ul { margin: 0; list-style: none; }
a { text-decoration: none; cursor: pointer; color: #3c60e6; margin:0; padding:0; }
a:hover { color:#2c72f8; }
a:focus, a:hover { text-decoration: none; }
hr { height:0 !important; width:0 !important; overflow:hidden !important; position:absolute !important; }
img { border: none; vertical-align:middle; }
input, select, button, textarea { color: #4d4c4c; }

textarea { width: 100%; vertical-align: middle; }
button { border: none; cursor: pointer; }
table { border-collapse: collapse; width: 100%; }
iframe { border: none; }
*:focus { outline: none }
caption { height:0 !important; width:0 !important; overflow:hidden !important; position:absolute !important; }
legend, caption { display: none; }
em, i { font-style: normal; }
h1, h2, h3 { margin-top: 10px; }
label { margin: 0; }
[class^='col-xs-'], [class^='col-sm-'], [class^='col-md-'], [class^='col-lg-'] {padding-left: 5px;padding-right: 5px;}

select.form-control {-webkit-appearance:none; /* for chrome */ -moz-appearance:none; /*for firefox*/ appearance:none; padding: 6px 28px 6px 10px;}
select.form-control::-ms-expand{ display:none;/*for IE10,11*/}
select.form-control { background:url('/images/ic_sel.png') no-repeat 95% 50%/10px auto;}

.tac { text-align: center !important; }
.tal { text-align: left !important; }
.tar { text-align: right !important; }
.pl0 {padding-left: 0 !important;}
.pt0 {padding-top: 0 !important;}
.pr0 {padding-right: 0 !important;}
.pl20 {padding-left: 20px !important;}
.ml10 {margin-left: 10px !important}
.mt5{margin-top: 5px !important}
.mt20{margin-top: 20px !important}
.mt30{margin-top: 30px !important}
.mt40{margin-top: 40px !important}
.mt50{margin-top: 50px !important}
.mb35{margin-top: 35px !important}
.mb50{margin-bottom: 50px !important}
.mlr5 {margin-left: 5px; margin-right: 5px;}
.mlr10 {margin-left: 10px; margin-right: 10px;}
.fwb {font-weight: 700 !important }
.txt-orange {color: #f87350 !important;}
.txt-bl {color: #2c72f8 !important;}
.form-control {border-radius: 0; border: 1px solid #ddd;box-shadow: none;}
.val-m {align-items: center !important;}
.bkg-none {background: none !important;}
.position-r {position: relative !important;}
/*.bo-check {border:1px solid #ddd !important;}*/
.checkbox-inline { position: relative; height: 22px; line-height: 22px; padding-left:17px;}
.checkbox-inline input[type="checkbox"] + ins.form-control_01 { position: absolute; top: 1px; left: 0; width: 20px; height: 20px; padding: 0; border: none; }
.checkbox-inline input[type="checkbox"] + ins.form-control_01 { background: url("/images/bg_checkbox.png") no-repeat center bottom; background: none \0/IE8; }
.checkbox-inline input[type="checkbox"]:checked + ins.form-control_01 { background-position-y:1px; }
.checkbox-inline ins.form-control_01 + span { margin-left: 5px; }
.checkbox-inline span.label {color: #333; font-weight: 600; font-size: 13px;}
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox] { position: absolute; margin-top: 4px \9; margin-left: -16px;}


.eillp {white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: block;}
.scroll {overflow: auto;}
.clear { clear:both; }
.noDisplay { height:0 !important; width:0 !important; overflow:hidden !important; position:absolute !important; }
.hiddenBlock { display: none; }
.show { display: block; }
.bo-none {border-bottom: 0 !important;}
/* group */
.flex {display: flex;}
.flex[style*="display:block"]{display: flex !important}
.flex > * {flex: 1; box-sizing: border-box;line-height: 1}
.flex.fn > * {flex: none;}
.fn,
.flex > span {flex: none !important;}
.flex .file {vertical-align: middle; border: 0; width: 24px; height: 24px;}
.flex .prev {background: url("/images/ic_prev.png") no-repeat; width: 14px; height: 13px; cursor: pointer; margin-top: 3px; padding-right:40px;}
.flex .prev span,
.flex .next span {display: none;}
.flex .next {background: url("/images/ic_next.png") no-repeat; width: 14px; height: 13px; cursor: pointer;margin-top: 3px; margin-left: 40px;}


/* align */
.flex.center {justify-content: center;}
.flex.right {justify-content: flex-end;}

/* title */
.dfbox {position: relative;display: inline-block;width: 100%;}
.dfbox .lta {float: left; ;}
.dfbox .lta .input-group {position: relative; top:16px; margin-left: 30px; }
.dfbox .lta .input-group.date .input-group-addon button {width: 24px; height: 24px;background: url(../images/ic_cal_1.png) no-repeat 0 0;top: 7px; left: -173px;}
.dfbox .lta .select {margin-left: 40px; }
.dfbox .rta {float: right;}
.dfbox.type01 .rta .form-control {height: 30px; border-color: #bbbbbb; margin-top: 1px;}
.dfbox:after {content: ""; clear: both;}
.dfbox .lta > *,
.dfbox .rta > *,
.dfbox .cta > * {display: inline-block;}
.dfbox .lta > * + *,
.dfbox .rta > * + * {margin-left: 1px;}
.dfbox .cta > * + * {margin-left: 10px;}

.req {padding-left: 15px;}
.req:before {content: '*'; color: #f87350; position: absolute; left: 0;font-size: 20px; font-weight: 700;}

/* button */
.btnbox {display: flex; margin-top: 10px;}
.btnbox .lta, .btnbox .cta, .btnbox .rta {flex: auto;}
.btnbox .lta { }
.btnbox .cta {text-align: center; }
.btnbox .rta {text-align: right;margin-top: 20px;position: relative;}
.btnbox .lta > *+*,
.btnbox .cta > *+* {margin-right: 8px;}
.btnbox .cta button {margin-right: 6px !important}
.btnbox .cta button:last-child {margin-right: 0;}
.btnbox .rta button:last-child {margin-right: 0 !important}

.modal-open .modal {overflow: hidden;}
.modal-header {text-align: left; height: 55px; width: 100%}
.modal-header button.close { width: 20px;height: 20px; background: url(/images/btn_close.png) no-repeat 0 7px; text-indent: -9999px; opacity: 1;}
.modal-body {padding: 20px;}
.modal-body .search-box {padding: 20px !important;}
.modal-body .search-box dl dt {text-align: left;}
.modal-content {border-radius: 10px;}
.modal-footer {text-align: center; border-top: 0;}
.modal-footer .btn-group button {margin-right: 10px; border-radius: 0; outline: 0;}
.modal-footer .btn-group button:last-child {margin-right: 0;}
.btn-primary {background: #2c72f8; border: 1px solid #2c72f8;}
.btn-primary:hover {background: #2c72f8; border: 1px solid #2c72f8;}
.btn-default:hover {background:#fff; border:1px solid #adadad;}
.modal-dialog {margin: 250px auto; width: 500px;}
.modal-dialog .btn-group .btn {min-width: 70px;}

.btn {outline: 0;}

/* datepicker */
.datepicker { padding: 0; border: 2px solid #828282; border-radius: 0; margin-top: 15px}
.datepicker:before, .datepicker:after { display: none;}
.datepicker td, .datepicker th { width: 30px; height: 30px; border-top: 1px solid #ddd; border-left: 1px solid #ddd; border-radius: 0;color: #666666; font-size: 12px; font-weight: bold;}
.datepicker thead tr th { border: none;}
.datepicker thead tr:first-child { border-bottom: 1px solid #666666;}
.datepicker thead tr th.prev, .datepicker thead tr th.prev:hover { background: url("/images/ico_arrowLeftRight02.png") no-repeat 12px center; text-indent: -9999px;}
.datepicker thead tr th.next, .datepicker thead tr th.next:hover { background: url("/images/ico_arrowLeftRight02.png") no-repeat -41px center; text-indent: -9999px;}
.datepicker thead tr th.prev:hover, .datepicker thead tr th.next:hover { background-color: #eee;}
.datepicker thead tr + tr th { background: #f8f8f8;}
.datepicker thead tr + tr th:first-child { color: #f87350;}
.datepicker thead tr + tr th + th + th + th + th + th + th { color: #2c72f8;}
.datepicker tbody td:first-child { border-left: none;color: #f87350;}
.datepicker tbody td.old, .datepicker tbody td.new {color: #c5c5c5;}
.datepicker tbody td + td + td + td + td + td + td { color: #2c72f8;}
.datepicker tbody tr td.active { position: absolute; background: #f87350 !important; text-shadow: none; border: none;height: 28px;}
.datepicker .datepicker-months td, .datepicker .datepicker-years td { width: 280px; padding: 0;border-top: none;}
.datepicker .datepicker-months table tr td span, .datepicker .datepicker-years table tr td span { display: block; width: 70px; height: 40px; line-height: 40px; margin: 0; border-top: 1px solid #ddd; border-left: 1px solid #ddd;border-radius: 0;color: #666;}
.datepicker .datepicker-months table tr td span:first-child, .datepicker .datepicker-years table tr td span:first-child { border-left: none;}
.datepicker .datepicker-months table tr td span.active, .datepicker .datepicker-years table tr td span.active { background: #f87350 !important; text-shadow: none; border: none; color: #fff; line-height: 40px;}

.btn-cm {display: inline-block; padding: 7px 12px; margin-bottom: 0; font-size: 15px; font-weight: 400; line-height: 10px; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; background: #fff; border: 1px solid #BBBBBB; color: #262626; border-radius: 0; height: 30px; min-width: 70px;}
.dr {background: #555 !important; color: #fff !important; border:1px solid #555 !important;}
.gr {background: #f7f7f7; color: #888;}
.bl {background: #2c72f8 !important; color: #fff !important; border:1px solid #2c72f8 !important;}

#main .btn_s {font-size: 13px; height: 26px;min-width: 60px; padding: 5px 9px;display: inline-block;margin-bottom: 0;font-weight: 400;text-align: center;white-space: nowrap;cursor: pointer;background: #fff;
	border: 1px solid #BBBBBB;line-height: 110%;}
#main button.btn-cm {display: inline-block; padding: 7px 12px; margin-bottom: 0; font-size: 15px; font-weight: 400; line-height: 10px; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; background: #fff; border: 1px solid #BBBBBB; color: #262626; border-radius: 0; height: 30px; min-width: 70px;}
#main .dr {background: #888 !important; color: #fff !important; border:1px solid #888 !important;}
#main .gr {background: #f7f7f7; color: #888;}
#main .bl {background: #2c72f8 !important; color: #fff !important; border:1px solid #2c72f8 !important;}

#main .line {border-top:1px solid #ddd; margin-top: 30px; margin-bottom: 20px;}

#main .m-btn {position: absolute; right: 0; }



/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=layout----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
#header {
	width: 100%;
	height: 100px;
	background: #fff;
	font-family:"Noto Sans KR","AppleGothic",sans-serif; 
	position: fixed;
	top: 0;
	left: 0;
	z-index: 3000;
	padding: 6px;
	padding-left: 60px;
	line-height: 44px;
	font-size: 0;
	transition: all 0.3s;
	transform: translateY(-40%) translateZ(0);
	border-bottom: 1px solid #eee;
	z-index: 10;
}

#header .btn-sidebar-control {
	appearance: none;
	width: 200px;
	height: 100px;
	background: #2c72f8 url("/images/ci_01.png") no-repeat 30px 60px;
	border: none;
	outline: none;
	position: absolute;
	top: -7px;
	left: 0;
	cursor: default;
}

#header .btn-sidebar-control:before {
	/*content: '';*/
	/*display: none;*/
	/*width: 100%;*/
	/*height: 100%;*/
	/*border-radius: 50%;*/
	/*background: #fff;*/
	/*opacity: 0.05;*/
	/*position: absolute;*/
	/*top: 50%;*/
	/*left: 50%;*/
	/*transform: translateX(-50%) translateY(-50%);*/
}

#header .btn-sidebar-control:active:before { display: block; }

#header .btn-sidebar-control .icon {
	/*display: block;*/
	/*width: 24px;*/
	/*height: 24px;*/
	/*position: absolute;*/
	/*top: 50%;*/
	/*left: 50%;*/
	/*transform: translateX(-50%) translateY(-50%);*/
}

#header .btn-sidebar-control .icon hr {
	width: 100%;
	height: 2.4px;
	padding: 0;
	margin: 0;
	background: #F8F8F8;
	border: none;
	outline: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%) translateZ(0);
	transition: all 0.2s;
}

#header .btn-sidebar-control .icon hr:nth-of-type(1) {
	/*border-radius: 1.6px 0 0 0;*/
	/*transform: translateX(-50%) translateY(calc(-50% - 8px)) translateZ(0);*/
}

#header .btn-sidebar-control .icon hr:nth-of-type(2) {}

#header .btn-sidebar-control .icon hr:nth-of-type(3) {
	/*border-radius: 0 0 1.6px 0;*/
	/*transform: translateX(-50%) translateY(calc(-50% + 8px)) translateZ(0);*/
}

#header .btn-sidebar-control.on .icon hr:nth-of-type(1) {
	/*border-radius: 1.6px 0 1.6px 0;*/
	/*transform: translateX(-50%) translateY(-50%) translateZ(0) rotate(45deg);*/
}

#header .btn-sidebar-control.on .icon hr:nth-of-type(2) {
	/*transform: translateX(-50%) translateY(-50%) translateZ(0) scaleX(0); */
}


#header .btn-sidebar-control.on .icon hr:nth-of-type(3) {
	/*border-radius: 0 1.6px 0 1.6px;*/
	/*transform: translateX(-50%) translateY(-50%) translateZ(0) rotate(-45deg);*/
}

#header h1 {
	display: none;
	line-height: 110%;
	font-size: 20px;
	font-weight: 400;
	color: #333;
	padding: 0;
	margin: 0;
	vertical-align: middle;
	position: relative;
    top: 40px;
    padding-left: 230px;
}

#header .path {float: right; position: relative; padding: 42px 0 0;}
#header .path ul {display: block; position: relative;}
#header .path ul li {color: #666; font-size: 15px; float: right; padding-right: 20px;}
#header .path ul li a {color: #666; position: relative;padding-right: 34px;}
#header .path ul li:first-child {width: 16px; padding-left: 0; padding-right:0;}
#header .path ul li:first-child a {background: url(/images/ic_home_01.png) no-repeat; display: block; height: auto; width: 16px; background-position-y: 12px; }
#header .path ul li:nth-child(n+1) a:before {content: ''; background: url(/images/ic_arrow_02.png) no-repeat; width: 7px; height: 12px; display: inline-block;position: relative; right: 30px; top: 0;}
#header .path ul li:last-child a:before {background:none;}

#header .login-ci {}
#header .login-ci:before {content: ''; display: inline-block; background: url(/images/ci_03.png) no-repeat 0 0; width: 241px; height: 28px; padding-left: 50px; position: relative; top: 47px;}
#header .login-ci h1 {display: none;}

#header .header-in { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1160px; border:0px solid #000; height: 86px;}
#header .header-in:before {width: 100%;}

.sidebar-wrap {display: none;}

#main {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: auto;
	overflow-scrolling: touch;
	font-family:"Noto Sans KR","AppleGothic",sans-serif; 
}

#main .title-row {
	width: 100%;
	height: auto;
	position: relative;
	background: #E9E9E9;
}

#main .title-row:after {
	content: '';
	display: table;
	clear: both;
}

#main .tab-row {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	background: #fff;
	position: sticky;
	position: -webkit-sticky;
	top: 0;
	z-index: 1000;
}

#main .tab-row.ie-sticy {
	position: fixed;
	top: 0;
}

#main .tab-row.ie-sticy ~ .cont-row { margin-top: 48px;}



#main .tab-row:after {
	content: '';
	display: table;
	clear: both;
}

#main .tab-area:before {
	content: '';
	display: block;
	width: 100vw;
	height: 0;
	position: absolute;
	top: 46px;
	left: 0;
	border-bottom: 2px solid #DCDFE0;
}


#main .jumper-area {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
}

#main .jumper-btns {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	padding: 20px 0;
	font-size: 0;
	line-height: 100%;
}

#main .jumper-area .jumper-btns:empty { padding: 0;}

#main .jumper-area .jumper-btns a {
	display: inline-block;
	height: 20px;
	line-height: 20px;
	font-size: 13px;
	color: #101314;
	text-decoration: none;
	opacity: 0.5;
	margin-right: 28px;
	vertical-align: middle;
}

#main .jumper-area .jumper-btns a:hover,
#main .jumper-area .jumper-btns a.on { opacity: 1; text-decoration: underline;}

#main .jumper-area .jumper-btns a:last-of-type { margin-right: 0;}







#main .cont-row {
	width: 100%;
	height: auto;
	position: relative;
	background: #fff;
}

#main .cont-row:after {
	content: '';
	display: table;
	clear: both;
}

.guardrail {
	width: 1220px;
	height: auto;
	position: relative;
	padding: 30px 30px 0 30px;
	margin: 0 auto;
}

.guardrail:after {
	content: '';
	display: table;
	clear: both;
}

#main .title-area {
	width: 100%;
	height: auto;
	position: relative;
	padding-top: 110px;
	padding-bottom: 30px;
}

#main .title-area h1 {
	font-size: 54px;
	line-height: 60px;
	color: #313131;
}

#main .tab-area {
	width: 100%;
	height: auto;
	font-size: 0;
	
}

#main .tab-area .btn-tab-control {
	appearance: none;
	display: inline-block;
	width: auto;
	height: 48px;
	line-height: 48px;
	background: transparent;
	border: none;
	border-bottom: 2px solid transparent;
	outline: none;
	position: relative;
	font-size: 0;
	color: #5D6A71;
	cursor: pointer;
}

#main .tab-row[data-tab-act='1'] .tab-area .btn-tab-control:nth-of-type(1) { color: #E54E2B; border-bottom: 2px solid #E54E2B; }
#main .tab-row[data-tab-act='2'] .tab-area .btn-tab-control:nth-of-type(2) { color: #E54E2B; border-bottom: 2px solid #E54E2B; }
#main .tab-row[data-tab-act='3'] .tab-area .btn-tab-control:nth-of-type(3) { color: #E54E2B; border-bottom: 2px solid #E54E2B; }

#main .tab-row[data-tab-act] ~ .cont-row .cont-area { display: none;}
#main .tab-row[data-tab-act='1'] ~ .cont-row .cont-area:nth-of-type(1) { display: block; }
#main .tab-row[data-tab-act='2'] ~ .cont-row .cont-area:nth-of-type(2) { display: block; }
#main .tab-row[data-tab-act='3'] ~ .cont-row .cont-area:nth-of-type(3) { display: block; }

#main .tab-row[data-tab-act] .jumper-btns { display: none;}
#main .tab-row[data-tab-act='1'] .jumper-btns:nth-of-type(1) { display: block; }
#main .tab-row[data-tab-act='2'] .jumper-btns:nth-of-type(2) { display: block; }
#main .tab-row[data-tab-act='3'] .jumper-btns:nth-of-type(3) { display: block; }


#main .tab-area .btn-tab-control:active { color: #E54E2B; border-bottom: 2px solid #E54E2B; }

#main .tab-area .btn-tab-control:not(:first-of-type) { margin-left: 30px;}

#main .tab-area .btn-tab-control .label-txt {
	display: inline-block;
	vertical-align: middle;
	font-size: 16px;
	font-weight: 700;
}

#main .cont-area {
	width: 100%;
	height: auto;
	position: relative;
	padding-top: 60px;
	padding-bottom: 60px;
}

#main .cont-area .grouper {
	width: 100%;
	height: auto;
	position: relative;
	margin-top: 60px;
}

#main .cont-area .container {
	width: 100%;
	height: auto;
	position: relative;
}

#main .cont-area h2 + * { margin-top: 24px;}
#main .cont-area h3 + * { margin-top: 13px;}
#main .cont-area h4 + * { margin-top: 13px;}
#main .cont-area p + * { margin-top: 13px;}
#main .cont-area .container + * { margin-top: 13px;}
#main .cont-area figure + * { margin-top: 13px;}
#main .cont-area .example-box + * { margin-top: 13px;}
#main .cont-area .list-size-equal + * { margin-top: 13px;}
#main .cont-area .guide-table-wrap + * { margin-top: 13px;}

.page-top-wrap {
	width: 100%;
	height: 56px;
	position: fixed;
	bottom: 132px;
	text-align: right;
	pointer-events: none;
	z-index: 1000;
}

.btn-page-top {
	width: 56px;
	height: 56px;
	line-height: 56px;
	border: none;
	outline: none;
	border-radius: 2px;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	cursor: pointer;
	background: rgba(16,19,20,0.5);
	box-shadow: 0 8px 10px rgba(0,0,0,0.3);
	opacity: 0;
	pointer-events: none;
	transition: all 0.2s;
}

.btn-page-top.on { opacity: 1; pointer-events: all; }

.btn-page-top:hover { background: rgba(76,76,76,0.5); }
.btn-page-top:active { background: rgba(110,110,110,0.5); }



.bottom-nav {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	padding: 0;
	margin: 0;
	margin-top: 20px;
	margin-bottom: 60px;
	background: #EFEFF0;
	border-top: 1px solid #D8D8D8;
	color: #101314;
	list-style: none;
}

.bottom-nav > li {
	vertical-align: middle;
	width: 50%;
	height: 48px;
	line-height: 48px;
	overflow: hidden;
	position: relative;
	font-size: 0;
}

.bottom-nav > li:only-child { width: 100%; }

.bottom-nav > li.prev { padding-left: 48px; float: left; }
.bottom-nav > li.next { padding-right: 48px; float: right; }

.bottom-nav > li a .Licon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	color: #101314;
}

.bottom-nav > li a {
	display: block;
	width: 48px;
	height: 100%;
	border: none;
	outline: none;
	text-decoration: none;
	color: #101314;
	background: transparent;
	text-align: center;
	position: absolute;
	top: 0;
}

.bottom-nav > li a:hover { background: rgba(0,0,0,0.04); }
.bottom-nav > li a:active { background: rgba(0,0,0,0.08); }

.bottom-nav .btn-nav-prev { left: 0; border-right: 1px solid #D8D8D8; }
.bottom-nav .btn-nav-next { right: 0; border-left: 1px solid #D8D8D8; }

.bottom-nav > li p {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	padding: 0 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.bottom-nav > li.prev p { text-align: left; }
.bottom-nav > li.next p { text-align: right; }


#main .cont-area h2 {
	font-size: 28px;
	font-weight: 700;
	line-height: 32px;
	color: #000;
}

#main .cont-area h3 {
	font-size: 20px;
	font-weight: 700;
	line-height: 140%;
	color: #161616;
}

#main .cont-area h4 {
	font-size: 15px;
	font-weight: 700;
	line-height: 140%;
}

#main .cont-area section {
	width: 100%;
	height: auto;
	position: relative;
}

#main .cont-area a {
	color: #E54E2B;
	text-decoration: underline;
	line-height: inherit;
}

#main .cont-area a:active { color: #E54E2B; }
#main .cont-area a:visited { color: #E54E2B; }

.example-box {
	display: table;
	width: 100%;
	height: auto;
	position: relative;
	overflow: hidden;
	border-width: 1px;
	border-style: solid;
	border-color: #707070;
	background-color: transparent;
}

.example-box.type1 { border-color: #707070; background-color: transparent; }
.example-box.type2 { border-color: #707070; background-color: #E5E5E5; }
.example-box.type3 { border-color: transparent; background-color: #3B4951; color: #fff; }
.example-box.type4 { border-color: transparent; background-color: #E9E9E9; }

.example-box .content-holder {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}


#main .search-box {position: relative; background: #f6f9ff; border-top:2px solid #2c72f8; border-bottom:1px solid #dcdee3; padding: 30px; margin: 0 0 35px;}
#main .search-box dl {position: relative; clear: both; padding: 0; margin-bottom: 10px;}
#main .search-box dl:last-child {margin-bottom: 0}
#main .search-box dl dt {float: left; width: 130px; font-weight: 500; font-size: 13px;}
#main .search-box dl dd {float: left; font-weight: 400; font-size: 13px; color: #777;text-align: left;}
#main .search-box dl dd a {text-decoration: underline; }
#main .search-box dl dd:before {content: ':'; padding-right: 10px;}

#main .txt_18 {font-size: 18px;}

#main .con-box {position: relative; padding: 0; margin: 0 0 35px 0;}
#main .con-box dl {position: relative; clear: both; margin: 0; padding: 0;}
#main .con-box dl:last-child {margin-bottom: 30px;}
#main .con-box dl dt {float: left; width: 160px; font-weight: 500; font-size: 13px; padding-left: 30px;}
#main .con-box dl dt:before {content: ''; background: #555; width: 4px; height: 4px; border-radius: 50%; position: absolute; top: 12px; left: 15px; }
#main .con-box dl dd {float: left; font-weight: 400; font-size: 13px; color: #777;}
#main .con-box dl dd:before {content: ':'; padding-right: 10px;}

#main ul.ds-list-th {border-top: 1px solid #545454; border-bottom: 1px solid #e0e0e0; display: table; table-layout: fixed; overflow: hidden; width: 100%; background: #f8f8f8;}
#main ul.ds-list-th li {display: table-cell; height: 50px; padding: 15px 7px; box-sizing: border-box; color: #424242; font-weight: 500; text-align: center;}
#main ul.ds-list-th li .title {width: 500px;}

#main ul.ds-list-td {position:relative; overflow-x: hidden; overflow-y: auto; height:490px;border-bottom: 1px solid #424242;}
#main ul.ds-list-td li {height: 40px; box-sizing: border-box; border-bottom: 1px solid #eee;}
#main ul.ds-list-td li:last-child {border-bottom: 1px solid #ddd;}
#main ul.ds-list-td li ul.inner { display: table; table-layout: fixed; overflow: hidden; width: 100%;}
#main ul.ds-list-td li ul.inner li { font-size: 13px; font-weight: 400; line-height: 18px; display: table-cell; box-sizing: border-box; padding: 5px 8px; text-align: center;border-bottom: 0; vertical-align: middle;}

#main ul.place {display: flex; margin-top: 10px; margin-bottom: 40px; flex-wrap: wrap; align-items: flex-start; gap: 9px}
#main ul.place li {flex: 0 1 16%;}
#main ul.place li label {display: none;}
#main ul.place li a {display: block; background: #fff; color: #777; border: 1px solid #ddd; text-align: center; padding: 12px 15px; white-space: nowrap;}
#main ul.place li a.selected {background: #555; color: #fff; border: 1px solid #555;}

#main .form-group {display: flex; margin-top: 10px; margin-bottom: 40px; flex-wrap: nowrap;gap: 9px}
#main .form-group .txt-orange {line-height: 30px;}
#main .form-group .form-gr {flex: 0 1 15%; position: relative;}
#main .form-group .form-gr input::placeholder {color: #bbb;}
#main .form-group .form-gr .input-group-addon {padding: 0; border: none; background: none; position: absolute; right: 20px; top:0;}
#main .form-group .form-gr .input-group-addon button {width: 16px; height: 16px; padding: 0; margin-top: 1px; margin-left: 5px; border: none; background: url(ico_cal.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 7px; right: 9px; position: relative; outline: 0;}
#main .form-group .form-gr .input-group-addon button span {display: none;}

#main .contact {display: flex; margin-top: 10px; margin-bottom: 10px; flex-wrap: wrap; align-items: flex-start; gap: 9px}
#main .contact > div > span.txt-orange {line-height: 30px;}
#main .contact .inner {flex: 0 1 1; position: relative;  line-height: 36px;}
#main .contact .inner.dot {position: relative;display: flex;}
#main .contact .inner.dot:before { content: ':';padding-right: 10px;}
#main .contact .inner .form-control input::placeholder {font-size: 15px; color: #bbb;}
#main .contact .ti {width: 125px;}
#main .contact .fn {flex: none;}

#main .d-badge {display: inline-block; border-radius: 20px; border: 0; font-size: 13px; vertical-align: middle; line-height: 25px; /*background: #fff;*/ font-weight: 400; min-width: 90px; text-align: center; height: 30px;}
#main .d-badge.reject {border: 0; color: rgb(245, 93, 141); }
#main .d-badge.ok {border: 0; color: #2c72f8;}
#main .d-badge.cancel {border: 0; color: #aaa;}

#main .form-group-basic {padding: 0; margin: 0;}
#main .form-group-basic select {display: block; width: 100%; height: 34px; padding: 5px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none;border-radius: 0; border: 1px solid #ddd;}


/* paging */
#main .dataTables_paginate { float: none; margin: 20px 0;  padding: 0; text-align: center; height: 32px; position: relative; font-size: 15px;}
#main .dataTables_paginate .paginate_button { width: 32px; height: 32px; padding: 0 13px 0 12px; margin: 0; color: #4d4c4c !important; line-height: 30px; background-color: #ffffff}
#main .dataTables_paginate .paginate_button.disabled {color: #cecece !important; cursor: auto;}
#main .dataTables_paginate .paginate_button.current {background: #2c72f8; width: 32px; height: 32px; color: #fff !important; border-radius: 50%;}
#main .dataTables_paginate a:focus { outline:none; }
#main .dataTables_paginate .paginate_button span {display: none;}
#main .dataTables_paginate > span { display: inline-block; margin: 0 20px; padding: 0 13px 0 12px;}
#main .dataTables_paginate > .paginate_button {}
#main .dataTables_paginate .paginate_button.first { margin-right: 4px; text-indent: -9999px; background: #fff url("/images/icn_prev_start.png") no-repeat 0 0 !important;position: absolute;margin-left: -70px;}
#main .dataTables_paginate .paginate_button.first.disabled {background: url("/images/ico_arrowLeftRight.png") no-repeat 0 0 !important;}
#main .dataTables_paginate .paginate_button.previous { background: #fff url("/images/icn_prev.png") no-repeat 0 0; position: absolute; margin-left: -30px;}
#main .dataTables_paginate .paginate_button.previous.disabled { background: url("/images/icn_prev.png") no-repeat -26px center !important;}
#main .dataTables_paginate .paginate_button.next { text-indent: -9999px; background: #fff url("/images/icn_next.png") no-repeat 0 0;position: absolute;margin-left: 0;}
#main .dataTables_paginate .paginate_button.next.disabled { background: url("/images/ico_arrowLeftRight.png") no-repeat 0 0 !important;}
#main .dataTables_paginate .paginate_button.last { margin-left: 40px; text-indent: -9999px; background: #fff url("/images/inc_next_end.png") no-repeat 0 0;position: absolute;}
#main .dataTables_wrapper .dataTables_paginate .paginate_button.last.disabled { background: url("/images/ico_arrowLeftRight.png") no-repeat -111px center !important;}


#main .login-cont {position: relative;}
#main .login-cont .login-btn {width: 500px; position: absolute; top: 350px; left: 50%; transform: translate(-50%, -50%);}
#main .login-cont .login-btn ul { display: flex; margin-top: 15px;margin-bottom: 20px; flex-wrap: nowrap; gap: 9px;}
#main .login-cont .login-btn ul li {margin: 0; list-style: none;  flex: 1 1 50%; position: relative;}
#main .login-cont .login-btn ul li button {min-width: 150px; min-height: 150px; color: #fff; font-size: 25px;width: 100%;padding-left: 66px;}
#main .login-cont .login-btn ul li button.bt-01 {background: #2c72f8 url("/images/img_login.png") no-repeat;background-position: 45px 34px;}
#main .login-cont .login-btn ul li button.bt-02 {background: #888 url("/images/img_login.png") no-repeat; background-position: 45px 34px;}
#main .login-cont .login-btn ul.inline {display: flex; margin-top: 15px;margin-bottom: 20px; flex-wrap: wrap; gap: 9px; }
#main .login-cont .login-btn ul.inline li {flex: 1 1 100%; height: 100px;}
#main .login-cont .login-btn ul.inline li button {width: 100%; color: #656565; display: inline-block; padding: 15px 25px; margin-bottom: 0; font-weight: 400; line-height: 10px; text-align: left; white-space: nowrap; vertical-align: middle; cursor: pointer; background: #f8f8f8; border: 1px solid #BBBBBB; color: #262626; border-radius: 0; min-height: 100px; font-size: 20px;}
#main .login-cont .login-btn ul.inline li button span { position: absolute; top: 35px;}
#main .login-cont .login-btn ul.inline li button span.txt-bl {top:60px; color:#2c72f8 ;}
#main .login-cont .member {position: relative; height: 100%; width: 100%; }
#main .login-cont .member .inner {height: 650px; width: 1200px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#main .login-cont .member .inner ul { display: block; height: 100%;}
#main .login-cont .member .inner ul li { width: 50%; height: 100%; float: left; display: block; position: relative;}
#main .login-cont .member .inner ul li.bg {background: #2c72f8 url("/images/img_login_bg01.png") no-repeat 0 0; border-radius: 28px 0 0 28px; }
#main .login-cont .member .inner ul li.bg > * {color: #fff;}
#main .login-cont .member .inner ul li.bg .bg-in {position: relative; top:80px; left: 60px;}
#main .login-cont .member .inner ul li.bg .bg-in h2 {font-size: 50px; font-weight: 500;line-height: 48px;}
#main .login-cont .member .inner ul li.bg .bg-in h3 {font-size: 30px; font-weight: 500;}
#main .login-cont .member .inner ul li.cont {background: #fff; border-radius: 0 28px 28px 0;}
#main .login-cont .member .inner ul li.cont .cont-in {position: relative; margin: 130px 60px 0 60px;}
#main .login-cont .member .inner ul li.cont .cont-in > * {color: #444;}
#main .login-cont .member .inner ul li.cont .cont-in h2 {font-size: 30px; font-weight: 700; line-height: 50px;}
#main .login-cont .member .inner ul li.cont .cont-in h3 {font-size: 18px; font-weight: 400; color: #777;}
#main .login-cont .member .inner ul li.cont .cont-in ul {display: block; position: relative; width: 100%; margin-top: 40px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li {height: 110px; width: 100%; margin-bottom: 15px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button {width: 100%; height: 100%; border: 1px solid #e5e5e5; background: #fff; border-radius: 8px; text-align: left; padding: 15px 30px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button.stake,
#main .login-cont .member .inner ul li.cont .cont-in ul li button.indi {text-align: left; padding-left: 30px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button.indi:before {content: ''; background: url("/images/ic_user_01.png") no-repeat; width: 30px; height: 30px; position: absolute; top: 38px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button.stake:before {content: ''; background: url("/images/ic_user.png") no-repeat; width: 30px; height: 30px; position: absolute; top: 38px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button:hover {border-color: #2c72f8; background: #e9f3fd url("/images/ic_loginarrwo.png") no-repeat 420px center; }
#main .login-cont .member .inner ul li.cont .cont-in ul li button span {display: block; font-weight: 700; padding-left: 50px;}
#main .login-cont .member .inner ul li.cont .cont-in ul li button em {font-size: 12px; padding-left: 50px; font-weight: 500}
#main .login-cont .member .inner ul li.cont .cont-in ul li:last-child {margin-bottom: 0;}

#main .terms {position: relative; height: 100%;}
#main .terms ul.terms-ul {position: relative; display: flex;  flex-direction: column; height: 100%;}
#main .terms ul.terms-ul li.terms-tx {height: 100%; overflow: auto; min-height: 450px;}
#main .terms ul.terms-ul li.terms-tx .wrap_term .tit_g{font-size:20px;line-height:36px}
#main .terms ul.terms-ul li.terms-tx .wrap_term{padding-right:0}
#main .terms ul.terms-ul li.terms-tx .section_term h3{margin-top:50px;font-size:18px;color:#404040;}
#main .terms ul.terms-ul li.terms-tx .section_term h3:first-child {margin-top:0}
#main .terms ul.terms-ul li.terms-tx .section_term .tit_subject{padding-top:50px;font-weight:500;font-size:18px;line-height:29px}
#main .terms ul.terms-ul li.terms-tx .section_term .detail_terms:first-of-type .tit_subject{padding-top:0}
#main .terms ul.terms-ul li.terms-tx .section_term .tit_desc{margin-top:30px;font-weight:500;font-size:16px;line-height:26px}
#main .terms ul.terms-ul li.terms-tx .section_term .desc_agree{margin-top:15px;font-weight:400;font-size:14px;line-height:24px;color:#606060}/* 2021-02-23 수정 */
#main .terms ul.terms-ul li.terms-tx .section_term{padding-left:0;}
#main .terms ul.terms-ul li.terms-tx .section_term .line_terms{display:block;margin-top:50px;border-top:1px solid #e5e5e5}
/*#main .terms ul.terms-ul li.terms-tx .section_term .detail_terms + .detail_terms{overflow:hidden}*/
#main .terms ul.terms-ul li.terms-tx .list_number{overflow:hidden;font-weight:400;font-size:14px;line-height:24px;padding-left:0px;color:#606060;margin-top:15px;margin-bottom:15px}
#main .terms ul.terms-ul li.terms-tx .list_number .num_number{margin-right:4px}
#main .terms ul.terms-ul li.terms-tx .list_number .num_text{margin-right:7px;font-size:13px;line-height:22px;padding-left:4px}
#main .terms ul.terms-ul li.terms-tx .list_number .num_text > li{margin-top:7px}
#main .terms ul.terms-ul li.terms-tx .section_term .tit_subject{padding-top:40px;font-size:16px;line-height:24px}
#main .terms ul.terms-ul li.terms-tx .bluetop { border-collapse: collapse; border-top: 1px solid #000000; }  
#main .terms ul.terms-ul li.terms-tx .bluetop th { color: #333; background: #fff; padding-top: 15px !important;}
#main .terms ul.terms-ul li.terms-tx .bluetop th, .bluetop td { padding: 10px; border: 1px solid #ddd; }
#main .terms ul.terms-ul li.terms-tx .bluetop th:first-child, .bluetop td:first-child { border-left: 0; }
#main .terms ul.terms-ul li.terms-tx .bluetop th:last-child, .bluetop td:last-child { border-right: 0;}

#main .terms ul.terms-ul li.terms-ti {height: 100px; min-height: 100px; border-top: 1px solid #eee;}
#main .terms ul.terms-ul li.terms-ti select {width: 300px;}


.icon-list {
	width: 100%;
	height: auto;
	position: relative;
	list-style: none; 
	padding: 0;
	margin: 0;
	overflow: hidden;
	margin-top: 5px !important;
}

.icon-list > li {
	width: 160px;
	height: 160px;
	line-height: 158px;
	position: relative;
	border: 1px solid #BCBFC1;
	margin: 4px 3px;
	float: left;
	text-align: center;
	color: #101314;
}

.icon-list > li h5 {
	position: absolute;
	top: 16px;
	left: 16px;
	font-size: 12px;
}

.icon-list > li i {
	vertical-align: middle;
}






/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=site-cover------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
#main .cont-area.site-cover {
	width: 1200px;
	padding: 112px 100px 60px;
	color: #E9E9E9;
}

#main .cont-area.site-cover .title-section {
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(229,78,43,0.5);
}

#main .cont-area.site-cover .title-section .title-img {
	width: 705px;
	margin-bottom: 20px;
}

#main .cont-area.site-cover .title-section p {
	color: #E54E2B;
	font-size: 15px;
	font-weight: bold;
}





#main .cont-area.site-cover h2 { color: #E9E9E9; }
#main .cont-area.site-cover h3 { color: #E9E9E9; }
#main .cont-area.site-cover p { color: #E9E9E9; }




#main .cont-area.site-cover .shortcut-section .btn-document-download {
	text-decoration: none;
	display: inline-block;
	width: auto;
	height: 40px;
	line-height: 40px;
	position: absolute;
	right: 0;
	bottom: 0;
	font-size: 0;
	border-radius: 2px;
	padding: 0 16px;
	background: #f8f8f8;
}
#main .cont-area.site-cover .shortcut-section .btn-document-download:hover { background: #D8D8D8; }
#main .cont-area.site-cover .shortcut-section .btn-document-download:active { background: #A7A7A7; }


#main .cont-area.site-cover .shortcut-section .btn-document-download span {
	font-size: 14px;
	font-weight: bold;
	vertical-align: middle;
	color: #101314;
}

#main .cont-area.site-cover .shortcut-section .btn-document-download .Licon {
	margin-right: 4px;
	vertical-align: middle;
	color: #101314;
}


.menu-tile {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	list-style: none;
}

.guide-col-list.menu-tile > li {
	margin-top: 8px;
}

.menu-tile li a {
	display: block;
	width: 100%;
	height: 195px;
	
	border-radius: 4px;
	padding: 20px;
	text-decoration: none !important;
	position: relative;
}

.menu-tile.type1 li a {	 background: #E9E9E9; }
.menu-tile.type2 li a {	 background: #E54E2B; }
.menu-tile.type3 li a {	 background: #F6F1E7; }
.menu-tile.type4 li a {	 background: #5D6A71; }
.menu-tile.type5 li a {	 background: #DCDFE0; }

.menu-tile li a:visited {
	color: initial;
}

.menu-tile.type1 li a h5 {
	font-size: 40px;
	line-height: 110%;
	font-weight: bold;
	color: #CACACA;
	pointer-events: none;
}

.menu-tile.type2 li a h5,
.menu-tile.type3 li a h5,
.menu-tile.type4 li a h5,
.menu-tile.type5 li a h5 {
	font-size: 34px;
	line-height: 110%;
	font-weight: 400;
	pointer-events: none;
}

.menu-tile.type2 li a h5 { color: #fff; }
.menu-tile.type3 li a h5 { color: #E54E2B; }
.menu-tile.type4 li a h5 { color: #fff; }
.menu-tile.type5 li a h5 { color: #000; }

.menu-tile.type1 li a h6 {
	font-size: 18px;
	line-height: 110%;
	font-weight: 400;
	color:#101314;
	position: absolute;
	bottom: 20px;
	left: 20px;
	pointer-events: none;
	padding-right: 36px;
}

.menu-tile.type1 li a > .Licon {
	position: absolute;
	bottom: 20px;
	right: 20px;
	color:#101314;
}

.menu-tile li a .fake-btn {
	display: inline-block;
	height: 40px;
	line-height: 40px;
	position: absolute;
	right: 16px;
	bottom: 16px;
	
	font-size: 0;
	border-radius: 2px;
	padding: 0 16px;
}

.menu-tile li a .fake-btn span {
	font-size: 14px;
	font-weight: bold;
	vertical-align: middle;
}

.menu-tile li a .fake-btn .Licon {
	margin-right: 4px;
	vertical-align: middle;
}

.menu-tile.type2 li a .fake-btn { color: #101314; background: #F8F8F8; }
.menu-tile.type3 li a .fake-btn { color: #F8F8F8; background: #E54E2B; }
.menu-tile.type4 li a .fake-btn { color: #101314; background: #F8F8F8; }
.menu-tile.type5 li a .fake-btn { color: #F8F8F8; background: #101314; }

.menu-tile.type2 li a:hover .fake-btn { background: #D8D8D8; }
.menu-tile.type2 li a:active .fake-btn { background: #A7A7A7; }

.menu-tile.type3 li a:hover .fake-btn { background: #922412; }
.menu-tile.type3 li a:active .fake-btn { background: #531006; }

.menu-tile.type4 li a:hover .fake-btn { background: #D8D8D8; }
.menu-tile.type4 li a:active .fake-btn { background: #A7A7A7; }

.menu-tile.type5 li a:hover .fake-btn { background: #4C4C4C; }
.menu-tile.type5 li a:active .fake-btn { background: #6E6E6E; }

.menu-tile .adobe-xd-icon {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 22px;
	right: 16px;
}


/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=heading---------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
h1,h2,h3,h4,h5,h6 { display: block; margin:0; padding: 0; font-weight: 700; line-height: 125%;  cursor: default; position: relative; font-family:"Noto Sans KR","AppleGothic",sans-serif; ; user-select: none; padding-left: 10px;}
p {padding-left: 10px;}

#main h3 {font-size: 18px;}



/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=list------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.list-size-equal {
	width: 100%;
	height: auto;
	list-style: none;
	margin: 0;
	padding: 0;
	cursor: default;
	position: relative;
}

.list-size-equal:after {
	content: '';
	display: table;
	clear: both;
}

.list-size-equal > li {
	float: left;
}

.list-size-equal > li:first-child:nth-last-child(1) { width: 100%; }

.list-size-equal > li:first-child:nth-last-child(2),
.list-size-equal > li:first-child:nth-last-child(2) ~ li { width: calc((100% - 8px) / 2); margin-left: 8px; }
.list-size-equal > li:first-child:nth-last-child(2) { margin-left: 0;}

.list-size-equal > li:first-child:nth-last-child(3),
.list-size-equal > li:first-child:nth-last-child(3) ~ li { width: calc((100% - 16px) / 3); margin-left: 8px; }
.list-size-equal > li:first-child:nth-last-child(3) { margin-left: 0;}

.list-size-equal > li:first-child:nth-last-child(4),
.list-size-equal > li:first-child:nth-last-child(4) ~ li { width: calc((100% - 24px) / 4); margin-left: 8px; }
.list-size-equal > li:first-child:nth-last-child(4) { margin-left: 0;}

.list-size-equal > li:first-child:nth-last-child(5),
.list-size-equal > li:first-child:nth-last-child(5) ~ li { width: calc((100% - 32px) / 5); margin-left: 8px; }
.list-size-equal > li:first-child:nth-last-child(5) { margin-left: 0;}

.list-size-equal > li:first-child:nth-last-child(6),
.list-size-equal > li:first-child:nth-last-child(6) ~ li { width: calc((100% - 40px) / 6); margin-left: 8px; }
.list-size-equal > li:first-child:nth-last-child(6) { margin-left: 0;}



.guide-col-list {
	width: 100%;
	height: auto;
	list-style: none;
	margin: 0;
	padding: 0;
	cursor: default;
	position: relative;
}

.guide-col-list:after {
	content: '';
	display: table;
	clear: both;
}

.guide-col-list > li {
	float: left;
	margin-left: 4px;
	margin-right: 4px;
	margin-top: 24px;
}

.guide-col-list.guide-col-2 > li { width: calc((100% - 8px) / 2); }
.guide-col-list.guide-col-2 > li:nth-of-type(2n+1) { margin-left: 0; clear: both; }
.guide-col-list.guide-col-2 > li:nth-of-type(2n+2) { margin-right: 0; }
.guide-col-list.guide-col-2 > li:nth-of-type(1),
.guide-col-list.guide-col-2 > li:nth-of-type(2) { margin-top: 0;}

.guide-col-list.guide-col-3 > li { width: calc((100% - 16px) / 3); }
.guide-col-list.guide-col-3 > li:nth-of-type(3n+1) { margin-left: 0; clear: both; }
.guide-col-list.guide-col-3 > li:nth-of-type(3n+3) { margin-right: 0; }
.guide-col-list.guide-col-3 > li:nth-of-type(1),
.guide-col-list.guide-col-3 > li:nth-of-type(2),
.guide-col-list.guide-col-3 > li:nth-of-type(3) { margin-top: 0;}

.guide-col-list.guide-col-4 > li { width: calc((100% - 24px) / 4); }
.guide-col-list.guide-col-4 > li:nth-of-type(4n+1) { margin-left: 0; clear: both; }
.guide-col-list.guide-col-4 > li:nth-of-type(4n+4) { margin-right: 0; }
.guide-col-list.guide-col-4 > li:nth-of-type(1),
.guide-col-list.guide-col-4 > li:nth-of-type(2),
.guide-col-list.guide-col-4 > li:nth-of-type(3),
.guide-col-list.guide-col-4 > li:nth-of-type(4) { margin-top: 0;}

.guide-col-list > li.only-txt { padding-left: 16px;}




/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=table-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.guide-table-wrap {
	width: 100%;
	height: auto;
	position: relative;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
}

.guide-table {
	width: 100%;
	border: 1px solid #6E6E6E;
	table-layout: auto;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 20px;
}

.guide-table thead th { background: #E9E9E9; }

.guide-table th,
.guide-table td {
	border: 1px solid #6E6E6E;
	vertical-align: middle;
	text-align: center;
	padding: 10px 24px;
}

.guide-table th.txt-left,
.guide-table td.txt-left { text-align: left;}

.guide-table th.txt-right,
.guide-table td.txt-right { text-align: right;}



.guide-table.indexing-type {
	border-top: 2px solid #383838;
	border-left: none;
	border-right: none;
}

.guide-table.indexing-type thead tr *:first-child { border-left: none;}
.guide-table.indexing-type thead tr *:last-child { border-right: none;}

.guide-table.indexing-type tbody tr *:first-child { border-left: none;}
.guide-table.indexing-type tbody tr *:last-child { border-right: none;}

.guide-table.indexing-type thead tr * { border-bottom: 1px solid #848484; }
.guide-table.indexing-type tbody tr:first-of-type * { border-top: 1px solid #848484; }



.guide-table.indexing-type th,
.guide-table.indexing-type td { border: 1px solid #dcdcdc; padding: 12px 24px; }

.guide-table.indexing-type thead th { background: #f2f2f2; font-weight: 700;  padding: 14px 24px; }



/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=txt-------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.txt-primary { color: #fe6a2b;}
.txt-neutral1 { color: #2a3138; }
.txt-neutral2 { color: #5b6068; }
.txt-neutral3 { color: #a0a6af; }

.txt-w100 { font-weight: 100; }
.txt-w200 { font-weight: 200; }
.txt-w300 { font-weight: 300; }
.txt-w400 { font-weight: 400; }
.txt-w500 { font-weight: 500; }
.txt-w700 { font-weight: 700; }
.txt-w900 { font-weight: 900; }

.txt-0 { font-size: 0; }
.txt-10 { font-size: 10px; }
.txt-11 { font-size: 11px; }
.txt-12 { font-size: 12px; }
.txt-13 { font-size: 13px; }
.txt-14 { font-size: 14px; }
.txt-15 { font-size: 15px; }
.txt-16 { font-size: 16px; }
.txt-17 { font-size: 17px; }
.txt-18 { font-size: 18px; }
.txt-19 { font-size: 19px; }
.txt-20 { font-size: 20px; }
.txt-21 { font-size: 21px; }
.txt-24 { font-size: 24px; }
.txt-28 { font-size: 28px; }
.txt-30 { font-size: 30px; }
.txt-36 { font-size: 36px; }
.txt-48 { font-size: 48px; }
.txt-60 { font-size: 60px; }

.line-20 { line-height: 20px; }
.line-24 { line-height: 24px; }
.line-30 { line-height: 30px; }
.line-36 { line-height: 36px; }
.line-40 { line-height: 40px; }
.line-50 { line-height: 50px; }
.line-60 { line-height: 60px; }
.line-120per { line-height: 120%; }
.line-150per { line-height: 150%; }
.line-initial { line-height: initial; }
.line-inherit { line-height: inherit; }

.txt-center { text-align: center; }
.txt-left { text-align: left; }
.txt-right { text-align: right; }

.v-middle { vertical-align: middle; }
.v-top { vertical-align: top; }
.v-base { vertical-align:baseline; }

.txt-italic { font-style: italic; }
.txt-no-deco { text-decoration: none !important;}
.txt-underline { text-decoration: underline !important;}
.txt-overline { text-decoration: overline;}
.txt-throughline { text-decoration: line-through;}

.word-keep { word-break: keep-all;}
.word-break { word-break: break-all;}

.txt-ellipsis {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}




/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=display---------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.dp-inblock { display: inline-block; }
.dp-block { display: block; }
.dp-inline { display: inline;}

.full-w { width: 100%; }
.full-h { height: 100%; }

.over-hidden { overflow: hidden !important; }
.over-visible { overflow: visible !important; }

.float-l { float: left; }
.float-r { float: right; }
.float-none { float: none !important; }

.clear { clear: both; }
.clearfix:after {
	content: '';
	display: table;
	clear: both;
}

.pos-rel { position: relative;}
.pos-abs { position: absolute;}
.pos-stk { position: -webkit-sticky; position: sticky; }








/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=padding---------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.pd-h-1u { padding-left: 4px !important; padding-right: 4px !important; }
.pd-v-1u { padding-top: 4px !important; padding-bottom: 4px !important; }
.pd-h-2u { padding-left: 8px !important; padding-right: 8px !important; }
.pd-v-2u { padding-top: 8px !important; padding-bottom: 8px !important; }
.pd-h-3u { padding-left: 12px !important; padding-right: 12px !important; }
.pd-v-3u { padding-top: 12px !important; padding-bottom: 12px !important; }
.pd-h-4u { padding-left: 16px !important; padding-right: 16px !important; }
.pd-v-4u { padding-top: 16px !important; padding-bottom: 16px !important; }
.pd-h-5u { padding-left: 20px !important; padding-right: 20px !important; }
.pd-v-5u { padding-top: 20px !important; padding-bottom: 20px !important; }
.pd-h-6u { padding-left: 24px !important; padding-right: 24px !important; }
.pd-v-6u { padding-top: 24px !important; padding-bottom: 24px !important; }
.pd-h-7u { padding-left: 28px !important; padding-right: 28px !important; }
.pd-v-7u { padding-top: 28px !important; padding-bottom: 28px !important; }
.pd-h-8u { padding-left: 32px !important; padding-right: 32px !important; }
.pd-v-8u { padding-top: 32px !important; padding-bottom: 32px !important; }
.pd-h-9u { padding-left: 36px !important; padding-right: 36px !important; }
.pd-v-9u { padding-top: 36px !important; padding-bottom: 36px !important; }
.pd-h-10u { padding-left: 40px !important; padding-right: 40px !important; }
.pd-v-10u { padding-top: 40px !important; padding-bottom: 40px !important; }
.pd-h-15u { padding-left: 60px !important; padding-right: 60px !important; }
.pd-v-15u { padding-top: 60px !important; padding-bottom: 60px !important; }
.pd-h-20u { padding-left: 80px !important; padding-right: 80px !important; }
.pd-v-20u { padding-top: 80px !important; padding-bottom: 80px !important; }

.pd-t-1u { padding-top: 4px !important; }
.pd-b-1u { padding-bottom: 4px !important; }
.pd-l-1u { padding-left: 4px !important; }
.pd-r-1u { padding-right: 4px !important; }

.pd-t-2u { padding-top: 8px !important; }
.pd-b-2u { padding-bottom: 8px !important; }
.pd-l-2u { padding-left: 8px !important; }
.pd-r-2u { padding-right: 8px !important; }

.pd-t-3u { padding-top: 12px !important; }
.pd-b-3u { padding-bottom: 12px !important; }
.pd-l-3u { padding-left: 12px !important; }
.pd-r-3u { padding-right: 12px !important; }

.pd-t-4u { padding-top: 16px !important; }
.pd-b-4u { padding-bottom: 16px !important; }
.pd-l-4u { padding-left: 16px !important; }
.pd-r-4u { padding-right: 16px !important; }

.pd-t-5u { padding-top: 20px !important; }
.pd-b-5u { padding-bottom: 20px !important; }
.pd-l-5u { padding-left: 20px !important; }
.pd-r-5u { padding-right: 20px !important; }

.pd-t-6u { padding-top: 24px !important; }
.pd-b-6u { padding-bottom: 24px !important; }
.pd-l-6u { padding-left: 24px !important; }
.pd-r-6u { padding-right: 24px !important; }

.pd-t-7u { padding-top: 28px !important; }
.pd-b-7u { padding-bottom: 28px !important; }
.pd-l-7u { padding-left: 28px !important; }
.pd-r-7u { padding-right: 28px !important; }

.pd-t-8u { padding-top: 32px !important; }
.pd-b-8u { padding-bottom: 32px !important; }
.pd-l-8u { padding-left: 32px !important; }
.pd-r-8u { padding-right: 32px !important; }

.pd-t-9u { padding-top: 36px !important; }
.pd-b-9u { padding-bottom: 36px !important; }
.pd-l-9u { padding-left: 36px !important; }
.pd-r-9u { padding-right: 36px !important; }

.pd-t-10u { padding-top: 40px !important; }
.pd-b-10u { padding-bottom: 40px !important; }
.pd-l-10u { padding-left: 40px !important; }
.pd-r-10u { padding-right: 40px !important; }

.pd-t-15u { padding-top: 60px !important; }
.pd-b-15u { padding-bottom: 60px !important; }
.pd-l-15u { padding-left: 60px !important; }
.pd-r-15u { padding-right: 60px !important; }

.pd-t-20u { padding-top: 80px !important; }
.pd-b-20u { padding-bottom: 80px !important; }
.pd-l-20u { padding-left: 80px !important; }
.pd-r-20u { padding-right: 80px !important; }

.no-pd { padding: 0 !important;}



/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*=margin----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.mg-h-1u { margin-left: 4px !important; margin-right: 4px !important; }
.mg-v-1u { margin-top: 4px !important; margin-bottom: 4px !important; }
.mg-h-2u { margin-left: 8px !important; margin-right: 8px !important; }
.mg-v-2u { margin-top: 8px !important; margin-bottom: 8px !important; }
.mg-h-3u { margin-left: 12px !important; margin-right: 12px !important; }
.mg-v-3u { margin-top: 12px !important; margin-bottom: 12px !important; }
.mg-h-4u { margin-left: 16px !important; margin-right: 16px !important; }
.mg-v-4u { margin-top: 16px !important; margin-bottom: 16px !important; }
.mg-h-5u { margin-left: 20px !important; margin-right: 20px !important; }
.mg-v-5u { margin-top: 20px !important; margin-bottom: 20px !important; }
.mg-h-6u { margin-left: 24px !important; margin-right: 24px !important; }
.mg-v-6u { margin-top: 24px !important; margin-bottom: 24px !important; }
.mg-h-7u { margin-left: 28px !important; margin-right: 28px !important; }
.mg-v-7u { margin-top: 28px !important; margin-bottom: 28px !important; }
.mg-h-8u { margin-left: 32px !important; margin-right: 32px !important; }
.mg-v-8u { margin-top: 32px !important; margin-bottom: 32px !important; }
.mg-h-9u { margin-left: 36px !important; margin-right: 36px !important; }
.mg-v-9u { margin-top: 36px !important; margin-bottom: 36px !important; }
.mg-h-10u { margin-left: 40px !important; margin-right: 40px !important; }
.mg-v-10u { margin-top: 40px !important; margin-bottom: 40px !important; }
.mg-h-15u { margin-left: 60px !important; margin-right: 60px !important; }
.mg-v-15u { margin-top: 60px !important; margin-bottom: 60px !important; }
.mg-h-20u { margin-left: 80px !important; margin-right: 80px !important; }
.mg-v-20u { margin-top: 80px !important; margin-bottom: 80px !important; }

.mg-t-1u { margin-top: 4px !important; }
.mg-b-1u { margin-bottom: 4px !important; }
.mg-l-1u { margin-left: 4px !important; }
.mg-r-1u { margin-right: 4px !important; }

.mg-t-2u { margin-top: 8px !important; }
.mg-b-2u { margin-bottom: 8px !important; }
.mg-l-2u { margin-left: 8px !important; }
.mg-r-2u { margin-right: 8px !important; }

.mg-t-3u { margin-top: 12px !important; }
.mg-b-3u { margin-bottom: 12px !important; }
.mg-l-3u { margin-left: 12px !important; }
.mg-r-3u { margin-right: 12px !important; }

.mg-t-4u { margin-top: 16px !important; }
.mg-b-4u { margin-bottom: 16px !important; }
.mg-l-4u { margin-left: 16px !important; }
.mg-r-4u { margin-right: 16px !important; }

.mg-t-5u { margin-top: 20px !important; }
.mg-b-5u { margin-bottom: 20px !important; }
.mg-l-5u { margin-left: 20px !important; }
.mg-r-5u { margin-right: 20px !important; }

.mg-t-6u { margin-top: 24px !important; }
.mg-b-6u { margin-bottom: 24px !important; }
.mg-l-6u { margin-left: 24px !important; }
.mg-r-6u { margin-right: 24px !important; }

.mg-t-7u { margin-top: 28px !important; }
.mg-b-7u { margin-bottom: 28px !important; }
.mg-l-7u { margin-left: 28px !important; }
.mg-r-7u { margin-right: 28px !important; }

.mg-t-8u { margin-top: 32px !important; }
.mg-b-8u { margin-bottom: 32px !important; }
.mg-l-8u { margin-left: 32px !important; }
.mg-r-8u { margin-right: 32px !important; }

.mg-t-9u { margin-top: 36px !important; }
.mg-b-9u { margin-bottom: 36px !important; }
.mg-l-9u { margin-left: 36px !important; }
.mg-r-9u { margin-right: 36px !important; }

.mg-t-10u { margin-top: 40px !important; }
.mg-b-10u { margin-bottom: 40px !important; }
.mg-l-10u { margin-left: 40px !important; }
.mg-r-10u { margin-right: 40px !important; }

.mg-t-15u { margin-top: 60px !important; }
.mg-b-15u { margin-bottom: 60px !important; }
.mg-l-15u { margin-left: 60px !important; }
.mg-r-15u { margin-right: 60px !important; }

.mg-t-20u { margin-top: 80px !important; }
.mg-b-20u { margin-bottom: 80px !important; }
.mg-l-20u { margin-left: 80px !important; }
.mg-r-20u { margin-right: 80px !important; }

.no-mg { margin: 0 !important;}

.w60 {width: 60px !important;}
.w70 {width: 70px !important;}
.w100 {width: 100px !important;}
.w120 {width: 120px !important;}
.w150 {width: 150px !important;}
.w200 {width: 200px !important;}
.w250 {width: 250px !important;}
.w300 {width: 300px !important;}







@media screen and (max-width: 420px) {
	body { padding-top: 60px; padding-left: 0; }
	#header { transform: translateY(0) translateZ(0); height: 60px;}
	#header .header-in { position: absolute; top: 0; left: 0; width: 100%; height: 60px; transform: translateY(0);}
	#header .header-in .login-ci:before { top: 17px; left: 30px; background-size: 80%;}
	#header .header-in .btn-sidebar-control { height: 60px; width: 60px !important; background: #2c72f8 url(/images/ci.png) no-repeat center center; top: 0px; background-size: 30%;}
	#header .header-in .h1-txt {position: absolute; top:10px; left: 70px;
		/*border: 1px solid #000;*/
		display: inline-block;}
	#header .header-in .path {display: none;}
	#header .header-in .h1-txt h1 { display: inline-block; line-height: 145%; font-size: 19px; font-weight: 500; color: #333; padding: 0; margin: 0; vertical-align: middle; position: relative; top: 0; left: 23px; letter-spacing :-0.9px; }
	#header .header-in .h1-txt span { display: inline; background: url(/images/ic_arrow_01.png) no-repeat center center; position: absolute; top: 8px; left: 0; width: 25px; height: 25px; background-size: 30%;}

	/*.datepicker {top:150px !important; left: 16px !important;}*/
	.datepicker .datepicker-switch {width: auto;}
	.datepicker td, .datepicker th {width: 25px; height: 25px;}
	
	.sidebar-wrap {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 2000;
	display: block;
}

.sidebar-wrap .sidebar-dim {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: #000;
	opacity: 0.78;
	pointer-events: none;
	z-index: 2000;
	transition: all 0.3s;
}

#sidebar {
	width: 280px;
	height: 100%;
	background: #246fd9;
	font-family: 'Nanum Gothic','NotoSansKR','Malgun Gothic',sans-serif;
	position: fixed;
	top: 0;
	left: 0;
	padding-top: 130px;
	padding-bottom: 120px;
	pointer-events: all;
	z-index: 2001;
	transition: all 0.3s;
	transform: translateX(0) translateZ(0);
}

#sidebar .bi {
	width: 100%;
	height: 100px;
	padding: 26px 16px 0;
	position: absolute;
	top: 0;
	left: 0;
	background: #2c72f8;
	border-bottom:1px solid #206bd5;
}

#sidebar .bi img {
	display: block;
	width: auto;
	height: 20px;
	margin-top: 15px;
    margin-left: 36px;
}

#sidebar .bi h1 {
	line-height: 110%;
	font-size: 26px;
	font-weight: 700;
	color: #fff;
	padding: 0;
	margin: 0;
	margin-top: 4px;
}

#sidebar nav {
	width: 100%;
	height: 100%;
	position: absolute;
	top:100px;
	overflow: auto;
	overflow-scrolling: touch;
	padding-bottom: 48px;
}

#sidebar nav dl {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	list-style: none;
	padding: 0;
	margin: 0;
}

#sidebar nav dl dt {
	width: 100%;
	height: auto;
	min-height: 40px;
	overflow: hidden;
	position: relative;
	padding: 17px 38px 17px 25px;
	font-size: 0;
	line-height: 12px;
	color: #95bdf4;
	cursor: pointer;
}

#sidebar nav dl dt:before {
	content: '';
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: rgba(255,255,255,0.05);
}

#sidebar nav dl dt:active:before { display: block;}

#sidebar nav dl dt:after {
	content: "";
	/*font-family: 'Licon' !important;*/
	display: block;
	width: 9px;
	height: 5px;
	position: absolute;
	top: 50%;
	right: 16px;
	transform: translateY(-50%) translateZ(0);
	transition: all 0.3s;
	font-size: 16px;
	font-weight: 400;
	/*color: #B6BDC1;*/
	background: url("ic_arrow_05.png") no-repeat;
	
}

#sidebar nav dl dt:only-child:after { display: none; }

#sidebar nav dl dt.on:after { transform: translateY(-50%) translateZ(0) rotate(180deg); }
#sidebar nav dl dt.on + dd { display: block; }

#sidebar nav dl dt.act { color: #95bdf4; font-weight: 700; }
#sidebar nav dl dt.act:after { color: #6598e1; font-weight: 400; }
#sidebar nav dl dt.act + dd { background-color: #1d5cb6; }

#sidebar nav dl dt .label-txt {
	font-size: 20px;
	font-weight: 400;
	line-height: inherit;
}

#sidebar nav dl dd {
	display: none;
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	margin: 0;
	padding: 0;
	
}

#sidebar nav dl dd a {
	display: block;
	width: 100%;
	height: auto;
	min-height: 40px;
	overflow: hidden;
	position: relative;
	padding: 15px 16px 15px 50px;
	font-size: 0;
	line-height: 16px;
	color: #95bdf4;
	cursor: pointer;
	text-decoration: none;
}
	
#sidebar nav dl dt p,
#sidebar nav dl dd p {margin: 0;}	

#sidebar nav dl dd a.act { color: #F8F8F8; font-weight: 700;}
#sidebar nav dl dd a.act:after { opacity: 1; border-left: 8px solid #E54E2B; }

#sidebar nav dl dd a:before {
	content: '';
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: rgba(255,255,255,0.05);
}

#sidebar nav dl dd a:active:before { display: block;}

/*#sidebar nav dl dd a:after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 8px solid #F8F8F8;
	position: absolute;
	top: 16px;
	left: 20px;
	opacity: 0.1;
}*/

#sidebar nav dl dd a .label-txt {
	font-size: 16px;
	font-weight: inherit;
	line-height: inherit;
}

#sidebar .inquiry {
	border-top: 1px solid rgba(255,255,255,0.1);
	
}

#sidebar .inquiry a.btn-inquiry-mail {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-decoration: none;
	color: #B6BDC1;
	font-size: 0;
	padding: 0 16px;
}

#sidebar .inquiry a.btn-inquiry-mail:hover { background: rgba(255,255,255,0.05); }

#sidebar .inquiry a.btn-inquiry-mail i { vertical-align: middle; color: inherit; }
#sidebar .inquiry a.btn-inquiry-mail span {
	display: inline-block;
	font-size: 13px;
	font-weight: 400;
	vertical-align: middle;
	color: inherit;
	margin-left: 4px;
}

#sidebar .inquiry .copyright {
	padding: 20px 16px 0;
	border-top: 1px solid rgba(255,255,255,0.1);
	font-size: 0;
}

#sidebar .inquiry .copyright img {
	display: block;
	width: auto;
	height: 16px;
	opacity: 0.3;
}

#sidebar .inquiry .copyright p {
	color: #fff;
	opacity: 0.3;
	font-size: 11px;
	line-height: 20px;
}


	.guardrail { width: 100%; padding: 16px; }
	#main .in_info {position: relative;height: 20px;margin-right: 15px;margin-top: 15px};
	#main .in_info ul { float:right;padding: 0;margin: 0};
	#main .in_info ul li {float:left; display: inline-block; color:#555;margin-right: 15px};
	#main .in_info ul li:last-child{margin-right: 0};
	#main .in_info ul li button {height:30px;};
	#main .in_info ul li button span {color:#333};
	#main .in_info ul li span.company {display:none;}
	#main .in_info ul li span.name {color:#2c72f8;};

	#main .login-cont .member {overflow-x: hidden;}
	#main .login-cont .member .inner { width: 100%; height: auto; margin: 0 15px;}
	#main .login-cont .member .inner ul li.bg { display: none; /*height: 130px; width: calc(100% - 30px); border-radius: 28px 28px 0 0; background-position: 65px 0;*/}
	#main .login-cont .member .inner ul li.bg .bg-in h2,
	#main .login-cont .member .inner ul li.bg .bg-in h3,
	#main .login-cont .member .inner ul li.cont .cont-in h3 {display: none;}
	#main .login-cont .member .inner ul li.cont {width:calc(100% - 30px); border-radius: 28px ; margin: 0; padding: 40px 0 60px 0;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li { height: 70px; width: 100%; margin-bottom: 15px;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button {width: 100%;height: 100%;border: 1px solid #e5e5e5;background: #fff;border-radius: 8px;text-align: left;padding: 15px 30px;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:active {background: #e9f3fd url("/images/ic_loginarrwo.png") no-repeat 270px center; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:hover {background: transparent; border: 1px solid #e5e5e5; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.indi:before,
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.stake:before { content: ''; top: 22px; background-size: 80%;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button em {display: none;}
	#main .login-cont .member .inner ul li.cont .cont-in { position: relative; margin: 0 20px;}
	#main .search-box {padding: 20px;}
	#main .search-box dl {margin: 0 0 10px;}
	#main .search-box dl:last-child {margin-bottom: 0;}
	#main .search-box dl dt,
	#main .search-box dl dd {font-size: 16px !important; text-align: left;}
	#main .search-box dl dt {width: 95px; text-align: left;}
	#main ul.place li { flex: 0 1 100%;}
	#main .form-group .form-gr { flex: 0 1 49% !important;}
	#main .title-area { padding-top: 36px; padding-bottom: 24px; }
	#main .title-area h1 { font-size: 32px; line-height: 36px; }
	#main .tab-row { top: 0; }
	#main .cont-area { padding-top: 24px; padding-bottom: 48px; }
	#main .cont-area h2 { font-size: 24px; line-height: 28px; }
	#main .cont-area h3 { font-size: 18px; }
	
	#main .dfbox .lta h4,
	#main .dfbox .lta span {font-size: 17px;}
	
	#main .modal-content > * { font-size: 16px;}
	#main .modal-content .modal-header button.close { width: 100%; background-position-x: 278px;}
	#main .modal-content .modal-footer .btn-group button { font-size: 16px; min-width: 80px; height: 40px; line-height: 26px; width: inherit;}
	#main .btnbox .rta { float: none;}
	#main .btnbox.line .rta button.m-btn { width: 100%; position: relative;}
	#main .btnbox.line .rta button { height: 50px; line-height: 1; font-size: 18px; font-weight: 400;}
	#main .btnbox.line .rta button span.ic-input, 
	#main .btnbox.line .rta button span.ic-list, 
	#main .btnbox.line .rta button span.ic-home, 
	#main .btnbox.line .rta button span.ic-reject, 
	#main .btnbox.line .rta button span.ic-ok { display: inline-block;}
	#main .btnbox.line .rta button span.ic-input:before { content: ''; display: inline-block; background: url(/images/ic_input.png) no-repeat 0 0; width: 30px; height: 30px; margin-right: -6px; position: relative; top: 16px; background-size: 50%;}
	#main .btnbox.line .rta button span.ic-ok:before { content: ''; display: inline-block; background: url(/images/ic_ok.png) no-repeat 0 0; width: 30px; height: 30px; margin-right: -5px; position: relative; top: 16px; background-size: 50%;}
	#main .btnbox.line .rta button span.ic-home:before { content: ''; display: inline-block; background: url(/images/ic_home.png) no-repeat 0 0; width: 30px; height: 30px; margin-right: -5px; position: relative; top: 16px; background-size: 50%;}
	#main .btnbox.line .rta button span.ic-reject:before { content: ''; display: inline-block; background: url(/images/ic_reject.png) no-repeat 0 0; width: 30px; height: 30px; margin-right: -5px; position: relative; top: 16px; background-size: 50%;}
	#main .btnbox.line .rta button span.ic-list:before { content: ''; display: inline-block; background: url(/images/ic_list.png) no-repeat 0 0; width: 30px; height: 30px; margin-right: -7px; position: relative; top: 16px; background-size: 50%;}
	#main h3 {  display: none;}
	#main .form-group-basic { display: none;}
	#main ul.ds-list-th { display: none;}
	#main ul.ds-list-td { border-top: 1px solid #545454; height: auto; overflow-y: hidden; border-bottom: 0;}
	#main ul.ds-list-td li { position: relative; height: 100px; margin-top: 23px;}
	#main ul.ds-list-td li:before { content: ''; background: #777; width: 8px; height: 122px; display: inline-block; position: absolute; left: -18px; top: -23px;}
	#main ul.ds-list-td li.reject { position: relative;}
	#main ul.ds-list-td li.reject:before { content: ''; background: #2c72f8; width: 8px; height: 122px; display: inline-block; position: absolute; left: -18px; top: -23px;}
	#main ul.ds-list-td li ul.inner { display: table; table-layout: fixed; overflow: hidden; width: 100%; padding: 0 8px 23px;}
	#main ul.ds-list-td li ul.inner li { display: block; padding: 0; border: 0; margin: 0; text-align: left; height: initial; font-size: 1.5rem;}
	#main ul.ds-list-td li ul.inner li span {font-size: 1.5rem;}
	#main ul.ds-list-td li ul.inner li:before {background: none;}
	#main ul.ds-list-td li ul.inner li .d-badge { border: 0; background: transparent; line-height: 25px; padding: 0; margin-left: 0; text-align:left; font-size: 1.5rem;}
	#main ul.ds-list-td li ul.inner li:last-child { position: absolute; right: 10px; top: 27px; text-align: right;}
	
	#main .con-box dl dt {width: 133px; padding-left: 33px;}
	#main .con-box dl dt:before { top: 10px; left: 21px;}
	#main .con-box dl dt, 
	#main .con-box dl dd { font-size: 16px;}
	#main .contact .inner.flex.val-m.dot .form-control {background: url(/images/ic_sel.png) no-repeat 88% 50%/10px auto;}
	
	#main span.label {font-size: 16px;}
	#main .contact > * {font-size: 16px;}
	#main .contact .ti { width: 100px;}
	#main .contact .inner { flex: 1 1 0; position: relative; }
	
	#main .modal-content .modal-footer .btn-group button { font-size: 16px; min-width: 60px; height: 40px; line-height: 13px; width: inherit;}
	#main button.btn-cm { height: 36px; padding: 0 11px; vertical-align:middle; line-height:145%; }
	#main .dataTables_paginate { display: none;}
	#main .modal-dialog { margin: 250px auto; width: 330px;}
	#main .btnbox .rta { float: none;}
	#main .btnbox .rta.d-btn { text-align: center;}
	#main .btnbox .rta.d-btn button { width: 47%; position: relative;}
	#main .line { border-top: 0; margin-top: 0;}
	#main .btnbox.line .rta button { height: 50px; line-height: 47px; font-size: 16px; font-weight: 400; }
	#main .btnbox.line .rta.d-btn {display: flex;gap: 9px;}
	#main .btnbox.line .rta.d-btn button {flex-grow: 1;}
	
	#modal-confirm .modal-dialog .modal-content .modal-header.bo-none button {width: 100%;}
	#modal-confirm .modal-dialog .modal-content .modal-footer .btn-group button {width: inherit; height: 36px; vertical-align:middle; line-height:145%; }
	
	#main .terms ul.terms-ul li.terms-ti { height: 50px; min-height: 50px;  border-top: 1px solid #eee;padding-top: 15px;}
	#main .terms ul.terms-ul li.terms-ti .select_box.select label {display: none;}
	#main .form-control { width: 100% !important; font-size: 16px; background: url(/images/ic_sel.png) no-repeat 96% 50%/10px auto; height: 36px; vertical-align:middle; line-height:145%;  padding: 6px 9px;}
	
	#main .terms ul.terms-ul li.terms-tx .bluetop th,
	#main .terms ul.terms-ul li.terms-tx .bluetop td { font-size: 14px;}

	figure .bg-box { padding: 16px;}

	.list-size-equal > li { width: 100% !important; margin: 0 0 8px !important;}

	.guide-col-list > li {
		width: 100% !important;
		float: left;
		margin: 0 !important;
		margin-top: 24px !important;
	}

	.guide-col-list > li:first-of-type { margin-top: 0 !important;}
	.guide-col-list > li.only-txt { margin-top: 13px !important; padding-left: 0;}

	.guide-table { font-size: 12px; line-height: 16px;}
	.guide-table th,
	.guide-table td { padding-left: 12px !important; padding-right: 12px !important; }

	#main .cont-area.site-cover { width: 100%; padding: 24px 16px 36px; }
	#main .cont-area.site-cover .title-section .title-img { width: 100%; }
	#main .cont-area.site-cover .shortcut-section .btn-document-download { position: relative; right: auto; bottom: auto;}
	#main .btn_s {font-size: 13px; height: 36px;min-width: 70px; padding: 0px 11px;display: inline-block;margin-bottom: 0;font-weight: 400;text-align: center;white-space: nowrap;cursor: pointer;background: #fff;
		border: 1px solid #BBBBBB; line-height: 145%;}
	.guide-col-list.menu-tile > li {margin-top: 8px !important; }
	.menu-tile li a { height: 140px;}

	.bottom-nav { margin-bottom: 24px;}

	.page-top-wrap { bottom: 80px;}
	
}


@media screen and (min-width: 421px) {
	#main .tab-area .btn-tab-control:hover { color: #E54E2B; border-bottom: 2px solid #E54E2B; }
}

@media screen and (min-width: 421px) and (max-width: 1280px) {
	body { padding-top: 100px; padding-left: 0; }
	#header { transform: translateY(0) translateZ(0); }
	#header .header-in {position: absolute; top: 0; left: 0; width: 100%; height: 100px;transform: translate(0);}
	#header .header-in:before {width: 100%;}
	#header .header-in .btn-sidebar-control {width: 100px !important; background: #2c72f8 url(/images/ci.png) no-repeat center center;top: 0px;}

	#header .header-in .h1-txt {position: absolute; top:10px; left: 70px;
		/*border: 1px solid #000;*/
		display: inline-block;}
	#header .header-in .h1-txt h1 { display: inline-block; line-height: 145%; font-size: 30px; font-weight: 400; color: #333; padding: 0; margin: 0; vertical-align: middle; position: relative; top: 19px; left: 85px; letter-spacing :-0.9px; }
	#header .header-in .h1-txt span { display: inline; background: url(/images/ic_arrow_01.png) no-repeat center center; position: absolute; top: 25px; left: 47px; width: 30px; height: 30px; background-size: 50%;}

	/*#header .header-in h1 {  display: inline-block; line-height: 110%; font-size: 30px; font-weight: 400; color: #333; padding: 0; margin: 0; vertical-align: middle; position: relative; top: 24px; padding-left: 160px;}*/
	/*#header .header-in h1:before {content:''; display:inline-block;  background: url(/images/ic_arrow_01.png) no-repeat; position: absolute; top: 6px; left: 130px; width: 13px; height: 24px;}*/
	#header .header-in .path {display: none;}
	#header .header-in .login-ci {position: relative; }
	#header .header-in .login-ci:before {top: 32px; left: 30px;}

	#main .search-box dl dt {font-size: 20px; width: 130px;}
	#main .search-box dl dd {font-size: 20px;}

	#main .con-box dl dt,
	#main .con-box dl dd {font-size: 20px;}

	#main .flex {font-size: 20px; }
	#main .flex .prev { background: url(/images/ic_arrow_04.png) no-repeat; width: 10px; height: auto; margin-top: 0; margin-right: 30px; padding-right: 0;}
	#main .flex .next { background: url(/images/ic_arrow_03.png) no-repeat -3px 0; width: 10px;height: auto; margin-top: 0; margin-left: 30px;}

	#main ul.ds-list-th {display: none;}
	#main ul.ds-list-td {border-top: 1px solid #545454;}
	#main ul.ds-list-td li {position: relative;  height: 125px; margin-top: 23px; }
	#main ul.ds-list-td li:before {content: ''; background: #777; width: 8px; height: 147px; display: inline-block; position: absolute; left: -30px; top: -23px;}
	#main ul.ds-list-td li.reject {position: relative;}
	#main ul.ds-list-td li.reject:before {content: ''; background: #2c72f8; width: 8px; height: 147px; display: inline-block; position: absolute; left: -30px; top: -23px;}
	#main ul.ds-list-td li span {font-size: 20px; line-height: 25px;}
	#main ul.ds-list-td li ul.inner {display: table; table-layout: fixed; overflow: hidden; width: 100%;padding: 0 8px 23px;}
	#main ul.ds-list-td li ul.inner li { display: block; padding: 0; border: 0; margin: 0; text-align: left; height: initial;}
	#main ul.ds-list-td li ul.inner li:before {background: none;}
	#main ul.ds-list-td li ul.inner li:first-child span {font-weight: 700;}
	/*#main ul.ds-list-td li ul.inner li:nth-child(4) { position: absolute; right: 100px; top: 15px;}*/
	#main ul.ds-list-td li ul.inner li:last-child { position: absolute; right: 0; top: 27px; text-align: right;}
	#main ul.ds-list-td li ul.inner li .d-badge {border:0; background: transparent; font-size: 20px; line-height: 25px; padding: 0; margin-left: 0; text-align: left;}
	#main h3 {display: none;}
	#main .dfbox h4 {font-size: 20px;}

    #main ul.place li {flex: 0 1 100%;}
    #main ul.place li a {font-size: 20px;}

	#main .form-control {height: 50px; font-size: 20px;}
	#main .form-group .form-gr {flex: 0 1 49% !important;}
	#main .form-group .form-gr input {font-size: 20px;}
	#main .form-group .form-gr .form-control input::placeholder {color: #bbb; font-size: 20px;}
	#main .dn {display: none !important;}
	#main .form-group .form-gr .input-group-addon button {background: url(/images/ico_cal_01.png) no-repeat 0 0; width: 32px; height: 32px;right: 28px; top: 8px; outline: 0;}

	#main button.btn-cm {height: 50px; padding: 0 20px;}
	#main .contact {font-size: 20px; }
	#main .contact input::placeholder {color: #bbb; font-size: 20px;}
	#main .contact .inner {flex: 1 1 0; position: relative; line-height: 49px;}
	#main .contact .ti {width: 140px;}
	#main .contact .m-id {width: 40%;}
	#main .contact .d-mail  {width: 41%;}
	/*#main .contact div:last-child {display: none;}*/
	#main .m-pl60 {padding-left: 60px !important;}

	#main .checkbox-inline span.label { color: #333; font-weight: 400; font-size: 20px;}

	#main .line {border-top:0; margin-top: 0;}
	#main .btnbox .rta.d-btn {text-align: center;}
	#main .btnbox .rta.d-btn button {width: 49%; position: relative; }
	#main .btnbox .rta.d-btn button:first-child {float: left;}
	#main .btnbox .rta.d-btn button:last-child {margin-right: 0 !important;}
	#main .btnbox .rta {float: none;}
	#main .btnbox.line .rta button {height: 70px;line-height: 67px;  font-size: 20px; font-weight: 400; }
	#main .btnbox.line .rta button span.ic-input,
	#main .btnbox.line .rta button span.ic-list,
	#main .btnbox.line .rta button span.ic-home,
	#main .btnbox.line .rta button span.ic-reject,
	#main .btnbox.line .rta button span.ic-ok {display: inline-block; }
	#main .btnbox.line .rta button span.ic-input:before {content:''; display:inline-block; background: url(/images/ic_input.png) no-repeat 0 0; width: 30px; height: 30px; padding-left: 40px;position: relative; top: 6px;}
	#main .btnbox.line .rta button span.ic-ok:before {content:''; display:inline-block; background: url(/images/ic_ok.png) no-repeat 0 0; width: 30px; height: 30px; padding-left: 40px;position: relative; top: 6px;}
	#main .btnbox.line .rta button span.ic-list:before {content:''; display:inline-block; background: url(/images/ic_list.png) no-repeat 0 0; width: 30px; height: 30px; padding-left: 40px;position: relative; top: 6px;}
	#main .btnbox.line .rta button span.ic-home:before {content:''; display:inline-block; background: url(/images/ic_home.png) no-repeat 0 0; width: 30px; height: 30px; padding-left: 40px;position: relative; top: 6px;}
	#main .btnbox.line .rta button span.ic-reject:before {content:''; display:inline-block; background: url(/images/ic_reject.png) no-repeat 0 0; width: 30px; height: 30px; padding-left: 40px;position: relative; top: 6px;}
	#main .modal-content .modal-header button.close {width: 100%; background-position-x: 445px;}

	#main .btnbox.line .rta button.m-btn {width: 100%;position: relative;}
	#main .btnbox.dn {float: none;}
	#main .form-group-basic {display: none;}
	#main .dataTables_paginate {display: none;}
	#main .modal-footer .btn-group button {}

	#main .modal-content > * {font-size: 20px;}
	#main .modal-content .modal-footer .btn-group button {font-size: 20px; min-width: 80px; height: 40px; line-height: 26px; width: inherit;}

	#main .login-cont .login-btn ul { display: flex; margin-top: 15px; margin-bottom: 20px; flex-wrap: wrap; align-items: flex-start; gap: 15px;}
	#main .login-cont .login-btn ul li {flex: 0 1 100%;}
	#main .login-cont .login-btn ul li button {padding-left: 50px;}
	#main .login-cont .login-btn ul li button.bt-01,
	#main .login-cont .login-btn ul li button.bt-02 {background-position: 160px 34px;}

	#main .terms ul.terms-ul li.terms-ti select {width: 100%;}
	#main select.form-control { background:url('/images/ic_sel.png') no-repeat 97% 50%/10px auto;}

	#main .login-cont .member .inner {width: 600px;}
	#main .login-cont .member .inner ul li {height: auto;}
	#main .login-cont .member .inner ul li.bg { display: none; /*height: 130px; width: 600px; border-radius: 28px 28px 0 0; background-position: 65px 0;*/ }
	#main .login-cont .member .inner ul li.cont {width: 600px; border-radius: 28px; padding: 40px 0 60px 0;}
	#main .login-cont .member .inner ul li.cont .cont-in h3 {display: block;}
	#main .login-cont .member .inner ul li.cont .cont-in { margin: 0 40px;}

	.guardrail { width: 100%; }

	figure .bg-box { padding: 24px;}

	.sidebar-wrap {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 2000;
	display: block;
}

.sidebar-wrap .sidebar-dim {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: #000;
	opacity: 0.78;
	pointer-events: none;
	z-index: 2000;
	transition: all 0.3s;
}

#sidebar {
	width: 280px;
	height: 100%;
	background: #246fd9;
	font-family: 'Nanum Gothic','NotoSansKR','Malgun Gothic',sans-serif;
	position: fixed;
	top: 0;
	left: 0;
	padding-top: 130px;
	padding-bottom: 120px;
	pointer-events: all;
	z-index: 2001;
	transition: all 0.3s;
	transform: translateX(0) translateZ(0);
}

#sidebar .bi {
	width: 100%;
	height: 100px;
	padding: 26px 16px 0;
	position: absolute;
	top: 0;
	left: 0;
	background: #2c72f8;
	border-bottom:1px solid #206bd5;
}

#sidebar .bi img {
	display: block;
	width: auto;
	height: 20px;
	margin-top: 15px;
    margin-left: 36px;
}

#sidebar .bi h1 {
	line-height: 110%;
	font-size: 26px;
	font-weight: 700;
	color: #fff;
	padding: 0;
	margin: 0;
	margin-top: 4px;
}

#sidebar nav {
	width: 100%;
	height: 100%;
	position: absolute;
	top:100px;
	overflow: auto;
	overflow-scrolling: touch;
	padding-bottom: 48px;
}

#sidebar nav dl {
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	list-style: none;
	padding: 0;
	margin: 0;
}

#sidebar nav dl dt {
	width: 100%;
	height: auto;
	min-height: 40px;
	overflow: hidden;
	position: relative;
	padding: 17px 38px 17px 25px;
	font-size: 0;
	line-height: 12px;
	color: #95bdf4;
	cursor: pointer;
}

#sidebar nav dl dt:before {
	content: '';
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: rgba(255,255,255,0.05);
}

#sidebar nav dl dt:active:before { display: block;}

#sidebar nav dl dt:after {
	content: "";
	/*font-family: 'Licon' !important;*/
	display: block;
	width: 9px;
	height: 5px;
	position: absolute;
	top: 50%;
	right: 16px;
	transform: translateY(-50%) translateZ(0);
	transition: all 0.3s;
	font-size: 16px;
	font-weight: 400;
	/*color: #B6BDC1;*/
	background: url("/images/ic_arrow_05.png") no-repeat;

}

#sidebar nav dl dt:only-child:after { display: none; }

#sidebar nav dl dt.on:after { transform: translateY(-50%) translateZ(0) rotate(180deg); }
#sidebar nav dl dt.on + dd { display: block; }

#sidebar nav dl dt.act { color: #95bdf4; font-weight: 700; }
#sidebar nav dl dt.act:after { color: #6598e1; font-weight: 400; }
#sidebar nav dl dt.act + dd { background-color: #1d5cb6; }

#sidebar nav dl dt .label-txt {
	font-size: 20px;
	font-weight: 400;
	line-height: inherit;
}

#sidebar nav dl dd {
	display: none;
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	margin: 0;
	padding: 0;

}

#sidebar nav dl dd a {
	display: block;
	width: 100%;
	height: auto;
	min-height: 40px;
	overflow: hidden;
	position: relative;
	padding: 15px 16px 15px 50px;
	font-size: 0;
	line-height: 16px;
	color: #95bdf4;
	cursor: pointer;
	text-decoration: none;
}

#sidebar nav dl dt p,
#sidebar nav dl dd p {margin: 0;}

#sidebar nav dl dd a.act { color: #F8F8F8; font-weight: 700;}
#sidebar nav dl dd a.act:after { opacity: 1; border-left: 8px solid #E54E2B; }

#sidebar nav dl dd a:before {
	content: '';
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: rgba(255,255,255,0.05);
}

#sidebar nav dl dd a:active:before { display: block;}

/*#sidebar nav dl dd a:after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 8px solid #F8F8F8;
	position: absolute;
	top: 16px;
	left: 20px;
	opacity: 0.1;
}*/

#sidebar nav dl dd a .label-txt {
	font-size: 16px;
	font-weight: inherit;
	line-height: inherit;
}

#sidebar .inquiry {
	border-top: 1px solid rgba(255,255,255,0.1);

}

#sidebar .inquiry a.btn-inquiry-mail {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-decoration: none;
	color: #B6BDC1;
	font-size: 0;
	padding: 0 16px;
}

#sidebar .inquiry a.btn-inquiry-mail:hover { background: rgba(255,255,255,0.05); }

#sidebar .inquiry a.btn-inquiry-mail i { vertical-align: middle; color: inherit; }
#sidebar .inquiry a.btn-inquiry-mail span {
	display: inline-block;
	font-size: 13px;
	font-weight: 400;
	vertical-align: middle;
	color: inherit;
	margin-left: 4px;
}

#sidebar .inquiry .copyright {
	padding: 20px 16px 0;
	border-top: 1px solid rgba(255,255,255,0.1);
	font-size: 0;
}

#sidebar .inquiry .copyright img {
	display: block;
	width: auto;
	height: 16px;
	opacity: 0.3;
}

#sidebar .inquiry .copyright p {
	color: #fff;
	opacity: 0.3;
	font-size: 11px;
	line-height: 20px;
}



}

@media screen and (min-width: 421px) and (max-width: 880px) {
	#main .cont-area.site-cover { width: 100%; padding: 60px 40px 60px; }
	#main .cont-area.site-cover .title-section .title-img { width: 100%; }
	#main .cont-area.site-cover .shortcut-section .btn-document-download { position: relative; right: auto; bottom: auto;}
	#main .login-cont .member {overflow-x: hidden;}
	#main .login-cont .member .inner { width: 100%; height: auto; margin: 0 15px;}
	#main .login-cont .member .inner ul li.bg { display: none; /*height: 130px; width: calc(100% - 30px); border-radius: 28px 28px 0 0; background-position: 65px 0;*/}
	#main .login-cont .member .inner ul li.bg .bg-in h2,
	#main .login-cont .member .inner ul li.bg .bg-in h3,
	#main .login-cont .member .inner ul li.cont .cont-in h3 {display: none;}
	#main .login-cont .member .inner ul li.cont {width:calc(100% - 30px); border-radius: 28px; margin: 0; padding: 40px 0 60px 0;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li { height: 70px; width: 100%; margin-bottom: 15px;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button {width: 100%;height: 100%;border: 1px solid #e5e5e5;background: #fff;border-radius: 8px;text-align: left;padding: 15px 30px;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:active {background: #e9f3fd url("/images/ic_loginarrwo.png") no-repeat 270px center; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:hover {background: transparent; border: 1px solid #e5e5e5; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.indi:before,
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.stake:before { content: ''; top: 22px; background-size: 80%;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button em {display: none;}
	#main .login-cont .member .inner ul li.cont .cont-in { position: relative; margin: 0 20px;}
	.guide-col-list.menu-tile > li {
		width: 100% !important;
		float: left;
		margin: 0 !important;
		margin-top: 8px !important;
	}
	.menu-tile li a { height: 140px;}
}


@media screen and (min-width: 881px) and (max-width: 1200px) {
	#main .cont-area.site-cover { width: 100%; padding: 112px 100px 60px; }
	#main .login-cont .member {overflow-x: hidden;}
	#main .login-cont .member .inner { width: 100%; height: auto; margin: 0 15px;}
	#main .login-cont .member .inner ul li.bg { display: none; /*height: 130px; width: calc(100% - 30px); border-radius: 28px 28px 0 0; background-position: 65px 0;*/}
	#main .login-cont .member .inner ul li.bg .bg-in h2,
	#main .login-cont .member .inner ul li.bg .bg-in h3,
	#main .login-cont .member .inner ul li.cont .cont-in h3 { display: none;}
	#main .login-cont .member .inner ul li.bg .bg-in h2,
	#main .login-cont .member .inner ul li.bg .bg-in h3,
	#main .login-cont .member .inner ul li.cont .cont-in h3 {display: none;}
	#main .login-cont .member .inner ul li.cont {width:calc(100% - 30px); border-radius: 28px; margin: 0; padding: 40px 0 60px 0;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button {width: 100%;height: 100%;border: 1px solid #e5e5e5;background: #fff;border-radius: 8px;text-align: left;padding: 15px 30px;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:active {background: #e9f3fd url("/images/ic_loginarrwo.png") no-repeat 270px center; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button:hover {background: transparent; border: 1px solid #e5e5e5; }
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.indi:before,
	#main .login-cont .member .inner ul li.cont .cont-in ul li button.stake:before { content: ''; top: 43px; background-size: 80%;}
	#main .login-cont .member .inner ul li.cont .cont-in ul li button em {display: none;}
	#main .login-cont .member .inner ul li.cont .cont-in { position: relative; margin: 0 20px;}
}






/*예제ui*/
/* list init -------------------------------------------------------------------------------------------- */
.demo-box ul  {
  margin: 0;
  padding: 0;
  font-size: 0;
}
.demo-box ul li { list-style: none; }
/*.demo-box p + * { margin: 0 !important; }*/

/* demo -webkit-box --------------------------------------------------------------------------------------------- */
.demo-box {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  margin-top: 24px;
}
.demo-box .demo-box-control {
  display: block;
  width: calc(100% - 200px);
  height: auto;
  transition: width ease-in-out .15s
}
.demo-box .demo-box-control > ul > li {
  display: inline-block;
  width: 50%;
  height: auto;
}
.demo-box .demo-box-control > ul > li + li .input-box { border-left: 1px solid #DCDFE0;}

.demo-box .demo-box-contents {
  position: relative;
  display: block;
  width: 100%;
  height: 560px;
  overflow: hidden;
}
.demo-box .demo-box-contents .demo-box-preview {
  display: block;
  width: calc(100% - 200px);
  height: 100%;
  border: 1px solid #DCDFE0;
  padding: 12px;
  transition: width ease-in-out .15s;
}
.demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #f8f8f8;
}
.demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner .demo-box-preview-component {
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
}
.demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner .side-call {
  position: absolute;
  display: none;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  cursor: pointer;
  background-color: transparent;
  transition: all ease-in-out .15s;
  z-index: 10;
}

.demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner .side-call:hover { background-color: rgba(0, 0, 0, .04); }
.demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner .side-call i {
  font-size: 20px;
  vertical-align: middle;
}
.demo-box .demo-box-contents .demo-box-preview.on-dark .demo-box-preview-inner .side-call i { color: #f8f8f8; }
.demo-box .demo-box-contents .demo-box-preview-control {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 200px;
  height: 100%;
  border: 1px solid #DCDFE0;
  border-left: 0;
  overflow-y: auto;
  transition: all ease-in-out .15s;
  z-index: 100;
  background-color: #ffffff;
}
.demo-box .demo-box-contents .demo-box-preview-control.on {
  transform: translateX(0);
  /*border-left: 1px solid #DCDFE0;*/
}
.demo-box .demo-box-contents .demo-box-preview-control .close {
  display: none;
  width: 40px;
  height: 40px;
  background-color: transparent;
}
.demo-box .demo-box-contents .demo-box-preview-control .close:hover { background-color: rgba(0, 0, 0, .04); }
.demo-box .demo-box-contents .demo-box-preview-control .close i {
  font-size: 20px;
  vertical-align: middle;
}
.demo-box .demo-box-contents .demo-box-preview-control .title {
  padding: 8px 16px;
  font-size: 13px;
  background-color: #f8f8f8;
}
.demo-box .demo-box-contents .demo-box-preview-control > ul > li { padding: 16px; }
.demo-box .demo-box-contents .demo-box-preview-control > ul > li + li { border-top: 1px solid #DCDFE0; }
.demo-box .demo-box-contents .demo-box-preview-control > ul > li .vari-title { font-size: 13px; }
.demo-box .demo-box-contents .demo-box-preview-control > ul > li ul li + li { margin-top: 8px;}

.demo-box .demo-box-code {
  display: block;
  width: 100%;
  height: auto;
}
.demo-box .demo-box-code .tools {
  display: block;
  width: 100%;
  height: auto;
  background-color: #000000;
  text-align: right;
}
.demo-box .demo-box-code .tools .tools-item {
  width: 40px;
  height: 40px;
  background-color: transparent;
  color: #f8f8f8;
  cursor: pointer;
  transition: all ease-in-out .15s
}
.demo-box .demo-box-code .tools .tools-item:hover {
  background-color: rgba(255, 255, 255, .16);
}
.demo-box .demo-box-code .tools .tools-item i {
  vertical-align: middle;
  font-size: 20px;
}
.demo-box .demo-box-code .CodeMirror { height: auto; }

/* checker item ----------------------------------------------------------------------------------------- */
.demo-box .checker-item {
  display: inline-block;
  width: auto;
  height: auto;
  font-size: 0;
  overflow: hidden;
  position: relative;
  padding-left: 28px;
  vertical-align: top;
  cursor: pointer;
  color: #101314;
}
.demo-box .checker-item input {
  width: 0;
  height: 0;
  position: absolute;
  top: -100px;
  pointer-events: none;
}
.demo-box .checker-item .label-group {
  display: inline-block;
}
.demo-box .checker-item input:disabled + .label-group {
  color: #cacaca;
}
.demo-box .checker-item .icon {
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  text-align: center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.demo-box .checker-item .icon i {
  display: block;
  width: 20px;
  height: 20px;
  background-size: 20px;
}
.demo-box .checker-item input[type="checkbox"] ~ .label-group .icon i { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48cGF0aCBkPSJNMTkgNXYxNEg1VjVoMTRtMC0ySDVjLTEuMSAwLTIgLjktMiAydjE0YzAgMS4xLjkgMiAyIDJoMTRjMS4xIDAgMi0uOSAyLTJWNWMwLTEuMS0uOS0yLTItMnoiLz48L3N2Zz4='); }
.demo-box .checker-item input[type="checkbox"]:checked ~ .label-group .icon i { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48cGF0aCBkPSJNMTkgM0g1Yy0xLjExIDAtMiAuOS0yIDJ2MTRjMCAxLjEuODkgMiAyIDJoMTRjMS4xMSAwIDItLjkgMi0yVjVjMC0xLjEtLjg5LTItMi0yem0tOSAxNGwtNS01IDEuNDEtMS40MUwxMCAxNC4xN2w3LjU5LTcuNTlMMTkgOGwtOSA5eiIvPjwvc3ZnPg==') }
.demo-box .checker-item input[type="radio"] ~ .label-group .icon i { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAxOGMtNC40MiAwLTgtMy41OC04LThzMy41OC04IDgtOCA4IDMuNTggOCA4LTMuNTggOC04IDh6Ii8+PC9zdmc+'); }
.demo-box .checker-item input[type="radio"]:checked ~ .label-group .icon i { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48cGF0aCBkPSJNMTIgN2MtMi43NiAwLTUgMi4yNC01IDVzMi4yNCA1IDUgNSA1LTIuMjQgNS01LTIuMjQtNS01LTV6bTAtNUM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAxOGMtNC40MiAwLTgtMy41OC04LThzMy41OC04IDgtOCA4IDMuNTggOCA4LTMuNTggOC04IDh6Ii8+PC9zdmc+') }
.demo-box .checker-item .label {
  font-size: 14px;
  vertical-align: middle;
}

/* input container -------------------------------------------------------------------------------------- */
.demo-box .input-container {
  position: relative;
  display: block;
}
.demo-box .input-container > label {
  display: block;
  font-size: 13px;
  letter-spacing: -0.1px;
  margin-bottom: 8px;
}
.demo-box .input-container > .input-group {
  position: relative;
}
.demo-box .input-box {
  display: block;
  width: 100%;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 24px;
  color: #101314;
  background-color: #f8f8f8;
  text-align: left;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, background-color ease-in-out .15s;
}
.demo-box .input-box::-ms-clear { display: none; }
.demo-box .input-box::placeholder { color: #d8d8d8; }
.demo-box .input-box:hover { background-color: rgba(233, 233, 233, .5); }
.demo-box .input-box:focus { caret-color: #e54e2b; }

/* dropdown --------------------------------------------------------------------------------------------- */
.demo-box .dropdown:after {
  position: absolute;
  top: 0;
  right: 6px;
  font-size: 16px;
  content: '\e911';
  font-family: 'Licon';
  line-height: 16px;
  padding: 12px 4px;
  pointer-events: none;
}

.demo-box .dropdown.open > .dropdown-menu {
  display: block;
  z-index: 10000;
}
.demo-box .dropdown.open:before {
  position: fixed;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
}
.demo-box .dropdown.open:after { content: '\e967' }

.demo-box .dropdown > input:not(.input-box) {
  width: 0;
  height: 0;
  font-size: 0;
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
}
.demo-box .dropdown > .input-box {
  padding-right: 30px;
  vertical-align: middle;
}
.demo-box .dropdown > button.input-box:disabled {
  color: #cacaca;
  background-color: rgba(202, 202, 202, .3);
}
.demo-box .dropdown > .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  border: 1px solid #d8d8d8;
  background-color: #f8f8f8;
  border-radius: 2px;
  overflow: hidden;
  z-index: 200;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, .16);
}
.demo-box .dropdown .dropdown-menu .dropdown-menu-body {
  display: block;
  width: 100%;
  max-height: 186px;
  overflow-y: auto;
}
.demo-box .dropdown > .dropdown-menu > .dropdown-menu-body ul.dropdown-menu-options li {
  display: block;
  white-space: nowrap;
}

.demo-box .dropdown > .dropdown-menu > .dropdown-menu-body ul.dropdown-menu-options li .dropdown-menu-item {
  position: relative;
  display: block;
  width: 100%;
  text-align: left;
  padding: 12px 14px 12px 16px;
  background-color: #f8f8f8;
  text-decoration: none;
  font-size: 14px;
  color: #4c4c4c;
  line-height: 16px;
}
.demo-box .dropdown > .dropdown-menu > .dropdown-menu-body ul.dropdown-menu-options li + li .dropdown-menu-item { border-top: 1px solid #d8d8d8; }
.demo-box .dropdown > .dropdown-menu > .dropdown-menu-body ul.dropdown-menu-options li .dropdown-menu-item:hover { background-color: rgba(233, 233, 233, .5); }
.demo-box .dropdown > .dropdown-menu > .dropdown-menu-body ul.dropdown-menu-options li .dropdown-menu-item.selected { background-color: #E9E9E9; }

@media (max-width: 672px) {
  .demo-box .demo-box-contents .demo-box-preview .demo-box-preview-inner .side-call { display: block; }

  .demo-box .demo-box-control,
  .demo-box .demo-box-contents .demo-box-preview { width: 100%; }
  .demo-box .demo-box-contents .demo-box-preview-control {
	position: absolute;
	right: 0;
	bottom: 0;
	transform: translateX(100%);
	border-left: 1px solid #DCDFE0;
  }
  .demo-box .demo-box-contents .demo-box-preview-control .close { display: inline-block; }
}