@import url("table.css");
/********************************************************************************************* 
CSS Reset 
*********************************************************************************************/
* {
  margin: 0;
  padding: 0;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend
/*table, caption, tbody, tfoot, thead, tr, th, td*/ {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

  blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
  }

  q:before, q:after {
    content: '';
  }

abbr, acronym {
  border: 0;
}
/* Global reset-RESET */
/* The below restores some sensible defaults */
strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

a img {
  border: none;
}

/***************************************************************************************
* BODY ELEMENTS
***************************************************************************************/
html, body {
  padding: 0;
  height: 100%;
}

body {
  text-align: center;
  color: #555555;
  font-family: "新細明體";
  font-size: 0.93em;
  background: #fff url(../images/pic/bg.gif) repeat-x left top;
  margin: 0 20px;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; /*圖下方有空白，為了刪除空白而做此設定*/
}

a {
  color: #444;
  text-decoration: none;
  outline: none; /* for Firefox Google Chrome  */
  behavior: expression(this.onFocus=this.blur()); /* for IE */
}

  a:hover {
    color: #C00;
    text-decoration: none;
  }

.block {
  clear: both;
  display: block;
  height: 10px;
  color: Red !important;
}

a.more {
  background: url(../images/pic/but_more.gif) no-repeat left top;
  width: 70px;
  height: 24px;
  display: block;
  text-align: left;
  padding-top: 5px;
  padding-left: 5px;
  font-size: 0.8em;
  color: #9c0000;
}

a:hover.more {
  text-decoration: none;
}

a.print {
  background: url(../images/pic/but_print.gif) no-repeat left top;
  width: 85px;
  height: 24px;
  display: block;
  text-align: left;
  padding-top: 5px;
  color: #9c0000;
  font-size: 0.8em;
}

a:hover.print {
  text-decoration: none;
}

  a.print span, a:hover.print span {
    padding-left: 28px;
  }


/***************************************************************************************
* HEADIㄋGS
***************************************************************************************/

/* All Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: "微軟正黑體";
  color: #231815;
}
/* Individual Headings */
h1 {
  margin: 15px 0 30px 10px;
  font-size: 1.6em;
}

h2 {
  font-size: 1.4em;
}

h3 {
}

h4 {
}

.bullet {
  padding-left: 10px;
  background: url(../images/pic/arrow01.gif) left center no-repeat;
  margin-bottom: 10px;
}

h5 {
}

h6 {
}

h1.title_icon01 {
  background: url(../images/pic/icon01_b.png) no-repeat left 2px;
  padding-left: 40px;
  text-align:left;/*沒加友善列印會死 By Casper*/
}

h1.title_icon02 {
  background: url(../images/pic/icon02_b.png) no-repeat left 2px;
  padding-left: 50px;
  text-align:left;/*沒加友善列印會死 By Casper*/
}

h1.title_icon03 {
  background: url(../images/pic/icon03_b.png) no-repeat left 2px;
  padding-left: 40px;
  text-align:left;/*沒加友善列印會死 By Casper*/
}

h1.title_icon04 {
  background: url(../images/pic/icon04_b.png) no-repeat left 2px;
  padding-left: 40px;
  text-align:left;/*沒加友善列印會死 By Casper*/
}

/***************************************************************************************
* FORMS
***************************************************************************************/
/*
form{ font:bold 0.9em 微軟正黑體;}
form p{ clear: left; margin: 0; padding:0 0 2px 0; vertical-align:middle; text-align:left;}
form p.none{ border-bottom: 0px;}
form p label{  float: left; width:60px; text-align: left; }
form p label span{color:#C00; margin-left:5px;}
  */
fieldset {
  width: 530px;
  padding: 20px;
  border: none;
}

legend {
  font-size: 1.3em;
  font-family: 微軟正黑體;
  width: 200px;
  text-align: left;
  padding: 0 10px;
  font-weight: bold;
  padding: 10px 0;
}

  .BackToPerviousPage {
    padding: 0.35em 2px 0.25em 2px;
    background: url(../images/pic/bg_tab_up.gif) repeat-x left top;
    color: #333;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #888;
    font-size:10pt;
  }

/* Inputs */
input, textarea {
  border: 1px solid #b4b4b4;
  padding: 2px;
  margin-bottom: 2px;
  background-color: #fff;
  color: #555;
}

  input[type="radio"], input[type="checkbox"] {
    border: none;
  }

  input[type="button"], input[type="reset"], input[type="submit"] {
    padding: 0.35em 2px 0.25em 2px;
    background: url(../images/pic/bg_tab_up.gif) repeat-x left top;
    color: #333;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #888;
  }

    input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
      /*background-color:#52a39a;*/
      color: #333;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      border-radius: 3px;
      border: 1px solid #1e8be4;
    }
