@charset "utf-8";
@import url('fonts.css');

/* reset */
html,body{width:100%;height:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:none;background-color:#fff;*word-break:break-all;-ms-word-break:break-all;-webkit-font-smoothing:antialiased;}
html,body,div,span,iframe,h1,h2,h3,h4,h5,h6,p,a,address,em,img,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,button{ margin:0;padding:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;}
body,input,select,textarea,button,pre{font-family:'roboto', 'Noto Sans KR',Dotum,Verdana,Arial,AppleGothic,Sans-serif;font-size:14px;line-height:20px;color:#333;}

ol,ul{ list-style:none;}
img,fieldset,iframe,button{border:0 none}
img{vertical-align:middle;border:0 none}
label{ display:inline-block}
label,button{cursor:pointer}
button{ background:none;}
textarea{display:block;padding:5px 10px; resize:none} /* 사이즈고정 */
table{ width:100%;border-collapse:collapse;border-spacing:0;empty-cells:show;}
th{ text-align:inherit;}
input,select,button{ outline:none!important; vertical-align:middle;}
input[type="text"],input[type="password"],input[type="number"] { /* text-indent:5px */ padding:0 10px;}
input[type="password"],input[type="file"],input[type="text"],input[type="number"] { height:30px; vertical-align:middle;}
select, select.form-control{ height:30px; font-size:inherit; padding:1px 7px; box-shadow:none!important; background:#fff;}
select,textarea,input { border:1px solid #cdcdcd;}
select:hover,select:focus,textarea:hover,textarea:focus,input:hover,input:focus{ border:1px solid var(--main-color);}
textarea[readonly],button[readonly],select[readonly],input[readonly],
textarea[disabled],button[disabled],select[disabled],input[disabled]{ background-color:#f0f0f0;}
textarea[disabled],button[disabled],select[disabled],input[disabled]{ cursor:not-allowed !important;}
input:disabled:hover{ border:1px solid #bcbcbc;}

a{ color:var(--main-color)}
a:link, a:visited{ text-decoration:underline;}
a:active, a:hover, a:focus{ color:var(--main-color);}
a.btn:link, a.btn:visited{ text-decoration:none;}
*:focus,*:hover{outline:none!important;}

::-moz-selection{background:#f07726;color:#fff;text-shadow:none}
::selection{background:#f07726;color:#fff;text-shadow:none}
/* 사파리용스타일 */
input, select{ -webkit-border-radius: 0;}

:root{
	--main-color: #119e96;
	--sub-color: #016258;
	--sub2-color: #ffbd3c;
	--admin-color: #4f119e;
	--admin-txt-color: #ff3100;
}

/* Common */
caption{text-indent:-5000em;font-size:0;line-height:0}
legend{position:absolute;left:-5000em;font-size:0;height:0;}
.blind,hr{position:absolute;left:-5000em;top:-5000em;font-size:1px;text-indent:-5000em;line-height:1px}
.hidden{display:none}

.cb{ clear:both}
.fl{ float:left}
.fr{ float:right !important}
.dinblock{ display: inline-block;}
.dblock{display: block;}

.tl{ text-align:left !important}
.tr{ text-align:right}
.tc{ text-align:center !important;}

.m0{ margin:0;}
.ml5{ margin-left:5px;}
.ml10{ margin-left:10px;}
.ml20{ margin-left:20px;}

.mt0{ margin-top:0 !important;}
.mt10{ margin-top:10px !important;}
.mt20{ margin-top:20px !important;}
.mt30{ margin-top:30px !important;}

.w-4xs{ width:30px !important;}
.w-3xs{ width:50px !important;}
.w-2xs{ width:70px !important;}
.w-xs{ width:100px !important;}
.w-sm{ width:130px !important;}
.w-md{ width:150px !important;}
.w-lg{ width:200px !important;}
.w-2lg{ width:300px !important;}
.w-3lg{ width:400px !important;}
.w-4lg{ width:500px !important;}
.w-width{ width:100% !important;}

.txtover{ display:inline-block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}

.fz13{ font-size:13px;}
.fz14{ font-size:14px;}
.clr-666{ color:#666;}
.clr-999{ color:#999;}
.clr-primary,
.clr-blue{ color:var(--main-color);}
.clr-orange{ color:#ff7700;}

.btn_xls:before{ display:inline-block; clear:both; content:''; width:14px; height:14px; margin-right:5px; background-position:-30px -40px; vertical-align:middle;}

select + input,
select + select,
select + .datepicker_area,
.datepicker_area + .btn-group{ margin-left:7px;}

/* Bootstrap */
.label{ letter-spacing:0;}
.label-lightdark{background:#999;}
.modal-lg{ width:900px;}

/* Bootstrap-Button */
.btn-xs{ max-height:30px; padding:4px 15px; font-size:13px;}
.btn-sm{ padding:9px 20px 8px; font-size:14px;}
.btn-lg{ height:60px; padding:18px 20px; font-size:18px; font-weight:400;}
.btn-primary{ background:var(--main-color); border-color:var(--main-color);}
.btn-primary:hover, .btn-primary:active, .btn-primary:visited, .btn-primary:link, .btn-primary:focus{ background-color:#0f8e87 !important; border-color:#0f8e87 !important;}
.btn-admin{ background:var(--admin-color); border-color:var(--admin-color); color:#fff;}
.btn-admin:hover, .btn-admin:active, .btn-admin:visited, .btn-admin:link, .btn-admin:focus{ background-color:#330980 !important; border-color:#330980 !important; color:#fff;}
.btn-outline-primary{ background:#fff; border-color:var(--main-color); color:var(--main-color);}
.btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary:link, .btn-outline-primary:focus, .btn-outline-primary.active{ background-color:var(--main-color) !important; border-color:var(--main-color) !important; color:#fff;}
.btn-blue{ background:#115f9e; border-color:#115f9e;}
.btn-blue:hover, .btn-blue:active, .btn-blue:visited, .btn-blue:link, .btn-blue:focus{ background-color:#0e5392 !important; border-color:#0e5392 !important;}
.btn-dark{ border-color:#666 !important;}


/* checkbox, radio style */
.frm-chk,
.frm-rdo{ position:relative; padding-left:8px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; height:20px;}
.frm-chk input,
.frm-rdo input{ opacity:0; cursor:pointer;}
.frm-chk .frmark,
.frm-rdo .frmark{ position:absolute; top:50%; left:0; margin-top:-9px; width:18px; height:18px; background-color:#fff; border-radius:50%; border:1px solid #bcbcbc;}
.frm-chk .frmark:after,
.frm-rdo .frmark:after{ content:""; position:absolute; display:none;}
.frm-chk input:hover ~ .frmark,
.frm-rdo input:hover ~ .frmark{ border-color:#666}
.frm-chk input:checked ~ .frmark:after,
.frm-rdo input:checked ~ .frmark:after{ display:block;}
.frm-chk input:disabled ~ .frmark,
.frm-rdo input:disabled ~ .frmark{ border:1px solid #bcbcbc; opacity:.5; cursor:not-allowed;}

* + .frm-chk,
* + .frm-rdo,
.frm-chk + .frm-chk,
.frm-rdo + .frm-rdo{ margin-left:20px !important;}
.frm-chk .tooltip-inner,
.frm-rdo .tooltip-inner{ width:max-content;}

/* checkbox, radio style */
.frm-chk .frmark {border-radius:2px;}
.frm-chk input:checked ~ .frmark { background:var(--main-color); border-color:var(--main-color);}
.frm-chk-admin input:checked ~ .frmark { background:var(--admin-color); border-color:var(--admin-color);}
.frm-chk .frmark:after { left:4px; top:4px; width:8px; height:5px; border:solid #fff; border-width:0 0 2px 2px; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}

.frm-rdo .frmark { border-radius:50%;}
.frm-rdo input:checked ~ .frmark { border-color:#bcbcbc;}
.frm-rdo .frmark:after { top:4px; left:4px; width:8px; height:8px; border-radius:50%; background:var(--main-color);}
.frm-rdo-admin .frmark:after { background:var(--admin-color);}

/* frm-switch */
.frm-switch input{ display: none; visibility: hidden; }
.frm-switch .frmark { display: inline-block; border-radius: 100px; width: 24px; height: 10px; border:1px solid #d7d7d7; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; }
.frm-switch .frmark:before { content: ""; display: block; width: 14px; height: 14px; background:#fff; border:1px solid #d7d7d7; border-radius: 50%; position: absolute; top: -3px; left: -1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.frm-switch .label {cursor: pointer; vertical-align: middle; margin: 0 5px; color:initial;}
.frm-switch input:checked + .frmark {background-color: var(--main-color); border-color:var(--main-color);}
.frm-switch input:checked + .frmark:before {left:initial; right:-1px; background-color: #fff; border-color:var(--main-color); }
.frm-switch input:disabled ~ .frmark{ cursor:not-allowed; opacity:.5;}

/* Bootstrap-Paginate */
.pagination{ height:40px; margin:0 auto;}
.pagination > li{ display:inline-block; margin:0 2px;}

.pagination .btn_page { padding:10px;}
.pagination .btn_page span{ display:block; width:20px; height:20px; background-position:-50px -170px; font-size:0; }
.pagination .first_page span{ background-position:-10px -170px;}
.pagination .next_page span{ background-position:-90px -170px;}
.pagination .last_page span{ background-position:-130px -170px;}
.pagination li.disabled span{ opacity:.5;}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus{ background-color:var(--main-color); border-color:var(--main-color);}
.pagination > li > a{ color:#666}
.pagination > li > a:hover{ color:#016258;}
.pagination-sm > li > a, 
.pagination-sm > li > span{ width:40px; height:40px; text-align:center; line-height:30px; font-size:14px;}
.pagination-xs{ height:25px;}
.pagination-xs > li > a, .pagination-xs > li > span{ width:25px; height:25px; padding:4px 0; font-size:13px; text-align:center;}
.pagination-xs .btn_page{ padding:3px;}


/* 안내 */
.group_dsc{ margin-top:30px; padding-top:10px; border-top:1px dashed #ccc;}
.dsc,
.dsc-info,
.dsc-info-danger{ font-size:14px !important; margin-top:10px; color:#666; padding-left:15px; text-indent:-7px; line-height:16px; vertical-align:middle;}
.dsc{ padding-left:5px;}
.dsc-info:before{ display:inline-block; clear:both; content:'\f06a'; width:7px; font-size:11px; font-family:'Font Awesome 5 Free'; font-weight:900;}
.dsc-info-danger:before{ display:inline-block; clear:both; content:'\f06a'; width:7px; font-size:11px; font-family:'Font Awesome 5 Free'; font-weight:900;}
.dsc-info-danger{color:#fa2828;}
.dsc-info+.dsc-info{ margin-top:5px;}

/* 파일첨부 */
.file_area{ display:inline-flex; vertical-align:middle;}
.file_area input[type="text"]{ flex:1; margin-right:5px; font-size:13px;}
.file_area .num{ vertical-align:1px;}
.file_area *{ vertical-align:middle;}

/* datetimepicker - 테이블 내 캘린더 이용시 border 문제로 테이블아래 위치해야함 */
.datepicker_area{ display:inline-block; position:relative; vertical-align:middle;}
.datepicker_day{ width:110px; background:url('../images/sp_ico.svg') no-repeat 75px -126px; padding-right:20px; line-height:24px; letter-spacing:0;}
.datepicker_month{ width:80px; background:url('../images/sp_ico.svg') no-repeat 75px -126px; padding-right:20px; line-height:24px;}
.bootstrap-datetimepicker-widget{ border-radius:0; box-shadow:3px 3px 0 0 rgba(0,0,0,.2); width:440px !important;}
.bootstrap-datetimepicker-widget .list-unstyled{ margin:20px;}
.bootstrap-datetimepicker-widget table th,
.bootstrap-datetimepicker-widget table td{ height:initial; border:none !important; background:#fff; text-align:center!important; font-size:16px; font-family:'malgun gothic';}
.bootstrap-datetimepicker-widget table td span{ display:block; float:left; width:31.8%; height:64px; line-height:64px; border-radius:0;}
.bootstrap-datetimepicker-widget .datepicker-decades .decade{line-height:64px !important;}
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active{ background-color:var(--main-color)!important; border-radius:0;}
.bootstrap-datetimepicker-widget table td.day{ width:35px; height:35px; line-height:35px;}
.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover{ background-color:#eee; border-radius:0;}
.bootstrap-datetimepicker-widget table td.today:before{ border-bottom-color:var(--main-color);}
.bootstrap-datetimepicker-widget table tr th:first-child.day,
.bootstrap-datetimepicker-widget table tr td:first-child.day,
.bootstrap-datetimepicker-widget table tr th:first-child.dow{ color:#d76b00;}
.bootstrap-datetimepicker-widget table tr th:last-child.day,
.bootstrap-datetimepicker-widget table tr td:last-child.day,
.bootstrap-datetimepicker-widget table tr th:last-child.dow{ color:#164ebe;}
.bootstrap-datetimepicker-widget table tr td:first-child.old,
.bootstrap-datetimepicker-widget table tr td:first-child.new,
.bootstrap-datetimepicker-widget table tr td:last-child.old,
.bootstrap-datetimepicker-widget table tr td:last-child.new{color:#777}
.bootstrap-datetimepicker-widget table tr td.active{ color:#fff!important;}
.bootstrap-datetimepicker-widget table tr td.disabled{ color:#777!important;}
.bootstrap-datetimepicker-widget table thead th{ font-weight:bold!important;}
.bootstrap-datetimepicker-widget table thead tr:nth-of-type(2) th{ background:none; border-radius:0;}
.bootstrap-datetimepicker-widget table thead tr:nth-of-type(2) th:first-child{ border-radius:4px 0 0 4px;}
.bootstrap-datetimepicker-widget table thead tr:nth-of-type(2) th:last-child{ border-radius:0 4px 4px 0;}
.bootstrap-datetimepicker-widget table thead tr:first-child th{ height:45px; padding:0; background:none;  border-radius:0; font-weight:800!important; font-size:16px; vertical-align:middle;}
.bootstrap-datetimepicker-widget table thead tr:first-child th.prev span,
.bootstrap-datetimepicker-widget table thead tr:first-child th.next span{ font-size:16px;}
.bootstrap-datetimepicker-widget table thead .prev,
.bootstrap-datetimepicker-widget table thead .next{ width:20%;}
.bootstrap-datetimepicker-widget table.table-condensed{ background:#fff;}
.bootstrap-datetimepicker-widget table.table-condensed tr{ vertical-align:0;}
.bootstrap-datetimepicker-widget table.table-condensed a{ color:#333;}
.bootstrap-datetimepicker-widget .picker-switch td span{ height:45px; margin:0; line-height:45px; border:1px solid #ddd; color:#666;}
.bootstrap-datetimepicker-widget .picker-switch .fa-calendar-day:before{ content:'오늘'; font-weight:800;}
.bootstrap-datetimepicker-widget .picker-switch td:first-child{ padding-right:5px;}
.bootstrap-datetimepicker-widget .btn{ box-shadow:none;}
.bootstrap-datetimepicker-widget .btn:hover{ color:var(--main-color);}
.bootstrap-datetimepicker-widget .picker-switch{ margin-top:5px;}

/* cl-switch */
.cl-switch input[type="checkbox"] { display: none; visibility: hidden; }
.cl-switch .switcher { display: inline-block; border-radius: 100px; width: 28px; height: 10px; background-color: #ccc; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; }
.cl-switch .switcher:before { content: ""; display: block; width: 16px; height: 16px; background-color: #fff; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .4); border-radius: 50%; position: absolute; top: -3px; left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.cl-switch .label {cursor: pointer; vertical-align: middle; margin: 0 5px; color:initial;}
.cl-switch input[type="checkbox"]:checked + .switcher {background-color: var(--main-color); }
.cl-switch input[type="checkbox"]:checked + .switcher:before {/*left: 100%; margin-left: -20px;*/ left:initial; right:0; background-color: #fff; border:1px solid var(--main-color)}
.cl-switch input[type="checkbox"]:checked:disabled + .switcher {background: #fbd8c7 !important;}
.cl-switch input[type="checkbox"]:checked:disabled + .switcher:before {background-color: #f8b290 !important; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !important; }
.cl-switch input[type="checkbox"]:disabled + .switcher {background: #ccc !important;}
.cl-switch input[type="checkbox"]:disabled + .switcher:before {background-color: #e2e2e2 !important; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !important; }
.cl-switch [disabled]:not([disabled="false"]) + .switcher:active:before {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !important; }

/* 모달창 */
.modal{ min-width:640px;}
.modal-content{ padding:10px 25px; border-radius:0;}
.modal-header{ padding:15px 0; border-bottom:2px solid #999;}
.modal-header .close{ padding:10px; margin:-8px -10px -10px; opacity:1;}
.modal-header .close span{ display:block; width:20px; height:20px; background-position:-130px -130px; transform:scale(1.5)}
.modal-title{ font-size:24px; font-weight:500;}
.modal-body{ padding:20px 0;}
.modal-footer{ padding:15px 0;}
.modal-footer .btn + .btn,
.modal-footer .btn-group + .btn{ margin-left:2px;}
.modal .pagination > li{ margin:0;}
.modal-header--sticky{ position:sticky; top:0; margin:0 -15px; padding:15px; background-color:#333; border-radius:0 0 5px 5px; z-index:1055;}
#md_memo { padding-left: 0 !important;}
#md_memo .modal-body{ margin:0 -55px;}

.input_error,
.input_error:hover,
.input_error:focus{ border-color:#fa2828;}