/* 공통 > 페이징 */
.board-pagination {margin-top: 50px; text-align: center;}
.board-pagination-list {font-size: 0;}
.board-pagination-list > li {display: inline-block; vertical-align: middle; font-size: 0;}
.board-pagination-list > li > * {display: block; width: 42px; height: 42px; line-height: 42px; text-align: center; font-size: 16px; font-weight: 300; color: var(--color-999); background: var(--color-f1);}
.board-pagination-list > li.active > * {font-weight: 400; color: var(--white-color); background: var(--navy-color);}
.board-pagination-list > .num ~ .num {margin-left: 5px;}

.board-pagination-list > li.first {margin-right: 5px;}
.board-pagination-list > li.prev {margin-right: 12px;}
.board-pagination-list > li.next {margin-left: 12px;}
.board-pagination-list > li.last {margin-left: 5px;}
.board-pagination-list > li.i > * {background-repeat: no-repeat; background-position: center center;}
.board-pagination-list > li.first > * {background-image: url('../img/ico_first.png');}
.board-pagination-list > li.prev > * {background-image: url('../img/ico_prev.png');}
.board-pagination-list > li.next > * {background-image: url('../img/ico_next.png');}
.board-pagination-list > li.last > * {background-image: url('../img/ico_last.png');}

/* 목록 > 상단(카테고리, 검색) */
.board-util {display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 12px;}
.board-category {}
.board-category select {min-width: 180px;}
.board-category-list {display: flex; gap: 10px;}
.board-category-button {padding: 14px 25px; font-size: 16px; font-weight: 400; color: var(--color-666); text-align: center; border: 1px solid var(--color-ccc);}
.board-category-button.active {background: var(--navy-color); border: 1px solid var(--navy-color); color: var(--white-color);}
.board-search {}
.board-search-wrap {}
.board-search-inner {font-size: 0;}
.board-search-item {display: inline-block; vertical-align: middle;}
.board-search-item:not(:last-child) {margin-right: 8px;}
.board-search-select {min-width: 160px;}
.board-search-input {display: inline-block; vertical-align: middle; width: 220px;}
.board-search-button {display: inline-block; vertical-align: middle; width: 50px; height: 50px; background: var(--color-ccc) url('../img/ico_search.png') no-repeat center center; border: none; font-size: 0;}

.board-info {display: none; margin-bottom: 8px; margin-top: 15px;}
.board-info-text {font-size: 18px; font-weight: 400; color: var(--color-666);}
.board-info-text b {color: var(--navy-color);}

/* 목록 > 하단(버튼) */
.board-btns {position: absolute; right: 0; bottom: 30px;}

/* 목록 > 텍스트 게시판 */
.board-list {}
.board-list-tbl {table-layout: fixed; width: 100%; border-top: 1px solid var(--black-color);}
.board-list-tbl thead {border-bottom: 1px solid var(--black-color);}
.board-list-tbl th {position: relative; height: 60px; padding: 10px; font-size: 18px; font-weight: 700; color: var(--color-333);}
.board-list-tbl tbody tr {position: relative; border-bottom: 1px solid var(--color-eee); border-left: 2px solid transparent;}
.board-list-tbl tbody tr:hover {border-left: 2px solid var(--navy-color);}
.board-list-tbl td {position: relative; height: 60px; padding: 10px; font-size: 17px; font-weight: 300; color: var(--color-666); text-align: center;}
.board-list-tbl tr.notice {background: var(--color-f7);}
.board-list-tbl td.period {font-size: 15px;}

