@charset "utf-8";
/* Paid TOPページ（2026-07 全面リニューアル）
   ブレークポイント: PC(min-width:941) / tab・m(max-width:940) / m(max-width:640) */

/* # FV専用サブセットフォント */
@font-face {
	font-family: "pd-fv-jp";
	src: url("/css/fonts/pd_fv_jp700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "pd-fv-num";
	src: url("/css/fonts/pd_fv_num_italic.woff2") format("woff2");
	font-weight: 500;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: "pd-fv-num";
	src: url("/css/fonts/pd_fv_num_italic.woff2") format("woff2");
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}

/* # 基本 */
body {
	--c_green:#03AF7A;
	--c_green_dark:#128964;
	--c_green_bg:#e6ffee;
	--c_mint:#ecf9f0;
	--c_orange:#ee8d37;
	--c_gray_green:#808C7F;
	--c_border:#a7d8c2;
	--c_text_green:#1f6a5b;
	--c_shadow:#c1ded1;
	--ff_roboto: "Roboto";
	--t_hover: .3s;
}

main#index {
	padding: 0;
	font-size: 18px;
	/* 単軸 hidden は他軸が auto になりスクロールバーが出る。hidden は clip 非対応向けのフォールバック */
	overflow-x: hidden;
	overflow-x: clip;
	font-family: 'Noto Sans JP', sans-serif, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック';
	color: #000;
}
main#index figure {
	padding: 0;
	margin: 0;
	line-height: 0;
}
main#index img {
	width: 100%;
	height: auto;
}
main#index p,
main#index span {
	padding: 0;
	margin: 0;
	line-height: 1;
}
/* 共有 header.css の max-width:340px を打ち消す（dl-band / 最終CTA が切れる） */
#index .base-btn.pri-cv-btn { max-width: none; }

/* # アニメーション */
@keyframes sa-move {
	from { transform: translate3d(var(--sa-x, 0), var(--sa-y, 20px), 0) var(--sa-base, ); opacity: 0; }
	to   { transform: var(--sa-base, none); opacity: 1; }
}
/* 静的 transform を持つ要素は --sa-base に退避する（消すと再生後にずれる） */
@keyframes sa-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.sa {
	opacity: 0;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
}
.sa.show {
	-webkit-animation: sa-move .5s .3s forwards;
	animation: sa-move .5s .3s forwards;
}
.sa.sa-trigger { opacity: 1; -webkit-animation: none; animation: none; }
.sa.sa-trigger .sa-child {
	-webkit-animation: sa-move .5s .3s both paused;
	animation: sa-move .5s .3s both paused;
}
/* ### FV は .show を待たず即再生 */
#index .mv {
	--sa-fv-base: .5s;
}
#index .mv .sa:not(.sa-trigger) {
	-webkit-animation: sa-move .3s var(--sa-fv-base) forwards;
	animation: sa-move .4s .5s forwards;
}
/* 遅延側にも :not() が必要（ベースの animation ショートハンドに詳細度で負ける） */
#index .mv .sa:not(.sa-trigger)[data-sa_delay="-200"] { -webkit-animation-delay: calc(var(--sa-fv-base) - .2s); animation-delay: calc(var(--sa-fv-base) - .2s); }
#index .mv .sa:not(.sa-trigger)[data-sa_delay="-100"] { -webkit-animation-delay: calc(var(--sa-fv-base) - .1s); animation-delay: calc(var(--sa-fv-base) - .1s); }
#index .mv .sa:not(.sa-trigger)[data-sa_delay="100"] { -webkit-animation-delay: calc(var(--sa-fv-base) + .1s); animation-delay: calc(var(--sa-fv-base) + .1s); }
#index .mv .sa:not(.sa-trigger)[data-sa_delay="150"] { -webkit-animation-delay: calc(var(--sa-fv-base) + .15s); animation-delay: calc(var(--sa-fv-base) + .15s); }
#index .mv .sa:not(.sa-trigger)[data-sa_delay="200"] { -webkit-animation-delay: calc(var(--sa-fv-base) + .2s); animation-delay: calc(var(--sa-fv-base) + .2s); }
#index .mv .sa:not(.sa-trigger)[data-sa_delay="250"] { -webkit-animation-delay: calc(var(--sa-fv-base) + .25s); animation-delay: calc(var(--sa-fv-base) + .25s); }
/* FVはJSを待たず即再生する（LCP対策） */
#index .mv .sa.sa-trigger > * {
	-webkit-animation: sa-move .3s calc(var(--sa-fv-base) + .1s) both;
	animation: sa-move .3s calc(var(--sa-fv-base) + .1s) both;
}
#index .mv .mv-badges .mv-badge:nth-child(2) { -webkit-animation-delay: calc(var(--sa-fv-base) + .15s); animation-delay: calc(var(--sa-fv-base) + .15s); }
#index .mv .mv-badges .mv-badge:nth-child(3) { -webkit-animation-delay: calc(var(--sa-fv-base) + .2s); animation-delay: calc(var(--sa-fv-base) + .2s); }
#index .mv .mv-badges .mv-badge:nth-child(4) { -webkit-animation-delay: calc(var(--sa-fv-base) + .25s); animation-delay: calc(var(--sa-fv-base) + .25s); }

/* #### MV */
#index .mv .mv-catch,
#index .mv .mv-lead,
#index .mv .mv-visual-girl { --sa-y: 0; }
#index .mv .mv-catch .mv-zero {
	-webkit-animation: sa-move .6s calc(var(--sa-fv-base) + .5s) both;
	animation: sa-move .6s calc(var(--sa-fv-base) + .5s) both;
}
#index .mv .mv-badges .mv-badge { --sa-y: 0; }
#index .mv .mv-badges .mv-badge:nth-child(2) { --sa-x: -114px; }
#index .mv .mv-badges .mv-badge:nth-child(3) { --sa-x: -132px; }
#index .mv .mv-badges .mv-badge:nth-child(4) { --sa-x: -186px; }
@media screen and (max-width: 640px) {
	#index .mv .mv-badges .mv-badge:nth-child(2) { --sa-x: -76.37px; }
	#index .mv .mv-badges .mv-badge:nth-child(3) { --sa-x: -88.43px; }
	#index .mv .mv-badges .mv-badge:nth-child(4) { --sa-x: -124.6px; }
}

/* #### 請求業務代行 */
#index .daiko .daiko-flow { --sa-y: -157px; }
#index .daiko .daiko-nashi { --sa-y: 0; }
#index .daiko .daiko-msg.sa-trigger .daiko-msg-body,
#index .daiko .daiko-msg.sa-trigger .daiko-person {
	-webkit-animation: sa-move .5s .1s both paused;
	animation: sa-move .5s .1s both paused;
}
#index .daiko .daiko-msg .daiko-msg-body { --sa-y: 0; }
#index .daiko .daiko-msg .daiko-person.left { --sa-y: -75px; }
#index .daiko .daiko-msg .daiko-person.right { --sa-y: -55px; }

/* #### 3つの違い */
#index .reason .reason-cards .reason-card:nth-child(1) { --sa-y: -322px; }
#index .reason .reason-cards .reason-card:nth-child(2) { --sa-y: -241px; }
#index .reason .reason-cards .reason-card:nth-child(3) { --sa-y: -177px; }
#index .reason .reason-table-wrap.sa-trigger .rt-paid-txt,
#index .reason .reason-table-wrap.sa-trigger .rt-check {
	-webkit-animation: sa-fade .5s .1s both paused;
	animation: sa-fade .5s .1s both paused;
}

/* #### 業種・取引形態 */
@media screen and (min-width: 941px) {
	#index .industry-grid .ind-card.ind-green { --sa-x: -100px; --sa-y: 0; }
	#index .industry-grid .ind-card.ind-blue { --sa-x: 98px; --sa-y: 0; }
	#index .industry-person { --sa-base: translate(-50%, -50%); --sa-y: -97.33px; }
}

/* #### 導入の流れ */
#index .flow .flow-steps.sa-trigger .flow-icon {
	-webkit-animation: sa-move .5s .1s both paused;
	animation: sa-move .5s .1s both paused;
}
#index .flow .flow-steps.sa-trigger .flow-step-desc,
#index .flow .flow-steps.sa-trigger .flow-badge {
	-webkit-animation: sa-fade .5s .1s both paused;
	animation: sa-fade .5s .1s both paused;
}
#index .flow .flow-steps .flow-icon { --sa-y: -71px; }

/* #### 料金構造 */
#index .price .price-card.sa-trigger .price-body,
#index .price .price-fee.sa-trigger > * {
	-webkit-animation: sa-fade .5s .1s both paused;
	animation: sa-fade .5s .1s both paused;
}

/* #### 実績（191:5391） */
#index .achievement .ach-card.sa-trigger .ach-badge {
	-webkit-animation: sa-move .5s .1s both paused;
	animation: sa-move .5s .1s both paused;
}
#index .achievement .ach-card.sa-trigger .ach-divider,
#index .achievement .ach-card.sa-trigger .ach-logos {
	-webkit-animation: sa-fade .5s .1s both paused;
	animation: sa-fade .5s .1s both paused;
}
#index .achievement .ach-badges .ach-badge:nth-child(1) { --sa-y: -260px; }
#index .achievement .ach-badges .ach-badge:nth-child(2) { --sa-y: -208px; }
#index .achievement .ach-badges .ach-badge:nth-child(3) { --sa-y: -135px; }

/* #### お客様の声（198:6309） */
#index .voice .voice-card.photo-right { --sa-x: -319px; --sa-y: 0; }
#index .voice .voice-card:not(.photo-right) { --sa-x: 253px; --sa-y: 0; }

/* #### 導入事例（202:1234） */
#index .case .case-card.sa-trigger .case-photo,
#index .case .case-card.sa-trigger .case-head {
	-webkit-animation: sa-fade .5s .1s both paused;
	animation: sa-fade .5s .1s both paused;
}
#index .case .case-card.sa-trigger .case-ba {
	-webkit-animation: sa-move .5s .1s both paused;
	animation: sa-move .5s .1s both paused;
}
#index .case .case-card .case-ba { --sa-y: 286px; }

/* #### お悩み解決（202:1837） */
#index .solution .sol-card { --sa-y: 171px; }

/* ### トリガーの再生開始 */
/* セクション側の (1,4,0) に勝つため !important が必要 */
#index .sa.sa-trigger.show * {
	-webkit-animation-play-state: running !important;
	animation-play-state: running !important;
}

/* ### ヘッダーはアニメーションなし */
/* Figmaに定義が無いため止める（共有の headline.jsp は触らない） */
/* `.show` 付きも必要（`.sa.show` に詳細度で負ける） */
header .sa,
header .sa.show,
header .sa.sa-trigger * {
	opacity: 1;
	-webkit-animation: none;
	animation: none;
	-webkit-transition: none;
	transition: none;
}
/* ### p / span の line-height:1 */
/* `:not(.move)` を外すと .btn-head-touch まで効いて ≤640 のCTAが1px低くなる */
header.index-header:not(.move) .header-inner p,
header.index-header:not(.move) .header-inner span,
header.index-header .header-inner.up p,
header.index-header .header-inner.up span { line-height: 1; }
/* ### 視差効果を減らす設定 */
/* .sa は opacity:0 が初期値なので opacity:1 も要る */
@media (prefers-reduced-motion: reduce) {
	.sa,
	.sa.sa-trigger *,
	#index .mv .mv-catch .mv-zero,
	header.index-header.move {
		opacity: 1 !important;
		-webkit-animation: none !important;
		animation: none !important;
		-webkit-transition: none !important;
		transition: none !important;
	}
}

/* # トップヘッダー */
header.index-header {
	border-bottom: none;
	position: absolute;
	background-color: initial;
}
/* ## .move（スクロールで白背景固定） */
/* スクロール後は他プレログインページと同じ見た目にする（可視高65px） */
/* この3宣言は `.move` にも効かせる（上段42pxと top:-42px が噛み合わなくなる） */
header.index-header .header-inner.up {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
header.index-header .header-inner.up.main-header { padding: 16px 0 12px; }
header.index-header .header-inner.up .sentence { font-size: 14px; font-weight: 500; color: #333; }
@keyframes hdr-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}
header.index-header.move {
	border-bottom: 1px solid #dfdfdf;
	background-color: #fff;
	position: fixed;
	z-index: 200;
	-webkit-animation: hdr-fade .3s both;
	animation: hdr-fade .3s both;
}
header.index-header.main-header.move { top: -42px; }
header.index-header.move .to-login { display: none; }
header.index-header.move .to-buyer { display: none; }
/* #### pcのみ */
@media screen and (min-width: 941px) {
	/* #### ロゴ／nav の間隔 */
	header.index-header:not(.move) { --hdr_gap: clamp(12px, calc((100vw - 880px) / 6), 42px); }
	/* #### ロゴ */
	header.index-header:not(.move) .header-inner .header-logo {
		width: 96px; height: 49px; min-width: 0; max-width: none; margin: 0;
	}
	header.index-header:not(.move) nav { position: relative; margin-left: var(--hdr_gap); }
	header.index-header:not(.move) nav .pre-nav {
		width: auto; max-width: none; margin: 0;
		justify-content: flex-start; gap: var(--hdr_gap);
		font-size: 15px;
	}
	header.index-header:not(.move) nav .pre-nav > li { padding: 0; }
	header.index-header:not(.move) nav .pre-nav a {
		padding: 9px 0; line-height: 31px; font-weight: 500; color: #000;
	}
	header.index-header:not(.move) nav .pre-nav a:hover,
	header.index-header:not(.move) nav .pre-nav a:focus-visible,
	header.index-header:not(.move) nav .pre-nav .pre-nav-on a { color: var(--c_green); }
	header.index-header:not(.move) nav .pre-nav li > a:before,
	header.index-header:not(.move) nav .pre-nav li > a:after { bottom: 4px; }
	header.index-header:not(.move) nav .pre-nav li:hover > a:before,
	header.index-header:not(.move) nav .pre-nav li:hover > a:after,
	header.index-header:not(.move) nav .pre-nav .pre-nav-on > a:before,
	header.index-header:not(.move) nav .pre-nav .pre-nav-on > a:after { background-color: var(--c_green); }
	/* #### 右側（ログイン／お問い合わせ／資料請求） */
	header.index-header:not(.move) .header-inner .pre-nav-right {
		display: flex; align-items: center; gap: 17px; margin: 0;
	}
	header.index-header:not(.move) .to-login {
		position: static; top: auto; right: auto;
		padding: 0; border: 0; border-radius: 0;
		background: none;
		font-size: 14px; font-weight: 500; line-height: 31px; color: #000;
		-webkit-transition: color var(--t_hover); transition: color var(--t_hover);
	}
	header.index-header:not(.move) .to-login:hover,
	header.index-header:not(.move) .to-login:focus-visible { background: none; color: var(--c_green); }
	header.index-header:not(.move) .to-login:focus-visible{ outline: solid; outline-offset: 2px; outline-color: #333333; outline-width: 2px; }
	header.index-header:not(.move) .header-inner .pre-nav-right .ter-btn {
		flex: none; width: 133px; height: 43px; padding: 0;
		border: 1px solid #000; border-radius: 4px;
		background: #fff; color: #000;
		font-size: 16px; line-height: 1;
	}
	/* #### hover（反転） */
	header.index-header:not(.move) .header-inner .pre-nav-right .ter-btn:hover,
	header.index-header:not(.move) .header-inner .pre-nav-right .ter-btn:focus-visible {
		background: #000; border-color: #000; color: #fff;
	}
	header.index-header:not(.move) .header-inner .pre-nav-right .cv-btn {
		flex: none; width: 160px; height: 43px; padding: 0; margin: 0;
		border: 1px solid var(--c_orange); border-radius: 4px;
		background: var(--c_orange); color: #fff;
		font-size: 16px; line-height: 1;
	}
	header.index-header:not(.move) .header-inner .pre-nav-right .cv-btn:hover,
	header.index-header:not(.move) .header-inner .pre-nav-right .cv-btn:focus-visible {
		background: #fff; color: var(--c_orange);
	}
	/* ## 買い手向けテキストリンク */
	header.index-header:not(.move) .header-inner .pre-nav-right .right-menu {
		position: absolute; right: 0; top: -28px; margin: 0; width: auto;
	}
	header.index-header:not(.move) .to-buyer.to-buyer-btn.for-top {
		position: relative; top: auto; right: auto;
		display: block; width: auto; margin: 0; padding: 0 13px 0 0;
		white-space: nowrap; overflow: visible;
		font-size: 14px; font-weight: 500; line-height: 19px; color: #333;
	}
	header.index-header:not(.move) .to-buyer.to-buyer-btn.for-top:before {
		content: '';
		position: absolute; right: 0; top: 4px;
		width: 6px; height: 9.68px;
		border: 0; border-radius: 0; transform: none;
		background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 11.6775' fill='none'%3E%3Cpath d='M1 1L7 5.83874L1 10.6775' stroke='%23333333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
	}
	header.index-header:not(.move) .to-buyer-btn.for-top:hover,
	header.index-header:not(.move) .to-buyer-btn.for-top:focus-visible { color: var(--c_green); }
	header.index-header:not(.move) .to-buyer-btn.for-top:hover:before,
	header.index-header:not(.move) .to-buyer-btn.for-top:focus-visible:before {
		border-color: transparent;
		background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 11.6775' fill='none'%3E%3Cpath d='M1 1L7 5.83874L1 10.6775' stroke='%2303AF7A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	}
	header.index-header .to-buyer:focus-visible { outline: solid; outline-offset: 2px; outline-color: #333333; outline-width: 2px; border-radius: 2px; }
}
@media screen and (max-width: 940px) {
	header.index-header:not(.move) .header-inner .header-logo {
		width: 96px; height: 49px; min-width: 0; max-width: none;
		margin: 0; align-self: center;
	}
	header.index-header .header-inner.up { display:none; }
	header.index-header.move,
	header.index-header.main-header.move { top:0; }
	header.index-header.move .to-login { position: absolute; }
	#nav-switch-chk:checked ~ header.index-header {
		background-color: #fff;
		transition: background-color .5s ease;
	}
}
@media screen and (max-width: 640px) {
	header.index-header:not(.move) .header-inner .header-logo { width: 107.76px; height: 30.66px; }
}

/* # レスポンシブ改行ヘルパー */
#index .rwd { display: inline; }
#index .rwd-sec { display: none; }
@media screen and (max-width: 940px) { #index .rwd { display: none; } }
@media screen and (max-width: 640px) { #index .rwd-sec { display: inline; } }

/* # 各セクション */

/* ## メインビジュアル */

#index .rwd { display: inline; }
#index .rwd-sec { display: none; }

#index .mv {
	position: relative;
	overflow: hidden;
	background: #fff;
}

/* #### 背景装飾（グラデーションのひし形） */
/* 一辺は 1000/1440 のFigma実測を通る一次式。critical CSS 側と同値を保つこと */
#index .mv .mv-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
}
#index .mv .mv-bg::before {
	content: "";
	position: absolute;
	width: calc(27.1573% + 660.3524px);
	height: 0;
	padding-top: calc(27.1573% + 660.3524px);
	left: calc(22.8972% - 490.9638px);
	top: 0;
	margin-top: calc(-23.2578% - 144.0544px);
	border-radius: 10.9376%;
	transform: rotate(-45deg);
	transform-origin: center;
	background: linear-gradient(164.77deg, var(--c_green_bg) 39.71%, rgba(216, 247, 255, 0.78) 89.32%);
}

#index .mv .mv-inner {
	position: relative;
	z-index: 1;
	max-width: 1440px;
	margin: 0 auto;
}
#index .mv .mv-text {
	position: relative;
	z-index: 2;
}

/* #### ヒーロービジュアル */
/* 2枚は同じキャンバス寸法なので、背景で器の高さを決め女性を絶対配置で重ねる */
#index .mv .mv-visual {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	pointer-events: none;
}
#index .mv .mv-visual picture { display: block; }
#index .mv .mv-visual-girl {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
#index .mv .mv-visual img {
	display: block;
}

/* #### No.1 旗 ＋ 東証プライムバッジ */
#index .mv .mv-head-badges {
	display: flex;
	align-items: center;
	gap: 20px;
}
#index .mv .mv-flag { width: 244px; height: auto; }
#index .mv .mv-jpx { width: 68px; height: 68px; }

/* #### キャッチコピー */
#index .mv .mv-catch {
	margin: 11px 0 0;
	font-family: "pd-fv-jp", "Noto Sans JP", sans-serif;
	font-weight: bold;
	color: #000;
	font-size: 72px;
	line-height: 1.2788;
	letter-spacing: -0.01em;
	white-space: nowrap;
}
/* #### 読点の字詰め */
#index .mv .mv-catch .mv-kern1 { letter-spacing: -0.43em; }
#index .mv .mv-catch .mv-kern2 { letter-spacing: -0.30em; }

