/* ナイトブラ診断LP v3 — リデザイン
   スレート系の無彩色 × SF Pro 系サンセリフ。lp.css / extras.css の後に読み込みます。 */
:root {
	--nb-bg: #ffffff;
	--nb-bg-soft: #f2f5f8;
	--nb-ink: #202f3b;
	--nb-sub: #58737e;
	--nb-line: #cfdce7;
	--nb-accent: #3b505a;
	--nb-accent-dk: #202f3b;
	--nb-accent-lt: #f2f5f8;
	--nb-gold: #3b505a;
	--nb-radius: 0;
	--nb-shadow: none;
	--nb-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Inter, "Noto Sans JP", "Hiragino Sans", sans-serif;
	--nb-serif: var(--nb-sans);
}
html { background: #fff; scroll-padding-top: 72px; }
body.nblp { background: #fff; color: #3b505a; font-family: var(--nb-sans); font-size: 16px; line-height: 1.8; letter-spacing: .01em; }
.nblp h1, .nblp h2, .nblp h3, .nblp h4 { font-family: var(--nb-sans); font-weight: 600; color: #202f3b; letter-spacing: -.005em; }
.nblp .nb-wrap { max-width: 1400px; padding-left: 48px; padding-right: 48px; }
.nblp .nb-wrap--narrow { max-width: 1400px; }
@media (max-width: 860px) { .nblp .nb-wrap { padding-left: 20px; padding-right: 20px; } }

/* PR / HEADER */
.nb-pr { background: #fff; color: #58737e; border-bottom: 1px solid #cfdce7; font-size: 11px; letter-spacing: .08em; }
.nb-header { background: rgba(255, 255, 255, .92); border-bottom: 1px solid #3b505a; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); }
.nb-header__in { height: 64px; }
.nb-logo, .nb-header .nb-logo { color: #202f3b; }
.nb-logo__txt { font-family: var(--nb-sans); font-size: 15px; font-weight: 600; letter-spacing: .04em; color: #202f3b; text-transform: none; }
.nb-nav { font-size: 13px; letter-spacing: .08em; text-transform: none; }
.nb-nav a { color: #3b505a; }
.nb-nav a:hover { color: #202f3b; text-decoration: underline; text-underline-offset: 6px; }

/* BUTTONS：購入・診断の主ボタンは Deep Slate の角ボタン */
.nb-btn { border-radius: 0; background: #3b505a; color: #fff !important; border: 1px solid #3b505a; box-shadow: none; padding: 16px 28px; font-size: 13px; font-weight: 500; letter-spacing: .12em; text-transform: none; min-height: 48px; }
.nb-btn:hover { background: #202f3b; border-color: #202f3b; color: #fff !important; transform: none; }
.nb-btn--sm { padding: 10px 18px; min-height: 40px; font-size: 12px; }
.nb-btn--xs { padding: 8px 14px; min-height: 36px; font-size: 12px; }
.nb-btn--lg { padding: 20px 48px; font-size: 14px; }
.nb-btn--white { background: #fff; color: #202f3b !important; border-color: #fff; }
.nb-btn--white:hover { background: #f2f5f8; color: #202f3b !important; border-color: #f2f5f8; }
.nb-btn--disabled, .nb-btn--disabled:hover { background: #e6ebee; border-color: #e6ebee; color: #58737e !important; }
.nb-link { color: #3b505a; text-decoration: underline; text-underline-offset: 6px; letter-spacing: .08em; }
.nb-eyebrow { color: #58737e; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.nb-pr-tag { border-radius: 0; border-color: #cfdce7; color: #58737e; }

/* HERO（自動再生ループ） */
.nbh { position: relative; min-height: 820px; background: #202f3b; color: #fff; overflow: hidden; }
.nbh__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 0%; display: block; }
.nbh__veil { position: absolute; inset: 0; background: rgba(32, 47, 59, .42); }
.nbh__in { position: relative; min-height: 820px; display: flex; flex-direction: column; padding-top: 56px; padding-bottom: 64px; }
.nbh__mast { margin: 0; font-family: var(--nb-sans); font-weight: 600; font-size: clamp(48px, 6vw, 80px); line-height: 1.05; letter-spacing: -.015em; color: #fff; }
.nbh__bottom { margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; }
.nbh__copy { max-width: 580px; }
.nbh h1 { color: #fff; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.25; }
.nbh__lead { margin-top: 20px; color: rgba(255, 255, 255, .88); font-size: 15px; }
.nbh__actions { margin-top: 24px; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.nbh__actions > span { font-size: 12px; letter-spacing: .1em; opacity: .85; }
.nbh .nb-btn--hero { background: transparent; border: 0; border-bottom: 1px solid #fff; min-height: 0; padding: 0 0 6px; font-size: 13px; letter-spacing: .13em; }
.nbh .nb-btn--hero:hover { background: transparent; opacity: .8; }
.nbh__meta { display: flex; gap: 32px; margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .08em; opacity: .9; }
@media (max-width: 860px) {
	.nbh, .nbh__in { min-height: 680px; }
	.nbh__media { object-position: 58% 0%; }
	.nbh__meta { display: none; }
	.nbh__in { padding-top: 32px; padding-bottom: 40px; }
}

/* STEPS（放射状インフォグラフィック） */
.nb-flow { background: #ece8f3; padding: 80px 0; }
.nb-flow .nb-wrap { max-width: 1100px; }
.nb-flow__svg { width: 100%; height: auto; display: block; border-radius: 0; }
@media (max-width: 860px) { .nb-flow { padding: 40px 0; } }

/* SECTIONS */
.nb-section { padding: 96px 0; border-top: 0; background: #fff !important; color: #3b505a; }
.nb-section:nth-of-type(even) { background: #fff !important; }
.nb-guide, .nb-products, .nb-policy { background: #f2f5f8 !important; }
@media (max-width: 860px) { .nb-section { padding: 64px 0; } }
.nb-sechead { text-align: left; margin-bottom: 48px; }
.nb-sechead h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.25; letter-spacing: -.01em; color: #202f3b; text-transform: none; }
.nb-sechead > p:not(.nb-eyebrow) { color: #58737e; font-size: 14px; max-width: 640px; margin-top: 12px; }
.nb-card { background: #fff; border: 0; border-radius: 0; box-shadow: none; padding: 32px; }
.nb-card:hover { border-color: transparent; }

/* PICK UP */
.nb-pickup { background: #fff !important; padding: 64px 0; border-bottom: 1px solid #cfdce7; }
.nb-pickup__head { border-bottom: 1px solid #3b505a; padding-bottom: 16px; margin-bottom: 24px; }
.nb-pickup__head h2 { font-size: 24px; }
.nb-pickup__item { background: #f2f5f8; padding: 12px; }
.nb-bnr, .nb-strip .nb-bnr { border-radius: 0; }
.nb-bnr:hover { transform: none; box-shadow: none; }

/* QUIZ */
.nb-diag { background: #fff !important; }
.nb-quiz { background: #f2f5f8; border: 0; border-radius: 0; box-shadow: none; padding: 48px; }
.nb-quiz__bar { background: #cfdce7; border-radius: 0; height: 2px; }
.nb-quiz__bar span { background: #3b505a; border-radius: 0; }
.nb-quiz__count { color: #58737e; font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.nb-quiz__q { color: #202f3b; font-size: clamp(24px, 2.4vw, 32px); font-weight: 600; }
.nb-quiz__opts { gap: 18px; }
/* 選択ボタン：リキッドグラス（参考画像と同じ：カラーのぬるっとしたガラス） */
.nb-quiz { background: radial-gradient(70% 60% at 12% 8%, rgba(190, 175, 255, .55) 0%, rgba(190, 175, 255, 0) 70%), radial-gradient(60% 60% at 92% 20%, rgba(150, 225, 225, .55) 0%, rgba(150, 225, 225, 0) 70%), radial-gradient(70% 70% at 80% 100%, rgba(255, 190, 200, .6) 0%, rgba(255, 190, 200, 0) 70%), #ece8f3; position: relative; overflow: hidden; }
.nb-opt { --ga: rgba(255, 255, 255, .92); --gb: rgba(255, 255, 255, .55); --gg: rgba(110, 90, 160, .22); --gs: rgba(190, 180, 225, .32); --gc: #5a46e6;
	position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 16px;
	min-height: 72px; padding: 12px 14px 12px 36px; border-radius: 999px; font-size: 17px; font-weight: 500; letter-spacing: .03em; text-align: left; cursor: pointer; color: #3a3556;
	text-shadow: none;
	border: 1px solid rgba(255, 255, 255, .95);
	background: linear-gradient(180deg, var(--ga) 0%, var(--gb) 100%);
	box-shadow: 0 18px 34px var(--gg), 0 3px 0 rgba(255, 255, 255, .6) inset, 0 -12px 20px var(--gs) inset;
	-webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%);
	transition: transform .3s cubic-bezier(.3, 1.5, .5, 1), box-shadow .3s ease, filter .3s ease;
}
.nb-opt::before { content: ""; position: absolute; left: 5%; right: 5%; top: 5px; height: 46%; border-radius: 999px; background: linear-gradient(180deg, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 100%); pointer-events: none; }
.nb-opt::after { content: "›"; top: auto; right: auto; transform: none; flex: none; width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; padding-bottom: 3px; border-radius: 50%; position: relative; z-index: 1; background: linear-gradient(160deg, #9a8dff 0%, #5a46e6 100%); color: #fff; text-shadow: none; font-size: 24px; line-height: 1; box-shadow: 0 8px 16px rgba(90, 70, 230, .38), 0 2px 0 rgba(255, 255, 255, .55) inset, 0 -4px 8px rgba(40, 20, 150, .35) inset; transition: background .3s ease; }
.nb-opt:hover, .nb-opt:focus-visible { transform: translateY(-3px) scale(1.015); --gb: rgba(214, 205, 255, .7); --gg: rgba(100, 78, 230, .3); }
.nb-opt.is-selected { color: #fff; text-shadow: 0 1px 2px rgba(30, 20, 90, .3); --ga: rgba(176, 160, 255, .94); --gb: rgba(108, 84, 236, .96); --gg: rgba(100, 78, 230, .45); --gs: rgba(50, 30, 160, .4); border-color: rgba(255, 255, 255, .6); transform: translateY(-2px); }
@media (max-width: 860px) { .nb-quiz { padding: 28px 20px; } .nb-opt { padding: 12px 12px 12px 26px; min-height: 66px; font-size: 16px; } }
@media (prefers-reduced-motion: reduce) { .nb-opt { transition: none; } .nb-opt:hover { transform: none; } }
.nb-opt:focus-visible { outline: 3px solid #202f3b; outline-offset: 2px; }
.nb-result__title { color: #202f3b; }
.nb-rcard__type, .nb-product__type { color: #58737e !important; font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.nb-match, .nb-rank { border-radius: 0; }

/* GUIDE（4つの悩み） */
.nb-guide__choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 16px; }
.nb-guide-choice { position: relative; min-height: 0; background: #fff; border: 0; border-radius: 0; box-shadow: none; padding: 32px; display: flex; flex-direction: column; gap: 12px; transition: none; transform: none; overflow: visible; }
.nb-guide-choice:before { display: none; }
.nb-guide-choice:hover { transform: none; box-shadow: none; border: 0; }
.nb-guide-choice__num, .nb-guide-choice__icon { font-size: 12px; font-weight: 600; letter-spacing: .08em; color: #58737e; border: 0; padding: 0; margin: 0; }
.nb-guide-choice h3 { font-size: 22px; line-height: 1.5; margin: 0; color: #202f3b; }
.nb-guide-choice p { font-size: 14px; line-height: 1.8; color: #58737e; margin: 0; }
.nb-guide-choice .nb-guide__to { margin-top: auto; padding-top: 16px; border-top: 1px solid #cfdce7; color: #202f3b !important; font-size: 13px; }
.nb-guide-choice .nb-guide__to:before { content: "おすすめ：  "; color: #58737e; }

/* TABLE（画像サムネイル付き） */
.nb-table-scroll { background: #fff; border: 0; border-radius: 0; box-shadow: none; }
.nb-table { background: #fff; color: #3b505a; min-width: 1040px; }
.nb-table th, .nb-table td { border-color: #cfdce7; padding: 20px 16px; }
.nb-table thead th { background: #fff; color: #58737e; font-size: 12px; font-weight: 600; letter-spacing: .08em; border-bottom: 1px solid #3b505a; }
.nb-table tbody th { background: #fff; box-shadow: none; min-width: 200px; vertical-align: middle; }
.nb-table__thumb { width: 88px; height: auto; margin-bottom: 8px; border: 1px solid #cfdce7; background: #f2f5f8; }
.nb-table__thumb .nb-bnr { display: block; width: 100%; }
.nb-table__thumb--empty { height: 88px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.nb-table__name { color: #202f3b; font-weight: 600; }
.nb-dots i { border-radius: 0; background: #cfdce7; }
.nb-dots i.on { background: #3b505a; }

/* PRODUCTS */
.nb-product { background: #fff; border: 0; padding: 32px; }
.nb-product h3 { font-size: 28px; line-height: 1.35; color: #202f3b; }
.nb-product__catch { color: #58737e; }
.nb-product__meta div { background: transparent; border-radius: 0; padding: 0; }
.nb-product__meta dt { color: #58737e; font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.nb-product__meta dd { color: #3b505a; }
.nb-product__maker { color: #58737e; font-size: 12px; }
.nb-check li { border-top: 1px solid #cfdce7; }
.nb-check li:before { color: #3b505a; }

/* REVIEWS */
.nb-review-filter button { background: #fff; border: 1px solid #cfdce7; border-radius: 0; color: #3b505a; }
.nb-review-filter button.is-active { background: #3b505a; border-color: #3b505a; color: #fff; }
.nb-review { background: #f2f5f8; border: 0; }
.nb-review__text { color: #202f3b; }
.nb-review__attr { color: #58737e; }
.nb-stars { color: #3b505a; }
.nb-empty { background: #f2f5f8; }
.nb-prose { color: #3b505a; }
.nb-prose h2, .nb-prose h3 { color: #202f3b; }

/* POLICY / FAQ */
.nb-policy__box { background: #fff; border: 0; }
.nb-faq__item { background: #fff; border: 0; border-top: 1px solid #cfdce7; border-radius: 0; }
.nb-faq__item:last-child { border-bottom: 1px solid #cfdce7; }
.nb-faq__item summary { color: #202f3b; font-size: 16px; padding: 24px 40px 24px 0; }
.nb-faq__item summary:before, .nb-faq__item summary:after { color: #3b505a; }
.nb-faq__item p { color: #58737e; padding: 0 48px 28px 0; }

/* LAST CTA / FOOTER */
.nb-lastcta { background: #f2f5f8; color: #3b505a; padding: 112px 0; text-align: center; }
.nb-lastcta h2 { color: #202f3b; font-size: clamp(28px, 3vw, 40px); line-height: 1.3; }
.nb-lastcta p { color: #58737e; }
.nb-lastcta .nb-btn { background: #3b505a; color: #fff !important; border-color: #3b505a; }
.nb-footer { background: #3b505a; color: rgba(255, 255, 255, .85); border-top: 0; padding: 64px 0 40px; }
.nb-footer a { color: #fff; }
.nb-footer__top { border-color: #58737e; }
.nb-logo--footer .nb-logo__txt { color: #fff; font-size: 22px; }
.nb-footer__disc, .nb-footer__copy { color: rgba(255, 255, 255, .8); }
.nb-sticky { background: #3b505a !important; color: #fff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; font-size: 13px !important; letter-spacing: .1em !important; }

/* 追加パーツ（extras.css）の角丸・影を統一 */
.xt-gallery { background: #f2f5f8; }
.xt-gallery__item, .xt-deal, .xt-point, .xt-flow__item { border-radius: 0; box-shadow: none; border-color: #cfdce7; }
.xt-deal { border-top: 1px solid #3b505a; }
.xt-pr { border-radius: 0; background: #58737e; }
.xt-sub { border-left: 0; padding-left: 0; font-size: 20px; }
.xt-point__no { border-radius: 0; background: #3b505a; }
.xt-up { border-radius: 0; background: #3b505a; color: #fff; box-shadow: none; }

.nb-opt.is-selected::after { background: linear-gradient(160deg, #ffffff 0%, rgba(255, 255, 255, .8) 100%); color: #5a46e6; }

/* 悩み別ガイド：白のすりガラスカード */
.nb-section.nb-guide { background: radial-gradient(60% 50% at 10% 0%,rgba(190,175,255,.6) 0%,rgba(190,175,255,0) 70%),radial-gradient(55% 55% at 95% 25%,rgba(150,225,225,.6) 0%,rgba(150,225,225,0) 70%),radial-gradient(60% 60% at 70% 100%,rgba(255,190,200,.65) 0%,rgba(255,190,200,0) 70%),#ece8f3 !important; }
.nb-guide-choice { background: linear-gradient(160deg, rgba(255, 255, 255, .72) 0%, rgba(255, 255, 255, .45) 100%); border: 1px solid rgba(255, 255, 255, .9); border-radius: 28px; padding: 32px;
	box-shadow: 0 18px 40px rgba(110, 90, 160, .16), inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -6px 14px rgba(190, 180, 225, .18);
	-webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); transition: transform .3s cubic-bezier(.3, 1.5, .5, 1), box-shadow .3s ease; }
.nb-guide-choice:hover { transform: translateY(-4px); box-shadow: 0 24px 48px rgba(110, 90, 160, .22), inset 0 1px 0 #fff, inset 0 -6px 14px rgba(190, 180, 225, .22); border: 1px solid rgba(255, 255, 255, .95); }
.nb-guide-choice .nb-guide__to { border-top: 1px solid rgba(58, 53, 86, .15); }
.nb-guide-choice__num, .nb-guide-choice__icon { color: #6a6590; }
@media (prefers-reduced-motion: reduce) { .nb-guide-choice { transition: none; } .nb-guide-choice:hover { transform: none; } }

/* 3.0.7 glass guide / reviews / last CTA */
.nb-section.nb-guide, .nb-section.nb-reviews, .nb-lastcta { background: radial-gradient(60% 50% at 10% 0%,rgba(190,175,255,.6) 0%,rgba(190,175,255,0) 70%),radial-gradient(55% 55% at 95% 25%,rgba(150,225,225,.6) 0%,rgba(150,225,225,0) 70%),radial-gradient(60% 60% at 70% 100%,rgba(255,190,200,.65) 0%,rgba(255,190,200,0) 70%),#ece8f3 !important; }
.nb-guide-choice, .nb-review, .nb-lastcta .nb-wrap { position: relative; background: linear-gradient(160deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.45) 100%); border: 1px solid rgba(255,255,255,.9); border-radius: 28px;
 box-shadow: 0 18px 40px rgba(110,90,160,.16), inset 0 1px 0 rgba(255,255,255,.95), inset 0 -6px 14px rgba(190,180,225,.18); -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); }
.nb-guide-choice, .nb-review { padding: 32px; overflow: visible; }
.nb-guide-choice:before { display: none; }
.nb-guide-choice:hover { transform: translateY(-4px); box-shadow: 0 24px 48px rgba(110,90,160,.22), inset 0 1px 0 #fff, inset 0 -6px 14px rgba(190,180,225,.22); border: 1px solid rgba(255,255,255,.95); }
.nb-guide-choice .nb-guide__to { border-top: 1px solid rgba(58,53,86,.15); }
.nb-guide-choice__num, .nb-guide-choice__icon { color: #6a6590; }
.nb-review__text { color: #202f3b; }
.nb-review__attr { color: #58737e; }
.nb-review-filter button { border-radius: 999px; border: 1px solid rgba(255,255,255,.9); background: rgba(255,255,255,.6); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: #3b505a; }
.nb-review-filter button.is-active { background: linear-gradient(160deg,#a99cf0,#8576e0); border-color: transparent; color: #fff; }
.nb-lastcta .nb-wrap { padding: 72px 32px; display: flex; flex-direction: column; align-items: center; gap: 24px; border-radius: 40px; }
.nb-lastcta .nb-wrap > * { margin: 0; }
.nb-lastcta h2 { color: #202f3b; }
.nb-lastcta p { color: #58737e; }
.nb-lastcta .nb-btn { background: #3b505a; color: #fff !important; border-color: #3b505a; }

/* 3.0.7 glass last CTA button */
.nb-lastcta .nb-btn { position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.55); border-radius: 999px; padding-left: 56px; padding-right: 56px;
 background: linear-gradient(160deg, rgba(170,150,245,.92), rgba(120,100,225,.82)); color: #fff !important;
 box-shadow: 0 14px 28px rgba(110,90,200,.35), inset 0 2px 0 rgba(255,255,255,.7), inset 0 -8px 16px rgba(60,40,160,.28);
 -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); transition: transform .25s, box-shadow .25s; }
.nb-lastcta .nb-btn:before { content: ""; position: absolute; left: 6%; right: 6%; top: 2px; height: 46%; border-radius: 999px; background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0)); pointer-events: none; }
.nb-lastcta .nb-btn:hover { transform: translateY(-2px); box-shadow: 0 20px 34px rgba(110,90,200,.45), inset 0 2px 0 rgba(255,255,255,.8), inset 0 -8px 16px rgba(60,40,160,.3); }

/* 3.0.7 liquid glass primary buttons (all) */
.nb-btn:not(.nb-btn--disabled):not(.nb-btn--hero) { position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.55); border-radius: 999px;
 background: linear-gradient(160deg, rgba(170,150,245,.92), rgba(120,100,225,.82)); color: #fff !important;
 box-shadow: 0 14px 28px rgba(110,90,200,.35), inset 0 2px 0 rgba(255,255,255,.7), inset 0 -8px 16px rgba(60,40,160,.28);
 -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); transition: transform .25s, box-shadow .25s; }
.nb-btn:not(.nb-btn--disabled):not(.nb-btn--hero):before { content: ""; position: absolute; left: 6%; right: 6%; top: 2px; height: 46%; border-radius: 999px; background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0)); pointer-events: none; }
.nb-btn:not(.nb-btn--disabled):not(.nb-btn--hero):hover { background: linear-gradient(160deg, rgba(170,150,245,.92), rgba(120,100,225,.82)); border-color: rgba(255,255,255,.7); transform: translateY(-2px); box-shadow: 0 20px 34px rgba(110,90,200,.45), inset 0 2px 0 rgba(255,255,255,.8), inset 0 -8px 16px rgba(60,40,160,.3); }

/* 3.0.12 ヒーロー固定背景：スクロールで各セクションが重なり上がる（セクション間はヒーローの静止画が見える） */
html { background: #202f3b; }
body.nblp { background: transparent; }
.nbh { min-height: 100vh; min-height: 100svh; background: transparent; overflow: visible; }
.nbh__media { position: fixed; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 0%; }
.nbh__veil { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.nbh__in { z-index: 1; min-height: 100vh; min-height: 100svh; }
.nb-pr { position: relative; z-index: 3; }
.nb-header { z-index: 50; }
main > section:not(.nbh) { position: relative; z-index: 2; width: calc(100% - 48px); max-width: 1440px; margin: 0 auto 48px; border-radius: 40px; overflow: hidden; }
main > section.nb-lastcta { background: transparent !important; }
.nb-footer { position: relative; z-index: 2; }
@media (max-width: 860px) {
	.nbh, .nbh__in { min-height: 100vh; min-height: 100svh; }
	.nbh__media { object-position: 58% 0%; }
	main > section:not(.nbh) { width: calc(100% - 24px); margin-bottom: 24px; border-radius: 28px; }
}

/* 3.0.13 口コミ：注意書き・お悩み傾向 */
.nb-review__note { font-size: 11px; line-height: 1.7; color: #58737e; margin: 0; }
.nb-sechead .nb-review__note { font-size: 12px; margin-top: 8px; }
.nb-review__concern { font-size: 12px; font-weight: 600; color: #6a6590; margin: 0; }
.nb-review__text { line-height: 1.9; }

/* 3.0.14 空セクション対策 */
main > section:not(.nbh):empty, .nb-article:empty { display: none; }

/* 3.0.14 方針をフッターへ移動 */
.nb-footer__policy { margin: 40px 0 8px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.2); }
.nb-footer__policy h2 { color: #fff; font-size: 16px; margin: 0 0 12px; }
.nb-footer__policy .nb-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.nb-footer__policy .nb-check li { color: rgba(255,255,255,.82); font-size: 13px; line-height: 1.8; padding-left: 22px; position: relative; border: 0; }
.nb-footer__policy .nb-check li:before { content: "✓"; position: absolute; left: 0; color: #fff; }

/* 3.0.15 診断：2カラム＋選択を保持して「次へ」で進む */
.nb-diag .nb-wrap { max-width: 1200px; }
.nb-diag__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: start; }
.nb-diag__head { margin: 0; }
.nb-diag__head h2 { font-size: clamp(28px, 3.2vw, 44px); line-height: 1.25; }
.nb-quiz { padding: 32px; border-radius: 0; }
.nb-quiz__top { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.nb-quiz__count { margin: 0; }
.nb-quiz__seg { display: flex; gap: 4px; flex: 0 0 150px; }
.nb-quiz__seg span { flex: 1; height: 2px; background: rgba(58, 53, 86, .18); }
.nb-quiz__seg span.on { background: #3a3556; }
.nb-quiz__q { margin: 24px 0 20px; }
.nb-quiz__opts { gap: 12px; }
.nb-opt { min-height: 54px; padding: 8px 10px 8px 26px; font-size: 15px; }
.nb-opt::after { width: 34px; height: 34px; font-size: 18px; }
.nb-quiz__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 24px; }
.nb-quiz__meta { font-size: 12px; color: #58737e; display: inline-flex; align-items: center; gap: 12px; }
.nb-quiz__meta .nb-quiz__back { margin: 0; padding: 0; font-size: 12px; color: #58737e; text-decoration: underline; background: none; border: 0; cursor: pointer; }
.nb-quiz__next { position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.55); border-radius: 999px; padding: 14px 32px; font-size: 13px; letter-spacing: .12em; color: #fff; cursor: pointer; font-family: inherit;
 background: linear-gradient(160deg, rgba(170,150,245,.92), rgba(120,100,225,.82));
 box-shadow: 0 14px 28px rgba(110,90,200,.35), inset 0 2px 0 rgba(255,255,255,.7), inset 0 -8px 16px rgba(60,40,160,.28);
 -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); transition: transform .25s, box-shadow .25s, opacity .25s; }
.nb-quiz__next:hover:not(:disabled) { transform: translateY(-2px); }
.nb-quiz__next:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
@media (max-width: 860px) { .nb-diag__grid { grid-template-columns: 1fr; gap: 28px; } .nb-quiz { padding: 24px 18px; } }

/* 3.0.16 4ステップのリンク */
.nb-flow__link { cursor: pointer; outline: none; transition: filter .25s; }
.nb-flow__link:hover, .nb-flow__link:focus-visible { filter: brightness(1.07) drop-shadow(0 6px 10px rgba(90, 70, 200, .25)); }
.nb-flow__link:hover text:nth-of-type(3), .nb-flow__link:focus-visible text:nth-of-type(3) { text-decoration: underline; }

/* 3.0.18 ページ内移動のフェード幕 */
.nb-veil { position: fixed; inset: 0; z-index: 90; pointer-events: none; opacity: 0; transition: opacity .5s cubic-bezier(.4, 0, .2, 1);
 background: radial-gradient(60% 50% at 20% 10%, rgba(190,175,255,.55), rgba(190,175,255,0) 70%), radial-gradient(60% 60% at 85% 90%, rgba(255,190,200,.5), rgba(255,190,200,0) 70%), rgba(246,243,250,.86);
 -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.nb-veil.is-on { opacity: 1; }

/* 3.0.19 スマホ：4ステップを4段のボタンで表示 */
.nb-flow__list { display: none; }
@media (max-width: 860px) {
	.nb-flow__svg { display: none; }
	.nb-flow__list { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
	.nb-flow__card { --c1: #9a8dff; --c2: #5a46e6; --ink: #2d2a8f; position: relative; overflow: hidden; display: flex; align-items: center; gap: 18px; padding: 16px 18px 16px 16px; min-height: 92px; border-radius: 999px; text-decoration: none;
		background: linear-gradient(160deg, rgba(255,255,255,.8), rgba(255,255,255,.45)); border: 1px solid rgba(255,255,255,.95);
		box-shadow: 0 14px 28px rgba(110,90,160,.18), inset 0 2px 0 rgba(255,255,255,.9), inset 0 -8px 16px rgba(190,180,225,.25);
		-webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); transition: transform .25s; }
	.nb-flow__card:active { transform: scale(.98); }
	.nb-flow__card--t { --c1: #6fd0c4; --c2: #2f8f90; --ink: #1d6a6c; }
	.nb-flow__card--r { --c1: #f28aa8; --c2: #c93560; --ink: #a01c48; }
	.nb-flow__card--b { --c1: #7fa6ff; --c2: #3562e0; --ink: #1f3fa8; }
	.nb-flow__no { flex: none; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 24px; font-weight: 600; color: var(--ink); letter-spacing: 0;
		background: radial-gradient(circle at 50% 45%, #fff 0 52%, transparent 53%), linear-gradient(160deg, var(--c1), var(--c2)); box-shadow: 0 8px 16px rgba(90,70,200,.28), inset 0 2px 0 rgba(255,255,255,.6); }
	.nb-flow__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
	.nb-flow__txt small { font-size: 11px; letter-spacing: .22em; font-weight: 600; color: var(--c2); }
	.nb-flow__txt b { font-size: 20px; font-weight: 600; color: #2d2850; line-height: 1.3; }
	.nb-flow__txt em { font-style: normal; font-size: 13px; color: #6a6590; line-height: 1.5; }
	.nb-flow__arrow { flex: none; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-size: 22px; padding-bottom: 3px; background: linear-gradient(160deg, var(--c1), var(--c2)); }
	.nb-flow .nb-wrap { padding-left: 16px; padding-right: 16px; }
}

/* 3.0.21 4STEPS 見出し */
.nb-flow__head { margin: 0 0 40px; }
.nb-flow__head .nb-eyebrow { color: #6a6590; }
.nb-flow__head h2 { color: #2d2850; font-size: clamp(26px, 3vw, 40px); line-height: 1.3; }
.nb-flow__head p:last-child { color: #6a6590; max-width: 560px; }
@media (max-width: 860px) { .nb-flow__head { margin-bottom: 24px; } }

/* 3.0.22 選択時に紫にならない問題の修正：lp.css の .nb-opt:hover / .is-selected の background 指定に勝つ */
.nb-quiz .nb-opt,
.nb-quiz .nb-opt:hover,
.nb-quiz .nb-opt:focus-visible,
.nb-quiz .nb-opt.is-selected { background: linear-gradient(180deg, var(--ga) 0%, var(--gb) 100%); border-color: rgba(255, 255, 255, .95); }
.nb-quiz .nb-opt.is-selected {
	--ga: rgba(176, 160, 255, .96); --gb: rgba(98, 74, 232, .98); --gg: rgba(100, 78, 230, .5); --gs: rgba(50, 30, 160, .45);
	color: #fff; text-shadow: 0 1px 2px rgba(30, 20, 90, .35); border-color: rgba(255, 255, 255, .65); transform: translateY(-2px);
}
.nb-quiz .nb-opt.is-selected::after { background: linear-gradient(160deg, #ffffff 0%, rgba(255, 255, 255, .8) 100%); color: #5a46e6; }

/* 3.0.23 基礎知識（選び方ガイド）・お得情報をガラス風に */
.nb-section.xt-guide, .xt-deals, .nb-section.xt-deals { background: radial-gradient(60% 50% at 10% 0%, rgba(190,175,255,.6) 0%, rgba(190,175,255,0) 70%), radial-gradient(55% 55% at 95% 25%, rgba(150,225,225,.6) 0%, rgba(150,225,225,0) 70%), radial-gradient(60% 60% at 70% 100%, rgba(255,190,200,.65) 0%, rgba(255,190,200,0) 70%), #ece8f3 !important; }
.xt-point, .xt-flow__item, .xt-box, .xt-box--warn, .xt-deal {
	background: linear-gradient(160deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.45) 100%); border: 1px solid rgba(255,255,255,.9); border-radius: 28px;
	box-shadow: 0 18px 40px rgba(110,90,160,.16), inset 0 1px 0 rgba(255,255,255,.95), inset 0 -6px 14px rgba(190,180,225,.18);
	-webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%);
}
.xt-point { padding: 22px 26px; }
.xt-flow__item { padding: 22px 22px 20px; }
.xt-box { padding: 28px 30px; }
.xt-deal { padding: 28px 28px 24px; border-top: 1px solid rgba(255,255,255,.9); }
.xt-point__no { border-radius: 50%; width: 40px; height: 40px; flex: 0 0 40px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600;
	background: linear-gradient(160deg, #a99cf0, #6a58e0); box-shadow: 0 8px 16px rgba(90,70,200,.3), inset 0 2px 0 rgba(255,255,255,.55); }
.xt-flow__no { color: #6a58e0; letter-spacing: .2em; }
.xt-sub { color: #2d2850; font-weight: 600; }
.xt-point h4, .xt-flow__item h4, .xt-box h3, .xt-deal h3 { color: #2d2850; }
.xt-point p, .xt-flow__item p, .xt-box dd, .xt-box li { color: #4a4560; }
.xt-box dt { color: #2d2850; }
.xt-deal__list li { border-bottom-color: rgba(58,53,86,.12); }
.xt-deal__list li::before { color: #6a58e0; }
