/* ==========================================================================
   📦 [최종 마감] 테두리가 없고 마지막 메뉴를 숨긴 lnb-left-menu 서식
   ========================================================================== */

/* 1. 메뉴 전체를 감싸는 외곽 박스 (요청 반영: 테두리 보더선 및 그림자 완전 삭제 후 투명화) */
.lnb-left-menu {
    float: left;
    width: 240px;
    padding: 10px 0;
    background-color: transparent; /* 완전 투명 배경 */
    border: none;                  /* 👈 외곽 테두리선 완전 제거 */
    box-shadow: none;              /* 👈 그림자 효과 완전 제거 */
    box-sizing: border-box;
}

/* 내부 리스트 기본 여백 초기화 (투명 박스에 맞게 좌우 여백 리셋) */
.lnb-left-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 2. 개별 메뉴 리스트 칸 양식 */
.lnb-left-menu ul li {
    display: block;
    margin-bottom: 3px;
    padding: 0;
    overflow: hidden;
    transition: background-color 0.15s ease;
}

/* 🔧 [핵심 수정] 맨 마지막 메뉴 항목은 화면에 절대 노출되지 않도록 원천 차단 가드 주입 */
.lnb-left-menu ul li:last-child {
    display: none; /* 👈 맨 마지막 메뉴 강제 숨김 처리 */
}

/* 3. 메뉴 링크 텍스트 기본 서식 */
.lnb-left-menu ul li a {
    display: flex;
    align-items: center;
    gap: 8px;               
    padding: 10px 12px; 
    font-size: 13px; 
    font-weight: 400; 
    letter-spacing: -0.3px; 
    color: #475569;         /* 차분한 차콜 그레이 폰트 톤 */
    text-decoration: none;
    font-family: -apple-system, BlinkMacSystemFont, "Noto Sans KR", sans-serif;
    transition: all 0.15s ease-in-out;
}

/* 체크 원형 아이콘 기본 컬러 */
.lnb-left-menu ul li a i {
    font-size: 14px;
    color: #cbd5e1;
}

/* ⚡ [마우스 호버 효과] 마우스 올리면 부드러운 라운드 카드로 하이라이트 */
.lnb-left-menu ul li:hover {
    background-color: #f1f5f9;
}
.lnb-left-menu ul li:hover a {
    color: #0f172a;        
}
.lnb-left-menu ul li:hover a i {
    color: #6b7277;        
}

/* ==========================================================================
   🎯 [선택 상태] 현재 메뉴가 활성화 되었을 때의 테마 컬러 (.on2)
   ========================================================================== */
.lnb-left-menu ul li.on2 {
    background-color: #6b7277; 
}
.lnb-left-menu ul li.on2 a {
    color: #ffffff;
    font-weight: 700;
}
.lnb-left-menu ul li.on2 a i {
    color: #ffffff;        
}


/* ==========================================================================
   📦 [최종 마감] 테두리 선이 일절 없는 미니멀 물품 카테고리 lnb 서식
   ========================================================================== */
.lnb { width: 238px; float: left; padding: 20px 0; text-align: center; }

/* 🔧 구형 세로선, 가로선 및 외곽 테두리 찌꺼기를 원천 박멸하고 투명 프레임으로 봉인 */
.lnb_m { width: 240px; padding: 0; margin: 0;border-top: 1px solid #ddd; }
.Tap_Off, .Tap_On, .Tap_Detail { display: none; }

/* 물품 카테고리판 상시 노출 */
#menu_Detail.Tap_Detail { display: block !important; clear: both; }
.columnLefts { position: relative; float: left; width: 240px; background: #fff;
border: 1px solid #ddd;border-right: 0;
}
.columnLefts:after { display: block; clear: both; content: ''; }

/* --------------------------------==========================================
   📂 jnb 물품 메뉴 1차 대분류(li1 / a1) 완전 투명 양식
   --------------------------------========================================== */
#jnb_wrp { z-index: 20; width: 100%; float: left; border: none;  background: transparent; padding: 10px 0 0 0; }
#jnb { margin: 0; padding: 0; } 
#jnb li { position: relative; list-style: none; }

/* 🔧 [핵심 수정] 아래선(border-bottom) 및 모든 선들을 완벽히 삭제하여 보기 싫은 여백 분할 현상 완전 차단 */
#jnb .li1 { 
    display: block; border: none; 
    border-bottom: none; /* 👈 보기 싫던 아래쪽 테두리선 완전 삭제 */
    border-radius: 0; 
    margin: 0; 
    transition: background 0.2s; 
}

