.elementor-9494 .elementor-element.elementor-element-42ece58f{--display:flex;--background-transition:0.3s;}/* Start custom CSS for text-editor, class: .elementor-element-68a70da9 */<style>
        /*----------------------------------------------------------------------------
        CSS Stylesheet for Industrial Wastewater Treatment Page
        ----------------------------------------------------------------------------*/

        /*----------------------------------------------------------------------------
        Global Styles
        ----------------------------------------------------------------------------*/
        body {
            font-family: 'Noto Sans TC', Arial, sans-serif; /* 採用 Google Noto Sans TC 字體，支援中文並提供優雅外觀 */
            line-height: 1.7; /* 增加行高，提升閱讀流暢度 */
            color: #333; /* 主要文字色為深灰色，減少眼部疲勞 */
            margin: 0;
            padding: 0;
            background-color: #f4f7f6; /* 柔和的背景色調 */
            text-align: justify; /* 內容文本兩端對齊，呈現專業版面 */
        }

        .container {
            max-width: 1200px; /* 設定頁面最大寬度 */
            margin: 20px auto; /* 上下留白並居中顯示 */
            padding: 0 20px; /* 左右留有內邊距 */
            background-color: #fff; /* 主要內容區塊背景色 */
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* 柔和的陰影，增加層次感 */
            border-radius: 8px; /* 圓角邊緣 */
            overflow: hidden; /* 確保子元素圓角效果正確 */
        }

        /*----------------------------------------------------------------------------
        Header Styles
        ----------------------------------------------------------------------------*/
        header {
            text-align: center;
            padding: 30px 20px 20px 20px; /* 增加上方與下方間距 */
            border-bottom: 1px solid #e0e0e0; /* 分隔線，區隔 Header 與內容 */
            background-color: #ffffff; /* Header 背景色 */
            border-top-left-radius: 8px; /* 頂部左側圓角 */
            border-top-right-radius: 8px; /* 頂部右側圓角 */
        }

        header img {
            max-width: 284px; /* 根據原始要求設定圖片寬度 */
            height: auto; /* 自動調整高度以保持比例 */
            display: block; /* 確保圖片作為區塊元素，以便居中 */
            margin: 0 auto; /* 水平居中圖片 */
            border-radius: 4px; /* 圖片輕微圓角 */
        }

        /*----------------------------------------------------------------------------
        Heading Styles
        ----------------------------------------------------------------------------*/
        h1, h2, h3 {
            color: #005bab; /* 主要標題顏色，品牌識別色 */
            margin-bottom: 25px; /* 標題與下方內容的間距 */
            border-left: 5px solid #007bff; /* 左側裝飾線，增加視覺權威感 */
            padding-left: 15px; /* 裝飾線與文字的間距 */
            text-align: left; /* 標題左對齊 */
        }

        h1 {
            font-size: 2.5em; /* 主要文章標題，較大字體 */
            margin-top: 0; /* 首個 H1 取消額外頂部外距 */
            border-left-color: #00aaff; /* 特殊顏色標記主標題 */
        }

        h2 {
            font-size: 1.9em; /* 章節標題 */
            margin-top: 30px; /* 章節標題上方增加間距 */
            border-left-color: #66c2ff;
        }

        h3 {
            font-size: 1.5em; /* 小節標題 */
            margin-top: 20px;
            border-left-color: #99d9ff;
        }

        /*----------------------------------------------------------------------------
        Content Section Styles
        ----------------------------------------------------------------------------*/
        section {
            margin-bottom: 30px; /* 區塊之間的間距 */
            padding: 25px; /* 區塊內容的內邊距 */
            background-color: #ffffff; /* 區塊背景色 */
            border-radius: 8px; /* 區塊圓角 */
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08); /* 輕微陰影增加層次 */
        }

        section p {
            margin-bottom: 15px; /* 段落之間的間距 */
        }

        /*----------------------------------------------------------------------------
        List Styles
        ----------------------------------------------------------------------------*/
        ul {
            list-style-type: disc; /* 標準圓點列表 */
            margin-left: 25px; /* 增加左邊距 */
            padding-left: 0; /* 取消預設 padding */
            color: #444; /* 列表文字顏色 */
        }

        ul li {
            margin-bottom: 12px; /* 列表項之間的間距 */
            padding-left: 5px; /* 列表符號與文本的微調 */
        }

        /*----------------------------------------------------------------------------
        FAQ Section Styles
        ----------------------------------------------------------------------------*/
        .faq-container {
            margin-top: 25px;
            border: none; /* FAQ 容器不需額外邊框 */
        }

        .faq-item {
            margin-bottom: 15px;
            border: 1px solid #e0e0e0; /* 問答項目的邊框，更柔和 */
            border-radius: 5px;
            overflow: hidden; /* 確保圓角效果正確 */
            background-color: #fefefe; /* 問答項目背景色 */
        }

        .faq-question {
            background-color: #007bff; /* 按鈕背景色，與標題一致 */
            color: white;
            border: none;
            padding: 15px 20px; /* 增加按鈕的填充空間 */
            width: 100%;
            text-align: left; /* 文字左對齊 */
            font-size: 1.15em; /* 按鈕標題字體稍大 */
            cursor: pointer;
            transition: background-color 0.3s ease; /* 平滑的背景色過渡 */
            display: flex; /* 使用 Flexbox 使內容對齊 */
            justify-content: space-between; /* 文字靠左，箭頭（如果需要）靠右 */
            align-items: center; /* 垂直居中 */
            font-weight: 700; /* 問題標題加粗 */
        }

        .faq-question:hover {
            background-color: #0056b3; /* 滑鼠懸停時加深顏色 */
        }

        /* 增加一個小的 "+" 圖標或文字，表示可展開 */
        .faq-question::after {
            content: '\002B'; /* 加號 Unicode */
            font-size: 1.3em;
            font-weight: bold;
            transition: transform 0.3s ease;
            color: rgba(255, 255, 255, 0.8); /* 淺色加號 */
        }

        .faq-question.active::after {
            content: '\002D'; /* 減號 Unicode */
            transform: rotate(0deg); /* 減號不需要旋轉 */
        }

        .faq-answer {
            display: none; /* 預設隱藏答案 */
            padding: 20px; /* 答案區域的內邊距 */
            border-top: 1px solid #e0e0e0; /* 與問題按鈕的分隔線 */
            background-color: #f8f9fa; /* 答案區域的背景色，稍有差異 */
            color: #444; /* 答案文本顏色 */
            font-size: 1em; /* 答案字體大小 */
        }

        /*----------------------------------------------------------------------------
        Footer Styles
        ----------------------------------------------------------------------------*/
        footer {
            text-align: center;
            margin-top: 40px;
            padding: 30px 20px 25px 20px; /* 增加 Footer 的上下間距 */
            border-top: 1px solid #e0e0e0; /* 分隔線 */
            background-color: #ffffff; /* Footer 背景色 */
            border-bottom-left-radius: 8px; /* 底部左側圓角 */
            border-bottom-right-radius: 8px; /* 底部右側圓角 */
            font-size: 0.95em; /* 字體稍小，與內容區分 */
            color: #555; /* 較淺的文字顏色 */
        }

        footer a {
            color: #007bff; /* 連結顏色 */
            text-decoration: none; /* 取消下劃線 */
            transition: color 0.3s ease, text-decoration 0.3s ease; /* 平滑過渡 */
            font-weight: 700; /* 加粗連結文字 */
        }

        footer a:hover {
            color: #0056b3; /* 滑鼠懸停時顏色加深 */
            text-decoration: underline; /* 懸停時顯示下劃線 */
        }

        /*----------------------------------------------------------------------------
        Responsive Design (適用於各種螢幕尺寸)
        ----------------------------------------------------------------------------*/
        @media (max-width: 1200px) {
            .container {
                padding: 0 15px; /* 在容器較小時，減少左右邊距 */
            }
        }

        @media (max-width: 992px) {
            h1 { font-size: 2.2em; }
            h2 { font-size: 1.7em; }
            h3 { font-size: 1.3em; }
            .faq-question { font-size: 1.05em; }
        }

        @media (max-width: 768px) {
            body { padding: 10px; } /* 在小螢幕上進一步減少身體邊距 */
            .container { margin: 10px auto; } /* 小螢幕上容器邊距調整 */

            h1 { font-size: 1.9em; }
            h2 { font-size: 1.6em; }
            h3 { font-size: 1.2em; }

            header { padding: 20px 10px 15px 10px; }
            section { padding: 20px 15px; }
            footer { padding: 20px 15px; }

            .faq-question {
                font-size: 1em; /* 小螢幕上問題按鈕字體縮小 */
                padding: 12px 15px;
            }
            .faq-answer {
                padding: 15px; /* 小螢幕上答案內邊距調整 */
            }
        }

        @media (max-width: 480px) {
            h1 { font-size: 1.7em; }
            h2 { font-size: 1.4em; }
            h3 { font-size: 1.1em; }

            header img {
                max-width: 90%; /* 在極小螢幕上，Logo 可以佔據更多寬度 */
            }

            .faq-question {
                font-size: 0.95em;
                padding: 10px 12px;
            }
            .faq-answer {
                padding: 10px;
            }
        }

    </style>/* End custom CSS */