/* 예약 페이지 전용 디자인 (디자인 일관성 유지) */
        .booking-section { padding: 5em 0; }
        .section-title { text-align: center; margin-bottom: 4em; }
        .section-title h3 { font-size: 2.5em; color: #111; margin-bottom: 0.5em; font-weight: 800; }
        .section-title p { color: #888; font-size: 1.1em; }

        .notice-box { 
            background: #f8f9fa; 
            padding: 3em; 
            border-radius: 20px; 
            max-width: 900px; 
            margin:  5em auto 0 auto;
            border: 1px solid #eee;
        }
        .notice-box h4 { font-size: 1.4em; color: #4477bb; margin-bottom: 1.5em; font-weight: 700; text-align: center; }
        .notice-list { list-style: none; padding: 0; margin: 0; }
        .notice-list li { 
            position: relative; 
            padding-left: 1.5em; 
            margin-bottom: 1em; 
            color: #555; 
            line-height: 1.6;
            font-size: 1.05em;
        }
        .notice-list li::before { 
            content: "•"; 
            position: absolute; 
            left: 0; 
            color: #4477bb; 
            font-weight: bold; 
        }

        .booking-grid { 
            display: grid; 
            grid-template-columns: 1fr 1fr; 
            gap: 2.5em; 
            max-width: 900px; 
            margin: 0 auto; 
        }
        .booking-card { 
            background: #fff; 
            border: 1px solid #eee; 
            border-radius: 15px; 
            padding: 3.5em 2.5em; 
            text-align: center;
            box-shadow: 0 4px 10px rgba(0,0,0,0.02);
        }
        .booking-card h4 { font-size: 1.6em; color: #222; margin-bottom: 0.8em; font-weight: 700; }
        .booking-card p { color: #888; margin-bottom: 2.5em; font-size: 0.95em; line-height: 1.5; height: 3em; display: flex; align-items: center; justify-content: center; }
        
        .btn-booking { 
            display: block; 
            padding: 1.2em; 
            border-radius: 8px; 
            font-weight: 700; 
            text-decoration: none; 
            transition: opacity 0.2s;
            font-size: 1.1em;
            border: none;
        }
        .btn-naver { background: #03c75a; color: #fff !important; }
        .btn-kakao { background: #fee500; color: #3c1e1e !important; }
        .btn-booking:hover { opacity: 0.85; }

        @media screen and (max-width: 980px) {
            .booking-grid { grid-template-columns: 1fr; }
            .notice-box { padding: 2em 1.5em; }
            .section-title h3 { font-size: 1.8em; }
            .booking-card { margin: 0 1.5em; }
        }

/* 736px 이하 모바일 대응 (디자인 유지, 실용적 여백) */
@media screen and (max-width: 736px) {
    /* 1. 섹션 상하 여백 줄임 (모바일에서 너무 길어 보이지 않게) */
    .booking-section { padding: 3em 0; }
    .section-title { margin-bottom: 2.5em; }
    .section-title h3 { font-size: 1.6rem !important; }
    .section-title p { font-size: 0.95rem; padding: 0 1em; }

    /* 2. 유의사항 박스 정리 */
    .notice-box { padding: 1.8em 1.2em !important; }
    .notice-box h4 { font-size: 1.2rem; margin-bottom: 1.2em; }
    .notice-list li { font-size: 0.9rem; margin-bottom: 0.8em; }

    /* 3. 예약 카드 정리 (너비 꽉 채우고 불필요한 높이 제거) */
    .booking-grid { gap: 1.5em; padding: 0 1.5em; }
    .booking-card { 
        margin: 0 !important; 
        padding: 2.5em 1.5em !important; /* 과한 여백 축소 */
    }
    .booking-card h4 { font-size: 1.4rem; }
    .booking-card p { 
        height: auto; /* 고정 높이 해제해서 글자 안 겹치게 */
        margin-bottom: 1.8em; 
        font-size: 0.85rem; 
    }

    /* 4. 버튼 가독성 (모바일에서 누르기 편하게) */
    .btn-booking { 
        padding: 1em; 
        font-size: 1rem; 
        border-radius: 6px; 
    }
}