/* ==========================================================================
   hanmok.css — 한목 커스텀 레이아웃·테마
   - SYMAX 원본 CSS(pc.css, pc_responsive.css)는 수정하지 않고, 이 파일이 뒤에서 덮어씀
   - 로드 위치: main.php 모듈 CSS 다음, 관리자 스킨 인라인 <style> 앞
   - 브레이크포인트: ~767 모바일 / 768~1024 태블릿 / 1025~ PC (pc_responsive.css와 동일)
   - 100vw 사용 금지(스크롤바 폭 초과). 풀폭은 #wrap 직계 자식 width:100%
   ========================================================================== */

/* ---------- 1. 디자인 토큰 ---------- */
:root {
	--hm-navy: #103070;
	--hm-navy-deep: #0b1f4d;
	--hm-blue: #0078c0;
	--hm-sky: #3ba3e6;
	--hm-dark: #0b1220;
	--hm-ink: #111827;
	--hm-text: #334155;
	--hm-muted: #64748b;
	--hm-line: #e5e7eb;
	--hm-line-soft: #eef2f7;
	--hm-bg-soft: #f5f7fa;
	--hm-accent: #f59e0b;
	--hm-accent-deep: #d97706;
	--hm-white: #ffffff;

	--hm-font-kr: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Malgun Gothic', sans-serif;
	--hm-font-en: 'Poppins', 'Pretendard Variable', Pretendard, sans-serif;

	--hm-fs-label: clamp(0.72rem, 0.68rem + 0.2vw, 0.86rem);
	--hm-fs-h1: clamp(1.9rem, 1.3rem + 2.2vw, 3.3rem);
	--hm-fs-h2: clamp(1.55rem, 1.15rem + 1.5vw, 2.6rem);
	--hm-fs-h3: clamp(1.15rem, 1rem + 0.6vw, 1.5rem);
	--hm-fs-lead: clamp(1rem, 0.95rem + 0.3vw, 1.2rem);

	--hm-header-h: 88px;
	--hm-container: 1260px;
	--hm-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--hm-dur: 0.6s;
}

/* 스크롤 컨테이너 정상화: 솔루션 CSS가 html·body 모두에 overflow-x:hidden을 걸어 body가 스크롤 컨테이너가 되고
   window 스크롤 이벤트·sticky·ScrollTrigger가 동작하지 않음 → html은 visible로 되돌려 body의 overflow가 뷰포트로 전파되게 함 */
html { overflow-x: visible !important; overflow-y: visible !important; }
body { overflow-x: hidden; overflow-y: scroll; }

/* ---------- 2. 공통 유틸 ---------- */
.hm-container { width: 100%; max-width: var(--hm-container); margin: 0 auto; padding: 0 20px; }
@media (min-width: 1300px) { .hm-container { padding: 0; } }

