@charset "utf-8";


/* ==========================================================================
   1. トークン
   ========================================================================== */
:root {
	--color-navy: #021632;
	--color-gold: #F3CE6B;
	--color-gold-accent: #D9A63B;

	--color-card-bg: #FBFBFC;
	--color-cream: #F5EFDF;
	--color-remarks-bg: #EDEEF0;
	--color-panel-bg: #FFFFFF;
	--color-border: rgba(11, 46, 92, .15);

	--color-text: #0D141F;
	--color-text-sub: #5F6A79;
	--color-link: #1A5FD6;
	--color-link-hover: #0E44A3;

	--color-link-on-navy: #5C88E6;

	--gradient-cta: linear-gradient(180deg, #238A46, #187035);
	--gradient-cta-sub: linear-gradient(180deg, #F2FDF1, #D8F3D6);
	--color-cta-sub-line: #1C7C3C;

	--gradient-cardtop: linear-gradient(90deg,
		#D9A63B 0%, #F2E8CF 30%, #A4CEB6 72%, #B3C6D7 100%);

	--font-sans: Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
	--font-serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho,
	              "MS PMincho", serif;

	--color-tint: #F5FAFF;
	--color-badge-bg: #FFF4CA;
	--gradient-tablehead: linear-gradient(180deg, #0A3369, #02254B);

	--comparemap-plot-bg-start: #FCF9F0;
	--comparemap-plot-bg: linear-gradient(to top right,
		var(--comparemap-plot-bg-start) 0%, #FBF3DA 55%, #F9E68C 100%);
	--comparemap-axis: rgba(11, 46, 92, .20);
	--comparemap-axislabel: #4A5261;
	--comparemap-plot-h: 300px;
	--comparemap-dot: 26px;

	--fv-h: 390px;

	--card-gutter: 10px;
	--card-pad-x: 20px;
	--card-radius: 12px;
	--gap-groupb: 38px;
}


/* ==========================================================================
   2. ページの地
   ========================================================================== */
body.fundingGuide #maincontents {
	padding-bottom: 38px;
	background-color: var(--color-navy);
	background-image:
		radial-gradient(76.6% 676px at 100% calc(var(--fv-h) + 300px), rgba(40, 155, 220, .31) 0%, rgba(2, 22, 50, 0) 100%);
	background-repeat: no-repeat;
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.85;
	color: var(--color-text);
}


body#fundingGuide #maincontents {
	background-image:
		radial-gradient(76.6% 676px at 100% calc(var(--fv-h) + 300px), rgba(40, 155, 220, .31) 0%, rgba(2, 22, 50, 0) 100%),
		radial-gradient(calc(60px + 55vw) calc(150px + 25vw) at right 3vw top 50px,
			rgba(2, 22, 50, 0) 10%, rgba(2, 22, 50, .25) 45%, rgba(2, 22, 50, 1) 100%),
		url(/images/special/fundingGuide/hero.webp);
	background-repeat: no-repeat;
	background-position: left top, left top, right -48px;
	background-size: auto, auto, calc(560px + 30vw) auto;
}


/* ==========================================================================
   3. セクションカード
   ========================================================================== */

#navi,
#map {
	--card-bg: var(--color-cream);
}

#comparison,
#beginner,
#feature,
#situation,
#faq,
#supervisor {
	--card-bg: var(--color-card-bg);
}

#remarks {
	--card-bg: var(--color-remarks-bg);
}

/*
body#fundingGuide #navi    { --card-gap: 14px; }
body#fundingGuide #map     { --card-gap: 138px; }
*/
body#fundingGuide #remarks { --card-gap: 0; }

body#fundingGuide #maincontents > section:not(#fv) {
	--card-bg: var(--color-panel-bg);

	margin: 0 var(--card-gutter) var(--card-gap, var(--gap-groupb));
	padding: 6px var(--card-pad-x) 24px;
	background-color: var(--card-bg);
	border-radius: var(--card-radius);
}

body#fundingGuide #maincontents > section#navi:not(#fv) {
	--card-bg: var(--color-cream);
}

#maincontents > section#fv {
	margin-bottom: var(--gap-groupb);
}

body#fundingGuide #comparison,
body#fundingGuide #beginner,
body#fundingGuide #feature,
body#fundingGuide #situation,
body#fundingGuide #faq,
body#fundingGuide #supervisor,
body#fundingGuide #remarks {
	background-image: var(--gradient-cardtop);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 6px;
}


/* ==========================================================================
   4. 共通見出しブロック
   ========================================================================== */
body#fundingGuide :is(#navi, #map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child,
body#fundingGuideMethod #modal-navi > #navi > div:first-child {
	position: relative;
	padding: 18px 0 0 16px;
}

/* ==== 2026-08-25 イラスト一時非表示 ここから ====================================

   ============================================================================ */
/*
body#fundingGuide :is(#map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child {
	--illust-w: clamp(150px, 46vw, 200px);
	padding-bottom: calc(var(--illust-w) / 1.2824 + 16px);
	background-color: var(--card-bg);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: var(--illust-w) auto;
	background-blend-mode: multiply;
}

body#fundingGuide #map > div:first-child        { background-image: url(/images/special/fundingGuide/map-illust.webp); }
body#fundingGuide #comparison > div:first-child { background-image: url(/images/special/fundingGuide/comparison-illust.webp); }
body#fundingGuide #beginner > div:first-child   { background-image: url(/images/special/fundingGuide/beginner-illust.webp); }
body#fundingGuide #feature > div:first-child    { background-image: url(/images/special/fundingGuide/feature-illust.webp); }
body#fundingGuide #situation > div:first-child  { background-image: url(/images/special/fundingGuide/situation-illust.webp); }
body#fundingGuide #faq > div:first-child        { background-image: url(/images/special/fundingGuide/faq-illust.webp); }
body#fundingGuide #supervisor > div:first-child { background-image: url(/images/special/fundingGuide/supervisor-illust.webp); }

body#fundingGuide :is(#map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child::before {
	bottom: calc(var(--illust-w) / 1.2824 + 16px);
}
*/
/* ==== 2026-08-25 イラスト一時非表示 ここまで ==================================== */

body#fundingGuide :is(#navi, #map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child::before,
body#fundingGuideMethod #modal-navi > #navi > div:first-child::before {
	content: "";
	position: absolute;
	top: 18px;
	bottom: 0;
	left: 0;
	width: 4px;
	background-color: var(--color-gold-accent);
}

body#fundingGuide :is(#navi, #map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child > p,
body#fundingGuideMethod #modal-navi > #navi > div:first-child > p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--color-text-sub);
}

body#fundingGuide :is(#navi, #map, #comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:first-child > h2,
body#fundingGuideMethod #modal-navi > #navi > div:first-child > h2 {
	margin-top: 6px;
	font-family: var(--font-serif);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .04em;
	color: var(--color-navy);
}


/* ==========================================================================
   5. 本文・リンク
   ========================================================================== */
body#fundingGuide :is(#comparison, #beginner, #feature, #situation, #faq, #supervisor) > div:nth-child(2) > p {
	padding-top: 14px;
	font-size: 16px;
	line-height: 1.85;
	color: var(--color-text);
}

#maincontents a {
	color: var(--color-link);
	text-decoration: underline;
	transition: color .15s ease;
}

#maincontents a:hover {
	color: var(--color-link-hover);
	opacity: 1;
	text-decoration: underline;
}


/* ==========================================================================
   6. CTA
   ========================================================================== */
#maincontents a.cta-1st,
#maincontents a.cta-2nd,
#modal-navi a.cta-1st,
#modal-navi a.cta-2nd,
#fundingGuideMethod #article :is(#pr, #recommendation) > a {
	display: inline-block;
	min-height: 44px;
	padding: 10px 22px;
	border-radius: 6px;
	font-family: var(--font-serif);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
	text-decoration: none;
	transition: box-shadow .15s ease, transform .15s ease;
}

#maincontents a.cta-1st,
#modal-navi a.cta-1st,
#fundingGuideMethod #article :is(#pr, #recommendation) > a {
	background: var(--gradient-cta);
	border: 0;
	color: #FFFFFF;
	box-shadow: 0 2px 5px rgba(0, 0, 0, .18);
}

#maincontents a.cta-1st:hover,
#modal-navi a.cta-1st:hover,
#fundingGuideMethod #article :is(#pr, #recommendation) > a:hover {
	background: var(--gradient-cta);
	color: #FFFFFF;
	opacity: 1;
	box-shadow: 0 5px 12px rgba(0, 0, 0, .38),
	            inset 0 0 0 1px rgba(255, 255, 255, .38);
	transform: translateY(-1px);
}

