﻿@charset "UTF-8";
/********************************************************************************** 게시판 기능 공통 CSS **/
/*카테고리 (category), 요소 정리 */
#select-btn01 {width:50px; padding: 0 8px; font-size: 17px; color: #fff;}

._mojList ._tab {display: none;}
._mojList .artclCategory {margin-bottom: 60px; border: 1px solid #d9dee2; background-color: #f7f7f7; overflow: hidden; box-sizing: border-box;}
._mojList .categoryNavig {float: left;}
._mojList .categoryNavig .allList {display: table; height: 60px;}
._mojList .categoryNavig .allList a {display: table-cell; width: 90px; padding: 0 20px; vertical-align: middle; text-align: center;
    background: url('../images/category_title_bg.png') left top repeat; box-sizing: border-box;
    font-size: 15px; font-weight: 400; color: #fff; 
}

._mojList .artclCategory .cate {float: left; width: calc(100% - 90px); height: 60px; padding: 18px 20px; overflow-x: auto; box-sizing: border-box;}
._mojList .artclCategory .cate ul.categoryList {white-space: nowrap;}
._mojList .artclCategory .cate ul.categoryList > li {display: inline;}
._mojList .artclCategory .cate ul.categoryList > li > a {position: relative; display: inline-block; padding: 0 20px; color: #555; }
._mojList .artclCategory .cate ul.categoryList > li > a:after {content: ''; display: inline-block; position: absolute; top: 6px; right: 0; width: 1px;height: 12px; background-color: #dbdbdb;}
._mojList .artclCategory .cate ul.categoryList > li:last-child > a:after {display: none;}
._mojList .artclCategory .cate ul.categoryList > li.active > a {color: #2460db; font-weight: 400;}

/* notice */
._artclTdNum ._artclNnotice {width: 27px; height: 27px; margin: 0 auto; text-indent: -5000px;
    background: url('../images/notice_icon.png') left top no-repeat;
}
._mojList ._artclTdAtchFile .fileIcon {width: 22px; height: 23px; margin: 0 auto; text-indent: -5000px;
    background: url('../images/file_icon.png') left top no-repeat;    
}
._mojList ._artclTdAtchFile .fileIcon.none {display: none;}

/* 말머리 */
._mojList ._artclTdTitle .head {display: inline-block; vertical-align: top; color: #555; font-size: 17px; font-weight: 500; margin-right: 8px;}

/* progress */
.progress p {display: table-cell;width: 70px; height: 30px; color: #fff; font-weight: 300; vertical-align: middle; background-color: #225683;}
.progress p.ing {background-color: #ef6070;} /* 진행중, 추진중 */
.progress p.fin {background-color: #2c4b8d;} /* 접수 완료, 완료 */
.progress p.cancel {background-color: #9b9b9b;} /* 취소 */
.progress p.cancel2 {background-color: #e1974f;} /* 취하 */
.progress p.del {background-color: #5a6873;} /* 삭제 */
.progress p.noti {background-color: #509377;} /* 통지 */


/*** 목록 화면 (_mojList) **************************************/
/*상단 검색영역 : rss,count,search */
._mojList .artclSerch {overflow: hidden;padding: 20px 16px;margin-bottom: 32px; border: 1px solid #d1e2e7; background-color: #edf1f5;}
._mojList .artclSerch .fnLeft {position: relative;}
._mojList .artclSerch .fnRight:after {content:''; display:block; clear:both;}
._mojList .artclSerch .artclPeriod {float: left; margin-right: 8px;}
._mojList .artclSerch .artclPeriod label,
._mojList .artclSerch .artclPeriod input[type="text"],
._mojList .fnDiv .fnSearch fieldset select,
._mojList .fnDiv .fnSearch fieldset input[type="text"] {
    color: #555; font-size: 17px; border: 1px solid #c3c2c2; line-height: 40px; height: 40px; box-sizing: border-box; display: inline-block; vertical-align: middle;
    padding: 0 8px 0 5px; margin-right:4px; background-color:#fff;
}

._mojList .fnDiv .fnSearch fieldset select option {font-size: 15px;}
._mojList .artclSerch .artclPeriod label {padding: 0 5px 0 10px; margin-right: -5px; border-right: 0; line-height: 40px; background-color: #fff;}
._mojList .artclSerch .artclPeriod input[type="text"] {max-width: 150px; margin-left: -1px; border-left: 0; background: #fff url('../images/artclPeriod_icon.png') calc(100% - 8px) center no-repeat; font-size:17px;}
._mojList .artclSerch .fnSearch {float: left;}

._mojList .fnDiv .fnSearch fieldset .fnSubmit{width: 50px; height: 40px; border-radius: 0; background-color: #1d1d1d; margin-left: 0; line-height: 40px; color: #fff; outline-offset: 2px;}

.rssBox {margin-bottom: 8px;}
._mojList .rss {z-index: 2; position: relative;}
._mojList .rss > a {border: 0; background: none; padding: 0; width: 30px; height: 30px; line-height: 30px; margin-right: 7px;}
._mojList span.data_num {font-size:15px;}
._mojList span.data_num strong {font-size:15px; font-weight: 700; color: #2460db;}
._mojList ._sysRss{
    width: 10px; height: 30px; line-height: 30px;
    text-indent: -5000px;
    background: url('../images/rss.png') left top no-repeat;
}

._mojList .cateSelDiv {text-align: left;}
._mojList .cateSelDiv  label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0;
    overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap;
}
._mojList .cateSelDiv select { color: #555; font-size: 17px; border: 1px solid #c3c2c2; line-height: 40px; height: 40px; box-sizing: border-box; display: inline-block; vertical-align: middle; padding: 0 0 0 5px;}
._mojList .cateSelDiv input[type=submit] { height: 40px !important; background-color: #1d1d1d !important;}
@media all and (max-width:1024px){ /* tablet */
    ._fnctWrap .fnDiv .fnLeft{float:none; overflow:initial;}
    ._fnctWrap .fnDiv .fnRight{float:none;}
    ._mojList .cateSelDiv{margin-bottom:16px;}
    ._mojList .cateSelDiv select{width: calc(100% - 55px);}
    ._mojList .artclSerch .artclPeriod{float:none; margin-right:0; margin-bottom:16px;}
    ._mojList .artclSerch .fnSearch{float:none; margin-top:0;}
    ._fnctWrap .fnDiv .fnSearch fieldset{float:none;}
    ._mojList .fnDiv .fnSearch fieldset select{width:80px;}
    ._mojList .fnDiv .fnSearch fieldset input[type="text"]{width: calc(100% - 140px);}
}
@media all and (max-width:600px){ /* mobile */
    ._mojList .artclSerch .artclPeriod span{display:block; text-align: center;}
    ._mojList .artclSerch .artclPeriod input[type="text"]{width:calc(100% - 60px); max-width:100%; margin-right:0;}
}

/* 목록 list (table) */
._mojList table.artclTable {border-top: 2px solid #353e4d;}
._mojList table.artclTable tr:hover {background-color: #eef3fa;}
._mojList table.artclTable thead {border-bottom: 1px solid #cfcfd1;}
._mojList table.artclTable thead th {padding: 12px 8px; color: #1d1d1d; font-size:17px; font-weight: 700; background-color: #f8f8f8;}/* 20210917_modify:fontSize_up */
._mojList table.artclTable tbody td {padding: 12px 8px; color: #555; font-size:17px; font-weight: 400; border-bottom: 1px solid #cfcfd1;}/* 20210917_modify:fontSize_up */
._mojList table.artclTable tbody td._artclTdTitle {text-align: left;}
._mojList table.artclTable tbody td._artclTdTitle a {display:block;}
._mojList table.artclTable tbody td._artclTdTitle strong {display: inline-block; max-width: 85%; 
    color: #555; font-size: 17px; vertical-align: middle; line-height: 1.5;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
._mojList table.artclTable tbody td._artclTdTitle a:hover strong,
._mojList table.artclTable tbody td._artclTdTitle a:focus strong
._mojList table.artclTable tbody td._artclTdTitle a:active strong {color:#036;text-decoration:underline;}
._mojList table.artclTable tbody td._artclTdTitle .newArtcl {
    display: inline-block; text-indent: -5000px; width: 15px; height: 19px; background: url('../images/new_icon.png') left center no-repeat; margin-left: 4px; vertical-align: -2px;
}

._mojList table.artclTable colgroup col._artclColNum{width:75px;}
._mojList table.artclTable colgroup col._artclColTitle{width:100%;}
._mojList table.artclTable colgroup col._artclColWriter{width:120px;}
._mojList table.artclTable colgroup col._artclColRdate{width:115px;}
._mojList table.artclTable colgroup col._artclColRecommend{width:80px;}
._mojList table.artclTable colgroup col._artclColComment{width:80px;}
._mojList table.artclTable colgroup col._artclColAtchFile{width:80px;}
._mojList table.artclTable colgroup col._artclColAccess{width:80px;}
._mojList table.artclTable colgroup col.progress{width:130px;}

._mojList table.artclTable.v2 colgroup col.progress{width:130px;}
._mojList table.artclTable.v2 colgroup col._artclColRdate.v2{width:115px;}
/* delete list */
._mojList table.artclTable tbody .trashLi td._artclTdTitle strong {text-decoration: line-through;}
._mojList table.artclTable tbody .trashLi td._artclTdTitle a:before {content: 'DELETE'; display: inline-block; background-color: #ddd; padding: 2px 5px; border-radius: 3px; vertical-align: top; margin-right: 5px;}

@media all and (max-width:800px){ /* mobile */
    ._mojList table.artclTable colgroup{display:none;}
    ._mojList table.artclTable thead{display:none;}
    ._mojList table.artclTable tbody tr{display:block; padding: 12px 0; border-bottom: 1px solid #cfcfd1;}
    ._mojList table.artclTable tbody tr td{display:block; padding:4px 8px; text-align: left; border-bottom:0px none; font-size:15px;}
    ._mojList table.artclTable tbody tr td:before{content:attr(data-label); display:inline-block; width:90px; font-size:15px;}
  
    ._mojList table.artclTable tbody tr td._artclTdTitle:before{display:none;}
    ._mojList table.artclTable tbody td._artclTdTitle strong{font-weight:700; display: -webkit-inline-box; max-width: 95%; -webkit-line-clamp: 2; white-space: normal; -webkit-box-orient: vertical;}
    ._mojList table.artclTable tbody td._artclTdTitle .newArtcl{vertical-align: 2px;}
    ._mojList ._artclTdAtchFile .fileIcon{display: inline-block; margin:0;}
}

/* paging */
._paging {margin: 24px 0; padding: 0;}
._paging ._inner{overflow:visible;}
._paging ._inner a, ._paging ._inner strong {width: 35px; height: 35px; line-height: 35px; margin: 0;}
._paging ._inner ul {height: 35px; margin: 0 10px;overflow:visible;}
._paging ._inner ul li strong {background-color: #117DBA; border: 0;}
._paging ._inner > a {margin: 0 5px; box-sizing: border-box; border: 1px solid #c3c2c2; background-color: #fff; background-image: url('../images/page_arrow.png') !important;}
._paging ._inner ul li{margin: 0 5px;}
._paging ._inner ul li a {border: 0; color: #555; font-size: 17px;}
._paging ._inner ._pageState span{padding: 0 4px; font-size:17px;}
._paging ._inner ._pageState span._curPage{color:#d50136;}


/*** 상세 화면 (_mojView) **************************************/
/* -- View -- */
._mojView .dataInfo {border-top: 2px solid #353e4d;}
._mojView .dataInfo .titleWrap {overflow: hidden; padding: 16px 24px; background-color: #f8f8f8; box-sizing: border-box; border-bottom: 1px solid #dfdfdf;}
._mojView .dataInfo .titleWrap h2 {float: left; font-size: 17px; font-weight:700; line-height: 1.5; color: #1d1d1d;}
._mojView .dataInfo .titleWrap .cate {float: left;position: relative;border-radius: 3px 0 0 3px; display: block; color: #fff; font-size: 15px; font-weight: 400; background: #054780; padding: 3px 10px 2px; margin: 0 30px 0 0;}
._mojView .dataInfo .titleWrap .cate:after {content: ''; position: absolute; top: 0; right: -14px; width: 14px; height: 27px; background: url('../images/cate_bg.png') right top no-repeat; background-size:cover;}
._mojView .dataInfo .infor:after{content:''; display:block; clear:both;}
._mojView .dataInfo .infor dl {float: left; display: table; min-height: 50px; width: 50%; border-bottom: 1px solid #dfdfdf;}
._mojView .dataInfo .infor dt, ._mojView .dataInfo .infor dd {display: table-cell; vertical-align: middle;}
._mojView .dataInfo .infor dt {width: 25%; min-width:80px; text-align: center; background-color: #f8f8f8; border-right: 1px solid #dfdfdf;}
._mojView .dataInfo .infor dd {padding: 0 16px;}
._mojView .dataInfo .infor dl:nth-child(2n) dt {border-left: 1px solid #dfdfdf;}
._mojView .artclView {min-height: 220px; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #b2b2b2; margin-top: -1px; padding: 24px 32px; box-sizing: border-box;}
._mojView .fileList {padding: 24px; border-bottom: 1px solid #6a6a6a;}
._mojView .fileList ul li {position: relative; margin: 8px 0; font-size: 17px;}
._mojView .fileList ul li:before {content: ''; display: inline-block; width: 17px; height: 18px; margin-right: 4px; vertical-align: middle;
    background: url('../images/file_view_icon.png') left top no-repeat;
}
._mojView .fileList ul li a{color:#555;}
._mojView .fileList ul li span.view.button {display: inline-block; margin: 5px 0 0 10px; border-bottom: 2px solid #d9d9d9;}
._mojView .fileList ul li span.view.button a{color:#fff;}

@media all and (max-width: 600px) {
    ._mojView .dataInfo .titleWrap {padding: 20px 16px;}
    ._mojView .dataInfo .infor{padding: 16px;}
    ._mojView .dataInfo .infor dl {float: none; display: inline-block; width: auto; min-height: auto; border-bottom: 0; margin-right: 5px;}
    ._mojView .dataInfo .infor dl:nth-child(2n) dt {border-left: 0;}
    ._mojView .dataInfo .infor dt {display: inline; width: auto; border-right: 0; background-color: #fff;}
    ._mojView .dataInfo .infor dt:after {content: ':'; display: inline-block; margin: 0 3px;}
    ._mojView .dataInfo .infor dd {display: inline; width: auto; padding: 0;}

    ._mojView .artclView {padding: 40px 16px;}
	._mojView .artclView img {width: 100% !important;}
    
    ._mojView .fileList {padding: 16px;}
}

/* 이전글/다음글 이동 */
._mojView .artclNaviInfo {display: none;}
._mojView .artclNavi { border-top: 1px solid #dfdfdf; margin-bottom: 60px;}
._mojView .artclNavi .artclForm {width: 100%; height: 50px; border-bottom: 1px solid #dfdfdf;}
._mojView .artclNavi .artclForm dt, ._mojView .artclNavi .artclForm dd {float: left; height:50px; padding: 12px 16px; font-size: 17px; box-sizing: border-box;}
._mojView .artclNavi .artclForm dt {background-color: #f8f8f8; text-align: center; width: 100px; height: 50px; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; color: #555;}
._mojView .artclNavi .artclForm dd {color: #555; width: calc(100% - 100px);}
._mojView .artclNavi .artclForm dd > div {max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
._mojView .artclNavi .artclForm dd > a{display:block; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color:#555;}
@media all and (max-width:600px){ /* mobile */
    ._mojView .artclNavi {margin-bottom: 24px;}
    ._articleTable .artclNavi .artclForm .artclInsert .artclNaviInfo {display: none;}
    ._articleTable .artclComment .artclCommentList {padding: 1em;}
    ._articleTable .artclComment .artclCommentList li {padding: 0; margin: 0; border-left: 0; border-top: 1px #ccc solid;}
    ._articleTable .artclComment .artclCommentList li:first-child {border-top: 0;}
    ._articleTable .artclComment .artclCommentList li .date {position: relative; left: 0;}
}


/* 공공누리 */
.openWrap div {box-sizing: border-box;}
.openWrap {display: none; overflow: hidden; text-align: center; border: 1px solid #dddee0; border-left: 0; border-right: 0;}
.openWrap .titleArea {float: left; width: 220px;border-right: 1px solid #dddee0;}
.openWrap .title {color: #555; font-size: 17px; font-weight: 400; padding: 14px 0; border-bottom: 1px solid #dddee0; background-color: #f3f5f7;}
.openWrap .title em {color: #1549b3;}
.openWrap .titleArea .content {width: 100%; height: 99px; background: #fbfbfb url('../images/open_title.png') center center no-repeat;}
.openWrap .titleArea .content {text-indent: -5000px;}
.openWrap .grade {float: left; overflow-x: auto; overflow-y: hidden; width: calc(100% - 220px); height: 152px;}
.openWrap .grade ul {width: auto; white-space: nowrap;}
.openWrap .grade ul li {box-sizing: border-box; display: inline-block; width: 220px; margin-left: -3px; border-right: 1px solid #dddee0;}
.openWrap .grade ul li:last-child {border-right: 0;}
.openWrap .grade ul li .content {padding: 20px 0;}
.openWrap .grade ul li .content p {color: #555; font-size: 17px; font-weight: 400;}
.openWrap .grade ul li .content p:before {content: ''; display: block; width: 79px; height: 33px; margin: 0 auto 15px;
    background: url('../images/open_grade.png') left top no-repeat;
}
.openWrap .grade ul li .content.type2 p:before {width: 89px; background-position: -273px top;}
.openWrap .grade ul li .content.type3 p:before {width: 92px; background-position: -544px top;}
.openWrap .grade ul li .content.type4 p:before {width: 106px; background-position: right top;}

.openWrapview .grade {border-top: 1px solid #4b6db3; border-bottom: 1px solid #4b6db3; padding: 16px; box-sizing: border-box;}
.openWrapview .grade:before {content: ''; display: inline-block; width: 79px; height: 33px; margin-right: 20px; vertical-align: middle;
    background: url('../images/open_grade.png') left top no-repeat;
}
.openWrapview .grade a {color: #4b6db3; font-weight: 400; text-decoration: underline;}
.openWrapview .grade {display: none;}
.openWrapview .grade.licenseType2:before {width: 89px; background-position: -273px top;}
.openWrapview .grade.licenseType3:before {width: 92px; background-position: -544px top;}
.openWrapview .grade.licenseType4:before {width: 106px; background-position: right top;}
@media all and (max-width: 600px) {
    .openWrap .titleArea {width:190px;}
    .openWrap .grade {width:calc(100% - 190px);}
    .openWrapview .grade:before {display: none;}
}


/*** 작성 화면 (_mojWrite) **************************************/
/* -- Write  -- */
._mojWrite .writeForm {border-top: 2px solid #353e4d;}
._mojWrite dl.artclForm {width: 50%; float: left; overflow: hidden; display: table; min-height: 50px; border-bottom: 1px solid #dfdfdf;}
._mojWrite .artclForm dt, ._mojWrite .artclForm dd {display: table-cell; height:64px; vertical-align: middle; box-sizing: border-box;}
._mojWrite .artclForm dt {width: 140px; text-align: center; background-color: #f8f8f8; border-right: 1px solid #dfdfdf; padding: 0 5px;}
._mojWrite .artclForm dt label {color: #555; font-size: 17px;}
._mojWrite .artclForm._100per {float: none; width: 100%;}
._mojWrite .artclForm dd {padding: 12px;}
._mojWrite input[type="text"]._full {max-width: 100%;}
._mojWrite input[type="text"],._mojWrite input[type="password"],.hasDatepicker {max-width: 200px; height:40px; padding:0 8px; line-height: 40px; font-size:17px;}
._mojWrite .artclForm dd, ._mojWrite .artclForm dd label {color: #555; font-size: 17px; }
._mojWrite .artclForm dd.artclInsert ul._hor li {line-height: 20px; margin-bottom: 0;}
._mojWrite .artclForm dd.artclInsert ul._hor,
._mojWrite .artclForm dd.artclInsert .intOpt {float: left;}

._mojWrite .artclForm.both {clear:both; padding: 16px 0; box-sizing: border-box; border-bottom: 1px solid #6a6a6a; border-top: 1px solid #b2b2b2; position: relative; top: -1px;}
._mojWrite .artclInsert textarea {width:100%; min-height: 500px; outline-offset:-3px;}

._mojWrite .fileWrap .artclInsert {overflow: hidden;}
._mojWrite .fileWrap {border-bottom: 1px solid #6a6a6a;}
._mojWrite .fileWrap .artclForm dt, ._mojWrite .fileWrap .artclForm dd {border-bottom:0;}
._mojWrite .fileWrap .artclInsert select {float: left; width: 60%; min-height: 130px; padding: 10px; box-sizing: border-box;}
._mojWrite .fileWrap .artclInsert select option{font-size: 15px;}
._mojWrite .fileWrap .file_btn,
._mojWrite .fileWrap .notice {float: left; margin-left: 8px;}
._mojWrite .fileWrap .notice {color: #555; font-size: 17px;}
._mojWrite .fileWrap .file_btn .btn {display: block; margin: 0 0 15px 0;}
._mojWrite .fileWrap .file_btn .btn input[type="button"] {text-align: left; min-width: 145px; font-size: 15px; border: 1px solid #d5d5d5; background: #ececec url('../images/file_btn.gif') 10px 10px no-repeat; padding: 6px 10px 7px 30px;}
._mojWrite .fileWrap .file_btn .btn.del input[type="button"] {background-position: 10px -44px;}
.artclView img {height: auto !important;}
@media all and (max-width:1024px){ /* tablet */
    .artclView img {width: 100% !important;}

    ._mojWrite dl.artclForm,
    ._mojWrite .fileWrap .artclInsert select{float: none; width: 100%;}
    ._mojWrite .fileWrap .file_btn {margin: 10px 0 0 0;}
    ._mojWrite .fileWrap .notice {margin-left: 0;}
}

.slick-header-column.ui-state-default{height:30px; line-height:22px;}
/*--------------------------------------------------------------------- 게시판 기능 공통 CSS End --*/


/*--------------------------------------------------------------------- moj List 기능 CSS --*/
._mojList ._artclTdClsdr p.close,
._mojList ._artclTdClsdr p.open {display: inline-block; width: 16px; height: 21px; background: url('../images/lock.png') center bottom no-repeat; text-indent: -5000px; vertical-align: text-bottom;}
._mojList ._artclTdClsdr p.close {background-position: center top;}


/*--------------------------------------------------------------------- moj List 답변 --*/
._mojAnswerWrap {position: relative; border: 1px solid #d9e0e3; border-top: 1px solid #262625; padding: 15px 30px 0; box-sizing: border-box;}
._mojAnswerWrap:before {content:'답글'; padding-top: 5px; position: absolute; top: 0; left: 30px; width: 36px; height: 33px; text-align: center; color: #fff; font-size: 13px; background: url('../images/answer_icon.png') center top no-repeat; }
._mojAnswerWrap .artclAnswerTitle {color: #333; font-weight: 500; font-size: 16px;}
._mojAnswerWrap .post_info {margin-left: 55px;}
._mojAnswerWrap .post_info .artclAnswerInfo span {color: #777; font-size: 14px;}
._mojAnswerWrap .post_info .artclAnswerInfo span:after {content:''; display: inline-block; width: 1px; height: 10px; background-color: #d7d7d7; margin: 0 5px;}
._mojAnswerWrap .post_info .artclAnswerInfo span:last-child:after {display: none;}
._mojAnswerWrap .artclAnswer {margin: 20px 0 10px; min-height: 140px; background-color: #f2f2f2; padding: 20px; box-sizing: border-box;}

#_popupHeader {margin-top: 20px; height: auto !important; line-height: inherit !important;}
#_popupHeader h1 {float: none !important; font-size: 22px !important; font-weight: 500; line-height: inherit !important; color: #2c2f35; padding: 10px 0 15px 0; background: url('../images/objHeading_h3.png') left top no-repeat;}
.answerPop .button input {border: 0; padding: 5px 20px;}
.answerPop._mojWrite .artclInsert textarea {min-height: 100px;}