.hm-section { width: 100%; padding: clamp(56px, 7vw, 110px) 0; }
.hm-section--soft { background: var(--hm-bg-soft); }
.hm-section--dark { background: var(--hm-dark); color: #fff; }
.hm-section--navy { background: var(--hm-navy-deep); color: #fff; }

.hm-label { font-family: var(--hm-font-en); font-weight: 600; font-size: var(--hm-fs-label); letter-spacing: 0.18em; text-transform: uppercase; color: var(--hm-blue); }
.hm-section--dark .hm-label, .hm-section--navy .hm-label { color: var(--hm-sky); }

.hm-reveal { opacity: 0; transform: translateY(24px); transition: opacity var(--hm-dur) var(--hm-ease), transform var(--hm-dur) var(--hm-ease); }
.hm-reveal.is-in { opacity: 1; transform: none; }
.hm-reveal[data-delay="1"] { transition-delay: 0.1s; }
.hm-reveal[data-delay="2"] { transition-delay: 0.2s; }
.hm-reveal[data-delay="3"] { transition-delay: 0.3s; }
@media (prefers-reduced-motion: reduce) {
	.hm-reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- 3. 헤더 (≥1025: 로고 좌·메뉴 우 1단 풀폭, 고정) ---------- */
#top #logo_n_top #etc_menu li.hm-home { display: none; }
/* 모바일·태블릿(솔루션 기본 헤더 유지): 로고 높이만 보정 */
@media (max-width: 1024px) {
	#top #logo_n_top h1 a img, #top #logo_n_top .logo-heading a img { max-height: 40px !important; width: auto; }
	#top #logo_n_top h1, #top #logo_n_top .logo-heading { display: flex; align-items: center; }
	#top #logo_n_top { padding: 12px 16px; } /* 2026-10-16: 모바일 로고 상하 여백 — 솔루션 기본 padding 0 15px이라 헤더 40px가 로고에 딱 붙음 → 64px */
}
@media (min-width: 768px) and (max-width: 1024px) {
	#top #logo_n_top h1 a img, #top #logo_n_top .logo-heading a img { max-height: 48px !important; }
	#top #logo_n_top { padding: 12px 20px; }
}

@media (min-width: 1025px) {
	#top {
		position: fixed; top: 0; left: 0; right: var(--hm-sb, 0px); z-index: 1000;
		display: flex; align-items: center; justify-content: space-between; gap: 40px;
		height: var(--hm-header-h); min-height: var(--hm-header-h); padding: 0 clamp(20px, 2.8vw, 48px);
		overflow: visible;
		background: var(--menu-m1-bg, #ffffff);
		border-bottom: 1px solid rgba(17, 24, 39, 0.08);
		box-shadow: 0 1px 0 rgba(17, 24, 39, 0.02);
		transition: background 0.35s var(--hm-ease), box-shadow 0.35s var(--hm-ease), border-color 0.35s var(--hm-ease);
	}
	body.page-sub #wrap { padding-top: var(--hm-header-h); }

	/* #logo_n_top의 자식(로고·햄버거·부가메뉴)을 #top의 flex 아이템으로 승격 */
	#top #logo_n_top { display: contents; }
	#top #logo_n_top h1, #top #logo_n_top .logo-heading { order: 1; height: auto; line-height: 0; margin: 0; padding: 0; }
	#top #logo_n_top h1 a img, #top #logo_n_top .logo-heading a img { display: block; max-height: 48px; width: auto; transition: filter 0.35s var(--hm-ease), opacity 0.35s var(--hm-ease); }
	#top #logo_n_top h1.logo_text, #top #logo_n_top .logo-heading.logo_text { height: var(--hm-header-h); line-height: var(--hm-header-h); font-size: 24px; font-weight: 800; }
	#top #logo_n_top .btn_hamburger { display: none !important; }
	#top #logo_n_top #etc_menu { position: static; order: 3; background: transparent; bottom: auto; right: auto; }
	#top #logo_n_top #etc_menu ul { display: flex; gap: 14px; }
	#top #logo_n_top #etc_menu li { background: transparent; }
	#top #logo_n_top #etc_menu li a span { font-size: 12px; color: var(--hm-muted); letter-spacing: 0.02em; }
	#top #logo_n_top #etc_menu li a:hover span { color: var(--hm-ink); }
	#top #logo_n_top #etc_menu:empty { display: none; }

	/* 메뉴 행을 로고와 같은 줄로 (인라인 스킨 #top #menu1{background}보다 높은 특이성) */
	#wrap #top #menu1 { position: static; order: 2; flex: 1 1 auto; width: auto; height: auto; background: transparent; border: 0; box-shadow: none; overflow: visible; }
	#top #menu2 { width: auto; max-width: none; padding: 0; margin: 0; }
	#top #menu2 ul.m1_ul { width: auto; max-width: none; justify-content: flex-end; gap: clamp(28px, 2.6vw, 44px); height: var(--hm-header-h); margin: 0; }
	#top #menu2 li.m1_li { min-width: 0; margin: 0; }
	#top #menu2 li.m1_li > a { height: var(--hm-header-h); padding: 0 2px; }
	#top #menu2 li.m1_li span.m1_txt { font-family: var(--hm-font-kr); font-size: 17px; font-weight: 600; letter-spacing: -0.01em; transition: color 0.25s var(--hm-ease); }
	#top #menu2 li.m1_li > a::after { bottom: 26px; height: 2px; border-radius: 2px; background: var(--color-m1-on, var(--hm-blue)); }
	/* 2차 메뉴: 유신식 가로 밴드 — 1차 hover 시 헤더 바로 아래 풀폭 밴드에 2차 항목을 가로(중앙 정렬)로 나열.
	   li.m1_li·#menu2를 static으로 두어 ul.m2_ul의 포지셔닝 기준을 #top(fixed)으로 올림 → 밴드가 헤더 전체 폭. 마크업 무변경 */
	#top #menu2 { position: static; }
	#top #menu2 li.m1_li { position: static; }
	#top #menu2 ul.m2_ul {
		top: calc(var(--hm-header-h) - 1px); left: 0; right: 0; min-width: 0; margin: 0; /* 헤더 1px 테두리 줄과 겹치게(1차 항목은 87.5px까지라 0.5px 틈 제거, Firefox HiDPI) */ padding: 0 max(20px, calc((100% - var(--hm-container)) / 2));
		display: flex; justify-content: center; align-items: stretch; gap: 0; height: var(--hm-band-h, 58px);
		border-radius: 0; border-top: 1px solid rgba(17, 24, 39, 0.06); background: var(--menu-m2-bg, #ffffff);
		box-shadow: 0 16px 36px rgba(15, 23, 42, 0.10);
		transform: translateY(-8px); opacity: 0; visibility: hidden; pointer-events: none;
		transition: opacity 0.28s var(--hm-ease), transform 0.28s var(--hm-ease), visibility 0s linear 0.28s, background 0.35s var(--hm-ease);
	}
	#top #menu2 li.m1_li:hover ul.m2_ul, #top #menu2 li.m1_li:focus-within ul.m2_ul { z-index: 101; transform: none; opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 0.28s var(--hm-ease), transform 0.28s var(--hm-ease), visibility 0s linear 0s, background 0.35s var(--hm-ease); }
	#top #menu2 li.m2_li { position: relative; margin: 0; padding: 0; white-space: nowrap; }
	#top #menu2 li.m2_li::before { display: none; }
	#top #menu2 li.m2_li > a { display: flex; align-items: center; height: var(--hm-band-h, 58px); padding: 0 clamp(14px, 1.4vw, 24px); background: transparent !important; }
	#top #menu2 li.m2_li > a::after { content: ""; position: absolute; left: clamp(14px, 1.4vw, 24px); right: clamp(14px, 1.4vw, 24px); bottom: 0; height: 2px; border-radius: 2px; background: var(--color-m1-on, var(--hm-blue)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--hm-ease); }
	#top #menu2 li.m2_li:hover > a::after, #top #menu2 li.m2_li.m2_on > a::after { transform: scaleX(1); }
	#top #menu2 li.m2_li span { font-family: var(--hm-font-kr); font-size: 15px; font-weight: 500; letter-spacing: -0.01em; padding: 0; color: var(--hm-text); } /* 흰 밴드 가독성: 스킨 --color-m2(연회색) 대신 본문 텍스트색, hover/on은 스킨 1차 포인트색 --color-m1-on(기본 스킨의 --color-m2-on은 #CCCCCC라 흰 배경에서 안 보임) */
	#top #menu2 li.m2_li:hover span, #top #menu2 li.m2_li.m2_on span { color: var(--color-m1-on, var(--hm-blue)); }
	#top #menu2 li.m2_li.m2_on span { font-weight: 700; }
	#top #menu2 ul.m3_ul { display: none; }
	#top #menu3 { display: none; }
	/* 메인 투명 헤더 상태: 다크 반투명 밴드 */
	body.page-main #top:not(.is-scrolled) #menu2 ul.m2_ul { background: rgba(11, 18, 32, 0.82); border-top-color: rgba(255, 255, 255, 0.12); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
	body.page-main #top:not(.is-scrolled) #menu2 li.m2_li span { color: rgba(255, 255, 255, 0.82); }
	body.page-main #top:not(.is-scrolled) #menu2 li.m2_li:hover span, body.page-main #top:not(.is-scrolled) #menu2 li.m2_li.m2_on span { color: #fff; }
	body.page-main #top:not(.is-scrolled) #menu2 li.m2_li > a::after { background: #fff; }
	/* 관리자 '상단 배경 이미지'(no=2) 인라인 #top{background:URL} 단축속성이 hanmok 배경을 덮지 않도록 서브 헤더 배경색·크기만 재지정(메인은 body.page-main 규칙 유지) */
	body.page-sub #top { background-color: var(--menu-m1-bg, #ffffff); background-size: auto 100%; }

	/* 메뉴 영역 1260 정렬: 로고(좌)~부가메뉴(우)를 1260 컨테이너 안에 정렬. #etc_menu는 항상 존재(회원 링크 미사용 시 빈 상태) */
	#top { padding: 0; gap: 0; }
	#top #logo_n_top h1, #top #logo_n_top .logo-heading { margin-left: max(20px, calc((100% - var(--hm-container)) / 2)); margin-right: 40px; }
	#top #logo_n_top #etc_menu { margin-right: max(20px, calc((100% - var(--hm-container)) / 2)); }
	#top #logo_n_top #etc_menu:has(li:not(.hm-home)) { margin-left: 28px; }
	#top #menu2 ul.m1_ul { padding-right: 0; }

	/* 메인: 히어로 위 투명 헤더 → 스크롤 시 흰 배경 */
	body.page-main #top { background: transparent; border-bottom-color: transparent; box-shadow: none; }
	/* 메인 투명 헤더의 로고: CSS 필터(전체 흰색) 대신 js/hanmok.js가 img src를 logo_main.png(네모 마크 원색 + 글자 흰색)로 교체 */
	body.page-main #top:not(.is-scrolled) #menu2 li.m1_li span.m1_txt { color: rgba(255, 255, 255, 0.92); }
	body.page-main #top:not(.is-scrolled) #menu2 li.m1_li:hover span.m1_txt, body.page-main #top:not(.is-scrolled) #menu2 li.m1_li.m1_on span.m1_txt { color: #fff; }
	body.page-main #top:not(.is-scrolled) #menu2 li.m1_li > a::after { background: #fff; }
	body.page-main #top:not(.is-scrolled) #etc_menu li a span { color: rgba(255, 255, 255, 0.75); }
	body.page-main #top.is-scrolled { background: var(--menu-m1-bg, rgba(255, 255, 255, 0.96)); border-bottom-color: rgba(17, 24, 39, 0.08); box-shadow: 0 6px 24px rgba(15, 23, 42, 0.06); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
}

/* ---------- 4. 서브페이지: 2차 메뉴 내비(유신식) + 풀폭 타이틀 배너 + 1260 단일 컬럼 ---------- */
.hm-subnav { width: 100%; background: #fff; border-bottom: 1px solid var(--hm-line); }
.hm-subnav__in { display: flex; align-items: stretch; gap: 0; }
.hm-subnav__parent { display: none; }
.hm-subnav__list { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.hm-subnav__list::-webkit-scrollbar { display: none; }
.hm-subnav__list li { flex: 0 0 auto; }
.hm-subnav__list a { position: relative; display: flex; align-items: center; height: 52px; padding: 0 16px; font-size: 14px; font-weight: 500; color: var(--hm-text); white-space: nowrap; transition: color 0.25s var(--hm-ease); }
.hm-subnav__list a::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: -1px; height: 2px; background: var(--color-m1-on, var(--hm-blue)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--hm-ease); }
.hm-subnav__list a:hover { color: var(--hm-ink); }
.hm-subnav__list a.is-on { color: var(--color-m1-on, var(--hm-blue)); font-weight: 700; }
.hm-subnav__list a.is-on::after, .hm-subnav__list a:hover::after { transform: scaleX(1); }
.hm-subnav--depth3 { background: var(--hm-bg-soft); border-bottom: 1px solid var(--hm-line-soft); }
.hm-subnav--depth3 .hm-subnav__list a { height: 46px; font-size: 13px; }

.hm-subtitle { position: relative; width: 100%; min-height: 240px; display: flex; align-items: flex-end; overflow: hidden; background: linear-gradient(135deg, var(--hm-navy), var(--hm-dark)); color: #fff; }
.hm-subtitle__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.04); animation: hm-zoom-settle 1.6s var(--hm-ease) forwards; }
.hm-subtitle::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 18, 32, 0.25) 0%, rgba(11, 18, 32, 0.55) 60%, rgba(11, 18, 32, 0.78) 100%); }
.hm-subtitle__in { position: relative; z-index: 1; padding-top: 44px; padding-bottom: 36px; }
.hm-subtitle__loc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 18px; font-size: 12px; color: rgba(255, 255, 255, 0.68); }
.hm-subtitle__loc a { color: rgba(255, 255, 255, 0.82); }
.hm-subtitle__loc a:hover { color: #fff; }
.hm-subtitle__sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255, 255, 255, 0.45); }
.hm-subtitle__label { margin: 0 0 8px; font-family: var(--hm-font-en); font-weight: 600; font-size: var(--hm-fs-label); letter-spacing: 0.22em; color: var(--hm-sky); animation: hm-rise 0.7s var(--hm-ease) both; }
.hm-subtitle__title { margin: 0; font-family: var(--hm-font-kr); font-weight: 700; font-size: var(--hm-fs-h1); line-height: 1.2; letter-spacing: -0.02em; color: #fff; animation: hm-rise 0.8s var(--hm-ease) 0.08s both; }
.hm-subtitle__edit { position: absolute; right: 16px; bottom: 16px; z-index: 2; padding: 6px 10px; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 6px; background: rgba(0, 0, 0, 0.35); color: #fff; font-size: 12px; cursor: pointer; }
.hm-subtitle__edit:hover { background: rgba(0, 0, 0, 0.6); }

@keyframes hm-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes hm-zoom-settle { from { transform: scale(1.08); } to { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
	.hm-subtitle__img, .hm-subtitle__label, .hm-subtitle__title { animation: none; transform: none; }
}

/* 본문: 좌측 메뉴 제거 후 단일 컬럼. 구 타이틀 블록 제거로 사라진 상단 여백을 패딩으로 복원 */
#sub_layout_wrap > #content_area { padding-top: 40px; }
#content_area .se2_outputarea { margin-right: 0 !important; }
body.page-sub #membership_visual { display: none; }
#content_area div.title_n_loc { display: none; }

@media (min-width: 768px) {
	#sub_layout_wrap { flex-direction: column !important; padding: 0 20px; }
	/* 솔루션 규칙 #sub_layout_wrap > #content_area { flex:1; width:0 !important }(행 레이아웃용)를 열 레이아웃에 맞게 재정의 */
	#sub_layout_wrap > #content_area { flex: 0 0 auto !important; width: 100% !important; min-width: 0; padding-top: 56px; }
	#content_area { width: 100% !important; max-width: var(--hm-container); margin-left: auto; margin-right: auto; }
	.hm-subtitle { min-height: 300px; }
	.hm-subtitle__in { padding-top: 56px; padding-bottom: 48px; }
	.hm-subnav__parent { display: flex; align-items: center; margin-right: 28px; padding-right: 28px; border-right: 1px solid var(--hm-line); font-weight: 700; font-size: 15px; color: var(--hm-ink); white-space: nowrap; }
	.hm-subnav__list a { height: 60px; padding: 0 18px; font-size: 15px; }
	.hm-subnav__list a::after { left: 18px; right: 18px; }
}
@media (min-width: 1025px) {
	/* 유신식 단일 바: 2차 탭 바를 고정 헤더 바로 아래에 고정(sticky). 1차 메뉴 hover 시 내용이 해당 메뉴의 2차로 전환(.is-preview) */
	.hm-subnav { position: sticky; top: var(--hm-header-h); z-index: 900; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04); }
	.hm-subnav--depth3 { position: static; box-shadow: none; }
	/* 고정 헤더(88px) + sticky 탭 바(60px+1px) 아래로 focus()·#앵커·Tab 이동 대상이 숨지 않도록 뷰포트 스크롤 패딩(루트 요소에 지정해야 뷰포트에 적용) */
	html { scroll-padding-top: var(--hm-header-h); }
	html:has(body.page-sub .hm-subnav:not(.hm-subnav--depth3)) { scroll-padding-top: calc(var(--hm-header-h) + 61px); }
	.hm-subnav__list { transition: opacity 0.2s var(--hm-ease); }
	.hm-subnav.is-swapping .hm-subnav__list { opacity: 0; }
	.hm-subnav.is-preview .hm-subnav__parent { color: var(--color-m1-on, var(--hm-blue)); }
	.hm-subnav.is-preview .hm-subnav__list a::after { transform: scaleX(0); }
	.hm-subnav.is-preview .hm-subnav__list a:hover::after { transform: scaleX(1); }
	#sub_layout_wrap { max-width: var(--hm-container); margin: 0 auto; }
	#sub_layout_wrap > #content_area { flex: 0 0 auto !important; width: 100% !important; padding-top: 64px; }
	#content_area { width: 100%; max-width: var(--hm-container); margin: 0 auto 80px; }
	.hm-subtitle { min-height: clamp(320px, 24vw, 400px); }
	.hm-subtitle__in { padding-top: 64px; padding-bottom: 56px; }
}
@media (min-width: 1300px) {
	#sub_layout_wrap { padding: 0; }
}

/* 1000px 컬럼 기준으로 고정된 솔루션 폼 폭 보정 */
#content_area table.design1 { max-width: 100%; }
#content_area table.design1 input[type="text"], #content_area table.design1 textarea, #content_area table.design1 select.wide { max-width: 100%; }
#content_area #agree_check span.title, #content_area #agree_check textarea.content { max-width: 100%; }

/* ---------- 5. 메인페이지 공통 (섹션 템플릿은 customize/sections/*.php) ---------- */
#main_contents:empty { display: none; }
#main_contents > div[style] { margin-bottom: 0; padding: clamp(56px, 7vw, 100px) 0; }
#quick { display: none; } /* 구 솔루션 좌우 퀵배너: 풀폭 레이아웃에서는 서브 타이틀 배너 위에 겹치므로 전 페이지 미사용 */
@media (min-width: 1025px) {
	#main_contents div.main_content_block { width: 100%; max-width: var(--hm-container); padding: 0 20px; }
	#main_contents div.main_content_block > div:only-child { width: 100% !important; flex-basis: 100%; }
}
@media (min-width: 1300px) {
	#main_contents div.main_content_block { padding: 0; }
}

/* ---------- 6. 메인 공통 타이포·버튼 ---------- */  /* 2026-10-19: 메인 본문 글자 +1px(제목·라벨·숫자 제외, 사용자 요청) */
.hm-h2 { margin: 12px 0 16px; font-family: var(--hm-font-kr); font-size: var(--hm-fs-h2); font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; color: var(--hm-ink); }
.hm-lead { margin: 0; font-size: calc(var(--hm-fs-lead) + 1px); line-height: 1.75; color: var(--hm-text); max-width: 720px; }
.hm-section--dark .hm-h2, .hm-section--navy .hm-h2, .hm-cta .hm-h2 { color: #fff; }
.hm-section--dark .hm-lead, .hm-section--navy .hm-lead, .hm-cta .hm-lead { color: rgba(255, 255, 255, 0.78); }
.hm-sec-head { margin-bottom: clamp(32px, 4vw, 56px); }
.hm-sec-head--center { text-align: center; }
.hm-sec-head--center .hm-lead { margin-left: auto; margin-right: auto; }
.hm-sec-head--row { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.hm-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 16px; color: var(--hm-blue); }
.hm-link svg { transition: transform 0.3s var(--hm-ease); }
.hm-link:hover svg { transform: translateX(4px); }
.hm-btn { display: inline-flex; align-items: center; gap: 10px; height: 54px; padding: 0 26px; border-radius: 999px; font-family: var(--hm-font-kr); font-weight: 700; font-size: 16px; letter-spacing: -0.01em; cursor: pointer; transition: transform 0.3s var(--hm-ease), box-shadow 0.3s var(--hm-ease), background 0.3s var(--hm-ease), color 0.3s var(--hm-ease), border-color 0.3s var(--hm-ease); }
.hm-btn svg { transition: transform 0.3s var(--hm-ease); }
.hm-btn:hover { transform: translateY(-2px); }
.hm-btn:hover svg { transform: translateX(4px); }
.hm-btn--primary { background: var(--hm-accent); color: #111827; box-shadow: 0 10px 24px rgba(245, 158, 11, 0.28); }
.hm-btn--primary:hover { background: #fbbf24; box-shadow: 0 16px 34px rgba(245, 158, 11, 0.38); color: #111827; }
.hm-btn--ghost { border: 1px solid rgba(255, 255, 255, 0.55); color: #fff; background: rgba(255, 255, 255, 0.06); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.hm-btn--ghost:hover { background: rgba(255, 255, 255, 0.16); color: #fff; border-color: #fff; }
.hm-btn--lg { height: 62px; padding: 0 34px; font-size: 17px; }

/* ---------- 7. 히어로 ---------- */
.hm-hero { position: relative; width: 100%; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: var(--hm-dark); color: #fff; }
.hm-hero__media { position: absolute; inset: -6% 0; will-change: transform; }
.hm-hero__media picture { display: block; position: absolute; inset: 0; }
.hm-hero__img, .hm-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.hm-hero__img { animation: hm-kenburns 26s ease-in-out infinite alternate; }
.hm-hero__video { opacity: 0; transition: opacity 1.2s var(--hm-ease); }
.hm-hero__video.is-ready { opacity: 1; }
.hm-hero__dim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7, 12, 24, 0.82) 0%, rgba(7, 12, 24, 0.55) 48%, rgba(7, 12, 24, 0.2) 100%), linear-gradient(180deg, rgba(7, 12, 24, 0.45) 0%, rgba(7, 12, 24, 0) 32%, rgba(7, 12, 24, 0.65) 100%); }
.hm-hero__in { position: relative; z-index: 1; padding-top: calc(var(--hm-header-h) + 48px); padding-bottom: 120px; }
.hm-hero__label { margin: 0 0 22px; font-family: var(--hm-font-en); font-weight: 600; font-size: var(--hm-fs-label); letter-spacing: 0.24em; color: var(--hm-sky); animation: hm-rise 0.8s var(--hm-ease) 0.1s both; }
.hm-hero__title { margin: 0 0 26px; font-family: var(--hm-font-kr); font-weight: 800; font-size: clamp(2.2rem, 1.5rem + 3.2vw, 4.8rem); line-height: 1.1; letter-spacing: -0.035em; color: #fff; }
.hm-hero__line { display: block; overflow: hidden; padding-bottom: 0.08em; }
.hm-hero__line > span { display: block; transform: translateY(110%); animation: hm-lineup 0.9s var(--hm-ease) forwards; animation-delay: calc(0.2s + var(--d, 0) * 0.14s); }
.hm-hero__lead { max-width: 620px; margin: 0; font-size: calc(var(--hm-fs-lead) + 1px); line-height: 1.8; color: rgba(255, 255, 255, 0.82); animation: hm-rise 0.9s var(--hm-ease) 0.55s both; }
.hm-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; animation: hm-rise 0.9s var(--hm-ease) 0.7s both; }
.hm-hero__badges { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 48px 0 0; padding: 0; list-style: none; font-size: 14px; color: rgba(255, 255, 255, 0.78); animation: hm-rise 0.9s var(--hm-ease) 0.85s both; }
.hm-hero__badges li { display: inline-flex; align-items: center; gap: 7px; }
.hm-hero__badges svg { color: var(--hm-accent); }
.hm-hero__scroll { position: absolute; left: 50%; bottom: 26px; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; transform: translateX(-50%); font-family: var(--hm-font-en); font-size: 11px; letter-spacing: 0.22em; color: rgba(255, 255, 255, 0.72); }
.hm-hero__scroll i { display: block; width: 1px; height: 46px; background: linear-gradient(#fff, rgba(255, 255, 255, 0)); animation: hm-scrollline 1.9s var(--hm-ease) infinite; }
@keyframes hm-kenburns { from { transform: scale(1); } to { transform: scale(1.12); } }
@keyframes hm-lineup { to { transform: none; } }
@keyframes hm-scrollline { 0% { transform: scaleY(0); transform-origin: top; } 45% { transform: scaleY(1); transform-origin: top; } 55% { transform: scaleY(1); transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 1024px) {
	.hm-hero { min-height: 74vh; }
	.hm-hero__in { padding-top: 72px; padding-bottom: 96px; }
}
@media (prefers-reduced-motion: reduce) {
	.hm-hero__img, .hm-hero__line > span, .hm-hero__label, .hm-hero__lead, .hm-hero__actions, .hm-hero__badges, .hm-hero__scroll i { animation: none; transform: none; opacity: 1; }
}

/* ---------- 8. 숫자로 보는 한목 ---------- */
.hm-stats__head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: end; margin-bottom: clamp(36px, 4vw, 56px); }
.hm-stats__head .hm-link { margin-top: 18px; }
.hm-stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
/* 2026-10-16 시안 A(사용자 확정): 네이비 그라데이션 카드 + 아이콘 배지 + 번호 + 워터마크 아이콘 + 하단 포인트 라인 (마크업 customize/sections/01_stats.php) */
.hm-stat { position: relative; overflow: hidden; padding: 32px 30px 30px; border: 0; border-radius: 18px; color: #fff; background: linear-gradient(145deg, #143a85 0%, var(--hm-navy) 35%, var(--hm-navy-deep) 100%); box-shadow: 0 12px 30px rgba(11, 31, 77, 0.18); transition: opacity var(--hm-dur) var(--hm-ease), transform 0.4s var(--hm-ease), box-shadow 0.4s var(--hm-ease); }
.hm-stat::before { content: ""; position: absolute; right: -70px; top: -70px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(59, 163, 230, 0.42), transparent 66%); pointer-events: none; transition: transform 0.6s var(--hm-ease); }
.hm-stat::after { content: ""; position: absolute; left: 30px; right: 30px; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--hm-sky), rgba(59, 163, 230, 0)); opacity: 0.9; }
.hm-stat:hover { transform: translateY(-6px); box-shadow: 0 28px 54px rgba(11, 31, 77, 0.32); }
.hm-stat:hover::before { transform: scale(1.25); }
.hm-stat__idx { position: absolute; right: 22px; top: 16px; font-family: var(--hm-font-en); font-weight: 700; font-size: 40px; line-height: 1; letter-spacing: -0.02em; color: #fff; pointer-events: none; }
.hm-stat__icon { position: relative; z-index: 1; width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 14px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); color: var(--hm-sky); transition: background 0.4s var(--hm-ease), color 0.4s var(--hm-ease), border-color 0.4s var(--hm-ease); }
.hm-stat__icon svg { display: block; width: 24px; height: 24px; }
.hm-stat:hover .hm-stat__icon { background: var(--hm-sky); color: #fff; border-color: transparent; }
.hm-stat__wm { position: absolute; right: -6px; bottom: -10px; width: 128px; height: 128px; color: #fff; opacity: 0.07; pointer-events: none; transition: transform 0.6s var(--hm-ease), opacity 0.6s var(--hm-ease); }
.hm-stat__wm svg { display: block; width: 100%; height: 100%; }
.hm-stat:hover .hm-stat__wm { transform: translate(-6px, -6px) rotate(-6deg); opacity: 0.12; }
.hm-stat__value { position: relative; z-index: 1; margin: 0 0 12px; font-family: var(--hm-font-en); font-weight: 700; font-size: clamp(2.4rem, 2rem + 1.6vw, 3.6rem); line-height: 1; letter-spacing: -0.02em; color: #fff; }
.hm-stat__value em { font-style: normal; font-size: 0.48em; margin-left: 4px; color: var(--hm-sky); font-family: var(--hm-font-kr); font-weight: 700; }
.hm-stat__label { position: relative; z-index: 1; margin: 0 0 6px; font-size: 17px; font-weight: 700; color: #fff; }
.hm-stat__note { position: relative; z-index: 1; margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.62); }
@media (max-width: 1024px) { .hm-stats__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .hm-stats__head { grid-template-columns: 1fr; gap: 16px; } .hm-stats__grid { gap: 12px; } .hm-stat { padding: 22px 20px; } .hm-stat__icon { width: 44px; height: 44px; margin-bottom: 18px; } .hm-stat__idx { font-size: 32px; right: 16px; top: 14px; } .hm-stat__wm { width: 100px; height: 100px; } }

/* ---------- 9. 사업분야 6카드 ---------- */
.hm-biz__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.hm-biz__card { display: block; position: relative; height: 100%; border-radius: 20px; overflow: hidden; background: #fff; border: 1px solid var(--hm-line); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); transition: transform 0.5s var(--hm-ease), box-shadow 0.5s var(--hm-ease), border-color 0.5s var(--hm-ease); }
.hm-biz__card:hover { transform: translateY(-6px); box-shadow: 0 26px 54px rgba(15, 23, 42, 0.14); border-color: transparent; }
.hm-biz__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #e5e7eb; }
.hm-biz__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 1.1s var(--hm-ease); }
.hm-biz__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 18, 32, 0) 50%, rgba(11, 18, 32, 0.45) 100%); opacity: 0.6; transition: opacity 0.5s var(--hm-ease); }
.hm-biz__card:hover .hm-biz__media img { transform: scale(1.1); }
.hm-biz__card:hover .hm-biz__media::after { opacity: 0.9; }
.hm-biz__body { padding: 26px 26px 28px; }
.hm-biz__en { margin: 0 0 8px; font-family: var(--hm-font-en); font-weight: 600; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--hm-blue); }
.hm-biz__title { margin: 0 0 10px; font-size: 21px; font-weight: 700; letter-spacing: -0.01em; color: var(--hm-ink); transition: color 0.3s var(--hm-ease); }
.hm-biz__card:hover .hm-biz__title { color: var(--hm-navy); }
.hm-biz__desc { margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--hm-text); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hm-biz__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 18px; font-size: 14px; font-weight: 700; color: var(--hm-navy); }
.hm-biz__more svg { transition: transform 0.3s var(--hm-ease); }
.hm-biz__card:hover .hm-biz__more svg { transform: translateX(4px); }
.hm-biz__num { position: absolute; top: 18px; left: 18px; z-index: 1; padding: 6px 11px; border-radius: 999px; background: rgba(11, 18, 32, 0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: #fff; font-family: var(--hm-font-en); font-weight: 600; font-size: 13px; letter-spacing: 0.12em; }
@media (max-width: 1024px) { .hm-biz__grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } }
@media (max-width: 767px) { .hm-biz__grid { grid-template-columns: 1fr; gap: 14px; } .hm-biz__body { padding: 20px; } }

/* ---------- 10. 프로세스 ---------- */
.hm-process { position: relative; overflow: hidden; }
.hm-process__bg { position: absolute; inset: -10% 0; z-index: 0; }
.hm-process__bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.16; will-change: transform; }
.hm-process::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(60% 70% at 15% 0%, rgba(0, 120, 192, 0.35), transparent 60%), radial-gradient(50% 60% at 90% 100%, rgba(16, 48, 112, 0.6), transparent 60%); }
.hm-process .hm-container { position: relative; z-index: 1; }
/* 2026-10-16 시안 B(사용자 확정): 유신 FOCUS식 세로 포토카드 (nanobanana 생성 사진 img/hanmok/process/step_0N.jpg, 마크업 customize/sections/03_process.php) */
.hm-steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 0 0 56px; padding: 0; list-style: none; }
.hm-stepc { position: relative; aspect-ratio: 3 / 4; border-radius: 20px; overflow: hidden; background: var(--hm-dark); box-shadow: 0 24px 56px rgba(0, 0, 0, 0.38); isolation: isolate; transition: opacity var(--hm-dur) var(--hm-ease), transform 0.6s var(--hm-ease), box-shadow 0.6s var(--hm-ease); }
.hm-stepc__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: var(--pos, 50% 40%); transform: scale(1.02); transition: transform 1.3s var(--hm-ease); }
.hm-stepc::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11, 18, 32, 0.18) 0%, rgba(11, 18, 32, 0.28) 45%, rgba(8, 22, 51, 0.9) 100%); }
.hm-stepc::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(11, 31, 77, 0.38); opacity: 0; transition: opacity 0.6s var(--hm-ease); }
.hm-stepc:hover { transform: translateY(-8px); box-shadow: 0 34px 70px rgba(0, 0, 0, 0.5); }
.hm-stepc:hover .hm-stepc__img { transform: scale(1.09); }
.hm-stepc:hover::after { opacity: 1; }
.hm-stepc__body { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; text-align: left; padding: 30px 30px 32px; color: #fff; }
.hm-stepc__icon { position: absolute; top: 24px; left: 24px; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: rgba(11, 18, 32, 0.55); border: 1px solid rgba(255, 255, 255, 0.28); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: var(--hm-sky); transition: border-color 0.5s var(--hm-ease), background 0.5s var(--hm-ease), color 0.5s var(--hm-ease); }
.hm-stepc__icon svg { width: 32px; height: 32px; display: block; }
.hm-stepc:hover .hm-stepc__icon { background: var(--hm-sky); border-color: transparent; color: #fff; }
.hm-stepc__no { margin: 0 0 10px; font-family: var(--hm-font-en); font-weight: 600; font-size: 13px; letter-spacing: 0.26em; color: var(--hm-accent); }
.hm-stepc__title { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: #fff; text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45); }
.hm-stepc__en { margin: 8px 0 0; font-family: var(--hm-font-en); font-weight: 500; font-size: 12.5px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); }
.hm-stepc__bar { display: block; width: 36px; height: 2px; margin: 18px 0 16px; background: var(--hm-sky); transition: width 0.6s var(--hm-ease); }
.hm-stepc:hover .hm-stepc__bar { width: 72px; }
.hm-stepc__desc { margin: 0; font-size: 15.5px; line-height: 1.72; color: rgba(255, 255, 255, 0.86); }
.hm-features { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none; }
.hm-feature { display: flex; gap: 14px; padding: 22px; border-radius: 16px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); transition: background 0.3s var(--hm-ease), border-color 0.3s var(--hm-ease), transform 0.3s var(--hm-ease); }
.hm-feature:hover { background: rgba(255, 255, 255, 0.09); border-color: rgba(255, 255, 255, 0.22); transform: translateY(-3px); }
.hm-feature__icon { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; background: rgba(59, 163, 230, 0.15); color: var(--hm-sky); }
.hm-feature__icon svg { width: 22px; height: 22px; }
.hm-feature__title { margin: 0 0 4px; font-size: 16px; font-weight: 700; color: #fff; }
.hm-feature__desc { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.68); }
@media (max-width: 1024px) { .hm-features { grid-template-columns: repeat(2, 1fr); } .hm-steps { gap: 18px; } .hm-stepc__title { font-size: 23px; } .hm-stepc__icon { width: 52px; height: 52px; top: 18px; left: 18px; } .hm-stepc__icon svg { width: 26px; height: 26px; } .hm-stepc__body { padding: 22px 22px 24px; } .hm-stepc__desc { font-size: 14.5px; } }
@media (max-width: 767px) { .hm-steps { grid-template-columns: 1fr; gap: 16px; } .hm-stepc { aspect-ratio: 4 / 3; } .hm-stepc__title { font-size: 25px; } .hm-features { grid-template-columns: 1fr; } }

/* ---------- 11. 주요 현장 슬라이더 + 고객사 마키 ---------- */
.hm-projects { overflow: hidden; }
.hm-projects__ctrl { display: flex; align-items: center; gap: 10px; }
.hm-projects__ctrl .hm-link { margin-left: 14px; }
.hm-circle-btn { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--hm-line); background: #fff; color: var(--hm-ink); cursor: pointer; transition: background 0.3s var(--hm-ease), color 0.3s var(--hm-ease), border-color 0.3s var(--hm-ease), transform 0.3s var(--hm-ease); }
.hm-circle-btn:hover { background: var(--hm-navy); border-color: var(--hm-navy); color: #fff; transform: translateY(-2px); }
.hm-circle-btn.swiper-button-disabled { opacity: 0.35; pointer-events: none; }
/* 2026-10-16(사용자 확정: 컨테이너 안 3장 정렬): 슬라이더 = 본문 컨테이너 폭, PC 3장·태블릿 2장·모바일 1.15장(js/hanmok_main.js breakpoints). 클립 래퍼가 hover 들림·그림자 여유만큼 넓게 잘라내고, .swiper 자체는 overflow visible */
.hm-projects__clip { overflow: hidden; margin: -16px -20px -56px; padding: 16px 20px 56px; }
.hm-projects__slider.swiper { width: 100%; margin: 0; padding: 0; overflow: visible; }
.hm-projects__slider .swiper-wrapper { list-style: none; margin: 0; padding: 0; }
.hm-projects__slider .swiper-slide.hm-proj { width: auto; height: auto; } /* 폭은 Swiper(slidesPerView)가 인라인으로 계산 */
/* 2026-10-16 시안 B(사용자 확정): 가로 4:3 포토카드 — 프로세스 카드와 같은 시각 언어 (네이비 그라데이션 오버레이·글라스 칩·하단 정렬·hover 확대/틴트/바). 사진은 nanobanana 보정(워터마크 제거)/생성 1200×800 */
.hm-proj__card { display: block; position: relative; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: var(--hm-dark); color: #fff; box-shadow: 0 18px 44px rgba(15, 23, 42, 0.16); isolation: isolate; transition: transform 0.6s var(--hm-ease), box-shadow 0.6s var(--hm-ease); }
.hm-proj__media { position: absolute; inset: 0; }
.hm-proj__media img { width: 100%; height: 100%; max-width: none; object-fit: cover; transform: scale(1.02); transition: transform 1.3s var(--hm-ease); }
.hm-proj__card::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11, 18, 32, 0.08) 0%, rgba(11, 18, 32, 0.18) 45%, rgba(8, 22, 51, 0.9) 100%); }
.hm-proj__card::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(11, 31, 77, 0.35); opacity: 0; transition: opacity 0.6s var(--hm-ease); }
.hm-proj__card:hover { transform: translateY(-8px); box-shadow: 0 30px 62px rgba(15, 23, 42, 0.3); }
.hm-proj__card:hover .hm-proj__media img { transform: scale(1.09); }
.hm-proj__card:hover::after { opacity: 1; }
.hm-proj__cat { position: absolute; top: 20px; left: 20px; z-index: 2; padding: 7px 12px; border-radius: 999px; background: rgba(11, 18, 32, 0.5); border: 1px solid rgba(255, 255, 255, 0.3); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: #fff; font-size: 12.5px; font-weight: 700; letter-spacing: 0.02em; transition: background 0.5s var(--hm-ease), border-color 0.5s var(--hm-ease); }
.hm-proj__card:hover .hm-proj__cat { background: var(--hm-sky); border-color: transparent; }
.hm-proj__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 24px 24px 26px; }
.hm-proj__title { margin: 0; font-size: 21px; font-weight: 800; line-height: 1.3; letter-spacing: -0.02em; color: #fff; text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45); }
.hm-proj__bar { display: block; width: 32px; height: 2px; margin: 14px 0 10px; background: var(--hm-sky); transition: width 0.6s var(--hm-ease); }
.hm-proj__card:hover .hm-proj__bar { width: 64px; }
.hm-proj__meta { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.8); }
.hm-proj__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 13.5px; font-weight: 700; color: #fff; opacity: 0; transform: translateY(6px); transition: opacity 0.5s var(--hm-ease), transform 0.5s var(--hm-ease); }
.hm-proj__card:hover .hm-proj__more { opacity: 1; transform: none; }
.hm-clients__label { margin: clamp(40px, 5vw, 64px) 0 20px; }
.hm-clients { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.hm-clients__track { display: flex; width: max-content; animation: hm-marquee 46s linear infinite; }
.hm-clients:hover .hm-clients__track { animation-play-state: paused; }
.hm-clients__list { display: flex; gap: 12px; margin: 0; padding: 0 6px; list-style: none; }
.hm-clients__list li { white-space: nowrap; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--hm-line); background: #fff; font-size: 15px; font-weight: 600; color: var(--hm-text); }
@keyframes hm-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hm-clients__track { animation: none; } }
@media (max-width: 767px) { .hm-proj__body { padding: 18px; } .hm-proj__title { font-size: 18px; } .hm-proj__cat { top: 14px; left: 14px; } .hm-proj__more { display: none; } }