#maincontents a.cta-2nd,
#modal-navi a.cta-2nd {
	background: var(--gradient-cta-sub);
	border: 1px solid var(--color-cta-sub-line);
	color: var(--color-cta-sub-line);
}

#maincontents a.cta-2nd:hover,
#modal-navi a.cta-2nd:hover {
	background: var(--gradient-cta-sub);
	color: var(--color-cta-sub-line);
	opacity: 1;
	box-shadow: inset 0 0 0 1px var(--color-cta-sub-line),
	            0 4px 10px rgba(2, 22, 50, .30);
	transform: translateY(-1px);
}


/* ==========================================================================
   7. フォーカス表示
   ========================================================================== */
#maincontents a:focus-visible {
	outline: 2px solid var(--color-navy);
	outline-offset: 2px;
}

#fv a:focus-visible {
	outline-color: var(--color-gold);
}

@media (prefers-reduced-motion: reduce) {
	#maincontents a,
	#maincontents a.cta-1st,
	#maincontents a.cta-2nd,
	#modal-navi a.cta-1st,
	#modal-navi a.cta-2nd,
	#fundingGuideMethod #article :is(#pr, #recommendation) > a {
		transition: none;
	}

	#maincontents a.cta-1st:hover,
	#maincontents a.cta-2nd:hover,
	#modal-navi a.cta-1st:hover,
	#modal-navi a.cta-2nd:hover,
	#fundingGuideMethod #article :is(#pr, #recommendation) > a:hover {
		transform: none;
	}
}


/* ==========================================================================
   8. 資金調達かんたん比較表（#comparison）
   ========================================================================== */

#comparison > div:nth-child(2) {
	position: relative;
}

#comparison > div:nth-child(2) > div {
	margin-top: 16px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}

#comparison .scroll-guide {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	right: auto !important;
	z-index: 998;
	margin: -49px 0 0 -79px;
	width: 158px;
	height: 98px;
	background: url(/images/special/fundingGuide/icon_scrollable.png) 0 0 no-repeat;
	background-size: contain;
	opacity: .65;
	pointer-events: none;
	animation: hscrollFluffy 3s ease infinite;
}

@keyframes hscrollFluffy {
	0%, 10% { transform: translateY(0); }
	20%     { transform: translateY(-10px); }
	25%     { transform: translateY(0); }
	30%     { transform: translateY(-10px); }
	50%, 100% { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
	#comparison .scroll-guide {
		animation: none;
	}
}

#comparison table {
	width: auto;
	min-width: 100%;
	table-layout: auto;
	border-collapse: separate;
	border-spacing: 0;
	background-color: var(--color-panel-bg);
	font-size: 16px;
	line-height: 1.55;
}

#comparison thead th {
	padding: 10px;
	white-space: nowrap;
	background: var(--gradient-tablehead);
	color: #FFFFFF;
	font-weight: 700;
	text-align: left;
	vertical-align: middle;
}

#comparison thead th + th {
	border-left: 1px solid rgba(255, 255, 255, .9);
}

#comparison tbody th,
#comparison tbody td {
	padding: 10px;
	white-space: nowrap;
	color: var(--color-text);
	font-weight: 400;
	text-align: left;
	vertical-align: middle;
}

#comparison tbody tr + tr > th,
#comparison tbody tr + tr > td {
	border-top: 1px solid var(--color-border);
}

#comparison tbody th + td,
#comparison tbody td + td {
	border-left: 1px solid var(--color-border);
}

#comparison thead th {
	border-top: 1px solid var(--color-border);
}

#comparison thead th:first-child,
#comparison tbody th {
	border-left: 1px solid var(--color-border);
}

#comparison thead th:last-child,
#comparison tbody td:last-child {
	border-right: 1px solid var(--color-border);
}

#comparison tbody tr:last-child > th,
#comparison tbody tr:last-child > td {
	border-bottom: 1px solid var(--color-border);
}

#comparison thead th:first-child,
#comparison tbody th {
	position: sticky;
	left: 0;
	z-index: 1;
}

#comparison tbody th {
	background-color: var(--color-tint);
	box-shadow: 2px 0 4px rgba(11, 46, 92, .10);
}

#comparison tbody th a {
	color: var(--color-link);
	text-decoration: none;
}

#comparison tbody th a:hover {
	color: var(--color-link-hover);
	text-decoration: underline;
}

#comparison a.to-article {
	display: block;
	min-height: 44px;
	padding: 11px 8px;
	font-size: 16px;
	line-height: 1.5;
	white-space: nowrap;
}


/* ==========================================================================
   9. #beginner / #feature / #situation
   ========================================================================== */

/* --------------------------------------------------------------------------
   9-1. #beginner（読み物）
   -------------------------------------------------------------------------- */
#beginner > div:nth-child(2) > section {
	margin-top: 28px;
}

#beginner h3 {
	margin-bottom: 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--color-border);
	font-family: var(--font-serif);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: .04em;
	color: var(--color-navy);
}

#beginner h4 {
	margin: 22px 0 8px;
	font-family: var(--font-serif);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--color-navy);
}

#beginner h5 {
	margin: 16px 0 6px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--color-text);
}

#beginner p {
	margin-bottom: 12px;
	font-size: 16px;
	line-height: 1.85;
	color: var(--color-text);
}

#beginner ul {
	margin: 0 0 12px;
	padding-left: 1.3em;
	list-style: square;
}

#beginner li {
	font-size: 16px;
	line-height: 1.85;
	color: var(--color-text);
}

#beginner li::marker {
	color: var(--color-gold-accent);
}

#beginner ul.linkList {
	padding-left: 0;
	list-style: none;
}

#beginner ul.linkList > li {
	padding-left: 12px;
	background: url(/images/common/gray-arrow.png) no-repeat left top .6em;
	background-size: 5px auto;
	list-style: none;
}

#beginner ul.linkList > li > a {
	text-decoration: none;
}

#beginner ul.linkList > li > a:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   9-2. #feature（資金調達方法別のカード・1列）
   -------------------------------------------------------------------------- */
#feature > div:nth-child(2) > dl {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-top: 18px;
}

#feature > div:nth-child(2) > dl > div {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 6px;
	background-color: var(--color-panel-bg);
	box-shadow: 0 2px 8px rgba(11, 46, 92, .10);
}

#feature dt {
	padding: 15px 14px;
	background: var(--gradient-tablehead);
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
}

#feature dd {
	margin: 0;
	padding: 0 14px;
}

#feature dd:first-of-type {
	padding-top: 14px;
}

#feature dd:last-of-type {
	margin-top: auto;
	padding-top: 4px;
	padding-bottom: 14px;
}

#feature dd > span {
	display: inline-block;
	margin: 14px 0 8px;
	padding: 3px 7px;
	border-radius: 3px;
	background-color: var(--color-badge-bg);
	color: var(--color-navy);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

#feature ul {
	margin: 0;
	padding-left: 1.2em;
	list-style: disc;
}

#feature dd:first-of-type ul {
	list-style-type: "\2713\0020";
}

#feature dd:nth-of-type(2) ul {
	list-style-type: disc;
}

#feature li {
	font-size: 16px;
	line-height: 1.7;
	color: var(--color-text);
}

#feature li + li {
	margin-top: 6px;
}

#feature a.to-article {
	display: block;
	width: 70%;
	min-height: 44px;
	margin: 0 auto;
	padding: 11px 4px;
	font-size: 16px;
	line-height: 1.5;
}

/* --------------------------------------------------------------------------
   9-3. #situation（状況別・1列）
   -------------------------------------------------------------------------- */
#situation > div:nth-child(2) > dl {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-top: 16px;
}

#situation > div:nth-child(2) > dl > div {
	overflow: hidden;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(11, 46, 92, .10);
}

#situation dt {
	padding: 11px 14px;
	background: var(--gradient-tablehead);
	color: #FFFFFF;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}

#situation dd {
	margin: 0;
	padding: 14px;
	background-color: var(--color-tint);
}

#situation dd > p {
	margin-bottom: 10px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--color-text);
}

#situation dd > ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#situation dd > ul > li > a {
	display: inline-block;
	min-height: 44px;
	padding: 11px 12px;
	border: 1px solid var(--color-border);
	border-radius: 4px;
	background-color: var(--color-panel-bg);
	color: var(--color-link);
	font-size: 16px;
	line-height: 1.5;
	text-decoration: none;
}

