/* /guide.css — 2026-10-12 uketaapply.co.kr 원고(영국여행비자_구글SEO_전체22개페이지) 개편용 추가 스타일
 *  1) 상단 메뉴(GNB) 드롭다운      .visa-nav-menu.gnb …  (inc/header.php)
 *  2) 원고 페이지 본문              .guide-page …          (새/개편 서브페이지)
 *  기존 style.css 는 건드리지 않는다(메인 본문 불변). 모든 규칙을 .gnb / .guide- 범위로 격리했다.
 *  이 사이트 CSS 함정: body{line-height:1} → 여러 줄은 line-height 직접 지정 / 800px 이하 br 숨김 → <br> 금지
 *  되돌리기: inc/header.php 를 /root/backup/kokr-seo22-20261012/orig/inc/header.php 로 복원하면 이 파일은 안 쓰인다.
 */

/* ───────── 1. 상단 메뉴(GNB) ───────── */
.visa-nav-menu.gnb .gnb-sub{margin:0; padding:0; list-style:none;}
.visa-nav-menu.gnb .gnb-sub-toggle{display:none;}

/* style.css 의 @media (max-width:1340px) 와 정확히 반대 조건 — 1340.5px 같은 소수점 폭에도 빈틈이 없게 */
@media not all and (max-width:1340px){
  .visa-nav-menu.gnb{gap:2px; height:95px; align-items:stretch;}
  .visa-nav-menu.gnb > .gnb-item{position:relative; display:flex; align-items:center; height:95px;}
  .visa-nav-menu.gnb .gnb-link{display:block; padding:0 10px; font-size:18px; line-height:95px; color:#fff; white-space:nowrap;}
  .visa-nav-menu.gnb > .gnb-item.on > .gnb-link{box-shadow:inset 0 -4px 0 #c1a783;}
  .visa-nav-menu.gnb .gnb-sub{display:none; position:absolute; top:100%; left:0; min-width:210px; padding:8px 0;
    background:#fff; border-top:3px solid #c1a783; border-radius:0 0 8px 8px; box-shadow:0 12px 28px rgba(15,30,60,.18); z-index:30;}
  .visa-nav-menu.gnb > .gnb-item:last-child > .gnb-sub{left:auto; right:0;}
  .visa-nav-menu.gnb > .gnb-item:hover > .gnb-sub,
  .visa-nav-menu.gnb > .gnb-item:focus-within > .gnb-sub,
  .visa-nav-menu.gnb > .gnb-item.tap-open > .gnb-sub{display:block;}
  .visa-nav-menu.gnb .gnb-sub a{display:block; padding:11px 22px; font-size:16px; line-height:1.4; color:#17264a; white-space:nowrap;}
  .visa-nav-menu.gnb .gnb-sub a:hover,
  .visa-nav-menu.gnb .gnb-sub a:focus{background:#eef3fb; color:#0d4aaa;}
  .visa-nav-menu.gnb .gnb-sub a[aria-current="page"]{color:#0d4aaa; font-weight:700;}
}

@media (max-width:1340px){
  /* 기존 오른쪽 슬라이드 패널(style.css)을 그대로 쓰되, 항목이 많아져 위에서부터 쌓고 스크롤되게 */
  .visa-nav-menu.gnb{box-sizing:border-box; height:100vh; height:100dvh; padding:95px 0 40px; gap:0;
    justify-content:flex-start; align-items:stretch; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;}
  .visa-nav-menu.gnb > .gnb-item{position:relative; flex:none; border-bottom:1px solid rgba(255,255,255,.18);}
  .visa-nav-menu.gnb .gnb-link{display:block; padding:14px 58px 14px 22px; font-size:17px; line-height:1.4; color:#fff;}
  .visa-nav-menu.gnb .gnb-sub-toggle{display:block; position:absolute; top:5px; right:8px; width:42px; height:42px;
    padding:0; border:0; background:transparent; cursor:pointer;}
  .visa-nav-menu.gnb .gnb-sub-toggle::before,
  .visa-nav-menu.gnb .gnb-sub-toggle::after{content:""; position:absolute; left:50%; top:50%; width:14px; height:2px;
    background:#fff; transform:translate(-50%,-50%);}
  .visa-nav-menu.gnb .gnb-sub-toggle::after{transform:translate(-50%,-50%) rotate(90deg); transition:transform .2s;}
  .visa-nav-menu.gnb > .gnb-item.sub-open > .gnb-sub-toggle::after{transform:translate(-50%,-50%) rotate(0deg);}
  .visa-nav-menu.gnb .gnb-sub{display:none; padding:0 0 12px;}
  .visa-nav-menu.gnb > .gnb-item.sub-open > .gnb-sub{display:block;}
  .visa-nav-menu.gnb .gnb-sub a{display:block; padding:9px 22px 9px 36px; font-size:15px; line-height:1.4; color:#dce7ff;}
  .visa-nav-menu.gnb .gnb-sub a[aria-current="page"]{color:#fff; font-weight:700; text-decoration:underline;}
}
@media (max-width:800px){
  .visa-nav-menu.gnb{padding-top:75px;}
}

/* ───────── 2. 원고 페이지 본문 ───────── */
/* 가운뎃점 묶음(보유·보호 등)이 '·' 로 줄 맨 앞에 오지 않게. 리셋이 span 굵기를 400 으로 만들므로 inherit 필수 */
.guide-nw{white-space:nowrap; font-weight:inherit;}
.guide-title h1{text-wrap:balance; word-break:keep-all;}
.guide-page .guide-sec h2{text-wrap:balance; word-break:keep-all;}
.guide-page .guide-sec + .guide-sec{margin-top:72px;}
.guide-page .guide-sec .visa_over_view_zone{margin-top:28px;}
.guide-page .guide-sec p,
.guide-page .guide-list li{word-break:keep-all; overflow-wrap:anywhere;}
.guide-page .guide-sec h3{margin-top:36px; padding-left:50px; font-size:22px; line-height:1.4; word-break:keep-all; text-wrap:balance;}
.guide-page .guide-sec .visa_over_view_zone > h3:first-child{margin-top:0;}
.guide-page .guide-sec h3 + p,
.guide-page .guide-sec h3 + .guide-list{margin-top:12px;}
.guide-page .guide-list{margin:18px 0 0; padding:0;}
.guide-page .guide-list li{position:relative; margin-top:10px; padding-left:20px; list-style:none; font-size:18px; line-height:1.6; color:#435d87;}
.guide-page .guide-list li::before{content:""; position:absolute; left:3px; top:.72em; width:7px; height:7px; border-radius:50%; background:#1b3b6f;}
.guide-page a.guide-ext{color:#1d5bd8; text-decoration:underline; word-break:break-all;}
.guide-page .guide-faq-item{padding:24px 0; border-bottom:1px solid #e6eaf1;}
.guide-page .guide-faq-item:first-child{padding-top:0;}
.guide-page .guide-faq-item h3{margin-top:0;}
.guide-page .guide-faq-item p{margin-top:12px;}
.guide-page .guide-cta{margin-top:56px; gap:12px; flex-wrap:wrap;}
.guide-page .guide-cta a{margin-left:0;}
.guide-page .guide-related{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-top:28px; padding:18px 22px;
  background:#f5f7fb; border:1px solid #dfe5ef; border-radius:10px; line-height:1.5;}
.guide-page .guide-related-label{flex:none; padding:3px 12px; border-radius:20px; background:#17264a; color:#fff; font-size:14px; font-weight:600;}
.guide-page .guide-related a{color:#0d4aaa; font-size:17px; font-weight:600; text-decoration:underline; word-break:keep-all;}
.guide-inline{margin-bottom:56px;}
.guide-inline + .guide-inline{margin-top:0;}
.guide-news-head{margin-top:72px;}
.guide-inline.guide-news-top{margin-bottom:0;}
.guide-news-top + .overview{margin-top:28px;}
#apply-form, #status-form, #contact-form{scroll-margin-top:110px;}

@media (max-width:800px){
  .guide-page .guide-sec + .guide-sec{margin-top:48px;}
  .guide-page .guide-sec h3{margin-top:28px; padding-left:28px; font-size:19px;}
  .guide-page .guide-list li{font-size:16px;}
  .guide-page .guide-cta{margin-top:40px;}
  .guide-page .guide-related{padding:14px 16px;}
  .guide-page .guide-related a{font-size:16px;}
  .guide-inline{margin-bottom:40px;}
  .guide-news-head{margin-top:48px;}
  #apply-form, #status-form, #contact-form{scroll-margin-top:90px;}
}
@media (max-width:500px){
  .guide-page .guide-sec h3{font-size:17px;}
  .guide-page .guide-list li{font-size:14px;}
  .guide-page .guide-related a{font-size:15px;}
}