._solution{
	letter-spacing: -0.04em;
}
section{overflow: hidden;}

/* 커서 */
._cursor_ico{
	position: fixed; z-index: 9999;	pointer-events: none;
}
._cursor_ico div{
	transform: translate(-50%,-50%) scale(0); opacity: 0;
	width: calc(86/14*1em); height: calc(86/14*1em); border-radius: 50%;
	background: linear-gradient(60deg,#3a0895 0%, #2267c5 100%);
	color: #fff;
	display: flex; align-items: center; justify-content: center; font-weight: 300;
	font-size: 14px;
	transition-property: opacity,transform; transition-duration: 0.5s;
}
._cursor_ico i{}
._cursor_ico p{min-width: calc(46/14*1em); text-align: center;}

._cursor_ico.on div{opacity: 1; transform: translate(-50%,-50%) scale(1);}

._cursor_on{cursor: none !important;}
._cursor_on *{cursor: none !important;}


/* ---------- s_visual ---------- */
.s_visual{}
.s_visual .pinBx{
	height: var(--vh100); background-color: #000;
	display: flex; align-items: center; justify-content: center;
	overflow: hidden; position: relative;
}
.s_visual .obj{
	width: calc(1383/1920*100vw);
	position: absolute; margin-top: 40px;
	transition: opacity 0.8s;
}
.s_visual .obj.hide{opacity: 0;}
.s_visual .obj > div{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;
	opacity: 0.2;
}
.s_visual .obj::before {content:''; display: block; padding-bottom: 100%;}
.s_visual .obj div{width: 100%; height: 100%; background-size: cover;}
.s_visual .obj > div{animation: floating40 forwards infinite 10s;}
.s_visual .obj > div:nth-child(2){animation-delay: 0.2s;}
.s_visual .obj > div:nth-child(3){animation-delay: 0.4s;}
.s_visual .obj > div:nth-child(4){animation-delay: 0.6s;}
.s_visual .obj > div:nth-child(5){animation-delay: 0.8s;}

.s_visual .obj > div > div{animation: rotate forwards infinite 20s linear;}
.s_visual .obj > div:nth-child(2) > div{animation-delay: 0.2s; animation-duration:22s}
.s_visual .obj > div:nth-child(3) > div{animation-delay: 0.4s; animation-duration:24s}
.s_visual .obj > div:nth-child(4) > div{animation-delay: 0.6s; animation-duration:26s}
.s_visual .obj > div:nth-child(5) > div{animation-delay: 0.8s; animation-duration:28s}

.s_visual .obj > div > div > div{animation: scale120 forwards infinite 5s;}
.s_visual .obj > div:nth-child(1) > div > div{animation-delay: 0.4s;}
.s_visual .obj > div:nth-child(2) > div > div{animation-delay: 0.3s;}
.s_visual .obj > div:nth-child(3) > div > div{animation-delay: 0.2s;}
.s_visual .obj > div:nth-child(4) > div > div{animation-delay: 0.1s;}

.s_visual .cont{
	color: #fff; box-sizing: border-box; position: relative; z-index: 2;
	/* padding-top: calc(var(--headerH) * 1.5); */
}
.s_visual .cont .top{padding-left: 10px; box-sizing: border-box; font-size: 22px; }
.s_visual .cont .top i{
	transform: rotate(45deg); font-size: 0.8em; color: var(--purple);
	margin-right: 7px; display: none;
}
.s_visual .cont .title{
	display: flex; align-items: center; justify-content: center;
	font-size: 164px; gap: calc(50/164*1em);
	margin-top: max(calc(34/164*1em),20px);
	margin-bottom: max(calc(54/164*1em),20px);
	line-height: 0.8;
}
.robot .s_visual .cont .title{font-size: 135px; }


.s_visual .cont .title .txt{}
.s_visual .cont .title .txt p{
	/* 글자 줄바꿈되서 넣었습니다 */
	white-space: nowrap;
}
.s_visual .cont .title .video{
	position: relative;
	width: 86px; display: flex; align-items: center; justify-content: center;
}
.s_visual .cont .title .video .bx{
	border-radius: 30px; overflow: hidden;
	display: flex; align-items: center; justify-content: center;
	position: absolute; width: 100%;
}
.s_visual .cont .title .video .bx > div{
	flex-shrink: 0; position: relative;
	display: flex; align-items: center; justify-content: center;
	width: 1163px;
}
.s_visual .cont .title .video .bx > div::before {
	width: 100%;
	content:''; display: block; padding-bottom: calc(1080/2048*100%);
	background-color: #ddd;
}
.s_visual .cont .title .video .bx video{
	position: absolute; width: 100%; height: 100%;
	background-color: #000; pointer-events: none;
}

.s_visual .cont .title .video .bx .ico{
	position: absolute;
	display: flex; align-items: center; justify-content: center;
	transition: filter 0.5s; filter: brightness(0) invert(1);
	opacity: 0; width: 154px; height: 154px;
	cursor: pointer;
	display: none;
}
.s_visual .cont .title .video .bx .ico img{position: absolute; transition: opacity 0.2s;}
.s_visual .cont .title .video .bx .ico img:nth-child(1){}
.s_visual .cont .title .video .bx .ico img:nth-child(2){animation: rotate forwards infinite 10s linear;}
.s_visual .cont .title .video.play .bx .ico{pointer-events: none;}
.s_visual .cont .title .video.play .bx .ico img{opacity: 0;}


.s_visual .cont .bottom{
	font-size: 18px; line-height: calc(29/17);
	margin-left: 10px; box-sizing: border-box;
}

.s_visual .mo_video{
	display: none; margin-top: 30px;
	width: 100%; position: relative; z-index: 2;
}

.s_visual .mo_video video{width: 100%; height: 100%;}

@media screen and (max-width:1900px) {
	.s_visual .cont .title{font-size: calc(164/1900*100vw); }
	.robot .s_visual .cont .title{font-size: calc(135/1900*100vw); }
}
@media screen and (max-width:1600px) {
	.s_visual .cont .title .video .bx > div{width: calc(1163/1600*100vw);}
}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	.s_visual .cont .bottom{font-size: 16px; max-width: 40vw;}
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	.s_visual .pinBx{flex-direction: column;}
	.s_visual .obj{width: 160%;}
	.s_visual .cont{width: 100%; padding: 0 5vw;  padding-top: 0;}
	.s_visual .cont .top{padding-left: 0;}
	.s_visual .cont .title{justify-content: flex-start;}
	.s_visual .cont .title .video{display: none;}
	.s_visual .cont .bottom{font-size: 14px; margin-left: 0; max-width: 500px;}
	.s_visual .mo_video{display: block;}
}
@media screen and (max-width:500px) {
	.s_visual .cont .top{font-size: 14px;}
	.s_visual .cont .bottom{font-size: 12px;}
	.s_visual .mo_video{width: 100%;}
}
@media screen and (max-width:320px) {}



