/* CSS Document */
html.home {
    height: 100%;
    box-sizing: border-box;
}

    html.home body {
        height: 100%;
        box-sizing: border-box;
    }

body {
    /* background: url('../images/body_bg.gif') repeat-x top left; */
    background-color: #FFFFFF;
    background-image: -moz-linear-gradient(top, circle cover, #FFFFFF 25%, #d7c4aa 95%);
    background-image: -o-linear-gradient(top, circle cover, #FFFFFF 25%, #d7c4aa 95%);
    background-image: -webkit-gradient(radial, top, circle cover, #FFFFFF 25%, #d7c4aa 95%);
    background-image: -webkit-radial-gradient(top, circle cover, #FFFFFF 25%, #d7c4aa 95%);
    background-image: radial-gradient(top, circle cover, #FFFFFF 25%, #d7c4aa 95%);
    background-repeat: no-repeat;
    margin: 0px;
    font-size: 16px;
    line-height: 24px;
}

/*共用*/
.title {
    font-family: 微軟正黑體,標楷體;
    font-size: 16px;
    background-color: #FFCCFF;
    color: #000000;
    text-align: center;
}

.content {
    font-family: 新細明體;
    font-size: 16px;
    background-color: #fff5ee;
    color: #800000;
    text-align: center;
}

.contentrt {
    font-family: 新細明體;
    font-size: 16px;
    background-color: #FFFFCC;
    color: #800000;
    text-align: center;
}

.contentrn {
    font-family: 新細明體;
    font-size: 16px;
    background-color: #ffc0cb;
    color: #800000;
    text-align: center;
}

.contentt {
    font-family: 新細明體;
    font-size: 16px;
    background-color: #faebd7;
    color: #800000;
    text-align: center;
}

h2 {
    color: #990000;
}

/*登入首頁*/
@media screen and (max-height: 475px) {
    .ln_idx .ln_idx_bg_valign {
        position: absolute !important;
        top: 50px;
    }
}

@media screen and (min-height: 476px) {
    .ln_idx .ln_idx_bg_valign {
        position: absolute !important;
        top: calc(50% - 196px);
    }
}

.ln_idx {
    width: 628px;
    height: 393px;
    /*margin-top: 50px;*/
    user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -moz-user-focus: ignore;
    -ms-touch-select: none;
    -ms-user-select: none;
    cursor: default;
}

    .ln_idx .ln_idx_bg_base {
        box-shadow: #494949 1px 1px 30px;
    }

    .ln_idx .ln_idx_bg {
        position: relative;
        background: url('../images/ln_idx_bg.gif?') no-repeat top left transparent;
        width: 628px;
        height: 393px;
    }

    .ln_idx .ln_idx_bg_v {
        position: relative;
        background: url('../images/ln_idx_bg_v.gif?') no-repeat top left transparent;
        width: 628px;
        height: 393px;
    }

    .ln_idx .ln_idx_bg_sch {
        position: relative;
        background: url('../images/ln_idx_bg_sch.gif?') no-repeat top left transparent;
        width: 628px;
        height: 393px;
    }

    .ln_idx .ln_idx_bg_v_sch {
        position: relative;
        background: url('../images/ln_idx_bg_v_sch.gif?') no-repeat top left transparent;
        width: 628px;
        height: 393px;
    }

    .ln_idx .ln_idx_f01 {
        position: absolute;
        left: 412px;
        top: 153px;
    }

    .ln_idx .ln_idx_f02 {
        position: absolute;
        left: 412px;
        top: 208px;
    }

    .ln_idx .ln_idx_f03 {
        position: absolute;
        left: 412px;
        top: 258px;
        text-align: left;
    }

    .ln_idx .ln_idx_f04 {
        position: absolute;
        left: 0px;
        top: 95px;
        width: 358px;
        text-align: left;
    }

    .ln_idx .ln_idx_f05 {
        position: absolute;
        width: 260px;
        height: 102px;
        left: 342px;
        top: 332px;
    }

        .ln_idx .ln_idx_f05 .bt_01 {
            background: url('../images/bt_01.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            margin: 0px 0px 0px 3px;
            cursor: pointer;
        }

        .ln_idx .ln_idx_f05 .bt_02 {
            background: url('../images/bt_02.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            margin: 0px 0px 0px 3px;
            cursor: pointer;
        }

        .ln_idx .ln_idx_f05 .bt_03 {
            background: url('../images/bt_03.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            margin: 0px 0px 0px 3px;
            cursor: pointer;
        }

    .ln_idx .ln_idx_f06 {
        position: absolute;
        left: 0px;
        top: 366px;
        width: 100%;
        text-align: center;
        font-size: 11px;
        font-family: Arial, 'Times New Roman', 新細明體,微軟正黑體;
    }

    /*#region 舊樣式 */

    .ln_idx .ln_idx_01 {
        background: url('../images/ln_idx_01.gif') no-repeat bottom right;
        width: 280px;
        height: 186px;
        float: left;
    }

    .ln_idx .ln_idx_02 {
        background: url('../images/ln_idx_02.gif') no-repeat bottom right;
        width: 260px;
        height: 186px;
        float: left;
    }

    .ln_idx .ln_idx_03 {
        background: url('../images/ln_idx_03.gif') no-repeat bottom right;
        width: 88px;
        height: 186px;
        float: left;
    }

    .ln_idx .ln_idx_04 {
        background: url('../images/ln_idx_04.gif') no-repeat bottom right;
        width: 280px;
        height: 105px;
        float: left;
    }

    .ln_idx .ln_idx_05 {
        background: url('../images/ln_idx_05.gif') no-repeat bottom right;
        width: 260px;
        height: 105px;
        float: left;
        vertical-align: top;
    }

        .ln_idx .ln_idx_05 .divtop {
            width: 250px;
        }

        .ln_idx .ln_idx_05 .divtop_02 {
            width: 250px;
            margin-top: 30px;
        }

        .ln_idx .ln_idx_05 INPUT {
            width: 250px;
            font-size: 13px;
            color: #336633;
        }

    .ln_idx .ln_idx_06 {
        background: url('../images/ln_idx_06.gif') no-repeat bottom right;
        width: 88px;
        height: 105px;
        float: left;
    }

    .ln_idx .ln_idx_07 {
        background: url('../images/ln_idx_07.gif') no-repeat top right;
        width: 280px;
        height: 102px;
        float: left;
    }

    .ln_idx .ln_idx_08 {
        background: url('../images/ln_idx_08.gif?2021') no-repeat top right;
        width: 260px;
        height: 102px;
        float: left;
        vertical-align: top;
    }

        .ln_idx .ln_idx_08 .bt_01 {
            background: url('../images/bt_01.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            float: right;
            margin: 0px 3px;
            cursor: pointer;
            cursor: pointer;
        }

        .ln_idx .ln_idx_08 .bt_02 {
            background: url('../images/bt_02.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            float: right;
            margin: 0px 3px;
            cursor: pointer;
            cursor: pointer;
        }

        .ln_idx .ln_idx_08 .bt_03 {
            background: url('../images/bt_03.gif') no-repeat center center;
            width: 58px;
            height: 24px;
            float: right;
            margin: 0px 3px;
            cursor: pointer;
            cursor: pointer;
        }

    .ln_idx .ln_idx_09 {
        background: url('../images/ln_idx_09.gif') no-repeat top right;
        width: 88px;
        height: 102px;
        float: left;
    }

/*#endregion */

/*上方標題*/
.top_title_bg {
    background: url('../images/top_title_bg.gif') repeat-x top left;
    width: 100%;
    height: 98px;
    margin-top: 0px;
}

    .top_title_bg .top_title {
        background: url('../images/top_title.gif') no-repeat top left;
        width: 335px;
        height: 98px;
        float: left;
    }

    .top_title_bg .top_r {
        background: url('../images/top_title_02.gif') no-repeat top left;
        height: 70px;
        width: 400px;
        font-family: 微軟正黑體,標楷體;
        font-size: 26px;
        font-weight: bold;
        color: #DB6E02;
        text-shadow: 2px 2px 4px #CCC1C4;
        float: left;
        padding-top: 28px;
        cursor: default;
    }

/*左方選單*/
.left_menu {
    width: 138px;
    height: 50px;
    background: linear-gradient(180deg, #b59e7e 50%, #d4bfa1 82%,#766142 100%);
    background: -moz-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 82%,#766142 100%);
    background: -webkit-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 82%,#766142 100%);
    background: -o-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 82%,#766142 100%);
    /*background: linear-gradient(180deg, #547293 50%, #7e9dbf 82%,#36516f 100%);
    background: -moz-linear-gradient(270deg, #547293 50%, #7e9dbf 82%,#36516f 100%);
    background: -webkit-linear-gradient(270deg, #547293 50%, #7e9dbf 82%,#36516f 100%);
    background: -o-linear-gradient(270deg, #547293 50%, #7e9dbf 82%,#36516f 100%);*/
    cursor: default;
}

.left_font {
    font-family: 標楷體;
    font-size: 18pt;
    font-weight: 800;
    text-align: center;
    letter-spacing: 0.25rem;
    color: #fff07d;
    text-shadow: -1px 1px 1px #7d694b;
    /*text-shadow: 0.5px 0.5px 0px #444444;*/
    position: relative;
    top: 8px;
}

.left_menu_bg {
    background-color: #766142;
    /*background: #fffdf9 url(../images/left_menu_bg.gif) repeat-x top left;*/
    /*background: linear-gradient(180deg, #5b7797 50%, #86a1bf 68%,#36516f 100%);
    background: -moz-linear-gradient(270deg, #5b7797 50%, #86a1bf 68%,#36516f 100%);
    background: -webkit-linear-gradient(270deg, #5b7797 50%, #86a1bf 68%,#36516f 100%);
    background: -o-linear-gradient(270deg, #5b7797 50%, #86a1bf 68%,#36516f 100%);*/
    background: linear-gradient(180deg, #b59e7e 50%, #d4bfa1 68%,#766142 100%);
    background: -moz-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 68%,#766142 100%);
    background: -webkit-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 68%,#766142 100%);
    background: -o-linear-gradient(270deg, #b59e7e 50%, #d4bfa1 68%,#766142 100%);
    background-repeat: no-repeat;
}

.icom_menu {
    /*background: url('../images/icom_menu.gif') no-repeat top left;*/
    font-family: 標楷體;
    font-size: 16pt;
    font-weight: bold;
    text-align: center;
    height: 20px;
    color: #ffffff;
    text-shadow: 1px 1px 0px #53432a;
    cursor: pointer;
    /*padding-left: 10px;*/
    margin: 10px 0 10px 0;
}

    .icom_menu a:link, .icom_menu a:active, .icom_menu a:visited {
        color: #FFF;
        text-decoration: none;
    }

    .icom_menu a:hover {
        background: #a05102;
        color: #fff000;
    }

.icom_menu_5 {
    font-size: 18px;
}

/*右方選單*/
/*第一頁內容*/
.right_a_01 {
    background: #f0f0f0 url(../images/right_a_01.gif) repeat-x top left !important;
    padding-top: 12px !important;
    /*padding-left: 20px !important;
    padding-right: 20px !important;*/
    padding-bottom: 20px !important;
}

    .right_a_01 .r_t_01 {
        font-family: 微軟正黑體,標楷體;
        font-size: 24px;
    }

    .right_a_01 .r_t_0001 {
        background: url('../images/r_t_0001.gif') no-repeat top left;
        width: 200px;
        height: 19px;
        line-height: 19px;
        padding-left: 7px;
        font-family: 微軟正黑體,標楷體;
        font-size: 18px;
    }

    .right_a_01 .icom_r_01 {
        background: url('../images/icom_r_01.gif') no-repeat top left;
        padding-left: 20px;
        width: 150px;
        color: #cc6600;
        font-weight: bold;
        line-height: 18px;
        float: left;
        text-align: right;
    }

    .right_a_01 .by_p {
        margin: 10px;
    }

        .right_a_01 .by_p .by_c {
            margin: 0px 12px;
            height: 19px;
        }
/*第二頁內容*/
.right_a_02 {
    padding-top: 32px !important;
    padding-bottom: 20px !important;
}

    .right_a_02 .r_t_01 {
        font-family: 微軟正黑體,標楷體;
        font-size: 24px;
    }

    .right_a_02 .r_t_0001 {
        background: url('../images/r_t_0001.gif') no-repeat top left;
        width: 200px;
        height: 19px;
        line-height: 19px;
        padding-left: 7px;
        font-family: 微軟正黑體,標楷體;
        font-size: 18px;
    }

    .right_a_02 .icom_r_01 {
        background: url('../images/icom_r_01.gif') no-repeat top left;
        padding-left: 20px;
        width: 150px;
        color: #cc6600;
        font-weight: bold;
        line-height: 18px;
        float: left;
        text-align: right;
    }

    .right_a_02 .by_p {
        margin: 10px;
    }

        .right_a_02 .by_p .by_c {
            margin: 0px 12px;
            height: 19px;
        }

/*文字色碼*/
.txt_01 {
    color: #f00;
}

.txt_02 {
    color: #00c;
}

.txt_03 {
    color: #06f;
    font-family: 微軟正黑體,標楷體;
    font-size: 16px;
}

.txt_04 {
    color: #8a2be2;
}
/*一年級科名*/
.txt_05 {
    color: #660033 !important;
}
/*一年級科目*/
.txt_06 {
    color: #006699 !important;
}
/*二年級科名*/
.txt_07 {
    color: #006600 !important;
}

.txt_08 {
    color: #900;
}

.txt_09 {
    color: #666;
}
/*灰色*/
.txt_10 {
    color: #900;
    font-size: 24px !important;
}
/*標題*/
.txt_11 {
    color: #00c;
    font-family: "微軟正黑體,標楷體";
    line-height: 36px;
}

.txt_12 {
    color: #333;
}

.txt_13 {
    color: #c60;
}

/*所有標題*/
/*選課預選作業*/
.right_title_a00 {
    background: url('../images/right_title_a00.png') no-repeat top left;
    width: 200px;
    height: 40px;
    margin-top: 5px;
}
/*選填志願作業*/
.right_title_a01 {
    background: url('../images/right_title_a01.png') no-repeat top left;
    width: 200px;
    height: 40px;
    margin-top: 5px;
}
/*選修課程開課時段課表表*/
.right_title_a02 {
    background: url('../images/right_title_a02.png') no-repeat top left;
    width: 324px;
    height: 40px;
    margin-top: 5px;
}
/*一次加選作業*/
.right_title_a03 {
    background: url('../images/right_title_a03.png') no-repeat top left;
    width: 200px;
    height: 40px;
    margin-top: 5px;
}
/*加退選作業*/
.right_title_a03r {
    background: url('../images/right_title_a03r.png?20180125') no-repeat top left;
    width: 166px;
    height: 40px;
    margin-top: 5px;
}
/* 正式選課作業 */
.right_title_a03f {
    background: url('../images/right_title_a03f.png') no-repeat top left;
    width: 198px;
    height: 40px;
    margin-top: 5px;
}
/*一次加選作業*/
.right_title_a06 {
    background: url('../images/right_title_a06.png') no-repeat top left;
    width: 198px;
    height: 40px;
    margin-top: 5px;
}
/*選修課程個人課表*/
.right_title_a04 {
    background: url('../images/right_title_a04.png') no-repeat top left;
    width: 259px;
    height: 40px;
    margin-top: 5px;
}
/*選修課程個人課表*/
.right_title_a04x {
    background: url('../images/right_title_a04x.png') no-repeat top left;
    width: 138px;
    height: 40px;
    margin-top: 5px;
}
/*選課結果查詢*/
.right_title_a05 {
    background: url('../images/right_title_a05.png') no-repeat top left;
    width: 200px;
    height: 40px;
    margin-top: 5px;
}

/*重補修開課時段課表*/
.tdHeader {
    background-color: #6b7d75;
    text-align: center;
    font-family: 微軟正黑體,標楷體;
    font-size: 12pt;
    width: 80px;
    color: #FFFFFF;
    border: 1px solid #b0b1b2;
}

.tdTableTitle {
    background-color: #d2dbbf;
    TEXT-ALIGN: center;
    font-family: 微軟正黑體,標楷體;
    font-size: 12pt;
    color: #333333;
}

.tdTableTitle_02 {
    background-color: #afb99b;
    TEXT-ALIGN: center;
    font-family: 微軟正黑體,標楷體;
    font-size: 13pt;
    color: #333333;
}

.tdColumn {
    background-color: #eff2e8;
    text-align: left;
    font-size: 12pt;
    width: 200px;
}

.tdhr {
    background-color: #bdc4b5;
    height: 3px;
}

.bk_g01 {
    background-color: #6b7d75;
    text-align: center;
    line-height: 24px;
    width: 24px;
    color: #FFFFFF;
}

.bk_g02 td {
    background-color: #ebebde;
    text-align: center;
}

/*按鈕*/
/*確定*/
.bt_04 {
    background: url('../images/bt_04.gif') no-repeat center center;
    width: 58px;
    height: 24px;
    margin: 0px 3px;
    cursor: pointer;
}
/*列印*/
.bt_05 {
    background: url('../images/bt_05.gif') no-repeat center center;
    width: 58px;
    height: 24px;
    margin: 0px 3px;
    cursor: pointer;
}
/*說明*/
.bt_06 {
    background: url('../images/bt_06.gif') no-repeat center center;
    width: 58px;
    height: 24px;
    margin: 0px 3px;
    cursor: pointer;
}
/*列印畫面*/
.bt_07 {
    background: url('../images/bt_07.gif') no-repeat center center;
    width: 90px;
    height: 24px;
    margin: 0px 3px;
    cursor: pointer;
}
/*說明*/
.bt_08 {
    background: url('../images/bt_08.gif') no-repeat center center;
    width: 106px;
    height: 24px;
    margin: 0px 3px;
    cursor: pointer;
}

.close_img {
    background: url('../images/close_img.gif') no-repeat center center;
    width: 289px;
    height: 117px;
    margin: 50px 30px;
    cursor: pointer;
    cursor: pointer;
}

.noborder, .noborder th, .noborder td {
    border: none 0px white;
}

.nopadding, .nopadding th, .nopadding td {
    padding: 0px !important;
}

.nomargin, .nomargin th, .nomargin td {
    margin: 0px !important;
}

table.collapse, .collapse th, .collapse td {
    border-collapse: collapse;
}

.brk01, .brk01 td {
    word-break: break-all;
    word-wrap: break-word;
}

.hidden {
    display: none;
}

@media print {
    .prn {
        display: none;
    }
}

.prn_margin {
    margin-bottom: 20px;
}

.unpass {
    color: red;
}

.required {
    color: red;
}

.redtext {
    color: red;
}

.pbrb {
    page-break-before: always;
}

.pbra {
    page-break-after: always;
}

/* css3 begin */
input[type=button].aspDisabled, label.aspDisabled {
    color: #808080 !important;
}

input[type=button].button.aspDisabled {
    border-color: #3F6D8D;
}

table.nopadding1 th, table.nopadding1 td {
    padding: 0px;
}

table.nospacing1 {
    border-spacing: 0px;
}

/* 2013.07.25 begin */

table.padding0 th, table.padding0 td {
    padding: 0px;
}

table.padding1 th, table.padding1 td {
    padding: 1px;
}

table.padding2 th, table.padding2 td {
    padding: 2px;
}

table.spacing0 {
    border-spacing: 0px;
}

table.spacing1 {
    border-spacing: 1px;
}

table.spacing2 {
    border-spacing: 2px;
}

table.margin0 th, table.margin0 td {
    margin: 0px;
}

/* 2013.07.25 end */

td.nowrap {
    white-space: nowrap;
}

/* align=center */
div.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

    div.center div, div.center span, div.center table, div.center img {
        margin-left: auto;
        margin-right: auto;
    }

table.center {
    margin-left: auto;
    margin-right: auto;
}

tr.center {
    text-align: center;
}

    tr.center div, tr.center span, tr.center table, tr.center img {
        margin-left: auto;
        margin-right: auto;
    }

td.center {
    text-align: center;
}

    td.center div, td.center span, td.center table, td.center img {
        margin-left: auto;
        margin-right: auto;
    }

fieldset.center {
    margin-left: auto;
    margin-right: auto;
}

/* align=left */
div.left {
    text-align: left;
}

    div.left div, div.left span, div.left table, div.left img {
        margin-right: auto;
    }

table.left {
    text-align: left;
}

tr.left {
    text-align: left;
}

    tr.left div, tr.left span, tr.left table, tr.left img {
        margin-right: auto;
    }

td.left {
    text-align: left;
}

    td.left div, td.left span, td.left table, td.left img {
        margin-right: auto;
    }

/* align=right */
div.right {
    text-align: right;
}

    div.right div, div.right span, div.right table, div.right img {
        margin-left: auto;
    }

table.right {
    text-align: right;
}

tr.right {
    text-align: right;
}

    tr.right div, tr.right span, tr.right table, tr.right img {
        margin-left: auto;
    }

td.right {
    text-align: right;
}

    td.right div, td.right span, td.right table, td.right img {
        margin-left: auto;
    }

/* valign=top */
tr.top th, tr.top td, th.top, td.top, img.top {
    vertical-align: top;
}

/* valign=middle */
tr.middle th, tr.middle td, th.middle, td.middle, img.middle {
    vertical-align: middle;
}

/* valign=bottom */
tr.bottom th, tr.bottom td, th.bottom, td.bottom, img.bottom {
    vertical-align: bottom;
}

/* border: solid 1px black */
table.border1 {
    border: solid 1px black;
}

    table.border1 th, table.border1 td {
        border: solid 1px black;
    }

/* nowrap */
.nowrap {
    white-space: nowrap;
}

/* css button */

/* dark-green */
.buttontype {
    background: url('../images/bt_bg.gif') repeat-x center center;
    color: #f0f8ff;
    font-family: 微軟正黑體,標楷體;
    font-size: 16px;
    border: inset 1PX #FFFFFF;
}

input.buttontype[type=button]:disabled {
    color: #e0e0e0;
    background-image: url('../images/bt_bg_disabled.gif');
    text-shadow: 1px 1px 5px black;
}

/* 2017-12-25 cyan */
input.css_btn_blue[type=button] {
    padding: 1px 10px 3px 10px;
    font-size: 12pt;
    font-family: Microsoft JhengHei,PMingLiU;
    text-decoration: none;
    border: solid 1px hsl(195, 71.3%, 32.7%);
    color: #fff;
    background-color: hsl(195, 72.7%, 55.5%);
    background-image: linear-gradient(bottom, hsl(195, 64.2%, 48.2%) 0%, hsl(195, 76.3%, 57.1%) 100%);
    background-image: -o-linear-gradient(bottom, hsl(195, 64.2%, 48.2%) 0%, hsl(195, 76.3%, 57.1%) 100%);
    background-image: -moz-linear-gradient(bottom, hsl(195, 64.2%, 48.2%) 0%, hsl(195, 76.3%, 57.1%) 100%);
    background-image: -webkit-linear-gradient(bottom, hsl(195, 64.2%, 48.2%) 0%, hsl(195, 76.3%, 57.1%) 100%);
    background-image: -ms-linear-gradient(bottom, hsl(195, 64.2%, 48.2%) 0%, hsl(195, 76.3%, 57.1%) 100%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(195, 64.2%, 48.2%)), color-stop(1, hsl(195, 76.3%, 57.1%)) );
    -webkit-box-shadow: inset 0px 1px 0px hsl(195, 80.3%, 72.2%), 0px 1px 0px #fff;
    -moz-box-shadow: inset 0px 1px 0px hsl(195, 80.3%, 72.2%), 0px 1px 0px #fff;
    box-shadow: inset 0px 1px 0px hsl(195, 80.3%, 72.2%), 0px 1px 0px #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    /*-o-border-radius: 5px;*/
    border-radius: 5px;
}

    input.css_btn_blue[type=button]::before {
        background-color: hsl(213.3, 9.7%, 81.8%);
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        padding: 8px;
        left: -8px;
        top: -8px;
        z-index: -1;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        /*-o-border-radius: 5px;*/
        border-radius: 5px;
        -webkit-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
        -moz-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
        /*-o-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;*/
        box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
    }

    input.css_btn_blue[type=button]:active {
        top: 1px;
        background-image: linear-gradient(bottom, hsl(195, 76.3%, 57.1%) 0%, hsl(195, 64.2%, 48.2%) 100%);
        background-image: -o-linear-gradient(bottom, hsl(195, 76.3%, 57.1%) 0%, hsl(195, 64.2%, 48.2%) 100%);
        background-image: -moz-linear-gradient(bottom, hsl(195, 76.3%, 57.1%) 0%, hsl(195, 64.2%, 48.2%) 100%);
        background-image: -webkit-linear-gradient(bottom, hsl(195, 76.3%, 57.1%) 0%, hsl(195, 64.2%, 48.2%) 100%);
        background-image: -ms-linear-gradient(bottom, hsl(195, 76.3%, 57.1%) 0%, hsl(195, 64.2%, 48.2%) 100%);
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(195, 76.3%, 57.1%)), color-stop(1, hsl(195, 64.2%, 48.2%)) );
    }

    input.css_btn_blue[type=button]:disabled {
        border: solid 1px hsl(195, 15%, 32.7%);
        color: #f0f0f0;
        background-color: #3bb3e0;
        background-image: linear-gradient(bottom, hsl(195, 24.5%, 47.3%) 0%, hsl(195, 26.6%, 57.3%) 100%);
        background-image: -o-linear-gradient(bottom, hsl(195, 24.5%, 47.3%) 0%, hsl(195, 26.6%, 57.3%) 100%);
        background-image: -moz-linear-gradient(bottom, hsl(195, 24.5%, 47.3%) 0%, hsl(195, 26.6%, 57.3%) 100%);
        background-image: -webkit-linear-gradient(bottom, hsl(195, 24.5%, 47.3%) 0%, hsl(195, 26.6%, 57.3%) 100%);
        background-image: -ms-linear-gradient(bottom, hsl(195, 24.5%, 47.3%) 0%, hsl(195, 26.6%, 57.3%) 100%);
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(195, 7%, 56%)), color-stop(1, hsl(195, 11%, 67%)) );
        -webkit-box-shadow: inset 0px 1px 0px hsl(195, 10.1%, 70.8%), 0px 1px 0px #fff;
        -moz-box-shadow: inset 0px 1px 0px hsl(195, 10.1%, 70.8%), 0px 1px 0px #fff;
        box-shadow: inset 0px 1px 0px hsl(195, 10.1%, 70.8%), 0px 1px 0px #fff;
        text-shadow: #686868 1px 1px 1px;
        /*text-shadow: -1px 0 #333,0 -1px #333,1px 0 #fff,0 1px #fff;*/
    }

input.css_btn_red[type=button] {
    padding: 1px 10px 3px 10px;
    font-size: 12pt;
    font-family: Microsoft JhengHei,PMingLiU;
    text-decoration: none;
    border: solid 1px hsl(345, 71.3%, 32.7%);
    color: #fff;
    background-color: hsl(345, 72.7%, 55.5%);
    background-image: linear-gradient(bottom, hsl(345, 64.2%, 48.2%) 0%, hsl(345, 76.3%, 57.1%) 100%);
    background-image: -o-linear-gradient(bottom, hsl(345, 64.2%, 48.2%) 0%, hsl(345, 76.3%, 57.1%) 100%);
    background-image: -moz-linear-gradient(bottom, hsl(345, 64.2%, 48.2%) 0%, hsl(345, 76.3%, 57.1%) 100%);
    background-image: -webkit-linear-gradient(bottom, hsl(345, 64.2%, 48.2%) 0%, hsl(345, 76.3%, 57.1%) 100%);
    background-image: -ms-linear-gradient(bottom, hsl(345, 64.2%, 48.2%) 0%, hsl(345, 76.3%, 57.1%) 100%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(345, 64.2%, 48.2%)), color-stop(1, hsl(345, 76.3%, 57.1%)) );
    -webkit-box-shadow: inset 0px 1px 0px hsl(345, 80.3%, 72.2%), 0px 1px 0px #fff;
    -moz-box-shadow: inset 0px 1px 0px hsl(345, 80.3%, 72.2%), 0px 1px 0px #fff;
    box-shadow: inset 0px 1px 0px hsl(345, 80.3%, 72.2%), 0px 1px 0px #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    /*-o-border-radius: 5px;*/
    border-radius: 5px;
}

    input.css_btn_red[type=button]::before {
        background-color: hsl(213.3, 9.7%, 81.8%);
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        padding: 8px;
        left: -8px;
        top: -8px;
        z-index: -1;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        /*-o-border-radius: 5px;*/
        border-radius: 5px;
        -webkit-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
        -moz-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
        /*-o-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;*/
        box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
    }

    input.css_btn_red[type=button]:active {
        top: 1px;
        background-image: linear-gradient(bottom, hsl(345, 76.3%, 57.1%) 0%, hsl(345, 64.2%, 48.2%) 100%);
        background-image: -o-linear-gradient(bottom, hsl(345, 76.3%, 57.1%) 0%, hsl(345, 64.2%, 48.2%) 100%);
        background-image: -moz-linear-gradient(bottom, hsl(345, 76.3%, 57.1%) 0%, hsl(345, 64.2%, 48.2%) 100%);
        background-image: -webkit-linear-gradient(bottom, hsl(345, 76.3%, 57.1%) 0%, hsl(345, 64.2%, 48.2%) 100%);
        background-image: -ms-linear-gradient(bottom, hsl(345, 76.3%, 57.1%) 0%, hsl(345, 64.2%, 48.2%) 100%);
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(345, 76.3%, 57.1%)), color-stop(1, hsl(345, 64.2%, 48.2%)) );
    }

    input.css_btn_red[type=button]:disabled {
        border: solid 1px hsl(345, 15%, 32.7%);
        color: #f0f0f0;
        background-color: #3bb3e0;
        background-image: linear-gradient(bottom, hsl(345, 24.5%, 47.3%) 0%, hsl(345, 26.6%, 57.3%) 100%);
        background-image: -o-linear-gradient(bottom, hsl(345, 24.5%, 47.3%) 0%, hsl(345, 26.6%, 57.3%) 100%);
        background-image: -moz-linear-gradient(bottom, hsl(345, 24.5%, 47.3%) 0%, hsl(345, 26.6%, 57.3%) 100%);
        background-image: -webkit-linear-gradient(bottom, hsl(345, 24.5%, 47.3%) 0%, hsl(345, 26.6%, 57.3%) 100%);
        background-image: -ms-linear-gradient(bottom, hsl(345, 24.5%, 47.3%) 0%, hsl(345, 26.6%, 57.3%) 100%);
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, hsl(345, 9%, 47.3%)), color-stop(1, hsl(345, 15%, 57.3%)) );
        -webkit-box-shadow: inset 0px 1px 0px hsl(345, 10.1%, 70.8%), 0px 1px 0px #fff;
        -moz-box-shadow: inset 0px 1px 0px hsl(345, 10.1%, 70.8%), 0px 1px 0px #fff;
        box-shadow: inset 0px 1px 0px hsl(345, 10.1%, 70.8%), 0px 1px 0px #fff;
        /*text-shadow: 1px 1px 5px black;*/
    }

.title_block {
    font-size: 14pt;
    font-family: 微軟正黑體,標楷體;
    color: hsl(195, 2%, 18%);
    text-align: center;
    border: 1px solid #f0f0f0;
    /*border-radius:5px;*/
    width: 120px;
    height: 40px;
    line-height: 40px;
    background-color: #eff2e8;
}

    .title_block.date {
        width: 240px;
    }

    .title_block.title {
        color: white;
        background-color: #6b7d75;
    }

.css_table {
    display: table;
}

.css_tr {
    display: table-row;
    box-shadow: 2px 2px 2px rgba(20%,20%,40%,0.6),4px 4px 6px rgba(20%,20%,40%,0.4),6px 6px 12px rgba(20%,20%,40%,0.4);
}

.css_td {
    display: table-cell;
    border: 1px solid #cacaca;
}

.bg {
    background: url('../images/bg1.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.ontopdiv {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    z-index: 10000;
    /*background: rgba(65, 103, 146, 0.70);*/
    /*background: linear-gradient(270deg, #54779d 50%, #96b2d1 82%,#416792 100%);*/
    /*background: linear-gradient(270deg, #54779d 50%, #96b2d1 82%,#416792 100%);*/
    background: linear-gradient(180deg, rgba(181, 158, 126, 0.70) 50%, rgba(212, 191, 161, 0.70) 82%,rgba(118, 97, 66, 0.70) 100%);
    background: -moz-linear-gradient(270deg, rgba(181, 158, 126, 0.70) 50%, rgba(212, 191, 161, 0.70) 82%,rgba(118, 97, 66, 0.70) 100%);
    background: -webkit-linear-gradient(270deg, rgba(181, 158, 126, 0.70) 50%, rgba(212, 191, 161, 0.70) 82%,rgba(118, 97, 66, 0.70) 100%);
    background: -o-linear-gradient(270deg, rgba(181, 158, 126, 0.70) 50%, rgba(212, 191, 161, 0.70) 82%,rgba(118, 97, 66, 0.70) 100%);
}

.ontopdiv_left1 {
    float: left;
    position: fixed;
    top: 40px;
    left: 10px;
}

/*.border_shadow {
    box-shadow: 2px 2px 2px rgba(20%,20%,40%,0.6),4px 4px 6px rgba(20%,20%,40%,0.4),6px 6px 12px rgba(20%,20%,40%,0.4);
    margin-bottom: 20px;
}*/

.fontoutter {
    font-family: 微軟正黑體,標楷體;
    font-size: 20pt;
    font-weight: bold;
    color: rgb(65, 103, 146);
    text-shadow: white 0px 2px, white 2px 0px, white -2px 0px, white 0px -2px, white -1.4px -1.4px, white 1.4px 1.4px, white 1.4px -1.4px, white -1.4px 1.4px;
}

.note_title {
    width: auto;
    font-size: 14pt;
    font-family: 微軟正黑體,標楷體;
    font-weight: 800;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: hsl(344, 19%, 53%);
    position: relative;
}

.note_content {
    font-family: 微軟正黑體,標楷體;
    border-radius: 2px;
    background: #fafafa;
    margin: 5px;
    width: 100%;
    max-width: 1000px;
    box-sizing: content-box;
    color: black;
    /*box-shadow:2px 2px 2px rgba(20%,20%,40%,0.6),4px 4px 6px rgba(20%,20%,40%,0.4),6px 6px 12px rgba(20%,20%,40%,0.4);*/
    margin-top: -8px;
}

@media screen {
    .border_shadow {
        box-shadow: 2px 2px 2px rgba(20%,20%,40%,0.6),4px 4px 6px rgba(20%,20%,40%,0.4),6px 6px 12px rgba(20%,20%,40%,0.4);
        margin-bottom: 20px;
    }
}

@media print {
    * {
        color: black !important;
        background-color: white !important;
    }

    .border_shadow {
        box-shadow: 0;
        margin-bottom: 0;
    }
}

/* css3 end */