.fact-long {
	display: flex;
	justify-content: space-between;
	gap: var(--padding-big);
	margin-bottom: var(--margin-big-2);
}

.fact-long:last-of-type {
	margin-bottom: var( --margin-l);
}

.fact-long-figure {
	width: calc(50% - var(--padding-big) / 2);
	max-width: calc(var(--font-size-g-5) * 5);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.fact-long-text {
	width: calc(50% - var(--padding-big) / 2);
	max-width: 650px;
	line-height: 1.9444em;
}

.fact-long-text .title.title-g {
	font-size: calc(var(--font-size-g-3) * 0.82);
}

.fact-long-title {
	font-size: var(--font-size-g-2);
	display: block;
	white-space: nowrap;
	line-height: 1.2em;
	margin-bottom: 0.3em;

	--left-side: 0;
	--left-side-base: 0;
	--whole-line: 0%;
	--bottom-line: 2px;
	--width-line: 100vw;
	--color-line: var(--color-foreground);
	--time-line-transition: 0.8s;
	--transition-button: opacity 0.8s ease, transform 0.8s ease, --left-side 0.5s ease-in-out, --whole-line var(--time-line-transition) ease-in;

	border-image: linear-gradient(to right, transparent 0, transparent var(--left-side), var(--color-line) var(--left-side), var(--color-line) var(--whole-line), transparent var(--whole-line), transparent 100%) 0 0 1 0 / 0 0 1px 0 / 0 var(--width-line) var(--bottom-line) var(--left-side-base);
}

.fact-long-title[data-aos] {
	transition: var(--transition-button);
}

.fact-long-title.aos-animate {
	--whole-line: 100%;
}

.fact-long-desc {
	display: block;
	font-size: var(--font-size-b-4);
	white-space: nowrap;
}

@media screen and (max-width: 1850px) {
	.fact-long-text .title.title-g {
		font-size: var(--font-size-g-2);
	}

	.fact-long-title {
		font-size: var(--font-size-g-4);
	}

	.fact-long-figure {
		max-width: calc(var(--font-size-g-4) * 5);
	}
}

@media screen and (max-width: 1200px) {
	.fact-long-figure {
		max-width: calc(var(--font-size-g-4) * 6.5);
	}
}

@media screen and (max-width: 1200px) {
	.fact-long {
		flex-wrap: wrap;
	}

	.fact-long-figure {
		width: max-content;
		margin-left: auto;
		max-width: none;
	}

	.fact-long-text {
		width: 100%;
		max-width: none;
	}

	.fact-long-figure {
		width: max-content;
	}

	.fact-long-title {
		width: max-content;
	}

	.fact-long-desc {
		width: max-content;
	}
}

@media screen and (max-width: 480px) {
	.fact-long-figure {
		width: 100%;
	}

	.fact-long-title {
		width: 100%;
	}

	.fact-long-desc {
		width: 100%;
		white-space: normal;
	}
}
