@charset "utf-8";
@import 'common.css';

/* Layout */
#container{background:#f8f8f8;position:relative}
#container:after{content:'';clear:both;display:block}
.img_main{width:100%}
#content{padding:25px 0 30px;width:1540px;margin:0 auto}
#content:after{content:'';clear:both;display:block}
#container{background:#f4fbf8}
#container .list_wrap, #container .bn_wrap{box-sizing:border-box;float:left}
.list_wrap{width:32%;margin-right:5%;float:left}
.bn_wrap{width:26%;float:right}
footer{width:1540px;margin:0 auto;padding-left:0;}

/* Main Img */
.img_main{position:relative;background:#469786 url(../images/main/img_main_bg.png) no-repeat 50% 0;width:100%;height:360px}
.img_wrap{width:850px;padding-top:30px;margin:0 auto;text-align:center;font-stretch:condensed;letter-spacing:-0.02em;}
.img_wrap h1{font-weight:normal;font-size:67px;color:#FFF;margin-bottom:5px}
.img_wrap h2, .img_wrap p{color:#fff}
.img_wrap h2{font-weight:normal;font-size:24px;margin-bottom:5px}
.img_wrap p{font-size:15px;color:#fff;line-height:1.2em;word-break:keep-all}
.menus{width:430px;margin:25px auto 0}
.menus li{float:left;width:76px;margin:0 15px}
.menus li a{position:relative;display:block;height:74px;border:1px solid #fff;border-radius:37px;background-image:url(../images/main/micons.png);background-repeat:no-repeat}
.menus li em{font-size:14px;color:#fff;position:absolute;top:85px;left:-6px;width:90px;text-align:center}
.menus li a.menu1{background-position:0 20px}
.menus li a.menu2{background-position:-100px 20px}
.menus li a.menu3{background-position:-200px 20px}
.menus li a.menu4{background-position:-300px 20px}
.left_navi{float:left; width:10%; min-width:205px; max-width:205px; background:#fff; box-sizing:border-box; margin-right:7px;}

/* Contents */
/* List */
.list_wrap{}
.list_wrap h2{position:relative;font-weight:bold;font-size:15px;height:18px;margin-bottom:17px;color:#666}
.list_wrap h2 a.more{position:absolute;top:0;right:0px;font:normal 11px tahoma;color:#666}
.list_wrap h2 a.more:hover{background:none;color:#5bc1a0}

.list{margin:0}
.list li{position:relative;margin:5px 0}
.list li a{display:block;overflow:hidden;margin-right:70px;height:19px;white-space:nowrap;text-overflow:ellipsis;color:#333}
.list li a:hover{color:#3798f0}
.list li span{position:absolute;top:0;right:0;}
.list_bl strong{font-weight:normal;color:#ef5137}
.list_bl li a{background:url(../images/main/buls.png) no-repeat 0 0;padding-left:7px}
.list_bl li img{vertical-align:middle}

[class^='proc_'], [class*='proc_']{background:url(../images/common/function_slide.png) no-repeat 100% 4px;padding-right:7px;margin-right:8px}
strong.proc_save{color:#2f8adc}
strong.proc_approval{color:#6e88cb}
strong.proc_complete{color:#3ab33a}
strong.proc_cancel{color:#616d79}
strong.proc_return{color:#996d9b}


/*-- Right area --*/
.bn_wrap{margin-top:25px}
/* Link */
.link li{border:1px solid #e6e6e6;background:#fff;margin-bottom:5px}
.link li img{margin:-4px 5px 0 0}
.link li a{display:block;height:15px;padding:14px;font-weight:bold;font-size:12px;color:#666}
.link li a:hover{background:#eaf6f1;color:#3798f0}
.link li em, .manual li em{float:right;margin-right:5px}

/* Contact Info */
/* .contact{margin-bottom:10px}
.contact:after{content:'';clear:both;display:block}
.contact li{border:1px solid #e6e6e6;background:#fff;width:49%;position:relative;box-sizing:border-box;}
.contact li:first-child{float:left}
.contact li:last-child{float:right}
.contact li a{display:block;padding:15px 0 15px 58px;font-weight:bold;font-size:12px;color:#999;}
.contact li a:hover{background:#f4f4f4;color:#3798f0}
.contact li img{position:absolute;top:7px;left:15px} */

.it_voc{width:100%; height:41px; background:#87bd05; margin-top:7px; cursor:pointer;}
.it_voc img{margin-left:47px; margin-top:9px;}
.it_voc h3{font-family:'Malgun Gothic','맑은 고딕','돋움',dotum,Helvetica,sans-serif; color:#fff; font-size:20px; font-weight:normal; margin-top:-28px; margin-left:80px;}
.contents{float:left; width:83%; box-sizing:border-box;}
.contact{width:100%; background:#fff; border:1px solid #dcdcdc; margin-top:7px; padding-bottom:6px; box-sizing:border-box;}
.contact_title{width:100%; height:45px; box-sizing:border-box; border-bottom:1px solid #dcdcdc;}
.contact_title img{margin-top:11px; margin-left:15px;}
.contact h3{font-family:'Malgun Gothic','맑은 고딕','돋움',dotum,Helvetica,sans-serif; color:#767677; font-size:15px; font-weight:bold; margin-top:-40px; margin-left:50px; line-height:15px;}
.contact span{font-family:'Malgun Gothic','맑은 고딕','돋움',dotum,Helvetica,sans-serif; color:#767677; font-size:14px; font-weight:bold;}
contact_list{margin-top:13px; margin-left:8px;}
.contact_list li{font-family:'Malgun Gothic','맑은 고딕','돋움',dotum,Helvetica,sans-serif; color:#666 !important; font-size:12px !important; line-height:18px;}
.contact_list li span{font-family:'Malgun Gothic','맑은 고딕','돋움',dotum,Helvetica,sans-serif; color:#666 !important; font-size:12px !important; font-weight:normal; letter-spacing:4px;}


/* icon */
em[class^='ico_'], em[class*='ico_']{text-indent:-1000em;display:inline-block;width:15px;height:15px;background-image:url(../images/main/icons.png);background-repeat:no-repeat}
em.ico_download{background-position:0 0}
em.ico_newwindow{background-position:0 -60px}


/* Mod Style start : 2019.08.02 */
#cost_warp{min-width:1500px !important; min-height:780px; height:100%;} /* min-width:1540 */
#gnb{margin:0; height:80px; width:auto; padding:0}
#gnb h1{left:30px; top:18px}
#gnb h1 a{display:inline-block; padding:10px; }
#gnb .dropdown{left:200px;}
.vertical2 .group>li{margin:0;}
.dropdown_depth{padding-top:5px}

#container{background-color:#fff; padding:5px !important; background:url(../images/cipm/visual_bg.jpg) no-repeat 220px 5px; height:calc(100% - 91px); min-height:660px; position: relative}
.list_wrap{width:570px; margin:20px 7px 0 0; min-height:236px; padding:10px 12px; border:1px solid #dcdcdc; border-radius:5px }
.list_wrap h2{display:block; color:#3292c0; font-size:17px; line-height:20px; margin-bottom:0; padding:0 0 10px 6px; border-bottom:1px solid #95bce7}
.list_wrap h2 a.more{font-size:15px; top:4px; font-size:12px}
.list_wrap h2 a.more:hover{color:#3798f0}
.list_wrap ul{padding-top:5px}
.list_wrap li{border-bottom:1px solid #eee; padding-bottom:5px; margin:0 0 0 3px;}
.list_wrap li a{line-height:18px; height:auto; padding:6px 0 6px 6px; background:none}
.list li span{top:5px; right:3px; color:#888}
.my_link{background:#3292c0; height:159px; position: relative; padding:5px 0 0; border:1px solid #3292c0; border-radius:5px; overflow:hidden}
.my_link > a{position:absolute; top:10px; right:5px}
.my_link_text{height:29px; line-height:23px; padding:0; text-indent:5px; color:#fff; font-size:15px; font-weight: bold}
.my_link_list{background:#fff; height:130px; padding:5px; overflow-y:auto; box-sizing: border-box} /* #b8d5f3 */
.my_link_list li a{color:#003366; display:block; white-space:nowrap;text-overflow:ellipsis; line-height:16px; padding:3px; overflow:hidden}
.my_link_list li a:hover{text-decoration: underline}
.it_voc{background:#3292c0; border-radius:4px; height:auto;}
.it_voc:hover{background:#2f95e9}
.it_voc a{display:block; position:relative; padding:7px 10px}
.it_voc h3{display:block; font-size:15px; font-weight:bold;margin:0}
.it_voc a img{width:18px; height:auto; position:absolute; right:10px; top:50%; margin-top:-7px}
.contact_title{height:50px; box-sizing:border-box}
.contact{padding-bottom:16px; border-radius:5px;}
.contact h3{font-size:14px; margin-top:-43px}
.contact h3 span{display:inline-block; padding-top:3px; font-size:12px; font-weight:normal}
ul.contact_list{margin-top:24px}
ul.contact_list li{padding:0 10px}
footer{width:100%; position:absolute; bottom:0; left:0; background-color:#e5e5e5; border-top:1px solid #d5d5d5; padding:10px 20px; background-position: 99% 50%}