﻿@charset "utf-8";
/* CSS Document */

a:link {
    color: #604C3F; 
    text-decoration: none;
}  /* 設定尚未點閱過的連結樣式 */
a:visited {
    color: #604C3F;
    text-decoration: none;
}  /* 設定過去曾經閱過的連結 */
a:hover {
    color: #21AB38;
    text-decoration:underline;
}  /* 設定滑鼠游標指在連結位置上的樣式 */
a:active {
    color: #21AB38;
    text-decoration:underline;
}  /* 設定正點擊的連結樣式 */


body  {
    width: 100%;
    min-width: 960px;
    min-height: 500px; /* 可隨內容增加而延伸 */
	margin: 0 auto;
	background-color: #F5F5F5;
	         }

img   {
    border: 0px;
 }	  

img.max  {
    max-width: 100%;
    height: auto;
}

p    {
    text-indent:34px; /*第一行文字的縮排 */
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 1.7em;
    text-align: justify;
}


p.white  {
    text-indent:0px; /*第一行文字的縮排 */
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 2em;
}

p.ft {
    text-indent:0px; /*第一行文字的縮排 */
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFFFFF;
    line-height: 1.7em;
    letter-spacing:1px;
}

p.normal  {
    text-indent:0px; /*第一行文字的縮排 */
    float: left;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 1.7em;

}

p.tab  {
    text-indent:0px; /*第一行文字的縮排 */
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #8E8E8E;
    line-height: 2em;
    text-align: right;
}


h1  {
    font-family: Arial, Microsoft JhengHei;
    font-size: 20px;
    color: #6B513D;
    line-height: 1em;
    letter-spacing: 0.5px;
}

h2  {
    font-family: Arial, Microsoft JhengHei;
    font-size: 18px;
    color: #8B6A50;
    line-height: 1em;
    text-align: left;
}

h3  {  
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 0.5em;
    font-weight: bold; /* 粗體 */
}

h4  {
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 1em;
    font-weight: normal; /* 一般 */
}


h5  { /* News */
    font-family: Arial, Microsoft JhengHei;
    font-size: 18px;
    color: #604C3F;
    line-height: 1.7em;
    text-align: left;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 0px;
}

ol  {  /* 未使用 */
    list-style-type: decimal;
     /*清單用阿拉伯數字*/
    margin:0; 
    /* 清除項目清單的外間距 */
    padding:0; 
    /* 清除項目清單的內間距 */
}



ul.item {
    list-style-image: url(../img/link_left.png);
    /*清單符號*/
    margin:0; 
    /* 清除項目清單的外間距 */
    padding:0; 
    /* 清除項目清單的內間距 */
}



li.item {
    line-height: 1.7em;
    margin-left: 16px;
    margin-bottom: 2px;
    padding: 0;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    text-align: justify;
    margin-top: auto; 
}


li.item a {
    line-height: 1.7em;
    margin-left: 16px;
    margin-bottom: 2px;
    padding: 0;
    font-family: Arial, Microsoft JhengHei;
    text-align: justify;
    margin-top: auto; 
}


table.pro  {
    width: 620px;
    min-height: 100px;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    margin-bottom: 10px;
}
td.name  {
    height: 30px;
    background-color: #F0F0F0;
    padding-left: 10px;
    font-size: 16px;
    font-weight: bold;
    color: #563E24;
}

td.photo {
    width: 140px;
    padding-top: 0px;
}

table {
    width: 100%;
    border: 0;
    margin: 0;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    text-align: left;
    color: #212121;
    line-height: 1.7em;
}

table.data {
    width: 640px;
    margin: 0 auto;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    text-align: center;
    border: 2px solid #F0F0F0;
    color: #604C3F;
}

table.tab {
    width: 600px;
    margin: 0 auto;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    text-align: center;
    border: 2px solid #F0F0F0;
    color: #604C3F;
}

tr.color  {
    height: 30px;
    background-color: #F0F0F0;
}

table.data tr {
    height: 30px;
}

table.tab tr {
    height: 30px;
}

img.photo {
    width: 130px;
    border: 2px solid #E0E0E0;
}

td.kind {
    width: 80px;
    color: #744F2A;
    line-height: 0em;
}

td.value {
    color: #212121;
    line-height: 2em;
}

td.more {
    text-align: right;
}

