/* vim: set foldmethod=syntax:
*/

@font-face {
	font-family:'cjfont';
	src: local(Consolas),local(monospace),local(Helvetica), local('Segoe UI');
	unicode-range:U+00-024F;
}

/************************************/
/* [misc] */
/************************************/
A {
	color:blue;
	text-decoration:none;
}
A:hover {
	text-decoration:underline;
}
INPUT[type="checkbox"]:checked + LABEL, INPUT[type="radio"]:checked + LABEL {
	color:blue;
	font-weight:bold;
}
INPUT[type="checkbox"], INPUT[type="radio"], LABEL {
	cursor:pointer;
}
HR {
	border: 0;
	height: 1px;
	background: #333;
	margin: 20px 0;
}

.disabled {background:#CCC !important}

/************************************/
/* [topmenu] */
/************************************/
DIV.menu {
	background:#248;
	color:white;
	box-shadow:0 3px 10px rgba(0,0,0,.5);
	border-top:1px solid #484;
	border-bottom:#040;
	margin-bottom:10px;
	padding:0;
}

DIV.menu > TABLE {
	width:100%;
	border-collapse:collapse;
	white-space:nowrap;
	color:white;
}
DIV.menu > TABLE > TBODY > TR > TD {
	font:bold 20pt/1 cjfont;

	border:1px solid #888;
	border-top:0;
	
	white-space:nowrap;
	cursor:pointer;
	padding:0x;
	letter-spacing:10px;
}
DIV.menu > TABLE > TBODY > TR > TD.selected {
	background:gold;
	background:#FF4;
	color:black !important;
	text-shadow:2px 2px 3px rgba(0,0,0,.35);
	cursor:default;
}
DIV.menu > TABLE > TBODY > TR > TD:hover:not(.selected) {
	background:DodgerBlue;
}

DIV.menu SPAN.logo {
	display:inline-block;
	padding:6px;
}
DIV.menu SPAN.logo > IMG {
	width:auto;
	height:40px;
	margin:0 20px;
}


/************************************/
/* [mpp] */
/************************************/
TABLE.mpp BUTTON, TABLE.mpp INPUT[type="submit"], TABLE.mpp INPUT[type="reset"] {
	font:bold 12pt/1 cjfont;
	padding:4px 30px 3px !important;
}
TABLE.mpp TABLE.mpp-table {
	white-space:nowrap;
}
TABLE.mpp TABLE.mpp-table INPUT[type="text"] {
	width:200px;
	font:normal 12pt/1 cjfont;
	background:#FFE;
	padding:2px 8px;
}
TABLE.mpp TABLE.mpp-table TEXTAREA {
	width:200px;
	height:60px;
	font:normal 12pt/1 cjfont;
	background:#FFE;
	padding:2px 8px;
}
TABLE.mpp TABLE.mpp-table SELECT {
	width:200px;
	font:bold 12pt/1 cjfont;
	background:#FFE;
	border:2px solid black;
	padding:1px 6px;
}

/* [mpp] fac0 */
TABLE.mpp TABLE.item-edit-fac0 INPUT[type="text"] {
	width:250px;
}
TABLE.mpp TABLE.item-edit-fac0 INPUT[type="text"].LWT {
	width:150px;
}
TABLE.mpp TABLE.item-edit-fac0 TEXTAREA {
	width:250px;
	height:80px;
	padding:4px 8px;
	border:2px solid black;
}

TABLE.mpp TABLE.model-sort-fac0 {
	white-space:nowrap;
	font-size:13pt;
}
TABLE.mpp TABLE.model-sort-fac0 > TBODY > TR > TH {
	text-align:left;
}
TABLE.mpp TABLE.model-sort-fac0 DIV.model-sort {
	width: 560px;
	background:#FF8;
	padding:10px;
	box-sizing:border-box;

	display: flex;
	justify-content:flex-start;
	flex-wrap:wrap;
}
TABLE.mpp TABLE.model-sort-fac0 DIV.model-obj {
	width: 120px;
	height: 40px;
	border-radius: 5px;
	box-shadow: 0 4px 6px -1px #001d29, 0 2px 4px -2px #001d29;
	padding:0;
	display: inline-block;
	margin:6px;
	box-sizing:border-box;
	align-items: center;
	will-change: transform;
	text-align: center;
}
TABLE.mpp TABLE.model-sort-fac0 .drag-handle {
	width: 120px;
	height: 40px;
	background: white;
	color: blue;
	padding:12px 4px 12px 12px;
	letter-spacing:8px;
	box-sizing:border-box;
	font:bold 14pt/1 cjfont;
	border-radius:4px;
	overflow:hidden;
	text-overflow:ellipsis;
}

TABLE.mpp TABLE.item-sort-fac0 {
	white-space:nowrap;
	font-size:13pt;
}
TABLE.mpp TABLE.item-sort-fac0 > TBODY > TR > TH {
	text-align:left;
}
TABLE.mpp TABLE.item-sort-fac0 DIV.item-sort {
	width: 560px;
	background:#FF8;
	padding:10px;
	box-sizing:border-box;

	display: flex;
	justify-content:flex-start;
	flex-wrap:wrap;
}
TABLE.mpp TABLE.item-sort-fac0 DIV.item-obj {
	width: 120px;
	height: 40px;
	border-radius: 5px;
	box-shadow: 0 4px 6px -1px #001d29, 0 2px 4px -2px #001d29;
	padding:0;
	display: inline-block;
	margin:6px;
	box-sizing:border-box;
	align-items: center;
	will-change: transform;
	text-align: center;
}
TABLE.mpp TABLE.item-sort-fac0 .drag-handle {
	width: 120px;
	height: 40px;
	background: white;
	color: blue;
	padding:12px 4px 12px 12px;
	letter-spacing:8px;
	box-sizing:border-box;
	font:bold 14pt/1 cjfont;
	border-radius:4px;
}

/* adm: upload_img */
TABLE.mpp TABLE.upload-img-fac0 {
	white-space:nowrap;
}
TABLE.mpp TABLE.upload-img-fac0 SELECT {
	color:blue;
}
TABLE.mpp DIV#model-select.pvn, TABLE.mpp DIV#drop-zone.pvn {
	opacity:.3;
}
TABLE.mpp DIV#drop-zone {
	width: 400px;
	height: 100px;
	padding:10px;
	text-align:center;
	border: 2px dashed black;
	border-radius: 8px;
	background:white;
}
TABLE.mpp DIV#drop-zone:hover {
	border: 2px solid DodgerBlue;
	cursor:pointer;
	background:#FFE;
}
TABLE.mpp DIV#drop-zone-hint {
	display:inline-block;
	text-align:left;
	font:bold 13pt/1.4 cjfont;
}


