@charset "utf-8";

:root {
    --separate-gradient: linear-gradient(to right, var(--color-main) 50%, var(--color-back-blue) 50%);
}

/* ぱんくず
--------------------------------------------------------------- */

.breadcrumbs {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 14px;
    padding: 1.35em 0 calc(1.35em * 2.6);
    margin: 0;

    & li:not(:last-child)::after {
        content: ">";
        margin-inline: .4em;
    }
}


/* 見出し
--------------------------------------------------------------- */

/* - 見出し 1 */
.heading-1 {
    position: relative;
    width: fit-content;
    color: var(--color-main);
    font-size: 40px;
    font-weight: 700;
    margin: 0 auto 1.25em;
    line-height: 1.4;

    &::after {
        content: "";
        display: block;
        width: 60px;
        min-width: 0;
        aspect-ratio: 60/8;
        background: var(--separate-gradient);
        margin: 13px auto 0;
    }
}

/* - 見出し 2 */
.heading-2 {
    --color: var(--color-default);
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 1.25em;
    line-height: 1.4;

    &::after {
        content: "";
        display: block;
        width: 60px;
        min-width: 0;
        aspect-ratio: 60/5;
        background: var(--separate-gradient);
        margin-top: 10px;
    }

    &.heading-2--circle-arrow {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 0 9px;
        color: var(--color);

        &::before {
            content: "";
            display: block;
            min-width: 0;
            aspect-ratio: 1/1;
            mask: url(/image/view/common/icon_circle_arrow.svg) center center / contain no-repeat;
            background-color: var(--color);
            margin-top: .15em;
        }
    }
}

a {
    &:has(.heading-2) {
        text-decoration: none;
    }

    .heading-2 {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 0 9px;
        color: var(--color);

        &::before {
            content: "";
            display: block;
            min-width: 0;
            aspect-ratio: 1/1;
            mask: url(/image/view/common/icon_circle_arrow.svg) center center / contain no-repeat;
            background-color: var(--color);
            margin-top: .15em;
        }
    }
}

/* - 見出し 3 */
.category-title-header {
    position: relative;
    place-content: center start;
    height: 150px;
    background: var(--color-back-grey) var(--background-url) right bottom / auto 100% no-repeat;
}

.heading-3 {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: .475em;
    color: var(--color-main);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.4;

    &::before {
        content: "";
        display: block;
        min-width: 0;
        aspect-ratio: 30/15;
        background: var(--separate-gradient);
    }
}

/* - 見出し 4 */
.heading-4 {
    font-size: 1.5em;
    font-weight: 700;
}

/* - 見出し 5 */
.heading-5 {
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.5;
    margin-bottom: .5em;

    &::before {
        content: "●";
    }
}


/* 製品系パーツ
--------------------------------------------------------------- */

/* アイテムグループ - 見出し */
.item-group-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6em;

    .item-group-heading__group {
        font-size: .875em;
        color: #fff;
        padding: .2em .5em;
        background: var(--color-back-blue);
    }

    .item-group-heading__name {
        font-size: 1.5em;
        font-weight: 700;

        & a {
            color: inherit;
            text-decoration: none;
        }

    }
}


/* テーブル
--------------------------------------------------------------- */

/* - テーブル 1 */
.table-1 {
    width: 100%;
    background: #fff;

    & th,
    & td {
        box-sizing: border-box;
        text-align: left;
        border: 1px solid #ccc;
        padding: .6em 1.2em;
    }

    & th {
        color: #fff;
        font-weight: 700;
        letter-spacing: 1em;
        vertical-align: middle;
        background: var(--color-main);
    }

    & tbody tr:nth-child(even) {
        background-color: var(--color-back-grey);
    }

    .th--model-number {
        width: 11.8em;
        text-align: center;
        text-indent: 1em;
    }

    .th--cad,
    .th--drawing {
        width: 5em;
        text-align: center;
        letter-spacing: normal;
    }

    .tr--empty {
        display: none;
    }

    .cell-center {
        text-align: center;
        vertical-align: middle;
    }
}

