/**
 * HIDESIGN | PATENTS
 * 固定ページ /patents/ 専用
 * 会社概要・NEWS等のCSSに干渉しないよう、すべて .patents- で限定しています。
 */

.patents-page,
.patents-page * {
    box-sizing: border-box;
}

.patents-page {
    /* WordPressの本文カラム幅に制限されても、ページ幅いっぱいに表示 */
    width: 100vw;
    max-width: none !important;
    margin: 0 0 0 calc(50% - 50vw) !important;
    padding: 0;
    background: #f3f3f3;
    color: #202020;
    font-family: inherit;
}

.patents-page__inner {
    width: 87.5%;
    margin: 0 auto;
    padding: 45px 0 63px;
}

/* テーマ側が固定ページのタイトルを別に出す場合、二重表示を防ぐ */
body.page .wp-block-post-title {
    display: none;
}

/*
 * Twenty Twenty-Five の固定ページテンプレートが本文の外側に設ける上余白を解除。
 * PATENTS を含むテンプレートのラッパーだけを対象にするため、
 * WORKS / COLLECTION / NEWS や他の固定ページには影響しない。
 * :has() は現行 Chrome / Safari / Firefox で対応。
 */
body.page:has(.patents-page) .wp-site-blocks .wp-block-group:has(.patents-page),
body.page:has(.patents-page) .wp-site-blocks .wp-block-post-content:has(.patents-page) {
    margin-block-start: 0 !important;
    padding-block-start: 0 !important;
}

/* 外側の main が wp-block-group ではないテンプレートにも対応 */
body.page:has(.patents-page) .wp-site-blocks main:has(.patents-page):not(.patents-page) {
    margin-block-start: 0 !important;
    padding-block-start: 0 !important;
}

/* ページタイトル */
.patents-page__header {
    margin: 0;
    padding: 0;
}

.patents-page__title {
    margin: 0 !important;
    padding: 0;
    font-size: 32px;
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: 0.015em;
}

.patents-page__subtitle {
    margin: 9px 0 0 !important;
    padding: 0;
    font-size: 11px;
    line-height: 1.65;
    font-weight: 400;
    letter-spacing: 0.07em;
}

/* 中央の特許一覧 */
.patents-page__groups {
    width: 60%;
    margin: 24px auto 0;
}

.patents-group {
    margin: 0;
    padding: 0;
}

.patents-group + .patents-group {
    margin-top: 28px;
}

.patents-group__heading {
    margin: 0 !important;
    padding: 0 14px 9px;
    border-bottom: 2px solid #c6c6c6;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 0.06em;
    font-weight: 500;
}

.patents-group__list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.patents-item {
    display: grid;
    grid-template-columns: 21% minmax(0, 1fr);
    column-gap: 3.5%;
    align-items: center;
    min-height: 64px;
    margin: 0;
    padding: 12px 6.8%;
    border-bottom: 1px solid #cdcdcd;
}

.patents-item__number {
    display: block;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: 0.065em;
    overflow-wrap: anywhere;
}

.patents-item__details {
    min-width: 0;
}

.patents-item__description,
.patents-item__name {
    margin: 0 !important;
    padding: 0;
    font-size: 11px;
    line-height: 1.65;
    letter-spacing: 0.045em;
    overflow-wrap: anywhere;
}

.patents-item__name {
    margin-top: 3px !important;
    font-size: 12px;
    font-weight: 600;
}

.patents-page__empty {
    margin: 0 !important;
    padding: 18px 14px;
    font-size: 12px;
}

@media (max-width: 900px) {
    .patents-page__groups {
        width: 76%;
    }
}

@media (max-width: 600px) {
    .patents-page__inner {
        width: calc(100% - 40px);
        padding: 38px 0 60px;
    }

    .patents-page__title {
        font-size: 30px;
    }

    .patents-page__groups {
        width: 100%;
        margin-top: 31px;
    }

    .patents-group + .patents-group {
        margin-top: 27px;
    }

    .patents-item {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 6px;
        padding: 14px 14px 15px;
    }

    .patents-item__number {
        font-size: 10px;
    }

    .patents-item__description,
    .patents-item__name {
        font-size: 11px;
    }
}

/* =====================================================
 * PATENTS：テンプレート下部の白い余白と横方向のはみ出しを調整
 * ===================================================== */

/*
 * 固定ページテンプレート側に残る下余白もPATENTSの背景色に合わせる。
 * PATENTSを含むラッパーだけに適用し、他ページは変更しない。
 */
body.page:has(.patents-page) .wp-site-blocks > main:has(.patents-page),
body.page:has(.patents-page) .wp-site-blocks .wp-block-post-content:has(.patents-page),
body.page:has(.patents-page) .wp-site-blocks main .wp-block-group:has(.patents-page) {
    background-color: #f3f3f3 !important;
}

/*
 * .patents-page の100vwがスクロールバー分だけ横にはみ出す場合、
 * 横スクロールを発生させない。
 */
body.page:has(.patents-page) {
    overflow-x: clip;
}

/*
 * PATENTSページだけフッター背景を画面端まで広げ、
 * 右端に見えていた白い細い帯をなくす。
 * 既存のフッター内側のレイアウト・他ページには干渉しない。
 */
body.page:has(.patents-page) .wp-site-blocks > footer,
body.page:has(.patents-page) footer.wp-block-template-part {
    width: 100vw !important;
    max-width: none !important;
}