/************ 게시판 전체 영역 ************/

.board_wrap{width:100%;margin:0 auto;padding:0;}
.sub_title{margin:0 auto 30px;}
.sub_comment{text-align: center;position: relative;margin: 0 auto 70px;}


/* 버튼 정의 */

.board_wrap .btn_wrap {margin-top: 20px;display: flex;justify-content: center;flex-flow: row wrap;}
.board_wrap .btn{margin:3px; transition: 0.3s all;width: 100%;line-height:50px;max-width: 140px;border-radius:8px;height:50px;border: 1px solid #494949;background:#494949;color:#fff;display: flex;justify-content: center;align-items: center;}
.board_wrap .btn.btn-primary{background:#494949;color:#fff;border:1px solid #494949;}
.board_wrap .btn.btn-danger{background:#dc3545;color:#fff;border:1px solid #dc3545;}
.board_wrap .btn:hover{background:#001A72 !important;color:#fff;border:1px solid #001A72;}
.board_wrap .btn.btn-default.small {height: 30px;line-height: 30px;max-width:42px;font-size: 12px;padding: 4px;border-radius: 5px; display: flex;}
.board_wrap .btn.btn-danger.small {height: 30px;line-height: 30px;max-width:42px;font-size: 12px;padding: 4px;border-radius: 5px; display: flex;}



/* input box 처리 */



/************ 게시판리스트 ************/

.board_list thead{}
.board_list thead tr th { text-align: center; border-top: 2px solid #333; border-bottom: 1px solid #d2d7dc; padding: 18px 12px; font-size: 18px; font-weight: 600; background: #f9fafb; }
.board_list thead tr th.w100 { width: 120px; }
.board_list tbody tr td { padding: 30px 0; border-bottom: 1px solid #f3f3f3; font-size: 18px; transition: 0.3s all; }
.board_list tbody tr:hover td { background: #f0f6f8; color: #daa520; }
.board_list tbody tr td a { color: #333; font-weight: 500; transition: 0.3s all; }
.board_list tbody tr:hover td a { color: #daa520; }
.board_list tbody { border-bottom: 1px solid #d3d3d3; padding: 12px; }
.board_list { overflow: hidden; margin: 0 auto; }

.gallery_list{width: 100%;display: grid;grid-template-columns: repeat(4, 1fr);gap:30px;}
.board_list .gallery_item {}
.board_list .gallery_item .box { transition: all .3s cubic-bezier(0,0,.2,1); height: 100%; }
.board_list .gallery_item .box a { display: block; width: 100%; height:auto; }
.board_list .gallery_item .box a.activation{position: relative;}
.board_list .gallery_item .box a.deactivation{pointer-events: none !important;}
.board_list .gallery_item .box a .link_overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2;background-color: rgba(0, 0, 0, 0.6);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.3s ease;}
.board_list .gallery_item .box a .link_overlay i{color: white;font-size: 40px;z-index: 10;transition: all 0.3s ease;transform: scale(0.8);opacity: 0;font-weight:300;}

.board_list .gallery_item .box a.activation:hover .link_overlay {opacity: 1;}
.board_list .gallery_item .box a.activation:hover .link_overlay i{opacity: 1;transform: scale(1);}

.board_list .gallery_item .box a.deactivation:hover .link_overlay {opacity: 0;}
.board_list .gallery_item .box a.deactivation:hover .link_overlay i{opacity: 0;}

.board_list .gallery_item .td_image { position: relative;object-fit: cover;border-radius:0; overflow: hidden; display: flex; align-items: center; justify-content: center;aspect-ratio: 303 / 430;height: calc(100% * 0.704);transition: 0.4s; }
.board_list .gallery_item .td_image a { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.board_list .gallery_item .td_image img { width: 100%; }
.board_list .gallery_item .td_title{margin:20px auto 10px;display:flex;align-items:center;}
.board_list .gallery_item .td_title h2{font-size:18px;color:#000;font-weight: 600;max-height:26px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;}
.board_list .gallery_item .td_title span.label {font-size:10px;color: #fff;padding: 4px 6px;vertical-align: middle;background:#001A72 !important; margin-right:6px;border-radius:5px;height: 20px;display: inline-flex;align-items: center;justify-content: center;vertical-align: middle;}
.gallery_item.hover .td_image{border-radius:0;}
.gallery_item.hover .td_title h2{color:#001A72;}
.board_list .td_time{display: flex;justify-content: space-between;font-size: 14px;color:#666;padding-bottom: 10px;}
.board_list .td_time i{margin-right:4px;}
.board_list .td_time b{margin-right:3px;}

@media (min-width: 1201px) {
    .gallery_list {grid-template-columns: repeat(4, 1fr);gap: 30px;}
    .board_list .gallery_item .td_image {}
}

@media (max-width: 1024px) {
    .gallery_list {grid-template-columns: repeat(3, 1fr);gap: 20px;}
    .board_list .gallery_item .td_title h2 {font-size: 16px;}
}

@media (max-width: 768px) {
    .gallery_list {grid-template-columns: repeat(2, 1fr);gap: 15px;}
    .board_list .gallery_item .td_title h2 {font-size: 14px;}
}

@media (max-width: 480px) {
    .gallery_list {grid-template-columns: repeat(1, 1fr);gap: 12px;}
    .board_list .gallery_item .td_title h2 {font-size: 13px;}
}


/* 검색 */
.search_wrap {width: 100%;max-width: 570px;margin: 0 auto 80px;display: flex;justify-content: center;align-items: center;border-bottom: 2px solid #333;padding:0 10px 10px;}
.search_wrap form {position: relative;width: 100%;display: flex;align-items: center;}
.search_wrap select#s1 {width:20%;margin-right:8px;height:35px; font-size:15px; border: none;}
.search_wrap input#s2 {width:80%;height: 35px; padding:0 8px;border: none;}
.search_wrap input#s2::placeholder{color:#b7b7b7;font-size:15px;}
.search_wrap label{display:none;}
.sch_btn {position: absolute;top: 0;right: 0;font-size: 25px;color:#001A72;height:100%;display: flex;align-items: center;justify-content: center;}

/* Pagination */
.board_wrap .board_list_foot { overflow: hidden; }
.board_wrap .board_list_foot .btn_wrap { width: 25%; float: left; padding: 20px 10px; display: inline-flex; justify-content: flex-start; }
.board_wrap .board_list_foot .btn_wrap.text-right { padding: 20px 0 20px 10px; justify-content: flex-end; }
.board_wrap .board_list_foot .paging_wrap { width: 50%; float: left; text-align: center; padding: 20px 10px; }
.board_wrap .board_list_foot .paging_wrap .pagination { display: inline-block; margin: 0; padding: 0; }
.board_wrap .board_list_foot .paging_wrap .pagination li { display: inline-block; margin: 0 2px; }
.board_wrap .board_list_foot .paging_wrap .pagination li a { color: #666; padding:7px 11px; font-size:12px; border: none; border-radius: 4px; text-decoration: none; transition: 0.3s all; }
.board_wrap .board_list_foot .paging_wrap .pagination li.active a, .board_wrap .board_list_foot .paging_wrap .pagination li a:hover { background:#000; color: #fff; }

.board_wrap .board_list_foot .search_wrap{text-align:Center;clear:both;}

@media(max-width:750px){
    .board_wrap .board_list tr th.th_name{display:none;}
    .board_wrap .board_list tr td.td_name{display:none;}
    .board_wrap .board_list tr th.th_view{display:none;}
    .board_wrap .board_list tr td.td_view{display:none;}
    .board_wrap .board_list_foot .paging_wrap{width:100%;}
    .board_wrap .board_list_foot .btn_wrap {width: 100%;margin-top: 0;padding: 0;padding: 0 !important;}
}
@media(max-width:600px){
    .board_wrap .board_list thead tr th{font-size:15px;}
    .board_wrap .board_list tbody tr td a{font-size:15px;}
}




/************ 읽기 페이지 ************/

.board_read{width:100%; color:#333;}
.board_read p{color:#333;}
.board_read .title{width:100%;text-align: center;}
.board_read .title h2{font-weight:bold;color:#000;margin-bottom:0 !important;}
.board_read .info{display:flex;text-align: center;background:#fff;justify-content: center;align-items: center;}
.board_read .info p{float:left; color:#666; font-size:0.875rem;font-weight:400;margin-bottom:0 !important;}
.board_read .info p.date{display:flex;align-items: center;justify-content: center;}
.board_read .info p.date span{}
.board_read .info p.date .material-icons-sharp{margin-right:5px;font-size:19px;}
.board_read .info p.name{padding-right:15px;}
.board_read .info i{color:#888; font-size:15px;font-weight:400;margin-right:5px;}
.board_read .con{color:#fff !important; width:100%;border-top:1px solid #e2e8f0; border-bottom:1px solid #e2e8f0; padding:3rem 0;}
.board_read .con p{font-size:0.875rem;font-weight:400;color:#333;}
.board_read .con .image{margin-bottom:4rem;}

.board_read tbody tr th{background:#f9f9f9;text-align:right;transition-duration:0.5s;}
.board_read tbody tr th,.board_wrap .board_read tbody tr td{border-bottom:1px solid #ddd;padding:10px;}
.board_read tbody tr td input.wfull,.board_wrap .board_read tbody tr td textarea.wfull{width:100% !important;}

table.board_read.down_box{width:100%;border-top:1px solid #464646;margin-top: 20px;}
.board_read tbody tr.file th{text-align:left;background:#333;color:#ddd;border-color:#464646;}
.board_read tbody tr.file td{text-align:left;color:#666;border-color:#464646;}

.board_read tbody tr td textarea{width:100%;height:200px;}
.board_read .form-control{width:auto;}

.board_read .bof_image{display:none;}   /* 첨부이미지 우선 숨김 */


@media(max-width:750px){
    .board_read .title h1{font-size:20px;}
}

@media(max-width:600px){
    .board_read tbody tr.file th:first-child{display:none;}
}

.video-container{position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;}
.video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%;}


/************ 글쓰기 페이지 ************/

.board_write{width:100%;border-top:1px solid #000;}
.board_write tbody tr th{background:transparent;text-align:left;}
.board_write tbody tr th,.board_wrap .board_write tbody tr td{border-bottom:1px solid #464646;padding:10px;}
.board_write tbody tr td input.wfull,.board_wrap .board_write tbody tr td textarea.wfull{width:100% !important;}
.board_write tbody tr td textarea{width:100%;height:200px;}
.board_write .form-control{width:auto;}

@media(max-width:550px){
    .board_write tbody tr th{display:none;}
    .board_write tbody tr td {width: 100%;}
    .board_write tbody tr td input{width: 100%;}
    .board_write input#bod_secret {width: auto;margin-right:5px;}
}


/************ 패스워드 확인 페이지 ************/

.board_wrap .board_pass_check{margin:50px 0px;}
.board_wrap .board_pass_check h1{font-size:24px;text-align:center;margin-bottom:20px;}
.board_wrap .pass_wrap{background:#f3f3f3;border:1px solid #ddd;text-align:center;width:100%;max-width:400px;padding:30px;margin:0px auto;}
.board_wrap .pass_wrap .pass_help{font-size:12px;}