/* ══════════════════════════════════════════════════════════════════════
   상세 페이지 배치   (공공채용 / 기업채용 / 정책 상세 공용)
   ----------------------------------------------------------------------
   좌 : 문서 본문(관리자 에디터 HTML) · 우 : 진행상태 + 요약 사이드(sticky)
   본문은 원천에 섹션 분리 컬럼이 없어 rcrutCntnt 한 덩어리로 출력된다.
   ══════════════════════════════════════════════════════════════════════ */

/* ⚠️ 세로 여백은 «반드시» padding-block 롱핸드로 준다 (2026-09-18 · 05 지시 §4-1).
   퍼블 정본은 이 래퍼가 `.jb-container`(padding-inline:20px)와 «같은 요소»에 붙는데,
   shorthand 를 쓰면 그 좌우 여백이 0 으로 덮여 화면에 딱 붙는다.
   dev 는 래퍼가 `containerNew`(width:1260px · margin:0 auto)라 지금은 증상이 없지만
   (실측 — 1440 에서 좌 82.5 / 우 97.5), 운영 흡수 때 `.jb-container` 로 바뀌면 그대로 재현된다.
   정본과 같은 형태로 둔다. */
.jb-detailpage{ padding-block:var(--jb-sp-6) var(--jb-sp-9); }

.jb-detaillayout{ display:grid; grid-template-columns:minmax(0,1fr) var(--jb-detailside-w);
  gap:var(--jb-sp-7); align-items:start; margin-top:var(--jb-sp-4); }

/* 좌 : 문서 카드 → 첨부 → 면책 → 하단 버튼 */
.jb-detailmain{ display:flex; flex-direction:column; gap:var(--jb-sp-4); min-width:0; }
.jb-detaildoc{ border:1px solid var(--jb-border); border-radius:var(--jb-r-card);
  background:var(--jb-surface); overflow:hidden; }
.jb-detailactions{ display:flex; justify-content:center; gap:var(--jb-sp-3); margin-top:var(--jb-sp-4); }

/* 우 : sticky 사이드 */
.jb-detailside{ min-width:0;
  /* ★ sticky 는 «부모 높이» 안에서만 움직인다. `.jb-detaillayout` 이 align-items:start 라
     이 칼럼이 내용 높이로 줄면 움직일 공간이 0 이 돼 그냥 같이 스크롤된다.
     우측만 stretch 로 되돌려 본문 높이만큼 트랙을 준다(05 지시 §3-2).
     ⚠️ 따라갈 거리는 «본문 높이 − 사이드 높이» 다 — 본문이 짧은 공고에서는
        이 규칙이 있어도 거의 움직이지 않는다. 그걸 「sticky 가 안 먹는다」로 보지 않는다. */
  align-self:stretch; }
.jb-detailside__sticky{ position:sticky; top:var(--jb-sp-5); display:grid; gap:var(--jb-sp-4); }

