@charset "UTF-8";

/* ============================================================
   0. DESIGN TOKENS
   ============================================================ */
:root {
    /* --- Color --- */
    --color-primary:       #1a3a6d;
    --color-primary-light: #f2f7ff;
    --color-secondary:     #2e68c4;
    --color-bg-blue:       #dbe9ff;
    --color-text:          #262626;
    --color-muted:         #999999;
    --color-white:         #ffffff;
    --color-border:        #dddddd;
    --color-border-table:  #e1e4e5;
    --color-bg-gray:       #eeeeee;
    --color-required:      #d92626;

    /* --- Font family --- */
    --font-ja:     "Noto Sans JP", sans-serif;
    --font-en:     "Inter", sans-serif;
    --font-mincho: "Zen Old Mincho", serif;

    /* --- Font size (fluid, based on 1440px) --- */
    --fs-ttl:          clamp(3.2rem, 1.8rem + 3vw, 5rem);      /* 32-50px: 大見出し（ttl） */
    --fs-eyebrow:      2rem;                                    /* 20px: 英字ラベル */
    --fs-cta-ttl:      clamp(2.8rem, 1rem + 4.5vw, 5.6rem);     /* 28-56px: フッターCTA見出し */
    --fs-cta-txt:      clamp(2.2rem, 1.4rem + 2vw, 3.3rem);     /* 22-33px */
    --fs-md:           2.3rem;
    --fs-body:         1.6rem;
    --fs-sm:           1.5rem;
    --fs-xs:           1.2rem;

    /* --- Spacing --- */
    --space-xs:  0.8rem;
    --space-sm:  1.2rem;
    --space-md:  2rem;
    --space-lg:  3.2rem;
    --space-xl:  4rem;
    --space-2xl: clamp(4rem, 3rem + 2.5vw, 6rem);
    --section-gap: clamp(6rem, 4rem + 5vw, 11rem);

    /* --- Layout --- */
    --inner-width:          1200px;
    --inner-width-wide:     1440px;
    --content-width:        1400px;  /* REASON/SERVICES/FOR BUSINESS共通のコンテンツ幅 */
    --inner-padding:        20px;
    --header-height:        100px;
    --header-height-tablet: 65px;

    /* --- Motion --- */
    --transition: 0.2s ease;
}


/* ============================================================
   1. RESET / BASE
   ============================================================ */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ドロワー展開中はスクロールを止める */
body.is-fixed {
    overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
dl,
dd,
figure,
blockquote {
    margin: 0;
    padding: 0;
}

ul,
ol {
    list-style: none;
}

img,
picture,
svg,
video,
canvas {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
    transition: opacity var(--transition), color var(--transition);
}

button,
input,
select,
textarea {
    background: none;
    border: none;
    color: inherit;
    font: inherit;
}

button {
    cursor: pointer;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

address {
    font-style: normal;
}

hr {
    border: none;
    border-top: 2px solid var(--color-border);
    margin: 0;
}

/* キーボード操作時のフォーカスを明示 */
:focus-visible {
    outline: 2px solid var(--color-secondary);
    outline-offset: 3px;
}

body {
    color: var(--color-text);
    font-family: var(--font-ja);
    font-size: var(--fs-body);
    line-height: 1.7;
    letter-spacing: 0.03em;
}


/* ============================================================
   2. LAYOUT（l-）
   ============================================================ */

/* --- 共通の中央寄せ幅（paddingを差し引いても中身が --inner-width になるようにする） --- */
.l-inner {
    width: 100%;
    max-width: calc(var(--inner-width) + var(--inner-padding) * 2);
    margin-inline: auto;
    padding-inline: var(--inner-padding);
}

.l-inner--wide {
    max-width: calc(var(--inner-width-wide) + var(--inner-padding) * 2);
}

/* --- セクションの共通縦余白 --- */
.l-section {
    padding-block: var(--section-gap);
}

/* 本文を .l-section-group で包んだページは、連続するセクションの上余白を詰める */
.l-section-group .l-section + .l-section {
    padding-top: 0;
}

/* --- ヘッダー --- */
.l-header {
    position: sticky;
    top: 0;
    z-index: 101;
    display: flex;
    align-items: stretch;
    height: var(--header-height);
    background-color: var(--color-white);
}

/* --- フッター --- */
.l-footer {
    position: relative;
}


/* ============================================================
   3. COMPONENT（c-）
   ============================================================ */

/* --- 見出し（英字ラベル + 和文タイトル） --- */
.c-heading {
    display: flex;
    flex-direction: column;
}

.c-heading__en {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--color-primary);
    font-family: var(--font-en);
    font-size: var(--fs-eyebrow);
    font-weight: 700;
    line-height: 1.2;
}

/* 下層ページのセクション見出し用（85%サイズ） */
.c-heading__en--compact {
    font-size: calc(var(--fs-eyebrow) * 0.85);
}

.c-heading__en--compact::before {
    width: 28px;
    height: 28px;
}

.c-heading__en::before {
    content: "";
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    background-image: url(../images/common/icon-rectangle.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    filter: brightness(0) saturate(100%) invert(15%) sepia(64%) saturate(1789%) hue-rotate(200deg) brightness(95%) contrast(90%);
}

.c-heading__ja {
    margin-top: var(--space-sm);
    font-family: var(--font-mincho);
    font-size: var(--fs-ttl);
    font-weight: 700;
    line-height: 1.4;
    color: var(--color-text);
}

.c-heading--center {
    align-items: center;
    text-align: center;
}

.c-heading__ja--sm {
    font-size: 4rem;
}

/* 下層ページのセクション見出し用（85%サイズ） */
.c-heading__ja--compact {
    font-size: calc(var(--fs-ttl) * 0.8);
}

.c-heading--white .c-heading__en,
.c-heading--white .c-heading__ja {
    color: var(--color-white);
}

/* --- 電話番号 --- */
.c-tel {
    display: flex;
    align-items: baseline;
    gap: 12px;
    color: var(--color-primary);
}

.c-tel__link {
    display: inline-flex;
    align-items: baseline;
    font-family: var(--font-en);
    font-size: 1.8rem;
    font-weight: 700;
    pointer-events: none;
}

.c-tel__label {
    margin-right: 2px;
    font-family: var(--font-ja);
    font-size: 1.2rem;
    font-weight: 700;
}

.c-tel__time {
    font-size: var(--fs-sm);
}

/* サイズが大きいバリエーション（フッターCTA用） */
.c-tel--lg {
    justify-content: center;
    color: var(--color-white);
}

.c-tel--lg .c-tel__link {
    margin-top: 0.3em;
    font-size: 2.4rem;
    line-height: 1;
}

.c-tel--lg .c-tel__label {
    font-size: 1.4rem;
    font-weight: 500;
}

.c-tel--lg .c-tel__num {
    font-size: 3.6rem;
    font-weight: 500;
}

/* --- ボタン --- */
.c-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 400px;
    max-width: 100%;
    height: 80px;
    padding: 0 24px;
    font-size: var(--fs-md);
    font-weight: 600;
    transition: background-color var(--transition), color var(--transition);
}

.c-btn--outline {
    border: 1px solid var(--color-primary);
    background-color: var(--color-white);
    color: var(--color-primary);
}

.c-btn--outline:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.c-btn--outline:hover .c-arrow {
    background-color: var(--color-secondary);
}

.c-btn--primary {
    border: 1px solid var(--color-primary);
    background-color: var(--color-primary);
    color: var(--color-white);
}

.c-btn--primary .c-arrow {
    background-color: var(--color-secondary);
}

.c-btn--primary:hover {
    background-color: var(--color-white);
    color: var(--color-primary);
}

.c-btn--primary:hover .c-arrow {
    background-color: var(--color-primary);
}

.c-btn--secondary {
    border: 1px solid var(--color-secondary);
    background-color: var(--color-secondary);
    color: var(--color-white);
}

.c-btn--secondary:hover {
    background-color: var(--color-white);
    color: var(--color-secondary);
}

.c-btn--secondary:hover .c-arrow {
    background-color: var(--color-secondary);
}

/* 戻るボタン：矢印を左・逆向きに。中の input（CF7 Multi-Step Forms の [previous]）は文字だけに見せる */
.c-btn--back {
    justify-content: flex-start;
    cursor: pointer;
}

.c-btn--back .c-arrow img {
    transform: scaleX(-1);
}

.c-btn--back input {
    flex: 1;
    align-self: stretch;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

/* --- 丸角の矢印アイコン（一覧リンク・ボタンなどで共用） --- */
.c-arrow,
.c-banner__arrow {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 27px;
    transition: background-color var(--transition);
}

.c-arrow {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/* --- 一覧を見るリンク（全ページ共通） --- */
.c-more {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 70px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-primary);
    font-size: 1.7rem;
    font-weight: 600;
    color: var(--color-primary);
    transition: color var(--transition);
}

.c-more:hover {
    color: var(--color-secondary);
}

.c-more:hover .c-arrow {
    background-color: var(--color-secondary);
}

.c-more--white {
    color: var(--color-white);
    border-bottom-color: var(--color-white);
}

/* --- カテゴリータグ --- */
.c-tag {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 1.2rem;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.6;
}

/* --- サービスカード（アイコン + ラベル） --- */
.c-service {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 30px 10px;
    background-color: var(--color-primary-light);
}

.c-service__icon {
    width: 100px;
    height: 100px;
}

.c-service__icon img {
    width: 100%;
    height: 100%;
}

.c-service__label {
    font-size: clamp(1.4rem, 1.053rem + 0.924vw, 2rem);
    font-weight: 700;
    color: var(--color-primary);
    text-align: center;
}

/* --- 選ばれる理由リスト項目 --- */
.c-reason-item {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding-block: 30px;
    border-bottom: 1px solid var(--color-border);
}

.c-reason-item__num {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width: 70px;
    font-family: var(--font-en);
    color: var(--color-primary);
    text-align: center;
}

.c-reason-item__label {
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.c-reason-item__no {
    margin-top: 2px;
    font-size: 5rem;
    font-weight: 400;
    line-height: 1;
}

.c-reason-item__ttl {
    font-family: var(--font-mincho);
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0.05em;
    color: var(--color-primary);
}

.c-reason-item__text {
    margin-top: 8px;
    font-size: 1.6rem;
    line-height: 1.7;
    color: var(--color-text);
}

/* --- バナーカード（写真 + 見出し + 矢印） --- */
.c-banner__link {
    display: flex;
    align-items: stretch;
    height: 160px;
}

.c-banner__figure {
    flex-shrink: 0;
    width: 200px;
    height: 160px;
    overflow: hidden;
}

.c-banner__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-banner__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1 1 auto;
    padding-inline: 32px;
    background-color: var(--color-primary);
    color: var(--color-white);
    transition: background-color var(--transition);
}

.c-banner__link:hover .c-banner__body {
    background-color: var(--color-secondary);
}

.c-banner__en {
    font-family: var(--font-en);
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.c-banner__ja {
    font-family: var(--font-mincho);
    font-size: clamp(1.9rem, -0.365rem + 2.059vw, 2.6rem);
    font-weight: 700;
}

.c-banner__arrow {
    background-color: var(--color-white);
}

.c-banner__arrow img {
    width: 12px;
    height: 9px;
    filter: brightness(0) saturate(100%) invert(13%) sepia(96%) saturate(1477%) hue-rotate(203deg) brightness(93%) contrast(87%);
}

/* --- アイコン（画像ベース。単色マスクにしない意匠アイコン用） --- */
.c-icon {
    display: inline-block;
    flex-shrink: 0;
}

.c-icon--diagnosis {
    width: 26px;
    height: 26px;
    margin-right: 8px;
}

/* --- ハンバーガーボタン --- */
.c-drawer {
    position: relative;
    z-index: 102;
    display: none;
    flex-shrink: 0;
    align-self: flex-start;
    width: var(--header-height-tablet);
    height: var(--header-height-tablet);
    background-color: var(--color-secondary);
}

.c-drawer__bar {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 30px;
    height: 1px;
    margin: -0.5px 0 0 -15px;
    background-color: var(--color-white);
    transition: transform var(--transition);
}

.c-drawer__bar:nth-child(1) {
    transform: translateY(-5px);
}

.c-drawer__bar:nth-child(2) {
    transform: translateY(5px);
}

.c-drawer.is-open .c-drawer__bar:nth-child(1) {
    transform: translateY(0) rotate(45deg);
}

.c-drawer.is-open .c-drawer__bar:nth-child(2) {
    transform: translateY(0) rotate(-45deg);
}


/* ============================================================
   4. GLOBAL NAV（g-）
   ============================================================ */
.g-nav__items {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.g-nav__item {
    position: relative;
    margin-left: 28px;
}

.g-nav__item:first-child {
    margin-left: 0;
}

.g-nav__item > a {
    display: block;
    font-size: var(--fs-sm);
    font-weight: 600;
    white-space: nowrap;
}

.g-nav__item > a:hover {
    color: var(--color-secondary);
}

.g-nav__submenu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    display: none;
    width: 220px;
    margin-top: 15px;
    background-color: var(--color-white);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.g-nav__item--has-child:hover .g-nav__submenu {
    display: block;
}

.g-nav__item--has-child::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 15px;
}

.g-nav__submenu-item a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 278px;
    height: 50px;
    padding: 0 16px;
    border: 1px solid var(--color-primary);
    background-color: var(--color-white);
    font-size: var(--fs-sm);
    font-weight: 700;
}

.g-nav__submenu-item:hover a {
    color: var(--color-primary);
}

.g-nav__submenu-arrow {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background-color: var(--color-primary);
    color: var(--color-white);
    font-size: var(--fs-xs);
}

.g-nav__submenu-item:hover .g-nav__submenu-arrow {
    background-color: var(--color-secondary);
}


/* ============================================================
   5. PROJECT（p-）
   ============================================================ */

/* ------------------------------------------------------------
   5-1. HEADER
   ------------------------------------------------------------ */
.p-header__inner {
    display: flex;
    align-items: stretch;
    width: 100%;
}

.p-header__logo {
    position: relative;
    z-index: 102;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0 24px;
}

.p-header__logo img {
    width: clamp(140px, 116.89px + 6.164vw, 180px);
}

.p-header__main {
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    gap: 10px;
    min-width: 0;
    padding: 10px 20px;
}

.p-header__top {
    display: flex;
    justify-content: flex-end;
}

.p-header__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 100%;
    padding: 0 32px;
    background-color: var(--color-secondary);
    color: var(--color-white);
    font-size: var(--fs-sm);
    font-weight: 600;
    letter-spacing: 0.05em;
    transition: background-color var(--transition);
}

.p-header__btn:hover {
    background-color: var(--color-primary);
}

.p-header__btn--drawer {
    display: none;
}


/* ------------------------------------------------------------
   5-2. MV
   ------------------------------------------------------------ */
.p-mv {
    position: relative;
    overflow: hidden;
    padding-top: 50px;
    padding-bottom: 100px;
    padding-inline: clamp(20px, 11.33px + 2.311vw, 35px);
}

.p-mv::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: var(--color-primary);
    clip-path: polygon(70% 0, 100% 0, 100% 100%, 32% 100%);
}