#index .mv .mv-catch .mv-zero {
	display: inline-block;
	position: relative;
	font-family: "pd-fv-num", "Roboto", var(--ff_roboto), sans-serif;
	font-style: italic;
	font-weight: 500;
	color: var(--c_green);
	font-size: 150.6px;
	line-height: 0;
	vertical-align: -0.05em;
	/* margin-left はユーザー調整値。Figma実測に戻さないこと */
	margin: 0 0.15em 0 -0.081em;
}
/* #### 「0」直下の二重下線 */
#index .mv .mv-catch .mv-zero .mv-zero-line {
	position: absolute;
	left: 0.0066em;
	top: 0.3932em;
	width: 0.67678em;
	height: 0.12683em;
	background: url("/img/pre/index/mv_zero_underline.svg") no-repeat 0 0;
	background-size: 100% 100%;
}

/* #### サブテキスト */
#index .mv .mv-lead {
	color: #000;
	font-size: 16px;
	line-height: 2;
	margin-top: 33px;
	width: 90%;
}

/* #### 4つのバッジ */
#index .mv .mv-badges {
	display: flex;
	gap: 10px;
	margin: 15px 0 0;
	padding: 0;
	list-style: none;
}
#index .mv .mv-badge {
	position: relative;
	box-sizing: border-box;
	width: 104px;
	height: 104px;
	border-radius: 50%;
	border: 1px solid #98d99d;
	background: #F8FFF3;
	box-shadow: 2px 2px 3px rgba(3, 175, 122, 0.35);
	color: var(--c_green_dark);
}
/* #### 区切り線 */
#index .mv .mv-badge::after {
	content: "";
	position: absolute;
	top: 51.98px;
	left: 6.94px;
	width: 88.12px;
	height: 0.8px;
	background: var(--c_green);
}
#index .mv .mv-badge .num {
	position: absolute;
	display: flex;
	align-items: baseline;
	justify-content: center;
	white-space: nowrap;
	line-height: 30px;
	/* 「万」「最短」もサブセットから引く（Google側の到着を待たせない） */
	font-family: "pd-fv-num", "pd-fv-jp", "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 500;
	font-style: italic;
}
#index .mv .mv-badge .num > span { line-height: inherit; }
#index .mv .mv-badge .label {
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	font-family: "pd-fv-jp", "Noto Sans JP", sans-serif;
	font-weight: bold;
	font-size: 14.06px;
	text-align: center;
}
/* #### 数字ボックス／ラベルボックス */
#index .mv .mv-badge:nth-child(1) .num { top: 16.16px; left: 11px;    width: 76px; }
#index .mv .mv-badge:nth-child(2) .num { top: 18.78px; left: 13.47px; width: 74px; }
#index .mv .mv-badge:nth-child(3) .num { top: 21.45px; left: 8.95px;  width: 85px; }
#index .mv .mv-badge:nth-child(4) .num { top: 13.72px; left: 7.42px;  width: 85px; }
#index .mv .mv-badge:nth-child(1) .label { top: 57.16px; width: 62px;    line-height: 17.307px; }
#index .mv .mv-badge:nth-child(2) .label { top: 63.08px; width: 65.98px; line-height: 17.466px; }
#index .mv .mv-badge:nth-child(3) .label { top: 62.08px; width: 83.29px; line-height: 17.466px; }
#index .mv .mv-badge:nth-child(4) .label { top: 57.91px; width: 65.98px; line-height: 17.307px; }
/* #### 数字のフォントサイズ */
#index .mv .mv-badge .num .big { font-size: 32.91px; }
#index .mv .mv-badge:nth-child(1) .num .big { font-size: 37.74px; }
#index .mv .mv-badge:nth-child(3) .num .big { font-size: 24.75px; }
#index .mv .mv-badge .num .no { font-size: 25.4px; font-style: normal; font-weight: 700; }
#index .mv .mv-badge .num .unit { font-size: 15.88px; font-style: normal; font-weight: 700; }
/* Figmaに間隔指定が無く実測で隙間0pxのため空ける */
#index .mv .mv-badge:nth-child(2) .num .unit { margin-left: .2em; }
#index .mv .mv-badge:nth-child(3) .num .unit { font-size: 13.5px; }
#index .mv .mv-badge .num.jp {
	font-family: inherit;
	font-style: normal;
	font-weight: bold;
	font-size: 27.79px;
}

/* #### CTA */
#index .mv .mv-cta {
	display: flex;
	gap: 15px;
	align-items: stretch;
	margin: 27px 0 0;
}
#index .mv .mv-cta .base-btn {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	text-decoration: none;
}
/* #### 資料ダウンロード（オレンジ） */
#index .mv .mv-cta .pri-cv-btn {
	position: relative;
	flex-shrink: 0;
	width: 310px;
	height: 68px;
	padding: 0 44px 0 16px;
	gap: 12px;
	background: var(--c_orange);
	/* 共有 .base-btn の border を打ち消す */
	border: 0;
	border-radius: 9px;
	color: #fff;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease, box-shadow var(--t_hover) ease;
}
/* #### hover（反転） */
/* ホバーの枠は box-shadow:inset で足す（border だとレイアウトシフトする） */
#index .mv .mv-cta .pri-cv-btn:hover,
#index .mv .mv-cta .pri-cv-btn:focus-visible {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--c_orange);
	color: var(--c_orange);
}
#index .mv .mv-cta .pri-cv-btn .free {
	flex: 0 0 auto;
	width: 43px;
	height: 43px;
	border-radius: 50%;
	background: #fff;
	color: var(--c_orange);
	font-weight: 700;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### 無料バッジも反転（白丸＋オレンジ字 → オレンジ丸＋白字） */
#index .mv .mv-cta .pri-cv-btn:hover .free,
#index .mv .mv-cta .pri-cv-btn:focus-visible .free {
	background: var(--c_orange);
	color: #fff;
}
#index .mv .mv-cta .pri-cv-btn .labels {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.15;
}
/* gap:0 は必須（付けると「3」と「分」の間にも入る） */
#index .mv .mv-cta .pri-cv-btn .time {
	display: inline-flex;
	align-items: center;
	gap: 0;
	font-size: 14.45px;
	font-weight: 700;
	white-space: nowrap;
}
#index .mv .mv-cta .pri-cv-btn .time::before { content: "＼"; font-weight: 400; margin-right: .5em; }
#index .mv .mv-cta .pri-cv-btn .time::after { content: "／"; font-weight: 400; margin-left: .5em; }
#index .mv .mv-cta .pri-cv-btn .time .n {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-size: 20.88px;
	font-weight: 700;
}
#index .mv .mv-cta .pri-cv-btn .first { font-size: 21px; font-weight: 700; white-space: nowrap; }
/* #### DLアイコン */
#index .mv .mv-cta .pri-cv-btn.icon-dl::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 18.5px;
	transform: translateY(-50%);
	width: 20.5px;
	height: 19px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E") no-repeat center / contain;
}
#index .mv .mv-cta .pri-cv-btn.icon-dl:hover::after,
#index .mv .mv-cta .pri-cv-btn.icon-dl:focus-visible::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee8d37' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E");
}
/* #### 導入のご相談・問い合わせ */
#index .mv .mv-cta .contact-btn {
	justify-content: center;
	flex-shrink: 0;
	white-space: nowrap;
	width: 310px;
	height: 68px;
	background: #fff;
	border: 1px solid var(--c_green);
	border-radius: 6px;
	color: var(--c_green);
	font-size: 21px;
	font-weight: 700;
	transition: background var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### hover（反転） */
#index .mv .mv-cta .contact-btn:hover,
#index .mv .mv-cta .contact-btn:focus-visible { background: var(--c_green); color: #fff; }

/* #### 注釈 */
#index .mv .mv-note {
	color: var(--c_gray_green);
	font-size: 10px;
	line-height: 2.2;
	margin: 46px 0 0 4px;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .mv .mv-inner { min-height: 767px; }
	#index .mv .mv-text {
		width: 790px;
		padding: 125px 0 0 120px;
	}
	#index .mv .mv-cta { margin-left: 2px; }
	/* #### 写真の配置 */
	/* 横は 1440/1000 の2フレームを通る一次式。
	   縦は下端基準（1440では従来と同値。上端基準だと幅が狭いほど画像が縮んで下が浮く）。 */
	#index .mv .mv-visual {
		left: calc(586px + (100% - 1000px) * 246 / 440);
		right: auto;
		top: auto;
		bottom: 0;
		width: min(1306px, calc(1157.6px + (100% - 1000px) * 148.4 / 440));
		height: auto;
	}
	#index .mv .mv-visual img { width: 100%; max-width: none; height: auto; }
}
/* #### PC 中間幅 */
@media screen and (min-width: 941px) and (max-width: 1200px) {
	#index .mv .mv-text { width: 56%; padding-left: 60px; }
	#index .mv .mv-catch { font-size: 62px; }
	#index .mv .mv-catch .mv-zero { font-size: 129.8px; }
}
@media screen and (min-width: 1441px) {
	#index .mv .mv-bg::before {
		width: 1051.42px;
		padding-top: 1051.42px;
		left: calc(50% - 881.244px);
		margin-top: -478.967px;
	}
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .rwd { display: none; }

	#index .mv .mv-bg::before {
		width: 894.12px;
		padding-top: 894.12px;
		left: -329.82px;
		margin-top: -265.44px;
		border-radius: 11.4%;
	}

	#index .mv-inner { min-height: 0; }
	#index .mv .mv-text {
		width: auto;
		padding: 78px 23px 0;
		position: relative;
		z-index: 2;
	}
	/* #### 写真 */
	/* 幅基準だと狭い幅で画像が縮み、キャンバス下部の透過域が見えて写真が浮く。
	   高さ基準にすると可視域が 64.4%（768px設計時と同値）で一定になる */
	#index .mv .mv-visual {
		z-index: 1;
		top: 0;
		right: 0;
		height: 150.2204%;
		aspect-ratio: 507 / 1338;
		width: auto;
	}
	#index .mv .mv-visual img {
		width: 100%;
		height: auto;
		margin: 0;
	}

	#index .mv .mv-head-badges { gap: 15px; }

	#index .mv .mv-catch { font-size: min(62px, 8.2vw); margin-top: 5px; }
	#index .mv .mv-catch .mv-zero { font-size: min(129.8px, 17.16vw); }

	/* 写真と同率で縮めて行末が女性に届かないようにする */
	#index .mv .mv-lead { max-width: min(441px, 61.08%); margin-top: 22px; }

	#index .mv .mv-badges { margin-top: 27px; }

	/* #### CTA は縦積み */
	#index .mv .mv-cta {
		flex-direction: column;
		gap: 23px;
		width: 310px;
		margin-top: 48px;
	}

	#index .mv .mv-note { margin: 42px 0 0; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .rwd-sec { display: inline; }

	#index .mv .mv-bg::before {
		width: 687.53px;
		padding-top: 687.53px;
		left: -402.61px;
		margin-top: -96.08px;
		border-radius: 9.7334%;
	}

	#index .mv .mv-text {
		padding: 61px 15px 61px;
		text-align: center;
	}

	#index .mv .mv-head-badges {
		position: relative;
		display: block;
		min-height: 48px;
		margin-bottom: 0;
	}
	#index .mv .mv-flag {
		position: absolute;
		left: 0;
		top: 4px;
		width: 171px;
	}
	#index .mv .mv-jpx {
		display: block;
		margin: 0 0 0 176px;
		width: 48px;
		height: 48px;
	}

	/* 387px未満のみ縮小（3行目の「0に」が欠けるため） */
	#index .mv .mv-catch { font-size: min(47.89px, 12.3vw); line-height: 1.408; margin-top: 2px; text-align: left; }
	#index .mv .mv-catch .mv-zero {
		font-size: min(100.28px, 25.76vw);
		vertical-align: -0.16em;
		margin: 0 0.1em 0 -0.05em;
	}
	/* #### 下線は em 指定なのでフォントサイズに追従 */

	#index .mv .mv-lead {
		max-width: none;
		font-size: 14px;
		line-height: 1.7143;
		margin-top: 22px;
		text-align: center;
	}

	/* #### バッジ */
	#index .mv .mv-badges {
		justify-content: center;
		gap: 6.9px;
		margin-top: 10px;
	}
	#index .mv .mv-badge {
		width: 69.49px;
		height: 69.49px;
		border-width: 1px;
	}
	/* #### 区切り線 */
	#index .mv .mv-badge::after {
		top: 34.40px;
		left: 4.31px;
		width: 58.88px;
		height: 0.54px;
	}
	#index .mv .mv-badge .num { line-height: 20.046px; }
	#index .mv .mv-badge .label { font-size: 9.4px; }
	/* #### バッジ毎のボックス */
	#index .mv .mv-badge:nth-child(1) .num { top: 10.47px; left: 7.02px; width: 50.78px; }
	#index .mv .mv-badge:nth-child(2) .num { top: 12.22px; left: 8.67px; width: 49.45px; }
	#index .mv .mv-badge:nth-child(3) .num { top: 14.00px; left: 5.65px; width: 56.80px; }
	#index .mv .mv-badge:nth-child(4) .num { top: 8.84px;  left: 4.63px; width: 56.80px; }
	#index .mv .mv-badge:nth-child(1) .label { top: 37.86px; width: 41.4px;  line-height: 11.565px; }
	#index .mv .mv-badge:nth-child(2) .label { top: 41.82px; width: 44.09px; line-height: 11.670px; }
	#index .mv .mv-badge:nth-child(3) .label { top: 41.15px; width: 55.66px; line-height: 11.670px; }
	#index .mv .mv-badge:nth-child(4) .label { top: 38.36px; width: 44.09px; line-height: 11.565px; }
	#index .mv .mv-badge .num .big { font-size: 21.99px; }
	#index .mv .mv-badge:nth-child(1) .num .big { font-size: 25.22px; }
	#index .mv .mv-badge:nth-child(3) .num .big { font-size: 16.54px; }
	#index .mv .mv-badge .num .no { font-size: 16.98px; }
	#index .mv .mv-badge .num .unit { font-size: 10.61px; }
	#index .mv .mv-badge:nth-child(3) .num .unit { font-size: 9.02px; }
	#index .mv .mv-badge .num.jp { font-size: 18.57px; }

	/* #### CTA */
	#index .mv .mv-cta {
		width: 319px;
		max-width: 100%;
		gap: 13px;
		margin: 191.5px auto 0;
	}
	#index .mv .mv-cta .pri-cv-btn {
		width: 100%;
		height: 69.14px;
		border-radius: 7px;
	}
	#index .mv .mv-cta .pri-cv-btn .free { width: 44.25px; height: 43.72px; }
	#index .mv .mv-cta .pri-cv-btn .time { font-size: 14px; }
	#index .mv .mv-cta .pri-cv-btn .time .n { font-size: 23px; }
	#index .mv .mv-cta .pri-cv-btn .first { font-size: 19px; }
	#index .mv .mv-cta .contact-btn {
		width: 100%;
		height: 48px;
		border-radius: 4.66px;
		border-width: 0.78px;
		font-size: 16.33px;
	}

	/* #### 注釈 */
	#index .mv .mv-note { display: none; }

	/* 上端基準だと .mv の高さ（リード文の折り返し）に引きずられて中間幅で女性が浮く。
	   下端基準にして「下にはみ出す量」を幅から決める。margin の % は含みブロックの幅基準 */
	#index .mv .mv-visual {
		top: auto;
		bottom: 0;
		margin-bottom: calc(29px - 92.19%);
		left: auto;
		right: 0;
		width: min(100%, calc(181.132px + 51.6981%));
		height: auto;
		aspect-ratio: auto;
		transform: none;
	}
	#index .mv .mv-visual img {
		width: 100%;
		height: auto;
		margin: 0;
	}
}

/* ## 15周年記念バナー */
#index .anniversary-banner-area {
background-color: var(--c_green);
	background-image: url(/img/pre/index/anniversary_bnr_bg.png?2026051502) ;
	background-repeat: repeat;
	background-position: 48px 9px;
	background-size: 20% auto, auto;
	padding: 3px 0 20px;
}
#index .anniversary-banner-area .anniversary-banner {
	display: flex;
	justify-content: center;
	width: 45%;
	margin: 0 auto;
}
#index .anniversary-banner-area .fade-in-banner {
	animation: fadeIn 1.5s ease-in-out forwards;
}
@keyframes fadeIn {
	0%   { opacity: 0; }
	100% { opacity: 1; }
}
#index .anniversary-banner-area .anniversary-banner:hover img { opacity: 0.85; }
/* ### 周年バナーの CLS 対策 */
/* <a> に確定幅が要る（main#index img{width:100%} と flex で循環して 0×0 に潰れる） */
#index .anniversary-banner-area .anniversary-banner { max-width: 1274px; }
#index .anniversary-banner-area .anniversary-banner a { width: 100%; }
@media screen and (max-width: 1280px) {
	#index .anniversary-banner-area { padding: 3px 0 20px; background-size: 30% auto, auto; }
	#index .anniversary-banner-area .anniversary-banner { width: 70%; }
}
/* #### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .anniversary-banner-area { padding: 3px 0 20px; background-size: 40% auto, auto; }
	#index .anniversary-banner-area .anniversary-banner { width: 80%; }
}
/* #### m */
@media screen and (max-width: 640px) {
	#index .anniversary-banner-area { padding: 30px 0 20px; background-size: 50% auto, auto; }
	#index .anniversary-banner-area .anniversary-banner { width: 100%; max-width: 580px; }
}

/* ## 請求業務代行（8業務フロー） */

#index .daiko {
	position: relative;
	background: var(--c_mint);
	padding: 100px 20px 100px;
}
#index .daiko .daiko-inner {
	position: relative;
	z-index: 1;
	max-width: 1100px;
	margin: 0 auto;
}

/* #### 白いテント状の背景 */
#index .daiko::before {
	content: "";
	position: absolute;
	z-index: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	top: 0;
	/* Figma実測 1398/1734。% にしてBPごとの上書きを不要にする */
	height: 80.62%;
	/* V字の落差は幅基準（36.65vw = Figma実測 528/1440）。高さ基準だと狭い画面でV字が鋭くなりすぎる */
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 36.65vw), 50% 100%, 0 calc(100% - 36.65vw));
	background: linear-gradient(180deg, var(--c_mint) 25.35%, #ffffff 91.7%);
	filter: drop-shadow(0 15px 45px rgba(58, 174, 123, 0.08));
	pointer-events: none;
}

/* #### 見出し */
#index .daiko .daiko-head {
	text-align: center;
	margin-bottom: 48px;
}
#index .daiko .daiko-title {
	font-weight: 500;
	color: #000;
	font-size: 42px;
	line-height: 70px;
}
#index .daiko .daiko-sub {
	margin-top: 35px;
	font-weight: 500;
	color: #000;
	font-size: 18px;
	line-height: 31px;
}

/* ### 8業務フローカード */
#index .daiko .daiko-flow-inner {
	position: relative;
	display: flex;
	align-items: stretch;
	background: #fff;
	border: 1px solid var(--c_green);
	border-radius: 10px;
}
/* #### 下向きの吹き出しノッチ */
#index .daiko .daiko-flow-inner::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 99.9%;
	transform: translateX(-50%);
	width: 27px;
	height: 24px;
	background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 24' preserveAspectRatio='none'%3E%3Cpath d='M0 0L13.5 23.5L27 0' fill='%23ffffff' stroke='%2303AF7A' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
}

#index .daiko .daiko-group {
	position: relative;
	flex: 0 0 25.4545%;
	min-width: 0;
}
#index .daiko .daiko-group.g2 { flex-basis: 25.7273%; }
#index .daiko .daiko-group.g3 { flex-basis: 48.8182%; }

/* #### 見出し帯 */
#index .daiko .daiko-ghead {
	position: relative;
	height: 65px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 500;
	font-size: 22px;
	line-height: 31px;
	padding: 0 20px;
	white-space: nowrap;
}
#index .daiko .daiko-ghead .s { font-size: 16px; }
#index .daiko .g1 .daiko-ghead {
	z-index: 3;
	background: var(--c_green);
	border-top-left-radius: 10px;
	clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
}
#index .daiko .g2 .daiko-ghead {
	z-index: 2;
	background: #239261;
	clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
}
#index .daiko .g3 .daiko-ghead {
	z-index: 1;
	background: #106741;
	border-top-right-radius: 10px;
	clip-path: none;
}
#index .daiko .g2 .daiko-ghead,
#index .daiko .g3 .daiko-ghead {
	margin-left: -44px;
	padding-left: 64px;
}

