/*
 * components.css
 * 各コンポーネント。色は --akn-* の変数だけを使う。角丸・影・グラデーションは使わない。
 */

/* ------------------------------------------------------------------
 * 共通の小物
 * ------------------------------------------------------------------ */
.akn-num {
	text-align: right;
}

.akn-sp-only {
	display: none;
}

/* 項目を1かたまりにする（区切りの位置でだけ折り返す） */
.akn-nowrap {
	white-space: nowrap;
}

.akn-label {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
	letter-spacing: 0.04em;
}

.akn-note {
	font-size: var(--akn-text-sm);
	line-height: 1.8;
	color: var(--akn-muted);
}

.akn-link-accent {
	align-self: flex-start;
	font-size: var(--akn-text-md);
	color: var(--akn-accent);
	text-underline-offset: 5px;
}

/* 四角いボタン：墨ベタ */
.akn-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 28px;
	border: var(--akn-rule-thin) solid var(--akn-cta-bg);
	background: var(--akn-cta-bg);
	color: var(--akn-cta-text);
	font-family: var(--akn-font-body);
	font-size: var(--akn-text-md);
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.04em;
	text-decoration: none;
	white-space: nowrap;
}

.akn-button--outline {
	border-color: var(--akn-ink);
	background: transparent;
	color: var(--akn-ink);
}

.akn-button--inverse {
	min-height: 52px;
	border-color: var(--akn-cta-text);
	background: var(--akn-cta-text);
	color: var(--akn-cta-bg);
}

.akn-button--block {
	display: flex;
	width: 100%;
	min-height: 50px;
}

/* バッジ：1px 枠の四角 */
.akn-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	line-height: 1.6;
}

.akn-badge {
	display: inline-block;
	padding: 4px 10px;
	border: var(--akn-rule-thin) solid var(--akn-rule);
	color: var(--akn-muted);
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	line-height: 1.6;
	white-space: nowrap;
}

.akn-badge--accent {
	border-color: var(--akn-accent);
	color: var(--akn-accent);
}

.akn-badge--ink {
	border-color: var(--akn-ink);
	color: var(--akn-ink);
}

/* セクションの見出し行：見出し＋右側の補足、下に墨の細罫 */
.akn-section-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding-bottom: 14px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-ink);
}

.akn-section-head h2 {
	font-size: 26px;
	letter-spacing: var(--akn-tracking-display);
}

.akn-section-head--large h2 {
	font-size: 28px;
}

