@charset "utf-8";

/*theme-bg 背景色*/
.theme-bg{background:#ffffff; background-image: url(../img/bg.jpg); }

/*模組背景色*/
div#main_top,.breadcrumb,div#left,div#middle,div#main_right,div#main_bottom{ background: #ffffff;}
.center-module-bg{background: #ffffff;}
div#main_top .module,div#left .module,div#middle .module,div#main_right .module,div#main_bottom .module,.module{/* background:#ffffff; */}

:not(.module-content).module-padding, .module{/* box-shadow: 0 0 5px #d8d8d8; */padding: 10px 20px;margin:5px;}
/**************************************************
= header 上方登入選單
********************/
header{ background:rgba(255, 255, 255, 0.7); }
header,
header a,
header button,
header .dropdown-content a { color:#545454;}
header>a, header>div{ color: #545454;}
header .fontsize button { color: #ffffff; background-color:#777777; }
header .fontsize button:hover { color: #ffffff; background-color:#00ad8f;}
header .dropdown svg { fill:#545454;}
header a:hover,
header>div:hover{ background:none;color:#00ad8f;}
header .dropdown:hover svg{ fill:#00ad8f;}
header .dropdown-content{ background:#d8d8d8;}
header .dropdown-content a { color:#545454;} 
header .dropdown-content a:hover{ background-color:#ffdf01;}
.login .top-space header { margin-top: 45px;}

@media screen and (max-width: 767px) {
.login .top-space header { margin-top: 0px;}
header {border:0;/* border-bottom:1px solid #dadada; */}
}

/**************************************************
= theme 上方主圖
********************/
.logo,.logo a {/* font-size: 2rem; */color:#545454;}

h1 strong{ position: absolute; top: 15px; left: 25px;}
h1 strong.picshow { position: absolute; top: -100px;}

@media (max-width: 520px){
.theme { height: 90px; }
}

/**************************************************
= navbar 橫式選單模組
********************/
.navbar {/* background-color: #397dab; */}
.navbar ul{ max-width: 1500px;}
.navbar li a{color:#313131}
.navbar li:hover a {/* color:#ee7a00; */}
.navbar li:hover .navbar-svg { fill:#00ad8f;}
.navbar li:hover ul a,.navbar ul li a:focus + .navrwd + .menuhidden{ color:#313131;
/*background-color:#ffdf01*/
}
/* .navbar li:hover ul a:hover { background-color:#ee7a00; color:#ffffff;} */
.navbar li .menuhidden.navbar-menu a {/* background-color:#ffdf01; */color:#313131;}
.navbar li .menuhidden.navbar-menu a:hover {/* background-color:#ee7a00; */color:#ffffff;}
.navbar li ul li + li {/* border-top:1px solid #ccb300; */}
.navbar li ul li a{min-width:max-content;}
.navrwd-svg {fill:#ee7a00;}

@media screen and (min-width: 768px){
.navbar ul { padding: 5px 15px; justify-content: center;}
.navbar ul li ul { padding: 5px 0 0;}
}
@media screen and (min-width: 992px){
.navbar>ul>li { padding: 0 15px;}
}
@media (max-width: 991px) and (min-width: 768px){
.navbar>ul>li { padding: 0 20px;}
}
@media screen and (max-width: 767px) {
.ct-row .navbar {/* background-color: #397dab!important; */}

 .navbar li {
     width: 100%;
     background: #252627d9;
 }

 .navbar ul {
     /*background: #1d3883; color: #ffffff;*/
 }

 .navbar li a {
     /* background: #001b84; */
     color: #ffffff;
 }

 .navbar ul li {
     border-bottom: 1px solid #879289;
 }

 .navbar li:hover a {
     color: #ffffff;
 }

 .navbar li:hover ul a {
     background-color: #1d388300;
     color: #ffffff;
 }

 .navbar li:hover ul a:hover {
     /* background-color: #fbfeff; */
     color: #1c2c74;
 }

 .navbar li .menuhidden.navbar-menu a {
     /* background-color: #1d3883; */
     color: #ffffff;
 }

 .navbar li .menuhidden.navbar-menu a:hover {
     /* background-color: #fbfeff; */
     /* color: #1c2c74; */
 }

 .navbar .show-menu {
     color: #bc8ce4;
     background: #006eaa;
 }

 .navbar .show-menu .ct-hamburger svg {
     fill: #ffffff;
 }

 .navrwd-svg {
     background: rgba(255, 255, 255, 0.8);
     border: none;
 }

 .navrwd-svg svg {
     fill: #001b84;
 }

 .navbar li ul li {
     border: 0;
 }
}


/**************************************************
= breadcrumb 麵包屑
********************/
.breadcrumb-item + .breadcrumb-item::before {border-left:8px solid #ffab39;}
.breadcrumb-item.active {color:#eb8f0c;}
.breadcrumb a{color:#545454;}
.breadcrumb a:hover{color:#eb8f0c; font-weight: 700;}

/**************************************************
= footer 最下方聯絡資訊
********************/
.footerbg{ position: relative;  background-image: url(../img/footerbg.png);  background-color: inherit; background-position:top left; background-repeat: no-repeat; color:#ffffff;}
.footerbg a {color:#ffffff;}
.connect-links,.connect .text.connect-explorer{ color:#ffffff;}
.connect-links:hover{text-decoration: none;color:#ffdf01;}
.copyright { background-color:#ffdf01; color:#565656;}

@media (max-width :1400px){
.footerbg{background-image: url(../img/footerbg-s.png);}
}

@media (max-width :767px){
.footerbg{background-image: url(../img/footerbg-xs.png);}
}


/**************************************************
= module title 模組標題
********************/
.module-title {color: #006399;}
.module-title::before {content: "";position: absolute;width: 100%;height: 5px;bottom: 0;left: 0;background: #006eaa;border-radius: 5px;}
.module-title::after {content: "";position: absolute;width: 20px;height: 5px;background: #009473;bottom: 0;left: 0px;border-radius: 5px;}

/**************************************************
= color
********************/

/* tab頁簽 ********************/
.nav-tabs {border-bottom-color:#ffffff;}
.nav-tabs .nav-item a{ background:#d8d8d8; color:#545454;  border-color: #d8d8d8;}
.nav-pills .nav-item a{ background:#d8d8d8; color:#545454; }
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover { background:#ffdf01; color: #545454;  border-color: #ffdf01;}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link { background:#ffdf01; color: #545454; border-color: #ffdf01;}
.nav-pills .nav-link:focus,
.nav-pills .nav-link:hover { background:#ffdf01; color: #545454;}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link { background:#ffdf01; color: #545454;}
.nav-tabs .nav-link.disabled,
.nav-pills .nav-link.disabled {color:#c9c9c9; border-bottom-color: #ffffff;}
.ct-dropdown-menu { background-color: #fff; border:1px solid #777777;}
.ct-dropdown-item {color: #3a92e9;}
.nav-tabs .nav-item .ct-dropdown-menu a{ background:#ffffff; color:#545454;}
.nav-tabs .nav-item .ct-dropdown-menu :focus,
.nav-tabs .nav-item .ct-dropdown-menu :hover {background-color:#f1f2f2;}


/* table表格 ********************/
.ct-table th,.ct-table td {border-top-color:#ccc;}
.ct-table tbody + tbody {border-top-color:#ccc;}
.table-striped tbody tr:nth-of-type(odd) { background-color:#f3f3f4;}
.ct-table .thead-light th { color: #ee7a03; background-color: #ffffff; border-top: none; border-bottom: 1px solid #ee7a03;}
.ct-table .thead-dark th { color: #ffffff;  background-color:#ee7a03; border-color:#ee7a03;}
.table-bordered {border-color: #e9ecef;}
.table-bordered th,.table-bordered td {border-color:#ccc;}
.table-hover tbody tr:hover { background-color:#fffce8;}

@media only screen and (max-width: 575px){
.table-responsive .ct-table  td:before,
.table-responsive .ct-table th:before{color:#ee7a03;}
}

/* nav-Vertical 直式選單 ********************/
.nav-Vertical ul li .sub-menu-item{/* background: #fff9d2; *//* color: #ee7a03; *//* border-bottom-color: #ffeb64; */}
.nav-Vertical ul li .sub-menu-item:hover { background:#ffdf01; color: #545454; }
.nav-Vertical ul li .sub-menu-item a{color:#ee7a03;}
.nav-Vertical ul li .sub-menu-item a:hover,
.nav-Vertical ul li .sub-menu-item a:focus,
.nav-Vertical ul li .sub-menu-item a:active,
.nav-Vertical ul li .sub-menu-item .active,
.nav-Vertical ul li .sub-menu-item:hover a{color:#545454;}
.nav-Vertical ul li .menu-arrow svg{ fill:#545454;}
.nav-Vertical ul li ul li .sub-menu-item{ background:#ffffff;}
.nav-Vertical ul li ul li ul li .sub-menu-item{ background:#eefefd;}
.nav-Vertical ul li ul li .sub-menu-item:hover,
.nav-Vertical ul li ul li ul li .sub-menu-item:hover { background:#fafafa; color: #545454; border-left-color:#ee7a03;}
.vertical-hamburger { background:#ffffff;}
.vertical-hamburger svg { fill: #ee7a03;}

/* sitemap 導覽頁 ********************/
.ct-sitemap{background:#ffffff;}
.sitemap-title { background:#474747; color: #ffffff;}
.sitemap-block { background: #ffffff;}
.sitemap-item { border: 1px solid #afafaf;}
.sitemap-item a { color: #545454; border-left-color: #b5b5b5; background: #f0f0f0;}
.sitemap-item a:hover,
.sitemap-item a:focus{ background: #ffe4bf; border-left-color: #e38b21;}
.sitemap-icon svg {fill: #ffffff;}


/*上方無障礙 ********************/
.focusable{opacity: 0}
a.focusable:focus {opacity: 1;}

/**************************************************
= hotkeyicon 快捷列 ********************/
.gd-xxs6,.gd-xxs12{float: left;}
.hotkeyicon { color:#545454; font-size: 1.1rem; font-weight: 600; width: 100%;background-color:#ffffff;  margin: 20px 0 0; padding: 15px;}
.hotkeyicon .icon-1,.hotkeyicon .icon-2,.hotkeyicon .icon-3,.hotkeyicon .icon-4,.hotkeyicon .icon-5,.hotkeyicon .icon-6 { position: relative; cursor: pointer; height: auto; max-width: 100%; margin: 5px; padding: 10px; background:#f5f5f5; transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;top: 0px;}
.hotkeyicon .icon-1:hover,.hotkeyicon .icon-2:hover,.hotkeyicon .icon-3:hover,.hotkeyicon .icon-4:hover,.hotkeyicon .icon-5:hover,.hotkeyicon .icon-6:hover{top: 5px;}
.hotkeyicon .icon-svg1,.hotkeyicon .icon-svg2,.hotkeyicon .icon-svg3,.hotkeyicon .icon-svg4,.hotkeyicon .icon-svg5,.hotkeyicon .icon-svg6{ margin: 0 auto;width: 90px; height: 80px; max-width: 100%; background-repeat: no-repeat;}
.hotkeyicon .icon-svg1 img,.hotkeyicon .icon-svg2 img,.hotkeyicon .icon-svg3 img,.hotkeyicon .icon-svg4 img,.hotkeyicon .icon-svg5 img,.hotkeyicon .icon-svg6 img{ width: 90px; height: 80px; max-width: 100%;}

/*舊版hotkeyicon圖片固定式*/
.hotkeyicon .icon-svg1-1,.hotkeyicon .icon-svg2-1,.hotkeyicon .icon-svg3-1,.hotkeyicon .icon-svg4-1,.hotkeyicon .icon-svg5-1,.hotkeyicon .icon-svg6-1{ margin: 0 auto;width: 90px; height: 80px; max-width: 100%; background-repeat: no-repeat !important;}
.hotkeyicon .icon-svg1-1{ background:  url(../img/hoticon1.svg);}
.hotkeyicon .icon-svg2-1{ background:  url(../img/hoticon2.svg);}
.hotkeyicon .icon-svg3-1{ background:  url(../img/hoticon3.svg);}
.hotkeyicon .icon-svg4-1{ background:  url(../img/hoticon4.svg);}
.hotkeyicon .icon-svg5-1{ background:  url(../img/hoticon5.svg);}
.hotkeyicon .icon-svg6-1{ background:  url(../img/hoticon6.svg);}

.hotkeyicon .icon-title,.hotkeyicon .icon-title a{ text-align: center;color:#545454; margin-top: 10px;} 
.hotkeyicon .button{ position: relative; width: 100%; padding: 15px; background: #e25f5f; color: #ffffff; border-radius: 2px;transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out; cursor: pointer;}
.hotkeyicon .button:hover{  background: #d83737; padding-left: 25px;}
.hotkeyicon .button::after{ content: ""; position: absolute; background-image: url(../img/cnter-btn-icon.svg); width: 25px; height: 25px; right: 10px; }
.button-block .button-link{ display:block;}
.button-block .button-link + .button-link{ margin-top:12px;}
@media only screen and (max-width: 1400px){
.hotkeyicon{ padding:15px 5px; font-size:1rem;}
.hotkeyicon .button::after{ width: 20px; height: 20px; right:5px;}
}
@media only screen and (max-width: 992px){
.hotkeyicon .icon-1,.hotkeyicon .icon-2,.hotkeyicon .icon-3,.hotkeyicon .icon-4,.hotkeyicon .icon-5,.hotkeyicon .icon-6{ margin: 5px;padding: 8px;}
}
@media only screen and (max-width: 520px){
.hotkeyicon .icon-svg1,.hotkeyicon .icon-svg2,.hotkeyicon .icon-svg3,.hotkeyicon .icon-svg4,.hotkeyicon .icon-svg5,.hotkeyicon .icon-svg6{ width: 70px; height: 60px;}
.hotkeyicon .icon-title, .hotkeyicon .icon-title a { margin-top: 5px;}
}

/**************************************************
= siconbtn fb及相簿按鈕 ********************/
.siconbtn{ position: relative;  margin: 5px; padding: 15px;  border-radius: 8px; text-align: center; transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.siconbtn:hover{ color:#ff6c00}
.siconbtn.btn1{ background:#ee7a03;}
.siconbtn.btn2{ background:#00af8d;}
.siconbtn.btn1:hover{ background:#da6e00;}
.siconbtn.btn2:hover{ background:#00987a;}
.siconbtn .sicontitle{ position: relative; color: #ffffff; font-size: 1rem; font-weight: 600; letter-spacing: 0.1rem; display: table; margin: 0 auto; padding-left: 25px;}
.siconbtn .sicontitle::before{ content:""; position: absolute; left: -15px; top: -5px; width: 32px; height: 32px; background-repeat: no-repeat;}
.siconbtn.btn1 .sicontitle::before{ background-image: url(../img/sicon1.svg);}
.siconbtn.btn2 .sicontitle::before{ background-image: url(../img/sicon2.svg);}


/******模組************************************/
/*span-color-ga003*/
.span-color-ga003,a.span-color-ga003{color:#ee7a03;}
a.span-color-ga003:hover,a.span-color-ga003:focus {color:#545454;}

/*span-color-ga007*/
.span-color-ga007,a.span-color-ga007{color: #ee7a03;}
a.span-color-ga007:hover,a.span-color-ga007:focus {color:#545454;}

/*GA002 公告彙整*/
.btn-tabs{ margin-top: -1px; margin-bottom: 5.5px;}
/*線上報修button-ga009********************/
.repair-basicset .btn-primary { color: #545454;  background-color:#ffdf01;  border-color:#ffdf01;  fill: #545454;}
.repair-basicset .btn-primary:hover,.repair-basicset .btn-primary:focus,.repair-basicset .btn-primary:active,.repair-basicset .btn-primary.active,.repair-basicset .open .ct-dropdown-toggle.btn-primary,.repair-basicset .btn-primary:active:focus,.repair-basicset .btn-primary:active:hover,.repair-basicset .btn-primary.active:hover,.repair-basicset .btn-primary.active:focus{background:#ee7a03; color:#ffffff}
.repair-basicset .btn-primary.active.focus,.repair-basicset .btn-primary.active:focus,.repair-basicset .btn-primary.active:hover,.repair-basicset .btn-primary:active.focus,.repair-basicset .btn-primary:active:focus,.repair-basicset .btn-primary:active:hover,.repair-basicset .open>.ct-dropdown-toggle.btn-primary.focus,.repair-basicset .open>.ct-dropdown-toggle.btn-primary:focus,.repair-basicset .open>.ct-dropdown-toggle.btn-primary:hover{ background:#ee7a03; color:#ffffff}
.repair-basicset .btn-svg svg { fill: #545454; }
.repair-basicset .ct-btn:hover .btn-svg svg { fill: #ffffff;}

/* CGA001 圖文公告換色 ********************/
.ct-focusslider .focus-content .textblock{ background:#b8efe4; color: #545454;border-bottom: 4px solid #49d6bb;}
.ct-focusslider .focus-content a:nth-child(odd) .textblock { background:#fff5b1; color: #545454;  border-bottom: 4px solid #ffdf01;}
.ct-focusslider .focus-content .textblock.notice-color{ background:#f5f5f5; color: #545454;  border-bottom: 4px solid #49d6bb;}
.ct-focusslider .focus-content a:nth-child(odd) .textblock.notice-color { background:#f5f5f5; color: #545454;  border-bottom: 4px solid #ffdf01;}
/*CGA001 圖文公告箭頭顏色*/
.ct-focusslider .focus-controls .focus-arrow{ fill:#ee7a03; }
.ct-focusslider .focus-controls .focus-arrow:hover { fill: #545454;}
.ct-focusslider .focus-controls .focus-arrow.focus-end{ fill: rgba(175, 175, 175, 1);}

/* GA017 全文檢索*******************/
.cmgch-google .btn-all{ color: #ffffff; background-color:#7f7f7f; border-color:#7f7f7f; fill: #ffffff;}
.cmgch-google .btn-all:hover,.cmgch-google .btn-all:focus,.cmgch-google .btn-all:active,.cmgch-google .btn-all.active,.cmgch-google .btn-all:active:focus,.cmgch-google .btn-all:active:hover,.cmgch-google .btn-all.active:hover,.cmgch-google .btn-all.active:focus { color: #545454; background-color:#ffdf01;  border-color:#ffdf01; fill: #545454;}
.cmgch-google .btn-advanced{ color: #ffffff; background-color: #797979; border-color: #797979; fill: #ffffff;}
.cmgch-google .btn-advanced:hover,.cmgch-google .btn-advanced:focus,.cmgch-google .btn-advanced:active,.cmgch-google .btn-advanced.active,.cmgch-google .btn-advanced:active:focus,.cmgch-google .btn-advanced:active:hover,.cmgch-google .btn-advanced.active:hover,.cmgch-google .btn-advanced.active:focus { color: #ffffff; background-color: #676767;  border-color: #676767; fill: #ffffff;}
.cmgch-google .form-group-m input {  caret-color:#ee7a03;} 
.cmgch-google .form-group-m .bar::before {background:#ee7a03;}

/* GA013 文字連結模組 ********************/
.ga013_title:before{ color:#ee7a03;}

/*ALT+C 導盲磚 *******************/
#center {color: #757474;}

/*freeze btn overflow *******************/
#noticeview_to_print .ct-btn {white-space: normal;}

/*權限scrollbar *******************/
.select-menu-container.select-visible .select-menu {overflow-y: auto; height: 150px;}

/*回到top區 *******************/
html {
    scroll-behavior:smooth;
  }
  
.scroll-container {
    width: 40px;
    position: fixed;
    bottom: 5px;
    right: 10px;
    z-index: 1;
}
