@charset "UTF-8";
body {
            margin: 0;
            padding: 0;
            background-color: #fff;
        }

        /* MV全体のコンテナ */
        .mv-container {
            width: 65%;         /* PC時はブラウザ幅の70%にする */
            max-width: 1600px;  /* ただし1600pxは超えないようにする（任意） */
            margin: 0 auto;     /* 中央配置 */
            line-height: 0;
        }

        .mv-container img {
            width: 100%;        /* コンテナの幅（70%）に対して100%で表示 */
            height: auto;
            display: block;
        }

        /* スマホ・タブレット対応 */
        @media screen and (max-width: 1024px) {
            .mv-container {
                width: 100%;    /* 画面が狭くなってきたら100%に切り替え */
            }
        }

/* 既存のスタイルを維持しつつ、以下を追加・調整 */
    
    .reason-section {
        padding: 20px 20px;
        background-color: #fff9f9;
        font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    }

    .reason-title {
        text-align: center;
        font-size: 1.8rem;
        margin-bottom: 40px;
        color: #333;
        font-weight: bold;
    }

    .reason-title .top3 {
        color: #e60012;
        font-size: 2.2rem;
    }

    .reason-list {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }

    .reason-item {
        display: flex;
        align-items: center;
        background: #fff;
        padding: 12px 30px;
        border-radius: 50px;
        box-shadow: 0 4px 10px rgba(0,0,0,0.05);
        border: 2px solid #ffccd0;
        width: fit-content;
        min-width: 480px; /* 理由1に合わせた幅 */
    }

    .reason-number {
        background: #e60012;
        color: #fff;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        font-size: 1.2rem;
        margin-right: 15px;
        flex-shrink: 0;
    }

    .reason-text {
        font-size: 1.1rem;
        font-weight: bold;
        color: #444;
        margin: 0;
        line-height: 1.5;
        text-align: left;
    }

    /* 強調箇所のスタイル */
    .highlight {
        color: #e60012; /* ロゴ等の赤に合わせた強調色 */
        font-size: 1.2rem; /* ほんの少しだけ大きくして目立たせる */
        background: linear-gradient(transparent 70%, #ffebed 70%); /* 下線風の装飾（お好みで） */
        padding: 0 2px;
    }

    @media screen and (max-width: 767px) {
        .reason-item {
            min-width: 0;
            width: 100%;
            box-sizing: border-box;
            padding: 15px;
            border-radius: 15px; /* スマホでは丸すぎると文字が入りきらないため少し調整 */
        }
        .reason-title { font-size: 1.4rem; }
        .reason-text { font-size: 1rem; }
        .highlight { font-size: 1.1rem; }
    }
.cta-area {
        padding: 30px 20px;
        background-color: #fff;
    }

    .cta-inner {
        display: flex;
        justify-content: center; /* 中央寄せ */
        align-items: center;
        gap: 15px;               /* 隙間を少しタイトに */
        max-width: 1200px;
        margin: 0 auto;
    }

    .cta-button {
        transition: transform 0.2s, opacity 0.2s;
        display: block;
        /* PCでのボタン幅を最大320pxに制限（ここでお好みのサイズに調整可能） */
        width: 100%;
        max-width: 280px; 
    }

    .cta-button:hover {
        opacity: 0.8;
        transform: translateY(-2px);
    }

    .cta-button img {
        width: 100%;
        height: auto;
        display: block;
    }

    /* スマホ対応 */
    @media screen and (max-width: 767px) {
        .cta-inner {
            /* スマホでは押しやすさを優先して横並びを維持 or 縦並び */
            /* 横並びを維持する場合 */
            flex-direction: row; 
            gap: 10px;
        }
        .cta-button {
            max-width: 48%; /* スマホで2つ並ぶサイズ */
        }
    }
 /* 全体設定 */
    .concept-section {
        background-color: #fdf5f3; /* 温かみのあるベージュピンク */
        padding: 10px 10px;
        color: #4a3a38;
        text-align: center;
    }

    .inner {
        max-width: 900px;
        margin: 0 auto;
    }

    /* 1. 最上部テキスト */
    .concept-lead-large {
        font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W6", sans-serif;
        font-size: 1.6rem;
        line-height: 1.8;
        margin-bottom: 40px;
    }

    .strong-point {
        display: inline-block;
        font-weight: 900;
        color: #e36a7d;
        border-bottom: 5px solid #f7d2d6; /* 強調の太線 */
        padding: 0 4px;
        margin: 0 2px;
        font-size: 2.2rem;
        letter-spacing: 0.05em;
    }

    .num {
        font-size: 2.8rem;
        letter-spacing: -0.05em;
    }

    .concept-copy {
        font-family: "Hiragino Mincho ProN", "MS Mincho", serif;
        font-size: 2.4rem;
        font-weight: normal;
        line-height: 1.5;
        margin-bottom: 20px;
        letter-spacing: 0.15em;
        color: #634d4a;
    }

    .concept-arrow {
        color: #d4b2ad;
        margin-bottom: 40px;
        font-size: 1rem;
    }

    /* 2. 画像エリア */
    .concept-image {
        margin-bottom: 50px;
        line-height: 0;
    }

    .concept-image img {
        width: 100%;
        max-width: 640px;
        height: auto;
        border-radius: 4px;
        box-shadow: 0 10px 40px rgba(0,0,0,0.06);
    }

    /* 3. 下部解説文 */
    .concept-body {
        max-width: 760px;
        margin: 0 auto;
        text-align: left;
        line-height: 2.2;
        font-size: 1.1rem;
        font-family: "Hiragino Kaku Gothic ProN", sans-serif;
    }

    .concept-body p {
        margin-bottom: 30px;
    }

    .text-pink {
        color: #e36a7d;
        font-weight: bold;
    }

    .pc-only { display: block; }

    /* スマホ・タブレット対応 */
    @media screen and (max-width: 767px) {
        .concept-section {
            padding: 20px 10px;
        }
        .concept-lead-large {
            font-size: 1.1rem;
            line-height: 1.6;
        }
        .strong-point {
            font-size: 1.4rem;
            border-bottom-width: 3px;
        }
        .num {
            font-size: 1.8rem;
        }
        .concept-copy {
            font-size: 1.6rem;
            letter-spacing: 0.05em;
        }
        .concept-body {
            font-size: 1rem;
            line-height: 1.8;
            text-align: justify; /* 両端揃えでスッキリ見せる */
        }
        .pc-only { display: none; }
    }

    /* 全体設定 */
    .selection-reason {
        padding: 20px 10px;
        background-color: #fff;
        color: #4a3a38;
        font-family: "Hiragino Kaku Gothic ProN", sans-serif;
    }

    .inner {
        max-width: 1000px;
        margin: 0 auto;
    }

    .section-title {
        text-align: center;
        font-size: 2rem;
        font-family: "Hiragino Mincho ProN", serif;
        margin-bottom: 30px;
        position: relative;
        padding-bottom: 15px;
    }

    .section-title::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 60px;
        height: 3px;
        background-color: #e36a7d;
    }

    /* 理由ブロックの基本構造 */
    .reason-block {
        display: flex;
        align-items: center;
        gap: 50px;
        margin-bottom: 20px;
    }

    /* 2番目のブロックは左右反転 */
    .reason-block.reverse {
        flex-direction: row-reverse;
    }

    .reason-image {
        flex: 1;
    }

    .reason-image img {
        width: 100%;
        height: auto;
        border-radius: 12px;
        box-shadow: 0 15px 30px rgba(0,0,0,0.08);
    }

    .reason-content {
        flex: 1;
    }

    .reason-num {
        display: inline-block;
        color: #e36a7d;
        font-weight: bold;
        font-size: 1.1rem;
        margin-bottom: 10px;
        letter-spacing: 0.1em;
    }

    .reason-h {
        font-size: 1.8rem;
        margin-bottom: 20px;
        color: #333;
        font-family: "Hiragino Mincho ProN", serif;
    }

    .reason-desc {
        line-height: 1.8;
        font-size: 1.05rem;
        color: #634d4a;
    }

    /* スマホ対応 */
    @media screen and (max-width: 767px) {
        .reason-block, .reason-block.reverse {
            flex-direction: column; /* スマホでは全て縦並び */
            gap: 20px;
            margin-bottom: 20px;
        }
        .reason-h {
            font-size: 1.4rem;
        }
        .section-title {
            font-size: 1.6rem;
        }
    }
    .price-section { padding: 20px 10px; background-color: #fdf5f3; }
    .price-lead { text-align: center; margin-bottom: 40px; line-height: 1.6; font-weight: bold; }
    .price-grid { display: flex; gap: 20px; justify-content: center; }
    
    .price-card { background: #fff; border-radius: 12px; overflow: hidden; flex: 1; max-width: 320px; box-shadow: 0 10px 20px rgba(0,0,0,0.05); text-align: center; }
    .highlight-card { border: 2px solid #e36a7d; transform: scale(1.05); }
    
    .card-header { background: #634d4a; color: #fff; padding: 15px; font-weight: bold; font-size: 1.2rem; }
    .highlight-card .card-header { background: #e36a7d; }
    
    .card-body { padding: 30px 20px; }
    .total-price { font-size: 2.2rem; font-weight: bold; color: #e36a7d; margin: 0; }
    .total-price span { font-size: 1rem; margin-left: 4px; }
    .tax-in { font-size: 0.8rem; color: #999; margin-bottom: 20px; }
    
    .price-details { list-style: none; padding: 0; text-align: left; display: inline-block; font-size: 0.95rem; line-height: 1.8; }
    .price-note { font-size: 0.9rem; font-weight: bold; line-height: 1.4; }
    .text-red { color: #e36a7d; }

    @media screen and (max-width: 767px) {
        .price-grid { flex-direction: column; align-items: center; }
        .price-card { width: 100%; max-width: 100%; margin-bottom: 10px; }
        .highlight-card { transform: scale(1); }
    }
    .compare-section { padding: 20px 10px; background-color: #fff; }
    .compare-table-wrapper { overflow-x: auto; margin-top: 40px; }
    
    .compare-table { width: 100%; border-collapse: collapse; min-width: 600px; }
    .compare-table th, .compare-table td { border: 1px solid #eee; padding: 20px; text-align: center; }
    
    .compare-table th { background: #f8f8f8; font-weight: bold; }
    
    /* 仲人協会の列を強調 */
    .compare-table .highlight-col {
        background: #fff9f9;
        border-left: 2px solid #e36a7d;
        border-right: 2px solid #e36a7d;
        color: #e36a7d;
        width: 30%;
    }
    .compare-table tr:first-child .highlight-col { border-top: 2px solid #e36a7d; }
    .compare-table tr:last-child .highlight-col { border-bottom: 2px solid #e36a7d; }
    
    .check-mark { font-weight: bold; }
    .compare-note { font-size: 0.85rem; color: #888; text-align: center; margin-top: 10px; }

    @media screen and (max-width: 767px) {
        .compare-table th, .compare-table td { padding: 10px; font-size: 0.9rem; }
    }
    .member-stats {
        padding: 20px 10px;
        background-color: #fdf5f3;
        color: #4a3a38;
        font-family: "Hiragino Kaku Gothic ProN", sans-serif;
    }

    .inner {
        max-width: 1100px; /* PCでの広がりを程よく制限 */
        margin: 0 auto;
    }

    .section-title {
        font-size: 2.2rem;
        font-family: "Hiragino Mincho ProN", serif;
        margin-bottom: 50px;
    }

    /* 会員数表示 */
    .total-members-box {
        text-align: center;
        margin-bottom: 60px;
    }
    .stats-label {
        font-size: 1.3rem;
        font-weight: bold;
        color: #e36a7d;
        margin-bottom: 10px;
    }
    .count {
        font-size: 5rem;
        font-weight: 900;
        color: #e36a7d;
        line-height: 1;
    }
    .unit { font-size: 1.8rem; margin-left: 5px; }

    /* グラフグリッド設定 */
    .stats-grid {
        display: grid;
        grid-template-columns: 1fr 1fr; /* PCで2列 */
        gap: 30px;
        margin-bottom: 30px;
    }

    .stats-footer-grid {
        display: flex;
        gap: 30px;
        justify-content: center;
    }

    .stats-card {
        background: #fff;
        padding: 20px;
        border-radius: 15px;
        box-shadow: 0 8px 20px rgba(0,0,0,0.04);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .stats-card img {
        width: 100%;
        height: auto;
        max-width: 450px; /* 画像が大きくなりすぎてボケるのを防ぐ */
    }

    .job-card {
        flex: 1;
    }

    .stats-note {
        font-size: 0.8rem;
        color: #888;
        margin-top: 20px;
        line-height: 1.6;
    }

    /* スマホ対応 */
    @media screen and (max-width: 767px) {
        .stats-grid, .stats-footer-grid {
            grid-template-columns: 1fr;
            flex-direction: column;
            gap: 20px;
        }
        .count { font-size: 3.5rem; }
        .section-title { font-size: 1.6rem; }
        .stats-card { padding: 15px; }
    }
/* 既存のFAQスタイルを適用（開閉アニメーション設定済み） */
    .faq-section {
        padding: 20px 10px;
        background-color: #fff;
        color: #4a3a38;
        font-family: "Hiragino Kaku Gothic ProN", sans-serif;
    }

    .faq-container {
        max-width: 850px;
        margin: 0 auto;
    }

    .faq-check { display: none; }

    .faq-item {
        margin-bottom: 15px;
        border: 1px solid #eee;
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    }

    .faq-header {
        display: flex;
        align-items: center;
        padding: 22px 30px;
        background-color: #fdf5f3;
        cursor: pointer;
        position: relative;
    }

    .q-icon {
        color: #e36a7d;
        font-weight: bold;
        font-size: 1.5rem;
        margin-right: 15px;
    }

    .q-text {
        font-weight: bold;
        line-height: 1.5;
        flex: 1;
        padding-right: 40px;
    }

    /* アイコン（＋・ー） */
    .i_box {
        position: absolute;
        right: 30px;
        width: 16px;
        height: 16px;
    }
    .i_box::before, .i_box::after {
        content: '';
        position: absolute;
        background-color: #d4b2ad;
        transition: 0.3s;
    }
    .i_box::before { width: 100%; height: 2px; top: 50%; left: 0; margin-top: -1px; }
    .i_box::after { width: 2px; height: 100%; left: 50%; top: 0; margin-left: -1px; }

    /* 回答コンテンツ */
    .faq-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.4s ease-out;
        background-color: #fff;
    }

    .faq-content-inner {
        padding: 30px;
        display: flex;
        border-top: 1px solid #fdf5f3;
    }

    .a-icon {
        color: #634d4a;
        font-weight: bold;
        font-size: 1.5rem;
        margin-right: 15px;
    }

    .a-text {
        flex: 1;
        line-height: 1.8;
        margin: 0;
        color: #555;
    }

    /* 開閉アクション */
    .faq-check:checked ~ .faq-content { max-height: 1000px; }
    .faq-check:checked ~ .faq-header { background-color: #f7e6e3; }
    .faq-check:checked ~ .faq-header .i_box::after { transform: rotate(90deg); opacity: 0; }

    @media screen and (max-width: 767px) {
        .faq-header { padding: 18px 20px; }
        .q-icon, .a-icon { font-size: 1.2rem; }
        .q-text { font-size: 0.95rem; }
        .a-text { font-size: 0.9rem; }
        .faq-content-inner { padding: 20px; }
    }
/* ----------------------------------
   サービスの特徴セクション
---------------------------------- */
/* ----------------------------------
   サービスの特徴セクション
---------------------------------- */
.service-features-section {
    background-color: #fff9f6; 
    padding-bottom: 60px;
}

/* 画像：PC時は50%幅で中央寄せ */
.feature-mv {
    width: 50%;
    margin: 0 auto;
    line-height: 0;
}

.feature-mv img {
    width: 100%;
    height: auto;
}

/* タイトルエリア */
.feature-title-area {
    text-align: center;
    padding: 60px 20px 0;
}

.feature-main-title {
    font-size: 32px;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: #444;
    margin: 0 0 20px 0;
}

/* 「特徴」のハイライト（ピンク色） */
.feature-main-title .highlight {
    color: #e37b89; /* 画像に基づいたピンク色 */
    font-size: 32px; /* 周りの文字と同じサイズ、または強調なら少し大きく */
}

/* リード文 */
.feature-lead-text {
    font-size: 18px;
    line-height: 1.8;
    color: #555;
    margin-bottom: 40px;
}

/* 逆三角形の矢印 */
.feature-section-arrow {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #d8b6ab;
    margin: 0 auto;
}

/* レスポンシブ：スマホ表示（767px以下） */
@media screen and (max-width: 767px) {
    .feature-mv {
        width: 100%;
    }

    .feature-main-title {
        font-size: 24px;
    }

    .feature-main-title .highlight {
        font-size: 24px;
    }

    .feature-lead-text {
        font-size: 15px;
    }
}
/* 特徴詳細カード全体 */
.feature-card {
    background: #fff;
    border-radius: 10px;
    margin: 40px auto;
    padding: 60px 40px;
    max-width: 800px;
    position: relative;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

/* POINTバッジ */
.point-badge {
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
    background: #c5a69a; /* 画像の落ち着いたピンクベージュ */
    color: #fff;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 16px;
}
.point-badge::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 12px solid #c5a69a;
}

/* カード内タイトル */
.card-main-title {
    text-align: center;
    font-size: 24px;
    line-height: 1.5;
    color: #333;
    margin-top: 20px;
}
.text-pink { color: #e37b89; }
.text-bold-pink { color: #e37b89; font-weight: bold; }

.title-border {
    border: none;
    border-top: 1px solid #e37b89;
    width: 100%;
    margin: 30px 0;
}

/* サブラベル（ピンクの角丸） */
.sub-label-pink {
    background: #e37b89;
    color: #fff;
    border-radius: 50px;
    padding: 10px 10px;
    display: inline-block;
    font-weight: bold;
    margin-bottom: 20px;
}

.feature-sub-block {
    text-align: center;
    margin-bottom: 40px;
}

.sub-image {
    width: 100%;
    max-width: 500px;
    margin: 0 auto 20px;
}
.sub-image img {
    width: 100%;
    height: auto;
}

.sub-text {
    text-align: left;
    font-size: 16px;
    line-height: 1.7;
    color: #444;
}

/* プラスアイコン */
.plus-icon {
    font-size: 40px;
    color: #d8b6ab;
    text-align: center;
    margin: 20px 0;
    font-weight: bold;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .feature-card {
        margin: 20px 15px;
        padding: 30px 10px;
    }
    .card-main-title {
        font-size: 20px;
    }
    .sub-text {
        font-size: 15px;
    }
}
/* サービス詳細リスト全体 */
.service-detail-list {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 15px 30px;
}

/* 個別のカード設定 */
.service-item-card {
    background: #fff;
    margin-bottom: 10px;
    padding: 20px;
    text-align: center;
    border-radius: 4px; /* 緩やかな角丸 */
}

/* カードタイトル */
.service-item-title {
    font-size: 24px;
    font-weight: bold;
    color: #444;
    margin-bottom: 15px;
}

/* タイトル下のピンクの線 */
.service-title-line {
    border: none;
    border-top: 1px solid #e37b89;
    width: 100%;
    margin: 0 auto 30px;
}

/* 画像エリア */
.service-item-image {
    width: 80%;
    max-width: 400px;
    margin: 0 auto 25px;
}

.service-item-image img {
    width: 100%;
    height: auto;
}

/* 説明文 */
.service-item-desc {
    text-align: left;
    font-size: 16px;
    line-height: 1.8;
    color: #555;
    margin: 0;
}

/* 注釈（※）部分 */
.service-item-desc .note {
    display: block;
    font-size: 13px;
    color: #888;
    margin-top: 10px;
}

/* レスポンシブ調整（スマホ） */
@media screen and (max-width: 767px) {
    .service-item-card {
        padding: 30px 20px;
    }
    .service-item-title {
        font-size: 20px;
    }
    .service-item-desc {
        font-size: 15px;
    }
}
/* ----------------------------------
   活動の流れセクション
---------------------------------- */
.flow-section {
    background-color: #fff;
    padding: 20px 0;
}

.flow-main-title {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #444;
    margin-bottom: 20px;
}

.flow-lead-text {
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
}

.flow-section-arrow {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #d8b6ab;
    margin: 0 auto 60px;
}

/* 共通テキストカラー */
.text-pink { color: #e37b89; }
.text-pink-bold { color: #e37b89; font-weight: bold; }

/* フローリスト */
.flow-list {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 15px;
}

/* 個別のステップアイテム */
.flow-item {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px 10px;
    margin-bottom: 20px;
    text-align: center;
    position: relative;
    box-shadow: 0 4px 10px rgba(0,0,0,0.03);
}

/* STEPバッジ */
.step-badge {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    background: #e37b89;
    color: #fff;
    padding: 8px 30px;
    border-radius: 50px;
    font-weight: bold;
    font-size: 18px;
}

.step-title {
    font-size: 22px;
    font-weight: bold;
    color: #444;
    margin: 10px 0 25px;
}

.step-image {
    width: 100%;
    max-width: 500px;
    margin: 0 auto 25px;
}
.step-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
}

.step-desc {
    text-align: left;
    font-size: 16px;
    line-height: 1.8;
    color: #555;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .flow-main-title { font-size: 26px; }
    .flow-lead-text { font-size: 15px; }
    .step-badge { font-size: 16px; padding: 6px 25px; }
    .step-title { font-size: 20px; }
    .step-desc { font-size: 15px; }
}
/* ----------------------------------
   親御様へセクション
---------------------------------- */
.parents-section {
    background-color: #fff9f6; /* サービスの特徴と同じ薄いピンクベージュ */
    padding: 20px 0;
}

.parents-main-title {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #444;
    margin-bottom: 20px;
}

.parents-lead-text {
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
}

.parents-section-arrow {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #d8b6ab;
    margin: 0 auto 60px;
}

/* カード形式のレイアウト */
.parents-card {
    background: #fff;
    border-radius: 10px;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.parents-image {
    width: 45%;
    line-height: 0;
}

.parents-image img {
    width: 100%;
    height: auto;
    display: block;
}

.parents-content {
    width: 55%;
    padding: 40px;
}

.parents-card-title {
    font-size: 22px;
    font-weight: bold;
    color: #e37b89;
    margin-bottom: 20px;
}

.parents-card-desc {
    font-size: 16px;
    line-height: 1.8;
    color: #555;
    margin-bottom: 25px;
}

/* ポイント箇所のボックス */
.parents-point-box {
    background-color: #fff9f6;
    padding: 20px;
    border-radius: 5px;
}

.point-item {
    font-weight: bold;
    color: #444;
    font-size: 15px;
    margin-bottom: 10px;
}

.point-item:last-child {
    margin-bottom: 0;
}

/* レスポンシブ調整（スマホ） */
@media screen and (max-width: 767px) {
    .parents-card {
        flex-direction: column;
        margin: 0 15px;
    }
    .parents-image, .parents-content {
        width: 100%;
    }
    .parents-content {
        padding: 30px 20px;
    }
    .parents-main-title { font-size: 26px; }
    .parents-card-title { font-size: 19px; }
    .parents-card-desc { font-size: 15px; }
}
/* ----------------------------------
   会社概要セクション
---------------------------------- */
.company-section {
    background-color: #fff;
    padding: 20px 0;
}

.company-main-title {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #444;
    margin-bottom: 20px;
}

.company-section-arrow {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #d8b6ab;
    margin: 0 auto 60px;
}

/* カードレイアウト */
.company-card {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    background: #fdfdfd;
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
}

.company-image {
    width: 45%;
}

.company-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 画像の比率を保ちつつ枠いっぱいに表示 */
}

.company-info {
    width: 55%;
    padding: 40px;
}

.company-name {
    font-weight: bold;
    font-size: 18px;
    color: #444;
    text-align: center;
    margin-bottom: 30px;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

/* 定義リスト（項目名と内容）のスタイル */
.info-list dt {
    font-weight: bold;
    color: #e37b89;
    margin-bottom: 5px;
    font-size: 15px;
}

.info-list dd {
    margin-left: 0;
    margin-bottom: 20px;
    line-height: 1.6;
    color: #555;
    font-size: 16px;
}

.info-list dd:last-child {
    margin-bottom: 0;
}

.tel-number {
    font-size: 24px !important;
    font-weight: bold;
    color: #444 !important;
}

.text-small {
    font-size: 14px;
    color: #888;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .company-card {
        flex-direction: column;
        margin: 0 15px;
    }
    .company-image, .company-info {
        width: 100%;
    }
    .company-image {
        height: 200px;
    }
    .company-info {
        padding: 30px 20px;
    }
    .company-main-title {
        font-size: 26px;
    }
}
/* ----------------------------------
   全国ネットワークセクション
---------------------------------- */
.network-section {
    background-color: #fff9f6;
    padding: 20px 0;
}

.network-main-title {
    text-align: center;
    font-size: 28px;
    line-height: 1.5;
    color: #634d42; /* 茶色系の落ち着いた色 */
    margin-bottom: 20px;
}

.network-lead-text {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 30px;
    font-size: 16px;
    line-height: 1.8;
}

.network-section-arrow {
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #d8b6ab;
    margin: 0 auto 40px;
}

/* 47拠点バッジ */
.total-count-box {
    border: 2px solid #e37b89;
    background: #fff;
    width: fit-content;
    margin: 0 auto 40px;
    padding: 15px 40px;
    text-align: center;
    border-radius: 8px;
}
.total-count-box p {
    font-size: 22px;
    font-weight: bold;
    margin: 0;
}
.total-count-box .count-num {
    font-size: 40px;
    color: #e37b89;
}

.network-guide-msg {
    text-align: center;
    background: #fff;
    padding: 15px;
    border-top: 1px solid #d8b6ab;
    border-bottom: 1px solid #d8b6ab;
    margin-bottom: 40px;
    font-weight: bold;
    color: #634d42;
}

/* エリアグリッド */
.area-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* PCは2カラム */
    gap: 30px;
    max-width: 900px;
    margin: 0 auto;
}

.area-block {
    background: #fff;
    padding: 25px;
    border-radius: 5px;
}

.area-name {
    color: #c5a69a; /* 画像のオレンジ・茶系 */
    font-size: 18px;
    margin-bottom: 15px;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 5px;
}

.branch-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 州の中でも2列に */
    gap: 10px;
}

.branch-list li {
    font-size: 14px;
    color: #444;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .area-grid {
        grid-template-columns: 1fr; /* スマホは1列 */
        padding: 0 15px;
    }
    .branch-list {
        grid-template-columns: 1fr; /* リストも1列 */
    }
    .network-main-title {
        font-size: 22px;
    }
}
/* 拠点名のリストスタイル修正 */
.branch-list li {
    font-size: 14px;
    color: #444;
    line-height: 1.5;
    margin-bottom: 5px;
    /* 改行を制御するための設定 */
    word-break: keep-all; 
    overflow-wrap: anywhere;
}

/* 「（サテライト）」の部分をひとまとめに扱う */
.branch-list li span.satellite {
    display: inline-block; /* ひとつの塊として扱う */
    white-space: nowrap;  /* この中では絶対改行しない */
    font-size: 0.9em;      /* 少しだけ小さくして収まりを良くする */
    color: #888;           /* 少し色を薄くして視認性を高める */
}

/* エリアグリッドの幅微調整（PC時により広く確保） */
@media screen and (min-width: 768px) {
    .area-grid {
        max-width: 1000px; /* 少し広げて1カラムあたりの幅を確保 */
    }
    .branch-list {
        gap: 10px 20px; /* 左右の余白を多めに */
    }
}
/* ----------------------------------
   Pマーク・個人情報保護セクション
---------------------------------- */
.privacy-section {
    background-color: #f9f9f9; /* 他のセクションと区別するための薄いグレー */
    padding: 60px 0;
    border-top: 1px solid #eee;
}

.privacy-container {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 0 20px;
}

/* ロゴエリア */
.privacy-logos {
    display: flex;
    gap: 20px;
    flex-shrink: 0; /* ロゴが小さくならないように固定 */
}

.logo-item {
    width: 80px; /* Pマークの標準的なサイズ感 */
}

.logo-item img {
    width: 100%;
    height: auto;
}

/* テキストエリア */
.privacy-text-area {
    flex-grow: 1;
}

.privacy-desc {
    font-size: 16px;
    font-weight: bold;
    color: #444;
    margin-bottom: 10px;
    line-height: 1.5;
}

.privacy-note {
    font-size: 14px;
    color: #666;
    margin-bottom: 15px;
    line-height: 1.6;
}

.privacy-link {
    display: inline-block;
    color: #e37b89;
    font-size: 14px;
    text-decoration: underline;
}

.privacy-link:hover {
    text-decoration: none;
    opacity: 0.8;
}

/* レスポンシブ：スマホ表示 */
@media screen and (max-width: 767px) {
    .privacy-container {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }

    .privacy-logos {
        justify-content: center;
    }

    .logo-item {
        width: 70px;
    }

    .privacy-desc {
        font-size: 15px;
    }
}
/* ----------------------------------
   フッター
---------------------------------- */
.footer {
    background-color: #fff; /* 背景を白、またはサイトに合わせて調整 */
    padding: 20px 0 20px;
    text-align: center;
    border-top: 1px solid #eee;
}

/* ロゴのサイズと配置 */
.footer-logo {
    width: 100%;
    max-width: 200px; /* ロゴの元の大きさに合わせて調整してください */
    margin: 0 auto 20px;
}

.footer-logo img {
    width: 100%;
    height: auto;
    display: block;
}

/* コピーライト */
.copyright {
    font-size: 12px;
    color: #888;
    letter-spacing: 0.05em;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .footer {
        padding: 40px 0 30px;
    }
    .footer-logo {
        max-width: 240px; /* スマホでは少し小さく */
    }
}

/* ----------------------------------
   追従バナー（固定フッター）
---------------------------------- */
/* ----------------------------------
   追従バナー（サイズ調整版）
---------------------------------- */
/* ----------------------------------
   追従バナー（スマホサイズ微調整版）
---------------------------------- */
.fixed-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.92); /* 視認性のため透過を少し戻す */
    box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.08);
    z-index: 9999;
    padding: 10px 0; /* 上下余白を少し増やす */
}

.fixed-cta-inner {
    display: flex;
    justify-content: center;
    gap: 10px; /* ボタン間の隙間を適度に確保 */
    max-width: 420px; /* PCでの最大幅 */
    margin: 0 auto;
    padding: 0 15px;
}

.cta-item {
    flex: 1;
    display: block;
    max-width: 200px;
    transition: opacity 0.2s ease;
}

.cta-item:hover {
    opacity: 0.8;
}

.cta-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* スマホ・タブレット表示（少しサイズアップ） */
@media screen and (max-width: 767px) {
    .fixed-cta {
        /* iPhoneのセーフエリアを考慮しつつ、しっかりした高さを確保 */
        padding: 10px 0 calc(10px + env(safe-area-inset-bottom)); 
    }
    
    .fixed-cta-inner {
        max-width: 340px; /* 280pxから340pxへ拡大。スマホ画面の横幅に対して程よいサイズ感 */
        gap: 10px;
    }

    .cta-item {
        max-width: 160px; /* ボタン1つあたりの幅を少し大きく */
    }
    
    /* バナーが少し大きくなったのでbodyの余白も微増 */
    body {
        padding-bottom: 85px; 
    }
}
@media screen and (max-width: 767px) {
    .company-card {
        flex-direction: column;
        margin: 0 15px;
    }
    
    .company-image, .company-info {
        width: 100%;
    }

    /* 画像の高さ固定を解除し、全体が見えるように修正 */
    .company-image {
        height: auto; /* 高さを自動にする */
    }

    .company-image img {
        width: 100%;
        height: auto;   /* アスペクト比を維持して全体表示 */
        object-fit: contain; /* 枠内に収める設定（念のため） */
        display: block;
    }

    .company-info {
        padding: 30px 20px;
    }
    
    /* 以下略 */
}

/* ----------------------------------
   お問い合わせフォーム
---------------------------------- */
.contact-section {
    /* 前後の薄ピンク系と差別化するため、少しトーンの違うベージュに変更 */
    background-color: #f7f1ed; 
    padding: 20px 0;
    /* 上下に境界線を入れるとより独立感が出ます */
    border-top: 1px solid #e9dfd8;
    border-bottom: 1px solid #e9dfd8;
}

.contact-main-title {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #444;
    margin-bottom: 20px;
}

.contact-lead-text {
    text-align: center;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 40px;
}

.form-container {
    background: #e37b89;
    border-radius: 16px;
    padding: 40px 30px;
    max-width: 500px;
    margin: 0 auto;
    /* 影を少し強めて、浮き上がって見えるように調整 */
    box-shadow: 0 15px 35px rgba(227, 123, 137, 0.25);
}

.form-flex-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* 入力項目共通 */
.form-input {
    padding: 14px 16px;
    border-radius: 8px;
    border: none;
    font-size: 15px;
    width: 100%;
    box-sizing: border-box;
}

/* プルダウン（メイン） */
.select-main {
    font-weight: bold;
    color: #e37b89;
    font-size: 16px;
    cursor: pointer;
}

/* 切り替え表示エリア */
.sub-fields {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 15px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 8px;
}

.field-label {
    font-size: 13px;
    color: #fff;
    font-weight: bold;
}

.date-time-wrap {
    display: flex;
    gap: 8px;
}

.form-input-sub {
    flex: 1;
    padding: 12px;
    border-radius: 6px;
    border: none;
    font-size: 14px;
}

/* 送信ボタン */
.submit-btn {
    background: #fff;
    color: #e37b89;
    font-size: 18px;
    font-weight: 700;
    padding: 20px;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    margin-top: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

.submit-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    background: #fff9f9;
}

/* スマホ調整 */
@media screen and (max-width: 767px) {
    .form-container {
        padding: 25px 20px;
        margin: 0 15px;
    }
    .contact-main-title {
        font-size: 26px;
    }
    .submit-btn {
        font-size: 16px;
    }
}
html {
    scroll-behavior: smooth;
}

/* フォームの少し上で止まるように調整（ヘッダーなどがある場合） */
.contact-section {
    scroll-margin-top: 20px;
}
/* スタイル適用のイメージ */
.policy-body {
    max-width: 900px;
    margin: 0 auto;
    padding: 60px 20px;
    line-height: 1.8; /* 行間を広めに取って読みやすく */
    color: #333;
}

.policy-content h2 {
    font-family: 'Noto Serif JP', serif;
    border-left: 4px solid #003366; /* 信頼のネイビー */
    padding-left: 15px;
    margin-top: 40px;
    font-size: 1.5rem;
}

.policy-content ul {
    background: #f9f9f9; /* リスト部分を薄いグレーで差別化 */
    padding: 20px 40px;
    border-radius: 8px;
}