.p-mv__inner,
.p-mv__figure {
    position: relative;
    z-index: 1;
}

.p-mv__ttl {
    font-family: var(--font-mincho);
    font-size: clamp(3.2rem, 1.871rem + 3.544vw, 5.5rem);
    font-weight: 700;
    line-height: 1.5;
    color: var(--color-text);
}

.p-mv__figure {
    position: relative;
    aspect-ratio: 750 / 400;
    margin-top: 40px;
}

.p-mv__slider {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: var(--color-white);
}

.p-mv__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.2s ease;
}

.p-mv__slide.is-active {
    opacity: 1;
}

.p-mv__slide picture {
    display: block;
    height: 100%;
}

.p-mv__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-mv__tags {
    position: absolute;
    top: 24px;
    left: 24px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.c-mv-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 25px;
    background-color: var(--color-primary);
    color: var(--color-white);
    font-family: var(--font-mincho);
    font-size: clamp(1.3rem, 1.011rem + 0.77vw, 1.8rem);
    font-weight: 700;
    text-align: center;
}

.p-mv__note {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    width: fit-content;
    max-width: 100%;
    padding: 30px;
    background-color: var(--color-white);
}

.p-mv__note p {
    font-size: clamp(1.4rem, 1.169rem + 0.616vw, 1.8rem);
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0.05em;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-3. REASON
   ------------------------------------------------------------ */
.p-reason {
    overflow: hidden;
    padding-bottom: 0;
}

.p-reason__row {
    display: flex;
    align-items: flex-end;
    gap: clamp(24px, 0.76px + 6.197vw, 90px);
    width: 100%;
    max-width: calc(var(--content-width) + var(--inner-padding) * 2);
    margin-inline: auto;
    padding-inline: var(--inner-padding);
}

.p-reason__body {
    flex: 0 0 clamp(300px, 44vw, 660px);
    width: clamp(300px, 44vw, 660px);
    max-width: 100%;
}

.p-reason__list {
    margin-top: 40px;
}

.p-reason__body .c-more {
    margin: 40px 0 60px;
}

.p-reason__figures {
    position: relative;
    flex: 0 0 clamp(300px, 43.33vw, 650px);
    width: clamp(300px, 43.33vw, 650px);
}

.p-reason__figure--01 {
    position: relative;
    z-index: 2;
    width: 59.33%;
    aspect-ratio: 445 / 564;
    margin-left: auto;
    margin-right: 6.13%;
    overflow: hidden;
}

.p-reason__figure--02 {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 750 / 630;
    margin-top: -6.13%;
    overflow: hidden;
}

.p-reason__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ------------------------------------------------------------
   5-4. SERVICES
   ------------------------------------------------------------ */
.p-services {
    position: relative;
    overflow: hidden;
}

.p-services::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: clamp(500px, -44.68px + 53.191vw, 700px);
    max-width: 60%;
    height: 100%;
    background-color: var(--color-primary);
    clip-path: polygon(0 0, 100% 0, 28% 100%, 0 100%);
}

.p-services__row {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 80px;
    max-width: calc(var(--content-width) + var(--inner-padding) * 2);
    margin-inline: auto;
    padding-inline: var(--inner-padding);
}

.p-services__figure {
    flex: 0 0 clamp(300px, 44.67vw, 670px);
    width: clamp(300px, 44.67vw, 670px);
    aspect-ratio: 670 / 560;
    margin-top: clamp(40px, -16.34px + 15.023vw, 200px);
    margin-left: calc(-1 * (var(--inner-padding) + max(0px, (100vw - var(--content-width) - var(--inner-padding) * 2) / 2)));
    overflow: hidden;
}

.p-services__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-services__body {
    flex: 0 0 clamp(300px, 50.3vw, 754px);
    padding: clamp(40px, -16.34px + 15.023vw, 200px) 0 clamp(40px, 8.31px + 8.451vw, 130px);
}

.p-services__items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    max-width: 780px;
    margin-top: 40px;
}

.p-services__body .c-more {
    margin-top: 50px;
}

.p-services__note {
    margin-top: 24px;
    padding: 10px;
    color: var(--color-text);
    font-size: clamp(1.8rem, 1.624rem + 0.469vw, 2.3rem);
    font-weight: 500;
    line-height: 1.8;
}


/* ------------------------------------------------------------
   5-5. FOR BUSINESS
   ------------------------------------------------------------ */
.p-for-business {
    max-width: var(--content-width);
    margin-inline: auto;
    padding-block: clamp(40px, 32.96px + 1.878vw, 60px);
    padding-inline: clamp(20px, 5.92px + 3.756vw, 60px);
    background-color: var(--color-primary-light);
}

.p-for-business__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 60px;
}

.p-for-business__body {
    flex: 1 1 420px;
    min-width: 280px;
}

.p-for-business__text {
    margin-top: 24px;
    font-size: var(--fs-md);
    line-height: 1.8;
    color: var(--color-text);
}

.p-for-business__body .c-more {
    margin-top: var(--space-xl);
}

.p-for-business__figure {
    flex: 1 1 560px;
    max-width: 660px;
}

.p-for-business__figure img {
    width: 100%;
    height: auto;
}


/* ------------------------------------------------------------
   5-6. BANNER
   ------------------------------------------------------------ */
.p-banners__items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 40px;
}

/* --- 3列表示（下層ページの関連リンク等） --- */
.p-banners__items--3col {
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 12.96px + 1.878vw, 40px);
}

.p-banners__items--3col .c-banner__link {
    height: 140px;
}

.p-banners__items--3col .c-banner__figure {
    width: 140px;
    height: 140px;
}

.p-banners__items--3col .c-banner__body {
    padding-inline: 28px;
}

.p-banners__items--3col .c-banner__en {
    font-size: 1.2rem;
}

.p-banners__items--3col .c-banner__ja {
    font-size: 2.2rem;
}

.p-banners__items--3col .c-banner__arrow {
    width: 38px;
    height: 25px;
}


/* ------------------------------------------------------------
   5-7. TOP NEWS（見出し写真）
   ------------------------------------------------------------ */
.p-top-news {
    width: 100%;
    height: 490px;
    background-image: url(../images/top/top-news.webp);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
}


/* ------------------------------------------------------------
   5-8. NEWS
   ------------------------------------------------------------ */
.p-news__items {
    max-width: 800px;
    margin-top: var(--space-2xl);
    margin-inline: auto;
}

.p-news-block {
    border-bottom: 1px solid var(--color-border);
}

.p-news-block:first-child {
    border-top: 1px solid var(--color-border);
}

.p-news-block__link {
    display: block;
    padding-block: 24px;
}

.p-news-block__meta {
    display: flex;
    align-items: center;
    gap: 16px;
}

.p-news-block__time {
    font-family: var(--font-en);
    font-size: var(--fs-sm);
    color: var(--color-text);
}

.p-news-block__title {
    margin-top: 12px;
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--color-text);
    transition: color var(--transition);
}

.p-news-block__link:hover .p-news-block__title {
    color: var(--color-secondary);
}

.p-news__button {
    display: flex;
    justify-content: center;
    margin-top: 45px;
}


/* ------------------------------------------------------------
   5-9. AREA
   ------------------------------------------------------------ */
.p-area {
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, var(--color-bg-blue) 0%, var(--color-primary-light) 53%, rgba(242, 247, 255, 0) 100%);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100% clamp(330px, 277px + 14.09vw, 480px);
}

.p-area__row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: clamp(30px, 19.44px + 2.817vw, 60px);
    margin-top: 40px;
}

.p-area__map {
    width: 46%;
    max-width: 100%;
}

.p-area__right {
    width: 46%;
    max-width: 100%;
}

.p-area__sub-ttl {
    display: inline-block;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-primary);
    font-family: var(--font-mincho);
    font-size: clamp(2.6rem, 1rem + 2.083vw, 4rem);
    font-weight: 700;
    color: var(--color-primary);
}

.p-area__text {
    margin-top: 24px;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2;
    letter-spacing: 0.05em;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-10. FOOTER
   ------------------------------------------------------------ */

/* --- CTA（フッター上部） --- */
.p-footer__cta {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 70px 0;
    color: var(--color-white);
}

.p-footer__cta-bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-image: url(../images/common/footer-bg.webp);
    background-position: center;
    background-size: cover;
}

.p-footer__cta-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--color-primary);
    opacity: 0.6;
    mix-blend-mode: multiply;
}

.p-footer__cta-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    background-color: var(--color-secondary);
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-align: center;
}

.p-footer__cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex: 1;
}

.p-footer__cta-ttl {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-en);
    font-size: var(--fs-cta-ttl);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0.05em;
}

.p-footer__cta-ttl::before {
    content: "";
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background-image: url(../images/common/icon-rectangle.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.p-footer__cta-txt {
    margin-top: 0.5em;
    font-family: var(--font-mincho);
    font-size: clamp(2.2rem, 1.4rem + 2vw, 3.3rem);
    font-weight: 700;
    line-height: 1.4;
}

.p-footer__cta-right {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 650px;
    width: 100%;
}

.p-footer__cta-tel-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.p-footer__cta-tel-group {
    width: 400px;
    max-width: 100%;
    text-align: center;
}

.p-footer__cta-mail-group {
    width: 400px;
    max-width: 100%;
    text-align: center;
}

.p-footer__cta-label {
    font-size: 1.8rem;
    font-weight: 600;
}

.p-footer__cta-time {
    margin-top: 0.3em;
    font-size: var(--fs-body);
}

.p-footer__cta-mail-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
}

.p-footer__cta-mail-box .c-btn {
    margin-top: 0.5em;
}

/* --- メイン（会社情報・フッターナビ） --- */
.p-footer__main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 460px;
    padding: 48px 0 24px;
    background-color: var(--color-primary);
    color: var(--color-white);
}

.p-footer__main-inner {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 40px;
}

.p-footer__logo img {
    width: 310px;
}

.p-footer__address {
    margin-top: 20px;
    font-size: var(--fs-sm);
    line-height: 1.9;
}

.p-footer__nav-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: clamp(20px, 16.48px + 0.939vw, 30px) clamp(24px, 18.37px + 1.502vw, 40px);
    width: 100%;
    max-width: 650px;
}

.p-footer__nav-list a {
    font-size: var(--fs-body);
    font-weight: 600;
}

.p-footer__nav-list a:hover {
    color: var(--color-secondary);
}

.p-footer__bottom {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 50px;
    padding-top: 50px;
}

.p-footer__bottom::before {
    content: "";
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
}

.p-footer__privacy a {
    font-size: 1.3rem;
}

.p-footer__privacy a:hover {
    color: var(--color-secondary);
}

.p-footer__copyright {
    font-size: var(--fs-xs);
}


/* ------------------------------------------------------------
   5-11. PAGE HEADER（下層ページ共通タイトル部）
   ------------------------------------------------------------ */
.p-page-header {
    position: relative;
    overflow: hidden;
    padding-block: clamp(50px, 5vw, 90px);
    border-bottom: 2px solid var(--color-border);
}

.p-page-header::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: clamp(280px, 42vw, 640px);
    height: 100%;
    background-color: var(--color-primary);
    clip-path: polygon(65% 0, 100% 0, 100% 100%, 5% 100%);
}

.p-news .p-page-header::before,
.p-news-detail .p-page-header::before,
.p-page-header--plain::before,
.p-works .p-page-header::before,
.p-works-detail .p-page-header::before {
    display: none;
}

