@charset "utf-8";

/* ---------------------------------------
	Filename: common.css
	Description : 국토안전관리원
	Author	: mobigen
	date	: 2022-06
	비고 : 
   --------------------------------------- */

@font-face {
    font-family:"KHNPHU";
    src:url("../fonts/KHNPHURegular.eot");
    src:url("../fonts/KHNPHURegular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/KHNPHURegular.woff") format("woff"),
        url("../fonts/KHNPHURegular.ttf") format("truetype");
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:"KHNPHD";
    src:url("../fonts/KHNPHDRegular.eot");
    src:url("../fonts/KHNPHDRegular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/KHNPHDRegular.woff") format("woff"),
        url("../fonts/KHNPHDRegular.ttf") format("truetype");
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:"KHNPHD";
    src:url("../fonts/KHNPHDBold.eot");
    src:url("../fonts/KHNPHDBold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/KHNPHDBold.woff") format("woff"),
        url("../fonts/KHNPHDBold.ttf") format("truetype");
    font-weight:bold;
    font-style:normal;
}

@font-face {
    font-family:"roboto";
    src:url("../fonts/Roboto-Regular.eot");
    src:url("../fonts/Roboto-Regular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Roboto-Regular.woff") format("woff"),
        url("../fonts/Roboto-Regular.ttf") format("truetype");
    font-weight:400;
    font-style:normal;
}

@font-face {
    font-family:"roboto";
    src:url("../fonts/Roboto-Medium.eot");
    src:url("../fonts/Roboto-Medium.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Roboto-Medium.woff") format("woff"),
        url("../fonts/Roboto-Medium.ttf") format("truetype");
    font-weight:bold;
    font-style:normal;
}

@font-face {
    font-family:"roboto";
    src:url("../fonts/Roboto-Bold.eot");
    src:url("../fonts/Roboto-Bold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Roboto-Bold.woff") format("woff"),
        url("../fonts/Roboto-Bold.ttf") format("truetype");
    font-weight:700;
    font-style:normal;
}

/* reset */
/* 여백 초기화 */
body,div,ul,li,dl,dd,dt,ol,h1,h2,h3,h4,h5,h6,input,fieldset,legend,p,select,table,th,td,tr,textarea,button,form,figure,figcaption {margin:0; padding:0;}

