﻿* {
    font-family: 微軟正黑體, "Open Sans", Arial, Helvetica, "Microsoft JhengHei", "Apple LiGothic Medium", sans-serif;
    /*font-family: poppins, "noto sans kannada", 微軟正黑體, sans-serif;
    text-size-adjust: 110%;*/
}

@media (min-width: 1200px) {
}

@media (min-width: 980px) and (max-width: 1199px) {
}

@media (min-width: 768px) and (max-width: 979px) {
}

@media (max-width: 767px) {
}

@media (max-width: 480px) {
}

body {
    margin: 0;
    padding: 0;
}

a {
    color: #428bca;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
        color: brown;
    }

h1,
h2,
h3,
h4,
h5,
h6 {
}

textarea {
    min-width: 250px;
    max-width: 800px;
    min-height: 6em;
    max-height: 15em;
    border-radius: 3px;
}

input[type=text] {
    min-width: 250px;
    max-width: 600px;
    border-radius: 2px;
}

@media (min-width: 1200px) {
}

@media (min-width: 980px) and (max-width: 1199px) {
}

@media (min-width: 768px) and (max-width: 979px) {
}

@media (max-width: 767px) {
    textarea {
        min-width: 200px;
        max-width: 100vw;
        min-height: 15em;
        max-height: 15em;
    }

    input[type=text] {
        border-radius: 3px;
        height: 2em;
        min-width: 200px;
        max-width: 100vw;
    }
}

@media (max-width: 480px) {
}

.Common_Link {
    text-decoration: none;
    cursor: pointer;
    color: #0066CC;
}

    .Common_Link:hover {
        text-decoration: underline;
        color: #A00200;
    }


/*框架部份*/
.nav-scroll-empty-box {
    height: 10px;
}

.container-fluid {
    width: 90%;
    margin: 0 auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .container-fluid form {
        margin: 0 auto;
    }

    .container-fluid > nav {
        display: inline-block;
        border: 0px solid #A00200;
        vertical-align: top;
    }

    .container-fluid .navigator-icon {
        display: none;
    }

        .container-fluid .navigator-icon > .fa {
            font-size: 3em;
        }

    .container-fluid > section {
        display: inline-block;
        border: 0px solid #A00200;
    }

@media (min-width: 1200px) {
    .container-fluid {
        width: 85%;
        padding: 0;
        box-sizing: border-box;
    }

        .container-fluid > nav {
            float: left;
            width: 20%;
            border: 0 solid #A00200;
            vertical-align: top;
            box-sizing: border-box;
            padding: 0 8px 0 0;
            margin: 0;
        }

        .container-fluid > section {
            float: right;
            width: 80%;
            border: 0 solid #A00200;
            box-sizing: border-box;
            padding: 0;
            margin: 0;
        }
}

@media (min-width: 980px) and (max-width: 1199px) {
    .container-fluid {
        width: 95%;
        padding: 5px;
    }
}

@media (min-width: 768px) and (max-width: 979px) {
    .container-fluid {
        padding: 5px;
    }
}

@media (max-width: 767px) {
    .container-fluid {
        padding: 3px;
    }
}

@media (max-width: 480px) {
    .container-fluid {
        padding: 2px;
        margin: 0;
        width: 100%;
    }

        .container-fluid > nav {
            position: absolute;
            top: 50px;
            right: 0;
            border: 0px solid #A00200;
            background-color: #FFFFFF;
        }

        .container-fluid .navigator-icon {
            display: inline-block;
            position: absolute;
            top: 0.25em;
            right: 0;
            width: 3em;
            height: 3em;
            /*border: 1px solid #3799FF;*/
            -webkit-box-shadow: 0 0 10px #ADADAD;
            box-shadow: 0 0 10px #ADADAD;
            border-radius: 3px;
            text-align: center;
            vertical-align: middle;
            cursor: pointer;
            color: #BCD2E6;
            background-color: rgba(200,200,200,0.6);
        }

        .container-fluid > section {
            display: block;
            border: 0px solid #A00200;
            width: auto;
        }
}

/*-----toolbar----------------*/
.common-toolbar {
    border: 1px solid #ececec;
    box-shadow: 0 0 5px #CCCCCC;
    padding: 0.25em;
    box-sizing: border-box;
    background-color: #fff;
}

    .common-toolbar > div {
    }

        .common-toolbar > div > h3 {
        }

        .common-toolbar > div > hr {
        }

        .common-toolbar > div > ul {
            padding: 0;
            margin: 0;
            list-style: none;
        }

            .common-toolbar > div > ul > li {
                padding: 0.25em 0;
                margin: 0;
            }

                .common-toolbar > div > ul > li > a {
                    font-size: 0.8em;
                    color: #0066CC;
                }

@media (min-width: 1200px) {
}

@media (min-width: 980px) and (max-width: 1199px) {
}

@media (min-width: 768px) and (max-width: 979px) {
}

@media (max-width: 767px) {
    .common-toolbar {
        box-shadow: 0 0 5px #CCCCCC;
        padding: 0.25em;
        position: fixed;
        right: 10px;
        box-sizing: border-box;
        background-color: #ececec;
        display: none;
        width: 300px;
        z-index: 99;
    }
}

@media (max-width: 480px) {
}

/* menu 部份*/
.common-nav-fixtop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
}