/* - テーブル 2 */
.table-2 {
    width: 100%;

    & th,
    & td {
        box-sizing: border-box;
        text-align: left;
        border: 1px solid #ccc;
        padding: .6em 1.2em;
    }

    & th {
        width: 1em;
        white-space: nowrap;
        text-align-last: justify;
        font-weight: 400;
        background: var(--color-back-grey);
    }
}


/* テーブル用コンテナ (キャプション付き)
--------------------------------------------------------------- */

/* - テーブル用 コンテナ 1 */
.figure-table-1 {
    & figcaption {
        font-size: .875em;
        text-align: right;
        margin-block: .5em;
    }
}

.table-element-caption {
    font-size: .875em;
    text-align: right;
    margin-block: .5em;
}

/* - テーブル用 コンテナ 2 */
.table-checker-header {
    display: grid;
    grid-template-columns: 5em 5em minmax(0, 1fr) auto;
    align-items: center;
    margin-bottom: .625em;

    .cell-button {
        padding-inline: 5px;
    }

    .cell-text {
        padding-left: .5em;
    }
}

/* - テーブル用 スクロールコンテナ */
.table-scroll {
    position: relative;
    max-height: 15em;

    .table-scroll__inner {
        max-height: 15em;
        overflow: auto;
    }

    &::before,
    &::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        display: block;
        width: 100%;
        height: 1px;
        background: #ccc;
        margin: auto;
    }

    &::before {
        top: 0;
    }

    &::after {
        bottom: 0;
    }
}


/* ボタン
--------------------------------------------------------------- */

/* - 選択ボタン */
.button-bulkcheck {
    box-sizing: border-box;
    position: relative;
    display: grid;
    grid-template-columns: 11px auto;
    justify-content: center;
    align-items: center;
    gap: .375em;
    width: 100%;
    text-align: left;
    font-size: var(--font-size-base);
    background: #fff;
    border: 1px solid #666;
    border-radius: 0;
    box-shadow: none;
    padding: .625em 0;
    margin: 0;
    cursor: pointer;

    &::before {
        content: "";
        display: block;
        min-width: 0;
        aspect-ratio: 11/8;
        background: url(/image/view/common/icon_arrow_bottom.svg) center center / contain no-repeat;
    }
}


/* - ボタンベーススタイル */
.button-1 {
    display: grid;
    align-items: center;
    width: fit-content;
    color: var(--color-main);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--color-main);
    border-radius: 100vmax;
    line-height: 1.8;
    cursor: pointer;

    /* -- 通常リンク */
    &.button-1--more {
        grid-template-columns: minmax(0, 1fr) 1em;
        gap: .5em;
        font-size: 14px;
        padding: .2em 1em;

        &::after {
            content: "";
            display: block;
            min-width: 0;
            aspect-ratio: 1/1;
            mask: url(/image/view/common/icon_circle_arrow.svg) center center / contain no-repeat;
            background-color: var(--color-main);
        }
    }

    /* -- マイリスト登録 */
    &.button-1--bookmark {
        grid-template-columns: 1em minmax(0, 1fr);
        gap: .2em;
        font-size: 14px;
        padding: .2em 1em;

        &::before {
            content: "";
            display: block;
            min-width: 0;
            aspect-ratio: 1/1;
            mask: url(/image/view/common/icon_bookmark.svg) center center / contain no-repeat;
            background-color: var(--color-main);
        }

        &.is-active {
            background-color: #ECF3F8;
            cursor: default;

            &::before {
                mask-image: url(/image/view/common/icon_bookmark_active.svg);
            }
        }
    }

    /* -- 戻る系 */
    &.button-1--back {
        grid-template-columns: 1em minmax(0, 1fr);
        gap: .5em;
        font-size: 14px;
        padding: .2em 1em;

        &::before {
            content: "";
            display: block;
            min-width: 0;
            aspect-ratio: 1/1;
            mask: url(/image/view/common/icon_circle_arrow.svg) center center / contain no-repeat;
            background-color: var(--color-main);
            transform: scale(-1, 1);
        }
    }

    /* -- サイズ変更 */
    &.button-1--medium {
        font-size: 16px;
        padding: .6em 1.9em;
    }
}