#situation dd > ul > li > a:hover {
	border-color: var(--color-link-hover);
	color: var(--color-link-hover);
	text-decoration: underline;
}


/* ==========================================================================
   10. #faq / #supervisor / #remarks
   ========================================================================== */

/* --------------------------------------------------------------------------
   10-1. #faq
   -------------------------------------------------------------------------- */
#faq > div:nth-child(2) > dl {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-top: 18px;
}

#faq > div:nth-child(2) > dl > div {
	overflow: hidden;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	background-color: var(--color-panel-bg);
	box-shadow: 0 2px 6px rgba(11, 46, 92, .08);
}

#faq dt {
	position: relative;
	padding: 13px 14px 13px 52px;
	background-color: var(--color-tint);
	color: var(--color-navy);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: .04em;
}

#faq dd {
	position: relative;
	margin: 0;
	padding: 14px 14px 16px 52px;
	font-size: 16px;
	line-height: 1.9;
	color: var(--color-text);
}

#faq dt::before,
#faq dd::before {
	content: "Q";
	position: absolute;
	left: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
}

#faq dt::before {
	top: 11px;
	background-color: var(--color-navy);
	color: #FFFFFF;
}

#faq dd::before {
	content: "A";
	top: 14px;
	background-color: var(--color-badge-bg);
	color: var(--color-navy);
}

#faq dd a {
	color: var(--color-link);
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   10-2. #supervisor
   -------------------------------------------------------------------------- */
#supervisor > div:nth-child(2) {
	margin-top: 18px;
	padding: 18px;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	background-color: var(--color-panel-bg);
}

#supervisor img {
	display: block;
	width: 40vw;
	max-width: 100%;
	height: auto;
	margin: 0 auto 16px auto;
}

#supervisor :is(h3, h5) {
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--color-navy);
}

#supervisor > div:nth-child(2) p {
	font-size: 16px;
	line-height: 1.3;
	color: var(--color-text);
}

#supervisor > div:nth-child(2) p + p {
	margin-top: 12px;
}

/* --------------------------------------------------------------------------
   10-3. #remarks
   -------------------------------------------------------------------------- */
#remarks > ul {
	margin: 0;
	padding: 16px 0 0 1.15em;
	list-style: disc;
}

#remarks li {
	font-size: 16px;
	line-height: 1.75;
	color: var(--color-text);
}

#remarks li + li {
	margin-top: 8px;
}

#remarks li::marker {
	color: var(--color-navy);
}

#remarks a {
	color: var(--color-link);
	text-decoration: none;
}


/* ==========================================================================
   11. FV（#fv）
   ========================================================================== */
#fv {
	box-sizing: border-box;
	padding: 22px var(--card-gutter) 26px;
}

#fv > span {
	display: block;
	font-size: 16px;
	line-height: 1.5;
	color: #FFFFFF;
}

#fv > h1 {
	margin-top: 6px;
}

#fv > h1 > img {
	display: block;
	width: min(80vw, 350px);
	max-width: 100%;
	height: auto;
}

#fv > div {
	margin-top: 12px;
}

#fundingGuide #fv > div {
	font-size: clamp(15.5px, 4.7vw, 22px);
}

#fv > div > p {
	font-family: var(--font-sans);
	font-weight: 400;
	line-height: 1.75;
	color: #FFFFFF;
}

#fv > div > p > span {
	display: inline-block;
}

#fundingGuide #fv em {
	font-style: normal;
	font-weight: 700;
	white-space: nowrap;
	color: var(--color-gold);
}

#fv > ul {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	box-sizing: border-box;
	width: fit-content;
	max-width: 100%;
	gap: 10px;
	margin: 18px auto 0;
	padding: 0;
	list-style: none;
}

#fv a.cta-1st,
#fv a.cta-2nd {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: 12px 20px;
	font-size: 16px;
	line-height: 1.4;
}


/* ==========================================================================
   12. 資金調達診断（#navi）
   ========================================================================== */

/* --------------------------------------------------------------------------
   12-1. カードの土台とパネル帯
   -------------------------------------------------------------------------- */
body#fundingGuide #maincontents > section#navi,
body#fundingGuideMethod #modal-navi > #navi {
	position: relative;
	overflow: hidden;
}

body#fundingGuide #maincontents > section#navi::before,
body#fundingGuide #maincontents > section#navi::after,
body#fundingGuideMethod #modal-navi > #navi::before,
body#fundingGuideMethod #modal-navi > #navi::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--card-pad-x);
	background-color: var(--card-bg);
	z-index: 1;
	pointer-events: none;
}

body#fundingGuide #maincontents > section#navi::before,
body#fundingGuideMethod #modal-navi > #navi::before { left: 0; }
body#fundingGuide #maincontents > section#navi::after,
body#fundingGuideMethod #modal-navi > #navi::after  { right: 0; }

#navi-panels {
	position: relative;
	display: flex;
	align-items: flex-start;
	margin: 0;
	padding: 0;
	list-style: none;

	--navi-height-floor: none;
}

#navi-panels.sliding {
	transition: height 500ms cubic-bezier(0.42, 0, 0.58, 1);
}

#navi-panels > li.panel {
	flex: 0 0 100%;
	max-width: 100%;
	padding: 0 20px;
}

#navi-panels > li.panel.sub {
	display: none;
}

#navi-panels > li.panel.questionPanel {
	padding-top: 43.6px;
	padding-bottom: 8px;
}

/* --------------------------------------------------------------------------
   12-2. 進捗バー
   -------------------------------------------------------------------------- */
#navi-progress {
	position: absolute;
	left: 16px;
	right: 0;
	min-height: 29.6px;
	visibility: hidden;
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 14px;
}

#navi-progress progress {
	flex: 1 1 auto;
	appearance: none;
	-webkit-appearance: none;
	height: 10px;
	border: 0;
	border-radius: 5px;
	background-color: var(--color-navy);
}

#navi-progress progress::-webkit-progress-bar {
	border-radius: 5px;
	background-color: var(--color-navy);
}

#navi-progress progress::-webkit-progress-value {
	border-radius: 5px;
	background-color: var(--color-gold);
}

#navi-progress progress::-moz-progress-bar {
	border-radius: 5px;
	background-color: var(--color-gold);
}

#navi-progress > span {
	flex: 0 0 auto;
	font-size: 16px;
	font-weight: 700;
	color: #4A5261;
	white-space: nowrap;
}

/* --------------------------------------------------------------------------
   12-3. 質問ステップ
   -------------------------------------------------------------------------- */
#navi .question {
	margin-bottom: 14px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	color: #17263c;
}

#navi .question > span {
	font-size: 16px;
	font-weight: 400;
	color: var(--color-text-sub);
}

#navi ul.options {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#navi ul.options > li {
	box-sizing: border-box;
	min-height: 44px;
	padding: 12px 16px;
	border: 1px solid rgba(11, 46, 92, .28);
	border-radius: 6px;
	background-color: var(--color-panel-bg);
	font-size: 16px;
	line-height: 1.2;
	color: var(--color-navy);
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}

#navi ul.options > li:hover {
	border-color: var(--color-navy);
}

#navi ul.options > li.selected {
	border-color: var(--color-navy);
	background-color: var(--color-navy);
	color: #FFFFFF;
}

#navi ul.options.multiple > li {
	display: flex;
	align-items: center;
	gap: 10px;
}

#navi ul.options.multiple > li::before {
	content: "";
	flex: 0 0 auto;
	box-sizing: border-box;
	width: 15px;
	height: 15px;
	border: 1px solid rgba(11, 46, 92, .38);
	border-radius: 3px;
	background-color: var(--color-panel-bg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 13px 13px;
}

#navi ul.options.multiple > li.selected::before {
	border-color: #FFFFFF;
	background-color: var(--color-navy);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M3 8.4 6.4 11.8 13 4.6'/%3E%3C/svg%3E");
}

#navi .note {
	margin-top: 12px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--color-text-sub);
}

#navi .ctrl {
	margin-top: 20px;
}

#navi .ctrl a {
	width: 100%;
}

#navi .ctrl a.disabled {
	background: #C7CBD1;
	box-shadow: none;
	color: #FFFFFF;
	pointer-events: none;
}

