/* ==========================================================================
   속초교회 서브 페이지 스타일
   - 서브 공통(서브 비주얼/브레드크럼)을 상단에, 개별 서브 페이지(인사말 등)를 아래에 배치
   - 규칙: [1] 기본(1681px 이상) → [2] @media(max-width:1680px) → [3] @media(max-width:750px)
   - 로드: head.sub.php에서 메인(_INDEX_) 외 페이지에만 로드. CSS 변수는 sokcho-common.css :root 사용
   ========================================================================== */

/* ===== [1] 기본 (1681px 이상) ===== */

/* 서브 컨텐츠 영역: 브라우저가 넓어져도 1140(좌우 25px 여백→내용 1090) 안에 — 브레드크럼·본문 공통 정렬 */
#container_wr { max-width: 1140px; }

/* ----- 서브 비주얼 / 브레드크럼 (서브 공통) ----- */
#sk_subvisual { background-size: cover; background-position: center; }
/* 텍스트(d1/title)는 서브 컨텐츠와 동일하게 1140 박스(여백25→내용1090) 안에. 배경은 전폭 cover */
#sk_subvisual .sk_frame { display: flex; flex-direction: column; justify-content: center; max-width: 1140px; min-height: 300px; color: #fff; padding-top: 95px;}
.sk_sv_d1 { margin: 0 0 15px; font-size: 18px; }
.sk_sv_title { font-size: 44px; font-weight: 600; } /* margin은 전역 p{margin:0}, letter-spacing 없음 */

#sk_breadcrumb .sk_inner { padding-top: 58px; padding-bottom: 0; font-size: 14px; color: #000; font-weight: 500; text-align: right; }
/* 하단 라인: 박스(1140)가 아닌 내용 폭(1090)으로 — 푸터 .sk_ft_line과 동일 */
#sk_breadcrumb .sk_inner::after { content: ''; display: block; height: 2px; margin-top: 14px; background: #000; }
#sk_breadcrumb a { color: #000; text-decoration: none; }
#sk_breadcrumb a:hover { color: var(--sk-blue); }
#sk_breadcrumb .sk_bc_sep { margin: 0 8px; }
#sk_breadcrumb strong { color: #000; font-weight: 600; }

/* ----- 회원 페이지 공통 (로그인 · 비밀번호확인 · 회원가입 · 정보수정 · ID/PW 찾기) ----- */
/* #container_wr 에는 상·하 패딩이 없어 회원 스킨이 브레드크럼·푸터에 그대로 붙는다(#1349-3).
   회원 스킨이 들어온 #container 에만 상하 여백을 준다. 팝업(쪽지·스크랩 등)은 #container 밖이라 무영향 */
#container:has(> .register), #container:has(> .mbskin),
#container:has(> #find_info), #container:has(> #pw_reset) { padding: 60px 0 100px; }
/* 로그인·비밀번호확인 박스: 스킨 기본 상단 마진(100px)은 위 패딩과 중복 → 제거. 폭은 조금 넓게 */
#container > .mbskin { width: 420px; max-width: 100%; margin-top: 0; }
/* 스킨 h1 은 서브비주얼 제목과 중복 → 숨김(#mb_login 은 스킨 style.css 에서 이미 숨김 처리됨) */
#container > #mb_confirm h1 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
#container > #mb_confirm { border: 1px solid #dde7e9; border-radius: 5px; background: #fff; }
#container > #mb_confirm p { padding: 40px 20px; }
#container > #mb_confirm fieldset { padding: 40px; }

