@charset "UTF-8";
/* 2026-10-31 トップ作り直しの見本（page-top2.php 専用）。
   今の style.css と混ざらないように、すべて kz2- で始まる名前にしている。
   背景は白（10/31 南さん「全体的に暗い」）。黒は文字だけ、金は面・線・ボタンの地に使い、文字色には使わない（白地の金文字は読みにくいため） */
:root{--kz2-gold:#C9A063;--kz2-gold-soft:#FBF7F0;--kz2-black:#000;--kz2-text:#1a1a1a;--kz2-sub:#555;--kz2-line:#ECE4D6;--kz2-ease:cubic-bezier(.22,.61,.36,1)}
body.kz2{margin:0;font-family:"Noto Sans JP",sans-serif;color:var(--kz2-text);background:#fff;line-height:1.8;-webkit-text-size-adjust:100%}
/* 土台は :where で強さを0にし、個別の指定（ボタンの文字色・中央寄せの余白など）を消さないようにする */
:where(.kz2) *,:where(.kz2) *:before,:where(.kz2) *:after{box-sizing:border-box}
:where(.kz2) a{color:inherit;text-decoration:none}
:where(.kz2) img{max-width:100%;height:auto;display:block}
:where(.kz2) :is(h1,h2,h3,p,ul,ol){margin:0}
.kz2-wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.kz2-sp{display:none}
.kz2-nw{white-space:nowrap}

/* ボタン。相談ボタンは金の地に黒文字で、ページの中で一番目立つものにする */
.kz2-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;border-radius:999px;line-height:1.4;text-align:center;transition:transform .25s var(--kz2-ease),box-shadow .25s var(--kz2-ease),background-color .25s var(--kz2-ease),color .25s var(--kz2-ease)}
/* 金は線と小さな文字だけ（GODIVA・BIJOUPIKOの量。10/31 南さん）。ボタンは黒 */
.kz2-btn-gold{background:#000;color:#fff;padding:12px 26px;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.kz2-btn-line{border:2px solid #000;color:#000;background:#fff;padding:14px 32px}
.kz2-btn-xl{min-width:320px;padding:22px 44px;font-size:19px}
.kz2-btn-xl.kz2-btn-line{min-width:220px;padding:20px 36px;font-size:17px}
.kz2-arw{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:#000;font-size:14px;transition:transform .25s var(--kz2-ease)}
@media (hover:hover){
	.kz2-btn-gold:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.12)}
	.kz2-btn-gold:hover .kz2-arw{transform:translateX(3px)}
	.kz2-btn-line:hover{background:#000;color:#fff;transform:translateY(-2px)}
}

/* ヘッダー：相談ボタンを常に右上に出す。下にスクロールしたら影だけ付ける（高さは変えない） */
.kz2-hd{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);transition:box-shadow .3s var(--kz2-ease)}
.kz2-hd.is-scrolled{box-shadow:0 2px 16px rgba(0,0,0,.06)}
.admin-bar .kz2-hd{top:32px}
.kz2-hd-in{display:flex;align-items:center;gap:28px;height:76px}
.kz2-logo img{height:36px;width:auto}
.kz2-nav{display:flex;gap:26px;align-items:center;font-size:14px;font-weight:700;margin-left:auto}
.kz2-nav a{position:relative;padding:4px 0}
.kz2-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--kz2-gold);transform:scaleX(0);transition:transform .25s var(--kz2-ease)}
.kz2-nav a:hover:after{transform:scaleX(1)}
.kz2-hd-cta{padding:14px 28px;font-size:15px}
.kz2-menu{display:none}