/************************************/
/* [footer] */
/************************************/


/************************************/
/* [topbar] */
/************************************/
DIV.topbar {
	margin:0 10px 10px;
	font:bold 12pt/1 cjfont;
}
DIV.topbar > TABLE {
	width:100%;
	white-space:nowrap;
}
DIV.topbar > TABLE TD.fac-info {
	font-size:14pt;
}

/* user-stuff */
DIV.topbar > TABLE TD.user-stuff {
	text-align:right;
	padding:0 20px;
	font:bold 14pt/1 cjfont;
}
DIV.topbar > TABLE TD.user-stuff > IMG {
	width:60px;
	height:60px;
	filter:drop-shadow(0 0 2px black);
}
DIV.topbar > TABLE TD.user-stuff > IMG:hover {
	filter:drop-shadow(0 0 5px blue);
	cursor:pointer;
}

/************************************/
/* adm-stuff */
/************************************/
DIV.topbar > TABLE TD.adm-stuff {
	padding-right:60px;
} 
DIV.topbar > TABLE TD.adm-stuff > DIV#b2b-adm-stuff {
	border:1px dashed transparent;
	border-radius:6px;
	padding:10px 20px;
} 
DIV.topbar > TABLE TD.adm-stuff > DIV#b2b-adm-stuff.being-adm {
	border:1px dashed black;
} 
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions {
	display: none;
	white-space:nowrap;
} 
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions.being-adm {
	display: inline-block;
} 
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act {
	display: inline-block;
	position: relative;

	background-color: white;
	border: 1px solid #AAA;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 10px rgba(40, 40, 0, 0.2) inset;

	font:bold 13pt/1 cjfont;
	padding:8px 10px 5px;
	white-space:nowrap;
	cursor:pointer;
	margin-right:5px;
} 
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act:hover {
	box-shadow:none;
	border: 1px solid black;
	text-shadow:1px 1px 2px rgba(0,0,0,.2);
} 
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act:hover:before {
	transform: skew(-15deg) rotate(-6deg);
	left: 15px;
}
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act:hover:after {
	transform: skew(15deg) rotate(6deg);
	right: 15px;
}
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act:hover:before,
DIV.topbar > TABLE TD.adm-stuff DIV#b2b-adm-actions > DIV.adm-act:hover:after {
	width: 70%;
	height: 55%;
	content: ' ';

	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);

	position: absolute;
	bottom: 10px;
	z-index: -1;	
}