/* ---------- 12. 뉴스 ---------- */
.hm-news__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.hm-newsitem a { display: block; height: 100%; }
.hm-newsitem__media { position: relative; aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; background: #e5e7eb; }
.hm-newsitem__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 1s var(--hm-ease); }
.hm-newsitem a:hover .hm-newsitem__media img { transform: scale(1.08); }
.hm-newsitem__body { padding: 20px 4px 0; }
.hm-newsitem__meta { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 14px; color: var(--hm-muted); }
.hm-newsitem__cat { padding: 3px 9px; border-radius: 6px; background: var(--hm-navy); color: #fff; font-size: 12px; font-weight: 700; }
.hm-newsitem__title { margin: 0 0 8px; font-size: 19px; font-weight: 700; line-height: 1.45; letter-spacing: -0.01em; color: var(--hm-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.3s var(--hm-ease); }
.hm-newsitem a:hover .hm-newsitem__title { color: var(--hm-blue); }
.hm-newsitem__excerpt { margin: 0; font-size: 15px; line-height: 1.65; color: var(--hm-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-news__empty { padding: 40px 24px; border: 1px dashed var(--hm-line); border-radius: 16px; text-align: center; color: var(--hm-muted); font-size: 15px; }
@media (max-width: 1024px) { .hm-news__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .hm-news__grid { grid-template-columns: 1fr; gap: 22px; } }

/* ---------- 13. CTA 밴드 ---------- */
.hm-cta { position: relative; overflow: hidden; padding: clamp(64px, 8vw, 120px) 0; background: var(--hm-navy-deep); color: #fff; }
.hm-cta__bg { position: absolute; inset: -12% 0; z-index: 0; }
.hm-cta__bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.22; will-change: transform; }
.hm-cta::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(90deg, rgba(11, 31, 77, 0.95) 0%, rgba(11, 31, 77, 0.7) 60%, rgba(11, 31, 77, 0.35) 100%); }
.hm-cta__in { position: relative; z-index: 1; display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 40px; }
.hm-cta .hm-label { color: var(--hm-sky); }
.hm-cta__actions { display: flex; flex-direction: column; align-items: flex-end; gap: 24px; }
.hm-cta__tel { display: inline-flex; align-items: center; gap: 14px; color: #fff; }
.hm-cta__tel em { display: block; font-style: normal; font-size: 13px; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.65); }
.hm-cta__tel strong { display: block; font-family: var(--hm-font-en); font-size: 27px; font-weight: 600; letter-spacing: 0.01em; }
@media (max-width: 767px) { .hm-cta__in { grid-template-columns: 1fr; gap: 28px; } .hm-cta__actions { align-items: flex-start; } }

/* ---------- 14. 푸터 (마크업 유지, 테마만) ---------- */
footer#bottom { background: var(--hm-dark); margin-top: 0 !important; padding: 64px 0 36px; border-top: 1px solid rgba(255, 255, 255, 0.06); }
footer#bottom #menu_member_100per { padding-top: 0; }
footer#bottom #menu_member { width: 100%; max-width: var(--hm-container); margin: 0 auto; padding: 0 20px; }
footer#bottom #menu_member::before { content: ""; display: block; width: 132px; height: 38px; margin-bottom: 26px; background: url(../img/hanmok/logo_white_h112.png) no-repeat left center / contain; opacity: 0.9; }
footer#bottom #menu_member ul { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 6px 26px; margin: 0; padding: 0; }
footer#bottom #menu_member ul li a span { font-size: 13px; color: rgba(255, 255, 255, 0.6); transition: color 0.3s var(--hm-ease); }
footer#bottom #menu_member ul li a:hover span { color: #fff; }
footer#bottom #menu_focus { display: none; }
footer#bottom #copyright { width: 100%; max-width: var(--hm-container); margin: 28px auto 0; padding: 26px 20px 0; border-top: 1px solid rgba(255, 255, 255, 0.08); }
footer#bottom #copyright .address { font-size: 13px; line-height: 1.95; color: rgba(255, 255, 255, 0.5); text-align: left; }
footer#bottom #copyright .address span { display: inline-block; margin-right: 18px; }
footer#bottom #copyright .address span.copy { display: block; margin-top: 10px; font-family: var(--hm-font-en); font-size: 12px; letter-spacing: 0.02em; color: rgba(255, 255, 255, 0.4); }
@media (min-width: 1300px) { footer#bottom #menu_member, footer#bottom #copyright { padding-left: 0; padding-right: 0; } }

/* ---------- 15. 서브 본문 컴포넌트 (.hm-article — 메뉴별 컨텐츠 HTML, TinyMCE 편집 가능) ---------- */  /* 2026-10-19: 서브 본문 글자 +1px(제목·숫자 제외, 사용자 요청) */
.hm-article { font-family: var(--hm-font-kr); color: var(--hm-text); font-size: 17px; line-height: 1.8; letter-spacing: -0.01em; word-break: keep-all; overflow-wrap: anywhere; }
.hm-article p { margin: 0 0 14px; }
.hm-article p:last-child { margin-bottom: 0; }
.hm-article a:not([class]) { color: var(--hm-blue); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(0, 120, 192, 0.35); }
.hm-article a:not([class]):hover { text-decoration-color: currentColor; }
.hm-article strong { color: var(--hm-ink); font-weight: 700; }
.hm-article small, .hm-note { font-size: 14px; color: var(--hm-muted); line-height: 1.7; }
.hm-article img { max-width: 100%; height: auto; }
.hm-article ul.hm-list, .hm-article ol.hm-list { margin: 0 0 14px; padding: 0; list-style: none; }
.hm-article ul.hm-list li { position: relative; padding-left: 18px; margin-bottom: 8px; }
.hm-article ul.hm-list li::before { content: ""; position: absolute; left: 2px; top: 0.72em; width: 6px; height: 6px; border-radius: 50%; background: var(--hm-blue); }
.hm-article ol.hm-list { counter-reset: hm; }
.hm-article ol.hm-list li { position: relative; padding-left: 34px; margin-bottom: 10px; counter-increment: hm; }
.hm-article ol.hm-list li::before { content: counter(hm, decimal-leading-zero); position: absolute; left: 0; top: 0.15em; font-family: var(--hm-font-en); font-weight: 600; font-size: 13px; color: var(--hm-blue); }

/* 섹션 블록 */
.hm-sec { margin: 0 0 clamp(52px, 6.5vw, 96px); }
.hm-sec:last-child { margin-bottom: 0; }
.hm-sec__head { margin-bottom: clamp(20px, 2.6vw, 32px); }
.hm-sec__head .hm-label { margin: 0 0 8px; }
.hm-sec__title { margin: 0; font-size: clamp(1.4rem, 1.12rem + 1.1vw, 2.05rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--hm-ink); }
.hm-sec__lead { margin: 12px 0 0; max-width: 820px; font-size: 17.5px; color: var(--hm-text); }
.hm-article h3.hm-h3 { margin: 30px 0 12px; font-size: clamp(1.08rem, 1rem + 0.35vw, 1.25rem); font-weight: 700; color: var(--hm-ink); letter-spacing: -0.01em; }
.hm-article h3.hm-h3:first-child { margin-top: 0; }

/* 인트로(리드) */
.hm-intro { position: relative; padding: 0 0 clamp(36px, 4vw, 56px); border-bottom: 1px solid var(--hm-line); }
.hm-intro .hm-label { margin: 0 0 14px; }
.hm-intro__title { margin: 0 0 18px; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.5rem); font-weight: 700; line-height: 1.28; letter-spacing: -0.025em; color: var(--hm-navy); }
.hm-intro__lead { margin: 0; max-width: 860px; font-size: calc(clamp(1rem, 0.96rem + 0.25vw, 1.15rem) + 1px); line-height: 1.8; color: var(--hm-text); }
.hm-intro__lead + .hm-intro__lead { margin-top: 10px; }
.hm-intro--grid { display: grid; gap: 24px; }
@media (min-width: 1025px) {
	.hm-intro--grid { grid-template-columns: 5fr 6fr; gap: 56px; align-items: start; }
	.hm-intro--grid .hm-intro__title { margin-bottom: 0; }
}

/* 대표 이미지 */
.hm-figure { margin: 0; }
.hm-figure img { display: block; width: 100%; height: auto; border-radius: 14px; }
.hm-figure figcaption { margin-top: 10px; font-size: 14px; color: var(--hm-muted); line-height: 1.6; }
.hm-figure--cover img { aspect-ratio: 21 / 9; object-fit: cover; }
.hm-figure--cover.hm-figure--tall img { aspect-ratio: 16 / 9; }
.hm-figure--frame img { border: 1px solid var(--hm-line); background: #fff; }
.hm-gallery { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
.hm-gallery .hm-figure img { aspect-ratio: 4 / 3; object-fit: cover; }
.hm-gallery--portrait .hm-figure img { aspect-ratio: 480 / 588; object-fit: cover; }
.hm-gallery--contain .hm-figure img { object-fit: contain; background: #fff; border: 1px solid var(--hm-line); }
@media (min-width: 768px) {
	.hm-gallery--3 { grid-template-columns: repeat(3, 1fr); }
	.hm-gallery--4 { grid-template-columns: repeat(4, 1fr); }
}
.hm-figure a.hm-zoom { position: relative; display: block; overflow: hidden; border-radius: 14px; }
.hm-figure a.hm-zoom img { transition: transform 0.6s var(--hm-ease); }
.hm-figure a.hm-zoom:hover img { transform: scale(1.04); }

/* 카드 그리드 */
.hm-cards { display: grid; gap: 16px; grid-template-columns: 1fr; }
.hm-card { position: relative; display: flex; flex-direction: column; padding: 26px 24px; border: 1px solid var(--hm-line); border-radius: 16px; background: #fff; transition: transform 0.4s var(--hm-ease), box-shadow 0.4s var(--hm-ease), border-color 0.4s var(--hm-ease); }
.hm-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(16, 48, 112, 0.1); border-color: rgba(0, 120, 192, 0.3); }
.hm-card__icon { display: inline-flex; width: 50px; height: 50px; margin-bottom: 18px; border-radius: 14px; background: rgba(0, 120, 192, 0.08); color: var(--hm-blue); align-items: center; justify-content: center; }
.hm-card__icon::before { content: ""; width: 26px; height: 26px; background: currentColor; -webkit-mask: var(--hm-icon) center / contain no-repeat; mask: var(--hm-icon) center / contain no-repeat; }
.hm-card__num { margin-bottom: 14px; font-family: var(--hm-font-en); font-weight: 600; font-size: 14px; letter-spacing: 0.12em; color: var(--hm-blue); }
.hm-card__title { margin: 0 0 10px; font-size: 18px; font-weight: 700; color: var(--hm-ink); line-height: 1.4; }
.hm-card__text { margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--hm-text); }
.hm-card__text + .hm-card__text { margin-top: 8px; }
.hm-card__meta { margin-top: auto; padding-top: 14px; font-size: 13.5px; color: var(--hm-muted); }
.hm-card--soft { background: var(--hm-bg-soft); border-color: transparent; }
.hm-card--navy { background: linear-gradient(145deg, var(--hm-navy), var(--hm-navy-deep)); border-color: transparent; color: rgba(255, 255, 255, 0.82); }
.hm-card--navy .hm-card__title { color: #fff; }
.hm-card--navy .hm-card__text { color: rgba(255, 255, 255, 0.82); }
.hm-card--navy .hm-card__icon { background: rgba(255, 255, 255, 0.12); color: var(--hm-sky); }
.hm-card--navy .hm-card__num { color: var(--hm-sky); }
.hm-card--link { text-decoration: none; color: inherit; }
.hm-card--link .hm-card__more { margin-top: auto; padding-top: 16px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--hm-blue); }
.hm-card--link .hm-card__more::after { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--hm-icon-arrow) center / contain no-repeat; mask: var(--hm-icon-arrow) center / contain no-repeat; transition: transform 0.3s var(--hm-ease); }
.hm-card--link:hover .hm-card__more::after { transform: translateX(4px); }
.hm-card--media { padding: 0; overflow: hidden; }
.hm-card--media img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.hm-card--media .hm-card__body { padding: 20px 22px 22px; }
@media (min-width: 768px) {
	.hm-cards--2 { grid-template-columns: repeat(2, 1fr); }
	.hm-cards--3 { grid-template-columns: repeat(2, 1fr); }
	.hm-cards--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1025px) {
	.hm-cards { gap: 20px; }
	.hm-cards--3 { grid-template-columns: repeat(3, 1fr); }
	.hm-cards--4 { grid-template-columns: repeat(4, 1fr); }
}

/* 숫자 */
.hm-nums { display: grid; gap: 14px; grid-template-columns: repeat(2, 1fr); }
.hm-num { padding: 22px 20px; border-radius: 14px; background: var(--hm-bg-soft); }
.hm-num__value { margin: 0; font-family: var(--hm-font-en); font-weight: 700; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.5rem); line-height: 1.1; letter-spacing: -0.02em; color: var(--hm-navy); }
.hm-num__value em { font-style: normal; font-size: 0.55em; margin-left: 2px; font-family: var(--hm-font-kr); font-weight: 700; }
.hm-num__label { margin: 8px 0 0; font-size: 16.5px; font-weight: 600; color: var(--hm-ink); }
.hm-num__src { margin: 4px 0 0; font-size: 14px; color: var(--hm-text); line-height: 1.5; }
@media (min-width: 1025px) { .hm-nums { grid-template-columns: repeat(4, 1fr); gap: 18px; } .hm-num { padding: 26px 24px; } .hm-nums--3 { grid-template-columns: repeat(3, 1fr); } }

/* 프로세스 단계 */
.hm-steps-v { display: grid; gap: 14px; grid-template-columns: 1fr; counter-reset: step; list-style: none; margin: 0; padding: 0; }
.hm-step { position: relative; padding: 22px 22px 22px 24px; border-radius: 14px; background: #fff; border: 1px solid var(--hm-line); counter-increment: step; }
.hm-step::before { content: counter(step, decimal-leading-zero); display: block; margin-bottom: 12px; font-family: var(--hm-font-en); font-weight: 700; font-size: 26px; line-height: 1; color: var(--hm-sky); }
.hm-step__title { margin: 0 0 8px; font-size: 17px; font-weight: 700; color: var(--hm-ink); }
.hm-step__text { margin: 0; font-size: 15px; line-height: 1.7; color: var(--hm-text); }
@media (min-width: 768px) {
	.hm-steps-v { grid-template-columns: repeat(2, 1fr); }
	.hm-steps-v--3, .hm-steps-v--6 { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1025px) {
	.hm-steps-v--4, .hm-steps-v--8 { grid-template-columns: repeat(4, 1fr); }
	.hm-steps-v--5 { grid-template-columns: repeat(5, 1fr); }
	.hm-steps-v--6 { grid-template-columns: repeat(6, 1fr); }
	.hm-steps-v--6 .hm-step { padding: 20px 16px; }
	.hm-step:not(:last-child)::after { content: ""; position: absolute; top: 34px; right: -11px; width: 8px; height: 8px; border-top: 2px solid var(--hm-line); border-right: 2px solid var(--hm-line); transform: rotate(45deg); }
}

/* 사전·사중·사후 비교 */
.hm-phases { display: grid; gap: 16px; grid-template-columns: 1fr; }
.hm-phase { position: relative; padding: 28px 26px; border-radius: 18px; background: #fff; border: 1px solid var(--hm-line); }
.hm-phase__tag { display: inline-block; margin-bottom: 14px; padding: 5px 12px; border-radius: 999px; background: rgba(0, 120, 192, 0.1); color: var(--hm-blue); font-family: var(--hm-font-en); font-weight: 600; font-size: 13px; letter-spacing: 0.12em; }
.hm-phase__title { margin: 0 0 4px; font-size: 21px; font-weight: 700; color: var(--hm-ink); }
.hm-phase__when { margin: 0 0 16px; font-size: 14.5px; color: var(--hm-muted); }
.hm-phase--accent { background: linear-gradient(160deg, var(--hm-navy), var(--hm-navy-deep)); border-color: transparent; color: rgba(255, 255, 255, 0.85); }
.hm-phase--accent .hm-phase__title { color: #fff; }
.hm-phase--accent .hm-phase__when { color: rgba(255, 255, 255, 0.6); }
.hm-phase--accent .hm-phase__tag { background: rgba(255, 255, 255, 0.14); color: var(--hm-sky); }
.hm-phase--accent ul.hm-list li::before { background: var(--hm-sky); }
.hm-phase ul.hm-list { margin: 0; }
.hm-phase ul.hm-list li { font-size: 15.5px; margin-bottom: 6px; }
@media (min-width: 768px) { .hm-phases { grid-template-columns: repeat(3, 1fr); } }

/* 표 */
.hm-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 0 8px; border-radius: 12px; }
.hm-table { width: 100%; min-width: 640px; border-collapse: collapse; border-top: 2px solid var(--hm-navy); font-size: 15.5px; line-height: 1.65; }
.hm-table th, .hm-table td { padding: 14px 16px; border-bottom: 1px solid var(--hm-line); text-align: left; vertical-align: top; }
.hm-table td { color: var(--hm-ink); } /* 2026-10-19: 표 본문 글자 진하게(실적 목록 등, 사용자 요청) */
.hm-table th { background: var(--hm-bg-soft); font-weight: 700; color: var(--hm-ink); white-space: nowrap; }
.hm-table tbody th { background: #fff; font-weight: 700; color: var(--hm-ink); white-space: normal; }
.hm-table td.c, .hm-table th.c { text-align: center; }
.hm-table td.num { font-family: var(--hm-font-en); white-space: nowrap; }
.hm-table td.nw { white-space: nowrap; }
.hm-table--sm { min-width: 520px; font-size: 15.5px; }
.hm-table--sm th, .hm-table--sm td { padding: 10px 12px; }
.hm-table--kv { min-width: 0; }
.hm-table--kv th { width: 180px; }
.hm-table tr.hl td { background: rgba(0, 120, 192, 0.05); }
.hm-grade { display: inline-block; min-width: 26px; padding: 2px 8px; border-radius: 6px; font-family: var(--hm-font-en); font-weight: 700; font-size: 13.5px; text-align: center; color: #fff; background: var(--hm-blue); }
.hm-grade--a { background: #16a34a; } .hm-grade--b { background: #0ea5e9; } .hm-grade--c { background: #f59e0b; } .hm-grade--d { background: #ea580c; } .hm-grade--e { background: #dc2626; }

/* 콜아웃 */
.hm-callout { position: relative; padding: 20px 22px 20px 56px; border-radius: 14px; background: rgba(0, 120, 192, 0.06); border: 1px solid rgba(0, 120, 192, 0.14); font-size: 17px; line-height: 1.75; }
.hm-article > .hm-callout { margin-bottom: clamp(40px, 5vw, 64px); } /* 2026-10-19: 섹션 밖 단독 콜아웃(이용 안내 등)과 다음 CTA 밴드 간격 */
.hm-callout::before { content: ""; position: absolute; left: 20px; top: 21px; width: 22px; height: 22px; background: var(--hm-blue); -webkit-mask: var(--hm-icon-info) center / contain no-repeat; mask: var(--hm-icon-info) center / contain no-repeat; }
.hm-callout--warn { background: #fff8e6; border-color: #f6dca0; }
.hm-callout--warn::before { background: var(--hm-accent-deep); -webkit-mask-image: var(--hm-icon-alert); mask-image: var(--hm-icon-alert); }
.hm-callout--law { background: var(--hm-bg-soft); border-color: var(--hm-line); }
.hm-callout--law::before { background: var(--hm-navy); -webkit-mask-image: var(--hm-icon-scale); mask-image: var(--hm-icon-scale); }
.hm-callout__title { display: block; margin-bottom: 4px; font-weight: 700; color: var(--hm-ink); }
.hm-callout p { margin: 0; }
.hm-callout p + p { margin-top: 8px; }

/* FAQ 아코디언 (js/hanmok.js) */
.hm-faq { border-top: 2px solid var(--hm-navy); }
.hm-faq__item { border-bottom: 1px solid var(--hm-line); }
.hm-faq__q { position: relative; display: flex; align-items: flex-start; gap: 14px; width: 100%; margin: 0; padding: 20px 48px 20px 0; background: none; border: 0; text-align: left; font: inherit; font-size: 17.5px; font-weight: 700; color: var(--hm-ink); cursor: pointer; transition: color 0.25s; }
.hm-faq__q::before { content: "Q"; flex: 0 0 auto; font-family: var(--hm-font-en); font-weight: 700; color: var(--hm-blue); }
.hm-faq__q::after { content: ""; position: absolute; right: 6px; top: 24px; width: 14px; height: 14px; background: linear-gradient(var(--hm-muted), var(--hm-muted)) center / 100% 2px no-repeat, linear-gradient(var(--hm-muted), var(--hm-muted)) center / 2px 100% no-repeat; transition: transform 0.35s var(--hm-ease); }
.hm-faq__item.is-open .hm-faq__q { color: var(--hm-blue); }
.hm-faq__item.is-open .hm-faq__q::after { transform: rotate(45deg); }
.hm-faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s var(--hm-ease); }
.hm-faq__a > div { overflow: hidden; }
.hm-faq__item.is-open .hm-faq__a { grid-template-rows: 1fr; }
.hm-faq__body { padding: 0 0 22px 30px; font-size: 16px; line-height: 1.8; color: var(--hm-text); }
.hm-faq__body p { margin: 0 0 10px; }
.hm-faq__body p:last-child { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .hm-faq__a { transition: none; } }

/* 연혁 타임라인 */
.hm-timeline { position: relative; margin: 0; padding: 0; list-style: none; }
.hm-tl { position: relative; display: grid; grid-template-columns: 1fr; gap: 10px 36px; padding: 0 0 40px 0; }
.hm-tl__year { font-family: var(--hm-font-en); font-weight: 700; font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.6rem); line-height: 1; color: var(--hm-navy); letter-spacing: -0.02em; }
.hm-tl__items { margin: 0; padding: 0; list-style: none; position: relative; }
.hm-tl__items li { position: relative; display: grid; grid-template-columns: 52px 1fr; gap: 14px; padding: 0 0 14px 24px; font-size: 17.5px; line-height: 1.65; }
.hm-tl__items li::before { content: ""; position: absolute; left: 0; top: 10px; width: 8px; height: 8px; border-radius: 50%; background: var(--hm-blue); box-shadow: 0 0 0 4px rgba(0, 120, 192, 0.15); }
.hm-tl__items li::after { content: ""; position: absolute; left: 3.5px; top: 20px; bottom: -4px; width: 1px; background: var(--hm-line); }
.hm-tl__items li:last-child::after { display: none; }
.hm-tl__month { font-family: var(--hm-font-en); font-weight: 600; font-size: 15px; color: var(--hm-muted); padding-top: 2px; }
.hm-tl__text { color: var(--hm-ink); }
.hm-tl__text small { display: block; font-size: 14.5px; color: var(--hm-muted); margin-top: 2px; }
@media (min-width: 768px) { .hm-tl { grid-template-columns: 150px 1fr; } }

/* 증빙 카드 (인증·특허) */
.hm-certs { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
.hm-cert { display: flex; flex-direction: column; border: 1px solid var(--hm-line); border-radius: 14px; overflow: hidden; background: #fff; transition: transform 0.4s var(--hm-ease), box-shadow 0.4s var(--hm-ease); }
.hm-cert:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(16, 48, 112, 0.12); }
.hm-cert__thumb { display: block; position: relative; aspect-ratio: 3 / 4; background: var(--hm-bg-soft); overflow: hidden; }
.hm-cert__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; transition: transform 0.6s var(--hm-ease); }
.hm-cert:hover .hm-cert__thumb img { transform: scale(1.03); }
.hm-cert__thumb::after { content: ""; position: absolute; right: 10px; bottom: 10px; width: 30px; height: 30px; border-radius: 50%; background: rgba(11, 18, 32, 0.6) var(--hm-icon-zoom) center / 16px no-repeat; }
.hm-cert__body { padding: 14px 16px 16px; }
.hm-cert__type { display: inline-block; margin-bottom: 6px; font-family: var(--hm-font-en); font-weight: 600; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--hm-blue); }
.hm-cert__name { margin: 0 0 4px; font-size: 15.5px; font-weight: 700; color: var(--hm-ink); line-height: 1.45; }
.hm-cert__meta { margin: 0; font-size: 13.5px; color: var(--hm-text); line-height: 1.55; }
@media (min-width: 768px) { .hm-certs { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); } } /* 2026-10-19: 3장 묶음도 가로 100% 채움(5열 고정 → 항목 수만큼 균등) */
@media (min-width: 1025px) { .hm-certs { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; } }
.hm-badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none; }
.hm-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--hm-line); background: #fff; font-size: 14px; font-weight: 600; color: var(--hm-ink); }
.hm-badge::before { content: ""; width: 14px; height: 14px; background: var(--hm-blue); -webkit-mask: var(--hm-icon-check) center / contain no-repeat; mask: var(--hm-icon-check) center / contain no-repeat; }

/* 라이트박스 (js/hanmok.js) */
.hm-lightbox { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(11, 18, 32, 0.9); }
.hm-lightbox.is-open { display: flex; animation: hm-fade 0.3s var(--hm-ease); }
.hm-lightbox img { max-width: min(92vw, 1100px); max-height: 90vh; width: auto; height: auto; border-radius: 10px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5); }
.hm-lightbox__close { position: absolute; top: 18px; right: 18px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.12); cursor: pointer; }
.hm-lightbox__close::before, .hm-lightbox__close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 20px; height: 2px; background: #fff; transform: translate(-50%, -50%) rotate(45deg); }
.hm-lightbox__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.hm-lightbox__cap { position: absolute; left: 0; right: 0; bottom: 18px; text-align: center; font-size: 13px; color: rgba(255, 255, 255, 0.75); }
@keyframes hm-fade { from { opacity: 0; } to { opacity: 1; } }

/* 2단 (텍스트+이미지) */
.hm-two { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: center; }
.hm-two > *, .hm-cards > *, .hm-phases > *, .hm-gallery > *, .hm-nums > *, .hm-certs > * { min-width: 0; } /* 2026-10-19: 모바일에서 표·긴 내용 때문에 1fr 열이 콘텐츠 폭(520px)으로 늘어나 가로 스크롤 생기던 문제 */
@media (min-width: 1025px) { .hm-two { grid-template-columns: 1.05fr 0.95fr; gap: 56px; } .hm-two--reverse > :first-child { order: 2; } }

/* 정의 목록 (회사 정보) */
.hm-kv { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; border-top: 2px solid var(--hm-navy); }
.hm-kv > div { display: grid; grid-template-columns: 120px 1fr; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--hm-line); font-size: 16px; }
.hm-kv dt { font-weight: 700; color: var(--hm-ink); }
.hm-kv dd { margin: 0; color: var(--hm-text); }
@media (min-width: 768px) { .hm-kv { grid-template-columns: 1fr 1fr; column-gap: 40px; } .hm-kv > div { grid-template-columns: 140px 1fr; } }

/* CEO 인사말 */
.hm-greeting { display: grid; gap: 32px; grid-template-columns: 1fr; }
.hm-greeting__visual { position: relative; border-radius: 20px; overflow: hidden; background: linear-gradient(160deg, var(--hm-navy), var(--hm-dark)); min-height: 280px; }
.hm-greeting__visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.55; }
.hm-greeting__visual .hm-greeting__caption { position: absolute; left: 26px; right: 26px; bottom: 24px; color: #fff; }
.hm-greeting__caption strong { display: block; font-size: 20px; margin-bottom: 4px; }
.hm-greeting__caption span { font-size: 13px; opacity: 0.75; }
.hm-greeting__slogan { margin: 0 0 22px; font-size: clamp(1.5rem, 1.2rem + 1.3vw, 2.3rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--hm-navy); }
.hm-greeting__slogan em { font-style: normal; color: var(--hm-blue); }
.hm-greeting__body p { font-size: 17.5px; line-height: 1.9; }
.hm-greeting__sign { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--hm-line); font-size: 16px; color: var(--hm-muted); }
.hm-greeting__sign strong { display: inline-block; margin-left: 10px; font-size: 21px; color: var(--hm-ink); letter-spacing: 0.08em; }
@media (min-width: 1025px) { .hm-greeting { grid-template-columns: 0.85fr 1.15fr; gap: 64px; align-items: stretch; } .hm-greeting__visual { min-height: 100%; } }
/* 2026-10-19: 대표 프로필 누끼 카드 — 네이비 그라데이션 + 글로우, 사진 하단 정렬(contain), 캡션 상단 */
.hm-greeting__visual--ceo { background: linear-gradient(160deg, #143a85 0%, var(--hm-navy) 40%, var(--hm-navy-deep) 100%); aspect-ratio: 4 / 5; min-height: 0; }
.hm-greeting__visual--ceo::before { content: ""; position: absolute; left: 50%; top: 58%; width: 120%; height: 90%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(59, 163, 230, 0.38), transparent 62%); pointer-events: none; }
.hm-greeting__visual--ceo img { position: absolute; inset: 84px 0 0 0; width: 100%; height: calc(100% - 84px); object-fit: contain; object-position: center bottom; opacity: 1; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.35)); } /* 상단 84px은 캡션 자리 — 사진과 겹치지 않게 */
.hm-greeting__visual--ceo .hm-greeting__caption { top: 24px; bottom: auto; }
.hm-greeting__visual .hm-greeting__caption strong, .hm-greeting__visual .hm-greeting__caption span { color: #fff; } /* 2026-10-19: 본문용 strong 색(.hm-article strong 등)보다 우선 — 캡션 글자 흰색 고정 */
@media (max-width: 1024px) { .hm-greeting__visual--ceo { aspect-ratio: 1 / 1; } }
@media (min-width: 1025px) { .hm-greeting__visual--ceo { aspect-ratio: auto; min-height: 100%; } }
.hm-values { display: grid; gap: 14px; grid-template-columns: 1fr; counter-reset: v; }
.hm-value { padding: 24px; border-radius: 16px; background: var(--hm-bg-soft); counter-increment: v; }
.hm-value::before { content: "0" counter(v); display: block; margin-bottom: 10px; font-family: var(--hm-font-en); font-weight: 700; font-size: 13px; letter-spacing: 0.14em; color: var(--hm-blue); }
.hm-value h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--hm-ink); }
.hm-value p { margin: 0; font-size: 15.5px; }
@media (min-width: 768px) { .hm-values { grid-template-columns: repeat(3, 1fr); } }