/* ---------- s_block ---------- */
.s_block{
	--fullH:calc( var(--vh100) - ( (90px * 3) + (17px * 4) + (var(--headerH) + 24px) ) );
	background-color: #fff;
	margin-bottom: 100px;
}
.s_block .wrap{}
.s_block .swiper{}
.s_block .swiper-wrapper{
	height: var(--vh100); padding-top: calc(var(--headerH) + 24px); box-sizing: border-box;
	display: flex; flex-direction: column; justify-content: flex-end;
	padding-bottom: 17px; gap: 17px;
}
.s_block .swiper-slide{
	border-radius: 27px; overflow: hidden;
	box-sizing: border-box; position: relative;
	min-height: 90px; height:90px;
	display: flex; align-items: center;
	flex-shrink: unset;
}

.s_block .bg{
	position: absolute; left: 0; top: 0;
	width: 100%; height: 100%;
	background-color: #333;
}
.s_block .bg div{
	width: 100%; height: 100%; background-position: center;
	background-size: cover; filter: brightness(0.5);
}
.s_block .txtBx{
	position: relative; z-index: 2; color: #fff; box-sizing: border-box;
	width: 100%; max-width: 1440px; margin: 0 auto;
}
.s_block .txtBx > small{
	font-size: 20px; color: #b293e7;
	display: block; overflow: hidden; height: 2em;
}
.s_block .txtBx h3{
	font-weight: 600; margin-left: -0.1em; line-height: 1.3;
}
.s_block .txtBx .bottom{
	font-size: 21px;
	overflow: hidden;
}
.s_block .txtBx .bottom > p{
	font-weight: 600; line-height: calc(32/21);
	margin-bottom: 18px; max-width: 1000px;
}
.s_block .txtBx .bottom > p small{
	font-size: max(0.8em,12px); font-weight: 300;
}
.s_block .txtBx .bottom .dot{}
.s_block .txtBx .bottom .dot p{
	font-size: max(calc(17/21*1em),12px); font-weight: 300; line-height: calc(29/17);
	display: flex; align-items: flex-start;
}
.s_block .txtBx .bottom .dot p::before {
	content:'·'; display: block; margin-right: 0.4em;
}

/* 모션 */
@media screen and (min-width:1601px) {
	.s_block .swiper-slide{transition: height 1s;}
	.s_block .swiper-slide.on{height: 100%;}
	.s_block .txtBx h3{font-size: 32px; transition: font-size 1s;}
	.s_block .swiper-slide.on .txtBx h3{font-size: 62px;}
	.s_block .txtBx small{max-height: 0; transition: max-height 1s;}
	.s_block .swiper-slide.on .txtBx small{max-height: 2em;}
	.s_block .txtBx .bottom{max-height: 0; padding-top: 0; transition: max-height 1s,padding-top 1s;}
	.s_block .swiper-slide.on .txtBx .bottom{max-height: 10em; padding-top: 50px;}
}
@media screen and (min-width:821px) {}


@media screen and (max-width:1600px) {
	.s_block{padding: 120px 0;}
	.s_block .swiper{width: auto; overflow: visible;}
	.s_block .swiper-wrapper{flex-direction: row; justify-content: unset; padding-top: unset; height: unset; gap: 0; padding-bottom: 0;}
	.s_block .swiper-slide{flex-shrink: 0; height: auto; min-height: auto; width: 800px; padding: 80px 40px;}

	.s_block .txtBx small{font-size: 20px; }
	.s_block .swiper-slide .txtBx h3{font-size: 40px; margin-bottom: 30px;}
	.s_block .txtBx .bottom{font-size: 18px; }

	.s_block .bg div{filter: brightness(0.6);}
}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	.s_block .swiper-slide{width: calc(calc(700/1024*100vw));}
}
@media screen and (max-width:820px) {
	.s_block .swiper-slide{width: 100%; border-radius: 14px;}

	.s_block .txtBx small{font-size: 18px; }
	.s_block .swiper-slide .txtBx h3{font-size: 30px; margin-bottom: 20px;}
	.s_block .txtBx .bottom{font-size: 16px; }
}
@media screen and (max-width:500px) {


	.s_block .swiper-slide{padding: 40px 20px;}
	.s_block .txtBx small{font-size: 16px; }
	.s_block .swiper-slide .txtBx h3{font-size: 22px; font-size: 18px;  margin-bottom: 15px; font-weight: 700;}
	.s_block .txtBx .bottom{font-size: 14px; }
	.s_block .txtBx .bottom > p{margin-bottom: 12px; font-weight: 500; line-height: calc(35/20);}
}
@media screen and (max-width:320px) {}







/* ---------- s_popup ---------- */
.s_popup{
	width: 100%;
	position: relative;
	display: flex; align-items: center; justify-content: center;
	color: #fff;
}
.s_popup .wrap{
	position: absolute; z-index: 2;
}
.s_popup .wrap h3{
	font-size: 90px; font-weight: 500; margin-left: -0.05em;
	margin-bottom: max(calc(30/118*1em),20px);
}
.s_popup .wrap div{overflow: hidden;}
.s_popup .wrap div p{}
.s_popup .wrap small{
	font-size: 20px; line-height: calc(32/20); overflow: hidden;
}

.s_popup .cont{width: 100%; position: relative;}
.s_popup .bg{
	position: relative;
	overflow: hidden; width: 100%;
}
.s_popup .bg::before {
	width: 100%;
	content:''; display: block; padding-bottom: calc(980/1920*100%);
}
.s_popup .bg div{
	position: absolute; left: 0; top: 0;
	width: 100%; height: 100%; background-size: cover; background-position: center;
}
.s_popup .bg div.mo{display: none;}

.s_popup .dotBx{
	position: absolute; z-index: 2;
	width: 100%; height: 100%; left: 0; top: 0;
}
.s_popup .dotBx .dot{
	position: absolute; display: flex; align-items: center; gap: 1em;
	cursor: pointer;
	margin-top: -25px; margin-left: -25px; text-transform: uppercase; line-height: 1.2;
}
.s_popup .dotBx .dot p.right{
	position: absolute; text-align: right; white-space: nowrap;
	top: 50%; right: 100%; transform: translateY(-50%); margin-right: 8px;
}


/* 점위치 페이지별로 별도 */
.depalletizing .s_popup .dot.n1{left: 48%;top: 20%;}
.depalletizing .s_popup .dot.n2{left: 57%;top: 26%;}
.depalletizing .s_popup .dot.n3{left: 61%;top: 53%;}
.depalletizing .s_popup .dot.n4{right: 8%; top: 59%; flex-flow: row-reverse;}
.depalletizing .s_popup .dot.n5{left: 48%;top: 67%;}
.depalletizing .s_popup .dot.n6{left: 59%;top: 78%;}

/* 팔레타이징 점위치 */
.palletizing .s_popup .dot.n1{left: 36.2%;top: 23%;}
.palletizing .s_popup .dot.n2{right: 8%; top: 45%; flex-flow: row-reverse;}
.palletizing .s_popup .dot.n3{left: 60%;top: 34%;}
.palletizing .s_popup .dot.n4{left: 58%;top: 25%;}
.palletizing .s_popup .dot.n5{left: 49%;top: 60%;}
.palletizing .s_popup .dot.n6{left: 58.8%;top: 49%;}

/* 피스픽킹 텍스트 위치 */
.piecepicking .s_popup .wrap{top: 41%;}