/* 1차 메뉴 개별 링크 텍스트 서식 */
#jnb .a1 { display: flex; align-items: center; gap: 10px;
    font-size: 13px;
    font-weight: 500; padding: 5px 30px; text-decoration: none; color: #4a5568;  transition: all 0.15s ease-in-out; }

/* ⚡ [마우스 호버 효과] 마우스 올리면 전체가 각진 차콜 카드로 반전 + 글씨 흰색 전환 */
#jnb .li1:hover { background-color: #6b7277; }
#jnb .li1:hover .a1 { color: #ffffff; padding-left: 18px; } /* 호버 시 글자 우측 부드러운 전진 */

/* 현재 활성화된 1차 메뉴 (.on 상태) 테마 컬러 일치 고정 */
#jnb .a1.on { color: #ffffff; background-color: #6b7277; border-radius: 0; }


/* ==========================================================================
   📂 [최종 마감] 간격 제로 및 그림자 완전 삭제형 2차·3차 패널 서식
   ========================================================================== */
#jnb ul { 
    display: none; 
    width: 180px;            /* 세부 목록 가로폭 고정 */
    background-color: #ffffff; 
    border: 1px solid #ced4da; /* 1차 메뉴판 호버 컬러와 톤을 맞춘 단정한 테두리선 */
    border-radius: 0;        /* 1차 메뉴판의 각진 형태와 일치화 */
    box-shadow: none;        /* 👈 [요청 반영] 마우스 올릴 때 나오던 그림자 효과 100% 완전 삭제 */
    position: absolute; 
    top: 0;                  /* 1차 항목과 세로 머리 높이 칼같이 일치 */
    
    /* 🔧 [마우스 사라짐 완벽 박멸] 1차 메뉴판 우측 벽면에 틈새 없이 자석처럼 100% 강제 밀착 */
    left: 239px;             /* 👈 1차 jnb_wrp 가로폭인 239px 지점에 보더 틈새 없이 칼같이 부착 */
    z-index: 999; 
    padding: 4px 0;          /* 위아래 슬림 패딩 조율 */
    margin: 0; 
    box-sizing: border-box;
}

#jnb .li2:first-child { display: none; }

/* 2차, 3차 내부의 개별 링크 글씨 서식 (각진 디자인 통일) */
#jnb .ul2 a, #jnb .ul3 a { 
    display: flex; align-items: center; justify-content: space-between; width: 100%; height: 26px; padding: 0 12px;         
    text-decoration: none; white-space: nowrap; color: #4a5568; border-radius: 0; box-sizing: border-box; transition: all 0.15s ease-in-out; 
}
#jnb .ul2 b { position: static; font-size: 10px; color: #a0aec0; font-weight: normal; }

/* ⚡ [마우스 호버 효과] 배경색 스윽 깔리며 레드로 전환 + 오른쪽 3px 부드러운 전진 모션 */
#jnb .ul2 a:hover, #jnb .ul3 a:hover { background-color: #f7fafc; color: #d32f2f; padding-left: 15px; }

/* 활성화 상태 서식 고정 */
#jnb .ul2 .on .a2, #jnb .a3.on { color: #ffffff; background-color: #6b7277; }

/* 🔧 [3차 소분류 사라짐 완벽 박멸] 2차 박스 우측 벽면에 틈새 없이 칼같이 이어 붙임 */
#jnb .ul3 { 
    top: -5px;               /* 2차 상자 패딩 오차 보정 */
    left: 178px;             /* 👈 2차 상자 가로폭(180px)에서 보더 두께를 계산하여 빈틈없이 강제 밀착 고정 */
}
.ui_font { font-family: "Noto Sans KR", sans-serif; }