@charset "utf-8";
@import url('initialize.css');

html, body{position:relative;height:100%}
img{max-width:100%}
a,a:hover,a:active,a:focus{text-decoration:none}
h1{letter-spacing:-1px}
label{font-size:1em;font-weight:400;color:#000}

p{font-weight:400;}

.fL{float:left}
.txt-pointColor{color:#050051}
#sub-container{font-size:14px !important}

.blind{position:absolute;overflow:hidden;clip:rect(0 0 0 0);margin:-1px;width:1px;height:1px}
.checkbox{vertical-align:top;margin:0;overflow:hidden;position:relative;display:inline-block;width:15px;height:15px;vertical-align:-2px;cursor:pointer}
.checkbox input[type=checkbox]:checked + i{background-position-x:-15px}
label{position:relative;font-weight:400;font-size:1em;color:#888;cursor:pointer}
label:after {content: '';position:absolute;right:100%;bottom:-2px;left:28px;display:block;height:1px;background:#2e3092;transition: .1s}
.checkbox input[type=checkbox]{position:relative;width:15px;height:15px;margin:0;padding:0;cursor:pointer;opacity:0}
input[type=checkbox]{width:15px;height:15px;vertical-align:top;cursor:pointer}
.checkbox i{position:absolute;top:0;left:0;right:0;bottom:0;background:url(/images/client/icon/ico-check.png) no-repeat 0 0}

.top-logo{display:inline-block;/*margin-top:.5em;*/transition:all .2s;-webkit-transition:all .2s;-ms-transition:all .2s;}
.top-logo a{display:block;max-width:12.500em;width:92px;height:2.7em;background-position:0 0;background-repeat:no-repeat;background-size:contain;transition:background .3s;-webkit-transition:background .3s;-ms-transition:background .3s}

header{float:right;z-index:9000}
header .btn-companyInfo{float:left;display:block;border:1px solid #fff;border-radius:25px;padding:.8em 1.5em .8em;font-size:0.8em;text-align:center;transition:all .2s;-webkit-transition:all .2s;-ms-transition:all .2s}
header .btn-menu{float:right;margin:.6em 0 0 2vw}

.ico-down{display:inline-block;width:19px;height:19px;background:url('/images/client/icon/ico-common.png') no-repeat -58px 1px;vertical-align:middle}
.btn-companyInfo .ico-down{margin-left:.3em}

.btn-menu{width:30px;height:24px;position:relative;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .2s ease-in-out;-moz-transition: .2s ease-in-out;-o-transition: .2s ease-in-out;transition: .2s ease-in-out;cursor: pointer}
.btn-menu:hover,.btn-menu:focus,.btn-menu:active{outline:none;border:none}
.btn-menu span{display:block;position:absolute;height:3px;width:100%;opacity:1;left:0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out}
.btn-menu span:nth-child(1){top:0px}
.btn-menu span:nth-child(2){top:9px;left:8px;width:22px}
.btn-menu span:nth-child(3){top:18px}
.btn-menu:not(.open):hover span:nth-child(1),
.btn-menu:not(.open):hover span:nth-child(3){left:8px;width:22px}
.btn-menu:not(.open):hover span:nth-child(2){left:0;width:100%}
.btn-menu.open span:nth-child(1){top:9px;-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);-o-transform: rotate(135deg);transform: rotate(135deg)}
.btn-menu.open span:nth-child(2){opacity:0;left: -60px}
.btn-menu.open span:nth-child(3){top: 9px;-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);-o-transform: rotate(-135deg);transform: rotate(-135deg)}

.btn-prev {position: absolute; left: 10px; top: 50%; margin-top: -40px; z-index: 99; width: 80px;}
.btn-next {position: absolute; right: 10px; top: 50%; margin-top: -40px; z-index: 99; width: 80px;}

.btn-menu span{background:#fff}
header .btn-companyInfo{color:#fff}
.btn-companyInfo .ico-down{background:url('/images/client/icon/ico-common.png') no-repeat -58px 1px}
.top-logo a{background-image:url('/images/client/icon/logo-AVIV.png');transition:background .3s;-webkit-transition:background .3s;-ms-transition:background .3s}

.gnb-chk{position:fixed;left:0;right:0;z-index:9999;margin-top:0;padding: 4em;box-sizing:border-box;transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s}
.gnb-chk.on{background:#fff;padding:1.5em 4em;transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s}
.gnb-chk.on .btn-menu span{background:#333}
.gnb-chk.on header .btn-companyInfo{color:#000;font-weight:400;}
.gnb-chk.on .btn-companyInfo .ico-down{background:url('/images/client/icon/ico-arrowSm-black.png') no-repeat 3px 2px}
.gnb-chk.on .top-logo a{background-image:url('/images/client/icon/logo-AVIV-color.png')}
.gnb-chk.on .btn-companyInfo{border-color:#333}

.gnb-chk.policy{background:#fff;padding:1.5em 4em;transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s}
.gnb-chk.policy .btn-menu span{background:#333}
.gnb-chk.policy header .btn-companyInfo{color:#000}
.gnb-chk.policy .btn-companyInfo .ico-down{background:url('/images/client/icon/ico-arrowSm-black.png') no-repeat 3px 2px}
.gnb-chk.policy .top-logo a{background-image:url('/images/client/icon/logo-AVIV-color.png')}
.gnb-chk.policy .btn-companyInfo{border-color:#333}


.gnb-chk.color-white{padding:4em 4em 0}

.gnb-chk.hide{margin-top:-7em;transition:all 1s;-webkit-transition:all 1s;-ms-transition:all 1s}

/*
 * .btn-menu span{background:#333}
 * header .btn-companyInfo{color:#000}
 * .btn-companyInfo .ico-down{background:url('/images/client/icon/ico-arrowSm-black.png') no-repeat 3px 2px}
 * .top-logo a{background-image:url('/images/client/icon/logo-AllLiveHC-color.png')}
 *
 * .color-white header .btn-menu span{background:#fff;-webkit-transition: .2s ease-in-out;-moz-transition: .2s ease-in-out;-o-transition: .2s ease-in-out;transition: .2s ease-in-out;}
 * .color-white header .btn-companyInfo{border-color:#fff;color:#fff;-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;}
 * .color-white .btn-companyInfo .ico-down{background:url('/images/client/icon/ico-common.png') no-repeat -58px 1px;}
 * .color-white .top-logo a{background-image:url('/images/client/icon/logo-AllLiveHC.png');transition:background .3s;-webkit-transition:background .3s;-ms-transition:background .3s}
 * */

[data-aos^=fade].aos-animate.aosDelay1{transition-delay:.2s}
[data-aos^=fade].aos-animate.aosDelay2{transition-delay:.4s}
[data-aos^=fade].aos-animate.aosDelay3{transition-delay:.6s}
[data-aos^=fade].aos-animate.aosDelay4{transition-delay:.8s}
[data-aos^=fade].aos-animate.aosDelay5{transition-delay:1s}
[data-aos^=fade].aos-animate.aosDelay6{transition-delay:1.2s}
[data-aos^=fade].aos-animate.aosDelay7{transition-delay:1.4s}

#gnb{display:none;position:fixed;top:0;right:0;left:0;bottom:0;z-index:8000;height:100vh;background:#050051}
#gnb .menu-con{position:absolute;top:50%;left:50%;width:100%;text-align:center;transform:translate3d(-50%, -50%, 0);-webkit-transform:translate3d(-50%, -50%, 0);-ms-transform:translate3d(-50%, -50%, 0)}
#gnb ul li{line-height:1.8}
#gnb ul a{animation-name:m-eft;animation-duration:1s;position:relative;display:inline-block;color:#fff;font-size:3.750em;font-weight:100;letter-spacing:.05em;animation-fill-mode:both}
#gnb ul a:hover{transition:all .2s;font-weight:900}

#gnb.show ul li a{opacity:0;}
#gnb.show ul li:nth-child(2) a{animation-delay:.2s}
#gnb.show ul li:nth-child(3) a{animation-delay:.4s}
#gnb.show ul li:nth-child(4) a{animation-delay:.6s}
#gnb.show ul li:nth-child(5) a{animation-delay:.8s}

#gnb.hide ul li a{animation-name:m-eftClose;animation-duration:.5s}
#gnb.hide ul li:nth-child(2) a{animation-delay:.1s}
#gnb.hide ul li:nth-child(3) a{animation-delay:.2s}
#gnb.hide ul li:nth-child(4) a{animation-delay:.3s}
#gnb.hide ul li:nth-child(5) a{animation-delay:.4s}


@keyframes m-eft{0%{opacity:0;top:-1em}100%{opacity:1;top:0}}
@keyframes m-eftClose{0%{opacity:1;top:0}100%{opacity:0;top:-1em}}


.btn-radius{display:inline-block;padding:.5em 1em;border:1px solid #999;border-radius:25px;font-size:1em;font-weight:400;text-align:center;line-height:1}
.size-sm{font-size:12px;color:#777 !important}
.size-basic{font-weight:500}
.pointColor{border:1px solid #050051;background:#050051;color:#fff;padding:1em 3em}
.white{color:#fff !important;border-color:#fff}

.boxContrl{display:none;margin-bottom:2em}

.contact-wrap{display:table;max-width:1300px;width:100%;height:19.375em;margin:5em auto 0;background:url('/images/client/photo/img-contact.png') no-repeat 50% 50%}
.contact-con{overflow:hidden;display:table-cell;color:#fff;text-align:center;vertical-align:middle}
.contact-con:first-child{width:60%}
.contact-con .con-itemWrap{width:50%;text-align:center}
.contact-con .con-itemWrap span{display:block;margin-top:.3em}
.contact-con .con-itemWrap .con-item{display:inline-block;padding-left:1em;text-align:left;vertical-align:super}
.contact-con .con-itemWrap span:first-child{margin-top:0;font-size:1.250em;font-weight:500}
.contact-con p{margin-top:2em}
.contact-con p:first-child{margin-top:0}
.contact-con a{display:inline-block;min-width:10em;padding:1.1em 1em;font-weight:500;transition-property:border-color, color;transition-duration:.2s;-webkit-transition-duration:.2s;-ms-transition-duration:.2s}
.contact-con a:hover{border-color:#6ee9ff;color:#6ee9ff !important;transition-property:border-color, color;transition-duration:.2s;-webkit-transition-duration:.2s;-ms-transition-duration:.2s}
.contact-con .contact-group{display:table;width:100%;margin: 0 auto;max-width:35em}
.contact-con .contact-group .con-itemWrap{position:relative;display:table-cell;width:50%;box-sizing:border-box;vertical-align:middle}
.contact-con .contact-group .con-itemWrap:first-child{border-right:1px solid rgba(255,255,255,.5)}

.menu-con .contact-con{display:inline-block;width:100%;max-width:35em;margin-top:5em}
.menu-con .contact-con .contact-group{width:100%}

.ico-contact{display:inline-block;width:3.8em;height:3.8em;background-image:url('/images/client/icon/ico-common.png');background-repeat:no-repeat;background-size:8.3em;background-position-y:-1.55em}
.ico-contact.tel{background-position-x:0}
.ico-contact.mail{background-position-x:-4.4em}

.mCSB_container{padding:.1em 0}

#footer{position:relative;z-index:20;padding:2.4em 0;background:#333}
#footer .ft-wrap{position:relative;max-width:1300px;margin:0 auto}
#footer .ft-wrap .ft-con{display:table;width:100%}
#footer .ft-wrap:after{content:"";display:block;clear:both}
#footer .ft-wrap .ft-copyInfo{display:table-cell;/*padding-left:3em;*/vertical-align:middle}
#footer .ft-wrap .ft-copyInfo .copyInfo{margin-top:1.5em;font-size:14px;font-weight:300;color:#c1c1c1;line-height:1.6;word-break:keep-all}
#footer .ft-wrap .ft-copyInfo .copyInfo > span{display:block}
#footer .ft-wrap .ft-copyInfo a{display:inline-block;color:rgba(255,255,255,.5);font-weight:400}
#footer .ft-wrap .ft-logo{display:table-cell;max-width:4.438em;vertical-align:middle}
#footer .ft-wrap .ft-copyInfo .copy{font-size:14px;color:#fff}
#footer .ft-wrap .ft-copyInfo .copyInfo .txt-copy{color:#989898}
#footer .btn-top{display:block;position:absolute;top:-70%;right:0;z-index:5;border-radius:50%;background:#050051;width:5em;height:5em;line-height:5em;color:#fff;font-size:.95em;font-weight:500;text-align:center}


.btn-linkArea{position:absolute;top:2em;right:0;z-index:20;}
.btn-linkArea > ul{display:none;position:absolute;left:0;right:0;bottom:3.3em;padding-top:.5em;border-bottom:1px solid rgba(255,255,255,.2);border-top-left-radius:25px;border-top-right-radius:25px;background:rgba(5, 0, 82, 0.8)}
.btn-linkArea > ul a{display:block;padding:0 2em;font-size:0.938em;color:#fff;line-height:3;box-sizing:border-box}
.btn-linkArea > ul a:hover,
.btn-linkArea > ul a:focus{font-weight:500}
.btn-linkArea.on > .btn-familySite{border-color:transparent;border-top-left-radius:0;border-top-right-radius:0;background:rgba(5, 0, 82, 0.8);transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s}

.btn-familySite{display:block;border-color:#fff;padding:1.2em 6em 1.2em 2em;background:rgba(97,170,49,0);font-size:0.938em;font-weight:400;color:#fff;box-sizing:border-box;transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s}
.btn-familySite .ico-more{position:absolute;right:2em;top:50%;display:inline-block;width:15px;height:15px;margin-top:-7.5px;background:url(/images/client/icon/ico-common.png) no-repeat 2px 3px;background-size:8.3em}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background:#050051}






.sub-container{padding:6em 0 8em;}
.sub-container h1{position:relative;padding-bottom:2em;color:#333;font-size:1.8em;font-weight:700;text-align:center;letter-spacing:-.5px;}
.sub-container h1:after{position:absolute;top:55px;left:50%;content:"";width:45px;height:2px;margin-left:-22.5px;background:#050051;}
.sub-container.privacy h1{text-align:left;margin-bottom:1em;padding-bottom:1em;border-bottom:1px solid #333;}
.sub-container.privacy h1:after{display:none;}
.sub-container.privacy strong{display:block;margin:1.5em 0 .3em;color:#333;font-size:1.1em;letter-spacing:-.3px;word-break:keep-all;}
.sub-container.privacy p{color:#999;font-weight:300;line-height:1.8;letter-spacing:-.3px;word-break:keep-all;}
.sub-container.privacy p span{color:#333;}

/* works */

.works-header{position:fixed;top:0;left:20vw;right:15vw;z-index:9999;text-align:center;
  -webkit-transition-duration:.5s;
  -webkit-transition-timing-function:ease;
  transition-duration:.5s;
  transition-timing-function:ease;}

.works-header .pcVer{display:block;}
.works-header .mobileVer{display:none;}

.works-header{padding:3.8em 0 0;}
.works-header ul.pcVer{text-align:center;}
.works-header ul.pcVer li{display:inline-block;padding:0 1em}
.works-header ul.pcVer li a{display:block;min-width:9.5em;text-align:center;border-radius:30px;border:1px solid #fff;color:#fff;font-size:1em;font-weight:400;line-height:3em}
.works-header ul.pcVer li a:hover{border:1px solid #050051;color:#050051;transition:.5s}
.works-header ul.pcVer li a.on{border:none;background:#050051;font-weight:600;}

.works-header.white{padding:1.3em 0;}
.works-header.white ul.pcVer li a{border:1px solid #888;color:#888;}
.works-header.white ul.pcVer li a:hover{border:1px solid #050051;color:#050051;transition:.5s}
.works-header ul.pcVer li a.on{border:1px solid #050051;color:#fff;}

.works-header.scroll{top:-6em;opacity:0;}

.work-section{overflow:hidden;height:100vh;}

.section-left, .section-right{width:50%;float:left;}
.section-inner{position:relative;overflow:hidden;}
.section-inner .infoTxt{position:absolute;left:2.5em;bottom:2.2em;color:#fff;z-index:1}
.section-inner .infoTxt p{font-size:1em;font-weight:300;}
.section-inner .infoTxt strong{font-size:1.25em;font-weight:500;letter-spacing:-.3px;}

.work-section .section-left{height:100%}
.work-section .section-left .section-inner{height:100%}

.work-section .section-right{height:100%;}
.work-section .section-right .section-inner{height:50%;}
.work-section.type1 .section-left {width:100%;height:100%;}
.work-section.type4 .section-right .section-inner:not(:first-child){width:50%;float:left;}
.work-section.type2 .section-right .section-inner{height:100%;}

.work-section img.pc-img{display:block;}

.worksBg{position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;transition:1s;background-size:cover;background-position:50%;background-repeat:no-repeat}
.worksBg:hover{transform:scale(1.05);}
.hicare{background:url(/images/client/works/mando-hiCare-pc.jpg)50% 50% no-repeat;background-size:cover;}
.kyochon{background:url(/images/client/works/kyochon-pc.jpg)50% 50% no-repeat;background-size:cover;}
.maserati{background:url(/images/client/works/maserati-event-pc.jpg)50% 50% no-repeat;background-size:cover;}
.handsup{background:url(/images/client/works/avivgame-star-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sr{background:url(/images/client/works/sr-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brMall{background:url(/images/client/works/br-mall-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brSmartWork{background:url(/images/client/works/br-smartwork-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brSangjo{background:url(/images/client/works/br-sangjo-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brGroup{background:url(/images/client/works/br-group-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brCarnegie{background:url(/images/client/works/br-carnegie-pc.jpg)50% 50% no-repeat;background-size:cover;}
.brFuneral{background:url(/images/client/works/br-funeral-pc.jpg)50% 50% no-repeat;background-size:cover;}
.cap{background:url(/images/client/works/cap-pc.jpg)50% 50% no-repeat;background-size:cover;}
.mcmCharm{background:url(/images/client/works/mcm-charm-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2019{background:url(/images/client/works/scpc2019-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sstf2018{background:url(/images/client/works/sstf2018-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2018{background:url(/images/client/works/scpc2018-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sstf2019{background:url(/images/client/works/sstf2019-pc.jpg)50% 50% no-repeat;background-size:cover;}
.saic2018{background:url(/images/client/works/saic2018-pc.jpg)50% 50% no-repeat;background-size:cover;}
.saif2018{background:url(/images/client/works/saif2018-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2017{background:url(/images/client/works/scpc2017-pc.jpg)50% 50% no-repeat;background-size:cover;}
.mindBridge{background:url(/images/client/works/mind-bridge-pc.jpg)50% 50% no-repeat;background-size:cover;}
.avivApp{background:url(/images/client/works/aviv-app-pc.jpg)50% 50% no-repeat;background-size:cover;}
.codeGround{background:url(/images/client/works/codeground-pc.jpg)50% 50% no-repeat;background-size:cover;}
.mcm{background:url(/images/client/works/mcm-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpcFace{background:url(/images/client/works/scpc-facebook-pc.jpg)50% 50% no-repeat;background-size:cover;}
.tomntoms{background:url(/images/client/works/tomntoms-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2016{background:url(/images/client/works/scpc2016-pc.jpg)50% 50% no-repeat;background-size:cover;}
.swMembership{background:url(/images/client/works/membership-pc.jpg)50% 50% no-repeat;background-size:cover;}
.pureyou{background:url(/images/client/works/pureyou-pc.jpg)50% 50% no-repeat;background-size:cover;}
.cat{background:url(/images/client/works/cat-pc.jpg)50% 50% no-repeat;background-size:cover;}
.basicHouse{background:url(/images/client/works/basichouse-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sstf2017{background:url(/images/client/works/sstf2017-pc.jpg)50% 50% no-repeat;background-size:cover;}
.bmw{background:url(/images/client/works/bmw-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2018-video{background:url(/images/client/works/scpc2018-video-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sw-video{background:url(/images/client/works/sw-video-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sstf2017-video{background:url(/images/client/works/sstf2017-video-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2017-video{background:url(/images/client/works/scpc2017-video-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2017-video2{background:url(/images/client/works/scpc2017-video2-pc.jpg)50% 50% no-repeat;background-size:cover;}
.scpc2016-video{background:url(/images/client/works/scpc2016-video-pc.jpg)50% 50% no-repeat;background-size:cover;}
.sstf2018-video{background:url(/images/client/works/sstf2018-video-pc.jpg)50% 50% no-repeat;background-size:cover;}

.videopopup{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;padding:0 15px;background:rgba(0, 0, 0, 0.5);}
.videopopup .popup-box{position:relative;max-width:898px;margin:10% auto;background:#fff;box-shadow:0 0 10px rgba(0, 0, 0, 0.5);}
.video-wrap{position:relative;padding-bottom:56.25%;padding-top:25px;height:0;}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;}
.videopopup .popup-close{position:absolute;top:-40px;right:0;width:30px;height:30px;background:#fff;border-radius:5px;color:#000;font-weight:bold;}


/* works 상세 */
.portfolio-visual{width: 100%;height: 100%;background:url(/images/client/works/visual/mando-visual.png)50%/cover no-repeat;}

.portfolio-info{overflow:hidden;margin:-8.1em 8em 0;padding:4em 7em 5em;background:#fff;}

.pj-titsmall{display:inline-block;max-width:460px;margin-bottom:.5em;color:#95989a;font-size:.6em;font-weight:400;}
.pj-title{float:left;display:inline-block;width:50%;margin-bottom:.7em;max-width:460px;font-size:1.6em;font-weight:600;color:#333;line-height:1.4;letter-spacing:-.3px;}
.pj-txt{float:left;width:calc(50% - 1em);max-width:500px;padding-right:1em;color:#95989a;font-size:1.125em;letter-spacing:-.3px;word-break:keep-all;}

.portfolio-info .info-right{width:calc(50% - 2px - 7em);}
.info-right{float:right;border-left:1px solid #d7d7d7;padding-left:7em;}
.info-right dl{line-height:3em;}
.info-right dl dt,.info-right dl dd{display:inline-block;font-size:1.1em;letter-spacing:-.3px;}
.info-right dl dt{margin-right:1em;color:#95989a;}
.info-right dl dd{color:#000}

.portfolio-contents img{width:100%;}
.contents-img-pc{display:block;}
.contents-img-m{display:none;}


/* about us */
.sub-visual{display:table;width:100%;height:750px;}
.sub-visual.about-us{background:url(/images/client/layout/aboutus_visual.jpg)50%/cover no-repeat;}
.sub-visual.contact{background:url(/images/client/layout/contact_visual.jpg)50%/cover no-repeat;}
.sub-visual.business{background:url(/images/client/layout/business_visual.jpg)50%/cover no-repeat;}
.sub-visual p{display:table-cell;padding-left:4.5em;color:#fff;font-size:3.75em;font-weight:700;line-height:1.3;vertical-align:middle;}

.con-width{max-width:1300px;margin:0 auto;}
.section1:after{content:"";display:block;clear:both;}

.ico-txtWrap{overflow:hidden;margin-top:4em;}
.ico-txtWrap > div{float:left;width:33.3%;text-align:center}
.ico-txtWrap > div i{display:inline-block;width:7.643em;height:7.643em;background-size:23em;background-image:url('/images/client/icon/ico-business.png');background-repeat:no-repeat}
.ico-txtWrap > div i.busi2{background-position:-7.6em 0}
.ico-txtWrap > div i.busi3{background-position:-15.6em 0}
.ico-txtWrap > div strong{display:block;margin:0 auto;font-size:1.286em;font-weight:500}

.img-box{float:left;width:40%;}
.right-txt{float:right;width:calc(60% - 8em);padding:8em 0 0 8em;color:#333}

p{word-break:keep-all;}
p.con-num{margin:0 0 2em -1.7em;color:#333;font-size:1.25em;font-weight:400;}
p.con-title{margin-bottom:1.8em;color:#333;font-size:1.7em;font-weight:700;}
p.con-txt{max-width:570px;color:#333;font-size:1.05em;word-break:keep-all;line-height:1.8}
p.con-cate{margin:2em 0 4em;color:#888;font-size:1.05em;}
p.con-list{color:#333;font-size:1.05em;font-weight:400;line-height:1.8}

.bg-area{margin-top:-11.5em;padding:15em 0 2em;background:rgba(5, 0, 82, 0.03);}
p.area-title{font-size:1.7em;font-weight:700;color:#333;}

ul.service-list{overflow:hidden;padding:2em 0;}
ul.service-list li{float:left;position:relative;width:calc(20% - 6.2em);padding:3em 0 3em 6.2em;color:#333;font-size:1.05em;font-weight:400;}
ul.service-list li:after{position:absolute;top:50%;left:0;display:block;content:"";background:#fff;width:80px;height:80px;margin-top:-40px;border-radius:50px;z-index:20}
ul.service-list li i{position:absolute;top:37px;left:18px;display:block;width:40px;height:40px;z-index:21}
ul.service-list li i.ico-logic{left:18px;background:url(/images/client/icon/ico-logic.png)50%/40px no-repeat;}
ul.service-list li i.ico-c{left:18px;background:url(/images/client/icon/ico-c.png)50%/40px no-repeat;}
ul.service-list li i.ico-cplus{left:20px;background:url(/images/client/icon/ico-cplus.png)50%/40px no-repeat;}
ul.service-list li i.ico-java{width:45px;height:52px;top:27px;left:17px;background:url(/images/client/icon/ico-java.png)50%/27px no-repeat;}
ul.service-list li i.ico-android{left:20px;background:url(/images/client/icon/ico-android.png)50%/38px no-repeat;}
ul.service-list li i.ico-objectc{left:20px;background:url(/images/client/icon/ico-objectc.png)50%/30px no-repeat;}
ul.service-list li i.ico-csharp{left:18px;background:url(/images/client/icon/ico-csharp.png)50%/40px no-repeat;}
ul.service-list li i.ico-jsp{left:23px;background:url(/images/client/icon/ico-jsp.png)50%/35px no-repeat;}
ul.service-list li i.ico-php{left:20px;background:url(/images/client/icon/ico-php.png)50%/31px no-repeat;}
ul.service-list li i.ico-swift{left:19px;background:url(/images/client/icon/ico-swift.png)50%/37px no-repeat;}

.how-it-works{padding-top:5em;word-break:keep-all}
.logo-wrap{max-width:14.286em;margin-bottom:3em}
.txt-subs{padding-top:2em;font-size:1.05em;line-height:1.7}
.txt-subs span{display:block}
.img-align{overflow:hidden;margin-top:3em}
.img-align .fL{width:50%}
.img-align .fL:nth-child(odd){text-align:left}
.img-align .fL:nth-child(even){text-align:right}
.img-align .fL strong{display:block;margin:2em 0 4em;font-size:1.286em;font-weight:600;text-align:center}

ul.workProcess-list{overflow:hidden;padding:1.5em 17px 1.5em 0;}
ul.workProcess-list li{position:relative;float:left;width:calc(25% - 1px);margin:2em 0;border-right:1px solid #dbdbdb;text-align:center;}
ul.workProcess-list li.bd-left{width:calc(25% - 4px);border-left:1px solid #dbdbdb}

/* ul.workProcess-list li{position:relative;float:left;width:calc(25% - 1px);margin:2em 0;border-left:1px solid #dbdbdb;text-align:center;}
 * ul.workProcess-list li.bd-right{width:calc(25% - 2px);border-right:1px solid #dbdbdb} */

ul.workProcess-list li i{display:block;width:50px;height:50px;margin:0 auto;}
ul.workProcess-list li i.step1{background:url(/images/client/icon/ico-workStep1.png)50%/50px no-repeat;}
ul.workProcess-list li i.step2{background:url(/images/client/icon/ico-workStep2.png)50%/50px no-repeat;}
ul.workProcess-list li i.step3{background:url(/images/client/icon/ico-workStep3.png)50%/50px no-repeat;}
ul.workProcess-list li i.step4{background:url(/images/client/icon/ico-workStep4.png)50%/50px no-repeat;}
ul.workProcess-list li i.step5{background:url(/images/client/icon/ico-workStep5.png)50%/50px no-repeat;}
ul.workProcess-list li i.step6{background:url(/images/client/icon/ico-workStep6.png)50%/50px no-repeat;}
ul.workProcess-list li i.step7{background:url(/images/client/icon/ico-workStep7.png)50%/50px no-repeat;}
ul.workProcess-list li i.step8{background:url(/images/client/icon/ico-workStep8.png)50%/50px no-repeat;}

ul.workProcess-list li strong{display:block;font-size:1.1em;font-weight:500;margin:0.6em 0 0.3em;color:#333;line-height:1.5;}
ul.workProcess-list li strong span{color:#050051;}
ul.workProcess-list li strong p{font-size:1em;color:#333;line-height:1.4}
ul.workProcess-list li.fR-list{float:right;}
ul.workProcess-list li:after{position:absolute;top:50%;right:0;display:block;content:"";width:35px;height:35px;margin:-17.5px -17.5px 0 0;background:url(/images/client/icon/ico-processArrow.png)50%/35px no-repeat;z-index:25}
ul.workProcess-list li.fR-list:after{transform:rotate(180deg);}
ul.workProcess-list li.arrowBt:after{transform:rotate(90deg);}

#text-roller{position:relative;overflow:hidden;white-space:nowrap;height:200px;padding:2em 0 7em}
.rolling-txts{font-size:10.6em;color:#f3f3f3;font-weight:600;white-space:nowrap;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}

.section1{height:576px;}
.section1.height-auto{height:auto;padding-bottom:10vw}
.section1 .img-box{margin-top:-8em;}

.section2{overflow:hidden;}
.section2 .con-num{margin:0 0 2em 0;}
.section2 .con-wrap{overflow:hidden;padding-left:2em;}
.section2 .con-inner{width:50%;float:left;}
.section2 .con-list{float:right;width:calc(50% - 3em);padding-left:3em;}
.section2 .img-wrap{position:relative;margin-top:5em;}
.section2 .left-img{width:50%;text-align:right;}
/* .section2 .left-img img{text-align:} */
.section2 .right-img{position:absolute;bottom:0;right:0;width:calc(50% - 4em);}

.section3{overflow:hidden;margin-top:10em;}
.section3 .right-txt{padding:7em 0 0 8em}

.section4{overflow:hidden;margin:6em auto;}
.section4 .img-box{float:right;}
.section4 .right-txt{float:left;padding:5em 0 0 2.1em;}

.client-area{padding:5em 0 1em;background:rgba(5, 0, 82, 0.03);}
.client-list{overflow:hidden;padding:1em 0;}
.client-list li{float:left;width:calc(100% / 8);padding:2em 0;}
.client-list li img{width:95%;margin:0 auto}

.section4-con.bg-gray{padding:8vh 0;background:#f7f7f9;box-sizing:border-box}
.section4-con{position:relative;z-index:10;background: #f7f7f9;}
.section4-con .txt-subs{margin-top:2em;padding:0 1em;font-size:1em;font-weight:400;color:#333;line-height:1.5;text-align:center;box-sizing:border-box}
.section4-con .txt-subs span{display:block;word-break:keep-all}
.section4-con .tab-sliderWrap{margin-top:2em;}
.section4-con .tab-sliderWrap::-webkit-scrollbar{display:none;}
.section4-con form{max-width:1300px;width:100%;margin:2em auto 0;text-align:center;box-sizing:border-box}
.section4-con .inq-tr{display:table;width:100%;margin-top:1em}
.section4-con .inq-tr:first-child{margin-top:0}
.section4-con .inq-tr input,
.section4-con textarea{width:100%;color:#999;border:1px solid transparent}

.section4-con .inq-tr input:focus,
.section4-con textarea:focus{border-color:#050051;color:#050051}

.section4-con .inq-tr input:focus::-webkit-input-placeholder{color:#050051}
.section4-con .inq-tr input:focus:-moz-placeholder{color:#050051}
.section4-con .inq-tr input:focus::-moz-placeholder{color:#050051}
.section4-con .inq-tr input:focus:-ms-input-placeholder{color:#050051}
.section4-con .inq-tr textarea:focus::-webkit-input-placeholder{color:#050051}
.section4-con .inq-tr textarea:focus:-moz-placeholder{color:#050051}
.section4-con .inq-tr textarea:focus::-moz-placeholder{color:#050051}
.section4-con .inq-tr textarea:focus:-ms-input-placeholder{color:#050051}


.section4-con .inq-tr > div:nth-child(odd){padding-right:.5em}
.section4-con .inq-tr > div:nth-child(even){padding-left:.5em}
.section4-con .inq-tr > div{display:table-cell;width:50%;box-sizing:border-box}
.section4-con .agree-area{padding:1.5em 0;text-align:center}
.section4-con .agree-area .btn-radius{margin-left:1em}
.section4-con .agree-area .btn-boxContrl.on{color:#050051 !important;border-color:#050051}

.box-scroll{overflow-y:auto;height:16em;padding:1em .1em 1em 1.5em;background:#fff;text-align:left}
.box-scroll em{display:inline-block;position:relative;margin-top:2em;padding-left:.8em;font-size:1em;font-weight:500;color:#333}
.box-scroll em:after{position:absolute;top:50%;left:2px;content:"";display:block;width:4px;height:4px;margin-top:-1px;background:#050051}
.box-scroll em:first-child{margin-top:0}
.box-scroll p{margin-top:1em;font-size:13px;font-weight:400;color:#7c7c7c;line-height:1.5}

.tab-sliderWrap{position:relative;z-index:30;overflow-x:auto;overflow-y:hidden;white-space:nowrap}
.tab-slider{width:100%;padding-bottom:.3em;text-align:center}
.tab-slider > li{display:inline-block;margin-left:1em;padding-bottom:.1em;line-height:1.1}
.tab-slider > li:first-child{margin-left:0}
.tab-slider > li a{display:block;width:9.375em;height:3.1em;border:1px solid #888;border-radius:25px;font-size:1em;font-weight:500;color:#888;line-height:3.1em}
.tab-slider > li.on a{border-color:#050051;color:#050051;font-weight:500}

.tab-slider > li a:hover{border-color:#050051;color:#050051}

.scroll-info{display:none;}

textarea{width:100%;resize:none;box-sizing:border-box}
textarea,input{padding:1.3em 1em;border:none}

.tab-slider.tab-select > li.on a{background:#050051;color:#fff}
.mCSB_horizontal.mCSB_inside > .mCSB_container{padding-bottom:0px;margin-bottom:15px}

/* 영상추가 */
.video-container{width:100%;max-width:1280px;margin:0 auto}
.video-wrap{position:relative;width:100%;height:0;margin:0 auto;padding-bottom:56.5%;}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;margin:0 auto;height: 100%;}

#verticalNav ul li a span{font-weight:400;}