/* #### タスクグリッド */
#index .daiko .daiko-gbody {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	justify-items: center;
	gap: 36px 0;
	padding: 41px 8px 55px;
}
#index .daiko .daiko-gbody.wide { grid-template-columns: 1fr 1fr; }

/* #### グループ間の縦区切り線 */
#index .daiko .daiko-group:not(.g1) .daiko-gbody::before {
	content: "";
	position: absolute;
	left: 0;
	top: 32px;
	bottom: 35px;
	width: 1px;
	background-image: repeating-linear-gradient(to bottom, #9cd6bd 0 3px, transparent 3px 4px);
}
/* #### 右向き矢印 */
#index .daiko .daiko-group:not(.g1) .daiko-gbody::after {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 10px;
	height: 22.2px;
	background: var(--c_green);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}

#index .daiko .daiko-task {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
#index .daiko .daiko-task .ic {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 134px;
	height: 134px;
}
#index .daiko .daiko-task .ic img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}
#index .daiko .daiko-task .tl {
	margin-top: 4px;
	font-weight: 500;
	font-size: 22px;
	line-height: 31px;
	color: #000;
}

/* ### メッセージ：Paidなら、すべて代行！ */
#index .daiko .daiko-msg {
	position: relative;
	margin-top: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 267px;
}
#index .daiko .daiko-person {
	position: absolute;
	bottom: 0;
	height: auto;
}
/* 本文は幅642px固定なので、73px固定だと狭い幅で人物が本文に被る。
   本文の端から8px空く位置を上限にする（≥1240では73pxで従来と同値）。 */
#index .daiko .daiko-person.left  { left: clamp(0px, calc(50% - 428.6px), 73px);  width: 99.6px; }
#index .daiko .daiko-person.right { right: clamp(0px, calc(50% - 451.6px), 73px); width: 122.6px; }
#index .daiko .daiko-msg-body { text-align: center; }
#index .daiko .daiko-msg-catch {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	font-weight: 700;
	color: #000;
	font-size: 45px;
	line-height: 45px;
	white-space: nowrap;
}
#index .daiko .daiko-msg-catch .daiko-msg-logo {
	width: 194px;
	height: auto;
}
#index .daiko .daiko-msg-catch .big { font-size: 55px; }
#index .daiko .daiko-msg-desc {
	margin-top: 37px;
	font-weight: 500;
	color: #000;
	font-size: 18px;
	line-height: 30px;
}

/* ### Paidなしの場合 */
#index .daiko .daiko-nashi {
	position: relative;
	margin-top: 67px;
	display: flex;
	align-items: center;
	gap: 63px;
	background: #fff6ef;
	border: 1px solid #ff764c;
	border-radius: 0;
	padding: 25px 300px 26px 46px;
}
#index .daiko .daiko-nashi-icon {
	flex: 0 0 auto;
	display: block;
	width: 124px;
}
#index .daiko .daiko-nashi-icon svg { display: block; width: 100%; height: auto; }
#index .daiko .daiko-nashi-body { flex: 1 1 auto; max-width: 559px; }
#index .daiko .daiko-nashi-title {
	font-weight: 700;
	color: #333;
	font-size: 21px;
	line-height: 31px;
}
#index .daiko .daiko-nashi-desc {
	margin-top: 6px;
	font-weight: 500;
	color: #333;
	font-size: 18px;
	line-height: 31px;
}
#index .daiko .daiko-nashi-desc b { font-weight: 700; }
#index .daiko .daiko-nashi-illust {
	position: absolute;
	right: 73px;
	bottom: -1px;
	width: 236.5px;
	height: auto;
}

/* ### CTA：活用シーンを見る */
#index .daiko .daiko-cta {
	margin-top: 100px;
	text-align: center;
}
#index .daiko .daiko-cta .sec-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 350px;
	height: 75px;
	background: var(--c_green);
	/* 共有 .base-btn の border を打ち消す */
	border: 0;
	border-radius: 8px;
	color: #fff;
	font-weight: 700;
	font-size: 22px;
	line-height: 31px;
	text-decoration: none;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease, box-shadow var(--t_hover) ease;
}
/* #### hover（反転） */
#index .daiko .daiko-cta .sec-btn:hover {
	background-color: #fff;
	color: var(--c_green);
	box-shadow: inset 0 0 0 1px var(--c_green);
}
#index .daiko .daiko-cta .sec-btn::after {
	content: "";
	position: absolute;
	right: 12px;
	top: 50%;
	width: 10.2px;
	height: 14.7px;
	border: 0;
	transform: translateY(-50%);
	background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10.16 14.66' fill='none'%3E%3Cpath d='M1.25 1.25L8.25 7.33L1.25 13.41' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
}
#index .daiko .daiko-cta .sec-btn:hover::after {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10.16 14.66' fill='none'%3E%3Cpath d='M1.25 1.25L8.25 7.33L1.25 13.41' stroke='%2303AF7A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='miter'/%3E%3C/svg%3E");
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	/* #### base */
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .daiko { padding: 60px 20px 70px; }

	/* #### 見出し */
	#index .daiko .daiko-head { margin-bottom: 40px; }
	#index .daiko .daiko-title { font-size: 36px; line-height: 60px; }
	#index .daiko .daiko-sub { margin-top: 35px; font-size: 18px; line-height: 31px; }

	#index .daiko .daiko-group { flex-basis: 26.7332%; }
	#index .daiko .daiko-group.g2 { flex-basis: 25.1223%; }
	#index .daiko .daiko-group.g3 { flex-basis: 48.1445%; }

	/* #### 見出し帯 */
	#index .daiko .g1 .daiko-ghead,
	#index .daiko .g2 .daiko-ghead { clip-path: polygon(0 0, calc(100% - 15.5px) 0, 100% 50%, calc(100% - 15.5px) 100%, 0 100%); }

	#index .daiko .daiko-flow-inner::after { width: 28px; height: 21px; }

	/* #### タスクグリッド */
	#index .daiko .daiko-gbody { gap: 41px 0; padding: 43px 4px 58px; }
	#index .daiko .daiko-task .ic { width: 134px; height: 123px; }
	#index .daiko .daiko-task .tl { margin-top: 10px; font-size: 18px; line-height: 31px; }
	#index .daiko .daiko-group:not(.g1) .daiko-gbody::after { width: 8.5px; height: 22.1px; }

	/* #### メッセージ */
	#index .daiko .daiko-msg { margin-top: 41px; min-height: 232px; }
	#index .daiko .daiko-person.left  { left: 12px; width: 86.6px; }
	#index .daiko .daiko-person.right { right: 0;   width: 106.6px; }
	#index .daiko .daiko-msg-catch { font-size: 35px; line-height: 35px; }
	#index .daiko .daiko-msg-catch .daiko-msg-logo { width: 151px; }
	#index .daiko .daiko-msg-catch .big { font-size: 43px; }
	#index .daiko .daiko-msg-desc { margin-top: 34px; font-size: 15px; line-height: 26px; }

	/* #### なし箱 */
	#index .daiko .daiko-nashi { margin-top: 54px; gap: 20px; padding: 25px 215px 26px 24px; }
	#index .daiko .daiko-nashi-icon { width: 86.7px; }
	#index .daiko .daiko-nashi-body { max-width: 433px; }
	#index .daiko .daiko-nashi-desc { font-size: 16px; line-height: 31px; }
	#index .daiko .daiko-nashi-illust { right: 7px; width: 203.5px; }

	#index .daiko .daiko-cta { margin-top: 70px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .daiko { padding: 36px 15px 86px; }

	/* #### 見出し */
	#index .daiko .daiko-head { margin-bottom: 20px; }
	#index .daiko .daiko-title { font-size: 22px; line-height: 36px; letter-spacing: normal; }
	#index .daiko .daiko-sub { margin-top: 14px; font-size: 13px; line-height: 24px; text-align: center; }
	#index .daiko .daiko-sub br { display: none; }

	/* #### カードは3グループを縦積み */
	#index .daiko .daiko-flow-inner {
		display: block;
		border-radius: 10px;
		padding: 0;
	}
	#index .daiko .daiko-group,
	#index .daiko .daiko-group.g2,
	#index .daiko .daiko-group.g3 { flex: none; }
	#index .daiko .daiko-flow-inner::after { width: 22px; height: 17px; }

	/* #### 見出し帯 */
	#index .daiko .daiko-ghead {
		height: 45px;
		margin: 0;
		font-size: 18px;
		line-height: 31px;
		clip-path: none !important;
		border-radius: 0 !important;
	}
	#index .daiko .daiko-ghead .s { font-size: 13px; }
	#index .daiko .g1 .daiko-ghead { background: var(--c_green); border-radius: 10px 10px 0 0 !important; }
	#index .daiko .g2 .daiko-ghead { background: #239261; }
	#index .daiko .g3 .daiko-ghead { background: #106741; }
	/* #### 縦積みなので重ね（負マージン）とその補正 padding は解除 */
	#index .daiko .g2 .daiko-ghead,
	#index .daiko .g3 .daiko-ghead { margin-left: 0; padding-left: 20px; }

	#index .daiko .daiko-group + .daiko-group { margin-top: 0; }
	#index .daiko .daiko-group + .daiko-group .daiko-ghead::before {
		content: "";
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 7px 10px 0 10px;
		border-color: #fff transparent transparent transparent;
	}
	#index .daiko .daiko-ghead { position: relative; }

	/* #### タスクは2列 */
	#index .daiko .daiko-gbody,
	#index .daiko .daiko-gbody.wide { grid-template-columns: 1fr 1fr; gap: 18px 0; padding: 14px 6px 35px; }
	#index .daiko .daiko-group:not(.g1) .daiko-gbody::before,
	#index .daiko .daiko-group:not(.g1) .daiko-gbody::after { display: none; }
	#index .daiko .daiko-task .ic { width: 126px; height: 121px; }
	#index .daiko .daiko-task .tl { margin-top: 6px; font-size: 18px; line-height: 31px; }

	/* #### メッセージ */
	#index .daiko .daiko-msg {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-end;
		gap: 0 33px;
		margin-top: 37px;
		min-height: 0;
		text-align: center;
	}
	#index .daiko .daiko-msg-body { order: -1; width: 100%; }
	#index .daiko .daiko-msg-catch {
		display: block;
		font-size: 35px;
		line-height: 50px;
		white-space: normal;
	}
	#index .daiko .daiko-msg-catch .daiko-msg-logo {
		display: inline-block;
		width: 151px;
		margin-right: 9px;
		vertical-align: -10px;
	}
	#index .daiko .daiko-msg-catch .big { font-size: 43px; }
	#index .daiko .daiko-msg-desc { margin-top: 50px; font-size: 16px; line-height: 26px; }
	#index .daiko .daiko-person {
		position: static;
		display: block;
		margin-top: 19px;
	}
	#index .daiko .daiko-person.left  { left: auto;  width: 96.5px; }
	#index .daiko .daiko-person.right { right: auto; width: 106.6px; }

	/* #### なし箱：縦積み中央寄せ */
	#index .daiko .daiko-nashi {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0;
		margin-top: 38px;
		padding: 20px 18px 0;
	}
	#index .daiko .daiko-nashi-icon { width: 89px; }
	#index .daiko .daiko-nashi-body { margin-top: 15px; max-width: none; }
	#index .daiko .daiko-nashi-desc { margin-top: 6px; text-align: left; font-size: 14px; line-height: 28px; }
	#index .daiko .daiko-nashi-illust {
		position: static;
		right: auto;
		bottom: auto;
		margin-top: 6px;
		width: 172px;
	}

	/* #### CTA */
	#index .daiko .daiko-cta { margin-top: 65px; }
	#index .daiko .daiko-cta .sec-btn { width: 350px; max-width: 100%; height: 75px; font-size: 22px; }
}

/* ## 3つの違い／選ばれ続けています（比較表） */

#index .reason {
	position: relative;
	background: #fff;
}
/* #### 装飾ブロブ */
#index .reason .reason-blob {
	position: absolute;
	z-index: 0;
	width: 480px;
	height: 480px;
	border-radius: 102px;
	background: linear-gradient(180deg, var(--c_green_bg) 0%, rgba(213, 238, 245, 0.4) 100%);
	pointer-events: none;
}
#index .reason .reason-blob-1 {
	left: -30px;
	top: 3px;
	transform: translate(-50%, -50%) rotate(45deg);
}
#index .reason .reason-blob-2 {
	right: 17px;
	bottom: 1px;
	transform: translate(50%, 50%) rotate(45deg);
}
#index .reason .reason-inner {
	position: relative;
	z-index: 1;
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 20px;
}

/* #### 改行ヘルパー */
#index .reason .reason-brz { display: inline; }
#index .reason .reason-brtb { display: none; }
#index .reason .reason-brsp { display: none; }

/* #### 見出し */
#index .reason .reason-head {
	text-align: center;
	padding: 100px 0 50px;
}
#index .reason .reason-title {
	margin: 0;
	color: #000;
	font-weight: 500;
	font-size: 42px;
	line-height: 58px;
}
#index .reason .reason-lead {
	margin: 35px 0 0;
	color: #000;
	font-weight: 500;
	font-size: 18px;
	line-height: 31px;
}
/* #### リード「継続取引」の下線 */
#index .reason .reason-lead .reason-ul {
	padding: 0 6.25px 4.6px;
	margin: 0 -6.25px;
	line-height: inherit;
	white-space: nowrap;
	background: linear-gradient(#ffe033, #ffe033) no-repeat 0 100% / 100% 4px;
}

/* #### 3つの特徴カード */
#index .reason .reason-cards {
	display: flex;
	justify-content: center;
	gap: 25px;
	margin: 0;
	padding: 32px 0 0;
	list-style: none;
}
#index .reason .reason-card {
	flex: 1 1 0;
	min-width: 0;
	max-width: 350px;
	position: relative;
	box-sizing: border-box;
	background: #effff5;
	border: 1px solid #c1e0cb;
	border-radius: 6px;
	box-shadow: 4px 4px 5px 0 rgba(3, 175, 122, 0.3);
}
/* #### カード見出し帯 */
#index .reason .reason-card-head {
	position: relative;
	box-sizing: border-box;
	min-height: 116px;
	padding: 32px 12px 22px;
	background: var(--c_green);
	border-radius: 6px 6px 0 0;
	text-align: center;
}
/* #### 番号バッジ（帯の上端をまたぐ円） */
#index .reason .reason-card-num {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: var(--c_green);
	color: #fff;
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 700;
	font-size: 27px;
	line-height: 1;
}
#index .reason .reason-card-title {
	position: relative;
	z-index: 1;
	margin: 0;
	color: #fff;
	font-weight: 700;
	font-size: 23px;
	line-height: 31px;
}
/* #### カード本文 */
#index .reason .reason-card-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 14px 24px 23px;
}
#index .reason .reason-card-ill {
	display: block;
	width: 130px;
	height: auto;
}
#index .reason .reason-card-desc {
	margin: 0;
	color: #000;
	font-weight: 500;
	font-size: 16px;
	line-height: 30px;
	text-align: center;
}
#index .reason .reason-card-note {
	position: absolute;
	top: 100%;
	right: 0;
	margin: 7px 0 0;
	color: var(--c_text_green);
	font-weight: 500;
	font-size: 12px;
	line-height: 1.7;
	text-align: right;
	white-space: nowrap;
}
#index .reason .reason-mark {
	font-size: 0.72em;
	vertical-align: 2px;
}

/* #### 比較表 */
#index .reason .reason-table-wrap {
	margin-top: 66px;
}
#index .reason .reason-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
}
#index .reason .reason-table th,
#index .reason .reason-table td {
	box-sizing: border-box;
	vertical-align: middle;
	text-align: center;
	font-weight: 500;
}
/* #### 列幅 */
#index .reason .reason-table .rt-corner  { width: 15.27%; }
#index .reason .reason-table .rt-h-gen   { width: 37.64%; }
#index .reason .reason-table .rt-h-paid  { width: 47.09%; }
/* #### 見出し行 */
#index .reason .reason-table .rt-corner {
	background: transparent;
	border: 0;
}
#index .reason .reason-table thead th {
	height: 71px;
	padding: 8px 10px;
	line-height: 31px;
}
#index .reason .reason-table .rt-h-gen {
	background: #d5d5d5;
	color: #333;
	font-size: 21px;
	border-top: 1px solid #a9a9a9;
	border-left: 1px solid #a9a9a9;
	border-top-left-radius: 6px;
}
#index .reason .reason-table .rt-h-paid {
	background: var(--c_green);
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	border-top: 1px solid var(--c_green);
	border-right: 1px solid var(--c_green);
	border-top-right-radius: 6px;
}
/* #### 本文行の共通 */
#index .reason .reason-table tbody th,
#index .reason .reason-table tbody td {
	height: 96px;
	padding: 8px 10px;
	line-height: 31px;
}
/* #### 行ラベル列（緑・白文字） */
#index .reason .reason-table .rt-label {
	background: var(--c_green);
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	border-bottom: 1px solid #fff;
}
#index .reason .reason-table tbody tr:first-child .rt-label { border-top-left-radius: 6px; }
#index .reason .reason-table tbody tr:last-child  .rt-label { border-bottom-left-radius: 6px; border-bottom: 0; }
/* #### 一般的なBtoB後払いサービス列（グレー） */
#index .reason .reason-table .rt-gen {
	color: #333;
	font-weight: 700;
	font-size: 18px;
}
#index .reason .reason-table tbody tr:nth-child(odd)  .rt-gen { background: #ededed; }
#index .reason .reason-table tbody tr:nth-child(even) .rt-gen { background: #fefefe; }
#index .reason .reason-table tbody tr:last-child .rt-gen { border-bottom: 1px solid #a9a9a9; }
/* #### Paid列（緑ハイライト） */
#index .reason .reason-table .rt-paid {
	position: relative;
	color: #14584b;
	font-weight: 700;
	font-size: 18px;
	border-left: 1px solid var(--c_green);
	border-right: 1px solid var(--c_green);
}
#index .reason .reason-table tbody tr:nth-child(odd)  .rt-paid { background: #d5f8e2; }
#index .reason .reason-table tbody tr:nth-child(even) .rt-paid { background: #effff5; }
#index .reason .reason-table tbody tr:last-child .rt-paid {
	border-bottom: 1px solid var(--c_green);
	border-bottom-right-radius: 6px;
}
#index .reason .reason-table .rt-paid .lg {
	font-size: 30px;
	line-height: 1;
}
/* preamble の `main#index span{line-height:1}` を受けるので明示する */
#index .reason .reason-table .rt-paid .rt-paid-txt {
	display: inline-block;
	line-height: inherit;
}
#index .reason .reason-table .rt-gen .rt-sm { font-size: 15px; }
#index .reason .reason-table .rt-paid .rt-sm { font-weight: 500; font-size: 15px; }
/* #### Paid列のチェックアイコン（左に固定） */
#index .reason .reason-table .rt-check {
	position: absolute;
	left: 10%;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
}
/* #### 表下注釈 */
#index .reason .reason-table-note {
	margin: 5px 0 0;
	color: var(--c_text_green);
	font-size: 12px;
	line-height: 26px;
	text-align: right;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .reason .reason-inner { padding: 0 20px; }
	#index .reason { padding-bottom: 73px; }
	#index .reason .reason-table tbody tr:first-child .rt-paid .lg { font-size: 24px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .reason { padding-bottom: 50px; }
	#index .reason .reason-inner { padding: 0 24px; }
	#index .reason .reason-brtb { display: inline; }

	#index .reason .reason-blob { width: 350px; height: 350px; border-radius: 74px; }
	#index .reason .reason-blob-1 { left: -32px; top: -1px; }
	#index .reason .reason-blob-2 { right: 2px; bottom: -17px; }

	#index .reason .reason-head { padding: 60px 0 40px; }
	#index .reason .reason-title { font-size: 36px; line-height: 58px; }
	#index .reason .reason-lead { font-size: 18px; line-height: 31px; margin-top: 23px; }
	/* #### 下線 TB */
	#index .reason .reason-lead .reason-ul { padding: 0 7px 3.6px; margin: 0 -7px; }

	#index .reason .reason-cards { gap: 18px; padding-top: 32px; }
	#index .reason .reason-card-head { padding: 32px 8px 22px; }
	#index .reason .reason-card-body { padding: 14px 20px 23px; gap: 10px; }
	#index .reason .reason-card-note { font-size: 12px; margin-top: 13px; }
	#index .reason .reason-table-note { margin-top: 8px; }

	/* #### 表：列幅を TB 比率へ */
	#index .reason .reason-table-wrap { margin-top: 86px; }
	#index .reason .reason-table .rt-corner  { width: 18.4%; }
	#index .reason .reason-table .rt-h-gen   { width: 32%; }
	#index .reason .reason-table .rt-h-paid  { width: 49.6%; }
	#index .reason .reason-table thead th { height: 71px; }
	#index .reason .reason-table .rt-h-gen { font-size: 15px; line-height: 27px; }
	#index .reason .reason-table .rt-h-paid { font-size: 20px; }
	#index .reason .reason-table tbody th,
	#index .reason .reason-table tbody td { height: 96px; padding: 6px 6px; }
	#index .reason .reason-table .rt-label { font-size: 15px; }
	#index .reason .reason-table .rt-gen { font-size: 15px; }
	#index .reason .reason-table .rt-paid { font-size: 15px; }
	#index .reason .reason-table .rt-paid .lg { font-size: 22px; }
	#index .reason .reason-table .rt-gen .rt-sm,
	#index .reason .reason-table .rt-paid .rt-sm { font-size: 13px; }
	#index .reason .reason-table .rt-check { width: 30px; height: 30px; left: 7%; }
}

