@import 'common-variant.css';

@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) {
}

* {
    font-family: 微軟正黑體, "Open Sans", Arial, Helvetica, "Microsoft JhengHei", "Apple LiGothic Medium", sans-serif;
}

/*關鍵字*/
/*          顯示待加入關鍵字的清單*/
.common-keyword-list-zone {
    color: inherit;
}

    .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-clearfix {
    clear: both;
}

/* ------------------------------ Div Button ---------------------------- */
.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;
}
/* ------------------------------ 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(../images/webicon_softColor.png);
    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;
}

/* ---------------------------- 標準的表格樣式一 ----------------------------------------------*/
.common-table {
    border-collapse: separate;
    border-spacing: 1px;
    border: 0;
    padding: 0;
    margin: 0;
    width: 100%;
    border: 1px solid #cccccc;
    border-radius: 3px;
    font-size: 12px;
}

    .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;
        text-align: center;
    }

    .common-table > tbody > tr:nth-child(2n+1) {
        background-color: #FAFAFA;
    }

    .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_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;
}

.common_link_nodec {
    font-size:12px;
    text-decoration:none;
}

/* =============================搜尋的樣式===============*/
.common_search {
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    padding: 0.5em;
    margin: 0.125em 2em 0.125em 2em;
}

    .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;
    }

/* ========================= 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的樣式 ======================*/

.row-space {
    padding-bottom: 0.5em;
}

.common_date_calendar {
    display: inline-block;
    background-image: url('../images/icons/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;
}



.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;
    background-color: rgb(252 252 252);
    -webkit-box-shadow: 1px 1px 3px var(--base-box-shadow-color);
    box-shadow: 1px 1px 3px var(--base-box-shadow-color);
    padding: 10px;
    width: auto;
}

.common-word-wrap {
    word-wrap: break-word;
    word-break: break-all;
}

.common-hide-section {
    display: none;
}

.common-selected {
    color: #A00200;
    text-decoration: underline;
    font-weight: bold;
}


/* font awoson 顏色改寫 */
.btn {
    border-radius: 0.1rem;
}

.btn-primary, .bg-primary {
    color: rgb(255 255 255);
    background-color: #66BAB7 !important;
    border-color: #66BAB7;
}

.btn-success, .bg-success {
    color: rgb(255 255 255);
    background-color: #90B44B;
    border-color: #90B44B;
}

.btn-danger, .bg-danger {
    color: rgb(255 255 255);
    background-color: #EEA9A9;
    border-color: #EEA9A9;
}

.btn-warning, .bg-warning {
    color: rgb(33 37 41);
    background-color: #E79460;
    border-color: #E79460;
}

.btn-info, .bg-info {
    color: rgb(255 255 255);
    background-color: #0089A7;
    border-color: #0089A7;
}

.btn-dark, .bg-dark {
    color: rgb(204 204 204);
    background-color: rgb(51, 51, 51);
    border-color: rgb(51, 51, 51);
}

.form-control {
    border-radius: 2px;
    font-family: 'Microsoft YaHei', Consolas;
    letter-spacing: 1.5px;
}