/* ----- 교회안내 > 인사말 (content.php?co_id=greeting) ----- */
/* 텍스트는 좌측(우측은 사진 폭만큼 비움), 사진은 position:absolute로 우하단 고정(텍스트 높이에 안 밀림) */
/* 사진을 .sk_greeting 배경(우하단)으로 박음 + min-height로 사진 높이 확보 → 콘텐츠 길이·폭 무관하게 항상 우하단 고정(푸터에 붙음) */
.sk_greeting { position: relative; min-height: 661px; padding-bottom: 100px; background: url(/theme/sokcho/assets/img/sub/greeting_img01.jpg) no-repeat right bottom / 427px auto; }
.sk_greeting_txt { position: relative; z-index: 1; } /* 텍스트를 사진 배경 위 레이어로 → 긴 문단이 사진에 안 가림 */
.sk_greeting_txt h2 { margin: 0 0 85px; font-size: 44px; font-weight: 500; line-height: 1.2; letter-spacing: -0.5px; }
.sk_greeting_txt p { margin: 0 0 50px; font-size: 25px; line-height: 1.4; color: #000; }
.sk_greeting_point { color: var(--sk-blue) !important; font-weight: 500; }
.sk_greeting_txt .sk_greeting_body { font-weight: 500; line-height: 2.1; letter-spacing: -1px;} /* 3번째 문단(가·나·다…) */
.sk_greeting_txt .sk_greeting_close { font-size: 18px; font-weight:500; margin-bottom: 28px; line-height: 2.1; letter-spacing: -0.5px;}
/* 하단 마진 0: 마진이 컨테이너 밖으로 빠져 푸터를 밀어내면 배경 사진과 푸터 사이 틈이 생김(붕 뜸) → 0 */
.sk_greeting_txt .sk_greeting_sign { margin: 0; font-size: 25px; font-weight: 500; color: #000; }
.sk_greeting_txt .sk_greeting_sign strong { font-weight: 700; }
/* .sk_greeting_photo 요소: PC/1680에선 위 배경으로 대체하므로 숨김. 모바일에서만 풀폭 요소로 표시 */
.sk_greeting_photo { display: none; width: 100%; aspect-ratio: 427 / 661; background: url(/theme/sokcho/assets/img/sub/greeting_img01.jpg) no-repeat center / contain; border-radius: 10px; }
/* content 스킨 래퍼(#ctt/#ctt_con) 여백 제거 */
#ctt.ctt_greeting { margin: 0; padding: 0; background: none; }
/* 하단 0 → 배경 사진 바닥이 컨테이너 바닥 = 푸터에 붙음 (container_wr 하단패딩도 0) */
#ctt.ctt_greeting #ctt_con { padding: 50px 0 0; }
#container_wr:has(.ctt_greeting) { padding-bottom: 0; } /* 공통 하단 패딩(60px) 제거 — 사진과 푸터 사이 벌어짐 방지 */

/* ----- 단체별 게시판 탭 (말씀과 찬양 > 찬양대 > 7개 단체) ----- */
#sk_dept_tabs .sk_inner { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 28px; }
#sk_dept_tabs a { display: inline-block; padding: 9px 20px; border: 1px solid var(--sk-line); border-radius: 50px; font-size: 16px; color: var(--sk-gray); text-decoration: none; white-space: nowrap; }
#sk_dept_tabs a:hover { border-color: var(--sk-blue); color: var(--sk-blue); }
#sk_dept_tabs a.sk_on { background: var(--sk-blue); border-color: var(--sk-blue); color: #fff; }
/* 찬양대(#D0E3FF)/찬양단(#F7F2EB) 그룹 구분 배경색 — 활성 탭은 그룹색 유지 + 파란 테두리·볼드로 현재 위치 표시 */
#sk_dept_tabs a.sk_tab_choir  { background: rgba(208, 227, 255, .6); border-color: rgba(208, 227, 255, .6); color: var(--sk-text); }
#sk_dept_tabs a.sk_tab_praise { background: rgba(247, 242, 235, .8); border-color: rgba(247, 242, 235, .8); color: var(--sk-text); }
#sk_dept_tabs a.sk_tab_choir:hover, #sk_dept_tabs a.sk_tab_praise:hover { border-color: var(--sk-blue); color: var(--sk-blue); }
#sk_dept_tabs a.sk_tab_choir.sk_on  { border-color: var(--sk-blue); color: var(--sk-blue); font-weight: 700; }
#sk_dept_tabs a.sk_tab_praise.sk_on { border-color: #b8975a; color: #80471c; font-weight: 700; } /* 찬양단 선택: 배경색(크림)의 진한 톤 외곽선·폰트 */

/* ----- 나눔과 섬김 > 선교와 사역 (content.php?co_id=mission) ----- */
#ctt.ctt_mission { margin: 0; padding: 0; background: none; }
#ctt.ctt_mission #ctt_con { padding: 50px 0; }

/* ----- 콘텐츠 디자인 페이지 공통: content 스킨 기본 #ctt(padding:20px·흰배경) 리셋 → 좌우 여백을 greeting/mission과 동일하게 ----- */
#ctt.ctt_newcomer, #ctt.ctt_worship, #ctt.ctt_people, #ctt.ctt_history, #ctt.ctt_location { margin: 0; padding: 0; background: none; }
#ctt.ctt_newcomer #ctt_con, #ctt.ctt_worship #ctt_con, #ctt.ctt_people #ctt_con, #ctt.ctt_history #ctt_con, #ctt.ctt_location #ctt_con { padding: 50px 0; }
.sk_ministry_lead { margin: 0 0 50px; font-size: 30px; font-weight: 500; line-height: 1.4; color: var(--sk-blue); }
.sk_ministry_item { padding: 32px 0; border-top: 1px solid var(--sk-line); }
.sk_ministry_item:first-of-type { border-top: 0; }
.sk_ministry_item h3 { margin: 0 0 14px; font-size: 26px; font-weight: 600; color: var(--sk-text); }
.sk_ministry_item p { margin: 0; font-size: 18px; line-height: 1.7; color: #3c424b; }

/* ----- 행사달력 (board: schedule / skin: sokcho_calendar) ----- */
#sk_cal { padding: 50px 0; }
.sk_cal_top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.sk_cal_nav { display: flex; align-items: center; gap: 12px; }
.sk_cal_arrow { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid var(--sk-line); border-radius: 50%; color: var(--sk-text); font-size: 22px; line-height: 1; text-decoration: none; }
.sk_cal_arrow:hover { border-color: var(--sk-blue); color: var(--sk-blue); }
.sk_cal_title { min-width: 150px; text-align: center; font-size: 26px; font-weight: 600; }
.sk_cal_today_btn { padding: 7px 16px; border: 1px solid var(--sk-line); border-radius: 50px; font-size: 14px; color: var(--sk-gray); text-decoration: none; }
.sk_cal_today_btn:hover { border-color: var(--sk-blue); color: var(--sk-blue); }
.sk_cal_write { padding: 9px 20px; border-radius: 50px; background: var(--sk-blue); color: #fff; font-size: 15px; font-weight: 600; text-decoration: none; }
.sk_cal_write:hover { background: var(--sk-blue-dark); color: #fff; }
.sk_cal_legend { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 12px; }
.sk_cal_lg { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--sk-gray); }
.sk_cal_lg i { width: 12px; height: 12px; border-radius: 3px; }
.sk_cal_grid { display: grid; grid-template-columns: repeat(7, 1fr); border-top: 2px solid #000; border-left: 1px solid var(--sk-line); }
.sk_cal_dow { padding: 10px 0; text-align: center; font-size: 15px; font-weight: 600; background: #fafbfc; border-right: 1px solid var(--sk-line); border-bottom: 1px solid var(--sk-line); }
.sk_cal_dow.sun { color: #e23b3b; } .sk_cal_dow.sat { color: #2d6ff7; }
.sk_cal_cell { min-width: 0; box-sizing: border-box; overflow: hidden; min-height: 112px; padding: 6px; border-right: 1px solid var(--sk-line); border-bottom: 1px solid var(--sk-line); } /* min-width:0 → 반응형에서 긴 일정바가 셀(1fr)을 밀어 그리드가 넘치는 문제 방지(바는 클리핑) */
.sk_cal_cell.sk_cal_out { background: #f6f6f6; } /* 이전/다음 달 날짜(흐리게) */
.sk_cal_cell.sk_cal_out .sk_cal_day { color: #c5cbd3; } /* 다른 달 평일: 연한 회색 */
.sk_cal_cell.sk_cal_out .sk_cal_day.sun { color: #f0a8a8; } /* 다른 달 일요일: 연한 빨강 */
.sk_cal_cell.sk_cal_out .sk_cal_day.sat { color: #a8c5f5; } /* 다른 달 토요일: 연한 파랑 */
.sk_cal_cell.is_today { background: #eef4ff; }
.sk_cal_day { display: block; margin-bottom: 4px; font-size: 14px; font-weight: 600; }
.sk_cal_day.sun { color: #e23b3b; } .sk_cal_day.sat { color: #2d6ff7; }
.sk_cal_day.holi { color: #e23b3b; } /* 공휴일: 빨강(토요일색보다 뒤 → 토요일 공휴일도 빨강) */
.sk_cal_cell.sk_cal_out .sk_cal_day.holi { color: #f0a8a8; } /* 다른 달 공휴일: 연한 빨강 */
.sk_cal_holiname { display: block; margin-bottom: 4px; font-size: 11px; line-height: 1.2; color: #e23b3b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* 공휴일명 */
.sk_cal_out .sk_cal_holiname { color: #f0a8a8; }
.sk_cal_ev { display: block; margin-bottom: 3px; padding: 3px 6px; border-radius: 4px; font-size: 12px; line-height: 1.3; color: #fff; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sk_cal_ev:hover { opacity: .85; }
.sk_cal_ev.sk_cal_ev_out { opacity: .45; } /* 다른 달 칸의 일정: 흐리게 */
.sk_cal_ev.sk_cal_ev_out:hover { opacity: .7; }
/* ----- 행사달력 일정 리스트 패널(C안): 날짜 셀 클릭 → 그 날 일정을 아래에 표시 (PC·모바일 공통) ----- */
.sk_cal_ev { pointer-events: none; } /* 셀 안 일정은 미리보기 — 실제 열람은 날짜 셀 클릭 → 패널 */
.sk_cal_cell:has(.sk_cal_ev) { cursor: pointer; }
.sk_cal_cell.is-selected { background: #dbe8ff; }
.sk_cal_daypanel { display: none; margin-top: 18px; border: 1px solid var(--sk-line); border-radius: 14px; overflow: hidden; }
.sk_cal_daypanel.is-open { display: block; }
.sk_cal_dp_head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; background: #f4f7fb; border-bottom: 1px solid var(--sk-line); }
.sk_cal_dp_date { font-size: 20px; font-weight: 700; color: var(--sk-text); }
.sk_cal_dp_close { border: 0; background: none; font-size: 26px; line-height: 1; color: var(--sk-gray); cursor: pointer; padding: 0 6px; }
.sk_cal_dp_list { margin: 0; padding: 16px; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.sk_cal_dp_item { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 14px 18px; border: 1px solid var(--sk-line); border-radius: 10px; text-decoration: none; color: var(--sk-text); transition: border-color .15s, background .15s; }
.sk_cal_dp_item:hover { border-color: var(--sk-blue); background: #f8fafc; }
.sk_cal_dp_dot { flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; }
.sk_cal_dp_title { font-size: 16px; font-weight: 500; line-height: 1.4; word-break: keep-all; }
/* 일정 상세(view) 날짜 박스 */
.sk_v_caldate { margin-bottom: 18px; padding: 14px 18px; background: #f4f7fb; border-radius: 8px; font-size: 17px; color: var(--sk-text); }
.sk_v_caldate .sk_v_calcat { display: inline-block; margin-left: 10px; padding: 3px 12px; border-radius: 50px; background: var(--sk-blue); color: #fff; font-size: 13px; white-space: nowrap; vertical-align: middle; } /* PC: 날짜와 같은 줄 */
/* write 일정 날짜 입력 */
.bo_w_cal { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 14px 0; }
.bo_w_cal .frm_input { width: auto; }
.bo_w_cal .bo_w_cal_to { margin-left: 12px; }
.bo_w_cal_help { color: var(--sk-gray); font-size: 13px; }
.sk_req { color: #e23b3b; }

/* ----- 영상 게시판 (skin: sokcho_video / 주일설교·수요금요예배·특별집회) ----- */
.sk_vid_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 30px; padding-top: 10px; }
.sk_vid_card { position: relative; }
.sk_vid_thumb { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.sk_vid_thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.sk_vid_card:hover .sk_vid_thumb img { transform: scale(1.04); }
.sk_vid_play { position: absolute; top: 50%; left: 50%; width: 64px; height: 64px; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(0,0,0,.55); transition: background .2s; }
.sk_vid_play::before { content: ''; position: absolute; top: 50%; left: 54%; transform: translate(-50%, -50%); border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent #fff; }
.sk_vid_card:hover .sk_vid_play { background: var(--sk-blue); }
.sk_vid_notice { position: absolute; top: 10px; left: 10px; padding: 3px 10px; background: var(--sk-blue); color: #fff; font-size: 13px; }
.sk_vid_chk { position: absolute; top: 8px; right: 8px; z-index: 2; }
.sk_vid_info { display: block; padding-top: 16px; text-decoration: none; }
.sk_vid_cate { display: inline-block; margin-bottom: 8px; font-size: 15px; font-weight: 500; color: var(--sk-blue); }
.sk_vid_tit { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 20px; font-weight: 500; line-height: 1.4; color: var(--sk-text); }
.sk_vid_tit .new_icon { padding: 1px 5px; background: var(--sk-blue); color: #fff; font-size: 11px; vertical-align: middle; }
.sk_vid_tit .cnt_cmt { color: var(--sk-blue); font-size: 15px; }
.sk_vid_date { display: block; margin-top: 10px; font-size: 15px; color: var(--sk-gray); }
.sk_vid_empty { grid-column: 1 / -1; padding: 80px 0; text-align: center; color: var(--sk-gray); }
/* 상세: 유튜브 iframe 16:9 */
.sk_vid_embed { position: relative; width: 100%; aspect-ratio: 16 / 9; margin: 0 0 30px; background: #000; }
.sk_vid_embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* write: 유튜브 주소 라벨 */
.sk_vid_linklabel { font-weight: 500; color: var(--sk-text); }

/* ===== [2] 중단 (1680px 이하) — PC(1680) 기준 vw 비례 축소 (1px ≒ 0.0595vw, 1680에서 PC와 동일) ===== */
@media (max-width: 1680px) {
    /* 서브 컨텐츠 영역 비례 (브레드크럼 .sk_inner 폭은 common [2]에서 처리) */
    #container_wr { max-width: 67.857vw; }
    #sk_cal { padding: 2.976vw 0; } /* 행사달력 상하 여백 50px→vw(모바일까지 같은 비율) */

    /* 영상 게시판 (vw 비례) */
    .sk_vid_grid { gap: 2.381vw 1.786vw; padding-top: 0.595vw; }
    .sk_vid_play { width: 3.81vw; height: 3.81vw; }
    .sk_vid_play::before { border-width: 0.655vw 0 0.655vw 1.071vw; }
    .sk_vid_info { padding-top: 0.952vw; }
    .sk_vid_cate { margin-bottom: 0.476vw; font-size: 0.893vw; }
    .sk_vid_tit { font-size: 1.19vw; }
    .sk_vid_tit .cnt_cmt { font-size: 0.893vw; }
    .sk_vid_date { margin-top: 0.595vw; font-size: 0.893vw; }
    .sk_vid_embed { margin-bottom: 1.786vw; }

    /* 서브 비주얼 */
    #sk_subvisual .sk_frame { max-width: 67.857vw; min-height: 17.857vw; padding-top: 5.655vw; }
    .sk_sv_d1 { margin: 0 0 0.893vw; font-size: 1.071vw; }
    .sk_sv_title { font-size: 2.619vw; }

    /* 브레드크럼 */
    #sk_breadcrumb .sk_inner { padding-top: 3.452vw; font-size: 0.833vw; }
    #sk_breadcrumb .sk_inner::after { margin-top: 0.833vw; }

    /* 인사말 */
    .sk_greeting_txt h2 { margin: 0 0 5.060vw; font-size: 2.619vw; }
    .sk_greeting_txt p { margin: 0 0 2.976vw; font-size: 1.488vw; }
    .sk_greeting_txt .sk_greeting_close { margin-bottom: 5.952vw; font-size: 1.071vw; }
    .sk_greeting { min-height: 39.345vw; padding-bottom: 5.952vw; background-size: 25.417vw auto; } /* 배경 사진 크기·높이 + 하단여백 vw 비례(100px=5.952vw) */
    #ctt.ctt_greeting #ctt_con { padding: 2.976vw 0 0; } /* 하단 0 → 사진이 푸터에 붙음 */
}

/* ===== [3] 모바일 (750px 이하) ===== */
@media (max-width: 750px) {

    /* [2] vw 폭 리셋 */
    #container_wr { max-width: none; }
    /* 인사말: #container_wr 공통 하단 패딩(60px)이 사진과 푸터를 벌림 → 인사말만 0으로(사진 푸터에 붙임) */
    #container_wr:has(.ctt_greeting) { padding-bottom: 0; }
    /* 회원 페이지: #container_wr 모바일 패딩(상30/하60) 위에 최소 여백만 더한다(#1349-3) */
    #container:has(> .register), #container:has(> .mbskin),
    #container:has(> #find_info), #container:has(> #pw_reset) { padding: 10px 0 40px; }
    #container > .mbskin { width: 100%; }
    #container > #mb_confirm p { padding: 25px 15px; }
    #container > #mb_confirm fieldset { padding: 25px 15px; }
    /* 서브 비주얼 / 브레드크럼 */
    /* 모바일 배경 위치: head.php에서 페이지별 --sv-pos-mo 지정(기본 center, 주로 가로 이동). PC는 center 유지 */
    #sk_subvisual { background-position: var(--sv-pos-mo, center); }
    #sk_subvisual .sk_frame { max-width: none; min-height: 180px; padding-top: unset; padding-bottom: 24vw;}
    .sk_sv_d1 { font-size: 13px; margin-bottom: 4px; }
    .sk_sv_title { font-size: 26px; }
    #sk_breadcrumb .sk_inner { padding-top: 25px; padding-bottom: 10px; font-size: 12px; white-space: nowrap; overflow-x: auto; text-align: right; }

    /* 인사말 (모바일: 텍스트 먼저 → 사진, 사진은 풀폭으로 푸터에 붙임. 텍스트는 750 기준 vw) */
    .sk_greeting { display: flex; flex-direction: column; gap: 28px; background: none; min-height: 0; padding-bottom: 0; } /* 모바일: 배경 해제(사진은 아래 요소로 풀폭), 하단여백 0(사진이 푸터에 붙게) */
    .sk_greeting_txt h2 { font-size: clamp(24px, 8.5vw, 34px); margin-bottom: 12vw; } /* 28px@375, 상한 clamp */
    .sk_greeting_txt p { font-size: clamp(15px, 5.5vw, 22px); margin-bottom: 8vw; } /* 17px@375 */
    .sk_greeting_txt .sk_greeting_close { font-size: clamp(14px, 4.267vw, 16px); margin-bottom: clamp(32px, 10.667vw, 40px); line-height: 1.4;} /* 16px/40px@375 */
    .sk_greeting_txt .sk_greeting_body {font-size: clamp(15px, 4.55vw, 20px); min-height: 0; line-height: 1.6;}
    /* 사진을 푸터에 붙임: #ctt_con 하단 패딩 0 + 사진 풀폭/여백0 */
    #ctt.ctt_greeting #ctt_con { padding: 30px 0 0; }
    .sk_greeting_photo { display: block; position: static; width: 100%; height: auto; aspect-ratio: 427 / 661; margin: 0; }

    /* 선교와 사역 (모바일) */
    #ctt.ctt_mission #ctt_con { padding: 30px 0 50px; }
    /* 콘텐츠 디자인 페이지 공통(모바일) */
    #ctt.ctt_newcomer #ctt_con, #ctt.ctt_worship #ctt_con, #ctt.ctt_people #ctt_con, #ctt.ctt_history #ctt_con, #ctt.ctt_location #ctt_con { padding: 30px 0; }
    .sk_ministry_lead { margin-bottom: 28px; font-size: clamp(18px, 5.3vw, 22px); }
    .sk_ministry_item { padding: 22px 0; }
    .sk_ministry_item h3 { margin-bottom: 10px; font-size: clamp(17px, 5vw, 20px); }
    .sk_ministry_item p { font-size: clamp(14px, 4.3vw, 16px); line-height: 1.6; }

    /* 단체 탭바 (모바일: 줄바꿈) */
    #sk_dept_tabs .sk_inner { flex-wrap: wrap; overflow: visible; gap: 6px; padding-top: 18px; }
    #sk_dept_tabs a { padding: 7px 14px; font-size: 13px; }

    /* 행사달력 (모바일: 칸 축소 + 일정은 점 표시, 클릭 시 상세) */
    .sk_cal_title { min-width: 96px; font-size: 19px; }
    .sk_cal_arrow { width: 32px; height: 32px; font-size: 20px; }
    .sk_cal_write { padding: 7px 14px; font-size: 13px; }
    .sk_cal_dow { padding: 6px 0; font-size: 12px; }
    .sk_cal_cell { min-height: 58px; padding: 3px; text-align: center; }
    .sk_cal_day { font-size: 12px; margin-bottom: 2px; }
    .sk_cal_holiname { display: none; } /* 모바일: 공휴일명 숨김(날짜 빨강만 유지) */
    /* 모바일: 일정은 점(인디케이터, 최대 4개가 한 줄에). 점 자체는 탭 대상 아님 — 날짜 셀을 탭하면 하단 리스트 */
    .sk_cal_ev { display: inline-block; vertical-align: middle; width: 9px; height: 9px; margin: 1px; padding: 0; border-radius: 50%; font-size: 0; line-height: 0; overflow: hidden; }
    /* 패널: 모바일은 카드 그리드 대신 단일 열 행 리스트 */
    .sk_cal_dp_head { padding: 11px 14px; }
    .sk_cal_dp_date { font-size: 15px; }
    .sk_cal_dp_close { font-size: 22px; }
    .sk_cal_dp_list { display: block; padding: 0; }
    .sk_cal_dp_item { min-height: 50px; padding: 12px 14px; border: 0; border-radius: 0; }
    .sk_cal_dp_list li + li .sk_cal_dp_item { border-top: 1px solid #f0f2f5; }
    .sk_cal_dp_dot { width: 10px; height: 10px; }
    .sk_cal_dp_title { font-size: 15px; font-weight: 400; }
    .sk_v_caldate .sk_v_calcat { display: block; width: fit-content; margin: 10px 0 0; } /* 모바일: 칩 다음 줄(짤림 방지) */

    /* 영상 게시판 (모바일: 2열) */
    .sk_vid_grid { grid-template-columns: repeat(2, 1fr); gap: 24px 14px; padding-top: 4px; }
    .sk_vid_play { width: 44px; height: 44px; }
    .sk_vid_play::before { border-width: 8px 0 8px 13px; }
    .sk_vid_info { padding-top: 12px; }
    .sk_vid_cate { margin-bottom: 5px; font-size: 13px; }
    .sk_vid_tit { font-size: 15px; }
    .sk_vid_tit .cnt_cmt { font-size: 13px; }
    .sk_vid_date { margin-top: 7px; font-size: 13px; }
    .sk_vid_embed { margin-bottom: 20px; }
}

/* ===== 교육 부서 게시판 상단 소개(.sk-dept) — pages/dept_*.php 공통 ===== */
.sk-dept{--dp-blue:#2d6ff7;--dp-ink:#1b1b1b;--dp-sub:#3c424b;--dp-gray:#767c86;--dp-line:#e5e7eb;--dp-band:#f4f7fb;--dp-soft:#eaf1ff;word-break:keep-all;color:var(--dp-sub);margin:44px 0}
.sk-dept *{box-sizing:border-box}
.sk-dept .dp-hero{border-radius:18px;overflow:hidden;line-height:0;box-shadow:0 12px 34px rgba(20,28,45,.12)}
.sk-dept .dp-hero img{width:100%;height:auto;display:block}
.sk-dept .dp-head{text-align:center;padding:32px 10px 4px}
.sk-dept .dp-age{display:inline-block;font-size:14px;font-weight:700;color:var(--dp-blue);background:var(--dp-soft);border-radius:50px;padding:6px 16px;margin-bottom:14px}
.sk-dept .dp-name{font-size:34px;font-weight:800;letter-spacing:-.03em;color:var(--dp-ink);margin:0 0 12px}
.sk-dept .dp-slogan{max-width:760px;margin:0 auto;font-size:19px;font-weight:600;line-height:1.6;color:var(--dp-blue)}
.sk-dept .dp-cards{display:grid;grid-template-columns:1fr 1fr 1.7fr;gap:14px;margin:30px 0}
.sk-dept .dp-card{background:var(--dp-band);border:1px solid var(--dp-line);border-radius:14px;padding:20px 22px;display:flex;flex-direction:column;gap:7px}
.sk-dept .dp-k{font-size:13px;font-weight:700;color:var(--dp-gray);letter-spacing:.02em}
.sk-dept .dp-v{font-size:18px;font-weight:700;color:var(--dp-ink);line-height:1.4}
.sk-dept .dp-card-wide{background:var(--dp-soft);border-color:#d8e4fb}
.sk-dept .dp-verse,
.sk-dept .dp-cardsub{font-size:14px;font-weight:600;color:var(--dp-blue);font-style:normal;margin-top:2px}
.sk-dept .dp-body{display:flex;flex-direction:column;gap:26px;margin:34px 0}
.sk-dept .dp-block h3{position:relative;font-size:22px;font-weight:700;color:var(--dp-ink);margin:0 0 12px;padding-left:16px;letter-spacing:-.02em}
.sk-dept .dp-block h3::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:5px;border-radius:3px;background:var(--dp-blue)}
.sk-dept .dp-block p{font-size:17px;line-height:1.85;margin:0}
/* 목록형 본문(‘이런 분들께 추천합니다’ 등) — pages/dept_bible.php 부터 사용 */
.sk-dept .dp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sk-dept .dp-list li{position:relative;padding-left:26px;font-size:17px;line-height:1.8}
.sk-dept .dp-list li::before{content:'';position:absolute;left:6px;top:12px;width:7px;height:7px;border-radius:50%;background:var(--dp-blue)}
/* 카드 묶음 아래 보조 안내 한 줄 */
.sk-dept .dp-note{margin:-16px 0 0;font-size:14.5px;color:var(--dp-gray);line-height:1.7}
.sk-dept .dp-gallery-head{margin:42px 0 0;padding-top:30px;border-top:1px solid var(--dp-line)}
.sk-dept .dp-gallery-head h3{font-size:22px;font-weight:700;color:var(--dp-ink);margin:0 0 6px;letter-spacing:-.02em}
.sk-dept .dp-gallery-head p{font-size:15px;color:var(--dp-gray);margin:0}
@media (max-width:900px){
  .sk-dept .dp-hero{border-radius:12px}
  .sk-dept .dp-head{padding-top:24px}
  .sk-dept .dp-name{font-size:26px}
  .sk-dept .dp-slogan{font-size:16px}
  .sk-dept .dp-cards{grid-template-columns:1fr;gap:10px;margin:22px 0}
  .sk-dept .dp-card{padding:16px 18px}
  .sk-dept .dp-block h3{font-size:19px}
  .sk-dept .dp-block p{font-size:15px}
  .sk-dept .dp-list li{font-size:15px;padding-left:22px}
  .sk-dept .dp-list li::before{top:10px}
  .sk-dept .dp-note{margin-top:-10px;font-size:13.5px}
  .sk-dept .dp-gallery-head h3{font-size:19px}
}

/* ===== 찬양대 게시판(2040 하위): 탭 아래 대표 사진 ===== */
#sk_choir_photo { margin: 44px 0 6px; } /* 상단 44px = 교육 탭→부서소개 간격(container_wr top 0 + .sk-dept top 44)과 동일 (PC/1680) */
#sk_choir_photo .sk_inner img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 8px 24px rgba(20,28,45,.1); }
@media (max-width: 750px) {
  .sk-dept { margin-top: 0; } /* 교육: 모바일 부서소개 상단 마진 0 (탭 아래 간격은 container_wr 상단패딩 30px) */
  #sk_choir_photo { margin: 30px 0 4px; } /* 상단 30px = 교육 모바일 탭→부서소개 간격(container_wr top 30 + .sk-dept top 0)과 동일 */
  #sk_choir_photo .sk_inner img { border-radius: 10px; }
}

/* ==========================================================================
   게시판 공통 타이포·버튼 확대 (basic·gallery 공통)
   - 기본 스킨은 default.css body{font-size:0.75em=12px}에서 em 파생 → 사이트 폰트 대비 작음
   - 목록/본문/버튼/페이지네이션을 사이트 스케일에 맞춰 한 단계 상향
   ========================================================================== */
/* 목록 테이블 */
.tbl_head01 thead th { font-size: 15px; }
.tbl_head01 td { font-size: 15px; }
#bo_list .bo_tit, #bo_list .bo_tit a { font-size: 16px; }
#bo_list_total { font-size: 14px; }
/* 검색바 */
.bo_sch .sch_input, .bo_sch select, .bo_sch .sch_btn { font-size: 15px; }
/* 페이지네이션(탭 영역·글자 함께 확대) */
.pg_page, .pg_current { font-size: 15px; height: 36px; line-height: 34px; min-width: 36px; }
/* 게시글 보기: 제목·정보·본문 */
#bo_v_title .bo_v_tit { font-size: 28px; }
#bo_v_info .profile_info_ct, #bo_v_info .profile_info_ct strong { font-size: 14px; }
#bo_v_con { font-size: 17px; line-height: 1.85; }
.bo_v_nb li a { font-size: 15px; }
.bo_v_nb .nb_tit { font-size: 13.5px; }
#bo_v_file li a strong, #bo_v_link li a strong { font-size: 15px; }
/* 댓글 본문 */
#bo_vc .cmt_contents, #bo_vc .cmt_content { font-size: 15px; line-height: 1.7; }
/* 버튼: 아이콘·일반 버튼 살짝 크게, 등록/확인(주요 액션)은 더 크게 */
a.btn, .btn { font-size: 1.5em; }
#bo_v_share .btn { font-size: 14px; }
.btn_submit, .btn_cancel { font-size: 16px; }

@media (max-width: 750px) {
  #bo_v_title .bo_v_tit { font-size: 22px; }
  #bo_v_con { font-size: 16px; }
  .tbl_head01 td, .tbl_head01 thead th { font-size: 14px; }
  #bo_list .bo_tit, #bo_list .bo_tit a { font-size: 15px; }
}