/* ### 1000px未満のラベル列 */
/* 内寸118pxでは「定額・継続請求」の末尾1文字が折り返すので左右paddingを詰める */
@media screen and (min-width: 941px) and (max-width: 999px) {
	#index .reason .reason-table .rt-label { padding-left: 4px; padding-right: 4px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .reason { padding-bottom: 62px; }
	#index .reason .reason-inner { padding: 0 15px; }
	#index .reason .reason-brz { display: none; }
	#index .reason .reason-brsp { display: inline; }

	#index .reason .reason-blob { width: 280px; height: 280px; border-radius: 60px; }
	#index .reason .reason-blob-1 { left: -93px; top: 17px; }
	#index .reason .reason-blob-2 { right: -64px; bottom: 3px; }

	#index .reason .reason-head { padding: 40px 0 20px; }
	#index .reason .reason-title { font-size: 22px; line-height: 36px; }
	#index .reason .reason-lead { font-size: 16px; line-height: 27px; margin-top: 14px; }
	/* #### 下線 SP */
	#index .reason .reason-lead .reason-ul { padding: 0 7.5px 1.7px; margin: 0 -7.5px; }

	/* #### カードは縦積み・横長レイアウト */
	#index .reason .reason-cards {
		flex-direction: column;
		align-items: stretch;
		gap: 15px;
		padding-top: 0;
	}
	#index .reason .reason-card { max-width: none; }
	#index .reason .reason-card-head {
		min-height: 78px;
		padding: 5px 14px 13px;
	}
	/* #### SPは番号バッジの円をやめ、帯上部に白文字で表示 */
	#index .reason .reason-card-num {
		position: static;
		transform: none;
		display: block;
		width: auto;
		height: auto;
		background: none;
		border-radius: 0;
		font-size: 18px;
		line-height: 1.5;
	}
	#index .reason .reason-card-title { font-size: 18px; line-height: 33px; }
	/* #### 本文 */
	#index .reason .reason-card-body {
		flex-direction: row-reverse;
		align-items: center;
		gap: 12px;
		padding: 14px 16px 21px;
	}
	#index .reason .reason-card:nth-child(2) .reason-card-body { flex-direction: row; }
	#index .reason .reason-card-ill { width: 96px; flex: 0 0 auto; }
	#index .reason .reason-card-desc { flex: 1; font-size: 16px; line-height: 30px; text-align: left; }
	#index .reason .reason-card-note { font-size: 12px; margin-top: 8px; }

	/* #### 表：SP列幅・チェック非表示 */
	#index .reason .reason-table-wrap { margin-top: 49px; }
	#index .reason .reason-table .rt-corner  { width: 19%; }
	#index .reason .reason-table .rt-h-gen   { width: 31%; }
	#index .reason .reason-table .rt-h-paid  { width: 50%; }
	#index .reason .reason-table thead th { height: 71px; padding: 6px 4px; }
	/* #### 見出しセルは3行に折り返す */
	#index .reason .reason-table .rt-h-gen { font-size: 13px; line-height: 1.3; }
	#index .reason .reason-table .rt-h-paid { font-size: 20px; }
	#index .reason .reason-table tbody th,
	#index .reason .reason-table tbody td { height: 96px; padding: 16px 5px; line-height: 24px; }
	#index .reason .reason-table .rt-label { font-size: 14px; }
	#index .reason .reason-table .rt-gen { font-size: 15px; }
	#index .reason .reason-table .rt-paid { font-size: 13px; }
	#index .reason .reason-table .rt-paid .lg { font-size: 20px; }
	#index .reason .reason-table .rt-gen .rt-sm,
	#index .reason .reason-table .rt-paid .rt-sm { font-size: 12px; }
	#index .reason .reason-table .rt-check { display: none; }
	#index .reason .reason-table-note { text-align: left; font-size: 12px; line-height: 21px; margin-top: 9px; }
}

/* ## 業種・取引形態を問わず使えます */

#index .industry {
	position: relative;
	z-index: 1;
	background: #ecf8f9;
}
#index .industry-inner {
	position: relative;
	z-index: 1;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 24px;
}

/* #### 下端の雲＋葉（次セクションへはみ出す） */
#index .industry-clouds {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 100%;
	max-width: none;
	height: auto;
	pointer-events: none;
	transform: translate(-50%, 53%);
}

/* #### 見出し */
#index .industry-head {
	text-align: center;
}
#index .industry-title {
	font-weight: 500;
	color: #000;
	letter-spacing: .02em;
}
#index .industry-lead {
	font-weight: 500;
	color: #000;
}

/* #### カードグリッド */
#index .industry-grid {
	position: relative;
	display: grid;
	justify-content: center;
}

/* #### カード共通（テーマ色は変数で切替） */
#index .ind-card {
	--bg: var(--c_mint);
	--bd: var(--c_border);
	--dark: var(--c_text_green);
	--line: var(--c_green);
	--pin: url("/img/pre/index/industry_pin_green.svg");
	--sh: rgba(3, 175, 122, .33);
	position: relative;
	display: flex;
	background: var(--bg);
	border: 1px solid var(--bd);
	border-radius: 6px;
	box-shadow: 3px 3px 8px -1px var(--sh);
}
#index .ind-card.ind-blue {
	--bg: #ebf7ff;
	--bd: #a6d3ea;
	--dark: #0a6f99;
	--line: #29abe2;
	--pin: url("/img/pre/index/industry_pin_blue.svg");
	--sh: rgba(10, 111, 153, .22);
}
/* #### 背面の重なりカード（少し傾けた紙の重ね） */
#index .ind-card::before {
	content: "";
	position: absolute;
	inset: -1px;
	z-index: -1;
	background: var(--bg);
	border: 1px solid var(--bd);
	border-radius: 6px;
	transform: rotate(-1.8deg);
	transform-origin: center;
}
/* .sa の opacity アニメーションで .ind-card がスタッキングコンテキストになり、
   z-index:-1 の ::before が親自身の背景・枠線より上に来る。
   手前カードの面と枠線を ::after で描き直して ::before を隠す（inset:-1px で親のボーダーボックスに一致）。 */
#index .ind-card::after {
	content: "";
	position: absolute;
	inset: -1px;
	z-index: -1;
	background: var(--bg);
	border: 1px solid var(--bd);
	border-radius: 6px;
	pointer-events: none;
}

/* #### 左：白パネル（アイコン＋業種名） */
#index .ind-card .ind-side {
	flex: 0 0 auto;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
	text-align: center;
	background: #fff;
	border-radius: 6px 0 0 6px;
}
#index .ind-card .ind-icon {
	display: block;
	flex: none;
	width: 63px;
	height: 64.5px;
	object-fit: contain;
}
#index .ind-card .ind-label {
	font-weight: 700;
	font-size: 16px;
	line-height: 24px;
	color: #333;
}

/* #### 右：本文（課題タグ／課題文／区切り／解決文） */
#index .ind-card .ind-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}
/* #### 課題タグ */
#index .ind-card .ind-badge {
	align-self: flex-start;
	background: #999;
	color: #fff;
	border-radius: 999px;
	font-weight: 500;
	font-size: 14px;
	height: 19px;
	line-height: 19px;
	padding: 0 11px;
	text-align: center;
	letter-spacing: .24em;
	text-indent: .24em;
}
#index .ind-card .ind-issue {
	font-weight: 500;
	color: #333;
	text-align: center;
}
/* #### 破線（中央がV字に落ちる1本の線） */
/* FigmaはV字部分も破線が続く1本のパス。左右は破線、中央のV字は ::after で描く。
   V字はフロー外に出して高さを1pxに保つ（入れると課題文と解決文の間隔が10px広がる）。 */
#index .ind-card .ind-div {
	--dash: repeating-linear-gradient(to right, var(--line) 0 2px, transparent 2px 5px);
	position: relative;
	width: 100%;
	height: 1px;
	background:
		var(--dash) left top / calc(50% - 10.75px) 1px no-repeat,
		var(--dash) right top / calc(50% - 10.75px) 1px no-repeat;
}
#index .ind-card .ind-div::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	width: 21.5px;
	height: 10.5px;
	margin-left: -10.75px;
	background: var(--line);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.5 10.5'%3E%3Cpath d='M0 0.5L10.75 10L21.5 0.5' fill='none' stroke='black' stroke-width='1' stroke-dasharray='2 3'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.5 10.5'%3E%3Cpath d='M0 0.5L10.75 10L21.5 0.5' fill='none' stroke='black' stroke-width='1' stroke-dasharray='2 3'/%3E%3C/svg%3E") no-repeat center / contain;
}
#index .ind-card .ind-solve {
	font-weight: 700;
	color: var(--dark);
	text-align: center;
}

/* #### ピンの装飾 */
/* 白い球＋アクセント色の線の2色構成なので、マスクではなく画像で出す（--pin はカード色ごとに別ファイル） */
#index .ind-card .ind-pin {
	position: absolute;
	z-index: 2;
	top: -18.5px;
	width: 20.5px;
	height: 56px;
	background: var(--pin) no-repeat center / contain;
}

/* #### 中央の人物イラスト */
#index .industry-person {
	display: block;
	height: auto;
	pointer-events: none;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .industry {
		padding: 0 0 215px;
	}
	#index .industry-head {
		padding-top: 100px;
		margin-bottom: 68px;
	}
	#index .industry-title {
		font-size: 42px;
		line-height: 58px;
	}
	#index .industry-lead {
		font-size: 18px;
		line-height: 31px;
		margin-top: 35px;
	}

	/* 1240px設計をグリッド幅の%で持つ（1440では従来と同値。px固定だと狭い幅で左右が見切れる） */
	#index .industry-grid {
		grid-auto-flow: column;
		grid-template-rows: repeat(3, minmax(214px, auto));
		grid-template-columns: repeat(2, 41.532258%);
		column-gap: 3.548387%;
		row-gap: 43px;
		transform: translateX(-1.451613%);
	}
	/* #### 中段を外側へずらす */
	#index .ind-card:nth-child(2) { left: -8.932039%; }
	#index .ind-card:nth-child(5) { left: 14.757282%; }

	#index .ind-card .ind-side {
		flex-basis: 27.095517%;
		padding: 14px 1.559454%;
	}

	#index .ind-card .ind-body { padding: 19px 3.118908% 16px; }
	#index .ind-card .ind-badge { margin-bottom: 5px; }
	#index .ind-card .ind-issue { font-size: 15px; line-height: 25px; }
	#index .ind-card .ind-div { margin: 11px 0 26px; }
	#index .ind-card .ind-solve { font-size: 22px; line-height: 35px; }

	#index .ind-card .ind-pin { left: 3.313840%; }

	/* 中段カードの隙間に対する比率を保つため、位置・幅ともグリッド基準の%で持つ。
	   縦は行の高さが幅で変わるので中段の中央に合わせる（-2.05pxで1440時の254pxに一致）。 */
	#index .industry-person {
		position: absolute;
		z-index: 3;
		left: 51.451613%;
		top: calc(50% - 2.05px);
		transform: translate(-50%, -50%);
		width: 16.451613%;
	}
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .industry {
		padding: 0 0 20px;
	}
	#index .industry-clouds {
		width: 1170px;
	}
	#index .industry-head {
		padding-top: 60px;
		margin-bottom: 70px;
	}
	#index .industry-title {
		font-size: 36px;
		line-height: 58px;
	}
	#index .industry-lead {
		font-size: 18px;
		line-height: 31px;
		margin-top: 23px;
	}

	#index .industry-grid {
		grid-auto-flow: column;
		grid-template-rows: repeat(3, minmax(254px, auto));
		grid-template-columns: repeat(2, minmax(0, 347px));
		column-gap: 30px;
		row-gap: 41px;
	}
	#index .ind-card:nth-child(2),
	#index .ind-card:nth-child(5) { left: auto; }

	#index .ind-card .ind-side {
		flex-basis: 34%;
		padding: 16px 4px;
	}

	#index .ind-card .ind-body {
		padding: 16px 12px;
		align-items: center;
	}
	#index .ind-card .ind-badge {
		align-self: center;
		margin-bottom: 9px;
	}
	#index .ind-card .ind-issue { font-size: 15px; line-height: 25px; }
	#index .ind-card .ind-div { margin: 14px 0 17px; }
	#index .ind-card .ind-solve { font-size: 22px; line-height: 35px; }

	#index .ind-card .ind-pin { left: 14px; top: -19px; }

	#index .industry-person {
		position: relative;
		z-index: 3;
		left: auto;
		top: auto;
		transform: none;
		grid-column: 1 / -1;
		grid-row: 4;
		justify-self: center;
		width: 180.6px;
		margin: -83px 0 0;
	}
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .industry {
		padding: 0 0 7px;
	}
	#index .industry-clouds {
		transform: translate(-50%, 48%);
		width: 594px;
	}
	#index .industry-inner {
		padding: 0 15px;
	}
	#index .industry-head {
		padding-top: 40px;
		margin-bottom: 38px;
	}
	#index .industry-title {
		font-size: 28px;
		line-height: 36px;
		max-width: 248px;
		margin-left: auto;
		margin-right: auto;
	}
	#index .industry-lead {
		font-size: 16px;
		line-height: 27px;
		margin-top: 17px;
	}

	#index .industry-grid {
		grid-auto-flow: row;
		grid-template-columns: minmax(0, 347px);
		grid-template-rows: repeat(6, minmax(200px, auto));
		row-gap: 47px;
	}

	#index .ind-card .ind-side {
		padding: 16px 4px;
	}

	#index .ind-card .ind-body { padding: 16px 6px; }
	#index .ind-card .ind-issue { font-size: 15px; line-height: 24px; }
	#index .ind-card .ind-div { margin: 16px 0 14px; }
	#index .ind-card .ind-solve { font-size: 18px; line-height: 28px; }
	/* #### FigmaのSP解決文は強制改行なしの2行組み */
	#index .ind-card .ind-solve br { display: none; }

	#index .industry-person {
		grid-column: 1 / -1;
		grid-row: auto;
		justify-self: center;
		width: 129.4px;
		margin: -19px 0 0;
	}
}

/* ## 導入の流れ */

/* #### 共有ミントパネル（F・Gに跨る） */
#index .flow {
	position: relative;
	background: #fff;
}
/* #### 共有ミントパネル（全BP共通で中央寄せ・上端のみ角丸） */
#index .flow .flow-panel {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: min(1200px, calc(100% - 48px));
	margin: 0 auto;
	background: var(--c_mint);
	border-radius: 6px 6px 0 0;
}
#index .flow .flow-inner {
	position: relative;
	z-index: 1;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ### 見出し周りの装飾 */
#index .flow .flow-panel::before,
#index .flow .flow-panel::after {
	content: "";
	position: absolute;
	z-index: 0;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
	pointer-events: none;
}
#index .flow .flow-panel::before { background-image: url("/img/pre/index/flow_calendar.svg"); }
#index .flow .flow-panel::after  { background-image: url("/img/pre/index/flow_hourglass.svg"); }

/* #### 見出し */
#index .flow .flow-head {
	text-align: center;
	color: #000;
	padding: 100px 0 48px;
}
#index .flow .flow-title {
	font-weight: 500;
	font-size: 42px;
	line-height: 58px;
}
#index .flow .flow-sub {
	font-weight: 500;
	font-size: 18px;
	line-height: 58px;
	margin-top: 11px;
}

/* #### ステップ群：1枚の白カードを縦点線で4分割（PC/TB） */
#index .flow .flow-steps {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: 1095px;
	display: flex;
	background: #fff;
	border: 1px solid var(--c_border);
	border-radius: 10px;
	overflow: hidden;
}
#index .flow .flow-step {
	position: relative;
	flex: 0 1 25%;
	min-width: 0;
	display: flex;
	flex-direction: column;
}
/* #### 列幅（等幅ではない） */
#index .flow .flow-step:nth-child(1) { flex-basis: 26.8%; }
#index .flow .flow-step:nth-child(2) { flex-basis: 23.06%; }
#index .flow .flow-step:nth-child(3) { flex-basis: 24.25%; }
#index .flow .flow-step:nth-child(4) { flex-basis: 25.89%; }
/* #### 列間の縦点線 */
#index .flow .flow-step + .flow-step::before,
#index .flow .flow-step + .flow-step::after {
	content: "";
	position: absolute;
	left: 0;
	width: 1px;
	background-repeat: repeat-y;
	background-size: 1px 4px;
	z-index: 1;
}
#index .flow .flow-step + .flow-step::before {
	top: 16px;
	height: 98px;
	background-image: linear-gradient(to bottom, #fff 1px, rgba(255, 255, 255, 0) 1px);
}
#index .flow .flow-step + .flow-step::after {
	top: 142px;
	height: 210px;
	background-image: linear-gradient(to bottom, var(--c_green) 1px, rgba(3, 175, 122, 0) 1px);
}
/* #### 列間の矢印（右向き・黄緑 #88be25） */
#index .flow .flow-step + .flow-step .flow-step-body::before {
	content: "";
	position: absolute;
	left: -1px;
	width: 17px;
	height: 33px;
	/* #### 素材のink bboxは13x29 */
	background: url("/img/pre/index/flow_arrow.svg") no-repeat center / 100% 100%;
	z-index: 2;
}

/* #### 緑ヘッダー（番号＋タイトル） */
#index .flow .flow-step-head {
	position: relative;
	overflow: hidden;
	min-height: 131px;
	padding: 16px 8px;
	box-sizing: border-box;
	background: var(--c_green);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* #### 連番（透かし） */
#index .flow .flow-num {
	position: absolute;
	left: -10px;
	top: 28px;
	font-family: "pd-fv-num", "Roboto", var(--ff_roboto), sans-serif;
	font-style: italic;
	font-weight: 700;
	font-size: 125.23px;
	line-height: 39.5px;
	color: #5dcd9b;
	pointer-events: none;
}
#index .flow .flow-step-title {
	position: relative;
	z-index: 1;
	font-weight: 700;
	font-size: 22.569px;
	line-height: 39.5px;
	text-align: center;
}

/* #### 白ボディ（アイコン＋説明） */
#index .flow .flow-step-body {
	position: relative;
	flex: 1;
	padding: 44px 14px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}
#index .flow .flow-icon {
	height: 90px;
	margin-bottom: 21px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#index .flow .flow-icon img { display: block; width: auto; max-height: 100%; }
#index .flow .flow-step-desc {
	color: #000;
	font-weight: 500;
	font-size: 18.808px;
	line-height: 28px;
	text-align: center;
}

/* #### STEP1バッジ「3分で完了」（オレンジ吹き出し） */
#index .flow .flow-badge {
	position: absolute;
	z-index: 3;
	top: 128px;
	left: 42px;
	width: 55.77px;
	height: 48.45px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url("/img/pre/index/flow_badge.svg") no-repeat center / contain;
}
#index .flow .flow-badge-t {
	color: #fff;
	font-weight: 500;
	font-size: 12.407px;
	line-height: 15.5px;
	text-align: center;
}
#index .flow .flow-badge-t .n {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 500;
	font-size: 20.984px;
	line-height: 15.5px;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .flow .flow-panel {
		margin-top: 80px;
		padding-bottom: 8px;
	}
	#index .flow .flow-steps { max-width: 1095px; }

	/* #### 装飾 */
	#index .flow .flow-panel::before { left: 49px;  top: -37px; width: 203px; height: 177px; }
	#index .flow .flow-panel::after  { right: 94px; top: -53px; width: 173px; height: 155px; }

	#index .flow .flow-step + .flow-step .flow-step-body::before { top: 99px; }

	/* #### 連番と見出しの間隔 */
	#index .flow .flow-step:nth-child(1) .flow-num { left: 12px; }
	#index .flow .flow-step:nth-child(1) .flow-step-head { padding-left: 50px; }
	#index .flow .flow-step:nth-child(2) .flow-step-head { padding-left: 49px; }
	#index .flow .flow-step:nth-child(3) .flow-step-head { padding-left: 24px; }
	#index .flow .flow-step:nth-child(4) .flow-step-head { padding-right: 27px; }

	/* #### STEP1のみ */
	#index .flow .flow-step:nth-child(1) .flow-step-body { padding-left: 56px; }
}

