@charset "utf-8";
/* 알림 벨 — 시안대로 박스 없는 아웃라인 벨 + 빨간 뱃지. .topHeaderInner 스코프로 기존 .side 버튼 규칙(#222 사각) 무력화 */
.topHeaderInner .side > ul > li.nc-bell-li{ display:block !important; position:relative; }
.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell,
.topHeaderInner .side > ul > li.nc-bell-li:first-child > a.nc-bell{ display:flex; align-items:center; justify-content:center; width:50px; height:50px; padding:0; border:0; border-radius:12px; background:transparent; color:#444; font-size:0; line-height:1; position:relative; overflow:visible; transition:background .15s ease, color .15s ease; }
.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell:hover,
.topHeaderInner .side > ul > li.nc-bell-li:first-child > a.nc-bell:hover{ background:#f2f4ee; color:var(--t2-pt, #669900); border:0; }
.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell svg{ width:26px; height:26px; color:inherit; }
.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell.has-new{ color:var(--t2-pt, #669900); }
.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell.has-new svg{ animation:nc-ring 1.6s ease-in-out 1; transform-origin:50% 4px; }
/* 미읽음 뱃지 */
.topHeaderInner .side > ul > li.nc-bell-li .nc-bell__badge{ position:absolute; top:4px; right:2px; min-width:19px; height:19px; padding:0 5px; border-radius:10px; background:#e53935; color:#fff; font-size:11.5px; font-weight:700; line-height:19px; text-align:center; box-shadow:0 0 0 2px #fff; }
/* 드롭다운 패널 기준점 (스킨 JS 가 #nc_panel 을 이 li 안으로 이동) */
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel{ top:calc(100% + 12px); right:0; }
@keyframes nc-ring { 0%,100% { transform:rotate(0) } 15% { transform:rotate(14deg) } 30% { transform:rotate(-12deg) } 45% { transform:rotate(9deg) } 60% { transform:rotate(-6deg) } 75% { transform:rotate(3deg) } }
@media (max-width:1100px){
	.topHeaderInner .side > ul > li.nc-bell-li{ width:auto; padding:0; height:auto; }
	.topHeaderInner .side > ul > li.nc-bell-li > a.nc-bell{ width:44px; height:44px; }
}

/* ---- 드롭다운 패널이 .side > ul > li 안으로 이동되므로 레이아웃의 .topHeader .side ul(display:flex 등) 규칙이
        패널 내부 ul/li 로 상속·누출됨 → 패널 내부는 전부 블록으로 강제 리셋 ---- */
.topHeader .side .nc-panel ul,
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel ul{ display:block !important; float:none !important; height:auto !important; overflow:visible !important; border:0 !important; gap:0 !important; margin:0; padding:0 8px; position:static !important; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel ul.nc-panel__list{ max-height:min(440px, 60vh) !important; overflow-y:auto !important; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel li{ display:block !important; float:none !important; flex:none !important; width:auto !important; height:auto !important; padding:0 !important; margin:0 !important; border:0 !important; position:static !important; text-align:left; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel li + li{ border-top:1px solid #f0f2f5 !important; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel li > a{ display:flex !important; width:auto !important; height:auto !important; padding:12px 14px !important; background:transparent !important; color:#222 !important; font-size:15px !important; border-radius:12px; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel li > a:hover{ background:#f6f8f2 !important; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel .nc-item__cate{ display:inline-block; white-space:nowrap; writing-mode:horizontal-tb; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel .nc-item__text,
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel .nc-item__meta{ display:block; white-space:normal; writing-mode:horizontal-tb; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel .nc-item__body{ min-width:0; flex:1 1 auto; }
.topHeaderInner .side > ul > li.nc-bell-li .nc-panel{ text-align:left; white-space:normal; }