/* toggle-adm */
DIV.topbar > TABLE TD.toggle-adm {
} 
DIV.topbar > TABLE TD.toggle-adm > DIV.toggle-adm {
	display:inline-block;
	position:relative;
	box-sizing:border-box;
	width:130px;
	height:36px;
	border:2px solid black;
	border-radius:33px;
	box-shadow:2px 2px 8px rgba(0,0,0,.3);
	cursor:pointer;
	font:bold 12pt/1 cjfont;
	text-shadow:1px 1px 3px rgba(0,0,0,.5);

	background:#888;
	color:black;
	padding:10px 8px 0;
} 
DIV.topbar > TABLE TD.toggle-adm > DIV.being-adm {
	background:#09F;
	color:white;
	text-align:left;
	margin-left:20px;
}
DIV.topbar > TABLE TD.toggle-adm > DIV.toggle-adm > SPAN:first-child {
	display:inline-block;
	position:absolute;
	right:10px;
	top:10px;
	color:white;
} 
DIV.topbar > TABLE TD.toggle-adm > DIV.being-adm > SPAN:first-child {
	left:10px;
} 
DIV.topbar > TABLE TD.toggle-adm > DIV.toggle-adm > SPAN:last-child {
	display:inline-block;
	position:absolute;
	box-sizing:border-box;
	width:32px;
	height:32px;
	background:#CCC;
	border:2px solid #FFF;
	border-radius:50%;
	left:0;
	top:0;
	transition:left .2s;
} 
DIV.topbar > TABLE TD.toggle-adm > DIV.being-adm > SPAN:last-child {
	left:94px;
} 

/* fac-info-edit */
DIV.topbar DIV.fac-info-edit {
	display:none;
	border:1px solid #888;
	border-radius:12px;
	background:deeppink;
	color:white;
	margin:-6px 0 -2px 12px;
	font:normal 12pt/1 cjfont;
	padding:2px 18px 1px 20px;
	cursor:pointer;
	letter-spacing:2px;
} 
DIV.topbar DIV.fac-info-edit.being-adm {
	display:inline-block;
} 
DIV.topbar DIV.fac-info-edit.being-adm:hover {
	border:1px solid black;
	background:DodgerBlue;
	box-shadow:0 0 6px rgba(0,0,0,1);
	font-weight:bold;
} 

/************************************/
/* [fac0,1,2 common] */
/************************************/
TABLE.data {
	width:100%;
}
TABLE.data > THEAD > TR > TH {
	font:bold 16pt/1.4 cjfont;
	background:#666;
	color:white;
	border:1px solid #333;
	border-color:#AAA #333 #333 #AAA;
	padding:4px 2px 4px 12px;
	letter-spacing:10px;
	text-shadow:2px 2px 4px rgba(0,0,0,.8);
}
TABLE.data > THEAD > TR > TH:first-child {
	width: 300px;
}

TD.model {
	vertical-align:top;
	background:#EEE;
}
TD.model > TABLE {
	width:100%;
}
TD.model > TABLE > TBODY > TR > TH {
	font:bold 16pt/1.4 cjfont;
	color:black;
	text-align:left;
	padding:4px 20px;
	letter-spacing:2px;
	cursor:pointer;
	border-bottom:1px solid #BBB;
	text-shadow:2px 2px 3px rgba(0,0,0,.3);
}
TD.model > TABLE > TBODY > TR > TH.selected {
	background:darkorange;
	cursor:default;
	color:white;
	text-shadow:2px 2px 3px rgba(0,0,0,.5);
}
TD.model > TABLE > TBODY > TR > TH:hover:not(.selected) {
	background:DodgerBlue;
}
TD.model > TABLE > TBODY > TR > TH > SPAN.new, SPAN.model-new {
	position: relative;
	top: -0.5em;          /* 向上推移距離 */
	font:bold 10pt/1 cjfont;
	background:red;
	color:white;
	display:inline-block;
	border-radius:4px;
	padding:0 3px 1px;
	margin:2px;
	letter-spacing:1px;
	text-shadow:none;
}
TD.model > TABLE > TBODY > TR > TH > SPAN.doc {
	position: relative;
	top: -0.5em;          /* 向上推移距離 */
	font:bold 10pt/1 cjfont;
	background:white;
	color:black;
	display:inline-block;
	border:1px solid black;
	border-radius:4px;
	padding:1px 3px;
	margin:2px;
	letter-spacing:1px;
	text-shadow:none;
}

