
/* 메인 등 /sub/ 가 아닌 페이지: pin 시 스크롤바 등장으로 폭이 바뀌며 화면이 튀는 현상 완화 */
body:not(.sub-page) {
	scrollbar-gutter: stable;
}

/* main */
.main-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	min-height: 100vh;
	color: #222;
}

/* .main-wrap h2 {
	width: fit-content;
	margin: 0 auto 50px;
	font-size: 35px;
	font-weight: 700;
	color: var(--color-black);
	text-align: center;
	position: relative;
} */


.main-wrap .inner {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.section-header {
	margin-bottom: 0;
}
.header-title-box {
	width: 100%;
	margin-bottom: 40px;
}
.section-label {
	font-weight: 700;
	font-size: 24px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #1B9732;
	margin-bottom: 15px;
}
.subtitle-wrapper {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}
.section-title {
	font-size: 40px;
	font-weight: 700;
	color: #333;
	line-height: 1.4;
	flex: 1;
	letter-spacing: -0.02em;
	margin-bottom: 0;
}
.more-link {
	font-size: 18px;
	font-weight: 500;
	color: #444;
	text-decoration: none;
	transition: all 0.3s ease-in-out;
	white-space: nowrap;
}
.more-link:hover {
	color: #1B9732;
	transform: translateX(5px);
}

.notice-section .more-link,
.recruit-section .more-link {
	color: #FFFFFF;
}
.notice-section .more-link:hover,
.recruit-section .more-link:hover {
	color: #1B9732;
	transform: translateX(5px);
}

/* main - visual */
.main-wrap .visual {
	width: 100%;
	height: 100vh;
	min-height: 700px;
	padding: 0;
	background: var(--color-white);
	position: relative;
	overflow: hidden;
}
.main-wrap .visual .swiper {
	width: 100%;
	height: 100%;
}
.main-wrap .visual .swiper .swiper-slide {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	position: relative;
	padding-bottom: 150px;
}
.main-wrap .visual .swiper .swiper-slide.s01 {
	background: url("/images/main3.png") no-repeat 50% 50%;
	background-size: cover;
	background-position: center center;
}
.main-wrap .visual .swiper .swiper-slide.s02 {
	background: url("/images/main4.png") no-repeat 50% 50%;
	background-size: cover;
	background-position: center center;
}
.main-wrap .visual .swiper .swiper-slide.s03 {
	background: url("/images/main1.png") no-repeat 50% 50%;
	background-size: cover;
	background-position: center center;
}
.main-wrap .visual .swiper .swiper-slide.s04 {
	background: url("/images/main2.png") no-repeat 50% 50%;
	background-size: cover;
	background-position: center center;
}
.main-wrap .visual .swiper .swiper-slide::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.6) 100%);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.main-wrap .visual .hero-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	position: absolute;
	bottom: 180px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	text-align: center;
	width: 83%;
	color: #FFFFFF;
	letter-spacing: -0.02em;
}
.main-wrap .visual .hero-content .main-txt {
	font-size: 107px;
	line-height: 1;
	font-weight: 500;
	margin-bottom: 35px;
	letter-spacing: -0.02em;
}
.main-wrap .visual .hero-content .divider {
	width: 100%;
	height: 3px;
	position: relative;
	margin-bottom: 25px;
	background: rgba(255, 255, 255, 0.5);
	z-index: 0;
}
.main-wrap .visual .hero-content .divider::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: var(--divider-width, 0%);
	height: 100%;
	background: #FFFFFF;
	opacity: 1;
	transition: var(--divider-transition, none);
	transform-origin: left center;
	z-index: 1;
}

.main-wrap .visual .hero-content .text-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.main-wrap .visual .hero-content .sub-txt {
	font-size: 36px;
	font-weight: 600;
}

.main-wrap .visual .hero-content .btn-wrapper {
	width: 120px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	position: relative;
}


