@charset "utf-8";
/* =========================================================
   메타에듀시스 메인페이지 커스텀 스타일
   컬러 토큰: 00_design_direction.md 준수
   ========================================================= */

:root{
  --c-primary:var(--point-ink);      /* [개편] 레퍼런스(MetaEdusys.dc) 프라이머리 정합 — 기존 #1B4DD1 */
  --c-primary-deep:var(--point-deep); /* hover/deep — 기존 #143B9E. [260915] 포인트 색 통일 */
  --c-navy:#0C2F5A;
  /* [260915] 포인트 색 = 고객 지정 #3CBAB5. 같은 색상(177.6°)에서 밝기만 달리해 역할을 나눈다.
     #3CBAB5 는 흰 바탕 대비 2.4:1 이라 글씨에는 못 쓴다 — 면·아이콘 바탕·테두리에만. */
  --point:#3CBAB5;          /* 면·아이콘 바탕·테두리·장식 */
  --point-strong:#2F928E;   /* 큰 글씨(3:1)·아이콘 선·그라데이션 진한 끝 (흰 바탕 3.7:1) */
  --point-ink:#1F7A77;      /* 작은 글씨 (흰 바탕 5.1:1) */
  --point-deep:#18625F;     /* 옅은 판 위 글씨·강한 강조 (흰 바탕 7.1:1) */
  --point-50:#F4FBFB;
  --point-100:#EEF9F8;
  --point-150:#E9F7F6;
  --point-200:#E1F4F3;
  --point-300:#D3EEED;
  --point-400:#BCE6E4;
  --point-500:#A3DCDA;
  --point-600:#89D2CF;
  --c-mint:var(--point);
  --c-mint-text:var(--point-ink); /* a11y: 흰 배경 위 민트 텍스트용(5.1:1, WCAG AA). 솔리드 배경/아이콘은 --c-mint 유지 */
  --c-bg-soft:var(--point-50);
  --c-text:#1A2233;
  --c-text-sub:#5A6B85;
  --c-line:#E3E9F2;
  --c-white:#FFFFFF;
  /* 에러/검증 색군(컨설팅 폼·필수표시·입력오류). 텍스트는 대비 위해 더 어둡게 */
  --c-error:#E0414F;       /* 필수표시·입력오류 보더·new 배지 */
  --c-error-text:#B42334;  /* 에러 메시지 텍스트(WCAG 대비) */
  --c-error-bg:#FFF1F2;    /* 에러 박스 배경 */
  --c-error-line:#F6C6CB;  /* 에러 박스 보더 */
  /* 히어로/로그인 비주얼 강조·장식 */
  --c-accent-sky:#7FD8FF;  /* 딥블루 히어로 위 강조 텍스트(타이틀 em·KPI) */
  --c-orb-blue:var(--point-ink);    /* 배경 장식 orb(radial) */
  --grad-hero:linear-gradient(135deg,var(--point-ink),var(--point-deep));
  --shadow-card:0 10px 30px rgba(24,98,95,.07);
  --shadow-card-hover:0 18px 48px rgba(24,98,95,.14);
  --r:16px;
  --maxw:1480px; /* 40px side gutters -> about 1400px usable content */
  --font:'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,system-ui,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
}

/* ---------- 그누보드 기본 골격 중화 ---------- */
.me-main,#me-hd,#me-ft{font-family:var(--font);}
#me-hd *,#me-ft *,.me-main *,.me-solhero *,.me-sub-wrap *,.me-consult-wrap *{box-sizing:border-box;}
#wrapper{width:auto;margin:0;max-width:none;min-width:0;}
#container_wr{width:auto;max-width:none;}
#hd_pop{max-width:100%;}
#container{width:auto;max-width:none;margin:0;padding:0;border:0;background:transparent;min-height:0;float:none;}
.me-main{
  color:var(--c-text);
  font-size:16px;
  line-height:1.65;
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.me-hero{overflow:visible;} /* 오버랩 카드 하단 클립 방지(Task4). orb는 .me-hero-bg에서 클립 */
.me-main img{max-width:100%;}
.me-wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 40px;box-sizing:border-box;}

/* a11y: 전역 키보드 포커스 가시화(WCAG 2.4.7) — me-* 영역 인터랙티브 요소 */
#me-hd a:focus-visible,#me-hd button:focus-visible,
.me-main a:focus-visible,.me-main button:focus-visible,
.me-main input:focus-visible,.me-main select:focus-visible,.me-main textarea:focus-visible,
#me-ft a:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;border-radius:4px;}

/* ---------- 시안 추출 이미지 공통 ---------- */
.me-vr-photo{position:relative;z-index:1;width:100%;height:auto;display:block;border-radius:18px;}
.me-repsol-thumb img,.me-ref-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

/* ---------- 공통 버튼 ---------- */
.me-btn{
  display:inline-flex;align-items:center;gap:8px;
  height:52px;padding:0 26px;border-radius:12px;
  font-size:16px;font-weight:700;line-height:1;
  text-decoration:none;cursor:pointer;border:0;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
  white-space:nowrap;
}
.me-btn.lg{height:58px;padding:0 34px;font-size:17px;}
.me-btn-primary{background:var(--c-primary);color:#fff;box-shadow:0 8px 22px rgba(31,122,119,.32);}
.me-btn-primary:hover{background:var(--c-primary-deep);transform:translateY(-2px);box-shadow:0 12px 30px rgba(31,122,119,.4);}
.me-btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.55);}
.me-btn-ghost:hover{background:rgba(255,255,255,.22);transform:translateY(-2px);}
.me-btn-line{background:#fff;color:var(--c-primary);border:1.5px solid var(--c-primary);}
.me-btn-line:hover{background:var(--c-bg-soft);transform:translateY(-2px);}
.me-btn-white{background:#fff;color:var(--c-primary);box-shadow:0 10px 26px rgba(8,24,55,.25);}
.me-btn-white:hover{background:var(--c-bg-soft);transform:translateY(-2px);}
.me-btn-line-mint{background:#fff;color:var(--c-mint-text);border:1.5px solid var(--c-mint);}
.me-btn-line-mint:hover{background:var(--c-mint);color:#fff;transform:translateY(-2px);}

/* ---------- 섹션 공통 ---------- */
.me-sec{padding:96px 0;}
.me-sec-head{text-align:center;max-width:680px;margin:0 auto 52px;}
h1, h2, h3, .me-hero-title, .me-sec-head h2{text-wrap:balance;}
.me-sec-head p, .me-hero-sub{text-wrap:pretty;}
.me-eyebrow{
  display:inline-block;font-size:13px;font-weight:800;letter-spacing:.14em;
  color:var(--c-primary);margin-bottom:14px;text-transform:uppercase;
}
.me-eyebrow.mint{color:var(--c-mint-text);}
.me-sec-title{font-size:36px;font-weight:800;letter-spacing:-.025em;line-height:1.25;margin:0 0 14px;color:var(--c-text);}

/* =========================================================
   헤더 / GNB
   ========================================================= */
#me-hd{
  position:sticky;top:0;z-index:1000;
  background:#fff; /* 불투명: 스크롤 시 뒤 콘텐츠 비침/색번짐 방지(피드백 1) */
  border-bottom:1px solid var(--c-line);
  transition:box-shadow .25s ease;
}
#me-hd.is-scrolled{box-shadow:0 6px 24px rgba(24,98,95,.08);}
#me-hd #skip_to_container{position:absolute;left:-9999px;}
/* a11y: 스킵링크 키보드 포커스 시 화면 복귀(WCAG 2.4.7) */
#me-hd #skip_to_container a:focus{position:fixed;left:16px;top:12px;width:auto;height:auto;overflow:visible;line-height:1.4;padding:8px 16px;background:var(--c-primary);color:#fff;border-radius:8px;z-index:2000;text-decoration:none;font-weight:700;font-size:14px;}
.me-hd-inner{
  max-width:var(--maxw);margin:0 auto;padding:0 40px;
  height:78px;display:flex;align-items:center;gap:18px;  /* 시안과 동일 */
}
.me-logo{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0;}

.me-gnb{flex:1;}
.me-gnb-ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;justify-content:center;}
.me-gnb-li{position:relative;}
.me-gnb-a{
  display:block;padding:10px 13px;border-radius:9px;white-space:nowrap;
  font-size:15.5px;font-weight:600;color:var(--c-text);text-decoration:none;
  transition:color .15s,background .15s;
}
.me-gnb-li:hover>.me-gnb-a,
.me-gnb-li:focus-within>.me-gnb-a{color:var(--c-primary);background:var(--c-bg-soft);}
/* a11y: 키보드 포커스 시 GNB 링크 가시화(WCAG 2.4.7) */
.me-gnb-a:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;}
.me-gnb-sub{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(8px);
  width:max-content;min-width:0;background:#fff;border:1px solid var(--c-line);border-radius:12px; /* 콘텐츠 폭에 맞춤: a의 nowrap이 줄바꿈 방지(고정 260 제거) */
  box-shadow:var(--shadow-card);padding:8px;opacity:0;visibility:hidden;transition:.2s;
}
.me-gnb-li:hover .me-gnb-sub,
.me-gnb-li:focus-within .me-gnb-sub{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.me-gnb-sub ul{list-style:none;margin:0;padding:0;}
.me-gnb-sub a{display:block;padding:9px 13px;border-radius:8px;font-size:15px;color:var(--c-text-sub);text-decoration:none;white-space:nowrap;} /* 한 줄 유지(피드백 2) */
.me-gnb-sub a:hover{background:var(--c-bg-soft);color:var(--c-primary);}

.me-hd-util{display:flex;align-items:center;gap:13px;flex-shrink:0;}
.me-auth{display:flex;gap:12px;list-style:none;margin:0;padding:0;}
.me-auth a{font-size:14px;font-weight:600;color:var(--c-text-sub);text-decoration:none;transition:color .15s;}
.me-auth a:hover{color:var(--c-primary);}
.me-lang{display:none;align-items:center;gap:5px;font-size:13px;font-weight:700;} /* 다국어 미사용 — KOR/ENG 토글 숨김(피드백 8, 가역) */
.me-lang a{color:#9AA8C0;text-decoration:none;}
.me-lang a.is-active{color:var(--c-navy);}
.me-lang span{color:var(--c-line);}
.me-hd-cta{display:flex;align-items:center;gap:9px;}
.me-cta-head{
  display:inline-flex;align-items:center;gap:6px;
  height:42px;padding:0 13px;border-radius:10px;
  font-size:13.5px;font-weight:700;text-decoration:none;
  transition:.18s;white-space:nowrap;
}
.me-cta-primary{
  background:var(--c-primary);color:#fff;
  box-shadow:0 6px 16px rgba(31,122,119,.28);
}
.me-cta-primary:hover{background:var(--c-primary-deep);transform:translateY(-1px);}
.me-cta-mint{
  background:#fff;color:var(--c-mint-text);border:1.5px solid var(--c-mint);
}
.me-cta-mint:hover{background:var(--c-mint);color:#fff;transform:translateY(-1px);}
.me-burger{display:none;min-width:44px;min-height:44px;width:44px;height:44px;background:transparent;border:0;cursor:pointer;flex-direction:column;gap:5px;align-items:center;justify-content:center;}
.me-burger span{display:block;width:22px;height:2px;background:var(--c-navy);border-radius:2px;transition:.2s;}
.me-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.me-burger.is-open span:nth-child(2){opacity:0;}
.me-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.me-mnav{border-top:1px solid var(--c-line);background:#fff;max-height:calc(100dvh - 74px);overflow-y:auto;overscroll-behavior:contain;}
.me-mnav[hidden]{display:none !important;}
body.me-mnav-open{overflow:hidden;}
.me-mnav ul{list-style:none;margin:0;padding:8px 24px 16px;}
.me-mnav a{display:block;padding:12px 4px;font-size:16px;font-weight:600;line-height:1.45;color:var(--c-text);text-decoration:none;border-bottom:1px solid var(--c-line);}
.me-mnav-sub{margin:0;padding:0 0 6px !important;}
.me-mnav-sub a{padding:8px 4px 8px 16px;font-size:15px;font-weight:500;line-height:1.42;color:var(--c-text-sub);border-bottom:0;}
.me-mnav-cta{display:flex;flex-direction:column;gap:10px;padding:14px 24px 22px;}
.me-mnav-cta .me-btn{width:100%;height:48px;font-size:15px;}

/* =========================================================
   ① 히어로
   ========================================================= */
/* [개편] 레퍼런스 밝은 톤 히어로 — 배경 사진/그라데이션은 round17 `.me-main .me-hero` 에서 처리.
   기본 골격(텍스트 톤·타이포)만 정의, 세부 사이즈는 round17 블록이 오버라이드 */
.me-hero{position:relative;background:var(--point-100);color:var(--c-text);overflow:visible;padding-bottom:0;min-height:680px;}
.me-hero-inner{position:relative;z-index:2;display:block;padding-top:120px;padding-bottom:150px;}
.me-hero-copy{max-width:760px;animation:none;}
.me-hero-title{font-weight:800;line-height:1.16;letter-spacing:-.02em;margin:0 0 26px;word-break:keep-all;}
.me-hero-title .me-hero-l1{display:block;font-size:42px;color:var(--c-text);}
.me-hero-title .me-hero-l2{display:block;font-size:64px;margin-top:8px;color:var(--c-text);}
.me-hero-title em{font-style:normal;color:var(--c-primary);}
.me-hero-sub{font-size:21px;line-height:1.6;color:#3f4859;margin:0 0 38px;font-weight:500;}
.me-hero-sub strong{color:var(--c-primary);font-weight:700;}
.me-hero-cta{display:flex;gap:14px;flex-wrap:wrap;}
/* 히어로 흰 테두리 버튼(레퍼런스 도입 문의하기) */
.me-btn-hero-line{background:#fff;color:#27303f;border:1px solid #d4ddea;box-shadow:0 6px 18px rgba(27,35,51,.06);}
.me-btn-hero-line:hover{border-color:var(--c-primary);color:var(--c-primary);transform:translateY(-2px);}

/* 히어로 하단 오버랩 카드 (숏컷 + KPI) */
.me-overlap{
  position:relative;z-index:5;
  display:grid;grid-template-columns:1.35fr 1fr;gap:22px;
  transform:translateY(56px);
}
.me-shortcut{
  background:#fff;border-radius:20px;padding:24px 26px;
  box-shadow:0 20px 50px rgba(8,24,55,.16);
}
.me-shortcut-head{display:flex;align-items:baseline;gap:10px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--c-line);}
.me-shortcut-head strong{font-size:17px;font-weight:800;color:var(--c-navy);}
.me-shortcut-head span{font-size:13.5px;color:var(--c-text-sub);}
.me-shortcut-list{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;list-style:none;margin:0;padding:0;}
.me-shortcut-list a{
  display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;
  padding:14px 6px;border-radius:13px;text-decoration:none;
  font-size:13px;font-weight:600;color:var(--c-text);line-height:1.35;
  transition:background .15s,transform .15s,color .15s;word-break:keep-all;
}
.me-shortcut-list a:hover{background:var(--c-bg-soft);transform:translateY(-3px);color:var(--c-primary);}
.me-sc-ico{
  width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:var(--c-bg-soft);color:var(--c-primary);transition:background .15s,color .15s;
}
.me-shortcut-list a:hover .me-sc-ico{background:var(--c-primary);color:#fff;}

.me-kpi{
  background:linear-gradient(150deg,var(--c-primary),var(--c-primary-deep));
  border-radius:20px;padding:26px 24px;
  box-shadow:0 20px 50px rgba(24,98,95,.28);
}

/* 첫 섹션(대표솔루션)은 오버랩 카드 overhang(56px) 보정 */
.me-repsol{background:#fff;padding-top:128px;}

/* [수정1] 섹션 헤드 정렬 일관화 — with-nav(VR디바이스·구축사례)도 다른 섹션과 동일하게
   eyebrow+타이틀을 '중앙 정렬'로 통일. 우측 네비(캐러셀 화살표/전체보기 링크)는 절대배치로
   타이틀 중앙정렬을 깨지 않게 우측에 띄운다(데스크탑). 좁은 폭에서는 아래 미디어쿼리로 스택. */
.me-sec-head.with-nav{position:relative;text-align:center;max-width:820px;margin:0 auto 48px;}
.me-sec-head.with-nav > div{margin:0;}
.me-sec-head.with-nav .me-eyebrow{margin-bottom:8px;}

/* =========================================================
   ④ 대표 솔루션 소개
   ========================================================= */
/* [폴리시] 5개 카드의 마지막 불완전 행(3+2 / 2+2+1) 우측 빈 셀이 큰 여백으로 보이던 문제 →
   flex+wrap+justify-content:center 로 trailing 행 카드를 중앙 정렬(빈칸 양쪽 분배). 카드 개수/콘텐츠/스타일 불변. */
.me-repsol-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;}
.me-repsol-grid > .me-repsol-card{flex:0 1 calc((100% - 48px)/3);min-width:0;}
.me-repsol-card{
  background:#fff;border:1px solid var(--c-line);border-radius:18px;overflow:hidden;
  transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;
}
.me-repsol-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover);}
.me-repsol-thumb{position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--c-bg-soft);}
.me-repsol-body{padding:26px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.me-repsol-body h3{font-size:20px;font-weight:700;margin:0;color:var(--c-navy);letter-spacing:-.02em;line-height:1.35;}
.me-repsol-body p{font-size:14.5px;line-height:1.7;color:var(--c-text-sub);margin:0;flex:1;}

/* =========================================================
   ⑤ VR 구매특전
   ========================================================= */
.me-benefits{background:#fff;}
.me-benefit-grid{display:grid;grid-template-columns:1.15fr .925fr .925fr;gap:24px;align-items:stretch;}
.me-benefit-card{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--r);
  padding:30px 28px;box-shadow:0 16px 42px rgba(24,98,95,.07);
  display:flex;flex-direction:column;gap:14px;
}
.me-benefit-card h3{font-size:20px;line-height:1.35;margin:0;color:var(--c-navy);letter-spacing:-.02em;}
.me-benefit-card p{font-size:14.5px;line-height:1.65;margin:0;color:var(--c-text-sub);}
.me-benefit-card ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.me-benefit-card li{position:relative;padding-left:18px;font-size:14.5px;line-height:1.65;color:var(--c-text);}
.me-benefit-card li:before{content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--c-mint);}
.me-benefit-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:8px;}

/* =========================================================
   ⑥ VR 디바이스 & 제품 (캐러셀)
   ========================================================= */
.me-products{background:var(--c-bg-soft);}

/* =========================================================
   ⑥ 교육 도입 프로세스
   ========================================================= */
.me-process{background:#fff;}
.me-steps{display:flex;align-items:flex-start;justify-content:space-between;gap:0;list-style:none;margin:0;padding:0;counter-reset:none;}
.me-step{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 8px;}
.me-step-ico{
  width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--c-bg-soft);color:var(--c-primary);margin-bottom:18px;
  border:2px solid #fff;box-shadow:0 8px 22px rgba(31,122,119,.12);transition:.2s;
}
.me-step:hover .me-step-ico{background:var(--grad-hero);color:#fff;transform:translateY(-4px);}
.me-step-no{font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--c-mint-text);margin-bottom:6px;}
.me-step-name{font-size:16.5px;font-weight:700;color:var(--c-navy);letter-spacing:-.02em;line-height:1.4;word-break:keep-all;}
.me-step-chev{position:absolute;top:30px;right:-12px;color:var(--c-line);}

/* =========================================================
   ⑦ 메타에듀시스의 특별한 이유
   ========================================================= */
.me-why{background:var(--c-bg-soft);}
.me-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.me-why-card{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--r);
  padding:30px 26px;transition:transform .2s,box-shadow .2s,border-color .2s;
}
.me-why-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover);border-color:transparent;}
.me-why-ico{
  display:flex;align-items:center;justify-content:center;
  width:54px;height:54px;border-radius:14px;margin-bottom:20px;
  background:var(--c-bg-soft);color:var(--c-primary);
}
.me-why-card:nth-child(2) .me-why-ico,.me-why-card:nth-child(4) .me-why-ico{color:var(--point-strong);background:rgba(60,186,181,.1);}
.me-why-card h3{font-size:19px;font-weight:700;margin:0 0 10px;color:var(--c-navy);letter-spacing:-.02em;}
.me-why-card p{font-size:15px;line-height:1.65;color:var(--c-text-sub);margin:0;}

/* =========================================================
   ⑧ 구축 사례
   ========================================================= */
.me-ref{background:#fff;}
.me-ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.me-ref-card{
  border-radius:18px;overflow:hidden;border:1px solid var(--c-line);
  background:#fff;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;
}
.me-ref-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card-hover);}
.me-ref-thumb{position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--c-bg-soft);}
.me-ref-thumb::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(24,98,95,.28),transparent 45%);}
.me-ref-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1;}
.me-ref-body h3{font-size:18px;font-weight:700;margin:0;color:var(--c-navy);letter-spacing:-.02em;}
.me-ref-body p{font-size:14.5px;line-height:1.65;color:var(--c-text-sub);margin:0;flex:1;}










/* =========================================================
   ⑩ 최종 CTA 밴드
   ========================================================= */
.me-finalcta{background:#fff;padding:40px 0 96px;}
.me-cta-band{
  position:relative;overflow:hidden;border-radius:28px;
  background:var(--grad-hero);color:#fff;text-align:center;
  padding:64px 32px;box-shadow:0 30px 70px rgba(24,98,95,.3);
}
.me-cta-band-bg{position:absolute;inset:0;pointer-events:none;}
.me-cta-band-bg span{position:absolute;border-radius:50%;filter:blur(50px);}
.me-cta-band-bg span:first-child{width:360px;height:360px;background:rgba(60,186,181,.35);top:-140px;right:-80px;}
.me-cta-band-bg span:last-child{width:300px;height:300px;background:rgba(125,216,255,.28);bottom:-130px;left:-60px;}
.me-cta-band-inner{position:relative;}
.me-cta-band h2{font-size:36px;font-weight:800;letter-spacing:-.03em;margin:0 0 12px;}
.me-cta-band p{font-size:17px;color:rgba(255,255,255,.85);margin:0 0 30px;}
.me-finalcta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:22px;}
.me-finalcta-tel{font-size:15px;color:rgba(255,255,255,.78);margin:0;}
.me-finalcta-tel a{font-size:21px;font-weight:800;color:#fff;text-decoration:none;letter-spacing:.01em;margin-left:6px;}

/* =========================================================
   푸터 (멀티컬럼)
   ========================================================= */
/* [개편] 통일안 네이비 푸터 — 전역(tail.php) 모든 페이지 적용 */
#me-ft{background:#0a1830;color:#b9c5d7;border-top:1px solid #24334b;padding:58px 0 28px;position:relative;}
.me-ft-top{display:grid;grid-template-columns:2.9fr repeat(5,0.9fr);gap:30px;padding-bottom:38px;border-bottom:1px solid #29364d;}
.me-ft-brand{max-width:560px;}
.me-ft-logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--c-text);margin-bottom:18px;}
.me-ft-tagline{font-size:14px;line-height:1.7;color:#b9c5d7;margin:0 0 14px;}
.me-ft-addr{font-size:13.5px;line-height:1.85;color:#b9c5d7;margin:0 0 16px;}
.me-ft-addr strong{color:#fff;font-weight:700;}
.me-ft-addr a{color:var(--point-100);text-decoration:none;font-weight:600;}
.me-ft-sns{display:flex;gap:10px;list-style:none;margin:0;padding:0;}
.me-ft-sns a,.me-ft-sns-placeholder{
  width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:#e8ebf0;color:#5b6675;transition:.15s;
}
.me-ft-sns a:hover{background:var(--c-primary);color:#fff;transform:translateY(-2px);}
.me-ft-cols{display:contents;}
.me-ft-col{display:flex;flex-direction:column;}
.me-ft-col h2{font-size:16px;font-weight:800;color:#fff;margin:0 0 18px;}
.me-ft-col a{font-size:15px;line-height:1;color:#b9c5d7;text-decoration:none;padding:7px 0;transition:color .15s;}
.me-ft-col a:hover{color:var(--point-100);}
.me-ft-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;flex-wrap:wrap;gap:12px;}
.me-ft-links{display:flex;gap:24px;list-style:none;margin:0;padding:0;order:2;}
.me-ft-links a{font-size:14.5px;color:#b9c5d7;text-decoration:none;}
.me-ft-links a:hover{color:var(--point-100);}
.me-ft-copy{font-size:14.5px;color:#b9c5d7;margin:0;order:1;}
.me-ft-copy strong{color:#b9c5d7;font-weight:700;}

/* 화면 오른쪽 아래에 떠 있는 '위로' 단추.
   맨 위에서는 할 일이 없는데도 떠 있어서, 좁은 화면에서는 첫 화면의
   '무료 상담·예산 컨설팅 신청' 단추를 그대로 덮고 있었다(48x48 겹침).
   한 화면쯤 내려간 뒤부터 보인다. 숨은 동안에는 탭 순서에서도 빠진다. */
#top_btn{
  position:fixed;right:28px;bottom:28px;z-index:900;
  width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;
  background:var(--c-primary);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(31,122,119,.4);transition:.18s;
  opacity:0;visibility:hidden;pointer-events:none;
}
#top_btn.is-on{opacity:1;visibility:visible;pointer-events:auto;}
#top_btn:hover{background:var(--c-primary-deep);transform:translateY(-3px);}

/* ---------- 애니메이션 ---------- */
@keyframes meFadeUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
@keyframes meFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@media (prefers-reduced-motion:reduce){.me-hero-copy{animation:none;}
}

/* =========================================================
   반응형 (데스크탑 우선 → ≤1080 → ≤960 → ≤768 1단)
   ========================================================= */
@media (max-width:1080px){
  .me-hero-title{font-size:42px;}
  .me-repsol-grid,.me-ref-grid,.me-benefit-grid{grid-template-columns:repeat(2,1fr);}
  /* [폴리시] repsol 은 flex 이므로 2-up basis 로 지정(trailing 행 중앙정렬 유지). */
  .me-repsol-grid > .me-repsol-card{flex:0 1 calc((100% - 24px)/2);}
  .me-benefit-card:first-child{grid-column:1/-1;}
  .me-overlap{grid-template-columns:1fr;}
  /* [수정6] 헤더 모바일 전환을 960→1080 으로 상향: 960~1080 구간에서 데스크탑 GNB+CTA가
     한 줄에 안 들어가 우측 가로 overflow가 발생하던 결함 해소. 버거+모바일메뉴 일관 노출. */
  .me-gnb{display:none;}
  .me-auth,.me-acct-wrap,.me-lang,.me-hd-cta{display:none;}
  .me-burger{display:flex;}
  .me-mnav:not([hidden]){display:block;}
  /* [수정5/보정] 모바일: 햄버거 좌측 + 로고 좌측정렬([≡ 로고]). 패딩 축소로 우측 치우침 제거. */
  .me-hd-inner{gap:12px;padding-left:18px;padding-right:18px;}
  .me-hd-util{order:-1;margin-right:0;}
  .me-burger{margin-left:-6px;}
  .me-logo{margin-inline:0;}
}
@media (max-width:960px){
  .me-why-grid{grid-template-columns:repeat(2,1fr);}
  .me-hero-inner{grid-template-columns:1fr;gap:36px;padding-top:56px;}
  .me-hero-copy{text-align:center;}
  .me-hero-title{max-width:680px;margin-left:auto;margin-right:auto;}
  .me-hero-sub{max-width:680px;margin-left:auto;margin-right:auto;}
  .me-hero-cta{justify-content:center;}
  .me-hero-cta .me-btn{justify-content:center;}
  .me-ft-top{grid-template-columns:1fr;gap:32px;}
  .me-ft-brand{max-width:none;}
  /* display:contents 해제 → 실제 그리드로 5컬럼 정렬 */
  .me-ft-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;}
  /* 프로세스: 가로 → 세로 스택 */
  .me-steps{flex-direction:column;gap:14px;align-items:stretch;}
  .me-step{flex-direction:row;align-items:center;gap:16px;text-align:left;padding:0;}
  .me-step-ico{width:60px;height:60px;margin-bottom:0;flex-shrink:0;}
  .me-step-chev{display:none;}
}
@media (max-width:768px){
  .me-sec{padding:60px 0;}
  .me-repsol{padding-top:60px;}
  .me-why-grid,.me-repsol-grid,.me-ref-grid,.me-benefit-grid{grid-template-columns:1fr;}
  /* [폴리시] repsol flex 1-up basis. */
  .me-repsol-grid > .me-repsol-card{flex:1 1 100%;}
  .me-benefit-card:first-child{grid-column:auto;}
  /* [수정1] 좁은 폭: 중앙정렬 유지하되 우측 네비를 절대배치 해제→타이틀 아래 중앙 배치(겹침 방지) */
  .me-sec-head.with-nav{text-align:center;}
  .me-sec-title{font-size:27px;}
  .me-hero-title{max-width:330px;font-size:30px;letter-spacing:0;word-break:normal;overflow-wrap:anywhere;}
  .me-hero-sub{max-width:330px;font-size:15.5px;word-break:normal;overflow-wrap:anywhere;}
  .me-hero-sub br{display:none;}
  .me-cta-band h2{font-size:25px;}
  .me-cta-band{padding:48px 22px;border-radius:22px;}
  .me-hero-cta .me-btn{width:100%;max-width:330px;}

  .me-shortcut-list{grid-template-columns:repeat(3,1fr);}
  .me-finalcta-btns .me-btn{width:100%;justify-content:center;}
  /* [모바일 푸터 간소화] ≤768 에서 사이트맵 링크 4컬럼(회사/솔루션/제품/고객지원) 숨김 → 푸터 높이 대폭 감소.
     회사정보(.me-ft-brand)·SNS(.me-ft-sns-col)·하단 법적링크/카피라이트(.me-ft-bottom)는 유지. */
  .me-ft-cols{display:flex;justify-content:flex-start;gap:24px 16px;}
  .me-ft-col:not(.me-ft-sns-col){display:none;}
  .me-ft-sns-col{display:flex;}
  .me-ft-bottom{flex-direction:column;align-items:flex-start;}
  .me-ft-links{order:1;}.me-ft-copy{order:2;}
}
@media (max-width:480px){
  .me-shortcut-list{grid-template-columns:repeat(2,1fr);}
  /* [모바일 푸터 간소화] ≤480 — SNS만 노출(나머지 컬럼은 ≤768 규칙으로 이미 숨김). */
  .me-ft-cols{display:flex;}
  .me-hero-cta .me-btn{width:100%;justify-content:center;}
  .me-shortcut,.me-kpi{padding:20px 18px;}
}

/* =========================================================
   솔루션 상세 페이지 (Phase 2) — 기존 토큰·컴포넌트 재사용
   ========================================================= */
/* 공통 배지(badge) — 솔루션 히어로/로그인 등에서 사용(어두운 배경 기준 기본값) */
.me-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 16px;border-radius:100px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);
  font-size:14px;font-weight:700;margin-bottom:24px;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.me-badge .me-dot{width:7px;height:7px;border-radius:50%;background:var(--c-mint);box-shadow:0 0 0 4px rgba(60,186,181,.3);}
/* 공통 배경 장식 orb / 그리드 데코 — 솔루션·로그인 비주얼에서 사용 */
.me-orb{position:absolute;border-radius:50%;filter:blur(48px);opacity:.5;}
.me-orb1{width:480px;height:480px;background:radial-gradient(circle,var(--c-orb-blue),transparent 70%);top:-140px;right:-120px;}
.me-orb2{width:420px;height:420px;background:radial-gradient(circle,var(--c-mint),transparent 70%);bottom:-160px;left:-120px;opacity:.4;}
.me-grid-deco{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 75%);
  mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 75%);
}
.me-solhero{position:relative;background:var(--grad-hero);color:#fff;overflow:hidden;}
.me-solhero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.me-solhero-inner{position:relative;max-width:1100px;text-align:center;padding:88px 40px 80px;} /* 히어로 텍스트 폭 확대(피드백 3) — me-wrap(1440) 안에서 중앙정렬 */
.me-solhero .me-badge{margin-bottom:20px;}
.me-solhero-title{font-size:42px;font-weight:800;letter-spacing:-.025em;line-height:1.2;margin:0 0 22px;word-break:keep-all;overflow-wrap:anywhere;max-width:100%;}
.me-solhero-sub{font-size:17px;line-height:1.7;color:rgba(255,255,255,.85);margin:0;word-break:keep-all;overflow-wrap:anywhere;}

/* [폴리시] 항목 수가 홀수(예: 5개)면 2-col grid 의 마지막 행에 빈 셀이 생겨 큰 여백으로 보임 →
   flex+wrap+center 로 trailing 행을 중앙 정렬(데이터 주도 항목수에 안전). */
.me-parts-list{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;max-width:840px;margin:0 auto;list-style:none;padding:0;}
.me-parts-list > .me-part-item{flex:0 1 calc((100% - 16px)/2);min-width:0;}
.me-part-item{display:flex;align-items:flex-start;gap:13px;background:var(--c-bg-soft);border:1px solid var(--c-line);border-radius:14px;padding:18px 20px;font-size:16px;font-weight:600;color:var(--c-navy);word-break:keep-all;overflow-wrap:anywhere;}
.me-part-check{flex-shrink:0;width:28px;height:28px;border-radius:8px;background:var(--c-primary);color:#fff;display:flex;align-items:center;justify-content:center;}

/* [수정3] 핵심 포인트: 틴트 배경 섹션이 하단 패딩 없이(.me-solsec padding 56 0 0) 카드 바닥에서
   끊겨 카드 그림자가 잘려 보였다 → 라운드 패널로 만들고 상하 패딩을 줘 카드+그림자 안 잘리게.
   overflow:visible 로 그림자 보존. */
.me-solpoints{
  background:var(--c-bg-soft);
  border-radius:20px;
  overflow:visible;
}
.me-solpoints .me-sec-head{margin-bottom:24px;}
.me-solpoint-grid{grid-template-columns:repeat(3,1fr);}

.me-price-box{max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--c-line);border-radius:16px;box-shadow:var(--shadow-card);overflow:hidden;}
.me-price-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 26px;border-bottom:1px solid var(--c-line);}
.me-price-row:last-child{border-bottom:0;}
.me-price-key{font-size:15.5px;font-weight:600;color:var(--c-text-sub);flex-shrink:0;}
.me-price-val{font-size:16.5px;font-weight:700;color:var(--c-navy);text-align:right;word-break:keep-all;overflow-wrap:anywhere;}
.me-price-note{max-width:760px;margin:18px auto 0;font-size:14.5px;color:var(--c-text-sub);text-align:center;}

@media (max-width:768px){
  /* [스코프B/수정] 솔루션은 공유 .me-subhead 구조 사용 → 별도 솔히어로 모바일 규칙 불필요 */
  .me-solpage .me-solsec{padding-top:40px;}
  .me-sol-intro-head{font-size:20px;}
  .me-solpoint-grid{grid-template-columns:1fr;}
  /* [폴리시] parts-list flex 1-up basis(≤640). */
  .me-parts-list > .me-part-item{flex:1 1 100%;}
  .me-price-row{flex-direction:column;align-items:flex-start;gap:6px;}
  .me-price-val{text-align:left;}
}

/* round11: final layout polish after harness review */
@media (min-width:769px){
  .me-wrap.me-sub-wrap{
    max-width:1360px;
  }
  .me-sub-wrap #ctt_con,
  .me-sub-wrap #ctt_con > .me-page,
  .me-sub-wrap .me-content-visual,
  .me-sub-wrap #bo_list,
  .me-sub-wrap #bo_gall,
  .me-sub-wrap #bo_v,
  .me-sub-wrap #sch_res_detail,
  .me-sub-wrap #sch_result,
  .me-sub-wrap .register{
    max-width:1280px;
  }
}

.me-sub-wrap #bo_gall #gall_ul.gall_row{
  gap:20px;
}
.me-sub-wrap #bo_gall .gall_img{
  height:220px !important;
  max-height:220px !important;
}
.me-sub-wrap #bo_gall .gall_box{
  border-radius:18px;
}
.me-sub-wrap #bo_gall .gall_info{
  border-top:1px solid #edf1f8;
  margin:10px 20px 0;
  padding:14px 0 18px;
}