TD[class*="item-fac"] H1 {
}
TD[class*="item-fac"] H2 {
	font:bold 18pt/1.4 cjfont;
	text-align:left;
	margin:0 0 8px 0;
}
TD[class*="item-fac"] H3 {
	font:bold 15pt/1.4 cjfont;
	text-align:left;
	margin:8px 0 0;
}
TD[class*="item-fac"] H2 > SPAN {
	font:bold 12pt/1.4 cjfont;
	color:deeppink;
	text-shadow:1px 1px 2px rgba(0,0,0,.25);
}
TD[class*="item-fac"] DIV.title {
	font:bold 16pt/1.4 cjfont;
	text-align:left;
	margin:0 0 8px 0;
	white-space:nowrap;
}
TD[class*="item-fac"] DIV.title > B {
	color:darkorange;
}
TD[class*="item-fac"] DIV.title > SPAN {
	font:bold 12pt/1.4 cjfont;
	color:#08C;
}
TD[class*="item-fac"] DIV.subtitle {
	font:bold 13pt/1.4 cjfont;
}
TD[class*="item-fac"] DIV.img {
	display:inline-block;
	padding:0 0 15px 0;
	vertical-align:top;
}
TD[class*="item-fac"] DIV.img > IMG {
	width:350px;
	border:2px solid black;
}
TD[class*="item-fac"] DIV.descr {
	display:inline-block;
	font:normal 13pt/1.6 cjfont;
	letter-spacing:1px;
	vertical-align:top;
	text-align:justify;
}

TD.item-fac0 {
	vertical-align:top;
	font:bold 16pt/1.4 cjfont;
	text-align:center;
	letter-spacing:4px;
	padding:0 10px;
}
TD.item-fac0 > TABLE {
	width:100%;
}
TD.item-fac0 > TABLE > TBODY > TR:nth-of-type(even) {
	background:#F8F8F8;
}
TD.item-fac0 > TABLE > TBODY > TR > TD {
	font:normal 13pt/1.4 cjfont;
	letter-spacing:2px;
	padding:10px 30px 10px 10px;
}
TD.item-fac0 > TABLE > TBODY > TR:not(:last-child) > TD {
	border-bottom:1px solid #888;
}
TD.item-fac0 > TABLE > TBODY > TR > TD:first-child {
	width:1px;
	text-align:center;
	padding:2px;
	font:normal 12pt/1 cjfont;
	letter-spacing:0;
	color:#888;
}
TD.item-fac0 > TABLE > TBODY > TR > TD:nth-child(2) {
	font:bold 16pt/1.4 cjfont;
}
TD.item-fac0 > TABLE > TBODY > TR > TD:nth-child(2) SPAN {
	font:normal 12pt cjfont;
}
TD.item-fac0 > TABLE > TBODY > TR > TD.img {
	text-align:center;
}
TD.item-fac0 > TABLE > TBODY > TR > TD.img IMG {
	width:auto;
	height:100px;
	border:2px solid gray;
}
TD.item-fac0 > TABLE > TBODY > TR > TD.img IMG:hover {
	border:2px solid DodgerBlue;
	box-shadow:0 0 4px rgba(0,0,0,.6);
}

