/* =========================================================
   GILDONGSEKKI SHARED HEADER V1
========================================================= */

.shared-site-header{
  box-sizing:border-box !important;

  width:100% !important;
  height:74px !important;

  margin:0 !important;

  z-index:5000 !important;

  font-family:
    Arial,
    "Noto Sans KR",
    sans-serif;
}


.shared-sub-header{
  position:sticky !important;

  top:0 !important;

  background:
    rgba(255,255,255,.97) !important;

  border-bottom:
    1px solid rgba(55,78,62,.10) !important;

  backdrop-filter:
    blur(14px);
}


.shared-home-header{
  position:fixed !important;

  top:0 !important;
  left:0 !important;

  background:
    linear-gradient(
      to bottom,
      rgba(15,30,20,.30),
      rgba(15,30,20,0)
    ) !important;

  border-bottom:
    1px solid transparent !important;

  transition:
    background .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}


.shared-home-header.is-scrolled{
  background:
    rgba(255,255,255,.96) !important;

  border-bottom-color:
    rgba(55,78,62,.10) !important;

  box-shadow:
    0 5px 22px
    rgba(30,50,36,.06);

  backdrop-filter:
    blur(14px);
}


.shared-header-inner{
  box-sizing:border-box;

  width:min(
    1420px,
    calc(100% - 46px)
  );

  height:100%;

  margin:auto;

  display:flex;

  align-items:center;

  gap:27px;
}


/* =========================================================
   BRAND
========================================================= */

.shared-brand{
  min-width:max-content;

  display:flex;

  align-items:center;

  gap:10px;

  color:#38513f;

  text-decoration:none;
}


.shared-brand-mark{
  width:37px;
  height:37px;

  flex:0 0 37px;

  display:grid;

  place-items:center;

  box-sizing:border-box;

  border:
    1px solid #728877;

  border-radius:50%;

  font-family:
    Georgia,
    serif;

  font-size:11px;

  font-weight:700;

  letter-spacing:.04em;
}


.shared-brand-copy{
  display:flex;

  flex-direction:column;

  line-height:1.05;
}


.shared-brand-copy strong{
  color:inherit;

  font-size:13px;

  font-weight:800;
}


.shared-brand-copy small{
  margin-top:5px;

  color:inherit;

  opacity:.63;

  font-size:6px;

  font-weight:700;

  letter-spacing:.14em;
}


.shared-brand-family{
  width:auto;
  height:43px;

  margin-left:3px;

  object-fit:contain;

  object-position:center;

  pointer-events:none;
}


/* HOME WHITE VERSION */

.shared-home-header:not(.is-scrolled)
.shared-brand{
  color:#fff;
}


.shared-home-header:not(.is-scrolled)
.shared-brand-mark{
  border-color:
    rgba(255,255,255,.72);
}


/* =========================================================
   NAV
========================================================= */

.shared-nav{
  height:100%;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:24px;

  flex:1;
}


.shared-nav a{
  position:relative;

  height:100%;

  display:flex;

  align-items:center;

  color:#647168 !important;

  text-decoration:none !important;

  font-size:9px !important;

  font-weight:800 !important;

  letter-spacing:.08em;

  white-space:nowrap;
}


.shared-nav a::after{
  content:"";

  position:absolute;

  left:50%;
  bottom:0;

  width:0;
  height:2px;

  background:#4c7258;

  transform:
    translateX(-50%);

  transition:
    width .18s ease;
}


.shared-nav a:hover::after,
.shared-nav a.active::after{
  width:100%;
}


.shared-nav a.active{
  color:#365941 !important;
}


.shared-home-header:not(.is-scrolled)
.shared-nav a{
  color:
    rgba(255,255,255,.82) !important;
}


.shared-home-header:not(.is-scrolled)
.shared-nav a.active{
  color:#fff !important;
}


.shared-home-header:not(.is-scrolled)
.shared-nav a::after{
  background:#fff;
}


/* =========================================================
   AUTH
========================================================= */

.shared-auth{
  min-width:max-content;

  display:flex;

  align-items:center;

  justify-content:flex-end;

  gap:9px;
}


.shared-login-button,
.shared-logout-button{
  min-height:34px;

  padding:
    0 13px;

  border:
    1px solid #cfd8d0;

  border-radius:5px;

  background:#fff;

  color:#476052;

  font-family:inherit;

  font-size:8px;

  font-weight:900;

  letter-spacing:.07em;

  cursor:pointer;
}


.shared-login-button:hover{
  border-color:#66806c;

  background:#f7faf7;
}


.shared-logout-button{
  padding:
    0 9px;

  border-color:transparent;

  background:transparent;

  color:#929b94;

  font-size:7px;
}


.shared-home-header:not(.is-scrolled)
.shared-login-button{
  border-color:
    rgba(255,255,255,.65);

  background:
    rgba(255,255,255,.10);

  color:#fff;
}


.shared-home-header:not(.is-scrolled)
.shared-logout-button{
  color:
    rgba(255,255,255,.72);
}


.shared-user{
  display:flex;

  align-items:center;

  gap:7px;

  color:#405548;

  text-decoration:none;
}


.shared-user-avatar{
  width:31px;
  height:31px;

  flex:0 0 31px;

  border-radius:50%;

  object-fit:cover;

  background:#eef2ed;
}


.shared-user-text{
  max-width:95px;

  display:flex;

  flex-direction:column;
}


.shared-user-text strong{
  overflow:hidden;

  color:inherit;

  font-size:9px;

  text-overflow:ellipsis;

  white-space:nowrap;
}


.shared-user-text small{
  margin-top:2px;

  overflow:hidden;

  color:#969e98;

  font-size:7px;

  text-overflow:ellipsis;

  white-space:nowrap;
}


.shared-home-header:not(.is-scrolled)
.shared-user{
  color:#fff;
}


.shared-home-header:not(.is-scrolled)
.shared-user-text small{
  color:
    rgba(255,255,255,.65);
}


.shared-auth.loading{
  opacity:.6;
}


/* =========================================================
   MOBILE BUTTON
========================================================= */

.shared-menu-button{
  display:none;

  width:38px;
  height:38px;

  padding:8px;

  border:0;

  background:transparent;

  cursor:pointer;
}


.shared-menu-button span{
  display:block;

  height:1px;

  margin:5px 0;

  background:#516458;
}


.shared-home-header:not(.is-scrolled)
.shared-menu-button span{
  background:#fff;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1100px){

  .shared-header-inner{
    gap:17px;
  }


  .shared-nav{
    gap:15px;
  }


  .shared-brand-family{
    height:37px;
  }

}