.akn-section-head__meta {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

.akn-section-head__link {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

/* 1px 墨枠の箱 */
.akn-boxed {
	border: var(--akn-rule-thin) solid var(--akn-ink);
}

.akn-boxed__head {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 20px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-ink);
	font-size: var(--akn-text-xs);
	letter-spacing: 0.08em;
}

/* パンくず */
.akn-breadcrumbs {
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	line-height: 1.6;
	color: var(--akn-muted);
}

.akn-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-breadcrumbs a {
	text-decoration: none;
}

.akn-breadcrumbs a:hover {
	text-decoration: underline;
}

.akn-breadcrumbs__sep {
	margin-inline: 0.5em;
}

/* ------------------------------------------------------------------
 * トップ：特集
 * ------------------------------------------------------------------ */
.akn-feature {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.akn-feature__label {
	font-size: var(--akn-text-sm);
	color: var(--akn-accent);
	letter-spacing: 0.08em;
}

.akn-feature__title {
	font-size: 46px;
	line-height: 1.45;
}

.akn-feature__lead {
	max-width: 34em;
	font-size: var(--akn-text-lg);
	line-height: 1.95;
}

.akn-feature__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 28px;
	padding-top: 6px;
}

.akn-feature__note {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

/* この検証でやること */
.akn-steps__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-steps__item {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) 52px;
	align-items: center;
	padding: 15px 20px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: var(--akn-text-md);
	line-height: 1.7;
}

.akn-steps__no {
	color: var(--akn-accent);
}

.akn-steps__state {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
	text-align: right;
}

.akn-steps__note {
	padding: 14px 20px;
	font-size: var(--akn-text-sm);
	line-height: 1.8;
	color: var(--akn-muted);
}

/* ------------------------------------------------------------------
 * トップ：取り扱いサービスの表
 * ------------------------------------------------------------------ */
.akn-service-table {
	table-layout: fixed;
	font-size: var(--akn-text-md);
	line-height: 1.6;
}

.akn-service-table thead th {
	padding: 12px 12px 12px 0;
}

.akn-service-table thead th:nth-child(1) { width: 25%; }
.akn-service-table thead th:nth-child(2) { width: 9%; }
.akn-service-table thead th:nth-child(3) { width: 23%; }
.akn-service-table thead th:nth-child(4) { width: 18%; }
.akn-service-table thead th:nth-child(5) { width: 11%; }
.akn-service-table thead th:nth-child(6) { width: 14%; }

.akn-service-table tbody th,
.akn-service-table tbody td {
	padding: 22px 12px 22px 0;
	vertical-align: middle;
}

.akn-service-table__name {
	font-family: var(--akn-font-display);
	font-size: 21px;
	font-weight: var(--akn-weight-display);
	line-height: 1.4;
}

.akn-service-table__price {
	font-size: 14px;
}

.akn-service-table .akn-badge {
	padding: 3px 8px;
}

.akn-service-table .akn-badge--muted {
	border-color: var(--akn-muted);
}

.akn-service-table tbody .akn-service-table__link {
	padding-right: 0;
	font-size: 14px;
	text-align: right;
}

.akn-service-table__link a {
	display: inline-flex;
	align-items: center;
	min-height: var(--akn-tap);
}

.akn-service-table__pending {
	color: var(--akn-muted);
}

/* ------------------------------------------------------------------
 * トップ：悩みから探す
 * ------------------------------------------------------------------ */
.akn-worries {
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-worries__item {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 8px;
	height: 100%;
	padding: 30px 0;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	text-decoration: none;
}

.akn-worries__no {
	font-size: 30px;
	line-height: 1.2;
	color: var(--akn-accent);
}

.akn-worries__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.akn-worries__q {
	font-family: var(--akn-font-display);
	font-size: 23px;
	font-weight: var(--akn-weight-display);
	line-height: 1.5;
}

.akn-worries__d {
	font-size: 14px;
	line-height: 1.8;
	color: var(--akn-muted);
}

/* ------------------------------------------------------------------
 * トップ：検証方法
 * ------------------------------------------------------------------ */
.akn-method {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-top: 22px;
	border-top: var(--akn-rule-thin) solid var(--akn-ink);
}

.akn-method h2 {
	font-size: 28px;
	letter-spacing: var(--akn-tracking-display);
}

.akn-method p {
	font-size: 16px;
	line-height: 1.95;
}

.akn-axes-table {
	align-self: start;
	border-top: var(--akn-rule-thin) solid var(--akn-ink);
	font-size: var(--akn-text-md);
	line-height: 1.6;
}

.akn-axes-table thead th {
	padding: 12px 0;
}

.akn-axes-table thead th.akn-num {
	width: 80px;
}

.akn-axes-table td,
.akn-axes-table tfoot th {
	padding: 13px 0;
}

.akn-axes-table tfoot th,
.akn-axes-table tfoot td {
	border-bottom: 0;
	font-weight: 700;
}

/* ------------------------------------------------------------------
 * サービスハブ：冒頭
 * ------------------------------------------------------------------ */
.akn-hub__header {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.akn-hub__title,
.akn-article__title {
	font-size: 44px;
	line-height: 1.4;
}

.akn-hub__lead {
	font-size: var(--akn-text-lg);
	line-height: 1.9;
}

/* ------------------------------------------------------------------
 * 結論ボックス
 * ------------------------------------------------------------------ */
.akn-verdict {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr) minmax(0, 1fr);
	gap: 36px;
	padding: 28px 0;
	border-top: var(--akn-rule-double) double var(--akn-ink);
	border-bottom: var(--akn-rule-double) double var(--akn-ink);
}

.akn-verdict__score {
	display: flex;
	flex-direction: column;
	gap: 6px;
	border-right: var(--akn-rule-thin) solid var(--akn-rule);
}

.akn-verdict__label {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
	letter-spacing: 0.08em;
}

.akn-verdict__total {
	font-size: 64px;
	font-weight: 500;
	line-height: 1;
}

.akn-verdict__max {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

.akn-verdict__progress {
	margin-top: 6px;
	font-size: var(--akn-text-xs);
	line-height: 1.6;
	color: var(--akn-muted);
}

.akn-verdict__col {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.akn-verdict__heading {
	font-size: 18px;
	letter-spacing: var(--akn-tracking-display);
}

.akn-verdict__list {
	padding-left: 1.2em;
	font-size: var(--akn-text-md);
	line-height: 1.9;
}

/* ------------------------------------------------------------------
 * スコアカード：5マスの升目
 * ------------------------------------------------------------------ */
.akn-scorecard__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-scorecard__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 180px 80px;
	grid-template-areas: "name scale points";
	align-items: center;
	gap: 24px;
	padding: 16px 0;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: 16px;
	line-height: 1.6;
}

.akn-scorecard__name {
	grid-area: name;
}

.akn-scorecard__weight {
	margin-left: 10px;
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

.akn-scorecard__points {
	grid-area: points;
	font-size: var(--akn-text-md);
	text-align: right;
}

.akn-scale {
	grid-area: scale;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 4px;
}

.akn-scale__cell {
	height: 12px;
	border: var(--akn-rule-thin) solid var(--akn-ink);
	background: transparent;
}

.akn-scale__cell.is-filled {
	background: var(--akn-accent);
}

/* ------------------------------------------------------------------
 * 料金表・シミュレーター・決済可否表・日本語テスト
 * ------------------------------------------------------------------ */
.akn-price,
.akn-simulator,
.akn-payment,
.akn-chat {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.akn-price__table {
	table-layout: fixed;
}

.akn-price__table thead th {
	padding: 0 0 10px;
}

.akn-price__table tbody th,
.akn-price__table tbody td {
	padding: 14px 0 18px;
	vertical-align: baseline;
}

.akn-price__name {
	font-size: 16px;
	font-weight: 700;
}

.akn-price__monthly {
	font-size: 20px;
}

.akn-price__total {
	font-size: var(--akn-text-md);
}

.akn-price__off {
	font-size: 14px;
	color: var(--akn-muted);
}

.akn-price__unit {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

/* シミュレーター */
.akn-simulator__switch {
	display: inline-flex;
	align-self: flex-start;
	border: var(--akn-rule-thin) solid var(--akn-ink);
}

.akn-simulator__option {
	min-width: 132px;
	min-height: 48px;
	padding: 0 20px;
	border: 0;
	border-right: var(--akn-rule-thin) solid var(--akn-ink);
	background: transparent;
	color: var(--akn-ink);
	font-size: var(--akn-text-md);
	font-weight: 700;
}

.akn-simulator__option:last-child {
	border-right: 0;
}

.akn-simulator__option[aria-pressed="true"] {
	background: var(--akn-ink);
	color: var(--akn-paper);
}

.akn-simulator__result {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 36px;
	padding: 24px 0;
	border-top: var(--akn-rule-thin) solid var(--akn-rule);
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
}

.akn-simulator__cell {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.akn-simulator__desc {
	font-size: 16px;
	line-height: 1.8;
}

.akn-simulator__amount {
	font-size: 34px;
	line-height: 1.3;
}

/* 決済可否表 */
.akn-payment__table {
	font-size: var(--akn-text-md);
	line-height: 1.6;
}

.akn-payment__table thead th {
	padding: 0 12px 10px 0;
}

.akn-payment__table thead th:nth-child(1) { width: 32%; }
.akn-payment__table thead th:nth-child(2) { width: 26%; }

.akn-payment__table tbody th,
.akn-payment__table tbody td {
	padding: 14px 12px 14px 0;
	font-weight: 400;
}

.akn-payment__status--pending,
.akn-payment__statement {
	color: var(--akn-muted);
}

/* 日本語テストの記録 */
.akn-chat__box {
	border: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: var(--akn-text-md);
	line-height: 1.9;
}

.akn-chat__head {
	padding: 10px 20px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: var(--akn-text-xs);
	color: var(--akn-accent);
}

.akn-chat__log {
	margin: 0;
	padding: 8px 0;
}

.akn-chat__line {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 12px;
	padding: 6px 20px;
}

.akn-chat__line dt {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

.akn-chat__line dd {
	margin: 0;
}

.akn-chat__verdict {
	padding: 12px 20px;
	border-top: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: 14px;
	color: var(--akn-muted);
}

/* ------------------------------------------------------------------
 * 詳しい記事の一覧（記事一覧でも使う）
 * ------------------------------------------------------------------ */
.akn-children__list,
.akn-post-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-children__item,
.akn-post-list__item {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) 40px;
	align-items: center;
	min-height: 60px;
	padding-block: 8px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: 16px;
	line-height: 1.6;
	text-decoration: none;
}

.akn-post-list__item {
	grid-template-columns: 110px minmax(0, 1fr) 40px;
}

.akn-children__no,
.akn-post-list__date {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

.akn-children__arrow,
.akn-post-list__arrow {
	text-align: right;
}

/* ページ送り */
.akn-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 32px;
	font-family: var(--akn-font-mono);
	font-size: 14px;
}

.akn-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--akn-tap);
	min-height: var(--akn-tap);
	padding: 0 12px;
	border: var(--akn-rule-thin) solid var(--akn-rule);
	text-decoration: none;
}

.akn-pagination .page-numbers.current {
	border-color: var(--akn-ink);
	background: var(--akn-ink);
	color: var(--akn-paper);
}

.akn-pagination .page-numbers.dots {
	border-color: transparent;
}

/* ------------------------------------------------------------------
 * CTA帯
 * ------------------------------------------------------------------ */
.akn-cta-band {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	padding: 36px 40px;
	background: var(--akn-cta-bg);
	color: var(--akn-cta-text);
}

.akn-cta-band__text {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.akn-cta-band__heading {
	word-break: auto-phrase;
	font-family: var(--akn-font-display);
	font-size: 22px;
	font-weight: var(--akn-weight-display);
	line-height: 1.5;
}

.akn-cta-band__note {
	font-size: var(--akn-text-sm);
	opacity: 0.8;
}

/* ------------------------------------------------------------------
 * サイドバー：基本データ・比較する
 * ------------------------------------------------------------------ */
.akn-steps {
	align-self: start;
}

.akn-facts .akn-boxed__head {
	padding-inline: 18px;
}

.akn-facts__list {
	margin: 0;
}

.akn-facts__row {
	display: grid;
	grid-template-columns: 92px minmax(0, 1fr);
	gap: 10px;
	padding: 12px 18px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: 14px;
	line-height: 1.6;
}

.akn-facts__row:last-child {
	border-bottom: 0;
}

.akn-facts__cta {
	padding: 18px;
	border-top: var(--akn-rule-thin) solid var(--akn-rule);
}

.akn-facts__row dt {
	color: var(--akn-muted);
}

.akn-facts__row dd {
	margin: 0;
}

.akn-facts__note {
	margin-top: 8px;
	font-size: var(--akn-text-xs);
	text-align: center;
	color: var(--akn-muted);
}

.akn-compare {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 16px;
	border-top: var(--akn-rule-thin) solid var(--akn-ink);
}

.akn-compare__label {
	font-size: var(--akn-text-xs);
	letter-spacing: 0.08em;
}

.akn-compare__list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--akn-text-md);
	line-height: 1.6;
}

.akn-compare__list a {
	display: inline-flex;
	align-items: center;
	min-height: var(--akn-tap);
}

/* 検証したサービス：関連サービスの行（.akn-related__item）をサイドバーの幅に合わせて3列（名前・総合点・→）にする */
.akn-service-list .akn-boxed__head {
	padding-inline: 18px;
}

.akn-service-list .akn-service-list__item {
	grid-template-columns: minmax(0, 1fr) auto 16px;
	gap: 12px;
	min-height: 52px;
	padding: 8px 18px;
}

.akn-service-list .akn-related__name,
.akn-service-list .akn-related__total {
	font-size: var(--akn-text-md);
}

/* スマホで .akn-related__arrow を隠す指定より強くして、サイドバーの一覧では → を残す */
.akn-service-list .akn-related__arrow {
	display: block;
}

.akn-service-list__all {
	display: flex;
	padding: 4px 18px;
}

.akn-service-list__all .akn-link-accent {
	display: inline-flex;
	align-items: center;
	min-height: var(--akn-tap);
	font-size: 14px;
}

/* ------------------------------------------------------------------
 * 追従 CTA（スマホのみ表示）
 * ------------------------------------------------------------------ */
.akn-sticky-cta {
	display: none;
}

/* ------------------------------------------------------------------
 * 年齢確認ゲート
 * ------------------------------------------------------------------ */
.akn-age-gate {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	overflow-y: auto;
	background: var(--akn-paper);
	color: var(--akn-ink);
}

.akn-age-ok .akn-age-gate {
	display: none;
}

.akn-has-age-gate:not(.akn-age-ok),
.akn-has-age-gate:not(.akn-age-ok) body {
	overflow: hidden;
}

.akn-age-gate__panel {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
	max-width: 480px;
	padding: 40px 32px;
	border-top: var(--akn-rule-double) double var(--akn-ink);
	border-bottom: var(--akn-rule-double) double var(--akn-ink);
}

.akn-age-gate__site {
	font-family: var(--akn-font-display);
	font-size: 26px;
	font-weight: var(--akn-weight-display);
	line-height: 1.2;
	letter-spacing: var(--akn-tracking-display);
}

.akn-age-gate__title {
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	letter-spacing: 0.08em;
	color: var(--akn-muted);
}

.akn-age-gate__desc {
	font-size: var(--akn-text-lg);
	line-height: 1.9;
}

.akn-age-gate__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	padding-top: 8px;
}

/* ------------------------------------------------------------------
 * スマホ（〜768px）
 * ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.akn-sp-only {
		display: inline;
	}

	.akn-section-head {
		padding-bottom: 12px;
	}

	.akn-section-head h2,
	.akn-section-head--large h2,
	.akn-method h2 {
		font-size: 21px;
	}

	.akn-breadcrumbs {
		font-size: 11px;
	}

	.akn-badges {
		gap: 8px;
	}

	.akn-badges .akn-badge {
		padding: 3px 8px;
		font-size: 11px;
	}

	/* 特集 */
	.akn-feature {
		gap: 16px;
	}

	.akn-feature__title {
		font-size: 30px;
		line-height: 1.4;
	}

	.akn-feature__lead {
		font-size: var(--akn-text-md);
		line-height: 1.9;
	}

	.akn-feature__actions .akn-button {
		width: 100%;
	}

	.akn-steps__item {
		grid-template-columns: 36px minmax(0, 1fr) auto;
		gap: 8px;
		padding: 13px 16px;
		font-size: 14px;
	}

	.akn-boxed__head,
	.akn-steps__note {
		padding-inline: 16px;
	}

	/* 取り扱いサービス：行を縦積みにする */
	.akn-service-table,
	.akn-service-table tbody {
		display: block;
	}

	.akn-service-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.akn-service-table tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 6px 12px;
		padding: 18px 0;
		border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	}

	.akn-service-table tbody th,
	.akn-service-table tbody td,
	.akn-service-table tbody .akn-service-table__link {
		display: block;
		padding: 0;
		border: 0;
		text-align: left;
	}

	.akn-service-table__name {
		grid-column: 1;
		grid-row: 1;
		font-size: 19px;
	}

	.akn-service-table__status {
		grid-column: 2;
		grid-row: 1;
	}

	.akn-service-table td[data-label],
	.akn-service-table__link {
		grid-column: 1 / -1;
		font-size: 14px;
	}

	.akn-service-table td[data-label]::before {
		content: attr(data-label);
		display: inline-block;
		min-width: 6.5em;
		font-family: var(--akn-font-mono);
		font-size: var(--akn-text-xs);
		color: var(--akn-muted);
	}

	/* 悩みから探す */
	.akn-worries__item {
		grid-template-columns: 48px minmax(0, 1fr);
		padding: 22px 0;
	}

	.akn-worries__no {
		font-size: 24px;
	}

	.akn-worries__q {
		font-size: 19px;
	}

	/* ハブ冒頭 */
	.akn-hub__header {
		gap: 14px;
	}

	.akn-hub__title,
	.akn-article__title {
		font-size: 30px;
	}

	.akn-hub__lead {
		font-size: var(--akn-text-md);
	}

	/* 結論ボックス */
	.akn-verdict {
		display: flex;
		flex-direction: column;
		gap: 18px;
		padding: 20px 0;
	}

	.akn-verdict__score {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 10px;
		border-right: 0;
	}

	.akn-verdict__total {
		font-size: 48px;
	}

	.akn-verdict__progress {
		flex-basis: 100%;
		margin-top: 0;
	}

	.akn-verdict__col {
		gap: 6px;
	}

	.akn-verdict__heading {
		font-size: 16px;
	}

	.akn-verdict__list {
		font-size: 14px;
		line-height: 1.8;
	}

	/* スコアカード */
	.akn-scorecard__row {
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas:
			"name points"
			"scale scale";
		gap: 8px;
		padding: 13px 0;
		font-size: 14px;
	}

	.akn-scorecard__weight {
		display: none;
	}

	.akn-scorecard__points {
		font-size: 14px;
	}

	.akn-scale {
		gap: 3px;
	}

	.akn-scale__cell {
		height: 8px;
	}

	/* 料金表：プランごとに2行×2列 */
	.akn-price__table,
	.akn-price__table tbody {
		display: block;
	}

	.akn-price__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.akn-price__table tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		row-gap: 2px;
		padding: 14px 0;
		border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	}

	.akn-price__table tbody th,
	.akn-price__table tbody td {
		display: block;
		padding: 0;
		border: 0;
	}

	.akn-price__name {
		grid-column: 1;
		grid-row: 1;
		font-size: var(--akn-text-md);
	}

	.akn-price__monthly {
		grid-column: 2;
		grid-row: 1;
		font-size: 18px;
	}

	.akn-price__off {
		grid-column: 1;
		grid-row: 2;
		font-size: var(--akn-text-xs);
		text-align: left;
	}

	.akn-price__total {
		grid-column: 2;
		grid-row: 2;
		font-size: var(--akn-text-xs);
		color: var(--akn-muted);
	}

	/* シミュレーター */
	.akn-simulator__switch {
		display: flex;
		align-self: stretch;
	}

	.akn-simulator__option {
		flex: 1 1 0;
		min-width: 0;
		padding: 0 8px;
	}

	.akn-simulator__result {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
		padding: 18px 0;
	}

	.akn-simulator__desc {
		font-size: var(--akn-text-md);
	}

	.akn-simulator__amount {
		font-size: 28px;
	}

	/* 決済可否表 */
	.akn-payment__table {
		font-size: 14px;
	}

	/* 日本語テスト */
	.akn-chat__head,
	.akn-chat__line,
	.akn-chat__verdict {
		padding-inline: 16px;
	}

	.akn-chat__line {
		grid-template-columns: 48px minmax(0, 1fr);
	}

	/* 記事の一覧 */
	.akn-children__item,
	.akn-post-list__item {
		grid-template-columns: 36px minmax(0, 1fr) 20px;
		min-height: 56px;
		font-size: var(--akn-text-md);
		line-height: 1.5;
	}

	.akn-children__no,
	.akn-post-list__date {
		font-size: var(--akn-text-xs);
	}

	.akn-post-list__item {
		grid-template-columns: minmax(0, 1fr) 20px;
		grid-template-areas:
			"date arrow"
			"title arrow";
		row-gap: 2px;
		padding-block: 12px;
	}

	.akn-post-list__date {
		grid-area: date;
	}

	.akn-post-list__title {
		grid-area: title;
	}

	.akn-post-list__arrow {
		grid-area: arrow;
	}

	/* CTA帯 */
	.akn-cta-band {
		flex-direction: column;
		align-items: stretch;
		padding: 28px 20px;
	}

	.akn-cta-band__heading {
		font-size: 19px;
	}

	/* サイドバーの CTA は消し、画面下の追従バーに任せる */
	.akn-facts__cta {
		display: none;
	}

	.akn-sticky-cta {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 50;
		display: flex;
		align-items: center;
		gap: 12px;
		min-height: var(--akn-sticky-cta-height);
		padding: 12px 16px calc(20px + env(safe-area-inset-bottom, 0px));
		border-top: var(--akn-rule-thin) solid var(--akn-ink);
		background: var(--akn-paper);
	}

	.akn-sticky-cta__text {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
		gap: 2px;
		min-width: 0;
		line-height: 1.5;
	}

	.akn-sticky-cta__name {
		font-size: var(--akn-text-sm);
		font-weight: 700;
	}

	.akn-sticky-cta__price {
		font-size: 11px;
		color: var(--akn-muted);
	}

	.akn-sticky-cta__button {
		padding: 0 20px;
		font-size: 14px;
	}

	/* 年齢確認ゲート */
	.akn-age-gate__panel {
		padding: 32px 0;
	}

	.akn-age-gate__actions .akn-button {
		flex: 1 1 100%;
	}
}

