/* サービス（/services 配下4ページ）専用
   2026-10-14 伊藤様承認のデザイン（Claude Design v9）を実装。
   色は tokens.css のトークンを使う。灰色の文字は使わない（紺のみ）。
   2026-10-15 タブと上部の写真を外し、写真カード（案C-3）を追加。 */
.sv { background: var(--bg, #fff); color: var(--navy); }
.sv-wrap { max-width: 1120px; margin: 0 auto; padding: 64px 16px; }
.sv-sec--mint { background: #EEF8F3; }
.sv-sec--sky { background: var(--bg-blue); }

/* 上部：パンくず＋中央の見出し（2026-10-15 写真とタブを外した） */
.sv-top { max-width: 1200px; margin: 0 auto; padding: 32px 16px 0; }
.sv-bc { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; font-size: 16px; color: var(--navy); }
.sv-bc a { color: var(--link-green); font-weight: 700; }
.sv-head { text-align: center; padding: 24px 0 0; }
.sv-en { font-family: "Inter", sans-serif; font-size: 34px; font-weight: 700; letter-spacing: 0.16em; color: var(--navy); }
.sv-head h1 { margin: 10px 0 0; font-size: 20px; font-weight: 700; letter-spacing: 0.2em; color: var(--link-green); }
.sv-lead { margin: 20px auto 0; max-width: 760px; font-size: 18px; line-height: 1.8; letter-spacing: 0.06em; color: var(--navy); }
.sv-wave { display: block; margin: 12px auto 0; }

/* 見出し */
.sv-kicker { font-family: "Inter", sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.3em; color: var(--link-green); text-align: center; }
.sv h2 { margin: 12px 0 0; font-size: 32px; font-weight: 700; letter-spacing: 0.12em; line-height: 1.5; color: var(--navy); text-align: center; }

/* 並び */
.sv-grid { display: grid; gap: 24px; margin-top: 32px; }
.sv-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; margin-left: auto; margin-right: auto; gap: 28px; }
.sv-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sv-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sv-grid--1 { grid-template-columns: minmax(0, 1fr); max-width: 480px; margin-left: auto; margin-right: auto; }

/* カード */
.sv-card { display: block; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 28px 24px; text-align: center; color: var(--navy); transition: transform .3s cubic-bezier(.5,.25,0,1), box-shadow .3s; }
.sv-card--plain { border: 0; }
a.sv-card:hover, .sv-card:hover { transform: translateY(-6px); box-shadow: 0 16px 32px rgba(11,26,51,.10); }
.sv-ill { display: block; width: 100%; height: 140px; object-fit: contain; }
.sv-ph { display: block; width: 100%; height: 170px; object-fit: cover; border-radius: 6px; }
.sv-can { text-align: center; }
.sv-can .sv-wrap { padding-top: 48px; padding-bottom: 48px; }
.sv-can .sv-check li { font-size: 18px; }
.sv-sub { margin: 20px 0 0; font-size: 17px; line-height: 1.8; color: var(--navy); }
.sv-ill-bg { background: #EEF8F3; border-radius: 8px; padding: 20px; }
.sv-ill-bg--sky { background: var(--bg-blue); }
.sv-num { margin-top: 22px; font-family: "Inter", sans-serif; font-size: 15px; font-weight: 700; letter-spacing: 0.2em; color: var(--link-green); }
.sv-card h3 { margin: 18px 0 0; font-size: 20px; font-weight: 700; letter-spacing: 0.06em; line-height: 1.5; color: var(--navy); }
.sv-num + h3 { margin-top: 6px; }
.sv-card p { margin: 10px 0 0; font-size: 16px; line-height: 1.8; color: var(--navy); }
.sv-more { margin-top: 18px; font-size: 16px; font-weight: 700; color: var(--link-green); }

/* サービスのカード（写真＋水色のフィルター＋白い英字／下に名前・緑の線・料金の帯・チェックの箇条書き・緑のボタン）
   2026-10-15 番号を外し、料金を水色の帯で強調（案C2）。 */
.sv-pcard { display: flex; flex-direction: column; background: #fff; border: 1px solid #cfe9f3; border-radius: 8px; overflow: hidden; text-align: center; color: var(--navy); box-shadow: 0 10px 28px rgba(11,26,51,.18); transition: transform .3s cubic-bezier(.5,.25,0,1), box-shadow .3s; }
.sv-pcard:hover { transform: translateY(-6px); box-shadow: 0 18px 36px rgba(11,26,51,.22); }
.sv-pcard__ph { position: relative; height: 200px; overflow: hidden; }
.sv-pcard__ph img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.35) contrast(.9) brightness(.9); }
.sv-pcard__ph::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(170,225,245,.28); }
.sv-pcard__ph::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(135deg, rgba(64,180,230,.55), rgba(120,220,215,.45)); mix-blend-mode: soft-light; }
.sv-pcard__en { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; padding: 0 16px; font-family: "Inter", sans-serif; font-size: 34px; font-weight: 900; letter-spacing: 0.12em; line-height: 1.2; color: #fff; text-shadow: 0 2px 12px rgba(11,26,51,.45); }
.sv-pcard__body { display: flex; flex-direction: column; flex: 1; padding: 6px 24px 28px; }
.sv .sv-pcard h2, .sv-pcard h3 { margin: 22px 0 0; font-size: 20px; font-weight: 700; letter-spacing: 0.04em; line-height: 1.5; color: var(--navy); }
.sv-pcard__bar { display: block; width: 48px; height: 4px; margin: 12px auto 0; border-radius: 999px; background: var(--accent); }
.sv-pcard .sv-pcard__price { margin: 16px -24px 0; padding: 10px 16px; background: var(--bg-blue); font-size: 16px; font-weight: 700; color: var(--navy); }
.sv-pcard__price b { font-size: 28px; letter-spacing: 0.04em; }
/* ボタン：TOPの .more-btn と同じ見た目（紺の帯・白文字・右端の「>」・ホバーで緑が左から流れ込む）2026-10-16 伊藤様指示。ホバー時の文字は緑の上で白だと2.5:1のため紺にする */
.sv-pbtn, .sv-btn { position: relative; isolation: isolate; overflow: hidden; display: block; box-sizing: border-box; padding: 14px 40px 14px 22px; background: var(--navy); color: #fff; font-size: 17px; font-weight: 700; text-align: center; border-radius: 4px; transition: color .35s; }
.sv-pbtn::before, .sv-btn::before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; background: var(--accent); transform: translateX(-96%); transition: transform .5s ease-in-out; }
.sv-pbtn > span, .sv-btn > span { position: absolute; z-index: 1; top: 50%; right: 16px; transform: translateY(-50%); line-height: 1; }
.sv-btn { width: 360px; max-width: 100%; margin-top: 28px; }
.sv-pcard .sv-check { margin: 18px auto 24px; }
/* 緑のチェックつき箇条書き（カード・お問い合わせ共通） */
.sv-check { display: inline-block; list-style: none; margin: 16px auto 0; padding: 0; text-align: left; }
.sv-check li { position: relative; padding-left: 28px; font-size: 16px; line-height: 1.7; color: var(--navy); word-break: auto-phrase; text-wrap: pretty; }
.sv-check li + li { margin-top: 4px; }
.sv-check li::before { content: ""; position: absolute; left: 4px; top: 7px; width: 7px; height: 12px; border: solid var(--accent); border-width: 0 3px 3px 0; transform: rotate(45deg); }
.sv-pcard:hover .sv-pbtn, .sv-btn:hover { color: var(--navy); }
.sv-pcard:hover .sv-pbtn::before, .sv-btn:hover::before { transform: translateX(0); }

/* お悩み */
.sv-worry { display: flex; flex-direction: column; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 24px; text-align: center; }
.sv-worry::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); }
.sv-worry p { margin: 0; font-size: 17px; line-height: 1.8; font-weight: 500; color: var(--navy); }

