/**
 * コーポレート「よくある質問」ページのスタイル。
 * スケール係数（--pc/--sp）・キャンバス幅（--mt-canvas）は common.css / base.css の :root で定義済み。
 */

/* ---- 大枠コンテナ ---- */
.mtfq {
	width: var(--mt-canvas);
	max-width: 100%;
	margin-inline: auto;
	overflow-x: clip;
	color: var(--mt-navy);
	background: #fff;
	font-family: "zen-kaku-gothic-new", sans-serif;
	line-height: 1.6;
}

.mtfq img {
	display: block;
}

/* ==================== タイトルバー ====================
 * 他ページ共通のデザイン・数値。笑顔シェイプのみ紺色版（smail.svg）を使う。 */
.mtfq-titlebar {
	position: relative;
	width: calc(1380 * var(--pc));
	height: calc(140 * var(--pc));
	margin: calc(60 * var(--pc)) auto 0;
	background: #f7f5eb;
	border-radius: calc(15 * var(--pc));
}

.mtfq-titlebar__title {
	position: absolute;
	left: calc(70 * var(--pc));
	top: calc(50 * var(--pc));
	width: calc(270 * var(--pc));
	height: calc(40 * var(--pc));
	margin: 0;
	white-space: nowrap;
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: calc(40 * var(--pc));
	line-height: calc(40 * var(--pc));
	letter-spacing: 0.15em;
	color: #0d3061;
}

.mtfq-titlebar__smile {
	position: absolute;
	left: calc(1219 * var(--pc));
	top: calc(53 * var(--pc));
	width: calc(91 * var(--pc));
	height: calc(34 * var(--pc));
	animation:
		mtfqSmileRock 1.2s ease-in-out,
		mtfqSmilePivot 1.2s linear;
	animation-play-state: paused;
}

.mtfq-titlebar__smile.is-loaded {
	animation-play-state: running;
}

@keyframes mtfqSmileRock {
	0%, 50%, 100% { rotate: 0deg; }
	25%           { rotate: -6deg; }
	75%           { rotate: 6deg; }
}

@keyframes mtfqSmilePivot {
	0%, 49.9%  { transform-origin: bottom left; }
	50%, 100%  { transform-origin: bottom right; }
}

/* ==================== 質問の種類 ====================
 * コンテンツ幅1140px（キャンバス1440に対し左右余白150ずつ）、タイトルバーから150px。
 * ボタンは内容に応じて幅が決まる（左右パディング20・ラベルとアイコンの間10）。
 * デフォルトは白背景、ホバー/押下時にネイビーへ切り替え。 */
.mtfq-category {
	box-sizing: border-box;
	width: calc(1140 * var(--pc));
	margin: calc(150 * var(--pc)) auto 0;
}

.mtfq-category__list {
	display: flex;
	flex-wrap: wrap;
	column-gap: calc(10 * var(--pc));
	row-gap: calc(20 * var(--pc));
}