@media(max-width:900px){

  .shared-site-header{
    height:66px !important;
  }


  .shared-header-inner{
    width:
      calc(100% - 24px);

    gap:10px;
  }


  .shared-brand-mark{
    width:34px;
    height:34px;

    flex-basis:34px;
  }


  .shared-brand-family{
    height:34px;
  }


  .shared-menu-button{
    display:block;

    order:4;
  }


  .shared-auth{
    margin-left:auto;

    order:3;
  }


  .shared-nav{
    position:absolute;

    top:66px;
    left:0;
    right:0;

    height:auto;

    padding:
      9px 14px 15px;

    display:none;

    flex-direction:column;

    align-items:stretch;

    gap:0;

    background:
      rgba(255,255,255,.985);

    border-bottom:
      1px solid #dfe5df;

    box-shadow:
      0 14px 28px
      rgba(34,50,39,.09);
  }


  .shared-site-header.menu-open
  .shared-nav{
    display:flex;
  }


  .shared-nav a,
  .shared-home-header:not(.is-scrolled)
  .shared-nav a{
    height:43px;

    padding:
      0 8px;

    color:#53645a !important;

    border-bottom:
      1px solid #eef1ed;

    font-size:10px !important;
  }


  .shared-nav a::after{
    display:none;
  }


  .shared-nav a.active,
  .shared-home-header:not(.is-scrolled)
  .shared-nav a.active{
    color:#355a40 !important;

    background:#f3f7f3;
  }

}


@media(max-width:600px){

  .shared-brand{
    gap:7px;
  }


  .shared-brand-copy small{
    display:none;
  }


  .shared-brand-copy strong{
    font-size:12px;
  }


  .shared-brand-family{
    height:31px;

    margin-left:0;
  }


  .shared-login-button{
    min-height:32px;

    padding:
      0 9px;

    font-size:7px;
  }


  .shared-user-text{
    display:none;
  }


  .shared-user-avatar{
    width:30px;
    height:30px;

    flex-basis:30px;
  }


  .shared-logout-button{
    display:none;
  }

}


@media(max-width:410px){

  .shared-brand-family{
    height:27px;
  }


  .shared-brand-mark{
    display:none;
  }

}


/* =========================================================
   GILDONGSEKKI MAIN LOGO V4
========================================================= */

.shared-brand{
  min-width:76px !important;

  display:flex !important;

  align-items:center !important;

  justify-content:flex-start !important;

  gap:0 !important;

  overflow:visible !important;
}


/* 기존 GS + 워드마크는 사용하지 않음 */

.shared-brand-mark,
.shared-brand-copy,
.shared-brand-family{
  display:none !important;
}


.shared-main-logo{
  display:block !important;

  width:auto !important;

  height:70px !important;

  max-width:none !important;

  margin:0 !important;

  padding:0 !important;

  object-fit:contain !important;

  object-position:center !important;

  flex:0 0 auto !important;

  transform:none !important;

  filter:
    drop-shadow(
      0 2px 4px
      rgba(0,0,0,.12)
    );
}


/* HOME 배경 위에서는 약간 더 또렷하게 */

.shared-home-header:not(.is-scrolled)
.shared-main-logo{
  filter:
    drop-shadow(
      0 2px 5px
      rgba(0,0,0,.30)
    );
}


/* 태블릿 */

@media(max-width:900px){

  .shared-main-logo{
    height:61px !important;
  }

}


/* 모바일 */

@media(max-width:600px){

  .shared-main-logo{
    height:54px !important;
  }

}


@media(max-width:410px){

  .shared-main-logo{
    height:48px !important;
  }

}


/* =========================================================
   LARGE SYMBOL LOGO V5
========================================================= */

.shared-site-header{
  height:88px !important;
}


.shared-header-inner{
  overflow:visible !important;
}


.shared-brand{
  min-width:112px !important;

  height:100%;

  display:flex !important;

  align-items:center !important;

  overflow:visible !important;
}


.shared-main-logo{
  width:auto !important;

  height:84px !important;

  max-width:120px !important;

  display:block !important;

  object-fit:contain !important;

  overflow:visible !important;

  filter:
    drop-shadow(
      0 3px 7px
      rgba(0,0,0,.20)
    ) !important;
}


/*
 * 로고가 상징 요소라 네비보다 시각적으로 크게 사용.
 * 헤더 안에서 거의 꽉 차게 보이도록 함.
 */

.shared-home-header:not(.is-scrolled)
.shared-main-logo{
  height:88px !important;

  filter:
    drop-shadow(
      0 3px 8px
      rgba(0,0,0,.32)
    ) !important;
}


@media(max-width:900px){

  .shared-site-header{
    height:76px !important;
  }


  .shared-nav{
    top:76px !important;
  }


  .shared-brand{
    min-width:92px !important;
  }


  .shared-main-logo,
  .shared-home-header:not(.is-scrolled)
  .shared-main-logo{
    height:72px !important;

    max-width:98px !important;
  }

}


@media(max-width:600px){

  .shared-site-header{
    height:68px !important;
  }


  .shared-nav{
    top:68px !important;
  }


  .shared-brand{
    min-width:78px !important;
  }


  .shared-main-logo,
  .shared-home-header:not(.is-scrolled)
  .shared-main-logo{
    height:64px !important;

    max-width:86px !important;
  }

}








/* =========================================================
   IMAGE NAVIGATION V1
========================================================= */

/*
 * 기존 텍스트 메뉴의 밑줄/텍스트 규칙을
 * 이미지 메뉴에서는 사용하지 않는다.
 */

.shared-nav{
  gap:8px !important;

  overflow:visible !important;
}


.shared-nav-link{
  position:relative;

  width:74px;
  height:74px !important;

  padding:0 !important;

  display:flex !important;

  align-items:center !important;
  justify-content:center !important;

  overflow:visible;

  text-decoration:none !important;
}


.shared-nav-link::after{
  display:none !important;
}


.shared-nav-image{
  display:block;

  width:64px;
  height:64px;

  object-fit:contain;

  transition:
    transform .18s ease,
    filter .18s ease,
    opacity .18s ease;

  filter:
    drop-shadow(
      0 2px 5px
      rgba(0,0,0,.22)
    );

  opacity:.88;
}


/*
 * 마우스 올렸을 때
 */

.shared-nav-link:hover
.shared-nav-image{
  transform:
    translateY(-2px)
    scale(1.08);

  opacity:1;

  filter:
    drop-shadow(
      0 4px 9px
      rgba(0,0,0,.28)
    );
}


/*
 * 현재 페이지 메뉴.
 * 이미지 자체가 확실히 커지게.
 */

.shared-nav-link.active
.shared-nav-image{
  transform:
    translateY(-3px)
    scale(1.13);

  opacity:1;

  filter:
    drop-shadow(
      0 4px 10px
      rgba(0,0,0,.30)
    );
}


/*
 * 선택 표시
 */

.shared-nav-link.active::before{
  content:"";

  position:absolute;

  left:50%;
  bottom:-1px;

  width:28px;
  height:3px;

  border-radius:999px;

  background:
    rgba(255,255,255,.95);

  transform:
    translateX(-50%);

  box-shadow:
    0 2px 5px
    rgba(0,0,0,.18);
}


/*
 * 이미지가 아직 없는 메뉴용 fallback.
 */

.shared-nav-fallback{
  color:
    rgba(255,255,255,.95);

  font-size:9px;

  font-weight:900;

  letter-spacing:.06em;

  text-shadow:
    0 1px 3px
    rgba(0,0,0,.55);
}


/* =========================================================
   MAIN LOGO V2
========================================================= */

.shared-main-logo{
  height:82px !important;

  width:auto !important;

  max-width:112px !important;

  object-fit:contain !important;

  filter:
    drop-shadow(
      0 3px 8px
      rgba(0,0,0,.28)
    ) !important;
}


.shared-brand{
  min-width:114px !important;
}


/* =========================================================
   SCROLLED HEADER
========================================================= */

