/* =========================================
   基本重置與字體設定
========================================= */
* {
    box-sizing: border-box;
}

body {
    font-family: "Noto Sans TC", "微軟正黑體", -apple-system, sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.7;
    /* 打破死白：使用極淺的橘紅底，並疊加隱約的放射狀漸層光暈，增加空間感 */
    background-color: #f3ece9; /* 中間背景底色加深一點 */
    background-image: 
        radial-gradient(circle at 0% 0%, rgba(251, 146, 60, 0.05) 0%, transparent 40%),
        radial-gradient(circle at 100% 100%, rgba(239, 68, 68, 0.05) 0%, transparent 40%);
    color: #334155;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* =========================================
   網站頂部標題區塊 (立體層次與流體漸層線)
========================================= */
header {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px); /* 微微的毛玻璃效果 */
    text-align: center;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05);
}

.header-container {
    position: relative;
}

.header-container h1 {
    margin: 0;
    padding: 14px 0; /* 原本 25px，縮小標題上下空白 */
    font-size: 2.2rem;
    letter-spacing: 2px;
    font-weight: 700;
    /* 標題字套用漸層色：由深紅過渡到亮橘色 */
    background: linear-gradient(90deg, #991b1b, #f97316);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

/* =========================================
   主選單導覽列設計
========================================= */
.main-nav > ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 10px; /* 增加按鈕之間的呼吸空間 */
}

.main-nav > ul > li {
    position: relative;
}

.main-nav > ul > li > a {
    display: block;
    padding: 9px 24px; /* 原本上下 14px，改成 9px；左右 24px 不變 */
    color: #475569;
    text-decoration: none;
    font-size: 1.05rem;
    font-weight: 600;
    border-radius: 8px 8px 0 0; /* 上方圓角，像分頁標籤 */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 懸停時的科技光澤感：改為亮橘色 */
.main-nav > ul > li > a:hover {
    color: #f97316;
    background-color: #fff7ed;
}

.main-nav > ul > li > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, #991b1b, #f97316);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.main-nav > ul > li > a:hover::after {
    width: 100%;
}

/* =========================================
   下拉式選單設計 (研究成果)
========================================= */
.dropdown-content {
    display: none; 
    position: absolute;
    background-color: #ffffff; 
    min-width: 180px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.1);
    border: 1px solid #e2e8f0;
    border-radius: 0 0 8px 8px;
    z-index: 10;
    flex-direction: column;
    top: 100%; 
    left: 0;
    padding: 5px 0;
    margin: 0;
    list-style: none;
    overflow: hidden;
}

.dropdown:hover .dropdown-content {
    display: flex; 
    animation: fadeInDown 0.3s ease forwards;
}

@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.dropdown-content a {
    display: block; 
    color: #475569; 
    padding: 12px 20px;
    text-align: left;
    text-decoration: none; 
    font-size: 0.95rem;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

.dropdown-content a:hover {
    background-color: #f8fafc; 
    color: #f97316; 
    border-left: 3px solid #f97316;
    padding-left: 25px; /* 推移小動畫 */
}

/* =========================================
   首頁 Header
========================================= */
.home-page .home-header {
    position: fixed; /* Header 固定在畫面最上方 */
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background-color: transparent; /* 頁面最上方時沒有底色 */
    box-shadow: none;
    backdrop-filter: none;
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* 下滑時平順變化 */
}

.home-header-inner {
    max-width: 1200px; /* Header 內容最大寬度 */
    height: 82px; /* Header 高度 */
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    align-items: center; /* 上下置中 */
    justify-content: space-between; /* 左側名稱、右側選單 */
}

.home-brand {
    color: #ffffff; /* 頁面最上方時，實驗室名稱顯示白色 */
    text-decoration: none;
    font-size: 1.7rem;
    font-weight: 700;
    letter-spacing: 2px;
    white-space: nowrap; /* 避免「熱傳增強實驗室」換行 */
    background: none; /* 頂端狀態不要使用漸層背景 */
    -webkit-text-fill-color: #ffffff; /* 確保 Chrome 顯示白色文字 */
}

/* 首頁 Header 上的導覽列 */
.home-page .main-nav {
    background-color: transparent; /* 不顯示白色底 */
    border-bottom: none;
}

.home-page .main-nav > ul > li > a {
    color: #ffffff; /* 初始狀態選單使用白字 */
}

.home-page .main-nav > ul > li > a:hover {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.15); /* 滑鼠移入時淡淡透明白色 */
}


