/* ============================================================================
 * 大人通信 デザイン案A（design.md 2026-11-12 版の適用）
 *
 * - 読み込み条件・切替方法は同じフォルダの README.md
 * - すべてのセレクタを body.otn-design-new の配下に限定している。切替オフ＝現状の見た目のまま
 * - テンプレート3本の <style> と functions.php の CSS は触らず、ここで上書きする。
 *   既存の指定が2クラス（例 .single-actress-content .actress-affiliate-button）なので、
 *   こちらは .otn-design-new を足した3クラスで必ず勝つ
 * - 値は tokens.css の変数だけを使う（生の色・px をここに書かない）
 * ========================================================================== */

/* 1. 土台 ------------------------------------------------------------------- */
body.otn-design-new {
	background: var(--ot-neutral);
	color: var(--ot-body);
	font-family: var(--ot-font);
	font-size: var(--ot-fs-body);
	line-height: var(--ot-lh-body);
	letter-spacing: var(--ot-ls-body);
	-webkit-font-smoothing: antialiased;
}
.otn-design-new .body { background: transparent; }
.otn-design-new a { color: var(--ot-primary-text); text-decoration: none; transition: color .15s, background-color .15s, border-color .15s; }
.otn-design-new a:hover { color: var(--ot-primary-hover); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.otn-design-new a:focus-visible { outline: 2px solid var(--ot-primary-text); outline-offset: 3px; border-radius: 2px; }
.otn-design-new h1, .otn-design-new h2, .otn-design-new h3, .otn-design-new h4 {
	color: var(--ot-ink);
	font-weight: 700;
	letter-spacing: var(--ot-ls);
	line-height: var(--ot-lh-head);
}
@media (prefers-reduced-motion: reduce) {
	.otn-design-new * { transition: none !important; }
}

/* 2. 外枠と2カラム ----------------------------------------------------------- */
.otn-design-new .wrap { width: min(var(--ot-container-max), calc(100% - var(--ot-page-margin) * 2)); }
.otn-design-new .content { padding: 0; }
.otn-design-new .content-in {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	gap: var(--ot-col-gap);
	align-items: start;
}
.otn-design-new .main,
.otn-design-new .sidebar {
	width: auto;
	max-width: none;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.otn-design-new .main { padding: var(--ot-sp-xl) 0 var(--ot-sp-section); }
.otn-design-new .sidebar { padding: var(--ot-sp-xl) 0 0; }
@media (max-width: 899px) {
	.otn-design-new .content-in { grid-template-columns: minmax(0, 1fr); }
	.otn-design-new .main { padding-top: var(--ot-sp-lg); }
}

/* 3. ヘッダーとナビ ----------------------------------------------------------- */
.otn-design-new .header-container { background: var(--ot-neutral); border-bottom: 1px solid var(--ot-border); }
.otn-design-new .header-container-in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ot-sp-lg);
	width: min(var(--ot-container-max), calc(100% - var(--ot-page-margin) * 2));
	min-height: 96px;
	margin: 0 auto;
}
.otn-design-new .header, .otn-design-new .navi { background: transparent; flex: 0 1 auto; }
.otn-design-new .header-in.wrap, .otn-design-new .navi-in.wrap { width: auto; }
.otn-design-new .header-in { min-height: 0; }
.otn-design-new .tagline { display: none; }
.otn-design-new .logo-header { margin: 0; padding: var(--ot-sp-md) 0; line-height: 0; text-align: left; }
.otn-design-new .logo-header a.site-name,
.otn-design-new .logo-footer a.site-name {
	display: inline-block;
	width: 228px;
	height: 90px;
	background: url("logo_yoko.svg") no-repeat left center / contain;
	overflow: hidden;
	white-space: nowrap;
	text-indent: 200%;
}
.otn-design-new .logo-header a.site-name:hover { text-decoration: none; }
.otn-design-new .navi-in > ul { justify-content: flex-end; gap: var(--ot-sp-xl); }
.otn-design-new .navi-in > ul > li { height: auto; margin: 0; }
.otn-design-new .navi-in a {
	height: auto;
	padding: 12px 0;
	font-size: var(--ot-fs-sm);
	font-weight: 700;
	line-height: var(--ot-lh-label);
	color: var(--ot-ink);
	background: transparent;
	position: relative;
}
.otn-design-new .navi-in a:hover { color: var(--ot-primary-text); background: transparent; text-decoration: none; }
.otn-design-new .navi-in .current-menu-item > a::after,
.otn-design-new .navi-in .current_page_item > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 6px;
	height: 2px;
	border-radius: 2px;
	background: var(--ot-accent-coral);
}
.otn-design-new .navi-in .item-label { font-size: inherit; }
@media (max-width: 599px) {
	.otn-design-new .header-container-in { min-height: 72px; }
	.otn-design-new .logo-header a.site-name { width: 176px; height: 70px; }
}

