@import 'HypsvcCom.Host.Portal.Client.yb47a75btl.bundle.scp.css';
@import '_content/HypsvcCom.Kit.Research.Ui/HypsvcCom.Kit.Research.Ui.w18xv8nsh2.bundle.scp.css';
@import '_content/HypsvcCom.Platform.Client/HypsvcCom.Platform.Client.gnfhvtngqu.bundle.scp.css';
@import '_content/HypsvcCom.Svc.AgentForPanda.Server/HypsvcCom.Svc.AgentForPanda.Server.squ0tllm2g.bundle.scp.css';
@import '_content/HypsvcCom.Svc.AgentForPanda.Ui/HypsvcCom.Svc.AgentForPanda.Ui.2fxt0610ew.bundle.scp.css';
@import '_content/HypsvcCom.Svc.AiAgent.Ui/HypsvcCom.Svc.AiAgent.Ui.ulnvl9lr2l.bundle.scp.css';
@import '_content/HypsvcCom.Svc.Ideal16.Server/HypsvcCom.Svc.Ideal16.Server.u5v6co29k2.bundle.scp.css';
@import '_content/HypsvcCom.Svc.Ideal16.Ui/HypsvcCom.Svc.Ideal16.Ui.52la8wwdov.bundle.scp.css';
@import '_content/HypsvcCom.Svc.LoveMoney.Server/HypsvcCom.Svc.LoveMoney.Server.9cgkbfnt25.bundle.scp.css';
@import '_content/HypsvcCom.Svc.LoveMoney.Ui/HypsvcCom.Svc.LoveMoney.Ui.zjsn9zp4ft.bundle.scp.css';
@import '_content/HypsvcCom.Svc.PvsNp.Server/HypsvcCom.Svc.PvsNp.Server.tlf6kgnibj.bundle.scp.css';
@import '_content/HypsvcCom.Svc.PvsNp.Ui/HypsvcCom.Svc.PvsNp.Ui.ry7dus5d6s.bundle.scp.css';

/* /Components/Account/Shared/ExternalProviderButton.razor.rz.scp.css */
/* ExternalProviderButton — 외부 로그인 공급자 버튼의 단일 정본(네이버 로그인 검수 요건: 공식 버튼 BI 미사용 시 반려).
   정적 SSR 페이지(Account/Login·Account/Register·Account/Manage/ExternalLogins)에서 렌더되므로 JS 없이 CSS 만으로 동작한다.
   - 네이버: 배경 #03C75A + 흰색 N 로고(인라인 SVG) + 굵은 흰 글씨 "네이버 로그인" (네이버 로그인 버튼 BI 가이드)
   - Google: 라이트 테마 — 흰 배경·1px #747775 테두리·모서리 4px + 4색 G 로고(인라인 SVG) + #1F1F1F 글씨 "Google 계정으로 로그인",
     hover #F2F2F2 (Google Identity 브랜딩 가이드)
   - 카카오: 배경 #FEE500 + 검정 말풍선 심볼(인라인 SVG) + 검정 85%(rgba(0,0,0,.85)) 글씨 "카카오 로그인", 테두리 없음,
     hover #F2D900 (카카오 로그인 버튼 디자인 가이드)
   세 버튼은 같은 높이(44px)·같은 글씨 크기(15px)·최소 폭 230px. 버튼 사이 간격(12px)과 480px 이하 세로 쌓임은
   ExternalProviderButtonGroup.razor.css 가 맡고, 여기서는 480px 이하에서 버튼 폭만 100% 로 늘린다(중복 규칙 금지). */

.ext-login-btn[b-konybwyfcv] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    height: 44px;
    min-width: 230px;
    margin: 0;
    padding: 0 16px 0 12px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 15px;
    line-height: 1;
    letter-spacing: 0.25px;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color .15s ease, border-color .15s ease;
}

.ext-login-btn:focus-visible[b-konybwyfcv] {
    outline: 2px solid #1A73E8;
    outline-offset: 2px;
}

.ext-login-icon[b-konybwyfcv] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-right: 12px;
}

.ext-login-label[b-konybwyfcv] {
    flex: 1 1 auto;
    text-align: center;
}

/* 네이버 로그인 */
.ext-login-btn--naver[b-konybwyfcv] {
    background-color: #03C75A;
    border-color: #03C75A;
    color: #FFFFFF;
    font-weight: 700;
}

.ext-login-btn--naver:hover[b-konybwyfcv] {
    background-color: #02B351;
    border-color: #02B351;
}

.ext-login-btn--naver:active[b-konybwyfcv] {
    background-color: #029F48;
    border-color: #029F48;
}

.ext-login-btn--naver .ext-login-icon[b-konybwyfcv] {
    width: 16px;
    height: 16px;
    margin-left: 2px;
    margin-right: 14px;
}

/* Google 계정으로 로그인 (라이트 테마) */
.ext-login-btn--google[b-konybwyfcv] {
    background-color: #FFFFFF;
    border-color: #747775;
    color: #1F1F1F;
    font-family: Roboto, "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    font-weight: 500;
}

.ext-login-btn--google:hover[b-konybwyfcv] {
    background-color: #F2F2F2;
}

.ext-login-btn--google:active[b-konybwyfcv] {
    background-color: #E6E6E6;
}

/* 카카오 로그인 (카카오 로그인 버튼 디자인 가이드 — 컨테이너 #FEE500, 심볼·라벨 검정, 라벨 85% 불투명) */
.ext-login-btn--kakao[b-konybwyfcv] {
    background-color: #FEE500;
    border-color: #FEE500;
    color: rgba(0, 0, 0, .85);
    font-weight: 600;
}

.ext-login-btn--kakao:hover[b-konybwyfcv] {
    background-color: #F2D900;
    border-color: #F2D900;
}

.ext-login-btn--kakao:active[b-konybwyfcv] {
    background-color: #E6CE00;
    border-color: #E6CE00;
}

.ext-login-btn--kakao .ext-login-icon[b-konybwyfcv] {
    width: 18px;
    height: 18px;
    margin-left: 1px;
    margin-right: 13px;
}

@media (max-width: 480px) {
    .ext-login-btn[b-konybwyfcv] {
        width: 100%;
        min-width: 0;
    }
}
/* /Components/Account/Shared/ExternalProviderButtonGroup.razor.rz.scp.css */
/* ExternalProviderButtonGroup — ExternalProviderButton 묶음 컨테이너.
   버튼을 12px 간격으로 가로 정렬하고 폭 480px 이하에서는 세로로 쌓는다(버튼 폭 100% 는 ExternalProviderButton.razor.css 가 맡는다).
   버튼 자체 스타일은 ExternalProviderButton.razor.css 에만 둔다(중복 규칙 금지). */

.ext-login-buttons[b-iwbj1jd45v] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0.5rem 0 1rem;
}

@media (max-width: 480px) {
    .ext-login-buttons[b-iwbj1jd45v] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-f5p0efxos5] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-f5p0efxos5] {
    flex: 1;
    /* .page(가로 flex)의 아이템이므로 기본 min-width:auto 면 '내용의 최소폭'이 main 을 밀어
       뷰포트보다 넓어진다(사이드바 250px + main 최소폭). 그러면 상단 배너가 화면 밖으로 나가고
       문서에 가로 스크롤이 생긴다 — 좁은 PC 폭(641~900px)에서 실제로 발생. */
    min-width: 0;
}

.sidebar[b-f5p0efxos5] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

/* 상단 배너(헤더 체계 A안 '한 띠') — 사이드바 로고 블록과 같은 높이라 두 하단선이 한 y 에서 만나고,
   그 이음매를 금색 선(border-bottom)으로 마감한다.
   ★ 높이는 app.css :root 의 --topband-h(= --sidebar-header-h) 한 곳에서만 정의한다. 숫자를 직접 쓰지 말 것.
   position 은 배경 궤도 장식(.hs-orbit)의 기준이며, ≥641px 에서 sticky 로 덮인다(둘 다 positioned). */
.top-row[b-f5p0efxos5] {
    position: relative;
    background: linear-gradient(100deg, #070B1F 0%, #111A4C 54%, #141B4D 100%);
    border-bottom: 2px solid #FFD54A;
    height: var(--topband-h);
    display: flex;
    align-items: center;
    overflow: hidden;
}

    /* 상단 링크 전용 — 배너 안의 다른 앵커(브랜드 이름 토큰)에는 걸리지 않게 .nav-container 로 한정한다 */
    .top-row[b-f5p0efxos5]  .nav-container a, .top-row[b-f5p0efxos5]  .nav-container .btn-link {
        white-space: nowrap;
        text-decoration: none;
    }

@media (max-width: 640.98px) {
    /* 폰 폭의 사이드바는 화면이 아니라 문서 맨 위(.page)에 붙는다 — 그 안의 메뉴 단추(NavMenu.razor.css 폰 블록의
       .hamburger-icon, position:absolute)가 상단 띠 왼쪽 여백(MainLayout.razor 폰 블록 .top-row 의 padding-left 55px) 안에서
       띠와 함께 스크롤되어, 내린 화면의 본문 첫 글자를 가리지 않는다. 오버레이·메뉴 패널은 각자 position:fixed 라
       이 값과 무관하게 화면을 덮는다. MainLayout.razor 안 <style> 의 폰 블록 .sidebar 와 같은 값이어야 한다(2026-10-06). */
    .sidebar[b-f5p0efxos5] {
        position: absolute;
        top: 0;
        left: 0;
        width: auto;
        height: auto;
        /* 모바일 사이드바(햄버거·슬라이드 메뉴)도 PC 와 같은 사이트 크롬이다 — app.css :root 의
           --z-sidebar 를 그대로 쓴다. 이 안의 햄버거/오버레이/메뉴 패널은 .sidebar 가 만드는
           쌓임 맥락 안에서만 겨루므로 작은 수(1·2·3)면 충분하다(NavMenu/AdminMenu.razor.css). */
        z-index: var(--z-sidebar);
        background: transparent;
    }
}

@media (min-width: 641px) {
    .page[b-f5p0efxos5] {
        flex-direction: row;
    }

    /* 사이드바·상단 배너는 사이트 크롬이라 본문보다 항상 위에 그려진다.
       z-index 수치는 app.css :root 의 층 체계(--z-sidebar / --z-topband)가 정본이다 — 여기에
       숫자를 직접 쓰지 말 것. sticky 는 그 자체로 쌓임 맥락을 만들지만 z-index:auto 로 두면
       본문의 양수 z-index 요소(히어로 오버레이·배지 등)에 밀려 덮인다. */
    .sidebar[b-f5p0efxos5] {
        width: 250px;
        min-width: 250px;
        flex-shrink: 0;
        height: 100vh;
        position: sticky;
        top: 0;
        z-index: var(--z-sidebar);
    }

    /* Admin 영역(AdminMenu)은 메뉴명이 길어 50px 더 넓게 사용 */
    .sidebar.sidebar-admin[b-f5p0efxos5] {
        width: 300px;
        min-width: 300px;
    }

    .top-row[b-f5p0efxos5] {
        position: sticky;
        top: 0;
        z-index: var(--z-topband);
    }

    .top-row.auth[b-f5p0efxos5]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-f5p0efxos5], article[b-f5p0efxos5] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }


}

