@charset "utf-8";
/*공통*/
.board_header {display: flex; justify-content: flex-end; margin-bottom: 30px; width: 100%; padding: 0; box-sizing: border-box;}
.search_bar {display: flex; align-items: center; border: 1px solid #ccc; border-radius: 999px; overflow: hidden; width: 400px; height: 48px; background: #fff; position: relative; box-sizing: border-box;}

.custom_select_wrap {position: relative; display: flex; align-items: center;}
.custom_select_wrap select {appearance: none; -webkit-appearance: none; -moz-appearance: none; border: none; padding: 0 40px 0 20px; font-size: 16px; background: transparent; outline: none; cursor: pointer; height: 48px; font-family: inherit;}
.custom_select_wrap::after {content: ""; position: absolute; width: 6px; height: 6px; right: 12px; top: 50%; transform: translateY(-70%) rotate(45deg); pointer-events: none; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; box-sizing: border-box;}

.search_bar input[type="text"] {flex: 1; border: none; font-size: 16px; padding: 0 20px; outline: none; height: 48px; font-family: inherit; box-sizing: border-box;}
.search_bar button {border: none; background: transparent; padding: 0 16px; cursor: pointer; height: 48px;}

.news_container, .board_container {max-width: 1280px; width: 100%; margin: 0 auto;}

.pagination {display: flex; justify-content: center; align-items: center; margin-top: 30px;}
.pagination button {margin: 0 5px; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; border: none; color: #ccc; border-radius: 8px; cursor: pointer; transition: 0.3s ease;}
.pagination button:hover {background: #298DDE; color: #fff;}
.pagination button img {transition: filter 0.3s ease;}
.pagination button:hover img {filter: brightness(0) invert(1);}
.pagination .active {background: #298DDE; color: #fff; font-weight: bold;}

/*news*/
.news_box {border: 2px solid #6490B4; border-right: none; border-left: none; margin-bottom: 70px;}
.news_item {display: flex; padding: 40px 0; border-top: 1px solid #BDC9D4; cursor: pointer;}
.news_item img {transition: transform 0.3s ease;}
.news_item:hover img {transform: scale(1.03);}
.news_thumbnail {width: 410px; height: 200px; background-color: #f5f5f5; margin-right: 35px; overflow: hidden;}

.news_content {flex: 1;}
.news_title {font-weight: 700; font-size: 24px; margin: 5px 0 25px 0;}
.news_description {font-size: 18px; color: #444; margin-bottom: 25px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.5; max-height: calc(1.5em * 3);}

.news_date {font-size: 16px; color: #666;}

/*gallery*/
.gallery_container {width: 100%; display: flex; justify-content: center; flex-wrap: wrap; gap: 20px;}
.gallery_item {width: 32%; height: 370px; text-align: left; cursor: pointer;}
.gallery_img {width: 100%; height: 260px; border-radius: 20px; display: block; background: #ccc;}
.gallery_item p {font-size: 18px; font-weight: 700; margin-top: 30px; padding-left: 10px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; max-height: calc(1.4em * 2);}

/*board_list*/
.board_container {margin: 0; padding: 0;}

.board_table {width: 100%; border-collapse: collapse; table-layout: fixed; color: #666; font-size: 18px;}

.board_table thead {border-top: 2px solid #6490B4; border-bottom: 1px solid #BDC9D4;}
.board_table thead th {text-align: center; padding: 18px 10px; font-weight: 500;}
.board_table thead th:nth-child(1) {width: 6%;}
.board_table thead th:nth-child(3), .board_table thead th:nth-child(4) {width: 9%;}

.board_table tbody tr {cursor: pointer; transition: 0.3s ease; border-bottom: 1px solid #BDC9D4;}
.board_table tbody tr:hover {background: #f0f2f5;}

.board_table tbody td {text-align: center; padding: 16px 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.board_table tbody td:nth-child(2) {display: flex; justify-content: left; align-items: center; font-weight: 400;}
.board_table tbody td:nth-child(2) img {margin-right: 10px; width: 10px; height: auto;}

.status_pending, .status_complete {padding: 4px 10px; border-radius: 4px; font-size: 14px;}
.status_pending {color: #666; background: #eee;}
.status_complete {color: #fff; background: #2c5f88;}

/*board_view*/
.board_detail_header {border-top: 2px solid #6490B4; border-bottom: 1px solid #BDC9D4; padding: 20px; margin-bottom: 30px;}
.board_title {font-size: 24px; font-weight: bold; margin-bottom: 10px; color: #222;}
.board_info {display: flex; gap: 40px; color: #666; font-size: 16px;}
.board_info li strong {margin-right: 6px;}

.board_detail_content {display: flex; justify-content: center; flex-direction: column; font-size: 16px; line-height: 1.8; color: #333; padding: 30px 0; border-bottom: 1px solid #e0e0e0;}

.image_wrapper {display: flex; flex-direction: column; gap: 20px; align-items: center; margin-bottom: 30px;}

.image_placeholder {width: 100%; max-width: 800px; height: 400px; background: #f0f0f0; color: #999; display: flex; justify-content: center; align-items: center; box-sizing: border-box;}
.board_detail_content img {display: block; margin: 0 auto; max-width: 100%; width: 100%; max-width: 800px; height: auto;}

.board_detail_file {margin-top: 20px; padding-bottom: 20px; font-size: 18px; border-bottom: 1px solid #e0e0e0;}
.board_detail_file .file_download {display: inline-block; margin-left: 10px; color: #22577a; }

.board_detail_buttons {display: flex; justify-content: right; margin-bottom: 20px; text-align: right;}
.board_detail_buttons .btn_cmn {padding: 6px 25px; margin-left: 10px; background: #3e505c; color: #fff; border: none; border-radius: 999px; cursor: pointer; font-size: 16px; transition: background .3s ease;}
.board_detail_buttons .btn_cmn:hover {background: #298DDE;}

/*faq*/
.faq_container {max-width: 1280px; margin: 50px auto; border-top: 2px solid #6490B4;}
.faq_text_wrap {display: flex; align-items: center;}
.faq_item {border-bottom: 1px solid #BDC9D4; padding: 20px 0; cursor: pointer;}

.faq_question {display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-size: 18px; color: #333;}

.faq_answer_wrapper {overflow: hidden; max-height: 0; transition: max-height 0.4s ease;}
.faq_answer {display: flex; margin-top: 25px; padding: 30px 0; font-size: 16px; color: #666; line-height: 1.6; align-items: center; border-top: 1px solid #BDC9D4;}

.label {margin: 0 10px 0 30px; font-weight: bold; color: #666; font-size: 24px; font-weight: 500;}
.faq_question h2, .faq_answer h2 {margin-left: 20px; font-size: 18px; font-weight: 500;}

.faq_toggle {display: flex; justify-content: center; background: #8EC3F3; border: none; color: #fff; font-weight: bold; font-size: 14px; border-radius: 50%; width: 28px; height: 28px; transform: rotate(0); transition: transform .3s ease; }
.faq_toggle.rotate {transform: rotate(180deg);}

@media screen and (max-width: 768px) {
  /*공통*/
  .board_header {width: 100%; box-sizing: border-box;}
  .search_bar {width: 100% !important; max-width: 100%; flex: 1 1 100%;}
  .search_bar input, .custom_select_wrap select {width: 100%; min-width: 0; box-sizing: border-box;}

  .pagination {flex-wrap: wrap; justify-content: center;}

  .pagination button {width: 32px; height: 32px; font-size: 14px; border-radius: 6px;}

  .pagination button img {width: 14px; height: 14px;}

  /*gallery*/
  .gallery_item {width: 100%;}

  /*board*/
  .board_table thead {display: none;}

  .board_table tbody tr:first-child {border-top: 2px solid #6490B4;}
  .board_table tr {display: flex; flex-direction: column; border-bottom: none; flex-wrap: wrap;}

  .board_table td {display: flex; width: 100%; text-align: left !important; font-size: 16px; word-break: break-word; box-sizing: border-box;  }
  .board_table td:nth-child(1), .board_table td:nth-child(4) {display: none;}
  .board_table td:nth-child(2) {width: 100%; padding-left: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
  .board_table td:nth-child(3) {padding-left: 10px; font-size: 15px; color: #555;}

  /*news*/
  .news_item {flex-direction: column;}
  .news_thumbnail {width: 100%; height: auto; aspect-ratio: 2 / 1; margin-right: 0;}

  /*faq*/
  .faq_question {align-items: flex-start; font-size: 16px; padding-left: 20px;}
  .faq_answer {padding: 20px 20px; font-size: 15px;}

  .label {margin: 0 10px 0 0; font-size: 20px;}

  .faq_question h2, .faq_answer h2 {margin-left: 0; font-size: 16px;}

  .faq_toggle {align-self: flex-end; width: 26px; height: 26px;}
}
@media screen and (max-width: 370px) {

}
/* Brand placeholder for gallery items whose photography is not supplied. */
.gallery-logo-placeholder{display:flex;align-items:center;justify-content:center;background:#fff;}
.gallery-logo-placeholder>img{width:45%;max-width:180px;height:auto;object-fit:contain;}
