/***
 *** MAIN STRUCTURE CSS Document
 ***
 ***
 *** - CSS RESET
 *** - GLOBAL SETUP
 *** - MAIN STRUCTRUE
 *** - FONT TYPE
 *** - TEMPLATE MAIN COMPONENT
 *** - -- HEADER
 *** - -- CONTAINTER
 *** - -- -- MAIN MENU
 *** - -- -- MAIN CONTENT
 *** - -- TABLE
 *** - -- INPUT UI
 *** - -- FOOTER
 ***
 ***/


/***
 *** BEGIN CSS RESET
 ***/


/***
 *** BEGIN GLOBAL SETUP
 ***/

@import url("notosanstc.css");
* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

body {
    width: 100%;
    height: 100%;
    /*  background: #FFF; */
    font-family: Noto Sans TC, Microsoft JhengHei, Apple LiGothic, Arial, Helvetica, sans-serif;
    /* font-family: "標楷體", "微軟正黑體", Arial, Helvetica, sans-serif; */
    margin: 0;
    padding: 0;
    /* background: url("../../Images/backpic_login_01.jpg") #000 50% 0 repeat;*/
    background: url("../../Images/Background.png") #000 50% 0 repeat;
    /*background-image: url("../../Images/Background.png");*/
}    

a:link,a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}


/***
 *** BEGIN MAIN STRUCTURE
 ***/

#wraper {
    position: relative;
    /* width: 100%; */
    height: 100%;
    margin: 0 auto;
    padding: 0;
}

#header {
    width: 100%;
    height: 90px;
    overflow: hidden;
    background: #000;
    margin: 0 auto;
    padding: 0;
}

#container {
    position: relative;
    width: 100%;
    height: 100%;
    /*   overflow: hidden; */
    margin: 0 auto;
    padding: 0;
}

#footer {
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    padding: 0;
}


/***
 *** FONT TYPE
 ***/


/***
 *** BEGIN TEMPLATE MAIN COMPONENT
 ***/


/*** BEGIN TEMPLATE MAIN COMPONENT :: HEADER ***/

#logo-area {
    float: left;
    /* display: inline-block; */
    width: 10.89%;
    overflow: hidden;
    margin: 1.75% 0 0 2.35%;
    padding: 0;
}

#logo-area img {
    width: 100%;
}

#log-info {
    position: relative;
    float: right;
    /*  display: inline-block; */
    width: 23%;
    overflow: hidden;
    margin: 1.15% 2.55% 0 0;
}

#log-info ul {
    clear: both;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

#log-info li.li-func-icon {
    float: right;
    /*  display: inline-block; */
    overflow: hidden;
    margin: 3.18% 8.15% 0 0;
    padding: 0;
}

#log-info li.li-func-icon img {
    width: 100%;
}

#log-info li.li-user-name {
    float: right;
    /*  display: inline-block; */
    overflow: hidden;
    color: #FFF;
    font-size: 1em;
    margin: 3% 2.5% 0 0;
    padding: 0;
}

#log-info li.li-user-icon {
    float: right;
    /*  display: inline-block; */
    width: 10.87%;
    overflow: hidden;
    text-align: center;
    margin: 0;
    padding: 0;
}

#log-info li.li-user-icon img {
    width: 100%;
}

