#sub_banner_box { opacity: 1; }
#sub_banner_box .parallax_bg { margin-bottom: 0; min-height: 487px; opacity: 1; }

.webBox .parallax_svg.bann { -webkit-animation: parallax_top 10s linear infinite; animation: parallax_top 10s linear infinite; position: fixed; top: 87px; }

#sub_banner_box { margin-top: 103px; }

#wrap { margin-top: -90px; z-index: 4; }
#wrap .pag_tit {margin-bottom: 10px;line-height: 170%;margin-top: 110px;}

.waylink ol { padding-top: 5px; }
.waylink ol li, .waylink ol li a {letter-spacing: .1em;font-weight: 500;font-size: 16px;vertical-align: bottom;}
.waylink ol li:after { margin: 0 10px; display: inline-block; font-weight: 100; font-size: 12px; color: var(--info); content: "/"; }
.waylink ol li:last-child:after { margin: 0; content: ""; }

aside { margin-bottom: 60px; z-index: 5; }
aside ul li b { padding: 5px 10px 5px 5px; }
aside ul li b .fa { transform: rotate(0); -webkit-transform: rotate(0); transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }
aside ul li b .fa:before { content: "\f107"; }
aside>ul>li { position: relative; display: inline-block; }
aside>ul>li h4 { padding: 0 15px; }
aside>ul>li h4 a { padding: 10px 5px; font-weight: 300; font-size: 18px; letter-spacing: .15em; }
aside>ul>li.action h4 a, aside>ul>li.action h4 i { color: var(--primary); }
aside>ul>li .subUL { position: absolute; margin-top: 10px; width: 180px; background: var(--white); left: calc((100% - 180px) / 2); transform: translate(0, 30px); -webkit-transform: translate(0, 30px); }
aside>ul>li .subUL>li { border-bottom: 1px rgba(var(--gray-rgb), .1) solid; }
aside>ul>li .subUL>li a { padding: 3px 15px; display: block; line-height: 140%; font-weight: 300; }
aside>ul>li .subUL>li .subULHead a { padding: 10px 15px; color: var(--black); font-weight: 400; }
aside>ul>li .subUL>li b { display: none; }
aside>ul>li .sub2UL { margin: 0 10px 10px; }
aside>ul>li[data-type="1"] { overflow: hidden; }
aside>ul>li[data-type="1"] .subUL { box-shadow: 0 0 15px rgba(var(--black-rgb), 0); opacity: 0; z-index: -1; }
aside>ul>li[data-type="2"] { overflow: visible; }
aside>ul>li[data-type="2"] ul li h4 b .fa { transform: rotate(180deg); -webkit-transform: rotate(180deg); }
aside>ul>li[data-type="2"] .subUL { box-shadow: 0 0 15px rgba(var(--black-rgb), .15); opacity: 1; z-index: 1; transform: translate(0, 0); -webkit-transform: translate(0, 0); }

.mb_nav { display: none; }

#content_wrap { padding: 0 0 60px; min-height: 350px; }
#content_wrap .list_box li { margin: 0 15px 50px; vertical-align: top; }
#content_wrap .img_box { border-radius: 15px; background-color: #f9f9f9; }
#content_wrap .info_box { margin: 10px 15px 0; }
#content_wrap .info_box .time { width: 65px; font-weight: 400; font-size: 13px; }
#content_wrap .info_box .more_btn { margin-left: 10px; padding: 2px 15px; max-width: calc(100% - 105px); height: 22px; font-weight: 100; font-size: 13px; z-index: 6; }
#content_wrap .info_box .quote_box * { font-weight: 400; font-size: 13px; }
#content_wrap .info_box h3 { height: 34px; font-size: 20px; }
#content_wrap .info_box>div { padding: 20px; border-radius: 0 15px 15px 15px; }
#content_wrap .info_box>div article { height: 42px; line-height: 140%; font-weight: 300; font-size: 15px; -webkit-line-clamp: 2; }