.common-nav-member,
.common-nav-photo,
.common-nav-account,
.common-nav-todo,
.common-nav-calendar,
.common-nav-blog,
.common-nav-stock,
.common-nav-note,
.common-nav-e-book,
.common-nav-auction {
    color: #aaaaaa;
}

    .common-nav-member:hover, .common-nav-member-actived {
        color: #f44336;
        background-color: #eeeeee;
    }

    .common-nav-photo:hover, .common-nav-photo-actived {
        color: #e91e63;
        background-color: #eeeeee;
    }

    .common-nav-account:hover, .common-nav-account-actived {
        color: #9c27b0;
        background-color: #eeeeee;
    }

    .common-nav-todo:hover, .common-nav-todo-actived {
        color: #3f51b5;
        background-color: #eeeeee;
    }

    .common-nav-calendar:hover, .common-nav-calendar-actived {
        color: #03a9f4;
        background-color: #eeeeee;
    }

    .common-nav-blog:hover, .common-nav-blog-actived {
        color: #009688;
        background-color: #eeeeee;
    }

    .common-nav-stock:hover, .common-nav-stock-actived {
        color: #8bc34a;
        background-color: #eeeeee;
    }

    .common-nav-note:hover, .common-nav-note-actived {
        color: #31238e;
        background-color: #eeeeee;
    }

    .common-nav-e-book:hover, .common-nav-e-book-actived {
        color: #ff9800;
        background-color: #eeeeee;
    }

    .common-nav-auction:hover, .common-nav-auction-actived {
        color: #ff5722;
        background-color: #eeeeee;
    }

    .common-nav-member:hover,
    .common-nav-photo:hover,
    .common-nav-account:hover,
    .common-nav-todo:hover,
    .common-nav-calendar:hover,
    .common-nav-blog:hover,
    .common-nav-stock:hover,
    .common-nav-note:hover,
    .common-nav-e-book:hover,
    .common-nav-auction:hover {
        background-color: #eeeeee;
    }

.navmenu-mobile-btn {
    display: none;
}

header {
    background-color: #f8f8f8;
    margin: 0;
    box-shadow: 0 0 8px #8d6969;
}

.common-nav-login-info {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0.5em 0.5em 0 0;
    text-align: right;
}

    .common-nav-login-info > h5 {
        margin: 0;
        padding: 0.5em;
    }

.common-menu {
    border: 0;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0;
}

    .common-menu > ul {
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
    }

        .common-menu > ul > li {
            text-align: center;
            display: inline-block;
            width: 9%;
            margin: 0;
            padding: 5px 0;
            border: 0;
            margin: 0 auto 10px auto;
            cursor: pointer;
            transition: 0.4s;
            border-radius: 3px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
        }

            .common-menu > ul > li > i {
                margin: 0;
                padding: 0;
                padding-top: 10px;
                display: inline-block;
                width: 100%;
                text-align: center;
                font-size: 1em;
                border: 0;
            }

            .common-menu > ul > li > h3 {
                /*font-family:"Gotham Rounded -Book", "Gotham Rounded B", "Helvetica Neue", Helvetica, Arial, sans-serif, "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;*/
                margin: 0;
                padding: 0;
                font-size: 14px;
                font-weight: bold;
            }


@media (min-width: 980px) and (max-width: 1400px) {
    .common-menu {
        width: 90%;
        margin: 0 3em 0 0;
    }
}

@media (min-width: 768px) and (max-width: 979px) {
    .common-menu {
        border: 0;
        width: 90%;
        margin: 0 0 0 0.5em;
    }

        .common-menu > ul > li > i {
            font-size: 2em;
        }
}

@media (max-width: 767px) {
    .common-nav-login-info {
        text-align: right;
        padding: 0.5em 0.25em 0 0;
    }

        .common-nav-login-info > span {
            display: block;
        }

        .common-nav-login-info > a {
            font-size: 0.75em;
        }

    .common-menu {
        border: 0;
        width: 90%;
        margin: 0 0 0 0.5em;
        z-index: 99;
        position: relative;
        background-color: #ffffff;
    }

        .common-menu > ul > li {
            height: 48px;
        }

            .common-menu > ul > li > img {
                line-height: 48px;
                vertical-align: middle;
                margin-left: 0.5em;
            }

            .common-menu > ul > li > h3 {
                display: inline-block;
                line-height: 48px;
                vertical-align: middle;
                margin-left: 1.5em;
                font-size: 1.125em;
            }

            .common-menu > ul > li > i {
                font-size: 1.5em;
            }
}

@media (max-width: 600px) {
    header {
    }

    .navmenu-mobile-container {
        min-height: 45px;
    }

    .navmenu-mobile-btn {
        display: inline-block;
        position: absolute;
        top: 5px;
        right: 5px;
        background-color: #eeeeee;
        width: 35px;
        height: 35px;
        line-height: 35px;
        border-radius: 5px;
        padding: 0.25em;
        padding-top: 10px;
        border: 1px solid #cccccc;
        box-sizing: border-box;
    }

        .navmenu-mobile-btn > .a, .navmenu-mobile-btn > .b, .navmenu-mobile-btn > .c {
            display: block;
            width: 25px;
            height: 3px;
            margin: 0 auto;
            background-color: #999999;
            margin-bottom: 3px;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            -webkit-transform: rotate(0deg) translate3d(0px, 0px, 0px);
            transform: rotate(0deg) translate3d(0px, 0px, 0px);
        }

    .active > .a {
        -webkit-transform: rotate(405deg) translate3d(4.25px, 4.25px, 0px);
        transform: rotate(405deg) translate3d(4.25px,4.25px, 0px);
    }

    .active > .b {
        width: 30px;
        opacity: 0;
    }

    .active > .c {
        -webkit-transform: rotate(-405deg) translate3d(4.25px, -4.25px, 0px);
        transform: rotate(-405deg) translate3d(4.25px, -4.25px, 0px);
    }

    .common-nav-login-info {
        position: relative;
        padding: 0.25em 0 1em 0.75em;
        display: none;
    }

    .common-menu {
        border: 0 solid blue;
        width: 100%;
        margin: 0;
        display: none;
    }

        .common-menu > ul {
            margin: 0;
            padding: 0;
        }

            .common-menu > ul > li {
                display: block;
                margin: 0 0 1px 0;
                width: 100%;
                text-align: left;
                padding: 0;
                border: 1px solid #eeeeee;
                -webkit-transition: 0.2s;
                -moz-transition: 0.2s;
                transition: 0.2s;
                -webkit-border-radius: 5px;
                -moz-border-radius: 1px;
            }

                .common-menu > ul > li > h3 {
                }

                .common-menu > ul > li > i {
                    width: 40px;
                    padding-top: 5px;
                    font-size: 0.75em;
                }

                    .common-menu > ul > li > i:hover {
                        color: #FFFFFF;
                        background-color: #CCCCCC;
                    }

    .common-nav-member {
        color: #f44336;
        background-color: #eeeeee;
    }

    .common-nav-photo {
        color: #e91e63;
        background-color: #eeeeee;
    }

    .common-nav-account {
        color: #9c27b0;
        background-color: #eeeeee;
    }

    .common-nav-todo {
        color: #3f51b5;
        background-color: #eeeeee;
    }

    .common-nav-calendar {
        color: #03a9f4;
        background-color: #eeeeee;
    }

    .common-nav-blog {
        color: #009688;
        background-color: #eeeeee;
    }

    .common-nav-stock {
        color: #8bc34a;
        background-color: #eeeeee;
    }

    .common-nav-note {
        color: #31238e;
        background-color: #eeeeee;
    }

    .common-nav-e-book {
        color: #ff9800;
        background-color: #eeeeee;
    }

    .common-nav-auction {
        color: #ff5722;
        background-color: #eeeeee;
    }
}


