@charset "utf-8";

/* VCS */
#vcs, #vcs input,#vcs textarea,#vcs button,#vcs select,#vcs table{font-family:"굴림",Gulim,Sans-serif;font-size:12px}
#vcs .eng{font-family:Verdana,"굴림",Gulim,Sans-serif;}
.vcsImg{display:inline-block;background-image:url(../../images/sub/img_vcs_320.png);-webkit-background-size:166px 560px;background-size:166px 560px;font-size:0;line-height:0;overflow:hidden;text-indent:-9999px;vertical-align:top}
.logImg{display:inline-block;background-image:url(../../images/sub/img_login_320.png);-webkit-background-size:240px 294px;background-size:240px 294px;vertical-align:top}
@media only screen and (-webkit-min-device-pixel-ratio:1.5){
.vcsImg{background-image:url(../../images/sub/img_vcs_320.png)}
.logImg{background-image:url(../../images/sub/img_login_640.png)}
}
@media only screen and (-webkit-min-device-pixel-ratio:2){
.vcsImg{background-image:url(../../images/sub/img_vcs_320.png)}
.logImg{background-image:url(../../images/sub/img_login_640.png)}
}

/* Common */
#vcs select{height:24px;padding:3px;border:1px solid #ccc}
#vcs input[type=text]{height:22px;padding:0 3px;border-width:1px;border-style:solid;border-color:#abadb3 #dedfe3 #dedfe3 #abadb3;background:#f9f9f9}

@media only screen and (-webkit-min-device-pixel-ratio:1.5){
#vcs,#vcs p,#vcs div, #vcs input,#vcs textarea,#vcs button,#vcs select,#vcs table{font-size:14px;line-height:24px;}
}