/* 피스픽킹 점위치 */
.piecepicking .s_popup .dot.n1{left: 42%;top: 15%;}
.piecepicking .s_popup .dot.n2{left: 32%;top: 34%;}
.piecepicking .s_popup .dot.n3{left: 57%;top: 54%;}
.piecepicking .s_popup .dot.n4{right: 13%;top: 81%;flex-flow: row-reverse;}
.piecepicking .s_popup .dot.n5{left: 45%;top: 49%;}
.piecepicking .s_popup .dot.n6{left: 48%;top: 76%;}

/* 보이드필 점위치 */
.voidfill .s_popup .dot.n1{left: 72%;top: 16%;}
.voidfill .s_popup .dot.n2{left: 56%;top: 20%;}
.voidfill .s_popup .dot.n3{left: 50%;top: 39%;}
.voidfill .s_popup .dot.n4{left: 60%;top: 61%;}
.voidfill .s_popup .dot.n5{right: 41%;top: 81%;flex-flow: row-reverse;}
.voidfill .s_popup .dot.n6{right: 22%;top: 79%;flex-flow: row-reverse;}






.s_popup .dotBx .dot .circle{
	display: flex; align-items: center; justify-content: center;
	animation: scale110 forwards infinite 3s;
	width: 50px; height: 50px; border-radius: 50%; background-color: rgba(255,255,255,0.33);
	transition: background-color 0.5s;
	flex-shrink: 0;
}
.s_popup .dotBx .dot .circle::before,
.s_popup .dotBx .dot .circle::after {
	content:''; display: block; border-radius: 50%; position: absolute;
	transition: background-color 0.5s;
}
.s_popup .dotBx .dot .circle::before{width: 66%; height: 66%; background-color: rgba(255,255,255,0.33); z-index: 2;}
.s_popup .dotBx .dot .circle::after{width: 33%; height: 33%; background-color: #fff; z-index: 3;}

.s_popup .dotBx .dot p{font-size: 18px; }

html.pc .s_popup .dotBx .dot:hover .circle{background-color: rgba(0, 228, 255, 0.33);}
html.pc .s_popup .dotBx .dot:hover .circle::before{background-color: rgba(0, 228, 255, 0.33);}
html.pc .s_popup .dotBx .dot:hover .circle::after{background-color: rgba(0, 228, 255, 1);}

@media screen and (max-width:1600px) {
	.s_popup .wrap h3{font-size: max(calc(90/1600*100vw),38px); }
}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	.s_popup .wrap small{font-size: 18px; }
}
@media screen and (max-width:1024px) {
	.s_popup .wrap small{font-size: 16px; }
	.s_popup .dotBx .dot{font-size: 14px; margin-top: -10px; margin-left: -10px;}
	.s_popup .dotBx .dot .circle{width: 20px; height: 20px;}
}
@media screen and (max-width:820px) {
	.s_popup{display: block;}
	.s_popup .wrap{position: unset; color: #000; margin-bottom: 40px;}
	.s_popup .wrap small{font-size: 14px; }

	.s_popup .dotBx .dot{gap: 8px;}
	.s_popup .dotBx .dot{font-size: 15px; margin-top: -15px; margin-left: -15px;}
	.s_popup .dotBx .dot .circle{width: 30px; height: 30px;}

	.s_popup .dotBx .dot p.bottom{
		position: absolute; white-space: nowrap;
		top: 100%; margin-top: 8px; margin-right: 0;
		left: 50%; transform: translateX(-50%); right: unset;
	}
	.s_popup .bg{filter: brightness(0.5);}
	.s_popup .bg::before {padding-bottom: 100%;}
	.s_popup .bg div{background-position: 72% center;}
	.s_popup .bg div{background-position: 64% center;}

	/* 점위치 페이지별로 별도 */
	.depalletizing .s_popup .dot.n1{left: 33%;top: 16%;}
	.depalletizing .s_popup .dot.n2{left: 51%;top: 26%;}
	.depalletizing .s_popup .dot.n3{left: unset; right: 40%; top: 53%; flex-flow: row-reverse;}
	.depalletizing .s_popup .dot.n4{right: 14%;top: 67%;}
	.depalletizing .s_popup .dot.n5{left: 35%;top: 67%;}
	.depalletizing .s_popup .dot.n6{left: 52%;top: 81%;}

	/* 팔레타이징 점위치 */
	.palletizing .s_popup .bg::before {padding-bottom: 83%;}
	.palletizing .s_popup .bg div{background-position: 85% center;}

	.palletizing .s_popup .dot.n1{left: 6.2%;top: 23%;}
	.palletizing .s_popup .dot.n2{right: 5%;top: 41%;}
	.palletizing .s_popup .dot.n3{left: 40%;top: 31%;}
	.palletizing .s_popup .dot.n4{left: 40%;top: 18%;}
	.palletizing .s_popup .dot.n5{left: 24%;top: 60%;}
	.palletizing .s_popup .dot.n6{left: 41.8%;top: 49%;}

	/* 피스픽킹 점위치 */
	.piecepicking .s_popup .bg::before {padding-bottom: 83%;}
	.piecepicking .s_popup .bg div{background-position: 85% center;}

	.piecepicking .s_popup .dot.n1{left: 18%;top: 12%;}
	.piecepicking .s_popup .dot.n2{left: 6%;top: 34%;}
	.piecepicking .s_popup .dot.n3{left: 40%;top: 58%;}
	.piecepicking .s_popup .dot.n4{right: 13%;top: 81%;}
	.piecepicking .s_popup .dot.n5{left: 24%;top: 49%;}
	.piecepicking .s_popup .dot.n6{left: 24%;top: 76%;}


	/* 보이드필 점위치 */
	.voidfill .s_popup .bg::before {padding-bottom: 83%;}
	.voidfill .s_popup .bg div{background-position: 90% center;}

	.voidfill .s_popup .dot.n1{left: 61%;top: 14%;}
	.voidfill .s_popup .dot.n2{left: 39%;top: 24%;}
	.voidfill .s_popup .dot.n3{left: 36%;top: 46%;}
	.voidfill .s_popup .dot.n4{left: 40%;top: 67%;}
	.voidfill .s_popup .dot.n5{right: 61%;top: 81%;}
	.voidfill .s_popup .dot.n6{right: 30%;top: 79%;}

}
@media screen and (max-width:500px) {
	.s_popup .dotBx .dot p{font-size: 13px; }

	.s_popup .dotBx .dot{font-size: 13px; margin-top: -10px; margin-left: -10px;}
	.s_popup .dotBx .dot .circle{width: 20px; height: 20px;}
}
@media screen and (max-width:360px) {
	.s_popup .dotBx .dot p{font-size: 12px; }
}







/* 팝업 */
._info_popup{
	position: fixed; z-index: 999999;
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	opacity: 0; pointer-events: none;
	transition: opacity 0.5s;
}
._info_popup.on{
	opacity: 1; pointer-events: auto;
}
._info_popup .bg{
	position: absolute; top: 0; left: 0;
	width: 100%; height: 100%; background-color: #000; opacity: 0.9;
	cursor: pointer;
}
._info_popup .cancel{
	font-size: 38px; cursor: pointer; color: #fff; text-align: right;
}
._info_popup .cancel i{width: 1em; height: 1em; cursor: pointer; transform: translateX(210px);}

._info_popup .cont{
	width: 100%; height: 100%; overflow: auto;
}
._info_popup .con{
	color: #fff;
	display: flex; align-items: center; justify-content: center;
	min-height: 100%; padding: 40px 0; box-sizing: border-box;
}
._info_popup .inner{
	max-width: 1020px; width: 95%; margin: 0 auto;
	position: relative;
}
._info_popup .imgBx{
	width: 100%;
	border-radius: 19px; overflow: hidden;
	position: relative;
	display: flex; align-items: center; justify-content: center;
	background-color: #fff;
	color: #000;
}
/* 비디오 들어가는 박스는 별도 */
._info_popup .imgBx._video{background-color: unset;}

._info_popup.n3 .imgBx{
	background-color: #fff;
}
._info_popup .imgBx::before {
	width: 100%;
	content:''; display: block; padding-bottom: calc(450/1020*100%);
}

._info_popup.obj .imgBx:before{
	padding-bottom: calc(530/920*100%);
}
._info_popup .cont .imgBx img{
	position: absolute; width: 100%; height: 100%;
	object-fit: contain;
	/* max-width: calc(100% - 80px); */
	left: 0; top: 0;
}
._info_popup .cont .imgBx video{
	position: absolute; width: 100%; height: 100%;
	object-fit: cover; max-width: 100%;
}
._info_popup .videoBx{}
._info_popup .videoBx video{}
._info_popup .txtBx{line-height: 1.3; letter-spacing: -0.04em;}
._info_popup .txtBx h4{
	font-size: 38px; font-weight: 600;
	padding: calc(30/38*1em) 0; border-bottom: 1px solid rgba(255,255,255,0.5);
}
._info_popup.obj .txtBx h4{
	border-bottom: none;
}
._info_popup .txtBx b{
	display: block;
	font-size: 20px; font-weight: 600;
}
._info_popup .txtBx > b{padding-top: 1em;}
._info_popup .txtBx div:not(.imgBx){
	font-size: 17px; font-weight: 300; padding-top: 20px;
	display: flex; flex-direction: column; gap: 4px; color: #e4e4e4;
}
._info_popup .txtBx div:not(.imgBx) p{display: flex; align-items: flex-start;}
._info_popup .txtBx div:not(.imgBx) p::before {
	content:'·'; display: block; margin-right: 0.3em;
}



@media screen and (max-width:1600px) {
	._info_popup .cancel{margin-bottom: 10px;}
	._info_popup .cancel i{transform: unset;}
}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	._info_popup .imgBx{border-radius: 10px;}
	._info_popup .txtBx h4{font-size: 30px;}
	._info_popup .txtBx b{font-size: 18px;}
	._info_popup .txtBx div:not(.imgBx){font-size: 14px;}
}
@media screen and (max-width:820px) {
	._info_popup .cancel{font-size: 30px;}
	._info_popup .imgBx{border-radius: 8px;}
	._info_popup .txtBx h4{font-size: 24px;}
	._info_popup .txtBx b{font-size: 16px;}
}
@media screen and (max-width:500px) {
	._info_popup .txtBx h4{font-size: 20px;}
	._info_popup .txtBx b{font-size: 14px;}
	._info_popup .txtBx div:not(.imgBx){font-size: 12px;}
	._info_popup .cont .imgBx img{max-width: unset;}
}
@media screen and (max-width:320px) {}