@media (max-width:1024px){
  .jb-detaillayout{ grid-template-columns:1fr; gap:var(--jb-sp-5); }
  .jb-detailside__sticky{ position:static; grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
  .jb-detailpage{ padding-block:var(--jb-sp-5) var(--jb-sp-7); }
  .jb-detailside__sticky{ grid-template-columns:1fr; }
  .jb-detailactions{ flex-direction:column; }
}

/* ══════════════════════════════════════════════════════════════════════
   상세 — 13단계(일자리 지원정책 상세)에서 더한 것만 둔다 (2026-09-16)
   골격 · 문서 카드 · 첨부 · 면책 · 사이드 상태/요약은 확정 디자인 규격이 이미
   components.css 에 있다(.jb-detailhead · .jb-prose · .jb-attach · .jb-disclaimer ·
   .jb-sidestate · .jb-sidesum). 여기서는 정책 상세에만 있는 것을 더한다.
   근거 = 화면설계서 3.3.0 SCR-DPG · 3.4.0 SCR-DPM + 프로토타입 detail-policy-guest/member.html
   모바일 순서(#9) = DOM 이 좌측 본문 → 우측 사이드라 1024 이하에서 한 컬럼으로 쌓으면 그대로 맞는다
   ══════════════════════════════════════════════════════════════════════ */

/* 제목줄 우측 관심 · 알림 (3.3.0 #3 · FR-DETAIL10) */
/* `.jb-detailhead--split` = `:has()` 미지원 브라우저용 같은 규칙 (2026-09-18 D122 · D118 ⑥) — 마크업에서 `__body` 를 쓸 때 함께 붙인다 */
.jb-detailhead--split,
.jb-detailhead:has(> .jb-detailhead__body){ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--jb-sp-4); }
.jb-detailhead__body{ min-width:0; }
.jb-detailhead__acts{ flex:none; display:flex; gap:var(--jb-sp-2); }
/* ▲ D122 §0 — 종전 «전부 flex → __body 없는 헤더만 block(:not(:has))» 를 정본대로 «__body 가 있는(또는 --split) 헤더만 flex» 로 뒤집었다.
     07 처럼 __meta · __title · __date 가 바로 아래인 헤더는 components.css 기본(block) 그대로다 — :has 미지원 브라우저에서도 깨지지 않는다. */

/* 회원 매칭 라벨 (3.4.0 · FR-DETAIL06) — 판정이 아니라 단순 일치 표기다 */
.jb-matchlabel{ display:flex; align-items:center; gap:var(--jb-sp-2); flex-wrap:wrap; margin-bottom:var(--jb-sp-3); }
.jb-matchlabel__badge{ display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:999px;
  background:var(--jb-brand-weak); color:var(--jb-brand); font-size:var(--jb-fs-xs); font-weight:var(--jb-fw-bold); }
.jb-matchlabel__badge .jb-ico{ width:14px; height:14px; }
.jb-matchlabel__reason{ font-size:var(--jb-fs-xs); color:var(--jb-muted); }

/* 포스터 — 좌측 본문 맨 위 (3.3.0 #4 · FR-DETAIL05 구성 순서 ①) */
/* ▼ 13 (2026-09-22 · C1) — 정본 선택자와 같게 «.jb-prose 아래»로. (0,1,0) 이면 components.css 의
   `.jb-prose p{margin:0 0 var(--jb-sp-3)}`(0,1,1) 에 져서 포스터 아래 여백이 20px 가 아니라 10px 로 나온다(로드 순서로는 못 고친다). */
.jb-prose .jb-detailposter{ margin:0 0 var(--jb-sp-5); text-align:center; }
.jb-detailposter img{ max-width:100%; height:auto; border-radius:var(--jb-r-box); }

/* 사이드 요약의 태그 칩 (3.3.0 #10) — ▼ 13 C3 : 정본에 없는 `.jb-sidesum__tags` 규칙을 걷었다.
   배치는 components.css `.jb-sidesum dd ul` 이 이미 같은 값으로 맡는다(중복 규칙은 diff 0 판정을 막는다). */
.jb-sidesum__tag{ cursor:pointer; }

@media (max-width:768px){
  .jb-detailhead--split,
  .jb-detailhead:has(> .jb-detailhead__body){ gap:var(--jb-sp-3); }
}

/* 첨부자료 가로 나열 (3.3.0 #6 · 프로토타입 .attach) — 확정 디자인(공공채용)은 세로 목록이라
   정책 상세에만 한정해서 가로로 둔다. 좁아지면 줄바꿈한다 */
.jb-attach--inline .jb-attach__list{ flex-direction:row; flex-wrap:wrap; gap:var(--jb-sp-2) var(--jb-sp-5); }
/* 공고 매칭 정보 — 공공채용 상세 로그인 후(2.4.0 #5 · FR-DETAIL02). 판정이 아니라 참고 표기다 */
/* ▼ D122 · 05/07 정본 1:1 (2026-09-18) — 정본 components.css 「공고 매칭 정보 D96」 값으로 맞췄다.
     종전(margin-top 10 · 글자 #222 · 줄높이 없음 · 아이콘 15)은 로그인 후 1440 실측에서 항목 글자색 #222(정본 #4E4E4E) · 줄 22.4(정본 21)로 달랐다.
     쓰는 곳 = 05 · 07 우측 「공고 매칭 정보」 + 07 입사지원 폼 ④ 제출서류(sprtFormNew.jsp) 뿐(전수 grep). */
