@charset "utf-8";



/* -----------------------------------------------------------------------------------------------
	reset CSS
--------------------------------------------------------------------------------------------------*/




/* -----------------------------------------------------------------------------------------------
	공통
--------------------------------------------------------------------------------------------------*/
body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,a,button,select
{margin:0;padding:0;box-sizing:border-box; letter-spacing:-0.02em;}
.hidden { position:absolute; font-size:0; line-height:0; left:-10000px;}
.f-left {float:left !important;}
.f-right {float:right !important;}
.dis-block {display:block !important;}
.dis-none {display:none !important;}
.text-c {text-align:center !important;}
.text-l {text-align:left !important;}
.text-r {text-align:right !important;}
.vt-t {vertical-align:top !important;}
.vt-m {vertical-align:middle !important;}
.vt-b {vertical-align:bottom !important;}
.bg-none {background:none !important;}
.border-none {border:none !important;}
.clear-fix:after {content:"";display:block;clear:both;}
.bold { font-weight:bold; }
/* ios */
a[x-apple-data-detectors] {
  color:inherit !important;
  text-decoration:none !important;
  font-size:inherit !important;
  font-family:inherit !important;
  font-weight:inherit !important;
  line-height:inherit !important;
  white-space:nowrap;
}
.mt0 { margin-top:0px !important; }
.mt10 { margin-top:10px !important; }
.mt20 { margin-top:20px !important; }
.mt30 { margin-top:30px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }

