@charset "utf-8";
	/* CSS Document */
	@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500&subset=latin-ext');
	@import url('https://fonts.googleapis.com/css?family=Work+Sans:200');
	@import url('https://fonts.googleapis.com/css?family=Abel&display=swap');
	@import url('https://fonts.googleapis.com/css?family=Julius+Sans+One&display=swap');
	@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

	@font-face{
		font-family:chinese;
		src:local('PingFang'),local("微軟正黑體");
	}
	html{
		height:100%;
	}
body {
	background: url(/library/images/bg_marble.jpg) no-repeat center #f2f2f2;
	background-size: cover;
	background-attachment: fixed;
		font-family:arial,chinese;
		font-size:12px;
		font-weight:200;
		height:100%;
		margin:0px;
		padding:0px;
		overflow-y:scroll;
}
	body[lang='en']{
		font-family:arial,chinese;
	}

	body[lang='tc']{
		font-family:arial,chinese;
	}
	body *, body *::before, body *::after{
		box-sizing:border-box;
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s;
	}
	body canvas{
		transition:initial!important;
	}

	/* width */
	::-webkit-scrollbar {
		width: 4px;
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s;
	}
	::-webkit-scrollbar:hover{
		width:8px;
	}


	/* Track */
	::-webkit-scrollbar-track {
		box-shadow: inset 1px 0px 3px #dedede; 
		border-radius: 5px;
		background-color:#ffffff;

	}

	/* Handle */
	::-webkit-scrollbar-thumb {
		box-shadow:none;
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #12504b  0%, #26867e  10%,#0bffeb 100%); /* W3C */
		background: linear-gradient(to bottom, #6fd8cf  0%, #c6dad8  10%,#89b9b5 100%);
		background: linear-gradient(to bottom, #F3E6CD  0%, #F3E6CD  10%,#E0C99E 100%);
		opacity:0.7; 
		border-radius: 5px;

	}

	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
		box-shadow:inset 1px 0px 0px 0px rgb(64, 168, 228),inset 0px 1px 5px 0px rgb(64, 168, 228);
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		opacity:1;
		
		box-shadow:inset 1px 0px 0px 0px rgb(244, 200, 49),inset 0px 1px 5px 0px rgb(244, 200, 49);
		background: linear-gradient(to bottom, #EDE2A4  0%,#F6CF73 100%); 
	}

	body::-webkit-scrollbar{
		width:5px;
	}
	body::-webkit-scrollbar-track {
		box-shadow: inset 1px 0px 0px #cdcdcd; 
		border-radius: 0px;
		background-color:#ffffff;

	}
	body::-webkit-scrollbar-thumb {
		box-shadow:inset 1px 0px 0px 0px rgb(28, 131, 150);
		box-shadow:inset 1px 0px 0px 0px #ccaa11;
		background: linear-gradient(to bottom, #acf0ea  0%,#a8f1d9 100%); /* W3C */
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		/*background: linear-gradient(to bottom, #0bffeb  0%,#7dd8d0  20%,#33eeb0 100%);*/ /* W3C */

		opacity:0.7; 
		border-radius: 0px;
	}


	::placeholder{
		color:#999999;
		color:#788B94;
	}

	.float_r{
		float:right;
		position:relative;
		margin-left:5px;
		margin-top:0px!important;
		margin-bottom:0px!important;
	}
	.float_l{
		float:left;
		position:relative;
		margin-right:5px;
		margin-top:0px!important;
		margin-bottom:0px!important;
	}
	.clear{
		float:none!important;
		clear:both!important;
	}


	.hidden_overflow{
		overflow:hidden;
	}

	/* general global //////////////////////////////////////////*/
	div[required]::before{
		content:"";
		position:absolute;
		left:3px;
		bottom:3px;
		top:3px;
		width:4px;
		background-color:#ffdf00;
	}
	*[disabled], .disabled{
		opacity:0.3!important;
		pointer-events: none!important;
		cursor:default!important;
		position:relative!important;
	}
	*[disabled] + div.note{
		left:0px;
		right:0px;
		top:0px;
		bottom:0px;
		position:absolute!important;
		cursor:default!important;
		background:none!important;
		box-shadow:none!important;
		pointer-events:auto!important;
	}

	*[lockread]:not(input){
		pointer-events:none!important;
	}

	*[lockread] *{
		pointer-events:none!important;
	}
	*[lockread] + div.note{
		cursor:not-allowed!important;
		left:0px;
		right:0px;
		top:0px;
		bottom:0px;
		position:absolute!important;
		background:none!important;
		box-shadow:none!important;
	}
	*[lockread] + div.note::before{
		content:'locked';
		position:absolute;
		padding:5px 10px;
		background-color:#333;
		color:#fff;
		border-radius:5px;
		right:0px;
		left:0px;
		z-index:10;
		top:50%;
		transform:translateY(-50%);
		opacity:0;
	}

	*[lockread] + div.note:hover::before{
		content:'locked';
		position:absolute;
		padding:5px 10px;
		background-color:#333;
		color:#fff;
		border-radius:5px;
		right:0px;
		z-index:10;
		top:50%;
		transform:translateY(-50%);
		opacity:1;
	}
	*[readonly]{
		box-shadow:none!important;
		border:none!important;
	}

	/*
	*[readonly]::before{
		content:'locked';
		position:absolute;
		padding:5px 10px;
		background-color:#333;
		color:#fff;
		border-radius:5px;
		right:0px;
		top:50%;
		transform:translateY(-50%);
	}
	*/

	.enabled{
		max-height:100px;
		padding:0px!important;
		opacity:1;
	}

	.hidden{
		max-height:0px!important;
		overflow:hidden!important;
		padding:0px!important;
		margin:0px!important;
		opacity:0!important;
		position:absolute;
	}

	.readonly{
		pointer-events: none;
	}
	img {
		border:0px;
	}
	* {
		box-sizing: border-box;
		-webkit-touch-callout: none; /* iOS Safari */
		/*-webkit-user-select: none; /* Safari */
		-khtml-user-select: none; /* Konqueror HTML */
		/*-moz-user-select: none; /* Firefox */
		-ms-user-select: none; /* Internet Explorer/Edge */
		/*-o-user-select: none;
		/*user-select: none; /* Non-prefixed version, currently*/
	}
	.option, .status, .nav_listbox, .but_general, input[type=button], input[type=submit], .search_box .but_general.material-icons{
		-webkit-touch-callout: none; /* iOS Safari */
		-webkit-user-select: none; /* Safari */
		-khtml-user-select: none; /* Konqueror HTML */
		-moz-user-select: none; /* Firefox */
		-ms-user-select: none; /* Internet Explorer/Edge */
		-o-user-select: none;
		user-select: none; /* Non-prefixed version, currently*/
	}

	input,textarea,.debug_box * {
		-webkit-touch-callout: text; /* iOS Safari */
		-webkit-user-select: text; /* Safari */
		-khtml-user-select: text; /* Konqueror HTML */
		-moz-user-select: text; /* Firefox */
		-ms-user-select: text; /* Internet Explorer/Edge */
		-o-user-select: text;
		user-select: text; /* Non-prefixed version, currently*/
		background-color:#fbfbfb;
		background-color:#fafafa;
	}

	select, input, textarea {
		font-family: Arial,"PingFang","微軟正黑體",Helvetica, sans-serif;
		font-size: 11px;
		color: #333;
		color: #2B363B;
		border:1px solid rgba(25,25,25,0.05);

		box-shadow:inset 0px 0px 0px 1px #bfcac9;
		box-shadow:inset 0px 0px 0px 1px #DAE1E4;
		border:none!important;
		padding:5px 10px;
		margin-bottom:3px;
		margin-right:2px;
	   -moz-box-sizing:border-box;
	   -webkit-box-sizing:border-box;
		box-sizing:border-box;
		border-radius:5px;
		border-radius:3px;

		outline:none;
	}

	select{
		font-family:"Century Gothic", "微軟正黑體", Arial;
	}

	textarea {
		width:100%;
		resize:none;
	}
	input[type=text], input[type=number], input[type=password], textarea{
		padding:8px 13px 7px;
	}
	input[type=number]{
		padding-right:5px;
	}
	input[type=checkbox], input[type=radio] {
		border:none;
	}
	input[type=image]{
		padding:0px;
		margin:0px;
		border:none;
	}
	input:focus, select:focus, textarea:focus {
		color:#000;
		background-color:#fff!important;
		box-shadow:inset 0px 0px 0px 1px #30a38e, inset 0px 2px 3px 0px #c3d0d2!important;
		box-shadow:inset 0px 0px 0px 1px #C6A563, inset 0px 2px 3px 1px #EAEAEA!important;
		border:none!important;
		border-radius:5px;
		border-radius:3px;
	}
	a:link, a:visited, a:active {
		color: #5a6d6c;
		text-decoration: none;
		font-size:11px;
	}
	a:hover {
		color: #0046d5;
		text-decoration: none;
	}
	select option:disabled{
		color:#CCC;

	}
	.debug_box *{
		width:70%;
		overflow:auto;
		white-space:break-spaces;
		box-shadow:0px 0px 0px 1px #dedede;
		padding:20px;
		font-family:arial;
		font-size:11px;
		background-color:#333333;
		color:#00ffd0;
		margin:0px;
		margin-bottom:5px;
	}
	.image:empty{
		background:url('../../library/images/icon/no_file.png') no-repeat center center;
	}
	/* GLOBAL END //////////////////*/

	/* LOGIN /////////////////////*/
	.sys_title{
		font-size:36px;
		padding-bottom:10px;
	}

	.sys_login{
		height:100%;
		width:100%;
		display:flex;
		text-align:center;
		justify-content:center;
		align-items:center;
	}
	.sys_login > div{
		padding:30px;
	}

	.sys_login .desc{
		font-size:8px;
		padding-right:6px;
		padding-top:10px;
		color:#858383
	}
	.login_box{
		text-align:center;
	}
	.login_box input{
		width:100%;
		background-color:#f2f2f2;
		padding:10px 15px;
		border:none!important;
		box-shadow:none;
		text-align:center;

	}
	.login_box input:focus{
		box-shadow:inset 0px 3px 6px #bcbcbc!important;
		background-color:#efefef!important;
	}
	.login_box > div{
		margin-bottom:5px;
	}
	.login_box > div:nth-child(2) input{
		background-color:#f2f2f2;
	}
	.login_box ::placeholder{
		color:#333333;
		color:#788B94;
	}
	#login_request_password {
		position:absolute;
		width:360px;
		margin-left:0px;
		background-color:#91e6b7;
		background:-moz-linear-gradient(center top , #5ddbe8, #91e6b7); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #5ddbe8 0%,#91e6b7 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #5ddbe8,#91e6b7 100%); /* IE10+ */
		background: linear-gradient(to bottom, #5ddbe8 0%,#91e6b7 100%); /* W3C */
		color:#ffffff;
		text-align:left;
		display:none;
		z-index:10;
		border-top: 3px solid #C6A563;
		background: none;
		background: #fff;
		box-shadow: 0 0 10px rgb(0 0 0 / 10%);
	}
	#login_request_password .remark{
		font-size:11px;
		padding:10px 0px;
		color:#fbf800;
	}
	#login_request_password .title{
		font-size:20px;
		margin-bottom:10px;
		color: #2B363B;
	}
	#login_request_password > div {
		padding:15px;
	}
	#login_request_password .but_general{
		background-color:#ccecee;
		box-shadow:inset 0px 0px 10px #009bc8;
		background:-moz-linear-gradient(center top , #ccecee, #ffffff); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #ccecee 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #ccecee,#ffffff 100%); /* IE10+ */
		background: linear-gradient(to bottom, #ccecee 0%,#ffffff 100%); /* W3C */
		background: none;
		background: #C666646;
	}
	#login_request_password .but_general:hover{
		background-color:#ccecee;
		background:-moz-linear-gradient(center top , #ffffff, #ccecee); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #ffffff 0%,#ccecee 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #ffffff,#ccecee 100%); /* IE10+ */
		background: linear-gradient(to bottom, #ffffff 0%,#ccecee 100%); /* W3C */
		background: none;
		background: #2B363B;
	}
	.login_request_close {
		float:right;
		cursor:pointer;
		color:#ffffff;
		color:#788B94;
		font-size:11px;
	}
	#login_request_password_message {
		padding-top:5px;
	}
	.but_login{
		background-color:#23aa91;
		background-color:#C6A563;
		color:#ffffff;
		font-size:11px;
		text-transform:uppercase;
		padding:13px;
		/* padding-right:13px; */
		/* padding-bottom:11px; */
		/* padding-left:70px; */
		text-align:right;
		cursor:pointer;
		border-radius:5px;
		border-radius:3px;
		display:inline-block;
		line-height:0px;
	}
	.but_login:hover{
		background-color:#383a34;
		background-color:#2B363B;
		color:#00ffd0;
		color:#fff;
	}

	.time_box{
		padding-left:60px;
		padding-top:30px;
		color:#CCC;
		height:150px;
		font-family:'Century Gothic', Arial;
	}
	.time_box .day{
		min-width:90px;
		font-size:95px;
		color:#ffffff;
		line-height:65px;
		text-shadow:0px 0px 40px #259898;
	}
	.time_box .month{
		font-size:12px;
		line-height:12px;
		text-transform:uppercase;
	}
	.time_box .year{
		font-size:12px;
		line-height:12px;
	}
	.time_box .year_month_container{
		color:#9db9ad;
	}
	.time_box .weekday{
		color:#3c5235;
		text-align: center;
		text-transform: uppercase;
		font-size: 10px;
		letter-spacing:1px;
		background-color: rgba(61, 171, 149, 0.06);
		position: absolute;
		left:50%;
		top:120%;
		transform:translateX(-50%);
		padding: 2px 10px;

	}
	.time_box .time{
		font-size:60px;
		color:#d0e8e1;
		line-height:50px;
		font-family: 'Work Sans'

	}
	.time_box .sec{
		color:#d6d6d6;
		font-size:20px;
	}
	.date_container{
		overflow:hidden;
		text-align:left;
		padding-top:0px;
		padding-left:5px;
	}
	.time_container{
		margin-top:5px;
		padding-top:5px;
		border-top:0.5px solid #d6e8e6;
		font-size:30px;
	}
	.time_container > span{
		vertical-align:top;
		display:inline-block;
	}
	* html .time_container > span{
		display:inline;
	}
	* + html .time_container > span{
		display:inline;
	}
	/* LOGIN END ///////////////*/
	/* BASE /////////////////////////*/
	.sys_header{
		padding:10px 20px 10px 35px;
		/*background:url(../images/main/nav_outer.png) no-repeat right bottom;*/
	}
	.header_nav_box{
		display:inline-flex;
		align-items:center;
		font-size:11px;
	}
	.header_nav_box > div{
		margin-left:5px;
	}
	.header_infobox > div{
		display:inline-block;
		padding-left:10px;
		padding-right:10px;
		border-left:1px solid #CCC;
	}
	* html .header_infobox > div{
		display:inline;
	}
	* + html .header_infobox > div{
		display:inline;
	}

	.header_infobox > div:nth-child(1){
		border:none;
	}
	.but_logout{
		background:url(../images/button/logout.png) no-repeat center center;
		height:30px;
		width:30px;
		cursor:pointer;
		background-size:contain;
	}
	.but_logout:hover{
		background:url(../images/button/logout_ro.png) no-repeat center center;
		background-size:contain;
	}

	.footer{
		background-color:#fff710;
		position:fixed;
		bottom:0px;
		width:100%;
		font-size:10px;
		opacity:0;
		visibility: hidden;
	}
	.footer.hide{
		bottom:-100px;
	}
	.footer > div{
		padding:10px 40px;
	}
	.footer .licensing{
		color:#00970e;
	}
	.footer .licensing .clientname{
		color:#00295b;
		font-weight:bold;
		display:inline-block;
	}
	.footer .cr{
		color:#00970e
	}

	.navbox{
		/*
		box-shadow:25px 1px 0px #094e44, 60px 3px 0px #0d8680, 100px 8px 0px #bce7e0;
		box-shadow:25px 1px 0px #00ab84, 60px 3px 0px #bcd051, 100px 8px 0px #f7f384;
		*/
		box-shadow:0px 0px 1px 1px #9b9c9a;
		position:absolute;
		z-index:-1;
		top:30px;
		right:12px;
		opacity:0;
		text-align:right;
		pointer-events:none;
		/*background:url(../images/main/nav_outer_side.png) no-repeat left 25px;*/
		background: #fff;
	}
	#navbox ::-webkit-scrollbar-track {
		box-shadow: inset 1px 0px 3px transparent; 
		border-radius: 5px;
		background-color:transparent; 
	}

	.navbox.show,.navbox.pinned,.navbox:hover{
		opacity:1;
		pointer-events:initial;
		top: 84px;
		z-index:99;
	}
	.navbox::before{
		content:"";
		position:absolute;
		z-index:1;
		border-top:3px solid #00ff1f;
		border-top:3px solid #F9DA00;
		top:0px;
		right:0px;
		width:100%;
	}
	.navbox::after{
		content:"";
		position:absolute;
		width:30px;
		height:0px;
		right:45px;
		top:0;
		border-bottom:0px solid #2e3900;

	}
	.navbox.show::after, .navbox.pinned::after, .navbox:hover::after{
		height:45px;
		top:-45px;
		border-bottom:5px solid #2e3900;
		border-bottom:5px solid #2B363B;
		/*
		background-color:#aae8d7;
		box-shadow:0px 0px 0px 1px #aae8d7
		*/
	}
	.navbox:hover{
		opacity:1;
	}
	.navbox.top{
		position:fixed;
		top:0px;
		right:0px;
		bottom:0px;

	}

	.navbox > div{
		display:inline-block;
		vertical-align:top;
		position:static!important;
		background-color:#ffffff;
	}

	* html .navbox > div{
		display:inline;
	}
	* + html .navbox > div{
		display:inline;
	}
	.navbox .pin{
		position: absolute!important;
		background: none;
		color: #9ac7c3;
		color: #DAE1E4;
		right: 15px;
		z-index:101;
		font-size: 16px;
		top: 15px;
		cursor:pointer;
	}

	.navbox .pin.active{
		color:#29a238;
		color:#C6A563;
	}

	.nav_listbox{
		width:210px; /*200*/
		cursor:default;
		margin-bottom:0px;
		text-align:left;
		/*
		box-shadow:30px 25px 55px #dedede;
		overflow:auto;
		max-height:500px;
		*/
		overflow:auto;

	}
	.nav_listbox::before{
		content:"";
		width:210px;
	/*	height:100%;*/
		position:absolute;
		right:0px;
		background-color:#ffffff;
		opacity:0.3;
	}

	.nav_listbox .lv1{
		padding:10px;
		padding-left:0px;
		padding-right:0px;
		position:relative;
		color:#111111;
		/*background:url(../images/main/nav_unit_break.png) no-repeat 350px 0px;*/
		box-shadow:inset 0px 0px 0px 0px #639900,0px 0px 2px #c2e4dc,inset 10px 0px 20px #f2fdfc!important;
		box-shadow:inset 0px 0px 0px 0px #fcf9e5,0px 0px 2px #fcf9e5,inset 10px 0px 20px #fcf9e5!important;
		border-left:0px solid #82d6d2;
	}
	.nav_listbox .lv1:hover, .nav_listbox .lv1.active:hover{
		box-shadow:inset 3px 0px 0px 0px #639900,0px 0px 20px #c2e4dc,inset 10px 0px 20px #f2fdfc!important;
		box-shadow:inset 3px 0px 0px 0px #C6A563,0px 0px 20px #F6CF73,inset 10px 0px 20px #fcf9e5!important;
	}
	.nav_listbox .lv1:hover, .nav_listbox .lv1.active{
		opacity:1;
		color:#111111;
		background-position:0px 0px;
	}
	.nav_listbox .lv1.active{
		/*box-shadow:inset -6px 0px 0px 0px #1acfb1;*/
		box-shadow:inset 3px 0px 0px 0px #639900,0px 0px 20px #c2e4dc,inset 10px 0px 20px #f2fdfc!important;
		box-shadow:inset 3px 0px 0px 0px #e1e1e1,0px 0px 20px #c2e4dc,inset 10px 0px 20px #f2fdfc!important;
		box-shadow:inset 3px 0px 0px 0px #fcf9e5,0px 0px 20px #fcf9e5,inset 10px 0px 20px #fcf9e5!important;
	}

	.nav_listbox > div:nth-child(1){
		padding-top:10px;
	}

	.nav_listbox .lv1 > div.heading{
		color:#22a800;
		color:#2B363B;
	/*	background:url(../images/main/nav_indicator2.png) no-repeat left 9px;*/
		font-size:16px;
		font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		font-weight:400;
		line-height:16px;
		padding-bottom:5px;
		padding-top:5px;
		padding-left:25px;
		padding-right:15px;
		margin-bottom:3px;
		/*
		background:url(../images/main/nav_indicator2_ro.png) no-repeat -20px 9px;*/
		position:relative;
	}
	.nav_listbox .lv1 > div.heading::before{
		position:absolute;
		content:"";
		width:35px;
		height:15px;
		border-radius:10px;
		border:3px solid #cfe4e3;
		border:3px solid #639900!important;
		border:3px solid #B48070!important;
		left:-35px;
		top:50%;
		transform:translateY(-50%) rotate(-180deg);
	}
	.nav_listbox .lv1:hover > div.heading, .nav_listbox .lv1.active > div.heading{
		background-position:-2px 9px;
	}
	.nav_listbox .lv1:hover > div.heading::before, .nav_listbox .lv1.active > div.heading::before{
		left:-20px;
		transform:translateY(-50%) rotate(0deg);
	}
	.nav_listbox .lv1.active:hover > div.heading::before{
		border:3px solid #639900!important;
		border:3px solid #957B73!important;
		border:3px solid #B48070!important;
	}
	.nav_listbox .lv1.active > div.heading::before{
		border:3px solid #05d876!important;
		border:3px solid #cfd9d8!important;
	}
	.nav_listbox .lv1.active > div.heading{
		color:#003333!important;
	}
	.nav_listbox > div:nth-last-child(1){
		padding-bottom:20px!important;
	}
	.nav_listbox .list{
		overflow:hidden;
	}
	.nav_listbox .lv1:hover .list, .nav_listbox .lv1.active .list{
		opacity:1;

	}
	.nav_listbox .lv1 > div.heading,  .nav_listbox .list > div{
		padding-left:25px;
		padding-right:15px;
		color: #C6A563;
	}
	.nav_listbox .list > div{
		position:relative;
	/*	background:url(../images/main/nav_indicator.png) no-repeat left 3px;*/
		font-size:12px;
		font-family:arial,chinese;
		padding-top:4px;
		padding-bottom:4px;
		cursor:pointer;
		color:#737775;
		color:#788B94;
	}
	.nav_listbox .list > div:not([disabled])::before{
		content:"";
		position:absolute;
		/*background:url(../images/main/nav_indicator_ro.png) no-repeat center center;*/
		top:50%;
		width:12px;
		height:12px;
		margin-left:-50px;
		transform:translateY(-50%);
		box-shadow:inset 0px 0px 0px 2px transparent;
	}
	.nav_listbox .list > div:hover::before{
		margin-left:-19px;
		border-radius:50%;
		box-shadow:inset 0px 0px 0px 2px #f2d60e;
		box-shadow:inset 0px 0px 0px 2px #F6CF73;

	}
	.nav_listbox .list .note::before{
		opacity:0;
	}
	.nav_listbox .list > div:hover, .nav_listbox .list > div.active{
		opacity:1;
		color:#5e2c03!important;
		color:#2B363B!important;
	}
	.nav_listbox .list > div:hover{
		padding-left:38px;
		/*color:#ff6c00!important;*/
	}

	.nav_listbox .list > div.active{
		background-position:-25px 2px;
		margin-left:25px;
		padding-left:13px;
		color:#077b7b!important;
		color:#CC6646!important;

	}
	.nav_listbox .list > div.active::before{
		position:absolute;
		content:"";
		left:0px;
		height:10px;
		margin-left:0px;
		border-left:3px solid #8fca32!important;
		border-left:3px solid #009a7e!important;
		border-left:3px solid #CC6646!important;
		background:none!important;
		border-radius:0px;
		box-shadow:none;
	}

	.section_header{
		padding:15px 35px 5px;
		padding-right:20px;
	
		opacity:0;
		padding-left:0px;
		box-sizing:border-box;
		position:relative;
	}
	.section_header.details .section_heading{
		font-size:15px;
		font-weight:500;
		margin-left:0px;
		margin-bottom:0px;
		line-height:15px;
		text-shadow:0px 1px 0px #dedef38f; /* #0000ba;*/

	}
	.section_header::before{
		content:"";
		box-shadow:inset 0px 0px 0px #0b0065;
		background:url(../images/main/bg.jpg) no-repeat 0px -120px;
	}
	.section_header.top::before{
		content:"";
		position:absolute;
		background:url(../images/main/bg.jpg) no-repeat 0px -120px;
		background-color:#ffffff;
		top:0px;
		left:0px;
		right:0px;
		bottom:0px;
		z-index:-1;
		opacity:0.90;
		box-shadow:inset 15px 0px 0px #0b0065;

		box-shadow:inset 15px 0px 0px #C6A563;

	}
	.section_header:hover::before{
		opacity:1;
	}
	.section_header::after{
		content:"";
		clear:both;
		/*display:block;*/
	}
	.section_header.top{
		margin-top:0px;
		position:fixed;
		top:0;
		left:0;
		right:0;
		/*background:rgba(255,255,255,0.9);*/
		margin-right:0px;
		z-index:120;
		box-shadow:-30px 0px 10px #aad0d0; /* #cdcdcd;*/
		box-shadow:-30px 0px 10px #2fb9d87a;
		box-shadow:-30px 0px 10px #F6CF73;

	}

	.section_header.top .section_heading{
		/*
		line-height:18px;
		font-size:20px;
		margin-bottom:5px;
		*/
	}
	.section_heading{
		/*background:url(../images/main/section_icon.png) no-repeat left center;*/
		background-size:contain;
		margin-bottom:10px;
		margin-left:-5px;
		color:#3d7301;
		color:#2B363B;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-size:35px;
		line-height:28px;
		padding-left:0px;
	}

	.section_heading2{
		background-color:#fff710 ;
		background:-moz-linear-gradient(center top , #fff710 , #ffd200 ); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #fff710 0%,#ffd200 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #fff710 ,#ffd200 100%); /* IE10+ */
		background: linear-gradient(to bottom, #fff710 0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #0ab1cc 0%,#8be8c6 100%);
		background: linear-gradient(to bottom, #8be7f1 0%,#b5ffdd 100%);
		background: linear-gradient(to bottom, #7ad8ba 0%,#67c7ba 100%);
		background: linear-gradient(to bottom, #000000 0%,#3F4F56 100%);
		color:#000c59!important;
		color:#033c3c!important;
		color:#ffffff!important;
		font-weight:400!important;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-size:13px!important;
		line-height:20px;
		border-radius:5px;
		margin-bottom:3px!important;
		margin-right:0px!important;
		/*border-bottom:1px solid #FC0;*/
		padding:3px 15px 3px!important;
	}
	.subheading{
		/*background:url(../images/main/section_icon.png) no-repeat left center;*/
		background-size:contain;
		margin-bottom:10px;
		margin-left:-5px;
		color:#3d7301;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-size:15px;
		line-height:28px;
		font-weight:500;
		padding-left:0px;
		
		color:#2B363B;
	}

	.version{
		position:absolute;
		background-color:rgba(31, 229, 193, 0.15);
		left:100px;
		top:17px;
		padding:5px 7px;
		border-radius:3px;
		color:#1c7cdb;
		font-size:7px;
	}
	.locator{
		background:url(../images/main/locator.png) no-repeat left center;
		color:#0c7f00;
		color:#2B363B;
		margin-left:0px;
		padding-left:20px;
		padding-top:0px;
		font-size:10px;
	/*	text-transform:uppercase;*/
	}
	.label{
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		display:table;
		margin-top:8px;
		margin-left:0px;
		border-radius:6px;
		overflow:hidden;
		background-color:#333;
		background-color:#00bfd2;
		background-color:#000755;
		background-color:#0d8b9e;
		background-color:#CC6646;
		color:#0FF;
		color:#ffffff;
		font-size:18px;
		line-height:14px;
		position:relative;
	}
	.label > div{
		padding:8px 20px;
		display:inline-table;
		position:static!important;
		text-shadow:0px 1px 1px #18b0b7;
		text-shadow:none;
	}

	.label .status{
		font-family:'Montserrat',chinese;
		border-radius:0px!important;
		background-color:#aff2f9;
		background-color:#095876;
		background-color:#2B363B;
		color:#333333;/*#fff905;*/
		color:#00ffe7;
		color:#F6CF73;
		font-size:inherit;
	}
	.label .headline{
		background-color:#0b5f6d;
		background-color:#2B363B;
	}
	.info_bar{
		display:table;
		margin-top:-5px;
		align-items: stretch;
		flex-wrap: nowrap;
		border-radius:6px;
		background-color:#333;
		color:#fff;
		margin-bottom:3px;
	}
	.info_bar > div{
		display:inline-block!important;
		padding:5px 7px;
		margin:0px!important;
		vertical-align:top;
	}
	.info_bar > div:nth-child(1){
		padding-left:15px!important;
	}
	.info_bar > div:nth-last-child(1):not(.date_h){
		padding-right:15px!important;
	}
	.data_label{
		display:table;
		padding:5px 7px;
		border-radius:6px;
		background-color:#333;
		color:#fff;
		margin-bottom:3px;
	}

	.block{
		display:block;
	}

	.section_panel_container{
		flex:1 1 100%;
	}

	.section_container{
		clear:both;
		background:url(../images/main/section_title_break.png) no-repeat left top;
		padding:20px 20px;
		padding-bottom:50px;
		padding-right:20px;
		margin-top:50px;
		position:relative;
		transition:padding-top 0s;
		opacity:1;
	}

	.datasec_container{
		display:flex;
		align-items: stretch;
		flex-wrap: wrap;
	}

	.datasec_container > div{
		flex: 1 1 auto;
		margin:0px 10px;
		vertical-align:top;

	}
	.datasec_container > div:nth-child(1){
		flex-grow:8;
	}

	.datasec_container.setting{
		flex-wrap: nowrap;
	}
	/*
	.datasec_container.setting > div:nth-child(1){
		flex-basis:100%;
	}
	*/
	.datasec_container > div > div{
		padding:10px;
		margin-bottom:20px;
		border-radius:5px;
		border:0px solid #efefef;
		box-shadow:0px 0px 5px #efefef;
		background-color:rgba(255,255,255,0.3);
		position:relative;
		border-top:1px solid #e9f0ef;
	}
	.datasec_container .table_form{
		margin:0px;
	}
	.datasec_container .setting_unit{
		padding:0px;
		margin-bottom:10px;
	}
	.datasec_container .setting_unit:hover > div:nth-child(1){
		border-color:#333;
		border-width:1px;
		box-shadow:0px 1px 0px #29a09a,0px 2px 1px #dff90a;
		box-shadow:0px 1px 0px #C6A563,0px 2px 1px #F6CF73;
	}

	.datasec_container .setting_unit > div:nth-child(1){
		/*border-bottom:1px solid #777;	*/
		box-shadow:0px 1px 1px #e5d772;
		/*
		background-color:#4cbbb1;

		background: linear-gradient(to bottom, #4cbbb1  0%,#0d507e 100%); 
		color:#ffffff;
		*/
	}
	.datasec_container .setting_unit > div:not(.action_box){
		padding:10px;
		margin-bottom:0px;
	}

	#time { display: flex; }
	#time .action_box, #savetime .action_box { float: none; display: flex!important; justify-content: flex-end; padding: 5px 10px; margin: 0; }
	#time .action_box .but_general, #savetime .action_box .but_general { color: #fff!important; background: linear-gradient(to bottom right, #F7D273 0%,#DDA24A 30%,#CC6646 100%); min-width: 120px; display: flex!important; justify-content: center; }
	#time .table_form > tbody > tr > td:nth-last-child(1) { border-radius: 10px; }
	#time .table_form > tbody > tr > td:nth-last-child(1) { border-radius: 10px; }
	#time .table_form > tbody > tr > td:nth-child(1) > div { position: relative; top: 0; margin: 0; float: left; width: calc(50% - 2.5px); }
	#time .table_form > tbody > tr > td:nth-child(1) > div:last-child { margin-left: 5px; }
	#time .disabled input { background-color: #dedede; }


	#savetime .savetimetitle { display: flex; justify-content: space-between; padding: 15px 10px 10px; border-top: 1px dotted #dedede; color: #90683f; }
	#savetime .savetimetitle .total { display: flex; justify-content: space-between; gap: 20px; color: #788B94; padding-right: 15px; }
	#savetime .savetimetitle .total .count { font-weight: bold; }
	#savetimelist { padding: 0 10px 5px;  }
	#savetimelist .lesson { display: flex; flex-direction: column; gap: 8px; padding: 8px 10px; background: #fafafa; border: 1px solid #dedede; border-radius: 3px; color: #788B94; min-height: 33px; max-height: 600px; overflow: auto;}
	#savetimelist .lesson .start { display: flex; justify-content: space-between; align-items: center; gap: 10px;  }
	#savetimelist .lesson .material-icons { background: #fff; border-radius: 10px; font-size: 11px!important; padding: 2px; color: #788B94; cursor: pointer; }
	#savetimelist .lesson .start:hover { color: #2B363B; }
	#savetimelist .lesson .start:hover .material-icons { color:#fff; background: #788B94; }

/*
	#savetime.close{
  		animation: closeUpward 1s linear;
	}

@keyframes closeUpward {
  0% {
    max-height: auto;
  }
  100% {
    max-height: 0;
	padding: 0;
  }
}
*/
	/*
	.setting_unit .option .current{
		padding-top:8.5px!important;
		padding-bottom:8.5px!important;
	}*/
	.datasec_container > div > div:hover{
		box-shadow:0px 0px 5px #efefef,0px 1px 0px 1px #dedede,0px 0px 0px 1px #81e9de;
		box-shadow:0px 0px 5px #efefef,0px 1px 0px 1px #dedede,0px 0px 0px 1px #F6CF73;
		background-color:rgba(255,255,255,0.8);
		border-top:1px solid #81e9de;
		border-top:1px solid #F6CF73;
	}
	.datasec_container > div > div > div{
		margin-bottom:8px;
	}
	.datasec_container > div > div > div:nth-last-child(1){
		margin-bottom:0px!important;
	}
	.datasec_container > div > div > div:nth-of-type(1){
		font-size:16px;
		padding:0px 0px 0px;
		color:#90683f;
		margin-bottom:10px;
		font-weight:400;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		display:flex;
		flex-wrap:nowrap;
		position:relative;
	}
	.datasec_container.setting.controller > div > div{
		margin-bottom:10px!important;
		border-top:2px solid #d3e8e5;
		border-top:none;
		border-left:2px solid #d3e8e5;
		border-right:0px;

		border-left:2px solid #F4EDE0;
	  }
	.datasec_container.setting.controller > div > div:hover{
		border-top:2px solid #0cf5df;
		box-shadow:0px 0px 5px #efefef, 0px 1px 0px 1px #dedede, inset 0px 1px 0px #07a08b;

		border-right:3px solid #0cf5df!important;
		border-top:none!important;
		border-left:0px!important;
		border:none!important;
		box-shadow:0px 0px 5px #efefef, 0px 0px 0px 1px #dedede, inset 1px 0px 0px #07a08b;
		box-shadow:0px 0px 5px #efefef, 0px 0px 0px 1px #dedede, inset 0px 0px 0px #07a08b, 0px 0px 0px 3px #a9e4df;
		border:1px solid #71bbbb!important;
		/*box-shadow:0px 0px 0px 3px #a9e4df!important;*/
		
		border:1px solid #C6A563!important;
		box-shadow:0px 0px 5px #efefef, 0px 0px 0px 1px #957b73, inset 0px 0px 0px #F6CF73, 0px 0px 0px 3px #c6a563;
	}
	.datasec_container.setting.controller > div > div:nth-last-of-type(1){
		margin-bottom:0px!important;
	}
	.datasec_container.setting > div > div > div:nth-of-type(1){
		color:#003a2a;
		font-weight:300;
		align-items:center;
		
		color:#90683f;
	}
	.datasec_container > div > div > div:nth-of-type(1) > div:nth-child(1){
		flex:1 1 auto;
		margin-right:10px;
	}
	.datasec_container > div > div > div:nth-of-type(1) > div:nth-last-of-type(1){
		margin-right:0px;
	}
	.datasec_container .action_box{
		margin-left:5px;
	}
	.datasec_container .action_box > div{
		margin-bottom:1px!important;
	}
	.datasec_container .action_box input[type=text]{
		padding:4.5px 10px 4px!important;
	}
	.datasec_container .action_box .option{
		margin-top:-2px;
	}

	.datasec_container .action_box .option .current{
		padding-top:3px;
		padding-bottom:3px;
		min-height:18px;
	}
	.datasec_container .action_box .but_general{
		margin-top:-1px!important;
		padding:4px 10px!important;
	}

	.datasec_container .action_box .but_general.material-icons, .action_tab .but_general.material-icons{
		margin-top:0!important;
	}
	.datasec_container .action_box .but_general:not(.control):hover, .action_tab .but_general:hover{
		margin-top:-1px!important;
		margin-top:0px!important;
	}
	.datasec_container .action_box .opt_list{
		margin:0px!important;
		padding:0px!important;
	}
	.datasec_container .material-icons{
		font-size:15px!important;
	}
	.datasec_container .option,.datasec_container .option .current{
		width:100%;

	}
	.datasec_container .overview{
		padding:25px 20px!important;
		padding-bottom:5px!important;
		font-size:20px;
		display:none;
	}
	.datasec_container .overview.active{
		display:block;
	}
	.datasec_nohead_container > div{
		padding:10px;
	}
	.datasec_nohead_container > div > div{
		margin-bottom:10px!important;
	}
	.datasec_nohead_container > div > div:nth-last-child(1){
		margin-bottom:0px!important;
	}
	.datasec_nohead_container.setup > div{
		padding:0px!important;
	}
	.datasec_nohead_container.setup.flex > div{
		flex:1 1 auto;
	}

	/* BASE END /////////////////*/

	/* COMPONENT ////////////////////*/
	.list_action_box{
		position:relative;
		min-height:20px;
		margin-bottom:5px;
		display:flex;
		gap: 2px;
	}
	.list_action_box:empty{
		display:none;
	}
	.list_action_box > div{
		flex:1 1 auto;
		display:inline-block;
	}

	* html .list_action_box > div{
		display:inline;
	}
	* + html .list_action_box > div{
		display:inline;
	}
	.list_action_box .option{
		flex:0;
	}
	.list_action_box .option .current{
		padding-top:3px;
		padding-bottom:3px;
	}
	.list_action_box .option .opt_list > div{
		padding-top:5px;
		padding-bottom:5px;
	}

	.list_action_box.top{
		position:fixed;
		background:rgba(255,255,255,0.95);
		left:0px;
		right:0px;
		padding:8px 20px 8px 35px;
		z-index:50;
		box-shadow:0px 2px 20px #dfdfdf;
		box-shadow:0px 2px 20px #DAE1E4;
		transform:translateY(-77%);
		border-top:0px solid #ffffff;

	}
	.list_action_box.top:hover,.list_action_box.top.active{
		opacity:1;
		margin-top:-2px;
		transform:translateY(0%);
	}
	.list_action_box.top:hover{
		z-index:101;
		margin-top:0px;
		border-top:2px solid #02ecec;
		border-top:2px solid #F6CF73;

	}
	.list_action_box.top .page_bar{
		right:20px;
	}
	.page_bar{
		color:#656565;
		box-sizing:border-box;
		right:0px;
	}

	.page_bottom{
		border-top:1px #ddd solid;
		margin-bottom:10px;
	}

	.page_control{
		text-align:right;
	}
	.page_control select{
		padding:0px;
		margin:0px;
		box-shadow:none;
	}
	.page_control > div{
		display:inline-block;
		margin-left:5px;
		vertical-align:middle;
	}
	* html .page_control > div{
		display:inline;
	}
	* + html .page_control > div{
		display:inline;
	}

	.page_prev:after, .page_next:after{
		content: '';
		height: 10px;
		width: 10px;
		border: 1px solid #C6A563;
		transform: rotate(45deg);
		position: absolute;
		top: 5px;
	}
	.page_prev:after{
		border-width: 0 0 2px 2px;
		left: 8px;
	}
	.page_next:after{
		border-width: 2px 2px 0 0;
		right: 8px;
	}
	.page_prev{	
		/*background:url(../images/button/page_prev.png) no-repeat center center;*/
		height:20px;
		width:20px;
		cursor:pointer;

		position: relative;
	}
	.page_next{
		/*background:url(../images/button/page_next.png) no-repeat center center;*/
		height:20px;
		width:20px;
		cursor:pointer;

		position: relative;
	}


	.no_item, .no_result {
		font-family:"Montserrat",chinese;
		font-size:13px;
		color:#aaaaaa;
		text-align:center;
		padding:5px 0px;
		border-top:0.5px solid #bed3d4;
		text-transform:uppercase;
		margin-top:5px;
	}
	.asterisk {
		font-family: Arial,"PingFang","微軟正黑體",Helvetica, sans-serif;
		font-size: 11px;
		color: #FF1B1F;
	}

	.sys_remark{
		color:#EA0271;
		font-size:11px;
	}

	.sys_msg_box{
		position:fixed;
		text-align:center;
		opacity:0;
		margin:auto;
		/*
		width:100%;
		height:100%;
		*/
		z-index:100002;
		display:flex;
		visibility:hidden;
		top:100px;
		left:50%;
		height:50%;
		-webkit-font-smoothing: antialiased;
		transform:translateX(-50%);
	}
	.sys_msg_box.active{
		visibility:visible;
		opacity:1;
		top:50px;
	}

	.sys_msg_box.active > div{
		padding:30px 80px;
	}

	.sys_msg_box > div{
		text-align:center;
		border-radius:5px;
		background-color:rgba(21, 0, 84, 0.95);
		background-color:rgba(5, 75, 90, 0.95);
		background:linear-gradient(to top,#CC6646 0%,#DDA24A 60%,#F7D273 100%);
		/*background:linear-gradient(to top,#0399a0 0%,#100d74 60%,#0b0875 100%);*/
		box-shadow:0px 2px 10px #aaaaaa;
		font-size:12px;
		color:#ffffff;
		white-space:nowrap;
		padding:0px;
		margin:auto;
		line-height:auto;
		line-height:18px;
	}



	.sys_remark_msgbox{
		border-radius:5px;
		background-color:#e0f9f7;
		padding:10px 15px!important;
		font-size:11px;
		color:#218677;
		border:1.5px dashed #bfd0cb;
		line-height:18px;
	}
	.sys_remark_msgbox > p{
		margin:0px;
		margin-bottom:5px;
	}
	.sys_remark_msgbox > p:nth-last-child(1){
		margin:0px;
	}

	.sys_remark_msgbox a{
		background:-moz-linear-gradient(center top , #1978ba, #0d507e) repeat scroll 0 0 transparent !important;
		background-color:#1978ba;
		padding:2px 10px;
		margin:3px 5px;
		display:inline;
		color:#fff!important;
		font-size:10px;
		border-radius:3px;
	}
	.sys_remark_msgbox a:hover{
		background:-moz-linear-gradient(center top , #003356, #001d32) repeat scroll 0 0 transparent !important;
		background-color:#001d32;
	}

	.sys_login_msgbox{
		margin:20px;border-radius:5px;
		background-color:#ee0753;
		box-shadow:0px 0px 5px #666;
		font-size:11px;
		color:#ffffff;
		text-align:left;
		padding:10px 20px;display:table;max-width:250px;
	}


	.table_list {
		border-collapse:separate;
		border-spacing:0px;
		margin-left:0px;
		width:100%;
	/*	margin-bottom:10px;*/
		border-radius:5px; 
		margin-bottom:5px;
		margin-top:50px;
		opacity:0;
		box-shadow:0px 0px 5px #dfdfdf;
		font-size:12px;
	}
	.table_list:hover{
		box-shadow:0px 3px 10px #dfdfdf;
	}
	.table_list > tbody > tr:nth-child(1){
		border:none!important;

		background-color:#ffd200;
		background-color:inherit!important;
		background:-moz-linear-gradient(center top , #fff710 , #ffd200 ); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #fff710  0%,#ffd200  100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #fff710 ,#ffd200  100%); /* IE10+ */
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */

		background: linear-gradient(to bottom, #78c7c7 0%,#96d4c9  100%);
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */

		background: linear-gradient(to bottom, #ffe000 0%,#ffed1d  100%);
		box-shadow:inset 0px 15px 60px #fff710!important;

		border-radius:5px;
	}
	.table_list > tbody > tr{
	/*	background:url(../images/main/nav_indicator.png) no-repeat 15px 14px;*/
		background-color:#ffffff;
		border:1px solid #EFEFEF;
	}
	.table_list > tbody > tr:hover {
		background-color:#fdfdf1; /*#ffffe8;*/
		background-color:#FFFBE5; /*#ffffe8;*/

	}


	/*
	.table_list > tbody > tr > td:nth-last-child(1) .list_action{
		max-width:55px;
		overflow:hidden;
	}
	*/
	.table_list > tbody > tr:hover > td:nth-last-child(1) .list_action{
		box-shadow:inset -6px 0px 0px #97dcd2,-1px 0px 0px #efefef,0px 0px 10px #efefef,inset 0px 0px 0px 1px #dedede;/*fdf6b8*/
		box-shadow:inset -6px 0px 0px #CC6646,-1px 0px 0px #efefef,0px 0px 10px #efefef,inset 0px 0px 0px 1px #dedede;/*97dcd2*/
		background-color:#ffffff;
		max-width:200px;
		overflow:inherit;
	}
	.table_list > tbody > tr:nth-child(1) > td:nth-child(1)::before{
		background:none!important;
	}
	.table_list > tbody > tr > td:nth-child(1){
		/*color:#2a9e79;*/
	}
	.table_list > tbody > tr > td:nth-child(1)::before{
		content:"";
		background:url(../images/main/nav_indicator_ro.png) no-repeat 0 9px;
		opacity:0;
		width:25px;
		height:25px;
		left:0px;
		position:absolute;
		top:5px;
	}
	.table_list > tbody > tr:hover > td:nth-child(1)::before{
		background:url(../images/main/nav_indicator_ro.png) no-repeat 0px 9px;
		opacity:1;
		left:-7px;
	}
	.table_list > tbody > tr > td {
		position:relative;
		font-family: Arial,chinese,Helvetica, sans-serif;
		color: #333333;
		color: #2B363B;
		padding:15px 15px;
		padding-right:0px;
		vertical-align:top;
		word-wrap:break-word;
		word-break:break-word;
		border-bottom:1px solid #EFEFEF;
		box-sizing:border-box;
	}

	.table_list > tbody > tr > td:nth-last-child(1){
		padding-right:15px;
		box-shadow:inset 0px 0px 0px #333, 0px 0px 0px #f6f6f6;

	}
	.table_list > tbody > tr:nth-child(1) > td {
		height:auto;
		font-family: "Segoe UI",Arial,chinese,Helvetica, sans-serif;
		color:#222;
		color:#fff;
		/*color:#20ff83;*/
		font-weight:500;
		/*box-shadow:inset 0px -1px #1aa8bf;*/
		border-bottom:0px solid #fff710; /*#fff710;*/

		background: linear-gradient(to bottom, #78c7c7 0%,#96d4c9  100%);
		background: linear-gradient(to bottom, #72d6e6 0%,#8be8c6  100%);

		background: linear-gradient(to bottom, #ffe000 0%,#ffed1d  100%);
		background: linear-gradient(to bottom, #393939 0%,#005c5c  100%);

		background: linear-gradient(to bottom, #000000 0%,#3F4F56  100%);
		/*background:none;
		background:inherit;*/
		border:none;
		padding:13px 0px 13px;
		padding-left:15px;
		word-wrap:normal;
		-ms-word-break:normal;	
	}
	.table_list td > div.material-icons{
		margin-top:-5px;
	}
	.table_list.tiny{
		box-shadow:0px 0px 5px #faeec2, 0px 0px 0px 1px rgba(230, 202, 0, 0.6);
		font-size:11px;
	}
	.table_list.tiny > tbody > tr > td:nth-child(1){
		color:#885e00;
	}
	.table_list.tiny > tbody > tr:nth-child(1) > td {
		color:#222;
		color:#fff;
		color:#885e00;

		/*color:#005f4d;*/
		background:-moz-linear-gradient(center top , #daf7fe , #fdfeb2 ); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #daf7fe 0%,#fdfeb2  100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #daf7fe ,#fdfeb2  100%); /* IE10+ */
		background: linear-gradient(to bottom, #daf7fe 0%,#fdfeb2  100%); /* W3C #b2efe4*/
		background: linear-gradient(to bottom, #939393 0%,#f1f1ec    100%); /* W3C #b2efe4*/ 
		background: linear-gradient(to bottom, #fdff63 0%,#fadb03  100%); /* W3C #b2efe4*/ 
		background: linear-gradient(to bottom, #78c7c7 0%,#96d4c9  100%);

		background: linear-gradient(to bottom, #2db6cc 0%,#8be8c6  100%);
		background: linear-gradient(to bottom, #ffe000 0%,#ffed1d  100%);

		/*background: linear-gradient(to bottom, #72d6e6 0%,#8be8c6  100%);*/
		background-color:#fdfeb2;
		box-shadow:none;

		/*background:none;
		background:inherit;*/
		padding:8px 0px 8px;
		padding-left:15px;
	}
	.table_list > tbody > tr:nth-child(1) > td a{
		color:#fff38a;
	}
	.table_list > tbody > tr:nth-child(1) > td:nth-child(1){
		border-radius:5px 0px 0px 1px;
	}
	.table_list > tbody > tr:nth-child(1) > td:nth-last-child(1){
		border-radius:0px 5px 1px 0px;
		padding-right:10px;
	}
	.table_list > tbody > tr:nth-child(1) > td:nth-last-child(1).action{
		text-align:center;
	}

	.table_list:hover > tbody > tr:nth-last-child(1) > td{
		border-bottom:1px solid #ffd200;
		box-shadow:inset 0px 0px 0px #333,0px 2px 0px #fff710;
	}
	.table_list > tbody > tr:nth-last-child(1) > td{
		border:none;
		border-bottom:1px solid #c3c3c3;/*#aaa;*/
	}
	.table_list > tbody > tr:nth-last-child(1) > td:nth-child(1){
		border-radius:0px 0px 0px 5px;
	}

	.table_list > tbody > tr:nth-last-child(1) > td:nth-last-child(1){
		border-radius:0px 0px 5px 0px;

	}
	.table_list .hl > td{
		color:#0008b0;
	}

	.table_list input[type=text]{
		padding:5px;
	}
	.table_list .but_general.material-icons{
		margin-right:5px;
		color:#999;
		padding:2.5px!important;
	}
	.table_list .but_general.material-icons:hover{
		padding:2.5px!important;
	}
	.table_list.ajax_table{
		opacity:1;
		margin-top:0;
	}
	.data_list{
		transition:margin-top 0s!important;
		border-radius:5px;
		border-bottom:1px solid #28ceaf;
		box-shadow:0px 0px 5px #dfdfdf;
		/*overflow:hidden;*/
	}

	.data_list:hover{
		border-bottom:1px solid #ffd200;
		box-shadow:inset 0px 0px 0px #333,0px 2px 0px #fff710;
	}
	.data_list > div{
		border:0.5px solid #efefef;
		background-color:#ffffff;
		position:relative;
	}

	.data_list > div:hover {
		background-color:#ffffe8;

	}
	.data_list > div::before{
		content:"";
		position:absolute;
		top:0px;
		left:0px;
		bottom:100%;
		width:5px;
		background-color:#ffd200;
	}
	.data_list > div:hover::before{
		content:"";
		position:absolute;
		top:0px;
		bottom:0px;
		width:5px;
		background-color:#ffd200;
	}
	.data_list .group{
		border:2px solid #f1ead7;
		border-radius:5px;
		/*overflow:hidden;*/

	}
	.data_list > div.group{
		margin:10px 0px;
	}
	.data_list .group > div:nth-child(1){
		margin-bottom:0px!important;
	}
	.data_list .group > div:nth-child(1)~div{
		border:1px solid transparent;
		border-radius:5px!important;
		/*
		overflow:hidden;*/
		margin-left:15px;
		margin-right:5px;
		position:relative;
		font-size:11px;
	}
	.data_list .group > div:nth-child(1)~div:hover{
		border:1px solid #eaddac;
		background-color:#ffffff;
	}
	.data_list .group > div:nth-child(1)~div::before{
		content:"";
		position:absolute;
		top:0px;
		left:0px;
		bottom:100%;
		width:5px;
		background-color:#ff8100;
	}
	.data_list .group > div:nth-child(1)~div:hover::before{
		content:"";
		position:absolute;
		top:0px;
		bottom:0px;
		width:5px;
		background-color:#ff8100;
	}

	.data_list .group > div:nth-last-child(1){
		margin-bottom:5px;
	}
	.data_list .group > div.flex:nth-child(1) > div:nth-child(1){/*GROUP/CATEGORY */
		padding-left:25px;
		color:#9c4100;
	}
	.data_list .group > div.flex:nth-child(1) > div:nth-child(1)::before{ 
		content:"";
		position:absolute;
		left:12px;
		width:7px;
		height:12px;
		border-left:4px solid #9c4100; /* #e400ff;*/
		border-bottom:3px solid #fb6800;
	}
	.data_list .type, .table_list .type{
		padding:5px 10px;
		background-color:#f1ead3;
		color:#926219;
		font-size:11px;
		line-height:11px;
		border-radius:10px;
		display:inline-flex;
	}
	.data_list .checkbox_container{
		flex:0!important;
		margin:0px!important;
	}
	.data_list .checkbox_container .opt_list{
		padding:0px!important;
		margin:0px!important;
	}


	.data_list .flex{
		display:flex;
		flex-wrap:nowrap;
		align-items:stretch;
		justify-content:stretch;
	}
	.data_list > .flex{
		padding:0px 5px;
		margin-bottom:0px!important;
		position:relative;
	}
	.data_list .flex > div{
		/*display:flex;*/
		align-items: center;
		position:relative;
		padding:10px 10px;
		line-height:18px;
		word-break:break-word;
	}
	.data_list .flex > div:not([basis]){
		flex:1;
		flex-basis:100px;
	}

	.data_list .flex > div[basis]{
		flex-grow:0;
		flex-basis:auto;
	}
	.data_list .flex > div:nth-child(1){
		color:#222222;
	}
	.data_list .flex > div:nth-last-child(1){
		text-align:right;
		margin-right:-5px;
	}
	.data_list .list_action{
		top:0px;
		left:0px;
		right:0px;
		padding:10px 15px;

		/*background-color:#f5f5f5;*/
		line-height:0px;
		text-align:left;
		white-space:nowrap;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
	}
	.data_list .flex> div:nth-last-child(1) .list_action{
		margin-left:10%;
		margin-right:0px;
	}
	.data_list .flex:hover > div:nth-last-child(1) .list_action{
		box-shadow:inset -6px 0px 0px #333,-1px 0px 0px #efefef,0px 0px 10px #efefef,inset 0px 0px 0px 1px #dedede;/*fdf6b8*/
		background-color:#ffffff;
		max-width:200px;
		overflow:inherit;
		margin-left:15%;
	}
	.data_list .detailsbox{
		background-color:#ffffff;
		padding:10px!important;
		box-shadow:0px -2px 0px 0px #33eeb0;
		margin-right:5px!important;
		border:1px solid #91bab638!important;
		pointer-events:none;
		opacity:0;
		margin-top:-30px;
		max-height:0px;
	}
	.data_list .detailsbox::before{
		display:none;
	}
	.data_list .detailsbox > div{
		margin-bottom:10px;
	}
	.data_list .detailsbox > div:nth-of-type(1){
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-weight:600;
		display:flex;
		align-items:center;
		justify-content: space-between;
		margin-bottom:5px;
	}
	.data_list .detailsbox > div:nth-of-type(1) .flex > div:nth-last-child(1){
		margin-right:0px;
	}
	.data_list .detailsbox > div:nth-last-of-type(1){
		margin-bottom:0px;
	}

	.data_list.pay_schedule .flex{
		align-items:center;
	}
	.data_list.pay_schedule .group{
		margin:0px;
		border-radius:0px;
		border:0.5px solid #efefef;
		padding:0px 5px;
	}

	.table_list .type{
		margin-top:-5px;
		display:table;
	}
	.type.discount_title{
		background-color:#586871;
		color:#ffffff;
		margin-top:5px;
	}
	.type.discount_title.price_off{
		background-color:#075a57;
	}

	.type.discount_title.percent_off{
		background-color:#ff006a;
	}

	.data_form > div{
		margin-bottom:5px;
	}
	.data_form > div:nth-last-child(1){
		margin-bottom:0px!important;
	}


	.table_cate_container{
		margin-top:-6px;
		position:absolute;
	}

	.list_action.nofix{
		min-width:inherit!important;
		background-color:none;
	}
	.list_action{
		text-align:right;
		padding:0px 2px;
		/*background-color:#f5f5f5;*/
		padding:10px 15px;
		right:0px;
		line-height:0px;
		text-align:center;
		white-space:nowrap;
		position:absolute;
	}
	.table_list .list_action{
		top:0px;
		bottom:0px;
		right:0px;
	}
	.list_action .but_general{
		margin-top:-3px;
		margin-top:-1px;
	}
	.list_action .but_general:hover{
		margin-top:-2px;
	}
	.list_action > div, .list_action .but_display{
		display:inline-block;
		background-repeat:no-repeat;
		background-position: center center;
		width:20px;
		height:20px;
		margin-left:2px;
		cursor:pointer;
		opacity:0.7;
		opacity:0.8;
		vertical-align:top;
	}

	* html .list_action > div{
		display:inline;
	}
	* + html .list_action > div{
		display:inline;
	}
	.list_action > div:hover{
		opacity:1;
	}
	.list_action .svg-inline--fa{
		width: 16px;
		height: 20px;
	}
	.table_list .item_no{
		padding:5px 10px;
		background-color:#ddfdff;
		background-color:#ffffff;
		color:#549397;
		border-radius:5px;
		display:table;
		border:1px dashed; /* #cdcdcd;*/

	}

	.action_box {
		text-align:right;
		float:right;
		vertical-align:top;
		position:relative;
	}

	.action_box{
		line-height:12px;
		display:inline-flex!important;
		align-items:center;
		flex-wrap:wrap;
		justify-content:flex-end;

		gap: 1px;
	}
	.action_box > div{
		display:inline-flex!important;
		align-items:flex-start;
		margin-left:3px;
	}
	.action_box > div:nth-of-type(1){
		margin-left:0px;
	}

	.action_box .break{
		flex-basis:100%;
		margin-top:-5px;
	}
	.action_box .option .current{
		padding-top:4.5px;
		padding-bottom:4.5px;
	}
	.action_box div{
		vertical-align:top;

	}
	.action_box .but_general{
		color:#333!important;
		padding:7px 20px 6px!important;
		border-radius:3px!important;
		box-shadow:0px 1px 1px 0px #777!important;
		box-shadow:0px 1px 1px 0px #666!important;
	}
	.section_header .action_box .but_general, .lb_secheader .action_tab .but_general{
		color:#fff!important;
		background: linear-gradient(to bottom right, #3d97cb 0%,#4642b7 100%);
		background: linear-gradient(to bottom right, #1a9c6a 0%,#089258 30%,#100d74 100%);
		background: linear-gradient(to bottom right, #F7D273 0%,#DDA24A 30%,#CC6646 100%);
	} 
	.section_header .action_box > div, .section_header .action_box > div.but_general{
		/*margin-bottom:5px!important;*/

		gap: 2px;
	}


	.action_box .but_general:hover{
		color:#000!important;
		background-color:#ffde00;
		background:-moz-linear-gradient(left top , #ffffff, #acf1f3); /* FF3.6+ */ 
		background: -webkit-linear-gradient(left top, #ffffff 0%,#acf1f3 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(left top, #ffffff,#acf1f3 100%); /* IE10+ */
		background: linear-gradient(to bottom right, #ffffff 0%,#acf1f3 100%); /* W3C */
		box-shadow:inset 0px 1px 2px #666!important;
		box-shadow:inset 0px 1px 2px #4da7ba!important;

	}
	.action_box .but_display, .action_box .but_delete{
		display:inline-block;
		border-radius:5px;
		box-shadow:0px 0px 0px 1px #dedede,inset 0px -5px 10px #ffffff;
		width:25px;
		height:25px;

		margin: 0 0 0 2px;
		background-color: #fff;
	}
	.section_header .action_box .combo_box .but_general.material-icons{
		padding:2.5px!important;
		padding-top:3px!important;
	}
	.section_header .action_box .combo_box .but_general.material-icons:hover{
		padding:2.5px!important;
		padding-top:3px!important;
		margin-top:0px!important;
		border: none;
	}
	.action_box .but_general.material-icons, .action_tab .but_general.material-icons{
		background:none;
		background-color:#96c7c2!important;
		background-color:#C6A563!important;
		color:#ffffff!important;
		padding:3px!important;
		padding-top:3.5px!important;
		font-size:20px;
		margin-bottom:0px!important;
		/*background: linear-gradient(to bottom right, #8e8e8e 0%,#383737 100%);*/ /* W3C */
		box-shadow:none!important;
		padding-top:1.5px!important;
	}
	.action_tab .but_general.material-icons{
		background-color:#3bccbe!important;
		background-color:#a2bb1b!important;
		background-color:#6e8c90!important;
		background-color:#C6A563!important;
		padding:5px!important;
		font-size:16px!important;

	}
	.action_tab .but_general.material-icons:hover{
		padding:5px!important;
		margin-top:0px!important;
		background:#29a99d!important;
		background:#2B363B!important;
		color:#ffffff!important;
		box-shadow:none!important;
	}
	.action_box .but_general.material-icons:hover{
		padding-top:3.5px!important;
	}

	.action_box .but_general.material-icons:not(.control):hover{
		color:#b7d6d4!important;
	}
	.action_box .but_general.material-icons:not(.control):hover, .combo_box .but_general.material-icons:hover{
		background:none!important;
		background-color:#ffffff!important;
		color:#53a79b!important;
		color:#C6A563!important;
		box-shadow:inset 0px 1px 2px #4da7ba!important;
		box-shadow:inset 0px 1px 2px #C6A563!important;
		padding-top:3.5px!important;
		padding-top:1.5px!important;

	}

	.combo_box{
		box-shadow:0px 1px 1px #333!important;
		background-color:#333333;
		border-radius:3px;
		font-size:0px;
		background:linear-gradient(to bottom right, #3dcb95 0%,#183f00 30%,#137b71 100%);
		margin-top:-1px;
		
		display: flex;
		gap: 2px;
		box-shadow: none!important;
		background: none; 
	}
	.combo_box > div{
		font-size:12px;
	}

	.action_box .combo_box .but_general{
		/*background:none!important;
		background-color:none!important;*/
		box-shadow: 0px 0.5px 1px #666!important;
		min-height: 24px;
		max-height: 24px;
		min-width: 24px;

	}

	.combo_box > div .but_general{
		border-radius:0px 0px 0px 0px!important;
	}
	.combo_box > div:nth-child(1) .but_general{
		border-radius:3px 0px 0px 3px!important;
	}
	.combo_box > div:nth-last-child(1) .but_general{
		border-radius:0px 3px 3px 0px!important;
	}
	.combo_box .material-icons, .combo_box .material-icons:hover{
		font-size:19px!important;
		padding:2.5px!important;
		margin:0px!important;
	}

	.action_option_container{
		position:relative;
		display:inline-block;

	}
	.action_option_container.active{
		z-index:101;
		opacity:1!important;
	}

	.action_list{
		background-color:#ffffff;
		border-radius:3px;
		position:absolute;
		box-shadow:0px 2px 3px #cdcdcd;
		overflow:hidden;
		left:25px;
		top:0px;
		opacity:0;
		max-height:0px;
		max-width:0px;
		z-index:10000;
	}
	.action_list > div{
		white-space:nowrap;
		border-bottom:1px solid #efefef;
		padding:7px 15px;
		text-align:left;
		cursor:pointer;
		line-height:initial;

	}
	.action_list:hover{
		box-shadow:0px 0px 1px 1px #aaaaaa, 0px 0px 0px 1px #007761;
	}
	.action_list > div:hover{
		background-color:#397575;
		background-color:#C66646;
		color:#ffffff;
	}
	.action_list > div:nth-last-child(1){
		border:none;	
	}
	.action_option_container.active .action_list{
		opacity:1;
		max-height:200px;
		max-width:200px;
	}
	.tagbox{
		line-height:15px!important;
		z-index:100001;
		position:absolute;
		background-color:#181818;
		font-family:Arial,"PingFang","微軟正黑體",Helvetica, sans-serif;
		font-size:11px;
		color:#1af8d3;
		color:#F2E07D;
		opacity:0;
		padding:10px 15px;
		border-radius:5px;
		text-align:left;
		pointer-events:none;
	}
	.tagbox ul{
		padding:0px;
		margin:0px;
		margin-left:10px;
	}
	.status{
		font-family:Arial,chinese;
		padding:7px 15px;
		border-radius:25px;
		background-color:#9baeb1;
		background-color:#788B94;
		font-size:12px;
		white-space:nowrap;
		color:#ffffff;
		/*text-shadow:0px 1px 1px #222222;*/
		display:table;
		text-transform:capitalize;
		position:absolute;
		top:7px;
		word-break:keep-all;
	}
	.status:empty{
		display:none;
	}
	.status.completed{
		background-color:#33199e; /*#d0d0d0;*/
		text-shadow:0px 1px 1px #49807a;/* #a9a9a9;*/
	}
	.status.cancelled ,.status.not_sell{
		background-color:#967898;
		/*text-shadow:0px 1px 1px #33002d;*/
	}
	.status.cancelled2{
		background-color:#f3e6ca;
		/*text-shadow:0px 1px 1px #a9a9a9;*/
	}
	.status.online, .status.active{
		background-color:#fbd000;
		background-color:#F2E07D;
		color:#3c2f00;
		/*text-shadow:0px 1px 1px #964500;*/
	}
	.status.new{
		background-color:#3b3830;
		color:#ffe215;
	}
	.status.in_review, .status.waiting_reply.user ,.status.sell {
		background-color:#dc845a;
	}
	.status.in_review.user, .status.waiting_reply{
		background-color:#7a8888;
	}
	.status.target_analyzing{
		background-color:#2bf3e0;
		background-color:#96f1d8;
		color:#097171;
		text-shadow:0px 1px 0px #d2fffb;
		/*text-shadow:0px 1px 1px #15a96b;*/
	}
	.status.scheduled, .status.processing{
		background-color:#dc845a;
	}
	.status.preparing{
		background-color:#d8b42f;
	}
	.status.in_queue, .status.pending_approval{
		background-color:#6f6c68;
	}
	.status.in_delivery, .status.hold{
		background-color:#90a713;
	}
	.status.in_analysis{
		background-color:#05af9f;
	}
	.status.closed{
		background-color:#386175;
	}
	.status.sent{
		background-color:#ab7019; /*#ffc800;*/
	}
	.status.reached{
		background-color:#45bd13;
	}
	.status.target.in_queue{
		background-color:#9baeb1;
	}
	.status.blocked, .status.spammed, .status.bounced{
		background-color:#3a3b54;
	}
	.status.used{
		background-color:#33199e; /*#d0d0d0;*/
		text-shadow:0px 1px 1px #49807a;/* #a9a9a9;*/
	}
	.status.pending_start{
		background-color:#cd2929;
	}
	.status.expired{
		background-color:#4c4506;
	}
	.status.approved{
		background-color:#008896;
	}
	.status.rejected{
		background-color:#ed5565;
	}
	/* new color schema */

	.status.delivered{
		background-color:#008896;
	}

	.status.customs{
		background-color:#cd2929;
	}
	.status.exchange{
		background-color:#ed5565;
	}

	.status.unknown{
		background-color:#a0a0a0;
	}

	/* OSOS schema */

	.status.new {
		background-color:#2B363B;
		color: #F9DA00;
	}
	.status.admitted {
		background-color:#C6A563;
		color: #FFFFFF;
	}
	.status.active {
		background-color:#F2E07D;
		color: #2B363B;
	}
	.status.pending {
		background-color:#C18564;
		color: #FFFFFF;
	}
	.status.dated {
		background-color:#DC845A;
		color: #FFFFFF;
	}
	.status.onhold {
		background-color:#788A94;
		color: #FFFFFF;
	}
	.status.denied {
		background-color:#DAE1E4;
		color: #456C80;
	}



	.price, .percentage{
		text-align:right;
		position:relative;
	}
	.price{
		padding-left:20px!important;
	}
	.table_list .price, .pay_schedule .initial_price{
		border:1px dashed #aaaaaa;
		border-bottom:2px solid #565656; /* #a0d8d6;*/
		padding:3px 10px;
		background-color:#ffffff;
		margin-top:-3px;
		border-radius:5px;
	}
	.pay_schedule .initial_price{
		border-bottom:2px solid #efc706; /* #a0d8d6;*/
	}
	.table_list .price.price_off{
		border-bottom-color:#1e9893;
	}

	.table_list .price.percent_off{
		border-bottom-color:#ff006a;
	}
	.table_list .price.in{
		border-bottom:2px solid #3edecf; /* #a0d8d6;*/
		border-bottom:2px solid #F6CF73; /* #a0d8d6;*/
	}
	.table_list .price.out{
		border-bottom:2px solid #e2d103; /* #a0d8d6;*/
	}
	.table_sheet .price{
		padding:0px!important;
		margin:0px!important;
		border:0px!important;
		background:none!important;
		flex-basis:50%;
	}
	.discount{
		display:table;
		border:none!important;
		padding:3px 20px 2px!important;
		margin-top:5px!important;
		margin-bottom:5px;
		background-color:#ff006a!important;
		color:#ffffff;
		border-radius:8px!important;
		font-size:11px;
	}
	.discount.percentage::after{
		color:#ffffff;
	}
	.discount.price{
		background-color:#075a57!important;
	}

	.percentage{
		display:table;
		padding-right:25px;
	}
	.data-input.percentage{
		display:block;
	}

	.price::before{
		position:absolute;
		content:"$";
		top:0px;
		bottom:0px;
		display:flex;
		left:0px;
		align-items:center;
		padding-left:8px;
	}

	.data-input.price{
		padding-left:0px;
		font-size:11px;
	}

	.data-input.price::before{
		color:#636363;

	}
	.no_count{
		display:inline-flex;
		padding:5.5px 15px 5px;
		border-radius:10px;
		justify-content:center;
		align-items:center;
		background-color:#ffffff;
		box-shadow:inset 0px 0px 1px 1px #e8dcc9;
		font-size:9px;
	}
	.no_count.rounded_sq{
		padding:0px;
		border-radius:25%;
		width:30px;
		height:30px;
		box-shadow:inset 0px 0px 0px 1px #acd2cb;/*#d6e1e4;*/
		box-shadow:inset 0px 0px 0px 1px #DAE1E4;
	}
	.no_count.rounded_sq:empty{
		box-shadow:inset 0px 0px 0px 3px #f7f6f3
	}
	.no_count.circle{
		padding:0px;
		border-radius:50%;
		width:30px;
		height:30px;
		box-shadow:inset 0px 0px 0px 3px #ffc800;/*#d6e1e4;*/
	}
	.no_count.circle:empty{
		box-shadow:inset 0px 0px 0px 6px #f7f6f3
	}
	.no_count.circle:empty::before{
		content:'?';
	}
	.no_count.circle.sent{
		box-shadow:inset 0px 0px 0px 3px #ffc800;/*#d6e1e4;*/
	}
	.no_count.circle.reached{
		box-shadow:inset 0px 0px 0px 3px #45bd13;/*#d6e1e4;*/
	}
	.no_count.circle.in_queue,
	.no_count.circle.processing,
	.no_count.circle.blocked,
	.no_count.circle.bounced,
	.no_count.circle.spammed{
		box-shadow:inset 0px 0px 0px 3px #dbdedf;/*#d6e1e4;*/
	}
	.table_list .no_count{
		margin-top:-8px;
	}
	.percentage::after{
		position:absolute;
		content:"%";
		padding-right:8px;
		top:0px;
		bottom:0px;
		display:flex;
		font-weight:bold;
		color:#777777;
		right:0px;
		display:flex;
		align-items:center;
		font-size:12px;
	}
	.price input[type=text], .price input[type=number]{
		padding-left:20px;
	}
	.percentage input[type=text], .percentage input[type=number]{
		padding-right:20px;
	}
	.pad-s input{
		padding: 5px 0 5px 7px;
	}
	#order_non_discounted{
		font-size:15px;
		color:#aaaaaa;
		position:absolute;
		right:0px;
		top:-15px;
		padding-left:0px!important;
	}
	#order_non_discounted:not(:empty)::before{
		left:-10px;
		padding-left:0px;
	}

	#order_non_discounted:empty::before{
		content:"";
	}
	#order_non_discounted::after{
		position:absolute;
		content:"";
		left:0px;
		right:0px;
		top:8px;
		border-bottom:1px solid #666666;

	}
	#rewarded_total{
		opacity:0;
		background-color:#ffee76;
		border-radius:5px;
		padding:5px 10px;
		padding-left:20px;
		font-size:13px;
	}
	#rewarded_total.active{
		opacity:1;
	}
	#rewarded_total::after{
		content:" Rewarded";
		font-size:11px;
	}


	.table_form {
		border-collapse:separate;
		border-spacing:0px;
		margin-bottom:10px;
		width:100%;
	}
	.table_form tr:hover input, .table_form tr:hover textarea{
		background-color:#ffffff;
		border:1px solid rgba(25,25,25,0.1);
		box-shadow:inset 0px 0px 0px 1px #81d8c8;
		box-shadow:inset 0px 0px 0px 1px #F2E07D;
	}
	.table_form tr:hover {
		background-color:rgba(235,235,235,0.3);
		background-color:#e9f1f0;
		background-color:#e6f9f6;
		background-color:#59cabb24;
		background-color:#FCF5DD;
	}
	.table_form tr:hover > td, .table_form > tbody > tr:hover > td:nth-child(1) {
		color:#111111;
	}
	.table_form td {
		font-size:11px;
		font-size:12px;
		vertical-align:top;
		color:#999;

	}
	.table_form > tbody > tr > td {
		padding:5px;
		padding-bottom:5px;
		padding-right:5px;
		padding-bottom:5px;
	}
	.table_form > tbody > tr > td > div{
		padding:4px 0px;
		margin-bottom:4px;
	}
	.table_form > tbody > tr > td.info > div{
		margin-top:4px;
	}
	.table_form > tbody > tr > td > div:nth-last-child(1){
		margin-bottom:0px;
	}
	.table_form > tbody > tr > td > span{
		padding:0px 5px;
	}
	.table_form > tbody > tr:nth-last-child(1) > td {
		border:none;
	}
	.table_form > tbody > tr > td:nth-child(1) { /* first column */
		width:120px;
		color:#597d86;
		color:#788B94;
		padding-left:10px;
		padding-right:10px;
		font-size:12px;
		border-radius:10px 0px 0px 10px;
	}
	.table_form > tbody > tr > td:nth-child(1) > div{
		position:sticky;
		top:120px;
		margin-top:4px;
	}
	.table_form div.flat{
		padding-top:0px!important;
		margin-top:2px!important;
	}
	.table_form > tbody > tr > td:nth-last-child(1) {
		border-radius:0px 10px 10px 0px;
	}

	.table_form.nofix td{
		width:inherit!important;
	}
	.table_form .nostyle {
		width:inherit;
	}
	.table_form .nostyle > label{
		width:inherit;
	}
	.table_form label {
		display:inline-block;
		width:120px;
		margin-right:10px;
		vertical-align:top;
		padding:5px 0px;
	}

	.table_form label input[type=radio] {
		float:left;
		margin-top:0px;
	}

	* html .table_form label {
		display:inline;
	}

	* + html .table_form label {
		display:inline;
	}

	.table_form td > input[type=text]{
		margin-bottom:3px;
	}

	.table_form td > input[type=text]:nth-last-child(1){
		margin-bottom:0px;
	}
	.table_form td.subsec > div{
		margin-bottom:10px;
		padding:0px!important;
		padding-left:10px!important;
		border-left:2px solid #a1ddd7;
		
		border-left:2px solid #F6CF73;
	}
	.table_form td.subsec > div:hover{
		border-left:2px solid #00ac9a;
		
		border-left:2px solid #CC6646;
	}
	.table_form td.subsec > div:hover > div:nth-of-type(1){
		background-color:#00ac9a!important;
		color:#ffffff;
		
		background-color:#2B363B!important;
		color:#ffffff;
	}
	.table_form td.subsec > div > div:nth-of-type(1){
		font-size:11px;
		border-radius:5px;
		padding:5px 8px;
		margin-bottom:5px;
		background-color:#ceecea!important;
		color:#187970;
		display:table;
		
		background-color:#F2E07D!important;
		color:#2B363B;
	}
	.table_form td.subsec > div > div.data-input{
		margin-bottom:3px;
	}

	.opt_config{
		display:flex;
		align-items: flex-start;
	}
	.opt_config > div{
		flex-grow:1;
		flex-basis:1px;
		margin-right:5px;
	}
	.opt_config > div:nth-last-child(1){
		margin-right:0px;
	}

	.opt_config .but_general{
		flex-grow:0;
		flex-basis:auto;
	}



	.table_form .but_general{
		background:linear-gradient(to bottom right, #efff00 0%,#6dcaaf 40%,#177b80 80%);
		background:linear-gradient(to bottom right, #eaf545 6%,#00a778 40%,#2d4075 80%);
		background:linear-gradient(to bottom right, #F7D273 6%,#DDA24A 40%,#CC6646 80%);
		box-shadow:0px 1px 1px #055357!important;
		box-shadow:0px 1px 1px #6D5016!important;
		color:#ffffff!important;
		padding:7px 15px 6px!important;
	}
	.table_form .option{
		margin-bottom:0px;
	}
	.mod_rights_container{
		display:flex;
	}
	.mod_rights_container .section_group{
		background:-moz-linear-gradient(center top , #FFEA5C, #FFD200); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #FFEA5C 0%,#FFD200 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #FFEA5C,#FFD200 100%); /* IE10+ */
		background: linear-gradient(to bottom, #FFEA5C 0%,#FFD200 100%); /* W3C */
		background: linear-gradient(to bottom, #FFEA5C 0%,#ffe670 100%);
		background-color:#FFEA5C;
		/*background-color:#a8ccd4;*/
		text-shadow:0px 1px 0px #ffffff;
		padding:3px 10px;
		border-radius:5px;
		font-size:12px;
		line-height:15px;
		box-shadow:inset 0px 1px 3px #f3de93, inset 0px 1px 1px #2f1f0e;
	}

	.mod_rights_container label{
		width:100%;
		margin:0px;
		padding:2px 0px;

	}

	.mod_rights_container label{
		min-width:200px;
	}
	.mod_rights_container .permission_list{
		margin-top:0px;
		padding:0px 10px;
	}
	.mod_rights_container .permission_list > div{
		padding-bottom:0px;
		margin-bottom:0px;
		border-bottom:1px solid #dedede;
		padding-top:2px;
		clear:both;
		margin:0px;

	}
	.mod_rights_container .permission_list > div label{
		line-height:22px;

	}
	.mod_rights_container .permission_list > div:nth-last-child(1){
		border:none;
	}

	.mod_rights_list{
		padding-bottom:10px;
		margin-right:10px;
		padding-right:10px;
		border-right:1px solid #dedede;
	}

	.mod_rights_list > div{
		color:#333;
		width:220px; /*180px;*/
		vertical-align:top;
		margin-right:0px;
		margin-bottom:10px;
	}

	* html .mod_rights_list > div{
		display:inline;
	}
	* + html .mod_rights_list > div{
		display:inline;
	}
	.mod_rights_list input[type=checkbox]{

		float:right;
		padding:0px;
		padding-top:0px;
		margin-top:3px;
	}
	.mod_rights_list input:focus{
		box-shadow:none;
		border:none;
	}


	.mod_rights_action_list input[type=checkbox]{
		float:right;
		padding:0px;
		padding-top:0px;
		margin-top:3px;
	}
	.mod_rights_action_list input:focus{
		box-shadow:none;
		border:none;
	}
	#validation_box{
		margin:0px 6px;
		float:right;
	}
	#validation_box > div{
		display:inline-block;
		padding:6px;
		vertical-align:middle;

	}
	* html #validation_box > div{
		display:inline;
	}
	* + html #validation_box > div{
		display:inline;
	}

	/* language ///////////////////////////////////*/
	.lang_box{
		border-radius:20px;
		padding:7px 8px;
		display:flex;
		background-color:#78b5a9;
		background-color:#C6A563;
		color:#ffffff;
		font-size:11px;
		line-height:11px;
		position:relative;
	}
	.lang_box:hover > div:nth-of-type(2){
		opacity:1;
		max-height:150px;
	}
	.lang_box > div:nth-of-type(2){
		background-color:#002021;
		background-color:#2B363B;
		position:absolute;
		top:0px;
		z-index:1;
		text-align:center;
		cursor:pointer;
		left:50%;
		transform:translateX(-50%);
		border-radius:5px;
		overflow:hidden;
		max-height:0px;
		opacity:0;
	}
	.lang_box > div:nth-of-type(2) > div{
		padding:6.5px 8px;
		color:#34524d;
		color:#576B75;
		white-space:nowrap;
	}

	.lang_box > div:nth-of-type(2) > div:hover{
		color:#51ffcf;
		color:#F2E07D;
		background-color:#34524d;
		background-color:#000;
	}
	.lang_field_box{
		padding:0px!important;
	}
	.lang_field_box > div{
		display:flex;
		margin-bottom:3px;
	}
	.lang_field_box > div:nth-last-child(1){
		margin-bottom:0px;
	}

	.lang_field_box div.lang_name{
		width:48px;
		margin-top:3px;
	}
	.lang_field_box div.lang_name > div{
		position:sticky;
		top:120px;

		min-height:25px;
	}
	.lang_field_box div.lang_name > div::before{
		position:absolute;
		content:attr(lang-holder);
		max-width:100%;
		right:0px;
		padding:5px 10px;
		padding-right:4px;
		border-radius:3px 0px 0px 3px;
		background-color:#ecf3f2;
		background-color:#f4f4f4;
		text-align:left;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;	
	}
	.table_form tr:hover .lang_field_box > div:hover div.lang_name > div::before,.lang_field_box > div:hover div.lang_name > div::before{
		background-color:#05353a; /*fff710*/ 
		color:#00ffd0;
		text-overflow:inherit;
		max-width:300%!important;
		padding-right:10px;
		border-right:2px solid #00ffe7;

		background-color:#2B363B;
		color:#F2E07D;
		border-right:2px solid #CC6646;
	}
	.table_form tr:hover .lang_field_box div.lang_name > div::before{
		background-color:#bff1e7;
		background-color:#F2E07D;
	}

	.lang_field_box .data_box{
		overflow:hidden;
		border-radius:5px;
		border-radius:3px;
		width:100%;
	}
	.lang_field_box > div:hover .data_box{
	}
	.lang_field_box .data_box select, input, textarea {
		margin:0px;
	}

	.lang_field_box > table > tbody > tr > td {
		border-bottom:1px solid #eee;
		vertical-align:middle;
		padding:1px 0px;
		vertical-align:top;
	}

	.lang_field_box > table > tbody > tr > td:nth-child(1){
		padding:6px 5px;
		width:80px;
	}
	.lang_field_box > table > tbody > tr:hover > td{
		background-color:#d8f7f9;
	}
	.lang_field_box > table > tbody > tr:nth-last-child(1) > td {
		border:none;
	}

	.lang_name{
		font-size:11px;
		font-weight:normal;
		color:#666;
		color:#2B363B;
	}
	.lang_name .default{
		color:#F00;
	}

	.lang_field_box.disabled { opacity: 1!important; pointer-events: none!important; cursor:default!important; }
	.lang_field_box.disabled div.lang_name { width: 80px; }
	.lang_field_box.disabled div.lang_name > div::before, 
	.table_form tr:hover .lang_field_box.disabled > div:hover div.lang_name > div::before,.lang_field_box.disabled > div:hover div.lang_name > div::before { width: 100%; background-color:#2B363B!important; color:#F2E07D!important; border-right:2px solid #CC6646; }



	.gallery_list{
		padding:10px 0px;
	}

	.gallery_list > div{
		margin-right:10px;
		margin-bottom:30px;
		display:inline-block;
		vertical-align:top;
		max-width:180px;
	}
	.gallery_list > div:nth-child(4n+4){
		/*margin-right:0px;*/
	}
	* html .gallery_list > div{
		display:inline;
	}
	* + html .gallery_list > div{
		display:inline;
	}

	.gallery_thumb_box{
		background-color:#E4E4E4;
		background-image:url(../../images/gallery/album_bg.gif);
		background-repeat:repeat-x;	
		padding:5px;
	}
	.gallery_thumb_box > div{
		width:170px;
		height:130px;
		display:table-cell;
		text-align:center;
		vertical-align:middle;
		background-color:#000000;
	}


	.gallery_list .des {
		font-family: Arial,"PingFang","微軟正黑體",Helvetica, sans-serif;
		font-size: 11px;
		color: #666666;
		font-weight: bold;
		padding-top:5px;
		margin-top:5px;
		border-top-style: solid;
		border-top-width: 1px;
		border-top-color: #EFEFEF;
	}
	.gallery_list .info_box > div:nth-child(1){
		padding:5px 0px;

	}
	.gallery_list .info_box{
		padding:5px 0px 10px;
	}


	.gallery_list .list_action{
		box-shadow:0px 1px 1px #CCC;
		border:1px solid #dedede;
		background-color:#ffffff;
		border-radius:10px;
		margin:0px;
		text-align:left;
		padding:5px;
		position:static;
		display:block;
	}
	.item_main_gallery_preview{
		border-radius: 15px;
		border:1px solid #dedede;
		max-width:400px;
		overflow:hidden;
		padding-right:0px!important;
		font-size:0px!important;
		min-height:100px;
		cursor:pointer;
		position:relative;
		font-weight:200;
		text-align: center;
	}
	.item_main_gallery_preview:hover{
		border:1px solid #eed93e;
		box-shadow:0px 0px 3px 2px #e5d772;
	}
	.item_main_gallery_preview::before, .item_main_gallery_preview::after{
		text-align:center;
		position:absolute;
		top:50%;
		left:50%;
		padding:10px 20px;
		background-color:rgba(10,10,10,0.7);
		color:#ffffff;
		border-radius:10px;
		font-size:13px;
	}
	.item_main_gallery_preview::after{
		content:attr(data-gallery-total)" Photo(s)";
		opacity:1;
		padding:5px 20px;
		border-radius:5px;
		transform:translateX(-50%) translateY(-50%);
	}
	.item_main_gallery_preview:hover::after{
		opacity:0;
		transform:translateX(-50%) translateY(-120%);
	}
	.item_main_gallery_preview::before{
		z-index:90;
		content:"Manage Gallery";
		opacity:0;
		box-shadow:0px 1px 1px 0px #222222, 0px 1px 35px 1px #ffffff;
		transform:translateX(-50%) translateY(0%);
	}
	.item_main_gallery_le_preview::before{
		content:"Manage Gallery (LE)";
	}
	.item_main_gallery_preview:hover::before{
		transform:translateX(-50%) translateY(-55%);
		opacity:1;
	}
	.item_main_gallery_preview img{
		max-width:100%;
		max-height:150px;
		margin:auto;
	}
	.item_thumb{
		min-height:20px;
	}
	.item_thumb::before {
		position:absolute;
		right:0px;
		content:"";
		background:url('../images/icon/gallery.png') no-repeat center center;
		width:20px;
		height:20px;
		margin-top:-3px;
		border-radius:5px;
	}

	/* section tab /////////////////////*/
	.section_tabbox {
		margin-left:15px;
		margin-top:10px;
		/*	border-bottom:2px solid #333;*/
	}
	.section_tabbox > div {
		background-color:#aaaaaa;
		background:-moz-linear-gradient(center top , #eee, #aaaaaa); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #eee 0%,#aaaaaa 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #eee,#aaaaaa 100%); /* IE10+ */
		background: linear-gradient(to bottom, #eee 0%,#aaaaaa 100%); /* W3C */

		cursor:pointer;
		display:inline-block;
		padding:7px 25px;
		font-size:14px;
		color:#666;
		border-top-left-radius:5px;
		border-top-right-radius:5px;
	}
	.section_tabbox > div:hover {
		background-color:#555555;
		background:-moz-linear-gradient(center top , #888888, #555555); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #888888 0%,#555555 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #888888,#555555 100%); /* IE10+ */
		background: linear-gradient(to bottom, #888888 0%,#555555 100%); /* W3C */

		color:#fff;
	}
	.section_tabbox > div.hl {
		background-color:#FFD200;
		background:-moz-linear-gradient(center top , #FFEA5C, #FFD200); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #FFEA5C 0%,#FFD200 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #FFEA5C,#FFD200 100%); /* IE10+ */
		background: linear-gradient(to bottom, #FFEA5C 0%,#FFD200 100%); /* W3C */

		background:#FFEA5C;
		color:#111!important;

	}
	* html .section_tabbox > div {
		display:inline;
	}
	* + html .section_tabbox > div {
		display:inline;
	}
	.feature_des {
		background-color:#006AD5;
		color:#fff;
		padding:5px;
		padding-left:20px;
		padding-right:20px;
	}

	#html_uploader{
		display:none;
	}

	/* COMPONENT END//////////////////////*/

	/* BUTTON ///////////////////////////*/
	.but_general, input[type=button], input[type=submit]{
		font-family:arial,chinese;
	}
	.but_general, input[type=button], input[type=submit], .search_box .but_general.material-icons{
		position:relative;
		display:inline-block;
		background-color:#EBEBEB!important;
		background-repeat:no-repeat!important;
		background-position:center center!important;
		background-size:contain;
		background:-moz-linear-gradient(left top , #ffffff, #c3c3c3); /* FF3.6+ */ 
		background: -webkit-linear-gradient(left top, #ffffff 0%,#c3c3c3 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(left top, #ffffff,#c3c3c3 100%); /* IE10+ */
		background: linear-gradient(to bottom right, #ffffff 0%,#e2e2e2 100%); /* W3C */
		border-radius:3px!important;
		box-shadow:0px 0.5px 1px #666!important;
		white-space:nowrap;
		font-size:11px;
		padding:6px 15px 5px!important;
		color:#333!important;
		margin-left:1px;
		cursor:pointer;
		border:none;
		box-sizing:border-box;
		min-width:20px;
		min-height:20px;
		vertical-align:top;
		line-height:normal;
		width:auto!important;
		height:auto!important;
		margin-bottom:1px!important;
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,margin-bottom 0s, margin-top 0s,box-shadow 0s!important;
		overflow:hidden;
	}
	.but_general:not(.control):hover, input[type=button]:hover, input[type=submit]:hover{
		background-color:#141414;
		color:#FC0!important;
		color:#000!important;
		color:#6D5016!important;
		background-color:#fbe777;
		background:-moz-linear-gradient(left top , #ffffff, #fbe777); /* FF3.6+ */ 
		background: -webkit-linear-gradient(left top, #ffffff 0%,#fbe777 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(left top, #ffffff,#fbe777 100%); /* IE10+ */
		background: linear-gradient(to bottom right, #ffffff 0%,#fbe777 100%); /* W3C */
		box-shadow:inset 0px -5px 10px #000!important;
		box-shadow:inset 0px 1px 2px #666!important;
		box-shadow:inset 0px 1px 2px #666!important;
		margin-top:1px!important;
		margin-bottom:0px!important;
	}

	.but_general.hover{
		background-color:#141414;
		color:#FC0!important;
		color:#000!important;
		background-color:#fbe777;
		background:-moz-linear-gradient(left top , #ffffff, #fbe777); /* FF3.6+ */ 
		background: -webkit-linear-gradient(left top, #ffffff 0%,#fbe777 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(left top, #ffffff,#fbe777 100%); /* IE10+ */
		background: linear-gradient(to bottom right, #ffffff 0%,#fbe777 100%); /* W3C */
		box-shadow:inset 0px -5px 10px #000!important;
		box-shadow:inset 0px 1px 2px #666!important;
		margin-top:1px!important;
		margin-bottom:0px!important;
	}


	* html .but_general {
		display:inline;
	}
	* + html .but_general {
		display:inline;
	}

	.but_general.void{
		background:linear-gradient(to bottom right, #270016 0%, #440019 5%,#ff006a 100%)!important;
		color:#ffffff!important;
	}
	.but_general.approve{
		background:linear-gradient(to bottom right, #180098 0%, #1300af 25%,#00e7ff 100%)!important;
		color:#ffffff!important;
	}
	.but_general.normal{
		background:linear-gradient(to bottom right, #c26d01 0%, #c26d01 25%,#ffe0bb 100%)!important;
		color:#ffffff!important;
	}
	.but_general.normal:hover{
		box-shadow: inset 0px -2px 13px 0px #c26d01!important;
		padding-top:10px;
		color:#ffffff!important;
	}
	.but_general.void:hover{
		box-shadow: inset 0px -2px 13px 0px #440019!important;
		padding-top:10px;
		color:#ffffff!important;
	}
	.but_general.confirm:hover, .but_general.approve:hover{
		box-shadow: inset 0px -2px 13px 0px #1300af!important;
		padding-top:10px;
		color:#ffffff!important;
	}
	.action_box .but_general.material-icons.control{
		background-color:#dedede!important;
		color:#ffffff!important;
	}
	.action_box .but_general.material-icons.control:hover{
		background-color:#e2d67c!important;
		color:#ffffff!important;
	}

	.action_box .but_general.material-icons.control.active:hover, .action_box .but_general.material-icons.control.active{
		background-color:#39daa6!important;
	}
	.action_box .but_general.material-icons.reverse{
		padding:1px 1px 0.5px!important;
		font-size:20px!important;
		margin-top:-1px!important;
		color:#629290!important;/*#b9cac8!important;/*#7fa7a2!important;*/
		color:#C6A563!important;/*#b9cac8!important;/*#7fa7a2!important;*/
		background:none!important;
	}

	.action_box .but_general.material-icons.reverse:hover{
		padding:1px 1px 0.5px!important;
		color:#00ccaf!important;
		box-shadow:0px 0px 1px 2px #00ccaf!important;
		
		color:#C6A563!important;
		box-shadow:0px 0px 1px 2px #C6A563!important;
	}

	.but_display{
		background-image:url(../images/button/display.png);
		width:25px;
		height:25px;
		padding:0px!important;
		cursor:pointer;
	}
	.but_display.off{
		background-image:url(../images/button/display_off.png);
	}
	.but_edit{
		background-image:url(../images/button/edit.png);
	}
	.but_stock{
		background-image:url(../images/button/edit.png);
	}
	.but_edit:hover{
		background-image:url(../images/button/edit_ro.png);
	}
	.but_delete{
		background:url(../images/button/delete.png) center center no-repeat;
		position:relative;
	}
	.but_delete::before, .but_delete::after{
		content:"";
		position:absolute;
		top:8%;
		bottom:8%;
		width:3.5%;
		background-color:#333;
		background-color:#957B73;
	}
	.but_delete::before{
		left:50%;
		transform:translateX(-50%) rotate(45deg);
	}
	.but_delete::after{
		right:50%;
		transform:translateX(50%) rotate(-45deg);
	}
	.but_delete:hover{
		/*background:url(../images/button/delete_ro.png) center center no-repeat;*/
	}
	.but_preview{
		background-image:url(../images/button/preview.png);
	}

	.but_back {
		/*background:url(../images/button/back.png) no-repeat center center;*/
		/*background-color:#ffffff;*/
		color:#888;
		font-size:11px;
		display:inline-block;
		margin-left:auto;
		border-radius:3px;
		/*box-shadow:inset 0px 1px 1px #73dae6, 0px 1px 0px #efefef;*/
		height:26px;
		width:40px;
		padding:5px 10px!important;
		cursor:pointer;

		position: relative;
		background: #2B363B;
		box-shadow: 0px 1px 1px 0px #6D5016!important 
	}
	.but_back:hover {
		/*background:url(../images/button/back_ro.png) no-repeat center center;*/
		color:#fff;
		/*background-color:#aaebf3!important;*/
		background-color:#F2E07D!important;
		/*box-shadow:inset 0px 1px 1px #35abb9;*/
		box-shadow: inset 0px 1px 2px #666!important;
	}

	.but_back:after { position: absolute; content: ''; height: 8px; width: 8px; border: 1px solid #fff; border-width: 0 0 1px 1px;  transform: rotate(45deg); top: 8px; left: 18px; margin-top: 1px; }
	.but_back:hover:after { border: 1px solid #fff; border-width: 0 0 1px 1px; border-color: #B48070;  }

	* html .but_back {
		display:inline;
	}
	* + html .but_back {
		display:inline;
	}
	.but_cate{
		display:table;
		padding:5px 20px;

		background-color:#71c1cd;
		background:-moz-linear-gradient(center top , #71c1cd, #1e3991); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #71c1cd 0%,#1e3991 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #71c1cd,#1e3991 100%); /* IE10+ */
		background: linear-gradient(to bottom, #71c1cd 0%,#1e3991 100%); /* W3C */
		border-radius:5px;
		color:#ffffff;
		box-shadow:0px 1px 1px #1e3991;
		cursor:pointer;
		font-weight:bold;
		margin-right:5px;
	}
	.but_cate:hover{
		background-color:#ffde00;
		background:-moz-linear-gradient(center top , #ffe400, #ffba00); /* FF3.6+ */ 
		background: -webkit-linear-gradient(top, #ffe400 0%,#ffba00 100%); /* Chrome10+,Safari5.1+ */
		background: -ms-linear-gradient(top, #ffe400,#ffba00 100%); /* IE10+ */
		background: linear-gradient(to bottom, #ffe400 0%,#ffba00 100%); /* W3C */
		color:#483500;
		box-shadow:inset 0px 1px 1px #1e3991;
		padding-top:6px;
		padding-bottom:4px;
	}
	/* BUTTON END //////////*/

	/* ICON ////////////////////////////////////////////////////*/
	.icon_valid{
		display:table-cell;
		background:url(../images/icon/valid.png) no-repeat center center;
		width:20px;
		height:20px;
	}

	.icon_invalid{
		display:inline-block;
		background:url(../images/icon/invalid.png) no-repeat center center;
		width:20px;
		height:20px;
	}

	/* ICON END ///////////////////////////////////*/

	/* COMPONENT ////////////////////////////////*/
	.section_controlbox{
		color:#fff;
		background:-moz-linear-gradient(center top , #777, #555) repeat scroll 0 0 transparent #555!important;
		background-color:#555;
		border-radius:5px;
		padding:5px;
		font-size:11px;
		margin:0px!important;
	}
	.section_controlbox > div{
		color:#111;
		display:inline-table;
		margin-right:1px;
		background-color:#ffd200;
		background:-moz-linear-gradient(center top , #ffea5c, #ffd200) repeat scroll 0 0 transparent !important;
		border-radius:3px;

	}
	.section_controlbox > div > div{
		display:inline-block;
		vertical-align:middle;
		padding:3px 7px;
		padding-right:5px;
		font-weight:normal;
	}
	.section_controlbox > div > div:nth-child(1){
		border-right:1px solid #666;
		padding:6px 7px;
		padding-right:10px;
		font-weight:bold;
	}
	* html .section_controlbox > div > div{
		display:inline;
	}
	* + html .section_controlbox > div > div{
		display:inline;
	}

	.section_controlbox td{
		padding-right:5px;
	}
	.section_controlbox td:nth-last-child(1){
		padding:0px;
	}
	.section_controlbox .but_general{
		padding:2px 10px;
	}

	.section_controlbox label {
		display:inline-block;
		margin-right:10px;
		vertical-align:top;
		padding:2px 0px 0px;
	}
	.section_controlbox label input[type=radio] {
		float:left;
		margin-top:0px;
		margin-right:5px;
	}
	* html .section_controlbox label {
		display:inline;
	}
	* + html .section_controlbox label {
		display:inline;
	}
	.section_controlbox select, .section_controlbox input{
		margin:0px;
		padding:0px;
	}
	.section_controlbox input{
		padding:2px;
	}

	input.short{
		width:inherit!important;
	}
	.datasec_container .action_box .search_box{
		margin-bottom:0px!important;
	}
	.search_box{
		border-radius:5px;
	/*	padding:10px 15px;*/
		display:inline-flex;
	/*	box-shadow:0 1px 2px #cdcdcd inset, 0 -3px 10px #9dd9e6 inset;*/
	/*	border-bottom:2px solid #0000ba;*/
		margin-bottom:0px!important;
		position:relative;
		font-size:0px;
	}

	.search_box > div{
		margin:0px;
		margin-right:1px;
	}
	.search_box input[type=text]{
		padding:7.5px 10px 6.5px!important;
		padding-right:30px!important;
		background-color:#0c3a50; /*#eefafc;*/
		background-color:#2B363B; /*#eefafc;*/
		color:#10ffbd;/*#fff710;*/
		width:150px!important;
		box-shadow:none!important;
		margin-top:-1px;
		margin-right:3px;

		margin-top: 0;
		margin-right: 2px;
		border: 1px solid #2B363B!important;
		padding:7px 10px!important;
		min-height: 28px;
		max-height: 28px;
	}
	.search_box input[type=text]:focus{
		background-color:#eafcff;
		color:#222222;
		box-shadow:inset 0px 2px 5px #dadada;
		border: 1px solid #C6A563!important;
	}
	.search_box input[type=text]::placeholder{
		color:#51ffae;
		color:#fff;
	}
	.search_box input[type=text]:focus::placeholder{
		color:#777777;
	}
	.section_container .action_box .search_box input[type=text]{
		padding:5px 10px 4.5px!important;
	}
	.search_box .but_general{
		position:absolute;
		top:0px;
		right:1px;
	}
	.search_box .but_general.material-icons{
		padding:5px 3.8px 3.8px 4px!important;
		font-size:17px!important;
		min-height: 28px;
		max-height: 28px;
		min-width: 28px;
		max-width: 28px;
		padding:5px!important;
		color: #C6A563!important;
		border: 1px solid #C6A563;
		background: none!important;
		background: #fff!important;
	}
	.search_box .but_general.material-icons:hover, .action_box .search_box .but_general.material-icons:not(.control):hover{
		padding-top:5px!important;
		padding:5px 3.8px 3.8px 4px!important;
		margin-bottom:1px!important;
		padding:5px!important;
		background: #2B363B!important;
		box-shadow: none!important;
		color: #fff!important;
		border: 1px solid transparent;
	}
	.datasec_container .search_box .but_general.material-icons{
		padding:4px 3.3px 3.5px 3px!important;
		font-size:15px!important;
		line-height:14.5px!important;
		
		font-size:17px!important;
		padding: 5px!important;
		margin: 0 0 0 2px!important;
	}
	.datasec_container .search_box .but_general.material-icons:hover, .datasec_container .action_box .search_box .but_general.material-icons:not(.control):hover{
		padding-top:4px!important;
		padding:4px 3.3px 3px 3px!important;
		margin-top:-1px!important;
		margin-bottom:0px!important;
		
		padding: 5px!important;
		margin: 0 0 0 2px!important;
	}


	.search_box .but_general:hover{
		margin-top:0px!important;
	}
	.search_box > div{
		display:inline-block;
	}

	* html .search_box > div{
		display:inline;
	}

	* + html .search_box > div{
		display:inline;
	}

	/* COMPONENT END ////////////////////////////*/

	/* MOD ///////////////*/
	/* PRODUCT*/
	.product_stock{
		background-color:#efefef;
		width:18px; 
		height: 18px; 
		vertical-align: middle; 
		text-align: center; 
		font-size:9px;
		border-radius:10px;
		display:table-cell;
	}

	.product_stock.no_stock{
		background-color:#EC007D!important;
		color:#ffffff!important;
	}
	.product_stock.options{
		background-color:#FF0;
	}
	.product_option_list_hl_box{
		padding:0px 10px;
	}
	.product_option_list_hl_box > div > div{
		display:inline-block;
	}
	* html .product_option_list_hl_box > div > div{
		display:inline;
	}
	* + html .product_option_list_hl_box > div > div{
		display:inline;
	}
	.product_option_list_hl_box > div > div:nth-child(2){
		width:100px;
		margin-right:10px;
		color:#e2eb4f;
	}

	.product_option_list_hl_box > div > div:nth-child(3){
		width:50px;
		margin-right:10px;
		color:#FFF;
	}
	.product_option_list_hl_box > div{
		clear:both;
		padding:10px 0px;
		border-bottom:1px solid #333333;
	}
	.product_option_list_hl_box > div:nth-last-child(1){
		border:none;
	}

	.product_option_list_hl_box > div > div:nth-child(1){
		float:right;
		margin-left:20px;
		margin-top:-3px;
		width:18px;  
		padding:3px 0px;

		vertical-align: middle; 
		text-align: center; 
		display:table-cell;
		border-radius:10px;
		background-color:#343434;
	}
	.info_bar.product_nature, .info_bar.hl_box{
		background-color:#09243c;
		background-color:#2b1a00;
		background-color:#00333c;
		background-color:#2B363B;
	}
	.data_label.product_code, .data_label.hl_info{
		color:#00ffa1;/*#ffde00;*/
		background-color:unset!important;
		
		color:#F9DA00;/*#ffde00;*/
		background-color:#2B363B!important;
	}
	/* MOD END ///////////////////////////*/

	/* TAG //////////////////*/
	.tag_list li{
		display:inline-block;
	}
	* html .tag_list li{
		display:inline;
	}
	* + html .tag_list li{
		display:inline;
	}
	.tag_list .item{
		background:-moz-linear-gradient(center top , #f3f5f7, #e0e2e4) repeat scroll 0 0 transparent;
		background:-webkit-linear-gradient(top, #f3f5f7, #e0e2e4);
		background-color:#f3f5f7;
		padding:3px 10px;
		margin-bottom:5px;
		margin-left:5px;
		color:#333;
		cursor:pointer;
		border-radius:5px;
		box-shadow:0px 1px 2px #cdcdcd;
	}
	.tag_list .item:hover{
		background:-moz-linear-gradient(center top , #f3f5f7, #fffad7) repeat scroll 0 0 transparent;
		background:-webkit-linear-gradient(top, #f3f5f7, #fffad7);
		background-color:#fffad7;
		color:#333;
	}
	.tag_list input{
		margin:0px;
		padding:0px;
		height:25px;
	}
	.tag_list .item > div{
		display:inline-table;
	}
	.tag_list .item > div:nth-child(1){
		padding:3px;
	}
	.tag_list .no_item{
		background:none;
		border:none;
		padding:0px;
	}
	.tag_list .but_delete{
		width:20px;
		height:20px;
		float:right;
	}
	/* TAG END //////////////*/
	.flow_list{
		margin-top:-6px;
		position:absolute;
	}
	.flow_list > div{
		display:inline-block;
		padding:5px 10px;
		border-radius:5px;
		border:1px dashed #999;
		margin-right:20px;
	}
	.flow_list > div:hover{
		background-color:#ffffff;
	}
	.flow_list > div::after{
		content : " > ";
		position:absolute;
		margin-left:20px;
	}
	.flow_list > div:nth-last-child(1)::after{
		content:"";
	}

	* html .flow_list > div{
		display:inline;
	}
	* + html .flow_list > div{
		display:inline;
	}
	.date{
		text-align:center;
		display:table;
		position:relative;
		margin-bottom:5px;
	}
	.date > div{
		padding:5px 10px;
		border-radius:5px;
		margin:auto;

	}
	.date > div:nth-child(1){
		background-color:#E1FFFD;
	}

	.date > div:nth-child(2){
		background-color:#FEF4C7;
		margin-top:15px;
	}
	.date > div:nth-child(2)::before{
		text-align:center;
		left:0px;
		right:0px;
		top:25px;
		font-size:7px;
		content:"|";
		position:absolute;
	}
	.date_h{
		display:table!important;
		position:relative;
		margin-bottom:5px;
		border-radius:0px 5px 5px 0px;
		overflow:hidden;
		background:linear-gradient(to bottom right, #3dcb95 0%,#3d97cb 30%,#ad52ff 100%);
		background:linear-gradient(to bottom right, #F7D273 0%,#DDA24A 30%,#CC6646 100%);
		border-left:5px solid #001475;
		border-left:5px solid #A5624E;
		color:#ffffff;
		padding:0px!important;
	}
	.date_h > div{
		display:inline-block;
		padding:5px 10px;
	}
	.date_h > div:nth-child(2)::before{
		content:"";
		height:5px;
		width:5px;
		border-top:1px solid #333333;
		border-right:1px solid #333333;
		transform:translateY(-50%) rotate(45deg) ;
		top:50%;
		margin-left:-12px;
		position:absolute;
		
		border-top:1px solid #6D5016;
		border-right:1px solid #6D5016;
	}

	.tab_header{
		padding-top:5px;
		background:url(../images/main/section_title_break.png) no-repeat left top;
		
		box-sizing:border-box;
		position:relative;
		padding-left:35px;
		box-shadow:inset 15px 0px 1px #1d18a7,-10px 1px 1px #d5eae8;/*-10px 10px 20px #daefed,-10px 2px 1px #5e7270;*/
		box-shadow:inset 15px 0px 0px #1d18a7, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #adc9e0, -7px 1px 1px #4c11ab; /*-7px 1px 1px #d5eae8, */
		box-shadow:inset 15px 0px 0px #1d18a7, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #adc9e0, -7px 1px 1px #00af76, -7px 6px 0px #a3e9f1;
		box-shadow:inset 15px 0px 0px #1d18a7, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #adc9e0, -7px 1px 1px #00af76, -7px 6px 0px #a3e9f1;
		box-shadow:inset 15px 0px 0px #CC6646, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #FFFDD3, -7px 1px 1px #F6CF73, -7px 6px 0px #F2E07D;
	}
	.tab_header.top{
		position:fixed;
		left:0px;
		right:0px;
		padding:8px 20px 0px 35px;
		z-index:98;
		box-shadow:-10px 1px 1px #9ed1dc; /*-10px 10px 20px #daefed,-10px 2px 1px #5e7270;*/
		box-shadow:inset 15px 0px 0px #1d18a7, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #adc9e0, -7px 1px 1px #4c11ab; /* -7px 1px 1px #d5eae8, */
		box-shadow:inset 15px 0px 0px #1d18a7, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #adc9e0, -7px 1px 1px #00af76, -7px 6px 0px #a3e9f1;
		box-shadow:inset 15px 0px 0px #CC6646, inset -250px 0px 120px #ffffff, inset 0px 1px 0px #FFFDD3, -7px 1px 1px #F6CF73, -7px 6px 0px #F2E07D;
	}
	.tab_header.top::before{
		background:url(../images/main/bg.jpg) no-repeat fixed 0px -120px;
		position:absolute;
		content:"";
		left:0;
		top:0;
		bottom:0;
		right:0;
		z-index:-1;
		opacity:1;
		box-shadow:inset 15px 0px 0px #1d18a7;
		box-shadow:inset 15px 0px 0px #CC6646;
	}
	.tab_header.top .info{
		padding-top:0px;
	}
	.tab_header .info{
		padding:5px 0px 7px;
		padding-top:0px;
		color:#1d18a7;/*#0bc2fa;/*#b2d6e1;*/
		color:#6D5016;/*#0bc2fa;/*#b2d6e1;*/
	}
	.tab_header .info > div:nth-child(1){
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-size:23px;
		line-height:35px;
		font-weight:300;
	}
	.tab_header .info > div:nth-child(2){
		display:table;
		padding:5px 10px 4px;
		margin-top:3px;
		margin-bottom:3px;
		border-radius:5px;
		background-color:#00215d;
		background-color:#2B363B;
		color:#ffffff;
		text-transform:capitalize;
		font-size:11px;
	}
	.tabnavbox{
		position:absolute;
		bottom:0px;
		right:10px;
		text-align:right;
		font-size:0px;

		/*border-bottom:2px solid #4c11ab;*/

	}
	.tabnavbox > div{
		display:inline-block;
		padding:7px 25px 5px;
		font-size:12px;
		background-color:rgba(197, 228, 229, 0.3);
		background:linear-gradient(to bottom, #e4f7f7  0%,#b1ecec 100%);
		color:#0a7d78;	
		margin-right:2px;
		cursor:pointer;
		vertical-align:bottom;
		border-bottom:0px solid #4c11ab;
		border-radius:3px 3px 0px 0px;
		
		color:#2B363B;
		background:linear-gradient(to bottom, #EEEEEE  0%,#DAE1E4 100%);
		border-bottom:0px solid #2B363B;
	}
	.tabnavbox > div:hover{
		background-color:#fff700;
		background:linear-gradient(to bottom, #87f9ff  0%,#d9ffea 100%);
		color:#002f3a;
		border-bottom:2px solid #4c11ab;
		
		background-color:#F7CF73;
		background:linear-gradient(to bottom, #F2E07D  0%,#F7CF73 100%);
		color:#6D5016;
		border-bottom:2px solid #F6CF73;
	}
	.tabnavbox > div.hl{
		color:#ffffff;
		background-color:rgba(0,0,0,0.7);
		background: linear-gradient(to bottom, #3bcbd2  0%,#4c11ab 100%); /* W3C */
		background: linear-gradient(to bottom, #788B94  0%,#2B363B 100%); /* W3C */
		border-top:2px solid #00f3ff;
		border-top: none;
		border-bottom: 2px solid #2B363B;
		box-shadow:inset 0px -2px 1px #4c11ab;
		box-shadow:inset 0px -2px 1px #2B363B;
	}

	.flex{
		display:flex;
	}
	.flex > div{
		margin-right:5px;
	}
	.flex > div:nth-last-of-type(1){
		margin-right:0px;
	}
	.flex .data-input{
		width:100%;
	}

	.block{
		display:block!important;
		width:100%;
	}

	.option{
		overflow:initial;
		color:#226c73;
		color:#788B94;
		position:relative;
		display:inline-block;
		border-radius:5px;
		padding:0px!important;
		text-align:left;
		font-size:0px;
	}
	.option > div{
		font-size:12px;
		line-height:12px;
	}
	.option.block{
		display:block;
	}
	.option.fullw{
		width:100%;
	}
	.option.no_w{
		width:inherit;
	}

	.option.active .current{
		box-shadow:inset 0px 2px 7px #eaeaea, 0px 0px 0px 1px #cdcdcd;
	}
	.option .current:hover{
		box-shadow:inset 0px 2px 7px #eaeaea, 0px 0px 0px 1px #186e77;
		box-shadow:inset 0px 2px 7px #eaeaea, 0px 0px 0px 1px #C6A563;
	}
	.option select{
		display:none;
	}
	.option .current{
		position:relative;
		border-radius:5px;
		border-radius:3px;
		background-color:#ffffff;
		padding:6px 15px 5px;
		padding:6px 15px;
		padding-right:30px!important;
		box-shadow:inset 0px 0px 0px 1px rgba(100,100,100,0.1);
		white-space:nowrap;
		box-sizing:border-box;
		line-height:16px;
		cursor:pointer;
		min-width:60px;

		box-shadow:inset 0px 0px 0px 1px #DAE1E4;
	}
	.option .current div, .option .current{
		white-space:nowrap;
		text-overflow:ellipsis;
		overflow:hidden;
	}
	.option .current:hover:empty::before {
		color:#186e77;
		color:#2B363B;
	}
	.option .current:empty::before {
	  content:attr(data-placeholder);
	  color:#a6b7b6;
	}
	.option .current::after{
		border-right:1px solid #b5b5b5;
		border-bottom:1px solid #b5b5b5;
		content:"";
		display:inline-block;
		padding:3px;
		transform:translateY(-80%) rotate(45deg);
		top:50%;
		position:absolute;
		right:10px;

		border-right:1px solid #C6A563;
		border-bottom:1px solid #C6A563;
	}
	.option .current:hover::after{
		border-right:1px solid #333333;
		border-bottom:1px solid #333333;

		border-right:1px solid #C6A563;
		border-bottom:1px solid #C6A563;
	}
	.option.compact{
		width:inherit;
	}
	.option.compact .current{
		min-width:inherit;
	}
	.option .des{
		color:#31bba2;
	}
	.option .opt_list .des{
		margin-top:3px;
	}
	.option .selected .des{
		color:#f6ff75;
	}
	.option .opt_list{
		border-radius:3px;
		background-color:#ffffff;
		z-index:1000;
		position:absolute!important;
		max-height:0px;
		opacity:0;
		overflow:hidden;
		overflow-y:auto;
		left:0px;
		right:0px;
		top:30px;
		/*border:1px solid rgba(0,0,0,0.1);*/
		box-shadow:0px 0px 0px 0.5px #73c5af, 0px 0px 1px 0px #efefef;
		box-shadow:0px 0px 0px 0.5px #C6A563, 0px 0px 1px 0px #efefef;
		white-space:nowrap;
	}
	.option .opt_list:hover{
		box-shadow:0px 0px 0px 1px #27c7c0, 0px -1px 0px 1px #bce0dd;
		box-shadow:0px 0px 0px 1px #C6A563, 0px -1px 0px 1px #D4BB8A;
	}

	.option .opt_list > div{
		display:flex;
		position:relative;
		padding:8px 15px!important;
		border-bottom:1px solid rgba(0,0,0,0.1);
		padding-right:25px;
		color:#285f5f;
		color:#6D5016;
		cursor:pointer;
	}
	.option .opt_list > div:nth-last-child(1){
		border-bottom:none;
	}
	.option .opt_list > div:hover{
		background-color:#FF9;
		background-color:#e9f7f5;
		background-color:#f3f7f7;
		background-color:#FFFBE5;
		color:#285f5f;
		color:#6D5016;
	}
	.option .opt_list > div.selected{
		background-color:#32cccc; /*#3CC;#789f00;#2fa3a3*/
		background-color:#39c5bf;
		background-color:#7accc8;
		background-color:#5cb3ae;
		background-color:#113e3e;
		background-color:#2fa79b;
		background-color:#C6A563;
		color:#ffffff;
		/*text-shadow:0px 0.5px 0px #166363,0px 0.5px 0px #166363, 0px 1px 1px #166363;*/
	}

	.option .opt_list > div::after{
		content:"";
		position:absolute;
		width:0px;
		height:5px;
		border-radius:10px 0px 0px 10px;
		right:0px;
		top:50%;
		transform:translateY(-50%);
		background-color:#f9da00;
	}
	.option .opt_list > div.selected::after, .option .opt_list > div:hover::after{
		right:0px;
		width:15px;
	}

	.option .opt_list > div[disabled]{
		max-height:50px!important;
	}
	.option .opt_list > div[disabled]:hover{
		background:none;
		color:#d3d3d3;
	}
	.option .opt_list > div > div:nth-last-child(1){
		padding-right:25px;
	}

	.option.active .opt_list{
		max-height:350px;
		opacity:1;
		top:0px;
	}

	.option .opt_list.multiple > div > div:before{
		position:absolute;
		z-index:10;
		content:"";
		right:10px;
		top:6px;
		width:12px;
		height:12px;
		border-radius:50%;
		top:50%;
		transform:translateY(-50%);
	}
	.option .opt_list.multiple > div.disabled > div:before{
		visibility: hidden;
	}

	.option .opt_list.multiple > div:hover > div:before{
		background-color:#3CC;
		box-shadow:inset 0px 0px 0px 3px #ffffff;
	}
	.option .opt_list.multiple > div.selected > div:before{
		background-color:#ffffff;
		border:none;
	}
	.option .opt_list.multiple > div.selected:hover > div:before{
		background-color:#F33;
		box-shadow:inset 0px 0px 0px 3px #ffffff;
	}
	.option .opt_list.multiple > div > div:nth-last-child(1){
		padding-right:50px;
	}
	.option .opt_list.multiple > div{
		padding-top:5px!important;
		padding-bottom:5px!important;
		cursor:pointer;
		border-bottom:none!important;
	}
	.selection_action_box{
		position:fixed;
		right:0px;
		margin:0px;

		top:0px;
		padding:0px;
		width:210px;
		background-color:#333333;
		max-height:0px;
		opacity:1;

		z-index:100000;
	}
	.selection_action_box.active{
		opacity:1;
		max-height:500px;
	}

	.selection_action_box.top{
		top:0px;
	}
	.selection_action_box .overview_box{
		margin-top:-25px;
		max-height:0px;
		overflow:hidden;
	}
	.selection_action_box.active .overview_box{
		margin-top:0px;
		max-height:500px;
	}

	.selection_action_box .overview_box > div{
		padding:15px 20px;
		border-bottom:1px solid #666666;
	}
	.selection_action_box .overview_box > div:nth-last-child(1){
		border:none!important;
		box-shadow:0px 0px 20px #757575;
		padding-top:5px;
		padding-bottom:5px;
		padding:5px;
	}

	.selection_action_box .action_list{
		position:relative;
		box-shadow:none;
		opacity:1;
		max-height:300px;
		border-radius:0px;
		left:0px;
		top:0px;
		color:#ffffff;
		background:none!important;
		max-width:100%;
		z-index:unset;
		padding-top:10px!important;
		padding-bottom:10px!important;

	}
	.selection_action_box .action_list > div{
		padding:0px 10px;
		border-bottom:none;
		margin-bottom:5px;
		border-left:1px solid #aaaaaa;
	}
	.selection_action_box .action_list > div:hover{
		background-color:unset;
		border-left:10px solid #00ff89;
		color:#00ff89;
		border-right:1px solid #00ff89;

		border-left:10px solid #CC6646;
		color:#F6CF73;
		border-right:1px solid #CC6646;
	}

	.selection_action_box .action_box{
		float:none;
		text-align:center;
		padding:3px 5px!important;
		display:flex;
		align-items:stretch;
		width:100%;
	}

	.selection_action_box .action_box .but_general{
		margin:3px!important;
		flex:1 1 auto;
		justify-content: center;
	}
	#selection_action_box_info{
		color:#00ff89;
		color:#F2E07D;
		font-size:13px;
	}
	#selection_action_box_info .remark{
		font-size:12px;
		color:#ffffff;
	}
	.selection_action_setting_box{
		position:absolute;
		min-height:100%;
		background-color:rgba(0,0,0,0.9);
		top:0px;
		width:100%;
		opacity:0;
		margin-left:100%;
	}
	.selection_action_setting_box.active{
		opacity:1;
		margin-left:0%;
	}
	.selection_action_setting_box > div{
		padding:15px 20px;
	}
	.selection_action_setting_box .title{
		color:#00ff89;
		font-size:13px;
	}

	.selection_action_setting_box .message{
		font-size:12px;
		color:#ffffff;
	}
	.selection_action_setting_box .action_box{
		border-top:1px solid #00ff89;
		box-shadow:0px 0px 20px #757575;

	}
	.selection_action_setting_box .info_box{
		border-bottom:1px solid #666666;

	}
	.selection_action_box .info_box{
		padding-bottom:10px!important;
	}
	.selection_action_box .list_box{
		padding:0px;
		margin:10px 20px;
		margin-right:10px;
		max-height:300px;
		overflow:auto;

	}
	.selection_action_box .list_box > div{
		padding:0px 10px;
		border-bottom:none;
		margin-bottom:5px;
		background-color:unset;
		border-left:2px solid #ffe000;
		color:#aaaaaa;
	}


	.list_selection.active .checkbox, .table_list > tbody > tr:hover > td .checkbox{
		box-shadow:0px 0px 0px 1px #aaaaaa;
		opacity:1;
		margin-left:10px;
	}	
	.table_list > tbody > tr:hover > td .checkbox:hover{
		box-shadow:0px 0px 0px 1px #666666;
	}
	.list_selection_hl{
		background-color:#fffdce!important;
		border:1px dashed #aaaaaa!important;
		border-radius:5px;
	}
	.list_selection_hl td{
		border-bottom:1px dashed #aaaaaa!important;

	}
	.list_selection{
		position:absolute;
		z-index:100;
		opacity:1!important;
		right:0px;
		top:0px;
		bottom:0px;
		transform:translateX(100%);
	}
	.list_selection .checkbox{
		display:inline-block;
		position:relative;
		margin-left:0px;
		margin-top:12px;
		margin-right:12px;
		padding:9px;
		background-color:#ffffff;
		border-radius:3px;
		box-shadow:none;
		opacity:0;
		cursor:pointer;
	}
	.list_selection.all .checkbox.active{
		box-shadow:0px 0px 1px 3px #2b7c58,0px 0px 0px 1px #888888!important;
		box-shadow:0px 0px 1px 3px #CC6646,0px 0px 0px 1px #888888!important;
	}

	.checkbox{
		display:inline-block;
		position:relative;
		margin:5px;
		margin-top:0px;
		padding:9px;
		background-color:#ffffff;
		border-radius:3px;
		box-shadow:none;
		cursor:pointer;
		box-shadow:0px 0px 1px 1px #cccccc,0px 0px 0px 1px #888888;
	}
	.checkbox_container{
		line-height:0px!important;
	}
	.checkbox_container > div{
		margin:5px!important;
		padding:5px!important;
	}
	.checkbox_container .checkbox{
		height: 0px;
	}
	.table_form .checkbox_container > div{
		margin:0px!important;
		padding:0px!important;
	}
	.table_form .checkbox_container .opt_list > div{
		margin-bottom:0px!important;
	}
	.action_box .checkbox_container{
		padding:0px!important;
	}
	.checkbox_container .checkbox{
		box-shadow:0px 0px 1px 1px #efefef,0px 0px 0px 1px #dadada;
		margin:0px!important;
		float:left;
	}
	.checkbox_container .opt_list{
		display:flex;
		flex-wrap:wrap;
	}
	.checkbox_container.boxed .opt_list{
		max-height:180px;
		overflow:auto;
	}
	.checkbox_container .opt_list > div{
		cursor:pointer;
		display:flex;
		flex-wrap:nowrap;
		/* margin-bottom:10px; */
	}

	.checkbox_container .opt_list > div:nth-last-of-type(1){
	}
	.checkbox_container input[type='checkbox']{
		display:none;
	}
	.checkbox_container .msg{
		padding:1px 10px;
	}
	.checkbox_container .opt_list > div{
		color:#616769;
		font-size:12px;
		line-height:16px;

	}
	.checkbox_container .opt_list > div:hover .checkbox{
		box-shadow:0px 0px 1px 1px #999999,0px 0px 0px 1px #888888;
	}
	.checkbox_container .checkbox.active+div{
		color:#C6A563;
	}

	.checkbox_container .checkbox::before{
		border:0px!important;
		transform:translate(150%,-50%) rotate(45deg);
		width:0px;
		height:0px;
		background-color:#19c3ac;
		background-color:#C6A563;
		border-radius:3px;
	}
	.checkbox_container .checkbox.active::before{
		width:9.5px;
		height:9px;
		transform:translate(-50%,-50%);
	}
	.checkbox_container .checkbox.active{
		box-shadow:0px 0px 1px 1px #3bfbd8,0px 0px 0px 1px #888888!important;
		box-shadow:0px 0px 1px 1px #C6A563,0px 0px 0px 1px #888888!important;
	}
	.checkbox.active{
		box-shadow:0px 0px 1px 1px #4fc58f,0px 0px 0px 1px #888888!important;
		box-shadow:0px 0px 1px 1px #C6A563,0px 0px 0px 1px #888888!important;
	}
	.checkbox.active::before{
		border-color:#333333;
		padding:3.5px 2px;
	}
	.checkbox::before{
		content:"";
		border-bottom:1px solid;
		border-right:1px solid;
		border-color:#ffffff;
		position:absolute;
		padding:0px;
		left:50%;
		top:50%;
		transform:translate(-50%,-60%) rotate(45deg);
	}
	.toggle{
		border-radius:5px;
		background-color:#d0dada;
		box-shadow:inset 0px 2px 5px #919ea0;
		display:table-caption;
		position:relative;
		padding:2px;
		min-width:35px;
		min-height:18px;
		cursor:pointer;
	}
	.toggle::before{
		content:"";
		position:absolute;
		top:3px;
		bottom:2.5px;
		left:8%;
		right:55%;
		border-radius:3px;
		background-color:#ffffff;
	}

	.toggle.active{
		box-shadow:inset 0px 2px 5px #1a4d00;
		background-color:#79a730;
		
		box-shadow:inset 0px 2px 5px #6D5016;
		background-color:#CC6646;
	}
	.toggle.t2.active{
		box-shadow:inset 0px 2px 5px #33000c;
		background-color:#ff1b50;
	}
	.toggle.active::before{
		left:55%;
		right:8%;
	}

	.cate_option_container{
		text-align:left;
		border-radius:5px;
		box-shadow:inset 0px 0px 0px 10px #d9f2f38c, 0px 0px 0px 1px #aadfe0;	
		padding:4px;
		margin-left:auto;

		box-shadow:none;
		background: rgba(212,187,138,0.2);
	}

	.cate_option_container select{
		margin:0px!important;
	}
	
	.del_box > div:nth-child(1){
		display:flex;
		justify-content:center;
		align-items:center;
		z-index:2000;
		position:absolute;
		right:120%;
		white-space:nowrap;
		top:0;
		bottom:0;
		font-weight:bold;
	}
	.del_box > div:nth-child(2){
		position:absolute;
		background-color:#333333;
		color:#ffffff;
		padding:0px;
		text-align:center;
		z-index:2000;
		top:0;
		left:0;
		right:0;
		bottom:0;
		z-index:2000;
		display:flex;
		align-items:center;
		justify-content:center;
		
		display: flex;
		gap: 3px; 
		white-space: nowrap
	}
	.del_box > div:nth-child(2) > div{
		width:40%;
		cursor:pointer;
		color:#aaaaaa;
		padding:10% 10%;
	}
	.del_box > div:nth-child(2) > div:nth-child(1):hover{
		background-color:#F33;
		color:#ffffff;
	}
	.del_box > div:nth-child(2) > div:hover{
		box-shadow:0px 1px 1px #6CC;
		color:#555;
		width:50%;
		padding:22% 10%;
		background-color:#3FC;
		border-radius:5px;
	}
	/*
	.del_box > div{
		position:fixed;
		background-color:#333333;
		color:#ffffff;
		padding:10px;
		left:35%;
		right:35%;
		bottom:55%;
		border-radius:10px;
		box-shadow:0px 0px 5px #333333;
		text-align:center;
		z-index:2000;
	}
	*/
	.del_box::before{
		content:"";
		position:fixed;
		width:100%;
		height:100%;
		top:0;
		left:0;
		background-color:#ffffff;
		opacity:0.93;
		z-index:1000;
	}

	.nav_config {
		width:210px;
		display:table!important;
		text-align:left;
	}
	.nav_config > div{
		width:100%;
		display:block;
	}
	.nav_config .option .current{
		background:none;
	}
	.data-input{
		/*width:100%;*/
		padding:0px!important;
		position:relative;
		font-size:0px;
		margin-bottom: 3px;
	}
	.data-input.short{
		display:inline-block;
		vertical-align:top;
		margin-bottom:0px;
		max-width:49%!important;
	}
	.data-input.b60{
		width:60%;
	}
	.lang_field_box .data-input{
		width:100%;
	}
	.data_container{
		position:relative;

	}
	.data_container:empty::before{
		content:"No Item";
		text-align:center;
		padding:20px;
		display:block;
	}

	.table_sheet{
		border-radius:5px;
		overflow:hidden;
		background-color:#fff;
		padding:10px;
		margin-top:-5px;

	}
	.table_list > tbody > tr:hover .table_sheet{
		box-shadow:inset 0px 0px 3px #dedede, inset 0px 0px 1px  #333;
	}
	.table_sheet > div{
		display:flex;
		align-items: stretch;
		flex-wrap: nowrap;
		overflow:hidden;
		border-bottom:.5px solid #dedede;
		padding:3px 0px;
	}
	.table_sheet > div:nth-child(1){
		padding-top:0px;
	}
	.table_sheet > div:nth-last-child(1){
		border-bottom:none!important;
		padding-bottom:0px;
	}

	.table_sheet > div > div{
		flex: 1 1 auto;
		vertical-align:top;
		flex-basis:40%;
	}
	.table_sheet > div > div:nth-child(1){
		color:#788B94;
	}
	.table_sheet > div > div:nth-last-child(1){
		text-align:right;
	}

	#new_info_box{
		text-align:center;
	}
	#new_info_box > div.but_general{
		padding:20px 50px!important;
		margin:auto;
		margin-top:20px!important;
		margin-bottom:20px!important;
	}
	#order_plan_list > div{
		position:relative;
		margin-bottom:10px;
		background-color:#ffffff;
	}
	#order_plan_list > div > div:nth-of-type(2){
		border-radius:5px;
		border:1px solid #dedede;
	}
	#order_plan_list > div:hover > div:nth-of-type(2){
		border:1px solid #daae09;
	}
	#order_plan_list > div > div:nth-of-type(2) > div{
		padding:10px;
	}
	#order_plan_list > div:hover .table_form > tbody > tr:hover {
		background-color:rgba(255,255,255,0.8);
	}
	#order_plan_list .header_box{
		border-radius:5px 5px 0px 0px;
		padding:12px 15px 10px!important;
		background-color:rgba(232,241,240,0.7);
		background-color:rgba(244,237,224,0.7);
		color:#ffffff;
		font-size:16px;
		color:#7fa7a2;
		color:#6D5016;
		line-height:27px;
	}
	.tag_circle{
		padding: 5px 12px;
		background-color: #ed5565;
		color: #fff;
		font-size: 15px;
		line-height: 15px;
		width: fit-content;
		border-radius: 10px;
	}
	.tag_circle_small{
		padding: 4px 7px;
		background-color: #ed5565;
		color: #fff;
		font-size: 10px;
		line-height: 10px;
		width: fit-content;
		border-radius: 5px;
	}
	#order_plan_list > div:hover .header_box{
		opacity:1;
		color:#222222;
		background-color:#ffef5c;
	}
	#order_plan_list .details_box{
		display:flex;
		align-items: stretch;
		flex-wrap: nowrap;
	}
	#order_plan_list .details_box > div{
		margin:0px 0px;
		vertical-align:top;

	}
	#order_plan_list .details_box > div:nth-child(1){
		flex-basis:100%;
		margin-right:5px;
	}
	#order_plan_list .details_box > div:nth-child(2) .table_form > tbody > tr >td:nth-of-type(1){
		width:120px!important;
	}
	#order_plan_list .details_box > div:nth-child(2) .table_form > tbody > tr >td:nth-of-type(2){
		width:200px!important;
	}
	#order_plan_list .list_action{
		top:2px;
		right:-10px;
		margin:0px;
		left:auto;
		z-index:10;
		opacity:0;
		visibility:hidden;
		background-color:#ffffff;
		padding:5px;
		border-radius:100%;
		box-shadow:0px 1px 2px #aaaaaa!important;
		border:1px solid transparent;
	}
	#order_plan_list .list_action:hover{
		border:1px solid #daae09;
	}
	#order_plan_list .list_action > div{
		margin-left:0px;
	}
	#order_plan_list > div:hover .list_action{
		right:-28px;
		opacity:1;
		visibility:visible;
		box-shadow:0px 0px 5px #dedede;

	}
	#account_info_box:empty{
		display:flex;
		justify-content:center;
		align-items:center;
	}
	#account_info_box .account_no, .account_no{
		margin-bottom:5px;
		font-size:11px;
		border-radius:0px 3px 3px 0px;
		display:table;
		padding:4px 10px 3px;
		line-height:10px;
		background-color:#008896;
		color:#ffffff;
		border-left:4px solid #00e8a9;
		
		background-color:#C6A563;
		border-left:4px solid #F6CF73;
	}
	#account_info_box .sap_account_no, .sap_account_no{
		margin-bottom:5px;
		font-size:11px;
		border-radius:0px 3px 3px 0px;
		display:table;
		padding:4px 10px 3px;
		line-height:10px;
		background-color:#ed5565;
		color:#ffffff;
		border-left:4px solid #f1949e;
		
		background-color:#CC6646;
		border-left:4px solid #F88764;
	}
	#account_info_box .account_name{
		font-size:15px;
		margin-bottom:10px;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		color:#309684;
		color:#6D5016;
		font-weight:400;
	}
	.account_name{
		font-size:12px;
		margin-bottom:3px;
	}
	.table_list .account_name{
		font-size:12px;
		margin-top:8px;
		color:#309684;
		color:#6D5016;
	}
	.table_list .title{
		font-size:15px;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-weight:400;
		color:#35988a;
	}
	#account_info_box{
		display:flex;
		justify-content: space-between;
	}
	#account_info_box .account_address{
		font-size:11px;
	}
	#account_info_box .country{
		background-color:#9dacb3;
		padding:2px 7px;
		text-transform:uppercase;
		color:#fff;
		border-radius:3px;
		margin-bottom:5px;
		display:table;
	}
	#account_info_box .contact_name{
		font-size:13px;
	}

	.aidc_box{
		position:absolute;
		right:10px;
		top:15px;
		border-radius:5px;
		box-shadow:0px 0px 5px #dedede;
		font-size:9px;
		overflow:hidden;
		text-transform:uppercase;
	}
	.aidc_box > div{
		display:inline-block;
		padding:3px 5px 2px;
		font-family: 'Julius Sans One', sans-serif;
	}
	.aidc_box > div:nth-child(1){
		background-color:#01445e;
		color:#16fbfb;
		padding-left:8px;
	}
	.aidc_box > div:nth-child(2){

		background-color:#00a9ba;
		color:#ffffff;
		padding-right:8px;
	}

	/* ///////////////////////////////////////////////////////////////////////////////////////////
	FILE UPLOAD/////////////////////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////////////////////*/

	.file_browse_box .msg{
		float:left;
		padding:9px 15px;
		margin-right:5px;
		background-color:#333333;
		color:#ffffff;
		border-radius:5px;
		font-size:11px;
	}

	.file_box{
		position:relative;
		padding:0px!important;
	}
	.file_box.in_progress{
		pointer-events:none;
	}
	.file_field{
		width:0px;
		height:0px;
		overflow:hidden;
		position:absolute;
		z-index:-1;
		opacity:0;
	}
	.file_box.list_active .file_field:not([multiple]) + .file_label{
		display:none!important;
	}
	.file_label{
		padding:10px 10px 15px!important;
		text-align:center;
		margin:0px!important;
		background:none!important;
		box-shadow:none!important;
		display:block!important;
		border-radius:5px!important;
	}
	.but_general:not(.control).file_label{
		color:#333333!important;
		margin:0px!important;
		box-shadow:none!important;
	}

	.file_label:hover{
		margin:0px!important;
		margin-top:0px!important;
	}
	.file_box.list_active .file_label{
		box-shadow:0px 0px 5px #bcbcbc!important;
		box-shadow:0px 1px 2px #bcbcbc,inset 0px 2px 2px #bcbcbc!important;
		background-color:#ffffff!important;
		position:absolute;
		right:0px;
		padding:0px 5px!important;
		margin:10px 15px!important;
	}

	.file_box.list_active .file_label:hover{
		box-shadow:0px 1px 0px #3ea4df,0px 1px 2px #91ccdb,inset 0px 2px 2px #91ccdb!important;
		box-shadow:0px 1px 0px #F6CF73,0px 1px 2px #F2E07D,inset 0px 2px 2px #F2E07D!important;
		margin-top:11px!important;

	}
	.file_box.list_active .file_label .material-icons{
		font-size:18px!important;
		padding-top:2.5px;
		transition:all 0s;
	}
	.file_box.list_active .file_label:hover .material-icons{
		color:#3ea4df!important;
		color:#957B73!important;
	}

	.file_label .message{
		opacity:1;
		max-height:100px;
		max-width:800;
	}

	.file_box.in_progress .file_label .message, .file_box.list_active .file_label .message{
		opacity:0;
		max-height:0px;
		max-width:0px;
		overflow:hidden;

	}
	.drop_box{
		transition: all 0s border 0.5s;
		border:10px solid transparent;
		/* top, right, bottom, left
		background: linear-gradient(to right, #ccc 55%, transparent 0%) top/15px 1px repeat-x,
		linear-gradient(#ccc 55%, transparent 0%) right/1px 15px repeat-y, 
		linear-gradient(to right, #ccc 55%, transparent 0%) bottom/15px 1px repeat-x,
		linear-gradient(#ccc 55%, transparent 0%) left/1px 15px repeat-y;
		*/
		background-color:#f7fdfd;
		background-color:#F9F6EF;
		border-radius:5px;
		text-align:center;
		position:relative;
		overflow:hidden;
	}
	.drop_box:hover{
		border-color:#d1eceb!important;
		border-color:#F2E4C9!important;
		box-shadow:inset 0px 0px 10px #ffffff;
	}
	.drop_box > div{
		padding:30px;
	}
	.drop_box.dragging_in{
		background: linear-gradient(to right, #d69c45 55%, #fff16e 0%) top/15px 1px repeat-x, /* top */
		linear-gradient(#d69c45 55%, #fff16e 0%) right/1px 15px repeat-y, /* right */
		linear-gradient(to right, #d69c45 55%, #fff16e 0%) bottom/15px 1px repeat-x, /* bottom */
		linear-gradient(#d69c45 55%, #fff16e 0%) left/1px 15px repeat-y; /* left */
		background-color:#fff16e;
		border:10px solid #fff16e;
	}
	.file_box .file_list_box{
		display:none;
		padding:10px 15px;
	}
	.file_box.list_active .file_list_box{
		display:block;
	}

	.file_box .list_header{
		padding:5px 0px;
		margin-bottom:5px;
		padding-right:35px;
		font-size:15px;
		text-align:left;
	}
	.file_box[multiple] .file_list.tile{
		max-height:370px;
	}

	.file_box[multiple] .file_list.row{
		max-height:220px;
	}
	.file_box .file_list.tile{
		overflow:auto;
	}
	.file_box .file_list > div{
		display:inline-block;
		vertical-align:top;
		width:100px;
		box-sizing:content-box;
		position:relative;
		padding:10px;
		border-radius:5px;
		border:1px solid transparent;
		margin-top:3px;
		margin-bottom:3px;
		clear:both;
		background-color:#ffffff;
	}
	.file_box .file_list.one > div{
		box-shadow:0px 0px 1px 1px #abd6cf, 0px 0px 1px 5px #d0e2df;
		box-shadow:0px 0px 1px 1px #F2E4C9, 0px 0px 1px 5px #F4EDE0;
	}
	.file_box .file_list > div:hover{
		background-color:#ffffff!important;
		box-shadow:inset 0px 0px 10px #ffffff, 0px 0px 0px 1px #009588;
		box-shadow:inset 0px 0px 10px #ffffff, 0px 0px 0px 1px #C6A563;
		border:1px solid transparent!important;
	}
	.file_box .file_list.row, .file_box .file_list.tile{
		text-align:left;
	}
	.file_box .file_list.row > div, .file_box .file_list.tile > div{
		background-color:#e4f0f1;
	}
	.file_box .file_list.row > div{
		display:block;
		width:100%;
		box-sizing:border-box;
	}
	.file_box .file_list.tile > div{
		width:33%;
		box-sizing:border-box;
	}

	* + html .file_box .file_list > div{
		display:inline;
	}

	* html .file_box .file_list > div{
		display:inline;
	}
	.file_box .file_list > div.unsupported::before{
		content:attr(data-unsupported);
		position:absolute;
		top:0;
		bottom:0;
		left:0;
		right:0;
		background-color:#002d27ed;
		z-index:1;
		color:#6eff00;
		display:flex;
		justify-content:center;
		align-items:center;
	}

	.file_box .file_list > div > div:nth-last-child(1)::after{
		content:"";
		display:block;
		clear:both;


	}

	.file_box .file_list > div .list_action{
		content:"";
		position:absolute;
		top:1px;
		right:1px;
		left:1px;
		bottom:1px;
		padding:10px 0px;
		z-index:10;
		opacity:0;
		border-radius:5px;
		overflow:hidden;
		max-width:0px;
	}
	.file_box .file_list > div .list_action > div{
		display:block;
		margin:0px!important;
		margin-bottom:3px!important;
	}
	.file_box .file_list > div .list_action > div.but_general{
		background:#222222!important;
		box-shadow:none!important;
		color:#31fbc8!important;

		background:#000000!important;
		color:#F2E07D!important;
	}
	.file_box .file_list > div .list_action > div.but_general:hover{
		background:#31fbc8!important;
		color:#333333!important;

		background:#C6A563!important;
		color:#ffffff!important;
	}
	.file_box .file_list > div .list_action > div:nth-of-type(1){
		margin-left:0px;
	}

	.file_box .file_list > div:hover .list_action{
		opacity:1;
		padding:8px;
		max-width:350px;
	}
	.file_box .file_list .but_delete::before, .file_box .file_list .but_delete::after{
		background-color:#ffffff;
		width:6%;
	}


	.file_box .file_list > div:hover .thumb{
		cursor:pointer;
	}
	.file_box .file_list.tile > div:hover .list_action, .file_box .file_list > div:hover .list_action{
		background-color:#2B363Bd9!important;
	}
	.file_box .list_selection.all{
		right:50px;
		padding:0px;
	}
	.file_box .list_selection{
		width:inherit;
		height:inherit;
		transform:none;
		right:10px;
	}

	.file_box > div.list_selection.all{
		display:none;
	}
	.file_box.list_active > div.list_selection.all{
		display:block;
		margin-right:0px;
	}

	.file_box .file_list .list_selection{
		position:static;
	}
	.file_box .checkbox{
		margin-right:0px;
	}
	.file_box .file_list .checkbox{
		margin-top:0px;
		margin-right:0px;
		margin-bottom:0px;
	}

	.file_box .file_list .checkbox.active{
		margin-left:0px;
	}
	.file_box .file_list > div:hover .checkbox, .file_box.list_active:hover > div.list_selection.all .checkbox{
		box-shadow:0px 0px 0px 1px #aaaaaa;
		opacity:1;

	}
	.file_box .file_list > div:hover .thumb:not([data-action-label=''])::before{
		box-shadow:none;
		opacity:1;
		background-color:rgba(1,1,1,0.9);
		border:none;
		top:50%;

	}
	.file_box .file_list > div .thumb{

		background-color:#ffffff;
		width:100%;
		height:100px;
		display:flex;
		justify-content:center;
		align-items:center;
		margin-bottom:5px;
		position:relative;
		box-shadow:0px 2px 5px 0px #cdcdcd;
	}

	.file_box .file_list.row > div .thumb, .file_box .file_list.tile > div .thumb{
		float:left;
		margin-bottom:0px;
		margin-right:10px;
	}

	.file_box .file_list.tile > div .thumb{
		width:100px;
	}
	.file_box .file_list.row > div .thumb{
		width:50px;
		height:45px;
	}
	.file_box .file_list > div .thumb:not([data-action-label=''])::before{
		position:absolute;
		/*content:attr(data-action-label);*/
		top:40%;
		left:50%;
		transform: translateY(-50%) translateX(-50%);
		border-radius:15px;
		padding:5px 10px;
		color:#ffffff;
		display:flex;
		opacity:0;
		justify-content:center;
		align-items:center;
		z-index:10;
	}
	.file_box .file_list .unit:not([file-type=image]) .thumb{

		box-shadow:0px 0px 0px 1px #99bab5, 0px 2px 5px 0px #cdcdcd;
		box-shadow:0px 0px 0px 1px #f2e07d, 0px 2px 5px 0px #cdcdcd;
		box-shadow:0px 0px 0px 1px #f2e07d, 0px 2px 5px 0px #cdcdcd;
		/*background: linear-gradient(to bottom right, #419989 0%, #33655a 50%,#004d57 100%);*/
	}


	.file_box .file_list.tile .unit[file-type=image] .thumb{
		background: linear-gradient(to bottom right, #003228 0%, #00262a 50%,#00262a 100%);
		box-shadow:0px 0px 0px 1px #34524d, 0px 2px 5px 0px #cdcdcd;
	}
	.file_box .file_list .unit[file-type=image] .thumb{
		box-shadow:0px 0px 0px 1px #dedede, 0px 2px 5px 0px #cdcdcd;
	}
	.file_box .file_list .unit:not([file-type=image]) .thumb::after{
		content:"";
		position:absolute;
		top:0;
		bottom:0;
		left:0;
		right:0;
		/*background:url('../images/icon/file_icon.png') no-repeat center center;*/
		background:url('../images/common/icon/OSOS_file_icon.svg') no-repeat center center;
		background-size:50%;
	}

	.file_box .file_list .unit[file-type=image]:hover .thumb img{
		opacity:0.4;
	}
	.file_box .file_list.one .unit[file-type=image] .thumb{
		box-shadow:none;
	}
	.file_box .file_list > div .file_info{
		text-align:left;
		padding:5px 0px;
	}
	.file_box .file_list.row > div .file_info, .file_box .file_list.tile > div .file_info{
		padding:0px;
	}
	.file_box .file_list > div .file_info > div{
		margin-bottom:3px;
	}

	.file_box .file_list > div .file_info .but_general{
		background:linear-gradient(to bottom right, #92cec6  6%,#3795ab 40%,#166758 80%);
		color:#ffffff!important;
	}

	.file_box .file_list img{
		max-width:100%;
		max-height:100%;
	}
	.file_box .file_list .name{
		text-overflow:ellipsis;
		overflow:hidden;
		white-space:nowrap;
		padding:5px 0px 5px;
	}
	.file_box .file_list .property > div{
		display:inline-block;
		padding:3px 5px 2px;
		font-size:11px;
		color:#ffffff;
		background-color:#a9bec0;
		background-color:#788B94;
		border-radius:3px;
		margin-right:3px;
	}

	.file_box .file_list .type{ /*COMMON TYPE*/
		background-color:#616265!important;
		text-transform:uppercase;
	}
	.file_box .file_list > div[file-type=image] .type{
		background-color:#ffc800!important;
	}
	.file_box .file_list.one > div[file-type=image] .name{
		display:none;
	}
	.file_box .file_list.one > div .file_info{
		text-align:center;
	}
	.file_box .progress_box{
		width:100%;
		padding:0px;
		border-radius:5px;
		position:absolute;
		top:0px;
		bottom:0%;
		padding:5px;
		overflow:hidden;
		display:none;
		z-index:1;
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,bottom 0s ease 0s;
	}
	.file_box .progress_box::before{
		content:"";
		position:absolute;
		z-index:-1;
		top:0px;
		bottom:0px;
		left:0px;
		width:100%;
		padding:0px;
		background-color:rgba(17,33,29,0.7);
		opacity:0;
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,opacity 0.1s ease 0s;
	}
	.file_box .progress_box.active::before{
		opacity:1;
	}
	.file_box .progress_box.complete::before{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,opacity 0.5s ease 2s;
		opacity:0;
	}
	.file_box .progress_box.active, .file_box .progress_box.complete{
		opacity:1;
		display:block;
		z-index:1;
	}
	.file_box .progress_box.active{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,bottom 0.5s ease 3s;
	}
	.file_box .progress_box.complete{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s,bottom 0.5s ease 3s;
		bottom:100%;
	}
	.file_box .progress_box.active .bar{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s, width 2s, margin-top 0s ease 0s;
	}
	.file_box .progress_box.complete .bar{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s, width 2s,margin-top 0.5s ease 2s!important;
		margin-top:-100px;
	}

	.file_box .progress_box .bar{
		transition: all 0.5s ease 0s,color 0.3s,margin-right 0s, width 0s,margin-top 0s;
		background-color:rgba(53, 62, 59, 0.71);
		background: linear-gradient(to bottom, #0bffeb  0%,#33eeb0 100%); /* W3C */
		border-radius:3px;
		overflow:hidden;
		font-size:13px;
		color:#00fdff;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		box-shadow:0px 0px 5px #000000;
		margin:auto;
		margin-top:20px;
		width:80%;
		position:relative;
		height:20px;
	}
	.file_box .progress_box.active .bar::before{
		position:absolute;
		content:"";
		width:20%;
		border-radius:5px;
		height:500px;
		animation:ani_loading_bar 4s infinite;
		transform:rotate(30deg) translateY(-50%);
		background:linear-gradient(to right, transparent 60%, rgba(255, 255, 255, 0.9) 0%) 0px 0px/50px 100%
	}

	@keyframes ani_loading_bar{
		0% {left:-35%; /* W3C */}
		100% {left:90% /* W3C */}

	}
	.file_box .progress_box .bar > div{
		width:100%;
		left:-100%;
		position:absolute;
		top:0px;
		bottom:0px;
		border-right:2px solid #fff710;
		margin-top:0px;
		display:flex;
		justify-content:flex-end;
		align-items:center;
		border-radius:3px;
		padding:0px;
		padding-left: 15px;
		padding-right:15px;
		background-color:rgba(91,245,220,0.7);
		background-color:rgba(50, 196, 176, 0.9);
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */

		box-shadow:0px 0px 50px 0px #000000,0px 0px 50px 0px #000000;
		overflow:hidden;
	}
	.file_box .progress_box .info{
		color:#675825;
		font-weight:600;
		font-size:13px;
	}
	.file_box .progress_box .bar > div::after{
		content:"";
		right:3px;
		top:3px;
		bottom:3px;
		width:3px;
		position:absolute;
		background-color:#00fdff;
		background-color:#00096f;
		border-radius:3px;
		-webkit-animation:uploading_indicator 1.5s infinite;
		animation:uploading_indicator 1.5s infinite;
	}

	@-webkit-keyframes uploading_indicator{
		0% {bottom:3px;top:3px;}
		50% {bottom:30px;top:3px;}
		75% {bottom:3px;top:30px;}
		100% {bottom:3px;top:3px;}
	}
	@keyframes uploading_indicator{
		0% {bottom:3px;top:3px;}
		50% {bottom:30px;top:3px;}
		75% {bottom:3px;top:30px;}
		100% {bottom:3px;top:3px;}

	}
	.file_box .progress_box.active .bar > div, .file_box .progress_box.complete .bar > div{
		padding-left: 15px;
		padding-right:15px;
	}
	/* FILE UPLOAD END //////////////////////////////////////////////////////////////////
	///////////////////////////////////////////////////////////////////////////////////*/

	.quick_add_bar{
		display:flex!important;
		align-items: stretch;
		flex-wrap: wrap;
		width:100%;
		background-color:#87b7b5;
		box-shadow:inset 0px 1px 1px #0d696b,inset 0px 3px 3px #689798;
		box-shadow:inset 0px 2px 2px #0d696b, inset 0px 1px 2px #689798, inset 30px 30px 50px 0px #bce6de;
		border-radius:8px;
		padding:10px;
		
		background-color:#D4BB8A;
		box-shadow:inset 0px 2px 2px #6D5016, inset 0px 1px 2px #D4BB8A, inset 30px 30px 50px 0px #F4EDE0;
	}

	.quick_add_bar > div{
		flex:1 1 auto;
		margin-right:3px;
	}

	.quick_add_bar > div > div{
		display:flex;
		align-items:start;
		margin-bottom:2px;
	}
	.quick_add_bar > div > div > div{
		margin-right:3px;
		margin-bottom:0px;
	}
	.quick_add_bar > div > div > div:nth-last-child(1){
		flex-grow:1;
	}
	.quick_add_bar > div:nth-last-child(1), .quick_add_bar > div > div:nth-last-child(1),.quick_add_bar > div > div > div:nth-last-child(1){
		margin:0px!important;
	}
	.quick_add_bar > div:nth-last-child(1){
		flex-grow:0;
		flex-basis:70px!important;
	}
	.quick_add_bar .option .current{
		padding-top:8px;
		padding-bottom:6px;
	}
	.quick_add_bar input[type=text]{
		padding-top:7px;
		padding-bottom:5px;
		line-height:18px;
	}
	.quick_add_bar .option .current,.quick_add_bar input[type=text]{
		border:none;
		box-shadow:inset 0px 1px 1px #4f8184;
		box-shadow:inset 0px 1px 1px #957B73;
	}
	.quick_add_bar input[type=text]:focus{
		border:none!important;
		background-color:#fdffe5!important;
		box-shadow:inset 0px 2px 3px #316c6f!important;
		
		background-color:#F9F6EF!important;
		box-shadow:inset 0px 2px 3px #6D5016!important;
	}
	.quick_add_bar .lang_field_box > div{
		flex-grow:2;
	}
	.quick_add_bar .material-icons{
		align-items:center;
		justify-content:center;
		display:flex;
		background:linear-gradient(to bottom right, #019891 0%,#000000 100%);
		background:linear-gradient(to bottom right, #3dcb95 0%,#3d97cb 30%,#100d74 100%);
		background:linear-gradient(to bottom right, #eaf545 0%,#00a778 40%,#2d4075 80%);
		background:linear-gradient(to bottom right, #F7D273 0%,#DDA24A 30%,#CC6646 100%);
		color: #fff!important;
	}
	.quick_add_bar .but_general.material-icons{
		color:#ffffff!important;
		box-shadow:0px 1px 1px #333!important;
		padding:2px!important;
		margin-top:-1px!important
	}
	.quick_add_bar .but_general.material-icons:hover{
		padding-top:2.5px!important;
		padding-bottom:2px!important;margin-top:0px!important;
	}

	.drag_list .unit:hover{
		cursor:move;
	}
	.drag_list .dragging{
		opacity:1;
		border:2px dashed #ffd200!important;
		border-radius:5px;
		background-color:#fff710;
		color:#6f3600;
		margin-top:10px!important;
		margin-bottom:10px!important;

	}
	.drag_list .dragging:hover{
		background-color:transparent;
	}

	.drag_list .dragging_unit{
		border:1px dashed #666666!important;
		margin:0px!important;
		padding:0px!important;
		opacity:1!important;
		pointer-events: none;
		position:absolute;
		z-index:10000;
	}
	.drag_list .hl{
		margin:5px 0px;
	} 

	.restricted_layer{
		position:fixed;
		z-index:10000;
		top:70%;
		bottom:30%;
		left:0%;
		right:0%;
		opacity:0;
		background-color:#00100dd9;
		color:#00ffd0;
		display:flex;
		justify-content:center;
		align-items:center;
		text-align:center;
		flex-direction:column;
		max-height:0%;
		overflow:hidden;
		line-height:20px;
	}
	.restricted_layer.active{
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		opacity:1;
		max-height:100%;
	}

	.restricted_layer .msgbox > div:nth-child(1){
		font-size:20px;
		font-family:"Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		margin-top:10px;
		margin-bottom:10px;
	}

	.restricted_layer .msgbox > div:nth-last-of-type(1){
		color:#7a9092;
	}

	.slider{
		padding:20px 0px;
		position:relative;
	}
	.slider > div:nth-child(1).dragging{
		margin-bottom:1px;
		box-shadow:0px 0px 1px 2px #00564e, 0px 1px 1px 2px #00564e!important;
		cursor:move;
	}
	.slider > div:nth-child(1):hover{
		box-shadow:0px 0px 1px 2px #00564e;
		cursor:w-resize!important;
	}
	.slider:hover > div:nth-child(2){
		box-shadow:inset 0px 3px 3px #dedede, 0px 0px 0px 1.5px #33eeb0;
	}
	.slider > div:nth-child(1){
		position:absolute;
		height:18px;
		width:18px;
		border-radius:50%;
		background:linear-gradient(to bottom right, #ffffff 0%,#9de6d1 75%,#177b80 80%);
		background:linear-gradient(to bottom right, #ffffff 50%,#bdf5e5 79%,#177b80 80%);
		top:50%;
		transform:translateY(-50%);
		z-index:100;
		box-shadow:0px 0px 1px 1px #00564e;
		transition:none;
		right:calc(0% + 18px);
	}
	.slider > div:nth-child(2){
		position:absolute;
		height:20px;
		width:100%;
		background-color:#efefef;
		border-radius:10px;
		top:50%;
		transform:translateY(-50%);
		box-shadow:inset 0px 3px 3px #dedede;
		overflow:hidden;
	}
	.slider > div:nth-child(2) > div{
		position:absolute;
		width:0%;
		background-color:#6ae4ce;
		background:linear-gradient(to left, #00ffc4 50%,#00bfd2 100%);
		box-shadow:inset 0px 3px 8px 6px #38d4b0;
		box-shadow:inset 0px 3px 5px 5px #1cefbe;
		top:0px;
		bottom:0px;
		transition:none;
	}
	.outbound_testoutbox{
		position:absolute;
		top:45px;
		right:10px;
		left:10px;
		opacity:0;
		z-index:1;
	}

	.outbound_testoutbox > div{
		border-top:3px solid #ea0082;
		border-top:3px solid #31e1c0;
		border-bottom:3px solid #ffe600;
		background-color:#ffffff;
		border-radius:5px;
		box-shadow:0px 0px 3px #dedede;
		padding:0px;
		overflow:hidden;
		max-height:0px;
	}
	.outbound_testoutbox.active{
		opacity:1;
	}
	.outbound_testoutbox.active > div{
		max-height:250px;
		padding:10px;
	}
	.outbound_testoutbox::before{
		content:"";
		position:absolute;
		top:0px;	
		z-index:10;
		border:0px solid transparent;
		border-bottom:7px solid #ea0082;
		border-bottom:7px solid #31e1c0;
		width:0px;
		margin-top:-6px;
		right:0px;
	}
	.outbound_testoutbox.active::before{
		border:7px solid transparent;
		border-bottom:7px solid #ea0082;
		border-bottom:7px solid #31e1c0;
		width:75px;
		margin-top:-13px;
		right:170px; /*105px*/
	}
	.outbound_testoutbox.processing::before{
		border:0px!important;
		content:"Processing";
		position:absolute;
		font-size:20px;
		font-family:'Montserrat',chinese;
		border-radius:5px;
		background-color:#000000;
		opacity:0.85;
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		width:auto!important;
		margin-top:0px;
		color:#03ffb9;
		display:flex;
		justify-content:center;
		align-items:center;
	}
	.outbound_testoutbox .opt_config > div:nth-last-of-type(1){
		flex-grow:0;
	}
	.outbound_testoutbox .opt_config > div:nth-last-of-type(1) .but_general{
		width:100%!important;
		text-align:center;
	}
	.outbound_testoutbox .but_general.send{
		background-color:#35abb9!important;
		background:linear-gradient(to bottom right, #ffe000 0%,#fb00a2 40%,#80174c 80%);
		color:#ffffff!important;
		padding-top:20px!important;
		padding-bottom:20px!important;
	}

	.outbound_testoutbox .but_general{
		/*
		background-color:#35abb9!important;
		background:linear-gradient(to bottom right, #666 0%,#555 40%,#222 80%);
		color:#ffffff!important;
		*/
	}
	.outbound_testoutbox .testout_totalbox{
		font-size:30px;text-align:center;
		padding:18px 20px 12px;
		font-family:'Montserrat',chinese;
	}
	.outbound_testoutbox .testout_totalbox > div:nth-of-type(2){
		font-size:12px;
	}

	.outbound_scheduler_statsbox > div:nth-child(2){
		width:50%;
	}
	.outbound_scheduler_statsbox > div:nth-child(2) > div{
		margin-left:25px;
	}
	.outbound_scheduler_statsbox .flex > div,.outbound_scheduler_statsbox.flex > div{
		flex:1 1 auto;
	}
	.outbound_scheduler_statsbox .flex > div{
		text-align:right;
	}
	.outbound_credit{
		font-family:'Montserrat',chinese;
		font-size:15px!important;
		background-color:#0d3c32;
		background:linear-gradient(to left, #b5c100 0%,#00bfd2 100%);
		color:#ffffff;
		padding:5px 15px;
		border-radius:10px;
		margin-bottom:0px!important;
	}

	.outbound_percentage_controlbox{
		font-size: 10px;
		font-weight: 500;
		max-height: 50px;
		overflow: hidden;
		border-radius: 0px 0px 20px 20px;
		padding: 2px 20px 2px 30px!important;
		justify-content: center;
		align-items: center;
		text-align: center;
		position: absolute;
		right: 50%;
		transform: translateX(50%);
		color: #0c7a80;
		background-color:#005d58;

		color:#ffffff;
		border:1px solid #ffffff;
		display: flex;
		cursor:pointer;
		border-top-width:0px;
		opacity:1;
	}
	.outbound_percentage_controlbox:hover{
		background-color:#024236;
		background:linear-gradient(to bottom, #002121 0%,#00616b 50%,#009dad 100%);
		border: 1px solid #ffffff;
		border-top-width:0px;
		color:#fff;	

	}
	.outbound_percentage_controlbox > div:nth-of-type(1){
		font-size: 14px;
		margin-right:5px;
	}

	.outbound_percentage_controlbox > div:nth-last-of-type(1){
		opacity:1;
		max-width:30px;
		margin-left:15px;
	}
	.outbound_percentage_controlbox.hidden{
		opacity:0;
		top:60px;
		padding: 2px 20px 2px 30px!important;
	}
	.outbound_percentage_controlbox.readonly{
		padding: 2px 30px 2px 30px!important;
		color: #0c7a80;
		background-color:#ffffff;
		border: 1px solid #0ccea1;
		border-top-width:0px;
	}
	.outbound_percentage_controlbox.readonly > div:nth-last-of-type(1){
		opacity:0;
		max-width:0px;
		margin-left:0px;
	}

	.outbound_runner > div{
		border-left:5px solid #33eeb0!important;
		border-right-width:0px!important;
		border-top:0px!important;
	}
	.outbound_runner > div:not([status=draft]):hover{
		border-left-width:0px!important;
		border-right:5px solid #ee338a!important;
	}
	.outbound_runner > div[status=draft]:hover{
		border-left-width:0px!important;
		border-right:35px solid #f5f2f3!important;
		box-shadow:5px 0px 0px #ee338a,0px 0px 5px #efefef!important;
	}
	.outbound_runner > div:hover .target_infobox{
		border-right:1px solid #33eeb0!important;
	}
	.outbound_runner > div:hover .targeted_no{
		background-color:#8a0945;
		background:linear-gradient(to left, #8d0545 0%,#ee338a 100%);
	}
	.outbound_runner > div:hover .percentage{
		color:#ee338a;
	}
	.outbound_runner > div:hover > div:nth-child(1){
		color:#ee338a!important;
		text-shadow:0px 1px 2px #b5c7c7;
	}
	.outbound_runner > div[status=draft]:hover .action_box{
		opacity:1;
		pointer-events: all;
	}
	.outbound_runner > div:hover .scheduler_switch{
		border-color:#cedad6;
	}
	.outbound_runner > div > div:nth-child(1){
		color:#00585d!important;
		text-shadow:0px 1px 2px #9aeaea;
		font-size:25px!important;
		line-height:18px;
		font-weight:400!important;
		align-items:center!important;
	}
	.outbound_runner .action_box{
		position:absolute;
		right:-40px;
		opacity:0;
		cursor:pointer;
		pointer-events: none;
	}

	.outbound_runner .action_box > div{
		background-color:#fff;
	}

	.outbound_runner .scheduler_switch{
		border:4px solid #dfe8ea;
		border-radius:9px
	}
	.outbound_runner .target_infobox{
		margin-right:15px;
		padding-right:15px;
		border-right:1px solid #d5e6e1;
		width:50%;
	}
	.outbound_runner .target_infobox > div:nth-child(1){
		font-family:'Montserrat',chinese;
		margin-bottom:5px;
		padding-bottom:5px;
	}
	.outbound_runner .target_infobox > div:nth-child(2){
		clear:both;
		position:relative;
	}
	.outbound_runner .target_infobox > div:nth-child(2) .flex{
		margin:5px 0px;
	}
	.outbound_runner .target_infobox > div:nth-child(2) .flex > div{
		flex:inherit;
		flex-basis:50px;
		white-space: nowrap;
		text-align:right;
	}

	.outbound_runner .target_infobox > div:nth-child(2) .flex > div:nth-child(1){
		flex:1 1 0;
		text-align:left;
	}
	.outbound_runner .target_infobox > div:nth-child(2) .flex > div:nth-last-child(1){
		text-align:right;
	}
	.outbound_runner .target_infobox > div:nth-child(2) > div:nth-child(1){
		margin-bottom:5px;
		padding-bottom:5px;
		font-size:11px;
		border-bottom:0.5px solid #dedede;
	}
	.outbound_runner .percentage{
		color:#33eeb0;/*#cddad8;*/
		font-size:46px;
		float:right;
		line-height:36px;
		padding-right:35px;
		margin-top:6px;
	}
	.outbound_runner .percentage::after{
		font-size:26px;
		line-height:23px;
		top:inherit!important;
		font-weight:200;

	}
	.outbound_runner .targeted_no{
		overflow:hidden;
		padding:7px 15px;
		background-color:#10c1b1;
		color:#ffffff;
		border-radius:15px;
		display:table;
		text-align:center;
	}
	.outbound_runner .targeted_no > div:nth-child(1){
		font-size:25px;line-height:25px;
	}

	.outbound_runner .targeted_no > div:nth-child(2){
		font-size:13px;
		line-height:13px;
	}
	.outbound_runner .status{
		font-size:11px;
		padding:2px 30px;
		margin-top:0px;
		position:absolute;
		opacity:1;
		top:50%;
		left:50%;
		transform:translateY(-50%) translateX(-50%);
	}
	.outbound_runner .readonly .slider > div:nth-child(1){
		opacity:0;
	}
	.outbound_runner .status.draft{
		opacity:0;
	}
	.outbound_runner .status.scheduled{
		background-color:#586869;
	}
	.outbound_runner .readonly .dtpicker{
		border:none;
	}

	.dtpicker{
		box-shadow:0px 0px 0px 0.5px #dedede;
		border-radius:10px;
		border-radius:3px;
		padding:0px 5px;
		position:relative;
		cursor:pointer;
		max-width:inherit!important;
	}
	.dtpicker:hover{
		box-shadow:0px 0px 0px 0.5px #00c1b8;
		box-shadow:0px 0px 0px 0.5px #C6A563;
	}
	.dtpicker .material-icons{
		position:absolute!important;
		top:50%;
		left:10px;
		transform:translateY(-50%);
		font-size:15px!important;
	}
	.dtpicker:hover .material-icons{
		color:#00c1b8;
		color:#C6A563;
	}

	.datasec_container .action_box .dtpicker input, .dtpicker input{
		border:none!important;
		background:#ffffff!important;
		cursor:pointer;
		border-radius:10px;
		border-radius:3px;
		padding-left:30px!important;
	}
	.dtpicker.v2 input{
		padding:10px 5px;
		border:none!important;
		background:transparent!important;
		box-shadow:none;
		font-size:12px;
		font-family:'Montserrat',chinese;
		cursor:pointer;
	}
	.dtpicker:hover input{
		color:#00c1b8!important;
		color:#C6A563!important;
	}
	.dtpicker input:focus{
		box-shadow:none!important;
		background-color:none!important;
	}

	.user_activation, .datasec_container .user_activation{
		flex-basis:35px!important;
		font-size:20px!important;
		display:flex!important;
		color:#dedede;
	}
	.user_activation.activated{
		color:#3ab98a;
	}
	.target_summary_box{
		display:flex;
		justify-content: space-between;
		align-items:center;
		padding:20px;
	}
	.target_summary_box > div:nth-of-type(2){
		padding-left:10px;
	}
	.target_summary_box > div:nth-of-type(1){
		width:150px;
		height:150px;
		border-radius:50%;
		border:20px solid #b6d6cd2e/*#ffeb00*/;
		position:relative;
		font-family:Montserrat,chinese;
	}
	.target_summary_box > div:nth-of-type(1) .eligible_count{
		font-size:40px;
		color:#2599a5;
	}
	.target_summary_box > div:nth-of-type(1) > div{
		position:absolute;
		top:50%;
		left:50%;
		transform:translateX(-50%) translateY(-28%);
		text-align:center;
	}
	.target_summary_box > div:nth-of-type(1) > div > div{
		white-space:nowrap;
	}
	.target_summary_box .but_general.material-icons{
		display:inline-block!important;
	}
	.target_analysis_summary{
		font-size:13px;
		font-family:Montserrat,chinese;
		font-weight:500;
		color:#ec0078;
	}
	.target_analysis_summary.tiny{
		font-size:11px;
		color:#7c9c96;
		min-width:180px;
	}
	.target_analysis_summary > div{
		display:flex;
		justify-content: space-between;
		padding:5px 3px;
	}
	.target_summary_box .target_analysis_summary > div{
		padding:2px 3px;
	}
	.target_analysis_summary.tiny > div > div{
		margin-right:10px;
	}
	.target_analysis_summary.tiny > div > div:nth-last-of-type(1){
		margin-right:0px;
	}
	.target_analysis_summary.eligible{
		background-color:#37008e;
		padding:5px 15px;
		color:#fff;
		border-radius:20px;
	}

	.managed_account_controller{
		border-radius:20px;
		background-color:#002021;
		color:#fff;
		background-color:#96b3b0;
		border:none!important;
		display:flex!important;
		align-items:center;
		justify-content:space-between;
		flex-wrap:nowrap;
		box-shadow:0px 0px 0px 1px #002021;
		box-shadow:none;
		padding:0px!important;

		padding-right:5px!important;
		line-height:11px;
	}
	.managed_account_controller > div{
		padding:5px 13px;
		/*border-right:1px solid #3e5652;*/
	}
	.managed_account_controller > div:nth-last-of-type(1){
		border-right:none;
	}
	.managed_account_controller .material-icons{
		color:#ffffff!important;
		font-size:13px!important;
		padding:7px 9px!important;
		cursor:pointer;
	}
	.no_service_box{
		font-family:'Montserrat',chinese;
		font-size:20px;
		background-color:#333333;
		color:#00ffcf;
		font-weight:300;
		border-radius:2px;
		padding:10px 30px;
		display:table;
		margin-bottom:20px;
	}
	.no_service_box .details_info{
		font-family:arial,chinese;
		font-size:11px;
		line-height:20px;
		padding:5px 0px;
		color:#eae300;
	}

	.message_box{
		display:flex;
		justify-content:space-between;
		background-color:#e5efed;
		border-radius:6px;
		margin:5px 0px;
		color:#0f6959;
		overflow:hidden;
		width: fit-content;
	}
	.case_ticket .message_box{
		width:auto;

	}
	.case_ticket .message_box.creator{
		flex-direction:row;
		box-shadow:inset 0px 0px 0px 1px #d1e8e1, 0px 2px 1px 0px #ffffff;
	}
	.message_box.creator{
		margin-left:auto;
		flex-direction:row-reverse;
	}
	.message_box.creator, .message_box.creator:hover{
		background-color:#dcf5ea;
		background-color:#ffffff;
		box-shadow:0px 0px 0px 1px #33eeb0;
		box-shadow:inset 0px 0px 0px 1px #33eeb0, 0px 2px 1px 0px #005d5d
	}
	.message_box.creator .replier_box > div:nth-of-type(1){
		border-radius:5px;
		padding:3px 10px;
		background-color:#34524d;
		color:#ffffff;
		font-size:10px;
	}
	.message_box.creator .replier_box > div:nth-of-type(2){
		background-color:none;
		padding:0px;
	}
	.message_box:hover{
		box-shadow:0px 0px 0px 0.5px #5cb7a7;
	}
	.message_box > div{
		padding:5px 5px;
		box-shadow:0px 0px 25px 0px #9ad0c6;
	}
	.message_box .replier_box{
		padding:10px 15px;
		flex-basis:150px;
		min-width:150px;
		/*
		background-color:#00333c;
		*/
	}
	.message_box .message{
		padding:20px 25px;
		/*
		box-shadow:-5px 0px 25px #00b3a2, inset 0px 0px 0px 0.5px #9ad0c6;
		*/
		flex:1;
		box-shadow:none;
	}
	.message_box .replier_box > div:nth-of-type(1){
		/*
		color:#00ffa1;
		*/
		margin-bottom:5px;
	}
	.message_box .replier_box > div:nth-of-type(2){
		font-size:11px;
		color:#22a285;
		background-color:#ffffff;
		border-radius:5px;
		padding:3px 10px;
		display:inline-block;

	}
	.message_counter_box{
		display:flex;
	}

	.message_counter_box{
		padding-right:55px!important;
	}
	.message_counter_box:before{
		content:attr(data);
		position:absolute;
		border-radius: 10px;
		background-color: #72b7b1;
		color:#ffffff;
		padding: 3px 10px;
		font-size: 11px;
		margin-top: -3px;
		right:3px;
		box-shadow:inset 0px 1.5px 0.5px #2b7b74;
	}
	.message_counter_box:hover:before{
		background-color: #ffffff;
		color:#333333;
		box-shadow:inset 0px 1.5px 1.5px #bfa27f;
	}

	.message_list{
		margin-bottom:130px;
	}
	#message_container{
		max-width:calc(100vw - 350px)
	}
	.message_list.closed{
		margin-bottom:0px;
	}

	.reply_box{
		display:flex;
		align-items: stretch;
		position:fixed;
		bottom:10px;
		left:10px;
		right:10px;
		background-color:#a2c7c2d6;
		box-shadow:inset 0px 0px 15px #8cb5aa;
		padding:10px;
		border-radius:10px
	}
	.reply_box > div:nth-of-type(1){
		flex:1 1 auto;
		font-size:0px;
	}
	.reply_box > div:nth-last-of-type(1){
		display:flex;
		align-items:center;
		margin-bottom:1px!important;
	}
	.reply_box > div:nth-last-of-type(1):hover{
		margin-bottom:0px!important;
	}

	.type.cate_hl{
		background-color:#9da939;
		border-radius:6px;
		color:#ffffff;
		margin-top:5px;
		padding:5px 15px;
		line-height:13px!important;
	}
	.type.cate_hl.top{
		margin-top:-5px;
		margin-bottom:8px;
	}

	.fit_container{
		display:flex;
	}
	.fit_container > div{
		flex:1 1 auto;
		padding:15px;
		position:relative;
		overflow:auto;
		height:100vh;
		transition:height 0s;
	}
	.fit_container.support > div{
		height:calc(100vh - 35px);
	}
	/* Handle */
	.fit_container.support > div::-webkit-scrollbar-thumb {
		box-shadow:none;
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #1cd8bc  0%, #1cd8bc  10%,#1cd8bc 100%); /* W3C */
		opacity:0.7; 
		border-radius: 5px;
	}



	/* Handle on hover */
	.fit_container > div::-webkit-scrollbar-thumb:hover {
		box-shadow:inset 1px 0px 0px 0px rgb(64, 168, 228),inset 0px 1px 5px 0px rgb(64, 168, 228);
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #0bffeb  0%,#33eeb0 100%); /* W3C */
		opacity:1;

	}
	.fit_container .datasec_container > div{
		margin:0px;
	}
	.fit_container .datasec_container > div > div{
		background-color:inherit!important;
		box-shadow:none;
		border:inherit!important;
		margin-bottom:0px;
	}

	.fit_container .datasec_container > div > div > div:nth-of-type(1){
		color:#1b655e!important;
	}

	.fit_container .reply_box{
		left:355px;
	}


	.file_counter_box.but_general.material-icons{
		display:flex!important;
		align-items:center;
		background-color:#6e8c90;
		padding:0px 7px 0px 0px!important;
		font-size:16px!important;
		line-height:17px!important;
		/*background: linear-gradient(to right, #1f3329  0%, #1f3329  50%,#6e8c90 50.5%,#6e8c90 100%)!important;*/ /* W3C */
	}
	.file_counter_box.but_general.material-icons:hover{

		padding:0px 7px 0px 0px!important;
		background-color:#29a99d;
		/*background: linear-gradient(to right, #1f3329  0%, #1f3329  50%,#29a99d 50.5%,#29a99d 100%)!important;*/ /* W3C */

	}
	.file_counter_box.but_general.material-icons[data_total="0"]{
		padding:5px 6px!important;
	}
	.file_counter_box:not([data_total="0"])::before{
		content:attr(data_total);
		padding: 3px 10px;
		padding: 3px 10px 3px 7px;
		padding:5px 13px;
		/*background-color: #1f3329;*/
		font-size: 11px;
		border-radius: 5px 0px 0px 5px;
		font-family: "Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		background: #1f3329;
		font-weight: 500;
		margin: 0px;
		margin-right:7px;
		color: #00ffc4;
		position:absolute;
	}
	.counter_box.material-icons{
		color:#b1dad2;
		position:relative;
		cursor:pointer;
		/*background: linear-gradient(to right, #1f3329  0%, #1f3329  50%,#6e8c90 50.5%,#6e8c90 100%)!important;*/ /* W3C */
	}
	.counter_box.material-icons::before{
		content:attr(data-non-read);
		/*padding:4px 7px;*/
		padding:2.5px;
		font-size: 0px;
		border-radius: 15px;
		font-family: "Montserrat","PingFang","微軟正黑體","Lucida Sans Unicode", "Lucida Grande", sans-serif;
		/*background: #1f3329;*/
		margin-top:18.5px;
		margin-left:50%;
		z-index:100;
		transform:translateX(-50%);
		color: #ffffff;
		background-color:#ff0052;
		display:none;
		position:absolute;
	}
	.counter_box.material-icons[data-non-read="0"]{
		color:#c1d8da!important;
		color:#C6A563!important;
	}
	.counter_box.material-icons:not([data-non-read="0"]){
		color:#bbca3f!important;
	}
	.counter_box.material-icons:not([data-non-read="0"])::before{
		display:block;
	}


	.bottom_action_bar{
		padding:10px;position: fixed;
		z-index: 1000;
		box-shadow: 0px 0px 0px 1px #5e9e92;
		background-color: #d7e8e5;
		left: 0px;
		bottom: 0px;
	}
	.bottom_action_bar > div{
		text-align: center;
	}
	.data_validate{
		position:relative;
	}
	.data_validate::after{
		content:"";
		position:absolute;
		width:15px;
		height:15px;
		top:50%;
		transform:translateY(-50%) translateX(-150%);
	}
	.data_validate.valid::after{
		border:1px solid #333;
	}

	.capsule{
		display: flex;
	}
	.capsule div{
		display:flex;
		align-items: center;
		background-color: #333;
		padding: 3px 10px;
		width: fit-content;
		color: #FFF;
	}
	.capsule div:nth-child(1){
		border-radius: 5px 0px 0px 5px;
	}
	.capsule div:nth-child(2){
		border-radius: 0px 5px 5px 0px;
		border: 1px solid #333;
		background-color: #FFF;
		color: #333;
	}
	.capsule_border{
		display: inline-block;
		padding:3px 10px;
		border-radius:15px;
		border:1px solid #dedede;
		width: fit-content;
		font-size:11px;
		background-color:#ffffff;
	}

	.expired_btn{
		border: 1px solid #70cfba;
		border-radius: 5px;
		/* background-color: #70cfba;
		color: #fff; */
		background-color: #fff;
		color: #70cfba;
		padding: 3px 15px;
		margin-right: 5px;
		cursor: pointer;
		
		border: 1px solid #C6A563;
		background-color: #fff;
		color: #C6A563;
	}
	.expired_btn:hover{
		/* background-color: #fff;
		color: #70cfba; */
		background-color: #70cfba;
		color: #fff;
		
		border: 1px solid #C6A563;
		background-color: #C6A563;
	}
	.btn_flex{
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	/* HEADER PROFILE PANEL /////////////////////////*/
	.sys_header .profile_controlbox{
		width:30px;
		height:30px;
		position:relative;
	}
	.sys_header .profile_controlbox > div:nth-of-type(1){
		position:absolute;
		z-index:102;
		border-radius:50%;
		width:35px;
		height:35px;
		display:table;
		background:url(../images/icon/profile_icon.png) no-repeat center bottom;
		background-size:contain;
		background-color:#b1d2cf;
		background-color:#edf7f7;
		background-color:#ffffff;
		box-shadow:0px 0px 1px 1px #a3c3c1, inset 0px -2px 2px 0px #c3e8e2;
		box-shadow:0px 0px 1px 1px #B48070, inset 0px -2px 2px 0px #F6CF73;
		top:-4px;
	}
	.sys_header .profile_controlbox:hover > div:nth-of-type(1){
		box-shadow:0px 0px 1px 0px #a1dad5, inset 0px 0px 0px 0px #c3e8e2;
		box-shadow:0px 0px 1px 1px #B48070, inset 0px -2px 2px 0px #F6CF73; border: 1px solid #C6A563;
	}
	/*FLOAT PANEL*/
	.sys_header .profile_controlbox .profile_infobox{
		position:absolute;
		background-color:#ffffff;
		right:-10px;
		top:-17.5px;
		display:flex;
		overflow:hidden;
		z-index:101;
		max-height:0px;
		opacity:0;
		border:1px solid #dedede;
	}
	.sys_header .profile_controlbox:hover .profile_infobox{
		top:-11.5px;
		z-index:100;
		max-height:350px;
		opacity:1;
	}
	.sys_header .profile_infobox > div{
		flex:1 1 0;
	}
	.sys_header .profile_infobox > div:nth-of-type(1){
		text-align:left;
		min-width:150px;
	}
	.sys_header .profile_infobox > div:nth-of-type(1) > div{
		padding:10px 15px;
		min-width:100px;
		border-bottom:1px solid #dedede;
	}
	.sys_header .profile_infobox > div:nth-of-type(1) > div:nth-last-of-type(1){
		border:none;
	}
	.sys_header .profile_infobox > div:nth-of-type(2){
		flex:0 0 0;
		border-left:1px solid #dedede;
		display:flex;
		flex-wrap:wrap;
		align-content:space-between;
		justify-content:center;
		min-width:50px;
		padding:13px 0px;
		padding-top:50px;
	}
	.sys_header .profile_infobox .material-icons{
		font-size:22px;
		cursor:pointer;
	}
	.sys_header .profile_infobox > div:nth-of-type(2) .material-icons{
		color:#aaaaaa;
		color:#DAE1E4;
	}
	.sys_header .profile_infobox > div:nth-of-type(2) .material-icons:hover{
		color:#1acfb1;
		color:#2B363B;
	}
	.sys_header .profile_infobox > div:nth-of-type(1) .material-icons{
		color:#89bfb5
	}
	.sys_header .profile_infobox > div:nth-of-type(1) .material-icons:hover{
		color:#1acfb1
	}
	.sys_header .profile_infobox > div:nth-of-type(1) div{
		white-space:nowrap;
	}
	.sys_header .profile_infobox .user_info > div:nth-of-type(1){
		font-size:14px;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		font-weight:300;
		margin-bottom:3px;
	}
	.sys_header .profile_infobox .user_info > div:nth-of-type(2){
		margin-top:3px;
		margin-bottom:5px;
		display:table;
		padding:3px 10px;
		border-radius:8px;
		color:#1a3e31;
		background-color:#dbefe7;
		color:#fff;
		background-color:#C6A563;
	}
	.sys_header .profile_infobox .user_info > div:nth-of-type(3){
		margin-bottom:10px;
	}
	.sys_header .profile_infobox .business_info > div:nth-of-type(1){
		font-size:12px;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		color:#009780;
		color:#B48070;
		font-weight:300;
	}
	.sys_header .profile_infobox .business_info > div{
		margin-bottom:5px;
	}
	.sys_header .profile_infobox .business_info > div:nth-last-of-type(1){
		margin-bottom:0px;
		text-align:right;
	}
	.sys_header .profile_infobox .uix_service_info{
		background-color:#213c3d;
		color:#ffffff;
	}
	.sys_header .profile_infobox .uix_service_info > div:nth-of-type(1){
		font-size:15px;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		color:#00FFB7;
		font-weight:300;
		margin-bottom:5px;	

	}
	.sys_header .profile_infobox .uix_service_info .nav_list{
		color:#53938a;
		margin-left:2px;
		margin-bottom:10px;
		border-top: 1px solid #1ed99d;
		padding-top: 10px;
		margin-top: 5px;
	}
	.sys_header .profile_infobox .uix_service_info .nav_list > div{
		margin-bottom:5px;
		padding-left:5px;
		box-shadow:-2px 0px 0px 0px #0f6656;
		cursor:pointer;
	}
	.sys_header .profile_infobox .uix_service_info .nav_list > div:hover{
		color:#00FFB7;
		box-shadow:-2px 0px 0px 0px #00FFB7;
	}
	.sys_header .profile_infobox .uix_service_info .managed_account_controller{
		background-color:#002021;
		color:#16e992;
		margin-bottom:5px;
	}
	.sys_header .quick_sc_box{
		display:flex;
	}
	.sys_header .quick_sc_box > div{
		margin-right:5px;
	}
	.sys_header .quick_sc_box .material-icons{
		color:#2599a5;
		cursor:pointer;
		font-size:24px;
	}

	.sys_header .quick_sc_box .material-icons:hover,.sys_header .quick_sc_box .material-icons.nav.active,.sys_header .quick_sc_box .material-icons.nav.pinned{
		color:#1acfb1;
		color:#C66646;
	}
	.sys_header .quick_sc_box .material-icons.nav{
		color:#c0dbde;
	}
	.email_box{
		display: inline-block;
		margin-top: 5px;
		background-color: #557d82;
		background-color: #788B94;
		padding: 3px 15px 2px;
		border-radius: 15px;
		color: #ffffff;

	}
	.domain_setting_box{
		position:fixed;
		z-index:100;
		top:50px;
		bottom:20px;
		left:20px;
		right:20px;
		background-color:#ffffffc9;
		box-shadow:0px 0px 0px 1px #b6e8e1, 0px 0px 25px 0px #b6e8e1;
		padding:30px;
		padding-top:60px;
		overflow:auto;

	}
	.waiting_box{
		position:fixed;
		z-index:1000;
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		background-color:#00251ed9;
		display:flex;
		justify-content:center;
		align-items:center;
		text-align:center;
		flex-direction:column;
		font-family:"Montserrat","PingFang","微軟正黑體",arial;
		font-size:16px;
		color:#ffffff;
	}

	.loading-ring {
		display: inline-block;
		position: relative;
		width: 80px;
		height: 80px;
	}
	.loading-ring div {
		box-sizing: border-box;
		display: block;
		position: absolute;
		width: 64px;
		height: 64px;
		margin: 8px;
		border: 8px solid #fff;
		border-radius: 50%;
		animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
		border-color: #fff transparent transparent transparent;
	}
	.loading-ring div:nth-child(1) {
		animation-delay: -0.45s;
	}
	.loading-ring div:nth-child(2) {
		animation-delay: -0.3s;
	}
	.loading-ring div:nth-child(3) {
		animation-delay: -0.15s;
	}
	@keyframes lds-ring {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	.appidc{
		padding-left:143px!important;
	}
	.appidc::before{
		content:"https://inc.uixit.com/";
		position:absolute;
		font-size:12px;
		display:flex;
		align-items:center;
		top:1px;
		bottom:0;
		left:0;
		color:#333333;
		text-transform:uppercase;
	}
	.appidc::after{
		content:"/";
		position:absolute;
		font-size:12px;
		display:flex;
		align-items:center;
		top:1px;
		bottom:0;
		right:-25px;
		color:#333333;
		text-transform:uppercase;
	}
	.appidc input{
		width:120px!important;
	}
	#sys_notice_box{
		position:fixed;
		top:0px;
		bottom:0px;
		width:330px;
		right:0%;
		background-color:#00100ded;
		border-radius:3px;
		z-index:200;
		color:#ffffff;
		right:-330px;

	}

	#sys_notice_box ::-webkit-scrollbar-track {
		box-shadow: inset 1px 0px 3px transparent; 
		border-radius: 5px;
		background-color:#00100ded;   
	}
	/* Handle */
	#sys_notice_box ::-webkit-scrollbar-thumb {
		box-shadow:none;
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #12504b  0%, #26867e  10%,#0bffeb 100%); /* W3C */
		background: linear-gradient(to bottom, #6fd8cf  0%, #2c5652  10px,#003e39 100%);
		opacity:0.7; 
		border-radius: 5px;

	}

	/* Handle on hover */
	#sys_notice_box ::-webkit-scrollbar-thumb:hover {
		background: linear-gradient(to bottom, #fff710  0%,#ffd200 100%); /* W3C */
		background: linear-gradient(to bottom, #6fd8cf  0%,#003e39 100%); /* W3C */
		opacity:1;

	}
	#sys_notice_box.active{
		right:0;
	}
	#sys_notice_box .heading{
		padding:15px 30px;
		color:#31fbc8;
		color:#F2E07D;
		font-family:Montserrat,chinese;
		font-size:30px;
		cursor:pointer;
	}
	#sys_notice_box .heading::before{
		content:"";
		position:absolute;
		right:0px;
		top:33px;
		border-left:1px solid #31fbc8;
		border-left:1px solid #F2E07D;
		height:0px;
	}
	#sys_notice_box .heading::after{
		content:"";
		position:absolute;
		right:0px;
		top:33px;
		border-left:1px solid #31fbc8;
		border-left:1px solid #F2E07D;
		height:0px;
	}
	#sys_notice_box:hover .heading::before{
		height:10px;
		right:25px;
		top:28px;
		transform: rotate(-225deg);
	}

	#sys_notice_box:hover .heading::after{
		height:10px;
		right:25px;
		top:35px;
		transform: rotate(225deg);
	}
	#sys_notice_box .list{
		padding:0px 20px!important;
		margin:0px 10px!important;
		overflow:auto;
		height:calc(100vh - 77px);
	}
	#sys_notice_box .list > div{
		margin-bottom:15px;
		padding-bottom:15px;
		border-bottom:0.5px solid #033a2d;
		position:relative;
	}
	#sys_notice_box .list > div:hover{
		border-color:#33eeb0;
	}
	#sys_notice_box .date_box{
		position:relative;
		font-size:13px;
		font-family:Montserrat,chinese;
		color: #00ffd0;
		margin-bottom:10px;
		opacity:0.3;
		font-weight:300;
	}
	#sys_notice_box .list > div:hover .date_box{
		opacity:1;
	}
	#sys_notice_box .date_box span{
		background-color: #00312a;
		font-size: 10px;
		padding: 2px 10px;
		margin-left: 5px;
		border-radius: 20px;
		letter-spacing: 0.2em;
	}
	#sys_notice_box .list > div[data-flag='new']::before{
		content:"";
		right:0px;
		top:7px;
		background-color:#fbd000;
		border-radius:5px;
		width:5px;
		height:5px;
		position:absolute;
	}
	#sys_notice_box .list.no_item{
		color:#789088;
		padding:15px 0px!important;
		margin:0px 30px!important;
		border-top:1px solid #00563e!important;
		border-top:1px solid #F2E07D!important;
	}
	#sys_notice_box .area{
		font-family:Montserrat,chinese;
		color:#fff700;
		font-weight:300;
		font-size:15px;
		line-height:23px;
		margin-bottom:5px;
		padding-left:13px;
		position:relative;
	}
	#sys_notice_box .area::before{
		content:"";
		border-left:3px solid #005d50;
		position:absolute;
		top:5px;
		bottom:5px;
		left:0px;

	}
	#sys_notice_box .list > div:hover .area::before{
		border-left:3px solid #00ffdc;
	}
	#sys_notice_box .headline{
		/*color:#00f113;*/
		color:#00ffe7;
		font-size:13px;
		font-family:Montserrat,chinese;
		font-weight:3a00;
		margin-bottom:5px;
	}
	#sys_notice_box .message{
		font-size:13px;
		font-family:Montserrat,chinese;
		color:#6fa79b;
		font-weight:300;
	}
	#sys_notice_box .message a{
		color:#ffffff;
		font-weight:bold;
	}
	#sys_notice_box .message a:hover{
		color:#64ffcb;
	}
	#sys_notice_box .action_box{
		float:initial;
		display:table!important;
		margin-left:auto;
		margin-right:0px;
		margin-top:10px;
	}
	#sys_notice_box .action_box .but_general{
		padding:4px 25px 3px!important;
		box-shadow:0px 1px 1px 0px #777!important;
		background:linear-gradient(to bottom right, #ffffff 0%,#e2e2e2 100%);
	}
	#sys_notice_box .action_box .but_general:hover{
		box-shadow:0px 1px 1px 0px #777!important;
		background:linear-gradient(to bottom right, #ffffff 0%,#e2e2e2 100%);
	}

	.overview_header_stats_box{
		text-align:right;
	}
	.overview_header_stats_box > div{
		margin-left:20px;
	}
	.overview_header_stats_box > div > div:nth-of-type(1){
		min-height:20px;
	}
	.overview_header_stats_box > div > div:nth-of-type(2){
		font-size:11px;
		color:#34524d;
	}
	#uix_core{
		display:none;
		position:absolute;
		z-index:100;
		font-family:arial;
		font-size:12px;
		background-color:#222222;
		color:#666666;
		text-align:left;
		left:50%;
		transform: translateX(-50%);
	}
	#uix_core > div{
		white-space:nowrap;
		cursor:pointer;
		padding:8px 15px;
	}
	#uix_core > div:hover{
		background-color:#0a0a0a;
		color:#00ffad;
	}

	.code_box{
		display:none;
		height:calc(100vh - 105px);
		background-color:#071b1b!important;
		color:#2e9c8d!important;
		border:none!important;
		padding:20px;
		overflow:auto;
		font-size:13px;
		line-height:20px;
		white-space: pre-wrap;
	}
	.code_box, .code_box:focus{
		box-shadow:0px 0px 0px 0px #0b2727!important;
	}
	.code_box:focus{
		background-color:#071b1b!important;
		color:#00dcbe!important;
	}
	.code_box.css{
		word-break:break-all;
		display:block;
		margin-left:1px;
	}
	.code_container{
		display:flex;
		font-size:0px;
		border-radius:5px;
		box-shadow:0px 0px 1px 1px #00ffdc, 0px 0px 20px 0px #003c3c!important;
		box-shadow:0px 0px 0px 0px #0b2727, 0px 0px 20px 0px #008e74!important;
	}
	.code_container > div{
		flex:1 1 auto;
		position:relative;
	}
	.code_nav{
		display:flex;
		position:absolute;
		font-size:12px;
		line-height:12px;
		margin-top:-25px;
		right:0px;
	}

	.code_nav > div{
		flex:0;
		padding:7px 15px 5px;
		background-color:#162b2b;
		color:#2c6161;
		margin-right:3px;
		cursor:pointer;
	}
	.code_nav > div.hl, .code_nav > div:hover{
		color:#00ffdc;
	}
	/* HEADER PROFILE PANEL END /////////////////////////*/

	@media only screen and (max-width: 1000px) {


	}
	@media only screen and (max-height:600px){

	.footer{
		bottom:-100px;
	}
	}

	/* For JQuery Form Validation */
	.data-input  label.error{
		font-size: 11px;
		color: red;
	}

	.table_form > tbody > tr.validate label.error{
		width: auto;
	}

	.table_form > tbody > tr.validate > td:nth-child(1) > div{
		position: unset;
	}
	/* End For JQuery Form Validation */

	/* For targeting Campaign */
		.chart_section {
			padding-bottom: 20px;
		}

		.chart_section .chart_section_header {
			font-weight: bold;
			padding-bottom: 10px;
		}

		.chart_section_wrapper {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin-left: 2%;
			margin-right: 2%;
		}

		.chart_section_wrapper .chart_section {
			flex: 0 40%;
			margin-bottom: 2%;
		}
	/* End For targeting Campaign */

	/* Start of Promo Campaign */
	.but_general.full_width {
		width: 100% !important;
		text-align: center;
	}

	.item_price_row.warn_row_1{
		background-color: #dd9aaa;
	}

	.pricetotalwarning{
		background-color:red;
		color:white;
		font-size:16px;
		padding:5px 15px;
		margin-top:10px;
		display: inline-block;
	}
	/* End of Promo Campaign */




	.login_box { display: flex; flex-direction: column; gap: 10px; }

	.login_box input {
		color:#000;
		background-color:#fff!important;
		box-shadow:inset 0px 0px 0px 1px #30a38e, inset 0px 2px 3px 0px #c3d0d2!important;
		box-shadow:none!important;
		border: none!important;
		border-bottom:1px solid #C6A563!important;
		border-radius:0;
	}
	.login_box input:focus {
		color:#000;
		background-color:#fff!important;
		box-shadow:inset 0px 0px 0px 1px #30a38e, inset 0px 2px 3px 0px #c3d0d2!important;
		box-shadow:none!important;
		border: none!important;
		border-bottom:1px solid #C6A563!important;
		border-radius:0;
	}

	.section_header .action_box .combo_box {
		box-shadow: 0px 0.5px 1px #666!important
	}
	.section_header .action_box .combo_box, .section_header .action_box .combo_box:hover {
		border-radius: 3px!important;
		
		box-shadow: none!important;
		background: none;
	}
	.combo_box > div .but_general,
	.combo_box > div:nth-child(1) .but_general,
	.combo_box > div:nth-last-child(1) .but_general{
		border-radius:3px!important;
	}

	.sys_header .float_l a img { display: none; }
	.sys_header .float_l a { display: block; width: 82px; height: 67px; background:url(/library/images/main/name_logo.png) no-repeat center; background-size: contain; }

	.sys_login .desc { font-size: 12px; padding: 10px 0; }
	.sys_login .desc span { font-weight: 600; color: #C6A563; }
	.sys_login table div > div:nth-child(1) img { display: none; }
	.sys_login table div > div:nth-child(1) { width: 100%; height: 100px; background:url(/library/images/main/name_logo.png) no-repeat center; background-size: contain; }
	.sys_login table .login_box div:nth-child(1) { width: auto!important; height: auto!important; background: none!important; color: #788B94; }
	.sys_login table div div:nth-child(3) > div:nth-child(3) {display: flex; justify-content: center; align-items: flex-end; height: 70px!important; padding: 0!important; margin-top: 30px; }
	#login_request_password > div, .login_request_close { background: none!important; height: auto!important; width: auto!important; }
	#login_request_password input { border-bottom: 1px solid #C6A563!important; box-shadow: none!important; border-radius: 0; background: #fff; }
	#login_request_password .but_general { background: none!important; background: #C66646!important; color: #fff!important; }
	#login_request_password .but_general:hover { background: #2B363B!important;  }
	.task_box { box-shadow: 0px 0px 10px #D4BB8A88!important; }
	.task_box .task_quick_status > div > div:nth-of-type(2) { background: #F6CF73!important; color: #2B363B!important; }
	.task_box > div:nth-child(1), .task_box .task_quick_status > div > div:nth-of-type(1) { color: #2B263B!important; }

	.sys_header .profile_controlbox .profile_infobox a { color: #788B94; }
	.sys_header .profile_controlbox .profile_infobox a:hover { color: #2B363B; }

	.action_option_container .material-icons { color: #C6A563; }

	.datasec_container.setting .content_config { border: 2px solid #C6A563!important; }
	.block_list_container.reverse .block_unit div { color: #F2E07D!important; background-color: #000!important; }
	.block_list_container.reverse .block_unit div::before { border: 1px dashed #2B363B!important; }
	.block_list_container.reverse .block_unit:hover .flex .pad { border-right: 1px dashed #F2E07D!important; }


/* Date Picker Style */
.xdsoft_time.xdsoft_current { background: #C6A563!important; box-shadow: none!important; }
.xdsoft_calendar .xdsoft_date.xdsoft_today { color: #C6A563!important; }
.xdsoft_calendar .xdsoft_date.xdsoft_current { background: #C6A563!important; box-shadow: none!important; color: #fff!important }

.lb_header { border-bottom: 5px solid #C6A563!important; }
.lb_secheader { color: #6D5016!important; }
.action_tab { background-color: rgba(249,218,0,0.8); }

.datasec_container.inbar { box-shadow: 0px 5px 0px 0px #F9DA00!important; }
.datasec_container.inbar .setting_unit>div:nth-child(1) { box-shadow: 0px 1px 1px #F9DA00!important; }

.datasec_container.setting.controller > div > div:first-child { border: 2px solid #C6A563!important; }
.datasec_container.setting.controller > div > div:first-child:hover { border: 2px solid #C6A563!important; }

#order_plan_list .table_form td.subsec > div > div.data-input input { pointer-events: none; background: #fafafa!important;  }
#order_plan_list .table_form td.subsec > div > div:nth-of-type(1) { display: block; }


/* uix_editor */
.insert_setting { background: #C6A563!important; }
.insert_setting.active { border-top: 1.5px solid #957B73!important; }
.insert_setting.flex .material-icons { background: linear-gradient(to bottom right, #F7D273 0%,#DDA24A 30%,#CC6646 100%)!important; }


.campaigns_details_info { border-bottom: 2px solid #C6A563!important; }

.section_container > .section_container { background: none; }

.file_support_info.size { border: 1px solid #C6A563!important; }
.file_support_info.size > div:nth-of-type(1) { background: #C6A563!important; }
.file_support_info > div:nth-of-type(1) { background: #788B94!important; }
.file_support_info  { border: 1px solid  #788B94!important; }

.propmtselectlist { display: flex; gap: 3px; }
.propmtselectlist .promptitem { display: flex; height: 30px; align-items: center; padding: 0 15px; text-align: center; background: #eee; color: #788B94; border-radius: 3px; cursor: pointer; }
.propmtselectlist .promptitem:hover { background: #2B363B; color: #fff; }
.propmtselectlist .promptitem.active { background: #F9DA00; color: #2B363B; }

.section_container {
padding-bottom:150px;
}

/* Tutor Schedule update */
/*#tutor-selection { pointer-events: none; }
#tutor-selection.change_tutor:hover { background: none; }
#tutor-selection .option { width: auto; max-width: 200px; background: none; }
#tutor-selection.change_tutor .option .current { box-shadow: none!important; background: none; font-size: 16px; line-height: normal; color: #2B363B; padding-right: 60px!important; }
#tutor-selection.change_tutor .option .current:after { display: none; }
#tutor-selection.change_tutor .option .current:hover { box-shadow: inset 0px 0px 0px 1px #dae1e4!important; background-color: #fff!important; }*/

#tutor-selection.change_tutor:hover { background: none; }
#tutor-selection .option { width: auto; max-width: 200px; background: none; }
#tutor-selection.change_tutor .option .current { box-shadow: none!important; background: url(https://uat.ctinc.app/openstring/1.0/library/images/common/OSOS_icon_editpen.svg) transparent right 7px center no-repeat; font-size: 16px; line-height: normal; color: #2B363B; padding-right: 60px!important; }
#tutor-selection.change_tutor .option .current:after { display: none; }
#tutor-selection.change_tutor .option .current:hover { box-shadow: inset 0px 0px 0px 1px #dae1e4!important; background-color: #fff!important; }


#product_option .datasec_container .setting_unit table tr:nth-child(2) td:nth-child(2) { font-size: 16px; color: #2B363B; }
#product_option .datasec_container .setting_unit table tr:nth-child(2) td, #product_option .datasec_container .setting_unit table tr:nth-child(2) td div { vertical-align: middle; margin: 0; }

#product_option .datasec_container .table_list > tbody > tr td { vertical-align: middle; }

/* Lesson & Event SKU update */
.section_container table tr:nth-child(1):hover { background: none; }

.section_container .list_action_box.framebox { display: flex; justify-content: left; align-items: center; gap: 50px; margin: 0 0 10px!important; background: #ffffff59; box-shadow: 0px 0px 10px #D4BB8A88; padding: 8px 15px; border-radius: 5px; color: #788B94; }
.section_container .list_action_box.framebox > div { display: flex; justify-content: left; align-items: center; gap: 15px; flex: none; }
.section_container .list_action_box.framebox .data-input.short:last-child { margin-left: -12px; }
.section_container .list_action_box.framebox .dtpicker input { padding: 6px 13px 5px 30px!important; }
.section_container .list_action_box.framebox .but_general { background: linear-gradient(to bottom right, #F7D273 6%,#DDA24A 40%,#CC6646 80%); box-shadow: 0px 1px 1px #6D5016!important; color: #ffffff!important; padding: 7px 15px 6px!important; }
.section_container .list_action_box.framebox .but_general:hover { background-color: #141414;
    color: #6D5016!important;
    background-color: #fbe777;
    background: -moz-linear-gradient(left top , #ffffff, #fbe777);
    background: -webkit-linear-gradient(left top, #ffffff 0%,#fbe777 100%);
    background: -ms-linear-gradient(left top, #ffffff,#fbe777 100%);
    background: linear-gradient(to bottom right, #ffffff 0%,#fbe777 100%);
    box-shadow: inset 0px 1px 2px #666!important;
    margin-top: 1px!important;
    margin-bottom: 0px!important; }
.section_container .list_action_box.framebox .but_general.disabled { background-color: #EBEBEB!important;
    background: -moz-linear-gradient(left top , #ffffff, #c3c3c3);
    background: -webkit-linear-gradient(left top, #ffffff 0%,#c3c3c3 100%);
    background: -ms-linear-gradient(left top, #ffffff,#c3c3c3 100%);
    background: linear-gradient(to bottom right, #ffffff 0%,#e2e2e2 100%);
    box-shadow: 0px 0.5px 1px #666!important;
	color: #333!important;
}