/* =========================================================
   博多エキナカ司法書士事務所 サービスLP（hk-lp）
   色：紺 #1f3a68 ／ 金 #d9a521 ／ 淡青 #eef3f9 ／ LINE緑 #06c755
   ========================================================= */
.hk-lp{--navy:#1f3a68;--navy2:#2b5797;--gold:#d9a521;--pale:#eef3f9;--ink:#222;--line:#06c755;
  color:var(--ink);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.85;font-size:16px}
.hk-lp *{box-sizing:border-box}
.hk-lp img{max-width:100%;height:auto;display:block}
.hk-lp a{color:var(--navy2)}
.hk-lp .lp-inner{max-width:1040px;margin:0 auto;padding:0 20px}
.hk-lp section{padding:56px 0}
.hk-lp section:nth-of-type(even){background:var(--pale)}
.hk-lp .lp-h2{font-size:1.75em;font-weight:900;text-align:center;color:var(--navy);line-height:1.5;margin:0 0 8px}
.hk-lp .lp-h2 small{display:block;font-size:.5em;font-weight:700;color:var(--gold);letter-spacing:.15em;margin-bottom:4px}
.hk-lp .lp-lead{text-align:center;margin:0 auto 32px;max-width:720px;color:#444}
.hk-lp .marker{background:linear-gradient(transparent 60%,#ffef8a 60%)}

/* ヒーロー */
.hk-lp .lp-hero{background:linear-gradient(135deg,#1f3a68 0%,#2b5797 70%,#3a6fb8 100%);color:#fff;padding:44px 0 40px}
.hk-lp .lp-hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:center}
.hk-lp .lp-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.hk-lp .lp-badge{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);padding:2px 12px;border-radius:999px;font-size:.82em;font-weight:700}
.hk-lp .lp-badge.gold{background:var(--gold);border-color:var(--gold);color:#1f2937}
.hk-lp h1.lp-h1{font-size:2.2em;font-weight:900;line-height:1.35;margin:0 0 12px;color:#fff}
.hk-lp h1.lp-h1 em{font-style:normal;color:#f5c542}
.hk-lp .lp-sub{font-size:1.05em;opacity:.95;margin:0 0 18px}
.hk-lp .lp-pricebox{background:#fff;color:var(--navy);border-radius:12px;padding:14px 18px;display:inline-block;box-shadow:0 6px 0 var(--gold);margin-bottom:18px}
.hk-lp .lp-pricebox .lp-pl{font-size:.85em;font-weight:700;color:#555}
.hk-lp .lp-pricebox .lp-pv{font-size:2.4em;font-weight:900;line-height:1.1}
.hk-lp .lp-pricebox .lp-pv span{font-size:.4em;font-weight:700}
.hk-lp .lp-pricebox .lp-pn{font-size:.75em;color:#666}
.hk-lp .lp-photo{background:#fff;border-radius:14px;padding:10px 10px 6px;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:360px;margin-left:auto}
.hk-lp .lp-photo img{border-radius:8px;width:100%}
.hk-lp .lp-photo figcaption{text-align:center;color:var(--navy);font-weight:700;font-size:.9em;padding:6px 0 2px}
.hk-lp .lp-trust{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px;font-size:.88em}
.hk-lp .lp-trust b{color:#f5c542;font-size:1.25em}

/* ボタン */
.hk-lp .lp-btns{display:flex;flex-wrap:wrap;gap:10px}
.hk-lp .lp-btns.center{justify-content:center}
.hk-lp a.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:220px;padding:14px 22px;border-radius:999px;font-weight:900;text-decoration:none;box-shadow:0 4px 0 rgba(0,0,0,.2);transition:transform .1s}
.hk-lp a.lp-btn:active{transform:translateY(2px)}
.hk-lp a.lp-btn-line{background:var(--line);color:#fff}
.hk-lp a.lp-btn-tel{background:#fff;color:var(--navy);border:2px solid var(--navy)}
.hk-lp .lp-hero a.lp-btn-tel{border-color:#fff}
.hk-lp .lp-btn small{font-weight:700;font-size:.75em;opacity:.9}

/* お悩み */
.hk-lp .lp-worries{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:860px;margin:0 auto}
.hk-lp .lp-worries li{list-style:none;background:#fff;border:1px solid #d6dbe3;border-radius:10px;padding:14px 16px 14px 48px;position:relative;font-weight:700}
.hk-lp .lp-worries li:before{content:"✓";position:absolute;left:16px;top:13px;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;text-align:center;line-height:22px;font-size:.8em}
.hk-lp .lp-arrow{text-align:center;font-weight:900;color:var(--navy);font-size:1.2em;margin:24px 0 0}
.hk-lp .lp-arrow:before{content:"";display:block;width:0;height:0;margin:0 auto 10px;border-left:26px solid transparent;border-right:26px solid transparent;border-top:20px solid var(--gold)}

/* 2カラム（イラスト＋説明） */
.hk-lp .lp-split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.hk-lp .lp-split img{border-radius:12px}

/* 含まれるもの・特徴カード */
.hk-lp .lp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.hk-lp .lp-cards.c2{grid-template-columns:repeat(2,1fr)}
.hk-lp .lp-cards.c4{grid-template-columns:repeat(4,1fr)}
.hk-lp .lp-card{background:#fff;border-radius:12px;padding:20px 18px;box-shadow:0 2px 0 #d6dbe3;border:1px solid #e3e8ef}
.hk-lp .lp-card .lp-num{display:inline-block;background:var(--navy);color:#fff;font-weight:900;border-radius:6px;padding:0 10px;margin-bottom:8px;font-size:.85em}
.hk-lp .lp-card h3{font-size:1.1em!important;color:var(--navy);margin:0 0 6px!important;line-height:1.5;border:none!important;padding:0!important}
.hk-lp .lp-card p{margin:0;font-size:.93em;color:#444}
.hk-lp .lp-check{list-style:none;margin:0;padding:0;columns:2;column-gap:24px}
.hk-lp .lp-check li{break-inside:avoid;position:relative;padding:6px 0 6px 30px;border-bottom:1px dashed #cfd7e3}
.hk-lp .lp-check li:before{content:"✓";position:absolute;left:4px;top:6px;color:var(--gold);font-weight:900}

/* 料金 */
.hk-lp .lp-price-main{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;align-items:stretch}
.hk-lp .lp-price-card{background:var(--navy);color:#fff;border-radius:14px;padding:24px;text-align:center}
.hk-lp .lp-price-card .lp-pv{font-size:2.8em;font-weight:900;color:#f5c542;line-height:1.2}
.hk-lp .lp-price-card .lp-pv span{font-size:.4em;color:#fff}
.hk-lp .lp-price-card .lp-old{opacity:.8;font-size:.9em}
.hk-lp .lp-table-wrap{overflow-x:auto}
.hk-lp table.lp-table{width:100%;border-collapse:collapse;background:#fff;font-size:.93em}
.hk-lp table.lp-table th,.hk-lp table.lp-table td{border:1px solid #d6dbe3;padding:10px 12px;text-align:left;vertical-align:top}
.hk-lp table.lp-table thead th{background:var(--navy);color:#fff;text-align:center}
.hk-lp table.lp-table tbody th{background:#f4f7fb;width:46%}
.hk-lp table.lp-table td.num{text-align:right;white-space:nowrap;font-weight:700}
.hk-lp table.lp-table .yes{color:#2e7d5b;font-weight:900;text-align:center}
.hk-lp table.lp-table .no{color:#999;text-align:center}
.hk-lp table.lp-table .us{background:#fffaf0}
.hk-lp .lp-note{font-size:.82em;color:#666;margin-top:8px}
.hk-lp .lp-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}
.hk-lp .lp-example{background:#fff;border:2px solid var(--gold);border-radius:12px;padding:16px}
.hk-lp .lp-example b.t{display:block;color:var(--navy);margin-bottom:4px}
.hk-lp .lp-example .sum{font-size:1.4em;font-weight:900;color:var(--navy)}

/* 流れ */
.hk-lp .lp-flow{list-style:none;margin:0;padding:0;counter-reset:st;display:grid;gap:12px}
.hk-lp .lp-flow li{counter-increment:st;background:#fff;border-radius:12px;padding:16px 18px 16px 76px;position:relative;border:1px solid #e3e8ef}
.hk-lp .lp-flow li:before{content:"STEP" counter(st);position:absolute;left:14px;top:16px;background:var(--gold);color:#1f2937;font-weight:900;font-size:.72em;border-radius:6px;padding:2px 6px}
.hk-lp .lp-flow li b{color:var(--navy)}
.hk-lp .lp-flow li span{display:block;font-size:.9em;color:#555}
.hk-lp .lp-period{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.hk-lp .lp-period div{background:#fff;border:2px solid var(--navy);border-radius:999px;padding:6px 18px;font-weight:700;color:var(--navy)}

/* 数字・声 */
.hk-lp .lp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:22px}
.hk-lp .lp-stat{background:#fff;border-radius:12px;text-align:center;padding:16px;border:1px solid #e3e8ef}
.hk-lp .lp-stat b{display:block;font-size:2em;font-weight:900;color:var(--navy);line-height:1.3}
.hk-lp .lp-voices{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.hk-lp .lp-voice{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e3e8ef}
.hk-lp .lp-voice figcaption{padding:8px 12px;font-weight:700;font-size:.85em;color:var(--navy)}

/* 注意・お知らせ */
.hk-lp .lp-alert{background:#fff;border:3px solid #c0392b;border-radius:14px;padding:22px 24px}
.hk-lp .lp-alert h3{color:#c0392b!important;margin:0 0 8px!important;border:none!important;padding:0!important;font-size:1.25em!important}
.hk-lp .lp-alert .big{font-size:1.5em;font-weight:900;color:#c0392b}

/* FAQ */
.hk-lp .lp-faq details{background:#fff;border:1px solid #d6dbe3;border-radius:10px;margin:10px 0}
.hk-lp .lp-faq summary{cursor:pointer;list-style:none;padding:14px 44px 14px 54px;font-weight:700;position:relative}
.hk-lp .lp-faq summary::-webkit-details-marker{display:none}
.hk-lp .lp-faq summary:before{content:"Q";position:absolute;left:14px;top:12px;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;text-align:center;line-height:28px;font-family:Arial}
.hk-lp .lp-faq summary:after{content:"＋";position:absolute;right:16px;top:13px;color:var(--navy)}
.hk-lp .lp-faq details[open] summary:after{content:"－"}
.hk-lp .lp-faq .a{padding:0 18px 16px 54px;position:relative}
.hk-lp .lp-faq .a:before{content:"A";position:absolute;left:14px;top:0;width:28px;height:28px;border-radius:50%;background:var(--gold);color:#fff;text-align:center;line-height:28px;font-family:Arial;font-weight:700}

/* 代表・事務所 */
.hk-lp .lp-office{display:grid;grid-template-columns:240px 1fr;gap:24px;align-items:start}
.hk-lp .lp-office figure{margin:0}
.hk-lp .lp-office figure img{border-radius:12px}
.hk-lp .lp-office figcaption{text-align:center;font-weight:700;color:var(--navy);margin-top:6px}

/* 最終CTA */
.hk-lp .lp-final{background:linear-gradient(135deg,#1f3a68,#2b5797)!important;color:#fff;text-align:center}
.hk-lp .lp-final .lp-h2{color:#fff}
.hk-lp .lp-final p{opacity:.95}

/* 変更案プレビュー用の印 */
.hk-lp .lp-flag{display:inline-block;background:#fff3cd;color:#8a6510;border:1px dashed #d9a521;font-size:.75em;font-weight:700;padding:0 8px;border-radius:4px}

@media(max-width:900px){
  .hk-lp .lp-hero-grid,.hk-lp .lp-split,.hk-lp .lp-price-main,.hk-lp .lp-office{grid-template-columns:1fr}
  .hk-lp .lp-photo{margin:0 auto;max-width:280px}
  .hk-lp .lp-cards,.hk-lp .lp-cards.c4,.hk-lp .lp-examples,.hk-lp .lp-voices,.hk-lp .lp-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .hk-lp{font-size:15px}
  .hk-lp section{padding:40px 0}
  .hk-lp h1.lp-h1{font-size:1.65em}
  .hk-lp .lp-h2{font-size:1.4em}
  .hk-lp .lp-worries,.hk-lp .lp-cards,.hk-lp .lp-cards.c2,.hk-lp .lp-cards.c4,.hk-lp .lp-examples,.hk-lp .lp-voices,.hk-lp .lp-stats{grid-template-columns:1fr}
  .hk-lp .lp-check{columns:1}
  .hk-lp a.lp-btn{width:100%}
}

/* 総額の式 */
.hk-lp .lp-formula{display:flex;align-items:stretch;justify-content:center;gap:10px;flex-wrap:wrap;margin:6px 0 8px}
.hk-lp .lp-fx{background:#fff;border:2px solid var(--navy);border-radius:12px;padding:12px 16px;text-align:center;min-width:180px;display:flex;flex-direction:column}
.hk-lp .lp-fx.total{background:var(--navy);color:#fff}
.hk-lp .lp-fx-l{font-size:.85em;font-weight:700}
.hk-lp .lp-fx-v{font-size:1.6em;font-weight:900;line-height:1.3;color:var(--navy)}
.hk-lp .lp-fx.total .lp-fx-v{color:#f5c542}
.hk-lp .lp-fx-n{font-size:.75em;opacity:.8}
.hk-lp .lp-fx-op{align-self:center;font-size:1.8em;font-weight:900;color:var(--gold)}

/* シミュレーター */
.hk-lp .lp-sim{background:#fff;border:3px solid var(--gold);border-radius:14px;padding:20px 22px;margin-top:22px}
.hk-lp .lp-sim-ttl{margin:0 0 12px!important;font-size:1.2em!important;color:var(--navy);border:none!important;padding:0!important;text-align:center}
.hk-lp .lp-sim-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.hk-lp .lp-sim-grid label{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.92em;font-weight:700;border-bottom:1px dashed #d6dbe3;padding:6px 0}
.hk-lp .lp-sim-grid input,.hk-lp .lp-sim-grid select{font:inherit;font-weight:700;padding:6px 8px;border:2px solid #cfd7e3;border-radius:8px;width:110px;text-align:right}
.hk-lp .lp-sim-grid select{width:auto;text-align:left}
.hk-lp .lp-sim-grid label span{white-space:nowrap;display:flex;align-items:center;gap:4px}
.hk-lp .lp-sim-out{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:10px;margin-top:16px}
.hk-lp .lp-sim-out div{background:var(--pale);border-radius:10px;padding:10px;text-align:center;font-size:.85em;font-weight:700}
.hk-lp .lp-sim-out b{display:block;font-size:1.5em;color:var(--navy)}
.hk-lp .lp-sim-out .sum{background:var(--navy);color:#fff}
.hk-lp .lp-sim-out .sum b{color:#f5c542;font-size:1.9em}
@media(max-width:600px){.hk-lp .lp-sim-grid,.hk-lp .lp-sim-out{grid-template-columns:1fr}.hk-lp .lp-fx-op{width:100%;text-align:center}}
.hk-lp .lp-total{font-size:1.55em;font-weight:900;color:var(--navy);margin:4px 0!important;line-height:1.3}
.hk-lp .lp-break{background:var(--pale);border-radius:8px;padding:8px 10px;font-size:.85em!important;margin:6px 0 8px!important}
.hk-lp a.lp-card-link{display:block;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s}
.hk-lp a.lp-card-link:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(31,58,104,.15)}
.hk-lp .lp-more{display:inline-block;margin-top:8px;color:var(--navy2);font-weight:700;font-size:.9em}
.hk-lp .lp-section-ttl{font-size:1.3em;font-weight:900;color:var(--navy);border-left:6px solid var(--gold);padding-left:12px;margin:34px 0 12px}

/* お悩みから選ぶ8つの入口（v2から移植・2026-10-08） */
.hk-lp .lp-need{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hk-lp .lp-need a{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid #e3e8ef;border-radius:12px;padding:16px;box-shadow:0 2px 0 #d6dbe3;text-decoration:none!important;color:var(--ink)!important;min-height:140px;transition:all .15s}
.hk-lp .lp-need a:hover{border-color:var(--navy2);box-shadow:0 8px 20px rgba(31,58,104,.14);transform:translateY(-2px)}
.hk-lp .lp-need .q{font-weight:700;line-height:1.55;flex:1}
.hk-lp .lp-need .pr{font-size:.85em;color:#8a6510;font-weight:700}
.hk-lp .lp-need .ans{align-self:flex-start;background:var(--navy);color:#fff;font-size:.82em;font-weight:700;border-radius:6px;padding:2px 10px}
.hk-lp .lp-need .ans::after{content:" →"}
@media(max-width:900px){.hk-lp .lp-need{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.hk-lp .lp-need{grid-template-columns:1fr;gap:8px}.hk-lp .lp-need a{min-height:0;padding:12px 14px;gap:4px}}
/* 現行ページの見出し(h1)を残して冒頭に案内を足すページ用（お問い合わせ・お客様の声） */
.hk-lp h2.lp-h1{font-size:2.2em;font-weight:900;line-height:1.35;margin:0 0 12px;color:#fff;border:none;padding:0;background:none}
.hk-lp h2.lp-h1 em{font-style:normal;color:#f5c542}
@media(max-width:600px){.hk-lp h2.lp-h1{font-size:1.65em}}

/* 2026-10-12 LP（template=lp）は1カラム：左の固定メニュー枠（260px）をやめ、ロゴは上部の細い帯に */
.is-lp #header--pc{position:static !important;width:auto !important;height:auto !important;min-height:0 !important;display:flex;align-items:center;padding:10px 24px;background:#fff;border-bottom:1px solid #e3e8ef}
.is-lp #header-logo{margin:0;padding:0}
.is-lp #header-logo img{height:40px;width:auto;display:block}
.is-lp #main{padding-left:0 !important;padding-top:0 !important}

/* 2026-10-12 スマホ下部の固定LINEボタン（旧LPの lp.css から該当部分だけ移植） */
#fixed-line-area{background:#fff;width:100%;text-align:center;position:fixed;bottom:0;left:0;z-index:300}
#fixed-line-area a{box-shadow:0 4px 0 #018803;background:#02ba04;color:#fff;text-align:center;text-decoration:none;margin:8px;height:65px;padding-top:2px;display:block;border-radius:100px;transition:all .3s ease;position:relative;top:-2px}
#fixed-line-area a #fixed-line-num{font-size:1.2rem;line-height:20px;margin:0;color:#fff}
#fixed-line-area a #fixed-line-num b{font-size:1.5rem}
#fixed-line-area a #fixed-line-ctt{height:40px}
#fixed-line-area a #fixed-line-ctt #fixed-line--icn,#fixed-line-area a #fixed-line-ctt #fixed-line--txt{line-height:40px;display:inline-block;vertical-align:middle;margin:0}
#fixed-line-area a #fixed-line-ctt #fixed-line--icn{line-height:0;max-width:40px;margin:0 8px 0 0}
#fixed-line-area a #fixed-line-ctt #fixed-line--icn img{width:100%;height:auto}
#fixed-line-area a #fixed-line-ctt #fixed-line--txt{font-size:1.8181818182rem;position:relative;top:-3px;color:#fff;font-weight:700}
@media screen and (max-width:559px){
  #fixed-line-area a #fixed-line-ctt #fixed-line--icn{max-width:36.6666666667px}
  #fixed-line-area a #fixed-line-ctt #fixed-line--txt{font-size:1.7391304348rem}
}
@media screen and (max-width:959px){.is-lp #footer{padding-bottom:90px}}
@media print{#fixed-line-area{position:absolute !important}}
