@charset "utf-8";

/* ==================================================
	공통 틀 CSS
================================================== */
.mcontents {
	position: relative;
	max-width: 100%;
	overflow-x: hidden;
}

/* ==================================================
	메인 페이지 공통 (mn-)
================================================== */
.mn-section-head {
	display: flex;
	flex-direction: column;
}

.mn-section-head__label {
	text-transform: uppercase;
	line-height: 1;
}

.mn-section-head__label--primary {
	font-weight: var(--font-sb);
	color: var(--brand-color-dmain);
}

.mn-section-head__label--accent {
	font-weight: var(--font-md);
	color: #59a1ff;
}

.mn-section-head__title {
	margin-top: var(--rem-20);
	font-size: var(--rem-50);
	font-weight: var(--font-sb);
	line-height: 1.4;
}

.mn-section-head__title--dark {
	color: var(--color-black);
}

.mn-section-head__title--light {
	color: var(--color-white);
}

.mn-section-desc {
	font-size: 2.6rem;
	font-weight: var(--font-rg);
	line-height: 1.6;
}

.mn-section-desc--dark {
	color: var(--color-black);
}

.mn-section-desc--light {
	color: var(--color-white);
}

.mn-section-divider {
	display: block;
	width: 7rem;
	height: 0.3rem;
	background: var(--brand-color-sub);
}

.mn-more-link {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.2rem;
	width: 22rem;
	padding: 1.6rem 3rem;
	border-radius: 3rem;
	font-size: 2rem;
	font-weight: var(--font-md);
	text-decoration: none;
	transition: background 0.3s ease, border-color 0.3s ease;
}

.mn-more-link--dark {
	border: 0.1rem solid rgba(0, 0, 0, 0.4);
	background: rgba(206, 212, 218, 0.2);
	backdrop-filter: blur(0.6rem);
	-webkit-backdrop-filter: blur(0.6rem);
	color: var(--color-black);
}

.mn-more-link--dark span {
	color: var(--color-black);
	line-height: 1;
}

.mn-more-link--dark:hover {
	background: rgba(206, 212, 218, 0.35);
	border-color: rgba(0, 0, 0, 0.55);
}

.mn-more-link--light {
	color: var(--color-white);
	border: 0.1rem solid rgba(255, 255, 255, 0.6);
	background: rgba(51, 53, 55, 0.1);
	backdrop-filter: blur(0.6rem);
	-webkit-backdrop-filter: blur(0.6rem);
}

.mn-more-link--light span {
	color: var(--color-white);
	line-height: 1;
}

.mn-more-link:hover {
	background: var(--brand-color-main);
	border-color: var(--brand-color-main);
}

.mn-more-link:hover span {
	color: var(--color-white);
}

.mn-more-link img.off {
	display: block;
}

.mn-more-link img.on {
	display: none;
}

.mn-more-link:hover img.off {
	display: none;
}

.mn-more-link:hover img.on {
	display: block;
}

.mn-more-link__icon {
	display: flex;
	flex-shrink: 0;
	width: 2.6rem;
	height: 1.4rem;
}

.mn-more-link__icon img {
	display: block;
	width: 100%;
	height: 100%;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1600px) {
	.mn-section-head__title {
		font-size: 4.4rem;
	}

	.mn-section-desc {
		font-size: 2.4rem;
	}
}

@media screen and (max-width: 1024px) {
	.mn-section-head__label {
		font-size: var(--rem-16);
	}

	.mn-section-head__title {
		font-size: 3.6rem;
	}

	.mn-section-desc {
		font-size: 2.2rem;
	}
}

@media screen and (max-width: 768px) {
	.mn-section-head__label {
		font-size: 1.6rem;
	}

	.mn-section-head__title {
		font-size: 3rem;
	}

	.mn-section-desc {
		font-size: 1.8rem;
	}

	.mn-more-link {
		width: 20rem;
		padding: 1.4rem 2.4rem;
		font-size: 1.8rem;
	}
}

