@charset "UTF-8";
/*
 * デザイン v2 — 本文の組み（記事・固定ページ・一覧・サイドバー）。TOP 以外のページで読み込む（inc/design-v2.php）。
 * 色・書体の変数は design-v2.css（.caco-v2 の下）のものを使う。部品（[caco_*]）と SWELL のブロックの見た目には立ち入らない。
 *
 * ねらい（2026-10-19 本人「文章の羅列で読みにくい」「メリハリ」「余白の微調整」「押せる範囲」「変な改行・はみ出しを無くす」）
 * - 本文: 16px（PC 17px）・行の高さ 1.9〜2・段落の間 1.8em。PC の1行を 45 字前後に収める
 * - 目印: 太字は朱の淡い下線、箇条書きは淡い地の囲み、番号は朱の明朝の数字
 * - 改行: 見出し・題・表の見出しは文節で折り返し（word-break: auto-phrase）、行の長さをそろえる（text-wrap: balance）
 * - 押せる範囲: 目次・サイドバーの一覧は高さ 36px 以上、タグは 32px 以上。小さい字は 12px 以上
 */

/* ─── 改行: 文節で折り返し、1〜2文字だけの行を作らない ─── */

.caco-v2 :is(h1, h2, h3, h4, .c-pageTitle__inner, .c-postTitle__ttl, .p-postList__title, .swell-block-accordion__title, .wp-block-latest-posts__post-title) {
	word-break: auto-phrase;
	text-wrap: balance;
}

.caco-v2 .l-mainContent .post_content :is(th, dt, figcaption, summary) {
	text-wrap: balance;
}

/* 表の見出しを文節で折り返すのは 960px 以上だけ（狭い画面では表の最小の幅が広がり、横に動かす表になるため） */
@media (min-width: 960px) {
	.caco-v2 .l-mainContent .post_content :is(th, dt, figcaption, summary) {
		word-break: auto-phrase;
	}
}

.caco-v2 .l-mainContent .post_content :is(p, li, dd, td) {
	line-break: strict;
	text-wrap: pretty; /* 最後の行が1文字だけにならない */
}

/* リストの中の文字のリンクは、上下に余白を足して押しやすく（文字のまわりの余白なので、行の組みは変わらない） */
.caco-v2 .l-mainContent .post_content > :is(ul, ol):is(.wp-block-list, :not([class])) li > a {
	padding-top: 0.35em;
	padding-bottom: 0.35em;
}

/* 長い URL・英数字で本文の幅からはみ出さない */
.caco-v2 .l-mainContent .post_content :is(p, li, td, dd) a {
	overflow-wrap: anywhere;
}

/* ─── 本文の字・行・段落 ─── */

/* 字の大きさは SWELL の変数で決める（SWELL は #main_content .post_content に var(--swl-fz--content) を当てる。ID 付きなので値ではなく変数を変える） */
.caco-v2 .l-mainContent {
	--swl-fz--content: 16px;
}

.caco-v2 .l-mainContent .post_content {
	letter-spacing: 0.03em;
	color: var(--v2-text);
}

.caco-v2 .l-mainContent .post_content > :is(p, ul, ol, dl, blockquote, .wp-block-group, .wp-block-table, figure):not([class*="caco-"]) {
	margin-bottom: 1.8em;
}

.caco-v2 .l-mainContent .post_content :is(p, li, dd):where(:not(.post_content [class*="caco-"] *)) {
	line-height: 1.9;
}

@media (min-width: 960px) {
	.caco-v2 .l-mainContent {
		--swl-fz--content: 17px;
	}

	.caco-v2 .l-mainContent .post_content :is(p, li, dd):where(:not(.post_content [class*="caco-"] *)) {
		line-height: 2;
	}
}

/* 書き出しの段落（記事の導入）は少し大きく、墨で */
.caco-v2 .l-mainContent .post_content:not(.p-blogParts) > p:first-child:not([class*="caco-"]) {
	font-size: 1.06em;
	color: var(--v2-ink);
}

/* 太字は朱の淡い下線（文章の中の目印）。蛍光ペンを含む太字・背景のある入れ物の中・表・見出し・ボタンの中は外す。色は段落の色を受け継ぐ */
.caco-v2 .l-mainContent .post_content :is(p, li, dd) > :is(strong, b):not([class]):not(:has(.swl-marker, mark)):not(:is(.has-background, .wp-block-cover) *) {
	background: linear-gradient(transparent 62%, rgba(193, 18, 31, 0.14) 62%);
	font-weight: 700;
}