td.more a:link {
    color: #604C3F; 
    text-decoration: none;
}

td.more a:hover {
    color: #21AB38; 
    text-decoration: none;
}

#top_bg {
    width: 100%;
    height: 120px;
    background-color: #FFFFFF;
}


header{
    width: 960px;
    height: 120px;
    float: top;
    margin: 0px auto; 
 }

#logo {
    width: 250px; 
    height: 120px;
    margin: 0px;
    padding-left: 0px;
    float: left;
}

#link_top  {
    width: 705px;  /* 扣除padding */
    height: 108px;
    float: left;
    padding-top: 2px;
    padding-right: 5px;
    text-align: right;
}

.nav   {
    width: 100%; 
    height: 50px;
    margin: 0px;
    float: top;
    padding-left: 0%;
    background-image: url(../img/page_menu.jpg);
    background-repeat: repeat-x;
    overflow:hidden; 
    text-align: center; /* 置中 */
} 


/* 利用偽元素 使 menu 置中 */
.nav:before {  
  content: "";
  height: 100%;
  display: inline-block;
  vertical-align: middle;
}


#menu {
  height: 50px;
  display: inline-block; /* 置中 */
  vertical-align: middle;  /* 置中 */
  background-image: url(../img/page_menu.jpg);
  background-repeat: repeat-x;
}



#container {
    width: 960px;
    min-height: 500px; /* 可隨內容增加而延伸 */
    margin: 0 auto;
    padding-top: 20px;
    overflow: hidden; /* 解決Fire fox最小高度失效問題 */
}


#left  {
    width: 230px;
    min-height:500px; 
    margin-right: 10px; 
    float: left;
}


#content {
    width: 700px;
    min-height: 300px;
    float: left;
    margin-left: 10px;
    border: 1px solid #d0d0d0;
    background-color: #FFFFFF;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
    margin-bottom: 20px;

}


hr  {
    width: 95%;  
}

hr.news  {
    width: 100%;
}


.inside {
    width: 92%;
    min-height: 500px; /* 可隨內容增加而延伸 */
    padding: 1% 4% 4% 4%;
}


.topic {
    width: 660px;
    height: 50px;
    float: left;
    margin: 5px 0px auto;
    padding: 0px 20px;
    text-align: right;
    background-repeat: no-repeat;

}


#bottom_bg {
     width: 100%;
     height: 165px;
     background-color: #61AC3F;
     margin-bottom: 0px;
     box-shadow: inset 0 2px 3px rgba(0,0,0,0.17);
}

footer {
    width: 955px;
    min-height: 125px;
    margin: 0 auto;
    text-align: left;
    padding-left: 5px;
    padding-top: 2px;
}


 /* 右側固定按鈕 */
#top,#ft{   
    position:relative;
    cursor:pointer;
    height:40px;
    width:40px;
    }

#top:hover{ 
    opacity: 1.0; /* 設為完全不透明 */
    filter: alpha(opacity=100); /* IE8 與更早的版本 */
}

#ft:hover{  
    opacity: 1.0; /* 設為完全不透明 */
    filter: alpha(opacity=100); /* IE8 與更早的版本 */
}

#top {
    background:url(../img/roll_top.png) no-repeat;
    opacity:0.6;
    filter: alpha(opacity=60); /* IE8 與更早的版本 */
}

#ft {
    background:url(../img/roll_ft.png) no-repeat;
    opacity:0.6;
    filter: alpha(opacity=60); /* IE8 與更早的版本 */
}

    
#roll {
    display:block;
    width:25px;
    position:fixed;
    right:2%;
    top:50%;
}


/* 分頁Table */
.abgne_tab {
    clear: left;
    width: 640px;
    min-height: 100px;
    margin: 10px 0;
}

ul.tabs {
    width: 100%;
    height: 32px;
    border-bottom: 0px solid #BEBEBE; /* 上方橫線 */
    border-left: 0px solid #BEBEBE; /* 上方頁籤最左邊線 */
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 15px;
}
    
ul.tabs li {
    float: left;
    height: 30px;
    line-height: 31px;
    overflow: hidden;
    position: relative;
    margin-bottom: -1px;    /* 讓 li 往下移來遮住 ul 的部份 border-bottom */
    border: 1px solid #776150;  /* 上方頁籤邊框 */
    background: #FFF;
    margin: 0;
    padding-top: 1px;
    list-style: none;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    margin-right: 7px; /* 標籤間距 */
}