@media (min-width:769px){
  .me-sub-wrap #bo_list .tbl_head01{
    overflow:visible;
    border:0;
    background:transparent;
  }
  .me-sub-wrap #bo_list .tbl_head01 table,
  .me-sub-wrap #bo_list .tbl_head01 tbody{
    display:block;
    width:100%;
  }
  .me-sub-wrap #bo_list .tbl_head01 thead{
    display:none;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr{
    display:grid;
    grid-template-columns:minmax(0,1fr) 118px 82px 104px;
    gap:8px 18px;
    align-items:center;
    margin:0 0 12px;
    padding:20px 22px;
    border:1px solid var(--point-200);
    border-radius:16px;
    background:#fff;
    box-shadow:0 4px 14px rgba(24,98,95,.05); /* [수정8] 게시판 그림자 톤다운(blur 28→14) */
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr:hover{
    transform:translateY(-2px);
    border-color:rgba(31,122,119,.26);
    box-shadow:0 8px 22px rgba(24,98,95,.09); /* [수정8] hover 그림자도 톤다운 */
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr:hover td{
    background:transparent;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td{
    display:block;
    height:auto;
    padding:0 !important;
    border:0 !important;
    background:transparent;
    text-align:left;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num2{
    display:none;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_subject{
    grid-column:1;
    grid-row:1 / span 2;
    min-width:0;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_name,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_datetime{
    color:#66758d;
    font-size:13.5px;
    font-variant-numeric:tabular-nums;
    text-align:right;
  }
  .me-sub-wrap #bo_list .bo_tit a{
    display:inline;
    color:var(--c-navy);
    font-size:17px;
    font-weight:800;
    text-decoration:none;
  }
  .me-sub-wrap #bo_list .bo_tit a:hover{
    color:var(--c-primary);
  }
}

@media (max-width:1080px){
  .me-hd-inner{
    justify-content:space-between;
  }
  .me-logo{
    order:0;
    margin-right:auto;
  }
  .me-hd-util{
    order:0;
    margin-left:auto;
    margin-right:0;
    gap:8px;
  }
  .me-burger{
    margin-left:0;
  }
}
@media (max-width:768px){
  .me-sub-wrap #bo_gall #gall_ul.gall_row{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .me-sub-wrap #bo_gall .gall_img{
    height:210px !important;
    max-height:210px !important;
  }
  .me-sub-wrap #bo_list .tbl_head01{
    max-width:100%;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

/* round12: responsive typography and content-card hardening */
.me-sub-wrap #ctt_con,
.me-sub-wrap #ctt_con .me-page,
.me-sub-wrap #ctt_con .me-page-title,
.me-sub-wrap #ctt_con .me-page-lead,
.me-sub-wrap #ctt_con .me-section-head,
.me-sub-wrap #ctt_con .me-feature-card,
.me-sub-wrap #ctt_con .me-page-summary,
.me-sub-wrap #ctt_con .me-photo-copy,
.me-sub-wrap #ctt_con .me-cta-panel{
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-sub-wrap #ctt_con .me-page-title{
  max-width:820px;
  font-size:38px !important;
  line-height:1.28 !important;
  text-wrap:balance;
}
.me-sub-wrap #ctt_con .me-page-lead{
  max-width:820px;
  font-size:17.5px !important;
  line-height:1.78 !important;
}
.me-sub-wrap #ctt_con .me-page-intro{
  grid-template-columns:minmax(0,1fr) minmax(320px,360px);
  gap:40px;
  align-items:center;
}
.me-sub-wrap #ctt_con .me-page-summary{
  grid-template-columns:1fr;
  gap:10px;
}
.me-sub-wrap #ctt_con .me-page-summary li{
  min-height:0;
  display:grid;
  grid-template-columns:84px minmax(0,1fr);
  gap:10px;
  align-items:center;
  padding:18px 20px;
}
.me-sub-wrap #ctt_con .me-page-summary b{
  margin:0;
  font-size:24px;
}
.me-sub-wrap #ctt_con .me-page-summary span{
  font-size:14px;
  line-height:1.5;
}
.me-sub-wrap #ctt_con .me-feature-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.me-sub-wrap #ctt_con .me-feature-card{
  display:block !important;
  min-height:0;
  padding:24px 26px;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
}
.me-sub-wrap #ctt_con .me-feature-card strong{
  display:inline-flex !important;
  width:auto;
  min-width:42px;
  height:42px;
  margin:0 0 16px !important;
  text-indent:0;
}
.me-sub-wrap #ctt_con .me-feature-card h3{
  margin:0 0 10px !important;
  font-size:20px !important;
  line-height:1.35 !important;
}
.me-sub-wrap #ctt_con .me-feature-card ul{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
.me-sub-wrap #ctt_con .me-feature-card li{
  margin:7px 0 0 !important;
  padding-left:15px !important;
  line-height:1.68;
}
.me-sub-wrap #ctt_con .me-photo-split{
  grid-template-columns:minmax(0,1fr) minmax(360px,42%);
}

@media (max-width:1080px){
  .me-sub-wrap #ctt_con .me-page-title{
    max-width:100%;
    font-size:32px !important;
  }
  .me-sub-wrap #ctt_con .me-page-intro{
    grid-template-columns:1fr;
  }
  .me-sub-wrap #ctt_con .me-page-summary{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .me-sub-wrap #ctt_con .me-page-summary li{
    grid-template-columns:1fr;
  }
}
@media (max-width:768px){
  .me-sub-wrap #ctt_con .me-page-title{
    font-size:27px !important;
    line-height:1.34 !important;
  }
  .me-sub-wrap #ctt_con .me-page-lead{
    font-size:16px !important;
  }
  .me-sub-wrap #ctt_con .me-page-summary,
  .me-sub-wrap #ctt_con .me-feature-grid{
    grid-template-columns:1fr;
  }
  .me-sub-wrap #ctt_con .me-page-summary li{
    grid-template-columns:82px minmax(0,1fr);
  }
  .me-sub-wrap #ctt_con .me-photo-split{
    grid-template-columns:1fr;
  }
}
/* =========================================================
   컨설팅 폼 (Phase 2)
   ========================================================= */
.me-consult-wrap{max-width:720px;margin:0 auto;}
.me-consult-form{display:flex;flex-direction:column;gap:20px;}
.me-fld{display:flex;flex-direction:column;gap:8px;}
.me-fld-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.me-fld label{font-size:15px;font-weight:700;color:var(--c-navy);}
.me-req{color:var(--c-error);}
/* a11y: 필드별 오류 메시지 + 실패 input 강조(aria-invalid 연동) */
.me-fld-msg{font-size:13.5px;font-weight:600;color:var(--c-error-text);margin-top:2px;}
.me-fld [aria-invalid="true"]{border-color:var(--c-error);}
.me-fld [aria-invalid="true"]:focus{box-shadow:0 0 0 3px rgba(224,65,79,.25);}
.me-fld input,.me-fld select,.me-fld textarea{
  width:100%;font-size:16px;color:var(--c-text);
  padding:13px 15px;border:1.5px solid var(--c-line);border-radius:11px;
  background:#fff;transition:border-color .15s,box-shadow .15s;font-family:inherit;
}
.me-fld input:focus,.me-fld select:focus,.me-fld textarea:focus{
  outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(31,122,119,.4);
}
.me-fld textarea{resize:vertical;line-height:1.6;}
.me-fld-agree{margin-top:4px;}
.me-check{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;font-weight:400;color:var(--c-text-sub);line-height:1.55;cursor:pointer;}
.me-check input{width:20px;height:20px;flex-shrink:0;margin-top:1px;accent-color:var(--c-primary);}
.me-consult-submit{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px;}
.me-consult-tel{font-size:15px;color:var(--c-text-sub);margin:0;}
.me-consult-tel a{color:var(--c-primary);font-weight:700;text-decoration:none;}
.me-consult-err{background:var(--c-error-bg);border:1px solid var(--c-error-line);border-radius:12px;padding:16px 20px;margin-bottom:24px;color:var(--c-error-text);}
.me-consult-err strong{display:block;margin-bottom:6px;font-size:15.5px;}
.me-consult-err ul{margin:0;padding-left:18px;font-size:14.5px;}
.me-consult-done{text-align:center;max-width:560px;margin:0 auto;padding:24px 0;}
.me-consult-done-ico{color:var(--point-strong);display:inline-flex;margin-bottom:18px;}
.me-consult-done h2{font-size:26px;font-weight:800;color:var(--c-navy);margin:0 0 12px;}
.me-consult-done p{font-size:16px;color:var(--c-text-sub);line-height:1.7;margin:0 0 26px;}
@media (max-width:768px){
  .me-fld-row{grid-template-columns:1fr;}
}

/* =========================================================
   서브페이지 통합 셸 (게시판·내용관리 공통)
   - 서브헤더(타이틀+breadcrumb) / 1440 콘텐츠 래퍼 / 그누보드 스킨 톤 통일
   - 8120 .c-page-header 패턴을 metaedu 토큰으로 이식
   ========================================================= */
/* 서브 비주얼(피드백 4): 참고서버 .page-hero 패턴을 metaedu 딥블루 톤으로 이식.
   딥블루~네이비 그라데 + 그리드 데코, 중앙정렬 타이틀 + breadcrumb, 좌우 1440(me-wrap) */
.me-subhead{
  position:relative;overflow:hidden;
  background:linear-gradient(115deg,var(--c-primary) 0%,var(--point-deep) 78%);
  color:#fff;
  padding:54px 0 48px;
  text-align:center;
}
.me-subhead::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 75% 80% at 50% 25%,#000,transparent 78%);
  mask-image:radial-gradient(ellipse 75% 80% at 50% 25%,#000,transparent 78%);
}
.me-subhead::after{
  content:"";position:absolute;top:-130px;right:-100px;width:380px;height:380px;border-radius:50%;
  background:radial-gradient(circle,rgba(60,186,181,.35),transparent 70%);filter:blur(40px);pointer-events:none;
}
.me-subhead .me-wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;}
.me-subhead-title{font-size:38px;font-weight:800;letter-spacing:-.025em;color:#fff;margin:0;line-height:1.25;text-shadow:0 3px 16px rgba(8,24,55,.3);order:2;}
.me-crumb{font-size:13.5px;color:rgba(255,255,255,.82);display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:6px;order:1;}
.me-crumb a{color:rgba(255,255,255,.82);text-decoration:none;}
.me-crumb a:hover{color:#fff;text-decoration:underline;}
.me-crumb-sep{color:rgba(255,255,255,.45);}
.me-crumb-cur{color:#fff;font-weight:700;}
.me-sub-wrap{padding-top:48px;padding-bottom:80px;color:var(--c-text);font-size:16px;line-height:1.7;}
/* 서브 페이지 안의 링크 색. 버튼(.me-btn)까지 덮으면 파랑 배경에 파랑 글씨가
   된다. 솔루션 CTA 에서 한 번 터져 그 자리만 막아 뒀었는데, 회사소개 하단
   상담 버튼에서 같은 일이 다시 났다. 버튼은 제 색을 쓰게 여기서 뺀다. */
.me-sub-wrap a:not(.me-btn){color:var(--c-primary);}
/* 그누보드 기본 콘텐츠 폭 제한(#ctt,#bo_v_atc 등)이 1440 래퍼와 충돌하지 않도록 중화 */
.me-sub-wrap #bo_list,.me-sub-wrap #bo_gall,.me-sub-wrap #bo_v,.me-sub-wrap #bo_w{
  width:auto !important;max-width:none !important;margin-left:0;margin-right:0;
}

/* =========================================================
   게시판 — 리스트 (skin/board/basic)
   ========================================================= */
.me-sub-wrap #bo_list{font-size:16px;}
.me-sub-wrap #bo_cate{margin-bottom:22px;}
.me-sub-wrap #bo_cate h2{position:absolute;left:-9999px;}
.me-sub-wrap #bo_cate_ul{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none;}
.me-sub-wrap #bo_cate_ul li a,.me-sub-wrap #bo_cate_ul li strong{
  display:inline-flex;align-items:center;height:38px;padding:0 18px;border-radius:999px;
  font-size:14.5px;font-weight:600;text-decoration:none;border:1px solid var(--c-line);
  color:var(--c-text-sub);background:#fff;
}
.me-sub-wrap #bo_cate_ul li strong{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}

/* 상단 버튼바 */
/* [수정7] 상단 Total/검색 바와 첫 게시물 행이 너무 붙어 보임 → 하단 여백 확대(16→28px) */
.me-sub-wrap #bo_btn_top{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:28px;}
.me-sub-wrap #bo_list_total{font-size:14.5px;color:var(--c-text-sub);margin-right:auto;} /* 총건수 좌측, 버튼 우측 군집 */
.me-sub-wrap #bo_list_total span{font-weight:700;color:var(--c-navy);}
.me-sub-wrap #bo_list_total .bo_list_page{font-weight:500;color:var(--c-text-sub);margin-left:8px;}
.me-sub-wrap .btn_bo_user{display:flex;gap:8px;padding:0;margin:0;list-style:none;}
.me-sub-wrap .btn_bo_user .btn,
.me-sub-wrap .btn_bo_user button.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:40px;min-width:40px;padding:0 14px;border-radius:10px;
  font-size:14px;font-weight:600;line-height:1;cursor:pointer;text-decoration:none;
  border:1px solid var(--c-line);background:#fff;color:var(--c-text-sub);
  transition:background .15s,color .15s,border-color .15s;
}
.me-sub-wrap .btn_bo_user .btn:hover{background:var(--c-bg-soft);color:var(--c-primary);border-color:var(--c-primary);}
.me-sub-wrap .btn_bo_user .btn_b01,
.me-sub-wrap .btn_bo_user a.btn_b01{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}
.me-sub-wrap .btn_bo_user .btn_b01:hover{background:var(--c-primary-deep);border-color:var(--c-primary-deep);color:#fff;}
/* [목록 버튼 개선] 아이콘만 외톨이로 떠 보이던 목록 버튼에 "목록" 라벨 표시(아이콘+텍스트).
   주의: 코어 스킨 style.css 의 `.btn_bo_user li{width:40px}` 가 버튼을 40px 로 고정해 라벨이 찌그러진다 →
   목록 버튼이 든 li 의 width 고정을 해제(auto)하고 텍스트가 보이도록 한다. */
/* 목록 버튼은 항상 .bo_v_com 의 첫 li → :has() 미지원 브라우저 대비 first-child 도 병행 */
.me-sub-wrap .btn_bo_user li:has(> .me-list-btn),
.me-sub-wrap .bo_v_com > li:first-child{width:auto;}
.me-sub-wrap .btn_bo_user .me-list-btn{width:auto;min-width:88px;padding:0 18px;}
.me-sub-wrap .btn_bo_user .me-list-btn .me-list-btn-label{display:inline;font-size:14px;font-weight:700;}

/* 리스트 테이블 */
.me-sub-wrap .tbl_head01{margin:0;}
.me-sub-wrap .tbl_head01 table{width:100%;border-collapse:collapse;table-layout:fixed;}
.me-sub-wrap .tbl_head01 caption{position:absolute;left:-9999px;height:0;overflow:hidden;}
/* [수정4] 헤더 톤 완화: 진한 네이비(#0C2F5A) → 딥블루 그라데(primary→primary-deep)로 한 단계 밝게.
   흰 텍스트 유지(대비 충분), 하단 민트 라인으로 포인트. */
.me-sub-wrap .tbl_head01 thead th{
  background:linear-gradient(180deg,var(--c-primary) 0%,var(--c-primary-deep) 100%);
  color:#fff;font-size:14.5px;font-weight:700;
  padding:15px 10px;border:0;border-bottom:2px solid var(--c-mint);text-align:center;
}
.me-sub-wrap .tbl_head01 thead th a{color:#fff;text-decoration:none;}
.me-sub-wrap .tbl_head01 tbody td{
  padding:15px 10px;border-bottom:1px solid var(--c-line);font-size:15.5px;
  color:var(--c-text);text-align:center;vertical-align:middle;
}
.me-sub-wrap .tbl_head01 tbody tr:hover td{background:var(--c-bg-soft);}
.me-sub-wrap .tbl_head01 .td_subject,
.me-sub-wrap .tbl_head01 td.td_subject{text-align:left;}
/* [수정4-b] 글쓴이(td_name)·번호·조회·날짜 메타컬럼 중앙정렬 명시(코어 스킨 좌측정렬 제압) */
.me-sub-wrap .tbl_head01 td.td_name,
.me-sub-wrap .tbl_head01 td.td_num,
.me-sub-wrap .tbl_head01 td.td_num2,
.me-sub-wrap .tbl_head01 td.td_datetime{text-align:center;}
/* C-1 컬럼 비율: 제목 와이드(width 미지정), 메타컬럼 좁게 고정. table-layout:fixed 기준.
   tbody td는 클래스로, thead th는 첫 행이라 폭을 결정 → nth-child로 지정(2케이스: 체크박스 유/무).
   번호 td_num2 / 글쓴이 td_name / 조회 td_num / 날짜 td_datetime */
.me-sub-wrap .tbl_head01 .td_num2{width:72px;}
.me-sub-wrap .tbl_head01 .td_name{width:150px;}
.me-sub-wrap .tbl_head01 .td_num{width:90px;}
.me-sub-wrap .tbl_head01 .td_datetime{width:120px;}
.me-sub-wrap .tbl_head01 .td_chk,.me-sub-wrap .tbl_head01 .chk_box{width:42px;}
/* 비로그인(체크박스 無): th 1번호/2제목/3글쓴이/4조회/5날짜 */
.me-sub-wrap .tbl_head01 thead th:nth-child(1){width:72px;}
.me-sub-wrap .tbl_head01 thead th:nth-child(3){width:150px;}
.me-sub-wrap .tbl_head01 thead th:nth-child(4){width:90px;}
.me-sub-wrap .tbl_head01 thead th:nth-child(5){width:120px;}
/* 제목(2번째)은 width 미지정 → 나머지 폭 차지 */
.me-sub-wrap .tbl_head01 thead th:nth-child(2){width:auto;}
/* 관리자(체크박스 有): th 1체크/2번호/3제목/4글쓴이/5조회/6날짜 */
.me-sub-wrap .tbl_head01 thead th.chk_box{width:42px;}
.me-sub-wrap .tbl_head01 thead tr:has(.chk_box) th:nth-child(2){width:72px;}
.me-sub-wrap .tbl_head01 thead tr:has(.chk_box) th:nth-child(3){width:auto;}
.me-sub-wrap .tbl_head01 thead tr:has(.chk_box) th:nth-child(4){width:150px;}
.me-sub-wrap .tbl_head01 thead tr:has(.chk_box) th:nth-child(5){width:90px;}
.me-sub-wrap .tbl_head01 thead tr:has(.chk_box) th:nth-child(6){width:120px;}
.me-sub-wrap .tbl_head01 thead th.th_num{width:72px;}
.me-sub-wrap .tbl_head01 thead th.th_subject{width:auto;}
.me-sub-wrap .tbl_head01 thead th.th_name{width:150px;}
.me-sub-wrap .tbl_head01 thead th.th_hit,
.me-sub-wrap .tbl_head01 thead th.th_good,
.me-sub-wrap .tbl_head01 thead th.th_nogood{width:90px;}
.me-sub-wrap .tbl_head01 thead th.th_date{width:120px;}
.me-sub-wrap .bo_tit{font-weight:600;}
.me-sub-wrap .bo_tit a{color:var(--c-text);text-decoration:none;}
.me-sub-wrap .bo_tit a:hover{color:var(--c-primary);text-decoration:underline;}
.me-sub-wrap .td_num,.me-sub-wrap .td_num2,.me-sub-wrap .td_datetime,.me-sub-wrap .td_name{color:var(--c-text-sub);font-size:14px;}
.me-sub-wrap .bo_notice td{background:var(--c-bg-soft);}
.me-sub-wrap .notice_icon{display:inline-block;padding:3px 9px;border-radius:6px;background:var(--c-mint);color:#fff;font-size:12px;font-weight:700;}
.me-sub-wrap .new_icon{display:inline-block;margin-left:5px;padding:1px 6px;border-radius:5px;background:var(--c-error);color:#fff;font-size:11px;font-weight:700;vertical-align:middle;}
.me-sub-wrap .empty_table{padding:60px 10px !important;color:var(--c-text-sub);font-size:15.5px;}

/* 페이징 (그누보드 공통 .pg_wrap/.pg) */
.me-sub-wrap .pg_wrap{margin:30px 0 0;text-align:center;}
.me-sub-wrap .pg{display:inline-flex;gap:6px;}
.me-sub-wrap .pg_page,.me-sub-wrap .pg_current,.me-sub-wrap .pg_start,.me-sub-wrap .pg_end,.me-sub-wrap .pg_prev,.me-sub-wrap .pg_next{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;
  padding:0 10px;border-radius:10px;border:1px solid var(--c-line);background:#fff;
  color:var(--c-text-sub);font-size:14.5px;font-weight:600;text-decoration:none;
}
.me-sub-wrap .pg_current{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}
.me-sub-wrap a.pg_page:hover{border-color:var(--c-primary);color:var(--c-primary);}

/* 검색박스 */
.me-sub-wrap .bo_sch_wrap{position:fixed;}
.me-sub-wrap .bo_sch{background:#fff;border:1px solid var(--c-line);border-radius:14px;box-shadow:var(--shadow-card);padding:24px;}
.me-sub-wrap .bo_sch h3{font-size:17px;font-weight:800;color:var(--c-navy);margin:0 0 14px;}
.me-sub-wrap .bo_sch select,.me-sub-wrap .bo_sch .sch_input{
  height:44px;border:1.5px solid var(--c-line);border-radius:10px;font-size:15px;padding:0 12px;
}
.me-sub-wrap .sch_btn{height:44px;border:0;border-radius:10px;background:var(--c-primary);color:#fff;padding:0 16px;cursor:pointer;}

/* [개편] 글쓰기 파일첨부 input 모바일 가로 overflow 방지 (m-1) */
.me-sub-wrap #bo_w input[type="file"],
.me-sub-wrap #bo_w .frm_file{max-width:100%;box-sizing:border-box;}
.me-sub-wrap #bo_w .frm_file{display:block;}

/* =========================================================
   게시판 — 뷰 (skin/board/basic view)
   ========================================================= */
.me-sub-wrap #bo_v{border:1px solid var(--c-line);border-radius:16px;background:#fff;box-shadow:var(--shadow-card);padding:34px 34px 28px;}
/* [글보기 제목 축소] 24→20px — 본문과 위계 자연스럽게(서브히어로 h1 과 구분). 모바일은 ≤768 에서 18px.
   주의: 코어 스킨 style.css 의 `#bo_v_title .bo_v_tit{font-size:2em}`(=2×부모, 과대)을 이기려면
   동일/상위 특정도가 필요 → 실제 표시 span 인 #bo_v_title .bo_v_tit 를 명시 타겟. */
.me-sub-wrap #bo_v_title,.me-sub-wrap .bo_v_tit{font-size:20px;font-weight:800;color:var(--c-navy);line-height:1.4;margin:0 0 12px;}
.me-sub-wrap #bo_v_title .bo_v_tit{font-size:20px;line-height:1.4;margin:0;}
.me-sub-wrap #bo_v_info{display:flex;flex-wrap:wrap;gap:14px;padding:0 0 18px;margin:0 0 24px;border-bottom:2px solid var(--c-navy);font-size:14px;color:var(--c-text-sub);list-style:none;}
.me-sub-wrap #bo_v_info .sv_member,.me-sub-wrap #bo_v_info strong{color:var(--c-navy);}
.me-sub-wrap #bo_v_atc,.me-sub-wrap #bo_v_con{font-size:16.5px;line-height:1.85;color:var(--c-text);min-height:160px;overflow-x:auto;overflow-y:visible;}
.me-sub-wrap #bo_v_con img{max-width:100%;height:auto;border-radius:8px;}
.me-sub-wrap #bo_v_con table,.me-sub-wrap #bo_v_con iframe,.me-sub-wrap #bo_v_con pre{max-width:100%;}
.me-sub-wrap #bo_v_con pre{overflow-x:auto;white-space:pre-wrap;}
.me-sub-wrap #bo_v_file{margin:24px 0 0;border:1px solid var(--c-line);border-radius:12px;background:var(--c-bg-soft);padding:16px 20px;}
.me-sub-wrap #bo_v_file h2{font-size:14px;font-weight:700;color:var(--c-navy);margin:0 0 8px;}
.me-sub-wrap #bo_v_bot{margin-top:26px;display:flex;justify-content:flex-end;gap:8px;}
.me-sub-wrap #bo_v_bot .btn_b01,.me-sub-wrap #bo_v_bot .btn_b02,.me-sub-wrap #bo_v_bot .btn{
  display:inline-flex;align-items:center;height:44px;padding:0 20px;border-radius:10px;
  font-size:14.5px;font-weight:600;text-decoration:none;border:1px solid var(--c-line);
  background:#fff;color:var(--c-text-sub);
}
.me-sub-wrap #bo_v_bot .btn_b01{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}
.me-sub-wrap #bo_v_act,.me-sub-wrap .bo_v_com{margin-top:30px;}
/* [수정3] 본문 상단 공유/스크랩 영역(#bo_v_share): 스크랩 버튼 글자 줄바꿈 방지 + 액션버튼 톤 통일 */
.me-sub-wrap #bo_v_share{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px;}
.me-sub-wrap #bo_v_share .btn_b03,
.me-sub-wrap #bo_v_share a.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:40px;padding:0 16px;border-radius:10px;white-space:nowrap;
  font-size:14px;font-weight:600;line-height:1;text-decoration:none;
  border:1px solid var(--c-line);background:#fff;color:var(--c-text-sub);
  transition:background .15s,color .15s,border-color .15s;
}
.me-sub-wrap #bo_v_share .btn_b03:hover,
.me-sub-wrap #bo_v_share a.btn:hover{background:var(--c-bg-soft);color:var(--c-primary);border-color:var(--c-primary);}
.me-sub-wrap #bo_v_share .btn_b03 i{font-size:13px;}
/* 뷰 상단 버튼바(목록/답변/글쓰기/옵션) 우측 정렬 */
.me-sub-wrap #bo_v_info{align-items:center;}
.me-sub-wrap #bo_v_top{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-left:auto;}
.me-sub-wrap #bo_v_top .btn_bo_user{justify-content:flex-end;}
/* 댓글 등록 버튼 테마 통일(라운드 primary) */
.me-sub-wrap #btn_submit.btn_submit{
  height:48px;padding:0 28px;border-radius:12px;border:0;
  background:var(--c-primary);color:#fff;font-weight:700;font-size:15px;
  cursor:pointer;transition:transform .18s,background .18s;box-shadow:0 6px 16px rgba(31,122,119,.28);
}
.me-sub-wrap #btn_submit.btn_submit:hover{background:var(--c-primary-deep);transform:translateY(-1px);}

/* =========================================================
   게시판 — 글쓰기 (skin/board/basic write)
   ========================================================= */
.me-sub-wrap #bo_w{border:1px solid var(--c-line);border-radius:16px;background:#fff;box-shadow:var(--shadow-card);padding:30px 32px;}
.me-sub-wrap #bo_w .frm_input,.me-sub-wrap #bo_w input[type=text],.me-sub-wrap #bo_w input[type=password],.me-sub-wrap #bo_w textarea,.me-sub-wrap #bo_w select{
  border:1.5px solid var(--c-line);border-radius:10px;font-size:15.5px;padding:11px 13px;font-family:inherit;
}
.me-sub-wrap #bo_w .frm_input:focus,.me-sub-wrap #bo_w textarea:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(31,122,119,.4);}
.me-sub-wrap #bo_w .write_div{margin-bottom:16px;}
.me-sub-wrap #bo_w label,.me-sub-wrap #bo_w .frm_info{color:var(--c-navy);font-weight:600;}
/* C-2 글쓰기 하단 버튼: 작성완료(solid primary)·취소(outline) 둘 다 라운드 통일.
   동일 height/radius/padding/font, 우측 정렬.
   스킨 style.css의 #bo_w .btn_cancel{border-radius:3px}(특이도 1,1,0) 제압 위해 #bo_w 스코프 사용 */
.me-sub-wrap #bo_w .btn_confirm{margin-top:24px;display:flex;gap:10px;justify-content:flex-end;align-items:center;}
.me-sub-wrap #bo_w .btn_confirm .btn_submit,
.me-sub-wrap #bo_w .btn_confirm .btn_cancel,
.me-sub-wrap #bo_w .btn_confirm a.btn,
.me-sub-wrap #bo_w .btn_confirm button.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:50px;padding:0 28px;border-radius:12px;
  font-size:16px;font-weight:700;line-height:1;cursor:pointer;text-decoration:none;
  box-sizing:border-box;transition:background .15s,color .15s,border-color .15s,box-shadow .15s;
}
.me-sub-wrap #bo_w .btn_confirm .btn_submit{border:1.5px solid var(--c-primary);background:var(--c-primary);color:#fff;}
.me-sub-wrap #bo_w .btn_confirm .btn_submit:hover{background:var(--c-primary-deep);border-color:var(--c-primary-deep);}
.me-sub-wrap #bo_w .btn_confirm .btn_cancel,
.me-sub-wrap #bo_w .btn_confirm a.btn:not(.btn_submit){
  border:1.5px solid var(--c-line);background:#fff;color:var(--c-text-sub);font-weight:600;
}
.me-sub-wrap #bo_w .btn_confirm .btn_cancel:hover,
.me-sub-wrap #bo_w .btn_confirm a.btn:not(.btn_submit):hover{border-color:var(--c-primary);color:var(--c-primary);background:var(--c-bg-soft);}

/* =========================================================
   게시판 — 갤러리형 (skin/board/gallery, 구축사례 case)
   구조: #bo_gall > ul#gall_ul.gall_row > li.gall_li > .gall_box > .gall_con
   ========================================================= */
.me-sub-wrap #bo_gall{width:auto !important;max-width:none !important;}
/* 스킨 #bo_gall #gall_ul{margin:10px -10px 0} 중화(피드백 5: 하단 여백 과다) */
/* [갤러리 정렬] 표준 게시판 갤러리처럼 3열 좌측정렬 그리드. trailing 카드(4번째)는 2행 맨 왼쪽에 시작(중앙정렬 X).
   (이전 flex+center 의 중앙정렬은 사용자 요청으로 좌측정렬 그리드로 복원. 갤러리에만 적용 — repsol/parts/feature 는 불변) */
.me-sub-wrap #bo_gall #gall_ul.gall_row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;list-style:none;padding:0;margin:0 0 4px;}
.me-sub-wrap #bo_gall #gall_ul.gall_row:after{display:none;content:none;}
.me-sub-wrap .gall_li{float:none !important;width:auto !important;margin:0 !important;padding:0 !important;border:0;list-style:none;}
.me-sub-wrap .gall_li.box_clear{clear:none;}
/* 스킨 #bo_gall .gall_box{margin:0 0 50px} 의 50px 하단여백 제거 */
.me-sub-wrap #bo_gall .gall_box{height:100%;margin:0 !important;border:1px solid var(--c-line);border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--shadow-card);transition:transform .2s,box-shadow .2s;}
.me-sub-wrap .gall_li:hover .gall_box{transform:translateY(-4px);box-shadow:var(--shadow-card-hover);}
.me-sub-wrap .gall_con{margin:0;padding:0;}
.me-sub-wrap .gall_img{display:block;width:100%;height:200px !important;max-height:200px !important;overflow:hidden;background:var(--c-bg-soft);}
.me-sub-wrap .gall_img a{display:block;width:100%;height:100%;}
.me-sub-wrap .gall_img img{width:100%;height:100%;object-fit:cover;}
/* [수정2] 썸네일 없을 때 "no image" 텍스트 → 브랜드 기본 이미지 노출.
   스킨이 출력하는 <span class="no_image">no image</span> 의 텍스트를 숨기고 background로 대체(코어/스킨 무수정).
   특이도 주의: 스킨 style.css `#bo_gall .gall_img span{background:#eaeaea}`(ID 1)를 제압하기 위해
   #bo_gall 포함(ID 1, class 3 → 우위) + line-height 인라인은 0 !important로 제압. */
.me-sub-wrap #bo_gall .gall_img .no_image{
  display:block;width:100%;height:100% !important;line-height:0 !important;
  font-size:0;color:transparent;text-indent:-9999px;overflow:hidden;
  background:var(--c-navy) url(../img/no-image.png) center/cover no-repeat !important;
}
.me-sub-wrap .gall_img .is_notice{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--c-mint);color:#fff;font-weight:700;}
.me-sub-wrap .gall_text_href{display:block;padding:18px 20px 8px;}
/* [수정1] 제목 정확히 2줄 강제: line-clamp 2 + min-height로 1줄이어도 2줄 높이 확보 → 카드 높이 일관.
   line-height 1.45 × 2줄 = 2.9em (16.5px 기준 약 47.85px) */
.me-sub-wrap .gall_text_href .bo_tit{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;
  overflow:hidden;text-overflow:ellipsis;
  min-height:2.9em;font-size:16.5px;font-weight:700;color:var(--c-navy);line-height:1.45;text-decoration:none;
}
.me-sub-wrap .gall_text_href .bo_tit:hover{color:var(--c-primary);}
/* [수정1] 본문(요약) 정확히 2줄: 3줄 노출 금지. line-clamp 2 + min-height로 1줄이어도 공간 확보 */
.me-sub-wrap .gall_text_href .bo_cnt{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;
  overflow:hidden;text-overflow:ellipsis;
  min-height:3.1em;margin-top:8px;font-size:14px;color:var(--c-text-sub);line-height:1.55;
}
.me-sub-wrap .gall_info{padding:0 20px 18px;font-size:13px;color:var(--c-text-sub);display:flex;flex-wrap:wrap;gap:12px;}
.me-sub-wrap .gall_info .gall_date{display:inline-flex;align-items:center;gap:4px;}
.me-sub-wrap .gall_option{padding:0 20px;}
.me-sub-wrap .gall_option:empty{display:none;} /* 추천/비추천 미사용 시 빈 영역 접기(하단 여백 정리) */
.me-sub-wrap .gall_box .gall_con{padding-bottom:4px;}
.me-sub-wrap #gall_allchk{margin-bottom:14px;}
.me-sub-wrap .empty_list{grid-column:1/-1;list-style:none;text-align:center;padding:60px 10px;color:var(--c-text-sub);font-size:15.5px;}

/* =========================================================
   내용관리(co_id) — skin/content/basic (#ctt)
   ========================================================= */
