@charset "UTF-8";

* {
    box-sizing: border-box;
}

html, body {
    height: 100%;
    font-size: 1rem;
    margin: 0;
    padding: 0;
}

a:hover {
    text-decoration: none;
}

/*客製化 disabled class*/
a.disabled {
    pointer-events: none !important;
    color: #999 !important;
}

/*footer*/
footer {
    bottom: 0;
    font-size: 0.75rem;
    height: 20px;
    line-height: 20px;
    padding: 0 10px;
    position: absolute;
    width: 100%;
}


/*fn-path*/
.fn-path {
    background-color: whitesmoke;
    border: 1px solid lightgray;
    border-radius: 4px;
    font-size: 0.75rem;
    height: 20px;
    line-height: 20px;
    margin-bottom: 5px;
    padding: 0 10px;
}

    .fn-path:empty {
        display: none;
    }


/*form*/
form table {
    /*margin: 5px auto;*/
    width: 98%;
}

form th {
    padding: 2px 5px;
    text-align: left;
    width: 120px;
}

form td {
    padding: 2px 5px;
}

/*input*/
/*控制項唯讀呈現灰色*/
input[readonly="readonly"], textarea[readonly='readonly'], select[disabled="true"], select[readonly="readonly"] {
    background-color: lightgray !important;
}

input[readonly], input:disabled, textarea:disabled, select:disabled {
    background-color: lightgray !important;
}


input[type="checkbox"], input[type="radio"] {
    height: 1rem;
    margin: 0;
    width: 1rem;
    vertical-align: middle;
}

/*validate*/
.field-validation-valid {
    display: none;
}

.field-validation-error {
    color: red;
    display: block;
    font-size: 0.8125em;
    margin: 5px;
}

.input-validation-error {
    border: none;
    border: 1px solid red;
}

/* 調整 kendo 驗證樣式，使其接近 jQuery 驗證樣式 */
.k-widget.k-tooltip-validation {
    font-size: 100% !important;
    text-align: left !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0.5em 0 0.5em !important;
    background: none !important;
    box-shadow: none !important;
    color: red !important;
    position: static !important;
}

.k-tooltip-validation .k-i-warning {
    display: none !important;
}


/*button k-icon顏色設定*/
.k-icon {
    cursor: pointer;
}

.btn-default .k-icon {
    color: black;
}

.btn-primary .k-icon {
    color: white;
}

.btn-success .k-icon {
    color: white;
}

.btn-info .k-icon {
    color: white;
}

.btn-warning .k-icon {
    color: white;
}

.btn-danger .k-icon {
    color: white;
}

.btn-link .k-icon {
    color: #337ab7;
}

/* 取消按鈕樣式 ( 可用於 Kendo 的 Editable grid 中 command button ) */
.noStyleBtn {
    border: none;
    background-color: transparent;
}



/*dialog*/
#timer {
    background-color: black;
    color: red;
    display: inline-block;
    font-weight: bold;
    margin: 5px;
    padding: 2px 10px;
}

.k-dialog.k-confirm, .k-dialog.k-alert {
    min-width: 20%;
    text-align: center;
}


.k-dialog .k-dialog-buttongroup.k-dialog-button-layout-stretched .k-button {
    border-radius: 4px;
    padding: 2px 10px;
}

/*_CheckboxList,_RadioList*/
.checkboxList {
    list-style: none;
    padding: 0;
}

    .checkboxList li {
        padding: 2px 10px;
    }


/*_ListSelector*/
.k-listbox .k-listbox-toolbar {
    margin: 2px 10px;
}

.k-listbox .k-item {
    font-size: 0.9375rem;
    white-space: nowrap;
}

.k-tooltip-content {
    font-size: 0.75rem;
}

/*-- Symbol --*/

.required:before {
    content: "*";
    color: red;
}


