header .wp-block-site-title a,
header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon,
header .wp-block-navigation__responsive-container-open {
	transition:opacity 2000ms ease;
}
html.st-nf-on header .wp-block-site-title a,
html.st-nf-on header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
html.st-nf-on header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon,
html.st-nf-on header .wp-block-navigation__responsive-container-open {
	opacity:.3;
}

/* 커서가 그 글자 근처에 있을 때(st-nf-near) 또는 15초 주기 루틴이 도는 동안(st-nf-pulse).
   근처 판정은 HOME 과 Picture 가 각자 따로 하고, 주기 루틴은 둘이 함께 돈다. */
html.st-nf-on header .wp-block-site-title.st-nf-pulse a,
html.st-nf-on header .wp-block-navigation.st-nf-pulse .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
html.st-nf-on header .wp-block-navigation.st-nf-pulse .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon,
html.st-nf-on header .wp-block-navigation.st-nf-pulse .wp-block-navigation__responsive-container-open,
html.st-nf-on header .wp-block-site-title.st-nf-near a,
html.st-nf-on header .wp-block-navigation.st-nf-near .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
html.st-nf-on header .wp-block-navigation.st-nf-near .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon,
html.st-nf-on header .wp-block-navigation.st-nf-near .wp-block-navigation__responsive-container-open,
/* 키보드로 짚었을 때도 보여야 한다 */
html.st-nf-on header .wp-block-site-title:focus-within a,
html.st-nf-on header .wp-block-navigation:focus-within .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
html.st-nf-on header .wp-block-navigation:focus-within .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon,
html.st-nf-on header .wp-block-navigation:focus-within .wp-block-navigation__responsive-container-open {
	opacity:1;
}

/* ── 페이지를 열 때: 옛날 형광등이 켜지듯 두 번 깜빡인다 ─────────────────
   이 집 낱말대로 alpha 는 '투명도'다.
     · 어둡다 = 투명도 70% (불투명도 .3)
     · 밝다   = 투명도  0% (불투명도 1)

   ⚠ fill-mode 를 남기지 않는다(forwards/both 금지).
     애니메이션이 남긴 값은 보통 규칙보다 세서, 끝난 뒤에도 붙들고 있으면
     위의 '평소 옅게' 규칙이 영영 먹히지 않는다. 값을 놓아 주어야
     끝나는 순간 원래 상태(마우스를 본 뒤라면 .3)로 돌아간다. */
@keyframes st-nf-strike {
	0%, 7%    { opacity:.3 }
	9%, 17%   { opacity:1 }      /* 첫 번째 점멸 */
	19%, 30%  { opacity:.3 }
	32%, 41%  { opacity:1 }      /* 두 번째 점멸 */
	43%, 55%  { opacity:.3 }
	62%, 100% { opacity:1 }      /* 자리를 잡는다 */
}
header .wp-block-site-title a,
header .st-logo--btn {
	animation:st-nf-strike 1150ms ease-in-out 1;
}

/* 움직임을 줄여 달라고 한 기기에서는 깜빡이지 않는다. */
@media (prefers-reduced-motion: reduce) {
	header .wp-block-site-title a,
	header .st-logo--btn { animation:none; }
}

/* 펼쳐진 하위 목록은 언제나 또렷하게 */
header .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
header .wp-block-navigation__submenu-container .wp-block-navigation__submenu-icon {
	opacity:1 !important;
}
/*# sourceURL=shintime-nav-fade-inline-css */


