@charset "utf-8";
/* CSS Document */
        /* 刊頭背景圖設定 */
		html {
            scroll-behavior: smooth;
        }
        body {
            display: flex;
            flex-direction: column;
            min-height: 100vh; /* 最少與視窗等高 */
            margin: 0;
        }
        .page-header {
			position: relative; /* 讓內部的絕對定位元素以此區塊為基準 */
            background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('img/header_background.jpg');
            background-size: cover;
            background-position: center;
            height: 300px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
        }
		/* ================= 左上角回首頁按鈕 ================= */
		.home-btn {
            position: absolute;
            top: 25px;
            left: 25px;
            width: 45px;
            height: 45px;
            color: white;
            border-radius: 50%; /* 圓形按鈕 */
            display: flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            backdrop-filter: blur(4px); /* 加入一點毛玻璃效果讓圖示更凸顯 */
            transition: all 0.3s ease;
            z-index: 10; /* 確保浮在標題上方 */
        }

        .home-btn:hover {
            background-color: #dc3545; /* 滑鼠懸停時變成主題紅色 */
            border-color: #dc3545;
            color: white;
            transform: scale(1.1); /* 稍微放大 */
        }
		/* 預設或行動版顯示斷行 */
		.mobile-break {
			display: block;
		}
		/* 螢幕寬度大於 768px 時（PC 版），將 br 隱藏，文字就會連成一排 */
		@media (min-width: 768px) {
			.mobile-break {
				display: none;
			}
		}
		.badge {
			--bs-badge-padding-x: 0.5em;
			--bs-badge-padding-y: 0.5em;
			--bs-badge-font-size: 0.8em;
		}
		.container {
			--bs-gutter-x: 3rem;
		}
		
		/* 手機版預設大小 */
		.my-p {
			font-size: 1.25rem; 
		}
		
		/* 螢幕寬度 >= 768px（平板與 PC）時改變大小 */
		@media (min-width: 768px) {
			.my-p {
				font-size: 1rem;
			}
		.accordion {
			--bs-accordion-btn-icon-width: none;
		}	
		}	
		.accordion {
			--bs-accordion-btn-padding-y: 0.8rem;
			--bs-accordion-btn-icon-width: none;
			--bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgb(253 13 13 / 25%);
		}	
		.accordion-button {
			font-size: 1.25rem;
		}
		.accordion-button small {
			font-size: 0.9rem;
		}
		
		/* 底部背景圖設定 */
        .footer-bg {
            /* 這裡設定了一層 70% 黑色的遮罩來確保文字清楚，並請將 url 替換為您的底部背景圖 */
            background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('img/footer_background.jpg');
            background-size: cover;
            background-position: center;
        }
		/* 設定錨點區塊的上方預留空間，避免文字貼齊視窗頂部 */
        section {
            scroll-margin-top: 40px; 
        }
		/* ================= 錨點按鈕：僅顯示紅色底線 ================= */
        .anchor-btn {
            display: inline-block;
            padding: 10px 20px;
            color: #333;                   /* 預設文字顏色為深灰色 */
            text-decoration: none;         /* 移除預設的超連結底線 */
            background-color: transparent; /* 背景透明 */
            border: none;                  /* 移除所有邊框 */
            border-bottom: 1px solid #dc3545; /* 僅設定底部邊框為紅色 (2px粗細) */
            font-weight: 500;
            text-align: center;
            transition: all 0.3s ease;     /* 加入平滑的轉場動畫 */
        }

        /* 滑鼠懸停時的效果 (可選) */
        .anchor-btn:hover {
            color: #dc3545;                /* 懸停時文字也變成紅色 */
            background-color: rgba(220, 53, 69, 0.05); /* 加上極淡的紅色背景增加點擊感 */
        }
		.badge-bt {
			--bs-badge-padding-x: 0.7em;
		}
		/* ================= 回到頂端按鈕樣式 ================= */
        #backToTopBtn {
            position: fixed;        /* 固定在畫面上 */
            bottom: 30px;           /* 距離底部 30px */
            right: 30px;            /* 距離右側 30px */
            z-index: 99;            /* 確保不會被其他元素遮擋 */
            opacity: 0;             /* 預設為完全透明 (隱藏) */
            visibility: hidden;     /* 預設為隱藏狀態，避免誤觸 */
            transition: all 0.3s ease; /* 淡入淡出的動畫效果 */
            width: 50px;
            height: 50px;
            border-radius: 50%;     /* 變成圓形按鈕 */
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 10px rgba(0,0,0,0.2); /* 加上陰影增加立體感 */
            border: none;
            background-color: #dc3545; /* Bootstrap primary 顏色 */
            color: white;
            cursor: pointer;
        }

        #backToTopBtn:hover {
            background-color: #a9313c; /* 滑鼠懸停時顏色加深 */
            transform: translateY(-3px); /* 懸停時稍微往上浮動 */
        }

        /* 當按鈕被加上 show 類別時，顯示按鈕 */
        #backToTopBtn.show {
            opacity: 1;
            visibility: visible;
        }
		.accordion-button:not(.collapsed) {
			color: #dc3545;
			background-color: #dc354559;
		}