baron_qa_write/SW문의_소스패키지/_include/header.html

<style>
  header .header_login {
    position: relative;
    display: none;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
  }

  html[data-baron-page-mode="landing"] header .header_login,
  html[data-baron-page-mode="public-info"] header .header_login,
  html[data-baron-auth-state="authenticated"] header .header_login {
    display: inline-flex;
  }

  header .header_login_trigger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    cursor: pointer;
    transition: filter 0.2s ease;
  }

  header .header_login:hover .header_login_trigger,
  header .header_login:focus-within .header_login_trigger {
    filter: brightness(1.12);
  }

  header .header_login_trigger img {
    width: 28px;
    height: 28px;
    filter: brightness(0);
  }

  html[data-baron-page-mode="landing"] header .header_login_trigger img {
    filter: none;
  }

  html[data-baron-page-mode="landing"] header:hover .header_login_trigger img {
    filter: brightness(0);
  }

  header .header_login_menu {
    position: absolute;
    top: 100%;
    left: 50%;
    padding-top: 12px;
    transform: translateX(-50%) translateY(4px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 20;
  }

  header .header_login:hover .header_login_menu,
  header .header_login:focus-within .header_login_menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  /* 클릭(터치) 시 열림, Esc로 닫은 뒤에는 포인터/포커스가 벗어날 때까지 닫힘 유지 (header-login.js) */
  header .header_login.is-open .header_login_menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  header .header_login.is-dismissed .header_login_menu {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-50%) translateY(4px);
  }

  header .header_login_menu::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ffffff;
  }

  header .header_login_link {
    display: block;
    white-space: nowrap;
    background: #ffffff;
    color: #111111;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 22px;
    border: 2px solid transparent;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    text-align: center;
    box-sizing: border-box;
    transition: background-color 0.15s ease, border-color 0.15s ease;
  }

  header .header_login_link:hover {
    background: #ffcc00;
    border-color: #ffffff;
  }

  @media (max-width: 768px) {
    header .header_login {
      margin-right: 6px;
    }
    header .header_login_trigger {
      width: 32px;
      height: 32px;
    }
  }
</style>

<!-- CORP -->
<div class="header_inner corp">
  <div class="logo_box">
    <!-- a = 홈페이지 로고 -->
    <!-- a의 이미지는은 style.css에서 제어하세요 -->
    <a class="logo" href="/ko/index.html">(주) 바론컨설턴트</a>
  </div>

  <!-- 오픈메뉴 경우 -->
  <nav class="nav"></nav>

  <!-- 버튼형 경우 -->
    <div class="header_R">
        <a class="header_qa header_qa_button" href="/ko/inquiry.html" aria-label="소프트웨어 문의">
          <svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="10" /><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3M12 17h.01" /></svg>
          <span>S/W문의</span>
        </a>
        <div class="language">
            <a href="#" class="on">KR</a>
            <a href="/en/index.html">EN</a>
        </div>

        <div class="header_login">
          <button type="button" class="header_login_trigger" aria-label="로그인" aria-expanded="false" aria-controls="header-login-menu">
            <img src="/assets/img/ico_user.svg" alt="" />
          </button>
          <div class="header_login_menu" id="header-login-menu">
            <a class="header_login_link" href="../ko/br_future.html">로그인</a>
          </div>
        </div>

        <button class="btn_menu" data-value="sitemap">
            <div></div>
            <div></div>
            <div></div>
        </button>
  </div>

</div>

<div class="popup_wrap sitemap">
  <div class="popup_contents_wrap" data-lenis-prevent-wheel>
    <div class="popup_header">
      <div class="logo_box">
        <a class="logo" href="/ko/index.html">(주) 바론컨설턴트</a>
      </div>
      <button class="btn_close"><i class="close"></i></button>
    </div>

    <nav class="nav"></nav>
  </div>
</div>