LNB GNB 탭 포커스

packages/common/components/src/ui/header/header.css

@@ -6,6 +6,13 @@
     position: relative;
   }
 
+  /* 키보드 초점 표시 - 상위 overflow 영역에 잘리지 않도록 nav에 여백(p-[0.6rem]) 확보 */
+  .header-nav-link:focus-visible {
+    outline: 2px solid currentColor;
+    outline-offset: 2px;
+    border-radius: 2px;
+  }
+
   /* .header-nav-link::before {
     content: "";
     position: absolute;

packages/common/components/src/ui/header/index.tsx

@@ -365,11 +365,11 @@ export function Header({
         </div>
       )}
       {/* 데스크톱에서 중간 네비게이션 */}
-      <ScrollArea className="hidden max-w-[calc(100vw-60rem)] flex-1 items-center justify-center px-2 py-4 sm:flex">
+      <ScrollArea className="hidden max-w-[calc(100vw-60rem)] flex-1 items-center justify-center px-2 py-[0.4rem] sm:flex">
         {mounted &&
           userSiteList?.content &&
           userSiteList.content.length > 0 && (
-            <nav className="flex w-full flex-nowrap items-center justify-start gap-3 overflow-x-auto whitespace-nowrap md:gap-6">
+            <nav className="flex w-full flex-nowrap items-center justify-start gap-3 overflow-x-auto whitespace-nowrap p-[0.6rem] md:gap-6">
               {userSiteList.content.map((site) => (
                 <a
                   key={site.siteId}

packages/common/components/src/ui/lnb/index.tsx

@@ -251,7 +251,7 @@ export function LNB({
       onClick: handleClick,
     };
     const menuClassName = cn(
-      "h-auto cursor-pointer py-4 text-[1.4rem] text-label transition-colors hover:bg-accent",
+      "h-auto cursor-pointer py-4 text-[1.4rem] text-label transition-colors hover:bg-accent focus-visible:ring-inset",
       isMatched && "bg-accent !text-primary",
       !isSidebarOpen && "justify-center",
     );
@@ -311,7 +311,7 @@ export function LNB({
           <CollapsibleTrigger asChild>
             <SidebarMenuButton
               className={cn(
-                "flex h-auto items-center py-4 pr-2 text-[1.4rem]",
+                "flex h-auto items-center py-4 pr-2 text-[1.4rem] focus-visible:ring-inset",
                 isOpen && "bg-transparent",
                 !isSidebarOpen && "justify-center",
               )}