﻿@charset "utf-8";

/**************************************************
= header 上方登入選單
********************/
/*theme-bg 背景色*/
.theme-bg{ background:#ffffff;background-image: url(../img/bg.jpg); background-repeat: repeat; position: relative;}

/*模組背景色*/
.module { background: #ffffff;/*border: 1px solid #e5edff;*/margin: 20px 10px}
/* :not(.module-content).module-padding.module-bg { background: #ffffff; border: 1px solid #e5edff; margin: 20px 10px} */

#main_bottom .module {
	margin: 20px 8px 0 0;
	background: none;
}

#main_bottom .module-content {
	padding: 0;
	margin-top: 20px;
}

#main_bottom .edit-focus .module {background: #fff; margin-top: 20px}

#ct-content {overflow-x: hidden;}
/**************************************************
= header 上方登入選單
********************/
.login .top-space header{ margin-top: 45px;}
header{ background: rgba(239, 239, 239, 1); /*box-shadow: 0px 1px 1px #bababa;*/ padding-right: 8.6%;}
header>#hmenu li>a,header>#hmenu li>div{color:#5f5f5f; padding: 8px 10px;}
#hmenu {list-style: none; margin: 0}
#hmenu li {display: inline-block;}
header .fontsize button {color: #5f5f5f; background-color:rgba(255,255,255,0.9); border:1px solid #dadada; border-radius: 0px; box-shadow: none; padding:0; }
header .fontsize button:hover {background-color: #5f5f5f; color: #ffffff; }
header .dropdown svg { fill: #5f5f5f;}
header a:hover,
header>div>div:hover{ color:#0b4951; }
header .dropdown:hover svg{ fill: #1f0e05;}
header .dropdown-content a:hover{ color: #ffffff; background-color: #0099b2; }
.logo {padding-left: 8px; position: relative; top: 20px}
.logo,.logo a { font-size: 2rem;  color: #545454;}
.focusable{ opacity: 0;}
.focusable:focus{ opacity: 1;}
/*20200609*/
header #hmenu .langhidden {display: none;}
header #hmenu .boxbtn {display: none;}
header .show-hmenu, header input[type=checkbox] {display: none;}

@media screen and (max-width: 1366px) {
header { padding: 0 5.8%;}
}

@media screen and (max-width: 1024px) {
header { padding: 0 20px;}
}

@media screen and (max-width: 767px) {
header {border: none; padding-right: 0; background: unset;}
header, header a, header button, header .dropdown-content a { border-radius: 0px; top:0px; left:0px;}
header>#hmenu li>a,header>#hmenu li>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;}

header {padding: 0}
header .show-hmenu {display: block; padding: 6px; font-size: 1.7rem; position: absolute; right: 0; height: 100px;}
.ct-hamburger {padding-top: 25px;}
header .show-hmenu .ct-hamburger svg {fill: #29166f; width: 30px; height: 30px;}
header input[type=checkbox] { display: none;}
header #hmenu {display: none;}
header input[type=checkbox]:checked~#hmenu { width: 60%; background: #ddd; display: inline-grid; position: fixed; top: 100px; right: 0; padding: 0; height: 80%; overflow-y: auto;  border-left: 2px solid #ddd;}
header #hmenu li>a, header #hmenu li>div {padding: 15px 10px;}
header #hmenu a, header #hmenu div {font-size: 1rem}
header #hmenu #top, header #hmenu .home {display: none;}
header #hmenu .boxbtn {display: block; margin: 0; font-size: 1rem}
header #hmenu .boxbtn a {color: #fff}
header #hmenu::-webkit-scrollbar { width: 4px;}
header #hmenu::-webkit-scrollbar-thumb { background: #ffffff; border: thin solid #c1c1c1; border-radius: 10px;}
header #hmenu::-webkit-scrollbar-track { background: rgb(255 255 255 / 65%); border: thin solid #c3c3c3; box-shadow: 0px 0px 3px #ffffff inset; border-radius: 0px;}

.top-space header input[type=checkbox]:checked~#hmenu {top: 145px; height: 75%; }

/*freeze*/
.freeze header #hmenu {padding: 0; top: 100px; width: 40%; right: 0; position: fixed; overflow-y: auto; border-left: 2px solid #ddd; background: #ddd;}
.freeze header #hmenu li {width: 100%; border-bottom: 1px solid #fff;}
}

@media screen and (min-width:768px){
.freeze header {display: none;}
}

@media screen and (max-width:520px){
.theme-bg { background-position: -880px 0px;}
}

/*search*/
#ftrs:focus{ outline: 2px dotted #d26800;}
.ftrs-search-text { width: 150px; margin: 0; background: #fff;}
.ftrs-result { position: relative; min-height: 100px;}
.ftrs-num {position: absolute;top: 0;left: 0;width: 40px;height: 37px;display: flex;justify-content: center;align-items: center;color: #636267;background-color: #dce3ef;font-weight: 600;}
.ftrs-title {color: #413e4b;font-weight: 600;font-size: 1.16rem;margin-left: 45px;word-wrap: break-word;}
.ftrs-title a {color: #413e4b;}
.ftrs-detail {color: #6e6f76;margin-top: 10px;font-size: 0.95rem;}
.ftrs-source {color: #336fb6;font-weight: 550;}
.ftrs-content {margin-top: 10px;font-size: 0.98rem;color: #4e5052;word-wrap: break-word;}
.ftrs-update {color: #566e97;text-align: right;font-size: 0.92rem;}
.ftrs-keyword {color: #e00000;}

@media only screen and (min-width: 500px) and (max-width: 700px) {
.ftrs-search-text {width: inherit;}
}

.hot-color{ display: inline-block;}

@media only screen and (max-width: 520px){
.hot-color{ display: block; margin-left: -5px;}	
}

.hotsearch {margin-top: 8px;margin-left: 5px;}
.hotsearch[disabled], .hotsearch[disabled] a {color: #b3b3b3 !important;}
.hotsearch a {position: relative;padding: 0 7px 0 5px;color: #333;white-space: nowrap;}
.hotsearch a:hover {color: #4372ab;text-decoration: underline;}
.hotsearch a+a {margin-left: 5px;}
.hotsearch a+a:before {content: "";position: absolute;width: 1px;height: 100%;top: 1px;left: -5px;background: #c1c1c1;}
.search-record .select-item {padding-left: 10px;}
.search-record .select-menu {top: -10px;margin-left: 25px;width: calc(75% - 25px);}

.search .ct-circle-icon { width: 20px; height: 20px; padding-top: 0; margin: 0;}
.search .ct-circle-icon svg { fill: #fff; width: 1.1em; height: 1.1em; vertical-align: middle;}
.search>div.ct-row {height: 25px; border: 1px solid #dadada;}
.search .form-group-m input { height: 1.5rem;}

@media only screen and (max-width: 700px) and (min-width: 500px) {
.search-record .select-menu {width: calc(65% - 25px);}
}


/**************************************************
= theme 上方主圖
********************/
h1 strong { position: relative;}
h1 strong.picshow { position: absolute; top: -1000px;}

.width-f{clear: both; z-index: 99;}

@media screen and (max-width: 1400px) {
.theme {width: 87%; margin-left: 6.5%;}
.width-f { width: 100%; margin-left: 0%;}
}

@media screen and (max-width: 1366px) {
.theme {width: 89%; margin-left: 5.5%;}
}

@media screen and (max-width: 1280px) {
.theme {width: 95%; margin-left: 2.5%;}
}

@media screen and (max-width: 1024px){
.theme {width: 100%; margin-left: 2%;}
}

@media screen and (max-width: 768px){
.theme {width: 100%; margin-left: 0;}
.logo h1 { margin: 0 auto; text-align: center;}
}

@media screen and (max-width: 767px) {
.theme { background: #fff; box-shadow: 0 0 10px #6d6d6d; z-index: 99; position: fixed; top: 0;}
.logo {padding: 0; top: 0;}
.logo img, .logo strong {max-height: 85px; max-width: 85%; padding-top: 5px;}
.theme+div {position: fixed; top: 0px; left:0; width: auto; z-index: 99;}

/*登入狀態*/
.top-space .theme { top: 45px;} 
.top-space .theme+div { top: 45px;}

/*freeze***********/
.freeze .top-space .theme { top: 0;} 
.freeze .top-space .theme+div { top: 0;}
.freeze .theme+div {z-index: 99;}
.freeze .navbar {background: unset;}
.freeze .navbar ul#menu { top: 100px; position: fixed; overflow-y: auto; height: 80%;}
}

/**************************************************
= navbar 橫式選單模組
********************/
.navbar { background-color: unset; /*position: absolute; top: -30px; z-index: 99; width: 100%;*/}
.navbar ul{ padding: 0; justify-content: center;}
.navbar>ul>li { padding: 10px 35px; border-right: 1px solid #fffdfb; background: #56c6d4;}
.navbar>ul>li:last-child { border-right: none;}
.navbar li a{ color:#fff; font-weight: 600;}
.navbar li:hover a {color:#eafeff;}
.navrwd-svg svg { fill: #fff;}
.navbar li:hover ul a,.navbar ul li a:focus + .navrwd + .menuhidden{ background-color:#fbffff; color:#34afc3;}
.navbar li:hover ul a:hover { background-color:#50becc; color:#ffffff;}
.navbar li .menuhidden.navbar-menu a { background-color:#ffffff; color:#34afc3;}
.navbar li .menuhidden.navbar-menu a:hover { background-color:#50becc; color:#ffffff;}
.navbar li ul li a{ border-bottom:1px solid #ffeddc; padding: 8px; min-width: 180px;}

#main_top {top: -30px;}

@media screen and (max-width: 1600px){
.navbar>ul>li { padding: 10px 22px; }
}

@media screen and (max-width: 1440px){/*1366, 1280*/
.navbar>ul>li { padding: 10px 16px; }
}

@media screen and (max-width: 1080px){
#main_top {top: 0px;}
.navbar { background-color: #56c6d4; position: unset;}
.navbar>ul>li { padding: 5px 10px; border-right: 0;}
.navbar ul li ul {margin-top: 5px;}
.navbar li a {height: 40px; padding: 10px 0px;}
.navbar li ul li a {padding: 5px 8px}
}

@media screen and (min-width: 768px) {
.freeze .navbar ul li {border: 0}
.navbar ul li ul{ box-shadow: 0 2px 2px #e6e6e6;}
}

@media screen and (max-width: 767px) {
.navbar {background: unset}
.navbar li { width: 100%; background: #ffffff;}
.navbar ul { /*background: #22295d; color: #ffffff;*/}
.navbar li a { /*background: #22295d; */color: #ffffff; width: 85%;}
.navbar>ul>li{border-bottom: 1px solid #fff; border-right: 2px solid #ddd!important;}
.navbar li:hover a{ color: #eafeff;}
.navbar li:hover ul a {  background-color:#ffffff; color:#34afc3;}	
.navbar li:hover ul a:hover {  background-color:#50becc; color:#ffffff;}
.navbar li .menuhidden.navbar-menu a{ background-color:#ffffff; color:#34afc3;}
.navbar li .menuhidden.navbar-menu a:hover { background-color:#50becc; color:#ffffff;}
.navbar .show-menu{ color: #fff; background:unset; height: 100px;}
.navbar .show-menu .ct-hamburger svg { fill:#29166f; width: 30px; height: 30px;}
.navrwd-svg{ background: rgba(255,255,255,0.8); border: none; border-radius: 0;}
.navrwd-svg svg{ fill: #34afc3;}
.navbar li ul li { border: 0;}
.navbar input[type=checkbox]:checked~#menu { background: unset; position: absolute; overflow-y: auto; display: block; min-width: 300px; width: auto; left: 0;}
#menu {width: 70%;float: left;}
#menu::-webkit-scrollbar { width: 4px;}
#menu::-webkit-scrollbar-thumb { background: #70d6e2; border: thin solid #62cdda; border-radius: 10px;}
#menu::-webkit-scrollbar-track { background: rgb(255 255 255 / 65%); border: thin solid #c3c3c3; box-shadow: 0px 0px 3px #ffffff inset; border-radius: 0px;}
#menu .menu-web a {display: none;}
#main_top {margin-top: 100px; position: inherit;}
.navbar { background-color: unset; }
.navbar ul li a:hover+.navrwd+.menuhidden, .navbar .menuhidden:hover {display: inline;}
}

/**************************************************
= breadcrumb 麵包屑
********************/
.breadcrumb-item + .breadcrumb-item::before {border-left: 8px solid #f7b5c3;}
.breadcrumb-item.active {color:#56c6d4;}
.breadcrumb a{color:#34afc3;}
.breadcrumb a:hover{color:#f39200;}

/**************************************************
= footer 最下方聯絡資訊
********************/
.footerbg{ color: #ffffff; background-image: url(../img/footer.jpg); background-repeat: repeat; min-height: 300px; }
.footerbg a {color: #fff;}
.connect-links,.connect .text.connect-explorer{ color: #fff;}
.connect-links:hover{text-decoration: none;color: #fff;}
.copyright { color:#ffffff; background-color:#3fc8d8;}

.footerlogo img{ height: auto; width: 350px;}
.socialmedia { padding-left: 8px;}
.socialmedia a {padding: 10px; float: left; padding-left: 13px;}
.socialmedia .media-svg {padding: 1px; border: 1px dotted #fff; border-radius: 50%; height: 45px; width: 45px;}
.socialmedia .media-svg:hover { border: 1px solid #fff; background: #fff}
.socialmedia .media-svg svg, .socialmedia .media-svg svg path {width: 40px; fill: #fff;}
.socialmedia .media-svg:hover svg path {fill: #35c9d8}

@media screen and (max-width: 1600px){
.connect {padding-left: 100px;}
}

@media screen and (max-width: 1024px){
.connect {padding-left: 40px;}
}

@media screen and (max-width: 992px) {
	.footerbg {
		background-image: url(../img/footer-992.jpg);
	}
}

@media screen and (max-width: 768px){
.footerbg{  background-image: url(../img/footer-768.jpg); }
}

@media screen and (max-width: 375px){
.connect {padding-left: 10px;}
.socialmedia a {padding: 0 10px; }
}

@media screen and (max-width: 320px){
.footerlogo img { width: 300px}
.socialmedia { padding-left: 10px;}
.socialmedia a {padding: 0 8px; }
.socialmedia .media-svg { height: 40px; width: 40px;}
.socialmedia .media-svg svg, .socialmedia .media-svg svg path {width: 35px;}
}

/**************************************************
= module title 模組標題
********************/
.module-title { color: #34afc3;}

/**************************************************
= 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: #4fc9c9; border: 1px solid #4fc9c9; border-radius: 0;}
.nav-pills .nav-item a{ border-bottom: 1px solid #f4ffd4;}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover { color: #34afc3; background: #ffffff; border: 1px solid #34afc3;}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {color: #ffffff; background: #34afc3; border: 1px solid #34afc3;}
.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:#34afc3;}
.nav-tabs .nav-link.disabled,
.nav-pills .nav-link.disabled {color: #868e96;}
.ct-dropdown-menu { background-color: #fff;  border: 1px solid #34afc3;}
.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: 1px solid #e6e6e6!important;}
.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: #34afc3; background-color: #ffffff; border-color: #ffffff; border-bottom: 1px solid #09b7d0;}
.ct-table .thead-dark th { color: #ffffff; background-color: #164e22; border-color: #164e22;}
.table-bordered {border-color: #e9ecef;}
.table-bordered th,.table-bordered td {border-color:#ccc;}
.table-hover tbody tr:hover { background-color:#f5feff;}

.table-responsive {border-top: 1px solid #34afc3;}

@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: #fdeef1; color: #34afc3; border-bottom-color: #fbe3e8;}
.nav-Vertical ul li .sub-menu-item:hover { background:#ff8da4; color: #ffffff;}


.nav-Vertical ul li .sub-menu-item a{color:#34afc3;}
.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:#ff9a9a;}
.nav-Vertical ul li .sub-menu-item:hover a{color:#ffffff;}

.nav-Vertical ul li .menu-arrow svg{ fill:#ff9a9a;}
.nav-Vertical ul li .menu-arrow:hover svg{ fill: #ffffff;}
.nav-Vertical ul li ul li .sub-menu-item:hover a{color:#ff9a9a;}
.nav-Vertical ul li ul li .sub-menu-item{ background:#ffffff;border-bottom-color: #fdeef1;}
.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: #ff9a9a; border-left-color: #ff9a9a;}
.vertical-hamburger { background:#ff9a9a;}
.vertical-hamburger svg { fill:#ffffff;}

.ct-sitemap{background:#ffffff;}
.sitemap-title { background: #5dcad8; color: #ffffff;}
.sitemap-block { background: #ffffff;}
.sitemap-item a { color: #505050; border-left-color: #ffcd10; background: #f5f5f5;}
.sitemap-item a:hover,
.sitemap-item a:focus{background: #ffecf0; color: #5f421f; border-left-color: #ff83b6;}
.sitemap-icon svg {fill: #ffffff;}

/*schoolbtn 學校分類按鈕 ********************/
.schoolbtn-block {margin-top: 80px; margin-right: 20px; text-align: center;}
.schoolbtn{ padding: 5px 25px; color:#ffffff;border-radius: 0px; font-size: 1rem; font-weight: normal; letter-spacing: 0.1rem;transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.school-main {background: #f7921e;}
.school-s{ background: #c1272d;}
.school-k{ background: #ee1f7a;}
.school-e{ background: #2f2f75;}
.school-h{ background: #2396e6;}
.school-a{ background: #56c6d4;}
.school-main:hover{ background: #e67f0a}
.schools:hover{ background: #a7151a}
.school-k:hover{ background: #dc0c67}
.school-e:hover{ background: #1e2350}
.school-h:hover{ background: #0f7fcd}
.school-a:hover{ background: #28abbb}
.school-focus{ margin-right: 8px;}

.navopen.gd-offset-xs2.gd-xs10.top-space .schoolbtn { padding: 5px 10px;}

@media (max-width:1770px){
.schoolbtn { padding: 5px 15px;}
}

@media (max-width:1590px){
.schoolbtn { padding: 5px 10px;}
.navopen.gd-offset-xs2.gd-xs10.top-space .school-focus{ margin-right: 5px;}
}

@media (max-width:1546px){
.navopen.gd-offset-xs2.gd-xs10.top-space .schoolbtn-block {margin-top: 55px; float: right; padding-right: 14px;}
}


@media (max-width:1428px){
.school-focus{ margin-right: 5px;}
}

@media (max-width:1068px){
.schoolbtn-block {margin-top: 55px; float: right; padding-right: 14px;}
}

@media (max-width:768px){
.schoolbtn-block {margin-right: 0; padding-right: 0;}
}

@media (max-width:767px){
.schoolbtn-block{display: none;}
.d-btn>div.p-r-xs.text-c {padding: 0; margin-left: 8px;}
.schoolbtn-block { margin-top: 0px; float: unset;}
.schoolbtn { padding: 5px 10px;}
.schoolbtn:last-child {margin-right:0}
}

@media (max-width:320px){
.school-focus{ margin-right: 0px;}
}

/*segmentbtn 身份分類按鈕 ********************/
.segmentbtn-block {margin-top: 80px; text-align: center;}
.segmentbtn{ padding: 5px 15px; color:#ffffff; border-radius: 0px; font-size: 1rem; font-weight: normal; letter-spacing: 0.1rem;transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
/*.segmentbtn:not(:last-child) {margin-right: 8px;}*/
.segmentbtn.segment1,.segmentbtn.segment2,.segmentbtn.segment3,.segmentbtn.segment4{ background: #0099b2;}
.segmentbtn.segment1:hover,.segmentbtn.segment2:hover,.segmentbtn.segment3:hover,.segmentbtn.segment4:hover{ background: #007a8e}
.segment-focus{ margin-right: 8px; }
.navopen.gd-offset-xs2.gd-xs10.top-space .segmentbtn { padding: 5px 15px;}

@media (max-width:1800px){
.navopen.gd-offset-xs2.gd-xs10.top-space .segmentbtn-block .line-block.m-r-xs {display: none;}
.navopen.gd-offset-xs2.gd-xs10.top-space .segment-focus{ margin-right: 4px;}
}

@media (max-width:1600px){
.segmentbtn { padding: 5px 15px;}
}

@media (max-width:1590px){
.segmentbtn { padding: 5px 10px;}
}

@media (max-width:1546px){
.navopen.gd-offset-xs2.gd-xs10.top-space .segmentbtn-block .line-block.m-r-xs {display: inline-block;}
.navopen.gd-offset-xs2.gd-xs10.top-space .segmentbtn-block {margin-top: 20px; float: right; padding-right: 34px;}
}

@media (max-width:1428px){
.segment-focus{ margin-right: 5px; }
}

@media screen and (max-width: 1340px){
.segmentbtn-block .line-block.m-r-xs {display: none;}
.school-focus{ margin-right: 4px;}
.segment-focus{ margin-right: 4px; }
}

@media (max-width:1068px){
.segmentbtn-block .line-block.m-r-xs {display: inline-block;}
.segmentbtn-block {margin-top: 20px; float: right; padding-right: 34px;}
}


@media (max-width:1024px){
.segmentbtn-block .line-block.m-r-xs {display: inline-block;}
.segmentbtn-block {margin-top: 20px; float: right; padding-right: 34px;}
}

@media (max-width:768px){
.segmentbtn-block {padding-right: 0px;}
}

@media (max-width:767px){
.segmentbtn-block{display: none;}
.segmentbtn-block{ margin-top: 20px; font-size: 13.5px; float: unset;}
.segmentbtn-block>div.line-block {display: none;}
.segmentbtn { padding: 5px 10px; margin-right: 5px;}
}

@media (max-width:320px){
.segment-focus{ margin-right: 1px; }
}

/*smallbanner 小廣告 ********************/

.rwd_slider_container_wrapper {
	width: 100%;
	height: auto;
	margin: 8px 0;
	margin-top: 5px;
	padding: 0;
	overflow-x: scroll;
	white-space: nowrap;
	width: auto;
}

.slider_container_img {
	overflow: hidden;
	display: inline;
	margin-right: 5px
}

.htmldisplay .rwd_slider_container .slider_container img {
	height: 150px;
}

@media (max-width:1440px) {
	.htmldisplay .rwd_slider_container .slider_container img {
		height: 120px;
	}
}

@media (max-width:1024px) {
	.htmldisplay .rwd_slider_container .slider_container img {
		height: 100px;
	}
}

@media (max-width:520px) {
	.rwd_slider_container_wrapper {
		height: 180px;
		width: 100%;
		margin: 0;
		margin-bottom: 4px;

	}

	.slider_container:before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: -100%;
		opacity: 1;
		filter: alpha(opacity=100);
		width: 100%;
		height: 100%;
		animation: bk 20s linear;
		background: #f1f1f1;
	}

	.slider_container div {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		filter: alpha(opacity=100);
		left: 100%;
		width: 100%;
		-webkit-animation: round 20s linear infinite;
		animation: round 20s linear infinite;
	}

	.slider_container div img {
		width: 100%;
	}

	@-webkit-keyframes round {
		5% {
			opacity: 1;
			filter: alpha(opacity=100);
			left: 0;
			/* 0 - 1秒 滑入*/
		}

		10% {
			opacity: 1;
			filter: alpha(opacity=100);
			left: 0;
			/* 1- 2秒靜止*/
		}

		15% {
			opacity: 1;
			filter: alpha(opacity=100);
			left: -100%;
			/* 2-3秒滑出*/
		}

		17.5% {
			opacity: 0;
			filter: alpha(opacity=0);
			left: -100%;
			/* 3-3.5秒變透明*/
		}

		20% {
			opacity: 0;
			filter: alpha(opacity=0);
			left: 100%;
			/* 3.5-4秒回到起始位置*/
		}
	}

	@keyframes bk {
		0% {
			left: 0;
			/* 初始位置*/
		}

		5% {
			left: -100%;
			/* 0 - 1秒 滑出*/
		}
	}

	@keyframes bk {
		0% {
			left: 0;
			/* 初始位置*/
		}

		5% {
			left: -100%;
			/* 0 - 1秒 滑出*/
		}
	}

	.slider_container div:nth-child(1) {
		-webkit-animation-delay: 0s;
		animation-delay: 0s;
	}

	.slider_container div:nth-child(2) {
		-webkit-animation-delay: 2s;
		animation-delay: 2s;
	}

	.slider_container div:nth-child(3) {
		-webkit-animation-delay: 4s;
		animation-delay: 4s;
	}

	.slider_container div:nth-child(4) {
		-webkit-animation-delay: 6s;
		animation-delay: 6s;
	}

	.slider_container div:nth-child(5) {
		-webkit-animation-delay: 8s;
		animation-delay: 8s;
	}

	.slider_container div:nth-child(6) {
		-webkit-animation-delay: 10s;
		animation-delay: 10s;
	}

	.slider_container div:nth-child(7) {
		-webkit-animation-delay: 12s;
		animation-delay: 12s;
	}

	.slider_container div:nth-child(8) {
		-webkit-animation-delay: 14s;
		animation-delay: 14s;
	}

	.slider_container div:nth-child(9) {
		-webkit-animation-delay: 16s;
		animation-delay: 16s;
	}

	.slider_container div:nth-child(10) {
		-webkit-animation-delay: 18s;
		animation-delay: 18s;
	}

	.rwd_slider_container .slider_container {
		position: absolute;
		top: 0px;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		margin: 0;
		box-sizing: border-box;
	}

	.htmldisplay .rwd_slider_container .slider_container img {
		height: 180px;
		width: 100%;
	}
}

@media (max-width:375px) {
	.rwd_slider_container_wrapper {
		height: 150px;
	}

	.htmldisplay .rwd_slider_container .slider_container img {
		height: 150px;
	}
}

/*hotkeyicon 快捷列 ********************/
.hotkeyicon .gd-xxs6,.hotkeyicon .gd-xxs12,.hotkeyicon .gd-xxs4{float: left;}
.hotkeyicon { width: 100%; height: auto; padding: 25px 0; background-color:#35c9d8; background-image: url(../img/hotkey-bg.jpg);font-size: 1.1rem; font-weight: 600; overflow: hidden; background-position: right;}
.hotkey-block{ justify-content: center; display: inline-flex; align-items: center;}
.hotkey-block div.line-block{ height: 160px; width: 160px; border: 1px solid #fff; padding: 5px; margin: 0 2%; border-radius: 50%;}
.hotkey-block div.line-block:hover {top: 5px; box-shadow: inset 0 0 20px rgba(255, 255, 255, .5), 0 0 20px rgba(255, 255, 255, .2); outline-color: rgba(255, 255, 255, 0); outline-offset: 15px;}

.hotkeyicon .icon { position: relative; height: 100%; width: 100%; background: white; border-radius: 50%; margin: 0 auto; padding: 5px; cursor: pointer; box-shadow: 0px 7px 10px #3cc1c5;}

.htmldisplay .hotkeyicon img.icon-svg { margin: 0 auto;width: auto; height: 95px; max-width: 100%; padding: 15px 20px; padding-bottom: 0; opacity: 0.85;}

.hotkeyicon .icon-title { text-align: center; color: #0ec4d6; display: inline-block; width: 100%;}

.hotkeyicon .icon a:focus { outline: none;}

@media only screen and (max-width: 1280px){
.hotkeyicon { padding: 20px 0; font-size: 1rem;}
.hotkey-block div.line-block { height: 140px; width: 140px;}
.htmldisplay .hotkeyicon img.icon-svg { height: 80px; }
}

@media only screen and (max-width: 768px){
.hotkeyicon { padding: 8px 0; font-size: .8rem;}
.hotkey-block{ justify-content: space-around; padding: 0 10px}
.hotkey-block div.line-block { height: 100px; width: 100px; margin: 7px; padding: 3px;}
.htmldisplay .hotkeyicon img.icon-svg { height: 50px; padding: 5px 15px 0; }
}

@media only screen and (max-width: 520px){
.hotkeyicon { padding: 4% 0; font-size: .85rem;}
.hotkey-block{ display: block; padding: 0 8%;}
.hotkey-block div.line-block { height: 120px; width: 120px; margin: 12px; }
.htmldisplay .hotkeyicon img.icon-svg { height: 70px; padding: 10px 15px 0;}
}

@media only screen and (max-width: 414px){
.hotkeyicon { font-size: .8rem;}
.hotkey-block{ padding: 0 4%;}
.hotkey-block div.line-block { height: 105px; width: 105px; margin: 8px; }
.hotkeyicon .icon {padding: 10px;}
.htmldisplay .hotkeyicon img.icon-svg { height: 52px; padding:0;}
}

@media only screen and (max-width: 375px){
.hotkeyicon { font-size: .75rem;}
.hotkey-block{ padding: 0;}
}

@media only screen and (max-width: 360px){
.hotkey-block div.line-block { height: 100px; width: 100px; }
.htmldisplay .hotkeyicon img.icon-svg { height: 50px;}
}

/*video 校園影音 ********************/
.videoimg {width: 100%; height: auto; /*background: #35c9d8;*/ padding: 25px 0px; text-align: center}
.videoimg>div { padding: 0 155px;}

.videoimg-l, .videoimg-r {}
.videoimg-l {height: 500px; overflow: hidden; padding: 20px;}
.videoimg-r1, .videoimg-r2, .videoimg-r3, .videoimg-r4 {width: 50%; padding: 20px;}
.videoimg-l iframe {width: 100%; height: 100%;}
.videoimg-r iframe {width: 100%; height: 208px;}
.videoimg .event {display: inline-block;}
.videoimg .event .bt {
	margin-top:25px;
	line-height: 1.6;
}

@media only screen and (max-width: 1700px){
.videoimg>div { padding: 0 150px;}
}

@media only screen and (max-width: 1400px){
.videoimg>div { padding: 0px;}
}

/*三圓區 goto**********/
#goto {
	position:relative;
	/*max-width:1570px;*/
    width: 100%;
	margin:0 auto 0px;
	padding:0 0 10px;
	overflow:hidden;
}
#goto::after {
	position:absolute;
	top:200px;
	left:0;
	right:0;
	bottom: 0px;
	max-width:100%;
    width: 100%;
	margin:0 auto;
	content:".";
	background-color:#35c9d8/*e6e6e6*/;
	background-image: url(../img/intro-bg.jpg);
	display:block;
	z-index:-1;
	border-top: 2px solid #35c9d8;
}
#goto .cf {
	width:1200px;
	margin:30px auto 0;
	display:block;
}

#goto .cf:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#goto .cf article {
	width:300px;
	margin-right: 150px;
	float:left;
}

@media screen and (min-width: 1201px){
#goto .cf article:last-child {
	margin-right:0;
}
}

#goto .cf article .img a {
	display:block;
}

#goto .cf article img {
	width: 300px;
    vertical-align: bottom;
	border-radius: 50%;
}

#goto .cf article .img {
	border-radius:150px;
	-moz-border-radius:150px;
	-webkit-border-radius:150px;
	overflow:hidden;
	box-shadow: 0px 7px 10px #3cc1c5;
}

#goto .cf article .title, #goto .cf article .title a {
	color:#ffffff;
	font-size:22px;
	margin-top:25px;
	line-height:1em;
	text-align: center;
}

#goto .cf article .title:after {
	width: 30px;
    height: 2px;
    background-color: #f7b5c3;
    content: "";
    margin: 12px auto 0;
    display: block;
}

#goto .cf article .text, #goto .cf article .text a {
	color:#ffffff;
	font-size:1.05em;
	margin-top:15px;
	text-align:left;
}

#goto .event {
	position: relative;
	max-width: 1100px;
	/*margin: 40px auto;*/
}
#goto .event * {
	outline: none;
}

#goto .event .bt {
	margin-top:25px;
	text-align: center;
	line-height: 1.6;
}
#goto .event .bt a {
	color:#ffffff;
	font-size:14px;
	font-weight:bold;
	padding:10px 55px 8px;
	background-size:30px auto;
	/*border:1px solid #ffffff;
	display:inline-block;*/
	
	border: 0 solid;
	box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
	outline: 1px solid;
	outline-color: rgba(255, 255, 255, .5);
	outline-offset: 0px;
	text-shadow: none;
	transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
}

#goto .event .bt a:hover {
	border: 1px solid;
	box-shadow: inset 0 0 20px rgba(255, 255, 255, .5), 0 0 20px rgba(255, 255, 255, .2);
	outline-color: rgba(255, 255, 255, 0);
	outline-offset: 15px;
	text-shadow: 1px 1px 2px #03a9cc; 
}

#goto .squarebtn { display: none;/*margin: 40px auto 0; padding: 20px; height: 100px; width: 300px; background: #0099b2; text-align: center;*/ }
#goto .squarebtn a { color: #fff}

@media screen and (max-width: 1200px){
#goto .cf {width: fit-content;}
#goto .cf article { width: 250px; margin: 0 35px;}
#goto .cf article img { width: 250px;}
}

@media screen and (max-width: 1024px){
#goto .cf {width: fit-content;}
#goto .cf article { width: 230px; margin: 0 25px;}
#goto .cf article img { width: 230px;}
}

@media screen and (max-width: 800px){
#goto .cf article { width: 200px; }
#goto .cf article img { width: 250px;}
}

@media screen and (max-width: 768px){
#goto::after {background-image: none; background-color: unset;}
#goto .cf {width: auto; margin: 0 auto; background: #fff; padding-bottom: 20px;}
#goto .cf article {display: block; width: auto; overflow: hidden; margin-right: 0;float: unset; padding: 0 30px;}
#goto .cf article .img {/*width: 45%;*/ float: left; margin: 20px; box-shadow: 0px 0px 10px #eaeaea;}
#goto .cf article .title {text-align: left; color: #484848; padding-top: 10%; margin-left: 55%; font-size: 1.3em; font-weight: bold;}
#goto .cf article .title:after { margin: 12px 0; margin-left: 2%;}
#goto .cf article .text { margin-right: 25px; margin-left: 55%; color: #797979; font-size: 1em;}

.videoimg {background-image: url(../img/intro-bg.jpg);}
.videoimg-r {padding: 0 10px}
.videoimg-r1, .videoimg-r2, .videoimg-r3, .videoimg-r4 {padding: 10px}
}

@media screen and (min-width: 660px) and (max-width: 768px){
#goto .cf article .img {width: auto}
#goto .cf article .title {font-size: 1.5em; margin-left: 50%;}
#goto .cf article .title:after { margin-left: 0;}
#goto .cf article .text {font-size: 1.05em; margin-left: 50%;}
}

@media screen and (max-width: 520px){
#goto .cf article {padding: 0px;}
#goto .cf article .img {margin-left: 0;}
#goto .cf article img {width: 200px;}
/*#goto .cf article .title {padding-top: 6%;}*/
#goto .cf article .title:after {display: flex;}
}

@media screen and (max-width: 375px){
#goto .cf article img {width: 180px;}
#goto .cf article .text { font-size: .9em;}
}

/*span-color-ga003*/
.span-color-ga003,a.span-color-ga003{color: #59c2d4;}
a.span-color-ga003:hover,a.span-color-ga003:focus {color:#10ad7d;}

/*span-color-ga007*/
.span-color-ga007,a.span-color-ga007{color: #59c2d4;}
a.span-color-ga007:hover,a.span-color-ga007:focus {color:#10ad7d;}

/*線上報修button-ga009********************/
.repair-basicset .btn-primary { color: #ffffff;  background-color:#0099b2;  border-color:#0099b2;  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:#59c2d4;}
.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:#59c2d4;}

/* CGA001 圖文公告換色 ********************/
.ct-focusslider .focus-content .textblock{ background:#fdfdfd; color: #525252; border-bottom: 4px solid #4cc2d0;}
.ct-focusslider .focus-content .textblock.notice-color{background:#fdfdfd; color: #525252;  border-bottom: 4px solid #4cc2d0;}
.ct-focusslider .focus-content .textblock .text {color: #929292; }
/*CGA001 圖文公告箭頭顏色*/
.ct-focusslider .focus-controls .focus-arrow{ fill:#4cc2d0; }
.ct-focusslider .focus-controls .focus-arrow:hover { fill: #f7b5c3;}
.ct-focusslider .focus-controls .focus-arrow.focus-end{ fill: rgba(175, 175, 175, 1);}
/*#noticeTable .ct-focusslider .focus-controls .focus-arrow.focus-right {right: -18px;}
#noticeTable .ct-focusslider .focus-controls .focus-arrow.focus-left {left: -18px;}*/

/*CGA004、CGA008、CGA009電子報系列*/
.ct-epaper .btn-primary{color: #ffffff; background-color:#4b77a7; border-color:#4b77a7; fill: #ffffff;}
.ct-epaper .btn-primary:hover{color: #ffffff; background-color:#0d62c0;  border-color:#0d62c0; fill: #ffffff;}
.ct-epaper .yearnav ul li{ background: #f4ffd4; color: #59c2d4; border-bottom: 1px solid #4cc2d0;}
.ct-epaper .yearnav ul li:hover { background: #59c2d4; color: #ffffff;}

/* GA017 全文檢索*******************/
.cmgch-google .btn-all{ color: #ffffff; background-color:#0099b2; border-color:#0099b2; 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:#59c2d4;  border-color:#59c2d4; 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:#0099b2;} 
.cmgch-google .form-group-m .bar::before {background:#0099b2;}

/*ALT+C 導盲磚 *******************/
.text-secondary {color: #656769;}

/*GA 意見回饋*/
.btn-feedback {background-color: 34afc3;}

/*相簿*/
.abimgs:not(:nth-child(4n)) { padding-right: 10px;}
.ct-row .abimgs .imgResponsiveShow {width: 100%;}
.ct-row .abimgs .imgResponsiveShow img {width: 100%; height: auto; overflow: hidden;}

@media screen and (max-width:1015px){
.abimgs:not(:nth-child(3n)) { padding-right: 10px;}
}

@media screen and (max-width:768px){
.abimgs:not(:nth-child(2n)) { padding-right: 10px;}
}

@media screen and (max-width:530px){
.abimgs { padding-right: 0px!important;}
}

/*freeze *******************/
#noticeview_to_print .ct-btn {white-space: normal;}
.freeze .theme {height: 100px;}
.freeze .logo {height: 100px; top: 0}
.freeze .schoolbtn-block, .freeze .segmentbtn-block { margin-top: 40px;}

/*權限scrollbar *******************/
.select-menu-container.select-visible .select-menu {overflow-y: scroll; height: 150px;}

/*方-頁籤button*/
.btn-secondary.btn-line {color: #434343; margin: 0 5px; border-radius: 0;}

/*公告置預色*/
.ct-row .module-padding .top_rect { border-color: #38b2c5 transparent transparent transparent;}
.ct-chip.chip-primary {background: #38b2c5}
.ct-chip.chip-primary:hover {background: #26a2b5}

/*issue01編輯器模組間距修改*/
.ct5abf2d91aa93092cee58cebc.module-padding {
  padding: 0;
  margin: 0;
}