/* ---------- s_process ---------- */


.s_process .wrap{
	display: flex; align-items: center;
	height: var(--vh100);  box-sizing: border-box; position: relative;
	/* padding-top: var(--headerH); */
}
.s_process .txtArea{
	margin-right: 424px; padding-bottom: 120px; position: relative;
	display: flex; align-items: center; justify-content: center;
}
.s_process .txtArea .obj{}





.s_process .txtArea .txtBx{}
.s_process .txtArea .txtBx .top{
	display: flex; align-items: flex-start; gap: 0.5em;
	font-size: 20px; font-weight: 600; line-height: 1.3;
}

.s_process .txtArea .txtBx h4{
	overflow: hidden; line-height: 1.4;
	font-size: 20px; font-weight: 600; margin-top: 20px;
}
.s_process .txtArea .txtBx h3{
	overflow: hidden; margin-left: calc(-7/116*1em);
	font-size: 116px; font-weight: 500;
}
.s_process .swiper{overflow: visible;}
.s_process .swiper-wrapper{
	display: flex;
	letter-spacing: -0.045em;
}
.s_process .swiper-slide{width: 324px; position: relative; padding: 0 75px; flex-shrink: unset;}
.s_process .swiper-slide:nth-child(1){padding-left: 0;}
.s_process .swiper-slide::after {
	content:''; display: block; position: absolute;
	width: 1px; height: 100%; background-color: #d3d3d4;
	top: 50%; transform: translateY(-50%); right: 0;
}
.s_process .swiper-slide:last-child{padding-right: 0;}
.s_process .swiper-slide:last-child:after {
	display: none;
}
.s_process .swiper-slide .top{display: flex; align-items: flex-end; gap: 8px; margin-bottom: 10px;}
.s_process .swiper-slide .top p{font-size: 12px; font-weight: 300; color: #828282; display: none;}
.s_process .swiper-slide .top em{font-size: 24px; font-weight: 600; color: var(--purple);}
.s_process .swiper-slide .imgBx{position: relative; border-radius: 11px; overflow: hidden;}
.s_process .swiper-slide .imgBx::before {
	content:''; display: block; padding-bottom: calc(436/324*100%);background-color: #333;
}
.s_process .swiper-slide .imgBx img{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;
}
.s_process .swiper-slide .txtBx{}
.s_process .swiper-slide .txtBx h4{
	font-size: 20px; font-weight: 700; line-height: 1.3; color: var(--purple);
	margin-top: 20px; margin-bottom: 12px;
}
.s_process .swiper-slide .txtBx .dot{
	display: flex; flex-direction: column; gap: 6px;
}
.s_process .swiper-slide .txtBx .dot p{
	font-size: 17px; line-height: calc(27/17);
	display: flex; align-items: flex-start;
}
.s_process .swiper-slide .txtBx .dot p::before {
	content:'·'; display: block; margin-right: 0.3em;
}


@media screen and (max-width:1600px) {
	.s_process .txtArea{margin-right: calc(300/1600*100vw);}
	.s_process .txtArea .txtBx h3{font-size: max(calc(118/1600*100vw),38px); }
	.s_process .swiper-slide .imgBx::before{padding-bottom: 120%;}
}
@media screen and (max-width:1440px) {
	.s_process .wrap{height: auto; padding-top: 0;}

	.s_process .txtArea .txtBx h4{font-size: max(calc(20/1440*100vw),14px); }
	.s_process .swiper{
		width: 300px; margin: 0;
	}
	.s_process .swiper-slide{
		flex-shrink: 0; width: 100%; padding: 0; opacity: 0; pointer-events: none;
		transition: opacity 0.5s;
	}
	.s_process .swiper-slide-active{opacity: 1; pointer-events: auto;}
	.s_process .swiper-slide-active + div{opacity: 1; pointer-events: auto;}
	.s_process .swiper-slide-active + div + div{opacity: 1; pointer-events: auto;}
	.s_process .swiper-slide-active + div + div + div{opacity: 1; pointer-events: auto;}
	.s_process .swiper-slide::after{display: none;}

	.s_process .swiper-slide .txtBx .dot p{font-size: 14px; }
}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	.s_process .wrap{flex-direction: column; gap: 60px; align-items: flex-start;}
	.s_process .txtArea{margin-right: 0; padding-bottom: 0;}
	.s_process .swiper-slide{opacity: 1; pointer-events: auto;}
}
@media screen and (max-width:500px) {
	.s_process .wrap{gap: 40px;}
	.s_process .swiper{margin: 0 auto; min-width: 240px; width: calc(300/500*100vw); width: 100%;}
	.s_process .swiper-slide{opacity: 0;}
	.s_process .swiper-slide-active{opacity: 1;}
	.s_process .swiper-slide-active + div{opacity: 0;}
	.s_process .swiper-slide .top{margin-bottom: 8px;}
	.s_process .swiper-slide .txtBx{padding: 0 6px; box-sizing: border-box;}
	.s_process .swiper-slide .txtBx h4{font-size: 18px; }

}
@media screen and (max-width:320px) {}