#book_list li h3 { margin-top: 10px; height: 30px; font-size: 18px; }

#album_list { margin-bottom: 5vw; flex-wrap: wrap; }
#album_list>div { margin: 0 1px 1px 0; height: 300px; flex-grow: 1; }
#album_list>div img { width: auto; min-width: 100%; height: 300px; }

#faq_list { margin-bottom: 50px; }
#faq_list li { border-bottom: 1px rgba(var(--primary-rgb), .7) dashed; }
#faq_list li .title { padding: 20px 20px 20px 0; }
#faq_list li .title font { vertical-align: top; }
#faq_list li .title .txt { margin-left: 10px; width: calc(100% - 50px); font-size: 20px; }
#faq_list li .title .icon { width: 40px; height: 34px; }
#faq_list li .title .icon:before, #faq_list li .title .icon:after { position: absolute; margin: auto; width: 14px; height: 2px; background: var(--primary); display: block; top: calc((100% - 2px) / 2); left: calc((100% - 14px) / 2); content: ""; }
#faq_list li .title .icon:after { transform: rotate(90deg); -webkit-transform: rotate(90deg); }
#faq_list li .info { padding: 0 20px 30px 50px; font-size: 15px; }
#faq_list li.current .title .icon:after { transform: rotate(180deg); -webkit-transform: rotate(180deg); }

#pagenav a, #pagenav strong { margin: 0 2px; width: 35px; height: 35px; display: inline-block; text-align: center; line-height: 35px; font-weight: 400; }
#pagenav strong { background: var(--primary); color: var(--white); border-radius: 50%; }
#pagenav p { margin: 0 5px; width: calc(50% - 10px); vertical-align: top; }
#pagenav p a { margin: 15px 0 0; padding: 0 15px; width: auto; height: auto; line-height: initial; font-size: 0; }
#pagenav p a i { margin: 0 5px 0 0; width: 11px; line-height: 23px; font-size: 12px; vertical-align: top; }
#pagenav p a font { max-width: calc(100% - 16px); min-width: auto; font-size: 14px; font-weight: 100; vertical-align: top; }
#pagenav p:last-child a i { margin: 0 0 0 5px; }

#describe { margin: 2em 0 5vw; }
#describe *, .tab_content * {vertical-align: bottom;color: currentcolor;   /* 水平置中 */       /* 垂直置中 */             /* 必須有高度 *//* text-align: center; */}

#google_shere { margin-top: 30px; }