/* 4. 見出し（本文・テンプレート共通） --------------------------------------------- */
.otn-design-new .article h2,
.otn-design-new .entry-content h2,
.otn-design-new .single-actress-content h2,
.otn-design-new .single-video-content h2,
.otn-design-new .archive-actress-content h2,
.otn-design-new .vh-top-heading,
.otn-design-new .vh-page .vh-block-heading {
	position: relative;
	margin: var(--ot-sp-section) 0 var(--ot-sp-lg);
	padding: 0 0 0 var(--ot-sp-md);
	border: 0;
	border-radius: 0;
	background: none;
	font-size: var(--ot-fs-h2);
	line-height: var(--ot-lh-head);
	color: var(--ot-ink);
}
.otn-design-new .article h2::before,
.otn-design-new .entry-content h2::before,
.otn-design-new .single-actress-content h2::before,
.otn-design-new .single-video-content h2::before,
.otn-design-new .archive-actress-content h2::before,
.otn-design-new .vh-top-heading::before,
.otn-design-new .vh-page .vh-block-heading::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 3px;
	height: 100%;
	border-radius: 2px;
	background: var(--ot-primary);
}
.otn-design-new .article h3,
.otn-design-new .entry-content h3,
.otn-design-new .single-actress-content h3,
.otn-design-new .single-video-content h3 {
	position: relative;
	margin: var(--ot-sp-xl) 0 var(--ot-sp-md);
	padding: 0 0 var(--ot-sp-sm);
	border: 0;
	border-bottom: 1px solid var(--ot-border);
	border-radius: 0;
	background: none;
	font-size: var(--ot-fs-h3);
	color: var(--ot-ink);
}
.otn-design-new .article h3::after,
.otn-design-new .entry-content h3::after,
.otn-design-new .single-actress-content h3::after,
.otn-design-new .single-video-content h3::after {
	content: "";
	position: absolute;
	left: 0; bottom: -1px;
	width: 40px;
	height: 2px;
	background: var(--ot-primary);
}
.otn-design-new .article h4,
.otn-design-new .entry-content h4 {
	margin: var(--ot-sp-lg) 0 var(--ot-sp-sm);
	padding: 0;
	border: 0;
	font-size: var(--ot-fs-body);
	color: var(--ot-ink);
}
/* 同人カードの見出しは独自のリセットを持つ（::before を出さない） */
.otn-design-new .ot-doujin__ttl::before, .otn-design-new .ot-doujin__ttl::after { display: none !important; }

/* 5. 記事（柱記事・ガイド） ---------------------------------------------------- */
.otn-design-new .article { font-size: var(--ot-fs-body); line-height: var(--ot-lh-body); }
.otn-design-new .entry-title {
	margin: var(--ot-sp-sm) 0 var(--ot-sp-lg);
	font-size: var(--ot-fs-display);
	line-height: 1.45;
}
.otn-design-new .date-tags, .otn-design-new .post-date, .otn-design-new .post-update { color: var(--ot-muted); font-size: var(--ot-fs-xs); }
.otn-design-new .eye-catch img { border-radius: var(--ot-r-lg); }
.otn-design-new .entry-content { margin-top: var(--ot-sp-xl); }
.otn-design-new .entry-content p { margin: 0 0 var(--ot-sp-lg); }
.otn-design-new .entry-content .wp-block-image img,
.otn-design-new .entry-content figure img { border-radius: var(--ot-r-md); }
.otn-design-new .entry-content figcaption { color: var(--ot-muted); font-size: var(--ot-fs-xs); }
.otn-design-new .entry-content table { border-collapse: collapse; font-size: var(--ot-fs-sm); line-height: var(--ot-lh-sm); }
.otn-design-new .entry-content th, .otn-design-new .entry-content td { border: 1px solid var(--ot-border); padding: 10px 12px; vertical-align: top; }
.otn-design-new .entry-content th { background: var(--ot-surface-subtle); color: var(--ot-ink); font-weight: 700; }
.otn-design-new .entry-content blockquote {
	position: relative;
	margin: var(--ot-sp-xl) 0;
	padding: var(--ot-sp-lg) var(--ot-sp-xl);
	border: 1px solid var(--ot-primary-border);
	border-radius: var(--ot-r-md);
	background: var(--ot-surface-subtle);
	color: var(--ot-ink);
	font-size: var(--ot-fs-body-lg);
}
.otn-design-new .entry-content blockquote::before { color: var(--ot-primary); opacity: .6; }
.otn-design-new .toc {
	display: block;
	max-width: 100%;
	margin: var(--ot-sp-xl) 0;
	padding: var(--ot-sp-lg) var(--ot-sp-xl);
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-lg);
	background: var(--ot-surface);
	box-shadow: var(--ot-shadow-card);
	font-size: var(--ot-fs-sm);
}
.otn-design-new .toc-title {
	position: relative;
	padding-left: 14px;
	margin-bottom: var(--ot-sp-md);
	color: var(--ot-ink);
	font-weight: 700;
	text-align: left;
}
.otn-design-new .toc-title::before { content: ""; position: absolute; left: 0; top: .3em; width: 3px; height: 1em; border-radius: 2px; background: var(--ot-primary); }
.otn-design-new .toc a { color: var(--ot-ink); }
.otn-design-new .toc .toc-list > li { margin: 6px 0; }
.otn-design-new .toc .toc-list ol { margin-top: 4px; }
.otn-design-new .toc .toc-list ol li { margin: 4px 0; color: var(--ot-body); }