#blazor-error-ui[b-f5p0efxos5] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    /* 전역 오류 표시는 모달·다이얼로그 위에서도 보여야 한다 — app.css :root 의 최상단 층. */
    z-index: var(--z-popup-top);
}

    #blazor-error-ui .dismiss[b-f5p0efxos5] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* PC용 로고 컨테이너 */
.nav-logo-container[b-44z5n6237j] {
    display: block;
}

/* 햄버거 아이콘 - 기본 숨김 (PC) */
.hamburger-icon[b-44z5n6237j] {
    display: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    position: fixed;
    top: 8px;
    left: 8px;
    padding: 8px;
    /* 아래 세 값은 .sidebar 가 만든 쌓임 맥락 '안'의 순서일 뿐이다(바깥과 겨루지 않는다).
       바깥과 겨루는 값은 .sidebar 자신의 z-index(= app.css 의 --z-sidebar) 하나뿐. */
    z-index: 3;   /* 햄버거 버튼 — 오버레이(1)·메뉴 패널(2) 위 */
    background-color: darkslateblue;
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hamburger-icon span[b-44z5n6237j] {
    display: block;
    width: 22px;
    height: 3px;
    background-color: white;
    margin: 3px 0;
    border-radius: 2px;
    transition: all 0.3s ease;
}

/* 메뉴 오버레이 - 기본 숨김 */
.menu-overlay[b-44z5n6237j] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;   /* .sidebar 내부 순서 — 위 .hamburger-icon 주석 참조 */
}

/* 오버레이 표시 상태 */
.menu-overlay.overlay-visible[b-44z5n6237j] {
    display: block;
}

.navbar-toggler[b-44z5n6237j] {
    display: none !important;
}

.navbar-brand[b-44z5n6237j] {
    font-size: 1.1rem;
}

.bi[b-44z5n6237j] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.bi-lock-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.bi-search-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
}

.bi-pencil-square-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z'/%3E%3Cpath fill-rule='evenodd' d='M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z'/%3E%3C/svg%3E");
}

.bi-credit-card-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm2-1a1 1 0 0 0-1 1v1h14V4a1 1 0 0 0-1-1H2zm13 4H1v5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V7z'/%3E%3Cpath d='M2 10a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-1z'/%3E%3C/svg%3E");
}

.bi-chat-dots-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M5 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3Cpath d='m2.165 15.803.02-.004c1.83-.363 2.948-.842 3.468-1.105A9.06 9.06 0 0 0 8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6a10.437 10.437 0 0 1-.524 2.318l-.003.011a10.722 10.722 0 0 1-.244.637c-.079.186.074.394.273.362a21.673 21.673 0 0 0 .693-.125zm.8-3.108a1 1 0 0 0-.287-.801C1.618 10.83 1 9.468 1 8c0-3.192 3.004-6 7-6s7 2.808 7 6c0 3.193-3.004 6-7 6a8.06 8.06 0 0 1-2.088-.272 1 1 0 0 0-.711.074c-.387.196-1.24.57-2.634.893a10.97 10.97 0 0 0 .398-2z'/%3E%3C/svg%3E");
}

.bi-bag-check-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M10.854 8.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L7.5 10.793l2.646-2.647a.5.5 0 0 1 .708 0z'/%3E%3Cpath d='M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1zm3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4h-3.5zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5z'/%3E%3C/svg%3E");
}

.bi-briefcase-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v8A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-8A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1h-3zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5zm1.886 6.914L15 7.151V12.5a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5V7.15l6.614 1.764a1.5 1.5 0 0 0 .772 0zM1.5 4h13a.5.5 0 0 1 .5.5v1.616l-6.614 1.764a1.5 1.5 0 0 1-.772 0L1 6.116V4.5a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}

.bi-piggy-bank-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-piggy-bank' viewBox='0 0 16 16'%3E%3Cpath d='M5 6.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0zm1.138-1.496A6.613 6.613 0 0 1 7.964 4.5c.666 0 1.303.097 1.893.273a.5.5 0 0 0 .286-.958A7.602 7.602 0 0 0 7.964 3.5c-.734 0-1.441.103-2.102.292a.5.5 0 1 0 .276.962z'/%3E%3Cpath fill-rule='evenodd' d='M7.964 1.735c-3.155 0-5.75 2.115-5.75 4.782 0 .943.324 1.822.884 2.564-.083.303-.226.616-.377.879a4.31 4.31 0 0 1-.554.75c-.174.19-.28.372-.28.62 0 .35.264.66.62.66.34 0 .707-.055 1.056-.145.35-.09.71-.222 1.02-.377.257-.128.494-.276.686-.436.68.243 1.421.397 2.195.44v.94c0 .275.223.498.498.498h1.995a.498.498 0 0 0 .498-.498v-.94a7.85 7.85 0 0 0 1.34-.216l.775.775a.498.498 0 0 0 .705 0l1.41-1.41a.498.498 0 0 0 0-.705l-.554-.554c.49-.652.797-1.415.867-2.235h.752a.498.498 0 0 0 .498-.498V5.64a.498.498 0 0 0-.498-.498h-.984c-.42-.987-1.19-1.834-2.194-2.437a.5.5 0 1 0-.514.858c.976.586 1.652 1.422 1.943 2.345a.5.5 0 0 0 .476.35h.775v.996h-.735a.5.5 0 0 0-.498.46 3.87 3.87 0 0 1-.85 2.14.5.5 0 0 0 .036.665l.46.46-.705.705-.66-.66a.5.5 0 0 0-.53-.114 6.85 6.85 0 0 1-1.626.29.5.5 0 0 0-.466.498v.865h-.999v-.865a.5.5 0 0 0-.466-.498 6.85 6.85 0 0 1-2.32-.527.5.5 0 0 0-.542.11c-.13.13-.34.278-.605.41-.26.13-.564.243-.86.319-.09.023-.178.043-.262.06.1-.13.204-.28.303-.45.2-.345.396-.78.475-1.216a.5.5 0 0 0-.125-.44 3.36 3.36 0 0 1-.813-2.166c0-2.023 2.05-3.782 4.75-3.782z'/%3E%3C/svg%3E");
}

.bi-trophy-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-trophy' viewBox='0 0 16 16'%3E%3Cpath d='M2.5.5A.5.5 0 0 1 3 0h10a.5.5 0 0 1 .5.5c0 .538-.012 1.05-.034 1.536a3 3 0 1 1-1.133 5.89c-.79 1.865-1.878 2.777-2.833 3.011v2.173l1.425.356c.194.048.377.135.537.255L13.3 15.1a.5.5 0 0 1-.3.9H3a.5.5 0 0 1-.3-.9l1.838-1.379c.16-.12.343-.207.537-.255L6.5 13.11v-2.173c-.955-.234-2.043-1.146-2.833-3.012a3 3 0 1 1-1.132-5.89A33.076 33.076 0 0 1 2.5.5zm.099 2.54a2 2 0 0 0 .72 3.935c-.333-1.05-.588-2.346-.72-3.935zm10.083 3.935a2 2 0 0 0 .72-3.935c-.133 1.59-.388 2.885-.72 3.935zM3.504 1c.007.517.026 1.006.056 1.469.13 2.028.457 3.546.87 4.667C5.294 9.48 6.484 10 7 10a.5.5 0 0 1 .5.5v2.61a1 1 0 0 1-.757.97l-1.426.356a.5.5 0 0 0-.179.085L4.5 15h7l-.638-.479a.501.501 0 0 0-.18-.085l-1.425-.356a1 1 0 0 1-.757-.97V10.5A.5.5 0 0 1 9 10c.516 0 1.706-.52 2.57-2.864.413-1.12.74-2.64.87-4.667.03-.463.049-.952.056-1.469H3.504z'/%3E%3C/svg%3E");
}

/* 나의 서비스 —bootstrap-icons 'grid' */
.bi-grid-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.5A1.5 1.5 0 0 1 2.5 1h3A1.5 1.5 0 0 1 7 2.5v3A1.5 1.5 0 0 1 5.5 7h-3A1.5 1.5 0 0 1 1 5.5v-3zM2.5 2a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3zm6.5.5A1.5 1.5 0 0 1 10.5 1h3A1.5 1.5 0 0 1 15 2.5v3A1.5 1.5 0 0 1 13.5 7h-3A1.5 1.5 0 0 1 9 5.5v-3zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3zM1 10.5A1.5 1.5 0 0 1 2.5 9h3A1.5 1.5 0 0 1 7 10.5v3A1.5 1.5 0 0 1 5.5 15h-3A1.5 1.5 0 0 1 1 13.5v-3zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3zm6.5.5A1.5 1.5 0 0 1 10.5 9h3a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1-1.5 1.5h-3A1.5 1.5 0 0 1 9 13.5v-3zm1.5-.5a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3z'/%3E%3C/svg%3E");
}

.bi-box-seam-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5l2.404.961L10.404 2l-2.218-.887zm3.564 1.426L5.596 5 8 5.961 14.154 3.5l-2.404-.961zm3.25 1.7-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923l6.5 2.6zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0l-7.185-2.874A1 1 0 0 1 0 12.162V3.5a.5.5 0 0 1 .314-.464L7.443.184z'/%3E%3C/svg%3E");
}

.bi-info-circle-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/%3E%3C/svg%3E");
}

.bi-signpost-split-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7 7V1.414a1 1 0 0 1 2 0V2h5a1 1 0 0 1 .8.4l.975 1.3a.5.5 0 0 1 0 .6L14.8 5.6a1 1 0 0 1-.8.4H9v10H7v-5H2a1 1 0 0 1-.8-.4L.225 9.3a.5.5 0 0 1 0-.6L1.2 7.4A1 1 0 0 1 2 7h5zm1 3V8H2l-.75 1L2 10h6zm0-5h6l.75-1L14 3H8v2z'/%3E%3C/svg%3E");
}

.bi-person-plus-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0zm4 8c0 1-1 1-1 1H1s-1 0-1-1 1-4 6-4 6 3 6 4zm-1-.004c-.001-.246-.154-.986-.832-1.664C9.516 10.68 8.289 10 6 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10z'/%3E%3Cpath fill-rule='evenodd' d='M13.5 5a.5.5 0 0 1 .5.5V7h1.5a.5.5 0 0 1 0 1H14v1.5a.5.5 0 0 1-1 0V8h-1.5a.5.5 0 0 1 0-1H13V5.5a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}

.bi-stars-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7.657 6.247c.11-.33.576-.33.686 0l.645 1.937a2.89 2.89 0 0 0 1.829 1.828l1.936.645c.33.11.33.576 0 .686l-1.937.645a2.89 2.89 0 0 0-1.828 1.829l-.645 1.936a.361.361 0 0 1-.686 0l-.645-1.937a2.89 2.89 0 0 0-1.828-1.828l-1.937-.645a.361.361 0 0 1 0-.686l1.937-.645a2.89 2.89 0 0 0 1.828-1.828l.645-1.937zM3.794 1.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387A1.734 1.734 0 0 0 4.593 5.69l-.387 1.162a.217.217 0 0 1-.412 0L3.407 5.69A1.734 1.734 0 0 0 2.31 4.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387A1.734 1.734 0 0 0 3.407 2.31l.387-1.162zM10.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.732L9.1 2.137a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732L10.863.1z'/%3E%3C/svg%3E");
}

