/* ===================================
 * service6: 私たちについて（2026-05-20 新デザイン）
 *
 * ターゲット: 60代女性
 * トーン: 落ち着いた信頼感、押し売り感なし
 * 基本: 全セクション白背景、緑基調、余白広め、文字大きめ、行間広め
 * =================================== */

/* ===================================
 * 共通設定
 * =================================== */
.p-about {
    /* 文字緑とrequestボタン用の深緑 */
    --about-text-green: #1c863c;
    /* オレンジ（緑と対の強調色。サイト共通の主要オレンジ） */
    --about-text-orange: #ea7613;
    /* オレンジ（実線枠用。text-orange より少し落ち着いた色） */
    --about-border-orange: #d37c2d;
    /* オレンジ（点線用。実線よりさらに暗く控えめ） */
    --about-dashed-orange: #c88018;
    /* 枠線・区切り線用 */
    --about-border: #c9d6a8;
    /* マーカー（テキスト下線ハイライト）・装飾画像色 */
    --about-mark: #f2be88;
    /* デザインデータの「クリーム」 */
    --about-bg-cream: #fefff9;
    /* デザインデータの「薄緑」（クリームよりほんの少し緑寄り） */
    --about-bg-pale-green: #fefcf0;
    /* 外枠の太さ（PC: 5px / SP: 3px） */
    --about-border-width: 5px;
    /* セクション左右padding（1024px時=30px相当、1920px時=80pxまでスケール） */
    --about-padding-inline: clamp(15px, calc(5vw - 21px), 80px);
    background-color: var(--service-color-white);
    color: var(--service-color-text);
}

@media (max-width: 768px) {
    .p-about {
        --about-border-width: 3px;
    }
}

:where(.p-about) p {
    line-height: 1.9;
    margin: 0;
}

:where(.p-about) h2,
:where(.p-about) h3,
:where(.p-about) h4 {
    line-height: 1.5;
    margin: 0;
}

:where(.p-about) ul {
    list-style: none;
    margin: 0;
}

.p-about a {
    color: inherit;
}

/* aboutページタイトルヘッダーは白背景・黒文字 */
body.page-about .p-service-header,
body.page-about .p-service-header .page-title--service {
    background: var(--service-color-white);
}

body.page-about .p-service-header .page-title__container {
    padding-block-end: 0;
}

body.page-about .p-service-header .page-title__text,
body.page-about .p-service-header .breadcrumb,
body.page-about .p-service-header .breadcrumb a {
    color: var(--service-color-text);
}

/* セクション共通 */
.p-about > section {
    background-color: var(--service-color-white);
}

/* 共通リード文（タイトル直下の大きめ強調テキスト） */
.p-about-lead {
    text-align: center;
    font-size: clamp(24px, calc(1.04vw + 16px), 36px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.7;
    margin-bottom: clamp(32px, calc(1.74vw + 18.6px), 56px);
}

@media (max-width: 768px) {
    .p-about-lead {
        font-size: clamp(20px, calc(1.91vw + 13.3px), 28px);
    }
}

.p-about-hero__inner,
.p-about-trust__inner,
.p-about-media__inner,
.p-about-books__inner,
.p-about-mission__inner,
.p-about-decade__inner,
.p-about-profile__inner,
.p-about-founding__inner,
.p-about-social__inner,
.p-about-company__inner,
.p-about-closing__inner {
    max-width: calc(1240px + var(--about-padding-inline) * 2);
    margin-inline: auto;
    padding-inline: var(--about-padding-inline);
    padding-block: clamp(48px, calc(4.17vw + 15.93px), 96px);
}

/* セクション1・2 のみ少し狭め */
.p-about-hero__inner,
.p-about-trust__inner {
    max-width: calc(1100px + var(--about-padding-inline) * 2);
}


/* ===================================
 * セクション区切り装飾画像
 * tpl-request の .p-request-books__divider-img と同じサイズ感
 * （最大1460pxの内側幅に対して20%、SPは50%）
 * =================================== */
.p-about-divider {
    text-align: center;
    padding-inline: max(var(--margin--use--outside), calc(50vw - 730px));
    margin-block: clamp(-40px, calc(-1.74vw - 6.63px), -20px);
}

.p-about-divider img {
    display: none;
}

.p-about-divider::before {
    content: "";
    display: inline-block;
    width: 20%;
    aspect-ratio: 1811 / 262;
    background-color: var(--about-mark);
    -webkit-mask: url('../../../images/request/reefhr.png') center / contain no-repeat;
            mask: url('../../../images/request/reefhr.png') center / contain no-repeat;
}

@media (max-width: 768px) {
    .p-about-divider {
        margin-block: clamp(-32px, calc(-0.96vw - 24.65px), -28px);
    }
    .p-about-divider::before {
        width: clamp(175px, calc(17.94vw + 112.21px), 250px);
    }
}


/* ===================================
 * セクション1: ヒーロー
 * =================================== */
.p-about-hero__inner {
    text-align: center;
    padding-block-start: 16px;
    padding-block-end: clamp(16px, calc(1.74vw + 2.6px), 32px);
}

.p-about-hero__title {
    font-size: clamp(30px, calc(2.09vw + 14px), 54px);
    font-weight: 700;
    color: var(--service-color-text);
    margin-bottom: clamp(28px, calc(1.74vw + 14.6px), 48px);
    letter-spacing: 0.08em;
}

.p-about-hero__list {
    padding: clamp(6px, calc(0.52vw + 2px), 12px) clamp(28px, calc(2.09vw + 12px), 52px);
    background-color: var(--about-bg-cream);
    border: 3px solid var(--about-border-orange);
    border-radius: 20px;
}

.p-about-hero__item {
    display: grid;
    grid-template-columns: clamp(60px, calc(1.74vw + 46.63px), 80px) 1fr;
    gap: clamp(24px, calc(2.43vw + 5.3px), 52px);
    align-items: center;
    padding: clamp(12px, calc(0.52vw + 7.99px), 18px) 0 clamp(12px, calc(0.52vw + 7.99px), 18px) clamp(12px, calc(1.39vw + 1.3px), 28px);
    text-align: left;
}

.p-about-hero__item + .p-about-hero__item {
    border-top: 1px dashed var(--about-dashed-orange);
}

.p-about-hero__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
}

.p-about-hero__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.p-about-hero__text {
    font-size: clamp(20px, calc(0.7vw + 14.7px), 28px);
    font-weight: 500;
    line-height: 1.7;
}

.p-about-hero__mark {
    background: linear-gradient(transparent 60%, color-mix(in srgb, var(--about-mark) 70%, transparent) 60%);
    color: var(--service-color-text);
    font-weight: 700;
    padding: 0 0.1em;
}

@media (max-width: 768px) {
    .p-about-hero__title {
        font-size: clamp(28px, calc(2.39vw + 19.6px), 38px);
        margin-bottom: 24px;
        letter-spacing: 0.06em;
    }
    .p-about-hero__list {
        padding: clamp(6px, calc(1.44vw + 1px), 12px) clamp(20px, calc(1.91vw + 13.3px), 32px);
        border-width: 2px;
        max-width: 480px;
        margin-inline: auto;
    }
    .p-about-hero__item {
        grid-template-columns: 1fr;
        gap: 4px;
        text-align: center;
        padding-block: clamp(11px, calc(0.72vw + 8.49px), 14px) clamp(14px, calc(0.96vw + 10.65px), 18px);
    }
    .p-about-hero__icon {
        width: 52px;
        height: 52px;
        margin-inline: auto;
    }
    .p-about-hero__text {
        font-size: clamp(17px, calc(0.96vw + 13.6px), 21px);
        line-height: 1.7;
    }
}


/* ===================================
 * スタッフ写真
 * =================================== */
.p-about-us-photo {
    max-width: calc(640px + var(--about-padding-inline) * 2);
    margin-inline: auto;
    padding-inline: var(--about-padding-inline);
}

.p-about-us-photo img {
    width: 100%;
    height: auto;
    display: block;
}

.p-about-us-photo__caption {
    line-height: 1.6;
    text-align: center;
    font-size: clamp(18px, calc(0.52vw + 14px), 24px);
    color: var(--service-color-text);
    padding-block: 6px clamp(24px, calc(1.74vw + 10.6px), 40px);
}

@media (max-width: 768px) {
    .p-about-us-photo__caption {
        font-size: clamp(14px, calc(0.96vw + 10.6px), 18px);
        padding-block-end: clamp(36px, calc(2.87vw + 25.25px), 48px);
    }
}


/* ===================================
 * セクション2: 安心してご利用いただくために
 * =================================== */
.p-about-trust__title {
    text-align: center;
    color: var(--about-text-green);
}

.p-about-trust__list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: clamp(32px, calc(3.13vw + 8px), 80px);
    row-gap: 0;
    margin-inline: auto;
    padding: clamp(10px, calc(0.69vw + 4.7px), 18px) clamp(28px, calc(2.08vw + 12px), 60px);
    background-color: var(--about-bg-pale-green);
    border: 3px solid var(--about-border);
    border-radius: 16px;
}

/* PC: 2×2グリッドの中央に通しの破線 */
@media (min-width: 769px) {
    .p-about-trust__list::after {
        content: "";
        position: absolute;
        left: clamp(28px, calc(2.08vw + 12px), 60px);
        right: clamp(28px, calc(2.08vw + 12px), 60px);
        top: 50%;
        border-top: 1px dashed var(--about-border);
    }
}

.p-about-trust__item {
    display: flex;
    align-items: center;
    gap: clamp(18px, calc(0.69vw + 13px), 26px);
    padding: clamp(7px, calc(0.35vw + 4.3px), 11px) clamp(12px, calc(0.69vw + 6.7px), 20px);
    font-size: clamp(18px, calc(0.52vw + 14px), 24px);
    font-weight: 600;
    line-height: 1.6;
}