.p-page-header__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 40px;
    max-width: calc(var(--content-width) + var(--inner-padding) * 2);
    margin-inline: auto;
    padding-inline: var(--inner-padding);
}

.p-page-header__body {
    flex: 1 1 360px;
}

.p-page-header__figure {
    flex: 1 1 420px;
    max-width: clamp(300px, 166.2px + 35.681vw, 680px);
    aspect-ratio: 1.618 / 1;
    overflow: hidden;
}

.p-page-header__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-page-header__ttl {
    margin-top: 12px;
    font-family: var(--font-mincho);
    font-size: clamp(3.4rem, 2.4rem + 3vw, 5.4rem);
    font-weight: 700;
    color: var(--color-text);
}



/* ------------------------------------------------------------
   5-12. BREADCRUMB
   ------------------------------------------------------------ */
.p-breadcrumb {
    margin-top: 16px;
}

.p-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 1.3rem;
    color: var(--color-text);
}

.p-breadcrumb__item a {
    color: var(--color-primary);
}

.p-breadcrumb__item a:hover {
    color: var(--color-secondary);
}

.p-breadcrumb__item:not(:last-child)::after {
    content: "/";
    margin: 0 8px;
    color: var(--color-text);
}

.p-breadcrumb__item[aria-current="page"] {
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-13. GREETING（代表挨拶／下層ページ共通）
   ------------------------------------------------------------ */
.p-greeting__row {
    display: flex;
    flex-wrap: nowrap;
    gap: 40px;
    margin-top: 40px;
}

.p-greeting__text {
    flex: 1 1 33.3%;
    font-size: 1.6rem;
    line-height: 2;
    color: var(--color-text);
}

.p-greeting__text p + p {
    margin-top: 1.6em;
}

.p-greeting__side {
    flex: 0 0 36.7%;
    align-self: flex-start;
    max-width: 100%;
}

.p-greeting__figure {
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.p-greeting__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-greeting__sign {
    margin-top: 16px;
    text-align: right;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-14. データテーブル（会社概要・許可番号など／下層ページ共通）
   ------------------------------------------------------------ */
.c-data-table {
    width: 100%;
    margin-top: 40px;
    border-collapse: collapse;
    font-size: 1.6rem;
}

.c-data-table th,
.c-data-table td {
    padding: 20px 24px;
    border: 1px solid var(--color-border-table);
    text-align: left;
    vertical-align: top;
}

.c-data-table th {
    width: 27%;
    background: #f7f7f7;
    font-weight: 600;
    color: var(--color-primary);
}

.c-data-table td {
    line-height: 1.8;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-15. ACCESS（アクセスマップ／下層ページ共通）
   ------------------------------------------------------------ */
.p-access__item {
    display: flex;
    flex-direction: column;
    margin-top: 40px;
}

.p-access__map {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: var(--color-bg-gray);
    color: var(--color-text);
    font-weight: 600;
}

.p-access__map iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.p-access__info {
    width: 100%;
}


/* ------------------------------------------------------------
   5-16. PHILOSOPHY（経営理念）
   ------------------------------------------------------------ */
.p-philosophy {
    margin-top: 40px;
    padding: 40px;
    background: linear-gradient(90deg, var(--color-bg-blue) 0%, var(--color-primary-light) 53%, rgba(242, 247, 255, 0) 100%);
    text-align: center;
}

.p-philosophy__catch {
    font-family: var(--font-mincho);
    font-size: clamp(2.6rem, 1rem + 2.083vw, 4rem);
    font-weight: 700;
    line-height: 1.7;
    letter-spacing: 0.05em;
    color: var(--color-primary);
}

.p-philosophy__text {
    margin-top: 24px;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    font-weight: 500;
    line-height: 2;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-17. PRIVACY（プライバシーポリシー本文）
   ------------------------------------------------------------ */
/* 本文幅を狭める（プライバシーポリシー・お問い合わせ） */
.l-inner--narrow {
    max-width: calc(1000px + var(--inner-padding) * 2);
}

.p-privacy__body {
    font-size: 1.5rem;
    line-height: 1.9;
    color: var(--color-text);
}

.p-privacy__heading .c-heading__ja {
    margin-top: 0;
}

.p-privacy__link-box {
    margin-top: var(--space-xl);
    padding-block: clamp(20px, 15.77px + 1.127vw, 32px);
    padding-inline: clamp(20px, 12.96px + 1.878vw, 40px);
    background-color: var(--color-primary-light);
}

.p-privacy__body .p-privacy__link-box p {
    margin-top: 0;
}

.p-privacy__body h3 {
    margin-top: 32px;
    font-family: var(--font-mincho);
    font-size: calc(var(--fs-ttl) * 0.5);
    font-weight: 700;
    color: var(--color-text);
}

.p-privacy__body p {
    margin-top: 16px;
}

.p-privacy__body ul {
    margin-top: 16px;
    padding-left: 1.4em;
    list-style-type: "・";
}

.p-privacy__body li {
    padding-left: 0.4em;
}

.p-privacy__body li + li {
    margin-top: 4px;
}

.p-privacy__body a {
    color: var(--color-primary);
    text-decoration: underline;
    word-break: break-all;
}

.p-privacy__body a:hover {
    color: var(--color-secondary);
}


/* ------------------------------------------------------------
   5-18. CONTACT（お問い合わせページ）
   ------------------------------------------------------------ */
.p-contact__lead {
    margin-inline: auto;
    text-align: center;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    font-weight: 500;
    line-height: 2;
    letter-spacing: 0.05em;
    color: var(--color-text);
}

.p-contact__tel-heading {
    margin-top: 60px;
}

.p-contact__tel {
    margin-top: 24px;
    padding: clamp(20px, 12.96px + 1.878vw, 40px);
    background-color: var(--color-primary-light);
}

.p-contact__tel-inner {
    padding: clamp(20px, 15.77px + 1.127vw, 32px);
    background-color: var(--color-white);
    text-align: center;
}

.p-contact__tel-link {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    font-family: var(--font-en);
    color: var(--color-primary);
}

.p-contact__tel-label {
    font-family: var(--font-ja);
    font-size: 2rem;
    font-weight: 700;
}

.p-contact__tel-num {
    font-size: clamp(2.8rem, 2.377rem + 1.127vw, 4rem);
    font-weight: 700;
}

.p-contact__tel-time {
    font-size: 1.8rem;
    color: var(--color-primary);
}

.p-contact__mail {
    margin-top: 80px;
}

/* 完了ページ */
.p-contact__thanks-lead {
    margin-top: 48px;
}

.p-contact__thanks-btn {
    display: flex;
    justify-content: center;
    margin-top: 56px;
}

/* --- フォーム --- */
.c-form {
    margin: 40px auto 0;
}

.c-form__row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    padding-block: 28px;
}

.c-form__label {
    display: flex;
    flex: 0 0 200px;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    color: var(--color-text);
}

.c-form__note {
    display: block;
    margin-top: 2px;
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--color-text);
}

.c-required {
    flex-shrink: 0;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-required);
}

.c-form__required-note {
    margin-top: 40px;
    margin-bottom: 16px;
    font-size: 1.3rem;
    color: var(--color-required);
}

.c-form__field {
    flex: 1 1 320px;
}

.c-form__input,
.c-form__textarea,
.c-form__select {
    width: 100%;
    padding: 18px 24px;
    border: 2px solid var(--color-primary-light);
    background-color: var(--color-primary-light);
    font-size: 1.5rem;
    color: var(--color-text);
    transition: border-color var(--transition), background-color var(--transition);
}

.c-form__input:focus,
.c-form__textarea:focus,
.c-form__select:focus {
    border-color: var(--color-secondary);
    background-color: var(--color-white);
    outline: none;
}

.c-form__textarea {
    min-height: 180px;
    resize: vertical;
}

.c-form__file {
    font-size: 1.4rem;
}

.c-form__privacy {
    margin-top: 32px;
    text-align: center;
    font-size: 1.5rem;
}

.c-form__privacy label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.c-form__privacy a {
    color: var(--color-primary);
    text-decoration: underline;
}

.c-form__privacy a:hover {
    color: var(--color-secondary);
}

.c-form__submit {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.c-form__submit .c-btn {
    font-size: 1.8rem;
}

/* 確認画面（Multi-Step Forms の [multiform] で入力値を表示） */
.c-form__lead {
    margin-top: 40px;
    text-align: center;
    font-size: clamp(1.5rem, 1.465rem + 0.094vw, 1.6rem);
    font-weight: 500;
    line-height: 1.9;
    color: var(--color-text);
}

/* フォームを囲む二重枠（.p-contact__tel と同じ） */
.c-form-box {
    margin-top: 24px;
    padding: clamp(20px, 12.96px + 1.878vw, 40px);
    background-color: var(--color-primary-light);
}

.c-form--boxed {
    margin: 0;
    padding: clamp(28px, 18.14px + 2.629vw, 56px);
    background-color: var(--color-white);
}

.c-form--boxed .c-form__row:first-child {
    padding-top: 0;
}

.c-form__value {
    display: flex;
    align-items: center;
    min-height: 100%;
    padding-block: 18px;
    font-size: 1.5rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.c-form__row--confirm {
    border-bottom: 1px solid var(--color-primary-light);
}

.c-form__submit--group {
    flex-wrap: wrap;
    gap: 16px 24px;
}

/* Contact Form 7 の出力要素 */
.wpcf7-form-control-wrap {
    display: block;
}

.c-form__privacy .wpcf7-form-control-wrap,
.c-form__privacy .wpcf7-list-item {
    display: inline;
    margin: 0;
}

.wpcf7-not-valid-tip {
    display: block;
    margin-top: 8px;
    font-size: 1.3rem;
    color: var(--color-required);
}

.c-form__input.wpcf7-not-valid,
.c-form__textarea.wpcf7-not-valid,
.c-form__select.wpcf7-not-valid {
    border-color: var(--color-required);
}

.wpcf7 form .wpcf7-response-output {
    margin: 32px 0 0;
    padding: 16px 24px;
    font-size: 1.4rem;
    text-align: center;
}

.wpcf7-spinner {
    align-self: center;
}

.wpcf7-previous {
    cursor: pointer;
}


/* ------------------------------------------------------------
   5-19. NEWS LIST（お知らせ＆コラム一覧）
   ------------------------------------------------------------ */
.p-news main .l-inner {
    max-width: calc(1400px + var(--inner-padding) * 2);
}

.p-news-tabs__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    margin-bottom: 48px;
}

.p-news-tabs__list li {
    width: 260px;
}

.p-news-tabs__list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-width: 260px;
    padding: 14px 20px;
    background-color: var(--color-bg-gray);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-text);
    transition: background-color var(--transition), color var(--transition);
}

.p-news-tabs__list a:hover {
    background-color: var(--color-primary-light);
}

.p-news-tabs__list a.is-active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.p-news-tabs__list a.is-active .c-arrow {
    background-color: var(--color-secondary);
}

.p-news-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

.c-news-card {
    padding: clamp(20px, 15.78px + 1.127vw, 32px);
    border-inline: 1px solid var(--color-border);
    transition: background-color var(--transition);
}

.c-news-card:hover {
    background-color: var(--color-primary-light);
}

.c-news-card__thumb {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.c-news-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition);
}

.c-news-card__link:hover .c-news-card__thumb img {
    transform: scale(1.05);
}

.c-news-card__body {
    padding-top: clamp(20px, 15.78px + 1.127vw, 32px);
}

.c-news-card__meta {
    display: flex;
    align-items: center;
    gap: 12px;
}

.c-news-card__date {
    font-family: var(--font-en);
    font-size: 1.3rem;
    color: var(--color-text);
}

.c-news-card__title {
    margin-top: 20px;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.7;
    color: var(--color-text);
    transition: color var(--transition);
}

.c-news-card__link:hover .c-news-card__title {
    color: var(--color-secondary);
}

.p-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 60px;
}

.p-pagination__item,
.p-pagination__ellipsis {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--color-text);
}

.p-pagination__item {
    border: 1px solid var(--color-border);
    transition: background-color var(--transition), color var(--transition);
}

.p-pagination__item:hover {
    background-color: var(--color-primary-light);
}

.p-pagination__item.is-current {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}


/* ------------------------------------------------------------
   5-20. NEWS DETAIL（お知らせ＆コラム詳細）
   ------------------------------------------------------------ */
.p-news-detail main .l-inner {
    max-width: calc(1000px + var(--inner-padding) * 2);
}

.p-news-detail__meta {
    display: flex;
    align-items: center;
    gap: 16px;
}

.p-news-detail__date {
    font-family: var(--font-en);
    font-size: 1.5rem;
    color: var(--color-text);
}

.p-news-detail__ttl {
    margin-top: 16px;
    font-family: var(--font-mincho);
    font-size: clamp(2.4rem, 1.977rem + 1.127vw, 3.6rem);
    font-weight: 700;
    line-height: 1.5;
    color: var(--color-text);
}

