@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@600;700;800&family=Cormorant+Garamond:ital,wght@1,500;1,600&display=swap");
/* ===== 鈑金塗装・コーティング店向けLP（/bankin/）  接頭辞 .bk- ===== */
:root{
  --bk-black:#0c0c0e; --bk-black2:#151518; --bk-black3:#1d1d21; --bk-gold:#c8a45d; --bk-gold2:#e6cf98; --bk-gold3:#9c7c3c;
  --bk-text:#e9e5dc; --bk-mute:#a29d92; --bk-line:rgba(200,164,93,.35);
  --bk-serif:"Shippori Mincho B1","Noto Serif JP","Hiragino Mincho ProN",serif;
  --bk-latin:"Cormorant Garamond","Times New Roman",serif;
}
.bk{color:var(--bk-text);background:var(--bk-black)}
.bk-sec{padding:clamp(64px,9vw,120px) 16px!important;position:relative}
.bk .wp-block-image img{border-radius:0!important}
.bk h1,.bk h2,.bk h3{font-family:var(--bk-serif)!important;font-weight:700!important}
.bk-label{display:flex!important;align-items:center;justify-content:center;gap:16px;font-family:var(--bk-latin);font-style:italic;font-weight:500;font-size:22px;letter-spacing:.06em;color:var(--bk-gold);margin:0 auto .3em!important}
.bk-label::before,.bk-label::after{content:"";width:48px;height:1px;background:linear-gradient(90deg,transparent,var(--bk-gold))}
.bk-label::after{transform:scaleX(-1)}
.bk h2.bk-h2{font-size:clamp(24px,3.4vw,38px);text-align:center;line-height:1.55;letter-spacing:.06em;margin:0 auto .8em!important;color:#fff}
.bk h2.bk-h2 strong{color:var(--bk-gold2);font-weight:800}
.bk-lead{text-align:center;max-width:760px;margin:0 auto 2.6em!important;font-size:clamp(15px,1.6vw,16.5px);color:var(--bk-mute);line-height:2}
.bk-note{font-size:13px;color:var(--bk-mute);text-align:center;max-width:900px;margin:2em auto 0!important;line-height:1.9}
.bk-note a,.bk-honest a{color:var(--bk-gold2)}
.bk-cap{font-size:12.5px;color:var(--bk-mute);text-align:center;margin:.7em 0 0!important;letter-spacing:.04em}
.bk-ctas{justify-content:center;gap:14px!important;margin-top:2.4em!important}
.bk .is-style-cx-cta .wp-block-button__link{background:linear-gradient(180deg,#e7cf94 0%,#c8a45d 55%,#a8853f 100%);color:#16130c!important;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 12px 28px rgba(200,164,93,.25);letter-spacing:.06em}
.bk .is-style-cx-cta .wp-block-button__link:hover{box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 6px 14px rgba(200,164,93,.25);color:#16130c!important}
.bk .is-style-cx-ghost .wp-block-button__link{border:1px solid var(--bk-gold)!important;color:var(--bk-gold2)!important;border-radius:2px;letter-spacing:.06em}
.bk .is-style-cx-ghost .wp-block-button__link:hover{background:var(--bk-gold)!important;color:#16130c!important}
.bk ul.bk-checks li{font-weight:500;color:var(--bk-text)}
.bk ul.bk-checks li::before{background:var(--bk-gold)}
.bk details.is-style-cx-faq{background:var(--bk-black2);border:1px solid var(--bk-line);border-radius:0}
.bk details.is-style-cx-faq summary{color:#fff;font-family:var(--bk-serif);font-weight:700}
.bk details.is-style-cx-faq summary::before{color:var(--bk-gold);font-family:var(--bk-latin);font-style:italic;font-weight:600}
.bk details.is-style-cx-faq summary::after{color:var(--bk-gold)}
.bk details.is-style-cx-faq p{color:#cfcac0}
.bk details.is-style-cx-faq a{color:var(--bk-gold2)}

/* ===== FV ===== */
.bk-fv{position:relative;overflow:hidden;padding:clamp(48px,7vw,96px) 16px clamp(56px,8vw,110px)!important;
  background:radial-gradient(700px 500px at 78% 45%,rgba(200,164,93,.16),transparent 65%),radial-gradient(500px 360px at 0% 100%,rgba(200,164,93,.08),transparent 70%),linear-gradient(170deg,#121214 0%,#0b0b0d 60%,#050506 100%)}
.bk-fv::before{content:"";position:absolute;inset:22px;border:1px solid rgba(200,164,93,.22);pointer-events:none}
.bk-fv > .wp-block-columns{max-width:1200px!important;align-items:center!important;gap:clamp(24px,4vw,64px)!important;position:relative}
.bk-kicker{display:inline-block;font-size:clamp(12.5px,1.3vw,14px);letter-spacing:.14em;color:var(--bk-gold);border-top:1px solid var(--bk-gold);border-bottom:1px solid var(--bk-gold);padding:.45em .2em;margin:0 0 1.6em!important}
.bk-fv h1.bk-h1{font-size:clamp(28px,3.9vw,48px);line-height:1.5;letter-spacing:.05em;color:#fff;margin:0 0 .7em!important}
.bk-fv h1.bk-h1 strong{color:transparent;background:linear-gradient(180deg,#f2e2b5 0%,#c8a45d 60%,#a07f3d 100%);-webkit-background-clip:text;background-clip:text;font-weight:800}
.bk-fv-sub{font-size:clamp(14.5px,1.5vw,16px);color:#bdb7ab;line-height:2;max-width:520px;margin:0 0 1.6em!important}
.bk-fv-price{display:flex;align-items:baseline;gap:.4em;margin:0!important;color:var(--bk-text);font-family:var(--bk-serif)}
.bk-fv-price span{font-size:16px;letter-spacing:.1em}
.bk-fv-price strong{font-family:var(--bk-latin);font-style:italic;font-weight:600;font-size:clamp(64px,7vw,92px);line-height:1;color:var(--bk-gold2);letter-spacing:.01em}
.bk-fv-spec{font-size:13px;letter-spacing:.08em;color:var(--bk-mute);margin:.5em 0 0!important;border-top:1px solid var(--bk-line);padding-top:.8em!important;max-width:460px}
.bk-fv .bk-ctas{justify-content:flex-start}
.bk-frame{position:relative;padding:0 0 12% 0!important;margin:0!important}
.bk-frame .bk-pc{margin:0 9% 0 0!important;position:relative}
.bk-frame .bk-pc img{display:block;width:100%;border:1px solid var(--bk-gold)!important;padding:8px;background:#000;box-shadow:0 30px 70px rgba(0,0,0,.7)}
.bk-frame .bk-pc::before{content:"";position:absolute;left:-14px;top:-14px;right:14px;bottom:14px;border:1px solid rgba(200,164,93,.3);pointer-events:none}
.bk-frame .bk-sp{position:absolute;right:0;bottom:0;width:26%;margin:0!important}
.bk-frame .bk-sp img{display:block;border:5px solid #000!important;outline:1px solid var(--bk-gold);border-radius:16px!important;aspect-ratio:9/18.5;object-fit:cover;object-position:top;box-shadow:0 20px 40px rgba(0,0,0,.7)}
.bk-devcap{position:absolute;left:0;bottom:0;margin:0!important;font-family:var(--bk-latin);font-style:italic;font-size:14px;color:var(--bk-mute)}

/* ===== ギャラリー ===== */
.bk-gallery{background:var(--bk-black2)}
.bk-gal-cols{max-width:1140px!important;gap:clamp(28px,5vw,72px)!important;align-items:center!important}
.bk-mat{background:#f4efe4;padding:18px 18px 14px!important;box-shadow:0 0 0 1px var(--bk-gold),0 0 0 10px #1b1a17,0 0 0 11px var(--bk-gold3),0 30px 60px rgba(0,0,0,.6);max-width:620px;margin:12px auto!important}
.bk-mat .wp-block-image{margin:0!important}
.bk-mat img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.bk-mat .bk-cap{color:#6d665a;font-family:var(--bk-serif)}
.bk-gals > *{margin:0!important}
.bk-gal{display:grid!important;grid-template-columns:56px 1fr;column-gap:18px;padding:22px 0!important;border-bottom:1px solid var(--bk-line)}
.bk-gal:first-child{border-top:1px solid var(--bk-line)}
.bk-gal > *{margin:0!important}
.bk-gal .bk-gal-n{grid-row:1/3;font-family:var(--bk-latin);font-style:italic;font-weight:600;font-size:34px;line-height:1;color:var(--bk-gold)}
.bk-gal h3{font-size:19px!important;color:#fff!important;letter-spacing:.04em;margin-bottom:.35em!important}
.bk-gal p:last-child{font-size:14.5px;color:#bdb7ab;line-height:1.9}

/* ===== 差し替え ===== */
.bk-swap{background:var(--bk-black)}
.bk-steps{gap:0!important;max-width:1000px!important;margin-bottom:44px!important}
.bk-step{text-align:center;padding:10px 26px!important;margin:0!important;position:relative}
.bk-step + .bk-step{border-left:1px solid var(--bk-line)}
.bk-step > *{margin:0!important}
.bk-step-n{font-family:var(--bk-latin);font-style:italic;font-weight:600;font-size:46px;line-height:1;color:var(--bk-gold)}
.bk-step h3{font-size:26px!important;color:#fff!important;letter-spacing:.2em;margin:.2em 0 .4em!important}
.bk-step p:last-child{font-size:14.5px;color:#bdb7ab}
.bk-screen{max-width:900px!important;margin:0 auto!important;padding:14px!important;border:1px solid var(--bk-line);background:#111}
.bk-screen .wp-block-image{margin:0!important}
.bk-screen img{display:block;width:100%}

/* ===== 高級感 ===== */
.bk-lux{background:radial-gradient(800px 500px at 20% 30%,rgba(200,164,93,.10),transparent 70%),var(--bk-black2)}
.bk-lux-cols{max-width:1180px!important;gap:clamp(28px,5vw,64px)!important;align-items:center!important}
.bk-lux-stage{position:relative;padding:0 0 10% 0!important;margin:0!important}
.bk-lux-stage .bk-lpc{margin:0 12% 0 0!important}
.bk-lux-stage .bk-lpc img{display:block;border:1px solid var(--bk-gold)!important;padding:6px;background:#000;box-shadow:0 30px 60px rgba(0,0,0,.6)}
.bk-lux-stage .bk-lsp{position:absolute;right:0;bottom:0;width:27%;margin:0!important}
.bk-lux-stage .bk-lsp img{display:block;border:5px solid #000!important;outline:1px solid var(--bk-gold);border-radius:16px!important;aspect-ratio:9/18.5;object-fit:cover;object-position:top}
.bk-script{font-family:var(--bk-latin);font-style:italic;font-weight:500;font-size:40px;line-height:1;color:var(--bk-gold);margin:0!important}
.bk-script-c{text-align:center;margin-bottom:.3em!important}
.bk h3.bk-h3{font-size:clamp(22px,2.6vw,28px)!important;color:#fff!important;letter-spacing:.08em;margin:.3em 0 .6em!important}
.bk-lux-cols p{color:#cfcac0;font-size:15px;line-height:2}
.bk-link a{color:var(--bk-gold2);font-weight:700;letter-spacing:.06em}
.bk-alts{gap:28px!important;max-width:1000px!important;margin:64px auto 0!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
.bk-alt{margin:0!important;display:grid!important;grid-template-columns:42% 1fr;column-gap:18px;align-items:center;border:1px solid var(--bk-line);padding:14px!important;background:rgba(0,0,0,.35)}
.bk-alt > *{margin:0!important}
.bk-alt .wp-block-image{grid-row:1/3}
.bk-alt img{display:block;aspect-ratio:3/2;object-fit:cover;object-position:top}
.bk-alt-name{font-family:var(--bk-serif);font-weight:700;font-size:19px;color:#fff;align-self:end;letter-spacing:.1em}
.bk-alt p:last-child{font-size:13.5px;color:#bdb7ab;align-self:start;line-height:1.8}

/* ===== 費用 ===== */
.bk-cost{background:var(--bk-black)}
.bk-cs{gap:0!important;max-width:1000px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;border:1px solid var(--bk-line)}
.bk-c{text-align:center;padding:34px 18px!important;margin:0!important}
.bk-c + .bk-c{border-left:1px solid var(--bk-line)}
.bk-c > *{margin:0!important}
.bk-c-name{font-family:var(--bk-serif);font-weight:700;font-size:16px;letter-spacing:.1em;color:#d8d2c5}
.bk-c-val{font-family:var(--bk-latin);font-style:italic;font-weight:600;font-size:clamp(46px,5.6vw,64px);line-height:1.15;color:#8e897f;margin:.2em 0!important}
.bk-c-val small{font-family:var(--bk-serif);font-style:normal;font-size:.3em;margin-left:.1em}
.bk-c-cond{font-size:13px;color:var(--bk-mute)}
.bk-c-main{background:linear-gradient(180deg,rgba(200,164,93,.16),rgba(200,164,93,.04));box-shadow:inset 0 0 0 1px var(--bk-gold)}
.bk-c-main .bk-c-name{color:var(--bk-gold2)}
.bk-c-main .bk-c-val{color:var(--bk-gold2)}
.bk-honest{max-width:860px;margin:28px auto 0!important;font-size:14.5px;color:#cfcac0;line-height:2;border-left:2px solid var(--bk-gold);padding:4px 0 4px 20px!important}

/* ===== 流れ ===== */
.bk-flow{background:var(--bk-black2)}
.bk-fs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:0!important;max-width:1100px!important;position:relative}
.bk-fs::before{content:"";position:absolute;left:12%;right:12%;top:27px;height:1px;background:var(--bk-line)}
.bk-f{text-align:center;margin:0!important;padding:0 10px!important;position:relative}
.bk-f > *{margin:0!important}
.bk-f-n{width:54px;height:54px;margin:0 auto 14px!important;border:1px solid var(--bk-gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--bk-latin);font-style:italic;font-weight:600;font-size:26px;color:var(--bk-gold2);background:var(--bk-black2)}
.bk-f p:last-child{font-family:var(--bk-serif);font-weight:700;font-size:16.5px;color:#fff;line-height:1.6}
.bk-f p:last-child small{display:block;font-family:"Noto Sans JP",sans-serif;font-weight:400;font-size:12.5px;color:var(--bk-mute);margin-top:.4em}
.bk-f:last-child .bk-f-n{background:var(--bk-gold);color:#16130c}

/* ===== FAQ / 締め ===== */
.bk-faq{background:var(--bk-black)}
.bk-final{text-align:center;padding:clamp(72px,9vw,120px) 16px!important;position:relative;overflow:hidden;background:radial-gradient(600px 360px at 50% 0%,rgba(200,164,93,.2),transparent 70%),#070708}
.bk-final::before{content:"";position:absolute;inset:22px;border:1px solid rgba(200,164,93,.25);pointer-events:none}
.bk-final > *{position:relative}

/* ===== スマホ ===== */
@media (max-width:781px){
  .bk-fv{padding-top:36px!important}
  .bk-fv::before,.bk-final::before{inset:10px}
  .bk-fv h1.bk-h1{font-size:26px;letter-spacing:.03em}
  .bk-fv .bk-ctas .wp-block-button{width:100%}
  .bk-frame{margin-top:12px!important;padding-bottom:16%!important}
  .bk-frame .bk-pc::before{display:none}
  .bk-devcap{position:static;margin-top:10px!important}
  .bk-lead{text-align:left}
  .bk-gal{grid-template-columns:44px 1fr;column-gap:12px}
  .bk-steps{grid-template-columns:minmax(0,1fr)!important}
  .bk-step + .bk-step{border-left:0;border-top:1px solid var(--bk-line);padding-top:22px!important;margin-top:12px!important}
  .bk-script{font-size:32px}
  .bk-alts{grid-template-columns:minmax(0,1fr)!important}
  .bk-cs{grid-template-columns:minmax(0,1fr)!important}
  .bk-c + .bk-c{border-left:0;border-top:1px solid var(--bk-line)}
  .bk-fs{grid-template-columns:minmax(0,1fr);row-gap:26px!important}
  .bk-fs::before{left:27px;right:auto;top:10px;bottom:10px;width:1px;height:auto}
  .bk-f{display:grid!important;grid-template-columns:54px 1fr;column-gap:16px;text-align:left;align-items:center;padding:0!important}
  .bk-f-n{margin:0!important}
  .bk-ctas .wp-block-button,.bk-ctas .wp-block-button__link{width:100%}
}

/* 調整 */
.bk-fv h1.bk-h1{font-size:clamp(28px,3.6vw,46px);line-height:1.42}
.bk-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.bk-screen{max-width:760px!important}
.bk-screen img{filter:brightness(.92)}
@media (max-width:781px){
  .bk h2.bk-h2{font-size:22px;letter-spacing:.02em}
  .bk-fv h1.bk-h1{font-size:28px}
  .bk-steps{grid-template-columns:minmax(0,1fr)!important}
}
@media (min-width:782px){
  .bk-fv{padding-top:44px!important;padding-bottom:64px!important}
  .bk-kicker{margin-bottom:1.1em!important}
  .bk-fv h1.bk-h1{font-size:clamp(28px,3.2vw,42px);line-height:1.4;margin-bottom:.5em!important}
  .bk-fv-sub{margin-bottom:.8em!important}
  .bk-fv-price strong{font-size:clamp(56px,6vw,80px)}
  .bk-fv .bk-ctas{margin-top:1.4em!important}
}
@media (max-width:781px){.bk-devcap{padding-right:30%!important;font-size:12.5px}}
