* { margin: 0; padding: 0; box-sizing: border-box; }
body {
    font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    color: #333;
    line-height: 1.6;
}
a { text-decoration: none; color: inherit; }

/* Header */
.header { background: #fff; border-bottom: 1px solid #e5e7eb; }
.header-inner {
    max-width: 80rem; margin: 0 auto; padding: 0 1rem;
    display: flex; justify-content: space-between; align-items: center; height: 4rem;
}
.header-logo img { height: 3rem; width: auto; }
.header-nav { display: flex; align-items: center; gap: 1rem; }
.header-nav a { color: #6b7280; font-size: 0.875rem; }
.header-nav a:hover { color: #111827; }

/* Footer */
.footer { background: #1f2937; padding: 2rem 1rem; }
.footer-inner {
    max-width: 80rem; margin: 0 auto;
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem;
}
.footer h3 { color: #fff; font-size: 0.875rem; font-weight: 600; margin-bottom: 0.5rem; }
.footer p, .footer a, .footer li { color: #d1d5db; font-size: 0.875rem; }
.footer a:hover { color: #fff; }
.footer ul { list-style: none; }
.footer ul li { margin-bottom: 0.25rem; }
.footer-copy {
    max-width: 80rem; margin: 2rem auto 0; padding-top: 2rem;
    border-top: 1px solid #374151; text-align: center; color: #9ca3af; font-size: 0.875rem;
}

/* Section */
.section { padding: 4rem 2rem; }
.section-gray { background: #f9fafb; }
.section-inner { max-width: 80rem; margin: 0 auto; }
.section-title { text-align: center; font-size: 1.875rem; font-weight: bold; margin-bottom: 0.5rem; }
.section-divider { width: 5rem; margin: 1rem auto 2rem; border: none; border-top: 2px solid #22c55e; }
.section-text { color: #4b5563; max-width: 48rem; margin: 0 auto; text-align: center; line-height: 1.8; }

/* Card */
.card {
    background: #fff; border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden;
}
.card-inner { padding: 1.5rem 2rem; }

/* Page Container */
.page-container { padding: 3rem 1rem; max-width: 56rem; margin: 0 auto; }
.page-container-wide { padding: 3rem 1rem; max-width: 80rem; margin: 0 auto; }

/* Responsive */
@media (max-width: 640px) {
    .footer-inner { grid-template-columns: repeat(2, 1fr); }
    .card-inner { padding: 1rem; }
}