/* Add */
  input[type='button']:disabled,input[type="submit"]:disabled, button:disabled {
    color: #aaa;
  }


    input[type="button"].login {
      background: #208ce5 url(../images/pic/but_blue.gif) repeat-x left center;
      color: #fff;
      border: 1px solid #1e8be4;
    }

    input[type="button"].logout {
      background: #208ce5 url(../images/pic/but_blue.gif) repeat-x left center;
      color: #fff;
      border: 1px solid #1e8be4;
    }

    input[type="button"].search {
      background: #228ee6 url(../images/pic/but_blue.gif) repeat-x left top;
      color: #fff;
      border: 1px solid #1e8be4;
      padding: 5px 8px 1px 8px;
    }

/***************************************************************************************
* Layout
***************************************************************************************/
#wrapper {
  margin: 0 auto;
  width: 100%;
  min-height: 100%;
  height: 100%;
  height: auto !important;
  z-index: 100;
  overflow: hidden;
}

#header {
  height: 195px;
  position: relative;
}

#headerInner {
}

#contentwrapper {
  float: left;
  width: 100%;
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 5px 0px #aaa;
  -moz-box-shadow: 0px 0px 5px 0px #aaa;
  box-shadow: 0px 0px 5px 0px #aaa;
  padding-bottom: 100000px;
  margin-bottom: -100000px;
  overflow: hidden;
}

#contentInner {
  margin: 20px 20px 20px 220px;
  text-align: left;
}

#contentColumn {
}

#leftcolumn {
  float: left;
  width: 220px;
  margin-left: -100%;
  padding-bottom: 100000px;
  margin-bottom: -100000px;
}

#leftcolumn_inner {
  margin: 20px;
}

.left {
  float: left;
}

.right {
  float: right;
}


/* Header
************************************************************************************************************************************************************/
#logo {
  position: absolute;
  left: 10px;
  top: 55px;
  z-index: 1;
}

  #logo, #logo a {
    clear: both;
    background: url(../images/pic/logo.png) no-repeat left top;
    display: block;
    width: 480px;
    height: 63px;
  }

.headerTop {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}

.pic {
  background: url(../images/pic/meadow.png) repeat-x left 8px;
  width: 100%;
  height: 47px;
}

.headerBot {
  background: url(../images/pic/pic.png) no-repeat right top;
  position: absolute;
  top: -3px;
  right: 0;
  width: 710px;
  height: 195px;
  z-index: -1;
}


