.title_wrap_notice {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.serch_wrap {
    display: flex;  /* display 속성을 유지하고 아이템 정렬 */
    align-items: center;
    height: 48px;
    border: 1px solid #e5e5ec;
    border-radius: 100px;
    padding: 12px 20px;
    width: 370px;
    overflow: hidden;
    flex-shrink: 0;
    cursor: text; /* serch_wrap에 text 커서 지정 */
}

.serch_wrap:hover {
    background-color: #f7f7fb;
}

.serch_wrap:focus-within {
    border-color: #111; /* 포커스 시 테두리 색상 변경 */
}

.serch_wrap .search_icon {
    margin-right: 6px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    pointer-events: none; /* svg 클릭 방지 */
}

.serch_input {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    outline: none;
    background: none;
    padding: 0;
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    color: #111;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.table_a {
    width: 100%;
    border-collapse: collapse; /* 테이블 셀 간 간격 제거 */
}

.table_a th,
.table_a td {
    padding: 12px;
    text-align: left;
}
tbody tr {
    border-bottom: 1px solid #F1F1F5; /* 게시글 사이 구분선 */
}

.table_a th {
    font-weight: 400;
}

thead {
    background-color: #f7f7fb;
}

thead > tr {
    border-radius: 6px;
}
/* 테이블 반응형 */
.table_a {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
    line-height: 24px;
    margin-top: 20px;
}

.table_a th,
.table_a td {
    padding: 16px;
    text-align: left;
}

.table_a td {
    padding: 22px 16px;
}

.table_a th {
    text-align: center;
}

.table_a tbody tr:last-child td {
    border-bottom: none;
}

.table_a .notice_num,
.table_a .notice_author,
.table_a .notice_date,
.table_a .notice_hit {
    width: 10%; /* 번호, 작성자, 작성일, 조회수 열 고정 너비 */
    text-align: center;
    white-space: nowrap;
    color: #767676; /* 텍스트 색상 변경 */
}

/* 고정글 */
.notice_highlight {
    font-weight: bold;
    color: black !important;
}

.table_a .notice_num.notice_highlight,
.table_a .notice_author.notice_highlight,
.table_a .notice_date.notice_highlight,
.table_a .notice_hit.notice_highlight {
}
 

.table_a .notice_num.notice_highlight {
    color: transparent !important;
  /* 가상 요소를 위한 상대 위치 설정 */
  position: relative;
  /* 텍스트 정렬 유지 (기존 스타일이 있다면) */
  text-align: center;
  vertical-align: middle; /* 테이블 셀 내용의 수직 정렬 */
}

.table_a .notice_num.notice_highlight:before {
    content: '공지'; /* 표시할 텍스트 */

  /* --- 위치 및 정렬 --- */
  position: absolute;     /* 절대 위치 지정 */
  top: 50%;               /* 부모 요소(td)의 세로 중앙 */
  left: 50%;              /* 부모 요소(td)의 가로 중앙 */
  transform: translate(-50%, -50%); /* 요소 자체 크기의 절반만큼 왼쪽/위로 이동하여 정확히 중앙에 배치 */

  /* --- 스타일 --- */
  display: inline-block; /* 너비/높이, 패딩 적용을 위해 */
  background-color: #00a199; /* 빨간색 배경 */
  color: white;             /* 흰색 글씨 */
  padding: 2px 16px;         /* 내부 여백 (값 조절) */
  border-radius: 50px;
  white-space: nowrap;      /* '공지' 텍스트가 줄바꿈되지 않도록 */
  width: fit-content; 
  font-weight: 600;      /* 내용물에 딱 맞는 너비 */
}

.notice_title.notice_highlight a,
.notice_author.notice_highlight,
.notice_date.notice_highlight,
.notice_hit.notice_highlight {
    font-weight: 600;
}

.notice_author.notice_highlight,
.notice_date.notice_highlight,
.notice_hit.notice_highlight {
    color: #00a199 !important;
}


@media (max-width: 764px) {
    .table_a .notice_title a {
        position: relative;
        margin-bottom: 3px;
        padding: 0;
        text-align: left;
    }


    .notice_author.notice_highlight,
    .notice_date.notice_highlight,
    .notice_hit.notice_highlight {
        color: #111 !important;
    }
    tr.notice_highlight td.notice_title a::before {
        content: '공지';              /* 표시될 텍스트 */
        display: inline-block;      /* 인라인 블록 요소로 만들어 스타일 적용 */
    
        /* --- 스타일 (PC 버전과 유사하게) --- */
        background-color: #00a199;  /* 빨간색 배경 (원하는 색상 코드로 변경) */
        color: white;               /* 흰색 글씨 */
        padding: 2px 8px;           /* 내부 여백 (모바일 환경에 맞게 조절 가능) */
        margin-right: 4px;          /* 뱃지와 제목 텍스트 사이 간격 (값 조절) */
        border-radius: 50px;        /* 모서리 둥글게 (값 조절) */
        font-size: 13px;          /* 폰트 크기 (제목 폰트 크기 대비 조절) */
        font-weight: 600;          /* 굵은 글씨 (선택 사항) */
        line-height: 18px;   
        width: fit-content;      /* 줄 높이 (세로 정렬 미세 조정) */
        vertical-align: middle;     /* 텍스트와 수직 정렬 (middle, baseline 등 시도) */
        transform: translateY(-1px);
        /* 미세 위치 조정이 필요할 경우 (선택 사항) */
        /* position: relative; */
        /* top: -1px; */
      }





}








.table_a .notice_title {
    position: relative; /* a 태그가 td 전체를 덮도록 설정 */
    padding: 0; /* td의 기본 패딩 제거 */
    width: auto; /* 제목 열은 남은 공간 모두 차지 */
}

.table_a .notice_title a {
    display: block; /* a 태그를 블록 요소로 변경 */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: inherit; /* a 태그의 기본 색상 제거 */
    text-decoration: none; /* a 태그의 밑줄 제거 */
    box-sizing: border-box; /* a 태그에 border-box 적용 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 22px 16px;
    text-align: left;
}

/* 페이지네이션 스타일 */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 100px;
    font-size: 16px;
    line-height: 24px;
    flex-shrink: 0;
}

.pagination * {
    flex-shrink: 0;
}

.pagination a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-decoration: none;
    color: #666;
    font-weight: 400;
    margin: 0 6px;
}