.p-news-detail__eyecatch {
    margin-top: 24px;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.p-news-detail__eyecatch img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-news-detail__body {
    margin-top: clamp(28px, 23.77px + 1.127vw, 40px);
    font-size: clamp(1.5rem, 1.465rem + 0.094vw, 1.6rem);
    line-height: 2;
    color: var(--color-text);
}

.p-news-detail__body p + p {
    margin-top: 1.6em;
}

.p-news-detail__body h2,
.p-news-detail__body h3,
.p-news-detail__body h4,
.p-news-detail__body h5,
.p-news-detail__body h6 {
    font-family: var(--font-ja);
    line-height: 1.5;
}

.p-news-detail__body > :first-child {
    margin-top: 0;
}

.p-news-detail__body h2 {
    margin-top: clamp(48px, 40.25px + 2.066vw, 70px);
    margin-bottom: clamp(16px, 13.18px + 0.751vw, 24px);
    font-size: clamp(2rem, 1.859rem + 0.376vw, 2.4rem);
    background: var(--color-primary-light);
    font-weight: 700;
    color: var(--color-text);
}

.p-news-detail__body h3 {
    margin-top: clamp(40px, 32.96px + 1.878vw, 60px);
    margin-bottom: clamp(14px, 11.89px + 0.563vw, 20px);
    font-size: clamp(1.8rem, 1.659rem + 0.376vw, 2.2rem);
    font-weight: 700;
    color: var(--color-text);
}

/* ブロックエディタの見出し（H2〜H6 共通の左線） */
.p-news-detail__body .wp-block-heading {
    padding: clamp(8px, 6.59px + 0.376vw, 12px) clamp(14px, 11.89px + 0.563vw, 20px);
    border-left: 4px solid var(--color-primary);
}

.p-news-detail__body h4 {
    margin-top: clamp(32px, 27.77px + 1.127vw, 44px);
    margin-bottom: clamp(12px, 9.89px + 0.563vw, 18px);
    font-size: clamp(1.7rem, 1.594rem + 0.282vw, 2rem);
    font-weight: 700;
    color: var(--color-text);
}

.p-news-detail__body h5 {
    margin-top: clamp(28px, 25.18px + 0.751vw, 36px);
    margin-bottom: clamp(12px, 10.59px + 0.376vw, 16px);
    font-size: clamp(1.6rem, 1.530rem + 0.188vw, 1.8rem);
    font-weight: 700;
    color: var(--color-text);
}

.p-news-detail__body h6 {
    margin-top: clamp(24px, 22.59px + 0.376vw, 28px);
    margin-bottom: clamp(10px, 8.59px + 0.376vw, 14px);
    font-size: clamp(1.5rem, 1.465rem + 0.094vw, 1.6rem);
    font-weight: 700;
    color: var(--color-text);
}

.p-news-detail__body ul,
.p-news-detail__body ol {
    margin-top: clamp(20px, 18.59px + 0.376vw, 24px);
    margin-bottom: clamp(20px, 18.59px + 0.376vw, 24px);
    padding-left: 1.6em;
}

.p-news-detail__body ul {
    list-style-type: disc;
}

.p-news-detail__body ol {
    list-style-type: decimal;
}

.p-news-detail__body li + li {
    margin-top: 8px;
}

.p-news-detail__body table {
    width: 100%;
    margin-top: clamp(20px, 18.59px + 0.376vw, 24px);
    margin-bottom: clamp(20px, 18.59px + 0.376vw, 24px);
    border-collapse: collapse;
    font-size: clamp(1.4rem, 1.365rem + 0.094vw, 1.5rem);
}

.p-news-detail__body th,
.p-news-detail__body td {
    padding: clamp(16px, 13.18px + 0.751vw, 24px) clamp(18px, 13.07px + 1.315vw, 32px);
    border: 1px solid var(--color-border-table);
    text-align: left;
    vertical-align: top;
}

.p-news-detail__body th {
    background: #f7f7f7;
    font-weight: 600;
    color: var(--color-primary);
}

/* ブロックエディタの表（figure.wp-block-table）。余白は figure 側に持たせる */
.p-news-detail__body .wp-block-table {
    margin-top: clamp(20px, 18.59px + 0.376vw, 24px);
    margin-bottom: clamp(20px, 18.59px + 0.376vw, 24px);
    overflow-x: auto;
}

.p-news-detail__body .wp-block-table table {
    margin-top: 0;
    margin-bottom: 0;
}

/* コアの thead 下線（3px）を打ち消す */
.p-news-detail__body .wp-block-table thead {
    border-bottom: 0;
}

.p-news-detail__body .wp-block-table figcaption {
    margin-top: 8px;
    font-size: 1.3rem;
    color: var(--color-muted);
}

/* ストライプ（ブロックエディタの表スタイル「ストライプ」） */
.p-news-detail__body .is-style-stripes th,
.p-news-detail__body .is-style-stripes td {
    border-width: 0 0 1px;
    border-color: var(--color-border-table);
}

.p-news-detail__body .is-style-stripes th {
    background: var(--color-primary);
    color: var(--color-white);
}

.p-news-detail__body .is-style-stripes tbody tr:nth-child(odd) {
    background: var(--color-primary-light);
}

.p-news-detail__body img {
    width: 100%;
    height: auto;
    margin-top: 24px;
    margin-bottom: 24px;
}

.p-news-detail__body a {
    color: var(--color-primary);
    text-decoration: underline;
    transition: color var(--transition);
}

.p-news-detail__body a:hover {
    color: var(--color-secondary);
}

/* BLOCK EDITOR PRESETS: ブロックエディタの色・文字サイズ（kunifuji/inc/block-editor.php と対応）
   フロントでは WordPress の global-styles を読み込まないため、ここで定義する */
.p-news-detail__body .has-primary-color {
    color: var(--color-primary) !important;
}

.p-news-detail__body .has-secondary-color {
    color: var(--color-secondary) !important;
}

.p-news-detail__body .has-light-blue-color {
    color: var(--color-bg-blue) !important;
}

.p-news-detail__body .has-pale-blue-color {
    color: var(--color-primary-light) !important;
}

.p-news-detail__body .has-red-color {
    color: var(--color-required) !important;
}

.p-news-detail__body .has-body-text-color {
    color: var(--color-text) !important;
}

.p-news-detail__body .has-white-color {
    color: var(--color-white) !important;
}

.p-news-detail__body .has-primary-background-color {
    background-color: var(--color-primary) !important;
}

.p-news-detail__body .has-secondary-background-color {
    background-color: var(--color-secondary) !important;
}

.p-news-detail__body .has-light-blue-background-color {
    background-color: var(--color-bg-blue) !important;
}

.p-news-detail__body .has-pale-blue-background-color {
    background-color: var(--color-primary-light) !important;
}

.p-news-detail__body .has-red-background-color {
    background-color: var(--color-required) !important;
}

.p-news-detail__body .has-body-text-background-color {
    background-color: var(--color-text) !important;
}

.p-news-detail__body .has-white-background-color {
    background-color: var(--color-white) !important;
}

/* 背景色を付けた段落は内側に余白を取る */
.p-news-detail__body p.has-background {
    padding: 1.2em 1.6em;
}

.p-news-detail__body .has-small-font-size {
    font-size: 1.4rem !important;
}

.p-news-detail__body .has-normal-font-size {
    font-size: 1.6rem !important;
}

.p-news-detail__body .has-large-font-size {
    font-size: 2rem !important;
}

.p-news-detail__body .has-x-large-font-size {
    font-size: 2.4rem !important;
}

.p-news-detail__pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: 800px;
    margin-inline: auto;
    margin-top: clamp(40px, 18.87px + 5.634vw, 100px);
    padding-top: 32px;
    border-top: 1px solid var(--color-border);
}

.p-news-detail__pager-arrow {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    transition: color var(--transition);
}

.p-news-detail__pager-arrow:hover {
    color: var(--color-secondary);
}


/* ------------------------------------------------------------
   5-21. FLOW（施工までの流れ）
   ------------------------------------------------------------ */
.p-flow-overview {
    margin-bottom: clamp(48px, 32px + 4vw, 80px);
}

.p-flow-overview__list {
    --ov-gap: clamp(24px, 16px + 1.2vw, 36px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--ov-gap);
}

.p-flow-overview__item {
    position: relative;
    display: flex;
    flex: 0 1 clamp(40px, 28px + 1.8vw, 52px);
    align-items: center;
    justify-content: center;
    min-width: 0;
    height: clamp(190px, 160px + 4.5vw, 230px);
    background-color: var(--color-primary-light);
    color: var(--color-primary);
    font-size: clamp(1.4rem, 1.2rem + 0.4vw, 1.8rem);
    font-weight: 600;
    letter-spacing: 0.1em;
    line-height: 1.4;
}

.p-flow-overview__item a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: inherit;
    transition: background-color var(--transition), color var(--transition);
}

.p-flow-overview__item a:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.p-flow-overview__item span {
    writing-mode: vertical-rl;
}

.c-flow-step {
    scroll-margin-top: calc(var(--header-height) + 20px);
}

.p-flow-overview__item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    width: 0;
    height: 0;
    margin-left: calc(var(--ov-gap) / 2 - 5px);
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 10px solid var(--color-primary);
    transform: translateY(-50%);
}

.p-flow__list {
    margin-inline: auto;
}

.p-flow__arrow {
    display: flex;
    justify-content: center;
    padding-top: 0;
    padding-bottom: clamp(24px, 16px + 2vw, 28px);
}

.p-flow__arrow::after {
    content: "";
    width: 0;
    height: 0;
    border-left: 60px solid transparent;
    border-right: 60px solid transparent;
    border-top: 28px solid var(--color-primary);
}

.c-flow-step {
    padding-block: clamp(32px, -17.23px + 4.808vw, 52px);
    padding-inline: clamp(40px, -9.23px + 4.808vw, 60px);
    border: 2px solid var(--color-primary);
    background-color: var(--color-white);
}

.c-flow-step__head {
    display: flex;
    align-items: center;
    gap: 16px;
}

.c-flow-step__num {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-sizing: border-box;
    width: 80px;
    height: 80px;
    border: 7px double var(--color-white);
    background-color: var(--color-primary);
    font-family: var(--font-en);
    color: var(--color-white);
    text-align: center;
}

.c-flow-step__label {
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.c-flow-step__no {
    margin-top: 2px;
    font-size: 3.2rem;
    font-weight: 400;
    line-height: 1;
}

.c-flow-step__ttl {
    font-family: var(--font-mincho);
    font-size: clamp(2.8rem, 2.659rem + 0.601vw, 3.2rem);
    font-weight: 700;
    color: var(--color-primary);
}

.c-flow-step__text {
    margin-top: 12px;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    line-height: 2;
    color: var(--color-text);
}

.c-flow-step__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 40px;
    margin-top: 2.5rem;
}

.c-flow-step__figure {
    flex: 0 0 38%;
    max-width: 100%;
    aspect-ratio: 1.618 / 1;
    overflow: hidden;
}

.c-flow-step__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-flow-step__detail {
    flex: 1 1 30%;
}

.c-flow-step__detail .c-flow-step__text:first-child {
    margin-top: 0;
}

.c-flow-step__list-box {
    margin-top: 32px;
    padding-block: clamp(20px, 14.37px + 1.502vw, 36px);
    padding-inline: clamp(24px, 18.37px + 1.502vw, 40px);
    background-color: var(--color-primary-light);
}

.c-flow-step__list-ttl {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary);
}

.c-flow-step__list {
    margin-top: 8px;
    column-count: 2;
    column-gap: 24px;
    font-weight: 600;
    line-height: 1.8;
    color: var(--color-text);
    list-style: none;
}

.c-flow-step__list li {
    position: relative;
    padding-block: 2px;
    padding-left: 1.2em;
}

.c-flow-step__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-secondary);
    transform: translateY(-50%);
}

.c-flow-step__contact-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-top: 20px;
}

.c-flow-step__contact-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: clamp(20px, -9.54px + 2.885vw, 32px);
    background-color: var(--color-primary-light);
    text-align: center;
}

.c-flow-step__contact-ttl {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary);
}

.c-flow-step__contact-tel {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 8px;
    font-family: var(--font-en);
    color: var(--color-primary);
}

.c-flow-step__contact-tel-label {
    font-family: var(--font-ja);
    font-size: 1.8rem;
    font-weight: 700;
}

.c-flow-step__contact-tel-num {
    font-size: clamp(2.2rem, 1.738rem + 1.233vw, 3rem);
    font-weight: 700;
}

.c-flow-step__contact-btn {
    gap: 10px;
    width: 260px;
    height: 56px;
    margin-top: 16px;
    margin-bottom: 12px;
    margin-inline: auto;
    padding: 0 20px;
    border-color: var(--color-secondary);
    background-color: var(--color-secondary);
    font-size: 1.5rem;
    color: var(--color-white);
}

.c-flow-step__contact-btn .c-arrow {
    width: 32px;
    height: 21px;
}

.c-flow-step__contact-note {
    font-size: 1.6rem;
}

.c-cta-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: clamp(24px, 18px + 2vw, 40px) clamp(24px, 18px + 3vw, 56px);
    background-color: var(--color-secondary);
}

.p-flow__list + .c-cta-banner {
    margin-top: 60px;
}

.c-cta-banner__text {
    font-family: var(--font-mincho);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.8;
    color: var(--color-white);
    text-align: left;
}