.me-sub-wrap #ctt{max-width:none;margin:0 auto;}
.me-sub-wrap #ctt [style*="max-width"]{max-width:none !important;} /* 본문 인라인 폭제한 해제 — 1440 통일 */
.me-sub-wrap #ctt > header{display:none;} /* 서브헤더와 중복되는 본문 h1 제거 */
.me-sub-wrap #ctt_con{font-size:17px;line-height:1.9;color:var(--c-text);}
.me-sub-wrap #ctt_con h2{font-size:26px;font-weight:800;color:var(--c-navy);margin:48px 0 18px;letter-spacing:-.02em;}
.me-sub-wrap #ctt_con h2:first-child{margin-top:0;}
.me-sub-wrap #ctt_con h3{font-size:20px;font-weight:700;color:var(--c-primary);margin:34px 0 14px;}
.me-sub-wrap #ctt_con h4{font-size:17.5px;font-weight:700;color:var(--c-navy);margin:24px 0 10px;}
.me-sub-wrap #ctt_con p{margin:0 0 18px;}
.me-sub-wrap #ctt_con ul,.me-sub-wrap #ctt_con ol{margin:0 0 18px;padding-left:22px;}
.me-sub-wrap #ctt_con li{margin:0 0 8px;}
.me-sub-wrap #ctt_con img{max-width:100%;height:auto;border-radius:12px;margin:8px 0;}
.me-sub-wrap #ctt_con table{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:15.5px;}
.me-sub-wrap #ctt_con th{background:var(--c-bg-soft);color:var(--c-navy);font-weight:700;padding:13px 14px;border:1px solid var(--c-line);text-align:left;}
.me-sub-wrap #ctt_con td{padding:13px 14px;border:1px solid var(--c-line);}
.me-sub-wrap #ctt_con blockquote{margin:0 0 20px;padding:16px 22px;border-left:4px solid var(--c-primary);background:var(--c-bg-soft);border-radius:0 10px 10px 0;color:var(--c-text-sub);}
.me-sub-wrap #ctt_con strong{color:var(--c-navy);}
/* 본문 링크 규칙이라 아이디 선택자가 섞여 있고, 그 탓에 같은 영역에 놓인
   버튼(.me-btn)의 글자색까지 덮어 파란 배경에 파란 글씨가 됐었다.
   버튼은 제 색과 밑줄 없음을 지킨다. */
.me-sub-wrap #ctt_con a:not(.me-btn){color:var(--c-primary);text-decoration:underline;}

/* =========================================================
   서브페이지 반응형
   ========================================================= */
@media (max-width:1024px){
  .me-sub-wrap #gall_ul.gall_row{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px){
  .me-subhead{padding:34px 0 30px;}
  .me-subhead-title{font-size:26px;}
  .me-sub-wrap{padding-top:32px;padding-bottom:56px;}
  .me-sub-wrap #gall_ul.gall_row{grid-template-columns:1fr;}
  .me-sub-wrap #bo_v,.me-sub-wrap #bo_w{padding:22px 18px;}
  /* [모바일 여백 축소] 글보기 본문 최소높이(160px)는 짧은 글에서 빈 여백을 만든다 → 60px 로 축소. */
  .me-sub-wrap #bo_v_atc,.me-sub-wrap #bo_v_con{min-height:60px;}
  /* 메타구분선·추천영역·상단버튼 간격 모바일 축소 */
  .me-sub-wrap #bo_v_info{margin-bottom:18px;padding-bottom:14px;}
  .me-sub-wrap #bo_v_act,.me-sub-wrap .bo_v_com{margin-top:20px;}
  .me-sub-wrap .bo_v_nb{margin-top:18px;}
  /* [글보기 제목 축소] 모바일 18px (코어 2em 이기도록 #bo_v_title .bo_v_tit 명시) */
  .me-sub-wrap #bo_v_title,.me-sub-wrap .bo_v_tit{font-size:18px;line-height:1.4;margin:0 0 10px;}
  .me-sub-wrap #bo_v_title .bo_v_tit{font-size:18px;line-height:1.4;margin:0;}
  /* 좁은 화면: 글쓴이(3)·조회(4) 열 숨김 → 번호·제목·날짜만 노출 */
  .me-sub-wrap .tbl_head01 thead th:nth-child(3),
  .me-sub-wrap .tbl_head01 thead th:nth-child(4),
  .me-sub-wrap .tbl_head01 tbody td.td_name,
  .me-sub-wrap .tbl_head01 tbody td.td_num{display:none;}
  .me-sub-wrap .tbl_head01 thead th,.me-sub-wrap .tbl_head01 tbody td{padding:12px 8px;font-size:14px;}
  .me-sub-wrap #ctt_con{font-size:16px;}
  /* [TaskB 모바일] 글뷰 상단 버튼바: 우측 군집 → 전체폭 균등 분배(한 손 조작·터치 간격 개선) */
  .me-sub-wrap #bo_v_top{justify-content:stretch;width:100%;}
  .me-sub-wrap #bo_v_top .btn_bo_user{flex:1 1 auto;justify-content:stretch;}
  /* li 가 flex item 이므로 li 를 늘리고 그 안의 .btn 을 100% 폭으로 채워 풀폭 "목록" 버튼이 되게 함 */
  .me-sub-wrap #bo_v_top .btn_bo_user > li{flex:1 1 0;display:flex;}
  .me-sub-wrap #bo_v_top .btn_bo_user > li > .btn{flex:1 1 auto;width:100%;height:46px;}
  /* [TaskB 모바일] 목록/댓글 하단 버튼도 동일하게 전체폭 정렬 */
  .me-sub-wrap #bo_v_act .btn_bo_user,.me-sub-wrap #bo_v_act{justify-content:stretch;}
}

/* =========================================================
   로그인 페이지 (피드백 6) — 참고서버 .auth-* 패턴을 metaedu 톤으로 이식
   좌측 딥블루 그라데 비주얼 + 우측 로그인 카드, me-wrap(1440)
   ========================================================= */
.me-authpage{background:var(--c-bg-soft);}
.me-authsec{padding:56px 0;}
.me-auth-grid{
  display:grid;grid-template-columns:1.05fr .95fr;
  background:#fff;border:1px solid var(--c-line);border-radius:24px;overflow:hidden;
  box-shadow:0 30px 70px rgba(8,24,55,.12);min-height:540px;
}
.me-auth-visual{position:relative;overflow:hidden;background:linear-gradient(140deg,var(--c-primary) 0%,var(--point-deep) 80%);color:#fff;display:flex;align-items:center;}
.me-auth-visual-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.me-auth-visual .me-orb1{width:360px;height:360px;background:radial-gradient(circle,var(--c-orb-blue),transparent 70%);top:-120px;right:-100px;}
.me-auth-visual .me-orb2{width:320px;height:320px;background:radial-gradient(circle,var(--c-mint),transparent 70%);bottom:-130px;left:-110px;opacity:.45;}
.me-auth-visual .me-grid-deco{-webkit-mask-image:radial-gradient(ellipse 90% 80% at 40% 40%,#000,transparent 78%);mask-image:radial-gradient(ellipse 90% 80% at 40% 40%,#000,transparent 78%);}
.me-auth-visual-inner{position:relative;padding:64px 56px;}
.me-auth-visual h2{font-size:34px;font-weight:800;line-height:1.3;letter-spacing:-.02em;margin:18px 0 18px;}
.me-auth-visual p{font-size:16px;line-height:1.8;color:rgba(255,255,255,.82);margin:0;word-break:keep-all;max-width:440px;}
.me-auth-visual p strong{color:#fff;}
.me-auth-card{padding:60px 52px;display:flex;flex-direction:column;justify-content:center;}
.me-auth-card h1{font-size:30px;font-weight:800;color:var(--c-navy);margin:0 0 8px;letter-spacing:-.02em;}
.me-auth-desc{font-size:15px;color:var(--c-text-sub);margin:0 0 28px;}
.me-auth-form{display:flex;flex-direction:column;gap:16px;}
.me-auth-form label{display:flex;flex-direction:column;gap:8px;font-size:14.5px;font-weight:700;color:var(--c-navy);}
.me-auth-form input[type=text],.me-auth-form input[type=password]{
  width:100%;font-size:16px;color:var(--c-text);padding:13px 15px;
  border:1.5px solid var(--c-line);border-radius:11px;background:#fff;transition:border-color .15s,box-shadow .15s;
}
.me-auth-form input[type=text]:focus,.me-auth-form input[type=password]:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(31,122,119,.4);}
.me-auth-check{flex-direction:row !important;align-items:center;gap:10px;font-size:14px;font-weight:500 !important;color:var(--c-text-sub) !important;cursor:pointer;}
.me-auth-check input{width:20px;height:20px;flex:0 0 20px;accent-color:var(--c-primary);}
.me-auth-submit{width:100%;justify-content:center;height:52px;margin-top:4px;}
.me-auth-links{display:flex;justify-content:center;gap:22px;margin-top:22px;padding-top:20px;border-top:1px solid var(--c-line);}
.me-auth-links a{font-size:14px;font-weight:700;color:var(--c-navy);text-decoration:none;}
.me-auth-links a:hover{color:var(--c-primary);}
@media (max-width:860px){
  .me-authsec{padding:32px 0;}
  .me-auth-grid{grid-template-columns:1fr;min-height:0;}
  .me-auth-visual-inner{padding:44px 32px;}
  .me-auth-visual h2{font-size:26px;}
  .me-auth-card{padding:40px 28px;}
}

/* 2026-06-15 design QA hardening */
.me-gnb-sub{max-width:min(320px,calc(100vw - 32px));}
.me-gnb-sub a{white-space:normal;overflow-wrap:anywhere;}

@media (max-width:1200px) and (min-width:1081px){
  /* 1081~1200: 폭 빠듯 — GNB 축소로 overflow 방지. 계정 아이콘(.me-acct-wrap)은 컴팩트하므로 유지. */
  .me-hd-inner{gap:12px;}
  .me-gnb{min-width:0;}
  .me-gnb-ul{gap:8px;}
  .me-gnb-a{padding-left:12px;padding-right:12px;font-size:15px;}
  .me-cta-head{padding:0 11px;font-size:13px;}
}
@media (max-width:960px){
  .me-solpoint-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:768px){
  .me-wrap{padding-left:20px;padding-right:20px;}
  .me-hero{overflow:hidden;}
  .me-hero-inner{gap:30px;}
  .me-hero-cta{width:100%;max-width:330px;margin-left:auto;margin-right:auto;flex-direction:column;align-items:stretch;}
  .me-hero-cta .me-btn{width:100%;max-width:none;}
  .me-solpoint-grid{grid-template-columns:1fr;}
  .me-sub-wrap .tbl_head01 thead th:nth-child(3),
  .me-sub-wrap .tbl_head01 thead th:nth-child(4){display:table-cell;}
  .me-sub-wrap .tbl_head01 thead th.th_name,
  .me-sub-wrap .tbl_head01 thead th.th_hit,
  .me-sub-wrap .tbl_head01 thead th.th_good,
  .me-sub-wrap .tbl_head01 thead th.th_nogood{display:none;}
  .me-sub-wrap #ctt_con table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap;}
  .me-sub-wrap .tbl_head01 table,.me-sub-wrap .tbl_head01 tbody,.me-sub-wrap .tbl_head01 tr,.me-sub-wrap .tbl_head01 td{display:block;width:100% !important;}
  .me-sub-wrap .tbl_head01 thead{display:none;}
  .me-sub-wrap .tbl_head01 tbody tr{padding:16px 0;border-bottom:1px solid var(--c-line);}
  .me-sub-wrap .tbl_head01 tbody td{padding:3px 0;border-bottom:0;text-align:left;}
  .me-sub-wrap .tbl_head01 tbody td.td_num2,
  .me-sub-wrap .tbl_head01 tbody td.td_name,
  .me-sub-wrap .tbl_head01 tbody td.td_num{display:none;}
  .me-sub-wrap .tbl_head01 tbody td.td_subject{font-size:16px;line-height:1.5;}
  .me-sub-wrap .tbl_head01 tbody td.td_datetime{font-size:13.5px;color:var(--c-text-sub);}
  .me-sub-wrap #bo_gall #gall_ul.gall_row{grid-template-columns:1fr !important;gap:18px;max-width:300px;margin-left:auto !important;margin-right:auto !important;}
  .me-sub-wrap #bo_gall .gall_img{height:180px !important;max-height:180px !important;}
}
@media (max-width:480px){
  .me-wrap{padding-left:18px;padding-right:18px;}
  .me-hero-title,.me-hero-sub{max-width:300px;}.me-hero-cta{max-width:280px;}
}
@media (max-width:600px){
  .me-hero-title,.me-hero-sub{max-width:300px;}.me-hero-cta{max-width:280px;}
  .me-shortcut-list{grid-template-columns:repeat(2,minmax(0,1fr));max-width:300px;margin-left:auto;margin-right:auto;}
  .me-consult-wrap{width:100%;max-width:720px;}
}

/* round6: mobile content/card width safety net */
@media (max-width:600px){
  .me-sub-wrap{overflow-x:hidden;}
  .me-sub-wrap .me-wrap,
  .me-sub-wrap #ctt,
  .me-sub-wrap #ctt_con{width:100%;max-width:100%;box-sizing:border-box;}
  .me-sub-wrap #ctt [style*="max-width"]{max-width:300px !important;margin-left:auto !important;margin-right:auto !important;}
  .me-sub-wrap #ctt_con h2,
  .me-sub-wrap #ctt_con h3,
  .me-sub-wrap #ctt_con h4,
  .me-sub-wrap #ctt_con p,
  .me-sub-wrap #ctt_con li{word-break:normal;overflow-wrap:anywhere;}
  .me-sub-wrap #ctt_con .me-btn,
  .me-sub-wrap #ctt_con a[class*="btn"]{max-width:100%;white-space:normal;text-align:center;justify-content:center;}

  .me-sub-wrap .tbl_head01{max-width:300px;margin-left:auto;margin-right:auto;}
  .me-sub-wrap .tbl_head01 tbody tr{background:#fff;border:1px solid var(--c-line);border-radius:12px;padding:16px 18px;margin:0 0 14px;box-shadow:0 4px 14px rgba(24,98,95,.06);} /* [수정8] 모바일 행 그림자 톤다운 */
  .me-sub-wrap .tbl_head01 tbody td.td_subject{font-size:16px;line-height:1.55;word-break:normal;overflow-wrap:anywhere;}
  .me-sub-wrap .tbl_head01 tbody td.td_datetime{text-align:left;padding-top:8px;}

  .me-sub-wrap #bo_gall #gall_ul.gall_row{width:100%;max-width:300px;}
  .me-sub-wrap #bo_gall .gall_box{border-radius:14px;}

  .me-authpage .me-wrap{max-width:320px;padding-left:20px;padding-right:20px;}
  .me-authsec{padding:24px 0;}
  .me-auth-grid{border-radius:18px;}
  .me-auth-visual{display:none;}
  .me-auth-card{padding:30px 24px;}
  .me-auth-card h1{font-size:26px;}.me-auth-form input[type=text],
.me-auth-form input[type=password],
.me-auth-submit{width:100%;max-width:100%;}
}

/* round8: reference-led subpage, board, and search refinement */
#me-hd,.me-main,.me-sub-wrap,#me-ft{letter-spacing:0;}
.me-head-search{
  min-width:44px;min-height:44px;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;
  border:1px solid rgba(31,122,119,.18);border-radius:999px;background:#fff;color:var(--c-navy);
  text-decoration:none;transition:background .16s,border-color .16s,color .16s,box-shadow .16s,transform .16s;
}
.me-head-search:hover,.me-head-search:focus{
  color:var(--c-primary);border-color:rgba(31,122,119,.42);background:var(--c-bg-soft);
  box-shadow:0 8px 20px rgba(24,98,95,.08);transform:translateY(-1px);
}
.me-hd-util{gap:10px;}
.me-hd-cta{gap:7px;}

/* [개편] 계정 아이콘 + 드롭다운 — 검색 아이콘과 톤 일치(40px 라운드·primary 보더), 메뉴는 우측정렬. */
.me-acct-wrap{position:relative;display:inline-flex;flex:0 0 auto;}
.me-acct-toggle{
  min-width:44px;min-height:44px;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;
  border:1px solid rgba(31,122,119,.18);border-radius:999px;background:#fff;color:var(--c-navy);
  cursor:pointer;padding:0;
  transition:background .16s,border-color .16s,color .16s,box-shadow .16s,transform .16s;
}
.me-acct-toggle:hover,.me-acct-toggle:focus-visible,.me-acct-toggle.is-active{
  color:var(--c-primary);border-color:rgba(31,122,119,.42);background:var(--c-bg-soft);
  box-shadow:0 8px 20px rgba(24,98,95,.08);
}
.me-acct-toggle:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;}
.me-acct-menu{
  position:absolute;top:calc(100% + 10px);right:0;min-width:200px;
  background:#fff;border:1px solid var(--c-line);border-radius:12px;
  box-shadow:var(--shadow-card);padding:7px;z-index:1200;
}
.me-acct-menu[hidden]{display:none;}
.me-acct-head{display:flex;flex-direction:column;gap:2px;padding:8px 12px 6px;}
.me-acct-name{font-size:14.5px;font-weight:800;color:var(--c-navy);line-height:1.3;word-break:break-all;}
.me-acct-id{font-size:12px;font-weight:500;color:var(--c-text-sub);line-height:1.3;word-break:break-all;}
.me-acct-sep{height:1px;background:var(--c-line);margin:6px 4px;}
.me-acct-menu a{
  display:block;padding:9px 12px;border-radius:8px;
  font-size:14px;font-weight:600;color:var(--c-text);text-decoration:none;white-space:nowrap;
  transition:background .14s,color .14s;
}
.me-acct-menu a:hover,.me-acct-menu a:focus-visible{background:var(--c-bg-soft);color:var(--c-primary);}
.me-acct-menu a:focus-visible{outline:2px solid var(--c-primary);outline-offset:-2px;}
.me-acct-menu a.me-acct-primary{color:var(--c-primary);font-weight:700;}
.me-acct-menu a.me-acct-danger{color:#c0392b;}
.me-acct-menu a.me-acct-danger:hover,.me-acct-menu a.me-acct-danger:focus-visible{background:#fdecea;color:#c0392b;}
/* ≤1080(헤더 모바일 전환): 계정 아이콘도 숨김 — 모바일은 햄버거 메뉴 기존 유지(회귀0).
   .me-acct-wrap 기본정의가 위 ≤1080 블록(.me-auth 등 숨김)보다 소스상 뒤라 미디어쿼리 우선순위가
   동일specificity·소스순서로 역전되므로, 기본정의 직후 같은 브레이크포인트로 다시 숨김 처리. */
@media (max-width:1080px){
  .me-acct-wrap{display:none;}
}
.me-cta-head{
  min-height:38px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:700;
  box-shadow:none;max-width:148px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.me-cta-head svg{flex:0 0 14px;}
/* 앞에서 읽기 좋은 민트(--c-mint-text)로 잡아 둔 글자색을 여기서 원색으로
   되돌리고 있었다. 흰 바탕에 원색 민트는 2.5:1 밖에 안 나온다. */
.me-cta-mint{background:#fff;color:var(--c-mint-text);border:1px solid rgba(60,186,181,.42);}
.me-cta-mint:hover{background:rgba(60,186,181,.08);color:var(--point-ink);border-color:var(--c-mint);}
.me-cta-primary{max-width:156px;background:var(--c-primary);}

.me-sub-wrap{
  background:linear-gradient(180deg,var(--point-50) 0,#fff 340px);
  padding-top:42px;
}
/* [폭 통일] 서브 본문 폭을 메인 섹션과 동일하게 — 1180/1120/980 컨테이너 캡 해제. */
.me-sub-wrap .me-wrap{max-width:none;}
.me-sub-wrap #ctt{
  max-width:none;margin:0 auto;background:#fff;border:1px solid rgba(31,122,119,.10);
  border-radius:18px;box-shadow:0 18px 44px rgba(24,98,95,.07);padding:38px 42px;
}
.me-sub-wrap #ctt_con{max-width:none;margin:0 auto;font-size:17px;line-height:1.88;}
.me-sub-wrap #ctt_con h2{
  font-size:30px;line-height:1.28;margin:44px 0 18px;color:var(--c-navy);
  padding-bottom:14px;border-bottom:1px solid rgba(31,122,119,.14);
}
.me-sub-wrap #ctt_con h2:first-child{margin-top:0;}
.me-sub-wrap #ctt_con h3{font-size:21px;color:var(--c-primary-deep);margin-top:34px;}
.me-sub-wrap #ctt_con p{color:#26364d;}
.me-sub-wrap #ctt_con table{border-radius:12px;overflow:hidden;border:1px solid var(--c-line);}
.me-sub-wrap #ctt_con th{background:var(--point-50);color:var(--c-navy);}

.me-sub-wrap #bo_list,.me-sub-wrap #bo_gall,.me-sub-wrap #bo_v,.me-sub-wrap #bo_w{
  max-width:none;margin-left:auto;margin-right:auto;border-radius:18px;
  box-shadow:0 18px 44px rgba(24,98,95,.07);
}
.me-sub-wrap #bo_btn_top{
  margin-bottom:18px;padding:16px 18px;border:1px solid rgba(31,122,119,.10);
  border-radius:14px;background:var(--point-50);
}
.me-sub-wrap #bo_list_total{font-size:15px;}
.me-sub-wrap .btn_bo_user .btn,.me-sub-wrap .btn_bo_user button.btn{
  width:42px;height:42px;border-radius:999px;background:#fff;color:var(--c-primary);
  border:1px solid rgba(31,122,119,.20);
}
.me-sub-wrap .btn_bo_user .btn_b01,.me-sub-wrap .btn_bo_user a.btn_b01{
  background:#fff;color:var(--c-primary);border-color:rgba(31,122,119,.22);
}
.me-sub-wrap .btn_bo_user .btn:hover,.me-sub-wrap .btn_bo_user .btn_b01:hover{
  background:var(--c-primary);border-color:var(--c-primary);color:#fff;
}
.me-sub-wrap .tbl_head01{overflow:hidden;border:1px solid rgba(31,122,119,.12);border-radius:14px;background:#fff;}
.me-sub-wrap .tbl_head01 thead th{
  background:var(--point-50);color:var(--c-navy);font-size:14px;font-weight:800;border-bottom:1px solid rgba(31,122,119,.16);
}
.me-sub-wrap .tbl_head01 thead th a{color:var(--c-navy);}
.me-sub-wrap .tbl_head01 tbody td{padding-top:18px;padding-bottom:18px;border-bottom:1px solid #edf1f8;}
.me-sub-wrap .tbl_head01 tbody tr:last-child td{border-bottom:0;}
.me-sub-wrap .bo_tit a{font-size:16.5px;font-weight:700;}
.me-sub-wrap .td_datetime{font-variant-numeric:tabular-nums;}
.me-sub-wrap .notice_icon{background:var(--c-primary);border-radius:999px;}

.me-sub-wrap #bo_w{padding:34px 38px;}   /* 폭은 아래 '[폭 통일]' 규칙이 정한다 */
.me-sub-wrap #bo_w #fwrite{width:100% !important;}
.me-sub-wrap #bo_w .write_div{margin-bottom:18px;}
.me-sub-wrap #bo_w .frm_input,.me-sub-wrap #bo_w input[type=text],.me-sub-wrap #bo_w input[type=password],.me-sub-wrap #bo_w textarea,.me-sub-wrap #bo_w select{
  min-height:48px;border-radius:12px;border:1px solid var(--point-300);background:#fff;font-size:15.5px;
}
.me-sub-wrap #bo_w textarea{min-height:220px;padding:14px 16px;}
.me-sub-wrap #bo_w .file_wr{border-color:var(--point-300);border-radius:12px;background:var(--point-50);height:auto;min-height:48px;}
.me-sub-wrap #bo_w .btn_confirm{padding-top:4px;border-top:1px solid #edf1f8;}

.me-sub-wrap #sch_res_detail{
  max-width:960px;margin:0 auto 24px;padding:24px;border:1px solid rgba(31,122,119,.12);
  border-radius:18px;background:#fff;box-shadow:0 16px 40px rgba(24,98,95,.07);text-align:left;
}
.me-sub-wrap #sch_res_detail select,.me-sub-wrap #sch_res_detail .frm_input{
  height:48px;border:1px solid var(--point-300);border-radius:12px;font-size:15px;
}
.me-sub-wrap #sch_res_detail .frm_input{width:min(420px,42vw);padding:0 14px;}
.me-sub-wrap #sch_res_detail .btn_submit{
  height:48px;border-radius:12px;background:var(--c-primary);border:0;color:#fff;font-weight:800;
}
.me-sub-wrap #sch_result{max-width:960px;margin:0 auto;}
.me-sub-wrap #sch_res_ov{
  height:auto;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 20px;border-radius:14px;background:var(--point-50);border:1px solid rgba(31,122,119,.12);line-height:1.4;
}
.me-sub-wrap #sch_res_ov h2{float:none;margin:0;font-size:18px;font-weight:800;color:var(--c-navy);}
.me-sub-wrap #sch_res_ov ul{float:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;line-height:1;}
.me-sub-wrap #sch_res_ov li{float:none;margin:0;padding:6px 10px;border:0;border-radius:999px;background:#fff;color:var(--c-primary);font-size:13px;font-weight:700;}
.me-sub-wrap #sch_res_board{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px;padding:0;list-style:none;}
.me-sub-wrap #sch_res_board li{padding:0;}
.me-sub-wrap #sch_res_board a{border-radius:999px;border-color:rgba(31,122,119,.18);color:var(--c-primary-deep);background:#fff;font-weight:700;}
.me-sub-wrap #sch_res_board .sch_on,.me-sub-wrap #sch_res_board a:hover{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}
.me-sub-wrap .sch_res_list{margin:0 0 26px;}
.me-sub-wrap .sch_res_list .search_board_result,.me-sub-wrap .me-sch-content{
  border:1px solid rgba(31,122,119,.12);border-radius:16px;background:#fff;
  box-shadow:0 12px 32px rgba(24,98,95,.06);padding:24px 26px;
}
.me-sub-wrap .sch_res_list h2{font-size:19px;color:var(--c-navy);font-weight:800;margin:0 0 14px;}
.me-sub-wrap .sch_res_list ul{border-top:1px solid #edf1f8;margin-bottom:0;}
.me-sub-wrap .sch_res_list li{padding:18px 0;border-bottom:1px solid #edf1f8;}
.me-sub-wrap .sch_res_list li:last-child{border-bottom:0;}
.me-sub-wrap .sch_res_title{font-size:17px;font-weight:800;color:var(--c-navy);}
.me-sub-wrap .sch_res_list p{font-size:15.5px;line-height:1.75;color:#3a485d;}
.me-sub-wrap .sch_info{font-size:13.5px;color:var(--c-text-sub);}

@media (max-width:1200px) and (min-width:1081px){
  .me-head-search{width:38px;height:38px;flex-basis:38px;}
  .me-cta-head{max-width:116px;padding:0 10px;}
  .me-cta-primary{max-width:124px;}
}
@media (max-width:1080px){
  .me-head-search{display:inline-flex;}
}
@media (max-width:768px){
  .me-sub-wrap{padding-top:30px;}
  .me-sub-wrap #ctt,.me-sub-wrap #bo_list,.me-sub-wrap #bo_gall,.me-sub-wrap #bo_v,.me-sub-wrap #bo_w{
    border-radius:16px;padding:24px 20px;
  }
  .me-sub-wrap #ctt_con{font-size:16px;line-height:1.8;}
  .me-sub-wrap #ctt_con h2{font-size:24px;}
  .me-sub-wrap #bo_btn_top{align-items:stretch;}
  .me-sub-wrap .btn_bo_user{justify-content:flex-end;}
  .me-sub-wrap .tbl_head01{max-width:100%;border:0;background:transparent;overflow:visible;}
  .me-sub-wrap .tbl_head01 tbody tr{max-width:100%;padding:18px 18px;border-radius:14px;}
  .me-sub-wrap #sch_res_detail{padding:20px;}
  .me-sub-wrap #sch_res_detail select,.me-sub-wrap #sch_res_detail .sch_wr,.me-sub-wrap #sch_res_detail .frm_input,.me-sub-wrap #sch_res_detail .btn_submit{
    width:100%;display:block;margin:0 0 8px;
  }
  .me-sub-wrap #sch_res_ov{display:block;}
  .me-sub-wrap #sch_res_ov ul{margin-top:12px;}
}
@media (max-width:600px){
  .me-sub-wrap #ctt [style*="max-width"]{max-width:100% !important;}
  .me-sub-wrap .tbl_head01{max-width:100%;}
  .me-sub-wrap #bo_gall #gall_ul.gall_row{max-width:100%;}
}

/* round9: unify page width/background and harden member/search/board skins */
body{background:#fff;}
.me-wrap.me-sub-wrap{
  background:#fff !important;
  padding-top:44px;
  padding-bottom:88px;
}
.me-sub-wrap{
  background:#fff !important;
}
.me-subhead + .me-wrap.me-sub-wrap{
  margin-top:0;
}

.me-sub-wrap #ctt{
  width:100%;
  max-width:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.me-sub-wrap #ctt_con{
  max-width:1400px;
  margin:0 auto;
  font-size:17px;
  line-height:1.86;
}
.me-sub-wrap .me-content-visual{
  width:100%;
  max-width:1400px;
  height:300px;
  margin:0 auto 34px;
  border-radius:16px;
  overflow:hidden;
  background:var(--point-100);
}
.me-sub-wrap .me-content-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.me-sub-wrap .ctt_device .me-content-visual,
.me-sub-wrap .ctt_contents .me-content-visual,
.me-sub-wrap .ctt_monitoring .me-content-visual,
.me-sub-wrap .ctt_purchase .me-content-visual{
  height:260px;
}
/* [수정6] 제품 3종(콘텐츠/모니터링 등)은 페이지 첫 요소가 와이드 이미지(.me-content-visual)라
   서브탭바(.me-subnav-wrap, padTop 86 유지)에 비해 시각적으로 너무 붙어 보인다 →
   선두 이미지일 때만 상단 여백을 추가(이미 본문 중간 이미지는 영향 없음). */
.me-sub-wrap [class*="ctt_"] > .me-content-visual:first-of-type{
  margin-top:18px;
}
.me-sub-wrap #ctt_con h2{
  border-bottom:2px solid var(--point-150);
  padding-bottom:16px;
}

.me-sub-wrap #bo_list,
.me-sub-wrap #bo_gall,
.me-sub-wrap #bo_v{
  width:100% !important;
  max-width:100%;
  background:transparent;
  border:0;
  box-shadow:none;
}
.me-sub-wrap #bo_w{
  max-width:none; /* [폭 통일] 글쓰기 폼도 본문 폭 채움 */
  border:1px solid var(--point-200);
  box-shadow:none;
}
.me-sub-wrap #bo_btn_top{
  background:#fff;
  border-color:var(--point-200);
  box-shadow:none;
}
.me-sub-wrap .btn_bo_user .btn_bo_sch{
  background:var(--c-primary) !important;
  border-color:var(--c-primary) !important;
  color:#fff !important;
}
.me-sub-wrap .btn_bo_user .btn_bo_sch:hover{
  background:var(--c-primary-deep) !important;
  border-color:var(--c-primary-deep) !important;
}
.me-sub-wrap .tbl_head01{
  border-color:var(--point-200);
  box-shadow:none;
}
.me-sub-wrap .tbl_head01 thead th{
  background:var(--point-50);
}
.me-sub-wrap .tbl_head01 tbody tr:hover td{
  background:var(--point-50);
}
.me-sub-wrap .bo_sch_wrap:not([hidden]){
  background:rgba(24,98,95,.16);
}
.me-sub-wrap .bo_sch{
  top:50% !important;
  left:50% !important;
  margin:0 !important;
  transform:translate(-50%,-50%) !important;
  width:min(360px,calc(100vw - 32px));
  max-height:none;
  overflow:visible;
  padding:20px;
  border-radius:12px;
  border:1px solid var(--point-200);
  box-shadow:0 24px 60px rgba(24,98,95,.18);
}
.me-sub-wrap .bo_sch h3{
  padding:0 28px 14px 0;
  margin:0 0 10px;
  border-bottom:1px solid #e8edf5;
  font-size:16px;
  line-height:1.35;
  color:var(--c-navy);
}
.me-sub-wrap .bo_sch form{
  padding:0;
}
.me-sub-wrap .bo_sch select{
  height:42px;
  border:1px solid #d8e1ee;
  border-radius:5px;
  box-shadow:none;
  font-size:15px;
}
.me-sub-wrap .bo_sch .sch_bar{
  display:flex;
  align-items:center;
  height:42px;
  margin-top:8px;
  border-radius:5px;
  border-color:#d8e1ee;
  box-shadow:none;
}
.me-sub-wrap .bo_sch .sch_input{
  width:auto;
  flex:1 1 auto;
  height:40px;
  padding:0 12px;
  font-size:15px;
}
.me-sub-wrap .bo_sch .sch_btn{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:0 5px 5px 0;
  background:var(--point-ink);
  color:#fff;
  padding:0;
}
.me-sub-wrap .bo_sch .bo_sch_cls{
  top:14px;
  right:14px;
  padding:4px;
  background:transparent;
  color:#6d7788;
  font-size:16px;
}

.me-sub-wrap #sch_res_detail{
  width:100%;
  max-width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 28px;
  padding:18px;
  border-radius:14px;
  background:#fff;
  border-color:var(--point-200);
  box-shadow:none;
}
.me-sub-wrap #sch_res_detail select{
  flex:0 0 178px;
}
.me-sub-wrap #sch_res_detail .sch_wr{
  flex:1 1 420px;
  min-width:280px;
  display:flex;
  align-items:center;
}
.me-sub-wrap #sch_res_detail .frm_input{
  width:100%;
  flex:1 1 auto;
  border-radius:12px 0 0 12px;
}
.me-sub-wrap #sch_res_detail .btn_submit{
  width:92px;
  flex:0 0 92px;
  border-radius:0 12px 12px 0;
}
.me-sub-wrap #sch_result{
  max-width:100%;
}
.me-sub-wrap #sch_res_ov,
.me-sub-wrap .sch_res_list .search_board_result,
.me-sub-wrap .me-sch-content{
  box-shadow:none;
  border-color:var(--point-200);
}
.me-sub-wrap #sch_result > hr{
  display:none;
}
.me-sub-wrap .me-search-empty{
  max-width:100%;
  margin:0;
  padding:34px 28px;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:#fff;
  color:#40516a;
}
.me-sub-wrap .me-search-empty h2{
  margin:0 0 8px;
  color:var(--c-navy);
  font-size:22px;
  font-weight:850;
}
.me-sub-wrap .me-search-empty p{
  margin:0 0 16px;
  color:#5a6b85;
  font-size:15.5px;
  line-height:1.7;
}
.me-sub-wrap .me-search-empty ul{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}
.me-sub-wrap .me-search-empty li{
  padding:8px 12px;
  border:1px solid rgba(31,122,119,.16);
  border-radius:999px;
  background:var(--point-50);
  color:var(--c-primary-deep);
  font-size:14px;
  font-weight:750;
}

