/**
 * Sitemap 페이지 - 플랫 텍스트 디자인
 * 참고: 텍스트 + 구분선 중심, 박스/배경/그림자 없음
 */

/* ============================================
   페이지 컨테이너
   ============================================ */

#contents {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--edu-spacing-10, 40px) var(--edu-spacing-6, 24px);
}

/* ============================================
   페이지 헤더
   ============================================ */

.sitemap-header {
  text-align: center;
  margin-bottom: var(--edu-spacing-4, 16px);
}

.sitemap-header h1 {
  font-size: var(--edu-text-3xl, 1.875rem);
  font-weight: var(--edu-font-bold, 700);
  color: var(--edu-neutral-900, #0f172a);
  margin: 0 0 var(--edu-spacing-8, 32px) 0;
  letter-spacing: -0.02em;
}

/* ============================================
   메인 컨텐츠 - Row 기반 플랫 레이아웃
   ============================================ */

.sitemap-container {
  /* 플랫 리스트 컨테이너 */
}

.sitemap-row {
  display: flex;
  padding: var(--edu-spacing-8, 32px) 0;
  border-bottom: 1px solid var(--edu-neutral-200, #e2e8f0);
  gap: var(--edu-spacing-8, 32px);
}

.sitemap-row:last-child {
  border-bottom: none;
}

/* 대분류 (좌측 고정폭) */
.sitemap-category {
  flex: 0 0 180px;
  min-width: 180px;
}

.sitemap-category h2 {
  font-size: var(--edu-text-lg, 1.125rem);
  font-weight: var(--edu-font-bold, 700);
  color: var(--edu-neutral-900, #0f172a);
  margin: 0;
  letter-spacing: -0.01em;
}

/* 링크들 (우측 flexible) */
.sitemap-content {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--edu-spacing-1, 4px);
  align-items: baseline;
  line-height: 1.8;
}

/* 링크 스타일 */
.sitemap-link {
  font-size: var(--edu-text-sm, 0.875rem);
  color: var(--edu-neutral-600, #475569);
  text-decoration: none;
  transition: color 0.15s ease;
  display: inline-block;
}

.sitemap-link:hover {
  color: var(--edu-primary-600, #2563eb);
  text-decoration: underline;
}

/* ============================================
   반응형 디자인
   ============================================ */

/* 태블릿 이하 (< 1024px) */
@media (max-width: 1023px) {
  .sitemap-row {
    flex-direction: column;
    gap: var(--edu-spacing-4, 16px);
  }

  .sitemap-category {
    flex: none;
    min-width: auto;
  }
}

/* 모바일 (< 768px) */
@media (max-width: 767px) {
  #contents {
    padding: var(--edu-spacing-6, 24px) var(--edu-spacing-4, 16px);
  }

  /* 모바일에서는 페이지 내부 헤더 숨김 (상단 고정 헤더에 타이틀 표시) */
  .sitemap-header {
    display: none;
  }

  .sitemap-header h1 {
    font-size: var(--edu-text-2xl, 1.5rem);
  }

  .sitemap-row {
    padding: var(--edu-spacing-6, 24px) 0;
  }

  .sitemap-breadcrumb {
    text-align: left;
  }

  .sitemap-category h2 {
    margin-bottom: var(--edu-spacing-3, 12px);
  }
}