.formTable {
    width: 100%;
}

    .formTable tr {
        border: solid 1px #BDBDBD;
        height: 45px;
    }

    .formTable > tbody > tr > th {
        text-align: right;
        vertical-align: middle;
        white-space: nowrap;
        background-color: #F5F5F8;
        padding: 5px;
    }

    .formTable.active th {
        background-color: #fff8e1;
    }

    .formTable td {
        vertical-align: middle;
        padding: 5px;
    }

.borderTable {
    width: 100%;
    border-collapse: collapse;
}

    .borderTable caption {
        vertical-align: middle;
        white-space: nowrap;
        border-collapse: collapse;
        font-weight: bold;
        padding: 0.6667rem 1.3333rem;
    }

    .borderTable tr th {
        text-align: center;
        vertical-align: middle;
        white-space: nowrap;
        border-collapse: collapse;
        padding: 0.6667rem 1.3333rem;
    }

    .borderTable.active th {
        background-color: #fff8e1;
    }

    .borderTable td {
        vertical-align: middle;
        padding: 5px;
        border-collapse: collapse;
    }

    .borderTable .numberText {
        text-align: right;
    }

#system li, #system {
    padding: 0;
    margin: 5px;
}

.k-hidden {
    display: none;
}


.k-button:before,
.k-button:after {
    font-family: fontawesome, sans-serif;
}

.tab-box {
    width: auto;
}

    .tab-box > .k-item {
        margin-top: 8px;
        height: 30px;
    }

        .tab-box > .k-item > .k-link {
            padding-top: 0;
        }

        .tab-box > .k-item.tab-selected {
            height: 32px;
        }

        .tab-box > .k-item > .k-link:nth-child(3) {
            padding: 0;
        }

.k-multiselect-wrap .k-select {
    position: inherit;
}



.fa, .k-icon {
    font-size: 16px;
}

    .k-icon:after, .k-icon:before {
        font-size: large;
    }

.k-content.k-state-active {
    overflow: auto;
}