.me-sub-wrap .register{
  max-width:1200px;
  margin:0 auto;
  font-family:var(--font);
}
.me-sub-wrap #fregister,
.me-sub-wrap #fregisterform{
  background:#fff;
}
.me-sub-wrap #fregister p{
  height:auto;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 18px;
  line-height:1.45;
  background:var(--point-50);
  border:1px solid var(--point-200);
  border-radius:14px;
  color:var(--c-navy);
}
.me-sub-wrap #fregister p:before{display:none;}
.me-sub-wrap #fregister section,
.me-sub-wrap .register_form_inner{
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
  overflow:hidden;
  box-shadow:none;
}
.me-sub-wrap #fregister h2,
.me-sub-wrap #register_form h2{
  padding:18px 22px;
  margin:0;
  border-bottom:1px solid var(--point-150);
  color:var(--c-navy);
  font-size:18px;
  font-weight:800;
}
.me-sub-wrap #fregister textarea{
  height:190px;
  background:var(--point-50);
  color:#2b374a;
  border:0;
}
.me-sub-wrap #fregister_chkall{
  position:relative;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1.4;
  border-radius:14px;
  background:#fff;
  border-color:var(--point-200);
}
.me-sub-wrap .register .btn_confirm{
  display:flex;
  gap:10px;
  justify-content:center;
  text-align:center;
}
.me-sub-wrap .register .btn_confirm .btn_submit,
.me-sub-wrap .register .btn_confirm .btn_close,
.me-sub-wrap #fregisterform #btn_submit{
  float:none;
  width:auto;
  min-width:160px;
  height:50px !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  font-weight:800;
  text-decoration:none;
}
.me-sub-wrap .register .btn_confirm .btn_submit,
.me-sub-wrap #fregisterform #btn_submit{
  background:var(--c-primary);
  border:1px solid var(--c-primary);
  color:#fff;
}
.me-sub-wrap .register .btn_confirm .btn_close{
  background:#fff;
  border:1px solid #cfd9ea;
  color:var(--c-navy);
}
.me-sub-wrap .register_form_inner ul{
  padding:22px;
}
.me-sub-wrap .register_form_inner li{
  margin-bottom:16px;
}
.me-sub-wrap .register_form_inner label{
  color:var(--c-navy);
  font-weight:700;
}
.me-sub-wrap .register_form_inner .frm_input,
.me-sub-wrap .register_form_inner input[type=text],
.me-sub-wrap .register_form_inner input[type=password],
.me-sub-wrap .register_form_inner input[type=email],
.me-sub-wrap .register_form_inner select{
  min-height:48px;
  border:1px solid var(--point-300);
  border-radius:12px;
  padding:0 14px;
  background:#fff;
  font-size:15.5px;
}
.me-sub-wrap .register_form_inner .frm_input:focus{
  outline:none;
  border-color:var(--c-primary);
  box-shadow:0 0 0 3px rgba(31,122,119,.14);
}

@media (max-width:768px){
  :root{--maxw:100%;}
  /* [모바일 여백 축소] 본문 하단 패딩 58→36px (푸터 간소화와 합쳐 전체 스크롤 길이 체감 감소). */
  .me-wrap.me-sub-wrap{padding-top:30px;padding-bottom:36px;}
  .me-sub-wrap #ctt_con{max-width:100%;}
  .me-sub-wrap .me-content-visual{
    height:210px;
    margin-bottom:28px;
    border-radius:14px;
  }
  .me-sub-wrap #sch_res_detail{
    display:block;
    padding:18px;
  }
  .me-sub-wrap #sch_res_detail select,
  .me-sub-wrap #sch_res_detail .sch_wr{
    width:100%;
    margin:0 0 10px;
  }
  .me-sub-wrap .register .btn_confirm{
    flex-direction:column;
  }
  .me-sub-wrap .register .btn_confirm .btn_submit,
  .me-sub-wrap .register .btn_confirm .btn_close,
  .me-sub-wrap #fregisterform #btn_submit{
    width:100%;
    box-sizing:border-box;
    margin-left:0;
    margin-right:0;
  }
}

/* round10: modern B2B edtech content modules */
.me-sub-wrap #ctt_con > .me-page{
  width:100%;
  max-width:1400px;
  margin:0 auto;
}
.me-page *{box-sizing:border-box;}
.me-page h2,
.me-page h3{
  border:0 !important;
  padding:0 !important;
}
.me-page p{margin:0;}
.me-page ul{margin:0;padding:0;list-style:none;}
.me-page-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:30px;
  padding:0 12px;
  margin:0 0 16px;
  border:1px solid rgba(31,122,119,.16);
  border-radius:999px;
  background:var(--point-50);
  color:var(--c-primary-deep);
  font-size:13px;
  font-weight:800;
  line-height:1;
}
.me-page-kicker:before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--c-mint);
  box-shadow:0 0 0 4px rgba(60,186,181,.14);
}
.me-page-title{
  max-width:900px;
  margin:0 0 18px !important;
  color:var(--c-navy) !important;
  font-size:42px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  letter-spacing:0 !important;
}
.me-page-lead{
  max-width:920px;
  color:#40516a !important;
  font-size:19px !important;
  line-height:1.75 !important;
}
.me-page-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:36px;
  align-items:end;
  margin:0 0 44px;
}
.me-page-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.me-page-summary li{
  min-height:116px;
  padding:22px;
  border:1px solid var(--point-200);
  border-radius:14px;
  background:#fff;
}
.me-page-summary b{
  display:block;
  margin:0 0 7px;
  color:var(--c-primary);
  font-size:22px;
  line-height:1.15;
}
.me-page-summary span{
  display:block;
  color:#52637a;
  font-size:14.5px;
  line-height:1.55;
}
.me-page-section{
  margin:58px 0 0;
}
.me-page-section:first-child{margin-top:0;}
.me-section-head{
  display:flex;
  justify-content:space-between;
  gap:28px;
  align-items:flex-end;
  margin:0 0 22px;
}
.me-section-head h2{
  margin:0 !important;
  color:var(--c-navy) !important;
  font-size:30px !important;
  line-height:1.25 !important;
}
.me-section-head p{
  max-width:560px;
  color:#5a6b85;
  font-size:16px;
  line-height:1.7;
}
.me-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.me-feature-card{
  min-height:190px;
  padding:26px;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.me-feature-card:hover{
  transform:translateY(-3px);
  border-color:rgba(31,122,119,.28);
  box-shadow:0 18px 42px rgba(24,98,95,.08);
}
.me-feature-card strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:42px;
  padding:0 12px;
  margin:0 0 18px;
  border-radius:12px;
  background:var(--point-100);
  color:var(--c-primary);
  font-size:15px;
  font-weight:850;
}
.me-feature-card h3{
  margin:0 0 10px !important;
  color:var(--c-navy) !important;
  font-size:20px !important;
  line-height:1.35 !important;
}
.me-feature-card p,
.me-feature-card li{
  color:#4f6077;
  font-size:15.5px;
  line-height:1.72;
}
.me-feature-card li{
  position:relative;
  padding-left:15px;
  margin-top:7px !important;
}
.me-feature-card li:before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--c-mint);
}
.me-photo-split{
  display:grid;
  grid-template-columns:minmax(0,1fr) 42%;
  gap:34px;
  align-items:center;
  padding:34px;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:linear-gradient(135deg,var(--point-50) 0,#fff 68%);
}
.me-photo-copy h2{
  margin:0 0 14px !important;
  color:var(--c-navy) !important;
  font-size:30px !important;
}
.me-photo-copy p{
  color:#40516a;
  font-size:17px;
  line-height:1.82;
}
.me-photo-media{
  min-height:320px;
  border-radius:16px;
  overflow:hidden;
  background:var(--point-100);
}
.me-photo-media img{
  width:100%;
  height:100%;
  min-height:320px;
  display:block;
  object-fit:cover;
  margin:0 !important;
  border-radius:0 !important;
}
.me-process{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  counter-reset:process;
}
.me-process li{
  position:relative;
  min-height:168px;
  padding:24px;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
  counter-increment:process;
}
.me-process li:before{
  content:"0" counter(process);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  margin-bottom:18px;
  border-radius:12px;
  background:var(--point-ink);
  color:#fff;
  font-size:13px;
  font-weight:850;
}
.me-process b{
  display:block;
  margin:0 0 8px;
  color:var(--c-navy);
  font-size:18px;
}
.me-process span{
  color:#52637a;
  font-size:15px;
  line-height:1.62;
}
.me-info-table{
  width:100%;
  overflow:hidden;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
}
.me-info-table table{
  margin:0 !important;
  border:0 !important;
  border-collapse:collapse;
  width:100%;
  font-size:15.5px !important;
}
.me-info-table th,
.me-info-table td{
  border:0 !important;
  border-bottom:1px solid #edf1f8 !important;
  padding:16px 18px !important;
  vertical-align:top;
}
.me-info-table tr:last-child th,
.me-info-table tr:last-child td{border-bottom:0 !important;}
.me-info-table th{
  width:210px;
  background:var(--point-50) !important;
  color:var(--c-navy) !important;
  font-weight:800;
}
.me-cta-panel{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin:60px 0 0;
  padding:30px 34px;
  border-radius:18px;
  background:linear-gradient(135deg,var(--c-primary),var(--c-navy));
  color:#fff;
}
.me-cta-panel h2{
  margin:0 0 8px !important;
  color:#fff !important;
  font-size:27px !important;
}
.me-cta-panel p{
  color:rgba(255,255,255,.82);
  font-size:16px;
  line-height:1.7;
}
.me-cta-actions{
  display:flex;
  gap:10px;
  flex:0 0 auto;
}
.me-cta-actions a{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  border-radius:12px;
  text-decoration:none !important;
  font-weight:850;
  white-space:nowrap;
}
.me-cta-actions a:first-child{
  background:#fff;
  color:var(--c-primary) !important;
}
.me-cta-actions a:last-child{
  border:1px solid rgba(255,255,255,.5);
  color:#fff !important;
}
.me-sub-wrap #bo_btn_top{
  min-height:68px;
  padding:14px 18px;
  border-radius:16px;
}
.me-sub-wrap #bo_list_total{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:0 13px;
  border:1px solid var(--point-200);
  border-radius:999px;
  background:#fff;
  color:#52637a;
}
.me-sub-wrap .tbl_head01{
  border-radius:16px;
  overflow:hidden;
}
.me-sub-wrap .tbl_head01 thead th{
  height:58px;
  color:var(--c-navy);
}
.me-sub-wrap .tbl_head01 tbody td{
  height:68px;
}
.me-sub-wrap .bo_tit a{
  line-height:1.45;
}
.me-sub-wrap #sch_res_detail{
  min-height:82px;
  align-items:center;
}

@media (max-width:1080px){
  .me-page-title{font-size:34px !important;}
  .me-page-intro{grid-template-columns:1fr;gap:22px;}
  .me-page-summary{grid-template-columns:repeat(3,1fr);}
  .me-feature-grid{grid-template-columns:repeat(2,1fr);}
  .me-process{grid-template-columns:repeat(2,1fr);}
  .me-photo-split{grid-template-columns:1fr;padding:24px;}
  .me-photo-media,.me-photo-media img{min-height:260px;}
  .me-cta-panel{align-items:flex-start;flex-direction:column;}
}
@media (max-width:768px){
  .me-page-title{font-size:29px !important;}
  .me-page-lead{font-size:16.5px !important;}
  .me-page-summary,
  .me-feature-grid,
  .me-process{grid-template-columns:1fr;}
  .me-section-head{display:block;}
  .me-section-head h2{font-size:24px !important;margin-bottom:8px !important;}
  .me-feature-card{min-height:0;padding:22px;}
  .me-photo-split{gap:20px;padding:20px;border-radius:16px;}
  .me-photo-copy h2{font-size:24px !important;}
  .me-photo-copy p{font-size:16px;}
  .me-info-table{overflow:visible;border:0;background:transparent;}
  .me-info-table table,
  .me-info-table tbody,
  .me-info-table tr,
  .me-info-table th,
  .me-info-table td{
    display:block;
    width:100% !important;
    min-width:0 !important;
  }
  .me-info-table tr{
    margin:0 0 12px;
    overflow:hidden;
    border:1px solid var(--point-200);
    border-radius:14px;
    background:#fff;
  }
  .me-info-table th{
    border-bottom:1px solid #edf1f8 !important;
    padding:14px 16px !important;
  }
  .me-info-table td{
    padding:13px 16px !important;
    border-bottom:1px solid #f0f3f8 !important;
  }
  .me-info-table td:last-child{border-bottom:0 !important;}
  .me-cta-panel{padding:24px 20px;border-radius:16px;}
  .me-cta-actions{width:100%;flex-direction:column;}
  .me-cta-actions a{width:100%;}
}

/* round13: final responsive content alignment and card preservation */
@media (min-width:769px){
  .me-wrap.me-sub-wrap{
    max-width:var(--maxw) !important;
  }
  .me-sub-wrap #ctt_con,
  .me-sub-wrap #ctt_con > .me-page,
  .me-sub-wrap .me-content-visual,
  .me-sub-wrap #bo_list,
  .me-sub-wrap #bo_gall,
  .me-sub-wrap #bo_v,
  .me-sub-wrap #sch_res_detail,
  .me-sub-wrap #sch_result,
  .me-sub-wrap .register{
    width:100%;
    max-width:1400px !important;
  }
}

.me-sub-wrap #ctt_con,
.me-sub-wrap #ctt_con .me-page,
.me-sub-wrap #ctt_con .me-page-title,
.me-sub-wrap #ctt_con .me-page-lead,
.me-sub-wrap #ctt_con .me-section-head,
.me-sub-wrap #ctt_con .me-feature-card,
.me-sub-wrap #ctt_con .me-page-summary,
.me-sub-wrap #ctt_con .me-photo-copy,
.me-sub-wrap #ctt_con .me-cta-panel{
  word-break:keep-all;
  overflow-wrap:break-word;
}

.me-sub-wrap #ctt_con .me-page-title{
  max-width:960px;
  font-size:38px !important;
  line-height:1.28 !important;
  text-wrap:balance;
}
.me-sub-wrap #ctt_con .me-page-lead{
  max-width:920px;
  font-size:17.5px !important;
  line-height:1.78 !important;
}
.me-sub-wrap #ctt_con .me-page-intro{
  grid-template-columns:minmax(0,1fr) minmax(300px,340px) !important;
  gap:42px;
  align-items:center;
}
.me-sub-wrap #ctt_con .me-page-summary{
  grid-template-columns:1fr !important;
  gap:10px;
}
.me-sub-wrap #ctt_con .me-page-summary li{
  min-height:0;
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:17px 20px;
}
.me-sub-wrap #ctt_con .me-page-summary b{
  margin:0;
  font-size:23px;
}
.me-sub-wrap #ctt_con .me-page-summary span{
  font-size:14px;
  line-height:1.5;
}
.me-sub-wrap #ctt_con .me-feature-grid{
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) !important;
  gap:18px;
}
.me-sub-wrap #ctt_con .me-feature-card{
  display:block !important;
  min-width:0;
  min-height:0;
  padding:25px 26px;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:#fff;
}
.me-sub-wrap #ctt_con .me-feature-card strong{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:42px;
  max-width:100%;
  height:auto;
  min-height:42px;
  margin:0 0 16px !important;
  padding:0 12px;
  text-indent:0;
  white-space:normal;
}
.me-sub-wrap #ctt_con .me-feature-card h3{
  margin:0 0 10px !important;
  font-size:20px !important;
  line-height:1.35 !important;
}
.me-sub-wrap #ctt_con .me-feature-card ul{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
.me-sub-wrap #ctt_con .me-feature-card li{
  margin:7px 0 0 !important;
  padding-left:15px !important;
  line-height:1.68;
}

@media (max-width:1080px){
  .me-sub-wrap #ctt_con .me-page-title{
    max-width:100%;
    font-size:32px !important;
  }
  .me-sub-wrap #ctt_con .me-page-intro{
    grid-template-columns:1fr !important;
    gap:24px;
  }
  .me-sub-wrap #ctt_con .me-page-summary{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .me-sub-wrap #ctt_con .me-page-summary li{
    grid-template-columns:1fr;
  }
}

@media (max-width:768px){
  .me-sub-wrap #ctt_con .me-page-title{
    font-size:27px !important;
    line-height:1.34 !important;
  }
  .me-sub-wrap #ctt_con .me-page-lead{
    font-size:16px !important;
  }
  .me-sub-wrap #ctt_con .me-page-summary,
  .me-sub-wrap #ctt_con .me-feature-grid{
    grid-template-columns:1fr !important;
  }
  .me-sub-wrap #ctt_con .me-page-summary li{
    grid-template-columns:82px minmax(0,1fr);
  }
}

/* round14: compact mobile board cards */
@media (max-width:768px){
  .me-sub-wrap #bo_list{
    padding-left:18px;
    padding-right:18px;
  }
  .me-sub-wrap #bo_list .tbl_head01{
    border:0;
    background:transparent;
    overflow:visible;
  }
  .me-sub-wrap #bo_list .tbl_head01 table,
  .me-sub-wrap #bo_list .tbl_head01 tbody,
  .me-sub-wrap #bo_list .tbl_head01 tr,
  .me-sub-wrap #bo_list .tbl_head01 td{
    display:block;
    width:100% !important;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr{
    margin:0 0 14px !important;
    padding:18px 18px 16px !important;
    border:1px solid var(--point-200) !important;
    border-radius:16px !important;
    background:#fff !important;
    box-shadow:0 4px 14px rgba(24,98,95,.06); /* [수정8] 모바일 게시판 행 그림자 톤다운 */
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td{
    height:auto !important;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num2,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_name,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num{
    display:none !important;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_subject{
    margin:0 0 10px !important;
    font-size:16px !important;
    line-height:1.5 !important;
  }
  .me-sub-wrap #bo_list .bo_tit a{
    display:block;
    font-size:16px !important;
    line-height:1.5 !important;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_datetime{
    display:block !important;
    color:#6b7280;   /* #6b7890 은 4.45:1 로 기준(4.5)에 못 미쳤다 */
    font-size:13px !important;
    line-height:1.35 !important;
    text-align:left !important;
  }
}

/* round15: harness QA mobile text-wrap fixes */
@media (max-width:768px){
  .me-authpage .me-wrap{
    max-width:390px;
  }
  .me-auth-visual-inner{
    width:100%;
    padding:34px 28px;
  }
  .me-auth-visual h2{
    max-width:300px;
    font-size:25px;
    line-height:1.32;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .me-auth-visual p,
  .me-auth-card h1,
  .me-auth-desc{
    word-break:keep-all;
    overflow-wrap:break-word;
  }

  .me-sub-wrap #bo_gall .gall_text_href .bo_tit,
  .me-sub-wrap #bo_gall .gall_text_href .bo_tit a,
  .me-sub-wrap #bo_gall .gall_text_href .bo_cnt{
    word-break:keep-all !important;
    overflow-wrap:break-word !important;
  }

  .me-sub-wrap #sch_result,
  .me-sub-wrap #sch_result .sch_res_list,
  .me-sub-wrap #sch_result .sch_res_title,
  .me-sub-wrap #sch_result .sch_res_list p,
  .me-sub-wrap #sch_result .me-sch-content p{
    word-break:keep-all !important;
    overflow-wrap:break-word !important;
  }

  .me-sub-wrap #fregister_private div{
    overflow:visible;
  }
  .me-sub-wrap #fregister_private table,
  .me-sub-wrap #fregister_private thead,
  .me-sub-wrap #fregister_private tbody,
  .me-sub-wrap #fregister_private tr,
  .me-sub-wrap #fregister_private th,
  .me-sub-wrap #fregister_private td{
    display:block;
    width:100% !important;
  }
  .me-sub-wrap #fregister_private thead{
    display:none;
  }
  .me-sub-wrap #fregister_private tr{
    margin:0 0 12px;
    overflow:hidden;
    border:1px solid var(--point-200);
    border-radius:14px;
    background:#fff;
  }
  .me-sub-wrap #fregister_private td{
    position:relative;
    padding:13px 16px 13px 108px !important;
    border:0 !important;
    border-bottom:1px solid #edf1f8 !important;
    font-size:14px;
    line-height:1.55;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .me-sub-wrap #fregister_private td:last-child{
    border-bottom:0 !important;
  }
  .me-sub-wrap #fregister_private td:before{
    position:absolute;
    left:16px;
    top:13px;
    width:78px;
    color:var(--c-primary);
    font-weight:800;
  }
  .me-sub-wrap #fregister_private td:nth-child(1):before{content:"목적";}
  .me-sub-wrap #fregister_private td:nth-child(2):before{content:"항목";}
  .me-sub-wrap #fregister_private td:nth-child(3):before{content:"보유기간";}
}

/* round16: mockup-informed common subpage components */
/* 서브 페이지 상단 띠 — 시안(metaedusys.pages.dev)의 .st-subhero 와 같은 값을 쓴다.
   쓰던 사진은 행사장에서 찍은 실사진(company-classroom-3, 1561x789)이었다.
   그 파일은 학생 얼굴이 드러나 웹 폴더 밖(_workspace/비공개_원본)으로 옮겼다.
   1425x307 띠에 cover 로 넣으니 위아래가 잘려 흐릿해 보이고, 오른쪽 끝
   그라데이션이 .42 까지 옅어지는 자리에서 얼굴이 알아볼 만큼 드러났다.
   시안이 쓰는 ai-company(만든 그림)로 바꾸고, 그라데이션·위치·바탕색도
   시안 값 그대로 옮긴다. 오른쪽으로 붙여 인물이 글 뒤로 가지 않게 한다. */
.me-subhead{
  min-height:252px;
  padding:58px 0 62px !important;   /* 시안 서브히어로 높이(270px)에 맞춘다 */
  text-align:left;
  background-color:#0a1e42;
  background:
    linear-gradient(90deg,rgba(5,18,44,.96) 0%,rgba(8,27,64,.90) 36%,rgba(24,98,95,.58) 70%,rgba(24,98,95,.32) 100%),
    url("../img/extracted/ai-company.jpg?v=20260907-images1") 100% 50%/cover no-repeat,
    #0a1e42 !important;
}
@supports (background-image:image-set(url("../img/extracted/ai-company.webp?v=20260907-images1") type("image/webp"))){
  .me-subhead{
    background:
      linear-gradient(90deg,rgba(5,18,44,.96) 0%,rgba(8,27,64,.90) 36%,rgba(24,98,95,.58) 70%,rgba(24,98,95,.32) 100%),
      image-set(url("../img/extracted/ai-company.webp?v=20260907-images1") type("image/webp"),
                url("../img/extracted/ai-company.jpg?v=20260907-images1") type("image/jpeg")) 100% 50%/cover no-repeat,
      #0a1e42 !important;
  }
}
.me-subhead::before{
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:64px 64px;
  opacity:.42;
}
.me-subhead::after{
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.08));
}
.me-subhead .me-wrap{
  align-items:flex-start !important;
  justify-content:center;
  min-height:92px;
  gap:16px !important;
}
.me-subhead-title{
  max-width:1000px;
  font-size:48px !important;
  line-height:1.18 !important;
  letter-spacing:0 !important;
}
.me-crumb{
  justify-content:flex-start !important;
  padding:0 !important;
  background:transparent !important;
  color:rgba(255,255,255,.76) !important;
}
.me-crumb a,
.me-crumb-cur{
  color:#fff !important;
}
.me-crumb-cur{
  font-weight:800;
}

/* [공유버튼 수정] 인쇄·공유 셀을 동일 높이로 정렬하고, 카드 20px 라운드코너 클립/노치 제거.
   - align-items:stretch + .me-share-wrap align-self:stretch 로 인쇄=공유 셀 같은 높이.
   - 카드 안쪽으로 띄운(inset) 알약형 그룹으로 묶어 둥근 코너에 걸리지 않게.
   - 기존 border-left/right(둥근 모서리와 충돌)는 그룹 테두리+내부 구분선으로 대체.
   - [회귀수정] overflow:hidden 은 공유 드롭다운(.me-share-menu, actions 박스 밖 아래 absolute)을 클립해
     메뉴가 안 보이는 버그를 유발 → 제거. 대신 양 끝 셀의 모서리를 그룹 radius 와 맞춰 알약 외형 유지. */
.me-subnav-actions{
  display:flex;
  align-items:stretch;
  gap:0;
  flex:0 0 auto;
  margin-left:14px;
  border:1px solid var(--point-200);
  border-radius:12px;
  background:#fff;
}
/* 알약 외형: 첫 셀 좌측·마지막 셀 우측 모서리를 그룹 radius(12px)에 맞춤(overflow:hidden 대체) */
.me-subnav-actions > .me-subnav-icon:first-child{border-top-left-radius:11px;border-bottom-left-radius:11px;}
.me-subnav-actions > .me-subnav-icon:last-child{border-top-right-radius:11px;border-bottom-right-radius:11px;}
.me-subnav-actions > .me-share-wrap:last-child .me-share-toggle{border-top-right-radius:11px;border-bottom-right-radius:11px;}
.me-subnav-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:54px;
  min-height:42px;
  align-self:stretch;
  border:0;
  border-left:1px solid var(--point-200);
  border-radius:0;
  background:#fff;
  color:var(--point-ink);
  cursor:pointer;
  transition:background .18s,border-color .18s,color .18s,transform .18s;
}
.me-subnav-icon:first-child{border-left:0;}
.me-subnav-icon:hover{
  background:var(--point-100);
  color:var(--point-ink);
  transform:none;
}
.me-share-wrap{
  position:relative;
  display:flex;
  align-items:stretch;
  align-self:stretch;
  border-left:1px solid var(--point-200);
}
.me-share-toggle.is-active,
.me-share-toggle[aria-expanded="true"]{
  background:var(--point-150);
}
.me-share-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:50;
  width:208px;
  max-width:calc(100vw - 40px);
  padding:6px;
  border:1px solid var(--point-200);
  border-radius:14px;
  background:#fff;
  box-shadow:0 14px 34px rgba(24,98,95,.13);
}
.me-share-menu[hidden]{display:none !important;}
.me-share-menu::before{
  content:"";
  position:absolute;
  top:-8px;
  right:16px;
  width:14px;
  height:14px;
  border-left:1px solid var(--point-200);
  border-top:1px solid var(--point-200);
  background:#fff;
  transform:rotate(45deg);
}
.me-share-menu button{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:0;
  border-radius:8px;
  background:#fff;
  color:#24344d;
  font-size:15px;
  font-weight:700;
  line-height:1.3;
  text-align:left;
  cursor:pointer;
}
.me-share-menu button:hover,
.me-share-menu button:focus-visible{
  background:var(--point-50);
  color:var(--point-ink);
}
.me-share-menu i,
.me-share-x{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  min-width:18px;
  color:var(--point-ink);
  font-size:17px;
}
.me-share-x{
  font-family:Arial,sans-serif;
  font-weight:800;
  font-size:16px;
}
/* 일반 형제(~) 사용: head.php 가 .me-subnav-wrap 과 .me-sub-wrap 사이에 공유 <script> 를
   출력하므로 인접(+) 선택자는 매칭되지 않는다(탭바-본문 겹침 회귀 방지) */
.me-subnav-wrap ~ .me-wrap.me-sub-wrap{
  padding-top:86px !important;
}

.me-sub-wrap{
  background:#fff !important;
}
.me-wrap.me-sub-wrap{
  max-width:1480px !important; /* [폭 통일] 메인 --maxw(1480)와 동일 — >1480 화면에서도 서브=메인 폭 */
  padding-left:40px;
  padding-right:40px;
}
.me-sub-wrap #ctt,
/* [폭 통일] 서브 본문 컨테이너의 1180 캡 제거 → .me-sub-wrap([40,1311], 메인 섹션과 동일)을 꽉 채움.
   기존 1180 은 메인 섹션 본문(~1271)보다 좁아 "서브가 더 좁다"는 체감을 유발했다.
   (제목/리드 등 내부 타이포 가독성 캡 920/980 은 별도 규칙으로 유지) */
.me-sub-wrap #ctt_con,
.me-sub-wrap #ctt_con > .me-page,
.me-sub-wrap #bo_list,
.me-sub-wrap #bo_gall,
.me-sub-wrap #bo_v,
.me-sub-wrap #bo_w,
.me-sub-wrap #sch_res_detail,
.me-sub-wrap #sch_result,
.me-sub-wrap .register,
.me-sub-wrap .me-sol-intro,
.me-sub-wrap .me-solsec,
.me-sub-wrap .me-solcta{
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.me-sub-wrap #ctt_con > .me-page{
  padding:0 !important;
}
.me-sub-wrap #ctt_con .me-page-kicker{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 13px;
  border:1px solid rgba(31,122,119,.15);
  border-radius:999px;
  background:var(--point-50);
  color:var(--point-ink);
  font-size:12px;
  font-weight:900;
  letter-spacing:0;
}
.me-sub-wrap #ctt_con .me-page-title{
  max-width:920px !important;
  margin-top:18px !important;
  font-size:42px !important;
  line-height:1.22 !important;
  letter-spacing:0 !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
.me-sub-wrap #ctt_con .me-page-lead{
  max-width:980px !important;
  margin-top:18px !important;
  color:#526177 !important;
  font-size:18px !important;
  line-height:1.8 !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}

.me-sub-wrap #ctt_con .me-page-intro{
  margin:0 0 54px !important;
  gap:44px !important;
}
.me-sub-wrap #ctt_con .me-page-summary{
  gap:12px !important;
}
.me-sub-wrap #ctt_con .me-page-summary li{
  position:relative;
  min-height:126px;
  border:1px solid var(--point-200) !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 14px 34px rgba(24,98,95,.06) !important;
}
.me-sub-wrap #ctt_con .me-page-summary b{
  color:var(--point-ink) !important;
  font-size:28px !important;
  line-height:1 !important;
}
.me-sub-wrap #ctt_con .me-page-summary span{
  color:#596980 !important;
  font-weight:700;
  word-break:keep-all;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-intro,
.me-sub-wrap #ctt_con .me-page-device .me-page-intro{
  display:block !important; /* [수정5] device 도 intro 를 block 으로 → PICO/Meta/MDM 3카드가 우측
                               좁은 컬럼(~340px)에 압축돼 찌그러지던 문제 해소(full width 3-col). */
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  margin-top:34px !important;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li{
  display:grid !important;
  grid-template-columns:86px minmax(0,1fr) !important;
  align-items:center;
  padding:24px 26px !important;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li::before,
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li::before,
.me-sub-wrap #ctt_con .me-page-device .me-page-summary li::before{
  content:"";
  width:54px;
  height:54px;
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(31,122,119,.14),rgba(60,186,181,.16));
  box-shadow:inset 0 0 0 1px rgba(31,122,119,.1);
  /* [수정2] 빈 색상 박스로 보이던 아이콘 슬롯 — 실제 브랜드색 SVG 아이콘을 배경으로 렌더.
     마크업에 per-item 훅이 없어(content HTML 고정) :nth-child 로 항목별 아이콘 차등. */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231b4dd1' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21V9l9-6 9 6v12'/%3E%3Cpath d='M9 21v-6h6v6'/%3E%3C/svg%3E"),
    linear-gradient(135deg,rgba(31,122,119,.14),rgba(60,186,181,.16));
  background-repeat:no-repeat;
  background-position:center;
  background-size:26px 26px, cover;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li:nth-child(2)::before,
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li:nth-child(2)::before,
.me-sub-wrap #ctt_con .me-page-device .me-page-summary li:nth-child(2)::before{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231b4dd1' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='3'/%3E%3Cpath d='M3 21v-2a5 5 0 0 1 5-5h2a5 5 0 0 1 5 5v2'/%3E%3Cpath d='M16 3.5a3 3 0 0 1 0 7M21 21v-2a5 5 0 0 0-3-4.5'/%3E%3C/svg%3E"),
    linear-gradient(135deg,rgba(31,122,119,.14),rgba(60,186,181,.16));
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li:nth-child(3)::before,
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li:nth-child(3)::before,
.me-sub-wrap #ctt_con .me-page-device .me-page-summary li:nth-child(3)::before{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%231b4dd1' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l2.5 6.5L21 9l-5 4 1.5 7L12 16l-5.5 4L8 13 3 9l6.5-.5L12 2z'/%3E%3C/svg%3E"),
    linear-gradient(135deg,rgba(31,122,119,.14),rgba(60,186,181,.16));
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary,
.me-sub-wrap #ctt_con .me-page-device .me-page-summary{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.me-sub-wrap #ctt_con .me-page-device .me-page-summary{
  margin-top:34px !important; /* [수정5] intro block 화에 따라 텍스트와 카드 사이 간격 확보 */
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li,
.me-sub-wrap #ctt_con .me-page-device .me-page-summary li{
  display:flex !important;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:13px;
  padding:26px !important;
}

.me-sub-wrap #ctt_con .me-photo-split{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(360px,46%) !important;
  align-items:center;
  gap:42px !important;
  margin:54px 0 !important;
  padding:34px !important;
  border:1px solid var(--point-200) !important;
  border-radius:22px !important;
  background:linear-gradient(135deg,var(--point-50) 0%,var(--point-100) 100%) !important;
  box-shadow:0 20px 48px rgba(24,98,95,.07);
}
.me-sub-wrap #ctt_con .me-photo-split img{
  width:100%;
  min-height:250px;
  max-height:360px;
  object-fit:cover;
  border-radius:16px !important;
  margin:0 !important;
  box-shadow:0 14px 34px rgba(24,98,95,.12);
}
.me-sub-wrap #ctt_con .me-photo-copy{
  padding:0 !important;
}
.me-sub-wrap #ctt_con .me-photo-copy h2,
.me-sub-wrap #ctt_con .me-section-head h2{
  margin-top:0 !important;
  font-size:31px !important;
  line-height:1.35 !important;
  letter-spacing:0 !important;
  word-break:keep-all;
}

.me-sub-wrap #ctt_con .me-feature-grid{
  /* [폴리시] 3개 카드가 2-col(≤1180)에서 2+1 빈 셀을 만들던 문제 →
     flex+wrap+center 로 trailing 카드 중앙 정렬. 데스크탑 3-up 은 full row 라 좌우 edge 유지. */
  display:flex !important;
  flex-wrap:wrap;
  justify-content:center;
  gap:20px !important;
  margin:28px 0 54px !important;
}
.me-sub-wrap #ctt_con .me-feature-grid > .me-feature-card{
  flex:0 1 calc((100% - 40px)/3);
  min-width:0;
}
.me-sub-wrap #ctt_con .me-feature-card{
  position:relative;
  min-height:220px;
  padding:30px 28px !important;
  border-color:var(--point-200) !important;
  border-radius:18px !important;
  box-shadow:0 16px 38px rgba(24,98,95,.06) !important;
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.me-sub-wrap #ctt_con .me-feature-card:hover{
  transform:translateY(-4px);
  border-color:rgba(31,122,119,.32) !important;
  box-shadow:0 22px 50px rgba(24,98,95,.1) !important;
}
.me-sub-wrap #ctt_con .me-feature-card::after{
  content:"";
  position:absolute;
  right:24px;
  top:24px;
  width:40px;
  height:40px;
  border-radius:12px;
  background:
    linear-gradient(135deg,rgba(31,122,119,.12),rgba(60,186,181,.14));
}
.me-sub-wrap #ctt_con .me-feature-card strong{
  min-width:48px !important;
  min-height:34px !important;
  border-radius:999px !important;
  background:var(--point-50) !important;
  color:var(--point-ink) !important;
}
.me-sub-wrap #ctt_con .me-feature-card h3{
  padding-right:44px;
  color:#0a3365 !important;
  word-break:keep-all !important;
}
.me-sub-wrap #ctt_con .me-feature-card li{
  color:#526177;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