/* ---------- s_industries ---------- */

.s_industries{
	--cardGap:73px;
}
.s_industries .wrap{
	display: flex; align-items: center;
	height: var(--vh100); padding-top: var(--headerH); box-sizing: border-box;
}
.s_industries .txtArea{
	margin-right: 170px; padding-bottom: 120px; position: relative;
	display: flex; align-items: center; justify-content: center;
}
.s_industries .txtArea .obj{position: absolute; right: 10%; z-index: -1; margin-top: 20px;}
.s_industries .txtArea .obj .bx{
	display: flex; align-items: center; position: relative;
	width: 1000px; height: 1000px; filter: invert(1); opacity: 0.5;
}
.s_industries .txtArea .obj .bx div{
	width: 100%; height: 100%; background-position: center; background-size: cover;
	position: absolute;
}

.s_industries .txtArea .obj .bx > div{animation: floating40 forwards infinite 10s,opacity05 forwards infinite 5s;}
.s_industries .txtArea .obj .bx > div:nth-child(2){animation-delay: 0.2s;}
.s_industries .txtArea .obj .bx > div:nth-child(3){animation-delay: 0.4s;}
.s_industries .txtArea .obj .bx > div:nth-child(4){animation-delay: 0.6s;}
.s_industries .txtArea .obj .bx > div:nth-child(5){animation-delay: 0.8s;}

.s_industries .txtArea .obj .bx > div > div{animation: rotate forwards infinite 20s linear;}
.s_industries .txtArea .obj .bx > div:nth-child(2) > div{animation-delay: 0.2s; animation-duration:22s}
.s_industries .txtArea .obj .bx > div:nth-child(3) > div{animation-delay: 0.4s; animation-duration:24s}
.s_industries .txtArea .obj .bx > div:nth-child(4) > div{animation-delay: 0.6s; animation-duration:26s}
.s_industries .txtArea .obj .bx > div:nth-child(5) > div{animation-delay: 0.8s; animation-duration:28s}

.s_industries .txtArea .obj .bx > div > div > div{animation: scale120 forwards infinite 5s; opacity: 0.2;}
.s_industries .txtArea .obj .bx > div:nth-child(1) > div > div{animation-delay: 0.4s;}
.s_industries .txtArea .obj .bx > div:nth-child(2) > div > div{animation-delay: 0.3s;}
.s_industries .txtArea .obj .bx > div:nth-child(3) > div > div{animation-delay: 0.2s;}
.s_industries .txtArea .obj .bx > div:nth-child(4) > div > div{animation-delay: 0.1s;}


.s_industries .txtArea .txtBx{}
.s_industries .txtArea .txtBx .top{
	display: flex; align-items: flex-start; gap: 0.5em;
	font-size: 20px; font-weight: 600; line-height: 1.3;
}

.s_industries .txtArea .txtBx h4{
	overflow: hidden; line-height: 1.4;
	font-size: 20px; font-weight: 600; margin-top: 20px;
}
.s_industries .txtArea .txtBx h3{
	overflow: hidden; margin-left: calc(-7/116*1em);
	font-size: 116px; font-weight: 500;
}


.s_industries .list{
	font-size: 1px;
	width: 590em; position: relative;
}
.s_industries .list::before {
	content:''; display: block; padding-bottom: calc(740/590*100%);
}
.s_industries .list li{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform-origin: right center;
	transition-property: transform,opacity; transition-duration: 1s;
}

.s_industries .list li.n1{z-index: 6; transform: translate(calc(var(--cardGap) * 0),0) scale(1);}
.s_industries .list li.n2{z-index: 5; transform: translate(calc(var(--cardGap) * 1),0) scale(0.85);}
.s_industries .list li.n3{z-index: 4; transform: translate(calc(var(--cardGap) * 1.8),0) scale(0.7);}
.s_industries .list li.n4{z-index: 3; transform: translate(calc(var(--cardGap) * 2.4),0) scale(0.55);}
.s_industries .list li.n5{z-index: 2; transform: translate(calc(var(--cardGap) * 2.8),0) scale(0.4);}
.s_industries .list li.n6{z-index: 1; transform: translate(calc(var(--cardGap) * 3),0) scale(0.35);}

.s_industries .list li div{
	width: 100%; height: 100%;
	border-radius: 30em; overflow: hidden;
}
.s_industries .list li img{
	width: 100%; height: 100%; object-fit: cover;background-color: #333;
}
.s_industries .list li img.dark{filter: brightness(0.9);}
.s_industries .list li p{
	position: absolute; left: calc(42/62*1em); bottom: calc(42/62*1em);
	font-size: 62em;  font-weight: 600; color: #fff;
}


/* 모션 */
.s_industries .list.step1 li.n1{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}
.s_industries .list.step1 li.n2{transform: translate(calc(var(--cardGap) * 0),0) scale(1);}
.s_industries .list.step1 li.n3{transform: translate(calc(var(--cardGap) * 1),0) scale(0.85);}
.s_industries .list.step1 li.n4{transform: translate(calc(var(--cardGap) * 1.8),0) scale(0.7);}
.s_industries .list.step1 li.n5{transform: translate(calc(var(--cardGap) * 2.4),0) scale(0.55);}
.s_industries .list.step1 li.n6{transform: translate(calc(var(--cardGap) * 2.8),0) scale(0.4);}

.s_industries .list.step2 li.n2{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}
.s_industries .list.step2 li.n3{transform: translate(calc(var(--cardGap) * 0),0) scale(1);}
.s_industries .list.step2 li.n4{transform: translate(calc(var(--cardGap) * 1),0) scale(0.85);}
.s_industries .list.step2 li.n5{transform: translate(calc(var(--cardGap) * 1.8),0) scale(0.7);}
.s_industries .list.step2 li.n6{transform: translate(calc(var(--cardGap) * 2.4),0) scale(0.55);}

