@charset "utf-8";
@import url("/tw/css/ugc_animation.css");
/*思源黑體*/
@font-face {
  font-family:'NotoSansCJKtc-Thin.otf';
  src:local('NotoSansCJKtc-Thin'),
       local('NotoSansCJKtc-Thin'),
       url('NotoSansCJKtc-Thin.otf') format('opentype');
}
@font-face {
  font-family:'NotoSansCJKtc-Regular';
  src:local('NotoSansCJKtc-Regular'),
       local('NotoSansCJKtc-Regular'),
       url('NotoSansCJKtc-Regular.otf') format('opentype');
}
@font-face {
  font-family:'NotoSansCJKtc-Bold';
  src:local('NotoSansCJKtc-Bold'),
       local('NotoSansCJKtc-Bold'),
       url('NotoSansCJKtc-Bold.otf') format('opentype');
}

/*=====================全域屬性======================*/
*, *:before, *:after { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box;}
html, body { padding:0; margin:0; overflow-x:hidden;}
html {
/*針對 Safiri Mobile 旋轉時自動放大做的調整*/
-webkit-text-size-adjust: 100%;
font-size:1.25rem; line-height:1.6;}
html.Font-Small {font-size:1rem; line-height:1.25rem;}
html.Font-Medium {font-size:1.25rem; line-height:1.5rem;}
html.Font-Large {font-size:1.5rem; line-height:1.75rem;}
body { font-family:'Arial','Helvetica','NotoSansCJKtc-Regular','微軟正黑體', sans-serif;}
body *[lang="en"] { letter-spacing:1px;}
body > form { display:block; width:100%; height:auto; overflow:hidden; margin:0 auto;}

/*Icon 動畫預設*/
i { color:rgba(255,255,255,1); -webkit-transition:all .5s, -webkit-transform .5s; transition:all .5s, transform .5s;}
i:before { display:block; width:100%; height:auto; overflow:hidden; line-height:1.5rem; padding:1.125rem; text-align:center; font-size:1.5rem; }