.me-sub-wrap #ctt_con .me-process{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px !important;
  margin:26px 0 54px !important;
  padding:0 !important;
}
.me-sub-wrap #ctt_con .me-process li{
  position:relative;
  min-height:168px;
  padding:26px 22px !important;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:#fff;
  box-shadow:0 14px 34px rgba(24,98,95,.06);
}
.me-sub-wrap #ctt_con .me-process li:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-15px;
  top:50%;
  width:24px;
  height:24px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 1px var(--point-200);
  transform:translateY(-50%);
  z-index:2;
}
.me-sub-wrap #ctt_con .me-process strong{
  color:var(--point-ink);
}
.me-sub-wrap #ctt_con .me-info-table{
  overflow:hidden;
  border:1px solid var(--point-200) !important;
  border-radius:18px !important;
  box-shadow:0 14px 34px rgba(24,98,95,.05);
}
.me-sub-wrap #ctt_con .me-info-table th{
  background:var(--point-50) !important;
}
.me-sub-wrap #ctt_con .me-cta-panel{
  position:relative;
  overflow:hidden;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin:64px 0 0 !important;
  padding:36px 42px !important;
  border:0 !important;
  border-radius:22px !important;
  background:
    linear-gradient(90deg,var(--point-ink) 0%,var(--point-deep) 100%) !important;
  box-shadow:0 20px 48px rgba(31,122,119,.18);
}
.me-sub-wrap #ctt_con .me-cta-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.35;
}
.me-sub-wrap #ctt_con .me-cta-panel > *{
  position:relative;
  z-index:1;
}
.me-sub-wrap #ctt_con .me-cta-panel h2{
  margin:0 0 8px !important;
  color:#fff !important;
  font-size:27px !important;
  line-height:1.35 !important;
  word-break:keep-all;
}
.me-sub-wrap #ctt_con .me-cta-panel p{
  margin:0 !important;
  color:rgba(255,255,255,.72) !important;
}
.me-sub-wrap #ctt_con .me-cta-actions{
  display:flex;
  gap:10px;
  flex:0 0 auto;
}
.me-sub-wrap #ctt_con .me-cta-actions a{
  min-width:118px;
  height:48px;
  border-radius:12px;
}

.me-sub-wrap #bo_btn_top{
  min-height:74px;
  padding:14px 18px 14px 22px !important;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 16px rgba(24,98,95,.06); /* [수정8] Total/검색 바 그림자 톤다운(blur 34→16) */
  margin-bottom:28px; /* [수정7] 첫 게시물 행과의 간격 확대(18→28) */
}
.me-sub-wrap #bo_list_total{
  color:#41536e !important;
  font-weight:700;
}
.me-sub-wrap #bo_cate_ul{
  gap:10px !important;
  margin:0 0 22px !important;
}
.me-sub-wrap #bo_cate_ul li a,
.me-sub-wrap #bo_cate_ul li strong,
.me-sub-wrap #sch_res_board a{
  min-height:38px;
  padding:0 15px !important;
  border-radius:999px !important;
  font-weight:800 !important;
}
.me-sub-wrap #bo_gall #gall_ul.gall_row{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:24px !important;
  max-width:none !important;
}
.me-sub-wrap #bo_gall .gall_box{
  border-radius:18px !important;
  box-shadow:0 6px 18px rgba(24,98,95,.07) !important; /* [수정8] 갤러리 카드 그림자 톤다운(blur 38→18) */
}
.me-sub-wrap #bo_gall .gall_img{
  height:238px !important;
  max-height:238px !important;
}
.me-sub-wrap #bo_gall .gall_text_href{
  padding:22px 24px 10px !important;
}
.me-sub-wrap #bo_gall .gall_info{
  padding:0 24px 22px !important;
}
.me-sub-wrap #bo_gall .gall_text_href .bo_tit{
  font-size:20px !important;
  line-height:1.42 !important;
}
.me-sub-wrap #bo_gall .gall_text_href .bo_cnt{
  min-height:48px;
  color:#526177 !important;
}
.me-sub-wrap .tbl_head01{
  border-radius:18px !important;
  box-shadow:0 14px 34px rgba(24,98,95,.05);
}
.me-sub-wrap #sch_res_detail{
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:10px !important;
  min-height:88px;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 14px 34px rgba(24,98,95,.06);
}
.me-sub-wrap #sch_res_detail select{
  width:170px !important;
}
.me-sub-wrap #sch_res_detail .sch_wr{
  flex:1 1 380px;
  max-width:520px;
}
.me-sub-wrap #sch_res_detail .frm_input{
  width:100% !important;
}
.me-sub-wrap #sch_res_detail .btn_submit{
  flex:0 0 50px;
  width:50px !important;
  padding:0 !important;
  font-size:0 !important;
}
.me-sub-wrap #sch_res_detail .btn_submit i{
  font-size:18px !important;
  line-height:1;
}
.me-sub-wrap #sch_res_ov,
.me-sub-wrap .sch_res_list .search_board_result,
.me-sub-wrap .me-sch-content,
.me-sub-wrap #fregister section,
.me-sub-wrap .register_form_inner{
  border-radius:18px !important;
  box-shadow:0 14px 34px rgba(24,98,95,.05) !important;
}

@media (max-width:1180px){
  .me-subhead-title{font-size:40px !important;}
  /* [폴리시] feature-grid flex 2-up basis(≤1180). trailing 카드 중앙 정렬. */
  .me-sub-wrap #ctt_con .me-feature-grid > .me-feature-card{flex:0 1 calc((100% - 20px)/2) !important;}
  .me-sub-wrap #ctt_con .me-process{grid-template-columns:repeat(2,minmax(0,1fr));}
  .me-sub-wrap #ctt_con .me-process li:not(:last-child)::after{display:none;}
  /* [갤러리 정렬] ≤1180 은 2열 좌측정렬 그리드(base 3열의 !important 를 이기도록 !important). */
  .me-sub-wrap #bo_gall #gall_ul.gall_row{grid-template-columns:repeat(2,1fr) !important;}
}

@media (max-width:900px){
  .me-subhead{
    min-height:218px;
    padding:54px 0 78px !important;
  }
  .me-subhead-title{font-size:34px !important;}
  .me-subnav-actions{
    display:flex;
    flex:0 0 auto;
    align-self:center;
    margin-left:8px;
  }
  .me-subnav-actions .me-subnav-icon{
    width:44px;
    height:44px;
    flex:0 0 44px;
  }
  .me-share-menu{
    right:0;
    min-width:168px;
  }
  .me-subnav-wrap ~ .me-wrap.me-sub-wrap{
    padding-top:42px !important;
  }
  /* [폴리시] 769~900 구간 본문 거터는 base(40px)로 유지 — 헤더/탭바(40px)와 정렬.
     기존 ≤900:24px override 가 769~900 에서 16px 어긋남을 유발해 제거. ≤768/≤480 정렬은 파일 하단 전용 블록에서 처리. */
  .me-sub-wrap #ctt_con .me-page-title{
    font-size:34px !important;
  }
  .me-sub-wrap #ctt_con .me-page-greeting .me-page-summary,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-summary,
  .me-sub-wrap #ctt_con .me-page-device .me-page-summary{
    grid-template-columns:1fr !important;
  }
  .me-sub-wrap #ctt_con .me-photo-split{
    grid-template-columns:1fr !important;
  }
  .me-sub-wrap #ctt_con .me-cta-panel{
    flex-direction:column;
    align-items:flex-start;
  }
  .me-sub-wrap #ctt_con .me-cta-actions{
    width:100%;
  }
  .me-sub-wrap #ctt_con .me-cta-actions a{
    flex:1 1 0;
  }
  .me-sub-wrap #sch_res_detail{
    align-items:stretch;
    flex-wrap:wrap;
  }
  .me-sub-wrap #sch_res_detail select,
  .me-sub-wrap #sch_res_detail .sch_wr{
    flex:1 1 100%;
    width:100% !important;
    max-width:none;
  }
}

@media (max-width:640px){
  .me-subhead{
    min-height:188px;
    padding:38px 0 62px !important;
  }
  .me-subhead .me-wrap{
    gap:10px !important;
  }
  .me-subhead-title{
    font-size:28px !important;
  }
  .me-crumb{
    font-size:12.5px !important;
    line-height:1.45;
  }
  /* [폴리시] ≤640 본문 거터 18px — 헤더/탭바(.me-main .me-wrap=18px @≤640)와 정렬(파일 하단 SoT 블록과 동일값). */
  .me-wrap.me-sub-wrap{
    padding-left:18px;
    padding-right:18px;
  }
  .me-sub-wrap #ctt,
  .me-sub-wrap #ctt_con,
  .me-sub-wrap #ctt_con > .me-page,
  .me-sub-wrap #bo_list,
  .me-sub-wrap #bo_gall,
  .me-sub-wrap #bo_v,
  .me-sub-wrap #bo_w,
  .me-sub-wrap #sch_res_detail,
  .me-sub-wrap #sch_result,
  .me-sub-wrap .register{
    max-width:100% !important;
  }
  .me-sub-wrap #ctt_con .me-page-title{
    font-size:28px !important;
    line-height:1.34 !important;
  }
  .me-sub-wrap #ctt_con .me-page-lead{
    font-size:16px !important;
  }
  .me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li{
    grid-template-columns:66px minmax(0,1fr) !important;
    padding:20px !important;
  }
  .me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li::before,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-summary li::before,
  .me-sub-wrap #ctt_con .me-page-device .me-page-summary li::before{
    width:46px;
    height:46px;
    border-radius:14px;
  }
  .me-sub-wrap #ctt_con .me-photo-split{
    margin:34px 0 !important;
    padding:20px !important;
    border-radius:18px !important;
  }
  .me-sub-wrap #ctt_con .me-photo-split img{
    min-height:190px;
  }
  .me-sub-wrap #ctt_con .me-photo-copy h2,
  .me-sub-wrap #ctt_con .me-section-head h2{
    font-size:25px !important;
  }
  .me-sub-wrap #ctt_con .me-feature-grid,
  .me-sub-wrap #ctt_con .me-process{
    grid-template-columns:1fr !important;
  }
  /* [폴리시] feature-grid flex 1-up basis(≤640). */
  .me-sub-wrap #ctt_con .me-feature-grid > .me-feature-card{flex:1 1 100% !important;}
  .me-sub-wrap #ctt_con .me-feature-card{
    min-height:0;
  }
  .me-sub-wrap #ctt_con .me-cta-panel{
    padding:26px 22px !important;
    border-radius:18px !important;
  }
  .me-sub-wrap #ctt_con .me-cta-panel h2{
    font-size:22px !important;
  }
  .me-sub-wrap #ctt_con .me-cta-actions{
    flex-direction:column;
  }
  .me-sub-wrap #bo_btn_top{
    min-height:0;
    padding:16px !important;
  }
  .me-sub-wrap #bo_gall #gall_ul.gall_row{
    grid-template-columns:1fr !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .me-sub-wrap #bo_gall .gall_img{
    height:210px !important;
    max-height:210px !important;
  }
  .me-sub-wrap #bo_gall .gall_text_href .bo_tit{
    font-size:18px !important;
  }
  .me-sub-wrap .tbl_head01{
    box-shadow:none;
  }
  .me-sub-wrap #sch_res_detail .btn_submit{
    order:4;
    flex:0 0 50px;
  }
}

/* round17: reference-informed main page refresh */
.me-main{
  background:#fff;
}
.me-main .me-wrap{
  max-width:1480px;
}
.me-main .me-hero{
  min-height:704px;
  overflow:visible;
  color:#16233a;
  background-color:var(--point-100);
  background-image:
    linear-gradient(100deg,rgba(163,220,218,.96) 0%,rgba(163,220,218,.82) 31%,rgba(163,220,218,.34) 52%,rgba(163,220,218,0) 70%),
    url("../img/extracted/main-hero-vr.png");
  background-position:center, center 42%;
  background-size:cover, cover;
  background-repeat:no-repeat;
}
@supports (background-image:image-set(url("../img/extracted/main-hero-vr.webp") type("image/webp"))){
  .me-main .me-hero{
    background-image:
      linear-gradient(100deg,rgba(163,220,218,.96) 0%,rgba(163,220,218,.82) 31%,rgba(163,220,218,.34) 52%,rgba(163,220,218,0) 70%),
      image-set(url("../img/extracted/main-hero-vr.webp") type("image/webp"), url("../img/extracted/main-hero-vr.png") type("image/png"));
  }
}
.me-main .me-hero-bg,
.me-main .me-orb,
.me-main .me-grid-deco{
  display:none !important;
}
.me-main .me-hero-inner{
  display:block;
  min-height:610px;
  padding-top:142px;
  padding-bottom:122px;
}
.me-main .me-hero-copy{
  max-width:760px;
}
.me-main .me-badge{
  margin-bottom:22px;
  border-color:rgba(31,122,119,.16);
  background:rgba(255,255,255,.78);
  color:var(--point-ink);
  box-shadow:0 8px 24px rgba(24,98,95,.08);
}
.me-main .me-badge .me-dot{
  box-shadow:0 0 0 4px rgba(60,186,181,.16);
}
.me-main .me-hero-title{
  max-width:820px;
  margin-bottom:26px;
  color:#14233b;
  line-height:1.16;
  letter-spacing:-.02em;
  word-break:keep-all;
  overflow-wrap:break-word;
}
/* 시안(metaedusys.pages.dev)의 h1 은 두 줄 모두 clamp(34px,4.4vw,58px) 한 크기다.
   여기서는 둘째 줄만 66px 여서 글 덩어리가 유난히 커 보였다. 시안 값으로 통일. */
.me-main .me-hero-title .me-hero-l1,
.me-main .me-hero-title .me-hero-l2{font-size:clamp(34px,4.4vw,58px);}
.me-main .me-hero-title .me-hero-l2{margin-top:6px;}
.me-main .me-hero-title em{
  color:var(--c-primary);
}
.me-main .me-hero-sub{
  max-width:700px;
  margin-bottom:38px;
  color:#46566f;
  font-size:19px;      /* 시안과 동일 */
  line-height:1.7;
  font-weight:500;
  word-break:keep-all;
}
.me-main .me-hero-cta{
  gap:12px;
}
.me-main .me-hero-cta .me-btn{
  height:58px;
  padding:0 30px;
  border-radius:999px;
  font-size:18px;
}
.me-main .me-hero-cta .me-btn-ghost{
  border:1px solid #d4deee;
  background:#fff;
  color:#24344d;
  box-shadow:0 10px 28px rgba(24,98,95,.08);
}
.me-main .me-hero-cta .me-btn-ghost:hover{
  color:var(--point-ink);
  border-color:var(--point-ink);
  background:#fff;
}
.me-main .me-overlap{
  grid-template-columns:1.18fr 1fr;
  gap:24px;
  transform:none;
  margin-top:0;      /* 히어로 밖으로 뺐다 — 끌어올릴 필요가 없다 */
  align-items:stretch;
}
/* 히어로에서 분리한 바로가기·지표 띠. 좌우 여백은 .me-wrap 기본값을 그대로 쓰므로
   위아래 섹션과 왼쪽 끝이 정확히 맞는다. */
.me-main > .me-quick{
  padding-top:56px;
  padding-bottom:56px;
  background:var(--c-bg-soft);
}
.me-main .me-shortcut,
.me-main .me-kpi{
  min-height:170px;
  border-radius:20px;
}
.me-main .me-shortcut{
  display:flex;
  align-items:center;
  gap:28px;
  padding:28px 34px;
  border:1px solid #edf1f7;
  box-shadow:0 22px 50px rgba(24,98,95,.10);
}
.me-main .me-shortcut-head{
  flex:0 0 150px;
  display:block;
  margin:0;
  padding:0;
  border:0;
}
.me-main .me-shortcut-head strong{
  display:block;
  font-size:23px;
  line-height:1.28;
}
.me-main .me-shortcut-head span{
  display:block;
  margin-top:5px;
  font-size:14px;
}
.me-main .me-shortcut-list{
  flex:1 1 auto;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  min-width:0;
  padding-left:28px;
  border-left:1px solid #edf1f7;
}
.me-main .me-shortcut-list a{
  min-height:112px;
  padding:10px 6px;
  font-size:14.5px;
  font-weight:800;
}
.me-main .me-sc-ico{
  width:52px;
  height:52px;
  border-radius:15px;
  background:var(--point-100);
}
.me-main .me-kpi{
  padding:30px 20px;
  background:linear-gradient(125deg,var(--point-ink) 0%,var(--point-ink) 100%); /* 레퍼런스 값 */
  box-shadow:0 22px 50px rgba(31,122,119,.30);
}
.me-main .me-repsol{
  padding-top:118px;
}
.me-main .me-sec{
  padding-top:104px;
  padding-bottom:104px;
}
.me-main .me-sec-head{
  max-width:820px;
  margin-bottom:48px;
}
.me-main .me-eyebrow{
  letter-spacing:.08em;
}
.me-main .me-sec-title{
  font-size:42px;
  line-height:1.22;
  letter-spacing:0;
  word-break:keep-all;
}
.me-main .me-repsol-grid{
  gap:24px;
}.me-main .me-repsol-card,
.me-main .me-why-card,
.me-main .me-benefit-card{
  border:1px solid var(--point-200);
  border-radius:18px;
  box-shadow:0 16px 38px rgba(24,98,95,.06);
}.me-main .me-repsol-card:hover,
.me-main .me-why-card:hover{
  transform:translateY(-4px);
  border-color:rgba(31,122,119,.28);
  box-shadow:0 22px 50px rgba(24,98,95,.10);
}
.me-main .me-repsol-thumb{
  aspect-ratio:16/9;
}
.me-main .me-repsol-body{
  min-height:236px;
  padding:28px 28px 30px;
}.me-main .me-repsol-body h3{
  font-size:22px;
  line-height:1.38;
  font-weight:800;
  word-break:keep-all;
}.me-main .me-repsol-body p,
.me-main .me-why-card p,
.me-main .me-benefit-card p,
.me-main .me-benefit-card li{
  font-size:15.5px;
  line-height:1.72;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-main .me-benefits,
.me-main .me-products,
.me-main .me-why{
  background:var(--point-50);
}
.me-main .me-benefit-grid{
  grid-template-columns:1.08fr .96fr .96fr;
}
.me-main .me-benefit-card{
  padding:34px 32px;
  border-radius:20px;
}
.me-main .me-products .me-sec-head.with-nav{
  margin-bottom:34px;
}
.me-main .me-why-grid{
  gap:22px;
}
.me-main .me-why-card{
  padding:32px 28px;
}
.me-main .me-why-ico{
  border-radius:16px;
  background:var(--point-100);
}
.me-main .me-cta-band{
  border-radius:24px;
  background:linear-gradient(90deg,var(--point-ink) 0%,var(--point-deep) 100%);
}
.me-main .me-cta-band-bg{
  display:none;
}

@media (max-width:1200px){
  .me-main .me-hero{
    min-height:650px;
    background-position:center, 58% 46%;
  }
  .me-main .me-hero-inner{
    min-height:560px;
    padding-top:112px;
  }
  .me-main .me-hero-title{
    max-width:650px;
  }
  .me-main .me-hero-title .me-hero-l1{font-size:36px;}
  .me-main .me-hero-title .me-hero-l2{font-size:54px;}
  .me-main .me-hero-sub{
    max-width:600px;
    font-size:19px;
  }
  .me-main .me-overlap{
    grid-template-columns:1fr;
    margin-top:-70px;
  }
  .me-main .me-repsol{
    padding-top:90px;
  }
  .me-main .me-benefit-grid{
    grid-template-columns:1fr;
  }
  .me-main .me-benefit-card:first-child{
    grid-column:auto;
  }
}

@media (max-width:900px){
  .me-main .me-hero{
    min-height:620px;
    background-image:
      linear-gradient(180deg,rgba(163,220,218,.98) 0%,rgba(163,220,218,.94) 42%,rgba(163,220,218,.56) 100%),
      url("../img/extracted/main-hero-vr.png");
    background-position:center, 64% 42%;
  }
  @supports (background-image:image-set(url("../img/extracted/main-hero-vr.webp") type("image/webp"))){
    .me-main .me-hero{
      background-image:
        linear-gradient(180deg,rgba(163,220,218,.98) 0%,rgba(163,220,218,.94) 42%,rgba(163,220,218,.56) 100%),
        image-set(url("../img/extracted/main-hero-vr.webp") type("image/webp"), url("../img/extracted/main-hero-vr.png") type("image/png"));
    }
  }
  .me-main .me-hero-inner{
    min-height:500px;
    padding-top:70px;
    padding-bottom:120px;
    text-align:left;
  }
  .me-main .me-hero-copy{
    max-width:560px;
  }
  .me-main .me-hero-title{
    max-width:560px;
    margin-left:0;
    margin-right:0;
  }
  .me-main .me-hero-title .me-hero-l1{font-size:30px;}
  .me-main .me-hero-title .me-hero-l2{font-size:44px;}
  .me-main .me-hero-sub{
    max-width:520px;
    margin-left:0;
    margin-right:0;
    font-size:17px;
  }
  .me-main .me-hero-cta{
    justify-content:flex-start;
  }
  .me-main .me-shortcut{
    display:block;
    padding:24px;
  }
  .me-main .me-shortcut-head{
    margin-bottom:18px;
  }
  .me-main .me-shortcut-list{
    padding-left:0;
    border-left:0;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .me-main .me-sec{
    padding-top:76px;
    padding-bottom:76px;
  }
  .me-main .me-sec-title{
    font-size:34px;
  }
}

@media (max-width:640px){
  /* 거터는 .me-wrap 기본 단계를 따른다(769+ 40 · ≤768 20 · ≤480 18).
     여기서 ≤640 에만 18 을 주면 641~768 구간에서 머리말 20 · 본문 18 로 갈린다. */
  .me-main .me-hero{
    min-height:590px;
    background-position:center, 65% 100%;
    background-size:cover, auto 68%;
  }
  .me-main .me-hero-inner{
    min-height:430px;
    padding-top:44px;
    padding-bottom:160px;
  }
  .me-main .me-badge{
    max-width:100%;
    font-size:12.5px;
    line-height:1.4;
    white-space:normal;
  }
  .me-main .me-hero-title{
    max-width:354px;
    line-height:1.25;
  }
  .me-main .me-hero-title .me-hero-l1{font-size:25px;}
  .me-main .me-hero-title .me-hero-l2{font-size:34px;white-space:normal;}
  .me-main .me-hero-sub{
    max-width:354px;
    font-size:15.5px;
    line-height:1.7;
  }
  .me-main .me-hero-sub br{
    display:none;
  }
  .me-main .me-hero-cta{
    max-width:354px;
  }
  .me-main .me-hero-cta .me-btn{
    width:100%;
    height:52px;
    max-width:none;
    justify-content:center;
    padding:0 20px;
    font-size:16px;
  }
  .me-main .me-overlap{
    margin-top:-92px;
  }
  .me-main .me-shortcut,
  .me-main .me-kpi{
    min-height:0;
    padding:20px 18px;
    border-radius:18px;
  }
  .me-main .me-shortcut-head strong{
    font-size:20px;
  }
  .me-main .me-shortcut-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:none;
  }
  .me-main .me-shortcut-list a{
    min-height:104px;
    font-size:13.5px;
  }
  .me-main .me-repsol{
    padding-top:76px;
  }
  .me-main .me-sec-title{
    font-size:29px;
  }.me-main .me-repsol-body,
.me-main .me-why-card,
.me-main .me-benefit-card{
    padding:24px 22px;
  }
  .me-main .me-repsol-body{
    min-height:0;
  }.me-main .me-repsol-body h3{
    font-size:20px;
  }
}

/* round18: integrated design QA fixes */
html,body,button,input,select,textarea,
#wrapper,#container,#me-hd,#me-ft,.me-main,.me-sub-wrap,
.me-main h1,.me-main h2,.me-main h3,.me-main h4,
.me-sub-wrap h1,.me-sub-wrap h2,.me-sub-wrap h3,.me-sub-wrap h4{
  font-family:var(--font) !important;
}

/* 로고 크기는 시안(metaedusys.pages.dev)을 따른다 — 240px 폭.
   테마가 쓰던 logo-dark.png 는 원본이 232x60 이라 240px 로 키우면 뭉개진다.
   시안의 480x98 원본(logo-ko)으로 갈아 끼웠다. */
.me-logo-img{display:block;width:240px;max-width:30vw;height:auto;object-fit:contain;}
.me-ft-logo-img{display:block;width:auto;height:42px;max-width:190px;object-fit:contain;}
/* [GNB 확대] 폰트 15.5→17px, 항목 간격·좌우 패딩 ↑ 로 시원하게 펼침.
   우측 텍스트 인증영역을 아이콘 1개로 교체해 확보한 폭으로 1366 overflow 없이 흡수. */
.me-gnb-ul{gap:16px;}
.me-gnb-a{padding-left:20px;padding-right:20px;font-size:17px;}
.me-hd-inner{gap:22px;}
.me-subnav-icon.is-copied{color:#fff;background:var(--c-primary);border-color:var(--c-primary);}

.me-main > .me-process{display:block !important;background:#fff;}
.me-main > .me-process .me-steps{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:16px !important;
  align-items:stretch !important;
}
.me-main > .me-process .me-step{
  position:relative;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  min-height:176px;
  padding:26px 18px 24px !important;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:#fff;
  box-shadow:0 16px 38px rgba(24,98,95,.06);
  text-align:center;
}
.me-main > .me-process .me-step-ico{
  width:58px;height:58px;border-radius:17px;background:var(--point-100);color:var(--c-primary);
}
/* [수정0] 번호배지(::before "01")와 "STEP N" 라벨이 같은 의미로 중복 → STEP N 텍스트 제거(배지 유지).
   마크업(.me-step-no)은 보존하고 표시만 숨겨 회귀 위험 최소화. */
.me-main > .me-process .me-step-no{display:none;}

/* 번호가 두 번 찍히던 것 — 옛 마크업(li + b)용으로 만든 .me-process li::before 카운터가
   지금 쓰는 .me-step 에도 걸려, 진한 네모 「01」 위에 연한 네모 「01」이 겹쳐 나왔다.
   내용관리 본문(.me-sub-wrap #ctt_con)에서만 꺼 두었고 메인은 빠져 있었다.
   번호는 .me-step-ico 하나만 그린다. */
.me-main > .me-process .me-step::before{
  content:none !important;
  display:none !important;
}
.me-main > .me-process .me-step-name{
  margin-top:16px; /* [수정0] STEP N 제거분 보정 — 아이콘과 이름 사이 균형 */
  min-height:46px;
  font-size:18px;
  line-height:1.32;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-main > .me-process .me-step-chev{
  top:50% !important;
  right:-16px !important;
  transform:translateY(-50%) !important;
  color:#9aa9bd;
  z-index:2;
}

.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:12px !important;
  min-height:154px;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li::before{
  flex:0 0 auto;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary b{
  white-space:nowrap !important;
  font-size:30px !important;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-page-summary span{
  display:block;
  max-width:220px;
  line-height:1.55;
}

.me-sub-wrap #ctt_con .me-page-vision .me-page-summary{
  width:100% !important;
  gap:18px !important;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-intro{
  display:block !important;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li{
  display:grid !important;
  grid-template-columns:62px minmax(180px,1fr) !important;
  grid-template-rows:auto auto;
  align-items:start !important;
  gap:8px 16px !important;
  min-height:170px;
  text-align:left;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary li::before{
  grid-row:1 / span 2;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary b,
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary span{
  min-width:0;
  width:100%;
  max-width:none;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary b{
  font-size:23px !important;
  line-height:1.18 !important;
  text-transform:uppercase;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-summary span{
  line-height:1.55;
}

.me-sub-wrap #ctt_con .me-feature-card::after{
  display:none !important;
}
.me-sub-wrap #ctt_con .me-feature-card h3{
  padding-right:0 !important;
}
.me-sub-wrap #ctt_con .me-feature-card strong{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.me-sub-wrap #ctt_con .me-feature-card strong::before{
  content:"";
  width:8px;height:8px;border-radius:999px;background:var(--c-mint);
}
.me-sub-wrap #ctt_con .me-process li::before{
  display:none !important;
  content:none !important;
}
.me-sub-wrap #ctt_con .me-process li{
  list-style:none;
}

/* [스코프B/수정] 솔루션 상단 = 콘텐츠(인사말) 페이지와 동일한 공유 서브헤더 구조.
   .me-subhead + .me-subnav-wrap + .me-sub-wrap 를 그대로 사용하므로 별도 히어로 CSS 불필요.
   본문은 .me-sub-wrap(1180) 안에서 인트로 + 섹션으로 렌더 */
.me-sol-intro{
  padding:8px 0 4px;
  border-bottom:1px solid var(--c-line);
  margin-bottom:8px;
}
.me-sol-intro .me-eyebrow{display:inline-block;margin-bottom:12px;}
.me-sol-intro-head{
  font-size:24px;font-weight:800;line-height:1.4;letter-spacing:-.01em;
  color:var(--c-text);margin:0 0 12px;word-break:keep-all;overflow-wrap:break-word;
}
.me-sol-intro-sub{
  font-size:17px;line-height:1.72;color:var(--c-text-sub);margin:0 0 4px;
  word-break:keep-all;overflow-wrap:break-word;
}
/* 본문 섹션: .me-sec(전폭) 대신 .me-sub-wrap 내부 흐름에 맞춘 세로 간격 */
.me-solpage .me-solsec{padding:56px 0 0;}
/* [수정3] 틴트 패널 핵심포인트는 위 일반 .me-solsec 패딩을 무시하고 자체 패딩 사용(그림자 보존) */
.me-solpage .me-solsec.me-solpoints{padding:40px 36px 44px;margin-top:56px;}
.me-solpage .me-solsec .me-sec-head{text-align:left;max-width:none;margin:0 0 28px;}
.me-solpage .me-solcta{padding:64px 0 8px;}
/* [수정4] 파랑 위 파랑 가독성 — .me-cta-band(블루 그라데이션)는 흰 텍스트 전제이나,
   솔루션 CTA가 .me-sub-wrap 안에 있어 `.me-sub-wrap a{color:primary}`(L968)가 ghost 버튼 글자를
   파랑으로 덮어 대비 실패. 밴드 내부 텍스트/ghost 버튼을 흰색으로 복원(WCAG AA 확보). */
.me-sub-wrap .me-cta-band,
.me-sub-wrap .me-cta-band h2,
.me-sub-wrap .me-cta-band p{color:#fff;}
.me-sub-wrap .me-cta-band .me-btn-white{color:var(--c-primary);}
.me-sub-wrap .me-cta-band .me-finalcta-tel{color:rgba(255,255,255,.85);}
.me-sub-wrap .me-cta-band .me-finalcta-tel a{color:#fff;}
.me-subnav-icon.is-copied{color:#fff;background:var(--c-primary);border-color:var(--c-primary);}

.me-sub-wrap #bo_gall .gall_box{
  overflow:visible;
  border:1px solid var(--point-200);
  box-shadow:0 5px 16px rgba(24,98,95,.06); /* [수정8] 갤러리 카드 그림자 톤다운(blur 34→16) */
}
.me-sub-wrap #bo_gall .gall_text_href{padding-bottom:4px;}
.me-sub-wrap #bo_gall .gall_text_href .bo_tit{
  display:block;
  line-height:1.5 !important;
  min-height:0 !important;
  padding-bottom:2px;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-sub-wrap #bo_gall .gall_text_href .bo_cnt{
  display:block;
  min-height:0 !important;
  line-height:1.65 !important;
  color:#5b6a82;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-sub-wrap #bo_gall .gall_info{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 14px;
  line-height:1.45;
  min-height:0 !important;
}
.me-sub-wrap #bo_list .tbl_head01{
  border:0;
  background:#fff;
  box-shadow:none;
}
.me-sub-wrap #bo_list .tbl_head01 table{
  border-top:1px solid var(--point-200);
  border-bottom:1px solid var(--point-200);
}
.me-sub-wrap #bo_list .tbl_head01 tbody tr{
  border-bottom:1px solid #edf1f7;
}
.me-sub-wrap #bo_list .tbl_head01 td{
  padding-top:20px;
  padding-bottom:20px;
}
.me-sub-wrap #bo_list .bo_tit a{
  line-height:1.5;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-sub-wrap #bo_v_share{
  min-height:0;
  padding:0;
}
.me-sub-wrap #bo_v_share .me-copy-url{
  width:auto;
  min-width:104px;
}
.me-board-faq{
  margin:18px 0 30px;
  border-top:1px solid var(--point-200);
}
.me-board-faq ol{
  list-style:none;
  margin:0;
  padding:0;
}
.me-board-faq li{
  border-bottom:1px solid var(--point-200);
  background:#fff;
}
.me-board-faq-q{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 40px;
  align-items:center;
  gap:14px;
  width:100%;
  min-height:76px;
  padding:18px 0;
  border:0;
  background:transparent;
  color:#14233b;
  text-align:left;
  cursor:pointer;
}
.me-board-faq-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:999px;
  background:var(--point-100);
  color:var(--c-primary);
  font-size:15px;
  font-weight:900;
}
.me-board-faq-badge.answer{
  flex:0 0 34px;
  background:var(--c-primary);
  color:#fff;
}
.me-board-faq-title{
  min-width:0;
  font-size:18px;
  font-weight:800;
  line-height:1.5;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-board-faq-title em{
  display:inline-flex;
  margin-right:8px;
  padding:4px 9px;
  border-radius:999px;
  background:var(--point-50);
  color:var(--c-primary);
  font-size:12px;
  font-style:normal;
  font-weight:800;
  vertical-align:middle;
}
.me-board-faq-q i{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:1px solid var(--point-200);
  border-radius:999px;
  color:var(--c-primary);
}
.me-board-faq-q[aria-expanded="true"] .me-board-faq-title{color:var(--c-primary);}
.me-board-faq-a{
  display:flex;
  gap:18px;
  margin:0 0 22px 54px;
  padding:20px 24px 22px;
  border-radius:16px;
  background:var(--point-50);
  color:#4f6078;
}
.me-board-faq-a[hidden]{display:none !important;}
.me-board-faq-content{
  min-width:0;
  line-height:1.8;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.me-board-faq-content p{margin:0 0 10px;}
.me-board-faq-content p:last-child{margin-bottom:0;}

#faq_sch{
  border:1px solid var(--point-200);
  border-radius:18px;
  background:var(--point-50);
}
#faq_wrap{
  margin:18px 0 34px;
  border-top:1px solid var(--point-200);
}
#faq_wrap li{
  border-bottom:1px solid var(--point-200) !important;
  background:#fff;
}
#faq_wrap li:first-child{border-top:0;}
#faq_wrap li h3{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 40px;
  align-items:center;
  gap:14px;
  min-height:72px;
  padding:16px 0 !important;
  line-height:1.5;
}
#faq_wrap li h3 .tit_bg{
  position:static !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:34px;height:34px;
  border-radius:999px;
  background:var(--point-100);
  color:var(--c-primary);
  font-size:15px !important;
  font-weight:900;
}
#faq_wrap li h3 a{
  color:#14233b;
  font-size:18px;
  font-weight:800;
  line-height:1.5;
  text-decoration:none;
  word-break:keep-all;
  overflow-wrap:break-word;
}
#faq_wrap li h3 .tit_btn{
  position:static !important;
  width:40px !important;
  height:40px !important;
  border:1px solid var(--point-200) !important;
  border-radius:999px;
  background:#fff !important;
  color:var(--c-primary) !important;
}
#faq_wrap li h3.faq_li_open a{color:var(--c-primary);}
#faq_con .con_inner{
  position:relative;
  margin:0 0 20px 54px;
  padding:20px 52px 22px 24px !important;
  border-radius:16px;
  background:var(--point-50);
  color:#4f6078;
  line-height:1.8;
  word-break:keep-all;
  overflow-wrap:break-word;
}
#faq_con .con_inner .closer_btn{
  top:16px !important;
  right:16px !important;
  border:1px solid var(--point-200) !important;
  border-radius:999px;
  background:#fff !important;
}

