@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@700&display=swap');

.w, .w * { margin:0; padding:0; box-sizing:border-box; }
.w a { text-decoration:none; }
.w {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
  max-width:860px; margin:0 auto;
  -webkit-font-smoothing:antialiased;
  background:#ffffff; color:#111;
  overflow:hidden; letter-spacing:-0.015em;
  border:1px solid #e0e8f4; border-radius:20px;
  box-shadow:0 8px 30px rgba(5,47,103,0.06);
}

/* =============================================
   A. HEADER
============================================= */
.hd { position:relative; overflow:hidden; }
.hd-bg {
  background:linear-gradient(145deg, #041528 0%, #052f67 60%, #063a80 100%);
  padding:52px 60px 44px; position:relative; overflow:hidden;
}

/* 우측 하단 글로우 */
.hd-bg::after {
  content:'';
  position:absolute; right:-60px; bottom:-60px;
  width:300px; height:300px;
  background:radial-gradient(circle, rgba(0,168,255,0.1) 0%, transparent 65%);
  pointer-events:none; z-index:0;
}

/* 三正 워터마크 — 우측 하단, 살짝 걸침 */
.hd-wm {
  position:absolute; right:-15px; bottom:-18px;
  font-size:180px; font-weight:700; letter-spacing:-5px; line-height:1;
  color:rgba(255,255,255,0.045); pointer-events:none; user-select:none;
  white-space:nowrap; z-index:0;
  font-family:'Noto Serif KR', serif;
}

.hd-inner { position:relative; z-index:1; display:flex; align-items:flex-start; gap:0; }

/* 왼쪽 accent 라인 */
.hd-accent {
  width:3px; flex-shrink:0;
  background:linear-gradient(to bottom, #00a8ff, rgba(0,168,255,0.15));
  border-radius:2px; margin-right:22px;
  align-self:stretch; min-height:64px;
}

.hd-content { flex:1; }
.cat {
  display:inline-flex; align-items:center; margin-bottom:14px;
  border:1px solid rgba(0,168,255,0.4); padding:4px 13px; border-radius:30px;
  background:rgba(0,168,255,0.08);
}
.cat-txt { font-size:12px; font-weight:700; color:#00a8ff; letter-spacing:0.08em; }
.hd-title {
  font-size:clamp(22px,3.4vw,30px); font-weight:800;
  color:#ffffff; letter-spacing:-0.02em; line-height:1.38;
  margin-bottom:10px; word-break:keep-all;
}
.hd-sub { font-size:14px; color:rgba(255,255,255,0.6); font-weight:400; line-height:1.5; min-height:1.4em; }
.hd-rule { height:3px; background:linear-gradient(90deg, #00a8ff 0%, #052f67 50%, transparent 100%); }

/* =============================================
   B. VISUAL
============================================= */
.vis { position:relative; overflow:hidden; background:#fff; }
.vis-inner { width:100%; background:#fff; }
.vis-inner img { width:100% !important; height:auto !important; display:block !important;
  max-width:100% !important; margin:0 !important; padding:0 !important; }
/* 티스토리 alignCenter 무력화 */
.vis-inner .imageblock,
.vis-inner figure,
.vis-inner p { margin:0 !important; padding:0 !important; text-align:left !important; }

/* =============================================
   C. 섹션 공통
============================================= */
.sec { padding:48px 40px 0; }
.sec-title-row { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.sec-title { font-size:15px; font-weight:800; color:#052f67; letter-spacing:-0.01em; white-space:nowrap; }
.sec-title-line { flex:1; height:1px; background:#052f67; opacity:0.15; }

/* =============================================
   D. PROJECT INFO 표
============================================= */
.ptbl { width:100%; border-collapse:collapse; border-top:2px solid #052f67; border-bottom:2px solid #052f67; }
.ptbl thead th { background:#f8fafc; color:#052f67; font-size:14px; font-weight:800; padding:13px 20px; text-align:center; border-bottom:1px solid #dde3ec; }
.ptbl thead th:first-child { width:110px; border-right:1px solid #e8eef6; }
.ptbl tbody tr { border-bottom:1px solid #e8eef6; }
.ptbl tbody tr:last-child { border-bottom:none; }
.ptbl .k { background:#f8fafc; font-size:14px; font-weight:700; color:#444; padding:15px 20px; text-align:center; border-right:1px solid #e8eef6; vertical-align:middle; }
.ptbl .v { background:#ffffff; padding:15px 24px; font-size:14px; font-weight:500; color:#111; line-height:1.6; word-break:keep-all; vertical-align:middle; }

/* 지역 행 */
.v-loc { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.v-loc-txt { flex:1; }

/* 네이버 지도 버튼 */
.map-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 13px;
  background:#fff; border:1px solid #dde3ec; border-radius:6px;
  font-size:12px; font-weight:700; color:#444;
  white-space:nowrap; flex-shrink:0;
  transition:all 0.2s; text-decoration:none;
}
.map-btn-placeholder { opacity:0.4; pointer-events:none; cursor:default; }
.map-btn:hover { border-color:#03C75A; color:#03C75A; background:#f4fff8; }


/* 태그 */
.tags { display:flex; flex-wrap:wrap; gap:8px; }
.tag { font-size:13px; font-weight:700; color:#052f67; border:1px solid rgba(5,47,103,0.25); padding:5px 12px; background:rgba(5,47,103,0.04); border-radius:0; letter-spacing:0.3px; }
@media (hover:hover) and (pointer:fine) {
  .tag:hover { background:#052f67; color:#fff; border-color:#052f67; }
}

/* =============================================
   E. 네이버 블로그 버튼
============================================= */
.nv-sec { padding:48px 40px 0; }
.nv-a {
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 18px;
  border:1px solid #dde3ec; border-radius:4px;
  background:#f8fafc; cursor:pointer;
  transition:all .2s ease;
}
.nv-a:hover { background:#fff; border-color:#052f67; }
.nv-ico {
  width:20px; height:20px; flex-shrink:0;
  background:#03C75A; border-radius:3px;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:900; color:#fff;
  font-family:'Arial Black', Arial, sans-serif;
  line-height:1; overflow:hidden;
}
.nv-ico::after { content:'N'; display:block; line-height:1; margin-top:0; }
.nv-txt { font-size:13px; font-weight:600; color:#444; transition:color .2s; }
.nv-arr { font-size:13px; color:#aaa; transition:all .2s; margin-left:2px; }
.nv-a:hover .nv-txt { color:#052f67; }
.nv-a:hover .nv-arr { color:#052f67; transform:translateX(3px); }

/* =============================================
   F. NOTICE
============================================= */
.notice { margin:48px 40px 0; background:#f8fafc; padding:20px 28px; border-top:2px solid #052f67; border-bottom:1px solid #dde3ec; border-radius:4px; }
.notice-head { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.notice-lbl { font-size:12px; font-weight:800; color:#052f67; letter-spacing:0.05em; text-transform:uppercase; }
.notice-rule { flex:1; height:1px; background:#dde3ec; }
.nlist { display:flex; flex-direction:column; gap:7px; }
.nitem { display:flex; align-items:flex-start; gap:10px; }
.nnum { font-size:16px; font-weight:900; color:#aab8cc; flex-shrink:0; width:14px; margin-top:-1px; line-height:1.5; }
.ntxt { font-size:12.5px; color:#555; line-height:1.6; word-break:keep-all; }

/* =============================================
   G. FOOTER
============================================= */
.ft { margin-top:48px; background:linear-gradient(145deg,#0b111e 0%,#052f67 100%); position:relative; overflow:hidden; }
.ft::after {
  content:''; position:absolute; right:-100px; bottom:-100px; width:400px; height:400px;
  background:radial-gradient(circle,rgba(0,168,255,0.08) 0%,transparent 65%);
  pointer-events:none; z-index:0;
}
.ft-topline { height:3px; background:linear-gradient(90deg,#00a8ff 0%,#052f67 50%,transparent 100%); }

/* 푸터 본문 — 중앙 정렬 */
.ft-body {
  padding:32px 44px 28px;
  display:flex; align-items:flex-start;
  justify-content:space-between; gap:40px;
  position:relative; z-index:1;
}

/* 왼쪽 */
.ft-left {}
.ft-kor { font-size:24px; font-weight:800; color:#fff; letter-spacing:-0.02em; line-height:1; margin-bottom:5px; }
.ft-eng { font-size:14.2px; font-weight:400; color:rgba(255,255,255,0.55); letter-spacing:0.02em; display:block; margin-bottom:12px; }
.ft-bar { width:300px; height:2px; background:linear-gradient(90deg,#00a8ff,rgba(0,168,255,0.3),transparent); margin-bottom:12px; }
.ft-tagline { font-size:13px; color:rgba(255,255,255,0.7); line-height:1.7; letter-spacing:-0.01em; }

/* 오른쪽 */
.ft-right { display:flex; flex-direction:column; justify-content:center; gap:8px; padding-top:4px; }
.ft-tel-lbl { font-size:11px; font-weight:700; color:#00a8ff; letter-spacing:0.05em; text-transform:uppercase; margin-bottom:2px; }
.ft-tel { font-size:18px; font-weight:800; color:#fff; letter-spacing:-0.02em; line-height:1; margin-bottom:10px; }
.ft-meta { display:flex; flex-direction:column; gap:6px; }
.ft-meta-row { display:flex; align-items:baseline; gap:0; }
.ft-mk { width:44px; font-size:11px; font-weight:700; color:rgba(255,255,255,0.4); letter-spacing:0.05em; text-transform:uppercase; flex-shrink:0; }
.ft-mv { font-size:13px; font-weight:400; color:rgba(255,255,255,0.75); white-space:nowrap; }

/* 하단 바 */
.ft-bottom { position:relative; z-index:1; }
.ft-btmrule { height:1px; background:rgba(255,255,255,.08); margin:0 44px; }
.ft-btm { padding:12px 44px 18px; display:flex; align-items:center; justify-content:space-between; }
.ft-slogan { font-size:11px; color:rgba(255,255,255,0.28); letter-spacing:0.04em; font-style:normal; }
.ft-url { font-size:12px; color:rgba(255,255,255,0.32); letter-spacing:0.02em; text-decoration:none; }
.ft-gap { height:20px; background:#fff; }

/* =============================================
   모바일
============================================= */
@media (max-width:640px) {
  .w { border-radius:12px; }
  .hd-bg { padding:36px 24px 32px; }
  .hd-wm { font-size:48px; right:16px; bottom:12px; }
  .hd-accent { margin-right:16px; min-height:56px; }
  .hd-title { font-size:clamp(20px,5.5vw,26px); }
  .sec, .nv-sec { padding-left:24px; padding-right:24px; padding-top:36px; }
  .notice { margin-left:24px; margin-right:24px; margin-top:36px; }
  .ft { margin-top:36px; }
  .ptbl thead th { font-size:13px; padding:11px; }
  .ptbl thead th:first-child { width:76px; }
  .ptbl .k { font-size:13px; padding:12px 10px; }
  .ptbl .v { font-size:13px; padding:12px 14px; }
  .map-btn span { display:inline; font-size:11px; }
  .map-btn { padding:6px 10px; gap:5px; }
  .ft-body { flex-direction:column; gap:24px; padding:28px 24px 20px; justify-content:flex-start; }
  .ft-bar { width:180px; }
  .ft-kor { font-size:22px; }
  .ft-eng { font-size:12.8px; letter-spacing:0; white-space:normal; line-height:1.5; }
  .ft-right { padding-top:0; }
  .ft-btmrule { margin:0 24px; }
  .ft-btm { padding:12px 24px 16px; flex-direction:column; align-items:flex-start; gap:6px; }
}

/* =============================================
   인쇄 — A4 한 페이지, 밝은 배경, 잉크 절약
============================================= */
@media print {
  @page { size:A4 portrait; margin:8mm 10mm; }
  * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
  body::before, body::after { display:none !important; content:none !important; }

  /* 컨테이너 */
  .w {
    border:1px solid #bbb !important; border-radius:0 !important;
    box-shadow:none !important; max-width:100% !important;
  }

  /* 헤더 — 밝은 배경, 여백 축소 */
  .hd-bg {
    background:#f0f4f8 !important;
    padding:16px 24px 14px !important;
  }
  .hd-bg::after { display:none !important; }
  .hd-wm { display:none !important; }
  .hd-accent {
    background:linear-gradient(to bottom, #052f67, rgba(5,47,103,0.2)) !important;
    min-height:48px !important;
  }
  .hd-title { color:#052f67 !important; font-size:16px !important; margin-bottom:4px !important; }
  .hd-sub   { color:#555 !important; font-size:12px !important; }
  .cat { border-color:rgba(5,47,103,0.25) !important; background:rgba(5,47,103,0.04) !important; }
  .cat-txt { color:#052f67 !important; font-size:11px !important; }
  .hd-rule { height:2px !important; background:#052f67 !important; }

  /* 조감도 — 헤더 아래 빈 공간 완전 제거 */
  div[style*="height:60px"],
  div[style*="height: 60px"] { display:none !important; }
  .hd + div { margin-top:0 !important; padding-top:0 !important; }
  .vis { background:#fff !important; margin-top:0 !important; }
  .vis-inner { background:#fff !important; }
  .vis-inner img {
    width:100% !important; height:auto !important;
    max-height:none !important; object-fit:contain !important;
    display:block !important; margin:0 !important;
  }

  /* 조감도~표, 표~푸터 여백 균형 */
  .sec { padding:16px 16px 0 !important; }
  .sec-title-row { margin-bottom:8px !important; }
  .sec-title { font-size:12px !important; }
  .ptbl thead th { padding:6px 12px !important; font-size:11px !important; }
  .ptbl .k { padding:6px 12px !important; font-size:11px !important; }
  .ptbl .v { padding:6px 14px !important; font-size:11px !important; }
  .map-btn { display:none !important; }
  .tag { font-size:10px !important; padding:2px 7px !important; }

  /* 숨김 */
  .nv-sec  { display:none !important; }
  .notice  { display:none !important; }
  .ft-gap  { display:none !important; }

  /* 푸터 — 밝은 배경, 한 줄 압축 */
  .ft { margin-top:12px !important; background:#f0f4f8 !important; }
  .ft::after  { display:none !important; }
  .ft-topline { height:1px !important; background:#052f67 !important; }
  .ft-body    { display:none !important; }
  .ft-btmrule { margin:0 16px !important; background:#bbb !important; }
  .ft-btm {
    padding:5px 16px 7px !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
  }
  /* 슬로건 — ::before로 회사정보 표시, 원본 텍스트 노드 font-size:0으로 완전 숨김 */
  .ft-slogan {
    font-style:normal !important;
    color:#333 !important;
    font-size:0 !important;
    letter-spacing:0 !important;
    white-space:nowrap !important;
  }
  .ft-slogan::before {
    content:'(주)삼정엔지니어링  ·  041-555-8900  ·  www.samjungeng.co.kr' !important;
    font-size:10px !important;
    color:#333 !important;
  }
  .ft-slogan > * { display:none !important; }
  .ft-url { display:none !important; }
}

/* 지도 버튼 — href="#" 상태일 때 기본 숨김, JS가 실제 URL 감지 시 활성화 */
.js-map-btn { display:none; }
.js-map-btn.is-active { display:inline-flex; }