.p-about-trust__item::before {
    content: "";
    flex-shrink: 0;
    width: 1.15em;
    height: 1.15em;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='12' fill='%231c863c'/><path d='M6 12.5l4 4 8-8' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
}

@media (max-width: 768px) {
    .p-about-trust__title {
        font-size: clamp(21px, calc(2.15vw + 13.5px), 30px);
        font-weight: 800;
    }
    .p-about-trust__list {
        grid-template-columns: auto auto;
        justify-content: center;
        column-gap: 14px;
        padding: 9px clamp(4px, calc(5.74vw - 16.1px), 28px) 16px;
        border-width: 2.5px;
        max-width: 480px;
        margin-inline: auto;
    }
    .p-about-trust__item {
        display: grid;
        grid-template-columns: subgrid;
        grid-column: 1 / -1;
        align-items: center;
        font-size: clamp(17px, calc(0.72vw + 14.5px), 20px);
        font-weight: 500;
        padding-inline: clamp(12px, calc(2.39vw + 3.6px), 22px);
        border-bottom: 1px dashed var(--about-border);
    }
}


/* ===================================
 * セクション3: NHK・新聞などで紹介されました
 * =================================== */
.p-about-media__title {
    text-align: center;
    color: var(--about-text-green);
}

.p-about-media__layout {
    display: grid;
    gap: clamp(16px, calc(0.69vw + 10.7px), 24px);
}

@media (min-width: 769px) {
    .p-about-media__layout {
        grid-template-columns: 1fr 1.2fr;
        grid-template-areas:
            "lead1 image"
            "lead2 image"
            "btn   image"
            ".     caption"
            "detail detail";
        column-gap: clamp(28px, calc(2.43vw + 9.3px), 64px);
        row-gap: clamp(10px, calc(0.52vw + 6px), 16px);
        align-items: start;
    }
    .p-about-media__lead--1 {
        grid-area: lead1;
        padding-top: clamp(12px, calc(0.69vw + 6.7px), 20px);
    }
    .p-about-media__lead--2 { grid-area: lead2; }
    .p-about-media__accordion { grid-area: btn; align-self: end; }
    .p-about-media__accordion-detail { grid-area: detail; }

    /* figure を display:contents で透過させ、img と caption を別グリッドエリアに */
    .p-about-media__figure {
        display: contents;
    }
    .p-about-media__figure img {
        grid-area: image;
        height: 100%;
    }
    .p-about-media__caption {
        grid-area: caption;
    }
}

.p-about-media__lead {
    font-size: clamp(18px, calc(0.69vw + 12.7px), 26px);
    font-weight: 500;
    line-height: 1.8;
}

.p-about-media__figure {
    margin: 0;
}

.p-about-media__figure img {
    width: 100%;
    height: auto;
    aspect-ratio: 3.1 / 2;
    object-fit: cover;
    object-position: center 100%;
    display: block;
}

.p-about-media__caption {
    margin-top: 0;
    text-align: center;
    font-size: clamp(16px, calc(0.35vw + 13.3px), 20px);
    color: var(--service-color-text);
    line-height: 1.7;
}

.p-about-media__accordion {
    width: 90%;
    margin-top: 8px;
}

.p-about-media__accordion-detail {
    margin-top: clamp(24px, calc(1.39vw + 13.3px), 40px);
    padding-inline: clamp(16px, 2.08vw, 40px);
    display: none;
}

.p-about-media__layout:has(.p-about-media__accordion[open]) .p-about-media__accordion-detail {
    display: block;
}

.p-about-media__category {
    padding: 0;
}

.p-about-media__category + .p-about-media__category {
    margin-top: clamp(24px, calc(1.39vw + 13.3px), 40px);
}

.p-about-media__category-title {
    font-size: clamp(18px, calc(0.69vw + 12.7px), 26px);
    font-weight: 700;
    color: var(--service-color-text);
    margin-bottom: clamp(12px, calc(0.35vw + 9.3px), 16px);
}

.p-about-media__category-title::before {
    content: "■ ";
    color: var(--about-text-orange);
}

/* common.css の p+p margin-block-start を無効化（1番目だけ余白なしになる問題を回避） */
.p-about-media__category-body--tv > p + p,
.p-about-media__category-body--newspaper > p + p {
    margin-block-start: 0;
}

/* TVカテゴリ: grid 2列+column-flow、行下に通しの dashed セパレーター */
.p-about-media__category-body--tv {
    --tv-col-gap: clamp(20px, calc(1.04vw + 12px), 48px);
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(5, auto);
    grid-auto-flow: column;
    column-gap: var(--tv-col-gap);
    row-gap: 0;
    align-items: start;
    padding-top: clamp(6px, calc(0.17vw + 4.7px), 8px);
}

.p-about-media__category-body--tv > p {
    position: relative;
    padding-left: 14px;
    padding-bottom: clamp(9px, calc(0.26vw + 7px), 12px);
    margin-bottom: clamp(9px, calc(0.26vw + 7px), 12px);
    border-bottom: 1px dashed var(--about-dashed-orange);
    font-size: clamp(15px, calc(0.61vw + 10.3px), 22px);
    line-height: 1.6;
}

.p-about-media__category-body--tv > p::before {
    content: "・";
    position: absolute;
    left: 0;
    top: 0;
}

/* col1の1〜4番目にcolumn-gap分の通しdashedを伸ばして橋渡し（5番目=最下段は線無し） */
.p-about-media__category-body--tv > p:nth-child(-n+4)::after {
    content: "";
    position: absolute;
    left: 100%;
    bottom: -1px;
    width: var(--tv-col-gap);
    border-bottom: 1px dashed var(--about-dashed-orange);
    pointer-events: none;
}

/* col1の最下段（5番目）は border-bottom 無し */
.p-about-media__category-body--tv > p:nth-child(5) {
    border-bottom: none;
}

/* 新聞カテゴリ: 横一列のインライン並び（inline-blockで安定wrap） */
.p-about-media__category-body--newspaper {
    line-height: 1.8;
    padding-top: clamp(4px, calc(0.17vw + 2.7px), 6px);
}

.p-about-media__category-body--newspaper p {
    display: inline-block;
    position: relative;
    padding-left: 14px;
    margin-right: clamp(16px, calc(0.87vw + 9.3px), 24px);
    font-size: clamp(15px, calc(0.61vw + 10.3px), 22px);
    line-height: 1.8;
    vertical-align: top;
}

.p-about-media__category-body--newspaper p::before {
    content: "・";
    position: absolute;
    left: 0;
}

/* 「ほか多数」: 各カテゴリ末尾、右寄せ */
.p-about-media__more {
    text-align: right;
    font-size: clamp(13px, calc(0.17vw + 11.7px), 15px);
}

.p-about-media__category-body--tv .p-about-media__more {
    padding-left: 0;
    margin-bottom: 0;
    border-bottom: none;
}

.p-about-media__category-body--tv .p-about-media__more::before {
    content: none;
}

.p-about-media__category-body--newspaper .p-about-media__more {
    display: block;
    text-align: right;
    padding-left: 0;
    margin-right: 0;
    margin-top: clamp(8px, calc(0.35vw + 5.3px), 12px);
    padding-top: clamp(8px, calc(0.35vw + 5.3px), 12px);
    border-top: 1px dashed var(--about-dashed-orange);
}

.p-about-media__category-body--newspaper .p-about-media__more::before {
    content: none;
}

@media (max-width: 768px) {
    .p-about-media__title {
        font-weight: 800;
    }
    .p-about-media__layout {
        gap: clamp(24px, calc(1.91vw + 17.3px), 32px);
    }
    .p-about-media__lead {
        text-align: center;
        font-weight: 600;
    }
    .p-about-media__lead--1,
    .p-about-media__lead--2 {
        font-size: clamp(18px, calc(1.44vw + 13px), 24px);
    }
    .p-about-media__figure {
        max-width: 500px;
        margin-inline: auto;
    }
    .p-about-media__caption {
        font-size: clamp(14px, calc(1.44vw + 9px), 20px);
        margin-top: clamp(16px, calc(1.91vw + 9.3px), 24px);
    }
    /* SP: アコーディオンを統合フレーム化（PCには影響なし） */
    .p-about-media__accordion {
        width: 100%;
        max-width: 480px;
        margin-inline: auto;
    }
    .p-about-media__accordion > summary {
        max-width: 480px;
    }
    .p-about-media__accordion[open] > summary {
        border-radius: 14px 14px 0 0;
        box-shadow: none;
    }
    .p-about-media__accordion-detail {
        width: 100%;
        max-width: 480px;
        margin-top: calc(-1 * clamp(24px, calc(1.91vw + 17.3px), 32px));
        margin-inline: auto;
        padding: clamp(16px, calc(2.87vw + 5.9px), 28px) clamp(12px, calc(3.83vw - 1.4px), 28px);
        background-color: var(--about-bg-cream);
        border: 2px solid var(--about-border-orange);
        border-top: none;
        border-radius: 0 0 14px 14px;
    }
    .p-about-media__category {
        padding: 0;
    }
    /* SP: テレビ ＋ 新聞 の間に orange 実線を入れる */
    .p-about-media__category + .p-about-media__category {
        margin-top: 12px;
        padding-top: 14px;
        border-top: 1px solid var(--about-border-orange);
    }
    .p-about-media__category-title {
        font-size: clamp(18px, calc(0.96vw + 14.7px), 22px);
        margin-bottom: 6px;
    }
    .p-about-media__category-body--tv > p,
    .p-about-media__category-body--newspaper p {
        font-size: clamp(16px, calc(0.96vw + 12.7px), 20px);
    }

    /* TV: SPは1列、各行下に dashed (橋渡し不要) */
    .p-about-media__category-body--tv {
        display: block;
    }
    .p-about-media__category-body--tv > p:nth-child(-n+4)::after {
        display: none;
    }
    /* SPでは5番目も線あり（PCのみ削除した分を戻す） */
    .p-about-media__category-body--tv > p:nth-child(5) {
        border-bottom: 1px dashed var(--about-dashed-orange);
    }

    /* 新聞: SPは2列 + 1行ごと下線 + 中央を bridge */
    .p-about-media__category-body--newspaper {
        --np-col-gap: clamp(16px, calc(0.87vw + 9.3px), 24px);
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(4, auto) auto;
        grid-auto-flow: column;
        column-gap: var(--np-col-gap);
        row-gap: 0;
        line-height: 1.8;
    }
    .p-about-media__category-body--newspaper > p {
        display: block;
        margin-right: 0;
        padding-bottom: clamp(9px, calc(0.26vw + 7px), 12px);
        margin-bottom: clamp(9px, calc(0.26vw + 7px), 12px);
    }
    /* col1（1〜4番目）: border-bottom + col2方向への bridge */
    .p-about-media__category-body--newspaper > p:nth-child(-n+4) {
        position: relative;
        border-bottom: 1px dashed var(--about-dashed-orange);
    }
    .p-about-media__category-body--newspaper > p:nth-child(-n+4)::after {
        content: "";
        position: absolute;
        left: 100%;
        bottom: -1px;
        width: calc(100% + var(--np-col-gap));
        border-bottom: 1px dashed var(--about-dashed-orange);
        pointer-events: none;
    }
    /* col2（5〜7番目）: 線無し（col1の::afterが覆う） */
    .p-about-media__category-body--newspaper > p:nth-child(n+5):not(.p-about-media__more) {
        border-bottom: none;
    }
    /* ほか多数: 全幅・5行目に配置（border-topは col1 の bridge 線で代替するため無し） */
    .p-about-media__category-body--newspaper .p-about-media__more {
        grid-column: 1 / -1;
        grid-row: 5;
        border-top: none;
        padding-top: 0;
    }

}


