/* ==================== RESET & BASE ==================== */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: "Pretendard", sans-serif;
  color:#1e1e1e;
  line-height:1.5;
  word-break: keep-all;
  overflow-x:hidden;
}
img { display:block; max-width:100%; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
hr { border:none; border-top:1px solid #ddd; }
button { font:inherit; }
.displaynone { display: none !important; }

.c-navy{color:#33548c;} .c-blue{color:#0079ff;} .c-orange{color:#ff8126;}

/* 반응형 전환용 유틸리티: 데스크톱/모바일(피그마 오른쪽 축소본) 전용 요소 */
.only-mobile { display:none; }
.only-desktop { display:block; }

/* ==================== LAYOUT HELPERS ==================== */
.section { max-width: 1470px; margin: 0 auto; padding: 0 15px; }
.section__head { display:flex; flex-direction:column; gap:12px; }
.section__head--line { border-bottom:1px solid #ddd; margin-bottom:64px; }
.eyebrow { color:#0f4498; font-weight:500; font-size:13px; }
.section__title { font-size:44px; font-weight:600; color:#000; }
.section--about .section__title { color:#0f4498; font-size:52px; }
.section--about .section__head { margin-bottom:0; gap:0; }
.section--about { display:flex; flex-direction:column; gap:60px; background:#fff; }
.block-title { font-size:28px; font-weight:700; color:#000; margin-bottom:40px; }
.block-title--blue { color:#004098; font-size:32px; font-weight:800; }
.block-title.block-title--blue { margin-bottom:32px; }
.block-title.block-title--blue2 { margin-bottom:72px; }
.block-title--blue2 { color:#004098; font-size:24px; font-weight:800; }
.block-title--blue3 { color:#004098; font-size:24px; font-weight:800; }

/* ==================== HERO ==================== */
.hero { position:relative; min-height:890px; overflow:hidden; }
.hero__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero__gradient { position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,.25) 65%, rgba(255,255,255,.55) 100%);
}
.hero__content { position:relative; z-index:2; margin: 50px auto 0; max-width: 1440px; padding: 0 15px; }
.hero__logo { width:188px; margin-bottom:175px; }
.hero__title { font-size:64px; font-weight:bold; color:#004098; line-height:1.25; margin-bottom:40px; }
.hero__desc { font-size:24px; font-weight:500; color:#0c1b33; line-height:1.4; margin-bottom:56px; }
.btn-dark {
  display:inline-flex; align-items:center; justify-content:center;
  background:#0c1b33; color:#fff; font-weight:700; font-size:16px;
  padding:20px 40px;
}

/* ==================== VIDEO SECTION ==================== */
.video-section { background:#0c1b33; padding:48px max(240px, calc((100vw - 1440px) / 2)); display:flex; flex-direction:column; gap:32px; align-items:center; }
.video-tabs { display:flex; width:100%; border-bottom:1px solid rgba(255,255,255,.1); background:#1b3a6b; }
.video-tab {
  flex:1; background:#0c1b33; border:none; color:rgba(255,255,255,.8);
  font-size:18px; font-weight:600; padding:14px 24px; cursor:pointer;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.video-tab.is-active { color:#fff; border-bottom:7px solid #fff; }
.video-frame { width:100%; display:none; }
.video-frame.is-active { display:block; animation:panelFade .3s ease; }
.video-frame { position: relative;width: 100%;aspect-ratio: 16 / 9;overflow: hidden; }
.video-frame video,
.video-frame iframe { width: 100%;height: 100%;}
.video-links { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; width:100%; }
.video-link {
  display:flex; align-items:center; gap:10px; color:#fff; font-size:15px; font-weight:600;
  padding:16px 28px; border:1px solid rgba(255,255,255,.38);
}

/* ==================== ABOUT: STATS ==================== */
.section--about { margin-top: 120px; margin-bottom: 120px; }
.stats-row { display:flex; gap:48px; }
.stat { display:flex; flex-direction:column; gap:12px; padding:16px 0; flex:1; }
.stat__bar { width:100%; height:6px; background:#0f4498; }
.stat__num { font-size:54px; font-weight:700; color:#0f4498; }
.stat__label { font-size:16px; font-weight:500; color:#1E1E1E; }

/* ==================== ABOUT: MAP TABS ==================== */
.map-section { background:#f2f5f7; }
.map-tabs { display:flex; height:56px; }
.map-tab { flex:1; border:none; background:#fff; color:#1a4992; font-size:16px; font-weight:500; cursor:pointer; transition:background .2s,color .2s; }
.map-tab.is-active { background:#0f4498; color:#fff; font-weight:600; }
.map-panel { display:none; background:#f2f5f7; padding:40px; border-top:3px solid #1428a0; animation:panelFade .25s ease; }
.map-panel.is-active { display:block; }
@keyframes panelFade { from{opacity:0;} to{opacity:1;} }
.map-content__head { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:40px; flex-wrap:wrap; gap:16px; }
.map-content__head h3 { font-size:26px; color:#2e4061; }
.map-content__head span { font-size:14px; color:#66788c; }
.map-stats { display:flex; gap:48px; font-size:14px; color:#596b85; font-weight:500; }
.map-stats strong { font-size:32px; font-weight:700; margin-right:6px; }
.map-globes { display:flex; gap:35px; justify-content:center; flex-wrap:wrap; }
.globe { position:relative; width:300px; max-width:100%; aspect-ratio:1/1; }
.globe img { width:100%; height:100%; }
.pin { position:absolute; transform:translate(6px,-140%); background:#0f4498; color:#fff; font-size:11px; font-weight:600; padding:4px 10px; border-radius:10px; white-space:nowrap; z-index:2; }
.pin--blue { background:#0079ff; }
.pin--orange { background:#ff8126; }
.pin-dot { position:absolute; width:10px; height:10px; border-radius:50%; background:#0f4498; border:2px solid #fff; box-shadow:0 0 0 1px rgba(15,68,152,.35); transform:translate(-50%,-50%); z-index:1; }
.pin-dot--blue { background:#0079ff; box-shadow:0 0 0 1px rgba(0,121,255,.35); }
.pin-dot--orange { background:#ff8126; box-shadow:0 0 0 1px rgba(255,129,38,.35); }

/* 모바일: 지도 없이 카테고리별 텍스트 칩만 표시 (기본은 숨김, 모바일에서만 노출) */
.map-legend { display:none; flex-direction:column; gap:20px; }
.legend-row { display:flex; align-items:flex-start; gap:16px; }
.legend-row__label { flex-shrink:0; width:76px; font-size:13px; font-weight:600; color:#8a97ab; padding-top:6px; }
.legend-row__pills { display:flex; flex-wrap:wrap; gap:6px; }
.pin-chip { display:inline-flex; align-items:center; background:#0f4498; color:#fff; font-size:13px; font-weight:600; padding:6px 14px; white-space:nowrap; }
.pin-chip--blue { background:#0079ff; }
.pin-chip--orange { background:#ff8126; }

/* 국내사업장: 실제 지도 위에 해외사업장과 동일한 핀 라벨 표시 */
.domestic-map { position:relative; width:320px; max-width:100%; margin:0 auto; }
.domestic-map img { width:100%; height:auto; display:block; }

/* ==================== ABOUT: STATUS / FUTURE CARDS ==================== */
.status-cards, .future-cards { display:flex; gap:32px; }
.status-card, .future-card { flex:1; padding:32px; display:flex; flex-direction:column; gap:16px; min-height: 500px; }
.status-card--dark { background:#0c1b33; color:#fff; }
.status-card--light { background:#f4f4f4; color:#1e1e1e; }
.future-card { background:#f2f5f7; border:1px solid #ddd; }
.status-card__eyebrow { font-size:14px; font-weight:600; }
.status-card--light .status-card__eyebrow { color:#0f4498; }
.status-card__title { font-size:24px; font-weight:800; }
.status-card__desc { font-size:15px; line-height:1.6; opacity:.85; }
.status-card__img { width:100%; aspect-ratio:394/250; overflow:hidden; margin-top: auto; }
.future-card__img { width:100%; aspect-ratio:394/260; overflow:hidden; margin-top: auto; }
.status-card__img img, .future-card__img img { width:100%; height:100%; object-fit:cover; }
.future-card__eyebrow { color:#0f4498; font-size:22px; font-weight:800; }
.future-card__title { font-size:17px; font-weight:700; color:#333; line-height:1.7; }
.future-card__desc { font-size:14px; color:#666; line-height:1.7; }

/* ==================== WORK SECTION ==================== */
.section--work { background:#f2f5f7;max-width: 100%; padding: 120px 0 120px; }
.section--work .work__div { display:flex; flex-direction:column; gap:100px; max-width: 1470px; margin: 0 auto; padding: 0 15px; }
.welfare-top-cards { display:flex; gap:24px; margin-bottom:32px; }
.welfare-top-card { flex:1; position:relative; background:#e3ecf5; min-height:260px; padding:24px 16px 24px 32px; overflow:visible; }
.welfare-top-card__text { position:absolute; left:32px; bottom:24px; right:50%; }
.welfare-top-card__title { font-size:28px; font-weight:800; color:#004098; margin-bottom:12px; }
.tag-row { display:flex; gap:8px; flex-wrap:wrap; }
.tag { background:#fff; color:#004098; font-weight:700; font-size:14px; padding:6px 16px; border-radius:100px; white-space:nowrap; }
.welfare-top-card__img { position:absolute; right:16px; bottom:0; width:auto; object-fit:contain; pointer-events:none; }
.welfare-top-card__img.welfare_img01 { height:135%; }
.welfare-top-card__img.welfare_img02 { height:150%; bottom:24px; }

.welfare-bottom-cards { display:flex; gap:16px; }
.welfare-bottom-card { flex:1; background:#0b1d33; color:#fff; padding:24px; display:flex; flex-direction:column; gap:20px; min-height:280px; }
.welfare-bottom-card__head { display:flex; align-items:center; gap:12px; }
.welfare-bottom-card__head img { width:40px; height:40px; }
.welfare-bottom-card__head span { font-size:20px; font-weight:700; }
.welfare-bottom-card hr { border-top:1.5px solid rgba(255,255,255,.2); }
.welfare-bottom-card ul li { font-size:16px; font-weight:500; margin-bottom:10px; }

.edu-grid { display:flex; gap:24px; }
.edu-col { flex:1; border-top:2px solid #bdd1e5; padding-top:20px; display:flex; flex-direction:column; gap:24px; }
.edu-col__title { font-size:20px; font-weight:700; color:#004098; }
.edu-item { display:flex; flex-direction:column; gap:12px; }
.edu-item__head { display:flex; justify-content:space-between; align-items:center; background:#e6effb; height:36px; padding:0 12px; }
.edu-item__head span { font-weight:700; font-size:15px; color:#004098; }
.badge { background:#00337c; color:#fff; font-size:11px; font-weight:600; padding:4px 10px; font-style:normal; }
.edu-item ul { padding:0 4px; display:flex; flex-direction:column; gap:8px; }
.edu-item ul li { position:relative; padding-left:13px; font-size:13px; color:#4f4f4f; line-height:1.4; display: flex; align-items: center;}
.edu-item ul li::before { content:"•"; position:absolute; left:0; }
.edu-item ul li img { display: inline; padding-left: 3px; }

.mini-logo { width:211px; }
.gallery-row { display:flex; gap:24px; }
.gallery-item { flex:1; height:240px; overflow:hidden; }
.gallery-item img { width:100%; height:100%; object-fit:cover; }

/* ==================== JOB SECTION (아코디언, 피그마 기본 레이아웃 유지) ==================== */
.section--job { background:#fff; margin-top: 120px; margin-bottom: 120px; }
.job-layout { display:flex; gap:64px; }
.job-nav { width:336px; flex-shrink:0; }
.job-nav__label { color:#0f4498; font-weight:700; font-size:14px; margin-bottom:16px; }
.job-nav ul { display:flex; flex-direction:column; gap:8px; }
.job-nav li { padding:12px 16px; font-weight:600; font-size:16px; color:#1e1e1e; cursor:pointer; transition:background .15s,color .15s; }
.job-nav li.is-active { background:#0f4498; color:#fff; }
.job-nav li:hover:not(.is-active) { background:#f2f5f7; }

.job-content { flex:1; min-width:0; display:flex; flex-direction:column; }
.job-item { padding:24px 0; border-bottom:1px solid #eee; }
.job-item:first-child { padding-top:0; }
.job-item__header {
  position: relative; display:block; width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:0;
}
.job-item.is-expanded .job-item__header::after {
  content: "";
  position: absolute;
  top: -15px;
  right: 0;
  width: 92px;
  height: 92px;
  background: url("/ado/images/job_icon.svg") no-repeat center / contain;
  transition: transform 0.3s ease;
}
.job-item__header h3 { font-size:22px; font-weight:700; margin-bottom:8px; }
.job-item__sub { color:#0f4498; font-weight:600; font-size:14px; }
.job-item__desc { color:#555; font-size:14px; line-height:1.6; margin-top:12px; }
.job-item .job-grid { display:none; }
.job-item.is-expanded .job-item__sub  { color:#555; }
.job-item.is-expanded .job-item__desc { display:none; }
.job-item.is-expanded .job-grid { display:grid; margin-top:20px; animation:fadeIn .25s ease; }
@keyframes fadeIn { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }
.job-grid { grid-template-columns:repeat(4,1fr); gap:20px; }
.job-card { background:#f2f5f7; padding:24px; display:flex; flex-direction:column; gap:12px; }
.job-card strong { color:#0f4498; font-size:18px; font-weight:700; }
.job-card span { color:#1e1e1e; font-size:14px; line-height:1.5; }

/* ==================== RECRUIT SECTION (오토 슬라이드 + 단계별 정보) ==================== */
.section--recruit { background:#f2f5f7; max-width: 100%; padding: 120px 0 120px; }
.section--recruit .recruit__div { display:flex; flex-direction:column; gap:100px; max-width: 1470px; margin: 0 auto; padding: 0 15px; }
.section--recruit .section__head--line {margin-bottom: 0;}
.timeline-steps { display:flex; gap:16px; align-items: flex-end; height:210px; margin-bottom:24px; }
.step-card {
  flex:1; height:100%; background:#fff; border:1px solid #ddd; padding:20px 24px;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start;
  position:relative; overflow:hidden; cursor:pointer; text-align:left;
  transition:background .4s ease, color .4s ease;
}
.step-card__num { font-size:26px; font-weight:800; color:#98a2b3; margin-bottom:8px; transition:color .4s; }
.step-card__desc { font-size:15px; font-weight:700; color:#667085; line-height:1.3; max-width:65%; transition:color .4s; }
.month-badge { align-self:flex-start; background:rgba(0,0,0,.05); border:1px solid #e4e7ec; font-size:12px; font-weight:700; color:#667085; padding:6px 12px; border-radius:5px; transition:.4s; }
.step-card__char-slot { position:absolute; right:0; bottom:0; top:0; width:42%; pointer-events:none; overflow:hidden; }
.step-card__char-slot img { position:absolute; right:0; bottom:0; width:100%; height: 100%; max-width:none; object-fit:contain; padding: 10px 10px 0 0; margin-bottom: -30px; }
.step-character--second {margin-bottom: -30px;}

.step-card.is-active { background:#004098; height:250px; }
.step-card.is-active .step-card__num { color:#fff; }
.step-card.is-active .step-card__desc { color:#fff; max-width:55%; }
.step-card.is-active .month-badge { background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25); color:#fff; }

.info-box { background:#ebf1f6; border:1px solid #ddd; padding:20px 24px; display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; transition:opacity .2s ease; height: 135px; }
.info-box.is-inline { margin-top:0; border-top:none; }
.info-box__item { display:flex; align-items:center; gap:10px; font-size:14px; color:#344054; padding:10px 4px; }
.info-box__item em { font-style:normal; color:#667085; font-weight:400; }
.check { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; background:#004098; color:#fff; border-radius:11px; font-size:12px; flex-shrink:0; }

/* 03 임원/직무 면접: 그룹(체크+제목) + 하위 서브불릿 형태 */
.info-box.is-grouped { grid-template-columns:1fr 1fr; align-items:start; }
.info-group { display:flex; flex-direction:column; gap:10px; padding:6px 4px; }
.info-group__head { display:flex; align-items:flex-start; gap:10px; font-size:14px; font-weight:700; color:#1e2a3a; }
.info-group__head strong { font-weight: 400; }
.info-group__head .check { margin-top:1px; }
.info-group__subs { list-style:none; padding-left:32px; display:flex; flex-direction:column; gap:6px; }
.info-group__subs li { position:relative; font-size:13px; color:#54637a; line-height:1.5; }
.info-group__subs li::before { content:"•"; position:absolute; left:-14px; color:#8a97ab; }

/* 04 최종 합격: 아이콘 + 텍스트가 한 줄에 붙는 형태 */
.info-box.is-celebrate { display:flex; align-items:center; gap:24px; justify-content:center; }
.info-celebrate { display:flex; align-items:center; gap:20px; }
.info-celebrate__icon { width:56px; height:56px; object-fit:contain; flex-shrink:0; }
.info-celebrate__title { font-size:15px; font-weight:700; color:#1e2a3a; margin-bottom:4px; word-break: keep-all; }
.info-celebrate__sub { font-size:14px; font-weight:600; color:#0f4498; }

.program-cards { display:flex; gap:32px; }
.program-card { flex:1; background:#fff; border:1px solid #ddd; padding:40px; position:relative; overflow:hidden; min-height:381px; }
.program-card h3 { color:#0f4498; font-size:24px; font-weight:800; margin-bottom:24px; }
.program-card hr { margin-bottom:24px; }
.program-card p { font-size:15px; line-height:1.6; margin-bottom:16px; max-width:60%; position:relative; z-index:1; }
.program-card__img { position:absolute; right:0; bottom:0; width:300px; z-index:0; }
.program-card__img.card__img01 { right:25px; width:220px; }

/* ==================== CTA & FOOTER ==================== */
.cta-section { background:#034ea2; }
.cta-row { display:flex; gap:29px; padding:0 max(240px, calc((100vw - 1440px) / 2)); padding-top:76px; }
.cta-btn { flex:1; display:flex; align-items:center; justify-content:space-between; gap:16px; height:130px; padding:20px 32px; color:#fff; }
.cta-btn--apply { background:#004098; }
.cta-btn--info { background:#11284e; }
.cta-btn span { font-size:18px; font-weight:400; line-height:1.4; }
.cta-btn strong { font-size:22px; font-weight:600; }
.cta-btn img { width:46px; height:60px; flex-shrink:0; }
.cta-banner { margin-top:47px; width:100%; }
.cta-banner img { width:100%; object-fit:cover; }

.footer { background:#0c1b33; color:#fff; padding: 80px 15px; }
.footer__div  {max-width: 1470px; margin: 0 auto; display:flex; flex-direction:column; gap:40px;  }
.footer__logo { width:246px; }
.footer__row { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.footer__addr { font-size:14px; opacity:.6; word-break: keep-all; }
.footer__url { font-size:14px; font-weight:600; }
.footer hr { border-top:1px solid rgba(255,255,255,.15); }
.footer__copy { font-size:13px; opacity:.4; }
.footer__links { display:flex; gap:24px; font-size:13px; opacity:.6; }

/* ==================================================================
   RESPONSIVE : TABLET (1200px 이하)
================================================================== */
@media (max-width: 1200px) {
  .hero__content { padding: 0 25px; }
  .video-section { padding:40px; }
  .cta-row { padding:0 40px; padding-top:60px; }
  .footer { padding:60px 40px; }
  .job-grid { grid-template-columns:repeat(2,1fr); }
}

/* ==================================================================
   RESPONSIVE : MOBILE (1024px 이하) - 피그마 모바일(축소) 디자인 기준
================================================================== */
@media (max-width: 1024px) {

  .only-desktop { display:none !important; }
  .only-mobile { display:block !important; }

  .section--about { margin-top: 40px; margin-bottom: 40px; gap: 32px; }

  /* 히어로 */
  .hero { min-height:0; }
  .hero__content { position:relative; max-width:100%; margin: 40px auto 0; height: 100vh; }
  .hero__logo { width:150px; margin-bottom:40px; }
  .hero__title { font-size:32px; line-height:1.2; margin-bottom:30px; }
  .hero__desc { font-size:14px; font-weight:700; color:#263359; margin-bottom:30px; }
  .btn-dark { padding:14px 20px; font-size:14px; }

  /* 영상 */
  .video-section { padding:32px 16px; gap:20px; }
  .video-tab { font-size:12px; padding:12px 16px; }
  .video-tab.is-active { border-bottom-width:3px; }
  .video-links { flex-direction:column; gap:10px; }
  .video-link { justify-content:center; width:100%; font-size:13px; padding:12px; }

  /* about */
  .section__head {gap: 8px;}
  .eyebrow { font-size:11px; }
  .section__title { font-size:24px; }
  .section--about .section__title { font-size:24px; }
  .step-card__num { font-size:24px; }
  .step-card__desc { font-size:14px; }
  .info-box__item { font-size:12px; gap: 6px; padding: 0; align-items: flex-start; }
  .footer__url { font-size:12px; }
  .stats-row { flex-direction:column; gap:12px; }
  .stat { max-width:100%; border-left:none; background-color: #F2F5F7; padding: 0; }
  .stat__num { font-size:27px; padding: 0 16px; }
  .stat__label { font-size: 14px; padding: 0 16px 28px; }

  .map-panel { padding:20px 16px; }
  .map-content__head { flex-direction:column; align-items:flex-start; margin-bottom:24px; gap:8px; }
  .map-content__head h3 { font-size:18px; }
  .map-content__head span { font-size:12px; }
  .map-stats { gap:24px; flex-wrap:wrap; font-size:11px; }
  .map-stats strong { font-size:18px; }
  .map-legend { display:flex !important; }
  .legend-row { gap:6px; align-items: flex-start; }
  .legend-row__label { width:auto; font-size:10px; }
  .pin-chip { font-size:10px; }
  .map-globes { flex-direction:column; align-items:center; }
  .globe { width:100%; max-width:280px; }
  .domestic-grid { min-height:0; }
  .domestic-card { min-width:0; flex:1 1 calc(50% - 8px); justify-content:center; padding:14px 12px; font-size:13px; }

  .status-cards, .future-cards { flex-direction:column; gap: 20px; }
  .status-card, .future-card { min-height:auto; padding: 20px; }
  .status-card__eyebrow { font-size:11px; }
  .status-card__title { font-size:18px; }
  .status-card__desc { font-size:13px; }
  .future-card__eyebrow { font-size:12px; }
  .future-card__title { font-size:16px; }
  .future-card__desc { font-size:13px; }
  .block-title { font-size:22px; margin-bottom:24px; }
  .block-title--blue, .block-title--blue2, .block-title--blue3 { font-size:18px; }

  /* work */
  .section--work {padding: 60px 0;}
  .section--work .work__div { gap: 40px; }
  .block-title.block-title--blue {margin-bottom: 24px;} 
  .welfare-top-cards { flex-direction:column; }
  .welfare-top-card { min-height:auto; padding:24px 16px; display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
  .welfare-top-card__text { position:static; }
  .welfare-top-card__title { font-size:18px; }
  .tag { font-size:12px; }
  .welfare-top-card__img { height:auto; max-width:60%; align-self:center; }
  .welfare-top-card__img.welfare_img02 { bottom: -25px;}
  .welfare-bottom-cards { flex-direction:column; }
  .welfare-bottom-card { padding: 20px; min-height: 180px; gap: 12px; }
  .welfare-bottom-card__head span { font-size:16px; }
  .welfare-bottom-card ul li { font-size:14px; margin-bottom: 6px; }
  .edu-grid { flex-direction:column; gap:40px; }
  .edu-col__title { font-size:18px; }
  .edu-item__head span { font-size:14px; }
  .badge { font-size:10px; }
  .edu-item ul li { font-size:12px; align-items: flex-start; }
  .gallery-row { flex-direction:column; }
  .gallery-item { height:160px; margin-bottom: 20px; }

  /* job : 왼쪽 목록 -> 칩 형태로 가로 래핑, 선택된 부서 콘텐츠만 노출(피그마 모바일과 동일) */
  .section--job { margin-top: 40px; margin-bottom: 40px; gap: 32px; }
  .section__head--line {margin-bottom: 40px;}
  .job-layout { flex-direction:column; gap:20px; }
  .job-nav { width:100%; }
  .job-nav ul { flex-direction:row; flex-wrap:wrap; gap:8px; }
  .job-nav li { flex:0 0 auto; text-align:center; font-size:13px; padding:8px 14px; background:#f2f5f7; border:1px solid #e4e7ec; }
  .job-nav li.is-active { background:#004098; color:#fff; border-color:#004098; }
  .job-item { display:none; border-bottom:none; padding:0; }
  .job-item.is-expanded { display:block; }
  .job-item.is-expanded .job-item__desc { display:none; }
  .job-grid { grid-template-columns:1fr; gap:8px; }
  .job-item.is-expanded .job-grid { margin-top: 40px; }
  .job-card { background:#f2f5f7; padding:12px; gap:6px; }
  .job-card strong { font-size:13px; }
  .job-card span { font-size:11px; line-height:1.4; }
  .job-item__header h3 { font-size:22px; margin-bottom: 16px; }
  .job-item.is-expanded .job-item__header::after {display: none;}

  /* recruit: 모바일은 데스크톱과 달리 선택 카드가 자연스럽게 커지고,
     바로 아래에 정보박스가 붙는 피그마 모바일 디자인을 따른다 (스택 전체가 함께 밀림) */
  .section--recruit {padding: 60px 0;}
  .section--recruit .recruit__div { gap: 40px; }
  .block-title.block-title--blue2 { margin-bottom: 40px }
  .block-title.block-title--blue3 { margin-bottom: 0 }
  .timeline-steps { flex-direction:column; gap:0; height:auto; }
  .step-card { width: 100%; padding:20px; margin-bottom: 12px; }
  .step-card.is-active { min-height:200px; padding:20px; margin-bottom: 0; }
  .step-card__char-slot { width:110px; top:auto; right: 20px; }
  .step-card__char-slot img { height:auto; width:100%; position:static; padding:0; margin-bottom:0; }
  .info-box { grid-template-columns:1fr; height:auto; padding: 16px; gap: 12px; width: 100%; }
  .info-box.is-inline { margin-top:0; margin-bottom:12px; }
  .check { width: 15px; height: 15px; border-radius: 0; margin-top: 3px; }
  .info-box.is-grouped { grid-template-columns: 1fr; }
  .info-group__head { gap: 6px; }
  .info-group__head .check { margin-top: 3px; }
  .info-celebrate { gap: 12px; flex-direction: column; }
  .step-character--third { height: 170px;}
  .program-cards { flex-direction:column; }
  .program-card { padding:24px; min-height:auto; }
  .program-card h3 { font-size:18px; margin-bottom: 16px; }
  .program-card hr { margin-bottom: 16px; }
  .program-card p { font-size:13px; max-width:100%; margin-bottom: 12px; }
  .program-card__img { display: none; }
  .program-card__img.card__img01 { display: none; }

  /* cta / footer */
  .cta-row { flex-direction:column; padding:20px; padding-top:0; padding-bottom:0; gap:16px; }
  .cta-section { padding-top:40px; }
  .cta-btn { height:auto; padding:16px; }
  .cta-btn strong { font-size:15px; }
  .cta-btn img { width:20px; height:26px; }
  .cta-banner { margin-top: 40px; }
  .footer { padding:48px 20px; gap:24px; }
  .footer__div { gap:24px; }
  .footer__logo { width:150px; }
  .footer__row { flex-direction:column; align-items:flex-start; gap:12px; }
  .footer__addr { font-size:11px; }
  .footer__links { flex-wrap:wrap; gap:16px; font-size:11px; }
  .footer__copy { font-size:10px; }
}

@media (max-width: 350px) {
  .welfare-top-card__img {display: none;}
}