@charset "utf-8";

/* @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); */

/* Reset */
html,body{width:100%;height:100%}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0;vertical-align:top;line-height:1.7;}
body,input,textarea,select,button,table{font-family:Noto Sans KR,'돋움',Dotum,helvetica,arial,sans-serif;font-size:1em;color:#555;letter-spacing:-0.02em;font-weight:300}
img,fieldset{max-width:100%;height:auto;border:0;vertical-align:top; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;}
ul,ol{list-style:none}
em,address{font-style:normal}
a{color:#555;-webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;-ms-transition:all .2s;transition:all .2s;text-decoration:none}
a:hover,a.focus{color:#0886cb}
article,aside,dialog,footer,header,section,footer,nav,figure{display:block;padding:0;margin:0}
button{cursor:pointer}
table caption{overflow:hidden;width:0;height:0;line-height:0;text-indent:-9999px}

/* Common */
#wrap{position:relative;background:#fff}
.hide{overflow:hidden;position:absolute;top:0;left:0;width:0px;height:0px;font-size:0;line-height:0}/* 감추기 클래스, 접근성으로 인한 display:none 사용 X */
.bold{font-weight:bold}
.normal{font-weight:normal}

/* *********************************************************************************
 *	건너뛰기 메뉴 정의
 * *********************************************************************************/
#skip{position:relative;z-index:9999}
#skip a{position:absolute;top:-30px;left:0;width:150px;padding:0 15px;background-color:#222;font-size:.8125em;line-height:30px;color:#FFF;text-align:center;-webkit-transition:top .4s;-moz-transition:top .4s;-ms-transition:top .4s;-o-transition:top .4s;transition:top .4s}
#skip a:hover,#skip a:focus,#skip a:active{top:0;text-decoration:none}

/* *********************************************************************************
 *	정렬 정의
 * *********************************************************************************/
.left{text-align:left}
.center{text-align:center}
.right{text-align:right}
.top{vertical-align:top}
.middle{vertical-align:middle}
.bottom{vertical-align:bottom}

/* *********************************************************************************
 *	float 정의
 * *********************************************************************************/
.fl{float:left}
.fr{float:right}

/* float 값 클리어 */
.clear:after{display:block;clear:both;content:''}

/* *********************************************************************************
 *	기본글꼴 색상 정의
 * *********************************************************************************/
.red{color:red}
.orange{color:orange}
.yellow{color:yellow}
.green{color:green}
.blue{color:blue}
.navy{color:navy}
.purple{color:purple}

/* *********************************************************************************
 *	title 정의
 * *********************************************************************************/
h1{}
h2{}
h3{}
h4{font-family:'LotteMartDream-L'!important; margin-top:20px;padding:0 0 10px 24px;background:url(/images/bul_h4.gif) left 14px no-repeat;font-size:1.75em;color:#222;font-weight:500}
h5{font-family:'LotteMartDream-L'!important; margin-top:15px;padding:4px 0 10px;background:url(/images/bul_h5.gif) left top no-repeat;font-size:1.25em;color:#0886cb;font-weight:normal}
h6{padding:0 0 3px 13px;background:url(/images/bul_h6.gif) left 10px no-repeat;font-size:1em;color:#555;font-weight:600}
.h62{padding:0 0 3px 13px;font-size:1em;color:#555;font-weight:600}
/* *********************************************************************************
 *	기본 리스트 정의
 *  리스트 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 *  ex) <ul class="list type_01"></ul>
 * *********************************************************************************/
ul.list li{margin-left:12px;padding-left:13px;background:url(/images/common/bul_list.gif) left 13px no-repeat;font-weight:300}

ul.list.type_1 li{background:url(/images/common/bul_h6.gif) left 10px no-repeat}

/* *********************************************************************************
 *	기본 버튼 정의
 *  버튼 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 *  ex) <a class="list type_01"></a>
 * *********************************************************************************/
.btn{display:inline-block;border:1px solid #0086cb;padding:4px 8px;color:#0886cb;background-position:25px center;background-repeat:no-repeat}
.btn:hover{color:#fff;background-color:#0886cb}

.btn.list{border:1px solid #0886cb;padding:8px 25px 8px 50px;color:#0886cb;background-image:url(/images/common/btn_list.png)}
.btn.list:hover{color:#fff;background-color:#0886cb;background-image:url(/images/common/btn_list_ov.png)}

.btn.down{border:1px solid #0886cb;padding:8px 25px 8px 50px;color:#0886cb;background-image:url(/images/common/btn_down.png)}
.btn.down:hover{color:#fff;background-color:#0886cb;background-image:url(/images/common/btn_down_ov.png)}

.btn.submit{border:1px solid #0886cb;padding:8px 25px 8px 50px;color:#0886cb;background-image:url(/images/common/btn_check.png)}
.btn.submit:hover{color:#fff;background-color:#0886cb;background-image:url(/images/common/btn_check_ov.png)}

.btn.mail{border:1px solid #0886cb;padding:8px 25px 8px 50px;color:#0886cb;background-image:url(/images/common/btn_mail.png)}
.btn.mail:hover{color:#fff;background-color:#0886cb;background-image:url(/images/common/btn_mail_ov.png)}

.btn.cancle{border:1px solid #707070;padding:8px 25px 8px 50px;color:#707070;background-image:url(/images/common/btn_x.png)}
.btn.cancle:hover{color:#fff;background-color:#707070;background-image:url(/images/common/btn_x_ov.png)}

.btn.sm{border:1px solid #0886cb;margin-left:8px;padding:1px 10px;color:#0886cb;font-size:0.875em}
.btn.sm:hover{color:#fff;background-color:#0886cb}

.btn.sm_down{border:1px solid #0886cb;margin-left:8px;padding:1px 10px 1px 25px;color:#0886cb;background-image:url(/images/common/btn_down_small.png);background-position:10px center;font-size:0.875em}
.btn.sm_down:hover{color:#fff;background-color:#0886cb;background-image:url(/images/common/btn_down_small_ov.png)}

.btn.del{display:inline-block;border:1px solid #d84248;padding:8px 25px 8px 50px;color:#d84248;background-image:url(/SiteAdmin/images/common/btn_del.png)}
.btn.del:hover,.btn.del:focus{color:#fff;background-color:#d84248;background-image:url(/SiteAdmin/images/common/btn_del_ov.png)}

.btn.write{display:inline-block;border:1px solid #0886cb;padding:8px 25px 8px 50px;color:#0886cb;background-image:url(/SiteAdmin/images/common/btn_write.png)}
.btn.write:hover,.btn.write:focus{color:#fff;background-color:#0886cb;background-image:url(/SiteAdmin/images/common/btn_write_ov.png)}

/* *********************************************************************************
 *	기본 게시판 정의
 *  게시판 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 *  ex) <table class="board"></table>
 * *********************************************************************************/
table.board{width:100%;border-collapse:collapse;border-top:2px solid #555}
table.board tr th,
table.board tr td{padding:8px 2% 10px;border-bottom:1px solid #e1e1e1;text-align:center;font-weight:300}
table.board tr th{color:#222;background:#f7f7f7}
table.board tr td:nth-child(3){text-align:left}
table.board tr td a{color:#555}
table.board tr td a:hover{text-decoration:underline;color:#0886cb}
table.board tr td{}
span.b_new img{width:21px;height:auto;margin:2px 0 0 5px}

table.board.type_1 tr td{vertical-align:middle}
table.board.type_1 tr td:nth-child(2){text-align:left}
table.board.type_1 tr td:nth-child(3){text-align:center}
table.board.type_1 tr td:nth-child(3) a img{margin-top:5px}

/* 파일첨부 게시판 */
table.board.file tr td:nth-child(2){text-align:left}
table.board.file tr td:nth-child(3){text-align:center}

/* 재무정보_김혜원_20170526 */
table.board_01{width:100%;border-collapse:collapse;border-top:2px solid #555}
table.board_01 tr th,
table.board_01 tr td{padding:8px 2% 10px;border-bottom:1px solid #e1e1e1;text-align:right;font-weight:300}
table.board_01 tr th{color:#222; text-align: center; background:#f7f7f7}
table.board_01 tr td a{color:#555}
table.board_01 tr td{}
span.b_new img{width:21px;height:auto;margin:2px 0 0 5px}

.board_view.social_btn .b_tit{width:85%;padding:11px 10% 11px 5%}
.b_tit{position:relative;width:90%;padding:11px 5%;font-weight:400;text-align:left;background:#fafafa;border-top:3px solid #545454;border-bottom:1px solid #d9d9d9;color:#222}
.b_tit .social{position:absolute;top:8px;right:2%}
.board_view .b_info{overflow:hidden}
.board_view .b_info dl{display:table !important; float:left}
.board_view .b_info dl:first-child{width:33.3%}
.board_view .b_info dl:nth-child(2){width:33.3%}
.board_view .b_info dl:last-child{width:33.3%}
.board_view .b_info dl dt{min-width:50px;font-weight:400;width:40%;background:#fafafa;color:#222}
.board_view .b_info dl dd{width:70%}
.board_view .b_info dl dd.br_0{border-right:0}
.board_view .b_info dl dt, .board_view .b_info dl dd{padding:10px 0;text-align:center;display:table-cell !important;vertical-align:middle;border-right:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1}
.board_view .b_contents{padding:20px 5%}
.board_view .b_file{margin-bottom:10px}
.board_view .b_file dl{overflow:hidden;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1}
.board_view .b_file dl dt, .board_view .b_file dl dd{float:left; display:block; padding:10px}
.board_view .b_file dl dt{background:#fafafa;border-right:1px solid #d9d9d9;font-weight:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:25px}
.board_view .b_file dl dt{width:20%;border-right:1px solid #d9d9d9;font-weight:normal;overflow:hidden;text-overflow:ellipsis;white-space: nowrap}
.board_view .b_file dl dd{width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board_view .b_file dl dd a{font-weight:300;color:#555}
.board_view .b_file dl dd a:hover{color:#0886cb;text-decoration:underline}
.board_view .b_page{overflow:hidden}
.board_view .b_page{border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1}
.board_view .b_page dl:first-child{overflow:hidden;border-bottom:1px solid #d9d9d9}
.board_view .b_page dl dt{padding-left:25px}
.board_view .b_page dl dt img{margin:8px 0 0 10px}
.board_view .b_page dl dt, .board_view .b_page dl dd{float:left;padding:10px 0 10px 25px}
.board_view .b_page dl dt{width:15%;font-weight:bold;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0886cb;font-weight:300}
.board_view .b_page dl dd{width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board_view .b_page dl dd a{font-weight:300;color:#555}
.board_view .b_page dl dd a:hover{color:#0886cb;text-decoration:underline}

.paging{margin-top:40px;text-align:center}
.paging a{display:inline-block;width:34px;height:34px;line-height:34px;margin-bottom:4px;text-align:center;border:1px solid #e2e2e2;color:#555;font-weight:normal;font-size:0.875em}
.paging a:hover,.paging a:focus{color:#fff;background:#555}
.paging strong{display:inline-block;width:36px;height:36px;line-height:36px;margin-bottom:4px;background:#0886cb;text-align:center;color:#fff;font-weight:normal;font-size:0.875em}
.paging a.prev,
.paging a.next{width:36px;height:36px;border:0;text-indent:-9999px}
.paging a.prev{background:url(/images/common/board_left_arrow.gif) center no-repeat}
.paging a.next{background:url(/images/common/board_right_arrow.gif) center no-repeat}

/* *********************************************************************************
 *	기본 table 정의
 *  표 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 *  ex) <table class="tbl type_01"></table>
 * *********************************************************************************/
.tbl{width:100%;border-collapse:collapse;border-top:2px solid #555}
.tbl tr th,.tbl tr td{border-bottom:1px solid #e1e1e1;vertical-align:middle;padding:8px 2%}
.tbl tr th{background:#f7f7f7;color:#222;text-align:center;font-weight:400}
.tbl tr th span.point{color:#df4f01}
.tbl tr td{color:#777}

.tbl.type_1 tr th, .tbl.type_1 tr td{text-align:center;font-size:0.9375em}
.tbl.type_1 tr td:first-child{text-align:left}
.tbl.type_1.empty tr td{text-align:center}

.tbl.type_2 tr th,.tbl.type_2 tr td{text-align:center;font-size:0.9375em}
.tbl.type_2 tr td:nth-child(3),.tbl.type_2 tr td:nth-child(4){word-break:break-all}

/* 재무정보표 */
.tbl.type_3 tr th,.tbl.type_3 tr td{border-left:1px solid #e1e1e1}
.tbl.type_3 tr th:first-child,.tbl.type_3 tr td:first-child{border-left:0}
.tbl.type_3 tr td{text-align:right}
.tbl.type_3 tr td:first-child{text-align:center}
.tbl.type_3 tfoot tr td{background:#ecf0f4;font-weight:normal;color:#222}

/* 연혁표 */
.tbl.type_4{border-top:1px solid #d8d8d8}
.tbl.type_4 tr th{background:#fff;border-top:2px solid #00509c;border-bottom:0;color:#00509c;font-size:2em;font-weight:bold;vertical-align:top;text-align:left}
.tbl.type_4 tr td{border-bottom:0;font-size:0.975em;padding:4px 2%;vertical-align:top}
.tbl.type_4 tr td:first-of-type{text-align:center;font-weight:bold}

/* 부동산개발표 */
.tbl.type_5 tr th,.tbl.type_5 tr td{border-left:1px solid #e1e1e1}
.tbl.type_5 tr th:first-child,.tbl.type_5 tr td:first-child{border-left:0}
.tbl.type_5 tr td{text-align:center}

.tbl.type_6 tr th,.tbl.type_6 tr td{border-left:1px solid #e1e1e1}
.tbl.type_6 tr th:first-child,.tbl.type_6 tr td:first-child{border-left:0}
.tbl.type_6 tr td{text-align:right}
.tbl.type_6 tr td:first-of-type{text-align:center}
.tbl.type_6 tbody .sum td{color:#222;font-weight:normal}
.tbl.type_6 tfoot tr td{background:#ecf0f4;font-weight:normal;color:#222}
.tbl.type_6.span tr td:first-child{border-left:1px solid #e1e1e1}

/* 주가정보표 */
.tbl.type_7{margin-bottom:20px}
.tbl.type_7 tr th,.tbl.type_7 tr td{border-left:1px solid #e1e1e1}
.tbl.type_7 tr th:first-child,.tbl.type_7 tr td:first-child{border-left:0}
.tbl.type_7 tr td{text-align:right}
.tbl.type_7 tr td:nth-child(-n+2){text-align:center}
.tbl.type_7 .bl td{color:#0886cb}

/* 인사제도표 */
.tbl.type_8{border-top:1px solid #e1e1e1}
.tbl.type_8 tr th,.tbl.type_8 tr td{border-right:1px solid #e1e1e1}
.tbl.type_8 tr th:first-child,.tbl.type_8 tr td:first-child{border-left:0}
.tbl.type_8 tr td{text-align:center}
.tbl.type_8 tr:first-child th:first-child{border-left:1px solid #e1e1e1;background:#ecf0f4;font-weight:normal;color:#222}

/* 생산설비 - 공정설명 */
.tbl.type_9 tr th{border-left:1px solid #e1e1e1}
.tbl.type_9 tr th:first-child{border-left:0}
.tbl.type_9 tr td{border-left:1px solid #e1e1e1;text-align:right}
.tbl.type_9 tr td:first-of-type{text-align:center}
.tbl.type_9 tr.blur{background:url(/images/common/bg_pat.gif)}
.tbl.type_9 tr.blur td{color:#ccc}

/* 생산설비 - 공정설명 */
.tbl.type_10 tr th{border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1;}
.tbl.type_10 tr td{border-left:1px solid #e1e1e1;text-align:center; border-right:1px solid #e1e1e1; padding:5px 3px !important;}
.backs{background:url("/images/sub/table_line_bg.png")#f7f7f7 center no-repeat  !important; background-size: 100% 100%; text-align: left !important;}
.backs div{text-align: right !important;}



/* *********************************************************************************
 *	기본 폼 정의
 *  폼 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 * *********************************************************************************/
input[type="text"], textarea{border:1px solid #e7e7e7;padding:3px 2%;font-size:0.875em}
select{border:1px solid #e7e7e7}
input[type="checkbox"]{border:1px solid #e7e7e7;vertical-align:middle;margin-right:8px}

/* 인풋(파일) 스타일
    ex)<div class=".filebox">
         <input type="text" class="fileName">
         <label for=".." class=".btn_file">
         <input type="file">
       </div>
*/
.fileBox{width:49.54347826086957%;margin-top:5px}
.fileBox:first-of-type{margin-top:0}
.fileBox .fileName {display:inline-block;width:100%;margin-right:2%;vertical-align:middle}
/*.fileBox .btn_file {display:inline-block;padding:4px 0;border:1px solid #ccc;width:30%;font-size:0.8em;text-align:center;vertical-align:middle;background:#ebebeb;color:#777}
.fileBox input[type="file"] {position:absolute;width:1px;height:1px;paddinG:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}*/
.fileBox.type_1{width:100%}
.fileBox.type_1 .file_label{display:inline-block;width:32%;min-width:238px}
.fileBox.type_1 .fileName{width:50%;margin-right:1%}
.fileBox.type_1 .btn_file{width:15%}
/* *********************************************************************************
 *	기본 tab 정의
 *  탭 스타일이 바뀌면 type_01, type_02 등으로 class 추가 작성
 *  ex) <ul class="tab"><li>메뉴1</li></ul>
 * *********************************************************************************/
.tab{width:100%;overflow:hidden;position:relative}
.tab>li{box-sizing:border-box;width:50%;float:left;border-top:1px solid #999;border-bottom:1px solid #999;border-right:1px solid #999}
.tab>li:first-child{border-left:1px solid #999}
.tab>li>a{overflow:hidden;height:45px;line-height:45px;position:relative;display:block;color:#999;text-align:center}
.tab>li>a:after{content:"";box-sizing:border-box;display:block;width:100%;height:45px;border:1px solid #999;position:absolute;top:0;left:0;transition:all .3s;opacity:0}
.tab>li>a:hover:after{border-width:5px;opacity:1}
.tab>li>a.on{height:35px;line-height:35px;border:5px solid #00509c;color:#00509c;font-weight:bold;transition:none}
.tab>li>a.on:after{display:none}
.tab>li>div{width:100%;position:absolute;left:0;height:auto}

/* *********************************************************************************
 *	포토갤러리 style
 * *********************************************************************************/

/*.tabPhoto{width:100%;overflow:hidden;position:relative}
.tabPhoto>li{box-sizing:border-box;width:50%;float:left;border-top:1px solid #999;border-bottom:1px solid #999;border-right:1px solid #999}
.tabPhoto>li:first-child{border-left:1px solid #999}
.tabPhoto>li>a{overflow:hidden;height:45px;line-height:45px;position:relative;display:block;color:#999;text-align:center}
.tabPhoto>li>a:after{content:"";box-sizing:border-box;display:block;width:100%;height:45px;border:1px solid #999;position:absolute;top:0;left:0;transition:all .3s;opacity:0}
.tabPhoto>li>a:hover:after{border-width:5px;opacity:1}
.tabPhoto>li>a.on{height:35px;line-height:35px;border:5px solid #00509c;color:#00509c;font-weight:bold;transition:none}
.tabPhoto>li>a.on:after{display:none}
.tabPhoto>li>div{width:100%;position:absolute;left:0;height:auto}*/

.tabPhoto{width:100%;overflow:hidden;position:relative}
.tabPhoto>li{box-sizing:border-box;width:33.333%;float:left;}
.tabPhoto>li:first-child{}
.tabPhoto>li>a{overflow:hidden;height:45px;line-height:45px;position:relative;display:block;color:#999;text-align:center;border:1px solid #999;}
.tabPhoto>li>a:after{content:"";box-sizing:border-box;display:block;width:100%;height:45px;border:1px solid #999;position:absolute;top:0;left:0;transition:all .3s;opacity:0}
.tabPhoto>li>a:hover:after{border-width:5px;opacity:1}
.tabPhoto>li>a.on{height:35px;line-height:35px;border:5px solid #00509c;color:#00509c;font-weight:bold;transition:none}
.tabPhoto>li>a.on:after{display:none}
.tabPhoto>li>div{position:relative; min-width:915px;left:0; float:left; border:none !important;}

/* *********************************************************************************
 *	기본 input style 정의
 * *********************************************************************************/
/* 셀렉트박스 */
.selbox{width:180px;padding:.6em .5em;font-family:inherit;background: url(/images/common/selbox_arrow.png) no-repeat 95% 50%;border:1px solid #e7e7e7;-webkit-appearance:none;-moz-appearance:none;font-size:0.9375em}

/* *********************************************************************************
 *	마진 정의
 * *********************************************************************************/
.mt5{margin-top:5px}
.mt10{margin-top:10px}
.mt15{margin-top:15px}
.mt20{margin-top:20px}
.mt25{margin-top:25px}
.mt30{margin-top:30px}
.mt35{margin-top:35px}
.mt40{margin-top:40px}
.mt45{margin-top:45px}
.mt50{margin-top:50px}

.mb5{margin-bottom:5px}
.mb10{margin-bottom:10px}
.mb15{margin-bottom:15px}
.mb20{margin-bottom:20px}
.mb25{margin-bottom:25px}
.mb30{margin-bottom:30px}
.mb35{margin-bottom:35px}
.mb40{margin-bottom:40px}
.mb45{margin-bottom:45px}
.mb50{margin-bottom:50px}

.ml5{margin-left:5px}
.ml10{margin-left:10px}
.ml15{margin-left:15px}
.ml20{margin-left:20px}
.ml25{margin-left:25px}
.ml30{margin-left:30px}
.ml35{margin-left:35px}
.ml40{margin-left:40px}
.ml45{margin-left:45px}
.ml50{margin-left:50px}

.mr5{margin-right:5px}
.mr10{margin-right:10px}
.mr15{margin-right:15px}
.mr20{margin-right:20px}
.mr25{margin-right:25px}
.mr30{margin-right:30px}
.mr35{margin-right:35px}
.mr40{margin-right:40px}
.mr45{margin-right:45px}
.mr50{margin-right:50px}

.board_btn{float:right; margin-top:20px;}