/* ===================================
 * セクション4: 出版
 * =================================== */
.p-about-books__title {
    text-align: center;
    color: var(--about-text-green);
}

.p-about-books__lead {
    margin-bottom: clamp(20px, calc(1.39vw + 9.31px), 36px);
}


/* PC: 2カラムグリッド (covers列 + details列)、UL は display:contents で透過
   list の padding-inline で dashed線をコンテンツより少しだけ長く（左右 16-24px 延長） */
.p-about-books__list {
    display: grid;
    grid-template-columns: clamp(100px, calc(2.61vw + 79.96px), 130px) 1fr;
    column-gap: clamp(40px, calc(2.78vw + 18.6px), 72px);
    row-gap: 0;
    max-width: min(1000px, calc(100% - 80px));
    margin: 0 auto clamp(40px, calc(2.08vw + 24px), 64px);
    padding: 0 clamp(24px, calc(2.09vw + 7.97px), 48px);
    list-style: none;
}

.p-about-books__covers,
.p-about-books__details {
    display: contents;
    list-style: none;
    margin: 0;
    padding: 0;
}

.p-about-books__covers > .p-about-books__item,
.p-about-books__details > .p-about-books__item {
    display: flex;
    align-items: center;
    padding-block: clamp(20px, calc(1.04vw + 12px), 32px);
}

.p-about-books__covers > .p-about-books__item { grid-column: 1; }
.p-about-books__details > .p-about-books__item { grid-column: 2; }

.p-about-books__covers > .p-about-books__item:nth-child(1),
.p-about-books__details > .p-about-books__item:nth-child(1) { grid-row: 1; }
.p-about-books__covers > .p-about-books__item:nth-child(2),
.p-about-books__details > .p-about-books__item:nth-child(2) { grid-row: 2; }
.p-about-books__covers > .p-about-books__item:nth-child(3),
.p-about-books__details > .p-about-books__item:nth-child(3) { grid-row: 3; }

/* PC dashed区切り: column-gap でも途切れないよう、リスト全体に擬似要素で row 2/3 上端に通し線
   margin-inline 負値で list の padding-inline 領域も含めた全幅に延長（旧item border-topの幅を再現） */
.p-about-books__list::before,
.p-about-books__list::after {
    content: "";
    grid-column: 1 / -1;
    align-self: start;
    height: 0;
    margin-inline: calc(-1 * clamp(24px, calc(2.09vw + 7.97px), 48px));
    border-top: 1px dashed var(--about-dashed-orange);
}
.p-about-books__list::before { grid-row: 2; }
.p-about-books__list::after { grid-row: 3; }

.p-about-books__cover a {
    display: inline-block;
    transition: opacity 0.3s ease;
}

.p-about-books__cover a:hover {
    opacity: 0.85;
}

.p-about-books__cover img {
    width: 100%;
    height: auto;
    display: block;
}

.p-about-books__subtitle {
    font-size: clamp(17px, calc(0.43vw + 13.7px), 22px);
    font-weight: 700;
    line-height: 1.6;
    margin-top: calc((1em - 1lh) / 2);
    margin-bottom: 6px;
    color: var(--about-text-green);
}

.p-about-books__name {
    font-size: clamp(22px, calc(0.87vw + 15.4px), 32px);
    font-weight: 700;
    line-height: 1.6;
    margin-top: 0;
    margin-bottom: 6px;
}

.p-about-books__meta {
    font-size: clamp(14px, calc(0.35vw + 11.3px), 18px);
    color: var(--service-color-text);
    line-height: 1.6;
    margin-bottom: calc((1em - 1lh) / 2);
}

.p-about-books__guidebooks {
    display: flex;
    align-items: center;
    gap: clamp(20px, calc(1.74vw + 6.6px), 40px);
    padding: clamp(20px, calc(1.04vw + 12px), 32px) clamp(24px, calc(2.78vw + 2.6px), 56px);
    background-color: var(--about-bg-pale-green);
    border: var(--about-border-width) solid var(--about-border);
    border-radius: 32px;
    margin: 0 auto clamp(32px, calc(1.74vw + 18.6px), 56px);
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s;
}

.p-about-books__guidebooks:hover {
    opacity: 0.8;
}

.p-about-books__guidebooks-image {
    flex: 0 0 auto;
    max-width: 38%;
    display: flex;
    align-items: center;
    gap: 4px;
    padding-block: 8px;
    transform: translateY(-14px);
}

.p-about-books__guidebooks-image img {
    width: auto;
    height: auto;
    max-height: clamp(90px, calc(4.69vw + 53.9px), 144px);
    display: block;
}

/* 青本は反時計回りに少しだけ傾ける */
.p-about-books__guidebooks-image img:first-child {
    transform: rotate(-3deg);
    transform-origin: center;
}

/* 赤本は青本に重ねるように左寄せ、下げて時計回りに傾ける */
.p-about-books__guidebooks-image img:last-child {
    margin-left: clamp(-28px, calc(-1.04vw - 8px), -16px);
    transform: translateY(20px) rotate(10deg);
    transform-origin: center;
}

.p-about-books__guidebooks-text {
    flex: 1;
}

.p-about-books__guidebooks-title {
    font-size: clamp(20px, calc(0.87vw + 13.3px), 30px);
    font-weight: 600;
    color: var(--service-color-text);
    line-height: 1.7;
    padding-bottom: clamp(10px, calc(0.35vw + 7.3px), 14px);
    margin-bottom: clamp(10px, calc(0.35vw + 7.3px), 14px);
    border-bottom: 2px dashed var(--about-border);
}

/* 累計100万部 のマーカー（薄緑bg上に乗るため緑系で視認性を保つ） */
.p-about-books__guidebooks-title strong {
    color: var(--service-color-text);
    font-size: 1.2em;
    font-weight: 800;
    background: linear-gradient(transparent 60%, rgba(192, 216, 154, 0.8) 60%);
    padding: 0 0.1em;
}

.p-about-books__guidebooks-desc {
    font-size: clamp(18px, calc(0.87vw + 11.3px), 28px);
    font-weight: 500;
    line-height: 1.8;
}