a:link, a:visited, a:hover, a:active { color:#004d72}

/*-----START : 麵包屑-----*/
ul.breadcrumb { display:none;}
/*-----END : 麵包屑-----*/

/*-----START : pagination-----*/
.pagination { width:100%; height:auto; overflow:hidden;}
.pagination * { padding:0; margin:0; list-style:none; text-decoration:none;}
.pagination > * { width:100%; height:auto; overflow:hidden;
/*flex*/-webkit-flex-display:flex; display: flex;justify-content:flex-start;flex-wrap:wrap;}
.pagination > * > * { display:inline-block; width:auto; min-width:2rem; height:auto; overflow:hidden; float:left; margin-right:5px; text-align:center; line-height:calc(2rem - 2px); margin-bottom:5px;}
.pagination > * > * > * { display:block; width:100%; height:auto; overflow:hidden; text-align:center; line-height:calc(2rem - 2px); border:1px solid rgba(0,0,0,0.1); white-space:nowrap; padding:0 10px;
/*圓角*/
border-radius:5px;}
.pagination > * > a:link,
.pagination > * > a:visited { color:rgba(0,0,0,0.6); text-decoration:none;}
.pagination > * > a:hover,
.pagination > * > a:active { color:rgba(0,0,0,0.8); text-decoration:none;}
.pagination > * > *.active { color:rgba(0,0,0,1); border:1px solid rgba(0,0,0,0.6);
/*圓角*/
border-radius:5px;}

.PageContent-Right .PageArticle > .pagination:first-of-type { margin-top:1em;}
.PageContent-Right .PageArticle > .pagination:last-of-type { margin-bottom:1em;}

/*-----END : pagination-----*/

.Wrapper { width:100%; height:auto; overflow:hidden; margin:0 auto; margin-top:0.1px; padding-top:115px;}
.DivW1280 { width:100%; max-width:calc(64rem + 1rem); padding:0 0.5rem; height:auto; margin:0 auto;}
.PageArticle * { word-wrap:break-word;}
div.NoData { width:100%; height:auto; overflow:hidden; margin-bottom:1rem; text-align:center;}
.PageArticle .social-network-share { margin-bottom:0.5rem;}
.PageArticle table { max-width:100%;}

.PageArticle table.Table { border-top:1px solid #ccc; border-left:1px solid #ccc;}
.PageArticle table.Table.table-w-100p{ width:100%;}
.PageArticle table.Table th,
.PageArticle table.Table td { padding:10px; border-right:1px solid #ccc; border-bottom:1px solid #ccc; font-weight:normal;}
.PageArticle table.Table tr.title th,
.PageArticle table.Table tr.title td { background:#004d72; color:white;}

.PageArticle .editor-content table.Table { margin-bottom:40px;}

/*law-doc*/
.law-doc { line-height:1.8;}
.law-doc dl dt { color:#004d72; font-weight:bold; margin-bottom:0.5em;}
.law-doc dl dd { font-size:0.9em; color:#333; margin-bottom:1em;}
.law-doc dl dd ol,
.law-doc dl dd ul { margin:0; padding-left:4em;}

/*企業社會責任報告書 搜尋按鈕*/
.search-box { display:block; width:100%; max-width:300px; height:auto; overflow:hidden; margin:0 auto; border:1px solid rgb(235,235,235);
border-radius:15px; margin-bottom:1em;}
.search-box > span { display:block; width:calc( 100% - 80px ); height:40px;float:left;}
.search-box > span input { width:100%; height:40px; line-height:30px; float:left; padding:5px 10px; border:0; outline:none; font-size:1em;}
.search-box > a { display:block; width:80px; height:40px; line-height:40px; text-align:center; background:#004d72; float:right; color:white; font-size:1em; text-decoration:none; transition:all .5s;}
.search-box > a:link,
.search-box > a:visited { background:#004d72;}
.search-box > a:hover,
.search-box > a:active {  background:#ae9249;}

.wp-filter { width:100%; padding:0.5em;
 display:flex; flex-wrap:wrap; justify-content:center;}
.wp-filter select { font-size:1em; padding:0.5em 1em; border:1px solid #ccc;
/*圓角*/
border-radius:10px;}

/*=====================Header======================*/
.Header { width:100%; height:auto; background:rgb(240,240,240); top:0; left:0; z-index:3; position:fixed; border-bottom:3px solid #ae9249;
/*基礎動畫設定*/
transition:height .5s;}
.Header *:not(.DivW1280) { padding:0; margin:0; list-style:none; text-decoration:none;}
.Header .DivW1280 { width:100%; max-width:none; height:115px; padding:30px;
/*基礎動畫設定*/
transition:height .5s, padding .5s;}

/*no-scroll*/
.no-scroll .Header .DivW1280 {transition:none;}

/*Logo*/
.Header .Logo { display:inline-block; width:auto; height:auto; overflow:hidden; float:left;}
.Header .Logo a { display:inline-block; width:auto; height:auto; overflow:hidden; float:left;}
.Header .Logo a img { display:block; max-width:100%; height:55px; float:left;}
.Header .Logo a + .Logo { display:none;}

/*Nav*/
.Nav { width:calc( 100% - 230px ); height:60px; float:left;}
.Nav * { padding:0; margin:0; list-style:none; text-decoration:none;}
.Nav > ul { width:100%; float:left;}
.Nav > ul > li { width:calc( 100% / 44 * 5 ); float:left; font-size:23px; position:relative;}
.Nav > ul > li:nth-child(2) { width:calc( 100% / 44 * 4 );}
.Nav > ul > li:nth-child(5) { width:calc( 100% / 44 * 4 );}
.Nav > ul > li:nth-child(8) { width:calc( 100% / 44 * 6 );}
.Nav > ul > li:nth-child(9) { width:calc( 100% / 44 * 5 );}
.Nav > ul > li > a { display:block; width:100%; font-size:0.9em; height:60px; line-height:60px; text-align:center; position:relative;
/*基礎動畫設定*/
transition:all .5s;}
.Nav > ul > li > a:link,
.Nav > ul > li > a:visited { color:#003959;}
.Nav > ul > li:hover > a:link,
.Nav > ul > li:hover > a:visited,
.Nav > ul > li:hover > a:hover,
.Nav > ul > li:hover > a:active { color:#ae9249;}
.Nav > ul > li > a:after { content:''; position:absolute; width:30px; height:30px; top:15px; right:50%; margin-right:-77.5px; background:url(/tw/Images/Layout/arrow_down.png) center center no-repeat; background-size:contain;}
.Nav > ul > li:nth-child(5) > a:after { margin-right:-57.5px;}
.Nav > ul > li:nth-child(8) > a:after { margin-right:-87.5px;}
.Nav > ul > li:hover > a:after { background:url(/tw/Images/Layout/arrow_up.png) center center no-repeat; background-size:contain;}
.Nav > ul > li:nth-child(2) > a:after,
.Nav > ul > li:nth-child(9) > a:after{ display:none;}

.Nav > ul > li > a + .sub-menu { display:inline-block; width:0; height:0; overflow:hidden; position:absolute; top:70px; left:0; opacity:0; min-width:100%; background:white; box-shadow: 2px 2px 8px 4px rgba(0, 0, 0, 0.1); padding:0 5px;
/*基礎動畫設定*/
transition:top .5s, opacity .5s;
/*圓角*/
border-radius:10px;}
.Nav > ul > li:hover > a + .sub-menu { width:auto; height:auto; top:60px; opacity:1;  padding:10px 5px;}
.Nav > ul > li:nth-child(8):hover > a + .sub-menu { width:300px;}
.Nav > ul > li > a + .sub-menu > li { width:100%; height:auto; overflow:hidden; float:left; padding:0 5px;}
.Nav > ul > li > a + .sub-menu > li a { display:block; width:100%; height:auto; overflow:hidden; float:left; white-space:nowrap; font-size:18px; padding:5px 10px;
/*基礎動畫設定*/
transition:all .5s;
/*圓角*/
border-radius:10px;}
.Nav > ul > li > a + .sub-menu > li a:link,
.Nav > ul > li > a + .sub-menu > li a:visited { color:#333;}
.Nav > ul > li > a + .sub-menu > li a:hover,
.Nav > ul > li > a + .sub-menu > li a:active { color:#333; background:#f5d942;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li { width:calc( 50% - 5px );}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li:nth-child(1) { margin-right:10px;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a { font-size:20px; border-bottom:3px solid #ae9249; margin-bottom:10px;
/*圓角*/
border-radius:0;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a:link,
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a:visited { color:#ae9249;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a:hover,
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a:active { color:#ae9249; background:none;}

/*TopMenu*/
.Header .TopMenu { display:block; width:42px; height:auto; overflow:hidden; float:left; padding:0; margin:9px 0;}
.Header .TopMenu .Menu { display:block; width:100%; height:auto; overflow:hidden; float:left; padding:0; margin:0;}
.Header .TopMenu .Menu > li { display:block; width:100%; height:auto; overflow:hidden; float:left; padding:0; margin:0;}
.Header .TopMenu .Menu > li a { display:block; width:100%; height:40px; line-height:40px; overflow:hidden; float:left; padding:0; margin:0; font-size:20px; font-weight:bold; border:1px solid #ae9249; text-align:center;
/*基礎動畫設定*/
transition:all .5s;
/*圓角*/
border-radius:100%;}
.Header .TopMenu .Menu > li a:link,
.Header .TopMenu .Menu > li a:visited { color:#ae9249;}
.Header .TopMenu .Menu > li a:hover,
.Header .TopMenu .Menu > li a:active { background:#ae9249; color:white;}


/*下拉時*/
.WrapperFixed { padding-top:80px;}
.WrapperFixed .Header { height:80px;}
.WrapperFixed .Header .DivW1280 { padding:10px 30px; height:80px;}


.access-key-b{ display:none;}

/*-----START : footer-----*/
.Footer { display:block; width:100%; height:auto; overflow:hidden; background:#ededed; border-top:3px solid #ae9249; position:relative;}
.Footer .uGear { position:absolute; font-size:0.6em; right:10px; bottom:0; text-decoration:none; padding-top:40px; width:110px; padding-top:0; width:100%; text-align:center;
/*基礎動畫設定*/
transition:all .5s;
body { font-family:'NotoSansCJKtc-Regular', sans-serif;}}
.Footer .uGear:link,
.Footer .uGear:visited { color:rgba( 255,255,255,0.2); background:url(/tw/Images/Layout/uGear/truste_Ugear.png) top center no-repeat; background:none;}
.Footer .uGear:hover,
.Footer .uGear:active { color:rgba( 255,255,255,0.6); background:url(/tw/Images/Layout/uGear/truste_Ugear_o.png) top center no-repeat; background:none;}
.Footer .DivW1280 { max-width:none; padding:0;}
.Footer .DivW1280  > div.SiteMap { padding:60px; padding-left:300px; position:relative;}
.Footer .DivW1280  > div.SiteMap:before { content:''; display:block; width:300px; height:100%; position:absolute; top:0; left:0; background:url(/tw/uPhoto/HomeImg/202306191642_549627.png) center center no-repeat; background-size:auto 55px;}
.Footer .SiteMap { width:100%; height:auto; overflow:hidden; float:left;
/*flex*/
display: flex; 
justify-content:space-between;}
.Footer .SiteMap * { padding:0; margin:0; list-style:none; text-decoration:none;}
.Footer .SiteMap a { display:inline-block; overflow:hidden; line-height:20px; white-space:nowrap;
/*基礎動畫設定*/
transition:all .5s;}

.Footer .SiteMap dt { font-size:20px; font-weight:bold; margin-bottom:20px;}
.Footer .SiteMap dt a:link,
.Footer .SiteMap dt a:visited { color:#003959;}
.Footer .SiteMap dt a:hover,
.Footer .SiteMap dt a:active { color:#ae9249;}
.Footer .SiteMap dd { font-size:16px;}
.Footer .SiteMap dd a { line-height:20px;}
.Footer .SiteMap dd a:before { content:''; display:block; width:20px; height:20px; float:left; margin-right:0; background:url(/tw/Images/Layout/arrow_left.png) center center no-repeat; background-size:20px auto;}
.Footer .SiteMap dd a:link,
.Footer .SiteMap dd a:visited { color:#5a5655;}
.Footer .SiteMap dd a:hover,
.Footer .SiteMap dd a:active { color:#ae9249;}

.Footer .Copyright { width:100%; height:auto; overflow:hidden; padding:30px 10px;
background-image: linear-gradient(90deg, rgba(187, 167, 113, 1) 0%, rgba(132, 116, 72, 1) 100%);}
.Footer .Copyright * { padding:0; margin:0; list-style:none; text-decoration:none; font-size:18px;}
.Footer .Copyright .content-text { width:100%; height:auto; overflow:hidden;}
.Footer .Copyright .content-text a:link,
.Footer .Copyright .content-text a:visited,
.Footer .Copyright .content-text a:hover,
.Footer .Copyright .content-text a:active { color:white;}
.Footer .Copyright .content-text > * { width:100%; height:auto; overflow:hidden; display:flex; flex-wrap:wrap; justify-content:center; color:white;}
.Footer .Copyright .content-text > * * { display:inline-block; width:auto; height:auto; overflow:hidden; padding:0 10px;}
.Footer .Copyright .content-text > .web-info { margin-bottom:10px;}
.Footer .Copyright .content-text > span span { position:relative; padding-left:30px; height:30px; line-height:30px;}
.Footer .Copyright .content-text > span span:before { content:''; display:block; width:30px; height:30px; position:absolute; top:0; left:0;}
.Footer .Copyright .content-text > span span.add:before { background:url(/tw/Images/Layout/i_add.png) center center no-repeat; background-size:contain;}
.Footer .Copyright .content-text > span span.tel:before { background:url(/tw/Images/Layout/i_tel.png) center center no-repeat; background-size:contain}
.Footer .Copyright .content-text > span span.fax:before { background:url(/tw/Images/Layout/i_fax.png) center center no-repeat; background-size:contain}

/*-----END : footer-----*/

.gotop { position:fixed; z-index:99; right:10px; bottom:-60px; display:block; width:50px; height:50px; color:#fff; background:#003959; line-height:50px; border-radius:50%;
transition:all 0.5s;
text-align: center;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);}
.gotop:hover{ background:#ae9249;}
.gotop a { display:block; width:50px; height:50px; text-indent:-99999px; overflow:hidden; float:left; border-radius:50%; background:url(../Images/Layout/arrow_up_w.png) center center no-repeat; background-size:60%;}
.WrapperFixed .gotop { bottom:10px;}
/*===============================================================Layout===============================================================*/

.banner img { display:block; max-width:100%; height:auto; float:left;}
.top-banner img { display:block; max-width:100%; height:auto; float:left;}

/*內頁開始*/
.Content { width:100%; height:auto; overflow:hidden;}
.Content .FontSize { position:absolute; width:150px; height:auto; line-height:1rem; overflow:hidden; top:0.5rem; right:0; color:rgba(0,0,0,0.5); font-size:0.75rem;}
.Content .FontSize * { float:left; color:rgba(0,0,0,1);}
.Content .FontSize a { display:block; width:20px; height:20px; line-height:18px; overflow:hidden; float:left; margin-right:5px; border:1px solid rgba(0,0,0,1); text-align:center; font-size:0.5rem; color:rgba(0,0,0,1); text-decoration:none;}
.Content .FontSize a:last-child { margin-right:0;}
.Content .FontSize a.active { background:yellow;}


.Content .Ani-Content { width:100%; height:auto; overflow:hidden; max-width:64rem; margin:0 auto;}
/**=====================ContentHeader 內文標題*=====================*/
.Content .Ani-Content .ContentHeader { width:100%; height:auto; overflow:hidden; position:relative; margin:0 auto; margin-bottom:20px; max-width:1300px; padding:0;}
.Content .Ani-Content .ContentHeader * { padding:0; margin:0; list-style:none; text-decoration:none;}
.Content .Ani-Content .ContentHeader p { width:100%; height:auto; overflow:hidden; text-align:left; font-size:0.75rem; margin-bottom:10px;}
.Content .Ani-Content .ContentHeader p > * { display:inline-block; padding:0 2.5px; color:rgba(0,0,0,.5);}
.Content .Ani-Content .ContentHeader > div { width:100%; height:auto; overflow:hidden; position:relative; padding-right:7rem;}
.Content .Ani-Content .ContentHeader > div h2 { width:100%; height:auto; overflow:hidden; font-size:2rem; line-height:2rem; text-align:left; font-weight:normal; position:relative; padding-bottom:1rem; color:rgba(0,0,0,.7);}
.Content .Ani-Content .ContentHeader > div h2:before { content:''; display:block; width:3rem; height:.25rem; overflow:hidden; left:0; bottom:0; background:rgba(85,195,240,1); position:absolute;}


/*PageWrapper-Side*/
.PageWrapper-Side { width:100%; height:auto; overflow:hidden; padding:40px; margin:0 auto;}

/*PageMenu*/
.PageMenu { width:100%; height:auto; overflow:hidden; display:flex; flex-wrap:wrap; max-width:1280px; margin:0 auto;
justify-content:center;}
.PageMenu * { padding:0; margin:0; list-style:none; text-decoration:none;}
.PageMenu > h2 { text-align:center; font-size:38px; display:inline-block; width:auto; height:auto; overflow:hidden; margin:20px auto; padding:10px; position:relative; color:#847348; font-family:'Arial','Helvetica','NotoSansCJKtc-Thin','微軟正黑體', sans-serif; font-weight:normal;}
.PageMenu > h2:after { content:''; display:block; width:100%; height:5px;background-image: linear-gradient(90deg, rgba(187, 167, 113, 1) 0%, rgba(132, 116, 72, 1) 100%); position:absolute; left:0; bottom:0;}
.PageMenu > h2 + * { display:block; width:100%;}
.slide-menu { width:100%; height:auto; overflow:hidden;}
.slide-menu > ul { width:100%; height:auto; overflow:hidden; padding:0; margin:0; list-style:none;
/*flex*/
display: flex;
flex-wrap:wrap;
justify-content:center;}
.slide-menu > ul li { width:auto; height:auto; overflow:hidden; position:relative; float:left; margin:0 5px;}
/*.slide-menu > ul li:only-child { display:none;}*/
.slide-menu > ul li a { display:block; width:100%; height:100%; position:relative; overflow:hidden; padding:10px; text-align:center; font-size:0.9em;
/*基礎動畫設定*/
transition:all .5s;
border-radius:5px 5px 0 0;
/*flex*/
display: flex;
align-items: center;
justify-content:center;
flex-wrap:wrap;}
.slide-menu > ul li a:link,
.slide-menu > ul li a:visited { color:#847348; border:1px solid #eee; border-bottom:0;}
.slide-menu > ul li a:hover,
.slide-menu > ul li a:active { background:#847348; color:white; border:1px solid #847348; border-bottom:0;}

.slide-menu > ul li.active a:link,
.slide-menu > ul li.active a:visited,
.slide-menu > ul li.active a:hover,
.slide-menu > ul li.active a:active { background:#004d72; color:white; border:1px solid #847348; border-bottom:0;}

/*PageContent-Right*/
.PageContent-Right { width:100%; height:auto; overflow:hidden; margin:0 auto; padding:20px;
box-shadow: 2px 2px 8px 4px rgba(0, 0, 0, 0.1);}
.PageContent-Right .PageArticle { width:100%; height:auto; overflow:hidden; margin:0 auto; padding:0 60px;}
.PageContent-Right .PageArticle img { max-width:100%; height:auto;}
.PageWrapper-Side .PageContent-Right { padding:0; /*min-height:12rem;*/ max-width:1280px;}

/*-----START : page title-----*/
.page-title-wrapper { width:100%; height:auto; overflow:hidden; margin:0 auto; display:flex; flex-wrap:wrap;
justify-content:center;}
.page-title-wrapper * { padding:0; margin:0; list-style:none; text-decoration:none;}
.page-title { text-align:center; font-size:38px; display:inline-block; width:auto; height:auto; overflow:hidden; margin:60px auto; margin:20px auto; padding:10px 20px; position:relative; color:#847348; font-family:'Arial','Helvetica','NotoSansCJKtc-Thin','微軟正黑體', sans-serif; font-weight:normal;}
.page-title:after { content:''; display:block; width:100%; height:5px;background-image: linear-gradient(90deg, rgba(187, 167, 113, 1) 0%, rgba(132, 116, 72, 1) 100%); position:absolute; left:0; bottom:0;}
/*-----END : page title-----*/

.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper { justify-content:flex-start; padding:0 60px;}
.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper .page-title { text-align:left; padding-left:0; margin:20px 0;}

.Audio { position:relative; width:300px!important; height:auto; overflow:hidden;}
.Audio:after { content:''; display:block; width:40px; height:40px; overflow:hidden; position:absolute; top:50%; margin-top:-20px; right:10px; background:#f1f3f4; z-index:999999999;
/*圓角*/border-radius:100%;}

/*===============================================================UI===============================================================*/

/*===============================================================各類型區塊===============================================================*/
/*list-data*/
.list-data { width:100%; height:auto; overflow:hidden; margin:0 auto; margin-bottom:1rem;}
.list-data * { padding:0; margin:0; list-style:none; text-decoration:none;}
.list-data > ul { width:100%; height:auto; overflow:hidden;
/*flex*/
-webkit-flex-display:flex; display: flex;
flex-wrap:wrap;}
.list-data li  {  height:auto; overflow:hidden; float:left; margin-bottom:1rem; font-size:0.7rem;}
.list-data li > a { display:block; width:100%; height:auto; overflow:hidden;}
.list-data li > a:link,
.list-data li > a:visited { color:rgba(0,0,0,.7);}
.list-data li > a:hover,
.list-data li > a:active { color:rgba(0,0,0,.9);}
.list-data li span { display:block; width:100%; height:auto; overflow:hidden; float:left;}
.list-data li span.photo {
/*flex*/
-webkit-flex-display:flex; display: flex; 
-webkit-align-items: center; align-items: center; 
-webkit-justify-content:center;justify-content:center;}
.list-data li span.photo img { display:block; width:100%; height:auto; float:left;
/*圓角*/border-radius:0.5rem;}
.list-data li span.title { display:block; width:100%; height:auto; overflow:hidden; padding:0.5rem 0; padding-bottom:0;  font-size:1rem; line-height:1.2rem; float:left;}
.list-data li > span.date { display:block; width:100%; height:auto; overflow:hidden; padding:0; opacity:0.5;}
.list-data.col-4 li:nth-child(4n+4){ margin-right:0;}
.list-data.col-4 li {width:24%; margin-right:1.33%;}

.list-data.sub-list-data { padding:10px; margin-bottom:0;
/*flex*/
display: flex;
flex-wrap:wrap;
justify-content:center;}
.list-data.sub-list-data li { display:inline-block; width:auto; height:auto; overflow:hidden; margin:5px; float:left;}
.list-data.sub-list-data li a { display:inline-block; width:auto; height:auto; overflow:hidden; padding:10px; text-align:center; border:1px solid #ccc; font-size:1.2em; float:left;
/*基礎動畫設定*/
/*圓角*/
border-radius:10px 0 10px 0;
transition:all .5s;}
.list-data.sub-list-data li a:hover,
.list-data.sub-list-data li a:active { color:#847348; border:1px solid #847348;}
.list-data.sub-list-data li.active a:link,
.list-data.sub-list-data li.active a:visited,
.list-data.sub-list-data li.active a:hover,
.list-data.sub-list-data li.active a:active{ background:#847348; color:white; border:1px solid #847348;}
.PageWrapper-Side-Side + .PageContent-Right .list-data.sub-list-data + .page-title-wrapper .page-title { margin-top:30px;}

/*營收資訊 自結盈餘 財務報表 法人說明會 股東會資料 股利資訊*/
.list-data.col-1 { margin-bottom:1em;}
.list-data.col-1 > ul { padding:0; margin:0;}
.list-data.col-1 > ul > li { width:100%; position:relative; padding-bottom:8px; border:1px solid rgb(235,235,235); font-size:1em; margin-bottom:1em;
/*圓角*/
border-radius:15px;
/*flex*/
display: flex;
flex-wrap:wrap;
justify-content:space-between;}
.list-data.col-1 > ul > li:last-child { margin-bottom:0;}
.list-data.col-1 > ul > li:before { content:''; display:block; width:100%; height:0; opacity:0; position:absolute; left:0; bottom:0; z-index:0; background:#f5d83e;
transition:all .5s;}
.list-data.col-1 > ul > li:hover:before { height:100%; opacity:1;}
.list-data.col-1 > ul > li:after { content:''; display:block; width:100%; height:8px; position:absolute; left:0; bottom:0; z-index:0; background:#ae9249;}
.list-data.col-1 > ul > li > * { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; white-space:nowrap; margin:0; padding:5px 10px; position:relative; z-index:1;}
.list-data.col-1 > ul > li span.title { width:auto; padding:10px; line-height:1.5em; height:auto; font-size:1em;
transition:all .5s;}
.list-data.col-1 > ul > li:hover span.title { color:#014c6f;}
.list-data.col-1 > ul > li span.download { max-width:60%;}
.list-data.col-1 > ul > li span.download:empty { display:none;}
.list-data.col-1 > ul > li span.download .file-list { width:auto; height:auto; overflow:hidden; padding:0; margin:0; float:right;
/*flex*/
display:inline-flex;
flex-wrap:wrap;
justify-content:flex-end;}
.list-data.col-1 > ul > li span.download .file-list > li { display:inline-block; width:auto; height:auto; overflow:hidden; margin:5px 0; font-size:1em; line-height:1.5em; margin-right:10px;}
.list-data.col-1 > ul > li span.download .file-list > li > a { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; position:relative; padding-left:2em; color:#014c6f;}
.list-data.col-1 > ul > li span.download .file-list > li > a:link,
.list-data.col-1 > ul > li span.download .file-list > li > a:visited { color:#014c6f;}
.list-data.col-1 > ul > li span.download .file-list > li > a:hover,
.list-data.col-1 > ul > li span.download .file-list > li > a:active { color:#ae9249;}
.list-data.col-1 > ul > li span.download .file-list > li > a:before { content:''; display:block; width:1.5em; height:1.5em; position:absolute; top:0; left:0; background:url(/tw/Images/Layout/down.png) center center no-repeat; background-size:contain;}
.list-data.col-1 > ul > li span.download .file-list > li > a:hover:before,
.list-data.col-1 > ul > li span.download .file-list > li > a:active:before{ background:url(/tw/Images/Layout/down_o.png) center center no-repeat; background-size:contain;}

.list-data.col-1 > ul > li.header { display:none;}

/*最新消息*/
.list-data.col-1.news > ul > li > a { padding:0; display:block; width:100%; padding-right:120px; white-space:normal;}
.list-data.col-1.news > ul > li > .date { position:absolute; top:0.25em; right:0;}
.list-data.col-1.news > ul > li span.photo { display:none;}

/*公司治理*/
.list-data.col-1.Governance { margin-top:1em;}
.list-data.col-1.Governance > ul > li > a { padding:0; display:block; width:100%;}
.list-data.col-1.Governance > ul > li.li-download > a { padding-right:50%;}
.list-data.col-1.Governance > ul > li.li-download > a + span.download { max-width:50%; position:absolute; top:0; right:0;}
.list-data.col-1.Governance > ul > li.li-download > a + span.download li:only-child { margin-right:0;}

/*企業社會責任*/
.list-data.col-1.Responsible { margin-top:1em;}
.list-data.col-1.Responsible > ul > li > a { padding:0; display:block; width:100%;}

/*企業社會責任報告書 公司年報*/
.BasicTable-down { width:100%; height:auto; overflow:hidden; margin:0 auto; margin-bottom:1em;}
.BasicTable-down * { padding:0; margin:0; list-style:none; text-decoration:none;}
.BasicTable-down > tbody { width:100%; height:auto; overflow:hidden;
/*flex*/
display: flex;
flex-wrap:wrap;}
.BasicTable-down > tbody > tr { width:100%; height:auto; overflow:hidden; position:relative; margin-bottom:1em; padding-bottom:8px; border:1px solid rgb(235,235,235); font-size:1em;
/*圓角*/
border-radius:15px;
/*flex*/
display: flex;
flex-wrap:wrap;
justify-content:space-between;}
.BasicTable-down > tbody > tr:last-child { margin-bottom:0;}
.BasicTable-down > tbody > tr:before { content:''; display:block; width:100%; height:0; opacity:0; position:absolute; left:0; bottom:0; z-index:0; background:#f5d83e;
transition:all .5s;}
.BasicTable-down > tbody > tr:hover:before { height:100%; opacity:1;}
.BasicTable-down > tbody > tr:after { content:''; display:block; width:100%; height:8px; position:absolute; left:0; bottom:0; z-index:0; background:#ae9249;}
.BasicTable-down > tbody > tr > * { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; white-space:nowrap; margin:0; padding:5px 10px; position:relative; z-index:1;}
.BasicTable-down > tbody > tr .title { width:auto; padding:10px; line-height:1.5em; height:auto; font-size:1em;
transition:all .5s;}
.BasicTable-down > tbody > tr:hover .title { color:#014c6f;}
.BasicTable-down > tbody > tr .download { max-width:60%;}
.BasicTable-down > tbody > tr .download .file-list { width:auto; height:auto; overflow:hidden; padding:0; margin:0; float:right;
/*flex*/
display:inline-flex;
flex-wrap:wrap;
justify-content:flex-end;}
.BasicTable-down > tbody > tr .download .file-list > li { display:inline-block; width:auto; height:auto; overflow:hidden; margin:5px 0; font-size:1em; line-height:1.5em; margin-right:10px;}
.BasicTable-down > tbody > tr .download .file-list > li > a { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; position:relative; padding-left:2em; color:#014c6f;}
.BasicTable-down > tbody > tr .download .file-list > li > a:link,
.BasicTable-down > tbody > tr .download .file-list > li > a:visited { color:#014c6f;}
.BasicTable-down > tbody > tr .download .file-list > li > a:hover,
.BasicTable-down > tbody > tr .download .file-list > li > a:active { color:#ae9249;}
.BasicTable-down > tbody > tr .download .file-list > li > a:before { content:''; display:block; width:1.5em; height:1.5em; position:absolute; top:0; left:0; background:url(/tw/Images/Layout/down.png) center center no-repeat; background-size:contain;}
.BasicTable-down > tbody > tr .download .file-list > li > a:hover:before,
.BasicTable-down > tbody > tr .download .file-list > li > a:active:before{ background:url(/tw/Images/Layout/down_o.png) center center no-repeat; background-size:contain;}
.BasicTable-down > tbody > tr:first-child { display:none;}


/*企業社會責任報告書-內頁*/
#ContentPlaceHolder1_wrapperFiles { display:block; width:100%; height:auto; overflow:hidden; white-space:nowrap; padding:0; margin:0;}
#ContentPlaceHolder1_wrapperFiles > li { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; padding-bottom:4px; border:1px solid rgb(235,235,235); font-size:1em; margin:0.25em; position:relative;
/*圓角*/
border-radius:15px;
/*flex*/
display: flex;
flex-wrap:wrap;
justify-content:space-between;}
#ContentPlaceHolder1_wrapperFiles > li:before { content:''; display:block; width:0; height:100%; opacity:0; position:absolute; left:0; bottom:0; z-index:0; background:#f5d83e;
transition:all .5s;}
#ContentPlaceHolder1_wrapperFiles > li:hover:before { width:100%; opacity:1;}
#ContentPlaceHolder1_wrapperFiles > li:after { content:''; display:block; width:100%; height:4px; position:absolute; left:0; bottom:0; z-index:0; background:#ae9249;}
#ContentPlaceHolder1_wrapperFiles > li a { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; text-decoration:none; padding:0.25em 0.5em; transition:all .5s; position:relative; z-index:1;}
#ContentPlaceHolder1_wrapperFiles > li a:link,
#ContentPlaceHolder1_wrapperFiles > li a:visited { color:#014c6f;}
#ContentPlaceHolder1_wrapperFiles > li a:hover,
#ContentPlaceHolder1_wrapperFiles > li a:active { color:#ae9249;}


/*=====================START : 編輯器=====================*/
.Des { width:100%; height:auto; overflow:hidden; max-width:1300px; padding:10px 0; margin:0 auto; margin-bottom:1rem;}
.Des.Submission,
.Des.WebInfo{ max-width:1044px;}

.Des ~ .DownList { width:100%; height:auto; overflow:hidden; max-width:1300px; padding:10px; margin:0 auto;}
.Des ~ .DownList > a { display:block; width:100%; height:auto; overflow:hidden; position:relative; border:1px solid rgba(0,0,0,0.1); margin-bottom:1rem; padding:0.5rem; text-decoration:none; padding-right:60px;
/*基礎動畫設定*/
-webkit-transition:all .5s, -webkit-transform .5s; transition:all .5s, transform .5s;}
.Des ~ .DownList > a:before { content:''; display:block; width:30px; height:30px; position:absolute; top:50%; margin-top:-15px; right:10px; background:url(/tw/Images/Layout/Icon_Download.png) center center no-repeat; opacity:0.7;
/*背景圖片尺寸*/
-moz-background-size:contain;
-webkit-background-size:contain;
-o-background-size:contain;
background-size:contain;
/*基礎動畫設定*/
-webkit-transition:all .5s, -webkit-transform .5s; transition:all .5s, transform .5s;} 
.Des ~ .DownList > a:hover:before { opacity:0.9;}
.Des ~ .DownList > a:link,
.Des ~ .DownList > a:visited { color:rgba(0,0,0,.7);}
.Des ~ .DownList > a:hover,
.Des ~ .DownList > a:active { color:rgba(0,0,0,.9);}
/*=====================END : 編輯器=====================*/

/*=====================START : button=====================*/
.go-back { display:block; height:auto; max-width:150px; text-align:center; overflow:hidden; text-decoration:none; padding:0.5em 0; margin:1em auto; width:100%; border-radius:0.5rem;
transition:all .5s; line-height:40px;}
.go-back:before{ content:'\2039'; font-size:1.7em; margin-right:5px; position:relative; top:1px; color:#847348;}
.go-back:link,
.go-back:visited { color:#333; border:1px solid #ccc;}
.go-back:hover,
.go-back:active { color:white; background:#004d72; border:1px solid #004d72;}

input.btn { outline:none; border:0; font-family:"微軟正黑體"; font-size:1rem; cursor:pointer;}
.btn{ float:left; height:auto; overflow:hidden; text-decoration:none; padding:1rem; margin-top:0.5rem;margin-bottom:0.5rem; text-align:center;}
input.btn,
.btn:link,
.btn:visited{ background:#004d72; color:white;border-radius:0.5rem;
transition:background .5s;}
.btn:hover,
.btn:active{ background:#ae9249; color:white;border-radius:0.5rem;}

.btn.full{ width:100%;}

.btn.reset{border-radius:0.5rem;}
.btn.reset:link,
.btn.reset:visited{background:rgba(0,0,0,0.05); color:rgba(0,0,0,1);transition:background .5s, color .5s;}
.btn.reset:hover,
.btn.reset:active{ background:#ae9249; color:white;}

/*-----START : button group-----*/
.btn-group{ width:100%; margin-bottom:20px;
display:-webkit-flex; display:flex; 
-webkit-flex-wrap:wrap; flex-wrap:wrap;
-webkit-justify-content: space-around;justify-content: space-around;}
.btn-group.full > .btn { margin:0.5rem;flex-grow:1;}
/*-----END : button group-----*/
/*=====================END : button=====================*/

@media only screen and (min-width:0px) and (max-width:1600px) {
.Wrapper { padding-top:95px;}
.Header .DivW1280 { padding:20px; height:95px;}
.Nav > ul > li { font-size:20px;}
.Nav > ul > li > a:after { width:20px; height:20px; top:20px; margin-right:-62px;}
.Nav > ul > li:nth-child(5) > a:after { margin-right:-82px;}
.Nav > ul > li:nth-child(8) > a:after { margin-right:-72px;}
.Nav > ul > li > a + .sub-menu > li a { font-size:16px;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a { font-size:18px;}
.WrapperFixed .Header .DivW1280 { padding:10px 20px;}
}

@media only screen and (min-width:0px) and (max-width:1400px) {
.Wrapper { padding-top:80px;}
.Header .DivW1280 { padding:10px; height:80px;}
.Header .Logo { margin-top:10px;}
.Header .Logo a img { height:40px;}
.Nav { width:calc( 100% - 180px );}
.Nav > ul > li { font-size:18px;}
.Nav > ul > li > a:after { margin-right:-57px;}
.Nav > ul > li:nth-child(5) > a:after { margin-right:-77px;}
.Nav > ul > li:nth-child(8) > a:after { margin-right:-67px;}
.Nav > ul > li > a + .sub-menu > li a { font-size:14px;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a { font-size:16px;}
.WrapperFixed .Header { height:60px;}
.WrapperFixed .Header .DivW1280 { padding:0 10px; height:60px;}

.Footer .DivW1280 > div.SiteMap { flex-wrap:wrap; padding:40px 0 0 calc( 100% - 1000px );}
.Footer .DivW1280 > div.SiteMap:before { width:calc( 100% - 1000px );}
.Footer .DivW1280 > div.SiteMap dl { width:250px; margin-bottom:40px;}
}

@media only screen and (min-width:0px) and (max-width:1280px) {
.Wrapper { padding-top:60px;}
.Header .DivW1280 { height:60px; padding:0 10px;}
.Nav > ul > li { font-size:16px;}
.Nav > ul > li > a:after { margin-right:-52px;}
.Nav > ul > li:nth-child(5) > a:after { margin-right:-66px;}
.Nav > ul > li:nth-child(8) > a:after { margin-right:-60px;}
.Nav > ul > li > a + .sub-menu > li a { font-size:12px;}
.Nav > ul > li:nth-child(8) > a + .sub-menu > li > a { font-size:14px;}

.Footer .DivW1280 > div.SiteMap { padding:30px 0 0 300px;}
.Footer .DivW1280 > div.SiteMap:before { width:300px;}
.Footer .DivW1280 > div.SiteMap dl { width:25%; margin-bottom:30px;}

.slide-menu > ul { padding:2.5px 0;}
.slide-menu > ul li { margin:2.5px;}
.slide-menu > ul li a { border-radius:5px;}
.slide-menu > ul li a:link,
.slide-menu > ul li a:visited { border:1px solid #eee;}
.slide-menu > ul li a:hover,
.slide-menu > ul li a:active { border:1px solid #847348;}

.slide-menu > ul li.active a:link,
.slide-menu > ul li.active a:visited,
.slide-menu > ul li.active a:hover,
.slide-menu > ul li.active a:active { border:1px solid #847348;}

}

@media only screen and (min-width:0px) and (max-width:1080px) {
.Nav { display:none;}
.Header .TopMenu { position:fixed; top:0; right:55px;}

.Content { font-size:0.9em;}
.page-title{ padding:30px 10px; padding:10px; margin:50px auto; font-size:1.8em;}
.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper .page-title { margin:50px 0; margin:20px 0;}
.page-title:after { height:4px;}
.PageContent-Right .PageArticle { padding:0 40px;}
.PageWrapper-Side { padding:30px;}
.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper { padding:0 40px;}

.Footer .DivW1280 > div.SiteMap { padding:30px 30px 0 30px;}
.Footer .DivW1280 > div.SiteMap:before { display:none;}
.Footer .SiteMap dt { margin-bottom:10px;}
}

@media only screen and (min-width:0px) and (max-width:1024px) {
.Footer .uGear { padding:0; width:100%; text-align:center; right:auto; left:0; bottom:0;}
.Footer .uGear:link,
.Footer .uGear:visited,
.Footer .uGear:hover,
.Footer .uGear:active { background:none;}
}

@media only screen and (min-width:0px) and (max-width:960px) {
	.PageNews ul {  -webkit-justify-content:space-between;justify-content:space-between; }
	.PageNews ul li { width:48%; margin-right:0;}
}
@media only screen and (min-width:0px) and (max-width:900px) {
	.Header .TopMenu .Menu > li.rss { display:none;}
	
}
@media only screen and (min-width:0px) and (max-width:800px) {
	.Footer .SiteMap  { width:100%;}
	.Footer .App { display:none;}
}
@media only screen and (min-width:0px) and (max-width:768px) {
	.FixedAdsLeft { padding:5px; width:210px;}
	
	.Content { font-size:0.8em;}
	.page-title{ padding:20px 10px; padding:10px; margin:40px auto;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper .page-title { margin:40px 0; margin:20px 0;}
	.page-title:after { height:3px;}
	.PageContent-Right .PageArticle { padding:0 30px;}
	.PageWrapper-Side { padding:20px;}
	.btn { padding:15px;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper { padding:0 30px;}
	
	.slide-menu > ul { padding:5px 0;}
	.slide-menu > ul li { margin:5px;}
	
	
	/*營收資訊 自結盈餘 財務報表 法人說明會 股東會資料 股利資訊*/
	.list-data.col-1 > ul > li span.title { width:100%; border-bottom:1px solid rgb(235,235,235);}
	.list-data.col-1 > ul > li span.download {max-width:100%;}
	.list-data.col-1 > ul > li span.download .file-list {
	/*flex*/
	justify-content:flex-start;}
	
	/*最新消息*/
	.list-data.col-1.news > ul > li > a { padding:0;}
	.list-data.col-1.news > ul > li > .date { position:static; top:auto; right:auto; width:100%; padding-top:0; font-size:0.8em;}
	.list-data.col-1.news > ul > li span.title { padding-bottom:0; border:0;}
	
	/*企業社會責任報告書 公司年報*/
	.BasicTable-down > tbody > tr .title { width:100%; border-bottom:1px solid rgb(235,235,235);}
	.BasicTable-down > tbody > tr .download { max-width:100%;}
	.BasicTable-down > tbody > tr .download .file-list {
	/*flex*/
	justify-content:flex-start;}
	
	.list-data.col-4 li {width:49%; margin-right:1.33%;}
	.list-data.col-4 li:nth-child(2n+2){ margin-right:0;}
	
	/*公司治理*/
	.list-data.col-1.Governance > ul > li.li-download > a { padding-right:0;}
	.list-data.col-1.Governance > ul > li.li-download > a + span.download { max-width:100%; position:static;}
	
	.Footer .DivW1280 > div.SiteMap { padding:20px 20px 0 20px;}
	.Footer .DivW1280 > div.SiteMap dl { margin-bottom:20px;}
	.Footer .Copyright * { font-size:16px;}
}
@media only screen and (min-width:0px) and (max-width:690px) {

.Footer .DivW1280 > div.SiteMap dl { width:50%;}
}

@media only screen and (min-width:0px) and (max-width:512px) {
	.FixedAdsLeft { width:150px;}
	
	.PageWrapper-Side .PageContent-Right { min-height:0;}
	
	.slide-menu > ul { -webkit-justify-content:flex-start;justify-content:flex-start;}
	.slide-menu > ul li { margin-right:1%; margin-bottom:0;}
	.slide-menu > ul li a { font-size:0.7rem; padding:0.25rem;}
	.list-data.sub-list-data {justify-content:flex-start; padding:5px;}
	.list-data.sub-list-data li { margin:2.5px;}
	.list-data.sub-list-data li a { font-size:0.6rem; padding:5px;}
	
	.PageMenu > h2 { padding:0 10px 5px 10px; margin-bottom:30px; font-size:2em;}
	.PageMenu > h2:after { height:3px;}
	
	.Content { font-size:0.7em;}
	.page-title{ padding:0; font-size:1.6em; margin:30px auto;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper .page-title { margin:30px 0; margin:20px 0;}
	.page-title:after { height:2px;}
	.PageContent-Right .PageArticle { padding:0 20px;}
	.PageWrapper-Side { padding:10px;}
	.btn { padding:10px;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper { padding:0 20px;}

	
}
	
@media only screen and (min-width:0px) and (max-width:360px) {
	.page-title{ margin:20px auto;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper .page-title{ margin:20px 0;}
	.PageContent-Right .PageArticle { padding:0 10px;}
	.PageWrapper-Side-Side + .PageContent-Right .page-title-wrapper { padding:0 10px;}

	.Footer .SiteMap dt { font-size:18px;}
	.Footer .SiteMap dd { font-size:14px;}
	.Footer .Copyright * { font-size:14px;}
}