.shared-home-header.is-scrolled
.shared-nav-image{
  filter:
    drop-shadow(
      0 2px 5px
      rgba(0,0,0,.20)
    );
}


.shared-home-header.is-scrolled
.shared-nav-link.active::before{
  background:#ffffff;
}


/* =========================================================
   SUB PAGES
========================================================= */

/*
 * 서브페이지는 흰 배경이라
 * 나무색 이미지가 그대로 잘 보인다.
 */

.shared-sub-header
.shared-nav-image{
  opacity:.88;

  filter:
    drop-shadow(
      0 2px 3px
      rgba(74,54,30,.14)
    );
}


.shared-sub-header
.shared-nav-link:hover
.shared-nav-image,
.shared-sub-header
.shared-nav-link.active
.shared-nav-image{
  opacity:1;
}


.shared-sub-header
.shared-nav-link.active::before{
  background:#4a674f;
}


.shared-sub-header
.shared-nav-fallback{
  color:#53645a;

  text-shadow:none;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1100px){

  .shared-nav{
    gap:3px !important;
  }


  .shared-nav-link{
    width:63px;

    height:68px !important;
  }


  .shared-nav-image{
    width:55px;

    height:55px;
  }


  .shared-main-logo{
    height:72px !important;

    max-width:98px !important;
  }


  .shared-brand{
    min-width:98px !important;
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:900px){

  /*
   * 모바일 메뉴는 세로 펼침 구조.
   */

  .shared-nav{
    gap:0 !important;
  }


  .shared-nav-link{
    width:100% !important;

    height:72px !important;

    padding:
      4px 12px !important;

    justify-content:flex-start !important;
  }


  .shared-nav-image{
    width:58px;

    height:58px;

    flex:0 0 58px;
  }


  .shared-nav-link.active::before{
    left:4px;
    top:50%;
    bottom:auto;

    width:3px;
    height:34px;

    transform:
      translateY(-50%);
  }


  .shared-nav-fallback{
    padding-left:10px;

    color:#53645a !important;

    font-size:11px;

    text-shadow:none !important;
  }

}


@media(max-width:600px){

  .shared-main-logo{
    height:61px !important;

    max-width:84px !important;
  }


  .shared-brand{
    min-width:84px !important;
  }

}


/* HEADER_IMAGE_BALANCE_V2_BEGIN */

/* =========================================================
   IMAGE HEADER BALANCE V2
   로고 / 메뉴 / 사용자 영역의 시각적 위계 정리
========================================================= */


/* ---------------------------------------------------------
   DESKTOP HEADER FRAME
--------------------------------------------------------- */

@media(min-width:901px){

  .shared-site-header{
    height:92px !important;
  }


  /*
   * flex가 아니라 3열 grid.
   * 메뉴가 좌우 요소 크기에 영향받지 않고
   * 정확하게 가운데에 위치한다.
   */

  .shared-header-inner{
    width:min(
      1480px,
      calc(100% - 48px)
    ) !important;

    height:100% !important;

    display:grid !important;

    grid-template-columns:
      132px
      minmax(0,1fr)
      160px;

    align-items:center !important;

    gap:18px !important;

    margin:0 auto !important;

    overflow:visible !important;
  }


  /* =======================================================
     MAIN LOGO
  ======================================================= */

  .shared-brand{
    width:118px !important;
    min-width:118px !important;

    height:100% !important;

    display:flex !important;

    align-items:center !important;
    justify-content:flex-start !important;

    overflow:visible !important;
  }


  .shared-main-logo{
    display:block !important;

    width:80px !important;
    height:80px !important;

    max-width:80px !important;
    max-height:80px !important;

    margin:0 !important;

    object-fit:contain !important;

    transform:none !important;

    opacity:1 !important;

    filter:
      drop-shadow(
        0 3px 7px
        rgba(0,0,0,.22)
      ) !important;
  }


  /* =======================================================
     NAV
  ======================================================= */

  .shared-nav{
    width:100% !important;
    height:100% !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    gap:13px !important;

    overflow:visible !important;
  }


  /*
   * 메뉴 하나당 동일한 영역.
   * 이미지 원본 크기가 달라도
   * 메뉴 기준선은 동일해진다.
   */

  .shared-nav-link{
    position:relative !important;

    width:68px !important;
    height:74px !important;

    flex:
      0 0 68px !important;

    padding:0 !important;
    margin:0 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    overflow:visible !important;

    border:0 !important;

    background:
      transparent !important;

    text-decoration:
      none !important;
  }


  .shared-nav-image{
    display:block !important;

    width:60px !important;
    height:60px !important;

    max-width:60px !important;
    max-height:60px !important;

    margin:0 !important;

    object-fit:
      contain !important;

    object-position:
      center !important;

    opacity:.96 !important;

    transform:
      translateY(0)
      scale(1) !important;

    transform-origin:
      center center;

    filter:
      drop-shadow(
        0 2px 4px
        rgba(0,0,0,.20)
      ) !important;

    transition:
      transform .18s ease,
      filter .18s ease,
      opacity .18s ease !important;
  }


  /*
   * hover는 과하지 않게.
   */

  .shared-nav-link:hover
  .shared-nav-image{
    opacity:1 !important;

    transform:
      translateY(-2px)
      scale(1.035) !important;

    filter:
      drop-shadow(
        0 4px 8px
        rgba(0,0,0,.25)
      ) !important;
  }


  /*
   * 기존 1.13배 active 확대를 없애고
   * 1.04 정도만 강조.
   */

  .shared-nav-link.active
  .shared-nav-image{
    opacity:1 !important;

    transform:
      translateY(-2px)
      scale(1.04) !important;

    filter:
      drop-shadow(
        0 4px 9px
        rgba(0,0,0,.28)
      ) !important;
  }


  /*
   * 선택 표시도 이미지와 붙지 않도록
   * 아래쪽에 작고 얇게.
   */

  .shared-nav-link.active::before{
    content:"" !important;

    position:absolute !important;

    left:50% !important;
    bottom:1px !important;

    width:25px !important;
    height:2px !important;

    border-radius:999px !important;

    background:
      rgba(255,255,255,.92) !important;

    transform:
      translateX(-50%) !important;

    box-shadow:
      0 1px 4px
      rgba(0,0,0,.20) !important;
  }


  .shared-sub-header
  .shared-nav-link.active::before{
    background:
      #4a674f !important;
  }


  /* =======================================================
     RIGHT USER AREA
  ======================================================= */

  .shared-auth{
    width:160px !important;

    min-width:160px !important;

    margin:0 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:flex-end !important;

    gap:9px !important;
  }


  .shared-user-avatar{
    width:34px !important;
    height:34px !important;

    flex:
      0 0 34px !important;
  }


  .shared-user-text{
    max-width:82px !important;
  }


  .shared-user-text strong{
    font-size:9px !important;
  }


  .shared-user-text small{
    font-size:6px !important;
  }


  .shared-logout-button{
    padding:
      0 4px !important;

    font-size:6px !important;
  }

}


/* ---------------------------------------------------------
   LARGE / MEDIUM DESKTOP
--------------------------------------------------------- */

@media(min-width:901px) and (max-width:1200px){

  .shared-header-inner{
    width:
      calc(100% - 30px) !important;

    grid-template-columns:
      105px
      minmax(0,1fr)
      130px;

    gap:10px !important;
  }


  .shared-brand{
    width:100px !important;
    min-width:100px !important;
  }


  .shared-main-logo{
    width:72px !important;
    height:72px !important;

    max-width:72px !important;
    max-height:72px !important;
  }


  .shared-nav{
    gap:6px !important;
  }


  .shared-nav-link{
    width:59px !important;
    height:68px !important;

    flex-basis:
      59px !important;
  }


  .shared-nav-image{
    width:53px !important;
    height:53px !important;

    max-width:53px !important;
    max-height:53px !important;
  }


  .shared-auth{
    width:130px !important;
    min-width:130px !important;
  }

}


/* =========================================================
   HOME
   기존 HERO 투명 헤더 구조 유지
========================================================= */

.shared-home-header:not(.is-scrolled)
.shared-main-logo{
  filter:
    drop-shadow(
      0 2px 4px
      rgba(0,0,0,.34)
    )
    drop-shadow(
      0 6px 13px
      rgba(0,0,0,.15)
    ) !important;
}


.shared-home-header:not(.is-scrolled)
.shared-nav-image{
  opacity:.98 !important;

  filter:
    drop-shadow(
      0 2px 4px
      rgba(0,0,0,.30)
    ) !important;
}


/*
 * 스크롤하면 메뉴 이미지를 아주 살짝 차분하게.
 */

.shared-home-header.is-scrolled
.shared-nav-image{
  opacity:.96 !important;

  filter:
    drop-shadow(
      0 2px 4px
      rgba(0,0,0,.18)
    ) !important;
}


/* =========================================================
   MOBILE / TABLET
========================================================= */

@media(max-width:900px){

  .shared-site-header{
    height:70px !important;
  }


  .shared-header-inner{
    width:
      calc(100% - 22px) !important;

    height:100% !important;

    display:flex !important;

    align-items:center !important;

    gap:8px !important;

    margin:
      0 auto !important;
  }


  .shared-brand{
    width:auto !important;
    min-width:68px !important;

    height:100% !important;
  }


  .shared-main-logo{
    width:64px !important;
    height:64px !important;

    max-width:64px !important;
    max-height:64px !important;

    object-fit:
      contain !important;
  }


  /*
   * 모바일에서는 기존 펼침 메뉴.
   */

  .shared-nav{
    top:70px !important;

    gap:0 !important;
  }


  .shared-nav-link{
    width:100% !important;
    height:65px !important;

    padding:
      3px 14px !important;

    display:flex !important;

    justify-content:flex-start !important;

    box-sizing:
      border-box !important;
  }


  .shared-nav-image{
    width:52px !important;
    height:52px !important;

    max-width:52px !important;
    max-height:52px !important;

    flex:
      0 0 52px !important;

    transform:
      none !important;
  }


  .shared-nav-link:hover
  .shared-nav-image,
  .shared-nav-link.active
  .shared-nav-image{
    transform:
      scale(1.03) !important;
  }


  .shared-nav-link.active::before{
    left:4px !important;

    top:50% !important;
    bottom:auto !important;

    width:3px !important;
    height:30px !important;

    transform:
      translateY(-50%) !important;
  }


  .shared-auth{
    margin-left:auto !important;

    width:auto !important;
    min-width:0 !important;
  }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:600px){

  .shared-site-header{
    height:66px !important;
  }


  .shared-nav{
    top:66px !important;
  }


  .shared-main-logo{
    width:59px !important;
    height:59px !important;

    max-width:59px !important;
    max-height:59px !important;
  }


  .shared-brand{
    min-width:59px !important;
  }

}

/* HEADER_IMAGE_BALANCE_V2_END */


/* HOME_HEADER_SEPARATE_HERO_V3_BEGIN */

/* =========================================================
   HOME HEADER / HERO SEPARATION V3

   HEADER = 독립된 상단 메뉴 영역
   HERO   = HEADER 아래에서 시작

   따라서 메인 HERO 이미지를 HEADER가 덮지 않는다.
========================================================= */


:root{
  --gs-home-header-height:92px;
}


/* =========================================================
   HOME PAGE SPACE
========================================================= */

/*
 * fixed header 높이만큼 BODY 자체를 아래로 내린다.
 * HERO 이미지가 HEADER 뒤로 들어가지 않는다.
 */

body.gildong-home-separated{
  padding-top:
    var(--gs-home-header-height) !important;
}


/* =========================================================
   HOME HEADER FRAME
========================================================= */

body.gildong-home-separated
.shared-home-header{
  position:fixed !important;

  top:0 !important;
  left:0 !important;
  right:0 !important;

  width:100% !important;
  height:
    var(--gs-home-header-height) !important;

  z-index:10000 !important;

  overflow:visible !important;

  isolation:isolate;

  background:
    linear-gradient(
      135deg,
      rgba(31,39,29,.98) 0%,
      rgba(48,48,32,.97) 48%,
      rgba(62,54,36,.96) 100%
    ) !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.10) !important;

  box-shadow:
    0 3px 18px
    rgba(18,24,18,.10) !important;

  -webkit-backdrop-filter:
    blur(10px)
    saturate(112%);

  backdrop-filter:
    blur(10px)
    saturate(112%);

  transition:
    background .25s ease,
    box-shadow .25s ease,
    border-color .25s ease !important;
}