.c-cta-banner__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 340px;
    max-width: 100%;
    padding: 20px 28px;
    background-color: var(--color-white);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-text);
    transition: background-color var(--transition);
}

.c-cta-banner__btn--outline {
    border: 1px solid var(--color-white);
}

.c-cta-banner__btn:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.c-cta-banner__btn:hover .c-arrow {
    background-color: var(--color-secondary);
}

.c-banners-section {
    padding-block: clamp(40px, 24px + 4vw, 72px);
    background-color: var(--color-primary-light);
}

.c-banners-section .l-inner {
    max-width: calc(var(--content-width) + var(--inner-padding) * 2);
}

/* ------------------------------------------------------------
   5-22. MEDIA ROW（画像+テキストの汎用レイアウト）
   ------------------------------------------------------------ */
.p-media-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: clamp(40px, 32.96px + 1.878vw, 60px);
    margin-top: 40px;
}

.p-media-row__figure {
    flex: 1 1 50%;
    max-width: 100%;
    aspect-ratio: 1.618 / 1;
    overflow: hidden;
}

.p-media-row__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-media-row__body {
    flex: 1 1 50%;
}

.p-media-row__text {
    margin-top: 16px;
    font-size: 1.6rem;
    line-height: 1.9;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-23. RECRUIT（採用情報）
   ------------------------------------------------------------ */
.p-recruit-message,
.p-recruit-persona {
    position: relative;
    overflow: hidden;
}

.p-recruit-message .l-inner,
.p-recruit-persona .l-inner {
    position: relative;
    z-index: 1;
}

.p-benefit-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(24px, 18.37px + 1.502vw, 40px);
    margin-top: 40px;
}

.c-benefit-card {
    padding: 32px;
    background-color: var(--color-primary-light);
}

.c-benefit-card__ttl {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.6;
    color: var(--color-primary);
}

.c-benefit-card__text {
    margin-top: 16px;
    font-size: 1.4rem;
    line-height: 1.8;
    color: var(--color-text);
}

.p-recruit__entry {
    display: flex;
    justify-content: center;
    margin-top: 60px;
}


/* ------------------------------------------------------------
   5-24. ESG（ESGの取り組み）
   ------------------------------------------------------------ */
.p-esg-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(24px, 12px + 3vw, 40px);
    margin-top: 40px;
}

.c-esg-card {
    padding: clamp(16px, 14.59px + 0.376vw, 20px) clamp(20px, 15.77px + 1.127vw, 32px);
    background-color: var(--color-primary-light);
    text-align: center;
}

.c-esg-card--env {
    background-color: #95bc9a;
}

.c-esg-card--social {
    background-color: #58a9db;
}

.c-esg-card--gov {
    background-color: #e5a3a2;
}

.c-esg-card__icon {
    width: clamp(64px, 51.32px + 3.38vw, 90px);
    height: clamp(64px, 51.32px + 3.38vw, 90px);
    margin: 0 auto;
}

.c-esg-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.c-esg-card__en {
    margin-top: clamp(12px, 10.59px + 0.376vw, 16px);
    font-family: var(--font-en);
    font-size: clamp(1.6rem, 1.459rem + 0.376vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-white);
}

.c-esg-card__en::first-letter {
    font-size: 1.3em;
}

.c-esg-card__ja {
    margin-top: 4px;
    font-family: var(--font-mincho);
    font-size: clamp(2.4rem, 2.118rem + 0.751vw, 3.2rem);
    font-weight: 700;
    line-height: 1.4;
    color: var(--color-white);
}

.c-esg-card__desc {
    margin-top: 8px;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    line-height: 1.5;
    color: var(--color-white);
}

.p-esg-intro {
    margin-top: 60px;
    padding: clamp(40px, 24px + 3vw, 64px);
    background: linear-gradient(90deg, var(--color-bg-blue) 0%, var(--color-primary-light) 53%, rgba(242, 247, 255, 0) 100%);
    text-align: center;
}

.p-esg-intro__ttl {
    font-family: var(--font-mincho);
    font-size: 4rem;
    font-weight: 700;
    color: var(--color-primary);
}

.p-esg-intro__text {
    margin-top: 20px;
    font-size: 1.6rem;
    line-height: 2;
    color: var(--color-text);
}

.p-esg-pillar {
    margin-top: clamp(48px, 36.73px + 3.005vw, 80px);
}

.p-esg-pillar__divider {
    margin-top: 80px;
}

.p-esg-pillar__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    padding: clamp(14px, 11.89px + 0.563vw, 20px) clamp(20px, 15.77px + 1.127vw, 32px);
}

.p-esg-pillar--env .p-esg-pillar__head {
    background-color: #95bc9a;
}

.p-esg-pillar--social .p-esg-pillar__head {
    background-color: #58a9db;
}

.p-esg-pillar--gov .p-esg-pillar__head {
    background-color: #e5a3a2;
}

.p-esg-pillar__ttl {
    display: block;
    font-family: var(--font-en);
    font-size: clamp(1.3rem, 1.124rem + 0.469vw, 1.8rem);
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--color-white);
}

.p-esg-pillar__label {
    display: block;
    font-family: var(--font-mincho);
    font-size: clamp(2.6rem, 2.107rem + 1.315vw, 4rem);
    font-weight: 700;
    line-height: 1.3;
    color: var(--color-white);
}

.p-esg-pillar__icons {
    display: flex;
    flex-shrink: 0;
    gap: 10px;
}

.p-esg-pillar__icon {
    display: block;
    width: clamp(56px, 46.14px + 2.629vw, 84px);
    height: clamp(56px, 46.14px + 2.629vw, 84px);
}

.p-esg-pillar__icon img {
    width: 100%;
    height: 100%;
}

.p-esg-items {
    display: flex;
    flex-direction: column;
    gap: clamp(45px, 25.66px + 1.69vw, 60px);
    margin-top: clamp(40px, 34.37px + 1.502vw, 56px);
}

.c-esg-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: clamp(24px, 18.37px + 1.502vw, 40px);
}

.p-esg-pillar--social .c-esg-item {
    flex-direction: row-reverse;
}

.c-esg-item__figure {
    flex: 0 1 35%;
    max-width: 35%;
    aspect-ratio: 1.618 / 1;
    overflow: hidden;
}

.c-esg-item__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-esg-item__body {
    flex: 1 1 360px;
}

.c-esg-item__ttl {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary);
}

.c-esg-item__text {
    margin-top: 12px;
    font-size: 1.6rem;
    line-height: 1.9;
    color: var(--color-text);
}


/* ------------------------------------------------------------
   5-25. REASON（選ばれる理由）
   ------------------------------------------------------------ */

/* .p-reason-page__section > .l-inner {
    max-width: calc(var(--content-width) + var(--inner-padding) * 2);
} */

.p-reason-page__lead {
    margin-top: 24px;
    text-align: center;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    font-weight: 500;
    line-height: 1.9;
    color: var(--color-text);
}

.p-reason-page__items {
    margin-top: clamp(48px, 39.55px + 2.254vw, 72px);
}

.p-reason-page__items .p-media-row {
    position: relative;
    z-index: 0;
    margin-top: clamp(32px, 24.5px + 1.5vw, 48px);
    padding-block: clamp(24px, 32.96px + 1.878vw, 60px);
    padding-inline: clamp(20px, 5.92px + 3.756vw, 60px);
    border: 2px solid var(--color-primary);
    background-color: var(--color-white);
}


.p-reason-page__items .p-media-row__figure {
    position: relative;
    z-index: 1;
    flex: 0 1 40%;
    aspect-ratio: 1.618 / 1;
}

/* .p-reason-page__items .p-media-row:nth-of-type(odd)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: clamp(220px, 30vw, 420px);
    height: 100%;
    background-color: var(--color-primary);
    clip-path: polygon(0 0, 95% 0, 55% 100%, 0 100%);
} */

/* .p-reason-page__items .p-media-row:nth-of-type(even)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: clamp(220px, 30vw, 420px);
    height: 100%;
    background-color: var(--color-primary);
    clip-path: polygon(45% 0, 100% 0, 100% 100%, 5% 100%);
} */

.p-reason-page__items .p-media-row:first-child {
    margin-top: 0;
}


/* ------------------------------------------------------------
   5-26. BUSINESS（事業案内）
   ------------------------------------------------------------ */
/* --- 導入文＋工程アンカー --- */
.p-business-hero__lead {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-inline: auto;
    text-align: center;
    font-family: var(--font-mincho);
    font-size: clamp(2.2rem, 1.966rem + 1.002vw, 2.6rem);
    font-weight: 700;
    line-height: 1.9;
    color: var(--color-primary);
}

.p-business-hero__lead-line {
    display: inline-block;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--color-primary);
}

.p-business-hero__chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.c-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 22px;
    border: 1px solid var(--color-white);
    border-radius: 999px;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--color-white);
    transition: background-color var(--transition), color var(--transition);
}

.c-chip:hover {
    background-color: var(--color-white);
    color: var(--color-primary);
}

.c-chip--outline {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.c-chip--outline:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/* --- メンテナンスの流れ図（調→直→守→保） --- */

.c-heading__ja-sub {
    display: block;
    font-size: 80%;
    font-weight: 600;
}

.p-flow-diagram {
    --flow-gap: 48px;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: var(--flow-gap);
    margin-top: 32px;
}

.c-flow-badge-card {
    position: relative;
    display: flex;
    flex: 1 1 160px;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 40px 16px 24px;
    background-color: var(--color-primary-light);
    text-align: center;
}

.c-flow-badge-card:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    width: 15px;
    height: 15px;
    margin-left: calc(var(--flow-gap) / 2 - 7.5px);
    border-top: 1.5px solid var(--color-secondary);
    border-right: 1.5px solid var(--color-secondary);
    transform: translateY(-50%) rotate(45deg);
}

.c-flow-badge-card__badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
}

.c-flow-badge-card__badge img {
    width: 100%;
    height: auto;
}

.c-flow-badge-card__name {
    font-size: clamp(1.4rem, 1.053rem + 0.924vw, 2rem);
    font-weight: 700;
    color: var(--color-primary);
    text-align: center;
}

.c-flow-badge-card__desc {
    font-size: 1.3rem;
    color: var(--color-text);
}

/* --- 工程セクション（調べる／直す／守る） --- */
.p-process-section {
    padding-block: 60px;
    scroll-margin-top: calc(var(--header-height) + 20px);
}

.p-business-process-wrap {
    padding-block: clamp(48px, 24px + 5.2vw, 90px);
    background-color: var(--color-primary-light);
}

.p-business-process-wrap .c-process-card {
    border: 1px solid color-mix(in srgb, var(--color-primary) 10%, var(--color-primary-light));
    background-color: var(--color-white);
}

.p-process-section__head {
    display: flex;
    flex-direction: column;
}

.p-process-section__step {
    flex-shrink: 0;
    padding: 4px 12px;
    background-color: var(--color-primary);
    font-family: var(--font-en);
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-white);
}

.p-process-section__ttl {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-text);
}

.p-process-section__note {
    font-size: 1.3rem;
    color: var(--color-text);
}

.p-process-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    margin-top: clamp(20px, 16.48px + 0.939vw, 30px);
}

.p-process-grid--3col {
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.p-process-grid--3col .c-process-card {
    padding: clamp(18px, 13.07px + 1.315vw, 32px);
}

.c-process-card {
    background-color: var(--color-primary-light);
    padding: clamp(20px, 11.2px + 2.347vw, 45px);
}

.c-process-card__figure {
    width: 100%;
    aspect-ratio: 1.618 / 1;
    overflow: hidden;
}

.c-process-card__figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.c-process-card:hover .c-process-card__figure img {
    transform: scale(1.05);
}

.c-process-card__ttl {
    margin-top: clamp(12px, 9.18px + 0.751vw, 20px);
    font-size: clamp(1.6rem, 1.354rem + 0.657vw, 2.3rem);
    font-weight: 700;
    color: var(--color-primary);
}

.c-process-card__text {
    margin-top: 8px;
    font-size: 1.6rem;
    line-height: 1.9;
    color: var(--color-text);
}

/* --- STEP04「保つ」：濃紺フルワイド帯＋矢印リンク --- */
.p-business-cta-banner {
    padding-block: calc(var(--section-gap) / 3);
    scroll-margin-top: calc(var(--header-height) + 20px);
}

.c-cta-banner--primary {
    background-color: var(--color-primary);
}

.c-cta-banner--business {
    margin-top: calc(var(--section-gap) * -0.5);
}

/* --- 最終CTA：直前セクションとの間隔 --- */
.l-section-group .l-section.p-business-final {
    padding-top: 40px;
}


/* ------------------------------------------------------------
   5-26b. OWNER（法人オーナー様へ）
   ------------------------------------------------------------ */
.p-owner-row {
    display: flex;
    gap: clamp(40px, 32.96px + 1.878vw, 60px);
    margin-top: clamp(28px, 21px + 1.878vw, 48px);
}

.p-owner-row__figure {
    flex: 45 1 0;
}

.p-owner-row__figure > img {
    width: 100%;
    aspect-ratio: 1.618 / 1;
    object-fit: cover;
}

.p-owner-row__body {
    flex: 55 1 0;
}

.p-owner-row--center {
    align-items: center;
    justify-content: center;
}

.p-owner-row--center .p-owner-row__figure {
    flex: 0 0 35%;
}

.p-owner-row--center .p-owner-row__body {
    flex: 1 1 0;
    min-width: 0;
}

.p-owner-row__figure--illust > img {
    aspect-ratio: auto;
    object-fit: contain;
}

.p-owner-row__ttl {
    font-family: var(--font-mincho);
    font-size: clamp(2.2rem, 1.9rem + 0.9vw, 2.8rem);
    font-weight: 700;
    line-height: 1.5;
    color: var(--color-primary);
    text-align: center;
}

.p-owner-row__ttl > span {
    display: inline-block;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--color-primary);
}