/* 헤더 내비는 우측 정렬(flex-end)이라 팝업 안까지 그 값이 흘러든다 → 팝업 안에서만 중앙으로 되돌린다. */
.wp-block-navigation__responsive-container.is-menu-open{ --navigation-layout-justification-setting:center !important; --navigation-layout-align:center !important; }
/* 팝업 상자가 content-box + 좌우 padding이라 화면보다 넓어지고, 그만큼 내용이 오른쪽으로 밀려 있었다. */
.wp-block-navigation__responsive-container.is-menu-open{ box-sizing:border-box !important; max-width:100% !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item{ align-items:center !important; justify-content:center !important; text-align:center !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{ text-align:center !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container{ padding-left:0 !important; padding-right:0 !important; margin-left:0 !important; min-width:0 !important; left:auto !important; }
/* 하위의 하위 = '연도.월' 링크 목록 → 모바일 팝업에서는 감춘다(연도까지만 보인다). */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container{ display:none !important; }
/* 월 목록을 감췄으니 연도 항목의 펼침 화살표도 없앤다(연도 링크 자체는 그대로 눌린다). */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation__submenu-icon{ display:none !important; }


/* 제목: 다른 푸터 제목(has-medium-font-size / weight 600 / body 글꼴)과 같은 클래스를 그대로 쓴다. */
.st-event{ display:block; }
.st-event__h{ margin:0 0 var(--wp--preset--spacing--10, 0.5rem); }
.st-event__year{ margin-left:.5em; font-weight:400; opacity:.55; }
/* 하위 1~12: 3열 4행. 글자 크기는 다른 푸터 링크와 같은 has-small-font-size. */
.st-event__grid{ display:grid; grid-template-columns:repeat(3, minmax(1.9em, max-content)); gap:var(--wp--preset--spacing--10, 0.5rem) 1.1em; justify-content:start; }
.st-ev{ color:inherit; text-decoration:none; font-weight:400; text-align:left; font-variant-numeric:tabular-nums; opacity:.5; }
/* 해당 '연도.월' 페이지가 있는 달만 굵게 + 불투명 100%. 없으면 그대로 50%. */
.st-ev--has{ opacity:1; font-weight:700; }
.st-ev--has:hover, .st-ev--has:focus{ text-decoration:underline; text-underline-offset:.18em; }
.st-ev--none{ cursor:default; }

/* 좁은 화면(테마가 푸터 열을 세로로 쌓는 781px 이하):
   Event 는 마크업 순서상 이미 앞에 오고, 그 뒤 Introduction / Privacy Policy / Social 이
   한 줄에 밀려들어 'Social' 이 화면 밖으로 잘려 나가던 것을 세로로 쌓아 모두 보이게 한다. */
@media (max-width: 781px){
	.st-footer-navs{ flex-direction:column !important; flex-wrap:nowrap !important; align-items:flex-start !important; justify-content:flex-start !important; gap:var(--wp--preset--spacing--40, 2rem); }
	.st-footer-navs > .wp-block-group{ width:100%; }
}


/* ── 1. 로고 ─────────────────────────────────────────────────────────
   글자 자리에 그대로 들어앉는다. 크기는 글자 크기(1em), 색은 글자색을 따른다
   (헤더가 흰 글씨면 흰 테두리). 단추는 생김새를 지우고 로고만 남긴다. */
.st-logo{ display:inline-flex; align-items:center; justify-content:center; line-height:1; }
.st-logo--home a{ display:inline-flex; align-items:center; text-decoration:none; color:inherit; }
button.st-logo--btn{
	appearance:none; -webkit-appearance:none;
	margin:0; padding:0; border:0; background:none; color:inherit;
	font:inherit; cursor:pointer;
}
/* 2026-07-29 사용자 지시: 두 로고가 잘 안 보인다 → 각각 현재의 2배.
   글자 크기를 따르는 성질(1em)은 그대로 두고 배수만 2 로 올린다.
   선 굵기는 viewBox 단위라 함께 2 배가 되어 비례가 유지된다. */
.st-logo__svg{ display:block; width:2em; height:2em; overflow:visible; }
.st-logo--btn:focus-visible, .st-logo--home a:focus-visible{ outline:2px solid currentColor; outline-offset:4px; }
/* 사진과 Family 가 한 내비게이션에 나란히 선다. 둘 다 2em 짜리 그림이라
   붙여 두면 어느 쪽을 눌렀는지 헷갈린다 — 로고 하나 폭의 반쯤을 띄운다. */
.st-logo-nav{ display:flex; align-items:center; gap:1em; }

/* 헤더를 옅게 두었다가 커서가 다가오면 또렷해지는 결(shintime-nav-fade)을
   두 로고에도 그대로 입힌다. 그쪽 스크립트가 붙여 주는 표시를 읽기만 한다. */
header .st-logo--btn{ transition:opacity 2000ms ease; }
html.st-nf-on header .st-logo--btn{ opacity:.3; }
html.st-nf-on header .wp-block-navigation.st-nf-near .st-logo--btn,
html.st-nf-on header .wp-block-navigation.st-nf-pulse .st-logo--btn,
html.st-nf-on header .wp-block-navigation:focus-within .st-logo--btn{ opacity:1; }

/* ── 2. 헤더는 어느 페이지에서든 자리를 지킨다 ───────────────────────
   히어로가 아닌 페이지(글·목록·문의 …)의 몫이다. 여기서는 sticky 로 붙인다.
   fixed 로 띄우면 흐름에서 빠져 본문 첫 줄이 로고 밑에 깔린다 — sticky 는
   제 자리를 남겨 두므로 아래에 여백을 따로 밀어 넣지 않아도 된다.

   바탕을 칠하는 까닭: 이 페이지들은 흰 바탕에 검은 글씨다. 헤더가 투명한
   채로 붙어 있으면 글이 로고 사이로 비쳐 지나간다.

   윗자리는 관리자 막대의 높이만큼 내린다. 로그인하지 않았으면 그 변수가
   없으니 0 이 된다.

   ⚠ 이 규칙은 히어로 서식의 fixed 규칙보다 **위에** 있어야 하고, 선택자도
     한 칸 헐거워야 한다(body 만 vs body.page-template-…). 히어로에서는
     아래 규칙이 이겨서 fixed 로 덮어써야 하기 때문이다. */
body .wp-site-blocks > header.wp-block-template-part{
	position:sticky; top:var(--wp-admin--admin-bar--height, 0px); z-index:60;
	background:var(--wp--preset--color--base, #f9f9f9);
	box-shadow:0 1px 0 rgba(17,17,17,.06);
}

/* 히어로 서식 — 헤더는 화면에 붙박이로 띄우고, 푸터는 문서 끝에서 사진 위에
   겹친다. 둘 다 흐름에서 빼야 사진이 화면을 온전히 차지한다. */
body.page-template-page-main-page .wp-site-blocks,
body.page-template-page-year .wp-site-blocks,
body.page-template-page-month .wp-site-blocks{ position:relative; min-height:100vh; }
/* 윗자리는 관리자 막대의 높이만큼 내린다.
   top:0 으로 두면 로그인한 사람의 화면에서 로고가 관리자 막대 밑에 깔린다.
   데스크톱(32px)에서는 헤더 안쪽 여백이 넉넉해 겨우 비켜 갔지만, 좁은
   화면에서는 막대가 46px 로 두꺼워져 세 로고가 통째로 가려졌다.
   로그인하지 않았으면 그 변수가 아예 없으므로 0 — 보이는 것이 달라지지 않는다.
   히어로가 아닌 페이지의 sticky 규칙과도 같은 높이가 되어 자리가 맞는다. */
body.page-template-page-main-page .wp-site-blocks > header.wp-block-template-part,
body.page-template-page-year .wp-site-blocks > header.wp-block-template-part,
body.page-template-page-month .wp-site-blocks > header.wp-block-template-part{
	position:fixed; top:var(--wp-admin--admin-bar--height, 0px); left:0; right:0; z-index:60;
	background:transparent !important;
	/* 2026-08-11 지시: 대문 위쪽에 가로 선이 뚜렷하다 → 지운다.
	   위 sticky 규칙이 헤더 밑변에 그어 두는 1px 그림자다. 흰 바탕 위에서는
	   '아이콘 자리와 본문 자리를 가르는 실선'으로 제 몫을 하지만, 히어로
	   서식에서는 헤더가 투명해 사진 위에 선만 덩그러니 남는다. 바탕만
	   투명으로 돌리고 그림자를 그대로 두었던 것이 원인 —
	   여기서 같이 거둔다. 되돌리려면 이 한 줄을 지우면 된다. */
	box-shadow:none !important;
}
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part{
	position:absolute; left:0; right:0; bottom:0; z-index:40;
	background:transparent !important;
}

/* 좁은 화면에서 '푸터를 화면 밖으로 밀어내려고' 본문에 걸어 둔 한 화면 높이는
   이제 문서만 두 배로 늘려 아래쪽에 검은 띠를 남긴다 → 무효로 돌린다. */
@media (max-width: 781px){
	body.page-template-page-main-page .wp-site-blocks > main,
body.page-template-page-year .wp-site-blocks > main,
body.page-template-page-month .wp-site-blocks > main{ min-height:0 !important; }
}

/* 세로로 긴 화면에서는 푸터를 바짝 조인다.
   사진 위에 겹치게 되었으니, 예전처럼 세로로 길게 늘어지면 사진을 통째로
   가려 버린다(재 보니 연도 페이지에서 화면의 98%를 덮었다).
   칸을 가로로 되돌리고 글자와 여백을 줄여 아래쪽 한 자락만 차지하게 한다. */
@media (max-width: 781px){
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part > .wp-block-group,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part > .wp-block-group,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part > .wp-block-group{
	padding-top:.9rem !important;
	padding-bottom:1rem !important;
}
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part .wp-block-columns,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part .wp-block-columns,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part .wp-block-columns{
	flex-wrap:nowrap !important;
	gap:1rem !important;
	align-items:flex-start !important;
}
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part .wp-block-column,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part .wp-block-column,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part .wp-block-column{
	flex-basis:auto !important;
	flex-grow:1 !important;
	min-width:0 !important;
}
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part .st-footer-navs,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part .st-footer-navs,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part .st-footer-navs{
	flex-direction:row !important;
	flex-wrap:wrap !important;
	align-items:flex-start !important;
	gap:.6rem 1.1rem !important;
}
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part .st-footer-navs > .wp-block-group,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part .st-footer-navs > .wp-block-group,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part .st-footer-navs > .wp-block-group{ width:auto !important; }
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part h2,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part h2,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part h2{ font-size:.9rem !important; margin-bottom:.3rem !important; line-height:1.25 !important; }
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part a,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part a,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part a{ font-size:.78rem !important; line-height:1.5 !important; }
body.page-template-page-main-page .wp-site-blocks > footer.wp-block-template-part .st-event__grid,
body.page-template-page-year .wp-site-blocks > footer.wp-block-template-part .st-event__grid,
body.page-template-page-month .wp-site-blocks > footer.wp-block-template-part .st-event__grid{ gap:.15rem .7rem !important; }
}

/* ── 3. 리스트 전체화면 ──────────────────────────────────────────────
   화면 전체를 회색으로 덮는다(rgb(128,128,128) 불투명도 0.5 = 투명도 50%).
   글자는 연도·달·닫기(X) 모두 흰색으로 통일한다. */
.st-yrs{
	position:fixed; inset:0; z-index:100050;
	display:flex; align-items:center; justify-content:center;
	background:rgba(128,128,128,0.5);
	color:#ffffff;
	opacity:0;
	transition:opacity 600ms cubic-bezier(.22,.61,.36,1);
	-webkit-tap-highlight-color:transparent;
}
.st-yrs[hidden]{ display:none; }
.st-yrs.is-open{ opacity:1; }
/* 닫힐 때만 느긋하게 — 2000ms 에 걸쳐 서서히 사라진다(X·ESC 공통) */
.st-yrs.is-closing{ opacity:0; transition:opacity 2000ms ease; pointer-events:none; }

.st-yrs__x{
	position:fixed; top:max(14px, env(safe-area-inset-top)); right:18px; z-index:2;
	appearance:none; -webkit-appearance:none;
	margin:0; padding:10px; border:0; background:none;
	color:#ffffff; font-size:22px; line-height:1; cursor:pointer;
}
.st-yrs__x:focus-visible{ outline:2px solid currentColor; outline-offset:2px; }

.st-yrs__scroll{ width:100%; max-height:100dvh; overflow:auto; padding:72px 24px 48px; }
@supports not (max-height: 100dvh){ .st-yrs__scroll{ max-height:100vh; } }

.st-yrs__grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(8.5rem, 1fr));
	gap:2.6rem 1.6rem;
	max-width:64rem; margin:0 auto;
	justify-items:center;
}

.st-yr{ display:flex; flex-direction:column; align-items:center; gap:.85rem; }
.st-yr__t{
	font-size:clamp(1.5rem, 1.1rem + 1.2vw, 2.15rem);
	font-weight:700; letter-spacing:.01em;
	color:inherit; text-decoration:none;
	font-variant-numeric:tabular-nums;
}
a.st-yr__t:hover, a.st-yr__t:focus-visible{ text-decoration:underline; text-underline-offset:.2em; }

/* 1~12 — 푸터 Event 네비게이터와 같은 3열 4행, 숫자만. 여기서는 가운데 정렬. */
.st-yr__m{
	display:grid;
	grid-template-columns:repeat(3, 1.9em);
	gap:.45em .7em;
	justify-content:center;
	font-size:clamp(.95rem, .85rem + .3vw, 1.1rem);
	font-variant-numeric:tabular-nums;
}
.st-mo{ text-align:center; color:inherit; text-decoration:none; font-weight:400; }
.st-mo--has{ opacity:1; font-weight:700; }
.st-mo--has:hover, .st-mo--has:focus-visible{ text-decoration:underline; text-underline-offset:.18em; }
.st-mo--none{ opacity:0.3; cursor:default; }

/* 전체화면이 떠 있는 동안 뒤 페이지는 움직이지 않는다 */
html.st-yrs-lock, html.st-yrs-lock body{ overflow:hidden !important; }

/* ── 4. HOME 으로 넘어갈 때 밀려들어오는 사진 ────────────────────────
   왼쪽 화면 밖에 세워 두었다가 1000ms 에 걸쳐 제자리로 밀고 들어와
   화면을 다 덮은 뒤에 진짜로 옮겨 간다. 그래서 갈아타는 순간이 안 보인다. */
.st-slidein{
	position:fixed; inset:0; z-index:100100;
	background:#0b0f14 center center / cover no-repeat;
	transform:translateX(-100%);
	will-change:transform;
	pointer-events:none;
}
.st-slidein.is-go{
	transform:translateX(0);
	transition:transform 1000ms cubic-bezier(.22,.61,.36,1);
}


@font-face{font-family:Inter;font-style:normal;font-weight:300 900;font-display:fallback;src:url('https://shintime.net/wp-content/themes/twentytwentyfour/assets/fonts/inter/Inter-VariableFont_slnt,wght.woff2') format('woff2');font-stretch:normal;}
@font-face{font-family:Cardo;font-style:normal;font-weight:400;font-display:fallback;src:url('https://shintime.net/wp-content/themes/twentytwentyfour/assets/fonts/cardo/cardo_normal_400.woff2') format('woff2');}
@font-face{font-family:Cardo;font-style:italic;font-weight:400;font-display:fallback;src:url('https://shintime.net/wp-content/themes/twentytwentyfour/assets/fonts/cardo/cardo_italic_400.woff2') format('woff2');}
@font-face{font-family:Cardo;font-style:normal;font-weight:700;font-display:fallback;src:url('https://shintime.net/wp-content/themes/twentytwentyfour/assets/fonts/cardo/cardo_normal_700.woff2') format('woff2');}