/* layout-tb.css — 기본 레이아웃 태블릿 반응형 (≤1024px) · scope: .site
 * <link media="(max-width:1024px)"> 로만 적용.
 * 이 구간부터 데스크탑 GNB·전체메뉴 버튼을 숨기고 햄버거(모바일 GNB)만 노출.
 */

/* @rule-override: R-1 — 요청에 따라 태블릿에서도 로그인·참여이력·언어 유틸을 유지 */
/* 데스크탑 GNB·전체메뉴 버튼 숨김, 기존 유틸과 모바일 햄버거는 유지 */
.gnb,
.util-btn {
  display: none;
}
.util-login,
.util-history,
.util-language {
  display: inline-flex;
}
.hamburger {
  display: flex;
}

.site {
  --dl-header-h: 64px;
}
.header-inner {
  gap: 8px;
  padding: 0 20px;
}
.header-inner > .logo-heading .logo {
  width: 240px;
  height: auto;
  aspect-ratio: 299 / 40;
}
.header-inner > .util {
  margin-left: auto;
  gap: 4px;
}
.header .util-login {
  min-width: 76px;
  height: 34px;
  padding: 0 8px;
  gap: 4px;
  font-size: 13px;
}
.util-login img {
  width: 18px;
  height: 18px;
}
.util-history {
  min-width: 100px;
  height: 34px;
  padding: 0 8px;
  font-size: 13px;
}
.util-language {
  min-width: 108px;
  height: 34px;
  font-size: 13px;
}
.util-language-toggle {
  height: 34px;
  padding: 0 8px;
  gap: 4px;
  font-size: 13px;
}
.util-language-google {
  width: 17px;
  height: 17px;
}
.util-language-arrow {
  width: 10px;
  height: 7px;
}
.hamburger {
  width: 40px;
  height: 40px;
  padding: 0 8px;
}

/* 태블릿 패널은 헤더 박스에 제한되지 않고 viewport 우측 전체 높이를 사용한다. */
[data-role="mobile-nav"] {
  display: flex;
  top: 0;
  right: 0;
  bottom: 0;
  height: 100vh;
  height: 100dvh;
  max-height: none;
}
.dim {
  display: block;
}

/* 서브 비주얼 */
.sub-visual > .inner {
  padding-right: 20px;
  padding-left: 20px;
}
.sub-visual .page-title {
  font-size: 40px;
}

.sub-body {
  padding: 0 20px 60px;
}
.page-title {
  font-size: 26px;
}

/* 서브 2단 → 1단. LNB 는 접이식(토글)로, 본문이 위로 온다 */
.sub-layout {
  grid-template-columns: 1fr;
  gap: 0;
}
.lnb {
  padding-top: 24px;
  order: -1;
}
.lnb-head {
  border-radius: 8px;
}
.lnb-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 15px;
  cursor: pointer;
}
.lnb-toggle-ico {
  width: 10px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  transition: transform 0.2s;
}
.lnb.is-open .lnb-toggle-ico {
  transform: rotate(-135deg);
}
.lnb-list {
  border-radius: 0 0 8px 8px;
  max-height: 0;
  border-width: 0 1px;
  overflow: hidden;
  transition: max-height 0.25s ease;
}
.lnb.is-open .lnb-list {
  max-height: 600px;
  border-width: 0 1px 1px;
}
.lnb.is-open .lnb-head {
  border-radius: 8px 8px 0 0;
}

/* @rule-override: R-10 — 전 디바이스에서 SNB 가로 스크롤을 사용하지 않음 */
.snb {
  margin-top: 24px;
}
.snb-list {
  flex-wrap: wrap;
  overflow-x: visible;
  -webkit-overflow-scrolling: auto;
  scrollbar-width: auto;
}
.snb-item {
  flex: 1 1 280px;
}
.snb-link {
  white-space: normal;
}

/* 푸터 */
.footer-inner {
  min-height: 0;
  padding: 42px 20px;
}
.footer-links {
  gap: 20px;
}
.footer-info {
  padding-top: 36px;
}