/* 6. トップページ（記事一覧・新着作品・女優ピックアップ） --------------------------- */
.otn-design-new .list { margin-top: 0; }
.otn-design-new .list .a-wrap {
	display: block;
	margin: 0 0 var(--ot-sp-lg);
	padding: 0;
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-lg);
	background: var(--ot-surface);
	box-shadow: var(--ot-shadow-card);
	overflow: hidden;
	color: var(--ot-body);
}
.otn-design-new .list .a-wrap:hover { background: var(--ot-surface); border-color: var(--ot-primary-border); text-decoration: none; }
.otn-design-new .list .entry-card { display: flex; gap: var(--ot-sp-lg); padding: 0; margin: 0; }
.otn-design-new .list .entry-card::before, .otn-design-new .list .entry-card::after { display: none; }
.otn-design-new .list .entry-card-thumb { flex: 0 0 280px; width: 280px; margin: 0; float: none; align-self: center; } /* 2026-11-12: 画像を切らない（高さ auto）。文章列より低い分は上下中央に置く */
.otn-design-new .list .entry-card-thumb img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0; display: block; }
.otn-design-new .list .entry-card-content { margin: 0; padding: var(--ot-sp-sm) var(--ot-sp-lg) var(--ot-sp-sm) 0; display: flex; flex-direction: column; gap: var(--ot-sp-sm); min-width: 0; }
.otn-design-new .list .entry-card-title { margin: 0; font-size: var(--ot-fs-h3); font-weight: 700; line-height: var(--ot-lh-head); color: var(--ot-ink); }
.otn-design-new .list .a-wrap:hover .entry-card-title { color: var(--ot-primary-text); }
.otn-design-new .list .entry-card-snippet { font-size: var(--ot-fs-sm); line-height: 1.6; color: var(--ot-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } /* 抜粋は3行まで（2026-11-12） */
.otn-design-new .list .entry-card-meta { display: none; } /* 2026-11-12 ユーザー指示: 記事カードの日付行（投稿日だけが入っている）を出さない。.list 内＝トップ・カテゴリー・検索結果・日付一覧の同じカード。サイドバーの新着（widget-entry-card-meta）は別クラスで対象外 */
.otn-design-new .list .entry-card-content { justify-content: center; } /* 日付が無くなり文章列が画像より低くなるので上下中央に */
.otn-design-new .cat-label {
	top: 8px; left: 8px;
	padding: 2px 10px;
	border: 0;
	border-radius: var(--ot-r-full);
	background: var(--ot-primary-text);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
}
@media (max-width: 599px) {
	.otn-design-new .list .entry-card { flex-direction: column; gap: 0; }
	.otn-design-new .list .entry-card-thumb { flex-basis: auto; width: 100%; }
	.otn-design-new .list .a-wrap .entry-card-thumb { margin-bottom: 0; } /* 2026-11-13 ユーザー指示: Cocoon の 480px 以下の規則（.ect-entry-card .a-wrap:not(.ec-big-card-first) .card-thumb { margin-bottom: 22px }＝横並び時代の文章列との間隔）が上の margin:0 より詳細度が高く残っていたので、同じ詳細度で 0 に。縦積みでは文章列の padding 16px が間隔になる */
	.otn-design-new .list .entry-card-thumb img { aspect-ratio: 16 / 9; height: auto; }
	.otn-design-new .list .entry-card-content { padding: var(--ot-sp-md); }
}
.otn-design-new .widget-index-bottom { margin: var(--ot-sp-xxl) 0 0; }
.otn-design-new .vh-top-heading { margin-top: 0; }
.otn-design-new .vh-top-grid { gap: var(--ot-sp-md); }
.otn-design-new .vh-top-card img { border-radius: var(--ot-r-md); border: 1px solid var(--ot-border); }
.otn-design-new .vh-top-grid-actress .vh-top-card img { border-radius: 50%; }
.otn-design-new .vh-top-card-title { margin-top: var(--ot-sp-sm); font-size: var(--ot-fs-xs); font-weight: 500; line-height: var(--ot-lh-label); }
.otn-design-new .vh-top-card-title a { color: var(--ot-ink); }
.otn-design-new .vh-top-card-title a:hover { color: var(--ot-primary-text); text-decoration: none; }
.otn-design-new .vh-top-more { margin-top: var(--ot-sp-md); font-size: var(--ot-fs-sm); font-weight: 700; }
.otn-design-new .vh-top-more a::after { content: " ›"; }

/* 7. サイドバー ------------------------------------------------------------- */
.otn-design-new .widget-sidebar {
	margin: 0 0 var(--ot-sp-lg);
	padding: var(--ot-sp-lg);
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-lg);
	background: var(--ot-surface);
	box-shadow: var(--ot-shadow-card);
	font-size: var(--ot-fs-sm);
	line-height: var(--ot-lh-sm);
}
.otn-design-new .widget-sidebar-title,
.otn-design-new .sidebar .wp-block-heading,
.otn-design-new .sidebar .wp-block-group > h2,
.otn-design-new .sidebar .wp-block-group > h3 {
	position: relative;
	margin: 0 0 var(--ot-sp-md);
	padding: 0 0 0 14px;
	border: 0;
	background: none;
	font-size: var(--ot-fs-body);
	font-weight: 700;
	color: var(--ot-ink);
	text-align: left;
}
.otn-design-new .widget-sidebar-title::before,
.otn-design-new .sidebar .wp-block-heading::before,
.otn-design-new .sidebar .wp-block-group > h2::before,
.otn-design-new .sidebar .wp-block-group > h3::before { content: ""; position: absolute; left: 0; top: .3em; width: 3px; height: 1em; border-radius: 2px; background: var(--ot-primary); }
/* Cocoon の共通規則「.body の各ブロックに margin-bottom:1.8em」（p・ul・wp-block-group・wp-block-search など全体に効く）を
   サイドバーのカード内の最後の要素だけ打ち消す。記事本文側には触れない（2026-11-12 ユーザー指示） */