/* ------------------------------ Div區塊分割 ----------------------------*/
.common-frame {
    width: auto;
    -webkit-box-shadow: 0 0 10px #ADADAD;
    box-shadow: 0 0 10px #ADADAD;
    border-radius: 3px;
    margin: 1em;
    padding: 1em;
}

/*                  編輯區塊 ----------------------------*/
.common-edit {
}

    .common-edit div {
        margin: 0 auto;
        line-height: 1.125em;
        padding: 0.25em;
        width: auto;
    }

        .common-edit div > h6 {
            display: inline-block;
            margin: 0;
            padding: 0;
            width: 8em;
        }

        .common-edit div > h5 {
            display: inline-block;
            margin: 0;
            padding: 0;
            max-width: 14em;
        }

        .common-edit div > h6::after {
            content: ' : ';
        }

        .common-edit div > input[type=text] {
            min-width: 250px;
            max-width: 800px;
        }

        .common-edit div > textarea {
            min-width: 500px;
            max-width: 800px;
            min-height: 6em;
            max-height: 15em;
        }

    .common-edit .button-zone {
        text-align: center;
    }

        .common-edit .button-zone > button {
            min-width: 125px;
            height: 2em;
            font-family: 微軟正黑體, 標楷體, 新細明體, Arial, Consolas;
            font-size: 1.125em;
            font-weight: bold;
            color: #333333;
            cursor: pointer;
            text-align: center;
            margin: 0.5em;
            border-radius: 3px;
        }

            .common-edit .button-zone > button > i {
                margin-right: 0.5em;
            }
/*                  編輯區塊 End ----------------------------*/

.Common_Div_1000 {
    width: 1024px;
    margin-left: auto;
    margin-right: auto;
}

.Common_Div_1024 {
    width: 1024px;
    margin-left: auto;
    margin-right: auto;
}

.Common_Left {
    width: 22%;
    float: left;
    margin-left: 1em;
}

.Common_Right {
    width: 75%;
    float: right;
    margin-right: 1em;
}

.Common_P {
    padding: 0.5em;
}

/*關鍵字*/
/*          顯示待加入關鍵字的清單*/
.common-keyword-list-zone {
}

    .common-keyword-list-zone > ul {
        padding: 0;
        margin: 0;
    }

        .common-keyword-list-zone > ul > li {
            padding: 0 0 0.125em 0.5em;
            list-style: none;
            font-size: 0.75em;
            color: #3799FF;
            margin: 0;
            line-height: 16px;
            height: 16px;
        }

            .common-keyword-list-zone > ul > li > i {
                font-size: 1em;
                cursor: pointer;
            }
/*          關鍵字顯示區*/
.common-keyword {
}

    .common-keyword > span {
        border: 1px solid #ADADAD;
        background-color: #EFEFEF;
        color: #333333;
        border-radius: 2px;
        min-width: 4em;
        text-align: center;
        display: inline-block;
        margin-right: 0.5em;
        font-size: 0.75em;
    }

        .common-keyword > span > i {
            margin-left: 0.5em;
            font-size: 1.25em;
            cursor: pointer;
        }

            .common-keyword > span > i::before {
            }
/*關鍵字-結束*/
/* ------------------------------ 其他的相關 */
.Common_Clean {
    clear: both;
}

.Common_OnMouseOverStyle {
    cursor: pointer;
}

.Common_HyperLinkStyle {
    cursor: pointer;
    text-decoration: underline;
    color: #3799FF;
}

.Common_List {
    padding: 3px;
    cursor: pointer;
}

.Common_ListB {
    padding: 3px;
    color: #A05200;
    font-weight: bold;
}

/* ------------------------------ Div區塊效果 ----------------------------*/
.common-member-list {
    margin: 5px 15px 0 0;
    -webkit-box-shadow: 0 0 10px #ADADAD;
    box-shadow: 0 0 10px #ADADAD;
    border-radius: 3px;
    padding: 5px;
    width: auto;
}

    .common-member-list > h3 {
    }

    .common-member-list > ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .common-member-list > ul > li {
            display: block;
            margin: 0 0.5em 0.25em 0.5em;
        }

            .common-member-list > ul > li > h5 {
                font-size: 0.75em;
                padding: 0.25em;
                margin: 0;
            }

                .common-member-list > ul > li > h5 > a {
                    font-size: 1em;
                    color: #ADADAD;
                }

                    .common-member-list > ul > li > h5 > a:hover {
                        color: #428bca;
                    }



