@charset "utf-8";
/* *******************************************************
 * filename : responsive.css
 * description : 전체 반응형 CSS (layout + content + main)
 * date : 2026.09.09
******************************************************** */


/* ================================================================
 * LAYOUT RESPONSIVE
================================================================ */

/* --------------------------------------------------------
 * SETTING
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	:root {
		--header-top: 0;
		--area-width: 1200px;
		--area-padding: 40px;
	}
}
@media all and (max-width: 1280px) {
	:root {
		--header-height: 60px;		
	}
}
@media all and (max-width: 1025px) {
	:root {
		--area-padding: 40px;
	}
}
@media all and (max-width: 800px) {
	:root {
		--area-padding: 24px;
	}
}

/* --------------------------------------------------------
 * FONT SIZE
-------------------------------------------------------- */
@media all and (max-width: 1536px) {
	html { font-size: 0.6510vw; } /* 10px */
}
@media all and (max-width: 1280px) {
	html { font-size: 0.8594vw; } /* 11px */
}
@media all and (max-width: 800px) {
	html { font-size: 1.375vw; }
}
@media all and (max-width: 640px) {
	html { font-size: 1.7188vw; }
}
@media all and (max-width: 480px) {
	html { font-size: 2.2vw; }
}
@media all and (max-width: 412px) {
	html { font-size: 2.4272vw; }
}
@media all and (max-width: 390px) {
	html { font-size: 2.1795vw; } /* 8.5px */
}

/* --------------------------------------------------------
 * LAYOUT :: 공통 클래스
-------------------------------------------------------- */
@media all and (max-width: 1900px) {
	.area-wide { padding: 0 var(--area-padding); max-width: none; }
}
@media all and (max-width: 1660px) {
	.area-box {padding: 120px 40px; max-width: 100%; width: 100%;}	
}
@media all and (max-width: 1500px) {
	.area { padding: 0 var(--area-padding); max-width: none; }
}
@media all and (max-width: 1440px) {
	.area,
	.area-sub { padding: 0 40px; max-width: none;}
}
@media all and (max-width: 1280px) {
	.area-box {padding: 80px 40px;}	
}
@media all and (max-width: 800px) {
	.area-box, .area, .area-sub {width: 100%; max-width: none; padding: 40px 24px;}
}