.otn-design-new .widget-sidebar > :last-child,
.otn-design-new .widget-sidebar .textwidget > :last-child,
.otn-design-new .widget-sidebar .wp-block-group > :last-child { margin-bottom: 0; }
.otn-design-new .widget-sidebar ul { margin: 0; padding: 0; list-style: none; }
.otn-design-new .widget-sidebar .wp-block-categories li { padding: 6px 0; border-bottom: 1px solid var(--ot-border); }
.otn-design-new .widget-sidebar .wp-block-categories li:last-child { border-bottom: 0; }
.otn-design-new .widget-sidebar .wp-block-categories a { color: var(--ot-ink); }
.otn-design-new .widget-entry-cards .a-wrap { margin: 0; padding: var(--ot-sp-sm) 0; border: 0; border-bottom: 1px solid var(--ot-border); border-radius: 0; background: transparent; }
.otn-design-new .widget-entry-cards .a-wrap:last-child { border-bottom: 0; }
.otn-design-new .widget-entry-cards .a-wrap:hover { background: transparent; }
.otn-design-new .widget-entry-card-thumb img { border-radius: var(--ot-r-sm); }
.otn-design-new .widget-entry-card-title { font-size: var(--ot-fs-sm); line-height: var(--ot-lh-head); color: var(--ot-ink); }
.otn-design-new .widget-entry-cards .a-wrap:hover .widget-entry-card-title { color: var(--ot-primary-text); }
.otn-design-new .wp-block-search__inside-wrapper { gap: var(--ot-sp-sm); border: 0; padding: 0; }
.otn-design-new .wp-block-search__input {
	height: 44px;
	padding: 0 var(--ot-sp-md);
	border: 1px solid var(--ot-muted);
	border-radius: var(--ot-r-full);
	background: var(--ot-surface);
	font-size: var(--ot-fs-body);
	color: var(--ot-body);
}
.otn-design-new .wp-block-search__input:focus { outline: 2px solid var(--ot-primary-text); outline-offset: 2px; border-color: var(--ot-primary-text); }
.otn-design-new .wp-block-search__button {
	height: 44px;
	padding: 0 var(--ot-sp-md);
	border: 0;
	border-radius: var(--ot-r-full);
	background: var(--ot-primary-text);
	color: #fff;
	font-size: var(--ot-fs-sm);
	font-weight: 700;
}
.otn-design-new .wp-block-search__button:hover { background: var(--ot-primary-hover); }

/* 8. フッター --------------------------------------------------------------- */
.otn-design-new .footer {
	margin-top: var(--ot-sp-section);
	padding: var(--ot-sp-xxl) 0 var(--ot-sp-xl);
	border-top: 1px solid var(--ot-border);
	background: var(--ot-surface-subtle);
	color: var(--ot-muted);
	font-size: var(--ot-fs-sm);
}
.otn-design-new .footer a { color: var(--ot-ink); }
.otn-design-new .footer a:hover { color: var(--ot-primary-text); }
.otn-design-new .logo-footer { padding: 0; margin: 0 0 var(--ot-sp-md); line-height: 0; }
.otn-design-new .logo-footer a.site-name { width: 176px; height: 70px; }
.otn-design-new .footer .menu-footer a { font-size: var(--ot-fs-sm); font-weight: 500; }
.otn-design-new .footer .copyright { font-size: var(--ot-fs-xs); color: var(--ot-muted); }
.otn-design-new .mobile-menu-buttons { background: var(--ot-surface); border-top: 1px solid var(--ot-border); }
.otn-design-new .mobile-menu-buttons a { color: var(--ot-ink); }

