@charset "utf-8";

#bo_cate {

    padding:7px;
    margin:10px 0;

    text-align:center;
}
#bo_cate h2 {
    position:absolute;
    font-size:0;
    line-height:0;
    overflow:hidden;
}
#bo_cate ul { zoom:1; }
#bo_cate ul:after { display:block; visibility:hidden; clear:both; content:""; }

#bo_cate li {
    display:inline-block;
    margin:6px 6px; /* ← 간격 넓힘 */
}

/* 버튼 크기 + 시각 강조 */
#bo_cate a {
    display:block;
    padding:8px 18px;    /* ← 버튼 자체가 커짐 */
    line-height:28px;    /* ← 전체 높이 증가 */
    font-size:15px;      /* ← 글자 크기 UP */
    font-weight:500;
    background:#fff;
    border-radius:6px;   /* ← pill 느낌 더 부드럽게 */
    border:0px solid #d6d6d6;
    color:#6f6f6f;
    transition:0.2s;
}
 
/* hover */
#bo_cate a:hover {
    background:#dfe6e9;
    border-color:#bfc9cc;
}

/* 선택된 */
#bo_cate #bo_cate_on {
	position:relative;
    background:#fff !important;
    border-color:#fff !important;
    color:#000 !important;
    font-weight:600;
	border-bottom:2px solid #000; 
    box-shadow:inset 0 0px 0px rgba(30,120,180,0.6);
}

#bo_cate #bo_cate_on::before{
	position:absolute;
	bottom:0;
	left:0;
	width:100%; 
	height:3px;
	background:#000;
	content:"";
}
/* ============================
   반응형 리스트 헤더 + 목록
   ============================ */

/* PC 기본 리스트 헤더 */
.bo_list_head ul{
    border-top:1px solid #000;
    border-bottom:1px solid #ddd;
    margin:0 auto 10px;
}
.bo_list_head ul li{
    padding:12px 0;
    display:table;
    width:100%;
    font-size:16px;
    box-sizing:border-box;
}
.bo_list_head ul li span{
    float:left;
    text-align:center;
}

/* 헤더 각 컬럼 폭 (PC) */
.bo_list_head ul li span.s-number{width:8%;}
.bo_list_head ul li span.s-name{width:18%;}
.bo_list_head ul li span.s-user{width:18%;}
.bo_list_head ul li span.s-ms1{width:18%;}
.bo_list_head ul li span.s-ms2{width:18%;}
.bo_list_head ul li span.s-ms3{width:20%;}

/* 실제 리스트 영역 (PC) */
.bo_list ul{
    background:#fff;
    margin:0 auto 10px;
}
.bo_list ul li{
    padding:12px 0;
    border-bottom:1px solid #ddd;
    display:table;
    width:100%;
    font-size:18px;
    box-sizing:border-box;
}
.bo_list ul li a{color:#666;}
.bo_list ul li span{
    float:left;
    color:#666;
    text-align:center;
}
.bo_list ul li span .sv_member{
    float:none;
    color:#666;
}

/* 리스트 본문 각 컬럼 폭 (PC) */
.bo_list ul li span.s-number{width:8%;}
.bo_list ul li span.s-name{width:18%;}
.bo_list ul li span.s-user{width:18%;}
.bo_list ul li span.s-ms1{width:18%;}
.bo_list ul li span.s-ms2{width:18%;}
.bo_list ul li span.s-ms3{width:20%;}
/* wr_5 까지 쓰는 경우 */
.bo_list ul li span.s-ms4{width:20%;}

/* 댓글 수 등 */
.bo_list .cmt{
    color:#888;
    font-size:13px;
    height:16px;
    line-height:16px;
    padding:0 5px;
    vertical-align:middle;
}

/* ============================
   모바일 카드형 (max-width:800px)
   ============================ */
@media screen and (max-width:800px){

  /* 헤더 숨김 */
  .bo_list_head ul li{
      display:none;
  }

  /* 전체 리스트 좌우 여백 */
  .bo_list{
      padding:0 10px;
  }

  /* 각 항목을 카드형 박스로 변경 */
  .bo_list ul li{
      display:block;
      width:100%;
      margin:0 0 12px 0;
      padding:12px 14px;
      border:1px solid #e5e5e5;
      border-radius:12px;
      background:#ffffff;
      box-shadow:0 2px 6px rgba(0,0,0,0.04);
      font-size:14px;
      box-sizing:border-box;
  }

  /* 내부 span 공통: 세로 정렬 + 좌측정렬 */
  .bo_list ul li span{
      float:none;
      display:block;
      width:100%;
      text-align:left;
      color:#555;
      padding:2px 0;
  }

  /* 번호/체크박스/PC전용 숨김 */
  .bo_list ul li span.s-number,
  .bo_list ul li span.s-check,
  .mobile_none{
      display:none !important;
  }

  /* =============== 라벨(content) =============== */

@media screen and (max-width:800px){
 
 .bo_list ul li span.s-name{
      width:90% !important;
  }
  /* 대상 */
  .bo_list ul li span.s-user{
      width:90% !important;
  }
  .bo_list ul li span.s-user::before{
      content:"대상 ";
      color:#999;
      font-size:12px;
      margin-right:4px;
  }

  /* 신고기한 */
  .bo_list ul li span.s-ms1{
      width:90% !important;
  }
  .bo_list ul li span.s-ms1::before{
      content:"신고기한 ";
      color:#999;
      font-size:12px;
      margin-right:4px;
  }

  /* 변경후 처리기관 */
  .bo_list ul li span.s-ms2{
      width:90% !important;
  }
  .bo_list ul li span.s-ms2::before{
      content:"변경후 처리기관 ";
      color:#999;
      font-size:12px;
      margin-right:4px;
  }

  /* 비고 */
  .bo_list ul li span.s-ms3{
      width:90% !important;
  }
  .bo_list ul li span.s-ms3::before{
      content:"비고 ";
      color:#999;
      font-size:12px;
      margin-right:4px;
  }

  /* 기타 (wr_5 사용 시) */
  .bo_list ul li span.s-ms4{
      width:90% !important;
  }
  .bo_list ul li span.s-ms4::before{
      content:"기타 ";
      color:#999;
      font-size:12px;
      margin-right:4px;
  }

}


  /* 검색폼 모바일 사이즈 조정 */
  #bo_sch{
      font-size:13px;
  }
  #bo_sch select{
      width:20%;
  }
  #bo_sch .sch_input{
      width:70%;
  }
  #bo_sch .sch_btn{
      width:10%;
  }
}
