@charset "utf-8";
/* ===== 의성중부교회 예배(설교) 게시판 스킨 : worship ===== */

#worship_wrap { margin: 0 auto; }
#worship_wrap * { box-sizing: border-box; }

/* 페이지 타이틀 */
#worship_wrap .worship_pagetitle { text-align: center; margin: 4px 0 40px; }
#worship_wrap .worship_pagetitle .wpt_eng { display: block; letter-spacing: 6px; color: #2f9e63; font-weight: 700; font-size: 14px; font-family: 'Pretendard', sans-serif; margin-bottom: 12px; }
#worship_wrap .worship_pagetitle h2 { font-size: 40px; font-weight: 800; color: #1e2536; margin: 0; font-family: 'Pretendard', 'NotoSans', sans-serif; letter-spacing: -1px; }
#worship_wrap .worship_pagetitle h2::after { content: ""; display: block; width: 50px; height: 3px; background: linear-gradient(90deg, #2f9e63, #2f6db3); border-radius: 3px; margin: 18px auto 0; }
@media (max-width: 768px) {
    #worship_wrap .worship_pagetitle { margin-bottom: 30px; }
    #worship_wrap .worship_pagetitle h2 { font-size: 28px; }
}

/* 상단 대표 설교 (최신글 worship_top 삽입) */
.worship_feature { margin-bottom: 40px; }

/* 상단 버튼줄 */
#worship_btn_top { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; border-top: 2px solid #2f6db3; border-bottom: 1px solid #e5e5e5; flex-wrap: wrap; gap: 10px; }
#worship_total { font-size: 15px; color: #333; }
#worship_total span { color: #2f6db3; font-weight: 700; }
#worship_btn_top .btn_bo_user { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; position: relative; }
#worship_btn_top .btn_bo_user .btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #ddd; border-radius: 6px; color: #555; background: #fff; }
#worship_btn_top .btn_bo_user .btn:hover { background: #2f6db3; color: #fff; border-color: #2f6db3; }
#worship_btn_top .more_opt { display: none; position: absolute; right: 0; top: 44px; background: #fff; border: 1px solid #ddd; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,.12); z-index: 30; min-width: 130px; padding: 6px; }
#worship_btn_top .more_opt li { display: block; }
#worship_btn_top .more_opt button { width: 100%; text-align: left; background: none; border: 0; padding: 8px 10px; cursor: pointer; border-radius: 4px; color: #444; }
#worship_btn_top .more_opt button:hover { background: #f2f5fc; color: #2f6db3; }

#worship_allchk { padding: 12px 4px; }
#worship_allchk label { cursor: pointer; color: #555; font-size: 14px; }