/* SWELL の蛍光ペン（緑・青・黄・橙）を、v2 の色（朱と墨の淡い色）に寄せる */
.caco-v2 {
	--color_mark_green: #f4d4d7;
	--color_mark_yellow: #f4d4d7;
	--color_mark_orange: #f1c9cd;
	--color_mark_blue: #e4e4e4;
}

/* ─── 見出しの間（本文の章立てを、余白で見分ける） ─── */

.caco-v2 .l-mainContent .post_content h2:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title):not([class*="caco-"]):not(.has-background)) {
	margin-top: 3.4em;
	margin-bottom: 1.3em;
	font-size: 1.4em;
}

.caco-v2 .l-mainContent .post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title):not([class*="caco-"]):not(.has-background)) {
	margin-top: 2.6em;
	margin-bottom: 1em;
	font-size: 1.18em;
}

.caco-v2 .l-mainContent .post_content h4:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title):not([class*="caco-"]):not(.has-background)) {
	margin-top: 2.2em;
	margin-bottom: 0.8em;
	font-size: 1.05em;
}

/* 見出しのすぐ下の画像との間 */
.caco-v2 .l-mainContent .post_content :is(h2, h3) + figure:not(.caco-pexels-h2-img) {
	margin-top: 0;
}

/* コラムの見出しの写真は見出しの前に入る（inc/pexels.php）。写真の上を節の区切りとして空け、写真と見出しの間を詰める */
.caco-v2 .l-mainContent .post_content > .caco-pexels-h2-img {
	margin: 3.2em 0 1.4em;
}

.caco-v2 .l-mainContent .post_content > .caco-pexels-h2-img + h2 {
	margin-top: 0;
}

/* ─── 箇条書き: 淡い地の囲みと朱の点。番号付きは朱の明朝の数字（普通のリストだけ。SWELL のリストの型・ブロックのリストは外す） ─── */

.caco-v2 .l-mainContent .post_content > :is(ul, ol):is(.wp-block-list, :not([class])) {
	padding: 1.1em 1.4em 1.1em 2.6em;
	border-radius: 6px;
	background: var(--v2-wash);
}

.caco-v2 .l-mainContent .post_content > :is(ul, ol):is(.wp-block-list, :not([class])) > li {
	margin: 0;
	padding: 0.3em 0 0.3em 0.25em;
}

.caco-v2 .l-mainContent .post_content > :is(ul, ol):is(.wp-block-list, :not([class])) > li::marker {
	color: var(--v2-shu);
}

.caco-v2 .l-mainContent .post_content > ol:is(.wp-block-list, :not([class])) > li::marker {
	font-family: var(--v2-mincho);
	font-weight: 800;
}

/* 入れ子のリストは囲まず、点だけ */
.caco-v2 .l-mainContent .post_content > :is(ul, ol) li :is(ul, ol) {
	margin: 0.3em 0 0;
	padding-left: 1.2em;
}

/* style.css の「行の hover で地を付けて字下げする」動きは、本文のリストでは止める（読むときに揺れる）。
 * 字下げは style.css の hover でないときの値（0.25em）に戻す。部品の中のリストは部品の指定のまま */
.caco-v2 .l-mainContent .post_content :is(ul, ol) li:where(:not(.post_content [class*="caco-"] *):not([class*="is-style-"] > li)):hover {
	padding-left: 0.25em;
	background: none;
	color: inherit;
}

.caco-v2 .l-mainContent .post_content dl:not([class]) :is(dt, dd):where(:not(.post_content [class*="caco-"] *)):hover {
	background: none;
	color: inherit;
}

/* ─── 引用・画像・表 ─── */

.caco-v2 .l-mainContent .post_content > blockquote {
	padding: 1.2em 1.4em;
	border: 0;
	border-left: 3px solid var(--v2-ink);
	border-radius: 0 6px 6px 0;
	background: var(--v2-wash);
	color: var(--v2-ink);
	font-size: 0.97em;
}

.caco-v2 .l-mainContent .post_content > blockquote::before,
.caco-v2 .l-mainContent .post_content > blockquote::after {
	content: none;
}