/*
 * 예전에 HERO 위로 내려오던
 * 긴 gradient pseudo layer를 완전히 제거.
 */

body.gildong-home-separated
.shared-home-header::before{
  content:"" !important;

  display:block !important;

  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  z-index:0 !important;

  pointer-events:none !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.035) 0%,
      rgba(255,255,255,.00) 48%,
      rgba(0,0,0,.055) 100%
    ) !important;

  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;
}


body.gildong-home-separated
.shared-home-header::after{
  content:"" !important;

  position:absolute !important;

  left:0 !important;
  right:0 !important;
  bottom:0 !important;

  height:1px !important;

  z-index:1 !important;

  background:
    rgba(255,255,255,.11) !important;

  pointer-events:none !important;
}


/* =========================================================
   HEADER INNER
========================================================= */

body.gildong-home-separated
.shared-home-header
.shared-header-inner{
  position:relative !important;

  z-index:3 !important;

  height:100% !important;

  overflow:visible !important;
}


/* =========================================================
   MAIN LOGO
========================================================= */

/*
 * 왼쪽 메인 로고는 메뉴보다 확실하게 크지만
 * HEADER 밖으로 튀어나오지 않게 정리.
 */

body.gildong-home-separated
.shared-home-header
.shared-brand{
  height:100% !important;

  display:flex !important;

  align-items:center !important;

  justify-content:flex-start !important;

  overflow:visible !important;
}


body.gildong-home-separated
.shared-home-header
.shared-main-logo{
  width:82px !important;
  height:82px !important;

  max-width:82px !important;
  max-height:82px !important;

  margin:0 !important;

  object-fit:contain !important;

  opacity:1 !important;

  transform:none !important;

  filter:
    drop-shadow(
      0 3px 5px
      rgba(0,0,0,.28)
    )
    drop-shadow(
      0 7px 12px
      rgba(0,0,0,.13)
    ) !important;
}


/* =========================================================
   IMAGE NAV
========================================================= */

body.gildong-home-separated
.shared-home-header
.shared-nav{
  height:100% !important;

  display:flex !important;

  align-items:center !important;

  justify-content:center !important;

  gap:14px !important;

  overflow:visible !important;
}