.form_box p.note .red { color: #f00; }
.form_box p.item { padding: 15px; border-bottom: 1px rgba(var(--primary-rgb), .7) dashed; }
.form_box p.item label span { font-weight: 500; font-size: 17px; }
.form_box p.item label i { margin-left: 15px; line-height: 20px; font-size: 20px; color: #f00; }
.form_box p.item font { margin: 5px 0; }
.form_box p.item.check_box { border-bottom: 0; }
.form_box p.send_box { margin: 15px 0 50px; }

[data-action="loader"] { width: 100vw; height: 100vh; background: rgba(var(--black-rgb), .3); line-height: 100vh; top: 0; left: 0; opacity: 0; z-index: -1; }
[data-action="loader"] .loader_circle { width: 50px; height: 50px; border: 2px rgba(var(--black-rgb), .6) solid; border-left-color: rgba(var(--white-rgb), .4);border-radius: 50%; }
[data-action="loader"]#lodbg .loader_circle { -webkit-animation: circle infinite 0.75s linear; animation: circle infinite 0.75s linear; }
#lodbg { opacity: 1; z-index: 99999; }

@keyframes circle { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
@-webkit-keyframes circle { 0% { -webkit-transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); } }

/* about */
.abouta{position: relative;display: grid;grid-template-columns: 1fr; gap: clamp(12px, 2.5vw, 24px);max-width: 1100px;margin: 0 auto;padding: clamp(14px, 3vw, 28px);background: #fff;border: 1px solid #eef1f5;border-radius: 16px;box-shadow: 0 8px 22px rgba(16,24,40,.06);}
.abouta::before{content:"";position:absolute;inset: 0 auto auto 0;	width: 52px;height: 4px;border-radius: 4px;background: linear-gradient(90deg,#4ca8ff,#71d9c5);}
.abouta p{ margin: 0; color:#2b2b2b; }
.abouta p:empty{ display:none; } 
.abouta p:first-child{position: relative;aspect-ratio: 16 / 10; overflow: hidden;border-radius: 14px;background: #f4f6fa;}
.abouta p:first-child img{width: 100%;height: 100%;display: block;object-fit: cover;transform: scale(1.02);transition: transform .5s ease;}
.abouta:hover p:first-child img{ transform: scale(1.06); }
.abouta p:last-child{font-size: clamp(15px, 1rem + .2vw, 18px);line-height: 1.85;letter-spacing: .2px;}
.abouta p:last-child br + *{ margin-top: .5em; }
.aboutb{display: grid;grid-template-columns: 1fr; gap: clamp(12px, 2.6vw, 22px);max-width: 1100px;margin: 0 auto;padding: clamp(14px, 3vw, 28px);
background: #fff;border: 1px solid #eef1f5;border-radius: 16px;box-shadow: 0 8px 22px rgba(16,24,40,.06);overflow: hidden;}
.aboutb > img{width: 100%;height: 100%;display: block;aspect-ratio: 16 / 11; object-fit: cover;border-radius: 14px;transform: scale(1.02);
transition: transform .5s ease;}
.aboutb:hover > img{ transform: scale(1.06); }
.aboutb p{margin: 0;color: #2b2b2b;font-size: clamp(15px, 1rem + .2vw, 18px);line-height: 1.85;letter-spacing: .2px;}
.aboutb p:first-line{font-weight: 800;color: #111;font-size: clamp(16px, 1.02rem + .25vw, 19px);}
.aboutb p br{content: "";display: block;margin-bottom: .55em;}
.aboutb p{position: relative;padding-left: 14px;border-left: 3px solid #eef3ff;}

[dir="ltr"][align="left"]{text-align: initial;direction: initial;font-size: 16px;color: #111;}
[dir="ltr"][align="left"] table{width: 57%;border-collapse: separate;border-spacing: 0;margin: 12px 0 20px;background: #fff;border: 1px solid #e9edf3;border-radius: 12px;overflow: hidden;table-layout: fixed;}
[dir="ltr"][align="left"] colgroup col{ width: auto !important; }
[dir="ltr"][align="left"] tbody tr{ border-bottom: 1px solid #eef1f5; }
[dir="ltr"][align="left"] tbody tr:last-child{ border-bottom: 0; }
[dir="ltr"][align="left"] td{padding: 12px 14px;vertical-align: top;border-top: 1px solid #f2f4f8; color: #334155;line-height: 1.7;
word-break: break-word;}
[dir="ltr"][align="left"] tbody tr:first-child td{ border-top: 0; }
[dir="ltr"][align="left"] td:first-child{font-weight: 800;color: #0f172a;width: 42%;position: relative;padding-left: 18px;}
[dir="ltr"][align="left"] td:first-child::before{
content:"";position:absolute; left: 10px; top: 1.15em;width:6px; height:6px; border-radius:50%;background:#cbd8f2;transform: translateY(-50%);
}
[dir="ltr"][align="left"] td:last-child{border-left: 3px solid #f3f6ff;padding-left: 14px;color: #1f2937;}
[dir="ltr"][align="left"] td p{ margin: 0; }
[dir="ltr"][align="left"] td span{ display: inline; }
[dir="ltr"][align="left"] > p{text-align: center;color: #94a3b8;margin: 6px 0 10px;font-size: 12px;}

@supports(selector(p:has(> span:only-child))){
[dir="ltr"][align="left"] > p:has(> span:only-child){
    font-size: 0; line-height: 0; margin: 0; height: 0; overflow: hidden; }
}
@supports(selector(tr:has(td))){
  [dir="ltr"][align="left"] tr:has(> td:empty + td:empty){ display: none; }
}
@media (max-width: 767px){
  [dir="ltr"][align="left"] table,
  [dir="ltr"][align="left"] tbody,
  [dir="ltr"][align="left"] tr,
  [dir="ltr"][align="left"] td{ display:block; width:100%; }

  [dir="ltr"][align="left"] tbody tr{border: 1px solid #e9edf3;border-radius: 12px;padding: 10px 12px;margin: 0 0 10px;
background: #fff;}
  [dir="ltr"][align="left"] td:first-child{border: 0;padding: 6px 0 2px 14px;width: auto;}
  [dir="ltr"][align="left"] td:first-child::before{ left: 0; }
  [dir="ltr"][align="left"] td:last-child{border: 0;border-left: 0;padding: 4px 0 6px 0;color: #334155;}
 [dir="ltr"][align="left"] tbody tr td{ border-top: 0; }
}
@media (min-width: 1200px){
  [dir="ltr"][align="left"] table{ border-radius: 14px; }
}

/* news */
.newshero{position: relative;max-width: 1100px;margin: 0 auto;padding: clamp(16px, 3vw, 28px);border: 1px solid #e9eef7;
border-radius: 18px;background:
radial-gradient(900px 420px at -10% 0%, #f5f9ff 0%, transparent 60%),
radial-gradient(800px 360px at 110% 100%, #f3fff9 0%, transparent 60%),
linear-gradient(180deg,#ffffff,#fbfdff);box-shadow: 0 8px 20px rgba(15, 23, 42, .04);display: grid;grid-template-areas:
"media""copy";gap: clamp(12px, 2.8vw, 24px);overflow: hidden;}
.newshero::before{content:"";position:absolute;inset: 0 52% 0 auto;background: linear-gradient(180deg,#f3f7ff 0%, #f7fffb 100%);
opacity:.65;pointer-events:none;}
.newshero > p:empty{ display:none; }
.newshero > p{ margin: 0; }
.newshero > p:first-child{ grid-area: media; }
.newshero > p:last-child{ grid-area: copy; }
.newshero > p:first-child{position: relative;border-radius: 14px;overflow: hidden;background: #f2f6ff;border: 1px solid #e6eefc;
aspect-ratio: 4 / 3;}
.newshero > p:first-child img{
width: 100%; height: 100%; display:block;object-fit: cover;transform: scale(1.01);transition: transform .6s cubic-bezier(.22,.61,.36,1);
}
.newshero:hover > p:first-child img{ transform: scale(1.04); }
@media (min-width: 768px){
.newshero > p:first-child{ aspect-ratio: auto; min-height: 320px; }
}
.newshero > p:last-child{
font-size: clamp(15px, 1rem + .24vw, 18px);line-height: 1.9;color: #223047;padding: clamp(6px, 1vw, 12px) clamp(6px, .8vw, 10px);
background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.7));border: 1px solid #edf2fa;
border-radius: 14px;box-shadow: 0 1px 0 rgba(15,23,42,.03);}
.newshero > p:last-child::first-line{font-weight: 800;color: #0f172a;letter-spacing: .2px;}
.newshero > p:last-child{position: relative;padding-left: clamp(12px, 1.2vw, 16px);}
.newshero > p:last-child::before{content:"";position:absolute; left: 0; top: 14px;width: 4px; height: calc(100% - 28px);
border-radius: 4px;background: linear-gradient(180deg,#9ecbff,#b6f0de);opacity:.85;}

.waylink{text-align: center;}
#category_nav{visibility: hidden;}

.table-container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px auto;
  background: transparent;
  overflow: hidden; /* 取消下方卷軸 */
}

.project-table {
  width: 100%;
  max-width: 900px; /* 控制整體寬度 */
  border-collapse: collapse;
  font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
  font-size: clamp(14px, 2vw, 16px);
  line-height: 1.6;
  text-align: center;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.06);
  margin: 0 auto; /* 確保置中 */
}

.project-table td {
  padding: 16px 18px;
  border-bottom: 1px solid #eee;
  color: #333;
}

/* 偶數行與 hover 效果 */
.project-table tr:nth-child(even) {
  background-color: #f9fafb;
}

.project-table tr:nth-child(even):hover {
  background-color: #e8f3ee;
}

.project-table tr:nth-child(odd):hover {
  background-color: #f1f8f5;
}

/* 手機版響應式：直向卡片風 */
@media (max-width: 768px) {
  .table-container {
    padding: 0 10px;
  }

  .project-table {
    max-width: 100%;
    width: 100%;
    box-shadow: none;
  }

  .project-table,
  .project-table tbody,
  .project-table tr,
  .project-table td {
    display: block;
    width: 100%;
    text-align: left;
  }

  .project-table tr {
    margin-bottom: 12px;
    border-radius: 10px;
    border: 1px solid #eee;
    background: #fff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  }

  .project-table td {
    padding: 10px 14px;
    border: none;
    border-bottom: 1px solid #f0f0f0;
  }

  .project-table td:last-child {
    border-bottom: none;
  }
}




@media screen and (min-width:1281px) {
	aside>ul>li:hover h4 a, aside>ul>li:hover h4 i { color: var(--primary); }
	.aboutb{ border-radius: 18px; padding: 32px; }
    .aboutb > img{ border-radius: 16px; }
}
@media screen and (min-width:980px) {
	#google_shere { margin-top: 6vw; }
}
@media screen and (min-width:761px) {
	.form_box p.item { padding: 30px 20px; }
	.form_box p.item label { width: 170px; }
	.form_box p.item font { margin: 0 0 0 30px; width: calc(100% - 200px); }
	.abouta{grid-template-columns: minmax(260px, 46%) 1fr;align-items: start;}
	.aboutb{grid-template-columns: minmax(260px, 40%) 1fr;align-items: center;}
	.aboutc table, .aboutc tbody, .aboutc tr, .aboutc td{ display:block; width:100%; }
	.aboutc tr{background:#fff;border:1px solid #eef1f5;border-radius: 14px;box-shadow: 0 6px 18px rgba(16,24,40,.05);padding: 10px 12px;margin: 0 0 12px;}
	.newshero{grid-template-columns: 1.05fr .95fr; grid-template-areas: "copy media";align-items: center;}
	.newshero > p:first-child{ aspect-ratio: auto; min-height: 320px; }
}
@media screen and (max-width:1460px) {
	#wrap .pag_tit { margin-top: 75px; }
}
@media screen and (max-width:1440px){
#wrap .pag_tit{margin-top: 113px;}
}
@media screen and (max-width:640px) {
	#album_list>div, #album_list>div img { height: 40vw; }
	.mb_nav { display: flex; flex-direction: column; align-items: center; border: #79797957 1px solid; padding: 10px 0; }
	.mb_nav p { display: flex; }
	.mb_nav b { margin-left: 10px; display: flex; align-items: center; }
	.soon.mb_nav b .fa { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }
	.mb_nav .fa:before { content: "\f107"; }
	#category_nav { position: absolute; display: flex; flex-direction: column; background: #f3f3f3; width: 100%; height: 0; opacity: 0; }
	#category_nav.showme { height: 400px; opacity: 100%; z-index: 999; }
}
@media screen and (max-width:550px) {
	#content_wrap .list_box li { width: 250px; }
	#community { margin-top: 10px; }
}
@media screen and (max-width:450px) {
	#album_list>div, #album_list>div img { height: 50vw; }
	#pagenav a, #pagenav strong { margin: 0; width: 24px; height: 24px; line-height: 24px; font-size: 14px; }
	#pagenav p a { display: block; }
}