@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2022-08-08
******************************************************** */
.ms-preloader { width: 100%; height: 100%; position: fixed; z-index: 9999999; top: 0; left: 0; opacity: 1; visibility: visible; background-color: #000; }

/* ******************  메인 레이아웃 ********************** */
#mainContainer{position: relative;}

/* ******************  메인 인트로 ********************** */
#mainIntro{position: fixed; inset:0; width:100vw; height:100vh; z-index:99999; display: flex; align-items:center; justify-content:center; }
#mainIntro .intro-bg{position: absolute; opacity: 0.3;  width: 130rem; height: 130rem; border-radius:50%; z-index: 1; transition:all 1.5s ease-in-out;}
#mainIntro .intro-bg:before{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius:50%; content: ''; backdrop-filter: blur(12rem); 
background: radial-gradient(ellipse at center,  rgba(38, 117, 221, 1) 0%,rgba(38, 117, 221, 0) 60%);}
#mainIntro .intro-bg.top{top:-65rem; right:-65rem;}
#mainIntro .intro-bg.bottom{bottom:-65rem; left:-65rem;}

.intro-flow{position: relative; z-index:9; display: flex; justify-content:space-between; width:100%; transition:all 1.5s ease-in-out; }
.intro-flow .intro-area-inline{width:calc((100% - 48.4rem) / 2); overflow:hidden; padding:1rem 0;}
.intro-flow-txt{display: flex; align-items:center; transition:all 1.5s ease-in-out;}
.intro-flow-txt .flow-list{display: flex; align-items:center;}
.intro-flow-txt .flow-list .flow-item{display: flex; align-items:center; justify-content:center; font-size:5rem; letter-spacing:0.6em; color:rgba(146,155,167,0.12); font-weight:700; white-space:nowrap;}

@keyframes introFlow {
	from { transform:translate3d(0, 0, 0); }
	to { transform:translate3d(-100%, 0, 0); }
}
.intro-flow-txt .flow-list{animation:introFlow 30s linear infinite; margin:0;}

