@charset "UTF-8";
/* @font-face { font-family: '標楷體2', '標楷體'; src: local('標楷體'); } */
@font-face { font-family:'標楷體2'; src:local('標楷體'); }
@font-face { font-family:'標楷體2'; src:url('concised-dict.woff') format('truetype'); font-display:swap; }
@font-face { font-family:'標楷體2'; src:local('Times New Roman'); unicode-range: U+00-024F; }

/*
#d2c0ac 棕色

*/
:root 
{
	--colorR: #D24349; /* #F66867; */
	--colorRd: #833433;
	--colorG: #4A803C;
	--colorGd: #457939;
	--colorG2: #368180;
	
	--colorO: #B95C20; /* 澄 */

	--colorB:#2c6b85; /* #44A4CC; */
	--colorBd: #225266;
	--colorGy: #333; /* 灰 */
	--colorGa: #876F6B; /* 棕 */
	
	--colorCY:#108485; /* 青 */
	--colorCYd:#084243;
	--colorCYl:#acdcdc;
	
	--colorPu:#716fa5; /* 紫 #7673A8*/
}

 cr, red, .colorR { color:var(--colorR); }
.colorG { color:var(--colorG); }
 cb, .colorB { color:var(--colorB); }
 cyan { color:var(--colorCY); }
 gray { color:#757575; }
 gray3 { color:var(--colorGy); }
 greenD { color:var(--colorGd); }
 
 sub2 { font-size:0.6em; color:#757575; }
 blue { color:blue; }

 flex, .flex { display:flex !important; }
 idiv, .idiv { display:inline-block; }
 requ { color:red; }
 left, .left { display:block; text-align:left; }
 right, .right { display:block; text-align:right; }
 cen, .center { display:block; text-align:center; }
 nbr { white-space:nowrap; }
 

 * { box-sizing: border-box; }
 body { font-family:'Times New Roman', '微軟正黑體', '正黑體'; }
 input, select, option { border:0; max-width:100%; padding:0 0.3em; background-color:#fff; color:#000; font-size:1em; height:2em; line-height:2; vertical-align: middle; font-family:標楷體2; }
 select:hover, select:focus, input:hover, input:focus { background-color:#ffa; }
 
 a	{ text-decoration:none; color:var(--colorB); }
 a[data-title], .pwMd #view a[title] { position:relative; margin:0 0.1em; text-decoration:underline dotted; }
 a[data-title]:hover, #view a[title]:hover, a[data-title]:focus, #view a[title]:focus { background-color:#ff8; }
 /* a[title]:hover:after, a[title]:focus:after,  */
 a[data-title]:hover:after, a[data-title]:focus:after { content:attr(data-title); display:block; z-index:1;
 position:absolute; left:-5em; top:1.2em;
 border:1px solid; background-color: #fffe; white-space:pre; font-family:微軟正黑體; color:#000; }
 /* a[title]:hover:after, a[title]:focus:after { content:attr(title); } */

 a:hover	{ text-decoration:none; color:var(--colorBd); }
 a:focus	{ border:3px dashed #f00; border-radius:0.3em; }
 *[data-link], *[data-replace], *[data-href] { cursor:pointer; }
 span[data-link]:hover, span[data-replace]:hover, span[data-href]:hover, div[data-link]:hover, div[data-replace]:hover, div[data-href]:hover 
 { text-decoration:underline; }
 html[data-url] { cursor:initial; }
 body { margin:0px; }
 form { display:inline; }
 table { border-collapse:collapse; }
 img { max-width:100vw; }
 
 datalist>* { font-size:2em; }
 
 fieldset.nowrap>label, label.nowrap { display:inline-block; white-space:nowrap; }
 
 fieldset>nobr>label { display:inline-block; border:1px dashed #fff0; padding:0.1em; border-radius:0.3em; }
 fieldset>nobr>label:hover,  fieldset>nobr>label:focus { border-color:#888; }

/* element */

 input { font-family:'標楷體2'; }
 input[type=submit], input[type=button], input[type=reset] { font-family:'微軟正黑體', '正黑體'; }
 input[type=radio] { width:1em; height:0.9em; vertical-align:text-top; }
 input::-webkit-input-placeholder, input::placeholder { color:#888; }
 input[data]::-webkit-calendar-picker-indicator {  }

 select[data-button] { height:2em; padding-right:3.5em; border:0;
 background: #fff 100% 0/contain no-repeat;
 -webkit-appearance: none; -moz-appearance: none; appearance: none; }
 select[data-button=selectR] { background-image:url('img/selectR.png'); }
 select[data-button=selectCy] { background-image:url('img/selectCy.png'); }
 select[data-button]:hover, select[data-button]:focus { background-color:#ffa; }

 
 select:not(:-internal-list-box) { background-color:blue; }
 select:-internal-list-box { background-color:red; }
 select option:hover, select option:focus, select option:active, select option:checked
 { background-color:red; color:#fff; }

 label>select { min-width:5em; margin-left:0.5em; border-radius:0.3em; }
 label>select::after { content:'▼'; display:block; width:1.6em; height:1.6em; text-align:center; background-color:var(--colorCY); color:#FFF; }


 label[data-head] { display:inline-block; min-width:10em; margin:0.5em 1em 0.5em 0; }
 label[data-head]::before 
 { content:attr(data-head); display: inline-block; line-height:1.4; margin-right: 0.5em; padding:0 0.4em;
 border-radius:1em; background:var(--colorR); text-align:center; color:#FFF; }

[data-pre]::before { content:attr(data-pre); color:#888; font-size:0.6em; }


body main .close { display:none; }
body main.pwMd .close { display:inline; display: initial; }
body main.pwMd tr.close { display:table-row; }
body main.pwMd div.close, body main.pwMd p.close { display:block; }

/* body>header h4, nav>h4, header>h4, footer>h4, nav>h4,  */
 h1, h6, nav>h3, section>h3, section>h4, .hide
 { position:absolute; left:-1000vw; top:-100vh; background-color:#000; color:#fff; }
.hide:focus { left:0; top:5px; color:#fff; background:#000; }

 /* section>h3, nav>h3, nav>h4 { right:100vw; } */

.nobr>label { white-space:nowrap; }
 nobr.ph { font-family: 標楷體2, 標楷體; }
.ph, .ph th, .ph td { font-family: 標楷體2, 標楷體, 標楷體 !important; }
.ph sup { position:relative; font-size:0.7em; left:-0.6em; top:-0.6em;
 margin-top: 0.5em; display: inline-block; text-indent:0; font-family:標楷體2, 標楷體; }
.ph nobr, nobr.ph { position:relative; }
.ph.v { display: inline-block; width:1em; white-space: pre-wrap; font-size: 0.3em; }
.ph.v sup {}
.ph sub { color:var(--colorR); }

 phon { border: 0px dashed #ccc; border-radius: 0.3em; padding-top: 0.5em; 
 font-family:標楷體2, 標楷體; white-space:nowrap; font-size:0.9em; }
 phon * { background-color:initial; }
 phon>sup { position:relative; font-size:0.7em; left:-0.6em; top:-0.6em;
 margin-top: 0.5em; margin-right:-0.5em; display: inline-block; text-indent:0; }
 phon>sub { position:relative; font-size:0.7em; left:-0.4em; color:var(--colorR); }
 phon+div { display:inline-block; }

.pwMd phon:after { content:'。'; position: relative; left: -0.4em; font-size: 0.7em; color: var(--colorR); }

/* item */






.noteBar {  max-width: 990px; text-align: right; margin: auto; }
.note, .btn, a.btn2, input.btn2, .btn2>a
  { display:inline-block; background:var(--colorR); margin:0.1em 0.3em; padding:0 1em; border:0; border-radius:0.2em;
 line-height:2; font-size:1em; text-align:center; vertical-align:middle; color:#fff; }
.note:hover, .note:active, .note:focus, .btn:hover, .btn:active, .btn:focus
 { background:#a40a0a; color:#fff; }
.note::before { content:'📕 '; }

 a.btn2, input.btn2, .btn2>a { background:var(--colorG2); }

.pagerH { font-size:1.5em; margin:0.5em 0; }
.pagerH>* { display:inline-block; border:1px solid #ccc; padding:0.2em 0.5em; line-height:1; }
.pagerH a:hover { background-color:#ddd;  }
.pagerH .act { background-color:var(--colorB); color:#fff;  }


/* head */
 body>header { background-color:#F2F2F2; }
 
 body>header>div:first-child { background-color:#3D3D3D; }
 body>header>*>div { display:flow-root; max-width:1100px; min-height:3em; margin:auto; color:#fff; }
 
 main { display:flow-root; min-height:calc(100vh - 290px - 9em); background:#E9E0D6; padding:1em 0.5em 2em 0.5em; }
.fme8, .fme11, .fme13 { max-width:100%; margin:auto; padding:0; }
.fme8 { width:800px; }
.fme11 { width:1100px; }
.fme13 { width:1300px; }
 
 main>section>h3 { display:block; margin:0; margin-bottom:1em; border-bottom:1px solid #ccc; font-size:1.5em; }
 main>section>h3:before { color:var(--colorR) !important; margin-right:0.3em; font-size:1.2em !important; }
 
/* top menu */
.menu1 { display:inline; }
 body>header>section>div>a { vertical-align:middle; line-height:50px; }
 body>header>section>div>a>img { vertical-align:middle; }

.menu1>nav { display:inline-block; float:right; }
.menu1>nav a { display:inline-block; color:#fff; padding:0.1em; margin:0.6em 0.2em; vertical-align:middle; }
.menu1>nav a:hover, .menu1>nav a:focus { background:#ff0; color:#3D3D3D; } 
.menu1>nav a>img { vertical-align:middle; }
.menu1>nav a.gear { font-size:1.5em; line-height:1; margin:0.2em; }
.menu1>span { display:none; font-size:1.3em; }
.menu1>nav a.lang { border:1px solid #fff; }

.banner1 { }
.banner1>a>img { max-width:100vw; }
.banner2>a>img { max-width:100vw; vertical-align:top; }


.banner2 { text-align:right; }
.banner2>* { display:inline-block; }
.banner2>a { float:left; }
.banner2>div { width:550px; max-width:100vw; }
.banner2 nav { display:block; text-align:center; }
.banner2 nav a { display:inline-block; min-width:calc(25% - 10px); height:50px; line-height: 50px; margin:5px; padding:0 0.5em; border-radius:0.3em; color:#fff; white-space:nowrap; }
.banner2 nav a:hover, .banner2 nav a:active, .banner2 nav a:focus { color:#000; }
.banner2 nav a:hover, .banner2 nav a:active, .banner2 nav a:focus { color:#000; }
.banner2 nav a.line1 { width:calc(50% - 10px); }

.banner2 form { display:block; text-align:right; margin-top:0.5em; padding-right:5px; }
.banner2 form input { height:1.5em; vertical-align:middle; border-width:0px; font-size:1.3334em; }
.banner2 form input[type=text] { width:115px; }
.banner2 form input[type=image] { background-color:var(--colorG2); }
.banner2 form input[type=submit] { width:1.333em; height:1.333em; padding:0; line-height:1.333; font-size:1.5em; background:var(--colorG2); color:#fff; }


#mainContent { line-height:3; } 

#mainContent h2, #mainContent>div>h3 { display:inline; margin:0; padding:0; font-size:1em; }
#mainContent a { color:#fff; }

/* home */

#home { text-align:center; }
#home nav { font-size:2.25em; }
#home nav>a { display:inline-block; width:310px; min-height:180px; border-radius:0.2em;
 margin:15px; vertical-align:top; color:#fff; }
#home nav>a:hover, #home nav>a:active, #home nav>a:focus { color:#000; }
#home nav>a>img { margin:0.8em; vertical-align:middle; }
#home nav>a:hover>img, #home nav>a:active>img, #home nav>a:focus>img { filter: invert(1); }


/* search */

.searchTp { display:block; padding:0.2em; }
.searchTp:hover { background:#ffc; }
.searchTp>label, .ext>legend>label { display:block; font-weight:bold; }

.ext { border:0; margin:0; padding:0; }
.ext>legend { padding:0; }
.ext>fieldset { display:block; border:0; padding:0; }

.ext>nobr { font-size:0.7em; }
.ext>nobr input[type] { position:relative; bottom:0em; width:1em; height:1em; color:#B95E00; }
.ext>nobr input[type]:before { content:' '; position: absolute; display: inline-block; border:1px solid #fff; text-align:center; background-color:#fff; } 
.ext>nobr input[type]:hover::before { background-color:#bbb; color: #000; }
 
.ext>nobr input[type=checkbox]::before { border-radius:3px; width:0.9em; height:0.9em; line-height:90%; }
.ext>nobr input[type=checkbox]:checked::before { content:'✔'; }

.ext>nobr input[type=radio]::before { border-radius:50%; width:1em; height:1em; line-height:1;
 font-size: 0.9em; }
.ext>nobr input[type=radio]:checked::before { content:'●'; }




#searchF { user-select: none; }
#searchF>* { margin:0.5em 1em 0.5em 0; }
#searchF input[type=checkbox], #searchF input[type=radio] { width:1em; height:1em; vertical-align:baseline; }

#searchF input[type=checkbox], #searchF input[type=radio] {  }

#searchF .adv { }
#searchF .adv>* { display:block; }
#searchF .adv>fieldset { border:0; border-bottom:1px solid #d2c0ac; margin:0; padding:0.5em 0; }
#searchF .adv>fieldset>legend, #searchF .adv>label>span
 { display:inline-block; float:left; min-width:6em; padding:0; line-height:2; font-weight:bold; color:#000; }
 
#searchF .adv>fieldset>legend::before, #searchF .adv>label::before
 { content:'■'; color:var(--colorCY); }
#searchF .adv>fieldset>input { margin:0 0.5em; }
#searchF .adv fieldset input {  }
 
#searchF .adv>label { display:block; padding:0.5em 0; }
#searchF .adv>label>span { float:initial; }



#dictL { width:100%; }

.line>input { font-size:1.5em; height:2em; vertical-align:middle; border:0; border-radius:0.2em; }
.line>input:first-child { width:100%; padding-right:6.2em; }
.line>input:last-child { width:6em; margin-left:-6em; background:var(--colorG2); color:#FFF; text-align:center; border-radius:0 0.2em 0.2em 0; }
.line>input:last-child:hover, .line>input:last-child:focus { background:var(--colorG2); }

.keyboardBar { display:flow-root; }
.keyboardBar a[id] { display:inline-block; min-width:9em; margin-right:1em; padding:0 0.5em;
 border:0; border-radius:0.2em;
 background:#fff; text-align:center; color:#333; line-height:2; }
.keyboardBar a[id].act { background:var(--colorR); color:#fff; }
.keyboardBar a[id]:hover { background:var(--colorRd); color:#fff; }
.keyboardBar a[id]:before { content:'⌨️'; }

.keyboardBar a:nth-child(3) { float:right; color:var(--colorCY); }


.keyboard { overflow:auto; background:#fff; border-radius:0.3em; margin:0.2em 0; }
.keyboard>table { margin:auto; }
.keyboard tr { text-align:center; }
.keyboard input { width:3em; height:3em; text-align:center; margin:0.1em; line-height:2.5; border:0; border-radius:0.2em; color:#000; font-family:'標楷體2', '標楷體';  }
.keyboard input.sp { width:6.3em; }


/* index search */

.selectL { font-size:1.5em; }
.selectL, label+.hr1 { display:block; position:relative; border-top:1px solid #d2c0ac; margin-top:1em; padding-top:1em;
 }
.selectL::before, label+.hr1::before { content:'▼'; position:absolute; left:50%; top:-0.5em; width:3em; margin:0 -1.5em; background-color:#E9E0D6; color:var(--colorR); text-align:center; }


.selectL>h4 { position:relative; left:0; top:0; display:block; margin:1em 0;
 font-family:正黑體, 微軟正黑體; color:inherit; background:inherit; }
.selectL>h4::before { content:'■'; color:var(--colorCY); vertical-align:bottom; line-height:1.5; margin-right:0.5em; }


.selectL a { display:inline-block; min-width:3.9em; height:2em; margin:0.3em; padding:0.5em;
 border-radius:0.2em; background:#FFF; color:#333; text-align:center; vertical-align:middle; font-family:'標楷體2', '標楷體'; }
.selectL a:hover, .selectL a:focus, .list a:hover, .list a:active { background:var(--colorCY); color:#FFF; }
.selectL.ph a sup { margin:0; }
.selectL a>sub { font-size:0.5em; }

.l5>a { width:5em; }
.l4>a { width:4em; }

 a[data-num] { position:relative; }
 a[data-num]::after { content:attr(data-num); position:absolute; color:#ccc; top:0; right:1px; font-size:0.6em; }

.rad { font-family:'標楷體2', '標楷體';}
.rad option { font-family:'標楷體2', '標楷體';}


/* list */

.searchInf { padding:1em 0; line-height:1.5; }

.searchL { width:100%; border-bottom: 4px #888 solid; margin-bottom:1em; border-spacing:0px; }
.searchL th, #searchL>tbody td #searchL td.panel { padding:5px; font-size:1.5em; }

.searchL .panel { padding:0; }
.searchL .panel>a { display:inline-block; width:10em; max-width:40vw; border-radius:0.3em 0.3em 0 0; background-color:var(--colorCYl); text-align:center; color:#fff; line-height:2; }
.searchL .panel>a.act { background-color:var(--colorCY); }
.searchL .panel>a:hover, .searchL .panel>a:focus { color:#000; }

.searchL th { vertical-align:top; background-color:var(--colorCY); line-height:2; color:#FFF; font-family:'Times New Roman', 正黑體, 微軟正黑體; }
.searchL th label { font-size:0.5em; }
.searchL th fieldset { display:inline; padding:0; border:0; }
.searchL th legend { float:left; }


.searchL>tbody { background-color:#FFF; }
.searchL>tbody>tr:nth-child(even) { background-color:#eee; }
.searchL>tbody>tr:hover { background-color:#edc; }
.searchL>tbody>tr[onclick]:hover { cursor:pointer; }

.searchL>tbody td { font-size:1.5em; }
.searchL>tbody td { text-align:left; font-family:'標楷體2', '標楷體'; padding:0.5em 0; }
.searchL>tbody td:first-child { text-align:center; color: #666; width:4em; }
.searchL>tbody td a { color:var(--colorCY); }
.searchL>tbody td input[type=checkbox] { width:1em; height:1em; vertical-align: middle; }

#searchL>tbody>tr>td:nth-child(3) {  }

#searchF input[type=text]::placeholder { font-size:0.8em; }


.list1 { position:relative; display:block; }
.list1 .pager { position:absolute; right:-5.5em; top:0; width:5em; height:100%; min-height:14em; padding-top:3.6em; }
.list1 .pager a{ display:inline-block; width:5em; min-height:5em; background: #fff; color:#000;
 border-radius: 0.5em; text-align:center; line-height:2; }
.list1 .pager a:first-child {  }
.list1 .pager a:nth-child(2) { position:absolute; left:0; bottom:0; }

.list1 .pager a:first-child::before, .list1 .pager a:last-child::after
 { display:block; font-size:2em; color:var(--colorR); line-height:1; }
.list1 .pager a:first-child::before { content:'︿'; }
.list1 .pager a:nth-child(2)::after { content:'﹀'; margin-top:0.5em; }

.list1 .pager2 { text-align:center; }
.list1 .pager2 a{ display:inline-block; width:5em; height:3em; margin:0.2em; background: #fff; font-size:1.5em; color:#000;
 border-radius: 0.5em; line-height:3; }
.list1 .pager2 a.act{ background:var(--colorR); color:#fff; }


.pager3 { margin:0.5em 0; text-align:center; }
.pager3 a, .pager3 .act { display:inline-block; border:1px solid #888888; padding:0 0.5em; line-height:2; background-color:#ffffff; color:#444444;
 border-radius: 0.2em; text-align:center; }
.pager3 .act { background-color:var(--colorCY); color:#ffffff; }
.pager3 a:hover { background-color:var(--colorCYl); }



/* view */

.view { background-color:#fff; border-radius:0.3em; margin-bottom:1em; font-size:1.5em; font-family:標楷體2, 標楷體; }

.view>div, .view>section { border-top:1px solid #E9E0D6; padding:0.3em 1em; line-height:1.5; }
.view h3 { display:inline-block; margin:0; padding:0.5em 0;  font:normal 1.5em 標楷體2, 標楷體; }
.view h3::before { content:'【'; color:#000; }
.view h3::after { content:'】'; color:#000; }
.view h4 { position:initial; display:inline-block; border-bottom:3px solid var(--colorR); margin:0 0 0.5em 0; padding:0.2em 0; font-family:正黑體, 微軟正黑體; color:#000; background:#fff0; }

.view b { display:inline-block; margin-right:0.2em; padding:0.1em; line-height: 1;
 border-radius:0.2em; background-color:#C00; color:#fff;
 vertical-align:middle; font-family:正黑體, 微軟正黑體; }
.view mark {  }
.view ib>mark {  }
.view>* ol { margin:0; }
.view>* ol>li { margin-bottom:0.7em; padding-bottom:0.2em; border-bottom:0.1em solid #ccc; }

.view>* ol.l2 { list-style:none; padding-left:3em; counter-reset:list; }
.view>* ol.l2>li { position:relative; }
.view>* ol.l2>li::before { position:absolute; left:-1.7em;
 content: "(" counter(list, decimal-leading-zero) ") "; counter-increment:list; font-family:"Times New Roman"; }
.view>* ol.l2 li::marker { font-family:標楷體2; }




 ex { display:inline-block; background:#830; border-radius:0.2em; }

.bar { display:flow-root; margin:1em 0; }
.bar>div { float:right; }
.link1>a { display:inline-block; background:#fff; border-radius:0.2em; margin:0 0.3em; padding:0 1.5em; line-height:2; color:#000; }
.link1>a:hover, .link1>a:active, .link1>a:focus { background:#ccc; }

.pic img { display:block; margin:auto; max-width:calc(100vw - 3em); }

.play { color:var(--colorR); }

figure { display:inline-block; margin:auto; text-align:center; }
figcaption {  }

.size1 { font-size:1em; }
.size3 { font-size:2em; }

a#size1, a#size2, a#size3 { background-color:var(--colorR); border-radius:0.1em; color:#fff; margin:0 0.2em; line-height:1; vertical-align:middle; }
a#size1 { padding:0.75em; font-size:0.8em; }
a#size2 { padding:0.5em; }
a#size3 { padding:0.3em; font-size:1.25em; }

.blk>div { display:inline-block; }

.ph2 { border-bottom:3px double #888; margin:0.2em 0; padding:0.1em; }

.on {}

/* append */

.appendL { padding:0.5em; }
.appendL a { display:block; border-radius:0.2em;
 padding:0.6em 0; background:#ffffff;
 text-align:center; font-size:1.5em; font-family:標楷體2, 標楷體; color:#000000; }
.appendL a:hover, .appendL a:focus { background-color:var(--colorPu); color:#ffffff; }

.appendL>* { margin:0.4em 2%; }
.appendL .w50 { display:inline-block; width:46%; }
.appendL article h4 { margin:0; padding:0; font-weight:normal; }

.appInfo { margin:1em 0; }


.appendV { width:100%; font-size:1.5em; }
.appendV th>div , .appendV td>div { display:inline-block; width:5em; max-width: 100%; vertical-align:top; text-align:left; }

.appendV>thead { position:relative; }
.appendV>thead th { padding:0; background-color:var(--colorCY); color:#fff; }
.appendV th { text-align:left; }
.appendV thead>tr>th#val, .appendV thead>tr>th>div { border-left:1px solid #fff; margin-right:0.5em; padding:0.2em 0.5em; text-align:center; overflow:hidden; white-space:nowrap; }

.appendV tbody>tr { border-bottom:1px solid #ccc; background:#fff; }
.appendV tbody>tr:nth-child(even) { background-color:#eee; }
.appendV tbody>tr:hover { background-color:#fff; }
.appendV tbody th[colspan] { background:var(--colorCYl); text-align:left; padding:0.5em; }
.appendV td { padding:0.2em; }
.appendV tr>td { font-family:標楷體2, '標楷體'; }
.appendV tr>td.val { text-align:center; color:var(--colorR); }
.appendV tr>td>div {  }
.appendV tr>td.sub>div { border-top:1px solid #aaa; margin-bottom:0.2em; margin-right:0.5em; }
.appendV tr>td>div>img { max-width:100%; }

.idx { margin:0.5em 0; }
.idx label { white-space:nowrap; }
.idx label>select { max-width:60%;; }



/* note */

.noteTab { display:block; width:20em; max-width:90vw; margin:auto; font-size:1.5em;  }
.noteTab>div { border-bottom:1px solid var(--colorGa); margin:auto; margin-bottom:1em; }
.noteTab>div:last-child { border:0; }
.noteTab>div>* { width:16em; max-width:100%; margin:auto; border:0; }
.noteTab>div, .tab>span { display:block; max-width:100%; }


.noteTab h3 { display:block; margin:0 auto; padding:0.5em; text-align:center; color:var(--colorR); }
.noteTab h3:before, .noteTab h3:after { content:'■'; margin:0 0.5em; color:var(--colorB); }

.noteTab label { color:#000;  font-weight:bold; }
.noteTab input { border-radius:0.1em; width:100%; margin:0.5em 0; padding:0 0.5em; font-size:1em; }
.noteTab input[type=checkbox] { width:1em; height:1em; margin-right:0.5em; vertical-align:middle; }
.noteTab input[type=submit], .noteTab input[type=button] {  }
.noteTab input[type=submit] { background-color:var(--colorB); color:#fff; }
.noteTab input[type=button] { }

.noteTab .msg { text-align:center; color:red; }

.noteTab .bar2 a { color:var(--colorB); }
.noteTab .bar2>a:nth-child(2) { float:right; }
.noteTab .bar2>a:nth-child(1):before { content:'❓'; color:#fff; background-color:var(--colorB); border-radius:0.5em; }
.noteTab .bar2>a:nth-child(2):before { content:'👤'; color:var(--colorB); }

#noteEx {}
#noteEx fieldset { border-bottom:1px solid var(--colorGa); margin-bottom:0.5em; }


.noteF {  }
.noteF label { line-height:2; }
.noteF input { margin:0.2em 0.5em; height:2em; vertical-align:middle; }
.noteF input[type=button], .noteF input[type=submit], noteF .btn
 { display:inline-block; background:var(--colorR); padding:0 1em; border:0; border-radius:0.2em;
 line-height:2em; text-align:center; vertical-align:middle; color:#fff; }
.noteF input[type=button]:hover, .noteF input[type=submit]:hover
, .noteF input[type=button]:focus, .noteF input[type=submit]:focus
 { background:#a40a0a; color:#fff; }
 
.noteF fieldset { border:0px; }
.noteF fieldset>legend { float:left; min-width:6em; font:bold 1.2em/2 正黑體, 微軟正黑體; }
.noteF fieldset>legend:before { content:'■'; color:var(--colorB); margin-right:0.5em; }

.noteInf { display:flow-root; margin:0.5em 0; }
.noteInf aside { float:right; }

/* news / page */


#newsL {}
#newsL caption { padding-left:0.5em; border-bottom:1px solid #ccc; font-size:1.5em; text-align:left;  }
#newsL caption:before { content:'📰'; content:url(img/msg.png); color:var(--colorR); margin-right:0.3em; font-size:1.2em !important; }
#newsL>tbody>tr>td:nth-child(1) { width:6em; text-align:center; }


.post { display:flow-root; margin:0.5em auto; padding:0 1em; line-height:1.5; background-color:#fff; font-family:標楷體2; }
.post h3:first-child, .post h4:first-child { position:unset; display:block; margin:0 -0.8em 1.5em -0.8em; padding:0.6em 1em; background-color:var(--colorR); color:#FFF; font-size:1.25em; font-family:微軟正黑體, 正黑體; }
.post footer { display:block; margin:1em -1em 0 -1em; padding:1em; background-color:#eee; color:#333; text-align:right; }


#pageNav { border:1px solid #888; padding:0.5em; }
#pageNav>h4 { display:inline-block; position:relative; top:0em; left:0; margin:-1em 0 0 0; padding:0.2em 0.5em; background:inherit; color:#000; }

#pageNav>a { background-color:var(--colorCY); }
#pageNav>a.act { background-color:var(--colorCYd); }
.navC { border:1px solid #888; margin:1em 0; padding:0.5em; }
.navC>a { background-color:var(--colorGa); }

/* sitemap */
.sitemap { counter-reset:paragraph; }
.sitemap>a { display:inline-block; background:var(--colorCY); border-radius:0.2em; width:12em; padding:1em; margin:0.5em 0.3em; color:#fff; }
.sitemap>a::before
{ counter-increment:paragraph; content: counter(paragraph); margin-right:0.5em; }


/* qa */

.qaH { border-radius:0 1em 1em 1em; margin:1em; padding:1em; background-color:#fff; }

.qaNav { text-align:center; margin:1em; }
.qaNav a { display:inline-block; width:calc(16.5% - 0.5em); line-height:2; border-radius:0.2em; margin-right:0.5em; padding:0.5em; color:#fff; background-color:var(--colorO); }
.qaNav a:last-child { margin:0; }
.qaNav a:hover { color:#000000; }
.qaNav a.act { position:relative; }
.qaNav a.act:before { content:' '; position:absolute; top:3.3em; left:50%; border:1em solid #0000; border-top-color:var(--colorO); margin-left:-1em; }
.qaNav a>div { line-height:1; text-align:center; font-size:2em; }

.qa { font-size:1.5em; }
.qa article { border-radius:1em; background-color:#fff; margin:1em; padding:1em; }
.qa article>h4 {  border-radius:1em 0 1em 1em ;  margin:-1em; padding:1em; margin-bottom:1em; color:#fff; font-size:1em; }
.qa>aside { text-align:center; }
.qa>aside>a { display:inline-block; width:calc(33% - 5em); margin-right:6em; padding:1em; color:#fff; background-color:var(--colorB); border-radius:1em; text-align:center; }
.qa>aside>a:last-child { margin:0; }

.qg1>h4 { background-color:var(--colorR); }
.qg2>h4 { background-color:var(--colorO); }
.qg3>h4 { background-color:var(--colorG); }
.qg4>h4 { background-color:var(--colorB); }
.qg5>h4 { background-color:var(--colorPu); }
.qg6>h4 { background-color:var(--colorGa); }



#sug { font-size:1.5em; }
#sug fieldset { border:0; padding:0; }
#sug>fieldset>legend { width:100%; padding:0.4em; background-color:var(--colorGa); text-align:center; color:#fff; font-size:1.5em; }
#sug>fieldset>fieldset>legend, #sug>fieldset>label>span { display:block; margin:0; padding:0 }
#sug>fieldset>fieldset>legend:before, #sug>fieldset>label>span:before { content:'■'; color:var(--colorCY); font-size:2em; }
#sug input[type="text"], #sug input[type="email"], #sug textarea, #sug button  { width:100%; border:0; border-radius:0.3em; padding:0.5em; font-size:1em; }

#sug button { margin:1em 0; background-color:var(--colorCY); text-align:center; color:#FFF; }
/* 
.sug {}
#searchF.sug>fieldset>* { display:block; }
#searchF.sug>fieldset>label>span, #searchF.sug>fieldset>fieldset>legend
 { display:block; float:initial; width:8em; margin:0.5em 0;  }

#searchF.sug .btnBar { padding:0.5em; }
 */

/* commmon */


#goTop, #suggest { position:fixed; z-index:1; right:20px; bottom:-200px; padding: 10px 20px; text-align: center; animation-name:closeBtn; animation-duration: 0.5s; }
#goTop { background-color: rgba(255,255,255,0.5); border:1px solid #888888; color:#444444; }
#goTop.show, #suggest.show { bottom:20px; animation-name: showBtn; animation-duration: 0.5s; }
#goTop:hover { background-color: rgba(255,255,255,1); }
#goTop>div, #suggest>div { text-align:center; font-size:3em; margin-top:-10px; line-height:1; }

#suggest { background-color:var(--colorCY); color:#fff; border-radius:0.5em; box-shadow: 5px 5px 5px #00000080; }
#suggest:hover { background-color: var(--colorCYd); }

@keyframes showBtn
{
    from { bottom:-100px;}
    to { bottom:20px; }
}

@keyframes closeBtn
{
    from { bottom:20px; }
    to { bottom:-100px;}
}

/* foot */
#footer { padding:0 0 10px 0; min-height:170px; background-color:#3d3d3d; width:100%; color:#fff; }
#footer>div>div { font-size:1.2em; line-height:1; }
#footer a { color:#fff; white-space:nowrap; }
#footer .logo { float:left; margin:1em 0.5em; }
#footer .count { float:right; width:15em; text-align:right; }
#footer .count>* { display:inline-block; text-align:right; }
#footer .time { color:#3d3d3d; }
#footer div>div>span { display:inline-block; }
#footer div.addr { font-size:0.7em; line-height: 1.5em; }

#footer .copy { margin-bottom:1em; padding:1em 0;
 background:#f2f2f2; text-align:center; color:#000; }
#footer .copy>div { font-size:0.9em; } 

 
.idmL a { color:#085; } 
 
 
@media screen and (max-width:1300px)
{
	nav.panel2 { margin: 10px 0px; }
}

@media screen and (max-width: 800px)
{
	.homeSearch form { display:block; }
	#searchL .ph { font-size:0.5em; }
	#searchL td>div { display:block; width:initial !important; }
	
	
	.list1 .pager { position:relative; right:0; top:0; width:100%; height:initial; min-height:0; padding-top:0; }
	.list1 .pager a:last-child { position:relative; float:right; }

}
@media screen and (max-width: 700px)
{
	flex, .flex { flex-direction: column; }
	
	body>header .menu1 { text-align:right; }
	body>header .menu1>span { display:inline-block; float:right; padding:0.3em 0.6em; }
	body>header .menu1>nav { display:none; float:initial; }
	body>header .menu1:hover>nav { display:inline-block; } 
	body>header .menu1>nav a { margin:0.3em; padding:0.2em; }
	
	body>main { padding:0; padding-bottom:1em; }

	#footer { font-size: 2.8vw; text-align:center; }
	#footer>div { }
	#footer>div>div { line-height:2; }
	#footer .logo { display:block; float:none; margin: 0.5em auto; }
	#footer .count { display:block; float:none; width:100vw; text-align:center; }
	#footer .count>* { }
	#footer .copy { font-size: 4vw; font-family:'標楷體2'; }

	#footer div.addr { font-size:1em; }

	.keyboardBar { text-align:center; }
	.keyboardBar a { display:block; margin:0.2em; }
	.keyboardBar a:nth-child(3) { float:initial; }
	.keyboard input { font-size:2.5vw; }

	#newsL>tbody>tr>td:nth-child(1) { width:3em; }

	#searchL>tbody>tr>td:nth-child(2), #searchL tr>th:nth-child(2)
	{ display:block; }
	#searchL>tbody>tr>td:nth-child(3), #searchL tr>th:nth-child(3)
	{ display:block; }
	
	#searchL tr>*:first-child { width:3em; vertical-align:middle; }
	#searchL tr>*:first-child input { display:block; margin:auto; }
	#searchL>tbody>tr>td:first-child { width:3em; }
	#searchL>tbody>tr>td:nth-child(3) { font-size:0.7em; }

	#searchF .adv>fieldset { font-size:1.2em; }


	.appendV th>div , .appendV td>div { display:block; width:initial !important; white-space:normal; }
	.appendV.wrap tr>*.idx { display:none; }
	
	#pageView { font-family:'標楷體2'; }
	#pageView tr>* { display:block; max-width:90vw; word-break:break-word; }
	#pageView img { max-width:100%; }
	
	.qaNav a { width:calc(50% - 0.5em); margin-bottom:0.5em; }
	.qaNav a:nth-child(odd) { margin-right:0; }
	.qa a { word-break:break-all; }
	.qa>aside>a { width:initial; margin-right:1em; }

}

@media print
{
	h1 { position:initial; left:0; top:0; }
	body>header, footer, section#headSearch, aside, #mainContent nav, #goTop, .noPrint, audio, .play
	{ display:none !important; }
	
	
	#idiomTab>*>tr>th { color:#000; } 
	
	#idiomTab tr { page-break-inside: avoid; }
	#idiomTab tr th { vertical-align:top; }
	
}


.jjDialog {  }
.jjDialog aside{  }
.jjDialog header{ background-color:#789431; color:#fff; font-size:1.5em; font-weight:bold; }
.jjDialog header::before { content:''; display: inline-block;
 background-image:url(img/user.png); background-size:1em; background-size:contain; background-repeat:no-repeat;
 width:1.5em; height:1.2em; vertical-align:text-bottom; }
.jjDialog main{  }
.jjDialog footer { background-color:#888; }
.jjDialog footer input{ }


@keyframes showMenu
{
    from { left:-200px;}
    to { left:0px; }
}

@keyframes closeMenu
{
    from { left:0px; }
    to { left:-200px;}
}

