@charset "utf-8";

/* 채용공고 */
.recruit-sub { color: var(--font-color); padding-top: 100px; padding-bottom: 188px; }

/* 서브 비주얼 */
.sub-hero.sub-hero--recruit { background-color: #2a3540; background-image: url("/resources/images/common/sub_visual_recruit.jpg"); }

/* 본문 상단 */
.recruit-sub__head { margin-bottom: 25px; }
.recruit-sub__title-block { min-width: 0; }
.recruit-sub__page-title { margin: 0; font-family: var(--title-font-family); font-size: var(--fs-42); font-weight: 700; line-height: 1.3; color: var(--font-color); }
.recruit-sub__count { margin: 70px 0 0; font-size: var(--fs-20); font-weight: 400; color: var(--font-sec-color); }
.recruit-sub__count-num { font-weight: 700; color: var(--primary-color); }

/* 채용 카드 그리드 (--inner-max-width 1400px 기준 카드 427×240) */
.recruit-cards { --recruit-card-w: 427px; --recruit-card-min-h: 240px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 30px; margin: 0; padding: 40px 0 40px; list-style: none; border-top: 2px solid #000000; border-bottom: 1px solid #999999; }
.recruit-cards__item { margin: 0; min-width: 0; }
.recruit-card { margin: 0; }
.recruit-card__link { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; min-height: var(--recruit-card-min-h); height: auto; padding: 28px 24px 30px; color: inherit; text-decoration: none; border: 1px solid #999999; background-color: var(--light-color); transition: border-color 0.2s, color 0.2s; }
.recruit-sub .recruit-card__link { position: relative; padding-bottom: 52px; }
.recruit-card__link:hover, .recruit-card__link:focus-visible { border: 2px solid var(--primary-color); }
.recruit-card__link:hover .recruit-card__title, .recruit-card__link:focus-visible .recruit-card__title { text-decoration: underline; }
.recruit-card__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 20px; }
.recruit-card__badge { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; padding: 4px 12px; font-size: var(--fs-16); font-weight: 700; line-height: 1.3; color: var(--light-color); white-space: nowrap; }
.recruit-card__badge--new { background-color: #0082cf; }
.recruit-card__badge--career { background-color: #005891; }
.recruit-card__badge--both { background-color: #005891; }
.recruit-card__status { flex: 0 0 auto; font-size: var(--fs-16); font-weight: 400; line-height: 1.4; white-space: nowrap; }
.recruit-card__status--open { color: #0082cf; font-weight: 700; }
.recruit-card__status--closed { color: #666666; font-weight: 700; }
.recruit-card__title { margin: 0; font-size: var(--fs-24); font-weight: 700; line-height: 1.45; color: #000000; transition: color 0.2s; word-break: keep-all; overflow-wrap: break-word; }
.recruit-sub .recruit-card__deadline { position: absolute; left: 24px; right: 24px; bottom: 16px; margin: 0; font-size: var(--fs-16); font-weight: 600; line-height: 1.4; color: #000000; }

/* 검색 결과 없음 */
.recruit-cards.recruit-cards--empty { display: block; padding: 90px 16px; }
.recruit-cards__empty-item { margin: 0; min-width: 0; list-style: none; }
.recruit-sub__empty { --recruit-empty-icon-gap: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 36rem; margin: 0 auto; }
.recruit-sub__empty-icon { margin: 0 0 var(--recruit-empty-icon-gap); line-height: 0; }
.recruit-sub__empty-icon img { display: block; width: auto; max-width: min(90px, 40vw); height: auto; }
.recruit-sub__empty-title { margin: 0 0 14px; font-size: var(--fs-20); font-weight: 400; line-height: 1.5; color: var(--font-color); text-align: center; }
.recruit-sub__empty-keyword { font-weight: 700; color: #005891; }
.recruit-sub__empty-desc { margin: 0; font-size: var(--font-size-body); font-weight: 400; line-height: 1.65; color: #666666; text-align: center; }

/* 1400px 콘텐츠 영역(뷰포트 1448px+) — 카드 너비 427px, 최소 높이 240px */
@media (min-width: 1448px) {
  .recruit-cards { grid-template-columns: repeat(3, var(--recruit-card-w)); column-gap: calc((100% - var(--recruit-card-w) * 3) / 2); row-gap: 30px; }
  .recruit-card__link { width: var(--recruit-card-w); max-width: 100%; min-height: var(--recruit-card-min-h); }
}

/* 채용공고 상세 (recruitment_view.jsp) */
.recruit-view__head { margin: 0 0 30px; padding-bottom: 22px; border-bottom: 2px solid #000000; }
.recruit-view__inset { --recruit-view-inset-x: 124px; box-sizing: border-box; min-width: 0; padding-left: var(--recruit-view-inset-x); padding-right: var(--recruit-view-inset-x); }
.recruit-view__rule { display: block; width: calc(100% + 2 * var(--recruit-view-inset-x)); max-width: none; height: 0; margin: 0 calc(-1 * var(--recruit-view-inset-x)) 32px; border: 0; border-top: 1px solid #cccccc; box-sizing: border-box; }
.recruit-view__rule:last-of-type { margin-top: 66px; margin-bottom: 0; border-top-width: 2px; border-top-color: #999999; }
.recruit-view__section-title { margin: 0; font-family: var(--title-font-family); font-size: var(--fs-42); font-weight: 700; line-height: 1.3; color: var(--font-color); }
.recruit-view__article { margin: 0; padding-bottom: 30px; }
.recruit-view__article-title { margin: 0 0 14px; font-size: var(--fs-24); font-weight: 700; line-height: 1.35; color: #000000; }
.recruit-view__article-date { display: block; font-size: var(--fs-16); font-weight: 400; color: #666666; }
.recruit-view__files { display: flex; align-items: stretch; margin: 60px 0 60px; padding: 20px 24px 20px 60px; background-color: #eeeeee; box-sizing: border-box; gap: 0; }
.recruit-view__files-label { flex: 0 0 auto; align-self: stretch; display: flex; align-items: center; margin: 0; padding: 0 54px 0 0; border-right: 1px solid #999999; font-size: var(--fs-20); font-weight: 700; font-family: inherit; color: #005891; line-height: 1.4; white-space: nowrap; }
.recruit-view__files-list { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0 0 0 30px; list-style: none; }
.recruit-view__files-list li + li { margin-top: 8px; }
.recruit-view__files-list a { font-size: var(--font-size-body); font-weight: 400; color: #000000; text-decoration: underline; }
.recruit-view__files-list a:visited { color: #000000; }
.recruit-view__content { margin: 0; padding-bottom: 0; font-size: var(--font-size-body); font-weight: 400; line-height: 1.75; color: #000000; }
.recruit-view__content p { margin: 0 0 1em; }
.recruit-view__content p:last-child { margin-bottom: 0; }
.recruit-view__visual { margin: 35px 0 30px; text-align: center; line-height: 0; }
.recruit-view__visual img { display: block; width: 100%; max-width: 1200px; height: auto; margin: 0 auto; }
.recruit-view__cta { margin: 0; text-align: center; }
.recruit-view__btn-go { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 225px; height: 57px; padding: 0; border: 1px solid var(--btn-accent-color); background-color: var(--btn-accent-color); color: #ffffff; font-size: var(--fs-16); font-weight: 700; line-height: 1.4; text-decoration: none; transition: background-color 0.2s ease, border-color 0.2s ease; }
.recruit-view__btn-go:hover, .recruit-view__btn-go:focus-visible { background-color: var(--btn-accent-hover); border-color: var(--btn-accent-hover); }
.recruit-view__actions { margin: 30px 0 80px; text-align: center; }
.recruit-view__btn-list { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 225px; height: 57px; padding: 0; border: 1px solid #005891; background-color: #005891; color: #ffffff; font-size: var(--fs-16); font-weight: 700; letter-spacing: 0.04em; text-decoration: none; text-transform: uppercase; transition: background-color 0.2s ease, border-color 0.2s ease; }
.recruit-view__btn-list:hover, .recruit-view__btn-list:focus-visible { background-color: var(--btn-primary-hover); border-color: var(--btn-primary-hover); }
.recruit-view__pager { border-top: 1px solid #cccccc; }
.recruit-view__pager-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; width: 100%; margin: 0; padding: 18px 60px; border: 0; border-bottom: 1px solid #cccccc; box-sizing: border-box; background: none; font-family: inherit; font-size: inherit; text-align: left; color: inherit; text-decoration: none; cursor: pointer; }
.recruit-view__pager-row:visited { color: inherit; }
.recruit-view__pager-icon { flex: 0 0 auto; display: flex; align-items: center; line-height: 0; }
.recruit-view__pager-icon img { display: block; width: auto; height: auto; max-height: 22px; }
.recruit-view__pager-label { flex: 0 0 auto; font-size: var(--font-size-body); font-weight: 700; color: #666666; }
.recruit-view__pager-body { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 20px; }
.recruit-view__pager-title { flex: 1 1 auto; min-width: 0; font-size: var(--font-size-body); font-weight: 400; color: #000000; transition: color 0.2s; }
.recruit-view__pager-row:hover .recruit-view__pager-title, .recruit-view__pager-row:focus-visible .recruit-view__pager-title { color: #005891; font-weight: 700; text-decoration: underline; }
.recruit-view__pager-date { flex: 0 0 auto; margin-left: auto; font-size: var(--fs-16); font-weight: 400; color: #666666; }

@media (min-width: 769px) and (max-width: 1024px) {
  .recruit-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
}

/* 인재상 (ideal_candidate.jsp) */
.ideal-sub { color: var(--font-color); padding-top: 100px; padding-bottom: 188px; }
.ideal-sub__intro { margin-bottom: 55px; }
.ideal-sub .page-title { margin-bottom: 0; }
.ideal-diagram { --ideal-bg-w: 1400px; --ideal-bg-h: 1014px; --ideal-bg-scaled-h: min(var(--ideal-bg-h), calc(min(var(--ideal-bg-w), 100vw - 48px) * 1014 / 1400)); --ideal-quote-margin-top: 50px; --ideal-stage-inset-left: 60px; position: relative; min-height: max(var(--ideal-bg-scaled-h), 720px); padding-bottom: 100px; overflow: visible; }
.ideal-diagram__bg { position: absolute; top: 0; left: 50%; width: min(100%, var(--ideal-bg-w)); height: var(--ideal-bg-scaled-h); max-height: var(--ideal-bg-h); transform: translateX(-50%); background-color: #f3f9fc; background-image: url("/resources/images/recruit/bg_ideal_candidate.png"); background-repeat: no-repeat; background-position: center top; background-size: 100% 100%; pointer-events: none; }
.ideal-diagram__content { position: relative; z-index: 1; padding-top: var(--ideal-quote-margin-top); overflow: visible; }
.ideal-quote { margin: 0 0 40px; padding: 0; border: 0; text-align: center; }
.ideal-quote__text { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.45em; margin: 0; padding: 0; font-size: var(--fs-32); font-weight: 700; line-height: 1.5; color: #000000; word-break: keep-all; }
.ideal-quote__ico { display: block; flex-shrink: 0; width: 25px; height: 23px; }
.ideal-quote__ico--left { --ideal-quote-ico-offset-y: 10px; transform: translateY(calc(-1 * var(--ideal-quote-ico-offset-y))); }
.ideal-quote__ico--right { --ideal-quote-ico-offset-y: 2px; display: inline-block; flex-shrink: 0; vertical-align: bottom; transform: translateY(var(--ideal-quote-ico-offset-y)) translateX(9px); }
.ideal-quote__body { text-align: center; }
.ideal-quote__line1,
.ideal-quote__line2 { display: inline; }
.ideal-quote__line2-text { display: inline; }
.ideal-quote__line1::after { content: '\00a0'; }
.ideal-diagram__stage { display: flex; justify-content: flex-start; width: 100%; margin: 0; overflow: visible; }
/* 다이어그램(896×630) 기준 % — 01·제목·설명 블록(.ideal-point) 전체 이동 */
.ideal-diagram__canvas {
  --ideal-canvas-w: 896px;
  --ideal-canvas-span: 1.4625; /* 좌·우 텍스트 돌출 포함 전체 너비 비율 */
  --ideal-point-01-left: -5%;
  --ideal-point-01-top: 16%;
  --ideal-point-01-width: 31.25%;
  --ideal-point-02-left: 102%;
  --ideal-point-02-top: 32%;
  --ideal-point-02-width: 31.25%;
  --ideal-point-03-left: 65%;
  --ideal-point-03-top: 98%;
  --ideal-point-03-width: 44.64%;
  position: relative;
  width: min(100%, var(--ideal-canvas-w));
  aspect-ratio: 896 / 630;
  overflow: visible;
}
.ideal-diagram__picture { display: block; width: 100%; line-height: 0; }
.ideal-diagram__img { display: block; width: 100%; height: auto; }
.ideal-point { position: static; z-index: 2; width: 100%; max-width: 520px; text-align: left; }
.ideal-point__head { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 0; font-family: inherit; }
.ideal-point__num { font-size: var(--fs-20); font-weight: 800; line-height: 1.2; color: #005891; }
.ideal-point__name { font-size: var(--fs-32); font-weight: 700; line-height: 1.2; color: #000000; }
.ideal-point__desc { margin: 10px 0 0; font-size: var(--fs-20); font-weight: 400; line-height: 1.65; color: #000000; word-break: keep-all; }

/* 1024px 이상: 다이어그램+텍스트 오버레이 유지, 뷰포트에 맞게 비율 축소 */
@media (min-width: 1024px) {
  .ideal-diagram__stage { max-width: var(--ideal-bg-w); container-type: inline-size; container-name: ideal-stage; }
  .ideal-diagram__canvas {
    --ideal-canvas-fit-w: min(var(--ideal-canvas-w), calc((100cqi - var(--ideal-stage-inset-left)) / var(--ideal-canvas-span)));
    width: min(100%, var(--ideal-canvas-w));
    width: var(--ideal-canvas-fit-w);
    max-width: 100%;
    margin-left: calc(var(--ideal-stage-inset-left) + var(--ideal-canvas-fit-w) * 0.08);
    font-size: calc(var(--ideal-canvas-fit-w) / var(--ideal-canvas-w) * 16px);
  }
  .ideal-point { position: absolute; width: var(--ideal-point-width, auto); max-width: none; margin: 0; transform: none; }
  .ideal-point__num { font-size: 1.25em; }
  .ideal-point__name { font-size: 2em; }
  .ideal-point__desc { margin-top: 0.625em; font-size: 1.25em; }
  .ideal-point--01 { --ideal-point-width: var(--ideal-point-01-width); left: var(--ideal-point-01-left); top: var(--ideal-point-01-top); }
  .ideal-point--02 { --ideal-point-width: var(--ideal-point-02-width); left: var(--ideal-point-02-left); top: var(--ideal-point-02-top); }
  .ideal-point--03 { --ideal-point-width: var(--ideal-point-03-width); left: var(--ideal-point-03-left); top: var(--ideal-point-03-top); transform: translateX(-50%); }
}

@media (min-width: 1024px) and (max-width: 1359px) {
  .ideal-diagram { --ideal-stage-inset-left: clamp(24px, 6vw, 60px); --ideal-quote-margin-top: 36px; }
  .ideal-quote__text { font-size: clamp(22px, 2.6vw, var(--fs-32)); }
}

/* 1024px 이하: 모바일 배경 + 세로 스택 중앙 정렬 */
@media (max-width: 1024px) {
  .ideal-sub { padding-bottom: 100px; }
  .ideal-diagram { min-height: 0; padding-bottom: 0; overflow: hidden; }
  .ideal-diagram { --ideal-bg-mo-color: #e0eff9; background-color: var(--ideal-bg-mo-color); }
  .ideal-diagram__bg {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    aspect-ratio: unset;
    transform: none;
    background-color: var(--ideal-bg-mo-color, #e0eff9);
    background-image: url("/resources/images/recruit/bg_ideal_candidate_mo.png");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center top;
  }
  .ideal-diagram__content { padding-top: 60px; padding-bottom: 70px; }
  .ideal-diagram__stage { justify-content: center; width: 100%; }
  .ideal-diagram__canvas {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    width: min(100%, 500px);
    max-width: 100%;
    margin-left: 0;
    aspect-ratio: auto;
  }
  .ideal-diagram__picture { order: 1; width: 100%; }
  .ideal-point { position: static; width: 100%; max-width: 520px; transform: none; }
  .ideal-point--01 { order: 2; }
  .ideal-point--02 { order: 3; }
  .ideal-point--03 { order: 4; }
  .ideal-point__desc br { display: none; }
}

/* 769~1023px */
@media (min-width: 769px) and (max-width: 1023px) {
  .ideal-diagram { --ideal-quote-margin-top: 48px; }
  .ideal-point__num { font-size: var(--fs-20); }
  .ideal-point__name { font-size: var(--fs-26); }
  .ideal-point__desc { font-size: var(--fs-20); }
}

/* 복리후생 (benefits.jsp) */
.benefits-sub { color: var(--font-color); padding-top: 100px; padding-bottom: 188px; }
.benefits-sub__intro { margin-bottom: 55px; }
.benefits-sub .page-title { margin-bottom: 0; }
.benefits-section + .benefits-section { margin-top: 60px; }
.benefits-section__title { margin: 0 0 30px; font-family: var(--title-font-family); font-size: var(--fs-32); font-weight: 700; line-height: 1.35; color: #005891; text-align: center; }
.benefit-cards { --benefit-card-w: 432px; --benefit-card-h: 180px; --benefit-card-gap: 30px; display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.benefit-cards__item { margin: 0; min-width: 0; }

@media (min-width: 1360px) {
  .benefit-cards { --benefit-card-gap-x: calc((100% - var(--benefit-card-w) * 3) / 2); justify-content: flex-start; row-gap: var(--benefit-card-gap); column-gap: var(--benefit-card-gap-x); }
  .benefit-cards__item { flex: 0 0 var(--benefit-card-w); width: var(--benefit-card-w); }
  .benefit-cards--work > .benefit-cards__item:nth-child(4) { margin-left: calc((100% - var(--benefit-card-w) * 2 - var(--benefit-card-gap-x)) / 2); }
}

/* 769~1359px: 2열 그리드 — 좌열(1·3·5) ①~③, 우열(2·4) ④~② 전체 너비 */
@media (min-width: 769px) and (max-width: 1359px) {
  .benefit-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--benefit-card-gap); width: 100%; }
  .benefit-cards__item { width: 100%; max-width: none; justify-self: stretch; }
  /* 홀수 마지막(근무 5번·기타 3번): 좌열과 동일 정렬·너비 */
  .benefit-cards__item:last-child:nth-child(odd) { grid-column: 1; justify-self: stretch; }
  .benefit-cards--work > .benefit-cards__item:nth-child(4) { margin-left: 0; }
}
.benefit-card { position: relative; box-sizing: border-box; width: 100%; height: var(--benefit-card-h); min-height: var(--benefit-card-h); padding: 30px 108px 30px 28px; background-color: #eef5fb; overflow: hidden; }
.benefit-card__title { margin: 0 0 10px; font-size: var(--fs-20); font-weight: 700; line-height: 1.35; color: #000000; }
.benefit-card__list { margin: 0; padding: 0; list-style: none; font-size: var(--fs-16); font-weight: 400; line-height: 1.5; color: #000000; }
.benefit-card__list > li { position: relative; padding-left: 14px; word-break: keep-all; overflow-wrap: break-word; }
.benefit-card__list > li::before { content: ''; position: absolute; left: 0; top: 0.72em; width: 4px; height: 4px; background-color: #000000; transform: translateY(-50%); }
.benefit-card__list > li + li { margin-top: 2px; }
.benefit-card__icon { position: absolute; right: 25px; bottom: 26px; line-height: 0; pointer-events: none; }
.benefit-card__icon img { display: block; width: auto; max-width: 56px; height: auto; max-height: 56px; }


@media (max-width: 520px) {
  .ideal-diagram { background-color: #e0eff9; }
  .ideal-diagram__bg { background-color: #e0eff9; min-height: 100%; }
  .ideal-diagram__canvas { box-sizing: border-box; padding-left: 12px; padding-right: 12px; }
  .ideal-point { padding-left: 4px; }
}

@media (max-width: 870px) {
  .ideal-quote__text { font-size: var(--fs-26); gap: 0.35em; }
}

@media (max-width: 768px) {
  .ideal-sub { padding-top: 60px; }
  .ideal-sub__intro { margin-bottom: 40px; }
  .ideal-sub .page-title { font-size: 32px; }
  .ideal-diagram { --ideal-quote-margin-top: 32px; }
  .ideal-quote { margin-bottom: 32px; }
  .ideal-quote__text { display: inline-grid; grid-template-columns: auto auto; column-gap: 0.35em; align-items: start; }
  .ideal-quote__body { text-align: center; }
  .ideal-quote__line1 { display: block; }
  .ideal-quote__line1::after { content: none; }
  .ideal-quote__line2 { display: inline-flex; align-items: flex-end; justify-content: center; gap: 0.4em; width: 100%; }
  .ideal-quote__line2-text { display: inline; }
  .ideal-quote__ico { width: 20px; height: 18px; }
  .ideal-quote__ico--left { --ideal-quote-ico-offset-y: 2px; }
  .ideal-quote__ico--right { --ideal-quote-ico-offset-y: -1px; transform: translateX(2px);}
  .ideal-diagram__canvas { gap: 28px; width: min(100%, 420px); }
  .ideal-point { max-width: 100%; }
  .ideal-point--03 { text-align: left; }
  .ideal-point__num { font-size: var(--fs-18); }
  .ideal-point__name { font-size: var(--fs-26); }
  .ideal-point__desc br { display: none; font-size: var(--fs-18); }
  .benefits-sub { padding-top: 60px; padding-bottom: 100px; }
  .benefits-sub__intro { margin-bottom: 40px; }
  .benefits-sub .page-title { font-size: 32px; }
  .benefits-section + .benefits-section { margin-top: 54px; }
  .benefits-section__title { margin-bottom: 24px; font-size: var(--fs-26); }
  .benefit-cards { --benefit-card-gap: 20px; display: flex; flex-direction: column; align-items: stretch; width: 100%; gap: var(--benefit-card-gap); }
  .benefit-cards__item { width: 100%; max-width: none; }
  .benefit-cards--work > .benefit-cards__item:nth-child(4) { margin-left: 0; }
  .benefit-card { height: var(--benefit-card-h); min-height: var(--benefit-card-h); padding: 30px 96px 20px 30px; }
  .benefit-card__title { font-size: var(--fs-18); }
  .benefit-card__list { font-size: var(--fs-16); }
  .benefit-card__icon { right: 24px; bottom: 24px; }
}

@media (max-width: 768px) {
  .recruit-sub { padding-top: 60px; padding-bottom: 100px; }
  .recruit-sub__page-title { font-size: 32px; }
  .recruit-sub__count { margin-top: 22px; font-size: var(--fs-18); }
  .recruit-cards { grid-template-columns: 1fr; gap: 20px; padding-top: 50px; padding-bottom: 50px; }
  .recruit-card__link { min-height: 0; padding: 40px 35px 68px; }
  .recruit-sub .recruit-card__link { padding-bottom: 68px; }
  .recruit-sub .recruit-card__deadline { left: 35px; right: 35px; bottom: 24px; }
  .recruit-card__meta { margin-bottom: 16px; }
  .recruit-card__title { font-size: var(--fs-20); }
  .recruit-sub__empty-title { font-size: var(--fs-18); }
  .recruit-view__inset { --recruit-view-inset-x: var(--inner-padding-x); padding-left: var(--recruit-view-inset-x); padding-right: var(--recruit-view-inset-x); }
  .recruit-view__section-title { font-size: 32px; }
  .recruit-view__article-title { font-size: var(--fs-20); }
  .recruit-view__files { flex-direction: row; align-items: stretch; margin: 50px 0; padding: 16px 16px 16px 20px; }
  .recruit-view__actions { margin-bottom: 60px; }
  .recruit-view__files-label { align-self: stretch; margin: 0; padding: 0 16px 0 0; border-right: 1px solid #999999; border-bottom: 0; white-space: nowrap; font-size: var(--fs-18); }
  .recruit-view__files-list { padding: 0 0 0 16px; }
  .recruit-view__visual { margin-top: 50px; margin-bottom: 20px; }
  .recruit-view__btn-go, .recruit-view__btn-list { width: min(100%, 225px); height: 57px; }
  .recruit-view__pager-row { flex-wrap: nowrap; align-items: center; gap: 8px 10px; padding: 14px var(--inner-padding-x); }
  .recruit-view__pager-icon, .recruit-view__pager-label { align-self: center; }
  .recruit-view__pager-body { flex-direction: column; align-items: flex-start; gap: 6px; padding-left: 40px; }
  .recruit-view__pager-title { width: 100%; }
  .recruit-view__pager-date { margin-left: 0; width: auto; text-align: left; font-size: var(--fs-14); color: #666666; }
}