@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
    font-size: 1em;
	font-family: Consolas, "Microsoft JhengHei", "Apple LiGothic Medium";
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
img,
label,
input,
select,
span,
iframe,
a {
	display: block;
}

a{
	text-decoration: none;
}

select, input{
    border-bottom: 1px solid #777;
    outline: none;
    padding: 5px 8px;
	height:35px;
}

.light_mode {
	--primary-background: #fff;
	--primary-background1: rgb(255 231 214 / 90%);
	--primary-background2: #fcead3;
	--primary-color: #050505;
	--secondary-background: #ededed;
	--secondary-background1: rgb(231 231 231 / 80%);
	--secondary-color: #65676B;
	--primary-boxshadow: 0 0 20px rgb(211 211 211);
	--secondary-boxshadow: -1px 0 5px rgb(211 211 211);
	--header-background: rgb(91 154 255 / 85%);
	--header-list-background: rgb(67 139 255 / 85%);
	--menu-background: #ede7e7;
	--nickname-color: #5a4d4d;
	--systemtxt-color: #797979;
	--placeholder-color: #797979;
	--sharepage-background: #ddeaec;
	--surface-background: #F0F2F5;
	--shadow-2: rgba(0, 0, 0, 0.2);
	--primary-deemphasized-button-text: #1877F2;
	--table-even: #cff4ff;
	--table-thead-background: #E4E6EB;
	--table-rContent: #ffdede;
	--table-CostDearlerTable: #a8e8ff;
	--table-reportTable: rgb(255, 250, 188);
	--table-reportImportant: red;
	--fileItemHead: rgb(228, 212, 252);
	--ProductStock: #a96969;
	--tblmemberprice: rgb(255 255 49 / 75%);
	--button-background: #d7d7d7;
	--button-color: rgb(24 25 26 / 90%);
	--formHeadName: #a0a0ff;
	--customerFocus: #ffeb00;
	--titleContainer: #e9e9e9;
	--contentContainer: #ccc;
	--viewSelected: #90ff90;
	--menuLabel: #86d7f7;
	--btn-saved: #1232d5;
	--btn-saved-hover: #2747e5;
	--btn-default-color: #fbdc3f;
	--btn-cancel: rgb(255 77 77);
	--btn-cancel-hover: rgb(255 106 106);
	--btn-green: #45831e;
	--btn-green-hover: #5c9b34;
	--customerPath-list: #bfbfbf;
	--customerPath-list-hover: #707070;
	--chat-content: #fff7f7;
	--CustomerReview-blueviolet: #d1a6f7;
	--CustomerReview-green: #c4f1c4;
	--CustomerReview-brown: #e19595;
	--loginArea-Panel: #e3e3e3;
	--Message-background: #e9e9e9;
	--Message-color: #292a2b;
	--noteMessage-Shadow: rgb(99 99 99 / 30%);
	--Calendar-Holiday: rgb(211 211 211 / 70%);
	--PanelEditor-Shadow: 0 0 50px rgb(201 201 201);
	--filter-select-border: #333;
	--job-description-table-background: #fff;
	--color-coffee: #756115bf;
	--color-brown: brown;
	--color-chocolate: chocolate;
	--color-blue: blue;
	--color-green: green;
	--color-purple: purple;
	--color-burlywood: burlywood;
	--color-cornflowerblue: cornflowerblue;
	--color-crimson: crimson;
	--color-darkgoldenrod: darkgoldenrod;
	--color-darkorchid: darkorchid;
	--color-yellow: #999911;
	--warning-background: rgb(241, 178, 178);
	--ViewDetail-background: #ffdd9f;
}

.grid{
    display: grid;
}
.flex{
    display: flex;
}

.j_center{
    justify-content: center;
}
.j_spacebetween {
	justify-content: space-between;
}
.a_start{
	align-items: flex-start;
}
.a_center{
    align-items: center;
}

.txt_center{
	text-align: center;
}

.gap5{
	grid-gap: 5px;
}
.gap7{
	grid-gap: 7px;
}
.gap10{
	grid-gap: 10px;
}
.gap15{
	grid-gap: 15px;
}
.gap20{
	grid-gap: 20px;
}
.gap25{
	grid-gap: 25px;
}
.gap30{
	grid-gap: 30px;
}
.gap50{
	grid-gap: 50px;
}

.wh_none{
	display: none;
}
.wh_auto{
	overflow: auto;
}
.w100 {
	width: 100%;
	max-width: 1280px;
}

.btn {
	width: fit-content;
	padding: 10px 30px;
	cursor: pointer;
	transition: all .3s;
	user-select: none;
	/*防止畫面閃爍*/
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-ms-perspective: 1000;
	perspective: 1000;
	/*防止畫面閃爍*/
}
.btn:hover {
	transform: translate(-1px, -1px);
}
.btn:active {
	transform: translate(1px, 1px);
}

.m_top{
	margin-top: 10px;
}
.m_bottom{
	margin-bottom: 10px;
}
.m_left{
	margin-left: 10px;
}
.m_left2{
	margin-left: 20px;
}
.m_left3{
	margin-left: 30px;
}

.color_red{
	color:var(--color-crimson);
}
.color_green{
	color:var(--color-green);
}
.color_burlywood{
	color:var(--color-burlywood) !important;
}
.color_blue{
	color:var(--color-blue);
}
.color_coffee{
	color:var(--color-coffee);
}
.color_purple{
	color:var(--color-purple);
}