.jb-matchlist{ display:flex; flex-direction:column; gap:var(--jb-sp-2); margin:0; padding:0; list-style:none; }
.jb-matchlist > li{ display:flex; align-items:center; gap:var(--jb-sp-2);
  font-size:var(--jb-fs-sm); line-height:1.5; color:var(--jb-body); }
.jb-matchlist > li .jb-ico{ flex:none; width:16px; height:16px; color:var(--jb-brand); }
.jb-matchlist__note{ margin:var(--jb-sp-3) 0 0; font-size:var(--jb-fs-2xs); color:var(--jb-muted); }
/* .jb-sidestate__tags 삭제(2026-09-18 · D128 ①) — 쓰던 곳은 05 로그인 후 대상 배지 하나뿐이었다(전수 grep) */
/* 포스터가 없을 때의 텍스트 카드(09 취업교육 상세 #3) · 「같은 분야 교육 더보기」(D21) */
.jb-detailposter--text{ display:flex; flex-direction:column; gap:var(--jb-sp-2); padding:var(--jb-sp-7) var(--jb-sp-5);
  border:1px dashed var(--jb-border); border-radius:var(--jb-r-box); background:var(--jb-bg-subtle); text-align:center; }
/* 🔴 2026-09-24 D194 ① — 정본에 있는 `font-weight` 가 dev 에 빠져 굵기가 안 걸렸다. */
.jb-detailposter--text strong{ font-size:var(--jb-fs-sm); font-weight:var(--jb-fw-semibold); color:var(--jb-muted); }
.jb-detailposter--text span{ font-family:var(--jb-font-display); font-weight:var(--jb-fw-bold);
  font-size:var(--jb-fs-md); color:var(--jb-ink); }
.jb-sidemore{ margin:calc(var(--jb-sp-2) * -1) 0 0; text-align:right; }
.jb-sidemore a{ font-size:var(--jb-fs-sm); color:var(--jb-brand); }
.jb-sidemore a:hover{ text-decoration:underline; }

/* ══════════════════════════════════════════════════════════════════════
   07 기업채용 상세 — 좌측 구조 1:1 (결정 D112 · D114 · D115 · 2026-09-18)
   정본 design/css/page-detail.css 끝 블록을 «값·이름 그대로» 옮겼다(툴바 공유 아이콘 · 접수기간 줄 ·
   요약 3묶음 · 앵커 구간 · 기업 리뷰 평점). 공공채용 상세에는 없고 기업채용 상세에만 있는 요소라
   components.css 에 맞는 규격이 없던 것만 둔다 — 공공채용 상세에는 영향이 없다.
   ※ .jb-detailsec 2줄은 07 1차(배경 제거) 때 먼저 넣었던 것을 이 블록으로 합쳤다.
   ══════════════════════════════════════════════════════════════════════ */

/* 툴바 — 경로(좌) + 공유 버튼(우) · 마커 2.7.0 #1 */
.jb-detailtoolbar{ display:flex; align-items:center; justify-content:space-between;
  gap:var(--jb-sp-3); flex-wrap:wrap; }
.jb-detailtoolbar__share{ display:flex; align-items:center; gap:var(--jb-sp-2); flex-wrap:wrap;
  font-size:var(--jb-fs-sm); color:var(--jb-muted); }