/* VCS Login */
.vcsLogin{width:100%;margin:3px auto 0;background:#fff;}
.loginBox{border:1px solid #666;}
.loginBox h2{position:relative;height:60px;background:url(../../images/sub/bg_login_top.png);overflow:hidden}
.loginBox h2 span{position:absolute;left:50%;font-size:0;line-height:0;overflow:hidden;text-indent:-9999px;}
.loginBox h2 .icon{bottom:-15px;width:92px;height:72px;margin-left:-190px;background-position:0 100%;}
.loginBox h2 .tit{top:50%;width:172px;height:36px;margin:-17px 0 0 -86px;background-position:0 -50px;}
.loginWrap{margin-top:30px;}
.loginWrap .login,.loginWrap .enquiry{width:270px;margin:0 auto;text-align:center}
.loginWrap .enqBox{margin-top:20px;padding:20px 0;border-top:1px dashed #ccc;background:#f2f2f2;}
#vcs .login .logImg{position:relative;width:240px;height:36px;margin-bottom:10px;}
#vcs .login .id{background-position:0 -92px;}
#vcs .login .pw{background-position:0 -134px;}
#vcs .login .btn{height:40px;background-position:0 -176px;}
#vcs .login input[type=text],#vcs .login input[type=password]{position:absolute;top:2px;left:10px;width:220px;height:32px;border:none;background:transparent;font-size:14px;line-height:32px;font-family:Verdana,"굴림",Gulim,Sans-serif;}
#vcs .login .btn input{position:absolute;top:0;left:0;width:240px;height:40px;font-size:0;line-height:0;overflow:hidden;text-indent:-9999px;}
#vcs .login .saveId{display:block;padding:5px 0;color:#666;text-align:center;}
#vcs .login .saveId input{margin:0 5px 2px 0;}
.enquiry p{line-height:24px;font-size:12px;}
.enquiry ul{width:230px;margin:20px auto 0;}
.enquiry ul li{position:relative;padding-left:25px;height:28px;font-family:Verdana,"굴림",Gulim,Sans-serif;line-height:28px;text-align:left}
.enquiry ul li span{position:absolute;top:7px;left:0;width:16px;height:16px;}
.enquiry ul li strong a{font-weight:normal;color:#d23250}
.enquiry ul li .tel{background-position:-106px -506px;}
.enquiry ul li .fax{background-position:-128px -506px;}
.enquiry ul li .mail{background-position:-150px -506px;}

@media all and (max-width:480px) {
.loginBox h2 .icon{display:none}

}
@media all and (min-width:600px) {
.loginBox h2{height:70px;}
.loginBox h2 .icon{bottom:-10px;}
.loginWrap{margin:60px 0;background:url(../../images/sub/bg_vcs_th_320.png) 50% 50% repeat-y;-webkit-background-size:2px 20px;background-size:2px 20px;overflow:hidden;}
.loginWrap:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.loginWrap .login,.loginWrap .enquiry{width:245px;}
.loginWrap .logBox{float:right;width:50%;}
.loginWrap .enqBox{float:left;width:50%;margin:0;padding:0;border-top:0;background:transparent;}
}
@media all and (min-width:900px) {
.loginBox h2{height:80px;}
.loginBox h2 .icon{bottom:-10px;margin-left:-220px;}
.loginBox h2 .tit{width:224px;height:44px;margin:-20px 0 0 -112px;background-position:0 0;}
.vcsLogin{width:80%;margin:30px auto}
}
@media all and (min-width:1200px) {
.vcsLogin{width:60%;margin:50px auto}
.loginBox h2{height:100px;}
.loginBox h2 .icon{bottom:0;}
}

/* Btns, Status */
.bnWrite{width:160px;height:40px;background-position:0 0;}
.bnRegister{width:132px;height:40px;background-position:0 -46px;}
.bnModify{width:112px;height:40px;background-position:0 -92px;}
.bnDel{width:80px;height:40px;background-position:0 -138px;}
.bnList{width:80px;height:40px;background-position:-86px -138px;}
.bnSModify{width:56px;height:24px;background-position:0 -476px;}
.bnSDel{width:56px;height:24px;background-position:-62px -476px;}
.status .wait{width:68px;height:28px;background-position:0 -344px;}
.status .accept{width:68px;height:28px;background-position:-74px -344px;}
.status .ing{width:68px;height:28px;background-position:0 -378px;}
.status .finish{width:68px;height:28px;background-position:-74px -378px;}
.status .consult{width:68px;height:28px;background-position:0 -413px;}

/* VCS Top */
.vcsTop{border:1px solid #666;overflow:hidden;background:#fff;}
.vcsTop .title{position:relative;height:60px;background:url(../../images/sub/bg_login_top.png);overflow:hidden}
.vcsTop .title h2 span{position:absolute;left:50%;font-size:0;line-height:0;overflow:hidden;text-indent:-9999px;}
.vcsTop .title h2 .icon{display:none;bottom:-15px;width:92px;height:72px;margin-left:-190px;background-position:0 100%;}
.vcsTop .title h2 .tit{top:50%;width:172px;height:36px;margin:-17px 0 0 -86px;background-position:0 -50px;}
.vcsTop .info .loginInfo{padding-bottom:10px;border-bottom:1px dashed #ccc;}
.vcsTop .info .loginInfo .logo{height:32px;margin:10px 0 5px;text-align:center}
.vcsTop .info .loginInfo .login{padding-top:11px;color:#666;font-size:12px !important;line-height:24px;text-align:center}
.vcsTop .info .loginInfo .login span{display:inline-block;margin:3px 5px 0 0;width:12px;height:16px;background-position:-134px -536px;}
.vcsTop .info .loginInfo .login button{display:inline-block;width:68px;height:24px;margin-left:7px;background-position:0 -446px;}
.vcsTop .info .chInfo{text-align:center;}
.vcsTop .info .vaimedia{padding:10px 0;line-height:32px;}
.vcsTop .info .vaimedia label{margin:0 5px 0 3px}
.vcsTop .info .vaimedia input[type=radio]{margin-bottom:3px}
.vcsTop .info .vaimedia .vcsImg{width:76px;height:24px;margin-left:3px;background-position:-74px -446px;vertical-align:middle}
.vcsTop .info .customer{padding:7px 0}
.vcsTop .info .customer .name{display:block;font-size:14px;font-weight:bold;line-height:24px;}
.vcsTop .info .customer .name a{color:#d23250;font-weight:normal}
.vcsTop .info .customer .name a span{display:inline-block;width:16px;height:16px;margin:5px 3px 0 10px;background-position:-90px -536px}
.vcsTop .info .customer .faxMail,.vcsTop .info .customer .faxMail a{font-size:12px;color:#666}
.vcsTop .info .customer .fax,.vcsTop .info .customer .mail{display:block;padding:2px;}

@media all and (max-width:480px) {
.info .loginInfo .logo{display:none}
}
@media all and (min-width:480px) and (max-width:760px) {
.vcsTop .info .loginInfo{overflow:hidden}
.vcsTop .info .loginInfo .logo{float:left;width:47%;margin-bottom:0;padding-left:3%;text-align:left;}
.vcsTop .info .loginInfo .login{float:left;width:47%;padding:13px 3% 0 0;text-align:right;}
.vcsTop .info .loginInfo:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.vcsTop .info .vaimedia{height:24px;padding:10px 0;line-height:24px;}
.vcsTop .info .customer .fax,.vcsTop .info .customer .mail{display:inline;}
}
@media all and (min-width:760px) {
.vcsTop .title h2 .icon{display:block}
.vcsTop .info{padding:10px 0;}
.vcsTop .info .loginInfo{float:right;width:38%;padding-right:5%;border-bottom:0;}
.vcsTop .info .loginInfo .logo{height:32px;margin:0 0 5px 0;text-align:right}
.vcsTop .info .loginInfo .login{padding-top:0;color:#666;line-height:24px;text-align:right}
.vcsTop .info .chInfo{float:left;width:52%;padding-left:5%;text-align:left;}
.vcsTop .info .vaimedia{height:24px;padding-top:20px;line-height:24px;}
.vcsTop .info .customer .name{font-size:16px;line-height:24px;}
.vcsTop .info .customer .fax,.vcsTop .info .customer .mail{display:inline;}
}
@media all and (min-width:1200px) {
.vcsTop{height:100px}
.vcsTop .title{float:left;width:30%;height:100px;}
.vcsTop .title h2{height:100px;background:url(../../images/sub/bg_vcs_top.png) no-repeat 100% 50%;}
.vcsTop .title h2 .icon{bottom:0;margin-left:-165px}
.vcsTop .title h2 .tit{margin-left:-65px}
.vcsTop .info{float:left;width:70%;padding:20px 0}
.vcsTop .info .loginInfo{padding-bottom:0;}
.vcsTop .info .chInfo{float:left;width:57%;padding-left:0;text-align:center}
}

/* VCS List */
.vcsList{background:#fff;}
.listHead{position:relative;width:100%;height:40px;padding:10px 0;overflow:hidden}
.listHead .title{float:left;width:30%;height:24px;padding:8px 0;}
.listHead .search{float:left;width:40%;height:24px;padding:8px 0;text-align:center}
.listHead .btns{float:left;position:relative;width:30%;}
.listHead .btns a{position:absolute;top:0;right:0;}
.listHead h3{display:inline-block;font-size:16px;line-height:26px;}
.listHead h3 span{display:inline-block;width:24px;height:24px;margin-right:3px;background-position:0 -536px;}
.listHead .title select{margin:-4px 0 0 10px}
.listHead .search input[type=text]{width:40%;}
.listHead .search input[type=submit]{display:inline-block;width:68px;height:24px;background-position:-74px -412px;}

.listTable{border-top:1px solid #666;border-bottom:1px solid #666;background:#fff;}
.listTable table{width:100%;border-collapse:separate;border:0;border-spacing:0;}
.listTable caption{width:0;height:0;font-size:0;line-height:0;overflow:hidden;visibility:hidden;z-index:-1}
.listTable th{padding:11px 10px;border:0;border-bottom:2px solid #666;background:url(../../images/sub/bg_vcs_th_320.png) 0 50% no-repeat;-webkit-background-size:2px 20px;background-size:2px 20px;color:#666;font-size:13px;line-height:18px}
.listTable th:first-child{background:none;}
.listTable .trBg{background:#f9f9f9;}
.listTable td{padding:11px 10px;border:0;border-left:1px solid #e7e7e7;line-height:18px;text-align:center}
.listTable td:first-child{border-left:0}
.listTable td.project{color:#415ab4}
.listTable td.num,.listTable td.date{color:#666;font-size:11px;}
.listTable td.title{padding:0;}
.listTable td.title a{display:block;padding:11px 4%;text-align:left;}
.listTable td.title.wait a{color:#d23250;font-weight:bold}
.listTable td.title.accept a{color:#1e2332;font-weight:bold}
.listTable td.title.ing a{color:#1e2332}
.listTable td.title.finish a{color:#666}
.listTable .comNum{padding:0 5px;color:#d23250;font-size:11px;font-weight:normal}
.listTable .file{margin:1px 0 0 5px;display:inline-block;width:16px;height:16px;background-position:-112px -536px;}
.listTable td.status{padding:6px 0}

@media only screen and (-webkit-min-device-pixel-ratio:1.5){
#vcs .listTable .eng{font-family:"굴림",Gulim,Sans-serif;}
.listTable th{background-image:url(../../images/sub/bg_vcs_th_640.png)}
.listTable .trBg{background:#f5f5f5;}
}

@media all and (max-width:700px) {
.listTable colgroup,.listTable thead,.listTable td.num{display:none}
.listTable tr{position:relative;clear:both;display:block;padding:20px 0 22px;border-top:1px dashed #ddd;overflow:hidden}
.listTable tr:first-child{border-top:0}
.listTable td,.listTable td.title a{display:block;padding:0 10px;text-align:left;border:0;}
.listTable td.title a{padding:10px;font-size:15px;line-height:20px}
.listTable td.status{position:absolute;bottom:15px;right:10px;padding:0;}
.listTable td.person,.listTable td.date{float:left;display:inline-block;font-size:11px;line-height:11px;color:#999}
.listTable td.person{font-size:12px;padding-right:5px;border-right:1px solid #ccc;}
.listTable td.date{padding-left:5px;}
}

.listFoot{position:relative;}
.listFoot .paging{width:70%;height:36px;margin:0 auto;padding:25px 0;text-align:center;}
.listFoot .paging button{display:inline-block;width:40px;height:36px}
.listFoot .paging button.first{background-position:0 -226px;}
.listFoot .paging button.prev{margin-right:10px;background-position:-40px -226px;}
.listFoot .paging button.next{margin-left:10px;background-position:-86px -226px;}
.listFoot .paging button.last{background-position:-126px -226px;}
.listFoot .paging a,.listFoot .paging strong{display:inline-block;width:40px;height:36px;text-align:center;line-height:36px;}
.listFoot .paging a:hover,.listFoot .paging strong{background:url(../../images/sub/img_vcs_320.png) no-repeat -106px -184px;}
.listFoot .paging strong{color:#d23250;}
.listFoot .btns{position:absolute;top:23px;right:0;}

/* VCS View */
.vcsView{background:#fff;}
.viewHead{position:relative;width:100%;height:40px;padding:10px 0;background:#fff;overflow:hidden}
.viewHead .title{float:left;width:70%;height:24px;padding:8px 0;}
.viewHead h3{font-size:16px;line-height:26px;}
.viewHead h3 span{width:24px;height:24px;margin-right:3px;background-position:-30px -536px;}
.viewHead .btns{float:left;width:30%;text-align:right}
.viewHead .btns .notice{display:block;padding:12px 0;color:#d23250}
.viewHead .btns select{width:70px;margin-top:8px;}
.viewHead .btns input[type=submit]{width:100px;height:24px;margin-top:8px;background-position:0 -506px;}

.viewInfo{border-top:1px solid #666;border-bottom:1px solid #666;overflow:hidden}
.viewInfo:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.viewInfo dl{float:left;width:50%;border-bottom:1px solid #e7e7e7;overflow:hidden}
.viewInfo dl:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.viewInfo dl dt{float:left;width:20%;padding-left:4%;background:#f9f9f9;color:#666;font-size:13px;font-weight:bold}
.viewInfo dl dd{float:left;width:73%;padding-left:3%}
.viewInfo dt,.viewInfo dd{height:28px;padding:6px 0;line-height:28px;}
.viewInfo .project{color:#415ab4}
.viewInfo .project a{margin:0 3px 0 10px;color:#415ab4}
.viewInfo .project a:hover{text-decoration:underline}
.viewInfo .project .vcsImg{width:12px;height:12px;margin-top:9px;background-position:-152px -536px;}
.viewInfo .date,.viewInfo .tel{color:#666}
.viewInfo .status,.viewInfo .tel{border-bottom:0}
.viewInfo .status .vcsImg{margin-right:8px}
.viewInfo .status .eng{margin-left:5px;color:#666;}
.viewInfo .status .noRead{color:#666}
.viewInfo .tel span{color:#1e2332}

.viewCont .cont{padding:40px 2% 50px}
.viewCont .files{margin:-15px 0 20px;padding-bottom:20px;border-bottom:1px dashed #ccc;color:#5596d7}
.viewCont .files .file{width:16px;height:16px;background-position:-112px -536px;margin-right:8px}
.viewCont .files .eng{margin-left:5px;color:#999;}
.viewCont .files li{height:16px;padding:2px 0;line-height:16px}
.viewCont .files li a{color:#648cb4}
.viewCont .files li a:hover{text-decoration:underline}
.viewCont .vaiLog{margin-top:30px;padding:15px 20px;border:1px dashed #ccc;background:#f9f9f9;color:#666}
.viewCont .vaiLog ul{margin-top:3px;}
.viewCont .read ul{overflow:hidden}
.viewCont .read ul:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.viewCont .read li{float:left}
.viewCont .read .eng{margin:0 20px 0 5px;font-size:11px}
.viewCont .history{margin-top:15px}
.viewCont .history .eng{margin-right:10px;font-size:11px}

.comment .cmtBox{margin-bottom:30px;}
.comment .cmtBox .cmtHead{height:32px;line-height:32px;color:#666}
.comment .cmtBox .cmtHead .tit{width:120px;height:32px;margin-right:10px;background-position:0 -268px;}
.comment .cmtBox .cmtHead strong{padding-right:10px;color:#666;font-size:13px;}
.comment .cmtBox .cmtHead .eng{padding-right:10px;color:#999;font-size:11px}
.comment .cmtBox .cmtHead button{margin-top:3px;}
.comment .cmtBox .cmtCont{border:1px solid #666;padding:20px 2%}
.comment .cmtWrite .cmtHead .tit{background-position:0 -306px;}
.comment .cmtWrite .cmtHead strong{color:#648cb4}
.comment .cmtWrite .cmtHead select{width:60px;margin:-1px 5px 0;}
.comment .cmtWrite .cmtCont{border:1px solid #648cb4;padding:15px 2% 10px}
.comment .cmtWrite .cmtCont textarea{width:100%;height:100px;border:0;}
.comment .cmtWrite .cmtCont input[type=submit]{display:block;width:100px;height:36px;margin:0 auto;background-position:0 -184px;}
.comment .notice{color:#d23250}

.viewFoot .btns{padding:25px 0;text-align:center}

/* VCS Write */
.vcsWrite{background:#fff;}
.writeHead{position:relative;width:100%;height:40px;padding:10px 0;overflow:hidden}
.writeHead .title{height:24px;padding:8px 0;}
.writeHead h3{font-size:16px;line-height:26px;}
.writeHead h3 span{display:inline-block;width:24px;height:24px;margin-right:3px;background-position:-60px -536px;}

.writeForm{border-top:1px solid #666;border-bottom:1px solid #666;}
.writeForm dl{clear:both;border-top:1px solid #e7e7e7;background:#fff;overflow:hidden}
.writeForm dl:after{content:".";clear:both;display:block;height:0;visibility:hidden}
.writeForm dl dt{float:left;width:10%;padding-left:4%;background:#f9f9f9;color:#666;font-size:13px;font-weight:bold}
.writeForm dl dd{float:left;width:84%;padding-left:2%;}
.writeForm dt,.writeForm dd{padding-top:8px;padding-bottom:8px;line-height:26px;}
.writeForm .title{border-top:0;}
.writeForm .title input{width:70%}
.writeForm .projName input{width:40%;}
.writeForm .tel{font-family:Verdana,"굴림",Gulim,Sans-serif;color:#666}
.writeForm .tel input{width:40px;}
.writeForm .editor textarea{width:94%;padding:3%;border:0;border-top:1px solid #e7e7e7}
.writeForm input[type=file]{width:80%;height:22px;background-color:#fff;}
.writeForm .notice{padding:14px 20px;border:1px solid #e1dba5;border-bottom:0;background:#ffffe6 url(../../images/sub/bg_grid.gif);color:#c86e4b;line-height:16px}
.writeForm .notice li{padding:4px 0}

.writeFoot .btns{padding:25px 0;text-align:center}

@media only screen and (-webkit-min-device-pixel-ratio:1.5){
.writeForm dl dt{background:#f2f2f2;color:#888;}
#vcs .writeForm .notice{font-size:12px;line-height:16px}
}
@media all and (max-width:600px) {
.writeForm dl dt{width:20%;padding-left:2%;font-size:12px;}
.writeForm dl dd{width:76%;padding-left:2%;}
.writeForm dl.tel dt{padding-top:23px;padding-bottom:23px}
.writeForm dl.tel label{font-size:11px}
.writeForm .tel input{width:38px;}
.writeForm dl.tel .telBox,.writeForm .tel .phoneBox{display:block}
}