.user-setting-menu {
    position: absolute;
    z-index: 999;
    top: 32px;
    right: 0;
    display: none;
    width: 120px;
    overflow: hidden;
    background: #FFF;
    padding: 12px 0;
    border: #DDD 1px solid;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.user-setting-menu ul {
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.user-setting-menu li {
    width: 100%;
    overflow: hidden;
    color: #394363;
    font-size: 0.813em;
    text-align: center;
    margin: 5% 0 8%;
    padding: 0;
    list-style: none;
}

.user-setting-menu li a:link,
.user-setting-menu li a:visited,
.user-setting-menu li a:hover {
    color: #394363;
    text-decoration: none;
}


/*** BEGIN TEMPLATE MAIN COMPONENT :: CONTAINER ***/


/*** BEGIN TEMPLATE MAIN COMPONENT :: CONTAINER :: MAIN MENU ***/

.main-menu {
    position: relative;
    float: left;
    /*   display: inline-block; */
    width: 15.62%;
    height: 100%;
    overflow: hidden;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2b2b2b+0,000000+100 */
    background: #2b2b2b;
    /* Old browsers */
    background: -moz-linear-gradient(top, #2b2b2b 0%, #000000 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #2b2b2b 0%, #000000 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #2b2b2b 0%, #000000 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#000000', GradientType=0);
    /* IE6-9 */
    margin: 0;
    padding: 0;
}

.left_sub_menu {
    width: 85%;
    overflow: hidden;
    margin: 0;
    padding: 7.2% 0 7.2% 15%;
    border-bottom: #434343 1px solid;
}

.left_sub_menu a:link,
.left_sub_menu a:visited {
    color: #1C2D40;
    text-decoration: none;
}

.left_sub_menu a:hover {
    color: #1C2D40;
    text-decoration: underline;
}

.lsm-on-page {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ba0000+0,dd0000+100 */
    background: #ba0000;
    /* Old browsers */
    background: -moz-linear-gradient(left, #ba0000 0%, #dd0000 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #ba0000 0%, #dd0000 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #ba0000 0%, #dd0000 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ba0000', endColorstr='#dd0000', GradientType=1);
    /* IE6-9 */
    ;
}

.left_sub_menu .menu-deco-icon {
    float: left;
    /*  display: inline-block; */
    width: 7.85%;
    overflow: hidden;
    margin: 4.71% 14.52% 0 0;
    padding: 0;
    vertical-align: middle;
}

.left_sub_menu .menu-deco-icon img {
    width: 100%;
}

.left_sub_menu .menu-text {
    float: left;
    /*  display: inline-block; */
    overflow: hidden;
    font-size: 1.25em;
    color: #fff;
    letter-spacing: 2px;
    margin: 2.5% 0 0;
    padding: 0;
    vertical-align: middle;
}

.left_sub_menu .icon-arrow {
    float: right;
    /*  display: inline-block; */
    width: 2.36%;
    overflow: hidden;
    margin: 4% 9.45% 0 0;
    padding: 0;
    -webkit-transition: -webkit-transform .8s ease-in-out;
    transition: transform .8s ease-in-out;
}

.left_sub_menu .icon-arrow img {
    width: 100%;
}

.left_sub_menu .icon-arrow-switch {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.left_sub_sub_menu {
    display: none;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    padding: 0;
}

.left_sub_sub_menu .left_sub_sub_menu_items {
    width: 85%;
    overflow: hidden;
    background: #000;
    margin: 0;
    padding: 7.2% 0 7.2% 15%;
}

.left_sub_sub_menu .left_sub_sub_menu_items:hover {
    padding-left: 13.65%;
    border-left: #d11535 4px solid;
}

.lssm-on-page {
    padding-left: 13.65%;
    border-left: #d11535 4px solid;
}

.left_sub_sub_menu .left_sub_sub_menu_items .menu-deco-icon {
    float: left;
    /*  display: inline-block; */
    width: 7.85%;
    overflow: hidden;
    margin: 4.71% 14.52% 0 0;
    padding: 0;
    vertical-align: middle;
}

.left_sub_sub_menu .left_sub_sub_menu_items .menu-deco-icon img {
    width: 100%;
}

.left_sub_sub_menu .left_sub_sub_menu_items .menu-text {
    float: left;
    /*   display: inline-block; */
    overflow: hidden;
    font-size: 1.25em;
    color: #c2c3c3;
    letter-spacing: 2px;
    margin: 2.5% 0 0;
    padding: 0;
    vertical-align: middle;
}

.left_sub_sub_menu .left_sub_sub_menu_items .menu-text a:link,
.left_sub_sub_menu .left_sub_sub_menu_items .menu-text a:visited,
.left_sub_sub_menu .left_sub_sub_menu_items .menu-text a:hover {
    color: #c2c3c3;
}

.copyright {
    position: absolute;
    bottom: 0;
    left: 13%;
    width: 75%;
    overflow: hidden;
    color: #c81432;
    font-size: 0.75em;
    line-height: 180%;
    text-align: center;
    margin: 0 0 12%;
    padding: 0;
}


/*** BEGIN TEMPLATE MAIN COMPONENT :: CONTAINER :: MAIN CONTENT ***/

.main-content {
    float: right;
    /*  display: inline-block; */
    width: 84.38%;
    height: 100%;
    overflow: hidden;
    background: #e8e8e8;
    margin: 0;
    padding: 0;
}

.main-content .content-block {
    clear: both;
    width: 94.44%;
    min-height: 30%;
    overflow: hidden;
    background: #fff;
    margin: 2.78% auto;
    padding: 0;
    border-radius: 15px;
}

.main-content .content-block-02 {
    clear: both;
    width: 91.44%;
    overflow: hidden;
    margin: 2% auto;
    padding: 0;
}


/*** BEGIN TEMPLATE MAIN COMPONENT :: FOOTER ***/