




:root {
    --SelectButtonBackgroundColor: #31d2f2; /* 搜尋按鈕背景色 */
    --SelectButtonFontColor: #FFFFFF; /* 搜尋按鈕文字顏色 */
    --SelectButtonLineColor: #31d2f2; /* 搜尋按鈕框線顏色 */
    --SelectButtonHoverBackgroundColor: #11bada; /* 搜尋按鈕滑鼠移過背景色 */
    --SelectButtonHoverFontColor: #FFFFFF; /* 搜尋按鈕滑鼠移過文字顏色 */
    --SelectButtonActiveBackgroundColor: #009dba; /* 搜尋按鈕滑鼠點下背景顏色 */

    --ClearButtonBackgroundColor: #7a7a7a; /* 清除按鈕背景色 */
    --ClearButtonFontColor: #FFFFFF; /* 清除按鈕文字顏色 */
    --ClearButtonLineColor: #7a7a7a; /* 清除按鈕框線顏色 */
    --ClearButtonHoverBackgroundColor: #9b9b9b; /* 清除按鈕滑鼠移過背景色 */
    --ClearButtonHoverFontColor: #FFFFFF; /* 清除按鈕滑鼠移過文字顏色 */
    --ClearButtonActiveBackgroundColor: #626262; /* 清除按鈕滑鼠點下背景顏色 */

    --AddButtonBackgroundColor: #0b5ed7; /* 新增按鈕背景色 */
    --AddButtonFontColor: #FFFFFF; /* 新增按鈕文字顏色 */
    --AddButtonLineColor: #0b5ed7; /* 新增按鈕框線顏色 */
    --AddButtonHoverBackgroundColor: #5993ee; /* 新增按鈕滑鼠移過背景色 */
    --AddButtonHoverFontColor: #FFFFFF; /* 新增按鈕滑鼠移過文字顏色 */
    --AddButtonActiveBackgroundColor: #1451b0; /* 新增按鈕滑鼠點下背景顏色 */

    --DelButtonBackgroundColor: #ca434b; /* 刪除按鈕背景色 */
    --DelButtonFontColor: #FFFFFF; /* 刪除按鈕文字顏色 */
    --DelButtonLineColor: #ca434b; /* 刪除按鈕框線顏色 */
    --DelButtonHoverBackgroundColor: #e62735; /* 刪除按鈕滑鼠移過背景色 */
    --DelButtonHoverFontColor: #FFFFFF; /* 刪除按鈕滑鼠移過文字顏色 */
    --DelButtonActiveBackgroundColor: #ad1722; /* 刪除按鈕滑鼠點下背景顏色 */

    --SubmitButtonBackgroundColor: #04d404; /* 送出按鈕背景色 */
    --SubmitButtonFontColor: #FFFFFF; /* 送出按鈕文字顏色 */
    --SubmitButtonLineColor: #04d404; /* 送出按鈕框線顏色 */
    --SubmitButtonHoverBackgroundColor: #3eec3f; /* 送出按鈕滑鼠移過背景色 */
    --SubmitButtonHoverFontColor: #FFFFFF; /* 送出按鈕滑鼠移過文字顏色 */
    --SubmitButtonActiveBackgroundColor: #03b505; /* 送出按鈕滑鼠點下背景顏色 */

    --EditButtonBackgroundColor: #2ca690; /* 編輯按鈕背景色 */
    --EditButtonFontColor: #FFFFFF; /* 編輯按鈕文字顏色 */
    --EditButtonLineColor: #2ca690; /* 編輯按鈕框線顏色 */
    --EditButtonHoverBackgroundColor: #29dfc2; /* 編輯按鈕滑鼠移過背景色 */
    --EditButtonHoverFontColor: #FFFFFF; /* 編輯按鈕滑鼠移過文字顏色 */
    --EditButtonActiveBackgroundColor: #0e7a69; /* 編輯按鈕滑鼠點下背景顏色 */

    --PrintButtonBackgroundColor: #00006f; /* 列印按鈕背景色 */
    --PrintButtonFontColor: #FFFFFF; /* 列印按鈕文字顏色 */
    --PrintButtonLineColor: #00006f; /* 列印按鈕框線顏色 */
    --PrintButtonHoverBackgroundColor: #0002d5; /* 列印按鈕滑鼠移過背景色 */
    --PrintButtonHoverFontColor: #FFFFFF; /* 列印按鈕滑鼠移過文字顏色 */
    --PrintButtonActiveBackgroundColor: #000020; /* 列印按鈕滑鼠點下背景顏色 */

    --EnterButtonBackgroundColor: #008700; /* 確認按鈕背景色 */
    --EnterButtonFontColor: #FFFFFF; /* 確認按鈕文字顏色 */
    --EnterButtonLineColor: #008700; /* 確認按鈕框線顏色 */
    --EnterButtonHoverBackgroundColor: #17af04; /* 確認按鈕滑鼠移過背景色 */
    --EnterButtonHoverFontColor: #FFFFFF; /* 確認按鈕滑鼠移過文字顏色 */
    --EnterButtonActiveBackgroundColor: #026b0b; /* 確認按鈕滑鼠點下背景顏色 */

    --OrangeButtonBackgroundColor: #eb7200; /* 橘色按鈕背景色 */
    --OrangeButtonFontColor: #FFFFFF; /* 橘色按鈕文字顏色 */
    --OrangeButtonLineColor: #eb7200; /* 橘色按鈕框線顏色 */
    --OrangeButtonHoverBackgroundColor: #ff8f2c; /* 橘色按鈕滑鼠移過背景色 */
    --OrangeButtonHoverFontColor: #FFFFFF; /* 橘色按鈕滑鼠移過文字顏色 */
    --OrangeButtonActiveBackgroundColor: #d36300; /* 橘色按鈕滑鼠點下背景顏色 */

    --PeacockBlueButtonBackgroundColor: #02529d; /* 孔雀藍按鈕背景色 */
    --PeacockBlueButtonFontColor: #FFFFFF; /* 孔雀藍按鈕文字顏色 */
    --PeacockBlueButtonLineColor: #02529d; /* 孔雀藍按鈕框線顏色 */
    --PeacockBlueButtonHoverBackgroundColor: #1a80dd; /* 孔雀藍按鈕滑鼠移過背景色 */
    --PeacockBlueButtonHoverFontColor: #FFFFFF; /* 孔雀藍按鈕滑鼠移過文字顏色 */
    --PeacockBlueButtonActiveBackgroundColor: #00407a; /* 孔雀藍按鈕滑鼠點下背景顏色 */

    --PNPageButtonBackgroundColor: #606060; /* 上下頁按鈕背景色 */
    --PNPageButtonFontColor: #FFFFFF; /* 上下頁按鈕文字顏色 */
    --PNPageButtonLineColor: #606060; /* 上下頁按鈕框線顏色 */
    --PNPageButtonHoverBackgroundColor: #757575; /* 上下頁按鈕滑鼠移過背景色 */
    --PNPageButtonHoverFontColor: #FFFFFF; /* 上下頁按鈕滑鼠移過文字顏色 */
    --PNPageButtonActiveBackgroundColor: #3b3b3b; /* 上下頁按鈕滑鼠點下背景顏色 */
    --PNPageButtonDisabledBackgroundColor: #9b9b9b; /* 上下頁按鈕不啟用背景色 */
    --PNPageButtonDisabledFontColor: #ececec; /* 上下頁按鈕不啟文字顏色 */
    /* 標籤字體 */
    --labelNormalFontColor: #141d72; /* 正常字體 藍色 */
    --labelContentFontColor: #777777; /* 內容字體 灰色 */
    --labelAlertFontColor: #ff0000; /* 警告字體 紅色 */
    --labelRedFontColor: #e42e2e; /* 紅色字體 */
    --labelGreenFontColor: #24b81a; /* 綠色字體 */
    --labelBlueFontColor: #2771e4; /* 藍色字體 */
    --labelGreyFontColor: #777777; /* 灰色字體 */
    /* summary */
    --summaryNormalFontColor: #141d72; /* 正常字體 藍色 */
    --summaryLv2FontColor: #4b4b4b; /* 第二層字體 灰色 */
}