.main-wrap .visual .swiper-button-next,
 .main-wrap .visual .swiper-button-prev {
	width: 50px;
	height: 50px;
	background: rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	color: #aaa;
	transition: all 0.3s ease-in-out;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 10;
}
.main-wrap .visual .swiper-button-next::after,
.main-wrap .visual .swiper-button-prev::after {
	display: none;
}
.main-wrap .visual .swiper-button-next i,
.main-wrap .visual .swiper-button-prev i {
	font-size: 16px;
	font-weight: 700;
}
.swiper-button-next:hover,
.swiper-button-prev:hover {
	background: rgba(255, 255, 255, 0.5);
}

/* main - slogan section */
.main-wrap .slogan-section {
	width: 100%;
	height: 100vh;
	min-height: 800px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 0 50px;
	overflow: hidden;
}
.main-wrap .slogan-section.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 100;
	transition: none;
}
.slogan-section-placeholder {
	width: 100%;
	pointer-events: none;
}
.main-wrap .slogan-section .slogan-bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url("/images/main/slogan-bg.png") no-repeat 50% 0%;
	background-size: cover;
}
.main-wrap .slogan-section .slogan-bg::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
	position: absolute;
	top: 0;
	left: 0;
}
.main-wrap .slogan-section .slogan-content {
	position: absolute;
	z-index: 2;
	width: 50%;
	max-width: 600px;
	bottom: 150px;
	right: 180px;
}
.main-wrap .slogan-section .slogan-content .slogan-title {
	font-weight: 700;
	font-size: 54px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	margin-bottom: 40px;
	
	background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.3) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.main-wrap .slogan-section .slogan-content .slogan-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.main-wrap .slogan-section .slogan-content .slogan-item {
	font-weight: 600;
	font-size: 42px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	
	background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.3) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

/* main - company section */
.main-wrap .company-section {
	width: 100%;
	padding: 100px 0 150px;
	background: #FFFFFF;
	position: relative;
	background: url("/images/company-bg.png") no-repeat;
	background-size: cover;
	background-position: center center;
}
/* .main-wrap .company-section::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url("/images/main/bg_pattern.svg") no-repeat;
	background-size: contain;
	opacity: 0.05;
	pointer-events: none;
} */




