/*
 * 공지사항 게시판 스킨 스타일 — 게시판 위젯(.scbd) 전용.
 *
 * 서브페이지 공통 골격(#shgroup 상단 배너, .contents_wrap/.contents, 그리드
 * .row/.col)은 www/theme/ezrehab/css/layout.css 로 옮겼다 — 공지사항만 쓰는
 * 값이 하나도 없고(18개 남은 서브페이지 전부가 같은 배너·같은 폭 제한을
 * 쓴다), 여기 남겨두면 다음 화면에서 똑같은 실수(폭 제한 누락)가 반복된다.
 *
 * 수치 출처: 원본 라이브 사이트(https://www.ezrehabclinic.com/bbs/board1,
 * https://pain.ezrehabclinic.com/bbs/board1)를 Playwright 로 열어 PC 1920x1080 /
 * 모바일 390x844 에서 getBoundingClientRect() + getComputedStyle() 로 직접 측정한
 * 값이다. 원본 CSS 원본 파일(reference/assets/.../src_css/rwdclear{,_pc}.css)도
 * 대조했다 — 이 값들은 원본이 실제로 화면에 그리는 결과이지 임의로 만든 값이 아니다.
 */

/* ── 게시판 위젯(.scbd) ─────────────────────────────────────
 * 원본 소스: reference/assets/.../src_css/rwdclear.css(모바일 기본) +
 * rwdclear_pc.css(>=1024 재정의). 본문에 실제로 쓰이는 선택자만 옮긴다 —
 * 전체 프레임워크(사진/블로그/캘린더 목록 등 다른 게시판 타입 스타일)는
 * 이 화면에 나타나지 않으므로 옮기지 않는다.
 */