@media (max-width: 768px) {
    .p-about-books__lead {
        margin-bottom: 24px;
    }
    /* SP: covers と details を別レイアウトに分離
       - covers: 3カラム横並び (1fr 1fr 1fr)
       - details: fit-content(100%) の単一カラム → 3つの中で最長コンテンツ幅に揃う
       PC で :nth-child(N) が grid-row/column を指定しているため、SPも同じspecificityで上書き */
    .p-about-books__list {
        display: flex;
        flex-direction: column;
        gap: clamp(18px, calc(1.91vw + 11.31px), 26px);
        max-width: min(560px, calc(100% - 16px));
        margin: 0 auto clamp(40px, calc(2.08vw + 24px), 64px);
        padding: 0;
    }
    .p-about-books__list::before,
    .p-about-books__list::after {
        display: none;
    }
    .p-about-books__covers {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        column-gap: clamp(8px, calc(1.91vw + 1.3px), 16px);
    }
    .p-about-books__covers > .p-about-books__item:nth-child(1),
    .p-about-books__covers > .p-about-books__item:nth-child(2),
    .p-about-books__covers > .p-about-books__item:nth-child(3) {
        display: block;
        grid-row: 1;
        padding-block: 0;
        border-top: none;
    }
    .p-about-books__covers > .p-about-books__item:nth-child(1) { grid-column: 1; }
    .p-about-books__covers > .p-about-books__item:nth-child(2) { grid-column: 2; }
    .p-about-books__covers > .p-about-books__item:nth-child(3) { grid-column: 3; }

    .p-about-books__details {
        display: grid;
        grid-template-columns: fit-content(100%);
        justify-content: center;
    }
    .p-about-books__details > .p-about-books__item:nth-child(1),
    .p-about-books__details > .p-about-books__item:nth-child(2),
    .p-about-books__details > .p-about-books__item:nth-child(3) {
        display: block;
        grid-column: 1;
        padding-block: clamp(16px, calc(1.91vw + 9.3px), 24px);
        padding-inline: 22px;
    }
    .p-about-books__details > .p-about-books__item:nth-child(2),
    .p-about-books__details > .p-about-books__item:nth-child(3) {
        border-top: 1px dashed var(--about-dashed-orange);
    }
    .p-about-books__subtitle {
        margin-bottom: 3px;
    }
    .p-about-books__name {
        font-size: clamp(18px, calc(1.44vw + 13px), 24px);
        margin-bottom: 3px;
        line-height: 1.4;
    }
    .p-about-books__meta {
        font-size: 12px;
    }
    .p-about-books__guidebooks {
        display: grid;
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "title title"
            "desc image";
        align-items: center;
        max-width: 580px;
        column-gap: 16px;
        row-gap: 0;
        padding: 20px clamp(16px, calc(5.74vw - 4.1px), 40px);
        border-radius: 16px;
    }
    .p-about-books__guidebooks-text {
        display: contents;
    }
    .p-about-books__guidebooks-title {
        grid-area: title;
        font-size: clamp(18px, calc(2.87vw + 8px), 30px);
        padding-bottom: clamp(10px, calc(2.39vw + 1.6px), 20px);
        margin-bottom: clamp(10px, calc(2.39vw + 1.6px), 20px);
        border-bottom-width: 1px;
    }
    .p-about-books__guidebooks-desc {
        grid-area: desc;
        font-size: clamp(12px, calc(3.35vw + 0.3px), 26px);
        margin-top: 0;
    }
    .p-about-books__guidebooks-image {
        grid-area: image;
        justify-self: end;
        max-width: 100%;
        padding-block: 0;
        transform: none;
    }
    .p-about-books__guidebooks-image img {
        max-height: clamp(80px, calc(2.39vw + 71.6px), 100px);
    }
    .p-about-books__guidebooks-image img:last-child {
        margin-left: -10px;
        transform: translateY(8px) rotate(8deg);
    }
}

/* ===================================
 * 共通: about 用 CTA ブロック（2本セット）
 * PC: 横並び / SP: 縦並び
 * =================================== */
.p-about-cta {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: clamp(20px, calc(2.43vw + 1.3px), 48px);
    max-width: min(1000px, calc(100% - 80px));
    margin: 0 auto;
}

.p-about-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex: 0 1 calc(50% - 24px);
    max-width: 460px;
    min-height: clamp(68px, calc(1.56vw + 56px), 86px);
    padding: 14px 24px;
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    font-size: clamp(18px, calc(0.87vw + 11.3px), 28px);
    font-weight: 700;
    text-decoration: none;
    line-height: 1.4;
    transition: opacity 0.3s ease;
}

/* primary = 青本赤本 → /request/ ：強調用にgreen変種、テキストは全て白 */
.p-about-cta__btn--primary {
    background-color: #01913a;
    color: var(--service-color-white);
    border: none;
}

.p-about-cta__btn--primary * {
    color: var(--service-color-white);
}

/* secondary = 相談 → /contact/ ：light変種 */
.p-about-cta__btn--secondary {
    background-color: #d6e8a0;
    color: #333;
}

.p-about-cta__btn:hover {
    opacity: 0.85;
}

.p-about-cta__btn:active {
    transform: scale(0.96);
    transition: transform 0.15s ease;
}

/* mail.png 画像アイコン（secondaryボタンのみ） */
.p-about-cta__icon {
    display: block;
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    object-fit: contain;
    align-self: center;
}

@media (max-width: 768px) {
    .p-about-cta {
        max-width: min(1000px, calc(100% - 24px));
        gap: clamp(12px, calc(0.96vw + 8.7px), 16px);
    }
    .p-about-cta__btn {
        flex: 0 1 100%;
        max-width: 400px;
        min-width: 260px;
        min-height: 60px;
        border-radius: 14px;
        font-size: clamp(17px, calc(1.20vw + 12.8px), 22px);
        padding: 12px 12px;
    }
    .p-about-cta__icon {
        width: clamp(22px, calc(1.44vw + 17px), 28px);
        height: clamp(22px, calc(1.44vw + 17px), 28px);
    }
}


/* ===================================
 * セクション5: 私たちが大切にしていること
 * =================================== */

.p-about-mission__title {
    text-align: center;
    color: var(--about-text-green);
}

.p-about-mission__main {
    display: grid;
    grid-template-columns: 5fr 3fr;
    gap: clamp(32px, 4.17vw, 80px);
    align-items: stretch;
}

.p-about-mission__text-area {
    display: flex;
    flex-direction: column;
}

/* テキスト2行をクリーム背景の囲みに */
.p-about-mission__text-box {
    background-color: var(--service-color-cream);
    padding: clamp(28px, calc(1.39vw + 17.3px), 44px) clamp(40px, calc(6.60vw - 26.8px), 100px);
    border-radius: 16px;
    margin-bottom: clamp(20px, calc(0.87vw + 13.3px), 30px);
}

.p-about-mission__text-box .p-about-mission__lead,
.p-about-mission__text-box .p-about-mission__text {
    margin: 0;
}

.p-about-mission__lead {
    font-size: clamp(18px, calc(0.69vw + 12.7px), 26px);
    font-weight: 500;
    line-height: 1.8;
    margin-bottom: clamp(12px, calc(0.35vw + 9.3px), 16px);
}

.p-about-mission__text {
    margin-bottom: clamp(20px, calc(0.87vw + 13.3px), 30px);
    font-size: clamp(18px, calc(0.69vw + 12.7px), 26px);
    font-weight: 500;
    line-height: 1.8;
}

.p-about-mission__accordion {
    width: 100%;
    max-width: 400px;
    margin-top: auto;
    margin-inline: auto;
}

/* アコーディオン詳細はsection 3と同じく :has() で表示制御。grid 全幅 */
.p-about-mission__accordion-detail {
    grid-column: 1 / -1;
    margin-top: clamp(24px, calc(1.39vw + 13.3px), 40px);
    padding-inline: clamp(24px, calc(8.34vw - 40.1px), 120px);
    display: none;
}

.p-about-mission__main:has(.p-about-mission__accordion[open]) .p-about-mission__accordion-detail {
    display: block;
}

.p-about-mission__accordion-detail p {
    font-size: clamp(18px, calc(0.87vw + 11.3px), 28px);
    font-weight: 500;
    line-height: 2.4;
    /* 各視覚行（自動改行含む）の下端に 100%幅 dashed 線。bgで上を覆い、下1pxだけ dashed を覗かせるトリック */
    background-image:
        linear-gradient(
            to bottom,
            var(--service-color-white) 0,
            var(--service-color-white) calc(1lh - 1px),
            transparent calc(1lh - 1px),
            transparent 1lh
        ),
        repeating-linear-gradient(
            to right,
            var(--about-text-green) 0 4px,
            transparent 4px 8px
        );
    background-size: 100% 1lh, 8px 1lh;
    background-repeat: repeat-y, repeat;
}

.p-about-mission__visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(12px, calc(0.52vw + 8px), 18px);
}

.p-about-mission__representative {
    margin-top: auto;
    font-size: clamp(16px, calc(0.43vw + 12.7px), 21px);
    font-weight: 500;
    line-height: 1.7;
    color: var(--service-color-text);
    text-align: center;
}

.p-about-mission__image img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center;
    display: block;
}

@media (max-width: 768px) {
    .p-about-mission__catch {
        margin-bottom: 20px;
        font-weight: 800;
    }
    .p-about-mission__title {
        font-weight: 800;
    }
    .p-about-mission__main {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .p-about-mission__text-box {
        background-color: transparent;
        padding: 0;
        border-radius: 0;
        max-width: 480px;
        margin-inline: auto;
        margin-bottom: 24px;
        text-align: left;
    }
    .p-about-mission__lead,
    .p-about-mission__text {
        font-size: clamp(16px, calc(1.91vw + 9.3px), 24px);
    }
    .p-about-mission__representative {
        max-width: 480px;
        margin-inline: auto;
        text-align: left;
    }
    .p-about-mission__accordion[open] > summary {
        border-radius: 14px 14px 0 0;
        box-shadow: none;
    }
    .p-about-mission__accordion-detail {
        width: 100%;
        max-width: 400px;
        margin-top: -24px;
        margin-inline: auto;
        padding: clamp(16px, calc(2.87vw + 5.9px), 28px) clamp(12px, calc(3.83vw - 1.4px), 28px);
        background-color: var(--about-bg-cream);
        border: 2px solid var(--about-border);
        border-top: none;
        border-radius: 0 0 14px 14px;
    }
    /* SP: p内のdashed線（background-image overlay）のマスクを bg と一致、dashedは濃緑 */
    .p-about-mission__accordion-detail p {
        font-size: clamp(16px, calc(0.96vw + 12.7px), 20px);
        background-image:
            linear-gradient(
                to bottom,
                var(--about-bg-cream) 0,
                var(--about-bg-cream) calc(1lh - 1px),
                transparent calc(1lh - 1px),
                transparent 1lh
            ),
            repeating-linear-gradient(
                to right,
                var(--about-text-green) 0 4px,
                transparent 4px 8px
            );
    }
    .p-about-mission__visual {
        order: -1;
    }
    .p-about-mission__image {
        max-width: 360px;
        margin-inline: auto;
    }
}


/* ===================================
 * セクション6: 工事から10年たったお客様の声
 * =================================== */
.p-about-decade__header {
    text-align: center;
    margin-bottom: clamp(28px, calc(1.39vw + 17.3px), 48px);
}

/* タイトル左右に葉の装飾画像（closing box と同様）。
   wrap は inline-block でタイトル幅にフィット、leaf を絶対配置で外側に逃がす */
.p-about-decade__title-wrap {
    position: relative;
    display: inline-block;
    margin-bottom: clamp(28px, calc(1.74vw + 14.63px), 48px);
}

.p-about-decade__leaf {
    position: absolute;
    top: calc(50% + 6px);
    width: clamp(48px, calc(3.13vw + 23.93px), 84px);
    height: auto;
    display: block;
    pointer-events: none;
}

.p-about-decade__leaf--left {
    right: calc(100% + clamp(12px, calc(1.39vw + 1.31px), 28px));
    transform: translateY(-50%) scaleX(-1);
}

.p-about-decade__leaf--right {
    left: calc(100% + clamp(12px, calc(1.39vw + 1.31px), 28px));
    transform: translateY(-50%);
}

/* wrap内のh2はマージン0、wrap側にマージンを持たせる（shared title rule のmargin-bottomを打ち消す） */
.p-about-decade__header .p-about-decade__title-wrap h2 {
    margin-bottom: 0;
}

.p-about-decade__header h2 {
    color: var(--about-text-green);
}


.p-about-decade__subtitle {
    margin-bottom: clamp(16px, calc(0.69vw + 10.7px), 24px);
}

.p-about-decade__note {
    font-size: clamp(16px, calc(0.69vw + 10.7px), 24px);
    color: var(--service-color-text);
    line-height: 1.6;
}

.p-about-decade__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(12px, calc(0.7vw + 6.6px), 20px);
    margin-bottom: clamp(48px, calc(2.78vw + 26.6px), 80px);
    align-items: start;
}