/* --------------------------------------------------------
 * LAYOUT :: HEADER
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	#headerInner { padding: 0 40px; }
	#gnb ul {display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: nowrap;}
	#gnb > ul > li > a {min-width: 100px;}
	#gnb-2dep-panel .gnb-2dep-col {min-width: 100px;}
	#gnb > ul > li:before {left: 0;}
	.header-util-box {width: 160px;}
	#gnb-2dep-panel .gnb-2dep-inner {justify-content: center; padding: 40px 0 40px 36px; gap: 40px;}
}
@media all and (max-width: 1366px) {
	/* #gnb > ul > li > a {min-width: 120px;}
	#gnb-2dep-panel .gnb-2dep-col {min-width: 120px;} */
	#gnb > ul > li > a { font-size: 18px;}
	#gnb > ul > li .gnb-2dep ul li a { font-size: 14px; }
	#gnb > ul > li:before {left: 36px;}
	#gnb-2dep-panel .gnb-2dep-inner {width: calc(100% - 400px); padding: 40px 60px;}
}
@media all and (max-width: 1280px) {
	#headerInner {height: 60px;}
	#headerInnerWrap { position: absolute; top: 0; height: 60px;}
	#header .logo a {height: 48px;}
	/* #header.scrolled #headerInnerWrap { background-color: rgba(5,8,20,0.88); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 2px 24px rgba(0,0,0,0.45); } */
	.header-lang-list { display: none; }
	#gnb { display: none; }
	.gnb-overlay-bg { display: none; }
}
@media all and (max-width: 1024px) {
	.header-util-box .user-info { display: none; }
}
@media all and (max-width: 800px) {
	#headerInner {padding: 0 24px;}
	#header .logo a {height: 40px;}
}
/* --------------------------------------------------------
 * LAYOUT :: FOOTER
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	.to-top-btn,
	.footer-quick-menu { right: var(--area-padding); }
	.footer-inner-con {padding: 40px;}
	.footer-left-con {gap: 40px;}
}
@media all and (max-width: 1400px) {
	.footer-right-con {width: 40%;}
	.footer-quick-con {width: 100%; flex-direction: column-reverse; align-items: flex-end; margin-bottom: 0;}
	.certificationMark-list {width: 100%; flex-wrap: wrap; gap: 16px;}
	.certificationMark-list img {max-height: 40px;}
	.foot-menu {display: flex; flex-wrap: nowrap;}
}
@media all and (max-width: 1280px) {
	.footer-right-con {width: 30%;}
	.footer-address-list { margin-left: 0; margin-bottom: 24px; }
	.footer-quick-menu a,
	.to-top-btn,
	.footer-quick-con .quick-menu-btn {width: 50px; height: 50px; line-height: 50px;}
	.footer-quick-menu a span {font-size: 16px; left: 50px;}
	.footer-quick-menu a:hover {padding: 0 110px 0 20px;}
	.footer-quick-menu a i,
	.to-top-btn i,
	.footer-quick-con .quick-menu-btn i {font-size: 20px; line-height: 50px;}
	.foot-logo {padding-bottom: 24px; width: 120px;}
	.footer-address-list dl {line-height: 1.6; font-size: 14px;}
	.footer-address-list dl dt,
	.footer-address-list dl:nth-child(2) dt, 
	.footer-address-list dl:nth-child(3) dt {width: auto; min-width: auto;}
	.foot-menu li a {font-size: 14px;}
	.footer-copyright {font-size: 12px;}
}
@media all and (max-width: 800px) {
	.footer-inner-con { display: block; padding: 24px;}
	.to-top-btn { width: 48px; height: 48px; }
	.to-top-btn.bottom-fixed { bottom: 20px; }
	.to-top-btn.footer-fixed { bottom: 140px; }
	.to-top-btn i { line-height: 48px; font-size: 20px; }
	.footer-quick-menu a { width: 48px; height: 48px; line-height: 48px; border-radius: 48px;}
	.footer-quick-menu a:before { border-radius: 48px; }
	.footer-quick-menu a i { line-height: 48px; font-size: 20px; }
	.footer-quick-menu a:hover { padding: 0 110px 0 20px; }
	.footer-quick-menu.bottom-fixed { bottom: 70px; }
	.footer-quick-menu.footer-fixed { bottom: 100px; }
	.footer-right-con { width: 100%; float: none; display: flex; flex-direction: column-reverse; justify-content: center; align-items: center; gap: 16px; }
	.footer-inner-con { padding: 24px 24px 60px; display: flex; gap: 24px; flex-direction: column-reverse; align-items: flex-start; justify-content: flex-start; border-radius: 36px 36px 0 0; }
	.foot-logo {padding-bottom: 24px; margin: 0 auto; }
	.footer-address-info-box { margin-bottom: 24px; }
	.footer-address-list strong { font-size: 18px; margin-bottom: 1.40px; }
	.footer-right-middle {width: 100%;}
	.footer-right-middle:after { display: none; }	
	.foot-menu {float: none; margin-left: 0; width: 100%; display: flex; align-items: center; justify-content: space-between;}
	.foot-menu li {flex:1; float: none; text-align: center; display: inline-block; padding: 0;}
	.footer-copyright { margin-top: 16px; font-size: 13px; }
	.footer-address-list dl dd {word-break: keep-all;}
	.footer-quick-con {flex-direction: row; justify-content: center; align-items: center;}
	.certificationMark-list {justify-content: flex-start;}
	.footer-quick-con .quick-menu-btn,
	.footer-quick-con .quick-menu-btn i {width: 48px; height: 48px; line-height: 48px;}
	.footer-left-con {gap: 24px;}
}
@media all and (max-width: 600px) {
	.footer-left-con {flex-direction: column; justify-content: center; align-items: center; width: 100%;}
	.foot-logo {float: none; padding-bottom: 0;}
	.footer-quick-con .quick-menu-btn {width: 48px; height: 48px;}
	.footer-copyright {text-align: center;}
	.footer-quick-con {align-items: flex-start;}
	.footer-address-list {margin-bottom: 0; width: 100%;}
}
@media all and (max-width: 400px) {
	.footer-address-list dl dt {display: none;}
	.footer-address-list dl dd {padding-right: 16px; white-space: nowrap;}
}


/* --------------------------------------------------------
 * LAYOUT :: SUB LAYOUT
-------------------------------------------------------- */
@media all and (max-width: 1280px) {
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt1 {font-size: 40px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt1 b {font-size: 40px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt2 {font-size: 16px;}
}
@media all and (max-width: 800px) {
}


/* ================================================================
 * MAIN RESPONSIVE
================================================================ */

/* --------------------------------------------------------
 * 메인 비주얼
-------------------------------------------------------- */

@media all and (max-width: 1367px) {
	.main-visual-txt-item .main-visual-txt1 b {font-size: 56px;}
	.main-visual-txt-item .main-visual-txt2 {font-size: 48px;}
}
@media all and (max-width: 1280px) {
	#mainVisual { height: 100vh; height: 100dvh; }
	.main-visual-txt-item .main-visual-txt1 b { font-size: 40px; }
	.main-visual-txt-item .main-visual-txt2 { font-size: 36px; }
	.main-visual-txt-item .main-visual-txt3 {font-size: 20px; font-weight: 500;}	
}
@media all and (max-width: 800px) {
	#mainVisual { height: 100vh; height: 100dvh; }
	.main-visual-overlay { padding-bottom: 30px; }
	.main-visual-slide-txt { padding-bottom: 60px; }
	.main-visual-txt-item .main-visual-txt1 b { font-size: 36px; }
	.main-visual-txt-item .main-visual-txt2 { font-size: 24px; word-break: keep-all; width: 80%;}
	.main-visual-txt-item .main-visual-txt3 {font-size: 16px;}	
	.main-visual-pagination .swiper-pagination-bullet {width: 60px !important;}
	.main-visual-pc-img { display: none !important; }
	.main-visual-m-img { display: block !important; opacity: 1; }
	.main-visual-video-bg video { object-position: right center; }
}
@media all and (max-width: 600px) {
	.main-visual-txt-item .main-visual-txt1 b { font-size: 28px; word-break: keep-all; width: 80%; white-space: unset }
	.main-visual-pagination .swiper-pagination-bullet {flex: 1;}
}


/* --------------------------------------------------------
 * 메인 컨텐츠 :: 공통 타이틀 / 버튼
-------------------------------------------------------- */
@media all and (max-width: 1367px) {
	.main-tit-box .main-tit {font-size: 40px;}	
}
@media all and (max-width: 1280px) {	
	#mainContent > article {min-height: auto;}
	.main-tit-box .main-tit { font-size: 32px; margin-bottom: 16px;}
	.btn.more {height: 44px; line-height: 44px; font-size: 15px;}
}
@media all and (max-width: 800px) {
	.main-tit-box .main-tit { font-size: 24px; }
	.main-tit-box .main-sub-tit { font-size: 18px; }
	.main-btn { width: 21rem; height: 50px; margin-top: 24px; }
	.main-btn .txt { font-size: 16px; }
}
@media all and (max-width: 600px) {
	.main-tit-box .main-tit {font-size: 24px; line-height: 1.4;}
	.main-tit-box .main-tit span {display: block;}
}


/* --------------------------------------------------------
 * 메인 컨텐츠1
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	.main-con01 { padding: 100px 100px 100px; }
	.main-con01-txt .text {font-size: 32px;}	
	#mainContent3 > .area-box {padding: 0 40px !important;}
}
@media all and (max-width: 1280px) {
	.main-con01 {padding: 80px 40px;}
	.main-con01 .main-sub-tit {font-size: 20px;}
	.main-con01-txt .text.text01 {font-size: 40px;}
	.main-con01-txt .text.text02 {font-size: 20px; line-height: 1.6;}
	.main-con01-count-box {gap: 40px; padding:24px 40px;}
	.main-count-list .count-num-box {transform: scale(0.8);}
	.main-count-list .count-unit {height: auto;}
	.main-count-list .count-unit i {font-size: 24px;}
	.main-count-list li > p {font-size: 16px;}
	.main-con01-count-box.animated .main-count-list > li:nth-child(4) {display: none;}
}
@media all and (max-width: 800px) {
	.main-con01 { padding: 80px var(--area-padding); text-align: center; }
	.main-con01-txt .text { font-size: 18px; max-width: 80%; margin: 0 auto; }
	.main-con01 .main-sub-tit { font-size: 24px;}
	.main-con01-count-box.animated .main-count-list > li:nth-child(3) {display: none;}
	.main-history-btn {padding: 24px; width: auto;}
	.main-con01-txt .text.text01 {font-size: 32px;}
	.main-con01-txt .text.text02 {font-size: 16px;}
	.main-count-list .count-num-box {transform: scale(0.6);}
	.main-con01 .main-sub-tit {font-size: 16px;}
}
@media all and (max-width: 600px) {
	.main-con01 .main-sub-tit {margin-bottom: 24px;}
	.main-con01-count-box {gap: 16px; padding: 24px;}
	.main-con01-count-box.animated .main-count-list > li:nth-child(2) {display: none;}
}

/* --------------------------------------------------------
 * 메인 컨텐츠2 (Full-Stack AI)
-------------------------------------------------------- */
@media all and (max-width: 1660px) {	
	.main-con02-inner {gap: 40px;}	
}
@media all and (max-width: 1280px) {	
	.main-ai-list-con { width: 520px; height: 520px; }
	.main-ai-list {width: 80%; height: 80%;}
	.main-ai-txt-wrap { width: calc(100% - 520px); box-sizing: border-box; }
	.main-ai-list-con:before { border-radius: 100px; }
	.main-btn {height: 48px; margin-top: 24px;}
	.main-btn .txt {font-size: 15px;}
	.main-tit-box .main-txt02 {font-size: 16px;}
	.main-tit-box .main-txt02 + .main-txt02 {margin-top: 0;}
	.main-tit-box .main-txt02 br {display: none;}
	.main-ai-list-con .inner-txt .tit {font-size: 32px;}
	.main-tit-box .main-sub-tit,
	.main-ai-list-con .inner-txt span {font-size: 16px;}
	.main-products__cont-area .main-sub-tit, #mainContent5 .main-tit-box .main-sub-tit {font-size: 16px;}
	.main-ai-list li strong {font-size: 14px;}
	.main-con02-inner .main-ai-txt-wrap .main-tit-box .main-ai-txt-con .badge-list {flex-wrap: wrap; gap: 8px; margin-top: 16px;}
	.main-con02.animated .main-ai-txt-wrap {min-width: auto;}
	.main-con02-inner .btn.more {position: absolute; bottom: -80px;}
}
@media all and (max-width: 800px) {
	.main-con02-inner { flex-direction: column-reverse; align-items: start; justify-content: start; }
	.main-ai-list-con { width: 100%; height: 0; padding-top: 100%; max-width: 100%; margin-top: 24px;}
	.main-ai-list-con:before { border-radius: 60px; transform: scale(1.1);}
	.animated .main-ai-txt-wrap { width: 100%; min-width: 100%; padding-left: 0;}
	.main-ai-list { position: absolute; width: calc(100% - 160px); height: calc(100% - 160px); top: 80px; left: 80px; }
	.main-ai-list li .icon-box { width: 48px; height: 48px; margin: 0 auto; }
	.main-ai-list li .icon-box svg { max-width: 100%; max-height: 100%; }
	.main-ai-list li strong { font-size: 14px; }
	.partner-cta .main-btn {margin: 24px 0;}
	.main-tit-box .main-txt02 {margin: 16px 0 0; width: 80%;}
	.main-tit-box .main-sub-tit {font-size: 16px; margin-bottom: 8px;}
}
@media all and (max-width: 640px) {
	.main-ai-list { width: calc(100% - 10.60px); height: calc(100% - 10.60px); top: 5.30px; left: 5.30px; }
	.main-ai-list:before {background-size: 80%;}
	.main-ai-list li.item01 { top: 40px; left: 40px; }
	.main-ai-list li.item02 { top: 40px; right: 40px; }
	.main-ai-list li.item03 { bottom: 40px; right: 40px; }
	.main-ai-list li.item04 { bottom: 40px; left: 40px; }
	.main-tit-box .main-txt02 {word-break: keep-all; width: 100%;}
	.main-ai-txt-pc {height: 180px;}
	#mainContent5 .main-ai-txt-pc {width: 100%;}
}
@media all and (max-width: 480px) {
	.main-ai-list li {width: 120px; height: 120px;}
	.animated .main-ai-list-con:before {transform: scale(1.1);}
	.main-ai-list li.item01 { top: 20px; left: 20px; }
	.main-ai-list li.item02 { top: 20px; right: 20px; }
	.main-ai-list li.item03 { bottom: 20px; right: 20px; }
	.main-ai-list li.item04 { bottom: 20px; left: 20px; }
}

/* --------------------------------------------------------
 * 메인 컨텐츠3
-------------------------------------------------------- */
@media all and (max-width: 1367px) {
	.main-con03 .left-con {width: 36%;}
	.main-con03 .right-con { width: 64%;}
}
@media all and (max-width: 1280px) {
	#mainContent3 { padding: 80px 0; }
	.main-con03 { display: block; }
	.main-con03 .left-con { width: 100%; margin-bottom: 40px; }
	.main-con03 .left-con .main-tit-box { width: 100%; text-align: center; }
	.main-con03 .left-con .main-btn {margin: 24px auto;}
	.main-con03 .right-con { width: 100%; }
	.main-con03-list li .icon-box {margin: 24px auto 0;}
}
@media all and (max-width: 800px) {
	#mainContent3 { padding: 80px 0; }
	.main-con03-list { gap: 16px; width: 100%; margin: 0 auto; }
	.main-con03-list li { position: relative; margin: 0; width: 100%; padding: 24px; border-radius: 24px; }
	.main-con03-list li .icon-box { position: absolute; left: auto; right: 24px; top: 24px; margin: 0; width: 60px; height: 60px; }
	.main-con03 .right-con li .tit-box strong {margin-top: 16px; font-size: 20px;}
	.main-con03-list li .tit-box p {margin-top: 16px; font-size: 14px;}
	.badge, .badge-group .badge {font-size: 12px; padding: 6px 12px;}
}
@media all and (max-width: 600px) {
	#mainContent3 {padding: 40px 0;}
}

/* --------------------------------------------------------
 * 메인 컨텐츠4
-------------------------------------------------------- */
@media all and (max-width: 1367px) {
	.main-con04-box {padding: 40px;}
	.main-con04-box:before {border-radius: 24px;}
}
@media all and (max-width: 1280px) {
	#mainContent4 {padding: 80px 0;}
	.main-con04 .main-tit-box {margin-bottom: 40px;}
	.main-con04-box {padding: 40px;}
	.main-application-list {gap: 24px;}
	.main-con04-box .video-area {min-height: 47rem;}
}
@media all and (max-width: 1024px) {
	.main-con04-box .video-area {min-height: auto;}        
	.main-con04-box .video-area video {position: relative; width: 100%; height: 100%; left: 0; top: 0; right: 0;}
	.main-application-list li {min-width: 40%;}
}
@media all and (max-width: 800px) {
	.main-con04 .main-tit-box {margin-bottom: 24px;}
	.main-con04-box {padding: 24px;}
	.main-application-list {width: 100%; flex-wrap: wrap;}
	.main-con04-box.animated .main-application-list li {min-width: calc(50% - 13px);}
	.main-con04-box .video-area {border-radius: 24px;}
	.main-con04-box.animated:before {border-radius: 24px;}
	.main-application-list li .badge {white-space: unset}
}
@media all and (max-width: 500px) {
	#mainContent4 {padding: 40px 0;}
	.main-con04 .main-tit-box {margin-bottom: 0;}
	.main-application-list {width: 100%; flex-wrap: wrap; flex-direction: column;}
	.main-con04-box.animated .main-application-list li {min-width: 100%;}
	.main-application-list li p {font-size: 16px;}
}
/* --------------------------------------------------------
 * 메인 컨텐츠5
-------------------------------------------------------- */
@media all and (max-width: 1367px) {
	#mainContent5 .main-tit-box .main-tit {font-size: 40px;}
}
@media all and (max-width: 1280px) {
	#mainContent5 {padding: 80px 0;}
	#mainContent5 .main-tit-box .main-tit {font-size: 32px; line-height: 1.4;}
	#mainContent5 .main-tit-box .main-txt01 {font-size: 20px; margin-bottom: 8px;}
	#mainContent5 .main-tit-box .main-txt02 {font-size: 16px;}
}
@media all and (max-width: 800px) {
	#mainContent5 {padding: 40px 0;}
	#mainContent5 .main-tit-box .main-sub-tit {font-size: 16px; font-weight: 500;}
	#mainContent5 .main-tit-box .main-tit {font-size: 24px; margin-bottom: 0;}
	.main-ai-txt-pc {position: relative; height: auto; margin: 16px 0; width: 100%;}
	/* .main-con02-inner .main-ai-txt-wrap .main-tit-box .main-ai-txt-pc {min-height: auto;}
	.main-ai-txt-con {width: 100%; position: relative; top: 0;} */
	.main-con02-inner .btn.more {position: relative; bottom: -24px;}
}


/* --------------------------------------------------------
 * 메인 컨텐츠6
-------------------------------------------------------- */
@media all and (max-width: 1367px) {
	.main-con06 .right-con {padding-left: 40px;}
}
@media all and (max-width: 1280px) {
	#mainContent6 {padding: 80px 0;}
	.main-con06 {flex-direction: column; align-items: center; justify-content: center; gap: 40px}
	.main-con06 .left-con,
	.main-con06 .right-con {width: 100%; text-align: center;}
	.main-con06 .right-con {padding-left: 0;}
	.main-con06 .main-btn {margin: 24px auto;}
	.main-con06-list li a .icon-box {position: relative; margin: 40px auto 0; bottom: auto; right: auto;}
}
@media all and (max-width: 800px) {
	.main-con06 .main-tit-box { text-align: center; }
	.main-con06-list {margin: 0 auto; flex-wrap: wrap;}
	.main-con06-list li {min-width: 40%; margin: 0;}
	.main-con06-list li a {padding: 24px;}	
	.main-con06-list li a .tit-box p {font-size: 14px;}
	.main-con06-list li a .tit-box strong {font-size: 20px;}
}
@media all and (max-width: 600px) {
	#mainContent6 {padding: 40px 0;}
	.main-con06 {gap: 24px;}
	.main-con06-list li {min-width: 100%; min-height: 280px;}
	.main-con06-list li a .icon-box {margin: 24px auto 0;}
}	
/* --------------------------------------------------------
 * 메인 main-products
-------------------------------------------------------- */
@media all and (max-width: 1800px) {
	#mainContent > article.main-products {min-height: 1000px;}	
}
@media all and (max-width: 1367px) {
	.main-products__panel-title {font-size: 40px;}
	.main-products__cont-area .txt02 {width: 80%;}
	.main-products__btn-area {transform: translateY(-55%); padding: 0 40px 40px;}
	.main-products__panel .swiper-slide {width: 360px; height: 425px;}
	.main-products__card  {width: 100%; height: 100%;}
	.main-products__slider-wrap {margin-top: 40px;}
}
@media all and (max-width: 1280px) {
	#mainContent > article.main-products {min-height: 860px;}
	.main-products__btn-area {transform: none;  padding: 0 40px; position: relative; top: 80px; left: 0; right: 0; width: 100%;}
	.main-products__tab-list {flex-direction: row; align-items: center; justify-content: flex-start;}
	.main-products__tab-list li button {min-width: unset; font-size: 16px;}
	.main-products__panel-inner {margin: 100px 0 0 40px;}
	.main-products__panel-title {font-size: 32px;}
	.main-products__cont-area .txt02 {font-size: 16px;}
	.main-products__panel .swiper-slide {width: 300px; height: 355px;}
	.main-products__card-text {padding: 0;}
	.main-products__card {gap: 16px;}
}
@media all and (max-width: 900px) {
	#mainContent > article.main-products {min-height: 800px;}
}
@media all and (max-width: 800px) {
	.main-products__btn-area {top: 40px;}
	.main-products__panel-title {font-size: 24px;}
	.main-products__tab-list li button {font-size: 14px; padding: 8px 16px;}
	.main-products__panel-inner {margin: 60px 0 0 40px;}
	.main-products__cont-area .txt02 {font-size: 14px;}
	.btn.more {font-size: 15px; width: 140px;}
	.btn.more i {font-size: 16px;}
}
@media all and (max-width: 600px) {
	.main-products__card-text .card-title {font-size: 16px;}
	.main-products__panel-inner {margin: 40px 0 0 24px;}
	.main-products__cont-area .txt02 {width: 100%;}
	.main-products__btn-area {padding: 0 24px;}
	.main-products__tab-list li button {font-size: 13px; padding: 8px 12px;}
}
/* --------------------------------------------------------
 * 메인 컨텐츠7
-------------------------------------------------------- */
@media all and (max-width: 1280px) {
	#mainContent7 {padding: 80px 0;}
	.main-con07 { display: block; }
	.main-con07 .left-con { width: 100%; margin-bottom: 50px; }
	.main-con07 .right-con { width: 100%; }
	.main-con07-tit-con .tit {font-size: 48px; width: auto; padding-right: 16px;}
	.main-con07-tit-con .txt-box .txt01 {font-size: 28px;}
	.main-con07-tit-con .txt-box .txt02 {font-size: 16px;}
	.main-con07-box {padding: 40px;}
	.custom-select-value {font-size: 14px;}
	.inquiry-form input[type="text"], .inquiry-form input[type="tel"], .inquiry-form input[type="email"], .inquiry-form select {font-size: 14px; height: 40px;}
	.inquiry-form textarea {font-size: 14px;}
	.inquiry-form label {font-size: 12px;}
	.submit-btn {height: 48px;}
	.submit-btn-inner {padding: 0 24px;}
	.submit-btn .txt {font-size: 14px;}
	.main-con07-tit-con {margin-bottom: 40px;}
	.main-con07-box:before {border-radius: 40px;}
	.privacy-check .checkmark {width: 16px; height: 16px;}
	.main-con07-tit-con .txt-box {padding-left: 24px;}
}
@media all and (max-width: 800px) {
	.main-con07-tit-con {display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center;}
	.main-con07-tit-con .txt-box {width: 100%; padding: 0;}
	.main-con07-tit-con .txt-box:before,
	.main-con07-tit-con .txt-box:after {display: none;}
	.main-con07-tit-con .tit { font-size: 40px; width: 100%;}
	.main-con07-tit-con .txt-box .txt01 { font-size: 24px; }
	.main-con07-box { padding: 24px; }
	.inquiry-form .form-row {flex-direction: column;}
	.inquiry-form .form-bottom {flex-direction: column;}
	.main-con07-tit-con {margin-bottom: 24px;}
	.main-con07-box:before {border-radius: 24px;}	
}
@media all and (max-width: 600px) {
	#mainContent7 {padding: 40px 0;}
	.main-con07-tit-con .tit { font-size: 32px; }
	.main-con07-tit-con .txt-box .txt02 {margin: 16px auto; word-break: keep-all; font-size: 14px;}
	.main-con07-tit-con .txt-box .txt02 br {display: none;}
	.main-con07-tit-con {gap: 16px;}
	.main-con07-tit-con .txt-box .txt01 {font-size: 20px;}
	.privacy-check .txt {font-size: 14px;}
	.privacy-check {align-items: flex-start; line-height: 1.4;}
}

/* --------------------------------------------------------
 * 메인 컨텐츠8
-------------------------------------------------------- */
@media all and (max-width: 1280px) {
	#mainContent8 {padding: 80px 0; min-height: 40rem !important;}
	.main-partners-wrap {position: relative; padding: 0;}
	.main-con08 .main-tit-box {padding-bottom: 40px;}
}
@media all and (max-width: 900px) {
	.main-partners-list .partner-inner > span img {
		/* max-width: 200px; height: auto !important;  */
		max-height: 40px;
	}
}
@media all and (max-width: 800px) {
	#mainContent8 {padding: 40px 0; min-height: 320px !important;}
	.main-con08 .main-tit-box {padding-bottom: 24px;}
	.main-partners-list .partner-inner > span img {max-height: 36px;}
}

/* ================================================================
 * CONTENT RESPONSIVE
================================================================ */

/* --------------------------------------------------------
 * 메인 :: 헤더 진입 애니메이션 (min-width: 1281px)
-------------------------------------------------------- */
@media all and (min-width:1281px){
	.main-wrap #header{opacity:0; transform:translateY(-100%); transition:transform 0.8s ease, opacity 0.8s ease; transition-delay:0.2s;}
	.main-wrap #header.main-start{opacity:1; transform:translateY(0); }
}


/* --------------------------------------------------------
 * 제품 :: Highlights 스와이퍼
-------------------------------------------------------- */
@media (max-width: 1068px) {
	.section-title { font-size: 36px; }
	.highlights-swiper { padding: 0 40px !important; }
	.highlights-swiper .swiper-slide { width: 680px; height: 420px; }
}
@media (max-width: 734px) {
	.section-header { padding: 0 20px; flex-direction: column; gap: 12px; }
	.section-title { font-size: 28px; }
	.highlights-swiper { padding: 0 20px !important; }
	.highlights-swiper .swiper-slide { width: calc(100vw - 48px); height: 360px; }
	.card-caption { padding: 24px 28px; }
	.card-caption .headline { font-size: 18px; }
	.text-dotnav li button .dot-label { display: none; }
}
@media all and (max-width: 800px) {
	.highlights-section { padding-bottom: 40px; }
	.section-header { padding: 0 var(--area-padding); flex-direction: column; gap: 0; }
	.section-title { font-size: 32px; }
	.sub-txt { font-size: 16px; }
	.highlights-swiper { padding: 0 var(--area-padding) !important; }
	.highlights-swiper .swiper-slide { width: calc(100vw - (2 * var(--area-padding))); height: 30rem; border-radius: 24px; }
	.card-caption { padding: 24px; }
	.card-caption .headline { font-size: 14px; line-height: 1.5; }
	.card-caption .headline .highlight { font-size: 16px; margin-bottom: 6px; }
	.gallery-controls { margin-top: 20px; }
	.text-dotnav li button .dot-label { display: none; }
	.text-dotnav li button .dot-circle {width: 8px; height: 8px;}
	.play-pause-btn {margin-left: 0;}
}
@media all and (max-width: 640px) {
	.highlights-swiper .swiper-slide { height: 260px; }
	.card-caption { padding: 24px; }
	.card-caption.bottom-left {bottom: 24px; left: 24px;}
	.card-caption .headline { font-size: 14px; }
	.card-caption .headline .highlight { font-size: 18px; }
}
@media all and (max-width: 480px) {
	.highlights-swiper .swiper-slide { height: 220px; }
	.card-caption { padding: 16px; }
	.card-caption .headline { font-size: 13px; }
	.card-caption .headline .highlight { font-size: 16px; }
}

/* --------------------------------------------------------
 * 제품 :: Features 뷰어
-------------------------------------------------------- */
@media (max-width: 768px) {
	.viewer-card {grid-template-columns: 1fr;	grid-template-rows: 1fr auto; height: auto;}
	.image-panel {order: -1; min-height: 40rem; border-radius: 24px; overflow: hidden;}
	.image-panel img {border-radius: 24px;}
	.image-panel::before {display: none;}
	.feature-panel {padding: 0;}
	.nav-arrows {flex-direction: row; position: static; transform: none; justify-content: center; margin: 24px auto 16px;}
}

/* --------------------------------------------------------
 * sitemap
-------------------------------------------------------- */
/* 버튼 ripple 효과 (PC only) */
@media all and (min-width:801px) {
	.cm-fill-btn .cm-fill {
		position: absolute;
		display: block;
		width: 0px;
		height: 0px;
		transform: translate(-50%,-50%);
		border-radius: 50%;
		background: #fff;
		transition: width 0.5s ease-out, height 0.5s ease-out;
	}
	.cm-fill-btn:hover .cm-fill {
		width: 40vw;
		height: 40vw;
		transition: width 0.5s ease-in 0.1s, height 0.5s ease-in 0.1s;
	}
}

/* 사이트맵 hover (포인터 디바이스) */
@media (hover: hover) {	
	.sitemap-wrapper-style > ul > li .sitemap-2dep:hover a {opacity: 0.4;}
	.sitemap-wrapper-style > ul > li .sitemap-2dep:hover a:hover {opacity: 1.0; color: #fff;}	
}
@media all and (max-width:1367px) {
	.sitemap-wrapper-style > ul > li > h2 {font-size: 36px;}
}
@media all and (max-width: 1280px) {
	.sitemap-line-btn {width: 40px; height: 40px;}
	.sitemap-line-btn .dot {margin: -20px 0 0 -20px;}
	.sitemap-line-btn .dot i {font-size: 40px;}
	.sitemap-wrapper-style > ul {justify-content: center; gap: 80px;}
	.sitemap-wrapper-style > ul > li > h2 {font-size: 28px;}
	.sitemap-wrapper-style > ul > li .sitemap-2dep a {font-size: 16px;}
}
/* 사이트맵 모바일 1024px 이하 */
@media all and (max-width: 1024px) {
	.sitemap-container .sitemap-area {display: flex; flex-direction: column-reverse; padding-top: 40px;}
	.sitemap-inner {padding: 2em 0; vertical-align: top;}
	.sitemap-wrapper-style { margin-top: 24px; }
	.sitemap-wrapper-style > ul { display: block; }
	.sitemap-wrapper-style > ul > li:before {top: 0;}
	.sitemap-wrapper-style > ul > li { float: none; display: block; width: auto; padding: 16px 0; margin-bottom: 0; text-align: left; border-left: none; border-top: 1px solid rgba(255,255,255,0.1); }
	.sitemap-wrapper-style > ul > li:last-child { border-right: none; }
	.sitemap-wrapper-style > ul > li:first-child { border-top: none; }
	.sitemap-wrapper-style > ul > li > h2 { min-height: auto; font-size: 24px; margin-bottom: 8px;}
	.sitemap-wrapper-style > ul > li .sitemap-2dep { overflow: hidden; margin: 0 -1%; padding: 0; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li { float: left; position: relative; width: 31.33%; margin: 0 1%; word-break: keep-all; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li a { font-size: 16px; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li:before { position: absolute; top: 0px; left: 0; bottom: 0px; width: 1px; background-color: #eee; content: ""; display: none; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li:nth-child(3n+1) { clear: both; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep .gnb-3dep li { width: 98%; }	
	.sitemap-login-box {
		display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 0;
	}
	.sitemap-member-nick {margin-bottom: 0; font-size: 14px; display: flex; align-items: center;}
}
/* 사이트맵 모바일 480px 이하 */
@media all and (max-width: 480px) {
	.sitemap-wrapper-style > ul > li .sitemap-2dep a { font-size: 18px; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li { width: 100%}
	.sitemap-wrapper-style > ul > li .sitemap-2dep li:nth-child(3n+1) { clear: none; }
	.sitemap-wrapper-style > ul > li .sitemap-2dep li:nth-child(odd) { clear: both; }
	.sitemap-line-btn { width: 40px; height: 40px; }
	.sitemap-line-btn .dot { margin: -20px 0 0 -20px; }
	.sitemap-line-btn .dot i { font-size: 40px; }
}

/* --------------------------------------------------------
 * .privacy-modal-
-------------------------------------------------------- */
@media all and (max-width: 640px) {
	.privacy-modal-header {padding: 24px 24px 0;}
	.privacy-modal-body {margin: 24px;}
	.privacy-modal-title {font-size: 20px;}
	.privacy-modal-footer {padding: 0 24px 24px;}
}

/* --------------------------------------------------------
 * about
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	.about .company-section,
	.about .values-section  {padding: 20rem 80px;}
	.about .company-list {gap: 24px;}
	.about .company-list li {width: 200px; height: 200px; max-width: 200px;}
}
@media all and (max-width: 1280px) {
	.about .company-section,
	.about .values-section,
	.philosophy-section, 
	.business-section  {padding: 80px 40px;}
	.philosophy-section .area-box {padding: 0;}
	.philosophy-section.vision .values-list {grid-template-columns: repeat(2, 1fr); margin: 24px 0 0; gap: 24px;}
	.tit-box .tit,
	.company-section .tit-box .tit {font-size: 36px;}
	.tit-box .sub-tit {font-size: 16px;}
	.tit-box .txt {font-size: 16px; margin-top: 16px;}
	.company-body {margin-top: 40px; height: 400px;}
	.about .company-list {justify-content: center; gap: 16px; padding: 0;}
	.company-list li .text-box {font-size: 16px; text-align: center; line-height: 1.2;}
	.about .company-list li {width: 160px; height: 160px; max-width: 160px; gap: 16px}
	.company-body.animated .company-list li {min-width: 160px;}
	.company-list li .icon-box {width: 56px;}
	.philosophy-item, .business-item {padding: 24px 24px 32px; height: 400px;}
	.philosophy-img, .business-img {margin-bottom: 24px; border-radius: 24px;}
	.philosophy-txt, .business-txt {font-size: 16px; margin-bottom: 24px;}
	.mission .values-list {margin: 40px 0 0;}
	.badge, .badge-group .badge {padding: 4px 12px; font-size: 13px;}
	.values-list.animated .value-card {padding: 32px;}
	.values-list.animated .value-card .value-tit {font-size: 20px;}
	.values-list.animated .value-card .value-desc {font-size: 16px;}
	.location-info {top: auto; left: 40px; right: 40px; bottom: 80px; flex-direction: row; flex-wrap: wrap; padding: 24px;}
	.location-info .location-info-item {flex: 1; max-width: 25%; gap: 16px;}
	.location-info-txt dd {white-space: unset;}
	.location-con {min-height: 700px;}
	.location-map {min-height: 100%;}
}
@media all and (max-width: 1025px) {
	.about .company-section, .about .values-section, .philosophy-section, .business-section {padding: 80px 24px;}
	.about .company-body {display: flex; align-items: center; justify-content: center;}
	.about .company-list {flex-wrap: wrap; height: auto;}
	.values-list {grid-template-columns: repeat(2, 1fr);}
	.location-info-txt dt {font-size: 12px;}
	.location-info-txt dd {font-size: 14px;}
	.about .company-list li {width: 120px; height: 120px; max-width: 120px;}
	.company-body.animated .company-list li {min-width: 120px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt1 {font-size: 36px;}
}
@media all and (max-width: 800px) {
	.location-info .location-info-item {max-width: 50%; min-width: calc(50% - 16px);}
	.philosophy-con {grid-template-columns: 1fr; gap: 40px;}
	.location-info-txt dd span {margin-top: 0; }
	.tit-box .tit, .company-section .tit-box .tit {font-size: 24px;}
	.company-body {margin-top: 24px; height: 300px;}
	.mission .values-list {gap: 24px; display: flex; flex-direction: column;}	
	.values-list.animated .value-card {padding: 24px;}
	.philosophy-section.vision {padding: 40px 24px;}
	.history .company-section .tit-box .tit {font-size: 24px; margin-bottom: 16px;}
}
@media all and (max-width: 600px) {
	.about .company-section, .about .values-section, .philosophy-section, .business-section {padding: 40px 24px;}
	.philosophy-con {margin: 0;}
	.values-list {grid-template-columns: 1fr;}
	.location-info {display: none;}
	.location-con {min-height: 500px;}
	.values-list.animated .value-card .value-tit {font-size: 18px;}
	.values-list.animated .value-card .value-desc {font-size: 14px;}
	.philosophy-txt, .business-txt {font-size: 14px; margin-bottom: 16px;}
	.company-list li .text-box {font-size: 14px;}
	.about .company-list li {gap:8px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt1 {font-size: 24px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt1 b {font-size: 24px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt2 {font-size: 14px;}
	.sub-wrap #mainVisual .main-visual-txt-item .main-visual-txt2 br {display: none;}
	.philosophy-section.vision .values-list {grid-template-columns: repeat(1, 1fr);}
	.tit-box .txt {font-size: 14px;}
	.about-tab-nav {display: none;}
}

/* --------------------------------------------------------
 * history
-------------------------------------------------------- */
@media (max-width: 992px) {
	.history .list-area {margin: 0; padding: 40px 0 0;}
	.history .list-area .line-wrap,
	.history .list-area .list-item .dot {display: none}
	.history .list-area .list-item {flex-direction: column !important; gap: 24px;}
	.history .list-area .list-item+.list-item {margin-top: 40px;}
	.history .list-area .list-item .imageset {flex: none;	width: 100%; height: 24.8rem; aspect-ratio: unset}
	.history .list-area .list-item .desc {flex: none; width: 100%}
	.history .list-area .list-item .desc ul {margin-top: 16px;}
	.history .list-area .list-item .desc li {align-items: flex-start; line-height: 1.5;}
	.history .list-area .list-item .desc li+li {margin-top: 8px;}
	.history .list-area .list-item .desc li::before {margin-top: 12px;}
	.history .list-area .list-item .desc strong {font-size: 36px;}
}

/* --------------------------------------------------------
 * organization
-------------------------------------------------------- */
@media (max-width: 1280px) {
	.org-branch::after {display: none;}
	/* .org-branch::before {display: none;} */
	.org-dept-list {gap: 40px;}
	.org-dept-list > li {position: relative;}
	.org-dept-list > li:after {content: ""; position: absolute; top: -100px; left: 50%; right: calc(-50% - 40px); height: 1px; background-color: #fff;}
	.org-dept-list > li:last-child:after {display: none;}
}
@media (max-width: 992px) {
	.org-dept-list {gap: 100px 24px; grid-template-columns: repeat(2, 1fr);}
	.org-dept-list > li:after {right: calc(-50% - 24px);}
	.org-dept-list > li:nth-child(2):after {display: none;}
	.org-dept-list > li:nth-child(3):after {display: none;}
}
@media (max-width: 600px) {
	.organization {margin-top: 0;}
	.org-ceo-badge {width: 160px; height: 160px;}
	.org-dept-list {grid-template-columns: repeat(1, 1fr);}
	.org-dept-list > li:after {display: none;}
	
}

/* --------------------------------------------------------
 * certification
-------------------------------------------------------- */
@media (max-width: 1660px) {
	.solution.section02.bg-blue {padding: 200px 0 300px;}
	.solution.section02.bg-blue .area-box.flex-area {padding: 0 40px; align-items: flex-end;}
	.certification .section01 {padding: 80px var(--area-padding);}
	.container-start {margin-left: 40px;}
}
@media (max-width: 1500px) {
	.certification .section01 ul {grid-template-columns: repeat(3, 1fr); gap: 40px;}
}
@media (max-width: 1146px) {
	.solution.section02.bg-blue {padding: 80px 0 180px;}
	.solution-industry-swiper-wrap {margin-top: 40px;}
	.certification .section01 ul {margin-top: 40px; gap: 24px;}
	.certification .section01 ul li.card {min-width: auto; max-width: none; min-height: 380px;}
	.certification .section01 .card-flip-front:before {display: none;}
	.certification .section01 .card-flip-front .card-body {padding: 140px 0 24px;}
	.certification .section01 .patent .card-flip-front .medal {top: 0; height: 140px;}
	.certification .section01 .iso .card-flip-front .medal {top: 40px; height: 80px;}
	.certification .section01 .ce .card-flip-front .medal {top: 50px; height: 60px;}
	.solution-industry-swiper .solution-industry-item {padding: 24px;}
}
@media (max-width: 800px) {
	.certification .section01 {padding: 40px var(--area-padding);}
	.certification .section01 ul {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 540px) {
	.certification .section01 ul {grid-template-columns: 1fr;}
}

/* --------------------------------------------------------
 * solutions
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.solutions .solution {padding: 20rem 80px;}
	.partner-txt-swiper {width: 100%;}
	.partner-txt-swiper .swiper-slide {padding-right: 40px;}
	.partner-swiper-wrap {gap: 60px; margin-top: 40px; padding: 0; width: 100%;}
}
@media all and (max-width: 1360px) {
	.solutions .solution.section01 ul {flex-wrap: wrap; gap: 40px; justify-content: flex-start;}
	.solutions .solution.section01 ul li {min-width: calc(50% - 20px);}
}
@media all and (max-width: 1280px) {
	.solutions .solution {padding: 100px 80px;}
	.solutions .solution.section01 ul li .txt-area {padding: 24px;}
	.service-process .tit-box {margin-bottom: 40px;}
	.process-list {flex-wrap: wrap; gap: 24px;}
	.process-list .process-item {padding: 24px; flex:1; flex-shrink: 0; min-width: 280px;}
	.partner-cta .main-btn {width: 200px;}
}
@media all and (max-width: 1024px) {
	.solutions .solution {padding: 80px 40px;}
	.solution.section02.bg-blue .area-box {padding: 0 40px;}
	.solution.section05 {margin-bottom: -20px; padding-bottom: 80px !important;}
	.solution.section05 .area-box {padding: 0;}
	.container-start {margin-left: 40px;}
	.solution-row {grid-template-columns: 1fr; gap: 32px;}
	.solution-row-reverse .solution-media {order: 1;}
	.solution-row-reverse .solution-body {order: 2;}
	.solution-tagline {font-size: 24px;}
	.solution-industry-list {grid-template-columns: repeat(2, 1fr);}
	.why-vts-wrap {margin-top: 40px;}
	.why-vts-circle {width: 240px; height: 240px; font-size: 36px;}
	.why-vts-circle strong {font-size: 60px;}
	.why-vts-col-left,
	.why-vts-col-right {margin-top: 40px; gap: 40px;}
	.solution-brand {width: 120px;}
}
@media all and (max-width: 800px) {
	.solutions {padding: 0;}
	.solution-section {padding: 60px 0;}
	.solution.section02.bg-blue {padding: 40px 0 140px;}
	.solution-industry-section {padding: 40px 24px; border-radius: 30px;}
	.solution-cta-btns {flex-direction: column; align-items: center;}
	.solution-industry-swiper .swiper-slide {width: 78vw;}
	.solution-industry-swiper .solution-industry-item {padding: 32px 24px;}
	.solution-industry-nav {justify-content: center;}
	.partner-swiper-wrap {flex-direction: column; gap: 24px; margin-top: 24px;}
	#mainContent3 > .area-box {padding: 0 24px !important;}
	.partner-swiper-media {flex-basis: auto; max-width: 100%; width: 100%;}
	.partner-swiper-text {flex: none; width: 100%;}
	.solution-desc br {display: none;}
	.partner-swiper-wrap .icon-list {flex-wrap: wrap; gap: 24px;}
}
/* 768~1023px(태블릿): slidesPerView를 'auto'로 바꾸고(app.js) 폭을 280px로 고정 */
@media all and (max-width: 1023px) {
	.solution-industry-swiper .swiper-slide {width: 300px !important; flex-shrink: 0;}
}
@media all and (max-width: 600px) {
	.solutions .solution {padding: 40px 24px;}
	.solution.section02.bg-blue .area-box {padding: 0 24px; flex-direction: column; align-items: flex-start;}
	.solution-industry-swiper-wrap {MARGIN-TOP: 40px;}
	.container-start {margin-left: 24px;}
	.solution-industry-list {grid-template-columns: repeat(1, 1fr);}
	.solution-tagline {font-size: 24px;}	
	.solutions .solution.section01 ul {gap: 24px; flex-direction: column; margin-top: 40px; }
	.solution-industry-nav {width: 100%; margin-top: 24px; gap: 8px;}
	.tit-box .tit {font-size: 24px;}
	.solution-desc {font-size: 16px;}
	.solution-industry-item strong {font-size: 20px;}
	.process-tit {font-size: 20px;}
	.section05 .tit-box .txt {font-size: 16px;}	
}
/* --------------------------------------------------------
 * location
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.location-area {margin-top: 40px; gap: 40px;}
}
@media all and (max-width: 1280px) {
	.location-area {gap: 24px;}
}
@media all and (max-width: 1024px) {
	.location-area {gap: 24px;}
	.location-area .location-row {gap: 24px; flex-direction: column; position: relative;}
	.location-area .location-row > div {height: 400px;}
	.location-area .location-row .info-wrap {max-width: calc(50% - 12px);}
	.location-area .location-row .map-wrap iframe {min-height: 400px;}
	.location-area .location-row .info-wrap h3 {padding-bottom: 16px; font-size: 24px;}
	.location-area .location-row .info-wrap ul {margin-top: 16px;}	
	.location-area .location-row:last-child {flex-direction: column-reverse;}
	.location-area .location-row:last-child .info-wrap {position: absolute; top: -424px; right: 0;}
}
@media all and (max-width: 654px) {
	.location-area {margin-top: 24px;}
	.location-area .location-row .info-wrap {max-width: 100%; width: 100%;}
	.location-area .location-row:first-child {flex-direction: column-reverse;}
	.location-area .location-row:last-child .info-wrap {position: relative; top: 0; right: 0;}
	.location-area .location-row .info-wrap ul {margin-top: 8px;}
}
/* --------------------------------------------------------
 * product (사업분야/생산제품)
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.business .section {padding: 120px 40px;}
	.business .section01 .content-area {margin-top: 80px;}
	.business .product .section03 .area-box,
	.business .product .section04 .area-box {padding: 0;}
}
@media all and (max-width: 1280px) {
	.business .section {padding: 80px 40px;}
	.business .product .section01 .list-item {width: 100%; grid-template-columns: repeat(2, 1fr); gap: 40px;}
	.business .product .section02 .area-box {padding: 0;}
	.business .section02 .tit-box .tit {font-size: 32px;}
	.business .section02 .btn.more {margin-top: 40px;}	
	.business .content-area .title-wrap h3 {font-size: 24px;}
	.business .product .section03 .list-item,
	.business .product .section04 .list-item {flex-wrap: wrap; justify-content: flex-start;}
	.business .product .section03 .list-item li {padding: 24px; min-width: calc(50% - 20px); min-height: 280px;}
	.business .product .section04 .list-item li {min-width: calc(50% - 20px);}
}
@media all and (max-width: 800px) {
	.business .section {padding: 40px 24px;}
	.business .section01 .content-area {margin-top: 40px;}
	.business .section01 .tit-box.light .txt br {display: none;}
	.business .product .section01 .list-item {gap: 24px;}
	.business .product .section01 .list-item li {height: 360px; padding: 24px;}
	.business .product .section01 .list-item li .img-wrap {height: 70%;}
	.business .product .section01 .list-item li .text-wrap h4 {font-size: 20px;}
	.business .content-area .title-wrap p {font-size: 16px;}
	.business .section02 .tit-box .tit {font-size: 24px;}	
	.business .product .section03 .list-item,
	.business .product .section04 .list-item {margin-top: 24px; gap: 24px;}
	.business .product .section03 .list-item li {min-width: 100%;}
	.business .product .section04 .list-item li {min-width: 100%;}
}
@media all and (max-width: 600px) {
	.business .product .section01 .list-item {width: 100%; grid-template-columns: 1fr; margin-top: 24px;}
	.business .section02 .tit-box .tit {font-size: 20px;}
	.business .product .section03 .list-item li .icon {margin-bottom: 16px;}
}

/* --------------------------------------------------------
 * utility (사업분야/유틸리티)
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.business .utility .section02 .area-box {padding: 0;}
	.business .utility .section04 {padding: 120px 0 220px;}
	.business .utility .section04 .area-box {padding: 0 40px;}
	.business .utility .section04 .list-item {flex-wrap: wrap;}
	.business .utility .section04 .list-item > li {min-width: 288px;}
}
@media all and (max-width: 1280px) {
	.business .utility .section01 .list-item {gap: 24px;}
	.business .utility .section01 .list-item .card {padding: 24px 24px 36px;}
	.business .utility .section01 .list-item .card p {padding: 0; font-size: 16px;}
	.business .utility .section01 .list-item .card p br {display: none;}
	.business .utility .section01 .list-item .card .check-list {padding-left: 0;}
	.business .utility .section04 {padding: 80px 0 180px;}
	.business .utility .section04 .area-box {padding: 0 24px;}
	.business .utility .section04 .list-item {gap: 24px; margin-top: 24px;}
}
@media all and (max-width: 800px) {
	.business .utility .section01 .list-item {flex-direction: column; gap: 0;}
	.business .utility .section01 .list-item .card {margin-top: 24px;}
	.business .utility .section01 .list-item .card h3 {font-size: 24px;}
	.business .utility .section04 {padding: 40px 0 140px;}
	.business .utility .section04 .list-item > li .icon-box {width: 100px; height: 100px;}
	.business .utility .section04 .list-item > li h5 {font-size: 20px;}
}
@media all and (max-width: 400px) {
	.business .utility .section01 .tit-box.light .tit {width: 70%; margin: 16px auto;}
}

/* --------------------------------------------------------
 * automation (사업분야/공장 자동화)
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.business .automation .section02 .area-box {padding: 0;}
	.business .automation .section03 .area-box {padding: 0;}
	.business .automation .section03 .list-item {flex-wrap: wrap;}
	.business .automation .section03 .list-item > li {min-width: 280px;}
}
@media all and (max-width: 1280px) {
	.business .automation .section01 .list-item {gap: 24px; margin-top: 24px;}
	.business .automation .section01 .list-item > li .txt-area {padding: 24px 16px;}
	.business .automation .section03 .list-item {gap: 24px; margin-top: 24px;}
	
}
@media all and (max-width: 800px) {
	.business .automation .section01 .list-item {grid-template-columns: repeat(2, 1fr);}
}
@media all and (max-width: 600px) {
	.business .automation .section01 .list-item {grid-template-columns: 1fr;}
	.business .automation .section01 .list-item > li .txt-area p {margin-top: 8px;}
}

/* --------------------------------------------------------
 * Support :: Media 탭 + Swiper
-------------------------------------------------------- */
@media all and (max-width: 1600px) {
	.support .section,
	.support .section.area-box {padding: 120px 80px;}
}

@media all and (max-width: 1280px) {
	.support .section {padding: 80px 0;}
	.support .section.area-box {padding: 80px 40px;}
	.section01 .tab_btn {margin-top: 24px; flex-wrap: wrap; row-gap: 12px;}
	.section01 .tab_btn .scroll ul li button {height: 40px; padding: 0 24px; font-size: 14px;}
	.section01 .tab_btn .download-doc-nav {gap: 8px;}
	.section01 .tab_btn .download-doc-nav button {width: 40px; height: 40px; font-size: 16px;}
	.section01 .tab_con {margin-top: 32px;}
	.section01 .slider_wrap .swiper-slide {width: 260px; margin-right: 24px;}
	.section01 .slider_wrap .swiper-slide:has(.download-item) {width: 340px;}
	.download-item .text-area {padding: 0 24px 24px;}
	.download-item h4 {font-size: 20px;}
	.container-start {margin-left: 40px;}
	.resources-section .tit-box {margin-bottom: 40px;}
	.resource-dl-list {grid-template-columns: repeat(2, 1fr);}
	.list-technical {margin-top: 40px; flex-wrap: wrap; justify-content: flex-start;}
	.resource-dl-card-tit {font-size: 20px;}
	.list-technical li {min-width: calc(50% - 20px);}
	.news-item {gap: 16px; padding: 24px;}
	.faq-question {gap: 16px; padding: 24px 0;}
	.resource-dl-card-label {font-size: 14px;}
	.resource-dl-card-desc,
	.news-tit,
	.faq-q-tit {font-size: 16px;}
	.faq-q-mark {width: 24px; height: 24px;}
}
@media all and (max-width: 800px) {
	.support .section {padding: 40px 0;}
	.support .section.area-box {padding: 40px 24px;}
	.section01 .slider_wrap .swiper-slide {width: 220px; margin-right: 16px;}
	.section01 .slider_wrap .swiper-slide a::before {width: 40px; height: 40px;}
	.section01 .slider_wrap .swiper-slide a::after {border-width: 0.7rem 0 0.7rem 1.1rem;}
	.section01 .slider_wrap .swiper-slide:has(.download-item) {width: 27rem;}
	.download-item .img-area {padding: 24px;}
	.download-item .img-area::before {font-size: 36px;}
	.download-item .item-info {flex-direction: column; align-items: flex-start; gap: 12px;}
	.download-item .btn-download {width: 100%; justify-content: center;}
	.list-technical li {display: flex; align-items: flex-start; flex-direction: column;}
	.list-technical li .text-wrap {gap: 8px;}
	.support .section03 .btn.more {position: relative; margin: 16px auto; width: 200px; font-size: 14px;}
	.resources-section .tit-box {margin-bottom: 24px;}
	.container-start {margin-left: 24px;}
	.resource-dl-list + .tit-box {margin-top: 40px;}
}
@media all and (max-width: 600px) {
	.resources-section .tit-box {text-align: center;}
	.news-item {display: flex; flex-direction: column; align-items: flex-start; gap: 16px;}
	.faq-question {padding: 16px 0;}
	.faq-answer-inner {padding: 0 36px 16px 36px;}
	.faq-q-mark {width: 20px; height: 20px;}
	.faq-q-icon {width: 24px; height: 24px;}
	.faq-answer-inner p {font-size: 14px;}
	.list-technical {gap: 24px;}
	.list-technical li {min-width: 100%;}
	.resource-dl-list {grid-template-columns: 1fr;}
	.resource-dl-card .text-area {padding: 40px 24px 24px;}
	.section01 .slider_wrap .swiper-scrollbar {margin-top: 16px;}
	.section01 .slider_wrap .swiper-slide {padding-bottom: 16px; width: 60vw; margin-right: 12px;}
	.section01 .slider_wrap .swiper-slide:has(.download-item) {width: 60vw;}
	.section01 .slider_wrap .swiper-slide .download-item {min-height: 320px;}
	.download-item .icon {width: 44px; height: 48px;}
	.download-item .icon.pdf::before,
	.download-item .icon.link::before {width: 24px; height: 24px;}
	.download-item h4 {font-size: 16px; padding: 16px 0 0 60px;}
	.download-item p {margin-top: 16px; font-size: 14px; line-height: 1.5;}
	.download-item .item-info {margin-top: 16px; justify-content: flex-end; gap: 8px;}
	.download-item .file-meta {justify-content: flex-end; width: 100%;}
	.download-item .file-meta span {display: block; text-align: right;}
}


/* References :: project.html / portfolio.html 전용 반응형 스타일은 references.css로 분리 이전됨 */

/* --------------------------------------------------------
 * Product Gallery
-------------------------------------------------------- */
@media all and (max-width: 1660px) {
	#content.product-gallery-page {padding: 120px 0;}
	.pg-grid {grid-template-columns: repeat(2, 1fr);}
	.pg-brand-header {margin-bottom: 40px;}
}
@media all and (max-width: 1280px) {	
	.pg-layout { gap: 40px; }
	.pg-grid {gap: 24px;}
	.pg-sidebar { width: 240px; }
	.pg-brand-logo {height: 32px;}
	.pg-brand-desc {font-size: 16px;}
}
@media all and (max-width: 1024px) {
	.pg-layout { flex-direction: column; }
	.pg-filter-wrap {margin-bottom: 24px;}
	.pg-main {width: 100%;}
	/* 사이드바 → 오프캔버스 전환 (우측에서 슬라이드인, 헤더 아래부터 시작) */
	.pg-sidebar {
		position: fixed;
		top: 0; 
		right: 0;
		width: 320px; 
		max-width: 85vw;
		height: 100vh;
		margin: 0;
		padding: 32px 24px;
		background: #fff;
		box-shadow: -8px 0 24px rgba(15,23,42,0.12);
		z-index: 99998;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		transform: translateX(100%) !important; /* JS sticky 인라인 transform 무효화 */
		transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
	}
	.pg-sidebar.active {transform: translateX(0) !important;}
	.pg-sidebar-toggle {display: flex; z-index: 9998; font-size: 20px; width: 36px; height: 44px;}
	.pg-sidebar-toggle.active {right: 320px;}
	.pg-sidebar-overlay {display: block; top: var(--header-height);	z-index: 9997;}
	.pg-sidebar-overlay.active {opacity: 1; visibility: visible; }
	.pg-search-box {height: 40px;}
}
@media all and (max-width: 800px) {
	.pg-brand-header-inner {gap: 16px;}
	.pg-brand-logo {height: 24px;}
	.pg-brand-desc {font-size: 14px;}
	.pg-filter {width: 100%; padding: 0; overflow-x: auto;}
	.pg-filter-btn {font-size: 14px; padding: 0 8px; min-width: 60px; flex-shrink: 0;}
	.pg-filter-wrap { flex-direction: column; align-items: flex-start; gap: 12px; }
	.product-gallery-page { padding: 40px 0 100px; }
	.pg-featured-list { grid-template-columns: 1fr; }
}
@media all and (max-width: 600px) {	
	.pg-grid { grid-template-columns: 1fr; }
	.pg-name {font-size: 18px;}
	#content.product-gallery-page {padding: 40px 0;}
}
@media all and (max-width: 400px) {
	.pg-sidebar-toggle.active { right: 85vw; }
}