/* 공유 = 아이콘 버튼만(글자·「공유」 라벨 없음 · 2026-09-18 사용자) — 툴바 줄 높이에 맞춰 작은 원형 */
.jb-detailtoolbar__share .jb-iconbtn{ width:36px; height:36px; padding:0; color:var(--jb-muted); }
.jb-detailtoolbar__share .jb-iconbtn:hover{ color:var(--jb-brand); }
.jb-detailtoolbar__share .jb-iconbtn .jb-ico{ width:18px; height:18px; }
/* 페이스북 공유 = «운영 이미지» 그대로(/resource/main2025/images/icon_sns_02.png · 64×64) — 07 §3-6 정정(사용자).
   CSS 로 파란 면 · 채운 f 를 새로 그리지 않는다. 36px 원 안에 이미지를 꽉 채운다. 문자 · 링크는 외곽선 원 그대로. */
.jb-detailtoolbar__share .jb-iconbtn--facebook{ overflow:hidden; border:0; background:none; }
.jb-detailtoolbar__share .jb-iconbtn--facebook img{ display:block; width:100%; height:100%; object-fit:cover; }

/* 헤더 카드 — 공고명 아래 접수기간 + D-day 줄 */
.jb-detailhead__date{ margin:var(--jb-sp-3) 0 0; font-size:var(--jb-fs-sm); color:var(--jb-muted); }
.jb-detailhead__date b{ font-weight:var(--jb-fw-bold); color:var(--jb-danger); }

/* 채용 요약 3묶음(채용조건 · 근무환경 · 기업정보) + CTA 줄 — 헤더 카드 안
   묶음 제목은 .jb-linklist__title · 값 목록은 .jb-sidesum · 버튼 줄은 .jb-detailactions 를 그대로 쓴다 */
.jb-detailsum{ padding:var(--jb-sp-6); }
.jb-detailsum__grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--jb-sp-5); }
.jb-detailsum .jb-detailactions{ margin-top:var(--jb-sp-6); }

/* 앵커 구간(상세내용 · 기업의 다른 채용공고 · 유사공고) — 배경을 두지 않는다(사용자 요건 2026-09-18) */
.jb-detailsec{ display:flex; flex-direction:column; gap:var(--jb-sp-4); scroll-margin-top:var(--jb-sp-5); }
.jb-detailsec > .jb-subhead{ margin-bottom:0; }
/* 목록형 구간(기업의 다른 채용공고 · 유사공고) 위에 여백 60px 추가 — 앞 콘텐츠와 덩어리를 나눈다(2026-09-18 사용자) */
.jb-detailsec--spaced{ margin-top:var(--jb-sp-8); }
/* 「기업의 다른 채용공고」 ↔ 「유사공고」 사이 구분선 — 유사공고 section 에만 붙인다(07 §3-6).
   정본 실측 : 앞 섹션 끝 → 선 76px(gap 16 + spaced 60) · 선 → 제목 40px · 선 1px #DDD */
.jb-detailsec--divided{ padding-top:var(--jb-sp-7); border-top:1px solid var(--jb-border); }

/* 기업 리뷰 평점(잡플래닛 · D39) — 막대 · 별점은 <meter> 값으로만 그린다(인라인 width 없음) */
.jb-review__score{ display:flex; align-items:center; gap:var(--jb-sp-3); }
.jb-review__num{ font-family:var(--jb-font-display); font-weight:var(--jb-fw-bold);
  font-size:var(--jb-fs-h3); line-height:var(--jb-lh-tight); color:var(--jb-ink); }
.jb-review__items{ display:grid; gap:var(--jb-sp-2); margin:var(--jb-sp-4) 0 0; }
.jb-review__item{ display:grid; grid-template-columns:64px minmax(0,1fr) 28px; align-items:center; gap:var(--jb-sp-3); }
.jb-review__item dt{ font-size:var(--jb-fs-sm); color:var(--jb-muted); }
.jb-review__item dd{ margin:0; min-width:0; }
.jb-review__val{ font-family:var(--jb-font-display); font-weight:var(--jb-fw-semibold);
  font-size:var(--jb-fs-sm); color:var(--jb-ink); text-align:right; }

/* 항목 막대 — .jb-bar 와 같은 색(트랙 --jb-border-soft · 채움 --jb-brand-light) */
.jb-review__meter{ -webkit-appearance:none; appearance:none; display:block; width:100%; height:6px;
  border:0; border-radius:var(--jb-r-pill); background:var(--jb-border-soft); overflow:hidden; }