body.gildong-home-separated
.shared-home-header
.shared-nav-link{
  position:relative !important;

  width:69px !important;
  height:76px !important;

  flex:
    0 0 69px !important;

  padding:0 !important;
  margin:0 !important;

  display:flex !important;

  align-items:center !important;

  justify-content:center !important;

  overflow:visible !important;

  background:
    transparent !important;

  text-decoration:
    none !important;
}


body.gildong-home-separated
.shared-home-header
.shared-nav-image{
  display:block !important;

  width:61px !important;
  height:61px !important;

  max-width:61px !important;
  max-height:61px !important;

  margin:0 !important;

  object-fit:
    contain !important;

  object-position:
    center center !important;

  opacity:.97 !important;

  transform:
    translateY(0)
    scale(1) !important;

  transform-origin:
    center center !important;

  filter:
    drop-shadow(
      0 2px 5px
      rgba(0,0,0,.26)
    ) !important;

  transition:
    transform .18s ease,
    filter .18s ease,
    opacity .18s ease !important;
}


/* HOVER */

body.gildong-home-separated
.shared-home-header
.shared-nav-link:hover
.shared-nav-image{
  opacity:1 !important;

  transform:
    translateY(-2px)
    scale(1.035) !important;

  filter:
    drop-shadow(
      0 4px 8px
      rgba(0,0,0,.31)
    ) !important;
}


/* ACTIVE */

body.gildong-home-separated
.shared-home-header
.shared-nav-link.active
.shared-nav-image{
  opacity:1 !important;

  transform:
    translateY(-2px)
    scale(1.045) !important;

  filter:
    drop-shadow(
      0 4px 9px
      rgba(0,0,0,.34)
    ) !important;
}


body.gildong-home-separated
.shared-home-header
.shared-nav-link.active::before{
  content:"" !important;

  position:absolute !important;

  left:50% !important;
  bottom:1px !important;

  width:27px !important;
  height:2px !important;

  border-radius:999px !important;

  background:
    rgba(255,255,255,.96) !important;

  transform:
    translateX(-50%) !important;

  box-shadow:
    0 2px 5px
    rgba(0,0,0,.18) !important;
}


/* =========================================================
   USER AREA
========================================================= */

body.gildong-home-separated
.shared-home-header
.shared-auth{
  height:100% !important;

  display:flex !important;

  align-items:center !important;

  justify-content:flex-end !important;
}


body.gildong-home-separated
.shared-home-header
.shared-user{
  color:#fff !important;
}


body.gildong-home-separated
.shared-home-header
.shared-user-avatar{
  width:35px !important;
  height:35px !important;

  flex:
    0 0 35px !important;

  border:
    1px solid
    rgba(255,255,255,.78) !important;

  box-shadow:
    0 3px 9px
    rgba(0,0,0,.25) !important;
}


body.gildong-home-separated
.shared-home-header
.shared-user-text strong{
  color:#fff !important;

  text-shadow:
    0 1px 2px
    rgba(0,0,0,.35) !important;
}


body.gildong-home-separated
.shared-home-header
.shared-user-text small{
  color:
    rgba(255,255,255,.70) !important;
}


body.gildong-home-separated
.shared-home-header
.shared-logout-button{
  color:
    rgba(255,255,255,.82) !important;

  text-shadow:
    0 1px 2px
    rgba(0,0,0,.30) !important;
}


body.gildong-home-separated
.shared-home-header
.shared-login-button{
  color:#fff !important;

  border:
    1px solid
    rgba(255,255,255,.34) !important;

  background:
    rgba(255,255,255,.07) !important;

  -webkit-backdrop-filter:
    blur(5px);

  backdrop-filter:
    blur(5px);
}


/* =========================================================
   SCROLLED
========================================================= */

/*
 * HERO가 HEADER 아래에서 시작하므로
 * 스크롤 후에도 header만 변화한다.
 */

body.gildong-home-separated
.shared-home-header.is-scrolled{
  background:
    linear-gradient(
      135deg,
      rgba(26,34,27,.97) 0%,
      rgba(42,43,30,.97) 52%,
      rgba(54,48,33,.97) 100%
    ) !important;

  border-bottom-color:
    rgba(255,255,255,.13) !important;

  box-shadow:
    0 8px 24px
    rgba(16,23,18,.18) !important;

  -webkit-backdrop-filter:
    blur(15px)
    saturate(118%);

  backdrop-filter:
    blur(15px)
    saturate(118%);
}


/* =========================================================
   HERO
========================================================= */

/*
 * 혹시 기존 HERO CSS에 음수 margin/top 등이 있어도
 * HEADER 영역으로 다시 올라오지 않게 한다.
 */

body.gildong-home-separated
.cinematic-hero,
body.gildong-home-separated
.home-cinematic-hero,
body.gildong-home-separated
.home-hero{
  margin-top:0 !important;

  top:auto !important;

  position:relative !important;

  z-index:1 !important;
}


/*
 * HEADER 때문에 HERO 자체에 추가했던
 * 상단 blur/gradient가 있다면 사용하지 않음.
 */

body.gildong-home-separated
.cinematic-hero::before,
body.gildong-home-separated
.home-cinematic-hero::before{
  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:900px){

  :root{
    --gs-home-header-height:70px;
  }


  body.gildong-home-separated
  .shared-home-header{
    height:
      var(--gs-home-header-height) !important;
  }


  body.gildong-home-separated
  .shared-home-header
  .shared-main-logo{
    width:63px !important;
    height:63px !important;

    max-width:63px !important;
    max-height:63px !important;
  }


  body.gildong-home-separated
  .shared-home-header
  .shared-nav{
    top:
      var(--gs-home-header-height) !important;
  }


  /*
   * 모바일 펼침 메뉴는
   * 독립된 흰색 영역.
   */

  body.gildong-home-separated
  .shared-home-header.menu-open{
    background:
      rgba(255,255,255,.985) !important;

    border-bottom:
      1px solid
      rgba(55,78,62,.10) !important;

    box-shadow:
      0 9px 24px
      rgba(25,40,30,.10) !important;
  }


  body.gildong-home-separated
  .shared-home-header.menu-open
  .shared-nav{
    background:
      rgba(255,255,255,.99) !important;
  }


  body.gildong-home-separated
  .shared-home-header.menu-open
  .shared-nav-link{
    width:100% !important;

    height:65px !important;

    flex:
      none !important;

    justify-content:flex-start !important;

    padding:
      4px 13px !important;
  }


  body.gildong-home-separated
  .shared-home-header.menu-open
  .shared-nav-image{
    width:52px !important;
    height:52px !important;

    max-width:52px !important;
    max-height:52px !important;

    flex:
      0 0 52px !important;

    transform:none !important;
  }


  body.gildong-home-separated
  .shared-home-header.menu-open
  .shared-nav-link.active::before{
    left:4px !important;
    top:50% !important;
    bottom:auto !important;

    width:3px !important;
    height:30px !important;

    background:
      #476950 !important;

    transform:
      translateY(-50%) !important;
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:600px){

  :root{
    --gs-home-header-height:66px;
  }


  body.gildong-home-separated
  .shared-home-header
  .shared-main-logo{
    width:58px !important;
    height:58px !important;

    max-width:58px !important;
    max-height:58px !important;
  }

}

/* HOME_HEADER_SEPARATE_HERO_V3_END */


/* HEADER_NO_FLASH_GRADIENT_V24_BEGIN */

/* =========================================================
   COMMON IMAGE HEADER V24

   1. 모든 페이지 같은 그라데이션 배경
   2. 기존 텍스트 헤더가 순간적으로 보이는 FOUC 제거
   3. 메뉴 이미지가 전부 준비된 뒤 한 번에 표시
========================================================= */


/* ---------------------------------------------------------
   PLACEHOLDER HEADER
   shared-header JS 실행 전에도 배경부터 즉시 표시
--------------------------------------------------------- */

header.site-header{
  min-height:92px !important;

  background:
    linear-gradient(
      110deg,
      #222b23 0%,
      #343527 38%,
      #3d3927 68%,
      #282e25 100%
    ) !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.09) !important;

  box-shadow:
    0 4px 16px
    rgba(20,26,21,.08) !important;
}