.p-about-decade__card {
    position: relative;
    background-color: var(--about-bg-cream);
    border: 4px solid var(--about-border-orange);
    border-radius: 22px;
    box-shadow:
        inset 0 0 0 6px var(--about-bg-cream),
        inset 0 0 0 7.5px var(--about-border-orange);
    display: flex;
    flex-direction: column;
    padding-inline: clamp(20px, calc(0.7vw + 14.6px), 28px);
    padding-bottom: clamp(28px, calc(1.39vw + 17.3px), 44px);
}

.p-about-decade__card-head {
    margin-inline: calc(-1 * clamp(20px, calc(0.7vw + 14.6px), 28px));
    padding-block: clamp(28px, calc(1.39vw + 17.3px), 44px) clamp(16px, calc(0.69vw + 10.7px), 24px);
    text-align: center;
    min-height: calc((clamp(18px, calc(1.04vw + 10px), 30px) * 1.6 * 2) + clamp(28px, calc(1.39vw + 17.3px), 44px) + clamp(16px, calc(0.69vw + 10.7px), 24px));
    box-sizing: border-box;
}

.p-about-decade__card-heading {
    display: inline;
    font-size: clamp(18px, calc(1.04vw + 10px), 30px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.6;
    background: linear-gradient(transparent 60%, color-mix(in srgb, var(--about-mark) 70%, transparent) 60%);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    padding: 0 0.1em;
}

.p-about-decade__card-attr {
    text-align: center;
    padding-block: clamp(12px, calc(0.52vw + 8px), 18px) clamp(20px, calc(0.87vw + 13.3px), 30px);
    font-size: clamp(13px, calc(0.35vw + 10.3px), 17px);
    color: var(--service-color-text);
    line-height: 1.5;
    min-height: calc((clamp(13px, calc(0.35vw + 10.3px), 17px) * 1.5 * 2) + clamp(12px, calc(0.52vw + 8px), 18px) + clamp(20px, calc(0.87vw + 13.3px), 30px));
    box-sizing: border-box;
}

.p-about-decade__accordion {
    margin: 0;
}

.p-about-decade__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 7px 20px;
    background-color: var(--service-color-white);
    color: var(--about-text-green);
    font-size: clamp(14px, calc(0.17vw + 12.7px), 16px);
    font-weight: 500;
    border: 2px solid var(--about-border);
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    list-style: none;
    transition: opacity 0.3s ease;
}

.p-about-decade__btn::-webkit-details-marker {
    display: none;
}

.p-about-decade__btn:hover {
    opacity: 0.85;
}

.p-about-decade__btn-icon {
    width: 0;
    height: 0;
    border-left: 0.4em solid transparent;
    border-right: 0.4em solid transparent;
    border-top: 0.7em solid currentColor;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.p-about-decade__accordion[open] .p-about-decade__btn-icon {
    transform: rotate(180deg);
}

.p-about-decade__accordion[open] .p-about-decade__btn {
    border-radius: 20px 20px 0 0;
    box-shadow: none;
}

.p-about-decade__accordion-detail {
    margin: 0;
    padding: clamp(11px, calc(0.7vw + 5.6px), 19px) clamp(18px, calc(0.7vw + 12.6px), 26px) clamp(18px, calc(0.7vw + 12.6px), 26px);
    background-color: var(--service-color-white);
    border: 2px solid var(--about-border);
    border-top: none;
    border-radius: 0 0 20px 20px;
}

.p-about-decade__accordion-detail p {
    font-size: clamp(14px, calc(0.52vw + 10px), 20px);
    line-height: 1.7;
}

.p-about-decade__footer {
    position: relative;
    z-index: 2;
    text-align: center;
    font-size: clamp(26px, calc(1.04vw + 18px), 38px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.7;
    margin-bottom: clamp(-110px, calc(-4.35vw - 26.59px), -60px);
    text-shadow:
        0 0 6px rgba(255, 255, 255, 1),
        0 0 6px rgba(255, 255, 255, 1),
        0 0 12px rgba(255, 255, 255, 1),
        0 0 12px rgba(255, 255, 255, 1),
        0 0 20px rgba(255, 255, 255, 1),
        0 0 20px rgba(255, 255, 255, 1),
        0 0 32px rgba(255, 255, 255, 1),
        0 0 32px rgba(255, 255, 255, 1),
        0 0 50px rgba(255, 255, 255, 1),
        0 0 80px rgba(255, 255, 255, 1),
        0 0 120px rgba(255, 255, 255, 1),
        0 0 170px rgba(255, 255, 255, 1),
        0 0 220px rgba(255, 255, 255, 0.95),
        0 0 280px rgba(255, 255, 255, 0.85);
}

.p-about-decade__visual {
    position: relative;
    margin: 0;
    aspect-ratio: 2.05 / 1;
    overflow: hidden;
}

.p-about-decade__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
}

@media (max-width: 768px) {
    .p-about-decade__visual {
        aspect-ratio: auto;
    }
    .p-about-decade__visual img {
        height: auto;
        object-fit: fill;
    }
    .p-about-decade__header h2 {
        font-weight: 800;
    }
    .p-about-decade__title-wrap {
        margin-bottom: 20px;
    }
    /* SP: leaf はタイトル2行分の高さに近づけ、gap も最大を広め */
    .p-about-decade__leaf {
        top: 50%;
        width: clamp(58px, calc(6.22vw + 36.23px), 84px);
    }
    .p-about-decade__leaf--left {
        right: calc(100% + clamp(12px, calc(2.87vw + 1.95px), 24px));
    }
    .p-about-decade__leaf--right {
        left: calc(100% + clamp(12px, calc(2.87vw + 1.95px), 24px));
    }
    .p-about-decade__note {
        font-size: clamp(14px, calc(2.39vw + 5.6px), 24px);
    }
    .p-about-decade__footer {
        font-size: clamp(22px, calc(0.48vw + 20.3px), 24px);
        margin-bottom: clamp(-170px, calc(-20.33vw - 13.84px), -85px);
        text-shadow:
            0 0 4px rgba(255, 255, 255, 1),
            0 0 4px rgba(255, 255, 255, 1),
            0 0 4px rgba(255, 255, 255, 1),
            0 0 8px rgba(255, 255, 255, 1),
            0 0 8px rgba(255, 255, 255, 1),
            0 0 8px rgba(255, 255, 255, 1),
            0 0 14px rgba(255, 255, 255, 1),
            0 0 14px rgba(255, 255, 255, 1),
            0 0 24px rgba(255, 255, 255, 1),
            0 0 24px rgba(255, 255, 255, 1),
            0 0 40px rgba(255, 255, 255, 1),
            0 0 60px rgba(255, 255, 255, 1),
            0 0 90px rgba(255, 255, 255, 1),
            0 0 130px rgba(255, 255, 255, 0.95),
            0 0 180px rgba(255, 255, 255, 0.85);
    }
    .p-about-decade__card-heading {
        font-size: clamp(20px, calc(1.44vw + 15px), 26px);
    }
    .p-about-decade__cards {
        grid-template-columns: 1fr;
        gap: 16px;
        max-width: 550px;
        margin-inline: auto;
    }
    .p-about-decade__card {
        padding-inline: clamp(28px, calc(2.87vw + 18px), 40px);
    }
    .p-about-decade__card-head {
        min-height: 0;
        padding-block: clamp(20px, calc(1.91vw + 13.3px), 28px) clamp(12px, calc(0.96vw + 8.7px), 16px);
    }
    .p-about-decade__card-attr {
        min-height: 0;
        padding-block: clamp(8px, calc(0.96vw + 4.7px), 12px) clamp(14px, calc(1.91vw + 7.3px), 22px);
        font-size: clamp(13px, calc(0.96vw + 9.7px), 17px);
    }
}


/* ===================================
 * セクション7: 代表者・建築士のご紹介
 * =================================== */
.p-about-profile > .p-about-profile__inner > h2 {
    text-align: center;
    color: var(--about-text-green);
    margin-bottom: clamp(20px, calc(0.87vw + 13.3px), 30px);
}


.p-about-profile__cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(48px, calc(6.26vw + 0px), 120px);
    margin-bottom: clamp(40px, calc(2.08vw + 24px), 64px);
}

.p-about-profile__card {
    display: flex;
    flex-direction: column;
}

.p-about-profile__card-header {
    text-align: center;
}

.p-about-profile__card-image {
    width: 60%;
    margin: 0 auto clamp(12px, calc(0.52vw + 8px), 18px);
}