/* =========================================
   首頁大型合照
========================================= */
.home-hero {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.home-hero img {
    width: 100%;
    height: auto; /* 完整保持 LabTeam.jpg 原始比例 */
    display: block;
}

.home-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.22); /* 稍微壓暗照片，讓 Header 白字清楚 */
}

.home-hero-content {
    position: absolute;
    top: 18%; /* 將文字放到圖片中上方 */
    left: 50%; /* 水平移到圖片中央 */
    transform: translateX(-50%); /* 讓整個文字區塊真正水平置中 */
    width: 90%; /* 避免文字在較小螢幕上太擠 */
    color: #ffffff;
    text-align: center; /* 三行文字全部置中 */
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65); /* 提高文字清晰度 */
}

.home-hero-content h2 {
    margin: 0 0 10px 0;
    font-size: 3.2rem;     /* 中文標題: 熱傳增強實驗室 */
    font-weight: 700;
    letter-spacing: 3px;
}

.home-hero-content p {
    margin: 0 0 6px 0;
    font-size: 1.65rem;    /* 英文名稱: Heat Transfer Enhancement Laboratory */
    font-weight: 600;
}

.home-hero-content span {
    font-size: 1.2rem;     /* 學校名稱: National Central University */
    font-weight: 400;
}


/* =========================================
   首頁 Header 下滑後
========================================= */
.home-page .home-header.scrolled {
    background-color: rgba(255, 255, 255, 0.97); /* 往下滑後變成白色 Header */
    box-shadow: 0 3px 15px rgba(15, 23, 42, 0.10); /* 增加淡陰影 */
    backdrop-filter: blur(8px);
}

.home-page .home-header.scrolled .home-brand {
    background: linear-gradient(90deg, #991b1b, #f97316); /* 下滑後變回原本深紅到橘色漸層 */
    -webkit-background-clip: text; /* 讓漸層只顯示在文字範圍 */
    background-clip: text; /* 其他支援瀏覽器使用 */
    -webkit-text-fill-color: transparent; /* 讓漸層顯示在文字上 */
}

.home-page .home-header.scrolled .main-nav > ul > li > a {
    color: #475569; /* 下滑後導覽列改回深色 */
}

.home-page .home-header.scrolled .main-nav > ul > li > a:hover {
    color: #f97316;
    background-color: #fff7ed; /* 下滑後恢復原本橘色 hover */
}

/* =========================================
   其他頁面 Header
========================================= */
.site-header {
    position: sticky; /* 捲動頁面時固定在最上方 */
    top: 0;
    width: 100%;
    z-index: 100;
    background-color: rgba(255, 255, 255, 0.97); /* 其他頁面直接使用白色背景，不透明 */
    box-shadow: 0 3px 15px rgba(15, 23, 42, 0.10); /* Header 下方淡淡陰影 */
    backdrop-filter: blur(8px); /* 輕微毛玻璃效果 */
    text-align: initial; /* 取消舊 Header 的全部置中 */
}

.site-header-inner {
    max-width: 1200px; /* 與首頁 Header 使用相同寬度 */
    height: 82px; /* 與首頁 Header 使用相同高度 */
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    align-items: center; /* 上下置中 */
    justify-content: space-between; /* 左邊實驗室名稱、右邊導覽列 */
}

.site-brand {
    text-decoration: none;
    font-size: 1.7rem; /* 與首頁名稱大小相同 */
    font-weight: 700;
    letter-spacing: 2px;
    white-space: nowrap; /* 避免名稱換行 */
    background: linear-gradient(90deg, #991b1b, #f97316); /* 原本深紅到橘色漸層 */
    -webkit-background-clip: text; /* 讓漸層限制在文字內 */
    background-clip: text;
    -webkit-text-fill-color: transparent; /* 顯示文字漸層 */
}

.site-header .main-nav {
    background-color: transparent; /* 不另外產生一條白色導覽列 */
    border-bottom: none; /* 移除原本導覽列下方線條 */
}

.site-header .main-nav > ul > li > a {
    color: #475569; /* 其他頁面導覽文字維持深灰藍色 */
}

.site-header .main-nav > ul > li > a:hover {
    color: #f97316; /* 滑鼠移上去變橘色 */
    background-color: #fff7ed; /* 淡橘色背景 */
}

/* =========================================
   主要版面配置容器
========================================= */
.container {
    max-width: 1100px; 
    margin: 50px auto;
    padding: 0 20px;
    flex: 1; 
}

/* =========================================
   首頁：卡片網格排版
========================================= */
.card-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); 
    gap: 35px; 
}