.pagination a.page_control {
    color: #999; /* 이전/다음 페이지 컨트롤 색상 */
}

.pagination a.page_num:not(.current):hover {
    background-color: #f7f7fb;
    color: #767676;
}

.pagination a.current {
    background-color: #00A199; /* 선택된 페이지 배경색 */
    color: #fff; /* 선택된 페이지 텍스트 색상 */
    font-weight: 600;
}


/* 첫 페이지에서 이전 페이지 컨트롤 비활성화 */
.pagination a.page_control.prev,
.pagination a.page_control.prev_all {
    color: #999;
    /* pointer-events: none; */
}

/* 좌측 화살표 반전 */
.pagination a.page_control.prev svg,
.pagination a.page_control.prev_all svg {
    transform: scaleX(-1);
    stroke: #999;  /* 선 색상을 회색으로 변경 */
}

/* 첫 페이지에서 이전 페이지 컨트롤 비활성화 (선 색상) */
.pagination a.page_control.prev.disabled svg,
.pagination a.page_control.prev_all.disabled svg {
    stroke: #999; /* 첫 페이지에서 선 색상을 회색으로 변경 */
}


.content_bottom_nav_wrap {
    display: flex;
    flex-direction: column;
    border: 1px solid #E5E5EC;
    border-radius: 12px;
    margin-top: 60px;
}

.cbnw_item {
    display: flex;
    align-items: center;
    padding: 24px 32px;
    gap: 24px;
    font-size: 18px;
    line-height: 26px;
    width: 100%;
}

.cbnw_item_left {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #767676;
    white-space: nowrap;
}
.cbnw_item_right {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.content_bottom_nav_wrap >*:first-child:not(:last-child) {
    border-bottom: 1px solid #e5e5ec;
}

.content_bottom_nav_wrap >*:hover {
    background-color: #f7f7fb;
}

/* notice_step2 */
.notice_step2_title_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 32px;
    border-bottom: 1px solid #e5e5ec;
    margin-bottom: 48px;
}

.notice_step2_title_wrap_caption {
    display: flex;
    gap: 20px;
    align-items: center;
}

.ns2_twc_item {
    display: flex;
    gap: 8px;
    align-items: center;
}

.notice_step2_file_wrap {
    margin-top: 100px;
    margin-bottom: 140px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    border: 1px solid  #e5e5ec;
    border-radius: 12px;
    padding: 24px 32px;
}

