/* 공통 배경과 폰트 (이미 세팅되어 있을 수도 있습니다) */
body {
  background-color: #1e1e2f;  /* 예시: 어두운 배경색 */
  margin: 0;
  font-family: 'Inter', sans-serif;
  position: relative;         /* header 절대위치의 기준 */
}

/* 1) 상단 로고 컨테이너: 투명 + 절대 머리 고정 */
.site-header {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background: transparent;  /* 절대 투명 배경 */
  padding: 12px 0;          /* 위아래 여백 */
  z-index: 1000;            /* 사이드 메뉴 위에도 올라오게 */
}

/* 2) 로고 이미지 자체 */
.site-logo {
  display: block;
  max-width: 250px;         /* 원하시는 크기로 조절 */
  width: auto;
  height: auto;
}

/* 3) 본문(.container)을 header 높이만큼 아래로 내리기 */
.container {
  padding-top: 50px;        /* header 높이(=로고+여백) 만큼 */
}

/* 4) 모바일에서는 상단 로고 숨기고 하단 메뉴 로고만 보이게 */
@media (max-width: 768px) {

  .bottom-nav .nav-text {
    display: none;
  }
  .bottom-nav .nav-logo {
    display: block;
    width: 24px;
    margin: 0 auto;
  }

}