/* 맞춤정보 설정 — 단계별 위저드 */
html, body { background:#fff; }
body { font-family:"Noto Sans KR","Malgun Gothic","맑은 고딕",sans-serif; color:#222; margin:0; padding-bottom:80px; }

.mp-wrap {
    width:100%; max-width:1024px;
    margin:0 auto; padding:14px 16px 24px;
    box-sizing:border-box;
}

/* 헤더 */
.mp-header {
    display:flex; align-items:center; justify-content:space-between;
    border-bottom:2px solid #2b5b9d;
    padding-bottom:10px; margin-bottom:12px;
}
.mp-header-left h2 { margin:0; font-size:18px; color:#1a3f74; font-weight:700; display:inline-block; }
.mp-header .mp-desc { font-size:12px; color:#7384a3; margin-left:10px; }
.mp-header .mp-desc b { color:#2b5b9d; }
.mp-close {
    width:30px; height:30px; line-height:28px; text-align:center;
    border:1px solid #d6dfeb; border-radius:50%;
    color:#7384a3; font-size:18px; font-weight:300; text-decoration:none;
    background:#fff; transition:all .15s;
}
.mp-close:hover { background:#c92a2a; border-color:#c92a2a; color:#fff; }

/* 관리자 모드 표시 */
.mp-badge {
    display:inline-block; padding:2px 8px; margin-left:8px;
    border-radius:3px; font-size:11px; font-weight:700;
    vertical-align:3px;
}
.mp-badge.mp-badge-admin { background:#c92a2a; color:#fff; }
.mp-target-mem {
    margin-left:8px; font-size:12px; color:#3a5a82;
    vertical-align:3px;
}
.mp-target-mem b { color:#1a3f74; font-family:Menlo,Consolas,monospace; }
.mp-btn-log {
    margin-left:6px; padding:3px 10px; font-size:11.5px;
    background:#fff8e1; color:#a16207; border:1px solid #ffd54f;
    border-radius:3px; text-decoration:none; vertical-align:2px;
}
.mp-btn-log:hover { background:#fff3bf; color:#5a4500; }
.mp-btn-rec {
    margin-left:6px; padding:3px 10px; font-size:11.5px;
    background:#e7f5ff; color:#1971c2; border:1px solid #74c0fc;
    border-radius:3px; text-decoration:none; vertical-align:2px;
}
.mp-btn-rec:hover { background:#d0ebff; color:#11528f; }

/* ==================== iframe 모달 ==================== */
.mp-modal {
    position:fixed; inset:0; z-index:9000;
    background:rgba(20,30,50,0.55);
    display:none; align-items:stretch; justify-content:center;
    padding:8px; box-sizing:border-box;
    animation:mpFade .15s ease;
}
.mp-modal.is-on { display:flex; }
.mp-modal-box {
    width:100%; max-width:1400px;
    background:#fff; border-radius:6px;
    box-shadow:0 8px 32px rgba(0,0,0,0.25);
    display:flex; flex-direction:column; overflow:hidden;
    min-width:0;
}
.mp-modal-head {
    flex-shrink:0;
    display:flex; align-items:center; justify-content:space-between;
    padding:8px 14px;
    background:#1a3f74; color:#fff;
    border-bottom:1px solid #0f2a52;
}
.mp-modal-title { font-size:13.5px; font-weight:700; white-space:nowrap; }
.mp-modal-head .mp-close {
    border-color:rgba(255,255,255,0.4); color:#fff; background:transparent;
    width:26px; height:26px; line-height:24px; font-size:16px;
    flex-shrink:0;
}
.mp-modal-head .mp-close:hover { background:#c92a2a; border-color:#c92a2a; }
#mpLogFrame { flex:1; width:100%; border:none; background:#fff; min-height:0; }

/* 그룹 탭 */
.mp-tabs {
    list-style:none; margin:0 0 14px 0; padding:0;
    border-bottom:1px solid #d6dfeb;
}
.mp-tabs:after { content:""; display:block; clear:both; }
.mp-tabs li { float:left; margin-right:3px; }
.mp-tabs li a {
    display:block; padding:7px 16px;
    border:1px solid #d6dfeb; border-bottom:none;
    border-radius:4px 4px 0 0;
    background:#f7f9fc; color:#3a5a82;
    font-size:12.5px; text-decoration:none;
    max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.mp-tabs li a:hover { background:#eef3fa; }
.mp-tabs li.is-on a {
    background:#2b5b9d; border-color:#2b5b9d; color:#fff; font-weight:700;
}
.mp-tabs li.mp-tab-new a { color:#2b5b9d; }
.mp-tabs li.mp-tab-new.is-on a { color:#fff; }

/* 드래그 가능 탭 표시 */
.mp-tabs li.mp-tab-sort > a { cursor:move; }
.mp-tab-drag {
    display:inline-block; margin-right:5px;
    color:#a0acc4; font-size:10px; letter-spacing:-2px;
    transform:rotate(90deg); vertical-align:middle;
}
.mp-tabs li.mp-tab-sort.is-on .mp-tab-drag { color:rgba(255,255,255,0.6); }
.mp-tabs li.mp-tab-sort:hover .mp-tab-drag { color:#2b5b9d; }
.mp-tabs li.mp-tab-sort.is-on:hover .mp-tab-drag { color:#fff; }
.ui-sortable-helper { box-shadow:0 4px 12px rgba(20,50,100,0.15); }
.ui-sortable-placeholder { background:#eef3fa !important; border:1px dashed #2b5b9d !important; visibility:visible !important; }

/* 스텝 인디케이터 */
.mp-steps {
    display:flex; align-items:stretch;
    list-style:none; margin:0 0 16px 0; padding:0;
    background:#f7f9fc; border:1px solid #d6dfeb; border-radius:4px;
    counter-reset:step;
}
.mp-steps li { flex:1; position:relative; }
.mp-steps li a {
    display:flex; align-items:center; justify-content:center; gap:8px;
    padding:11px 6px; text-decoration:none;
    color:#7384a3; font-size:12.5px;
}
.mp-steps li a:hover { background:#eef3fa; color:#1a3f74; }
.mp-steps li:after {
    content:"›"; position:absolute; right:-6px; top:50%;
    transform:translateY(-50%); color:#cfd8e6; font-size:18px;
    z-index:1;
}
.mp-steps li:last-child:after { display:none; }

.mp-step-no {
    display:inline-flex; align-items:center; justify-content:center;
    width:22px; height:22px;
    background:#fff; border:1.5px solid #cfd8e6; border-radius:50%;
    color:#7384a3; font-size:11.5px; font-weight:700;
    flex-shrink:0;
}
.mp-step-label { font-weight:500; }
.mp-step-label em { color:#c92a2a; font-style:normal; font-weight:700; }

.mp-steps li.is-on { background:#fff; }
.mp-steps li.is-on a { color:#2b5b9d; font-weight:700; }
.mp-steps li.is-on .mp-step-no {
    background:#2b5b9d; border-color:#2b5b9d; color:#fff;
}
.mp-steps li.is-done a { color:#1a3f74; }
.mp-steps li.is-done .mp-step-no {
    background:#9ab5d8; border-color:#9ab5d8; color:#fff;
}

/* 패널 */
.mp-pane { display:none; animation:mpFade .2s ease; }
.mp-pane.is-on { display:block; }
@keyframes mpFade { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }

.mp-pane-head { margin:0 0 12px 2px; }
.mp-pane-head h3 { margin:0 0 4px 0; font-size:15px; color:#1a3f74; font-weight:700; }
.mp-pane-head p  { margin:0; font-size:12px; color:#7384a3; }
.mp-req { color:#c92a2a; font-weight:700; }

/* 테이블 */
.mp-tbl {
    width:100%; border-collapse:collapse;
    border-top:2px solid #2b5b9d;
    margin-bottom:8px; background:#fff;
}
.mp-tbl th, .mp-tbl td {
    border-bottom:1px solid #d8dde6;
    padding:10px 12px; font-size:12.5px;
    vertical-align:middle;
}
.mp-tbl th {
    background:#eef3fa; color:#1a3f74;
    text-align:left; font-weight:600;
}
.mp-tbl td.mp-td-cols { padding:0 !important; }

/* 폼 요소 */
.mp-input {
    border:1px solid #cfd8e6; border-radius:3px;
    padding:5px 8px; font-size:12.5px;
    background:#fff; color:#222;
    vertical-align:middle; box-sizing:border-box;
}
.mp-input:focus { border-color:#2b5b9d; outline:none; box-shadow:0 0 0 2px rgba(43,91,157,0.12); }
.mp-input-sm { width:80px; text-align:center; }
.mp-input-md { width:280px; }
.mp-input-money {
    width:180px; text-align:right;
    font-variant-numeric:tabular-nums;
    font-family:"Noto Sans KR",Menlo,Consolas,monospace;
}

.mp-sub-head {
    background:#f7f9fc !important; color:#3a5a82 !important;
    font-size:12px !important; font-weight:600 !important;
    padding:7px 12px !important; border-bottom:1px solid #d8dde6;
    text-align:left;
}
.mp-th-sub { color:#7384a3; font-weight:400; font-size:11px; margin-left:4px; }

/* 금액 4행 테이블 */
.mp-td-flat { padding:8px 12px !important; }
.mp-money-tbl {
    width:100%; border-collapse:collapse;
    border:1px solid #d6dfeb; border-radius:3px; overflow:hidden;
    background:#fff;
}
.mp-money-tbl thead th {
    background:#eef3fa; color:#1a3f74;
    font-size:11.5px; font-weight:600;
    padding:6px 8px; border-bottom:1px solid #d6dfeb;
    text-align:left;
}
.mp-money-tbl thead th.mp-mt-h { text-align:left; padding-left:10px; }
.mp-money-tbl tbody th {
    background:#fafbfd; color:#3a5a82;
    font-size:12px; font-weight:600;
    padding:7px 10px; border-bottom:1px solid #eef0f3;
    text-align:left; width:160px;
}
.mp-money-tbl tbody td {
    padding:6px 8px; border-bottom:1px solid #eef0f3;
    font-size:12.5px; vertical-align:middle;
}
.mp-money-tbl tbody tr:last-child th,
.mp-money-tbl tbody tr:last-child td { border-bottom:none; }
.mp-money-tbl tbody tr:hover td,
.mp-money-tbl tbody tr:hover th { background:#f7f9fc; }
.mp-mt-sep {
    text-align:center; color:#7384a3; font-weight:600;
    padding:0 !important;
}

/* 물품번호 등록 목록 */
.mp-empty-box {
    padding:14px; text-align:center;
    background:#fafbfd; border:1px dashed #d6dfeb; border-radius:3px;
    color:#7384a3; font-size:12px;
}
.mp-item-tbl {
    width:100%; border-collapse:collapse;
    border:1px solid #d6dfeb; border-radius:3px; overflow:hidden;
    background:#fff;
}
.mp-item-tbl thead th {
    background:#eef3fa; color:#1a3f74;
    font-size:11.5px; font-weight:600;
    padding:6px 8px; border-bottom:1px solid #d6dfeb;
    text-align:left;
}
.mp-item-tbl tbody td {
    padding:6px 8px; border-bottom:1px solid #eef0f3;
    font-size:12px; vertical-align:middle;
}
.mp-item-tbl tbody tr:last-child td { border-bottom:none; }
.mp-item-tbl tbody tr:hover td { background:#f7f9fc; }
.mp-item-tbl td.c { text-align:center; }
.mp-item-code { font-family:Menlo,Consolas,monospace; color:#1a3f74; font-weight:600; }
.mp-item-scrap {
    display:inline-block; padding:1px 7px; border-radius:3px;
    background:#e9ecef; color:#868e96; font-size:10.5px; font-weight:700;
}
.mp-item-scrap.on { background:#0c8599; color:#fff; }
.mp-unit { font-size:12px; color:#3a5a82; margin:0 4px; }
.mp-hint { display:block; font-size:11.5px; color:#7384a3; margin-top:4px; }

.mp-chk {
    display:inline-block; margin:3px 12px 3px 0;
    font-size:12.5px; color:#3a5a82; cursor:pointer;
    line-height:1.7;
}
.mp-chk input { vertical-align:middle; margin-right:4px; }
.mp-chk:hover span { color:#1a3f74; }

/* 버튼 */
.mp-btn {
    display:inline-block; padding:5px 12px;
    border:1px solid #cfd8e6; border-radius:3px;
    background:#fff; color:#3a5a82;
    font-size:12px; text-decoration:none;
    line-height:1.5; cursor:pointer;
    vertical-align:middle;
    transition:all .12s;
}
.mp-btn:hover { background:#eef3fa; border-color:#a8bcd9; }
.mp-btn.mp-btn-pri {
    background:#2b5b9d; border-color:#2b5b9d; color:#fff; font-weight:600;
}
.mp-btn.mp-btn-pri:hover { background:#244f8a; }
.mp-btn.mp-btn-off {
    background:#e9ecef; border-color:#ced4da; color:#868e96; cursor:not-allowed;
}
.mp-btn.mp-btn-off:hover { background:#e9ecef; border-color:#ced4da; }
.mp-btn.mp-btn-danger {
    background:#fff; border-color:#f5b3b3; color:#c92a2a;
}
.mp-btn.mp-btn-danger:hover { background:#c92a2a; border-color:#c92a2a; color:#fff; }
.mp-btn.mp-btn-lg { padding:8px 28px; font-size:13.5px; min-width:110px; text-align:center; }

/* 선택태그 (업종/지역 공통) */
.mp-sel-tags { list-style:none; margin:0; padding:0; min-height:24px; }
.mp-sel-tags:after { content:""; display:block; clear:both; }
.mp-tag {
    display:inline-block; margin:2px 4px 2px 0;
    padding:0; line-height:1;
    background:#eef3fa; border:1px solid #b8cce8; border-radius:14px;
    font-size:11.5px; color:#1a3f74;
    transition:all .12s;
}
.mp-tag:hover { background:#fff5f5; border-color:#f5b3b3; }
.mp-tag a {
    display:inline-flex; align-items:center; gap:6px;
    padding:3px 5px 3px 10px;
    color:#1a3f74; text-decoration:none;
}
.mp-tag .mp-tag-txt { line-height:1.4; }
.mp-tag .mp-tag-x {
    display:inline-flex; align-items:center; justify-content:center;
    width:15px; height:15px;
    background:#b8cce8; color:#fff;
    border-radius:50%;
    font-size:14px; font-weight:300; line-height:1;
    transition:all .12s;
}
.mp-tag:hover .mp-tag-x { background:#c92a2a; }
.mp-tag:hover .mp-tag-txt { color:#c92a2a; }

/* selarea 안의 선택 항목 - 컨텐츠 만큼만 차지 (자연스러운 chip 형태) */
#selarea {
    padding:5px 6px;        /* 칩들 들어갈 여유 */
    line-height:1.2;
}
#selarea li.mp-tag {
    display:inline-flex;
    width:auto; max-width:100%;
    height:auto; line-height:1.3;
    padding:0; margin:3px 4px 3px 0;
    box-sizing:border-box;
    overflow:hidden;
    float:none; vertical-align:middle;
}
#selarea li.mp-tag a {
    gap:5px;
}
#selarea li.mp-tag .mp-tag-txt {
    max-width:180px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
#selarea li.mp-tag .mp-tag-x { flex-shrink:0; }
#selarea li.mp-tag:hover { background:#fff5f5; }
#selarea li.off, #selarea li.mp-empty { padding:6px 10px; }

/* 컬럼 박스 (업종/지역) */
.mp-td-cols:after { content:""; display:block; clear:both; }
.mp-col {
    float:left; width:33.333%;
    height:230px; overflow-y:auto;
    margin:0; padding:6px 0; list-style:none;
    border-right:1px solid #d8dde6;
    background:#fff;
    box-sizing:border-box;
}
.mp-col.mp-col-last { border-right:none; }
.mp-col.mp-col-sel  { background:#f7f9fc; }
.mp-col li {
    padding:0 12px; height:26px; line-height:26px;
    box-sizing:border-box; font-size:12px;
}
.mp-col li a {
    display:block; color:#3a5a82; text-decoration:none;
}
.mp-col li a:hover, .mp-col li.on a {
    background:#2b5b9d; color:#fff;
}
.mp-col li.mp-tag a:hover { background:transparent; color:inherit; }
.mp-col li.mp-tag.on a { background:transparent; color:inherit; }
.mp-col li.mp-empty, .mp-col li.off { color:#a0acc4; font-size:11.5px; }
.mp-col li.line_break {
    height:1px; border-top:1px dashed #d8dde6;
    margin:4px 8px; padding:0; line-height:0;
}
.mp-col li.dc-list a { color:#1a3f74; font-weight:600; }
.mp-col li.dc-list.on a, .mp-col li.dc-list a:hover { color:#fff; }

/* 주력업종 ↳ 주력 배지 */
.mp-up-sub {
    display:inline-block;
    margin-right:5px; padding:0 5px;
    background:#fff4e6; color:#a16207; font-weight:700;
    border:1px solid #ffd8a8; border-radius:3px;
    font-size:10.5px; line-height:1.5;
    vertical-align:1px;
}
.mp-col li a:hover .mp-up-sub,
.mp-col li.on a .mp-up-sub {
    background:rgba(255,255,255,0.25); border-color:transparent; color:#fff;
}
.mp-tag .mp-up-sub { font-size:10px; padding:0 4px; }
.mp-col.mp-disabled { opacity:0.45; pointer-events:none; background:#f4f5f7; }

/* 강조 체크박스 */
.mp-chk-strong {
    padding:6px 12px; background:#fff8e1; border:1px solid #ffd54f;
    border-radius:3px; font-weight:600; color:#5a4500;
}
.mp-chk-strong:hover span { color:#5a4500; }

/* 지역제한 안내 박스 */
.mp-area-help {
    margin-top:8px; padding:9px 12px;
    background:#f7f9fc; border:1px solid #d6dfeb; border-radius:3px;
    font-size:11.5px; color:#3a5a82; line-height:1.7;
}
.mp-area-help dt { display:inline-block; min-width:80px; font-weight:700; color:#1a3f74; }
.mp-area-help dd { display:inline; margin:0; color:#3a5a82; }
.mp-area-help dl { margin:0; padding:0; }
.mp-area-help dl + dl { margin-top:2px; }

/* 푸터 - sticky */
.mp-foot {
    position:fixed; left:0; right:0; bottom:0;
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 20px;
    background:#fafbfd; border-top:1px solid #d8dde6;
    z-index:50;
    box-shadow:0 -2px 6px rgba(20,50,100,0.06);
}
.mp-foot-left, .mp-foot-right { display:flex; gap:6px; }
.mp-foot .mp-btn { margin:0; }

/* 좁은 창 대응 */
@media screen and (max-width:720px) {
    body { padding-bottom:100px; }
    .mp-steps { flex-wrap:wrap; }
    .mp-steps li { flex:1 1 33.333%; }
    .mp-steps li:after { display:none; }
    .mp-step-label { display:none; }
    .mp-col { height:170px; }
    .mp-input-md { width:auto; max-width:100%; }
    .mp-tbl th, .mp-tbl td { padding:8px; font-size:12px; }
    .mp-btn.mp-btn-lg { min-width:80px; padding:7px 12px; font-size:12px; }
}