@charset "utf-8";
/* ============================================================
   master 레이아웃 (2026 리뉴얼)
   - 좌측 네비 유지 + 현대화, 데스크톱 전용
   - id/구조(#container #leftZone #topArea #leftNav #rightZone #footer) 보존
   ============================================================ */

html,body{ width:100%; min-height:100%; margin:0; padding:0; background:#fff; }

/* 클릭/포커스 시 검은 테두리(기본 outline) 제거 — 상단메뉴·로고·좌측메뉴·다운로드버튼·목록행 */
#topNav a:focus, #leftNav a:focus, #leftNav span:focus,
#leftDownloadBtns a:focus, #rightZone tr:focus, #rightZone a.btn:focus{ outline:none; box-shadow:none; }

/* ===================== 상단 메뉴바 = user 헤더 (게시판/업무관리 + 로그아웃, 로고는 좌측 카드로) ===================== */
#topNav{ width:100%; background:#fff; border-bottom:1px solid var(--m-border-soft);
  box-shadow:0 0 12px 0 rgba(0,0,0,.06); position:relative; z-index:50; min-width:1180px; }
#topNav .topNav-inner{ width:100%; max-width:1600px; height:84px; margin:0 auto; padding:0 2rem;
  display:flex; align-items:center; justify-content:space-between; gap:3rem; box-sizing:border-box; }
/* 로고 — 좌측, 세로 중앙 */
/* [조정] 로고 세로 위치: margin-top 값 키우면 아래로, 0이면 정중앙. (31→32: 살짝 아래로) */
#topNav .topNav-logo{ flex:0 0 auto; margin:0; display:flex; align-items:center; margin-top:6px; }
#topNav .topNav-logo img{ width:280px; height:auto; display:block; }
/* 가로 메뉴 — 가운데 정렬, 간격 넓게 */
#topNav .topNav-gnb{ flex:1 1 auto; }
/* [조정] 게시판·업무관리 메뉴 간격: gap 값 키우면 더 넓게 (user는 10rem) */
#topNav .topNav-gnb > ul{ display:flex; align-items:stretch; justify-content:center; gap:10rem;
  height:84px; margin:0; padding:0; }
#topNav .topNav-gnb > ul > li{ position:relative; display:flex; align-items:center; }
#topNav .topNav-gnb > ul > li > a{ display:flex; align-items:center; height:100%;
  font-size:1.2rem; font-weight:700; color:var(--m-text); }
#topNav .topNav-gnb > ul > li > a:hover{ color:var(--m-nav); text-decoration:none;  }
/* 전폭 흰 드롭 패널 (메가메뉴 배경) */
/* border-top: 로고/메뉴 행 바로 아래 가로 구분선 (user 헤더 hover 시 선과 동일) */
#topNav .topNav-dropPanel{ position:absolute; left:0; top:100%; width:100%; height:0; background:#fff;
  border-top:1px solid var(--m-border-soft); border-bottom:1px solid var(--m-border-soft);
  box-shadow:0 12px 18px rgba(0,0,0,.06);
  opacity:0; visibility:hidden; transition:opacity .15s; z-index:55; }
/* [조정] 드롭패널 높이: 하위메뉴는 absolute라 패널을 밀지 못함 → 여기 min-height로 직접 맞춤.
   업무관리 4항목(심사위원 정보까지) 다 담기게 240px. 항목 늘면 값 키울 것. (user 원본은 300px) */
#topNav:has(.topNav-gnb:hover) .topNav-dropPanel{ height:auto; min-height:240px; opacity:1; visibility:visible; }
/* 하위 메뉴 — 라벨 아래 좌측정렬 컬럼 (hover 시 모든 컬럼 표시 = user 메가메뉴) */
#topNav .topNav-sub{ position:absolute; top:100%; left:0; min-width:170px; padding:1.5rem 0;
  background:transparent; border:none; box-shadow:none; text-align:left;
  opacity:0; visibility:hidden; transition:opacity .15s; z-index:60; }
#topNav .topNav-gnb:hover .topNav-sub{ opacity:1; visibility:visible; }
#topNav .topNav-sub li a{ display:block; padding:0.6rem 0.4rem; font-size:1rem; font-weight:500;
  color:var(--m-text-sub); white-space:nowrap; text-align:left; }
#topNav .topNav-sub li a:hover{ color:var(--m-nav); text-decoration:none; font-weight:600; }
/* 우측 로그아웃 */
#topNav .topNav-right{ flex:0 0 auto; display:flex; align-items:center; gap:0.5rem; }
#topNav .topNav-auth{ font-size:0.95rem; font-weight:600; color:var(--m-text-sub); }
#topNav .topNav-auth:hover{ color:var(--m-nav-dark); text-decoration:none;}

