@charset "utf-8";
/* CSS Document */
  @font-face {
 font-family: 'Microsoft JhengHei';
 unicode-range: U+7db0,U+78A7,U+7B75;
 font-style: normal;
 font-weight: bold;
 src: local(Yu Gothic),local(MS Gothic)
}
@font-face {
 font-family: 'Microsoft JhengHei';
 unicode-range: U+7db0,U+78A7,U+7B75;
 font-style: normal;
 font-weight: normal;
 src: local(微軟正黑體),local("Microsoft JhengHei")
}
body {background: #fff!important;min-height: 100%;font-family: 'Microsoft JhengHei','微軟正黑體', Arial, sans-serif;line-height: 1.6;letter-spacing: 0.5px;text-align: left;font-weight: normal;overflow-x: hidden;font-size: 16px;}
a {text-decoration: none;-webkit-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;}
a:link {color: #232323;}
a:visited {color: #232323;}
a:active {color: #232323;}
.wrapper {width: 1500px;position: relative;margin: 0 auto;clear: both;zoom:1;}
.wrapper:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both; height: 0;}
@media screen and (max-width: 1500px) {.wrapper {width:95%;}}
/* GDRP */
.gdpr-bar{display: inline-block;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;background-color:  #194866;position: fixed;bottom: 0;left: 0;width: 100%;color: #fff;padding: 0.5rem 1rem;-webkit-transition: .5s ease-in all;-o-transition: .5s ease-in all;transition: .5s ease-in all;z-index: 100;}
.gdpr-bar>div{display: inline-block;vertical-align: middle;}
.gdpr-bar .left{text-align: left;padding-right: 1rem;max-width: 90%;}
.gdpr-bar .right {text-align: right;min-width: 4rem;}
.accept-btn {background-color: #FEC130;border: none;color: #194866;padding: 0.5rem 1rem;font-size: 0.875rem;font-weight: 700;text-align: center;text-decoration: none;display: inline-block;font-size: 1rem;text-transform: uppercase;cursor: pointer;}
.gdpr-bar .right button {margin: 0.875rem auto;}
.gdpr-bar .left a {color: #fff;font-weight: 700;border-bottom: 1px dotted #FAF1E6;}
@media screen and (max-width: 900px) {
.gdpr-bar>div {display: block;}
.gdpr-bar .left {max-width: 100%;}
.gdpr-bar button {width: 100%;}
}

/*index*/
.flex-container {max-width: 1300px;margin: 0 auto;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-pack: distribute;justify-content: space-around;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.flex-item {position: relative;background: #fff;border: 1px solid #00A0DC;width: 23.5%;height: 370px;margin-top: 10px;padding-bottom: 5px;margin-bottom: 30px;}
.flex-item:hover{border: 1px solid #FEC130;-webkit-box-shadow: 0 0 0 2px #FEC130;box-shadow: 0 0 0 2px #FEC130;}
.flex-item .date{font-size: 0.75rem;padding: 0 22px 8px;color: #0F4C83;position: absolute;bottom: 0;line-height: 1.2;}  
.pic-item h2{padding: 0 22px;margin-top: 6px; font-size :20px;text-align: left;color: #194866;font-weight: 700;letter-spacing: 0.2px;line-height: 1.4;}
.pic-item img{display: block;width: 100%;min-height: 225px;max-height: 225px;-o-object-fit: cover;object-fit: cover;object-position: top;-o-object-position: top;}
.mb-pic img{display: none;}
.word-item h2{height: 150px;padding: 45px 22px 0px;font-size :20px;text-align: left;color: #194866;font-weight: 700;line-height: 1.4;word-break: break-all;}
.word-item .desc{display: block;padding: 0 22px;color: #646464;font-size: 0.875rem;text-align: left;}
.en h2{height: 160px;padding: 40px 22px 0px;font-size: 20px;text-align: left;color: #194866;font-weight: 700;line-height: 1.4;word-break: keep-all;}
#seachgrid h1{font-size: 30px;font-weight: bold; text-align: center;color: #00A0DC;margin-bottom: 50px;}
#seachgrid  h1 span{font-size: 30px;font-weight: bold; text-align: center;color:#004E98;margin-bottom: 50px;border-bottom: 1px solid #FEC130;}
.no-found{font-size: 45px;font-weight: bold; text-align: center;color:#004E98;margin-bottom:100px;}
@media screen and (max-width: 1280px) {
.word-item h2 {height: 165px;}
.en h2 {height: 165px;padding: 20px 22px 0px;}
}
@media screen and (min-width: 1023px) and (max-width: 1280px) {
  .flex-item {height: 400px;}
}
@media screen and (max-width: 1024px) {
  .flex-item {width: 48.5%;margin-bottom: 0px;}
  .word-item h2 {height: 140px;}
  .pic-item img{max-height: 230px;min-height: 230px;}
  .pic-item h2{line-height: 1.4;}
}
@media screen and (max-width: 768px) {
  .flex-container{margin-bottom: 0px;}
  .flex-item {width: 98%;height: 120px;border: none;border-bottom: 1px solid rgba(100, 100, 100, 0.2);}
  .flex-item:hover{ border: none; border-bottom: 1px solid rgba(100, 100, 100, 0.2);}
  .pic-item .flex-order{display: -webkit-box;display: -ms-flexbox;display: flex;}
  .pic-item .pic{-webkit-box-ordinal-group: 4;-ms-flex-order: 3;order: 3;}
  .pic-item .title{-webkit-box-ordinal-group: 2;-ms-flex-order: 1;order: 1;width: 100%;}
  .word-item .desc{display: none;}
  .flex-item h2{font-size: 1.2rem;padding: 0 15px 0 0;margin-top: 0px;}
  .flex-item .date{font-size: 0.9rem;padding: 0 15px 6px 0;line-height: 1.2;margin-right: 130px;}
  .word-item .date{margin-right: 0px;}
  #newsgrid .pic-item img, #seachgrid .pic-item img{width: 280px;min-height: 110px;max-height: 90px;max-width: 146px;}
  #seachgrid h1{font-size: 30px;font-weight: bold; text-align: center;color: #00A0DC;margin-bottom: 8px;margin-top: 10px;}
  .no-found {font-size: 35px;font-weight: bold;text-align: center;color: #004E98;margin: 30px;}
}
@media screen and (max-width: 480px) {
  .flex-item h2{font-size: 0.9rem;line-height: 1.4;}
  .flex-item .date{font-size: 0.75rem;}
  .flex-item .date span{padding: 0 15px 8px 0;}
  .flex-item {height: 110px;}
  #newsgrid .pic-item img, #seachgrid .pic-item img{width: 120px;min-height: 93px;}
}
@media screen and (max-width: 320px) {
#newsgrid .pic-item img, #seachgrid .pic-item img{width: 100px;min-height: 70px;max-height: 70px;}
.flex-item .date{font-size: 0.75rem;}
.flex-item .date span {padding: 0 15px 3px 0;}
}

/*頁碼*/
.pagination {list-style: none;display: block;padding: 0;margin-top: 20px;margin-bottom: 20px;}
.pagination ul{text-align: center;}
.pagination li {display: inline-block;text-align: center;}
.pagination a {float: left;display: block;font-size: 1rem;text-decoration: none;padding: 5px 12px;color: #646464;margin-left: -1px;border: 1px solid transparent;line-height: 1.5;}
.pagination a.active {cursor: default;}
.pagination a:active {outline: none;}
.pagination ul a {margin-left: 3px;padding: 0;width: 35px;height: 35px;line-height: 30px;border-radius: 100%;}
.pagination ul a:hover {color: #00A0DC;}
.pagination ul a.active, .pagination ul a:active {color: #00A0DC;}
.pagination .prev, .pagination .next{background-color: #E0E0E0;}
.pagination .prev:hover, .pagination .next:hover{background-color: #00A0DC;color: #fff;}
.pagination  .icon-icon_shape:before, .pagination .icon-icon_shape-left:before {color: #646464;padding: 12px;font-size:0.75rem;}
.pagination  .icon-icon_shape:hover:before, .pagination .icon-icon_shape-left:hover:before {color: #fff;}

.pagination span {float: left;display: block;font-size: 1rem;text-decoration: none;padding: 5px 12px;color: #646464;margin-left: -1px;border: 1px solid transparent;line-height: 1.5;}
.pagination span.active {cursor: default;}
.pagination span:active {outline: none;}
.pagination ul span {margin-left: 3px;padding: 0;width: 35px;height: 35px;line-height: 30px;border-radius: 100%;}
.pagination ul span:hover {color: #00A0DC;}
.pagination ul span.active, .pagination ul span:active {color: #00A0DC;}


@media screen and (max-width: 480px) {
  .pagination .icon-icon_shape:before, .pagination .icon-icon_shape-left:before {padding: 8px;}
  .pagination ul a {margin-left: 2px;padding: 0;width: 26px;height: 26px;line-height: 20px;border-radius: 100%;}
  .pagination ul span {margin-left: 2px;padding: 0;width: 26px;height: 26px;line-height: 20px;border-radius: 100%;}
}
/*inpage*/
/*麵包*/
.breadcrumb {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;padding: 24px 0 0;margin-bottom:20px;list-style: none;font-size: 1rem;}
.breadcrumb-item.active {color: #0F4C82;}
.breadcrumb-item+.breadcrumb-item {padding-left: .5rem;}
.breadcrumb-item+.breadcrumb-item::before {float: left;padding-right: .5rem;color: #6c757d;content: var(--bs-breadcrumb-divider, "/");}
.article-content{width: 1200px;margin: 0 auto 50px; display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;}
@media screen and (max-width: 1280px) {.article-content {width:95%;}}
.leftSide{width: 25%;margin-top: 230px;margin-right: 80px;}
.about-content .leftSide{width: 24%;margin-top: 200px;margin-right: 80px;}
.leftSide h2{font-size: 1.125rem;text-align: justify;color: #646464;}
.leftSide .column-title {margin-top: 50px;font-size: 1.25rem;font-weight: bold;color:#006EAA;line-height: 1.5;border-top: 3px solid #006EAA;padding-bottom: 8px;padding-top: 5px;}
.leftSide .share-title{font-size: 1rem;color: #646464;margin-bottom: 12px;}
.leftSide .order-list li { margin-bottom: 16px;border-bottom: 1px solid #cdcdcd;padding-bottom: 8px;}
.leftSide li a:hover{color: #006EAA;}
.share ul li{display: inline-block;}
.socialshare span{font-size: 2rem;cursor:pointer;}
.share .publish_link{margin-top: 20px; }
.share .publish_link li{margin-right: 4px;}
.article-content article, .about-content .rightSide{width: 62%;}
.article-content article h1 ,.about-content article h1{font-size: 2.25rem;text-align: left;font-weight: bold;letter-spacing: 0.2px;margin-bottom: 10px;color: #0F4C82;line-height: 1.4;}
.updatetimes{float: left;font-size: 0.875rem;line-height: 1.4;color: #646464;}
article p{text-align: left;margin-bottom: 30px;color: #3C4041;font-size:18px; line-height:1.8;}
article strong{margin:8px 0;color: #3C4041;font-size: 1.125rem;}
article img{max-width: 100%;margin-top: 20px;}
article figcaption{margin-bottom: 20px;font-size: 0.9rem;color: #646464;clear: both;}
article figcaption:after {content: '';display: block;width: 75px;height: 2px;background-color: #FEC130;margin-top: 5px;}
article figure{clear: both;}
article p a:link {color: #006EAA;}
#article p a{font-weight: bold;border-bottom: 1px solid #006EAA;color: #006EAA;word-break: break-all;}
.links{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;margin-top: 20px;margin-bottom: 10px;}
.link-title{width: 16%;}
.link-title {font-size: 1.25rem;font-weight: bold;color: #006EAA;line-height: 1.5;border-top: 3px solid #006EAA;padding-bottom: 8px;margin-right: 30px;margin-top: 6px;padding-top: 5px;}
.links .link-list{width: 100%;margin-left: 5%;}
.links ul li{  font-size: 1rem;  list-style-type: disc;color: #646464;  border-bottom: 1px solid #cdcdcd; padding: 12px 0;}
.links ul li:first-child{padding: 0 0 12px 0;}
.links ul li a:hover, .links ul li:hover{color: #006EAA;}

@media screen and (max-width: 1280px) {
  .article-content {width:95%;}
  .link-title {width: 18%;}
}
@media screen and (max-width: 1024px) {
  .leftSide{width: 25%;margin-right: 10%;}
  .link-title {width: 22%;}
  .socialshare span {font-size: 1.75rem;}
}
@media screen and (max-width: 900px) {
  .mb-article{display: none;}
  .article-content,.about-content{width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;margin-top: 65px;}
  .leftSide{-webkit-box-ordinal-group: 3;-ms-flex-order: 2;order: 2;width: 100%;margin-top:0px;}
  /*.leftSide .order-list{margin-bottom: 80px;}*/
  .about-content .leftSide{display: none;}
  #article{-webkit-box-ordinal-group: 2;-ms-flex-order: 1;order: 1;width: 100%;}
  .links{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;margin-top: 50px;margin-bottom: 60px;}
  .link-title {font-size: 1.25rem;padding-bottom: 8px;margin-right: 0px;}
  .link-title{width: 100%;}
  .links .link-list{margin-left: 2%; width: 98%;}
  .article-content article h1 ,.about-content article h1{font-size: 1.5rem;margin-bottom: 30px;line-height: 1.4;}
  article img{width: 100%;margin-top: 20px;}
}
@media screen and (max-width: 768px) {
  .breadcrumb {padding: 24px 0 0;margin-bottom: 1.25rem;font-size: 0.875rem;}
  .leftSide .order-list a{font-size: 1rem;}
  .leftSide .column-title {font-size: 1.125rem;}
  .links ul li {font-size: 1rem;}
  .links .link-list ul{width: 98%;margin-left: 0.85%;}
  .article-content article h1 ,.about-content article h1{font-size: 1.5rem;margin-bottom: 8px;line-height: 1.4;}
  .updatetimes {font-size: 0.875rem;padding-top: 8px;color: #646464;}
  article p{font-size: 1.1rem; line-height: 1.6;margin-bottom: 30px;color: #3C4041;clear: both;}
  article figcaption {margin-bottom: 20px;font-size: 0.9rem;}

}
@media screen and (max-width: 480px){
 .links .link-list ul {width: 96%;margin-left: 2.85%;}
}

/*about*/
.about-content{display: -webkit-box;display: -ms-flexbox;display: flex;width: 1000px;margin: 0 auto;}
.about-content h2{font-size: 1.5rem;margin: 10px auto;font-weight: 600;color: #3C4041;}
.about-content article{margin-bottom: 50px;}
.about-content article p a{color: #006EAA;font-weight: bold; border-bottom: 1px solid #006EAA;word-break: break-all;}
.about-content article ul{margin: -10px 0px;}
.about-content article ul li{font-size:18px; line-height:1.8;}
.about-content article .part{font-size:18px; line-height:1.8;margin:-24px 0 20px;}
.about-content article .download a{font-size:18px;font-weight: 600;color: #006EAA;}
.about-content article span{color: #006EAA;}
article .warn{background-color: #FEC130;border: none;color: #194866;padding: 0.2rem 0.8rem;font-size: 18px;font-weight: 700;text-align: center;text-decoration: none;display: inline-block;margin-bottom: 10px;}
#navi {list-style: none;display: block;}
#navi li {display: block;line-height: 0;background: none;font-size:1.25rem;color: #006EAA;font-weight: bold;cursor: pointer;margin-bottom: 50px;}
#navi a{ color: #006EAA;padding-left: 10px;} 
#navi img {width: 18px;display: inline-block;margin-left: 10px;}
#navi li a:hover{color: #3BB6D5;}
#navi li a:link {border:none;}
#navi li a:visited {border:none;}
#navi li a:active {border:none;}
#navi li:hover{border-left:3px solid #FEC130;}
#navi .current {border-left:3px solid #FEC130;}
#navi .current a {color: #3BB6D5;}
#navi li  span{display: inline-block;}

@media screen and (max-width: 1280px) {.about-content {width:95%;}}
@media screen and (max-width: 900px) { .about-content  .leftSide {display: none;}.about-content .rightSide{width: 100%}.about-content {margin-top: 65px;}}
@media screen and (max-width: 768px) { .about-content h2 {font-size: 1.25rem;}.about-content article .part {font-size: 1rem;}.about-content article .download a{font-size:1rem;}}