/* ==================================================================
 * データプラグイン（aikanojo-data）のコンポーネントで足した部分
 * ================================================================== */

/* 本文（.akn-prose）の中に置いた部品には、本文用の見出し・リストの余白や罫をかけない */
.akn-prose .akn-section-head h2,
.akn-prose .akn-verdict__heading {
	margin-top: 0;
	padding-bottom: 0;
	border-bottom: 0;
}

.akn-prose .akn-verdict__heading {
	font-size: 18px;
}

.akn-prose .akn-scorecard__list,
.akn-prose .akn-children__list,
.akn-prose .akn-children__links,
.akn-prose .akn-related__list {
	padding-left: 0;
}

.akn-prose .akn-scorecard__list li + li,
.akn-prose .akn-children__list li + li,
.akn-prose .akn-related__list li + li {
	margin-top: 0;
}

/* 結論ボックス：結論の文は総合点の右、2列にまたがる */
.akn-verdict__score {
	grid-row: 1 / span 2;
}

.akn-verdict__summary {
	grid-column: 2 / -1;
	font-size: var(--akn-text-lg);
	line-height: 1.9;
}

/* スコアカード：未計測の印、前回との差、総合点 */
.akn-scorecard__row {
	grid-template-columns: minmax(0, 1fr) 180px 56px 96px;
	grid-template-areas: "name scale flag points";
}

