@font-face {
    font-family: 'MOBO';
    src: url('../assets/fonts/MOBO-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ====================================
   CSS変数（カラー・サイズ定義）
==================================== */
:root {
    /* カラー */
    --color-primary: #D2141D;
    /* メインカラー（赤） */
    --color-text: #2F2F2F;
    /* テキストカラー */
    --color-white: #FFFFFF;
    --color-black: #000000;

    /* フォントファミリー */
    --font-sans: 'Noto Sans JP', sans-serif;
    --font-serif: 'Shippori Mincho', serif;
    --font-pop: 'MOBO', sans-serif;

    /* スペーシング（余白を統一） */
    --space-xs: 8px;
    --space-sm: 16px;
    --space-md: 24px;
    --space-lg: 40px;
    --space-xl: 80px;

    /* コンテンツ幅 */
    --content-width-lg: 1000px;
    /* 広い方 */
    --content-width-md: 880px;
    /* 狭い方 */
}

/* ====================================
   リセット・基本設定
==================================== */

/* すべての要素にborder-boxを適用 */
/* 説明: paddingとborderをwidthに含める。幅計算が超楽になる */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* HTML基本設定 */
html {
    font-size: 62.5%;
    /* 1rem = 10px（計算しやすい） */
    scroll-behavior: smooth;
    /* アンカーリンクがスムーズスクロール */
}

/* BODY基本設定 */
body {
    margin: 0;
    padding: 0;
    font-family: var(--font-sans);
    font-size: 1.6rem;
    /* 16px */
    line-height: 1.8;
    color: var(--color-text);
    font-feature-settings: 'palt';
    /* 自動カーニング（文字詰め） */
    -webkit-font-smoothing: antialiased;
    /* macOSでフォントを滑らかに */
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    /* 横スクロール防止 */
    min-height: 100vh;
    /* 最低限画面いっぱいの高さ */
}

.sp {
    display: none;
}

@media (max-width: 767px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

}

/* 画像の基本設定 */
img {
    max-width: 100%;
    /* 親要素からはみ出さない */
    height: auto;
    /* 縦横比を保つ */
    vertical-align: bottom;
    /* 画像下の謎の隙間を消す */
}

/* リンクの基本設定 */
a {
    color: inherit;
    /* 親要素の色を継承 */
    text-decoration: none;
    /* 下線を消す */
    transition: opacity 0.3s ease;
    /* ホバー時の透明度変化を滑らかに */
}

a:hover {
    opacity: 0.7;
    /* ホバー時に少し薄くなる */
}

/* フォーカス時のアウトライン（アクセシビリティ） */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* ボタンのリセット */
button {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    color: inherit;
}

/* リストのスタイルリセット */
ul,
ol {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 見出しのリセット */
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-weight: normal;
}

/* 段落のリセット */
p {
    margin: 0;
}

/* ====================================
   ユーティリティクラス（再利用可能）
==================================== */


/* PC版で非表示 */
.u-hidden-pc {
    display: none;
}

/* SP版で非表示 */
@media (max-width: 767px) {
    .u-hidden-sp {
        display: none;
    }

    .u-hidden-pc {
        display: block;
    }
}

/* 幅1000pxのコンテナ */
.u-container-lg {
    width: 100%;
    max-width: var(--content-width-lg);
    margin: 0 auto;
    padding: 0 var(--space-md);
    /* 左右の余白 */
}

/* 幅880pxのコンテナ */
.u-container-md {
    width: 100%;
    max-width: var(--content-width-md);
    margin: 0 auto;
    padding: 0 var(--space-md);
}

/* ====================================
   セクション共通スタイル
==================================== */
.section {
    padding-top: 80px;
    padding-bottom: 80px;
    /* 下の余白も統一しとく？ */
}

/* ====================================
   セクション見出し共通スタイル
==================================== */

.section-title-wrapper {
    text-align: center;
    margin-bottom: 9.0rem;
}

.section-title {
    position: relative;
    display: inline-block;
    padding-top: 6rem;
    /* アイコン66px + 余白16px */
    font-family: var(--font-serif);
    font-size: 4.6rem;
    /* 36px */
    font-weight: 600;
    color: var(--color-text);
    text-align: center;
    /* 中央揃え */
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% + 40px);
    /* タイトル幅 + 左右20pxずつ */
    height: 1px;
    background-color: #4E4E4E;
}

.section-title::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    /* 横中央 */
    width: 66px;
    height: 66px;
    background-image: url(../assets/logo.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* 最初の文字を赤色に */
.section-title__emphasis {
    color: var(--color-primary);
}

.section-title__emphasis::before {
    content: '';
    position: absolute;
    left: -4px;
    bottom: -4px;
    width: 2px;
    height: 28px;
    background-color: var(--color-primary);
}

/* ====================================
   FVセクション
==================================== */
.fv {
    width: 100%;
    height: 100vh;
    /* 画面いっぱい */
    background-image: url('../assets/Fv_pc.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* ====================================
   aboutセクション
==================================== */

.about {
    width: 100%;
    background-image: url(../assets/About_bg-pc.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    gap: 10px;
    object-fit: cover;
}

.about .section-title-wrapper {
    margin-bottom: 60px;
}

.about__lead {
    font-family: var(--font-serif);
    font-size: 3.2rem;
    font-weight: 600;
    text-align: center;
    margin-bottom: 24px;
    /* leadとtextの間 */
}

.about__lead span {
    color: var(--color-primary);
}

.about__text {
    font-family: var(--font-serif);
    font-size: 1.6rem;
    text-align: center;
    line-height: 1.8;
    max-width: 800px;
    margin: 0 auto;
    margin-bottom: 32px;
}


.about__partnership {
    display: flex;
    gap: 40px;
    align-items: center;
    padding: 40px;
    box-shadow: 0px 1px 4px 0px #d6d6d6;
    border-radius: 8px;
    background-color: #FEFEFE;
}


.about__partnership-title {
    display: inline-block;
    padding-left: 4px;
    font-size: 2.4rem;
    font-weight: 600;
    border-bottom: 1px solid var(--color-primary);
    border-left: 5px solid var(--color-primary);
    margin-bottom: 20px;

}

.about__partnership-image {
    flex-shrink: 0;
    max-width: 400px;
}


/* ====================================
   staffセクション
==================================== */


.staff {
    width: 100%;
    background-image: url(../assets/Intro_bg-pc.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    gap: 10px;
    object-fit: cover;
}

.staff .section-title {
    font-family: var(--font-pop);
}

.staff__item {
    display: flex;
    align-items: center;
    margin-top: 8.0rem;
    justify-content: space-between;
}

.staff__item:first-of-type {
    margin-top: 0;
}

.staff__item:last-of-type {
    flex-direction: row-reverse;
}

.staff__name {
    display: inline;
    font-family: var(--font-pop);
    font-size: 2.8rem;
    margin-bottom: 2.4rem;
    position: relative;
}

.staff__name span {
    color: var(--color-primary);
}


.staff__name::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    width: 200px;
    height: 2px;
    background-color: var(--color-primary);
    margin-left: 16px;
}

.staff__image {
    max-width: 38.4rem;
}


/* ====================================
   serviceセクション
==================================== */



.service {
    background-color: #f5f5f5;
    background-image:
        linear-gradient(to right, #EFE1E1 1px, transparent 1px),
        linear-gradient(to bottom, #EFE1E1 1px, transparent 1px);
    background-size: 36px 36px;
}

.service__item-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8rem;
}

.service__item {
    padding: 8.0rem 6.0rem;
    background-color: #FEFEFE;
    border-radius: 8px;
    box-shadow: 0px 1px 4px 0px #d6d6d6;
}


.service__titleWrapper {
    text-align: center;
    position: relative;
}

.service__title {
    font-family: var(--font-serif);
    font-size: 2.8rem;
    font-weight: 900;
    color: var(--color-text);
    margin: 0 auto;
    margin-bottom: 4.0rem;
    position: relative;
    display: inline-block;
    align-items: baseline;
    /* 文字のベースラインを揃える */
    z-index: 0;
}

.service__number {
    font-family: 'Allison', cursive;
    /* Google Fontsから読み込んだ場合 */
    font-size: 5.8rem;
    /* 大きめに */
    color: #E3A9AC;
    position: absolute;
    top: -44px;
    left: -20px;
    /* 左端に配置 */
    z-index: -1;
    /* タイトルの後ろ */
}

.service__title::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--color-primary);
    transform: rotate(-2deg);
    transform-origin: left center;
}

.service__description {
    text-align: center;
    font-family: var(--font-serif);
    font-size: 2.0rem;
    font-weight: 600;
    line-height: 160%;
    margin-bottom: 6.0rem;
}

.service__detail {
    align-items: center;
    display: flex;
    gap: 4.0rem;
    justify-content: space-between;
    margin-bottom: 6.0rem;
}

.service__detail-title {
    font-size: 2.4rem;
    font-family: var(--font-serif);
    font-weight: 600;
    border-left: 8px solid var(--color-primary);
    border-bottom: 1px solid var(--color-primary);
    display: inline-block;
    padding-left: 4px;
    margin-bottom: 2.2rem;
}

.service__detail-image {
    max-width: 38rem;
}

.service__worries {
    display: flex;
    gap: 4rem;
    align-items: center;
    margin-bottom: 4rem;
}

.service__worries img {
    max-width: 38rem;
}

.service__worries-list {
    border: 2px solid var(--color-primary);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 20px;
    width: 100%;
}

.service__worries-list li {
    list-style: none;
    color: var(--color-primary);
    font-weight: 600;
    position: relative;
    padding-left: 30px;
}

.service__worries-list li::before {
    content: '';
    position: absolute;
    top: 0.4em;
    left: 0;
    width: 20px;
    height: 20px;
    background-image: url('../assets/check.webp');
    background-size: contain;
    background-repeat: no-repeat;
}

.service__support {
    display: flex;
    gap: 4rem;
    align-items: center;
    margin-bottom: 6rem;
}

.service__support-body {
    border: 2px solid var(--color-primary);
    border-radius: 4px;
}

.service__support-title {
    padding: 8px;
    background-color: var(--color-primary);
    color: var(--color-white);
    text-align: center;
    font-weight: 600;
}

.service__list {
    position: relative;
    padding: 1.4rem 2.2rem;
}

.service__list li::before {
    content: '・';
    position: absolute;
    left: 8px;
}

.service__support img {
    max-width: 38rem;
}

.service__description--example {
    text-align: left;
    margin-bottom: 0rem;
}

.service__detail a {
    display: inline-block;
    color: #095ef0;
    border-bottom: 1px solid #095ef0;
    font-size: 18px;
    margin-bottom: 16px;
}


.service__detail small {
    display: block;
}

/* ===================================
   CTA
=================================== */
.cta {
    background-image: url('../assets/CTA.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 4rem 5rem;
    text-align: center;

}

.cta__inner {
    max-width: 800px;
    margin: 0 auto;
}

.cta__title {
    font-family: var(--font-pop);
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--color-white);
}

.cta__text {
    font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-white);
    margin-bottom: 2.4rem;
}

.cta__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-image: linear-gradient(90deg, #36bc16, #12e23a);
    color: var(--color-white);
    font-size: 1.8rem;
    font-weight: 700;
    padding: 16px 48px;
    border-radius: 50px;
    box-shadow: 0px 4px 0px 0px #04875B;
    transition: all 0.3s ease;
}

.cta__button:hover {
    background-color: #00B386;
    /* 少し暗く */
    transform: translateY(-2px);
    /* 少し浮く */
    box-shadow: 0 4px 12px rgba(0, 200, 150, 0.3);
}

.cta__button-icon {
    font-size: 1.4rem;
}

/* ===================================
   Overview
=================================== */
.overview {
    background-image: url('../assets/overview_bg-pc.webp');
    background-position: bottom center;
    background-size: contain;
    background-repeat: no-repeat;
    padding-bottom: 120px;
}

.overview__container {
    max-width: 400px;
    /* 狭めのコンテナ */
    margin: 0 auto;
    /* 中央揃え */
    padding: 0 24px;
}

.overview__office {
    margin-top: 60px;
}

.overview__office:first-of-type {
    margin-top: 0;
}

.overview__office-name {
    font-family: var(--font-sans);
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-text);
    padding-bottom: 16px;
    padding-left: 10px;
    border-bottom: 1px solid #D9D9D9;
    position: relative;
    /* 擬似要素の基準 */
}

.overview__office-name::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    width: 5px;
    height: 1.4em;
    /* font-sizeの1.4倍 = 文字の高さ */
    background-color: var(--color-primary);
}

.overview__info {
    display: grid;
    grid-template-columns: 100px 1fr;
    border-bottom: 1px solid #D9D9D9;
    /* 最下部の線 */
}

.overview__info-label {
    font-family: var(--font-sans);
    /* Noto Sans JP */
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text);
    padding: 16px 0;
    border-bottom: 1px solid #D9D9D9;
    /* 区切り線 */
}

