/* ─── Footer ──────────────────────────────────────────────── */ .footer { background: var(--secondary); color: rgba(255,255,255,.8); } .footer-top { padding: 60px 0; } .footer-top-inner { display: grid; grid-template-columns: 280px repeat(4, 1fr); gap: 40px; } .footer-brand { } .footer-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; } .footer-logo img { height: 36px; } .footer-logo-text { font-size: 20px; font-weight: 700; color: #fff; } .footer-logo-text strong { color: var(--accent); } .footer-tagline { font-size: 13px; line-height: 1.8; color: rgba(255,255,255,.6); margin-bottom: 20px; } .footer-contact-list { display: flex; flex-direction: column; gap: 8px; } .footer-contact-item { display: flex; gap: 10px; font-size: 13px; } .contact-label { color: rgba(255,255,255,.4); min-width: 60px; } .footer-contact-item a { color: var(--accent); } .footer-contact-item a:hover { text-decoration: underline; } .footer-menu-group { } .footer-menu-title { font-size: 13px; font-weight: 700; color: #fff; letter-spacing: .5px; text-transform: uppercase; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.1); } .footer-menu-list { display: flex; flex-direction: column; gap: 10px; } .footer-menu-list a { font-size: 13px; color: rgba(255,255,255,.6); transition: color var(--fast); } .footer-menu-list a:hover { color: var(--accent); } /* 하단 바 */ .footer-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 18px 0; } .footer-bottom-inner { display: flex; align-items: center; gap: 24px; font-size: 12px; color: rgba(255,255,255,.4); } .footer-legal { display: flex; gap: 16px; } .footer-legal a { color: rgba(255,255,255,.4); } .footer-legal a:hover { color: rgba(255,255,255,.8); } .footer-copyright { flex: 1; text-align: center; } .footer-powered { color: rgba(255,255,255,.3); } .footer-powered strong { color: var(--accent); } @media (max-width: 1024px) { .footer-top-inner { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } } @media (max-width: 768px) { .footer-top-inner { grid-template-columns: 1fr 1fr; } .footer-bottom-inner { flex-direction: column; text-align: center; gap: 12px; } .footer-copyright { order: -1; } }