@charset "utf-8";
/* ********************************************************************
 * name : (ÁÖ)¸ÞµðÆÄÀÌ
 * filename : main.css
 * description : ¸ÞÀÎ ÄÜÅÙÃ÷ css 
 * date : 2024-01-22
********************************************************************* */


/* === Ç®ÆäÀÌÁö ·¹ÀÌ¾Æ¿ô === */
	#fullPage{overflow:hidden; width:100%; height:100vh; position:relative; background-color:#fff }
	.fullPageCon{z-index:1; overflow:hidden;}
	.fullPageContainer,
	.fullPageSlide{width: 100%;height: 100%;position: relative}
	.swiper-container-vertical > .swiper-wrapper {flex-direction: column;}
	.swiper-slide {position: relative;}
	.mainFooterBox{position: absolute; bottom:0; left:0; width:100%;}

/* === Ç®ÆäÀÌÁö ½½¶óÀÌµå ÇØÁ¦=== */
@media all and ( max-width: 1280px ){
	.mainSlide #fullPage{overflow:auto; height:auto;}
	.mainSlide #fullPage .swiper-container{overflow:auto;}
	.mainSlide #fullPage .swiper-wrapper{display: block;}
	.mainSlide #fullPage .swiper-slide{height:auto !important;}

	.visualSlide .swiper-wrapper,
	.serviceSlide .swiper-wrapper{display: flex !important;}
}