/* 고객사 칩 */
.hm-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.hm-chip { display: inline-flex; align-items: center; padding: 10px 16px; border-radius: 10px; border: 1px solid var(--hm-line); background: #fff; font-size: 15.5px; font-weight: 600; color: var(--hm-ink); transition: transform 0.3s var(--hm-ease), box-shadow 0.3s var(--hm-ease); }
.hm-chip:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(16, 48, 112, 0.1); }
.hm-chip--public { border-color: rgba(16, 48, 112, 0.25); color: var(--hm-navy); background: rgba(16, 48, 112, 0.04); }
.hm-chip__n { margin-left: 8px; font-family: var(--hm-font-en); font-size: 13px; font-weight: 600; color: var(--hm-blue); }

/* 실적 목록 (필터, js/hanmok.js) */
.hm-perf__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 18px; }
.hm-perf__filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.hm-perf__filters button { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--hm-line); background: #fff; font: inherit; font-size: 14.5px; font-weight: 600; color: var(--hm-text); cursor: pointer; transition: all 0.25s var(--hm-ease); }
.hm-perf__filters button:hover { border-color: var(--hm-blue); color: var(--hm-blue); }
.hm-perf__filters button.is-on { background: var(--hm-navy); border-color: var(--hm-navy); color: #fff; }
.hm-perf__search { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.hm-perf__search input { height: 40px; width: min(260px, 70vw); padding: 0 14px; border: 1px solid var(--hm-line); border-radius: 10px; font: inherit; font-size: 15px; }
.hm-perf__search input:focus { outline: 2px solid rgba(0, 120, 192, 0.35); border-color: var(--hm-blue); }
.hm-perf__count { font-size: 14.5px; color: var(--hm-muted); }
.hm-perf__count strong { color: var(--hm-blue); font-family: var(--hm-font-en); }
.hm-perf tr.is-hidden { display: none; }
.hm-perf .hm-table td.type { white-space: nowrap; }
.hm-tag { display: inline-block; padding: 3px 9px; border-radius: 6px; font-size: 13px; font-weight: 600; background: var(--hm-bg-soft); color: var(--hm-text); white-space: nowrap; }
.hm-tag--pre { background: rgba(0, 120, 192, 0.1); color: var(--hm-blue); }
.hm-tag--mid { background: rgba(245, 158, 11, 0.14); color: #b45309; }
.hm-tag--post { background: rgba(22, 163, 74, 0.12); color: #15803d; }
.hm-tag--design { background: rgba(16, 48, 112, 0.1); color: var(--hm-navy); }
.hm-tag--reverse { background: rgba(124, 58, 237, 0.1); color: #6d28d9; }
.hm-tag--noise { background: rgba(220, 38, 38, 0.1); color: #b91c1c; }
.hm-perf__empty { display: none; padding: 40px 0; text-align: center; color: var(--hm-muted); }
.hm-perf.is-empty .hm-perf__empty { display: block; }

/* 영상·지도 */
.hm-video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; }
.hm-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.hm-videos { display: grid; gap: 20px; grid-template-columns: 1fr; }
.hm-videos .hm-video__title { margin: 10px 0 0; font-size: 16px; font-weight: 700; color: var(--hm-ink); }
.hm-videos .hm-video__desc { margin: 2px 0 0; font-size: 14px; color: var(--hm-muted); }
@media (min-width: 768px) { .hm-videos { grid-template-columns: repeat(2, 1fr); } .hm-videos--1 { grid-template-columns: 1fr; } }
.hm-map { position: relative; width: 100%; aspect-ratio: 16 / 8; min-height: 300px; border-radius: 16px; overflow: hidden; border: 1px solid var(--hm-line); background: var(--hm-bg-soft); }
.hm-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.hm-contact { display: grid; gap: 14px; grid-template-columns: 1fr; }
.hm-contact__item { display: flex; gap: 14px; padding: 20px 22px; border-radius: 14px; background: var(--hm-bg-soft); }
.hm-contact__item::before { content: ""; flex: 0 0 auto; width: 24px; height: 24px; margin-top: 2px; background: var(--hm-blue); -webkit-mask: var(--hm-icon) center / contain no-repeat; mask: var(--hm-icon) center / contain no-repeat; }
.hm-contact__item strong { display: block; margin-bottom: 4px; font-size: 14px; letter-spacing: 0.06em; color: var(--hm-muted); font-weight: 600; }
.hm-contact__item span { font-size: 17px; font-weight: 600; color: var(--hm-ink); line-height: 1.55; }
.hm-contact__item a { color: var(--hm-ink); }
@media (min-width: 768px) { .hm-contact { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1025px) { .hm-contact { grid-template-columns: repeat(4, 1fr); } }

/* 장비·조직 */
.hm-equip { display: grid; gap: 14px; grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; }
.hm-equip li { display: grid; grid-template-columns: 52px 1fr; gap: 16px; padding: 18px 18px; border-radius: 14px; border: 1px solid var(--hm-line); background: #fff; }
.hm-equip__icon { width: 52px; height: 52px; border-radius: 14px; background: var(--hm-bg-soft); position: relative; }
.hm-equip__icon::before { content: ""; position: absolute; inset: 13px; background: var(--hm-navy); -webkit-mask: var(--hm-icon) center / contain no-repeat; mask: var(--hm-icon) center / contain no-repeat; }
.hm-equip li.hm-equip--photo { grid-template-columns: 96px 1fr; align-items: center; } /* 2026-10-16: 장비 사진(담당자 자료) */
.hm-equip__img { display: block; width: 96px; height: 72px; border-radius: 10px; overflow: hidden; background: #fff; border: 1px solid var(--hm-line-soft); }
.hm-equip__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hm-equip strong { display: block; margin-bottom: 4px; font-size: 16.5px; color: var(--hm-ink); }
.hm-equip span { font-size: 14.5px; color: var(--hm-text); line-height: 1.6; }
@media (min-width: 768px) { .hm-equip { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1025px) { .hm-equip { grid-template-columns: repeat(3, 1fr); } }
.hm-org { display: flex; flex-direction: column; align-items: center; gap: 0; }
.hm-org__top { padding: 16px 36px; border-radius: 12px; background: var(--hm-navy); color: #fff; font-weight: 700; font-size: 17px; }
.hm-org__line { width: 1px; height: 28px; background: var(--hm-line); }
.hm-org__mid { padding: 12px 28px; border-radius: 12px; border: 1px solid var(--hm-line); background: var(--hm-bg-soft); font-weight: 700; color: var(--hm-ink); font-size: 15.5px; }
.hm-org__row { display: grid; gap: 12px; grid-template-columns: 1fr; width: 100%; margin-top: 28px; position: relative; }
.hm-org__unit { padding: 20px 18px; border-radius: 14px; border: 1px solid var(--hm-line); background: #fff; text-align: center; }
.hm-org__unit strong { display: block; margin-bottom: 8px; font-size: 16.5px; color: var(--hm-navy); }
.hm-org__unit span { display: block; font-size: 14px; color: var(--hm-text); line-height: 1.6; }
@media (min-width: 768px) { .hm-org__row { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1025px) { .hm-org__row { grid-template-columns: repeat(4, 1fr); } .hm-org__row::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: -14px; height: 1px; background: var(--hm-line); } .hm-org__unit { position: relative; } .hm-org__unit::before { content: ""; position: absolute; left: 50%; top: -14px; width: 1px; height: 14px; background: var(--hm-line); } }

/* CTA 밴드 (본문용) */
.hm-cta-inline { display: flex; flex-direction: column; gap: 20px; padding: clamp(28px, 4vw, 48px); border-radius: 22px; background: linear-gradient(135deg, var(--hm-navy) 0%, var(--hm-navy-deep) 60%, #081633 100%); color: #fff; position: relative; overflow: hidden; }
.hm-cta-inline::after { content: ""; position: absolute; right: -80px; top: -80px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(59, 163, 230, 0.35), transparent 65%); pointer-events: none; }
.hm-cta-inline__title { margin: 0 0 8px; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.8rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: #fff; }
.hm-cta-inline__text { margin: 0; font-size: 16px; color: rgba(255, 255, 255, 0.75); max-width: 640px; }
.hm-cta-inline__btns { display: flex; flex-wrap: wrap; gap: 10px; position: relative; z-index: 1; }
.hm-cta-inline .hm-btn { height: 50px; padding: 0 22px; font-size: 15.5px; }
.hm-cta-inline .hm-btn::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--hm-icon-arrow) center / contain no-repeat; mask: var(--hm-icon-arrow) center / contain no-repeat; transition: transform 0.3s var(--hm-ease); }
.hm-cta-inline .hm-btn:hover::after { transform: translateX(4px); }
@media (min-width: 1025px) { .hm-cta-inline { flex-direction: row; align-items: center; justify-content: space-between; } }

/* 출처·검수 메모 */
.hm-src { padding-top: 28px; border-top: 1px solid var(--hm-line); }
.hm-src h3 { margin: 0 0 12px; font-size: 15px; font-weight: 700; letter-spacing: 0.02em; color: var(--hm-ink); }
.hm-src ol { margin: 0; padding: 0 0 0 22px; font-size: 15px; line-height: 1.7; color: var(--hm-muted); }
.hm-src ol li { margin-bottom: 4px; }
.hm-src a { color: var(--hm-muted); text-decoration: underline; text-underline-offset: 2px; word-break: break-all; }
.hm-src a:hover { color: var(--hm-blue); }
.hm-review { margin-top: 40px; padding: 22px 24px 22px 56px; border: 1.5px dashed #e3b341; border-radius: 14px; background: #fffbea; font-size: 14px; line-height: 1.7; color: #5b4a12; position: relative; }
.hm-review::before { content: ""; position: absolute; left: 20px; top: 24px; width: 22px; height: 22px; background: #b7791f; -webkit-mask: var(--hm-icon-pen) center / contain no-repeat; mask: var(--hm-icon-pen) center / contain no-repeat; }
.hm-review__title { display: block; margin-bottom: 8px; font-weight: 700; color: #7a5a0a; }
.hm-review__title small { font-weight: 500; margin-left: 8px; color: #a07a1e; }
.hm-review ol { margin: 0; padding-left: 20px; }
.hm-review ol li { margin-bottom: 4px; }

/* 법령 표 */
.hm-law .hm-table td:first-child { font-weight: 700; color: var(--hm-ink); }
.hm-law .hm-table td a { font-size: 15px; }

/* ---------- 16. CSS 아이콘 (mask용 data URI, 생성: _source/content_gen/make_icons.py) ---------- */
:root {
	--hm-icon-info: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M12%2016v-4'/%3E%3Cpath%20d='M12%208h.01'/%3E%3C/svg%3E");
	--hm-icon-alert: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m21.73%2018-8-14a2%202%200%200%200-3.48%200l-8%2014A2%202%200%200%200%204%2021h16a2%202%200%200%200%201.73-3'/%3E%3Cpath%20d='M12%209v4'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
	--hm-icon-scale: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m16%2016%203-8%203%208c-.87.65-1.92%201-3%201s-2.13-.35-3-1'/%3E%3Cpath%20d='m2%2016%203-8%203%208c-.87.65-1.92%201-3%201s-2.13-.35-3-1'/%3E%3Cpath%20d='M7%2021h10'/%3E%3Cpath%20d='M12%203v18'/%3E%3Cpath%20d='M3%207h2c2%200%205-1%207-2%202%201%205%202%207%202h2'/%3E%3C/svg%3E");
	--hm-icon-arrow: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%2012h14'/%3E%3Cpath%20d='m12%205%207%207-7%207'/%3E%3C/svg%3E");
	--hm-icon-check: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20%206%209%2017l-5-5'/%3E%3C/svg%3E");
	--hm-icon-zoom: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='11'%20cy='11'%20r='8'/%3E%3Cpath%20d='m21%2021-4.3-4.3'/%3E%3Cpath%20d='M11%208v6'/%3E%3Cpath%20d='M8%2011h6'/%3E%3C/svg%3E");
	--hm-icon-pen: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21.174%206.812a1%201%200%200%200-3.986-3.987L3.842%2016.174a2%202%200%200%200-.5.83l-1.321%204.352a.5.5%200%200%200%20.623.622l4.353-1.32a2%202%200%200%200%20.83-.497z'/%3E%3Cpath%20d='m15%205%204%204'/%3E%3C/svg%3E");
	--hm-icon-search: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='11'%20cy='11'%20r='8'/%3E%3Cpath%20d='m21%2021-4.3-4.3'/%3E%3C/svg%3E");
	--hm-icon-shield: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20%2013c0%205-3.5%207.5-7.66%208.95a1%201%200%200%201-.67-.01C7.5%2020.5%204%2018%204%2013V6a1%201%200%200%201%201-1c2%200%204.5-1.2%206.24-2.72a1.17%201.17%200%200%201%201.52%200C14.51%203.81%2017%205%2019%205a1%201%200%200%201%201%201z'/%3E%3Cpath%20d='m9%2012%202%202%204-4'/%3E%3C/svg%3E");
	--hm-icon-file: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M15%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V7Z'/%3E%3Cpath%20d='M14%202v4a2%202%200%200%200%202%202h4'/%3E%3Cpath%20d='M10%209H8'/%3E%3Cpath%20d='M16%2013H8'/%3E%3Cpath%20d='M16%2017H8'/%3E%3C/svg%3E");
	--hm-icon-ruler: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21.3%2015.3a2.4%202.4%200%200%201%200%203.4l-2.6%202.6a2.4%202.4%200%200%201-3.4%200L2.7%208.7a2.41%202.41%200%200%201%200-3.4l2.6-2.6a2.41%202.41%200%200%201%203.4%200Z'/%3E%3Cpath%20d='m14.5%2012.5%202-2'/%3E%3Cpath%20d='m11.5%209.5%202-2'/%3E%3Cpath%20d='m8.5%206.5%202-2'/%3E%3Cpath%20d='m17.5%2015.5%202-2'/%3E%3C/svg%3E");
	--hm-icon-camera: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M14.5%204h-5L7%207H4a2%202%200%200%200-2%202v9a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2V9a2%202%200%200%200-2-2h-3l-2.5-3z'/%3E%3Ccircle%20cx='12'%20cy='13'%20r='3'/%3E%3C/svg%3E");
	--hm-icon-drone: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M10%2010%207%207'/%3E%3Cpath%20d='m14%2010%203-3'/%3E%3Cpath%20d='m10%2014-3%203'/%3E%3Cpath%20d='m14%2014%203%203'/%3E%3Crect%20x='9'%20y='9'%20width='6'%20height='6'%20rx='1'/%3E%3Ccircle%20cx='5'%20cy='5'%20r='3'/%3E%3Ccircle%20cx='19'%20cy='5'%20r='3'/%3E%3Ccircle%20cx='5'%20cy='19'%20r='3'/%3E%3Ccircle%20cx='19'%20cy='19'%20r='3'/%3E%3C/svg%3E");
	--hm-icon-building: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='2'%20width='16'%20height='20'%20rx='2'/%3E%3Cpath%20d='M9%2022v-4h6v4'/%3E%3Cpath%20d='M8%206h.01'/%3E%3Cpath%20d='M16%206h.01'/%3E%3Cpath%20d='M12%206h.01'/%3E%3Cpath%20d='M12%2010h.01'/%3E%3Cpath%20d='M12%2014h.01'/%3E%3Cpath%20d='M16%2010h.01'/%3E%3Cpath%20d='M16%2014h.01'/%3E%3Cpath%20d='M8%2010h.01'/%3E%3Cpath%20d='M8%2014h.01'/%3E%3C/svg%3E");
	--hm-icon-chart: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%203v16a2%202%200%200%200%202%202h16'/%3E%3Cpath%20d='M18%2017V9'/%3E%3Cpath%20d='M13%2017V5'/%3E%3Cpath%20d='M8%2017v-3'/%3E%3C/svg%3E");
	--hm-icon-clock: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M12%206v6l4%202'/%3E%3C/svg%3E");
	--hm-icon-pin: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20%2010c0%204.993-5.539%2010.193-7.399%2011.799a1%201%200%200%201-1.202%200C9.539%2020.193%204%2014.993%204%2010a8%208%200%200%201%2016%200'/%3E%3Ccircle%20cx='12'%20cy='10'%20r='3'/%3E%3C/svg%3E");
	--hm-icon-phone: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384'/%3E%3C/svg%3E");
	--hm-icon-mail: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='2'%20y='4'%20width='20'%20height='16'%20rx='2'/%3E%3Cpath%20d='m22%207-8.97%205.7a1.94%201.94%200%200%201-2.06%200L2%207'/%3E%3C/svg%3E");
	--hm-icon-printer: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%2018H4a2%202%200%200%201-2-2v-5a2%202%200%200%201%202-2h16a2%202%200%200%201%202%202v5a2%202%200%200%201-2%202h-2'/%3E%3Cpath%20d='M6%209V3a1%201%200%200%201%201-1h10a1%201%200%200%201%201%201v6'/%3E%3Crect%20x='6'%20y='14'%20width='12'%20height='8'%20rx='1'/%3E%3C/svg%3E");
	--hm-icon-layers: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12.83%202.18a2%202%200%200%200-1.66%200L2.6%206.08a1%201%200%200%200%200%201.83l8.58%203.91a2%202%200%200%200%201.66%200l8.58-3.9a1%201%200%200%200%200-1.83z'/%3E%3Cpath%20d='M2%2012a1%201%200%200%200%20.58.91l8.6%203.91a2%202%200%200%200%201.65%200l8.58-3.9A1%201%200%200%200%2022%2012'/%3E%3Cpath%20d='M2%2017a1%201%200%200%200%20.58.91l8.6%203.91a2%202%200%200%200%201.65%200l8.58-3.9A1%201%200%200%200%2022%2017'/%3E%3C/svg%3E");
	--hm-icon-activity: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M22%2012h-2.48a2%202%200%200%200-1.93%201.46l-2.35%208.36a.25.25%200%200%201-.48%200L9.24%202.18a.25.25%200%200%200-.48%200l-2.35%208.36A2%202%200%200%201%204.49%2012H2'/%3E%3C/svg%3E");
	--hm-icon-compass: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m12.99%206.74%201.93%203.44'/%3E%3Cpath%20d='M19.136%2012a10%2010%200%200%201-14.271%200'/%3E%3Cpath%20d='m21%2021-2.16-3.84'/%3E%3Cpath%20d='m3%2021%208.02-14.26'/%3E%3Ccircle%20cx='12'%20cy='5'%20r='2'/%3E%3C/svg%3E");
	--hm-icon-users: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2'/%3E%3Ccircle%20cx='9'%20cy='7'%20r='4'/%3E%3Cpath%20d='M22%2021v-2a4%204%200%200%200-3-3.87'/%3E%3Cpath%20d='M16%203.13a4%204%200%200%201%200%207.75'/%3E%3C/svg%3E");
	--hm-icon-map: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M14.106%205.553a2%202%200%200%200%201.788%200l3.659-1.83A1%201%200%200%201%2021%204.619v12.764a1%201%200%200%201-.553.894l-4.553%202.277a2%202%200%200%201-1.788%200l-4.212-2.106a2%202%200%200%200-1.788%200l-3.659%201.83A1%201%200%200%201%203%2019.381V6.618a1%201%200%200%201%20.553-.894l4.553-2.277a2%202%200%200%201%201.788%200z'/%3E%3Cpath%20d='M15%205.764v15'/%3E%3Cpath%20d='M9%203.236v15'/%3E%3C/svg%3E");
	--hm-icon-video: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m16%2013%205.223%203.482a.5.5%200%200%200%20.777-.416V7.87a.5.5%200%200%200-.752-.432L16%2010.5'/%3E%3Crect%20x='2'%20y='6'%20width='14'%20height='12'%20rx='2'/%3E%3C/svg%3E");
	--hm-icon-cloud: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M17.5%2019H9a7%207%200%201%201%206.71-9h1.79a4.5%204.5%200%201%201%200%209Z'/%3E%3C/svg%3E");
	--hm-icon-cpu: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='4'%20width='16'%20height='16'%20rx='2'/%3E%3Crect%20x='9'%20y='9'%20width='6'%20height='6'/%3E%3Cpath%20d='M15%202v2'/%3E%3Cpath%20d='M15%2020v2'/%3E%3Cpath%20d='M2%2015h2'/%3E%3Cpath%20d='M2%209h2'/%3E%3Cpath%20d='M20%2015h2'/%3E%3Cpath%20d='M20%209h2'/%3E%3Cpath%20d='M9%202v2'/%3E%3Cpath%20d='M9%2020v2'/%3E%3C/svg%3E");
	--hm-icon-hammer: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m15%2012-8.373%208.373a1%201%200%201%201-3-3L12%209'/%3E%3Cpath%20d='m18%2015%204-4'/%3E%3Cpath%20d='m21.5%2011.5-1.914-1.914A2%202%200%200%201%2019%208.172V7l-2.26-2.26a6%206%200%200%200-4.202-1.756L9%202.96l.92.82A6.18%206.18%200%200%201%2012%208.4V10l2%202h1.172a2%202%200%200%201%201.414.586L18.5%2014.5'/%3E%3C/svg%3E");
	--hm-icon-gauge: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m12%2014%204-4'/%3E%3Cpath%20d='M3.34%2019a10%2010%200%201%201%2017.32%200'/%3E%3C/svg%3E");
	--hm-icon-radar: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M19.07%204.93A10%2010%200%200%200%206.99%203.34'/%3E%3Cpath%20d='M4%206h.01'/%3E%3Cpath%20d='M2.29%209.62A10%2010%200%201%200%2021.31%208.35'/%3E%3Cpath%20d='M16.24%207.76A6%206%200%201%200%208.23%2016.67'/%3E%3Cpath%20d='M12%2018h.01'/%3E%3Cpath%20d='M17.99%2011.66A6%206%200%200%201%2015.77%2016.67'/%3E%3Ccircle%20cx='12'%20cy='12'%20r='2'/%3E%3Cpath%20d='m13.41%2010.59%205.66-5.66'/%3E%3C/svg%3E");
	--hm-icon-award: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m15.477%2012.89%201.515%208.526a.5.5%200%200%201-.81.47l-3.58-2.687a1%201%200%200%200-1.197%200l-3.586%202.686a.5.5%200%200%201-.81-.469l1.514-8.526'/%3E%3Ccircle%20cx='12'%20cy='8'%20r='6'/%3E%3C/svg%3E");
	--hm-icon-home: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M15%2021v-8a1%201%200%200%200-1-1h-4a1%201%200%200%200-1%201v8'/%3E%3Cpath%20d='M3%2010a2%202%200%200%201%20.709-1.528l7-5.999a2%202%200%200%201%202.582%200l7%205.999A2%202%200%200%201%2021%2010v9a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z'/%3E%3C/svg%3E");
	--hm-icon-train: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='3'%20width='16'%20height='16'%20rx='2'/%3E%3Cpath%20d='M4%2011h16'/%3E%3Cpath%20d='M12%203v8'/%3E%3Cpath%20d='m8%2019-2%203'/%3E%3Cpath%20d='m18%2022-2-3'/%3E%3Cpath%20d='M8%2015h.01'/%3E%3Cpath%20d='M16%2015h.01'/%3E%3C/svg%3E");
	--hm-icon-road: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2019%208%205'/%3E%3Cpath%20d='m16%205%204%2014'/%3E%3Cpath%20d='M12%208v2'/%3E%3Cpath%20d='M12%2013v2'/%3E%3Cpath%20d='M12%2018v1'/%3E%3C/svg%3E");
	--hm-icon-handshake: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m11%2017%202%202a1%201%200%201%200%203-3'/%3E%3Cpath%20d='m14%2014%202.5%202.5a1%201%200%201%200%203-3l-3.88-3.88a3%203%200%200%200-4.24%200l-.88.88a1%201%200%201%201-3-3l2.81-2.81a5.79%205.79%200%200%201%207.06-.87l.47.28a2%202%200%200%200%201.42.25L21%204'/%3E%3Cpath%20d='m21%203%201%2011h-2'/%3E%3Cpath%20d='M3%203%202%2014l6.5%206.5a1%201%200%201%200%203-3'/%3E%3Cpath%20d='M3%204h8'/%3E%3C/svg%3E");
	--hm-icon-speaker: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M11%204.702a.705.705%200%200%200-1.203-.498L6.413%207.587A1.4%201.4%200%200%201%205.416%208H3a1%201%200%200%200-1%201v6a1%201%200%200%200%201%201h2.416a1.4%201.4%200%200%201%20.997.413l3.383%203.384A.705.705%200%200%200%2011%2019.298z'/%3E%3Cpath%20d='M16%209a5%205%200%200%201%200%206'/%3E%3Cpath%20d='M19.364%2018.364a9%209%200%200%200%200-12.728'/%3E%3C/svg%3E");
	--hm-icon-calendar: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M8%202v4'/%3E%3Cpath%20d='M16%202v4'/%3E%3Crect%20x='3'%20y='4'%20width='18'%20height='18'%20rx='2'/%3E%3Cpath%20d='M3%2010h18'/%3E%3C/svg%3E");
	--hm-icon-list: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%2012h.01'/%3E%3Cpath%20d='M3%2018h.01'/%3E%3Cpath%20d='M3%206h.01'/%3E%3Cpath%20d='M8%2012h13'/%3E%3Cpath%20d='M8%2018h13'/%3E%3Cpath%20d='M8%206h13'/%3E%3C/svg%3E");
}
.hm-card__icon[data-icon="info"], .hm-contact__item[data-icon="info"], .hm-equip__icon[data-icon="info"] { --hm-icon: var(--hm-icon-info); }
.hm-card__icon[data-icon="alert"], .hm-contact__item[data-icon="alert"], .hm-equip__icon[data-icon="alert"] { --hm-icon: var(--hm-icon-alert); }
.hm-card__icon[data-icon="scale"], .hm-contact__item[data-icon="scale"], .hm-equip__icon[data-icon="scale"] { --hm-icon: var(--hm-icon-scale); }
.hm-card__icon[data-icon="arrow"], .hm-contact__item[data-icon="arrow"], .hm-equip__icon[data-icon="arrow"] { --hm-icon: var(--hm-icon-arrow); }
.hm-card__icon[data-icon="check"], .hm-contact__item[data-icon="check"], .hm-equip__icon[data-icon="check"] { --hm-icon: var(--hm-icon-check); }
.hm-card__icon[data-icon="zoom"], .hm-contact__item[data-icon="zoom"], .hm-equip__icon[data-icon="zoom"] { --hm-icon: var(--hm-icon-zoom); }
.hm-card__icon[data-icon="pen"], .hm-contact__item[data-icon="pen"], .hm-equip__icon[data-icon="pen"] { --hm-icon: var(--hm-icon-pen); }
.hm-card__icon[data-icon="search"], .hm-contact__item[data-icon="search"], .hm-equip__icon[data-icon="search"] { --hm-icon: var(--hm-icon-search); }
.hm-card__icon[data-icon="shield"], .hm-contact__item[data-icon="shield"], .hm-equip__icon[data-icon="shield"] { --hm-icon: var(--hm-icon-shield); }
.hm-card__icon[data-icon="file"], .hm-contact__item[data-icon="file"], .hm-equip__icon[data-icon="file"] { --hm-icon: var(--hm-icon-file); }
.hm-card__icon[data-icon="ruler"], .hm-contact__item[data-icon="ruler"], .hm-equip__icon[data-icon="ruler"] { --hm-icon: var(--hm-icon-ruler); }
.hm-card__icon[data-icon="camera"], .hm-contact__item[data-icon="camera"], .hm-equip__icon[data-icon="camera"] { --hm-icon: var(--hm-icon-camera); }
.hm-card__icon[data-icon="drone"], .hm-contact__item[data-icon="drone"], .hm-equip__icon[data-icon="drone"] { --hm-icon: var(--hm-icon-drone); }
.hm-card__icon[data-icon="building"], .hm-contact__item[data-icon="building"], .hm-equip__icon[data-icon="building"] { --hm-icon: var(--hm-icon-building); }
.hm-card__icon[data-icon="chart"], .hm-contact__item[data-icon="chart"], .hm-equip__icon[data-icon="chart"] { --hm-icon: var(--hm-icon-chart); }
.hm-card__icon[data-icon="clock"], .hm-contact__item[data-icon="clock"], .hm-equip__icon[data-icon="clock"] { --hm-icon: var(--hm-icon-clock); }
.hm-card__icon[data-icon="pin"], .hm-contact__item[data-icon="pin"], .hm-equip__icon[data-icon="pin"] { --hm-icon: var(--hm-icon-pin); }
.hm-card__icon[data-icon="phone"], .hm-contact__item[data-icon="phone"], .hm-equip__icon[data-icon="phone"] { --hm-icon: var(--hm-icon-phone); }
.hm-card__icon[data-icon="mail"], .hm-contact__item[data-icon="mail"], .hm-equip__icon[data-icon="mail"] { --hm-icon: var(--hm-icon-mail); }
.hm-card__icon[data-icon="printer"], .hm-contact__item[data-icon="printer"], .hm-equip__icon[data-icon="printer"] { --hm-icon: var(--hm-icon-printer); }
.hm-card__icon[data-icon="layers"], .hm-contact__item[data-icon="layers"], .hm-equip__icon[data-icon="layers"] { --hm-icon: var(--hm-icon-layers); }
.hm-card__icon[data-icon="activity"], .hm-contact__item[data-icon="activity"], .hm-equip__icon[data-icon="activity"] { --hm-icon: var(--hm-icon-activity); }
.hm-card__icon[data-icon="compass"], .hm-contact__item[data-icon="compass"], .hm-equip__icon[data-icon="compass"] { --hm-icon: var(--hm-icon-compass); }
.hm-card__icon[data-icon="users"], .hm-contact__item[data-icon="users"], .hm-equip__icon[data-icon="users"] { --hm-icon: var(--hm-icon-users); }
.hm-card__icon[data-icon="map"], .hm-contact__item[data-icon="map"], .hm-equip__icon[data-icon="map"] { --hm-icon: var(--hm-icon-map); }
.hm-card__icon[data-icon="video"], .hm-contact__item[data-icon="video"], .hm-equip__icon[data-icon="video"] { --hm-icon: var(--hm-icon-video); }
.hm-card__icon[data-icon="cloud"], .hm-contact__item[data-icon="cloud"], .hm-equip__icon[data-icon="cloud"] { --hm-icon: var(--hm-icon-cloud); }
.hm-card__icon[data-icon="cpu"], .hm-contact__item[data-icon="cpu"], .hm-equip__icon[data-icon="cpu"] { --hm-icon: var(--hm-icon-cpu); }
.hm-card__icon[data-icon="hammer"], .hm-contact__item[data-icon="hammer"], .hm-equip__icon[data-icon="hammer"] { --hm-icon: var(--hm-icon-hammer); }
.hm-card__icon[data-icon="gauge"], .hm-contact__item[data-icon="gauge"], .hm-equip__icon[data-icon="gauge"] { --hm-icon: var(--hm-icon-gauge); }
.hm-card__icon[data-icon="radar"], .hm-contact__item[data-icon="radar"], .hm-equip__icon[data-icon="radar"] { --hm-icon: var(--hm-icon-radar); }
.hm-card__icon[data-icon="award"], .hm-contact__item[data-icon="award"], .hm-equip__icon[data-icon="award"] { --hm-icon: var(--hm-icon-award); }
.hm-card__icon[data-icon="home"], .hm-contact__item[data-icon="home"], .hm-equip__icon[data-icon="home"] { --hm-icon: var(--hm-icon-home); }
.hm-card__icon[data-icon="train"], .hm-contact__item[data-icon="train"], .hm-equip__icon[data-icon="train"] { --hm-icon: var(--hm-icon-train); }
.hm-card__icon[data-icon="road"], .hm-contact__item[data-icon="road"], .hm-equip__icon[data-icon="road"] { --hm-icon: var(--hm-icon-road); }
.hm-card__icon[data-icon="handshake"], .hm-contact__item[data-icon="handshake"], .hm-equip__icon[data-icon="handshake"] { --hm-icon: var(--hm-icon-handshake); }
.hm-card__icon[data-icon="speaker"], .hm-contact__item[data-icon="speaker"], .hm-equip__icon[data-icon="speaker"] { --hm-icon: var(--hm-icon-speaker); }
.hm-card__icon[data-icon="calendar"], .hm-contact__item[data-icon="calendar"], .hm-equip__icon[data-icon="calendar"] { --hm-icon: var(--hm-icon-calendar); }
.hm-card__icon[data-icon="list"], .hm-contact__item[data-icon="list"], .hm-equip__icon[data-icon="list"] { --hm-icon: var(--hm-icon-list); }

/* 솔루션 규칙 #content_area img/iframe { height:auto } 보정 — 절대배치 iframe(지도·영상)과 채움 이미지는 높이 100% 유지 */
#content_area .hm-map iframe, #content_area .hm-video iframe { height: 100% !important; width: 100% !important; }
#content_area .hm-cert__thumb img, #content_area .hm-greeting__visual img { height: 100%; }

/* 서브페이지(태블릿·PC): 헤더 드롭다운 미사용 — 헤더 아래 2차 탭 바(.hm-subnav)가 2차 메뉴 역할(PC는 hover 시 탭 바 내용 전환, js/hanmok.js) */
@media (min-width: 768px) {
	body.page-sub #top #menu2 ul.m2_ul { display: none !important; }
}

/* ---------- 17. 솔루션 게시판 상세보기 테마 (주요 현장·뉴스 등 board_mode=view, 마크업은 board/view.php 원본) ---------- */
#content_area #dp_board_pc_area { font-family: var(--hm-font-kr); color: var(--hm-text); }
#content_area #dp_board_pc_view_title_area { display: block; padding: 0 0 22px; margin: 0 0 28px; border-bottom: 1px solid var(--hm-line); background: none; }
#content_area #dp_board_pc_view_title { display: block; font-size: clamp(1.35rem, 1.05rem + 1.1vw, 1.95rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--hm-ink); }
#content_area #dp_board_pc_view_other_info { display: block; margin-top: 10px; font-size: 14px; color: var(--hm-muted); }
#content_area #dp_board_pc_view_other_info span { margin-right: 10px; }
#content_area #dp_board_pc_view_img_text .add_img_area { margin: 0 0 24px; }
#content_area #dp_board_pc_view_img_text .add_img_area img { max-width: 100%; height: auto; border-radius: 14px; }
#content_area #dp_board_pc_view_text .se2_outputarea { font-size: 17px; line-height: 1.85; color: var(--hm-text); }
#content_area #dp_board_pc_view_text .se2_outputarea p { margin: 0 0 12px; }
#content_area #dp_board_pc_view_file { margin-top: 28px; padding: 14px 18px; border-radius: 12px; background: var(--hm-bg-soft); font-size: 14px; color: var(--hm-muted); }
#content_area #dp_board_pc_view_file ul { margin: 0; padding: 0; list-style: none; }
#content_area #dp_board_pc_view_file li { padding: 4px 0; }
#content_area #dp_board_pc_view_file a { color: var(--hm-ink); }
#content_area #dp_board_pc_view_file .file_size { margin-left: 6px; color: var(--hm-muted); }
#content_area #dp_board_pc_view_buttom { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--hm-line); text-align: right; }
#content_area #dp_board_pc_view_buttom .btn-modern { height: 46px; padding: 0 22px; border-radius: 999px; font-family: var(--hm-font-kr); font-weight: 700; font-size: 14px; }
#content_area #dp_board_pc_view_buttom .btn-primary { background: var(--hm-navy); border-color: var(--hm-navy); color: #fff; }

/* ---------- 18. 폼 모듈 테마 (견적·상담 문의 작성 화면, 마크업은 form/write.php) ---------- */
#dp_form_pc_area { font-family: var(--hm-font-kr); color: var(--hm-text); }
#dp_form_pc_area > .se2_outputarea:first-child { margin-bottom: clamp(40px, 5vw, 64px); } /* 2026-10-19: 폼 상단 HTML(소개·연락처)과 입력 폼/접수 목록 카드 사이 간격 */
#dp_form_pc_area > .se2_outputarea:last-child { margin-top: 24px; }
#dp_form_pc_area #dp_form_pc_write { margin-top: clamp(32px, 4vw, 56px); }
/* 동의 카드 */
#dp_form_pc_area .board-agree-card { margin: 0 0 20px; padding: 24px 26px; border: 1px solid var(--hm-line); border-radius: 18px; background: var(--hm-bg-soft); }
#dp_form_pc_area .agree-card-title { margin: 0 0 14px; font-size: 16px; font-weight: 700; color: var(--hm-ink); }
#dp_form_pc_area .agree-section { margin-top: 14px; }
#dp_form_pc_area .agree-label { margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--hm-muted); }
#dp_form_pc_area .agree-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
#dp_form_pc_area .agree-tab { padding: 6px 12px; border: 1px solid var(--hm-line); border-radius: 999px; font-size: 13.5px; color: var(--hm-text); cursor: pointer; }
#dp_form_pc_area .agree-content { display: block; width: 100%; height: 110px; padding: 12px 14px; border: 1px solid var(--hm-line); border-radius: 10px; background: #fff; font-size: 12.5px; line-height: 1.6; color: var(--hm-muted); resize: vertical; }
#dp_form_pc_area .agree-check { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 15px; font-weight: 600; color: var(--hm-ink); cursor: pointer; }
#dp_form_pc_area .agree-check input { width: 18px; height: 18px; accent-color: var(--hm-blue); }
/* 작성 카드 */
#dp_form_pc_area .board-form-card { border: 1px solid var(--hm-line); border-radius: 20px; background: #fff; box-shadow: 0 18px 44px rgba(16, 48, 112, 0.06); overflow: hidden; }
#dp_form_pc_area .form-card-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 20px 28px; background: var(--hm-bg-soft); border-bottom: 1px solid var(--hm-line); }
#dp_form_pc_area .form-card-header h3 { margin: 0; font-size: 18px; font-weight: 700; color: var(--hm-ink); }
#dp_form_pc_area .required-info { font-size: 13.5px; color: var(--hm-muted); }
#dp_form_pc_area .form-card-body { margin: 0; padding: 10px 28px 8px; border: 0; }
#dp_form_pc_area .form-row { display: flex; align-items: flex-start; gap: 20px; margin: 0; padding: 16px 0; border: 0; border-bottom: 1px solid var(--hm-line-soft); background: none; }
#dp_form_pc_area .form-row:last-child { border-bottom: 0; }
#dp_form_pc_area .form-label { flex: 0 0 150px; width: auto; height: auto; margin: 0 !important; padding: 12px 0 0 !important; font-size: 15.5px; font-weight: 600; color: var(--hm-ink); line-height: 1.5; }
#dp_form_pc_area .form-label .req { color: var(--hm-accent-deep); }
#dp_form_pc_area .form-field { flex: 1 1 auto; min-width: 0; width: auto; }
#dp_form_pc_area .field-hint { margin: 0 0 8px; font-size: 14px; color: var(--hm-muted); }
#dp_form_pc_area .form-input, #dp_form_pc_area .form-select { width: 100% !important; max-width: 100% !important; height: 48px !important; line-height: 46px !important; padding: 0 16px !important; border: 1px solid var(--hm-line) !important; border-radius: 10px !important; background: #fff !important; font-family: var(--hm-font-kr); font-size: 15px !important; color: var(--hm-ink) !important; transition: border-color 0.2s var(--hm-ease), box-shadow 0.2s var(--hm-ease); } /* 솔루션 board_responsive.css의 !important 규칙 대응 */
#dp_form_pc_area .form-textarea { width: 100%; max-width: 100%; min-height: 220px; padding: 14px 16px; border: 1px solid var(--hm-line); border-radius: 12px; background: #fff; font-family: var(--hm-font-kr); font-size: 15px; line-height: 1.7; color: var(--hm-ink); resize: vertical; transition: border-color 0.2s var(--hm-ease), box-shadow 0.2s var(--hm-ease); }
#dp_form_pc_area .form-input:focus, #dp_form_pc_area .form-select:focus, #dp_form_pc_area .form-textarea:focus { outline: 0; border-color: var(--hm-blue) !important; box-shadow: 0 0 0 3px rgba(0, 120, 192, 0.15); }
#dp_form_pc_area .form-input::placeholder, #dp_form_pc_area .form-textarea::placeholder { color: #9aa5b4; }
#dp_form_pc_area .form-file { width: 100%; max-width: 100%; padding: 12px 14px; border: 1px dashed var(--hm-line); border-radius: 10px; background: var(--hm-bg-soft); font-size: 14px; color: var(--hm-text); }
#dp_form_pc_area .form-actions { display: flex; justify-content: center; gap: 10px; margin: 0; padding: 22px 28px 32px; border: 0; background: #fff; }
#dp_form_pc_area .form-actions .btn { display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 30px; border: 1px solid transparent; border-radius: 999px; font-family: var(--hm-font-kr); font-size: 15px; font-weight: 700; cursor: pointer; transition: transform 0.3s var(--hm-ease), box-shadow 0.3s var(--hm-ease), background 0.3s var(--hm-ease); }
#dp_form_pc_area .form-actions .btn:hover { transform: translateY(-2px); }
#dp_form_pc_area .form-actions .btn-primary { background: var(--hm-accent); color: #111827; box-shadow: 0 10px 24px rgba(245, 158, 11, 0.28); }
#dp_form_pc_area .form-actions .btn-primary:hover { background: #fbbf24; }
#dp_form_pc_area .form-actions .btn-secondary { background: #fff; border-color: var(--hm-line); color: var(--hm-text); }
#dp_form_pc_area .form-actions .btn-secondary:hover { border-color: var(--hm-ink); color: var(--hm-ink); }
@media (max-width: 767px) {
	#dp_form_pc_area .board-agree-card { padding: 18px 16px; }
	#dp_form_pc_area .form-card-header, #dp_form_pc_area .form-card-body, #dp_form_pc_area .form-actions { padding-left: 16px; padding-right: 16px; }
	#dp_form_pc_area .form-row { flex-direction: column; gap: 8px; padding: 14px 0; }
	#dp_form_pc_area .form-label { flex: none; padding-top: 0 !important; }
	#dp_form_pc_area .form-actions { flex-direction: column; }
	#dp_form_pc_area .form-actions .btn { width: 100%; }
}
@media (max-width: 767px) {
	#dp_form_pc_area .form-field { width: 100%; align-self: stretch; } /* 세로 배치 시 입력란이 내용 폭으로 줄어드는 것 방지 */
}

/* ---------- 19. 푸터 사이트맵 (유신식: 1차 영문 라벨 + 2차 링크 열, 마크업 main.php .hm-sitemap) ---------- */
footer#bottom #menu_member::before { display: none; } /* 구 CSS 로고(흰색 단색) → 사이트맵 상단의 img 로고(네모 마크 원색)로 대체 */
footer#bottom .hm-sitemap { width: 100%; max-width: var(--hm-container); margin: 0 auto 40px; padding: 0 20px; }
footer#bottom .hm-sitemap__logo { display: inline-block; margin: 0 0 40px; line-height: 0; }
footer#bottom .hm-sitemap__logo img { height: 38px; width: auto; }
footer#bottom .hm-sitemap__in { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px 20px; }
footer#bottom .hm-sitemap__head { display: block; margin: 0 0 14px; font-family: var(--hm-font-en); font-weight: 600; font-size: 1.08rem; letter-spacing: 0.01em; text-transform: lowercase; color: #fff; transition: color 0.3s var(--hm-ease); }
footer#bottom .hm-sitemap__head:hover { color: var(--hm-sky); }
footer#bottom .hm-sitemap ul { list-style: none; margin: 0; padding: 0; }
footer#bottom .hm-sitemap li { margin: 0; }
footer#bottom .hm-sitemap li a { font-family: 'Spoqa Han Sans Neo', var(--hm-font-kr); font-weight: 300; font-size: 14.4px; letter-spacing: -0.16px; line-height: 32px; color: #aaa; transition: color 0.3s var(--hm-ease); } /* 유신 푸터 2차 메뉴와 동일: Spoqa Han Sans Neo Light, 0.9rem, -0.01rem, line-height 2rem, #aaa (font/spoqa 로컬 로드) */
footer#bottom .hm-sitemap li a:hover { color: #fff; }
footer#bottom .hm-sitemap + #menu_member_100per { padding-top: 32px; border-top: 1px solid rgba(255, 255, 255, 0.08); }
footer#bottom .hm-sitemap + #menu_member_100per #menu_member ul { justify-content: flex-start; }
footer#bottom .hm-sitemap + #copyright { margin-top: 0; padding-top: 32px; } /* 홈으로·약관 링크 삭제(2026-10-16) → 회원 기능 미사용 시 사이트맵 바로 아래 구분선 + 운영사 정보 */
@media (min-width: 768px) { footer#bottom .hm-sitemap__in { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1025px) { footer#bottom .hm-sitemap__in { grid-template-columns: repeat(6, 1fr); gap: 30px 24px; } footer#bottom .hm-sitemap { margin-bottom: 48px; } }
@media (min-width: 1300px) { footer#bottom .hm-sitemap { padding: 0; } }

/* ---------- 20. 1차 메뉴 영문 라벨 (main.php 헤더·드로어, inc/contents_sub_title.php 탭 바 부모) ---------- */
#top #menu2 li.m1_li span.m1_txt { font-family: var(--hm-font-en); font-weight: 500; text-transform: lowercase; letter-spacing: 0.01em; }
@media (min-width: 1025px) { #top #menu2 li.m1_li span.m1_txt { font-size: 16.5px; } }
@media (min-width: 768px) and (max-width: 1024px) { #top #menu2 li.m1_li span.m1_txt { font-size: 15px; } }
#main_menu_area li.mob_m1 > a > span { font-family: var(--hm-font-en); font-weight: 600; text-transform: lowercase; letter-spacing: 0.01em; }
.hm-subnav__parent { font-family: var(--hm-font-en) !important; font-weight: 600 !important; text-transform: lowercase; letter-spacing: 0.01em; }

/* ---------- 21. 푸터 운영사 정보(#copyright) 글꼴 — 유신 푸터 하단과 동일 (2026-10-16) ----------
   유신 common.css: footer .bottom-wrap li { Spoqa 300; 0.9rem; letter-spacing -0.02rem; line-height 1.6rem }
                    footer .bottom-wrap .copyright { Poppins 300; 0.9rem; -0.02rem; 1.6rem; #aaa }
   → 0.9rem=14.4px, -0.02rem=-0.32px, 1.6rem=25.6px 로 고정. 배치(가운데 정렬·구분선)는 솔루션 pc_responsive.css 유지.
   선택자는 솔루션 규칙(footer#bottom #copyright div.address 등)보다 높은 특이도로 작성. */
footer#bottom #copyright div.address { font-family: 'Spoqa Han Sans Neo', var(--hm-font-kr); font-weight: 300; font-size: 14.4px; letter-spacing: -0.32px; line-height: 25.6px; color: #aaa; }
footer#bottom #copyright div.address span, footer#bottom #copyright div.address span.tel, footer#bottom #copyright div.address span.tel2 { font-family: inherit; font-weight: 300; font-size: 14.4px; letter-spacing: -0.32px; line-height: 25.6px; color: #aaa; }
footer#bottom #copyright div.address span.copy { font-family: 'Poppins', 'Spoqa Han Sans Neo', var(--hm-font-kr); font-weight: 300; font-size: 14.4px; letter-spacing: -0.32px; line-height: 25.6px; color: #aaa; }

/* ============================================================
   22. 2026-10-23 2차 수정사항
   ============================================================ */
/* 메인 숫자 섹션 제목: '한' 종'목' 강조 (config stats title_html) */
.hm-h2 .hm-em { font-style: normal; font-weight: 800; color: var(--hm-blue); }
/* 히어로 라벨이 한글(연도변조사 전문 기술 벤처기업)로 바뀌어 영문용 자간을 줄임 */
.hm-hero__label { font-family: var(--hm-font-kr); letter-spacing: 0.08em; font-size: clamp(0.86rem, 0.8rem + 0.25vw, 1.02rem); }
/* 조직도: 연구개발전담부서 = 대표이사 직속 스태프(세로선 오른쪽 가지). 모바일은 세로 일렬 */
.hm-org--staff .hm-org__stem { position: relative; display: flex; justify-content: center; width: 100%; padding: 28px 0 0; }
.hm-org--staff .hm-org__stem::before { content: ""; position: absolute; left: 50%; top: 0; bottom: -28px; width: 1px; background: var(--hm-line); }
.hm-org--staff .hm-org__staff { position: relative; z-index: 1; padding: 12px 28px; border-radius: 12px; border: 1px solid var(--hm-line); background: var(--hm-bg-soft); font-weight: 700; color: var(--hm-ink); font-size: 15.5px; }
@media (min-width: 768px) {
	.hm-org--staff .hm-org__stem { height: 116px; padding: 0; }
	.hm-org--staff .hm-org__stem::before { bottom: 0; }
	.hm-org--staff .hm-org__staff { position: absolute; left: calc(50% + 120px); top: 50%; transform: translateY(-50%); }
	.hm-org--staff .hm-org__staff::before { content: ""; position: absolute; right: 100%; top: 50%; width: 120px; height: 1px; background: var(--hm-line); }
}
@media (min-width: 1025px) {
	.hm-org--staff .hm-org__stem::before { bottom: -14px; }
}
/* 360° 영상 시청 안내(VR 영상 아래 hm-note): 영상 캡션과 간격 */
.hm-videos + .hm-note { margin-top: 22px; }
/* 메인 히어로 영상 밝기 약 20~25% 밝게(2026-10-23 사용자 요청) — 원래 값: 좌 0.82·중 0.55·우 0.2 / 상 0.45·하 0.65 (7절) */
.hm-hero__dim { background: linear-gradient(90deg, rgba(7, 12, 24, 0.66) 0%, rgba(7, 12, 24, 0.40) 48%, rgba(7, 12, 24, 0.10) 100%), linear-gradient(180deg, rgba(7, 12, 24, 0.35) 0%, rgba(7, 12, 24, 0) 32%, rgba(7, 12, 24, 0.50) 100%); }
/* 메인 히어로(2026-10-23): PC(768px 이상, 동작 줄이기 미설정)에서 영상이 있으면 드론 사진을 숨기고 영상 첫 장면(poster)부터 바로 보이게 — 사진→영상 전환 깜빡임 제거.
   모바일·동작 줄이기 환경은 기존처럼 사진 사용(영상 미재생) */
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
	.hm-hero__media[data-video]:not([data-video=""]) picture { display: none; }
	.hm-hero__media[data-video]:not([data-video=""]) .hm-hero__video { opacity: 1; }
}
@media (max-width: 767px), (prefers-reduced-motion: reduce) { .hm-hero__video { display: none; } }
/* 히어로 밝기 2차(2026-10-23 사용자: 조금만 더 밝게) — 1차 0.66/0.40/0.10·0.35/0.50 → 0.54/0.30/0.05·0.28/0.40 */
.hm-hero__dim { background: linear-gradient(90deg, rgba(7, 12, 24, 0.54) 0%, rgba(7, 12, 24, 0.30) 48%, rgba(7, 12, 24, 0.05) 100%), linear-gradient(180deg, rgba(7, 12, 24, 0.28) 0%, rgba(7, 12, 24, 0) 32%, rgba(7, 12, 24, 0.40) 100%); }

/* 2026-10-27 메인 태블릿(768~1024) 1차 메뉴 hover: 솔루션 기본 카드형 드롭다운 대신 PC와 같은 가로 밴드(메뉴 막대 바로 아래 풀폭).
   서브페이지는 태블릿에서 드롭다운을 숨기고 2차 탭 바를 쓰므로 body.page-main에만 적용. 태블릿은 가운데 정렬 + 넘치면 2줄(항목 7개 메뉴), js 위치 정렬은 PC 전용 */
@media (min-width: 768px) and (max-width: 1024px) {
	body.page-main #top #menu2, body.page-main #top #menu2 li.m1_li { position: static; }
	body.page-main #top #menu2 ul.m2_ul {
		position: absolute; top: 44px; left: 0; right: 0; min-width: 0; margin: 0; padding: 4px 20px !important;
		display: flex; flex-wrap: wrap; justify-content: center !important; align-items: stretch; height: auto; white-space: nowrap;
		border-radius: 0; border-top: 1px solid rgba(17, 24, 39, 0.06); background: var(--menu-m2-bg, #ffffff);
		box-shadow: 0 16px 36px rgba(15, 23, 42, 0.10);
		transform: translateY(-8px); opacity: 0; visibility: hidden; pointer-events: none;
		transition: opacity 0.28s var(--hm-ease), transform 0.28s var(--hm-ease), visibility 0s linear 0.28s;
	}
	body.page-main #top #menu2 li.m1_li:hover ul.m2_ul, body.page-main #top #menu2 li.m1_li:focus-within ul.m2_ul { z-index: 101; transform: none; opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 0.28s var(--hm-ease), transform 0.28s var(--hm-ease), visibility 0s linear 0s; }
	body.page-main #top #menu2 li.m2_li { position: relative; margin: 0; padding: 0; text-align: center; }
	body.page-main #top #menu2 li.m2_li::before { display: none; }
	body.page-main #top #menu2 li.m2_li > a { display: flex; align-items: center; height: 44px; padding: 0 12px; background: transparent !important; }
	body.page-main #top #menu2 li.m2_li > a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px; border-radius: 2px; background: var(--color-m1-on, var(--hm-blue)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--hm-ease); }
	body.page-main #top #menu2 li.m2_li:hover > a::after { transform: scaleX(1); }
	body.page-main #top #menu2 li.m2_li span { font-family: var(--hm-font-kr); font-size: 14px; font-weight: 500; letter-spacing: -0.01em; padding: 0; color: var(--hm-text); }
	body.page-main #top #menu2 li.m2_li:hover span { color: var(--color-m1-on, var(--hm-blue)); }
	body.page-main #top #menu2 ul.m3_ul { display: none; }
}

/* 2026-10-27 서브 탭 바(.hm-subnav__list) 가로 스크롤 안내: 더 있는 쪽 끝을 흐리게(js/hanmok.js가 can-left/can-right 표시), 마우스 환경에서는 끌기 커서 */
.hm-subnav__list.can-right { -webkit-mask-image: linear-gradient(to left, transparent 0, #000 36px); mask-image: linear-gradient(to left, transparent 0, #000 36px); }
.hm-subnav__list.can-left { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 36px); mask-image: linear-gradient(to right, transparent 0, #000 36px); }
.hm-subnav__list.can-left.can-right { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%); }
@media (hover: hover) and (pointer: fine) { .hm-subnav__list.can-left, .hm-subnav__list.can-right { cursor: grab; } .hm-subnav__list.is-dragging { cursor: grabbing; } .hm-subnav__list.is-dragging a { pointer-events: none; } }