@charset "UTF-8";
/********************************************************************************* 게시판 기능 공통 CSS **/
/*category*/
._mojList ._tab {display: none;}
._mojList .artclCategory {
    overflow: hidden;
    background-color: #f7f7f7;
    border: 1px solid #d9dee2;
    box-sizing: border-box;
    margin-bottom: 60px;
}
._mojList .categoryNavig {float: left;}
._mojList .categoryNavig .allList {display: table; height: 60px;}
._mojList .categoryNavig .allList a {
    width: 90px;
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    background: url('../images/category_title_bg.png') left top repeat;
    padding: 0 20px;
    box-sizing: border-box;
}

._mojList .artclCategory .cate {
    overflow-x: auto;
    height: 60px;
    width: calc(100% - 90px);
    float: left;
    padding: 18px 20px;
    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;
    color: #555;
    padding: 0 20px;
}
._mojList .artclCategory .cate ul.categoryList > li > a:after {
    content: '';
    position: absolute;
    right: 0;
    top: 6px;
    display: inline-block;
    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;}


/*rss,count,search*/
._mojList .artclSerch {overflow: hidden; padding: 20px 16px; margin-bottom: 32px; border: 1px solid #d1e2e7; background-color: #edf1f5;}
._mojList .artclSerch .fnRight:after {content: ''; display:block; clear:both;}
._mojList .artclSerch .artclPeriod {float: left; margin-right: 10px;}
._mojList .artclSerch .artclPeriod label,
._mojList .artclSerch .artclPeriod input[type="text"],
._mojList .fnDiv .fnSearch fieldset select,
._mojList .fnDiv .fnSearch fieldset input[type="text"] { 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;
}
._mojList .fnDiv .fnSearch fieldset select option {font-size: 13px;}
._mojList .artclSerch .artclPeriod label {border-right: 0; padding: 0 5px 0 10px; margin-right: -5px; line-height: 40px; background: #fff;}
._mojList .artclSerch .artclPeriod input[type="text"] {border-left: 0; background: #fff url('../images/artclPeriod_icon.png') calc(100% - 8px) center no-repeat; max-width: 140px;}
._mojList .artclSerch .fnSearch {float: left;}

._mojList .fnDiv .fnSearch fieldset .fnSubmit,
._mojList .fnDiv .fnSearch fieldset .fnSubmit input {line-height: 40px; height: 40px;}
._mojList .fnDiv .fnSearch fieldset .fnSubmit input {width: 50px; height:40px;
    border-radius: 0; background-color: #1d1d1d; background-image: none;
    font-size:17px !important; text-indent: 0 !important; outline-offset:2px;
} 

._mojList .artclSerch .fnLeft {position: relative; width: 30%; padding:4px;}
.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 {background: none;/* width: 100%; color: #444444; font-size: 14px; font-weight: 300; position: absolute; top: 3px; left: 0; background: url('../images/data_num_icon.png') 12px center no-repeat; padding-left: 40px; */}
._mojList span.data_num strong {color: #2460db;}
._mojList ._sysRss{
    width: 10px; height: 30px; line-height: 30px;
    text-indent: -5000px;
    background: url('../images/rss.png') left top no-repeat;
}
@media all and (max-width:1024px){ /* tablet */
    ._fnctWrap .fnDiv .fnLeft{float:none; overflow:initial;}
    ._fnctWrap .fnDiv .fnRight{float:none;}
    /* ._fnctWrap .fnDiv .fnLeft + .fnRight{margin-top:16px;} */
    ._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;}
}

/* notice */
._artclTdNum ._artclNnotice {
    text-indent: -5000px;
    width: 27px;
    height: 27px;
    background: url('../images/notice_icon.png') left top no-repeat;
    margin: 0 auto;
}
._mojList ._artclTdAtchFile .fileIcon {
    text-indent: -5000px;
    width: 22px;
    height: 23px;
    background: url('../images/file_icon.png') left top no-repeat;
    margin: 0 auto;
}
._mojList ._artclTdAtchFile .fileIcon.none {display: none;}

/* paging */
._paging {margin: 30px 0; padding: 0;}
._paging ._inner{padding:3px; 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;}
._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: #797676; font-size: 16px; outline-offset:-1px;}


/* 공공누리 */
.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: #333333; font-size: 15px; 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: #666666; font-size: 13px; font-weight: 400;}
.openWrap .grade ul li .content p:before {
    content: '';
    width: 79px; height: 33px;
    background: url('../images/open_grade.png') left top no-repeat;
    display: block;
    margin: 0 auto 15px;
}
.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: 20px; box-sizing: border-box;}
.openWrapview .grade:before {
    content: '';
    width: 79px; height: 33px;
    background: url('../images/open_grade.png') left top no-repeat;
    display: inline-block;
	vertical-align: middle;
	margin-right: 20px;
}
.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;}


/* sub_button list */
/* .button_list {overflow: hidden;  position: relative; margin: 60px 0;} */
.button_list .alignL {text-align: left;}
.button_list .alignC {text-align: center;}
.button_list .alignR {text-align: right;}
.button_list .alignL .button	{margin-right: 10px;}
.button_list .alignC .button	{margin-left: 5px; margin-right: 5px;}
.button_list .alignR .button	{margin-left: 10px;}
.button {display: inline-table; vertical-align: top; margin-bottom: 10px; text-align: center;}
.button.re	{margin-bottom: 0;}
.button.type1	{background-color: #1e386e;}
.button.type2	{background-color: #9b9b9b;}
.button.type3	{background-color: #1562a3;}
.button.type4	{background-color: #5a6873;}
.button.type5	{background-color: #4b6db3;}
.button.type6	{background-color: #25a1db;}

.button.big {height: 45px;}
.button.mid {height: 40px; border-bottom: 2px solid #d9d9d9;}
.button.small {height: 25px;}
.button.small.view {height: 22px; vertical-align: bottom; background-color: #4c93b4;}
.button input, .button button {background: none;  height: 100%;}
.button a, .button input, .button button {display: table-cell; color: #FFF; vertical-align: middle; padding: 0 20px; font-size: 14px; position: relative;}
.button.big a, .button.big input, .button.big button {padding: 0; min-width: 120px;}
.button.small a, .button.small input, .button.small button {font-size: 14px;  padding: 0 5px;}
.button.small input, .button.small button	{margin-top: -3px;}
.button.small a.down, .button.small input.down, .button.small button.down	{padding: 0 30px 0 10px;}
.button.mid a.newwindow:after, .button.mid button.newwindow:after,
.button.mid a.gobtn:after, .button.mid button.gobtn:after,
.button.small.view a:after, .button.small.view button:after				{content: ""; position: absolute; top: 50%; right: 20px;}
.button.mid a.newwindow, .button.mid button.newwindow	{padding-right: 45px;}
.button.mid a.gobtn, .button.mid button.gobtn	{padding-right: 55px;}
.button.small.view a:after, .button.small.view button:after	{background: url('../images/button_search.png') left center no-repeat; width: 10px; height: 10px; margin-top: -5px; right: 10px;}
.button.small.view a, .button.small.view input, .button.small.view button	{padding: 0 25px 0 5px; border-bottom: 2px solid #d9d9d9; font-size: 11px; font-weight: 400;}


/* 이전글/다음글 이동 */
._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; font-size: 14px; box-sizing: border-box; padding: 13px 20px;}
._mojView .artclNavi .artclForm dt {background-color: #f6f6f6; color: #222222; text-align: center; width: 100px; height: 50px; border-right: 1px solid #dfdfdf;}
._mojView .artclNavi .artclForm dd {color: #666666; width: calc(100% - 100px);}
._mojView .artclNavi .artclForm dd > div {max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

/* -- View page -- */
._mojView .dataInfo {border-top: 2px solid #353e4d;}
._mojView .dataInfo .titleWrap {overflow: hidden; padding: 16px 30px; background-color: #fafafa; box-sizing: border-box; border-bottom: 1px solid #dfdfdf;}
._mojView .dataInfo .titleWrap h2 {float: left; color: #212121; font-size: 18px; line-height: 1.5; background-color: #fafafa;}
._mojView .dataInfo .titleWrap .cate {float: left;position: relative;border-radius: 3px 0 0 3px; display: block; color: #fff; font-size: 13px; font-weight: 200; background: #054780; padding: 3px 10px 2px; margin: 2px 30px 0 0;}
._mojView .dataInfo .titleWrap .cate:after {
    content: '';
    display: block;
    position: absolute;
    right: -14px;
    top: 0;
    width: 14px;
    height: 25px;
    background: url('../images/cate_bg.png') right top no-repeat;
}
._mojView .dataInfo .infor {overflow: hidden;}
._mojView .dataInfo .infor dl {display: table; min-height: 50px; float: left; 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 {color: #505050; font-size: 14px; width: 19%; text-align: center; background-color: #fafafa; border-right: 1px solid #dfdfdf;}
._mojView .dataInfo .infor dd {color: #9c9c9c; font-size: 13px; padding: 0 20px;}
._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: 25px 30px; box-sizing: border-box;}
._mojView .fileList {padding: 19px 30px; border-bottom: 1px solid #6a6a6a;}
._mojView .fileList ul li {position: relative; color: #868686; font-size: 14px; font-weight: 200; margin: 10px 0;}
._mojView .fileList ul li:before {
    content: '';
    display: inline-block;
    width: 17px;
    height: 18px;
    background: url('../images/file_view_icon.png') left top no-repeat;
    vertical-align: middle;
    margin-right: 5px;
}

._mojView .fileList ul li span.view.button {position: absolute; top: 4px; margin-left: 15px;}

/* -- Write page -- */
._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; min-height:50px; vertical-align: middle; box-sizing: border-box;}
._mojWrite .artclForm dt {width: 130px; text-align: center; background-color: #fafafa; border-right: 1px solid #dfdfdf; padding: 0 5px;}
._mojWrite .artclForm dt label {font-size: 17px;}
._mojWrite .artclForm._100per {float: none; width: 100%;}
._mojWrite .artclForm dd {padding: 10px;}
._mojWrite input[type="text"]._full {max-width: 100%; width:100%;}
._mojWrite input[type="text"],._mojWrite input[type="password"],.hasDatepicker {max-width: 130px; height:34px; line-height:34px; border-radius:8px;}
._mojWrite .artclForm dd, ._mojWrite .artclForm dd label {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; line-height: 2;}

._mojWrite .artclForm.both {clear:both; padding: 8px 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; border-radius:8px;}

._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: 13px;}
._mojWrite .fileWrap .file_btn,
._mojWrite .fileWrap .notice {float: left; margin-left: 10px;}
._mojWrite .fileWrap .notice {font-size: 15px;}
._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: 13px; 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;}

@media all and (max-width:1024px){ /* tablet */
    ._mojWrite .artclForm dt, ._mojWrite .artclForm dd{height:auto;}
    ._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;}
}

/*--------------------------------------------------------------------- 게시판 기능 공통 CSS End --*/

/*--------------------------------------------------------------------- moj Album CSS--*/
/* 관리자 체크박스 */
.deleteArtclSeqs {position: absolute; top: 5px; left: 5px;}


/* 말머리 */
._mojList .artclTitle .head {display: inline-block; vertical-align: top; color: #333; font-size: 18px; font-weight: 500; margin-right: 8px;}

/* list */
._mojList .artclTitle .newArtcl {
    display: inline-block; text-indent: -5000px; width: 15px; height: 19px; background: url('../images/new_icon.png') left 3px no-repeat; margin-left: 5px;
}
._mojList .artclInfo .artclTitle {overflow: hidden; vertical-align: top; text-align: left; height: 62px; margin-bottom:12px;}
._mojList .artclInfo .artclTitle strong:before {
	content: ''; display: block; width: 30px; height: 2px; background-color:#214c92; margin-bottom: 10px;
}
._mojList .artclInfo .artclTitle strong {
    color: #1d1d1d; font-size: 17px;
    /* display: inline-block; max-width: 85%; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; */
}

.mojAlbum:after {content:''; display:block; clear:both;}
.mojAlbum .thumbLi {position: relative; float: left; width: calc((100% - 48px)/3); margin-right: 24px; margin-bottom: 32px; border-bottom: 1px solid #cccccc; box-sizing: border-box; border: 1px solid #d9d9d9; border-top: 2px solid #353e4d;}
.mojAlbum .thumbLi.active {background-color: #eef3fa; box-shadow: 3px 3px 1px 0px rgba(0, 0, 0, 0.1); border: 1px solid #005ec7; border-top: 2px solid #005ec7;}
.mojAlbum .thumbLi > input.deleteArtclSeqs {}
.mojAlbum .thumbLi a { overflow: hidden; display: block;}
.mojAlbum .thumbLi:nth-child(3n) {margin-right: 0;}

.mojAlbum .thumbLi .thumbnail {margin: 0 auto; background-color: #232323;}
.mojAlbum .thumbLi .thumbnail img {width: 100%; /*max-height: 209px;*/ display: block; transition: opacity 0.2s ease;}
.mojAlbum .thumbLi a:hover .thumbnail > img, 
.mojAlbum .thumbLi a:active .thumbnail > img,
._mojList .thumbLi a:focus .thumbnail > img {opacity: 0.5;}
.mojAlbum .thumbLi .thumbnail .shadow_text { display: none; position: absolute; top: 21%; left: calc(50% - 40px); color: #FFF; text-align: center; }
.mojAlbum .thumbLi .thumbnail .shadow_text img { height: auto !important; margin: 0 !important; }
.mojAlbum .thumbLi a:hover .thumbnail .shadow_text, 
.mojAlbum .thumbLi a:active .thumbnail .shadow_text,
.mojAlbum .thumbLi a:focus .thumbnail .shadow_text{ display: inline;}

.mojAlbum .thumbLi .artclInfo { display: block; padding: 15px 25px; box-sizing: border-box;}
.mojAlbum .thumbLi .artclInfo span { display:block; }
.mojAlbum .thumbLi .artclInfo .button.type4{margin-left:0;}
.mojAlbum .thumbLi .artclInfo .artclContent {display: none;}
.mojAlbum .thumbLi .artclInfo .dataInfo {overflow: hidden;}
.mojAlbum .thumbLi .artclInfo .dataInfo em { display: inline-block; font-size: 15px; }
.mojAlbum .thumbLi .artclInfo .dataInfo em b { font-size: 0; line-height: 0; }
.mojAlbum .thumbLi .artclInfo .dataInfo dl {float: left;}
.mojAlbum .thumbLi .artclInfo .dataInfo dd {font-size: 13px;}
.mojAlbum .thumbLi .artclInfo .dataInfo dt,
.mojAlbum .thumbLi .artclInfo .dataInfo .file {display: none;}
.mojAlbum .thumbLi .artclInfo .dataInfo .date:after,
.mojAlbum .thumbLi .artclInfo .dataInfo .writer dd:after {content: ''; display: inline-block; width: 1px; height: 11px; margin: 0 10px; background-color: #c3c3c3;}
.mojAlbum .thumbLi .artclInfo .dataInfo .hit:before {content: ''; display: inline-block; width: 16px; height: 11px; margin: 0 5px; background: url('../images/hit_icon.png') left top no-repeat;	}
@media all and (max-width:1024px){ /* tablet */
    .mojAlbum .thumbLi {width: calc((100% - 24px)/2);}
    .mojAlbum .thumbLi:nth-child(3n) {margin-right: 24px;}
    .mojAlbum .thumbLi:nth-child(2n) {margin-right: 0;}
    ._paging ._inner ._pageState span{padding: 0 4px; font-size: 17px;}
    ._paging ._inner ._pageState span._curPage{color:#d50136;}
}
@media all and (max-width:600px){ /* mobile */
    .mojAlbum .thumbLi {float: none; width: 100%; margin-right: 0;}
}

/* view */
._mojView .artclAtchImg {display: none;}

/*--------------------------------------------------------------------- moj Movie CSS--*/
.btnBox {text-align: center;}
/* 01.03 */
.data_title { display: none !important;}
