/* 86·87: 모바일 상단 헤더(로고 + 전체보기) + 메뉴 탭 줄 + 전체보기 화면 — E안 v2. 768px 이하에서만 동작 */
#spMnav, #spMnavSheet { display: none; }
@media (max-width: 768px) {
  :root, body, body[data-density] { --logo-top: 0px !important; --gnb-h: 108px !important; }
  #brandLogo, #gnb, #mobileMenuBtn, #mobileNavDrawer, #gnbProgressBarTrack, #gnbProgressBadge { display: none !important; }

  #spMnav { display: block; position: fixed; top: 0; left: 0; right: 0; z-index: 999990; font-family: inherit; }
  #spMnav .spm-hdr { height: 58px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px 0 14px; background: #c0c0c0; border-bottom: 2px solid #000000; box-shadow: inset 0 2px 0 #ffffff; }
  #spMnav .spm-logo { display: flex; align-items: center; height: 44px; }
  #spMnav .spm-logo img { display: block; height: 14px; width: auto; }
  #spMnav .spm-all { height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; font-family: inherit; font-size: 13.5px; font-weight: 800; color: #000000; background: #c0c0c0; border: 2px solid #000000; box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #808080, 2px 2px 0 #000000; cursor: pointer; }
  #spMnav .spm-all.is-open { background: #000000; color: #ffffff; box-shadow: 2px 2px 0 #808080; }

  #spMnav .spm-bar { position: relative; height: 50px; background: #c0c0c0; border-bottom: 2px solid #000000; }
  #spMnav .spm-tabs { display: flex; gap: 6px; height: 48px; padding: 8px; overflow-x: auto; overflow-y: hidden; white-space: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; }
  #spMnav .spm-tabs::-webkit-scrollbar { display: none; }
  #spMnav .spm-tabs::after { content: ''; flex: none; width: 40px; }
  #spMnav .spm-tabs a { flex: none; height: 30px; padding: 0 12px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 800; color: #000000; background: #ffffff; border: 2px solid #000000; box-shadow: 2px 2px 0 #808080; text-decoration: none; }
  #spMnav .spm-tabs a.is-on { background: #000000; color: #ffffff; }
  #spMnav .spm-fade { position: absolute; top: 0; width: 40px; height: 48px; pointer-events: none; }
  #spMnav .spm-fade.r { right: 44px; background: linear-gradient(90deg, rgba(192,192,192,0), #c0c0c0); }
  #spMnav .spm-fade.l { left: 44px; background: linear-gradient(270deg, rgba(192,192,192,0), #c0c0c0); }
  #spMnav .spm-arr { position: absolute; top: 0; width: 44px; height: 48px; padding: 0; display: flex; align-items: center; justify-content: center; background: #c0c0c0; border: 0; cursor: pointer; }
  #spMnav .spm-arr.r { right: 0; border-left: 2px solid #000000; }
  #spMnav .spm-arr.l { left: 0; border-right: 2px solid #000000; }
  #spMnav .spm-arr b { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 900; line-height: 1; color: #ffffff; background: #000000; border: 2px solid #000000; box-shadow: 2px 2px 0 #808080; }
  #spMnav .spm-arr.r.is-nudge b { animation: spmNudge 0.6s ease-in-out 2; }
  #spMnav .spm-badge { position: absolute; top: 2px; right: 1px; z-index: 2; padding: 0 4px; font-size: 10px; font-weight: 900; line-height: 14px; color: #000000; background: #ffffff; border: 2px solid #000000; border-radius: 7px; pointer-events: none; }
  #spMnav .is-hidden { display: none !important; }
  @keyframes spmNudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
  @media (prefers-reduced-motion: reduce) { #spMnav .spm-arr.r.is-nudge b { animation: none; } #spMnav .spm-tabs { scroll-behavior: auto; } }

  #spMnavSheet.is-open { display: block; position: fixed; top: 58px; left: 0; right: 0; bottom: 0; z-index: 9999990; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; background: #c0c0c0; border-top: 2px solid #000000; }
  #spMnavSheet .spm-st { height: 30px; display: flex; align-items: center; padding: 0 10px; font-size: 13px; font-weight: 800; color: #ffffff; background: #000000; }
  #spMnavSheet .spm-sb { padding: 4px 10px 14px; }
  #spMnavSheet h4 { margin: 12px 0 6px; font-size: 12px; font-weight: 900; color: #333333; }
  #spMnavSheet .spm-g { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  #spMnavSheet .spm-g3 { grid-template-columns: 1fr 1fr 1fr; }
  #spMnavSheet .spm-g a { min-height: 46px; display: flex; align-items: center; padding: 0 12px; font-size: 14px; font-weight: 900; color: #000000; background: #ffffff; border: 2px solid #000000; box-shadow: 2px 2px 0 #808080; text-decoration: none; word-break: keep-all; }
  #spMnavSheet .spm-g3 a { justify-content: center; padding: 0 6px; }
  #spMnavSheet .spm-g a.is-on { background: #000000; color: #ffffff; }
  #spMnavSheet .spm-cta { display: flex; gap: 10px; margin-top: 20px; padding-top: 18px; border-top: 1px solid #808080; box-shadow: inset 0 1px 0 #ffffff; }
  #spMnavSheet .spm-cta a { flex: 1; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 13.5px; font-weight: 900; color: #000000; background: #c0c0c0; border: 2px solid #000000; box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #808080, 2px 2px 0 #000000; text-decoration: none; }

  /* 87: 모바일 회사소개서 보기(페이지 이미지) */
  #spPdf { display: none; }
  #spPdf.is-open { display: block; position: fixed; top: 58px; left: 0; right: 0; bottom: 0; z-index: 9999990; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; background: #c0c0c0; border-top: 2px solid #000000; }
  #spPdf .spp-wt { position: sticky; top: 0; z-index: 2; height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 6px 0 10px; font-size: 13.5px; font-weight: 800; color: #ffffff; background: #000000; }
  #spPdf .spp-x { width: 26px; height: 22px; padding: 0; font-size: 13px; font-weight: 900; color: #000000; background: #c0c0c0; border: 1px solid #ffffff; box-shadow: inset -1px -1px 0 #808080; cursor: pointer; }
  #spPdf .spp-info { margin: 8px; padding: 10px; background: #ffffff; border: 2px solid; border-color: #808080 #ffffff #ffffff #808080; }
  #spPdf .spp-info b { display: block; font-size: 15px; font-weight: 900; }
  #spPdf .spp-info small { display: block; margin-top: 3px; font-size: 12px; color: #555555; }
  #spPdf .spp-btns { display: flex; gap: 8px; margin: 0 8px 8px; }
  #spPdf .spp-btns a, #spPdf .spp-end a { flex: 1; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 13.5px; font-weight: 900; color: #000000; background: #c0c0c0; border: 2px solid #000000; box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #808080, 2px 2px 0 #000000; text-decoration: none; white-space: nowrap; }
  #spPdf .spp-tip { margin: 2px 10px 6px; font-size: 11.5px; color: #333333; }
  #spPdf .spp-pages { margin: 0 8px 8px; padding: 8px; display: flex; flex-direction: column; gap: 8px; background: #808080; border: 2px solid; border-color: #808080 #ffffff #ffffff #808080; }
  #spPdf .spp-pg { position: relative; background: #ffffff; border: 1px solid #000000; }
  #spPdf .spp-pg img { display: block; width: 100%; height: auto; }
  #spPdf .spp-pg i { position: absolute; right: 6px; bottom: 6px; padding: 1px 6px; font-size: 11px; font-style: normal; font-weight: 800; color: #ffffff; background: #000000; }
  #spPdf .spp-end { margin: 0 8px 16px; padding: 14px 12px; text-align: center; background: #ffffff; border: 2px solid #000000; }
  #spPdf .spp-end p { margin: 0 0 10px; font-size: 13.5px; font-weight: 800; word-break: keep-all; }
  #spPdf .spp-end a { display: inline-flex; flex: none; padding: 0 20px; }
  body.spm-lock { overflow: hidden !important; }

  /* 86: /contact/ 문의내용 입력칸 — 모바일에서 플레이스홀더가 잘리지 않게 */
  #inqMessage { min-height: 140px !important; }
}