/* cmshub UI 보강 (2026-10-17)
   - 홈 대표 제목(H1)·구간 제목(H2) 태그 정리: 기존 모양 그대로
   - 첫 화면 [가입 상담][전화 상담] 버튼
   - 문의 버튼 배치: PC 1440px 이상 = 오른쪽 여백(본문 밖) 세로 메뉴 / 1439px 이하 = 하단 고정 바 / 모바일 = 하단 [전화][가입 상담] 바
   - 채팅(채널톡) 버튼은 우리 버튼(.cms-chat)으로 바꿔 하단 바 위에 따로 둔다(채널톡 공식 boot 옵션 hideChannelButtonOnBoot + showMessenger)
   - 모바일 가로 넘침(푸터 1200px) 정리, 키보드 포커스 표시 */

:root {
  --cms-blue: #0b3379;
  --cms-blue2: #0064ff;
  --cms-yellow: #fdb813;
  --cms-ink: #1d2433;
  --cms-bar-h: 60px;
  --cms-safe-b: env(safe-area-inset-bottom, 0px);
}

/* 하단 고정 바가 있는 화면폭: 입력칸으로 이동(포커스·탭)할 때 바·채팅 버튼 뒤로 숨지 않게 */
@media screen and (max-width: 1439px) {
  html { scroll-padding-bottom: calc(var(--cms-bar-h) + 100px + var(--cms-safe-b)); }
}

/* 화면 읽기 프로그램용 숨김 글자 */
.cms-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* 키보드 포커스 표시 */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--cms-yellow);
  outline-offset: 2px;
}

