@charset "utf-8";

.page-content,
.page-content #tbContent,
form { overflow:visible;}
/*文章(圖文式)列表*/
.article-list {  overflow:visible;}
.article-list * { padding:0; margin:0; list-style:none; text-decoration:none;}
.article-list ul { width:100%; height:auto; margin:0 auto; overflow:visible;
-webkit-flex-display:flex; display: flex;
flex-wrap:wrap;}
.article-list ul li { flex-shrink:0; width:calc( 33.33% - 30px ); height:auto; overflow:hidden; float:left; margin:15px; border-radius:5px;
transition:box-shadow .5s;
box-shadow:0 0 10px 0 rgba(0,0,0,.15);}
.article-list ul li:hover { box-shadow: 0 0 30px 0 rgba(0,0,0,.15)}
.article-list ul li > a { display:block; width:100%; height:auto; overflow:hidden; float:left;}
.article-list ul li > a .list-photo,
.article-list ul li > a .list-title { display:block; width:100%; height:auto; overflow:hidden;}
.article-list ul li > a .list-photo { position:relative;
-webkit-flex-display:flex; display: flex;
flex-wrap:wrap;}
.article-list ul li > a .list-photo:before { content:''; display:block; position:absolute; width:100%; height:100%; background:linear-gradient(0deg,rgba(0,0,0,.35),transparent 75%); z-index:1; opacity:1;
/*基礎動畫設定*/
transition:all .5s;}
.article-list ul li > a:hover .list-photo:before { opacity:0;}
/*.article-list ul li > a .list-photo:after { content:'了解更多'; display:block; background:url(../Images/Layout/Default/eye.png) top center no-repeat; position:absolute; width:100%; height:70px; left:0; top:50%; margin-top:-35px; padding-top:40px; line-height:30px; z-index:1; opacity:0; font-size:0.7rem; color:#fff; text-align:center;
-moz-background-size:50px auto;
-webkit-background-size:50px auto;
-o-background-size:50px auto;
background-size:50px auto;
-moz-transform: scale(1.5);
-webkit-transform: scale(1.5);
-o-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
-webkit-transition:all .5s, -webkit-transform .5s; transition:all .5s, transform .5s;}
.article-list ul li > a:hover .list-photo:after { opacity:1;
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);}*/
.article-list ul li > a .list-photo img { flex-shrink:0; width:100%; height:auto; display:block;
-webkit-transition:all .5s, -webkit-transform .5s; transition:all .5s, transform .5s;}
.article-list ul li > a .list-photo:hover img {
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);}
.article-list ul li > a .list-title { padding:30px 20px; font-weight:bold; color:#8f73b0;}
.article-list ul li > a .descr { display:block; padding:0 20px; width:100%; height:auto; font-size:0.7em; color:#777; margin-bottom:30px;}
/*字級大小設定*/
/*小*/
.fontsize1 .article-list ul li > a .list-title { font-size:0.75rem;}
/*中*/
.fontsize2 .article-list ul li > a .list-title{ font-size:1rem;}
/*大*/
.fontsize3 .article-list ul li > a .list-title{ font-size:1.25rem;}
/*巨*/
.fontsize4 .article-list ul li > a .list-title{ font-size:1.75rem;}


/*特色項目*/
.featured-items-box { margin-bottom:0;}
.featured-items-box .max-w-box { max-width:none;}
.featured-items { display:block; width:100%; height:auto; margin-bottom:30px;}
.featured-items * { padding:0; margin:0; list-style:none; text-decoration:none;}
.featured-items ul { display:flex; gap:20px; flex-wrap:wrap; width:100%; height:auto;}
.featured-items ul > li { width:calc( 50% - 10px ); display:flex;transition:all 0.3s ease-in-out;}
.featured-items ul > li:hover {
transform: translateY(-8px);}
.featured-items ul > li a { display:flex; flex-wrap:wrap; width:100%; height:auto; overflow:hidden; position:relative;}
.featured-items ul > li a .list-photo { display:flex; width:100%; height:auto; overflow:hidden; border-radius:30px;transition:all 0.3s ease-in-out;
	border: 3px solid #eee;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);}
.featured-items ul > li:hover a .list-photo {
	box-shadow: 0 10px 25px rgba(0,0,0,0.1);
	border: 3px solid #f5a623;}
.featured-items ul > li a .list-photo img { display:block; width:100%; height:auto;object-fit: cover;aspect-ratio: 16 / 7.9; }
.featured-items ul > li a .list-title{
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin:0;
	padding:15px;
    line-height: 1.4;
	text-align:center;
	width:100%;
	display:block;
}

/*=======================================媒體查詢開始=======================================*/
@media only screen and (min-width:0px) and (max-width:1024px) {
.article-list ul li { width:calc( 50% - 20px ); height:auto; overflow:hidden; float:left; margin:20px 10px;}
.featured-items ul > li { width:100%;}
}

@media only screen and (min-width:0px) and (max-width:768px) {
.article-list ul li { width:100%; margin:0; margin-bottom:20px;}
}