a {text-decoration:none;}
a:focus {outline:none;}
span, a, em, button {display:inline-block;}
img,fieldset,iframe{border:0;}
img {max-width:100%;vertical-align:top;}
ul, li{list-style:none;}
em,address{font-style:normal;}
input,select,button{vertical-align:middle;}
caption,legend,.blind{overflow:hidden;position:absolute;top:0;left:-9999px;width:0;height:0;font-size:0;line-height:0;text-align:left;}
input[type=text],input[type=password],input[type=email],input[type=tel],input[type=number], select
{width:100%;height:36px;padding:0 10px;border:1px solid #ccc;font-size:16px;color:#333;vertical-align:middle;-webkit-appearance:none;}
input[type=password],input[type=email]{ime-mode:disabled;}
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
select:focus,
textarea:focus{border:1px solid #ccc;}
input[type=file]{width:99.5%;height:30px;border:1px solid #d2d2d2; background:#fff; font-size:14px;}
select{height:36px;padding-left:5px;border:1px solid #ccc;font-size:16px;color:#333;vertical-align:middle;}
textarea{width:100%;padding:10px;border:1px solid #ccc;font-size:16px;color:#333;resize:none;}
table{width:100%;border-collapse:collapse;border-spacing:0;}
table th {font-weight:normal;}
hr{display:none;}
label {cursor:pointer;}



/* -----------------------------------------------------------------------------------------------
	bbs 공통
--------------------------------------------------------------------------------------------------*/
#board-wrap { width:100%; max-width:1200px; margin:0 auto; padding:0 10px; }
/* 버튼 */
.btn-large { display:inline-block; min-width:120px; height:50px; padding:0 40px; font-size:1.12em; border:none; line-height:48px; text-align:center; }
.btn-mid {display:inline-block; min-width:100px; height:40px; padding:0 30px; font-size:1em; border:none; line-height:38px; text-align:center}
.btn-small {display:inline-block; min-width:100px; height:35px; padding:0 25px; font-size:1em; line-height:33px; border:none; text-align:center}
.btn-white { background:#fff; color:#171717; border:1px solid #4d4d4d;}
.btn-white:hover { background:#efefef;}
.btn-grey { background:#666; color:#fff !important; border:1px solid #5b5b5b;}
.btn-grey:hover { background:#444;  }

@media (max-width:767px){
	.btn-large { min-width:80px; height:40px; padding:0 30px; font-size:1.1em; line-height:38px; }
	.btn-mid {min-width:70px; height:35px; padding:0 10px; line-height:35px; font-size:1em;}
	.btn-small {min-width:75px; height:30px; padding:0 10px; line-height:30px; font-size:0.87em;}
}


/* -----------------------------------------------------------------------------------------------
     list
--------------------------------------------------------------------------------------------------*/

/* 검색 부분 */
.search-area { text-align:center; margin-bottom:40px; padding:20px; background:#f7f7f7; border:1px solid #efefef; }
.search-area .selectBox { width:150px; height:46px; background : url(images/select_arrow.png) no-repeat right center ; padding:8px 30px 9px 12px; background-color:#fff;
-webkit-appearance: none; /* 화살표 없애기 for chrome*/
-moz-appearance: none;    /* 화살표 없애기 for firefox*/
appearance: none;         /* 화살표 없애기 공통*/
}
select::-ms-expand {
   display: none;            /* 화살표 없애기 for IE10, 11*/
}
.search-area .input-grp { position:relative; display:inline-block; }
.search-area .inputbox { border:1px solid #ccc; background-color:#fff; width:360px; height:46px; line-height:46px; }
.search-area .bt-search { width:80px; height:46px; line-height:46px; background-color:#666; color:#fff; text-align:center; font-size:16px; vertical-align:middle; }

/* board-list */
.list-wrap { width:100%; }
.board-list { background-color:#fff; padding-bottom:50px; }
.board-list .list-head { display:table; width:100%; border-top:2px solid #333; border-bottom:1px solid #333;}
.board-list .list-head > span { display:table-cell; text-align:center; vertical-align:middle; text-align:center; font-size:15px; color:#333; padding:12px 0 11px;}
.board-list span.num, .board-list span.click{ width:10%;}
.board-list span.date { width:12%;}
.board-list .list-body .rows { display:table; width:100%; border-bottom:1px solid #ccc;}
.board-list .list-body .rows > span { display:table-cell; text-align:center; vertical-align:middle; font-size:14px; padding:21px 0 20px; color:#999;}
.board-list .list-body .rows > span.subject { text-align:left;}
.board-list .list-body .rows > span.subject a { color:#333; font-size:16px;}
.board-list .list-body .rows > span.subject a:hover{ text-decoration:underline;}
.board-list .list-body .rows > span.subject.reply a { margin-left:10px; }
.board-list .list-body .rows > span.subject.reply a:before { content:'[Re]'; color:#e37305; display:inline-block; margin-right:10px; font-weight:bold; }
.board-list .btn-wrap { margin-top:20px; }

/* 업무사례 블럭형 게시판 */
.board-list.caseList .list-head { display:none; }
.board-list.caseList .list-body:after { display:block; clear:both; content:''; }
.board-list.caseList .list-body { width:calc(100% + 20px); margin-left:-10px; }
.board-list.caseList .list-body .rows { display:block; width:50%; float:left; padding:10px; border-bottom:0; }
.board-list.caseList .list-body .rows:nth-child(2n+1) { clear:both; }
.board-list.caseList .list-body .rows .item { border:1px solid #ccc; height:330px; cursor:pointer; padding:30px; position:relative; }
.board-list.caseList .list-body .rows .item:hover { border-color:#111; }
.board-list.caseList .list-body .rows .item > span { display:block; width:100%; }
/*.board-list.caseList .list-body .rows .item > span.date { color:#fff; font-size:15px; background:#006a87; display:inline; padding:3px 5px; }*/
.board-list.caseList .list-body .rows .item > span.subject { color:#111; font-size:28px; letter-spacing:-0.05em; font-weight:500; overflow:hidden; 
text-overflow:ellipsis; -o-text-overflow:ellipsis; word-break:break-all; line-height:1.3em;  max-height:3.9em; display:-webkit-box; -webkit-line-clamp:3; margin-top:7px; }
.board-list.caseList .list-body .rows .item > span.subject img { display:none; }/* new 아이콘 */
.board-list.caseList .list-body .rows .item > span.contents { color:#777; font-size:16px; letter-spacing:-0.035em; overflow:hidden; 
text-overflow:ellipsis; -o-text-overflow:ellipsis; word-break:break-all; line-height:1.5em; max-height:7.5em; display:-webkit-box; -webkit-line-clamp:5; margin-top:10px; }
/* 20201112 */
.board-list.caseList .list-body .rows .item { padding-bottom:50px; }
.board-list.caseList .list-body .rows .item > span.cate { color:#fff; font-size:16px; background:#006a87; display:inline; padding:3px 10px; font-weight:500; border-radius:3px; }
.board-list.caseList .list-body .rows .item > span.date { position:absolute; bottom:0px; right:0px; text-align:right; width:100%; padding-right:30px; padding-bottom:30px; box-sizing:border-box; }


/* paging */
.paging {display:block; position:relative; margin:0; padding:0; text-align:center;}
.paging a {display:inline-block; width:44px; height:44px; border:1px solid #f2f2f2; color:#666; font-size:1.12em; line-height:44px; vertical-align:middle;}
.paging a:hover {background:#efefef; border-color:#ccc; }
.paging a.current {background:#666; color:#fff;}
.paging button  { display:inline-block; width:44px; height:44px; border:1px solid #ccc; vertical-align:middle; text-indent:-9999px; background:url(images/ico_paging.png) no-repeat; cursor:pointer; }
.paging button.pg_first.disable {background-position:-4px -54px; cursor:default;}
.paging button.pg_prev.disable {background-position:-54px -54px; cursor:default;}
.paging button.pg_next.disable {background-position:-54px -54px; cursor:default;}
.paging button.pg_last.disable {background-position:-154px -54px; cursor:default;}
.paging button.pg_first {background-position:-4px -4px;}
.paging button.pg_prev {background-position:-54px -4px;}
.paging button.pg_next {background-position:-104px -4px;}
.paging button.pg_last {background-position:-154px -4px;}


@media all and (max-width:800px){

	/* 업무사례 블럭형 게시판 */
	.board-list.caseList .list-body { width:calc(100% + 20px); margin-left:-10px; }
	.board-list.caseList .list-body .rows { display:block; width:100%; float:none; padding:10px; border-bottom:0; }
	.board-list.caseList .list-body .rows .item { height:auto; }

}


@media all and (max-width:767px){
	/* 검색 부분*/
	.search-area{ text-align:center; margin-bottom:30px; padding:15px;}
	.search-area .selectBox { width:100%; height:30px; padding: 4px 30px 4px 9px;  font-size:1em; }
	.search-area .input-grp {  position:relative; display:block; margin-top:10px; padding-right:35px; }
	.search-area .inputbox { width:100%; height:30px;  font-size:1em; }
	.search-area .bt-search { position:absolute; top:0; right:0; width:30px; height:30px; background:url(images/icon_search.png) no-repeat center center; background-size:16px 16px;
	background-color:#666; text-indent: -9999px; }

	/* board-list */
	.board-list { border-top:2px solid #333; padding-bottom:30px; }
	.board-list .list-head { display:none;}
	.board-list span.num, .board-list span.click,	.board-list span.date { width:auto;}
	.board-list .list-body .rows { position:relative; display:block; width:100%; padding:12px 10px;}
	.board-list .list-body .rows > span { display:inline-block; font-size:13px; padding:0; }
	.board-list .list-body .rows > span.num { display:none;}
	.board-list .list-body .rows > span.subject { display:block; margin-bottom:5px;}
	.board-list .list-body .rows > span.subject a { font-size:15px;}
	.board-list .list-body .rows > span.date { position:relative; padding:0 20px 0 0;}
	.board-list .list-body .rows > span.date:after { content:""; position:absolute; width:1px; height:8px; background:#ccc; top:50%; right:0; margin-top:-4px; display:block;}
	.board-list .list-body .rows > span.click { position:relative; margin-left:20px; }
	.board-list .list-body .rows > span.click:before { content:"조회수"; display:inline-block; padding-right:5px; }
	.board-list .tbl-btm { margin-top:10px; }	

	/* 업무사례 블럭형 게시판 */
	.board-list.caseList .list-body .rows .item { padding:20px; padding-bottom:40px; }
	.board-list.caseList .list-body .rows .item > span.date { font-size:13px }
	.board-list.caseList .list-body .rows .item > span.subject { font-size:18px; }
	.board-list.caseList .list-body .rows .item > span.contents { font-size:14px; line-height:1.5em; max-height:4.5em; display:-webkit-box; -webkit-line-clamp:3; }
	.board-list.caseList .list-body .rows .item > span.date { padding-right:20px; padding-bottom:15px; }

	
	/* paging */
	.paging button {width:34px; height:34px;}
	.paging button.pg_first {display:none;}
	.paging button.pg_last {display:none;}
	.paging button.pg_prev.disable {background-position:-59px -9px;}
	.paging button.pg_next.disable {background-position:-109px -9px;}
	.paging button.pg_prev {background-position:-59px -59px;}
	.paging button.pg_next {background-position:-109px -59px;}
	.paging a {width:34px; height:34px; line-height:34px;}
}


/* -----------------------------------------------------------------------------------------------
	view
--------------------------------------------------------------------------------------------------*/
.board_view { border-bottom:2px solid #333; padding-bottom:20px; margin-bottom:30px; }
.doc_summary { width:100%; padding:20px; border-top:2px solid #333; border-bottom:1px solid #ccc; background:#f9f9f9; }
.doc_summary .title {display:block; color:#171717; font-size:28px; text-align:left; line-height:1.25em; font-weight:500; letter-spacing:-0.05em; }
.doc_summary .writer_date {display:block; text-align:left; font-size:14px; margin-top:10px; }
.doc_summary .writer_date dt { display:inline-block; color:#333;}
.doc_summary .writer_date dt.dt_bar { margin-left:20px; padding-left:21px; position:relative; }
.doc_summary .writer_date dt.dt_bar:before { display:inline-block; position:absolute; content:''; left:0; top:4px; width:1px; height:14px; background:#ccc; }
.doc_summary .writer_date dd {display:inline-block; margin-left:10px; color:#999;}

.print_content { padding:60px 20px; color:#5b5b5b; display:block; word-wrap:break-word; word-break:keep-all !important; }

.attach_file { padding:20px 0; border:1px solid #ccc; font-size:15px; }
.attach_file dl {display:table; width:100%;}
.attach_file dl dt {display:table-cell; width:180px; text-align:center; vertical-align:middle; color:#0d0d0d;}
.attach_file dl dd {display:table-cell; border-left:1px solid #d9d9d9; }
.attach_file dl dd .file {display:inline-block; margin-left:20px; padding-left:30px; background:url(images/icon_file.png) no-repeat left center; min-height:20px;}
.attach_file dl dd a { color:#054cad; }

.cont_list {margin-top:30px; border-top:1px solid #b3b3b3;}
.cont_list dl {display:table; width:100%; border-bottom:1px solid #b3b3b3; }
.cont_list dt {float:left; width:15%; padding-left:20px; background:#f2f2f2; color:#666; font-size:1em; }
.cont_list dt .list_prev {display:block; background:url(images/list_prev.png) no-repeat right center; line-height:49px; }
.cont_list dt .list_next {display:block; background:url(images/list_next.png) no-repeat right center; line-height:49px;}
.cont_list dd {float:left; width:85%; padding-left:20px; line-height:49px;}
.cont_list dd a {color:#666; font-size:1em;}
.cont_list dd a:hover {color:#111; text-decoration:underline;}
.cont_list_s { display:none; }

@media all and (min-width:768px) and (max-width:1150px){
	.doc_summary .writer_date {width:auto;}
	.print_content img {max-width:100%;}
}

@media all and (max-width:767px){
	.board_view  { margin-bottom:10px; }
	
	.doc_summary { padding:15px 10px;}
	.doc_summary .title { width:auto; font-size:1.214em;}
	.doc_summary .writer_date { font-size:12px; }
	.doc_summary .writer_date dd { margin-left:3px; }
	.doc_summary .writer_date dt.dt_bar { margin-left:5px; padding-left:6px; position:relative;  }
	
	.attach_file {padding:0; font-size:14px;}
	.attach_file dl dt { display:block; width:100%; padding-left:10px; line-height:40px; border-bottom:1px solid #ccc;  font-size:1em; text-align:left; }
	.attach_file dl dd {display:block; width:100%; border:none; padding:15px 10px 15px 0; }
	.attach_file dl dd .file { padding-left:25px; margin-left:10px;}
	
	.cont_list {display:none;}
	.cont_list_s { display:block; text-align:center; margin-top:30px;  }
	.btn-prev-list { padding-left:35px; background:url(images/list_prev_m.png) no-repeat left center; border-color:#777; background-color:#f1f1f1; color:#777; font-size:15px; }
	.btn-next-list { padding-right:35px; background:url(images/list_next_m.png) no-repeat right center; border-color:#777; background-color:#f1f1f1; color:#777; font-size:15px;}
	.print_content { padding:50px 15px; }
	.print_content img {display:block; max-width:100%;}
}


/* -----------------------------------------------------------------------------------------------
	write
--------------------------------------------------------------------------------------------------*/
.board_write { width:100%; margin-bottom:20px; }
.board_write .title { display:block; color:#171717; font-size:20px; text-align:left; line-height:1.25em; width:100%; padding-bottom:20px; }
.board_write .write-item { border-top:2px solid #333; display:block; width:100%; font-size:14px; }
.board_write .write-item dl { display:table; width:100%; border-bottom:1px solid #ccc; }
.board_write .write-item dt { display:table-cell;  width:15%;  padding:10px 0 10px 30px; background:#efefef; color:#0d0d0d; font-size:16px; position:relative; vertical-align:middle; }
.board_write .write-item dd { display:table-cell;  padding:10px 25px 9px 25px; }
.board_write .write-item dl.required dt:before { content:'*'; color:#e37305; position:absolute; left:18px; top:50%; margin-top:-10px; font-weight:bold; font-weight:bold; }
.board_write .write-item input[name="user_name"],
.board_write .write-item input[name="email"],
.board_write .write-item input[name="phone"],
.board_write .write-item input[name="display_order"],
.board_write .write-item input[name="notice"]
{ max-width:450px; }

@media all and (max-width:767px){
	.board_write .title { font-size:16px; padding-bottom:10px; }
	.board_write .write-item { font-size:13px; }
	.board_write .write-item dt { width:30%; padding:7px 0 7px 15px; font-size:14px; }
	.board_write .write-item dl.required dt:before { left:5px; }
	.board_write .write-item dl.editer-wrap dt { width:0; font-size:0; text-indent:-99999px; padding:0; }
	.board_write .write-item dl.editer-wrap dd { padding:10px 0; width:100%; }	
}