@charset "utf-8";

@keyframes slideToptoBot {
  from {
    transform:translate(-80%,-80%);
  }

  to {
    transform:translate(0%,0%);
  }
}
@keyframes slideRighttoLeft {
  from {
    transform:translate(80%,0%);
  }

  to {
    transform:translate(0%,0%);
  }
}
@keyframes slideBottoTop {
  from {
    transform:translate(-80%,80%);
  }

  to {
    transform:translate(0%,0%);
  }
}
@keyframes slideBottoTop2 {
  from {
    transform:translate(80%,80%);
  }

  to {
    transform:translate(0%,0%);
  }
}
@keyframes slideToptoBot2 {
  from {
    transform:translate(80%,-80%);
  }

  to {
    transform:translate(0%,0%);
  }
}

@keyframes slideToptoBot3 {
  from {
    transform:rotate(90deg)translate(-80%,-80%);
  }

  to {
    transform:rotate(90deg)translate(0%,0%);
  }
}

@media all and (min-width:1080px){
.blink{animation: blink 1.8s linear infinite; 
-webkit-animation-name: blink;
-webkit-animation-duration: 1.8s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-webkit-animation-fill-mode: infinite;
}
@keyframes blink{
0%{opacity: 1;}
25%{opacity: .75;}
50%{opacity: .5;}
75%{opacity: .75;}
100%{opacity: 1;}
}
.allMenu .allMenusub li:hover::before,.allMenu .tab strong:hover::before{ opacity:1; width:100%;}
}