.overview__info-data {
    font-family: var(--font-sans);
    /* Noto Sans JP */
    font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-text);
    padding: 16px 0;
    border-bottom: 1px solid #D9D9D9;
    /* 区切り線 */
}

/* 最後の行は下線なし */
.overview__info-label:last-of-type,
.overview__info-data:last-of-type {
    border-bottom: none;
}


/* ===================================
   Footer
=================================== */
.footer {
  background-color: var(--color-text); /* 濃いグレー or 黒 */
  padding: 40px 24px;
  text-align: center;
}

.footer__copyright {
  font-size: 1.4rem;
  color: var(--color-white);
  font-family: var(--font-serif);
}























@media (max-width: 767px) {


    .u-container-md {
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
        padding: 0 var(--space-md);
    }

    /* ====================================
   セクション共通スタイル
==================================== */
    .section {
        padding-top: 40px;
        padding-bottom: 40px;
        /* 下の余白も統一しとく？ */
    }

    /* ====================================
   セクション見出し共通スタイル
==================================== */

    .section-title-wrapper {
        text-align: center;
        margin-bottom: 4.0rem;
    }

    .section-title {
        position: relative;
        display: inline-block;
        padding-top: 5rem;
        font-family: var(--font-serif);
        font-size: 3.2rem;
        font-weight: 600;
        color: var(--color-text);
        text-align: center;
    }

    .section-title::after {
        content: '';
        position: absolute;
        bottom: 6px;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% + 20px);
        height: 1px;
        background-color: #4E4E4E;
    }

    .section-title::before {
        content: '';
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        /* 横中央 */
        width: 50px;
        height: 50px;
        background-image: url(../assets/logo.webp);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }

    /* 最初の文字を赤色に */
    .section-title__emphasis {
        color: var(--color-primary);
    }

    .section-title__emphasis::before {
        content: '';
        position: absolute;
        left: -4px;
        bottom: 0px;
        width: 2px;
        height: 14px;
        background-color: var(--color-primary);
    }

    /* ====================================
   FVセクション
==================================== */
    .fv {
        min-height: 100vh;
        max-height: none;
        background-image: url('../assets/Fv_sp.webp');
    }


    /* ====================================
   aboutセクション
==================================== */

    .about {
        width: 100%;
        background-image: url(../assets/About_bg-pc.webp);
        background-repeat: no-repeat;
        background-position: top;
        background-size: cover;
        gap: 10px;
        object-fit: cover;
    }

    .about .section-title-wrapper {
        margin-bottom: 32px;
    }

    .about__lead {
        font-family: var(--font-serif);
        font-size: 2.0rem;
        font-weight: 600;
        text-align: center;
        margin-bottom: 24px;
        /* leadとtextの間 */
    }

    .about__lead span {
        color: var(--color-primary);
    }

    .about__text {
        font-family: var(--font-serif);
        font-size: 1.6rem;
        text-align: center;
        line-height: 1.8;
        max-width: 800px;
        margin: 0 auto;
        margin-bottom: 32px;
    }


    .about__partnership {
        display: flex;
        gap: 40px;
        align-items: center;
        padding: 40px;
        box-shadow: 0px 1px 4px 0px #d6d6d6;
        border-radius: 8px;
        background-color: #FEFEFE;
    }


    .about__partnership-title {
        display: inline-block;
        padding-left: 4px;
        font-size: 2.0rem;
        font-weight: 600;
        border-bottom: 1px solid var(--color-primary);
        border-left: 5px solid var(--color-primary);
        margin-bottom: 20px;

    }

    .about__partnership-image {
        flex-shrink: 0;
        max-width: 400px;
        margin-bottom: 16px;
    }


    /* ====================================
   staffセクション
==================================== */


    .staff {
        width: 100%;
        background-image: url(../assets/Intro_bg-pc.webp);
        background-repeat: no-repeat;
        background-position: top;
        background-size: cover;
        gap: 10px;
        object-fit: cover;
    }

    .staff .section-title {
        font-family: var(--font-pop);
    }

    .staff__item {
        display: flex;
        align-items: center;
        margin-top: 5.0rem;
        justify-content: space-between;
    }

    .staff__item:first-of-type {
        margin-top: 0;
    }

    .staff__item:last-of-type {
        flex-direction: row-reverse;
    }

    .staff__name {
        display: inline;
        font-family: var(--font-pop);
        font-size: 2.4rem;
        margin-bottom: 2.4rem;
        position: relative;
    }

    .staff__name span {
        color: var(--color-primary);
    }


    .staff__name::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translateY(-50%);
        width: 150px;
        height: 2px;
        background-color: var(--color-primary);
        margin-left: 16px;
    }

    .staff__image {
        max-width: 100%;
        margin-bottom: 16px;

    }


    /* ====================================
   serviceセクション
==================================== */



    .service {
        background-color: #f5f5f5;
        background-image:
            linear-gradient(to right, #EFE1E1 1px, transparent 1px),
            linear-gradient(to bottom, #EFE1E1 1px, transparent 1px);
        background-size: 18px 18px;
    }

    .service__item-wrapper {
        display: flex;
        flex-direction: column;
        gap: 8rem;
    }

    .service__item {
        padding: 4.0rem 3.0rem;
        background-color: #FEFEFE;
        border-radius: 8px;
        box-shadow: 0px 1px 4px 0px #d6d6d6;
    }


    .service__titleWrapper {
        text-align: center;
        position: relative;
    }

    .service__title {
        font-family: var(--font-serif);
        font-size: 2.2rem;
        font-weight: 900;
        color: var(--color-text);
        margin: 0 auto;
        margin-bottom: 2.5rem;
        position: relative;
        display: inline-block;
        align-items: baseline;
        /* 文字のベースラインを揃える */
        z-index: 0;
    }

    .service__number {
        font-family: 'Allison', cursive;
        /* Google Fontsから読み込んだ場合 */
        font-size: 5.8rem;
        /* 大きめに */
        color: #E3A9AC;
        position: absolute;
        top: -44px;
        left: -20px;
        /* 左端に配置 */
        z-index: -1;
        /* タイトルの後ろ */
    }

    .service__title::after {
        content: '';
        position: absolute;
        bottom: -2px;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: var(--color-primary);
        transform: rotate(-2deg);
        transform-origin: left center;
    }

    .service__description {
        text-align: center;
        font-family: var(--font-serif);
        font-size: 1.6rem;
        font-weight: 600;
        line-height: 160%;
        margin-bottom: 3.2rem;
    }

    .service__detail {
        align-items: center;
        display: flex;
        gap: 4.0rem;
        justify-content: space-between;
        margin-bottom: 3.2rem;
        flex-direction: column;
    }

    .service__detail-title {
        font-size: 2.0rem;
        font-family: var(--font-serif);
        font-weight: 600;
        border-left: 8px solid var(--color-primary);
        border-bottom: 1px solid var(--color-primary);
        display: inline-block;
        padding-left: 4px;
        margin-bottom: 1.6rem;
    }

    .service__detail-image {
        max-width: 100%;
        margin-bottom: 1.6rem;
    }

    .service__worries {
        display: flex;
        gap: 0rem;
        align-items: center;
        margin-bottom: 4.0rem;
        flex-direction: column;
    }

    .service__worries img {
        max-width: 100%;
    }

    .service__worries-list {
        border: 2px solid var(--color-primary);
        border-radius: 4px;
        display: flex;
        flex-direction: column;
        gap: 6px;
        padding: 20px;
        width: 100%;
    }

    .service__worries-list li {
        list-style: none;
        color: var(--color-primary);
        font-weight: 600;
        position: relative;
        padding-left: 30px;
    }

    .service__worries-list li::before {
        content: '';
        position: absolute;
        top: 0.4em;
        left: 0;
        width: 20px;
        height: 20px;
        background-image: url('../assets/check.webp');
        background-size: contain;
        background-repeat: no-repeat;
    }

    .service__support {
        display: flex;
        gap: 0;
        align-items: center;
        margin-bottom: 3.2rem;
        flex-direction: column;
    }

    .service__support-body {
        border: 2px solid var(--color-primary);
        border-radius: 4px;
    }

    .service__support-title {
        padding: 8px;
        background-color: var(--color-primary);
        color: var(--color-white);
        text-align: center;
        font-weight: 600;
    }

    .service__list {
        position: relative;
        padding: 1.4rem 2.2rem;
    }

    .service__list li::before {
        content: '・';
        position: absolute;
        left: 8px;
    }

    .service__support img {
        max-width: 100%;
    }

    .service__description--example {
        text-align: left;
        margin-bottom: 0rem;
        font-size: 1.6rem;
    }

    .service__detail a {
        display: inline-block;
        color: #095ef0;
        border-bottom: 1px solid #095ef0;
        font-size: 1.6rem;
        margin-bottom: 16px;
    }


    .service__detail small {
        display: block;
    }

    /* ===================================
   CTA
=================================== */
    .cta {
        background-image: url(../assets/CTA.webp);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        padding: 2rem 1.6rem;
        text-align: center;

    }

    .cta__inner {
        max-width: 800px;
        margin: 0 auto;
    }

    .cta__title {
        font-family: var(--font-pop);
        font-size: 1.8rem;
        font-weight: 700;
        color: var(--color-white);
    }

    .cta__text {
        font-size: 1.6rem;
        line-height: 1.8;
        color: var(--color-white);
        margin-bottom: 1.6rem;
    }

    .cta__button {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background-image: linear-gradient(90deg, #36bc16, #12e23a);
        color: var(--color-white);
        font-size: 1.8rem;
        font-weight: 700;
        padding: 16px 32px;
        border-radius: 50px;
        box-shadow: 0px 4px 0px 0px #04875B;
        transition: all 0.3s ease;
    }

    .cta__button:hover {
        background-color: #00B386;
        /* 少し暗く */
        transform: translateY(-2px);
        /* 少し浮く */
        box-shadow: 0 4px 12px rgba(0, 200, 150, 0.3);
    }

    .cta__button-icon {
        font-size: 1.4rem;
    }

    /* ===================================
   Overview
=================================== */
    .overview {
        background-image: url('../assets/overview_bg-pc.webp');
        background-position: bottom center;
        background-size: contain;
        background-repeat: no-repeat;
        padding-bottom: 120px;
    }

    .overview__container {
        max-width: 350px;
        /* 狭めのコンテナ */
        margin: 0 auto;
        /* 中央揃え */
        padding: 0 24px;
    }

    .overview__office {
        margin-top: 60px;
    }

    .overview__office:first-of-type {
        margin-top: 0;
    }

    .overview__office-name {
        font-family: var(--font-sans);
        font-size: 2rem;
        font-weight: 700;
        color: var(--color-text);
        padding-bottom: 16px;
        padding-left: 10px;
        border-bottom: 1px solid #D9D9D9;
        position: relative;
        /* 擬似要素の基準 */
    }

    .overview__office-name::before {
        content: '';
        position: absolute;
        left: 0;
        top: 6px;
        width: 5px;
        height: 1.4em;
        /* font-sizeの1.4倍 = 文字の高さ */
        background-color: var(--color-primary);
    }

    .overview__info {
        display: grid;
        grid-template-columns: 100px 1fr;
        border-bottom: 1px solid #D9D9D9;
        /* 最下部の線 */
    }

    .overview__info-label {
        font-family: var(--font-sans);
        /* Noto Sans JP */
        font-size: 1.6r
    }


}