.board .table_frame { overflow: auto; }
.board .board_list thead tr th { padding: 20px 0; color: #fff; background-color: #20a8ff; position: relative; }
.board .board_list thead tr th:not(:last-child)::after { height: 20px; content: ''; width: 1px; display: block; background-color: #fff; position: absolute; top: 50%; transform: translateY(-50%); right: 0; }
.board .board_list thead tr th,
.board .board_list tbody tr td { text-align: center; } 
.board .board_list tbody tr td { border-bottom: 1px solid #000; }
.board .board_list tbody tr .title a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
.board .board_list tbody tr .title a:hover { text-decoration: underline; }

.news_frame .news .news_list { border-top: 2px solid #000; }
.news_frame .news .news_list { border-bottom: 1px solid #ccc; }
.news_frame .news .news_list a { display: flex; }
.news_frame .news .news_list span { display: block; }
.news_frame .news .news_list .img_box { width: 25%; margin-right: 5%; padding-bottom: 20%; position: relative; }
.news_frame .news .news_list .img_box img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: auto; background-color: #fff; }
.news_frame .news .news_list .news_tt_box { width: 70%; padding: 15px; }
.news_frame .news .news_list .news_title { font-weight: 600; }
.news_frame .news .news_list .news_title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news_frame .news .news_list .news_txt { width: 100%; word-wrap: break-word; word-break: keep-all;  }
.news_frame .news .news_list .news_txt:hover { text-decoration: underline; }
   
.pagination { display: flex; justify-content: center; align-items: center; }
.pagination .num { display: flex; }
.pagination .num .page-link { display: block; color: #868686; background-color: #d3d3d3; border-radius: 50%; }
.pagination .num .page-link:hover,
.pagination .num .page-link:active,
.pagination .num .page-link.on { color: #fff; background-color: #20a8ff; }
.pagination .num .page-link:not(:last-child) { margin-right: 4px; }

/* boardView */
.board .board_view tbody { border-top: 2px solid #000; }
.board .board_view tbody th { background: url('../img/common/table_bar.jpg') no-repeat right center; white-space: nowrap; }
.board .board_view tbody th,
.board .board_view tbody td { font-weight: 400; text-align: left; border-bottom: 1px solid #ccc; }
.board .board_view tbody .title { font-weight: 600; }
.board .go_list { margin: 0 auto; color: #fff; display: block; text-align: center; background-color: #20a8ff; }
.board .go_list:hover,
.board .go_list:active { background-color: #0c8ada; }

/*** Mobile ***/
@media screen and (min-width:1px) and (max-width:768px) {

    .board .board_list { white-space: nowrap; }
    .board .board_list thead tr th,
    .board .board_list tbody tr td { font-size: 12px; }
    .board .board_list tbody tr td { padding: 10px 10px; }
    .board .board_list thead tr th:not(:last-child)::after { height: 12px; }
    .board .board_list tbody tr .title a { width: 100px; }

    .news_frame .news .news_list .news_title { font-size: 17px; margin-bottom: 10px;  }
    .news_frame .news .news_list .news_txt { height: 100px; font-size: 15px; }

    .pagination { margin-top: 40px; }
    .pagination img { width: 7px; }
    .pagination .num { margin: 0 20px; }
    .pagination .num .page-link { font-size: 15px; padding: 2px 8px; }

    /* boardView */
    .board .board_view { margin-bottom: 30px; }
    .board .board_view img { height: auto; }
    .board .board_view tbody th { width: 63px; }
    .board .board_view tbody th,
    .board .board_view tbody td { font-size: 15px; padding: 10px; }
    .board .board_view tbody .title { font-size: 18px; }
    .board .go_list { width: 150px; font-size: 16px; padding: 10px;  }
}

/*** Mobile & Tablet ***/
@media screen and (min-width:1px) and (max-width:1359px) {
} 

/*** Tablet ***/
@media screen and (min-width:768px) and (max-width:1359px) {

    .board .board_list thead tr th,
    .board .board_list tbody tr td { font-size: 18px; }
    .board .board_list tbody tr td { padding: 20px 30px; }
    .board .board_list thead tr th:not(:last-child)::after { height: 15px; }
    .board .board_list tbody tr .title a { width: 350px; }

    .news_frame .news .news_list .news_title { font-size: 20px; margin-bottom: 15px;  }
    .news_frame .news .news_list .news_txt { height: 180px; font-size: 18px; }

    /* boardView */
    .board .board_view { margin-bottom: 30px; }
    .board .board_view tbody th { width: 87px; }
    .board .board_view tbody th,
    .board .board_view tbody td { font-size: 20px; padding: 15px; }
    .board .board_view tbody .title { font-size: 25px; }
    .board .go_list { width: 200px; font-size: 20px; padding: 15px;  }
}

/*** Tablet & Desktop ***/
@media screen and (min-width:768px) {
    .pagination { margin-top: 95px; }
    .pagination .num { margin: 0 40px; }
    .pagination .num .page-link { font-size: 20px; padding: 2px 11px; }
}

/*** Desktop ***/
@media screen and (min-width:1360px) {

    .board .board_list thead tr th,
    .board .board_list tbody tr td { font-size: 22px; }
    .board .board_list tbody tr td { padding: 25px 40px; }
    .board .board_list thead tr th:not(:last-child)::after { height: 20px; }
    .board .board_list tbody tr .title a { width: 700px; }
    

    .news_frame .news .news_list .news_title { font-size: 25px; margin-bottom: 20px; }
    .news_frame .news .news_list .news_txt { height: 228px; font-size: 23px; }

     /* boardView */
     .board .board_view { margin-bottom: 50px; }
     .board .board_view tbody th { width: 110px; }
     .board .board_view tbody th,
     .board .board_view tbody td { font-size: 25px; padding: 20px; }
     .board .board_view tbody .title { font-size: 32px; }
     .board .go_list { width: 250px; font-size: 25px; padding: 20px;  }
    

}