.ns2_fw_file_wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ns2_fw_fw_item {
    display: flex;
    align-items: center;
    padding: 6px 8px;
    gap: 8px;
    background: #F1F1F5;
    border-radius: 4px;
    width: fit-content;
    max-width: 100%;
}
.ns2_fw_fw_item span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.ns2_fw_fw_item_right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ns2_fw_fw_item_right>span {
    white-space: nowrap;
}

.go_list_btn {
    margin: 0 auto;
    display: flex;
    justify-content: center;
    width: 160px;
    padding: 12px 0px;
    border-radius: 100px;
    box-shadow: inset 0 0 0 1px #111;
    box-sizing: border-box;
}

.go_list_btn:hover {
    background-color: #00A199;
    box-shadow: none;
}

.go_list_btn:hover span {
    color: #fff;
}

@media (max-width: 1200px) {
    .pagination {
        margin-top: 72px;
    }
}

@media (max-width: 764px) {
    .pagination a.page_control.prev_all,
    .pagination a.page_control.next_all {
      display: none;
    }
    .pagination {
        font-size: 14px;
        line-height: 20px;
        margin-top: 48px;
    }
    .pagination a {
        width: 36px;
        height: 36px;
        margin: 0 4px;
    }
    .pagination a.page_control.prev {
        padding-right: 8px;
    }
    .pagination a.page_control.next {
        padding-left: 8px;
    }

    .notice_step2_title_wrap {
        gap: 12px;
        padding-bottom: 24px;
        margin-bottom: 32px;
    }
    .ns2_twc_item {
        gap: 4px;
    }
    .notice_step2_title_wrap_caption {
        gap: 12px;
    }
    .notice_step2_title_wrap_caption >*:last-child {
        display: none;
    }
    .ns2_twc_item >*:first-child {
        width: 16px;
        height: 16px;
    }

    .notice_step2_file_wrap {
        margin-top: 48px;
        margin-bottom: 60px;
        gap: 8px;
        border: 1px solid #F1F1F5;
        border-radius: 8px;
        padding: 18px 20px;
    }
    .ns2_fw_file_wrap {
        gap: 6px;
    }
    .ns2_fw_fw_item {
        padding: 6px 8px;
        gap: 6px;
    }
    .ns2_fw_fw_item_right >*:last-child {
        width: 16px;
        height: 16px;
    }
    .go_list_btn {
        width: 140px;
    }
    .content_bottom_nav_wrap {
        border: 1px solid #f1f1f5;
        border-radius: 8px;
        margin-top: 32px;
    }
    .content_bottom_nav_wrap >*:first-child {
        border-bottom: 1px solid #f1f1f5;
    }

    .cbnw_item_left span {
        display: none;
    }
    .cbnw_item {
        padding: 20px;
        gap: 12px;
        font-size: 14px;
        line-height: 20px;
    }




	.table_a,
	.table_a tbody,
	.table_a th,
	.table_a tr,
	.table_a td {
		display:block;
		width:100%;
		padding:0;
		font-size:13px;
	}
	.table_a tr {
		height:auto;
		padding:15px 5px;
		box-sizing:border-box;
	}
	.table_a tr:after {
		content:'';
		line-height:0;
		visibility:hidden;
		font-size:0;
		clear:both;
		display:block;
	}
	.table_a td.notice_num {
		display:none;
	}
	.table_a td.notice_title {
		width:100%;
		font-size:16px;
		font-weight:600;
		clear:both;
	}
	.table_a .notice_title a {
		position:relative;
		margin-bottom:3px;
		padding:0;
		text-align:left;
	}
	.table_a td.notice_title:after {
		content:'';
		line-height:0;
		visibility:hidden;
		font-size:0;
		clear:both;
		display:block;
	}
	.table_a td.notice_author {
		float:left;
		margin-right:20px;
		text-align:left;
		display:none;
	}
	.table_a td.notice_date {
		width:104px;
		box-sizing:border-box;
		padding-left:20px;
		float:left;
		background:url('/images/global/board_date.svg');
		background-position:left center;
		background-size:14px;
		background-repeat:no-repeat;
		text-align:left;
	}
	.table_a td.notice_hit {
		width:40px;
		padding-left:20px;
		box-sizing:border-box;
		float:left;
		background:url('/images/global/board_view.svg');
		background-position:left center;
		background-size:14px;
		background-repeat:no-repeat;
		text-align:left;
	}
  }