/* 9. 共通部品（ボタン・タグ・パンくず・ページ送り・クレジット） ------------------------- */
.otn-design-new .single-actress-content .actress-affiliate-button,
.otn-design-new .single-video-content .video-affiliate-button {
	display: flex; /* inline-flex だと PC 幅で「サンプル動画あり」の吹き出しと横並びになる（元は block） */
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 420px;
	min-height: 48px;
	margin: 0 auto;
	padding: 12px var(--ot-sp-lg);
	border-radius: var(--ot-r-full);
	background: var(--ot-cta-bg);
	color: var(--ot-cta-fg);
	font-size: var(--ot-fs-body);
	font-weight: 700;
	letter-spacing: var(--ot-ls);
	line-height: var(--ot-lh-label);
	box-shadow: none;
}
.otn-design-new .single-actress-content .actress-affiliate-button:hover,
.otn-design-new .single-video-content .video-affiliate-button:hover { background: var(--ot-cta-hover); color: var(--ot-cta-fg); opacity: 1; text-decoration: none; }
.otn-design-new .single-actress-content .actress-affiliate-cta,
.otn-design-new .single-video-content .video-affiliate-cta { margin: var(--ot-sp-xl) 0; }
.otn-design-new .single-actress-content .tax-link,
.otn-design-new .single-video-content .tax-link,
.otn-design-new .single-video-content .video-tags .tax-link--tag {
	display: inline-flex;
	align-items: center;
	margin: 0 var(--ot-sp-sm) var(--ot-sp-sm) 0;
	padding: 4px 12px;
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-full);
	background: var(--ot-surface);
	color: var(--ot-primary-text);
	font-size: var(--ot-fs-xs);
	font-weight: 500;
	line-height: 1.6;
}
.otn-design-new .single-actress-content .tax-link:hover,
.otn-design-new .single-video-content .tax-link:hover { background: var(--ot-primary-soft); border-color: var(--ot-primary-border); color: var(--ot-primary-hover); text-decoration: none; }
.otn-design-new .otona-breadcrumb,
.otn-design-new .breadcrumb { margin: 0 0 var(--ot-sp-lg); font-size: var(--ot-fs-xs); color: var(--ot-muted); }
/* パンくずのリンクは常にリンク色＋下線（2026-11-12 ユーザー指示＝リンクだと分かるように）。現在ページ（リンクでない部分）は灰色のまま。ホバーは濃い青緑 */
.otn-design-new .otona-breadcrumb a, .otn-design-new .breadcrumb a { color: var(--ot-primary-text); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.otn-design-new .otona-breadcrumb a:hover, .otn-design-new .breadcrumb a:hover { color: var(--ot-primary-hover); text-decoration: underline; }
.otn-design-new .archive-actress-content .otona-breadcrumb--bottom,
.otn-design-new .single-actress-content .otona-breadcrumb--bottom,
.otn-design-new .single-video-content .otona-breadcrumb--bottom { margin: var(--ot-sp-section) 0 0; }
.otn-design-new .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	width: auto; /* Cocoon が width:46px を当てるため「次へ」が折り返す。幅は内容に合わせる */
	height: 44px;
	margin: 0 4px;
	padding: 0 14px;
	line-height: 1;
	white-space: nowrap;
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-full);
	background: var(--ot-surface);
	color: var(--ot-ink);
	font-size: var(--ot-fs-sm);
	font-weight: 700;
}
.otn-design-new a.page-numbers:hover { border-color: var(--ot-primary-border); background: var(--ot-primary-soft); color: var(--ot-primary-hover); text-decoration: none; }
.otn-design-new .page-numbers.current { border-color: var(--ot-primary-text); background: var(--ot-primary-text); color: #fff; }
.otn-design-new .page-numbers.dots { border: 0; background: transparent; min-width: 0; }
.otn-design-new .archive-actress-content .fanza-api-credit,
.otn-design-new .single-actress-content .fanza-api-credit,
.otn-design-new .single-video-content .fanza-api-credit { margin-top: var(--ot-sp-xxl); font-size: var(--ot-fs-xs); color: var(--ot-muted); }

/* 10. 女優一覧 ------------------------------------------------------------- */
.otn-design-new .archive-actress-content h1 { margin: 0 0 var(--ot-sp-lg); font-size: var(--ot-fs-display); line-height: 1.45; }
.otn-design-new .archive-actress-content .actress-archive-grid {
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: var(--ot-sp-lg) var(--ot-sp-md);
	margin: var(--ot-sp-lg) 0 var(--ot-sp-xl);
}
.otn-design-new .archive-actress-content .actress-archive-grid a { display: block; color: var(--ot-ink); }
.otn-design-new .archive-actress-content .actress-archive-grid a:hover { text-decoration: none; }
.otn-design-new .archive-actress-content .actress-archive-grid img {
	aspect-ratio: 1 / 1; /* PC は正方形（2026-11-12 ユーザー指示）。600px 未満は下の media で 3:4 */
	object-fit: cover;
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-lg);
	background: var(--ot-surface-subtle);
	transition: border-color .15s;
}
.otn-design-new .archive-actress-content .actress-archive-grid a:hover img { border-color: var(--ot-primary-border); }
.otn-design-new .archive-actress-content .actress-archive-grid .name { margin-top: var(--ot-sp-sm); font-size: var(--ot-fs-sm); font-weight: 700; line-height: var(--ot-lh-label); color: var(--ot-ink); }
.otn-design-new .archive-actress-content .actress-archive-grid a:hover .name { color: var(--ot-primary-text); }
.otn-design-new .archive-actress-content .actress-archive-grid .yomi { margin-top: 2px; font-size: var(--ot-fs-xs); color: var(--ot-muted); opacity: 1; }
.otn-design-new .archive-actress-content .actress-archive-guide-links { margin-top: var(--ot-sp-section); }
/* 2026-11-12: 導入文と一行説明（デビュー年・ひとこと）。一行説明が読める幅にするため、600px 未満は3列→2列 */
.otn-design-new .archive-actress-content .actress-archive-lead { margin: 0 0 var(--ot-sp-lg); font-size: var(--ot-fs-sm); line-height: 1.9; color: var(--ot-ink); }
.otn-design-new .archive-actress-content .actress-archive-grid .meta { margin-top: 2px; font-size: var(--ot-fs-xs); color: var(--ot-muted); opacity: 1; }
.otn-design-new .archive-actress-content .actress-archive-grid .blurb { margin-top: var(--ot-sp-xs, 4px); font-size: var(--ot-fs-xs); line-height: 1.6; color: var(--ot-ink); }
@media (max-width: 599px) {
	.otn-design-new .archive-actress-content .actress-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ot-sp-md) var(--ot-sp-sm); }
	.otn-design-new .archive-actress-content .actress-archive-grid img { aspect-ratio: 3 / 4; }
	.otn-design-new .archive-actress-content .actress-archive-grid .name { font-size: var(--ot-fs-xs); }
	.otn-design-new .archive-actress-content .actress-archive-grid .yomi { display: none; }
}