.bi-robot-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5ZM3 8.062C3 6.76 4.235 5.765 5.53 5.886a26.58 26.58 0 0 0 4.94 0C11.765 5.765 13 6.76 13 8.062v1.157a.933.933 0 0 1-.765.935c-.845.147-2.34.346-4.235.346-1.895 0-3.39-.2-4.235-.346A.933.933 0 0 1 3 9.219V8.062Zm4.542-.827a.25.25 0 0 0-.217.068l-.92.9a24.767 24.767 0 0 1-1.871-.183.25.25 0 0 0-.068.495c.642.088 1.366.16 2.183.183a.25.25 0 0 0 .183-.068l.92-.9a23.95 23.95 0 0 1 3.949 0l.92.9a.25.25 0 0 0 .183.068c.817-.022 1.541-.095 2.183-.183a.25.25 0 0 0-.068-.495c-.55.075-1.18.14-1.87.183l-.92-.9a.25.25 0 0 0-.217-.068 24.413 24.413 0 0 0-4.39 0ZM5 10a1 1 0 1 1 0 2 1 1 0 0 1 0-2Zm6 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z'/%3E%3Cpath d='M7.5 1.018a7 7 0 0 0-4.79 11.566L.435 14.71a.25.25 0 0 0 .353.353L3.064 12.5a7 7 0 0 0 9.872 0l2.276 2.276a.25.25 0 0 0 .353-.353l-2.276-2.276A7 7 0 0 0 8.5 1.018V0h-1v1.018ZM8 2a6 6 0 1 1 0 12A6 6 0 0 1 8 2Z'/%3E%3C/svg%3E");
}

/* 파트너십 안내 — Bootstrap Icons 'people' */
.bi-people-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8Zm-7.978-1A.261.261 0 0 1 7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002a.274.274 0 0 1-.014.002H7.022ZM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM6.936 9.28a5.88 5.88 0 0 0-1.23-.247A7.35 7.35 0 0 0 5 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816ZM4.92 10A5.493 5.493 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0Zm3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z'/%3E%3C/svg%3E");
}

/* 파트너십 가입 — Bootstrap Icons 'person-check' */
.bi-person-check-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 16a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm1.679-4.493-1.335 2.226a.75.75 0 0 1-1.174.144l-.774-.773a.5.5 0 0 1 .708-.708l.547.548 1.17-1.951a.5.5 0 1 1 .858.514ZM11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM8 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z'/%3E%3Cpath d='M8.256 14a4.474 4.474 0 0 1-.229-1.004H3c.001-.246.154-.986.832-1.664C4.484 10.68 5.711 10 8 10c.26 0 .507.009.74.025.226-.341.496-.65.804-.918C9.077 9.038 8.564 9 8 9c-5 0-6 3-6 4s1 1 1 1h5.256Z'/%3E%3C/svg%3E");
}

/* 파트너십 관리 — Bootstrap Icons 'graph-up-arrow' */
.bi-graph-up-arrow-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M0 0h1v15h15v1H0V0Zm10 3.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V4.9l-3.613 4.417a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61L13.445 4H10.5a.5.5 0 0 1-.5-.5Z'/%3E%3C/svg%3E");
}

.bi-journal-text-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z'/%3E%3Cpath d='M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z'/%3E%3Cpath d='M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z'/%3E%3C/svg%3E");
}

.bi-gear-fill-nav-menu[b-44z5n6237j] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.279-.7-2.686.705-1.987 1.987l.17.31c.446.816.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.7 1.279.705 2.686 1.987 1.987l.31-.17a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.279.7 2.686-.705 1.987-1.987l-.17-.31a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.7-1.279-.705-2.686-1.987-1.987l-.31.17a1.464 1.464 0 0 1-2.105-.872l-.1-.34zM8 10.93a2.93 2.93 0 1 1 0-5.86 2.93 2.93 0 0 1 0 5.86z'/%3E%3C/svg%3E");
}

.nav-item[b-44z5n6237j] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-44z5n6237j] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-44z5n6237j] {
        padding-bottom: 1rem;
    }

    .nav-item[b-44z5n6237j]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-44z5n6237j]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-44z5n6237j]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-44z5n6237j] {
    display: none;
}

/* PC 레이아웃 (641px 이상) */
@media (min-width: 641px) {
    .hamburger-icon[b-44z5n6237j] {
        display: none !important;
    }

    .menu-overlay[b-44z5n6237j] {
        display: none !important;
    }

    .nav-logo-container[b-44z5n6237j] {
        display: block;
    }

    /* 메뉴 스크롤 영역 바닥 = 뷰포트 바닥.
       사이드바는 로고 블록(--sidebar-header-h) + 1px(아래 margin-top) + 이 높이로 정확히 100vh 를 채운다.
       ★ 숫자를 직접 쓰지 말 것 — 로고 높이를 바꾸면 반드시 이 계산식이 따라와야 한다(app.css :root 정본).
       1px 은 NavMenu.razor 의 .nav-scrollable 인라인 margin-top 보정값이다. */
    .nav-scrollable[b-44z5n6237j] {
        display: block;
        height: calc(100vh - var(--sidebar-header-h) - 1px);
        overflow-y: auto;
    }
}

/* 모바일 레이아웃 (640px 이하) */
@media (max-width: 640px) {
    /* 로고 숨김 */
    .nav-logo-container[b-44z5n6237j] {
        display: none !important;
    }

    /* 햄버거 아이콘 표시 — 화면에 떠 있지 않고 상단 띠 왼쪽 여백(MainLayout.razor 폰 블록 .top-row 의 padding-left 55px)
       자리에 놓여 띠와 함께 스크롤된다. 기준 상자는 폰 폭에서 문서 맨 위에 붙는 .sidebar(MainLayout.razor.css 폰 블록,
       position:absolute)다. 떠 있으면 내린 화면에서 본문 왼쪽 첫 글자·입력칸을 가린다. 메뉴는 화면 맨 위에서 연다 —
       메뉴 패널(.nav-scrollable)·오버레이는 position:fixed 그대로라 열린 뒤 모양은 같다(2026-10-06). */
    .hamburger-icon[b-44z5n6237j] {
        display: flex !important;
        position: absolute;
    }

    /* 메뉴 기본 숨김 */
    .nav-scrollable[b-44z5n6237j] {
        display: none;
        position: fixed;
        top: 0;
        left: -100%;
        width: 85%;
        max-width: 300px;
        height: 100vh;
        z-index: 2;   /* .sidebar 내부 순서 — 오버레이(1) 위, 햄버거(3) 아래 */
        overflow-y: auto;
        background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
        padding-top: 60px;
        transition: left 0.3s ease;
    }

    /* 메뉴 열림 상태 */
    .nav-scrollable.menu-open[b-44z5n6237j] {
        display: block !important;
        left: 0;
    }

    /* 펼친 하위 메뉴 판 — 폰 메뉴 판(최대 300px)은 바탕 그림(HypsvcMenuBg-600x1800.webp, 300px 기준 · NavMenu.razor 의 인라인 background)이
       좌우로 잘리지 않아 오른쪽 궤도 아이콘·글자가 하위 메뉴 판 뒤로 그대로 비친다. 판 뒤만 어둡고 흐리게 눌러 메뉴 글자와 겹쳐 보이지 않게 한다.
       판 자체의 옅은 바탕·왼쪽 선은 NavMenu.razor <style> 의 .main-group-submenu 그대로다. (2026-10-06) */
    .main-group-submenu[b-44z5n6237j] {
        -webkit-backdrop-filter: blur(6px) brightness(0.45);
        backdrop-filter: blur(6px) brightness(0.45);
    }
}
/* /Components/Pages/AgentForPandaLanding.razor.rz.scp.css */
/* AgentForPandaLanding scoped CSS — 이 페이지 고유의 배치만 둔다. 히어로·구역·카드·버튼·표식의 모양은 공용 구성 요소
   (HypsvcCom.Platform.Client/Components/ServiceGuide/*.razor.css)가 갖고, 색·치수 토큰(--svc-brand* · --sg-*)은 SgPage 가 내려 준다(CSS 변수는 scoped 경계를 넘어 상속된다).
   ⚠ 공용 구성 요소의 슬롯 안에 쓴 마크업은 이 파일의 scope 를 갖지만, 구성 요소 자신의 요소(.sg-*)는 갖지 않는다 — .sg-* 를 여기서 고치지 않는다. */

/* ── 페이지 안 이동 ── */
.afpl-jump[b-rrc42lzo7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0;
}

.afpl-jump a[b-rrc42lzo7i] {
    padding: 7px 14px;
    border: 1px solid var(--sg-line);
    border-radius: 999px;
    background: var(--sg-surface);
    color: var(--sg-body);
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.afpl-jump a:hover[b-rrc42lzo7i] {
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-soft);
    color: var(--svc-brand-deep);
}

.afpl-jump a:focus-visible[b-rrc42lzo7i],
.afpl-a:focus-visible[b-rrc42lzo7i] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 2px;
    border-radius: 999px;
}

.afpl-jump .afpl-jump-guide[b-rrc42lzo7i] {
    margin-left: auto;
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-dark);
    color: #fff;
}

.afpl-jump .afpl-jump-guide:hover[b-rrc42lzo7i] {
    border-color: var(--svc-brand-deep);
    background: var(--svc-brand-deep);
    color: #fff;
}

/* ── 본문 링크(밝은 바탕) ── */
.afpl-a[b-rrc42lzo7i] {
    color: var(--svc-brand-dark);
    font-weight: 700;
    text-underline-offset: 3px;
}

.afpl-a:hover[b-rrc42lzo7i] {
    color: var(--svc-brand-deep);
}

/* ── 격자 ── */
.afpl-grid3[b-rrc42lzo7i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* 대상별 기능 — 늘 2열(1행 BJ | 시청자 — 긴 카드끼리, 2행 매니저 | 공통 — 짧은 카드끼리). 1000px 아래는 1열. */
.afpl-grid2[b-rrc42lzo7i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

/* ── 히어로 각주 안 ── */
.afpl-hero-note[b-rrc42lzo7i] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 215, 109, .6);
    background: rgba(255, 215, 109, .16);
    color: #fff3cf;
    font-weight: 700;
}

/* 가격 고지 묶음 — 버튼 바로 아래 반투명 띠(읽기 쉬운 한 덩어리로) */
.afpl-hero-price[b-rrc42lzo7i] {
    margin: 0 0 10px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    background: rgba(0, 0, 0, .16);
    line-height: 1.65;
}

.afpl-hero-price p:last-child[b-rrc42lzo7i] {
    margin-bottom: 0;
}

.afpl-hero-own[b-rrc42lzo7i] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .4);
}

/* ── 이게 뭔가요 ── */
.afpl-dbdesc[b-rrc42lzo7i] {
    white-space: pre-wrap;
}

.afpl-stage[b-rrc42lzo7i] {
    margin: 18px 0 0;
    padding: 14px 18px;
    border: 1px solid var(--svc-brand-line);
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: var(--svc-brand-soft);
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--sg-ink);
}