/*
 * 원래 HTML에 들어있는
 * GS / HOME / MEMBERS 텍스트 헤더는
 * JS가 실제 이미지 헤더로 교체할 때까지 숨긴다.
 */

html:not(.gs-shared-header-mounted)
header.site-header > *{
  visibility:hidden !important;
}


/* ---------------------------------------------------------
   COMMON HEADER
--------------------------------------------------------- */

.shared-site-header,
.shared-sub-header{
  background:
    linear-gradient(
      110deg,
      rgba(31,40,32,.985) 0%,
      rgba(49,50,37,.985) 38%,
      rgba(61,55,36,.98) 68%,
      rgba(37,44,35,.985) 100%
    ) !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.10) !important;

  box-shadow:
    0 5px 18px
    rgba(17,23,18,.10) !important;

  -webkit-backdrop-filter:
    blur(12px)
    saturate(112%);

  backdrop-filter:
    blur(12px)
    saturate(112%);
}


/*
 * 아주 약한 상하 명암.
 * 단색 바처럼 보이지 않도록 한다.
 */

.shared-site-header::after{
  content:"";

  position:absolute;

  inset:0;

  pointer-events:none;

  z-index:0;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.045) 0%,
      rgba(255,255,255,.008) 46%,
      rgba(0,0,0,.075) 100%
    );
}


.shared-site-header
.shared-header-inner{
  position:relative !important;

  z-index:3 !important;
}


/* ---------------------------------------------------------
   NO FLASH
--------------------------------------------------------- */

/*
 * 헤더 배경은 즉시 보인다.
 * 실제 로고/버튼/프로필 영역만 이미지 준비 전 숨긴다.
 */

.shared-site-header
.shared-header-inner{
  opacity:0;

  visibility:hidden;

  transition:
    opacity .10s ease;
}


/*
 * 공통헤더가 mount되고
 * 이미지 preload까지 끝났을 때만 한 번에 표시.
 */

html.gs-shared-header-mounted
.gs-header-assets-ready
.shared-site-header
.shared-header-inner{
  opacity:1;

  visibility:visible;
}


/*
 * 위 selector에서 html 두 클래스를 동시에 처리하기 위한
 * 실제 적용 selector.
 */

html.gs-shared-header-mounted.gs-header-assets-ready
.shared-site-header
.shared-header-inner{
  opacity:1 !important;

  visibility:visible !important;
}


/* ---------------------------------------------------------
   SUB PAGE COLORS
--------------------------------------------------------- */

.shared-sub-header
.shared-nav-fallback{
  color:#fff !important;

  text-shadow:
    0 1px 3px
    rgba(0,0,0,.38) !important;
}


.shared-sub-header
.shared-user{
  color:#fff !important;
}


.shared-sub-header
.shared-user-text strong{
  color:#fff !important;

  text-shadow:
    0 1px 2px
    rgba(0,0,0,.32);
}


.shared-sub-header
.shared-user-text small{
  color:
    rgba(255,255,255,.68) !important;
}


.shared-sub-header
.shared-logout-button{
  color:
    rgba(255,255,255,.82) !important;
}


.shared-sub-header
.shared-login-button{
  color:#fff !important;

  border:
    1px solid
    rgba(255,255,255,.33) !important;

  background:
    rgba(255,255,255,.07) !important;

  text-shadow:
    0 1px 2px
    rgba(0,0,0,.25);

  -webkit-backdrop-filter:
    blur(6px);

  backdrop-filter:
    blur(6px);
}


.shared-sub-header
.shared-login-button:hover{
  border-color:
    rgba(255,255,255,.58) !important;

  background:
    rgba(255,255,255,.12) !important;
}


.shared-sub-header
.shared-user-avatar{
  border:
    1px solid
    rgba(255,255,255,.70) !important;

  box-shadow:
    0 2px 8px
    rgba(0,0,0,.22);
}


/* ---------------------------------------------------------
   IMAGE NAV
--------------------------------------------------------- */

.shared-sub-header
.shared-nav-image,
.shared-home-header
.shared-nav-image{
  opacity:1 !important;

  filter:
    drop-shadow(
      0 3px 6px
      rgba(0,0,0,.24)
    ) !important;
}


.shared-sub-header
.shared-nav-link:hover
.shared-nav-image,
.shared-home-header
.shared-nav-link:hover
.shared-nav-image{
  filter:
    drop-shadow(
      0 5px 10px
      rgba(0,0,0,.29)
    ) !important;
}


/* ACTIVE */

.shared-sub-header
.shared-nav-link.active::before,
.shared-home-header
.shared-nav-link.active::before{
  background:
    rgba(255,255,255,.95) !important;
}


/* ---------------------------------------------------------
   MAIN LOGO
--------------------------------------------------------- */

.shared-sub-header
.shared-main-logo,
.shared-home-header
.shared-main-logo{
  opacity:1 !important;

  filter:
    drop-shadow(
      0 4px 8px
      rgba(0,0,0,.25)
    ) !important;
}


/* ---------------------------------------------------------
   HOME
   메인페이지도 같은 헤더 그라데이션 유지
   HERO는 헤더 아래에서 시작하므로 서로 겹치지 않는다.
--------------------------------------------------------- */

body.gildong-home-separated
.shared-home-header,
body.gildong-home-separated
.shared-home-header:not(.is-scrolled),
body.gildong-home-separated
.shared-home-header.is-scrolled{
  background:
    linear-gradient(
      110deg,
      rgba(31,40,32,.985) 0%,
      rgba(49,50,37,.985) 38%,
      rgba(61,55,36,.98) 68%,
      rgba(37,44,35,.985) 100%
    ) !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.10) !important;

  box-shadow:
    0 5px 18px
    rgba(17,23,18,.10) !important;

  -webkit-backdrop-filter:
    blur(12px)
    saturate(112%) !important;

  backdrop-filter:
    blur(12px)
    saturate(112%) !important;
}


/*
 * 메인 헤더 pseudo element가
 * HERO 이미지 쪽으로 내려오는 현상 방지.
 */