.akn-scorecard__unmeasured {
	grid-area: flag;
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

.akn-scorecard__diff {
	margin-left: 6px;
	font-size: var(--akn-text-xs);
	color: var(--akn-accent);
}

.akn-scorecard__total {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 14px;
	padding-top: 16px;
}

.akn-scorecard__total-label,
.akn-scorecard__progress {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
	letter-spacing: 0.04em;
}

.akn-scorecard__total-value {
	font-size: 22px;
}

/* 料金表：期間、円の請求額、付属トークン、おすすめの印 */
.akn-price__table thead th:nth-child(1) {
	width: 30%;
}

.akn-price__recommended,
.akn-simulator__recommended {
	display: inline-block;
	margin-left: 8px;
	padding: 0 6px;
	border: var(--akn-rule-thin) solid var(--akn-accent);
	color: var(--akn-accent);
	font-size: var(--akn-text-xs);
	font-weight: 400;
	line-height: 1.7;
	vertical-align: middle;
}

.akn-price__period,
.akn-price__jpy {
	display: block;
	margin-top: 4px;
	font-size: var(--akn-text-xs);
	font-weight: 400;
	color: var(--akn-muted);
}

.akn-price__tokens {
	font-size: 14px;
}

/* シミュレーター：モデルごとのパネル（JS が hidden を切り替える）とプラン別の表 */
.akn-simulator__result[hidden] {
	display: none;
}

.akn-simulator__table th,
.akn-simulator__table td {
	padding: 10px 12px 10px 0;
	vertical-align: baseline;
}

.akn-simulator__table td {
	padding-right: 0;
}

.akn-simulator__table tr:last-child th,
.akn-simulator__table tr:last-child td {
	border-bottom: 0;
}

.akn-simulator__table th {
	font-size: var(--akn-text-md);
	font-weight: 700;
}

.akn-simulator__table .akn-simulator__amount {
	display: block;
	font-size: 26px;
}

.akn-simulator__detail {
	display: block;
	font-size: var(--akn-text-xs);
	line-height: 1.6;
	color: var(--akn-muted);
}

.akn-simulator__unavailable {
	padding: 20px 0;
	border-top: var(--akn-rule-thin) solid var(--akn-rule);
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	color: var(--akn-muted);
}

/* 決済可否表：不可は朱、メモの列 */
.akn-payment__table thead th:nth-child(1) { width: 26%; }
.akn-payment__table thead th:nth-child(2) { width: 14%; }

.akn-payment__status--ng {
	color: var(--akn-accent);
}

.akn-payment__note {
	font-size: var(--akn-text-sm);
	color: var(--akn-muted);
}

/* 会話サンプル：サービス名と最終検証日 */
.akn-chat__meta {
	padding: 10px 20px;
	border-top: var(--akn-rule-thin) solid var(--akn-rule);
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

/* CTAボタン（本文中） */
.akn-cta {
	margin-block: 8px;
}

/* 比較表：横スクロール、1列目（項目）は固定 */
.akn-compare-table {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.akn-compare-table__scroll {
	overflow-x: auto;
	border-top: var(--akn-rule-thin) solid var(--akn-ink);
	-webkit-overflow-scrolling: touch;
}

.akn-compare-table__table {
	min-width: 640px;
	line-height: 1.6;
}

.akn-compare-table__table th,
.akn-compare-table__table td {
	padding: 12px 16px 12px 0;
}

.akn-compare-table__table thead th {
	font-family: var(--akn-font-display);
	font-size: var(--akn-text-lg);
	font-weight: var(--akn-weight-display);
	color: var(--akn-ink);
	letter-spacing: var(--akn-tracking-display);
}

.akn-compare-table__table th:first-child {
	position: sticky;
	left: 0;
	z-index: 1;
	width: 8.5em;
	background: var(--akn-paper);
}

.akn-compare-table__table tbody th {
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	font-weight: 400;
	color: var(--akn-muted);
}

/* 記事の末尾：子記事ナビと関連サービス */
.akn-article__footer > * + * {
	margin-top: 56px;
}

.akn-children__item[aria-current="page"] .akn-children__title {
	font-weight: 700;
}

.akn-children__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0 28px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.akn-children__links a {
	display: inline-flex;
	align-items: center;
	min-height: var(--akn-tap);
}

.akn-related__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.akn-related__item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto 96px 24px;
	align-items: center;
	gap: 16px;
	min-height: 64px;
	padding-block: 8px;
	border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	text-decoration: none;
}

.akn-related__name {
	font-family: var(--akn-font-display);
	font-size: 18px;
	font-weight: var(--akn-weight-display);
	line-height: 1.5;
}

.akn-related__total {
	font-size: 18px;
}

.akn-related__max,
.akn-related__date {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

.akn-related__arrow {
	text-align: right;
}

/* トップ：取り扱いサービスの表（総合点の列を足した7列） */
.akn-service-table thead th:nth-child(1) { width: 21%; }
.akn-service-table thead th:nth-child(2) { width: 7%; }
.akn-service-table thead th:nth-child(3) { width: 24%; }
.akn-service-table thead th:nth-child(4) { width: 13%; }
.akn-service-table thead th:nth-child(5) { width: 10%; }
.akn-service-table thead th:nth-child(6) { width: 12%; }
.akn-service-table thead th:nth-child(7) { width: 13%; }

.akn-service-table__total {
	font-size: 18px;
}

.akn-service-table__max {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

.akn-front-ranking {
	padding-top: 56px;
	scroll-margin-top: 16px;
}

/* 表・内訳の折り返し：語の途中で切らない */
.akn-service-table__price {
	white-space: nowrap;
}

.akn-simulator__packs,
.akn-price__basis {
	display: inline-block; /* 括弧の中は1かたまりで折り返す */
}

.akn-simulator__pack {
	white-space: nowrap;
}

/* 比較表のセル：1項目1行。数値・日付は等幅（.akn-mono）、補足は小さく */
.akn-compare-table__line {
	display: block;
	white-space: nowrap;
}

.akn-compare-table__note {
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

/* 比較表の最下行：公式サイトへのボタン */
.akn-compare-table__table .akn-compare-table__cta-row th,
.akn-compare-table__table .akn-compare-table__cta-row td {
	padding-top: 16px;
	border-bottom: 0;
	vertical-align: middle;
}

.akn-compare-table__button {
	min-height: var(--akn-tap);
	padding: 0 16px;
	font-size: 14px;
}

/* 無料でできること：アカウント作成と機能ごとの無料の範囲の表組み */
.akn-free {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.akn-free__caption {
	padding-bottom: 8px;
	font-size: var(--akn-text-xs);
	letter-spacing: 0.08em;
	text-align: left;
	color: var(--akn-muted);
}

.akn-free__table {
	font-size: var(--akn-text-md);
	line-height: 1.6;
}

.akn-free__table th,
.akn-free__table td {
	padding: 12px 16px 12px 0;
	vertical-align: baseline;
}

.akn-free__table tbody th {
	font-weight: 400;
}

.akn-free__account tbody th {
	width: 14em;
	color: var(--akn-muted);
}

.akn-free__features thead th:nth-child(1) { width: 12em; }
.akn-free__features thead th:nth-child(2) { width: 7em; }

.akn-free__status--yes {
	font-weight: 700;
}

.akn-free__status--no,
.akn-free__status--none,
.akn-free__limit {
	color: var(--akn-muted);
}

.akn-free__limit {
	font-size: var(--akn-text-sm);
	word-break: auto-phrase; /* 自由記述の上限・条件は、対応ブラウザでは文節の途中で折り返さない */
}

.akn-free__summary {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 36px;
	margin: 0;
}

.akn-free__summary-row {
	display: flex;
	align-items: baseline;
	gap: 12px;
}

.akn-free__summary dt {
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	color: var(--akn-muted);
}

.akn-free__summary dd {
	margin: 0;
	font-size: 18px;
}

@media (max-width: 768px) {
	.akn-prose .akn-verdict__heading {
		font-size: 16px;
	}

	.akn-free__table {
		font-size: 14px;
	}

	.akn-free__account tbody th {
		width: auto;
	}

	/* 機能ごとの表：1行目に機能と可否、2行目に上限・条件を全幅で */
	.akn-free__features,
	.akn-free__features tbody {
		display: block;
	}

	/* 表を block にすると見出し（caption）が縦に潰れるので、block で全幅にする */
	.akn-free__features .akn-free__caption {
		display: block;
	}

	.akn-free__features thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.akn-free__features tbody tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 2px 12px;
		padding: 10px 0;
		border-bottom: var(--akn-rule-thin) solid var(--akn-rule);
	}

	.akn-free__features tbody th,
	.akn-free__features tbody td {
		display: block;
		padding: 0;
		border: 0;
	}

	.akn-free__limit {
		grid-column: 1 / -1;
		font-size: var(--akn-text-xs);
	}

	.akn-verdict__summary {
		font-size: var(--akn-text-md);
	}

	.akn-scorecard__row {
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas:
			"name points"
			"scale flag";
	}

	.akn-scorecard__total-value {
		font-size: 18px;
	}

	/* 料金表：3行目に付属トークン */
	.akn-price__tokens {
		grid-column: 1 / -1;
		grid-row: 3;
		font-size: var(--akn-text-xs);
		text-align: left;
		color: var(--akn-muted);
	}

	.akn-price__tokens::before {
		content: attr(data-label) "　";
	}

	.akn-simulator__table .akn-simulator__amount {
		font-size: 22px;
	}

	.akn-payment__note {
		font-size: var(--akn-text-xs);
	}

	.akn-chat__meta {
		padding-inline: 16px;
	}

	.akn-compare-table__table {
		min-width: 560px;
		font-size: 14px;
	}

	.akn-related__item {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 4px 12px;
		padding-block: 12px;
	}

	.akn-related__item .akn-badge {
		justify-self: start;
	}

	.akn-related__arrow {
		display: none;
	}

	.akn-front-ranking {
		padding-top: 32px;
	}

	.akn-service-table__total {
		font-size: 14px;
	}
}

/* ==================================================================
 * 問い合わせフォーム（akn-contact の [akn_contact]）
 * 入力欄は角丸なし・細罫、送信ボタンは .akn-button（墨ベタの四角）
 * ================================================================== */
.akn-contact {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.akn-contact__form {
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding-top: 28px;
	border-top: var(--akn-rule-double) double var(--akn-ink);
}

.akn-contact__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.akn-contact__label {
	display: flex;
	align-items: baseline;
	gap: 12px;
	font-size: var(--akn-text-md);
	font-weight: 700;
	line-height: var(--akn-leading-tight);
}

.akn-contact__flag {
	font-family: var(--akn-font-mono);
	font-size: var(--akn-text-xs);
	font-weight: 400;
	letter-spacing: 0.04em;
	color: var(--akn-muted);
}

.akn-contact__flag--required {
	color: var(--akn-accent);
}

.akn-contact__input {
	display: block;
	width: 100%;
	min-height: var(--akn-tap);
	margin: 0;
	padding: 10px 12px;
	border: var(--akn-rule-thin) solid var(--akn-muted);
	border-radius: var(--akn-radius);
	background: var(--akn-paper);
	color: var(--akn-ink);
	font-family: var(--akn-font-body);
	font-size: var(--akn-text-body); /* 16px 以上：iOS でフォーカス時に拡大されない */
	line-height: 1.6;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.akn-contact__input--textarea {
	min-height: 16em;
	line-height: 1.8;
	resize: vertical;
}

.akn-contact__input:focus {
	border-color: var(--akn-ink);
}

.akn-contact__field.is-invalid .akn-contact__input {
	border-color: var(--akn-accent);
}

.akn-contact__hint {
	font-size: var(--akn-text-sm);
	line-height: 1.7;
	color: var(--akn-muted);
}

.akn-contact__error {
	font-size: var(--akn-text-sm);
	font-weight: 700;
	line-height: 1.7;
	color: var(--akn-accent);
}

.akn-contact__alert {
	padding: 14px 20px;
	border: var(--akn-rule-thin) solid var(--akn-accent);
	font-size: var(--akn-text-md);
	font-weight: 700;
	color: var(--akn-accent);
}

.akn-contact__actions {
	padding-top: 4px;
}

.akn-contact__submit {
	min-width: 14em;
}

.akn-contact__submit:hover {
	opacity: 0.72;
}

.akn-contact__note {
	font-size: var(--akn-text-sm);
	line-height: 1.8;
	color: var(--akn-muted);
}

/* 送信後：上下を二重罫で挟んだ1行 */
.akn-contact__done {
	padding: 24px 0;
	border-top: var(--akn-rule-double) double var(--akn-ink);
	border-bottom: var(--akn-rule-double) double var(--akn-ink);
	font-size: var(--akn-text-lg);
	font-weight: 700;
	line-height: 1.7;
}

@media (max-width: 768px) {
	.akn-contact__submit {
		display: flex;
		width: 100%;
		min-width: 0;
	}
}