@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&family=Noto+Sans+TC:wght@100;300;400;600;700&family=Poppins:wght@300;400;500;600&display=swap');

*{
    font-size: 14px;
  font-family: 'Dancing Script', cursive;
  font-family: 'Noto Sans TC', sans-serif;
  font-family: 'Poppins', sans-serif;
  /* font-family: Arial, Verdana, Helvetica, sans-serif; */
  }
/*--- sidebar START ---*/
.menu .sidebar-item{
    list-style:none;
    margin-top:.5rem;
    position:relative
}
.sidebar-wrapper .menu .sidebar-item.active.has-sub .sidebar-link:after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9" style="fill:none;stroke:white;stroke-width:1"></polyline></svg>')
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link{
    /* background-color:#435ebe */
    background-color:#fff
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link span{
    /* color:#fff */
    color:#000
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link svg,.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link i{
    fill:#fff;color:#fff
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link.has-sub:after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9" style="fill:none;stroke:white;stroke-width:1"></polyline></svg>')
}

.sidebar-wrapper .menu .submenu{
    list-style:none;max-height:0;overflow:hidden;transition:all .5s
}
.sidebar-wrapper .menu .submenu.active{
    height:var(--submenu-height);display:block
}
.sidebar-wrapper .menu .submenu.submenu-closed{
    max-height:0
}
.sidebar-wrapper .menu .submenu.submenu-open{
    max-height:var(--submenu-height)
}
.sidebar-wrapper .menu .submenu .submenu-item.active{
    position:relative
}
.sidebar-wrapper .menu .submenu .submenu-item.active>a{
    color:#435ebe;font-weight:700
}
.sidebar-wrapper .menu .submenu .submenu-item a{
    padding:.7rem 2rem;display:block;color:#25396f;font-size:.85rem;font-weight:600;letter-spacing:.5px;transition:all .3s
}
.sidebar-wrapper .menu .submenu .submenu-item a:hover{
    margin-left:.3rem;color:#435ebe
}
.sidebar-item.has-sub,.submenu-item.has-sub{
    overflow:hidden;position:relative
}
.sidebar-item.has-sub>.sidebar-link:after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9" style="fill:none;stroke:gray;stroke-width:1"></polyline></svg>');position:absolute;color:#ccc;right:15px;top:12px;display:block
}
.submenu-item.has-sub>.submenu-link:after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9" style="fill:none;stroke:gray;stroke-width:1"></polyline></svg>');position:absolute;color:#ccc;right:15px;top:12px;display:block
}
.sidebar-backdrop{
    position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:9
}
@media screen and (max-width: 1199px){
    .sidebar-wrapper{
        position:fixed;left:-300px
    }
    .sidebar-wrapper .sidebar-toggler.x{
        display:block
    }
}@keyframes slideDown{
    0%{max-height:0}to{max-height:var(--submenu-height)}
}
@keyframes slideUp{
    0%{max-height:var(--submenu-height)}to{max-height:0}
}
/*--- sidebar END ---*/

/*--- main START ---*/
#main #main-content {
    padding-top: 0.25rem;
}
/*--- main END ---*/