/* ── 대상별 기능 범례 ── */
.afpl-legend[b-rrc42lzo7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 22px;
    font-size: 13.5px;
}

.afpl-legend > span[b-rrc42lzo7i] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.afpl-dot[b-rrc42lzo7i] {
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.afpl-dot-ready[b-rrc42lzo7i] {
    background: var(--svc-brand-dark);
}

.afpl-dot-upcoming[b-rrc42lzo7i] {
    border: 2px dotted #93a3a8;
}

/* ── 화면 미리보기 ── */
.afpl-preview[b-rrc42lzo7i] {
    align-items: start;
    color: var(--sg-body);
}

/* ── 작은 안내 글 ── */
.afpl-fine[b-rrc42lzo7i] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

/* ── 요금 요약 ── */
.afpl-prenotice[b-rrc42lzo7i] {
    display: grid;
    gap: 6px;
    margin: 0 0 22px;
    padding: 14px 18px 14px 34px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14px;
    line-height: 1.7;
    color: var(--sg-body);
}

.afpl-prenotice:empty[b-rrc42lzo7i] {
    display: none;
}

.afpl-prenotice b[b-rrc42lzo7i] {
    color: var(--sg-ink);
}

.afpl-prenotice-more[b-rrc42lzo7i] {
    margin-left: .3em;
}

.afpl-plans[b-rrc42lzo7i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 20px 18px;
    align-items: stretch;
    padding-top: 12px;   /* 「이용 중」 배지가 카드 위로 12px 올라온다 */
}

.afpl-plans-cta[b-rrc42lzo7i] {
    margin-top: 26px;
    text-align: center;
}

.afpl-plans-cta .afpl-fine[b-rrc42lzo7i] {
    max-width: 46em;
    margin-left: auto;
    margin-right: auto;
}

.afpl-empty[b-rrc42lzo7i] {
    margin: 0;
    padding: 18px;
    border: 1px dashed #c3cfd3;
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    color: var(--sg-muted);
}

@media (max-width: 1000px) {
    .afpl-grid2[b-rrc42lzo7i] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .afpl-jump[b-rrc42lzo7i] {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-top: 14px;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .afpl-jump .afpl-jump-guide[b-rrc42lzo7i] {
        margin-left: 0;
    }

    .afpl-grid2[b-rrc42lzo7i],
    .afpl-grid3[b-rrc42lzo7i] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .afpl-plans[b-rrc42lzo7i] {
        grid-template-columns: minmax(0, 1fr);
    }

    .afpl-prenotice[b-rrc42lzo7i] {
        padding: 12px 14px 12px 30px;
        font-size: 13.5px;
    }
}

/* ── 히어로 맨 아래 홍보 띠(선착순 평생 할인 + 연 구독 할인 — SgHero Bottom 슬롯) ── 색은 흰색·금색 강조만(서비스 색 값은 적지 않는다) */
.afpl-promo[b-rrc42lzo7i] {
    padding: 22px 24px;
    border: 1px solid rgba(255, 215, 109, .55);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(0, 0, 0, .28), rgba(0, 0, 0, .12));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
}

.afpl-promo-head[b-rrc42lzo7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
}

.afpl-promo-flag[b-rrc42lzo7i] {
    padding: 5px 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ffd76d, #ffb48a);
    color: #3b2400;
    font-size: 13.5px;
    font-weight: 800;
    white-space: nowrap;
}

.afpl-promo-title[b-rrc42lzo7i] {
    margin: 0;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -.02em;
    color: #fff;
}

.afpl-promo-pct[b-rrc42lzo7i] {
    color: #ffd76d;
}

.afpl-promo-plus[b-rrc42lzo7i] {
    margin: 0 4px;
    color: rgba(255, 255, 255, .7);
}

.afpl-promo-prices[b-rrc42lzo7i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.afpl-promo-price[b-rrc42lzo7i] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .22);
}

.afpl-promo-plan[b-rrc42lzo7i] {
    font-size: 14px;
    font-weight: 700;
    color: rgba(255, 255, 255, .92);
}

.afpl-promo-soon[b-rrc42lzo7i] {
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .45);
    font-size: 11.5px;
    font-weight: 700;
}

.afpl-promo-line[b-rrc42lzo7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 8px;
}

.afpl-promo-from[b-rrc42lzo7i] {
    font-size: 14px;
    color: rgba(255, 255, 255, .78);
}

/* 「(연 132,000원)」 — 같은 요금제 연 구독 패스 정가. 오른쪽 To 금액(.afpl-promo-to b)과 같은 크기, 다른 색(하늘색)으로 견주게 한다. */
.afpl-promo-from-year[b-rrc42lzo7i] {
    color: rgba(255, 255, 255, .85);
}

.afpl-promo-from-year b[b-rrc42lzo7i] {
    font-size: 26px;
    font-weight: 800;
    color: #8fe3ff;
}

.afpl-promo-arrow[b-rrc42lzo7i] {
    color: #ffd76d;
    font-weight: 800;
}

.afpl-promo-to[b-rrc42lzo7i] {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
}

.afpl-promo-to b[b-rrc42lzo7i] {
    font-size: 26px;
    font-weight: 800;
    color: #ffd76d;
}

.afpl-promo-calc[b-rrc42lzo7i] {
    font-size: 12.5px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .8);
}

.afpl-promo-fine[b-rrc42lzo7i] {
    margin: 14px 0 0;
    font-size: 12px;
    line-height: 1.55;
    color: rgba(255, 255, 255, .75);
}

@media (max-width: 640px) {
    .afpl-promo[b-rrc42lzo7i] {
        padding: 18px 16px;
    }

    /* 폰 폭에서 깃발 문구는 한 줄로 두면 띠 폭을 넘어 오른쪽이 잘리므로(390px 에서 실측) 낱말 사이에서 줄을 바꿔 다 보이게 한다.
       keep-all = 한글 낱말 안에서 끊지 않음, 강조 숫자(<b> — 모수·「N명 남음」)는 한 덩어리. 두 줄이면 알약 모서리가 어색해 둥근 사각으로.
       PC 폭은 위 .afpl-promo-flag 의 한 줄(nowrap) 그대로. 시험 AgentForPandaLandingStructureTests.폰_폭에서_판촉_깃발은_줄을_바꿔_띠를_넘지_않는다 가 지킨다. (2026-10-05) */
    .afpl-promo-flag[b-rrc42lzo7i] {
        max-width: 100%;
        white-space: normal;
        word-break: keep-all;
        border-radius: 12px;
    }

    .afpl-promo-flag b[b-rrc42lzo7i] {
        white-space: nowrap;
    }

    .afpl-promo-title[b-rrc42lzo7i] {
        font-size: 22px;
    }

    .afpl-promo-to b[b-rrc42lzo7i],
    .afpl-promo-from-year b[b-rrc42lzo7i] {
        font-size: 22px;
    }

    .afpl-pe-card[b-rrc42lzo7i] {
        padding: 18px 16px;
    }

    .afpl-pe-title[b-rrc42lzo7i] {
        font-size: 21px;
    }
}

/* ── 패스 이벤트(선착순 무료 사용권) — 히어로 큰 한 문장 오른편 2~3줄 · 구독 카드 위 프로모션 카드(홍보 띠와 같은 가로). 잔여 0 이면 그리지 않는다(ShowPassEvent). ── */
.afpl-pe-aside[b-rrc42lzo7i] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 16px;
    border-radius: 16px;
    border: 2px solid #ffd76d;
    background: linear-gradient(135deg, rgba(255, 215, 109, .22), rgba(255, 158, 122, .16));
    color: #fff;
    text-decoration: none;
    box-shadow: 0 10px 26px -12px rgba(255, 180, 90, .8);
    transition: transform .15s ease;
}

.afpl-pe-aside:hover[b-rrc42lzo7i] {
    transform: translateY(-1px);
}

.afpl-pe-aside-flag[b-rrc42lzo7i] {
    font-size: 13px;
    font-weight: 800;
    color: #ffd76d;
}

.afpl-pe-aside-left[b-rrc42lzo7i] {
    color: #fff;
}

.afpl-pe-aside-main[b-rrc42lzo7i] {
    font-size: 17px;
    font-weight: 800;
    line-height: 1.35;
    word-break: keep-all;
}

.afpl-pe-aside-ref[b-rrc42lzo7i] {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .82);
}

.afpl-pe-card[b-rrc42lzo7i] {
    margin: 0 0 16px;
    padding: 22px 24px;
    border-radius: 18px;
    background: linear-gradient(135deg, #ffe08a 0%, #ffb27a 100%);
    color: #3b1a00;
    box-shadow: 0 14px 30px -14px rgba(255, 158, 90, .9);
}

.afpl-pe-head[b-rrc42lzo7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
}

.afpl-pe-flag[b-rrc42lzo7i] {
    padding: 4px 12px;
    border-radius: 999px;
    background: #8a1a3d;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.afpl-pe-left[b-rrc42lzo7i] {
    font-size: 15px;
    font-weight: 900;
    color: #8a1a3d;
}

.afpl-pe-title[b-rrc42lzo7i] {
    margin: 12px 0 2px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.02em;
    word-break: keep-all;
}

.afpl-pe-ref[b-rrc42lzo7i] {
    margin: 0;
    font-size: 13.5px;
    color: #5a2d00;
}

.afpl-pe-points[b-rrc42lzo7i] {
    margin: 12px 0 14px;
    padding-left: 18px;
    font-size: 14px;
    line-height: 1.65;
}

.afpl-pe-cta[b-rrc42lzo7i] {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 999px;
    background: #8a1a3d;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
}

.afpl-pe-cta:hover[b-rrc42lzo7i] {
    background: #6d1430;
    color: #fff;
}

@media (prefers-reduced-motion: reduce) {
    .afpl-pe-aside:hover[b-rrc42lzo7i] {
        transform: none;
    }
}

/* 앱 받기로 가는 버튼 강조(히어로·마무리) — 소문 듣고 온 방문자가 바로 찾게: 두꺼운 노랑 테두리 + 빛 번짐 + 은은한 맥동(움직임 줄이기 설정이면 멈춤) */
.afpl-cta-download[b-rrc42lzo7i] { display: inline-flex; border-radius: 999px; animation: afpl-cta-pulse-b-rrc42lzo7i 2.2s ease-in-out infinite; }
.afpl-cta-download[b-rrc42lzo7i]  .sg-btn {
    border: 3px solid #FFD54F !important;
    box-shadow: 0 0 0 4px rgba(255, 213, 79, 0.35), 0 8px 22px rgba(0, 0, 0, 0.28);
    font-weight: 800;
    font-size: 1.05em;
}
.afpl-cta-download[b-rrc42lzo7i]  .sg-btn:hover { box-shadow: 0 0 0 6px rgba(255, 213, 79, 0.55), 0 10px 26px rgba(0, 0, 0, 0.32); }
@keyframes afpl-cta-pulse-b-rrc42lzo7i { 0%, 100% { filter: drop-shadow(0 0 0 rgba(255, 213, 79, 0)); } 50% { filter: drop-shadow(0 0 10px rgba(255, 213, 79, 0.75)); } }
@media (prefers-reduced-motion: reduce) { .afpl-cta-download[b-rrc42lzo7i] { animation: none; } }
/* /Components/Pages/AiAgentLanding.razor.rz.scp.css */
/* AiAgentLanding scoped CSS — 이 페이지 고유의 배치만 둔다. 히어로·구역·카드·버튼·표식의 모양은 공용 구성 요소
   (HypsvcCom.Platform.Client/Components/ServiceGuide/*.razor.css)가 갖고, 색·치수 토큰(--svc-brand* · --sg-*)은 SgPage 가 내려 준다(CSS 변수는 scoped 경계를 넘어 상속된다).
   5번 안내 홈(AgentForPandaLanding.razor.css)과 같은 규칙·같은 치수를 쓴다 — 두 안내 홈이 같은 결로 보여야 한다(2026-09-18).
   ⚠ 공용 구성 요소의 슬롯 안에 쓴 마크업은 이 파일의 scope 를 갖지만, 구성 요소 자신의 요소(.sg-*)는 갖지 않는다 — .sg-* 를 여기서 고치지 않는다. */

/* ── 페이지 안 이동 ── */
.agl-jump[b-d6ji65a13i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0;
}

.agl-jump a[b-d6ji65a13i] {
    padding: 7px 14px;
    border: 1px solid var(--sg-line);
    border-radius: 999px;
    background: var(--sg-surface);
    color: var(--sg-body);
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.agl-jump a:hover[b-d6ji65a13i] {
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-soft);
    color: var(--svc-brand-deep);
}

.agl-jump a:focus-visible[b-d6ji65a13i],
.agl-a:focus-visible[b-d6ji65a13i] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 2px;
    border-radius: 999px;
}