body.gildong-home-separated
.shared-home-header::before{
  content:"" !important;

  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  z-index:0 !important;

  pointer-events:none !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.035) 0%,
      rgba(255,255,255,0) 52%,
      rgba(0,0,0,.06) 100%
    ) !important;

  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media(max-width:900px){

  header.site-header{
    min-height:70px !important;
  }


  .shared-sub-header,
  .shared-home-header{
    background:
      linear-gradient(
        110deg,
        rgba(31,40,32,.99) 0%,
        rgba(49,50,37,.99) 55%,
        rgba(37,44,35,.99) 100%
      ) !important;
  }


  /*
   * 펼침 메뉴는 기존대로 밝은 메뉴판.
   */

  .shared-site-header.menu-open
  .shared-nav{
    background:
      rgba(255,255,255,.985) !important;
  }

}


@media(max-width:600px){

  header.site-header{
    min-height:66px !important;
  }

}

/* HEADER_NO_FLASH_GRADIENT_V24_END */





/* HEADER_LIGHT_GRADIENT_V30_BEGIN */

/* =========================================================
   HEADER LIGHTER GRADIENT V30
   기존보다 실제 체감 밝기를 약 50% 완화
========================================================= */

.shared-site-header,
.shared-sub-header,
.shared-home-header,
body.gildong-home-separated .shared-home-header,
body.gildong-home-separated .shared-home-header:not(.is-scrolled),
body.gildong-home-separated .shared-home-header.is-scrolled{

  background:
    linear-gradient(
      105deg,
      rgba(57,72,57,.88) 0%,
      rgba(72,78,55,.86) 31%,
      rgba(91,80,49,.84) 68%,
      rgba(57,70,55,.88) 100%
    ) !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.15) !important;

  box-shadow:
    0 5px 18px
    rgba(24,32,25,.10) !important;

  -webkit-backdrop-filter:
    blur(12px)
    saturate(112%);

  backdrop-filter:
    blur(12px)
    saturate(112%);
}


/*
 * 예전 어두운 pseudo overlay 제거
 */

.shared-site-header::before,
.shared-site-header::after,
.shared-sub-header::before,
.shared-sub-header::after,
body.gildong-home-separated
.shared-home-header::before,
body.gildong-home-separated
.shared-home-header::after{

  background:none !important;

  box-shadow:none !important;

  -webkit-backdrop-filter:none !important;

  backdrop-filter:none !important;
}


/*
 * 대신 헤더 안쪽 자체에 아주 약한 광택만.
 */

.shared-header-inner::before{

  content:"";

  position:absolute;

  left:0;
  right:0;
  top:0;

  height:42%;

  pointer-events:none;

  z-index:-1;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,0)
    );
}


/*
 * 로고/메뉴 선명도
 */

.shared-main-logo,
.shared-nav-image{

  filter:
    drop-shadow(
      0 3px 6px
      rgba(0,0,0,.18)
    ) !important;
}


/* HEADER_LIGHT_GRADIENT_V30_END */





/* HEADER_GREEN_GLASS_V32_BEGIN */

/* =========================================================
   GILDONGSEKKI HEADER GREEN OPAQUE GLASS V32
   - 단순 투명도 감소 아님
   - 그린 계열 불투명 유리 느낌
   - 메인/서브 공통 적용
========================================================= */

/* 헤더 본체 */
.shared-site-header,
.shared-home-header,
.shared-sub-header,
.site-header,
.site-header.cinematic-header,
.site-header.subsite-header,
header.site-header{

  position: relative !important;
  z-index: 300 !important;
  isolation: isolate !important;

  background-color: rgba(45, 56, 44, 0.84) !important;

  background-image:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.08) 0%,
      rgba(255,255,255,0.035) 16%,
      rgba(255,255,255,0.00) 42%
    ),
    linear-gradient(
      90deg,
      rgba(31,41,32,0.93) 0%,
      rgba(46,58,44,0.89) 18%,
      rgba(66,72,49,0.84) 50%,
      rgba(46,58,44,0.89) 82%,
      rgba(31,41,32,0.93) 100%
    ) !important;

  border-bottom: 1px solid rgba(255,255,255,0.10) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(255,255,255,0.04),
    0 10px 28px rgba(17, 27, 20, 0.16) !important;

  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
}


/* 유리 결 / 흐린 느낌 */
.shared-site-header::before,
.shared-home-header::before,
.shared-sub-header::before,
.site-header::before{

  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      120deg,
      rgba(255,255,255,0.08) 0%,
      rgba(255,255,255,0.03) 24%,
      rgba(255,255,255,0.00) 46%,
      rgba(255,255,255,0.04) 72%,
      rgba(255,255,255,0.00) 100%
    ) !important;

  opacity: 0.72 !important;
}


/* 안쪽에 아주 부드러운 비네팅 */
.shared-site-header::after,
.shared-home-header::after,
.shared-sub-header::after,
.site-header::after{

  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;

  background:
    radial-gradient(
      circle at 50% -30%,
      rgba(255,255,255,0.10) 0%,
      rgba(255,255,255,0.03) 26%,
      rgba(255,255,255,0.00) 55%
    ),
    radial-gradient(
      circle at 50% 120%,
      rgba(0,0,0,0.10) 0%,
      rgba(0,0,0,0.00) 42%
    ) !important;

  opacity: 0.75 !important;
}


/* 실제 내용은 위로 */
.shared-header-inner,
.shared-header-row,
.shared-header-brand,
.shared-header-nav,
.shared-header-actions,
.site-header > *,
.site-header .nav,
.site-header .login-button{

  position: relative !important;
  z-index: 2 !important;
}


/* 메뉴 이미지 / 로고는 선명하게 */
.shared-main-logo,
.shared-nav-image{

  position: relative !important;
  z-index: 3 !important;
  transform: translateZ(0);

  filter:
    drop-shadow(0 4px 10px rgba(19, 28, 20, 0.20))
    drop-shadow(0 1px 0 rgba(255,255,255,0.08)) !important;
}


/* hover 시 너무 튀지 않게 살짝만 */
.shared-nav-link:hover .shared-nav-image,
.shared-nav-link.active .shared-nav-image{

  filter:
    drop-shadow(0 6px 14px rgba(19, 28, 20, 0.24))
    drop-shadow(0 1px 0 rgba(255,255,255,0.10)) !important;
}


/* 로그인 버튼도 헤더와 맞춤 */
.login-button,
.shared-login-button,
.site-header .login-button,
.site-header a.login-button{

  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
  color: #f7f4ea !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 4px 14px rgba(15,22,17,0.10) !important;

  -webkit-backdrop-filter: blur(10px) !important;
  backdrop-filter: blur(10px) !important;
}


/* 메인 hero 위에 올릴 때 과하게 어두워지지 않도록 */
body.gildong-home-separated .shared-home-header,
body.gildong-home-separated .site-header.cinematic-header{

  background-color: rgba(45, 56, 44, 0.80) !important;

  background-image:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.08) 0%,
      rgba(255,255,255,0.03) 18%,
      rgba(255,255,255,0.00) 44%
    ),
    linear-gradient(
      90deg,
      rgba(31,41,32,0.90) 0%,
      rgba(47,58,45,0.86) 18%,
      rgba(68,74,50,0.81) 50%,
      rgba(47,58,45,0.86) 82%,
      rgba(31,41,32,0.90) 100%
    ) !important;
}


/* 헤더 아래쪽 경계선 */
.shared-site-header,
.shared-home-header,
.shared-sub-header,
.site-header{

  overflow: hidden !important;
}