/* ---------- 제목 태그 정리(모양은 기존 p·h2 와 같게) ---------- */
.header_wrap .header_logo_h { position: absolute; left: 0; top: 15px; width: 200px; margin: 0; }
.fp_inner .txt_box > .cms-hero-title,
.fp_inner .txt_box > .cms-sec-title { margin: 0; font-size: 58px; line-height: 65px; color: #fff; font-weight: 300; letter-spacing: -1.4px; }
.fp_inner .txt_box > .cms-hero-title strong,
.fp_inner .txt_box > .cms-sec-title strong { font-weight: 500; }
.txtbox1 .txtbox1_label { margin: 0; font-size: 18px; color: var(--cms-yellow); font-weight: 700; padding-bottom: 0; }
.txtbox1 .txtbox1_unit { font-size: .62em; font-weight: 700; white-space: nowrap; margin-left: 2px; }
.fp_inner .txt_box > p.cms-stat-src { margin-top: 10px; font-size: 12px; line-height: 1.5; letter-spacing: 0; font-weight: 400; color: rgba(255,255,255,.75); }
.gnb_cont p.gnb_tit, .allMenu p { margin: 0; }
#footer .address .cms-foot-logo { float: left; margin: 0 50px 0 0; }
@media screen and (max-width: 1100px) {
  .fp_inner .txt_box > .cms-hero-title, .fp_inner .txt_box > .cms-sec-title { font-size: 30px; line-height: 40px; }
}
@media screen and (max-width: 767px) {
  /* 2026-10-17 모바일 글자 크기 cms.co.kr 기준: 첫 화면 제목 26px 굵게, 구간 제목 22px 굵게(긴 문장이라 한 단계 작게) */
  .fp_inner .txt_box > .cms-hero-title { font-size: 26px; line-height: 1.35; font-weight: 700; letter-spacing: -.6px; }
  .fp_inner .txt_box > .cms-sec-title { font-size: 22px; line-height: 1.4; font-weight: 700; letter-spacing: -.5px; }
  .fp_inner .txt_box > .cms-hero-title strong, .fp_inner .txt_box > .cms-sec-title strong { font-weight: 700; }
  .fp_item1 .fp_inner .txt_box > span { font-size: 15px; line-height: 1.6; }
  .fp_inner .txt_box > .cms-hero-title br, .fp_inner .txt_box > .cms-sec-title br { display: none; }
  .txtbox1 .txtbox1_label { font-size: 13px; }
  .txtbox1 { width: 32%; padding-top: 22px; white-space: nowrap; }
  .txtbox1 > .counter, .txtbox1 > .counter2, .txtbox1 > .counter3 { font-size: 24px !important; line-height: 32px !important; }
  .txtbox1 .txtbox1_unit { font-size: 13px; margin-left: 1px; }
  .fp_inner .txt_box > p.cms-stat-src { font-size: 12px; margin-top: 6px; }
  .cms-hide-m { display: none; }
}

/* ---------- 첫 화면 CTA ---------- */
.cms-hero-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 28px; }
.fp_inner .txt_box .cms-hero-cta a, .fp_inner .txt_box .cms-hero-cta button { margin-top: 0; }
.cms-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; min-width: 180px; padding: 0 26px; border-radius: 999px;
  font-size: 17px; font-weight: 700; line-height: 1.2; letter-spacing: -.3px;
  border: 2px solid transparent; cursor: pointer; text-decoration: none; box-sizing: border-box;
}
.fp_inner .txt_box .cms-btn { height: auto; width: auto; line-height: 1.2; }
.cms-btn--primary { background: var(--cms-yellow); color: #1b1300 !important; border-color: var(--cms-yellow); }
.cms-btn--primary:hover { background: #ffc73a; }
.cms-btn--ghost { background: rgba(0,0,0,.25); color: #fff !important; border-color: #fff; }
.cms-btn--ghost:hover { background: rgba(255,255,255,.15); }
.cms-btn .xi { font-size: 20px; }
@media screen and (max-width: 767px) {
  .cms-hero-cta { gap: 8px; margin-top: 18px; padding: 0 16px; }
  .cms-btn { min-width: 0; flex: 1 1 140px; min-height: 48px; font-size: 15px; padding: 0 14px; }
}

/* ---------- 문의 버튼: PC (.cms-quick = 기존 .rightinbox 자리) ---------- */
.rightinbox.cms-quick {
  position: fixed; z-index: 990; box-sizing: border-box;
  background: none; padding: 0; border-radius: 0; width: auto; text-align: center; list-style: none;
}
.cms-quick .cms-quick__primary,
.cms-quick .cms-quick__tel,
.cms-quick .cms-quick__sub a {
  display: flex; align-items: center; justify-content: center; gap: 6px; box-sizing: border-box;
  min-height: 44px; text-decoration: none; letter-spacing: -.3px; cursor: pointer;
}
.cms-quick .other-link > button.cms-quick__primary {
  width: 100%; background: var(--cms-yellow); color: #1b1300; border: 0; border-radius: 14px;
  font-size: 15px; font-weight: 700; padding: 10px 8px; line-height: 1.25; transition: none;
}
.cms-quick .other-link > button.cms-quick__primary:hover { background: #ffc73a; }
.cms-quick .cms-quick__tel { background: var(--cms-blue); color: #fff; border-radius: 14px; font-weight: 700; font-size: 15px; padding: 8px; flex-direction: column; gap: 0; line-height: 1.2; }
.cms-quick .cms-quick__tel small { font-size: 11px; font-weight: 500; opacity: .85; }
.cms-quick .cms-quick__sub { display: flex; flex-direction: column; gap: 6px; }
.cms-quick .cms-quick__sub a { background: #fff; color: #44506a; border: 1px solid #c9d1e2; border-radius: 12px; font-size: 12px; font-weight: 600; padding: 6px; line-height: 1.25; }
.cms-quick .cms-quick__sub a:hover { border-color: var(--cms-blue2); color: var(--cms-blue2); }
.cms-quick .cms-quick__label { display: block; font-size: 10px; font-weight: 600; color: #7a8599; margin: 2px 0 -2px; }

.cms-quick .cms-quick__sub a .xi { display: none; }

/* PC 넓은 화면: 본문(1200px) 밖 오른쪽 여백에 세로 배너(흰 카드).
   1440~1599px 은 업종 아이콘 바(1200px)와 8px 간격을 지키려고 100px, 1600px 이상은 132px 로 키운다 */
@media screen and (min-width: 1440px) {
  .rightinbox.cms-quick {
    top: 50%; right: 12px; bottom: auto; left: auto; transform: translateY(-50%);
    width: 100px; display: flex; flex-direction: column; gap: 6px;
    max-height: calc(100vh - 160px); overflow: visible;
    padding: 6px; background: #fff; border-radius: 18px; box-shadow: 0 10px 28px rgba(9,30,66,.22);
  }
  .cms-quick .other-link > button.cms-quick__primary {
    flex-direction: column; gap: 4px; min-height: 74px; border-radius: 13px; font-size: 16px; padding: 10px 4px;
  }
  .cms-quick .other-link > button.cms-quick__primary .xi {
    display: block !important; position: static; width: auto; height: auto; margin: 0; padding: 0; opacity: 1; transform: none;
    font-size: 24px; line-height: 1; color: inherit; background: none;
  }
  .cms-quick .cms-quick__tel { min-height: 62px; border-radius: 13px; font-size: 16px; padding: 8px 2px; letter-spacing: -.5px; }
  .cms-quick .cms-quick__tel small { font-size: 12px; margin-bottom: 2px; }
  .cms-quick .cms-quick__label { font-size: 11px; margin: 4px 0 0; }
  .cms-quick .cms-quick__sub a { flex-direction: column; gap: 3px; min-height: 56px; border-radius: 12px; font-size: 13px; padding: 6px 2px; }
  .cms-quick .cms-quick__sub a .xi { display: block; font-size: 20px; line-height: 1; color: var(--cms-blue2); }
}
@media screen and (min-width: 1600px) {
  .rightinbox.cms-quick { width: 132px; padding: 8px; gap: 8px; right: 16px; }
  .cms-quick .other-link > button.cms-quick__primary { min-height: 84px; font-size: 17px; }
  .cms-quick .other-link > button.cms-quick__primary .xi { font-size: 28px; }
  .cms-quick .cms-quick__tel { min-height: 70px; font-size: 19px; }
  .cms-quick .cms-quick__sub a { min-height: 62px; font-size: 14px; }
  .cms-quick .cms-quick__sub a .xi { font-size: 22px; }
}
@media screen and (min-width: 1440px) {
  /* 1440px 에서 1200px(오른쪽 메뉴와 8px 간격). 1180px 로 줄이면 마지막 아이콘이 둘째 줄로 내려가 수치를 가렸다 */
  .fp_item1 .service_box { max-width: calc(100vw - 240px); white-space: nowrap; }
  .fp_item1 .service_box li { white-space: normal; }
}
/* 첫 화면 가운데 상담·전화 버튼은 싣지 않는다(운영자 요청 2026-10-17). 상담은 오른쪽 배너(1440px 이상)·하단 바로 받는다.
   수치 출처 문구는 PC·태블릿(768px 이상)에서만 뺀다 */
.fp_item1 .cms-hero-cta { display: none; }
@media screen and (min-width: 768px) {
  .fp_inner .txt_box > p.cms-stat-src { display: none; }
}
/* 모바일: 실제 보이는 높이(사파리 주소창·도구막대 제외, 예 390×664·375×548)에서 첫 화면 제목이 위 로고·전화번호(아래 끝 72px)에
   겹치던 문제 — 내용 위에 머리말 높이만큼 여백을 둔다. 공간이 넉넉하면 지금처럼 가운데, 모자라면 머리말 바로 아래부터 시작 */
@media screen and (max-width: 767px) {
  .fp_item1 .fp_inner { padding-top: 118px; }
}
/* 높이가 낮은 PC 화면: 첫 화면 제목·수치가 업종 아이콘 바에 가리지 않게 크기·간격만 줄인다.
   브라우저 실제 보이는 높이 기준(예: 1440×900 노트북 ≈ 789px, 1366×768 ≈ 657px) */
@media screen and (min-width: 768px) and (max-height: 820px) {
  .fp_inner .txt_box > .cms-hero-title { font-size: 46px; line-height: 54px; }
  .fp_item1 .txtbox1 { padding-top: 22px; }
  .fp_item1 .service_box { bottom: 110px; }
}
@media screen and (min-width: 768px) and (max-height: 690px) {
  .fp_inner .txt_box > .cms-hero-title { font-size: 38px; line-height: 46px; }
  .fp_item1 .txt_box > span { font-size: 16px; line-height: 24px; }
  .fp_item1 .txtbox1 { padding-top: 12px; }
  .fp_item1 .txtbox1 > .counter, .fp_item1 .txtbox1 > .counter2, .fp_item1 .txtbox1 > .counter3 { font-size: 42px; line-height: 44px; }
  .fp_item1 .service_box { bottom: 96px; }
}
/* PC 좁은 화면·태블릿: 하단 고정 바(본문 아래 여백 확보) */
@media screen and (min-width: 768px) and (max-width: 1439px) {
  .rightinbox.cms-quick {
    left: 0; right: 0; bottom: 0; top: auto; transform: none;
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 8px 88px calc(8px + var(--cms-safe-b)) 16px;
    background: rgba(255,255,255,.97); border-top: 1px solid #d9dfeb; box-shadow: 0 -4px 16px rgba(9,30,66,.10);
  }
  .rightinbox.cms-quick > * { flex: 0 1 auto; }
  .cms-quick .other-link { width: 200px; }
  .cms-quick .cms-quick__tel { flex-direction: row; gap: 8px; width: 200px; }
  .cms-quick .cms-quick__sub { flex-direction: row; }
  .cms-quick .cms-quick__sub a { width: 110px; }
  .cms-quick .cms-quick__label { display: none; }
  body.cms-has-bar { padding-bottom: calc(var(--cms-bar-h) + 90px + var(--cms-safe-b)); }
  /* 상담 신청 창: 바 위쪽에 연다 */
  .cms-quick .other-link ul, .cms-quick .other-link.on ul { right: auto; left: 0; bottom: calc(100% + 12px); }
}
/* 768~1239px: 업종 아이콘 바가 화면 밖으로 잘리지 않게 */
@media screen and (min-width: 768px) and (max-width: 1239px) {
  .fp_item1 .service_box { width: auto; left: 16px; right: 16px; margin-left: 0; text-align: center; }
  .fp_item1 .service_box li { width: 96px; }
}
/* 기존 오른쪽 대표번호 이미지 상자(href="#")는 대표전화 버튼으로 대체 */
.rightinbox2 { display: none !important; }

/* ---------- 채팅 버튼(우리 버튼 → 채널톡 메신저 열기) ---------- */
.cms-chat {
  position: fixed; right: 16px; bottom: calc(16px + var(--cms-safe-b)); z-index: 995;
  width: 56px; height: 56px; border-radius: 50%; border: 0; cursor: pointer;
  background: #3355ff; color: #fff; box-shadow: 0 6px 18px rgba(20,40,120,.35);
  display: flex; align-items: center; justify-content: center; padding: 0;
}
.cms-chat .xi { font-size: 26px; line-height: 1; }
.cms-chat__badge { position: absolute; top: -2px; right: -2px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: #ff3b30; color: #fff; font-size: 12px; font-weight: 700; line-height: 20px; box-sizing: border-box; }
.cms-chat__badge[hidden] { display: none; }
/* 768~1439px: 하단 바 오른쪽에 비워 둔 자리(padding-right 88px)에 넣는다 — 바 위에 띄우면 높이가 낮은 화면에서 업종 아이콘을 가렸다 */
@media screen and (min-width: 768px) and (max-width: 1439px) {
  .cms-chat { right: 18px; bottom: calc(6px + var(--cms-safe-b)); width: 48px; height: 48px; }
  .cms-chat .xi { font-size: 22px; }
}

/* ---------- 모바일 하단 바 + 가입 상담 시트 ---------- */
.cms-mbar { display: none; }
@media screen and (max-width: 767px) {
  .cms-mbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 996; gap: 8px;
    padding: 8px 12px calc(8px + var(--cms-safe-b)); background: rgba(255,255,255,.98);
    border-top: 1px solid #d9dfeb; box-shadow: 0 -4px 16px rgba(9,30,66,.12); box-sizing: border-box;
  }
  .cms-mbar a, .cms-mbar button {
    flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 48px; border-radius: 12px; font-size: 16px; font-weight: 700; letter-spacing: -.3px;
    text-decoration: none; border: 0; cursor: pointer; box-sizing: border-box;
  }
  .cms-mbar .cms-mbar__tel { background: var(--cms-blue); color: #fff; }
  .cms-mbar .cms-mbar__consult { background: var(--cms-yellow); color: #1b1300; }
  .cms-mbar .xi { font-size: 20px; }
  body.cms-has-bar { padding-bottom: calc(var(--cms-bar-h) + 90px + var(--cms-safe-b)); }
  .cms-chat { right: 12px; bottom: calc(var(--cms-bar-h) + 20px + var(--cms-safe-b)); width: 52px; height: 52px; }
  body.cms-consult-open .cms-chat { display: none; }

  /* 기존 노란 '빠른상담' 버튼 자리 → 하단 바 위에 열리는 상담 신청 시트 */
  .mofastMove { left: 0; right: 0; bottom: calc(var(--cms-bar-h) + 16px + var(--cms-safe-b)); top: auto; z-index: 997; pointer-events: none; }
  .mofastMove ul li { width: auto; height: auto; margin: 0; }
  .mofastMove .other-link > button { display: none; }
  .mofastMove .other-link ul, .mofastMove .other-link.on ul { position: static; right: auto; bottom: auto; }
  .mofastMove .other-link ul .link5, .mofastMove .other-link.on ul .link5 {
    position: relative; top: auto; bottom: auto; left: auto; transform: none;
    width: auto; height: auto; max-height: calc(100vh - var(--cms-bar-h) - 120px); overflow-y: auto;
    margin: 0 10px; border-radius: 16px 16px 12px 12px;
    background: var(--cms-yellow) !important; padding: 46px 14px 14px !important; box-shadow: 0 -6px 24px rgba(0,0,0,.25);
  }
  .mofastMove .other-link .customerwp2 { padding: 0 !important; }
  .mofastMove .other-link .receive-btn input { width: 100%; }
  .mofastMove .other-link.on { pointer-events: auto; }
  .mofastMove .other-link.on > button.cms-sheet-close {
    display: flex; position: absolute; right: 18px; top: 8px; z-index: 2; width: 44px; height: 44px;
    align-items: center; justify-content: center; border-radius: 50%; background: rgba(0,0,0,.35); color: #fff; border: 0; font-size: 22px;
  }
}

/* 상담 폼: 동의 안내·운영시간 한 줄 */
/* 상담 창: 열 때는 바로 보이게(포커스 이동 가능), 닫을 때는 흐려진 뒤 숨김
   main.css 의 .link5 'transition: all .3s' 이 visibility 까지 늦춰 열자마자 입력칸에 포커스가 안 가므로 움직임 속성만 남긴다 */
.other-link ul { transition: opacity .3s linear, visibility 0s linear .3s; }
.other-link.on ul { transition: opacity .3s linear; }
.other-link.on ul .link5 { transition-property: opacity, bottom, top, transform; }
.other-link ul li input, .other-link ul li select, .other-link ul li textarea { transition-property: border-color, background-color, color, box-shadow; }
.other-link ul li .cms-consent-note, .other-link ul li .cms-hours, .other-link ul li .provision, .other-link ul li .captcha { white-space: normal; }
.other-link ul li .captcha { max-width: 100%; box-sizing: border-box; }
.other-link ul li .captcha #captcha_info_pc, .other-link ul li .captcha #captcha_info_m { display: block; margin-top: 4px; font-size: 11px; line-height: 1.4; }
.other-link ul li .captcha img { max-width: 100%; vertical-align: middle; }
.other-link > button.cms-sheet-close .xi { display: inline-block !important; position: static; width: auto; height: auto; margin: 0; font-size: 22px; line-height: 1; opacity: 1; color: #fff; }
.other-link .customerwp2 p.cms-consent-note, .cms-consent-note { margin: 4px 0 0; font-size: 11px; line-height: 1.45; font-weight: 400; color: #3b2f00; text-align: left; word-break: keep-all; }
.other-link p.cms-hours, .cms-hours { margin: 8px 6px 0; font-size: 11px; line-height: 1.5; font-weight: 400; color: #3b2f00; text-align: center; word-break: keep-all; }

/* ---------- 홈 '가입 안내' 구간 ---------- */
.fpWrap .fp_item_guide { background: #0b3379 linear-gradient(160deg, #0b3379 0%, #123f8f 60%, #0b2a63 100%); }
.cms-guide { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; max-width: 1100px; margin: 34px auto 0; padding: 0 16px; text-align: left; box-sizing: border-box; }
.cms-guide__card { background: #fff; color: var(--cms-ink); border-radius: 18px; padding: 22px 22px 18px; box-shadow: 0 8px 24px rgba(0,0,0,.18); display: flex; flex-direction: column; }
.cms-guide__card h3 { margin: 0 0 12px; font-size: 19px; font-weight: 700; color: var(--cms-blue); letter-spacing: -.4px; }
.cms-guide__card ol, .cms-guide__card ul { margin: 0; padding-left: 20px; font-size: 15px; line-height: 1.65; color: #2c3446; }
.cms-guide__card ol { list-style: decimal; }
.cms-guide__card ul { list-style: disc; }
.cms-guide__card li { margin: 2px 0; word-break: keep-all; }
.cms-guide__note { margin: 10px 0 0; font-size: 13px; color: #5d6779; }
.cms-guide__more { margin-top: auto; padding-top: 14px; font-size: 14px; font-weight: 700; color: var(--cms-blue2); text-decoration: underline; text-underline-offset: 3px; }
.fp_inner .cms-guide a.cms-guide__more { margin-top: auto; height: auto; width: auto; display: inline-block; line-height: 1.4; border: 0; text-align: left; color: var(--cms-blue2); font-size: 14px; }
.fp_item_guide .cms-hero-cta { margin-top: 26px; }
@media screen and (max-width: 1100px) { .cms-guide { gap: 12px; } .cms-guide__card { padding: 18px; } }
@media screen and (max-width: 767px) {
  .cms-guide { grid-template-columns: 1fr; gap: 10px; margin-top: 16px; padding: 0 14px; }
  .cms-guide__card { padding: 14px 16px; border-radius: 14px; }
  .cms-guide__card h3 { font-size: 18px; margin-bottom: 6px; }
  .cms-guide__card ol, .cms-guide__card ul { font-size: 15px; line-height: 1.6; }
  .cms-guide__more { padding-top: 8px; }
  .fp_item_guide .cms-hero-cta { margin-top: 14px; }
}

/* ---------- 모바일 가로 넘침 정리(푸터 1200px 고정 폭) ---------- */
@media screen and (max-width: 767px) {
  #footer .innerBox, #footer .rightArea, #footer .leftArea, #footer .address,
  #footer .menuList2, #footer .boxList, #footer .boxList .tit, #footer .boxList .con, #footer .menuList,
  #footer .address ul, #footer .address li, #footer .copytxt {
    width: auto !important; max-width: 100% !important; box-sizing: border-box; float: none !important; left: auto !important; margin-left: 0 !important;
  }
  #footer .address ul { padding: 0 16px; }
  #footer .directMenu { width: auto; max-width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px; }
  #footer .address .cms-foot-logo { float: none; margin: 0 0 12px 16px; }
}

/* ---------- 회사 소개: 옛 수치가 박힌 배너 이미지 대신 공식 수치 문구(2025년 5월 기준) ---------- */
.cms-figures { display: block; margin: 0 auto; max-width: 1200px; padding: 40px 24px 34px; box-sizing: border-box; text-align: center;
  border-radius: 18px; background: linear-gradient(120deg, #eef6fc 0%, #dcecf8 55%, #eaf2fa 100%); color: #222; }
.cms-figures__title { display: block; font-size: 30px; font-weight: 700; letter-spacing: -.5px; color: #111; }
.cms-figures__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 36px; margin-top: 14px; font-size: 20px; color: #4b5563; }
.cms-figures__row b { font-weight: 700; color: #1f2a44; }
.cms-figures__src { display: block; margin-top: 14px; font-size: 13px; color: #5d6779; }
@media screen and (max-width: 767px) {
  .cms-figures { padding: 24px 14px 20px; border-radius: 14px; }
  .cms-figures__title { font-size: 22px; }
  .cms-figures__row { flex-direction: column; gap: 4px; font-size: 16px; }
}

/* ---------- 전체 메뉴(햄버거) ---------- */
/* 높이가 낮은 화면(PC 1280×720 등)에서도 메뉴가 화면보다 길면 안에서 스크롤 */
.allMenuWrap { overflow-y: auto; overscroll-behavior: contain; }
/* 모바일: 메뉴 판이 화면보다 길어(예 744px > 664px) 아래 '가입안내'를 누를 수 없었다 → 화면 높이에 맞추고 안에서 스크롤 */
@media screen and (max-width: 767px) {
  .allMenuWrap {
    position: fixed; top: 0; bottom: 0; height: auto !important;
    overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
    padding-bottom: calc(32px + var(--cms-safe-b));
  }
}
/* 메뉴가 열려 있는 동안 하단 바·채팅·오른쪽 배너·상담 창이 메뉴를 가리지 않게 숨긴다(cms-ui.js 가 body 에 표시) */
body.cms-menu-open .cms-mbar, body.cms-menu-open .cms-chat,
body.cms-menu-open .rightinbox.cms-quick, body.cms-menu-open .mofastMove { display: none !important; }
/* 모바일 전체 메뉴 모양: cms.co.kr 처럼 오른쪽 판 + 맨 위 HOME·닫기 줄 + 대분류를 누르면 하위 메뉴가 펼쳐지는 아코디언(한 번에 하나).
   펼침은 cms-ui.js 가 li 에 .cms-open 을 붙인다. PC 전체 메뉴는 그대로 */
.cms-mmenu-head { display: none; }
@media screen and (max-width: 767px) {
  .allMenuWrap { width: 82%; max-width: 360px; padding: 0 0 calc(24px + var(--cms-safe-b)); box-shadow: -6px 0 24px rgba(0,0,0,.18); }
  .allMenuWrap .allMenuWrap_inner { display: block; height: auto; padding-top: 0 !important; }
  .allMenuWrap .allMenu_inner { display: block; height: auto; overflow: visible; padding: 0 !important; }
  .cms-mmenu-head { display: flex; align-items: center; height: 56px; padding: 0 64px 0 20px; border-bottom: 1px solid #e3e6ec; box-sizing: border-box; }
  .cms-mmenu-head a { font-size: 14px; font-weight: 500; color: #333; letter-spacing: .5px; line-height: 56px; }
  body.cms-menu-open .btn_all_menu { top: 0; width: 56px; height: 56px; }
  .allMenuWrap .allMenu_inner .allMenu { padding: 0; text-align: left; }
  .allMenuWrap .allMenu_inner .allMenu > li { margin: 0; padding: 0; border-bottom: 1px solid #e3e6ec; }
  .allMenuWrap .allMenu_inner .allMenu > li > p { display: none; }
  .allMenuWrap .allMenu_inner .allMenu > li > a {
    position: relative; display: block; margin: 0; padding: 15px 48px 15px 20px;
    font-size: 16px; line-height: 24px; font-weight: 500; color: #222; letter-spacing: -.3px;
  }
  .allMenuWrap .allMenu_inner .allMenu > li > a::after,
  .allMenuWrap .allMenu_inner .allMenu > li:hover > a::after {
    content: ''; display: block; position: absolute; left: auto; right: 22px; top: 50%; bottom: auto;
    width: 8px; height: 8px; margin-top: -6px; background: none;
    border-right: 2px solid #8a93a6; border-bottom: 2px solid #8a93a6; transform: rotate(45deg); transition: transform .2s;
  }
  .allMenuWrap .allMenu_inner .allMenu > li.cms-open > a { background: var(--cms-blue); color: #fff; }
  .allMenuWrap .allMenu_inner .allMenu > li.cms-open > a::after { border-color: #fff; transform: rotate(-135deg); margin-top: -2px; }
  .allMenuWrap .allMenu_inner .allMenu .dep2 { display: none; margin: 0; padding: 0; background: #f4f6f9; }
  .allMenuWrap .allMenu_inner .allMenu > li.cms-open .dep2 { display: block; }
  .allMenuWrap .allMenu_inner .allMenu .dep2 > li { display: block; margin: 0; border-top: 1px solid #e3e6ec; }
  .allMenuWrap .allMenu_inner .allMenu .dep2 > li > a {
    display: block; min-height: 44px; box-sizing: border-box; padding: 10px 20px 10px 32px;
    font-size: 15px; line-height: 24px; font-weight: 400; color: #333;
  }
}

/* ---------- 모바일 글자 크기(2026-10-17, cms.co.kr 모바일 기준으로 단계 정리) ----------
   페이지 제목 30 · 구간 제목 26 · 소개글 18 · 작은 제목 17 · 본문 15(줄간격 1.7) · 보조 14. 767px 이하만, PC 는 그대로 */
@media screen and (max-width: 767px) {
  /* 홈: 업종 아이콘 이름·가이드 카드 보조 글·VIEW MORE */
  .fp_item1 .article_btm li a { font-size: 14px; }
  .cms-guide__note { font-size: 14px; }
  .fp_inner .cms-guide a.cms-guide__more, .cms-guide__more { font-size: 15px; }
  .fp_inner .txt_box > a { font-size: 14px; }
  .fp_inner .cms-hero-cta a.cms-btn, .fp_inner .cms-hero-cta button.cms-btn { font-size: 15px; }

  /* 서브 페이지 규칙은 뒤에 불러오는 sub_page.css 의 '#container …' 규칙보다 우선하도록 'body #container' 를 붙인다 */
  /* 서브: 위 띠 제목·설명 */
  body #container .sub_wr .subVisual p,
  body #container .sub_wr .subVisual2 p,
  body #container .sub_wr .subVisual3 p { font-size: 24px; font-weight: 700; letter-spacing: -.5px; }
  body #container .sub_wr .subVisual p span,
  body #container .sub_wr .subVisual2 p span,
  body #container .sub_wr .subVisual3 p span { font-size: 14px; font-weight: 400; line-height: 1.5; letter-spacing: 0; }
  /* 페이지 제목 */
  body #container .section .sub_page_title span { font-size: 30px; line-height: 1.25; font-weight: 700; letter-spacing: -.8px; }
  /* 구간 제목 */
  body #container .sub_wr .start_up_sub_title,
  body #container .servicesub_text > p,
  body #container .partner_solution_item h3,
  body #container .partner_solution_item h3 span,
  body #container .why_trend_graph .subtitle_slogan { font-size: 26px; line-height: 1.35; font-weight: 700; letter-spacing: -.6px; }
  /* 소개글(제목 아래 첫 문단) */
  body #container .info_hyosung_intro > h2,
  body #container .article_body_intro_inner > h2,
  body #container .info_hyosung_intro > h4,
  body #container .wrap span.font24 {
    font-size: 18px; line-height: 1.6; font-weight: 400; letter-spacing: -.3px;
  }
  body #container .info_hyosung_intro > h2 > span { font-size: 18px; font-weight: 700; line-height: 1.6; }
  /* 작은 제목: 단계·항목 이름, 개인/법인사업자, BEFORE/AFTER, '대상업종' 등 */
  body #container .sub_wr dl > dt,
  body #container .info_hyosung_intro li > p > span,
  body #container .greeting_message_text_box li > p,
  body #container .greeting_message_text_box2 li > p,
  body #container .sub_wr .wrap > strong { font-size: 17px; line-height: 1.45; font-weight: 700; }
  body #container .sub_wr .proc li > span { font-size: 14px; font-weight: 700; letter-spacing: .3px; }
  /* 본문 */
  body #container .info_hyosung_intro > p,
  body #container .info_hyosung_intro dl,
  body #container .info_hyosung_intro li > p,
  body #container .article_body_intro_inner > p,
  body #container .info_hyosung_intro > h2 > p,
  body #container .company_text li,
  body #container .sub_wr .wrap,
  body #container .partner_solution_item > p,
  body #container .servicesub_text li,
  body #container .servicesub_text li strong,
  body #container .servicesub_text li span,
  body #container .greeting_message_text_box li,
  body #container .greeting_message_text_box2 li { font-size: 15px; line-height: 1.7; font-weight: 400; }
  body #container .sub_wr dl > dd { font-size: 14px; line-height: 1.6; font-weight: 400; }
}

/* ---------- 모바일 입력칸: 아이폰 사파리 자동 확대 방지(2026-10-17) ----------
   글자가 16px 보다 작은 입력칸을 누르면 사파리가 화면을 확대해 빠른상담 창이 밀려 보였다(운영자 실기기 신고) → 모바일에서 입력칸 16px */
@media screen and (max-width: 767px) {
  input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="password"], input[type="search"],
  input:not([type]), select, textarea { font-size: 16px !important; }
  .mofastMove .other-link ul li input[type="text"], .mofastMove .other-link ul li select { height: 44px; line-height: 1.2; box-sizing: border-box; }
}