/* 흰 글자 단추 바탕은 단추 색(--svc-brand-btn — SgPage SolidButton 이 원색이면 원색, 아니면 진한 변형)을 쓴다(0-K722)(2026-10-16). */
.agl-jump .agl-jump-guide[b-d6ji65a13i] {
    margin-left: auto;
    border-color: var(--svc-brand-btn, var(--svc-brand-dark));
    background: var(--svc-brand-btn, var(--svc-brand-dark));
    color: #fff;
}

.agl-jump .agl-jump-guide:hover[b-d6ji65a13i] {
    border-color: var(--svc-brand-btn-hover, var(--svc-brand-deep));
    background: var(--svc-brand-btn-hover, var(--svc-brand-deep));
    color: #fff;
}

/* ── 본문 링크(밝은 바탕) ── */
.agl-a[b-d6ji65a13i] {
    color: var(--svc-brand-dark);
    font-weight: 700;
    text-underline-offset: 3px;
}

.agl-a:hover[b-d6ji65a13i] {
    color: var(--svc-brand-deep);
}

/* ── 격자 ── */
.agl-grid3[b-d6ji65a13i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* 대상별 기능 — 늘 2열(1행 운영자 | 답변 근거 — 긴 카드끼리, 2행 방문자 | 운영·확인). 1000px 아래는 1열. */
.agl-grid2[b-d6ji65a13i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

/* ── 히어로 각주 안 ── */
.agl-hero-note[b-d6ji65a13i] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 215, 109, .6);
    background: rgba(255, 215, 109, .16);
    color: #fff3cf;
    font-weight: 700;
}

/* 가격 고지 묶음 — 버튼 바로 아래 반투명 띠(읽기 쉬운 한 덩어리로) */
.agl-hero-price[b-d6ji65a13i] {
    margin: 0 0 10px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    background: rgba(0, 0, 0, .16);
    line-height: 1.65;
}

.agl-hero-price p:last-child[b-d6ji65a13i] {
    margin-bottom: 0;
}

.agl-hero-own[b-d6ji65a13i] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .4);
}

/* ── 이게 뭔가요 ── */
.agl-dbdesc[b-d6ji65a13i] {
    white-space: pre-wrap;
}

.agl-stage[b-d6ji65a13i] {
    margin: 18px 0 0;
    padding: 14px 18px;
    border: 1px solid var(--svc-brand-line);
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: var(--svc-brand-soft);
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--sg-ink);
}

/* ── 대상별 기능 범례(준비 중인 기능이 있을 때만 그린다) ── */
.agl-legend[b-d6ji65a13i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 22px;
    font-size: 13.5px;
}

.agl-legend > span[b-d6ji65a13i] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.agl-dot[b-d6ji65a13i] {
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.agl-dot-ready[b-d6ji65a13i] {
    background: var(--svc-brand-dark);
}

.agl-dot-upcoming[b-d6ji65a13i] {
    border: 2px dotted #93a3a8;
}

/* ── 화면 미리보기 ── */
.agl-preview[b-d6ji65a13i] {
    align-items: start;
    color: var(--sg-body);
}

/* ── 작은 안내 글 ── */
.agl-fine[b-d6ji65a13i] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

/* ── 요금 요약 ── */
.agl-prenotice[b-d6ji65a13i] {
    display: grid;
    gap: 6px;
    margin: 0 0 22px;
    padding: 14px 18px 14px 34px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14px;
    line-height: 1.7;
    color: var(--sg-body);
}

.agl-prenotice:empty[b-d6ji65a13i] {
    display: none;
}

.agl-prenotice b[b-d6ji65a13i] {
    color: var(--sg-ink);
}

.agl-plans[b-d6ji65a13i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 20px 18px;
    align-items: stretch;
    padding-top: 12px;   /* 「이용 중」 배지가 카드 위로 12px 올라온다 */
}

.agl-plans-cta[b-d6ji65a13i] {
    margin-top: 26px;
    text-align: center;
}

.agl-plans-cta .agl-fine[b-d6ji65a13i] {
    max-width: 46em;
    margin-left: auto;
    margin-right: auto;
}

.agl-empty[b-d6ji65a13i] {
    margin: 0;
    padding: 18px;
    border: 1px dashed #c3cfd3;
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    color: var(--sg-muted);
}

@media (max-width: 1000px) {
    .agl-grid2[b-d6ji65a13i] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .agl-jump[b-d6ji65a13i] {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-top: 14px;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .agl-jump .agl-jump-guide[b-d6ji65a13i] {
        margin-left: 0;
    }

    .agl-grid2[b-d6ji65a13i],
    .agl-grid3[b-d6ji65a13i] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .agl-plans[b-d6ji65a13i] {
        grid-template-columns: minmax(0, 1fr);
    }

    .agl-prenotice[b-d6ji65a13i] {
        padding: 12px 14px 12px 30px;
        font-size: 13.5px;
    }
}
/* /Components/Pages/Ideal16Landing.razor.rz.scp.css */
/* Ideal16Landing scoped CSS — 이 페이지 고유의 배치·모형 그림만 둔다. 히어로·구역·카드·버튼·표식의 모양은 공용 구성 요소
   (HypsvcCom.Platform.Client/Components/ServiceGuide/*.razor.css)가 갖고, 색·치수 토큰(--svc-brand* · --sg-*)은 SgPage 가 내려 준다(CSS 변수는 scoped 경계를 넘어 상속된다).
   5번 안내 홈(AgentForPandaLanding.razor.css)과 같은 치수·간격을 쓴다(서비스마다 색만 다르고 결은 같게, 2026-09-18).
   ⚠ 공용 구성 요소의 슬롯 안에 쓴 마크업은 이 파일의 scope 를 갖지만, 구성 요소 자신의 요소(.sg-*)는 갖지 않는다 — .sg-* 를 여기서 고치지 않는다. */

/* ── 페이지 안 이동 ── */
.i16l-jump[b-dp174y09zn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0;
}

.i16l-jump a[b-dp174y09zn] {
    padding: 7px 14px;
    border: 1px solid var(--sg-line);
    border-radius: 999px;
    background: var(--sg-surface);
    color: var(--sg-body);
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.i16l-jump a:hover[b-dp174y09zn] {
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-soft);
    color: var(--svc-brand-deep);
}

.i16l-jump a:focus-visible[b-dp174y09zn],
.i16l-a:focus-visible[b-dp174y09zn] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 2px;
    border-radius: 999px;
}

.i16l-jump .i16l-jump-guide[b-dp174y09zn] {
    margin-left: auto;
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-dark);
    color: #fff;
}

.i16l-jump .i16l-jump-guide:hover[b-dp174y09zn] {
    border-color: var(--svc-brand-deep);
    background: var(--svc-brand-deep);
    color: #fff;
}

/* ── 본문 링크(밝은 바탕) ── */
.i16l-a[b-dp174y09zn] {
    color: var(--svc-brand-dark);
    font-weight: 700;
    text-underline-offset: 3px;
}

.i16l-a:hover[b-dp174y09zn] {
    color: var(--svc-brand-deep);
}

/* ── 격자 ── */
.i16l-grid3[b-dp174y09zn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* 대상별 기능 — 늘 2열(1행 개인 플레이 | 공동 투표·참가 — 긴 카드끼리, 2행 투표 | 공통 — 짧은 카드끼리). 1000px 아래는 1열. */
.i16l-grid2[b-dp174y09zn] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

/* ── 히어로 시각 요소 — 대진 깔때기 ── */
.i16l-visual[b-dp174y09zn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 18px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 16px;
    background: rgba(0, 0, 0, .16);
}

.i16l-funnel[b-dp174y09zn] {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.i16l-funnel li[b-dp174y09zn] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #fff;
}

.i16l-funnel b[b-dp174y09zn] {
    flex: 0 0 auto;
    min-width: 3.2em;
    font-weight: 700;
}

.i16l-funnel-bar[b-dp174y09zn] {
    height: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .5));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5);
}

.i16l-visual-cap[b-dp174y09zn] {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .88);
}

/* ── 히어로 각주 안 ── */
.i16l-hero-note[b-dp174y09zn] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 215, 109, .6);
    background: rgba(255, 215, 109, .16);
    color: #fff3cf;
    font-weight: 700;
}

/* 가격 고지 묶음 — 버튼 바로 아래 반투명 띠(읽기 쉬운 한 덩어리로) */
.i16l-hero-price[b-dp174y09zn] {
    margin: 0 0 10px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    background: rgba(0, 0, 0, .16);
    line-height: 1.65;
}

.i16l-hero-price p:last-child[b-dp174y09zn] {
    margin-bottom: 0;
}

.i16l-hero-own[b-dp174y09zn] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .4);
}

/* ── 이게 뭔가요 ── */
.i16l-dbdesc[b-dp174y09zn] {
    white-space: pre-wrap;
}

.i16l-stage[b-dp174y09zn] {
    margin: 18px 0 0;
    padding: 14px 18px;
    border: 1px solid var(--svc-brand-line);
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: var(--svc-brand-soft);
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--sg-ink);
}

/* ── 대상별 기능 범례 ── */
.i16l-legend[b-dp174y09zn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 22px;
    font-size: 13.5px;
}

