﻿/*@charset "UTF-8";
******************************************************************************** 게시판 기능 공통 CSS **/
body.Mobile .infor {
  padding: 15px;
}
body.Mobile ._mojView .dataInfo .infor dl {
  width: auto !important;
  min-height: auto;
  display: inline-block;
  border-bottom: 0;
  margin-right: 5px;
}
body.Mobile ._mojView .dataInfo .infor dt {
  display: inline;
  width: auto;
  border-right: 0;
  background-color: #fff;
}
body.Mobile ._mojView .dataInfo .infor dt:after {
  content: ':';
  display: inline-block;
  margin: 0 3px;
}
body.Mobile ._mojView .dataInfo .infor dd {
  display: inline;
  width: auto;
  padding: 0;
}





/*category*/
._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;}


/*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;
}

@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;}
}


/* 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: 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 page -- */
/* -- 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: 300; background: #054780; padding: 3px 10px 2px; margin: 2px 30px 0 0;}
._mojView .dataInfo .titleWrap .cate:after {content: ''; position: absolute; top: 0; right: -14px; width: 14px; height: 25px; background: url('../images/cate_bg.png') right top no-repeat;}
._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;}

._mojView .artclAtchImg {display: none;}
._mojView .fileAtchImg {border-top: 1px solid #dfdfdf; margin-top: -1px; padding: 25px 0;}
._mojView .artclAtchImg img {margin: 20px auto; display: block;}
._mojView .fileAtchImg img {margin: 0 auto; display: block;}

@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 .fileList ul li span.view.button {position: absolute; top: 4px; margin-left: 15px;}


/* 이전글/다음글 이동 */
._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 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 .thumbLi:hover {background-color: #eef3fa; box-shadow: 3px 3px 1px 0px rgba(0, 0, 0, 0.1); border: 1px solid #005ec7; border-top: 2px solid #005ec7;}
._mojList .artclInfo .artclTitle {overflow: hidden; vertical-align: top; text-align: left; height: 62px;}

._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: 24px; border-bottom: 1px solid #cccccc; box-sizing: border-box; border: 1px solid #d9d9d9; border-top: 2px solid #353e4d;}
.mojAlbum .thumbLi > a {overflow: hidden; display: block;}
.mojAlbum .thumbLi:nth-child(3n) {margin-right: 0;}

.mojAlbum .thumbLi .thumbnail {margin: 0 auto; height: 209px; overflow: hidden; display: block;}
.mojAlbum .thumbLi .thumbnail img {width: 100%; /*height: 100%;*/ display: block;}
.mojAlbum .thumbLi .artclInfo {display: block; padding: 15px 25px; box-sizing: border-box;}
.mojAlbum .thumbLi .artclInfo span { display:block; }
.mojAlbum .thumbLi .artclInfo .artclContent {display: none;}
.mojAlbum .thumbLi .artclInfo .dataInfo {overflow: hidden; display: block; margin-top:8px;}
.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 dt,
.mojAlbum .thumbLi .artclInfo .dataInfo .file {position: absolute; top: 0; left: 0; text-indent: -5000px;}
.mojAlbum .thumbLi .artclInfo .dataInfo dd {font-size: 15px;}
.mojAlbum .thumbLi .artclInfo .dataInfo .date dd {color: #555;}
.mojAlbum .thumbLi .artclInfo .dataInfo .date dd:after,
.mojAlbum .thumbLi .artclInfo .dataInfo .writer dd:after {
	content: '';
	display: inline-block;
	width: 1px;
	height: 11px;
	background-color: #c3c3c3;
	margin: 0 10px;
}
.mojAlbum .thumbLi .artclInfo .dataInfo .hit dd:before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 11px;
	background: url('../images/hit_icon.png') left top no-repeat;
	margin: 0 5px;
}

/* delete list */
.mojAlbum .thumbLi.trashLi {filter: grayscale(100%);-webkit-filter: grayscale(100%);}


body.Mobile .mojAlbum .thumbLi .thumbnail {height: auto;}


@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;}
}

@media all and (max-width: 600px) { /* mobile */
    .mojAlbum .thumbLi {float: none; width: 100%; margin-right: 0;}
    .mojThumb_list .thumbLi .artclInfo .artclContent {height: auto; max-height: 69px;}
}

/* write 대표이미지 button */
._button._white input, ._button._white a{height:40px; border-radius:0; border-width:0; background: #1E7EB0; color:#fff !important;}

/* 연혁 type 01*/
.historySkin_1 .tab_div_5 {margin-bottom: 80px;}
.historyWrap {display: table; width: 100%; margin-bottom: 40px;}
.historyWrap .year {
	display: table-cell;  vertical-align: top;
	width: 100px;
	font-size: 30px; font-weight: 500; text-align: center;
	border-top: 2px solid #2460db;
	background: url('/sites/moj/images/contents/history_1_year_bg.png') left top no-repeat;
	padding: 18px 0; box-sizing: border-box;
}
.historyWrap .year strong {color: #2460db;}
.historyWrap .substance {
	display: table-cell;
	width: calc(100% - 100px);
	border-top: 2px solid #c4c4c4;
}
.historyWrap .substance dl {
	overflow: hidden;
	border-bottom: 1px solid #ededed;
	padding: 20px 0; box-sizing: border-box;
}
.historyWrap .substance dt {
	float: left; width: 145px;
	color: #666666; font-size: 18px; text-align: center;
}
.historyWrap .substance dd {float: left; width: calc(100% - 145px);}
.historyWrap .substance dd p.em {
	color: #25a1db;
	margin-bottom: 10px;
}