/* container : 좌측 네비 + 우측 콘텐츠 (flex)
   - [좌측카드 + 콘텐츠] 단위를 페이지 중앙으로 정렬 (max-width + margin auto)
   - align-items:flex-start → 좌측을 카드(높이 auto)로, 전체높이 레일 해제 */
/* container = user .content-wrap (max 1600, gap 6rem, 중앙 정렬) */
#container{ display:flex; align-items:flex-start; justify-content:space-between; gap:6rem;
  min-width:1180px; max-width:1600px; margin:0 auto; padding:2.5rem 2rem 4rem;
  min-height:calc(100vh - 200px); box-sizing:border-box; }

/* ===================== 좌측 영역 = user .sidenav-wrap ===================== */
#leftZone{ flex:0 0 18rem; width:18rem; background:transparent; color:var(--m-text); }

/* 로고 + 로그아웃 — 카드 위 투명 헤더 (user는 상단바에 로고, master는 좌측 상단) */
#topArea{ width:100%; height:auto; padding:0 0 1.5rem; background:transparent; text-align:center;
  border:none; border-radius:0; box-shadow:none; margin:0; box-sizing:border-box; }
#topArea h1{ display:block; margin:0 auto; padding:0; width:auto; height:auto; }
#topArea h1 img{ width:160px; height:auto; }
#topArea ul{ display:block; width:auto; height:auto; margin:0.75rem auto 0; text-align:center; }
#topArea ul li{ display:inline; margin:0; padding:0; }
#topArea ul li a,
#topArea ul li a:link,
#topArea ul li a:visited{ color:var(--m-text-sub); font-size:0.95rem; font-weight:600; }
#topArea ul li a:hover{ color:var(--m-nav-dark); }

/* 좌측 네비 = user .sidenav (둥근 카드 / blue 헤더 / hover 슬라이드 / active 채움) */
#leftNav{ width:100%; padding:0; border-radius:10px; overflow:hidden; background:#e7e7e7; box-shadow:none; }
#leftNav > ul > li{ display:block; width:100%; }
/* 그룹 헤더 = .sidenav h2 */
#leftNav ul li span{ display:block; position:relative; width:100%; height:auto; line-height:1.4;
  padding:1.1rem 1.6rem 1.1rem 2.2rem; font-size:1.25rem; font-weight:700; color:#fff; cursor:pointer;
  background:var(--m-nav); border-bottom:1px solid #CACACA; box-sizing:border-box; }
#leftNav ul li span:before{ display:none; }
#leftNav ul li span:hover{ background:var(--m-nav); }
/* 하위 메뉴 = .sidenav ul li (연회색 바탕) */
#leftNav ul li ul{ width:100%; padding:0; background:#e7e7e7; }
#leftNav ul li ul li{ position:relative; width:100%; height:3.4rem; line-height:3.4rem;
  padding:0 1.6rem 0 2.2rem; overflow:hidden; box-sizing:border-box; }
/* hover 슬라이드 인 (scaleX, user .sidenav li::before) */
#leftNav ul li ul li:before{ content:''; position:absolute; top:0; left:0; width:100%; height:100%;
  background:var(--m-nav-dark); transform:scaleX(0); transform-origin:left center; transition:all .35s ease; z-index:0; }
#leftNav ul li ul li:hover:before{ transform:scaleX(1); }
#leftNav ul li ul li a{ position:relative; z-index:1; display:block; width:100%; padding:0; border:none;
  color:var(--m-text-sub); font-size:1rem; font-weight:400; text-decoration:none; transition:color .2s; }
#leftNav ul li ul li:hover a{ color:#fff; font-weight:500; }
/* active = 파란 채움 + 흰 글자 (master JS는 a.active 부여) */
#leftNav a.on,
#leftNav a.active{ color:#fff !important; font-weight:600; }
#leftNav ul li ul li:has(a.active):before{ transform:scaleX(1); }
/* active/hover 아이콘 = user 동일 (좌측 흰 바 + 우측 화살표 원) */
#leftNav ul li ul li a:before{ content:''; position:absolute; left:-1.4rem; top:50%; transform:translateY(-50%);
  width:4px; height:40%; background:#fff; opacity:0; transition:opacity .2s; }
