@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome.min.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans:wght@400;700&family=Noto+Serif+SC:wght@200;300;400;500;600&family=Noto+Serif+TC:wght@200;300;400;500;600&family=Noto+Serif:wght@400;700&display=swap');
@import url('/jquery/horizontalmenu/jquery.horizontalmenu.css');
@import url('checkbox.css');

*, ::after, ::before { margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
*:focus { outline: none; }

header, footer, div, nav, article, h2, h3, h4, h5, h6, hr, p, form, label, input, button, select, textarea, ul, li, img, svg, span, font, strong, b, a, i { text-align: left; vertical-align: middle; word-wrap: break-word; word-break: break-word; line-height: 170%; border-width: 0; font-family: var(--font-family), sans-serif; font-size: 17px; color: #495057; }

/* Headings */
.h1 , .h2 , .h3 , .h4 , .h5 , .h6 , h1 , h2 , h3 , h4 , h5 , h6 { font-weight: 500; line-height: 1.2; }
.h1 , h1 { font-size: 2.5rem; }
.h2 , h2 { font-size: 2rem; }
.h3 , h3 { font-size: 1.7rem; }
.h4 , h4 { font-size: 1.5rem; }
.h5 , h5 { font-size: 1.2rem; }
.h6 , h6 { font-size: 1rem; }

ul , ol { list-style: none; }

fieldset { border: 0; }

input , button , select , textarea { padding: .3rem 1rem; width: 100%; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .2rem; box-shadow: none; }
input::-webkit-outer-spin-button , input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
input[type=number] { -moz-appearance: textfield; }
input[type="password"] { font-family: auto; }
select { padding: .3rem 1rem; }

/* img */
img { max-width: 100%; }
.img_cover { width: 100%; object-fit: cover; }
.img_contain { width: 100%; object-fit: contain; }

/* svg */
svg.fa { width: 20px; height: 20px; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

a , a:link , a:visited , a:hover { text-decoration: none; white-space: pre-wrap; }

/* general class set */
.txt_clamp { overflow: hidden; height: 27px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.d_inblock.txt_clamp { display: -webkit-inline-box; }
.atag_item { width: 100%; height: 100%; top: 0; left: 0; }
.nowrap_box { font-size: 0; }
.white_nowrap { white-space: nowrap; }
.flex_wrap { flex-wrap: wrap; }
.flex_direction { flex-direction: column; }
.txt_uppercase { text-transform: uppercase; }

/* btn */
.btn { padding: .2rem 1rem .25rem; border-width: 1px; border-style: solid; border-radius: .2rem; display: inline-block; text-align: center; line-height: 1.2; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.btn[disabled] { opacity: .7; cursor: not-allowed; }
.btn_pill { padding: .6rem 2rem; }

/* badge  */
.badge { padding: .2rem .3rem; border-radius: .2rem; line-height: 1; font-size: 15px; text-align: center; white-space: nowrap; vertical-align: baseline; }
.badge_pill { padding: .7em 2em; border-radius: 10em; }

/* fancybox */
[class^="fancybox-"] , [class^="fancybox-"] * , .slick-track , .fa , .fas , .fa:before , .fas:before , .fa:after , .fas:after , .trans_none_box , .ui-sortable >* , .ui-sortable-handle { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
.fancybox-infobar__body span { font-size: inherit; color: currentcolor; vertical-align: initial; }
.fancybox-buttons { display: none !important; }

/* workframe */
.workframe { margin: 0 auto; width: 90%; }

/* card */
.card { position: relative; margin: 1.5rem 15px 2.5rem; min-width: 0; background-color: #fff; background-clip: border-box; border: 0 solid transparent; border-radius: 0.25rem; box-shadow: 0 0 0.875rem 0 rgb(53 64 82 / 10%); display: flex; flex-direction: column; }
.card_body { padding: 1rem .7rem; width: 100%; }
.txt_danger.card_body { padding: 1rem 1.7rem; }

/* page_title */
.page_title { margin: 2.5rem 15px 0; font-size: 25px; font-weight: normal; color: #2f2929;  }

/* sidePage */
#sidePage { overflow: hidden; position: fixed; width: 240px; height: 100vh; background: #222a37; top: 0; }
#sidePage .top_logo { height: 60px; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%); font-size: 20px; color: rgb(149 158 171 / 62%); top: 0; z-index: 1; }

/* menu */
#menu { overflow-y: scroll; margin: 0 0 15px; padding: 1rem 0; height: calc(100vh - 60px); border-radius: .3em; }
#menu::-webkit-scrollbar { width: 0; }
#menu a.parent { position: relative; margin: 0 .5rem; padding: .4rem 0; display: -ms-grid; display: grid; -ms-grid-columns: 28px 1fr 15px; grid-template-columns: 28px 1fr 15px; -ms-grid-rows: 1fr; grid-template-rows: 1fr; grid-template-areas: 'svg font down'; align-items: center; cursor: pointer; }
#menu a.parent svg { width: 17px; height: 17px; grid-area: svg; }
#menu a.parent font { font-size: 17px; color: var(--light); grid-area: font; }
#menu a.parent i { line-height: 1; font-size: 15px; color: #edf2f9; grid-area: down; }
#menu >li { padding: 0 .3rem; margin: 0; border-bottom: 1px #17232c solid; }
#menu >li >ul { margin: 0 .5rem; padding-left: 28px; display: none; }
#menu >li >ul a { padding: .5rem 0; display: block; line-height: 1.3; font-weight: 300; font-size: 16px; color: rgba(255, 255, 255, .7); cursor: pointer; }
#menu >li.action { margin: 0; padding-bottom: .5rem; background: rgb(0 0 0 / 30%); }
#menu >li.action >ul { display: block; }
#menu >li.action >ul a.chack { color: #9bc3ff; }

/* sideBg */
#sideBg { position: fixed; width: 100vw; height: 100vh; background: rgb(0 0 0 / .5); top: 0; left: 0; pointer-events: none; z-index: 10; opacity: 0; }

/* header */
header { width: 100%; box-shadow: 0 0 2rem 0 rgb(53 64 82 / 10%); top: 0; right: 0; z-index: 20; }
header a { padding: .5rem .7rem; }
header a[data-action="menuBtn"] { line-height: 1; }
header a[data-action="menuBtn"] .fa { width: 25px; height: 25px; }

/* notify_list */
#notify_list { min-width: 160px; background: #fff; border: 1px #e4e4e4 solid; border-radius: .25rem; box-shadow: 0 0 0.875rem 0 rgb(53 64 82 / 10%); top: -100px; right: 50px; z-index: 19; }
#notify_list[data-type="2"] { top: 60px; }
#notify_list a { padding: .3rem .5rem; border-bottom: 1px #e4e4e4 solid; display: -ms-grid; display: grid; -ms-grid-columns: 25px 1fr 25px; grid-template-columns: 25px 1fr 25px; -ms-grid-rows: 1fr; grid-template-rows: 1fr; grid-template-areas: 'svg font num'; align-items: center; }
#notify_list a svg { grid-area: svg; }
#notify_list a span { grid-area: font; }
#notify_list a b { text-align: center; font-size: 65%; grid-area: num; }

/* content */
#content { padding-top: 61px; padding-bottom: 80px; min-height: 100vh; }

/* chgTimeBox */
#chgTimeBox a { padding: .1rem .5rem; float: right; border-color: rgb(0 0 0 / 20%); border-radius: 0; }
#chgTimeBox a[data-type="1"] { border-right: 0; border-radius: 5px 0 0 5px; }
#chgTimeBox a[data-type="3"] { border-left: 0; border-radius: 0 5px 5px 0; }

/* search_box */
.search_box label { margin-right: .5rem; }
.search_box input , .search_box select { padding: .2rem .3rem; width: auto; max-width: 200px; }
.search_box input { padding: .2rem .7rem; }

/* pag_box */
.pag_box { flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.pag_box .pag_no { flex-wrap: wrap; justify-content: center; align-items: center; }
.pag_box input { margin: 0 .3rem; padding: .15rem .5rem; width: 50px; line-height: 1; text-align: center; }
.pag_box .pag_no >* { padding: 0 .5rem; height: 30px; border: #d8e2ef solid; border-width: 1px 0 1px 1px; line-height: 28px; font-size: 16px; }
.pag_box .pag_no b { border-color: var(--dark); }
.pag_box .pag_no a[data-action="goPage"]:first-child { border-radius: 2px 0 0 2px; line-height: 25px; }
.pag_box .pag_no a[data-action="goPage"]:last-child { border-radius: 0 2px 2px 0; border-width: 1px; line-height: 25px; }
.pag_box .pag_no a[data-action="goPage"] i { font-size: 14px; }

/* footer */
footer { padding: .8rem 1.25rem; width: 100%; border-top: 1px rgb(0 0 0 / 10%) solid; font-size: 14px; right: 0; bottom: 0; }

@media screen and (min-width: 1441px){
	.workframe { width: var(--width-xxl); }
}
@media screen and (min-width: 1281px){
	header { width: calc(100% - 240px); }
	#content { margin-left: 260px; padding-right: 30px; }
	#chgTimeBox a:hover { box-shadow: inset 0 0 5px rgb(62 62 62 / 30%); }
	footer { width: calc(100% - 240px); bottom: 0; }
}
@media screen and (max-width: 1280px){
	#sidePage { box-shadow: 0 7px 14px 0 rgb(59 65 94 / 10%), 0 3px 6px 0 rgb(0 0 0 / 20%); left: -250px; z-index: 15; }
	#sidePage #menu >li:last-child { margin-bottom: 30px; }
	body[data-type="2"] #sidePage { left: 0; }
	body[data-type="2"] #sideBg { pointer-events: auto; opacity: 1; }
	#content { padding-left: 1%; padding-right: 1%; }
}
@media screen and (max-width: 768px){
	.card { margin: 1.5rem 1rem 1.5rem; padding: 0 0 1.5rem; }
	#content { padding-left: 0; padding-right: 0; }
}
@media screen and (max-width: 550px){
	header .btns a span { display: none; }
}
@media screen and (max-width: 425px){
	header .btns a span { display: none; }
}