#navi a.return {
	display: block;
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	margin-top: 20px;
	border: 1px solid rgba(11, 46, 92, .28);
	border-radius: 50%;
	background-color: var(--color-panel-bg);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23021632' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M14.5 6 8.5 12l6 6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 24px 24px;
	text-decoration: none;
}

#navi a.return:hover {
	border-color: var(--color-navy);
	opacity: 1;
}

#navi-loading {
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	align-content: center;
	padding: 43.6px 0 32px;
	font-size: 16px;
	text-align: center;
	color: var(--color-text);
}

#navi-loading[style*="display"]:not([style*="none"]) {
	display: flex !important;
}

#navi-panels::after {
	content: "";
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
	background-image: url(/unified/images/spinner.gif);
}

#navi-loading::before {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	margin: 0 auto 10px;
	background: url(/unified/images/spinner.gif) no-repeat center center / contain;
}

/* --------------------------------------------------------------------------
   12-4. 入口パネル（#panel-top）
   -------------------------------------------------------------------------- */
#panel-top {
	display: flex;
	flex-direction: column;
	margin-top: 14px;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	background-color: var(--color-panel-bg);
}

#panel-top > p {
	margin-top: 16px;
	margin-bottom: 0;
	font-size: 16px;
	line-height: 1.85;
	color: var(--color-text);
}

#panel-top > .row {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: space-between;
	gap: 12px;
	margin-top: 14px;
	margin-bottom: 16px;
}

#panel-top .feature {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
	width: 70%;
	margin: 18px auto 0;
	padding: 0;
	list-style: none;
}

#panel-top .feature > li > span {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	padding: 10px 6px;
	border-radius: 4px;
	background-color: var(--color-navy);
	font-size: 20px;
	line-height: 1.3;
	color: #FFFFFF;
	text-align: center;
}

#panel-top .feature > li > span br {
	display: none;
}

#panel-top .feature em {
	font-style: normal;
	font-size: 18px;
	font-weight: 700;
	color: var(--color-gold);
}

#panel-top .ctrl {
	width: 100%;
	margin-top: 0;
	text-align: center;
}

#panel-top .ctrl a {
	display: block;
	padding: 12px 20px;
	font-size: 16px;
}

/* --------------------------------------------------------------------------
   12-5. 結果画面
   -------------------------------------------------------------------------- */
#navi-result {
	display: none;
	padding-top: 6px;
}

#navi-result-list > h3,
#navi-result-comparison > h3 {
	margin-bottom: 14px;
	font-size: 20px;
	font-weight: 700;
	color: var(--color-navy);
}

#navi-result-list > ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#navi-result-list > ul > li {
	padding: 16px;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	background-color: var(--color-panel-bg);
}

#navi-result-list > ul > li + li {
	margin-top: 16px;
}

/* ==== 2026-08-25 イラスト一時非表示 ここから ====================================
   復活のしかた: この見出しの直後にある開始のコメント記号だけの行と、
   対になる終了のコメント記号だけの行、その2行を消すだけでよい。
   （CSS のコメントは入れ子にできないため、この範囲の規則からは行末の注記を外してある）
   候補イラスト（第1〜第3候補・第8-25節の narrow 側）。
   行末に付けていた注記:
     padding-top: 202px → 16px（元の padding）＋ 172px（図版）＋ 14px（本文との間隔）
     background-blend-mode: multiply → 素材の白背景をカード地色になじませる
   ============================================================================ */
/*
#navi-result-list > ul > li[data-recommend="1"],
#navi-result-list > ul > li[data-recommend="2"],
#navi-result-list > ul > li[data-recommend="3"] {
	padding-top: 202px;
	background-repeat: no-repeat;
	background-position: center top 16px;
	background-size: 220px 172px;
	background-blend-mode: multiply;
}

#navi-result-list > ul > li[data-recommend="1"] { background-image: url(/images/special/fundingGuide/rank1-illust.webp); }
#navi-result-list > ul > li[data-recommend="2"] { background-image: url(/images/special/fundingGuide/rank2-illust.webp); }
#navi-result-list > ul > li[data-recommend="3"] { background-image: url(/images/special/fundingGuide/rank3-illust.webp); }
*/
/* ==== 2026-08-25 イラスト一時非表示 ここまで ==================================== */

#navi-result-list .conclusion {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
	color: var(--color-navy);
}

#navi-result-list .conclusion > em {
	padding: 2px 6px;
	background-color: var(--color-gold);
	font-family: var(--font-serif);
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	color: var(--color-navy);
}

#navi-result-list .subtext {
	margin: 0;
	margin-top: 10px;
	padding: 0;
	list-style: none;
	font-size: 16px;
	color: var(--color-text);
}

#navi-result-list .list-box {
	margin-top: 14px;
	padding: 12px 14px;
	border-radius: 6px;
	background-color: #F2F5F9;
}

#navi-result-list .list-box > p {
	margin-bottom: 8px;
	font-size: 16px;
	font-weight: 700;
	color: var(--color-navy);
}

#navi-result-list .list-box > ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#navi-result-list .list-box > ul > li {
	position: relative;
	padding-left: 24px;
	font-size: 16px;
	color: var(--color-text);
}

#navi-result-list .list-box > ul > li + li {
	margin-top: 6px;
}

#navi-result-list .reason > ul > li::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	width: 15px;
	height: 15px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23021632' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 8.6 6 12.1 13.5 3.9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

#navi-result-list .remarks > ul > li::before {
	content: "!";
	position: absolute;
	top: 5px;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: var(--color-navy);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	color: #FFFFFF;
}

#navi-result-list section.links {
	margin-top: 16px;
}

#navi-result-list .to-list {
	margin-top: 16px;
	text-align: center;
}

#navi-result-comparison {
	margin-top: 28px;
}

#navi-result-comparison > div {
	overflow-x: auto;
}

#navi-result-comparison .scroll-guide {
	bottom: 0;
}

#navi-result-comparison table {
	width: 100%;
	min-width: 780px;
	border-collapse: separate;
	border-spacing: 0;
	background-color: var(--color-panel-bg);
	font-size: 16px;
	line-height: 1.55;
}

#navi-result-comparison thead th:first-child,
#navi-result-comparison tbody th {
	position: sticky;
	left: 0;
	z-index: 1;
}

#navi-result-comparison tbody th {
	box-shadow: 2px 0 4px rgba(11, 46, 92, .10);
}

#navi-result-comparison th,
#navi-result-comparison td {
	padding: 10px;
	vertical-align: middle;
}

#navi-result-comparison thead th {
	background-color: var(--color-navy);
	color: #FFFFFF;
	font-weight: 700;
	text-align: center;
}

#navi-result-comparison tbody tr + tr > th,
#navi-result-comparison tbody tr + tr > td {
	border-top: 1px solid var(--color-border);
}

#navi-result-comparison thead th + th {
	border-left: 1px solid rgba(255, 255, 255, .9);
}

#navi-result-comparison tbody th + td,
#navi-result-comparison tbody td + td {
	border-left: 1px solid var(--color-border);
}

#navi-result-comparison tbody tr:last-child > th,
#navi-result-comparison tbody tr:last-child > td {
	border-bottom: 1px solid var(--color-border);
}

#navi-result-comparison thead th {
	border-top: 1px solid var(--color-border);
}

#navi-result-comparison thead th:first-child,
#navi-result-comparison tbody th {
	border-left: 1px solid var(--color-border);
}

#navi-result-comparison thead th:last-child,
#navi-result-comparison tbody td:last-child {
	border-right: 1px solid var(--color-border);
}

#navi-result-comparison tbody th {
	background-color: var(--color-tint);
	font-weight: 400;
	text-align: left;
}

#navi-result-comparison tbody th a {
	color: var(--color-link);
	text-decoration: none;
}

#comparison tbody th a > span,
#navi-result-comparison tbody th a > span {
	display: block;
	line-height:1.2;
}

#navi-result-comparison tbody th a:hover {
	color: var(--color-link-hover);
	text-decoration: underline;
}

#navi-result-comparison tbody td {
	color: var(--color-text);
	text-align: left;
}

#navi-result-comparison tbody td:is(.col-speed, .col-amount, .col-cost, .col-hurdle) {
	text-align: center;
}

#navi-result-comparison table .icon-eval {
	margin-right: 0;
}

#navi-result-comparison .notes {
	margin-top: 10px;
	font-size: 16px;
	color: #4A5261;
}

#navi-retry {
	margin-top: 24px;
	text-align: center;
}