#leftNav ul li ul li a:after{ content:'\2192'; position:absolute; right:-0.4rem; top:50%; transform:translateY(-50%);
  width:1.5rem; height:1.5rem; line-height:1.5rem; text-align:center; border-radius:50%;
  background:#fff; color:var(--m-nav-dark); font-size:0.8rem; font-weight:700; opacity:0; transition:opacity .2s; }
#leftNav ul li ul li:hover a:before,
#leftNav ul li ul li:hover a:after,
#leftNav a.active:before,
#leftNav a.active:after{ opacity:1; }

/* 서식 다운로드 버튼 = user .sidenav-btn(진파랑) / .side-btn(민트, is-link) */
#leftDownloadBtns{ display:flex; flex-direction:column; gap:0.85rem; margin-top:1.25rem; padding:0; }
/* 버튼 4개 모두 민트(user .side-btn) 톤으로 통일 */
#leftDownloadBtns .dl-btn{ display:flex; align-items:center; justify-content:center; gap:0.6rem;
  width:100%; min-height:3.4rem; padding:0.9rem 0.75rem; box-sizing:border-box;
  background:#eafbfa; border:1.25px solid #44b0a7; border-radius:10px; color:#44b0a7; font-size:0.95rem; font-weight:700;
  line-height:1.35; text-align:center; text-decoration:none; cursor:pointer; box-shadow:none;
  transition:background .3s ease, color .3s ease; }
#leftDownloadBtns .dl-btn:hover{ background:#d9f7f5; color:#44b0a7; }
#leftDownloadBtns .dl-btn:before{ display:none; }

/* ===================== 우측 콘텐츠 ===================== */
#rightZone{ flex:1 1 auto; min-width:0; width:auto; min-height:auto;
  margin:0; padding:0; overflow-x:auto; }

/* 콘텐츠 카드 — 폭 채우되 상한 유지(무한 확장 방지) */
#rightZone .right{ display:block; float:none; width:100%; max-width:1180px;
  background:var(--m-surface); border:1px solid var(--m-border-soft);
  border-radius:var(--m-radius-lg); box-shadow:var(--m-shadow-md); padding:28px 32px; box-sizing:border-box; }
#rightZone .right dl, #rightZone .right dd{ display:block; float:none; width:100%; }
/* 카드 내부 float(목록/수정 버튼 등) 포함 → 카드 밖으로 삐져나오지 않게 */
#rightZone .right:after{ content:''; display:block; clear:both; }
#rightZone .right dd:after{ content:''; display:block; clear:both; }

/* 버튼 영역(목록/수정 등) — 테이블과 간격 + 아래 여백 */
#rightZone .right dd > p.fr,
#rightZone .right dd > p.fl{ padding:16px 0 8px; }
#rightZone .right dd > p.fr a.btn,
#rightZone .right dd > p.fl a.btn{ float:none; }

/* 페이지 타이틀 */
#rightZone .right dd.tit{ display:block; padding:0 0 20px; margin-bottom:20px;
  border-bottom:2px solid #eef1f5; }
#rightZone .right dd.tit p{ display:block; height:auto; text-indent:0; background:none; line-height:1.6; }
#rightZone .right dd.tit p.title{ color:var(--m-primary); font-weight:700; font-size:13px; padding:0; background:none; }
#rightZone .right dd.tit p.last_date{ float:right; margin-top:8px; background:none; font-size:12px; color:var(--m-text-mute); }
#rightZone .right h2{ display:block; font-size:1.75rem; line-height:1.4; margin:0; padding:0;
  font-weight:700; letter-spacing:-.5px; color:var(--m-text); width:100%; height:auto; }
#rightZone .right h3{ display:block; position:relative; font-size:15px; margin:24px 0 0; padding:0 0 0 14px;
  line-height:1.5; font-weight:700; letter-spacing:-.3px; color:var(--m-text-sub); height:auto;
  background:none; text-indent:0; }
#rightZone .right dd.tit h3{ position:relative; margin-top:8px; padding-left:16px;
  color:var(--m-text-sub); font-weight:600; font-size:14px; }
#rightZone .right h3:before{ content:''; position:absolute; left:0; top:5px; width:5px; height:14px;
  border-radius:2px; background:var(--m-nav); }
/* 페이지 부제목 앞 아이콘(점) */
#rightZone .right dd.tit h3:before{ left:0; top:50%; transform:translateY(-50%);
  width:7px; height:7px; border-radius:50%; background:var(--m-primary); }
#rightZone .right h4{ font-size:14px; margin:0; padding:0; line-height:1.6; font-weight:700;
  letter-spacing:-.3px; color:var(--m-text-sub); height:auto; }
