@charset "utf-8";
/* ==========================================================================
   BizLab 레이아웃 — 헤더 / 푸터
   그누보드 기본 테마(#hd, #ft)를 덮어쓴다. 로드 순서상 뒤에 와야 함.
   ========================================================================== */

/* 기본 테마 잔재 제거 ---------------------------------------------------- */
#hd_h1, #skip_to_container, #tnb, #hd_wrapper, #gnb,
#ft_wr, #ft_catch, #hd_pop { display:none !important }
#hd{ position:static; height:auto; border:0; background:transparent }
/* ※ width:100% + min-width:0 이 있어야 자식(캐러셀 트랙)이 컨테이너를
      밀어내지 않는다. width:auto만 주면 max-content 자식만큼 늘어난다. */
html,body{ overflow-x:hidden; max-width:100% }
#wrapper{ width:100%; max-width:100%; min-width:0; margin:0; padding:0; overflow-x:clip }
#container_wr{ width:100%; max-width:100%; min-width:0; margin:0; padding:0; background:none }
/* #container의 width/margin은 아래 '4. 서브페이지' 항목에서 정한다.
   여기서 margin:0을 주면 뒤의 margin:40px auto 를 덮어 좌측 정렬돼 버린다. */
#container{ max-width:100%; min-width:0; min-height:0; padding:0;
  border:0; background:none; overflow-x:clip }
#aside{ display:none }          /* 메인에서 사이드 로그인박스 숨김 */
#ft{ margin:0; padding:0; background:transparent; border:0; text-align:left }
hr{ display:none }

body{ font-family:Pretendard,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  color:var(--bz-ink); background:var(--bz-paper);
  -webkit-font-smoothing:antialiased; letter-spacing:-.02em }
a{ color:inherit; text-decoration:none }

/* 1. 헤더 --------------------------------------------------------------- */
.bz-header{ position:sticky; top:0; z-index:100; height:70px;
  background:rgba(255,255,255,.93); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--bz-line) }
.bz-header__inner{ display:flex; align-items:center; gap:28px; height:100% }

.bz-logo{ font-size:25px; font-weight:900; letter-spacing:-.055em;
  color:var(--bz-teal); flex:none; line-height:1 }
.bz-logo em{ font-style:normal; color:var(--bz-red) }

.bz-gnb{ display:flex; align-items:center; gap:28px; margin-right:auto }
.bz-gnb > li{ position:relative; list-style:none }
.bz-gnb__link{ display:block; padding:24px 0; font-size:var(--fs-sm);
  font-weight:600; color:var(--bz-ink); transition:color .18s ease }
.bz-gnb__link:hover{ color:var(--bz-teal) }
.bz-gnb__sub{ position:absolute; top:100%; left:-14px; min-width:170px; padding:8px 0;
  border:1px solid var(--bz-line); border-radius:var(--bz-radius-sm); background:#fff;
  box-shadow:var(--bz-shadow-lg); opacity:0; visibility:hidden;
  transform:translateY(-6px); transition:all .2s ease; list-style:none; margin:0 }
.bz-gnb > li:hover .bz-gnb__sub{ opacity:1; visibility:visible; transform:none }
.bz-gnb__sub a{ display:block; padding:9px 18px; font-size:var(--fs-sm); color:var(--bz-muted) }
.bz-gnb__sub a:hover{ background:var(--bz-teal-soft); color:var(--bz-teal-dark) }

.bz-header__util{ display:flex; align-items:center; gap:16px; flex:none }
.bz-header__util a{ font-size:var(--fs-xs); color:var(--bz-muted) }
.bz-header__util a:hover{ color:var(--bz-ink) }
.bz-header__cta{ min-height:42px; padding:0 20px; font-size:var(--fs-xs) }

.bz-menu-btn{ display:none; width:42px; height:42px; padding:0; border:0;
  background:transparent; cursor:pointer; flex-direction:column;
  justify-content:center; gap:5px; align-items:center }