/* --- ノーティスボックス（入居者の目線） --- */
.p-owner-notice {
    margin-top: clamp(60px, 40px + 5vw, 100px);
    padding: clamp(24px, 14px + 2.6vw, 56px);
    border: 2px solid var(--color-primary);
    background-color: var(--color-white);
}

.p-owner-row__body .p-owner-row__ttl {
    margin-bottom: 16px;
    text-align: left;
}

.p-owner-text {
    font-size: 1.6rem;
    line-height: 1.9;
    color: var(--color-text);
}

.p-owner-text + .p-owner-text {
    margin-top: 24px;
}

.p-owner-check li,
.p-owner-list li {
    font-size: 1.6rem;
    line-height: 2;
    color: var(--color-text);
}

/* --- チェックリスト（お悩み） --- */
.p-owner-check li {
    --check-pad: 8px;
    position: relative;
    padding-block: var(--check-pad);
    padding-left: 2.2em;
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-primary);
}

.p-owner-check li:not(:last-child) {
    border-bottom: 1px solid var(--color-border);
}

.p-owner-check li::before {
    content: "";
    position: absolute;
    top: calc(0.4em + var(--check-pad));
    left: 0;
    width: 1.5em;
    height: 1.2em;
    background: url(../images/common/icon-check.svg) center / contain no-repeat;
    filter: brightness(0) saturate(100%) invert(30%) sepia(85%) saturate(997%) hue-rotate(192deg) brightness(97%) contrast(90%);
}
.p-owner-list {
    margin-top: 16px;
}

.p-owner-list + .p-owner-text,
.p-owner-check + .p-owner-text,
.p-owner-text + .p-owner-check {
    margin-top: 16px;
}

.p-owner-list li {
    position: relative;
    padding-left: 1.2em;
}

.p-owner-list li::before {
    content: "・";
    position: absolute;
    left: 0;
}

/* --- 目に見えない建物の傷み（薄い青背景） --- */
.l-section-group .l-section.p-owner-damage {
    padding-block: var(--section-gap);
    background-color: var(--color-primary-light);
}

.l-section-group .p-owner-damage + .l-section {
    padding-top: var(--section-gap);
}

.p-owner-damage .p-owner-row__body {
    flex: 55 1 0;
}

.p-owner-damage .p-owner-row__figure {
    flex: 45 1 0;
}

/* --- 劣化の進み方 --- */
.p-owner-steps__ttl {
    margin-top: 20px;
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary);
    text-align: center;
}

.p-owner-steps__list {
    --steps-label: clamp(48px, 40px + 1.6vw, 64px);
    display: flex;
}

/* ラベルは固定幅、ラベル間（矢印の左右余白）が広がる */
.p-owner-steps__item {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

.p-owner-steps__item:last-child {
    flex: 0 0 var(--steps-label);
}

.p-owner-steps__label {
    display: flex;
    flex: 0 0 var(--steps-label);
    align-items: center;
    justify-content: center;
    padding-top: 24px;
    padding-bottom: 24px;
    border: 2px solid var(--color-primary);
    background-color: var(--color-white);
    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    line-height: 1.4;
    color: var(--color-primary);
    writing-mode: vertical-rl;
}

.p-owner-steps__item:not(:last-child)::after {
    content: "";
    flex: 1 1 0;
    align-self: center;
    min-width: 32px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 24'%3E%3Cpath d='M0 0 10 12 0 24z' fill='%231a3a6d'/%3E%3C/svg%3E") center / 10px 24px no-repeat;
}
/* --- こまめなお手入れがおすすめな理由 --- */
.p-owner-reasons {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: clamp(32px, 24px + 2.2vw, 56px);
}

.c-owner-reason {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 32px clamp(16px, 10px + 1.2vw, 24px) 24px;
    background-color: var(--color-primary-light);
    text-align: center;
}

.c-owner-reason__no {
    font-family: var(--font-en);
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1;
    color: var(--color-primary);
}

.c-owner-reason__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
    margin-top: 16px;
}

.c-owner-reason__icon img {
    width: auto;
    height: 100%;
}

.c-owner-reason__ttl {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3em;
    margin-top: 20px;
    font-size: clamp(1.8rem, 1.6rem + 0.4vw, 2.1rem);
    font-weight: 700;
    line-height: 1.5;
    color: var(--color-primary);
}

.c-owner-reason__text {
    margin-top: 16px;
    font-size: 1.5rem;
    line-height: 1.8;
    color: var(--color-text);
    text-align: left;
}

/* --- 工事の機会に、建物全体を見直す（背景色付き） --- */
.l-section-group .l-section.p-owner-review {
    padding-block: var(--section-gap);
    background-color: var(--color-primary-light);
}

.l-section-group .p-owner-review + .l-section {
    padding-top: var(--section-gap);
}

/* --- 国藤産業が大切にしていること（背景色付き） --- */
.l-section-group .l-section.p-owner-value {
    padding-block: var(--section-gap);
    background-color: var(--color-primary-light);
}

.p-owner-value .p-owner-row__body {
    flex: 55 1 0;
}

.p-owner-value .p-owner-row__figure {
    flex: 45 1 0;
}

.p-owner-lead {
    margin-top: clamp(20px, 17.18px + 0.751vw, 28px);
    text-align: center;
    font-size: clamp(1.6rem, 1.53rem + 0.188vw, 1.8rem);
    font-weight: 500;
    line-height: 1.9;
    color: var(--color-text);
}

.c-compare-table {
    --compare-alt: #5a6a86;
    width: 100%;
    margin-top: clamp(32px, 25.66px + 1.69vw, 50px);
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.c-compare-table th {
    padding: 24px 16px;
    border: 1px solid var(--color-secondary);
    background-color: var(--color-secondary);
    font-size: clamp(1.8rem, 1.6rem + 0.4vw, 2.2rem);
    font-weight: 700;
    color: var(--color-white);
    text-align: center;
}

/* --- 各セル --- */
.c-compare-table td {
    position: relative;
    padding: 16px;
    border-bottom: 1px solid #777777;
    background-color: var(--color-white);
    font-size: clamp(1.3rem, 1.176rem + 0.331vw, 1.6rem);
    font-weight: 500;
    line-height: 1.9;
    color: var(--color-primary);
    text-align: center;
    vertical-align: middle;
}

/* --- 評価マーク（左：○ / 右：△） --- */
.c-compare-table td::before {
    content: "";
    display: block;
    width: 28px;
    height: 28px;
    margin: 0 auto 8px;
}

.c-compare-table td:first-child::before {
    border: 3px solid var(--color-secondary);
    border-radius: 50%;
}

.c-compare-table td:last-child::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M14 3.5 25 24.5H3z' fill='none' stroke='%235a6a86' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --- 左列：まとめて行う場合（強調） --- */
.c-compare-table th:first-child,
.c-compare-table td:first-child {
    border-right: 3px solid var(--color-primary);
    border-left: 3px solid var(--color-primary);
}

.c-compare-table th:first-child {
    border-top: 3px solid var(--color-primary);
}

.c-compare-table tr:last-child td:first-child {
    border-bottom: 3px solid var(--color-primary);
}

/* --- 右列：別々に行う場合 --- */
.c-compare-table th:last-child {
    border-color: #96a2b8;
    border-left: 0;
    background-color: #96a2b8;
}

.c-compare-table td:last-child {
    border-right: 1px solid var(--compare-alt);
}

.c-compare-table tr:last-child td:last-child {
    border-bottom: 1px solid var(--compare-alt);
}
.p-owner-cycle {
    max-width: 1000px;
    margin-top: clamp(28px, 21px + 1.878vw, 48px);
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.p-owner-cycle img {
    width: 100%;
    height: auto;
}

/* --- 相談ボタン --- */
.p-owner-cta {
    margin-top: clamp(48px, 32px + 4vw, 80px);
}

.p-owner-cta .c-btn {
    width: fit-content;
    margin-inline: auto;
}


/* ------------------------------------------------------------
   5-27. WORKS（施工実績一覧）
   ------------------------------------------------------------ */
.p-works main .l-inner {
    max-width: calc(1400px + var(--inner-padding) * 2);
}

.p-works-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    margin-bottom: 48px;
}

.p-works-filter__group {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 260px;
}

.p-works-filter__tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-width: 260px;
    padding: 14px 20px;
    background-color: var(--color-bg-gray);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-text);
    transition: background-color var(--transition), color var(--transition);
}

.p-works-filter__tab:hover {
    background-color: var(--color-primary-light);
}

.p-works-filter__group.is-open .p-works-filter__tab,
.p-works-filter__group:focus-within .p-works-filter__tab {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.p-works-filter__group.is-open .p-works-filter__tab .c-arrow,
.p-works-filter__group:focus-within .p-works-filter__tab .c-arrow {
    background-color: var(--color-secondary);
}

.p-works-filter__tab .c-arrow img {
    transition: transform var(--transition);
}

.p-works-filter__group.is-open .p-works-filter__tab .c-arrow img,
.p-works-filter__group:focus-within .p-works-filter__tab .c-arrow img {
    transform: rotate(90deg);
}

.p-works-filter__panel {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    display: none;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 12px;
}

.p-works-filter__group.is-open .p-works-filter__panel,
.p-works-filter__group:focus-within .p-works-filter__panel {
    display: flex;
}

.p-works-filter__sub {
    width: 100%;
    padding: 20px 24px;
    background-color: var(--color-white);
    border: 2px solid var(--color-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.p-works-filter__sub li + li {
    margin-top: 8px;
}

.p-works-filter__sub li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-border);
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.6;
    color: var(--color-text);
    text-align: left;
    transition: color var(--transition), border-color var(--transition);
}

.p-works-filter__sub li a .c-arrow {
    width: 22px;
    height: 15px;
}

.p-works-filter__sub li a:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.p-works-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

.c-work-card {
    display: block;
    padding: clamp(24px, 18.37px + 1.502vw, 40px);
    border-inline: 1px solid var(--color-border);
    transition: background-color var(--transition);
}

.c-work-card:hover {
    background-color: var(--color-primary-light);
}

.c-work-card__thumb {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.c-work-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition);
}

.c-work-card__link:hover .c-work-card__thumb img {
    transform: scale(1.05);
}

/* 縦長・極端な横長（2:1 超）の画像：切り抜かず全体を収め、余白はグレー（判定は PHP） */
.c-work-card__thumb--contain {
    background-color: #f5f5f5;
}

.c-work-card__thumb--contain img {
    object-fit: contain;
}

/* デフォルト画像（.c-noimage）のときだけ枠線。ホバーで画像が拡大しても枠が欠けないよう外側の枠に付ける */
.c-news-card__thumb:has(> .c-noimage),
.c-work-card__thumb:has(> .c-noimage) {
    border: 2px solid #f5f5f5;
}

.c-work-card__thumb--compare {
    display: flex;
    gap: 2px;
}

.c-work-card__thumb-item {
    position: relative;
    flex: 1 1 50%;
    height: 100%;
    overflow: hidden;
}

.c-work-card__thumb-label {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 1;
    padding: 3px 10px;
    background-color: color-mix(in srgb, var(--color-primary) 60%, transparent);
    font-family: var(--font-en);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--color-white);
}

.c-work-card__thumb-label--after {
    background-color: color-mix(in srgb, var(--color-secondary) 80%, transparent);
}

.c-work-card__body {
    padding-top: clamp(24px, 18.37px + 1.502vw, 40px);
}

.c-work-card__meta {
    display: flex;
    align-items: center;
    gap: 12px;
}

.c-work-card__date {
    font-family: var(--font-en);
    font-size: 1.3rem;
    color: var(--color-text);
}

.c-work-card__title {
    margin-top: 20px;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.7;
    color: var(--color-text);
    transition: color var(--transition);
}

.c-work-card__link:hover .c-work-card__title {
    color: var(--color-secondary);
}


.p-works-more {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

/* ------------------------------------------------------------
   5-28. WORKS DETAIL（施工実績詳細）
   ------------------------------------------------------------ */
.p-works-detail main .l-inner {
    max-width: calc(1000px + var(--inner-padding) * 2);
}

.p-works-detail__meta {
    display: flex;
    align-items: center;
    gap: 16px;
}

.p-works-detail__date {
    font-family: var(--font-en);
    font-size: 1.5rem;
    color: var(--color-text);
}

.p-works-detail__ttl {
    margin-top: 16px;
    font-family: var(--font-mincho);
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.5;
    color: var(--color-text);
}

.p-works-detail__eyecatch {
    position: relative;
    margin-top: 24px;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.p-works-detail__eyecatch-track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.4s ease;
}

.p-works-detail__eyecatch-slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
}