.caco-v2 .l-mainContent .post_content :is(.wp-block-image:not(.is-style-rounded), .caco-pexels-h2-img) img {
	border-radius: 6px;
}

.caco-v2 .l-mainContent .post_content figcaption {
	margin-top: 0.6em;
	font-size: 13px;
	line-height: 1.6;
	color: var(--v2-sub);
	text-align: center;
}

.caco-v2 .l-mainContent .post_content .wp-block-table:not([data-theadfix]) {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* 表の字は少し小さく。詳細度を 0 にして、SWELL・エディターの文字の大きさのクラスが勝つようにする */
:where(.caco-v2 .l-mainContent .post_content) table {
	font-size: 15px;
	line-height: 1.7;
}

@media (max-width: 599px) {
	:where(.caco-v2 .l-mainContent .post_content) table {
		font-size: 14px;
	}
}

/* 表のセル: 数字・日付・語の途中で折り返さない（SWELL は break-all）。入りきらない語だけを折る */
.caco-v2 .l-mainContent .post_content :is(th, td) {
	word-break: normal;
	overflow-wrap: break-word;
}

/* スマホで列の多い表（4列以上）は、1〜3字ずつの縦並びにせず、横に動かせる表にする（figure が横に動く枠） */
@media (max-width: 599px) {
	.caco-v2 .l-mainContent .post_content .wp-block-table:not([data-theadfix]) table:has(tr > :nth-child(4)) {
		min-width: 560px;
	}

	.caco-v2 .l-mainContent .post_content .wp-block-table:not([data-theadfix]) table:has(tr > :nth-child(6)) {
		min-width: 720px;
	}

	.caco-v2 .l-mainContent .post_content .wp-block-table:not([data-theadfix]):has(tr > :nth-child(4))::before {
		content: "表は横に動かせます";
		display: block;
		margin-bottom: 6px;
		font-size: 12px;
		color: var(--v2-sub);
	}

	/* 2列の表（会社の情報など）は、左の見出しの列が細くなりすぎないように */
	.caco-v2 .l-mainContent .post_content table:not(:has(tr > :nth-child(3))) th:first-child {
		width: 6.5em;
		min-width: 6.5em;
	}
}

/* ─── 目次（SWELL の目次） ─── */

.caco-v2 #main_content .p-toc {
	margin: 2.4em auto 2.8em;
	padding: 1.4em 1.6em 1.2em;
	border: 1px solid var(--v2-rule);
	border-radius: 8px;
	background: #fff;
	background-image: none;
	box-shadow: none;
}

.caco-v2 #main_content .p-toc::before,
.caco-v2 #main_content .p-toc::after {
	content: none;
}

.caco-v2 .p-toc .p-toc__ttl {
	margin-bottom: 0.6em;
	padding-bottom: 0.6em;
	border-bottom: 1px solid var(--v2-ink);
	font-family: var(--v2-mincho);
	font-size: 1.1em;
	font-weight: 800;
	letter-spacing: 0.08em;
	color: var(--v2-ink);
	text-align: left;
}

.caco-v2 .p-toc .p-toc__ttl::before {
	color: var(--v2-shu);
}

.caco-v2 .p-toc .p-toc__link {
	display: block;
	padding: 0.45em 0.2em;
	color: var(--v2-ink);
	line-height: 1.6;
	text-decoration: none;
}

.caco-v2 .p-toc .p-toc__link:hover {
	color: var(--v2-shu);
}

.caco-v2 .p-toc .p-toc__list li::before {
	color: var(--v2-shu);
	font-family: var(--v2-mincho);
	font-weight: 800;
}

/* ─── 記事の題まわり（日付・カテゴリ・タグ） ─── */

.caco-v2 :is(.c-categoryList__link, .c-taxList__link, .c-tagList__link) {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 0.25em 0.9em;
	border: 1px solid var(--v2-rule);
	border-radius: 999px;
	background: #fff;
	color: var(--v2-ink);
	font-size: 12px;
	text-decoration: none;
}

.caco-v2 :is(.c-categoryList__link, .c-taxList__link, .c-tagList__link):hover {
	border-color: var(--v2-shu);
	color: var(--v2-shu);
}

