@charset "UTF-8";
/*
 * ======================================
 * 那覇空港パーキングSLK — サイト固有CSS（site.css）
 * ======================================
 * 配色・フォントは scss/main.scss の @use "vars" with(...) で上書きし
 * main.css にコンパイル済み（base=#37B7E8 / sub=#5ECCF4 / accent=#68C100 /
 * dark=#0b3a4d・#08394d / font=Noto Sans JP）。
 * 本ファイルは claude-design-output の固有レイアウト・余白・装飾を
 * slk- プレフィックスで再現する（共通クラスで再現できない差分のみ）。
 *
 * --------------------------------------
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * --------------------------------------
 * 共通パーツ
 *   .slk-header / .slk-topbar / .slk-headmain / .slk-logo / .slk-gnav / .slk-tel
 *   .slk-line-btn(--sm/--md/--lg/--hero/--full) - 緑のLINE CTAボタン（全ページ共通）
 *   .slk-footcta / .slk-footbody               - フッターLINE帯＋ダーク本体
 *   .slk-phero                                 - 下層ページの写真ヒーロー
 *   .slk-eyebrow / .slk-h2 / .slk-lead / .slk-textlink - 見出し・本文・矢印リンク
 *   .slk-badge-green / .slk-leadbox / .slk-notice / .slk-alert - バッジ・囲み枠・注意枠
 * ページ固有
 *   TOP     : .slk-hero / .slk-values / .slk-media / .slk-band / .slk-finalcta
 *   about   : .slk-nayami / .slk-bubble / .slk-solve / .slk-reasons / .slk-point / .slk-lineband
 *   flow    : .slk-steps / .slk-step / .slk-flowrow / .slk-paybox / .slk-tips / .slk-ctabox
 *   pricing : .slk-plans / .slk-plan / .slk-important / .slk-sim
 *
 * --------------------------------------
 * 共通SCSSに不足していたもの（5分類）
 * --------------------------------------
 * ・構造不足：上部ユーティリティバー付き2段ヘッダー、円形画像がカード上端に
 *             重なるバリューカード（.slk-value__circle の -100px 重なり）
 * ・装飾パターン不足：吹き出し（三角しっぽ）、POINTグラデ円バッジ、STEPリボンバッジ
 * ・値の粒度不足：design固有の余白（44/56/72/80/88px）・角丸(14/16px)・
 *             clamp可変フォントが共通utilityの刻みに無く個別指定
 * ・状態不足：バリューカードhoverで円が浮く（.slk-value:hover .slk-value__circle）
 * ・指定方向不足：—
 */

/* =====================================================================
 * ベース微調整
 * ===================================================================== */