/* - シェアボタン */
.button-share {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: .8em;
    width: fit-content;
    min-width: 160px;
    min-height: 2.85em;
    color: #fff;
    font-size: 14px;
    text-decoration: none;
    padding: 0 1.4em;
    border-radius: 6px;

    &::before {
        content: "";
        display: block;
        min-width: 0;
        mask: center center / contain no-repeat;
        background-color: #fff;
        margin-left: auto;
    }

    &.button-share--mail {
        background-color: #007cd8;

        &::before {
            height: 1.3em;
            aspect-ratio: 24/18;
            mask-image: url(/image/view/common/icon_mail.svg);
        }
    }

    &.button-share--line {
        background-color: #02b902;

        &::before {
            height: 1.5em;
            aspect-ratio: 1/1;
            mask-image: url(/image/view/common/iconSNS_line.svg);
        }
    }
}


/* - ダウンロードボタン */
.button-download {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    align-items: center;
    gap: .5em;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    background: var(--color-main);
    border: 0;
    border-radius: 0;
    padding: 1em 1.31em;
    line-height: 1.8;
    cursor: pointer;

    &::before {
        content: "";
        display: block;
        width: 1.31em;
        min-width: 0;
        aspect-ratio: 1/1;
        mask: url(/image/view/common/icon_download.svg) center center / contain no-repeat;
        background-color: #fff;
    }

    &:disabled {
        opacity: .4;
        cursor: default;
    }
}


/* フォーム系部品
--------------------------------------------------------------- */

/* - ラベル */
.form-checkbox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5em;
    cursor: pointer;
}

/* - チェックボックス */
.form-parts-checkbox {
    min-width: 0;
    width: 30px;
    aspect-ratio: 1/1;
    border-radius: 5px;
    cursor: pointer;
}

/* - セレクト（並べ替え） */
.sort-form {
    --font-size: 14px;
    position: relative;
    width: fit-content;
    font-size: var(--font-size);
    line-height: 1;
    overflow: hidden;

    .form-select {
        -webkit-appearance: none;
        appearance: none;
        box-sizing: border-box;
        color: #fff;
        min-width: 10.7em;
        font-size: var(--font-size);
        padding: .6em calc(.6em * 4) .6em .6em;
        background: #4d4d4d;
        cursor: pointer;
    }

    &::after {
        content: "";
        position: absolute;
        top: 0;
        right: 1em;
        bottom: 0;
        display: block;
        min-width: 0;
        width: .78em;
        aspect-ratio: 11 / 8;
        mask: url(/image/view/common/icon_arrow_bottom.svg) center center / contain no-repeat;
        background-color: #fff;
        pointer-events: none;
        margin: auto;
    }
}


/* タブ
--------------------------------------------------------------- */

.tab-list {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 2px;
    border-bottom: 1px solid var(--color-main);

    & li {
        display: grid;
        place-content: center;
        color: #fff;
        font-size: 18px;
        padding: .5em 1.8em;
        background: var(--color-main);
    }
}


/* 製品サムネイル
--------------------------------------------------------------- */

.thumbnail-product-image {
    box-sizing: border-box;
    place-content: center;
    min-width: 0;
    max-width: 540px;
    aspect-ratio: 1/1;
    background: #fff;
    border: 1px solid #ccc;

    & img {
        display: block;
        max-height: calc(100% - 10px);
        max-width: calc(100% - 10px);
        margin: auto;
        object-fit: contain;
    }

    &.thumbnail-product-image--rectangle {
        aspect-ratio: 535/250;
    }
}


/* テキスト
--------------------------------------------------------------- */

.element-caption {
    font-size: .875em;
}


/* 区切り線
--------------------------------------------------------------- */

