@charset "utf-8";
/*  ===== 基本覆寫 ===== */
*{font-family:Verdana,微軟正黑體, Microsoft JhengHei, Arial, Helvetica, sans-serif;}
html,body{height:100%; margin:0; padding:0; overflow-x: hidden;}
body{font-size: 1em;overflow-x: hidden;}
/*  ===== ochi flex框架 ===== */
/* mobile menu  */
.ochisidebar{width:100%;display: none;}
#sidebarmenu{width:100%;}
.switchsidebarbox{text-align:center; border-top: 1px solid #c5c5c5;border-bottom: 1px solid #c5c5c5;background-color: #f0a04b;}
.switchsidebarbox a{color:#292929; }

.deskmenubar{
    height:2.2em;background-color: #f0a04b; font-size:1.2em;
}
#backToTop{
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 64px;
    height: 64px;
    z-index: 999;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
}
/*  ===== 系統使用第三方套件 ===== */
/* superfish menu */
.superfishmenu ul a {
    padding: 0.3em 0.5em 0.4em 0.5em;
    text-decoration: none;
    color: #143F6B;
}

.superfishmenu  ul  li:hover a,.superfishmenu  ul li.sfHover a{
    background: #f7cc65;
}
.superfishmenu ul li ul li a {
    padding: 0.4em 1em 0.3em 1em;
}
.superfishmenu  ul  li:hover ul li a,.superfishmenu  ul li.sfHover ul li a{
    background: #FEFBE9;
}
.superfishmenu  ul  li  ul  li{
    border-bottom:1px solid #e5e1c7;
}
.superfishmenu  ul  li  ul  li:last-child{border-bottom:0;}

.superfishmenu  ul  li  ul  li a:hover,
.superfishmenu  ul  li  ul  li.sfHover a:hover,
.superfishmenu ul li ul li ul li,
.superfishmenu ul li ul li.sfHover ul li a{
    background: #ffffff;
}
.superfishmenu ul li ul li.sfHover ul li a:hover{

}
.superfishmenu > ul li.activemenu {

}
/* metisMenu custom */
ul.metismenu{margin:0 0 0 -40px; border-top: 1px solid #c5c5c5;}
ul.metismenu ul{margin:0 0 0 -40px;}
ul.metismenu li{list-style: none; margin: 0;}
ul.metismenu li a{text-decoration:none;border-bottom: 1px solid #c5c5c5; padding: 7px 15px; display: block; background: #f4f4f4;color:#000;}
ul.metismenu li ul li a{padding-left: 30px;background: #e8e8e8;}
ul.metismenu li ul li ul li a{padding-left: 45px;background: #d9d9d9;}

/* Magnific Popup */
.magpopup{
    position: relative;
    background: #FFF;
    padding: 0px;
    width: auto;
    margin: 20px auto;
    border-radius:10px;
}
.magSizeS{max-width: 600px;}
.magSizeM{max-width: 900px;}
.magSizeL{max-width: 1300px;}

.magpopupTitle{padding:10px; border-radius:10px 10px 0 0; font-size:1.1em;
    border-bottom:1px solid #c8c8c8; background-color:#f1f1f1;
    background-image: -webkit-linear-gradient(top, #f1f1f1 0%, #ededed 60%, #dedede 100%);
    background-image: -moz-linear-gradient(top, #f1f1f1 0%, #ededed 60%, #dedede 100%);
    background-image: -ms-linear-gradient(top, #f1f1f1 0%, #ededed 60%, #dedede 100%);
    background-image: -o-linear-gradient(top, #f1f1f1 0%, #ededed 60%, #dedede 100%);
    background-image: linear-gradient(to bottom, #f1f1f1 0%, #ededed 60%, #dedede 100%);
}


/* overlay at start */
.mfp-fade.mfp-bg {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.5;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}
/*  ===== 套件覆寫用CSS ===== */
/* 覆寫bootstrap初始設定 */
.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 0px;
    padding-right: 0px;
}
/* 修正datepicker年月寬度 */
.xdsoft_datetimepicker .xdsoft_month {
    width: 80px;
}
.xdsoft_datetimepicker .xdsoft_year{
    width: 68px;
}
/* 修正superfish */
.superfishmenu > ul{margin-bottom: 0;}

.bx-wrapper {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    background: transparent;
}

/*  ===== RWD處理:系統自訂 ===== */
/* 小於576px的螢幕:手機直 */
@media (max-width: 767px) {
    .deskmenublock{display: none;}
}
/* 介於768~992px的螢幕:平板橫 */
@media (min-width: 768px) {
    /* mobile menu switch button */
    .switchsidebarbox{display: inherit;}
    /* desktop menu */
    .deskmenublock{display: none;}
}
/* 大於992px的螢幕 */
@media (min-width: 992px) {
    /* mobile menu switch button */
    .switchsidebarbox{display: none;}
    /* desktop menu */
    .deskmenublock{display: inherit;}


}

/* Wrapkit Lite修正 */
body{font-size: 1.1rem;color: #161616;font-weight: normal;}
#webfooter{background:#e1eedd;}
.form-control{padding: 0.375rem 0.75rem;}
.btn{padding:0.375rem 0.75rem;}
.table td,.table th{color: #161616!important;}
.btn-outline-dark{color:#263238;transition: all ease-in-out 0.2s;}
.breadcrumb{padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0;background: transparent; }
.nav-tabs .nav-link.active{color:#000;background: #f4f7f2;}

/* 本系統專用 */
.headerbg{background: url("../images/headerbg.gif") center center no-repeat #fefbe8; min-height: 135px;}
.sitelogo{max-height: 105px;}/* logo舊版:55px */
.sitelogoS{max-height: 55px;}
.moeaboe{max-height: 50px;}
.moeaboeM{max-height: 70px;}
.filetitle{border-bottom:4px solid #139487; padding-bottom:0px;  display:inline-block; margin-bottom:-6px;}
.filetitlewrapper{border-bottom:1px solid #bababa; padding:5px 0;}
.filetitlewrapper .itemright{float: right; padding-top: 15px;}
.filetitlewrapper .btnright{float: right; padding-top: 5px;}
.shadowA{box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);}
.cardheaderbg{background: #139487; color: #fff;}
.font-black{color:#000;}
.font-black a{color:#000;text-decoration: none;border-bottom: 0;transition: all ease-in-out 0.2s;}
.font-black a:hover{color:#139487;}
.iconcolorA{background: -webkit-linear-gradient(#139487, #07695f);font-family: "Arial Black";
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.cardbg{background: #f4f7f2;}
.indexloginP{padding-top: 39px; padding-bottom: 20px;}
th.thbg{background: #ACD5D0; color: #000!important;}
.tbadjust th{border: 1px solid #fff!important; border-top: 1px solid #c7cace!important;}
.tbadjust th:first-child{border-left:1px solid #c7cace!important; }
.tbadjust th:last-child{border-right:1px solid #c7cace!important; }
/* input file & date style */
input[type=file] {
    width: 100%;
    max-width: 100%;
    color: #444;
    padding: 3px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #cbcbcb;
}
input[type=file]::file-selector-button {
    margin-right: 8px;
    border: none;
    background: #139487;
    padding: 8px 10px;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

input[type=file]::file-selector-button:hover {
    background: #139487;
}

input[type="date"] {
    position: relative;
}

/* create a new arrow, because we are going to mess up the native one
see "List of symbols" below if you want another, you could also try to add a font-awesome icon.. */
input[type="date"]:after {
    font-family: "Font Awesome 5 Free";

    font-size: 1.2em;
    content: "\f073";
    color: #139487;
    padding: 0 2px;
}

/* change color of symbol on hover */
input[type="date"]:hover:after {
    color: #07695f;
}

/* make the native arrow invisible and stretch it over the whole field so you can click anywhere in the input field to trigger the native datepicker*/
input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    color: transparent;
    background: transparent;
}

/* adjust increase/decrease button */
input[type="date"]::-webkit-inner-spin-button {
    z-index: 1;
}

/* adjust clear button */
input[type="date"]::-webkit-clear-button {
    z-index: 1;
}
/* 截字CSS */
.titlellipsis{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.conForThreeLine{overflow: hidden; text-overflow: ellipsis; white-space: normal;word-wrap: break-word;-webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;}

.menufontsizeS{
    font-size:1.1em;
}
.alwaysflex{display: flex;}
.cardbordercolor{border-color:#c7d6bf!important;}
.flatdatepicker{background: url("../images/icon_date.gif") no-repeat right 3px center #fff;}
.flatdatepicker:hover{background: url("../images/icon_date_hover.gif")  no-repeat right 3px center #fff;}
span.flatpickr-weekday{color:#fff;}

.note-icon-caret,.note-color-select,#backColorPalette,#foreColorPalette{display: none;}
.note-editable{font-size: 14px;}