/* ============================================================
   蔵番（KURABAN）LP — zen-marketing.co.jp
   配色：白 #FFFFFF／墨 #1E1E1E／朱 #CA201A（朱は要点のみ）
   書体：Zen Kaku Gothic New（本文）／Shippori Mincho B1（見出し）
   ルール：角丸 0〜2px・影なし・左帯なし・グラデなし
   接頭辞 .kb- で閉じる（テーマ側の CSS と干渉しない）
   ============================================================ */

.kb-lp{
  --kb-white:#FFFFFF;
  --kb-sumi:#1E1E1E;
  --kb-aka:#CA201A;
  --kb-line:#D9D9D9;
  --kb-line-soft:#EBEBEB;
  --kb-line-dark:#4A4A4A;
  --kb-gray:#6B6B6B;
  --kb-gray-light:#BDBDBD;
  --kb-text-soft:#4A4A4A;
  --kb-text-ondark:#E0E0E0;
  --kb-bg-soft:#F6F6F6;
  --kb-sans:'Zen Kaku Gothic New','Hiragino Kaku Gothic ProN','Yu Gothic','Noto Sans JP',sans-serif;
  --kb-serif:'Shippori Mincho B1','Hiragino Mincho ProN','Yu Mincho','Noto Serif JP',serif;

  margin:0;
  background:var(--kb-white);
  color:var(--kb-sumi);
  font-family:var(--kb-sans);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.kb-lp *,.kb-lp *::before,.kb-lp *::after{box-sizing:border-box}
.kb-lp h1,.kb-lp h2,.kb-lp h3,.kb-lp h4,.kb-lp p,.kb-lp ul{margin:0}
.kb-lp ul{padding:0;list-style:none}
.kb-lp a{color:inherit;text-decoration:none;transition:color .2s,background-color .2s,border-color .2s}
.kb-lp a:hover{color:var(--kb-aka)}
.kb-lp img{max-width:100%;height:auto;display:block}
.kb-lp svg{display:block}
.kb-lp strong{font-weight:700}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---- 共通部品 ---- */
.kb-wrap{max-width:1120px;margin:0 auto;padding:0 32px}
.kb-serif{font-family:var(--kb-serif)}
.kb-eyebrow{font-size:12px;letter-spacing:.28em;color:var(--kb-gray);font-weight:500}
.kb-dark .kb-eyebrow{color:var(--kb-gray-light)}
.kb-num{font-family:var(--kb-serif);font-size:13px;letter-spacing:.2em;color:var(--kb-gray)}
.kb-dark .kb-num{color:var(--kb-gray-light)}
.kb-aka{color:var(--kb-aka)}
.kb-rule{display:block;height:1px;width:48px;background:var(--kb-sumi)}

.kb-sec{padding:96px 0}
.kb-sec--soft{background:var(--kb-bg-soft)}
.kb-dark{background:var(--kb-sumi);color:var(--kb-white)}
.kb-sec-head{display:flex;flex-direction:column;gap:16px}
.kb-h2{font-family:var(--kb-serif);font-size:40px;font-weight:700;line-height:1.4;letter-spacing:.04em}
.kb-lead{font-size:16px;line-height:2;max-width:720px}
.kb-dark .kb-lead{color:var(--kb-text-ondark)}
.kb-h3{font-family:var(--kb-serif);font-weight:700}
.kb-note{font-size:12px;color:var(--kb-gray)}
.kb-note--md{font-size:13px;color:var(--kb-gray)}

.kb-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 32px;font-weight:700;font-size:15px;letter-spacing:.08em;border:1px solid var(--kb-sumi);border-radius:2px;cursor:pointer;white-space:nowrap}
.kb-lp .kb-btn--primary{background:var(--kb-sumi);color:var(--kb-white)}
.kb-lp .kb-btn--primary:hover{background:var(--kb-aka);border-color:var(--kb-aka);color:var(--kb-white)}
.kb-lp .kb-btn--ghost{background:var(--kb-white);color:var(--kb-sumi)}
.kb-lp .kb-btn--ghost:hover{color:var(--kb-aka);border-color:var(--kb-aka)}
.kb-lp .kb-btn--white{background:var(--kb-white);color:var(--kb-sumi);border-color:var(--kb-white);min-height:56px;padding:0 40px;font-size:16px}
.kb-lp .kb-btn--white:hover{background:var(--kb-aka);border-color:var(--kb-aka);color:var(--kb-white)}
.kb-lp .kb-btn--outline-white{background:transparent;color:var(--kb-white);border-color:var(--kb-white);min-height:56px;padding:0 40px;font-size:16px}
.kb-lp .kb-btn--outline-white:hover{background:var(--kb-white);color:var(--kb-sumi)}
.kb-btn--sm{min-height:44px;padding:0 22px;font-size:14px}

