@charset "utf-8";

@import url("swiper.css");

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../font/notokr-light.eot');
    src: url('../font/notokr-light.eot?#iefix') format('embedded-opentype'), url('../font/notokr-light.woff') format('woff'), url('../font/notokr-light.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../font/notokr-regular.eot');
    src: url('../font/notokr-regular.eot?#iefix') format('embedded-opentype'), url('../font/notokr-regular.woff') format('woff'), url('../font/notokr-regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../font/notokr-medium.eot');
    src: url('../font/notokr-medium.eot?#iefix') format('embedded-opentype'), url('../font/notokr-medium.woff') format('woff'), url('../font/notokr-medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../font/notokr-bold.eot');
    src: url('../font/notokr-bold.eot?#iefix') format('embedded-opentype'), url('../font/notokr-bold.woff') format('woff'), url('../font/notokr-bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../font/notokr-black.eot');
    src: url('../font/notokr-black.eot?#iefix') format('embedded-opentype'), url('../font/notokr-black.woff') format('woff'), url('../font/notokr-black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}


/* reset */
html, body { position:relative; -webkit-font-smoothing:antialiased; height:100%; touch-action:auto; }
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, button, address, em, img, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, hr { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-touch-callout:none }
body { padding:0; background:#fff; font-family:'Noto Sans KR', sans-serif; font-size:20px; font-weight:400; color:#282728; box-sizing:border-box; min-width:280px; letter-spacing:-0.025em;line-height:1.25;}
h1, h2, h3, h4, h5, h6 { font-weight:normal }
ol, ul, li { list-style:none }
table { width:100%; border-collapse:collapse; border-spacing:0 }
form, fieldset, iframe { display:block; border:0 }
img, button { border:0 none; vertical-align:middle }
hr { height:0; display:none }
i, em, address { font-style:normal }
label, button { cursor:pointer }
caption, legend { width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; font-size:0; }
.blind { position:absolute !important; left:-9999em; width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; font-size:0; line-height:0; }
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption { display:block; box-sizing:border-box; }
input, textarea, select { margin:0; padding:0; font-family:'Noto Sans KR', sans-serif; font-size:20px; font-weight:400; color:#282728; vertical-align:middle; border-radius:0; box-shadow:none; box-sizing:border-box; }
select { appearance:none; -webkit-appearance:none; -moz-appearance:none; }
select::-ms-expand { display:none }
textarea { border: 1px solid #333; resize:none; overflow-y:auto; -webkit-overflow-scrolling: touch; }
button { overflow:visible; margin:0; padding:0; border:0 none; background:none; font-size:0; font-family:'Noto Sans KR', sans-serif; font-weight:400; vertical-align:top; cursor:pointer; }
button::-moz-focus-inner { border:0; padding:0; }
.ellipsis { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
a { color:#000; text-decoration:none; word-break:break-all; }
a:link, a:visited, a:hover, a:active, a:focus { text-decoration:none; }
input:-webkit-autofill { -webkit-box-shadow:0 0 0px 1000px white inset; }

/* Interval */
.mt0 { margin-top:0px !important }
.mt5 { margin-top:5px !important }
.mt6 { margin-top:6px !important }
.mt10 { margin-top:10px !important }
.mt15 { margin-top:15px !important }
.mt20 { margin-top:20px !important }
.mt25 { margin-top:25px !important }
.mt30 { margin-top:30px !important }
.mt35 { margin-top:35px !important }
.mt40 { margin-top:40px !important }
.mt50 { margin-top:50px !important }
.mt60 { margin-top:60px !important }
.mt70 { margin-top:70px !important }
.mt80 { margin-top:80px !important }
.mt90 { margin-top:90px !important }
.mt100 { margin-top:100px !important }

.mb0 { margin-bottom:0px !important }
.mb6 { margin-bottom:6px !important }
.mb10 { margin-bottom:10px !important }
.mb15 { margin-bottom:15px !important }
.mb20 { margin-bottom:20px !important }
.mb30 { margin-bottom:30px !important }
.mb40 { margin-bottom:40px !important }
.mb50 { margin-bottom:50px !important }
.mb60 { margin-bottom:60px !important }
.mb70 { margin-bottom:70px !important }
.mb80 { margin-bottom:80px !important }
.mb90 { margin-bottom:90px !important }
.mb100 { margin-bottom:100px !important }

.ml0 { margin-left:0px !important }
.ml10 { margin-left:10px !important }
.ml15 { margin-left:15px !important }
.ml20 { margin-left:20px !important }
.ml30 { margin-left:30px !important }
.ml40 { margin-left:40px !important }
.ml50 { margin-left:50px !important }
.ml60 { margin-left:60px !important }
.ml70 { margin-left:70px !important }
.ml80 { margin-left:80px !important }
.ml90 { margin-left:90px !important }
.ml100 { margin-left:100px !important }

.mr0 { margin-right:0px !important }
.mr10 { margin-right:10px !important }
.mr20 { margin-right:20px !important }
.mr30 { margin-right:30px !important }
.mr40 { margin-right:40px !important }
.mr50 { margin-right:50px !important }
.mr60 { margin-right:60px !important }
.mr70 { margin-right:70px !important }
.mr80 { margin-right:80px !important }
.mr90 { margin-right:90px !important }
.mr100 { margin-right:100px !important }

.pt0 { padding-top:0 !important }
.pt10 { padding-top:10px !important }
.pt20 { padding-top:20px !important }
.pt30 { padding-top:30px !important }
.pt35 { padding-top:35px !important }
.pt40 { padding-top:40px !important }
.pt50 { padding-top:50px !important }
.pt60 { padding-top:60px !important }
.pt70 { padding-top:70px !important }
.pt80 { padding-top:80px !important }
.pt90 { padding-top:90px !important }
.pt100 { padding-top:100px !important }

.pb0 { padding-bottom:0 !important }

/* floating */
.fl { float:left !important; }
.fr { float:right !important; }
.fn { float:none !important; }
.cl { clear:both !important; }

/* Align */
.tal { text-align:left !important }
.tac { text-align:center !important }
.tar { text-align:right !important }
.aTop { vertical-align:top !important }
.aMid { vertical-align:middle !important }
.aBtm { vertical-align:bottom !important }

/* Br */
.ui-w .wHide { display:none !important; }
.ui-m .mHide { display:none !important; }

/* Focus */
:focus { outline:none }


/* Layout */
.wrap{position:relative;margin:0 auto;}
.inner{position:relative;max-width:1320px;min-width:1024px;padding:0 20px;margin:0 auto;height:100%}

/* Header */
#header{position:sticky;top:0;left:0;right:0;height:100px;background:#fff;text-align:center;z-index:100;box-shadow:3px 3px 9px rgba(34, 41, 56, 0.29)}
#header .logo{position:absolute;top:50%;left:20px;transform:translateY(-50%)}
#header .logo a{display:block;text-indent:-9999em;width:134px;height:25px;background:url(../images/logo.png) no-repeat 0 0 / 100%}
#header #gnb{position:relative;height:100%;display:inline-flex;align-items: center;justify-content: center;}
#header #gnb a{position:relative;display:flex;height:100%;font-size:16px;font-weight:500;align-items: center;justify-content: center;margin:0 20px;color:#666}
#header #gnb a.on{font-weight:800;color:#4778e3;letter-spacing:-1.05px}
#header #gnb a.on:after{display:block;content:'';width:16px;height:6px;background:url(../images/bg_gnb_on.png) no-repeat 0 0;position:absolute;left:0;right:0;bottom:30px;margin:0 auto}
#header .utilArea{position:absolute;top:50%;right:20px;transform:translateY(-50%)}
#header .utilArea .btnHeadDown{display:inline-flex;align-items:center;height:33px;border-radius:3px;background:#4778e3;padding:0 10px}
#header .utilArea .btnHeadDown:before{display:block;content:'';width:17px;height:15px;background:url(../images/ico_btn_head_download.png) no-repeat 0 0 / 100%;margin-right:8px}
#header .utilArea .btnHeadDown span{font-size:14px;font-weight:500;color:#fff}

/* Footer */
#footer{position:relative;text-align:center;padding:70px 0 85px 0;background:#fff}
#footer .footerLogo{position:absolute;left:20px;top:50%;transform:translateY(-50%);text-indent:-9999em;width:83px;height:36px;background:url(../images/logo_jt2s.png) no-repeat 0 0 / 100%}
#footer .footerInfo{font-size:16px;line-height:1.6}
#footer .footerInfo .address > span{position:relative;font-weight:500;display:inline-block;vertical-align:top;padding-left:9px;margin-left:4px}
#footer .footerInfo .address > span:first-child{padding-left:0;margin-left:0}
#footer .footerInfo .address > span:before{display:block;content:'|';position:absolute;top:-1px;left:0;font-size:16px}
#footer .footerInfo .address > span:first-child:before{display:none}
#footer .footerInfo .copyright{font-weight:500;color:#b8b8b8}

/* Top Title */
.topTitle{text-align:center}
.topTitle .stit{display:block;font-size:24px;font-weight:500;color:#878787;word-break: keep-all;}
.topTitle h3{display:block;font-size:36px;font-weight:700;margin-top:8px;color:#4778e3;word-break: keep-all;}
.topTitle .desc{font-size:16px;line-height:1.5;margin-top:15px;color:#282728;word-break: keep-all;}

.titArea{text-align:center}
.titArea .titDefault{position:relative;display:inline-block;vertical-align:top;font-size:16px;font-weight:900;line-height:1;padding-bottom:10px;color:#4778e3;}
.titArea .titDefault:after{display:block;content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:#4778e3}

/* btnArea */
.btns{display:inline-flex;align-items:center;justify-content:center;min-width:113px;height:40px;font-size:16px;font-weight:700;padding:0 10px;border-radius:20px}

.btns.btnLine01{border:1px solid #fff;color:#fff}
.btns.btnLine01:hover{background:#fff;color:#4778e3}

/* Tabs */
.tabs{display:inline-flex;align-items:center;justify-content:center;position:absolute;left:50%;transform:translateX(-50%);z-index:20;border-radius:25px;background:rgba(255, 255, 255, 0.2)}
.tabs li{display:inline-block;vertical-align: top;}
.tabs a{position:relative;display:flex;align-items: center;justify-content: center;height:50px;padding:0 27px;color:#fff;font-size:18px}
.tabs li.on a{font-weight:700;background:#fff;border-radius:25px;color:#000}
.tabsCont{opacity:0;position:absolute;top:0;left:0;right:0;bottom:0;transition: opacity 0.85s linear;}
.tabsCont.active{opacity:1;z-index:15;}

/* modalPop */
.modalPop{display:none;opacity:0;position:fixed;top:0;right:0;bottom:0;transform:translateX(100%);z-index:999;overflow:hidden;background:#fff;transition:0.4s ease;box-shadow: -25px 0 10px rgb(0 0 0 / 40%);}
.modalPop .modalPopArea{position:relative;background:#fff;width:560px;height:100%;}
.modalPop .btnModalClose{display:block;text-indent:-9999em;position:absolute;top:27px;right:34px;bottom:0;width:38px;height:38px;background:url(../images/btn_modal_close.svg) no-repeat 0 0 / 38px}
.modalPop .modalBody{height:100%;overflow-y:auto;padding:110px 54px 50px 54px}

.modalPop.show{display:block;}
.modalPop.active{transform:translateX(0%);opacity:1}

/* Swiper Control */
.ctrlBox{position:absolute;left:0;right:0;bottom:95px;z-index:10;text-align:center;display:flex;align-items: center;justify-content: center;}
.ctrlBox .btnSwiper{display:block;text-indent:-9999em;width:35px;height:35px;background-position:0 0;background-size:100% auto;background-repeat:no-repeat}
.ctrlBox .btnSwiper.prev{background-image:url(../images/btn_swiper_prev.png)}
.ctrlBox .btnSwiper.next{background-image:url(../images/btn_swiper_next.png)}
.ctrlBox .btnSwiper.swiper-button-disabled{opacity:0.3}
.ctrlBox .pagination{margin:0 15px}
.ctrlBox .pagination span{width:20px;height:20px;opacity:1;border-radius:50%;background:#dee9ff;margin:0 4px}
.ctrlBox .pagination span.swiper-pagination-bullet-active{background:#4778e3}

/* Section */
.sectionWrap .section{position:relative;overflow:hidden}
.sectionWrap .section .inner{position:relative;max-width:1280px;height:100%;margin:0 auto;display:flex;align-items: center;flex-direction: column;flex-wrap: nowrap;justify-content: center;z-index:10;}

/* 비쥬얼 */
.section.visual .visual01{background:#549ef9}
.section.visual .visual02{background:#475de3}
.section.visual .inner{align-items: flex-start;text-align:left}
.section.visual .topTitle{position:relative;z-index:15;text-align:left;opacity:0;transform:translateX(50px);}
.section.visual .topTitle h2{font-size:48px;font-weight:100;color:#fff;}
.section.visual .topTitle h2 strong{font-weight:900}
.section.visual .topTitle .desc{font-size:16px;font-weight:100;margin-top:15px;color:#fff}
.section.visual .topTitle .btnArea{margin-top:30px}
.section.visual .ctrlBox{bottom:70px}
.section.visual .ctrlBox .pagination span{background:rgba(255, 255, 255, 0.3)}
.section.visual .ctrlBox .pagination span.swiper-pagination-bullet-active{background:#fff}
.section.visual .ctrlBox .btnSwiper.prev{background-image:url(../images/btn_vis_swiper_prev.png)}
.section.visual .ctrlBox .btnSwiper.next{background-image:url(../images/btn_vis_swiper_next.png)}
.section.visual .obj{position:absolute;opacity:0;}

.section.visual .visual01 .obj.hand{right:113px;bottom:30px;z-index:5;transform:translateY(80px)}
.section.visual .visual01 .obj.check{right:566px;bottom:400px;transform:translateX(80px);}
.section.visual .visual01 .obj.document{right:235px;bottom:306px;transform:translateX(-80px);}

.section.visual .visual02 .obj.mobile{right:130px;bottom:165px;z-index:5;transform:translateY(80px);}
.section.visual .visual02 .obj.graph01{right:584px;bottom:370px;transform:translateY(50px);}
.section.visual .visual02 .obj.graph02{right:264px;bottom:150px;z-index:10;transform:translateY(50px);}
.section.visual .visual02 .obj.graph03{right:60px;bottom:185px;z-index:10;transform:translateY(50px);}

.section.visual.active .swiper-slide.activeStart .topTitle{opacity:1;transform:translateX(0);transition: 0.5s 0.2s ease}

.section.visual.active .swiper-slide.activeStart .obj.hand{opacity:1;transform:translateX(0);transition: 0.5s 0.2s ease;}
.section.visual.active .swiper-slide.activeStart .obj.check{opacity:1;transform:translateX(0);transition: 0.5s 0.6s ease;}
.section.visual.active .swiper-slide.activeStart .obj.document{opacity:1;transform:translateX(0);transition: 0.5s 0.7s ease;}

.section.visual.active .swiper-slide.activeStart .obj.mobile{opacity:1;transform:translateY(0);transition: 0.5s 0.2s ease;}
.section.visual.active .swiper-slide.activeStart .obj.graph01{opacity:1;transform:translateY(0);transition: 0.5s 0.6s ease;}
.section.visual.active .swiper-slide.activeStart .obj.graph02{opacity:1;transform:translateY(0);transition: 0.5s 1s ease;}
.section.visual.active .swiper-slide.activeStart .obj.graph03{opacity:1;transform:translateY(0);transition: 0.5s 1.4s ease;}

/* solutions */
.section.solutions{height:1080px;background:#fff}
.section.solutions .titArea{position:absolute;top:122px;left: 50%; transform: translateX(-50%);}
.section.solutions .topTitle{position:absolute;top:195px;left:0;right:0;opacity:0;transform:translateY(80px)}

.section.solutions .balloonList{position:absolute;left:50%;top:380px;width:864px;height:608px;transform:translateX(-50%);z-index:5}
.section.solutions .balloonList .item{position:absolute;}
.section.solutions .balloonList .item img{opacity:0;}
.section.solutions .balloonList .item:nth-child(1){left:60px;top:0}
.section.solutions .balloonList .item:nth-child(1) img{transform:translateX(-50px)}
.section.solutions .balloonList .item:nth-child(2){right:10px;top:70px}
.section.solutions .balloonList .item:nth-child(2) img{transform:translateX(50px)}
.section.solutions .balloonList .item:nth-child(3){left:0;top:215px}
.section.solutions .balloonList .item:nth-child(3) img{transform:translateX(-50px)}
.section.solutions .balloonList .item:nth-child(4){right:0;top:258px}
.section.solutions .balloonList .item:nth-child(4) img{transform:translateX(50px)}
.section.solutions .balloonList .item:nth-child(5){left:250px;top:395px}
.section.solutions .balloonList .item:nth-child(5) img{transform:translateY(50px)}

.section.solutions .objList{position:absolute;left:50%;top:380px;width:864px;height:608px;transform:translateX(-50%);}
.section.solutions .objList .obj{position:absolute;text-align:center;left:0;right:0}
.section.solutions .objList .obj img{opacity:0;transform:translateY(50px)}
.section.solutions .objList .obj:nth-child(1){top:0;}
.section.solutions .objList .obj:nth-child(1) img{opacity:1;transform:scale(0.75)}
.section.solutions .objList .obj:nth-child(2){top:90px;}

.section.solutions.active .topTitle{opacity:1;transform:translateY(0);transition:0.6s 0.2s ease}

.section.solutions.active .objList .obj img{opacity:1;transform:translateY(0) scale(1);transition:0.6s ease}
.section.solutions.active .objList .obj:nth-child(1) img{transition-delay: 0.6s;}
.section.solutions.active .objList .obj:nth-child(2) img{transition-delay: 0.9s;}

.section.solutions.active .balloonList .item img{opacity:1;transform:translate(0);transition:0.4s ease}
.section.solutions.active .balloonList .item:nth-child(1) img{transition-delay: 1.2s;}
.section.solutions.active .balloonList .item:nth-child(2) img{transition-delay: 1.6s;}
.section.solutions.active .balloonList .item:nth-child(3) img{transition-delay: 2s;}
.section.solutions.active .balloonList .item:nth-child(4) img{transition-delay: 2.4s;}
.section.solutions.active .balloonList .item:nth-child(5) img{transition-delay: 2.8s;}

.section.solutions.active .bouceStart img{animation: bounceFrames1 0.8s linear  infinite alternate;}
.section.solutions.active .balloonList .item.bouceStart:nth-child(1) img{animation-delay: 0.2s; }
.section.solutions.active .balloonList .item.bouceStart:nth-child(2) img{animation-delay: 0.4s; }
.section.solutions.active .balloonList .item.bouceStart:nth-child(3) img{animation-delay: 0.6s; }
.section.solutions.active .balloonList .item.bouceStart:nth-child(4) img{animation-delay: 0.8s; }
.section.solutions.active .balloonList .item.bouceStart:nth-child(5) img{animation-delay: 1s; }

@keyframes bounceFrames1 {
  100% {transform:translateY(-15px)}
}

/* features */
.section.features{background:#ebf1ff;text-align:center}
.section.features .inner{align-items: flex-start;padding:0 145px;text-align:left;height:725px}
.section.features .titArea{position:absolute;top:120px;left: 50%;transform: translateX(-50%);z-index:10}
.section.features .topTitle{position:relative;z-index:10;text-align:left;opacity:0;transform:translateX(80px)}
.section.features .objList{position:absolute;top:0;right:0;}
.section.features .objList .obj{opacity:0;transform:translateY(50px)}

.section.features.active .swiper-slide-active .topTitle{opacity:1;transform: translateX(0px);transition:0.5s ease}
.section.features.active .swiper-slide-active .objList .obj{opacity:1;transform: translateY(0px);transition:0.5s 0.2s ease}

/* company */
.section.company{background:#325194;padding:120px 0 0 0}
.section.company .inner{padding:0 145px 165px 145px;display:block;}
.section.company .titArea{margin-bottom:90px}
.section.company .titDefault{color:#fff;}
.section.company .titDefault:after{background:#fff}
.section.company .topTitle{position:relative;text-align:left;opacity:0;transform:translateX(50px);z-index:10}
.section.company .topTitle .stit{color:#fff}
.section.company .topTitle h3{color:#fff}
.section.company .topTitle .desc{color:#82a4ec}

.section.company .objList{position:absolute;top:48px;right:70px;opacity:0;transform:translateY(70px)}

.section.company .portfolioList{position:relative;z-index:10;opacity:0;transform:translateY(30px);}
.section.company .portfolioList:before{display:block;content:'PORTFOLIO';font-size:53px;font-weight:900;color:rgba(114, 156, 246, 0.4);position:absolute;left:-225px;bottom:170px;transform: rotate(90deg)}
.section.company .portfolioList .item{display:flex;justify-content: space-between;width:100%;margin-top:80px;background:#fff;box-shadow:25px 25px 24px rgba(32, 47, 80, 0.3);border-radius:10px;padding:12px;justify-content: space-between;}
.section.company .portfolioList .info{width:calc(100% - 450px);padding:30px 20px }
.section.company .portfolioList .info .head .type{display:flex;align-items: center;}
.section.company .portfolioList .info .head .type span{position:relative;display:block;font-size:16px;font-weight:900;color:#a6a6a6;padding-left:10px;margin-left:11px;line-height:1}
.section.company .portfolioList .info .head .type span:first-child{padding-left:0;margin-left:0}
.section.company .portfolioList .info .head .type span:before{display:block;content:'';width:1px;height:14px;background:#bebebe;position:absolute;top:2px;left:0}
.section.company .portfolioList .info .head .type span:first-child:before{display:none}
.section.company .portfolioList .info .head .subject{display:block;font-size:24px;font-weight:700;color:#282728;margin-top:16px;word-break: keep-all}
.section.company .portfolioList .info .cont{margin-top:10px}
/* .section.company .portfolioList .info .cont .result{width:111px;height:45px;background:url(../images/bg_portpolio_result.png) no-repeat 0 0 / 100%;padding-right:35px;line-height:49px;font-size:21px;font-weight:900;color:#fff;text-align:right} */
.section.company .portfolioList .info .cont .result{display:inline-flex;align-items: center;justify-content:center;background:#4778e3;border-radius:17px;font-size:20px;font-weight:800;color:#fff;height:34px;padding:0 18px}
.section.company .portfolioList .info .cont .summary{font-size:18px;font-weight:500;line-height:1.5;color:#4778e3;margin-top:10px;word-break: keep-all}
.section.company .portfolioList .info .cont .desc{font-size:14px;font-weight:500;line-height:1.5;color:#7a7a7a;margin-top:12px;word-break: keep-all}
.section.company .portfolioList .thumb{width:400px;overflow:hidden;border-radius:2px}
.section.company .portfolioList .ctrlBox{bottom:-97px}
.section.company .portfolioList .ctrlBox .btnSwiper.prev{background-image: url(../images/btn_vis_swiper_prev.png);}
.section.company .portfolioList .ctrlBox .btnSwiper.next{background-image: url(../images/btn_vis_swiper_next.png);}
.section.company .portfolioList .ctrlBox .pagination span{background:#fff;opacity:0.29}
.section.company .portfolioList .ctrlBox .pagination span.swiper-pagination-bullet-active{opacity:1}

.section.company.active .topTitle{opacity:1;transform:translateX(0);transition:0.5s ease}
.section.company.active .objList{opacity:1;transform:translateY(0);transition:0.5s 0.3s ease}
.section.company.active .portfolioList{opacity:1;transform:translateY(0);transition:0.5s 0.6s ease}

.section.company.active .objList.bouceStart img{animation: bounceFrames2 1s linear  infinite alternate;}

@keyframes bounceFrames2 {
    100% {transform:translateY(-5px)}
  }

/* Contact Us */
.section.contact{background:#ebf1ff;padding:100px 0 150px 0}
.section.contact .inner{padding:0 145px}
.section.contact .titArea{margin-bottom:95px}
.section.contact .contactList{display:flex;justify-content: center;width:100%}
.section.contact .contactList .item{position:relative;width:calc(100% / 3);text-align:center;padding-top:240px;opacity:0;transform:translateY(50px)}
.section.contact .contactList .item:before{display:block;content:'';width:auto;height:211px;background-repeat:no-repeat;background-position:center 0;position:absolute;top:0;left:0;right:0;margin:0 auto}
.section.contact .contactList .item:nth-child(1):before{background-image:url(../images/img_contact01.png);height:218px;top:-7px}
.section.contact .contactList .item:nth-child(2):before{background-image:url(../images/img_contact02.png);}
.section.contact .contactList .item:nth-child(3):before{background-image:url(../images/img_contact03.png);width:231px;left:20px}
.section.contact .contactList .item strong{display:block;font-size:14px;line-height:1.5;font-weight:700;color:#010101;}
.section.contact .contactList .item p{font-size:14px;font-weight:500;line-height:1.5;color:#7a7a7a;margin-top:13px}
.section.contact .contactList .item a{color:#7a7a7a;}

.section.contact.active .contactList .item{display:block;opacity:1;transform:translateY(0);transition:0.4s ease}
.section.contact.active .contactList .item:nth-child(1){transition-delay:0s}
.section.contact.active .contactList .item:nth-child(2){transition-delay:0.3s}
.section.contact.active .contactList .item:nth-child(3){transition-delay:0.6s}


/* 모바일 */
.ui-m img{max-width:100%;width:100%}

/* Button */
.ui-m .btns{min-width:85px;height:30px;font-size:12px}

/* layout */
.ui-m .inner{max-width:none;min-width:320px;padding:0 10px}

/* Header */
.ui-m #header{height:45px}
.ui-m #header .logo{left:10px}
.ui-m #header .logo a{width:81px;height:17px}
.ui-m #header #gnb{display:none}
.ui-m #header .utilArea{right:10px}
.ui-m #header .utilArea .btnHeadDown{height:25px;padding:0 8px}
.ui-m #header .utilArea .btnHeadDown:before{margin-right:0;width:12px;height:12px;background-image:url(../images/m_ico_btn_head_download.png)}
.ui-m #header .utilArea .btnHeadDown span{display:none}

/* Footer */
.ui-m #footer{text-align:center;padding:24px 0 14px 0}
.ui-m #footer .footerLogo{position:static;margin:0 auto;width:65px;height:28px}
.ui-m #footer .footerInfo{font-size:11px;}
.ui-m #footer .footerInfo .address > span{padding-left:6px;margin-left:3px}
.ui-m #footer .footerInfo .address > span:before{font-size:11px}

/* Swiper Control */
.ui-m .ctrlBox{bottom:42px;}
.ui-m .ctrlBox .btnSwiper{width:24px;height:24px;}
.ui-m .ctrlBox .pagination{margin:0 10px}
.ui-m .ctrlBox .pagination span{width:12px;height:12px;margin:0 3px}

/* topTitle */
.ui-m .topTitle .stit{font-size:12px;}
.ui-m .topTitle h3{font-size:21px;margin-top:4px}
.ui-m .topTitle .desc{font-size:12px;margin-top:10px}

/* Visual */
.ui-m .section.visual .inner{text-align:center;align-items: center;justify-content: flex-start}
.ui-m .section.visual .topTitle{text-align:center;padding-top:72px}
.ui-m .section.visual .topTitle h2{font-size:26px}
.ui-m .section.visual .topTitle .desc{font-size:12px;margin-top:15px}
.ui-m .section.visual .topTitle .btnArea{margin-top:13px}
.ui-m .section.visual .swiper-slide{overflow:hidden}
.ui-m .section.visual .ctrlBox{bottom:30px}
.ui-m .section.visual .visual01 .obj,
.ui-m .section.visual .visual02 .obj{left:0;right:0;bottom:0}
.ui-m .section.visual .visual01 .obj img,
.ui-m .section.visual .visual02 .obj img{max-width:540px;}

/* solutions */
.ui-m .section.solutions{height:auto;}
.ui-m .section.solutions .inner{justify-content: flex-start;padding-top:58px;text-align:center}
.ui-m .section.solutions .titArea{position:static;transform:none}
.ui-m .section.solutions .topTitle{position:static;margin-top:20px}

.ui-m .section.solutions .balloonList{position:static;width:auto;height:auto;transform:none}
.ui-m .section.solutions .balloonList .item{left:0;right:0;bottom:0;top:auto}
.ui-m .section.solutions .balloonList .item img{max-width:540px;}

.ui-m .section.solutions .objList{position:static;width:auto;height:auto;transform:none}
.ui-m .section.solutions .objList .obj{left:0;right:0;bottom:0;top:auto}
.ui-m .section.solutions .objList .obj:nth-child(1){position:static;margin-top:30px}
.ui-m .section.solutions .objList .obj img{max-width:540px;}

/* features */
.ui-m .section.features{padding:0}
.ui-m .section.features .inner{padding:0;text-align:center;align-items: center;justify-content: flex-start;height:auto}
.ui-m .section.features .titArea{top:45px}
.ui-m .section.features .topTitle{text-align:center;position:absolute;top:90px;left:0;right:0}
.ui-m .section.features .objList{position:static}
.ui-m .section.features .objList img{max-width:540px}

/* company */
.ui-m .section.company{padding-top:56px;padding-bottom:50px;}
.ui-m .section.company .inner{padding:0 10px;overflow:inherit}
.ui-m .section.company .titArea{margin-bottom:40px}
.ui-m .section.company .topTitle{text-align:center}

.ui-m .section.company .objList{position:static;margin-top:10px;text-align:center}
.ui-m .section.company .objList .obj img{max-width:540px}

.ui-m .section.company .portfolioList:before{display:none}
.ui-m .section.company .portfolioList .item{margin-top:0;padding:12px;border:2px solid #4778e3}
.ui-m .section.company .portfolioList .thumb{position:absolute;top:12px;left:12px;bottom:12px;width:35%;}
.ui-m .section.company .portfolioList .info{padding:10px 10px 10px calc(35% + 30px);width:auto}
.ui-m .section.company .portfolioList .info .head .type span{font-size:11px;padding-left:6px;margin-left:7px}
.ui-m .section.company .portfolioList .info .head .type span:first-child{padding-left:0;margin-left:0}
.ui-m .section.company .portfolioList .info .head .type span:before{height:9px}
.ui-m .section.company .portfolioList .info .head .subject{font-size:14px;margin-top:8px}
.ui-m .section.company .portfolioList .info .cont .result{font-size:11px;font-weight:500;height:24px}
.ui-m .section.company .portfolioList .info .cont .summary{font-size:11px;margin-top:6px}
.ui-m .section.company .portfolioList .info .cont .desc{font-size:11px}
.ui-m .section.company .portfolioList .ctrlBox{position:static;margin-top:30px}

/* contact */
.ui-m .section.contact{padding:48px 0 45px 0}
.ui-m .section.contact .inner{padding:0 28px}
.ui-m .section.contact .titArea{margin-bottom:80px}

.ui-m .section.contact .contactList{display:block}
.ui-m .section.contact .contactList .item{display:flex;flex-direction: column;flex-wrap: nowrap;align-items:flex-start;justify-content: center;width:100%;text-align:left;padding:0 0 0 128px;min-height:110px}
.ui-m .section.contact .contactList .item + .item{margin-top:45px}
.ui-m .section.contact .contactList .item:before{top:0;left:0;right:auto;width:110px;height:110px;background-size:100%}
.ui-m .section.contact .contactList .item:nth-child(1):before{height:114px}
.ui-m .section.contact .contactList .item:nth-child(3):before{width:114px}
.ui-m .section.contact .contactList .item strong{font-size:14px}
.ui-m .section.contact .contactList .item p{font-size:12px;margin-top:5px}