/* === ½½¶óÀÌµå === */
	#section1{width:100%;height:100vh;}
	.visualSlide{height:100vh;}
	.visualSlide .swiper {width: 100%;height: 100%;margin-top: 40px;}
	.visualSlide .swiper-wrapper{padding-bottom: 85px;}
	.visualSlide .swiper-slide {display: flex;-webkit-box-pack: center;justify-content: flex-start;align-items: center;}
	.visualSlide .bgWrap{width: 100%;height:100%;animation:visualScale 8s ease 0s forwards;position: absolute;}
	.visualSlide .bg01{background: url(../img/main/vis01.jpg) no-repeat center/cover;}
	.visualSlide .bg02{background: url(../img/main/vis02.jpg) no-repeat center/cover;}

	.visualSlide:after{content: '';width: 0;height: 1px;background: #ffffff47;position: absolute;top: 75px;z-index: 1;opacity: 0.8;transition: all linear 2s;}
	.visualSlide:before{content: '';width: 0;height: 1px;background: #ffffff47;position: absolute;bottom: 75px;right:0;z-index: 2;opacity: 0.8;transition: all linear 2s;}
	.visualSlide .swiper-wrapper:after{content: '';width: 1px;height: 0;right: 5%;top: 0;position: absolute;z-index: 1;background: #ffffff47;opacity: 0.8;transition: all linear 2s;}

	.mainSlide .swiper-slide-active .visualSlide:after,
	.mainSlide .swiper-slide-active .visualSlide:before{width:100%}
	.mainSlide .swiper-slide-active .swiper-wrapper:after{height: 100vh}

	.visualSlide .swiper-slide .imgBox{width: 885px;height: 550px;box-shadow: 4px 6px 12px 0px rgb(0 0 0 / 7%);overflow: hidden;border-radius: 30px;;}
	.visualSlide .swiper-slide .imgBox img{width: 100%;height: 100%;}
	.visualSlide .swiper-slide .txt{position: relative;left: 10%;margin-top: -70px;}
	.visualSlide .swiper-slide .txt em{font-size: 26px;font-weight: 700;color: #fff;}
	.visualSlide .swiper-slide .txt h2{font-size:62px;line-height: 1.3;margin: 15px 0 30px;font-weight: 300;letter-spacing: -0.04em;color: #fff;}
	.visualSlide .swiper-slide .txt h2 span{color:#55cdff;display:block;font-weight: 700;}
	.visualSlide .swiper-slide .txt h2 strong{color:#fff;font-weight: 800;}
	.visualSlide .swiper-slide .txt p{line-height: 1.7;font-size: 19px;color:#fff;}
	.swiper-slide-active .txt em{animation: focus-in-contract 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

	.visualSlide .swiper-slide-active .txt em,
	.visualSlide .swiper-slide-active .txt h2,
	.visualSlide .swiper-slide-active .txt p{-webkit-animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
	.visualSlide .swiper-slide-active .txt em{animation-delay: 0.2s}
	.visualSlide .swiper-slide-active .txt h2{animation-delay: 0.7s}
	.visualSlide .swiper-slide-active .txt p{animation-delay: 1.2s}

	.visualSlide .swiper-slide .txt01 em{}
	.visualSlide .swiper-slide .txt01 h2 span{color:#55cdff;font-weight: 800;}
	.visualSlide .swiper-slide .txt01 h2 strong{color:#fff;font-weight: 800;}

	.visualSlide .control{width: 370px;height: 14px;position: absolute;left: calc(10% - 20px);bottom: 23vh;}
	.visualSlide .control .swiper-button-next i,
	.visualSlide .control .swiper-button-prev i{color: #fff;font-size: 23px;font-weight: 900;}
	.visualSlide .control .swiper-button-next i{color: #fff;}
	.visualSlide .control .swiper-button-prev:after, 
	.visualSlide .control .swiper-button-next:after{display:none;}
	.visualSlide .control .swiper-button-next:hover,
	.visualSlide .control .swiper-button-prev:hover i{opacity: 0.7;transition: all 0.5s;}
	.visualSlide .control .swiper-pagination{z-index: 1;top: 17px;}
	.visualSlide .control .swiper-pagination-fraction{color: transparent;position: relative;}
	.visualSlide .control .swiper-pagination-fraction .swiper-pagination-current{color: #fff;position: absolute;top: -21px;left: 48px;font-weight: 600;font-size: 14px;}
	.visualSlide .control .swiper-pagination-fraction .swiper-pagination-current:before{content:'0';}
	.visualSlide .control .swiper-pagination-fraction .swiper-pagination-total{color: #fff;position: absolute;top: -21px;right: 48px;font-weight: 600;font-size: 14px;}
	.visualSlide .control .swiper-pagination-fraction .swiper-pagination-total:before{content:'0';}

	.autoplay-progress {position: absolute;left: 50%;top: 5px;z-index: 10;width: 195px;height: 2px;background-color: rgb(0 0 0 / 40%);transform: translateX(-50%);}
	.autoplay-progress svg {--progress: 0;position: absolute;left: 0;top: 0;z-index: 10;width: 195px;stroke-width: 1px;stroke: #fff;fill: none;stroke-dashoffset: calc(100 * (1 - var(--progress)));stroke-dasharray: 100;}

	#scrollAni {position: absolute;bottom: 160px;right: calc(0vw - 0.5%);z-index:1;}
	#scrollAni .txt{transform: rotate(90deg);font-size: 11px;font-weight: 600;letter-spacing: 3px;color:#afafaf;}
	#scrollAni i {position: absolute;bottom: 85px;right: 50.5%;width: 1.5px;height: 140px;background: rgb(163 163 163 / 12%);vertical-align: middle;overflow: hidden;}
	#scrollAni i:after {content:'';position: absolute;bottom:0;right:calc(50% - 1.5px);width:1.5px;height: 140px;background: #8d8d8d;vertical-align: middle;animation: scrollbar 3s infinite ease-in-out;}


/* === ¼­ºñ½º === */
	#section2{background:#fffcf5;width:100%;height:100vh;}
	.serviceWrap{margin: 0 4%;height: 100vh;}
	.serviceWrap .titleBox{font-weight: 700;padding: 11vh 0 3em;}
	.serviceWrap .titleBox h2{font-size:38px;color:#252324;}
	.serviceWrap .titleBox p{position: relative;font-size:38px;color:#252324;}
	.serviceWrap .titleBox p:after{content: '';position: absolute;width: 0%;height: 1px;background: #a4a4a4;margin-left: 26px;bottom: 15px;transition: all linear 2s;}
	.mainSlide .swiper-slide-active .serviceWrap .titleBox p:after{width: calc(100% - 450px);}
	.serviceSlide{position: relative;width: calc(100% - 4%)}

	.serviceSlide .swiper-wrapper{}
	.serviceSlide .swiper-wrapper .swiper-slide{}
	.serviceSlide .swiper-slide .imgBox{}
	.serviceSlide .swiper-slide .imgBox img{width:100%;}
	.serviceSlide .swiper-slide .txtBox{margin: 2em 0;}
	.serviceSlide .swiper-slide .txtBox h3{font-size:24px;color:#212121;}
	.serviceSlide .swiper-slide .txtBox p{font-size:0.9375rem;color:#888888;line-height: 1.8;margin-top: 1em;min-height: 76px;}
	.serviceSlide .swiper-slide .btnBox{}
	.serviceSlide .swiper-slide .btnBox a{width: 160px;height: 50px;line-height: 50px;transition: all 0.5s ease;display: block;border: 1px solid #252324;color: #252324;text-align: center;}
	.serviceSlide .swiper-slide .btnBox a:hover{box-shadow: 160px 0 0 0 #00a1e9 inset;border:1px solid #00a1e9;color:#fff;}
	.serviceSlide .swiper-slide .btnBox a i{transform: rotateZ(45deg);font-size: 19px;vertical-align: text-bottom;transition: all 0.5s;margin-left: 6px;}
	.serviceSlide .swiper-slide .btnBox a:hover i{transform: rotateZ(90deg);color:#fff;}
	/*.mainSlide .swiper-slide-active .serviceSlide .swiper-slide{animation: image-sin 1.5s 0s cubic-bezier(0.5, 0, 0.1, 1) both;}*/
	.serviceControl{}
	.serviceControl .swiper-button-next{right:4%;margin-top: 30px;}
	.serviceControl .swiper-button-prev{left: 4%;margin-top: 30px;}
	.serviceControl .swiper-button-next:after,
	.serviceControl .swiper-button-prev:after{color: #79797a;font-size: 23px;font-weight: 900;transition: all 0.5s;}
	.serviceControl .swiper-button-next:hover:after,
	.serviceControl .swiper-button-prev:hover:after{opacity: 0.5;}

	.bottomLine{width: 100%;margin: 0 5%;position: relative;margin-top: 3%;}
	.bottomLine:after{content: '';position: absolute;width: 0;height: 1px;right:5%;background: #a4a4a4;margin-left: 26px;bottom: 0;transition: all linear 2s;}
	.mainSlide .swiper-slide-active .bottomLine:after{width: 100%;}

/* === ¼Ö·ç¼Ç === */
	#section3{background:#303030;width:100%;height:100vh;}
	.solutionWrap{margin:0 4%;}
	.solutionWrap .titleBox{position: relative;padding-left: 5px;line-height: 1.4;padding-top: 50px;top: 12vh;}
	.solutionWrap .titleBox h2{font-size:38px;color:#fff;}
	.solutionWrap .titleBox p{font-size:38px;color:#aaa;}
	.solutionWrap .titleBox span{position:absolute;font-size:206px;color:#212121;font-weight: 800;left: -12px;z-index: -1;top: 0;line-height: 1;letter-spacing: -0.06em;}

	.swiper-slide-active .solutionWrap .titleBox h2,
	.swiper-slide-active .solutionWrap .titleBox p{animation: text-clip 1.5s 0s cubic-bezier(0.5, 0, 0.1, 1) both;}
	.swiper-slide-active .solutionWrap .titleBox span{animation: text-focus-in 1.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;}


	.solutionSilde{width: calc(100% - 47%);position: absolute !important;right: 0;top: 14vh;}
	.solutionSilde .swiper-wrapper{height: 78vh;}
	.solutionSilde .swiper-slide{display: flex;justify-content: center;opacity: 0 !important;}
	.solutionSilde .swiper-slide-active{opacity: 1 !important;}
	.solutionSilde .swiper-slide .txtBox{width: calc(43% - 20px);height: 320px;margin-top: 7vh;background:#e0dcdc;margin-right: 60px;}
	.solutionSilde .swiper-slide .txtBox em{position: absolute;font-size: 18px;display: block;font-weight: 600;top: 0;color: #434343;}
	.solutionSilde .swiper-slide .txtBox h2{font-size: 42px;color: #342727;line-height: 1.2;font-weight: 600;}
	.solutionSilde .swiper-slide .txtBox h2 img{float: left;margin-right: 22px;padding-top: 27px;}
	.solutionSilde .swiper-slide .txtBox h2 img.imgC{padding-top:0}
	.solutionSilde .swiper-slide .txtBox h2 span{font-size: 25px;display: block;font-weight: 700;}
	.solutionSilde .swiper-slide .txtBox p{font-size: 19px;color: #534a4a;margin: 20px 0 55px;}
	.solutionSilde .swiper-slide .txtBox .btn{width:198px;display:block;text-align: center;position: relative;line-height: 33px;}
	.solutionSilde .swiper-slide .txtBox .btn:after{content:'';width:100%;height:1px;position: absolute;left:0;background:#4b4b4b;display: block;margin-top: 10px;transition: all linear 0.5s;}
	.solutionSilde .swiper-slide .txtBox .btn:before{content:'';width:100%;height:1px;position: absolute;right:0;background:#4b4b4b;display: block;margin-bottom: 10px;transition: all linear 0.5s;top: -10px;}
	.solutionSilde .swiper-slide .txtBox .btn:hover:after{width:20%;}
	.solutionSilde .swiper-slide .txtBox .btn:hover:before{width:20%;}
	.solutionSilde .swiper-slide .txtBox .btn img{}
	.solutionSilde .swiper-slide .imgBox{width: 50%;position: relative;}
	.solutionSilde .swiper-slide .imgBox img{position: absolute;z-index: 100;display: block;top: 50px;border-radius: 3px 3px 30px 30px;}


	.solutionSilde .swiper-slide-active .txtBox h2,
	.solutionSilde .swiper-slide-active .txtBox p,
	.solutionSilde .swiper-slide-active .txtBox .btn{animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
	.solutionSilde .swiper-slide-active .txtBox h2{animation-delay: 0.2s}
	.solutionSilde .swiper-slide-active .txtBox p{animation-delay: 0.7s}
	.solutionSilde .swiper-slide-active .txtBox .btn{animation-delay: 1.2s}

	.solutionSilde .swiper-slide .txtBox .btnSet{display: flex;}
	.solutionSilde .swiper-slide .txtBox .btnSet .btn{margin-right: 1em;}

	.phoneImg{position: absolute;background: url(../img/main/con_slide01_phone.png) no-repeat center/cover;width: 374px;height: 684px;top: 0;left: 46.1%;}

	.solutionControl{position: absolute;left: 50%;margin-left: -9px;top: 670px;width: 55px;}
	.solutionControl .swiper-button-next{right: 0;}
	.solutionControl .swiper-button-prev{left: 0;}
	.solutionControl .swiper-button-next:after,
	.solutionControl .swiper-button-prev:after{color: #fff;font-size: 15px;font-weight: 900;transition: all 0.5s;}
	.solutionControl .swiper-button-next:hover:after,
	.solutionControl .swiper-button-prev:hover:after{opacity: 0.5;}

	.solutionBg{position: absolute;width: 51%;right: 5%;top: 8.3vh;}
	.solutionBg:after{content:'';position: absolute;width: 26%;height: 313px;background:#e0dcdc;border-radius: 10px;margin-top: -15px;right: 0;}
	.solutionBg:before{content:'';width: 100%;height:52vh;background:#e0dcdc;display: block;border-radius: 10px;}

	.solutionBox{position: absolute;top: 62vh;display: grid;grid-template-columns: 1fr 1fr 1fr;grid-column-gap: 20px;width: 59%;}
	.solutionBox .conBox{background:#464646;padding: 30px 33px;border-radius: 8px;height: 223px;position: relative;}
	.solutionBox .conBox:after{content:'';position: absolute;width: 1px;height: 100%;background: #464646;right: -10px;top: 0;}
	.solutionBox .conBox:last-child:after{display:none;}
	.solutionBox .conBox h2{font-size:20px;color:#fff;line-height: 1.8;font-weight: 500;}
	.solutionBox .conBox h2 strong{font-size:32px;display: block;font-weight: 600;}
	.solutionBox .conBox p{font-size:15px;color:#d0d0d0;position: absolute;bottom: 30px;right: 33px;text-align: right;line-height: 1.7;}

	/*.mainSlide .swiper-slide-active .solutionBox .conBox{animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
	.mainSlide .swiper-slide-active .solutionBox .conBox:nth-child(1){animation-delay: 0.2s}
	.mainSlide .swiper-slide-active .solutionBox .conBox:nth-child(2){animation-delay: 0.7s}
	.mainSlide .swiper-slide-active .solutionBox .conBox:nth-child(3){animation-delay: 1.2s}*/

/* === ÄÁ¼³ÆÃ === */
	#section4{background:#f1f1f1;width:100%;height:100vh;}
	.consultingWrap{margin: 0 4%;display: flex;align-items: center;height: 100vh;}
	.consultingWrap:after{content: '';background: url(../img/main/consultingBg.png) no-repeat center/cover;width: 630px;height: 532px;position: absolute;right: 0;z-index: -1;background-size: 100%;}
	.mainSlide .swiper-slide-active .consultingWrap:after{animation: imgscale 5s ease-out both;}
	.consultingWrap .titleBox{position: absolute;left: 50%;transform: translateX(50%);}
	.consultingWrap .titleBox em{font-size:18px;color:#1d95de;font-weight: 600;}
	.consultingWrap .titleBox h2{font-size:56px;color:#262626;line-height: 1.4;font-weight: 800;margin: 20px 0 50px;}
	.consultingWrap .titleBox h2 span{font-size:36px;display: block;font-weight: 400;}
	.consultingWrap .titleBox .btn{position: relative;text-align: left;}
	.consultingWrap .titleBox .btn a{width: 200px;transition: all .5s;height: 60px;display: inline-block;border-bottom: 1px solid #575757;position: relative;overflow: hidden;text-align: left;padding-left: 20px;}
	.consultingWrap .titleBox .btn a span{color: #000;font-size: 19px;line-height: 60px;}
	.consultingWrap .titleBox .btn a .line{width: 0;height: 58px;border-top: 1px solid #000;border-bottom: 1px solid #000;position: absolute;top: 0;left: 0;right: 0;margin: auto;transition: all .5s;}
	.consultingWrap .titleBox .btn a:hover{border-bottom: 1px solid rgba(255,255,255,0);}

	.consultingWrap .titleBox .btn a:hover .line{width: 100%;}
	.consultingWrap .titleBox .btn a i{transform: rotateZ(-45deg);font-size: 19px;vertical-align: -1px;transition: all 0.5s;margin-left: 6px;}
	.consultingWrap .titleBox .btn a:hover i{transform: rotateZ(0deg);color:#000;}

	.consultingWrap .process{position: relative;background:#172b4c;width: calc(50% - 10em);height: 75vh;box-shadow: 2px 3px 19px 7px #0000002e;border-radius: 20px;display: flex;flex-direction: column;padding: 0 0 0 10em;overflow: hidden;}
	.consultingWrap .process:after{content:'';position: absolute;width: 100%;height: 200px;background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(23,43,76,1) 100%);left: 0;bottom:0;z-index: 1;}
	.consultingWrap .process:before{content: '';position: absolute;width: 100%;height: 200px;background: linear-gradient(0deg, rgb(23 43 76 / 0%) 0%, rgba(23,43,76,1) 100%);left: 0;z-index: 1;}
	.consultingWrap .process .marquee{opacity:0;}

	.element-1 .marquee-in,
	.mainSlide .swiper-slide-active .consultingWrap .process .marquee{position: relative;box-sizing: border-box;animation: marquee 20s linear infinite;opacity:1;}
	.element-1 .marquee-in:hover,
	.mainSlide .swiper-slide-active .consultingWrap .process .marquee:hover{animation-play-state: paused;}
	.consultingWrap .process p{font-size:24px;color:#fff;margin: 2em 0 4em;position: relative;font-weight: 600;}
	.consultingWrap .process p:after{content:'';position: absolute;width: 1px;height: 65px;background: #727e92a6;left: 24px;top: 65px;}
	.consultingWrap .process p:last-child:after{display:none;}
	.consultingWrap .process p em{background:#fafafa;color:#172b4c;width: 48px;height: 48px;display: inline-block;border-radius: 50%;text-align: center;line-height: 48px;font-weight: 600;margin-right: 50px;}


/* === À¯Æ©ºê/ÆÄÆ®³Ê === */
	#section5{margin: 0 4%;height: 100vh;display: flex;align-items: center;justify-content: center;flex-direction: column;}
	.youtubeWrap{display: flex;justify-content: center;align-items: flex-start;width: 100%;margin-bottom: 2em;}
	.youtubeWrap .titleBox{margin-right: 7em;}
	.youtubeWrap .titleBox h2{font-size: 23px;color: #2e2e2e;margin-bottom: 30px;}
	.youtubeWrap .titleBox h2 img{vertical-align: -5px;margin-right: 10px;}
	.youtubeWrap .titleBox p{font-size: 40px;color: #121212;line-height: 1.4;font-weight: 500;}
	.youtubeWrap .titleBox p strong{display:block;font-weight: 800;}
	.youtubeWrap .titleBox p strong span{color:#1d95de;}

	.youtubeWrap .titleBox .btn{position: relative;text-align: left;margin-top: 30px;}
	.youtubeWrap .titleBox .btn a{width: 235px;transition: all .5s;height: 60px;display: inline-block;border-bottom: 1px solid #575757;position: relative;overflow: hidden;text-align: left;padding-left: 20px;}
	.youtubeWrap .titleBox .btn a span{color: #000;font-size: 19px;line-height: 60px;}
	.youtubeWrap .titleBox .btn a .line{width: 0;height: 58px;border-top: 1px solid #000;border-bottom: 1px solid #000;position: absolute;top: 0;left: 0;right: 0;margin: auto;transition: all .5s;}
	.youtubeWrap .titleBox .btn a:hover{border-bottom: 1px solid rgba(255,255,255,0);}

	.youtubeWrap .titleBox .btn a:hover .line{width: 100%;}
	.youtubeWrap .titleBox .btn a i{transform: rotateZ(-45deg);font-size: 19px;vertical-align: -1px;transition: all 0.5s;margin-left: 6px;}
	.youtubeWrap .titleBox .btn a:hover i{transform: rotateZ(0deg);color:#000;}

	.youtubeWrap .youtubeBox{display: flex;}
	.youtubeWrap .youtube{margin-left: 25px;width: 470px;height: 266px;cursor: pointer;}
	.youtubeWrap .youtube img{width: 470px;height: 266px;}
	.youtubeWrap iframe{ margin-left: 25px;}

	.partnerWrap{width: 100%;margin-top: 3em;border-top: 1px dashed #cfcfcf;padding-top: 2em;}
	.partnerWrap .titleBox{margin: 0 5%;}
	.partnerWrap .titleBox h2{font-size: 46px;color: #1f1f1f;margin-bottom: 0.4em;font-weight: 600;}
	.partnerWrap .titleBox p{font-size: 20px;color: #1f1f1f;display: flex;}
	.partnerWrap .titleBox p span{margin-right: 2.8em;line-height: 1.8;}
	.partnerWrap .partnerSlide{margin-top: 3em;padding-right: 10px;margin-left: 10px;}
	.partnerWrap .partnerSlide .swiper-wrapper{height: 200px;}
	.partnerWrap .partnerSlide .swiper-slide{height: auto;-webkit-box-sizing: border-box;box-sizing: border-box;display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr;/* grid-column-gap: 20px; */}
	.partnerWrap .partnerSlide .swiper-slide .picture{padding: 25px;text-align: center;position: relative;border: 1px solid #adadad;border-bottom: 0;border-left: 0;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(5n){border-right:0;} 
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(1n+17):nth-child(-n+23){border-bottom:1px solid #adadad;}
	.partnerWrap .partnerSlide .swiper-slide .picture a{display:block;}
	.partnerWrap .partnerSlide .swiper-slide .picture a img{transition: all 0.5s;width: 148px;height:35px;}
	.partnerWrap .partnerSlide .swiper-slide .picture:after{content:'';position: absolute;width: 18px;height: 18px;bottom: -9px;right: -9px;background: #ffffff;z-index: 1;}
	.partnerWrap .partnerSlide .swiper-slide .picture:before{content:'';position: absolute;width: 18px;height: 18px;top: -9px;right: -9px;background: #ffffff;z-index: 1;}
	.partnerWrap .partnerSlide .swiper-slide .picture a:hover img{opacity:0.5;}
	.partnerWrap .partnerSlide .swiper-scrollbar{right: 0;}

	.textMarquee {position: absolute;width: 100vw;max-width: 100%;height: 100px;bottom: -10px;overflow-x: hidden;z-index: -1;}
	.textMarquee .track {position: absolute;white-space: nowrap;will-change: transform;animation: textMarquee 90s linear infinite;}
	.textMarquee .track p{font-size:90px;color:#f2f8fc;font-weight: 700;}
	.textMarquee .track p span{text-stroke: 2px red;-webkit-text-stroke: 1px #e2f0f9;color: transparent;margin: 0 1em;}


/* === ¹®ÀÇÇÏ±â === */
	#section6{background: url(../img/main/contact.jpg) no-repeat center/cover;width: 100%;height: /*67.3vh*/617px;}
	.contactWrap{color: #fff;text-align: center;display: flex;flex-direction: column;height: 100%;justify-content: center;}
	.contactWrap p{font-size: 52px;font-weight: 700;line-height: 1.4;letter-spacing: -0.03em;}
	.contactWrap p i{font-weight: 100;}
	.contactWrap p span{font-weight: 400;display: block;}
	.contactWrap em{font-size: 22px;margin: 1.5em 0 3.5em;letter-spacing: -0.03em;font-weight: 300;}
	.contactWrap .btn{}
	.contactWrap .btn a{width: 320px;transition: all .5s;height: 70px;display: inline-block;border-top: 1px solid #fff;position: relative;overflow: hidden;text-align: left;}
	.contactWrap .btn a span{color: #fff;font-size: 20px;line-height: 70px;}
	.contactWrap .btn a .line{width: 0;height: 68px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;position: absolute;top: 0;left: 0;right: 0;margin: auto;transition: all .5s;}
	.contactWrap .btn a:hover{border-top: 1px solid rgba(255,255,255,0);}

	.contactWrap .btn a:hover .line{width: 100%;}

	.contactWrap .btn a i{font-size: 26px;color: #fff;position: absolute;right: 0;top: 21px;}
	.contactWrap .btn a:hover i{}

/* === ¿ä¼ÒÃ£±â === */


/*
===============================================
animation
===============================================
*/
	@keyframes text-clip {
	  from {clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);}
	  to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
	}

	@keyframes image-in {
	  from {clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}
	  to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
	}

	@keyframes image-sin {
	  from {clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);}
	  to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
	}

	@keyframes accbtn {
		0%, 44%, 88.1%, 100% {transform-origin: left;}	
		0%, 100%, 88% {transform: scaleX(0);}	
		44.1%, 88% {transform-origin: right;}	
		33%, 44% {transform: scaleX(1);}
	}

	@keyframes imgscale {
	  0% {  
		-webkit-transform: scale(1.25) translateY(-15px);
				transform: scale(1.25) translateY(-15px);
		-webkit-transform-origin: top;
				transform-origin: top;
	  }
	  100% {
		-webkit-transform: scale(1) translateY(0);
				transform: scale(1) translateY(0);
		-webkit-transform-origin: 50% 16%;
				transform-origin: 50% 16%;
	  }
	}

	@keyframes scrollbar {
		0% {transform: translateY(-170px);}
		100% {transform: translateY(170px);}
	}

	@keyframes visualScale{
		0%{transform:scale(1.13) rotate(.001deg);}
		100%{transform:scale(1) rotate(.001deg);}
	}

	@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-focus-in {
		  0% {
			-webkit-filter: blur(12px);
					filter: blur(12px);
			opacity: 0;
		  }
		  100% {
			-webkit-filter: blur(0px);
					filter: blur(0px);
			opacity: 1;
		  }
	  }

	@keyframes marquee {
		0%   {top:   90%;}
		100% {top: -201%;}
	}

	@keyframes textLine {
		0%   {width:   0%;}
		100% {width: 100%;}
	}

	@keyframes textMarquee {
	  from { transform: translateX(0); }
	  to { transform: translateX(-50%); }
	}


/*
===============================================
¹ÝÀÀÇü css
===============================================
*/

@media all and (min-width:2500px){
	.visualSlide .swiper-slide .txt h2 {font-size: 85px;}
	.visualSlide .swiper-slide .txt p {font-size: 24px;}
	.visualSlide .swiper-slide .txt em {font-size: 32px;}

	.serviceWrap .titleBox {padding: 16vh 0 3em;}
	.solutionBox .conBox p,
	.serviceSlide .swiper-slide .txtBox p {font-size: 1.125rem;}

	.solutionWrap .titleBox h2,
	.solutionWrap .titleBox p{font-size: 53px;}
	.solutionWrap .titleBox span{font-size: 250px;}
	.solutionSilde .swiper-slide .txtBox {margin-top: 9vh;}
	.consultingWrap .titleBox em {font-size: 26px;}
	.consultingWrap .titleBox h2 {font-size: 56px;}
	.youtubeWrap .titleBox p {font-size: 60px;}
	.youtubeWrap .titleBox {margin-right: 29em;}
	.youtubeWrap {margin-bottom: 10em;}
	#section6 {height: 70.3vh;}
	.contactWrap p {font-size: 82px;}
	.contactWrap em {font-size: 26px;}
}

@media all and (min-width:2100px){
	#scrollAni {right: calc(0vw - 0%);}
	#section6 {height: 65.3vh;}
}


@media all and (max-width:1800px){
	#scrollAni {right: calc(0vw - 1%);}
	.serviceControl .swiper-button-next {right: 2%;}
	.serviceControl .swiper-button-prev {left: 2%;}

	#section6 {height: 67.3vh;}

	.youtubeWrap .titleBox p strong span{display:block;}
}

@media all and (max-width:1760px){
	.solutionBox .conBox p {padding-left: 33px;}
	.solutionBox .conBox p br{display:none;}

	.youtubeWrap .titleBox p {font-size: 35px;}

	.solutionWrap .titleBox {padding-top: 30px;}
	.solutionWrap .titleBox h2 i{display:block;}
	.solutionWrap .titleBox p {font-size: 26px;}

	.solutionSilde .swiper-slide .txtBox h2 {font-size: 38px;}
	.solutionSilde .swiper-slide .txtBox h2 span {font-size: 23px;}
	.solutionSilde .swiper-slide .txtBox p {font-size: 18px;}
	.solutionSilde .swiper-slide-active .txtBox p br {display: none;}
}

@media (max-width:1600px) and (max-height:768px){

}

@media all and (max-width:1600px){
	#scrollAni {right: calc(0vw - 1.5%);}

	.solutionBg {width: 57%;}
	.solutionSilde {width: calc(100% - 41%);}
	.solutionSilde .swiper-slide .txtBox h2 img{display:none;}
	.solutionBox {width: 63%;}

	.consultingWrap .titleBox {transform: translateX(25%);}
	.consultingWrap .process {width: calc(50% - 5em);padding: 0 0 0 5em;}
	.consultingWrap .process p {font-size: 1.25rem;}
	.consultingWrap .process p em {width: 30px;height: 30px; margin-right: 25px;line-height: 30px;}
	.consultingWrap .process p:after {height: 50px;left: 14px;top: 42px;}

	.youtubeWrap {justify-content: space-between;}
	.youtubeWrap .titleBox {margin-right: 0;}
	.youtubeWrap .youtube {width: 350px;height: auto;}
	.youtubeWrap .youtube img {width: 350px;}
	.partnerWrap .titleBox p {font-size: 17px;}
	.partnerWrap .partnerSlide .swiper-slide .picture img{width: 150px;}
}

@media all and (max-width:1480px){

}

@media all and (max-width:1400px){
	#scrollAni {display:none;}
	.serviceSlide .swiper-slide .txtBox p br{display:none;}
	.serviceSlide .swiper-slide .txtBox p i{display:block;}
}

@media all and (max-width:1280px){
	.visualSlide .swiper-slide .txt em {font-size: 24px;}
	.visualSlide .swiper-slide .txt h2 {font-size: 52px;}
	.visualSlide .swiper-slide .txt p {font-size: 18px;}
	.mainSlide .active .visualSlide:after,
	.mainSlide .active .visualSlide:before{width:100%}
	.mainSlide .active .swiper-wrapper:after{height: 100vh}
	.visualSlide .swiper-wrapper:after {right: 7%;}

	#section2 {height: auto;padding-bottom: 7em;}
	.serviceWrap{height:100%;}
	
	#section3 {height: 100%;padding-bottom: 8em;}
	.solutionWrap .titleBox {position: inherit;padding-left: 0;padding-top: 7em;}
	.solutionSilde .swiper-wrapper {display: flex !important;height: 50em;}
	.solutionSilde {width: 100%;position: relative !important;top: 4.5em;}
	.solutionBg:after{display:none;}
	.solutionBg {width: calc(100% - 8%);right: 4%;top: 17em;}
	.solutionBox {position: inherit;width: 100%;}
	.solutionSilde .swiper-slide .imgBox:after{content: '';background: url(../img/main/con_slide01_phone.png) no-repeat center/cover;width: 374px;height: 684px;position: absolute;left: -25px;top: 1px;}
	.phoneImg{display:none;}
	.solutionSilde .swiper-slide .imgBox {width: 295px;}
	.solutionControl {top: 455px;}
	.solutionBg:before {height: 29em;}

	.solutionWrap .titleBox h2 i {display: none;}
	.solutionWrap .titleBox p {font-size: 38px;}
	.solutionSilde .swiper-slide .txtBox em {font-size: 15px;color: #ffffff;padding: 5px 15px 3px;border-radius: 35px;background: #00a1e9;}

	#section4 {height: 100%;padding: 8em 0;}
	.consultingWrap{height:100%;}
	.consultingWrap .process .marquee.marquee-in{position: relative;box-sizing: border-box;animation: marquee 20s linear infinite;opacity:1;}
	.consultingWrap .process .marquee.marquee-in:hover{animation-play-state: paused;}
	.consultingWrap .titleBox h2 span {font-size: 29px;}
	.consultingWrap .titleBox h2 {font-size: 50px;}
	
	.consultingWrap .process {width: calc(50% - 2em);padding: 0 0 0 2em;height: 40em;}
	.partnerWrap .titleBox p span br{display:none;}

	#section5 {height: 100%;padding: 8em 0;}
	.textMarquee {overflow: hidden;}
	.youtubeWrap {align-items: flex-start;flex-direction: column;}
	.youtubeWrap .titleBox {margin-bottom: 3em;}
	.youtubeWrap .youtubeBox {width: 100%;justify-content: center;}
	.youtubeWrap .youtube {margin: 0 15px;width: 470px;height: 266px;}
	.youtubeWrap .youtube img {width: auto;}
    .youtubeWrap .titleBox p strong span{display:inline-block;margin-right: 10px;}
	.partnerWrap .titleBox {margin: 0;}
	.partnerWrap .partnerSlide .swiper-slide {grid-template-columns: 1fr 1fr 1fr;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(1n+19):nth-child(-n+23) {border-bottom: 0;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(5n) {border-right: 1px solid #adadad;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(3n) {border-right: 0;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(1n+21):nth-child(-n+23) {border-bottom: 1px solid #adadad;}
	.partnerWrap .partnerSlide .swiper-wrapper {height: 180px;}

	.mainFooterBox {position: inherit;}
}

@media all and (max-width:1080px){

}

@media all and (max-width:1024px){
	.visualSlide .bgWrap {background-position: -600px center !important;}

	.serviceSlide .swiper-slide .txtBox p {font-size: 1.0625rem;}

	.youtubeWrap .youtubeBox {flex-direction: column;}
	.youtubeWrap .youtube,
	.youtubeWrap iframe{margin:10px auto;}
}

@media all and (max-width:980px){	
	.consultingWrap .process p em {display: block;margin-bottom: 15px;}
	.consultingWrap .process p:after{display:none;}
	.consultingWrap .process p {margin: 2em 2em 3em 0;}
	.consultingWrap .titleBox h2 span {font-size: 25px;}
}

@media all and (max-width:920px){	
	#section3 {height: auto;}
	.solutionControl {margin-left: -40px;top: 490px;}
	.solutionBox .conBox {padding: 30px;height: auto;}
	.solutionBox .conBox h2 {font-size: 17px;line-height: 1.4;}
	.solutionBox .conBox p {position: initial;text-align: left;padding-left: 0;margin-top: 30px;line-height: 1.4;}
	.solutionSilde .swiper-slide .txtBox p {font-size: 17px;}
	.solutionSilde .swiper-slide .txtBox h2 {font-size: 34px;}
	.solutionSilde .swiper-slide .txtBox h2 span {font-size: 20px;}
	.solutionBg:before {height: 28em;}
	.solutionSilde .swiper-wrapper {height: 52em;}

	#section6 {height: 500px;}
	.contactWrap p {font-size: 38px;}
	.contactWrap em {font-size: 19px;}
}

@media all and (max-width:800px){	
	#section4 {padding: 0 0 6em;}
	.consultingWrap {align-items: flex-start;flex-direction: column;}
	.consultingWrap .titleBox {position: inherit;transform: none;margin: 5em 0;}
	.consultingWrap .process {width: calc(100% - 3em);padding: 0 0 0 3em;height: 400px;}
	.consultingWrap .titleBox h2 {font-size: 42px;margin: 20px 0 40px;}
	.consultingWrap .titleBox .btn a,
	.youtubeWrap .titleBox .btn a{padding-left: 0;}
	.consultingWrap .process p {margin: 2em 2em 2em 0;}
}

@media all and (max-width:768px){
	.visualSlide .swiper-slide .txt h2 {font-size: 46px;}
	.serviceWrap .titleBox h2 {font-size: 30px;}
	.serviceWrap .titleBox p {font-size: 32px;}

	.solutionSilde {padding-top: 30px !important;top: 2vh;}
	.solutionSilde .swiper-slide {justify-content: flex-start;flex-direction: column;}
	.solutionSilde .swiper-slide .imgBox img {width: 200px;border-radius: 3px 3px 20px 20px;}
	.solutionSilde .swiper-slide .imgBox:after {width: 255px;height: 494px;left: -17px;background-size: 100%;}
	.solutionSilde .swiper-slide .imgBox {width: 200px;position: absolute;right: 25px;top: -50px;}
	.solutionSilde .swiper-wrapper {height: 33em;}
	.solutionSilde .swiper-slide .txtBox {width: calc(60% - 60px);display: flex;height: auto;margin-top: 0;margin-right: 0;padding: 50px 30px 70px;border-radius: 20px;flex-direction: column;justify-content: center;}
	.solutionBg{display:none;}
	.solutionControl {margin-left: 17px;top: 440px;}
	.solutionSilde .swiper-slide .txtBox em {padding: 5px 15px 3px;border-radius: 15px 0;background: #00a1e9;left: 0;top: -15px;}
	.solutionSilde .swiper-slide .txtBox .btn {width: 95%;}
	.solutionWrap .titleBox h2 {font-size: 32px;}
	.solutionWrap .titleBox p {font-size: 30px;}

	#section5 {padding: 5em 0 7em;}
	.partnerWrap .titleBox p {font-size: 18px;flex-direction: column;}
	.youtubeWrap .titleBox h2 {font-size: 18px;margin-bottom: 15px;}
	.youtubeWrap .titleBox h2 img {vertical-align: -7px;}
}

@media all and (max-width:640px){
	#section1{height:100%;}
	.visualSlide {height: 650px;}

	.visualSlide .bgWrap {background-position: -100vw center !important;}
	.visualSlide .swiper-slide .txt em {font-size: 22px;}
	.visualSlide .swiper-slide .txt {margin-top: 0;text-align: center;left: 50%;transform: translate(-50%, 0);padding: 0 5%;}
	.visualSlide .swiper-slide .txt h2 {font-size: 42px;}
	.visualSlide .swiper-slide .txt02 h2{font-size:36px;}
	.visualSlide .control {position: inherit;left: 0;margin: 0 auto;}
	.visualSlide .swiper-slide .txt:after{content: '';width: 100vw;height: 100vh;background-color: #00000073;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: -1;}

	.solutionBox {display: flex;flex-direction: column;}
	.solutionBox .conBox {margin-bottom: 18px;}
	.solutionBox .conBox:after {width: 100%;height: 1px;right: 0;top: inherit;bottom: -10px;}
	.solutionSilde .swiper-slide .txtBox {width: calc(100% - 60px);}
	.solutionSilde .swiper-slide .imgBox {position: relative;right: inherit;top: 35px;left: 50%;margin-left: -100px;}
	.solutionSilde .swiper-wrapper {height: 61em;}
	.solutionSilde .swiper-slide .txtBox .btn {width: calc(100% - 30px);}
	.solutionControl {margin-left: 109px;top: 465px;}

	.consultingWrap .process .marquee.marquee-in {animation: marquee 12s linear infinite;}

	.partnerWrap .partnerSlide .swiper-wrapper {height: 174px;}
	.partnerWrap .partnerSlide .swiper-slide {grid-template-columns: 1fr 1fr;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(1n+21):nth-child(-n+23) {border-bottom: 0;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(3n) {border-right: 1px solid #adadad;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(2n) {border-right: 0;}
	.partnerWrap .partnerSlide .swiper-slide .picture:nth-child(1n+22):nth-child(-n+23){border-bottom: 1px solid #adadad;}

	.serviceSlide .swiper-slide .btnBox a {width: calc(100% - 4px);}
}

@media all and (max-width:600px){
	.serviceWrap .titleBox {padding: 9vh 0 5em;}
	#section2 {padding-bottom: 5em;}
	.serviceWrap .titleBox h2 i{display:block;}
	.serviceWrap .titleBox h2 {font-size: 32px;line-height: 1.2;}
	.serviceWrap .titleBox p {font-size: 26px;}
	.serviceControl .swiper-button-prev,
	.serviceControl .swiper-button-next,
	.serviceSlide .swiper-slide .txtBox p{top: 173px;}
	.serviceControl .swiper-button-prev {left: inherit;right: 12%;}
	.serviceControl .swiper-button-next{right:4%;}
	.serviceSlide{width:100%;}
}
	

@media all and (max-width:550px){	
	.visualSlide .bgWrap {background-position: -140vw center !important;}
	.visualSlide .swiper-slide .txt p{font-size: 16px;}
	.visualSlide .swiper-slide .txt p br{display:none;}
	.visualSlide .swiper-slide .txt02 h2{font-size:32px;}

	.serviceWrap .titleBox h2 {font-size: 30px;}


	#section3 {padding-bottom: 5em;}
	.solutionWrap .titleBox {padding-top: 5em;}
	.solutionWrap .titleBox h2 {font-size: 30px;}
	.solutionWrap .titleBox h2 i{display:block;}
	.solutionWrap .titleBox p {font-size: 28px;}

	.solutionSilde .swiper-slide .txtBox .btnSet .btn{margin-right: 0.5em;}
	.solutionSilde .swiper-slide .txtBox .btnSet .btn:nth-child(2){margin-right:0;}
	.solutionSilde .swiper-slide .txtBox .btnSet .btn img{height: 27px;vertical-align: -4px;}

	.consultingWrap .process {width: calc(100% - 2em);padding: 0 0 0 2em;height: 300px;}
	.consultingWrap .titleBox h2 span {font-size: 22px;}
	.consultingWrap .titleBox h2 {font-size: 32px;margin: 20px 0;}
	.consultingWrap .titleBox .btn a span,
	.youtubeWrap .titleBox .btn a span{font-size: 16px;}
	.consultingWrap .titleBox .btn a {width: 162px;}
	.youtubeWrap .titleBox .btn a {width: 190px;}

	.youtubeWrap .youtube, 
	.youtubeWrap iframe,
	.youtubeWrap .youtube img{width:100%;height:230px;}
	.youtubeWrap .youtube, .youtubeWrap iframe {margin: 5px auto;}
	.youtubeWrap .titleBox p {font-size: 32px;}
    .youtubeWrap .titleBox p strong span{display:block}

	.partnerWrap .titleBox h2 {font-size: 34px;}
	.partnerWrap .titleBox p span {margin-right: 0;line-height: 1.4;margin-bottom: 10px;}
	.partnerWrap .partnerSlide .swiper-slide .picture img {width: 100%;}
	.partnerWrap .partnerSlide .swiper-wrapper {height: 280px;}

#section6 {height: 430px;}
	.contactWrap p {font-size: 32px;}
	.contactWrap em {font-size: 18px;margin: 1.5em 17% 2.5em;}
}

@media all and (max-width:450px){

}