.kb-grid{display:grid;gap:1px;background:var(--kb-line);border:1px solid var(--kb-line)}
.kb-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kb-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kb-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kb-dark .kb-grid{background:var(--kb-line-dark);border-color:var(--kb-line-dark)}
.kb-cell{background:var(--kb-white);padding:36px 32px;display:flex;flex-direction:column;gap:14px}
.kb-dark .kb-cell{background:var(--kb-sumi);color:var(--kb-white)}
.kb-cell p{font-size:14px;line-height:1.9}
.kb-dark .kb-cell p{color:var(--kb-text-ondark);font-size:15px}
.kb-cell--lg{padding:44px 36px;gap:18px}
.kb-cell ul{display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.9;color:var(--kb-gray);padding-left:1.2em;list-style:disc}

.kb-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:start}
.kb-split--center{align-items:center}
.kb-prose{display:flex;flex-direction:column;gap:18px;font-size:16px;line-height:2.05}
.kb-dark .kb-prose{color:var(--kb-text-ondark)}
.kb-dark .kb-prose strong{color:var(--kb-white)}

/* ---- ヘッダー ---- */
.kb-header{border-bottom:1px solid var(--kb-line);background:var(--kb-white);position:sticky;top:0;z-index:50}
.kb-header .kb-wrap{display:flex;align-items:center;justify-content:space-between;min-height:72px;gap:24px}
.kb-brand{display:flex;align-items:center;gap:16px;flex:none}
.kb-brand:hover{color:var(--kb-sumi)}
.kb-lp .kb-brand__zen{height:24px;width:auto}
.kb-brand__sep{width:1px;height:24px;background:var(--kb-line)}
.kb-brand__kb{display:flex;align-items:center;gap:8px}
.kb-brand__mark{width:26px;height:26px}
.kb-brand__name{font-family:var(--kb-serif);font-size:18px;font-weight:700;letter-spacing:.12em;white-space:nowrap}
.kb-nav{display:flex;align-items:center;gap:32px}
.kb-nav a{font-size:14px;font-weight:500;letter-spacing:.06em;white-space:nowrap}

/* ---- ヒーロー ---- */
.kb-hero{padding:96px 0 88px}
.kb-hero__row{display:flex;align-items:center;justify-content:space-between;gap:64px}
.kb-hero__copy{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:28px}
.kb-hero__h1{font-family:var(--kb-serif);font-size:56px;font-weight:800;line-height:1.35;letter-spacing:.04em}
.kb-hero__h1 small{display:block;font-size:32px;font-weight:700;letter-spacing:.1em;margin-top:.1em}
.kb-hero__lead{font-size:17px;line-height:2;max-width:560px}
.kb-hero__actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.kb-hero__tags{display:flex;flex-wrap:wrap;gap:24px;padding-top:8px;font-size:13px;color:var(--kb-gray);letter-spacing:.06em}
.kb-hero__mark{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:20px}
.kb-hero__mark svg{width:300px;height:300px}
.kb-hero__en{font-family:var(--kb-serif);font-size:14px;letter-spacing:.4em;color:var(--kb-gray)}