.i16l-legend > span[b-dp174y09zn] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.i16l-dot[b-dp174y09zn] {
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.i16l-dot-ready[b-dp174y09zn] {
    background: var(--svc-brand-dark);
}

.i16l-dot-upcoming[b-dp174y09zn] {
    border: 2px dotted #93a3a8;
}

/* ── 대상 카드 아래 덧붙임(심사 방식 · 유의사항) ── */
.i16l-foot-title[b-dp174y09zn] {
    margin: 0 0 6px;
    font-weight: 700;
    color: var(--sg-ink);
}

.i16l-judge[b-dp174y09zn] {
    margin: 0 0 10px;
    padding-left: 1.05rem;
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--sg-body);
}

.i16l-details summary[b-dp174y09zn] {
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--svc-brand-deep);
}

.i16l-details[open] summary[b-dp174y09zn] {
    margin-bottom: 8px;
}

.i16l-notices[b-dp174y09zn] {
    margin: 0;
    padding-left: 1.05rem;
    font-size: 13px;
    line-height: 1.75;
    color: var(--sg-muted);
}

.i16l-consent[b-dp174y09zn] {
    margin: 8px 0 0;
    padding-top: 8px;
    border-top: 1px dashed var(--sg-line);
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

/* ── 화면 미리보기 — CSS 로 그린 모형(가짜 데이터) ── */
.i16l-preview[b-dp174y09zn] {
    align-items: start;
    color: var(--sg-body);
}

.i16l-shot[b-dp174y09zn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: left;
}

.i16l-mock[b-dp174y09zn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px 14px;
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius-tile);
    background: var(--sg-surface);
    box-shadow: var(--sg-shadow-card);
}

.i16l-mock-bar[b-dp174y09zn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--sg-line);
    font-size: 12px;
    color: var(--sg-muted);
}

.i16l-mock-round[b-dp174y09zn] {
    font-weight: 700;
    color: var(--svc-brand-deep);
}

.i16l-mock-timer[b-dp174y09zn],
.i16l-mock-mine[b-dp174y09zn] {
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid var(--svc-brand-line);
    background: var(--svc-brand-soft);
    color: var(--svc-brand-deep);
    font-weight: 700;
    white-space: nowrap;
}

.i16l-mock-duel[b-dp174y09zn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.i16l-mock-cand[b-dp174y09zn] {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 6px;
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius-tile);
    background: var(--sg-surface-soft);
    font-size: 13px;
}

.i16l-mock-cand-pick[b-dp174y09zn] {
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-soft);
    box-shadow: 0 0 0 3px var(--svc-brand-glow);
}

.i16l-mock-vs[b-dp174y09zn] {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 800;
    color: var(--sg-muted);
}

.i16l-mock-face[b-dp174y09zn] {
    display: block;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--svc-brand-line), var(--svc-brand-soft));
    box-shadow: inset 0 0 0 1px var(--sg-line);
}

.i16l-mock-face-sm[b-dp174y09zn] {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}

.i16l-mock-list[b-dp174y09zn] {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.i16l-mock-list li[b-dp174y09zn] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--sg-body);
}

.i16l-mock-list b[b-dp174y09zn] {
    flex: 0 0 auto;
    min-width: 2.6em;
}

.i16l-mock-list i[b-dp174y09zn] {
    flex: 0 0 auto;
    font-style: normal;
    color: var(--sg-muted);
    white-space: nowrap;
}

.i16l-mock-fill[b-dp174y09zn] {
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--svc-brand-dark), var(--svc-brand));
}

.i16l-mock-table[b-dp174y09zn] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
    color: var(--sg-body);
}

.i16l-mock-table td[b-dp174y09zn] {
    padding: 5px 4px;
    border-bottom: 1px dashed var(--sg-line);
    white-space: nowrap;
}

.i16l-mock-table tr:last-child td[b-dp174y09zn] {
    border-bottom: none;
}

.i16l-mock-hint[b-dp174y09zn] {
    margin: 0;
    font-size: 12px;
    line-height: 1.6;
    color: var(--sg-muted);
}

.i16l-mock-cap[b-dp174y09zn] {
    margin: 0;
    font-size: 13px;
    line-height: 1.65;
    color: var(--sg-muted);
}

/* ── 시작하기 — 둘째 단계 묶음의 머리말 ── */
.i16l-subhead[b-dp174y09zn] {
    margin: 26px 0 12px;
    padding-left: 12px;
    border-left: 4px solid var(--svc-brand);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    color: var(--sg-ink);
}

/* ── 작은 안내 글 ── */
.i16l-fine[b-dp174y09zn] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

/* ── 요금 요약 ── */
.i16l-prenotice[b-dp174y09zn] {
    display: grid;
    gap: 6px;
    margin: 0 0 22px;
    padding: 14px 18px 14px 34px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14px;
    line-height: 1.7;
    color: var(--sg-body);
}

.i16l-prenotice:empty[b-dp174y09zn] {
    display: none;
}

.i16l-prenotice b[b-dp174y09zn] {
    color: var(--sg-ink);
}

.i16l-plans[b-dp174y09zn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 20px 18px;
    align-items: stretch;
    padding-top: 12px;   /* 「이용 중」 배지가 카드 위로 12px 올라온다 */
}

.i16l-plans-cta[b-dp174y09zn] {
    margin-top: 26px;
    text-align: center;
}

.i16l-plans-cta .i16l-fine[b-dp174y09zn] {
    max-width: 46em;
    margin-left: auto;
    margin-right: auto;
}

.i16l-empty[b-dp174y09zn] {
    margin: 0;
    padding: 18px;
    border: 1px dashed #c3cfd3;
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    color: var(--sg-muted);
}

@media (max-width: 1000px) {
    .i16l-grid2[b-dp174y09zn] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .i16l-jump[b-dp174y09zn] {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-top: 14px;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .i16l-jump .i16l-jump-guide[b-dp174y09zn] {
        margin-left: 0;
    }

    .i16l-grid2[b-dp174y09zn],
    .i16l-grid3[b-dp174y09zn] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .i16l-plans[b-dp174y09zn] {
        grid-template-columns: minmax(0, 1fr);
    }

    .i16l-prenotice[b-dp174y09zn] {
        padding: 12px 14px 12px 30px;
        font-size: 13.5px;
    }
}
/* /Components/Pages/LoveMoneyLanding.razor.rz.scp.css */
/* LoveMoneyLanding scoped CSS — 이 페이지 고유의 배치만 둔다. 히어로·구역·카드·버튼·표식의 모양은 공용 구성 요소
   (HypsvcCom.Platform.Client/Components/ServiceGuide/*.razor.css)가 갖고, 색·치수 토큰(--svc-brand* · --sg-*)은 SgPage 가 내려 준다(CSS 변수는 scoped 경계를 넘어 상속된다).
   5번 안내 홈(AgentForPandaLanding.razor.css)과 같은 규약·같은 값으로 맞춘다(서비스마다 디자인이 갈리지 않게, 2026-09-18).
   ⚠ 공용 구성 요소의 슬롯 안에 쓴 마크업은 이 파일의 scope 를 갖지만, 구성 요소 자신의 요소(.sg-*)는 갖지 않는다 — .sg-* 를 여기서 고치지 않는다. */

/* ── 페이지 안 이동 ── */
.lml-jump[b-3i5w5u4s6m] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0;
}

.lml-jump a[b-3i5w5u4s6m] {
    padding: 7px 14px;
    border: 1px solid var(--sg-line);
    border-radius: 999px;
    background: var(--sg-surface);
    color: var(--sg-body);
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.lml-jump a:hover[b-3i5w5u4s6m] {
    border-color: var(--svc-brand-dark);
    background: var(--svc-brand-soft);
    color: var(--svc-brand-deep);
}

.lml-jump a:focus-visible[b-3i5w5u4s6m],
.lml-a:focus-visible[b-3i5w5u4s6m] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 2px;
    border-radius: 999px;
}

.lml-jump .lml-jump-guide[b-3i5w5u4s6m] {
    margin-left: auto;
    border-color: var(--svc-brand-btn, var(--svc-brand-dark));
    background: var(--svc-brand-btn, var(--svc-brand-dark));
    color: #fff;
}

.lml-jump .lml-jump-guide:hover[b-3i5w5u4s6m] {
    border-color: var(--svc-brand-btn-hover, var(--svc-brand-deep));
    background: var(--svc-brand-btn-hover, var(--svc-brand-deep));
    color: #fff;
}

/* ── 본문 링크(밝은 바탕) ── */
.lml-a[b-3i5w5u4s6m] {
    color: var(--svc-brand-dark);
    font-weight: 700;
    text-underline-offset: 3px;
}

.lml-a:hover[b-3i5w5u4s6m] {
    color: var(--svc-brand-deep);
}

/* ── 격자 ── */
.lml-grid3[b-3i5w5u4s6m] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* 무엇을 할 수 있나요 — 늘 2열(1행 러브머니 | 월예산, 2행 통계 | 지수). 1000px 아래는 1열. */
.lml-grid2[b-3i5w5u4s6m] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

/* ── 히어로 각주 안 ── */
.lml-hero-note[b-3i5w5u4s6m] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 215, 109, .6);
    background: rgba(255, 215, 109, .16);
    color: #fff3cf;
    font-weight: 700;
}

/* 가격 고지 묶음 — 버튼 바로 아래 반투명 띠(읽기 쉬운 한 덩어리로) */
.lml-hero-price[b-3i5w5u4s6m] {
    margin: 0 0 10px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    background: rgba(0, 0, 0, .16);
    line-height: 1.65;
}

.lml-hero-price p:last-child[b-3i5w5u4s6m] {
    margin-bottom: 0;
}

.lml-hero-own[b-3i5w5u4s6m] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .4);
}

/* ── 이게 뭔가요 ── */
.lml-dbdesc[b-3i5w5u4s6m] {
    white-space: pre-wrap;
}

/* ── 화면 미리보기 — 회원 화면 탭 4개와 1:1 인 네 장을 2×2 로(1000px 아래는 .lml-grid2 규칙대로 1열). 그림 안 글자색은 SgSection soft 띠 위에서도 본문색. ── */
.lml-preview[b-3i5w5u4s6m] {
    align-items: start;
    color: var(--sg-body);
}

/* ── 작은 안내 글 ── */
.lml-fine[b-3i5w5u4s6m] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

/* ── 요금 요약 ── */
.lml-prenotice[b-3i5w5u4s6m] {
    display: grid;
    gap: 6px;
    margin: 0 0 22px;
    padding: 14px 18px 14px 34px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14px;
    line-height: 1.7;
    color: var(--sg-body);
}

.lml-prenotice:empty[b-3i5w5u4s6m] {
    display: none;
}

.lml-prenotice b[b-3i5w5u4s6m] {
    color: var(--sg-ink);
}

.lml-plans[b-3i5w5u4s6m] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 20px 18px;
    align-items: stretch;
    padding-top: 12px;   /* 「이용 중」 배지가 카드 위로 12px 올라온다 */
}

.lml-plans-cta[b-3i5w5u4s6m] {
    margin-top: 26px;
    text-align: center;
}

.lml-plans-cta .lml-fine[b-3i5w5u4s6m] {
    max-width: 46em;
    margin-left: auto;
    margin-right: auto;
}

.lml-empty[b-3i5w5u4s6m] {
    margin: 0;
    padding: 18px;
    border: 1px dashed #c3cfd3;
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    color: var(--sg-muted);
}