@media (max-width:1200px){
  .me-gnb-ul{gap:8px;}
  .me-gnb-a{padding-left:12px;padding-right:12px;}
  .me-main > .me-process .me-steps{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .me-main > .me-process .me-step-chev{display:none !important;}
}

@media (max-width:900px){
  .me-logo-img{width:180px;max-width:48vw;}  /* 시안 모바일 값 */
  .me-sub-wrap #ctt_con .me-page-greeting .me-page-summary,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-summary{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:640px){
  .me-main > .me-process .me-steps{grid-template-columns:1fr !important;}
  .me-main > .me-process .me-step{
    align-items:flex-start;
    min-height:0;
    text-align:left;
  }
  .me-main > .me-process .me-step-name{min-height:0;font-size:17px;}
  .me-sub-wrap #ctt_con .me-page-greeting .me-page-summary li,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-summary li{
    min-height:0;
    padding:22px !important;
  }
  .me-sub-wrap #ctt_con .me-page-vision .me-page-summary li{
    grid-template-columns:54px minmax(0,1fr);
  }
  .me-sub-wrap #ctt_con .me-process{
    grid-template-columns:1fr !important;
  }
  .me-sub-wrap #bo_gall #gall_ul,
  .me-sub-wrap #bo_gall .gall_row{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
  .me-sub-wrap #bo_gall #gall_ul > li,
  .me-sub-wrap #bo_gall .gall_li{
    width:100% !important;
    max-width:none !important;
  }
  #faq_sch{padding:20px !important;}
  #faq_sch .frm_input{width:100% !important;}
  #faq_wrap li h3{
    grid-template-columns:34px minmax(0,1fr) 36px;
    gap:10px;
    min-height:64px;
  }
  #faq_wrap li h3 a{font-size:16px;}
  .me-board-faq-q{
    /* 자리는 36px 인데 「+」 동그라미는 40px 이라 오른쪽 4px 이 카드 모서리에 잘렸다 */
    grid-template-columns:34px minmax(0,1fr) 40px;
    gap:10px;
    min-height:66px;
  }
  .me-board-faq-title{font-size:16px;}
  .me-board-faq-a{
    margin-left:0;
    padding:18px;
  }
  #faq_con .con_inner{
    margin-left:0;
    padding:18px 46px 20px 18px !important;
  }
}

/* =========================================================
   [폴리시 패스] 서브 본문 거터 정렬 — 단일 출처(SoT)
   서브헤더(.me-subhead)·탭바(.me-subnav-wrap) 는 .me-main 안의 .me-wrap 거터를 쓴다.
   권위 거터(.me-main .me-wrap / plain .me-wrap): 769+ =40 / ≤768 =20 / ≤640 =18.
   본문(.me-wrap.me-sub-wrap) 을 동일 브레이크포인트로 맞춰 좌우 edge 정렬.
   (파일 하단 배치로 이전 sub-wrap 거터 override 보다 source-order 우선 보장) */
@media (max-width:768px){
  .me-wrap.me-sub-wrap{padding-left:20px;padding-right:20px;}
}
/* 거터 단계는 .me-wrap 기본값과 같은 구간을 쓴다 — 640 에서만 18 로 떨어지면
   같은 화면에서 본문 18 · 머리말 20 이 되어 왼쪽 시작점이 어긋난다. */
@media (max-width:480px){
  .me-wrap.me-sub-wrap{padding-left:18px;padding-right:18px;}
}

/* =========================================================
   [공유 피드백] 토스트 — 링크 복사 등 동작 피드백(접근성 role=status)
   딥블루(navy) 배경·흰 글자·라운드·그림자, z-index 매우 높게, pointer-events none.
   화면 하단중앙 고정, 페이드/슬라이드 인 → 자동 페이드 아웃(JS 에서 제거).
   ========================================================= */
.me-toast{
  position:fixed;
  left:50%;
  bottom:32px;
  transform:translateX(-50%) translateY(12px);
  z-index:2147483000;
  max-width:calc(100vw - 32px);
  padding:13px 22px;
  border-radius:12px;
  background:var(--c-navy);
  color:#fff;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:-.01em;
  box-shadow:0 14px 38px rgba(8,24,52,.32);
  white-space:nowrap;
  pointer-events:none;
  opacity:0;
  transition:opacity .22s ease,transform .22s ease;
}
.me-toast.is-show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}
.me-toast.me-toast-error{background:#b3261e;}
@media (max-width:480px){
  .me-toast{bottom:24px;font-size:14px;padding:12px 18px;white-space:normal;text-align:center;}
}
@media (prefers-reduced-motion:reduce){
  .me-toast{transition:opacity .22s ease;transform:translateX(-50%);}
  .me-toast.is-show{transform:translateX(-50%);}
}

/* =========================================================
   Main reference landing 2026-07
   참고자료/메타에듀시스 메인 시안을 테마 본문에 맞춘 메인 전용 스타일
   ========================================================= */
.me-main-ref{
  --me-blue:var(--point-ink);
  --me-navy:#0b3564;
  --me-ink:#1b2333;
  --me-muted:#667085;
  --me-line:var(--point-150);
  --me-soft:var(--point-50);
  --me-teal:var(--point);
  color:var(--me-ink);
  background:#fff;
  overflow:hidden;
}
/* 메인 화면만 컨테이너가 달랐다 — 폭 1440 에 좌우 여백 32, 게다가 히어로는
   padding 단축표기가 좌우를 0 으로 지워 안쪽 폭이 히어로 1440 · 섹션 1360 ·
   푸터 1400 으로 세 가지였고 왼쪽 시작점도 어긋났다. 한 상자로 맞춘다.
   바깥 1480 · 좌우 40 · 안쪽 1400 — 서브 화면·푸터가 쓰던 값이다. */
.me-main-ref .me-wrap{
  width:100%;
  max-width:1480px;
  margin:0 auto;
  box-sizing:border-box;
  /* 좌우 여백은 .me-wrap 기본값(40 → 768 이하 20 → 480 이하 18)을 그대로 쓴다.
     여기서 다시 지정하면 구간이 어긋나 좁은 화면에서 머리말·본문·푸터의
     왼쪽 시작점이 따로 논다. 실제로 768px 에서 0·20·24 세 가지였다. */
}
.me-main-ref a{text-decoration:none;}
.me-main-ref .me-eyebrow,
.me-main-ref .me-sec-kicker{
  margin:0 0 12px;
  color:var(--me-blue);
  font-size:13px;
  font-weight:800;
  line-height:1.35;
  letter-spacing:0;
}
/* 첫 화면 안에서는 어두운 사진 위에 놓이므로 시안과 같은 알약 모양으로 세운다. */
.me-main-ref .me-hero .me-eyebrow{
  display:inline-flex;
  align-items:center;
  margin-bottom:22px;
  padding:8px 15px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(8,24,54,.42);
  color:var(--point-100);
  letter-spacing:.06em;
}
.me-main-ref .me-hero{
  position:relative;
  min-height:760px;
  padding:0 0 110px;
  overflow:visible;
  /* 사진이 늦게 뜨는 동안 보이는 바탕. 시안과 같은 남색. */
  background:#0a1e42;
  color:#fff;
}
.me-main-ref .me-hero-bg{
  display:block !important;
  position:absolute;
  inset:0;
  opacity:0;
  background-repeat:no-repeat;
  background-position:center right;
  background-size:cover;
  transition:opacity .65s ease;
  will-change:opacity;
}
.me-main-ref .me-hero-bg.is-active{opacity:1;}
.me-main-ref .me-hero-bg:before{
  content:"";
  position:absolute;
  inset:0;
  /* 왼쪽은 짙게 덮어 흰 글씨를 세우고, 오른쪽 3분의 1은 열어 교실이 보이게 한다.
     사진이 어떤 것으로 바뀌어도 글자 쪽 밝기가 일정하다. */
  background:linear-gradient(100deg, rgba(7,21,48,.95) 0%, rgba(9,27,60,.92) 42%, rgba(24,98,95,.76) 62%, rgba(24,98,95,.26) 84%, rgba(24,98,95,0) 100%);
}
.me-main-ref .me-hero-inner{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  min-height:650px;
  /* 좌우는 .me-wrap 이 준다. 단축표기로 0 을 주면 히어로만 밖으로 튀어나온다. */
  padding-top:92px;
  padding-bottom:96px;    /* 겹침 카드를 빼냈으니 자리를 비워 둘 필요가 없다 */
}
.me-main-ref .me-hero-copy{max-width:960px;}
.me-main-ref .me-hero-title{
  max-width:960px;
  margin:0 0 26px;
  color:#fff;
  font-weight:800;
  line-height:1.12;
  letter-spacing:0;
  word-break:keep-all;
}
.me-main-ref .me-hero-title span{display:block;}
/* 글이 사진 위로 넘어가는 구간이 있다. 덮개만으로 부족한 밝은 벽·창문 위에서
   흰 글씨가 날아가지 않도록 어두운 그림자를 함께 준다. */
.me-main-ref .me-hero-title,
.me-main-ref .me-hero-sub{text-shadow:0 2px 20px rgba(4,14,34,.6), 0 0 34px rgba(4,14,34,.35);}
/* 191·192 줄에서 각 줄에 진한 색을 박아 둔다. 제목 전체를 흰색으로 바꿔도
   그 색이 이기므로 첫 화면 안에서는 여기서 다시 지정한다. */
.me-main-ref .me-hero-title .me-hero-l1,
.me-main-ref .me-hero-title .me-hero-l2{color:#fff;}
/* 시안(metaedusys.pages.dev)의 h1 은 두 줄이 같은 clamp(34px,4.4vw,58px) 이다.
   여기는 43 / 66 이라 둘째 줄만 튀어 글 덩어리가 커 보였다. 시안 값으로 통일. */
.me-main-ref .me-hero-title .me-hero-l1,
.me-main-ref .me-hero-title .me-hero-l2{font-size:clamp(34px,4.4vw,58px);}
.me-main-ref .me-hero-title .me-hero-l2{margin-top:6px;}
.me-main-ref .me-hero-title em{
  color:var(--point-100);
  font-style:normal;
}
.me-main-ref .me-hero-sub{
  margin:0 0 36px;
  color:var(--point-200);
  font-size:19px;      /* 시안과 동일 */
  font-weight:500;
  line-height:1.7;
  word-break:keep-all;
}
.me-main-ref .me-hero-sub strong{
  color:var(--point-100);
  font-weight:800;
}




.me-main-ref .me-hero-cta,
.me-main-ref .me-finalcta-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.me-main-ref .me-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:52px;
  padding:0 24px;
  border-radius:8px;
  border:1px solid transparent;
  font-size:16px;
  font-weight:800;
  line-height:1;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.me-main-ref .me-btn:hover{transform:translateY(-2px);}
.me-main-ref .me-btn-primary{
  background:var(--me-blue);
  color:#fff;
  box-shadow:0 18px 34px rgba(31,122,119,.22);
}
.me-main-ref .me-hero-cta .me-btn-primary{
  background:#fff;
  color:#0b2447;
  box-shadow:0 10px 30px rgba(0,0,0,.3);
}
.me-main-ref .me-hero-cta .me-btn-primary:hover{background:var(--point-100);}
.me-main-ref .me-btn-hero-line{
  background:rgba(8,24,54,.34);
  color:#fff;
  border-color:rgba(255,255,255,.5);
}
.me-main-ref .me-btn-hero-line:hover{background:rgba(255,255,255,.14);color:#fff;}
.me-main-ref .me-overlap{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0, 1.45fr) minmax(360px, .55fr);
  gap:22px;
  margin-top:0;   /* 히어로 밖으로 뺐다 — 끌어올릴 필요가 없다 */
}
.me-main-ref .me-shortcut,
.me-main-ref .me-kpi{
  border:1px solid var(--me-line);
  border-radius:8px;
  background:rgba(255,255,255,.96);
  box-shadow:0 20px 60px rgba(24,98,95,.13);
  backdrop-filter:blur(14px);
}
.me-main-ref .me-shortcut{padding:26px;}
.me-main-ref .me-shortcut-head{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:18px;
  padding-bottom:16px;
  border-bottom:1px solid var(--me-line);
}
.me-main-ref .me-shortcut-head strong{
  color:var(--me-navy);
  font-size:18px;
  font-weight:800;
}
.me-main-ref .me-shortcut-head span{
  color:var(--me-muted);
  font-size:14px;
}
.me-main-ref .me-shortcut-list{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.me-main-ref .me-shortcut-list a{
  display:flex;
  min-height:112px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:1px solid var(--point-150);
  border-radius:8px;
  background:#fff;
  color:#2f4057;
  font-size:15px;
  font-weight:800;
  line-height:1.3;
  text-align:center;
  word-break:keep-all;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.me-main-ref .me-shortcut-list a:hover{
  border-color:var(--point-400);
  background:var(--point-50);
  color:var(--me-blue);
  transform:translateY(-3px);
}
.me-main-ref .me-sc-ico{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:8px;
  background:var(--point-100);
  color:var(--me-blue);
}
.me-main-ref .me-kpi{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  padding:8px;
}
.me-main-ref .me-kpi-item{
  min-height:118px;
  padding:22px 16px;
  border-radius:8px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.me-main-ref .me-kpi-item:nth-child(odd){background:var(--point-50);}
/* 지표가 홀수라 2열에서 마지막 하나가 반 칸만 찬다. 한 줄을 다 쓰게 둔다. */
.me-main-ref .me-kpi-item:last-child:nth-child(odd){grid-column:1 / -1;}
.me-main-ref .me-kpi-item strong{
  color:var(--me-blue);
  font-size:clamp(24px,3.4vw,32px);
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.me-main-ref .me-kpi-item span{
  margin-top:9px;
  color:#56657a;
  font-size:14px;
  font-weight:700;
  line-height:1.45;
}
.me-main-ref .me-section{padding:100px 0;}
.me-main-ref .me-repsol{padding-top:150px;background:#fff;}
.me-main-ref .me-products{background:var(--me-soft);}
.me-main-ref .me-sec-head{
  max-width:1000px;
  margin:0 auto 42px;
  text-align:center;
}
.me-main-ref .me-sec-head.with-nav{
  max-width:none;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  text-align:left;
}
.me-main-ref .me-sec-head h2{
  margin:0;
  color:var(--me-ink);
  font-size:39px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:0;
  word-break:keep-all;
}
.me-main-ref .me-sec-head p:not(.me-sec-kicker){
  margin:14px 0 0;
  color:var(--me-muted);
  font-size:19px;
  line-height:1.65;
  word-break:keep-all;
}
.me-main-ref .me-text-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 18px;
  border:1px solid var(--point-200);
  border-radius:8px;
  background:#fff;
  color:var(--me-blue);
  font-size:15px;
  font-weight:800;
}
.me-main-ref .me-repsol-grid,
.me-main-ref .me-product-grid,
.me-main-ref .me-why-grid,
.me-main-ref .me-ref-grid{
  display:grid;
  gap:24px;
}
.me-main-ref .me-repsol-grid{grid-template-columns:repeat(3, minmax(0, 1fr));}
.me-main-ref .me-product-grid,
.me-main-ref .me-why-grid{grid-template-columns:repeat(4, minmax(0, 1fr));}
.me-main-ref .me-ref-grid{grid-template-columns:repeat(3, minmax(0, 1fr));}
.me-main-ref .me-repsol-card,
.me-main-ref .me-product-card,
.me-main-ref .me-ref-card,
.me-main-ref .me-why-card{
  min-width:0;
  border:1px solid var(--me-line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 12px 34px rgba(24,98,95,.07);
  overflow:hidden;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.me-main-ref .me-repsol-card:hover,
.me-main-ref .me-product-card:hover,
.me-main-ref .me-ref-card:hover,
.me-main-ref .me-why-card:hover{
  border-color:var(--point-300);
  box-shadow:0 22px 48px rgba(24,98,95,.12);
  transform:translateY(-4px);
}
.me-main-ref .me-repsol-card a,
.me-main-ref .me-product-card a,
.me-main-ref .me-ref-card a{
  display:flex;
  height:100%;
  flex-direction:column;
  color:inherit;
}
.me-main-ref .me-repsol-thumb,
.me-main-ref .me-product-thumb,
.me-main-ref .me-ref-thumb{
  position:relative;
  overflow:hidden;
  background:var(--point-100);
}
.me-main-ref .me-repsol-thumb{aspect-ratio:16/10;}
.me-main-ref .me-product-thumb{aspect-ratio:4/3;}
.me-main-ref .me-ref-thumb{aspect-ratio:16/10;}
.me-main-ref .me-card-img,
.me-main-ref .me-repsol-thumb img,
.me-main-ref .me-product-thumb img,
.me-main-ref .me-ref-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.me-main-ref .me-product-card:nth-child(4) .me-product-thumb img{
  object-fit:contain;
  padding:28px;
  background:var(--point-50);
}
.me-main-ref .me-repsol-body,
.me-main-ref .me-product-body,
.me-main-ref .me-ref-body{
  display:flex;
  flex:1;
  flex-direction:column;
  padding:26px;
}
.me-main-ref .me-repsol-body strong,
.me-main-ref .me-product-body span,
.me-main-ref .me-ref-body span{
  margin-bottom:11px;
  color:var(--me-blue);
  font-size:12px;
  font-weight:900;
  line-height:1.35;
}
.me-main-ref .me-repsol-body h3,
.me-main-ref .me-product-body h3,
.me-main-ref .me-ref-body h3,
.me-main-ref .me-why-card h3{
  margin:0;
  color:var(--me-navy);
  font-size:21px;
  font-weight:800;
  line-height:1.38;
  letter-spacing:0;
  word-break:keep-all;
}
.me-main-ref .me-repsol-body p,
.me-main-ref .me-product-body p,
.me-main-ref .me-ref-body p,
.me-main-ref .me-why-card p{
  margin:13px 0 0;
  color:var(--me-muted);
  font-size:15px;
  line-height:1.7;
  word-break:keep-all;
}
.me-main-ref .me-why{background:#fff;}
.me-main-ref .me-why-card{
  /* 260px 을 박아 두어 아이콘(42) + 여백(26) + 한 줄 제목(29) 만 든 칸이
     100px 넘게 비어 있었다. 칸끼리는 격자가 알아서 높이를 맞춘다. */
  min-height:0;
  padding:30px;
  overflow:visible;
}
.me-main-ref .me-why-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  margin-bottom:26px;
  border-radius:8px;
  background:var(--point-100);
  color:var(--me-blue);
  font-size:15px;
  font-weight:900;
}
.me-main-ref .me-ref{background:#fff;}
.me-main-ref .me-finalcta{
  padding:30px 0 110px;
  background:#fff;
}
.me-main-ref .me-finalcta-panel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:42px 48px;
  border-radius:8px;
  background:linear-gradient(135deg, var(--point-ink) 0%, var(--point-deep) 100%);
  color:#fff;
  box-shadow:0 24px 54px rgba(31,122,119,.22);
}
.me-main-ref .me-finalcta-panel > div:first-child{
  flex:1 1 520px;
  min-width:520px;
}
.me-main-ref .me-finalcta-panel .me-sec-kicker{color:var(--point-100);}
.me-main-ref .me-finalcta-panel h2{
  margin:0;
  color:#fff;
  font-size:32px;
  font-weight:800;
  line-height:1.35;
  letter-spacing:0;
  word-break:keep-all;
}
.me-main-ref .me-finalcta-panel p:not(.me-sec-kicker):not(.me-finalcta-tel){
  margin:12px 0 0;
  color:rgba(255,255,255,.82);
  font-size:16px;
  line-height:1.6;
}
.me-main-ref .me-finalcta-actions{
  flex:0 1 520px;
  justify-content:flex-end;
  min-width:330px;
  max-width:520px;
}
.me-main-ref .me-btn-white{
  background:#fff;
  color:var(--me-blue);
}
.me-main-ref .me-btn-line-white{
  background:transparent;
  border-color:rgba(255,255,255,.38);
  color:#fff;
}
.me-main-ref .me-finalcta-tel{
  width:100%;
  margin:2px 0 0;
  color:rgba(255,255,255,.78);
  font-size:14px;
  font-weight:700;
  text-align:right;
}
.me-main-ref .me-finalcta-tel a{
  color:#fff;
  font-size:18px;
  font-weight:900;
}
@media (max-width:1180px){
  .me-main-ref .me-hero-title .me-hero-l1{font-size:36px;}
  .me-main-ref .me-hero-title .me-hero-l2{font-size:54px;}
  .me-main-ref .me-overlap{grid-template-columns:1fr;}
  .me-main-ref .me-product-grid,
  .me-main-ref .me-why-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width:1024px){
  .me-main-ref .me-finalcta-panel{
    align-items:flex-start;
    flex-direction:column;
  }
  .me-main-ref .me-finalcta-panel > div:first-child,
  .me-main-ref .me-finalcta-actions{
    flex:0 1 auto;
    width:100%;
    min-width:0;
    max-width:none;
  }
  .me-main-ref .me-finalcta-actions{justify-content:flex-start;}
  .me-main-ref .me-finalcta-tel{text-align:left;}
}
@media (max-width:900px){
  .me-main-ref .me-hero{
    min-height:auto;
    padding-bottom:84px;
  }
  .me-main-ref .me-hero-bg{background-position:center right 34%;}
  /* 글이 화면 가운데로 오므로 가로 방향 그라데이션 대신 위아래로 덮는다. */
  .me-main-ref .me-hero-bg:before{
    background:linear-gradient(170deg, rgba(8,24,54,.94) 0%, rgba(10,30,66,.88) 52%, rgba(24,98,95,.72) 100%);
  }
  .me-main-ref .me-hero-inner{
    min-height:580px;
    /* 좌우는 .me-wrap 이 준다 — 단축표기로 0 을 주면 히어로만 밖으로 나간다. */
    padding-top:80px;
    padding-bottom:120px;
  }
  .me-main-ref .me-hero-copy{
    max-width:640px;
    margin:0 auto;
    text-align:center;
  }


  .me-main-ref .me-hero-cta{justify-content:center;}
  .me-main-ref .me-shortcut-list{grid-template-columns:repeat(3, minmax(0, 1fr));}
  .me-main-ref .me-kpi{grid-template-columns:repeat(3, minmax(0, 1fr));}
  .me-main-ref .me-kpi-item{min-height:108px;}
  .me-main-ref .me-repsol-grid,
  .me-main-ref .me-ref-grid{grid-template-columns:1fr;}
  .me-main-ref .me-sec-head.with-nav{
    align-items:flex-start;
    flex-direction:column;
  }
  .me-main-ref .me-finalcta-panel{
    align-items:flex-start;
    flex-direction:column;
  }
  .me-main-ref .me-finalcta-actions{
    justify-content:flex-start;
    min-width:0;
  }
  .me-main-ref .me-finalcta-tel{text-align:left;}
}
@media (max-width:640px){
  .me-main-ref .me-hero{padding-bottom:68px;}
  .me-main-ref .me-hero-inner{
    min-height:540px;
    padding-top:70px;
    padding-bottom:108px;
  }
  .me-main-ref .me-eyebrow{font-size:12px;}
  .me-main-ref .me-hero-title .me-hero-l1{font-size:28px;}
  .me-main-ref .me-hero-title .me-hero-l2{font-size:39px;}
  .me-main-ref .me-hero-sub{
    font-size:16px;
    line-height:1.7;
  }




  .me-main-ref .me-hero-sub br{display:none;}
  .me-main-ref .me-hero-cta .me-btn{
    width:100%;
    max-width:330px;
  }
  .me-main-ref .me-overlap{
    gap:16px;
    margin-top:-88px;
  }
  .me-main-ref .me-shortcut{padding:20px;}
  .me-main-ref .me-shortcut-head{
    display:block;
    margin-bottom:14px;
  }
  .me-main-ref .me-shortcut-head span{
    display:block;
    margin-top:5px;
  }
  .me-main-ref .me-shortcut-list{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .me-main-ref .me-shortcut-list a{
    min-height:104px;
    font-size:14px;
  }
  .me-main-ref .me-kpi{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .me-main-ref .me-kpi-item strong{font-size:clamp(21px,6.4vw,31px);}
  .me-main-ref .me-section{padding:72px 0;}
  .me-main-ref .me-repsol{padding-top:118px;}
  .me-main-ref .me-sec-head{margin-bottom:30px;}
  .me-main-ref .me-sec-head h2{font-size:30px;}
  .me-main-ref .me-sec-head p:not(.me-sec-kicker){font-size:16px;}
  .me-main-ref .me-product-grid,
  .me-main-ref .me-why-grid{grid-template-columns:1fr;}
  .me-main-ref .me-repsol-body,
  .me-main-ref .me-product-body,
  .me-main-ref .me-ref-body,
  .me-main-ref .me-why-card{padding:22px;}
  .me-main-ref .me-finalcta{padding-bottom:78px;}
  .me-main-ref .me-finalcta-panel{padding:30px 24px;}
  .me-main-ref .me-finalcta-panel h2{font-size:25px;}
  .me-main-ref .me-finalcta-actions,
  .me-main-ref .me-finalcta-actions .me-btn{width:100%;}
}
@media (prefers-reduced-motion:reduce){
  .me-main-ref .me-hero-bg{transition:none;}
}
@media (max-width:380px){
  .me-main-ref .me-hero-title .me-hero-l1{font-size:25px;}
  .me-main-ref .me-hero-title .me-hero-l2{font-size:33px;}
  .me-main-ref .me-shortcut-list{grid-template-columns:1fr;}
  .me-main-ref .me-kpi-item{padding:18px 12px;}
}

/* =========================================================
   Detail QA refinements 2026-07
   링크/긴 제목/서브 도구 버튼 브라우저 검증 후 보정
   ========================================================= */
.me-subhead-title{
  max-width:min(1240px, 100%) !important;
  font-size:clamp(34px, 3.25vw, 44px) !important;
  line-height:1.22 !important;
  letter-spacing:0 !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  text-wrap:balance;
}
.me-subnav-actions{
  background:transparent !important;
  border:0 !important;
  gap:8px !important;
  box-shadow:none !important;
}
.me-subnav-icon{
  width:46px !important;
  height:44px;
  min-height:44px !important;
  flex:0 0 46px;
  background:transparent !important;
  border:1px solid var(--point-300) !important;
  border-radius:8px !important;
}
.me-share-wrap{
  border-left:0 !important;
}
.me-subnav-icon:hover,
.me-share-toggle.is-active,
.me-share-toggle[aria-expanded="true"]{
  background:var(--point-100) !important;
}
@media (max-width:900px){
  .me-subhead-title{
    max-width:100% !important;
    font-size:clamp(28px, 5vw, 34px) !important;
  }
}
@media (max-width:640px){
  .me-subhead-title{
    font-size:clamp(24px, 7vw, 29px) !important;
    line-height:1.28 !important;
  }
  .me-subnav-actions{
    margin-left:0 !important;
  }
}

.me-sub-wrap #bo_v_title,
.me-sub-wrap #bo_v_title *,
.me-sub-wrap #bo_v_con,
.me-sub-wrap #bo_v_con *,
.me-sub-wrap .bo_v_tit,
.me-sub-wrap .bo_v_tit *,
.me-sub-wrap .bo_tit a,
.me-sub-wrap #sch_result,
.me-sub-wrap #sch_result *,
.me-sub-wrap .tbl_head01 td,
.me-sub-wrap .tbl_head01 td *{
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}

/* round18: Claude reference comparison - tighter content hero cards */
.me-sub-wrap .me-content-visual{
  margin-bottom:26px !important;
  border-radius:20px !important;
}
.me-sub-wrap #ctt_con .me-page-intro{
  align-items:start !important;
  gap:30px !important;
  margin-bottom:46px !important;
  padding:30px 34px !important;
  border:1px solid var(--point-200) !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 92% 12%,rgba(60,186,181,.12),transparent 28%),
    linear-gradient(135deg,var(--point-50) 0%,#fff 58%,var(--point-50) 100%) !important;
  box-shadow:0 18px 46px rgba(24,98,95,.06) !important;
}
.me-sub-wrap #ctt_con .me-page-summary li{
  min-height:108px !important;
  padding:18px 20px !important;
  background:rgba(255,255,255,.9) !important;
  box-shadow:0 10px 26px rgba(24,98,95,.05) !important;
}
.me-sub-wrap #ctt_con .me-page-summary b{
  font-size:26px !important;
}
@media (max-width:768px){
  .me-sub-wrap .me-content-visual{
    height:220px !important;
    margin-bottom:22px !important;
    border-radius:16px !important;
  }
  .me-sub-wrap #ctt_con .me-page-intro{
    margin-bottom:36px !important;
    padding:22px 18px !important;
    border-radius:18px !important;
  }
  .me-sub-wrap #ctt_con .me-page-summary li{
    min-height:0 !important;
    padding:16px 18px !important;
  }
}

/* =========================================================
   회사소개 콘텐츠 상세 그리드·카카오맵 2026-08
   ========================================================= */
.me-sub-wrap #ctt_con .me-location-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:24px;
  margin:28px 0 54px;
}
.me-sub-wrap #ctt_con .me-location-grid > .me-location-site{
  min-width:0;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-address{
  min-height:0;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-map{
  width:100%;
  margin-top:16px;
  overflow:hidden;
  border-radius:18px;
}
.me-sub-wrap #ctt_con .me-page-location .root_daum_roughmap{
  width:100% !important;
}
.me-sub-wrap #ctt_con .me-page-location .root_daum_roughmap .wrap_map{
  height:360px !important;
}
.me-sub-wrap #ctt_con .me-page-location .root_daum_roughmap .wrap_controllers{
  display:none;
}
@media (max-width:899px){
  .me-sub-wrap #ctt_con .me-location-grid{
    grid-template-columns:minmax(0, 1fr);
  }
}
@media (max-width:760px){
  .me-sub-wrap #ctt_con .me-page-location .root_daum_roughmap .wrap_map{
    height:260px !important;
  }
}

/* [오시는 길] 약도 자리. 지도 자체는 본문(co_content)의 카카오 컨테이너가 그린다.
   여기서 iframe 으로 한 벌 더 그리던 절을 뺐으므로 iframe·figcaption·그리드 규칙도
   함께 지웠다. 남은 것은 본문 래퍼의 여백뿐이다. */
.me-location-map{margin:0;}