#navi-retry > a.cta-1st {
	width: 100%;
	padding: 12px 20px;
	font-size: 16px;
}

#navi-remarks {
	margin-top: 28px;
}

#navi-remarks > ul {
	margin: 0;
	padding-left: 1.15em;
	list-style: disc;
}

#navi-remarks li {
	font-size: 16px;
	color: #4A5261;
}

#navi-remarks li + li {
	margin-top: 6px;
}

#navi-remarks li::marker {
	color: var(--color-navy);
}

#navi-remarks a {
	color: var(--color-link);
	font-weight: 700;
	text-decoration: underline;
}


/* ==========================================================================
   13. 資金調達比較マップ（#map）
   ========================================================================== */

/* --------------------------------------------------------------------------
   13-1. 説明文
   -------------------------------------------------------------------------- */
#map > div + div > p {
/*	margin-top: 14px;*/
	font-size: 18px;
	line-height: 1.85;
	color: #4d5a6c;
}

/* --------------------------------------------------------------------------
   13-2. 軸の選択
   -------------------------------------------------------------------------- */
#axis-selection {
	--axis-ui: dropdown;
	--axis-row-h: 44px;

/*	margin: 16px 0 0;*/
	padding: 12px 12px 8px;
	background-color: var(--color-panel-bg);
	border: 1px solid var(--color-border);
	border-radius: 8px;
}

#axis-selection > div {
	position: relative;
	padding-bottom: var(--axis-row-h);
	margin: 0 0 10px;
}

#axis-selection > div:is(.open, :focus-within) {
	z-index: 5;
}

#axis-selection > div > span {
	display: block;
	width: auto;
	padding-bottom: 6px;
	font-size: 16px;
	line-height: 1.5;
	color: #4d5a6c;
}

#axis-selection label {
	position: absolute;
	left: 0;
	right: 0;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	height: var(--axis-row-h);
	margin: 0;
	padding: 0 12px;
	background-color: #fff;
	border: 1px solid var(--color-border);
	border-top-width: 0;
	border-radius: 0;
	font-size: 16px;
	color: var(--color-navy);
	opacity: 0;
	pointer-events: none;
}

#axis-selection label:nth-of-type(1) {
	top: calc(100% - var(--axis-row-h));
	border-top-width: 1px;
	border-radius: 6px 6px 0 0;
}

#axis-selection label:nth-of-type(2) { top: 100%; }
#axis-selection label:nth-of-type(3) { top: calc(100% + var(--axis-row-h)); }

#axis-selection label:nth-of-type(4) {
	top: calc(100% + var(--axis-row-h) * 2);
	border-radius: 0 0 6px 6px;
}

#axis-selection > div:not(.open):not(:focus-within) > label.checked {
	top: calc(100% - var(--axis-row-h));
	border-top-width: 1px;
	border-radius: 6px;
	opacity: 1;
	pointer-events: auto;
}

#axis-selection > div:not(.open):not(:focus-within) > label.checked::after {
	content: "";
	box-sizing: border-box;
	width: 9px;
	height: 9px;
	margin-left: auto;
	border: 2px solid var(--comparemap-axislabel);
	border-top: 0;
	border-left: 0;
	transform: rotate(45deg) translate(-2px, -2px);
}

#axis-selection > div:is(.open, :focus-within) > label {
	opacity: 1;
	pointer-events: auto;
	box-shadow: 0 3px 8px rgba(2, 22, 50, .12);
}

#axis-selection label input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

#axis-selection > div:is(.open, :focus-within) > label.checked {
	background-color: var(--color-navy);
	border-color: var(--color-navy);
	color: #fff;
}

#axis-selection label.disabled {
	background-color: #f2f4f7;
	color: #98A1AE;
}

#axis-selection > div:is(.open, :focus-within) > label.disabled {
	background-color: #f2f4f7;
	border-color: var(--color-border);
	color: #98A1AE;
}

#axis-selection label:focus-within {
	outline: 2px solid var(--color-navy);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   13-3. プロット（上部）とリスト（下部）
   -------------------------------------------------------------------------- */
#map-chart {
	padding: 14px;
	background: var(--comparemap-plot-bg);
	border: 1px solid var(--color-border);
	border-radius: 8px;
}

#chart {
	--plot-label: short;

	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: auto;
	margin-top: 16px;
	padding-top: var(--comparemap-plot-h);
}


#chart-x,
#chart-y {
	display: block;
	position: absolute;
	background-color: var(--comparemap-axis);
}

#chart-x {
	top: calc(var(--comparemap-plot-h) / 2);
	left: 26px;
	width: calc(100% - 52px);
	height: 1px;
}

#chart-y {
	top: 20px;
	left: 50%;
	width: 1px;
	height: calc(var(--comparemap-plot-h) - 40px);
}

#chart-x-arrow,
#chart-y-arrow {
	display: block;
	position: absolute;
	box-sizing: border-box;
	width: 8px;
	height: 8px;
	border: 2px solid var(--comparemap-axislabel);
	border-bottom: 0;
	border-left: 0;
}

#chart-y-arrow {
	top: 20px;
	left: 50%;
	transform: translate(-50%, 1px) rotate(-45deg);
}

#chart-x-arrow {
	top: calc(var(--comparemap-plot-h) / 2);
	right: 26px;
	transform: translate(-1px, -50%) rotate(45deg);
}

#chart-x-label,
#chart-y-label,
#chart-x-high,
#chart-x-low,
#chart-y-high,
#chart-y-low {
	display: block;
	position: absolute;
	width: auto;
	font-size: 16px;
	line-height: 1;
	color: var(--comparemap-axislabel);
	white-space: nowrap;
	text-align: left;
}

#chart-x-label,
#chart-y-label {
	position: static;
	order: 0;
	padding: 0;
	background-color: transparent;
}

#chart-x-label {
/*	margin-top: 14px;*/
}

#chart-y-label {
	margin-top: 4px;
/*	margin-bottom: 12px;*/
}

#chart-x-label::before {
	content: "横軸：";
}

#chart-y-label::before {
	content: "縦軸：";
}

#chart-y-high { top: 22px; left: calc(50% + 11px); }
#chart-y-low  { top: calc(var(--comparemap-plot-h) - 42px); left: calc(50% + 7px); }
#chart-x-low  { top: calc(var(--comparemap-plot-h) / 2 - 32px); left: 6px; }
#chart-x-high { top: calc(var(--comparemap-plot-h) / 2 - 32px); right: 6px; }

/* --------------------------------------------------------------------------
   13-4. プロットのチップ（.chart-item）
   -------------------------------------------------------------------------- */
.chart-item {
	position: absolute;
	display: inline-block;
	padding: 4px 6px;
	background-color: var(--color-panel-bg);
	border: 1px solid rgba(11, 46, 92, .28);
	border-radius: 5px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
	white-space: nowrap;
	cursor: pointer;
}

.chart-item.init {
	top: calc(var(--comparemap-plot-h) / 2 - 14px);
	left: calc(50% - 40px);
}

.chart-item.opened {
	border-color: var(--color-navy);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}