/*   左側目錄下拉選單   */
.category {
  margin: 0;
  padding: 0;
  text-align: left;
}

  .category h3 {
    border-bottom: 1px solid #fff;
    color: #fff;
    background: url(../images/pic/bg_nav_title.gif) no-repeat left top;
    width: 180px;
    height: 35px;
    padding: 0 0 0 10px;
  }

    .category h3 a.icon01 {
      background: url(../images/pic/icon01.png) no-repeat left 8px;
      padding-left: 26px;
    }

    .category h3 a.icon02 {
      background: url(../images/pic/icon02.png) no-repeat left 8px;
      padding-left: 26px;
    }

    .category h3 a.icon03 {
      background: url(../images/pic/icon03.png) no-repeat left 8px;
      padding-left: 26px;
    }

    .category h3 a.icon04 {
      background: url(../images/pic/icon04.png) no-repeat left 8px;
      padding-left: 26px;
    }

  .category .menuheader { /*CSS class for menu headers in general (expanding or not!)*/
    font: bold 0.95em 微軟正黑體;
    line-height: 35px;
    color: #fff;
    /*width: 195px;
height:30px;*/
    display: block;
    overflow: hidden;
    margin-bottom: 0px; /*bottom spacing between header and rest of content*/
    text-transform: uppercase;
    cursor: hand;
    cursor: pointer;
    text-align: left;
    z-index: 100;
  }

    .category .menuheader a {
      color: #fff;
      text-decoration: none;
      display: block;
      background: url(../images/pic/arrow-01.gif) no-repeat left top;
    }

      .category .menuheader a:hover, .category .menuheader a.selected {
        color: #FF0;
      }

  .category .menuthis, .category .menuthis a, .category .openheader, .category .openheader a { /*CSS class to apply to expandable header when it's expandedbackground-image: url(../images/pic/titlebar-active.png);*/
  }

  .category .categoryitems {
    margin: 0;
    padding: 15px 0 8px 5px;
    background: #e1fbff url(../images/pic/bg_nav_content.gif) repeat-x left top;
  }

  .category ul { /*CSS for UL of each sub menu*/
    list-style-type: none;
    margin: 0;
    padding: 0; /*bottom spacing between each UL and rest of content*/
  }

    .category ul li {
      padding-bottom: 5px; /*bottom spacing between menu items*/
      margin-bottom: 5px;
      background: url(../images/pic/arrow.gif) no-repeat 10px 7px;
      padding-left: 20px; /*link text is indented 19px*/
      font: bold 0.95em 微軟正黑體;
    }

      .category ul li.none {
        border-bottom: none;
      }

      .category ul li a {
        text-decoration: none;
        font-weight: normal; /*border-bottom: 1px solid #dadada;*/
      }
        /*.category ul li a:visited{ color: #ff6000;}*/
        .category ul li a:hover, .category ul li a.selected { /*hover state CSS */
          color: #C00;
        }

/* Content
************************************************************************************************************************************************************/

/* =breadcrumb
-----------------------------------------------------------------------------------------------------------------------------------------------------------*/
ul#breadcrumb {
  margin: 0;
  padding: 0 0 18px 0;
  list-style: none;
  border-bottom: 1px solid #ccc;
}

  ul#breadcrumb li {
    float: left;
    margin-right: 8px;
  }

    ul#breadcrumb li a, ul#breadcrumb li span {
      font-size: 0.9em;
      background: url(../images/pic/bullet_arrow.gif) no-repeat left 4px;
      padding-left: 16px;
    }

    ul#breadcrumb li span {
      color: #999999;
    }

/* =tab content
-----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.shadetabs {
  padding: 0px 0 10px 0;
  margin-left: 0;
  margin-top: 0px;
  margin-bottom: 0px;
  list-style-type: none;
  text-align: left; /*set to left, center, or right to align the menu as desired*/
}

  .shadetabs li {
    display: inline;
    margin: 0;
  }

    .shadetabs li a {
      font-family: 微軟正黑體;
      text-decoration: none;
      position: relative;
      z-index: 0;
      padding: 7px 20px;
      margin-right: 1px;
      border: 1px solid #dfddce;
      border-bottom: none;
      color: #555;
      background: url(../images/pic/bg_tab_up.gif) bottom left repeat-x;
      top: 3px;
      /*Do rounding (native in Firefox and Safari)
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;*/
    }
      /*.shadetabs li a:visited{ color: #2d2b2b;}*/
      .shadetabs li a:hover {
        color: #fff;
        background: url(../images/pic/bg_tab_over.gif) top left repeat-x;
      }

      .shadetabs li a.selected { /*selected main tab style */
        position: relative;
        top: 5px;
        color: #fff;
        background: url(../images/pic/bg_tab_over.gif) top left repeat-x;
        border-bottom-color: #fff;
      }

        .shadetabs li a.selected:hover { /*selected main tab style */
          text-decoration: none;
        }

.tabcontent {
  display: none;
}

.tabframe {
  border-top: 3px solid #dfddce;
  padding: 15px;
  margin-bottom: 15px;
}

.shadetabsline {
  border-top: 1px solid #999999;
  margin-bottom: 1em;
  padding: 15px 0 0 0;
}

/* Footer
------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#footer {
  padding: 20px 0;
  clear: both;
}

#footerInner {
  margin: 0 auto;
  text-align: center;
  line-height: 1.5em;
  font-size: 0.75em;
}

  #footerInner a {
    color: #0278d4;
  }

    #footerInner a:hover {
      color: #C00;
    }

/*  Index_訓練新訊 */
#title_news {
  background: url(../images/pic/bg_title.gif) repeat-x left top;
  height: 27px;
}

  #title_news h1 {
    margin: 0 0 0 10px;
    padding: 0 0 0 10px;
    background-color: #fff;
    display: inline-block;
    width: 140px;
  }

    #title_news h1 span {
      background: url(../images/pic/icon_info.png) no-repeat left top;
      padding-left: 35px;
    }