/* 單一卡片設計 - 增加立體微漸層與懸浮感 */
.card {
    background: linear-gradient(145deg, #ffffff 0%, #fefcfb 100%);
    padding: 40px;
    border-radius: 16px; 
    border: 1px solid rgba(226, 232, 240, 0.8);
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease; 
}

/* 卡片頂部的高光裝飾線：改為橘紅漸層 */
.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #991b1b, #f97316, #fb923c);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.card:hover {
    transform: translateY(-8px); 
    box-shadow: 0 20px 30px rgba(15, 23, 42, 0.08);
}

.card:hover::before {
    opacity: 1;
}

/* 卡片標題 */
.card-title {
    font-size: 1.55rem;
    font-weight: 700;
    color: #1e293b;
    margin: 10px 0 25px 0;
    width: 100%;
    text-align: center;
    letter-spacing: 1px;
}

.card-title a {
    text-decoration: none;
    color: inherit;
    transition: color 0.3s ease;
}

.card-title a:hover {
    color: #f97316;
}

.card:not(.text-only-card) {
    justify-content: center; /* 讓一般卡片內的文字垂直置中 */
}

.card:not(.text-only-card) .card-title {
    margin: 0; /* 文字置中 */
}

.text-only-card {
    justify-content: center;
    min-height: 100px;
}

/* 按鈕：橘紅漸層邊框 */
.btn-more {
    margin-top: auto;
    padding: 10px 35px;
    background-color: #ffffff;
    color: #f97316;
    border: 2px solid #f97316;
    border-radius: 30px; /* 膠囊圓角，更顯現代 */
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(249, 115, 22, 0.1);
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* 按鈕懸停的背景滑動填滿效果：亮橘到深紅 */
.btn-more::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 0%; height: 100%;
    background: linear-gradient(90deg, #f97316, #991b1b);
    transition: all 0.4s ease;
    z-index: -1;
}

.btn-more:hover {
    color: #ffffff;
    border-color: #991b1b;
    box-shadow: 0 6px 15px rgba(153, 27, 27, 0.2);
}

.btn-more:hover::before {
    width: 100%;
}

/* =========================================
   內頁：專用白色內容區塊 
========================================= */
.page-box {
    background: #ffffff;
    padding: 55px;
    border-radius: 16px;
    border: 1px solid rgba(226, 232, 240, 0.8);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    min-height: 500px; 
}

.page-box h2 {
    color: #1e293b;
    font-size: 1.8rem;
    margin-top: 0;
    margin-bottom: 35px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f1f5f9; 
    position: relative;
}

/* 內頁標題漸層飾條：深紅到亮橘 */
.page-box h2::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #991b1b, #f97316);
    border-radius: 2px;
}

/* =========================================
   最新消息頁面
========================================= */
.news-list {
    display: flex;
    flex-direction: column;
}

.news-item {
    display: flex;
    flex-direction: column; /* 日期與內文上下排列 */
    align-items: flex-start; /* 日期與內文靠左對齊 */
    padding: 18px 10px; /* 每則消息上下保留一些空間 */
}

.news-date {
    width: 130px;
    flex-shrink: 0; /* 固定日期區域寬度，讓每則消息整齊對齊 */
    color: #f97316;
    font-size: 0.95rem;
    font-weight: 700;
}

