@charset "utf-8";
/*  ===== 基本覆寫 ===== */
*{font-family:Verdana,微軟正黑體, Microsoft JhengHei, Arial, Helvetica, sans-serif;}
html,body{height:100%; margin:0; padding:0; overflow-x: hidden;}

/* 覆寫套件 */
/* metisMenu custom */
ul.metismenu{margin:0 0 0 -40px; }
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 #e9e9e9; padding: 12px 17px; display: block;color:#000; background: #fff;}
ul.metismenu li ul li a{padding-left: 30px;background: #f0f0f0;border-bottom: 1px solid #d4d4d4;transition: all ease-in-out 0.2s;}
ul.metismenu li ul li.mactive a,ul.metismenu li.mactive a{background: #3d7db5; color: #fff;}
ul.metismenu li ul li a:hover{background: #d4e7f7;}
ul.metismenu li ul li.mactive a:hover,ul.metismenu li.mactive a:hover{background: #3d7db5; color: #fff;}
ul.metismenu li ul li ul li a{padding-left: 45px;background: #e6e6e6;}

/* Wrapkit Lite修正 */
body{font-size: 1em;color: #161616;font-weight: normal;}
.form-control{padding: 0.375rem 0.75rem; border-color: rgba(120, 130, 140, 0.25);}
.form-check-input{border-color: rgba(120, 130, 140, 0.65);}
.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;}
.table{--bs-table-bg:transparent;}
.card{border:0;}
/* BS5 客製 */
.d-flexOchi{display: flex;}
.container-ochi{margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px;}
.w-large-ochi{width: 100%; max-width: 1400px;}
.w-middle-ochi{width: 100%; max-width: 1000px;}
/* 本系統專用 */
body{background:#fafafa;}
#basecontentwrapper{min-height: 100vh;}
#mainheaderwrapper{position: sticky; top: 0; z-index: 999;}
#mainheader{background: #ffffff;box-shadow: 0px 0px 15px rgba(0,0,0,.1); padding: 10px;}
.logocolor{background: -webkit-linear-gradient(#578ab6, #072743);font-family: "Arial Black";
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.metismenubox{overflow: auto; position: absolute; width: 250px;}
#mainfooter{margin-top:20px;padding: 10px; text-align: center; font-size: 0.9rem;background:#f0f0f0;box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.1);}
#sidebar-wrapper{min-width: 250px; z-index: 990}
.itribreadcrumb{--bs-breadcrumb-divider: '>';}
.filetitle{border-bottom:2px solid #449ce8; padding-bottom:5px;  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);}
.icosA{font-size: 4rem; padding: 10px 0;}
.TitleLength06inside .TitleSetWidth{width:6em;}
.TitleLength08inside .TitleSetWidth{width:8em;}
#myTab > li > button.active{
    border-color: #b6b6b6;
    border-bottom-color: transparent;
    background: #fafafa;
}
.nav-tabs {
    border-bottom: 1px solid #b6b6b6;
}
.tboverW{overflow-x: auto;}
.backTop{position:fixed; z-index: 996; bottom:5%; right:-100px;opacity:0.7;}
.backTop a{color:#fff; padding:10px 20px 10px 20px;background:#000;-webkit-border-radius:10px 0 0 10px;-moz-border-radius:10px 0 0 10px;border-radius:10px 0 0 10px; height:20px; text-decoration:none; font-size:1.2em;}
.headingStyA{position: relative; padding-left: 10px;}
.headingStyA:after{
    background-image: linear-gradient(to right top, #1855de, #007af1, #0099fb, #00b7fe, #53d2ff);
    position: absolute;
    content: "";
    left: 0;
    top: 6px;
    bottom: 4px;
    width: 5px;
    border-radius: 5px;
}
.dividerA
{
    height: 20px;
    position: relative;
    width: 100%;
    background: radial-gradient(ellipse farthest-side at top center, rgba(0,0,0,0.08), transparent);
}
.dividerA:before {
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    right: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(left, transparent, rgba(0,0,0,0.02), rgba(0,0,0,0.02), transparent);
}
.shadowB{box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;}
.nicoimgMh{max-height: 120px;}

/* tooltip custom */
.tooltipTypeA{
    --bs-tooltip-bg:#fffcd8;
    --bs-tooltip-color: #2c2c2c;
    --bs-tooltip-max-width: 650px;
    --bs-tooltip-opacity:1;
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}
.tooltipTypeA .tooltip-inner{text-align: left;}
.icosA2{font-size: 6rem;}
.dm-uploader {
    border: 0.25rem dashed #A5A5C7;
    text-align: center;
}
.thbgA{background-color: rgba(227, 244, 255,1)!important;}
.table th{border-bottom: inherit!important;}
.tabletdWa{width:250px;}

/* sticky table */
.cssstickytable{
    width: 100%;
    overflow: auto;
    position: relative;
    z-index: 1;
}
.cssstickytable table {
    width: 100%;

}
.cssstickytable table thead th {
    background-color: #e3f4ff;
    position: sticky;
    top: 0;
    /*Just to make sure table gets a wider content as much as possible*/
}
.cssstickytable table thead th + th {

}
.cssstickytable table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
}
.cssstickytable table tbody td {
    /*Just to make sure table gets a wider content as much as possible*/
    /*If you don't want the first left column sticky then skip the below style*/
}
.cssstickytable table tbody td + td {
}
.cssstickytable table tbody td:first-child {
    background-color: #fff;
    position: sticky;
    left: 0;
}

.cssstickytable table tbody tr:nth-child(1) td:first-child {
    background-color: #f8ecc5;
}
.cssstickytable table tbody tr:nth-child(2) td:first-child {
    background-color: #fff3cc;
}
.keywordmore{color:#196cb5; cursor: pointer;}
.keywordmore:hover{border-bottom: 1px solid #15457a;color: #15457a;}
.bgkeyword{background: #f9f664;}
.obj-wrapperT1 {
    position:relative;
    width:100%;
    padding-bottom:60%;
    height:0;
    overflow:hidden;
}
.SVGcontent {
    position:absolute;
    width:100%;
    height:100%;
}
#radar {
    width: 100%;
    height: 100%;
}
#centerSVG{overflow-y: auto;}
.sidebarboxW{width: 400px; background: #fbfbfb; overflow-y: auto;}
.modalPL{position: absolute; top: 0; left: 0; margin: 0;}
.modalPR{position: absolute; top: 0; right: 0; margin: 0;}

.genbg{
    background-image: linear-gradient(to right bottom, #b5def8, #b5e4f5, #b8e8f2, #bfecee, #c8f0ea);
}
.loginwrapper{display: flex;align-items: center;justify-content: center;}
.loginbox{width:100%;max-width: 550px; margin-right: auto; margin-left: auto;}
.d-flexOchi{display: flex;}
.logoset .btitle {font-size: 2.1rem; font-weight: bold; color: #167aa6; line-height: 2rem;}
.logoset .stitle {font-size: 0.8rem;  color: #158ebb; line-height: 0.8rem;}

.frontwrapper{display: flex;align-items: center;justify-content: center;}
.frontbox{width:100%;max-width: 1400px; margin-right: auto; margin-left: auto;}
.advsearchitem{max-height: 200px; overflow-y: scroll}