.ap-wrap {
    position: relative;
    height: 100%;
    background: url(./images/bg/blur-bg.png);
    background: url(./images/bg/blur-bg.png);
    background: url(./images/bg/blur-bg.png);
    background: url(./images/bg/blur-bg.png);
    background: url(./images/bg/blur-bg.png);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.k-button-icon {
    width: auto;
    height: auto;
}

    .k-button-icon.k-dialog-close {
        position: absolute;
    }

.content-inner-box {
    position: static;
    box-shadow: none;
    padding-top: 0;
}


.k-grid td > :not(.align-center) {
    overflow: visible;
}

.k-icon, .k-sprite, .k-button-group .k-tool-icon {
    overflow: visible;
}


.k-tabstrip-items > .tab-basic.k-item.k-state-default:not(.k-state-active) {
    background-color: rgba(255, 255, 255, 0.3);
}

    .k-tabstrip-items > .tab-basic.k-item.k-state-default:not(.k-state-active) > .k-link {
        color: #FFFFFF;
    }

.k-tabstrip-items > .k-item.k-state-default.k-state-hover:not(.k-state-active) {
    background-color: rgba(255, 255, 255, 0.8);
}

.k-tabstrip-items > .k-item.k-state-default:not(.k-state-active).k-state-hover > .k-link {
    color: #000000;
}

.board-divider .text {
    display: inline;
}

div.parapraph {
    line-height: 1.6;
}

.form-subpanel {
    padding: 10px 20px;
}

.error {
    color: red;
}

.k-grid > .k-header {
    border: none;
}

.common-report-searchcondition-toppanel {
    border-bottom: none;
    position: static;
}

    .common-report-searchcondition-toppanel ul li {
        list-style: none;
    }

div.k-content.k-state-active {
    padding: 0;
}

.sidebar .list-group--sublist.sublist--second .is-star-toggle {
    color: #FFD266;
}

.k-button-group.k-dialog-buttongroup.k-dialog-button-layout-stretched {
    height: 40px;
    padding-left: 20%;
}

.k-dialog .k-dialog-buttongroup.k-dialog-button-layout-stretched .k-button:first-child {
    margin: 0.3em;
    border-left-width: 1px;
}

.k-dialog .k-dialog-buttongroup.k-dialog-button-layout-stretched .k-button:last-child {
    margin: 0.3em;
    margin-left: 1em;
    border-right-width: 1px;
}

.k-window .k-window-titlebar .k-window-action {
    padding-top: 2px;
}

.k-item.k-state-default.tab-basic.k-tab-on-top.k-state-active {
    background: white;
}



.InsideTable td {
    border: none !important;
    padding: 0 !important;
}


.fill-submit-left-head {
    height: 43px;
    line-height: 43px;
}

.k-checkbox:checked + .k-checkbox-label:after {
    font-weight: bolder;
    /*font-size: larger;*/
    font-size: medium;
}

.k-grid-header th > .k-link > .k-icon {
    text-indent: 0;
    position: relative;
}

.k-widget.k-window:not(.k-dialog-titleless) {
    padding-top: 47px !important;
}

.k-multiselect .k-button {
    font-size: 1rem;
}

.k-button.k-primary {
    font-size: 1rem;
}

table td {
    word-break: break-all;
}

label.k-checkbox-label.k-no-text {
    overflow: visible;
}

.k-icon {
    overflow: visible;
}

/* 次標題樣式 */
label.subtitle {
    font-weight: normal;
    padding-top: 15px;
    font-size: 20px;
    line-height: 1.42857em;
    text-shadow: 0px 0px 3px #8d8d8d;
}

    label.subtitle:before {
        color: #456297;
        margin-left: 10px;
        content: '▍';
    }

    label.subtitle.notice:before {
        color: #db4240;
    }

.k-dialog .k-dialog-titlebar .k-dialog-actions {
    right: 2em;
}

label {
    line-height: 1.5em;
}

.k-window-actions {
    color: white;
}

.k-window .k-window-title {
    color: white;
}

span.k-datepicker {
    width: 120px;
}


.commonly-wrap.is-open {
    opacity: 1;
    animation-name: fadeInUpBig;
    animation-duration: .6s;
}

@media (max-width: 568px) {
    .commonly-wrap.is-open {
        top: 40px;
        bottom: 0;
        height: calc(100%);
        left: 0;
        right: 0;
    }
}

.commonly-wrap.is-close {
    transform: translateY(-200%);
    animation-name: fadeOutDown;
    animation-duration: .6s;
}

@media (max-width: 568px) {
    .commonly-wrap.is-close {
        top: 40px;
        bottom: 0;
        height: calc(100%);
        left: 0;
        right: 0;
    }
}

.fa:before {
    font-size: large;
}

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    vertical-align: middle;
}

a {
    vertical-align: middle;
}

.k-grid tr:hover, .k-grid tr.alt:hover {
    background: #cfdbfa !important;
}

.sg-page-item__link i {
    vertical-align: middle;
}

/* borderTable 顏色的部分抽出來控制，共通部分由 Site.css 控制 */
.borderTable {
    border: solid 1px #D8E3F6;
}

    .borderTable caption {
        background-color: #F7F9FE;
        border-top: solid 1px #D8E3F6;
        border-left: solid 1px #D8E3F6;
        border-right: solid 1px #D8E3F6;
        color: #456297;
    }

    .borderTable tr th {
        background-color: #F7F9FE;
        border: solid 1px #D8E3F6;
        color: #456297;
    }

    .borderTable td {
        border: solid 1px #D8E3F6;
    }

/* grid 唯讀欄位樣式控制 */
.k-grid tr td.readonly {
    background-color: #EEF2FC;
}

.k-grid tr.k-alt td.readonly {
    background-color: #F8F9FD;
}

.layout-button-group {
    padding: 10px 20px;
}

textarea {
    resize: both;
}

.k-tooltip-button > a {
    display: none;
}

.k-tabstrip-items .k-item.k-state-active{
    background-color: white;
}

.k-button{
    display: inline-block;
}

.k-button.k-primary[disabled]{
    background-color: lightgray;
}

.k-button.k-primary[disabled]:hover{
    background-color: lightgray;
}

