@charset "utf-8";

@font-face {
  font-family: 'NanumGothicBold';
  font-style: normal;
  font-weight: 700;
  src: url(/renewal/css/renewal/css/font/NanumGothic-Bold.eot);
  src: url(/renewal/css/font/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(/renewal/css/font/NanumGothic-Bold.woff2) format('woff2'),
       url(/renewal/css/font/NanumGothic-Bold.woff) format('woff'),
       url(/renewal/css/font/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 400;
  src: url(/renewal/css/font/NanumGothic-Regular.eot);
  src: url(/renewal/css/font/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(/renewal/css/font/NanumGothic-Regular.woff2) format('woff2'),
       url(/renewal/css/font/NanumGothic-Regular.woff) format('woff'),
       url(/renewal/css/font/NanumGothic-Regular.ttf) format('truetype');
}



/* layout 관련 */ 

body {margin:0; padding:0; height:100%; font-size:13px; color:#757575; font-family: "Arial", "NanumGothic", sans-serif;min-width: 1028px}
div,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,form,fieldset,input,table,tr,th,td,button,textarea,select {margin:0; padding:0}
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {display:block}
ul,ol,dl,dt,dd,li{list-style:none}
fieldset,img {border:0; vertical-align:middle}
address,em {font-style:normal}
hr {display:none}
table {border-collapse:collapse; width:100%}
a {color:#999; text-decoration:none}
a:hover,a:focus {text-decoration:none}
caption,legend {visibility: hidden; width: 0; height: 0; font-size:0; line-height:0}
textarea {resize: none; border: 1px solid #a1a1a1; }

/*  공통 클라스 정의 */
.hide {visibility: hidden; width: 0; height: 0; font-size:0; line-height:0}
.inner {width: 1018px; margin: auto; }
.mt15{margin-top: 15px !important}
.mt30{margin-top: 30px !important}
.MultiFile-list{width:800px !important}
.MultiFile-list a {display: inline-block; width: 16px; height: 16px; line-height: 16px; border: 1px solid #aeaeae;text-align: center}


/* header ------------------------------------------------------------------------------------------------------------------------------*/

	.head_wrap{; width: 100%; height: 52px ; background: url(/images/common/bg_headerWrap.png) repeat-x 0 0; z-index: 999; }
	.head_wrap h1{float: left; margin-top: 8px; margin-right: 40px; }
	
	/* main Menu */
	.head_wrap .gnb_wrap{float: left; }
	.gnb_wrap .mainMenu {width: auto; }
	.gnb_wrap .mainMenu:after{content:''; clear: both; display: block; width: 0; height: 0; overflow: hidden;  }
	.gnb_wrap .mainMenu >li {float: left; line-height: 52px; border-left: 1px solid #2c2d31 }
	.gnb_wrap .mainMenu >li > a{display: block; padding: 0 20px; color: #fff; font-size: 14px; }
	.gnb_wrap .mainMenu >li:hover > a, .gnb_wrap .mainMenu >li:focus > a,.gnb_wrap .mainMenu >li.active > a{color: #d93b20;}
	
	/* sub Menu */
	.depth2{display: none; position: absolute; width: 100%; height: 44px; left: 0; top: 51px;background: url(/images/common/bg_depth2.png) repeat-x 0 0;z-index: 99999}
	.depth2 ul{width: 1018px; margin: auto; }
	.depth2 ul:after{content:''; display: block; clear: both; width: 0; height: 0; overflow: hidden; }
	.depth2 li{float: left; line-height: 44px; margin-left: 20px; }
	.depth2 li a{color: #dedede; }
	.depth2 li:hover a{color: #fff; }
	.gnb_wrap .mainMenu >li:hover .depth2{display: block; }
	.gnb_wrap .mainMenu >li .depth2:hover{display: block; }
	.menu1 .depth2 li:first-child{margin-left: 170px; }
	.menu2 .depth2 li:first-child{margin-left: 170px; }
	.menu3 .depth2 li:first-child{margin-left: 400px; }
	.menu4 .depth2 li:first-child{margin-left: 592px; }
	.menu5 .depth2 li:first-child{margin-left: 450px; }	
	/* util Menu */
	.util_wrap{float: right; width: 127px; height: 28px; margin-top: 10px;  }
	.util_wrap .uitlMenu li{float: left; width: 28px; height: 28px; margin-left: 5px; }
	.util_wrap .uitlMenu li:first-child{margin-left: 0; }
	#member {position: absolute; top: 19px; margin-left: 10px; color: #dedede}



/* visual */
.outVisual{position: relative; width: 100%; height: auto ;}
.outVisual .BannerScreen li{display: none; width:100%;  text-align: center;  }
.outVisual .BannerScreen li.actImg{display: block; }
.outVisual .BannerScreen li.img1{background: #161212;}
.outVisual .BannerScreen li.img2{background: #1a6497;}
.outVisual .BannerScreen li.img3{background: #8dc63f;}
/*.outVisual .BannerScreen li img{width: 100%; }*/
.outVisual .prev {position: absolute; display: block; width: 23px; height: 57px; top: 220px; left: 70px;  background: url('/images/common/ico_prev.png') no-repeat 0 0; text-indent: -9999px; }
.outVisual .next {position: absolute; display: block; width: 23px; height: 57px; top: 220px; right: 70px;  background: url('/images/common/ico_next.png') no-repeat 0 0;text-indent: -9999px; }
.outVisual .idx {position: absolute; width: auto; left: 50%; bottom: 30px;  }
.outVisual .idx li {float: left; margin-left: 10px;}
.outVisual .idx a {display:block; text-indent: -9999px;}
.outVisual .idx li a{width: 14px; height:13px; background: url('/images/common/ico_dot.png') no-repeat 0 0}
.outVisual .idx li:hover a, .outVisual .idx li.active a{background-position: 0 -13px; }


/* 제품 링크 메뉴 */
.container_wrap{padding-bottom: 14px;}
.container_wrap.main{padding-bottom: 0; }
.container_wrap > .inner {padding: 21px 0 ; }
.productLink {width: 60%; padding: 25px; box-sizing: border-box;  float: right;}
.productLink:after{content:''; display: block; clear: both; width: 0; height: 0; oveflow: hidden; }
.section1{; background: #f9f9f9 ;border:1px solid #a1a1a1;}
.section2{; margin-top: 20px; background: #f9f9f9 ;border:1px solid #a1a1a1;}
.productLink > div {float: left; width: 280px; text-align: center;  }
.productLink > div > span{display: block; margin: auto; }
.productLink > div > span.text{margin-top: 20px; }
.productLink.section1 > div{padding-top: 40px; }
.productLink > ul {float: right; width: 100%;  }
.productLink > ul li {float: left; padding: 17px 0; text-align: center;  }
.productLink > ul li span{display: block; }
.productLink > ul li span.text{margin: 8px 0; }
.productLink > ul li a{display: block; width: 150px; line-height: 24px; margin: auto; background: #fff; color: #000; opacity: .4 ; filter:alpha(opacity=40);}
.productLink > ul li a.size1{width: 150px; }
.productLink > ul li a.size2{width: 80px;}
.productLink > ul li.grid{width: 34%; height:94px; background: rgba(146, 22, 22, 1); ; margin-left: 0.5%}
.productLink > ul li.chart{width: 31%; height:94px; background: #40af5d; ; margin-left: 1.5%}
.productLink > ul li.egov{width: 31%; height:71px; padding-top: 40px;background: #fbcd0b; ; margin-left: 1.5%}
.productLink > ul li.egov span{font-family: "NanumGothicBold"; font-size: 15px; color: #000;}
.productLink > ul li.egov a{margin-top: 30px; }
.productLink > ul li.etc{width: 128px; height:61px; margin-left: 10px; padding-top: 50px; background: #e4e4e4; }
.productLink > ul li.biz{width: 100%; height:82px; line-height: 82px;; padding: 0; background: #3d4148; }
.productLink > ul li.biz * {float: left;margin-left: 10px; vertical-align: middle; }
.productLink > ul li.biz span:first-child{margin-left: 10px;padding-top: 10px;}
.productLink > ul li.biz .text{margin-top: 35px;}
.productLink > ul li.biz a{margin-top: 27px;}
.productLink > ul li.studio{width: 280px; height:94px; background: #5da9dd; }
.productLink > ul li.platform{width: 100%; height:82px; line-height: 82px; background: #2b4472; margin-bottom: 10px;padding: 0}
.productLink > ul li.platform * {float: left;margin-left: 10px; vertical-align: middle; }
.productLink > ul li.platform span:first-child{margin-left: 10px;padding-top: 15px;}
.productLink > ul li.platform .text{margin-top: 35px;}
.productLink > ul li.platform a{margin-top: 27px;}
.productLink > ul li.empty{width: 128px; height:128px; padding: 0;  margin-left: 10px;  }
.productLink > ul li.empty span{float: left; display:block; width:40px ; height: 40px; margin:0 0 0 4px; background: #e4e4e4; }
.productLink > ul li.empty span.first{margin-left: 0; }
.productLink > ul li.empty span.middle{margin-top: 4px; margin-bottom: 4px;  }
.productLink.section2 > div .text{margin: 4px 0; }
.productLink.section2 > div a{display: block; width: 150px; line-height: 24px; margin: auto; background: #d93b20; color: #fff;  }
.productLink.section2 > ul li.studio .text{margin-top: 11px; }

/* 고객지원 링크  */
.customerLink{width: 100%; padding:30px 0; background: #283859; url(/images/common/icon_platform.png) repeat-x 0 0; box-shadow: inset 0 5px 5px #0b121e;}
/*.customerLink .inner ul:after{content:''; width: 0; height: 0; display: block; clear: both; oveflow: hidden; }
.customerLink .inner li{float: left; width:326px; margin-left: 20px; text-align: center;  }
.customerLink .inner li:first-child{margin-left: 0; }
.customerLink h4{font-size: 20px; color: #000; font-family:"NanumGothicBold"; }
.customerLink .inner li span{display: block; width: auto; height: 110px;margin: 12px 0 4px 0; }
.customerLink .inner li span img{vertical-align: middle; }
.customerLink .inner li p{margin: 0; padding: 0; color: #626262;}
.customerLink .inner li a{display: block; width:160px; height: 28px; line-height: 28px; margin: 8px auto 0; background: url(/images/common/btnbg_type1.png) repeat-x 0 0; text-align: center; color: #fff;  }*/
/* 2014년 9월 22일 수정 */
.noticewrap {width: 36%;float: left;height: 404px}
.noticewrap .notice{position: relative; float: left; width: 100%; height: 45%; padding: 10px; background: #fff; border: 1px solid #a1a1a1; overflow: hidden;  margin-bottom: 5% !important}
.noticewrap .notice dt{margin-bottom: 10px; padding-bottom: 10px; border-bottom:1px solid #a1a1a1; font-size: 18px; color: #272727; }
.noticewrap .notice dd{height: 28px; line-height: 28px; background: url('/images/common/bg_list.gif') no-repeat 0 center; text-indent: 12px; }
.noticewrap .notice dd:after{content:''; display: block; clear: both; width: 0; height; 0;  }
.noticewrap .notice dd.more{position: absolute; top: 15px; right: 10px; background: none; }
.noticewrap .notice dd.more a{display: block;width: 15px; height: 15px; background: url('/images/common/bg_more.png') no-repeat ;  color: #fff; text-indent: -9999px;    }
.noticewrap .notice dd p{float: left; width: 70%;height: 28px; overflow; hidden;  }
.noticewrap .notice dd p a {float: left; display: inline-block;  text-overflow: ellipsis;  overflow: hidden; white-space:nowrap; }
/*.noticewrap .notice dd.new p a{width: 60%; }*/
.noticewrap .notice dd.new p:after{content:''; display: inline-block; width: 15px; height:15px; margin-top: 6px; background: url('/images/common/bg_new.png') no-repeat 0 0 ; color: #fff; }
.noticewrap .notice dd span{display: block; float: right; }

.customerLink .link{float: left; width: 100% ; ; overflow: hidden;  }
.customerLink .link li{float: left; width: 30%; padding:15px 10px ; box-sizing: border-box; overflow: hidden; margin-left: 2.5%}
.customerLink .link li.link1{background:#f8f8f8;border-left: none}
.customerLink .link li.link2{background: #f8f8f8}
/*.customerLink .link li.even{border-left: 1px solid #f8f8f8; }*/
/*.customerLink .link li.line{border-top: 1px solid #f8f8f8; }*/
.customerLink .link li div{height:120px;text-align: center;  }
.customerLink .link li div span{width: 50%;}
.customerLink .link li div span img{width: 100px; }
.customerLink .link li div h4{height: 22px; color: #272727;overflow: hidden;}
.customerLink .link li div p{font-size: 12px; }
.customerLink .inner li a{display: block; width:100%; height: 24px; line-height: 24px; margin: 4px auto 0; background: url(/images/common/btnbg_type1.png) repeat-x 0 0; text-align: center; color: #fff;  }
.customerLink .link li strong {margin-left: 10px; font-size: 18px; color: #272727; }

/* 레퍼런스  */
.reference:after{content:""; display: block; clear: both; width: 0; height: 0; overflow: hidden; }
.reference h4 {text-align: center; }
.reference > div {height: auto; padding:8px;margin-top: 20px;  background: #f5f5f5; }
.reference div.gov{margin-top: 40px; }
.reference > div:after {content:''; display: block; clear: both; width: 0; height: 0; overflow: hidden; }
.reference > div h5{float: left; width:53px; height: auto; padding:15px; text-align: center; color: #fff; font-size: 16px;}
.reference div.gov h5{height: 132px; background: #72bf44}
.reference div.financial h5{height: 46px; background: #f58220}
.reference div.company h5{height: 304px; background: #d93b20}
.reference div.medical h5{height: 46px; background: #5da9dd}
.reference > div ul {float: right; width: 910px; margin-top: -10px;  }
.reference > div ul li{float: left; width:220px; height: 76px; margin-left: 10px; margin-top: 10px; background: #fff; border: 1px solid #a1a1a1; box-sizing: border-box;  }
.reference > div ul li.first{margin-left: 0; }


/* footer */
.footer_wrap{background:#2a2d33; min-height: 99px;}
.footer_wrap .inner{padding-top: 30px}
.footer_wrap h2 {float: left; margin-right: 50px; margin-left: 115px; }
.footer_wrap address{line-height: 20px; }
.footer_wrap address p {color: #858585;}
.footer_wrap address p span:before{content:"|"; margin-right: 15px;  }
.footer_wrap address p span{margin-left: 15px;   }



/*  tab  */
.tab_area {margin-bottom: 70px; }
.tab_area ul{border-bottom: 1px solid #222831}
.tab_area ul:after {content:''; display: block; clear: both; width: 0; height: 0; overflow: hidden; }
.tab_area ul li{float: left; width: 203px;box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box;text-align: center; }
.tab_area ul li:first-child {width: 206px;border-left: 1px solid #a1a1a1; }
.tab_area ul li a{position: relative; display: block; line-height: 52px; background: #efefef; border-top: 1px solid #a1a1a1; border-right: 1px solid #a1a1a1; border-left: 0 none; font-family: 'NanumGothicBold'}
.tab_area ul li a span{position: absolute; display: none; width: 24px; height: 13px; bottom: -1px; left: 50%; margin-left: -12px; background:url('/images/common/bg_arrow.png') no-repeat 0 0;}
.tab_area ul li a:hover, .tab_area ul li a:focus, .tab_area ul li a.active{line-height: 52px; background: #222831 ;border: 1px solid #222831; border-bottom: 0 none;  color: #fff;  }

.tab_area ul li a:hover span, .tab_area ul li a:focus span, .tab_area ul li a.active span{display: block; }

.tab_wrap{margin-top: 40px; }
.tab_menu{border-bottom: 2px solid #3a7e9a}
.tab_menu:after{content:''; display: block; clear: both; width: 0; height: 0; overflow: hidden; }
.tab_menu li{float: left;}
.tab_menu li a{display:block; line-height: 25px; padding:0 30px; background: #dedede; border-top: 1px solid #a1a1a1; border-right: 1px solid #a1a1a1;  box-sizing: border-box; color: #272727; }
.tab_menu li:first-child a{border-left: 1px solid #a1a1a1; }
.tab_menu li a:hover, .tab_menu li a:focus, .tab_menu li a.active{background: #3a7e9a; border-top: 1px solid #3a7e9a; border-right: 1px solid #3a7e9a; font-family: "NanumGothicBold" ; color: #fff;}
.tab_menu li:first-child a:hover, .tab_menu li:first-child a.active, .tab_menu li:first-child a:focus{border-left: 1px solid #3a7e9a; }


/* table  */
.tbl1 {width: 100%;  border-bottom: 2px solid #3a7e9a; table-layout: fixed;   }
.tbl1.border{border-top: 2px solid #3a739a;}
.tbl1.border th{background: #fafafa; border-right: 1px solid #d2d2d2; }
.tbl1.border th:first-child{border-left: 0 none; }
.tbl1.border th.borderL{border-left: 1px solid #d2d2d2;}
.tbl1 th{padding: 20px 0 ; border-bottom: 1px solid #d2d2d2; font-size: 15px; }
.tbl1 td{padding: 25px 40px; line-height: 30px; border-bottom: 1px solid #d2d2d2;;}
.tbl1 td.conts{min-height: 200px; line-height: 24px; padding:40px 20px; }
.tbl1 .last{border-bottom: 0 none; }
.tbl1 td p:before{content:''; display: inline-block; width: 5px; height: 5px; background: #3a739a; margin-right: 10px; }
.tbl1 td input[type=text], .tbl1 td input[type=password] {width: 100%; height:24px; line-height: 24px;  }
.tbl1 td textarea{width: 100%; }
.tbl2 {width: 100%;  border-bottom: 2px solid #3a7e9a; border-top: 2px solid #3a7e9a; table-layout: fixed;   }
.tbl2 thead th {padding: 15px 0; background: #fafafa; border-bottom: 1px solid #a1a1a1; border-left: 1px solid #dedede; text-align: center;  }
.tbl2 thead th:first-child{border-left: 0 none;}
.tbl2 tbody th, .tbl2 tbody td{padding: 12px ; border-bottom: 1px solid #dedede; border-left: 1px solid #dedede; text-align: center; }
.tbl2 tbody th:first-child, .tbl2 tbody td:first-child{border-left: 0 none; }
.tbl2 .txtLeft{text-align: left; }
.answer .reply{background: url('/images/common/bg_answer.png') no-repeat 8px 6px;  }
table .tct{text-align: center;}
.tbl2 td .text {display: inline-block;; }
.tbl2 .new .text:after{content:'N'; display: inline-block; width: 14px; height: 14px; margin-left: 10px; background: #f58220; color: #fff; text-align: center;}

table .new 

/*  button */
input[type=text]{height: 24px;  line-height: 24px; border: 1px solid #a1a1a1;}
input[type=file]{height: 24px; line-height: 24px; background: #fff; border: 1px solid #a1a1a1;}
input[type=button]{height: 26px; margin: 0;  background: #424242; border: 0 none; overflow: visible;  color: #fff; vertical-align: top; cursor: pointer; }
input[type=button].type1{background: #424242; color: #fff; }
input[type=button].type2{background: #f58220; color: #fff; }
input[type=button].type3{background: #a1a1a1; color: #fff; }
input[type=button].small{height: 20px; line-height: 20px; padding: 0 10px;}
input[type=button].mid{height: 26px; line-height: 26px; padding: 0 15px; }

.btn {display: inline-block; padding: 0 10px;}
.btn_area{margin-top: 20px; text-align: right;  }
.btn.type1{background: #424242; color: #fff; }
.btn.type2{background: #f58220; color: #fff; }
.btn.type3{background: #a1a1a1; color: #fff; }
.btn.small{height: 20px; line-height: 20px; padding: 0 10px;}
.btn.mid{height: 24px; line-height: 24px; padding: 0 15px; }
.btn.large{height: 30px; line-height: 30px;padding: 0 20px;  }


/*fieldset*/
/*.file_Outer {position: relative;}*/
.file_Outer:after{content:''; display: block; clear: both; width:0; height:0; overflow: hidden; s}
.file_Outer input[type=text].file_text{float: right; width: 748px;height: 26px;  }
.file_Outer .file_inner{float: left; display: inline-block; width: 64px; height: 26px; top: 0; left: 0; margin-right: 4px;background: url('/images/common/btn_file.png') no-repeat 0 0;  }
.file_Outer input[type=file]{filter:alpha(opacity:0); opacity:0; width: 64px; height: 26px; color: #fff; cursor: pointer}
select {height: 18px; border: 1px solid #a1a1a1; }
.multi{background: url('/images/common/btn_file.png') no-repeat 0 0;  width: 100%; height: 26px; color: #fff; cursor: pointer; background: #fff; }

/* 아이디 비밀번호 popup */
.popup{background:#5c8cbf url(/img/common/bg_pop.gif) no-repeat right top; padding:20px 0 0 0;}
.popup h1{color:#fff; padding:0 20px 20px 0; margin:0 20px; background:url(/img/common/bg_h1.gif) repeat-x left bottom; font-size:18px;}
.popup .in{background:#fff; margin:20px; padding:20px;}

#mask {  
  position:absolute;  
  left:0;
  top:0;
  z-index:9000;  
  background:#000;  
  display:none;  
}

.window {
	  position:absolute; 
	  z-index:10000;
	  top:-160px; 
}

.pop_area{position:relative; width:330px; height:220px; margin:-220px auto 0 auto;}




/*  달력 */
.ui-datepicker{padding: 15px; background: #fff; border: 1px solid #aeaeae}
.ui-datepicker-title{padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #aeaeae; }
.ui-datepicker-prev{display: block; float: left; width: 16px; height: 24px; margin-bottom: 10px; background: url('/images/common/btn_prev.png') no-repeat 0 0; text-indent: -9999px; cursor: pointer }
.ui-datepicker-next {display: block; float: right; width: 16px; height: 24px; margin-bottom: 10px;background: url('/images/common/btn_next.png') no-repeat 0 0;text-indent: -9999px;  cursor: pointer}
.ui-datepicker-title {margin-top: 10px; }
.ui-datepicker-title select {width: 61px; height: 24px; margin-left: 5px; box-sizing: border-box; }
.ui-datepicker-calendar th, .ui-datepicker-calendar td{padding: 2px 5px; font-size: 12px; text-align: right;  }
.ui-datepicker-buttonpane {margin-top: 10px; padding-top: 10px; border-top: 1px solid #aeaeae; }
.ui-state-default{float: left; }
.ui-datepicker-close {float: right; }
#sDate +img, #eDate +img{vertical-align: middle; margin-left: 4px;  }