.Common_Div_Edit_ShowEffect {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 50;
}

.Common_Div_ShowMessage {
    position: relative;
    z-index: 50;
    width: 120px;
    color: #A00200;
    background-color: #EEEEEE;
    border: 2px dotted #3799FF;
    filter: alpha(opacity=80);
    opacity: 0.8;
}

.Common_Div_BackGround {
    width: 100%;
    height: 100%;
    background-color: #EEEEEE;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
/* hr */
.Common_hr_Gray {
    border: 0.5px solid #EEEEEE;
    margin: 0.25em;
}

.Common_Seprate_A {
    background-image: url('/WebApp/Resources/Images/icons/seprates_01.gif');
    background-repeat: repeat-x;
}
/* ------------------------------ HTML Dom ---------------------------- */
.Common_HTML_TextReadonly {
    border: 0;
    background-color: #EEEEEE;
}
/* ------------------------------ HTML Dom ---------------------------- */


/* ------------------------------ Div Button ---------------------------- */
.Common_Button, .Common_ButtonDisabled {
    width: 105px;
    line-height: 33px;
    height: 33px;
    font-family: 微軟正黑體, 標楷體, 新細明體, Arial, Consolas;
    font-size: 12px;
    font-weight: bold;
    color: #EEEEEE;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    margin: 3px 10px 5px 2px;
}

.Common_Button {
    background-image: url(/WebApp/Resources/Images/Button/btn.png);
}

.Common_ButtonDisabled {
    background-image: url(/WebApp/Resources/Images/Button/btn_disabled.png);
}

.common-btn {
    min-width: 125px;
    height: 2em;
    font-family: 微軟正黑體, 標楷體, 新細明體, Arial, Consolas;
    font-size: 1.125em;
    font-weight: bold;
    color: #333333;
    cursor: pointer;
    text-align: center;
    margin: 0.5em;
    border-radius: 3px;
}

    .common-btn :hover {
    }

.Common_Btn_filesAdd, .Common_Btn_filesdel, .Common_Btn_filesEdit, .Common_Btn_filesview, .Common_Btn_filesCopy,
.Common_Btn_save, .Common_Btn_ok, .Common_Btn_cancel, .Common_Btn_view, .Common_Btn_mailEdit,
.Common_Btn_left, .Common_Btn_right, .Common_Btn_preview, .Common_Btn_next, .Common_Btn_refresh,
.Common_Btn_edit, .Common_Btn_download, .Common_Btn_favorite, .Common_Btn_home, .Common_Btn_common,
.Common_Btn_addressBook, .Common_Btn_config, .Common_Btn_calender, .Common_Btn_cut, .Common_Btn_trash,
.Common_Btn_pointer, .Common_Btn_clipboard, .Common_Btn_property, .Common_Btn_lock, .Common_Btn_table,
.Common_Btn_zoomOut, .Common_Btn_zoomIn, .Common_Btn_Computer, .Common_Btn_recycleCan, .Common_Btn_PCSecurity,
.Common_Btn_favorityProgram, .Common_Btn_GoTo, .Common_Btn_replayEmail, .Common_Btn_CD, .Common_Btn_addProgram {
    margin: 3px;
    width: 60px;
    padding-top: 60px;
    background-image: url(/WebApp/Resources/Images/buttonCandy.png);
    background-repeat: no-repeat;
    background-color: #ECECEC;
    text-align: center;
    cursor: pointer;
    font-size: 12px;
    color: #666666;
    display: inline-block;
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-radius: 5px;
    box-shadow: 0 0 5px #999999;
}

.DivBtnEdit:hover {
    background-color: #99cbff;
    border-bottom: 0px solid #666666;
    border-right: 0px solid #666666;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666;
}

.Common_Btn_filesAdd {
    background-position: 0 0;
}

.Common_Btn_filesdel {
    background-position: -60px 0;
}

.Common_Btn_filesEdit {
    background-position: -120px 0;
}

.Common_Btn_filesview {
    background-position: -180px 0;
}

.Common_Btn_filesCopy {
    background-position: -240px 0;
}

.Common_Btn_save {
    background-position: -300px 0;
}

.Common_Btn_ok {
    background-position: -360px 0;
}

.Common_Btn_cancel {
    background-position: -420px 0;
}

.Common_Btn_view {
    background-position: -480px 0;
}

.Common_Btn_mailEdit {
    background-position: -540px 0;
}

.Common_Btn_left {
    background-position: 0px -75px;
}

.Common_Btn_right {
    background-position: -60px -75px;
}

.Common_Btn_preview {
    background-position: -120px -75px;
}

.Common_Btn_next {
    background-position: -180px -75px;
}

.Common_Btn_refresh {
    background-position: -240px -75px;
}

.Common_Btn_edit {
    background-position: -300px -75px;
}

.Common_Btn_download {
    background-position: -360px -75px;
}

.Common_Btn_favorite {
    background-position: -420px -75px;
}

.Common_Btn_home {
    background-position: -480px -75px;
}

.Common_Btn_common {
    background-position: -540px -75px;
}

.Common_Btn_addressBook {
    background-position: 0px -150px;
}

.Common_Btn_config {
    background-position: -60px -150px;
}

.Common_Btn_calender {
    background-position: -120px -150px;
}

.Common_Btn_cut {
    background-position: -180px -150px;
}

.Common_Btn_trash {
    background-position: -240px -150px;
}

.Common_Btn_pointer {
    background-position: -300px -150px;
}

.Common_Btn_clipboard {
    background-position: -360px -150px;
}

.Common_Btn_property {
    background-position: -420px -150px;
}

.Common_Btn_lock {
    background-position: -480px -150px;
}

.Common_Btn_table {
    background-position: -540px -150px;
}

.Common_Btn_zoomOut {
    background-position: 0 -225px;
}

.Common_Btn_zoomIn {
    background-position: -60px -225px;
}

.Common_Btn_Computer {
    background-position: -120px -225px;
}

.Common_Btn_recycleCan {
    background-position: -180px -225px;
}

.Common_Btn_PCSecurity {
    background-position: -240px -225px;
}

.Common_Btn_favorityProgram {
    background-position: -300px -225px;
}

.Common_Btn_GoTo {
    background-position: -360px -225px;
}

.Common_Btn_replayEmail {
    background-position: -420px -225px;
}

.Common_Btn_CD {
    background-position: -480px -225px;
}

.Common_Btn_addProgram {
    background-position: -540px -225px;
}

/* ------------------------------ Div icon ---------------------------- */

.Common_icon_add, .Common_icon_neg, .Common_icon_del, .Common_icon_ok, .Common_icon_edit, .Common_icon_save,
.Common_icon_collapse, .Common_icon_expend, .Common_icon_download, .Common_icon_View, .Common_icon_common, .Common_icon_file,
.Common_icon_lock, .Common_icon_openMail, .Common_icon_folder, .Common_icon_email, .Common_icon_clock, .Common_icon_user,
.Common_icon_left, .Common_icon_right, .Common_icon_top, .Common_icon_down, .Common_icon_tele, .Common_icon_Moni,
.Common_icon_rss, .Common_icon_app, .Common_icon_folderFiles, .Common_icon_pin, .Common_icon_group, .Common_icon_flag,
.Common_icon_home, .Common_icon_script, .Common_icon_ruby, .Common_icon_delivery, .Common_icon_money, .Common_icon_config,
.Common_icon_zoneMoney, .Common_icon_table, .Common_icon_calendar, .Common_icon_key, .Common_icon_unlock, .Common_icon_tag,
.Common_icon_sortQ, .Common_icon_pill, .Common_icon_sortQ2, .Common_icon_webcam, .Common_icon_font, .Common_icon_fileLi {
    width: 16px;
    height: 16px;
    background-image: url(/WebApp/Resources/Images/webicon_softColor.png);
    cursor: pointer;
    display: inline-block;
}

.Common_icon_enable, .Common_icon_disabled {
    width: 20px;
    height: 20px;
    cursor: pointer;
    display: inline-block;
}

.Common_icon_enable {
    background-image: url(/WebApp/Resources/Images/Icon/a_enabled_True.gif);
}

.Common_icon_disabled {
    background-image: url(/WebApp/Resources/Images/Icon/a_enabled_False.gif);
}

.Common_icon_Space {
    width: 16px;
    height: 16px;
    cursor: pointer;
    display: inline-block;
}

.Common_icon_add {
    background-position: 0 0;
}

.Common_icon_neg {
    background-position: -16px 0;
}

.Common_icon_del {
    background-position: -32px 0;
}

.Common_icon_ok {
    background-position: -48px 0;
}

.Common_icon_edit {
    background-position: -64px 0;
}

.Common_icon_save {
    background-position: -80px 0;
}

.Common_icon_collapse {
    background-position: 0 -16px;
}

.Common_icon_expend {
    background-position: -16px -16px;
}

.Common_icon_download {
    background-position: -32px -16px;
}

.Common_icon_View {
    background-position: -48px -16px;
}

.Common_icon_common {
    background-position: -64px -16px;
}

.Common_icon_file {
    background-position: -80px -16px;
}

.Common_icon_lock {
    background-position: 0 -32px;
}

.Common_icon_openMail {
    background-position: -16px -32px;
}

.Common_icon_folder {
    background-position: -32px -32px;
}

.Common_icon_email {
    background-position: -48px -32px;
}

.Common_icon_clock {
    background-position: -64px -32px;
}

.Common_icon_user {
    background-position: -80px -32px;
}

.Common_icon_left {
    background-position: 0 -48px;
}

.Common_icon_right {
    background-position: -16px -48px;
}

.Common_icon_top {
    background-position: -32px -48px;
}

.Common_icon_down {
    background-position: -48px -48px;
}

.Common_icon_tele {
    background-position: -64px -48px;
}

.Common_icon_Moni {
    background-position: -80px -48px;
}

.Common_icon_rss {
    background-position: 0 -64px;
}

.Common_icon_app {
    background-position: -16px -64px;
}

.Common_icon_folderFiles {
    background-position: -32px -64px;
}

.Common_icon_pin {
    background-position: -48px -64px;
}

.Common_icon_group {
    background-position: -64px -64px;
}

.Common_icon_flag {
    background-position: -80px -64px;
}

.Common_icon_home {
    background-position: 0 -80px;
}

.Common_icon_script {
    background-position: -16px -80px;
}

.Common_icon_ruby {
    background-position: -32px -80px;
}

.Common_icon_delivery {
    background-position: -48px -80px;
}

.Common_icon_money {
    background-position: -64px -80px;
}

.Common_icon_config {
    background-position: -80px -80px;
}

.Common_icon_zoneMoney {
    background-position: 0 -96px;
}

.Common_icon_table {
    background-position: -16px -96px;
}

.Common_icon_calendar {
    background-position: -32px -96px;
}

.Common_icon_key {
    background-position: -48px -96px;
}

.Common_icon_unlock {
    background-position: -64px -96px;
}

.Common_icon_tag {
    background-position: -80px -96px;
}

.Common_icon_sortQ {
    background-position: 0 -112px;
}

.Common_icon_pill {
    background-position: -16px -112px;
}

.Common_icon_sortQ2 {
    background-position: -32px -112px;
}

.Common_icon_webcam {
    background-position: -48px -112px;
}

.Common_icon_font {
    background-position: -64px -112px;
}

.Common_icon_fileLi {
    background-position: -80px -112px;
}

/* ------------------------------ Div區塊 位置----------------------------*/
.DivPositionZero {
    position: absolute;
    text-align: center;
    vertical-align: middle;
    margin-left: auto;
    margin-right: auto;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #EEEEEE;
}


/* ------------------------------ 放在 Div 裡 假裝是button  的項目 ----------------------------*/
.rebackBtnDiv {
    background-image: url('/WebApp/Resources/Images/Button/A/Backward.png');
}

.closeBtnDiv {
    background-image: url('/WebApp/Resources/Images/Button/A/Close.png');
}

.AddBtnDiv {
    background-image: url('/WebApp/Resources/Images/Button/A/Add.png');
}

.EditBtnDiv {
    background-image: url('/WebApp/Resources/Images/Button/A/Select.png');
}

.BtnDivStyle {
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    float: left;
    width: 80px;
    height: 60px;
    line-height: 120px;
    text-align: center;
    vertical-align: bottom;
    padding-bottom: 5px;
    font-size: 12px;
    color: gray;
    cursor: pointer;
}

.Common_Div_BurlyWood, .Common_Div_DarkDarkcyan, .Common_Div_Lavender,
.Common_Div_SeaGreen, .Common_Div_CadetBlue, .Common_Div_SkyBlue,
.Common_Div_Honeydew, .Common_Div_Silver {
}

.Common_Div_BurlyWood {
    background-color: burlywood;
}

.Common_Div_DarkDarkcyan {
    background-color: darkcyan;
}

.Common_Div_Lavender {
    background-color: lavender;
}

.Common_Div_SeaGreen {
    background-color: seagreen;
}

.Common_Div_CadetBlue {
    background-color: cadetblue;
}

.Common_Div_SkyBlue {
    background-color: skyblue;
}

.Common_Div_Honeydew {
    background-color: honeydew;
}

.Common_Div_Silver {
    background-color: silver;
}





/* ---------------------------- 標準的表格樣式一 ----------------------------------------------*/
.common-table {
    border-collapse: separate;
    border-spacing: 1px;
    border: 0;
    padding: 0;
    margin: 0;
    width: 100%;
    border: 1px solid #cccccc;
    border-radius: 3px;
}

    .common-table > thead > tr > th {
        border-radius: 3px;
        background-color: #CCCCCC;
        color: #666;
        font-size: 1em;
        padding: 0;
        height: 2.5em;
        line-height: 2.5em;
    }

    .common-table > tbody > tr > td {
        padding: 2px 5px 2px 5px;
        font-size: 1em;
        border: 1px dotted #cccccc;
        text-align: right;
    }

    .common-table > tfoot > tr > td {
    }


.Common_TableA {
    border: 1px solid #BCD2E6;
    font-size: 12px;
    color: #0200A0;
}

    .Common_TableA caption {
    }

    .Common_TableA th {
        border: 1px solid #BCD2E6;
    }

    .Common_TableA td {
        border: 1px solid #BCD2E6;
    }


.Common_TableB {
    border: 0;
    font-size: 12px;
    color: #0200A0;
    font-family: Consolas;
}

    .Common_TableB caption {
        font-size: 16px;
        font-weight: bold;
        color: #0200A0;
    }

    .Common_TableB th {
        text-align: right;
        padding: 8px;
        border: 0;
    }

    .Common_TableB td {
        text-align: left;
        border-bottom: 1px solid #BCD2E6;
    }

/* -目前部落格的 會員系統分類- */
.Common_Table_C {
    width: 100%;
    border: 1px solid #EEEEEE;
}

    .Common_Table_C th {
        width: 20%;
        text-align: right;
        padding-right: 1.5em;
        color: #333333;
    }

    .Common_Table_C td {
        width: 80%;
    }

/*  ---- 目前有使用者拍賣訂單填寫 -*/
.Common_Table_D {
    width: 100%;
    border: 2px dotted #666A07;
    margin-left: auto;
    margin-right: auto;
    font-family: 微軟正黑體;
}

    .Common_Table_D caption {
        font-size: 1.75em;
        color: #333333;
        font-weight: bold;
        text-align: center;
        padding: 1em;
        background-color: #DCEFFE;
        border: 2px dotted #333333;
    }

.Common_Table_D_th {
    width: 20%;
    font-family: Verdana, Arial, Tahoma;
    color: #0066CC;
    font-weight: lighter;
    text-align: right;
    padding-right: 0.25em;
}

.Common_Table_D_td {
    width: 80%;
}

.Common_Table_D_Title {
    font-family: Verdana, Arial, Tahoma;
    font-size: 1.5em;
    color: #333333;
    font-weight: bolder;
    padding: 0.5em;
}

/*  ---- OK美甲屋的 -*/
.Common_OK {
    width: 100%;
    border: 2px solid #A00200;
    margin-left: auto;
    margin-right: auto;
    font-family: 微軟正黑體;
    border-radius: 10px;
}

    .Common_OK caption {
        font-size: 2.5em;
        color: #930000;
        font-weight: bold;
        text-align: center;
        padding: 1em;
        border: 0;
    }

.Common_OK_th {
    width: 20%;
    font-family: Verdana, Arial, Tahoma;
    color: #0066CC;
    font-weight: lighter;
    text-align: right;
    padding-right: 0.25em;
}

.Common_OK_td {
    width: 80%;
}

.Common_OK_Title {
    font-family: Verdana, Arial, Tahoma;
    font-size: 1.5em;
    color: #333333;
    font-weight: bolder;
    padding: 0.5em;
}


.Common_Table_KeyWord {
    width: 550px;
    border: 1px solid #CCCCCC;
    margin-top: 15px;
}

    .Common_Table_KeyWord tbody td {
        border: 1px solid #CCCCCC;
        padding: 2px;
    }

    .Common_Table_KeyWord thead th {
        background-color: #336699;
        color: #FFFFFF;
        font-family: 微軟正黑體, Arial;
        border: 0 solid #CCCCCC;
        height: 25px;
        line-height: 25px;
        font-size: 16px;
        vertical-align: middle;
    }

/*  ----    NailShop 會員管理   ---- */
.Common_Table_Title_A {
    font-size: 14px;
    font-weight: bold;
    color: #0200A0;
    text-align: left;
    padding-left: 1.5em;
    border-bottom: 1px solid #CCCCCC;
}

.Common_TableContentA {
    border: 1px solid #EEEEEE;
    padding: 1em;
}

.Common_TROddStyle {
    background-color: #FFFFFF;
}

    .Common_TROddStyle:hover {
        background-color: #FFEBFF;
    }

.Common_TREvenStyle {
    background-color: #F7F7F7;
}

    .Common_TREvenStyle:hover {
        background-color: #FFEBFF;
    }

.Common_TRSingleColorA {
    background-color: #FFFFFF;
}

.Common_TRSingleColorB {
    background-color: #ECF2FF;
}

.Common_TDHasBoardA {
    border: 1px solid #EEEEEE;
    padding: 2px;
}



/*===================================== 文字 ================================================*/
/* ------ 標題 ------*/
.Common_Caption_Black, .Common_Caption_DarkGray, .Common_Caption_Gray,
.Common_Caption_Navy, .Common_Caption_DarkRed, .Common_Caption_Red,
.Common_Caption_Brown, .Common_Caption_LightSky {
    font-size: 16px;
    font-family: 微軟正黑體, 新細明體, Arial;
    font-weight: bolder;
    padding-left: 36px;
}
/* ------ Title ------*/
.Common_Title_Black, .Common_Title_DarkGray, .Common_Title_Gray,
.Common_Title_Navy, .Common_Title_DarkRed, .Common_Title_Red,
.Common_Title_Brown, .Common_Title_LightSky {
    font-size: 16px;
    font-family: 微軟正黑體, 新細明體, Arial;
    font-weight: bolder;
    padding-left: 10px;
}
/* ------ 一般字形 ------*/
.Common_Font_Black, .Common_Font_DarkGray, .Common_Font_Gray,
.Common_Font_Navy, .Common_Font_DarkRed, .Common_Font_Red,
.Common_Font_Brown, .Common_Font_LightSky {
    font-family: 微軟正黑體, 新細明體, Arial;
}

.Common_Caption_Black, .Common_Title_Black, .Common_Font_Black {
    color: #333333;
}

.Common_Caption_DarkGray, .Common_Title_DarkGray, .Common_Font_DarkGray {
    color: #666666;
}

.Common_Caption_Gray, .Common_Title_Gray, .Common_Font_Gray {
    color: #CCCCCC;
}

.Common_Caption_Navy, .Common_Title_Navy, .Common_Font_Navy {
    color: Navy;
}

.Common_Caption_DarkRed, .Common_Title_DarkRed, .Common_Font_DarkRed {
    color: #A00200;
}

.Common_Caption_Red, .Common_Title_Red, .Common_Font_Red {
    color: Red;
}

.Common_Caption_Brown, .Common_Title_Brown, .Common_Font_Brown {
    color: #A00200;
}

.Common_Caption_LightSky, .Common_Title_LightSky, .Common_Font_LightSky {
    color: #3799FF;
}

/* =============== 特殊文字設定 */
.Font_Like_A_HREF {
    cursor: pointer;
    text-decoration: underline;
    color: Blue;
}

    .Font_Like_A_HREF:hover {
        color: Red;
    }

    .Font_Like_A_HREF:active {
        color: purple;
    }


/* =============================表格樣式設定=====================*/




/* =============================搜尋的樣式===============*/
.common_search {
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    padding: 0.5em;
    margin: 0.125em 2em 0.125em 2em;
}

    .common_search > .btnSearch {
        display: inline-block;
        min-width: 100px;
        max-width: 250px;
        border: 1px solid #999999;
        border-radius: 3px;
        cursor: pointer;
        padding: 0.25em;
        font-family: Arial;
        font-weight: bold;
        margin-left: 3em;
    }

        .common_search > .btnSearch:hover {
            background-color: #0066CC;
            color: #CCCCCC;
        }

    .common_search > span {
        font-family: 'Microsoft MHei';
        color: #999999;
        font-size: 1em;
        padding-left: 0.975em;
        padding-right: 0.125em;
    }

    .common_search > input[type=number] {
        border-radius: 5px;
        min-width: 50px;
        max-width: 60px;
    }

    .common_search > input[type=button] {
        border-radius: 5px;
    }

.Common_SearchTable {
    border-collapse: collapse;
    color: #FFFFFF;
}

.Common_SearchCellA {
    width: 61px;
    height: 35px;
    padding: 0;
    margin: 0;
    background-image: url('/WebApp/Resources/Images/TableStyle/DivSearch_01.gif');
    background-repeat: no-repeat;
}

.Common_SearchCellB {
    height: 35px;
    padding: 0;
    margin: 0;
    background-image: url('/WebApp/Resources/Images/TableStyle/DivSearch_02.gif');
    background-repeat: repeat-x;
}

.Common_SearchCellC {
    height: 35px;
    padding: 0;
    margin: 0;
}

.Common_UploadCellA {
    width: 61px;
    height: 35px;
    padding: 0;
    margin: 0;
    background-image: url('/WebApp/Resources/Images/TableStyle/DivUpload_01.gif');
    background-repeat: no-repeat;
}

/* ========================= TreeView Level 樹狀圖的結構 每一層文字樣式都不一樣 ======================*/
.treeUL {
    list-style: none;
    padding: 0 0 0 1em;
}

    .treeUL > li {
    }

        .treeUL > li > ul {
            list-style: none;
            padding: 0 0 0 1em;
        }

            .treeUL > li > ul > li {
            }

                .treeUL > li > ul > li > ul {
                    list-style: none;
                    padding: 0 0 0 1em;
                }

                    .treeUL > li > ul > li > ul > li {
                    }

                        .treeUL > li > ul > li > ul > li > ul {
                            list-style: none;
                            padding: 0 0 0 1em;
                        }

                            .treeUL > li > ul > li > ul > li > ul > li {
                            }

.Common_TreeViewLevel_1, .Common_TreeViewLevel_2, .Common_TreeViewLevel_3,
.Common_TreeViewLevel_4, .Common_TreeViewLevel_5, .Common_TreeViewLevel_6 {
    font-size: 12px;
    font-family: 微軟正黑體;
    display: inline-block;
    border-radius: 5px;
    width: 90%;
    padding: 0.25em;
    margin: 1px 0 0 0;
}

.Common_TreeViewLevel_4, .Common_TreeViewLevel_5, .Common_TreeViewLevel_6 {
    padding: 0.125em;
}

    .Common_TreeViewLevel_1:hover, .Common_TreeViewLevel_2:hover, .Common_TreeViewLevel_3:hover,
    .Common_TreeViewLevel_4:hover, .Common_TreeViewLevel_5:hover, .Common_TreeViewLevel_6:hover {
        font-weight: bold;
        color: #A00200;
    }

.Common_TreeViewLevel_1 {
    margin-top: 1em;
    border-radius: 0;
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    border: 0 solid #0066CC;
    border-bottom-width: 1px;
}

.Common_TreeViewLevel_2 {
    font-size: 14px;
    color: #666666;
}

.Common_TreeViewLevel_3 {
    font-size: 12px;
    color: #ff8080;
    background-color: #EEEEEE;
}

.Common_TreeViewLevel_4 {
    color: #178889;
}

.Common_TreeViewLevel_5 {
    color: #891788;
}

.Common_TreeViewLevel_6 {
    color: #178918;
}



/* ========================= Content Talbe的樣式 ======================*/
/*            內容頁的最外框*/
.contentTable {
    width: 100%;
    clear: both;
}

.contentTableTDA {
    width: 19%;
    vertical-align: top;
}

.contentTableTDB {
    width: 79%;
    vertical-align: top;
    margin-left: 5px;
}


/*            內容頁的左邊功能列*/
.DivStepCaption {
    font-weight: bold;
    text-align: center;
    line-height: 25px;
    font-size: 14px;
    letter-spacing: 5px;
    background-color: Lime;
}

.DivStepClass {
    font-size: 12px;
    margin: 10px;
    padding: 5px;
    border: 2px dotted #CCCCCC;
    width: 140px;
    height: 14px;
    cursor: pointer;
}

.span_L {
    float: left;
}

.span_R {
    float: right;
}

#senFooterDiv {
    border-top: 1px solid #CCCCCC;
    text-align: center;
    line-height: 30px;
    overflow: hidden;
    position: fixed;
    width: 100%;
    bottom: 0;
    background-color: rgba(238, 238, 238, 0.80);
    font-family: 'Segoe UI', Arial, 'Microsoft Jhenghei', PMingLiu, sans-serif;
    color: #7F7F7F;
    font-size: 0.9em;
}