/* a 링크 초기화 */
a {color:inherit; text-decoration:none; cursor:pointer;}
a:hover {color:#1e9cff;}

/* 폰트 스타일 초기화 */
em,address {font-style:normal;}

/* 블릿기호 초기화 */
ul,li,ol {list-style:none;}

/* 제목 태그 초기화 */
h1,h2,h3,h4,h5,h6 {line-height:1.2; font-size:14px; font-weight:normal;}

/* 버튼 초기화 */
button {border:0; cursor:pointer; font-size:inherit; font-family:inherit; line-height:inherit;}

/* align */
button, input, select, textarea, img {vertical-align:middle;}

/* 반응형 */
/* img {width:100%;} */

/* font */
sup {font-size:10px !important;}

/* 폼 */
form {margin:0; padding:0;}
fieldset {border:0;}
caption, legend, .blind {overflow:hidden; width:0; height:0; line-height:0; font-size:0; text-indent:-9999px;}
input, textarea, select, optgroup {font-size:inherit; font-family:inherit; line-height:inherit; color:inherit; box-sizing:border-box;}
table {border-collapse:collapse; border-spacing:0; table-layout:fixed; width:100%; max-width:100%; word-wrap:break-word; word-break:break-all;}
select {-webkit-appearance:none; -moz-appearance:none; appearance:none;}

/* focus */
input[type="text"]:focus, 
input[type="password"]:focus, 
textarea:focus, 
select:focus,
.mu-radio > input:focus + label,
.mu-checkbox > input:focus + label, 
button:focus {outline:1px dotted #666;}

/* HTML5 새 요소 초기화 */
header, section, footer, aside, nav, main, article, figure {display:block;}

/* clearfix */
.clearfix{*zoom:1;}
.clearfix::before, .clearfix::after {content:""; display:block;  line-height:0;}
.clearfix::after {clear:both;}

/* IR 효과 */
.ir_pm {display:block; overflow:hidden; font-size:0; line-height:0; text-indent:-9999px;} /* 의미있는 이미지의 대체 텍스트를 제공하는 경우(Phark Method) */
.ir_wa {display:block; overflow:hidden; position:relative; z-index:-1; width:100%; height:100%;} /* 의미있는 이미지의 대체 텍스트로 이미지가 없어도 대체 텍스트를 보여주고자 할 때(WA IR) */
.ir_su {overflow:hidden; position:absolute; width:0; height:0; line-height:0; text-indent:-9999px;} /* 대체 텍스트가 아닌 접근성을 위한 숨김 텍스트를 제공할 때 */

/* margin, padding */
.mt05 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt35 {margin-top:35px !important;}
.mt40 {margin-top:40px !important;}
.mt45 {margin-top:45px !important;}
.mt50 {margin-top:50px !important;}

.mb0 {margin-bottom:0px !important;}
.mb05 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}
.mb40 {margin-bottom:40px !important;}
.mb45 {margin-bottom:45px !important;}
.mb50 {margin-bottom:50px !important;}

/* width */
.w-auto {width:auto !important;}
.w30 {width:30px !important;} 
.w50 {width:50px !important;} 
.w60 {min-width:60px !important;} 
.w70 {width:70px !important;}
.w80 {width:80px !important;}
.w85 {width:85px !important;}
.w100 {width:100px !important;}
.w110 {width:110px !important;}
.w120 {width:120px !important;}
.w125 {width:125px !important;} 
.w130 {width:130px !important;} 
.w140 {width:140px !important;}
.w150 {width:150px !important;} 
.w160 {width:160px !important;}
.w170 {width:170px !important;}
.w190 {width:190px !important;}
.w192 {width:192px !important;}

.w200 {width:200px !important;}
.w220 {width:220px !important;}
.w240 {width:240px !important;}
.w250 {width:250px !important;}
.w295 {width:295px !important;}

.w300 {width:300px !important;}
.w310 {width:310px !important;} 
.w330 {width:330px !important;}
.w340 {width:340px !important;}
.w370 {width:370px !important;}
.w380 {width:380px !important;}
.w400 {width:400px !important;}
.w415 {width:415px !important;}
.w420 {width:420px !important;}
.w430 {width:430px !important;}
.w440 {width:440px !important;} 
.w460 {width:460px !important;} 
.w490 {width:490px !important;}

.w500 {width:500px !important;}
.w600 {width:600px !important;}
.w700 {width:700px !important;}
.w800 {width:800px !important;}
.w900 {width:900px !important;}
.w940 {width:940px !important;}

/* height */
.h50 {height:50px !important;}
.h60 {height:60px !important;} 
.h80 {height:80px !important;}
.h100 {height:100px !important;}
.h500 {height:500px !important;}

/* 스크롤 */
.no-scroll {overflow:hidden; overflow-y:hidden;}
.scroll-xy {overflow:auto; min-width:100%;}
.scroll-x {overflow-x:auto;}
.scroll-y {overflow-y:auto;}

/* common align */
.fl {float:left !important;}
.fr {float:right !important;}
.tc {text-align:center !important;}
.tr {text-align:right !important;}
.tl {text-align:left !important;}
.vt {vertical-align:top !important;}
.vb, 
.vb td {vertical-align:bottom !important;}
.vb .vm,
.vb .vm * {vertical-align:middle !important;}

/* only Mobile */
.mobile-only {display:none !important;}

/* only PC */
.pc-only{display:block;}
.mu-formbox > tbody > tr.pc-only {display:table-row;} /* 공통 모바일 */

/* 모바일에서만 보이는 항목정의 - @내부아웃 */
.mobile-show .data-label,
.mobile-show .mu-checkbox,
.mobile-show .inner-mobile {display:none;}

/* 공통 영역 */
.mu-item-group {display:flex; align-items:center;}
.mu-item-group .item-ml-auto {display:flex; align-items:center; margin-left:auto;}
.mu-item-group .item-ml-auto > * + * {margin-left:15px;}
.mu-item-group > * + * {margin-left:10px;}/* 기본10 */
table .mu-item-group > * + * {margin-left:8px;}/* td 8 */
.mu-item-group > .mu-radio + .mu-radio {margin:0 0 0 30px;}
.mu-item-group > .mu-checkbox + .mu-checkbox {margin:0 0 0 30px;}
.main-top .mu-item-group {position:relative;}
.mu-item-group span + .mu-checkbox {margin-left:30px;} 
.mu-item-group + .mu-item-group {margin-top:5px;}
.mu-item-group > * + .mu-checkbox {margin-left:20px;}
.mu-item-group span + .complete-msg {margin-left:30px;}
.mu-item-group span + button {margin-left:30px !important;}
.item-ml-auto {margin-left:auto;}
.mu-item-vgroup>* {display:block; width:100%;}

/* 기본나누기영역 */
.mu-section {display:flex; align-items:flex-start;}

/* 링크관련 */
.link {color:#666; font-weight:400;}
.link:hover {color:#1e9cff; text-decoration:underline;}
.unlink,.unlink:hover {color:#aaa; text-decoration:line-through; cursor:no-drop;}
.link-b {color:#333; font-weight:400;}
.link-b:hover {color:#333; text-decoration:underline;}
.link-bl,.link-bl:hover {color:#1e9cff; font-weight:bold;}
.underline {text-decoration:underline;}
.link > .mu-icon-svg {margin-left:7px;}

/* common Placeholder */
::-webkit-input-placeholder {color:#aaa;}
:-moz-placeholder{/* Firefox 18- */color:#aaa;}
::-moz-placeholder{/* Firefox 19+ */color:#aaa;}
:-ms-input-placeholder{color:#aaa;}

/* 말줄임 */
.mu-ellipsis {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

/* 공통 5라인이상 스크롤(긴 컬럼) */
.inner-scroll {overflow-y:auto; max-height:100px;}

/* 공통 row col 영역분리 */ 
.mu-row {position:relative; display:flex; flex-wrap:wrap; margin:0 -5px;}
.mu-row > .mu-col {position:relative; width:100%; min-width:1px; min-height:1px; padding-left:5px; padding-right:5px;}

/* row col 영역분리 */  
.mu-row:first-child {margin-top:-1px;}
.mu-row {position:relative; display:flex;}
.mu-col {display:flex; flex:1; width:100%; border-top:1px solid #e5e5e5; min-height:50px; box-sizing:border-box;}
.mu-col-1 {width:8.33333%;}
.mu-col-2 {width:16.66667%;}
.mu-col-3 {width:25%;}
.mu-col-4 {width:33.33333%;}
.mu-col-5 {width:41.66667%;}
.mu-col-6 {width:50%;}
.mu-col-7 {width:58.33333%;}
.mu-col-8 {width:66.66667%;}
.mu-col-9 {width:75%;}
.mu-col-10 {width:83.33333%;}
.mu-col-11 {width:91.66667%;}

/* 완료 결과값 안내문구 */
.complete-msg {margin:8px 0; font-weight:normal; color:#666;}
.complete-msg.success {color:#89c550;}
.complete-msg.error {color:#e50000;}

/* 처리상태값 안내문구 */
.status.wait {color:#f26c4f;}/* 답변대기 */
.status.end {color:#333;}/* 답변완료 */
.status.success {color:#89c550;}/* 이용가능 05-26 */
.status.ready {color:#333;}/* 승인대기 05-30 */
.status.reject {color:#333;}/* 승인거절 05-30 */
.status.finish {color:#f26c4f;}/* 승인완료 05-30 */
.status.expire {color:#999;}/* 만료 05-30 */
.status + .mu-btn {margin-left:10px;}

/* disabled 마우스 커서 */
*[disabled], .disabled, .disabled > *, .mu-list > li.disabled {cursor:no-drop;}
*[readonly], .readonly {cursor:default;}

/* button 
****************************************************************************/
/* width 제거, 사이즈 공통 처리, disabled 마우스 커서 공통 처리, round 공통 처리, text+icon 요소 추가, bg-non 요소 수정, ie click시 움직임 제거(span 추가)outline:0삭제 */
/* button basic(contents type) */
[class^="mu-btn"] {display:inline-flex; justify-content:center; align-items:center; min-width:80px; height:36px; line-height:100%; padding:0 16px; border:1px solid #ced9ee; border-radius:6px; background-color:#fff; color:#333; white-space:nowrap;}
[class^="mu-btn"] span {color:inherit; font-weight:400; line-height:100%;}
[class^="mu-btn"]:hover, 
[class^="mu-btn"]:active,
[class^="mu-btn"].active {border-color:#1673d8; background-color:#f8fbff; color:#1673d8; transition:all .3s;}
[class^="mu-btn"]:not[disabled] {cursor:pointer;}
[class^="mu-btn"][disabled], 
[class^="mu-btn"][disabled]:hover {border-color:#e5e5e5;}
[class^="mu-btn"][disabled] span, 
[class^="mu-btn"][disabled]:hover span {color:#aaa;}
[class^="mu-btn"] > *{display:inline-block; vertical-align:middle;}
[class^="mu-btn-sm"] {min-width:60px;}

/* button > icon */
[class^="mu-btn"] i {margin-right:8px;}
[class^="mu-btn"] span + i {margin-right:0; margin-left:4px;}
.mu-btn-sm i {margin-right:6px;}
.mu-btn-sm span + i {margin-right:0; margin-left:2px;}
[class^="mu-btn"].mu-btn-icon-only i {margin:0;}

/* icon type button */
[class^="mu-btn"].mu-btn-icon-only {display:flex; justify-content:center; align-items:center; min-width:auto; padding:0;}
.mu-btn-icon-only span {overflow:hidden; width:0; height:0; border:0; line-height:0; font-size:0 !important; text-indent:-9999px;}/* 버튼에 blind처리 */

/* icon+border */
.mu-btn.mu-btn-icon-only {width:36px; height:36px; border-radius:6px;}
.mu-btn-lg.mu-btn-icon-only {width:44px; height:44px; border-radius:22px;}

/* icon+border,bg non */
[class^="mu-btn"].mu-btn-bg-non {border:0; border-radius:0; background-color:transparent;}
[class^="mu-btn"].mu-btn-bg-non:hover,
[class^="mu-btn"].mu-btn-bg-non:active {border:0; background-color:transparent;}
[class^="mu-btn"].mu-btn-bg-non:hover span,
[class^="mu-btn"].mu-btn-bg-non:active {color:#333;}
[class^="mu-btn"].mu-btn-bg-non[disabled] span, [class^="mu-btn"].mu-btn-bg-non[disabled]:hover span {color:#cecece;}
/* bg non 버튼 공통 비활성시 */
.mu-btn-bg-non[disabled], 
.mu-btn-bg-non[disabled]:hover {background-color:transparent;}
.mu-btn-bg-non[disabled], 
.mu-btn-bg-non[disabled]:hover * {color:#bbb;}
.mu-btn.mu-btn-icon-only.mu-btn-bg-non {width:40px; height:40px; border-radius:0;}
.mu-btn-sm.mu-btn-icon-only.mu-btn-bg-non {width:24px; height:24px;}

/* button size */
.mu-btn-xs {height:18px;} 
.mu-btn-sm {min-width:60px; height:26px; padding:0 10px; border-radius:4px;}
.mu-btn-sm span {font-size:13px;}
.mu-btn-lg {min-width:100px; height:44px; padding:0 20px; border-radius:20px;}
.mu-btn-lg span {font-size:16px;}

/* button basic(contents type) - primary */
.mu-btn-primary {border:0; background-color:#1e9cff;}
.mu-btn-primary span,.mu-btn-primary:hover span,
.mu-btn-primary:focus span.mu-btn-primary:active span {color:#fff;}
.mu-btn-primary:hover,
.mu-btn-primary:focus,
.mu-btn-primary:active {background-color:#1673d8;}
.mu-btn-primary[disabled], 
.mu-btn-primary[disabled]:hover,
.mu-btn-primary[disabled]:focus {border:1px solid #ccc; background:#f5f5f5;}
.mu-btn-primary[disabled] span, 
.mu-btn-primary[disabled]:hover span,
.mu-btn-primary[disabled]:focus span {color:#aaa;}

/* 부분 삭제용 공통 button */
.mu-btn-delete {min-width:30px; height:30px; padding:0; border:none; background:none;}
.mu-btn-delete,
.mu-btn-delete:hover,
.mu-btn-delete:focus,
.mu-btn-delete:active {background:none;}
.mu-btn-delete .mu-icon-svg {margin:0;}
.mu-btn-delete span {font-size:0;}

/* 공통 예외 버튼 : 검색단 */
.mu-btn-sch {min-width:48px; border:0; border-radius:12px; background-color:#1e9cff;}
.mu-btn-sch:hover {background-color:#1673d8;}
.mu-btn-sch span, 
.mu-btn-sch:hover span {color:#fff;}
.mu-btn-sch .mu-icon-svg.search, 
.mu-btn-sch .mu-icon-svg.search:hover {width:32px; height:32px; margin:0; background-image:url("../images/ico/ico-search_o.svg");}

/* 공통 예외 버튼 : 팝업,알럿창 닫기용(사이즈는 상속) */
.mu-btn-close {min-width:auto; width:24px; height:24px; padding:0; border:0; border-radius:0; background-color:transparent;}
.mu-btn-close .mu-icon-svg {margin:0;}
.mu-btn-close span {overflow:hidden; width:0; height:0; line-height:0; font-size:0; text-indent:-9999px;}/* 버튼에 blind처리 */

/* 버튼영역 */
.mu-button-wrap {padding:30px 0 0; font-size:0; text-align:center;}
.mu-button-wrap [class^="mu-btn"] + [class^="mu-btn"] {margin-left:10px;}
.board-list-wrap ~ .mu-button-wrap {margin-top:40px;}

/* form 
****************************************************************************/
input[type=text] {font-weight:400; font-family:inherit;}
input[type=text]::-ms-clear {display:none;} /* ie x제거 */
input::-webkit-input-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input::-ms-input-placeholder, 
input::placeholder {color:#aaa;} 
input[disabled] + label {cursor:no-drop;}/* disabled 마우스 커서 공통 처리 */
.label {margin-right:5px;}/* 테이블외에 따로 들어가는 span 타입 label */

/* input */
/* 사이즈 공통 처리, disabled 마우스 커서 공통 처리, round 공통 처리, ie 요소 추가 */
.mu-input {width:100%; height:36px; line-height:34px; padding:0 16px; border:1px solid #ced9ee; border-radius:6px; background-color:#fff; font-size:inherit; color:#666;}
.mu-input:hover,
.mu-input:active, 
.mu-input:focus {border-color:#1673d8;}
.mu-input[disabled],
.mu-input[readonly] {border-color:#ccc; background-color:#f5f5f5; color:#aaa;}
.mu-input.error {border-color:#e50000; color:#333;}
.mu-input.success {border-color:#89c550; color:#333;}

/* input size */
.mu-input.mu-input-sm {height:44px; line-height:42px; border-radius:2px;}
.mu-input.mu-input-lg {height:48px; line-height:46px; border-radius:12px;}

/* 우측에 아이콘이 있는 타입 */
.mu-input-icon {display:flex; align-items:center; position:relative; width:100%;}
.mu-input-icon .mu-input {flex:1; padding-right:40px;}
.mu-input-icon .mu-btn-delete {position:absolute; top:50%; right:6px; box-shadow:none; transform:translateY(-50%);}
.mu-input-icon input[disabled] + .mu-btn-delete {opacity:0.5; cursor:no-drop;}
.mu-input-icon .mu-btn-sm.mu-btn-icon-only.mu-btn-bg-non {position:absolute; top:50%; right:5px; padding:0; transform:translateY(-50%);}

/* checkbox */
.mu-checkbox {position:relative; display:inline-block; min-height:28px; line-height:28px;}
.mu-checkbox:last-of-type {margin-right:0;}
.mu-checkbox input {overflow:hidden; position:absolute; clip:rect(0 0 0 0); width:1px; height:1px; margin:-1px; padding:0; border:0;}
.mu-checkbox label {display:inline-block; position:relative; line-height:18px; vertical-align:middle; cursor:pointer;}
.mu-checkbox label::before {content:""; position:absolute; top:0; left:0; width:18px; height:18px; border:1px solid #ced9ee; border-radius:6px; background:#fff;}
.mu-checkbox label span {display:inline-block; line-height:19px; padding-left:26px; font-weight:400; word-break:break-all;}
.mu-checkbox label .blind {padding-left:18px;}
.mu-checkbox input:checked + label::before {content:""; border-color:#1e9cff; background:#1e9cff url("../images/ico/ico-check.svg") no-repeat 1px 3px;}
.mu-checkbox input:disabled + label span {color:#aaa;}
.mu-checkbox input:disabled + label::before {background-color:#f5f5f5;}
.mu-checkbox input:disabled:checked + label::before {content:""; border-color:#ced9ee; background:#f5f5f5 url("../images/ico/ico-check_c_d.svg") no-repeat 1px 3px;}
.mu-checkbox input[readonly] + label span {color:#aaa;}
.mu-checkbox input[readonly] + label::before {background-color:#f5f5f5;}
.mu-checkbox input[readonly]:checked + label::before {border-color:#ced9ee; background:#f5f5f5 url("../images/ico/ico-check_c_d.svg") no-repeat 1px 3px;}
.mu-checkbox label span.count {padding-left:5px;}

/* radio */
/* disabled 마우스 커서 공통 처리 */
.mu-radio {position:relative; display:inline-block; min-height:28px; line-height:28px;}
.mu-radio:last-of-type {margin-right:0;}
.mu-radio input {overflow:hidden; position:absolute; clip:rect(0 0 0 0); width:1px; height:1px; margin:-1px; padding:0; border:0;}
.mu-radio label {position:relative; display:inline-block; line-height:18px; vertical-align:middle; cursor:pointer;}
.mu-radio label::before {content:""; position:absolute; top:0; left:0; width:18px; height:18px; border:1px solid #ced9ee; border-radius:50%;}
.mu-radio label span {display:inline-block; line-height:19px; padding-left:26px; font-weight:400; word-break:break-all;}
.mu-radio label .blind {padding-left:18px;}
.mu-radio input:checked + label::before {border-color:#1e9cff;}
.mu-radio input:checked + label::after {content:""; position:absolute; top:5px; left:5px; width:8px; height:8px; border-radius:50%; background-color:#1e9cff;} 
.mu-radio input:disabled + label span {color:#aaa;}
.mu-radio input:disabled + label::before {background-color:#f5f5f5;}
.mu-radio input:disabled:checked + label::before {border-color:#ced9ee;}
.mu-radio input:disabled:checked + label::after {content:""; position:absolute; top:5px; left:5px; width:8px; height:8px; border-radius:50%; background-color:#aaa;} 
.mu-radio input[readonly] + label span {color:#aaa;}
.mu-radio input[readonly] + label::before {background-color:#f5f5f5;}
.mu-radio input[readonly]:checked + label::before {border-color:#ced9ee;}
.mu-radio input[readonly]:checked + label::after {background-color:#aaa;}

/* selectbox *//* js */
/* mu-selectbox 기준 사이즈 상속, 사이즈 공통 처리, disabled 마우스 커서 공통 처리, round 공통 처리, ie click시 움직임 제거(span 추가), js 추가 */
.mu-selectbox .mu-value {position:relative; width:100%; height:100%; padding:0 42px 0 15px; border:1px solid #ced9ee; border-radius:6px; background:#fff; text-align:left; cursor:pointer;}
.mu-selectbox .mu-value::after {content:""; position:absolute; top:50%; right:12px; width:18px; height:18px; margin-top:-9px; background:url("../images/ico/ico-select-arrow.svg") no-repeat 0 0; background-size:cover; transition:transform .2s;}
.mu-selectbox .mu-value:hover,
.mu-selectbox .mu-value:active,
.mu-selectbox .mu-value:focus {border-color:#1e9cff; outline:0}
.mu-selectbox .mu-value span {position:relative;} /* ie click시 움직임 제거 */
.mu-selectbox .mu-list {display:none; overflow:auto; position:absolute; top:100%; z-index:20; width:100%; max-height:190px; border:1px solid #ced9ee; border-radius:14px; background-color:#fff;}
.mu-selectbox .mu-list li a {display:block; font-size:inherit; line-height:38px; padding:0 15px; color:#333;}
.mu-selectbox .mu-list li:hover a {background-color:#f4f6f8; text-decoration:none;}
.mu-selectbox.on .mu-list {display:block;}
.mu-selectbox.on .mu-value {background-color:#fff; border-color:#1e9cff;}
.mu-selectbox.on .mu-value::after {transform:rotate(180deg);}
.mu-selectbox.disabled .mu-value {border-color:#ced9ee; background-color:#f5f5f5; color:#bbb;}
.mu-selectbox.disabled .mu-list,
.mu-selectbox.disabled.on .mu-list {display:none;}
.mu-selectbox-up .mu-list {top:inherit; bottom:100%;}

/* basic select */
select::-ms-expand {display:none;}
.mu-selectbox {display:inline-block; position:relative; height:36px; vertical-align:middle;}
.mu-selectbox select {display:block; width:100%; height:36px; padding:0 42px 0 15px; border:1px solid #ced9ee; border-radius:6px; background:#fff url("../images/ico/ico-select-arrow.svg") no-repeat right 12px center;}
.mu-selectbox select:hover,
.mu-selectbox select:active,
.mu-selectbox select:focus {border-color:#1e9cff;}
/* basic select size */
.mu-selectbox.mu-selectbox-lg,
.mu-selectbox.mu-selectbox-lg select {height:48px; border-radius:15px; font-size:16px;}

/* textarea */
/* mu-area-resize 추가, disabled 마우스 커서 공통 처리, round 공통 처리 */
.mu-area {overflow:auto; width:100%; max-width:100%; min-height:100px; padding:12px 16px; border:1px solid #ced9ee; border-radius:6px; background-color:#fff; resize:none; font-family:inherit;}
.mu-area:hover,
.mu-area:active, 
.mu-area:focus {border-color:#1e9cff;}
.mu-input[disabled],
.mu-input[readonly] {border-color:#ccc; background-color:#f5f5f5; color:#aaa;}
.mu-area-resize {resize:both;}

/* byte */
.mu-byte-group {margin-top:10px; text-align:right; color:#828282;}
.mu-byte-group > strong {color:#000;}
.mu-item-group .mu-byte-group {margin-left:auto;}

/* file
****************************************************************************/
/* file attach */
.mu-file-attach {position:relative; display:flex; flex-direction:row; align-items:center; width:100%; height:36px;}
.mu-file-attach .mu-file-btn {position:relative;}
.mu-file-attach .mu-file-btn .mu-btn {padding:0; vertical-align:middle; /* IE */ border-color:#7a8da4; background-color:#fff;}
.mu-file-attach .mu-file-btn .mu-btn label {display:block; width:100%; height:100%; line-height:36px; color:#333; cursor:pointer;}
.mu-file-attach .mu-file-btn:hover .mu-btn {border-color:#7a8da4;}
.mu-file-attach .mu-file-btn:hover .mu-btn label,.mu-file-attach .mu-file-btn:hover .mu-btn span {color:#333;}
.mu-file-attach .mu-file-btn:not(:only-child):last-child {margin-left:10px;}
.mu-file-attach .mu-file-btn .mu-btn-hide {position:absolute; top:0; left:0; width:1px; height:100%; opacity:0;}
.mu-file-attach .mu-input:not(:first-child) {flex:1; margin-left:10px; padding-right:30px;}
.mu-file-attach .mu-input[readonly="readonly"] {background:#fff; color:#333;}
.mu-file-attach .mu-input-icon:not(:last-child) {flex:1 1 0%; min-width:0; margin-right:10px;}
.mu-file-attach .mu-btn-delete {position:absolute; top:50%; right:5px; min-width:30px; transform:translateY(-50%)}
.mu-file-attach + .file-sch-list {margin-top:10px;}

/* 파일첨부리스트타입 */
.mu-file-attach + .mu-file-attach {margin-top:5px;}

/* file attach 수정일떄 (추가,삭제버튼 포함) : 구조 변경 */
.edit-attach-group {position:relative;}
.edit-attach-group .mu-file-attach {width:calc(100% - 46px);}
.edit-attach-group .mu-file-attach > * + * {margin-left:10px;}
.edit-attach-group .mu-file-attach .mu-btn-delete {right:51px;}
.edit-attach-group .mu-file-attach:only-of-type > .mu-btn-delete {right:5px;}/* 한개만 있는 타입(삭제버튼이 없고 파일삭제버튼 위치 조절) */
.edit-attach-group .mu-file-attach:only-of-type > .mu-btn-icon-only:not(.file-delete) {display:none;}
.edit-attach-group > button {position:absolute; top:0; right:0;}

/* file sch list 다운로드 */ 
.file-sch-list > li {height:24px;}
.file-sch-list > li i {margin-right:5px;}
.file-sch-list > li > a {display:inline-block; overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap;}
.file-sch-list > li > a:hover {text-decoration:underline;}
.file-num {margin-left:5px;}

/* email input */
.email-group {display:flex;}
.email-group .part-email {display:flex; align-items:center; margin-right:8px;}
.email-group .part-email input {flex:1;}
.email-group .mu-selectbox {width:192px;}
.email-group span {width:30px; padding:0 5px; text-align:center;}

/* datepicker area
****************************************************************************/
.period-set {display:inline-flex; align-items:center; vertical-align:middle;}
.period-set > span {position:relative; display:inline-block; width:24px; text-align:center; vertical-align:middle;}/* 달력사이 - 만 해당 */
.period-set > span::before {content:"~";}
.mu-datepicker {position:relative; display:inline-block;}
.mu-datepicker .mu-input {width:180px; vertical-align:middle;}
.mu-datepicker .mu-input:hover {border-color:#1e9cff;}

/* vue datepicker,timepicker 3.10.2 */
div.mx-datepicker{width:130px;}
.mx-datepicker input {width:100%; height:36px; line-height:1; padding:0 15px; border:1px solid #ced9ee; border-radius:6px; background-color:#fff; color:#333;}
.mx-datepicker input:hover {border-color:#1e9cff;} 
.mx-datepicker input:focus {border-color:#1e9cff;}
.mx-datepicker input[disabled] {border-color:#ccc; background-color:#f5f5f5; color:#aaa;}
.mx-datepicker .mx-icon-calendar {position:absolute; top:17px; right:12px; width:18px; height:18px; background-image:url("../images/ico/ico-calendar.svg")}
.mx-datepicker .mx-icon-calendar *{display:none;}
.mx-datepicker-main.mx-datepicker-popup {width:262px; min-width:auto; min-height:auto; background:#fff; border:1px solid #aaa; border-radius:6px; box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.3);margin:0; z-index:10001}
.mx-datepicker-main .mx-calendar {float:none; width:100%; padding:0; font-family:'NotoSans';}
.mx-datepicker-main .mx-calendar-header {height:48px; line-height:38px; padding:5px 16px; border-radius:6px 6px 0 0; background-color:#fafafa;}
.mx-datepicker-main .mx-calendar-header * {font-size:16px; font-weight:bold; color:#333;}
.mx-datepicker-main .mx-calendar-header > a:hover {color:#1e9cff;}
.mx-datepicker-main .mx-calendar-header .mx-current-month + .mx-current-year::after {content:"년";}
.mx-datepicker-main [class^="mx-icon-"] {display:block; width:18px; height:36px; padding:0; background-repeat:no-repeat; background-position:center center; background-size:contain; text-indent:-9999em; vertical-align:middle;}
.mx-datepicker-main .mx-icon-double-left {background-image:url("../images/ico/ico-last_n.svg"); transform:rotate(180deg);}
.mx-datepicker-main .mx-icon-left {background-image:url("../images/ico/ico-right_n.svg"); transform:rotate(180deg);}
.mx-datepicker-main .mx-icon-double-right {background-image:url("../images/ico/ico-last_n.svg");}
.mx-datepicker-main .mx-icon-right {background-image:url("../images/ico/ico-right_n.svg");}
.mx-datepicker-main .mx-calendar-content {width:auto; height:auto; padding:11px 14px;}
.mx-datepicker-main .mx-table-date {table-layout:auto; border-collapse:separate; border-spacing:1px;}
.mx-datepicker-main .mx-panel-date tr {height:auto;}
.mx-datepicker-main .mx-table-date td, .mx-datepicker-main .mx-table-date th {width:auto; font-size:inherit; font-weight:400; vertical-align:middle;}
.mx-datepicker-main .mx-table-date td div, .mx-datepicker-main .mx-table-date th div {width:auto; font-size:inherit; font-weight:400; vertical-align:middle;}
.mx-datepicker-main .mx-table-date th div {color:#666;}/* th평일 */
.mx-datepicker-main .mx-table-date th:first-child {color:#e50000;}/* th일 */ 
.mx-datepicker-main .mx-table-date th:last-child {color:#1e9cff;}/* th토 */ 
.mx-datepicker-main .mx-table-date td {min-width:32px; height:32px; background:none;}
.mx-datepicker-main .mx-table-date td div {font-size:14px; color:#666;}
.mx-datepicker-main .mx-table-date td:first-child div {color:#e50000;}/* td일 */ 
.mx-datepicker-main .mx-table-date td:last-child div {color:#1e9cff;}/* td토 */
.mx-datepicker-main .mx-table-date td:hover {border:1px solid #1e9cff; background:none;}/* 평일hover */
.mx-datepicker-main .mx-table-date td.today, .mx-datepicker-main .mx-table-date td.today.active {background:#1e9cff;}/* 오늘 */
.mx-datepicker-main .mx-table-date td.today div, .mx-datepicker-main .mx-table-date td.today.active div {color:#fff;}
.mx-datepicker-main .mx-table-date td.today:hover, .mx-datepicker-main .mx-table-date td.today.active:hover {background:#1e9cff;}
.mx-datepicker-main .mx-table-date td.today:hover div, .mx-datepicker-main .mx-table-date td.today.active:hover div {color:#fff;}
.mx-datepicker-main .mx-table-date td.active {border:1px solid #1e9cff; background:none;}/* 선택한 날 */
.mx-datepicker-main .mx-table-date td.not-current-month div {color:#aaa;}/* 지난달,다음달 */
.mx-datepicker-main .mx-table-date td.not-current-month:hover div {border:none; color:#aaa;}
.mx-datepicker-main .mx-calendar-content .cell {border:1px solid transparent; background:transparent;}
.mx-datepicker-main .mx-calendar-content .cell div {color:#666;}
.mx-datepicker-main .mx-calendar-content .cell:hover {border:1px solid #f5f5f5; background-color:#f5f5f5;}
.mx-datepicker-main .mx-calendar-content .cell:hover div {color:#666;}
.mx-datepicker-main .mx-calendar-content .cell.active {border:1px solid #1e9cff; background:transparent;}
.mx-datepicker-main .mx-calendar-content .cell.active {color:#333;}
.mx-datepicker-main .mx-table-year {padding:0;}
.mx-datepicker-main .mx-table-year .cell div {display:inline-block; width:100%; line-height:36px; margin:1px 5%;}
.mx-datepicker-main .mx-table-month .cell div {display:inline-block; width:100%; line-height:36px; margin:1px 1.5%;}
.mx-btn-current-month,
.mx-btn-current-year {display:inline-block; line-height:38px; padding:0 5px;}

/* 라벨 태그 키워드 헤더 텍스트
***************************************************************************/

/* breadcrumb */
.mu-path {display:flex; align-items:center;}
.mu-path > li {display:flex; align-items:center; position:relative;}
.mu-path > li::before {content:""; display:block; width:16px; height:16px; margin:0 4px; background:url("../images/ico/ico-arrow-right.svg") no-repeat center center;}
.mu-path > li.home::before {margin-left:0; background:url("../images/ico/ico-home.svg") no-repeat center center; background-size:cover;}
.mu-path > li a {font-size:12px; line-height:16px; color:#777;}

/* 타이틀 공통 */
.subject h3,
.mu-heading h4,
.mu-heading h5,
p[class$="-title"],
strong[class$="-title"] {color:#333;}

/* 컨텐츠내부 공통 헤더 */
.mu-heading {display:flex; flex-wrap:wrap; align-items:flex-end; margin-bottom:6px;}
* ~ .mu-heading {margin-top:20px;}
.mu-heading ~ .mu-heading {margin-top:40px;}
.mu-heading + .mu-formbox {margin-top:0;}
.mu-heading + [class^="bul-"] {margin-top:20px;}
.mu-heading h4 {padding-top:6px; font-size:20px; line-height:30px;}
.mu-heading h4 * {color:inherit; font-size:inherit; font-weight:inherit; font-family:inherit;}
.mu-heading h4 strong {color:#1e9cff;}
.mu-heading h5 {padding:3px 0; font-size:20px; line-height:30px;}
.mu-heading p[class^="bul-"] {font-size:14px;}
.mu-heading .mu-item-group:last-child {margin-left:auto;}/* 우측정렬 */
.data-detail-wrap .mu-heading ~ .mu-heading {margin-top:30px;}

/* keyword */
mark.keyword {padding:0 3px; background-color:transparent; color:#1e9cff; font-size:inherit; font-weight:inherit; font-family:inherit;}
mark.keyword::before {content:"‘"; color:#333;}
mark.keyword::after {content:"’"; color:#333;}

/* 건수 */
.mu-total-num {padding-top:12px; color:#333; font-size:16px; line-height:24px;}
.mu-total-num strong {padding:0 3px; font-size:17px; color:#1e9cff; vertical-align:middle;}

/* 컨텐츠내부 공통 안내 */
.mu-infomation {display:flex; min-height:36px;}
.mu-infomation .mu-item-group {margin-left:auto;}

/* 문구 */
.txt-info,.txt-info > li,
span[class^="bul-"], p[class^="bul-"], ul[class^="bul-"] > li {position:relative; word-break:keep-all;}
span[class^="txt-"]::before, p[class^="txt-"]::before, ul[class^="txt-"] > li::before {color:inherit; text-align:left;}
[class^="bul-"] li + li {margin-top:3px;}
[class^="bul-"] > li > ul {margin-top:8px; margin-bottom:8px;}
td [class^="bul-"],
td [class^="txt-"] {font-size:13px; color:#aaa;}
/* 데이터 안내용 일반 문구 */
.txt-info {}

/* 데이터 없음 문구 */
.nodata:not(td) {margin-top:-1px; padding:90px 0; border-top:1px solid #7a8da4; border-bottom:1px solid #b5bfcb; font-family:'KHNPHD', sans-serif; font-size:20px; color:#333; text-align:center;}
.nodata:not(td)::before {content:url("../images/common/img-notice.png"); display:block; margin:0 auto 20px;}
.nodata span {display:block; margin-top:10px; font-family:'KHNPHU'; font-size:14px; color:#909090;}

/* 숫자나 기호가 들어가는 문구 */
.bul-num > li, p.bul-num  {margin-left:18px; padding-left:3px;}
.bul-num > li span, p.bul-num span {margin:0 3px 0 -18px; font-size:inherit; color:inherit;}

/* - 안내문구 */
.bul-hyphen > li, p.bul-hyphen {padding-left:12px;} 
.bul-hyphen > li::before, p.bul-hyphen::before {content:"-"; position:absolute; left:2px; top:0;}
.bul-hyphen > li:last-child, p.bul-hyphen:last-child {margin-bottom:0;} 

.bul-dot > li, p.bul-dot {padding-left:12px;}
.bul-dot > li::before, p.bul-dot::before {content:""; position:absolute; left:0; top:8px; width:3px; height:3px; background:#666;}

/* * 안내문구 */
.bul-ast > li, p.bul-ast {padding-left:12px;}
.bul-ast > li::before, p.bul-ast::before {content:"*"; position:absolute; top:2px; left:0;}

/* ※ 참고문구 */
.bul-refer > li, p.bul-refer {padding-left:16px;}
.bul-refer > li::before, p.bul-refer::before {content:"※"; position:absolute; left:0; top:0;}

/* ! 주의문구 */
.bul-caution > li, p.bul-caution {padding-left:22px;}
.bul-caution > li::before, p.bul-caution::before {content:""; position:absolute; left:0; top:0; width:18px; height:18px; background: url(../images/ico/ico-help.svg) no-repeat center center;}
.bul-caution em {font-size:0;}

/* 공통텍스트 색상타입 */
.txt-org {color:#f26c4f !important;}
.txt-dark {color:#333 !important;}
.txt-light {color:#909090 !important;}
.txt-blue {color:#1e9cff !important;}
.txt-skyblue {color:#0975da !important;}
.txt-basic {color:#666 !important;}
.txt-red {color:#ff0000 !important;}
.txt-brown {color:#b43700 !important;}

/* 필수 항목 표시 */
strong.required {display:inline-block; font-size:0; margin:0 3px; vertical-align:top;}
strong.required::before {content:"*"; color:#e50000; font-size:14px;}
.txt-required {color:#e50000 !important;}/* 필수 항목을 텍스트만으로 표시 */

/* formbox
****************************************************************************/
/* 상세폼테이블 */  
.mu-formbox {width:100%; border-top:1px solid #7a8da4;}
.mu-formbox tr {height:50px;}
.mu-formbox th,
.mu-formbox td {padding:10px 15px; border-bottom:1px solid #dce3f1; vertical-align:middle;}
.mu-formbox th {background-color:#f8f9fc; font-weight:normal; color:#333; text-align:left;}
.mu-formbox tr:last-child th,
.mu-formbox tr:last-child td {border-bottom:1px solid #b5bfcb;}
.mu-formbox td[colspan="2"] {padding:10px 0;}
.mu-formbox .mu-file-attach ~ .file-sch-list {display:flex; flex-wrap:wrap;}
.mu-formbox .mu-file-attach ~ .file-sch-list > li {width:calc(50% - 3px);}
.mu-formbox .mu-file-attach ~ .file-sch-list > li + li {margin-top:0;}
.mu-formbox .mu-file-attach ~ .file-sch-list > li:nth-child(even) {margin-left:6px;}
.mu-formbox .mu-file-attach ~ .file-sch-list > li:nth-child(n+3) {margin-top:6px;}

/* mu-formbox-row */
.mu-formbox-row {border-top:1px solid #7a8da4;border-bottom:1px solid #dce3f1;overflow:hidden;}
.mu-col .th {width:140px; padding:12px 15px; background:#f8f9fc; display:flex; flex-wrap:wrap; align-items:center; min-height:50px; font-weight:normal; box-sizing:border-box;}
.mu-col .th + .td {width:calc(100% - 140px);}
.mu-col .td {align-self:center; width:100%; padding:12px 15px;}
.mu-col .th br {display:none;}
.mu-col .td span {line-height:20px;}
.mu-col .td.cont {padding:30px 0;}
.mu-col .td.cont p {line-height:1.5;}
.mu-col .td ul li a {line-height:28px;}
.mu-col .td a:hover,.mu-col .td a:focus {color:#1e9cff; text-decoration:underline;}
.mu-formbox-row .bul-refer {font-size:13px;}
/* mu-formbox-row th bg 분리 */
.mu-formbox-row.mu-formbox-bgnon .th {background:#fff;}
.mu-formbox-row.mu-formbox-bg .th {background:#f5f8fb;}
.mu-formbox-row .th.empty >* {color:#aaa;}/* td empty */
.mu-formbox-row .td .data-info dd {color:#666 !important;}

/* grid
***************************************************************************/
/* mu-grid */
.mu-grid {width:100%; border-top:1px solid #7a8da4;}
.mu-grid tr {height:50px;}
.mu-grid tr.alarm-notice td {background-color:#fafafa;}/* 중요공지표시용 */
.mu-grid tr:hover td {background-color:#f5f8fb !important;}
.mu-grid th {padding:8px 10px; font-weight:normal; color:#333;}
.mu-grid td {padding:8px 15px; border-bottom:1px solid #dce3f1; text-align:center;}
.mu-grid tr:last-child td,
.mu-grid thead th {border-bottom:1px solid #b5bfcb;}
.mu-grid td a {display:inline-block; overflow:hidden; max-width:calc(100% - 25px); line-height:1.2; color:inherit; white-space:nowrap; text-overflow:ellipsis; vertical-align:middle;}
.mu-grid td a:hover,
.mu-grid td a:hover * {color:#1e9cff;} /* 링크색상공통 */ 
.mu-grid td i.mu-icon-svg.new {margin:0 0 0 5px;} /* 새로운글 */
.mu-grid td .inner-check {padding-left:20px;} 
.mu-grid td .inner-check .mu-checkbox {margin-left:-20px;}

/* mu-grid bg type */
.mu-grid.mu-grid-ty2 thead > tr > th {background-color:#fafafa;}

/* grid 공통간격처리 */
* ~ table {margin-top:30px;}

/* 기본테이블형 */
.board-list-wrap {position:relative;}
.board-list-wrap .mu-button-wrap {position:absolute; right:0; bottom:0; margin:0; padding:0;}
.board-list-wrap .mu-button-wrap button:only-child {min-width:80px;}

/* pagination */
.mu-pagination {display:flex; justify-content:center; align-items:center; margin:30px auto 0; text-align:center;}
.mu-pagination button, .mu-pagination ul {display:inline-flex; vertical-align:middle;}
.mu-pagination button + button {margin-left:12px;}
.mu-pagination .mu-btn-paging {width:20px; height:32px; min-width:auto; border:0;}
.mu-pagination .mu-btn-paging [class^="mu-icon"] {width:100%; height:100%; margin:0;}
.mu-pagination ul {padding:0 12px;}
.mu-pagination li a {display:block; width:34px; height:34px; line-height:34px; margin:0; padding:0; border:1px solid transparent; border-radius:2px 10px 2px 10px; background:none; font-size:14px; font-weight:bold; color:#7f7f7f; text-align:center;}
.mu-pagination li:hover a,
.mu-pagination li:active a,
.mu-pagination li.active a {border-color:#fff; background-color:#fff; color:#1e9cff; font-weight:bold; text-decoration:none;}
.mu-pagination li:active a,
.mu-pagination li.active a {border-color:#1e9cff; background-color:#1e9cff; color:#fff;}
.mu-pagination button, 
.mu-pagination button:hover,
.mu-pagination button:active {border:none; background:none; padding:0;}
.mu-pagination button[disabled], 
.mu-pagination button[disabled]:hover {background:none; cursor:no-drop;}
.mu-pagination button span {overflow:hidden; width:0; height:0; line-height:0; font-size:0; text-indent:-9999px;}/* 페이징버튼에 blind처리 */
.mu-pagination .paging {display:none; min-width:90px; font-size:16px; text-align:center;}
.mu-pagination .paging .total-num {font-size:inherit; color:#909090;}
.mu-pagination .paging em {font-weight:bold; font-size:inherit; color:#1e9cff;}
.mu-pagination .mu-btn.mu-btn-icon-only.mu-btn-bg-non {width:100%; height:100%;}

/* tab */ 
.mu-tab-box {max-width:1420px; margin:0 auto 20px;}
.mu-tab-box .mu-tab {display:flex; flex-wrap:wrap; width:100%; margin-left:1px;}
.mu-tab-box .mu-tab li {flex:1; position:relative; height:60px; margin-left:-1px; border-left:1px solid #ced9ee; background-color:#fff;}
.mu-tab-box .mu-tab li:first-child {border-radius:28px 0 0 28px; border-left:0;}
.mu-tab-box .mu-tab li:last-child {border-radius:0 28px 28px 0;}
.mu-tab-box .mu-tab li:only-child {width:100%;} 
.mu-tab-box .mu-tab li.active {border-color:#1e9cff; background-color:#1e9cff; z-index:1;}
.mu-tab-box .mu-tab li a {display:flex; flex-direction:column; align-items:center; justify-content:center; flex:1; height:100%; line-height:1.2; color:#333; font-size:16px; text-align:center;}
.mu-tab-box .mu-tab li a span {padding:3px 0; color:#333; font-size:16px; text-align:center;}
.mu-tab-box .mu-tab li a em {padding:3px 0; font-size:14px;}
.mu-tab-box .mu-tab li.active a {color:#fff;} 
.mu-tab-box .mu-tab li:first-child:nth-last-child(8), .mu-tab-box .mu-tab li:first-child:nth-last-child(8) ~ li {-webkit-box-flex:0; -ms-flex:none; flex:none; width:calc(25% + 1px);}/* tab li가 8개일 때 */ 
.mu-tab-box .mu-tab li .mu-tooltip-control {position:absolute; bottom:8px; right:8px; height:18px;}
/* 드롭다운탭 : 모바일용 */
.dropdown-tab {position:relative;}
.dropdown-tab .mu-selectbox {width:100%; height:48px;}
.dropdown-tab .mu-selectbox .mu-value {height:100%; border:0; border-radius:15px;}

/* dialog */
.mu-modal {display:flex; align-items:center; justify-content:center; position:fixed; top:0; right:0; bottom:0; left:0; z-index:100; margin:auto;}
.mu-dialog {overflow:hidden; position:relative; z-index:101; min-width:420px; border-radius:20px; background-color:#fff;}
.mu-dialog-background {position:fixed; top:0; left:0; right:0; bottom:0; z-index:100; background-color:#000; opacity:.7;}/* dimmed */
.mu-dialog-head {height:60px; padding:0 20px; background-color:#1e9cff;}
.mu-dialog-head .title {font-size:20px; line-height:60px; color:#fff;}
.mu-dialog-body {overflow:auto; max-height:calc(100vh - 204px); padding:30px 30px 0;}
.mu-dialog-foot {padding:20px 0 40px; text-align:center;}
.mu-dialog-foot button {min-width:100px; height:44px; margin:0 5px; border-radius:22px; vertical-align:middle;}
.mu-dialog-foot button span {font-size:16px;}
.mu-dialog .mu-dialog-close-btn {position:absolute; top:18px; right:20px;}
.mu-dialog .mu-dialog-close-btn .mu-btn-close,
.mu-dialog .mu-dialog-close-btn .mu-icon-svg {width:24px; height:24px;}
.mu-dialog .mu-dialog-close-btn button,
.mu-dialog .mu-dialog-close-btn button:hover,
.mu-dialog .mu-dialog-close-btn button:focus {background-color:transparent;}

/* tooltip */
.mu-tooltip {position:absolute; top:40px; z-index:4; min-width:78px; border:1px solid #1673d8; border-radius:4px; background-color:#f8fbff; box-shadow: 2px 4px 0 0 rgba(0, 0, 0, 0.15);}
.mu-tooltip >* {text-align:left;}
.mu-tooltip .mu-tooltip-head {height:53px; line-height:53px; padding:2px 20px; border-bottom:1px solid #ced9ee;}
.mu-tooltip .mu-tooltip-head strong {color:#333; font-size:16px; font-weight:bold;}
.mu-tooltip .mu-tooltip-body {padding:15px;}
.mu-tooltip .mu-tooltip-head ~ .mu-tooltip-body {padding-right:20px;}
.mu-tooltip .mu-tooltip-body > *+* {margin-top:10px;}
.mu-tooltip .mu-tooltip-body .mu-bul-refer {font-size:13px;}
.mu-tooltip .mu-tooltip-close-btn {position:absolute; top:15px; right:15px; font-size:0;}
.mu-tooltip .mu-tooltip-close-btn .mu-btn-close {width:18px; height:18px;} 
/* tooltip안내 */
.mu-tooltip-info {display:none; position:absolute; top:100%; z-index:4; min-width:100px; margin-top:5px; padding:12px 15px; border:1px solid #1673d8; border-radius:4px; background-color:#f8fbff; box-shadow: 2px 4px 0 0 rgba(0, 0, 0, 0.15);}
.mu-tooltip-info .mu-tooltip-close-btn {position:absolute; top:10px; right:12px; font-size:0;}
.mu-tooltip-info .mu-tooltip-close-btn .mu-btn-close {width:18px; height:18px;}
.mu-tooltip-info.open {display:block;}
.mu-tooltip-info.right {right:0;}/* 위치지정 */
.mu-tooltip-info .mu-tooltip-head {display:flex; height:30px;}
/* 지정영역에서 tooltip 띄우기 */
.mu-tooltip-control {display:inline-block; position:relative;}

/* alert(PC H가변 / MOB 400px고정) */
.mu-alert {position:relative; width:400px; min-width:320px; min-height:190px; padding:20px 30px 30px; border:1px solid #ced9ee; border-radius:12px; background:#fff;}
.mu-alert-head {padding:0 15px; text-align:center;}
.mu-alert-head strong {font-size:18px; font-weight:bold; line-height:1.4em;}
.mu-alert-body {position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:50px 20px 30px;}
.mu-alert-head + .mu-alert-body {padding:30px 20px;} 
.mu-alert-msg {line-height:1.6; text-align:center;}
.mu-alert-foot {text-align:center;}
.mu-alert-foot button + button {margin-left:7px;}
.mu-alert .mu-alert-close-btn {position:absolute; top:10px; right:10px;}

/* tbody 스크롤(IE11 미지원) : table > thead th sticky */
.mu-grid-sticky-scroll {overflow-y:auto; height:100%; margin-bottom:20px; border-bottom:1px solid #ccc;}
.mu-grid-sticky-scroll table th,
.mu-grid-sticky-scroll table td {word-break:keep-all;}
.mu-grid-sticky-scroll table thead {position:sticky; top:0;}
.mu-grid-sticky-scroll .mu-grid tbody td {background-color:#fff;}
.mu-grid-sticky-scroll .mu-grid tbody tr:last-child td {border-bottom:none;}
.mu-grid-sticky-scroll .mu-grid thead th {border:none; background-position:0 0, 0 bottom; background-repeat:repeat-x, repeat-x; background-image:url("../images/common/tbl-dot-top.gif"), url("../images/common/tbl-dot-bot.gif");}

/* step */
.step-box {margin-top:20px;}
.step-desc {display:flex; gap:40px 50px; counter-reset:step-number;}
.step-desc li {flex:1; position:relative; padding:40px; border-radius:20px; background-color:#f5fafd; text-align:center;}
.step-desc li:not(:first-child)::before {content:url("../images/ico/ico-arrow-step.svg"); position:absolute;}
.step-desc:not(.step-grow) li:not(:first-child)::before {top:50%; left:-25px; transform:translate(-50%, -50%);}
.step-desc.step-grow {flex-direction:column;}
.step-desc.step-grow li:not(:first-child)::before {top:-20px; left:50%; transform:translate(-50%, -50%) rotate(90deg);}
.step-desc .step-head {margin-bottom:20px;}
.step-desc .step-head strong {counter-increment:step-number; font-weight:normal; font-size:20px; color:#333; word-break:keep-all;}
.step-desc .step-head strong::before {content:"STEP 0" counter(step-number) "."; display:block; margin-bottom:10px; font-weight:500; font-size:inherit; line-height:1.2; color:#1e9cff; text-transform:uppercase;}
.step-desc .step-body p {margin:0 auto; color:#333; word-break:keep-all;}
.step-desc:not(.step-grow) .step-body p {max-width:340px;}
.step-desc .step-body p * {line-height:inherit; word-break:keep-all;}
.step-desc .step-body p span {color:#1e9cff !important;}