@media screen and (max-width: 640px) {
	.mn-section-head__title {
		font-size: 2.6rem;
	}

	.mn-section-desc {
		font-size: 1.6rem;
	}

	.mn-more-link {
		width: 100%;
		max-width: 22rem;
	}
}



/* 효과 */
.js-fade-up {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity 0.8s ease var(--fade-up-delay, 0s), transform 0.8s ease var(--fade-up-delay, 0s);
	will-change: opacity, transform;
}

.js-fade-up.is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
	.js-fade-up {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ==================================================
	메인비주얼
================================================== */
.hero-section {
	position: relative;
	padding: var(--header-hei) 0 0;
}

.hero-banner {
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 88rem;
	overflow: hidden;
	margin: 0 auto;
}

.hero-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease-in-out, visibility 1s;
	z-index: 1;
}

.hero-slide.active {
	opacity: 1;
	visibility: visible;
	z-index: 2;
}

/* 첫 로드: 깜빡임 없이 첫 슬라이드만 바로 노출(scale 1.05, 글씨 숨김) → 다음 프레임에 active로 애니 재생 */
.hero-slide.hero-initial {
	opacity: 1;
	visibility: visible;
	z-index: 2;
	transition: none;
}

.hero-bg-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.05);
	transition: transform 6s ease-out;
}

.hero-slide.active .hero-bg-img {
	transform: scale(1);
}

.hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* background: rgba(0, 0, 0, 0.3); */
}

.hero-text {
	position: relative;
	z-index: 3;
	width: var(--px-base);
	text-align: left;
	padding: 0 var(--inner-padding);
	color: var(--color-white);
}

.hero-text .hero-text-line {
	display: block;
	opacity: 0;
	transform: translateY(2.4rem);
	transition: opacity 0.7s ease, transform 0.7s ease;
}

.hero-slide.active .hero-text .hero-text-line:nth-of-type(1) {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.3s;
}

.hero-slide.active .hero-text .hero-text-line:nth-of-type(2) {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.5s;
}

.hero-slide.active .hero-text .hero-text-line:nth-of-type(3) {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.7s;
}

.hero-text h2 {
	font-size: 7.8rem;
	font-weight: var(--font-bd);
	line-height: 1.15;
	margin-bottom: var(--rem-30);
	/* text-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.25); */
}

.hero-text p {
	font-size: var(--rem-30);
	font-weight: var(--font-md);
	color: var(--color-white);
	line-height: 1.6;
}

.hero-text p.hero-t-p {
	font-size: 2.4rem;
	/* color: var(--brand-color-dmain); */
	color: #59a1ff;
	margin-bottom: var(--rem-30);
}

/* scroll down */
.hero-scroll {
	position: absolute;
	right: var(--inner-padding);
	bottom: 0;
	/* transform: translateY(-50%); */
	z-index: 10;
	width: 2rem;
	height: 34%;
	display: flex;
	flex-direction: column;
	align-items: center;
	pointer-events: none;
}

.hero-scroll .txt {
	margin-top: 4.4rem;
	font-size: var(--rem-16);
	font-weight: var(--font-md);
	color: var(--color-white);
	letter-spacing: 0;
	white-space: nowrap;
	line-height: 1;
	transform: rotate(90deg);
	transform-origin: center;
}

.hero-scroll::before,
.hero-scroll::after {
	content: "";
	position: absolute;
	display: block;
	width: 0.2rem;
	height: calc(100% - 10rem);
	top: 10.5rem;
	left: 50%;
	margin-top: 0;
}

.hero-scroll::before {
	transform: translateX(-50%);
	/* background: linear-gradient(180deg, #868e96 0%, #ffffff 100%); */
}

.hero-scroll::after {
	transform: translateX(-50%);
	background: linear-gradient(180deg,
			rgba(255, 255, 255, 0) 0%,
			rgba(255, 255, 255, 0) 30%,
			rgba(255, 255, 255, 0.95) 50%,
			rgba(255, 255, 255, 0) 70%,
			rgba(255, 255, 255, 0) 100%);
	background-size: 100% 300%;
	background-position: 0 0%;
	animation: heroScrollFlow 1.8s linear infinite;
	opacity: 1;
}

