@charset "utf-8";
/*=====================全域屬性======================*/
:root {
	--w1300: 1300px;
    /* 顏色 */
    --color-main: #0e529a;
	--color-orange-placeholder: #ff9900;
    --color-blue-placeholder: #3498db;
    --color-red-placeholder: #e74c3c;
    --color-text: #333;
    --color-background: #fff;
    --color-border: #ddd;
    --color-link: #333;
    --color-link-hover: #0056b3;
}
*, *:before, *:after { box-sizing: border-box;}
html, body { padding:0; margin:0; overflow-x:hidden; color:#777;}
html>body .gsc-inline-block { white-space:nowrap;}
html {
/*針對 Safiri Mobile 旋轉時自動放大做的調整*/
-webkit-text-size-adjust: 100%;
font-size:1em; line-height:1.6;}
html.Font-Small { font-size:0.8em;}
html.Font-Medium { font-size:1em;}
html.Font-Large { font-size:1.25em;}
body { font-family:'Arial','Helvetica','微軟正黑體', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;}
body > form { display:block; width:100%; height:auto; overflow:hidden; margin:0 auto; position:relative; z-index:0;}

a,
a:link,
a:visited { color: var(--color-link); text-decoration: none; border:2px solid rgba(0,0,0,0);}
a:hover,
a:focus { color: var(--color-link-hover); text-decoration: underline;}
/* Enhanced Focus Indicator for AAA */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
iframe:focus-visible {
    outline: 3px solid #0055aa;
    outline-offset: 2px;
    box-shadow: 0 0 0 calc(3px + 1px) rgba(0, 85, 170, 0.3); /* Optional shadow */
    border-radius: 2px; /* Slight rounding */
}
button {
    cursor: pointer;
    font-family: inherit;
    font-size: inherit; /* Inherit font size from body */
    padding: 0.5em 1em; /* Relative to button's inherited font size */
    border: 1px solid #fff;
    color: #1a1a1a;
    border-radius: 4px;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}
button:hover, button:focus {
    background-color: #e0e0e0; /* Slightly darker */
    border-color: #adadad;
}
.btn {cursor: pointer;}
/*-----START : 針對無障礙設定-----*/
*:not(body):focus{ background:yellow; border:2px solid var(--color-main); outline:0; color: var(--color-main);}
input:focus{ -webkit-appearance: none; background:yellow; border:2px solid var(--color-main); outline:0;}
/* 時間字級 */
time, .time-text, .mark { /* .time-text for non-semantic time */
    font-size:0.875em;
    color: #999;
    display: block;
    margin-top: 5px;
}

/*跳到主要內容區塊*/
.Accesskey_JtoC { display:block; width:30px; height:30px; overflow:hidden; position:absolute; top:0; left:5px; opacity:0; text-decoration:none; z-index:3; text-indent:-9999px;}
.Accesskey_JtoC:focus{ color:blue; opacity:1;}
.access-key-u { display:block; width:30px; height:30px; overflow:hidden; font-size:1rem; text-align:center; line-height:30px; position:absolute; top:0; left:0; opacity:0; text-decoration:none; z-index:3;}
.access-key-u:focus{ color:blue; opacity:1; line-height:25px;}
.access-key-n { display:block; width:30px; height:30px; overflow:hidden; font-size:1rem; text-align:center; line-height:30px; position:absolute; top:0; left:0; opacity:0; text-decoration:none; z-index:3;}
.access-key-n:focus{ color:blue; opacity:1; line-height:25px;}
.Content .Accesskey_C { display:block; width:100%; height:10px; overflow:hidden; text-decoration:none; text-align:center; z-index:1; opacity:0; position:absolute; top:0; left:0;}
.Content .Accesskey_C:link,
.Content .Accesskey_C:visited,
.Content .Accesskey_C:hover,
.Content .Accesskey_C:active{ color: var(--color-main); font-weight:bold;}
.Content .Accesskey_C:focus{ color:blue; opacity:1;}

/*頂部廣告*/
.banner-top { background:#eee; padding:0 10px; overflow:hidden;}
.banner-top img { display:block; max-width:100%; height:auto; margin:10px auto;}

.Wrapper { display:block; width:100%; height:auto; overflow:hidden;}

.w1300 { width:var(--w1300); margin:0 auto; padding:0 10px;}
/*header*/
.Header { position:relative; z-index:2;}
.Header .header-top-bar { display: flex; justify-content: space-between; align-items: center; height:115px; padding:30px 0; position:relative;}

.Header .header-top-left { display: flex; align-items: center;}
.Header .header-top-left a { font-size:0.875em; margin-right: 10px;}
.Header .font-size-controls span { display:inline-flex; justify-content: center; align-items: center; width:32px; height:32px;
    font-size:0.875em;
    margin-left: 5px;
    cursor: pointer;
    border: 1px solid var(--color-border);
    background-color: #f0f0f0;
    border-radius: 100%;
}
.Header .font-size-controls span:hover,
.Header .font-size-controls span:focus {
    background-color: #e0e0e0;
}
.Header .font-size-controls span.active { background:#333; color:white;}
.Header .header-logo { width:210px; height:56px; position:absolute; left:50%; margin-left:-105px; top:50%; margin-top:-28px;}
.Header .header-logo a { display:block; overflow:hidden;}
.Header .header-logo img { float:left;
    max-height: 56px; /* 根據描述調整 */
}
.Header .header-logo .LogoH1 { display:none;}

.Header .themeSwitch { width:58px; height:32px; position:absolute; left:305px; top:50%; margin-top:-16px; overflow:hidden; border-radius:100px;}
.Font-Small .Header .themeSwitch { left:283px;}
.Font-Medium .Header .themeSwitch { left:330px;}
.Font-Large .Header .themeSwitch { left:335px;}
.Header .themeSwitch a { display:block; width:100%; height:32px; overflow:hidden; text-indent:100%; white-space:nowrap; position:relative; border-radius:100px; border:1px solid var(--color-border);}
.Header .themeSwitch a:before { content:''; display:block; width:24px; height:24px; position:absolute; top:3px; left:3px; background:url(/tw/Images/Layout/NEW/themeSwitch-sun.png) center center no-repeat, #555; background-size:60%;
border-radius:100%;}
.Header .themeSwitch a:after { content:''; display:block; width:24px; height:24px; position:absolute; top:3px; right:3px; background:url(/tw/Images/Layout/NEW/themeSwitch-moon.png) center center no-repeat, #fff; background-size:80%;
border-radius:100%;}

.Header .header-social-icons { display: flex;}
.Header .header-social-icons a { margin-left: 10px;}
.Header .header-social-icons a img { width:30px;}
.Header .header-social-icons a.mobile { display:none;}

.main-navigation { 
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	position:relative;
	}
.main-navigation .w1300 { padding:0 10px;}
.header-fixed .Nav { position:fixed; top:0; left:0; z-index:3; width:100%; background:white; border:0;}
.header-fixed .Nav .w1300 { position:relative; width:calc( 1300px - 20px ); margin:0 auto; padding:0;
border-bottom: 1px solid var(--color-border);}
.menu-toggle {
 display: none; /* 在桌面版隱藏漢堡選單 */
}
 .nav-menu {
 display: none; /* 在桌面版藏漢選單 */
}
.main-navigation > div > ul {
	padding:0;
	margin:0;
    list-style: none;
    display: flex;
    justify-content: center; /* 或 space-around */
}
.main-navigation > div > ul > li { position:relative;}
.main-navigation > div > ul > li > a {
    font-size: 1.125em;
    font-weight: bold;
    padding: 10px 20px;
    display: block;
}
.main-navigation > div > ul > li:hover > a { color: var(--color-link-hover); text-decoration: underline;}
.main-navigation > div > ul > li > a + .sub-menu { display:none; position:absolute; top:100%; left:0; white-space:nowrap; background:var(--color-link-hover); padding:0; margin:0;}
.main-navigation > div > ul > li > a + .sub-menu * { padding:0; margin:0; list-style:none; text-decoration:none;}
.main-navigation > div > ul > li > a + .sub-menu li { width:100%; position:relative;}
.main-navigation > div > ul > li > a + .sub-menu li a { font-size:0.8em; color:#fff; padding:5px 10px; display:block; width:100%; max-width:calc( 20em + 20px ); overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.main-navigation > div > ul > li > a + .sub-menu li a:hover,
.main-navigation > div > ul > li > a + .sub-menu li a:active,
.main-navigation > div > ul > li > a + .sub-menu li:hover a:link,
.main-navigation > div > ul > li > a + .sub-menu li:hover a:visited,
.main-navigation > div > ul > li > a + .sub-menu li:hover a:hover,
.main-navigation > div > ul > li > a + .sub-menu li:hover a:active{ background:rgba(0,0,0,0.5);}
.main-navigation > div > ul > li > a + .sub-menu li a:focus,
.main-navigation > div > ul > li > a + .sub-menu li:hover a:focus{ color: var(--color-link-hover); background:yellow;}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu { display:none; position:absolute; top:0; left:100%; white-space:nowrap; background:var(--color-link-hover); padding:0; margin:0;}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu * { padding:0; margin:0; list-style:none; text-decoration:none;}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu li { width:100%;}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu li a { font-size:0.8em; color:#fff; padding:5px 10px; display:block; width:100%; max-width:calc( 20em + 20px ); overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu li a:hover,
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu li a:active{ background:rgba(0,0,0,0.8);}
.main-navigation > div > ul > li > a + .sub-menu li a + .sub-menu li a:focus{ color: var(--color-link-hover); background:yellow;}
.btn-magnifier {
    background: none;
	position:absolute;
	right:0;
	top:50%;
	height:40px;
	margin-top:-20px;
    border: none;
    padding: 0.5em; /* Relative to button's inherited font size */
    color:  #1a1a1a;
    border-radius: 50%; /* Make it circular */
    display: flex; /* Center icon */
    align-items: center;
    justify-content: center;
    /* Font size inherited from body */
}
.btn-magnifier:hover, .btn-magnifier:focus {
    background-color: #e6f0f7;
    color: #006d79;
}
.btn-magnifier svg {
    width: 24px; /* Fixed pixel size for icons */
    height: 24px; /* Fixed pixel size for icons */
}

/* --- Search Overlay --- */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.8);;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem; /* Kept rem for spacing */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.search-overlay[hidden] {
    display: none; /* Ensure it's removed from layout when hidden */
}
.menu-btn__burger { width:24px; height:24px;}
.search-overlay:not([hidden]) {
    opacity: 1;
    visibility: visible;
}

.search-overlay-content {
    position: relative;
    background-color: #ffffff;
    padding: calc(1rem * 3); /* Kept rem for spacing */
    border-radius: 8px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    /* Font size inherited from body */
}

.btn-popuup-close {
    position: absolute;
    top: 1rem; /* Kept rem for positioning */
    right: 1rem; /* Kept rem for positioning */
    background: none;
    border: none;
    padding: 0.5em; /* Relative to button's inherited font size */
    color:#4d4d4d;
    border-radius: 50%;
    line-height: 1; /* Prevent extra space */
    /* Font size inherited from body */
}
.btn-popuup-close:hover, .btn-popuup-close:focus {
    color:  #1a1a1a;
    background-color: #009cb3;
}
.btn-popuup-close svg {
    width: 28px; /* Fixed pixel size for icons */
    height: 28px; /* Fixed pixel size for icons */
    display: block;
}

.search-overlay-form {
    display: flex;
    gap: 0.5rem; /* Kept rem for spacing */
}
.search-overlay-form input[type="text"] {
    flex-grow: 1;
    font-size: 1.1em; /* Converted from rem to em */
	border:1px solid #ccc;
}
.search-overlay-form .SearchBtn {
	cursor: pointer;
    color: #1a1a1a;
    border-radius: 4px;
    padding: 0.6em 1.5em; /* Relative to button's inherited font size */
    flex-shrink: 0; /* Prevent button from shrinking */
    background-color: #006d79;
    color: #ffffff;
    border-color: 1px solid #006d79;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}
.search-overlay-form .SearchBtn:hover, .search-overlay-form .SearchBtn:focus {
    background-color: #005d73;
    border-color: #005d73;
}
.mobile-nav-menu { display:none;}
.sr-only { /* Screen Reader Only */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
input[type="search"], input[type="text"], input[type="email"] {
    padding: 0.6em 0.8em; /* Relative to input's inherited font size */
    border: 1px solid #fff;
    border-radius: 4px;
    font-size: 1em; /* Relative to parent's font size (inherits from body) */
    width: 100%; /* Default to full width within container */
}
.slogan-banner {
    width: 100%; /* 橫跨滿版 */
	height:340px;
	line-height:260px;
    padding: 40px 20px;
	background:url(/tw/images/Layout/NEW/slogan-banner.jpg) center center no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 20px 0;
}

.slogan-banner p {
    font-size:2.5em;
    font-weight: normal;
    color: #fff; /* 假設標語文字為白色以在橘色背景上突出 */
    margin: 0;
}

.footer-container {
	width:100%; height:auto; overflow:hidden;
	background:url(/tw/Images/Layout/NEW/footer.jpg) bottom center no-repeat;
	background-size:contain;
	background:#ffffff;
    margin: 0 auto;
    padding: 0 0 10px 0;
    text-align: center;
}

.sitemap {
    display: flex;
    justify-content: center;
    gap: 40px; /* 組間距 */
    margin-bottom: 60px;
}

.sitemap ul {
    list-style: none;
	width:calc( 25% - 40px );
	margin:0; padding:0;
}
.sitemap ul.wpFooterMenu_News li { width:50%; float:left; text-align:right;}
.sitemap ul.wpFooterMenu_News li:nth-child(even) { text-align:left;}
.sitemap ul li a {
    font-size:1.25em; /* 網站地圖字級 */
    display: block;
    padding: 5px;
}

.copyright {
    font-size:0.875em;
    color: #666;
    margin: 0;
}
@media only screen and (min-width:0px) and (max-width:1300px){
	.w1300 { width:100%;}
	.main-navigation .w1300 { position:relative; padding-right:40px;}
	.main-navigation > div > ul > li > a { padding:10px 15px;}
	.header-fixed .Nav .w1300 { width:100%;}
}
@media only screen and (min-width:0px) and (max-width:1080px){
	.main-navigation > div > ul > li > a { padding:10px;}
}
@media only screen and (min-width:0px) and (max-width:960px){
	.Wrapper { padding-right:40px;}
	.Wrapper > .w1300 { padding-right:0;}
	.Header .link-box { display:none;}
	.Header .header-top-bar {flex-direction:row-reverse; border-bottom:1px solid var(--color-border); background:white;}
	.Header .header-logo { left:0; margin-left:50px;}
	.Header .header-social-icons { position:fixed; top:0; height:100%; right:0; width:40px; display:block; background:white; padding:0;}
	.Header .header-social-icons a { margin:0; padding:10px 5px; height:40px; width:100%; display:block; overflow:hidden;}
	.Header .header-social-icons a.mobile { display:block; font-family:Arial, Helvetica, sans-serif; font-size:0.9em; text-align:center;}
	.Header .header-social-icons a img { display:block; max-width:100%; height:auto; margin:0 auto;}
	
	.Header .themeSwitch { position:fixed; width:32px; height:58px; top:auto; margin:0; left:auto; right:4px; bottom:4px; z-index:1;}
	.Font-Small .Header .themeSwitch,
	.Font-Medium .Header .themeSwitch,
	.Font-Large .Header .themeSwitch { left:auto; right:4px;}
	.Header .themeSwitch a { height:58px;}
	.Header .themeSwitch a:after { top:auto; bottom:3px;}
	.access-key-n { top:auto; bottom:0;}
	.main-navigation { border:0; position:static;}
	.main-navigation .w1300 { position:static; padding:0;}
	.main-navigation > div > ul { display:none;}
	
	.Header .btn-magnifier{ left:0; top:0; margin-top:40px;
	width:35px; height:35px;
    cursor: pointer;
    border: solid 1px #222;
    border-radius: 4px;
    margin-right: 15px;}
	.Header .btn-magnifier svg { display:none;}
	.Header .btn-magnifier .menu-inner { padding:16px 8px;}
	.Header .btn-magnifier .menu-btn__burger {width: 18px;
    height: 2px;
    background: #000;
    transition: all .4s ease-in-out;}
	.Header .btn-magnifier .menu-btn__burger::before,
	.Header .btn-magnifier .menu-btn__burger::after { content: '';
    position: absolute;
    width: 18px;
    height: 2px;
    background: #000;
    transition: all .4s ease-in-out;}
	.Header .btn-magnifier .menu-btn__burger::before {transform: translateY(-7px);}
	.Header .btn-magnifier .menu-btn__burger::after {transform: translateY(7px);}
	.Header .btn-magnifier[aria-expanded="true"] { opacity:0;}
	.Header .btn-magnifier[aria-expanded="true"] .menu-btn__burger {
    background: transparent;
    box-shadow: none;}
	.Header .btn-magnifier[aria-expanded="true"] .menu-btn__burger::before {transform: rotate(45deg);
    background: #fff;}
	.Header .btn-magnifier[aria-expanded="true"] .menu-btn__burger::after {transform: rotate(-45deg);
    background: #fff;}
	.header-fixed  .Header { width:calc( 100% - 40px ); left:0; position:fixed; top:0; background:white;}
	.header-fixed  .Header .header-top-bar { width:calc( 100% - 10px ); left:10px; height:76px;}
	.header-fixed  .Header .btn-magnifier { position:fixed; left:10px; margin-top:20.5px;}
	.header-fixed .Nav { position:static; border-bottom:none;}
	.header-fixed .Nav .w1300 { border:0;}
	
	.search-overlay { display:block; position:fixed; width:100%; height:100vh; overflow-y:auto; background:#222222; top:0; left:0; z-index:3; transition:all .4s ease-in-out; padding:10px; padding-top:50px;}
	.search-overlay:before { content:''; display:block; width:100%; height:50px; position:fixed; top:0; left:0; background:#222; z-index:1;}
	.search-overlay-content { background:none; padding:0; max-width:none; box-shadow:none;}
	.btn-popuup-close { position:fixed; top:5px; left:5px; color:white; z-index:2; border-radius:0; width:44px;}
	.mobile-nav-menu { width:100%; height:auto; overflow:hidden; display:flex; flex-wrap:wrap;}
	.mobile-nav-menu dl { width:50%; color:white; line-height:1.8; margin-bottom:20px; padding:10px;}
	.mobile-nav-menu dl:nth-child(2n+1) { padding-left:0;}
	.mobile-nav-menu dl:nth-child(2n+2) { padding-right:0;}
	.mobile-nav-menu * { padding:0; margin:0; list-style:none; text-decoration:none;}
	.mobile-nav-menu dt { font-weight:bold;}
	.mobile-nav-menu dl a { color:white; position:relative; padding-left:10px; width:100%; display:block; overflow:hidden;}
	.mobile-nav-menu dl a:before { content:'-'; padding-right:5px; position:absolute; width:10px; top:0; left:0;}
	.mobile-nav-menu dl#wpMobileMenu_News dd { width:50%; float:left;}
	
	.sitemap ul li a { font-size:1em;}
}

@media only screen and (min-width:0px) and (max-width:768px){
	.banner-top { padding:0;}
	.banner-top img { margin:0 auto;}
	.Accesskey_JtoC { display:none;}
	.access-key-u { display:none;}
	.access-key-n { display:none;}
	.Content .Accesskey_C { display:none;}
	.slogan-banner { height:40vw; line-height:1.4; padding:0 20px;
	display: flex; /* Center icon */
    align-items: center;
    justify-content: center;}
	.slogan-banner p {font-size:2em;}
	.slogan-banner p span { display:block; width:100%;}
	.slogan-banner p span.none { display:none;}
	.sitemap { padding:0;
        gap: 10px;
		flex-wrap:wrap;
    }
	.sitemap ul { width:calc( 50% - 20px ); float:left;}
}

@media only screen and (min-width:0px) and (max-width:512px){
	.Header .header-top-bar { height:76px;}
	.Header .btn-magnifier { margin-top:20.5px;}
	.Header .header-logo { margin-left:40px; width:129px;}
	.Header .header-logo a { margin-top:10px;}
	.Header .header-logo img { height:36px;}
	.Header .font-size-controls span { margin-left:2.5px;}
	.slogan-banner p {font-size:1.5em;}
	.sitemap ul li a { padding:2.5px;}
}

@media only screen and (min-width:0px) and (max-width:430px){
	.slogan-banner p {font-size:1.2em;}
	.sitemap ul li a { font-size:0.9em;}
}