
/* 表格基本樣式 */
table {
    width: 100%;
    max-width: 720px;
    margin: 20px auto;
    border-collapse: collapse;
    box-sizing: border-box;
}

/* 表格單元格樣式 */
td {
    padding: 12px 15px;
    border-bottom: 1px solid #e0e0e0;
    word-break: break-all; /* 確保長URL能正確換行 */
    line-height: 1.5;
}

/* 連結樣式 */
td a {
    color: #0066cc;
    text-decoration: none;
    display: inline-block;
    word-wrap: break-word;
    width: 100%;
}

td a:hover {
    text-decoration: underline;
    color: #004499;
}

/* 確保在所有設備上保持一致的外觀 */
@media screen and (max-width: 768px) {
    table {
        padding: 0 15px;
    }
    
    td {
        padding: 12px 15px;
    }
}

@media screen and (max-width: 480px) {
    table {
        padding: 0 15px;
    }
    
    td {
        padding: 12px 15px;
    }
}

/* 確保表格標題行的樣式一致 */
tr:first-child td {
    font-weight: bold;
    background-color: #f5f5f5;
}

/* 優化觸控裝置的點擊體驗 */
@media (hover: none) {
    td a {
        padding: 5px 0;
    }
}
img[src*="07-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="05-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="03-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="01-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_1912-225x300.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="P1210998-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="50.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="Lego-Spike-scaled.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="Chit-Chat-Music-scaled.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="9-1.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="/10 (1).jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}




img[src*="07到校音樂講座2-scaled-e1711366796487-200x300"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="07到校音樂講座1-scaled-e1711366759510-200x300"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="06校園藝術大使-scaled-e1711366641278-169x300"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="05中華文化日5-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="05中華文化日4-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="05中華文化日3-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="05中華文化日2-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="05中華文化日1-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="04聖誕節聯歡會2-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="04聖誕節聯歡會1-300x200.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}




img[src*="03校園音樂大使展關懷2-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}




img[src*="03校園音樂大使展關懷1-scaled-e1711365660326-169x300.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="02音樂事務處「樂韻播萬千」音樂會1-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="02音樂事務處「樂韻播萬千」音樂會2-300x225.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}



img[src*="1-300x169.jpg"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_001-scaled"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_002-scaled"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_003-scaled"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_004-scaled"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="IMG_005-scaled"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="2-300x169"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}


img[src*="A1_1"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A1_2"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A1_3"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A2_1"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A2_2"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A2_3"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A3_1"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A3_2"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}
img[src*="A4_1"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A4_2"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

img[src*="A4_3"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

/* 響應式設計 */
@media screen and (max-width: 768px) {
    img[src*="1-300x169.jpg"] {
        max-width: 350px; /* 平板尺寸 */
    }

    img[src*="IMG_001-scaled"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="IMG_002-scaled"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="IMG_003-scaled"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="IMG_004-scaled"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="IMG_005-scaled"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="2-300x169"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A1_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A1_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A1_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A3_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A3_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
}

@media screen and (max-width: 480px) {

    img[src*="1-300x169.jpg"] {
        max-width: 300px; /* 平板尺寸 */
    }

    img[src*="IMG_001-scaled"] {
        max-width: 300px; /* 平板尺寸 */
    }
    img[src*="IMG_002-scaled"] {
        max-width: 300px; /* 平板尺寸 */
    }
    img[src*="IMG_003-scaled"] {
        max-width: 300px; /* 平板尺寸 */
    }
    img[src*="IMG_004-scaled"] {
        max-width: 300px; /* 平板尺寸 */
    }
    img[src*="IMG_005-scaled"] {
        max-width: 300px; /* 平板尺寸 */
    }
    img[src*="2-300x169"] {
        max-width: 300px; /* 手機尺寸 */
    }
    img[src*="A1_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A1_2"] {
        max-width:
         350px; /* 平板尺寸 */
    }
    img[src*="A1_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A2_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A3_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A3_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_1"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_2"] {
        max-width: 350px; /* 平板尺寸 */
    }
    img[src*="A4_3"] {
        max-width: 350px; /* 平板尺寸 */
    }
}

img[src*="admin-ajax"] {
    max-width: 400px; /* 改用 max-width 而不是固定 width */
    width: 100%; /* 讓圖片可以縮小 */
    height: auto; /* 讓高度根據寬度等比例縮放 */
    object-fit: contain; /* 確保圖片不會被裁切 */
    display: block;
    margin: 20px auto;
}

/* 響應式設計 */
@media screen and (max-width: 768px) {
    img[src*="admin-ajax"] {
        max-width: 350px; /* 平板尺寸 */
    }
}

@media screen and (max-width: 480px) {
    img[src*="admin-ajax"] {
        max-width: 300px; /* 手機尺寸 */
    }
}

/* 通用圖片樣式 */
img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 20px auto;
}

/* 圖片容器樣式 */
.image-container {
    width: 100%;
    max-width: 850px;
    margin: 20px auto;
    padding: 0 15px;
    text-align: center;
    box-sizing: border-box;
}

.image-container img {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

/* 確保所有區塊中的圖片置中 */
section img,
.objective img,
.curriculum-list img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* 移除不必要的響應式變化，保持一致性 */
@media screen and (max-width: 768px) {
    .image-container {
        padding: 0 15px;
        margin: 20px auto;
    }

    img {
        width: 100%;
        margin: 20px auto;
    }
}

@media screen and (max-width: 480px) {
    .image-container {
        padding: 0 15px;
        margin: 20px auto;
    }

    img {
        width: 100%;
        margin: 20px auto;
    }
}