@keyframes heroScrollFlow {
	0% {
		transform: translateX(-50%);
		background-position: 0 100%;
	}

	100% {
		transform: translateX(-50%);
		background-position: 0 0%;
	}
}

/* Hero Controls */
.hero-slider-controls {
	position: absolute;
	bottom: 5rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 2rem;
	z-index: 10;
	max-width: var(--px-base);
	width: 100%;
	text-align: var(--text-ag-left);
	padding: 0 var(--inner-padding);
}

.page-current,
.page-total {
	color: var(--color-white);
	font-size: var(--rem-16);
	font-weight: var(--font-sb);
}

.progress-bar {
	width: 10rem;
	height: 0.2rem;
	background: rgba(255, 255, 255, 0.2);
	position: relative;
}

.progress-inner {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 0%;
	background: var(--brand-color-sub);
}

.arrow {
	cursor: pointer;
	display: flex;
	align-items: center;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1780px) {
	.hero-banner {
		height: 68rem;
	}

	.hero-text h2 {
		font-size: 5.6rem;
		margin-bottom: var(--rem-20);
	}

	.hero-text p {
		font-size: var(--rem-20);
	}

	.hero-text p.hero-t-p {
		font-size: var(--rem-18);
		margin-bottom: var(--rem-20);
	}

	.hero-scroll {
		right: calc(var(--inner-padding) / 2);
	}

	.hero-scroll .txt {
		margin-top: 4rem;
		font-size: var(--rem-14);
	}

	.hero-scroll::before,
	.hero-scroll::after {
		height: calc(100% - 10rem);
		top: 9.5rem;
	}

	.hero-slider-controls {
		bottom: 4rem;
		gap: 1.8rem;
	}
}

@media screen and (max-width: 1024px) {
	.hero-banner {
		height: 50rem;
	}

	.hero-text h2 {
		font-size: 4.8rem;
	}

	.hero-text p {
		font-size: var(--rem-17);
	}

	.hero-slider-controls {
		bottom: 3rem;
		padding: 0.8rem var(--inner-padding);
		gap: 1.5rem;
	}

	.progress-bar {
		width: 8rem;
	}
}

@media screen and (max-width: 768px) {
	.hero-banner {
		/* height: 42rem; */
	}

	.hero-text h2 {
		font-size: 3.6rem;
		line-height: 1.35;
	}

	.hero-slider-controls {
		bottom: 2rem;
		padding: 0.6rem var(--inner-padding);
		gap: 1.2rem;
	}

	.page-current,
	.page-total {
		font-size: 1.4rem;
	}

	.progress-bar {
		width: 6rem;
	}
}

@media screen and (max-width: 640px) {
	.hero-banner {
		height: calc(100vh - var(--header-hei));
	}

	.hero-text h2 {
		font-size: 2.8rem;
	}

	.hero-slider-controls {
		bottom: 1.5rem;
		padding: 0.5rem var(--inner-padding);
		gap: 1rem;
	}
}


/* ==================================================
	Company overview
================================================== */
.company-section {
	position: relative;
	overflow: hidden;
	padding: 18rem 0;
}

