/* ==== about/index.php ==== */
/* ── 레이아웃 ────────────────────────────────── */
.about-page  { background:#f8f9fa; }
.about-inner { padding-bottom:80px; }

/* ── 히어로 ──────────────────────────────────── */
.about-hero { background:#003366; color:#fff; padding:72px 16px 64px; text-align:center; }
.about-hero-label { font-size:.8rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.55); margin-bottom:16px; }
.about-hero-title { font-size:2.4rem; font-weight:800; line-height:1.25; margin-bottom:20px; }
.about-hero-desc  { font-size:1rem; color:rgba(255,255,255,.78); line-height:1.8; }

/* ── 섹션 공통 ───────────────────────────────── */
.about-section { padding:56px 0 0; }
.about-sec-title { font-size:1.25rem; font-weight:800; color:#111; margin-bottom:10px; padding-bottom:12px; border-bottom:2px solid #003366; display:inline-block; }
.about-sec-lead  { font-size:.9375rem; color:#555; line-height:1.8; margin-top:14px; margin-bottom:24px; }

/* ── 배경 컨텍스트 ───────────────────────────── */
.about-context-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px; }
.about-context-item { background:#fff; border:1px solid #dde1e7; border-top:3px solid #003366; border-radius:6px; padding:20px 20px 22px; }
.about-context-label { font-size:.8rem; font-weight:700; color:#003366; text-transform:uppercase; letter-spacing:.06em; margin-bottom:10px; }
.about-context-body  { font-size:.875rem; color:#444; line-height:1.75; }

/* ── 목적 ────────────────────────────────────── */
.about-purpose-box { background:#fff; border:1px solid #dde1e7; border-left:4px solid #003366; border-radius:0 6px 6px 0; padding:24px 28px; margin-top:20px; }
.about-purpose-main { font-size:.9375rem; color:#222; line-height:1.8; margin-bottom:18px; }
.about-purpose-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.about-purpose-list li { font-size:.875rem; color:#444; line-height:1.7; padding-left:16px; position:relative; }
.about-purpose-list li::before { content:''; position:absolute; left:0; top:.65em; width:5px; height:5px; background:#2E7D32; border-radius:50%; }

/* ── 주요 서비스 ─────────────────────────────── */
.about-svc-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:20px; }
.about-svc-card { display:flex; gap:20px; background:#fff; border:1px solid #dde1e7; border-radius:8px; padding:24px; text-decoration:none; color:inherit; transition:border-color .15s, box-shadow .15s; }
.about-svc-card:hover { border-color:#003366; box-shadow:0 2px 12px rgba(0,51,102,.08); }
.about-svc-icon { flex-shrink:0; width:56px; height:56px; border-radius:8px; background:#003366; color:#fff; font-size:.72rem; font-weight:800; display:flex; align-items:center; justify-content:center; letter-spacing:.02em; text-align:center; line-height:1.3; }
.about-svc-icon--ebook    { background:#2E7D32; }
.about-svc-icon--community{ background:#1565C0; }
.about-svc-icon--job      { background:#4E342E; }
.about-svc-body { flex:1; }
.about-svc-name { font-size:.9375rem; font-weight:700; color:#111; margin-bottom:8px; }
.about-svc-desc { font-size:.825rem; color:#555; line-height:1.75; margin-bottom:12px; }
.about-svc-link { font-size:.78rem; font-weight:600; color:#003366; border-bottom:1px solid #003366; }

/* ── 이용 대상 ───────────────────────────────── */
.about-target-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:20px; }
.about-target-item { background:#fff; border:1px solid #dde1e7; border-radius:6px; padding:18px 20px; }
.about-target-name { font-size:.875rem; font-weight:700; color:#003366; margin-bottom:8px; }
.about-target-desc { font-size:.825rem; color:#555; line-height:1.7; }

/* ── 운영사 ──────────────────────────────────── */
.about-operator { }
.about-operator-box { display:flex; gap:32px; background:#fff; border:1px solid #dde1e7; border-radius:8px; padding:32px; margin-top:20px; align-items:flex-start; }
.about-operator-logo { flex-shrink:0; }
.about-op-img { height:32px; width:auto; max-width:none; display:block; }
.about-operator-body { flex:1; }
.about-operator-name { font-size:1rem; font-weight:700; color:#111; margin-bottom:12px; }
.about-operator-desc { font-size:.875rem; color:#444; line-height:1.8; margin-bottom:10px; }
.about-operator-links { display:flex; gap:16px; margin-top:16px; flex-wrap:wrap; }
.about-operator-links a { font-size:.825rem; color:#003366; text-decoration:none; border-bottom:1px solid #c8d6ea; padding-bottom:1px; }
.about-operator-links a:hover { border-bottom-color:#003366; }

/* ── CTA ─────────────────────────────────────── */
.about-cta { margin-top:56px; background:#fff; border:1px solid #dde1e7; border-radius:8px; padding:48px 32px; text-align:center; }
.about-cta-title { font-size:1.25rem; font-weight:800; color:#111; margin-bottom:12px; }
.about-cta-desc  { font-size:.9rem; color:#555; line-height:1.8; margin-bottom:28px; }
.about-cta-btns  { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.about-cta-btn   { display:inline-block; padding:12px 32px; border-radius:4px; font-size:.9rem; font-weight:700; text-decoration:none; }
.about-cta-btn--primary   { background:#003366; color:#fff; }
.about-cta-btn--primary:hover { background:#002244; }
.about-cta-btn--secondary { background:#fff; color:#003366; border:2px solid #003366; }
.about-cta-btn--secondary:hover { background:#eef2f8; }

/* ── 반응형 ──────────────────────────────────── */
@media (max-width:900px) {
  .about-svc-grid    { grid-template-columns:1fr; }
  .about-target-grid { grid-template-columns:repeat(2,1fr); }
  .about-context-grid{ grid-template-columns:1fr; }
}
@media (max-width:768px) {
  .about-hero-title { font-size:1.7rem; }
  .about-hero-desc  { font-size:.875rem; }
  .about-operator-box { flex-direction:column; gap:20px; }
  .about-target-grid  { grid-template-columns:1fr; }
  .about-svc-card { flex-direction:column; gap:14px; }
  .about-svc-icon { width:44px; height:44px; }
}
@media (max-width:480px) {
  .about-hero { padding:48px 16px 40px; }
  .about-hero-title { font-size:1.45rem; }
  .about-cta { padding:32px 20px; }
}