/* 목록 */
.worship_list { list-style: none; margin: 18px 0 30px; padding: 0; }
.worship_item { display: flex; gap: 22px; align-items: center; padding: 18px; border: 1px solid #ececec; border-radius: 10px; margin-bottom: 14px; transition: box-shadow .35s, border-color .35s, transform .35s cubic-bezier(.22,.61,.36,1); position: relative; }
.worship_item:hover { border-color: #2f6db3; box-shadow: 0 10px 26px rgba(47,95,196,.12); transform: translateY(-3px); }
.worship_item.now { border-color: #2f6db3; background: #f7f9ff; }
.worship_chk { position: absolute; left: 10px; top: 10px; z-index: 3; }

.worship_thumb { flex: 0 0 280px; position: relative; }
.worship_thumb a { display: block; position: relative; border-radius: 8px; overflow: hidden; background: #f2f2f2; }
.worship_thumb img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform .6s cubic-bezier(.22,.61,.36,1); }
.worship_item:hover .worship_thumb img { transform: scale(1.06); }
.worship_thumb .no_img { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 16/9; color: #bbb; font-size: 13px; }

.worship_body { flex: 1; min-width: 0; }
.worship_tit { display: block; font-size: 20px; font-weight: 700; color: #222; line-height: 1.4; text-decoration: none; }
.worship_tit:hover { color: #2f6db3; }
.worship_tit .is_notice { display: inline-block; background: #2f6db3; color: #fff; font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 4px; vertical-align: middle; margin-right: 4px; }
.worship_tit .new_icon { display: inline-block; background: #ff5722; color: #fff; font-size: 11px; padding: 1px 6px; border-radius: 4px; vertical-align: middle; margin-left: 6px; }
.worship_tit .cnt_cmt { color: #2f6db3; font-size: 15px; margin-left: 6px; }
.worship_desc { color: #666; font-size: 15px; line-height: 1.6; margin: 10px 0 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.worship_meta { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; }
.worship_meta dd { margin: 0; font-size: 14px; color: #444; }
.worship_meta dd span { display: inline-block; background: #f1f3f7; color: #667; font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 4px; margin-right: 6px; }
.worship_empty { text-align: center; padding: 60px 0; color: #999; border: 1px solid #ececec; border-radius: 10px; }

/* 재생버튼(공통) */
.playbt { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 62px; height: 44px; background: rgba(0,0,0,.72); border-radius: 12px; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 26px; transition: background .2s, transform .2s; }
a:hover > .playbt { background: #ff0000; }

/* 글쓰기 */
#bo_w .write_div { margin-bottom: 12px; }
#bo_w .frm_input { width: 100%; padding: 12px 14px; border: 1px solid #ddd; border-radius: 6px; font-size: 15px; }
#bo_w textarea.frm_input { min-height: 80px; resize: vertical; }
#bo_w .bo_w_info { display: flex; flex-wrap: wrap; gap: 10px; }
#bo_w .half_input { width: auto; flex: 1; min-width: 180px; }
#bo_w .bo_v_option { list-style: none; padding: 0; margin: 0 0 12px; display: flex; gap: 18px; }
#bo_w .bo_v_option .chk_box label { cursor: pointer; }
#bo_w .btn_confirm { display: flex; justify-content: center; gap: 10px; margin-top: 24px; }
#bo_w .btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 34px; border-radius: 6px; font-size: 16px; text-decoration: none; cursor: pointer; border: 0; }
#bo_w .btn_submit { background: #2f6db3; color: #fff; }
#bo_w .btn_cancel { background: #eee; color: #555; }
#bo_w #btn_autosave { margin-top: 8px; background: #666; color: #fff; border: 0; padding: 8px 14px; border-radius: 6px; cursor: pointer; font-size: 13px; }
#bo_w #btn_autosave:hover { background: #444; }

/* 임시 저장된 글 팝업: 기본 숨김 */
#bo_w #autosave_pop { display: none; margin-top: 10px; border: 1px solid #ddd; border-radius: 8px; padding: 16px; background: #fafbfc; box-shadow: 0 4px 14px rgba(0,0,0,.06); }
#bo_w #autosave_pop strong { display: block; font-size: 15px; margin-bottom: 10px; color: #333; }
#bo_w #autosave_pop ul { list-style: none; margin: 0 0 10px; padding: 0; }
#bo_w #autosave_pop ul li { padding: 8px 4px; border-bottom: 1px solid #eee; font-size: 14px; }
#bo_w #autosave_pop .autosave_close { background: #eee; color: #555; border: 0; padding: 7px 16px; border-radius: 6px; cursor: pointer; }

/* 항목 라벨 (설교 필드 · 링크 · 파일 공통) */
#bo_w .wr_label { display: block; font-size: 14px; font-weight: 600; color: #555; margin-bottom: 6px; }
#bo_w .wr_label i { color: #2f6db3; margin-right: 5px; }

/* 링크 / 파일 영역 정리 */
#bo_w .bo_w_link, #bo_w .bo_w_flie { padding: 14px 16px; border: 1px solid #eee; border-radius: 8px; background: #fbfbfb; }
#bo_w .file_wr { margin: 0; }
#bo_w .frm_file { display: inline-block; width: 100%; padding: 9px 10px; border: 1px solid #ddd; border-radius: 6px; background: #fff; font-size: 14px; }
#bo_w .file_del { display: inline-block; margin-top: 8px; font-size: 13px; color: #888; }

/* 보기 */
.worship_view #bo_v_title { font-size: 26px; font-weight: 700; color: #222; margin: 10px 0 14px; }
.worship_v_meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 14px 0; border-top: 2px solid #2f6db3; border-bottom: 1px solid #e5e5e5; margin-bottom: 18px; }
.worship_v_meta .wv_bible { background: #2f6db3; color: #fff; font-weight: 600; padding: 4px 12px; border-radius: 5px; font-size: 14px; }
.worship_v_meta .wv_item { color: #555; font-size: 14px; }
.worship_v_meta .wv_item b { color: #999; font-weight: 600; margin-right: 4px; }
.worship_embed { position: relative; padding-top: 56.25%; margin-bottom: 24px; border-radius: 8px; overflow: hidden; background: #000; }
.worship_embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.worship_view #bo_v_con { font-size: 16px; line-height: 1.8; color: #333; min-height: 120px; }
.worship_view #bo_v_con img { max-width: 100%; height: auto; }
.worship_view #bo_v_top { position: relative; margin-bottom: 16px; }
.worship_view #bo_v_top .btn_bo_user { list-style: none; display: flex; gap: 6px; padding: 0; margin: 0; position: relative; justify-content: flex-end; }
.worship_view #bo_v_top .btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #ddd; border-radius: 6px; color: #555; }
.worship_view #bo_v_top .more_opt { display: none; position: absolute; right: 0; top: 44px; background: #fff; border: 1px solid #ddd; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,.12); z-index: 30; min-width: 120px; padding: 6px; }
.worship_view #bo_v_top .more_opt a { display: flex; justify-content: space-between; padding: 8px 10px; color: #444; text-decoration: none; border-radius: 4px; }
.worship_view #bo_v_top .more_opt a:hover { background: #f2f5fc; color: #2f6db3; }
.worship_view .bo_v_nb { list-style: none; padding: 0; margin: 24px 0; border-top: 1px solid #eee; }
.worship_view .bo_v_nb li { padding: 14px 4px; border-bottom: 1px solid #eee; }
.worship_view .bo_v_nb .nb_tit { display: inline-block; width: 80px; color: #999; font-size: 13px; }
.worship_view .bo_v_nb a { color: #444; text-decoration: none; }
.worship_view .bo_v_nb a:hover { color: #2f6db3; }
.worship_view .bo_fx { margin: 20px 0; text-align: center; }
.worship_view .bo_fx .btn_bo_user { list-style: none; display: inline-flex; gap: 8px; padding: 0; }
.worship_view .bo_fx .btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 22px; border: 1px solid #ddd; border-radius: 6px; color: #555; text-decoration: none; }
.worship_view #bo_v_file { margin: 20px 0; padding: 16px; background: #f8f9fb; border-radius: 8px; }
.worship_view #bo_v_file ul { list-style: none; padding: 0; margin: 0; }

/* 게시판 검색 */
.bo_sch_wrap { display: none; position: fixed; inset: 0; z-index: 9999; }
.bo_sch_wrap .bo_sch_bg { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.bo_sch_wrap .bo_sch { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: #fff; padding: 30px; border-radius: 10px; width: 90%; max-width: 460px; z-index: 2; }
.bo_sch_wrap .bo_sch h3 { margin: 0 0 16px; font-size: 20px; }
.bo_sch_wrap .sch_bar { display: flex; gap: 8px; margin-top: 10px; }
.bo_sch_wrap .sch_input { flex: 1; padding: 12px; border: 1px solid #ddd; border-radius: 6px; }
.bo_sch_wrap select#sfl { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; }
.bo_sch_wrap .sch_btn { padding: 0 18px; background: #2f6db3; color: #fff; border: 0; border-radius: 6px; cursor: pointer; }
.bo_sch_wrap .bo_sch_cls { position: absolute; right: 12px; top: 12px; background: none; border: 0; font-size: 20px; color: #999; cursor: pointer; }

/* 유튜브 팝업 */
#worship_yt_modal { display: none; position: fixed; inset: 0; z-index: 100000; }
#worship_yt_modal.on { display: block; }
#worship_yt_modal .wym_dim { position: absolute; inset: 0; background: rgba(0,0,0,.85); }
#worship_yt_modal .wym_box { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 92%; max-width: 900px; }
#worship_yt_modal .wym_video { position: relative; padding-top: 56.25%; background: #000; border-radius: 8px; overflow: hidden; }
#worship_yt_modal .wym_video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
#worship_yt_modal .wym_close { position: absolute; right: -6px; top: -46px; width: 40px; height: 40px; background: none; border: 0; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; }

/* 반응형 */
@media (max-width: 768px) {
    .worship_item { flex-direction: column; align-items: stretch; gap: 12px; }
    .worship_thumb { flex: none; width: 100%; }
    .worship_tit { font-size: 18px; }
    .worship_view #bo_v_title { font-size: 21px; }
}