/* 게시판 전체 영역 */
.board_wrap{width:80%;margin:0px auto;max-width:1200px; color:#7f7f7f;}
.board_wrap .btn_wrap{text-align:right;margin-top:20px; padding-bottom:6rem}

/* 버튼 정의 */

.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%;max-width: 140px;border-radius: 0;height: 50px;border: 1px solid #333;color: #333;background: #fff;display: flex;align-items: center;justify-content: center;}
.board_wrap .btn:hover{background:#ea5404;color:#fff;border:1px solid #ea5404;}
.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 .board_list{width:100%; margin-top: 5rem; }
.board_wrap .board_list thead{}
.board_wrap .board_list thead tr th{text-align:center;background:#111;border-top:2px solid #333;border-bottom:1px solid #d3d3d3;padding:2rem 0;font-size:16px;}
.board_wrap .board_list thead tr th.w100{width:100px;}
.board_wrap .board_list tbody tr td{padding:2rem 0; border-bottom:1px solid #f3f3f3;font-size:16px; }
.board_wrap .board_list tbody tr td a{color:#7f7f7f; font-weight: 600;}
.board_wrap .board_list tbody {border-bottom:1px solid #d3d3d3;padding:10px;}

.board_wrap .board_list tbody tr:hover td{background:#111;color:#fff;}
.board_wrap .board_list tbody tr:hover td a{color:#fff;}
.board_wrap .board_list .table-title { padding-left: 1.5rem; }

/* Pagination */
.board_wrap .board_list_foot{overflow:hidden;}
.board_wrap .board_list_foot .btn_wrap{width:25%;float:left;padding:20px 10px;}
.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;}
.board_wrap .board_list_foot .paging_wrap .pagination li{display:inline-block;}
.board_wrap .board_list_foot .paging_wrap .pagination li a{color:#333;border:1px solid #888; font-size:12px;}
.board_wrap .board_list_foot .paging_wrap .pagination li.active a,
.board_wrap .board_list_foot .paging_wrap .pagination li a:hover{background:#fff;color:#fff;border:1px solid #fff;}

.board_wrap .board_list_foot .search_wrap{ clear:both; background: #111; padding:1rem; }

/**
 * 글쓰기 페이지
 */
.board_wrap .board_write{width:100%;border-top:4px solid #333; margin-top: 16rem;}
.board_wrap .board_write tbody tr th{background:#000;width:15%;text-align:right; padding: 2rem;}
.board_wrap .board_write tbody tr th,.board_wrap .board_write tbody tr td{border-bottom:1px solid #ddd;}
.board_wrap .board_write tbody tr td input.wfull{width:80%;}
.board_wrap .board_write tbody tr td textarea{width:80%; height:200px; margin: 2rem; border: 1px solid #aaa; }
.board_wrap .board_write tbody tr td{background:#000;}

.board_wrap .board_write tbody tr td small { margin-left: 2rem;}
.write-con { border: 1px solid #aaa; padding: 0.5rem; margin-left: 2rem;}
.file-con {width:80%; margin:2rem 2rem 0 2rem;}


/**
 * 패스워드 확인 페이지
 */
.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;}


.search_container { position: relative; max-width: 350px; width: 100%; }
.search-con1 { padding: 11px; background: #fff; border: 1px solid #d1d1d1; margin-right: -1px; min-width: 120px; }
.search-con2 { border: 1px solid #d1d1d1; padding: 12px; width: 100% }
.search-con { background: #fff;  margin: 0 0 0 -3px; padding: 12px 20px; color: #fff; position: absolute; top: 0; right: 0; height: 100%; }
.flex-box { display: flex; flex-direction: row; justify-content: center; }

.read_title { font-size: 21px; font-weight: 600; padding: 3rem 1rem; }
.read_con { font-size: 16px; padding: 3rem 1rem; }
.read_date { font-size: 14px; font-weight: 400; color: #777; margin-top: 1rem; }

.read_con img,
.read_con .bof_image {
  display: block;
  max-width: 760px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto 20px;
}

@media screen and (max-width: 1400px) {
    .table-none { display: none; }
}

@media screen and (max-width: 630px) {
    .flex-box { flex-direction: column; }
    .search_container { max-width: 1000px; margin-top: 1rem; }

    .board_read .title{padding:32px 0px;}
    .board_read .con{padding:30px 0px;}
	.category-tabs { margin-top:154px !important}
}
@media screen and (max-width: 630px) {
  .read_title { padding: 32px 0; }
  .read_con { padding: 30px 0; }

  .read_con img,
  .read_con .bof_image {
	  max-width: 100% !important;
  }
}


/** 카테고리 **/
/* 탭 전체 영역 */
.category-tabs {
    display: flex;
    align-items: center;
    gap: 15px; /* 탭 사이 간격 */
    margin-bottom: 30px; /* 게시판 리스트와의 간격 */
	justify-content: center; margin-top:236px
}

/* 탭 버튼 기본 (비활성 상태) */
.category-tabs a {
    display: inline-block;
    padding: 8px 24px; /* 위아래 8px, 좌우 24px */
    font-size: 1rem;
    font-weight: 500;
    text-decoration: none;
    color: #ffffff; /* 비활성 텍스트는 흰색 */
    border-radius: 50px; /* 양쪽이 완전히 둥근 알약 모양 */
    transition: background-color 0.2s ease, color 0.2s ease; /* 부드러운 전환 효과 */
}

/* 탭 버튼 활성화 상태 (.active) */
.category-tabs a.active {
    background-color: #ffffff; /* 배경 흰색 */
    color: #000000; /* 텍스트 검은색 */
    font-weight: bold; /* 선택된 탭은 글씨를 조금 더 굵게 */
}

/* 마우스 호버 효과 (선택 사항) */
.category-tabs a:not(.active):hover {
    color: #000; /* 비활성 탭에 마우스를 올리면 살짝 어두워짐 */
}