.separate-dash {
    display: block;
    border: 0;
    padding: 0;
    border-top: 1px dashed #666666;
    margin: 3.12em 0;
    line-height: 1;
}


/* モーダル用 ルーペアイコン
--------------------------------------------------------------- */

.js-image-modal {
    position: relative;
    display: block;

    &::after {
        content: "";
        position: absolute;
        right: 15px;
        bottom: 15px;
        display: block;
        width: 30px;
        min-width: 0;
        aspect-ratio: 1/1;
        mask: url(/image/view/common/icon_zoom.svg) center center / contain no-repeat;
        background-color: #999;
    }
}



/* モジュール - カテゴリーリスト
--------------------------------------------------------------- */

.category-list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 40px 25px;

    &>li {
        min-width: 0;
    }

    .category-list__link {
        display: block;
        color: var(--color-default);
        text-decoration: none;
        padding: 0;
        border: 0;
        margin: 0;
        background: none;
        line-height: 1.4;
        cursor: pointer;

        & li {
            position: relative;
            z-index: 1;
        }

        & p {
            margin-top: .5em;
        }
    }
}

/* - 小カテゴリ パネル印 */
.category-list__children-arrow {
    display: block;
    width: 30px;
    aspect-ratio: 30 / 15;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    background: var(--color-back-grey);
    margin: 0 auto -1px;
}

/* - 小カテゴリ パネル */
.category-list__children-panel {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 2;
}

/* - 小カテゴリ パネル 閉じるボタン */
.category-list__children-close {
    position: absolute;
    top: 25px;
    right: 25px;
    border: 0;
    width: 30px;
    min-width: 0;
    aspect-ratio: 1/1;
    background: none;
    cursor: pointer;
    z-index: 1;
}

/* - 小カテゴリ */
.category-list__children {
    box-sizing: border-box;
    padding: 25px;
    background: var(--color-back-grey);

    .category-list {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .thumbnail-product-image {
        border: 0;
    }

    & p {
        font-size: .875em;
    }
}

/* - 小カテゴリ 初期値 */
.category-list__children-arrow,
.category-list__children-panel {
    opacity: 0;
    visibility: hidden;
    transition: .2s;

    &.is-open {
        opacity: 1;
        visibility: visible;
    }
}


/* モジュール - 選択済みカテゴリ
--------------------------------------------------------------- */

.selected-category {
    display: grid;
    grid-template-columns: 150px 150px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--color-main);
    line-height: 1.4;

    .selected-category__heading {
        display: grid;
        place-content: center;
        width: 100%;
        height: 100%;
        color: #fff;
        font-weight: 700;
        text-align: center;
        background: var(--color-main);
    }

    .thumbnail-product-image {
        border: 0;
    }

    .selected-category__body {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 1em;
    }

    .selected-category__name {
        font-size: 1.5em;
        font-weight: 700;
    }
}


/* ページヘッター - 戻るボタン領域
--------------------------------------------------------------- */

.action-backbutton-area {
    margin-bottom: 120px;
}


/* ページフッター - ボタン領域
--------------------------------------------------------------- */

.action-button-area {
    display: grid;
    place-content: center;
    padding-block: 50px;
}


/* ページャー
--------------------------------------------------------------- */

.pager-wrapper {
    border-top: 1px dashed #666666;
    padding-top: 70px;
}

.pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 1.25em;

    & a,
    .pager__current {
        box-sizing: border-box;
        display: grid;
        place-content: center;
        width: 2em;
        min-width: 0;
        aspect-ratio: 40/50;
        font-size: 20px;
        font-weight: 700;
        text-decoration: none;
        border: 1px solid var(--color-main);
        line-height: 1;
    }

    .pager__current {
        color: #fff;
        background: var(--color-main);
    }


    @media (any-hover: hover) {
        & a:hover {
            opacity: 1 !important;
            color: #fff;
            background: var(--color-main);
        }
    }
}


/* アイコン
--------------------------------------------------------------- */