@media screen and (min-width: 941px) and (max-width: 1060px) {
	#index .flow .flow-step-desc { font-size: 16px; line-height: 26px; }
	#index .flow .flow-icon { margin-bottom: 23px; }
	#index .flow .flow-step-body { padding-bottom: 25px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .flow .flow-panel {
		width: calc(100% - 46px);
		margin-top: 31px;
		padding-bottom: 15px;
	}
	#index .flow .flow-inner { padding: 0 11px; }
	#index .flow .flow-head { padding: 60px 0 44px; }
	#index .flow .flow-title { font-size: 36px; }
	#index .flow .flow-sub { font-size: 18px; margin-top: 0; }

	#index .flow .flow-steps { max-width: 100%; }
	/* #### 列幅 */
	#index .flow .flow-step:nth-child(1) { flex-basis: 24.93%; }
	#index .flow .flow-step:nth-child(2) { flex-basis: 24.54%; }
	#index .flow .flow-step:nth-child(3) { flex-basis: 24.93%; }
	#index .flow .flow-step:nth-child(4) { flex-basis: 25.6%; }
	#index .flow .flow-step-head { min-height: 127px; padding: 14px 6px; }
	#index .flow .flow-step:nth-child(1) .flow-num { left: -22px; }
	#index .flow .flow-step-body { padding: 32px 8px 37px; }
	#index .flow .flow-icon { height: 88px; margin-bottom: 30px; }
	#index .flow .flow-step-desc { font-size: 16px; line-height: 26px; }
	#index .flow .flow-badge { top: 36%; left: 4%; }

	/* #### 装飾 */
	#index .flow .flow-panel::before { left: 31px;  top: -26px; width: 172px; height: 150px; }
	#index .flow .flow-panel::after  { right: 21px; top: -31px; width: 171px; height: 153px; }

	#index .flow .flow-step + .flow-step .flow-step-body::before { top: 103px; }
}

/* #### TB下限側（641〜768） */
@media screen and (min-width: 641px) and (max-width: 768px) {
	#index .flow .flow-num { font-size: 100px; }
	#index .flow .flow-step-title { font-size: 19px; line-height: 33px; }
	#index .flow .flow-step-body { padding: 26px 6px 30px; }
	#index .flow .flow-icon { height: 76px; margin-bottom: 24px; }
	#index .flow .flow-step-desc { font-size: 13.5px; line-height: 22px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .flow .flow-panel {
		width: calc(100% - 30px);
		margin-top: 24px;
		padding-bottom: 10px;
	}
	#index .flow .flow-inner { padding: 0 22px; }
	#index .flow .flow-head { padding: 68px 0 20px; }
	#index .flow .flow-title { font-size: 28px; line-height: 38px; }
	#index .flow .flow-sub { font-size: 16px; line-height: 27px; margin-top: 14px; }

	/* #### カード群：縦積み・個別カード化 */
	#index .flow .flow-steps {
		flex-direction: column;
		max-width: 315px;
		gap: 15px;
		background: none;
		border: 0;
		border-radius: 0;
		overflow: visible;
	}
	/* :nth-child(n) は同詳細度なので後勝ちで解除できる */
	#index .flow .flow-step:nth-child(n) { flex-basis: auto; }
	#index .flow .flow-step {
		flex: 0 0 auto;
		background: #fff;
		border: 1px solid var(--c_border);
		border-radius: 10px;
		overflow: hidden;
	}
	/* #### 区切り点線・矢印はSPでは非表示 */
	#index .flow .flow-step + .flow-step::before,
	#index .flow .flow-step + .flow-step::after { display: none; }
	#index .flow .flow-step + .flow-step .flow-step-body::before { display: none; }
	/* #### SPはタイトル改行を無効化（1行表示） */
	#index .flow .flow-step-title br { display: none; }

	#index .flow .flow-step-head {
		min-height: 0;
		height: 49px;
		padding: 0 12px;
	}
	#index .flow .flow-num { font-size: 62px; left: 4px; top: 7px; }
	#index .flow .flow-step:nth-child(n) .flow-num { left: 4px; }
	#index .flow .flow-step-title { font-size: 18px; }

	#index .flow .flow-step-body { padding: 9px 14px 15px; }
	#index .flow .flow-icon { height: 88px; margin-bottom: 8px; }
	#index .flow .flow-step-desc { font-size: 16px; line-height: 26px; }
	#index .flow .flow-badge { top: 83px; left: 35px; }

	/* #### 装飾 */
	#index .flow .flow-panel::before { left: 7px;  top: -26px; width: 113px; height: 99px; }
	#index .flow .flow-panel::after  { right: 11px; top: -24px; width: 98px;  height: 89px; }
}

/* ## 料金構造 / シンプルな3要素のみ */

#index .price {
	position: relative;
	background: #fff;
	padding: 0 0 76px;
}

/* #### 共有ミントパネル（下半分） */
#index .price-panel {
	position: relative;
	box-sizing: border-box;
	width: min(1200px, calc(100% - 48px));
	margin: 0 auto;
	padding: 60px 50px 77px;
	background: var(--c_mint);
	border-radius: 0 0 6px 6px;
}

/* #### Flow との境界の点線 */
#index .price-divider {
	border: 0;
	border-top: 2px dotted #8bcfae;
	margin: 0;
	height: 0;
}

/* #### 装飾コイン */
#index .price-coin {
	display: block;
	position: absolute;
	z-index: 1;
	height: auto;
	pointer-events: none;
}

/* #### 見出し */
#index .price-head {
	position: relative;
	z-index: 2;
	text-align: center;
	padding: 100px 0 30px;
}
#index .price-title {
	color: #000;
	font-weight: 500;
	font-size: 42px;
	line-height: 1.38;
	letter-spacing: 0.02em;
}
#index .price-subtitle {
	color: #000;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.5;
	margin-top: 10px;
}

/* #### 3枚のカード */
#index .price-cards {
	display: flex;
	justify-content: center;
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}
#index .price-card {
	position: relative;
	box-sizing: border-box;
	flex: 1 1 0;
	min-width: 0;
	min-height: 256px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #fff;
	border: 1px solid var(--c_border);
	border-radius: 10px;
	box-shadow: 3px 3px 3px 1px rgba(3, 175, 122, 0.5);
}
/* #### グラデーションのラベル（ピル） */
#index .price-label {
	box-sizing: border-box;
	width: calc(100% - 32px);
	margin: 15px auto 0;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(90deg, var(--c_green) 0%, #29a2d5 100%);
	border-radius: 999px;
	color: #fff;
	font-weight: 700;
	font-size: 25px;
	line-height: 1;
	white-space: nowrap;
}
/* #### 値エリア（ラベル下を占有し中央寄せ） */
#index .price-body {
	flex: 1;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
#index .price-value {
	display: inline-flex;
	align-items: flex-end;
	color: var(--c_green);
	line-height: 1;
}
#index .price-value .num {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 700;
	font-size: 128px;
	line-height: 0.82;
}
#index .price-value .unit {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-size: 24px;
	margin-left: 2px;
	padding-bottom: 6px;
}
/* #### 保証料の「請求金額の」＋料率 */
#index .price-pre {
	color: var(--c_green);
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	margin-bottom: 2px;
}
#index .price-value--rate .num { font-size: 64px; line-height: 1; }
#index .price-value--rate .tilde {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 700;
	font-size: 42px;
	align-self: center;
	line-height: 1;
}
#index .price-value--rate .pct {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 700;
	font-size: 24px;
	padding-bottom: 4px;
}

/* #### 事務手数料バンド */
#index .price-fee {
	box-sizing: border-box;
	margin: 20px 0 0;
	min-height: 63px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: #fff;
	border: 1px solid var(--c_border);
	border-radius: 10px;
	box-shadow: 3px 3px 3px 1px rgba(3, 175, 122, 0.5);
	color: var(--c_green);
	font-weight: 700;
	font-size: 25px;
	line-height: 1.4;
	text-align: center;
}

/* #### 注釈 */
#index .price-note {
	color: var(--c_text_green);
	font-weight: 500;
	font-size: 16px;
	line-height: 42px;
	margin-top: 3px;
	text-align: right;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .price-card { max-width: 353px; }
	#index .price-label { width: calc(100% - 60px); }

	/* #### 見出しと副題 */
	#index .price-subtitle { line-height: 58px; margin-top: 0; }

	/* #### 注釈の右端 */
	#index .price-note { padding-right: 22px; }

	/* #### 装飾コイン */
	#index .price-coin--l { left: 48px; top: 29px; width: 188px; }
	#index .price-coin--r { right: 72px; top: 11px; width: 177px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .price { padding: 0 0 56px; }
	#index .price-panel { width: calc(100% - 46px); padding: 52px 12px 48px; }
	#index .price-head { padding: 52px 0 26px; }
	#index .price-title { font-size: 36px; }
	#index .price-subtitle { font-size: 16px; }

	#index .price-divider { margin-left: -12px; margin-right: -12px; }

	#index .price-cards { gap: 16px; }
	#index .price-card { min-height: 220px; }
	#index .price-label { width: calc(100% - 32px); }
	#index .price-value .num { font-size: 100px; }
	#index .price-value--rate .num { font-size: 52px; }

	#index .price-fee { min-height: 53px; }

	#index .price-note { margin-right: -12px; }

	/* #### 装飾コイン */
	#index .price-coin--l { left: 0; top: 22px; width: 183px; }
	#index .price-coin--r { right: 27px; top: 9px; width: 165px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .price { padding: 0 0 44px; }
	#index .price-panel { width: calc(100% - 30px); padding: 44px 28px 36px; }
	#index .price-head { padding: 40px 0 20px; }
	#index .price-title { font-size: 28px; }
	#index .price-subtitle { font-size: 16px; margin-top: 14px; }

	#index .price-divider { margin-left: -12px; margin-right: -12px; }

	/* #### 装飾コイン */
	#index .price-coin--l { left: 0; top: 5px; width: 118px; }
	#index .price-coin--r { right: 5px; top: -2px; width: 109px; }

	/* #### カードは縦積み */
	#index .price-cards {
		flex-direction: column;
		align-items: center;
		gap: 16px;
	}
	#index .price-card {
		width: 100%;
		max-width: 305px;
		flex: none;
		min-height: 148px;
	}
	#index .price-label { width: calc(100% - 40px); height: 40px; font-size: 18px; }
	#index .price-value .num { font-size: 68px; }
	#index .price-value .unit { font-size: 16px; padding-bottom: 4px; }
	#index .price-pre { font-size: 16px; }
	#index .price-value--rate .num { font-size: 35px; }
	#index .price-value--rate .tilde { font-size: 28px; }
	#index .price-value--rate .pct { font-size: 16px; padding-bottom: 2px; }

	#index .price-fee {
		width: 100%;
		max-width: 305px;
		margin: 16px auto 0;
		min-height: 58px;
		font-size: 18px;
	}
	#index .price-note {
		font-size: 13px;
		line-height: 24px;
		text-align: left;
		margin-top: 9px;
		margin-right: 0;
	}
}

/* ## 資料DL CTAバンド */

#index .dl-band {
	position: relative;
	background: var(--c_green);
	/* #### 縦のはみ出し（下方向のアーチ）を許可 */
}

/* #### 緑帯の下端カーブ（セクション跨ぎ） */
#index .dl-band .dl-band-fade {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 0;
	pointer-events: none;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% 100%;
}

/* #### コンテンツ（中央寄せ） */
#index .dl-band .dl-band-inner {
	position: relative;
	z-index: 2;
	max-width: 1440px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	color: #fff;
}

/* #### リード上段「3分で読める」＋ ＼／ 装飾 */
#index .dl-band .dl-band-min {
	display: inline-flex;
	align-items: baseline;
	justify-content: center;
	gap: .55em;
	margin: 0;
	font-weight: 700;
	color: #fff;
	line-height: 1;
}
#index .dl-band .dl-band-min::before { content: "＼"; font-weight: 400; }
#index .dl-band .dl-band-min::after { content: "／"; font-weight: 400; }
#index .dl-band .dl-band-min .n {
	font-family: var(--ff_roboto), "Roboto", sans-serif;
	font-weight: 700;
	margin-right: .12em;
}

/* #### リード主文 */
#index .dl-band .dl-band-lead {
	margin: 5px 0 0;
	font-weight: 700;
	color: #fff;
	line-height: 1.5;
}

/* #### CTA：資料ダウンロード（オレンジ） */
#index .dl-band .dl-band-cta {
	margin-top: 29px;
}
#index .dl-band .pri-cv-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	text-decoration: none;
	background: var(--c_orange);
	/* 共有 .base-btn の border を打ち消す */
	border: 0;
	color: #fff;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease, box-shadow var(--t_hover) ease;
}
/* #### hover（反転） */
#index .dl-band .pri-cv-btn:hover,
#index .dl-band .pri-cv-btn:focus-visible {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--c_orange);
	color: var(--c_orange);
}
#index .dl-band .pri-cv-btn .free {
	flex: 0 0 auto;
	border-radius: 50%;
	background: #fff;
	color: var(--c_orange);
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### 無料バッジも反転（白丸＋オレンジ字 → オレンジ丸＋白字） */
#index .dl-band .pri-cv-btn:hover .free,
#index .dl-band .pri-cv-btn:focus-visible .free {
	background: var(--c_orange);
	color: #fff;
}
#index .dl-band .pri-cv-btn .labels {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.15;
}
#index .dl-band .pri-cv-btn .first {
	font-weight: 700;
	white-space: nowrap;
}
#index .dl-band .pri-cv-btn.icon-dl::after {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E") no-repeat center / contain;
}
#index .dl-band .pri-cv-btn.icon-dl:hover::after,
#index .dl-band .pri-cv-btn.icon-dl:focus-visible::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee8d37' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E");
}

/* #### 装飾ドキュメント */
#index .dl-band .dl-band-docs {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
	max-width: 1440px;
	margin: 0 auto;
	opacity: .7;
	pointer-events: none;
}
#index .dl-band .dl-doc {
	position: absolute;
	display: block;
	box-sizing: border-box;
	height: auto;
	aspect-ratio: 236.5 / 133;
	object-fit: cover;
	border: 1.5px solid #fff;
	box-shadow: 0 0 9px rgba(255, 255, 255, .68);
}
#index .dl-band .dl-doc1 { transform: translate(-50%, -50%) rotate(3.84deg); }
#index .dl-band .dl-doc2 { transform: translate(-50%, -50%) rotate(-7.72deg); }
#index .dl-band .dl-doc3 { transform: translate(50%, -50%) rotate(-3.41deg); }
#index .dl-band .dl-doc4 { transform: translate(50%, -50%) rotate(6.58deg); }

/* #### 境界イラスト */
#index .dl-band .dl-band-flag {
	position: absolute;
	left: 50%;
	z-index: 3;
	pointer-events: none;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .dl-band .dl-band-inner { padding: 35px 24px 58px; }

	#index .dl-band .dl-band-min { font-size: 19.93px; }
	#index .dl-band .dl-band-min .n { font-size: 28.78px; }

	#index .dl-band .dl-band-lead { font-size: 26.57px; }

	#index .dl-band .pri-cv-btn {
		width: 379px;
		height: 83px;
		padding: 0 68.47px 0 20.8px;
		gap: 17.11px;
		border-radius: 11px;
	}
	#index .dl-band .pri-cv-btn .free { width: 52.57px; height: 52.57px; font-size: 17.12px; }
	#index .dl-band .pri-cv-btn .first { font-size: 25.67px; }
	#index .dl-band .pri-cv-btn.icon-dl::after { right: 22.6px; width: 25.06px; height: 23.23px; }

	#index .dl-band .dl-band-fade {
		height: 124px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 124' preserveAspectRatio='none'%3E%3Cpath d='M0 124C0 124 293.347 24.5 715.847 24.5C1138.35 24.5 1440 124 1440 124L1440 0L0 0Z' fill='%2303AF7A'/%3E%3C/svg%3E");
	}

	/* #### 境界イラスト */
	#index .dl-band .dl-band-flag { width: 125.32px; height: 60px; margin-left: -48px; bottom: -40px; }

	#index .dl-band .dl-doc { width: 236.5px; }
	#index .dl-band .dl-doc1 { top: 131.21px; left: 340.77px; }
	#index .dl-band .dl-doc2 { top: 257.65px; left: 305.04px; }
	#index .dl-band .dl-doc3 { top: 155px; right: 331.8px; }
	#index .dl-band .dl-doc4 { top: 232.71px; right: 288.63px; }
}
/* #### PC 中間幅：資料を画面端へ寄せて本文との重なりを回避 */
@media screen and (min-width: 941px) and (max-width: 1240px) {
	#index .dl-band .dl-doc { width: 190px; }
	#index .dl-band .dl-doc1 { left: 118px; }
	#index .dl-band .dl-doc2 { left: 105px; }
	#index .dl-band .dl-doc3 { right: 118px; }
	#index .dl-band .dl-doc4 { right: 105px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .dl-band .dl-band-inner { padding: 35px 20px 29.28px; }

	#index .dl-band .dl-band-min { font-size: 17.31px; }
	#index .dl-band .dl-band-min .n { font-size: 25px; }

	#index .dl-band .dl-band-lead { font-size: 23.33px; margin-top: 4.5px; }

	#index .dl-band .dl-band-cta { margin-top: 22.75px; }
	#index .dl-band .pri-cv-btn {
		width: 284.77px;
		height: 62.47px;
		padding: 0 51.43px 0 15.62px;
		gap: 12.86px;
		border-radius: 8.27px;
	}
	#index .dl-band .pri-cv-btn .free { width: 39.5px; height: 39.5px; font-size: 12.86px; }
	#index .dl-band .pri-cv-btn .first { font-size: 19.29px; }
	#index .dl-band .pri-cv-btn.icon-dl::after { right: 16.99px; width: 18.83px; height: 17.45px; }

	#index .dl-band .dl-band-fade {
		height: 102.11px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 835 102.11' preserveAspectRatio='none'%3E%3Cpath d='M0 102.11C0 102.11 170.1 36 415.092 36C660.083 36 835 102.11 835 102.11L835 0L0 0Z' fill='%2303AF7A'/%3E%3C/svg%3E");
	}

	/* #### 境界イラスト */
	#index .dl-band .dl-band-flag { width: 125.32px; height: 60px; margin-left: -63px; bottom: -43px; }

	#index .dl-band .dl-doc { width: 165px; }
	#index .dl-band .dl-doc1 { top: 116.81px; left: 152.88px; }
	#index .dl-band .dl-doc2 { top: 205.04px; left: 127.94px; }
	#index .dl-band .dl-doc3 { top: 133.03px; right: 143.73px; }
	#index .dl-band .dl-doc4 { top: 187.25px; right: 113.61px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .dl-band .dl-band-inner { padding: 24px 16px 63.68px; }

	#index .dl-band .dl-band-min { font-size: 12.46px; gap: .4em; }
	#index .dl-band .dl-band-min .n { font-size: 18px; }

	#index .dl-band .dl-band-lead { font-size: 18px; line-height: 1.45; margin-top: 6.85px; }

	#index .dl-band .dl-band-cta { margin-top: 17.19px; }
	#index .dl-band .pri-cv-btn {
		width: 264.77px;
		height: 58.08px;
		padding: 0 47.83px 0 14.52px;
		gap: 11.95px;
		border-radius: 7.69px;
	}
	#index .dl-band .pri-cv-btn .free { width: 36.73px; height: 36.73px; font-size: 11.96px; }
	#index .dl-band .pri-cv-btn .first { font-size: 17.94px; }
	#index .dl-band .pri-cv-btn.icon-dl::after { right: 15.8px; width: 17.51px; height: 16.23px; }

	#index .dl-band .dl-band-fade {
		height: 49.16px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 391 49.16' preserveAspectRatio='none'%3E%3Cpath d='M0 49.16C0 49.16 79.6517 15 194.372 15C309.092 15 391 49.16 391 49.16L391 0L0 0Z' fill='%2303AF7A'/%3E%3C/svg%3E");
	}

	#index .dl-band .dl-band-docs {
		bottom: -49.16px;
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 391 49.16' preserveAspectRatio='none'%3E%3Cpath d='M0 49.16C0 49.16 79.6517 15 194.372 15C309.092 15 391 49.16 391 49.16L391 0L0 0Z' fill='%23fff'/%3E%3C/svg%3E"), linear-gradient(#000, #000);
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 391 49.16' preserveAspectRatio='none'%3E%3Cpath d='M0 49.16C0 49.16 79.6517 15 194.372 15C309.092 15 391 49.16 391 49.16L391 0L0 0Z' fill='%23fff'/%3E%3C/svg%3E"), linear-gradient(#000, #000);
		-webkit-mask-repeat: no-repeat;
		mask-repeat: no-repeat;
		-webkit-mask-position: center bottom, center top;
		mask-position: center bottom, center top;
		-webkit-mask-size: 100% 49.16px, 100% calc(100% - 49.16px);
		mask-size: 100% 49.16px, 100% calc(100% - 49.16px);
	}

	/* #### 境界イラスト */
	#index .dl-band .dl-band-flag { width: 86.68px; height: 41.5px; margin-left: -43px; bottom: -21.5px; }

	#index .dl-band .dl-doc { width: 133px; }
	#index .dl-band .dl-doc1 { top: 199.75px; left: 58.81px; }
	#index .dl-band .dl-doc2 { top: 269.82px; left: 77.86px; }
	#index .dl-band .dl-doc3 { top: 206.27px; right: 51.3px; }
	#index .dl-band .dl-doc4 { top: 252.22px; right: 66.33px; transform: translate(50%, -50%) rotate(6.93deg); }
}

