/* 관리자 키 컬러는 theme.css에서만 갱신한다. 이전 장기 캐시가 남은 URL과 분리하고, 새 URL에는 서버의 재검증 캐시 정책을 적용한다. */ @import url('./theme.css?v=20260909'); :root { --bg-color: #090d16; --card-bg: #121824; --text-primary: #f3f4f6; --text-secondary: #9ca3af; --accent-gradient: linear-gradient(135deg, var(--accent-hover) 0%, var(--accent-deep) 100%); --border-color: rgba(var(--accent-hover-rgb), 0.35); /* 제목(히어로/섹션 타이틀) 전용 폰트. 기본값은 시스템 기본 서체(현재와 동일한 모양)이고, ADMIN/font/index.php에서 폰트를 고르면 해당 페이지 에 삽입되는 @font-face 블록이 이 변수만 덮어써서 웹폰트로 바꾼다. */ --heading-font: 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif; } /* ADMIN-FONT:START (ADMIN/font/index.php가 자동으로 관리 — 직접 수정하지 말 것) */ @font-face { font-family: 'KimJeongcheolMyoungjo'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulMyungjo-Light.woff2') format('woff2'); font-weight: 300; font-display: swap; } @font-face { font-family: 'KimJeongcheolMyoungjo'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulMyungjo-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; } @font-face { font-family: 'KimJeongcheolMyoungjo'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulMyungjo-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; } :root { --heading-font: 'KimJeongcheolMyoungjo', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif; } /* ADMIN-FONT:END */ * { box-sizing: border-box; margin: 0; padding: 0; } body { background-color: var(--bg-color); color: var(--text-primary); font-family: 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif; min-height: 100vh; display: flex; flex-direction: column; } /* 공통 헤더 */ .common-header { background-color: #0e1422; border-bottom: 1px solid var(--border-color); padding: 15px 20px; position: sticky; top: 0; z-index: 100; } .header-container { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1.5fr; column-gap: 24px; align-items: center; } .header-left { display: flex; align-items: center; gap: 15px; justify-content: flex-start; } .back-btn { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); text-decoration: none; font-size: 0.95rem; font-weight: bold; padding: 8px 16px; border-radius: 8px; border: 0.5px solid var(--border-color); background-color: var(--card-bg); transition: all 0.2s ease; } .back-btn:hover { color: #ffffff; border-color: var(--accent); background-color: rgba(var(--accent-hover-rgb), 0.1); } .site-logo-link { display: inline-flex; align-items: center; line-height: 0; flex: 0 0 auto; } .site-logo-img { height: 46px; width: auto; max-width: none; flex: 0 0 auto; object-fit: contain; /* 전역 img 규칙(테두리/그림자/여백)이 로고에도 걸려 배경 위에 흰 박스처럼 떠 보였다. 헤더 배경과 자연스럽게 어울리도록 여기서 모두 걷어낸다. */ border: none; border-radius: 0; box-shadow: none; margin-top: 0; /* 원본 로고는 남색 텍스트라 다크 모드 배경에서는 거의 안 보인다. brightness(0)로 완전히 검게 만든 뒤 invert(1)로 흰색으로 뒤집어서 다크 배경에서도 또렷하게 보이게 한다. 라이트 모드에서는 원본 남색 그대로. */ filter: brightness(0) invert(1); transition: filter 0.2s ease; } /* 로고 옆 "지금 관리도구 화면입니다" 배지 — 실수로 공개 화면으로 착각하지 않도록 눈에 띄게 */ .admin-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 20px; background-color: #ef4444; color: #ffffff; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.03em; text-decoration: none; white-space: nowrap; box-shadow: 0 2px 8px -1px rgba(239, 68, 68, 0.55); transition: transform 0.15s ease, box-shadow 0.15s ease; } .admin-badge:hover { transform: translateY(-1px); box-shadow: 0 4px 12px -1px rgba(239, 68, 68, 0.65); } .admin-badge i { font-size: 0.75rem; } /* 메인 콘텐츠 영역 */ .common-main { flex: 1; padding: 50px 20px; display: flex; justify-content: center; } .content-wrapper { max-width: 900px; width: 100%; background-color: var(--card-bg); border: 0.5px solid var(--border-color); border-radius: 16px; padding: 40px; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.4); text-align: center; } /* 개별 페이지들은 각자