/* 캐시나 로딩 중에도 갑자기 하얗게 보이는 느낌 방지 */
html body .shared-site-header,
html body .shared-home-header,
html body .shared-sub-header,
html body .site-header{

  min-height: 88px !important;
}


/* HEADER_GREEN_GLASS_V32_END */


/* GILDONG_USER_DROPDOWN_STYLE_V2 */

.shared-user-menu{
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
}

button.shared-user{
  appearance:none;
  -webkit-appearance:none;

  border:0;
  outline:0;
  font:inherit;

  cursor:pointer;

  text-align:left;

  background:transparent;
}

.shared-user-arrow{
  margin-left:7px;

  font-size:14px;
  line-height:1;

  color:rgba(52,70,48,.58);

  transition:
    transform .18s ease;
}

.shared-user-menu.open
.shared-user-arrow{
  transform:
    rotate(180deg);
}

.shared-user-dropdown[hidden]{
  display:none !important;
}

.shared-user-dropdown{
  position:absolute;

  z-index:9999;

  top:calc(100% + 12px);
  right:0;

  width:220px;

  padding:8px;

  border:
    1px solid
    rgba(49,70,45,.13);

  border-radius:16px;

  background:
    rgba(255,255,255,.98);

  box-shadow:
    0 18px 48px
    rgba(37,52,34,.18);

  backdrop-filter:
    blur(12px);
}

.shared-user-dropdown::before{
  content:"";

  position:absolute;

  top:-6px;
  right:27px;

  width:12px;
  height:12px;

  border-left:
    1px solid
    rgba(49,70,45,.10);

  border-top:
    1px solid
    rgba(49,70,45,.10);

  background:#fff;

  transform:
    rotate(45deg);
}

.shared-user-dropdown-item{
  position:relative;

  width:100%;

  display:flex;
  flex-direction:column;
  align-items:flex-start;

  box-sizing:border-box;

  padding:
    11px
    12px;

  border:0;
  border-radius:11px;

  text-decoration:none;

  background:transparent;

  cursor:pointer;

  color:#30452d;

  font-family:inherit;

  transition:
    background .15s ease;
}

.shared-user-dropdown-item:hover{
  background:#f2f6ee;
}

.shared-user-dropdown-item strong{
  font-size:13px;
  font-weight:800;

  color:#2b4128;
}

.shared-user-dropdown-item small{
  margin-top:3px;

  font-size:10px;

  color:#899484;
}

.shared-user-dropdown-divider{
  height:1px;

  margin:6px 8px;

  background:
    rgba(54,76,50,.10);
}

.shared-user-dropdown-logout strong{
  color:#79514e;
}

.shared-user-dropdown-logout:hover{
  background:#faf2f1;
}

/* /GILDONG_USER_DROPDOWN_STYLE_V2 */




/* =========================================================
   SUBPAGE PROFILE DROPDOWN PORTAL FIX V1
   2026-09-29

   헤더는 원래처럼 clipping.
   사용자 dropdown만 popover(top layer)로 표시.
========================================================= */

/*
 * 원래 헤더 동작 복구.
 * overflow:visible 때문에 보이기 시작한
 * 헤더 내부 장식/요소를 다시 잘라낸다.
 */
body:not(.gildong-home-separated)
.shared-site-header,

body:not(.gildong-home-separated)
header.site-header,

body:not(.gildong-home-separated)
.site-header.subsite-header{
  overflow:hidden !important;
}


/*
 * Popover로 열린 사용자 메뉴는 브라우저 Top Layer에서
 * 렌더링되므로 header overflow:hidden의 영향을 받지 않는다.
 */
.shared-user-dropdown[popover]{
  position:fixed !important;

  top:
    var(--gs-user-dropdown-top,72px) !important;

  left:
    var(--gs-user-dropdown-left,auto) !important;

  right:auto !important;
  bottom:auto !important;

  margin:0 !important;

  transform:none !important;

  z-index:2147483000 !important;
}


/* 기존 hidden 상태는 그대로 유지 */
.shared-user-dropdown[popover][hidden]{
  display:none !important;
}


/*
 * UA popover 기본 여백/중앙정렬 방지
 */
.shared-user-dropdown[popover]:popover-open{
  margin:0 !important;
}

/* /SUBPAGE PROFILE DROPDOWN PORTAL FIX V1 */


/* =========================================================
   HOME HEADER CLIP FIX V1
   서브페이지와 동일하게 홈 헤더 내부 장식 clipping
========================================================= */

body.gildong-home-separated
.shared-site-header:not(.menu-open),

body.gildong-home-separated
.shared-home-header:not(.menu-open),

body.gildong-home-separated
header.site-header:not(.menu-open),

body.gildong-home-separated
.site-header.cinematic-header:not(.menu-open){

  overflow:hidden !important;
}

/* /HOME HEADER CLIP FIX V1 */


/* =========================================================
   HEADER FIRST PAINT V1
   2026-09-29

   목적:
   - JS mount 전 헤더 전체가 사라지는 현상 제거
   - assets-ready까지 기다리는 fade 제거
   - 본문만 먼저 보이는 화면 방지
========================================================= */


/*
 * 예전 규칙:
 * html:not(.gs-shared-header-mounted)
 * header.site-header > *
 *
 * 에 의해 초기 헤더 내용 전체가 숨겨졌었다.
 *
 * 초기 HTML 헤더는 JS가 교체되기 전까지
 * 정상적으로 표시한다.
 */
html:not(.gs-shared-header-mounted)
header.site-header > *{

  opacity:1 !important;

  visibility:visible !important;

  transform:none !important;
}


/*
 * shared-header가 생성된 순간부터 즉시 표시.
 * 이미지 전체 로딩을 기다렸다가 fade-in하지 않는다.
 */
html.gs-shared-header-mounted
.shared-site-header
.shared-header-inner,

html.gs-shared-header-mounted.gs-header-assets-ready
.shared-site-header
.shared-header-inner{

  opacity:1 !important;

  visibility:visible !important;

  transform:none !important;

  transition:none !important;
}


/*
 * 로고와 메뉴 이미지를 별도로 fade 하지 않는다.
 * 실제 이미지는 HEAD에서 preload된다.
 */
.shared-main-logo,
.shared-nav-image{

  opacity:1 !important;

  visibility:visible !important;

  transform:none !important;

  transition:none !important;
}


/*
 * 메뉴 링크 자체도 asset ready 상태를 기다리지 않는다.
 */
.shared-nav-link{

  opacity:1 !important;

  visibility:visible !important;
}


/*
 * 레이아웃 자리를 처음부터 확보해
 * 이미지 로드 시 메뉴가 좌우로 움직이지 않게 한다.
 */
.shared-main-logo,
.shared-nav-image{

  display:block;
}


/* /HEADER FIRST PAINT V1 */








/* =========================================================
   HEADER AUTH READY V1
   로그인 상태 확인 전에 SOOP LOGIN이 깜빡이는 현상 방지
========================================================= */

.shared-auth:not(.gs-auth-ready) > *{
  visibility:hidden !important;
  pointer-events:none !important;
}


/*
 * auth root 자체 공간은 유지하므로
 * 헤더 메뉴가 좌우로 튀는 현상은 최소화한다.
 */
.shared-auth{
  min-height:42px;
}

/* /HEADER AUTH READY V1 */