/* ## 実績（No.1バッジ＋導入企業ロゴの壁） */

/* #### 背景（レンズ） */
#index .achievement {
	position: relative;
	background-repeat: no-repeat;
	background-position: center bottom, center top;
	background-origin: border-box;
}

#index .achievement .ach-inner {
	position: relative;
	z-index: 2;
	max-width: 1092px;
	margin: 0 auto;
	text-align: center;
}

/* #### 見出し */
#index .achievement .ach-title {
	font-weight: 500;
	color: #000;
	letter-spacing: .01em;
}

/* #### 白カード */
#index .achievement .ach-card {
	position: relative;
	background: #fff;
	border-radius: 10px;
}

/* #### 3実績バッジ */
#index .achievement .ach-badges {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	list-style: none;
	margin: 0;
	padding: 0;
}
#index .achievement .ach-badge { margin: 0; }
/* <picture> で1枚だけ読む（display 出し分けだと非表示側も取得される） */
#index .achievement .ach-badge picture { display: block; }
#index .achievement .ach-badge img { display: block; height: auto; }

/* #### 区切り線 */
#index .achievement .ach-divider {
	border-top: 1px solid #e4ece7;
}

/* #### 導入企業ロゴの壁 */
#index .achievement .ach-logos { margin: 0 auto; }
#index .achievement .ach-logos img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1013 / 670;
	object-fit: contain;
}

/* #### 装飾イラスト */
#index .achievement .ach-pose {
	position: absolute;
	pointer-events: none;
}

/* #### 注釈 */
#index .achievement .ach-note {
	position: relative;
	z-index: 1;
	color: var(--c_gray_green);
	text-align: right;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .achievement {
		padding: 100px 20px 252px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 228.61' preserveAspectRatio='none'%3E%3Cpath d='M0 0C0 0 358.347 136.61 715.847 136.61C1073.35 136.61 1440 0 1440 0L1440 228.61L0 228.61Z' fill='%23ffffff'/%3E%3C/svg%3E"), linear-gradient(128deg, #d3f8df 0%, #daf2f9 100%);
		background-size: 100% 228.61px, 100% 100%;
	}
	#index .achievement .ach-title {
		font-size: 42px;
		line-height: 1.381;
	}
	#index .achievement .ach-card {
		margin-top: 67px;
		padding: 20px 30px 61px;
	}
	#index .achievement .ach-badges { gap: 27px; }
	/* 縮まないと3枚で容器を超えるので shrink を許可する */
	#index .achievement .ach-badge { flex: 0 1 309.93px; min-width: 0; }
	#index .achievement .ach-badge img { width: 100%; }
	#index .achievement .ach-divider { margin: 45px 0 20px; }
	#index .achievement .ach-logos { max-width: 1013px; }
	#index .achievement .ach-pose {
		width: 156px;
		height: 251px;
		right: 482.44px;
		bottom: -199px;
	}
	#index .achievement .ach-note {
		font-size: 12px;
		line-height: 22px;
		margin-top: 6px;
	}
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .achievement {
		padding: 80px 23px 112px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 835 121.995' preserveAspectRatio='none'%3E%3Cpath d='M0 0C0 0 207.791 103.995 415.092 103.995C622.392 103.995 835 0 835 0L835 121.995L0 121.995Z' fill='%23ffffff'/%3E%3C/svg%3E"), linear-gradient(149deg, #e8ffef 0%, #d5eef5 100%);
		background-size: 100% 121.995px, 100% 100%;
	}
	#index .achievement .ach-inner { max-width: 788px; }
	#index .achievement .ach-title {
		font-size: 42px;
		line-height: 1.381;
	}
	#index .achievement .ach-card {
		margin-top: 61px;
		padding: 26px 36px 57px;
	}
	#index .achievement .ach-badges { gap: 3.12px; }
	#index .achievement .ach-badge { flex: 0 1 236.92px; }
	#index .achievement .ach-badge img { width: 100%; }
	#index .achievement .ach-divider { margin: 36px 0 10px; }
	#index .achievement .ach-logos { max-width: 715px; }
	#index .achievement .ach-pose {
		width: 128.46px;
		height: 206.69px;
		right: 355.59px;
		bottom: -141.63px;
	}
	#index .achievement .ach-note {
		max-width: 330px;
		margin-left: auto;
		font-size: 13px;
		line-height: 20px;
		margin-top: 8px;
	}
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .achievement {
		padding: 44px 14px 63px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 391 58.265' preserveAspectRatio='none'%3E%3Cpath d='M0 0C0 0 92.3443 27.265 189.415 27.265C286.486 27.265 391 0 391 0L391 58.265L0 58.265Z' fill='%23ffffff'/%3E%3C/svg%3E"), linear-gradient(144deg, #d3f8df 0%, #daf2f9 100%);
		background-size: 100% 58.265px, 100% 100%;
	}
	#index .achievement .ach-inner { max-width: 362px; }
	#index .achievement .ach-title {
		font-size: 22px;
		line-height: 1.364;
	}
	#index .achievement .ach-card {
		margin-top: 25px;
		padding: 19px 6px 18px;
	}
	/* #### SP はバッジを横型に差し替えて縦積み */
	#index .achievement .ach-badges {
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}
	#index .achievement .ach-badge { flex: none; width: 252px; max-width: 100%; }
	#index .achievement .ach-divider {
		max-width: 330px;
		margin: 17px auto 5px;
	}
	#index .achievement .ach-logos { max-width: 350px; }
	#index .achievement .ach-pose {
		width: 59.13px;
		height: 95.14px;
		right: 160.28px;
		bottom: -79.41px;
	}
	#index .achievement .ach-note {
		max-width: 156px;
		margin: 8px 0 0 auto;
		font-size: 10px;
		line-height: 1.3;
		text-align: left;
	}
}

/* ## お客様の声（4社） */

/* #### 背景（導入事例と共有する白い帯） */
#index .voice {
	background: #fff;
	padding: 0;
}
#index .voice-inner {
	width: min(800px, calc(100% - 48px));
	margin: 0 auto;
}

/* #### セクション見出し（吹き出しアイコン＋タイトル） */
#index .voice-icon {
	display: block;
	width: 109px;
	height: auto;
	margin: 0 auto 33px;
}
#index .voice-title {
	margin: 0;
	text-align: center;
	color: #000;
	font-weight: 500;
	font-size: 42px;
	line-height: 58px;
}

/* #### カード一覧 */
#index .voice-list {
	margin-top: 66px;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* #### 1枚のカード */
#index .voice-card {
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	min-height: 220px;
	padding-top: 55px;
	background: #f6fff9;
	border: 1px solid var(--c_border);
	border-radius: 10px;
	overflow: hidden;
}

/* #### ヘッダー帯（企業名＋担当）: カード全幅の緑→青グラデ */
#index .voice-head {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 16px;
	height: 55px;
	background: linear-gradient(90deg, #29abe2 0%, var(--c_green) 100%);
}
#index .voice-card.photo-right .voice-head {
	background: linear-gradient(90deg, var(--c_green) 0%, #29abe2 100%);
}
#index .voice-company {
	margin: 0;
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.7;
	white-space: nowrap;
}
#index .voice-role {
	margin: 0;
	color: #fff;
	font-weight: 500;
	font-size: 15px;
	line-height: 1.7;
	white-space: nowrap;
}
#index .voice-div {
	flex: 0 0 auto;
	width: 1px;
	height: 21px;
	background: rgba(255, 255, 255, 0.65);
}

/* #### 引用（お客様のコメント）本文 */
#index .voice-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#index .voice-quote {
	margin: 0;
	box-sizing: border-box;
	color: #000;
	font-weight: 500;
	font-size: 18px;
	line-height: 31px;
}
#index .voice-quote .hl {
	color: var(--c_green);
	font-weight: 700;
}

/* #### 企業写真 */
#index .voice-photo {
	position: absolute;
	top: -1px;
	bottom: -1px;
	width: 254px;
	z-index: 2;
}
#index .voice-card.photo-right .voice-photo { right: -1px; }
#index .voice-card:not(.photo-right) .voice-photo { left: -1px; }
#index .voice-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: fill;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .voice-card.photo-right .voice-head,
	#index .voice-card.photo-right .voice-quote { padding: 0 254px 0 38px; }
	#index .voice-card:not(.photo-right) .voice-head,
	#index .voice-card:not(.photo-right) .voice-quote { padding: 0 38px 0 263px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .voice { padding-top: 60px; }
	#index .voice-icon { margin-bottom: 20px; }
	#index .voice-title { font-size: 36px; }
	#index .voice-list { margin-top: 67px; }

	/* #### PC同様の横並び（写真は側面フルハイト）を維持 */
	#index .voice-card.photo-right .voice-head,
	#index .voice-card.photo-right .voice-quote { padding: 0 254px 0 30px; }
	#index .voice-card:not(.photo-right) .voice-head,
	#index .voice-card:not(.photo-right) .voice-quote { padding: 0 30px 0 263px; }
	#index .voice-quote { font-size: 18px; line-height: 31px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .voice { padding-top: 40px; }
	#index .voice-inner { width: calc(100% - 30px); }
	#index .voice-icon { width: 45px; margin-bottom: 16px; }
	#index .voice-title { font-size: 28px; line-height: 37.5px; }
	#index .voice-list { margin-top: 21px; gap: 16px; }

	/* #### 写真をヘッダー帯の中に収める */
	#index .voice-card {
		min-height: 0;
		padding-top: 92px;
		border-radius: 8px;
	}
	#index .voice-photo {
		top: -1px;
		bottom: auto;
		width: 124px;
		height: 93px;
	}

	/* #### 企業名・担当は写真を除いた列の中央 */
	#index .voice-head {
		height: 92px;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 4px;
	}
	#index .voice-card.photo-right .voice-head { padding: 0 124px 0 0; }
	#index .voice-card:not(.photo-right) .voice-head { padding: 0 0 0 124px; }
	#index .voice-div { display: none; }
	#index .voice-company {
		font-size: 16px;
		line-height: 19px;
		white-space: normal;
		text-align: center;
	}
	#index .voice-role {
		font-size: 12px;
		line-height: 18.9px;
		white-space: normal;
		text-align: center;
	}

	#index .voice-card.photo-right .voice-quote,
	#index .voice-card:not(.photo-right) .voice-quote {
		padding: 15px 18px 13px;
	}
	#index .voice-quote { font-size: 14px; line-height: 22px; }
}

/* ## 導入事例（Before/After 3件） */

/* #### 背景（お客様の声と共有する白い帯） */
#index .case {
	background: #fff;
}
#index .case .case-inner {
	max-width: 1440px;
	margin: 0 auto;
	padding: 100px 20px 100px;
	box-sizing: border-box;
}

/* #### 見出し */
#index .case .case-title {
	margin: 0;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	font-size: 42px;
	line-height: 58px;
	color: #000;
	text-align: center;
}

/* #### カード一覧 */
#index .case .case-list {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: clamp(28px, 4vw, 52px);
	margin: 37px 0 0;
	padding: 0;
	list-style: none;
}
#index .case .case-card {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
}

#index .case .case-link {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	color: inherit;
	text-decoration: none;
	transition: opacity var(--t_hover) ease;
}
#index .case .case-link:hover,
#index .case .case-link:focus-visible { opacity: .8; }
#index .case .case-link:hover .case-situation,
#index .case .case-link:focus-visible .case-situation { text-decoration: underline; }
#index .case .case-link:focus-visible {
	outline: solid;
	outline-offset: 2px;
	outline-color: #333333;
	outline-width: 2px;
}

/* #### 顧客写真 */
#index .case .case-photo {
	width: 86.6%;
	margin: 0 auto;
}
#index .case .case-photo img {
	display: block;
	width: 100%;
	height: auto;
}

/* #### ロゴ＋悩み見出し */
#index .case .case-head {
	width: 100%;
	text-align: center;
	min-height: 162px;
}
/* #### ロゴ */
#index .case .case-logo {
	margin: 18px 0 0;
	height: 49px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}
#index .case .case-logo img {
	display: block;
	width: auto;
	height: 41px;
	max-width: 100%;
}
#index .case .case-card:nth-child(2) .case-logo img { height: 48px; }
#index .case .case-card:nth-child(3) .case-logo img { height: 49px; }

#index .case .case-situation {
	margin: 37px 0 0;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 29px;
	color: #000;
}

/* #### 悩み見出し末尾の丸型矢印 */
#index .case .case-arrow {
	display: inline-block;
	position: relative;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--c_green);
	vertical-align: middle;
	margin-left: 4px;
}
#index .case .case-arrow::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 44%;
	width: 4px;
	height: 4px;
	border-top: 1.5px solid #fff;
	border-right: 1.5px solid #fff;
	transform: translate(-50%, -50%) rotate(45deg);
}

/* #### Before / After ボックス */
#index .case .case-ba {
	position: relative;
	box-sizing: border-box;
	width: calc(100% + 24px);
	margin-top: 33px;
	padding: 14px 11px 11px;
	background: #fff;
	border: 1px solid var(--c_border);
	border-radius: 5px;
}
/* #### 上中央のノッチ */
#index .case .case-ba::before {
	content: "";
	position: absolute;
	top: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 15px;
	height: 10px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 10'%3E%3Cpath d='M0.5 10L7.5 0.5L14.5 10' fill='%23ffffff' stroke='%23a7d8c2' stroke-width='1'/%3E%3C/svg%3E") no-repeat 50% 50%/100% 100%;
}
#index .case .case-ba-before,
#index .case .case-ba-after {
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
	border: 0;
	border-radius: 0;
	text-align: center;
}
#index .case .case-ba-before {
	background: #efefef;
	padding: 30px 16px 16px;
}
#index .case .case-ba-after {
	background: var(--c_mint);
	padding: 32px 16px 20px;
}

/* #### Before / After タグ（左上・右端がとがったリボン） */
#index .case .case-tag {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 73px;
	height: 18px;
	padding: 0;
	background: #8e8e8e;
	color: #fff;
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-weight: 500;
	font-size: 13px;
	line-height: 18px;
	letter-spacing: .02em;
	clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 50%, calc(100% - 7px) 100%, 0 100%);
}
#index .case .case-tag-after { background: var(--c_green); }

/* #### Before / After テキスト */
#index .case .case-ba-txt {
	margin: 0;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	font-size: 15px;
	line-height: 26px;
	color: #000;
}
#index .case .case-ba-txt-after {
	font-weight: 700;
	font-size: 18px;
	line-height: 31px;
	color: var(--c_text_green);
}

/* #### CTA「すべての導入事例を見る」 */
#index .case .case-cta {
	margin: 85px 0 0;
	text-align: center;
}
#index .case .case-cta .base-btn.sec-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 310px;
	height: 68px;
	padding: 0 16px;
	background: var(--c_green);
	/* 共有 .base-btn の border を打ち消す */
	border: 1px solid var(--c_green);
	border-radius: 6px;
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### hover（反転） */
#index .case .case-cta .base-btn.sec-btn:hover {
	background: #fff;
	color: var(--c_green);
}
/* #### 矢印 */
#index .case .case-cta .base-btn.sec-btn::after {
	content: "";
	width: 6px;
	height: 12px;
	margin-left: 9px;
	background: #fff;
	clip-path: polygon(0 0, 43% 0, 100% 50%, 43% 100%, 0 100%, 57% 50%);
	transition: background-color var(--t_hover) ease;
}
#index .case .case-cta .base-btn.sec-btn:hover::after { background: var(--c_green); }

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .case .case-card { flex: 0 1 336px; min-width: 0; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .case .case-inner { padding: 100px 24px 64px; }
	#index .case .case-title { font-size: 36px; }
	#index .case .case-list {
		gap: 32.35px;
		margin-top: 35px;
	}
	#index .case .case-card { flex: 1 1 0; min-width: 0; max-width: 234.75px; }

	/* #### TBは写真がボックスとほぼ同幅 */
	#index .case .case-photo { width: 100%; }
	#index .case .case-head { min-height: 136px; }
	#index .case .case-logo { margin-top: 15px; height: 41.25px; }
	#index .case .case-logo img { height: 34.4px; }
	#index .case .case-card:nth-child(2) .case-logo img { height: 40.2px; }
	#index .case .case-card:nth-child(2) .case-situation br { display: none; }
	#index .case .case-card:nth-child(3) .case-logo img { height: 41.2px; }
	#index .case .case-situation { font-size: 15px; line-height: 24.3px; margin-top: 31px; }

	#index .case .case-ba {
		width: calc(100% + 21px);
		margin-top: 27.4px;
		padding: 11.6px 10px 9px 9px;
	}
	#index .case .case-ba::before {
		top: -8px;
		width: 11px;
		height: 8px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 8'%3E%3Cpath d='M0.5 8L5.5 0.5L10.5 8' fill='%23ffffff' stroke='%23a7d8c2' stroke-width='1'/%3E%3C/svg%3E");
	}
	#index .case .case-ba-before { padding: 28px 12px 14px; }
	#index .case .case-ba-after { padding: 30px 12px 18px; }
	#index .case .case-ba-txt { font-size: 13px; line-height: 21.8px; }
	#index .case .case-ba-txt-after { font-size: 16px; line-height: 26px; }

	#index .case .case-tag {
		width: 61px;
		height: 15px;
		font-size: 13px;
		line-height: 15px;
	}

	#index .case .case-cta { margin-top: 65px; }
	#index .case .case-cta .base-btn.sec-btn {
		width: 259.9px;
		height: 57px;
		font-size: 19px;
	}
	#index .case .case-cta .base-btn.sec-btn::after {
		width: 5px;
		height: 10px;
		margin-left: 7.5px;
	}
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .case .case-inner { padding: 42px 20px 42px; }
	#index .case .case-title { font-size: 28px; line-height: 39px; }

	#index .case .case-list {
		flex-direction: column;
		align-items: stretch;
		gap: 32px;
		margin-top: 35px;
	}
	#index .case .case-card {
		flex: none;
		max-width: 340px;
		width: 100%;
		margin: 0 auto;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
	}
	#index .case .case-link {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
	}
	#index .case .case-photo {
		order: 0;
		width: 103px;
		flex: 0 0 103px;
		margin: 0;
	}
	/* #### ロゴ・状況テキストは写真を除いた列の中央 */
	#index .case .case-head {
		order: 1;
		flex: 1;
		width: auto;
		min-height: 0;
		text-align: center;
		padding-left: 0;
	}
	#index .case .case-logo { margin-top: 15px; height: 34px; }
	#index .case .case-logo img { height: 28.4px; }
	#index .case .case-card:nth-child(2) .case-logo img { height: 32px; }
	#index .case .case-card:nth-child(3) .case-logo img { height: 34px; }
	#index .case .case-situation { font-size: 16px; line-height: 29px; margin-top: 15px; }

	#index .case .case-ba {
		order: 2;
		flex-shrink: 0;
		width: calc(100% + 19px);
		margin-top: 20px;
		margin-left: -9px;
		padding: 9px 9px 8px 8px;
	}
	#index .case .case-ba::before {
		top: -8px;
		width: 15px;
		height: 8px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 8'%3E%3Cpath d='M0.5 8L7.5 0.5L14.5 8' fill='%23ffffff' stroke='%23a7d8c2' stroke-width='1'/%3E%3C/svg%3E");
	}
	#index .case .case-ba-before { padding: 26px 16px 14px; }
	#index .case .case-ba-after { padding: 28px 16px 18px; }
	#index .case .case-ba-txt { font-size: 12px; line-height: 21px; }
	#index .case .case-ba-txt-after { font-size: 14px; line-height: 24px; }

	#index .case .case-tag {
		width: 60px;
		height: 16px;
		font-size: 11px;
		line-height: 16px;
	}

	#index .case .case-cta { margin-top: 36px; }
	#index .case .case-cta .base-btn.sec-btn { width: 259.9px; height: 57px; font-size: 18px; }
}