#rightZone .right h4 span{ font-size:12px; padding-right:5px; }

/* ===================== 푸터 = user .footer (좌 시스템안내 / 우 로고+주소) ===================== */
/* 바깥 #footer = 전폭 보더/배경, 안쪽 <footer> = 중앙 정렬 flex 행 */
#footer{ clear:both; position:relative; display:block; width:100%; min-width:1180px; height:auto;
  margin:0; padding:0; border-top:1px solid #D4D4D4; background:#fff; box-sizing:border-box; }
#footer > footer{ display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap;
  gap:1rem 2rem; width:100%; max-width:1600px; margin:0 auto; padding:2rem 2rem 2.5rem; box-sizing:border-box; }
/* 우측 그룹 = user .footer-right (로고 2개 위 / 연락처·주소 아래, 우측 정렬 컬럼) */
#footer .foot-right{ display:flex; flex-direction:column; align-items:flex-end; gap:1.5rem; text-align:right; }
#footer .foot-right .logo_btm{ display:flex; align-items:center; justify-content:flex-end; gap:2rem; }
#footer .foot-right .logo_btm img{ width:130px; height:35px; object-fit:contain; }
#footer .foot-right .com_info{ text-align:right; font-size:0.875rem; font-weight:500; color:#6B6B6B; }
#footer .foot-right .com_info ul{ display:flex; align-items:center; justify-content:flex-end; gap:2rem; }
#footer .foot-right .com_info ul li{ list-style:none; }
#footer .foot-right .com_info ul li span{ margin-left:0.75rem; color:#2B2B2B; }
#footer .foot-right .com_info .address{ margin-top:0.5rem; }

/* 시스템 지원안내 = user .footer-left (좌측, [라벨|값] 2행, 동일 폰트) */
#leftSystemInfo{ position:static; display:inline-block; float:none; vertical-align:top;
  width:auto; height:auto; padding:0; box-sizing:border-box; background:none; color:#6B6B6B; }
#leftSystemInfo ul{ display:flex; flex-direction:column; gap:0.5rem; margin:0; padding:0; width:auto; }
#leftSystemInfo ul li{ display:flex; align-items:center; gap:1.5rem; margin:0; padding:0;
  background:none; font-size:0.875rem; font-weight:500; line-height:1.6; }
#leftSystemInfo ul li .lbl{ flex:0 0 auto; width:7rem; color:#6B6B6B; font-weight:500; }
#leftSystemInfo ul li .val{ color:#2B2B2B; font-weight:500; }
#leftSystemInfo ul li a,
#leftSystemInfo ul li a:link,
#leftSystemInfo ul li a:visited{ color:var(--m-text-mute); }
#leftSystemInfo ul li a:hover{ color:var(--m-nav-dark); }

/* ===================== 검색 상단 영역 ===================== */
#rightZone .right .srch_Area{ position:relative; display:block; float:none; margin:0; padding:14px 0;
  width:100%; min-height:auto; border:none; border-radius:0;
  background:transparent; box-sizing:border-box; overflow:hidden; }
#rightZone .right .srch_Area li{ display:block; float:left; width:auto; min-width:160px; height:auto;
  margin:5px 10px; padding:0; text-align:center; }
#rightZone .right .srch_Area .off{ display:block; padding:7px 12px; border:1px solid var(--m-border);
  border-radius:var(--m-radius); background:#fff !important; color:var(--m-text-sub) !important; }
#rightZone .right .srch_Area .on{ display:block; padding:7px 12px; border:1px solid var(--m-primary);
  border-radius:var(--m-radius); background:var(--m-primary) !important; color:#fff !important; font-weight:700; }

/* ===================== 로그인 화면 (27.png — 타이틀 중앙·확대, 폼 넓게) ===================== */
/* 로그인 페이지: 바깥 .right 카드 제거 → 타이틀은 테두리 없이 평면 */
/* [조정] 로그인 블록(타이틀+폼) 전체 위치 (31→32: 우측 치우침 → 가운데로 + 아래로)
   - left:-6rem: 좌측 메뉴 때문에 우측 치우침 보정. 음수 더 키우면 더 왼쪽(가운데)으로
   - padding 위쪽 3rem: 값 키우면 블록 전체가 더 아래로 (타이틀·폼 같이 이동) */