.p-about-profile__card-image img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.p-about-profile__card-name {
    font-size: clamp(26px, calc(1.22vw + 16.6px), 40px);
    font-weight: 700;
    color: var(--service-color-text);
    margin-bottom: 0;
    letter-spacing: 0.05em;
}

.p-about-profile__card-role {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    font-weight: 600;
    color: var(--service-color-text);
    line-height: 1.7;
    text-align: left;
    width: fit-content;
    margin-inline: auto;
    padding-block: clamp(18px, calc(0.7vw + 12.6px), 26px);
}

.p-about-profile__card-desc {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.7;
    margin-bottom: clamp(32px, calc(1.39vw + 21.3px), 48px);
    background-color: var(--service-color-cream);
    padding: clamp(24px, calc(1.04vw + 16px), 36px) clamp(20px, calc(2.78vw - 1.4px), 52px);
    border-radius: 12px;
}

.p-about-profile__accordion {
    width: 100%;
    margin-bottom: clamp(12px, calc(0.52vw + 8px), 18px);
}

.p-about-profile__accordion > summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 24px;
    background-color: var(--service-color-white);
    color: var(--about-text-green);
    font-size: clamp(14px, calc(0.17vw + 12.7px), 16px);
    font-weight: 500;
    border: 2px solid var(--about-border);
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    list-style: none;
    transition: opacity 0.3s ease;
}

.p-about-profile__accordion > summary::-webkit-details-marker {
    display: none;
}


.p-about-profile__accordion[open] > summary {
    border-radius: 20px 20px 0 0;
    box-shadow: none;
}

.p-about-profile__accordion-detail {
    margin: 0;
    padding: clamp(10px, calc(0.87vw + 3.3px), 20px) clamp(24px, calc(2.09vw + 8px), 48px) clamp(18px, calc(0.87vw + 11.3px), 28px);
    background-color: var(--about-bg-cream);
    border: 2px solid var(--about-border);
    border-top: none;
    border-radius: 0 0 20px 20px;
}

.p-about-profile__detail-heading {
    font-size: clamp(17px, calc(0.61vw + 12.32px), 24px);
    font-weight: 700;
    color: var(--about-text-green);
    margin-bottom: 8px;
    text-align: center;
    position: relative;
}

.p-about-profile__detail-heading::before,
.p-about-profile__detail-heading::after {
    content: "—";
    color: var(--about-text-green);
    margin: 0 8px;
    font-weight: 400;
}

.p-about-profile__detail-heading:not(:first-child) {
    margin-top: clamp(16px, calc(0.69vw + 10.7px), 24px);
}

.p-about-profile__accordion-detail p {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.9;
}

.p-about-profile__detail-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.p-about-profile__detail-list li {
    position: relative;
    padding-left: 1.4em;
    padding-block: clamp(8px, calc(0.35vw + 5.3px), 12px);
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.6;
    color: var(--service-color-text);
    border-bottom: 1px dashed var(--about-border);
}

.p-about-profile__detail-list li:last-child {
    border-bottom: none;
}

.p-about-profile__detail-list li::before {
    content: "・";
    color: var(--about-text-green);
    font-weight: 700;
    position: absolute;
    left: 0;
    top: clamp(8px, calc(0.35vw + 5.3px), 12px);
}

@media (max-width: 768px) {
    .p-about-profile > .p-about-profile__inner > h2 {
        font-weight: 800;
    }
    .p-about-profile__lead {
        font-size: clamp(18px, calc(2.39vw + 9.6px), 28px);
        margin-inline: calc(-1 * var(--about-padding-inline));
        font-weight: 800;
    }
    .p-about-profile__cards {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .p-about-profile__card-image {
        width: 50%;
        max-width: 240px;
    }
    .p-about-profile__card-desc {
        max-width: 550px;
        margin-inline: auto;
        padding: clamp(12px, calc(4.79vw - 4.7px), 32px) clamp(16px, calc(5.74vw - 4.1px), 40px);
        font-size: clamp(17px, calc(1.20vw + 12.8px), 22px);
        line-height: 1.8;
    }
    .p-about-profile__accordion-detail {
        padding: clamp(16px, calc(2.87vw + 5.9px), 28px) clamp(12px, calc(3.83vw - 1.4px), 28px);
    }
    .p-about-profile__detail-heading {
        font-size: clamp(15px, calc(0.72vw + 12.49px), 18px);
    }
    .p-about-profile__accordion-detail p,
    .p-about-profile__detail-list li {
        font-size: clamp(16px, calc(0.96vw + 12.7px), 20px);
    }
}


/* ===================================
 * セクション8: この事業を始めた理由
 * =================================== */
.p-about-founding__inner {
    text-align: center;
}

.p-about-founding__title {
    color: var(--about-text-green);
}

.p-about-founding__catch-box {
    margin: 0 auto clamp(28px, calc(1.39vw + 17.3px), 44px);
    text-align: center;
}

.p-about-founding__catch {
    display: inline;
    font-size: clamp(24px, calc(1.04vw + 16px), 36px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.6;
    background: linear-gradient(transparent 60%, rgba(192, 216, 154, 0.7) 60%);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    padding: 0 0.2em;
}

.p-about-founding__text {
    font-size: clamp(20px, calc(0.87vw + 13.3px), 30px);
    font-weight: 500;
    line-height: 2;
    margin-bottom: clamp(28px, calc(1.39vw + 17.3px), 48px);
}

.p-about-founding__text:not(:last-of-type) {
    margin-bottom: 0;
}

/* common.css の p+p グローバル margin-block-start を打ち消す */
.p-about-founding__text + .p-about-founding__text {
    margin-top: 0;
}

.p-about-founding__accordion {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
}

.p-about-founding__accordion > summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 24px;
    background-color: var(--service-color-white);
    color: var(--about-text-orange);
    font-size: clamp(14px, calc(0.17vw + 12.7px), 16px);
    font-weight: 500;
    border: 2px solid var(--about-border-orange);
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    list-style: none;
    transition: opacity 0.3s ease;
}

.p-about-founding__accordion > summary::-webkit-details-marker {
    display: none;
}


.p-about-founding__accordion[open] > summary {
    border-radius: 20px 20px 0 0;
    border-bottom: none;
    box-shadow: none;
}

.p-about-founding__accordion-detail {
    margin: 0;
    padding: clamp(20px, calc(1.04vw + 12px), 32px);
    background-color: var(--service-color-white);
    border: 2px solid var(--about-text-green);
    border-top: none;
    border-radius: 0 0 20px 20px;
    text-align: left;
}

.p-about-founding__story + .p-about-founding__story {
    margin-top: clamp(40px, calc(2.09vw + 24px), 64px);
    padding-top: clamp(40px, calc(2.09vw + 24px), 64px);
    border-top: 2px dashed var(--about-dashed-orange);
}

.p-about-founding__story-heading {
    display: block;
    width: fit-content;
    margin: 0 auto clamp(24px, calc(1.39vw + 13.3px), 40px);
    padding: 0 0.3em;
    background: linear-gradient(transparent 60%, color-mix(in srgb, var(--about-mark) 70%, transparent) 60%);
    color: var(--service-color-text);
    font-size: clamp(20px, calc(0.7vw + 14.6px), 28px);
    font-weight: 700;
    text-align: center;
}

.p-about-founding__story p {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.9;
}

@media (max-width: 768px) {
    .p-about-founding__title {
        font-weight: 800;
    }
    .p-about-founding__catch {
        font-size: clamp(19px, calc(1.20vw + 14.8px), 24px);
    }
    .p-about-founding__text,
    .p-about-founding__story p {
        font-size: clamp(17px, calc(1.20vw + 12.8px), 22px);
    }
    .p-about-founding__text {
        text-align: left;
        max-width: 550px;
        margin-inline: auto;
    }
    .p-about-founding__text + .p-about-founding__text {
        margin-top: clamp(12px, calc(1.91vw + 5.3px), 20px);
    }
    .p-about-founding__story-heading {
        margin-bottom: clamp(12px, calc(1.91vw + 5.3px), 20px);
    }
    .p-about-founding__story + .p-about-founding__story {
        margin-top: clamp(24px, calc(3.83vw + 10.6px), 40px);
        padding-top: clamp(24px, calc(3.83vw + 10.6px), 40px);
        border-top-width: 1px;
    }
    .p-about-founding__accordion-detail {
        padding: clamp(16px, calc(2.87vw + 5.9px), 28px) clamp(12px, calc(3.83vw - 1.4px), 28px);
        background-color: var(--about-bg-cream);
        border-color: var(--about-border-orange);
    }
    .p-about-founding__story-heading {
        font-size: clamp(18px, calc(0.96vw + 14.7px), 22px);
    }
}



/* ===================================
 * セクション9: 社会貢献
 * =================================== */
.p-about-social__header {
    text-align: center;
}

.p-about-social__header h2 {
    color: var(--about-text-green);
    margin-bottom: clamp(12px, calc(0.35vw + 9.3px), 16px);
}

.p-about-social__image {
    max-width: 480px;
    margin: 0 auto clamp(40px, calc(2.09vw + 24px), 64px);
}

@media (min-width: 769px) {
    .p-about-social__image {
        max-width: 60%;
    }
}

.p-about-social__image img {
    width: 100%;
    height: auto;
    display: block;
}

.p-about-social__accordion {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
}

.p-about-social__accordion > summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 24px;
    background-color: var(--service-color-white);
    color: var(--about-text-green);
    font-size: clamp(14px, calc(0.17vw + 12.7px), 16px);
    font-weight: 500;
    border: 2px solid var(--about-border);
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    list-style: none;
    transition: opacity 0.3s ease;
}

.p-about-social__accordion > summary::-webkit-details-marker {
    display: none;
}