/* 見出し */
.kz2-sec{padding:96px 0}
.kz2-ttl{text-align:center;margin-bottom:28px}
.kz2-ttl span{display:inline-block;font-weight:700;font-size:12px;letter-spacing:.22em;color:#000;padding-bottom:4px;border-bottom:2px solid var(--kz2-gold)}
.kz2-ttl h2{font-size:clamp(24px,3vw,36px);margin-top:8px !important;font-weight:900;line-height:1.4}
.kz2-sec-lead{text-align:center;color:var(--kz2-sub);margin:0 auto 48px !important;max-width:960px}

/* 流れの図：4つの段と、その下に土台。サービス名は受け持つ段に置く */
.kz2-flow{margin:0 auto 64px;max-width:1000px}
.kz2-flow-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.kz2-flow-steps li{position:relative;background:#fff;border:1px solid var(--kz2-line);border-top:2px solid var(--kz2-gold);border-radius:14px;padding:22px 16px 20px;text-align:center;box-shadow:0 6px 18px rgba(0,0,0,.04)}
.kz2-flow-steps li+li:before{content:"";position:absolute;left:-21px;top:50%;width:12px;height:12px;border-top:3px solid var(--kz2-gold);border-right:3px solid var(--kz2-gold);transform:translateY(-50%) rotate(45deg)}
.kz2-flow-no{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid var(--kz2-gold);color:#000;font-weight:900;font-size:13px}
.kz2-flow-name{font-weight:900;font-size:18px;margin-top:8px !important}
.kz2-flow-svc{display:flex;flex-direction:column;gap:2px;margin-top:8px !important;font-size:13px;color:var(--kz2-sub)}
.kz2-flow-svc a{text-decoration:underline;text-decoration-color:var(--kz2-gold);text-underline-offset:3px}
.kz2-flow-base{margin-top:18px !important;background:#fff;border:1px solid var(--kz2-line);border-radius:14px;padding:16px 20px;display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:center;align-items:center;font-size:14px}
.kz2-flow-base b{background:#fff;border:1px solid var(--kz2-gold);color:#000;border-radius:999px;padding:2px 14px;font-size:13px}
.kz2-flow-base a{text-decoration:underline;text-decoration-color:var(--kz2-gold);text-underline-offset:3px;font-weight:700}

/* サービス */
.kz2-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.kz2-card{background:#fff;border:1px solid var(--kz2-line);border-radius:16px;padding:28px 22px;display:flex;flex-direction:column;gap:10px;box-shadow:0 6px 18px rgba(0,0,0,.04);transition:transform .3s var(--kz2-ease),box-shadow .3s var(--kz2-ease),border-color .3s var(--kz2-ease)}
@media (hover:hover){a.kz2-card:hover{border-color:var(--kz2-gold);transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.08)}}
.kz2-no{width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--kz2-gold);color:#000;display:grid;place-items:center;font-weight:900}
.kz2-card h3{margin-top:4px !important;font-size:18px;line-height:1.5}
.kz2-card h3 small{display:block;font-size:12px;font-weight:700;color:var(--kz2-sub)}
.kz2-card p{color:var(--kz2-sub);font-size:14px;flex:1}
.kz2-more{font-weight:700;font-size:14px;border-top:1px solid var(--kz2-line);padding-top:12px}
.kz2-tags{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.kz2-tags li{font-size:12px;font-weight:700;line-height:1.5;padding:3px 10px;border:1px solid var(--kz2-gold);border-radius:999px;background:#fff;color:#000}
/* カードの上に写真（参考：HubSpotのサービス欄。10/31 南さん） */
.kz2-card{overflow:hidden}
.kz2-card-img{display:block;width:calc(100% + 44px);max-width:none;height:auto;aspect-ratio:4/3;object-fit:cover;margin:-28px -22px 8px;transition:transform .5s var(--kz2-ease)}
@media (hover:hover){a.kz2-card:hover .kz2-card-img{transform:scale(1.03)}}
.kz2-card h3 small{margin-top:2px}
.kz2-card .kz2-tags{margin-bottom:2px}
.kz2-more:after{content:" →"}
.kz2-soon{color:var(--kz2-sub)}
.kz2-soon:after{content:""}
.kz2-band{margin-top:32px !important;text-align:center;font-size:14px;font-weight:700}
.kz2-band b{font-size:22px;font-weight:900;border-bottom:3px solid var(--kz2-gold);line-height:1.2}
.kz2-band small{font-size:12px;font-weight:400;color:var(--kz2-sub)}

/* 会社概要：会社の説明（AIに読ませる定義の文）と理念 */
.kz2-company-sec{border-top:1px solid var(--kz2-line)}
.kz2-company{text-align:center;max-width:820px}
/* 説明の2文は1枚の面に見せる（上の段と下の段で角丸を分ける） */
.kz2-about{text-align:left;font-size:15px;color:var(--kz2-text);background:#fff;border:1px solid var(--kz2-line);border-bottom:0;border-radius:14px 14px 0 0;padding:24px 28px 6px}
.kz2-about + .kz2-about{border:1px solid var(--kz2-line);border-top:0;border-radius:0 0 14px 14px;padding:6px 28px 24px;margin-bottom:36px !important}
.kz2-motto{display:inline-block;font-weight:900;font-size:18px;padding-bottom:4px;border-bottom:2px solid var(--kz2-gold);margin-bottom:20px !important}
.kz2-company p.kz2-vision{margin-bottom:12px !important}
.kz2-company .kz2-btn{margin-top:20px}

/* フッター */
.kz2-ft{margin:0;background:#fff;border-top:1px solid var(--kz2-line);padding:48px 0 0;font-size:14px}
.kz2-ft-in{display:flex;gap:48px;align-items:flex-start;flex-wrap:wrap}
.kz2-ft-logo img{width:96px}
.kz2-ft-menu{display:flex;gap:56px;flex:1}
.kz2-ft-menu div{display:flex;flex-direction:column;gap:8px}
.kz2-ft-menu p{font-weight:700;padding-bottom:4px;border-bottom:2px solid var(--kz2-gold);align-self:flex-start;margin-bottom:4px !important}
.kz2-ft-menu a:hover{text-decoration:underline}
.kz2-sns{display:flex;gap:14px}
.kz2-sns img{width:28px;height:28px}
/* 今のアイコンは黒いフッター用の白い絵なので、白いフッターでは黒く反転して見せる */
.kz2-sns img[src$=".svg"]{filter:invert(1)}
.kz2-copy{text-align:center;font-size:12px;color:#777;padding:28px 0}
.kz2-spbar{display:none}

/* ふわっと出る（プログラムが動いたときだけ隠す。一番上の見出しと絵には付けない） */
.js .kz2-rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--kz2-ease),transform .8s var(--kz2-ease);transition-delay:calc(var(--d,0) * 120ms)}
.js .kz2-rv.is-in{opacity:1;transform:none}

/* 画面幅が中くらい：ナビが詰まるのでサービスは2列 */
@media (max-width:1100px){
	.kz2-nav{gap:18px;font-size:13px}
	.kz2-flow-steps{gap:22px}
	.kz2-cards{grid-template-columns:repeat(2,1fr)}
}

/* スマホ・タブレット：ナビは三本線の中、相談ボタンは画面下に常に出す */
@media (max-width:960px){
	.kz2-hd-in{height:60px;gap:12px}
	.kz2-logo img{height:30px}
	.kz2-hd-cta{margin-left:auto;padding:10px 16px;font-size:13px}
	.kz2-menu{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:0 9px;border:0;background:none;cursor:pointer}
	.kz2-menu span{display:block;height:2px;background:#000;transition:transform .2s,opacity .2s}
	.kz2-open .kz2-menu span:nth-child(1){transform:translateY(7px) rotate(45deg)}
	.kz2-open .kz2-menu span:nth-child(2){opacity:0}
	.kz2-open .kz2-menu span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
	.kz2-nav{display:none;position:absolute;top:60px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--kz2-line);font-size:15px;margin:0}
	.kz2-nav a{padding:16px 24px;border-top:1px solid var(--kz2-line)}
	.kz2-nav a:after{display:none}
	.kz2-open .kz2-nav{display:flex}
}

@media (max-width:767px){
	.kz2-wrap{padding:0 16px}
	.kz2-pc{display:none}
	.kz2-sp{display:inline}
	.kz2-btn-xl,.kz2-btn-xl.kz2-btn-line{width:100%;min-width:0;padding:20px 16px;font-size:18px}
	.kz2-btn-xl.kz2-btn-line{padding:16px;font-size:16px}
	.kz2-sec{padding:64px 0}
	.kz2-sec-lead{text-align:left}
	.kz2-flow-steps{grid-template-columns:1fr;gap:22px}
	.kz2-flow-steps li{display:grid;grid-template-columns:30px 1fr;gap:4px 12px;text-align:left;align-items:center;padding:14px 16px;border-top-width:1px;border-left:2px solid var(--kz2-gold)}
	.kz2-flow-steps li+li:before{left:50%;top:-16px;width:10px;height:10px;transform:translateX(-50%) rotate(135deg)}
	.kz2-flow-name{margin-top:0 !important;font-size:16px}
	.kz2-flow-svc{grid-column:2;margin-top:0 !important}
	.kz2-flow-base{justify-content:flex-start;text-align:left}
	.kz2-cards{grid-template-columns:1fr}
	.kz2-band{text-align:left}
	.kz2-company{text-align:left}
	.kz2-about{padding:18px 18px 4px}
	.kz2-about + .kz2-about{padding:4px 18px 18px}
	.kz2-ft-in{flex-direction:column;gap:28px}
	.kz2-ft-menu{flex-direction:column;gap:28px}
	.kz2-spbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.97);border-top:1px solid var(--kz2-line);padding:10px 16px}
	.kz2-spbar .kz2-btn{flex:1;padding:15px 0;font-size:16px}
	body.kz2{padding-bottom:78px}
}
@media (max-width:782px){.admin-bar .kz2-hd{top:46px}}

/* 動きを減らす設定の人には全部止める */
@media (prefers-reduced-motion:reduce){
	.js .kz2-rv{opacity:1;transform:none;transition:none}
	.kz2-btn,.kz2-card,.kz2-hd,.kz2-arw{transition:none}
}

/* ===== 10/31 南さん「ベースはREXLI」「FV、CTA、サービス、あとは今と同じ」 =====
   REXLIの一番上・できること・締めの3か所を、色だけ金と黒に置き換えて同じ形にしたもの */

/* 一番上：小見出し → 見出し → 説明2行 → 大きな絵 → 横並びの大きなボタン2つ */
.kz2-hero{padding:36px 0 72px;text-align:center;background:#fff}
.kz2-hero-in{display:flex;flex-direction:column;align-items:center}
.kz2-eyebrow{display:flex;align-items:center;gap:16px;font-size:13px;font-weight:700;letter-spacing:.16em;color:#000}
.kz2-eyebrow:before,.kz2-eyebrow:after{content:"";width:40px;height:2px;background:var(--kz2-gold)}
.kz2-h1{margin-top:22px !important;font-size:clamp(26px,3.3vw,46px);line-height:1.5;font-weight:900;letter-spacing:.02em}
@media (min-width:768px){.kz2-h1{white-space:nowrap}}
/* REXLIと同じく、言葉の下半分に色の帯を敷く（金は文字に使わず面で使う） */
.kz2-mk{background:linear-gradient(transparent 62%,rgba(201,160,99,.34) 62%);padding:0 2px}
.kz2-hero-def{margin-top:26px !important;font-size:16px;color:var(--kz2-sub);line-height:2}
.kz2-hero-def b{font-size:17px;color:#000}
.kz2-fig{position:relative;width:100%;max-width:880px;margin:12px auto 0}
.kz2-fig img{position:relative;width:100%;margin:0 0 -10%}
/* 後ろの薄い英字。絵の地が白なので、絵の上に重ねて掛け合わせで薄く見せる */
.kz2-fig-bg{position:absolute;z-index:1;left:0;right:0;top:11%;font-size:clamp(30px,6vw,84px);font-weight:900;line-height:1;letter-spacing:.06em;color:transparent;-webkit-text-stroke:1.5px #E4D3B4;white-space:nowrap;mix-blend-mode:multiply;pointer-events:none;user-select:none}
.kz2-bub{position:absolute;z-index:2;background:#fff;border:1px solid #D9D2C6;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:700;line-height:1.5;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.06)}
.kz2-bub:after{content:"";position:absolute;left:18px;bottom:-6px;width:10px;height:10px;background:#fff;border-right:1px solid #D9D2C6;border-bottom:1px solid #D9D2C6;transform:rotate(45deg)}
.kz2-bub1{left:3%;top:27%}
.kz2-bub2{left:24%;top:12%}
.kz2-bub3{left:66%;top:21%}
.kz2-badge{position:absolute;z-index:2;right:-6px;top:-34px;width:132px;height:132px;border-radius:50%;background:#fff;border:2px solid var(--kz2-gold);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.3}
.kz2-badge small{font-size:11px;font-weight:700}
.kz2-badge b{font-size:40px;font-weight:900;line-height:1.1}
.kz2-cta{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:24px;width:100%;max-width:920px;margin-top:28px}
.kz2-hbtn{display:flex;align-items:center;justify-content:center;gap:14px;min-height:88px;padding:0 24px;border-radius:12px;font-size:19px;font-weight:700;transition:transform .25s var(--kz2-ease),box-shadow .25s var(--kz2-ease),border-color .25s var(--kz2-ease)}
.kz2-hbtn span{transition:transform .25s var(--kz2-ease)}
.kz2-hbtn-main{background:#000;color:#fff}
.kz2-hbtn-sub{background:#fff;color:#000;border:1px solid #D6D6D6}
@media (hover:hover){
	.kz2-hbtn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.12)}
	.kz2-hbtn:hover span{transform:translateX(4px)}
	.kz2-hbtn-sub:hover{border-color:#000}
}
.kz2-cta-note{font-size:13px;color:#888;margin-top:16px !important}

/* できること：左寄せの見出し（吹き出しの札・後ろに薄い英字）→ 説明 → 番号つきの白いカード2列 */
.kz2-sh{position:relative;z-index:0;padding-top:12px}
.kz2-sh-bg{position:absolute;z-index:-1;left:-28px;top:-34px;font-size:150px;font-weight:900;line-height:1;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1.5px #EFE4D2;white-space:nowrap;pointer-events:none;user-select:none}
.kz2-sh-label{position:relative;display:inline-block;background:#000;color:#fff;font-size:13px;font-weight:700;letter-spacing:.1em;padding:8px 24px;border-radius:999px}
.kz2-sh-label:after{content:"";position:absolute;left:20px;bottom:-6px;border-left:7px solid #000;border-bottom:7px solid transparent}
.kz2-sh h2{margin-top:22px !important;font-size:clamp(28px,3.2vw,44px);font-weight:900;line-height:1.4}
.kz2-sh-lead{max-width:760px;margin:20px 0 52px !important;font-size:15px;line-height:2;color:var(--kz2-sub)}
.kz2-scs{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.kz2-sc{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #E3DACB;border-radius:18px;padding:48px 44px 36px;box-shadow:6px 6px 0 #F4EDE1;overflow:hidden;transition:transform .3s var(--kz2-ease),box-shadow .3s var(--kz2-ease),border-color .3s var(--kz2-ease)}
.kz2-sc-no{position:absolute;right:20px;top:-14px;font-size:86px;font-weight:900;line-height:1;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1.5px #E4D3B4;pointer-events:none}
.kz2-sc h3{position:relative;font-size:22px;line-height:1.5}
.kz2-sc h3 small{display:block;font-size:13px;color:var(--kz2-sub);margin-top:2px}
.kz2-sc-tags{list-style:none;padding:0;margin:12px 0 0 !important;display:flex;flex-wrap:wrap;gap:6px}
.kz2-sc-tags li{font-size:12px;font-weight:700;line-height:1.5;padding:4px 12px;border:1px solid #DDD5C8;border-radius:999px}
.kz2-sc-desc{flex:1;margin-top:14px !important;font-size:15px;line-height:1.95;color:var(--kz2-sub)}
.kz2-sc-more{margin-top:22px;font-size:13px;font-weight:700;letter-spacing:.04em}
.kz2-sc-more:not(.kz2-soon):after{content:"\00a0\00a0→"}
@media (hover:hover){a.kz2-sc:hover{transform:translate(-2px,-2px);box-shadow:10px 10px 0 #EADBC0;border-color:var(--kz2-gold)}}
.kz2-scs + .kz2-band{margin-top:56px !important}

/* 締め：画面いっぱいの黒い面。ボタンは一番上と同じ形で、金の地に黒文字 */
.kz2-final{position:relative;overflow:hidden;background:#111;color:#fff;padding:128px 0;text-align:center}
.kz2-final:before{content:"";position:absolute;left:-60px;top:56px;width:180px;height:10px;border-radius:10px;background:var(--kz2-gold);box-shadow:0 0 28px rgba(201,160,99,.65)}
.kz2-final h2{font-size:clamp(26px,3.2vw,44px);font-weight:900;line-height:1.55}
.kz2-final-lead{margin-top:26px !important;font-size:15px;line-height:2;color:#B9B9B9}
.kz2-final .kz2-cta{max-width:520px;margin:40px auto 0;gap:16px}
.kz2-final .kz2-hbtn{min-height:70px;font-size:17px}
.kz2-final .kz2-hbtn-main{background:var(--kz2-gold);color:#000}
.kz2-final .kz2-hbtn-sub{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
@media (hover:hover){.kz2-final .kz2-hbtn-sub:hover{border-color:#fff}}
.kz2-ft{border-top:0}

@media (max-width:767px){
	.kz2-hero{padding:28px 0 48px}
	.kz2-eyebrow{font-size:11px;gap:10px;letter-spacing:.12em}
	.kz2-eyebrow:before,.kz2-eyebrow:after{width:24px}
	.kz2-h1{font-size:25px;margin-top:16px !important}
	.kz2-hero-def{font-size:14px;margin-top:18px !important}
	.kz2-hero-def b{font-size:15px}
	.kz2-fig{margin:28px -16px 0;width:calc(100% + 32px);max-width:none}
	.kz2-bub{font-size:10px;padding:3px 8px;border-radius:6px}
	.kz2-bub:after{left:10px;width:7px;height:7px;bottom:-4px}
	.kz2-bub1{left:2%;top:22%}
	.kz2-bub2{left:20%;top:6%}
	.kz2-bub3{left:64%;top:16%}
	.kz2-badge{width:84px;height:84px;right:8px;top:-40px}
	.kz2-badge small{font-size:8px}
	.kz2-badge b{font-size:24px}
	.kz2-cta{grid-template-columns:1fr;gap:12px;margin-top:20px}
	.kz2-hbtn{min-height:64px;font-size:17px}
	.kz2-sh-bg{font-size:72px;left:-8px;top:-10px}
	.kz2-sh-lead{margin-bottom:32px !important;font-size:14px}
	.kz2-scs{grid-template-columns:1fr;gap:20px}
	.kz2-sc{padding:36px 24px 28px}
	.kz2-sc-no{font-size:64px;right:14px;top:-10px}
	.kz2-sc h3{font-size:19px}
	.kz2-sc-desc{font-size:14px}
	.kz2-scs + .kz2-band{margin-top:40px !important}
	.kz2-final{padding:80px 0}
	.kz2-final:before{top:28px;width:120px;left:-50px}
	.kz2-final h2{font-size:24px}
	.kz2-final-lead{font-size:14px;text-align:left}
	.kz2-final .kz2-cta{max-width:none}
}
@media (prefers-reduced-motion:reduce){.kz2-hbtn,.kz2-hbtn span,.kz2-sc{transition:none}}

/* 10/31 南さん「4か所を変える」「サービスの部分も写真か画像をいれよう」
   REXLIだけの特徴（小見出しの英語・絵の後ろの英字・右上の丸い実績・カードの線だけの大きな番号）を外し、
   実績はボタンの下の1行に、サービスのカードは上に写真を置く形にした */
.kz2-hero .kz2-h1{margin-top:8px !important}
.kz2-proof{display:flex;align-items:baseline;justify-content:center;gap:6px;margin-top:22px !important;font-size:14px;font-weight:700}
.kz2-proof:before{content:"";align-self:center;width:28px;height:2px;background:var(--kz2-gold);margin-right:8px}
.kz2-proof b{font-size:30px;font-weight:900;line-height:1;margin:0 2px;border-bottom:4px solid rgba(201,160,99,.45)}
.kz2-proof + .kz2-cta-note{margin-top:8px !important}
.kz2-sc{padding-top:0}
.kz2-sc-img{display:block;width:calc(100% + 88px);max-width:none;height:auto;aspect-ratio:16/10;object-fit:cover;margin:0 -44px 28px}
.kz2-sc-no{position:absolute;left:20px;top:20px;right:auto;font-size:13px;font-weight:900;letter-spacing:.08em;color:#fff;-webkit-text-stroke:0;background:#000;border-radius:999px;padding:6px 14px;line-height:1}
@media (hover:hover){a.kz2-sc .kz2-sc-img{transition:transform .5s var(--kz2-ease)}}
@media (max-width:767px){
	.kz2-proof{font-size:12px;flex-wrap:wrap}
	.kz2-proof b{font-size:24px}
	.kz2-sc-img{width:calc(100% + 48px);margin:0 -24px 22px}
	.kz2-sc-no{left:14px;top:14px;font-size:12px}
}
/* サービス欄の見出しは、REXLIの形（線だけの英字・黒い吹き出しの札）をやめ、ほかの欄と同じ見出しにそろえた */
.kz2-ttl + .kz2-sh-lead{margin:0 auto 48px !important;text-align:center}
.kz2-sc{box-shadow:0 10px 30px rgba(0,0,0,.06)}
@media (hover:hover){a.kz2-sc:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(0,0,0,.1)}}
@media (max-width:767px){.kz2-ttl + .kz2-sh-lead{text-align:left;margin-bottom:28px !important}}
/* 一番上の絵を「輪」に替えた（10/31 南さん）。絵の下の白い余白が前より少ないので、ボタンへの重なりを小さくした */
.kz2-fig img{margin-bottom:-3%}
/* 動き（client-hpの動きの型の範囲）。一番上の絵は最初から見せて「ゆっくり寄る」だけ。
   サービスのカードは0.12秒ずつずらして出し、写真はマウスを乗せると枠の中で少し拡大する */
@keyframes kz2-settle{from{transform:scale(1.05)}to{transform:none}}
.kz2-fig img{animation:kz2-settle 8s var(--kz2-ease) both}
a.kz2-sc .kz2-sc-img{transition:transform .8s var(--kz2-ease)}
@media (hover:hover){a.kz2-sc:hover .kz2-sc-img{transform:scale(1.04)}}
@media (max-width:767px){
	.kz2-proof{flex-wrap:nowrap;white-space:nowrap;font-size:11px;gap:4px}
	.kz2-proof:before{width:18px;margin-right:4px}
	.kz2-proof b{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.kz2-fig img{animation:none}a.kz2-sc .kz2-sc-img{transition:none}}
/* 金の輪を回る光。一番上の動きはこの1種類にするため、絵の「ゆっくり寄る」は止めた（光の位置が絵とずれるため） */
.kz2-fig img{animation:none}
.kz2-orbit{position:absolute;left:0;top:0;z-index:2;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:radial-gradient(circle,#FFF8E8 0,#EBCB92 40%,rgba(201,160,99,0) 72%);box-shadow:0 0 16px 5px rgba(201,160,99,.5);opacity:0;pointer-events:none;will-change:transform,opacity}
@media (max-width:767px){.kz2-orbit{width:10px;height:10px;margin:-5px 0 0 -5px;box-shadow:0 0 10px 3px rgba(201,160,99,.5)}}
/* 光が白い絵の上で見えなかったので、大きく・明るくした */
.kz2-orbit{width:26px;height:26px;margin:-13px 0 0 -13px;background:radial-gradient(circle,#fff 0,#fff 22%,#F3D9A6 45%,rgba(201,160,99,0) 72%);box-shadow:0 0 22px 8px rgba(201,160,99,.55)}
.kz2-orbit-t1{width:18px;height:18px;margin:-9px 0 0 -9px;box-shadow:0 0 14px 5px rgba(201,160,99,.45)}
.kz2-orbit-t2{width:13px;height:13px;margin:-6.5px 0 0 -6.5px;box-shadow:0 0 10px 3px rgba(201,160,99,.4)}
.kz2-orbit-t3{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;box-shadow:0 0 8px 2px rgba(201,160,99,.35)}
@media (max-width:767px){.kz2-orbit{width:16px;height:16px;margin:-8px 0 0 -8px;box-shadow:0 0 12px 4px rgba(201,160,99,.55)}.kz2-orbit-t1{width:11px;height:11px;margin:-5.5px 0 0 -5.5px}.kz2-orbit-t2{width:8px;height:8px;margin:-4px 0 0 -4px}.kz2-orbit-t3{width:6px;height:6px;margin:-3px 0 0 -3px}}
/* ボタンを最初の画面に収める（10/31 南さん）。ノートパソコン（画面の高さ826px）で、ボタンが画面の外（上から869px）にあった。
   上の余白を詰め、絵の幅を画面の高さから決める。絵の見た目の高さ＝幅×0.533（下の-3%の重なりを引いた値）、絵より上は約314px、絵より下（ボタンまで）は約106px */
@media (min-width:768px){
	.kz2-hero{padding-top:24px}
	.kz2-hero-def{margin-top:16px !important}
	.kz2-fig{margin-top:8px;max-width:clamp(460px,calc((100vh - 455px) * 1.877),880px)}
	.kz2-hero .kz2-cta{margin-top:20px}
	.kz2-hero .kz2-hbtn{min-height:72px}
}
/* 光に合わせて順番に動く場面（AI・スマホ・商談）。絵と同じ大きさのSVGを重ねる */
.kz2-anim{position:absolute;left:0;top:0;z-index:1;width:100%;height:auto;aspect-ratio:1672/941;pointer-events:none}
.kz2-orbit{z-index:3}
.kz2-anim *{transform-box:fill-box;transform-origin:center}
/* AI：おすすめのカードの金の枠が光り、きらめきの印が瞬く */
.kz2-ai{opacity:0}
.kz2-ai.is-on{animation:kz2-ai 2.2s var(--kz2-ease)}
@keyframes kz2-ai{0%{opacity:0}25%{opacity:1}70%{opacity:1}100%{opacity:0}}
.kz2-ai.is-on .kz2-ai-star{animation:kz2-star 1.1s ease-in-out 2}
@keyframes kz2-star{0%,100%{transform:scale(.6) rotate(0)}50%{transform:scale(1.25) rotate(20deg)}}
/* スマホ：吹き出しが1つずつ下から出てくる。次に光が来るまで、出た吹き出しは残す */
.kz2-ph-b{opacity:1}
.kz2-ph.is-on .kz2-ph-b{opacity:0;animation:kz2-pop .45s var(--kz2-ease) forwards}
.kz2-ph.is-on .kz2-ph-b2{animation-delay:.45s}
.kz2-ph.is-on .kz2-ph-b3{animation-delay:.9s}
.kz2-ph.is-on .kz2-ph-b4{animation-delay:1.35s}
@keyframes kz2-pop{from{opacity:0;transform:translateY(14px) scale(.9)}to{opacity:1;transform:none}}
/* 商談：2人の上に「…」の吹き出しが交互に出る */
.kz2-mt-b{opacity:0}
.kz2-mt.is-on .kz2-mt-b1{animation:kz2-talk 1.6s var(--kz2-ease)}
.kz2-mt.is-on .kz2-mt-b2{animation:kz2-talk 1.6s var(--kz2-ease) 1.2s}
@keyframes kz2-talk{0%{opacity:0;transform:translateY(8px) scale(.85)}18%{opacity:1;transform:none}80%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.kz2-anim .is-on,.kz2-anim .is-on *{animation:none !important}.kz2-ph-b{opacity:1}}

/* 会社概要：今の公開サイトと同じく、暗い写真の上に白い文字（10/31 南さん「会社概要は元のに寄せていいよ」） */
.kz2-company-sec{position:relative;overflow:hidden;border-top:0;background:#3a3a3a;padding:96px 0;color:#fff}
.kz2-company-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kz2-company{position:relative;text-align:center;max-width:820px}
.kz2-company .kz2-ttl span{color:#fff}
.kz2-company .kz2-ttl h2{color:#fff}
.kz2-company p.kz2-vision{font-size:18px;line-height:2;color:#fff;margin-bottom:18px !important}
.kz2-company .kz2-btn-line{margin-top:28px;border-radius:0;background:transparent;color:#fff;border:1px solid #fff;min-width:300px;padding:18px 36px;gap:14px}
@media (hover:hover){.kz2-company .kz2-btn-line:hover{background:#fff;color:#000}}
@media (max-width:767px){
	.kz2-company-sec{padding:64px 0}
	.kz2-company{text-align:center}
	.kz2-company p.kz2-vision{font-size:15px}
	.kz2-company .kz2-btn-line{min-width:0;width:100%}
}

/* 実績の数字：媒体の掲載が無いので、ボタン下の1行ではなく、サービスの下に2つ並べて見せる（10/31 南さん「その形にする」） */
.kz2-stats{display:grid;grid-template-columns:1fr 1fr;max-width:820px;margin:64px auto 0;background:#fff;border:1px solid #E3DACB;border-radius:16px;box-shadow:6px 6px 0 #F4EDE1}
.kz2-stat{position:relative;padding:36px 24px 32px;text-align:center}
.kz2-stat + .kz2-stat:before{content:"";position:absolute;left:0;top:28px;bottom:28px;width:1px;background:var(--kz2-gold)}
.kz2-stat-lb{font-size:14px;font-weight:700;color:var(--kz2-sub)}
.kz2-stat-num{margin-top:10px !important;font-size:16px;font-weight:700;line-height:1}
.kz2-stat-num b{font-size:56px;font-weight:900;letter-spacing:.01em;margin-right:4px;background:linear-gradient(transparent 68%,rgba(201,160,99,.4) 68%);padding:0 4px}
.kz2-stat-note{margin-top:10px !important;font-size:12px;color:var(--kz2-sub)}
@media (max-width:767px){
	.kz2-stats{grid-template-columns:1fr;margin-top:40px}
	.kz2-stat{padding:28px 16px 24px}
	.kz2-stat + .kz2-stat:before{left:24px;right:24px;top:0;bottom:auto;width:auto;height:1px}
	.kz2-stat-lb{font-size:13px}
	.kz2-stat-num b{font-size:44px}
}

/* 見出しが1行の短い言い切りになった（10/31 LLMO集客チャット経由で南さん決定）。短いぶん大きくする */
.kz2-hero .kz2-h1{font-size:clamp(30px,4.2vw,56px);letter-spacing:.04em}
@media (max-width:767px){.kz2-hero .kz2-h1{font-size:32px;line-height:1.45}}


/* 「サービスを見る」を外し、ボタンを1つにした（10/31 南さん「すぐ下にいくだけじゃん」） */
.kz2-cta{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto}
.kz2-final .kz2-cta{max-width:420px}

/* 仮で足した4つの段（10/31 南さん「足すならこの順で仮に作ってみて」） */
.kz2-pain-sec{border-top:1px solid var(--kz2-line)}
.kz2-pains{list-style:none;padding:0;margin:0 auto !important;max-width:880px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.kz2-pains li{position:relative;background:#fff;border:1px solid #E3DACB;border-radius:14px;padding:22px 24px 22px 60px;font-size:16px;font-weight:700;line-height:1.7}
.kz2-pains li:before{content:"";position:absolute;left:22px;top:26px;width:22px;height:22px;border-radius:50%;background:var(--kz2-gold-soft);border:2px solid var(--kz2-gold)}
.kz2-pains li:after{content:"";position:absolute;left:30px;top:30px;width:6px;height:11px;border:solid var(--kz2-gold);border-width:0 2px 2px 0;transform:rotate(45deg)}
.kz2-pains em{display:block;font-style:normal;font-size:12px;color:#9a7a45;letter-spacing:.06em;margin-bottom:2px}
.kz2-pain-ans{margin-top:40px !important;text-align:center;font-size:18px;font-weight:700;line-height:1.9}
.kz2-pain-ans:before{content:"";display:block;width:2px;height:40px;background:var(--kz2-gold);margin:0 auto 20px}

.kz2-steps{list-style:none;padding:0;margin:0 !important;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.kz2-steps li{position:relative;background:#fff;border:1px solid #E3DACB;border-radius:16px;padding:36px 28px 30px;box-shadow:6px 6px 0 #F4EDE1}
.kz2-steps li:not(:last-child):after{content:"";position:absolute;right:-22px;top:50%;width:14px;height:14px;border:solid var(--kz2-gold);border-width:2px 2px 0 0;transform:translateY(-50%) rotate(45deg)}
.kz2-steps b{display:inline-block;font-size:13px;font-weight:900;letter-spacing:.1em;color:#fff;background:#000;border-radius:999px;padding:4px 14px}
.kz2-steps h3{margin-top:14px !important;font-size:24px;font-weight:900}
.kz2-steps p{margin-top:10px !important;font-size:15px;line-height:1.9;color:var(--kz2-sub)}

.kz2-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.kz2-case{display:flex;flex-direction:column;background:#fff;border:1px solid #E3DACB;border-radius:16px;padding:28px 26px;box-shadow:6px 6px 0 #F4EDE1}
.kz2-case-who{font-size:19px;font-weight:900}
.kz2-case-who small{display:block;font-size:12px;font-weight:700;color:var(--kz2-sub);margin-top:2px}
.kz2-case-bf,.kz2-case-do{position:relative;margin-top:16px !important;padding-left:64px;font-size:14px;line-height:1.8;color:var(--kz2-sub)}
.kz2-case-bf:before,.kz2-case-do:before{position:absolute;left:0;top:3px;width:52px;text-align:center;font-size:11px;font-weight:700;line-height:1;padding:5px 0;border-radius:4px}
.kz2-case-bf:before{content:"前";background:#F1F1F1;color:#555}
.kz2-case-do:before{content:"やった事";background:var(--kz2-gold-soft);color:#8a6a35;border:1px solid #E7D6B8}
.kz2-case-af{margin-top:20px !important;padding-top:18px;border-top:1px solid var(--kz2-line);font-size:13px;font-weight:700;color:var(--kz2-sub)}
.kz2-case-af b{display:inline-block;margin-top:4px;font-size:28px;font-weight:900;color:#000;background:linear-gradient(transparent 66%,rgba(201,160,99,.4) 66%)}

.kz2-rep{display:grid;grid-template-columns:360px 1fr;gap:56px;align-items:center;max-width:980px}
.kz2-rep-img{width:100%;height:auto;border-radius:16px;box-shadow:10px 10px 0 #F4EDE1}
.kz2-rep-body .kz2-ttl{text-align:left;margin-bottom:20px}
.kz2-rep-name{font-size:28px;font-weight:900;letter-spacing:.06em}
.kz2-rep-name small{display:block;font-size:13px;font-weight:700;color:var(--kz2-sub);letter-spacing:.02em}
.kz2-rep-hist{list-style:none;padding:0;margin:20px 0 0 !important;border-left:2px solid var(--kz2-gold)}
.kz2-rep-hist li{padding:6px 0 6px 20px;font-size:15px;line-height:1.7}
.kz2-rep-hist b{display:inline-block;min-width:64px;font-weight:900}
.kz2-rep-msg{margin-top:20px !important;font-size:16px;font-weight:700}
.kz2-rep-more{display:inline-flex;gap:10px;margin-top:16px;font-size:14px;font-weight:700;border-bottom:2px solid var(--kz2-gold);padding-bottom:2px}

@media (max-width:767px){
	.kz2-pains{grid-template-columns:1fr;gap:12px}
	.kz2-pains li{font-size:15px;padding:18px 18px 18px 52px}
	.kz2-pains li:before{left:16px;top:22px}
	.kz2-pains li:after{left:24px;top:26px}
	.kz2-pain-ans{font-size:16px;text-align:left}
	.kz2-pain-ans:before{margin-left:0}
	.kz2-steps{grid-template-columns:1fr;gap:28px}
	.kz2-steps li:not(:last-child):after{right:auto;left:50%;top:auto;bottom:-22px;transform:translateX(-50%) rotate(135deg)}
	.kz2-steps li{padding:28px 22px 24px}
	.kz2-steps h3{font-size:21px}
	.kz2-cases{grid-template-columns:1fr;gap:16px}
	.kz2-rep{grid-template-columns:1fr;gap:28px}
	.kz2-rep-img{max-width:280px;margin:0 auto}
	.kz2-rep-name{font-size:24px}
	.kz2-rep-hist li{font-size:14px}
}


/* 囲っただけのカードをやめる（10/31 南さん「こういうただ囲っただけの作りがAIっぽい」）。線・余白・文字の大きさで区切る */
/* 悩み：左に大きな見出し、右に線で区切った一覧 */
.kz2-pain-sec .kz2-wrap{display:grid;grid-template-columns:340px 1fr;gap:0 64px;align-items:start;max-width:1100px}
.kz2-pain-sec .kz2-ttl{text-align:left;margin:0;position:sticky;top:120px}
.kz2-pain-sec .kz2-ttl h2{font-size:clamp(28px,3vw,40px);line-height:1.5}
.kz2-pains{display:block;max-width:none;margin:0 !important;counter-reset:pain;border-top:2px solid #000}
.kz2-pains li{display:grid;grid-template-columns:56px 132px 1fr;align-items:baseline;background:none;border:0;border-bottom:1px solid #D9D2C6;border-radius:0;padding:30px 0;font-size:21px;line-height:1.6;counter-increment:pain}
.kz2-pains li:before{content:counter(pain,decimal-leading-zero);position:static;width:auto;height:auto;border:0;border-radius:0;background:none;font-size:15px;font-weight:900;color:var(--kz2-gold);letter-spacing:.06em}
.kz2-pains li:after{content:none}
.kz2-pains em{margin:0;font-size:13px;color:var(--kz2-sub);letter-spacing:.04em}
.kz2-pain-ans{grid-column:2;text-align:left;margin-top:36px !important;font-size:19px}
.kz2-pain-ans:before{content:none}

/* 進め方：囲いをやめ、1本の金の線に大きな番号を通す */
.kz2-steps{position:relative;gap:56px}
.kz2-steps:before{content:"";position:absolute;left:0;right:0;top:40px;height:1px;background:var(--kz2-gold)}
.kz2-steps li{background:none;border:0;border-radius:0;box-shadow:none;padding:0}
.kz2-steps li:not(:last-child):after{content:none}
.kz2-steps b{position:relative;display:inline-block;background:#fff;color:#000;border-radius:0;padding:0 18px 0 0;font-size:80px;font-weight:900;line-height:1;letter-spacing:-.02em}
.kz2-steps h3{margin-top:24px !important;font-size:26px}
.kz2-steps p{font-size:15px}

/* サービス：枠と影を外し、写真と文字だけで見せる */
.kz2-sc{background:none;border:0;border-radius:0;box-shadow:none;padding:0 0 8px;overflow:visible}
.kz2-sc-img{width:100%;margin:0 0 24px;border-radius:14px}
@media (hover:hover){
	a.kz2-sc:hover{transform:none;box-shadow:none;border-color:transparent}
	a.kz2-sc:hover .kz2-sc-img{transform:none;opacity:.88}
	a.kz2-sc:hover .kz2-sc-more{text-decoration:underline;text-decoration-color:var(--kz2-gold);text-underline-offset:6px}
}
.kz2-scs{gap:56px 40px}

@media (max-width:767px){
	.kz2-pain-sec .kz2-wrap{grid-template-columns:1fr}
	.kz2-pain-sec .kz2-ttl{position:static;margin-bottom:28px}
	.kz2-pain-sec .kz2-ttl h2{font-size:26px}
	.kz2-pains li{grid-template-columns:40px 1fr;padding:22px 0;font-size:17px}
	.kz2-pains em{grid-column:2;font-size:12px}
	.kz2-pains li > span{grid-column:2}
	.kz2-pain-ans{grid-column:1;font-size:16px}
	.kz2-steps{gap:40px}
	.kz2-steps:before{left:27px;right:auto;top:8px;bottom:8px;width:1px;height:auto}
	.kz2-steps li{position:relative;padding-left:84px}
	.kz2-steps b{position:absolute;left:0;top:0;font-size:46px;padding:4px 0}
	.kz2-steps h3{margin-top:0 !important;font-size:22px}
	.kz2-sc{padding:0}
	.kz2-sc-img{width:100%;margin:0 0 18px}
	.kz2-scs{gap:44px}
}
.kz2-rep-img{box-shadow:none}

/* 11/1 実例（SANKOU!のAgent Grow・Zero-Ten）に合わせた直し。見出しは左寄せでそろえ、サービスは写真と文字を左右交互に並べる */
.kz2-nw{white-space:nowrap}
.kz2-ttl span{border-bottom:0;padding:0;color:var(--kz2-gold);letter-spacing:.24em}
.kz2-alt .kz2-ttl,.kz2-step-sec .kz2-ttl{text-align:left}
.kz2-alt .kz2-ttl h2,.kz2-step-sec .kz2-ttl h2,.kz2-pain-sec .kz2-ttl h2{font-size:clamp(28px,2.6vw,38px);line-height:1.5}
.kz2-alt .kz2-wrap{max-width:1100px}
.kz2-alt .kz2-ttl + .kz2-sh-lead{text-align:left;margin:0 0 80px !important;max-width:none;font-size:16px;color:#333}
.kz2-step-sec .kz2-wrap{max-width:1100px}
.kz2-step-sec .kz2-ttl{margin-bottom:56px}

/* サービス：1つずつ横に広く。写真と文字を交互に置く */
.kz2-scs{display:block}
.kz2-sc{display:grid;grid-template-columns:1.15fr 1fr;gap:0 64px;align-items:center;padding:0;margin:0}
.kz2-sc + .kz2-sc{margin-top:96px}
.kz2-sc-img{grid-column:1;grid-row:1;margin:0;border-radius:12px;aspect-ratio:4/3}
.kz2-sc-body{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:flex-start}
.kz2-sc:nth-child(even) .kz2-sc-img{grid-column:2}
.kz2-sc:nth-child(even) .kz2-sc-body{grid-column:1}
.kz2-sc-no{position:static;background:none;color:#000;border-radius:0;padding:0;font-size:56px;font-weight:900;line-height:1;letter-spacing:-.02em}
.kz2-sc h3{margin-top:20px !important;font-size:28px}
.kz2-sc h3 small{font-size:14px;margin-top:6px}
.kz2-sc-tags{margin-top:14px !important;gap:0;align-items:center}
.kz2-sc-tags:before{content:"";width:28px;height:1px;background:var(--kz2-gold);margin-right:12px}
.kz2-sc-tags li{border:0;border-radius:0;padding:0;font-size:13px;color:var(--kz2-sub)}
.kz2-sc-tags li + li:before{content:"・"}
.kz2-sc-desc{flex:none;margin-top:18px !important;font-size:16px;color:#333}
.kz2-sc-more{margin-top:28px;font-size:14px;padding-bottom:4px;border-bottom:2px solid var(--kz2-gold)}
.kz2-sc-more.kz2-soon{border-bottom-color:#DDD5C8;color:var(--kz2-sub)}
@media (hover:hover){a.kz2-sc:hover .kz2-sc-more{text-decoration:none;border-bottom-color:#000}}

/* 締め：左上の光る金の棒は外す */
.kz2-final:before{content:none}

@media (max-width:767px){
	.kz2-alt .kz2-ttl + .kz2-sh-lead{margin-bottom:44px !important;font-size:15px}
	.kz2-step-sec .kz2-ttl{margin-bottom:36px}
	.kz2-pain-sec .kz2-ttl h2,.kz2-alt .kz2-ttl h2,.kz2-step-sec .kz2-ttl h2{font-size:26px}
	.kz2-sc{grid-template-columns:1fr;gap:0}
	.kz2-sc + .kz2-sc{margin-top:56px}
	.kz2-sc-img,.kz2-sc:nth-child(even) .kz2-sc-img{grid-column:1;grid-row:1;margin:0 0 22px}
	.kz2-sc-body,.kz2-sc:nth-child(even) .kz2-sc-body{grid-column:1;grid-row:2}
	.kz2-sc-no{font-size:40px}
	.kz2-sc h3{margin-top:14px !important;font-size:22px}
	.kz2-sc-desc{font-size:15px}
}
.kz2-ttl h2 .kz2-nw{display:inline;font:inherit;color:inherit;letter-spacing:inherit;padding:0;border:0}


/* FVの＋α（11/1 南さん「今のを土台にして＋αでカッコよく」→ 案5に決定）
   背景：白のまま細いマス目だけ（真ん中の金の光は11/1 南さん「薄茶色くするのはやめて」で外した）。絵の白い地は乗算で背景になじませる */
.kz2-hero{position:relative;isolation:isolate;background:#fff}
.kz2-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 55%,#000 0,transparent 75%);mask-image:radial-gradient(ellipse 60% 70% at 50% 55%,#000 0,transparent 75%);pointer-events:none}
.kz2-hero-in{position:relative}
.kz2-fig img{mix-blend-mode:multiply}
/* 見出しの下を移る金の線 */
.kz2-hero .kz2-h1{position:relative}
.kz2-hbar{position:absolute;left:0;top:0;width:0;height:.11em;border-radius:2px;background:linear-gradient(90deg,#B98C4E,#E2C48F 50%,#C9A063);box-shadow:0 0 14px rgba(201,160,99,.6)}
.kz2-hmove .kz2-hbar{transition:left .7s cubic-bezier(.6,0,.2,1),top .7s cubic-bezier(.6,0,.2,1),width .7s cubic-bezier(.6,0,.2,1)}
/* 場面の札。光が通った場面だけ黒く光る */
.kz2-tag{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:#fff;border:1px solid #E6DCCB;color:#222;font-size:14px;font-weight:700;line-height:1.4;padding:8px 14px 8px 10px;border-radius:999px;box-shadow:0 8px 20px -8px rgba(60,40,10,.25)}
.kz2-hmove .kz2-tag{transition:background .5s,color .5s,border-color .5s,transform .5s,box-shadow .5s}
.kz2-tag i{width:22px;height:22px;border-radius:50%;background:#F3EBDD;color:#9A7440;font-size:11px;font-weight:800;font-style:normal;line-height:22px;text-align:center}
.kz2-tag.is-on{background:#111;color:#fff;border-color:#111;transform:translateY(-3px);box-shadow:0 14px 30px -10px rgba(0,0,0,.45),0 0 0 4px rgba(201,160,99,.25)}
.kz2-tag.is-on i{background:#C9A063;color:#111}
.kz2-tag1{right:80%;top:47%}
.kz2-tag2{left:56%;top:5%}
.kz2-tag3{left:84.5%;top:34%}
/* ボタン：黒に金の細い縁、矢印は金の丸、下に一言 */
.kz2-hero .kz2-hbtn-main{position:relative;border-radius:999px;background:#0B0B0B;box-shadow:0 18px 40px -14px rgba(0,0,0,.45)}
.kz2-hero .kz2-hbtn-main:after{content:"";position:absolute;inset:5px;border:1px solid rgba(201,160,99,.75);border-radius:inherit;pointer-events:none}
.kz2-hero .kz2-hbtn-main > span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#C9A063;color:#0B0B0B}
.kz2-hbtn-lb{display:flex;flex-direction:column;align-items:center;line-height:1.25;font-weight:700}
.kz2-hbtn-lb em{font-style:normal;font-size:12px;font-weight:500;color:#CDBB9A;letter-spacing:.08em;margin-top:4px}
@media (max-width:767px){
	.kz2-tag{font-size:11px;gap:5px;padding:5px 9px 5px 6px}
	.kz2-tag i{width:16px;height:16px;line-height:16px;font-size:9px}
	.kz2-tag1{right:auto;left:2%;top:58%}
	.kz2-tag2{left:56%;top:2%}
	.kz2-tag3{left:auto;right:2%;top:68%}
}
@media (prefers-reduced-motion:reduce){.kz2-hmove .kz2-hbar,.kz2-hmove .kz2-tag{transition:none}}

/* 手前の女性の上半身（絵の1672×941の上で x728・y556・幅136）。上の位置は幅に対する割合で置く（margin-topの%は幅が基準） */
.kz2-fig img.kz2-walker{position:absolute;z-index:1;left:43.54%;top:0;width:8.134%;margin:33.254% 0 0;mix-blend-mode:normal;pointer-events:none;animation:kz2-bob .32s ease-in-out infinite alternate}
@keyframes kz2-bob{from{transform:translateY(0)}to{transform:translateY(-3.2%)}}
@media (max-width:767px){.kz2-tag1{top:84%}}
@media (prefers-reduced-motion:reduce){.kz2-fig img.kz2-walker{animation:none}}
/* FVの細いマス目を外した（11/2 南さん「薄い縦と横の線が入ってない？」「消して出して」） */
.kz2-hero:before{display:none}