.jb-review__meter::-webkit-meter-inner-element{ display:block; }
.jb-review__meter::-webkit-meter-bar{ height:6px; border:0; border-radius:var(--jb-r-pill); background:var(--jb-border-soft); }
.jb-review__meter::-webkit-meter-optimum-value,
.jb-review__meter::-webkit-meter-suboptimum-value,
.jb-review__meter::-webkit-meter-even-less-good-value{ border-radius:var(--jb-r-pill); background:var(--jb-brand-light); }
.jb-review__meter::-moz-meter-bar{ border-radius:var(--jb-r-pill); background:var(--jb-brand-light); }

/* 전체 별점 — 별 5개 모양 mask 안을 왼쪽부터 --jb-stars-pct 만큼 채운다.
   ★2026-10-06 — 종전엔 meter 내부(::-webkit-meter-*-value)를 칠했는데, 채움 높이가 별의 위쪽 절반에서 끊겨
     별이 «위에서부터» 차는 것처럼 보였다(dev Chrome 실측 · height 지정으로도 안 고쳐짐).
     → meter 내부는 숨기고, 채움은 meter 자체의 가로 그라데이션으로 그린다. 비율은 JSP 가 style 로 넘긴다. */
.jb-review__stars{ -webkit-appearance:none; appearance:none; display:block; flex:none; width:100px; height:20px;
  border:0; overflow:hidden;
  /* 색과 그라데이션을 나눠 둔다 — 비율 값이 깨져 그라데이션이 무효가 돼도 회색 빈 별은 남는다 */
  background-color:var(--jb-border);
  background-image:linear-gradient(90deg, var(--jb-warning) var(--jb-stars-pct, 0%), transparent 0);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 1.6l2.6 5.3 5.8.8-4.2 4.1 1 5.8L10 14.9l-5.2 2.7 1-5.8L1.6 7.7l5.8-.8z'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 1.6l2.6 5.3 5.8.8-4.2 4.1 1 5.8L10 14.9l-5.2 2.7 1-5.8L1.6 7.7l5.8-.8z'/%3E%3C/svg%3E");
  -webkit-mask-size:20px 20px; mask-size:20px 20px;
  -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x; }
.jb-review__stars::-webkit-meter-inner-element{ display:none; }
.jb-review__stars::-moz-meter-bar{ background:transparent; }

@media (max-width:900px){
  .jb-detailsum__grid{ grid-template-columns:1fr; }
}
@media (max-width:768px){
  .jb-detailsum{ padding:var(--jb-sp-5); }
}

/* ▼ D122 · 05/07 정본 1:1 — 우측 표준 연결영역(stdLinks.jsp) 간격 (2026-09-18 · 개발 05/07 담당)
   정본(job-public-detail.html · job-corp-detail.html)은 카드가 `.jb-detailside__sticky` 의 «직접 자식»이라 카드 사이 = sticky gap 16 하나다.
   dev 는 공유 조각이 `div.jb-root.jb-stdlinks` 로 한 번 감싸고, components.css `.jb-stdlinks{margin-top:16px}`
   (옛 레이아웃에서 접수요약 뒤에 붙어 보이던 것을 막으려던 여백)가 남아 «접수 요약 → 이런 사업도 있어요» 만 32px 였다(1440 로컬 실측 gap 16 · 32 · 16 · 16).
   또 목록 항목 간격이 `.jb-stdlinks … li{padding:10px 0}` 라 글자~선~글자 21+10+1+10 로 정본(gap 6 + 아래 6 + 선 1 = 34)보다 항목마다 8px 길었다.
   ➡️ 상세 우측 sticky 안에서만 정본 값으로 되돌린다(components.css 의 허브 한정 규칙은 그대로). 안내형(--guide)은 제외 — 자기 규칙(좌 30 · 선 없음)을 쓴다.
   ⚠️ 이 조각을 쓰는 상세 6화면(05 · 07 · 일자리/기업지원/취업교육/대외활동 상세)이 같이 바뀐다 — 모두 정본의 같은 우측 카드 규격이다. */
