/* BASIC css start */
/* =========================================
   상단 탭 & 마키 배너 공통 스타일
   ========================================= */
.top-nav-area {width: 100%;background: #fff;margin-top: 20px;}

/* 탭 메뉴 (PC 기준) */
.top-tabs {
    display: flex;
    list-style: none;
    border-bottom: 1px solid #eee;
    max-width: var(--layout-total-width); 
    padding: 0;
    margin: 0 auto; 
}
.newContainer-wide .top-tabs {
    margin: var(--layout-padding-set);
}
.top-tabs li { 
    flex: 1; 
    text-align: center; 
    position: relative;
}
/* 탭 사이 구분선 */
.top-tabs li:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 14px;
    background-color: #dbdbdb;
}
.top-tabs a {
    display: block;
    padding: 31px 0;
    font-size: 22px;
    color: #000;
    font-weight: 600;
}
/* 활성화된 탭 스타일 */
.top-tabs li.active a {
    color: var(--main-color); /* 진한 보라색 */
    font-weight: 700;
}
.top-tabs li.active::before {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #3b1790; /* 보라색 포인트 밑줄 */
    z-index: 1;
}

/* 텍스트 전환용 클래스 (PC에서는 모바일 텍스트 숨김) */
.mo-text { display: none; }








@media screen and (max-width: 1024px) {

    .top-nav-area {
    margin-top: 8px;
}
    .top-tabs li:not(:last-child)::after {height:10px;}
    .top-tabs li.active::before{height:3px;}
    .top-tabs a {
        font-size: 14px;
        padding: 16.5px 0;
    }
    
    /* 텍스트 전환 */
    .pc-text { display: none; }
    .mo-text { display: inline; }


}
/* BASIC css end */