TD.item-fac1 {
}
TD.item-fac1 > TABLE > TBODY > TR > TD {
	vertical-align:top;
	font:normal 13pt/1.4 cjfont;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE {
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE > TBODY > TR > TD {
	vertical-align:top;
}

TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad-container {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad {
	display:inline-block;
	text-align:center;
	padding:10px;
	border: 1px solid #888;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV[class^="cad-img"] {
	display:inline-block;
	position:relative;
	border:2px solid white;
	cursor:pointer;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV[class^="cad-img"]:hover {
	border:2px solid blue;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV[class^="cad-img"] > IMG {
	position:relative;top:50%;transform:perspective(1px) translateY(-50%);
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV.cad-img-V {
	width:150px;
	height:200px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV.cad-img-H {
	width:200px;
	height:150px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV.cad-img-V > IMG {
	max-width:150px;
	max-height:200px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD DIV.cad > DIV.cad-img-H > IMG {
	max-width:200px;
	max-height:150px;
}

TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro {
	min-width:600px;
	max-width:1000px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD {
	padding:20px;
}
/* border & padding */
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR > TD {
	padding: 30px;
	vertical-align:top;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR:not(:last-child) > TD {
	border-bottom:2px dashed orange;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR > TD:first-child {
	padding-left:0;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR > TD:not(:last-child) {
	border-right:2px dashed orange;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR:first-child > TD {
	padding-top:0;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR > TD:first-child {
	padding-left:0;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR:last-child > TD {
	padding-bottom:0;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.intro > TBODY > TR > TD > TABLE > TBODY > TR > TD:last-child {
	padding-right:0;
}

TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.overview > TBODY > TR > TD {
	padding:0 30px 30px 10px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.test > TBODY > TR > TD {
	padding:10px 20px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.type > TBODY > TR > TD {
	padding:10px 20px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.color {
	white-space:nowrap;
	margin:0 0 20px 20px;
	border-collapse:collapse;
	background:white;
	box-shadow:1px 1px 2px rgba(0,0,0,.25);
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.color > TBODY > TR > TH {
	border:1px solid black;
	padding:4px 2px;
	width:75px;
	box-sizing:border-box;
	background:linear-gradient(#EEE,#FFF);
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.color > TBODY > TR > TD {
	border:1px solid black;
	padding:4px 2px;
	text-align:center;
	font-variant-emoji:emoji;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.photo > TBODY > TR > TD {
	padding:10px 20px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.photo > TBODY > TR > TD > DIV.photo-container {
	display:flex;
	flex-wrap:wrap;
	gap:20px;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.photo > TBODY > TR > TD > DIV.photo-container > DIV {
	display:inline-block;
	box-shadow:2px 2px 3px rgba(0,0,0,.4);
	border:2px solid black;
	background:#333;
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.photo > TBODY > TR > TD > DIV.photo-container > DIV:hover {
	box-shadow:2px 2px 4px rgba(0,0,0,.7);
	filter:saturate(4);
}
TD.item-fac1 > TABLE > TBODY > TR > TD > TABLE.photo > TBODY > TR > TD > DIV.photo-container > DIV > A > IMG {
	max-width:200px;
	max-height:150px;
	position:relative;top:50%;transform:perspective(1px) translateY(-50%);
}


TD.item-fac2 {
	vertical-align:top;
	font:bold 16pt/1.4 cjfont;
	text-align:center;
	letter-spacing:4px;
	padding:0 10px;
}
TD.item-fac2 > TABLE {
	width:100%;
}
TD.item-fac2 > TABLE > TBODY > TR:nth-of-type(even) {
	background:#F8F8F8;
}
TD.item-fac2 > TABLE > TBODY > TR > TD {
	font:bold 16pt/1.4 cjfont;
	letter-spacing:2px;
	padding:10px 30px 10px 10px;
}
TD.item-fac2 > TABLE > TBODY > TR:not(:last-child) > TD {
	border-bottom:1px solid #888;
}
TD.item-fac2 > TABLE > TBODY > TR > TD:first-child {
	width:1px;
	text-align:center;
	padding:2px;
	font:normal 12pt/1 cjfont;
	letter-spacing:0;
	color:#888;
}
TD.item-fac2 > TABLE > TBODY > TR > TD:nth-child(2) > TABLE {
	width:100%;
}
TD.item-fac2 > TABLE > TBODY > TR > TD:nth-child(2) > TABLE > TBODY > TR > TD {
	font:bold 16pt/1.4 cjfont;
	letter-spacing:2px;
	padding:0;
}
TD.item-fac2 > TABLE > TBODY > TR > TD:nth-child(2) > TABLE > TBODY > TR > TD > SPAN {
	font:normal 14pt cjfont;
}
TD.item-fac2 > TABLE > TBODY > TR TD.img {
	text-align:right;
}
TD.item-fac2 > TABLE > TBODY > TR TD.img IMG {
	width:auto;
	height:100px;
	border:2px solid gray;
}
TD.item-fac2 > TABLE > TBODY > TR TD.img IMG:hover {
	border:2px solid DodgerBlue;
	box-shadow:0 0 4px rgba(0,0,0,.6);
}
TD.item-fac2 DIV.qa-sec {
	font:bold 16pt/1 cjfont;
	padding:40px 4px 10px;
	border-top:3px solid #CCC;
	margin-top:30px;
	position:relative;
}
TD.item-fac2 DIV.qa-sec > DIV.qa-sec-toggle {
	display:inline-block;
	white-space:nowrap;
	position:absolute;
	top:30px;
	right:20px;
	font:normal 11pt/1 cjfont;
	letter-spacing:0;
	cursor:pointer;
	color:blue;
}
TD.item-fac2 DIV.q {
	font:bold 14pt/1.6 cjfont;
	letter-spacing:2px;
	padding:15px 15px 5px;
	color:blue;
	border-top:1px dotted #8CF;
	margin:0 0 0 10px;
	cursor:pointer;
}
TD.item-fac2 DIV.q1 {
	border-top:0;
	margin:0 0 0 10px;
}
/* 必須符合這三層結構，才能利用 grid-template-rows 進行動態開合，若更動會失效 */
TD.item-fac2 DIV.a {
	margin-left:45px;
	width:90%;
	font:normal 12pt/1.6 cjfont;
	letter-spacing:2px;
	padding:5px;
	text-align:justify;

	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	transition: grid-template-rows .25s ease, opacity .25s ease;
}
TD.item-fac2 DIV.faq.show > DIV.a {
	grid-template-rows: 1fr;
	opacity: 1;
	transition: grid-template-rows .25s ease, opacity .25s ease;
}
TD.item-fac2 DIV.faq > DIV.a > DIV {
	min-height: 0;
	overflow: hidden;
}


/* adm stuff - models & items */
DIV.adm-panel {
	display:none;
}
DIV.adm-panel > DIV {
	display:inline-block;
	border:1px solid #888;
	border-radius:12px;
	background:deeppink;
	color:white;
	font:normal 12pt/1 cjfont;
	padding:2px 10px 1px 12px;
	cursor:pointer;
	letter-spacing:2px;
} 
DIV.adm-panel.being-adm {
	/*display:inline-block;*/
	/*因為要換行，必須是 block*/
	display:block;
}
DIV.adm-panel > DIV:hover {
	border:1px solid black;
	box-shadow:0 0 6px rgba(0,0,0,1);
	font-weight:bold;
} 
DIV.adm-panel > DIV:first-child {
	border-radius:12px 0 0 12px;
} 
DIV.adm-panel > DIV:last-child {
	border-radius:0 12px 12px 0;
} 
DIV.adm-panel > DIV:not(:last-child) {
	margin-right:1px;
} 
DIV.adm-panel > DIV.obj-edit {
	letter-spacing:6px;
	padding:2px 16px 1px 26px;
} 
DIV.adm-panel > DIV.obj-edit:hover {
	background:DodgerBlue;
} 
DIV.adm-panel > DIV.obj-del {
	padding:2px 4px 1px 6px;
	background:#333;
} 
DIV.adm-panel > DIV.obj-del:hover {
	background:#C00;
} 

DIV.adm-panel.adm-model.being-adm {
	display:inline-block;
	float:right;
	margin-top:4px;
}
DIV.adm-panel.adm-model > DIV.obj-edit {
	letter-spacing:2px;
	padding:2px 8px 1px 12px;
} 
DIV.adm-panel.adm-model > DIV.obj-edit:hover {
	background:#0A0;
} 


/************************************/
/* [fac2] */
/************************************/
/* rewrite ycal-info.css */
TABLE.info-ycal {
	margin:8px 0;
}
TABLE.info-ycal > TBODY > TR > TH {
	padding:0;
	height:50px;
}
TABLE.info-ycal > TBODY > TR:nth-child(1) > TH {
	font-size:14pt;
	height:auto;
}
TABLE.info-ycal > TBODY > TR:nth-child(2) > TH {
	font-size:12pt;
	height:auto;
}
TABLE.info-ycal > TBODY > TR > TH > DIV.day {
	font-size:12pt;
}
TABLE.info-ycal > TBODY > TR > TH > DIV.val {
	white-space:normal;
	font-size:13pt;
	color:black;
	background:#FFD;
}


/************************************/
/* [home] */
/************************************/
TABLE.home {
	width:100%;
}
TABLE.home DIV.home {
	width:80%;
	padding:20px 40px;
	font:bold 13pt/1 cjfont;

	display:inline-block;
	position: relative;

	background-color: white;
	border: 1px solid #AAA;
/*
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.27), 0 0 10px rgba(40, 40, 0, 0.2) inset;
*/
	box-shadow: 0 10px 80px rgba(0, 0, 0, 0.1);
}
/*
TABLE.home DIV.home:before {
	transform: skew(-15deg) rotate(-6deg);
	left: 50px;
}
TABLE.home DIV.home:after {
	transform: skew(15deg) rotate(6deg);
	right: 50px;
}
TABLE.home DIV.home:before, TABLE.home DIV.home:after {
	width: 70%;
	height: 35%;
	content: ' ';

	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);

	position: absolute;
	bottom: 50px;
	z-index: -1;	
}
*/
TABLE.home DIV.home > TABLE {
	table-layout: fixed;
	width:100%;
}

TABLE.home H1,
TABLE.home H2 {
	margin:10px 10px 10px 0;
	color:#00A;
	letter-spacing:2px;
}

TABLE.home DIV.article H1,
TABLE.home DIV.article H2,
TABLE.home DIV.article H3  {
	margin:10px 10px 15px 0;
	color:#00A;
	letter-spacing:2px;
}
TABLE.home DIV.article H1 > SPAN {
	border-bottom:3px double #00A;
	padding:0 6px;
}
TABLE.home DIV.article H3  {
	margin-left:-40px;
}
TABLE.home DIV.article DIV.p {
	text-indent:2em;
	margin-bottom:35px;
	font:normal 14pt/1.8 cjfont;
	text-align:justify;
	letter-spacing:2px;
}
TABLE.home DIV.article HR {
	background: #CCC;
	margin-bottom:40px;
}

TABLE.home DIV.article DIV.sec {
	padding:0 40px;
	font-size:0;
}
TABLE.home DIV.article DIV.text {
	text-indent:2em;
	font:normal 14pt/1.8 cjfont;
	font-size:14pt;
	text-align:justify;
	letter-spacing:2px;
}
TABLE.home DIV.article DIV.block {
	display:inline-block;
	width:200px;
	height:180px;
	padding:10px;
	border:1px solid black;
	vertical-align: top;
	margin-bottom:35px;
}
TABLE.home DIV.article DIV.block > TABLE {
	width:100%;
	text-align:center;
}
TABLE.home DIV.article DIV.block > TABLE > TBODY > TR > TD > DIV {
	display:inline-block;
	width:200px;
	height:150px;
}
TABLE.home DIV.article DIV.block > TABLE > TBODY > TR > TD > DIV > IMG {
	width:200px;
	max-height:150px;
	border:1px solid gray;
	cursor:pointer;
}
TABLE.home DIV.article DIV.block > TABLE > TBODY > TR:nth-child(2) > TD {
	font:bold 14pt/1 cjfont;
	height:30px;
	padding:10px 0 0 0;
}
TABLE.home DIV.article DIV.arrow {
	display:inline-block;
	height:180px;
	position:relative;
	vertical-align: top;
	padding:10px 0;
	margin:0 10px;
}
TABLE.home DIV.article DIV.arrow > IMG {
	width:40px;
	height:40px;
}

TABLE.home DIV.map-container {
	text-align: left;
	white-space: nowrap;
}
TABLE.home DIV.map-item {
	display: inline-block;
	vertical-align: top;
	width: 25%; /* 三等分頁面寬度 */
	margin: 0 1%;
	box-sizing: border-box;
	white-space: normal;
	font:normal 13pt/1.5 cjfont;
}
TABLE.home DIV.map-wrapper {
	position: relative;
}
TABLE.home DIV.map-wrapper iframe {
	width: 100%;
	height: 70px;
	border: 2px solid black;
	box-shadow: 1px 1px 3px rgba(0,0,0,.5);
}

TABLE.home SPAN[class^="news-top"] {
	font:normal 10pt/1 cjfont;
	padding:2px 6px 1px;
	border-radius:3px;
	margin:0 0 0 3px;
}
TABLE.home SPAN.news-top {
	color:white;
	background:#08C;
}
TABLE.home SPAN.news-top-product {
	color:white;
	background:#04A;
}
TABLE.home SPAN.news-top-knowledge {
	color:white;
	background:#080;
}
TABLE.home SPAN.news-new {
	font:bold 8pt/1 cjfont;
	color:white;
	background:#C00;
	padding:0 6px 1px;
	border-radius:3px;
	margin:0 0 0 3px;
}
TABLE.home S {
	text-decoration:none;
	font-size:8pt;
}

/************************************/
/* [misc] */
/************************************/
/*【Loading Animation】*/
DIV.waiting-overlay {
	position:fixed;
	left:0;
	top:0;
	width:100vw;
	height:100vh;
	min-height:0;
	background:white;
	opacity:.5;
	z-index:9998;
}
DIV.waiting-container {
	position:fixed;
	width:500px;
	height:400px;
	z-index:9999;
}
DIV.lds-progressbar {
	position:absolute;
	left:-4px;
	top:320px;
	display: inline-block;
	width:500px;
	height:30px;
	background:#666;
	border-radius:33px;
	border:4px solid black;
	overflow:hidden;
	text-align:center;
}
DIV.lds-progress {
	position:absolute;
	left:0;
	top:0;
	display: inline-block;
	height:30px;
	background:#58D;
	border-radius:33px;
}
DIV.lds-progressbar > TABLE {
	width:100%;
	color:white;
	white-space:nowrap;
}
DIV.lds-progressbar > TABLE > TBODY > TR > TD:nth-child(1) {
	width:35%;
	padding-left:12px;
	font:normal 9pt/1 cjfont;
}
DIV.lds-progressbar > TABLE > TBODY > TR > TD:nth-child(2) {
	width:30%;
	color:white;
	letter-spacing:1px;
	font:normal 10pt/1 cjfont;
	padding:0 10px;
}
DIV.lds-progressbar > TABLE > TBODY > TR > TD:nth-child(3) {
	width:35%;
	padding-right:12px;
}
DIV.lds-progressbar > TABLE > TBODY > TR > TD:nth-child(3) > DIV {
	display: inline-block;
	width:50px;
	height:16px;
	overflow:hidden;
	background:white;
	color:black;
	border-radius:2px;
	padding:4px 6px 0;
	letter-spacing:1px;
	font:bold 11pt/1 cjfont;
}
DIV.lds-progressbar > TABLE > TBODY > TR > TD:nth-child(3) > DIV > SPAN {
	display: inline-block;
	padding-right:3px;
}
DIV.lds-spinner {
	position:absolute;
	left:calc(200px - 40px);
	top:calc(200px - 150px);
	color: official;
	display: inline-block;
	width: 400px;
	height: 400px;
}
DIV.lds-spinner > DIV {
	transform-origin: 40px 40px;
	animation: lds-spinner 1.2s linear infinite;
}
DIV.lds-spinner > DIV:after {
	content: " ";
	display: block;
	position: absolute;
/*
	top: 77px;
	left: 37px;
	width: 12px;
	height: 50px;
*/
	top: 77px;
	left: 33px;
	width: 15px;
	height: 100px;
	border-radius: 20%;
	background: #444;
	background: darkblue;
}
DIV.lds-spinner > DIV:nth-child(1)  {transform: rotate(0deg);   animation-delay: -1.1s;}
DIV.lds-spinner > DIV:nth-child(2)  {transform: rotate(30deg);  animation-delay: -1s;  }
DIV.lds-spinner > DIV:nth-child(3)  {transform: rotate(60deg);  animation-delay: -0.9s;}
DIV.lds-spinner > DIV:nth-child(4)  {transform: rotate(90deg);  animation-delay: -0.8s;}
DIV.lds-spinner > DIV:nth-child(5)  {transform: rotate(120deg); animation-delay: -0.7s;}
DIV.lds-spinner > DIV:nth-child(6)  {transform: rotate(150deg); animation-delay: -0.6s;}
DIV.lds-spinner > DIV:nth-child(7)  {transform: rotate(180deg); animation-delay: -0.5s;}
DIV.lds-spinner > DIV:nth-child(8)  {transform: rotate(210deg); animation-delay: -0.4s;}
DIV.lds-spinner > DIV:nth-child(9)  {transform: rotate(240deg); animation-delay: -0.3s;}
DIV.lds-spinner > DIV:nth-child(10) {transform: rotate(270deg); animation-delay: -0.2s;}
DIV.lds-spinner > DIV:nth-child(11) {transform: rotate(300deg); animation-delay: -0.1s;}
DIV.lds-spinner > DIV:nth-child(12) {transform: rotate(330deg); animation-delay:  0s;  }
@keyframes lds-spinner {0% {opacity:1} 100% {opacity:0}}
/* end of waiting */

#b2b-gotop, #b2b-gobottom {
	width:40px;
	height:40px;
	position:fixed;
	right:20px;
	cursor:pointer;
	z-index:10;
	filter:drop-shadow(0 0 1px white) drop-shadow(0 0 1px white) drop-shadow(0 0 1px white) drop-shadow(0 0 1px white);
	opacity:0;
	transition:opacity 600ms ;
}
#b2b-gotop {
  bottom:85px;
}
#b2b-gobottom {
  transform:scaleY(-1);
	bottom:30px;
}
#b2b-gotop:hover, #b2b-gobottom:hover {
  filter:saturate(3) drop-shadow(0 0 1px white) drop-shadow(0 0 1px white) drop-shadow(0 0 1px white) drop-shadow(0 0 1px white);
}