/* 온누리 홈 — 클래식 & 신뢰. 제목 NMF Classic(세리프), 본문 Pretendard, 초록은 포인트만 */
:root { --on-ink:#14291c; --on-mute:#5f7566; --on-green:#256b38; --on-cream:#f5efe4; --on-line:#e6e2d8; }
body { margin:0; background:#fff; word-break:keep-all; }
* { box-sizing:border-box; }
.on { font-family:Pretendard,'Noto Sans KR',system-ui,sans-serif; color:var(--on-ink); font-size:17px; line-height:1.7; overflow-x:hidden; }
.on a { color:inherit; text-decoration:none; }
.on h1, .on h2, .on h3 { font-family:'NMF Classic','Gowun Batang',serif; font-weight:400; letter-spacing:-0.01em; }
.on-wrap { max-width:1160px; margin:0 auto; padding:0 32px; }
.on-head { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--on-line); }
.on-bar { height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.on-brand { display:flex; align-items:center; gap:10px; font-family:'NMF Classic',serif; font-size:22px; white-space:nowrap; }
.on-nav { display:flex; gap:34px; font-size:16px; font-weight:500; }
.on-nav a { padding:8px 0; border-bottom:2px solid transparent; white-space:nowrap; }
.on-nav a:hover { border-color:var(--on-green); }
.on-admin { font-size:14px; color:var(--on-mute); white-space:nowrap; }
.on-hero { position:relative; height:min(78vh,760px); min-height:520px; display:flex; align-items:flex-end; color:#fff; overflow:hidden; background:var(--on-ink); }
.on-hero-media { position:absolute; inset:0; animation:heroZoom 18s ease-in-out infinite alternate; }
.on-hero-media img { width:100%; height:100%; object-fit:cover; object-position:center 30%; display:block; }
.on-hero-media image-slot { width:100%; height:100%; }
.on-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,20,14,.15) 0%,rgba(10,20,14,.05) 35%,rgba(10,20,14,.72) 100%); pointer-events:none; }
.on-hero .on-wrap { position:relative; padding-bottom:72px; width:100%; }
.on-eyebrow { font-size:13px; letter-spacing:.22em; text-transform:uppercase; color:#d6e8db; font-weight:600; margin-bottom:18px; }
.on-hero h1 { font-size:clamp(34px,5vw,58px); line-height:1.22; margin:0 0 14px; text-shadow:0 2px 24px rgba(0,0,0,.35); animation:fadeInUp .9s ease .1s both; }
.on-hero p { font-size:18px; color:rgba(255,255,255,.85); margin:0 0 30px; animation:fadeInUp .9s ease .2s both; }
.on-btns { display:flex; gap:12px; flex-wrap:wrap; animation:fadeInUp .9s ease .3s both; }
.on-btn { display:inline-flex; align-items:center; gap:8px; min-height:48px; padding:0 26px; border-radius:999px; font-weight:600; font-size:15px; border:1.5px solid transparent; transition:transform .2s ease; }
.on-btn:hover { transform:translateY(-2px); }
.on-btn.w { background:#fff; color:var(--on-ink); } .on-btn.o { border-color:rgba(255,255,255,.7); color:#fff; } .on-btn.k { background:var(--on-ink); color:#fff; }
.on-strip { background:var(--on-cream); border-bottom:1px solid var(--on-line); }
.on-strip ul { list-style:none; margin:0; padding:22px 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:0 28px; }
.on-strip li { display:flex; flex-direction:column; gap:2px; padding:10px 0 10px 16px; border-left:2px solid #dcd6c6; }
.on-strip b { font-size:16px; font-weight:700; } .on-strip span { font-size:15px; color:var(--on-mute); }
.on-sec { padding:104px 0; } .on-sec.alt { background:#fafaf7; }
.on-sec-head { margin-bottom:44px; } .on-sec-head .on-eyebrow, .on-eyebrow.g { color:var(--on-green); }
.on-sec-head h2 { font-size:38px; margin:0; line-height:1.2; }
.on-sub { color:var(--on-mute); margin:10px 0 0; font-size:16px; }
.on-pastor { display:grid; grid-template-columns:400px 1fr; gap:72px; align-items:center; }
.on-pastor img, .on-pastor image-slot { width:100%; aspect-ratio:4/5; height:auto; object-fit:cover; border-radius:4px; display:block; }
.on-pastor h2 { font-size:40px; margin:0 0 8px; } .on-pastor .role { color:var(--on-mute); margin-bottom:22px; }
.on-pastor p { font-size:18px; line-height:1.85; margin:0 0 28px; }
.on-more { color:var(--on-green); font-weight:600; border-bottom:1.5px solid var(--on-green); }
.on-sermons { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.on-sermon .thumb { position:relative; aspect-ratio:16/9; border-radius:6px; overflow:hidden; background:linear-gradient(135deg,#14361f,#1b4f2a); margin-bottom:16px; }
.on-sermon image-slot { position:absolute; inset:0; width:100%; height:100%; }
.on-sermon .play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; pointer-events:none; }
.on-sermon time { font-size:14px; color:var(--on-mute); } .on-sermon h3 { font-size:21px; margin:6px 0 0; line-height:1.35; }
.on-pillars { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--on-line); border:1px solid var(--on-line); }
.on-pillar { background:#fff; padding:38px 32px; } .on-pillar .on-eyebrow { margin-bottom:14px; }
.on-pillar h3 { font-size:24px; margin:0 0 12px; } .on-pillar p { font-size:16px; color:#2b4434; margin:0; }
.on-loc { display:grid; grid-template-columns:1fr 1.2fr; gap:56px; align-items:center; }
.on-loc dl { margin:0 0 28px; display:grid; grid-template-columns:auto 1fr; gap:10px 22px; font-size:16px; } .on-loc dt { color:var(--on-mute); } .on-loc dd { margin:0; font-weight:500; }
.on-map { aspect-ratio:4/3; border-radius:6px; overflow:hidden; background:var(--on-cream); }
.on-map img, .on-map iframe, .on-map image-slot { width:100%; height:100%; object-fit:cover; border:0; display:block; }
.on-foot { background:var(--on-ink); color:#c9d6cd; padding:56px 0; font-size:14px; }
.on-foot .on-wrap { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.on-foot b { color:#fff; font-family:'NMF Classic',serif; font-size:18px; font-weight:400; display:block; margin-bottom:8px; }
.on-foot a { color:#c9d6cd; }
[data-ezer-video] { padding:0 32px 72px; background:#fafaf7; }
#hero-bg::part(empty), .on-sermon image-slot::part(empty){display:none;}
@keyframes fadeInUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes heroZoom { from { transform:scale(1); } to { transform:scale(1.08); } }
@keyframes pulseGlow { 0%,100% { transform:scale(1); opacity:.55; } 50% { transform:scale(1.12); opacity:.85; } }
@media (max-width:820px) {
  .on-wrap { padding:0 24px; } .on-bar { height:60px; } .on-brand { font-size:19px; }
  .on-hero { height:auto; min-height:0; } .on-hero .on-wrap { padding:120px 24px 56px; }
  .on-eyebrow { font-size:11px; letter-spacing:.14em; }
  .on-sec { padding:64px 0; } .on-sec-head { margin-bottom:28px; } .on-sec-head h2 { font-size:30px; }
  .on-pastor, .on-loc, .on-sermons, .on-pillars { grid-template-columns:1fr; gap:32px; }
  .on-pillars { gap:1px; } .on-pastor img, .on-pastor image-slot { max-width:320px; } .on-pastor h2 { font-size:32px; }
  .on-strip ul { grid-template-columns:1fr 1fr; gap:0 16px; padding:14px 0; } .on-strip b { font-size:15px; } .on-strip span { font-size:13.5px; }
  [data-ezer-video] { padding:0 24px 48px; } .on-foot .on-wrap { flex-direction:column; } .on-foot .on-wrap > div[style] { text-align:left !important; }
}

.on-two { display:grid; grid-template-columns:1fr 1fr; gap:56px; }
.on-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--on-line); }
.on-list li { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:16px 0; border-bottom:1px solid var(--on-line); font-size:16px; }
.on-list b { font-weight:500; display:block; } .on-list small { font-size:14px; color:var(--on-mute); }
.on-list small:empty { display:none; } .on-list li > span { color:var(--on-mute); white-space:nowrap; font-size:15px; }
.on-empty { padding:28px; border:1px dashed var(--on-line); border-radius:6px; color:var(--on-mute); font-size:15px; text-align:center; }
.on-bulletin { display:block; margin-top:28px; padding:24px 28px; background:var(--on-cream); border:1px solid var(--on-line); border-radius:6px; }
.on-bulletin .on-eyebrow { color:var(--on-green); margin-bottom:8px; } .on-bulletin b { display:block; font-family:'NMF Classic',serif; font-weight:400; font-size:24px; line-height:1.3; }
.on-bulletin small { display:block; color:var(--on-mute); font-size:15px; margin:4px 0 12px; } .on-bulletin small:empty { display:none; }
.on-week { padding:40px 0; border-top:1px solid var(--on-line); } .on-week:first-of-type { border-top:0; padding-top:0; }
.on-week-head { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:24px; flex-wrap:wrap; }
.on-week-head h2 { font-size:32px; margin:0; line-height:1.2; } .on-week-head .on-sub:empty { display:none; }
.on-pdf { width:100%; aspect-ratio:4/3; max-height:1100px; border:1px solid var(--on-line); border-radius:6px; overflow:hidden; background:#fff; margin-bottom:12px; }
.on-pdf iframe { width:100%; height:100%; border:0; display:block; }
.on-bulletin-img { display:block; width:100%; max-width:820px; height:auto; border:1px solid var(--on-line); border-radius:6px; margin:0 0 16px; }
/* ---- 서브페이지 ---- */
.on-page { background:var(--on-cream); border-bottom:1px solid var(--on-line); padding:72px 0 56px; }
.on-page h1 { font-size:clamp(34px,4vw,48px); margin:0; line-height:1.2; }
.on-page .on-eyebrow { color:var(--on-green); margin-bottom:12px; }
.on-page .on-sub { max-width:640px; }

.on-h2 { font-size:30px; margin:0 0 24px; line-height:1.25; }
.on-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; }
.on-card { background:#fafaf7; border:1px solid var(--on-line); border-radius:6px; padding:36px 32px; }
.on-card h3 { font-size:24px; margin:0 0 12px; } .on-card p { font-size:16px; color:#2b4434; margin:0 0 22px; line-height:1.75; }
.on-card p:last-child { margin-bottom:0; }
.on-lead { font-size:19px; line-height:1.85; max-width:720px; margin:0 0 56px; color:#2b4434; }
.on-timeline { list-style:none; margin:0; padding:0 0 0 28px; border-left:1px solid var(--on-line); max-width:640px; }
.on-timeline li { position:relative; padding-bottom:26px; }
.on-timeline li::before { content:''; position:absolute; left:-33px; top:9px; width:9px; height:9px; border-radius:50%; background:var(--on-green); }
.on-timeline b { display:block; font-family:'NMF Classic',serif; font-weight:400; font-size:20px; margin-bottom:2px; }
.on-timeline span { color:#2b4434; font-size:16px; }
.on-facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; padding-top:40px; margin-top:56px; border-top:1px solid var(--on-line); }
.on-facts dt { font-size:13px; color:var(--on-mute); margin-bottom:4px; } .on-facts dd { margin:0; font-size:16px; font-weight:500; }
.on-people { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:20px; }
.on-person { text-align:center; } .on-person image-slot { width:96px; height:96px; margin:0 auto 14px; display:block; }
.on-person b { display:block; font-size:16px; } .on-person span { font-size:14px; color:var(--on-mute); }
.on-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
@media (max-width:820px) {
  .on-page { padding:48px 0 36px; } .on-h2 { font-size:26px; } .on-lead { font-size:17px; margin-bottom:40px; }
  .on-grid2, .on-two { grid-template-columns:1fr; gap:32px; } .on-week-head h2 { font-size:26px; } .on-pdf { aspect-ratio:1/1.3; } .on-card { padding:28px 24px; }
}