.chart-item[data-id="A"] { --dot-bg: #CD5F64; }
.chart-item[data-id="I"] { --dot-bg: #EB4600; }
.chart-item[data-id="B"] { --dot-bg: #3CF064; }
.chart-item[data-id="C"] { --dot-bg: #009673; }
.chart-item[data-id="D"] { --dot-bg: #28DCFF; }
.chart-item[data-id="E"] { --dot-bg: #3287DC; }
.chart-item[data-id="F"] { --dot-bg: #8769FF; }
.chart-item[data-id="G"] { --dot-bg: #FFB4F5; }
.chart-item[data-id="H"] { --dot-bg: #FF0091; }

.chart-item > span {
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
/*	color: #17263c;*/
	color: var(--dot-bg);
	cursor: pointer;
}

/* トップ No.74（2026-08-21・SP）: ▼マーカーは外して名前だけにする。
   wide は第13-4節で ▼ + 9色を出している。narrow で戻す場合は
   .chart-item[data-id="X"] { --dot-bg: … } と
   .chart-item[data-id] > span::before { content: "\25BC"; … } を足す。 */

/* --------------------------------------------------------------------------
   13-5. グループ見出し（.chart-group）
   -------------------------------------------------------------------------- */
.chart-group {
	display: none;
}

/* --------------------------------------------------------------------------
   13-6. 吹き出し（.chart-tip・クリックで map.js が生成する）
   -------------------------------------------------------------------------- */
#map {
	--tip-ui: popup;
}

.chart-popup {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 10000;
	box-sizing: border-box;
	width: min(90vw, 420px);
	max-height: 80vh;
	padding: 16px;
	overflow-y: auto;
	background-color: #fff;
	border: 1px solid var(--color-border);
	border-radius: 10px;
	box-shadow: 0 12px 32px rgba(2, 22, 50, .3);
	transform: translate(-50%, -50%);
}

.chart-popup-title {
	padding-right: 34px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--color-navy);
}

.chart-popup-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 38px;
	height: 38px;
	padding: 0;
	background-color: transparent;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.chart-popup-close::before,
.chart-popup-close::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 18px;
	height: 2px;
	background-color: var(--comparemap-axislabel);
}

.chart-popup-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.chart-popup-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }

.chart-popup-close:focus-visible {
	outline: 2px solid var(--color-navy);
	outline-offset: 2px;
}

.chart-tip {
	flex: 0 0 100%;
	padding: 0 0 12px;
	background-color: transparent;
}

.chart-popup > .chart-tip {
	padding-bottom: 0;
}

.chart-tip > dl {
	padding-top: 9px;
	border-top: 1px solid var(--color-border);
	font-size: 16px;
	white-space: normal;
}

.chart-tip > dl > div {
	display: flex;
	line-height: 1.7;
	color: #4d5a6c;
}

.chart-tip > dl > div > dt {
	flex: 0 0 8em;
	color: var(--comparemap-axislabel);
}

.chart-tip > p {
	margin: 10px auto 0;
	text-align: center;
}

/* --------------------------------------------------------------------------
   13-7. すべて開く／閉じる
   -------------------------------------------------------------------------- */
#ctrl-slide {
	display: none;
	position: static;
	order: 0;
	margin: 14px 0 10px;
}

#ctrl-slide ul {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

#ctrl-slide ul > li > a {
	padding: 4px 8px;
	font-size: 16px;
	color: var(--comparemap-axislabel);
}

/* --------------------------------------------------------------------------
   13-8. 評価記号（◎ / ○ / △）
   -------------------------------------------------------------------------- */
.icon-eval {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 6px;
	vertical-align: middle;
	font-size: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
}

.icon-eval[data-eval="\25CE"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%234d5a6c' stroke-width='1.6'%3E%3Ccircle cx='8' cy='8' r='6.8'/%3E%3Ccircle cx='8' cy='8' r='3.1'/%3E%3C/g%3E%3C/svg%3E");
}

.icon-eval[data-eval="\25CB"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.8' fill='none' stroke='%234d5a6c' stroke-width='1.6'/%3E%3C/svg%3E");
}

.icon-eval[data-eval="\25B3"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.4 15.1 14.2H0.9Z' fill='none' stroke='%234d5a6c' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
}


/* ==========================================================================
   14. 記事ページ（body#fundingGuideMethod）
   ========================================================================== */

/* --------------------------------------------------------------------------
   14-1. ページ地とカード
   -------------------------------------------------------------------------- */
body.fundingGuide#fundingGuideMethod #maincontents {
	background-color: var(--color-navy);
	font-family: var(--font-sans);
	color: var(--color-text);
}

#fundingGuideMethod #article,
#fundingGuideMethod #links {
	--card-bg: var(--color-card-bg);
}


body#fundingGuideMethod #maincontents > section:not(#fv) {
	margin: 0 var(--card-gutter) var(--gap-groupb);
	padding: 6px var(--card-pad-x) 24px;
	background-color: var(--card-bg);
	border-radius: var(--card-radius);
}

#fundingGuideMethod #article,
#fundingGuideMethod #links,
#fundingGuideMethod #remarks {
	background-image: var(--gradient-cardtop);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 6px;
}

#fundingGuideMethod #article {
	color: var(--color-text);
	font-size: 16px;
	line-height: 1.85;
}

#fundingGuideMethod ul.local-breadcrumbs {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: nowrap;
	box-sizing: border-box;
	height: 30px;
	margin: 0;
	padding: 0 var(--card-gutter);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	line-height: 30px;
	white-space: nowrap;
	color: #FFFFFF;
}

#fundingGuideMethod ul.local-breadcrumbs::-webkit-scrollbar {
	display: none;
}

#fundingGuideMethod ul.local-breadcrumbs > li {
	flex: none;
}

#fundingGuideMethod ul.local-breadcrumbs > li + li::before {
	content: " > ";
	padding: 0 .25em;
}

/* --------------------------------------------------------------------------
   14-2. 見出しとリンク
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article h1,
#fundingGuideMethod #article h2,
#fundingGuideMethod #article h3 {
	font-family: var(--font-serif);
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--color-navy);
}

#fundingGuideMethod #article h2 {
	font-size: 20px;
}

#fundingGuideMethod #maincontents a:not(.cta-1st):not(.cta-2nd) {
	color: var(--color-link);
	text-decoration: none;
}

#fundingGuideMethod #maincontents a:not(.cta-1st):not(.cta-2nd):hover {
	color: var(--color-link-hover);
	opacity: 1;
	text-decoration: underline;
}

#fundingGuideMethod #maincontents ul.local-breadcrumbs a:not(.cta-1st):not(.cta-2nd) {
	color: #FFFFFF;
	text-decoration: none;
}

#fundingGuideMethod #navi-opener a:not(.cta-1st):not(.cta-2nd),
#fundingGuideMethod #article #ranking ul li a:not(.cta-1st):not(.cta-2nd),
#fundingGuideMethod #links ul li a:not(.cta-1st):not(.cta-2nd),
#fundingGuideMethod #table-of-contents a.toggle:not(.cta-1st):not(.cta-2nd) {
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   14-3. 記事ページの FV
   -------------------------------------------------------------------------- */
#fundingGuideMethod #fv {
	min-height: 0;
	margin-top: -30px;
	padding: 54px 16px 28px;
	color: #FFFFFF;
	text-align: left;
}

body#fundingGuideMethod #maincontents {
	background-image:
		radial-gradient(76.6% 676px at 100% calc(var(--fv-h) + 300px), rgba(40, 155, 220, .31) 0%, rgba(2, 22, 50, 0) 100%),
		radial-gradient(calc(60px + 55vw) calc(150px + 25vw) at right 3vw top 50px,
			rgba(2, 22, 50, 0) 10%, rgba(2, 22, 50, .25) 45%, rgba(2, 22, 50, 1) 100%),
		url(/images/special/fundingGuide/hero.webp);
	background-repeat: no-repeat;
	background-position: left top, left top, right -48px;
	background-size: auto, auto, calc(560px + 30vw) auto;
}

#fundingGuideMethod #fv h1 {
	font-family: var(--font-serif);
	font-size: clamp(26px, 8.1vw, 40px);
	font-weight: 700;
	line-height: 1.5;
	background: linear-gradient(180deg, #F3E198, #E7C46F);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#fundingGuideMethod #fv h1 > em,
#fundingGuideMethod #fv h1 > span {
	display: block;
	font-style: normal;
}

#fundingGuideMethod #fv h1 > span {
	font-family: var(--font-sans);
	font-size: clamp(16px, 4.5vw, 24px);
	line-height: 1.4;
	color: #FFFFFF;
	-webkit-text-fill-color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   14-4. 記事本文
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article > section + section,
#fundingGuideMethod #article > section + article,
#fundingGuideMethod #article > article + section,
#fundingGuideMethod #article > article > section {
	margin-top:2em;
}

#fundingGuideMethod #article section > p+p {
	margin-top:1em;
}

#fundingGuideMethod #article section:not(.pr) ul,
#fundingGuideMethod #article section:not(.pr) ol {
	margin:1em 0 1em 1.6em;
}

#fundingGuideMethod #article section:not(.pr) ul li {
	list-style:disc;
}

#fundingGuideMethod #article section:not(.pr) ol li {
	list-style:decimal;
}

#fundingGuideMethod #article #basic-info table {
	border-collapse:collapse;
}

#fundingGuideMethod #article #basic-info table thead th {
	background-color:var(--color-navy);
	color:white;
	font-weight:bold;
}

#fundingGuideMethod #article #basic-info table thead tr > th:nth-of-type(1) {
	border-right:1px solid #fff;
}

#fundingGuideMethod #article #basic-info table tbody th {
	color:var(--color-navy);
	text-align:left;
}

