@charset "utf-8";

/**************************************************
= header 上方登入選單
********************/
/*theme-bg 背景色*/
.theme-bg{ background:#fff; position: relative;}

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

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-bg { background:#ffffff}

/**************************************************
= header 上方登入選單
********************/
.login .navopen {overflow-x: hidden;}
.login .top-space header{ margin-top: 45px;}
header{ /*background: rgba(255, 255, 255, 0.9);border: 1px solid #ddd;*/ right: 30px; top: 15px; z-index: 2; border-radius: 20px;}
header>a,header>div{color:#6b420c;}
header .fontsize button {color: #fff; background-color: #ff7d01; border:1px solid #ff7d01; border-radius: 2px; box-shadow: none; padding:0; }
header .fontsize button:hover {background-color: #ec781d; color: #ffffff; }
header .dropdown svg { fill: #6b420c;}
header a:hover,
header>div:hover{ color:#855206; }
header .dropdown:hover svg{ fill: #1f0e05;}
header .dropdown-content a:hover{ color: #ffffff; background-color: #e06a1d; }
.logo,.logo a { font-size: 2rem;  color: #545454;}
.focusable{ opacity: 0;}
.focusable:focus{ opacity: 1;}

@media screen and (max-width: 767px) {
  .login .top-space header{ margin-top: 0px;}
header {border: none; background: #ff8100}
header, header a, header button, header .dropdown-content a { border-radius: 0px; top:0px; left:0px;}
header>a,header>div{ color:#1f0e05; }
header a:hover, header>div:hover { color: #1f0e05;}
header .dropdown svg{ fill:#1f0e05; }
header .dropdown-content a:hover { color: #bc8ce4; background-color: rgb(246, 235, 255);}
.theme-bg { background-position: -550px 30px;}
}

@media screen and (max-width:520px){
.theme-bg { background-position: -880px 0px;}
}

/**************************************************
= theme 上方主圖
********************/
h1 strong { position: relative;}
h1 strong.picshow { position: absolute; top: -600px;}

.theme:before { 
  content: "";
  background: url(../img/leftlogo.png) no-repeat;
  position: absolute;
  top: 15px;
  left: 25px;
  width: 350px;
  height: 50px;
  background-size: contain;}

@media (min-width :1440px){
.logo img { max-width: 600px}
}

@media (min-width :1820px){
.logo img { max-width: 720px}
}

@media (max-width :1440px){
.theme { background-position: -100px top;}
}

@media (max-width :1080px){
.theme { background-position: -500px top;}
}

@media (max-width :992px){
.theme { background-position: revert;}
}

@media screen and (max-width:768px){
  .theme:before { 
    background: url(../img/left-s-logo.png) no-repeat;
    background-size: contain;
    width: 65px;
    height: 65px;
    top: 38%;
    left: 35px;
  }
}

@media screen and (max-width:520px){
  .theme:before { 
    left: 15px;
    top: 29%;
    width: 55px;
  }
}

/**************************************************
= navbar 橫式選單模組
********************/
.navbar { background-color:#bb4f01;}
.navbar ul{ max-width: 1500px; }
.navbar li a{ color: #fff; font-weight: bold;}
.navbar li:hover a {color:#f1f1f1;}
.navrwd-svg svg { fill: #fff;}
.navbar li:hover ul a,.navbar ul li a:focus + .navrwd + .menuhidden{ background-color:#bb4f01; color:#fffcf7;}
.navbar li:hover ul a:hover { background-color:#fff6e2; color:#479a24;}
.navbar li .menuhidden.navbar-menu a { background-color:#bb4f01; color:#fffcf7;}
.navbar li .menuhidden.navbar-menu a:hover { background-color:#fff6e2; color:#479a24;}
.navbar li ul li a{ border-bottom:1px solid #df5e00; min-width:max-content;}

@media screen and (max-width: 767px) {
.navbar li { width: 100%; background: #df5e00;}
.navbar ul { /*background: #ffffff; color: #ffffff;*/}
.navbar li a { /*background: #df5e00; */color: #ffffff;}
.navbar ul li{border-bottom: 1px solid #ffffff;}
.navbar li:hover a{ color: #fffcf7;}
.navbar li:hover ul a {  background-color:#df5e00; color:#fffcf7;}	
.navbar li:hover ul a:hover {  background-color:#fff6e2; color:#479a24;}
.navbar li .menuhidden.navbar-menu a{ background-color:#e7ba55; color:#bc3400;}
.navbar li .menuhidden.navbar-menu a:hover { background-color:#fff6e2; color:#479a24;}
.navbar .show-menu{ color: #fff;background:#df5e00}
.navbar .show-menu .ct-hamburger svg { fill:#fff;}
.navrwd-svg{ background: rgba(255,255,255,0.8); border: none;}
.navrwd-svg svg{ fill: #df5e00;}
.navbar li ul li { border: 0;}
}

@media screen and (min-width: 1680px){
.navbar>ul>li { padding: 0 18px;}
}

@media screen and (min-width: 992px) and (max-width: 1679px){
.navbar>ul>li {padding: 0 8px;}
}

@media screen and (min-width: 768px) and (max-width: 991px){
.navbar>ul>li {padding: 0 5px;}
}

/**************************************************
= breadcrumb 麵包屑
********************/
.breadcrumb-item + .breadcrumb-item::before {border-left: 8px solid #f16902;}
.breadcrumb-item.active {color:#262626;}/*262626 green*/
.breadcrumb a{color: #262626;}
.breadcrumb a:hover{color: #cf5921;}

/**************************************************
= footer 最下方聯絡資訊
********************/
.footerbg{ color: #fff; /*background-image: url(../img/footerbg.jpg);*/background: #e86200; background-repeat: no-repeat; background-position: top; min-height: 300px; padding-top: 20px; box-shadow: 0px -1px 5px #fdf0dd; margin-top: 20px;}
.footerbg a {color: #fff;}
.connect-links,.connect .text.connect-explorer{ color: #fff;}
.connect-links:hover{text-decoration: none;color: #fff;}
.copyright { color: #ffffff; background: #e34c04;}

/**************************************************
= module title 模組標題
********************/
.module-title { color: #1e1e1e;}

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

/* tab頁簽 ********************/
.nav-tabs {border-bottom-color:#ffffff;}
.nav-tabs .nav-item,.nav-pills .nav-item{margin-right: 2px;}
.nav-tabs .nav-item a,
.nav-pills .nav-item a{ color: #fff; background: #658007; border-color: #658007 #658007 #658007 ;border-radius: 0;}
.nav-pills .nav-item a{ border-bottom: 1px solid #f4ffd4;}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover { color: #8e611e; background: #ffffff; border-color: #f18932 #f18932 #f18932;}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {color: #ffffff; background: #AF6324; border-color: #AF6324 #AF6324 #AF6324; border-radius: 0;}
.nav-pills .nav-link:focus,
.nav-pills .nav-link:hover { color: #ffffff; background-color: #ed96af;}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {color: #fff;background-color:#df5e00;}
.nav-tabs .nav-link.disabled,
.nav-pills .nav-link.disabled {color: #868e96;}
.ct-dropdown-menu { background-color: #fff;  border: 1px solid #df5e00;}
.ct-dropdown-item { color: #3a92e9;}
.nav-tabs .nav-item .ct-dropdown-item, .nav-tabs .nav-item .ct-dropdown-item{ border: 0; background: #ffffff; border-top: 1px solid #ededed; color: #9a654a;}
.nav-tabs .nav-item .ct-dropdown-item:focus,
.nav-tabs .nav-item .ct-dropdown-item:hover { color: #ed96af; background-color: #fdf1f4;}



/* 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: #333333; background-color: #ffffff; border-color: #ffffff; border-bottom: 1px solid #cccccc;}
.ct-table .thead-dark th { color: #ffffff; background-color: #07245e; border-color: #07245e;}
.table-bordered {border-color: #e9ecef;}
.table-bordered th,.table-bordered td {border-color:#ccc;}
.table-hover tbody tr:hover { background-color:#fffaf7;}

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

/* nav-Vertical 直式選單 ********************/
.nav-Vertical ul li .sub-menu-item{ background: #f18932; color: #fff; border-bottom-color: #ffffff;}
.nav-Vertical ul li .sub-menu-item:hover { background:#f18932; color: #ffffff;}


.nav-Vertical ul li .sub-menu-item a{color:#ffffff;}
.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{color:#545454;}
.nav-Vertical ul li .sub-menu-item:hover a{color:#ffffff;}

.nav-Vertical ul li .menu-arrow svg{ fill:#fff;}
.nav-Vertical ul li .menu-arrow:hover svg{ fill: #ffffff;}
.nav-Vertical ul li ul li .sub-menu-item a{color:#67a221;}
.nav-Vertical ul li ul li .sub-menu-item:hover a{color:#67a221;}
.nav-Vertical ul li ul li .sub-menu-item{ background:#ffffff;border-bottom-color: #f18932; color: #67a221}
.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: #ffffff; color: #67a221; border-left-color: #e86200;}
.vertical-hamburger { background:#f18932;}
.vertical-hamburger svg { fill:#ffffff;}

.ct-sitemap{background:#ffffff;}
.sitemap-title { background: #61803C; color: #ffffff;}
.sitemap-block { background: #ffffff;}
.sitemap-item a { color: #505050; border-left-color: #ffd574; background: #fffbf3;}
.sitemap-item a:hover,
.sitemap-item a:focus{background: #fdfaf0; color: #3c2117; border-left-color: #ff9800;}
.sitemap-icon svg {fill: #ffffff;}

/**************************************************
= hotkeyicon 快捷列 ********************/
.hotkeyicon .gd-xs6, .hotkeyicon .gd-sm3 {float: left;}
.hotkeyicon { width: 100%; height: auto; padding: 10px 0 0; margin-bottom: 30px; background-color:#ffffff; color:#322d7b; font-size: 1.1rem; font-weight: 600; overflow: hidden;}
/*.hotey-block{ max-width: 1300px; }*/
.hotkeyicon .icon-1,.hotkeyicon .icon-2,.hotkeyicon .icon-3 { position: relative;  width: 90%; height: auto; border-radius: 0px; padding: 0 20px 20px; margin: 0 auto; cursor: pointer;top: -2px; transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.hotkeyicon .icon-1,.hotkeyicon .icon-2,
.hotkeyicon .icon-3 { /*border: 1px solid #322d7b; box-shadow:0px 1px 2px #9491bb;*/ background: #ffffff;}
.hotkeyicon .icon-1:hover,.hotkeyicon .icon-2:hover,.hotkeyicon .icon-3:hover {top: 5px;}
.hotkeyicon .icon-svg1,.hotkeyicon .icon-svg2,.hotkeyicon .icon-svg3 { margin: 0 auto; width: 75px; height: 75px; max-width: 100%; background-repeat: no-repeat; background-position: center}
.hotkeyicon .icon-svg1{background-image: url(../img/hoticon1.svg)}
.hotkeyicon .icon-svg2{background-image: url(../img/hoticon2.svg);}
.hotkeyicon .icon-svg3{background-image: url(../img/hoticon3.svg);}
.hotkeyicon .icon-title,.hotkeyicon .icon-title a{ padding-top: 8px; text-align: center;color:#322d7b; display: none;}

@media only screen and (max-width: 1400px){
.hotkeyicon{ font-size:1rem;}
}
@media only screen and (max-width: 1200px){
.hotkeyicon .icon-svg1, .hotkeyicon .icon-svg2, .hotkeyicon .icon-svg3 {width: 60px;height: 60px;}
}
@media only screen and (max-width: 992px){
}
@media (min-width: 768px){
.htmldisplay .gd-sm2 {width: 20%;}
}
@media only screen and (max-width: 520px){
}

/**************************************************
= .widget-tab 中心TAB ********************/
.sidebar{width:80%; margin: 0 auto; line-height: 2px}
.inline-ul {font-size:0;/* 所有浏览器 */*word-spacing:-1px;/* IE6、7 */}
.inline-ul ul {padding: 0; margin: 0; margin-bottom: 15px;}
.inline-ul ul li{font-size: 12px;letter-spacing: normal;word-spacing: normal;vertical-align:top;display: inline-block;*display:inline;*zoom:1;}
@media screen and (-webkit-min-device-pixel-ratio:0){
	/* firefox 中 letter-spacing 会导致脱离普通流的元素水平位移 */
	.inline-ul{letter-spacing:-5px;/* Safari 等不支持字体大小为 0 的浏览器, N 根据父级字体调节*/}
}
.widget-title {
	font-size: 18px;
	font-weight: bold;
	color: #000;
	padding: 10px 20px 0;
}
.widget-tab .widget-title{font-size: 0;}
.widget-tab .widget-box{margin:0 20px 20px;background:#F7F7F7}
.widget-tab .widget-title ul li{margin-left:0;width:32%;text-align:center;margin-right:2%;border-top-left-radius: 10px;border-top-right-radius: 10px;}
.widget-tab .widget-title ul li:last-child {margin-right:0}
.widget-tab .widget-title ul li:hover{/*background:#F7F7F7*/opacity: 0.9}
.widget-tab .widget-title label{cursor:pointer; display:flex; align-items: center; justify-content: center; font-size: 20px; padding: 10px;height: 74px; }
.widget-tab .widget-title ul li.active{background:#F7F7F7}
.widget-tab input{display:none}
.widget-tab .widget-box ul{display:none}
.widget-title li {position: relative;}
.widget-title .promote {background:#ffba00 url(../img/tab01.png) center left/auto 150% no-repeat;}
.widget-title .subject {background:#c6ff00 url(../img/tab02.png) top right/auto 120% no-repeat;}
.widget-title .technology {background:#27efda url(../img/tab03.png) bottom right/auto 120% no-repeat;}
/*#promote:checked ~ .widget-title .promote,#subject:checked ~ .widget-title .subject,#technology:checked ~ .widget-title .technology{background:#F7F7F7}*/
#promote:checked ~ .widget-title .promote:after { display:block; content:''; border-width:22px 16px; border-style:solid; border-color:#ffba00 transparent transparent transparent; position:absolute; left:46%;}
#subject:checked ~ .widget-title .subject:after { display:block; content:''; border-width:22px 16px; border-style:solid; border-color:#c6ff00 transparent transparent transparent; position:absolute; left:46%;}
#technology:checked ~ .widget-title .technology:after { display:block; content:''; border-width:22px 16px; border-style:solid; border-color:#27efda transparent transparent transparent; position:absolute; left:46%;}
#promote:checked ~ .widget-box .promote-list,#subject:checked ~ .widget-box .subject-list,#technology:checked ~ .widget-box .technology-list{display:block}

.widget-box ul {padding: 30px 25px; height: 380px;}
.widget-box ul li {list-style: none; background: #fff; margin: 10px 1%; width: 23%; text-align: center; box-shadow: 1px 2px 5px #ebebeb;float: left;}
.widget-box ul li a{text-decoration: none; color: #333; display: flex; align-items: center; justify-content: center; height: 62px; padding: 10px;}
.promote-list li a:hover {background: #fffcf4; color:#ff5e00; outline: 2px dotted #ff5e00;}
.subject-list li a:hover {background: #fbfff4; color:#62e300; outline: 2px dotted #62e300;}
.technology-list li a:hover {background: #f4fff9; color:#00e3c4; outline: 2px dotted #00e3c4;}

@media screen and (max-width: 1680px){
  .widget-box ul {height: 480px;}
  .widget-box ul li {width: 31.3%; }
}

@media screen and (max-width: 1400px){
  .widget-box ul {height: 710px;}
  .widget-box ul li {width: 48%; }
}

@media screen and (max-width: 768px){
  .widget-box ul {height: 480px;}
  .widget-box ul li {width: 31.3%; }
}

@media screen and (max-width: 520px){
  .widget-box ul {height: 710px;}
  .widget-box ul li {width: 48%; }
  #promote:checked ~ .widget-title .promote:after, #subject:checked ~ .widget-title .subject:after, #technology:checked ~ .widget-title .technology:after {left: 40%;}
}

@media screen and (max-width: 375px){
  #promote:checked ~ .widget-title .promote:after, #subject:checked ~ .widget-title .subject:after, #technology:checked ~ .widget-title .technology:after {left: 35%;}
}


/*span-color-ga003*/
.span-color-ga003,a.span-color-ga003{color: #ec781d;}
a.span-color-ga003:hover,a.span-color-ga003:focus {color:#10ad7d;}

/*span-color-ga007*/
.span-color-ga007,a.span-color-ga007{color: #ec781d;}
a.span-color-ga007:hover,a.span-color-ga007:focus {color:#10ad7d;}

/*線上報修button-ga009********************/
.repair-basicset .btn-primary { color: #ffffff;  background-color:#461600;  border-color:#461600;  fill: #ffffff;}
.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:#862c00;}
.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:#862c00;}

/* CGA001 圖文公告換色 ********************/
.ct-focusslider .focus-content .textblock{ background:#fdfefa; color: #545454; border-bottom: 4px solid #83d550;}
.ct-focusslider .focus-content .textblock.notice-color{background:#fffaf5; color: #545454;  border-bottom: 4px solid #ffb67b;}
/*CGA001 圖文公告箭頭顏色*/
.ct-focusslider .focus-controls .focus-arrow{ fill:#83d550; }
.ct-focusslider .focus-controls .focus-arrow:hover { fill: #ebb700;}
.ct-focusslider .focus-controls .focus-arrow.focus-end{ fill: rgba(175, 175, 175, 1);}
/*CGA004、CGA008、CGA009電子報系列*/
.ct-epaper .epaper-list {background: #fffaf5;}
.ct-epaper .btn-primary{color: #ffffff; background-color:#e27118; border-color:#e27118; fill: #ffffff;}
.ct-epaper .btn-primary:hover{color: #ffffff; background-color:#d2620a;  border-color:#d2620a; fill: #ffffff;}
.ct-epaper .yearnav ul li{ background: #fff4e5; color: #333333; border-bottom: 1px solid #cccccc;}
.ct-epaper .yearnav ul li a{ color: #333333; }
.ct-epaper .yearnav ul li:hover { background: #ec781d; color: #ffffff;}
.ct-epaper .yearnav ul li:hover a { color: #ffffff; }
/* GA017 全文檢索*******************/
.cmgch-google .btn-all{ color: #ffffff; background-color:#461600; border-color:#461600; 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: #ffffff; background-color:#862c00;  border-color:#862c00; fill: #ffffff;}
.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:#461600;} 
.cmgch-google .form-group-m .bar::before {background:#461600;}

/*ALT+C 導盲磚 *******************/
.text-secondary {color: #656769;}

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

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