@charset "utf-8";

/* 인기검색어 - 사이드바 공지사항 아래 박스 섹션으로 표시 (제목은 박스 밖 위쪽)
   검색어 개수/폭에 따라 자동으로 줄바꿈되고, 최대 3줄까지만 보이도록 높이를 제한함 */
.aside_popular {margin-bottom:20px}
#popular {position:relative;margin:0;width:100%}
#popular h2 {position:static;display:flex;align-items:center;gap:8px;margin-bottom:16px;font-size:16px;line-height:1;font-weight:700;letter-spacing:-0.01em;color:var(--c-text);overflow:visible}
#popular h2:before {content:"";width:8px;height:8px;border-radius:50%;background:var(--c-accent)}
#popular .popular_inner {position:relative;width:100%;padding:22px;border:1px solid var(--c-border);border-radius:var(--radius-lg);background:var(--c-surface);box-shadow:var(--shadow-sm);transition:box-shadow .25s ease,transform .25s ease}
#popular .popular_inner:hover {box-shadow:var(--shadow-md);transform:translateY(-3px)}
#popular .popular_inner ul {display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px 18px;max-height:88px;overflow:hidden;padding:0;margin:0}
#popular li {width:auto;line-height:24px;white-space:nowrap}
#popular li a {color:var(--c-text-2)}
#popular li a:hover {color:var(--c-accent);text-decoration:underline}

/* ============================================================
   1024px 미만: 좁은 화면에서도 동일하게 박스 형태 유지
   ============================================================ */
@media (max-width: 1023.98px) {
    #popular .popular_inner {padding:18px 16px;border-radius:12px}
}