.jb-detailside__sticky > .jb-stdlinks{ margin-top:0; }
.jb-detailside__sticky .jb-stdlinks .jb-linklist__ul:not(.jb-linklist__ul--guide){ gap:var(--jb-sp-2); }
.jb-detailside__sticky .jb-stdlinks .jb-linklist__ul:not(.jb-linklist__ul--guide) > li{ padding:0 0 var(--jb-sp-2); }
.jb-detailside__sticky .jb-stdlinks .jb-linklist__ul:not(.jb-linklist__ul--guide) > li:last-child{ padding-bottom:0; }

/* ── 2026-09-18 D122 07 입사지원 폼 모달 ── */
/* 기업채용 상세 「잡아바 입사지원」(job-corp-detail.html #jb-apply-modal) 전용 변형 `.jb-modal--form`.
   그 자리에는 운영 폼(mber/myPage/suggest/sprtFormNew.jsp — 제출 이력서 · 이력서 선택 · 첨부 · 제출서류 · 사전질문 · 지원 안내 ·
   개인정보 제3자 제공 동의 5열 표)이 들어간다. 기본 모달(components.css .jb-modal__box)은 확인 문구용이라
   ①폭 420 에 5열 표가 안 들어가고 ②높이 제한이 없어 긴 폼이 화면 밖으로 넘치고 ③가운데 정렬이라 폼 글이 가운데로 몰린다.
   머리(닫기 X · 가운데 제목 · 설명) · r20 · 버튼 순서(닫기 → 지원 제출)는 검토를 거친 기본 모달 그대로 두고 아래만 더한다. */

/* 폭 840 = 동의 표 최소 폭 760(components.css `.jb-tablewrap .jb-table{min-width:760px}`) + 좌우 안여백 30×2 + 세로 스크롤바 여유(Windows 15~17)
   → 1440 에서 표가 가로 스크롤 없이 읽히는 가장 좁은 폭. max-width 라 좁은 화면은 `.jb-modal` 안여백 20 을 뺀 폭(390 → 350)이 된다.
   높이 = 화면 − `.jb-modal` 위아래 안여백 20×2. 넘치면 본문(__body)만 스크롤하고 머리 · 버튼은 고정한다(100vh 는 dvh 미지원 대비). */
.jb-modal--form .jb-modal__box{ display:flex; flex-direction:column; max-width:840px;
  max-height:calc(100vh - var(--jb-sp-5) * 2); max-height:calc(100dvh - var(--jb-sp-5) * 2); }

/* 본문 = 운영 #viewSprtHtml 자리. 좌우를 상자 안여백만큼 넓혀(음수 margin + 같은 padding)
   스크롤바가 폼 글 옆이 아니라 상자 오른쪽 끝에 붙게 한다 · 위아래 구분선으로 고정 머리 · 버튼과 나눈다 */
.jb-modal--form .jb-modal__body{ flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  margin:var(--jb-sp-5) calc(var(--jb-sp-6) * -1) 0; padding:0 var(--jb-sp-6);
  border-top:1px solid var(--jb-border); text-align:left; }
.jb-modal--form .jb-modal__actions{ flex:none; justify-content:center;
  margin:0 calc(var(--jb-sp-6) * -1); padding:var(--jb-sp-5) var(--jb-sp-6) 0; border-top:1px solid var(--jb-border); }
/* 버튼 폭 175 = 기본 모달 420 의 렌더값((420 − 30×2 − 간격 10) ÷ 2) — 상자가 넓어져도 버튼은 늘리지 않는다 */
.jb-modal--form .jb-modal__actions > .jb-btn{ flex:0 1 175px; }

/* 폼 — 세로형(.jb-form--stack) 그대로. 첫 항목 위 40 은 «앞 안내와 떼기» 값인데 여기선 본문 윗선이 이미 나누므로 다른 항목과 같은 20 */
.jb-modal--form .jb-form--stack .jb-form__row:first-child{ padding-top:var(--jb-sp-5); }