@media (max-width: 1000px) {
    .lml-grid2[b-3i5w5u4s6m] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .lml-jump[b-3i5w5u4s6m] {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-top: 14px;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .lml-jump .lml-jump-guide[b-3i5w5u4s6m] {
        margin-left: 0;
    }

    .lml-grid2[b-3i5w5u4s6m],
    .lml-grid3[b-3i5w5u4s6m] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .lml-plans[b-3i5w5u4s6m] {
        grid-template-columns: minmax(0, 1fr);
    }

    .lml-prenotice[b-3i5w5u4s6m] {
        padding: 12px 14px 12px 30px;
        font-size: 13.5px;
    }
}
/* /Components/Pages/PvsNpLanding.razor.rz.scp.css */
/* PvsNpLanding scoped CSS — 4번 안내 홈 고유의 배치만 둔다. 히어로·구역·카드·단계·요금 카드·버튼의 모양은 공용 구성 요소
   (HypsvcCom.Platform.Client/Components/ServiceGuide/*.razor.css)가 갖고, 색·치수 토큰(--svc-brand* · --sg-*)은 SgPage 가 내려 준다(CSS 변수는 scoped 경계를 넘어 상속된다).
   1번 안내 홈(AiAgentLanding.razor.css)과 같은 치수를 쓴다 — 안내 홈들이 같은 결로 보여야 한다.
   서비스 색은 변수로만 쓴다 — 포털 기본색 파랑 같은 색 리터럴을 서비스 색 뜻으로 적지 않는다(PvsNpLandingBrandColorTests)(2026-10-05).
   ⚠ 공용 구성 요소의 슬롯 안에 쓴 마크업은 이 파일의 scope 를 갖지만, 구성 요소 자신의 요소(.sg-*)는 갖지 않는다 — .sg-* 를 여기서 고치지 않는다. */

/* ── 본문 링크(밝은 바탕) ── */
.pnl-a[b-l6k0k2qrlj] {
    color: var(--svc-brand-dark);
    font-weight: 700;
    text-underline-offset: 3px;
}

.pnl-a:hover[b-l6k0k2qrlj] {
    color: var(--svc-brand-deep);
}

.pnl-a:focus-visible[b-l6k0k2qrlj] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ── 히어로 안 ── */
/* 운영자가 적은 서비스 설명(dbo.Hypsvcs.HypsvcDescription) — 줄바꿈을 그대로 살린다. */
.pnl-dbdesc[b-l6k0k2qrlj] {
    white-space: pre-wrap;
    opacity: .9;
}

/* 불러오기 실패·비공개 알림 — 히어로 각주 안의 노란 띠(1번 .agl-hero-note 와 같은 모양). */
.pnl-hero-note[b-l6k0k2qrlj] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 215, 109, .6);
    background: rgba(255, 215, 109, .16);
    color: #fff3cf;
    font-weight: 700;
}

/* ── 3분 체험 — 왼쪽 3색칠 그림(퍼즐 화면과 같은 ColoringGraph), 오른쪽 규칙·가짓수 표·단추. 그림의 모양은 ColoringGraph.razor.css 가 갖는다(2026-10-07) ── */
.pnl-try[b-l6k0k2qrlj] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: 24px;
    align-items: center;
}

.pnl-try-fig[b-l6k0k2qrlj] {
    margin: 0;
    padding: 16px;
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius-card);
    background: var(--sg-surface);
    box-shadow: var(--sg-shadow-card);
}

.pnl-try-pic[b-l6k0k2qrlj] {
    display: block;
    border-radius: 12px;
}

.pnl-try-pic:focus-visible[b-l6k0k2qrlj] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 3px;
}

.pnl-try-fig figcaption[b-l6k0k2qrlj] {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--sg-muted);
    text-align: center;
}

.pnl-try-rules[b-l6k0k2qrlj] {
    display: grid;
    gap: 6px;
    margin: 0 0 14px;
    padding-left: 22px;
    font-size: 15px;
    line-height: 1.7;
    color: var(--sg-body);
}

.pnl-try-rules b[b-l6k0k2qrlj],
.pnl-try-punch b[b-l6k0k2qrlj] {
    color: var(--sg-ink);
}

/* 가짓수 표 — 마지막 줄(화면에서는 풀 수 없는 크기)을 서비스 색으로 짚는다. */
.pnl-scale[b-l6k0k2qrlj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.pnl-scale caption[b-l6k0k2qrlj] {
    caption-side: top;
    padding-bottom: 6px;
    font-size: 13px;
    color: var(--sg-muted);
    text-align: left;
}

.pnl-scale th[b-l6k0k2qrlj],
.pnl-scale td[b-l6k0k2qrlj] {
    padding: 6px 10px;
    border-bottom: 1px solid var(--sg-line);
    text-align: left;
}

.pnl-scale thead th[b-l6k0k2qrlj] {
    font-size: 12.5px;
    color: var(--sg-muted);
}

.pnl-scale tbody tr:last-child th[b-l6k0k2qrlj],
.pnl-scale tbody tr:last-child td[b-l6k0k2qrlj] {
    color: var(--svc-brand-dark);
    font-weight: 700;
}

.pnl-try-punch[b-l6k0k2qrlj] {
    margin: 14px 0;
    font-size: 15px;
    line-height: 1.75;
    color: var(--sg-body);
}

.pnl-try-actions[b-l6k0k2qrlj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
}

.pnl-try-more[b-l6k0k2qrlj] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-size: 14px;
    color: var(--sg-muted);
}

/* ── 그림으로 둘러보기 — 카드 한 장 = 링크 하나(그림 · 장과 절 · 제목 · 글 · 가는 곳) ── */
.pnl-figs[b-l6k0k2qrlj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 18px;
}

.pnl-fig[b-l6k0k2qrlj] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--sg-line);
    border-radius: var(--sg-radius-card);
    background: var(--sg-surface);
    box-shadow: var(--sg-shadow-card);
    color: inherit;
    text-decoration: none;
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

.pnl-fig:hover[b-l6k0k2qrlj] {
    border-color: var(--svc-brand);
    box-shadow: var(--sg-shadow-pop);
    transform: translateY(-2px);
}

.pnl-fig:focus-visible[b-l6k0k2qrlj] {
    outline: 3px solid var(--svc-brand);
    outline-offset: 3px;
}

.pnl-fig-pic[b-l6k0k2qrlj] {
    display: block;
    padding: 10px;
    border-bottom: 1px solid var(--sg-line);
    background: var(--sg-surface);
}

.pnl-fig-pic img[b-l6k0k2qrlj] {
    display: block;
    width: 100%;
    height: auto;
}

.pnl-fig-body[b-l6k0k2qrlj] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 6px;
    padding: 14px 18px 18px;
}

.pnl-fig-kicker[b-l6k0k2qrlj] {
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--svc-brand-dark);
}

.pnl-fig-title[b-l6k0k2qrlj] {
    font-size: 18px;
    font-weight: 800;
    color: var(--sg-ink);
}

.pnl-fig-text[b-l6k0k2qrlj] {
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--sg-body);
}

.pnl-fig-go[b-l6k0k2qrlj] {
    margin-top: auto;
    padding-top: 6px;
    font-weight: 700;
    color: var(--svc-brand-dark);
}

/* ── 지금 할 수 있는 것 — 기능 카드 8장 격자 ── */
.pnl-grid[b-l6k0k2qrlj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* ── 이용 패스 비교 ── */
.pnl-plans[b-l6k0k2qrlj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 20px 18px;
    align-items: stretch;
    padding-top: 12px;   /* 「이용 중」 배지가 카드 위로 12px 올라온다 */
}

.pnl-fine[b-l6k0k2qrlj] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--sg-muted);
}

.pnl-fine-top[b-l6k0k2qrlj] {
    margin: 0 0 10px;
    font-size: 14px;
}

.pnl-fine b[b-l6k0k2qrlj] {
    color: var(--sg-ink);
}

.pnl-empty[b-l6k0k2qrlj] {
    margin: 0;
    padding: 18px;
    border: 1px dashed #c3cfd3;
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    color: var(--sg-muted);
}

/* ── 알아두실 점 — 왼쪽 서비스 색 띠의 안내 상자(1번 .agl-prenotice 와 같은 결) ── */
.pnl-notes[b-l6k0k2qrlj] {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 14px 18px 14px 34px;
    border: 1px solid var(--sg-line);
    border-left: 4px solid var(--svc-brand);
    border-radius: 12px;
    background: var(--sg-surface-soft);
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--sg-body);
}

.pnl-notes b[b-l6k0k2qrlj] {
    color: var(--sg-ink);
}

@media (max-width: 640px) {
    .pnl-try[b-l6k0k2qrlj] {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }

    .pnl-figs[b-l6k0k2qrlj],
    .pnl-grid[b-l6k0k2qrlj],
    .pnl-plans[b-l6k0k2qrlj] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .pnl-notes[b-l6k0k2qrlj] {
        padding: 12px 14px 12px 30px;
        font-size: 13.5px;
    }
}
/* /ComponentsForAdmin/AdminLogPeriodField.razor.rz.scp.css */
/* 관리자 운영 로그 화면의 검색 기간 입력 칸 — 검색창 줄 안에 한 줄로, 좁으면 줄바꿈. */
.admin-log-period[b-ldolqw12rh] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.admin-log-period label[b-ldolqw12rh] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin: 0;
    white-space: nowrap;
}

.admin-log-period input[type="date"][b-ldolqw12rh] {
    width: auto;
}
/* /ComponentsForAdmin/AdminMenu.razor.rz.scp.css */
/* PC용 로고 컨테이너 */
.nav-logo-container[b-f6slktwm6q] {
    display: block;
}

/* 햄버거 아이콘 - 기본 숨김 (PC) */
.hamburger-icon[b-f6slktwm6q] {
    display: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    position: fixed;
    top: 8px;
    left: 8px;
    padding: 8px;
    /* 아래 세 값은 .sidebar 가 만든 쌓임 맥락 '안'의 순서일 뿐이다(바깥과 겨루지 않는다).
       바깥과 겨루는 값은 .sidebar 자신의 z-index(= app.css 의 --z-sidebar) 하나뿐. */
    z-index: 3;   /* 햄버거 버튼 — 오버레이(1)·메뉴 패널(2) 위 */
    background-color: darkslateblue;
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hamburger-icon span[b-f6slktwm6q] {
    display: block;
    width: 22px;
    height: 3px;
    background-color: white;
    margin: 3px 0;
    border-radius: 2px;
    transition: all 0.3s ease;
}

/* 메뉴 오버레이 - 기본 숨김 */
.menu-overlay[b-f6slktwm6q] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;   /* .sidebar 내부 순서 — 위 .hamburger-icon 주석 참조 */
}

/* 오버레이 표시 상태 */
.menu-overlay.overlay-visible[b-f6slktwm6q] {
    display: block;
}

.navbar-toggler[b-f6slktwm6q] {
    display: none !important;
}

.navbar-brand[b-f6slktwm6q] {
    font-size: 1.1rem;
}

/* 1단계(대구분 헤더) 전용 아이콘 — 2단계 항목에는 아이콘을 두지 않는다(가로 공간 확보).
   헤더가 30px 이므로 아이콘·오른쪽 여백도 그에 맞춰 작게 둔다. */
