.pager {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    ul {
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;

        li {
            padding: 4px;

            &.pager__item--first,
            &.pager__item--previous,
            &.pager__item--next,
            &.pager__item--last {
                span {
                    transform: translateY(-1px);
                }
            }

            a {
                display: flex;
                align-items: center;
                justify-content: center;
                min-width: 32px;
                height: 32px;
                border: 1px solid var(--color-border-3);
                font-size: var(--font-size-16);
                font-weight: var(--font-medium);
                color: var(--color-blue-3);
                text-decoration: none;
                transition: all ease 0.2s;
                padding: 0 11px;


                &:hover {
                    border-color: var(--color-blue-3);
                }
            }

            &.is-active {
                a {
                    border-color: var(--color-blue-3);
                }
            }
        }
    }
}


.view-blog .pager {
    grid-column: span 2;

    @media(max-width: 768px) {
        margin-top: 40px;
        grid-column: 1;
    }
}