.mtfq-category__button {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	height: calc(54 * var(--pc));
	padding: 0 calc(20 * var(--pc));
	background: #fff;
	border: 1px solid #e9e9e9;
	border-radius: calc(27 * var(--pc));
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.mtfq-category__button:hover,
.mtfq-category__button:active {
	background: #0d3061;
	border-color: #0d3061;
	color: #fff;
}

.mtfq-category__label {
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-weight: 500;
	font-size: calc(14 * var(--pc));
	line-height: calc(14 * var(--pc));
	letter-spacing: 0.06em;
	color: #0d3061;
}

.mtfq-category__button:hover .mtfq-category__label,
.mtfq-category__button:active .mtfq-category__label {
	color: #fff;
}

/* triangle.svgは紺色固定のアセットなので、mask画像として読み込み背景色で塗る
 * （ホバー時に白へ切り替えられるようにするため）。 */
.mtfq-category__chevron {
	flex: none;
	width: calc(9 * var(--pc));
	height: calc(6 * var(--pc));
	margin-left: calc(10 * var(--pc));
	background-color: #0d3061;
	mask: url("../images/faq/triangle.svg") no-repeat center / contain;
	-webkit-mask: url("../images/faq/triangle.svg") no-repeat center / contain;
}

.mtfq-category__button:hover .mtfq-category__chevron,
.mtfq-category__button:active .mtfq-category__chevron {
	background-color: #fff;
}

/* ==================== 質問一覧（種類ごと） ====================
 * 枠・数値はTOPページのよくある質問セクション（.mtop-faq、home.css）を流用。
 * 質問ボックス(1049) + gap(5) + トグル(86) = 1140（種類ボタンと同じコンテンツ幅）。
 * 初期は全閉。開閉アニメーションはHOMEと共通のaccordion.jsで制御。
 * 各セクションの上端には、前のセクション（または種類ボタン一覧）との区切り線を
 * 一律で表示する（間隔80px＋ボーダー＋見出しまでの余白80px、全カテゴリ共通）。 */
.mtfq-faq {
	box-sizing: border-box;
	width: calc(1140 * var(--pc));
	margin: calc(80 * var(--pc)) auto 0;
	padding-top: calc(80 * var(--pc));
	border-top: 1px solid #e9e9e9;
}

.mtfq-faq__heading {
	margin: 0;
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: calc(22 * var(--pc));
	line-height: calc(33 * var(--pc));
	letter-spacing: 0.06em;
	color: #0d3061;
	/* 種類ボタンからのアンカーリンクでジャンプした時、sticky化しているヘッダーの
	 * 下に隠れないようジャンプ先の上に余白を確保する（company.cssと同じ技法）。 */
	scroll-margin-top: calc(90 * var(--pc) + 20px);
}

.mtfq-faq__list {
	margin-top: calc(40 * var(--pc));
}

.mtfq-faq__item {
	margin-bottom: calc(20 * var(--pc));
}

.mtfq-faq__item:last-child {
	margin-bottom: 0;
}

.mtfq-faq__q {
	display: flex;
	gap: calc(5 * var(--pc));
	list-style: none;
	cursor: pointer;
}

.mtfq-faq__q::-webkit-details-marker {
	display: none;
}

.mtfq-faq__q-box {
	display: flex;
	align-items: center;
	flex: none;
	box-sizing: border-box;
	width: calc(1049 * var(--pc));
	height: calc(86 * var(--pc));
	padding-left: calc(30 * var(--pc));
	background: #f7f5eb;
	border-radius: calc(15 * var(--pc));
}

.mtfq-faq__q-text {
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-size: calc(16 * var(--pc));
	font-weight: 500;
	line-height: calc(26 * var(--pc));
	letter-spacing: 0.06em;
	color: #333;
}

.mtfq-faq__toggle {
	position: relative;
	flex: none;
	width: calc(86 * var(--pc));
	height: calc(86 * var(--pc));
	background: #f7f5eb;
	border-radius: calc(15 * var(--pc));
}

.mtfq-faq__toggle-bar {
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(18 * var(--pc));
	height: calc(1.5 * var(--pc));
	background: #333;
}

.mtfq-faq__toggle-bar--h {
	transform: translate(-50%, -50%);
}

.mtfq-faq__toggle-bar--v {
	transform: translate(-50%, -50%) rotate(90deg);
}

.mtfq-faq__item[open] .mtfq-faq__toggle-bar--v {
	display: none;
}

.mtfq-faq__a {
	box-sizing: border-box;
	width: calc(1140 * var(--pc));
	margin-top: calc(5 * var(--pc));
	padding: calc(30 * var(--pc));
	background: #eeead8;
	border-radius: calc(15 * var(--pc));
}

.mtfq-faq__a-text {
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-size: calc(16 * var(--pc));
	font-weight: 500;
	line-height: calc(26 * var(--pc));
	letter-spacing: 0.06em;
	color: #333;
}

/* パーツ同士の間隔はデフォルト50pxだが、文章→画像・画像→文章の組み合わせだけ
 * Figma実データに合わせて個別に上書きする（20px / 40px）。 */
.mtfq-faq__a-text > * + * {
	margin-top: calc(50 * var(--pc));
}

.mtfq-faq__a-text > .mtfq-faq__text + .mtfq-faq__image {
	margin-top: calc(20 * var(--pc));
}

.mtfq-faq__a-text > .mtfq-faq__image + .mtfq-faq__text {
	margin-top: calc(40 * var(--pc));
}

.mtfq-faq__a-text a {
	color: #0d3061;
}

/* ---- パーツ：文章 ---- */
.mtfq-faq__text p {
	margin: 0;
}

.mtfq-faq__text p + p {
	margin-top: 0;
}

/* Figma上で別テキストとして独立していた段落（=区切りとして意味のある段落）にだけ
 * 付ける、20pxの段落間隔。同一テキスト内の続き文（改行のみ）には付けない。 */
.mtfq-faq__text p.mtfq-faq__text-gap {
	margin-top: calc(20 * var(--pc));
}

/* ---- パーツ：早見表（数量と結果） ----
 * 本文の余白(30px)の内側でさらに左右120pxずつ字下げ（840px幅で中央寄せ）。 */
.mtfq-faq__spec {
	box-sizing: border-box;
	width: calc(840 * var(--pc));
	margin-inline: auto;
}

.mtfq-faq__spec-heading {
	margin: 0;
	font-weight: 700;
}

.mtfq-faq__spec-rows {
	margin-top: calc(20 * var(--pc));
}

/* 行の高さは固定せず、結果テキストの行数（1行=66px／2行=92px）に応じて
 * 自動で決まる（stretchで数量枠も同じ高さに揃える）。 */
.mtfq-faq__spec-row {
	display: flex;
	align-items: stretch;
	gap: calc(5 * var(--pc));
}

.mtfq-faq__spec-row + .mtfq-faq__spec-row {
	margin-top: calc(5 * var(--pc));
}

.mtfq-faq__spec-qty {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: calc(200 * var(--pc));
	padding: calc(20 * var(--pc)) 0;
	background: #f7f5eb;
	border-radius: calc(15 * var(--pc));
	font-weight: 700;
	text-align: center;
}

.mtfq-faq__spec-result {
	display: flex;
	flex: 1;
	align-items: center;
	box-sizing: border-box;
	padding: calc(20 * var(--pc)) 0 calc(20 * var(--pc)) calc(40 * var(--pc));
	background: #fff;
	border-radius: calc(15 * var(--pc));
}

.mtfq-faq__spec-row--highlight .mtfq-faq__spec-qty,
.mtfq-faq__spec-row--highlight .mtfq-faq__spec-result {
	font-weight: 700;
	color: #0d3061;
}

/* ---- パーツ：画像 ----
 * 画像は元の縦横比を保ったまま幅400pxで表示する（高さは自動）。 */
.mtfq-faq__image {
	margin: 0;
}

.mtfq-faq__image-caption {
	margin: 0 0 calc(10 * var(--pc));
	font-size: calc(16 * var(--pc));
	font-weight: 500;
	line-height: calc(26 * var(--pc));
	letter-spacing: 0.06em;
	color: #333;
}

.mtfq-faq__image img {
	display: block;
	width: calc(400 * var(--pc));
	max-width: 100%;
	height: auto;
	margin-inline: auto;
}

/* ==================== CTA（ご相談ください） ====================
 * 他ページ（TOP・お知らせ一覧・お知らせ詳細・会社案内）と同じ内容・数値を流用。 */
.mtfq-cta {
	box-sizing: border-box;
	width: 100%;
	min-height: calc(658 * var(--pc));
	margin-top: calc(150 * var(--pc));
	margin-bottom: calc(154 * var(--pc));
	padding-top: calc(180 * var(--pc));
	background: #1a355c;
	text-align: center;
}

.mtfq-cta__title--sp {
	display: none;
}

.mtfq-cta__title {
	margin: 0;
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-size: calc(40 * var(--pc));
	font-weight: 700;
	line-height: calc(50 * var(--pc));
	letter-spacing: 0.15em;
	color: #fff;
}

.mtfq-cta__lead--sp {
	display: none;
}

.mtfq-cta__lead {
	width: calc(497 * var(--pc));
	margin: calc(40 * var(--pc)) auto 0;
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-size: calc(16 * var(--pc));
	font-weight: 500;
	line-height: calc(26 * var(--pc));
	letter-spacing: 0.06em;
	color: #fff;
}

/* PC本文：<br>で改行位置を指定しているので、1行ごとの自動折り返しは止める。
 * 幅はテキストに合わせて自動で広げる。 */
.mtfq-cta__lead--pc {
	width: max-content;
	white-space: nowrap;
}

.mtfq-cta__actions {
	display: flex;
	justify-content: center;
	gap: calc(14 * var(--pc));
	margin-top: calc(60 * var(--pc));
}

.mtfq-cta__btn {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	width: calc(341 * var(--pc));
	height: calc(70 * var(--pc));
	background: #f7f5eb;
	border-radius: calc(15 * var(--pc));
	color: #333;
	text-decoration: none;
}

.mtfq-cta__btn-text {
	margin-left: calc(40 * var(--pc));
	margin-right: auto;
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-size: calc(14 * var(--pc));
	font-weight: 500;
	line-height: calc(14 * var(--pc));
	letter-spacing: 0.06em;
}

.mtfq-cta__btn-divider {
	flex: none;
	width: calc(1 * var(--pc));
	height: calc(30 * var(--pc));
	background: #333;
}

.mtfq-cta__btn-arrow {
	flex: none;
	width: calc(24 * var(--pc));
	height: auto;
	margin-left: calc(29 * var(--pc));
	margin-right: calc(30 * var(--pc));
	clip-path: inset(0 0 0 0);
}

.mtfq-cta__btn:hover .mtfq-cta__btn-arrow {
	animation: mtfqArrowReveal 0.3s ease-out;
}

@keyframes mtfqArrowReveal {
	from { clip-path: inset(0 100% 0 0); }
	to { clip-path: inset(0 0 0 0); }
}

/* ==================== パンくずリスト ====================
 * CTAの margin-bottom がフッターとの間隔を兼ねるため、ここでは margin を持たない。 */
.mtfq-breadcrumb {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	width: 100%;
	margin: 0;
	padding-left: calc(80 * var(--pc));
}

.mtfq-breadcrumb__link {
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-weight: 500;
	font-size: calc(14 * var(--pc));
	line-height: calc(14 * var(--pc));
	letter-spacing: 0.06em;
	color: rgba(51, 51, 51, 0.4);
	text-decoration: none;
}

.mtfq-breadcrumb__divider {
	display: block;
	flex: none;
	/* 親の align-items:center に任せ、文字の縦中央に線の回転軸を置く。
	 * Figmaの座標は「回転後の見た目のバウンディングボックス」の位置を示しており、
	 * CSSの「回転前の位置を基準に回転する」挙動とは基準点が異なるため、
	 * Figmaの数値をそのまま上端からのオフセットとして使うと合わない。 */
	width: calc(12 * var(--pc));
	height: 0;
	margin: 0 calc(9 * var(--pc)) 0 calc(15 * var(--pc));
	border-top: 1px solid #333;
	transform: rotate(120deg);
}

.mtfq-breadcrumb__current {
	font-family: "zen-kaku-gothic-new", sans-serif;
	font-weight: 500;
	font-size: calc(14 * var(--pc));
	line-height: calc(14 * var(--pc));
	letter-spacing: 0.06em;
	text-decoration-line: underline;
	color: #333;
}

/* ==================== レスポンシブ（SP） ====================
 * スケール係数 --sp は common.css の :root（@media 内）で定義済み。 */
@media (max-width: 767px) {

	.mtfq-titlebar {
		width: calc(690 * var(--sp));
		height: calc(140 * var(--sp));
		margin: calc(60 * var(--sp)) auto 0;
		border-radius: calc(30 * var(--sp));
	}

	.mtfq-titlebar__title {
		left: calc(50 * var(--sp));
		top: calc(50 * var(--sp));
		width: calc(270 * var(--sp));
		height: calc(40 * var(--sp));
		font-size: calc(40 * var(--sp));
		line-height: calc(40 * var(--sp));
	}

	.mtfq-titlebar__smile {
		left: calc(559 * var(--sp));
		top: calc(55 * var(--sp));
		width: calc(81 * var(--sp));
		height: calc(30 * var(--sp));
	}

	/* ボタンの枠（幅650・高さ64・角丸33・列間10・行間20）はFigma実データに合わせ済み。
	 * ラベルの文字サイズ・左右パディングは未受領のため、暫定値のまま
	 * （内容に応じて幅が決まる作りなので、多少のズレはあっても崩れない）。 */
	.mtfq-category {
		width: calc(650 * var(--sp));
		margin-top: calc(80 * var(--sp));
	}

	.mtfq-category__list {
		column-gap: calc(10 * var(--sp));
		row-gap: calc(20 * var(--sp));
	}

	.mtfq-category__button {
		height: calc(64 * var(--sp));
		padding: 0 calc(30 * var(--sp));
		border-radius: calc(33 * var(--sp));
	}

	.mtfq-category__label {
		font-size: calc(22 * var(--sp));
		line-height: calc(22 * var(--sp));
	}

	.mtfq-category__chevron {
		width: calc(13 * var(--sp));
		height: calc(9 * var(--sp));
		margin-left: calc(14 * var(--sp));
	}

	/* SP側もTOPページのよくある質問セクション（.mtop-faq、home.css）のSP数値を流用。
	 * 質問ボックス(554) + gap(5) + トグル(91) = 650（種類ボタンと同じコンテンツ幅）。 */
	.mtfq-faq {
		width: calc(650 * var(--sp));
		margin-top: calc(80 * var(--sp));
		padding-top: calc(80 * var(--sp));
		border-top: 1px solid #e9e9e9;
	}

	.mtfq-faq__heading {
		font-size: calc(32 * var(--sp));
		line-height: calc(48 * var(--sp));
		scroll-margin-top: calc(120 * var(--sp) + 20px);
	}

	.mtfq-faq__list {
		margin-top: calc(60 * var(--sp));
	}

	.mtfq-faq__item {
		margin-bottom: calc(20 * var(--sp));
	}

	.mtfq-faq__q {
		gap: calc(5 * var(--sp));
	}

	.mtfq-faq__q-box {
		width: calc(554 * var(--sp));
		height: auto;
		padding: calc(40 * var(--sp));
		border-radius: calc(15 * var(--sp));
	}

	.mtfq-faq__q-text {
		font-size: calc(26 * var(--sp));
		line-height: calc(44 * var(--sp));
	}

	.mtfq-faq__toggle {
		width: calc(91 * var(--sp));
		height: auto;
		border-radius: calc(15 * var(--sp));
	}

	.mtfq-faq__toggle-bar {
		width: calc(20 * var(--sp));
		height: calc(4 * var(--sp));
	}

	.mtfq-faq__a {
		width: calc(650 * var(--sp));
		margin-top: calc(5 * var(--sp));
		padding: calc(40 * var(--sp));
		border-radius: calc(15 * var(--sp));
	}

	.mtfq-faq__a-text {
		font-size: calc(26 * var(--sp));
		line-height: calc(44 * var(--sp));
	}

	.mtfq-faq__a-text > * + * {
		margin-top: calc(60 * var(--sp));
	}

	.mtfq-faq__a-text > .mtfq-faq__text + .mtfq-faq__image {
		margin-top: calc(20 * var(--sp));
	}

	/* 画像→文章の間隔は標準の60pxと同じ値のため、個別指定は不要（PC側は
	 * 20px/40pxで非対称なのでそちらは個別指定のまま）。 */

	.mtfq-faq__text p + p {
		margin-top: 0;
	}

	.mtfq-faq__text p.mtfq-faq__text-gap {
		margin-top: calc(40 * var(--sp));
	}

	/* 早見表はSPでは字下げせず、コンテンツ幅いっぱい（570px）に表示。
	 * 数量枠と結果枠は左右並びではなく縦積みにし、どちらも中央寄せテキストにする
	 * （.mtfq-faq__spec-rowはdisplay:contentsで透過させ、数量・結果を
	 * .mtfq-faq__spec-rowsの直接の子として一律10pxの間隔で並べる）。 */
	.mtfq-faq__spec {
		width: 100%;
	}

	.mtfq-faq__spec-rows {
		display: flex;
		flex-direction: column;
		gap: calc(10 * var(--sp));
		margin-top: calc(30 * var(--sp));
	}

	.mtfq-faq__spec-row {
		display: contents;
	}

	.mtfq-faq__spec-qty {
		flex: none;
		width: 100%;
		padding: calc(20 * var(--sp)) 0;
		border-radius: calc(15 * var(--sp));
	}

	.mtfq-faq__spec-result {
		flex: none;
		width: 100%;
		justify-content: center;
		padding: calc(20 * var(--sp));
		border-radius: calc(15 * var(--sp));
		text-align: center;
	}

	.mtfq-faq__image-caption {
		margin-bottom: calc(20 * var(--sp));
		font-size: calc(26 * var(--sp));
		line-height: calc(44 * var(--sp));
	}

	/* SPでは画像はコンテンツ幅いっぱい（570px＝100%）で表示する。 */
	.mtfq-faq__image img {
		width: 100%;
	}

	.mtfq-cta {
		min-height: calc(966 * var(--sp));
		height: auto;
		margin-top: calc(150 * var(--sp));
		margin-bottom: calc(150 * var(--sp));
		padding-top: calc(120 * var(--sp));
	}

	.mtfq-cta__title--pc {
		display: none;
	}

	.mtfq-cta__title--sp {
		display: block;
	}

	.mtfq-cta__title {
		margin: 0 auto;
		font-size: calc(38 * var(--sp));
		line-height: calc(58 * var(--sp));
	}

	.mtfq-cta__lead--pc {
		display: none;
	}

	.mtfq-cta__lead--sp {
		display: block;
	}

	.mtfq-cta__lead {
		width: calc(650 * var(--sp));
		margin: calc(60 * var(--sp)) auto 0;
		font-size: calc(28 * var(--sp));
		line-height: calc(48 * var(--sp));
		text-align: left;
	}

	.mtfq-cta__actions {
		flex-direction: column;
		align-items: center;
		gap: calc(30 * var(--sp));
		margin-top: calc(80 * var(--sp));
	}

	.mtfq-cta__btn {
		width: calc(490 * var(--sp));
		height: calc(100 * var(--sp));
		border-radius: calc(15 * var(--sp));
	}

	.mtfq-cta__btn-text {
		margin-left: calc(40 * var(--sp));
		font-size: calc(24 * var(--sp));
		line-height: calc(24 * var(--sp));
	}

	.mtfq-cta__btn-divider {
		width: calc(2 * var(--sp));
		height: calc(30 * var(--sp));
	}

	.mtfq-cta__btn-arrow {
		width: calc(32 * var(--sp));
		margin-left: calc(40 * var(--sp));
		margin-right: calc(40 * var(--sp));
	}

	.mtfq-cta__btn.is-viewing .mtfq-cta__btn-arrow {
		animation: mtfqArrowReveal 2s ease-out infinite;
	}

	.mtfq-breadcrumb {
		/* フッターとの間隔は.mt-footer自体のpadding-topに任せる（二重にしない）。 */
		padding-left: calc(40 * var(--sp));
	}

	.mtfq-breadcrumb__link,
	.mtfq-breadcrumb__current {
		font-size: calc(22 * var(--sp));
		line-height: calc(22 * var(--sp));
	}

	.mtfq-breadcrumb__divider {
		width: calc(20 * var(--sp));
		/* PCは1pxだが、SPはFigma指定で2px（線の太さは--spでスケールしない）。 */
		border-top-width: 2px;
		margin: 0 calc(20 * var(--sp)) 0 calc(20 * var(--sp));
	}

}

/* PCワイド画面（1441px〜）：CTAの紺背景だけ画面幅へ延長する（TOPのCTAと同じ方法。中身は1440の枠のまま）。
 * 本文の枠を画面幅にする指定は common.css 側。 */
@media (min-width: 1441px) {
	.mtfq-cta {
		position: relative;
		isolation: isolate;
	}

	.mtfq-cta::before {
		content: "";
		position: absolute;
		z-index: -1;
		top: 0;
		bottom: 0;
		left: 50%;
		width: 100cqw;
		transform: translateX(-50%);
		background: #1a355c;
		pointer-events: none;
	}
}
