/* 恋愛偏差値（2026-08-11）— MBTI診断・ビッグ5診断の結果画面と、説明ブロックで共通。
   流入の大半がモバイルなので320pxで成立する形を基準にする。PC装飾は最後のmedia queryに隔離。 */

/* ==========================================================================
   結果画面の恋愛偏差値
   ========================================================================== */
.msrh{
	--rh:#8b6cc1;
	position:relative;
	margin:26px 0 30px;
	padding:0 0 22px;
	border-radius:24px;
	background:#fff;
	border:2px solid #ece0f2;
	box-shadow:0 14px 38px rgba(120,70,150,.16);
	overflow:hidden;
	text-align:center;
}

/* ── 見出し。成績表の表紙のように、濃い帯で始める ── */
.msrh__head{
	position:relative;
	padding:20px 16px 18px;
	background:linear-gradient(140deg,#3a2456 0%,#5b2d5c 55%,#7a3357 100%);
	color:#fff;
	overflow:hidden;
}
.msrh__head::before{
	content:'';position:absolute;inset:0;
	background:
		repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 26px),
		repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 26px);
	pointer-events:none;
}
.msrh__head>*{position:relative;}
.msrh__eyebrow{
	margin:0 0 4px;font-size:10.5px;font-weight:900;letter-spacing:.22em;
	color:#e9c4dd;
}
.msrh__title{
	margin:0 0 6px;font-size:26px;font-weight:900;letter-spacing:.04em;line-height:1.25;
}
.msrh__sub{margin:0;font-size:12px;line-height:1.75;color:#ddc9e4;}
.msrh__sub b{color:#fff;font-weight:900;}

/* ── 数字。ここが主役 ── */
.msrh__hero{
	display:flex;align-items:center;justify-content:center;gap:16px;
	padding:20px 16px 4px;
}
.msrh__num b{
	display:block;
	font-size:82px;font-weight:900;letter-spacing:-.04em;line-height:.9;
	color:var(--rh);
	font-variant-numeric:tabular-nums;
	text-shadow:0 6px 22px rgba(0,0,0,.12);
}
.msrh__meta{display:flex;flex-direction:column;align-items:flex-start;gap:7px;}
.msrh__badge{
	display:inline-block;padding:6px 14px;border-radius:999px;
	background:var(--rh);color:#fff;font-size:12.5px;font-weight:900;
	box-shadow:0 4px 14px rgba(0,0,0,.16);white-space:nowrap;
}
.msrh__top{
	font-size:12px;font-weight:700;color:#7a6478;white-space:nowrap;
}
.msrh__top b{font-size:17px;font-weight:900;color:#4b2a5c;font-variant-numeric:tabular-nums;}

/* ── 分布 ── */
.msrh__curve{padding:4px 8px 0;}
.msrh__note{
	margin:6px auto 0;max-width:30em;padding:0 16px;
	font-size:13.5px;line-height:1.85;color:#4a3a48;
}
.msrh__base{
	margin:8px 0 0;padding:0 16px;font-size:11px;line-height:1.7;color:#9c8a99;
}
.msrh__base b{color:#7a6478;}

/* ── 見出し（本文側） ── */
.msrh__h3{
	margin:26px 16px 2px;font-size:15px;font-weight:900;color:#4b2a5c;
	padding-bottom:7px;border-bottom:2px solid #f0e6f6;text-align:left;
}
.msrh__h3note{margin:7px 16px 12px;font-size:11.5px;line-height:1.7;color:#93849a;text-align:left;}

/* ── 型（ここが本体） ── */
.msrh__type{
	margin:20px 16px 0;padding:18px 15px 16px;
	background:linear-gradient(180deg,#fbf6ff,#fff);
	border:2px solid #ead9f2;border-radius:18px;
	text-align:left;
}
.msrh__type-tag{
	display:inline-block;padding:3px 11px;border-radius:999px;
	background:var(--rh);color:#fff;font-size:10.5px;font-weight:900;letter-spacing:.08em;
}
.msrh__type-name{
	margin:9px 0 2px;font-size:23px;font-weight:900;color:#3f2350;line-height:1.32;
}
.msrh__type-lead{margin:0 0 11px;font-size:12.5px;font-weight:800;color:#a17bb8;}
.msrh__type-body{margin:0;font-size:14px;line-height:1.95;color:#3c3145;}
.msrh__type-body b{
	color:#b8367a;font-weight:900;
	background:linear-gradient(transparent 62%,rgba(255,190,220,.6) 62%);
}

.msrh__quad{padding:0 10px;}

/* ── 5軸 ── */
.msrh__axes{
	margin:0 16px;padding:0;list-style:none;
	display:grid;gap:9px;text-align:left;
}
.msrh__axis{
	background:#fff;border:1.5px solid #eee0f0;border-radius:14px;padding:11px 13px 10px;
}
.msrh__axis.is-hi{border-color:#e6c4dd;background:linear-gradient(180deg,#fffafd,#fff);}
.msrh__axis.is-lo{border-color:#d6e2ee;background:linear-gradient(180deg,#f9fcff,#fff);}
.msrh__axis-head{
	display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:0 0 7px;
}
.msrh__axis-head b{font-size:13.5px;font-weight:900;color:#3f2350;}
.msrh__axis-head span{
	font-size:19px;font-weight:900;color:var(--rh);line-height:1;
	font-variant-numeric:tabular-nums;
}
.msrh__axis-bar{
	position:relative;height:8px;border-radius:99px;background:#f2e9f6;overflow:hidden;
}
.msrh__axis-bar i{
	display:block;height:100%;border-radius:99px;
	background:linear-gradient(90deg,#d98cc0,#8b5aa8);
	transition:width .9s cubic-bezier(.2,.7,.3,1);
}
/* 平均（偏差値50）の位置に目印を置く。基準が無いとバーの長さに意味が出ない */
.msrh__axis-bar u{
	position:absolute;top:-2px;bottom:-2px;left:50%;width:2px;
	background:rgba(75,42,92,.35);text-decoration:none;
}
.msrh__axis-note{
	margin:6px 0 0;font-size:11.5px;line-height:1.6;color:#93849a;
	display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.msrh__axis-note em{
	flex:0 0 auto;font-style:normal;font-size:10px;font-weight:800;color:#b6a6cc;
	background:#f7f2fa;border-radius:6px;padding:2px 7px;
}

/* ── 主導権。何の判定かを上に置く（値だけだと文脈が切れる） ── */
.msrh__agency{
	display:flex;flex-direction:column;align-items:center;gap:4px;
	margin:16px 16px 0;padding:14px 16px 15px;border-radius:14px;
	background:linear-gradient(135deg,#3f2350,#7a3f74);color:#fff;text-align:center;
}
.msrh__agency-lab{
	font-size:10.5px;font-weight:900;letter-spacing:.14em;color:#d3b6dd;
}
.msrh__agency b{font-size:19px;font-weight:900;line-height:1.35;}
.msrh__agency-note{font-size:12.5px;color:#e6d2ea;}

/* ── 根拠 ── */
.msrh__src{
	margin:16px 16px 0;padding:0;text-align:left;
	background:#faf8fc;border:1px solid #ece2f2;border-radius:12px;
}
.msrh__src summary{
	cursor:pointer;list-style:none;padding:12px 14px;
	font-size:12.5px;font-weight:900;color:#6b4b80;
}
.msrh__src summary::-webkit-details-marker{display:none;}
.msrh__src summary::after{content:'　＋';color:#b6a6cc;}
.msrh__src[open] summary::after{content:'　−';}
.msrh__src p{
	margin:0 14px 12px;font-size:12px;line-height:1.95;color:#5a4d63;
}
.msrh__src-note{color:#93849a !important;font-size:11.5px !important;}

@media (min-width:640px){
	.msrh__title{font-size:30px;}
	.msrh__num b{font-size:104px;}
	.msrh__axes{grid-template-columns:1fr 1fr;}
	.msrh__axis:nth-child(5){grid-column:1 / -1;}
	.msrh__head,.msrh__hero{padding-left:28px;padding-right:28px;}
	.msrh__h3,.msrh__h3note,.msrh__type,.msrh__axes,.msrh__agency,.msrh__src{margin-left:28px;margin-right:28px;}
}

/* ==========================================================================
   説明ブロック（TOP・診断前）
   ========================================================================== */
.msrhx{
	margin:30px 0;padding:24px 16px 26px;
	background:linear-gradient(180deg,#fbf7ff,#fff);
	border:2px solid #e8dcf2;border-radius:22px;
}
.msrhx__eyebrow{
	margin:0 0 5px;font-size:10.5px;font-weight:900;letter-spacing:.2em;
	color:#a17bb8;text-align:center;
}
.msrhx__title{
	margin:0 0 12px;font-size:21px;font-weight:900;line-height:1.45;color:#3f2350;text-align:center;
}
.msrhx__title b{
	color:#b8367a;
	background:linear-gradient(transparent 60%,rgba(255,190,220,.55) 60%);
}
.msrhx__lead{
	margin:0 auto 20px;max-width:34em;font-size:13.5px;line-height:1.95;color:#4a3f55;
}
.msrhx__lead b{color:#3f2350;font-weight:900;}

/* 掛け算の図。ここが一番伝わる */
.msrhx__eq{
	display:grid;gap:8px;align-items:stretch;justify-items:stretch;
	margin:0 0 20px;
}
.msrhx__eq-box{
	background:#fff;border:2px solid #e8dcf2;border-radius:16px;padding:13px 14px;text-align:center;
}
.msrhx__eq-box[data-a="3"]{
	border-color:#e6b7d2;background:linear-gradient(160deg,#fff6fb,#fff);
	box-shadow:0 8px 22px rgba(192,65,138,.14);
}
.msrhx__eq-box b{display:block;font-size:16px;font-weight:900;color:#3f2350;line-height:1.4;}
.msrhx__eq-box span{
	display:inline-block;margin:5px 0 6px;font-size:10.5px;font-weight:900;letter-spacing:.06em;
	color:#8b5aa8;background:#f4ecfa;border-radius:999px;padding:3px 10px;
}
.msrhx__eq-box[data-a="3"] span{color:#b8367a;background:#fdeef6;}
.msrhx__eq-box i{display:block;font-style:normal;font-size:12px;line-height:1.7;color:#7a6a86;}
.msrhx__eq-op{
	display:block;text-align:center;font-size:19px;font-weight:900;color:#c7b2d8;line-height:1;
}

/* 具体例。抽象論だけだと読み飛ばされる */
.msrhx__case{
	margin:0 0 20px;padding:15px 14px 13px;
	background:#fff;border:1.5px solid #ece0f2;border-radius:16px;
}
.msrhx__case-h{
	margin:0 0 11px;font-size:13.5px;font-weight:900;color:#3f2350;
}
.msrhx__case-list{margin:0;padding:0;list-style:none;display:grid;gap:8px;}
.msrhx__case-list li{
	display:grid;grid-template-columns:auto 1fr;gap:4px;
	padding:10px 12px;border-radius:11px;background:#f8f5fb;
}
.msrhx__case-list li b{
	grid-column:1 / -1;font-size:11.5px;font-weight:900;color:#8b7f9d;letter-spacing:.04em;
}
.msrhx__case-list li span{
	grid-column:1 / -1;font-size:12.5px;line-height:1.85;color:#5a4d63;
}
.msrhx__case-list li[data-hit="1"]{
	background:linear-gradient(160deg,#fff3f9,#fff);border:1.5px solid #e6b7d2;
}
.msrhx__case-list li[data-hit="1"] b{color:#b8367a;}
.msrhx__case-list li[data-hit="1"] span{color:#3c3145;}
.msrhx__case-list em{
	font-style:normal;font-weight:900;color:#b8367a;
	background:linear-gradient(transparent 62%,rgba(255,190,220,.6) 62%);
}

/* 何をどこから測っているか。
   3列の表はモバイルで1〜2文字ずつ折り返して読めなくなるので、
   狭い画面では表をやめて縦積みのカードにする（既定）。 */
.msrhx__tbl{width:100%;border-collapse:collapse;font-size:13px;display:block;}
.msrhx__tbl thead{display:none;}
.msrhx__tbl tbody{display:grid;gap:9px;}
.msrhx__tbl tr{
	display:block;background:#fff;border:1.5px solid #ece0f2;border-radius:14px;padding:13px 14px;
}
.msrhx__tbl th[scope="row"]{
	display:block;font-weight:900;color:#3f2350;text-align:left;font-size:14.5px;
	padding:0 0 3px;border:0;
}
.msrhx__tbl td{display:block;padding:0;border:0;color:#5a4d63;line-height:1.85;}
.msrhx__from{
	color:#93849a;font-size:11.5px;line-height:1.7;
	padding:0 0 7px !important;margin:0 0 7px;border-bottom:1px dashed #ece0f2 !important;
}
.msrhx__tbl td i{
	display:block;margin-top:5px;font-style:normal;font-size:11.5px;color:#93849a;
	padding-left:11px;border-left:3px solid #f0e6f6;
}

.msrhx__note{
	margin:14px 0 0;padding:12px 13px;border-radius:12px;background:#f7f3fa;
	font-size:11.5px;line-height:1.9;color:#6b5f78;
}
.msrhx__note b{color:#4b2a5c;font-weight:900;}
.msrhx__cta{margin:18px 0 0;text-align:center;}
.msrhx__cta a{
	display:inline-block;padding:14px 30px;border-radius:999px;text-decoration:none;
	background:linear-gradient(135deg,#8b6cc1,#d65c9a);color:#fff;
	font-size:14.5px;font-weight:900;box-shadow:0 8px 22px rgba(192,65,138,.28);
}

@media (min-width:700px){
	.msrhx{padding:30px 28px 32px;}
	.msrhx__title{font-size:25px;}
	.msrhx__eq{grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;}
	.msrhx__eq-op{font-size:22px;}
	.msrhx__case-list{grid-template-columns:repeat(3,1fr);}
	/* 横幅が取れる画面では表に戻す。並べて比べられるほうが早い */
	.msrhx__tbl{display:table;border-collapse:separate;border-spacing:0 7px;}
	.msrhx__tbl thead{display:table-header-group;}
	.msrhx__tbl thead th{
		font-size:10.5px;font-weight:900;letter-spacing:.08em;color:#a495b0;
		text-align:left;padding:0 12px 2px;border:0;
	}
	.msrhx__tbl tbody{display:table-row-group;}
	.msrhx__tbl tr{display:table-row;background:#fff;border:0;border-radius:0;padding:0;}
	.msrhx__tbl th[scope="row"]{
		display:table-cell;vertical-align:top;white-space:nowrap;font-size:13.5px;
		padding:13px 12px;border-radius:12px 0 0 12px;
		border:1.5px solid #ece0f2;border-right:0;
	}
	.msrhx__tbl td{
		display:table-cell;vertical-align:top;padding:13px 12px;
		border-top:1.5px solid #ece0f2;border-bottom:1.5px solid #ece0f2;
	}
	.msrhx__tbl td:last-child{border-right:1.5px solid #ece0f2;border-radius:0 12px 12px 0;}
	.msrhx__from{width:34%;border-bottom:1.5px solid #ece0f2 !important;padding:13px 12px !important;margin:0;}
	.msrhx__tbl td i{padding-left:0;border-left:0;}
}

/* ==========================================================================
   シェアリンクから来た人に見せる小さい枠
   ========================================================================== */
.msrht{
	--rh:#8b6cc1;
	margin:22px 0 26px;padding:20px 16px 18px;border-radius:20px;text-align:center;
	background:linear-gradient(160deg,#faf6ff,#fff);
	border:2px solid #e8dcf2;box-shadow:0 10px 28px rgba(120,70,150,.12);
}
.msrht__eyebrow{margin:0 0 2px;font-size:11px;font-weight:800;letter-spacing:.1em;color:#a17bb8;}
.msrht__title{margin:0 0 12px;font-size:19px;font-weight:900;color:#3f2350;letter-spacing:.04em;}
.msrht__row{display:flex;align-items:center;justify-content:center;gap:14px;}
.msrht__row b{
	font-size:60px;font-weight:900;line-height:.9;color:var(--rh);
	letter-spacing:-.03em;font-variant-numeric:tabular-nums;
}
.msrht__row span{
	display:flex;flex-direction:column;align-items:flex-start;gap:5px;
	font-size:13px;font-weight:900;color:#4b2a5c;
}
.msrht__row i{font-style:normal;font-size:11.5px;font-weight:700;color:#93849a;}
.msrht__type{margin:12px 0 0;font-size:13px;color:#5a4d63;}
.msrht__type b{color:#3f2350;font-weight:900;}
.msrht__lead{
	margin:10px auto 0;max-width:28em;font-size:12.5px;line-height:1.9;color:#6b5f78;
}
.msrht__cta{margin:14px 0 0;}
.msrht__cta a{
	display:inline-block;padding:13px 28px;border-radius:999px;text-decoration:none;
	background:linear-gradient(135deg,#8b6cc1,#d65c9a);color:#fff;
	font-size:14px;font-weight:900;box-shadow:0 8px 20px rgba(192,65,138,.26);
}

/* ==========================================================================
   恋愛偏差値の下に置く、型別の恋愛分析（冒頭のみ／続きは有料レポート）
   ========================================================================== */
.msrhd{
	margin:20px 16px 0;padding:18px 15px 14px;text-align:left;
	background:linear-gradient(180deg,#fffafc,#fff);
	border:2px solid #f0dde8;border-radius:18px;
}
.msrhd__eyebrow{
	margin:0 0 8px;font-size:10.5px;font-weight:900;letter-spacing:.12em;color:#c07aa4;
}
.msrhd__lead{
	margin:0 0 16px;font-size:15px;font-weight:900;line-height:1.75;color:#3f2350;
	padding-bottom:14px;border-bottom:2px solid #f6ecf1;
}
.msrhd__h{
	margin:18px 0 6px;font-size:13.5px;font-weight:900;color:#b8367a;
	display:flex;align-items:center;gap:7px;
}
.msrhd__h::before{
	content:'';flex:0 0 auto;width:4px;height:15px;border-radius:2px;
	background:linear-gradient(180deg,#d98cc0,#8b5aa8);
}
.msrhd__p{margin:0;font-size:13.5px;line-height:2;color:#3c3145;}
.msrhd__p b{
	color:#b8367a;font-weight:900;
	background:linear-gradient(transparent 62%,rgba(255,190,220,.55) 62%);
}

@media (min-width:640px){
	.msrhd{margin-left:28px;margin-right:28px;padding:22px 20px 18px;}
}

/* ==========================================================================
   プレミアムレポートの恋愛偏差値（第2章の冒頭）
   ========================================================================== */
.pr-rh{
	margin:0 0 22px;padding:18px 16px 16px;border-radius:16px;
	background:linear-gradient(160deg,#fdf4f9,#fff);
	border:2px solid #eed6e4;
}
.pr-rh__top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.pr-rh__lab{font-size:11.5px;font-weight:900;letter-spacing:.1em;color:#a17bb8;}
.pr-rh__num{
	font-size:54px;font-weight:900;line-height:.9;color:#b8367a;letter-spacing:-.03em;
	font-variant-numeric:tabular-nums;
}
.pr-rh__band{
	display:flex;flex-direction:column;gap:3px;font-size:13px;font-weight:900;color:#4b2a5c;
}
.pr-rh__band i{font-style:normal;font-size:11px;font-weight:700;color:#93849a;}
.pr-rh__type{
	display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
	margin:12px 0 0;padding:10px 12px;border-radius:11px;background:#fff;
	border:1.5px solid #f0e2ea;
}
.pr-rh__type span{font-size:10.5px;font-weight:900;color:#a17bb8;letter-spacing:.06em;}
.pr-rh__type b{font-size:18px;font-weight:900;color:#3f2350;}
.pr-rh__type i{font-style:normal;font-size:12px;color:#8b7f9d;}
.pr-rh__axes{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:6px;}
.pr-rh__axes li{display:grid;grid-template-columns:7.5em 2.4em 1fr;align-items:center;gap:8px;}
.pr-rh__axes span{font-size:12px;font-weight:800;color:#4b2a5c;}
.pr-rh__axes b{
	font-size:14px;font-weight:900;color:#b8367a;text-align:right;
	font-variant-numeric:tabular-nums;
}
.pr-rh__axes u{
	position:relative;display:block;height:7px;border-radius:99px;background:#f4e8ef;
	text-decoration:none;overflow:hidden;
}
.pr-rh__axes u i{
	display:block;height:100%;border-radius:99px;
	background:linear-gradient(90deg,#d98cc0,#8b5aa8);
}
.pr-rh__body{margin:14px 0 0;font-size:13.5px;line-height:2;color:#3c3145;}
.pr-rh__body b{color:#b8367a;font-weight:900;}

/* 性格の因子ぶんの補正 */
.msrh__adj{
	margin:10px 16px 0;padding:9px 12px;border-radius:10px;
	background:#f7f3fa;border:1px dashed #ddd0e6;
	font-size:11.5px;line-height:1.7;color:#6b5f78;text-align:center;
}
.msrh__adj b{color:#b8367a;font-weight:900;font-variant-numeric:tabular-nums;}
@media (min-width:640px){ .msrh__adj{margin-left:28px;margin-right:28px;} }

/* MBTI × 立ち位置 の組み合わせ名 */
.msrh__type-combo{
	display:flex;flex-direction:column;gap:3px;
	margin:4px 0 10px;font-size:11.5px;font-weight:800;color:#a17bb8;
}
.msrh__type-combo i{font-style:normal;font-size:12px;font-weight:600;color:#8b7f9d;}