@charset "UTF-8";
/* CSS Document */
.side-nav-wrapper{ width:100%; background:#fff; transition: 0.5s; display: block;  }
.side-nav{ position: relative; width: 100%;  height:100vh; overflow-y: scroll;overflow-x: hidden; }
#pageMenu ul{padding: 0;}
#pageMenu ul.links a{color:#555555; font-weight: normal;display: block;border-bottom: solid 1px #ccc;height: 60px;
    line-height: 60px; padding-left: 20px;font-size: 16px;}

#pageMenu ul.func_bx{height: 60px;justify-content: flex-start; padding-left: 20px;border-bottom: solid 1px #ccc;}
#pageMenu ul.func_bx li{margin: 0 5px 0 0;}
#pageMenu ul.func_bx a{display: flex; justify-content: center; align-content: center;height: 30px; padding: 0 15px; line-height: 30px;font-size: 16px; }
#pageMenu ul.func_bx a[class|="btn"]{border: 2px solid #dddddd;}
#pageMenu ul.func_bx a.btnOn{border: solid 2px rgba(255,255,255,0); color:#fff;}

#pageMenu .mem_bx{ padding:20px 20px 10px;background: #f1e8ee; border-bottom: solid 1px #ccc;}
#pageMenu .mem_bx .top_bx{ display: flex; align-items: center; margin-bottom: 1rem;}
#pageMenu .mem_bx .top_bx *:first-child{margin-right: auto;}
#pageMenu .mem_bx .top_bx a{display: flex; justify-content: center; align-content: center;height: 30px; padding: 0 15px; line-height: 30px;font-size: 16px; }
#pageMenu .mem_bx .top_bx a[class|="btn"]{border: 2px solid #dddddd;}
#pageMenu .mem_bx .top_bx a.btnOn{border: solid 2px rgba(255,255,255,0); color:#fff;}
#pageMenu .mem_bx a[class*="gear"]{padding: 0; margin: 0 5px;}
#pageMenu .mem_bx a[class*="gear"]::before{ content: '';display: block; width:30px; height:30px; background: url("../images/ico-gear-wh.svg") center no-repeat; background-size: 24px auto; }

#pageMenu .mem_func, #pageMenu .mem_func li a{display: flex; align-items: center;}
#pageMenu .mem_func{ flex-wrap: wrap;}
#pageMenu .mem_func li{width: calc((100% - 15px)/2); margin-bottom: 10px;}
#pageMenu .mem_func li:nth-child(odd){margin-right: 15px;}
#pageMenu .mem_func li a{ justify-content: center; border: none;  display: flex; height: 30px; line-height: 30px; background: #fff; border-radius: 5px; box-shadow: 3px 3px 0px rgba(210,173,173,0.1);}

/*字級&間距更動*/
@media screen and (max-width: 999px){

}
@media screen and (max-width: 767px){
	.main_bx .side-nav-wrapper{display: none;}
	/*side-contain*/
	.side-contain,.main_bx.open .side-contain{ width:100%;  padding: 0; margin: 0;  }
}