.s_industries .list.step3 li.n3{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}
.s_industries .list.step3 li.n4{transform: translate(calc(var(--cardGap) * 0),0) scale(1);}
.s_industries .list.step3 li.n5{transform: translate(calc(var(--cardGap) * 1),0) scale(0.85);}
.s_industries .list.step3 li.n6{transform: translate(calc(var(--cardGap) * 1.8),0) scale(0.7);}

.s_industries .list.step4 li.n4{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}
.s_industries .list.step4 li.n5{transform: translate(calc(var(--cardGap) * 0),0) scale(1);}
.s_industries .list.step4 li.n6{transform: translate(calc(var(--cardGap) * 1),0) scale(0.85);}

.s_industries .list.step5 li.n5{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}
.s_industries .list.step5 li.n6{transform: translate(calc(var(--cardGap) * 0),0) scale(1);}

.s_industries .list.step6 li.n6{transform: translate(calc(var(--cardGap) * 0),-120%) scale(1); opacity: 0;}


@media screen and (max-width:1800px) {
	.s_industries{--cardGap: max(calc(73/1800*100vw),30px);}
	.s_industries .list{font-size: calc(1/1800*100vw); }
	.s_industries .txtArea{margin-right: calc(170/1800*100vw); padding-left: calc(100/1800*100vw);}
	.s_industries .txtArea .obj .bx{width: calc(1000/1800*100vw); height: calc(1000/1800*100vw); min-width: 700px; min-height: 700px;}
}
@media screen and (max-width:1600px) {
	.s_industries .txtArea .txtBx h3{font-size: max(calc(118/1600*100vw),38px); }
}
@media screen and (max-width:1440px) {
	.s_industries .txtArea .txtBx h4{font-size: max(calc(20/1440*100vw),14px); }
}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	.s_industries .wrap{flex-direction: column; height: auto;}
	.s_industries .txtArea{padding-left: 0; margin-right: 0; padding-bottom: 40px; width: 100%; justify-content: flex-start;}
	.s_industries .txtArea .obj{display: none;}

	.s_industries .list{gap: 20px; width: 100%; display: flex; flex-wrap: wrap;}
	.s_industries .list::before {display: none;}
	.s_industries .list li{
		transform: unset !important; opacity: 1 !important; position: relative !important;
		width: calc(50% - 10px);
	}
	.s_industries .list li::before {content:''; display: block; padding-bottom: 120%;}
	.s_industries .list li > div{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
	.s_industries .list li p{font-size: 18px; }
}
@media screen and (max-width:500px) {
	.s_industries .txtArea{padding-bottom: 30px;}
	.s_industries .list{gap: 10px;}
	.s_industries .list li{width: calc(50% - 5px);}
}
@media screen and (max-width:320px) {}







/* ---------- s_img ---------- */

.s_img{}
.s_img .wrap{
	display: flex; align-items: center; justify-content: space-between;
	gap: 60px 30px;
}
.s_img .txtBx{padding-left: 80px; box-sizing: border-box; white-space: nowrap;}
.s_img .txtBx h3{
	font-size: 51px; font-weight: 700; line-height: calc(70/51);
	margin-bottom: 36px;
}
.s_img .txtBx h3 div{overflow: hidden;}
.s_img .txtBx .bx{
	margin-bottom: 30px;
}
.s_img .txtBx .bx:last-child{margin-bottom: 0;}
.s_img .txtBx .bx b{
	font-weight: 600; display: block; margin-bottom: 10px;
	font-size: 20px; font-weight: 600;
}
.s_img .txtBx .bx div{
	display: flex; flex-direction: column;
}
.s_img .txtBx .bx div p{
	font-size: 17px; line-height: calc(31/17);
	display: inline-block;
}
.s_img .txtBx .bx div p::before {
	content:'·'; display: inline-block; margin-right: 0.3em;
}

.s_img .right{width: 70%;max-width: 840px; max-width: 740px; text-align: center;}
.s_img .right video{width: 100%; border-radius: 14px; overflow: hidden;}
.palletizing .s_img .right video{max-width: 460px;}






@media screen and (max-width:1600px) {
	.s_img .txtBx{padding-left: 0;}
}
@media screen and (max-width:1440px) {
	.s_img .wrap{flex-direction: column;}
	.s_img .txtBx{text-align: center; white-space: unset;}
	.s_img .txtBx .small div{justify-content: center;}
	.s_img .txtBx .bx div p{justify-content: center;}

	.s_img .right{max-width: unset;}
}
@media screen and (max-width:1280px) {
	.s_img .txtBx h3{font-size: max(calc(51/1280*100vw),28px); }
	.s_img .txtBx .bx b{font-size: 16px; }
	.s_img .txtBx .bx div p{font-size: 16px; }
}
@media screen and (max-width:1024px) {
	.s_img .right {width: 100%;}
}
@media screen and (max-width:820px) {
	.s_img .txtBx .small div{font-size: 16px; }
	.s_img .txtBx .bx b{font-size: 14px; }
	.s_img .txtBx .bx div p{font-size: 14px; }
}
@media screen and (max-width:500px) {
	.s_img .wrap{gap: 30px;}
	.s_img .txtBx h3{margin-bottom: 30px;}
	.s_img .txtBx .small div{font-size: 14px; }
	.s_img .txtBx .bx{margin-bottom: 20px;}
	.s_img .txtBx .bx b{font-size: 12px; }
	.s_img .txtBx .bx div p{font-size: 12px; }
}
@media screen and (max-width:320px) {}




/* ---------- s_slide ---------- */

.s_slide{position: relative; overflow: visible;}

.s_slide .blur{
	position: absolute; max-width: 70vw;
	pointer-events: none;
}
.s_slide .blur img{}
.s_slide .blur.left{left: 0; top: 0; transform: translate(-50%,-30%);}

.s_slide .wrap{}
.s_slide h3{
	font-size: 50px; font-weight: 500; line-height: 1.3;
	text-align: center; margin-bottom: max(calc(80/50*1em),40px);
}
.s_slide h3 > div{margin-bottom: 30px; line-height: 1;}
.s_slide h3 > div p{}
.s_slide h3 > p{
	font-size: 18px; line-height: calc(31/18);
}
.s_slide .swiper{
	overflow: visible;
}
.s_slide .swiper-wrapper{}
.s_slide .swiper-slide{
	width: 317px;
	/* box-shadow: 0 0 0 1px tomato; */
}
.s_slide .swiper-slide::before {
	content:''; display: block; padding-bottom: calc(485/317*100%);
}
.s_slide .swiper-slide a{
	padding: 28px 24px; box-sizing: border-box;
	position: absolute;  left: 0; top: 0; width: 100%; height: 100%;
	display: flex; flex-direction: column; justify-content: space-between;
	border-radius: 14px; overflow: hidden; color: #fff;
}