.company-section__bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.company-section__bg-base {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.company-section__bg-grad {
	position: absolute;
	inset: 0;
}

.company-section__bg-grad--fade {
	background: linear-gradient(to left, rgba(237, 247, 255, 0.9) 70%, rgba(154, 181, 200, 0) 30%);
}

.company-section__bg-building {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.company-section__bg-building-img {
	position: absolute;
	left: 16%;
	right: -5%;
	bottom: -1%;
	width: 89%;
	/* max-width: none; */
	/* height: 171.03%; */
	object-fit: cover;
}

.company-section__bg-grad--light {
	background: linear-gradient(to right, #cfe4f9 16.21%, rgba(237, 247, 255, 0) 58.418%);
}

.company-section__inner {
	position: relative;
	z-index: 1;
	max-width: var(--px-base);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}

.company-section__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5rem;
	max-width: 72rem;
}

.company-section__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5rem;
}

.company-section__visual-mo {
	display: none;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1600px) {
	.company-section {
		padding: 13rem 0;
	}

	.company-section__bg-building-img {
		left: 0;
		right: -10%;
		width: 110%;
	}

	.company-section__bg-grad--light {
		background: linear-gradient(to right, rgba(207, 228, 249, 0.95) 10%, rgba(237, 247, 255, 0) 53.65%);
	}
}

@media screen and (max-width: 1024px) {
	.company-section {
		padding: 10.52rem 0;
	}

	.company-section__content {
		max-width: 56rem;
		gap: 4rem;
	}

	.company-section__body {
		gap: 4rem;
	}

	.company-section__bg-building-img {
		bottom: 0;
		width: 115%;
	}
}

@media screen and (max-width: 768px) {
	.company-section {
		padding: 8rem 0;
	}

	.company-section__content {
		max-width: 100%;
		gap: 3rem;
	}

	.company-section__body {
		gap: 3rem;
	}

	.company-section__br-pc {
		display: none;
	}

	.company-section__bg-building {
		display: none;
	}

	.company-section__bg-grad--fade {
		background: linear-gradient(to bottom, rgba(237, 247, 255, 0.95) 0%, rgba(237, 247, 255, 0.75) 55%, rgba(207, 228, 249, 0.35) 100%);
	}

	.company-section__bg-grad--light {
		background: linear-gradient(to bottom, #edf7ff 0%, rgba(237, 247, 255, 0) 100%);
	}

	.company-section__visual-mo {
		display: block;
		margin-top: 4rem;
		border-radius: 1.6rem;
		overflow: hidden;
	}

	.company-section__visual-mo img {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 8;
		object-fit: cover;
		object-position: center 100%;
	}
}

@media screen and (max-width: 640px) {
	.company-section {
		padding: 6rem 0;
	}

	.company-section__visual-mo {
		margin-top: 3rem;
		border-radius: 1.2rem;
	}

	.company-section__visual-mo img {
		aspect-ratio: 4 / 3;
	}
}



/* --- business-section(Business Area): var(--biz-content-w) 타이틀 + 풀블리드 무한 슬라이더 --- */
.mwarp .mcontents>.business-section:has(.biz-carousel) {
	--biz-content-w: calc(var(--px-base) - 2 * var(--inner-padding));

	width: 100vw;
	margin-left: calc(50% - 50vw);
	padding: 13rem 0 12rem;
	overflow: hidden;
	box-sizing: border-box;
	background: linear-gradient(to left, rgba(237, 247, 255, 0.6), rgba(154, 181, 200, 0));
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .business-container {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-col-left {
	width: 100%;
	max-width: var(--px-base);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
	box-sizing: border-box;
	flex: none;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-col-right {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	padding: 0;
	overflow: visible;
	flex: none;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel-wrapper {
	--biz-side: max(24px, calc((100vw - var(--biz-content-w)) / 2));
	position: relative;
	width: 100vw;
	overflow: hidden;
	box-sizing: border-box;
	min-height: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel-wrapper::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: var(--biz-side);
	height: 100%;
	z-index: 20;
	pointer-events: none;
	background: #fff;
	opacity: 1;
	transition: opacity 0.3s ease;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel-wrapper.is-moving::before {
	opacity: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel {
	width: 100vw;
	margin-left: var(--biz-side);
	overflow: visible;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel.slick-initialized {
	position: relative;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel.slick-initialized .slick-list {
	overflow: visible;
	padding-left: 0;
	height: 68rem !important;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .slick-track {
	margin-left: 0;
	margin-right: 0;
	height: 68rem !important;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .biz-card.slick-slide {
	height: 68rem !important;
	min-height: 68rem !important;
	max-height: 68rem !important;
	margin-right: 2rem;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 3rem;
	width: 100%;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header .mn-section-head {
	flex: 1;
	min-width: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header .mn-section-head__label--primary {
	font-size: var(--rem-18);
	font-weight: var(--font-bd);
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-nav {
	display: flex;
	align-items: center;
	gap: 1.6rem;
	flex-shrink: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-nav__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5.6rem;
	height: 5.6rem;
	padding: 0;
	border: 0.08rem solid #bfd0e4;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	transition: border-color 0.3s ease, background 0.3s ease;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-nav__btn:hover {
	border-color: var(--brand-color-dmain);
	background: rgba(237, 247, 255, 0.6);
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-nav__btn img {
	display: block;
	width: 2.4rem;
	height: 2.4rem;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-nav__btn.slick-arrow::before {
	display: none;
	content: none;
}

/* Business Area 카드 — Figma 66:1369 (400×680) */
.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	width: 40rem;
	height: 68rem !important;
	min-height: 68rem !important;
	max-height: 68rem !important;
	border-radius: 2rem;
	overflow: hidden;
	text-decoration: none;
	color: var(--color-white);
	flex-shrink: 0;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-media {
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: inherit;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card .biz-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.5s ease;
	transform-origin: center center;
}

@media (hover: hover) {
	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card:hover .biz-img {
		transform: scale(1.05);
	}
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-dim {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 50%, rgba(0, 0, 0, 0.6) 90%);
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-body {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: var(--rem-30);
	padding: 0 4.6rem 6rem;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card .biz-title {
	margin: 0;
	padding: 0;
	color: var(--color-white);
	font-size: var(--rem-38);
	font-weight: var(--font-sb);
	line-height: 1.3;
	white-space: normal;
}

.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-desc {
	margin: 0;
	font-size: var(--rem-20);
	font-weight: var(--font-rg);
	line-height: 1.3;
	color: var(--color-white);
}

@media screen and (max-width: 1600px) {
	.mwarp .mcontents>.business-section:has(.biz-carousel) {
		padding: 11rem 0 10rem;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel.slick-initialized .slick-list,
	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .slick-track {
		height: 61.2rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .biz-card.slick-slide {
		height: 61.2rem !important;
		min-height: 61.2rem !important;
		max-height: 61.2rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card {
		width: 36rem;
		height: 61.2rem !important;
		min-height: 61.2rem !important;
		max-height: 61.2rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card .biz-title {
		font-size: var(--rem-32);
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-desc {
		font-size: var(--rem-18);
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-body {
		padding: 0 3.6rem 5rem;
		gap: 2.4rem;
	}
}

@media screen and (max-width: 1024px) {
	.mwarp .mcontents>.business-section:has(.biz-carousel) {
		padding-top: 8rem;
		padding-bottom: 10rem;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .business-container {
		gap: 4rem;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header {
		flex-direction: column;
		align-items: flex-start;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header .mn-section-head__title {
		font-size: var(--rem-36);
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-col-right {
		overflow: visible;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel.slick-initialized .slick-list,
	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .slick-track {
		height: 54rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .biz-card.slick-slide {
		height: 54rem !important;
		min-height: 54rem !important;
		max-height: 54rem !important;
		margin-right: 1.8rem;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card {
		width: min(70vw, 42rem);
		height: 54rem !important;
		min-height: 54rem !important;
		max-height: 54rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card .biz-title {
		font-size: var(--rem-28);
	}
}

@media screen and (max-width: 768px) {
	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-section-header .mn-section-head__title {
		font-size: var(--rem-30);
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel.slick-initialized .slick-list,
	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .slick-track {
		height: 48rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-carousel .biz-card.slick-slide {
		height: 48rem !important;
		min-height: 48rem !important;
		max-height: 48rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card {
		width: 78vw;
		height: 48rem !important;
		min-height: 48rem !important;
		max-height: 48rem !important;
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card .biz-title {
		font-size: var(--rem-22);
	}

	.mwarp .mcontents>.business-section:has(.biz-carousel) .biz-card-body {
		padding: 0 3rem 4rem;
		gap: 2rem;
	}
}

@media screen and (max-width: 640px) {
	.mwarp .mcontents>.business-section:has(.biz-carousel) {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}
}

/* ==================================================
	Performance / R&D (high-quality technology)
================================================== */
.performance-section {
	position: relative;
	overflow: hidden;
	padding: 18rem 0;
	background-color: #1f2021;
	background-image: url('../../lib/images/main/mperformance_bg.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

.performance-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(31, 32, 33, 0.8) 6%, rgba(50, 56, 61, 0) 50%);
	pointer-events: none;
}

.performance-section::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(22, 70, 158, 0.3);
	mix-blend-mode: overlay;
	pointer-events: none;
}

.performance-section__inner {
	position: relative;
	z-index: 1;
	max-width: var(--px-base);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}

.performance-section__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5rem;
	max-width: 72rem;
}

.performance-section__head-group {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3.5rem;
}

.performance-section__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5rem;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1600px) {
	.performance-section {
		padding: 14rem 0;
	}
}

@media screen and (max-width: 1024px) {
	.performance-section {
		padding: 12rem 0;
		background-position: 65% center;
	}

	.performance-section__content {
		max-width: 56rem;
		gap: 4rem;
	}

	.performance-section__head-group {
		gap: 3rem;
	}

	.performance-section__body {
		gap: 4rem;
	}
}

@media screen and (max-width: 768px) {
	.performance-section {
		padding: 8rem 0;
		background-position: 75% center;
	}

	.performance-section::before {
		background: linear-gradient(to bottom, rgba(31, 32, 33, 0.88) 0%, rgba(31, 32, 33, 0.72) 55%, rgba(31, 32, 33, 0.45) 100%);
	}

	.performance-section__content {
		max-width: 100%;
		gap: 3rem;
	}

	.performance-section__head-group {
		gap: 2.4rem;
	}

	.performance-section__body {
		gap: 3rem;
	}
}

@media screen and (max-width: 640px) {
	.performance-section {
		padding: 6rem 0;
		background-position: center center;
	}

	.performance-section::before {
		background: linear-gradient(to bottom, rgba(31, 32, 33, 0.92) 0%, rgba(31, 32, 33, 0.78) 100%);
	}
}

/* ==================================================
	By the Numbers
================================================== */
.numbers-section {
	position: relative;
	overflow: hidden;
	padding: 10rem 0;
	background: linear-gradient(90deg, rgba(235, 241, 250, 0.95) 0%, rgba(210, 224, 241, 0.95) 100%);
}

.numbers-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 85% 120% at 57% -5%, rgba(0, 113, 188, 0.22) 0%, rgba(134, 197, 238, 0.18) 45%, rgba(179, 225, 255, 0.08) 70%, transparent 85%);
	pointer-events: none;
}

.numbers-section::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url('../../lib/images/main/numbers-section_grid.png') no-repeat center center;
	pointer-events: none;
}

.numbers-section__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5rem;
	max-width: var(--px-base);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}

.numbers-section__title {
	font-size: 5rem;
	font-weight: var(--font-sb);
	color: var(--color-black);
	line-height: 1.4;
	text-align: center;
}

.numbers-section__list {
	display: flex;
	align-items: stretch;
	gap: 2rem;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.numbers-section__item {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 3rem;
	min-width: 0;
	padding: 0 5rem;
}

.numbers-section__item+.numbers-section__item {
	border-left: 0.1rem solid rgba(0, 0, 0, 0.2);
}

.numbers-section__value {
	font-size: 5.8rem;
	font-weight: var(--font-sb);
	color: var(--brand-color-dmain);
	line-height: 1;
}

.numbers-section__label {
	font-size: 2.4rem;
	font-weight: var(--font-rg);
	color: var(--color-black);
	line-height: 1.3;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1600px) {
	.numbers-section {
		padding: 8rem 0;
	}

	.numbers-section__title {
		font-size: 4.4rem;
	}

	.numbers-section__item {
		padding: 0 3.5rem;
		gap: 2.4rem;
	}

	.numbers-section__value {
		font-size: 5rem;
	}

	.numbers-section__label {
		font-size: 2.2rem;
	}
}

@media screen and (max-width: 1024px) {
	.numbers-section {
		padding: 7rem 0;
	}

	.numbers-section__inner {
		gap: 4rem;
	}

	.numbers-section__title {
		font-size: 3.6rem;
	}

	.numbers-section__list {
		gap: 1.6rem;
	}

	.numbers-section__item {
		padding: 0 2.4rem;
		gap: 2rem;
	}

	.numbers-section__value {
		font-size: 4.2rem;
	}

	.numbers-section__label {
		font-size: 1.8rem;
	}
}

@media screen and (max-width: 768px) {
	.numbers-section {
		padding: 6rem 0;
	}

	.numbers-section__inner {
		gap: 3rem;
	}

	.numbers-section__title {
		font-size: 3rem;
	}

	.numbers-section__list {
		flex-wrap: wrap;
		gap: 0;
	}

	.numbers-section__item {
		flex: 1 1 50%;
		padding: 2.4rem 2rem;
		gap: 1.6rem;
		border-left: none;
	}

	.numbers-section__item:nth-child(odd) {
		border-right: 0.1rem solid rgba(0, 0, 0, 0.12);
	}

	.numbers-section__item:nth-child(n + 3) {
		border-top: 0.1rem solid rgba(0, 0, 0, 0.12);
	}

	.numbers-section__item+.numbers-section__item {
		border-left: none;
	}

	.numbers-section__value {
		font-size: 3.6rem;
	}

	.numbers-section__label {
		font-size: 1.6rem;
	}
}

@media screen and (max-width: 640px) {
	.numbers-section {
		padding: 5rem 0;
	}

	.numbers-section__title {
		font-size: 2.6rem;
	}

	.numbers-section__list {
		flex-direction: column;
	}

	.numbers-section__item {
		flex: 1 1 auto;
		width: 100%;
		padding: 2rem 0;
		align-items: center;
		text-align: center;
		border-right: none;
	}

	.numbers-section__item:nth-child(odd) {
		border-right: none;
	}

	.numbers-section__item:nth-child(n + 2) {
		border-top: 0.1rem solid rgba(0, 0, 0, 0.12);
	}

	.numbers-section__value {
		font-size: 3.2rem;
	}

	.numbers-section__label {
		font-size: 1.5rem;
	}
}


/* ==================================================
	Community
================================================== */
.community-section {
	position: relative;
	overflow: hidden;
	padding: 14rem 0;
	background-color: var(--color-white);
	background-image: url('../../lib/images/main/mcommunity_bg.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

.community-section__inner {
	position: relative;
	z-index: 1;
	max-width: var(--px-base);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}

.community-section__content {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5rem;
	max-width: 72rem;
}

.community-section__head-group {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3.5rem;
}

.community-section__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3.5rem;
}

/* ==================
	반응형CSS
=====================*/
@media screen and (max-width: 1600px) {
	.community-section {
		padding: 12rem 0;
	}
}

@media screen and (max-width: 1024px) {
	.community-section {
		padding: 10rem 0;
	}

	.community-section__content {
		max-width: 56rem;
		gap: 4rem;
	}

	.community-section__head-group {
		gap: 3rem;
	}

	.community-section__body {
		gap: 3rem;
	}
}

@media screen and (max-width: 768px) {
	.community-section {
		padding: 8rem 0;
	}

	.community-section__content {
		max-width: 100%;
		gap: 3rem;
	}

	.community-section__head-group {
		gap: 2.4rem;
	}

	.community-section__body {
		gap: 2.4rem;
	}
}

@media screen and (max-width: 640px) {
	.community-section {
		padding: 6rem 0;
	}

	.community-section::before {
		height: 45%;
		opacity: 0.4;
	}
}