@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: #151515;
}

/* ******************  메인 레이아웃(Fullpage) ********************** */
#fullpage #mainVisual{height:100vh}
@media all and ( min-width: 1281px ) and (max-height: 750px) {
	#fullpage .section:not(#mainFooter){min-height:750px;}
	#fullpage .section .fp-tableCell{height:100% !important;}
	#fullpage .section:not(#mainVisual){background: none;}
}

.main-wrap {background: url(/images/main/main_bg.jpg)no-repeat top 0 left 50% / cover;}
.main-wrap #header {opacity: 0; top: calc(-1*(var(--header-height)/2));}
.main-wrap.active #header {opacity: 1; top: var(--header-top);}

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:100vh; height:calc(100vh - var(--header-height)); 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%;
	opacity:0.5;
	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 7s 0s forwards;}
/* 메인 비주얼 :: 텍스트 */
.main-visual-txt-con{
	position:absolute; 
	left:0px; top:0;
	width:100%; 
	height:100%;
	z-index:1;
}
.main-visual-txt-box{
	/*display:flex;*/
  margin-top: 180px;
	align-items:center;
	height:100%;
}
.main-visual-txt-inner > div:nth-child(1) {margin-bottom: 76px;}
.main-visual-txt-inner > div:nth-child(2) {margin-bottom: 70px;}


.main-visual-txt-inner {width: 100%; text-align: center;}

