@charset "big5";
/* CSS Document */
body {margin: 0;}
h1 {margin: 0; padding: 0; height: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; _display: none;}
.red {color: #ff0000;}

.main, .main a, .main a:hover {letter-spacing: 1px; font-family: Arial, Helvetica, sans-serif, "·L³n¥¿¶ÂÅé"; text-align: justify;}
.main a {color: #3d3d3d; text-decoration: none;}
.main a:hover {color: #ec5f01; text-decoration: none;}
.main {margin: 0 auto; width: 980px; background-color: #006467;}
.header img {display: block; width: 100%;margin-top:40px;}
.logo {text-align: right;}
.logo img {width: 150px;}
.footer {height: 10px;}

.containter {margin: 10px; margin-bottom: 0; padding: 10px 80px; background-color: #ffffff; font-size: 16px; line-height: 26px; border-radius: 10px; background-color: #ebfffd;}
.section {margin-bottom: 20px;}
.section2{margin-bottom: 20px;}
h2, .article {margin: 10px 0; padding: 0;}
h2 {font-size: 20px;}
h2:before {content: "¡´";}
h3 {color: #990000; font-size: 18px;}
.article ul, .article li {margin: 0; padding: 0;}
.article li {margin-bottom: 10px;}
.article table {border-collapse: collapse;}
.article table, .article th, .article td {border: 1px solid black;}
.article th, .article td {padding: 3px 10px; text-align: center;}
.article th {background-color: #cccccc;}
.small {font-size: 12px; line-height: 22px;}

.imglink a img {display: block; margin: 0 auto; border: none; transform: scale(0.9,0.9); transition: transform 0.5s;}
.imglink a:hover img {transform: scale(1,1);}.main .containter .section .article h4 {
	color: #e97100;
	font-weight: bold;
	font-size: 24px;
}
.main .containter .section h5 {
	font-size: 26px;
	color: #8A0003;
	font-weight: bold;
}

.event-link {margin: 10px 0; text-align: center;}
.event-link a {display: inline-block; margin: 0 4%; padding: 10px 15px; background-color: #cc0000; color: #ffffff; font-size: 16px; line-height: 16px; font-weight: bold; text-decoration: none; border: solid 1px #660000; transition: background-color, 0.3s;}
.event-link a:hover {background-color: #ffffff; color: #cc0000; box-shadow: 0 5px 15px #996666;}

.ads {display: flex; width: 100%; margin: 1px; flex-wrap: wrap;}
.card {margin:5px;width: 16rem;padding: 5px; text-align: center;}
.card-body{height: auto;}
.ad-title {font-weight: bold; font-size:18px; line-height:22px; text-align: center;}
.ad-text {font-size:15px; line-height:20px;}
.ad-price {font-size:16px; line-height:10px; text-align: right;}
.card:hover{border:2px solid #ff7c7c;}

.menu{display: flex;width: 70%;padding: 5px;text-align: center;margin-top: 8px;}
.menu span{display: flex; flex-direction: row; justify-content: center; color: #FFFFFF; font-size: 1.2rem; font-weight: bold; text-align: center; padding: 5px;}
.menu span:hover{background-color: #15d2d8;}

.intro{font-size: 11pt;line-height: 16pt;margin-top: 16pt;}
.in_title{font-weight: bold;line-height: 28pt;}
.togo{display: block; border: 1px solid #3d3d3d;padding: 10px;line-height: 18pt;}
.imgs{width: 80%;}
.imgs img{width: 100%;}

.more{margin-top: 20px; }

/* ¦^­¶­º */
a#jump {display: none \9;}
a#jump div {width: 50px; height: 50px; background-color: #cc0000; color: #ffffff; font-size: 16px; line-height: 16px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-align: center; text-decoration: none; opacity: 0.7; filter: alpha(opacity=70); cursor: pointer; position: fixed; right: 15px; bottom: 15px; border-radius: 50%; z-index: 6; _display: none; transition: background-color 0.2s linear, opacity 0.2s linear, filter 0.2s linear, transform 0.1s linear;}
a#jump:hover div {background-color: #ff00ff; opacity: 1; filter: alpha(opacity=100); transform: scale(1.25,1.25); box-shadow: 0 2px 6px rgba(0,0,0,0.7);}
a#jump b {display: block; font-size: 24px; line-height: 24px; font-family: Verdana, Geneva, sans-serif; position: relative; top: 5px;}

@media screen and (max-width:600px) {
	.card{text-align: center; width: 100%;}
	.menu{padding: 0px; margin-top: 8px;width: 94%;}
	.menu span{font-size: 0.9rem;}
}