.caco-v2 :is(.c-postTimes, .c-postTimes__posted, .c-postTimes__modified) {
	font-size: 12px;
	color: var(--v2-sub);
}

.caco-v2 .c-postTimes.u-thin {
	opacity: 1;
}

/* ─── ページ送り: 白の字に淡い灰の地（SWELL の「地の色」の型）は読みにくいので、白の地・墨の字・枠に。今のページは墨の地 ─── */

.caco-v2 .c-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	margin: 4px;
	padding: 0 0.6em;
	border: 1px solid var(--v2-rule);
	border-radius: 999px;
	background: #fff;
	color: var(--v2-ink);
	font-size: 14px;
	text-decoration: none;
}

.caco-v2 .c-pagination a.page-numbers:hover {
	border-color: var(--v2-shu);
	color: var(--v2-shu);
}

.caco-v2 .c-pagination .page-numbers.current {
	border-color: var(--v2-ink);
	background: var(--v2-ink);
	color: #fff;
}

/* ─── 記事の一覧（カード）: 字の大きさ・題の行・画像の無いカード ─── */

.caco-v2 .p-postList .c-postThumb__cat {
	font-size: 12px;
}

.caco-v2 .p-postList .p-postList__title {
	line-height: 1.6;
}

.caco-v2 .c-postThumb__figure {
	background: var(--v2-wash);
}

/* 関連記事: スマホの2列は題が細く折り返すので、写真を左・題を右にした1列に */
@media (max-width: 599px) {
	.caco-v2 .p-relatedPosts.-type-card .p-postList__item {
		width: 100%;
		margin-bottom: 12px;
	}

	.caco-v2 .p-relatedPosts.-type-card .p-postList__link {
		display: grid;
		grid-template-columns: 120px minmax(0, 1fr);
		align-items: center;
		gap: 12px;
	}

	.caco-v2 .p-relatedPosts.-type-card .p-postList__thumb {
		margin: 0;
	}

	.caco-v2 .p-relatedPosts.-type-card .p-postList__body {
		padding: 0.5em 0.8em 0.5em 0;
	}
}

/* ─── 会話の吹き出し（SWELL）: 色ごとの地（黄・緑など）を、淡い地と細い線にそろえる ─── */

.caco-v2 .c-balloon[data-col] .c-balloon__text {
	border-color: var(--v2-rule);
	background: var(--v2-wash);
	color: var(--v2-text);
}

.caco-v2 .c-balloon.-bln-left[data-col] .c-balloon__before {
	border-right-color: var(--v2-wash);
}

.caco-v2 .c-balloon.-bln-right[data-col] .c-balloon__before {
	border-left-color: var(--v2-wash);
}

/* 料金表（戦略会議）のチェックの印は朱に（緑は v2 の色に無い。フォームの「送信できました」の緑はそのまま） */
.caco-v2 .caco-pricing__items li::before {
	color: var(--v2-shu);
}

/* ─── サイドバー: 一覧は行全体を押せる高さに、印と文字の間をあける ─── */

.caco-v2 .l-sidebar :is(.c-listMenu a, .wp-block-latest-posts__post-title) {
	display: block;
	padding-top: 0.75em;
	padding-bottom: 0.75em;
	line-height: 1.55;
}

.caco-v2 .l-sidebar .c-listMenu > li > a {
	padding-left: 1.9em;
}

.caco-v2 .l-sidebar .c-listMenu > li > a::before {
	left: 0.4em;
}

.caco-v2 .l-sidebar .c-listMenu a::before {
	color: var(--v2-sub);
}


/* ─── 小さすぎる字（12px 未満）を上げる ─── */

.caco-v2 .caco-updated,
.caco-v2 .caco-updated time,
.caco-v2 .caco-footer-columns__date,
.caco-v2 .caco-footer-columns__head-title,
.caco-v2 .caco-column-tabs__count,
.caco-v2 .caco-column-side__count {
	font-size: 12px;
}

.caco-v2 .wpcf7 .required,
.caco-v2 .wpcf7 .optional {
	font-size: 12px;
}

.caco-v2 :is(.caco-prpr__label, .caco-prpr__footnote, .caco-pricing__tagline, .caco-pricing__badge, .caco-prpr__price small, .caco-prpr__cardhead small, .caco-pricing__price-unit small) {
	font-size: 12px;
}