ul.tabs li a {
    display: block;
    padding: 5px 10px; /* 頁籤字與框的間距 */
    color: #776150;
    text-decoration: none;
}

ul.tabs li a:hover {
    background: #F2ECE9;
}

ul.tabs li.active  {   /* 停留頁面的狀態 */
    background: #776150;
    border-bottom: 0px solid #fff;
}

ul.tabs li.active a {  /* 停留頁面字體顏色 */
    color: #FFF;
}

    
ul.tabs li.active a:hover {
    background: #776150; /* 滑過停留頁面時狀態 */
    color: #FFF;
}

div.tab_container {
    clear: left;
    width: 100%;
    border: 0px solid #BEBEBE; /* 下方大框 */
    border-top: none;
    background: #fff;
}

div.tab_container .tab_content {
    padding: 0px; /* 內容與表格間距 */
}

/* 最新消息的分頁Table */
.abgne_tab_news {
    clear: left;
    width: 640px;
    min-height: 100px;
    margin: 10px 0;
}

ul.tabs_news {
    width: 100%;
    height: 32px;
    border-bottom: 1px solid #BEBEBE;
    border-left: 0px solid #BEBEBE; /*  上方最左標籤的邊線 */
    margin: 0;
    padding: 0;
    list-style: none;    
}
    
ul.tabs_news li {
    float: left;
    height: 30px;
    line-height: 31px;
    overflow: hidden;
    position: relative;
    margin-bottom: -1px;    /* 讓 li 往下移來遮住 ul 的部份 border-bottom */
    border: 1px solid #BEBEBE;
    border-left: 1px solid #BEBEBE;
    background: #F0F0F0;
    margin: 0;
    padding-top: 1px;
    list-style: none;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    border-top-left-radius: 6px; /*設定左上角*/
    border-top-right-radius: 6px; /* 設定右上角*/
    margin-right: 5px; /* 標籤間距 */
}

ul.tabs_news li a {
    display: block;
    padding: 5px 10px;
    color: #000;
    text-decoration: none;
}

ul.tabs_news li a:hover {
    background: #E0E0E0;
}

ul.tabs_news li.active  {   /* 停留頁面的狀態 */
    background: #FFF;
    border-bottom: 1px solid #fff;
}
    
ul.tabs_news li.active a:hover {
    background: #fff;
}

div.tab_container_news {
    clear: left;
    width: 100%;
    border: 1px solid #BEBEBE;  /* 下方大框 */
    border-top: none;
    background: #fff;
    border-bottom-left-radius: 6px; /*設定左下角*/
    border-bottom-right-radius: 6px; /* 設定右下角*/

}

div.tab_container_news .tab_content_news {
    padding: 10px;
}


table.news  {
    width: 100%;
    border: 0;
    margin: 0;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    text-align: left;
    color: #212121;
    line-height: 1.7em;
}

table.news tr  {
    height: 35px;
}


td.tag   {
    width: 90px;
}

td.event  {
    width: 450px;
}

td.time  {
    width: 90px;
    text-align: right;
}

td.con p {
	text-indent:0px; /*第一行文字的縮排 */
    float: left;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 2em;
}

td.back {
    text-align: center;
    padding-top: 15px;
}

#news_0  {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #BABABA;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}

#news_01 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #40A9FF;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}

#news_02 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #ED77C6;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}


#news_03 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #61C68A;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}


#news_04 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #FC9A1A;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}


#news_05 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #A86FC9;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}


#news_06 {
    width: 76px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #FFF;
    background-color: #916F5D;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}


.event_box {
    clear: left;
    width: 600px;
    min-height: 300px;
    margin: 10px auto;
    padding: 0px 20px; 
    border: 1px solid #BEBEBE;
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;   
}

.button {
    width: 102px;
    height: 30px;
    margin: 0 auto;
    margin-bottom:10px;
    padding-top: 5px;
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #FFF;
    background-color: #5db430;
    -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
}

.button:hover {
    background-color: #8fca1f;
}

.button a {
    color: #FFF;
    text-decoration: none;
}

.button a:hover {
    color: #FFF;
    text-decoration: none;
}

.news   {
    text-align: center;
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;

}