/* お悩み→解決（/services のみ・2026-10-15 イラスト→お悩み→矢印→解決の縦カード＝案I1） */
.sv-solve { display: flex; flex-direction: column; align-items: center; background: #fff; border-radius: 8px; padding: 28px 20px; text-align: center; color: var(--navy); }
.sv-solve__ill { display: block; width: 100%; height: 150px; object-fit: contain; }
.sv-solve__tag { display: inline-block; margin-top: 18px; padding: 2px 14px; border-radius: 999px; background: var(--navy); color: #fff; font-size: 16px; font-weight: 700; }
.sv-solve__q { margin: 10px 0 0; font-size: 17px; line-height: 1.7; font-weight: 500; color: var(--navy); word-break: auto-phrase; }
.sv-solve__arrow { width: 0; height: 0; margin: 14px 0; border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 16px solid var(--accent); }
.sv-solve__a { margin: 0; width: 100%; background: #D1FAE5; border-radius: 8px; padding: 12px; font-size: 18px; line-height: 1.6; font-weight: 700; color: var(--navy); word-break: auto-phrase; }

/* 作成範囲の囲み */
.sv-box { border: 2px solid var(--accent); padding: 32px 28px; }
.sv-box--navy { border-color: var(--navy); }
.sv-label { display: inline-block; margin-top: 20px; font-size: 15px; font-weight: 700; color: #fff; background: var(--link-green); border-radius: 999px; padding: 4px 16px; }
.sv-box--navy .sv-label { background: var(--navy); }
.sv-box h3 { margin-top: 14px; font-size: 22px; }
.sv-box ul { margin: 14px 0 0; padding: 0; list-style-position: inside; font-size: 17px; line-height: 1.7; color: var(--navy); }
.sv-box .sv-note { margin-top: 14px; font-weight: 700; line-height: 1.8; }

/* 料金 */
.sv-price { max-width: 760px; margin: 40px auto 0; background: #fff; border: 2px solid var(--accent); border-radius: 8px; padding: 40px; text-align: center; }
.sv-price strong { display: block; font-size: 26px; font-weight: 700; letter-spacing: 0.1em; color: var(--navy); }
.sv-price p { margin: 14px 0 0; font-size: 17px; line-height: 1.8; color: var(--navy); }
.sv-plan { border: 2px solid var(--line); padding: 40px 32px; }
.sv-plan--main { border-color: var(--accent); }
.sv-plan h3 { margin: 0; font-size: 21px; letter-spacing: 0.1em; }
.sv-yen { margin-top: 18px; color: var(--navy); }
.sv-yen b { font-family: "Inter", sans-serif; font-size: 56px; font-weight: 700; }
.sv-yen span { font-size: 22px; font-weight: 700; }
.sv-yen small { font-size: 17px; }
.sv-tax { margin-top: 6px; font-size: 14px; font-weight: 700; color: var(--navy); }
.sv-plan p { margin-top: 20px; font-size: 17px; }

/* お問い合わせ */

/* ボタン（.company-btn と同じ見た目：紺の帯・ホバーで緑が左から・右端「>」） */

/* 表示の動き */
.sv-in { animation: svUp 1s cubic-bezier(.5,.25,0,1) both; }
.sv-d1 { animation-delay: .15s; } .sv-d2 { animation-delay: .3s; } .sv-d3 { animation-delay: .45s; } .sv-d4 { animation-delay: .6s; }
@keyframes svUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .sv-in, .sv-card, .sv-btn, .sv-pcard, .sv-pbtn { animation: none; transition: none; }
  .sv-btn::before, .sv-pbtn::before { transition: none; }
  .sv-card:hover, .sv-pcard:hover, .sv-pcard:hover .sv-pbtn { transform: none; }
}

/* スマホ・タブレット：すべて縦1列・中央寄せ */
@media (max-width: 860px) {
  .sv-wrap { padding: 48px 16px; }
  .sv-en { font-size: 30px; }
  .sv-lead { font-size: 17px; }
  .sv-lead br { display: none; }
  .sv h2 { font-size: 26px; }
  .sv-grid--2, .sv-grid--3, .sv-grid--4 { grid-template-columns: minmax(0, 1fr); }
  .sv-btn { width: 100%; }
}

/* 一覧ページ（/services）2026-10-15 伊藤様承認：お悩みカード→丸バッジ→解決カード／写真の上のお問い合わせ */
.sv-head h1 { font-size: 32px; letter-spacing: 0.12em; color: var(--navy); margin-top: 14px; word-break: auto-phrase; text-wrap: balance; }
.sv-sec--cards .sv-wrap { padding-top: 40px; }
/* サービスカードの写真：紺の膜（約40%）＋白線の円と文字を重ねる（2026-10-16 伊藤様承認・参考＝raccoon.ship-inc.jp の特徴欄）。図形は固定px＝スマホでも文字は16px */
.sv-pcard__ph--ov img { filter: none; }
.sv-pcard__ph--ov::before { background: rgba(11,26,51,.4); }
.sv-pcard__ph--ov::after { display: none; }
.sv-ov { position: absolute; left: 50%; top: 50%; z-index: 2; width: 280px; height: 190px; transform: translate(-50%, -50%); }
.sv-ov svg { display: block; fill: none; stroke: #fff; stroke-width: 1.5; }
.sv-ov span { position: absolute; transform: translate(-50%, -50%); font-size: 16px; font-weight: 700; line-height: 1.4; color: #fff; text-shadow: 0 1px 6px rgba(11,26,51,.85); white-space: nowrap; }
.sv-ov__a { left: 78px; top: 56px; }
.sv-ov__b { left: 202px; top: 56px; }
.sv-ov__c { left: 140px; top: 152px; }
.sv-ctaph { position: relative; isolation: isolate; background: url("/assets/about/260528_about_lab.jpg") center / cover no-repeat; color: #fff; text-align: center; padding: 88px 16px; }
.sv-ctaph::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(135deg, rgba(11,26,51,.78) 0%, rgba(16,185,129,.18) 100%), rgba(11,26,51,.55); }
.sv .sv-ctaph h2 { margin: 0; color: #fff; font-size: 30px; letter-spacing: .1em; }
.sv-ctaph .sv-check { margin-top: 24px; }
.sv-ctaph .sv-check li { font-size: 17px; color: #fff; }
.sv-ctaph p { max-width: 720px; margin: 24px auto 32px; font-size: 17px; line-height: 1.8; color: #fff; }
.sv-wbtn { display: inline-flex; justify-content: space-between; align-items: center; width: 360px; max-width: 100%; margin-top: 32px; padding: 18px 28px; font-size: 17px; font-weight: 700; border-radius: 4px; color: var(--navy); background: linear-gradient(90deg, var(--accent) 50%, #fff 50%) right / 200% 100% no-repeat; transition: background-position .35s, color .35s; }
.sv-wbtn:hover { background-position: left; color: #fff; }
@media (prefers-reduced-motion: reduce) { .sv-wbtn { transition: none; } }
@media (max-width: 860px) {
  .sv-head h1 { font-size: 24px; letter-spacing: .06em; }
  .sv .sv-ctaph h2 { font-size: 24px; letter-spacing: .04em; }
  .sv-ctaph { padding: 64px 16px; }
  .sv-wbtn { width: 100%; }
}

/* アクセシビリティ（services配下のみ） */
.sv .site-header nav { font-size: 16px; }
.sv .site-header nav a { display: inline-flex; align-items: center; min-height: 44px; }
.sv .site-header nav a.nav-cta { font-size: 16px; padding: 0 20px; background: var(--accent, #10B981); color: var(--navy); }
.sv .site-header nav a.nav-cta:hover { background: var(--navy); color: #fff; }
.sv .site-header nav a { color: var(--navy); }
.sv .site-header nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.sv .site-footer .footer-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; opacity: 1; }
.sv .site-footer .footer-bottom { font-size: 16px; opacity: 1; }
.sv-skip { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--navy); color: #fff; padding: 12px 20px; border-radius: 6px; font-weight: 700; }
.sv-skip:focus { top: 8px; }
.sv .site-footer .footer-bottom a { color: #fff; text-decoration: underline; }

/* 2026-10-21 上部を写真背景＋薄い青のオーバーレイに。直下に4ページのタブ（湘南クラウド会計事務所 /info の形） */
.sv-hero { position: relative; background-size: cover; background-position: center; isolation: isolate; }
.sv-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(6,34,84,.85) 0%, rgba(90,170,230,.35) 100%); }
.sv-hero .sv-top { padding-bottom: 56px; }
@media (max-width: 860px) { .sv-hero .sv-top { padding-bottom: 40px; } }

/* 2026-10-21 上部：濃い青の背景＋白文字（影つき）＋行間を詰める */
.sv-hero .sv-bc, .sv-hero .sv-bc a, .sv-hero .sv-en, .sv-hero .sv-head h1, .sv-hero .sv-lead { color: #fff; text-shadow: 0 2px 6px rgba(0,0,0,.55), 0 0 2px rgba(0,0,0,.4); }
.sv-hero .sv-bc { line-height: 1.4; }
.sv-hero .sv-head { padding-top: 16px; }
.sv-hero .sv-en { line-height: 1; margin: 0 0 6px; font-size: 16px; font-weight: 600; letter-spacing: .3em; }
.sv-hero .sv-head h1 { margin-top: 2px; line-height: 1.2; }
.sv-hero .sv-wave { display: none; }
.sv-hero .sv-lead { margin-top: 12px; line-height: 1.6; }

/* 2026-10-21 カード写真：円を外し白文字ラベルのみ */
.sv-ov { width: 100%; height: auto; left: 0; top: 0; right: 0; bottom: 0; transform: none; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, rgba(6,34,84,.35), rgba(6,34,84,.55)); }
.sv-ov span { position: static; transform: none; font-size: 24px; font-weight: 800; letter-spacing: .08em; text-shadow: 0 2px 6px rgba(0,0,0,.6), 0 0 2px rgba(0,0,0,.4); }

/* 2026-10-21 一覧の上部：写真なし・白地に紺文字（shonan-cloud /service 参考） */
.sv-hero--plain::before { display: none; }
.sv-hero--plain .sv-bc, .sv-hero--plain .sv-bc a, .sv-hero--plain .sv-en, .sv-hero--plain .sv-head h1, .sv-hero--plain .sv-lead { color: var(--navy); text-shadow: none; }
.sv-hero--plain .sv-en { font-size: clamp(40px, 7vw, 64px); font-weight: 800; letter-spacing: .14em; line-height: 1.1; }
.sv-hero--plain .sv-head h1 { font-size: clamp(20px, 3vw, 28px); margin-top: 12px; }
.sv-hero--plain .sv-lead { margin-top: 16px; }
.sv-hero--plain .sv-top { padding-bottom: 40px; }

/* パンくず：他ページ同様に左上 */
.sv-bc { justify-content: flex-start; gap: 0; text-align: left; }
.sv-bc .sep { margin: 0 8px; }
.sv-bc [aria-current="page"] { font-weight: 700; }
.sv-pcard__desc { margin: 14px 0 0; font-size: 16px; line-height: 1.7; color: var(--navy); text-align: left; }
/* スライド作成：余白と行間を詰める */
.sv-compact .sv-wrap { padding: 44px 16px; }
.sv-compact .sv-can .sv-wrap { padding: 40px 16px; }
.sv-compact .sv-grid { margin-top: 24px; gap: 16px; }
.sv-compact .sv-card { padding: 20px; }
.sv-compact .sv-card h3 { margin-top: 8px; }
.sv-compact .sv-card p { margin-top: 6px; line-height: 1.7; }
.sv-compact .sv-check li { line-height: 1.7; }
.sv-compact .sv-sub { margin-top: 16px; line-height: 1.7; }
@media (max-width: 860px) { .sv-compact .sv-wrap { padding: 36px 16px; } .sv-compact .sv-can .sv-wrap { padding: 32px 16px; } }

/* 2026-10-21 ご依頼の流れ：白い丸＋緑のアイコン（Material Symbols Rounded）＋段階の間に▶（shonan-cloud /service 参考） */
.sv-flow .sv-card { position: relative; }
.sv-ico { display: flex; align-items: center; justify-content: center; width: 96px; height: 96px; margin: 0 auto 16px; border-radius: 50%; background: #fff; box-shadow: 0 4px 16px rgba(11,26,51,.10); }
.sv-ico .material-symbols-rounded { font-family: "Material Symbols Rounded"; font-size: 40px; line-height: 1; color: var(--accent); font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; }
.sv-flow .sv-card::after { content: ""; position: absolute; top: 76px; right: -19px; z-index: 1; border-style: solid; border-width: 9px 0 9px 12px; border-color: transparent transparent transparent var(--navy); }
.sv-flow.sv-grid--3 .sv-card:nth-child(3n)::after, .sv-flow.sv-grid--4 .sv-card:last-child::after { display: none; }
@media (max-width: 860px) {
  .sv-flow .sv-card::after { top: auto; right: auto; bottom: -19px; left: 50%; transform: translateX(-50%); border-width: 12px 9px 0 9px; border-color: var(--navy) transparent transparent transparent; }
  .sv-flow.sv-grid--3 .sv-card:nth-child(3n)::after { display: block; }
  .sv-flow .sv-card:last-child::after { display: none; }
}

/* 2026-10-26 スマホ表示の是正（伊藤様承認）：語の途中で改行しない／1文字だけの行を作らない／社名を割らない／
   スマホでは飾りの英字・カード写真を小さく、3行以上の文章は左そろえ。文字は16px未満にしない */
.sv h1, .sv h2, .sv h3, .sv p, .sv li { word-break: auto-phrase; }
.sv h1, .sv h2, .sv h3, .sv-pcard__en, .sv-ov span { text-wrap: balance; }
.sv p, .sv li { text-wrap: pretty; }
.sv .site-footer .footer-bottom a { white-space: nowrap; }
@media (max-width: 860px) {
  .sv-hero--plain .sv-en { font-size: 32px; letter-spacing: .1em; }
  .sv-hero--plain .sv-top { padding-bottom: 28px; }
  .sv-sec--cards .sv-wrap { padding-top: 24px; }
  .sv-pcard__ph { height: 160px; }
  .sv-pcard__body { padding: 4px 20px 24px; }
  .sv-pcard .sv-check { margin: 14px auto 20px; }
  .sv-plan p, .sv-price p, .sv-sub, .sv-ctaph p { text-align: left; }
  .sv-plan { padding: 32px 20px; }
}

/* 2026-10-26 見出しの階層・箇条書きの印・説明文の位置（伊藤様承認） */
.sv .sv-head h1 { font-size: 40px; }
.sv h2 { font-size: 30px; }
.sv-card h3, .sv-plan h3 { font-size: 22px; }
.sv-check li::before { left: 6px; top: 0.75em; width: 8px; height: 8px; border: 0; border-radius: 50%; background: var(--accent); transform: none; }
.sv-intro { margin: 0 auto 48px; text-align: left; color: var(--navy); }
.sv .mk { background: linear-gradient(transparent 60%, var(--marker) 60%); padding: 0 2px; }
@media (max-width: 860px) {
  .sv .sv-head h1 { font-size: 30px; letter-spacing: 0.02em; }
  .sv h2 { font-size: 24px; }
  .sv-card h3, .sv-plan h3 { font-size: 20px; }
  .sv-intro { margin-bottom: 36px; }
}
/* サービスTOPのカード3枚：説明文・箇条書き・ボタンの開始位置をそろえる（PCのみ・subgrid） */
.sv-pbtn { margin-top: auto; }
@media (min-width: 861px) {
  .sv-sec--cards .sv-grid--3 { row-gap: 0; }
  .sv-sec--cards .sv-pcard { display: grid; grid-row: span 7; grid-template-rows: subgrid; }
  .sv-sec--cards .sv-pcard__body { display: contents; }
  .sv-sec--cards .sv-pcard__body > h2, .sv-sec--cards .sv-pcard__desc { margin-left: 24px; margin-right: 24px; }
  .sv-sec--cards .sv-pcard .sv-pcard__price { margin: 16px 0 0; }
  .sv-sec--cards .sv-pcard .sv-check { margin: 18px 24px 24px; align-self: start; }
  .sv-sec--cards .sv-pcard__desc { align-self: start; }
  .sv-sec--cards .sv-pbtn { margin: 0 24px 28px; align-self: end; }
}