@charset "utf-8";

.gyodok-wrap { width:100%; color:#222; }
.gyodok-table { width:100%; border-collapse:collapse; border-top:2px solid #333; }
.gyodok-table th, .gyodok-table td { padding:13px 10px; border-bottom:1px solid #e5e5e5; text-align:center; font-size:14px; }
.gyodok-table th { background:#f7f8fa; font-weight:700; color:#333; }
.gyodok-table td.gyodok-subject { text-align:left; }
.gyodok-table td.gyodok-subject a { color:#222; text-decoration:none; }
.gyodok-table td.gyodok-subject a:hover { color:#1d4775; text-decoration:underline; }
.gyodok-empty { padding:35px 10px !important; color:#777; }
.gyodok-toolbar { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:0 0 16px; width:100%; }
.gyodok-toolbar-left { display:flex; align-items:center; flex-wrap:nowrap; gap:12px; min-width:0; }
.gyodok-count { flex:0 0 auto; color:#666; font-size:13px; white-space:nowrap; }
.gyodok-toolbar-right { display:flex; align-items:center; justify-content:flex-end; flex-wrap:nowrap; gap:6px; min-width:0; }
.gyodok-btn { display:inline-flex; flex:0 0 auto; justify-content:center; align-items:center; box-sizing:border-box; height:36px; padding:0 11px; border:1px solid #ccc; border-radius:4px; background:#fff; color:#333; text-decoration:none; font-size:13px; white-space:nowrap; cursor:pointer; }
.gyodok-btn.primary { background:#24496f; border-color:#24496f; color:#fff; }
.gyodok-paging { margin:22px 0; text-align:center; }
.gyodok-paging a, .gyodok-paging strong { display:inline-block; min-width:30px; padding:7px 9px; margin:0 2px; border:1px solid #ddd; color:#444; text-decoration:none; }
.gyodok-paging strong { background:#24496f; border-color:#24496f; color:#fff; }
.gyodok-view-head { padding:18px 14px; margin-bottom:22px; border-top:2px solid #333; border-bottom:1px solid #ddd; background:#fafafa; }
.gyodok-view-head h2 { margin:0; color:#233f60; font-size:22px; line-height:1.4; }
.gyodok-content { padding:8px 12px 28px; font-family:inherit; line-height:1.5; word-break:keep-all; overflow-wrap:anywhere; }
.gyodok-line { min-height:1.5em; margin:0; line-height:1.5; }
.gyodok-style-1 { margin-bottom:.5em; color:#111; font-size:18px; font-weight:400; line-height:1.5; min-height:0; }
.gyodok-style-2 { box-sizing:border-box; margin-bottom:1em; color:#173d68; font-size:20px; font-weight:700; line-height:1.5; min-height:0; }
.gyodok-style-3 { color:#111; font-size:21px; font-weight:700; }
.gyodok-line-empty { height:.75em; }
.gyodok-view-actions { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; padding:14px 0; border-top:1px solid #ddd; }

.gyodok-prev-next { display:flex; margin-top:18px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; }
.gyodok-pn { display:flex; flex:1 1 0; align-items:center; gap:6px; min-width:0; min-height:46px; padding:7px 10px; box-sizing:border-box; color:#333; text-decoration:none; }
.gyodok-pn-next { border-left:1px solid #eee; }
a.gyodok-pn:hover { background:#f7f9fb; color:#173d68; }
.gyodok-pn-label, .gyodok-pn-no { flex:0 0 auto; color:#24496f; font-size:13px; font-weight:700; white-space:nowrap; }
.gyodok-pn-no { font-weight:400; }
.gyodok-pn-subject { flex:1 1 auto; min-width:0; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gyodok-view-actions .right { display:flex; gap:6px; }
.gyodok-form { border-top:2px solid #333; }
.gyodok-form-row { display:flex; align-items:flex-start; gap:14px; padding:13px 10px; border-bottom:1px solid #e5e5e5; }
.gyodok-form-row label { flex:0 0 105px; padding-top:9px; font-weight:700; color:#333; }
.gyodok-form-row input, .gyodok-form-row textarea { box-sizing:border-box; width:100%; padding:10px; border:1px solid #ccc; border-radius:3px; font:inherit; }
.gyodok-form-row input { max-width:420px; }
.gyodok-form-row textarea { min-height:380px; line-height:1.6; resize:vertical; }
.gyodok-help { margin:6px 0 0; color:#777; font-size:12px; line-height:1.5; }
.gyodok-form-actions { display:flex; justify-content:center; gap:8px; padding:18px 0; }
@media (max-width:640px) {
  .gyodok-table th, .gyodok-table td { padding:10px 5px; font-size:12px; }
  .gyodok-table .gyodok-hide-mobile { display:none; }
  .gyodok-view-head h2 { font-size:19px; }
  .gyodok-content { padding-left:4px; padding-right:4px; }
  .gyodok-style-1 { font-size:17px; }
  .gyodok-style-2 { font-size:19px; }
  .gyodok-style-3 { font-size:20px; }
  .gyodok-form-row { display:block; }
  .gyodok-form-row label { display:block; padding:0 0 8px; }
}


/* 상단 검색: 왼쪽 배치, 입력칸은 기존보다 3배 넓게 */
.gyodok-search { flex:0 0 auto; margin:0; padding:0; border:0; }
.gyodok-search form { display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:center; gap:5px; margin:0; }
.gyodok-search input[type="text"] { box-sizing:border-box; width:16.5ch; min-width:16.5ch; height:36px; padding:0 7px; border:1px solid #d5d9df; border-radius:3px; background:#fff; color:#333; font:inherit; font-size:13px; outline:none; }
.gyodok-search input[type="text"]:focus { border-color:#24496f; box-shadow:0 0 0 2px rgba(36,73,111,.10); }
.gyodok-search-btn, .gyodok-search-reset { display:inline-flex; flex:0 0 auto; justify-content:center; align-items:center; gap:4px; box-sizing:border-box; height:36px; padding:0 10px; border:1px solid #24496f; border-radius:3px; background:#24496f; color:#fff; font-size:13px; line-height:1; white-space:nowrap; text-decoration:none; cursor:pointer; }
.gyodok-search-reset { border-color:#cfd4da; background:#fff; color:#444; }
.gyodok-search-btn:hover { background:#173653; border-color:#173653; }
.gyodok-search-reset:hover { background:#f1f3f5; }

/* 짝수 행 음영 및 마우스 오버 */
.gyodok-table tbody tr.gyodok-even { background:#f6f8fa; }
.gyodok-table tbody tr { transition:background-color .18s ease; }
.gyodok-table tbody tr:hover { background:#e8f0f8; }
.gyodok-table tbody tr:hover td { color:#1d3550; }
.gyodok-table tbody tr:hover .gyodok-subject a { color:#173d68; }

/* 페이지 번호 원형 정렬: 숫자 수직·수평 중앙 */
.gyodok-paging { margin:24px 0; text-align:center; }
.gyodok-paging .pg, .gyodok-paging { line-height:1; }
.gyodok-paging a, .gyodok-paging strong,
.gyodok-paging .pg_page, .gyodok-paging .pg_current {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box;
    width:36px;
    height:36px;
    min-width:36px;
    margin:0 2px;
    padding:0 !important;
    border:1px solid #d9dee5;
    border-radius:50%;
    line-height:1 !important;
    vertical-align:middle;
    text-align:center;
    text-decoration:none;
    font-size:13px;
}
.gyodok-paging strong, .gyodok-paging .pg_current { background:#24496f; border-color:#24496f; color:#fff; font-weight:700; }
.gyodok-paging a, .gyodok-paging .pg_page { background:#fff; color:#444; }
.gyodok-paging a:hover, .gyodok-paging .pg_page:hover { background:#e8f0f8; border-color:#9eb2c8; color:#173d68; }
@media (max-width:640px) {
  .gyodok-toolbar { gap:5px; }
  .gyodok-toolbar-left { gap:7px; }
  .gyodok-count { font-size:11px; }
  .gyodok-toolbar-right { gap:4px; }
  .gyodok-btn { height:34px; padding:0 7px; font-size:11px; }
  .gyodok-search form { gap:4px; }
  .gyodok-search input[type="text"] { width:15ch; min-width:15ch; height:34px; padding:0 5px; font-size:12px; }
  .gyodok-search-btn, .gyodok-search-reset { height:34px; padding:0 7px; font-size:11px; }
  .gyodok-paging a, .gyodok-paging strong, .gyodok-paging .pg_page, .gyodok-paging .pg_current { width:32px; height:32px; min-width:32px; margin:0 1px; }
}

/* 페이지 이동 버튼(<<, <, >, >>): 테마의 글자 숨김/배경 이미지 무력화 */
.gyodok-paging a.pg_start, .gyodok-paging a.pg_prev, .gyodok-paging a.pg_next, .gyodok-paging a.pg_end {
    text-indent:0 !important;
    font-size:13px !important;
    font-weight:700;
    letter-spacing:-1px;
    background-image:none !important;
    overflow:visible !important;
}

/* PC/모바일 페이지 번호 전환 (모바일은 5개씩) */
.gyodok-paging-mobile { display:none; }
@media (max-width:640px) {
  .gyodok-paging-pc { display:none; }
  .gyodok-paging-mobile { display:block; white-space:nowrap; }
  .gyodok-paging-mobile a, .gyodok-paging-mobile strong { width:30px; height:30px; min-width:30px; }
  .gyodok-pn { gap:4px; padding:7px 6px; }
  .gyodok-pn-label, .gyodok-pn-no, .gyodok-pn-subject { font-size:12px; }
}

/* 설교 게시판 스타일 목록: 심플한 헤더, 줄 구분선, 행 전체 회색 hover */
.gyodok-table { border-top:1px solid #222; }
.gyodok-table thead th { padding:12px 8px; background:none; border-bottom:1px solid #ccc; color:#888; font-size:13px; font-weight:500; }
.gyodok-table tbody td { padding:17px 8px; border-bottom:1px solid #eee; color:#444; font-size:15px; vertical-align:middle; }
.gyodok-table tbody tr { background:none; }
.gyodok-table tbody tr:hover { background:#f3f3f3; }
.gyodok-table tbody tr:hover td { color:#444; }
.gyodok-table tbody td.gyodok-subject { padding-left:14px; line-height:1.5; }
.gyodok-table tbody td.gyodok-subject a { color:#222; font-size:15px; font-weight:500; }
.gyodok-table tbody tr:hover .gyodok-subject a { color:#222; text-decoration:none; }
.gyodok-new { display:inline-block; margin-left:6px; padding:0 5px; border-radius:2px; background:#ee7a1a; color:#fff; font-size:11px; font-weight:700; line-height:16px; vertical-align:middle; }
.gyodok-ch-unit { display:none; }
@media (max-width:640px) {
  .gyodok-table thead th { padding:10px 4px; font-size:12px; }
  .gyodok-table tbody td { padding:13px 4px; font-size:13px; }
  .gyodok-table tbody td.gyodok-subject { padding-left:6px; }
  .gyodok-table tbody td { height:66px; }
  .gyodok-table tbody td.gyodok-ch { color:#ee7a1a; font-weight:700; white-space:nowrap; }
  .gyodok-ch-unit { display:inline; }
  .gyodok-table tbody td.gyodok-subject a { display:inline; font-size:15px; line-height:1.4; }
}

/* view: 네이비 + 골드 포인트의 차분한 디자인 */
.gyodok-view-head { padding:30px 20px 26px; margin-bottom:0; text-align:center; border:0; border-top:1px solid #e6e1d6; border-bottom:1px solid #e6e1d6; background:linear-gradient(#fbfaf7, #fff); }
.gyodok-view-head h2 { margin:0; color:#173d68; font-size:30px; font-weight:700; line-height:1.3; letter-spacing:-.01em; }
.gyodok-view-bible { display:inline; margin:0 0 0 12px; color:#173d68; font-size:calc(19px + 2pt); font-weight:400; letter-spacing:0; }
.gyodok-content { padding:32px 26px 38px; line-height:1.85; }
.gyodok-line { padding-left:14px; border-left:2px solid transparent; line-height:1.85; }
.gyodok-style-1 { margin-bottom:.35em; color:#333; }
.gyodok-style-2 { margin-bottom:1.2em; color:#173d68; }
.gyodok-style-3 { margin-bottom:.6em; color:#111; border-left-color:#173d68; }
.gyodok-line-empty { padding-left:0; border-left:0; }
.gyodok-prev-next { margin-top:26px; border:1px solid #e8e4da; border-radius:4px; background:#fcfbf8; overflow:hidden; }
.gyodok-view-actions { padding:18px 0 4px; border-top:0; }
.gyodok-view-actions .gyodok-btn { height:40px; padding:0 18px; border-radius:2px; font-size:13px; letter-spacing:.02em; transition:background-color .18s ease, border-color .18s ease, color .18s ease; }
.gyodok-view-actions .gyodok-btn:hover { border-color:#173d68; color:#173d68; }
.gyodok-view-actions .gyodok-btn.primary:hover { background:#173653; border-color:#173653; color:#fff; }
@media (max-width:640px) {
  .gyodok-view-head { padding:24px 14px 20px; }
  .gyodok-view-head h2 { font-size:25px; }
  .gyodok-view-bible { margin-left:10px; font-size:calc(18px + 2pt); }
  .gyodok-content { padding:24px 0 28px; }
  .gyodok-line { padding-left:0; border-left:0; }
  .gyodok-view-actions .gyodok-btn { height:38px; padding:0 12px; }
}

/* 조회수 정렬 삼각형 */
.gyodok-th-hit { white-space:nowrap; }
.gyodok-sort { display:inline-flex; flex-direction:column; vertical-align:middle; margin-left:4px; }
.gyodok-sort a { display:block; height:10px; color:#bbb; font-size:13px; line-height:10px; text-decoration:none; }
.gyodok-sort a:hover { color:#555; }
.gyodok-sort a.on { color:#ee7a1a; }

/* 3번 줄의 (다같이): 글씨 4pt 작게 + 자주색 */
.gyodok-style-3 .gyodok-together { color:#8b2f8b; font-size:calc(21px - 4pt); font-weight:700; }
@media (max-width:640px) {
  .gyodok-style-3 .gyodok-together { font-size:calc(20px - 4pt); }
}

/* (다같이)를 제외한 (xxx): 글씨 3pt 작게 (줄 글씨 크기 기준) */
.gyodok-line .gyodok-note { font-size:calc(1em - 3pt); }

/* 4로 시작하는 줄: 3번 줄과 같은 스타일, 왼쪽 세로선(ㅣ)만 제거 */
.gyodok-line.gyodok-style-4 { border-left-color:transparent; }