.caco-v2 :is(.p-postList__meta, .p-blogCard__caption, .c-iconBtn__label, .c-fixBtn__label, .c-smallNavTitle) {
	font-size: 12px;
}

.caco-v2 :is(.caco-column-tabs__item, .caco-column-side__item):not(.is-active) :is(.caco-column-tabs__count, .caco-column-side__count) {
	color: var(--v2-sub);
}

/* ─── 相談のページ（/contact/）: 要約とフォーム ─── */

.caco-v2 .l-mainContent .post_content > .v2-contact-intro {
	margin: 0 0 2em;
	padding: 1.3em 1.5em;
	border: 1px solid var(--v2-rule);
	border-left: 4px solid var(--v2-shu);
	border-radius: 0 6px 6px 0;
	background: var(--v2-wash);
}

.caco-v2 .v2-contact-intro__ttl {
	margin: 0 0 0.6em;
	color: var(--v2-ink);
	font-family: var(--v2-mincho);
	font-size: 1.2em;
	font-weight: 800;
}

.caco-v2 .l-mainContent .post_content .v2-contact-intro__list {
	margin: 0;
	padding: 0 0 0 1.3em;
	background: none;
}

.caco-v2 .l-mainContent .post_content .v2-contact-intro__list li {
	margin: 0;
	padding: 0.2em 0;
	line-height: 1.8;
}

/* 入力の文字は 16px（iPhone で入力のときに画面が拡大されないように） */
.caco-v2 .wpcf7 :is(input[type="text"], input[type="email"], input[type="tel"], textarea) {
	font-size: 16px;
}

.caco-v2 .wpcf7 .wpcf7-list-item {
	margin: 0 1.2em 0 0;
}

.caco-v2 .wpcf7 .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	min-height: 44px;
	cursor: pointer;
}

.caco-v2 .wpcf7 :is(input[type="radio"], input[type="checkbox"]) {
	width: 20px;
	height: 20px;
	accent-color: var(--v2-ink);
}

/* 入力の誤りの文字: 白地・淡い赤地でも 4.5:1 以上、14px */
.caco-v2 .wpcf7 .wpcf7-not-valid-tip {
	margin-top: 0.4em;
	color: #a50f19;
	font-size: 14px;
	font-weight: 700;
}

.caco-v2 .caco-cf7-privacy {
	margin: 1.2em 0 0.8em;
	font-size: 14px;
	color: var(--v2-sub);
	text-align: center;
}

.caco-v2 .caco-cf7-actions {
	text-align: center;
}

/* 確認画面の「入力画面に戻る」。入力欄の指定（input.wpcf7-form-control）に負けて、角と間が崩れるため */
.caco-v2 .wpcf7 .caco-cf7-actions input.wpcf7-back {
	margin: 1.5rem 0 0;
	border-radius: 999px;
	min-height: 52px;
}

/* ─── 決めるページの末尾の相談の囲み ─── */

.caco-v2 .l-mainContent .post_content > .v2-endcta {
	margin: 3em 0 1em;
	padding: 1.6em 1.6em 1.8em;
	border-radius: 8px;
	background: var(--v2-ink);
	color: #fff;
	text-align: center;
}

.caco-v2 .v2-endcta__ttl {
	margin: 0 0 0.5em;
	color: #fff;
	font-family: var(--v2-mincho);
	font-size: 1.3em;
	font-weight: 800;
	word-break: auto-phrase;
	text-wrap: balance;
}

.caco-v2 .l-mainContent .post_content .v2-endcta__text {
	margin: 0 0 1.2em;
	color: rgba(255, 255, 255, 0.86);
	font-size: 15px;
	line-height: 1.8;
}

.caco-v2 .l-mainContent .post_content .v2-endcta__action {
	margin: 0;
}

.caco-v2 .l-mainContent .post_content a.v2-endcta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 260px;
	min-height: 52px;
	padding: 0 28px;
	border-radius: 999px;
	background: var(--v2-shu);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
}

.caco-v2 .l-mainContent .post_content a.v2-endcta__btn:hover {
	background: var(--v2-shu-deep);
	color: #fff;
}

.caco-v2 .v2-endcta :focus-visible {
	outline-color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.caco-v2 .l-mainContent .post_content li {
		transition: none;
	}
}