body { color: #1f3d49; }
main { display: block; }

/* 汎用見出し・本文 */
.slk-eyebrow { display: block; font-weight: 800; font-size: 13px; color: #37B7E8; letter-spacing: .1em; }
.slk-h2 { font-weight: 800; font-size: clamp(22px, 3.4vw, 32px); line-height: 1.4; margin: 8px 0 0; color: #08394d; }
.slk-h2c { font-weight: 800; font-size: clamp(20px, 3.6vw, 30px); line-height: 1.35; margin: 6px 0 0; color: #08394d; }
.slk-lead { font-size: 16px; line-height: 1.95; margin: 18px 0 0; color: #3a5a68; }
.slk-sec-sub { margin: 0; color: #5a7683; font-size: 15px; }
.slk-accent { color: #37B7E8; }

/* 中央見出しの改行を整える（行の均等化＋禁則強化） */
.slk-phero__title,
.slk-nayami__lead,
.slk-solve__lead,
.slk-solve__sub,
.slk-reasons__title,
.slk-lineband__title,
.slk-lineband__lead { text-wrap: balance; line-break: strict; }
/* 文節を1かたまりとして扱い、句の途中で改行させない */
.slk-nb { display: inline-block; }
/* スマホ専用の改行（PCでは無効、≤640で有効） */
.slk-sp-br { display: none; }
/* タブレット以下の改行（PCでは無効、≤900で有効） */
.slk-tb-br { display: none; }

/* タブレット以下：リード文は左揃え／タブレット改行を有効化 */
@media (max-width: 900px) {
  .slk-tb-br { display: inline; }
  .slk-leadbox__text { text-align: left; }
}

.slk-sec-head { text-align: center; margin-bottom: 34px; }
.slk-sec-head .slk-h2c { margin-bottom: 8px; }

.slk-hr { border: 0; border-top: 1px solid #dbeaf1; max-width: 1000px; margin: 0 auto 56px; height: 0; }
.slk-hr--flush { margin-bottom: 0; }
.slk-center { text-align: center; }
.slk-center--mt { margin-top: 26px; }
.slk-h2c__sub { font-size: clamp(15px, 2.2vw, 18px); color: #37B7E8; }

/* 矢印付きテキストリンク */
.slk-textlink {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 24px;
  color: #0b3a4d; text-decoration: none; font-weight: 800; font-size: 16px;
  background: #eaf7fd; padding: 14px 26px; border-radius: 5px; transition: .2s;
}
.slk-textlink i { font-size: .9em; }
.slk-textlink:hover { background: #dcf0fb; opacity: 1; }
.slk-textlink--solid { color: #fff; background: #37B7E8; }
.slk-textlink--solid:hover { background: #2aa3d6; }

/* =====================================================================
 * LINE CTAボタン（全ページ共通）
 * ===================================================================== */
.slk-line-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: #68C100; color: #fff; text-decoration: none; font-weight: 800;
  border-radius: 5px; box-shadow: 0 6px 16px rgba(104,193,0,.4); line-height: 1.3;
  transition: .2s;
}
.slk-line-btn i { font-size: 1.3em; }
.slk-line-btn:hover { color: #fff; opacity: .92; }
.slk-line-btn--sm   { font-size: 15px; padding: 11px 20px; }
.slk-line-btn--md   { font-size: clamp(16px, 3vw, 19px); padding: 17px 36px; box-shadow: 0 10px 24px rgba(104,193,0,.4); }
.slk-line-btn--hero { font-size: 18px; padding: 17px 32px; box-shadow: 0 10px 24px rgba(104,193,0,.45); }
.slk-line-btn--lg   { font-size: clamp(17px, 3vw, 20px); padding: 18px 40px; box-shadow: 0 12px 28px rgba(104,193,0,.4); }
.slk-line-btn--full { width: 100%; font-size: 16px; padding: 14px; }
.slk-line-btn__txt { text-align: center; }

/* =====================================================================
 * ヘッダー
 * ===================================================================== */
.slk-header { position: sticky; top: 0; z-index: 100; background: #fff; box-shadow: 0 2px 18px rgba(94,204,244,.18); }

/* 上部ユーティリティバー */
.slk-topbar { background: linear-gradient(90deg, #5ECCF4, #7FD8F6); color: #083a4d; font-size: 13px; font-weight: 700; }
.slk-topbar__inner { max-width: 1200px; margin: 0 auto; padding: 7px 20px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.slk-topbar__item { display: flex; align-items: center; gap: 8px; }
.slk-topbar__item i { font-size: 15px; }
.slk-topbar__item--push { margin-left: auto; }
.slk-topbar__social { display: flex; align-items: center; gap: 10px; }
.slk-social-btn { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 5px; background: rgba(255,255,255,.55); color: #083a4d; text-decoration: none; font-size: 16px; transition: .2s; }
.slk-social-btn:hover { background: rgba(255,255,255,.85); color: #083a4d; opacity: 1; }

/* メインバー */
.slk-headmain { background: #fff; }
.slk-headmain__inner { max-width: 1200px; margin: 0 auto; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.slk-logo { display: flex; align-items: center; gap: 11px; text-decoration: none; flex-shrink: 0; }
.slk-logo:hover { opacity: 1; }
.slk-logo__img { height: 46px; width: auto; display: block; flex-shrink: 0; }
.slk-logo__text { display: flex; flex-direction: column; line-height: 1.15; }
.slk-logo__name { font-weight: 800; font-size: 19px; color: #0b3a4d; letter-spacing: .02em; }
.slk-logo__sub { font-size: 11px; color: #5a7683; font-weight: 500; letter-spacing: .08em; }

.slk-gnav { display: flex; align-items: center; gap: 4px; }
.slk-gnav__item { font-weight: 700; font-size: 15px; text-decoration: none; padding: 9px 15px; border-radius: 5px; transition: .15s; white-space: nowrap; color: #3a5a68; }
.slk-gnav__item:hover { background: #f2f9fd; color: #0b3a4d; opacity: 1; }
.slk-gnav__item.is-current { color: #0b3a4d; background: #eaf7fd; }

.slk-headact { display: flex; align-items: center; gap: 12px; }
.slk-tel { display: flex; flex-direction: column; align-items: flex-end; text-decoration: none; line-height: 1.1; }
.slk-tel:hover { opacity: 1; }
.slk-tel__label { font-size: 10px; color: #5a7683; font-weight: 700; letter-spacing: .06em; }
.slk-tel__num { font-weight: 800; font-size: 20px; color: #0b3a4d; white-space: nowrap; }

/* ハンバーガー位置調整（メインバー内・ロゴと同じ高さに寄せる） */
.nav-toggle { top: 38px; right: 14px; }
@media (max-width: 600px) { .nav-toggle { top: 34px; } }

/* SPナビ内の電話 */
.slk-spnav-tel { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; color: #fff; font-weight: 800; font-size: 16px; text-decoration: none; background: rgba(255,255,255,.12); padding: 13px; border-radius: 5px; }
.slk-spnav-tel:hover { color: #fff; opacity: 1; }

@media (max-width: 1100px) {
  /* PCナビ・右側CTA・上部バー右側は非表示（固定ハンバーガーとの重なり回避） */
  .slk-gnav, .slk-headact { display: none; }
  .slk-topbar__social, .slk-topbar__item--push { display: none; }
  .slk-headmain__inner { padding-right: 64px; } /* 固定バーガー分の逃げ */
}
@media (max-width: 600px) {
  .slk-topbar { font-size: 11px; }
  .slk-topbar__item i { font-size: 13px; }
  .slk-logo__img { height: 38px; }
  .slk-logo__name { font-size: 16px; }
  .slk-logo__sub { font-size: 10px; }
}
@media (max-width: 360px) {
  .slk-logo__name { font-size: 14px; }
  .slk-logo__sub { display: none; }
}

/* =====================================================================
 * フッター
 * ===================================================================== */
.slk-footcta { background: #37B7E8; background-size: cover; background-position: center; padding: 68px 20px; text-align: center; color: #fff; }
.slk-footcta__inner { max-width: 900px; margin: 0 auto; }
.slk-footcta__title { font-weight: 800; font-size: clamp(22px, 4vw, 30px); margin: 0 0 6px; line-height: 1.35; }
.slk-footcta__lead { margin: 0 0 22px; font-size: 15px; opacity: .95; }
.slk-footcta .slk-line-btn { box-shadow: 0 10px 26px rgba(11,58,77,.28); }

.slk-footbody { background: #0b3a4d; color: #dceef6; padding: 46px 20px 26px; }
.slk-footbody__inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 36px; }
.slk-footbody__logo { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.slk-footbody__logo img { height: 44px; width: auto; display: block; flex-shrink: 0; }
.slk-footbody__name { font-weight: 800; font-size: 19px; color: #fff; }
.slk-footbody__addr { margin: 0; font-size: 14px; line-height: 1.9; color: #b6d7e5; }
.slk-footbody__sns { display: flex; gap: 10px; margin-top: 16px; }
.slk-footbody__snsbtn { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 5px; background: rgba(255,255,255,.1); color: #fff; text-decoration: none; font-size: 18px; transition: .2s; }
.slk-footbody__snsbtn:hover { background: rgba(255,255,255,.22); color: #fff; opacity: 1; }
.slk-footbody__heading { font-weight: 800; font-size: 14px; color: #7fd8f6; margin: 0 0 14px; letter-spacing: .06em; }
.slk-footbody__nav { display: flex; flex-direction: column; gap: 11px; }
.slk-footbody__nav a { color: #dceef6; text-decoration: none; font-size: 14px; }
.slk-footbody__nav a:hover { color: #7fd8f6; opacity: 1; }
.slk-footbody__contact { display: flex; flex-direction: column; gap: 13px; font-size: 14px; }
.slk-footbody__contact a { color: #dceef6; text-decoration: none; }
.slk-footbody__contact a:hover { color: #7fd8f6; opacity: 1; }
.slk-footbody__contact span { color: #b6d7e5; line-height: 1.7; }
.slk-footbody__copy { max-width: 1100px; margin: 34px auto 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); font-size: 12px; color: #8fb6c7; text-align: center; }

/* ハンバーガー表示（≤1100）でフッターのページナビを非表示にし2カラムに */
@media (max-width: 1100px) {
  .slk-footbody__col--nav { display: none; }
  .slk-footbody__inner { grid-template-columns: 1.4fr 1fr; gap: 32px; }
}
@media (max-width: 760px) {
  /* CTA帯：縦余白を圧縮＋ボタンを1行フル幅で中央に */
  .slk-footcta { padding: 46px 20px; }
  .slk-footcta__title { font-size: clamp(19px, 5.2vw, 26px); }
  .slk-footcta .slk-line-btn { display: flex; width: 100%; max-width: 340px; margin: 0 auto; padding: 15px 16px; font-size: clamp(13px, 3.8vw, 16px); white-space: nowrap; }
  /* 本体：1カラム中央寄せでバランスを整える */
  .slk-footbody { padding-top: 40px; }
  .slk-footbody__inner { grid-template-columns: 1fr; gap: 30px; text-align: center; }
  .slk-footbody__logo { justify-content: center; }
  .slk-footbody__sns { justify-content: center; }
  .slk-footbody__contact { align-items: center; }
  .slk-footbody__copy { margin-top: 28px; }
}

/* ページトップボタン（common .page-top 前提。SP位置微調整のみ） */
.page-top { z-index: 90; }
/* ハンバーガー表示（≤1100）では非表示 */
@media (max-width: 1100px) { .page-top { display: none; } }

/* =====================================================================
 * スマホ固定LINEボタン（画面下部・スマホのみ）
 * ===================================================================== */
.slk-fixed-line {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 140;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #68C100;
  color: #fff;
  font-weight: 800;
  font-size: 16px;
  padding: 14px 16px;
  text-decoration: none;
  box-shadow: 0 -4px 16px rgba(11,58,77,.18);
}
.slk-fixed-line i { font-size: 1.3em; }
.slk-fixed-line:hover { color: #fff; opacity: .95; }

@media (max-width: 767px) {
  .slk-fixed-line { display: flex; }
  /* 固定バー分の余白確保（コピーライトが隠れないように） */
  .slk-footbody { padding-bottom: 76px; }
  /* MV内のLINEボタンは固定バーと重複するため非表示 */
  .slk-hero__actions .slk-line-btn { display: none; }
  /* スマホ時のMV高さ */
  .slk-hero { height: 80vh; min-height: 0; }
}

/* =====================================================================
 * 下層ページヒーロー（写真＋暗幕＋中央タイトル）
 * ===================================================================== */
.slk-phero { position: relative; padding: 120px 20px; overflow: hidden; }
.slk-phero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.slk-phero__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,57,77,.5), rgba(8,57,77,.62)); }
.slk-phero__inner { position: relative; max-width: 1000px; margin: 0 auto; text-align: center; }
.slk-phero__title { font-weight: 800; font-size: clamp(26px, 4.6vw, 42px); line-height: 1.4; margin: 0; color: #fff; text-shadow: 0 2px 16px rgba(4,42,58,.4); }

/* =====================================================================
 * TOP：ヒーロー
 * ===================================================================== */
.slk-hero { position: relative; width: 100%; height: calc(100vh - 104px); min-height: 520px; overflow: hidden; }
.slk-hero__slides { position: absolute; inset: 0; z-index: 0; }
/* CMSメインスライダー（Swiper）＋静止画フォールバック */
#slideshow .slk-hero__fallback { position: absolute; inset: 0; z-index: 0; }
#slideshow .slk-hero__fallback img { width: 100%; height: 100%; object-fit: cover; display: block; }
#slideshow #cms-slider-1-1-area { position: absolute; inset: 0; z-index: 1; }
#slideshow .swiper, #slideshow .swiper-container, #slideshow .swiper-slide { height: 100%; }
#slideshow .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* CMSメインスライダー(#main_slider)は外枠(.slk-hero)に高さ100%で追従させる */
#slideshow #main_slider.slider_wrapper { --swiper-wrapper-height: 100%; height: 100%; }
.slk-hero__scrim { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(90deg, rgba(4,42,58,.72) 0%, rgba(4,42,58,.5) 42%, rgba(4,42,58,.12) 100%); }
.slk-hero__inner { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; pointer-events: none; }
.slk-hero__container { max-width: 1200px; width: 100%; margin: 0 auto; padding: 0 24px; }
.slk-hero__body { max-width: 640px; pointer-events: auto; }
.slk-hero__badge { display: inline-block; background: rgba(255,255,255,.95); color: #0b7fb0; font-weight: 800; font-size: clamp(12px, 1.6vw, 14px); padding: 7px 16px; border-radius: 999px; }
.slk-hero__title { font-weight: 800; font-size: clamp(27px, 5.4vw, 58px); line-height: 1.24; margin: 20px 0 0; color: #fff; letter-spacing: .01em; white-space: nowrap; text-shadow: 0 2px 20px rgba(4,42,58,.4); }
.slk-hero__title .slk-hl { color: #7fe0ff; }
.slk-hero__lead { font-size: clamp(15px, 2vw, 18px); line-height: 1.9; margin: 20px 0 0; color: #eaf7fd; text-shadow: 0 1px 12px rgba(4,42,58,.5); }
.slk-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; align-items: center; }
.slk-hero__price { display: inline-flex; align-items: center; gap: 12px; background: rgba(255,255,255,.95); padding: 12px 22px; border-radius: 5px; box-shadow: 0 6px 16px rgba(4,42,58,.2); }
.slk-hero__price-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 5px; background: #eaf7fd; color: #37B7E8; font-size: 20px; }
.slk-hero__price-text { line-height: 1.25; }
.slk-hero__price-text strong { display: block; font-weight: 800; font-size: 16px; color: #08394d; }
.slk-hero__price-text small { font-size: 13px; color: #5a7683; }
.slk-hero__price-text b { font-weight: 800; font-size: 19px; color: #37B7E8; }

@media (max-width: 860px) {
  .slk-hero__title { white-space: normal; }
}

/* =====================================================================
 * TOP：バリューストリップ
 * ===================================================================== */
.slk-values { max-width: 1100px; margin: 0 auto; padding: 56px 20px 80px; }
.slk-values__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 100px; }
.slk-value { background: #2f9fd0; border: 2px solid #2f9fd0; border-radius: 5px; padding: 0 22px 26px; text-align: center; }
.slk-value__circle { width: 200px; height: 200px; margin: -100px auto 8px; border-radius: 50%; border: 5px solid #2f9fd0; background: #fff; overflow: hidden; transition: transform .3s ease; }
.slk-value__circle img { width: 100%; height: 100%; object-fit: contain; display: block; }
.slk-value:hover .slk-value__circle { transform: translateY(-12px); }
.slk-value__title { font-weight: 800; font-size: 19px; margin: 0 0 6px; color: #fff; }
.slk-value__list { list-style: none; margin: 0; padding: 0; display: inline-flex; flex-direction: column; gap: 6px; text-align: left; }
.slk-value__list li { font-size: 14px; line-height: 1.6; color: #eaf7fd; display: flex; gap: 8px; }
.slk-value__list i { flex-shrink: 0; color: #d6f3ff; margin-top: 3px; font-size: .9em; }

@media (max-width: 860px) {
  .slk-values__grid { grid-template-columns: 1fr; gap: 100px; margin-top: 120px; }
}

/* =====================================================================
 * TOP：導線（画像＋テキスト2カラム）
 * ===================================================================== */
.slk-band { }
.slk-band--tint { background: linear-gradient(160deg, #f0faff, #daf2fc); }
.slk-band__inner { max-width: 1100px; margin: 0 auto; padding: 80px 20px; }
.slk-media { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
.slk-media__img { position: relative; width: 100%; aspect-ratio: 4 / 3; border-radius: 5px; overflow: hidden; box-shadow: 0 18px 40px rgba(11,58,77,.15); }
.slk-media__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.slk-price-chip { display: inline-flex; align-items: baseline; gap: 8px; margin-top: 20px; background: #fff; padding: 14px 24px; border-radius: 5px; box-shadow: 0 6px 16px rgba(11,58,77,.1); }
.slk-price-chip__unit { font-size: 14px; color: #5a7683; }
.slk-price-chip__num { font-weight: 800; font-size: 30px; color: #37B7E8; }
.slk-price-chip__tax { font-size: 14px; color: #5a7683; }
.slk-flow-note { display: flex; align-items: center; gap: 10px; margin-top: 18px; font-size: 14px; color: #3a5a68; line-height: 1.6; }
.slk-flow-note i { color: #37B7E8; flex-shrink: 0; }

@media (max-width: 860px) {
  .slk-media { grid-template-columns: 1fr; gap: 28px; }
  .slk-media__img { order: -1; }
}

/* =====================================================================
 * TOP：最終CV
 * ===================================================================== */
.slk-finalcta { max-width: 1100px; margin: 0 auto; padding: 40px 20px 88px; }
.slk-finalcta__box { position: relative; overflow: hidden; background: #0b3a4d; border-radius: 5px; padding: clamp(32px, 5vw, 52px); text-align: center; color: #fff; }
.slk-finalcta__box::before { content: ""; position: absolute; top: -50px; right: -40px; width: 220px; height: 220px; border-radius: 50%; background: rgba(94,204,244,.25); }
.slk-finalcta__title { position: relative; font-weight: 800; font-size: clamp(19px, 3.6vw, 32px); line-height: 1.5; margin: 0; }
.slk-finalcta__lead { position: relative; margin: 16px auto 0; max-width: 640px; font-size: 15px; line-height: 1.9; color: #b6d7e5; }
.slk-finalcta .slk-line-btn { position: relative; margin-top: 28px; }

/* =====================================================================
 * about：お悩み（吹き出し）
 * ===================================================================== */
.slk-badge-green { display: inline-block; background: #68C100; color: #fff; font-weight: 800; font-size: clamp(15px, 2.2vw, 19px); padding: 11px 26px; border-radius: 999px; box-shadow: 0 6px 16px rgba(0,0,0,.15); }
.slk-badge-green--sm { font-size: 13px; padding: 6px 16px; box-shadow: none; }

.slk-nayami { background: #37B7E8; padding: 56px 20px; overflow: hidden; }
.slk-nayami__head { max-width: 1000px; margin: 0 auto; text-align: center; }
.slk-nayami__lead { font-size: clamp(16px, 2.2vw, 20px); font-weight: 700; line-height: 1.9; margin: 20px auto 0; max-width: 760px; color: #fff; }
.slk-nayami__grid { display: grid; grid-template-columns: 1fr minmax(200px, 260px) 1fr; gap: 20px; align-items: center; margin: 44px auto 0; max-width: 840px; }
.slk-nayami__col { display: flex; flex-direction: column; gap: 28px; }
.slk-nayami__img { width: 100%; display: grid; place-items: center; }
.slk-nayami__img img { width: 100%; max-width: 220px; height: auto; object-fit: contain; display: block; }
.slk-bubble { position: relative; background: #fff; border-radius: 16px; padding: 18px 22px; box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.slk-bubble p { margin: 0; font-size: 14px; line-height: 1.75; color: #3a5a68; }
.slk-bubble::after { content: ""; position: absolute; top: 50%; width: 18px; height: 18px; background: #fff; transform: translateY(-50%) rotate(45deg); }
.slk-bubble--right::after { right: -8px; }
.slk-bubble--left::after { left: -8px; }

@media (max-width: 820px) {
  .slk-nayami__grid { grid-template-columns: 1fr; }
  .slk-nayami__img { order: -1; }
  .slk-nayami__img img { max-width: 300px; }
  .slk-bubble::after { display: none; }
}

/* about：解決リード */
.slk-solve { max-width: 1000px; margin: 0 auto; padding: 80px 20px; text-align: center; }
.slk-solve__lead { font-weight: 800; font-size: clamp(19px, 3vw, 26px); line-height: 1.7; color: #08394d; margin: 0; }
.slk-solve__sub { margin: 14px 0 0; color: #5a7683; font-size: 15px; }
.slk-solve__logo { display: block; width: 200px; max-width: 56%; height: auto; margin: 0 auto 24px; }

/* about：3つの理由（POINT） */
.slk-reasons { background: linear-gradient(160deg, #f5fbfe, #e9f6fc); }
.slk-reasons__inner { max-width: 1080px; margin: 0 auto; padding: 72px 20px; }
.slk-reasons__head { text-align: center; margin-bottom: 44px; }
.slk-reasons__title { font-weight: 800; font-size: clamp(22px, 3.6vw, 30px); margin: 6px 0 0; color: #08394d; }
.slk-reasons__title-big { font-size: clamp(30px, 5.2vw, 46px); color: #37B7E8; }
.slk-reasons__list { display: flex; flex-direction: column; gap: 28px; padding-top: 12px; }
.slk-point { position: relative; display: grid; grid-template-columns: 96px 1fr; gap: 26px; align-items: center; background: #fff; border-radius: 16px; padding: 32px 32px 32px 28px; box-shadow: 0 10px 26px rgba(11,58,77,.1); }
.slk-point__badge { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 96px; height: 96px; border-radius: 50%; background: linear-gradient(135deg, #5ECCF4, #37B7E8); box-shadow: 0 8px 18px rgba(55,183,232,.35); }
.slk-point__badge-label { font-weight: 800; font-size: 12px; color: #d6f3ff; line-height: 1; letter-spacing: .12em; margin-bottom: 3px; }
.slk-point__badge-num { font-weight: 800; font-size: 34px; color: #fff; line-height: 1; }
.slk-point__title { font-weight: 800; font-size: clamp(18px, 2.6vw, 22px); margin: 0 0 10px; color: #08394d; padding-bottom: 10px; border-bottom: 2px dashed #bfe6f7; }
.slk-point__arrow { color: #37B7E8; font-size: .85em; margin: 0 .1em; }
.slk-point__text { margin: 0; font-size: 15px; line-height: 1.95; color: #3a5a68; }

@media (max-width: 820px) {
  .slk-point { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .slk-point__title { text-align: center; }
  .slk-point__text { text-align: left; }
}

/* about：LINE予約バンド */
.slk-lineband { max-width: 1000px; margin: 0 auto; padding: 72px 20px 0; }
.slk-lineband__box { position: relative; overflow: hidden; background: #08394d; background-size: cover; background-position: center; border-radius: 5px; padding: clamp(32px, 4vw, 52px); text-align: center; margin-top: 72px; }
.slk-lineband__box::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,57,77,.62), rgba(8,57,77,.78)); }
.slk-lineband__inner { position: relative; }
.slk-lineband__title { font-weight: 800; font-size: clamp(21px, 3.4vw, 28px); line-height: 1.5; margin: 16px 0 0; color: #fff; }
.slk-lineband__lead { margin: 14px auto 0; max-width: 600px; font-size: 15px; line-height: 1.9; color: #eaf7fd; }
.slk-lineband .slk-line-btn { margin-top: 24px; }

/* 注意枠（アンバー） */
.slk-notice { max-width: 1000px; margin: 0 auto; padding: 64px 20px 88px; }
.slk-notice__box { border: 2px solid #ffe0a8; background: #fff9ee; border-radius: 5px; padding: 24px 26px; }
.slk-notice__title { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 17px; margin: 0 0 6px; color: #8a5a00; }
.slk-notice__title i { color: #eab000; font-size: 20px; flex-shrink: 0; }
.slk-notice__text { margin: 0; font-size: 14px; line-height: 1.9; color: #6b5220; }

/* =====================================================================
 * flow
 * ===================================================================== */
.slk-sec-narrow { max-width: 1000px; margin: 0 auto; padding: 56px 20px 8px; }

/* リードボックス（囲み＋上部バッジ） */
.slk-leadbox { position: relative; border: 2px solid #9adcf5; background: #f4fbfe; border-radius: 16px; padding: 50px 28px 42px; text-align: center; margin-top: 14px; }
.slk-leadbox__badge { position: absolute; left: 50%; top: -22px; transform: translateX(-50%); display: inline-block; background: #37B7E8; color: #fff; font-weight: 800; font-size: clamp(16px, 2.4vw, 21px); padding: 11px 30px; border-radius: 999px; box-shadow: 0 6px 16px rgba(55,183,232,.35); white-space: nowrap; }
.slk-leadbox__text { font-size: clamp(15px, 2vw, 17px); line-height: 2; margin: 0; color: #2c5666; }
.slk-leadbox--green { border-color: #b6e59a; background: #f4fbe9; }
.slk-leadbox--green .slk-leadbox__badge { background: #68C100; box-shadow: 0 6px 16px rgba(104,193,0,.35); }

/* STEP カード */
.slk-sec-step { max-width: 1080px; margin: 0 auto; padding: 80px 20px 8px; }
.slk-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.slk-step { position: relative; background: #fff; border: 2px solid #cdeefb; border-radius: 14px; padding: 44px 24px 28px; text-align: center; box-shadow: 0 8px 22px rgba(11,58,77,.06); }
.slk-step__badge { position: absolute; top: -18px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; background: #68C100; color: #fff; font-weight: 800; font-size: 13px; padding: 7px 18px; border-radius: 999px; box-shadow: 0 6px 14px rgba(104,193,0,.35); white-space: nowrap; letter-spacing: .08em; }
.slk-step__badge b { font-size: 18px; line-height: 1; }
.slk-step__title { font-weight: 800; font-size: 18px; margin: 6px 0 8px; color: #08394d; }
.slk-step__text { text-align: left; margin: 0; font-size: 14px; line-height: 1.85; color: #5a7683; }

@media (max-width: 820px) {
  .slk-steps { grid-template-columns: 1fr; }
}

/* 赤アラート枠 */
.slk-alert { border: 2px solid #ffcaca; background: #fff5f5; border-radius: 5px; padding: 20px 24px; margin-top: 22px; text-align: center; }
.slk-alert__icon { flex-shrink: 0; font-size: 22px; color: #e05555; line-height: 1.3; }
.slk-alert p { margin: 0; font-size: 14px; line-height: 1.9; color: #8a3535; text-align: center; }
.slk-alert strong { color: #8a3535; }
.slk-alert__title { display: block; font-size: 18px; text-align: center; text-decoration: underline; text-underline-offset: 8px; margin-bottom: 10px; }

/* 当日の流れ */
.slk-flowsec { max-width: 1000px; margin: 0 auto; padding: 80px 20px 8px; }
.slk-flowsec__head { text-align: center; margin-bottom: 40px; }
.slk-flowsec__head .slk-h2c { margin: 0; }
.slk-flowsec__head p { margin: 12px 0 0; color: #5a7683; font-size: 15px; }
.slk-flowhead { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.slk-flowhead__icon { font-size: 26px; color: #37B7E8; }
.slk-flowhead--green .slk-flowhead__icon { color: #68C100; }
.slk-flowhead__title { font-weight: 800; font-size: clamp(20px, 3.2vw, 26px); margin: 0; color: #08394d; }
.slk-flowhead__title small { font-size: 15px; color: #5a7683; font-weight: 700; }
.slk-flowhead__tag { display: inline-block; vertical-align: 3px; margin-right: 10px; padding: 3px 24px 3px 14px; background: #5ECCF4; color: #fff; font-size: .82em; font-weight: 800; letter-spacing: .04em; clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 50%, calc(100% - 13px) 100%, 0 100%); }
.slk-flowhead--green .slk-flowhead__tag { background: #68C100; }
.slk-flowlist { display: flex; flex-direction: column; gap: 14px; }
.slk-flowrow { display: grid; grid-template-columns: 44px 1fr; gap: 18px; align-items: start; background: #f4fbfe; border-radius: 5px; padding: 22px 24px; }
.slk-flowrow__num { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #5ECCF4; color: #fff; font-weight: 800; font-size: 18px; }
.slk-flowrow--green .slk-flowrow__num { background: #68C100; }
.slk-flowrow__title { font-weight: 800; font-size: 17px; margin: 0 0 6px; color: #08394d; }
.slk-flowrow__text { margin: 0; font-size: 14px; line-height: 1.85; color: #3a5a68; }

@media (max-width: 820px) {
  /* 数字は横並びのまま維持し、右側の空白をなくす */
  .slk-flowrow { grid-template-columns: 38px 1fr; gap: 4px; padding: 15px 15px; }
  .slk-flowrow__num { width: 33px; height: 33px; font-size: 15px; }
}

/* 決済手段（ダークボックス） */
.slk-paysec { max-width: 1000px; margin: 0 auto; padding: 64px 20px 8px; }
.slk-paysec--lg { padding-top: 80px; }
.slk-paybox { background: #08394d; border-radius: 5px; padding: clamp(26px, 4vw, 38px); color: #fff; }
.slk-paybox__head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.slk-paybox__head i { font-size: 24px; color: #7fd8f6; }
.slk-paybox__head h2 { font-weight: 800; font-size: clamp(19px, 3vw, 24px); margin: 0; }
.slk-paybox__lead { margin: 0 0 24px; font-size: 14px; color: #b6d7e5; }
.slk-paygrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.slk-paycard { background: rgba(255,255,255,.08); border-radius: 5px; padding: 20px; }
.slk-paycard__title { font-weight: 800; color: #7fd8f6; font-size: 14px; margin: 0 0 8px; }
.slk-paycard__text { margin: 0; font-size: 13px; line-height: 1.8; color: #dceef6; }

@media (max-width: 820px) {
  .slk-paygrid { grid-template-columns: 1fr; }
}

/* お役立ちアドバイス */
.slk-tips { max-width: 1000px; margin: 0 auto; padding: 80px 20px 8px; }
.slk-tips__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.slk-tipcard { border: 2px solid #cdeefb; border-radius: 5px; padding: 24px; }
.slk-tipcard__title { font-weight: 800; font-size: 16px; margin: 0 0 6px; color: #08394d; display: flex; align-items: center; gap: 8px; }
.slk-tipcard__title i { color: #37B7E8; }
.slk-tipcard__text { margin: 0; font-size: 14px; line-height: 1.85; color: #3a5a68; }

@media (max-width: 820px) {
  .slk-tips__grid { grid-template-columns: 1fr; }
}

/* CTAボックス（淡グラデ） */
.slk-ctasec { max-width: 1000px; margin: 0 auto; padding: 72px 20px 72px; }
.slk-ctabox { background: linear-gradient(160deg, #f0faff, #daf2fc); border-radius: 5px; padding: clamp(28px, 4vw, 44px); text-align: center; }
.slk-ctabox__title { font-weight: 800; font-size: clamp(18px, 3.4vw, 27px); line-height: 1.5; margin: 0; color: #08394d; }
.slk-ctabox__lead { margin: 14px auto 0; max-width: 620px; font-size: 15px; line-height: 1.9; color: #3a5a68; }
.slk-ctabox .slk-line-btn { margin-top: 24px; }
.slk-ctalinks { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 26px; }
.slk-ctalinks a { color: #0b3a4d; text-decoration: none; font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.slk-ctalinks a:hover { color: #37B7E8; opacity: 1; }
.slk-ctalinks i { color: #37B7E8; }

/* =====================================================================
 * pricing
 * ===================================================================== */
.slk-plansec { max-width: 900px; margin: 0 auto; padding: 80px 20px 8px; }
.slk-plansec .slk-sec-head { margin-bottom: 30px; }
.slk-plans { display: flex; flex-direction: column; gap: 16px; }
.slk-plan { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; border-radius: 5px; padding: 28px 32px; }
.slk-plan--main { background: linear-gradient(135deg, #5ECCF4, #37B7E8); color: #fff; box-shadow: 0 16px 34px rgba(55,183,232,.3); }
.slk-plan--add { background: #fff9ee; border: 2px solid #ffe0a8; padding: 24px 32px; }
.slk-plan__name { font-weight: 800; font-size: 20px; margin: 0; }
.slk-plan__sub { margin: 4px 0 0; font-size: 13px; opacity: .9; }
.slk-plan__price { margin: 0; font-weight: 800; font-size: clamp(30px, 6vw, 42px); white-space: nowrap; }
.slk-plan__price small { font-size: 16px; font-weight: 700; }
.slk-plan--add .slk-plan__name { font-size: 18px; color: #8a5a00; }
.slk-plan--add .slk-plan__sub { color: #6b5220; opacity: 1; }
.slk-plan--add .slk-plan__price { font-size: clamp(24px, 5vw, 32px); color: #c98a00; }
.slk-plan--save { background: #f1fae9; border: 2px solid #cfe9a8; padding: 24px 32px; }
.slk-plan--save .slk-plan__name { font-size: 18px; color: #3a6b00; }
.slk-plan--save .slk-plan__sub { color: #4a6b20; opacity: 1; }
.slk-plan--save .slk-plan__price { font-size: clamp(24px, 5vw, 32px); color: #4f9400; }

/* 大切なご案内（赤枠） */
.slk-important { max-width: 900px; margin: 0 auto; padding: 64px 20px 8px; }
.slk-important__box { border: 2px solid #ffcaca; background: #fff5f5; border-radius: 5px; padding: 26px 28px; }
.slk-important__title { font-weight: 800; font-size: 17px; margin: 0 0 16px; color: #8a3535; text-align: center; padding-bottom: 12px; border-bottom: 2px solid #ffcaca; display: flex; align-items: center; justify-content: center; gap: 8px; }
.slk-important__list { display: flex; flex-direction: column; gap: 14px; }
.slk-important__list p { margin: 0; font-size: 14px; line-height: 1.85; color: #5a3a3a; }
.slk-important__list strong { color: #8a3535; }
.slk-important__note { margin: 16px 0 0; font-size: 13px; color: #7a5a5a; line-height: 1.8; }

/* 日数別シミュレーション */
.slk-simsec { max-width: 1000px; margin: 0 auto; padding: 80px 20px 8px; }
.slk-simsec .slk-sec-head { margin-bottom: 30px; }
.slk-sim { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.slk-sim__card { background: #f4fbfe; border-radius: 5px; padding: 22px 14px; text-align: center; }
.slk-sim__label { font-weight: 800; font-size: 15px; margin: 0 0 8px; color: #5a7683; }
.slk-sim__label small { font-size: 12px; font-weight: 500; }
.slk-sim__price { font-weight: 800; font-size: 22px; margin: 0; color: #37B7E8; }
.slk-sim__card--pop { position: relative; background: linear-gradient(160deg, #eafaf0, #d6f2c8); border: 2px solid #68C100; }
.slk-sim__card--pop .slk-sim__label { color: #3a6b00; }
.slk-sim__card--pop .slk-sim__price { color: #4f9400; }
.slk-sim__pop-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: #68C100; color: #fff; font-weight: 800; font-size: 11px; padding: 4px 12px; border-radius: 999px; white-space: nowrap; }
.slk-sim__note { text-align: center; margin: 18px 0 0; font-size: 14px; color: #5a7683; }
.slk-sim__hint { display: flex; gap: 14px; align-items: flex-start; background: #eaf7fd; border-radius: 5px; padding: 22px 26px; margin-top: 24px; }
.slk-sim__hint i { flex-shrink: 0; font-size: 22px; color: #f2b100; line-height: 1.3; }
.slk-sim__hint p { margin: 0; font-size: 14px; line-height: 1.9; color: #2c5666; }
.slk-sim__hint strong { color: #08394d; }

@media (max-width: 820px) {
  .slk-sim { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .slk-sim { grid-template-columns: 1fr; }
}

/* =====================================================================
 * レスポンシブ調整（スマホ最適化：縦余白の圧縮・はみ出し防止）
 * ===================================================================== */
@media (max-width: 640px) {
  /* 下層ヒーロー */
  .slk-phero { padding: 74px 18px; }

  /* スマホ専用改行を有効化 */
  .slk-sp-br { display: inline; }

  /* TOP */
  .slk-values { padding: 40px 16px 56px; }
  .slk-value__circle { width: 180px; height: 180px; margin-top: -90px; }
  .slk-band__inner { padding: 52px 18px; }
  .slk-textlink { font-size: 14px; padding: 13px 22px; }
  .slk-finalcta { padding: 32px 16px 56px; }
  .slk-finalcta__lead { font-size: 14px; }
  .slk-finalcta .slk-line-btn { display: flex; width: 100%; max-width: 340px; margin: 26px auto 0; padding: 15px 18px; font-size: 15px; line-height: 1.45; }

  /* about */
  .slk-nayami { padding: 44px 16px; }
  .slk-solve { padding: 52px 18px; }
  .slk-reasons__inner { padding: 48px 16px; }
  .slk-point { padding: 24px 20px; gap: 16px; }
  .slk-lineband { padding-top: 48px; }
  .slk-lineband__box { margin-top: 48px; }
  .slk-notice { padding: 44px 16px 56px; }

  /* flow / pricing 共通セクション */
  .slk-sec-narrow { padding: 40px 16px 8px; }
  .slk-sec-step,
  .slk-flowsec,
  .slk-tips,
  .slk-plansec,
  .slk-simsec { padding: 52px 16px 8px; }
  .slk-flowrow__title { font-size: 16px; }
  .slk-paysec { padding: 44px 16px 8px; }
  .slk-paysec--lg { padding-top: 52px; }
  .slk-important { padding: 44px 16px 8px; }
  .slk-ctasec { padding: 48px 16px 48px; }
  .slk-ctabox__lead { font-size: 14px; }
  .slk-ctabox .slk-line-btn { display: flex; width: 100%; max-width: 360px; margin: 24px auto 0; white-space: nowrap; font-size: clamp(12px, 3.6vw, 15px); padding: 15px 14px; }
  .slk-ctabox .slk-line-btn i { font-size: 1.15em; }

  /* 内側ボックスの余白・角丸の詰め */
  .slk-leadbox { padding: 42px 20px 34px; }
  .slk-leadbox__badge { font-size: 14px; padding: 9px 20px; }
  .slk-plan { padding: 22px 20px; }
  .slk-plan--add { padding: 20px 20px; }
  .slk-plan--save { padding: 20px 20px; }
  .slk-alert { padding: 18px 18px; }
  .slk-alert p { text-align: left; }
  .slk-alert__title { font-size: 15px; margin-bottom: 17px; }
  .slk-important__box { padding: 22px 20px; }
}

/* 極小端末（横スクロール防止の最終保険） */
@media (max-width: 380px) {
  .slk-plan__price { font-size: 26px; }
  .slk-sim__price { font-size: 20px; }
}