/* ---- 時代背景 ---- */
.kb-bg .kb-wrap{display:flex;flex-direction:column;gap:56px}

/* ---- 由来 ---- */
.kb-origin__sub{font-size:14px;color:var(--kb-gray);line-height:1.9}
.kb-tags{display:flex;flex-wrap:wrap;gap:12px;padding-top:8px}
.kb-tag{border:1px solid var(--kb-sumi);padding:8px 14px;font-size:13px;letter-spacing:.06em}

/* ---- 不安喚起 ---- */
.kb-why .kb-wrap{display:flex;flex-direction:column;gap:48px}
.kb-why__h3{font-size:24px}
.kb-why__foot{display:flex;flex-wrap:wrap;gap:16px;align-items:baseline;border-top:1px solid var(--kb-line-dark);padding-top:32px}
.kb-why__foot .kb-serif{font-size:22px;font-weight:700;letter-spacing:.06em}
.kb-why__foot p:last-child{font-size:14px;color:var(--kb-gray-light)}

/* ---- 4つの働き ---- */
.kb-about .kb-wrap{display:flex;flex-direction:column;gap:48px}
.kb-about .kb-cell{gap:16px}
.kb-about .kb-h3{font-size:26px;letter-spacing:.08em}
.kb-ico{width:40px;height:40px;fill:none;stroke:var(--kb-sumi);stroke-width:2}

/* ---- 三重の守り ---- */
.kb-mamori .kb-wrap{display:flex;flex-direction:column;gap:48px}
.kb-mamori__n{display:flex;align-items:center;gap:14px}
.kb-mamori__n span:first-child{font-family:var(--kb-serif);font-size:44px;font-weight:800;line-height:1}
.kb-mamori .kb-h3{font-size:24px}

/* ---- 見える画面 ---- */
.kb-screen__list{display:flex;flex-direction:column;gap:10px;font-size:15px}
.kb-screen__list li{display:flex;gap:12px;align-items:baseline}
.kb-screen__list li::before{content:"";width:8px;height:8px;background:var(--kb-sumi);flex:none;transform:translateY(-1px)}
.kb-mock{border:1px solid var(--kb-line);background:var(--kb-white);padding:24px;display:flex;flex-direction:column;gap:20px}
.kb-mock__head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--kb-line);padding-bottom:14px}
.kb-mock__title{display:flex;align-items:center;gap:8px;font-family:var(--kb-serif);font-size:15px;font-weight:700;letter-spacing:.1em}
.kb-mock__title svg{width:20px;height:20px}
.kb-mock__ok{font-size:12px;color:var(--kb-gray)}
.kb-mock__fuda{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kb-mock__fuda span{border:1px solid var(--kb-sumi);padding:12px 10px;text-align:center;font-size:13px;font-weight:700}
.kb-mock__label{font-size:12px;color:var(--kb-gray);letter-spacing:.1em}
.kb-mock__band{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;height:36px;align-items:end}
.kb-mock__band span{background:var(--kb-line);display:block}
.kb-mock__band span.is-aka{background:var(--kb-aka)}
.kb-mock__cap{font-size:11px;color:var(--kb-gray)}
.kb-mock__log{display:flex;flex-direction:column;gap:6px;font-size:12px}
.kb-mock__row{display:grid;grid-template-columns:56px minmax(0,1fr) 110px;gap:8px;border-top:1px solid var(--kb-line-soft);padding-top:8px}
.kb-mock__row span:last-child{text-align:right}
.kb-mock__row .is-aka{color:var(--kb-aka);font-weight:700}

/* ---- 導入の流れ ---- */
.kb-flow .kb-wrap{display:flex;flex-direction:column;gap:48px}
.kb-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.kb-step{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--kb-sumi);padding-top:24px}
.kb-step .kb-h3{font-size:22px}
.kb-step p{font-size:14px;line-height:1.9}