.p-works-detail__eyecatch img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 縦長・極端な横長（2:1 超）の画像：切り抜かず全体を収め、余白はグレー（判定は PHP） */
.p-works-detail__eyecatch-slide--contain {
    background-color: #f5f5f5;
}

.p-works-detail__eyecatch-slide--contain img {
    object-fit: contain;
}

.p-works-detail__eyecatch-dots {
    position: absolute;
    bottom: 16px;
    left: 50%;
    z-index: 1;
    display: flex;
    gap: 8px;
    transform: translateX(-50%);
}

.p-works-detail__eyecatch-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.6);
    transition: background-color var(--transition), transform var(--transition);
}

.p-works-detail__eyecatch-dot:hover {
    background-color: var(--color-white);
}

.p-works-detail__eyecatch-dot.is-active {
    background-color: var(--color-white);
    transform: scale(1.3);
}

.p-works-detail__eyecatch-nav {
    position: absolute;
    top: 50%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%);
    transition: background-color var(--transition);
}

.p-works-detail__eyecatch-nav:hover {
    background-color: var(--color-secondary);
}

.p-works-detail__eyecatch-nav::before {
    content: "";
    width: 12px;
    height: 12px;
    border-style: solid;
    border-color: var(--color-white);
    border-width: 0 1px 1px 0;
}

.p-works-detail__eyecatch-nav--prev {
    left: 20px;
}

.p-works-detail__eyecatch-nav--prev::before {
    margin-left: 2px;
    transform: rotate(135deg);
}

.p-works-detail__eyecatch-nav--next {
    right: 20px;
}

.p-works-detail__eyecatch-nav--next::before {
    margin-left: -2px;
    transform: rotate(-45deg);
}

.p-works-detail__catch {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 24px;
}

.p-works-detail__catch-item {
    position: relative;
    flex: 1 1 300px;
    aspect-ratio: 3 / 4;
    overflow: hidden;
}

.p-works-detail__catch--single .p-works-detail__catch-item {
    flex-basis: 100%;
    aspect-ratio: 16 / 9;
}

.p-works-detail__catch-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-works-detail__catch-label {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1;
    padding: 7px 20px;
    background-color: color-mix(in srgb, var(--color-primary) 60%, transparent);
    backdrop-filter: blur(4px);
    font-family: var(--font-en);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--color-white);
}

.p-works-detail__catch-label--after {
    background-color: color-mix(in srgb, var(--color-secondary) 80%, transparent);
}

.p-works-detail__specs {
    margin-top: 40px;
}

.p-works-detail__specs-item {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    padding-block: 24px;
    border-bottom: 1px solid var(--color-border);
}

.p-works-detail__specs-item dt {
    flex: 0 0 140px;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primary);
}

.p-works-detail__specs-item dd {
    flex: 1 1 300px;
    font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-text);
}

.p-works-detail__gallery-block {
    margin-top: 60px;
}

.p-works-detail__gallery-heading {
    padding: 12px;
    background-color: var(--color-primary-light);
    font-size: 2.4rem;
    font-weight: 700;
    text-align: left;
    color: var(--color-primary);
}

.p-works-detail__gallery-row {
    display: grid;
    gap: 16px;
    margin-top: 24px;
}

.p-works-detail__gallery-row + .p-works-detail__gallery-row {
    margin-top: 16px;
}

.p-works-detail__gallery-row--2col {
    grid-template-columns: repeat(2, 1fr);
}

.p-works-detail__gallery-row--3col {
    grid-template-columns: repeat(3, 1fr);
}

.p-works-detail__gallery-row img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

/* 行の画像がすべて縦長のときだけ 3:4（テンプレートで判定して --portrait を付与）。横長が混ざる行は 4:3 にそろえる */
.p-works-detail__gallery-row--portrait img {
    aspect-ratio: 3 / 4;
}

/* 1列の行で縦長だと大きくなりすぎるため幅を絞って中央に置く */
.p-works-detail__gallery-row--1col.p-works-detail__gallery-row--portrait img {
    max-width: 600px;
    margin-inline: auto;
}

.p-works-detail__pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: 800px;
    margin-inline: auto;
    margin-top: clamp(40px, 18.87px + 5.634vw, 100px);
    padding-top: 32px;
    border-top: 1px solid var(--color-border);
}

.p-works-detail__pager-arrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    transition: color var(--transition);
}

.p-works-detail__pager-arrow:hover {
    color: var(--color-secondary);
}

.p-works-detail__pager-arrow--prev::before,
.p-works-detail__pager-arrow--next::after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
}

.p-works-detail__pager-arrow--prev::before {
    transform: rotate(-135deg);
}

.p-works-detail__pager-arrow--next::after {
    transform: rotate(45deg);
}


/* ------------------------------------------------------------
   5-29. HISTORY（沿革）
   ------------------------------------------------------------ */
.p-history {
    display: grid;
    grid-template-columns: auto 24px 1fr;
    column-gap: 32px;
    margin-top: 40px;
    padding: clamp(40px, 24px + 3vw, 64px);
    background: linear-gradient(90deg, var(--color-bg-blue) 0%, var(--color-primary-light) 53%, rgba(242, 247, 255, 0) 100%);
}

.p-history__item {
    display: contents;
}

.p-history__date {
    grid-column: 1;
    padding-block: 20px;
    font-family: var(--font-en);
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-primary);
}

.p-history__dot {
    position: relative;
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.p-history__dot::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    background-color: var(--color-primary);
    transform: translateX(-50%);
}

.p-history__item:first-child .p-history__dot::before {
    top: 50%;
}

.p-history__item:last-child .p-history__dot::before {
    bottom: 50%;
}

.p-history__dot::after {
    content: "";
    position: relative;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-color: var(--color-primary);
}

.p-history__text {
    grid-column: 3;
    padding-block: 20px;
    font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-text);
}

/* ============================================================
   6. UTILITY（u-）
   ============================================================ */
.u-hidden-pc {
    display: none;
}

/* PCのみ改行させる（768px以下で無効化） */
.u-br-pc {
    display: block;
}

/* SPのみ改行させる（769px以上で無効化） */
.u-br-sp {
    display: none;
}

/* 視覚的には隠すが読み上げは可能にする */
.u-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}


/* ============================================================
   RESPONSIVE / MEDIA QUERIES
   ============================================================ */

/* --- 1024px以上：ヘッダーロゴ / MVのフォント・比率調整（デスクトップ側の段階） --- */
@media (min-width: 1024px) {
    .p-header__logo img {
        width: clamp(180px, -436.67px + 46.667vw, 310px);
    }

    .p-mv {
        padding-inline: clamp(35px, -1.92px + 3.606vw, 50px);
    }

    .p-mv__ttl {
        font-size: clamp(5.5rem, 0.577rem + 4.808vw, 7.5rem);
    }

    .p-mv__figure {
        aspect-ratio: 1500 / 640;
    }

    .c-mv-tag {
        font-size: clamp(1.8rem, -1.154rem + 2.885vw, 3rem);
    }

    .p-mv__note p {
        font-size: clamp(1.8rem, 0.815rem + 0.962vw, 2.2rem);
    }
}

/* --- 1200px：サービスラベルを16px固定に / フッターCTAテキストを縮小 / バナー3列→2列 --- */
@media (max-width: 1200px) {
    .c-service__label {
        font-size: 1.6rem;
    }

    .p-footer__cta-txt {
        font-size: clamp(1.8rem, 1.436rem + 0.97vw, 2.6rem);
    }

    .p-footer__cta-ttl {
        font-size: clamp(2.4rem, 1.218rem + 3.152vw, 5rem);
    }

    .p-banners__items--3col {
        grid-template-columns: repeat(2, 1fr);
    }

    .p-banners__items--3col .c-banner__body {
        gap: 12px;
        padding-inline: 20px;
    }

    .p-banners__items--3col .c-banner__arrow {
        width: 34px;
        height: 22px;
    }
}

/* --- 1400px：SERVICESのbody/figure比率を調整（bodyを広く、figureを狭く） --- */
@media (max-width: 1400px) {
    .p-services__figure {
        flex-basis: clamp(300px, 38vw, 670px);
        width: clamp(300px, 38vw, 670px);
    }

    .p-services__body {
        flex-basis: clamp(300px, 58vw, 754px);
    }

    .p-services::before {
        width: clamp(350px, 77.66px + 26.596vw, 450px);
    }

    .p-banners__items--3col .c-banner__ja {
        font-size: clamp(1.6rem, 1.38rem + 0.585vw, 2.2rem);
    }
}