.scbd { font-size: 16px; text-align: left; color: #555; box-sizing: border-box; }
.scbd *, .scbd *:before, .scbd *:after { box-sizing: border-box; }
.scbd table { border-collapse: collapse; border-spacing: 0; }
.scbd th, .scbd td { padding: 0; }
.scbd a { text-decoration: none; }

.scbd .head { border-top: 1px solid #ccc; }
.scbd .head .nav > ul { margin: 0; padding: 0; list-style: none; width: 100%; display: table; border-bottom: 1px solid #aaa; }
.scbd .head .nav > ul > li { display: table-cell; padding: 0; }
.scbd .head .nav > ul > li > a {
    display: block; padding: 12px 0; border-left: 1px solid #ccc; text-align: center;
    color: #333; text-decoration: none; font-size: 13px; font-weight: 600;
    /* 원본에 있는 흰색 1px 아래 그림자. 눈에 잘 띄지 않지만 글자 가장자리
       픽셀이 달라져 화면 비교에서 계속 잡힌다. */
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
.scbd .head .nav > ul > li:first-child > a { border-left: 0; }
/* 원본(rwdclear.css)은 span 에도 vertical-align:middle 을 준다. 이게 빠지면
   span 이 baseline 에 놓여 줄 높이가 2px 줄고, 그만큼 표 전체가 위로 밀린다. */
.scbd .head .nav > ul > li > a > span { vertical-align: middle; }
.scbd .head .nav > ul > li > a > i { display: inline-block; width: 6px; height: 4px; margin: 0 0 0 2px; vertical-align: middle; }
/* 원본(rwdclear.css)의 회색 그라데이션 버튼 배경. 마크업에는 gbg 클래스가 붙어 있는데
   규칙이 없어 배경도 안쪽 그림자도 나오지 않았다. */
.scbd .gbg { background: linear-gradient(#ffffff 0, #ececec 100%); box-shadow: rgba(255, 255, 255, 0.8) 0 -1px 0 inset; }
/* 화살표는 스프라이트 이미지의 일부다(원본 sp-icons@1x.png 의 -88px 0 위치). */
.scbd .sp-ico { background-image: url("../../../img/sp-icons.png"); background-repeat: no-repeat; }
.scbd .head .nav > ul > li > a > i.sp-ico { background-position: -88px 0; }

.scbd .searchForm { position: absolute; height: 0; overflow: hidden; visibility: hidden; }
.scbd .searchForm form { position: relative; margin: 8px 10px; border: 1px solid #bbb; border-radius: 20px; }
.scbd .searchForm fieldset { margin: 0; padding: 4px 50px 3px 15px; border: 0; }
.scbd .searchForm input[type=text] { margin: 0; padding: 5px 0; border: 0; background: transparent; width: 100%; font-size: 13px; color: #555; }
.scbd .searchForm button { display: block; position: absolute; right: 12px; top: 50%; width: 25px; height: 25px; margin-top: -13px; border: 0; background-color: transparent; }

.scbd .list_board > table { width: 100%; }
.scbd .list_board caption { position: absolute; height: 0; overflow: hidden; font-size: 0; visibility: hidden; }
.scbd .list_board thead { display: none; }
.scbd .list_board tbody tr { display: block; border-bottom: 1px solid #ccc; padding: 8px 0; }
.scbd .list_board tbody tr.empty { cursor: default !important; }
/* 모바일 기본 셀 규칙. 원본은 이 규칙의 글자 크기가 사이트마다 다르다 —
   소아 16px, 통증 12px(각 사이트 rwdclear.css 실측). 목록이 비었을 때
   "등록된 게시글이 없습니다." 가 이 크기로 그려진다.
   PC(>=1024px)에서는 아래 블록의 13px !important 가 두 사이트 모두 이긴다. */
.scbd .list_board tbody td { display: block; padding: 0; font-size: 16px; color: #666; }
.site-pain .scbd .list_board tbody td { font-size: 12px; }
/* font-size 를 여기서 정하지 않는다.
   원본의 rwdclear.css 에는 '.scbd tr.empty>td{font-size:13px}' 가 있지만
   바로 뒤의 '.scbd .list_board tbody td{font-size:16px}' 와 특이도가 같아(0,2,2)
   나중 것이 이긴다 — 모바일 원본은 16px 로 그려진다(실측 확인).
   13px 는 PC 전용 rwdclear_pc.css(media="(min-width:640px)")의
   '!important' 규칙에서 오므로 아래 PC 블록이 맡는다.
   우리가 여기에 font-size 를 쓰면 특이도가 (0,3,3)이라 두 화면 모두 13px 이 된다. */
.scbd .list_board tbody tr.empty > td {
    display: block; text-align: center; padding: 50px 5px 42px !important; color: #666;
}

/* ── 1024px 이상: 원본이 pc_skin_955_895.css 로 갈라 내려주던 화면 ── */
@media all and (min-width: 1024px) {
    .scbd .head { border-top: 0; }
    .scbd .head > .nav { border-bottom: 1px solid #aaa; }
    .scbd .head > .nav:after { content: ''; display: block; clear: both; }
    .scbd .head > .nav > ul { float: right; width: auto; display: block; border-bottom: 0; }
    .scbd .head > .nav > ul > li { display: block; float: left; margin-left: 4px; }
    .scbd .head > .nav > ul > li > a {
        padding: 10px 20px; border-width: 1px 1px 0 1px; border-style: solid; border-color: #ccc;
        background: linear-gradient(#fff 0, #ececec 100%);
    }
    .scbd .head > .nav > ul > li:first-child > a { border-left: 1px solid #ccc; }

    .scbd .list_board > table thead { display: table-header-group; }
    .scbd .list_board > table thead th {
        border-bottom: 1px solid #aaa; text-align: center; padding: 15px 5px 14px; font-size: 13px;
        font-weight: 700; color: #333;
    }
    .scbd .list_board tbody tr { display: table-row; border-bottom: 0; padding: 0; }
    .scbd .list_board tbody td { text-align: center; padding: 12px 5px !important; font-size: 13px !important; border-bottom: 1px solid #ccc; }
    .scbd .list_board tbody tr.empty > td { display: table-cell; padding: 50px 0 !important; }
}


/* ── 게시판 위 빈 구분 블록 ────────────────────────────────
 * 원본은 모바일 HTML 에만 이 요소를 넣는다(m_71165.css 의 solid_line__979105__,
 * height:30px). PC HTML 에는 존재하지 않는다. 우리는 한 벌 코드이므로 요소는
 * 항상 두고 데스크톱에서 숨긴다 — 결과 픽셀은 원본과 같다. */
.ez-spacer { box-sizing: border-box; display: block; position: relative; width: 100%; height: 30px; }
@media all and (min-width: 1024px) {
    .ez-spacer-row { display: none; }
}