/* 搜尋按鈕 */
.SelectButton { /* 搜尋按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--SelectButtonBackgroundColor);
    color: var(--SelectButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--SelectButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .SelectButton:hover { /* 搜尋(滑鼠移過) */
        border: 2px var(--SelectButtonLineColor) solid !important;
        animation-name: animeSelectButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .SelectButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--SelectButtonActiveBackgroundColor) !important;
        border: 2px var(--SelectButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeSelectButton {
    0% {
        background-color: var(--SelectButtonBackgroundColor);
        color: var(--SelectButtonFontColor) !important;
    }

    100% {
        background-color: var(--SelectButtonHoverBackgroundColor);
        color: var(--SelectButtonHoverFontColor) !important;
    }
}


/*  */
.loginButton {
    display: inline-block;
    position: relative;
    z-index: 1;
    min-width: 200px;
    background: #FFFFFF;
    border: 2px solid #0b5ed7;
    border-radius: 4px;
    color: #0b5ed7 !important;
    font-weight: bold;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
    transition: 0.5s;
    padding: 10px 20px;
    cursor: pointer;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

    .loginButton span {
        position: absolute;
        width: 25%;
        height: 100%;
        background-color: #0b5ed7;
        transform: translateY(150%);
        border-radius: 50%;
        left: calc((var(--n) - 1) * 25%);
        transition: 0.5s;
        transition-delay: calc((var(--n) - 1) * 0.1s);
        z-index: -1;
    }

    .loginButton:hover,
    .loginButton:focus {
        color: #ffffff !important;
    }

        .loginButton:hover span {
            transform: translateY(0) scale(2);
        }

    .loginButton span:nth-child(1) {
        --n: 1;
    }

    .loginButton span:nth-child(2) {
        --n: 2;
    }

    .loginButton span:nth-child(3) {
        --n: 3;
    }

    .loginButton span:nth-child(4) {
        --n: 4;
    }

    /*  */
    .loginButton,
    .loginButton:focus {
        position: relative;
        min-width: 200px;
        background-color: #ffffff;
        border-radius: 4em;
        color: white;
        font-size: 22px;
        font-weight: bold;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
        transition-duration: 0.4s;
        padding: 10px 20px;
    }

        .loginButton:hover {
            background-color: #ffffff;
            color: white;
            transition-duration: 0.1s;
        }

        .loginButton:after {
            content: "";
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: all 0.5s;
            box-shadow: 0 0 10px 40px #000000;
            border-radius: 4em;
        }

        .loginButton:active:after {
            opacity: 1;
            transition: 0s;
            box-shadow: 0 0 0 0 #000000;
        }

        .loginButton:active {
            top: 2px;
        }

/*  */
.loginBackButton,
.loginBackButton:focus {
    position: relative;
    min-width: 200px;
    border: none;
    /* border-radius: 2px; */
    border-radius: 4em;
    background-position: center;
    background-color: #0b5ed7;
    color: #FFFFFF !important;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background 0.8s;
    padding: 10px 20px;
    box-shadow: 0 0 4px #999;
    cursor: pointer;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

    .loginBackButton:hover {
        color: #FFFFFF;
        /* background: #47a7f5 radial-gradient(circle, transparent 1%, #47a7f5 1%) center/15000%; */
        background: #0f62e2 radial-gradient(circle, transparent 1%, #0f62e2 1%) center/15000%;
    }

    .loginBackButton:active {
        background-color: #7cafff;
        background-size: 100%;
        transition: background 0s;
        top: 2px;
    }



/* 檢視、清除、關閉按鈕 */
.ClearButton { /* 檢視、清除、關閉按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--ClearButtonBackgroundColor);
    color: var(--ClearButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--ClearButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .ClearButton:hover { /* 檢視、清除、關閉(滑鼠移過) */
        border: 2px var(--ClearButtonLineColor) solid !important;
        animation-name: animeClearButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .ClearButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--ClearButtonActiveBackgroundColor) !important;
        border: 2px var(--ClearButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeClearButton {
    0% {
        background-color: var(--ClearButtonBackgroundColor);
        color: var(--ClearButtonFontColor) !important;
    }

    100% {
        background-color: var(--ClearButtonHoverBackgroundColor);
        color: var(--ClearButtonHoverFontColor) !important;
    }
}

/* 新增按鈕 */
.AddButton { /* 新增按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--AddButtonBackgroundColor);
    color: var(--AddButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--AddButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .AddButton:hover { /* 新增按鈕(滑鼠移過) */
        border: 2px var(--AddButtonLineColor) solid !important;
        animation-name: animeAddButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .AddButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--AddButtonActiveBackgroundColor) !important;
        border: 2px var(--AddButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeAddButton {
    0% {
        background-color: var(--AddButtonBackgroundColor);
        color: var(--AddButtonFontColor) !important;
    }

    100% {
        background-color: var(--AddButtonHoverBackgroundColor);
        color: var(--AddButtonHoverFontColor) !important;
    }
}

/* 刪除按鈕 */
.DelButton { /* 刪除按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    background-color: var(--DelButtonBackgroundColor);
    color: var(--DelButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--DelButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .DelButton:hover { /* 刪除按鈕(滑鼠移過) */
        border: 2px var(--DelButtonLineColor) solid !important;
        animation-name: animeDelButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .DelButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--DelButtonActiveBackgroundColor) !important;
        border: 2px var(--DelButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeDelButton {
    0% {
        background-color: var(--DelButtonBackgroundColor);
        color: var(--DelButtonFontColor) !important;
    }

    100% {
        background-color: var(--DelButtonHoverBackgroundColor);
        color: var(--DelButtonHoverFontColor) !important;
    }
}

/* 送出按鈕 */
.SubmitButton { /* 送出按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--SubmitButtonBackgroundColor);
    color: var(--SubmitButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--SubmitButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .SubmitButton:hover { /* 送出按鈕(滑鼠移過) */
        border: 2px var(--SubmitButtonLineColor) solid !important;
        animation-name: animeSubmitButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .SubmitButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--SubmitButtonActiveBackgroundColor) !important;
        border: 2px var(--SubmitButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeSubmitButton {
    0% {
        background-color: var(--SubmitButtonBackgroundColor);
        color: var(--SubmitButtonFontColor) !important;
    }

    100% {
        background-color: var(--SubmitButtonHoverBackgroundColor);
        color: var(--SubmitButtonHoverFontColor) !important;
    }
}

/* 編輯按鈕 */
.EditButton { /* 編輯按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--EditButtonBackgroundColor);
    color: var(--EditButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--EditButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .EditButton:hover { /* 編輯按鈕(滑鼠移過) */
        border: 2px var(--EditButtonLineColor) solid !important;
        animation-name: animeEditButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .EditButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--EditButtonActiveBackgroundColor) !important;
        border: 2px var(--EditButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeEditButton {
    0% {
        background-color: var(--EditButtonBackgroundColor);
        color: var(--EditButtonFontColor) !important;
    }

    100% {
        background-color: var(--EditButtonHoverBackgroundColor);
        color: var(--EditButtonHoverFontColor) !important;
    }
}

/* 列印按鈕 */
.PrintButton { /* 列印按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--PrintButtonBackgroundColor);
    color: var(--PrintButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--PrintButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .PrintButton:hover { /* 列印按鈕(滑鼠移過) */
        border: 2px var(--PrintButtonLineColor) solid !important;
        animation-name: animePrintButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .PrintButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--PrintButtonActiveBackgroundColor) !important;
        border: 2px var(--PrintButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animePrintButton {
    0% {
        background-color: var(--PrintButtonBackgroundColor);
        color: var(--PrintButtonFontColor) !important;
    }

    100% {
        background-color: var(--PrintButtonHoverBackgroundColor);
        color: var(--PrintButtonHoverFontColor) !important;
    }
}

/* 確認送出按鈕 */
.EnterButton { /* 確認按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--EnterButtonBackgroundColor);
    color: var(--EnterButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--EnterButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
}

    .EnterButton:hover { /* 確認按鈕(滑鼠移過) */
        border: 2px var(--EnterButtonLineColor) solid !important;
        animation-name: animeEnterButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .EnterButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--EnterButtonActiveBackgroundColor) !important;
        border: 2px var(--EnterButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeEnterButton {
    0% {
        background-color: var(--EnterButtonBackgroundColor);
        color: var(--EnterButtonFontColor) !important;
    }

    100% {
        background-color: var(--EnterButtonHoverBackgroundColor);
        color: var(--EnterButtonHoverFontColor) !important;
    }
}

/* 橘色按鈕 */
.OrangeButton { /* 橘色按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--OrangeButtonBackgroundColor);
    color: var(--OrangeButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--OrangeButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    position: relative;
    margin: 5px;
}

    .OrangeButton:hover { /* 橘色按鈕(滑鼠移過) */
        border: 2px var(--OrangeButtonLineColor) solid !important;
        animation-name: animeOrangeButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .OrangeButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--OrangeButtonActiveBackgroundColor) !important;
        border: 2px var(--OrangeButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animeOrangeButton {
    0% {
        background-color: var(--OrangeButtonBackgroundColor);
        color: var(--OrangeButtonFontColor) !important;
    }

    100% {
        background-color: var(--OrangeButtonHoverBackgroundColor);
        color: var(--OrangeButtonHoverFontColor) !important;
    }
}

/* 孔雀藍按鈕 */
.PeacockBlueButton { /* 孔雀藍按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--PeacockBlueButtonBackgroundColor);
    color: var(--PeacockBlueButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--PeacockBlueButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
    margin: 5px;
}

    .PeacockBlueButton:hover { /* 孔雀藍按鈕(滑鼠移過) */
        border: 2px var(--PeacockBlueButtonLineColor) solid !important;
        animation-name: animePeacockBlueButton;
        animation-duration: 0.4s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

    .PeacockBlueButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--PeacockBlueButtonActiveBackgroundColor) !important;
        border: 2px var(--PeacockBlueButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
        top: 2px;
    }

@keyframes animePeacockBlueButton {
    0% {
        background-color: var(--PeacockBlueButtonBackgroundColor);
        color: var(--PeacockBlueButtonFontColor) !important;
    }

    100% {
        background-color: var(--PeacockBlueButtonHoverBackgroundColor);
        color: var(--PeacockBlueButtonHoverFontColor) !important;
    }
}

/* 上下頁按鈕 */
.PNPageButton { /* 上下頁按鈕 */
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border-radius: 5px;
    cursor: pointer;
    background-color: var(--PNPageButtonBackgroundColor);
    color: var(--PNPageButtonFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--PNPageButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
}

    .PNPageButton:hover { /* 上下頁按鈕(滑鼠移過) */
        background-color: var(--PNPageButtonHoverBackgroundColor);
        border: 2px var(--PNPageButtonLineColor) solid !important;
        color: var(--PNPageButtonHoverFontColor) !important;
    }

    .PNPageButton:active {
        /* :active是滑鼠點擊元素的狀態 */
        background-color: var(--PNPageButtonActiveBackgroundColor) !important;
        border: 2px var(--PNPageButtonLineColor) solid !important;
        box-shadow: inset 0 0 10px 1px rgba(0, 0, 0, .2);
    }

/* 上下頁按鈕不啟用 */
.PNPageButtonDisabled { /* 上下頁按鈕不啟用 */
    background-color: var(--PNPageButtonDisabledBackgroundColor);
    color: var(--PNPageButtonDisabledFontColor) !important;
    font-family: Microsoft JhengHei; /* 字型設定為微軟正黑體 */
    border: 2px var(--PNPageButtonLineColor) solid;
    font-weight: bold;
    font-size: 16px;
    transition: 0.25s;
    padding: 2px;
}

/* 標籤字體 */
.labelNormal { /* 搜尋輸入標題字體，部門名稱之類的 */
    display: inline-block;
    height: 40px;
    line-height: 40px;
    color: var(--labelNormalFontColor);
    font-size: 18px;
    font-weight: bold;
}

.labelContent { /* 內容之類的 */
    display: inline-block;
    height: 40px;
    line-height: 40px;
    color: var(--labelContentFontColor);
    font-size: 18px;
    font-weight: bold;
}

.labelAlert { /* 警告訊息字體 */
    display: inline-block;
    height: 40px;
    line-height: 40px;
    color: var(--labelAlertFontColor);
    font-size: 18px;
    font-weight: bold;
}

.labelBRed { /* 紅色粗字體 */
    color: var(--labelRedFontColor);
    font-weight: bold;
}

.labelBGreen { /* 綠色粗字體 */
    color: var(--labelGreenFontColor);
    font-weight: bold;
}

.labelBBlue { /* 藍色粗字體 */
    color: var(--labelBlueFontColor);
    font-weight: bold;
}

.labelBGrey { /* 灰色粗字體 */
    color: var(--labelGreyFontColor);
    font-weight: bold;
}

.labelRed { /* 紅色字體 */
    color: var(--labelRedFontColor);
}

.labelGreen { /* 綠色字體 */
    color: var(--labelGreenFontColor);
}

.labelBlue { /* 藍色字體 */
    color: var(--labelBlueFontColor);
}

.labelGrey { /* 灰色字體 */
    color: var(--labelGreyFontColor);
}


/* 格式 */
.inputWidthDiv { /* 給輸入用的DIV，可以與小標題並排並調整大小 */
    display: inline-block;
    width: 60%;
    height: 50px;
}

.inputWidthDiv65 { /* 給輸入用的DIV，可以與小標題並排並調整大小 */
    display: inline-block;
    width: 65%;
    height: 50px;
}

.inputWidthDiv50 { /* 給輸入用的DIV，可以與小標題並排並調整大小 */
    display: inline-block;
    width: 50%;
    height: 50px;
}

.inputWidthNon { /* 給輸入用的DIV，可以與小標題並排並調整大小 */
    height: 50px;
}

.inputPadding { /* 給輸入用的DIV，設定邊界距離大小 */
    padding: 10px;
}

.divCenter { /* 水平垂直置中用的DIV */
    display: flex;
    justify-content: center; /* 水平置中 */
    align-items: center; /* 垂直置中 */
}

.noneSelect {
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
}

.divSubtitle {
    background-color: #d4d4d4;
    width: 100%;
    border-bottom: 1px solid #909090;
    font-size: 20px;
}

/* boo */
.bg-primary {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-secondary {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-success {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-danger {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-warning {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-info {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-light {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

.bg-dark {
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -webkit-user-select: none !important;
}

/* summary */
.summaryNormal { /* summary的標題字體 */
    color: var(--summaryNormalFontColor);
    font-size: 18px;
    font-weight: bold;
}

.summaryLv2 { /* summary的第二層字體 */
    color: var(--summaryLv2FontColor);
    font-size: 16px;
    font-weight: bold;
}

.summaryLv3 { /* summary的第三層字體 */
    color: var(--summaryLv2FontColor);
    font-size: 15px;
    font-weight: bold;
}

/* 圖片 */
.imageNormal {
    cursor: pointer;
}

/* 表格 */
.table-phone-w1024 {
    padding: 10px 10px 10px 10px;
    border: 1px #d9d9d9 solid;
}

@media (min-width: 768px) {
    .table-computer-w1024 {
        display: block;
    }

    .table-phone-w1024 {
        display: none;
    }
}

@media (max-width: 767px) {
    .table-computer-w1024 {
        display: none;
    }

    .table-phone-w1024 {
        display: block;
    }
}

.RowCenter {
    text-align: center; /* 置中 */
}

.neko-table {
    width: 100%;
}

.neko-table thead tr th {
    background-color: #d4d4d4;
}

.neko-table-primary tbody tr:nth-child(2n) {
    background: #cde4ff;
}

.neko-table-primary tbody tr:nth-child(2n+1) {
    background: #ffffff;
}

.neko-table-hover.neko-table-primary tbody tr:hover {
    background: #b7d6f8;
}

.neko-table-success tbody tr:nth-child(2n) {
    background: #d8f5f5;
}

.neko-table-success tbody tr:nth-child(2n+1) {
    background: #ffffff;
}

.neko-table-hover.neko-table-success tbody tr:hover {
    background: #c9e7e9;
}

.neko-table-info tbody tr:nth-child(2n) {
    background: #ccfaff;
}

.neko-table-info tbody tr:nth-child(2n+1) {
    background: #ffffff;
}

.neko-table-hover.neko-table-info tbody tr:hover {
    background: #a9dff3;
}

.neko-table tbody tr.rush-tr-color {
    background: #ffe9ea;
}

    .neko-table tbody tr.rush-tr-color:hover {
        background: #facfcd;
    }