/* --- 1340px：グローバルナビをドロワーに切り替え --- */
@media (max-width: 1340px) {
    .l-header {
        height: var(--header-height-tablet);
    }

    .p-header__logo {
        padding: 0 16px;
    }

    .p-header__top {
        display: none;
    }

    .p-header__btn {
        display: none;
    }

    .g-nav {
        position: fixed;
        top: 0;
        right: -100%;
        z-index: 100;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        overflow-y: auto;
        background-color: var(--color-white);
        transition: right var(--transition);
    }

    .g-nav.is-open {
        right: 0;
    }

    .g-nav__items {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 100px 20px 40px;
        text-align: center;
    }

    .g-nav__item {
        width: 100%;
        margin-left: 0;
    }

    .g-nav__item > a {
        padding: 12px 0;
        font-size: 1.6rem;
    }

    .g-nav__submenu {
        position: static;
        width: auto;
        box-shadow: none;
    }

    .g-nav__item--has-child:hover .g-nav__submenu {
        display: none;
    }

    .g-nav__item--has-child.is-open .g-nav__submenu {
        display: block;
    }

    .g-nav__item--has-child.is-open > a::after {
        transform: translateY(25%) rotate(-135deg);
    }

    .g-nav__submenu-item a {
        margin-inline: auto;
    }

    .g-nav__item--has-child::after {
        content: none;
    }

    .g-nav__item--has-child > a {
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .g-nav__item--has-child > a::after {
        content: "";
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: translateY(-25%) rotate(45deg);
    }

    .p-header__btn--drawer {
        display: flex;
        width: auto;
        height: 64px;
        margin: 0 20px 30px;
    }

    .c-drawer {
        display: block;
    }
}

/* --- 1100px：バナーカードをコンパクトに --- */
@media (max-width: 1100px) {
    .c-banner__link {
        height: 130px;
    }

    .c-banner__figure {
        width: 150px;
        height: 130px;
    }

    .c-banner__body {
        gap: 12px;
        padding-inline: 20px;
    }

    .c-banner__en {
        font-size: 1.2rem;
    }

    .c-banner__ja {
        font-size: 1.9rem;
        line-height: 1.3;
        letter-spacing: 0;
    }

    .c-banner__arrow {
        width: 36px;
        height: 24px;
    }
}

/* --- 1024px：タブレット時のレイアウト調整 --- */
@media (max-width: 1024px) {
    .p-page-header__figure {
        max-width: clamp(300px, 22.5px + 36vw, 420px);
    }

    .p-page-header__ttl {
        font-size: clamp(3.4rem, 2.4rem + 2.4vw, 4.8rem);
    }

    .p-flow-diagram {
        --flow-gap: 36px;
        flex-wrap: nowrap;
    }

    .c-flow-badge-card {
        flex-basis: 0;
        min-width: 0;
    }

    .p-business-hero__lead {
        display: block;
    }

    .p-business-hero__lead-line {
        display: inline;
        padding-bottom: 0;
        border-bottom: 0;
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 0.3em;
    }

    .p-works-filter {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .p-works-filter__group {
        width: 100%;
    }

    .p-works-filter__tab {
        min-width: 0;
    }

    /* .p-reason-page__items .p-media-row:nth-of-type(odd)::before,
    .p-reason-page__items .p-media-row:nth-of-type(even)::before {
        height: 60%;
    } */

    .p-news-tabs__list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .p-news-tabs__list li {
        width: 100%;
    }

    .p-news-tabs__list a {
        min-width: 0;
        white-space: nowrap;
    }

    .p-news-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .p-process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .p-works-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .p-banners__items {
        gap: 20px;
    }

    .p-mv {
        padding-bottom: 90px;
    }

    .p-mv__note {
        bottom: -28px;
    }

    .p-mv::before {
        inset: auto 0 0 auto;
        width: clamp(355px, 294.33px + 16.179vw, 460px);
        aspect-ratio: 460 / 457;
        clip-path: polygon(61.3% 0, 100% 0, 100% 100%, 0 100%);
    }

    .p-services::before {
        max-width: 40%;
    }

    .p-services__row {
        margin-right: 40px;
    }

    .p-services__items {
        grid-template-columns: repeat(2, 1fr);
    }

    .p-top-news {
        height: 320px;
    }

    .p-footer__cta-inner {
        flex-wrap: wrap;
    }

    .p-footer__cta-right {
        max-width: none;
        margin-top: 30px;
    }

    .p-owner-reasons {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* --- 800px：フロー詳細の問い合わせ欄の1カラム化 --- */
@media (max-width: 800px) {
    .c-flow-step__contact-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* --- 768px：コンテンツレイアウトの1カラム化 --- */
@media (max-width: 768px) {
    .p-business-hero__lead {
        text-align: left;
    }

    .p-page-header::before {
        top: auto;
        bottom: 0;
        width: clamp(240px, 21vw, 320px);
        height: 66%;
    }

    .p-page-header__inner {
        flex-wrap: wrap;
    }

    .p-page-header__figure {
        flex-basis: 100%;
        max-width: none;
        margin-left: calc(-1 * var(--inner-padding));
    }

    .p-benefit-grid {
        grid-template-columns: 1fr;
    }

    .p-greeting__row {
        flex-direction: column;
    }

    .p-greeting__side {
        display: contents;
    }

    .p-greeting__figure {
        order: -1;
    }

    .p-greeting__sign {
        order: 1;
        margin-top: 0;
    }

    .c-data-table,
    .c-data-table tbody,
    .c-data-table tr,
    .c-data-table th,
    .c-data-table td {
        display: block;
        width: 100%;
    }

    .c-data-table th {
        border-bottom: none;
    }

    .p-contact__lead {
        text-align: left;
    }

    .p-reason-page__lead {
        text-align: left;
    }

    .c-flow-step__row {
        gap: 20px;
    }

    .c-flow-step {
        padding-block: 24px;
        padding-inline: 24px;
    }

    .p-reason-page__items .p-media-row {
        padding-block: 24px;
        padding-inline: 24px;
    }

    .c-flow-step__num {
        width: 64px;
        height: 64px;
    }

    .c-flow-step__ttl {
        font-size: 2.4rem;
    }

    .c-flow-step__label {
        font-size: 1rem;
    }

    .c-flow-step__no {
        font-size: 2.6rem;
    }

    .c-flow-step__figure {
        flex: 1 1 100%;
    }

    .p-media-row {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
            "heading"
            "figure";
        gap: 16px;
    }

    .p-media-row__body {
        display: contents;
    }

    .p-media-row__body .c-flow-step__head,
    .p-media-row__body .c-heading {
        grid-area: heading;
    }

    .p-media-row__figure,
    .p-reason-page__items .p-media-row__figure {
        grid-area: figure;
        flex: 1 1 100%;
    }

    .p-reason-page__items .p-media-row__figure {
        overflow: visible;
        margin: 20px 0 0;
    }

    /* .p-reason-page__items .p-media-row:nth-of-type(2n+1)::before,
    .p-reason-page__items .p-media-row:nth-of-type(2n)::before {
        content: none;
    } */

    /* .p-reason-page__items .p-media-row:nth-of-type(2n+1) .p-media-row__figure::before {
        content: "";
        position: absolute;
        top: -24px;
        bottom: -24px;
        left: calc(-1 * (clamp(20px, 5.92px + 3.756vw, 60px) + 2px));
        z-index: -1;
        width: clamp(220px, 30vw, 420px);
        background-color: var(--color-primary);
        clip-path: polygon(0 0, 95% 0, 55% 100%, 0 100%);
    } */

    /* .p-reason-page__items .p-media-row:nth-of-type(2n) .p-media-row__figure::before {
        content: "";
        position: absolute;
        top: -24px;
        bottom: -24px;
        right: calc(-1 * (clamp(20px, 5.92px + 3.756vw, 60px) + 2px));
        z-index: -1;
        width: clamp(220px, 30vw, 420px);
        background-color: var(--color-primary);
        clip-path: polygon(45% 0, 100% 0, 100% 100%, 5% 100%);
    } */

    .p-news-detail__pager {
        flex-wrap: wrap;
        justify-content: center;
        gap: 20px 16px;
    }

    .p-news-detail__pager-arrow {
        flex: 1 1 40%;
        font-size: 1.4rem;
    }

    .p-news-detail__pager-arrow--prev {
        order: 1;
    }

    .p-news-detail__pager-arrow--next {
        order: 2;
        text-align: right;
    }

    .p-news-detail__pager .c-more {
        order: 3;
        flex-basis: 100%;
        justify-content: center;
        gap: 20px;
    }

    .p-news-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .c-news-card__title {
        font-size: 2rem;
    }

    .c-form__row {
        padding-block: 20px;
    }

    .p-process-grid,
    .p-process-grid--3col {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .p-esg-cards {
        grid-template-columns: 1fr;
    }

    .p-esg-intro__text {
        text-align: left;
    }

    .c-esg-item__figure {
        flex-basis: 100%;
        max-width: 100%;
    }

    .p-works-grid {
        grid-template-columns: 1fr;
    }

    .c-work-card {
        padding-block: 28px;
        padding-inline: 0;
        border-inline: none;
        border-bottom: 1px solid var(--color-border);
    }

    .c-work-card__body {
        padding-top: 28px;
        padding-inline: 4px;
    }

    .p-works-filter,
    .p-news-tabs__list {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .p-works-detail__gallery-row--2col,
    .p-works-detail__gallery-row--3col {
        grid-template-columns: 1fr;
    }

    .p-history {
        grid-template-columns: auto 20px 1fr;
        column-gap: 16px;
    }

    .p-history__date {
        font-size: 1.5rem;
    }

    .c-flow-step__list {
        column-count: 1;
    }

    .u-br-pc {
        display: none;
    }

    .u-br-sp {
        display: block;
    }

    .p-flow-diagram {
        --flow-gap: 28px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        row-gap: 20px;
    }

    .p-flow-overview__list {
        --ov-gap: 18px;
    }

    .p-flow-overview__item {
        height: 170px;
        font-size: 1.3rem;
        letter-spacing: 0.05em;
    }

    .p-flow-overview__item:not(:last-child)::after {
        width: 10px;
        height: 10px;
        margin-left: calc(var(--ov-gap) / 2 - 6px);
    }

    .c-flow-badge-card {
        padding: 28px 12px 20px;
    }

    .c-flow-badge-card:nth-child(even)::after {
        display: none;
    }

    .g-nav__item > a {
        padding: 6px 0;
    }

    .p-mv__figure {
        aspect-ratio: 355 / 365;
        margin-inline: -10px;
    }

    .p-services::before {
        top: 400px;
        left: -60px;
        height: 500px;
    }

    .c-service {
        padding: 16px 0;
    }

    .c-service__icon {
        width: 80px;
        height: 80px;
    }

    .c-service__label {
        font-size: 1.4rem;
    }

    .p-services__row {
        display: grid;
        margin-right: 0;
        grid-template-areas:
            "heading"
            "figure"
            "note"
            "items"
            "button";
        gap: 24px;
        padding-bottom: 40px;
    }

    .p-services__body {
        display: contents;
    }

    .p-services__body .c-heading {
        grid-area: heading;
    }

    .p-services__figure {
        grid-area: figure;
        width: 100%;
        margin-top: 0;
    }

    .p-services__note {
        grid-area: note;
        margin-top: 0;
        font-size: var(--fs-body);
        text-align: right;
    }

    .p-services__items {
        grid-area: items;
        margin-top: 0;
    }

    .p-services__body .c-more {
        grid-area: button;
        justify-self: start;
        margin-top: 15px;
    }

    .p-for-business__inner {
        display: grid;
        grid-template-areas:
            "heading"
            "figure"
            "text"
            "button";
        gap: 24px;
    }

    .p-for-business__body {
        display: contents;
    }

    .p-for-business__body .c-heading {
        grid-area: heading;
    }

    .p-for-business__text {
        grid-area: text;
        margin-top: 0;
        font-size: var(--fs-body);
    }

    .p-for-business__body .c-more {
        grid-area: button;
        justify-self: start;
        margin-top: 0;
    }

    .p-for-business__figure {
        grid-area: figure;
        max-width: 100%;
    }

    .c-banner__link,
    .p-banners__items--3col .c-banner__link {
        height: 110px;
    }

    .c-banner__figure,
    .p-banners__items--3col .c-banner__figure {
        width: 110px;
        height: 110px;
    }

    .c-banner__body,
    .p-banners__items--3col .c-banner__body {
        gap: 0;
        padding-inline: 16px;
    }

    .c-banner__en,
    .p-banners__items--3col .c-banner__en {
        font-size: 1.1rem;
    }

    .c-banner__ja {
        font-size: 1.8rem;
    }

    .c-banner__arrow,
    .p-banners__items--3col .c-banner__arrow {
        width: 32px;
        height: 22px;
    }

    .p-top-news {
        height: auto;
        aspect-ratio: 750 / 982;
        background-image: url(../images/top/top-news-sp.webp);
    }

    .l-header {
        height: auto;
    }

    .c-heading__en {
        font-size: 1.6rem;
    }

    .c-heading__ja {
        font-size: 3rem;
    }

    .p-for-business .c-heading__ja--sm {
        font-size: 3rem;
    }

    .p-footer__cta-ttl {
        font-size: 4rem;
    }

    .c-btn {
        height: 64px;
        font-size: 1.8rem;
    }


    .p-mv__tags {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        top: -20px;
        left: 10px;
        right: 10px;
        gap: 5px;
    }

    .c-mv-tag {
        width: 100%;
        padding: 10px 14px;
    }

    .p-mv__note {
        left: 0;
        bottom: -30px;
        width: 85%;
        max-width: 100%;
        padding: 20px;
    }


    .p-reason__row {
        display: block;
    }

    .p-reason__body {
        width: 100%;
    }

    .p-reason__figures {
        width: auto;
        margin-top: 0;
        margin-right: calc(-1 * var(--inner-padding));
        margin-bottom: 40px;
    }

    .p-reason__figure--01 {
        width: 47.4667vw;
    }

    .p-reason__figure--02 {
        width: 80vw;
        margin-left: auto;
    }

    .c-reason-item {
        flex-direction: column;
        gap: 16px;
    }

    .c-reason-item__ttl {
        font-size: 2.3rem;
    }

    .p-area__map {
        width: 100%;
        padding-inline: 15px;
    }

    .p-area__right {
        width: 100%;
        margin-top: 0;
    }

    .p-area__sub-ttl {
        display: block;
        width: 100%;
        font-size: 2.6rem;
    }

    .p-area__text {
        font-size: 1.4rem;
    }

    .p-footer__cta-inner {
        display: block;
    }

    .p-footer__cta-right {
        display: block;
        margin-top: 32px;
    }

    .p-footer__cta-banner {
        margin-bottom: 24px;
        padding: 9px 8px;
        font-size: 1.5rem;
        letter-spacing: 0;
    }

    .c-form__privacy {
        text-align: left;
    }

    /* Inline flow so the text wraps naturally */
    .c-form__privacy label {
        display: inline;
    }

    .c-form__privacy input[type="checkbox"] {
        margin-right: 8px;
        vertical-align: middle;
    }

    .p-footer__cta-tel-box {
        display: block;
        margin-bottom: 24px;
        text-align: left;
    }

    .p-footer__cta-tel-group {
        width: 100%;
        text-align: left;
    }

    .p-footer__cta-label {
        margin-bottom: 16px;
    }

    /* Enable tel links on mobile */
    .c-tel__link {
        pointer-events: auto;
    }

    .p-footer__cta-tel-group .c-tel--lg {
        justify-content: flex-start;
    }

    .p-footer__cta-time {
        margin-top: 8px;
        text-align: left;
    }

    .p-footer__cta-mail-box {
        display: block;
        padding-top: 0;
        border-top: none;
        text-align: left;
    }

    .p-footer__cta-mail-group {
        width: 100%;
        text-align: left;
    }

    .p-footer__cta-mail-box .c-btn {
        width: 100%;
        margin-top: 12px;
    }

    .p-footer__main {
        height: auto;
        padding: 40px 0;
    }

    .p-footer__main-inner {
        display: block;
    }

    .p-footer__nav {
        margin-top: 32px;
    }

    .p-footer__nav-list {
        justify-content: flex-start;
    }

    .p-footer__nav-list a {
        font-size: 1.5rem;
    }

    .p-footer__bottom {
        display: block;
        margin-top: 30px;
        padding-top: 30px;
    }

    .p-footer__privacy {
        margin-bottom: 20px;
    }

    .p-owner-row,
    .p-owner-row--center {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
    }

    .p-owner-row--center .p-owner-row__figure {
        align-self: center;
        flex: none;
        width: 80%;
    }

    .p-owner-row--center .p-owner-row__body {
        flex: none;
    }

    .p-owner-lead {
        text-align: left;
    }

    .c-compare-table th {
        padding: 16px 8px;
    }

    .c-compare-table td {
        padding: 16px 12px;
    }

    .p-owner-cta .c-btn {
        width: 100%;
    }
}

/* --- 600px：バナー一覧の1カラム化 --- */
@media (max-width: 600px) {
    .p-banners__items {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .p-news-grid {
        grid-template-columns: 1fr;
    }

    .c-news-card {
        padding-block: 28px;
        padding-inline: 0;
        border-inline: none;
        border-bottom: 1px solid var(--color-border);
    }

    .c-news-card__thumb {
        aspect-ratio: 16 / 9;
    }

    .c-news-card__body {
        padding-top: 28px;
        padding-inline: 4px;
    }

    .c-news-card__date {
        font-size: 1.4rem;
    }

    .c-news-card__title {
        margin-top: 16px;
    }

    .p-flow-overview__list {
        --ov-gap: 16px;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 52px));
        justify-content: center;
        row-gap: 16px;
        column-gap: var(--ov-gap);
    }

    .p-flow-overview__item:nth-child(5n)::after {
        display: none;
    }

    .p-owner-reasons {
        grid-template-columns: 1fr;
    }
}