/* 11. 女優詳細 ------------------------------------------------------------- */
.otn-design-new .single-actress-content .actress-name { margin: 0 0 var(--ot-sp-xs); font-size: var(--ot-fs-display); line-height: 1.45; }
.otn-design-new .single-actress-content .actress-yomigana { margin: 0 0 var(--ot-sp-md); font-size: var(--ot-fs-sm); color: var(--ot-muted); }
.otn-design-new .single-actress-content .actress-affiliate-disclosure,
.otn-design-new .single-video-content .video-affiliate-disclosure { margin: 0 0 var(--ot-sp-lg); font-size: var(--ot-fs-xs); color: var(--ot-muted); }
.otn-design-new .single-actress-content .actress-profile-row {
	gap: var(--ot-sp-lg);
	margin: 0 0 var(--ot-sp-lg);
	padding: var(--ot-sp-lg);
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-lg);
	background: var(--ot-surface);
	box-shadow: var(--ot-shadow-card);
}
.otn-design-new .single-actress-content .actress-profile-image img { width: 180px; border-radius: var(--ot-r-lg); }
.otn-design-new .single-actress-content .actress-profile-table,
.otn-design-new .single-video-content .video-meta-table { width: 100%; border-collapse: collapse; font-size: var(--ot-fs-sm); line-height: var(--ot-lh-sm); }
.otn-design-new .single-actress-content .actress-profile-table th,
.otn-design-new .single-actress-content .actress-profile-table td,
.otn-design-new .single-video-content .video-meta-table th,
.otn-design-new .single-video-content .video-meta-table td {
	padding: 10px 12px;
	border: 0;
	border-bottom: 1px solid var(--ot-border);
	background: transparent;
	text-align: left;
	vertical-align: top;
}
.otn-design-new .single-actress-content .actress-profile-table th,
.otn-design-new .single-video-content .video-meta-table th { width: 7em; color: var(--ot-muted); font-weight: 500; white-space: nowrap; }
.otn-design-new .single-actress-content .actress-profile-table td,
.otn-design-new .single-video-content .video-meta-table td { color: var(--ot-ink); }
.otn-design-new .single-actress-content .actress-profile-table tr:last-child th,
.otn-design-new .single-actress-content .actress-profile-table tr:last-child td,
.otn-design-new .single-video-content .video-meta-table tr:last-child th,
.otn-design-new .single-video-content .video-meta-table tr:last-child td { border-bottom: 0; }
.otn-design-new .single-actress-content .actress-works-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: var(--ot-sp-lg) var(--ot-sp-md);
	margin: var(--ot-sp-lg) 0 0;
}
.otn-design-new .single-actress-content .actress-work-item { margin: 0; }
.otn-design-new .single-actress-content .actress-work-item img { width: 100%; max-width: 100%; margin: 0; border: 1px solid var(--ot-border); border-radius: var(--ot-r-md); background: var(--ot-surface-subtle); }
.otn-design-new .single-actress-content .actress-work-title { margin: var(--ot-sp-sm) 0 0; font-size: var(--ot-fs-sm); line-height: var(--ot-lh-head); }
.otn-design-new .single-actress-content .actress-work-title a { color: var(--ot-ink); }
.otn-design-new .single-actress-content .actress-work-title a:hover { color: var(--ot-primary-text); }
.otn-design-new .single-actress-content .actress-editorial,
.otn-design-new .single-video-content .video-editorial { margin-top: var(--ot-sp-section); }
.otn-design-new .single-actress-content .actress-editorial p,
.otn-design-new .single-video-content .video-editorial p { margin: 0 0 var(--ot-sp-lg); }
.otn-design-new .single-actress-content .actress-others-grid { gap: var(--ot-sp-md) var(--ot-sp-sm); }
.otn-design-new .single-actress-content .actress-others-grid img { border-radius: var(--ot-r-md); border: 1px solid var(--ot-border); }
.otn-design-new .single-actress-content .actress-others-grid span { margin-top: var(--ot-sp-xs); font-size: var(--ot-fs-xs); color: var(--ot-ink); }
.otn-design-new .otn-inline-works .otn-inline-work img { border-radius: var(--ot-r-md); border: 1px solid var(--ot-border); }
.otn-design-new .otn-inline-works .otn-inline-work figcaption { font-size: var(--ot-fs-xs); color: var(--ot-muted); line-height: var(--ot-lh-label); }
@media (max-width: 599px) {
	.otn-design-new .single-actress-content .actress-profile-row { padding: var(--ot-sp-md); }
	.otn-design-new .single-actress-content .actress-profile-image img { width: 140px; }
	.otn-design-new .single-actress-content .actress-works-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ot-sp-md) var(--ot-sp-sm); }
}

