@charset "utf-8";
/**
 * 고준위위원회 행정정보시스템 화면 PoC — 보조 스타일
 *
 * 원본(css_2021/*.css)은 무수정. 이 파일만 뒤에 얹어
 *  ① 발주처 브랜딩(로고 텍스트화)  ② 안건 전주기 상태 뱃지  ③ D-14/7/5 기한 표시
 * 를 추가한다. 색상은 원본 토큰(#3c5e9e / #254787 / #628bd7 / #3468af / #cdcece)만 사용.
 */

/** ── 로고 : 참조소스의 산업부 로고 이미지 대신 텍스트 브랜딩 ── */
h1.poc_logo{position:absolute;top:18px;left:20px;width:auto;height:auto;}
h1.poc_logo a{display:block;height:auto;text-indent:0;background:none;padding-left:44px;position:relative;}
h1.poc_logo a:before{content:'';position:absolute;top:2px;left:0;width:34px;height:34px;border-radius:6px;
  background:#254787;box-shadow:inset 0 0 0 3px #628bd7;}
h1.poc_logo a:after{content:'高';position:absolute;top:2px;left:0;width:34px;height:34px;line-height:34px;
  text-align:center;color:#fff;font-size:17px;font-weight:600;}
h1.poc_logo em{display:block;line-height:20px;color:#204996;font-size:18px;font-weight:600;letter-spacing:-1px;}
h1.poc_logo span{display:block;line-height:15px;color:#7e7e7e;font-size:12px;letter-spacing:-0.5px;}

/** ── 프로필 사진 자리 : 이미지 대신 이니셜 ── */
.profile .photo i.poc_photo{display:flex;justify-content:center;align-items:center;width:70px;height:70px;
  margin-bottom:10px;border-radius:50%;background:#628bd7;color:#fff;font-size:28px;font-weight:600;}

/** ── 마이메시지 바 : 원본은 산업부 항목 수(6종)에 맞춘 고정폭이라 폭 재계산 ── */
.my_message .info_message{width:auto;flex:1 1 auto;}
.my_message .info_access{width:auto;flex:0 0 auto;min-width:270px;}
.my_message .info_access span{margin-left:20px;}

/** ── 우측 퀵메뉴 : 2줄 라벨 정렬 ── */
.my_menu_lst > li:nth-child(-n+3) > a i{line-height:17px;font-size:13px;}

/** ── 목록 테이블 : 컬럼이 많아 원본 20px 좌우 여백을 10px로 (원본 .td10 규칙과 동일) ── */
.wrap_tbl.bd_tbl_lst * > tr > *{padding-left:10px;padding-right:10px;}
.poc_nw{white-space:nowrap;}

/** ── 안건 전주기 상태 뱃지 (7단계 + 반려) ── */
.poc_st{display:inline-flex;align-items:center;min-width:72px;height:22px;padding:0 9px 0 4px;
  line-height:22px;font-size:12px;font-weight:500;border-radius:11px;color:#fff;letter-spacing:-0.5px;
  white-space:nowrap;}
.poc_st em{display:inline-flex;justify-content:center;align-items:center;width:16px;height:16px;margin-right:5px;
  border-radius:50%;background:rgba(255,255,255,.28);font-size:11px;font-weight:600;}
.st_draft  {background:#a0a5ad;}
.st_submit {background:#628bd7;}
.st_receive{background:#3468af;}
.st_return {background:#c95a3c;}
.st_sched  {background:#3c5e9e;}
.st_disp   {background:#254787;}
.st_resolve{background:#49a888;}
.st_public {background:#4c5067;}

/** ── 의결 결과 뱃지 (원안·수정·부결·보류·가부동수) ── */
.poc_rs{display:inline-block;min-width:56px;height:22px;padding:0 8px;line-height:20px;font-size:12px;
  font-weight:500;text-align:center;border-radius:3px;border:1px solid;white-space:nowrap;}
.rs_ok  {color:#1c6b52;border-color:#49a888;background:#eef8f4;}
.rs_mod {color:#1d5cb1;border-color:#628bd7;background:#eef3fc;}
.rs_no  {color:#b03024;border-color:#d98a80;background:#fdf1ef;}
.rs_hold{color:#8a6100;border-color:#e0b45c;background:#fdf7e9;}
.rs_tie {color:#4c5067;border-color:#a9adba;background:#f2f3f5;}

/** ── 회차 상태 뱃지 ── */
.poc_rd{display:inline-block;min-width:48px;height:22px;padding:0 10px;line-height:20px;font-size:12px;
  font-weight:500;text-align:center;border-radius:11px;border:1px solid;}
.rd_ready{color:#1d5cb1;border-color:#628bd7;background:#eef3fc;}
.rd_run  {color:#fff;border-color:#3c5e9e;background:#3c5e9e;}
.rd_end  {color:#7e7e7e;border-color:#cdcece;background:#f7f7f7;}

/** ── 법정기한 D-day 뱃지 ── */
.poc_dday{display:inline-block;min-width:56px;height:24px;padding:0 10px;line-height:22px;font-size:13px;
  font-weight:600;text-align:center;border-radius:4px;border:1px solid;letter-spacing:0;white-space:nowrap;}
.poc_dday_normal{color:#3468af;border-color:#b9cbe6;background:#eef3fc;}
.poc_dday_urgent{color:#fff;border-color:#d4740f;background:#ec8320;}
.poc_dday_over  {color:#fff;border-color:#b03024;background:#c53b2d;}
.poc_dday_done  {color:#1c6b52;border-color:#9dd3c1;background:#eef8f4;}

/** ── 기한 카드 (일정·기한 현황 / 대시보드) ── */
.poc_dl_cards{display:flex;flex-wrap:wrap;margin-left:-15px;}
.poc_dl_cards > li{width:calc(100%/3 - 15px);margin:0 0 15px 15px;padding:18px 20px;border:1px solid #e0e0e0;
  border-radius:6px;background:#fff;box-shadow:0 0 10px rgba(0,0,0,.04);}
.poc_dl_cards > li.is_urgent{border-color:#ec8320;background:#fffaf4;}
.poc_dl_cards > li.is_over{border-color:#c53b2d;background:#fdf4f3;}
.poc_dl_cards > li.is_done{border-color:#9dd3c1;background:#f7fcfa;}
.poc_dl_cards .dl_head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.poc_dl_cards .dl_name{color:#222;font-size:16px;font-weight:500;}
.poc_dl_cards .dl_meta{display:block;margin-top:4px;color:#7e7e7e;font-size:13px;}
.poc_dl_cards .dl_bar{position:relative;height:6px;margin-top:12px;border-radius:3px;background:#eef1f6;overflow:hidden;}
.poc_dl_cards .dl_bar i{display:block;height:100%;border-radius:3px;background:#3c5e9e;}
.poc_dl_cards .dl_cnt{margin-top:6px;color:#555;font-size:13px;}

/** ── 통계 타일 (메인 대시보드) ── */
.poc_tiles{display:flex;flex-wrap:wrap;margin-left:-12px;}
.poc_tiles > li{width:calc(100%/7 - 12px);margin:0 0 12px 12px;}
.poc_tiles > li a{display:block;padding:16px 14px;border:1px solid #e0e0e0;border-radius:6px;background:#fff;
  text-align:center;box-shadow:0 0 10px rgba(0,0,0,.04);}
.poc_tiles > li a:hover{border-color:#31518d;background:#3c5e9e;}
.poc_tiles > li a:hover *{color:#fff !important;}
.poc_tiles .t_num{display:block;color:#254787;font-size:26px;font-weight:600;line-height:32px;letter-spacing:-1px;}
.poc_tiles .t_lbl{display:block;margin-top:2px;color:#555;font-size:13px;}
.poc_tiles .t_step{display:block;margin-bottom:4px;color:#9aa0aa;font-size:11px;}

/** ── 안건 전주기 진행 표시 (상세 화면 상단) ── */
.poc_flow{display:flex;margin:0 0 20px;padding:18px 20px;border:1px solid #e0e0e0;border-radius:6px;background:#fafbfd;}
.poc_flow > li{position:relative;flex:1;text-align:center;}
.poc_flow > li:before{content:'';position:absolute;top:13px;left:-50%;width:100%;height:2px;background:#dfe3ea;z-index:0;}
.poc_flow > li:first-child:before{display:none;}
.poc_flow > li.done:before{background:#3c5e9e;}
.poc_flow .fl_dot{position:relative;display:inline-flex;justify-content:center;align-items:center;width:28px;height:28px;
  border-radius:50%;background:#dfe3ea;color:#fff;font-size:13px;font-weight:600;z-index:1;}
.poc_flow > li.done .fl_dot{background:#3c5e9e;}
.poc_flow > li.cur .fl_dot{background:#ec8320;box-shadow:0 0 0 4px rgba(236,131,32,.2);}
.poc_flow > li.ret .fl_dot{background:#c95a3c;}
.poc_flow .fl_lbl{display:block;margin-top:7px;color:#7e7e7e;font-size:13px;}
.poc_flow > li.done .fl_lbl,.poc_flow > li.cur .fl_lbl{color:#222;font-weight:500;}
.poc_flow .fl_sub{display:block;color:#a8adb6;font-size:11px;letter-spacing:-0.5px;}

/** ── 타임라인 (상태 이력) ── */
.poc_timeline{position:relative;padding-left:22px;}
.poc_timeline:before{content:'';position:absolute;top:6px;left:5px;width:2px;height:calc(100% - 12px);background:#dfe3ea;}
.poc_timeline > li{position:relative;padding:0 0 20px;}
.poc_timeline > li:last-child{padding-bottom:0;}
.poc_timeline > li:before{content:'';position:absolute;top:5px;left:-22px;width:12px;height:12px;border-radius:50%;
  border:2px solid #fff;background:#3c5e9e;box-shadow:0 0 0 1px #cdd4e0;}
.poc_timeline .tl_at{display:inline-block;min-width:130px;color:#7e7e7e;font-size:13px;}
.poc_timeline .tl_ev{color:#222;font-weight:500;}
.poc_timeline .tl_actor{margin-left:8px;color:#3468af;font-size:13px;}
.poc_timeline .tl_note{display:block;margin-top:3px;padding-left:130px;color:#666;font-size:13px;}

/** ── 근거 조문 표기 ── */
.poc_ref{display:inline-block;margin-left:6px;padding:1px 7px;line-height:17px;color:#3468af;font-size:12px;
  border:1px solid #cddaee;border-radius:3px;background:#f4f8fd;letter-spacing:-0.5px;vertical-align:middle;}

/** ── 필수 표시 ── */
.poc_req{color:#e41e1e;font-weight:500;padding-left:2px;}

/** ── PoC 고지 배너 ── */
.poc_notice{display:flex;align-items:center;margin:0 0 15px;padding:9px 15px;border-radius:4px;
  border:1px dashed #b9c4d6;background:#f4f7fc;}
.poc_notice strong{margin-right:10px;padding:1px 9px;line-height:18px;color:#fff;font-size:12px;font-weight:500;
  border-radius:9px;background:#4c5067;}
.poc_notice span{color:#5a6472;font-size:13px;line-height:18px;}

/** ── 표결 현황 ── */
.poc_vote_sum{display:flex;margin:0 0 15px;border:1px solid #cdcece;border-radius:6px;overflow:hidden;}
.poc_vote_sum > li{flex:1;padding:14px 10px;text-align:center;border-left:1px solid #e6e6e6;}
.poc_vote_sum > li:first-child{border-left:0;background:#f7f7f7;}
.poc_vote_sum .v_lbl{display:block;color:#7e7e7e;font-size:13px;}
.poc_vote_sum .v_num{display:block;margin-top:2px;color:#254787;font-size:22px;font-weight:600;line-height:28px;}
.poc_vote_sum .v_num.warn{color:#c53b2d;}

/** ── 외부 위원 포털 (DMZ) ── */
.ext_body{background:#eef1f6;}
.ext_wrap{min-height:100vh;}
.ext_header{height:64px;background:#fff;border-bottom:1px solid #dde2ea;}
.ext_header .inner{display:flex;justify-content:space-between;align-items:center;height:100%;
  max-width:1180px;margin:0 auto;padding:0 20px;}
.ext_logo{display:flex;align-items:center;}
.ext_logo b{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:10px;
  border-radius:6px;background:#254787;color:#fff;font-size:16px;font-weight:600;}
.ext_logo em{color:#204996;font-size:17px;font-weight:600;letter-spacing:-1px;}
.ext_logo span{margin-left:8px;padding-left:9px;border-left:1px solid #d5dae2;color:#7e7e7e;font-size:13px;}
.ext_nav{display:flex;}
.ext_nav a{position:relative;padding:0 16px;line-height:63px;color:#555;font-size:15px;}
.ext_nav a.on{color:#254787;font-weight:500;}
.ext_nav a.on:after{content:'';position:absolute;bottom:-1px;left:16px;right:16px;height:2px;background:#254787;}
.ext_user{display:flex;align-items:center;color:#555;font-size:13px;}
.ext_user b{color:#222;font-weight:500;}
.ext_user .btn{margin-left:12px;}
.ext_main{max-width:1180px;margin:0 auto;padding:26px 20px 60px;}
/* 원본 layout.css의 h2는 숨김 처리(text-indent:-9999px)이므로 되돌린다 */
h2.ext_ttl{position:static;width:auto;height:auto;padding:0 0 16px;color:#222;font-size:24px;
  font-weight:500;line-height:30px;text-indent:0;}
.ext_card{margin-bottom:20px;padding:24px 26px;border-radius:10px;background:#fff;box-shadow:0 1px 8px rgba(0,0,0,.05);}
.ext_scope{display:inline-flex;align-items:center;margin-left:10px;padding:2px 10px;line-height:18px;
  color:#1c6b52;font-size:12px;border:1px solid #9dd3c1;border-radius:10px;background:#eef8f4;vertical-align:middle;}

/** ── 간편인증 선택 ── */
.poc_easy{display:flex;margin:0 -5px;}
.poc_easy > li{flex:1;padding:0 5px;}
.poc_easy button{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:82px;
  border:1px solid #d8dde5;border-radius:8px;background:#fff;transition:all .15s;}
.poc_easy button:hover{border-color:#254787;box-shadow:0 2px 10px rgba(37,71,135,.15);}
.poc_easy button i{display:flex;justify-content:center;align-items:center;width:34px;height:34px;margin-bottom:7px;
  border-radius:50%;color:#fff;font-size:14px;font-weight:600;}
.poc_easy button span{color:#333;font-size:14px;}
.poc_easy .ic_naver{background:#03c75a;}
.poc_easy .ic_kakao{background:#fee500;color:#3c1e1e !important;}
.poc_easy .ic_pass{background:#e6003c;}

/** ── 로그인 화면 보조 ── */
.lg_banner_poc{display:flex;flex-direction:column;justify-content:center;width:454px;padding:40px;
  border-right:1px dotted #c8c9ca;background:linear-gradient(160deg,#254787 0%,#3c5e9e 100%);border-radius:8px 0 0 8px;}
.lg_banner_poc h2{position:static;width:auto;height:auto;text-indent:0;color:#fff;font-size:26px;font-weight:600;
  line-height:36px;letter-spacing:-1px;}
.lg_banner_poc p{margin-top:14px;color:#c7d6ef;font-size:14px;line-height:22px;}
.lg_banner_poc ul{margin-top:26px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);}
.lg_banner_poc li{position:relative;margin-top:8px;padding-left:14px;color:#e3ebf8;font-size:13px;line-height:20px;}
.lg_banner_poc li:before{content:'';position:absolute;top:9px;left:0;width:4px;height:4px;border-radius:50%;background:#8fb0e6;}
/* 원본은 .lg_form > fieldset > div > * 에 width:100%를 주지만,
   PoC는 탭(내부/외부) 때문에 한 단계 더 중첩되므로 동일 규칙을 다시 적용한다 */
.lg_form .id_pw > *{display:block;width:100%;box-sizing:border-box;}
.lg_form .id_pw button{margin-top:6px;}
.lg_form .lg_pane > ul{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:15px;}
.lg_form .lg_pane > ul li{font-size:14px;color:#555;}

.lg_tab{display:flex;margin-bottom:22px;border-bottom:1px solid #dfdfdf;}
.lg_tab li{flex:1;}
.lg_tab a{display:block;padding:10px 0;text-align:center;color:#7e7e7e;font-size:16px;}
.lg_tab li.on a{color:#254787;font-weight:500;border-bottom:2px solid #254787;}

/** ── 인쇄/좁은 화면 보정 ── */
@media screen and (max-width:1500px){
  .poc_tiles > li{width:calc(100%/4 - 12px);}
  .poc_dl_cards > li{width:calc(100%/2 - 15px);}
}

/* ── 데모 초기화 링크 (역할 전환 옆) ───────────────── */
#user_panel .profile .m_link a.poc_reset {
    margin-left: 6px;
    color: #8d8d8d;
}
#user_panel .profile .m_link a.poc_reset:hover {
    color: #3c5e9e;
}