/* ※ 안내 목록 — 운영 .listType01(li::before '※') 대응 · ③ 첨부 주의 · ⑥ 지원 안내 */
.jb-applyform__notes{ margin:0; padding:0; list-style:none; font-size:var(--jb-fs-xs); line-height:1.6; color:var(--jb-muted); }
.jb-applyform__notes > li{ position:relative; padding-left:18px; }
.jb-applyform__notes > li + li{ margin-top:var(--jb-sp-1); }
.jb-applyform__notes > li::before{ content:"※"; position:absolute; left:0; top:0; }
/* 안내 박스 안에서는 박스 글자 크기(14)를 따르고 남는 폭을 다 쓴다(.jb-notice 가 space-between · wrap 이라) */
.jb-notice > .jb-applyform__notes{ flex:1 1 0; min-width:0; font-size:inherit; }

/* ③ 첨부 — 운영 .fileAdd(버튼 줄 + DEXT5 자리)를 감싼다 */
.jb-applyform__file{ display:flex; flex-direction:column; gap:var(--jb-sp-3); }
/* DEXT5 자리 — 제품 설정 border_style=none(resource/upload/config/dext5upload.config.xml:21)이라 테두리는 이 박스가 준다.
   최소 높이 100 = fn_DEXT5UPLOADInit 의 config.Height(jobEntDtl.jsp:1489) · 제품이 더 크게 그리면 따라 늘어난다.
   #div_DEXT5UPLOAD 는 이 박스 «안» 한 칸(인라인 width:100%)으로 들어간다 */
.jb-applyform__upload{ display:flex; align-items:center; justify-content:center; min-height:100px; padding:var(--jb-sp-4);
  border:1px dashed var(--jb-border); border-radius:var(--jb-r-btn); background:var(--jb-bg-subtle);
  font-size:var(--jb-fs-sm); line-height:1.5; color:var(--jb-muted); text-align:center; }

/* ⑤ 사전질문 — 문항(라벨) → 답변 → 글자 수. 문항 사이 20(본문 간격 10 + 10) */
.jb-applyform__q{ display:block; font-size:var(--jb-fs-sm); line-height:1.5; color:var(--jb-body); }
.jb-applyform__count{ margin:0; text-align:right; font-size:var(--jb-fs-2xs); line-height:1.3; color:var(--jb-muted); }
.jb-applyform__count + .jb-applyform__q{ margin-top:var(--jb-sp-3); }

/* ⑦ 제3자 제공 동의 표 — 열 비율은 운영 colgroup 그대로(sprtFormNew.jsp:160-166 · 20 / 17 / 나머지 / 15 / 20 %)
   낱말 중간에서 줄을 바꾸지 않는다(「경력사 / 항」 · 「수 / 상내역」 방지 · 760 폭에서 넘침 0 실측) */
.jb-applyform__consent{ word-break:keep-all; }
.jb-applyform__consent col:nth-child(1), .jb-applyform__consent col:nth-child(5){ width:20%; }
.jb-applyform__consent col:nth-child(2){ width:17%; }
.jb-applyform__consent col:nth-child(4){ width:15%; }
/* 제공항목 — 운영은 굵게 · 검정(:180 인라인)으로 강조한다(제공 항목 고지). 강조는 두고, 긴 문장이라 왼쪽 정렬(.jb-td-left) */
.jb-applyform__consent .jb-applyform__emph{ font-weight:var(--jb-fw-bold); color:var(--jb-ink); }

@media (max-width:768px){
  /* 좌우 안여백 30 → 20(.jb-modal 바깥 여백과 같게) — 350 상자에서 폼 폭 290 → 310 */
  .jb-modal--form .jb-modal__box{ padding-inline:var(--jb-sp-5); }
  .jb-modal--form .jb-modal__body,
  .jb-modal--form .jb-modal__actions{ margin-inline:calc(var(--jb-sp-5) * -1); padding-inline:var(--jb-sp-5); }
  .jb-modal--form .jb-airesume{ padding:var(--jb-sp-4); }
}