.s_slide .swiper-slide a .bg {
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center; z-index: -1;
	filter: brightness(0.5);
}
.s_slide .swiper-slide a .bg div{
	width: 100%; height: 100%;
	background-position: center; background-size: cover;
}
.s_slide .swiper-slide a .num{
	font-size: 21px;
}
.s_slide .swiper-slide a .small{
	position: absolute; top: 22px; right: 24px;
	font-size: 14px; font-weight: 300; color: rgba(255,255,255.025);
	width: 1px; height: 1px; white-space: nowrap;
}
.s_slide .swiper-slide a .small p{transform: rotate(90deg); opacity: 0.25;}
.s_slide .swiper-slide a .txtBx{
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 10px;
}
.s_slide .swiper-slide a .txtBx h4{}
.s_slide .swiper-slide a .txtBx h4 small{
	color: #d8d8d8;
}
.s_slide .swiper-slide a .txtBx h4 p{
	font-size: 30px; font-size: 24px;  font-weight: 500; margin-top: 14px;
	word-break: break-all; line-height: 1.3;
}
.s_slide .swiper-slide a .txtBx .ico{
	min-width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
	color: #fff; position: relative; font-size: 17px;
	background: linear-gradient(320deg,#3a0895 0%, #2267c5 130%);
	border-radius: 7px; overflow: hidden;
}
.s_slide .swiper-slide a .txtBx .ico::before {
	content:''; display: block; width: calc(100% - 3px); height: calc(100% - 3px);
	background-color: #000; position: absolute; border-radius: 6px;
	transition: opacity 0.8s;
}
.s_slide .swiper-slide-active a .txtBx .ico::before{opacity: 0;}
.s_slide .swiper-slide a .txtBx .ico i{position: relative; z-index: 2;}

@media screen and (min-width:1025px) {
	/* 슬라이드 효과 */
	.s_slide .swiper-slide a{transition-property: transform,opacity,transform-origin; transition-duration: 0.8s;}
	.s_slide .swiper-slide a{opacity: 0; transform: scale(0.5);}

	.s_slide .swiper-slide-active a{opacity: 1; transform: scale(1);}

	.s_slide .swiper-slide.prev01 a{opacity: 0.76; transform: scale(0.8);}
	.s_slide .swiper-slide.prev02 a{opacity: 0.28; transform: scale(0.7); transform-origin: 100% 50%;}
	.s_slide .swiper-slide.prev03 a{opacity: 0; transform: scale(0.6); transform-origin: 150% 50%;}

	.s_slide .swiper-slide.next01 a{opacity: 0.76; transform: scale(0.8);}
	.s_slide .swiper-slide.next02 a{opacity: 0.28; transform: scale(0.7); transform-origin: 0% 50%;}
	.s_slide .swiper-slide.next03 a{opacity: 0; transform: scale(0.6); transform-origin: -50% 50%;}
}



@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	.s_slide h3{font-size: max(calc(50/1024*100vw),38px); }
	.s_slide h3 > p{font-size: max(calc(18/1024*100vw),14px); }
}
@media screen and (max-width:820px) {
	.s_slide .swiper-slide{width: max(calc(317/820*100vw),240px);}
	.s_slide .swiper-slide a{padding: 24px 20px;}
	.s_slide .swiper-slide a .txtBx{flex-direction: column-reverse; align-items: flex-start;}
	.s_slide .swiper-slide a .txtBx h4 small{font-size: 14px; }
	.s_slide .swiper-slide a .txtBx h4 p{font-size: 20px; margin-top: 0;}
}
@media screen and (max-width:500px) {
	.s_slide h3{margin-bottom: 30px; text-align: left; font-size: 28px; }
	.s_slide h3 > div{margin-bottom: 20px;}
	.s_slide h3 > p{max-width: 280px;}
	.s_slide h3 > p br{display: none;}

	.s_slide .swiper-slide a .txtBx h4 p{font-size: 18px; }
}
@media screen and (max-width:320px) {}





/* ---------- s_purple ---------- */

section{}

.s_purple{
	color: #fff;
	background-image: url(/asset/img/sub/solution/s_purple_bg.jpg); background-size: cover; background-position: center;
	position: relative;
	/* background: linear-gradient(90deg,rgba(60, 6, 148, 1) 0%, rgba(13, 1, 35, 1) 100%); */
}
.s_purple .wrap{
	box-sizing: border-box; position: relative;
	display: flex; flex-direction: column; gap: 40px;
}
.s_purple .wrap .bg{
	position: absolute; right: 0; width: 640px;
	top: 50%; transform: translateY(-50%);
}
.s_purple .wrap .bg::before {
	content:''; display: block; padding-bottom: 80%;
}
.s_purple .wrap .bg *{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	object-fit: contain;
}


.s_purple h3{
	font-size: 50px; font-weight: 600; line-height: calc(83/62);
}
.s_purple h3 span{
	-webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.s_purple .txtBx{
	display: flex; flex-direction: column; gap: 50px;
}
.s_purple .txtBx h4{
	font-size: 26px; font-size: 18px;  line-height: calc(38/26);
}
.s_purple .txtBx > p{
	font-size: 17px; line-height: calc(31/17); margin-bottom: 44px;
}
.s_purple .txtBx ._moreBtn{text-align: left;}


@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {
	.s_purple h3{font-size: max(calc(50/1440*100vw),26px); }
	.s_purple .txtBx h4{font-size: max(calc(18/1440*100vw),16px); }
	.s_purple .wrap .bg{width: max(calc(640/1440*100vw),300px);}
}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	.s_purple .txtBx h4{font-size: 14px; }
	.s_purple .wrap .bg{filter: brightness(0.4);}
}
@media screen and (max-width:500px) {
	.s_purple .wrap{gap: 30px;}
	.s_purple{background: linear-gradient(90deg,rgba(60, 6, 148, 1) 0%, rgba(13, 1, 35, 1) 100%);}
	.s_purple .txtBx{gap: 34px;}
	.s_purple .txtBx h4{max-width: 80%;}
	.s_purple .txtBx h4 br{display: none;}

	.s_purple .wrap .bg{left: 50%; transform: translate(-50%,-50%); width: 100%;}
}
@media screen and (max-width:320px) {}






/* ---------- s_faq ---------- */

.s_faq{ margin-top: -1px; position: relative; overflow: visible;}

.s_faq .blur{
	position: absolute; max-width: 70vw; pointer-events: none;
}
.s_faq .blur img{}
.s_faq .blur.left{left: 0; top: 0; transform: translateX(-50%);}
.s_faq .blur.right{right: 0; bottom: 0; transform: translate(20%,0%);}

.s_faq h3{
	font-size: 50px; font-weight: 500; line-height: 1.3;
	text-align: center; margin-bottom: max(calc(80/50*1em),40px);
}
.s_faq h3 > div{margin-bottom: 30px; line-height: 1;}
.s_faq h3 > div p{}
.s_faq h3 > p{
	font-size: 18px; line-height: calc(31/18);
}
.s_faq .swiper{overflow: visible;}
/* .s_faq .swiper-wrapper{transform: unset !important;} */
.s_faq .swiper-slide{width: 457px; overflow: hidden;}
.s_faq .swiper-slide > div{
	position: relative; width: 100%; background-color: #777;
	border-radius: 11px; overflow: hidden; cursor: pointer;
}
.s_faq .swiper-slide > div::before {
	content: ''; display: block; padding-bottom: calc(9/16*100%);
}
.s_faq .swiper-slide > div > *{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	object-fit: cover;
}