.k-button.k-primary.k-state-disabled{
    background-color: lightgray;
}


.themeExport-wrap {
  text-align: right;
  position: relative; }

.themeExport-wrap ul li {
    display:inline-block;
}
  .themeExport-wrap .themeExport-list {
    position: fixed;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: right;
    background-color: rgb(208, 216, 229);
    margin-top: 3%;
    margin-left: 87%;
    padding-right: 1%;
    border-radius:4px; 
    box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
    list-style: none; }

/*  對話框
    .themeExport-wrap .themeExport-list:after, .themeExport-wrap .themeExport-list:before {
    bottom: 100%;
    left: 70%;
    right: 30%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    display: inline-block;
}

.themeExport-wrap .themeExport-list:after {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: rgb(208, 216, 229);
    border-width: 0 10px 15px 10px;
    margin-left: -10px;
    display: inline-block;
}

.themeExport-wrap .themeExport-list:before {
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: rgb(208, 216, 229);
    border-width: 9px;
    margin-left: -9px;
    display: inline-block;
}*/
    .themeExport-wrap .themeExport-list.is-open {
      display: block; }
    .themeExport-wrap .themeExport-list.is-close {
      display: none; }
    .themeExport-wrap .themeExport-list .-item:not(:first-child) {
      margin-top: 4px; }
    .themeExport-wrap .themeExport-list .-item {
      overflow: hidden; }
      .themeExport-wrap .themeExport-list .-item .-exportbtn {
        display: inline-block;
        border: 2px;
        border-radius: 13px; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn.-exportDOC {
          background-image: url(./images/DOC.svg);
          display: inline-block;
          width: 40px;
          height: 40px;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          background-color: transparent; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn.-exportPDF {
          background-image: url(./images/PDF.svg);
          display: inline-block;
          width: 40px;
          height: 40px;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          background-color: transparent; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn.-exportODT {
          background-image: url(./images/ODT.svg);
          display: inline-block;
          width: 40px;
          height: 40px;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          background-color: transparent; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn.-exportXLS {
          background-image: url(./images/XLS.svg);
          display: inline-block;
          width: 40px;
          height: 40px;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          background-color: transparent; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn.-exportODS {
          background-image: url(./images/ODS.svg);
          display: inline-block;
          width: 40px;
          height: 40px;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          background-color: transparent; }
        .themeExport-wrap .themeExport-list .-item .-exportbtn:hover {
          border: 2px #0E86FE; }

.typeChange-wrap {
    text-align: right;
    position: relative;}
.typeChange-wrap ul li {
    display: inline-block;}
.typeChange-wrap .typeChange-list {
    position: fixed;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: right;
    background-color: rgb(208, 216, 229);
    margin-top: 4%;
    margin-left: 87%;
    width: 10%;
    padding-right: 0%;
    border-radius: 4px;
    box-shadow: 4px 4px 3px rgba(20%,20%,40%,0.5);
    display: inline-block;
    text-align: center;
    list-style: none;}
.typeChange-wrap .typeChange-list.is-open {
    display: block;}
.typeChange-wrap .typeChange-list.is-close {
    display: none;}
.typeChange-wrap .typeChange-list .-item:not(:first-child) {
    margin-top: 4px;}
.typeChange-wrap .typeChange-list .-item {
    overflow: hidden;}
.typeChange-wrap .typeChange-list .-item .-changebtn {
    display: inline-block;
    border: 2px;
    border-radius: 13px;}



/*--RWD修改--*/
@media (max-width: 568px) {
    .fn-body {
        margin-top: 23px;
    }
}


@media (max-width: 559px) {
    .k-grid-header thead {
        display: none;
    }

    .k-grid-content {
        border-top: 0px solid #D8E3F6;
        border-bottom: 0px solid #D8E3F6;
    }


    .grid-hidden {
        display: none;
    }

    .fill-submit-list-rightpanel .k-grid-content tr {
        border-bottom: 1px solid #ccc;
    }

}