#fundingGuideMethod #article #basic-info table th,
#fundingGuideMethod #article #basic-info table td {
	padding: 8px 10px;
	border:1px solid var(--color-navy);
}

#fundingGuideMethod #article #suitable dl {
	display: block;
}

#fundingGuideMethod #article #suitable dl > div {
	border:1px solid var(--color-navy);
	flex-grow:1;
}

#fundingGuideMethod #article #suitable dl > div + div {
	margin-top: 12px;
}

#fundingGuideMethod #article #suitable dl > div > dt {
	background-color:var(--color-navy);
	font-weight:bold;
	color:#fff;
	font-size:16px;
	padding:10px 20px;
	border:1px solid var(--color-navy);
}

#fundingGuideMethod #article #suitable dl > div > dd {
	padding:10px 20px;
}

#fundingGuideMethod #article #suitable dl > div > dd > ul {
	margin-top:0;
	margin-bottom:0;
}

#fundingGuideMethod #article #merit dl > div,
#fundingGuideMethod #article #demerit dl > div,
#fundingGuideMethod #article #conditions dl > div {
	margin-top:.5em;
}

#fundingGuideMethod #article #merit dl dt,
#fundingGuideMethod #article #demerit dl dt,
#fundingGuideMethod #article #conditions dl dt {
	color:var(--color-navy);
	font-size:18px;
}

#fundingGuideMethod #article #merit dl dt::before,
#fundingGuideMethod #article #demerit dl dt::before,
#fundingGuideMethod #article #conditions dl dt::before {
	content:"●";
	margin-right:5px;
}

#fundingGuideMethod #article #flow ol li {
	font-size:18px;
	color:var(--color-navy);
}

#fundingGuideMethod #article #point ul li {
	font-size:18px;
	color:var(--color-navy);
}

#fundingGuideMethod #article #faq dl > div {
	margin-top:10px;
	padding:0;
	background-color: transparent;
}

#fundingGuideMethod #article #faq dl > div:after {
	content:"";
}

#fundingGuideMethod #article #faq dl > div+div {
	margin-top:20px;
}

#fundingGuideMethod #article #faq dl > div > dt {
	font-size:16px;
}

/* --------------------------------------------------------------------------
   14-5. ランキング（#ranking）
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article #ranking h2 {
	padding:0 10px 0;
}

#fundingGuideMethod #article #ranking p {
	color:#fff;
	padding:20px 30px 0;
}

#fundingGuideMethod #article #ranking ul {
	padding:10px 20px;
}

#fundingGuideMethod #article #ranking ul li {
	background-color: #fff;
	padding: 10px;
	border-radius: 10px;
}

#fundingGuideMethod #article #ranking ul li+li {
	margin-top:10px;
}

#fundingGuideMethod #article #ranking ul li img {
	width:160px;
}

#fundingGuideMethod #article #ranking ul li span {
	display:block;
}

#fundingGuideMethod #article #ranking ul li a {
	display: block;
	margin: 0;
	padding: 12px 20px;
	border-radius: 30px;
	background: var(--gradient-cta);
	font-family: var(--font-serif);
	font-weight: bold;
	color: white;
	text-align: center;
}

/* --------------------------------------------------------------------------
   14-6. 他の資金調達方法についての記事（#links）
   -------------------------------------------------------------------------- */
#fundingGuideMethod #links > h2 {
	position: relative;
	margin: 16px 0;
	padding: 8px 0 8px 16px;
	font-family: var(--font-serif);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .04em;
	color: var(--color-navy);
}

#fundingGuideMethod #links > h2::before {
	content: "";
	position: absolute;
	top: 12px;
	left: 0;
	width: 6px;
	height: 26px;
	background-color: var(--color-gold-accent);
}

#fundingGuideMethod #links ul {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap:5px;
	margin-top:20px;
}

#fundingGuideMethod #links ul li {
	flex-grow:1;
	text-align:center;
	border-radius: 4px;
	font-weight: normal;
}

#fundingGuideMethod #links ul li.selected {
	box-sizing: border-box;
	min-height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 11px 0;
	border: 1px solid var(--color-navy);
	background-color:var(--color-navy);
	font-size: 16px;
	line-height: 1.5;
	color:#fff;
}

#fundingGuideMethod #links ul li a {
	box-sizing: border-box;
	min-height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 11px 0;
	border: 1px solid var(--color-border);
	border-radius: 4px;
	background: var(--color-panel-bg);
	font-family: var(--font-sans);
	font-size: 16px;
	font-weight: normal;
	line-height: 1.5;
	color: var(--color-link);
	box-shadow: none;
}

#fundingGuideMethod #links ul li a:hover {
	border-color: var(--color-link-hover);
	background: var(--color-panel-bg);
	color: var(--color-link-hover);
	opacity: 1;
	box-shadow: none;
	transform: none;
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   14-7. 読了時間と目次
   -------------------------------------------------------------------------- */
#fundingGuideMethod #reading-time {
	margin-top:10px !important;
	margin-bottom:10px;
	padding:10px 12px;
	background-color:var(--color-tint);
	border-radius:6px;
	text-align:center;
}

#fundingGuideMethod #reading-time em {
	color:var(--color-navy);
	font-style:normal;
	font-weight:bold;
	text-decoration:underline;
}

#fundingGuideMethod #table-of-contents {
	position:relative;
	display:flex;
	flex-wrap:wrap;
	align-items:baseline;
	column-gap:10px;
	margin-top:0 !important;
	padding:14px 16px;
	border:1px solid var(--color-border);
	border-radius:6px;
}

#fundingGuideMethod #article #table-of-contents > h2 { order:1; }
#fundingGuideMethod #table-of-contents > a.toggle    { order:2; }
#fundingGuideMethod #table-of-contents > ul           { order:3; width:100%; }

#fundingGuideMethod #article #table-of-contents h2 {
	position:relative;
	margin:0;
	padding-left:14px;
	font-family:var(--font-serif);
	font-size:18px;
	font-weight:600;
	line-height:1.35;
	letter-spacing:.04em;
	color:var(--color-navy);
}

#fundingGuideMethod #article #table-of-contents h2::before {
	content:"";
	position:absolute;
	top:3px;
	left:0;
	width:4px;
	height:20px;
	background-color:var(--color-gold-accent);
}

#fundingGuideMethod #table-of-contents a.toggle {
	position:static;
	font-size:16px;
}

#fundingGuideMethod #table-of-contents a.toggle:before {
	content:"▼開く";
}

#fundingGuideMethod #table-of-contents a.toggle.opened:before {
	content:"▲閉じる";
}

#fundingGuideMethod #table-of-contents ul {
	display:none;
	margin:16px 0 0 !important;
	padding-left:0;
	list-style:none;
}

#fundingGuideMethod #article #table-of-contents ul > li {
	padding-left:12px;
	background:url(/images/common/gray-arrow.png) no-repeat left top .6em;
	background-size:5px auto;
	list-style:none;
}

#fundingGuideMethod #table-of-contents ul > li > a:not(.cta-1st):not(.cta-2nd) {
	text-decoration:none;
}

#fundingGuideMethod #table-of-contents ul > li > a:not(.cta-1st):not(.cta-2nd):hover {
	text-decoration:underline;
}

/* --------------------------------------------------------------------------
   14-8. ランキング／ピックアップ枠（section.pr）
   -------------------------------------------------------------------------- */