/* 팝업 */
.faq_video_popup{
	position: fixed; z-index: 999999; width: 100%; height: 100%;
	box-sizing: border-box;
	opacity: 0; pointer-events: none; transition: opacity 0.5s;
}
.faq_video_popup.on{
	opacity: 1; pointer-events: auto;
}
.faq_video_popup .bg{
	background-color: rgba(0,0,0,0.8);
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
}
.faq_video_popup i{color: #fff; font-size: 30px; position: relative; z-index: 2; cursor: pointer; display: block; text-align: center; margin-bottom: 10px;}
.faq_video_popup .scrollBx{
	width: 100%; height: 100%; text-align: center;	background-color: rgba(0,0,0,0.8);
	overflow: auto; padding: 40px 0; box-sizing: border-box;
}
.faq_video_popup .flexBx{
	width: 95%; max-width: 1000px; margin: 0 auto;
	display: inline-flex; align-items: center; min-height: 100%; justify-content: center;
}
.faq_video_popup .cont{width: 100%;}
.faq_video_popup .videoBx{
	position: relative;
}
.faq_video_popup .videoBx::before {
	content:''; display: block; padding-bottom: calc(9/16*100%);
}
.faq_video_popup video{position: absolute; left: 0; top: 0; width: 100%; height: 100%; }


@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	.s_faq h3{font-size: max(calc(50/1024*100vw),38px); }
	.s_faq h3 > p{font-size: max(calc(18/1024*100vw),14px); }
	.s_faq .swiper-slide{width: 400px; max-width: 100%;}
}
@media screen and (max-width:820px) {}
@media screen and (max-width:500px) {
	.s_faq h3{margin-bottom: 30px; text-align: left; font-size: 28px; }
	.s_faq h3 > div{margin-bottom: 20px;}
	.s_faq h3 > p{max-width: 280px;}

	.s_faq .swiper-slide{border-radius: 6px;}
}
@media screen and (max-width:320px) {}









/* 2025.10.24 */


/* s_how */
.s_how{}
.s_how .wrap{display: flex; gap: 30px; height: 754px;}
.s_how .wrap > div{height: 100%;}

.s_how .wrap > div.flex{display: flex; flex-direction: column; gap: 30px;}

.s_how .left{min-width: 55.85%;}
.s_how .right{width: 100%;}

.s_how ._card .bg::after{
  	content: '';
  	display: block;
  	background: linear-gradient(to right, #1357df 0%, #3a0895 70%);
  	background-size: cover;
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	transform: scaleX(0); transform-origin: left center;
}

.s_how ._card{width: 100%; height: 100%; cursor: pointer;position: relative; border-radius: 30px; overflow: hidden;}
.s_how ._card .bg{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;background-color: #333;
}
.s_how ._card .bg img{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center bottom;
}
.s_how ._card .bg img.dark{filter: brightness(0.5);}

.s_how ._card .txtBx{
	padding: 60px; box-sizing: border-box; position: relative;
}
.s_how ._card .txtBx .small{
	display: none;
	overflow: hidden; margin-bottom: 1em;
	font-size: 18px;  font-weight: 500;
}
.s_how ._card .txtBx .small div{display: flex; align-items: center;gap: 6px; color: #ceb2ff;}
.s_how ._card .txtBx .small i{
	transform: rotate(45deg); font-size: 0.6em;  height: 2em;
	display: flex; align-items: center; letter-spacing: 0; line-height: 1;
}
.s_how ._card .txtBx .small p{}


.s_how ._card .txtBx h3{font-size: 51px; font-weight: 700; color: #fff;line-height: calc(70/51);margin-bottom: max(calc(15 / 51 * 1em), 15px);}
.s_how ._card .txtBx > p{
	font-size: 20px; font-weight: 500; color: #fff;line-height: calc(35/20);
	opacity: 0; transform: translateY(40px);
}

/* hover */
.s_how ._card .bg::after{transition: transform 1s;}
.s_how ._card .txtBx > p{transition: opacity 1s,transform 1s;}
html.pc .s_how ._card:hover .txtBx > p{opacity: 1; transform: translateY(0);}
html.pc .s_how ._card:hover .bg::after{transform: scaleX(1);}

html.mo .s_how ._card .txtBx > p{opacity: 1; transform: translateY(0);}

@media screen and (max-width:1700px) {
	.s_how .wrap{height: calc(754/1700*100vw);}
	.s_how ._card .txtBx h3{font-size: max(calc(51/1700*100vw),30px); }
}
@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {
	.s_how .wrap{gap: 20px;}
	.s_how ._card{border-radius: 20px;}
	.s_how .wrap > div.flex{gap: 20px;}
	.s_how ._card .txtBx{padding: 40px;}

	.s_how ._card .txtBx > p{font-size: 16px; }
}
@media screen and (max-width:1280px) {
	.s_how .wrap{flex-direction: column; height: auto;}
	.s_how .wrap > div{height: auto;}
	.s_how ._card{height: auto;}
	.s_how ._card .txtBx{padding: 80px 30px; height: auto;}
	.s_how ._card .txtBx .small{font-size: 16px; }
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {}
@media screen and (max-width:500px) {
	.s_how .wrap{gap: 10px;}
	.s_how .wrap > div.flex{gap: 10px;}
	.s_how ._card{border-radius: 10px;}
	.s_how ._card .txtBx{padding: 40px 20px;}
	.s_how ._card .txtBx .small{font-size: 14px; }
	.s_how ._card .txtBx h3{font-size: 22px; font-size: 18px; }
	.s_how ._card .txtBx > p{font-size: 14px;}
}
@media screen and (max-width:320px) {}








/* 섹션별 간격 모음 */
.s_how{padding-bottom: 100px;}
.s_block{}
.s_popup{}
.s_industries .wrap{}
.s_process{}
.s_img{padding: 170px 0;}
.s_slide{padding: 220px 0; padding-top: 100px;}
.s_purple{padding: 160px 0;}
.s_faq{padding: 0 0 160px 0;}


@media screen and (max-width:1600px) {
	.s_block{margin-bottom: 0;}
}
@media screen and (max-width:1440px) {
	.s_process{padding: 160px 0; padding-bottom: 100px;}
}
@media screen and (max-width:1280px) {
	.s_slide{padding: 160px 0;}
}
@media screen and (max-width:1024px) {
	.s_how{padding: 100px 0;}
	.s_block{padding: 100px 0;}
	.s_popup{padding: 100px 0;}
	.s_industries .wrap{padding: 100px 0;}
	.s_process{padding: 100px 0;}
	.s_img{padding: 100px 0;}
	.s_slide{padding: 100px 0;}
	.s_purple{padding: 100px 0;}
	.s_faq{padding: 100px 0;}
}
@media screen and (max-width:820px) {}
@media screen and (max-width:500px) {
	.s_how{padding: 60px 0;}
	.s_block{padding: 60px 0;}
	.s_popup{padding: 60px 0;}
	.s_industries .wrap{padding: 60px 0;}
	.s_process{padding: 60px 0;}
	.s_img{padding: 60px 0;}
	.s_slide{padding: 60px 0;}
	.s_purple{padding: 60px 0;}
	.s_faq{padding: 60px 0 120px;}
}
@media screen and (max-width:320px) {}