/* ============================================
   レスポンシブスタイル
   ============================================ */

/* タブレット（768px以上） */
@media (min-width: 768px) and (max-width: 1023px) {
    .container {
        padding: 0 1.5rem;
    }
    
    h1 {
        font-size: 2.5rem;
    }
    
    h2 {
        font-size: 2rem;
    }
    
    h3 {
        font-size: 1.5rem;
    }
}

/* モバイル（767px以下） */
@media (max-width: 767px) {
    .container {
        padding: 0 1rem;
    }
    
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.5rem;
    }
    
    h3 {
        font-size: 1.25rem;
    }
    
    p {
        font-size: 0.95rem;
    }
    
    /* ヘッダー */
    .header-content {
        flex-direction: column;
        gap: 1rem;
        padding: 1rem;
    }
    
    nav ul {
        flex-direction: column;
        gap: 1rem;
    }
    
    /* ボタン */
    .btn {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .btn-lg {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }
    
    /* グリッドレイアウト */
    .reasons-grid,
    .services-grid,
    .testimonials-grid,
    .contact-info {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    /* セクションパディング */
    .hero,
    .concept,
    .why-epi,
    .services,
    .testimonials,
    .faq,
    .contact {
        padding: 2rem 1rem;
    }
    
    .hero h1 {
        font-size: 1.75rem;
    }
    
    .hero p {
        font-size: 1rem;
    }
    
    /* フッター */
    .footer-content {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* 小さいモバイル（480px以下） */
@media (max-width: 480px) {
    .container {
        padding: 0 0.75rem;
    }
    
    h1 {
        font-size: 1.5rem;
    }
    
    h2 {
        font-size: 1.25rem;
    }
    
    h3 {
        font-size: 1rem;
    }
    
    p {
        font-size: 0.9rem;
    }
    
    /* ヘッダー */
    .header-content {
        padding: 0.75rem;
    }
    
    .logo {
        font-size: 1.25rem;
    }
    
    nav ul {
        gap: 0.5rem;
    }
    
    nav a {
        font-size: 0.9rem;
    }
    
    /* ボタン */
    .btn {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
    }
    
    /* ヒーロー */
    .hero {
        height: 60vh;
    }
    
    .hero-title {
        font-size: 1.25rem;
    }
    
    .hero-subtitle {
        font-size: 0.9rem;
    }
    
    .hero-target {
        font-size: 0.85rem;
    }
    
    /* セクションパディング */
    .concept,
    .why-epi,
    .services,
    .testimonials,
    .faq,
    .contact {
        padding: 1.5rem 0.75rem;
    }
    
    /* アイコン */
    .reason-icon {
        font-size: 2rem;
    }
    
    /* サービスカード */
    .service-image {
        height: 200px;
    }
    
    /* テーブル */
    table {
        font-size: 0.85rem;
    }
}

/* ランドスケープモード（高さが低い） */
@media (max-height: 600px) {
    .hero {
        height: auto;
        min-height: 100vh;
    }
}

/* 高解像度ディスプレイ */
@media (min-width: 1440px) {
    .container {
        max-width: 1400px;
    }
    
    h1 {
        font-size: 3.5rem;
    }
    
    h2 {
        font-size: 2.5rem;
    }
}

/* プリント用 */
@media print {
    .site-header,
    .site-footer,
    .btn {
        display: none;
    }
    
    body {
        font-size: 12pt;
        color: #000;
    }
    
    a {
        text-decoration: underline;
    }
}