/* 基本設定 */
body {
    font-family: 'Noto Sans TC', sans-serif; /* 推薦使用思源黑體或其他易讀字體 */
    line-height: 1.6;
    margin: 0;
    padding: 0;
    color: #333;
    background-color: #f8f8f8;
	
}

p{
	font-size:1.2rem;
}
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    display: flex; /* 使用Flexbox佈局 */
    flex-wrap: wrap; /* 允許項目換行 */
}

/* 圖片響應式 */
img {
    max-width: 100%;
    height: auto;
    display: block; /* 移除圖片底部多餘空間 */
    margin: 0 auto; /* 圖片置中 */
}

/* 導覽列 */
header {
    background-color: #333;
    color: white;
    padding: 15px 20px;
}

nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

.nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.nav-links li a {
    color: white;
    text-decoration: none;
    padding: 10px 15px;
    display: block;
}

.hamburger-menu {
    display: none; /* 預設隱藏，手機版顯示 */
    background: none;
    border: none;
    color: white;
    font-size: 30px;
    cursor: pointer;
}

/* 文章內容區 */
.report-article {
    flex: 3; /* 主內容區佔比較大份額 */
    min-width: 300px; /* 確保在小螢幕下有足夠寬度 */
    background-color: white;
    padding: 30px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    margin-bottom: 20px; /* 手機版下方留白 */
}

.report-article h1 {
    font-size: 2.5em;
    margin-bottom: 10px;
}

.report-article .subtitle {
    font-size: 1.2em;
    color: #666;
    margin-bottom: 20px;
}

.content-section h2 {
    font-size: 1.8em;
    margin-top: 30px;
    margin-bottom: 15px;
}

/* 側邊欄 */
.sidebar {
    flex: 1; /* 側邊欄佔較小份額 */
    min-width: 250px; /* 確保在小螢幕下有足夠寬度 */
    background-color: white;
    padding: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    margin-left: 20px; /* 桌面版左側留白 */
    margin-bottom: 20px; /* 手機版下方留白 */
}

.sidebar h3 {
    font-size: 1.5em;
    margin-bottom: 15px;
}

.sidebar ul {
    list-style: none;
    padding: 0;
}

.sidebar ul li a {
    text-decoration: none;
    color: #007bff;
    padding: 8px 0;
    display: block;
    border-bottom: 1px dotted #eee;
}

.sidebar ul li:last-child a {
    border-bottom: none;
}

/* 頁腳 */
footer {
    text-align: center;
    padding: 20px;
    background-color: #333;
    color: white;
    margin-top: 20px;
}

/* --- 媒體查詢 (Media Queries) --- */

/* 小螢幕設備 (手機和平板直立) */
@media (max-width: 768px) {
    .container {
        flex-direction: column; /* 小螢幕下改為垂直堆疊 */
        padding: 10px;
    }

    /* 導覽列 */
    .nav-links {
        display: none; /* 隱藏傳統導覽列 */
        flex-direction: column;
        width: 100%;
        background-color: #444;
        position: absolute; /* 讓選單可以展開 */
        top: 60px; /* 位於Header下方 */
        left: 0;
    }

    .nav-links.active { /* JavaScript控制選單展開/收合 */
        display: flex;
    }

    .nav-links li a {
        padding: 15px 20px;
        border-bottom: 1px solid #555;
    }

    .hamburger-menu {
        display: block; /* 顯示漢堡選單 */
    }

    .report-article, .sidebar {
        margin-left: 0; /* 移除側邊欄左側留白 */
        padding: 20px;
    }

    .report-article h1 {
        font-size: 1.8em;
    }

    .report-article .subtitle {
        font-size: 1em;
    }
}

/* 中等螢幕設備 (平板橫向) */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        padding: 15px;
    }

    .report-article {
        flex: 2; /* 比例可以微調 */
    }

    .sidebar {
        flex: 1;
        margin-left: 15px;
    }
}