/* ---- 他との違い ---- */
.kb-diff .kb-wrap{display:flex;flex-direction:column;gap:40px}
.kb-tblwrap{width:100%}
.kb-tbl{width:100%;border-collapse:collapse;font-size:15px}
.kb-tbl th,.kb-tbl td{border:1px solid var(--kb-line);padding:14px 16px;text-align:center;vertical-align:middle}
.kb-tbl th{background:var(--kb-bg-soft);font-weight:700}
.kb-tbl td:first-child,.kb-tbl th:first-child{text-align:left;width:34%}
.kb-tbl .is-me{background:var(--kb-sumi);color:var(--kb-white);font-weight:700}

/* ---- 正直に ---- */
.kb-honest__list{border-top:1px solid var(--kb-line-dark)}
.kb-honest__row{padding:20px 0;border-bottom:1px solid var(--kb-line-dark);display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;font-size:14px;line-height:1.8}
.kb-honest__row span:first-child{color:var(--kb-gray-light)}

/* ---- 料金 ---- */
.kb-plan .kb-wrap{display:flex;flex-direction:column;gap:48px}
.kb-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--kb-line);border:1px solid var(--kb-line)}
.kb-planbox{background:var(--kb-white);padding:44px 36px;display:flex;flex-direction:column;gap:20px}
.kb-planbox--dark{background:var(--kb-sumi);color:var(--kb-white)}
.kb-planbox--dark .kb-eyebrow,.kb-planbox--dark .kb-planbox__sub,.kb-planbox--dark .kb-price small{color:var(--kb-gray-light)}
.kb-planbox .kb-h3{font-size:28px}
.kb-planbox__sub{font-size:14px;color:var(--kb-gray);line-height:1.8}
.kb-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.kb-price b{font-family:var(--kb-serif);font-size:40px;font-weight:800;letter-spacing:.02em;line-height:1.1}
.kb-price small{font-size:14px;color:var(--kb-gray)}
.kb-price--ask b{font-size:26px}
.kb-planbox ul{display:flex;flex-direction:column;gap:10px;font-size:14px;border-top:1px solid var(--kb-line);padding-top:20px}
.kb-planbox--dark ul{border-top-color:var(--kb-line-dark)}
.kb-planbox .kb-btn{margin-top:auto}
.kb-plan__notes{display:flex;flex-wrap:wrap;gap:32px;font-size:13px;color:var(--kb-gray);line-height:1.8}

/* ---- FAQ ---- */
.kb-faq .kb-wrap{display:flex;flex-direction:column;gap:40px}
.kb-faq__list{border-top:1px solid var(--kb-line)}
.kb-faq__item{border-bottom:1px solid var(--kb-line)}
.kb-faq__q{width:100%;background:none;border:0;padding:28px 0;display:grid;grid-template-columns:72px minmax(0,1fr) 32px;gap:16px;align-items:start;text-align:left;cursor:pointer;font:inherit;color:inherit}
.kb-faq__q:hover{color:var(--kb-aka)}
.kb-faq__mark{font-family:var(--kb-serif);font-size:22px;font-weight:700;line-height:1}
.kb-faq__title{font-size:17px;font-weight:700;line-height:1.7}
.kb-faq__plus{width:32px;height:32px;position:relative;justify-self:end}
.kb-faq__plus::before,.kb-faq__plus::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:1px;background:currentColor;transform:translate(-50%,-50%)}
.kb-faq__plus::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .2s}
.kb-faq__q[aria-expanded="true"] .kb-faq__plus::after{transform:translate(-50%,-50%) rotate(0)}
.kb-faq__a{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;padding:0 0 28px}
.kb-faq__a[hidden]{display:none}
.kb-faq__a p{grid-column:2;font-size:15px;line-height:1.9;color:var(--kb-text-soft)}