.bz-menu-btn span{ display:block; width:20px; height:2px; background:var(--bz-ink);
  border-radius:2px; transition:transform .25s ease, opacity .2s ease }
.bz-menu-btn.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg) }
.bz-menu-btn.is-open span:nth-child(2){ opacity:0 }
.bz-menu-btn.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg) }

.bz-mobile-nav{ display:none; position:fixed; inset:70px 0 auto; z-index:99;
  padding:16px 20px 26px; background:#fff; border-bottom:1px solid var(--bz-line);
  box-shadow:var(--bz-shadow-lg); max-height:calc(100vh - 70px); overflow-y:auto }
.bz-mobile-nav.is-open{ display:block }
.bz-mobile-nav a{ display:block; padding:13px 2px; font-size:var(--fs-base);
  font-weight:600; border-bottom:1px solid var(--bz-line) }
.bz-mobile-nav .sub a{ padding-left:14px; font-weight:400; color:var(--bz-muted);
  font-size:var(--fs-sm) }

@media (max-width:960px){
  .bz-gnb{ display:none }
  .bz-menu-btn{ display:flex }
  .bz-header__util .bz-hide-sm{ display:none }
}

/* 2. 푸터 --------------------------------------------------------------- */
.bz-footer{ margin-top:0; padding:64px 0 32px; background:var(--bz-ink); color:#fff; text-align:left }
.bz-footer__top{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:36px;
  padding-bottom:38px; border-bottom:1px solid rgba(255,255,255,.13) }
@media (max-width:900px){ .bz-footer__top{ grid-template-columns:1fr 1fr; gap:30px } }
@media (max-width:560px){ .bz-footer__top{ grid-template-columns:1fr } }

.bz-footer h3{ font-size:23px; font-weight:900; letter-spacing:-.05em;
  color:var(--bz-teal); margin:0 0 12px }
.bz-footer h3 em{ font-style:normal; color:#fff }
.bz-footer h4{ font-size:var(--fs-sm); font-weight:700; margin:0 0 14px; color:#fff }
.bz-footer p, .bz-footer li{ font-size:var(--fs-xs); line-height:1.9;
  color:#9CA3AF; margin:0; list-style:none }
.bz-footer a{ color:#9CA3AF; transition:color .18s ease }
.bz-footer a:hover{ color:#fff }
.bz-footer__biz{ margin-top:14px; font-size:12px; line-height:1.85 }
.bz-footer__cta{ margin-top:14px }

.bz-footer__bottom{ display:flex; justify-content:space-between; gap:16px;
  flex-wrap:wrap; padding-top:24px; font-size:12px; color:#6B7280 }
.bz-footer__bottom a{ color:#9CA3AF }

/* 3. 상단 이동 버튼 ------------------------------------------------------ */
#top_btn{ position:fixed; right:24px; bottom:24px; z-index:90;
  width:48px; height:48px; border:1px solid var(--bz-line); border-radius:50%;
  background:#fff; color:var(--bz-ink); cursor:pointer; box-shadow:var(--bz-shadow);
  transition:transform .2s ease }
#top_btn:hover{ transform:translateY(-3px); border-color:var(--bz-ink) }

/* 4. 서브페이지(게시판·쇼핑몰) 본문 여백 --------------------------------
   메인은 bizlab-main.css가 이 제한을 !important로 되돌린다.
/* ※ 기본 테마의 #container는 float:left + width:930px 이다.
      float를 풀지 않으면 margin:auto 가 무력화돼 좌측에 붙는다.
      default.css가 뒤에 로드될 수 있어 !important로 고정한다. */
#container{ float:none!important; width:min(1240px,calc(100% - 40px))!important;
  margin:40px auto 0!important; min-height:400px }
#container_title{ font-size:var(--fs-2xl); font-weight:800;
  letter-spacing:-.03em; margin:0 0 24px; padding:0; border:0 }