@charset "utf-8";
body { margin: 0; padding: 0;}

/**************************************************
= header 上方登入選單
********************/
header{ position: absolute !important;  top: 0; right: 0px; z-index: 1; vertical-align: middle; text-align: right; font-size: .8rem;}
header>a,header>div { display: inline-block; padding: 5px 12px; cursor: pointer; color:#4670bb; -moz-transition:all 200ms ease-in; -webkit-transition:all 200ms ease-in; -o-transition:all 200ms ease-in; transition:all 200ms ease-in;line-height: 1.3em; vertical-align: -webkit-baseline-middle;}
header .dropbtn { background-color: rgba(0,0,0,0); color: inherit; border: none; cursor: pointer;}
header button{ font-family: inherit;}
header .dropdown { position: relative; display: inline-block;}
header .dropdown i{ padding:0 0 0 7px;}
header .dropdown svg { width: 1.2em; height: 1.2em; vertical-align: middle; margin-left: 5px;}
header .dropdown-content { display: none; position: absolute; margin-left: -12px; min-width: 90px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1;margin-top: 7px; background: rgba(185, 0, 31, 0.8);}
header .dropdown-content a { color: inherit; text-align:center; padding: 5px; text-decoration: none; display: block;}
header .dropdown-content a:hover {background-color: rgb(198, 213, 236);}
header .dropdown:hover .dropdown-content { display: block;}
header .dropdown.active .dropdown-content { display: block !important;}
header .fontsize{ display: inline-block; cursor: default;}
header .fontsize button{ margin:0 3px; width:24px;height:23px; letter-spacing: 0em; border-radius: 2px; font-weight: 600; cursor: pointer;line-height: 1.2em;}
@media (max-width :767px){
header {position: relative !important; right: 0;}
header .fontsize{display:none;}
}

/**************************************************
= theme 上方主圖
********************/
.theme{height:200px;width: 100%; background: url(../img/headerbg.jpg);background-position: center top; /*box-shadow: 0px 1px 3px 0px #c9a260;*/ z-index: 1;}
.logo {height: 200px; display: -webkit-box !important;  display: -ms-flexbox !important;  display: flex !important; -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important;  font-size: 2rem; color: inherit; padding-left: 15%;}
.logo img{max-width: 380px;max-height: 120px;}
@media (max-width :767px){
.logo { padding-left:50px;}
}
@media (max-width :520px){
.theme{ height: 200px;background-position: right;}
.logo { padding:0 20px;}
.logo img { max-width: 100%; max-height: 90px;}
}

/**************************************************
= navbar 橫式選單
********************/
/*.navbar li a { height: 45px; }*/
.navbar ul{ max-width: 1600px;}
.navbar li ul li a{ line-height: 2.2em; display:block;}
.navbar ul li ul{ display: block; visibility:hidden; opacity:0; width: 0; text-align: center; background: #ffffff; margin-top: 3px; }
.navbar ul li:hover ul, 
.navbar ul li a.active+.navrwd+.menuhidden, 
.navbar ul li a.active:hover+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:focus+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:active+.navrwd+.menuhidden{ display: table; max-width:200px; visibility: visible; opacity:1; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.navbar ul li ul.noItem,
.navbar ul li a.active+.navrwd+.menuhidden.noItem,
.navbar ul li a.active:hover+.navrwd+.menuhidden.noItem,
.navbar ul li.navbar-item.active a:focus+.navrwd+.menuhidden.noItem,
.navbar ul li.navbar-item.active a:active+.navrwd+.menuhidden.noItem{ background: transparent; display: none;}
.navbar ul li a:hover+.navrwd+.menuhidden, .navbar .menuhidden:hover{ display: table;}
.navbar .menu-web{ display: block;}
.navbar .menu-web a:last-child{ border-bottom: none;}
.navbar .menu-mobile{ display: none;}
.navbar ul li ul.menuhidden.overflowRight {
  right: 0;
}

@media screen and (max-width: 767px) {
.navbar ul li ul{ display: none; visibility: visible; opacity:1;}
.navbar ul li:hover ul{ height: auto; visibility: visible; opacity:1; padding: 0px; display: none;}
.navbar ul li a.active+.navrwd+.menuhidden, 
.navbar ul li a.active:hover+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:focus+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:active+.navrwd+.menuhidden,.navbar .menuhidden.navbar-menu{ display: inline;}
.navbar .menu-web{ display: none;}
.navbar .menu-mobile{ display: block;}
}
@media screen and (max-width: 520px){
.navbar ul li:hover ul{ display:none;}
.navbar ul li a.active+.navrwd+.menuhidden, 
.navbar ul li a.active:hover+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:focus+.navrwd+.menuhidden, 
.navbar ul li.navbar-item.active a:active+.navrwd+.menuhidden,.navbar .menuhidden.navbar-menu{ display: block; width: 100%; max-width: 100%;}
}

/**************************************************
= footer 最下方聯絡資訊
********************/
.footerbg{ min-height:676px;background-position-y: bottom; padding-top: 280px; }
.connect{ margin: auto; list-style: none; padding: 20px 5px};
.footerbg .freego {padding: 5px 0;}
.footerbg .text { float: left; padding:0 20px;font-size: 0.9rem;line-height: 1.6em; letter-spacing: 0.05em;}
.footerbg a {color: #ffffff;}
.footerbg .text .title{min-width: 60px;}
.connect-links{text-decoration: underline}
.connect-links,.connect .text.connect-explorer{color:#cfcfcf;}
.connect-links:hover{text-decoration: none;color:#fffbfb;}
.copyright {padding: 5px 5px 5px 0; background-color:inherit; width: 100%;text-align: right; color:#94fffc;font-size: 0.8rem;position: absolute; bottom: 0;}
@media (max-width :520px){
.footerbg { padding-top: 180px;}
.connect{ margin: 0 auto;  width: 100%;}
.connect-explorer{ display: none;}
}

/**************************************************
= module title 模組標題
********************/
.module-title-bg { background: unset;}
.module-title {position: relative;color:#2c58a5;font-weight: 600;font-size: 1.2rem;height: 35px; padding-top: 10px; text-align: center;line-height: 30px; padding-left: 35px;}
.module-title-bg::before {  position: absolute; content: ""; width: 150px; height: 45px;  background: url(../img/title.png); background-repeat: no-repeat;  margin-left: -55px; top: -2px;}
/* nav-Vertical 直式選單 ********************/
.nav-Vertical ul { list-style: none; margin: 0; padding: 0;}
.nav-Vertical ul li .sub-menu-item{ display: block; background: #eaf0fa; padding: 10px 15px;color: #4670bb; text-decoration: none; border-bottom: 1px solid #b2c3e1; -webkit-transition: 0.2s linear; -moz-transition: 0.2s linear; -ms-transition: 0.2s linear; -o-transition: 0.2s linear; transition: 0.2s linear; cursor: pointer;}
.nav-Vertical ul li .sub-menu-item:hover { background:#4670bb;color:#ffffff; }
.nav-Vertical ul li .sub-menu-item a:hover,.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:#ffffff;}
.nav-Vertical ul li .menu-arrow svg{ fill:#133b83; width: 16px;}
.nav-Vertical ul li .menu-arrow:hover svg{ fill: #ffffff;}
.nav-Vertical ul li ul li .sub-menu-item{ background:#d7e0ef; border-left: 4px solid transparent; padding: 10px 15px 10px 20px;}
.nav-Vertical ul li ul li ul li .sub-menu-item{ background:#eefefd; border-left: 4px solid transparent; padding: 10px 20px 10px 30px;}
.nav-Vertical ul li ul li .sub-menu-item:hover,
.nav-Vertical ul li ul li ul li .sub-menu-item:hover {background: #6b8fcb; color: #ffffff;border-left: 4px solid #4670bb;}

/* sitemap 導覽頁 ********************/
.ct-sitemap li{list-style: none;}
.sitemap-top { line-height: 1.8em;}
.sitemap-title { background:#4670bb;color: #ffffff; padding-left: 15px;padding-right: 15px;font-weight: bold;}
.sitemap-title span{line-height: 25px; padding:0 8px 0 0;}
.sitemap-block { box-shadow: 3px 4px 0px rgb(202, 207, 216); background: #ffffff; letter-spacing: 0.06em;}
.sitemap-block a { display: block;}
.sitemap-item a { color: #4670bb; display: inline-block; width: 100%; border-left: 2px solid #b2c3e1; background: #f5f5f5; padding: 6px;  transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.sitemap-item a:hover,.sitemap-item a:focus{background:#f3f6fb;}
.sitemap-item ul ul{padding-left: 25px;}
.sitemap-item ul li { padding: 7px 0 0;}
.sitemap-item ul li span{padding: 0 10px 0 5px;}
.sitemap-icon svg { padding-top: 5px; width: 18px; height: 20px; fill: #ffffff;}