/* 공통 상단 바. 각 사이트의 CSS와 부딪히지 않도록 gx- 접두사만 쓴다. 움직임 효과는 두지 않는다. */
@font-face{font-family:GxPretendard;src:url(/assets/PretendardVariable.woff2);font-weight:100 900;font-display:swap}
.gx-shell,.gx-shell *{box-sizing:border-box;margin:0;padding:0;font-family:GxPretendard,Pretendard,-apple-system,sans-serif;letter-spacing:normal;text-transform:none}
.gx-shell{position:relative;z-index:1000;background:#fff}
.gx-bar{display:flex;align-items:center;gap:32px;padding:16px 4vw;border-bottom:1px solid #e6e3eb;background:#fff}
.gx-logo{display:flex;flex-direction:column;align-items:flex-start;gap:6px;color:#24212c;text-decoration:none;flex-shrink:0}
.gx-logo img.gx-wordmark{width:188px;height:auto;object-fit:contain;display:block}
.gx-logo small{display:block;font-size:11px;font-weight:500;letter-spacing:2px;padding-left:44px;color:#534aa5;line-height:1}
.gx-nav{display:flex;align-items:center;gap:26px;font-size:14px;line-height:1.4}
.gx-nav a{color:#24212c;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap}
.gx-nav a:hover,.gx-nav a[aria-current=page]{color:#534aa5;border-bottom-color:#534aa5}
.gx-nav a:focus-visible,.gx-logo:focus-visible,.gx-auth a:focus-visible{outline:3px solid #9880ff;outline-offset:4px}
.gx-auth{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:14px;min-height:36px}
.gx-lang{margin-left:auto;color:#534aa5;text-decoration:none;border:1px solid #e6e3eb;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700;line-height:1}
.gx-lang:hover{border-color:#534aa5}
.gx-lang+.gx-auth{margin-left:0}
.gx-auth a{color:#24212c;text-decoration:none;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.gx-auth .gx-login{border:1px solid #534aa5;color:#534aa5;border-radius:8px;padding:7px 14px;font-weight:600}
.gx-auth .gx-login:hover{background:#534aa5;color:#fff}
.gx-auth .gx-user{border:1px solid #e6e3eb;border-radius:999px;padding:4px 12px 4px 4px}
.gx-auth .gx-user:hover{border-color:#534aa5}
.gx-auth .gx-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;background:#efedf8;color:#534aa5;display:inline-grid;place-items:center;font-weight:700;font-size:13px}
.gx-auth .gx-user b{font-weight:600;max-width:120px;overflow:hidden;text-overflow:ellipsis}
.gx-sub{display:inline-block;font-size:13px;font-weight:700;color:#534aa5;letter-spacing:.5px;white-space:nowrap}
@media(max-width:900px){
  .gx-bar{flex-wrap:wrap;gap:10px 18px;padding:12px 16px}
  .gx-logo img.gx-wordmark{width:160px}
  .gx-logo small{padding-left:37px}
  .gx-lang{margin-left:auto}.gx-auth{margin-left:0}
  .gx-nav{width:100%;order:3;overflow-x:auto;gap:20px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
}

/* 각 사이트의 원래 헤더는 그 섹션의 보조 메뉴로 쓴다 */
html[data-gx=academy] body>header .logo{display:none}
html[data-gx=academy] body>header{padding-top:12px;padding-bottom:12px;justify-content:flex-start;gap:30px}
html[data-gx=diary] .site-header .brand-lockup{display:none}
html[data-gx=diary] .site-header{height:62px}
html[data-gx=diary] .site-header .gx-sub{margin-right:28px}