.board-list-tbl td.title {display: flex; align-items: center; padding-left: 30px; padding-right: 30px; text-align: left;}
.board-list-tbl td.title a {position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.board-list-tbl .category {flex: none; margin-right: 13px; padding: 4px 12px 3px; font-size: 16px; font-weight: 300; color: var(--navy-color); border: 1px solid var(--navy-color); border-radius: 15px; transition: 0.1s;}
.board-list-tbl .file {flex: none; width: 15px; height: 17px; margin-left: 7px; margin-bottom: 1px; background: url('../img/ico_file.png') no-repeat center center/contain; font-size: 0;}
.board-list-tbl td.title a:hover {color: var(--navy-color); font-weight: 500; text-decoration: underline;}
.board-list-tbl td.title .category:hover {background: var(--navy-color); color: var(--white-color); text-decoration: none;}
.board-list-tbl th:not(:last-child):after, 
.board-list-tbl td:not(:last-child)::after {content:""; position: absolute; right: 0; top: 50%; width: 1px; height: 12px; margin-top: -6px; background: var(--color-b6);}

.board-list-tbl .status {display: inline-block; width: 80px; height: 30px; line-height: 30px; font-size: 16px; font-weight: 300; text-align: center; background: var(--navy-color); color: var(--white-color); border-radius: 15px;}
.board-list-tbl .status.end {background: var(--color-666); color: var(--white-color);}
.board-list-tbl .status.ready {background: var(--color-eee); color: var(--color-666);}

/* 목록 > 갤러리 게시판 */
.gallery-wrap {padding-top: 25px; border-top: 1px solid var(--black-color);}
.gallery-list {margin: -30px -16.5px; font-size: 0;}
.gallery-item {display: inline-block; vertical-align: top; width: 25%; padding: 30px 16.5px;}
.gallery-inner {}
.gallery-thumb {display: block; position: relative; width: 100%; height: 0; padding-bottom: 65.5%; overflow: hidden;}
.gallery-thumb img {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; object-fit: cover; transition: 0.2s;}
.gallery-content {padding-top: 25px; text-align: right;}
.gallery-title {display: block; font-size: 18px; font-weight: 400; color: var(--black-color); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gallery-date {display: inline-block; position: relative; padding-left: 24px; margin-top: 10px; font-size: 17px; font-weight: 400; color: var(--color-666); text-align: right;}
.gallery-date::before {content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; background: url('../img/ico_clock.png') no-repeat center center/contain;}
.gallery-thumb:hover img {transform: translate(-50%,-50%) scale(1.1);}
.gallery-thumb:hover + .gallery-content .gallery-title,
.gallery-title:hover {color: var(--navy-color); font-weight: 500; text-decoration: underline;}

/* 목록 > FAQ 게시판 */
#faq_list .board-category {width: 100%;}
#faq_list .board-category-list {justify-content: center; flex-wrap: wrap;}

.faq-wrap {}
.faq-list {border-top: 1px solid var(--black-color);}
.faq-item {font-size: 0; border-bottom: 1px solid var(--color-eee);}
.faq-question {display: flex; padding: 15px 0; cursor: pointer;}
.faq-icon {position: relative; width: 150px; font-size: 16px; font-weight: 500; color: var(--color-666); text-align: center;}
.faq-icon::after {content:""; position: absolute; right: 0; top: 4px; width: 1px; height: 12px; background: var(--color-b6);}
.faq-question .faq-icon {margin-top: 5px;}
.faq-text {display: flex; align-items: flex-start; width: calc(100% - 150px); padding: 0 40px;}
.faq-question-text {position: relative; padding-right: 135px;}
.faq-question-text::after {content:""; position: absolute; right: 103px; top: 10px; width: 11px; height: 11px; background: url('../img/ico_plus.png') no-repeat center center/contain;}
.faq-question-category {display: inline; margin-right: 13px; padding: 4px 12px; font-size: 16px; font-weight: 300; color: var(--navy-color); border: 1px solid var(--navy-color); border-radius: 15px; transition: 0.1s;}
.faq-question-category:hover {background: var(--navy-color); color: var(--white-color);}
.faq-question-name {padding-top: 2px; font-size: 17px; font-weight: 300; color: var(--color-333); line-height: 1.5;}
.faq-answer {display: none; padding: 35px 0 30px; border-top: 1px solid var(--color-eee); background: var(--color-f5);}
.faq-answer-inner {display: flex; }
.faq-answer-text {}
.faq-answer-content {font-size: 16px; font-weight: 300; color: var(--black-color); line-height: 1.45;}

.faq-item.active .faq-question {position: relative;}
.faq-item.active .faq-question::before {content:""; position: absolute; left: 0; top: 0; width: 2px; height: 100%; background: var(--navy-color);}
.faq-item.active .faq-question-text::after {background-image: url('../img/ico_minus.png');}

/* 상세 > 공통 */
.board-view {}
.board-view-title {padding: 25px 30px; font-size: 20px; font-weight: 600; color: var(--black-color); line-height: 1.5; border-top: 1px solid var(--black-color); border-bottom: 1px solid var(--color-888);}
.board-view-title span {display: inline-block; vertical-align: top; margin-right: 30px; padding: 4px 12px 3px; font-size: 16px; font-weight: 300; color: var(--white-color); line-height: 1.4; background: var(--navy-color); border-radius: 15px;}

.board-view-info {padding: 22px 30px; border-bottom: 1px solid var(--color-ccc);}
.board-view-info-list {margin: 0 -17px; overflow: hidden;}
.board-view-info-item {display: inline-block; vertical-align: middle; float: left; padding: 0 17px;}
.board-view-info-item.right {float: right;}
.board-view-info-item > * {display: inline-block; vertical-align: middle;}
.board-view-info-title {margin-right: 35px; font-size: 16px; font-weight: 600; color: var(--black-color);}
.board-view-info-text {font-size: 16px; font-weight: 400; color: var(--black-color);}

.board-view-content {padding: 35px; min-height: 400px; font-size: 17px;}

.board-view-file {display: flex;}
.board-view-file-head {width: 150px; padding: 15px; background: var(--color-444); font-size: 14px; font-weight: 400; color: var(--white-color); text-align: center;}
.board-view-file-body {width: calc(100% - 150px); padding: 12px 45px; border: 1px solid var(--color-ccc);}
.board-view-file-body a {display: inline-block; font-size: 14px; font-weight: 400; color: var(--black-color);}
.board-view-file-item ~ .board-view-file-item {margin-top: 3px;}

.board-view-foot {margin-top: 17px; text-align: right; font-size: 0;}
.board-view-btn {display: inline-block; line-height: 50px; text-align: center;}
.board-view-btn:not(:last-child) {margin-right: 10px;}

.board-view.reply {margin-top: 30px;}
.board-reply-title {margin-bottom: 10px; font-size: 24px; font-weight: 700;}

.board-ctrl {margin-top: 50px; border-top: 1px solid var(--color-ccc);}
.board-ctrl-page {position: relative; padding: 15px 15px 15px 87px; border-bottom: 1px solid var(--color-ccc);}
.board-ctrl-page::before {content:""; position: absolute; left: 52px; top: 50%; width: 15px; height: 8px; margin-top: -4px; background-repeat: no-repeat; background-position: center center; background-size: contain;}
.board-ctrl-page.prev::before {background-image: url('../img/ico_brd_prev.png');}
.board-ctrl-page.next::before {background-image: url('../img/ico_brd_next.png');}
.board-ctrl-page-link {font-size: 14px; font-weight: 400; color: var(--black-color);}

/* 상세 > 설문조사 게시판 */
.survey-wrap {}
.survey-head {background: var(--color-f7); padding: 25px 105px;}
.survey-head-total {position: relative; padding-left: 33px; font-size: 18px; font-weight: 400; color: var(--color-666);}
.survey-head-total::before {content: ''; position: absolute; bottom: 0; left: 0; width: 25px; height: 25px; border-radius: 50%; background: var(--navy-color) url('../img/ico_graph.png') no-repeat center center;}
.survey-head-total span {font-weight: 700; color: var(--navy-color);}
.survey-head-period {padding-top: 6px; font-size: 18px; font-weight: 500; color: var(--color-666);}
.survey-head-period span {padding-left: 10px; color: var(--color-333);}
.survey-body {border: 1px solid var(--color-eee); border-top: none;}
.survey-body-item {padding: 35px 105px 29px; border-bottom: 1px solid var(--color-f1);}
.survey-body-item:last-child {border-bottom: none;}
.survey-body-top {display: flex; align-items: flex-start; padding-bottom: 20px;}
.survey-body-num {flex: none; padding: 6px 12px; margin-right: 14px; border-radius: 16px; background-color: var(--black-color); font-size: 15px; font-weight: 400; color: var(--white-color);}
.survey-body-question {padding-top: 3px; font-size: 18px; font-weight: 400; color: var(--color-333);}
.survey-body-bottom {}
.survey-body-bottom .radio-wrap,
.survey-body-bottom .check-wrap {font-size: 0; margin: 0 -20px -10px;}
.survey-body-bottom .radio-item,
.survey-body-bottom .check-item {display: inline-block; vertical-align: top; padding: 0 20px;}
.survey-body-bottom .radio-wrap input[type=radio] + label,
.survey-body-bottom .check-wrap input[type=checkbox] + label {line-height: 2.625;}
.survey-body-bottom .radio-wrap input[type=radio]+ label:before, 
.survey-body-bottom .check-wrap input[type=checkbox] + label:before {top: 8px;}
.survey-body-bottom .etc-item {}
.survey-body-bottom .etc-hidden {display: inline-block; vertical-align: top; margin-left: 15px;}
.survey-body-bottom .input-wrap {}
.survey-body-bottom .input-wrap input[type=text] {width: 100%; height: 42px; padding: 0 20px; border: 1px solid var(--color-ddd); border-radius: 5px;}
.survey-foot {display: flex; align-items: center; justify-content: center; gap: 0 15px; margin-top: 50px;}

.pop-wrap .survey-head {padding: 38px 28px}
.pop-wrap .survey-body {border: none;}
.pop-wrap .survey-body-item {padding-left: 40px; padding-right: 40px;}
.survey-result-wrap {margin: -10px;}
.survey-result-item {padding: 10px;}
.survey-result-head {display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px;}
.survey-result-name {font-size: 16px; font-weight: 300; color: var(--color-333);}
.survey-result-num {font-size: 16px; font-weight: 400; color: var(--color-333);}
.survey-result-num span {color: var(--red-color);}
.survey-result-bar {display: flex; position: relative; height: 32px; border: 1px solid var(--color-e5); border-radius: 16px; box-shadow: inset 2px 0 10px rgba(0,0,0,0.05); overflow: hidden;}
.survey-result-bar span {position: absolute; top: 0; left: 0; height: 100%; background-color: var(--red-color);}
.survey-result-text {padding: 20px 22px; border-radius: 10px; border: 1px solid var(--color-d9); font-size: 15px; font-weight: 300; color: var(--color-333);}

/* 상세 > 비밀글 */
.board-secret {padding: 50px 0; text-align: center;}
.board-secret-img {}
.board-secret-txt {margin-top: 50px; font-size: 20px; font-weight: 500; color: var(--color-666);}
.board-secret-btn {margin-top: 35px;}

/* 작성 */
.board-write {}
.board-write-list {border-top: 1px solid var(--black-color);}
.board-write-item {border: 1px solid var(--color-ccc); border-top: none;}
.board-write-inner {display: flex;}
.board-write-head {width: 330px; padding: 30px 60px; font-size: 20px; font-weight: 600; color: var(--black-color); background: var(--color-f5); border-right: 1px solid var(--color-ccc);}
.board-write-head span {font-weight: 400;}
.board-write-head span b {font-weight: 400; color: var(--red-color);}
.board-write-body {width: calc(100% - 330px); padding: 17px 20px;}
.board-write-body .radio-wrap {padding-top: 12px;}
.board-write-body .radio-item:not(:last-child) {margin-right: 25px;}
.board-write-body .d-textarea {height: 400px;}

.file-add-btn {}
.file-list {}
.file-item {margin-top: 10px;}
.file-item ~ .file-item {margin-top: 5px;}
.file-txt {display: inline; vertical-align: top; margin-right: 10px; font-size: 16px; font-weight: 400; color: var(--black-color); line-height: 1.8;}
.file-del {display: inline; vertical-align: top; padding: 5px 15px; font-size: 16px; font-weight: 400; color: var(--white-color); background: var(--red-color); border: none; border-radius: 5px;}

.board-write-btns {margin-top: 35px; text-align: right; font-size: 0;}
.board-write-btn {display: inline-block; vertical-align: middle;}
.board-write-btn:not(:last-child) {margin-right: 10px;}


/***************************************************************/
/**************************** 반응형 ****************************/
/***************************************************************/

@media screen and (max-width: 1800px) {
}

@media screen and (max-width: 1440px) {
  /* 목록 > 하단(버튼) */
  .board-btns {position: relative; right: inherit; bottom: inherit; margin-top: 15px;}
  .board-btns .borad-btn {margin-left: auto;}

  /* 목록 > 텍스트 게시판 */
  .board-list-tbl th {height: 55px; font-size: 16px;}
  .board-list-tbl td {height: 55px; padding: 5px; font-size: 15px;}
  .board-list-tbl td.title {padding-left: 20px; padding-right: 20px;}
  .board-list-tbl td.period {font-size: 12px;}
  .board-list-tbl .category {margin-right: 10px; padding: 4px 8px; font-size: 14px; line-height: 1.3;}
  .board-list-tbl .status {width: auto; height: auto; padding: 4px 8px; font-size: 14px; line-height: 1.3;}

  /* 목록 > 갤러리 게시판 */
  .gallery-list {margin: -25px -10px;}
  .gallery-item {width: 33.3333%; padding: 25px 10px;}

  /* 목록 > FAQ 게시판 */
  .faq-question-text {padding-right: 80px;}
  .faq-question-text::after {right: 35px;}

  /* 상세 > 공통 */
  .board-view-title {padding: 20px;}

  .board-view-info {padding: 20px;}
  .board-view-info-title {margin-right: 25px;}

  .board-view-content {padding: 30px 20px;}
  
  /* 상세 > 설문조사 게시판 */
  .survey-head {padding: 20px 50px;}
  .survey-body-item {padding: 30px 50px;}

  /* 상세 > 비밀글 */
  .board-secret {padding: 20px 0 50px;}

  /* 작성 */
  .board-write-head {width: 257px; padding: 22px 24px; font-size: 18px; text-align: center;}
  .board-write-body {width: calc(100% - 257px); padding: 14px 24px;}
  .board-write-body input[type="text"] {height: 41px;}
  .board-write-body .radio-wrap {padding-top: 7px;}
}

@media screen and (max-width: 1024px) {
  /* 공통 > 페이징 */
  .board-pagination {margin-top: 40px;}

  /* 목록 > 상단(카테고리, 검색) */
  .board-category-button {padding: 12px 15px;}

  .board-search-button {width: 45px; height: 45px;}

  /* 목록 > 텍스트 게시판 */
  .board-list-tbl {display: block; width: 100%;}
  .board-list-tbl thead {display: none;}
  .board-list-tbl tbody {display: block; width: 100%;}
  .board-list-tbl tbody tr {display: block; width: 100%; border-left: none; border-bottom: 1px solid var(--black-color);}
  .board-list-tbl tbody tr:hover {border-left: none;}
  .board-list-tbl td {position: relative; display: block; width: 100%; height: auto; padding: 10px 15px 10px 165px; color: var(--color-333); text-align: left; border-top: 1px solid var(--color-e5);}
  .board-list-tbl td::before {content:attr(data-th); position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 150px; height: 100%; color: var(--color-666); text-align: center; border-right: 1px solid var(--color-e5);}
  .board-list-tbl th:not(:last-child):after, .board-list-tbl td:not(:last-child)::after {display: none;}
  .board-list-tbl td.title {display: block; padding: 10px 15px 10px 165px;}
  .board-list-tbl td.title a {display: block; color: var(--color-333);}
  .board-list-tbl .category, 
  .board-list-tbl td.title a.category {display: inline-block; margin-right: 0; border-radius: 5px;}
  .board-list-tbl .file {display: none;}
  .board-list-tbl td.period {font-size: 15px;}
  .board-list-tbl td.period br {display: none;}
  .board-list-tbl .status {border-radius: 5px;}

  /* 목록 > 갤러리 게시판 */
  .gallery-list {margin: -20px -8px;}
  .gallery-item {padding: 20px 8px;}
  .gallery-content {padding-top: 15px;}
  .gallery-title {font-size: 16px;}
  .gallery-date {margin-top: 5px; font-size: 15px;}

  /* 목록 > FAQ 게시판 */
  .faq-icon {width: 100px;}
  .faq-text {width: calc(100% - 100px); padding: 0 25px;}
  .faq-question-text {padding-right: 60px;}
  .faq-question-text::after {right: 30px;}
  
  /* 상세 > 공통 */
  .board-view-title {font-size: 18px;}
  .board-view-title span {margin-right: 15px; font-size: 15px; border-radius: 5px;}
  .board-view-info-title {margin-right: 10px;}

  .board-view-file-body {padding: 12px 20px;}

  .board-ctrl-page {padding: 15px 15px 15px 50px;}
  .board-ctrl-page::before {left: 20px;}
  
  /* 상세 > 설문조사 게시판 */
  .survey-head {padding: 20px;}
  .survey-body-item {padding: 25px 20px;}
  .survey-body-bottom .radio-wrap, 
  .survey-body-bottom .check-wrap {margin: 0 -15px -10px;}
  .survey-body-bottom .radio-item, 
  .survey-body-bottom .check-item {padding: 0 15px;}

  .pop-wrap .survey-head {padding: 20px;}
  .pop-wrap .survey-body-item {padding-left: 20px; padding-right: 20px;}
  
  /* 작성 */
  .board-write-head {width: 180px;}
  .board-write-body {width: calc(100% - 180px);}
  .survey-body-top {padding-bottom: 10px;}
}

@media screen and (max-width: 768px) {
  /* 공통 > 페이징 */
  .board-pagination {margin-top: 30px;}
  .board-pagination-list > li > * {width: 28px; height: 28px; line-height: 28px; font-size: 14px;}
  .board-pagination-list > .num ~ .num {margin-left: 3px;}
  .board-pagination-list > li.first {margin-right: 3px;}
  .board-pagination-list > li.prev {margin-right: 3px;}
  .board-pagination-list > li.next {margin-left: 3px;}
  .board-pagination-list > li.last {margin-left: 3px;}
  
  /* 목록 > 상단(카테고리, 검색) */
  .board-util {flex-direction: column-reverse; align-items: flex-start; gap: 8px;}
  .board-category {width: 100%;}
  .board-category select {width: 100%;}
  .board-category-list {gap: 5px;}
  .board-category-button {padding: 8px 12px; font-size: 14px;}
  .board-search {width: 100%; padding: 15px; background: var(--color-f5); border: 1px solid var(--color-ddd); border-radius: 8px;}
  .board-search-inner {display: flex; flex-wrap: wrap;}
  .board-search-item {/*width: calc(100% - 188px);*/ flex: auto;}
  .board-search-item:not(:last-child) {/*width: 180px;*/ flex: 1;}
  .board-search-select {width: 100%; min-width: 100px;}
  .board-search-input {width: calc(100% - 45px); min-width: auto !important;}

  /* 목록 > 하단(버튼) */
  .board-btns {margin-top: 10px;}
  .board-btns .borad-btn {width: 100px; height: 40px; line-height: 40px;}

  /* 목록 > 텍스트 게시판 */
  .board-list-tbl td {padding: 10px 10px 10px 130px; font-size: 14px;}
  .board-list-tbl td::before {width: 120px;}
  .board-list-tbl td.title {padding: 10px 10px 10px 130px;}
  .board-list-tbl td.period {font-size: 14px;}
  .board-list-tbl .status {font-size: 13px;}
  .board-list-tbl .category, .board-list-tbl td.title a.category {font-size: 13px;}
  
  /* 목록 > 갤러리 게시판 */
  .gallery-list {margin: -15px -5px;}
  .gallery-item {width: 50%; padding: 15px 5px;}
  .gallery-content {padding-top: 12px;}
  .gallery-date {margin-top: 3px; font-size: 14px;}

  /* 목록 > FAQ 게시판 */
  .faq-icon {width: 60px;}
  .faq-text {width: calc(100% - 60px); padding: 0 15px;}
  .faq-question-category {margin-right: 8px; padding: 4px 8px; border-radius: 5px; font-size: 13px;}
  .faq-question-name {font-size: 15px;}
  .faq-question-text {padding-right: 35px;}
  .faq-question-text::after {right: 15px; top: 7px;}
  .faq-answer {padding: 20px 0;}
  .faq-answer-content {font-size: 14px;}
  
  /* 상세 > 공통 */
  .board-view-title {padding: 15px; font-size: 16px;}
  .board-view-title span {padding: 3px 8px; margin-right: 10px; font-size: 14px;}

  .board-view-info {padding: 12px 15px;}
  .board-view-info-list {display: flex; flex-wrap: wrap; margin: 0 -10px; /*gap: 3px;*/}
  .board-view-info-item {/*display: inline-flex; width: 100%;*/ padding: 0 10px;}
  .board-view-info-title {margin-right: 5px; font-size: 14px;}
  .board-view-info-text {font-size: 14px;}

  .board-view-content {min-height: 320px; padding: 20px 15px; font-size: 15px;}

  .board-view-file-head {width: 120px;}
  .board-view-file-body {width: calc(100% - 120px); padding: 11px 15px;}

  .board-view-foot {margin-top: 10px;}
  .board-view-btn {line-height: 45px;}
  .board-view-btn:not(:last-child) {margin-right: 5px;}

  .board-view.reply {margin-top: 20px;}
  .board-reply-title {margin-bottom: 8px; font-size: 20px;}
  
  /* 상세 > 설문조사 게시판 */
  .survey-head {padding: 15px;}
  .survey-body-item {padding: 15px;}
  .survey-head-total {font-size: 16px;}
  .survey-head-total::before {width: 23px; height: 23px; background-size: 50%;}
  .survey-head-period {font-size: 16px;}
  .survey-body-top {flex-direction: column; padding-bottom: 12px;}
  .survey-body-num {margin-right: 0; padding: 5px 10px; font-size: 13px;}
  .survey-body-question {width: 100%; padding-top: 5px; font-size: 16px;}
  .survey-body-bottom .radio-wrap input[type=radio] + label, 
  .survey-body-bottom .check-wrap input[type=checkbox] + label {line-height: 2.5;}
  .survey-body-bottom .radio-wrap input[type=radio]+ label:before, 
  .survey-body-bottom .check-wrap input[type=checkbox] + label:before {top: 6px;}
  .survey-body-bottom .etc-item input[type=radio] + label, 
  .survey-body-bottom .etc-item input[type=checkbox] + label {line-height: 3;}
  .survey-body-bottom .etc-item input[type=radio]+ label:before, 
  .survey-body-bottom .etc-item input[type=checkbox] + label:before {top: 11px;}
  .survey-body-bottom .radio-wrap, 
  .survey-body-bottom .check-wrap {margin: 0 -10px -5px;}
  .survey-body-bottom .radio-item, 
  .survey-body-bottom .check-item {display: block; padding: 0 10px;}
  .survey-body-bottom .input-wrap {margin-top: 5px;}
  .survey-body-bottom .etc-hidden .input-wrap {margin: 0;}
  .survey-foot {gap: 5px; margin-top: 30px;}

  .pop-wrap .survey-head {padding: 15px;}
  .pop-wrap .survey-body-item {padding-left: 15px; padding-right: 15px;}
  .survey-result-head {padding-bottom: 3px;}
  .survey-result-wrap {margin: -7px;}
  .survey-result-item {padding: 7px;}
  .survey-result-name {font-size: 14px;}
  .survey-result-num {font-size: 14px;}
  .survey-result-bar {height: 20px;}
  .survey-result-text {padding: 15px; font-size: 14px;}

  /* 상세 > 비밀글 */
  .board-secret {padding: 0;}
  .board-secret-img img {width: 80px;}
  .board-secret-txt {margin-top: 20px; font-size: 18px;}
  .board-secret-btn {margin-top: 30px;}
  
  /* 작성 */
  .board-write-item {border: 1px solid var(--color-d9);}
  .board-write-item ~ .board-write-item {margin-top: 10px;}
  .board-write-inner {flex-direction: column;}
  .board-write-head {width: 100%; padding: 12px; font-size: 16px; border-right: none;}
  .board-write-body {width: 100%; padding: 12px;}
  .board-write-body input[type="text"] {width: 100%;}
  .board-write-body .radio-wrap {padding-top: 0;}
  .board-write-body .d-textarea {height: 250px;}

  .file-item {margin-top: 7px;}
  .file-item ~ .file-item {margin-top: 3px;}
  .file-txt {font-size: 14px;}
  .file-del {padding: 5px; font-size: 14px;}

  .board-write-btns {margin-top: 30px; text-align: center;}
  .board-write-btn:not(:last-child) {margin-right: 5px;}
}

@media screen and (max-width: 480px) {
  /* 공통 > 페이징 */
  .board-pagination {margin-top: 20px;}
  .board-pagination-list > li > * {width: 22px; max-width: 100%; height: 22px; line-height: 22px; background: none;}
  .board-pagination-list > .num ~ .num {margin-left: 0;}
  .board-pagination-list > li.first, 
  .board-pagination-list > li.prev, 
  .board-pagination-list > li.next, 
  .board-pagination-list > li.last {width: 15px; margin: 0;}

  .board-search {padding: 10px;}
  .board-search-inner {flex-direction: column; gap: 8px;}
  .board-search-item:not(:last-child) {margin-right: 0;}
  
  /* 목록 > 하단(버튼) */
  .board-btns .borad-btn {width: 80px; height: 35px; line-height: 35px;}
  
  /* 목록 > 텍스트 게시판 */
  .board-list-tbl td {padding: 10px 10px 10px 90px;}
  .board-list-tbl td::before {width: 80px;}
  .board-list-tbl td.title {padding: 10px 10px 10px 90px;}
  
  /* 목록 > 갤러리 게시판 */
  .gallery-list {margin: -12px 0;}
  .gallery-item {width: 100%; padding: 12px 0;}
  .gallery-content {padding-top: 10px;}
  
  /* 목록 > FAQ 게시판 */
  .faq-icon {width: 45px;}
  .faq-text {display: block; width: calc(100% - 45px);}
  .faq-question {padding: 15px 0 10px;}
  .faq-question .faq-icon {margin-top: 3px;}
  .faq-question-category {display: inline-block;}
  .faq-question-text::after {top: 5px;}
  .faq-answer {padding: 15px 0;}
  
  /* 상세 > 공통 */
  .board-view-file {flex-direction: column;}
  .board-view-file-head {width: 100%; padding: 12px 10px;}
  .board-view-file-body {width: 100%; padding: 10px 10px;}

  .board-reply-title {font-size: 18px;}

  .board-ctrl {margin-top: 30px;}
  .board-ctrl-page {padding: 12px 10px 12px 38px;}
  .board-ctrl-page::before {left: 15px; width: 12px;}
  
  /* 상세 > 설문조사 게시판 */
  .survey-head-period {padding-top: 10px; font-size: 15px;}
  .survey-head-period span {display: block; padding: 0;}
  .survey-body-top {padding-bottom: 8px;}
  .survey-body-bottom .etc-hidden {display: block !important; margin: 3px 0 0;}
  .survey-body-bottom .radio-wrap input[type=radio] + label, 
  .survey-body-bottom .check-wrap input[type=checkbox] + label {line-height: 2.3;}
  .survey-body-bottom .radio-wrap input[type=radio]+ label:before, 
  .survey-body-bottom .check-wrap input[type=checkbox] + label:before {top: 6px;}
  .survey-body-bottom .etc-hidden .input-wrap {width: 100%;}


  /* 상세 > 비밀글 */
  .board-secret-img img {width: 60px;}
  .board-secret-txt {margin-top: 10px; font-size: 17px;}
  .board-secret-btn {margin-top: 15px;}
  
  /* 작성 */
  .board-write-head {padding: 10px; font-size: 15px;}
  .board-write-body {padding: 10px;}
  .board-write-body .d-textarea {height: 200px;}
}