.main-visual-txt-box .main-visual-txt1{font-size:5rem; font-weight:700; letter-spacing:-0.025em; line-height: 1.33; color:#fff; overflow: hidden;}
.main-visual-txt-box .main-visual-txt1 em {font-size: 4rem;}

.main-visual-more-btn-wrap{overflow: hidden; display: block; margin-top: 2rem;}
.main-visual-more-btn {display: block; opacity:0;filter:Alpha(opacity=0); transform: translateY(100%);}
.main-effect-btn .more-btn {position: relative; display: block; width: 460px; height: 106px; margin: 0 auto;}
.main-effect-btn .more-btn .cm-effect-svg {position: absolute; width: 460px; height: 100px; top: 50%; left: 50%; overflow: visible; transform: translate(-50%,-50%);}
.main-effect-btn .more-btn .cm-effect-svg g {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.main-effect-btn .more-btn .cm-effect-svg rect {stroke: url(#borderGradient);}
.main-effect-btn .more-btn strong {position: relative; font-size:2.8rem; color:#fff; line-height: 106px; z-index: 1; font-family: var(--font-family1); font-weight: 400;}

@media (max-width: 768px) {
  .main-effect-btn .more-btn {width: 240px; height: 56px;}
  .main-effect-btn .more-btn .cm-effect-svg {width: 240px; height: 50px;}
  .main-effect-btn .more-btn strong {font-size: 14px; line-height: 60px;}
}


/* 메인 비주얼 :: 텍스트 :: active효과 */

.active-item .main-visual-txt1{animation-delay:0.7s;}
.active-item .main-visual-more-btn-wrap {animation-delay:0.9s;}

.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;}
.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;}
.active-item .main-visual-more-btn {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-arrow {position: absolute; bottom: 0; left: 0; width: 100%; z-index: 10; opacity: 0; transition: var(--transition-custom2); }
.main-visual-arrow .inner {display: flex; align-items: center; justify-content: space-between;}
.main-visual-arrow .inner button {position: relative; font-size: 1.4rem; font-weight: 500; letter-spacing: -0.025em; color: #fff; }
.main-visual-arrow .inner button.prev-btn {text-align: left;}
.main-visual-arrow .inner button.next-btn {text-align: right;}
.main-visual-arrow .inner button .bar {display: block; width: 10rem; position: relative; height: 3px; background: rgba(255,255,255,0.1); margin-top: 1.5rem;}
.main-visual-arrow .inner button .bar:before {position: absolute; content: ''; top: 0; width: 0; height: 3px; background: #fff; transition: var(--transition-custom); }
.main-visual-arrow .inner button.prev-btn .bar:before {left: 0;}
.main-visual-arrow .inner button.next-btn .bar:before {right: 0;}
.main-visual-arrow .inner button .btn-tit {position: absolute; bottom: -0.5rem; font-size: 1.3rem; font-weight: 500; color: #fff; line-height: 1.3; white-space:nowrap; transition: var(--transition-custom); opacity: 0;}
.main-visual-arrow .inner button.prev-btn .btn-tit {left: 12.5rem; text-align: left;}
.main-visual-arrow .inner button.next-btn .btn-tit {right: 12.5rem; text-align: right;}

.main-visual-arrow .inner button:hover .bar:before {width: 3rem;}
.main-visual-arrow .inner button:hover .btn-tit {opacity: 1;}

.main-wrap.active .main-visual-arrow {bottom: 7.5rem; opacity: 1;}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
.main-content-container {display: block;}

/* 공통 :: 슬라이드 프로그레스바 */
#fullpage .history-arrow-box button {color: #fff;}
#fullpage .history-arrow-box button.swiper-button-disabled {color: rgba(255, 255, 255, 0.3);}

/* 공통 :: 타이틀 */
.main-tit-box{position: relative; z-index: 10; text-align: center;}
/* .main-tit-box .main-tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.025em; color: #fff; line-height: 1.3; padding: 0.2rem 0; } */
.main-tit-box .main-tit {font-size: 2rem; font-weight: 700; letter-spacing: 0; color: #fff; line-height: 1.3; padding: 0.2rem 0; }
.main-tit-box .main-tit span {position: relative; display: inline-block !important;}
.main-tit-box .main-tit span:before {position: absolute; top: 0; right: -1.2rem; content: ''; width: 6px; height: 6px; border-radius: 6px; background: var(--main-color);}
.main-tit-box .main-txt {font-size: 3rem; font-weight: 600; letter-spacing: -0.05em; color: #fff; line-height: 1.33; margin-top: 1.7rem;}
.main-tit-box .main-txt strong {font-weight: 600; color: var(--main-color);}
.main-tit-box .modal-tit {font-size: 3rem; font-weight: 700; letter-spacing: 0; color: #000; line-height: 1.3; padding: 0.2rem 0; margin-bottom: 28px;}
.main-tit-box .modal-txt {font-size: 2rem; font-weight: 700; letter-spacing: 0; color: #000; line-height: 1.3; padding: 0.2rem 0; }
.main-tit-box .modal-txt strong {color: #1ECAD3;}

.cm-overflow-box{overflow: hidden; display: block;}
.cm-overflow-inner{display: block; font-size:inherit; font-weight:inherit; color:inherit; opacity:0;filter:Alpha(opacity=0); transform: translateY(100%);}
.active-section .cm-overflow-box .cm-overflow-inner, .animated .cm-overflow-box .cm-overflow-inner{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.active-section .cm-overflow-box .delay01, .animated .cm-overflow-box .delay01{animation-delay:0.1s;}
.active-section .cm-overflow-box .delay03, .animated .cm-overflow-box .delay03{animation-delay:0.3s;}
.active-section .cm-overflow-box .delay05, .animated .cm-overflow-box .delay05{animation-delay:0.5s;}
.active-section .cm-overflow-box .delay07, .animated .cm-overflow-box .delay07{animation-delay:0.7s;}

.main-swiper-pagination .swiper-pagination-progressbar {position: relative; width: calc(100% - 9.5rem); height: 3px; background: rgba(255,255,255,0.3);}
/* .main-swiper-pagination .swiper-pagination-progressbar {position: relative; width: 100%; height: 3px; background: rgba(255,255,255,0.3);} */
.main-swiper-pagination .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #fff;}

/* -------- 메인 컨텐츠 :: 컨텐츠1 (About US) -------- */
#mainContent1 {background: url("/images/main/main_bg.jpg")no-repeat top 0 left 50% / cover;}
/* #mainContent1 {background: none;} */
#mainContent1 .main-tit-box {padding-top: 5rem;}
/* #mainContent1 .main-swiper-pagination .swiper-pagination-progressbar {width: calc(100% - 9.5rem);} */

.main-about-con {margin-top: 3.5rem;}
.main-about-video-box {position: relative; width: 100%;}
.main-about-video-box .video-iframe-box {position: relative;padding-top: 65.041%;height: 0; background-color: #000;border-radius: 1.5rem;overflow: hidden;}
.main-about-video-box .video-iframe-box iframe {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
/* .main-about-video-box .video-cover-box { position: absolute;  top: 0px;left: 0px;  width: 100%;height: 100%; border-radius: 1.5rem; overflow: hidden; cursor: pointer;} */
.main-about-video-box .video-cover-box { position: absolute; top: 0; left: 0; width: 100%;height: 0; padding-top: 65.041%; border-radius: 1.5rem; overflow: hidden; cursor: pointer;}
.main-about-video-box .video-cover-box .thumb {position: absolute; top: 0; left: 0; width: 100%; height: 100%;/* display: block; position: relative; width: 100%; height: 100%;border-radius: 1.5rem;  */-webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; transition: all 0.4s;}
.main-about-video-box .video-cover-box .thumb img {  width: 100%; height: 100%; object-fit: cover;}
.main-about-video-box .btn-cover {position: absolute;  top: 50%; left: 50%;  width: 8rem;  height: 8rem; line-height: 8rem; text-align: center; margin: -4rem 0 0 -4rem; z-index: 10;}
.main-about-video-box .btn-cover .wave-bg{position:absolute; left:50%; top:50%; width:8rem; height:8rem; transform: translate(-50%,-50%); transition:var(--transition-custom2); }
.main-about-video-box .btn-cover .wave-bg span {background-color:rgba(30, 202, 211, 0.2);border-radius: 50%; -webkit-animation-fill-mode: both;animation-fill-mode: both;position: absolute;left: 0;top: 0px;opacity: 0;margin: 0;width: 100%;height: 100%;}
.main-about-video-box .btn-cover .wave-bg span{-webkit-animation: wave-circle 2.5s cubic-bezier(0.22, 0.61, 0.36, 0.5) infinite; animation: wave-circle 2.5s cubic-bezier(1, 2, 0.66, 3) infinite; }
.main-about-video-box .btn-cover .wave-bg span:nth-child(1) { -webkit-animation-delay: 0s; animation-delay: 0s; }
.main-about-video-box .btn-cover .wave-bg span:nth-child(2) { -webkit-animation-delay: 0.7s; animation-delay: 0.7s; }
.main-about-video-box button {position: relative; width: 100%; height: 100%; border-radius: 50%; background: var(--main-color); z-index: 1; font-size: 3rem; color: #fff;}
.main-about-video-box button i {padding-left: 0.5rem;}

@keyframes wave-circle {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 0.5; 
	}
	50% {
		opacity: 1.0; 
	}
	100% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
		opacity: 0; 
	}
}

.main-product-pagination, .main-about-pagination, .main-news-pagination {display: flex; align-items: center; width: 100%; margin-top: 5rem;}

/* -------- 메인 컨텐츠 :: 컨텐츠2 (Use cases) -------- */
#mainContent2 {background: url("/images/main/main_bg.jpg")no-repeat top -100vh left 50% / cover;}

.main-use-con .accordion-list-box {position: relative; max-width:1260px; margin: 3.5rem auto 0;}
.main-use-con .accordion-list .accordion-item {position:relative; height: 100%;}
.main-use-con .accordion-list .accordion-item .accordion-inner {display:block; border-radius: 3rem; background-color: #2d315b45;/* background: url("/images/main/main_use_bg.jpg"); */ background-size: cover; background-repeat: no-repeat; position:relative; height:100%; margin:0; overflow:hidden;}

.main-use-con .accordion-list .accordion-item:first-child .accordion-inner {background-position: 0% center;}
.main-use-con .accordion-list .accordion-item:nth-child(2) .accordion-inner {background-position: 68.07% center;}
.main-use-con .accordion-list .accordion-item:nth-child(3) .accordion-inner {background-position: 73.39% center;}
.main-use-con .accordion-list .accordion-item:nth-child(4) .accordion-inner {background-position: 78.71% center;}
.main-use-con .accordion-list .accordion-item:nth-child(5) .accordion-inner {background-position: 84.03% center;}
.main-use-con .accordion-list .accordion-item:nth-child(6) .accordion-inner {background-position: 89.35% center;}
.main-use-con .accordion-list .accordion-item:nth-child(7) .accordion-inner {background-position: 94.67% center;}
.main-use-con .accordion-list .accordion-item:nth-child(8) .accordion-inner {background-position: 100% center;}

@media all and ( min-width: 1025px ){
	.main-use-con .accordion-list-container{position: relative; z-index: 1; margin-left:-15px}
	.main-use-con .accordion-list-box .accordion-list{ display: table; width:100%; height: 350px; overflow:hidden; font-size:0;}
	.main-use-con .accordion-list .accordion-item{width:5.32213%; display:table-cell; height:100%;} /* 접힌 li의 width*/
	.main-use-con .accordion-list .accordion-item.active {width: 62.7451%;}
	.main-use-con .accordion-list .accordion-item .accordion-inner{margin-left:15px}
}

.accordian-tit-box{position:absolute; left:0; right: 0; top:0; bottom: 0; width:100%; height:100%; z-index:1; /* cursor:pointer; */ pointer-events: none; transition: var(--transition-custom);}
.accordian-tit-box:before{position:absolute; bottom:3rem; left:50%; margin-left: -0.8rem; content:"\e906"; font-family: xeicon; font-size: 1.6rem; color: #fff; }
.accordian-tit-box .accordian-tit{position: absolute; top: 0; left: 50%; margin-left: -1rem; }
/* .accordian-tit-box .accordian-tit strong {display:block; padding-top: 4rem; writing-mode: vertical-rl; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.025em; color: #fff; line-height: 1.2;} */
.accordian-tit-box .accordian-tit strong {display:block; padding-top: 4rem; writing-mode: vertical-rl; font-size: 1.6rem; font-weight: 500; letter-spacing: 0; color: #fff; line-height: 1.2;}

.accordion-item .accordion-info-box{position:absolute; left:0; right:0; top: 0; bottom:0; }
.accordion-item .accordion-info-box .inner {width: 100%; min-width: 785px; height: 100%; display: flex; align-items: center; padding: 4.5rem 4rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; opacity:0;filter:Alpha(opacity=0); color:#fff; -webkit-transition-delay:0s; 	-moz-transition-delay:0s; -o-transition-delay:0s;	-ms-transition-delay:0s; transition-delay:0s; z-index:1;}
.accordion-item .accordion-info-box .img-box {width: 50%;}
.accordion-item .accordion-info-box .img-box span {position: relative; display: block; width: 100%; height: 0; padding-top: 63.15%; border-radius: 2rem; overflow: hidden;}
.accordion-item .accordion-info-box .img-box span img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.accordion-item .accordion-info-box .txt-box {width: 50%; padding-left: 5.5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;  box-sizing: border-box;}
/* .accordion-item .accordion-info-box .txt-box .tit { display: block; font-size: 4rem; letter-spacing: -0.025em; color: #edf0f5; line-height: 1.2;} */
.accordion-item .accordion-info-box .txt-box .tit { display: block; font-size: 4rem; letter-spacing: 0; color: #edf0f5; line-height: 1.2;}
.accordion-item .accordion-info-box .txt-box .txt {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.025em; color: rgba(255,255,255,0.3); line-height: 1.6; padding-top: 1rem;}
/* 아코디언 내용 Active */
.accordion-item.active .accordian-tit-box{opacity:0;filter:Alpha(opacity=0);}
.accordion-item.active .accordian-tit-box:before{opacity:0;filter:Alpha(opacity=0);}
.accordion-item.active .accordion-info-box .inner { 
	opacity:1.0;filter:Alpha(opacity=100);  
	-webkit-transition:all 0.3s 0.2s; 
	-moz-transition:all 0.3s 0.2s; 
	-o-transition:all 0.3s 0.2s; 
	-ms-transition:all 0.3s 0.2s; 
	transition:all 0.3s 0.2s; 
}

.slide-container-partner {position: absolute; bottom: 13rem; left: 0;}
.main-partners-list {display:flex; flex-flow:row nowrap; opacity: 0.2;}
.main-partners-list .partner-item {width: 16.5rem; margin:0 3.5rem; }
.main-partners-list .partner-inner {width: 100%;}
.main-partners-list .partner-inner > span {display: block; width: 100%; position: relative; height: 0; padding-top:38.89%;}
.main-partners-wrap {position: relative; height: 7rem;}
.main-partners-roller {position:absolute; height: 100%;}
.main-partners-bottom {margin-top: 3rem;}

/* 아코디언 슬라이드 */
.main-use-con .reference-list .slick-arrow {color: #fff;}
.main-use-con .reference-list-con {padding-left: 0; margin-top: 2.5rem;}
.reference-list .slick-arrow.slick-prev {left: -2.8rem;}
.reference-list .slick-arrow.slick-next {right: -2.8rem;}

/* -------- 메인 컨텐츠 :: 컨텐츠3 (Solution) -------- */
#mainContent3 {padding-top: 7.5rem; background: url(/images/main/main_bg.jpg)no-repeat bottom calc(-1*(200vh + 55px)) left 50% / cover;}
#mainContent3 .details-list-wrap {grid-template-columns: repeat(auto-fill, 25.4%); grid-auto-flow: column; grid-gap: 0; margin: 3.5rem 0 0 0;}
#mainContent3 .details-list-wrap .details-list {max-width: none;}
#mainContent3 .details-list-wrap .details-list .details-list-tit {letter-spacing: 0;}

@media all and (max-width: 1280px) {
	#mainContent3 {padding: 5rem 0;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠4 (News) -------- */
#mainContent4 {background: url(/images/main/main_bg.jpg)no-repeat bottom calc(-1*(100vh + 55px)) left 50% / cover;}
#mainContent4 .main-tit-box {padding-top: 5rem;}
.main-news-con {margin-top: 3.5rem;}
.main-news-list li a {display: block;}
.main-news-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 65%;border-radius: 1rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden;}
.main-news-list li a .img-box span {display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.main-news-list li a .img-box span img {position: absolute; width: 100%; height: 100%; top: 0; left: 0; transition: all 0.3s;}
.main-news-list li a .txt-box {padding-top: 2rem;}
.main-news-list li a .txt-box .category {display: block; font-size: 1.3rem; color: #fff; line-height: 1.2; margin-bottom: 1rem;}
/* .main-news-list li a .txt-box .tit {font-size: 1.8rem; font-weight: 700; letter-spacing: -0.05em; color: #fff; line-height: 1.44; height: 2.9em; overflow:hidden;display:block;display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical;} */
.main-news-list li a .txt-box .tit {font-size: 1.8rem; font-weight: 700; letter-spacing: 0; color: #fff; line-height: 1.44; height: 2.9em; overflow:hidden;display:block;display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.main-news-list li a .txt-box .date {display: block;font-size: 1.3rem; font-weight: 600; letter-spacing: -0.05em; color: #ffffff; opacity: 0.3; margin-top: 3.5rem;}
/* .main-news-pagination {margin-top: 4.5rem;} */

@media all and (min-width: 801px) {
	.main-news-list li a:hover .img-box img {transform: scale(1.05);}
}

/* -------- 메인 컨텐츠 :: 컨텐츠5 (Contact us) -------- */
/*#contactModal {background: white bottom -16.52rem left 50% / cover; position: absolute; top: 0; height: 80%;}*/
/*#contactModal {padding-top: 14rem; background: none; position: fixed; top: 0; height: 90%;}*/
#contactModal {background: none; position: fixed; top: 0; align-items: center; justify-content: center; width: 100%}
.main-contact-wrap-outer {display: flex; justify-content: center; align-items: center;}
.main-contact-wrap {padding: 2rem 0; margin: 0 4rem;}
.main-contact-con {display: flex;}
.main-contact-con .left-con {width: 50%; padding-right: 5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; color: #000;}
.main-contact-con .left-con .main-tit-box {text-align: left; color: #fff;}
.main-contact-con .right-con {width: 50%; /* backdrop-filter: blur(10px); */}
.main-inquiry-con {width: 100%;}
.main-inquiry-row {position: relative; display: flex; margin: 0 -0.5rem 1rem;}
.main-inquiry-row:nth-child(1) {z-index: 6;}
.main-inquiry-row:nth-child(2) {z-index: 5;}
.main-inquiry-row:nth-child(3) {z-index: 4;}
.main-inquiry-row:nth-child(4) {z-index: 3;}
.main-inquiry-row:nth-child(5) {z-index: 2;}
.main-inquiry-row:nth-child(6) {z-index: 1;}
.main-inquiry-row .main-inquiry-item {width: calc(50% - 1rem); margin: 0 0.5rem; height: 6rem; background: #EEEEEE; backdrop-filter: blur(20px); border-radius: 1rem;}
.main-inquiry-row .main-inquiry-item.full-item {width: calc(100% - 1rem); }
.main-inquiry-row .main-inquiry-item.textarea-item {height: 19rem;}

.main-inquiry-row:nth-child(4) .main-inquiry-item:first-child {position: relative; z-index: 2;}

.main-inquiry-item .write-input,
.main-inquiry-item .write-textarea {width: 100%; height: 6rem; border: 0; border-radius: 1rem; -webkit-border-radius: 1rem !important; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.025em; color: #fff; padding: 0 2rem; appearance: none; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; background: transparent; transition: all 0.4s; transition-property: background;}

.main-inquiry-item .write-input::placeholder,
.main-inquiry-item .write-select::placeholder, 
.main-inquiry-item .write-textarea::placeholder {color: #000;}

.main-inquiry-item .write-input:focus::placeholder,
.main-inquiry-item .write-select:focus::placeholder,
.main-inquiry-item .write-textarea:focus::placeholder {color: #fff;}
.main-inquiry-item .write-input:focus,
.main-inquiry-item .write-textarea:focus{border: 0; outline: 0; background: var(--main-color); color: #fff;}
.main-inquiry-item .write-input {color:#000;}
.main-inquiry-item .write-textarea {height: 19rem; padding: 2rem; text-indent: 0; color: #000}
.main-inquiry-item.security-item .security-code-box {display: flex; align-items: center; width: 100%; padding: 0 2rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; transition: all 0.4s; transition-property: background; border-radius: 1rem;}
/* .main-inquiry-item.security-item .security-code-box .security-code {width: 9rem; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.025em; color: #fff;} */
.main-inquiry-item.security-item .security-code-box .security-code {width: 9rem; font-size: 1.6rem; font-weight: 500; letter-spacing: 0; color: #000;}
.main-inquiry-item.security-item .security-code-box .write-input {width: calc(100% - 9rem) !important;}
.main-inquiry-item.security-item .write-input:focus{border: 0; outline: 0; background: transparent; }
.main-inquiry-item.security-item.on .security-code-box {background: var(--main-color);}
.main-inquiry-item .custom-select-trigger {width: 100%; height: 6rem; line-height: 6rem; border: 0; border-radius: 1rem; -webkit-border-radius: 1rem !important; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.025em; color: #fff; padding: 0 2rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; background: transparent; transition: all 0.4s; transition-delay: 0.3s; transition-property: background, border-radius; border-radius:1rem; color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.main-inquiry-item .write-select.opened .custom-select-trigger {outline: 0; background: var(--main-color);}
.main-inquiry-item .custom-option-drop-list {border-radius: 0 0 1rem 1rem;}

.main-inquiry-bottom {display: flex; align-items: center; justify-content: space-between; margin-top: 2rem;}
.main-inquiry-bottom .agree-check-box {}
.main-inquiry-bottom .agree-check-box input {display: none;}
.main-inquiry-bottom .agree-check-box label {position: relative;padding-left: 2.5rem; font-size: 1.6rem; font-weight: 700; line-height: 1.3; letter-spacing: -0.025em; color: #000;}
.main-inquiry-bottom .agree-check-box label a {display: inline-block; position: relative; font-weight: 700; color: #000;}
.main-inquiry-bottom .agree-check-box label a:before {position: absolute; content: ''; width: 100%; height: 2px; background: #000; bottom: -3px; left: 0;}
.main-inquiry-bottom .agree-check-box label:before {position: absolute; content: '\e92c'; font-family: xeicon; font-size:1.8rem; left: 0; top: 0; color: #000;}
.main-inquiry-bottom .agree-check-box input:checked + label:before {content: '\e92b'; }

.main-inquiry-btn .send-btn {display: block; text-align: center;}
.main-inquiry-btn .send-btn {position: relative; display: block; width: 240px; height: 53px; margin: 0 auto;}
.main-inquiry-btn .send-btn .cm-effect-svg {position: absolute; width: 240px; height: 50px; top: 50%; left: 50%; overflow: visible; transform: translate(-50%,-50%);}
.main-inquiry-btn .send-btn .cm-effect-svg g {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.main-inquiry-btn .send-btn .cm-effect-svg rect {stroke: url(#borderGradientBlack);}
.main-inquiry-btn .send-btn strong {position: relative; font-size:2rem; color:#000; line-height: 53px; z-index: 1; font-family: var(--font-family1); font-weight: 400;}

/* ****************** 
	* Mouse Pointer
********************** */
.mouse-pointer{position:fixed; top:0px; left:0px; z-index:10000; pointer-events:none; }
/* drag */
.mouse-pointer .drag-circle{opacity: 0; position:absolute; top:50%; left:50%; width: 12.8rem; height:12.8rem; background: rgba(30,202,211,0.9);  border-radius:50%; transform:translate(-50%,-50%) scale(0); box-sizing: border-box; transition:var(--transition-custom); transition-property: transform, opacity;}
.mouse-pointer .drag-txt {opacity: 0; position:absolute; left:50%; top:50%; width: 12.8rem; height:12.8rem;  transform:translate(-50%,-50%) scale(0); transition:var(--transition-custom); display: block;}
.mouse-pointer .drag-txt img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-width: 100%; max-height: 100%;}
/* drag active */
.mouse-pointer.drag .drag-circle{opacity: 1; transform:translate(-50%,-50%) scale(1);}
.mouse-pointer.drag .drag-txt{opacity: 1; transform:translate(-50%,-50%) scale(1);}

.is-mobile .mouse-pointer,
.is-mobile .drag-circle,
.is-mobile .drag-txt {visibility: hidden; opacity: 0;}

@media all and (max-width:800px){
	.mouse-pointer,
	.drag-circle,
	.drag-txt,
	.pointer-arrow{visibility: hidden; opacity: 0;}
}

/* -------- 메인 하단 -------- */
.main-nav-btn {position:fixed; bottom:-12rem; right:6rem; display:block; width:6rem; height:6rem; border: 0.3rem solid rgba(255,255,255,0.1);text-align:center; color:#fff; z-index:99;box-sizing:border-box;opacity:0;transition:var(--transition-custom2);border-radius:50%; overflow: hidden;}
.main-nav-btn-box .nav-btn-inner {position: relative;}
.main-nav-btn i {font-size: 2.4rem; line-height: 5.4rem; transition:var(--transition-custom)}
.main-nav-btn span {position: absolute; top: 50%; right: 2rem; text-indent: -3rem; min-width: 10rem; transform: translateY(-50%); opacity: 0; transition:var(--transition-custom); font-size: 1.6rem; font-weight: 700; line-height: 1.4; color: #fff;}
.main-nav-btn.on {opacity: 1; bottom: 6rem;}
.main-nav-btn.contact-btn {display: flex; justify-content: space-between; border-radius: 6rem; padding-left: 1.5rem; transition: width 0.4s, border-radius 0.4s, background-color 0.4s, border-color 0.4s, bottom 0.8s ease-in-out, opacity 0.8s ease-in-out;}
.main-nav-btn.contact-btn.on {bottom: 13rem;}

@media all and (min-width: 801px) {
	.main-nav-btn.contact-btn:hover {background-color: #1793a4; border-color: #1793a4; width: 20rem; border-radius: 3rem;}
	.main-nav-btn.contact-btn:hover span {opacity: 1; text-indent: 0;}
	.main-nav-btn.contact-btn:hover i {color: #fff !important;}	
}

.main-scroll-icon {position: fixed;bottom:-12rem; right: 6rem; width: 3px; height: 6rem;overflow: hidden;  background: rgba(255,255,255,0.1); opacity:0;transition:var(--transition-custom2);}
.main-scroll-icon span {  position: absolute;display: block; width: 100%; height: 5rem; background: #fff; transition: all 0.3s; animation: barUpDown 2s ease-in-out infinite;}
.main-scroll-icon.on {opacity: 1; bottom: 7rem;}
@keyframes barUpDown {
    0% {
        bottom: 100%
    }

    100% {
        bottom: -100%
    }
}

/* ******************  메인 오른쪽 퀵메뉴 ********************** */
#rightBar{
	position:fixed; 
	top:55%; right:2%; 
	z-index:99; 
	margin-top:-142px;
	opacity:0;
	visibility:hidden;
	transition:var(--transition-custom2);
}
#rightBar.fixed{visibility:visible; opacity:1.0; top:50%;}
#rightBar > ul {width:56px;}
#rightBar > ul > li{border-top:1px solid #7f7f7f;}
#rightBar > ul > li:first-child{border-top:0;}
#rightBar > ul > li > a{display:block; width:56px; height:56px; background-color:#000; text-align:center; line-height:56px; color:#fff; transition:var(--transition-custom);}
#rightBar > ul > li > a:hover{background-color:#7f7f7f}

/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
#fp-nav{
	position: fixed;
    z-index: 100;
    margin-top: -32px;
    top: 50%;
	right:0;
    opacity: 0;
    transform: translate3d(0,0,0);
	transition: var(--transition-custom2);
	transition-property: right, opacity;
}
#fp-nav.active {right: 50px; opacity: 1;}

#fp-nav ul li{position:relative; width:20px; margin:1.3rem 0;}
#fp-nav ul li:last-child{display:none} /* 마지막 섹션이 footer일경우 */
#fp-nav ul li a{display:block; position:relative; width:100%; height:20px; box-sizing:border-box; padding:5px; }
#fp-nav ul li a span{display:block; width:8px; height:8px; background-color:#fff; border-radius:50%; opacity:0.1;filter:Alpha(opacity=10);}
#fp-nav ul li .fp-tooltip{
	position:absolute; 
	overflow:hidden; 
	right:20px; top:0; 
	opacity:0;filter:Alpha(opacity=0); 
	line-height:18px; 
	letter-spacing: 1.5px; 
	font-size:1.3rem; 
	color:#fff; 
	white-space:nowrap;
	margin-right:5px; 
	text-align:right; 
	transition:var(--transition-custom);
}
#fp-nav ul li .fp-tooltip span{display:block; transform:translateX(100%); transition:all 0.5s;}
#fp-nav ul li a.active span{opacity:1.0;}
#fp-nav ul li a.active + .fp-tooltip{opacity:1.0;}
#fp-nav ul li a.active + .fp-tooltip span{transform:translateX(0%)}

/* Black Style */
#fp-nav.black ul li a span{background-color:#000}
#fp-nav.black ul li .fp-tooltip{color:#222;}