.icon {
    display: block;
    min-width: 0;
    mask: center center / contain no-repeat;
    background: #333;

    &.icon--kanafuji {
        aspect-ratio: 32/21;
        mask-image: url(/image/view/common/icon_kanafuji.svg);
    }

    &.icon--activity {
        aspect-ratio: 136/35;
        mask-image: url(/image/view/common/commonLink_icon_01.svg);
    }

    &.icon--network {
        aspect-ratio: 49/46;
        mask-image: url(/image/view/common/commonLink_icon_02.svg);
    }

    &.icon--qa {
        aspect-ratio: 58/43;
        mask-image: url(/image/view/common/commonLink_icon_03.svg);
    }

    &.icon--recruit {
        aspect-ratio: 58/48;
        mask-image: url(/image/view/common/commonLink_icon_04.svg);
    }
}


/* 以下、SP 414pxベース
--------------------------------------------------------------- */

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

    /* SP ぱんくず
    --------------------------------------------------------------- */

    .breadcrumbs {
        font-size: 3.38vw;
    }


    /* SP 見出し
    --------------------------------------------------------------- */

    /* - SP 見出し 1 */
    .heading-1 {
        font-size: 6.28vw;
        margin: 0 auto 1.25em;

        &::after {
            width: 9.66vw;
            margin: 3.14vw auto 0;
        }
    }

    /* - SP 見出し 2 */
    .heading-2 {
        --color: var(--color-default);
        font-size: 4.83vw;
        margin-bottom: 1.25em;

        &::after {
            width: 11.59vw;
            margin-top: 2.42vw;
        }

        &.heading-2--circle-arrow {
            grid-template-columns: 4.83vw minmax(0, 1fr);
            gap: 0 1.45vw;

            &::before {
                margin-top: .23em;
            }
        }
    }

    a {

        .heading-2 {
            grid-template-columns: 4.83vw minmax(0, 1fr);
            gap: 0 1.45vw;

            &::before {
                margin-top: .23em;
            }
        }
    }

    /* - SP 見出し 3 */
    .category-title-header {
        box-sizing: border-box;
        height: auto;
        min-height: 24.15vw;
        padding-block: 2.42vw;
        background: var(--color-back-grey) var(--background-url) right bottom / cover no-repeat;
    }

    .heading-3 {
        grid-template-columns: 5.80vw minmax(0, 1fr);
        font-size: 6.76vw;
    }

    /* - SP 見出し 4 */
    .heading-4 {
        font-size: 4.83vw;
    }


    /* SP 製品系パーツ
    --------------------------------------------------------------- */

    /* SP アイテムグループ - 見出し */
    .item-group-heading {

        .item-group-heading__group {
            font-size: .875em;
        }

        .item-group-heading__name {
            font-size: 4.83vw;
        }
    }


    /* SP テーブル
    --------------------------------------------------------------- */

    /* - SP テーブル 1 */
    .table-1 {

        & th,
        & td {
            font-size: 3.38vw;
            padding: .6em .8em;
            line-height: 1.5;
        }

        .th--model-number {
            width: 8em;
        }

        .th--cad,
        .th--drawing {
            width: 5em;
        }
    }

    /* - SP テーブル 2 */
    .table-2 {

        & th,
        & td {
            font-size: 3.38vw;
            line-height: 1.5;
        }
    }


    /* SP テーブル用コンテナ (キャプション付き)
    --------------------------------------------------------------- */

    /* - SP テーブル用 コンテナ 2 */
    .table-checker-header {

        font-size: 3.38vw;

        .cell-button {
            padding-inline: 1.21vw;
        }

        .cell-text {
            display: none;
        }
    }

    /* - SP テーブル用 スクロールコンテナ */
    .table-scroll {
        max-height: 10em;

        .table-scroll__inner {
            max-height: 10em;
        }

        .table-1 {
            width: 154.59vw;
            min-width: 100%;
        }
    }


    /* SP ボタン
    --------------------------------------------------------------- */

    /* - SP 選択ボタン */
    .button-bulkcheck {
        grid-template-columns: 2.66vw auto;
        font-size: 3.38vw;
    }


    /* - SP ボタンベーススタイル */
    .button-1 {

        /* -- SP 通常リンク */
        &.button-1--more {
            font-size: 3.38vw;
        }

        /* -- SP マイリスト登録 */
        &.button-1--bookmark {
            font-size: 3.38vw;
        }

        /* -- SP 戻る系 */
        &.button-1--back {
            font-size: 3.38vw;
        }

        /* -- SP サイズ変更 */
        &.button-1--medium {
            font-size: 3.86vw;
        }
    }


    /* - SP シェアボタン */
    .button-share {
        min-width: 38.65vw;
        font-size: 3.38vw;
        border-radius: 1.45vw;
    }


    /* - SP ダウンロードボタン */
    .button-download {
        gap: .5em;
        font-size: 3.38vw;
        padding: 1em;
        line-height: 1.5;
    }


    /* SP フォーム系部品
    --------------------------------------------------------------- */

    /* - SP チェックボックス */
    .form-parts-checkbox {
        width: 5.80vw;
        border-radius: 1.21vw;
    }

    /* - SP セレクト（並べ替え） */
    .sort-form {
        --font-size: 3.38vw;
    }


    /* SP タブ
    --------------------------------------------------------------- */

    .tab-list {
        gap: .48vw;

        & li {
            font-size: 3.38vw;
            padding: .5em 1em;
        }
    }


    /* SP 製品サムネイル
    --------------------------------------------------------------- */

    .thumbnail-product-image {
        max-width: none;

        & img {
            max-height: calc(100% - 1.21vw);
            max-width: calc(100% - 1.21vw);
        }

        &.thumbnail-product-image--rectangle {
            aspect-ratio: 16/10;
        }

    }


    /* SP 区切り線
    --------------------------------------------------------------- */

    .separate-dash {
        margin: 7.25vw 0;
    }


    /* SP モーダル用 ルーペアイコン
    --------------------------------------------------------------- */

    .js-image-modal {
        &::after {
            right: 2.42vw;
            bottom: 2.42vw;
            width: 4.83vw;
        }
    }


    /* SP モジュール - カテゴリーリスト
    --------------------------------------------------------------- */

    .category-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7.25vw 4.83vw;
    }

    /* - SP 小カテゴリ パネル印 */
    .category-list__children-arrow {
        width: 7.25vw;
    }


    /* - SP 小カテゴリ パネル 閉じるボタン */
    .category-list__children-close {
        top: 6.04vw;
        right: 3.62vw;
        width: 5.80vw;
    }

    /* - SP 小カテゴリ */
    .category-list__children {
        padding: 6.04vw 3.62vw;

        .category-list {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 4.83vw 3.62vw;
        }
    }


    /* SP モジュール - 選択済みカテゴリ
    --------------------------------------------------------------- */

    .selected-category {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;

        .selected-category__heading {
            box-sizing: border-box;
            height: auto;
            padding: .5em;

            & br {
                display: none;
            }
        }

        .selected-category__body {
            display: block;
            font-size: 3.38vw;
            padding: 3.62vw;

            .button-1--back {
                margin-inline: auto;
                margin-top: 1em;
            }

        }

        .selected-category__name {
            font-size: 1.5em;
            margin: .2em 0;
        }
    }


    /* SP ページヘッター - 戻るボタン領域
    --------------------------------------------------------------- */

    .action-backbutton-area {
        display: grid;
        place-content: center;
        margin-bottom: 14.49vw;
    }


    /* SP ページフッター - ボタン領域
    --------------------------------------------------------------- */

    .action-button-area {
        padding-block: 7.25vw;
    }


    /* SP ページャー
    --------------------------------------------------------------- */

    .pager-wrapper {
        padding-top: 9.66vw;
    }

    .pager {
        gap: 2.42vw;

        & a,
        .pager__current {
            width: 2em;
            font-size: 3.86vw;
        }
    }


}



/* 以下、プリント
--------------------------------------------------------------- */

@media print {}