.layer {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: 100%;
	background-color: #000;

	opacity: 0;
	z-index: -1;
	-webkit-transition: all .5s ease-in-out;
			transition: all .5s ease-in-out;
}

.layer.active {
	z-index: 20;
	opacity: 0.5;
}

.popup {
	position: absolute;
	top: 23px;
	left: 50%;
	z-index: 100;

	width: 280px;
	margin-left: -140px;
	/*margin-bottom: 40px;*/
	border-radius: 3px;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, .7);
	opacity: 0;

	-webkit-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);

	-webkit-transform: translateY(-200%);
			transform: translateY(-200%);

}

.popup.active {
	opacity: 1;
	-webkit-transform: translateY(0);
			transform: translateY(0);
}


.popup .pop-head { background-color: #7a7065; height: 40px; line-height: 44px; text-align: center; color: #fff; font-size: 16px; border-radius: 3px 3px 0 0; }
.popup .pop-body { position: relative; padding: 24px 16px; background-color: #fff; border-radius: 0 0 3px 3px; }
.popup .pop-body.p10 { padding: 14px 16px; }
.popup .pop-body.brn { border-radius: 0; }
.popup .pop-body .till-date:after { content: ""; clear: both; display: block; }
.popup .pop-body .till-date > div { float: left; width: 45%; box-sizing: border-box; }
.popup .pop-body .till-date > div > input { width: 100%; }
.popup .pop-body .till-date > div.date-sel { width: 10%; line-height: 30px; text-align: center; }
.popup .pop-body .till-btn { margin-top: 10px; }
.popup .pop-body .till-btn > a { display: block; }
.popup .pop-body .till-search { margin-top: 10px; }
.popup .pop-body .till-search:after { content: ""; clear: both; display: block; }
.popup .pop-body .till-search .till-select { width: 40%; float: left; box-sizing: border-box; padding-right: 10px; }
.popup .pop-body .till-search .till-text { width: 60%; float: left; }
.popup .pop-close { background: url("/images/kbi/mobile/left_colse.png") no-repeat center center; position: absolute; top: 0; right: 0; width: 40px; height: 40px; background-size: 13px 13px; cursor: pointer; }
.popup .pop-close2 { text-align: center; padding: 10px 0; background-color: #f5f5f5; border-radius: 0 0 3px 3px; }

.popup .pop-body .calender-box { margin: 10px 0; height: 50vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.popup .pop-body .calender-box .calen-list { position: relative; padding: 0 0 7px 30px; }
.popup .pop-body .calender-box .calen-list:before { content: ""; position: absolute; top: 0; left: 0; width: 15px; height: 15px; background-color: #fff; z-index: 20; border-radius: 50%; }
.popup .pop-body .calender-box .calen-list:after { content: ""; position: absolute; top: 16px; left: 7px; bottom: 0; width: 1px; background-color: #e3e1e1; z-index: 10; }
.popup .pop-body .calender-box .calen-list.etc:before { background-color: #f17b6d; }
.popup .pop-body .calender-box .calen-list.work:before { background-color: #fcaf17; }
.popup .pop-body .calender-box .calen-list.busi:before { background-color: #a8bd43; }
.popup .pop-body .calender-box .calen-list.vacation:before { background-color: #73bcc3; }
.popup .pop-body .calender-box .calen-list .cal-title { font-size: 11px; line-height: 15px; font-weight: bold; }
.popup .pop-body .calender-box .calen-list .cal-title.col { color: #f57f1e; }
.popup .pop-body .calender-box .calen-list .cal-txt { font-size: 11px; line-height: 15px; color: #777; }

.popup .pop-body .till-select { margin-bottom: 10px; }
.popup .pop-body .till-select:after { content: ""; clear: both; display: block; }
.popup .pop-body .till-select > div { float: left; width: 50%; box-sizing: border-box; }
.popup .pop-body .till-select > div:first-child { padding-right: 2px; }
.popup .pop-body .till-select > div:last-child { padding-left: 2px; }

.popup .pop-body .corres { position: relative; padding-right: 64px; }
.popup .pop-body .corres .search { position: absolute; right: 0; top: 0; }
.popup .pop-body .corres-table { width: 100%; }
.popup .pop-body .corres-table > thead > tr > th { background-color: #f5f5f5; border-left: 1px solid #e0e2e4; border-top: 1px solid #e0e2e4; border-bottom: 1px solid #e0e2e4; text-align: center; padding: 10px 0; }
.popup .pop-body .corres-table > thead > tr > th:first-child { border-left: 0; }
.popup .pop-body .corres-table > tbody > tr > td { border-left: 1px solid #dbdde0; border-bottom: 1px solid #dbdde0; padding: 10px 0; text-align: center; font-size: 12px; color: #444; }
.popup .pop-body .corres-table > tbody > tr > td:first-child { border-left: 0; }

#contents { overflow: hidden; }
#contents .sub-tit { height: 46px; line-height: 50px; font-size: 16px; color: #444; margin: 0; padding-left: 12px; }
#contents .sub-tit.fixed.mb { margin-bottom: 54px; }
#contents .sub-tit.fixed.mb2 { margin-bottom: 44px; }
#contents .sub-tit .btns { float: right; margin-right: 8px; }
#contents .sub-tit .btns .btn { margin-right: 4px; }
#contents .sub-tit.bg { padding-left: 12px; background: url("/images/kbi/mobile/sub_tit_bg.png") no-repeat 11px center; background-size: 14px 14px; padding-left: 30px; }
#contents .sub-tit p { display: inline; color: #999; font-size: 10px; margin-left: 10px; line-height: 46px; position: relative; top: -1px; }

#header .back-link {/* 20240911ldh 뒤로가기버튼 */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    font-size: 11px;
    color: #fff;
    text-decoration: none;
}

#header .back-link .arrow-left {
    display: inline-block;
    margin-right: 5px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(-45deg);
}

#wrap {
	padding-top: 46px;
}
#wrap.appro { padding-bottom: 60px; }
#wrap.fixed {
	position: fixed;
	width: 100%;
	left: 0;
}

.btn-more { display: block; line-height: 35px; text-align: center; position: relative; font-size: 15px; color: #444; background-color: #f5f5f5; }
.btn-more:after { content: ""; display: inline-block; position: relative; top: -3px; margin-left: 5px; width: 7px; height: 7px; -webkit-transform: rotate(45deg); transform: rotate(45deg); border-bottom: 2px solid #8b8b8b; border-right: 2px solid #8b8b8b; border-radius: 2px; }
.tb-box { height: 30px; background-color: #f5f5f5; padding: 10px 12px; border-top: 1px solid #e6e7e9; border-bottom: 1px solid #e6e7e9; }
.tb-box .wid { display: inline-block; margin: 0 4px; vertical-align: middle; position: relative; top: 3px; }

.form-checkbox[type="checkbox"] {
	width: 12px;
	height: 12px;
	-webkit-appearance: none;
			appearance: none;
	border: 0;
	position: relative;
	top: 1px;
	left: 0;
	border: 1px solid #d8d8d8;
	border-radius: 3px;
	cursor: pointer;
	background-color: #fff;
}
.form-radio[type="radio"] {
	width: 13px;
	height: 13px;
	border: 1px solid #d8d8d8;
	border-radius: #66c8cc;
	border-radius: 50%;
	-webkit-appearance: none;
			appearance: none;
	position: relative;
	vertical-align: middle;
	left: 0;
	top: -2px;
	background-size: 12px 24px;
	cursor: pointer;
}
.form-radio[type="radio"]:checked {
	border-color: #66c8cc;
	background-color: #fff;
}
.form-radio[type="radio"]:checked:before {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 5px;
	height: 5px;
	background-color: #66c8cc;
	border-radius: 50%;
}
.form-date[type=date]::-webkit-inner-spin-button,
.form-date[type=month]::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
.form-date[type=date]::-webkit-calendar-picker-indicator,
.form-date[type=month]::-webkit-calendar-picker-indicator {
	-webkit-appearance: none;
	display: none;
}
.form-label {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	cursor: pointer;
	z-index: 10;
}
.des { background-color: #f7f7f7; }

.input-style {
	display: inline-block;
	line-height: 30px;
	padding: 0 10px;
	font-size: 12px;
	color: #444;
	background-color: #fff;
	border: 1px solid #d8d8d8;
	border-radius: 3px;
	font-size: 12px;
}

.btn-box {
	text-align: center;
	padding: 12px 0 13px;
}
.btn-box.fot {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	border-top: 1px solid #e2e4e5;
	background-color: #f5f5f5;
}

.btn.fll-search {
	position: relative;
	text-align: center;
	background-color: #ff9600;
	color: #fff;
	padding: 0;
	border: 1px solid #e89300;
}
.btn.fll-search:before {
	content: "";
	position: relative;
	top: 2px;
	display: inline-block;
	margin-right: 3px;
	width: 13px;
	height: 13px;
	background: url("/images/kbi/mobile/search_bg.png") no-repeat 0 0;
	background-size: 13px 13px;
}

#footer { height: 24px; line-height: 26px; text-align: center; background-color: #e8e8e8; border-top: 1px solid #dddee1; font-size: 10px; color: #a6a6a6; }




@media ( max-width: 320px ){
	.media-table > tbody > tr > th:first-child { width: 20%; }
}
@media ( min-width: 320px ){
	.media-table > tbody > tr > th:first-child { width: 100px; }
}