.bi[b-f6slktwm6q] {
    display: inline-block;
    position: relative;
    flex: 0 0 auto;
    width: 0.95rem;
    height: 0.95rem;
    margin-right: 0.4rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.bi-lock-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.bi-search-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
}

.bi-pencil-square-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z'/%3E%3Cpath fill-rule='evenodd' d='M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z'/%3E%3C/svg%3E");
}

.bi-credit-card-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm2-1a1 1 0 0 0-1 1v1h14V4a1 1 0 0 0-1-1H2zm13 4H1v5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V7z'/%3E%3Cpath d='M2 10a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-1z'/%3E%3C/svg%3E");
}

.bi-chat-dots-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M5 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3Cpath d='m2.165 15.803.02-.004c1.83-.363 2.948-.842 3.468-1.105A9.06 9.06 0 0 0 8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6a10.437 10.437 0 0 1-.524 2.318l-.003.011a10.722 10.722 0 0 1-.244.637c-.079.186.074.394.273.362a21.673 21.673 0 0 0 .693-.125zm.8-3.108a1 1 0 0 0-.287-.801C1.618 10.83 1 9.468 1 8c0-3.192 3.004-6 7-6s7 2.808 7 6c0 3.193-3.004 6-7 6a8.06 8.06 0 0 1-2.088-.272 1 1 0 0 0-.711.074c-.387.196-1.24.57-2.634.893a10.97 10.97 0 0 0 .398-2z'/%3E%3C/svg%3E");
}

.bi-bag-check-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M10.854 8.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L7.5 10.793l2.646-2.647a.5.5 0 0 1 .708 0z'/%3E%3Cpath d='M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1zm3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4h-3.5zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5z'/%3E%3C/svg%3E");
}

.bi-briefcase-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v8A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-8A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1h-3zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5zm1.886 6.914L15 7.151V12.5a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5V7.15l6.614 1.764a1.5 1.5 0 0 0 .772 0zM1.5 4h13a.5.5 0 0 1 .5.5v1.616l-6.614 1.764a1.5 1.5 0 0 1-.772 0L1 6.116V4.5a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}

.bi-box-seam-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5l2.404.961L10.404 2l-2.218-.887zm3.564 1.426L5.596 5 8 5.961 14.154 3.5l-2.404-.961zm3.25 1.7-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923l6.5 2.6zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0l-7.185-2.874A1 1 0 0 1 0 12.162V3.5a.5.5 0 0 1 .314-.464L7.443.184z'/%3E%3C/svg%3E");
}

.bi-info-circle-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/%3E%3C/svg%3E");
}

.bi-signpost-split-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7 7V1.414a1 1 0 0 1 2 0V2h5a1 1 0 0 1 .8.4l.975 1.3a.5.5 0 0 1 0 .6L14.8 5.6a1 1 0 0 1-.8.4H9v10H7v-5H2a1 1 0 0 1-.8-.4L.225 9.3a.5.5 0 0 1 0-.6L1.2 7.4A1 1 0 0 1 2 7h5zm1 3V8H2l-.75 1L2 10h6zm0-5h6l.75-1L14 3H8v2z'/%3E%3C/svg%3E");
}

.bi-person-plus-nav-menu[b-f6slktwm6q] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0zm4 8c0 1-1 1-1 1H1s-1 0-1-1 1-4 6-4 6 3 6 4zm-1-.004c-.001-.246-.154-.986-.832-1.664C9.516 10.68 8.289 10 6 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10z'/%3E%3Cpath fill-rule='evenodd' d='M13.5 5a.5.5 0 0 1 .5.5V7h1.5a.5.5 0 0 1 0 1H14v1.5a.5.5 0 0 1-1 0V8h-1.5a.5.5 0 0 1 0-1H13V5.5a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}

/* ── 메뉴 행 치수 ────────────────────────────────────────────────────────────
   Admin 사이드바는 대구분 9개·항목 40여 개가 한 화면에 서야 해서 회원 사이드바(NavMenu)보다 촘촘하다.
   가독성 하한: 2단계 글자 12px 이상, 클릭 영역(행 높이) 24px 이상 — 이 아래로 내리지 말 것.
   ⛔ 말줄임(text-overflow: ellipsis)으로 감추지 않는다. 두 줄로 넘어가던 메뉴명은 글자·좌우 여백을 줄여
      '실제로' 한 줄에 들어가게 한다(감춘 이름은 메뉴에서 쓸모가 없다). */
.nav-item[b-f6slktwm6q] {
    font-size: 0.78rem;          /* 12.5px — 2단계 항목 글자 */
    padding-bottom: 0.125rem;    /* 2px — 항목 사이 세로 간격 */
}

    .nav-item:first-of-type[b-f6slktwm6q] {
        padding-top: 0.125rem;
    }

    .nav-item:last-of-type[b-f6slktwm6q] {
        padding-bottom: 0.125rem;
    }

    .nav-item[b-f6slktwm6q]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        /* 고정 height 대신 min-height — 글자를 줄여도 클릭 영역은 26px 를 지키고,
           그래도 두 줄이 되는 항목이 생기면 잘리지 않고 늘어난다(고정 height 는 넘친 줄을 그대로 흘린다). */
        min-height: 1.625rem;        /* 26px */
        padding: 0.1875rem 0.5rem;   /* 3px 8px — Bootstrap .nav-link 기본 0.5rem 1rem 을 덮어 가로 16px 를 번다 */
        line-height: 1.3;
        display: flex;
        align-items: center;
        width: 100%;
    }

    /* 대구분(details.nav-item) — 마크업에서 걷어낸 px-3 대신 여기서 좌우 여백을 잡고, 그룹 사이 간격도 여기서 준다.
       .nav-item:last-of-type 과 특이도가 같으므로 이 규칙이 뒤에 와야 마지막 그룹에도 같은 간격이 적용된다. */
    .nav-item.admin-group[b-f6slktwm6q] {
        padding-left: 0.5rem;        /* 8px */
        padding-right: 0.35rem;      /* 5.6px */
        padding-bottom: 0.25rem;     /* 4px — 그룹 사이 간격 */
    }

.nav-item[b-f6slktwm6q]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-f6slktwm6q]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-f6slktwm6q] {
    display: none;
}

/* PC 레이아웃 (641px 이상) */
@media (min-width: 641px) {
    .hamburger-icon[b-f6slktwm6q] {
        display: none !important;
    }

    .menu-overlay[b-f6slktwm6q] {
        display: none !important;
    }

    .nav-logo-container[b-f6slktwm6q] {
        display: block;
    }

    /* 메뉴 스크롤 영역 바닥 = 뷰포트 바닥.
       사이드바는 로고 블록(--sidebar-header-h) + 1px(아래 margin-top) + 이 높이로 정확히 100vh 를 채운다.
       ★ 숫자를 직접 쓰지 말 것 — 로고 높이를 바꾸면 반드시 이 계산식이 따라와야 한다(app.css :root 정본).
       1px 은 AdminMenu.razor 의 .nav-scrollable 인라인 margin-top 보정값이다. */
    .nav-scrollable[b-f6slktwm6q] {
        display: block;
        height: calc(100vh - var(--sidebar-header-h) - 1px);
        overflow-y: auto;
    }
}

/* 모바일 레이아웃 (640px 이하) */
@media (max-width: 640px) {
    /* 로고 숨김 */
    .nav-logo-container[b-f6slktwm6q] {
        display: none !important;
    }

    /* 햄버거 아이콘 표시 */
    .hamburger-icon[b-f6slktwm6q] {
        display: flex !important;
    }

    /* 메뉴 기본 숨김 */
    .nav-scrollable[b-f6slktwm6q] {
        display: none;
        position: fixed;
        top: 0;
        left: -100%;
        width: 85%;
        max-width: 300px;
        height: 100vh;
        z-index: 2;   /* .sidebar 내부 순서 — 오버레이(1) 위, 햄버거(3) 아래 */
        overflow-y: auto;
        background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
        padding-top: 60px;
        transition: left 0.3s ease;
    }

    /* 메뉴 열림 상태 */
    .nav-scrollable.menu-open[b-f6slktwm6q] {
        display: block !important;
        left: 0;
    }
}
/* /ComponentsForAdmin/AdminPager.razor.rz.scp.css */
/* 관리자 전체 목록 화면의 쪽 넘김 줄 — 표 아래 한 줄. */
.admin-pager[b-2bhak8l3he] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin: 0.75rem 0;
    flex-wrap: wrap;
}

.admin-pager-range[b-2bhak8l3he] {
    font-size: 0.88rem;
    color: #555;
}
/* /ComponentsForAdmin/ServiceBrandColorField.razor.rz.scp.css */
/* 서비스 대표 색(dbo.Hypsvcs.ServiceBrandColor) 편집 칸 — Admin 두 화면 공용(0-K722).
   클래스 접두 sbc- : 부르는 페이지의 전역 <style> 블록(.brand-swatch 등)과 섞이지 않게 한다. */

.sbc-field[b-yazq338a5t] { display: flex; flex-direction: column; gap: 0.3rem; }

.sbc-row[b-yazq338a5t] { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; }

.sbc-input[b-yazq338a5t] { max-width: 10rem; }

/* 지금 값으로 칠한 미리보기 한 칸 */
.sbc-swatch[b-yazq338a5t] {
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    vertical-align: middle;
}

.sbc-note[b-yazq338a5t] { font-size: 0.8rem; color: #555; }

/* 대비 경고 — 저장을 막지 않는 알림이므로 빨강이 아니라 호박색 */
.sbc-warn[b-yazq338a5t] {
    margin: 0.15rem 0 0;
    padding: 0.35rem 0.5rem;
    font-size: 0.8rem;
    color: #8a5300;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 4px;
}

.sbc-hint[b-yazq338a5t] { margin: 0; font-size: 0.78rem; color: #777; font-weight: 400; }

.sbc-caution[b-yazq338a5t] { font-size: 0.78rem; }

.sbc-caution > summary[b-yazq338a5t] {
    cursor: pointer;
    color: #bf360c;
    font-weight: 600;
    padding: 0.15rem 0;
}

.sbc-caution-body[b-yazq338a5t] {
    margin-top: 0.3rem;
    padding: 0.5rem 0.65rem;
    background: #fbe9e7;
    border: 1px solid #ffab91;
    border-radius: 4px;
}

.sbc-caution-line[b-yazq338a5t] { margin: 0 0 0.4rem; line-height: 1.55; color: #4a3b36; font-weight: 400; }
.sbc-caution-line:last-child[b-yazq338a5t] { margin-bottom: 0; }

/* 포털 홈이 따라 바뀌지 않는다는 줄 — 운영자가 가장 놓치기 쉬운 사실이라 한 단 더 강조 */
.sbc-caution-strong[b-yazq338a5t] { background: #fff; border-left: 3px solid #bf360c; padding: 0.35rem 0.5rem; }

.sbc-caution-body code[b-yazq338a5t] { font-size: 0.75rem; background: rgba(0, 0, 0, 0.05); padding: 0 0.2rem; border-radius: 3px; }