.news-title {
    color: #334155;
    font-size: 1.05rem;
    font-weight: 500;
}

.news-link {
    color: #334155; /* 維持原本深灰藍色文字 */
    font-size: 1.05rem;
    font-weight: 500;
    text-decoration-line: underline; /* 顯示底線 */
    text-decoration-style: dotted; /* 改回細點狀虛線 */
    text-decoration-color: #94a3b8; /* 使用柔和的灰藍色 */
    text-decoration-thickness: 1px; /* 改回 1px，避免底線太粗 */
    text-underline-offset: 3px; /* 底線與文字保持適當距離 */
}

.news-link:hover {
    color: #f97316; /* 滑鼠移上去才變橘色 */
    text-decoration-color: #f97316; /* 底線跟著變橘色 */
}

/* =========================================
   活動／研討會照片頁面
========================================= */
.activity-info {
    margin-bottom: 35px;
    color: #64748b;
    font-size: 1rem;
}

.activity-gallery {
    width: 100%;
}

.activity-section {
    margin-bottom: 60px;
}

.activity-section h3 {
    color: #991b1b;
    font-size: 1.35rem;
    margin: 0 0 30px 0;
    padding-left: 15px;
    border-left: 5px solid #f97316;
}

.activity-photo {
    margin: 0 0 50px 0;
    text-align: center;
}

