.sp-page a { color: inherit; text-decoration: none; }
.sp-page {
    --color-text: #333333;
    --color-orange: #DA5E27;
    --color-navy: #252c51;
    --color-white: #FFFFFF;
    --font-heading: 'Zen Old Mincho', serif;
    --font-body: 'Noto Sans JP', sans-serif;
  
 width: 100%; max-width: 430px; margin: 0 auto; overflow-x: hidden; position: relative; 
}
/* ヘッダーはスクロールに追従させる(固定表示)。left/margin-left の考え方はpc.cssと同じ(基準は430px) */
.sp-page .sec-header {position:fixed;left:50%;margin-left:-215px;top:0;z-index:900;width:430px;background:#fff;box-shadow:3.44px 3.44px 9.17px rgba(0,0,0,0.16);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:11.47px 100.91px 9.17px;}
.sp-page .sec-header .logo-main {font-family:var(--font-logo);font-weight:700;font-size:24.08px;letter-spacing:0.48px;color:#252c51;text-align:center;white-space:nowrap;}
.sp-page .sec-header .logo-main .no {letter-spacing:1.44px;}
.sp-page .sec-header .logo-sub {font-family:var(--font-body);font-weight:700;font-size:13.76px;line-height:1.2;color:#252c51;text-align:center;white-space:nowrap;}
.sp-page .sec-header .logo-main {margin-top:0;}
/* ハンバーガーメニューボタン(ドロワー本体は common.css) */
.sp-page .sp-menu-btn {position:absolute;right:14px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:44px;height:44px;border:none;border-radius:6px;background:#252c51;box-shadow:2px 2px 6px rgba(0,0,0,0.16);cursor:pointer;padding:0;}
.sp-page .sp-menu-btn-bars {display:flex;flex-direction:column;gap:4px;width:22px;}
.sp-page .sp-menu-btn-bars i {display:block;width:100%;height:2px;border-radius:2px;background:#fff;}
.sp-page .sp-menu-btn-label {font-family:var(--font-body);font-weight:700;font-size:8px;line-height:1;letter-spacing:0.4px;color:#fff;}
.sp-page .sec-mv {position:relative;width:430px;height:733.87px;overflow:hidden;background:#f2f0e8;}
.sp-page .mv-photo-couple {position:absolute;left:-145.63px;top:449.49px;width:574.48px;height:329.09px;object-fit:cover;}
/* Safariで稀にこの画像が黒く表示される問題への対策。
   「角丸 + overflow:hidden の親」で「opacity を持つ子」を切り抜く組み合わせは、
   Safariが合成レイヤーの切り抜きに失敗して黒く塗りつぶすことがある。
   そこで(1)親の切り抜きをやめて角丸を画像自身に持たせ、
   (2)親にMVと同じ背景色を敷いて、万一描画が乱れても黒ではなく背景色が出るようにしている。 */
.sp-page .mv-photo-pixta-wrap {position:absolute;right:0;left:auto;top:32px;width:150.1px;height:162.94px;background:#f2f0e8;}
.sp-page .mv-photo-pixta {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0.2;border-radius:0 0 0 27.52px;}
.sp-page .mv-fade-top {position:absolute;left:0;top:73.39px;width:430px;height:170.85px;background:linear-gradient(90deg,#f2f0e8 55%,rgba(242,240,232,0) 100%);}
.sp-page .mv-ribbon {position:absolute;left:30.96px;top:401.33px;width:368.08px;border:1.15px solid #252c51;border-radius:6.88px;background:#fff;overflow:hidden;}
.sp-page .mv-ribbon-bar {background:#9d9d9d;height:32.11px;display:flex;align-items:center;padding:0 34.4px;}
.sp-page .mv-ribbon-bar span {font-family:var(--font-heading);font-weight:900;font-size:18.35px;letter-spacing:-0.73px;color:#fff;white-space:nowrap;}
.sp-page .mv-ribbon-body {padding:6px 18.35px 6px;text-align:center;}
.sp-page .mv-ribbon-body p {font-family:var(--font-heading);font-weight:900;font-size:17.2px;line-height:1.25;letter-spacing:0.34px;color:#252c51;}
.sp-page .mv-copy {position:absolute;left:22.93px;top:94.03px;width:384.13px;}
.sp-page .mv-copy-title {margin:0;font-family:var(--font-heading);font-weight:900;font-size:32.11px;line-height:1.18;letter-spacing:-0.32px;color:#252c51;white-space:nowrap;}
.sp-page .mv-badges {position:absolute;left:0;top:0;width:0;height:0;}
.sp-page .mv-badge {position:absolute;display:flex;align-items:center;justify-content:center;width:263.73px;height:66.51px;border-radius:0 16.05px 0 16.05px;background:#252c51;}
.sp-page .mv-badge-1 {left:0px;top:90.59px;}
.sp-page .mv-badge-2 {left:53.89px;top:166.27px;}
.sp-page .mv-badge span {font-family:var(--font-heading);font-weight:900;font-size:55.04px;line-height:normal;letter-spacing:4.4px;color:#fff;white-space:nowrap;text-shadow:4.83px 4.83px 25.74px rgba(0,0,0,0.13);}
.sp-page .mv-ni {position:absolute;left:319.92px;top:177.73px;margin:0;font-family:var(--font-heading);font-weight:900;font-size:43.57px;line-height:1.45;letter-spacing:-1.74px;color:#252c51;text-shadow:5.22px 5.22px 27.85px rgba(0,0,0,0.13);white-space:nowrap;}
.sp-page .mv-emphasis {position:absolute;left:4.59px;top:243.09px;}
.sp-page .mv-emphasis-hl {position:absolute;left:0;top:38.99px;width:374.96px;height:9.17px;background:#f0dcac;z-index:1;}
.sp-page .mv-emphasis p {position:relative;z-index:2;margin:0;font-family:var(--font-heading);font-weight:900;font-size:33.25px;line-height:1.45;letter-spacing:-1.33px;color:#252c51;text-shadow:0 0 21.65px rgba(255,255,255,0.3);white-space:nowrap;}
.sp-page .mv-stats {position:absolute;left:246px;top:509.12px;width:148px;display:flex;flex-direction:column;gap:9.17px;}
.sp-page .mv-stat {background:#fff8ed;border-radius:5.73px;box-shadow:3.44px 3.44px 22.93px rgba(0,0,0,0.12);display:flex;align-items:center;gap:6.88px;padding:9.17px 6.88px 9.17px 8px;min-height:60.77px;box-sizing:border-box;}
.sp-page .mv-stat-icon {width:30.96px;height:30.96px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#3d4468;border-radius:16.05px;}
.sp-page .mv-stat-icon.mv-stat-icon--plain {background:none;border-radius:0;}
.sp-page .mv-stat-icon.mv-stat-icon--plain img {width:30.96px;height:30.96px;}
.sp-page .mv-stat-icon img {width:18.35px;height:17.2px;}
.sp-page .mv-stat-time {display:flex;flex-direction:column;gap:0;line-height:1.15;}
.sp-page .mv-stat-time .line {display:flex;align-items:baseline;gap:2.29px;white-space:nowrap;}
.sp-page .mv-stat-time .num {font-family:var(--font-heading);font-weight:900;font-size:20.64px;color:#da5e27;line-height:1.15;}
.sp-page .mv-stat-time .unit {font-family:var(--font-body);font-weight:700;font-size:13.76px;color:#333;}
.sp-page .mv-stat-text {margin:0;font-family:var(--font-heading);font-weight:900;font-size:18.35px;line-height:1.05;color:#333;white-space:nowrap;}
.sp-page .mv-stat-text .accent {color:#da5e27;}
.sp-page .mv-stat-text .small {font-size:12.6px;}
.sp-page .mv-stat-text .body {font-family:var(--font-body);font-weight:700;}
.sp-page .sec-cta1 {position:relative;width:430px;height:121.55px;background:#222843;}
.sp-page .cta1-heading {position:absolute;left:50%;top:8.03px;transform:translateX(-50%);margin:0;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.25;color:#fff;text-align:center;white-space:nowrap;}
.sp-page .cta1-btn {position:absolute;top:65.36px;width:182.32px;height:41.28px;border-radius:4.59px;display:flex;align-items:center;justify-content:center;gap:6.88px;}
.sp-page .cta1-btn img {width:27.525px;height:24.075px;}
.sp-page .cta1-btn span {font-family:var(--font-body);font-weight:700;font-size:16.05px;letter-spacing:0.32px;color:#fff;white-space:nowrap;}
.sp-page .cta1-btn--line {left:27.52px;background:#99be49;}
.sp-page .cta1-btn--phone {left:220.16px;background:#f18a5c;}
.sp-page .cta1-btn--phone img {width:30.96px;height:29.235px;}
/* 画面下部に追従する固定CTA(中身は sec-cta1 と同じなので上の指定がそのまま効く)。
   left/margin-left の考え方は固定ヘッダーと同じ(基準は430px) */
/* 初期状態(ファーストビュー)では画面外へ隠し、スクロール開始で下からスライドインさせる(制御は main.js)。
   visibility は隠れるときだけスライド完了後(.35s後)に切り替え、非表示中はリンクをフォーカス対象から外す */
.sp-page .sp-fixed-cta {position:fixed;left:50%;margin-left:-215px;bottom:0;width:430px;z-index:800;box-shadow:0 -3.44px 13.76px rgba(0,0,0,0.25);transform:translateY(100%);visibility:hidden;transition:transform .35s ease, visibility 0s linear .35s;}
.sp-page .sp-fixed-cta.is-visible {transform:translateY(0);visibility:visible;transition:transform .35s ease, visibility 0s;}
/* アニメーションを控えめにする設定の端末では即座に切り替える */
@media (prefers-reduced-motion: reduce) {
  .sp-page .sp-fixed-cta, .sp-page .sp-fixed-cta.is-visible {transition:none;}
}
/* 固定CTAの見出しは1行(横並び)。ページ内の sec-cta1 は2行のまま変えない。
   topは、ボタン(top:65.36px)までの空きに対して見出しが上下中央に来る値 */
.sp-page .sp-fixed-cta .cta1-heading {display:flex;align-items:baseline;gap:11.47px;top:19.9px;}
/* 固定CTAの高さ分だけページ末尾に余白を作り、フッターが隠れないようにする */
.sp-page {padding-bottom:121.55px;}
.sp-page .sec-worry {position:relative;overflow:hidden;background:#f2f0e8 url(../assets/03-worry-bg-texture.webp) center/cover;padding:34.4px 22.93px;display:flex;flex-direction:column;align-items:center;gap:22.93px;}
.sp-page .worry-heading {position:relative;margin:0;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#333;text-align:center;}
.sp-page .worry-card {position:relative;background:#fff;border-radius:20.64px;width:384.13px;padding:22.93px 22.93px 27.52px;box-sizing:border-box;}
.sp-page .worry-list {list-style:none;display:flex;flex-direction:column;}
.sp-page .worry-item {display:flex;gap:8.03px;align-items:center;padding:11.47px 0;border-bottom:1.15px solid #e5e0d5;}
.sp-page .worry-item:last-child {border-bottom:none;padding-bottom:0;}
.sp-page .worry-item img {width:18.35px;height:17.2px;flex-shrink:0;}
.sp-page .worry-item p {margin:0;font-family:var(--font-heading);font-weight:900;font-size:18.35px;line-height:1.4;color:#333;}
.sp-page .worry-item .accent {color:#da5e27;}
/* 「退去期限が迫っており､時間がない中で焦っている」を「…時間がない中で」で改行させる。
   標準の字間だと17文字目「で」が9.2px分収まらず「中」で折り返してしまうため、
   この項目のみ字間を-0.7px詰めている(18文字目「焦」は入らないので改行位置は固定される) */
.sp-page .sec-worry .worry-item:nth-child(3) p {letter-spacing:-0.7px;}
.sp-page .worry-below {position:relative;display:flex;flex-direction:column;align-items:center;gap:11.47px;width:100%;margin-top:-34.63px;}
.sp-page .worry-illustration {width:193.79px;height:auto;}
.sp-page .worry-arrow {width:45.87px;height:32.11px;}
.sp-page .worry-bubble {position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:5.73px;padding:2.29px 1.15px;}
.sp-page .worry-bubble-bar {background:#fff8ed;height:25.23px;width:100%;}
.sp-page .worry-bubble-bar:nth-child(2) {width:321.07px;}
.sp-page .worry-bubble-bar:nth-child(3) {width:201.81px;}
.sp-page .worry-bubble-text {position:absolute;top:0;left:50%;transform:translateX(-50%);width:365.79px;margin:0;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.5;color:#333;text-align:center;}
.sp-page .sec-accompany {position:relative;min-height:676.53px;padding:34.4px 12.61px;display:flex;flex-direction:column;align-items:center;background:#f3f2ef;overflow:hidden;}
.sp-page .accompany-photo {position:absolute;left:-29.81px;top:477.02px;width:491.88px;height:337.12px;object-fit:cover;z-index:0;}
.sp-page .accompany-fade {position:absolute;left:-29.81px;top:477.02px;width:491.88px;height:103.2px;background:linear-gradient(180deg,#f3f2ef 0%,rgba(243,242,239,0) 100%);z-index:1;}
.sp-page .accompany-inner {position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:22.93px;width:405.92px;}
.sp-page .accompany-heading {display:flex;flex-direction:column;align-items:center;gap:6.88px;width:100%;}
.sp-page .accompany-heading p {margin:0;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#333;text-align:center;}
.sp-page .accompany-heading p.accompany-heading-fit {font-size:25px;}
.sp-page .accompany-heading .nowrap-fit {white-space:nowrap;}
.sp-page .accompany-pill {background:#bc9471;border-radius:22.93px 0 22.93px 0;padding:4.59px 9.17px 4.59px 13.76px;}
.sp-page .accompany-pill p {margin:0;font-family:var(--font-heading);font-weight:900;font-size:26.37px;line-height:1.25;color:#fff;text-align:center;white-space:nowrap;}
.sp-page .accompany-card {background:#fff;width:337.12px;padding:17.2px 17.2px 19.49px 18.35px;box-sizing:border-box;display:flex;flex-direction:column;gap:25.23px;align-items:center;}
.sp-page .accompany-card-list {display:flex;flex-direction:column;gap:13.76px;width:264.88px;}
.sp-page .accompany-card-item {display:flex;flex-direction:column;width:100%;border-bottom:1.15px dashed #333333;padding-bottom:3px;}
.sp-page .accompany-card-item-row {display:flex;gap:9.17px;align-items:center;}
.sp-page .accompany-card-item-row .dot {width:8.03px;height:8.03px;border-radius:50%;background:#bc9471;flex-shrink:0;}
.sp-page .accompany-card-item-row p {margin:0;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.6;color:#333;white-space:nowrap;}
.sp-page .accompany-card-note {margin:0;font-family:var(--font-body);font-weight:400;font-size:16.05px;line-height:1.5;color:#333;width:301.57px;}
.sp-page .sec-cta2 {position:relative;width:430px;height:97.47px;background:#252c51;}
.sp-page .cta2-heading {position:absolute;left:50%;top:5.73px;transform:translateX(-50%);margin:0;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.65;color:#fff;text-align:center;white-space:nowrap;}
.sp-page .cta2-btn {position:absolute;top:42.43px;width:182.32px;height:41.28px;border-radius:4.59px;display:flex;align-items:center;justify-content:center;gap:6.88px;}
.sp-page .cta2-btn img {width:27.525px;height:24.075px;}
.sp-page .cta2-btn span {font-family:var(--font-body);font-weight:700;font-size:16.05px;letter-spacing:0.32px;color:#fff;white-space:nowrap;}
.sp-page .cta2-btn--line {left:27.52px;background:#99be49;}
.sp-page .cta2-btn--phone {left:220.16px;background:#f18a5c;}
.sp-page .cta2-btn--phone img {width:30.96px;height:29.235px;}
.sp-page .sec-accompany1 {background:#fff;padding:34.4px 15px;display:flex;flex-direction:column;align-items:center;gap:22.93px;}
.sp-page .accompany1-heading {margin:-10px 0 0;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#222843;text-align:center;}
.sp-page .accompany1-frame {position:relative;padding:0 14px 24px;box-sizing:border-box;border-bottom:1px solid #252c51;display:flex;flex-direction:column;align-items:center;gap:22.93px;width:400px;}
.sp-page .accompany1-frame::before, .sp-page .accompany1-frame::after {content:'';position:absolute;top:14px;bottom:0;width:14px;border-top:1px solid #252c51;box-sizing:border-box;}
.sp-page .accompany1-frame::before {left:0;border-left:1px solid #252c51;}
.sp-page .accompany1-frame::after {right:0;border-right:1px solid #252c51;}
.sp-page .accompany1-list {display:flex;flex-direction:column;gap:22.93px;width:100%;}
/* 本文を指定の改行位置にするため、左右のpaddingを2pxずつ詰めて本文幅を+4px確保している
   (カード1は305.3px、カード3は297.0px必要だが、padding:10pxでは305.0px/296.0pxで足りなかった) */
.sp-page .accompany1-card {background:#f3f2ef;border-radius:4.59px;padding:10px 8px;display:flex;gap:10px;align-items:center;}
.sp-page .accompany1-card img {flex-shrink:0;}
.sp-page .accompany1-card-body h3 {margin:0 0 9.17px;font-family:var(--font-heading);font-weight:900;font-size:22.64px;line-height:1.3;color:#222843;}
.sp-page .accompany1-card-body p {margin:0;font-family:var(--font-body);font-weight:400;font-size:16.5px;line-height:1.65;color:#333;}
.sp-page .sec-values {position:relative;overflow:hidden;background:#f6f5f2;padding:34.4px 22.93px 57.33px;}
.sp-page .sec-values .values-bg-texture {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.6;pointer-events:none;}
.sp-page .values-heading {position:relative;margin:0 0 34.4px;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#30354e;}
.sp-page .values-list {position:relative;display:flex;flex-direction:column;gap:75.68px;}
.sp-page .value-card {position:relative;margin-left:19.49px;width:346.29px;}
.sp-page .value-label {display:inline-block;background:#222843;padding:3.44px 9.17px;margin-bottom:2.29px;margin-left:-19.49px;position:relative;z-index:2;}
.sp-page .value-label p {margin:0;font-family:var(--font-heading);font-weight:700;font-size:25.23px;line-height:1.6;letter-spacing:0.5px;color:#fff;white-space:nowrap;}
.sp-page .value-photo {width:346.29px;height:229.33px;object-fit:cover;display:block;margin-top:-24px;position:relative;z-index:1;}
.sp-page .value-box {background:#fff;width:346.29px;margin-top:-27.52px;position:relative;z-index:2;padding:22.93px 18.35px;box-sizing:border-box;}
.sp-page .value-box p {margin:0;font-family:var(--font-body);font-weight:400;font-size:18.35px;line-height:1.65;color:#222843;}
.sp-page .sec-voice {position:relative;background:#fff;padding:34.4px 0 45.87px;}
.sp-page .voice-heading {margin:0 0 15px;padding:0 22.93px;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#222843;text-align:center;}
.sp-page .voice-lead {margin:0 0 45.87px;padding:0 22.93px;font-family:var(--font-heading);font-weight:900;font-size:21.5px;line-height:1.45;letter-spacing:-0.73px;color:#222843;text-align:center;}
/* タグ(.voice-badge)がカード上辺をまたいで上へ出るため、その分の余白を確保している。
   この枠は overflow-y:hidden なので、余白が足りないとタグの上半分が切れる */
.sp-page .sec-voice .voice-track-wrap {width:100%;overflow-x:auto;overflow-y:hidden;padding-top:38px;padding-bottom:20px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:grab;}
.sp-page .sec-voice .voice-track-wrap.is-dragging {cursor:grabbing;scroll-snap-type:none;}
.sp-page .sec-voice .voice-track-wrap::-webkit-scrollbar {display:none;}
.sp-page .sec-voice .voice-track {display:flex;gap:22.93px;padding:0 22.93px;box-sizing:border-box;}
.sp-page .voice-card {position:relative;flex:0 0 auto;width:382px;background:#fff;border-radius:0 0 27.52px 0;box-shadow:4.59px 4.59px 13.76px rgba(0,0,0,0.12);padding:41.28px 16.05px 22.93px;scroll-snap-align:center;}
/* 角丸を上下反転(右上・左下 → 左上・右下)させて装飾を逆さにしている。
   文字は反転させないため transform ではなく border-radius の指定を入れ替えている */
.sp-page .voice-badge {position:absolute;left:0;top:0;max-width:calc(100% - 40px);box-sizing:border-box;background:#bc9471;border-radius:22.93px 0 22.93px 0;padding:2.29px 22.93px;transform:translateY(-50%);}
.sp-page .voice-badge p {margin:0;font-family:var(--font-heading);font-weight:700;font-size:20.64px;line-height:1.6;color:#fff;white-space:normal;}
/* 写真は枠いっぱいに表示する(はみ出す部分は切り取られる) */
.sp-page .voice-photo {width:100%;height:178.88px;object-fit:cover;object-position:center;background:#fff;border-radius:5px;display:block;margin-bottom:18.35px;}
.sp-page .voice-meta {background:#f3f2ef;display:inline-flex;align-items:center;justify-content:center;height:29.81px;padding:3.44px 10.32px 2.29px 6.88px;margin-bottom:18.35px;}
.sp-page .voice-meta p {margin:0;font-family:var(--font-heading);font-weight:700;font-size:18.35px;line-height:1.3;color:#333;white-space:nowrap;}
/* Enter改行(段落分割)とShift+Enter改行(行内改行)で行送りが変わらないよう、段落間に余白を持たせない */
/* font-feature-settings:"palt" は句読点などを全角固定幅ではなく字形に合わせた幅で組む指定。
   「。」「、」の後ろにできる全角分の空きが半分(16px→8px)に詰まる */
.sp-page .voice-card p.voice-text {margin:0;font-family:var(--font-body);font-weight:400;font-size:18.5px;line-height:1.65;color:#333;font-feature-settings:"palt" 1;}
.sp-page .sec-voice .voice-slidebar {position:relative;display:block;width:333px;height:18px;border-radius:9px;background:#DBDBDB;box-shadow:3.44px 3.44px 10px rgba(0,0,0,0.12);margin:22.93px auto 0;}
.sp-page .sec-voice .voice-slidebar-thumb {position:absolute;top:3px;left:0;height:12px;border-radius:6px;background:#252C51;transition:left 0.2s ease, width 0.2s ease;}
.sp-page .sec-cta3 {position:relative;width:430px;height:121.55px;background:#f3f2ef;}
.sp-page .cta3-heading {position:absolute;left:50%;top:3.44px;transform:translateX(-50%);margin:0;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.35;color:#252c51;text-align:center;white-space:nowrap;}
.sp-page .cta3-btn {position:absolute;top:66.51px;width:182.32px;height:41.28px;border-radius:4.59px;display:flex;align-items:center;justify-content:center;gap:6.88px;}
.sp-page .cta3-btn img {width:27.525px;height:24.075px;}
.sp-page .cta3-btn span {font-family:var(--font-body);font-weight:700;font-size:16.05px;letter-spacing:0.32px;color:#fff;white-space:nowrap;}
.sp-page .cta3-btn--line {left:27.52px;background:#99be49;}
.sp-page .cta3-btn--phone {left:220.16px;background:#f18a5c;}
.sp-page .cta3-btn--phone img {width:30.96px;height:29.235px;}
.sp-page .sec-cases {position:relative;background:#252c51;padding:34.4px 0;overflow:hidden;}
.sp-page .cases-heading {margin:0 0 22px;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#fff;text-align:center;}
.sp-page .cases-lead {margin:0 0 34.4px;font-family:var(--font-heading);font-weight:900;font-size:18.35px;line-height:1.45;letter-spacing:-0.73px;color:#fff;text-align:center;padding:0 20.64px;}
.sp-page .sec-cases .cases-track-wrap {width:100%;overflow-x:auto;overflow-y:hidden;padding-top:12px;padding-bottom:12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:grab;}
.sp-page .sec-cases .cases-track-wrap.is-dragging {cursor:grabbing;scroll-snap-type:none;}
.sp-page .sec-cases .cases-track-wrap::-webkit-scrollbar {display:none;}
.sp-page .cases-track {display:flex;gap:20.64px;padding:0 37.84px;box-sizing:border-box;}
.sp-page .case-card {flex-shrink:0;width:354.32px;background:#fff;border-radius:13.76px;padding:20.64px 18.35px;box-sizing:border-box;scroll-snap-align:center;}
.sp-page .case-photos {display:flex;flex-direction:column;align-items:center;gap:4.59px;margin-bottom:16.05px;}
.sp-page .case-photo-wrap {position:relative;width:100%;}
/* 画像は枠の95%幅で中央寄せ。左右に2.5%ずつ余白ができる */
.sp-page .case-photo-wrap img {width:95%;height:184.61px;object-fit:cover;border-radius:4.59px;display:block;margin:0 auto;}
/* タグの左位置は画像の左端(枠の2.5%)から9px外側。画像幅を変えたら2.5%も合わせて調整すること */
.sp-page .case-photo-tag {position:absolute;left:calc(2.5% - 9px);top:-9px;width:96px;height:31px;display:flex;align-items:center;justify-content:center;padding-right:9px;box-sizing:border-box;clip-path:polygon(0% 0%, 100% 0%, 85% 50%, 100% 100%, 0% 100%);}
.sp-page .case-photo-tag::after {content:"";position:absolute;left:0;bottom:-8px;width:8px;height:8px;background:rgba(0,0,0,0.35);clip-path:polygon(0 0, 100% 0, 0 100%);}
.sp-page .case-photo-tag--before {background:#222843;}
.sp-page .case-photo-tag--after {background:#f18a5c;}
.sp-page .case-photo-tag span {font-family:var(--font-heading);font-weight:700;font-size:18.35px;letter-spacing:0.39px;color:#fff;}
/* Polygon 11.pngは右向きの三角形。SPは画像が縦並びなので90度回して下向きにする */
/* 90度回転しているため要素が縦に占める高さ(56.82px)は見た目の高さ(27.52px)より大きい。
   上下のマイナスマージンで余分を打ち消し、Before/After画像の間隔を66px→33pxに詰めている */
.sp-page .case-arrow {display:block;width:27.52px;height:56.82px;flex-shrink:0;object-fit:contain;transform:rotate(90deg);margin:-16.5px 0;}
/* 表組みのままだと列幅が全行共通になり、「その他：」に合わせた幅のせいで
   「状況：」「内容：」の右に全角1文字分の余白ができてしまう。
   行をflexにして見出しを内容ぶんの幅にし、本文が見出しの直後から始まるようにしている(PC版と同じ考え方) */
.sp-page .case-table {width:100%;border-collapse:collapse;margin-bottom:13.76px;display:block;}
.sp-page .case-table tbody {display:block;}
.sp-page .case-table tr {display:flex;align-items:flex-start;}
.sp-page .case-table th, .sp-page .case-table td {text-align:left;font-size:18.35px;padding:6.88px 4.59px;border-top:1.15px solid #dbdbdb;vertical-align:top;}
.sp-page .case-table tr:first-child th, .sp-page .case-table tr:first-child td {border-top:none;}
.sp-page .case-table th {font-family:var(--font-heading);font-weight:900;color:#333;white-space:nowrap;flex:0 0 auto;}
/* 「状況」「内容」「その他」の後ろに「：」を付ける(PC版の .case-row dt::after と同じ扱い) */
.sp-page .case-table th::after {content:"：";}
.sp-page .case-table td {font-family:var(--font-body);font-weight:400;color:#333;line-height:1.4;flex:1 1 auto;}
.sp-page .case-quote {margin:0 0 13.76px;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.3;color:#222843;}
.sp-page .case-stats {display:flex;gap:22.93px;margin-bottom:9.17px;}
.sp-page .case-stat {display:flex;align-items:center;gap:6.88px;}
.sp-page .case-stat span.tag {background:#252c51;color:#fff;font-family:var(--font-body);font-weight:700;font-size:14.91px;padding:2.29px 6.88px;border-radius:2.29px;}
.sp-page .case-stat span.val {font-family:var(--font-body);font-weight:500;font-size:18.35px;color:#333;}
.sp-page .case-notes p {margin:0;font-family:var(--font-body);font-weight:400;font-size:16.05px;line-height:1.4;color:#333;}
.sp-page .sec-cases .cases-slidebar {position:relative;display:block;width:346px;height:18px;border-radius:9px;background:#fff;box-shadow:3.44px 3.44px 10px rgba(0,0,0,0.12);margin:34.4px auto 0;}
.sp-page .sec-cases .cases-slidebar-thumb {position:absolute;top:3px;left:0;height:12px;border-radius:6px;background:#F18A5C;transition:left 0.2s ease, width 0.2s ease;}
.sp-page .sec-flow {position:relative;background:#f4f2f0;padding:34.4px 32.08px 34.4px 30.93px;}
.sp-page .flow-inner {display:flex;flex-direction:column;align-items:center;gap:34.4px;width:366.99px;}
.sp-page .flow-heading {margin:0;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#222843;text-align:center;}
.sp-page .flow-badge {display:inline-flex;align-items:center;justify-content:center;background:#bc9471;border-radius:22.93px 0 22.93px 0;height:41.28px;padding:2.29px 9.17px;margin:13.76px auto 0;}
.sp-page .flow-badge p {margin:0;font-family:var(--font-heading);font-weight:700;color:#fff;white-space:nowrap;}
.sp-page .flow-badge .num {font-size:32.11px;letter-spacing:-1.28px;}
.sp-page .flow-badge .unit {font-size:25.23px;}
.sp-page .flow-steps {display:flex;flex-direction:column;gap:34.4px;width:100%;}
.sp-page .flow-step {position:relative;z-index:1;background:#fff;border-radius:9.17px;box-shadow:3.44px 3.44px 11.47px rgba(0,0,0,0.1);padding:18.35px 22.93px;display:flex;gap:13.76px;align-items:center;}
.sp-page .flow-line {position:absolute;left:50%;transform:translateX(-50%);top:258.8px;width:2px;height:638.7px;background:#222843;z-index:0;}
.sp-page .flow-step-icon {position:relative;width:67.65px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:2.29px;}
.sp-page .flow-step-icon img {height:60.54px;width:auto;max-width:67.65px;object-fit:contain;}
.sp-page .flow-step-badge {background:#bc9471;border-radius:114.67px;height:25.23px;padding:2.29px 10.32px;display:flex;align-items:center;justify-content:center;}
.sp-page .flow-step-badge span {font-family:var(--font-heading);font-weight:700;font-size:16.05px;color:#fff;white-space:nowrap;}
.sp-page .flow-step-body h3 {margin:0 0 9.17px;font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.3;color:#333;}
/* Step.4の見出し(ご確認後、ご納得いただいたうえで完了となります)だけ少し小さくする */
.sp-page .flow-steps .flow-step:last-child .flow-step-body h3 {font-size:19px;}
.sp-page .flow-step-body p {margin:0;font-family:var(--font-body);font-weight:500;font-size:16.35px;line-height:1.65;color:#333;}
.sp-page .flow-step-body p .accent {color:#da5e27;}
.sp-page .sec-thoughts {position:relative;background:#ecebe8;padding:34.4px 22.93px;display:flex;flex-direction:column;align-items:center;}
.sp-page .thoughts-heading {margin:0 0 28px;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#222843;text-align:center;}
.sp-page .thoughts-lead {margin:0 0 32.11px;font-family:var(--font-heading);font-weight:900;font-size:21.35px;line-height:1.45;letter-spacing:-0.73px;color:#222843;text-align:center;}
.sp-page .thoughts-quote {display:inline-block;background:#222843;padding:3.44px 9.17px;margin-bottom:2.29px;align-self:flex-start;}
.sp-page .thoughts-quote p {margin:0;font-family:var(--font-heading);font-weight:700;font-size:25.23px;line-height:1.6;letter-spacing:0.5px;color:#fff;white-space:nowrap;}
.sp-page .thoughts-body {margin:22.93px 0 0;font-family:var(--font-body);font-weight:400;font-size:17.35px;line-height:1.65;color:#222843;}
.sp-page .thoughts-sign {margin:11.47px 0 0;font-family:var(--font-heading);font-weight:900;font-size:18.35px;letter-spacing:-0.73px;color:#222843;text-align:right;width:100%;}
.sp-page .sec-faq {position:relative;background:#222843;padding:34.4px 22.93px;display:flex;flex-direction:column;align-items:center;gap:34.4px;}
.sp-page .faq-heading {margin:0;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#fff;text-align:center;}
.sp-page .faq-list {display:flex;flex-direction:column;gap:18.35px;width:384.13px;}
.sp-page .faq-item {background:#fff;border-radius:4.59px;padding:18.35px 24.08px 18.35px 22.93px;}
.sp-page .faq-item summary {list-style:none;cursor:pointer;}
.sp-page .faq-item summary::-webkit-details-marker {display:none;}
.sp-page .faq-item-row {display:flex;align-items:center;justify-content:space-between;gap:11.47px;}
.sp-page .faq-item-row p {margin:0;font-family:var(--font-body);font-weight:700;font-size:18px;line-height:1.3;color:#222843;}
.sp-page .faq-item-row img {width:12.61px;height:5.73px;flex-shrink:0;transition:transform 0.2s ease;}
.sp-page .faq-item[open] .faq-item-row img {transform:rotate(180deg);}
.sp-page .faq-answer {margin:18.35px 0 0;font-family:var(--font-body);font-weight:400;font-size:16px;line-height:1.65;color:#222843;}
.sp-page .sec-cta4 {position:relative;width:430px;height:121.55px;background:#222843;}
.sp-page .cta4-heading {position:absolute;left:50%;top:8.03px;transform:translateX(-50%);margin:0;font-family:var(--font-heading);font-weight:900;font-size:18.35px;line-height:1.4;color:#fff;text-align:center;white-space:nowrap;}
.sp-page .cta4-heading p:last-child {letter-spacing:-0.92px;}
.sp-page .cta4-btn {position:absolute;top:66.51px;width:182.32px;height:41.28px;border-radius:4.59px;display:flex;align-items:center;justify-content:center;gap:6.88px;}
.sp-page .cta4-btn img {width:18.35px;height:16.05px;}
/* CTA4は見積もりアイコンと共通指定のため、LINEのアイコンだけ1.5倍にする */
.sp-page .cta4-btn--line img {width:27.525px;height:24.075px;}
.sp-page .cta4-btn span {font-family:var(--font-body);font-weight:700;font-size:16.05px;letter-spacing:0.32px;color:#fff;white-space:nowrap;}
.sp-page .cta4-btn--line {left:220.16px;background:#99be49;}
.sp-page .cta4-btn--estimate {left:22.93px;background:#f18a5c;}
.sp-page .cta4-btn--estimate img {width:19.49px;height:21.79px;transform:scaleX(-1);}
.sp-page .cta4-btn--estimate span {font-size:13.76px;letter-spacing:-1.1px;}
.sp-page .sec-form {position:relative;background:#f4f2f0;padding:34.4px 22.93px 91.73px;display:flex;flex-direction:column;align-items:center;}
.sp-page .form-heading {margin:0 0 24px;font-family:var(--font-heading);font-weight:900;font-size:27.52px;line-height:1.25;color:#222843;text-align:center;}
.sp-page .form-lead {margin:0 0 34.4px;font-family:var(--font-heading);font-weight:900;font-size:22px;line-height:1.45;letter-spacing:-0.73px;color:#222843;text-align:center;}
.sp-page .sec-form form {width:379.55px;display:flex;flex-direction:column;gap:29.81px;}
.sp-page .form-label {display:flex;align-items:center;gap:6.88px;margin-bottom:6.88px;}
.sp-page .form-label span.title {font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.8;color:#222843;}
.sp-page .form-label span.tag {font-family:var(--font-body);font-weight:700;font-size:13.76px;padding:1.15px 9.17px;border-radius:2.29px;white-space:nowrap;}
.sp-page .form-label span.tag.required {background:#222843;color:#fff;}
.sp-page .form-label span.tag.optional {background:#dedcd8;color:#222843;}
.sp-page .sec-form input[type="text"], .sp-page .sec-form input[type="tel"], .sp-page .sec-form input[type="email"], .sp-page .sec-form textarea {width:100%;border:1.15px solid #cfcac0;border-radius:4.59px;background:#fff;padding:11.47px 16.05px;font-family:var(--font-body);font-size:18.35px;color:#333;box-sizing:border-box;}
.sp-page .sec-form textarea {height:167.41px;resize:none;}
.sp-page .form-radios {display:flex;flex-direction:column;gap:16.05px;margin-top:16.05px;}
.sp-page .form-radio {display:flex;align-items:center;gap:11.47px;}
.sp-page .form-radio input {width:25.23px;height:25.23px;accent-color:#222843;}
.sp-page .form-radio span {font-family:var(--font-body);font-weight:500;font-size:18.35px;color:#222843;}
.sp-page .form-privacy {display:flex;align-items:center;gap:11.47px;}
.sp-page .form-privacy input {width:21.79px;height:21.79px;}
.sp-page .form-privacy span {font-family:var(--font-body);font-weight:500;font-size:17.2px;color:#222843;text-decoration:underline;}
.sp-page .form-submit {display:flex;align-items:center;justify-content:center;width:100%;height:55.04px;border:none;border-radius:4.59px;background:#f18a5c;font-family:var(--font-body);font-weight:700;font-size:17.2px;letter-spacing:0.34px;color:#fff;cursor:pointer;}
/* Contact Form 7 が出力するマークアップ(PC側のクラス名で共通化)用スタイル */
.sp-page .sec-form form {width:379.55px;display:flex;flex-direction:column;gap:29.81px;}
.sp-page .sec-form .form-row {display:flex;flex-direction:column;}
.sp-page .sec-form .form-field-label {display:flex;align-items:center;gap:6.88px;margin-bottom:6.88px;}
.sp-page .sec-form .form-field-label .label-text {font-family:var(--font-heading);font-weight:900;font-size:20.64px;line-height:1.8;color:#222843;white-space:nowrap;}
/* 「必須」と「任意」で外形が変わらないよう、枠線ぶんの領域は両方に確保しておく */
.sp-page .sec-form .badge {position:relative;display:inline-flex;align-items:center;justify-content:center;padding:1.15px 9.17px;border-radius:2.29px;border:1px solid transparent;box-sizing:border-box;}
.sp-page .sec-form .badge img {display:none;}
.sp-page .sec-form .badge.badge-required {background:#222843;}
/* 「任意」はPC版と同じ 白地＋紺の枠線 にする */
.sp-page .sec-form .badge.badge-optional {background:#fff;border-color:#222843;}
.sp-page .sec-form .badge span {font-family:var(--font-body);font-weight:700;font-size:13.76px;white-space:nowrap;margin:0;}
.sp-page .sec-form .badge.badge-required span {color:#fff;}
.sp-page .sec-form .badge.badge-optional span {color:#222843;}
.sp-page .sec-form .consult-group {display:flex;flex-direction:column;gap:16.05px;margin-top:16.05px;}
.sp-page .sec-form .consult-group .wpcf7-form-control-wrap,
.sp-page .sec-form .consult-group .wpcf7-form-control,
.sp-page .sec-form .privacy-row .wpcf7-form-control-wrap,
.sp-page .sec-form .privacy-row .wpcf7-form-control {display:contents;}
.sp-page .sec-form .consult-group .wpcf7-list-item {margin:0;display:flex;align-items:center;}
.sp-page .sec-form .consult-group label {display:flex;align-items:center;gap:11.47px;cursor:pointer;}
.sp-page .sec-form .consult-group input[type="radio"] {width:25.23px;height:25.23px;accent-color:#222843;margin:0;}
.sp-page .sec-form .consult-group .wpcf7-list-item-label {font-family:var(--font-body);font-weight:500;font-size:18.35px;color:#222843;}
.sp-page .sec-form .form-text-input,
.sp-page .sec-form .form-textarea {width:100%;border:1.15px solid #cfcac0;border-radius:4.59px;background:#fff;padding:11.47px 16.05px;font-family:var(--font-body);font-size:18.35px;color:#333;box-sizing:border-box;}
.sp-page .sec-form .form-textarea {height:167.41px;resize:none;}
.sp-page .sec-form .form-text-input::placeholder,
.sp-page .sec-form .form-textarea::placeholder {color:#888;}
.sp-page .sec-form .privacy-row {display:flex;align-items:center;justify-content:center;}
.sp-page .sec-form .privacy-row .wpcf7-list-item {margin:0;}
.sp-page .sec-form .privacy-row label {display:flex;align-items:center;gap:11.47px;cursor:pointer;}
.sp-page .sec-form .privacy-row input[type="checkbox"] {width:21.79px;height:21.79px;margin:0;}
.sp-page .sec-form .privacy-link {font-family:var(--font-body);font-weight:500;font-size:17.2px;color:#222843;text-decoration:underline;}
.sp-page .sec-form .submit-wrap {position:relative;display:flex;justify-content:center;}
.sp-page .sec-form .submit-wrap .wpcf7-form-control-wrap {display:contents;}
.sp-page .sec-form .submit-wrap .wpcf7-spinner {position:absolute;top:50%;left:50%;margin:0 0 0 90px;transform:translateY(-50%);}
.sp-page .sec-form .btn-submit {width:100%;height:55.04px;border:none;border-radius:4.59px;background:#f18a5c;font-family:var(--font-body);font-weight:700;font-size:17.2px;letter-spacing:0.34px;color:#fff;cursor:pointer;}
.sp-page .sec-form .wpcf7-not-valid-tip {display:block;font-size:13px;color:#e2483d;margin-top:4px;}
.sp-page .sec-form .wpcf7-response-output {margin:20px 0 0;border-radius:4.59px;text-align:center;}
.sp-page .sec-footer {background:#fff;padding:80.27px 22.93px 13.76px;display:flex;flex-direction:column;align-items:center;gap:16.05px;text-align:center;}
.sp-page .sec-footer .logo-sub {font-family:var(--font-body);font-weight:700;font-size:13.76px;line-height:1.2;color:#252c51;}
.sp-page .sec-footer .logo-main {margin-top:0;font-family:var(--font-logo);font-weight:700;font-size:24.08px;letter-spacing:0.48px;color:#252c51;}
.sp-page .footer-address {margin:0;font-family:var(--font-body);font-weight:400;font-size:16.05px;line-height:1.5;letter-spacing:0.08px;color:#222843;}
.sp-page .footer-copyright {margin:0;font-family:var(--font-body);font-weight:400;font-size:11.47px;letter-spacing:0.06px;color:#909090;}

/* 差し替えたアイコン(line_icon.png / freeicon.png)は正方形。枠サイズは変えずに縦横比を保つ */
.sp-page .cta1-btn--line img, .sp-page .cta1-btn--phone img,
.sp-page .cta2-btn--line img, .sp-page .cta2-btn--phone img,
.sp-page .cta3-btn--line img, .sp-page .cta3-btn--phone img,
.sp-page .cta4-btn--line img { object-fit: contain; }