/* ---- CTA ---- */
.kb-cta{padding:104px 0}
.kb-cta .kb-wrap{display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px}
.kb-cta__mark{width:72px;height:72px}
.kb-cta__h2{font-family:var(--kb-serif);font-size:44px;font-weight:700;line-height:1.4;letter-spacing:.04em}
.kb-cta__lead{font-size:16px;line-height:2;color:var(--kb-text-ondark);max-width:600px}
.kb-cta__actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.kb-cta__hours{font-size:13px;color:var(--kb-gray-light)}

/* ---- フッター ---- */
.kb-footer{padding:40px 0;border-top:1px solid var(--kb-line)}
.kb-footer__row{display:flex;align-items:center;justify-content:space-between;gap:24px}
.kb-footer__brand{display:flex;align-items:center;gap:16px}
.kb-lp .kb-footer__brand img{height:20px;width:auto}
.kb-footer__brand span{font-size:13px;color:var(--kb-gray)}
.kb-footer__links{display:flex;gap:24px;font-size:13px}
.kb-footer__copy{padding-top:24px;font-size:12px;color:var(--kb-gray)}
.kb-footer__sa{display:flex;align-items:center;gap:12px;margin-top:24px;padding:10px 14px 10px 10px;background:#fff;border:1px solid var(--kb-line);max-width:640px}
.kb-lp .kb-footer__sa img{width:56px;height:56px;flex:0 0 auto}
.kb-footer__sa p{margin:0;font-size:12px;line-height:1.7;color:var(--kb-gray)}

/* ---- スクロールでふわっと ---- */
.kb-reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
.kb-reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.kb-reveal{opacity:1;transform:none;transition:none}}
.no-js .kb-reveal{opacity:1;transform:none}

/* ---- レスポンシブ ---- */
@media (max-width:1024px){
  .kb-hero__h1{font-size:48px}
  .kb-hero__mark svg{width:240px;height:240px}
  .kb-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .kb-wrap{padding:0 20px}
  .kb-sec{padding:72px 0}
  .kb-h2{font-size:28px;letter-spacing:.02em}
  .kb-price--ask b{font-size:22px}
  .kb-price b{font-size:34px}
  .kb-nav{display:none}
  .kb-nav--mobile{display:flex}
  .kb-hero{padding:64px 0 56px}
  .kb-hero__row{flex-direction:column-reverse;align-items:flex-start;gap:36px}
  .kb-hero__h1{font-size:32px;letter-spacing:.02em}
  .kb-hero__h1 small{font-size:22px}
  .kb-lp .kb-brand__zen{height:20px}
  .kb-brand{gap:12px}
  .kb-hero__mark{align-self:center}
  .kb-hero__mark svg{width:160px;height:160px}
  .kb-hero__actions .kb-btn{flex:1 1 100%}
  .kb-grid--2,.kb-grid--3,.kb-grid--4{grid-template-columns:repeat(1,minmax(0,1fr))}
  .kb-split{grid-template-columns:repeat(1,minmax(0,1fr));gap:36px}
  .kb-steps{grid-template-columns:repeat(1,minmax(0,1fr))}
  .kb-plans{grid-template-columns:repeat(1,minmax(0,1fr))}
  .kb-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .kb-tbl{min-width:720px}
  .kb-honest__row{grid-template-columns:repeat(1,minmax(0,1fr));gap:4px}
  .kb-faq__q{grid-template-columns:44px minmax(0,1fr) 28px;padding:22px 0}
  .kb-faq__a{grid-template-columns:44px minmax(0,1fr);padding-bottom:22px}
  .kb-cta{padding:72px 0}
  .kb-cta__h2{font-size:28px;letter-spacing:.02em}
  .kb-cta__actions{width:100%}
  .kb-cta__actions .kb-btn{flex:1 1 100%}
  .kb-footer__row{flex-direction:column;align-items:flex-start}
  .kb-mock__fuda{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kb-mock__row{grid-template-columns:48px minmax(0,1fr) 96px}
}
.kb-nav--mobile{display:none}
@media (max-width:860px){.kb-nav--mobile{display:flex}}

/* 読み上げ専用（WP 標準クラスが無い環境向け） */
.kb-lp .screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