.common_date_calendar {
    display: inline-block;
    background-image: url('/WebApp/Resources/Images/Icon/bg-date.png');
    width: 68px;
    height: 72px;
    font-family: "Open Sans", Arial, Helvetica, "Microsoft JhengHei", "Apple LiGothic Medium", sans-serif;
    margin: 0;
    padding: 0;
    letter-spacing: 0.12em;
    text-align: center;
}

    .common_date_calendar > span {
        font-size: 12px;
        color: #666666;
        line-height: 16px;
        display: block;
    }

        .common_date_calendar > span:first-child {
            font-size: 12px;
            color: #333333;
        }

        .common_date_calendar > span:last-child {
            font-size: 8px;
        }

.row-space {
    padding-bottom: 0.5em;
}

#showQRCode {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    padding-top: 20%;
    background-color: #EFEFEF;
    opacity: 0.90;
    display: none;
}

.ajaxLoading {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background-color: #EEEEEE;
    opacity: 0.7;
}

.ajaxStop {
    z-index: 0;
    position: relative;
    width: 10px;
    height: 10px;
    display: none;
}

.ajaxLoadingBox {
    position: absolute;
    left: 50%;
    top: 50%;
    display: inline-block;
    border: 5px solid #9a4a4a;
    border-radius: 10px;
    text-align: center;
    vertical-align: central;
    font-size: 18px;
    line-height: 50px;
    width: 300px;
    height: 50px;
    margin: -25px auto auto -150px;
}

.Common_ListCircle {
    margin: 0;
    padding: 0;
    margin-right: 5px;
    margin-left: 1px;
    display: inline-block;
    height: 16px;
    line-height: 16px;
    width: 16px;
    background-color: #9B2025;
    color: #FFF;
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
    font-family: Arial;
    border-radius: 50%;
}

.sign-in {
    display: inline-block;
    padding: 0.5em;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    text-decoration: none;
}

    .sign-in:hover {
        color: #CCCCCC;
        background-color: #666666;
        text-decoration: none;
    }

.sign-out {
    display: inline-block;
    padding: 0.125em;
    border: 0px solid #CCCCCC;
    border-radius: 5px;
    text-decoration: none;
    margin-right: 0.25em;
    font-size: 0.75em;
}


.common-section {
    margin: 0;
    -webkit-box-shadow: 0 0 10px #ADADAD;
    box-shadow: 0 0 10px #ADADAD;
    border-radius: 3px;
    padding: 0;
}

.common-word-wrap {
    word-wrap: break-word;
    word-break: break-all;
}