/* ## お悩み解決「こんな請求業務のお悩み、Paidが解決します」 */

/* ### base */
#index .solution {
	position: relative;
	background: #fcfcfc;
	padding: 40px 15px 0;
}

/* #### 下部の緑背景＋花火装飾 */
#index .solution .sol-green {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 0;
	background: var(--c_green) url("/img/pre/index/solution_fireworks.png") center bottom / 100% auto no-repeat;
	clip-path: polygon(0 39.4%, 50% 0, 100% 39.4%, 100% 100%, 0 100%);
	pointer-events: none;
}

/* #### カード（薄緑→薄水色のグラデ・角丸・薄緑枠） */
#index .solution .sol-card {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	max-width: 1200px;
	margin: 125px auto 0;
	background: linear-gradient(180deg, var(--c_mint) 0%, #e4f9ff 100%);
	border: 1px solid var(--c_border);
	border-radius: 24px;
}

/* #### 見出し */
#index .solution .sol-title {
	margin: 0;
	text-align: center;
	font-weight: 500;
	color: #000;
	letter-spacing: .01em;
}

/* #### お悩みリスト */
#index .solution .sol-worries {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

/* #### お悩みの吹き出し */
#index .solution .sol-worry {
	position: relative;
	box-sizing: border-box;
	margin: 0;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 999px;
	filter: drop-shadow(2px 2px 3px var(--c_shadow));
	text-align: center;
	font-weight: 500;
	color: #000;
	line-height: 1.5;
}
/* #### 吹き出しのしっぽ */
#index .solution .sol-worry::before,
#index .solution .sol-worry::after {
	content: "";
	position: absolute;
	left: var(--tail-x);
	top: var(--tail-y);
	width: var(--tail-w);
	height: var(--tail-h);
	transform-origin: 14.5% 50%;
	transform: translate(-14.5%, -50%) rotate(var(--tail-rot, 0deg));
}
#index .solution .sol-worry::before {
	background: #ccc;
	clip-path: polygon(14.5% 0, 100% 42%, 100% 58%, 14.5% 100%);
}
#index .solution .sol-worry::after {
	background: #fff;
	clip-path: polygon(0 0, 14.5% 0, 14.5% 6.6%, 100% 48.6%, 100% 51.4%, 14.5% 93.4%, 14.5% 100%, 0 100%);
}

/* #### 中央の困り顔イラスト（PCのみ表示） */
#index .solution .sol-figures { display: none; }
#index .solution .sol-fig { display: block; height: auto; }

/* #### 区切り線（緑破線＋中央ノッチ） */
#index .solution .sol-divider {
	display: block;
	width: 337.1px;
	max-width: 100%;
	height: auto;
	margin: 28px auto 0;
}

/* #### 解決メッセージ */
#index .solution .sol-resolution {
	position: relative;
	margin: 20px 0 0;
	text-align: center;
	font-weight: 700;
	color: #333;
	line-height: 1.6;
}
#index .solution .sol-res-logo {
	display: inline-block;
	width: 86px;
	height: auto;
	vertical-align: baseline;
}
/* #### まるごと代行（黄色2本下線） */
#index .solution .sol-mark {
	color: var(--c_green);
	padding-bottom: 6px;
	background: url("/img/pre/index/solution_underline.svg") center bottom / 100% auto no-repeat;
}

/* #### 解決メッセージを囲む喜ぶ人イラスト（カード下端左右） */
#index .solution .sol-celebrate {
	position: absolute;
	bottom: 0;
	z-index: 2;
	height: auto;
	pointer-events: none;
}
#index .solution .sol-celebrate--l { left: 4px; }
#index .solution .sol-celebrate--r { right: 2px; }

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	/* padding-top:0 だと .sol-card の margin-top が相殺でセクション外へ抜けるので padding で持つ */
	#index .solution { padding: 125px 20px 123px; }
	#index .solution .sol-green { height: 639px; }

	#index .solution .sol-card {
		/* 左右は 941px=27px（Figma準拠）〜 1240px以上=60px の一次式。狭い幅で吹き出しが折り返すのを防ぐ */
		padding: 99px clamp(27px, calc(100vw * 0.11037 - 76.86px), 60px) 70px;
		margin-top: 0;
		margin-bottom: 0;
		border-radius: 45px;
	}
	/* 941px では42pxだと末尾1文字が折り返すので、1013px未満だけ縮める */
	#index .solution .sol-title { font-size: clamp(39px, 4.145vw, 42px); line-height: 58px; }

	/* #### PC の配置（左右2列＋中央イラスト） */
	#index .solution .sol-worries {
		display: grid;
		/* 1fr だと吹き出し300px＋marginが最小幅の床になりトラックが容器を超える。
		   1440時と同値になる定値%にして、狭い幅では比例縮小させる。 */
		grid-template-columns: 38.358071% 23.283859% 38.358071%;
		grid-template-rows: auto auto auto;
		align-items: center;
		justify-items: center;
		column-gap: 0;
		row-gap: 29px;
		max-width: 1080px;
		margin: 56px auto 0;
	}
	#index .solution .sol-worry {
		width: 72.551%;
		padding: 18.5px 19px;
		font-size: 18px;
		line-height: 30px;
	}
	/* #### しっぽ */
	#index .solution .sol-worry:nth-child(1),
	#index .solution .sol-worry:nth-child(2) { --tail-w: 22.9px;  --tail-h: 17.12px; --tail-y: 73.101%; }
	#index .solution .sol-worry:nth-child(3),
	#index .solution .sol-worry:nth-child(5) { --tail-w: 20.32px; --tail-h: 16.35px; --tail-y: 57.212%; }
	#index .solution .sol-worry:nth-child(4),
	#index .solution .sol-worry:nth-child(6) { --tail-w: 18.58px; --tail-h: 14.82px; --tail-y: 27.828%; }
	#index .solution .sol-worry:nth-child(1) { --tail-x: 97.337%; --tail-rot: 30.1deg; }
	#index .solution .sol-worry:nth-child(2) { --tail-x: 1.997%;   --tail-rot: 149.9deg; }
	#index .solution .sol-worry:nth-child(3) { --tail-x: 99.213%; --tail-rot: 12.75deg; }
	#index .solution .sol-worry:nth-child(5) { --tail-x: 0.120%;   --tail-rot: 167.25deg; }
	#index .solution .sol-worry:nth-child(4) { --tail-x: 97.910%; --tail-rot: -21.45deg; }
	#index .solution .sol-worry:nth-child(6) { --tail-x: 1.423%;   --tail-rot: -158.55deg; }

	#index .solution .sol-worry:nth-child(1) { grid-column: 1; grid-row: 1; justify-self: start; margin-left: 24.426%; }
	#index .solution .sol-worry:nth-child(2) { grid-column: 3; grid-row: 1; justify-self: end; margin-right: 23.700%; }
	#index .solution .sol-worry:nth-child(3) { grid-column: 1; grid-row: 2; justify-self: start; margin-left: 15.236%; }
	#index .solution .sol-worry:nth-child(4) { grid-column: 1; grid-row: 3; justify-self: start; margin-left: 24.426%; }
	#index .solution .sol-worry:nth-child(5) { grid-column: 3; grid-row: 2; justify-self: end; margin-right: 14.510%; }
	#index .solution .sol-worry:nth-child(6) { grid-column: 3; grid-row: 3; justify-self: end; margin-right: 23.700%; }

	#index .solution .sol-figures {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		grid-column: 2;
		/* 子を%にしたので、幅を確定させないと shrink-to-fit が循環して0になる */
		width: 100%;
		grid-row: 1 / 4;
	}
	#index .solution .sol-fig1 { width: 50.598%; }
	#index .solution .sol-fig2 { width: 52.590%; margin-left: -3.187%; }

	#index .solution .sol-divider { width: 1033px; margin-top: 37.5px; }

	#index .solution .sol-resolution { margin-top: 57.5px; font-size: 46px; line-height: 73px; }
	#index .solution .sol-res-logo { width: 194px; margin-right: 2px; transform: translateY(7px); }
	#index .solution .sol-mark { padding-bottom: 16px; }

	#index .solution .sol-celebrate--l { width: 89px; left: 76px; bottom: -31px; }
	#index .solution .sol-celebrate--r { width: 109.6px; right: 48.4px; bottom: -35.7px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .solution { padding: 77.5px 22.5px 109px; }
	#index .solution .sol-green { height: 536px; }

	#index .solution .sol-card {
		padding: 66.4px 24px 65.8px;
		margin-bottom: 0;
		border-radius: 32px;
	}
	#index .solution .sol-title { font-size: 36px; line-height: 48.67px; }

	/* #### TB の配置（左右2列） */
	#index .solution .sol-worries {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto auto;
		align-items: center;
		justify-items: center;
		column-gap: 0;
		row-gap: 24.34px;
		max-width: 741px;
		margin: 59.4px auto 0;
	}
	#index .solution .sol-worry {
		width: 251.73px;
		max-width: none;
		padding: 15.37px 13px;
		font-size: 16px;
		line-height: 25.17px;
		filter: drop-shadow(1.7px 1.7px 2.5px var(--c_shadow));
	}
	/* #### しっぽ */
	#index .solution .sol-worry:nth-child(1),
	#index .solution .sol-worry:nth-child(2) { --tail-w: 19.22px; --tail-h: 14.37px; --tail-y: 60.56px; }
	#index .solution .sol-worry:nth-child(3),
	#index .solution .sol-worry:nth-child(5) { --tail-w: 17.05px; --tail-h: 13.72px; --tail-y: 47.37px; }
	#index .solution .sol-worry:nth-child(4),
	#index .solution .sol-worry:nth-child(6) { --tail-w: 15.59px; --tail-h: 12.44px; --tail-y: 22.96px; }
	#index .solution .sol-worry:nth-child(1) { --tail-x: 244.87px; --tail-rot: 30.1deg; }
	#index .solution .sol-worry:nth-child(2) { --tail-x: 4.86px;   --tail-rot: 149.9deg; }
	#index .solution .sol-worry:nth-child(3) { --tail-x: 249.62px; --tail-rot: 12.75deg; }
	#index .solution .sol-worry:nth-child(5) { --tail-x: 0.11px;   --tail-rot: 167.25deg; }
	#index .solution .sol-worry:nth-child(4) { --tail-x: 246.32px; --tail-rot: -21.45deg; }
	#index .solution .sol-worry:nth-child(6) { --tail-x: 3.41px;   --tail-rot: -158.55deg; }

	#index .solution .sol-worry:nth-child(1) { grid-column: 1; grid-row: 1; justify-self: start; margin-left: 12.4px; margin-right: 0; }
	#index .solution .sol-worry:nth-child(2) { grid-column: 2; grid-row: 1; justify-self: end; margin-right: 17.5px; margin-left: 0; }
	#index .solution .sol-worry:nth-child(3) { grid-column: 1; grid-row: 2; justify-self: start; margin-left: -10.3px; margin-right: 0; }
	#index .solution .sol-worry:nth-child(4) { grid-column: 1; grid-row: 3; justify-self: start; margin-left: 12.4px; margin-right: 0; }
	#index .solution .sol-worry:nth-child(5) { grid-column: 2; grid-row: 2; justify-self: end; margin-right: -0.4px; margin-left: 0; }
	#index .solution .sol-worry:nth-child(6) { grid-column: 2; grid-row: 3; justify-self: end; margin-right: 17.5px; margin-left: 0; }
	#index .solution .sol-figures {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		position: absolute;
		top: 81.8px;
		left: 50%;
		transform: translateX(-50%);
		margin-left: -2.8px;
		pointer-events: none;
	}
	#index .solution .sol-fig1 { width: 110px; }
	#index .solution .sol-fig2 { width: 114px; margin-left: -7px; }

	#index .solution .sol-divider { width: 737.58px; margin-top: 32.5px; }

	#index .solution .sol-resolution { margin-top: 60.4px; font-size: 31px; line-height: 49.5px; }
	#index .solution .sol-res-logo { width: 130.8px; transform: translateY(4px); }
	#index .solution .sol-mark { padding-bottom: 5px; }

	#index .solution .sol-celebrate--l { width: 74.7px; left: 25.5px; bottom: -36px; }
	#index .solution .sol-celebrate--r { width: 91.9px; right: 22.6px; bottom: -36px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .solution { padding: 46px 15px 48px; }
	#index .solution .sol-green { height: 363px; }

	#index .solution .sol-card {
		padding: 29.7px 3px 24px;
		/* base の125pxだと導入事例のCTAから離れすぎる */
		margin-top: 0;
		margin-bottom: 0;
		border-radius: 24px;
	}
	#index .solution .sol-title { font-size: 28px; line-height: 45.2px; }

	/* #### SP の配置（4行構成） */
	#index .solution .sol-worries {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 79px 71px 77px auto;
		column-gap: 0;
		row-gap: 0;
		align-items: start;
		justify-items: center;
		max-width: 351px;
		margin: 13.9px auto 0;
	}
	#index .solution .sol-worry {
		width: 180px;
		max-width: none;
		padding: 11.13px 11px;
		font-size: 13px;
		line-height: 20px;
		filter: drop-shadow(1.2px 1.2px 1.8px var(--c_shadow));
	}
	#index .solution .sol-worry:nth-child(1) { grid-row: 1; grid-column: 1; justify-self: start;  align-self: start; margin: 0; }
	#index .solution .sol-worry:nth-child(2) { grid-row: 1; grid-column: 1; justify-self: end;    align-self: start; margin: 8px 0 0; }
	#index .solution .sol-worry:nth-child(3) { grid-row: 2; grid-column: 1; justify-self: center; align-self: start; margin: 0; }
	#index .solution .sol-worry:nth-child(4) { grid-row: 3; grid-column: 1; justify-self: start;  align-self: start; margin: 0; }
	#index .solution .sol-worry:nth-child(5) { grid-row: 3; grid-column: 1; justify-self: end;    align-self: start; margin: 9px 0 0; }
	#index .solution .sol-worry:nth-child(6) { grid-row: 4; grid-column: 1; justify-self: center; align-self: start; margin: 0; }
	#index .solution .sol-figures {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		position: static;
		top: auto;
		left: auto;
		transform: none;
		grid-row: 5;
		grid-column: 1;
		justify-self: center;
		align-self: start;
		margin: 15.8px 0 0;
		pointer-events: none;
	}
	#index .solution .sol-fig1 { width: 65.8px; }
	#index .solution .sol-fig2 { width: 68.4px; margin-left: -4.1px; }

	/* #### しっぽ */
	#index .solution .sol-worry:nth-child(1),
	#index .solution .sol-worry:nth-child(2),
	#index .solution .sol-worry:nth-child(3),
	#index .solution .sol-worry:nth-child(4),
	#index .solution .sol-worry:nth-child(5),
	#index .solution .sol-worry:nth-child(6) { --tail-w: 10.29px; --tail-h: 9.8px; --tail-y: 63.26px; }
	#index .solution .sol-worry::before,
	#index .solution .sol-worry::after {
		transform: translate(-14.5%, -50%) skewX(var(--tail-skew, 0deg)) rotate(90deg);
	}
	#index .solution .sol-worry::after {
		clip-path: polygon(0 0, 14.5% 0, 14.5% 10.7%, 94.5% 50%, 14.5% 89.3%, 14.5% 100%, 0 100%);
	}
	#index .solution .sol-worry:nth-child(1) { --tail-x: 106.96px; --tail-skew:  24.1deg; }
	#index .solution .sol-worry:nth-child(2) { --tail-x:  99.55px; --tail-skew: -29.4deg; }
	#index .solution .sol-worry:nth-child(3) { --tail-x:  76.48px; --tail-skew:  31.1deg; }
	#index .solution .sol-worry:nth-child(4) { --tail-x:  60.09px; --tail-skew:  25.5deg; }
	#index .solution .sol-worry:nth-child(5) { --tail-x: 101.62px; --tail-skew: -33.1deg; }
	#index .solution .sol-worry:nth-child(6) { --tail-x: 107.78px; --tail-skew: -16.1deg; }

	#index .solution .sol-divider { width: 337.1px; margin-top: 19.7px; }

	#index .solution .sol-resolution { margin-top: 20px; font-size: 20px; line-height: 33px; }
	#index .solution .sol-res-logo { width: 85.6px; transform: translateY(3px); }
	#index .solution .sol-mark { padding-bottom: 4px; }

	#index .solution .sol-celebrate--l { width: 53px; left: 29px; bottom: -16px; }
	#index .solution .sol-celebrate--r { width: 65.3px; right: 13.7px; bottom: -16px; }
}

/* ## CTA振り分け（3ルート） */

/* ### base */
#index .route {
	position: relative;
	background: var(--c_mint);
}

/* #### 背景ウォーターマーク */
/* 余りは画像の最上行と同じ横グラデーションで継ぐ。≤640 は余りが大きすぎるので cover */
#index .route .route-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		url("/img/pre/index/route_bg.webp") no-repeat bottom center / 100% auto,
		linear-gradient(to right, #aed7ff 0%, #b6dbff 12.5%, #b7dcff 25%, #bbe2ff 37.5%, #c9e5ff 50%, #cce7ff 62.5%, #d2eafe 75%, #d8ebff 87.5%, #deeaff 100%);
}

#index .route .route-inner {
	position: relative;
	z-index: 1;
	margin: 0 auto;
}

#index .route .route-title {
	font-weight: 500;
	color: #000;
	text-align: center;
	margin: 0;
}
#index .route .route-sub {
	font-weight: 500;
	color: #000;
	text-align: center;
	margin: 0;
}

/* #### カード段組み */
#index .route .route-cards {
	display: flex;
	justify-content: center;
	align-items: stretch;
}

/* #### ルート別アクセントカラー */
#index .route .route-card--info    { --acc: #209ace; --acc-a: rgba(32,154,206,.30); }
#index .route .route-card--consider{ --acc: var(--c_green); --acc-a: rgba(3,175,122,.30); }
#index .route .route-card--use     { --acc: #75a915; --acc-a: rgba(117,169,21,.32); }

#index .route .route-card {
	position: relative;
	box-sizing: border-box;
	min-width: 0;
	background: #fff;
	border-radius: 6px;
	box-shadow: 1px 1px 6px rgba(31,106,91,.45);
	display: flex;
	flex-direction: column;
}

/* #### 上部に飛び出す円形バッジ */
#index .route .route-badge {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 50%;
	background: var(--acc);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
#index .route .route-badge-txt {
	color: #fff;
	font-weight: 700;
}

/* #### 見出し＋説明のミント枠ボックス */
#index .route .route-head {
	box-sizing: border-box;
	border: 1px solid var(--c_border);
	border-radius: 6px;
	text-align: center;
}
#index .route .route-card-title {
	font-weight: 700;
	color: var(--acc);
	letter-spacing: normal;
	margin: 0;
}
#index .route .route-card-desc {
	font-weight: 500;
	color: #333;
	text-align: left;
}