/* 12. 作品詳細 ------------------------------------------------------------- */
.otn-design-new .single-video-content .video-title { margin: 0 0 var(--ot-sp-md); font-size: var(--ot-fs-h2); line-height: 1.5; }
.otn-design-new .single-video-content .video-package-image img { border-radius: var(--ot-r-lg); box-shadow: var(--ot-shadow-card); border: 1px solid var(--ot-border); }
.otn-design-new .single-video-content .starring-actress-name { color: var(--ot-ink); }
.otn-design-new .single-video-content .video-meta-heading { margin-top: var(--ot-sp-xxl); }
.otn-design-new .single-video-content .video-sample-gallery { gap: var(--ot-sp-md); margin: var(--ot-sp-lg) 0; }
.otn-design-new .single-video-content .video-sample-gallery img { border-radius: var(--ot-r-md); border: 1px solid var(--ot-border); }
.otn-design-new .single-actress-content .actress-cta-balloon,
.otn-design-new .single-video-content .video-cta-balloon {
	padding: 4px 14px;
	border: 1px solid #ffc9a8; /* CTA が橙なので吹き出しも橙系（2026-11-13 裁定で固定） */
	border-radius: var(--ot-r-full);
	background: #fff4ec;
	color: #b64a08;
	font-size: var(--ot-fs-xs);
	box-shadow: none;
}
.otn-design-new .single-actress-content .actress-cta-balloon::after,
.otn-design-new .single-video-content .video-cta-balloon::after { border-top-color: #ffc9a8; filter: none; }
.otn-design-new .single-video-content .video-guide-links { margin-top: var(--ot-sp-section); }
.otn-design-new .vh-page .vh-grid { gap: var(--ot-sp-md); }
.otn-design-new .vh-page .vh-card { border: 1px solid var(--ot-border); border-radius: var(--ot-r-lg); box-shadow: var(--ot-shadow-card); }
.otn-design-new .vh-page .vh-card-thumb { background: var(--ot-surface-subtle); }
.otn-design-new .vh-page .vh-card-body { padding: var(--ot-sp-md); }
.otn-design-new .vh-page .vh-card-actress { font-size: var(--ot-fs-xs); color: var(--ot-muted); }
.otn-design-new .vh-page .vh-card-title { font-size: var(--ot-fs-sm); line-height: var(--ot-lh-head); }
.otn-design-new .vh-page .vh-card-title a { color: var(--ot-ink); }
.otn-design-new .vh-page .vh-card-desc { font-size: var(--ot-fs-sm); color: var(--ot-body); }
.otn-design-new .vh-page .video-related-works-more { font-size: var(--ot-fs-sm); font-weight: 700; }
.otn-design-new .entry-content .vh-page h3.vh-card-title { margin: 0 0 var(--ot-sp-sm); padding: 0; border: 0; font-size: var(--ot-fs-sm); line-height: var(--ot-lh-head); } /* 2026-11-13: 本文 h3 の装飾（上余白 32px・下線・短い青緑線）がカード見出しに及んでいたのを外す */
.otn-design-new .entry-content .vh-page h3.vh-card-title::after { content: none; }
.otn-design-new .vh-page .vh-card-actress { margin: 0 0 var(--ot-sp-xs); }
.otn-design-new .vh-page .vh-card-actress a { color: var(--ot-muted); }
.otn-design-new .vh-page .vh-card-actress a:hover { color: var(--ot-primary-hover); }
.otn-design-new .vh-page .vh-lead { color: var(--ot-body); }
.otn-design-new .vh-page .toc .toc-list > li > ol { display: none; } /* 2026-11-13: 作品一覧ハブの目次は節（h2）だけにする。作品名（h3）103件が目次に全部並んでいた。ハブ限定・他ページの目次は従来どおり */

/* 13. 関連記事カード・同人カード（色は tokens.css の --seo-* 接続で揃う。形だけここで） ------- */
.otn-design-new a.ot-card, .otn-design-new .entry-content a.ot-card { border-radius: var(--ot-r-lg); box-shadow: var(--ot-shadow-card); }
.otn-design-new .ot-card__chip { background: var(--ot-primary-soft); color: var(--ot-primary-text); }
.otn-design-new .ot-card__thumb--text { background: var(--ot-primary-soft); color: var(--ot-primary-hover); }
.otn-design-new .ot-card-single__tab, .otn-design-new .ot-doujin__tab { border-radius: var(--ot-r-sm); }
.otn-design-new .ot-doujin { border-radius: var(--ot-r-lg); box-shadow: var(--ot-shadow-card); }
.otn-design-new .ot-doujin a.ot-doujin__item { border-radius: var(--ot-r-md); }

/* 11b. 記事ページ下部（共通リンク色 .otn-design-new a の巻き込みを戻す。2026-11-12 ユーザー指摘） ----------
   関連記事カード・SNS シェア・前後記事・カテゴリーラベルは a 要素の中に本文や色付きボタンがあるため、
   青緑の文字色が内側まで及んでいた。現状デザインと同じ役割の色に戻す */
.otn-design-new .related-entry-card-snippet { color: var(--ot-body); }
.otn-design-new .related-entry-card-link:hover { text-decoration: none; }
.otn-design-new .related-entry-card-link:hover .related-entry-card-title { color: var(--ot-primary-text); }
/* SNS シェアボタンの色は第14節（2026-11-13）へ */
.otn-design-new .pager-post-navi .prev-post-title,
.otn-design-new .pager-post-navi .next-post-title { color: var(--ot-ink); }
.otn-design-new .pager-post-navi a:hover { text-decoration: none; }
.otn-design-new .pager-post-navi a:hover .prev-post-title,
.otn-design-new .pager-post-navi a:hover .next-post-title { color: var(--ot-primary-text); }
.otn-design-new .entry-categories-tags a { color: #fff; background: var(--ot-primary-text); border: 0; border-radius: var(--ot-r-full); } /* 記事末尾の「ガイド」ラベル＝他の cat-label と同じ見た目 */
.otn-design-new .entry-categories-tags a:hover { color: #fff; background: var(--ot-primary-hover); text-decoration: none; }

/* 12. モバイル（600px 未満）の h1（2026-11-12 ユーザー指示） ---------------------------------
   全ページの h1 を margin 0・padding 0・22px（h2 と同じ大きさで可）。ロゴの h1（.logo-header）は対象外。
   h1 の直後の要素に上余白が無いページだけ、直後の要素に 16px を足す。
   セレクタは上の各節と同じ強さにして、後に書くことで勝たせている（Cocoon の 480px 以下の entry-title の padding も打ち消す） */
@media (max-width: 599px) {
	.otn-design-new .entry-title,
	.otn-design-new .archive-title,
	.otn-design-new .archive-actress-content h1,
	.otn-design-new .single-actress-content .actress-name,
	.otn-design-new .single-video-content .video-title,
	.otn-design-new h1:not(.logo-header) {
		margin: 0;
		padding: 0;
		font-size: 22px;
	}
	/* #main の上の内側余白を 0 に（2026-11-12 ユーザー指示）。残るヘッダー下端→h1 の 22px は Cocoon の #content margin-top 10px＋main margin-top 12px で、いったん据え置き */
	.otn-design-new .main { padding-top: 0; }
	.otn-design-new .entry-title + *,                            /* 記事詳細＝アイキャッチ領域、404＝画像 */
	.otn-design-new .entry-title + .eye-catch-wrap.display-none + *, /* 作品一覧ハブ・固定ページ＝アイキャッチが非表示なので、その次（SNS シェア）に */
	.otn-design-new .archive-title + *,                          /* カテゴリー一覧＝記事カード、検索結果＝検索フォーム（元から16px） */
	.otn-design-new .single-actress-content .actress-name + *,   /* 女優詳細＝読みがな */
	.otn-design-new .archive-actress-content .actress-archive-grid, /* 女優一覧＝顔グリッド（元の 24px を 16px に） */
	.otn-design-new .single-video-content .video-title + * {     /* 作品詳細＝パッケージ画像 */
		margin-top: var(--ot-sp-md);
	}
}

/* 14. SNS シェアボタン（2026-11-13 裁定＝design.md に無い部品は案Aに合わせる） --------------------
   Cocoon 既定の各社ブランド色（黒・青・緑・赤）をやめ、design.md の button-secondary（白地・濃紺文字・ピル形）に。
   橙は CTA 専用なので使わない。記事の上（ss-top＝アイコンが上・文字が下）と下（ss-bottom＝横並び）の両方に効く */
.otn-design-new .sns-share .sns-buttons a {
	background: var(--ot-surface);
	color: var(--ot-ink);
	border: 1px solid var(--ot-border);
	border-radius: var(--ot-r-full);
	height: 44px;
	font-weight: 700;
	box-shadow: none;
}
.otn-design-new .sns-share .sns-buttons a:hover,
.otn-design-new .sns-share .sns-buttons a:focus-visible { opacity: 1; background: var(--ot-primary-soft); border-color: var(--ot-primary-border); color: var(--ot-primary-hover); text-decoration: none; }
.otn-design-new .sns-share .sns-buttons a .social-icon,
.otn-design-new .sns-share .sns-buttons a .button-caption { color: inherit; }
.otn-design-new .sns-share-buttons a .button-caption { font-size: var(--ot-fs-sm); }
.otn-design-new .sns-share.ss-high-and-low-lc a .button-caption.button-caption { font-size: 11px; }
.otn-design-new .sns-share-message { color: var(--ot-muted); font-size: var(--ot-fs-xs); }

/* 15. 年齢確認モーダル（Age Gate プラグイン v3・本番のみ。Local では無効化してあるため、確認は output/20261112_otona-tsushin/preview/age-gate-mock.html で） ----
   プラグインの CSS は --ag-* 変数で見た目を決める。body（.otn-design-new）に変数を置くと、プラグインが :root に出す設定値より
   モーダル（body の子孫）に近いので勝つ。「はい」＝CTA（橙ピル）、「いいえ」＝button-secondary（白地・濃紺・枠線） */
.otn-design-new {
	--ag-background-color: var(--ot-ink);
	--ag-background-opacity: .78;
	--ag-blur: 6px;
	--ag-form-background: var(--ot-surface);
	--ag-form-radius: var(--ot-r-lg);
	--ag-form-shadow: 0 16px 48px rgba(8, 29, 73, .28);
	--ag-form-padding: var(--ot-sp-xl) var(--ot-sp-lg);
	--ag-form-max-width: 480px;
	--ag-text-color: var(--ot-body);
	--ag-text-heading-size: 13px;
	--ag-text-heading-weight: 500;
	--ag-text-heading-margin: 0 0 var(--ot-sp-md);
	--ag-text-headline-size: 24px;
	--ag-text-headline-weight: 700;
	--ag-text-headline-margin: 0 0 var(--ot-sp-sm);
	--ag-text-subheadline-size: var(--ot-fs-sm);
	--ag-text-subheadline-weight: 400;
	--ag-text-subheadline-margin: 0 0 var(--ot-sp-lg);
	--ag-button-radius: var(--ot-r-full);
	--ag-button-padding: 12px var(--ot-sp-lg);
	--ag-button-size: 15px;
	--ag-button-weight: 700;
	--ag-button-gap: var(--ot-sp-sm);
	--ag-button-color-background: var(--ot-cta-bg);
	--ag-button-color-text: var(--ot-cta-fg);
	--ag-button-color-hover: var(--ot-cta-hover);
	--ag-button-color-text-hover: var(--ot-cta-fg);
	--ag-remember-size: var(--ot-fs-xs);
	--ag-remember-margin: var(--ot-sp-md) 0 0;
	--ag-text-error-color: var(--ot-error);
	--ag-loader-color: #fff;
}
.otn-design-new .age-gate { font-family: var(--ot-font); line-height: var(--ot-lh-head); letter-spacing: var(--ot-ls); }
.otn-design-new .age-gate h1.age-gate__heading-title { margin: 0 0 var(--ot-sp-md); padding: 0; font-size: 13px; font-weight: 500; color: var(--ot-muted); line-height: 1.5; }
.otn-design-new .age-gate h2.age-gate__headline { margin: 0 0 var(--ot-sp-sm); padding: 0; border: 0; background: none; font-size: 24px; color: var(--ot-ink); }
.otn-design-new .age-gate h2.age-gate__headline::before { content: none; }
.otn-design-new .age-gate .age-gate__subheadline { color: var(--ot-body); }
.otn-design-new .age-gate .age-gate__challenge { margin: 0 0 var(--ot-sp-md); font-size: var(--ot-fs-body); font-weight: 700; color: var(--ot-ink); }
.otn-design-new .age-gate .age-gate__fields { margin: 0 auto; }
.otn-design-new .age-gate .age-gate__buttons { flex-wrap: wrap; }
.otn-design-new .age-gate button.age-gate__submit { flex: 1 1 200px; min-height: 48px; line-height: 1.4; font-family: inherit; transition: background-color .15s, border-color .15s, color .15s; }
.otn-design-new .age-gate button.age-gate__submit--no { background: var(--ot-surface); color: var(--ot-ink); border: 1px solid var(--ot-border); }
.otn-design-new .age-gate button.age-gate__submit--no:hover,
.otn-design-new .age-gate button.age-gate__submit--no:focus { background: var(--ot-primary-soft); color: var(--ot-primary-hover); border: 1px solid var(--ot-primary-border); }
.otn-design-new .age-gate .age-gate__remember-text { color: var(--ot-muted); }
.otn-design-new .age-gate .age-gate__remember-field { accent-color: var(--ot-primary-text); }
@media (max-width: 599px) {
	.otn-design-new { --ag-form-padding: var(--ot-sp-lg) var(--ot-sp-md); --ag-text-headline-size: 22px; }
	.otn-design-new .age-gate h2.age-gate__headline { font-size: 22px; }
	.otn-design-new .age-gate .age-gate__buttons { flex-direction: column-reverse; } /* 「はい」を上に */
	.otn-design-new .age-gate button.age-gate__submit { flex-basis: auto; width: 100%; }
}