.main-wrap .company-section .content-blocks {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 30px;
	align-items: stretch;
}
.main-wrap .company-section .content-block {
	min-width: 0;
	position: relative;
	text-decoration: none;
	transition: transform 0.3s ease-in-out;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.main-wrap .company-section .content-block:hover {
	transform: translateY(-5px);
}
.main-wrap .company-section .content-block .block-image {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.main-wrap .company-section .content-block .block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.main-wrap .company-section .content-block .block-overlay {
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 30px;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	font-weight: 700;
	font-size: 42px;
	line-height: 1.15;
	letter-spacing: 0;
	/* text-transform: uppercase; */
	color: rgba(255, 255, 255, 0.8);
	text-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
	box-sizing: border-box;
	text-align: right;
	word-break: keep-all;
	white-space: normal;
	overflow-wrap: anywhere;
}

/* main - business section */
.main-wrap .business-section {
	width: 100%;
	padding: 100px 0 0;
	background: #1A2B1A;
	position: relative;
	min-height: 100vh;
}
.main-wrap .business-section.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 100;
	transition: none;
}
.business-section-placeholder {
	width: 100%;
	pointer-events: none;
}

.main-wrap .business-section .business-container {
	width: 100%;
	height: 100%;
	display: flex;
	gap: 80px;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: nowrap;
	padding: 50px 0;
	box-sizing: border-box;
}
.main-wrap .business-section .business-left {
	flex: 0 1 60%;
	max-width: 60%;
	min-width: 0;
	border-radius: 20px;
}
.main-wrap .business-section .business-title {
	font-weight: 700;
	font-size: 24px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #1B9732;
	margin-bottom: 30px;
}
.main-wrap .business-section .business-category {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.main-wrap .business-section .business-category .category-item {
	font-size: 54px;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.6);
	cursor: pointer;
	transition: all 0.3s ease-in-out;
	position: relative;
	letter-spacing: -0.02em;
	display: inline-flex;
	align-self: flex-start;
	width: fit-content;
	white-space: nowrap;
}

.main-wrap .business-section .business-category .category-item span:first-child {
	display: inline-block;
}
.main-wrap .business-section .business-category .category-item:hover {
	color: rgba(255, 255, 255, 0.9);
}
.main-wrap .business-section .business-category .category-item.active,
.main-wrap .business-section .business-category .category-item.hover {
	color: #FFFFFF;
	font-weight: 700;
}

.main-wrap .business-section .business-category .category-item .underline {
	display: block;
	width: 100%;
	height: 2px;
	background: #FFFFFF;
	position: absolute;
	bottom: 0;
	left: 0;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
	opacity: 0.4;
	z-index: 1;
}
.main-wrap .business-section .business-category .category-item.active .underline,
.main-wrap .business-section .business-category .category-item.hover .underline {
	transform: scaleX(1);
	opacity: 1;
}
.main-wrap .business-section .business-right {
	flex: 0 1 40%;
	min-width: 0;
	position: relative;
	display: flex;
	justify-content: flex-end;
}
.main-wrap .business-section .product-images {
	width: 100%;
	max-width: 760px;
	height: auto;
	aspect-ratio: 4 / 3;
	position: relative;
	top: auto;
	right: auto;
	margin-left: auto;
	overflow: hidden;
}
.main-wrap .business-section .product-image {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.8s ease-in-out;
	background: #E3F2FD;
	z-index: 1;
	border-radius: 10px;
}
.main-wrap .business-section .product-image.active {
	opacity: 1;
	z-index: 2;
}
.main-wrap .business-section .product-image img {
	width: auto;
	height: 100%;
	aspect-ratio: 4/3;
	object-fit: cover;
	object-position: right center;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	left: auto;
}


.main-wrap .business-section .product-label {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
	bottom: 0;
	left: 0%;
	font-size: 28px;
	font-weight: 600;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding: 20px;
	color: rgba(255, 255, 255, 0.9);
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* main - notice section */
.main-wrap .notice-section {
	width: 100%;
	padding: 0 0 100px;
	background: #1A2B1A;
	position: relative;
}


.main-wrap .notice-section .section-title {
	color: #FFFFFF;
}

.main-wrap .notice-section .notice-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}
.main-wrap .notice-section .notice-item {
	flex: 1;
	background: transparent;
	overflow: hidden;
	transition: all 0.3s ease-in-out;
	display: block;
	text-decoration: none;
}
.main-wrap .notice-section .notice-item:hover {
	transform: translateY(-5px);
}
.main-wrap .notice-section .notice-item .notice-image {
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	position: relative;
	border-radius: 10px;
}
.main-wrap .notice-section .notice-item .notice-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.3s ease-in-out;
}
.main-wrap .notice-section .notice-item:hover .notice-image img {
	transform: scale(1.05);
}
.main-wrap .notice-section .notice-item .notice-content {
	padding: 25px 0;
}
.main-wrap .notice-section .notice-item .notice-title {
	font-size: 20px;
	font-weight: 700;
	color: #FFFFFF;
	margin: 0 0 15px 0;
	line-height: 1.4;
}
.main-wrap .notice-section .notice-item .notice-desc {
	font-size: 16px;
	font-weight: 400;
	color: #FFFFFF;
	margin: 0 0 15px 0;
	line-height: 1.6;
	opacity: 0.9;
}
.main-wrap .notice-section .notice-item .notice-date {
	font-size: 14px;
	font-weight: 400;
	color: #FFFFFF;
	opacity: 0.7;
}

/* main - recruit section */
.main-wrap .recruit-section {
	width: 100%;
	height: 500px;
	position: relative;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.main-wrap .recruit-section .recruit-bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url("/images/recruit-bg.png") no-repeat 50% 50%;
	background-size: cover;
	background-position: center center;
}
.main-wrap .recruit-section .recruit-bg::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	position: absolute;
	top: 0;
	left: 0;
}