.right:has(#exLoinBox){ position:relative; left:-6rem; border:none; box-shadow:none; background:transparent; padding:1.5rem 0 2.5rem; }
/* 로그인 전용 타이틀: 중앙 정렬 + 확대 + 밑줄 제거 */
.right:has(#exLoinBox) dd.tit{ border-bottom:none; text-align:center; padding-bottom:8px; margin-bottom:8px; }
.right:has(#exLoinBox) dd.tit h2{ font-size:2rem; text-align:center; }
/* [조정] 폼만 아래로: 위 margin 값 키우면 타이틀과 폼 간격 넓어짐(폼 더 아래) */
#exLoinBox{ margin:50px auto 0; width:100%; max-width:600px; height:auto; }
/* 폼만 흰 카드 (테두리+그림자, user .login-wrap 동일) — 이름~로그인 버튼 */
#exLoinBox .loginFrom{ display:block; margin:0; padding:2.75rem 2.5rem 2.25rem; float:none; width:100%; height:auto;
  background:#fff; border:1px solid var(--m-border-soft); border-radius:10px;
  box-shadow:0 0 20px 0 rgba(0,0,0,.1); box-sizing:border-box; }
/* 입력 행: 라벨(위) + 입력칸(전폭) + 안내문구(아래) */
#exLoinBox .loginFrom dd{ display:block; margin:0 0 18px; padding:0; width:100%; }
#exLoinBox .loginFrom dd > label{ display:block; width:auto; margin:0 0 8px; font-weight:700;
  color:var(--m-text); font-size:14px; }
#exLoinBox .loginFrom dd > input,
#exLoinBox .loginFrom dd .auth-row input{ display:block; width:100%; height:44px;
  border:1px solid var(--m-border); border-radius:var(--m-radius); font-size:14px; }
#exLoinBox .loginFrom dd .guide{ display:block; margin:6px 0 0; padding:0; font-size:12px;
  color:var(--m-text-mute); white-space:normal; }
#exLoinBox .loginFrom dd .guide:before{ content:none; }
/* 인증코드: 입력칸 + 요청버튼 한 줄 */
#exLoinBox .loginFrom dd .auth-row{ display:flex; gap:8px; align-items:stretch; }
#exLoinBox .loginFrom dd .auth-row input{ flex:1 1 auto; }
#exLoinBox .loginFrom dd .auth-row .btn{ flex:0 0 auto; white-space:nowrap; height:44px;
  display:inline-flex; align-items:center; }
/* 안내문 — 카드 밖, 하단. 각 줄 줄바꿈 방지(nowrap) */
#exLoinBox .login-guide{ display:block; margin:36px 0 0; padding:14px 16px;
  background:var(--m-primary-soft); border:1px solid #d7e7f5; border-radius:var(--m-radius);
  font-size:13px; letter-spacing:-.5px; color:var(--m-text-sub); line-height:2; white-space:nowrap; }
/* 로그인 버튼 (전폭) */
#exLoinBox .loginFrom dd.alignTxt{ display:block; margin:0; padding-top:24px; }
#exLoinBox .loginFrom dd.alignTxt .btn{ display:block; width:100%; padding:14px 0; font-size:15px;
  background:#1E75E0 !important; border:1px solid #1E75E0 !important; color:#fff !important;
  border-radius:10px; font-weight:600; }
#exLoinBox .loginFrom dd.alignTxt .btn:hover{ background:#1a60b5 !important; border-color:#1a60b5 !important; }

/* gbox_set (로그인 박스) */
dl.gbox_set{ display:block; margin:0; padding:30px; border:1px solid var(--m-border-soft);
  border-radius:var(--m-radius); background:#f8fafc; overflow:hidden; text-align:center; }
dl.gbox_set dd{ display:block; }
dl.gbox_set dd.sel label{ font-weight:normal; color:var(--m-text); }
dl.gbox_set dd.sel input{ border:none; }
dl.gbox_set dd.field{ display:inline-block; float:none; margin:15px auto 0; width:auto; max-width:440px; text-align:left; }
dl.gbox_set dd.field p{ margin-bottom:10px; }
dl.gbox_set dd.field label{ display:inline-block; float:none; margin:0 8px 0 0; width:100px; text-align:right;
  font-weight:700; color:var(--m-text); }
dl.gbox_set dd.field label.error{ float:none; width:100%; color:#e02323; }
dl.gbox_set dd.field input{ height:36px; padding:0 10px; color:var(--m-text); }
dl.gbox_set dd.field_btn{ float:none; margin-top:20px; width:auto; height:auto; }

#fieldBtn_zone{ clear:both; width:100%; height:auto; padding-top:18px; text-align:center; }
#loginForm{ width:100%; }