/* .intro-cover — SVG 로고가 있는 중앙 컨테이너 */
.intro-area {position: absolute; inset:0; display: flex; flex-direction: column; transform:scale(1.5);}
.intro-area-block{position: relative; width:100%; height:100%; background:#010306;}
.intro-area-block:before{position: absolute; content:''; width:100%; height:2px; top:0; left:0; background:#010306; backdrop-filter: blur(5px);}
.intro-area-block:after{position: absolute; content:''; width:100%; height:2px; bottom:0; left:0; background:#010306; backdrop-filter: blur(5px);}
.intro-area-middle{position: relative; display: flex;}
.intro-area-middle:before{position: absolute; content:''; bottom:0; width:100%; height:3px; background:#010306;}
.intro-area-middle:after{position: absolute; content:''; top:0; width:100%; height:1px; background:#010306;}
.intro-area-middle .intro-area-inline{position: relative; width:100%; background:#010306; overflow:hidden;}
.intro-area-middle .intro-area-inline:before{position: absolute; content:''; width:2px; height:100%; top:0; left:0; background:#010306; backdrop-filter: blur(5px);}
.intro-area-middle .intro-area-inline:after{position: absolute; content:''; width:2px; height:100%; top:0; right:0; background:#010306; backdrop-filter: blur(5px);}

.intro-cover{position: relative; height:36rem; transition:all 1.5s ease-in-out;}
.intro-cover:before{position: absolute;content:'';width: 2rem;height: 10rem;top: -8px;left: 10.4rem;transform: rotate(-145deg);z-index: 9;background: linear-gradient(to bottom, rgba(1, 3, 6, 0) 0%, rgba(1, 3, 6, 0) 1%, rgba(1, 3, 6, 1) 70%, rgba(1, 3, 6, 1) 100%);}
.intro-cover:after{position: absolute;content:'';width:2rem;height: 10rem;bottom: -10px;right: 10rem;transform: rotate(35deg);background: linear-gradient(to bottom, rgba(1, 3, 6, 0) 0%, rgba(1, 3, 6, 0) 1%, rgba(1, 3, 6, 1) 70%, rgba(1, 3, 6, 1) 100%);}
.intro-cover .intro-logo-svg{position: relative; width:48.4rem; height:36rem;}
.intro-cover .svg-line{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width: 48rem; height: 36rem;}
.intro-cover .cls-1{stroke:#fff; stroke-width:3px; fill:none; stroke-dasharray: 1200; stroke-dashoffset: 1200; transition:all 1.2s ease-in-out}

.main-page.intro-motion01 .intro-area{transition:all 1.5s ease-in-out; transform:scale(1);}
.main-page.intro-motion02 .intro-cover .cls-1{stroke-dashoffset: 0;}

.main-page.intro-start #mainIntro{pointer-events:none;}
.main-page.intro-start .intro-bg{opacity:0 !important;}
.main-page.intro-start .intro-flow{opacity:0;}
.main-page.intro-start .intro-flow .intro-flow-txt{transform:translateX(-200%);}
.main-page.intro-start .intro-area{transform:scale(5); opacity:0; transition:all 1.5s ease-in-out;}
.main-page.intro-start .intro-cover{transform:scale(1.01);}

@media all and (max-width:800px){
	.intro-flow .intro-area-inline{width:calc((100% - 24rem) / 2);}
	.intro-cover{height:18rem;}
	.intro-cover:before{top:-9px; left:41px;}
	.intro-cover:after{bottom:-9px; right:41px;}
	.intro-cover .intro-logo-svg{width:24.2rem; height:18rem;}
	.intro-cover .svg-line{width: 24rem; height: 18rem;}
}


/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:100vh; position:relative; background-color:#000 }
.main-visual-con .slick-track,
.main-visual-con .slick-list {
	-webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-visual-con, 
.main-visual-con .slick-list,  
.main-visual-con .slick-track, 
.main-visual-item{
	height:100%;
}
.main-visual-con{z-index:1;}
/* 메인 비주얼 :: 이미지 */
.main-visual-item{position:relative;}
.main-visual-item .main-visual-img{
	width:100%;
	height:100%;
	background-size:cover !important;
	transform: scale(1.08,1.08);
}
.main-visual-item .main-visual-m-img{display:none;}
.main-visual-item.active-item .main-visual-img{animation: image-zoom-out 8s 0s forwards;}
/* 메인 비주얼 :: 동영상 */
.main-visual-item .background-video{position:absolute; top:0; left:0px; width:100%; height:100%; overflow:hidden;}
.main-visual-item .background-video:before{position: absolute; content:''; inset:0; width:100%; height:100%; background:rgba(0,0,0,0.3); z-index:1;}
.main-visual-item .background-video video{
	width: 100vw;
	height: calc(56.25vw + 300px); /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
	min-height: calc(100vh + 300px);
	min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	pointer-events:none;
	transition: opacity 3s 0.2s;
}

/* 메인 비주얼 :: 텍스트 */
.main-visual-txt-con{
	position:absolute; 
	left:0px; top:0;
	width:100%; 
	height:100%;
	z-index:1;
}
.main-visual-txt-box{
	display:flex;
	align-items:center;
	height:100%;
	padding-inline:1rem;
	padding-bottom:8.5rem;
	box-sizing:border-box;
}
.main-visual-txt-box .main-visual-txt1{
	opacity:0; 
}
.main-visual-txt-box .main-visual-txt1{font-size:8rem; font-weight:400; line-height:1; letter-spacing:-0.02em; color:#fff;}
.main-visual-txt-box .main-visual-txt1 .small{font-size:0.8em; font-weight:400; line-height:1.25;}
/* 메인 비주얼 :: 텍스트 :: active효과 */
.visual-start .active-item .main-visual-txt1{
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.visual-start .active-item .main-visual-txt1{animation-delay:0.1s;}
.visual-start .main-visual-txt-box .cm-word-split-JS.splitting .char{animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.visual-start .active-item .main-visual-txt-box .cm-word-split-JS.splitting .char{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}

/* 메인 비주얼 :: Animation */
@keyframes image-zoom-out {
	from {
		transform: scale(1.08,1.08)
	}
	to {
		transform: scale(1.0,1.0)
	}
}
@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}
@keyframes text-fade-out {
	from {
		opacity:1.0;filter:Alpha(opacity=100);
	}
	to {
		opacity:0;filter:Alpha(opacity=0);
	}
}


/* 메인 비주얼 :: 버튼 */
.main-visual-custom{position: absolute; top:0; width:100%; height:100%; z-index:9;}
.main-visual-arrows{position: absolute; top:50%; margin-top:10rem; margin-left:7rem; opacity:0; transform:translateY(50%); transition:var(--transition-custom2);}
.main-visual-arrows .slick-arrow{display: inline-flex; align-items:center; height:5.4rem; font-size:3.2rem; color:rgba(255,255,255,0.4); transition:var(--transition-custom);}
.main-visual-arrows .slick-arrow:hover{color:#fff;}

/* 메인 비주얼 :: Dots */
.main-visual-dots{position: absolute; bottom:10rem; opacity:0; transform:translateY(50%); transition:var(--transition-custom2);}
.main-visual-dots ul{position: relative; display: flex; align-items:center;}
.main-visual-dots ul li{}
.main-visual-dots ul li button{position: relative; width:19.5rem; text-align:left;}
.main-visual-dots ul li button:before{position: absolute; content:''; width:calc(100% - 8px); height:2px; background:rgba(255,255,255,0.15); top:3px; left:8px; transition:var(--transition-custom)}
.main-visual-dots ul li button:after{position: absolute; content:''; width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,0.15); top:0; left:0; transition:var(--transition-custom)}
.main-visual-dots ul li button .line{position: absolute; top:3px; left:8px; height:2px; background:#fff; transition:var(--transition-custom)}
.main-visual-dots ul li button .txt{white-space:nowrap; font-size:1.6rem; line-height:1.3; letter-spacing:-0.02em; font-weight:400; color:rgba(255,255,255,0.4); padding-top:1.5rem; transition:var(--transition-custom)}

.main-visual-dots ul li.slick-active button:after{background:#fff;}
.main-visual-dots ul li.slick-active button .line{transition:0s}
.main-visual-dots ul li.slick-active button .txt{color:#fff;}

/* 재생/일시정지 버튼 */
.main-visual-control{position: absolute; top:50%; margin-top:10rem; opacity:0; transform:translateY(50%); transition:var(--transition-custom2);}
.main-visual-control .visual-control-btn{}
.main-visual-control .visual-control-btn span{display: flex; align-items:center; justify-content:center; width:5.4rem; height:5.4rem; border:1px solid rgba(255,255,255,0.16); background:rgba(255,255,255,0.1); backdrop-filter:blur(2rem); border-radius:50%; box-sizing:border-box; transition:var(--transition-custom)}
.main-visual-control .visual-control-btn span i{font-size:2rem; color:#fff; transition:var(--transition-custom)}
.main-visual-control .visual-control-btn:hover span{background:#fff; border-color:#fff;}
.main-visual-control .visual-control-btn:hover span i{color:#000;}

/* visual-start */
.visual-start .main-visual-arrows{opacity:1; transform:translateY(0); transition-delay:0.6s;}
.visual-start .main-visual-dots{opacity:1; transform:translateY(0); transition-delay:0.8s;}
.visual-start .main-visual-control{opacity:1; transform:translateY(0); transition-delay:0.6s;}


/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-tit-box{}
.main-tit-box .main-tit-en{display: inline-block; font-size:1.6rem; line-height:2.8rem; letter-spacing:-0.02em; color:#fff; padding:0 1.7rem; box-sizing:border-box; border:1px solid #fff; border-radius:3rem; margin-bottom:3rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-tit-box .main-tit{color:#fff; font-size:6.2rem; font-weight:600; line-height:1.22; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-tit-box .main-txt{font-size:2rem; line-height:1.5; letter-spacing:-0.03em; color:rgba(255,255,255,0.6); font-weight:500; margin-top:1.5rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
/* animated */
.animated .main-tit-box .main-tit-en{opacity:1; transform:translateY(0); transition-delay:0s;}
.animated .main-tit-box .main-tit{opacity:1; transform:translateY(0); transition-delay:0.2s;}
.animated .main-tit-box .main-txt{opacity:1; transform:translateY(0); transition-delay:0.4s;}

/* 공통 :: 버튼 */
.cm-main-btn{display: flex; align-items:center; justify-content:space-between; width:25.6rem; height:6.4rem; border:2px solid #fff; color:#fff; border-radius:6.4rem; box-sizing:border-box; padding-inline:4rem 3rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom);}
.cm-main-btn span{font-size:2rem; line-height:1.5; letter-spacing:-0.03em; font-weight:500;}
.cm-main-btn i{font-size:2.6rem; }
.animated .cm-main-btn{opacity:1; transform:translateY(0); transition:var(--transition-custom), opacity 0.8s 0.6s ease-in-out, transform 0.8s 0.6s ease-in-out;}

.cm-main-btn:hover{background:#fff; color:#000;}

@media all and (max-width:800px){
	/* -------- 메인 컨텐츠 :: 공통 -------- */
	/* 공통 :: 타이틀 */
	.main-tit-box .main-tit-en{font-size:1.4rem; padding:0 2rem; margin-bottom:2rem;}
	.main-tit-box .main-tit{font-size:4rem;}
	.main-tit-box .main-txt{font-size:1.8rem;}

	/* 공통 :: 버튼 */
	.cm-main-btn{width:20rem; height:6rem; padding-inline:3rem 2rem;}
	.cm-main-btn span{font-size:1.8rem;}
	.cm-main-btn i{font-size:2.2rem;}
}

/* ****************** 메인 컨텐츠 :: Product ********************** */
#mainProduct{padding-top: 22rem; padding-bottom:22rem;}
.main-prd-wrap{position: relative;}
.main-prd-wrap .main-prd-select-box{position: absolute; top:calc(50% + 7rem); left:0; width:38.235%; max-width:650px; z-index:99; display: flex; flex-wrap:wrap; margin:-0.5rem;}
.main-prd-wrap .main-prd-select-box .select-item{width:calc(33.33% - 1rem); margin:0.5rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-wrap .main-prd-select-box .select-item a{display: flex; align-items:center; justify-content:center; width:100%; height:8rem; font-size:1.8rem; line-height:1.625; letter-spacing:-0.03em; color:#fff; font-weight:600; border:3px solid rgba(255,255,255,0.06); border-radius:1.4rem; transition:var(--transition-custom); text-align:center;}
.main-prd-wrap .main-prd-select-box .select-item a:hover,
.main-prd-wrap .main-prd-select-box .select-item.selected a{border-color:var(--main-color); color:var(--main-color);}

.main-prd-slide-wrap{position: relative; display: flex; justify-content: flex-end;}
.main-prd-left-box{width:50%; max-width:650px; position: absolute; bottom:50%; left:0; padding-right:3rem; box-sizing:border-box;}
.main-prd-left-box .tit-box{}
.main-prd-left-box .tit-box .tit-en{display: inline-block; font-size:1.6rem; line-height:2.8rem; letter-spacing:-0.02em; color:#fff; padding:0 1.7rem; box-sizing:border-box; border:1px solid #fff; border-radius:3rem; margin-bottom:3.2rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-left-box .tit-box .tit{font-size:7rem; line-height:1; letter-spacing:-0.03em; color:#fff; font-weight:700; margin-bottom:2.1rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-left-box .tit-box .txt{font-size:1.8rem; line-height:1.55; letter-spacing:-0.03em; color:#fff; font-weight:500; margin-bottom:1.8rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-left-box .tit-box .category-box{display: flex; flex-wrap:wrap; margin:-0.8rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-left-box .tit-box .category-box span{margin:0.8rem; font-size:1.6rem; line-height:1.625; letter-spacing:-0.03em; color:rgba(255,255,255,0.3);}

.main-prd-right-box{display: flex; justify-content:space-between; width:50%; max-width:755px;}
.main-prd-right-box .main-prd-img-slide{width:88.1%; max-width:665px; background:rgba(255,255,255,0.05); backdrop-filter:blur(3rem); border-radius:3rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-right-box .main-prd-img-slide .slide-item{position: relative;}
.main-prd-right-box .main-prd-img-slide .slide-item .img-box{position: relative; display: block; width:100%; aspect-ratio:1;}
.main-prd-right-box .main-prd-img-slide .slide-item .img-box img{position: absolute; inset:0; max-width:100%; max-height:100%; object-fit:cover; margin:auto; padding-bottom: 5rem;}
.main-prd-right-box .main-prd-img-slide .slide-item .tit{position: absolute; bottom:3.4rem; left:5rem; font-size:3.2rem; line-height:1.375; letter-spacing:-0.03em; color:#fff; font-weight:700; opacity:0; transform:translateY(20px); }
.main-prd-right-box .main-prd-img-slide .slide-item.slick-current .tit{opacity:1; transform:translateY(0); transition:var(--transition-custom); transition-delay:0.6s }

.main-prd-right-box .prd-slide-custom-box{display: flex; flex-direction:column; justify-content: space-between; align-items: center; width:calc(11.9% - 1.5rem); background:rgba(255,255,255,0.05); backdrop-filter:blur(3rem); border-radius:4rem; padding:3rem 0; box-sizing:border-box; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow{position: relative; }
.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow:before{position: absolute; content:''; top:50%; left:50%; transform:translate(-50%, -50%); width:2.2rem; height:2px; background:#d9d9d9; opacity:0.1;}
.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow .slick-arrow{display: block; font-size:3.2rem; color:rgba(255,255,255,0.3); margin:0.7rem 0; transition:var(--transition-custom);}
.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow .slick-arrow:hover{color:#fff;}
.main-prd-right-box .prd-slide-custom-box .prd-slide-dots{}
.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul{}
.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li{margin:0.7rem 0;}
.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li button{width:0.8rem; height:0.8rem; border-radius:0.8rem; background:rgba(255,255,255,0.4); transition:var(--transition-custom); text-indent:-9999px; font-size:0;}
.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li.slick-active button{height:4rem; background:#fff;}

/* animated */
.animated .main-prd-wrap .main-prd-select-box .select-item{opacity:1; transform:translateY(0);}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(1){transition-delay:0.3s;}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(2){transition-delay:0.4s;}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(3){transition-delay:0.5s;}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(4){transition-delay:0.6s;}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(5){transition-delay:0.7s;}
.animated .main-prd-wrap .main-prd-select-box .select-item:nth-child(6){transition-delay:0.8s;}

.animated .main-prd-slide-wrap.animated .main-prd-left-box .tit-box .tit-en{opacity:1; transform:translateY(0); transition-delay:0s;}
.animated .main-prd-slide-wrap.animated .main-prd-left-box .tit-box .tit{opacity:1; transform:translateY(0); transition-delay:0.1s;}
.animated .main-prd-slide-wrap.animated .main-prd-left-box .tit-box .txt{opacity:1; transform:translateY(0); transition-delay:0.2s;}
.animated .main-prd-slide-wrap.animated .main-prd-left-box .tit-box .category-box{opacity:1; transform:translateY(0); transition-delay:0.3s;}

.animated .main-prd-slide-wrap.animated .main-prd-right-box .main-prd-img-slide{opacity:1; transform:translateY(0); transition-delay:0.4s;}
.animated .main-prd-slide-wrap.animated .main-prd-right-box .prd-slide-custom-box{opacity:1; transform:translateY(0); transition-delay:0.5s;}

@media all and (max-width:1280px){
	.main-prd-wrap .main-prd-select-box{width: calc(50% - 3rem);}
	
	.main-prd-right-box .main-prd-img-slide .slide-item .img-box{aspect-ratio: 0.75;}
}
@media all and (max-width:800px){
	#mainProduct{padding-top: 9.5rem; padding-bottom:12rem;}
	.main-prd-wrap .sub-drop-menu-style{margin-bottom:3.6rem;}
	.main-prd-wrap .main-prd-select-box{display: none; position: absolute; top:calc(100% - 2.4rem); width:100%; max-width:none; margin:0 0 3.5rem; padding-top:2.4rem;}
	.main-prd-wrap .main-prd-select-box .select-item{width:100%; margin:0rem;}
	.main-prd-wrap .main-prd-select-box .select-item a{width:100%; height:auto; font-size:1.6rem; border:none; text-align:left; box-sizing:border-box; color:#000;}
	
	.main-prd-wrap .sub-drop-menu-style ul li.selected a em{color:var(--main-color);}
	
	.main-prd-slide-wrap{flex-direction: column;}
	.main-prd-left-box{position: relative; inset:0; width:100%; margin-bottom:7rem;}
	.main-prd-left-box .tit-box .tit-en{font-size:1.4rem; line-height:2.8rem; padding:0 2rem; margin-bottom:2rem;}
	.main-prd-left-box .tit-box .tit{font-size:4.5rem; margin-bottom:2rem;}
	.main-prd-left-box .tit-box .txt{font-size:1.6rem; margin-bottom:2rem;}
	
	.main-prd-right-box{width:100%;}
	.main-prd-right-box .main-prd-img-slide .slide-item .img-box{aspect-ratio:1;}
	.main-prd-right-box .main-prd-img-slide .slide-item .tit{bottom:2.4rem; left:2.5rem; font-size:2.4rem;}

	.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow .slick-arrow{font-size:2rem;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li{margin:0.4rem 0;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li button{width:0.4rem; height:0.4rem;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li.slick-active button{height:2.3rem; background:#fff;}
}
@media all and (max-width:480px){
	.main-prd-right-box{display: block;}
	.main-prd-right-box .main-prd-img-slide{width:100%; margin-bottom:1.2rem;}
	.main-prd-right-box .main-prd-img-slide .slide-item .img-box img{max-width:60%; max-height:70%; border-radius:3rem;}
	.main-prd-right-box .prd-slide-custom-box{width:100%; flex-direction: row; padding:1.2rem 2.5rem; border-radius:3rem;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow{display: flex;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow:before{width:2px; height:1.6rem;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-arrow .slick-arrow{margin:0 0.5rem;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul{display: flex; margin:-1rem 0;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li{margin:0 3px;}
	.main-prd-right-box .prd-slide-custom-box .prd-slide-dots ul li.slick-active button{width:2rem; height:0.4rem;}
}


/* ****************** 메인 컨텐츠 :: About ********************** */
#mainAbout{margin-bottom:30rem;}
.main-about-top{display: flex; align-items:flex-end; justify-content:space-between;}
.main-about-banner{position: relative; margin-top:5rem;}
.main-about-banner .banner-bg{position: relative; width:100%; height:76rem; border-radius:4rem; overflow:hidden; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-about-banner .banner-bg img{position: absolute; inset:0; width:100%; height:100%; object-fit: cover;}

.main-about-banner .banner-txt-box{position: absolute; inset:7rem 7.5rem 7rem auto; background:rgba(255,255,255,0.05); border-radius:3.2rem; backdrop-filter:blur(5rem); box-sizing:border-box; padding:7.5rem 5rem 5rem; min-width:47rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-about-banner .banner-txt-box:before{position: absolute; content:'\e907'; font-family:'xeicon'; font-size:7rem; color:#fff; transform:rotate(-45deg); bottom:5rem; left:5rem; transition:var(--transition-custom);}
.main-about-banner .banner-txt-box .tit{font-size:4rem; line-height:1.25; letter-spacing:-0.03em; color:#fff; font-weight:600;}
.main-about-banner .banner-txt-box .txt{font-size:1.8rem; line-height:1.55; letter-spacing:-0.03em; color:rgba(255,255,255,0.6); font-weight:500; margin-top:1.5rem;}

/* hover */
.main-about-banner .banner-txt-box:hover:before{transform:translate(15px, -15px) rotate(-45deg);}

/* animated */
.animated .main-about-banner .banner-bg{opacity:1; transform:translateY(0); transition-delay:0.4s;}
.animated .main-about-banner .banner-txt-box{opacity:1; transform:translateY(0); transition-delay:0.8s;}

@media all and (max-width:1280px){
	.main-about-banner .banner-txt-box{right:var(--area-padding); min-width: auto; width: 50%;}
}
@media all and (max-width:800px){
	#mainAbout{margin-bottom:12rem;}
	.main-about-top{display: flex; align-items:flex-end; justify-content:space-between;}
	.main-about-banner{position: relative; margin-top:5rem;}
	.main-about-banner .banner-bg{height:70rem; border-radius:2rem;}

	.main-about-banner .banner-txt-box{inset:auto 2rem 2rem; border-radius:2.4rem; padding:4rem 3rem 13rem; min-width: auto; width: calc(100% - 4rem); box-sizing: border-box;}
	.main-about-banner .banner-txt-box:before{font-size:5rem; bottom:2rem; left:2rem;}
	.main-about-banner .banner-txt-box .tit{font-size:2.4rem;}
	.main-about-banner .banner-txt-box .txt{font-size:1.6rem; margin-top:2rem;}
}
@media all and (max-width:480px){
	.main-about-top{display: block;}
	.main-about-top .cm-main-btn{margin-top:4rem; width:100%;}
}

/* ****************** 메인 컨텐츠 :: Business ********************** */
#mainBusiness{margin-bottom:10rem;}
#mainBusiness .main-tit-box{text-align:center;}

.pin-section { height: 100vh; position: relative;}

.main-business-wrap{margin-top:8rem;}
.main-business-swiper{overflow:visible !important; display: flex;}
.main-business-wrap .swiper-wrapper{gap: 25px;}
.main-business-swiper .main-business-item{max-width:550px;}
.main-business-swiper .main-business-item a{position: relative; display: flex; flex-direction:column; justify-content:space-between; width:100%; aspect-ratio:0.7857; padding:4.5rem; box-sizing:border-box; border-radius:3rem; overflow:hidden; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-business-swiper .main-business-item a .bg{position: absolute; inset:0;}
.main-business-swiper .main-business-item a .bg img{width:100%; height:100%; object-fit:cover; transition:var(--transition-custom);}
.main-business-swiper .main-business-item a .num{position: relative; font-size:5.3rem; line-height:0.83; letter-spacing:-0.03em; color:rgba(255,255,255,0.16); font-weight:600;}
.main-business-swiper .main-business-item a .txt-box{position: relative;}
.main-business-swiper .main-business-item a .txt-box .tit{font-size:3.4rem; line-height:1.29; letter-spacing:-0.02em; color:#fff; font-weight:600;}
.main-business-swiper .main-business-item a .txt-box .txt{font-size:1.6rem; line-height:1.625; letter-spacing:-0.03em; color:rgba(255,255,255,0.5); font-weight:500; margin-top:1.5rem;}

/* hover */
.main-business-swiper:has(.main-business-item a:hover) .main-business-item a img{filter:grayscale(1);}
.main-business-swiper .main-business-item a:hover img{filter:grayscale(0) !important;}
.main-business-swiper .main-business-item a:hover .bg img{transform:scale(1.05);}

/* animated */
.animated .main-business-swiper .main-business-item a{opacity:1; transform:translateY(0);}
.animated .main-business-swiper .main-business-item:nth-child(1) a{transition-delay:0.4s;}
.animated .main-business-swiper .main-business-item:nth-child(2) a{transition-delay:0.5s;}
.animated .main-business-swiper .main-business-item:nth-child(3) a{transition-delay:0.6s;}
.animated .main-business-swiper .main-business-item:nth-child(4) a{transition-delay:0.7s;}
.animated .main-business-swiper .main-business-item:nth-child(n+5) a{transition-delay:0.8s;}

@media all and (max-width:1280px){
	.main-business-swiper .main-business-item a{padding:4.5rem var(--area-padding);}
}
@media all and (max-width:800px){
	#mainBusiness{margin-bottom:0;}
	.main-business-wrap{margin-top:6rem;}
	.main-business-swiper .main-business-item a{padding:3.5rem 2rem; border-radius:2rem;}
	.main-business-swiper .main-business-item a .num{font-size:4rem;}
	.main-business-swiper .main-business-item a .txt-box .tit{font-size:2.8rem;}
	.main-business-swiper .main-business-item a .txt-box .txt{font-size:1.4rem;}
}
@media all and (max-width:480px){
	#mainBusiness{margin-bottom:calc(-1 * (50vh - 50vw + 10rem));}
	.main-business-wrap{width:80%;}
}


/* ****************** 메인 컨텐츠 :: ESG ********************** */
#mainEsg{margin-bottom:30rem;}
.main-esg-flow{position: relative; display: flex; align-items:center; margin:7rem 0;  transition:2s all ease-in-out; opacity:0; transform:translateX(0%);}
.main-esg-flow .flow-list{display: flex; align-items:center;}
.main-esg-flow .flow-list .flow-item{display: flex; align-items:center; justify-content:center; height:4.7rem; margin:0 5.4rem;}
.main-esg-flow .flow-list .flow-item svg{width:auto; height:100%;}
.main-esg-flow .flow-list .flow-item svg *{fill:rgba(255,255,255,0.1);}

@keyframes flow {
	from { transform:translate3d(0, 0, 0); }
	to { transform:translate3d(-100%, 0, 0); }
}
.main-esg-flow .flow-list{animation:flow 30s linear infinite; margin:0;}

.main-esg-con{display: flex;}
.main-esg-left-box{position: relative; width:50%; aspect-ratio:0.911; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-esg-left-box .img-box{position: absolute; top:0; right:0; width:100%; height:100%; display: flex; align-items: flex-end; padding-bottom:6rem; padding-right:5rem; box-sizing:border-box; transition:var(--transition-custom); transition-delay:0.2s; opacity:0;}
.main-esg-left-box .img-box span{position: absolute; top:0; right:0; display: block; width:50vw; height:100%; border-radius:0 6rem 6rem 0; overflow:hidden;}
.main-esg-left-box .img-box span img{width:100%; height:100%; object-fit:cover;}
.main-esg-left-box .img-box .txt{position: relative; font-size:2rem; line-height:1.5; letter-spacing:-0.03em; color:#fff; font-weight:600;}

.main-esg-right-box{width:50%; padding-left:13rem; box-sizing:border-box; display: flex; align-items: center;}
.main-esg-right-box .main-esg-list{width:100%;}
.main-esg-right-box .main-esg-list .list-item{opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-esg-right-box .main-esg-list .list-item a{position: relative; display: flex; align-items:center; padding:1.4rem 0; box-sizing:border-box; margin:2.7rem 0;}
.main-esg-right-box .main-esg-list .list-item a:before{position: absolute; content:''; bottom:0; left:0; width:0; height:4px; background: linear-gradient(90deg, transparent 0%, #2675DD 100%);	transition:var(--transition-custom);}
.main-esg-right-box .main-esg-list .list-item a:after{position: absolute; content:'\e907'; top:50%; right:0; font-family:'xeicon'; font-size:8rem; color:var(--main-color); transform:translateY(-50%) rotate(-45deg); opacity:0; transition:var(--transition-custom);}
.main-esg-right-box .main-esg-list .list-item a .category{width:13rem; font-size:1.8rem; letter-spacing:-0.03em; color:rgba(255,255,255,0.4); font-weight:600; transition:var(--transition-custom); transform-origin: left;}
.main-esg-right-box .main-esg-list .list-item a .tit{width:calc(100% - 13rem); font-size:6.6rem; letter-spacing:-0.03em; color:#fff; font-weight:600; transition:var(--transition-custom);}

.main-esg-right-box .main-esg-list .list-item a:hover:before{width:100%;}
.main-esg-right-box .main-esg-list .list-item a:hover:after{opacity:1;}
.main-esg-right-box .main-esg-list .list-item a:hover .category,
.main-esg-right-box .main-esg-list .list-item a:hover .tit{color:var(--main-color);}
.main-esg-right-box .main-esg-list .list-item a:hover .category{transform:scale(1.1)}

.main-esg-left-box .img-box.active{opacity:1; transition-delay:0s;}

/* animated */
.animated .main-esg-flow{opacity:1; transform:translateX(-100%);}
.animated .main-esg-left-box{opacity:1; transform:translateY(0);}
.animated .main-esg-right-box .main-esg-list .list-item{opacity:1; transform:translateY(0);}
.animated .main-esg-right-box .main-esg-list .list-item:nth-child(1){transition-delay:0.2s;}
.animated .main-esg-right-box .main-esg-list .list-item:nth-child(2){transition-delay:0.3s;}
.animated .main-esg-right-box .main-esg-list .list-item:nth-child(3){transition-delay:0.4s;}
.animated .main-esg-right-box .main-esg-list .list-item:nth-child(4){transition-delay:0.5s;}

@media all and (max-width:1280px){
	.main-esg-right-box{padding-left:5rem;}
	.main-esg-right-box .main-esg-list .list-item a .tit{font-size:4.5rem;}
	.main-esg-right-box .main-esg-list .list-item a:after{font-size:5rem;}
}
@media all and (max-width:800px){
	#mainEsg{margin-bottom:12rem;}
	.main-esg-flow .flow-list .flow-item{height:3rem; margin:0 3rem;}
	
	.main-esg-con{flex-direction: column-reverse;}
	
	.main-esg-right-box{padding-left:0; width:100%; margin-bottom:6rem;}
	.main-esg-right-box .sub-drop-open-btn-style{display: flex; align-items: center; width:100%; border:none; /* border-radius:0; */ border-bottom:0px; /* padding:0; */}
	.main-esg-right-box .sub-drop-open-btn-style .arrow{right:1rem;}
	.main-esg-right-box .main-esg-list{top:calc(100% - 2.5rem);}
	.main-esg-right-box .main-esg-list .list-item a{pointer-events:none; padding:1.5rem; margin:0;}
	.main-esg-right-box .main-esg-list .list-item a .category{font-size:1.4rem; width:10rem; color:#000;}
	.main-esg-right-box .main-esg-list .list-item a .tit{font-size:2rem; color:#000; width:calc(100% - 10rem);}
	.main-esg-right-box .main-esg-list .list-item.selected a .category,
	.main-esg-right-box .main-esg-list .list-item.selected a .tit{color:var(--main-color);}
	
	.main-esg-txt-JS .category{display: inline-block; font-size:1.6rem; letter-spacing:-0.03em; font-weight:600; width:9rem}
	.main-esg-txt-JS .tit{display: inline-block; font-size:2rem; letter-spacing:-0.03em; font-weight:600; width:calc(100% - 9rem);}
	
	.main-esg-left-box{width:100%; aspect-ratio: 1;}
	.main-esg-left-box .img-box{inset:auto; padding:0 2rem 3rem;}
	.main-esg-left-box .img-box:before{position: absolute; content:'\e907'; font-family:'xeicon'; font-size:4rem; color:#fff; top:1.5rem; right:1rem; transform:rotate(-45deg); z-index:1;}
	.main-esg-left-box .img-box .txt{font-size:1.6rem;}
	.main-esg-left-box .img-box span{width:100%; border-radius:2rem;}
	
}


/* ****************** 메인 컨텐츠 :: News ********************** */
#mainNews{margin-bottom:27rem;}
.main-news-wrap{display: flex;}
.main-news-wrap .main-tit-box{width:34.7%;}
.main-news-wrap .main-tit-box .news-arrow-box{margin-top:5.5rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-news-wrap .main-tit-box .news-arrow-box button{font-size:4.4rem; color:rgba(255,255,255,0.2); margin:0 -3px; transition:var(--transition-custom);}
.main-news-wrap .main-tit-box .news-arrow-box button:hover{color:#fff;}

.main-news-slide-wrap{width:65.3%;}
.main-news-slide-wrap .news-swiper-pagination{position: relative; margin-top:4.7rem; width:100%; height:4px; background:rgba(255,255,255,0.06); border-radius:4px; overflow:hidden;  opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.main-news-slide-wrap .news-swiper-pagination span{background:#fff; border-radius:4px;}
.main-news-slide-con{width:calc(100% + 30rem); margin-right:-30rem; overflow:hidden;}
.main-news-slide-con .main-news-swiper{width:100%; max-width:865px; margin-left:0; overflow:visible;}
.main-news-slide-con .main-news-item{}
.main-news-slide-con .main-news-item a{display: block; padding:2.2rem; box-sizing:border-box; border-radius:3rem; background:rgba(255,255,255,0.05); backdrop-filter:blur(3rem); opacity:0; transform:translateY(50px); transition:all 0.8s calc(var(--news-num) * 0.1s + 0.3s) ease-in-out, background 0.4s 0s ease-in-out;}
.main-news-slide-con .main-news-item a .txt-box{padding:2rem 2rem 7.5rem; box-sizing:border-box;}
.main-news-slide-con .main-news-item a .txt-box .category{position: relative; display: inline-block; font-size:1.4rem; letter-spacing:-0.03em; color:#fff; font-weight:600; margin-bottom:2.5rem;}
.main-news-slide-con .main-news-item a .txt-box .category:before{position: absolute; content:''; width:100%; height:2px; background:#fff; bottom:-4px; left:0;}
.main-news-slide-con .main-news-item a .txt-box .tit{font-size:2.4rem; line-height:1.416; letter-spacing:-0.03em; color:#fff; font-weight:500; min-height:10.1rem; margin-bottom:2.2rem;}
.main-news-slide-con .main-news-item a .txt-box .date{font-size:1.6rem; line-height:1.55; color:rgba(255,255,255,0.4); font-weight:500;}
.main-news-slide-con .main-news-item a .img-box{}
.main-news-slide-con .main-news-item a .img-box span{display: block; position: relative; width:100%; height:0; padding-top:60.53%; border-radius:1.4rem; overflow:hidden;}
.main-news-slide-con .main-news-item a .img-box span img{position: absolute; inset:0; object-fit:cover; width:100%; height:100%; transition:var(--transition-custom);}

.main-news-slide-con .main-news-item a:hover{background:rgba(38, 117, 221, 0.2);}
.main-news-slide-con .main-news-item a:hover .img-box span img{transform:scale(1.05);}

/* animated */
.animated .main-news-wrap .main-tit-box .news-arrow-box{opacity:1; transform:translateY(0); transition-delay:0.5s;}
.animated .main-news-slide-wrap .news-swiper-pagination{opacity:1; transform:translateY(0); transition-delay:0.5s;}
.animated .main-news-slide-con .main-news-item a{opacity:1; transform:translateY(0);}

@media all and (max-width:1280px){
	.main-news-wrap .main-tit-box{width:50%;}
	.main-news-slide-wrap{width:50%;}
}
@media all and (max-width:800px){
	#mainNews{margin-bottom:12rem;}
	.main-news-wrap{flex-direction:column;}
	.main-news-wrap .main-tit-box{width:100%; margin-bottom:5rem;}
	.main-news-slide-wrap{width:100%;}
	.main-news-slide-con{width: calc(100% + var(--area-padding)); margin-right: calc(-1 * var(--area-padding));}
	.main-news-slide-con .main-news-swiper{width:85%;}
	.main-news-slide-con .main-news-item a .txt-box{padding:1.5rem 0 4rem;}
	.main-news-slide-con .main-news-item a .txt-box .tit{font-size:1.8rem; margin-bottom:1.5rem;}
	.main-news-slide-con .main-news-item a .txt-box .date{font-size:1.5rem;}
}

/* ****************** 메인 컨텐츠 :: 문의 ********************** */
.main-inquiry-wrap{display: flex;}
.main-inquiry-wrap .inquiry-item{position: relative; width:41%; height:100vh; display: flex; align-items: flex-end; padding:12rem 8.5rem; box-sizing:border-box; background:#1f1f1f;  transition:var(--transition-custom);}
.main-inquiry-wrap .inquiry-item .bg{position: absolute; content:''; width:100%; height:100%; inset:0;}
.main-inquiry-wrap .inquiry-item .bg:before{position: absolute; content:''; width:100%; height:100%; inset:0; background:rgba(0,0,0,0.5); z-index:1; opacity:1; transition:var(--transition-custom);}
.main-inquiry-wrap .inquiry-item .bg:after{position: absolute; content:'\e907'; bottom:13rem; right:11rem; font-family:'xeicon'; font-size:6rem; color:#fff; opacity:0; transition:var(--transition-custom);}
.main-inquiry-wrap .inquiry-item .bg img{position: relative; width:100%; height:100%; object-fit:cover;}
.main-inquiry-wrap .inquiry-item .main-tit-box{position: relative; z-index:2;}
.main-inquiry-wrap .inquiry-item .main-tit-box .main-tit-en{transition:var(--transition-custom);}
.main-inquiry-wrap .inquiry-item .main-tit-box .main-tit{font-size:4.4rem; line-height:1.22;}

.main-inquiry-wrap .inquiry-item.active{width:59%; padding:12rem 11rem;}
.main-inquiry-wrap .inquiry-item.active .bg:before{opacity:0;}
.main-inquiry-wrap .inquiry-item.active .main-tit-box .main-tit-en{background:#fff; color:#000;}
.animated .main-inquiry-wrap .inquiry-item.active .bg:after{opacity:1;}

@media all and (max-width:1280px){
	.main-inquiry-wrap .inquiry-item,
	.main-inquiry-wrap .inquiry-item.active{padding:10rem var(--area-padding);}
	.main-inquiry-wrap .inquiry-item .bg:after{bottom:9rem; right:var(--area-padding);}
}
@media all and (max-width:800px){
	.main-inquiry-wrap{flex-direction:column;}
	.main-inquiry-wrap .inquiry-item{width:100%; height:auto; padding:3rem 2.5rem; aspect-ratio: 1.6;}
	.main-inquiry-wrap .inquiry-item .bg:before{display: none;}
	.main-inquiry-wrap .inquiry-item .bg:after{position: absolute; content:'\e907'; bottom:auto; top:3rem; right:2.5rem; font-family:'xeicon'; font-size:4rem; opacity:1; }
	.main-inquiry-wrap .inquiry-item .main-tit-box .main-tit{font-size:2.4rem;}
	.main-inquiry-wrap .inquiry-item.active{width:100%; padding:3rem 2.5rem;}
}
@media all and (max-width:480px){
	.main-inquiry-wrap .inquiry-item{aspect-ratio: 1;}
}


/* ****************** 우측 메뉴 ********************** */
#rightMenu{position: fixed; bottom:-5rem; right:50%; margin-right:-89rem; z-index:999; transition:var(--transition-custom2);}
#rightMenu > ul{}
#rightMenu > ul > li{position: relative; margin-top:0.5rem;}
#rightMenu > ul > li > a{display: flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-align:center; width:7rem; height:7rem; border-radius:50%;}
#rightMenu > ul > li > a i{font-size:1.6rem;}
#rightMenu > ul > li > a .txt{font-size:1.2rem;}

#rightMenu > ul > li:nth-child(1) > a{border:1px solid #fff; background:rgba(255,255,255,0.1); box-sizing:border-box; backdrop-filter: blur(10px);}
#rightMenu > ul > li:nth-child(2) > a{background:var(--main-color);}

#rightMenu > ul > li .support-menu-box{position: absolute; bottom:calc(100% + 1rem); right:0; width:40rem; padding:2.2rem; box-sizing:border-box; border-radius:3rem; background:var(--main-color); transition:var(--transition-custom); opacity:0; transform:translateX(100%);}
#rightMenu > ul > li .support-menu-box .tit-box{display: flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,0.15); margin:1rem; padding-bottom:2.3rem; margin-bottom:3rem;}
#rightMenu > ul > li .support-menu-box .tit-box .tit{font-size:3rem; letter-spacing:-0.035em; color:#fff; font-weight:600;}
#rightMenu > ul > li .support-menu-box .tit-box i{font-size:3rem; color:#fff;}
#rightMenu > ul > li .support-menu-box .txt-box{margin:1rem; margin-bottom:7rem;}
#rightMenu > ul > li .support-menu-box .txt-box .call{font-size:1.8rem; letter-spacing:-0.035em; color:#fff; font-weight:600; margin-bottom:1.6rem;}
#rightMenu > ul > li .support-menu-box .txt-box .call i{position: relative; top:1px; margin-right:5px;}
#rightMenu > ul > li .support-menu-box .txt-box .num{font-size:3rem; letter-spacing:-0.01em; color:#fff; font-weight:600; margin-bottom:1rem;}
#rightMenu > ul > li .support-menu-box .txt-box .txt{font-size:1.6rem; line-height:1.5; letter-spacing:-0.035em; color:rgba(255,255,255,0.6); font-weight:500;}
#rightMenu > ul > li .support-menu-box .link-list{}
#rightMenu > ul > li .support-menu-box .link-list a{display: flex; align-items:center; justify-content:space-between; width:100%; padding:2.5rem 3.5rem; box-sizing:border-box; border:3px solid rgba(255,255,255,0.1); border-radius:1.4rem; font-size:2rem; letter-spacing:-0.01em; color:#fff; font-weight:600; transition:var(--transition-custom); margin-bottom:0.8rem;}
#rightMenu > ul > li .support-menu-box .link-list a:last-child{margin-bottom:0;}
#rightMenu > ul > li .support-menu-box .link-list a i{opacity:0.16; transition:var(--transition-custom)}
#rightMenu > ul > li .support-menu-box .link-list a:hover{border-color:#fff;}
#rightMenu > ul > li .support-menu-box .link-list a:hover i{opacity:1;}

#rightMenu > ul > li .support-menu-box.on{opacity:1; transform:translateX(0);}
#rightMenu.bottom-fixed{bottom:3rem;}

@media all and (max-width:1760px){
	#rightMenu{right:var(--area-padding); margin-right:0;}
}
@media all and (max-width:800px){
	#rightMenu > ul > li > a{width:5rem; height:5rem;}
	#rightMenu > ul > li > a i{font-size:1.2rem;}
	#rightMenu > ul > li > a .txt{font-size:0.8rem;}
	
	#rightMenu > ul > li .support-menu-box{max-width:calc(100vw - (2 * var(--area-padding))); width:30rem; padding:1.5rem;}
	#rightMenu > ul > li .support-menu-box .tit-box{padding-bottom:2rem; margin-bottom:2rem;}
	#rightMenu > ul > li .support-menu-box .tit-box .tit{font-size:2.4rem;}
	#rightMenu > ul > li .support-menu-box .tit-box i{font-size:2.4rem;}
	#rightMenu > ul > li .support-menu-box .txt-box{margin-bottom:3rem;}
	#rightMenu > ul > li .support-menu-box .txt-box .call{font-size:1.6rem; margin-bottom:1.2rem;}
	#rightMenu > ul > li .support-menu-box .txt-box .num{font-size:2rem;}
	#rightMenu > ul > li .support-menu-box .txt-box .txt{font-size:1.4rem;}
	#rightMenu > ul > li .support-menu-box .link-list a{padding:1.5rem 2rem; border:2px solid rgba(255,255,255,0.1); font-size:1.6rem; }
}


/* 공통 :: 마우스효과 */
.mouse-default{opacity: 0.35; position:fixed; top:-65rem; left:-65rem; width: 130rem; height: 130rem; border-radius:50%; z-index: -1; pointer-events:none; filter: blur(2rem);}
.mouse-default:before{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius:50%; content: ''; backdrop-filter: blur(12rem); 
background: radial-gradient(ellipse at center,  rgba(38, 117, 221, 1) 0%,rgba(38, 117, 221, 0) 60%);}

@media all and (max-width:800px){
	.mouse-default {visibility: hidden !important; opacity: 0 !important;}
}