/* [핵심역량] 특허증 갤러리 — 인증서는 세로로 길어 카드 폭을 따로 잡는다. */
.me-document-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.me-document-card{background:var(--c-bg-soft);border:1px solid var(--c-line);border-radius:16px;padding:16px;text-align:center;}
.me-document-card img{display:block;width:100%;height:auto;border-radius:10px;background:#fff;}
.me-document-caption{margin-top:12px;font-size:14px;line-height:1.5;color:var(--c-text-sub);}
.me-document-caption strong{display:block;color:var(--c-text);font-size:15px;}
@media (max-width:1080px){ .me-document-gallery{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .me-document-gallery{grid-template-columns:1fr;} }

/* [서브헤더] 제목 아래 한 줄 설명 — 페이지 성격을 첫 화면에서 알린다. */
.me-subhead-desc{margin:12px 0 0;max-width:760px;font-size:16px;line-height:1.6;color:rgba(255,255,255,.82);text-wrap:pretty;}
@media (max-width:760px){ .me-subhead-desc{font-size:14.5px;} }

/* [메인 PROCESS] 단계 카드 설명 — 제목이 단계 이름을 되풀이하지 않도록 카드에 내용을 준다. */
.me-step-desc{display:block;margin-top:8px;font-size:14px;line-height:1.6;color:var(--c-text-sub);text-wrap:pretty;}
@media (max-width:900px){ .me-step-desc{font-size:13.5px;} }

/* [접근성] 키보드 초점 표시 — 기존 규칙이 헤더·메인·푸터만 덮어
   서브헤더·서브내비·게시판 본문에서는 지금 어디에 있는지 알 수 없었다. */
#container a:focus-visible,
#container button:focus-visible,
#container input:focus-visible,
#container select:focus-visible,
#container textarea:focus-visible,
#top_btn:focus-visible,
#container [tabindex]:focus-visible{
  outline:2px solid var(--c-primary);
  outline-offset:2px;
  border-radius:4px;
}
.me-subhead a:focus-visible,
.me-subhead [tabindex]:focus-visible{
  outline:2px solid #fff;
  outline-offset:2px;
}

/* [인쇄] 서브헤더에 인쇄 버튼을 두면서 정작 인쇄 스타일이 없었다.
   학교 담당자가 검토용으로 뽑는 일이 잦아 본문만 남긴다. */
@media print{
  #me-hd, #me-ft, .me-subnav-wrap, #top_btn, #skip_to_container,
  .me-finalcta, .me-cta-actions, .me-benefits, .me-hero-cta, .me-share-wrap{ display:none !important; }
  /* 내용관리의 상담 안내도 종이에서 읽히게 하고, 웹 이동 단추는 뺀다. */
  .me-cta-panel{ background:none !important; box-shadow:none !important; break-inside:avoid; }
  .me-sub-wrap #ctt_con .me-cta-panel h2,
  .me-sub-wrap #ctt_con .me-cta-panel p{ color:#000 !important; text-shadow:none !important; }
  html, body{ background:#fff !important; color:#000 !important; }
  .me-subhead{
    background:none !important; color:#000 !important;
    padding:0 0 12px !important; min-height:0 !important;
    border-bottom:1px solid #999;
  }
  .me-subhead::before, .me-subhead::after{ display:none !important; }
  .me-subhead-title{ color:#000 !important; font-size:22pt !important; }
  .me-subhead-desc{ color:#333 !important; font-size:11pt !important; }
  /* 화면용 글자 그림자가 종이에는 회색 번짐으로 찍히고, PDF 글자추출에서 제목이 두 번 나온다 */
  .me-subhead *{ text-shadow:none !important; }
  /* 현재 위치 표시는 자식 요소에 색이 따로 걸려 있어 부모만 고치면 연회색이 남는다 */
  .me-crumb, .me-crumb a, .me-crumb .me-crumb-sep{ color:#555 !important; }
  .me-crumb .me-crumb-cur{ color:#000 !important; }
  /* 게시판 목록은 좁은 화면 규칙이 걸려 번호·글쓴이·조회 열이 빠진 채 인쇄됐다 */
  .me-sub-wrap .tbl_head01 table{ display:table !important; width:100% !important; }
  .me-sub-wrap .tbl_head01 thead{ display:table-header-group !important; }
  .me-sub-wrap .tbl_head01 thead th{ display:table-cell !important; }
  .me-sub-wrap .tbl_head01 tbody tr{ display:table-row !important; }
  .me-sub-wrap .tbl_head01 tbody td{ display:table-cell !important; }
  .me-wrap{ max-width:none !important; padding:0 !important; }
  .me-section{ padding:12pt 0 !important; }
  a{ color:#000 !important; text-decoration:none !important; }
  img{ max-width:100% !important; page-break-inside:avoid; }.me-feature-card,
.me-document-card,
.me-step,
.me-ref-card,
table,
figure{ page-break-inside:avoid; }
  h1, h2, h3{ page-break-after:avoid; }
  /* 배경 그라데이션은 잉크만 먹는다 */
  [class*="me-"]{ background-image:none !important; }

  /* FAQ 답변은 접혀 있다(hidden). 인쇄하면 질문 15개만 찍히고 답이 하나도
     안 나왔다. 서브헤더에 인쇄 단추가 있어 의도된 경로다. 답을 펼친다.
     항목 필터로 감춘 질문(.me-board-faq-item[hidden])은 사용자가 고른
     결과이므로 건드리지 않는다. */
  .me-board-faq-a[hidden]{ display:block !important; }.me-board-faq-a{ page-break-inside:avoid; }
  .me-board-faq-q i, .me-board-faq-q svg{ display:none !important; }/* 인쇄에서 옅은 회색은 거의 안 찍힌다. 본문에 해당하는 글은 검게. */
  .me-hero-title,
.me-hero-title span,
.me-hero-sub,

  .me-hero-title, .me-subhead-title{ text-shadow:none !important; }

.me-eyebrow{
    color:#333 !important; border-color:#999 !important; background:none !important;
  }
  /* 화면에서만 쓰는 조작 단추는 종이에 남길 이유가 없다 */
  .me-subnav-icon, .me-share-toggle, .me-share-menu,
  #bo_list .bo_fx, #bo_v_top, #bo_v_bot, .btn_bo_user, .btn_bo_adm,
  .bo_sch_wrap, .btn_bo_sch, #bo_sch, .bo_v_com{ display:none !important; }
  /* 이전글·다음글은 종이에서도 맥락이 되므로 목록은 남기고 그 안의 단추만 지운다 */
  .bo_v_nb .btn_b01, .bo_v_nb button{ display:none !important; }
}

/* [404] 없는 주소 안내 */
.me-page-error{padding:70px 0 90px;}
.me-error-box{max-width:720px;margin:0 auto;text-align:center;}
.me-error-code{font-size:76px;font-weight:900;line-height:1;color:var(--c-primary);letter-spacing:-.04em;margin:0;}
.me-error-title{margin:18px 0 0;font-size:26px;font-weight:800;letter-spacing:-.02em;}
.me-error-desc{margin:14px 0 0;font-size:16px;line-height:1.7;color:var(--c-text-sub);}
.me-error-actions{display:flex;justify-content:center;gap:12px;margin-top:30px;flex-wrap:wrap;}
.me-error-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 22px;margin:34px 0 0;padding:22px 0 0;border-top:1px solid var(--c-line);list-style:none;}
.me-error-links a{font-size:15px;font-weight:700;color:var(--c-text-sub);text-decoration:none;}
.me-error-links a:hover{color:var(--c-primary);}
@media (max-width:640px){ .me-error-code{font-size:58px;} .me-error-title{font-size:21px;} }

/* width/height 를 넣으면 브라우저가 자리를 미리 잡는 대신 그 크기로 그리려 한다.
   레이아웃은 CSS 가 정하도록 되돌린다. */
#container img[width][height]{ max-width:100%; height:auto; }

/* [회사소개] 시안에만 있던 지표·기준·원스톱 블록 */
.me-stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none;}
.me-stat-row li{padding:24px 20px;background:var(--c-bg-soft);border:1px solid var(--c-line);border-radius:16px;text-align:center;}
.me-stat-row strong{display:block;font-size:clamp(26px,3vw,34px);font-weight:900;color:var(--c-primary);line-height:1;letter-spacing:-.02em;}
.me-stat-row span{display:block;margin-top:10px;font-size:14px;line-height:1.55;color:var(--c-text-sub);text-wrap:pretty;}

.me-feature-desc{margin:8px 0 12px;font-size:14.5px;line-height:1.6;color:var(--c-text-sub);text-wrap:pretty;}

.me-onestop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none;counter-reset:none;}
.me-onestop-grid li{padding:24px 20px;background:var(--c-bg-soft);border:1px solid var(--c-line);border-radius:16px;}
/* --c-accent 는 정의된 적이 없어 늘 예비값인 원색 민트로 떨어졌다.
   13px 글자에는 대비가 모자라므로 글자용 민트를 쓴다. */
.me-onestop-step{display:block;font-size:13px;font-weight:800;letter-spacing:.08em;color:var(--c-mint-text);}
.me-onestop-grid strong{display:block;margin:10px 0 8px;font-size:17px;font-weight:800;letter-spacing:-.02em;}
.me-onestop-grid p{margin:0;font-size:14px;line-height:1.6;color:var(--c-text-sub);text-wrap:pretty;}

@media (max-width:900px){
  .me-stat-row{grid-template-columns:1fr;}
  .me-onestop-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:560px){ .me-onestop-grid{grid-template-columns:1fr;} }




@media (max-width:640px){



}

/* [연혁] 현장 기록 사진 */
.me-photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.me-photo-grid figure{margin:0;}
.me-photo-grid img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--c-line);}
@media (max-width:900px){ .me-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .me-photo-grid{grid-template-columns:1fr;} }

/* [푸터] 전자상거래법 표시 항목 */
/* 푸터는 밝은 회색 바탕이다. 흰 글씨로 넣어 두어 화면에서 사라져 있었다.
   주소 줄과 같은 색을 쓴다. */
.me-ft-biz{margin:10px 0 0;font-size:13px;line-height:1.7;color:#b9c5d7;}

/* [상담 폼] 함정 입력칸 — 화면 밖으로 보낸다.
   display:none 은 일부 봇이 걸러내므로 위치로 숨겨 실제 입력칸처럼 보이게 둔다. */
.me-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}

/* [터치 영역] 푸터 약관 링크와 위치 표시 링크가 17~18px 높이였다.
   폰에서 손가락으로 정확히 누르기 어렵다. 글자 크기는 그대로 두고
   위아래 여백만 늘려 24px 이상으로 만든다. */
.me-ft-links a{display:inline-block;padding:5px 2px;}
.me-crumb a{display:inline-block;padding:4px 2px;}
/* 전화번호는 폰에서 누르면 바로 걸린다. 문장 안에 있어도 누를 자리는 넉넉해야 한다. */
a[href^="tel:"]{display:inline-block;padding:4px 3px;}
/* 표 안의 링크도 같은 이유로 누를 자리를 넓힌다. */
.me-info-table td a{display:inline-block;padding:4px 2px;}

/* [게시판] 그누보드 기본 스킨에서 넘어온 색 두 가지가 대비 기준에 못 미친다.
   스킨 파일은 그누보드 갱신 때 덮일 수 있어 테마 쪽에서 잡는다.
   다만 스킨 style.css 가 이 파일보다 나중에 실리므로 같은 무게로는 진다.
   .me-sub-wrap 을 앞에 붙여 한 단계 올린다. */
/* 카테고리 선택 표시 — 흰 글씨에 #3a8afd 는 3.4:1. 테마 파랑은 5.2:1. */
.me-sub-wrap #bo_cate #bo_cate_on{background:var(--c-primary);border-color:var(--c-primary);}
/* 목록·본문의 날짜·조회수 — #777 은 4.48:1 로 기준(4.5)에 아슬하게 못 미친다. */
.me-sub-wrap #bo_gall .gall_info .gall_date,
.me-sub-wrap #bo_v_info .if_date,
.me-sub-wrap .bo_vc_hdinfo{color:#6b7280;}

/* [검색 결과] 검색어 강조가 그누보드 기본 핫핑크(#ff005a)다.
   흰 글씨를 얹어도 3.9:1 이라 기준(4.5)에 못 미치고, 사이트 색과도 맞지 않는다.
   연노랑 바탕에 진한 글씨로 바꾼다(12.8:1). 형광펜처럼 읽혀 목적에도 맞다. */
.me-sub-wrap .sch_word,
.me-sub-wrap b.sch_word{background:#FDE68A;color:#1A2233;border-radius:3px;}
/* 결과 항목의 게시판 이름·날짜 — #777 은 4.48:1 로 아슬하게 못 미친다.
   스킨의 .sch_res_list .sch_info 와 무게가 같아 지므로 한 단계 올린다. */
.me-sub-wrap .sch_res_list .sch_info,
.me-sub-wrap .sch_res_title{color:#6b7280;}
/* 검색어를 되짚어 주는 제목의 강조도 같은 핫핑크였다(3.6:1). */
.me-sub-wrap #sch_res_ov h2 strong{color:var(--c-primary);}

/* [오시는 길] 카카오 약도 두 개가 서로 다르게 심어져 있어, 서울 쪽에만
   주소·전화 패널(.cont)이 붙어 카드 높이가 어긋났다. 그 패널의 주소는 바로 위
   카드에 이미 있고 전화는 빈칸('-')으로 나온다. 지도만 남긴다. */
.me-location-map .root_daum_roughmap .cont{display:none !important;}
.me-location-map .root_daum_roughmap{width:100% !important;height:auto;}

/* [검색] 결과가 없을 때 '없습니다' 한 줄로 끝나 막다른 길이었다.
   가격처럼 사이트에 값이 없는 것을 찾는 경우가 많아 다음 행선지를 준다. */
.me-sub-wrap .me-sch-empty{padding:44px 28px;border:1px solid var(--c-line);border-radius:16px;background:var(--c-bg-soft);text-align:center;}
.me-sub-wrap .me-sch-empty-title{margin:0;font-size:19px;font-weight:800;color:var(--c-navy);}
.me-sub-wrap .me-sch-empty-desc{margin:10px 0 0;font-size:15.5px;line-height:1.7;color:var(--c-text-sub);text-wrap:pretty;}
.me-sub-wrap .me-sch-empty-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 0;padding:0;list-style:none;}
.me-sub-wrap .me-sch-empty-links a{display:inline-block;padding:10px 16px;border:1px solid var(--c-primary);border-radius:10px;background:#fff;color:var(--c-primary);font-size:15px;font-weight:700;text-decoration:none;}
.me-sub-wrap .me-sch-empty-links a:hover{background:var(--c-primary);color:#fff;}
.me-sub-wrap .me-sch-empty-tel{margin:20px 0 0;font-size:15px;color:var(--c-text-sub);}
.me-sub-wrap .me-sch-empty-tel a{font-weight:800;color:var(--c-navy);}

/* [검색] 두 글자 미만으로 눌렀을 때 칸 아래에 뜨는 안내. 예전에는 alert 창이었다. */
.me-sub-wrap #sch_res_detail .me-sch-msg{
  flex:1 1 100%;
  margin:8px 0 0;
  font-size:14px;
  font-weight:700;
  color:#b42318;
}

/* [검색] 검색어가 잘렸을 때 결과 위에 붙는 안내. */
.me-sub-wrap .me-sch-note{
  margin:0 0 16px;
  padding:12px 16px;
  border-radius:10px;
  background:var(--point-100);
  border:1px solid var(--point-300);
  font-size:14px;
  color:#334155;
}
.me-sub-wrap .me-sch-note strong{color:var(--point-ink);}

/* [푸터] 네이버 블로그 링크. 사업자 정보 아래에 한 줄로 붙는다. */
#me-ft .me-ft-blogs{
  list-style:none;
  margin:14px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
}
/* 시안 바닥글은 짙은 남색이라 링크가 #cfe0ff(연한 하늘색)다. 그 값을 그대로
   옮겨 왔는데 여기 바닥글은 밝은 바탕이라 글씨가 거의 안 보였다.
   바닥글의 다른 링크와 같은 색을 쓰고, 밑줄로 링크임을 남긴다. */
#me-ft .me-ft-blogs a{
  display:inline-block;
  padding:5px 0;
  font-size:13.5px;
  font-weight:700;
  color:var(--c-primary);
  text-decoration:none;
  border-bottom:1px solid rgba(31,122,119,.35);
}
#me-ft .me-ft-blogs a:hover,
#me-ft .me-ft-blogs a:focus-visible{color:var(--c-navy);border-bottom-color:var(--c-navy);}

/* [구매 안내] 조달 등록 상품 표. 상품이 아홉 개라 폰에서는 가로로 넘치므로
   표만 따로 가로 스크롤한다 — 페이지 전체가 옆으로 밀리면 안 된다. */
.me-sub-wrap .me-procure-scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--c-line, #e2e8f2);
  border-radius:14px;
  background:#fff;
}
.me-sub-wrap .me-procure-table{
  width:100%;
  min-width:520px;
  border-collapse:collapse;
  font-size:15px;
}
.me-sub-wrap .me-procure-table th,
.me-sub-wrap .me-procure-table td{
  padding:14px 18px;
  text-align:left;
  border-bottom:1px solid #eef2f8;
  vertical-align:middle;
}
.me-sub-wrap .me-procure-table thead th{
  background:var(--point-50);
  font-size:13px;
  font-weight:800;
  letter-spacing:.02em;
  color:#5b6b85;
  white-space:nowrap;
}
.me-sub-wrap .me-procure-table tbody th{
  font-weight:700;
  color:#16213a;
  line-height:1.5;
}
.me-sub-wrap .me-procure-table tbody tr:last-child th,
.me-sub-wrap .me-procure-table tbody tr:last-child td{border-bottom:0;}
.me-sub-wrap a.me-procure-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:8px 16px;
  border-radius:999px;
  background:var(--point-ink);
  color:#fff;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
}
.me-sub-wrap a.me-procure-btn:hover,
.me-sub-wrap a.me-procure-btn:focus-visible{background:var(--point-ink);color:#fff;}
.me-sub-wrap .me-procure-none{font-size:14px;color:#5b6b85;}
.me-sub-wrap .me-procure-note{margin-top:16px;font-size:14.5px;color:#5b6b85;}
@media (max-width:640px){
  .me-sub-wrap .me-procure-table th,
  .me-sub-wrap .me-procure-table td{padding:12px 14px;}
}

/* [구매 안내] 구매 검토 자료 목록. */
.me-sub-wrap .me-docs-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.me-sub-wrap .me-docs-list li{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:18px 22px;background:#fff;border:1px solid #e2e8f2;border-radius:14px;
}
.me-sub-wrap .me-docs-list b{display:block;font-size:16px;font-weight:800;color:#16213a;}
.me-sub-wrap .me-docs-list span{display:block;margin-top:4px;font-size:14.5px;color:#5b6b85;line-height:1.65;}
.me-sub-wrap .me-docs-btn{
  flex:0 0 auto;padding:10px 18px;border-radius:999px;background:var(--point-100);color:var(--point-ink);
  font-size:14px;font-weight:800;text-decoration:none;white-space:nowrap;
}
.me-sub-wrap .me-docs-btn:hover,.me-sub-wrap .me-docs-btn:focus-visible{background:var(--point-ink);color:#fff;}
@media (max-width:640px){
  .me-sub-wrap .me-docs-list li{flex-direction:column;align-items:flex-start;gap:12px;}
  .me-sub-wrap .me-docs-btn{align-self:stretch;text-align:center;}
}

/* ── 교사 인증 (고객 회신 E-3) ─────────────────────────────────
   신청 화면과 자료실 문지기 화면이 함께 쓴다. 상담 폼과 같은 입력 스타일을
   그대로 쓰고, 여기서는 없던 것만 더한다. */
.me-cert-steps{
  list-style:none;margin:0 0 28px;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
}
.me-cert-steps li{
  background:#fff;border:1px solid #e2e8f2;border-radius:14px;padding:16px 18px;
}
.me-cert-steps b{display:block;font-size:15px;font-weight:800;color:var(--point-ink);}
.me-cert-steps span{display:block;margin-top:6px;font-size:14px;color:#5b6b85;line-height:1.6;}
@media (max-width:760px){ .me-cert-steps{grid-template-columns:1fr;} }

.me-cert-guest{
  background:#fff;border:1px solid #e2e8f2;border-radius:18px;padding:32px 34px;
  display:flex;flex-direction:column;gap:14px;
}
.me-cert-guest h2{margin:0;font-size:22px;font-weight:800;color:#16213a;}
.me-cert-guest p{margin:0;font-size:15.5px;color:#48587a;line-height:1.8;}
.me-cert-guest .me-cert-steps{margin:8px 0 4px;}
.me-cert-guest-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.me-cert-guest-note{font-size:14px;color:#6b7a95;}
@media (max-width:640px){
  .me-cert-guest{padding:24px 20px;}
  .me-cert-guest-actions .me-btn{flex:1 1 100%;text-align:center;}
}

/* 파일 선택 칸. 브라우저 기본 모양이 다른 입력칸과 따로 놀아 테두리만 맞춘다. */
.me-fld input[type=file]{
  padding:12px 14px;background:#fff;border:1px solid #d7e0ee;border-radius:12px;
  font-size:14.5px;color:#33425e;
}
.me-fld input[type=file]::file-selector-button{
  margin-right:12px;padding:8px 14px;border:0;border-radius:999px;
  background:var(--point-100);color:var(--point-ink);font-weight:800;font-size:14px;cursor:pointer;
}
.me-fld input[type=file]::file-selector-button:hover{background:var(--point-ink);color:#fff;}
.me-fld-help{margin:0;font-size:13.5px;color:#6b7a95;line-height:1.7;}

/* [교사 자료실] 제목만 보이는 이유를 목록 위에 적는다. */
.me-sub-wrap .me-board-gate{
  display:flex;flex-direction:column;gap:6px;
  margin:0 0 20px;padding:16px 20px;
  background:var(--point-100);border:1px solid var(--point-300);border-radius:12px;
}
.me-sub-wrap .me-board-gate b{font-size:15px;font-weight:800;color:#16213a;}
.me-sub-wrap .me-board-gate span{font-size:14.5px;color:#48587a;line-height:1.75;}
.me-sub-wrap .me-board-gate a{color:var(--point-ink);font-weight:700;}


/* 연혁·핵심역량은 시안처럼 본문 첫머리에 상자를 두지 않는다.
   제목을 서브헤더와 겹쳐 두 번 쓰던 것을 읽기 전용으로 돌리고 나니
   눈에는 「HISTORY」 한 줄만 든 111px 짜리 빈 상자가 남았다.
   상자를 접되 h2 는 문서 구조로 남겨 둔다(display:none 이면 낭독기에서도 사라진다).
   원래 규칙이 #ctt_con 을 끼고 있어 아이디 우선순위다 — 같은 무게로 적는다. */
.me-sub-wrap #ctt_con .me-page-history > .me-page-intro,
.me-sub-wrap #ctt_con .me-page-competency > .me-page-intro{
  /* 앞선 규칙들이 !important 로 여백을 박아 두어 같은 무게로 적어야 이긴다. */
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
  min-height:0 !important;
}
.me-sub-wrap #ctt_con .me-page-history > .me-page-intro .me-page-kicker,
.me-sub-wrap #ctt_con .me-page-competency > .me-page-intro .me-page-kicker{display:none;}


/* 솔루션 상세 — 구성품 목록 옆에 사진. 시안(솔루션상세.dc.html)이 556x417 로
   두는 자리다. 그누보드 쪽에는 사진이 아예 없어 글만 이어졌다. */
/* 구성품 목록은 시안처럼 본문 전체 폭에 2열 gap 12 로 편다. 사진은 인트로로 옮겼다. */
.me-parts-wrap{display:block;}
.me-parts-wrap > .me-parts-list{margin:0;}


/* 제품·콘텐츠 카드의 사진. 시안은 카드 맨 위에 정사각에 가깝게 잘라 넣는다.
   본문(co_content)에 넣은 <img> 라 <picture> 는 못 쓴다 — 그누보드 출력 필터가
   picture·source 를 지운다. 그래서 jpg 한 장으로 두고 크기만 여기서 잡는다. */
.me-sub-wrap #ctt_con .me-feature-card.me-card-pic{
  padding-top:0 !important;
  overflow:hidden;
}
/* 스킨이 필터를 거친 뒤 <img> 를 <picture> 로 감싸므로 자식 선택자로는 못 닿는다. */
.me-sub-wrap #ctt_con .me-feature-card.me-card-pic > picture{
  display:block;
  width:calc(100% + 48px);
  margin:0 -24px 20px;
}
.me-sub-wrap #ctt_con .me-feature-card.me-card-pic img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:cover;
}
/* 섹션 머리 위에 한 장 (제품 안내).
   <figure> 는 그누보드 출력 필터가 지워 버려서 클래스를 <img> 에 직접 건다. */
.me-sub-wrap #ctt_con img.me-section-pic{
  display:block;
  width:100%;
  height:auto;
  margin:0 0 28px;
  aspect-ratio:16 / 5;   /* 띠가 너무 높지 않게 */
  object-fit:cover;
  border-radius:18px;
  box-shadow:0 16px 38px rgba(24,98,95,.10);
}


/* 상담 신청 — 시안처럼 양식 옆에 진행 순서를 둔다. */
.me-consult-steps{
  margin:36px 0 0;
  padding:26px 28px;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:var(--point-50);
}
.me-consult-steps h3{
  margin:0 0 16px;
  font-size:18px;
  font-weight:800;
  color:var(--c-navy);
}
.me-consult-steps ol{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:none;
}
.me-consult-steps li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:14.5px;
  line-height:1.55;
  color:#46566f;
  word-break:keep-all;
}
.me-consult-steps li span{
  flex:0 0 26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--c-primary);
  color:#fff;
  font-size:13px;
  font-weight:800;
}
@media (max-width:900px){
  .me-consult-steps ol{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:520px){
  .me-consult-steps ol{grid-template-columns:1fr;}
}


/* 바로가기 띠 — 히어로 밖으로 뺀 뒤 남은 정렬 문제.
   지표 카드가 2x2 로 289px 이 되고 stretch 로 붙은 왼쪽 카드까지 같이 289px 이 되어,
   112px 짜리 아이콘 다섯 개가 빈 자리 한가운데 뜬 채로 놓였다.
   지표 항목을 낮춰 두 카드 모두 230px 안쪽으로 맞춘다. */
.me-main-ref .me-kpi-item{
  min-height:96px;
  padding:16px 14px;
}
.me-main-ref .me-shortcut{
  align-items:stretch;
}
.me-main-ref .me-shortcut-head{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.me-main-ref .me-shortcut-list a{
  min-height:0;
  height:100%;
  padding:16px 8px;
}


/* ── 게시판 목록의 시각 언어를 시안에 맞춘다 ─────────────────────────
   여기서는 글마다 테두리·둥근모서리·그림자를 준 카드로 그리고 있었다.
   시안(공지사항.dc.html)은 표에 가깝다 — 아래쪽 실선 한 줄, 63px 높이,
   번호 90 / 제목 1fr / 글쓴이 120 / 날짜 140 / 조회 90.
   실제 잰 값: 행 1352x63, 아래선 #eef2f8, 제목 16px, 메타 14px #5a6b85. */
@media (min-width:769px){
  .me-sub-wrap #bo_list .tbl_head01 tbody tr{
    grid-template-columns:90px minmax(0,1fr) 120px 140px 90px;
    gap:0 12px;
    min-height:63px;
    margin:0;
    padding:12px 4px;
    border:0;
    border-bottom:1px solid #eef2f8;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody tr:hover{
    transform:none;
    border-color:#eef2f8;
    background:var(--point-50);
    box-shadow:none;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num2{
    display:block;
    grid-column:1;
    color:#5a6b85;
    font-size:14px;
    text-align:center;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num2 .notice_icon{
    display:inline-block;
    padding:3px 10px;
    border-radius:999px;
    background:var(--point-100);
    color:var(--point-ink);
    font-size:12.5px;
    font-weight:800;
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_subject{
    grid-column:2;
    grid-row:auto;      /* 두 줄 차지하던 것을 한 줄로 */
  }
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_name,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_num,
  .me-sub-wrap #bo_list .tbl_head01 tbody td.td_datetime{
    color:#5a6b85;
    font-size:14px;
    text-align:center;
    white-space:nowrap;   /* 「2026.06.01」이 두 줄로 접히던 것 */
  }
  .me-sub-wrap #bo_list .bo_tit a{
    font-size:16px;
    font-weight:700;
  }
}
/* 페이지 넘김 — 시안은 42x42, 모서리 10, 흰 바탕에 #e0e6f0 실선 */
.me-sub-wrap .pg_wrap .pg_page,
.me-sub-wrap .pg_wrap .pg_current,
.me-sub-wrap .pg_wrap strong.pg_current{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:42px;
  margin:0 3px;
  padding:0 12px;
  border:1px solid #e0e6f0;
  border-radius:10px;
  background:#fff;
  color:#5a6b85;
  font-size:14.5px;
  font-weight:700;
  line-height:1;
}
.me-sub-wrap .pg_wrap .pg_current{
  border-color:var(--c-primary) !important;   /* 앞선 규칙이 흰 바탕을 !important 로 박아 둔다 */
  background:var(--c-primary) !important;
  color:#fff !important;
}


/* 구축 사례 갤러리 — 시안(게시판목록.dc.html)의 카드와 값을 맞춘다.
   실제 잰 값: 카드 436x461, 실선 1px #e7ecf5, 모서리 18, 그림자 없음, 칸 사이 22.
   여기는 실선 #dfe7f3 에 그림자가 있었고 칸 사이가 24 였다.
   카드 왼쪽 위에 글 번호가 그대로 찍히던 것도 시안에는 없다. */
/* 칸 사이는 앞에서 아이디 두 개(#bo_gall #gall_ul)로 잡아 두어 같은 무게로 적는다. */
.me-sub-wrap #bo_gall #gall_ul.gall_row{gap:22px !important;}
.me-sub-wrap #bo_gall .gall_box{
  border-color:#e7ecf5;
  box-shadow:none !important;   /* 앞선 규칙들이 그림자를 세 번 겹쳐 놓았다 */
}
.me-sub-wrap #bo_gall .gall_li:hover .gall_box{
  box-shadow:0 10px 26px rgba(24,98,95,.10) !important;
}


/* 자주 묻는 질문 — 시안(FAQ.dc.html)의 문항은 실선 1px #e7ecf5 · 모서리 14 ·
   바탕 #f8faff 를 두른 칸이다. 여기서는 흰 바탕에 선 하나 없이 붙어 있었다. */
.me-sub-wrap #me-board-faq > ol{
  display:grid;
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}
.me-sub-wrap #me-board-faq > ol > li{
  border:1px solid #e7ecf5;
  border-radius:14px;
  background:var(--point-50);
  overflow:hidden;
}
.me-sub-wrap #me-board-faq > ol > li:hover{
  border-color:var(--point-300);
}
.me-sub-wrap #me-board-faq .me-board-faq-q{
  background:transparent;
}


/* 글 상세 — 제목을 서브헤더로 올렸으니 본문 안의 같은 제목은 낭독기용으로만 둔다.
   시안(게시글상세.dc.html)도 큰 제목 하나만 두고 본문에서 되풀이하지 않는다. */
.me-sub-wrap #bo_v #bo_v_title{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

/* 글 제목은 쪽 이름보다 길다. 시안도 상세 화면만 38px 로 낮춰 쓴다. */
.me-subhead.is-view .me-subhead-title{font-size:38px !important;line-height:1.24 !important;}


/* 게시판 검색칸 — 평소에는 접혀 있어 눈에 안 띄지만, 펼쳤을 때 값이 시안과 달랐다.
   시안(공지사항.dc.html): 감싸개 47px·모서리 10·실선 #d5deec, 입력 39px·글자 14.5px.
   여기는 모서리가 5·10·0 으로 섞여 있고 실선 색도 세 가지였다. */
.me-sub-wrap #bo_sch select,
.me-sub-wrap #bo_sch input[type="text"],
.me-sub-wrap #bo_sch input[type="search"]{
  height:47px !important;
  border:1px solid #d5deec !important;
  border-radius:10px !important;
  font-size:14.5px !important;
}
.me-sub-wrap #bo_sch button,
.me-sub-wrap #bo_sch input[type="submit"]{
  height:47px !important;
  border-radius:10px !important;
  font-size:14.5px !important;
}


/* 상담 신청 「관심 솔루션」 — 시안처럼 여럿 고르는 칩.
   실측: 칩 높이 44px · 안쪽 10/15 · 실선 #d5deec · 모서리 10 · 글자 14 · 사이 8. */
.me-consult-form .me-fld-checks{
  grid-column:1 / -1;
  display:block;      /* .me-fld 의 flex 를 물려받으면 제목과 칩이 한 줄로 붙는다 */
  margin:0;
  padding:0;
  border:0;
}
.me-consult-form .me-fld-legend{
  display:block;
  margin:0 0 10px;
  font-size:14.5px;
  font-weight:700;
  color:var(--c-navy);
}
.me-consult-form .me-fld-hint{
  margin-left:6px;
  color:var(--c-text-sub);
  font-size:13px;
  font-weight:500;
}
.me-consult-form .me-check-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.me-consult-form .me-check{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:44px;
  padding:10px 15px;
  border:1px solid #d5deec;
  border-radius:10px;
  background:#fff;
  font-size:14px;
  cursor:pointer;
  transition:border-color .15s, background .15s, color .15s;
}
.me-consult-form .me-check:hover{border-color:var(--point-500);}
.me-consult-form .me-check input{margin:0;accent-color:var(--c-primary);}
.me-consult-form .me-check:has(input:checked){
  border-color:var(--c-primary);
  background:var(--point-100);
  color:var(--c-primary);
  font-weight:700;
}
.me-consult-form .me-check:focus-within{
  outline:2px solid var(--c-primary);
  outline-offset:2px;
}


/* 바로가기 띠 마무리 — 눈으로 보고 남은 두 가지.
   ① 「바로가기 메뉴」 아래에 옛 규칙의 밑줄이 그어져 있었다. 지금은 왼쪽 칸이라 선이 뜬다.
   ② 아이콘 타일이 카드 높이를 그대로 받아 191px 이 되면서 그림과 글자 사이가 텅 비었다.
      타일은 제 크기(118px)만 쓰고, 카드 높이는 지표 쪽에 맞춘다. */
.me-main-ref .me-shortcut-head{
  border-bottom:0;
  padding-bottom:0;
}
.me-main-ref .me-shortcut-list a{
  height:auto;
  min-height:118px;
}
/* 두 칸은 높이를 맞춰 둔다(격자 stretch). 타일이 제 크기만 쓰게 됐으니
   남는 자리는 가운데 정렬로 흡수된다 — 예전처럼 그림과 글자 사이가 벌어지지 않는다. */
.me-main-ref .me-shortcut{align-items:center;}


/* 솔루션 카드 아래가 65px 비어 보였다. 격자가 가장 높은 카드에 높이를 맞추는데
   시안에는 그 자리에 「자세히 보기 →」가 있고 여기엔 없었다. 같은 줄을 넣는다. */
.me-main-ref .me-repsol-card > a{
  display:flex;
  flex-direction:column;
  height:100%;
}
.me-main-ref .me-repsol-body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}
.me-main-ref .me-repsol-more{
  margin-top:auto;
  padding-top:16px;
  color:var(--c-primary);
  font-size:14.5px;
  font-weight:800;
}
.me-main-ref .me-repsol-card:hover .me-repsol-more{text-decoration:underline;}


/* 제품 카드 사진이 빈 회색 칸처럼 보였다. 기기가 흰색인데 사진 배경도 흰색이고,
   그 흰 배경이 썸네일 바탕색(#eef4fb)을 덮어 버려 아무것도 없는 것처럼 읽힌다.
   곱하기로 겹치면 흰 배경은 바탕색에 녹고 기기 윤곽만 남는다. */
.me-main-ref .me-product-thumb img{
  mix-blend-mode:multiply;
}


/* 사회공헌·기부 현황 — 인증·실적 쪽의 요약 칸은 「1,500 / 누적 거래기관」처럼
   짧은 숫자를 전제로 숫자 칸을 82px 로 잡아 두었다. 여기 값은
   「259,490,200원」이라 그 칸에서 세 줄로 접혔다. 이 절만 따로 잡는다. */
.me-sub-wrap #ctt_con .me-social .me-page-summary{
  grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  gap:16px !important;
}
.me-sub-wrap #ctt_con .me-social .me-page-summary li{
  display:block !important;
  min-height:0;
  padding:22px 24px;
  text-align:left;
}
.me-sub-wrap #ctt_con .me-social .me-page-summary b{
  display:block;
  margin-bottom:6px;
  font-size:26px !important;
  line-height:1.2;
  white-space:nowrap;
}
.me-sub-wrap #ctt_con .me-social .me-page-summary li:nth-child(2) b{
  font-size:22px !important;   /* 「259,490,200원」은 한 줄에 들어가게 조금 작게 */
}
.me-sub-wrap #ctt_con .me-social .me-page-summary span{
  display:block;
  font-size:14px;
}
.me-sub-wrap #ctt_con .me-social-note{
  margin-top:14px;
  color:var(--c-text-sub);
  font-size:13.5px;
  line-height:1.6;
  word-break:keep-all;
}
@media (max-width:900px){
  .me-sub-wrap #ctt_con .me-social .me-page-summary{grid-template-columns:1fr !important;}
}


/* 서브헤더 한 줄 설명이 빵부스러기보다 위에 나오고 있었다.
   빵부스러기(order:1)와 제목(order:2)에만 순서가 붙어 있고 설명에는 없어
   기본값 0으로 맨 앞에 섰다. 화면에서는 머리말에 눌려 잘려 보였다.
   시안 순서 그대로 「홈 › … 」 → 제목 → 설명이 되게 뒤로 보낸다. */
.me-subhead-desc{order:3;}


/* 하위 페이지 카드 묶음 — 눈으로 보고 나온 두 가지.
   ① 카드가 flex 로 1/3 폭에 고정(0 1 …)이고 묶음이 가운데 정렬이라, 두 장짜리
      절(미션·비전)에서 두 카드가 화면 가운데로 몰리고 좌우가 크게 비었다.
      늘어날 수 있게 해서 줄을 채운다.
   ② min-height:220px 이 박혀 있어 「01 + 한 줄」만 든 카드가 159px 비어 있었다.
      같은 줄 안에서는 stretch 가 높이를 맞추므로 최소높이는 필요 없다. */
.me-sub-wrap #ctt_con .me-feature-grid > .me-feature-card{
  flex:1 1 calc((100% - 40px)/3);
}
.me-sub-wrap #ctt_con .me-feature-card{
  min-height:0;
}





/* 요약 칸의 라벨 — 칸이 82px 로 고정이라 글자 라벨이 접혔다.
   오시는 길의 「Consu / lting」, 교사 모니터링의 「Simp / le」가 그 경우다.
   숫자 라벨(1,500 · 63+ · 150,000)은 82px 안에 들어가 표가 안 났을 뿐,
   원인은 같다. 라벨은 제 글자 길이만큼 쓰고 값이 남는 자리를 갖게 한다. */
.me-sub-wrap #ctt_con .me-page-summary li{
  grid-template-columns:minmax(auto,max-content) minmax(0,1fr) !important;
  gap:14px;
  align-items:center;
}
.me-sub-wrap #ctt_con .me-page-summary b{
  white-space:nowrap;
}
.me-sub-wrap #ctt_con .me-page-location .me-page-summary b,
.me-sub-wrap #ctt_con .me-page-monitoring .me-page-summary b{
  font-size:22px !important;   /* 글자 라벨은 숫자만큼 크게 둘 이유가 없다 */
}


/* ── 넓은 화면에서 글이 작고 오른쪽이 비어 보이던 것 (2026-09-04) ──────────
   1920px 로 보면 본문 칸은 1400px 인데 글자는 16~17px 이라 성기게 읽힌다.
   메뉴도 17px/600 이라 가늘어 작게 보였다. 한 단계씩 올린다. */
/* 시안(metaedusys.pages.dev)에서 실측한 값이다. 앞서 「작아 보인다」는 말에
   크기만 눈대중으로 올렸는데, 시안은 크기(16px)는 그대로 두고 굵기를 850 으로
   써서 또렷하게 만든다. 그쪽을 따른다. */
#me-hd .me-gnb-a{
  font-size:16px;
  font-weight:850;
}
.me-sub-wrap{
  font-size:16px;
}
.me-sub-wrap #ctt_con p,
.me-sub-wrap #ctt_con li{
  font-size:16.5px;      /* 시안 본문 문단 */
  line-height:1.75;
}

