.pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    .page-item{
        button{
            font-family: 'Pretendard';
            display: flex;
            align-items: center;
            justify-content: center;
            width: 24px;
            height: 24px;
            border: 1px solid #EAEAEA;
            font-size: 12px;
            font-weight: 400;
            color: #808080;
        }
        &.on{
            button{
                border-color: #304961;
                font-weight: 600;
                color: #304961;
            }
        }
        &.last,
        &.first{
            button{
                background: url(../../public/static/images/sub/pagination_first.svg)no-repeat center;
                background-size: 9px 8px;
            }
        }
        &.last{
            button{
                transform: rotate(180deg);
            }
        }
        &.next,
        &.prev{
            button{
                background: url(../../public/static/images/sub/pagination_prev.svg)no-repeat center;
                background-size: 5px 8px;
            }
        }
        &.next{
            button{
                transform: rotate(180deg);
            }
        }
    }
}