@charset "UTF-8";

/* ページネーション本体 */
.pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 40px;
}

.pagination ul {
    display: flex;
}

/* 前・次へ移動するボタン */
/* .pagination .prev-page {
}

.pagination .next-page {
} */

.pagination .prev-page button,
.pagination .next-page button {
    background-color: #C4C4C4;
    color: #fff;
    /* height: 30px; */
    line-height: 30px;
    min-width: 95px;
    font-weight: bold;
    border-radius: 2px;
}

/* 前・次へ移動するボタンの無効化時 */
.pagination .prev-page.disabled,
.pagination .next-page.disabled {
    display: none;
}

/* .pagination .prev-page.disabled button {}

.pagination .next-page.disabled button {} */


/* 最初・最後へ移動するボタン */
/* .pagination .first-page {
}

.pagination .end-page {
}

.pagination .first-page button {
}

.pagination .end-page button {
} */

/* 最初・最後へ移動するボタンの無効化時 */
/* .pagination .first-page.disabled {}

.pagination .end-page.disabled {}

.pagination .first-page.disabled button {
} */

/* .pagination .end-page.disabled button {} */

/* ページ別切り替えボタン */
.pagination ul {
    flex-wrap: nowrap;
    gap: 10px;
}

.pagination li {
    width: 100% !important;
    margin-bottom: 0 !important;
}

.pagination li a {
    display: block;
    background-color: #C4C4C4;
    font-weight: bold;
    color: #fff;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 2px;
}

/* カレント時（現在位置） */
/* .pagination li.current {} */


.pagination li.current a {
    background-color: #646464;
}

/* 省略記号 */
.pagination li.ellipsis {
    display: block;
    background-color: #C4C4C4;
    color: #fff;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 2px;
    min-width: 30px;
}


/* .pagination li.ellipsis span {
} */

/* ページ情報（現在のページ番号と最大数） */
/* .pagination .page-info {} */

@media screen and (max-width: 768px) {
    .pagination ul {
        flex-direction: row;
    }

    .pagination li {
        padding: 0 !important;
        border: none !important;
    }

    .pagination {
        margin-top: 10px;
    }
}