@charset "utf-8";
body {font-family:'Microsoft JhengHei'; background-color:#f5f5f5; line-height:1.7; display:flex; flex-direction:column; min-height:100vh}
A {color:#1d6a61; text-decoration:none; outline:none}
A img {display:block; margin:0 auto}
A:hover {color:#1d6a61; text-decoration:underline}
img {max-width:100%; height:auto}

article {flex:1 1 auto}
section {background-color:#fff; border-radius:0 0 1em 1em; box-shadow:0 5px 5px #aaa inset; border-bottom:1px solid #ddd; padding-top:.5rem}

label {font-weight:900; margin-bottom:0}
label:after {content:'\003A'; padding:0 .5rem}

select.form-control {display:inline-block; width:auto}
.col-form-label {text-align:right}
.text-truncate {display:block}
figcaption {font-size:.85rem}
header {background-color:rgb(99,192,171)}
header #logo {padding-top:10px}
header #information {position:absolute; z-index:2; bottom:0; right:10px; color:#f90}
header #information b {color:#f60; font-size:.85em}
@media (max-width:767px) {
	header {padding-bottom:0}
	#small_logo {height:70px}
}

/*側邊攔.管理員快速選單*/
.groupon {font-size:0.8em; min-height:3.5em; padding-right:10px; position:fixed; left:5px; top:0px; z-index:999; margin-left:5px; filter:alpha(opacity=90); opacity:0.9; background-color:#FFF; border-radius:0 0 15px 15px; box-shadow:0 4px 3px rgba(20%,20%,40%,0.4)}
.groupon ul li {display:inline-block}
.groupon ul li a {text-decoration:none}
.groupon ul li a sup {border-radius:16px; padding:1px 4px; left:-7px; alpha(opacity=85); opacity:0.85}
@media (max-width:767px) {
	.groupon {height:3em; width:100%; overflow-y:hidden; overflow-x:scroll; right:0}
	.groupon ul {width:720px}
}

/*----- 返回頂端 -----*/
.gotoTop {position:fixed; bottom:8em; z-index:9999; height:150px; cursor:pointer; filter:alpha(opacity=50); opacity:0.5; text-align:center; display:none}
.gotoTop a:hover {color:#F30; text-decoration:none}
.gotoTop #Top {margin-bottom:1.5rem}
.gotoTop i {display:block}
@media (min-width:1200px) {
	.gotoTop {right:1.5em}
	.gotoTop i {font-size:3.75rem}
}
@media (min-width:992px) and (max-width:1199px) {
	.gotoTop {right:1em}
	.gotoTop i {font-size:3.25rem}
}
@media (min-width:768px) and (max-width:991px) {
	.gotoTop {right:0.5rem}
	.gotoTop i {font-size:3rem}
}
@media (max-width:767px) {
	.gotoTop {right:0}
	.gotoTop i {font-size:2.8rem}
}

.more {text-align:right; color:#00A099}

/* -- 導覽列 --*/
.breadcrumb {background-color:transparent}
.breadcrumb li, .breadcrumb a {display:inline}
.breadcrumb-item + .breadcrumb-item::before {font-family:'Font Awesome 5 Free'; font-weight:900; content:'\f0da'; color:#ccc}
@media (max-width:767px) {
	.breadcrumb {padding:0; margin-bottom:0}
	.breadcrumb > li + li:before {padding:0px 1px}
}

.navbar-nav {flex-wrap:wrap}
.navbar-nav .nav-link {padding-left:.25rem}
.navbar {background:#e9e5dc; box-shadow:0 5px 5px #aaa; padding:0}
.navbar .nav-item {padding:0 .5rem;}
.navbar .dropdown-menu {min-width:15rem}
.navbar .nav-item.active, .navbar .nav-item:hover {background:#63c0ab}
.navbar .nav-item.active .nav-link {color:#fff; text-shadow:1px 1px 1px #030}
.navbar .dropdown-toggle {white-space:nowrap}
.navbar .dropdown-toggle:hover {color:#fff}
.navbar .dropdown-toggle.home::after {border:none}
.navbar .dropdown-item {padding:.15rem .5rem}
.navbar .dropdown-menu .nav-link:hover {color:#fff; background-color:#1d6a61}

aside {padding-top:1rem}
aside .card-header {background-color:#e9e5dc; font-size:1.2rem; padding:.5rem 1rem}
aside .card-body {padding:.5rem 0}
aside .card-body ul {margin-bottom:.5rem}

.headTitle {border-bottom:3px solid #eee; margin-bottom:1em; display:flex; justify-content: space-between}

.headTitle h1 {margin:0 0 -3px; font-size:1.5rem; color:#1d6a61; font-weight:bold; border-bottom:3px solid #57D0C1; padding:5px}

@media (min-width:768px) and (max-width:991px) {
	.headTitle {letter-spacing:1px}
}

@media (max-width:414px) {
	.headTitle {margin-bottom:5px}
	.headTitle h1 {letter-spacing:normal}
}

/* 分類標題 */
.media .h4 {color:#1d6a61}
.media p {font-size:13px; line-height:1.5; margin-bottom:0}

.center_module .tab-content {padding-top:.5rem; min-height:2rem}
/*----- 頁腳 ------*/

footer {font-size:.85rem; background-color:rgb(99,192,171); box-shadow:0 6px 6px rgb(44,104,90) inset; text-align:center; padding-top:.85rem}
address {display:inline-block; margin-bottom:0}
/* footer address span {white-space:nowrap; padding-left:1em}
footer ul {line-height:1.8; padding-top:.5rem} */
/* footer ul li {text-align:left} */
/* footer p {margin-bottom:0; padding-bottom:5px} */
@media (max-width:414px) {
	footer {font-size:.8rem; text-align:left}
}

/* =========== NAVBAR ============ */
.NavBar {display:flex; padding:.4rem 1em .5rem; letter-spacing:1px}
.NavBar .pagination a {color:inherit}
.NavBar .pagination > .active > a {background-color:#1d6a61}
@media (min-width:768px) and (max-width:991px) {
	.NavBar {padding:5px 10px}
}
@media (max-width:767px) {
	.NavBar {padding:5px 10px; letter-spacing:normal}
}
@media (max-width:414px) {
	.NavBar {padding:0}
}

/* 按鈕 */
.Botton {padding:.5rem 2rem; border-top:4px solid #ececec; margin-top:1rem; display:flex; justify-content:space-between; align-items:center}
i {filter:alpha(opacity=50); opacity:.5}

.header {border-top:2px solid #1C1F87; position:relative; height:30px}
.header > h2 {text-align:center; display:inline-block; border-radius:15px; color:#FFF; padding:0 30px; position:absolute; top:-35px; left:42%; border-bottom:none; font-weight:normal; background:rgb(30,87,153); background: linear-gradient(to bottom, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);}


/* 分類選單 */
#categories {padding-left:0; list-style:none}
#categories li a {display:block; padding-left:.5rem}
#categories li.sub_0 {font-size:1.15rem}
#categories li.sub_0.active {background-color:rgb(218,252,244)}
#categories li.sub_0.active > a {background-color:#1d6a61; color:#fff}
#categories li.sub_0.active > a small {color:#63c0ab}
#categories li.sub_1 {font-size:1rem}
#categories li.sub_1.active {background-color:rgb(99,192,171)}
#categories li.sub_1.active > a {color:#fff}
/* #categories li.sub_1.active > a small {color:#63c0ab} */

/*解析時間*/
/* .parse_time {text-align:center; background-color:#C00; color:#FFF; padding:2px; filter:alpha(opacity=80); opacity:0.8; position:fixed; right:0; bottom:0; width:100%; z-index:1000} */

/*驗證欄位警告訊息*/
.form-control.error::-moz-placeholder {color:#f99; opacity:1}
.form-control.error:-ms-input-placeholder {color:#f99}
.form-control.error::-webkit-input-placeholder {color:#f99}
input.error, select.error, textarea.error {border-color:#C00; color:#F00; background-color:#FFE6FF}
input.error + label.error, select.error + label.error, textarea.error + label.error {position:absolute; right:-10px; top:-15px; background-color:rgba(204,0,0,.8); color:#FFF; font-size:12px; padding:2px 10px; border-radius:5px; font-weight:normal; z-index:2}
input.error + label.error:after, select.error + label.error:after, textarea.error + label.error:after {content:''; display:inline-block; border-right:7px solid transparent; border-left:7px solid rgba(204,0,0,.8); border-bottom:7px solid transparent; position:absolute; bottom:-7px; left:10px}
input.valid {background:#CF9}
textarea.valid {background:#CF9}
.vvimg {/* padding:0;  */max-width:8em}
#getcode {cursor:pointer}

/* 輸入框加入圖示 */
.form-control-feedback {color:#ccc}
.error + .form-control-feedback {color:#f00}
.error + button + .form-control-feedback {color:#f00}

/* select.input-xs {height:25px; line-height:25px; padding:5px 8px} */
.modal-header, .btn-success {background-color:#63c0ab; color:#fff}

/*首頁樣式*/
.carousel-indicators {z-index:1}
.carousel-inner .item {text-align:center; background-color:#000}
.carousel-control .fa-chevron-left, .carousel-control .fa-chevron-right {position:absolute; top:40%; z-index:5; display:inline-block}
.carousel-control .fa-chevron-left {left:15%}
.carousel-control .fa-chevron-right {right:15%}
#panner li {margin-bottom:.5em; font-size:.8em}

@media (max-width:414px) {
	.carousel-inner > .item > img, .carousel-inner > .item > a > img {max-width:120%; position:relative; right:10%}
}

/*更多按鈕*/
.more {text-align:right; font-size:11px; padding:5px 10px 5px 0}
.more a {color:#FA3}
.more a:hover {color:#F60}

#myCarousel {margin:0 -15px}