/* 인사말은 편지글이다. <br> 로 줄을 끊어 두어 1400px 칸의 왼쪽 절반에만 글이
   몰리고 오른쪽이 통째로 비었다. 줄바꿈은 본문에서 걷어냈고, 여기서는 읽기 좋은
   폭(38em)을 주고 칸 가운데에 놓아 좌우 여백이 고르게 남게 한다. */
/* 시안의 인사말은 글 폭 771px 짜리 왼쪽 칸이다(가운데 정렬이 아니다).
   같은 폭·같은 정렬로 맞춘다. */
.me-sub-wrap #ctt_con .me-page-greeting .me-photo-copy{
  max-width:771px;
}
.me-sub-wrap #ctt_con .me-page-greeting .me-photo-copy p{
  font-size:16.5px;
  line-height:1.75;
}


/* 솔루션 구성품 목록이 flex + justify-content:center 라 마지막 줄에 한두 개만
   남으면 가운데로 떠올랐다(찾아가는 교육 3번째, AI 융합교실 5번째).
   줄 시작에 맞춰 쌓이게 하고, 두 칸 격자로 고정해 줄바꿈이 고르게 되도록 한다. */
.me-parts-wrap > .me-parts-list{
  display:grid;
  max-width:none;
  grid-template-columns:repeat(2, minmax(0,1fr));
  justify-content:stretch;
  align-content:start;
}
@media (max-width:980px){
  .me-parts-wrap > .me-parts-list{grid-template-columns:1fr;}
}


/* ── 시안 활자·카드 값 (실측) ────────────────────────────────────────
   서브 h1 46px/800 · 본문 h2 34px/800 · h3 19px/800 · 문단 16.5px/1.75
   카드 안쪽 20/22 · 모서리 14 · 실선 #EAEFF7 · 그림자 없음
   여기 값은 h1 44 · h2 31 · 카드 30/28 에 모서리 18 과 큰 그림자였다. */
.me-subhead-title{font-size:46px !important;}
/* 시안은 h2 를 한 크기로 쓰지 않는다 — 절 제목 32, 쪽 첫머리 리드 28 이다.
   앞서 34 로 일괄 지정했던 것을 역할별로 나눈다. */
.me-sub-wrap #ctt_con h2{font-size:32px;font-weight:800;line-height:1.35;letter-spacing:-.03em;}
.me-sub-wrap #ctt_con h3{font-size:19px;font-weight:800;line-height:1.6;}
.me-sub-wrap #ctt_con .me-page-title{font-size:28px !important;line-height:1.4;}
.me-sub-wrap #ctt_con .me-feature-card,
.me-sub-wrap #ctt_con .me-why-card{
  padding:20px 22px !important;
  border-radius:14px !important;
  border-color:#EAEFF7 !important;
  box-shadow:none !important;
}
.me-sub-wrap #ctt_con .me-feature-card:hover,
.me-sub-wrap #ctt_con .me-why-card:hover{
  transform:none;
  border-color:var(--point-300) !important;
  box-shadow:none !important;
}
@media (max-width:760px){
  .me-subhead-title{font-size:30px !important;}
  .me-sub-wrap #ctt_con h2{font-size:25px;}
}


/* 인사말 — 시안은 편지를 왼쪽 칸(771px)에 두고 그 오른쪽에 「우리가 중요하게 보는
   기준」 카드를 세워 자리를 채운다. 여기서는 둘이 위아래로 놓여 편지 오른쪽이
   통째로 비었다. 본문 순서(1 인트로 · 2 편지 · 3 지표 · 4 기준 · 5 인증서 · 6 사진)는
   그대로 두고, 격자로 2·4 만 한 줄에 나란히 놓는다. */
.me-sub-wrap #ctt_con .me-page-greeting{
  display:grid;
  grid-template-columns:minmax(0,771px) minmax(0,1fr);
  column-gap:48px;
  align-items:start;
}
.me-sub-wrap #ctt_con .me-page-greeting > *{grid-column:1 / -1;}
.me-sub-wrap #ctt_con .me-page-greeting > :nth-child(2){grid-column:1;grid-row:2;}
.me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4){grid-column:2;grid-row:2;}
/* 오른쪽 칸에서는 기준 카드를 세로로 쌓는다 */
.me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4) .me-feature-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px;
}
.me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4) .me-section-head{
  display:block;
  margin-bottom:14px;
}
.me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4) .me-section-head p{
  margin-top:6px;
}
@media (max-width:1080px){
  .me-sub-wrap #ctt_con .me-page-greeting{grid-template-columns:1fr;column-gap:0;}
  .me-sub-wrap #ctt_con .me-page-greeting > :nth-child(2),
  .me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4){grid-column:1 / -1;grid-row:auto;}
  .me-sub-wrap #ctt_con .me-page-greeting > :nth-child(4) .me-feature-grid{
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) !important;
  }
}


/* ── 2쪽 미션과 비전 — 시안 실측(1440) ────────────────────────────────
   목표전략 카드  656x86 · 안쪽 22/24 · 모서리 16 · 배경 없음(테두리만) · h3 17/800 · 2열 gap 40
   추진전략 카드  624x67 · 안쪽 20/22 · 모서리 14 · 흰 배경 · h3 16/700 · 2열 gap 16
   핵심 가치      3열 gap 20 · h3 19/800
   여기는 세 절을 모두 같은 3열 흰 카드로 그리고 있었다. */
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(2) .me-feature-grid,
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(3) .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:40px !important;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(3) .me-feature-card{
  padding:22px 24px !important;
  border-radius:16px !important;
  background:transparent !important;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(3) .me-feature-card h3{
  font-size:17px;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(4) .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:16px !important;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(4) .me-feature-card h3{
  font-size:16px;
  font-weight:700;
}
.me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(5) .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
}
/* 좁은 폭 규칙은 위의 :nth-of-type 규칙과 같은 무게로 적어야 이긴다.
   그러지 않아 375px 에서도 핵심 가치가 3열로 남아 설명이 49px 폭으로 눌렸다. */
@media (max-width:900px){
  .me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(2) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(3) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(4) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-vision .me-page-section:nth-of-type(5) .me-feature-grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
}

/* 카드 안 제목은 시안이 19/800 이다(여기 20px 규칙이 남아 있었다). */
.me-sub-wrap #ctt_con .me-feature-card h3{font-size:19px;font-weight:800;}


/* ── 3쪽 연혁 — 시안 실측(1440) ──────────────────────────────────────
   시안은 카드 격자가 아니라 왼쪽 레일 타임라인이다.
     레일  border-left 2px #E0E6F0
     행    grid 96px + 1fr · gap 20 · 안쪽 12/0/12/24 · 테두리도 배경도 없음
     날짜  15px/800 #5A6B85 · 내용 15.5px/400 #22344E · 레일 위 12px 점
   여기서는 네 칸짜리 카드 격자로 그리고 있어 연도 흐름이 읽히지 않았다.
   마크업(li > b + span)이 시안 행과 같은 모양이라 그대로 얹는다. */
.me-sub-wrap #ctt_con .me-page-history .me-process{
  display:block !important;
  grid-template-columns:none !important;
  margin:0 0 0 6px;
  padding:0;
  border-left:2px solid #E0E6F0;
  list-style:none;
  counter-reset:none;
}
.me-sub-wrap #ctt_con .me-page-history .me-process li{
  position:relative;
  display:grid !important;
  grid-template-columns:96px minmax(0,1fr);
  gap:20px;
  margin:0;
  padding:12px 0 12px 24px !important;
  min-height:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:none !important;
  box-shadow:none !important;
}
.me-sub-wrap #ctt_con .me-page-history .me-process li::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:-7px;
  top:20px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--c-primary);
}
.me-sub-wrap #ctt_con .me-page-history .me-process li::after{
  content:none !important;
  display:none !important;
}
.me-sub-wrap #ctt_con .me-page-history .me-process li b{
  font-size:15px;
  font-weight:800;
  color:#5A6B85;
  white-space:nowrap;
}
.me-sub-wrap #ctt_con .me-page-history .me-process li span{
  font-size:15.5px;
  line-height:1.6;
  color:#22344E;
}
@media (max-width:640px){
  .me-sub-wrap #ctt_con .me-page-history .me-process li{
    grid-template-columns:1fr;
    gap:2px;
  }
}


/* ── 4쪽 핵심역량 — 시안 실측(1440) ──────────────────────────────────
   역량 카드   3열 gap 20 · 437x378 · 안쪽 32/28 · 모서리 18 · 흰 배경 · h3 19/800
   원스톱 단계 4열 gap 18 · 302.5px · h3 17/800
   보유 특허   4열 gap 20 · 특허증 273px 칸에 239x338
   공통 카드값(20/22 · r14)보다 이 쪽 역량 카드만 크게 쓴다. */
.me-sub-wrap #ctt_con .me-page-competency .me-page-section:nth-of-type(1) .me-feature-card{
  padding:32px 28px !important;
  border-radius:18px !important;
}
.me-sub-wrap #ctt_con .me-page-competency .me-page-section:nth-of-type(1) .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-sub-wrap #ctt_con .me-page-competency .me-process{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
}
.me-sub-wrap #ctt_con .me-page-competency .me-process h3,
.me-sub-wrap #ctt_con .me-page-competency .me-process b{
  font-size:17px;
  font-weight:800;
}
.me-sub-wrap #ctt_con .me-page-competency .me-photo-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
}
@media (max-width:1000px){
  .me-sub-wrap #ctt_con .me-page-competency .me-page-section:nth-of-type(1) .me-feature-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .me-sub-wrap #ctt_con .me-page-competency .me-process{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:640px){
  .me-sub-wrap #ctt_con .me-page-competency .me-page-section:nth-of-type(1) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-competency .me-process{
    grid-template-columns:1fr !important;
  }
}


/* ── 5쪽 인증·실적 — 시안 실측(1440) ────────────────────────────────
   절마다 칸 수가 다르다. 여기서는 대부분 3열로만 그리고 있었다.
     지표      4열 gap 20 · 카드 323x156 · 안쪽 32/24 · 모서리 18 · 배경 없음
     인증 현황 4열 gap 20 · 제목 15/700
     보유 특허 4열 gap 14 · 제목 16/700
     지식재산  3열 gap 20
     GS인증    5열 gap 14 · 제목 17/800
     수상 이력 2열 gap 14 · 제목 15/700
   사회공헌은 우리가 새로 넣은 절이라 3칸 요약 그대로 둔다. */
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(2) .me-feature-grid{
  display:grid !important;   /* 묶음이 flex 라 열 수가 무시됐다 */
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(2) .me-feature-card h3{font-size:15px;font-weight:700;}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) .me-feature-grid,
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) ul{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(4) .me-feature-grid{
  display:grid !important;   /* 묶음이 flex 라 열 수가 무시됐다 */
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) .me-feature-grid,
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) ul{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:14px !important;
}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) h3{font-size:17px;font-weight:800;}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(6) .me-feature-grid{
  display:grid !important;   /* 묶음이 flex 라 열 수가 무시됐다 */
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
}
.me-sub-wrap #ctt_con .me-page-cert > :nth-child(6) .me-feature-card{padding:16px 20px !important;}
/* 지표 칸은 인트로 오른쪽 좁은 칸에 들어 있었다. 여러 열로 잡자 칸이 93px 로
   줄어 설명이 세로로 섰다. 시안은 이 지표를 본문 전체 폭에 카드로 깐다
   (.st-stat4 · 4열 · 323x156 · 안쪽 32/24 · 모서리 18 · 배경 없음 · 숫자 위,
   설명 아래). 인트로를 한 줄로 풀고 지표를 그 아래 전체 폭에 놓는다. */
.me-sub-wrap #ctt_con .me-page-cert > .me-page-intro{
  display:block !important;
}
.me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
  margin-top:24px;
}
.me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary li{
  display:block !important;
  padding:32px 24px !important;
  border-radius:18px !important;
  background:transparent !important;
  min-height:0;
}
.me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary b{
  display:block;
  margin-bottom:8px;
  font-size:28px;
  line-height:1.2;
}
.me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary span{
  display:block;
  font-size:14px;
  line-height:1.6;
}
/* 좁은 폭 규칙은 위의 :nth-child 규칙과 같은 무게로 적어야 이긴다.
   그러지 않아 800px 에서도 인증이 4열로 남아 글이 잘게 접혔다. */
@media (max-width:1100px){
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(2) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(4) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(6) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) ul,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) ul,
  .me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:640px){
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(2) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(4) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(6) .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(3) ul,
  .me-sub-wrap #ctt_con .me-page-cert > :nth-child(5) ul,
  .me-sub-wrap #ctt_con .me-page-cert > .me-page-intro .me-page-summary{
    grid-template-columns:1fr !important;
  }
}


/* ── 6쪽 오시는 길 — 시안 실측(1440) ────────────────────────────────
   시안은 사업장 하나를 [주소 772px | 지도 551px] 한 줄로 놓고, 사업장 둘을
   세로로 쌓는다(gap 28). 주소 카드는 안쪽 36 · 모서리 18, 사업장 이름 22/800,
   주소는 2026-09-07 전체 정렬 점검에서 18px 본문 크기로 조정했다.
   여기서는 반대로 사업장 둘을 가로로 늘어놓고 각 칸 안에서 주소 위 지도 아래로
   쌓아, 지도가 661px 로 좁아지고 주소 글씨도 작았다. */
.me-sub-wrap #ctt_con .me-location-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:28px !important;
}
.me-sub-wrap #ctt_con .me-location-site{
  display:grid;
  grid-template-columns:minmax(0,772fr) minmax(0,551fr);
  gap:28px;
  align-items:stretch;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-address{
  padding:36px !important;
  border-radius:18px !important;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-address h3{
  font-size:22px;
  font-weight:800;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-address p{
  font-size:18px;
  font-weight:500;
  line-height:1.7;
}
.me-sub-wrap #ctt_con .me-location-site .me-location-map{
  margin:0;
  height:auto;
  min-height:362px;
  border-radius:18px;
  overflow:hidden;
}
@media (max-width:980px){
  .me-sub-wrap #ctt_con .me-location-site{grid-template-columns:1fr;}
  .me-sub-wrap #ctt_con .me-location-site .me-location-address p{font-size:17px;}
}


/* ── 7쪽 메인 — 시안 실측(1440) ─────────────────────────────────────
   섹션 위아래 여백 92px (솔루션만 56/90, 마지막 상담 96), 격자는 절마다 다르다.
     고민 2열 gap 18 · 솔루션 3열 gap 22 · 특전 3열 gap 22 · WHY 4열 gap 20
     PROCESS 5열 gap 20 · 사례 3열 gap 22 · 상담 이유 2열 gap 22
   솔루션 카드는 안쪽 0 · 모서리 18 · 실선 #E7ECF5 · 그림자 없음.
   여기는 섹션 여백 104px 에 격자 간격이 24~28px 로 더 벌어져 있었다. */
.me-main-ref .me-sec,
.me-main-ref > section.me-section{
  padding-top:92px;
  padding-bottom:92px;
}
/* 앞 규칙이 section.me-section 으로 요소까지 짚어 더 세다 — 같은 무게로 적는다. */
.me-main-ref section.me-repsol{padding-top:56px;padding-bottom:90px;}
.me-main-ref section.me-finalcta{padding-top:96px;padding-bottom:96px;}

.me-main-ref .me-repsol-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:22px !important;
}
.me-main-ref .me-repsol-card{
  border-radius:18px !important;
  border:1px solid #E7ECF5 !important;
  box-shadow:none !important;
}
.me-main-ref .me-benefit-grid{gap:22px !important;}
.me-main-ref .me-why-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-main-ref .me-process .me-steps{gap:20px !important;}
.me-main-ref .me-ref-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:22px !important;
}
@media (max-width:1100px){
  .me-main-ref .me-why-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .me-main-ref .me-repsol-grid,
  .me-main-ref .me-ref-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media (max-width:680px){
  .me-main-ref .me-why-grid,
  .me-main-ref .me-repsol-grid,
  .me-main-ref .me-ref-grid{grid-template-columns:1fr !important;}
  .me-main-ref .me-sec,
  .me-main-ref > section.me-section{padding-top:56px;padding-bottom:56px;}
}


/* ── 8쪽 솔루션 상세 — 시안 실측(1440) ──────────────────────────────
   인트로   2열 [글 752 | 사진 556] gap 44 · 사진 556x417 모서리 18
   구성품   전체 폭 2열 gap 12
   핵심포인트 3열 gap 18 · 카드 제목 18/800
   상담 유도 2열 [글 732 | 단추 488] gap 36 · 제목 34/800
   여기는 사진을 구성품 옆에 두고 구성품을 가운데 정렬해, 마지막 줄 항목이
   가운데로 떠오르고 인트로 오른쪽이 비어 있었다. */
.me-sub-wrap .me-sol-intro.has-photo{
  display:grid;
  grid-template-columns:minmax(0,752fr) minmax(0,556fr);
  gap:44px;
  align-items:center;
}
.me-sol-intro-figure{
  margin:0;
  border-radius:18px;
  overflow:hidden;
}
.me-sol-intro-figure img{display:block;width:100%;height:auto;}
.me-sub-wrap .me-parts-list{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  justify-content:stretch !important;
  justify-items:stretch !important;
}
.me-sub-wrap .me-parts-list > .me-part-item{width:100%;}   /* 칸을 채운다(시안 670px) */
.me-sub-wrap .me-solpoint-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
}
.me-sub-wrap .me-solpoint-grid h3{font-size:18px;font-weight:800;}
@media (max-width:980px){
  .me-sub-wrap .me-sol-intro.has-photo{grid-template-columns:1fr;gap:24px;}
  .me-sol-intro-figure{order:-1;}
  .me-sub-wrap .me-parts-list{grid-template-columns:1fr !important;}
  .me-sub-wrap .me-solpoint-grid{grid-template-columns:1fr !important;}
}


/* ── 9쪽 제품·디바이스 — 시안 실측(1440) ────────────────────────────
   절 제목 30/800(대표 모델명만 36) · 주요 사양 4열 gap 16 · 제품 라인업 4열 gap 20
   라인업 카드 사진은 321x321 정사각.
   여기는 절 제목 32 에 디바이스 구성이 3열이었다. */
.me-sub-wrap #ctt_con .me-page-device h2,
.me-sub-wrap #ctt_con .me-page-contents h2,
.me-sub-wrap #ctt_con .me-page-monitoring h2{font-size:30px;}
.me-sub-wrap #ctt_con .me-page-device .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-sub-wrap #ctt_con .me-page-device .me-feature-card h3{font-size:16px;font-weight:800;}
.me-sub-wrap #ctt_con img.me-section-pic{
  aspect-ratio:16 / 6;
  border-radius:20px;
}
@media (max-width:1100px){
  .me-sub-wrap #ctt_con .me-page-device .me-feature-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:640px){
  .me-sub-wrap #ctt_con .me-page-device .me-feature-grid{grid-template-columns:1fr !important;}
}


/* ── 10쪽 구매 안내 — 시안 실측(1440) ───────────────────────────────
   조달 경로 2열 gap 22 · 제목 21/800 · 구매 절차 4열 gap 20 · 제목 17/800
   표는 셀 안쪽 12/16 · 글자 14 · 머리글 12.5/800 (배경 없이 글자만) */
.me-sub-wrap #ctt_con .me-page-purchase .me-feature-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:22px !important;
}
.me-sub-wrap #ctt_con .me-page-purchase .me-feature-card h3{font-size:21px;font-weight:800;}
.me-sub-wrap #ctt_con .me-page-purchase .me-process{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:20px !important;
}
.me-sub-wrap #ctt_con .me-page-purchase .me-process h3,
.me-sub-wrap #ctt_con .me-page-purchase .me-process b{font-size:17px;font-weight:800;}
.me-sub-wrap #ctt_con .me-info-table td,
.me-sub-wrap #ctt_con .me-info-table th,
.me-sub-wrap .me-procure table td,
.me-sub-wrap .me-procure table th{
  padding:12px 16px !important;   /* 앞 규칙이 16/18 로 잡고 있다 */
  font-size:14px;
}
.me-sub-wrap #ctt_con .me-info-table th,
.me-sub-wrap .me-procure table thead th{
  font-size:12.5px;
  font-weight:800;
  background:transparent;
}
@media (max-width:900px){
  .me-sub-wrap #ctt_con .me-page-purchase .me-feature-grid,
  .me-sub-wrap #ctt_con .me-page-purchase .me-process{
    grid-template-columns:1fr !important;
  }
}


/* 바로가기·지표 띠는 시안 메인에 없는 우리 보강분이다. 그래도 카드 표현은
   시안 언어를 따른다 — 흰 바탕 · 모서리 18 · 실선 #E7ECF5 · 그림자 없음. */
.me-main-ref .me-shortcut,
.me-main-ref .me-kpi{
  border:1px solid #E7ECF5 !important;
  border-radius:18px !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  background:#fff !important;
}
.me-main-ref .me-shortcut-list a{
  border:1px solid #E7ECF5;
  border-radius:14px;
  box-shadow:none;
}

/* 특전 카드 제목이 「AI 융합교실 · 지능형 과학 / 실을」처럼 단어 중간에서 끊겼다.
   한글은 어절 단위로 끊어야 읽힌다. */
.me-main-ref .me-benefit-card h3{
  word-break:keep-all;
  overflow-wrap:break-word;
}


/* 절 머리칸이 [제목 왼쪽 | 설명 오른쪽] 두 칸이라, 설명 첫 줄이 제목보다 위에
   떠 보이고 넓은 화면에서는 둘 사이가 크게 벌어졌다. 시안은 눈썹 문구 · 제목 ·
   설명을 위에서 아래로 쌓는다. 같은 순서로 편다. */
.me-sub-wrap #ctt_con .me-section-head{
  display:block !important;
  grid-template-columns:none !important;
}
.me-sub-wrap #ctt_con .me-section-head > p{
  margin:10px 0 0;
  max-width:70ch;
  text-align:left;
}

/* 카드 묶음이 가운데 정렬이라 마지막 줄에 하나만 남으면 가운데로 떠올랐다
   (핵심역량 05, 미션과 비전 03). 줄 시작에 맞춰 채운다. */
.me-sub-wrap #ctt_con .me-feature-grid{
  justify-content:start !important;
  justify-items:stretch !important;
}

/* 오시는 길 연락처는 좁은 폭에서 세 칸을 유지하면 값이 세로로 깨진다
   (「무료/컨설/팅·…」, 메일 주소가 세 줄). 한 칸씩 내린다. */
/* 요약 칸은 좁은 폭에서 여러 칸을 유지하면 값이 세로로 깨진다
   (오시는 길 「무료/컨설/팅…」, 구매 안내 「디/지/털/서/비/스/몰…」).
   오시는 길만 막아 뒀는데 같은 문제라 전체에 건다. */
@media (max-width:1000px){
  .me-sub-wrap #ctt_con .me-page-summary{
    grid-template-columns:1fr !important;
  }
}


/* 사례 카드 사진 아래에 옅은 띠가 남았다. <img> 가 inline 이라 글줄 기준선 밑
   여백이 생기고 그 자리로 칸 배경(#f4f7ff)이 비친 것이다. 칸을 꽉 채우게 한다. */
.me-sub-wrap #bo_gall .gall_img picture{display:block;height:100%;}
.me-sub-wrap #bo_gall .gall_img img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.me-sub-wrap #bo_gall .gall_img > a{display:block;height:100%;}

/* 회원가입 동의 칸 — 네모만 있고 「동의합니다」 글자는 화면 밖(sound_only)에 있었다.
   무엇에 동의하는지 눈으로 읽고 체크해야 한다. 특히 개인정보 수집 동의는
   동의 의사가 화면에 드러나야 한다. 글자를 되살리고 네모 옆에 붙였다. */
/*  띄우는 것은 약관 상자 오른쪽 위의 동의 네모 둘(fieldset)뿐이다. 맨 아래
    「모두 동의」 줄(div#fregister_chkall)도 같은 클래스를 달고 있어 함께 끌려
    내려갔고, 그 탓에 위는 29px 로 벌어지고 아래는 1px 만 남아 단추와 붙어 보였다.
    요소를 짚어 그 줄은 빼 둔다. */
.me-sub-wrap #fregister fieldset.fregister_agree{
  top:14px;
  right:20px;
}
.me-sub-wrap #fregister .fregister_agree label{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:#3d5570;
  font-size:14.5px;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
}
.me-sub-wrap #fregister .fregister_agree label span{
  position:static;
  top:auto;
  right:auto;
  flex:0 0 20px;
  width:20px;
  height:20px;
}
.me-sub-wrap #fregister .fregister_agree label .me-agree-txt{
  font-weight:600;
}
.me-sub-wrap #fregister .fregister_agree input[type="checkbox"]:checked + label{
  color:var(--c-navy);
}

/* 좁은 폭에서는 동의 글자가 절 제목 위에 겹쳤다(테두리 오른쪽에 띄워 둔 탓).
   제목·본문 다음에 한 줄로 내린다 — 읽는 차례도 그쪽이 맞다. */
@media (max-width: 860px){
  .me-sub-wrap #fregister .fregister_agree{
    position:static;
    display:block;
    padding:14px 20px;
    border-top:1px solid var(--point-150);
    background:var(--point-50);
  }
  .me-sub-wrap #fregister .fregister_agree label{
    white-space:normal;
  }
}

/* 회원정보 찾기·비밀번호 재설정 — 그누보드 기본 회색 판이 그대로 나와
   로그인·회원가입 화면과 따로 놀았다. 같은 카드로 맞춘다. */
.me-sub-wrap #find_info,
.me-sub-wrap #pw_reset{
  max-width:620px;
  margin:0 auto;
}
.me-sub-wrap #find_info .new_win_con,
.me-sub-wrap #pw_reset .new_win_con{
  padding:34px 32px;
  border:1px solid var(--point-200);
  border-radius:16px;
  background:var(--c-white);
}
.me-sub-wrap #find_info .new_win_con + .new_win_con,
.me-sub-wrap #pw_reset .new_win_con + .new_win_con{
  margin-top:16px;
}
.me-sub-wrap #find_info #info_fs p,
.me-sub-wrap #pw_reset #info_fs p{
  margin:0 0 18px;
  color:var(--c-text-sub);
  font-size:15.5px;
  line-height:1.7;
}
.me-sub-wrap #find_info .frm_input,
.me-sub-wrap #pw_reset .frm_input{
  width:100%;
  height:52px;
  padding:0 16px;
  border:1px solid #d5deec;
  border-radius:10px;
  background:var(--c-white);
  color:var(--c-text);
  font-size:15.5px;
}
.me-sub-wrap #find_info .frm_input:focus,
.me-sub-wrap #pw_reset .frm_input:focus{
  border-color:var(--c-primary);
  outline:none;
}
.me-sub-wrap #find_info #captcha,
.me-sub-wrap #pw_reset #captcha{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.me-sub-wrap #find_info #captcha_key,
.me-sub-wrap #pw_reset #captcha_key{
  height:44px;
  padding:0 12px;
  border:1px solid #d5deec;
  border-radius:8px;
}
.me-sub-wrap #find_info #captcha_info,
.me-sub-wrap #pw_reset #captcha_info{
  width:100%;
  color:#7c8ba1;
  font-size:13px;
  line-height:1.6;
}
.me-sub-wrap #find_info .win_btn,
.me-sub-wrap #pw_reset .win_btn{
  margin-top:22px;
}
.me-sub-wrap #find_info .btn_submit,
.me-sub-wrap #pw_reset .btn_submit{
  width:100%;
  height:54px;
  border:0;
  border-radius:12px;
  background:var(--c-primary);
  color:var(--c-white);
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}
.me-sub-wrap #find_info .btn_submit:hover,
.me-sub-wrap #pw_reset .btn_submit:hover{
  background:var(--c-primary-deep);
}
.me-sub-wrap #find_info .find_btn h3{
  display:block;
  margin:0 0 14px;
  color:var(--c-navy);
  font-size:17px;
  font-weight:800;
}
.me-sub-wrap #find_info .cert_btn{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.me-sub-wrap #find_info .cert_btn .btn_submit{
  flex:1 1 160px;
  width:auto;
}
.me-sub-wrap #pw_reset .frm_input + .frm_input{
  margin-top:10px;
}

/* 비밀글 비밀번호 확인·회원정보 확인 — 머리글도 바닥글도 없는 낱장 화면이라
   그누보드 기본 모양 그대로 나왔다. 방문자 눈에는 사이트를 벗어난 것처럼 보인다.
   테마 카드로 맞추고 위에 로고를 두어 어느 사이트인지 알게 했다. */
#pw_confirm.mbskin,
#mb_confirm.mbskin{
  width:min(440px, calc(100% - 32px));
  margin:72px auto;
  padding:36px 32px 32px;
  border:1px solid var(--point-200);
  border-radius:18px;
  background:var(--c-white);
  box-shadow:var(--shadow-card);
  text-align:left;
}
#pw_confirm.mbskin:after,
#mb_confirm.mbskin:after{display:none;}
#pw_confirm .me-pw-home{
  display:block;
  margin-bottom:22px;
}
#pw_confirm .me-pw-home img{
  display:block;
  width:186px;
  height:auto;
}
#pw_confirm.mbskin h1,
#mb_confirm.mbskin h1{
  margin:0 0 12px;
  color:var(--c-navy);
  font-size:24px;
  font-weight:800;
  line-height:1.35;
  letter-spacing:-.01em;
}
#pw_confirm.mbskin p,
#mb_confirm.mbskin p{
  margin:0 0 22px;
  padding:0;
  border:0;
  color:var(--c-text-sub);
  font-size:15px;
  line-height:1.7;
}
#pw_confirm.mbskin p strong,
#mb_confirm.mbskin p strong{
  display:block;
  margin-bottom:4px;
  color:var(--c-text);
  font-weight:700;
}
#pw_confirm.mbskin fieldset,
#mb_confirm.mbskin fieldset{
  margin:0;
  padding:0;
  border:0;
}
#pw_confirm.mbskin .frm_input,
#mb_confirm.mbskin .frm_input{
  width:100%;
  height:52px;
  padding:0 16px;
  border:1px solid #d5deec;
  border-radius:10px;
  background:var(--c-white);
  color:var(--c-text);
  font-size:15.5px;
}
#pw_confirm.mbskin .frm_input:focus,
#mb_confirm.mbskin .frm_input:focus{
  border-color:var(--c-primary);
  outline:none;
}
#pw_confirm.mbskin .btn_submit,
#mb_confirm.mbskin .btn_submit{
  width:100%;
  height:52px;
  margin:12px 0 0;
  border:0;
  border-radius:12px;
  background:var(--c-primary);
  color:var(--c-white);
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}
#pw_confirm.mbskin .btn_submit:hover,
#mb_confirm.mbskin .btn_submit:hover{
  background:var(--c-primary-deep);
}
#pw_confirm .me-pw-back{
  display:block;
  margin-top:18px;
  color:var(--c-text-sub);
  font-size:14px;
  text-align:center;
}
#pw_confirm .me-pw-back:hover{
  color:var(--c-primary);
}

/* 사양 각주 — 시안은 제품 쪽 「한눈에 보기」 아래에 「※ 세부 사양은 도입 기종과
   계약 조건에 따라 달라질 수 있습니다」를 적어 둔다. 학교가 화면 값을 그대로
   계약 조건으로 읽지 않게 하는 문장이라 옮긴다. */
.me-sub-wrap #ctt_con .me-page-note{
  margin:14px 0 0;
  color:#7c8ba1;
  font-size:13.5px;
  line-height:1.65;
}

/* 손가락으로 누르는 폭에서는 바닥글 잔글씨 링크가 27~30px 밖에 안 됐다.
   전화번호·약관·블로그처럼 실제로 누르는 것들이라 세로 여백을 줘 40px 로
   키운다(글자 크기는 그대로). */
@media (max-width: 768px){
  #me-ft .me-ft-links a,
  #me-ft .me-ft-blogs a,
  #me-ft .me-ft-biz a[href^="tel:"]{
    display:inline-block;
    padding-top:11px;
    padding-bottom:11px;
  }
}

/* ── 2026-09-09 이진영 점검 반영 ─────────────────────────────────────── */

/*  FAQ 질문이 두 줄이 되면 둘째 줄부터 분류 딱지 밑으로 파고들었다. 딱지가
    인라인이라 첫 줄만 딱지 폭(71px)만큼 밀리고 다음 줄은 왼쪽 끝에서 시작한다.
    좁은 폭에서는 딱지를 윗줄에 따로 세워 모든 줄이 같은 자리에서 시작하게 한다. */
@media (max-width: 640px){
  .me-sub-wrap .me-board-faq-title em{
    display:block;
    width:fit-content;
    margin:0 0 6px;
  }
}

/*  본문 표가 좁은 폭에서 오른쪽이 잘린 채 스크롤도 안 됐다. 모바일용
    overflow-x:auto 를 뒤에 오는 모서리 둥글리기 규칙의 overflow:hidden 이
    덮어썼기 때문이다(같은 무게, 뒤엣것이 이김). 조달 등록 정보 표는 그 탓에
    73px 이 어떤 조작으로도 안 보였다. 모서리는 감싸개가 맡고 표는 스크롤을 되찾는다. */
@media (max-width: 768px){
  /*  표를 스크롤 상자로 만들면 감싸개는 그 사실을 모른 채 폭을 고정해, 밀어도
      끝이 안 나온다. 스크롤은 감싸개가 맡고 표는 제 내용만큼 넓어지게 둔다. */
  .me-sub-wrap #ctt_con table{
    overflow:visible;
    width:max-content;
    max-width:none;
  }
  .me-sub-wrap #ctt_con .mu-info-table{
    border-radius:12px;
    overflow-x:auto;
  }
}

/*  게시판 검색창은 입력칸과 단추가 딱 붙어 있어, 눌렀을 때 생기는 파란 표시가
    단추 안으로 4px 파고들었다. 표시를 칸 안쪽으로 넣는다. 전역 초점 규칙은
    건드리지 않는다 — 머리글·서브탭까지 같이 바뀐다. */
#container .bo_sch .sch_input:focus-visible{
  outline-offset:-2px;   /* 전역 초점 규칙(#container input:focus-visible)을 이겨야 한다 */
}

/*  페이지 넘김의 「처음·이전·다음·맨끝」은 글자를 화면 밖으로 밀어내고(-999px)
    배경 그림 화살표로 보이던 그누보드 기본 처리다. 이 테마가 배경을 흰색으로
    덮으면서 그림이 사라져 빈 상자만 남았다. 그림 대신 화살표 글자를 그린다.
    원래 글자는 화면낭독기용으로 그대로 둔다. */
.me-sub-wrap .pg_wrap .pg_start,
.me-sub-wrap .pg_wrap .pg_prev,
.me-sub-wrap .pg_wrap .pg_next,
.me-sub-wrap .pg_wrap .pg_end{
  position:relative;
  text-indent:0;
  font-size:0;            /* 「처음」 같은 글자는 눈에서 감추고 */
  overflow:hidden;
}
.me-sub-wrap .pg_wrap .pg_start::before,
.me-sub-wrap .pg_wrap .pg_prev::before,
.me-sub-wrap .pg_wrap .pg_next::before,
.me-sub-wrap .pg_wrap .pg_end::before{
  font-size:15px;
  line-height:1;
  letter-spacing:-.02em;
}
.me-sub-wrap .pg_wrap .pg_start::before{content:"\00AB";}   /* « 처음 */
.me-sub-wrap .pg_wrap .pg_prev::before{content:"\2039";}    /* ‹ 이전 */
.me-sub-wrap .pg_wrap .pg_next::before{content:"\203A";}    /* › 다음 */
.me-sub-wrap .pg_wrap .pg_end::before{content:"\00BB";}     /* » 맨끝 */