.activity-photo img {
    width: 100%;
    max-width: 900px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.activity-photo figcaption {
    margin-top: 12px;
    color: #334155;
    font-size: 1.05rem;
    font-weight: 500;
}

/* =========================================
   成員頁面專屬樣式
========================================= */
.member-section h3 {
    color: #991b1b;
    margin-bottom: 25px;
    padding-left: 15px;
    border-left: 5px solid #f97316;
    font-size: 1.3rem;
}

.member-group {
    margin: 0 0 30px 20px; /* 博士、碩士各區塊之間的距離 */
}

.member-group h4 {
    margin: 0 0 10px 0;
    color: #475569;
    font-size: 1.15rem;
    font-weight: 700; /* 博士、碩士的小標題 */
}

.member-text {
    margin: 0;
    color: #1e293b;
    font-family: inherit; /* 使用與網站其他內文相同的字體 */
    font-size: 1rem; /* 改成與一般內文相同大小 */
    font-weight: 400; /* 使用一般內文字重 */
    line-height: 1.7; /* 與 body 的行距一致 */
    letter-spacing: 0; /* 取消額外字距，避免姓名看起來和其他文字不同 */
}

.graduate-row {
    display: flex;
    align-items: baseline; /* 讓 115年 與姓名依文字基線對齊 */
    gap: 25px; /* 畢業年份與姓名之間的距離 */
}

.graduate-year {
    color: #f97316;
    font-family: inherit; /* 使用相同字體 */
    font-weight: 700; /* 年份保留粗體，方便辨識 */
    font-size: 1rem; /* 與姓名使用相同字級 */
    line-height: 1.7; /* 與姓名使用相同行距 */
    white-space: nowrap; /* 避免「115年」換行 */
}

/* =========================================
   合作單位頁面
========================================= */
.partner-list {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
}

.partner-card {
    display: flex;
    align-items: center;
    padding: 30px 0;
    border-bottom: 1px dashed #cbd5e1; /* 改為虛線增加設計感 */
}

.partner-card:last-child {
    border-bottom: none;
}

.partner-logo {
    width: 250px;
    flex-shrink: 0;
    text-align: center;
    margin-right: 50px;
    background: transparent; /* 移除 LOGO 後方白色方框 */
    padding: 0; /* 移除原本方框內的留白 */
    box-shadow: none; /* 移除陰影 */
    border-radius: 0; /* 移除方框圓角 */
}

.partner-logo img {
    max-width: 100%;
    max-height: 80px;
    object-fit: contain;
}

.partner-logo img.kyushu-logo {
    transform: scale(0.9); /* 僅將九州大學 LOGO 縮小為原本的 90%，不影響其他 LOGO */
}

.partner-info h3 {
    margin: 0 0 8px 0;
    color: #1e293b;
    font-size: 1.25rem;
    font-weight: 700;
}

.partner-info a {
    color: #f97316;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    transition: color 0.2s ease;
}

.partner-info a:hover {
    color: #991b1b;
    text-decoration: underline;
}

/* =========================================
   頁尾設計 (用戶要求深岩灰底，其餘不變)
========================================= */
footer {
    text-align: center;
    padding: 35px 20px;
    background: linear-gradient(to right, #0f172a, #1e293b); /* 深邃的星空科技底色，保持原樣 */
    color: #94a3b8;
    margin-top: auto; 
    font-size: 0.95rem;
    box-shadow: inset 0 5px 15px rgba(0,0,0,0.2);
}

/* =========================================
   手機版 Responsive Design
========================================= */
@media screen and (max-width: 768px) {

    /* -----------------------------------------
       Header
    ----------------------------------------- */
    .site-header,
    .home-page .home-header {
        width: 100%;
        max-width: 100%;
        overflow: visible;
    }

    .home-header-inner,
    .site-header-inner {
        width: 100%;
        max-width: 100%;
        height: auto;

        margin: 0;
        padding: 10px 16px;

        display: flex;
        flex-direction: column; /* 第一排網站名稱、第二排導覽列 */
        align-items: center;
        justify-content: center;

        gap: 6px;
    }

    .home-brand,
    .site-brand {
        font-size: 1.4rem;
        letter-spacing: 1px;

        white-space: nowrap;
    }


    /* -----------------------------------------
       手機版導覽列
    ----------------------------------------- */
    .main-nav {
        width: 100%;
        max-width: 100%;

        overflow: visible;
    }

    .main-nav > ul {
        width: 100%;
        min-width: 0;

        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;

        gap: 0;
        margin: 0;
        padding: 0;
    }

    .main-nav > ul > li {
        position: relative;

        flex: 0 1 auto;
        min-width: 0;
    }

    .main-nav > ul > li > a {
        display: block;

        padding: 8px 4px;

        font-size: 0.86rem;
        white-space: nowrap;
    }


    /* -----------------------------------------
       手機版研究成果下拉選單
    ----------------------------------------- */
    .dropdown {
        position: relative;
    }

    .dropdown-content {
        display: none;

        position: absolute; /* 浮在 Header 外面，不撐高 Header */
        top: 100%;
        right: 0;
        left: auto;

        width: 165px;
        min-width: 165px;

        margin: 0;
        padding: 5px 0;

        background-color: #ffffff;

        border: 1px solid #e2e8f0;
        border-radius: 0 0 8px 8px;

        box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);

        z-index: 200;

        overflow: hidden;
    }

    /* 手機點擊「研究成果」後顯示 */
    .dropdown:focus-within .dropdown-content {
        display: flex;
        flex-direction: column;

        animation: fadeInDown 0.2s ease forwards;
    }

    .dropdown-content li {
        width: 100%;
    }

    .dropdown-content a {
        display: block;

        width: 100%;

        padding: 11px 15px;

        color: #475569;

        font-size: 0.9rem;
        text-align: left;
        white-space: nowrap;

        text-decoration: none;
    }

    .dropdown-content a:hover {
        padding-left: 20px;

        color: #f97316;
        background-color: #f8fafc;
    }


    /* -----------------------------------------
       首頁 Header
    ----------------------------------------- */
    .home-page .home-brand {
        color: #ffffff;
        -webkit-text-fill-color: #ffffff;
    }

    .home-page .main-nav > ul > li > a {
        color: #ffffff;
    }

    .home-page .home-header.scrolled .main-nav > ul > li > a {
        color: #475569;
    }


    /* -----------------------------------------
       首頁 Hero
    ----------------------------------------- */
    .home-hero {
        width: 100%;
        max-width: 100%;
    }

    .home-hero img {
        width: 100%;
        height: auto;

        display: block;
    }

    .home-hero-content {
        top: 35%;
        left: 50%;

        width: 94%;

        transform: translateX(-50%);

        text-align: center;
    }

    .home-hero-content h2 {
        margin-bottom: 8px;

        font-size: 1.9rem;
        line-height: 1.3;
        letter-spacing: 1px;

        white-space: nowrap;
    }

    .home-hero-content p {
        margin-bottom: 4px;

        font-size: 1rem;
        line-height: 1.4;
    }

    .home-hero-content span {
        font-size: 0.85rem;
    }


    /* -----------------------------------------
       主要內容
    ----------------------------------------- */
    .container {
        width: calc(100% - 32px); /* 左右各保留 16px */
        max-width: none;

        margin: 30px auto;
        padding: 0;
    }


    /* -----------------------------------------
       首頁卡片
    ----------------------------------------- */
    .card-grid {
        display: grid;

        grid-template-columns: 1fr;
        gap: 20px;
    }

    .card {
        width: 100%;
        max-width: 100%;

        min-height: auto;

        padding: 28px 20px;
    }

    .card-title {
        width: 100%;

        margin: 0;

        font-size: 1.35rem;
        line-height: 1.5;

        white-space: normal;
        word-break: keep-all;
    }

    .text-only-card {
        min-height: 90px;
    }


    /* -----------------------------------------
       首頁相關網站按鈕
    ----------------------------------------- */
    .text-only-card > div {
        width: 100%;

        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        gap: 10px !important;
    }

    .text-only-card .btn-more {
        margin-top: 0;

        padding: 8px 16px;

        font-size: 0.9rem;

        white-space: nowrap;
    }


    /* -----------------------------------------
       內頁白色內容區
    ----------------------------------------- */
    .page-box {
        width: 100%;
        max-width: 100%;

        padding: 30px 20px;

        border-radius: 12px;

        min-height: auto;
    }

    .page-box h2 {
        margin-bottom: 25px;

        font-size: 1.55rem;
        line-height: 1.4;
    }


    /* -----------------------------------------
       最新消息
    ----------------------------------------- */
    .news-list {
        width: 100%;
        max-width: 100%;
    }

    .news-item {
        width: 100%;
        max-width: 100%;

        padding: 14px 5px;
    }

    .news-date {
        width: auto;

        margin-bottom: 5px;

        font-size: 0.9rem;
    }

    .news-title,
    .news-link {
        max-width: 100%;

        font-size: 1rem;
        line-height: 1.6;

        word-break: keep-all;
        overflow-wrap: break-word;
    }

    .news-link {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;

        gap: 8px;
    }

    .news-link-tag {
        font-size: 0.78rem;
    }


    /* -----------------------------------------
       成員頁面
    ----------------------------------------- */
    .member-group {
        margin-left: 0;
    }

    .member-text {
        line-height: 1.8;
    }

    .graduate-row {
        flex-direction: column;
        align-items: flex-start;

        gap: 5px;
    }


    /* -----------------------------------------
       合作單位
    ----------------------------------------- */
    .partner-card {
        flex-direction: column;
        align-items: center;

        padding: 25px 0;

        text-align: center;
    }

    .partner-logo {
        width: 200px;
        max-width: 100%;

        margin-right: 0;
        margin-bottom: 20px;
    }

    .partner-logo img {
        max-width: 100%;
        max-height: 75px;
    }

    .partner-info {
        width: 100%;
        max-width: 100%;
    }

    .partner-info h3 {
        font-size: 1.15rem;
    }

    .partner-info a {
        font-size: 0.9rem;

        word-break: break-all;
    }


    /* -----------------------------------------
       活動／研討會照片頁面
    ----------------------------------------- */
    .activity-info {
        margin-bottom: 25px;
    }

    .activity-section {
        margin-bottom: 45px;
    }

    .activity-section h3 {
        margin-bottom: 20px;

        font-size: 1.2rem;
    }

    .activity-photo {
        width: 100%;

        margin-bottom: 35px;
    }

    .activity-photo img {
        width: 100%;
        max-width: 100%;
        height: auto;

        display: block;

        margin: 0 auto;
    }

    .activity-photo figcaption {
        margin-top: 8px;

        font-size: 0.95rem;
    }


    /* -----------------------------------------
       Footer
    ----------------------------------------- */
    footer {
        width: 100%;
        max-width: 100%;

        margin-left: 0;
        margin-right: 0;
    }

}