/*.fadeObj{position:relative; top:30px; opacity:0; transition-duration:1s;}
.fadeObj.on{top:0px; opacity:1;}*/
.mobileBr{display:none;}
.commonBr{display:block;}
.mobileTxt{display:none;}
.mobile{display: none !important;}
.pc{display: block !important}
.blue{color:#0033ff !important;}
.mt80{margin-top:80px}

/*테이블*/
.tbl .tblList{border-top:2px solid #000; border-bottom:2px solid #000;}
/* .tbl .tblList td{height:120px; padding-top:35px; text-align:center; font-size:1.8rem; color:rgba(0,0,0,0.8);} */
.tbl .tblList td{height:auto; padding:35px 0; text-align:left; vertical-align: middle; font-size:1.8rem; color:rgba(0,0,0,0.8);}
.tbl .tblList tr{border-bottom:1px solid rgba(0,0,0,0.1);}
.tbl .tblList tr:last-child{border:0;}
.tbl .tblList td.tblTitle{padding-left:30px; padding-right:30px; text-align:left; font-size:1.5rem;}
.tbl .tblList td strong{display:block; font-size:2rem; color:rgb(0,0,0); font-weight: 500}
.tbl .tblList td:nth-child(1){text-align:left; padding-left:80px; padding-right: 80px;}

/*헤더*/
header{position:absolute; top:0px; display:flex; width:100%; height:100px; justify-content:space-between; border-bottom:1px solid #e1e1e1; background:#fff; z-index:1004; transition-duration:1s;}
header.siteMap{border-bottom:0;}
header h1{transition-duration:1s;}
header h1 a{display:block; width:242px; height:32px; margin-top:36px; font-size:0px; background:url(../images/logo.png); transition-duration:1s;}
header nav{z-index:1002; margin-left:-60px;}
header.defaultHeader>div{display:flex;  width:1460px; margin:0 auto; justify-content:space-between;}
header.defaultHeader nav>ul{display:flex; margin:0 auto; z-index:1001;}
header.defaultHeader nav>ul>li{line-height:100px; transition-duration:1s;}
header.defaultHeader nav>ul>li{position:relative; margin:0px 68.5px; font-size:1.8rem; color:#111; opacity:0.6;}
header.defaultHeader nav>ul>li>a::after{content:""; position:absolute; bottom:0px; left:-5px; width:calc(100% + 10px); height:3px; background:#0033ff; transform:scaleX(0); transition-duration:0.2s;}
header.defaultHeader nav>ul>li:hover a::after,header nav>ul>li.on a::after{transform:scaleX(1);}
header.defaultHeader nav>ul>li:hover, header nav>ul>li.on{opacity:1;}
header.defaultHeader nav>ul>li>a:hover, header>nav>ul>li>a:hover{color:#0033ff;}
header nav .subMenu{position:absolute; display:block; padding-top:27px; width:200px; height:0px; overflow:hidden; transition-duration:0.5s;}
header nav .subMenu li{line-height:30px; font-size:1.6rem;}
header nav .subMenu li:hover{color:#0033ff;}
header nav:hover .subMenu{height:230px;}
header nav:hover + .subMenuarea{top:100px; height:230px; border-bottom:1px solid #e1e1e1; background:#fff;}
header .subMenuarea{position:absolute; top:100px; left:0px; width:100%; height:0px; z-index:1001; transition-duration:0.5s;}

.mainSearch .btns {margin-top:35px; display:flex !important; align-items: center; gap:0px 20px;}
.mainSearch .btns li{position:relative; display:inline-block; vertical-align: middle;}
.mainSearch .btns li fieldset{position:absolute; top:-10px; right:-14px;}
.mainSearch .btns li fieldset input{position:relative; z-index:5; width:0px; border:0; border-radius:20px; height:40px; padding-left:15px; transition-duration: 0.5s;}
.defaultHeader .mainSearch .btns a.searchBtn{left:-7px;}
.mainSearch .btns a.searchBtn.on + fieldset input{width:280px; border:1px solid rgba(0,0,0,0.15);}
.mainSearch .btns a.searchBtn{position:relative; display:block; width:20px; height:20px; font-size:0px; background:url('../images/icon_sprite.png')-5px -5px no-repeat; z-index:6;}
.mainSearch .btns a.sitemapBtn{display:block; width:19px; height:16px; font-size:0px; background:url('../images/icon_sprite.png')-40px -7px no-repeat}
.mainSearch .btns li fieldset .searchArea{display:none; position:absolute; top:24px; width:100%; height:0px; border-radius:0px 0px 10px 10px; border:1px solid #d8d8d8; background:#fff; padding:0px 21px; transition-duration:0.2s; overflow:hidden;}
.mainSearch .btns li .searchBtn.on + fieldset .searchArea{display:block;}
.mainSearch .btns li fieldset .searchArea.on{height:220px;}
.mainSearch .btns li fieldset .searchArea p{margin-top:32px; font-size:1.7rem; font-weight:500; padding-bottom:3px; border-bottom:1px solid #030921; margin-bottom:15px;}
.mainSearch .btns li fieldset .searchArea ul{margin-left:6px;}
.mainSearch .btns li fieldset .searchArea li{display:block; margin-bottom:7px; font-size:1.5rem;}
.mainSearch select {border: 0; margin-left: 25px;}

.subSearch .btns {margin-top:25px !important;}
.subSearch .btns li{position:relative; display:inline-block; vertical-align: middle;}
.subSearch .btns li fieldset{position:absolute; top:-10px; right:-15px;}
.subSearch .btns li fieldset input{position:relative; z-index:5; width:0px; border:0; border-radius:20px; height:40px; padding-left:15px; transition-duration: 0.5s;}
.subSearch .btns a.searchBtn.on + fieldset input{width:280px; border:1px solid rgba(0,0,0,0.15);}
.subSearch .btns a.searchBtn{position:relative; display:block; width:20px; height:20px; font-size:0px; background:url('../images/icon_sprite.png')-5px -5px no-repeat; z-index:6;}
.subSearch .btns a.sitemapBtn{display:block; width:19px; height:16px; margin-left:33px; font-size:0px; background:url('../images/icon_sprite.png')-40px -7px no-repeat}
.subSearch .btns li fieldset .searchArea{display:none; position:absolute; top:24px; width:100%; height:0px; border-radius:0px 0px 10px 10px; border:1px solid #d8d8d8; background:#fff; padding:0px 21px; transition-duration:0.2s; overflow:hidden;}
.subSearch .btns li .searchBtn.on + fieldset .searchArea{display:block;}
.subSearch .btns li fieldset .searchArea.on{height:220px;}
.subSearch .btns li fieldset .searchArea p{margin-top:32px; font-size:1.7rem; font-weight:500; padding-bottom:3px; border-bottom:1px solid #030921; margin-bottom:15px;}
.subSearch .btns li fieldset .searchArea ul{margin-left:6px;}
.subSearch .btns li fieldset .searchArea li{display:block; margin-bottom:7px; font-size:1.5rem;}
.subSearch select {border: 0; margin-left: 25px;}



.allMenu{position:absolute; top:-100vh; left:0px; width:100%; height:100vh; background:#fff; color:#000; z-index:1003; opacity:0; transition-duration:0.35s; overflow:hidden;}
header.subMenuHeader.siteMap.on + header + .allMenu{top:calc(0vh + 80px);}
header.siteMap + .allMenu{top:calc(0vh + 100px); opacity:1;}
header.siteMap>div{justify-content:flex-end;}
header.siteMap>div h1 a,header.siteMap>div nav,header.siteMap>div .btns li:first-child{display:none;}
header.siteMap>div .mainSearch .btns li:first-child{display:inline-block;}
header .btns a.sitemapBtn.close{position:relative; display:block; background:none;}
header .btns a.sitemapBtn.close::before,header .btns a.sitemapBtn.close::after{content:""; position:absolute; top:8px; display:block; width:18px; height:2px; background:#000; transition-duration:0.5s;}
header .btns a.sitemapBtn.close::before{transform:rotate(45deg);}
header .btns a.sitemapBtn.close::after{transform:rotate(-45deg);}
header .btns a.sitemapBtn.close:hover::before{transform:rotate(135deg);}
header .btns a.sitemapBtn.close:hover::after{transform:rotate(45deg);}
.allMenu>ul{width:1759px; margin:0px auto;}
.allMenu .tab>strong{display:inline-block; width:170px; margin-top:34px; line-height:40px; font-size:2rem; color:#0033ff; font-weight:500; text-align:center; float:left;}
.allMenu .tab>ul{display:flex; vertical-align:top;}
.allMenu .tab>ul>li>a{padding-left:35px;}
.allMenu .tab:last-child>ul>li{border-bottom:0;}
.allMenu .tab strong{position:relative; display:block;}
.allMenu .tab strong a, .allMenu .allMenusub a{display:block; padding-left:40px; }
.allMenu .tab strong a{line-height:40px;}
.allMenu .tab>ul>li{display:inline-block; width:240px; height:calc(30vh - 26px); font-size:1.8rem; padding:40px 0px; vertical-align:top; border-left:1px solid rgba(0,0,0,0.1); border-bottom:1px dashed rgba(0,0,0,0.1); overflow:hidden;}
.allMenu .tab:nth-of-type(1)>ul>li{height:calc(40vh - 26px);}
.allMenu > .en .tab:nth-of-type(1)>ul>li{height:calc(50vh - 26px);}
/*.allMenu .tab>ul>li:last-child{border-right:1px solid rgba(0,0,0,0.1);}*/
.allMenu .allMenusub{width:100%; margin-top:15px; font-size:1.5rem;}
.allMenu .allMenusub li{width:100%; position:relative; /*line-height:35px*/; transition-duration:0.2s;}
.allMenu .allMenusub li a{padding:0px 25px 0px 40px; height:34px; font-size:1.3rem; display:flex; align-items: center;}
.allMenu .allMenusub li::before,.allMenu .tab ul strong::before{content:""; position:absolute; left:0px; top:0px;  opacity:0; width:0px; height:100%; background:#0033ff; z-index:-1; transition-duration:0.4s;}
.allMenu .tab ul strong::before{top:-3px;}
.allMenu .allMenusub li a:hover,.allMenu .tab ul strong a:hover{color:#fff;}


/*공통*/
main{margin-top:100px; height:calc(100vh - 100px); overflow:auto; -ms-overflow-style: none; scrollbar-width: none; transition-duration:0.2s; overflow-x:hidden;}
main.on{overflow:auto;}
	.subMenuHeader.on + header + .allMenu + main{height:calc(100vh - 80px); margin-top:80px;}
main::-webkit-scrollbar {
    width: 7px;
    background:rgba(0,0,0,0.6);
  }
  main::-webkit-scrollbar-thumb {
    background-color: #fff;
    border-radius:5px;
  }
.inner{position:relative; width:1280px; height:100%; margin:0 auto; }
.inner.w1420{width:1460px}
section.onePage article{position:relative; overflow:hidden; }
section.subIntro + section{padding-top:0px;}
section.subIntro + section article.inner{display:flex; justify-content:center; flex-wrap:wrap; flex-direction:column; height:calc(100vh - 80px);}
section.subIntro + section.trfSol article.inner,section.subIntro + section.urbSol article.inner,section.subIntro + section.medSol article.inner,section.subIntro + section.dtaSol article.inner,section.subIntro + section.gisSol article.inner{height:650px;}

.btnWrap{display: flex; justify-content: flex-end;}
.btnWrap a~a{margin-left:20px;}
.pageMove{position:relative; display:block; width:375px; margin-top:75px; padding-left:59px; border-radius:3px; line-height:60px; font-size:2rem; font-weight:200; border:1px solid #0033ff; transition-duration:0.3s; background:#0033ff; color:#fff;}
.pageMove:hover{border-radius:60px 0px 60px 0px;color:#fff;}
.pageMove::before,.pageMove::after{content:""; position:absolute; height:1px; background:#fff; transition-duration:0.3s; opacity:1;}
.pageMove::before{width:30px; right:60px; top:50%; margin-top:2px;}
.pageMove::after{width:10px; right:60px; top:28px; transform:rotate(45deg);}
.pageMove:hover::before,.pageMove:hover::after{right:52px;}

/*푸터*/
footer{position:relative; height:230px; margin-top:140px; padding:60px 0px 0px; background:#f8f8f8; border-top:1px solid #e1e1e1;}
footer h6{width:242px; height:39px; margin-right:105px; float:left; font-size:0px;  background:url('../images/foot_logo.png') no-repeat;}
footer ul{display:flex;}
footer ul li{margin:5px 60px 0px 0px; font-size:1.8rem }
footer address{display:inline-block; margin-top:15px; font-size:1.6rem; opacity:0.8;}
footer address i{padding:0px 8px;}
footer address i:nth-child(1){padding-left:0px;}
footer address i:nth-child(2){border-right:1px solid #000; border-left:1px solid #000;}
footer address p{margin-top:5px}

footer address.en{display:inline-block; font-size:1.6rem; opacity:0.8;margin-top:0;}

.goTop{display:block; position:fixed; bottom:70px; right:5%; width:60px; height:60px; font-size:0px; z-index:1000; transition-duration:0.3s; cursor:default; opacity:0;}
.goTop::before{content:""; display:block; width:60px; height:60px; background:url('../images/go_top.png')no-repeat; background-size:100%;}
.goTop.on{opacity:1; cursor:pointer;}
.goTop.abSon{opacity:1; cursor:pointer;}
.goTop.abSon2{opacity:1; cursor:pointer;}
.goTop.absOff{opacity:0 !important; cursor:default !important;}

/*.intro{position:fixed; width:100%; height:100vh; background:#fff; z-index:1001; transition-duration:1s; display:none;}
.intro.over{opacity:0;}
.intro .loading_1{content:""; position:absolute; top:28%; right:42%; display:block; width:180px; height:180px; border-radius:300px; background:#59c7f7; opacity:0.5; transform:rotate(-45deg); transform-origin:top right; transition-duration:1s;}
.intro .loading_2{content:""; position:absolute; bottom:28%; left:42%; display:block; width:180px; height:180px; border-radius:300px; background:#0033ff; opacity:0.5; transform:rotate(-45deg); transform-origin:bottom left; transition-duration:1s;}
.intro.on .loading_1,.intro.on .loading_2{width:380px;}*/

@-moz-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@-webkit-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@-o-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
.mobile{display: none}
.pc{display: block}





.introText.on{top:40%; opacity:1;}
.introText h2{position:relative; display:inline-block; font-size:7rem; margin:30px 0px 40px; color:#0033ff; font-weight:500;}
.introText h2::after{content:"";position:absolute;right: 3px;bottom:9px; width:25px; height:70px;background:#fff;transition-duration:0.2s;}
.introText h2 span{position:relative; display:inline-block; width:66px; height:84px; background:url('../images/smile.png')no-repeat 0% 0%/100%; vertical-align:bottom;}
.introText h2 span::before,.introText h2 span::after{content:""; position:absolute; left:9px; display:block; width:18px; height:18px; background:#fff; transition-duration:0.2s;}
.introText h2 span::before{top:16px;}
.introText h2 span::after{top:51px;}
.introText h2 span.smile1::before{top:40px; left:30px;}
.introText h2 span.smile2::after{top:75px; left:30px;}
.introText h2.smile3::after{height:0px;}
.introText i{display:block; font-size:2rem; font-weight:200; line-height:30px;}

/*비전*/
.vision h2{font-size:3rem; margin:131px 0px 90px; font-weight:500; text-align:center;}
.vision ul{display:flex; justify-content:space-between;}
.vision ul li{width:320px; text-align:center;}
.vision ul li strong{font-size:3rem; font-weight:500;}
.vision ul li strong::before{content:""; display:block; width:300px; height:300px; margin-bottom:40px;}
.vision ul li:nth-child(1) strong::before{background:url('../images/vision_1.png') no-repeat;}
.vision ul li:nth-child(2) strong::before{background:url('../images/vision_2.png') no-repeat;}
.vision ul li:nth-child(3) strong::before{background:url('../images/vision_3.png') no-repeat;}
.vision ul li p{font-size:2rem; font-weight:200; margin-top:30px;}

/*솔루션*/
.solution{padding-bottom:265px;}
.solution .solutionExp {position:relative; width:100%; height:965px;}
.solution .solutionContent li{position:absolute; top:0px; width:100%; height:100%; padding-top:80px; opacity:0; transition-duration:0.5s;}
.solution .solutionContent li::after{content:""; display:block; width:100%; height:calc(100% - 440px); max-height:435px; background:red;}
/*.solution .solutionContent li:nth-child(1)::after{background:url('../images/solution_exp_1.png') no-repeat}
.solution .solutionContent li:nth-child(2)::after{background:url('../images/solution_exp_2.png') no-repeat}
.solution .solutionContent li:nth-child(3)::after{background:url('../images/solution_exp_3.png') no-repeat}
.solution .solutionContent li:nth-child(4)::after{background:url('../images/solution_exp_4.png') no-repeat}
.solution .solutionContent li:nth-child(5)::after{background:url('../images/solution_exp_5.png') no-repeat}
.solution .solutionContent li:nth-child(6)::after{background:url('../images/solution_exp_6.png') no-repeat}*/
.solution .solutionContent li.on{opacity:1;}
.solution .solutionContent li>div{width:1278px; margin:0 auto;}
.solution .solutionContent h2{display:block; margin-bottom:15px; font-size:3.5rem; font-weight:500; float:none;}
.solution .solutionContent span{display:inline-block; height:120px; font-size:1.8rem; font-weight:200; line-height:27px;}
.solution .solutionContent a{position:relative; display:block; width:400px; line-height:60px; margin-bottom:70px; font-size:2rem; padding-left:25px; text-align:left; color:#fff; background:#0133ff;}
.solution .solutionContent a::before{content:""; position:absolute; top:27px; right:15px; display:block; width:24px; height:10px; background:url('../images/icon_sprite.png')-4px -47px no-repeat}

.solutionExp .bullets{position:absolute; top:100px; left:190px; width:1px; font-size:0px; background:rgba(0,0,0,0.1);}
.solutionExp .bullets li{position:relative;}
.solutionExp .bullets li::before{content:""; display:inline-block; width:10px; height:10px; margin-bottom:21px; border-radius:50%; background:#fff; border:1px solid rgba(0,0,0,0.3); cursor:pointer; transform:translateX(-50%); transition-duration:0.3s;}
.solutionExp .bullets li:last-child::before{margin-bottom:0px;}
.solutionExp .bullets li.on::before{width:17px; height:17px; background:#0033ff; border:0; opacity:1; border:0;}
.solutionExp .bullets li.on a{position:absolute; top:-4px; left:-120px; display:inline-block; width:100px; text-align:right; font-size:1.5rem; font-weight:500;}

.solution h2{font-size:3.5rem; line-height:45px; font-weight:500; margin-bottom:30px;}
.solution article > span{display:inline-block; font-size:1.8rem; line-height:30px; font-weight:200;}
.solution .portfolio{clear:both; display:flex; justify-content:space-between; margin-top:150px;}
.solution .portfolio li{width:390px; box-shadow:0px 12px 20px rgba(0,0,0,0.15); box-sizing: border-box; border: 6px solid #fff; overflow: hidden}
.solution .portfolio li img, .solution .portfolio li time, .solution .portfolio li strong, .solution .portfolio li span{display:block;}
.solution .portfolio li figcaption{height:306px; padding:40px 29px;}
.solution .portfolio li time{font-size:1.8rem;}
.solution .portfolio li strong{font-size:2rem; font-weight:700; margin-bottom:20px;}
.solution .portfolio li span{font-size:1.6rem; line-height:22px; margin-bottom:65px; font-weight: 300}
.solution .portfolio li a{position:relative; font-size:1.6rem; color:#0033ff; font-weight:500;}
.solution .portfolio li a::after{content:""; display:inline-block; width:24px; height:10px; margin-left:12px; background:url('../images/icon_sprite.png')-3px -65px no-repeat; opacity:0; transition-duration:0.5s;}
.solution .portfolio li a:hover::after{margin-left:22px; opacity:1;}

/*푸터*/
/* footer{position:relative; height:230px; padding:60px 0px 0px; background:#f8f8f8; border-top:1px solid #e1e1e1;}
footer h6{width:242px; height:39px; margin-right:105px; float:left; font-size:0px;  background:url('../images/foot_logo.png') no-repeat;}
footer ul{display:flex;}
footer ul li{margin:5px 60px 0px 0px;font-size:1.8rem;font-weight:500;}
footer address{display:inline-block; margin-top:30px; font-size:1.6rem; opacity:0.8;}
footer address i{padding:0px 8px;}
footer address i:nth-child(1){padding-left:0px;}
footer address i:nth-child(2){border-right:1px solid #000; border-left:1px solid #000;} */

/* .goTop{position:absolute; top:-25px; right:12%; display:block; width:50px; height:50px; background:#fff; border:1px solid #0033ff; font-size:0px; z-index:99;}
.goTop::before{content:""; display:block; width:18px; height:22px; margin:13px auto; background:url('../images/icon_sprite.png')-6px -316px no-repeat} */

/*.intro{position:fixed; width:100%; height:100vh; background:#fff; z-index:1001; transition-duration:1s; display:none;}
.intro.over{opacity:0;}
.intro .loading_1{content:""; position:absolute; top:28%; right:42%; display:block; width:180px; height:180px; border-radius:300px; background:#59c7f7; opacity:0.5; transform:rotate(-45deg); transform-origin:top right; transition-duration:1s;}
.intro .loading_2{content:""; position:absolute; bottom:28%; left:42%; display:block; width:180px; height:180px; border-radius:300px; background:#0033ff; opacity:0.5; transform:rotate(-45deg); transform-origin:bottom left; transition-duration:1s;}
.intro.on .loading_1,.intro.on .loading_2{width:380px;}*/

@-moz-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@-webkit-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@-o-keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
@keyframes morphing {
  0% {
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
    box-shadow: 15px 15px 50px rgba(0,0,0,0.2);
  }
  25% {
    border-radius: 58% 42% 75% 25%/76% 46% 54% 24%;
  }
  50% {
    border-radius: 50% 50% 33% 67%/55% 27% 73% 45%;
    box-shadow: -10px -5px 50px rgba(0,0,0,0.2);
  }
  75% {
    border-radius: 33% 67% 58% 42%/63% 68% 32% 37%;
  }
}
.mobile{display: none}
.pc{display: block}




/*sub 공통*/
section{position:relative;}

/*nav*/
.subMenuHeader{top:-82px; width:100%; height:80px; background:#fff; opacity:0;}
.subMenuHeader.on{top:0px; opacity:1;}
.subMenuHeader.on + .defaultHeader{top:-100px; opacity:0;}
.subMenuHeader.on + .defaultHeader .subMenu{display:none;}
.subMenuHeader .wrapper{width: 1460px; display:flex; justify-content:space-between; margin: 0 auto;}
.subMenuHeader h1{margin-top:-12px;}
.subMenuHeader .btns{margin-top:18px;}
.subMenuHeader nav ul{position:relative; bottom:0px; display:flex; width:auto; margin:0 auto;}
.subMenuHeader nav ul li{position:relative; min-width:150px; line-height:80px; text-align:center; cursor:pointer;}
.subMenuHeader nav ul li.width{width: 200px}
.subMenuHeader nav ul li a{display:block; width:100%; line-height:80px; font-size:1.8rem;}
.subMenuHeader nav ul li:hover{color:#0033ff;}
.subMenuHeader nav ul::after{content:""; position:absolute; bottom:-1px; left:1px; display:block; width:25%; height:2px; background:#0033ff; transition-duration:0.2s;}
.subMenuHeader.type2 nav ul::after{width:50%;}
.subMenuHeader.type2 nav ul.select1::after{left:50%;}
.subMenuHeader.type3 nav ul::after{width:33.33333%;}
.subMenuHeader.type3 nav ul.select1::after{left:33.33333%;}
.subMenuHeader.type3 nav ul.select2::after{left:66.66666%;}
.subMenuHeader.type4 nav ul.select0::after{left:0%; width:100%;}
.subMenuHeader nav ul.select1::after{left:25%;}
.subMenuHeader nav ul.select2::after{left:50%;}
.subMenuHeader nav ul.select3::after{left:75%;}
.subMenuHeader nav ul.select0 li:nth-of-type(1){font-weight:700; color:#0033ff;}
.subMenuHeader nav ul.select1 li:nth-of-type(2){font-weight:700; color:#0033ff;}
.subMenuHeader nav ul.select2 li:nth-of-type(3){font-weight:700; color:#0033ff;}
.subMenuHeader nav ul.select3 li:nth-of-type(4){font-weight:700; color:#0033ff;}
.subMenuHeader .subMenuarea{display:none; transition-duration:0s;}

/*서브페이지 첫 섹션*/
.subIntro{height:100%;}
.subIntro h2{position:absolute;top:calc(50% + 50px);transform:translateY(-50%);width:100%;font-size: 3.75rem;font-weight:400;text-align:center;letter-spacing: -0.06em;opacity:0;transition-duration:1.5s;white-space:nowrap;}
.subIntro h2.on{top:40%; opacity:1;}
.subIntro h2 p{font-size: 7.5rem;color:rgb(0,0,0);font-weight:500;letter-spacing:-0.06em;}
.subIntro h2 i{color:#0033ff;}
.subIntro .scrolling{position:absolute; bottom:0px; left:50%; width:2px; height:0px; overflow:hidden; transition-duration:1s; transform:translate(-50%)translate3d(0,0,0); -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate(-50%)translate3d(0,0,0); -moz-transform:translate(-50%)translate3d(0,0,0);}
.subIntro h2.on + .scrolling{background:#c1c1c1; height:180px;}
.subIntro .scrolling::after{content:""; position:absolute; top:0px; width:3px; height:0px; background:#0033ff; animation-delay:1s; animation-name: scrolling; animation-duration: 1.2s; animation-iteration-count: infinite;}
.subIntro .inner{overflow:hidden;}
@keyframes scrolling {
  0% {height:0px; top:0px;}
  50% { eight:180px; top:0px;}
  100% {top:180px; height:180px;}
}
/*서브 비주얼*/
.subVisu{height:100vh; min-height:100%;}
.subVisu .subExp{width:46%;}

/*서브 타이틀*/
.subTitle{font-size:3.5rem; letter-spacing: -0.06em; line-height: 1.3; margin-bottom: 30px; transition-duration:1s;}
.subTitle span{font-size: 1.7rem; letter-spacing: -0.03em ;display: inline-block; opacity: 0.9; font-weight: 200}
.subTitle span.blue{font-size: 3.5rem; font-weight: 400}
.subTitle~.subTitle{margin-top:80px;}
.subExp{font-size:1.8rem; font-weight: 200; line-height: 1.5;}
.subExp.fontW{font-weight: 100;}
.amount{width:1280px; margin:140px auto 25px; font-size:5rem; font-weight:500;}
.amount strong{font-weight:700; font-size:10rem; color:#0033ff; margin-right: 10px;}
.amount i{font-size:1.8rem; font-weight:200; opacity: 0.8; margin-left: 20px;}

/*서브 정보*/
.subInfoType2{height:650px; background:#172355; color:#fff;}
.subInfoType2 h2{font-size:3.5rem;font-weight:500; padding-top:170px; margin-bottom:45px; line-height:42px;}
.subInfoType2 p{font-size:1.8rem; font-weight:200; line-height:26px;}

/*게시판*/
.board .tbl{display:none; overflow:hidden;}
.board .tbl.on{display:block;}
.board .tbl table{display:inline-block;}
.tblTab{float:right; display:flex; font-size:2rem;}
.tblTab li{padding:0px 30px; border-right:1px solid rgba(0,0,0,0.1)}
.tblTab li:last-child{padding-right:0px; border-right:0px;}
.tblTab>li.on{color:#0033ff;}
.tblTab~.tbl, .partnerBox .tblTab~div{margin-top:45px;}
.pagination ul{display:flex; justify-content: flex-end; align-items: center; margin-bottom: 30px;}
.amount+.pagination{margin-top:-70px;}
.pagination{display:block;}
.pagination ul{justify-content: center; margin:50px 0 0;}
.pagination ul li{display: flex; align-items: center; width: 25px; height:25px; margin:0 8px;}
.pagination ul li a{font-size: 2.0rem; color:#c1c1c1;}
.pagination ul li a.current, .pagination ul li:hover a{color: #181818;}
.pagination ul .prev a,.pagination ul .next a{display: block; width:13px; height:13px; border:3px solid #c1c1c1; border-top:none; border-right:none; font-size: 0;}
.pagination ul .prev a:hover,.pagination ul .next a:hover{border-color: #0033ff;}
.pagination ul .prev a{transform: rotate(45deg);}
.pagination ul .next a{transform: rotate(-135deg);}
.pagination ul .first a,.pagination ul .last a{display: block; width:13px; height:13px; border:3px solid #c1c1c1; border-top:none; border-right:none; font-size: 0;}
.pagination ul .first a:hover,.pagination ul .last a:hover{border-color: #0033ff;}
.pagination ul .first a{transform: rotate(45deg);}
.pagination ul .last a{transform: rotate(-135deg);}

.foldCont div{position: relative;}
.foldCont dl+a{position:absolute; display:block; right:4px; font-size:0px; width:22px; height:22px; border:4px solid #c1c1c1; border-top:0; border-right:0; transform: rotate(-45deg);
transition-duration:0.3s;}
.foldCont dl.on+a{transform: rotate(135deg);}

/*공용*/
.animatePaths{position:absolute;}
.animatePaths div{position:absolute;}
.fadeObj{transform:translate(0px,40px); opacity:0; transition-duration:0.5s;}
.fadeObj.on{transform:translate(0px,0px); opacity:1;}
.solVisu{position:relative; height:650px; padding:130px 0; background: #172355; color:#fff;}
.solVisu video{position: absolute; top:0; left:0;}

/*솔루션*/
.solList article>ul>li{background-color: #f8f9ff;}
.solList article>ul>li.on{ background:#fff;}
.solList article>ul>li:first-child div dl{border-top:1px solid rgba(0,0,0,0.1)}/*0114*/
.solList li>div{width:1280px; margin:0 auto; border-bottom:1px solid rgba(0,0,0,0.1); overflow:hidden; transition-duration:1s;}
.solList li.on>div{padding-bottom:100px;}
/* .solList li.on dl{height:220px;} */
.solList dl{display:flex; justify-content: space-between; padding:90px 120px 90px 0;}
.solList dt{width:380px; margin-right:40px; font-size:2.8rem; font-weight:500; vertical-align:top; letter-spacing:-0.06em;}
.solList dd{width:calc(100% - 430px); font-size:1.8rem; font-weight:200;}
.solList .foldCont dl+a{top:107px;}
.solList .inCont{display:none;}/*0114*/
.solList li.on .inCont{display: block;}
.solList .inCont>strong{display:block; position:relative; padding-left:23px; font-size:2rem; font-weight:500; margin-bottom:25px;}
.solList .inCont>strong~strong{margin-top:60px;}
.solList .inCont>strong::after,.solList .inCont>strong::before{content:""; position:absolute; left:0px; top:0px; width:16px; height:7px; border-radius:4px; background:#0033ff; opacity:0.8;}
.solList .inCont>strong::before{top:8px; transform: rotate(40deg);}
.solList .inCont>strong::after{top:14px; transform: rotate(-40deg);}
.solList h3{font-size:3rem; margin:60px 0 35px; font-weight:500;}
.solList h3 i{color:#0033ff;}
.solList div .listType{display:flex; border-spacing:10px;}
.solList div .listType li{flex:1; line-height:1.4; font-size:1.6rem; text-align:center;border-radius:15px 0px 15px 0px;}
.solList div .listType li:not(:last-child){margin-right:10px;}
.solList div .listType1 li{display:flex; align-items: center; justify-content:center; height:100px; background:rgba(0, 113, 249, 0.1); padding:5px; }
.solList div .listType2 li{border:1px solid #e5eaff; overflow:hidden;}
.solList div .listType2 em{display:block; padding:12px 5px;background:#e5eaff;}
.solList div .listType2 i{display:flex; justify-content: center; align-items: center; height:calc(100% - 46px);padding:12px 5px; font-size:1.5rem; line-height:1.4; opacity: 0.7;}
.solList .tbl{padding:0px; border:0;}
.solList .tbl table td:nth-of-type(2) .case .testimony ul{font-family:"notoSans"; text-align:right; font-weight:400; font-size:1.6rem; padding-right:88px;}
/* .solList .tbl table td:nth-of-type(2) time{position:relative; top:15px;} */
/* .solList .tbl table td:nth-of-type(2) time.top{top: -15px} */
/*0114*/
.solList .tbl .btnWrap a{width:276px; margin-top:50px;}

/*적용사례*/
.case{padding:140px 0;}
/* .case>article~article{margin-top:6%;} */
.case>article:nth-child(1){display: none;}
.case>article:nth-child(1) ul{display:flex; justify-content:space-around;}
.case>article:nth-child(1) strong{font-size:3.5rem; color:#0033ff;}
.case>article:nth-child(1) strong i{font-size:10rem; font-weight:700;}
.case>article:nth-child(1) em{display:block; font-size:3.5rem; letter-spacing: -0.08em;}
.case>article:nth-child(1) ul li span{display:block; margin-bottom:15px;}
.case>article:nth-child(1) ul li time{font-size:1.6rem; font-weight:200; opacity: 0.7;}

/*래퍼런스*/
.case .testimonySlide{position:relative; padding:70px 50px; box-shadow:0 10px 20px -4px rgba(0, 0, 0, 0.2);}

/*slide_arrow*/
.case .testimonySlide .slick-list{overflow:hidden}
.case .testimonySlide .slick-list .slick-track div{margin:0 30px;}
.case .testimonySlide .slick-arrow{position:absolute; top:50%; margin-top:-22px; font-size:0px; width:22px; height:22px; border:4px solid #c1c1c1; border-top:0; border-right:0; transition-duration: .3s;}
.case .testimonySlide .slick-arrow:hover{border-color: #999;}
.case .testimonySlide .slick-prev{left:-60px; transform: rotate(45deg);}
.case .testimonySlide .slick-next{right:-60px; transform:rotate(-135deg);}
/*slide_nav*/
.case .testimonySlide .slick-dots{position:absolute; top:0px; left:0; display: flex; width:100%;}
.case .testimonySlide .slick-dots li{flex:1;}
.case .testimonySlide .slick-dots button{width:100%; height:4px; background:#d8d8d8; font-size:0px; vertical-align:top; transition-duration:0.2s;}
.case .testimonySlide .slick-dots li.slick-active button{background:#0033ff;}
/*slide_content*/
.case .testimony>em{display:inline-block; padding:3px 20px; font-size:1.8rem; color:#0033ff; border:1px solid #0033ff;}
.case .testimony h4{display:block; margin:15px 0px; font-size:3rem; font-weight:500;}
.case .testimony p{font-size:1.6rem; padding-bottom: 40px; margin-bottom: 50px; border-bottom: 1px solid rgba(0,0,0,0.1);}
.case .testimony>ul{display:flex; flex-wrap:wrap;}
.case .testimony>ul>li{width:50%; position:relative; padding-left:23px; font-size:2rem; font-weight:500; margin-bottom:70px;}
.case .testimony>ul>li:nth-child(3),.case .testimony>ul>li:nth-child(4){margin-bottom: 0;}
.case .testimony>ul>li.review{width:100%;}
.case .testimony strong{display:block; margin-bottom: 15px; font-size:1.8rem;}
.case .testimony strong::after,.case .testimony strong::before{content:""; position:absolute; left:0px; top:0px; width:16px; height:7px; border-radius:4px; background:#0033ff; opacity:0.8;}
.case .testimony strong::before{top:14px; transform: rotate(-40deg); background: #59C7F7;}
.case .testimony strong::after{top:8px; transform: rotate(40deg);}
.case .testimony strong+ul>li{display:flex; padding-right:60px; font-size:1.4rem; font-weight: 200;}
.case .testimony strong+ul>li::before{content:"-"; display: inline-block; margin-right:5px;}
.case .testimony ul + p{ margin-bottom:20px; font-size:2rem; font-weight:500; color:#f26b55;}

.solBig{padding:9% 0; background:#172355; color:#fff;}
.solBig{background: #fff; color:#181818; padding:140px 0;}
.solBig ul{display:flex; justify-content:space-between; margin-top:70px} 
.solBig .subExp+ul{margin-top:90px;}
.solBig ul li{width:320px; text-align:center; font-size: 1.8rem;}
.solBig ul li::before{content:""; display:block; width:288px; height:288px; margin:0 auto;}
.solBig ul li strong{display:block; font-size:2.6rem; letter-spacing: -0.08em;}
.solBig ul li p{margin-top:15px}
.solBig ul li span{display:inline-block; margin-top:15px; font-size:1.5rem; font-weight: 400; line-height: 1.5; opacity:0.5;}
.solBig ul li span{opacity: 0.65;}

/*물어보세요*/
.question{background:#040921; height:386px; transform:translate(0px,0px) !important; opacity:1;}
.question div{height:386px; padding-top:130px; background:url('../images/search.gif')no-repeat 50%; text-align:center;  opacity:0; transform:translate(0px,40px); opacity:0; transition-duration:0.5s;}
.question.on div{transform:translate(0px,0px); opacity:1;}
.question div video{position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:-2;}
.question div h2{font-size:3rem; font-weight:500; color:#fff;}
.question div p{font-size:2rem; margin:10px 0px 30px; font-weight:200; color:#fff; opacity: 0.7;}
.question div a{display:inline-block; width:276px; line-height:50px; font-size:1.8rem; color:#fff; border:2px solid #59c7f7; transition-duration:0.2s;}
.question div a:hover{background:#0033ff; border:2px solid #0033ff; border-radius:67px 0px 67px 0px;}
.question+footer{margin-top: 0;}

.paging{display:flex; justify-content: flex-end; align-items: center; margin-bottom: 30px;}
.amount+.paging{margin-top:-70px;}
.tblList+.paging{justify-content: center; margin:50px 0 0;}
.paging li{display: flex; align-items: center; width: 25px; height:25px; margin:0 8px;}
.paging li a{font-size: 1.8rem; color:#c1c1c1;}
.paging li.on a,.paging li:hover a{color: #181818;}
.paging .prev a,.paging .next a{display: block; width:13px; height:13px; border:3px solid #c1c1c1; border-top:none; border-right:none; font-size: 0;}
.paging .prev a:hover,.paging .next a:hover{border-color: #0033ff;}
.paging .prev a{transform: rotate(45deg);}
.paging .next a{transform: rotate(-135deg);}

.modal .btn {padding:10px;font-size:15px;}
.modal .modal-header {font-size: 20px;padding: 20px;}
.modal .modal-header .close {font-size:30px;}
.previewModal .modal-dialog {left:-100px;}
.previewModal .file-box {padding: 10px; height: 50px; border: 1px solid #212529; color: #212529; float: left; line-height: 28px; margin-right: 10px; cursor: pointer;font-weight: 500;}
.previewModal .file-box:hover, .previewModal .file-box.on{border: 1px solid #0033ff; color: #0033ff;}
.alertPopup .modal-body {font-size: 17px;padding: 20px;text-align: center;}


.noHover{pointer-events: none;}

.langChange{position:relative; display:flex; align-items: center; font-size:19px; font-weight:500; color:#111; gap:0px 5px; padding:0px 10px; height:40px; border-radius:40px; border:1px solid transparent; z-index:2; }
.langChange::after{content:""; display:block; width:24px; height:24px; background:url("../images/arrow_lang.png")center center no-repeat; background-size:24px 24px;}
.langChange.on{border:1px solid #e1e1e1; background:#fff;}
.langChange.on::after{transform:rotate(180deg);}
.langSel{position:absolute; width:100%; top:0px; display:none; flex-direction: column; gap:10px 0px; border:1px solid #e1e1e1; border-radius:20px 20px 10px 10px; padding:50px 10px 10px; background:#fff;}
.langSel li a{color:rgba(17,17,17,0.6); transition-duration:0.2s; font-size:13px; font-weight:500;}
.langSel li a:hover{color:#111;}
.langChange.on + .langSel{display:flex; }