/* #### 3つの導線リンク（ラベル＋丸型矢印、点線区切り） */
#index .route .route-links {
	list-style: none;
	margin: 0;
	padding: 0;
}
#index .route .route-links li:not(:last-child) .route-link {
	border-bottom: 1px dashed var(--acc-a);
}
#index .route .route-link {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	text-decoration: none;
}
#index .route .route-link .txt {
	color: var(--acc);
	font-weight: 500;
}
/* 矢印は mask なのでアクセント色3色に1ファイルで追従する */
#index .route .route-link .arw {
	flex: 0 0 auto;
	position: relative;
	border-radius: 50%;
	background-color: var(--acc);
	transition: background-color var(--t_hover) ease, box-shadow var(--t_hover) ease;
}
#index .route .route-link .arw::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") no-repeat center / var(--chev, 13px);
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") no-repeat center / var(--chev, 13px);
	transition: background-color var(--t_hover) ease;
}
/* #### hover / focus（反転） */
#index .route .route-link:hover .txt,
#index .route .route-link:focus-visible .txt { text-decoration: underline; }
#index .route .route-link:hover .arw,
#index .route .route-link:focus-visible .arw {
	background-color: #fff;
	box-shadow: inset 0 0 0 2px var(--acc);
}
#index .route .route-link:hover .arw::before,
#index .route .route-link:focus-visible .arw::before { background-color: var(--acc); }
#index .route .route-link:focus-visible {
	outline: solid;
	outline-offset: 2px;
	outline-color: #333333;
	outline-width: 2px;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .route .route-inner {
		max-width: 1140px;
		padding: 100px 20px 127px;
	}
	#index .route .route-title { font-size: 42px; line-height: 58px; }
	#index .route .route-sub { font-size: 18px; line-height: 31px; margin-top: 35px; }

	#index .route .route-cards {
		gap: 10px;
		margin-top: 48px;
		padding-top: 61px;
	}
	#index .route .route-card {
		flex: 1 1 0;
		max-width: 360px;
		padding: 17px 20px 6px;
	}
	#index .route .route-badge {
		width: 122px;
		height: 122px;
		top: -61px;
	}
	#index .route .route-badge-txt { font-size: 23px; line-height: 32px; }
	#index .route .route-head {
		min-height: 297px;
		padding: 66px 18px 14px;
	}
	#index .route .route-card-title { font-size: 21px; line-height: 36px; }
	#index .route .route-card-desc { font-size: 15px; line-height: 29px; margin: 26px 0 0; }

	#index .route .route-links { margin-top: 0; }
	#index .route .route-link { min-height: 95px; padding: 0 0 0 6px; }
	#index .route .route-link .txt { font-size: 18px; line-height: 31px; }
	#index .route .route-link .arw { width: 42px; height: 42px; --chev: 13px; }
}

/* ### 1100px未満のリンク幅確保 */
/* カードが縮むとCTAの文言が2行に折り返すので、余白と矢印を詰めて1行に収める */
@media screen and (min-width: 941px) and (max-width: 1099px) {
	#index .route .route-inner { padding-left: 12px; padding-right: 12px; }
	#index .route .route-card { padding-left: 8px; padding-right: 8px; }
	#index .route .route-link { padding-left: 0; }
	#index .route .route-link .arw { width: 36px; height: 36px; --chev: 11px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .route .route-inner {
		max-width: 834px;
		padding: 83.8px 22px 91.1px;
	}
	#index .route .route-title { font-size: 36px; line-height: 49px; }
	#index .route .route-sub { font-size: 16px; line-height: 26px; margin-top: 28.9px; }

	#index .route .route-cards {
		gap: 13px;
		margin-top: 40.2px;
		padding-top: 51.2px;
	}
	#index .route .route-card {
		flex: 1 1 0;
		max-width: 254px;
		padding: 14.2px 9.7px 0;
	}
	#index .route .route-badge {
		width: 102.2px;
		height: 102.2px;
		top: -51.2px;
	}
	#index .route .route-badge-txt { font-size: 18px; line-height: 25.55px; }
	#index .route .route-head {
		height: stretch;
		min-height: 269.7px;
		padding: 55.1px 12px 14px;
	}
	#index .route .route-card-title { font-size: 15px; line-height: 25.55px; }
	#index .route .route-card-desc { font-size: 14px; line-height: 24.29px; margin: 17.1px 0 0; }

	#index .route .route-links { margin-top: 0; }
	#index .route .route-link { min-height: 79.4px; padding: 0; gap: 8px; }
	#index .route .route-link .txt { font-size: 15px; line-height: 23px; }
	#index .route .route-link .arw { width: 35.2px; height: 35.2px; --chev: 12px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	/* SPはカードが縦積みで上が余るので高さ基準で敷く */
	#index .route .route-bg { background-size: cover, auto; }

	#index .route .route-inner {
		max-width: none;
		padding: 46px 15px 40.5px;
	}
	#index .route .route-title { font-size: 28px; line-height: 37.5px; }
	#index .route .route-sub { font-size: 15px; line-height: 25.5px; margin-top: 13.7px; }

	#index .route .route-cards {
		flex-direction: column;
		align-items: center;
		gap: 64.5px;
		margin-top: 39.3px;
		padding-top: 55px;
	}
	#index .route .route-card {
		flex: none;
		width: 100%;
		max-width: 360px;
		padding: 11px 11px 0;
	}
	#index .route .route-badge {
		width: 88px;
		height: 88px;
		top: -55px;
	}
	#index .route .route-badge-txt { font-size: 16px; line-height: 22px; }
	#index .route .route-head {
		min-height: 174px;
		padding: 21px 22px 14.4px;
	}
	#index .route .route-card-title { font-size: 16px; line-height: 24.5px; }
	#index .route .route-card-desc { font-size: 14px; line-height: 21.4px; margin: 2px 0 0; text-align: center; }

	#index .route .route-links { margin-top: 0; }
	#index .route .route-link { min-height: 52px; padding: 0 1px 0 2px; gap: 10px; }
	#index .route .route-link .txt { font-size: 16px; line-height: 24px; }
	#index .route .route-link .arw { width: 30px; height: 30px; --chev: 11px; }
}

/* ## よくあるご質問（FAQ） */

#index .faq {
	background: #fff;
}
#index .faq .faq-inner {
	box-sizing: border-box;
	max-width: 908px;
	margin: 0 auto;
	padding: 0 20px;
}

/* #### 見出し */
#index .faq .faq-title {
	text-align: center;
	color: #000;
	font-weight: 500;
	line-height: 1.4;
}

/* #### Q&Aリスト（静的・全問オープン） */
#index .faq .faq-list {
	margin: 0;
	padding: 0;
}
/* #### 区切り線 */
#index .faq .faq-item {
	border-bottom: 1px solid #989898;
}

/* #### 質問 */
#index .faq .faq-q {
	display: flex;
	align-items: baseline;
	margin: 0;
	color: var(--c_green);
	font-weight: 700;
}
/* #### Q. マーク */
#index .faq .faq-q .q-mark {
	flex: 0 0 auto;
	font-weight: 700;
}
#index .faq .faq-q .q-text {
	flex: 1 1 auto;
}

/* #### 回答 */
#index .faq .faq-a {
	margin: 4px 0 0;
	/* 10pxはデザイナー指示（Figmaは4〜10pxでバラつく） */
	padding-top: 10px;
	color: #000;
	font-weight: 500;
	line-height: 1.95;
}
/* #### 本文リンク（活用シーン） */
#index .faq .faq-a a {
	color: var(--c_green);
	font-weight: 500;
	text-decoration: none;
	text-underline-position: from-font;
	text-decoration-skip-ink: none;
	white-space: nowrap;
	transition: none;
}
#index .faq .faq-a a::after {
	content: "";
	display: inline-block;
	width: 1.167em;
	height: .992em;
	margin-left: .4em;
	vertical-align: -.12em;
	background-color: currentColor;
	-webkit-mask: url(/img/pre/index/icon_external.svg) no-repeat center / contain;
	mask: url(/img/pre/index/icon_external.svg) no-repeat center / contain;
}
#index .faq .faq-a a:hover {
	text-decoration: underline;
}

/* 「すべて見る」CTA は Figma に無いため置かない */

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .faq {
		padding: 100px 0 99px;
	}
	#index .faq .faq-title {
		font-size: 42px;
		margin-bottom: 38px;
	}
	#index .faq .faq-item {
		padding: 22px 0 25px;
	}
	#index .faq .faq-q {
		font-size: 24px;
		line-height: 29px;
	}
	#index .faq .faq-q .q-mark {
		width: 40px;
		font-size: 29px;
	}
	#index .faq .faq-a {
		padding-left: 40px;
		font-size: 18px;
	}
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .faq {
		padding: 80px 0;
	}
	#index .faq .faq-inner {
		max-width: 775px;
		padding: 0 24px;
	}
	#index .faq .faq-title {
		font-size: 36px;
		margin-bottom: 32px;
	}
	#index .faq .faq-item {
		padding: 22px 0 24px;
	}
	#index .faq .faq-q {
		font-size: 20px;
		line-height: 24.293px;
	}
	#index .faq .faq-q .q-mark {
		width: 34px;
		font-size: 24px;
	}
	#index .faq .faq-a {
		padding-left: 34px;
		font-size: 15px;
		line-height: 1.95;
	}
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .faq {
		padding: 64px 0;
	}
	#index .faq .faq-inner {
		max-width: none;
		padding: 0 15px;
	}
	#index .faq .faq-title {
		font-size: 28px;
		line-height: 48.585px;
		margin-bottom: 24px;
	}
	#index .faq .faq-item {
		padding: 20px 0 22px;
	}
	#index .faq .faq-q {
		font-size: 18px;
		line-height: 24.293px;
	}
	#index .faq .faq-q .q-mark {
		width: 32px;
		font-size: 20px;
	}
	#index .faq .faq-a {
		padding-left: 6px;
		font-size: 15px;
		line-height: 1.8;
	}
}

/* ## お役立ち記事 */
/* カード幅とgapは比率指定（Figmaが全幅で同比率のため） */
#index .column {
	background: var(--c_mint);
}
#index .column .column-inner {
	max-width: 1201px;
	margin: 0 auto;
	padding: 100px 25px 97px;
}
/* #### 見出し */
#index .column .column-title {
	margin: 0;
	color: #000;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	text-align: center;
}
/* #### 記事カード */
#index .column .column-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 1.915%;
	margin: 0;
	padding: 0;
	list-style: none;
}
#index .column .column-card { min-width: 0; }
#index .column .column-link {
	display: block;
	text-decoration: none;
}
#index .column .column-thumb {
	display: block;
	aspect-ratio: 283 / 148;
	overflow: hidden;
	border-radius: 4px;
}
#index .column .column-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#index .column .column-card-title {
	display: block;
	color: #000;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	transition: color var(--t_hover) ease;
}
#index .column .column-link:hover .column-card-title,
#index .column .column-link:focus-visible .column-card-title { color: var(--c_green); }
#index .column .column-link:focus-visible {
	outline: solid;
	outline-offset: 2px;
	outline-color: #333333;
	outline-width: 2px;
}
/* #### CTA */
#index .column .column-cta {
	display: flex;
	justify-content: center;
}
#index .column .base-btn.sec-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 310px;
	height: 68px;
	padding: 0 16px;
	background: var(--c_green);
	/* 共有 .base-btn の border を打ち消す */
	border: 1px solid var(--c_green);
	border-radius: 6px;
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### 別窓アイコン */
#index .column .base-btn.sec-btn::before {
	content: "";
	order: 1;
	width: 21px;
	height: 17.84px;
	margin-left: 9px;
	background-color: currentColor;
	-webkit-mask: url(/img/pre/index/icon_external.svg) no-repeat center / contain;
	mask: url(/img/pre/index/icon_external.svg) no-repeat center / contain;
}
/* #### 矢印 */
#index .column .base-btn.sec-btn::after {
	content: "";
	order: 2;
	width: 6px;
	height: 12px;
	margin-left: 18px;
	background: currentColor;
	clip-path: polygon(0 0, 43% 0, 100% 50%, 43% 100%, 0 100%, 57% 50%);
}
/* #### hover（反転） */
#index .column .base-btn.sec-btn:hover {
	background: #fff;
	color: var(--c_green);
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .column .column-title { font-size: 42px; line-height: 58px; margin-bottom: 85px; }
	#index .column .column-card-title { margin-top: 15px; font-size: 16px; line-height: 26px; }
	#index .column .column-cta { margin-top: 72px; }
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .column .column-inner { padding: 80px 56px; }
	#index .column .column-title { font-size: 36px; line-height: 50px; margin-bottom: 60px; }
	#index .column .column-list { grid-template-columns: repeat(2, 1fr); column-gap: 4%; row-gap: 26px; }
	#index .column .column-card-title { margin-top: 15px; font-size: 16px; line-height: 26px; }
	#index .column .column-cta { margin-top: 56px; }
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .column .column-inner { padding: 60px 15px; }
	#index .column .column-title { font-size: 28px; line-height: 40px; margin-bottom: 48px; }
	#index .column .column-list { column-gap: 3.9%; row-gap: 20px; }
	#index .column .column-card-title { margin-top: 10px; font-size: 14px; line-height: 26px; }
	#index .column .column-cta { margin-top: 50px; }
	#index .column .base-btn.sec-btn { width: 100%; max-width: 310px; font-size: 18px; }
}

/* ## お知らせ */
#index .news {
	padding: 100px 20px 60px;
	background-color: #f8f8f8;
}
#index .news-inner {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}
#index .news h2 {
	font-size: 38px;
	color: var(--c_green);
}
#index .news .date a {
	display: flex;
	align-items: flex-start;
	position: relative;
	margin-top: 20px;
	color: #000;
}
#index .news .date a:hover, #index .news .date a:focus-visible {
	text-decoration: underline;
}
#index .news .date a:hover span, #index .news .date a:focus-visible span {
	text-decoration: underline;
	display: block;
}
#index .news .date a:focus-visible {
	outline: solid;
	outline-offset: 2px;
	outline-color: #333333;
	outline-width: 2px;
}
#index .news .date a .entry-date {
	min-width: 120px;
	display: block;
	line-height: 1.7;
	position: relative;
}
#index .news .date a .entry-date:after {
	content: "";
	position: absolute;
	top: 11px;
	right: 0;
	width: 9px;
	height: 9px;
	border-top: 2px solid var(--c_green);
	border-right: 2px solid var(--c_green);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#index .news .date a .list-title {
	position: relative;
	margin-left: 38px;
	line-height: 1.7;
}
#index .news .link-wrap {
	display: block;
	text-align: right;
	position: relative;
	padding-right: 15px;
	margin-top: 20px;
}
#index .news .link-wrap a:hover, #index .news .link-wrap a:focus-visible {
	text-decoration: underline;
	color: var(--c_green);
}
#index .news .link-wrap a:focus-visible{
	outline: solid;
	outline-offset: 2px;
	outline-color: #333333;
	outline-width: 2px;
}
#index .news .link-wrap a {
	color: var(--c_green);
}
#index .news .link-wrap a:after {
	content: "";
	position: absolute;
	top: 10px;
	right: 0;
	width: 9px;
	height: 9px;
	border-top: 2px solid var(--c_green);
	border-right: 2px solid var(--c_green);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .news {
		padding: 120px 20px 60px;
	}
}
/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .news h2 {
		text-align: center;
		font-size: 22px;
	}
	#index .news .date a {
		display: block;
	}
	#index .news .date a .list-title {
		margin: 0;
		display: inline-block;
	}
	#index .news .date a .entry-date:after {
		display: none;
	}
	#index .news .date a .list-title:after {
		content: "";
		position: absolute;
		top: initial;
		right: initial;
		bottom: 6px;
		width: 9px;
		height: 9px;
		border-top: 2px solid var(--c_green);
		border-right: 2px solid var(--c_green);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}

/* ## 最終CTA */

/* #### 緑一色のフルワイド帯（見出し＋リード＋CTA2本を中央寄せ） */
#index .last-cta {
	background: var(--c_green);
}
#index .last-cta .last-cta-inner {
	max-width: 1040px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

/* #### 見出し */
#index .last-cta .last-cta-heading {
	color: #fff;
	font-weight: 700;
	font-size: 34px;
	line-height: 58px;
	white-space: nowrap;
	margin: 0;
}

/* #### リード文 */
#index .last-cta .last-cta-lead {
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	line-height: 30px;
	margin: 14px 0 0;
}

/* #### CTAボタン群 */
#index .last-cta .last-cta-btns {
	display: flex;
	justify-content: center;
	align-items: stretch;
	gap: 20px;
	margin-top: 55px;
}
#index .last-cta .base-btn {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	text-decoration: none;
}

/* #### 資料ダウンロード（オレンジ） */
#index .last-cta .pri-cv-btn {
	position: relative;
	width: 420px;
	height: 92px;
	padding: 0 62px 0 23px;
	gap: 14px;
	background: var(--c_orange);
	/* 共有 .base-btn の border を打ち消す */
	border: 0;
	border-radius: 12px;
	color: #fff;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease, box-shadow var(--t_hover) ease;
}
/* #### hover（反転） */
#index .last-cta .pri-cv-btn:hover,
#index .last-cta .pri-cv-btn:focus-visible {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--c_orange);
	color: var(--c_orange);
}
#index .last-cta .pri-cv-btn .free {
	flex: 0 0 auto;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: #fff;
	color: var(--c_orange);
	font-weight: 700;
	font-size: 19px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### 無料バッジも反転（白丸＋オレンジ字 → オレンジ丸＋白字） */
#index .last-cta .pri-cv-btn:hover .free,
#index .last-cta .pri-cv-btn:focus-visible .free {
	background: var(--c_orange);
	color: #fff;
}
#index .last-cta .pri-cv-btn .labels {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.15;
}
#index .last-cta .pri-cv-btn .time {
	display: inline-flex;
	align-items: center;
	gap: 0;
	font-size: 19.5px;
	font-weight: 700;
	white-space: nowrap;
}
#index .last-cta .pri-cv-btn .time::before { content: "＼"; font-weight: 400; margin-right: .5em; }
#index .last-cta .pri-cv-btn .time::after { content: "／"; font-weight: 400; margin-left: .5em; }
#index .last-cta .pri-cv-btn .time .n {
	font-family: "Roboto", var(--ff_roboto), sans-serif;
	font-size: 28px;
	font-weight: 700;
}
#index .last-cta .pri-cv-btn .first {
	font-size: 28px;
	font-weight: 700;
	white-space: nowrap;
}
#index .last-cta .pri-cv-btn.icon-dl::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 25px;
	transform: translateY(-50%);
	width: 27.735px;
	height: 25.706px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E") no-repeat center / contain;
}
#index .last-cta .pri-cv-btn.icon-dl:hover::after,
#index .last-cta .pri-cv-btn.icon-dl:focus-visible::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee8d37' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E");
}

/* #### 導入のご相談・問い合わせ（白地・緑枠） */
#index .last-cta .contact-btn {
	justify-content: center;
	width: 420px;
	height: 92px;
	padding: 13px 8px 14px;
	background: #fff;
	border: 1.353px solid var(--c_green);
	border-radius: 8px;
	color: var(--c_green);
	font-size: 28px;
	font-weight: 700;
	transition: background var(--t_hover) ease, border-color var(--t_hover) ease, color var(--t_hover) ease;
}
/* #### hover（反転） */
#index .last-cta .contact-btn:hover,
#index .last-cta .contact-btn:focus-visible {
	background: var(--c_green);
	border-color: #fff;
	color: #fff;
}

/* ### PC（≥941） */
@media screen and (min-width: 941px) {
	#index .last-cta {
		padding: 76px 20px 92px;
	}
}

/* ### tab・m（≤940） */
@media screen and (max-width: 940px) {
	#index .last-cta {
		padding: 64px 24px 77px;
	}
	#index .last-cta .last-cta-heading {
		font-size: 28px;
		line-height: 48px;
	}
	#index .last-cta .last-cta-lead {
		font-size: 16px;
		line-height: 25px;
		margin-top: 12px;
	}
	#index .last-cta .last-cta-btns {
		gap: 17px;
		margin-top: 45px;
	}
	/* #### ボタンを一回り小さく（TB） */
	#index .last-cta .pri-cv-btn {
		width: 351px;
		height: 77px;
		padding: 0 50px 0 19px;
		gap: 12px;
		border-radius: 10px;
	}
	#index .last-cta .pri-cv-btn .free {
		width: 49px;
		height: 49px;
		font-size: 16px;
	}
	#index .last-cta .pri-cv-btn .time { font-size: 16px; }
	#index .last-cta .pri-cv-btn .time .n { font-size: 24px; }
	#index .last-cta .pri-cv-btn .first { font-size: 24px; }
	#index .last-cta .pri-cv-btn.icon-dl::after {
		width: 22px;
		height: 22px;
		right: 20px;
	}
	#index .last-cta .contact-btn {
		width: 351px;
		height: 77px;
		border-width: 1.133px;
		border-radius: 7px;
		font-size: 24px;
	}
}

/* ### m（≤640） */
@media screen and (max-width: 640px) {
	#index .last-cta {
		padding: 63px 15px 67px;
	}
	#index .last-cta .last-cta-heading {
		white-space: normal;
		font-size: 28px;
		line-height: 43.6px;
	}
	#index .last-cta .last-cta-lead {
		margin-top: 32px;
	}
	#index .last-cta .last-cta-btns {
		flex-direction: column;
		align-items: center;
		gap: 8px;
		margin-top: 39px;
		width: 100%;
		max-width: 351px;
		margin-left: auto;
		margin-right: auto;
	}
	#index .last-cta .pri-cv-btn,
	#index .last-cta .contact-btn {
		width: 100%;
	}
}

/* # セクション跨ぎ装飾の重なり順 */
/* はみ出す装飾は所有する側のセクションを前面に置く */
#index .reason   { position: relative; z-index: 2; }
#index .industry { position: relative; z-index: 1; }
#index .dl-band  { position: relative; z-index: 1; }