 body {
            font-family: 'Noto Sans TC', sans-serif;
            color: #1a202c;
            line-height: 1.6;
            font-size: 1.125rem; /* Base font size increased */
        }
        .gradient-bg {
            position: relative; /* 確保子元素可以絕對定位 */
            overflow: hidden; /* 確保圖片不會超出容器 */
        }
        .gradient-bg img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover; /* 圖片填滿容器並保持比例 */
            z-index: -1; /* 確保圖片在內容下方 */
            filter: brightness(0.5); /* 調整圖片亮度以確保文字清晰可見 */
        }
        .custom-card-text {
            font-size: 1rem; /* Card text font size increased */
            line-height: 1.5;
            color: #4a5568;
        }
        .custom-percentage {
            font-size: 3.5rem; /* Percentage number font size increased */
            line-height: 1;
        }
        h2 {
            font-size: 1.75rem; /* Heading 2 font size decreased */
        }
        h3 {
            font-size: 2.25rem; /* Heading 3 font size increased */
        }
        h4 {
            font-size: 1.5rem; /* Heading 4 font size increased */
        }
        li, p, a {
            font-size: 1.125rem; /* General text font size increased */
        }
        /* New CSS for the light geometric line pattern */
        .bg-pattern-light-grid {
            background-color: #f9fafb;
            background-image: repeating-linear-gradient(90deg, transparent, transparent 19px, #e1e4e5 20px), repeating-linear-gradient(0deg, transparent, transparent 19px, #e1e4e5 20px);
            background-size: 20px 20px;
        }
        .custom-highlight-text {
            /* 手機版文字大小 */
            font-size: 1.1rem;
            line-height: 1.6rem;
            color: #9b2c2c; /* Updated font color to a muted wine red */
        }
        /* 桌面版文字大小 (md 斷點，768px 以上) */
        @media (min-width: 768px) {
            .custom-highlight-text {
                font-size: 1.4rem; /* 恢復成較大的尺寸 */
            }
        }
        /* New CSS class for main section headings */
        .main-h3 {
            font-size: 2.25rem;
            line-height: 2.5rem;
            font-weight: 700;
            text-align: center;
            margin-bottom: 0.8rem;
            color: #1e3a8a; /* Tailwind's blue-900 */
        }
        .card-title {
            color: #5aa8c8;
        }
        .card-h4-icon {
            color: rgba(90, 168, 200, 0.5);
            margin-right: 0.5rem;
        }
        /* Table styles for UNESCO section */
        .unesco-table-container {
            border: 1px solid #2b1f48;
            border-top-width: 5px;
            background-color: #2b1f48;
            padding: 1rem;
        }
        .unesco-table-title {
            background-color: #2b1f48;
            color: #fff;
            padding: 1rem;
            font-size: 1.5rem;
            font-weight: bold;
            text-align: center;
        }
        .unesco-table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
	color: rgba(111,11,170,1);
	font-size: 24px;
        }
        .unesco-table th, .unesco-table td {
            border: 1px solid #fff;
            padding: 8px;
            font-size: 0.875rem;
            color: #eee;
        }
        .bg-dark-purple {
            background-color: #2b1f48;
        }
        .bg-medium-purple {
            background-color: #534572;
        }
        .bg-light-purple {
            background-color: #6336a1;
        }
        .bg-gray-cell {
            background-color: #f3f4f6;
            color: #1a202c;
        }
        /* New colors based on the second image */
        .bg-purple-cell {
            background-color: #534572;
            color: #fff;
        }
        .bg-dark-purple-cell {
            background-color: #2b1f48;
            color: #fff;
        }
        .bg-white-cell {
            background-color: #fff;
            color: #2b1f48;
        }
        .bg-light-gray-cell {
            background-color: #e5e7eb;
            color: #1a202c;
        }
        .text-dark-gray {
            color: #4b5563;
        }
        .text-purple-600 {
            color: #7c3aed; /* A slightly brighter purple */
        }
        /* Left-aligned content for table cells */
        .align-left {
            text-align: left;
            padding-left: 1rem;
        }
        /* Custom font sizes for the table cells */
        .text-size-1 {
            font-size: 1rem;
        }
        .text-size-0-8 {
            font-size: 0.8rem;
        }
        .text-purple {
	color: #eee;
	font-size: 0.875rem;
        }

        /* ----- 新增的表格樣式開始 ----- */
        .new-table-container {
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }

        .new-table th, .new-table td {
            text-align: center;
            border: 1px solid #666; /* Lighter cell borders */
            font-weight: normal; /* Make text not bold */
        }
        
        .new-table th:first-child, .new-table td:first-child {
            text-align: left;
            padding-left: 1rem;
        }

        .new-table thead th {
            background-color: #2b1f48; /* Dark purple from original file */
            color: #ffffff;
            font-weight: normal;
            text-align: center;
            font-size: 1rem;
        }
        
        .new-table th.header-cell {
            background-color: #534572;
            font-weight: normal;
            padding: 1rem 0.5rem;
            font-size: 1rem;
        }

        .new-table tbody tr {
            background-color: #ffffff;
        }
        
        .new-table td.left-header {
            background-color: #534572;
            color: #ffffff;
            font-weight: normal;
            text-align: left;
            font-size: 0.8rem;
            padding: 1rem 0.5rem;
        }
        
        .new-table td.light-gray-cell {
            background-color: #e5e7eb;
            color: #4b5563;
            font-weight: normal;
            font-size: 0.8rem;
            padding: 1rem 0.5rem;
        }
        
        .new-table td.gen-ai-cell {
            background-color: #534572;
            color: #ffffff;
            font-weight: normal;
            font-size: 0.8rem;
            padding: 1rem 0.5rem;
        }

        .new-table td.it-specialist-cell {
            background-color: #2b1f48;
            color: #ffffff;
            font-weight: normal;
            font-size: 0.8rem;
            padding: 1rem 0.5rem;
        }
        
        .new-table td.dark-gray-cell {
            background-color: #d1d5db;
            color: #4b5563;
            font-weight: normal;
            font-size: 0.8rem;
            padding: 1rem 0.5rem;
        }
        .legend-text {
            font-size: 0.8rem;
        }
        
        /* Responsive adjustments */
        @media (max-width: 640px) {
            .new-table {
                font-size: 0.875rem;
            }
            .new-table th, .new-table td {
                padding: 0.5rem;
            }
        }
        /* ----- 新增的表格樣式結束 ----- */
        
        /* 手機版專屬樣式 (小於 768px 的螢幕) */
        @media (max-width: 767px) {
            /* 調整主標題文字大小 */
            h1 {
                font-size: 1.5rem;
            }
            h2 {
                font-size: 1.25rem;
            }
            /* 調整 section 標題文字大小 */
            .main-h3 {
                font-size: 1.5rem;
                line-height: 2rem;
            }
            /* 調整內文、列表文字大小 */
            p, li, a {
                font-size: 1rem;
            }
            .custom-highlight-text {
                font-size: 1rem;
                line-height: 1.5rem;
            }
            /* 調整卡片文字大小 */
            .custom-card-text {
                font-size: 0.875rem;
            }
            /* 調整百分比數字大小 */
            .custom-percentage {
                font-size: 2.5rem;
            }
            .text-lg {
                font-size: 0.9rem;
            }
            /* 調整模擬練習數字大小與粗細，讓它與周圍文字一樣大 */
            .mock-exam-number {
                font-size: 0.9rem;
                font-weight: normal;
                color: #FACC15;
            }
            /* 手機版移除間距 */
            .mock-exam-container {
                gap: 0rem;
            }
        }
        /* 調整模擬練習區塊的內距與數字大小 */
        .mock-exam-box {
            padding: 0.75rem; /* 縮小內距 */
            border-radius: 0.75rem;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            /* 手機版使用 46% 的寬度 */
            width: 46%;
            display: inline-block;
            margin: 0 5px; /* 添加一些左右間距 */
        }
        /* 桌面版專屬樣式 */
        @media (min-width: 768px) {
            .mock-exam-box {
                /* 桌機版使用 30% 的寬度 */
                width: 30%;
            }
            /* 調整區塊內距 */
            #practice-exam {
                padding-top: 3rem;
                padding-bottom: 0rem;
            }
            /* 桌面版時，讓數字維持較大的字體 */
            .mock-exam-number {
                font-size: 2.5rem;
                font-weight: 700;
                color: #FACC15;
            }
        }

        /* 修正了導致直向排列的 CSS */
        @media (max-width: 767px) {
            #practice-exam .flex-col.sm:flex-row {
                flex-direction: row;
                justify-content: center;
                align-items: center;
            }
            #practice-exam .space-y-4.sm:space-y-0 {
                margin-top: 0;
            }
            #practice-exam .sm:space-x-8 > :not([hidden]) ~ :not([hidden]) {
                --tw-space-x-reverse: 0;
                margin-right: calc(1rem * var(--tw-space-x-reverse));
                margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
            }
        }
        
        .card-container {
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }

        @media (min-width: 768px) {
            .card-container {
                flex-direction: row;
                align-items: stretch;
            }
            .card-item {
                display: flex;
                flex-direction: column;
                flex-grow: 1;
            }
        }

        .unesco-logo-container {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 0.8rem;
        }

        .unesco-logo {
            height: 2.5rem;
            margin-bottom: 0.75rem;
        }
    body,td,th {
	font-family: "Noto Sans TC", sans-serif;
}
a:link {
	color: rgba(0,167,219,1);
}