@charset "utf-8";

/* Common */
body,div,dl,dt,dd,ul,ol,li,p,th,td,input,select,textarea,button{font-size:13px}
h1{}
h2{padding-bottom:7px;font-size:18px;color:#3444ac;font-weight:400}

/* Layout */
#container{margin-left:0;margin-right:0}
.section{float:left;width:50%}
.pSec{padding:4px}
.wSec{position:relative;width:100%;height:0;padding-bottom:75%;overflow:hidden;background:url(../../images/common/bg_sec.gif);}
.sec{position:absolute;top:0;left:0;right:0;bottom:0;border-width:1px;border-style:solid;border-color:#fff #ccd0d4 #ccd0d4 #fff}
.visual .sec,.vaimedia .sec,.service .sec,.customer .sec{border:0}

.visual .sec{background:url(../../images/main/bg_vis.jpg) 50% 50%}
.visual{width:100%}
.visual .wSec{padding-bottom:35%;}
.bxslider{overflow:hidden}
.bxslider li{position:relative;text-align:center}
.bxslider li img{max-width:100%;display:block;margin:-10px auto 0}

.bx-wrapper .bx-loading{position:absolute;top:0;left:0;width:100%;height:100%;min-height:50px;background: url(../../images/main/bx_loader.gif) 50% 50% no-repeat; z-index:2000;}
.bx-wrapper .bx-controls{position:absolute;top:50%;right:2%;margin-top:-68px;}
.bx-pager-item a{display:block;width:24px;height:24px;padding:5px;background:url(../../images/main/btn_vis.png) 5px 5px no-repeat;color:#fff;text-align:center;font-family:Roboto,"나눔고딕",Gulim,Sans-serif;font-size:13px;font-weight:500;line-height:24px;}
.bx-pager-item a.active,.bx-pager-item a.active:hover{background:url(../../images/main/btn_vis.png) 5px -35px no-repeat;color:#fff}
.bx-pager-item a:hover{color:#ffd778}
.bx-controls-auto-item a{display:block;width:24px;height:24px;padding:5px;background:url(../../images/main/btn_vis.png) 5px -75px no-repeat;text-indent: -9999px;}
.bx-controls-auto-item a.bx-start{background-position:5px -115px;}
.bx-controls-auto-item a.bx-stop{background-position:5px -75px;}
.vaimedia .wSec{padding-bottom:70%}
.vaimedia .sec{background:url(../../images/main/bg_vai.gif);color:#fff;text-align:center;}
.vaimedia .rebrand{display:block; padding-top:8%;color:#ffc2e4;text-transform:uppercase;font-family:Roboto,"나눔고딕",Gulim,Sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;}
.vaimedia img{max-width:25%;padding:5% 0 5%}
.vaimedia strong{display:block;font-size:12px;font-weight:400;line-height:1.2}
.vaimedia strong span{display:block;}

.vaimedia.new_2026 .sec .cont_box{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%;}
.vaimedia.new_2026 .sec .symbol{margin:5% 0;}
.vaimedia.new_2026 .sec .symbol img{height:40px; padding:0;  max-width:inherit;}
.vaimedia.new_2026 .sec .t02{font-size:14px; font-weight:600;}
.vaimedia.new_2026 .sec .t03{display:none;}


.service .wSec{padding-bottom:70%}
.service .sec{background:#00afd2;color:#fff;text-align:center}
.service .responsive{background:url(../../images/main/tab_service.png) 50% 0 no-repeat;overflow:hidden;}
.service .accessibility{background:url(../../images/main/tab_service.png) 50% 100% no-repeat;overflow:hidden;}
.service h2{position:relative;float:left;width:50%;height:30px;margin:0;padding:0;line-height:32px;color:#fff;font-size:12px;font-weight:700;}
.service a{display:block;color:#fff}
.service .cont{position:absolute;top:32px;left:0;right:0;}
.service .cont a{display:block;}
.service img{max-width:60%;padding:5% 0 6%}
.service p{font-size:10px;font-weight:400}
.slogan img{position:absolute;top:50%;left:50%;margin:-40px 0 0 -100px}
.notice{width:100%}
.notice h2{position:absolute;top:16px;left:7%;font-size:14px;font-weight:700}
.notice .cont{margin-top:44px;padding:0 7%;}
.notice .cont a{color:#514e50;line-height:1.4; font-family: "Nanum Gothic", Sans-serif !important;}
.notice .cont a:hover{color:#fb64a1}
.notice .cont strong{margin-bottom:10px;font-size:13px;font-weight:400}
.notice .cont a > strong{font-size:17px; font-weight:600; display:block;}
.notice .cont .date{display:block;font-family:Roboto,"나눔고딕",Gulim,Sans-serif;color:#9b9498}
.notice #nt_slideshow{float:left;position:relative;top:44px;left:40%;width:64%;height:57px;margin:0 0 0 -80px;overflow:hidden; margin-top:0; padding:0;}
.notice #nt_slideshow ul{position:absolute;list-style:none;top:0;left:0}
.notice #nt_slideshow li{float:left;width:220px;height:120px}
.portfolio{width:100%}
.portfolio .wSec{padding-bottom:50%}
.portfolio h2{position:absolute;top:16px;left:7%;font-size:14px;font-weight:700}
.portfolio #slideshow{float:left;position:relative;top:28px;left:50%;width:160px;height:120px;margin:0 0 0 -80px;overflow:auto}
.portfolio #slideshow ul{position:absolute;list-style:none;top:0;left:0}
.portfolio #slideshow li{float:left;width:160px;height:120px}
.btns{position:absolute;top:0;right:0}
.btns a{float:left;display:block;width:30px;height:30px;border-left:1px solid #eee;border-bottom:1px solid #e6e6e6;background-color:#fff}
.btns .prev{background-position:-99px 0;}
.btns .next{background-position:-129px 0;}
.btns .more{background-position:-159px 0;}
.btns span{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;visibility:hidden;font-size:1;line-height:1;z-index:-1}

.tel{width:100%}
.tel .wSec{/*common.js*/}
.tel ul{position:absolute;top:50%;left:50%;margin:-50px 0 0 -85px;width:180px;height:110px}
.tel,.tel a{color:#716b6f;font-family:Roboto,"나눔고딕",Gulim,Sans-serif;letter-spacing:1px}
.tel ul li{position:relative;padding-left:25px;height:24px;line-height:24px;text-align:left}
.tel ul li.mainTel{height:40px;padding:0;text-align:center;}
.tel ul li strong{font-size:24px;font-weight:500;letter-spacing:2px}
.tel ul li span{position:absolute;top:5px;left:0;width:16px;height:16px;}
.tel .bgLine{position:absolute;top:-1px;left:-1px;right:-1px;height:8px;background-position:0 -210px;background-repeat:repeat-x}
.customer .wSec{background:transparent;}
.customer .sec > div{position:absolute;left:0;right:0;background:url(../../images/common/bg_sec.gif);border-width:1px;border-style:solid;border-color:#fff #ccd0d4 #ccd0d4 #fff;}
.estimate{top:0;}
.vaisian{bottom:0;}
.customer a{display:block;position:absolute;top:0;left:0;right:0;bottom:0;}
.recruit .sec{text-align:center}
.recruit a{display:block;width:100%;height:100%;color:#514e50}
.recruit img{padding:2% 0 4%}
.recruit p{display:none}
.vcs .sec{text-align:center}
.vcs a{display:block;width:100%;height:100%;}
.vcs img{padding:4% 0 6%}
.vcs p{display:none;color:#9b9699;font-size:10px;text-transform:uppercase;font-weight:500;font-family:Roboto,"나눔고딕",Gulim,Sans-serif;letter-spacing:2px}
.recruit .wSec,.vcs .wSec{height:86px;padding-bottom:0}
.customer h2,.recruit h2,.vcs h2{margin-top:52px;font-size:13px;font-weight:600;text-align:center}
.customer .mainImg,.recruit .mainImg,.vcs .mainImg{position:absolute;top:14px;left:50%;margin:0 0 0 -16px;width:32px;height:32px;}
.estimate .mainImg{background-position:0 -36px;}
.vaisian .mainImg{background-position:-38px -36px;}
.recruit .mainImg{background-position:-76px -36px;}
.vcs .mainImg{margin:0 0 0 -36px;width:72px;background-position:-114px -36px;}

@media all and (max-width:760px) {
.notice{clear:both}
.slogan{display:none}
.bx-wrapper .bx-controls{display:none}
.notice .wSec{height:120px;padding-bottom:0}
.portfolio .wSec{height:160px;padding-bottom:0}
.portfolio img{top:35px;margin-top:0}
}

@media all and (min-width:480px) {
.vaimedia .rebrand{display:block;padding-top:6%;}
.vaimedia img{padding:5% 0 7%}
.vaimedia strong{font-size:14px;font-weight:400;line-height:1.4}
.vaimedia strong span{display:inline;}
.service h2{height:40px;line-height:40px;font-size:14px;}
.service .cont{top:25%}
.service img{padding:8% 0 6%}
.service p{font-size:12px;font-weight:700}
.notice h2{top:20px;font-size:16px}
.notice .cont{margin-top:50px;}
}

@media all and (min-width:760px) {
.vaimedia strong{font-size:16px;line-height:1.4}
.service h2{font-size:16px;}
.service p{font-size:14px}
.notice h2{top:12%;left:10%;font-size:18px;font-weight:400}
.notice .cont{margin-top:27%;padding:0 10%;}
.notice .cont a{line-height:1.7}
.notice .cont .date{margin-top:10px}
.btns{position:absolute;top:12%;right:10%;height:28px;}
.btns a{float:left;display:block;height:28px;border:0}
.btns .prev{width:28px;background-position:0 0;}
.btns .next{width:28px;margin-left:1px;background-position:-29px 0;}
.btns .more{width:30px;margin-left:4px;background-position:-63px 0;}
.portfolio h2{top:12%;left:10%;font-size:18px;font-weight:400}
.tel ul{position:absolute;top:50%;left:50%;margin:-55px 0 0 -85px;width:180px;height:110px}
.recruit .wSec,.vcs .wSec{height:0;padding-bottom:60%}
.recruit p,.vcs p{display:block}
.customer h2,.recruit h2,.vcs h2{font-size:18px;font-weight:400}
.customer .mainImg{top:13%}
.customer h2{margin-top:22%}
.recruit h2{margin-top:7%}
.recruit .mainImg{width:120px;height:76px;margin:13% 0 0 -60px;background-position:0 -124px;}
.recruit p{margin-top:35%;font-size:11px;line-height:1.4}
.vcs h2{margin-top:12%}
.vcs .mainImg{width:160px;height:44px;margin:22% 0 0 -80px;background-position:0 -74px;}
.vcs p{margin-top:28%;font-size:9px}


.notice #nt_slideshow{float:left;position:relative;top:80px;left:40%;width:220px;height:102px;margin:0 0 0 -80px;overflow:auto}

.portfolio #slideshow{float:left;position:relative;top:55px;left:50%;width:160px;height:120px;margin:0 0 0 -80px;overflow:auto}
}

@media all and (min-width:760px) and (max-width:1200px) {
.section{width:33.3333333%;}
.pSec{padding:6px;}
.vaimedia .wSec,.service .wSec,.slogan .wSec,.notice .wSec,.portfolio .wSec,.recruit .wSec,.vcs .wSec{padding-bottom:75%;}
.vaimedia,.notice,.customer{clear:both}
.visual{width:100%}
.visual .wSec{padding-bottom:35%;}
.tel .wSec,.customer .wSec{padding-bottom:0}

}

@media all and (min-width:760px) and (max-width:1200px) and (orientation:portrait) {
.vaimedia .wSec,.service .wSec,.slogan .wSec,.notice .wSec,.portfolio .wSec,.recruit .wSec,.vcs .wSec{padding-bottom:75%;}
.notice h2,.portfolio h2,.recruit h2,.vcs h2{font-size:16px}
.customer h2{font-size:15px}
}

@media all and (min-width:760px) and (max-width:1200px) and (orientation:landscape) {
.vaimedia .wSec,.service .wSec,.slogan .wSec,.notice .wSec,.portfolio .wSec,.recruit .wSec,.vcs .wSec{padding-bottom:60%;}
.vaimedia .rebrand{display:none}
.vaimedia img{padding:10% 0 6%}

.vaimedia.new_2026 .sec{position:relative; height:100%; padding-top:5%; box-sizing:border-box;}
.vaimedia.new_2026 .wSec{position:relative;}
.vaimedia.new_2026 .sec{position:absolute;}
.vaimedia.new_2026 .sec .symbol{margin:4% 0;}
.vaimedia.new_2026 .sec .symbol img{height:50px; padding:0;}
.vaimedia.new_2026 .sec .t02{font-size:18px; font-weight:600; margin-bottom:5px;}
.vaimedia.new_2026 .sec .t03{display:block;}

.service .cont{top:20%}
.portfolio img{margin-top:-10%}
.portfolio #slideshow{top:70px;}

.customer h2{margin-top:17%;font-size:15px}
.customer .mainImg{top:15%}
.recruit h2{margin-top:5%;font-size:18px}
.recruit .mainImg{margin-top:11%}
.recruit p{margin-top:28%;}
.vcs h2{margin-top:9%}
.vcs .mainImg{margin-top:18%}
.vcs p{margin-top:23%;font-size:10px}
}

@media all and (min-width:1200px) {
.section{width:25%;}
.pSec{padding:7px;}
.vaimedia .wSec,.service .wSec,.slogan .wSec,.notice .wSec,.portfolio .wSec,.recruit .wSec,.vcs .wSec{padding-bottom:75%;}
.service,.tel{clear:both}
.visual{width:75%}
.visual .wSec{padding-bottom:35%;}
.vaimedia .wSec,.tel .wSec,.customer .wSec{padding-bottom:0}
.vaimedia .rebrand{padding-top:19%; font-size:17px;}
.vaimedia img{max-width:100%;padding:7% 0;}
.vaimedia strong{font-size:24px;line-height:1.4}
.vaimedia strong span{display:block;}

.vaimedia.new_2026 .sec{position:relative; height:100%; padding-top:17%; box-sizing:border-box;}
.vaimedia.new_2026 .sec .cont_box{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%;}
.vaimedia.new_2026 .sec .symbol{margin:7% 0 8%;}
.vaimedia.new_2026 .sec .symbol img{height:90px; padding:0;}
.vaimedia.new_2026 .sec .t01{font-size:16px; font-weight:600;}
.vaimedia.new_2026 .sec .t02{font-size:22px; font-weight:600; margin:5px 0;}
.vaimedia.new_2026 .sec .t03{display:block; font-size:14px;}

.service h2{height:50px;line-height:50px;font-size:18px;}
.service .cont{top:25%}
.service img{max-width:100%;padding:8% 0 6%}
.notice .cont strong{display:block;}
.portfolio img{margin-top:-12%}
.portfolio #slideshow{float:left;position:relative;top:90px;left:50%;width:160px;height:120px;margin:0 0 0 -80px;overflow:auto}
.tel ul li strong{font-size:30px;font-weight:400;}
.customer h2{margin-top:20%;font-size:17px}
.customer .mainImg{top:20%}
.recruit h2{margin-top:10%;}
.recruit .mainImg{margin-top:18%}
.recruit p{margin-top:30%;font-size:12px;line-height:1.5}
.vcs h2{margin-top:15%}
.vcs .mainImg{margin-top:25%}
.vcs p{margin-top:24%}
}