.newsBorder {
  border: 3px solid #ff8c8c;
  overflow: hidden;
  min-width: 560px;
}

/*   最新消息  */
.News {
  margin: 0 auto;
}

  .News ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .News li {
    margin: 0;
    padding: 7px 0;
    background: url(../images/pic/bullet_sq.gif) no-repeat 6px 15px;
    border-bottom: 1px solid #c2b7af;
    padding-left: 16px;
    line-height: 1.35em;
  }

    .News li.none {
      border-bottom: none;
    }

  .News .date {
    color: #888;
    font: normal 0.85em Arial, Helvetica, sans-serif;
  }

/*  Login */
#LoginBox1, .searchBox {
  border: 2px solid #ececec;
  background-color: #fafafa;
  padding: 10px;
}

#LoginBox2, .searchBox {
  border: 2px solid #ececec;
  background-color: #fafafa;
  padding: 10px;
}

/*  OtherLInk  */
.AdBox {
  width: 128px;
  border: 2px solid #ececec;
  background-color: #fff;
  padding: 10px;
  text-align: center;
}

  .AdBox img {
    margin-bottom: 3px;
  }

/* 年度計畫選單 */
ul#proMenu {
  margin: 0;
  padding: 0;
  list-style: none;
}

  ul#proMenu li {
    float: left;
    margin-right: 3px;
    /*margin-top:5px;*/
  }

    ul#proMenu li a.butPro {
      background: url(../images/pic/bg_tab_up.gif) repeat-x left top;
      height: 23px;
      /*display: block;友善列印會死 By Casper*/
      text-align: center;
      padding:6px 15px 5px 15px;
      color: #0a76b1;
      border: 1px solid #bbb;
      font-family: 微軟正黑體;
    }

    ul#proMenu li a:hover.butPro, ul#proMenu li a.selected {
      background: url(../images/pic/bg_tab_over.gif) repeat-x left top;
      text-decoration: none;
      color: #fff;
      border: 1px solid #269ee0;
    }

.logarea {
  font: bold 0.9em 微軟正黑體;
}

  .logarea p {
    clear: left;
    margin: 0;
    padding: 0 0 2px 0;
    vertical-align: middle;
    text-align: left;
  }

    .logarea p.none {
      border-bottom: 0px;
    }

    .logarea p label {
      float: left;
      width: 60px;
      text-align: left;
    }

      .logarea p label span {
        color: #C00;
        margin-left: 5px;
      }




/*textbox*/

.ui-text-upper {
  text-transform: uppercase;
}

.ui-text-zip {
  text-align: left !important;
}

.ui-text-int {
  text-align: right !important;
}

.ui-text-money {
  text-align: right !important;
}

.ui-text-decimal {
  text-align: right !important;
}

.ui-text-year, .ui-text-month {
  text-align: center !important;
}

.ui-text-readonly {
  border: 0px solid #999999 !important;
  background-color: white !important;
  border-bottom: 1px solid #999999 !important;
}

.ui-text-center {
  text-align: center !important;
}

.ui-text-Locked {
  background-color: #dcdcdc !important;
}

.ui-text-alphanumeric {
  text-transform: uppercase;
}

.ui-text-organ {
  text-transform: uppercase;
}

.ui-text-idno {
  text-transform: uppercase;
}

.ui-hide {
  display: none;
  visibility: hidden;
}

/* #region label */
.ui-label-2, .ui-label-3, .ui-label-4, .ui-label-5, .ui-label-6, .ui-label-7, .ui-label-8, .ui-label-9, .ui-label-10
{
  display: block;
  float: right;
  text-align: left;
  margin-right: 1px;
}

.ui-label-2
{
  width: 2em;
}

.ui-label-3
{
  width: 3em;
}

.ui-label-4
{
  width: 4em;
  height: 13px;
}

.ui-label-5
{
  width: 5em;
}

.ui-label-6
{
  width: 6em;
}

.ui-label-7
{
  width: 7em;
}

.ui-label-8
{
  width: 8em;
}

.ui-label-9
{
  width: 9em;
}

.ui-label-10
{
  width: 10em;
}

/* #endregion label */