.p-about-social__accordion[open] > summary {
    border-radius: 20px 20px 0 0;
    border-bottom: none;
    box-shadow: none;
}

.p-about-social__accordion-detail {
    margin: 0;
    padding: clamp(20px, calc(1.04vw + 12px), 32px);
    background-color: var(--service-color-white);
    border: 2px solid var(--about-border);
    border-top: none;
    border-radius: 0 0 20px 20px;
}

.p-about-social__item {
    padding-block: clamp(24px, calc(1.04vw + 16px), 36px);
}

.p-about-social__item + .p-about-social__item {
    border-top: 1px dashed var(--about-text-green);
}

.p-about-social__item:last-child {
    border-bottom: 1px dashed var(--about-text-green);
}

.p-about-social__item-title {
    font-size: clamp(20px, calc(0.7vw + 14.6px), 28px);
    font-weight: 700;
    color: var(--about-text-green);
    margin-bottom: 6px;
}

.p-about-social__item p {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.9;
}

.p-about-social__note {
    margin-top: clamp(40px, calc(2.09vw + 24px), 64px);
    text-align: center;
    font-size: clamp(24px, calc(1.04vw + 16px), 36px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.7;
}

@media (max-width: 768px) {
    .p-about-social__header h2 {
        font-weight: 800;
    }
    .p-about-social__lead {
        font-weight: 800;
    }
    .p-about-social__note {
        font-size: clamp(16px, calc(2.39vw + 7.6px), 26px);
        font-weight: 500;
        line-height: 1.8;
        margin-inline: calc(-1 * var(--about-padding-inline));
    }
    .p-about-social__accordion-detail {
        padding: clamp(16px, calc(2.87vw + 5.9px), 28px) clamp(12px, calc(3.83vw - 1.4px), 28px);
        background-color: var(--about-bg-cream);
    }
    .p-about-social__item-title {
        font-size: clamp(18px, calc(0.96vw + 14.7px), 22px);
    }
    .p-about-social__item p {
        font-size: clamp(17px, calc(1.20vw + 12.8px), 22px);
    }
    .p-about-social__item:last-child {
        border-bottom: none;
    }
}


/* ===================================
 * セクション10: 運営会社情報
 * =================================== */
.p-about-company__title {
    text-align: center;
    color: var(--about-text-green);
}

.p-about-company__list {
    max-width: 1000px;
    margin-inline: auto;
}

.p-about-company__item {
    display: grid;
    grid-template-columns: 160px minmax(0, 480px);
    justify-content: center;
    column-gap: 56px;
    padding: clamp(16px, calc(0.69vw + 10.7px), 24px) clamp(8px, calc(0.35vw + 5.3px), 12px);
    border-bottom: 1px solid #d9d9d9;
}

.p-about-company__item:first-child {
    border-top: 1px solid #d9d9d9;
}

.p-about-company__label {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    color: var(--about-text-green);
}

.p-about-company__value {
    font-size: clamp(18px, calc(0.7vw + 12.6px), 26px);
    line-height: 1.7;
}

@media (max-width: 768px) {
    .p-about-company__title {
        font-weight: 800;
    }
    .p-about-company__list {
        max-width: 500px;
    }
    .p-about-company__item {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 14px 4px;
    }
    .p-about-company__list .p-about-company__label,
    .p-about-company__list .p-about-company__value {
        font-size: clamp(16px, calc(2.39vw + 7.6px), 26px);
    }
}


/* ===================================
 * セクション11: 安心してご利用ください
 * =================================== */
.p-about-closing__inner {
    text-align: center;
}

.p-about-closing__title {
    color: var(--about-text-green);
}


.p-about-closing__box {
    position: relative;
    max-width: 1240px;
    margin: 0 auto clamp(24px, calc(1.04vw + 16px), 36px);
    padding: clamp(32px, calc(2.09vw + 16px), 56px) clamp(60px, calc(1.74vw + 46.6px), 80px);
    background-color: var(--about-bg-pale-green);
    border: 6px solid var(--about-border);
    border-radius: 22px;
    box-shadow:
        inset 0 0 0 9px var(--about-bg-pale-green),
        inset 0 0 0 11px var(--about-border);
}

.p-about-closing__leaf {
    position: absolute;
    top: 54%;
    transform: translateY(-50%);
    width: clamp(56px, calc(3.82vw + 26.6px), 100px);
    height: auto;
    display: block;
    pointer-events: none;
}

.p-about-closing__leaf--left {
    left: clamp(8px, calc(0.69vw + 2.7px), 20px);
    transform: translateY(-50%) scaleX(-1);
}

.p-about-closing__leaf--right {
    right: clamp(8px, calc(0.69vw + 2.7px), 20px);
}

@media (min-width: 769px) {
    .p-about-closing__leaf--left {
        left: clamp(60px, calc(1.74vw + 46.6px), 80px);
    }
    .p-about-closing__leaf--right {
        right: clamp(60px, calc(1.74vw + 46.6px), 80px);
    }
}

.p-about-closing__text {
    font-size: clamp(26px, calc(1.22vw + 16.6px), 40px);
    font-weight: 600;
    color: var(--about-text-green);
    line-height: 1.8;
}

.p-about-closing__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(48px, calc(2.78vw + 26.6px), 80px);
    margin-bottom: clamp(48px, calc(2.78vw + 26.6px), 80px);
    padding: 0;
}

.p-about-closing__item {
    display: inline-flex;
    align-items: center;
    gap: clamp(10px, calc(0.87vw + 3.3px), 20px);
    padding-block: 6px;
    font-size: clamp(20px, calc(0.87vw + 13.3px), 30px);
    font-weight: 600;
    line-height: 1.5;
    border-bottom: 1px dashed var(--about-dashed-orange);
}

.p-about-closing__item::before {
    content: "";
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    transform: translateY(0.1em);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='12' fill='%231c863c'/><path d='M6 12.5l4 4 8-8' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
}

.p-about-closing__catch {
    font-size: clamp(24px, calc(1.04vw + 16px), 36px);
    font-weight: 700;
    color: var(--service-color-text);
    line-height: 1.7;
    letter-spacing: 0.02em;
}

@media (max-width: 768px) {
    .p-about-closing__title {
        font-weight: 800;
    }
    .p-about-closing__box {
        padding: clamp(28px, calc(2.87vw + 18px), 40px) clamp(24px, calc(5.74vw + 3.9px), 48px);
        max-width: 580px;
    }
    .p-about-closing__list {
        flex-direction: column;
        align-items: stretch;
        max-width: 320px;
        margin-inline: auto;
        margin-bottom: 28px;
        gap: 0;
    }
    .p-about-closing__item {
        display: flex;
        width: fit-content;
        margin-inline: auto;
        justify-content: flex-start;
        padding-block: clamp(8px, calc(1.91vw + 1.3px), 16px);
        padding-inline: 12px;
        font-size: clamp(16px, calc(0.96vw + 12.7px), 20px);
    }
    .p-about-closing__item:last-child {
        border-bottom: none;
    }
    .p-about-closing__thanks {
        font-weight: 500;
    }
    .p-about-closing__text {
        font-size: clamp(18px, calc(2.87vw + 8px), 30px);
    }
    .p-about-closing__leaf {
        top: auto;
        bottom: 16px;
        transform: none;
        width: clamp(40px, calc(3.83vw + 26.6px), 56px);
    }
    .p-about-closing__catch {
        font-size: clamp(22px, calc(1.91vw + 15.3px), 30px);
    }
    .p-about-closing__leaf--left {
        left: 24px;
        transform: scaleX(-1) rotate(15deg);
        transform-origin: bottom center;
    }
    .p-about-closing__leaf--right {
        right: 24px;
        transform: rotate(15deg);
        transform-origin: bottom center;
    }
}


/* ===================================
 * セクションタイトル共通（section2基準で統一）
 * =================================== */
.p-about-trust__title,
.p-about-media__title,
.p-about-books__title,
.p-about-mission__title,
.p-about-decade__header h2,
.p-about-profile > .p-about-profile__inner > h2,
.p-about-founding__title,
.p-about-social__header h2,
.p-about-company__title,
.p-about-closing__title {
    margin-bottom: clamp(36px, calc(2.43vw + 17.3px), 64px);
}

@media (max-width: 768px) {
    .p-about-trust__title,
    .p-about-media__title,
    .p-about-books__title,
    .p-about-mission__title,
    .p-about-decade__header h2,
    .p-about-profile > .p-about-profile__inner > h2,
    .p-about-founding__title,
    .p-about-social__header h2,
    .p-about-company__title,
    .p-about-closing__title {
        font-size: clamp(22px, calc(2.87vw + 12px), 34px);
        margin-inline: calc(-1 * var(--about-padding-inline));
        margin-bottom: clamp(16px, calc(2.87vw + 5.9px), 28px);
    }
}


/* ===================================
 * 画像 drop-shadow（既存パターンと統一）
 * =================================== */
.p-about-media__figure img,
.p-about-books__cover img,
.p-about-books__guidebooks-image img,
.p-about-mission__image img,
.p-about-profile__card-image img {
    filter: drop-shadow(4px 4px 6px rgba(0, 0, 0, 0.18));
}


/* ===================================
 * mission / media アコーディオンボタンも privacy 風に統一
 * （summary が .p-service-btn .p-service-btn--outline を使っているため上書き）
 * =================================== */
.p-about-mission__accordion > summary,
.p-about-media__accordion > summary {
    width: 100%;
    height: auto;
    padding: 14px 24px;
    gap: 10px;
    border: 2px solid var(--about-text-green);
    border-radius: 20px;
    box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    font-weight: 500;
    font-size: clamp(19px, calc(0.26vw + 17px), 22px);
}

/* mediaは白背景・オレンジ文字＋オレンジ枠 / missionのみ反転（緑背景・白文字） */
.p-about-media__accordion > summary {
    background-color: var(--service-color-white);
    color: var(--about-text-orange);
    border-color: var(--about-border-orange);
}
.p-about-mission__accordion > summary {
    background-color: #ebf4d7;
    color: var(--about-text-green);
    border-color: var(--about-border);
}