.main-wrap .recruit-section .recruit-bg::after {
	content: "P&Tech";
	position: absolute;
	right: 3%;
	bottom: -50px;
	font-size: 300px;
	font-weight: 900;
	color: rgba(255, 255, 255, 0.15);
	letter-spacing: -0.05em;
	line-height: 1;
	z-index: 1;
	font-family: 'Pretendard', sans-serif;
}

.main-wrap .recruit-section .recruit-content {
	width: 100%;
}

.main-wrap .recruit-section .subtitle-wrapper {
	align-items: flex-start;
	flex-direction: column;
}

.main-wrap .recruit-section .section-title {
	color: #FFFFFF;
}

/* ============================================
   반응형 디자인
   ============================================ */

/* 큰 화면 (1920px 이상) */
/* @media screen and (min-width: 1920px) {
	.inner {
		max-width: 1600px;
	}
	.main-wrap .visual .hero-content {
		width: 75%;
	}
	.main-wrap .visual .hero-content .main-txt {
		font-size: 120px;
	}
	.main-wrap .visual .hero-content .sub-txt {
		font-size: 42px;
	}
} */

/* 태블릿 가로 및 작은 데스크톱 (1024px ~ 1460px) */
@media screen and (max-width: 1470px) {
	.main-wrap .inner {
		max-width: 1200px;
		padding: 0 30px;
	}
	
	.section-header {
		margin-bottom: 0;
	}
	
	.section-label {
		font-size: 22px;
	}
	
	.section-title {
		font-size: 36px;
	}
	
	.more-link {
		font-size: 17px;
	}
	
	/* Visual Section */
	.main-wrap .visual {
		min-height: 600px;
	}
	
	.main-wrap .visual .swiper .swiper-slide {
		padding-bottom: 120px;
	}
	
	.main-wrap .visual .hero-content {
		width: 90%;
		bottom: 150px;
	}
	
	.main-wrap .visual .hero-content .main-txt {
		font-size: 80px;
		margin-bottom: 30px;
	}
	
	.main-wrap .visual .hero-content .sub-txt {
		font-size: 30px;
	}
	
	/* Slogan Section */
	.main-wrap .slogan-section {
		min-height: 700px;
		padding: 0 40px;
	}
	
	.main-wrap .slogan-section .slogan-content {
		width: 55%;
		max-width: 550px;
		bottom: 120px;
		right: 120px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-title {
		font-size: 48px;
		margin-bottom: 35px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-item {
		font-size: 38px;
	}
	
	/* Company Section */
	.main-wrap .company-section {
		padding: 80px 0;
	}
	
	.main-wrap .company-section .content-blocks {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 25px;
	}

	.main-wrap .company-section .content-block {
		min-width: 0;
	}
	
	.main-wrap .company-section .content-block .block-image {
		height: auto;
	}
	
	.main-wrap .company-section .content-block .block-overlay {
		font-size: 36px;
		padding: 22px;
	}
	
	/* Business Section */
	.main-wrap .business-section {
		padding: 80px 0;
		min-height: auto;
	}
	
	.main-wrap .business-section .business-container {
		gap: 56px;
	}
	
	.main-wrap .business-section .business-left {
		flex: 0 1 48%;
		max-width: 48%;
	}
	
	.main-wrap .business-section .business-title {
		font-size: 22px;
		margin-bottom: 25px;
	}
	
	.main-wrap .business-section .business-category .category-item {
		font-size: 42px;
	}
	
	.main-wrap .business-section .business-right {
		flex: 0 1 52%;
	}
	
	.main-wrap .business-section .product-images {
		width: 100%;
		max-width: 550px;
		height: auto;
		position: relative;
		top: auto;
		margin-left: auto;
	}
	
	.main-wrap .business-section .product-label {
		font-size: 26px;
	}
	
	/* Notice Section */
	.main-wrap .notice-section {
		padding: 80px 0;
	}
	
	.main-wrap .notice-section .notice-list {
		grid-template-columns: repeat(4, 1fr);
		gap: 25px;
	}
	
	.main-wrap .notice-section .notice-item .notice-title {
		font-size: 19px;
	}
	
	/* Recruit Section */
	.main-wrap .recruit-section {
		height: 450px;
	}
	
	.main-wrap .recruit-section .recruit-bg::after {
		font-size: 250px;
		right: 2%;
		bottom: -40px;
	}
}

/* 태블릿 세로 (768px ~ 1023px) */
@media screen and (max-width: 1023px) {
	.main-wrap .inner {
		padding: 0 25px;
	}
	
	.section-header {
		margin-bottom: 40px;
	}
	
	.section-label {
		font-size: 20px;
		margin-bottom: 12px;
	}
	
	.section-title {
		font-size: 32px;
	}
	
	.more-link {
		font-size: 16px;
	}
	
	/* Visual Section */
	.main-wrap .visual {
		min-height: 500px;
		height: 100vh;
	}
	
	.main-wrap .visual .swiper .swiper-slide {
		padding-bottom: 100px;
	}
	
	.main-wrap .visual .hero-content {
		width: 95%;
		bottom: 120px;
	}
	
	.main-wrap .visual .hero-content .main-txt {
		font-size: 60px;
		margin-bottom: 25px;
	}
	
	.main-wrap .visual .hero-content .sub-txt {
		font-size: 24px;
	}
	
	.main-wrap .visual .swiper-button-next,
	.main-wrap .visual .swiper-button-prev {
		width: 45px;
		height: 45px;
	}
	
	/* Slogan Section */
	.main-wrap .slogan-section {
		min-height: 600px;
		padding: 0 30px;
		justify-content: center;
	}
	
	.main-wrap .slogan-section .slogan-content {
		width: 80%;
		max-width: 100%;
		bottom: 100px;
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		text-align: center;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-title {
		font-size: 40px;
		margin-bottom: 30px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-item {
		font-size: 32px;
	}
	
	/* Company Section */
	.main-wrap .company-section {
		padding: 60px 0;
	}
	
	.main-wrap .company-section .content-blocks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}
	
	.main-wrap .company-section .content-block .block-image {
		height: auto;
	}
	
	.main-wrap .company-section .content-block .block-overlay {
		font-size: 36px;
		padding: 18px;
	}
	
	/* Business Section */
	.main-wrap .business-section {
		padding: 60px 0;
		min-height: auto;
	}
	
	.main-wrap .business-section .business-container {
		flex-direction: row;
		gap: 48px;
	}
	
	.main-wrap .business-section .business-left {
		flex: 0 1 48%;
		max-width: 48%;
		min-width: 0;
		padding: 0;
	}
	
	.main-wrap .business-section .business-title {
		font-size: 20px;
		margin-bottom: 20px;
	}
	
	.main-wrap .business-section .business-category {
		gap: 12px;
	}
	
	.main-wrap .business-section .business-category .category-item {
		font-size: 34px;
	}
	
	.main-wrap .business-section .business-right {
		flex: 0 1 52%;
		min-width: 0;
		min-height: auto;
	}
	
	.main-wrap .business-section .product-images {
		width: 100%;
		max-width: 460px;
		height: auto;
		position: relative;
		top: 0;
		right: auto;
		margin-left: auto;
	}
	
	.main-wrap .business-section .product-label {
		font-size: 24px;
	}
	
	/* Notice Section */
	.main-wrap .notice-section {
		padding: 60px 0;
	}
	
	.main-wrap .notice-section .notice-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}
	
	.main-wrap .notice-section .notice-item .notice-content {
		padding: 20px 0;
	}
	
	.main-wrap .notice-section .notice-item .notice-title {
		font-size: 18px;
		margin-bottom: 12px;
	}
	
	.main-wrap .notice-section .notice-item .notice-desc {
		font-size: 16px;
		margin-bottom: 12px;
	}
	
	.main-wrap .notice-section .notice-item .notice-date {
		font-size: 16px;
	}
	
	/* Recruit Section */
	.main-wrap .recruit-section {
		height: 400px;
	}
	
	.main-wrap .recruit-section .recruit-bg::after {
		font-size: 180px;
		right: 1%;
		bottom: -30px;
	}
}

/* 포트폴리오: 1090px 이하에서 좌·우 컬럼 세로 배치 */
@media screen and (max-width: 1090px) {
	.main-wrap .business-section .business-container {
		flex-direction: column;
		gap: 40px;
	}

	.main-wrap .business-section .business-left,
	.main-wrap .business-section .business-right {
		flex: 0 1 100%;
		max-width: 100%;
		width: 100%;
	}

	.main-wrap .business-section .business-right {
		justify-content: flex-start;
	}

	.main-wrap .business-section .product-images {
		width: 100%;
		max-width: none;
		height: auto;
		margin-left: 0;
	}
}

/* 모바일 (480px ~ 768px) */
@media screen and (max-width: 768px) {
	.main-wrap .inner {
		padding: 0 20px;
	}
	
	.section-header {
		margin-bottom: 30px;
	}
	
	.section-label {
		font-size: 18px;
		margin-bottom: 10px;
	}
	
	.section-title {
		font-size: 28px;
	}
	
	.more-link {
		font-size: 16px;
	}
	
	.subtitle-wrapper {
		flex-direction: column;
		gap: 15px;
	}
	
	/* Visual Section */
	/* .main-wrap .visual {
		height: 70vh;
		min-height: 70vh;
	} */
	
	.main-wrap .visual .swiper,
	.main-wrap .visual .swiper-wrapper,
	.main-wrap .visual .swiper .swiper-slide {
		height: 100%;
	}
	
	.main-wrap .visual .hero-content {
		width: 90%;
		bottom: 100px;
	}
	
	.main-wrap .visual .hero-content .main-txt {
		font-size: 42px;
		margin-bottom: 20px;
		line-height: 1.2;
		text-align: left;
	}
	
	.main-wrap .visual .hero-content .sub-txt {
		font-size: 22px;
	}

	.main-wrap .visual .hero-content .btn-wrapper {
		width: 100px;
	}

	.main-wrap .visual .swiper-button-next,
	.main-wrap .visual .swiper-button-prev {
		width: 40px;
		height: 40px;
		bottom: 20px;
	}
	
	/* Slogan Section */
	.main-wrap .slogan-section {
		padding: 0 20px;
	}
	.main-wrap .slogan-section .slogan-bg {
		background-position: center center;	
	}
	.main-wrap .slogan-section .slogan-content {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 90%;
		bottom: 80px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-title {
		font-size: 32px;
		margin-bottom: 25px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-item {
		font-size: 26px;
	}
	
	/* Company Section */
	.main-wrap .company-section {
		padding: 50px 0;
	}
	
	.main-wrap .company-section .content-block .block-image {
		height: auto;
	}
	
	.main-wrap .company-section .content-block .block-overlay {
		font-size: 30px;
		padding: 14px;
	}
	
	/* Business Section */
	.main-wrap .business-section {
		padding: 50px 0;
	}
	
	.main-wrap .business-section .business-container {
		flex-direction: column;
		gap: 40px;
	}

	.main-wrap .business-section .business-left,
	.main-wrap .business-section .business-right {
		flex: 0 1 100%;
		max-width: 100%;
		width: 100%;
	}
	
	.main-wrap .business-section .business-title {
		font-size: 18px;
		margin-bottom: 18px;
	}
	
	.main-wrap .business-section .business-category .category-item {
		font-size: 32px;
	}
	
	.main-wrap .business-section .product-images {
		width: 100%;
		max-width: none;
		height: auto;
		margin-left: 0;
	}
	
	.main-wrap .business-section .product-label {
		font-size: 20px;
		padding: 15px;
	}
	
	/* Notice Section */
	.main-wrap .notice-section {
		padding: 50px 0;
	}
	
	.main-wrap .notice-section .notice-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px;
	}
	
	.main-wrap .notice-section .notice-item .notice-content {
		padding: 15px 0;
	}
	
	.main-wrap .notice-section .notice-item .notice-title {
		font-size: 18px;
		margin-bottom: 10px;
	}
	
	.main-wrap .notice-section .notice-item .notice-desc {
		font-size: 16px;
		margin-bottom: 10px;
	}
	
	.main-wrap .notice-section .notice-item .notice-date {
		font-size: 16px;
	}
	
	/* Recruit Section */
	.main-wrap .recruit-section {
		height: 350px;
	}
	
	.main-wrap .recruit-section .recruit-bg::after {
		font-size: 120px;
		right: 0;
		bottom: -20px;
	}
}

/* 메인 슬로건: 768px 이하에서 핀 비활성(JS)과 동일 — 일반 스크롤·문구 고정 표시 */
@media screen and (max-width: 768px) {
	.main-wrap .slogan-section {
		height: auto;
		min-height: 72vh;
		min-height: 72svh;
	}
	.main-wrap .slogan-section .slogan-title,
	.main-wrap .slogan-section .slogan-item {
		background: none;
		-webkit-background-clip: border-box;
		background-clip: border-box;
		-webkit-text-fill-color: #fff;
		color: #fff;
	}
}

/* 작은 모바일 (~479px) */
@media screen and (max-width: 479px) {
	.main-wrap .inner {
		padding: 0 16px;
	}
	
	.section-label {
		font-size: 16px;
	}
	
	.section-title {
		font-size: 24px;
	}
	
	.more-link {
		font-size: 16px;
	}
	
	/* Visual Section */
	/* .main-wrap .visual {
		height: 70vh;
		min-height: 70vh;
	} */
	
	.main-wrap .visual .swiper .swiper-slide {
		padding-bottom: 60px;
	}
	
	.main-wrap .visual .hero-content {
		bottom: 80px;
	}
	
	
	.main-wrap .visual .hero-content .sub-txt {
		font-size: 20px;
	}
	
	/* .main-wrap .visual .swiper-button-next,
	.main-wrap .visual .swiper-button-prev {
		width: 28px;
		height: 28px;
	} */
	
	/* Slogan Section */
	.main-wrap .slogan-section {
		min-height: 450px;
		padding: 0 16px;
	}
	
	.main-wrap .slogan-section .slogan-content {
		bottom: 60px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-title {
		font-size: 28px;
		margin-bottom: 20px;
	}
	
	.main-wrap .slogan-section .slogan-content .slogan-item {
		font-size: 22px;
	}
	
	/* Company Section */
	.main-wrap .company-section .content-blocks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.main-wrap .company-section .content-block .block-image {
		height: auto;
	}
	
	.main-wrap .company-section .content-block .block-overlay {
		font-size: 24px;
		padding: 12px;
	}
	
	/* Business Section */
	.main-wrap .business-section {
		padding: 40px 0;
	}
	
	.main-wrap .business-section .business-title {
		font-size: 16px;
		margin-bottom: 15px;
	}
	
	.main-wrap .business-section .business-category .category-item {
		font-size: 28px;
	}
	
	.main-wrap .business-section .product-images {
		height: auto;
	}
	
	.main-wrap .business-section .product-label {
		font-size: 18px;
		padding: 12px;
	}

	.main-wrap .business-section .business-container {
		padding: 30px 0;
	}
	
	/* Notice Section */
	.main-wrap .notice-section {
		padding: 40px 0;
	}
	
	.main-wrap .notice-section .notice-list {
		grid-template-columns: 1fr;
		gap: 15px;
	}
	
	.main-wrap .notice-section .notice-item .notice-title {
		font-size: 18px;
	}
	
	.main-wrap .notice-section .notice-item .notice-desc {
		font-size: 16px;
	}
	
	.main-wrap .notice-section .notice-item .notice-date {
		font-size: 16px;
	}
	
	/* Recruit Section */
	.main-wrap .recruit-section {
		height: 300px;
	}
	
	.main-wrap .recruit-section .recruit-bg::after {
		font-size: 80px;
		bottom: -10px;
	}
}

@media screen and (max-width: 360px) {
	.main-wrap .company-section .content-blocks {
		grid-template-columns: 1fr;
	}
}