:is(#fundingGuideMethod #article, #navi-result-list) section.pr {
	background-color: var(--color-navy);
	border-radius: 12px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr :is(h2, h3) {
	background: linear-gradient(180deg, #F3E198, #E7C46F);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	padding: 16px 12px 0;
	font-size: 20px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px 12px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li {
	background-color: #FFFFFF;
	padding: 10px;
	border-radius: 10px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li span,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li span {
	display: block;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li span:first-child {
	text-align: center;
	font-weight: bold;
	font-size: 16px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li span:first-child {
	text-align: left;
	font-weight: bold;
	font-size: 16px;
}

:is(#navi-result #navi-result-list, #fundingGuideMethod #article)
	section.pr :is(ul.pickup, ul.ranking) li[data-rank] {
	position: relative;
}

:is(#navi-result #navi-result-list, #fundingGuideMethod #article)
	section.pr :is(ul.pickup, ul.ranking) li[data-rank] > span:first-child {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

:is(#navi-result #navi-result-list, #fundingGuideMethod #article)
	section.pr :is(ul.pickup, ul.ranking) li[data-rank]::before {
	content: "";
	display: block;
	flex: none;
	width: 37px;
	height: 28px;
	margin: 0 0 2px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

:is(#navi-result #navi-result-list, #fundingGuideMethod #article)
	section.pr ul.pickup li[data-rank]::before {
	margin-right: auto;
	margin-left: auto;
}

#fundingGuideMethod #article #ranking ul.ranking li[data-rank]::before {
	margin-right: auto;
	margin-left: auto;
}

:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="1"]::before { background-image: url(/images/special/label-rank1.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="2"]::before { background-image: url(/images/special/label-rank2.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="3"]::before { background-image: url(/images/special/label-rank3.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="4"]::before { background-image: url(/images/special/label-rank4.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="5"]::before { background-image: url(/images/special/label-rank5.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="6"]::before { background-image: url(/images/special/label-rank6.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="7"]::before { background-image: url(/images/special/label-rank7.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="8"]::before { background-image: url(/images/special/label-rank8.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="9"]::before { background-image: url(/images/special/label-rank9.png); }
:is(#navi-result #navi-result-list, #fundingGuideMethod #article) section.pr :is(ul.pickup, ul.ranking) li[data-rank="10"]::before { background-image: url(/images/special/label-rank10.png); }

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li img+span,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li img+span {
	font-size: 18px;
	font-weight: bold;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li img+span+span,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li img+span+span {
	font-size: 16px;
	font-weight: bold;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li span em,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li span em {
	font-weight: bold;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li img,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li img {
	width: 140px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl {
	margin: 10px 0;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl > div,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl > div {
	display: flex;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl > div > dt,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl > div > dt {
	width: 7.5em;
	flex: 0 0 auto;
	padding: 5px;
	background-color: #EEEEEE;
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl > div > dd,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl > div > dd {
	flex-grow: 1;
	padding: 5px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl > div:last-child > dt,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li dl > div:last-child > dd,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl > div:last-child > dt,
:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.ranking li dl > div:last-child > dd {
	border-bottom: 1px solid #CCCCCC;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr ul.pickup li a {
	display: block;
	margin: 0;
	padding: 12px 20px;
	border-radius: 30px;
	background: var(--gradient-cta);
	color: #FFFFFF;
	font-family: var(--font-serif);
	font-weight: bold;
	text-align: center;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr > div.remarks {
	padding-bottom: 16px;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr > div.remarks > span {
	display: block;
	margin: 0 12px;
	color: #FFFFFF;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr > div.remarks > span > a {
	color: var(--color-link-on-navy);
	text-decoration: none;
}

:is(#fundingGuideMethod #article, #navi-result-list) section.pr > div.remarks > span > a:hover {
	color: var(--color-link-on-navy);
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   14-9. 資金調達診断のモーダル
   -------------------------------------------------------------------------- */

#fundingGuideMethod #navi-opener {
	width: 50px;
}

#fundingGuideMethod #navi-opener a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	border-radius: 14px;
	background: var(--gradient-cta);
	box-shadow: 0 5px 15px 0 rgba(0, 0, 0, .5);
	font-size: 16px;
	line-height: 1.2;
	color: #fff;
	text-align: center;
}

#fundingGuideMethod #navi-opener a:hover {
	opacity:0.7;
}

#fundingGuideMethod #navi-opener a::before {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	margin-bottom: 2px;
	background: url(/images/special/fundingGuide/icon-diagnosis.svg) no-repeat center center / contain;
}

#fundingGuideMethod .overlay {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .5);
	z-index: 999;
}

#fundingGuideMethod #modal-navi {
	display:none;
	position:fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	transform: none;
	z-index: 1000;
	overflow-y:auto;
	height: max-content;
	max-height: calc(100% - 60px);
	border:5px solid var(--color-navy);
	border-radius:4px;
	width: calc(100% - 20px);
	padding: 0;
	background-color: var(--color-cream);
}

/* --------------------------------------------------------------------------
   14-10. 記事ページの h2（記事 No.10 ／ 記事 No.11）
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article section:not(.pr):not(#table-of-contents) > h2::before,
#fundingGuideMethod #supervisor > div:first-child > h2::before {
	content: "";
	display: inline-block;
	vertical-align: -.08em;
	width: 1em;
	height: 1em;
	margin-right: .24em;
	background-image: url(/images/special/fundingGuide/icon-signpost.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

#fundingGuideMethod #supervisor > div:first-child > p {
	margin-bottom: 2px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--color-text-sub);
}


/* --------------------------------------------------------------------------
   14-8b. 診断結果の2社間ファクタリング（トップ 修正事項 No.57・No.58）
   -------------------------------------------------------------------------- */
#navi-result #navi-result-list li[data-method-id="F"] section.links ul.pickup > li {
	container-type: inline-size;
}

#navi-result #navi-result-list li[data-method-id="F"] section.links ul.pickup > li > span:nth-of-type(1) {
	font-size: clamp(16px, 5.6cqi, 18px);
	line-height: 1.4;
	color: var(--color-navy);
}

#navi-result #navi-result-list li[data-method-id="F"] section.links ul.pickup > li > span:nth-of-type(2) {
	margin-top: 2px;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
	color: var(--color-text-sub);
}

#navi-result #navi-result-list li[data-method-id="F"] section.links ul.pickup > li > span:nth-of-type(3) {
	margin-top: 12px;
	font-size: 16px;
	line-height: 1.7;
	text-align: left;
	color: var(--color-text);
}

#navi-result #navi-result-list li[data-method-id="F"] section.links ul.pickup > li > span:nth-of-type(3) em {
/*	color: var(--color-navy);*/
	color: #D93900;
}


/* --------------------------------------------------------------------------
   14-12. 「×××の基本情報」（記事 修正事項 No.37）
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article #basic-info table tbody th {
	white-space: nowrap;
}

/* --------------------------------------------------------------------------
   14-8c. 記事「2社間ファクタリング」のピックアップ（記事 修正事項 No.30）
   -------------------------------------------------------------------------- */


body#fundingGuideMethod.method-F #article section.pr ul.pickup > li > span:nth-of-type(1) {
	line-height: 1.4;
	color: var(--color-navy);
}

body#fundingGuideMethod.method-F #article section.pr ul.pickup > li > span:nth-of-type(2) {
	margin-top: 2px;
	font-size: 16px;
	font-weight: normal;
	line-height: 1.5;
	text-align: center;
	color: var(--color-text-sub);
}

body#fundingGuideMethod.method-F #article section.pr ul.pickup > li > span:nth-of-type(3) {
	margin-top: 12px;
	font-size: 16px;
	line-height: 1.7;
	text-align: left;
	color: var(--color-text);
}

body#fundingGuideMethod.method-F #article section.pr ul.pickup > li > span:nth-of-type(3) em {
	color: #D93900;
}

/* --------------------------------------------------------------------------
   14-11. 記事のテキストリンク（記事 No.21〜23 → No.25・No.29 で改訂）
   -------------------------------------------------------------------------- */

#fundingGuideMethod #table-of-contents a.toggle:not(.cta-1st):not(.cta-2nd):hover {
	text-decoration: underline;
}


/* --------------------------------------------------------------------------
   14-9b. 記事内から他コーナーへの導線（#pr / #recommendation）
   -------------------------------------------------------------------------- */
#fundingGuideMethod #article :is(#pr, #recommendation) > a {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 50px;
	margin-top: 16px;
}


#fundingGuideMethod #modal-navi > #navi {
	padding: 6px 20px 24px;
}

#fundingGuideMethod #modal-navi > #navi-closer {
	display:none;
	position: sticky;
	top: 0;
	right: auto;
	z-index: 1001;
	padding: 8px 14px 0;
	line-height: 1;
	text-align: right;
	background-color: var(--color-cream);
}

#fundingGuideMethod #navi-closer a {
	font-size:20px;
	color: var(--color-navy);
	font-weight:bold;
}

#fundingGuideMethod #navi-closer a:hover {
	opacity:0.7;
}

#fundingGuideMethod #modal-navi::-webkit-scrollbar {
	width: 16px;
	background: var(--color-cream);
	border-radius:0 20px 20px 0;
}

#fundingGuideMethod #modal-navi::-webkit-scrollbar-thumb {
	background: var(--color-navy);
	border-right: 1px solid var(--color-cream);
	border-left: 1px solid var(--color-cream);
}

#fundingGuideMethod #modal-navi::-webkit-scrollbar-track {
	margin-top: 15px;
	margin-bottom: 15px;
}