.p-about-mission__accordion > summary:hover,
.p-about-media__accordion > summary:hover {
    opacity: 0.85;
}


/* V字アイコンを潰して三角に置き換え（profile/founding/social も統一） */
.p-about-mission__accordion .p-service-btn__icon,
.p-about-media__accordion .p-service-btn__icon,
.p-about-profile__accordion .p-service-btn__icon,
.p-about-founding__accordion .p-service-btn__icon,
.p-about-social__accordion .p-service-btn__icon {
    position: static;
    width: 0;
    height: 0;
    border-left: 0.4em solid transparent;
    border-right: 0.4em solid transparent;
    border-top: 0.7em solid currentColor;
    transition: transform 0.3s ease;
}

.p-about-mission__accordion .p-service-btn__icon::before,
.p-about-mission__accordion .p-service-btn__icon::after,
.p-about-media__accordion .p-service-btn__icon::before,
.p-about-media__accordion .p-service-btn__icon::after,
.p-about-profile__accordion .p-service-btn__icon::before,
.p-about-profile__accordion .p-service-btn__icon::after,
.p-about-founding__accordion .p-service-btn__icon::before,
.p-about-founding__accordion .p-service-btn__icon::after,
.p-about-social__accordion .p-service-btn__icon::before,
.p-about-social__accordion .p-service-btn__icon::after {
    display: none;
}

.p-about-mission__accordion[open] .p-service-btn__icon,
.p-about-media__accordion[open] .p-service-btn__icon,
.p-about-profile__accordion[open] .p-service-btn__icon,
.p-about-founding__accordion[open] .p-service-btn__icon,
.p-about-social__accordion[open] .p-service-btn__icon {
    transform: rotate(180deg);
}


/* ===================================
 * 全アコーディオンボタンの幅・高さ・radius を統一
 * （decade / profile / founding / social / mission / media）
 * =================================== */
.p-about-decade__btn,
.p-about-profile__accordion > summary,
.p-about-founding__accordion > summary,
.p-about-social__accordion > summary,
.p-about-mission__accordion > summary,
.p-about-media__accordion > summary {
    width: 100%;
    max-width: 360px;
    min-height: clamp(60px, calc(0.69vw + 54.7px), 68px);
    margin-inline: auto;
    padding: 8px 24px;
    border-radius: 20px;
    font-size: clamp(18px, calc(0.52vw + 14px), 24px);
}

/* ===================================
 * PC: アコーディオンボタンの max-width 個別調整
 * =================================== */
/* profile / founding / social / media: 全幅に追従（共通max-width解除） */
.p-about-profile__accordion > summary,
.p-about-founding__accordion > summary,
.p-about-social__accordion > summary {
    max-width: none;
}

/* PC: accordion summary 個別 max-width 調整 + founding/social は枠なし（旧 約束の理由 風） */
@media (min-width: 769px) {
    /* media: 100%幅 */
    .p-about-media__accordion > summary {
        max-width: none;
    }
    /* mission: 少しだけ広めに */
    .p-about-mission__accordion > summary {
        max-width: 400px;
    }
    /* founding/social: accordion 全幅、summary 420px centered */
    .p-about-founding__accordion,
    .p-about-social__accordion {
        max-width: none;
    }
    .p-about-founding__accordion > summary,
    .p-about-social__accordion > summary {
        max-width: 420px;
    }
    /* 開時もボタンは閉時と同じ見た目（影あり/4辺角丸/枠維持） */
    .p-about-founding__accordion[open] > summary,
    .p-about-social__accordion[open] > summary {
        border-radius: 20px;
        box-shadow: 4px 4px 5px 2px rgba(0, 0, 0, 0.15);
    }
    .p-about-founding__accordion[open] > summary {
        border-bottom: 2px solid var(--about-border-orange);
    }
    .p-about-social__accordion[open] > summary {
        border-bottom: 2px solid var(--about-border);
    }
    /* detail は枠/背景なし、padding-inline 0、上にgap */
    .p-about-founding__accordion-detail,
    .p-about-social__accordion-detail {
        margin-top: clamp(24px, calc(1.04vw + 16px), 36px);
        padding-inline: 0;
        background-color: transparent;
        border: none;
        border-radius: 0;
    }
}

/* セクション6 decade のボタンのみ主張を抑え、高さを下げる (PC) */
.p-about-decade__btn {
    min-height: clamp(50px, calc(0.61vw + 45.3px), 57px);
    padding: 8px 20px;
    font-size: clamp(15px, calc(0.26vw + 13px), 18px);
}


/* ===================================
 * SP: アコーディオン・囲み枠の統合スタイル
 * =================================== */
@media (max-width: 768px) {
    /* 全アコーディオンボタン共通サイズ */
    .p-about-decade__btn,
    .p-about-profile__accordion > summary,
    .p-about-founding__accordion > summary,
    .p-about-social__accordion > summary,
    .p-about-mission__accordion > summary,
    .p-about-media__accordion > summary {
        min-height: 52px;
        padding: 8px 20px;
        border-radius: 14px;
        font-size: clamp(17px, calc(0.96vw + 13.6px), 21px);
    }

    /* ボタン・ディテールの枠線太さを1.5〜2pxでスケール */
    .p-about-decade__btn,
    .p-about-profile__accordion > summary,
    .p-about-founding__accordion > summary,
    .p-about-social__accordion > summary,
    .p-about-mission__accordion > summary,
    .p-about-media__accordion > summary,
    .p-about-decade__accordion-detail,
    .p-about-profile__accordion-detail,
    .p-about-founding__accordion-detail,
    .p-about-social__accordion-detail,
    .p-about-mission__accordion-detail,
    .p-about-media__accordion-detail {
        border-width: clamp(1.5px, calc(0.12vw + 1.08px), 2px);
    }

    /* 統合フレームの角丸（開時ボタン下フラット / ディテール上フラット） */
    .p-about-decade__accordion[open] .p-about-decade__btn,
    .p-about-profile__accordion[open] > summary,
    .p-about-founding__accordion[open] > summary,
    .p-about-social__accordion[open] > summary {
        border-radius: 14px 14px 0 0;
    }
    /* SP: 開時もボタン下に枠を残す（mission と統一。境界線として残る）
       太さは閉時の枠と同じ clamp(1.5px〜2px) に揃える */
    .p-about-decade__accordion[open] .p-about-decade__btn,
    .p-about-profile__accordion[open] > summary,
    .p-about-social__accordion[open] > summary {
        border-bottom: clamp(1.5px, calc(0.12vw + 1.08px), 2px) solid var(--about-border);
    }
    .p-about-founding__accordion[open] > summary,
    .p-about-media__accordion[open] > summary {
        border-bottom: clamp(1.5px, calc(0.12vw + 1.08px), 2px) solid var(--about-border-orange);
    }
    .p-about-decade__accordion-detail,
    .p-about-profile__accordion-detail,
    .p-about-founding__accordion-detail,
    .p-about-social__accordion-detail {
        border-radius: 0 0 14px 14px;
    }

    /* ボタン以外の囲み枠 border-radius を 16px に統一 */
    .p-about-hero__list,
    .p-about-trust__list,
    .p-about-mission__text-box,
    .p-about-decade__card,
    .p-about-profile__card-desc,
    .p-about-books__guidebooks,
    .p-about-closing__box {
        border-radius: 16px;
    }
    /* 二重枠線の枠：外を大きめ border-radius にして内側の線にも丸みを出す */
    .p-about-decade__card,
    .p-about-closing__box {
        border-radius: 20px;
    }
    .p-about-decade__card {
        border-width: 3px;
        box-shadow:
            inset 0 0 0 5px var(--about-bg-cream),
            inset 0 0 0 6px var(--about-border-orange);
    }
    .p-about-closing__box {
        border-width: 4px;
        box-shadow:
            inset 0 0 0 5px var(--about-bg-pale-green),
            inset 0 0 0 7px var(--about-border);
    }

    /* decade ボタンのみ主張を抑え、高さを下げる (SP override) */
    .p-about-decade__btn {
        min-height: 46px;
        padding: 8px 18px;
        font-size: clamp(14px, calc(0.72vw + 11.5px), 16px);
    }

    /* 全アコーディオン（声以外）のコンテナ・ボタン・ディテールの最大幅を 550px に統一 */
    .p-about-decade__btn,
    .p-about-decade__accordion-detail,
    .p-about-profile__accordion,
    .p-about-profile__accordion > summary,
    .p-about-profile__accordion-detail,
    .p-about-founding__accordion,
    .p-about-founding__accordion > summary,
    .p-about-founding__accordion-detail,
    .p-about-social__accordion,
    .p-about-social__accordion > summary,
    .p-about-social__accordion-detail,
    .p-about-mission__accordion,
    .p-about-mission__accordion > summary,
    .p-about-mission__accordion-detail,
    .p-about-media__accordion,
    .p-about-media__accordion > summary,
    .p-about-media__accordion-detail {
        width: 100%;
        max-width: 550px;
        margin-inline: auto;
    }
}


/* ===================================
 * ユーティリティ
 * =================================== */
/* SP(≤768) と 1024px以上で表示する改行（中間帯=PC narrow では非表示） */
.about-br-lg {
    display: none;
}
@media (max-width: 768px) {
    .about-br-lg {
        display: inline;
    }
}
@media (min-width: 1024px) {
    .about-br-lg {
        display: inline;
    }
}

/* 540以下 と 1400以上で表示する改行 */
.about-br-xl {
    display: none;
}
@media (max-width: 540px) {
    .about-br-xl {
        display: inline;
    }
}
@media (min-width: 1400px) {
    .about-br-xl {
        display: inline;
    }
}