

/* ----------------------------------------------- */
/* 랭킹 레이아웃 */
.nav-rank .main-top .container{
   flex-direction: column;
   align-items:first baseline;
   gap:var(--space-8);
   position: relative;
    
}

/* 랭킹 셀렉트  */
.nav-rank .select-box{
    position: absolute;
    right: 0;
    top:6px;
    width: 140px;
}


/* 랭킹 날짜 */
.nav-rank .rank-date {
    font-size: var(--fs-13);
    color: var(--fc-gray-99);
    font-weight: 600;
   
    
}



/* -------------------- */
.nav-rank .main-cont .card-cont{
    margin-top:var(--space-12);

}

.nav-rank .product-list{
    gap:3.75rem 1.75rem;
  
}

/* 7개마다 행 구분선 */
.nav-rank .product-list li:nth-child(7n)::after{
    content:"";
    position:absolute;
    left:calc(-600% - 1.75rem * 6); /* 앞의 6칸까지 확장 */
    bottom:-2.125rem;                /* row gap의 가운데쯤 */
    width:calc(700% + 1.75rem * 6);
    height:1px;
    background:var(--line-200);
}

/* 마지막 줄은 제거 */
.nav-rank  .product-list li:nth-last-child(-n+7)::after{
    display:none;
}





/* -------------------- */
/* 랭킹 넘버*/
.rank-no {
    margin-bottom: var(--space-8);
    display: block;
    font-size: var(--fs-14);
    color: var(--fc-black);
    font-weight: 800;
    display: flex;
}


/* 랭킹 3*/
.rank-top3 {
    color: var(--color-primary);
}
.rank-top3 i {
   margin-right: var(--space-24);
   position: relative;
}

.rank-top3 i::after{
   position: absolute;
   content: '';
   width: 20px;
   height: 20px;
   background-image: url('/images/renew260618/icon/rank.png');
       background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: translateY(-50%);
    left: 0;
    top: 50%;
}

/* 선택된 카테고리 강조 */
.card-category p a,
.card-category .top-menu-track a {
    color: var(--fc-gray-99);
    font-weight: 600;
    text-decoration: none;
}
.card-category p.active a,
.card-category .top-menu-track a.active {
    color: var(--color-primary);
    font-weight: 800;
    position: relative;
}
.card-category p.active a::after,
.card-category .top-menu-track a.active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--color-primary);
}

.card-category p {
    position: relative;
}