@charset "utf-8";

/*all*/
.boardWrap select,
.boardWrap input[type="text"],
.boardWrap button,
.boardWrap textarea {font-family:'Noto Sans KR', 'Pretendard', sans-serif; }

.boardWrap select,
.boardWrap input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.boardWrap textarea {border: 1px solid #d9dddf; border-radius: 5px; height: 40px; min-width: 0; max-width: 100%;}

.boardWrap textarea {height:190px; padding:10px;}
.boardWrap select {width:120px; font-size:15px; padding: 0 40px 0 10px; appearance: none; background: url('../images/common/select_icon.png') no-repeat 100% 50% #fff;}
.boardWrap button {border:1px solid transparent;}

.boardWrap .highlight {color:#f44242;}

/* btn */
.boardWrap .bdBtn {height:42px; border-radius:6px; text-align:center; line-height:42px; font-size:.95rem; cursor:pointer; transition:all .3s ease-in-out;}
.boardWrap .bdBtn.btnLg {width:90px;} /*25.04.11 수정*/
.boardWrap .bdBtn.btnMd {width:70px;}
.boardWrap .bdBtn.btnSm {width:50px; height:30px; text-align:center; font-size:14px; line-height:30px;}

/* btn style */
.boardWrap .bdBtn.btnBlue {background-color:#0076e4; color:#fff;}
.boardWrap .bdBtn.btnBlue:hover {border:1px solid #222; background-color:#fff; color:#222; transition:all .3s ease-in-out;}
.boardWrap .bdBtn.btnWhite {border:1px solid #ccc; background-color:#fff;}
.boardWrap .bdBtn.btnWhite:hover {border:1px solid #222; color:#222; transition:all .3s ease-in-out;}

/* board list */
.boardListInfo {color:#646464;} /*margin: 70px 0 10px;*/
.boardListInfo .total {color:#0076e4; font-weight:700;}
.boardListInfo .totalPg {color:#000;}

/* 하단 버튼 */
.boardWrap .boardBtnBox ul {display:flex; align-items:center; gap:10px; margin-top:60px;}


/* 테이블 공통 */
.boardWrap .boardBasic {width:100%; border-top:2px solid #222;}
.boardWrap .boardBasic tr {border-bottom:1px solid #E1E1E1;}
.boardWrap .boardBasic th {background-color:#FAFAFA;}
.boardWrap .boardBasic td {line-height: 1.2;}

.boardWrap .boardBasic th,
.boardListBox .boardBasic td {padding:17px 10px; font-size: 1rem;}

.boardWrap .boardBasic.tbRow th {width:20%; padding:17px 20px; font-weight:500;}
.boardWrap .boardBasic.tbRow td {padding:14px 20px;}

.boardWrap .boardBasic td,
.boardListBox .boardBasic td a {color:#484848;}

.boardWrap .boardBasic.tbRow input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) {width:100%; max-width:600px; padding:10px;}

/* board list */
.boardList {margin-top:24px;}
.boardListBox .boardBasic {position:relative; margin-top:13px;}

.boardListBox .boardBasic th,
.boardListBox .boardBasic td {text-align:center;}

.boardListBox .boardBasic .tbTitle a {color:#000; font-weight: 500;}

.boardListBox .notice {color:#0076e4; font-weight:700;}

.boardListBox .boardBasic td.tbTitle {text-align:left;}
.boardListBox .boardBasic .tbTitle .ellipsis {display:inline-block; vertical-align:middle; max-width:80%; line-height:1.4;}

/* 테이블 style2 모바일 테이블 유지*/
.boardWrap .boardTbl {width: 100%; border-top: 2px solid #222;}
.boardWrap .boardTbl tr {border-bottom: 1px solid #E1E1E1;}
.boardWrap .boardTbl th {background-color: #FAFAFA;}
.boardWrap .boardTbl td {line-height: 1.2;}
.boardWrap .boardTbl th,
.boardWrap .boardTbl td {border-right: 1px solid #E1E1E1;}
.boardWrap .boardTbl th:last-child,
.boardWrap .boardTbl td:last-child {border-right: none;}
.boardWrap .boardTbl td,
.boardWrap .boardTbl td a {color: #484848;}

.boardListBox .boardTbl {position:relative; margin-top:13px;}
.boardWrap .boardTbl th,
.boardListBox .boardTbl td {padding: 17px 5px; font-size: 1rem;}
.boardListBox .boardTbl th,
.boardListBox .boardTbl td {text-align: left; text-indent: 15px;}

/* 서브페이지 컨텐츠 테이블 디자인인*/  /*25.04.18 추가*/
.boardCol {border-top: none !important; border: 1px solid #d2dde7 !important;}
.boardCol tr {border-bottom: 1px solid #d2dde7 !important;}
.boardCol th {background-color: #ebf2f7 !important;}
.boardCol th,
.boardCol td {border-right: 1px solid #d2dde7 !important;}

/* 게시글 hover */
.boardListBox .boardBasic tbody tr:hover {background:#f8f8f8;}
.boardListBox .boardBasic tbody .tbTitle:hover a span {text-decoration:underline;}

.boardListBox .boardBasic tbody tr.important {background: #f7f7ff;}

/* 아이콘 */
.boardListBox .ico {display:inline-block; width:18px; height:18px; background-position:center; background-repeat:no-repeat; vertical-align:middle; font-size:0;}
.boardListBox .icoNew {margin-right:4px; background-image:url('../images/board/ico_board_new.png');}
.boardListBox .icoAttach {margin-left:4px; background-image:url('../images/board/ico_board_attach.png');}

/* 하단 버튼 */
.boardListBox .boardBtnBox {display:flex; align-items:center; justify-content:end; margin-top:35px; gap: 10px;}
.boardWrap .boardBtnBox a {display:block;}

/* pagination */
.boardWrap .boardPagerBox {margin-top:30px; text-align:center;}
.boardWrap .boardPagerBox ul {display:flex; align-items:center; justify-content:center; gap:5px;}
.boardWrap .boardPagerBox a {display:block; width:32px; height:32px; text-align:center; line-height:29px;}
.boardWrap .boardPagerBox a.on {border-radius:6px; background-color:#0076e4; color:#fff;}

.boardWrap .boardPagerBox .pgIco {background-position:center; background-repeat:no-repeat; padding:0 13px; font-size:0;}

.boardWrap .boardPagerBox .pgFirst {background-image:url('../images/board/ico_pager_first.png');}
.boardWrap .boardPagerBox .pgPrev {background-image:url('../images/board/ico_pager_prev.png');}
.boardWrap .boardPagerBox .pgNext {background-image:url('../images/board/ico_pager_next.png');}
.boardWrap .boardPagerBox .pgLast {background-image:url('../images/board/ico_pager_last.png');}

/* 검색 */
.boardSearch {display: flex; gap: 14px; justify-content: flex-end;}
.boardSearch .searchForm {display:flex; align-items:center; justify-content:center; gap:10px;}

.boardSearch .searchForm input[type="text"] {padding: 9px 42px 10px 20px;}

.boardSearch #boardSearchKeyword {width:300px;}
.boardSearch .btnSearch {position:absolute; top:50%; right:0; transform:translateY(-50%); width:20px; height:20px; background-image:url('../images/board/ico_board_search.png'); background-color:transparent; background-position:center; background-repeat:no-repeat; padding:22px 20px; cursor:pointer; font-size:0; border-left: 1px solid #c5c9d6;}
.boardSearch .btnSearchKo {border-radius: 5px; height: 2.5rem; background-color: #0076e4; color: #fff; font-size: .95rem; padding: 0 1em; min-width: 5.5rem; border: none;}

.boardSearch + .boardListInfo {margin-top: -17px;}



/* board view */
/* all */
.boardWrap .titleBg {background-color:#FAFAFA;}
.boardViewBox .pad {padding:17px 20px;}
.boardViewBox .bottomLine {border-bottom:1px solid #E1E1E1;}

.boardViewBox .boardData li span,
.boardViewBox .boardAttach a,
.boardViewBox .boardPostMove a {color:#484848;}

.boardViewBox .fileList a:hover,
.boardViewBox .boardPostMove li a:hover {text-decoration:underline;}

/* 상세 */
.boardViewBox .boardTitle {border-top:2px solid #222; padding-top:20px; padding-bottom:20px;}
.boardViewBox .boardTitle h3 {font-size:20px; line-height:1.3;}

.boardViewBox .boardData {display:flex; align-items:center; justify-content:space-between;}
.boardViewBox .boardData .rightArea ul {display:flex; align-items:center; justify-content:flex-end; gap:50px;}
.boardViewBox .boardData li {display:inline-flex; gap:15px;}

.boardWrap .boardCon {padding-top:40px; padding-bottom:70px; color:#646464; line-height:1.5;}

/* 첨부파일 */
.boardViewBox .fileList ul li {position:relative; margin-bottom:12px; padding-left:22px;}
.boardViewBox .fileList ul li::before {content:''; display:block; position:absolute; left:0; top:3px; width:18px; height:18px; background-image:url('../images/board/ico_board_attach.png'); background-position:center; background-repeat:no-repeat;}
.boardViewBox .fileList a {line-height:1.3;}

/* 이전, 다음글 */
.boardViewBox .boardPostMove {border-top:1px solid #222; border-bottom:1px solid #222;}
.boardViewBox .postMove {display:flex; align-items:center; justify-content:flex-start; width:100%;}
.boardViewBox .postMove strong {position:relative; padding-right:25px; font-size:0;}
.boardViewBox .postMove strong::before {content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:10px; height:6px; background-image:url('../images/board/ico_post_prev.png'); background-position:center; background-repeat:no-repeat; }
.boardViewBox .postMove.next strong::before {background-image:url('../images/board/ico_post_next.png');}

.boardViewBox .postMove .postTitle {display:inline-block; width:100%; margin-left:20px;}
.boardViewBox .postMove .ellipsis {max-width:88%; line-height:1.4;}

/* 하단 버튼 */
.boardViewBox .boardBtnBox ul {justify-content:flex-end;}

/* board write */
.boardWriteBox input[type="text"],
.boardWriteBox textarea {width:100%; max-width:unset !important; border-radius:6px;}

.boardWriteBox .boardBasic {width:100%; border-top:2px solid #222;}
.boardWriteBox .boardBasic th {width:20%; font-weight:500;}
.boardWriteBox .boardBasic td {padding:17px 20px;}

/* 하단 버튼 */
.boardWriteBox .boardBtnBox ul {justify-content:end;}

/* 파일첨부 */
.fileAttach .fileTop {display:flex; align-items:center; justify-content:space-between;}
.fileAttach .fileTop .f_r {font-size: .9rem;}
.fileAttach .fileTop .fileCo {font-weight: 600; padding: 0 2px; color: #c01d1d;}

/* 파일버튼 */
.fileAttach .fileAttachBtn {display: inline-block; background-color: #0a6bf0; color: #fff; line-height: 25px; padding: 0 10px; border-radius: 15px; font-size: 12px;}

/* 파일첨부리스트 */
.fileAttach .fileMain {margin-top: 7px; border: 1px solid #c9ceda;}
.fileAttach .fileMain .none {height: 30px; line-height: 30px; padding: 0 10px; color: #ee2d24; font-weight: 500; text-align: center; font-size: 12px;}
.fileAttach .fileMain .fileHeader {background: #ebeef5; height: 35px; line-height: 33px;}
.fileAttach .fileMain .fileHeader .fileLi {display: table; width: 100%;}
.fileAttach .fileMain .fileHeader .fileLi span {display: table-cell; color: #383838; font-weight: 500; font-size: 12px; text-align: center;}
.fileAttach .chkBox {width: 30px;}
.fileAttach .storage {width: 55px;}
.fileAttach .manage {width: 65px;}
.fileAttach .fileList {background-color: #fff;}
.fileAttach .fileList li {overflow: hidden; margin-bottom: 0;}
.fileAttach .fileList .fileLi {display: table; width: 100%; line-height: 2;}
.fileAttach .fileList .fileLi.selected {background: #e1e1e1;}
.fileAttach .fileList li span {display:table-cell; color: #545454; font-weight: 500; font-size: 12px; text-align: center;}
.fileAttach .fileList li span.fileName {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 0; padding: 2px 30px 2px 0; text-align: left; text-indent: 20px;}
.fileAttach .fileList .editA {font-size: 0;}
.fileAttach .fileList .editA img {margin-top: -7px; height: 15px; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden;}
.fileAttach .fileList .delA {font-size: 0;}
.fileAttach .fileList .delA img {margin-top: -7px;}
.fileAttach .fileList .manage a+a {margin-left: 1px;}





/* 반응형*/
@media all and (max-width: 767px) {
   /*all*/
   .boardWrap select {display: none;}

   /* board list */
   .boardWrap {font-size:16px;}
   .boardListBox .boardBasic {border-top:none;}
   .boardListBox .boardBasic colgroup,
   .boardListBox .boardBasic thead {display:none;}
   .boardListBox .boardBasic tbody {display:flex; flex-wrap:wrap; gap:12px;}
   .boardListBox .boardBasic tr {display:flex; flex-wrap:wrap; align-items: center; width:100%; border:1px solid #ccc; border-radius:10px; padding:16px; gap: 5px 5px;}
   .boardListBox .boardBasic td {display:block; padding:0 !important;}

   .boardWrap .boardBasic th,
   .boardListBox .boardBasic td {font-size: 15px;}

   .boardWrap .boardTbl th,
   .boardListBox .boardTbl td {font-size: 15px; padding: 14px 15px; text-indent: 0;}

   .boardListBox .boardBasic .first {margin-right:5px;}
   .boardListBox .boardBasic .tbNum {margin-top:2px;}
   .boardListBox .boardBasic td.tbTitle {padding:10px 0 !important; font-size:18px; font-weight:700;}

   .boardListBox .boardBasic td.tbTitle,
   .boardListBox .boardBasic .tbName,
   .boardListBox .boardBasic .tbDate,
   .boardListBox .boardBasic .last,
   .boardListBox .boardBasic .state {width:100%; text-align:left;}

   .boardListBox .boardBasic td::before {display:inline-block; margin-right:12px;}
   .boardListBox .boardBasic .tbName::before {content:'작성자';}
   .boardListBox .boardBasic .tbDate::before {content:'등록일';}
   .boardListBox .boardBasic .quota::before {content:'모집';}
   .boardListBox .boardBasic .last::before {content:'조회';}

   .boardListBox .boardBasic .tbDate,
   .boardListBox .boardBasic .quota,
   .boardListBox .boardBasic .last {margin-top:10px;}
   .boardListBox .boardBasic .state {margin-top:20px;}

   .boardListBtn {width: 100%; text-align: center; padding: 10px 0}

   /* pagination */
   .boardWrap .boardPagerBox ul {gap:0; font-size:16px;}

   /* board view */
   .boardViewBox .pad {padding-left:10px; padding-right:10px;}
   .boardViewBox .boardData {display:flex; justify-content:flex-start; flex-wrap:wrap;}
   .boardViewBox .boardData > div {width:100%;}
   .boardViewBox .boardData .rightArea ul {justify-content:flex-start; gap:20px; margin-top:14px;}

   .boardViewBox .boardTitle h3 {font-size:18px;}
   .boardViewBox .postMove .postTitle {margin-left:0;}

   /* board write */
   .boardWriteBox .boardBasic th {text-align:left;}
   .boardWriteBox .boardBasic th,
   .boardWriteBox .boardBasic td {display:block; width:100%;}

   .boardWrap .boardBasic.tbRow th,
   .boardWrap .boardBasic.tbRow td {display:block; width:100%;}

   /* 하단 버튼 */
   .boardWrap .bdBtn {height: 42px; line-height: 40px; font-size: 15px;}
   .boardWrap .boardBtnBox ul {flex-wrap: wrap;}

   /* 검색 */
   .boardSearch {display: block; margin-bottom: 30px;}
   .boardSearch .searchForm {display: block;}
   .boardSearch .searchForm input[type="text"] {width: 100%;}

   .boardSearch + .boardListInfo {margin-top: 0;}
}

@media all and (max-width: 640px) {
   .boardList {overflow: scroll;}
   .boardList .boardTbl {width: 592px;}
}

@media all and (max-width: 420px) {
   /* 검색 */
   .boardSearch form,
   .boardSearch .searchForm {width:100%;}

   .boardSearch select {width:40%;}
   /* .boardSearch .inputTxt {width:60%;} */
   .boardSearch #boardSearchKeyword {width:100%;}

   /* 파일첨부 */
   .fileAttach .f_s_15 {font-size:13px !important;}
}