@charset "utf-8";

/* ----- Layout ----- */ 
.comL{
	float:left;
	width:285px;
    margin-top: 0;
    z-index: 2;
}
.comR{
	float:right;
	width:calc(100% - 285px);
	box-sizing:border-box;
	padding-left:60px;
}
.comC{
	display:block;
	width:100%;
}
/*內容區上方藍色標*/
.unitName > h3 {
	position:relative;
	width:100%;
    font-size: 3.6em;
	color:#008484;
}
.unitName-content{
	display:block;
	width:100%;
	font-size:1.7em;
	line-height:185%;
	padding-top:10px;
}
.unitName-content p{
	margin: 10px 0;
}
/*有底線的標*/
.unitName.uline > h3{
	display:block;
	padding-bottom:10px; border-bottom:3px solid #d9d9d9; margin-bottom:30px;}
.movie_box{
	width: 100%;
	clear:both;
}
.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0; overflow: hidden;
	max-width: 100%; margin-top:35px;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
	position: absolute;top: 0; left: 0;
	width: 100%; height: 100%;
}
@media screen and (max-width: 990px) {
	.comL, .comR{width:100%;}
	.comL{ margin-bottom:40px; position: relative;margin-top:0;}
	.comR{ padding-left:0;}	
	#smTitle{ margin-bottom:0;}
	#smenu > ul > li{ margin-bottom:0;}
	.unitName > h3 {font-size: 3.4em;}	
}
@media screen and (max-width: 768px) {
	.unitName > h3 {font-size: 3.3em;}		
}
@media screen and (max-width: 480px) {
	.unitName > h3 {font-size: 2.5em;}		
}


/** breadcrumbs **/
#breadcrumbs {
	width:100%;
	margin:1px auto 30px;
}
#breadcrumbs > ul {
	list-style:none;
}
#breadcrumbs > ul li {
	position:relative;
	display:inline-block;
	color:#0D6E87;
	font-size:1.5em;
	font-weight:bold;
	line-height:1.5;
	padding-left:20px;
}
#breadcrumbs > ul li:first-child {
	padding-left:0;
}
#breadcrumbs > ul li:before{
	position:absolute;
    content:"";
    display:block;
    position:absolute;
    left:2px;
    top:50%;
    width:7px;
    height:7px;
    border-left:1px solid #008484;
    border-bottom:1px solid #008484;
	margin-top:-3px;
    z-index:2;
    -webkit-transform:rotate(-135deg);
		-ms-transform:rotate(-135deg);
			transform:rotate(-135deg);
}
#breadcrumbs > ul li:first-child:before{
	display:none;
}
#breadcrumbs > ul li a {
	position:relative;
	display:block;
	color:#0D6E87;
}
#breadcrumbs > ul li a:hover,
#breadcrumbs > ul li a:focus {
	color:#B4480E;
}
#breadcrumbs > ul li a.bread-home {
	position:relative;
	padding-left:25px;
}
#breadcrumbs > ul li a.bread-home:before {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:50%;
	width:18px;
	height:18px;
	margin-top:-9px;	
	background:url(../images/icon-home.svg) 50% 50% no-repeat;
	background-size:cover;
	z-index:2;
}
#breadcrumbs > ul li a.bread-home:hover:before,
#breadcrumbs > ul li a.bread-home:focus:before {
	background-image:url(../images/icon-home-on.svg);
}


.com-search{
	width:100%;
	float:left;
	margin:30px auto 20px;
	background-color:#e9e9e9;
	padding:20px;
	border-radius:5px;
	box-sizing:border-box;	
}
/* ----- searchCriteria ----- */
.searchCriteria {
	width:100%;
	margin:0 auto;
	padding:0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.searchCriteria .tbox {
	float:left;
	width:calc(20% - 10px);
	margin:0;
	margin-right: 10px;
	padding:0;
	position:relative;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
.searchCriteria .sbox {
	float:right;
	width:40%;
	padding: 0;
	margin: 0;
}
.searchCriteria .listBar {
	width:100%;
	height:47px;
	line-height:47px;
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #666;
	cursor: pointer;
	text-indent: 0.01px;
	padding:0;
	padding-right:24px;
	margin:0;
	-webkit-appearance: none;  
	-moz-appearance: none;  
	-ms-appearance: none;  
	appearance: none;
	font-size:1.6em;
	background-color:transparent;
	border-radius:3px;
	border:0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding-left:16px;
	background-image: url(../images/select-bg.svg);
    background-image: url(../images/select-bg.png) ;
	*background-image: url(../images/select-bg.png);
	background-size:20px auto ;
    background-repeat: no-repeat;
    background-position: right center;
	background-color:#fff;
}
/* .searchCriteria .tbox:before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:41px;
	height:47px;
	float:left;
	background-image:url(../images/listBar.png);
	background-repeat:no-repeat;
	background-position:center;
} */
.searchCriteria .listBar option {
	color:#333;
	border-radius:3px;
	background:#FFF; /* style the dropdown bg color */
}
.searchCriteria .listBar:-ms-expand {
	display:none; /* hide default arrow in IE10 */
}
.searchCriteria .search-query {
	width:100% !important;
	height:47px;
	line-height:47px;
	color: #666;
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	border:0;
	border-radius:3px;	
	background: none;
	padding:0 16px;
	margin:0;
	font-size:1.6em;
	background-color:#fff;
	box-sizing:border-box;
}
.searchCriteria .search-query::-webkit-input-placeholder { color: #666; }
.searchCriteria .search-query:-moz-placeholder { color: #666; }
.searchCriteria .search-query::-moz-placeholder { color: #666; }
.searchCriteria .search-query:-ms-input-placeholder { color: #666;}
.searchCriteria .search-btn {
	width:84px;
	height:47px;
	border:none;
	cursor:pointer;
	padding:0;
	margin:0;
	color:#fff;
	font-size:1.7em;
	background-color:#008484;
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	text-align:center;
	border-radius:3px;	
}
.searchCriteria .search-btn:hover{ 
	background-color:#050b25;
}
.searchCriteria .search-btn > span{
	background-image:url(../images/searchCriteria-btn.svg);
	background-image:url(../images/searchCriteria-btn.png) \9;
	*background-image:url(../images/searchCriteria-btn.png);
	background-repeat:no-repeat;
	background-position:left center;
	display:inline-block;
	width:16px;
	height:15px;
	margin-right:5px;
}
.searchCriteria .abox{
	width:100%;
	position:relative;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding:0 84px 0 0;
}
.searchCriteria .abox .lbox{
	width:calc(100% - 10px);
	padding:0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.searchCriteria .abox .rbox{
	position:absolute;
	right:0;
	top:0;
	width:84px;
	float:right;
}
.searchCriteria .sbox.full{width:100%;}
.searchCriteria .sbox.full .abox{ padding-left:0;}

.searchCriteria > span{
	font-size:1.8em; color:#000; line-height:47px;}
.searchCriteria.flex{ display:flex; flex-wrap:nowrap; justify-content:space-between}

.searchCriteria .ico_clandar{ border:0; padding-left:45px; background:#fff url(../images/ico_calendar.png) 12px center no-repeat; background-size:25px; border-radius:6px; width:calc(50% - 165px); font-size:1.6em; }

@media screen and ( max-width: 768px) {
	.searchCriteria .tbox{
		width: calc(33.3333% - 10px);
	}
	.searchCriteria .tbox.LL{
		width: 33.33333%;
		margin-right: 0;
	}
	.searchCriteria .sbox{
		width: 100%;
		margin-top: 10px;
	}
}
@media screen and ( max-width: 425px) {
	.com-search{
		padding: 10px;
	}
}



/* ----- pageTitle ----- */
.pageTitle{
	display:block;
	width:100%;
}
.pageTitle > h2{
	width:100%;
	font-size:3.5em;
	color:#666;
	font-weight:bold;
	line-height:1.3;
	margin-bottom:8px;
	padding-bottom:8px;	
	border-bottom:3px solid #ccc;	
}
.pageData{
	display:block;
	width:100%;
	list-style:none;
	color:#666;
	font-size:1.5em;
	line-height:16px;
	margin:5px 0;
	word-break:break-all;
}
.pageData:after{
	    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.pageData li {
	float:left;
	margin:5px 18px 5px 0;
	background-repeat:no-repeat;
	background-position:0 0;
	background-size:16px auto;
	padding-left:20px;
}
.pageData li.date {
	background-image: url(../images/time.png) ;
}
.pageData li.source{
	background-image: url(../images/source.png)
}
.pageData li.visit{
	background-image: url(../images/visits.png)
}
.pageData li.bulletin{
	background-image:url(../images/icon-bulletin.svg);
	background-image:url(../images/icon-bulletin.png) \9;
	*background-image:url(../images/icon-bulletin.png);
}
.pageArticle{
	width:100%;
}
.articleBox{
	display:block;
	width:100%;
	font-size:1.7em;
	line-height:185%;
	padding-top:40px;
}
.articleBox.upline{
	border-top: solid 1px #777;
	padding-top:15px;
}
.articleBox > table { max-width:100% !important; width:100% !important; }
.articleBox table{width:100%;margin:20px 0;}
.articleBox table tr th{
	background-color:#247D8F;
	color:#fff; border-right:1px dashed #fff;vertical-align:middle;border-top:1px solid #fff;border-left:1px dashed #fff;}
.articleBox table tr th:last-child{ border-right:0;}
.articleBox table tr th:first-of-type{ border-left:0;}
.articleBox table tr td{ border:1px solid #ccc; border-left:0; border-right:1px dashed #ccc; vertical-align:middle}
.articleBox table tr td:last-child{ border-right:0;}
.articleBox table tr:nth-child(odd){ background-color:#f1f1f1}

.articleBox table.greenTable tr th{
	background-color:#006600;
	color:#fff;
	border-color:#fff;
}
.articleBox table.greenTable tr td{
	border-color:#fff;
}
.articleBox table.greenTable tr:nth-child(odd){
	background-color:#ffffff;
}
.articleBox table.greenTable tr:nth-child(even){
	background-color:#e2efd9;
}
.smatag{
	background-color:#247D8F;
	color:#fff;
	font-size:70%;
	line-height:120%;
	display:inline-block;
	padding:3px;
	position:relative;
	z-index:1;
}
.smatag::before{
	content:"";
	display:block;
	position:absolute;
	left: 10px;
    top: 0;
    width: 100%;
    height: 100%;
    clip-path: polygon(0 0, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
    background-color: #247D8F;
    z-index: -1;
}
.articleBox > p{
 	margin:10px 0;
}
.articleBox > h3{
	font-size:1.625em;
	padding:10px 0;
}

.articleBox .tit_h3{ margin-left:2em; text-indent:-2em; display:block;}
 

.articleBox .arrTitle{
	position:relative;	
	color:#C55307;
	font-weight:bold;
	line-height:1.4;
	padding:15px 0 0 35px;
}
.articleBox .arrTitle:before{
    content:"";
    display:block;
    position:absolute;
    left:0;
	top:20px;
    width:27px;
    height:27px;
    z-index:1;
	background:url(../images/icon-arrow.svg) 0 50% no-repeat;
	background-color:#C55307;
	border-radius:3px;
	background-size:cover;
}
.articleBox blockquote{
	display:block;
	position:relative;		
	font-weight:bold;
	font-size:1.2rem;
	background-color:#f4f4f4;
	padding:20px 40px 20px 50px;
	box-sizing:border-box;
	border-radius:5px;
	margin:20px auto;				
}
.articleBox blockquote:before{
	content:"“";
	width:25px;
	height:25px;
	font-family:'PT Serif', serif;	
	font-size:3em;
	line-height:1;
	position:absolute;
	top:12px;
	left:10px;
}
.articleBox blockquote:after{
	content:"”";
	width:25px;
	height:25px;
	font-family:'PT Serif', serif;	
	font-size:3em;
	line-height:1;	
	position:absolute;
	bottom:12px;
	right:12px;
}
.picBord{
	width:100%;
	margin:10px auto;
}
.picBord figcaption{
	color:#696969;
	text-align:center;
	padding-top:6px;
}
sup {
    vertical-align: super;
    font-size: smaller;
}
sub {
    vertical-align: sub;
    font-size: smaller;
}

.caseRow{
	width:100%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
@media screen and (max-width:768px) {
	.pageTitle > h2{font-size:3.2em;}
}
@media screen and (max-width:480px) {
	.pageTitle > h2{font-size:3em;}
	.caseRow:has(table) > img{ margin:0 auto;}
}
@media screen and ( min-width: 481px) {
	.caseRow:has(table) > img{max-width:100px; height:auto !important;}
	.caseRow table.greenTable,
	.articleBox .caseRow table.greenTable{
		width:calc(100% - 115px);
		margin-left:15px;
		margin-top:0;
	}
}
@media screen and ( min-width: 991px) {
	.caseRow:has(table) > img{max-width:170px;}
	.articleBox .caseRow table.greenTable{width:calc(100% - 185px);}
}

/** pageBot **/
.pageBot {
	width:100%;
	padding:0;
	margin:30px auto 0 auto;
}
.pageBot .tit {
	display:block;
	width:100%;
	color:#000;
	font-family:"PingFang TC Semibold", "微软雅黑", "Microsoft YaHei";
	font-size:2.5em;
	font-weight:bold;
	margin-bottom:20px;
	border-bottom:solid 1px #000;	
}
.pageBot .tit span {
	position:relative;
	display:inline-block;
	padding:10px 0 15px 45px;
}
.pageBot .tit span:before {
	content:"";
	display:block;
	position:absolute;
	top:50%;
	left:0;
	width:36px;
	height:36px;
	margin-top:-18px;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	z-index:1;
}
.pageBot .tit span.photo:before {
	background-image:url(../images/pageBot-photo.png);
}
.pageBot .tit span.download:before {
	background-image:url(../images/pageBot-download.png);
}
@media screen and (min-width:991px) {
	.pageBot {margin-top:50px;}	
}
@media screen and (min-width:1200px) {
	.pageBot .tit {font-size:3em;}
	.pageBot .tit span:before,
	.pageBot .tit span::after{
		width:42px; height:42px;
		margin-top:-23px;
	}
	.pageBot .tit span {padding-left:55px;}
}


/** gallery **/
#gallery {
	width:100%;
	margin:0 auto;
}
#gallery ul {
	list-style:none;
	letter-spacing:-9px;
	margin:-10px;
}
#gallery ul li {
	display:inline-block;
	width:33.3333%;
	letter-spacing:0;
	padding:10px;
	vertical-align:top;
	box-sizing:border-box;
}
#gallery ul li a {
	float:left;
    width:100%;
	height:100%;
	color:#000;
}
#gallery ul li a:hover,
#gallery ul li a:focus {
	color:#e60012;
}
#gallery figure {
	margin:0;
}
#gallery figure .pic {
    position: relative;
    display: block;
    width: 100%;
	height:0;
	padding-bottom:66.66%;
    overflow: hidden;
	background:#f5f5f5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;				
}
#gallery figure .pic img {
    width: auto;
    max-width: 100%;
    overflow: hidden;
    max-height: 100%;
    height: auto!important;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    -webkit-transition:0.4s;
	   -moz-transition:0.4s;
         -o-transition:0.4s;
            transition:0.4s;														
}
#gallery a:hover figure .pic img,
#gallery a:focus figure .pic img {
    -webkit-transform:translate(-50%,-50%) scale(1.08);
	   -moz-transform:translate(-50%,-50%) scale(1.08);
        -ms-transform:translate(-50%,-50%) scale(1.08);
         -o-transform:translate(-50%,-50%) scale(1.08);    
            transform:translate(-50%,-50%) scale(1.08);							
}
#gallery figure figcaption {
	font-size:1.6em;
	color:#757575;
	line-height:130%;
	font-weight:bold;
	margin-top:10px;
}
#gallery a:hover figure figcaption,
#gallery a:focus figure figcaption {
	color:#148296;	
}
@media screen and (max-width:640px) {
	#gallery figure figcaption {font-size:1.5em;}
	#gallery ul li {width:50%;}
}
@media screen and (max-width:360px) {
	#gallery ul li {width:100%;}
}
@media screen and (min-width:1200px) {	
	#gallery figure figcaption {font-size:1.7em;}
	#gallery ul li {width:33.33%;}
}


/* ----- dnLink ----- */
.dnLink {
	width:100%;
	padding:0;
	margin:-20px auto 0;
	box-sizing:border-box;
}
.dnLink ul {
	list-style:none;
}
.dnLink ul li {
	width:100%;
	padding:0;
}
.dnLink ul li a {
	position:relative;
	display:flex;
    height:100%;
    justify-content:space-between;
	flex-wrap:wrap;
	box-sizing:border-box;
	align-content:center;
	padding:15px 0;
	border-bottom:1px solid #bababa;
}
.dnLink ul li a:hover,
.dnLink ul li a:focus{
	background-color:#def2f7;
	border-color:#addfea;
}
.dnLink .labe {
	position:relative;	
	width:60px;
	height:77px;
	background:url(../images/labe-file.png) no-repeat left center;
	background-size:contain;	
}
.dnLink .labe span {
	display:block;
	position:absolute;
	left:12px;
	bottom:18px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1.6em;
	font-weight:bold;	
	text-align:center;	
	color:#fff;		
	background:#247D8F;
	padding:5px 3px 3px;
	box-sizing:border-box;
	min-width:55px;		
}
.dnLink .labe.pdf span{background:#E60000;}
.dnLink .labe.odt span,
.dnLink .labe.doc span,
.dnLink .labe.docx span{background:#0579B8;}
.dnLink .labe.ods span,
.dnLink .labe.xls span,
.dnLink .labe.xlsx span{background:#008533;}
.dnLink .labe.odp span,
.dnLink .labe.ppt span,
.dnLink .labe.pptx span{background:#C75000;}
.dnLink .labe.rar span{background:#9c008d;}
.dnLink .labe.zip span{background:#5e5e5e;}
.dnLink a:hover .labe span,
.dnLink a:focus .labe span {background:#127688;}
.dnLink dl {
	display:flex;
	width:calc(100% - 85px);
	flex-wrap:wrap;
	flex-direction:column;	
	justify-content: center;
}
.dnLink dt {
	color:#000;
	font-size:2.1em;
	font-weight:bold;
	line-height:135%;
}
.dnLink a:hover dt,
.dnLink a:focus dt {
	color:#127688;
}
.dnLink dd {
	color:#666;
	font-size:1rem;
	margin-top:8px;
}
.dnLink dd span {
	position:relative;
	padding-left:15px;
	margin-right:15px;
	vertical-align:top;
}
.dnLink dd span:before {
	content:"";
	display:block;
	position:absolute;
	top:10px;
	left:3px;
	width:3px;
	height:3px;
	background:#999;
}
@media screen and (max-width:480px) {	
	.dnLink dd {margin-top:0;}
	.dnLink dd span {
		display:block;
		margin:5px 0;
	}
}
@media screen and (min-width:1200px) {	
	.dnLink ul li a{padding:20px;}
	.dnLink dt{ font-size:2.4em;}
}


/* ----- txtList ----- */
.txtList {
	width:100%;
	margin:0 auto;
}
.txtList ul {
	list-style:none;
}
.txtList ul li {
	display:inline-block;
	width:100%;
	border-bottom:1px dashed #CCC;
}
.txtList ul li a:hover,
.txtList ul li a:focus{
	background-color:#def2f7;
}
.txtList ul li a {
	position:relative;
	width:100%;
	padding:15px 10px;
	box-sizing:border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
.txtList ul li a::before{
	content:"";
	display:inline-block;
	width:50px;
	height:50px;
	background-color:#7ed0de;
	background-image:url(../images/fileType-icon.svg);
	background-repeat:no-repeat;
	background-position:0 0;
	background-size:auto 100%;
	border-radius:100%;
	transition:all 0.4s ease;
}

.txtList ul li a:hover::before, .txtList ul li a:focus::before{
	background-color:#148296}

.txtList ul li a.links::before{
	background-position:-50px 0;
}
.txtList ul li a.download::before{
	background-position:-100px 0;
}
.txtList ul li a.category::before{
	background-position:-150px 0;
}
.txtList ul li a:hover::before,
.txtList ul li a:focus::before{
	transform: rotate(360deg);
}
.txtList .infoFrame{width:calc(100% - 65px); box-sizing:border-box;  }
.txtList ul li strong {
	position:relative;
	color:#4d4d4d;
    font-size:2.1em;
    font-weight:bold;
	line-height:135%;
	margin-top:3px;
}
.txtList ul li a:hover strong,
.txtList ul li a:focus strong{
	color:#000;
}
.txtList ul li strong em {
	position:relative;
	display:inline-block;
	font-family:Arial, Helvetica, sans-serif;
    font-size:0.9375rem;
	line-height:21px;
	padding:2px 10px;
	vertical-align:middle;
	margin-left:5px;
	background:#cc0000;
	color:#FFF;
	font-style:normal;
	text-transform:uppercase;
	font-weight:normal;
}
.txtList ul li strong em.pdf {
	background:#a40000;
}
.txtList ul li strong em.odt,
.txtList ul li strong em.doc,
.txtList ul li strong em.docx {
	background:#0068b7;
}
.txtList ul li strong em.ods,
.txtList ul li strong em.xls,
.txtList ul li strong em.xlsx {
	background:#378837;
}
.txtList ul li strong em.odp,
.txtList ul li strong em.ppt,
.txtList ul li strong em.pptx{
	background:#FF6600;
}
.txtList ul li strong em.rar {
	background:#67005E;
}
.txtList ul li strong em.zip {
	background:#6a3906;
}
.infoFrame .postBot{
	width:100%;
	margin-top:6px;
	font-size:1.5em;
	line-height:130%;
	color:#666;
	font-weight:bold;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.infoFrame .postBot time {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:500;
}
.infoFrame .postBot time,
.infoFrame .postBot span{color:#B4480E;}
.infoFrame .postBot time + span::before,
.infoFrame .postBot span::after{
	content:"";
	width:1px;
	height:15px;
	display:inline-block;
	background-color:#ccc;
	margin:0 10px;
	vertical-align: middle;
}
.infoFrame .postBot span:last-of-type::after{
	display:none;
	margin:0;
}
@media screen and (max-width:600px) {
	.txtList ul li a::before{width:40px;height:40px;}
	.txtList ul li a.links::before{background-position:-40px 0;}
	.txtList ul li a.download::before{background-position:-80px 0;}
	.txtList ul li a.category::before{background-position:-120px 0;}
	.txtList .infoFrame{width:calc(100% - 50px);}
	.txtList ul li strong {font-size:1.9em;}
}
@media screen and (min-width:1200px) {
	.txtList ul li a {padding:20px 10px;}	
	.txtList ul li strong {font-size:2.4em;}
	.txtList ul li a::before{width:65px;height:65px;}
	.txtList ul li a.links::before{background-position:-65px 0;}
	.txtList ul li a.download::before{background-position:-130px 0;}
	.txtList ul li a.category::before{background-position:-195px 0;}
	.txtList ul li a::after{
		position:absolute;
		right:16px;
		top:50%;	
		content:"";
		display:block;
		width:15px;
		height:15px;
		border-left:2px solid #5c5c5c;
		border-bottom:2px solid #5c5c5c;
		margin-top:-7px;	
		z-index:2;
		-webkit-transform:rotate(-135deg);
			-ms-transform:rotate(-135deg);
				transform:rotate(-135deg);	
	}
	.txtList ul li a:hover::after,
	.txtList ul li a:focus::after{
		right:8px;
		border-left:2px solid #000;
		border-bottom:2px solid #000;	
	}	
	.txtList .infoFrame{width:calc(100% - 85px); padding-right:25px;}
}


/* ----- pictureList ----- */
.pictureList {
	width:100%;
	margin:0 auto;
}
.pictureList ul {
	list-style:none;
}
.pictureList ul li {
	display:inline-block;
	width:100%;
	border-bottom:1px dashed #CCC;
}
.pictureList ul li a:hover,
.pictureList ul li a:focus{
	background-color:#def2f7;
}
.pictureList ul li a {
	position:relative;
	display:inline-block;
	width:100%;
	color:#4d4d4d;
	padding:20px 0;
	box-sizing:border-box;
}
.pictureList .onePost{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    flex-direction:row;
}
.pictureList .photo {
	position:relative;
	display:inline-block;
	width:120px;
	letter-spacing:0;
	vertical-align:top;
	margin-right:10px;
	overflow:hidden;
	background:#F4F4F4;
}
.pictureList .photo .img {
	display:block;
	width:100%;
	padding-bottom:67%;
	height:auto;
    background-image: url(../images/noPic.svg);
	background-color:#B4480E;	
	background-repeat:no-repeat;
	background-position:50% 100%;
	background-size:cover;
	transition:all 0.4s ease;
}
.pictureList a:hover .photo .img,
.pictureList a:focus .photo .img{
    transform:scale(1.08);
}
.pictureList .infoFrame{
	display:inline-block;
	width:calc(100% - 130px);
	letter-spacing:0;
	vertical-align:top;
	margin:5px 0;
}
.pictureList .infoFrame strong {
	position:relative;
	color:#4d4d4d;
    font-size:1.9em;
    font-weight:bold;
	line-height:145%;
}
.pictureList a:hover .infoFrame strong,
.pictureList a:focus .infoFrame strong{
	color:#000;
}
@media screen and (max-width:420px) {
	.pictureList .photo {
		display:block;
		width:100%;
		margin-bottom: 8px;
	}
	.pictureList .infoFrame{
		display:block;
		width:100%;
	}	
}
@media screen and (min-width:601px) {
	.pictureList .photo { width:160px; margin-right:20px;}
	.pictureList .onePost .infoFrame {
		width:calc(100% - 200px);
		padding-right:10px;
		box-sizing:border-box;
	}
	.pictureList .infoFrame strong {font-size:2.1em;}	
}
@media screen and (min-width:991px) {
	.pictureList ul li a {padding:25px 0;}
}
@media screen and (min-width:1200px) {
	.pictureList .infoFrame strong {font-size:2.4em;}
}


/* ----- photoList ----- */
.photoList {
	width:100%;
}
.photoList ul {
  	display: flex;
    flex-wrap: wrap;
	margin: 0 -12px;
	list-style:none;
	float:none;
	width:auto;
}
.photoList li {
	width:calc(33.33% - 24px);
	margin:15px 12px;
}
.photoList.goods li{width:calc(25% - 24px);}

.photoList li a {
	position:relative;	
	float: left;
	width: 100%;
	height: 100%;
	background:#f5f5f5;
	color:#333;					
}
.photoList li a .photo {
	position:relative;
	width:100%;
	height: 0;
	padding-bottom:66.66%;
	overflow:hidden;
}

.photoList.goods li a .photo{
	padding-bottom:100%;}
	
.photoList.goods li a .labs{
	display:inline-block; position:absolute; left:10px; top:-10px; border-radius:6px; z-index:2;
	padding:5px 10px; line-height:1; font-weight:bold;
	font-style:normal; font-size:1.4em; color:#fff; background-color:#B4480E}	
	
	
.photoList li a .photo span {
    position: absolute;
    width: 100%;
    height: 100%;
	display:block;	
    background-size: cover !important;
    background-position: center bottom !important;
    background-image: url(../images/noPic.svg);
	background-color:#B4480E;
	background-repeat:no-repeat;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.photoList.goods li a .photo span {background-size: 100% !important;}

.photoList li a:hover .photo span,
.photoList li a:focus .photo span {
    -webkit-transform: scale(1.1);
	   -moz-transform: scale(1.1);
         -o-transform: scale(1.1);    
            transform: scale(1.1);
}
.photoList li .postBox {
	padding:15px;
	padding-top:10px;
	box-sizing:border-box;			
}
.photoList li .postBox strong {
	display:block;	
	width:100%;
	font-size:2em;
	line-height:1.5;	
}
.photoList li .postBox time {
	display:block;
	width:100%;	
	font-size:1.5em;
	margin-top:5px;
}
.photoList li a:hover .postBox strong,
.photoList li a:focus .postBox strong {	color:#000;}
@media screen and (max-width:1160px) {
	.photoList li {width:calc(50% - 24px);}
	.photoList.photoList li{width:calc(33% - 24px);}
}
@media screen and (max-width:990px) {
	.photoList {
		padding:8px;
		box-sizing:border-box;
	}	
	.photoList li, .photoList.photoList li {
		width:calc(33.33% - 16px);
		margin:15px 8px;
	}
 }
@media screen and (max-width:768px) {
	.photoList li {width:calc(50% - 16px);}	
	.photoList.photoList li{width:calc(50% - 16px);}
}
@media screen and (max-width:580px) {
	.photoList li .postBox strong {font-size:1.8em;}	
}
@media screen and (max-width:420px) {
	.photoList li, .photoList.photoList li {width:100%;}
}


/** Module Button **/
.mbtn {
	position:relative;
	color:#333;	
	font-size:1.5em;
	font-weight:bold;
	line-height:22px;
    margin-top:10px;
   	padding-left:30px;		
}
.mbtn .theme:before {
    content:"";
    position:absolute;
    display:block;
    width:22px;
    height:22px;
	left:0;
	background-color:#7ed0de;
	background-image:url(../images/fileType-icon-2.svg);
	background-repeat:no-repeat;
	-webkit-border-radius: 100%;
	   -moz-border-radius: 100%;
			border-radius: 100%;	
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;	
}
.mbtn .theme.more {color:#2C75A5;}
.mbtn .theme.link {color:#578000;}
.mbtn .theme.download {color:#c82850;}
.mbtn .theme.category {color:#B4480E;}
.mbtn .theme.more:before {background-position:0 0; background-color:#2C75A5;}
.mbtn .theme.link:before {background-position:-22px 0; background-color:#578000;}
.mbtn .theme.download:before {background-position:-44px 0; background-color:#c82850;}
.mbtn .theme.category:before {background-position:-66px 0; background-color:#B4480E;}
a:hover .mbtn .theme:before,
a:focus .mbtn .theme:before {transform: rotate(360deg);}
.mbtn span::after{
	content:"";
	width:1px;
	height:15px;
	display:inline-block;
	background-color:#ccc;
	margin:0 10px;
	vertical-align: middle;
}
.mbtn span:last-of-type::after{
	display:none;
	margin:0;
}


/**/
.dotsIcon {
    color: #1a7ba2;	
    font-size: 1em;
    margin: 0 auto !important;
}
.dotsIcon li a {
	color: #528400;
}
.dotsIcon li a:hover,
.dotsIcon li a:focus {
	color: #1a7ba2;
}
.dotsIcon > li {
	list-style: none;	
	padding: 1px 0 1px 1.5em;
	margin: 0 !important;
	position: relative;
}
.dotsIcon > li:before {
    position: absolute;
    left: 0;
    top: 12px;
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 10px;
    display: inline-block;
    margin: 0 0 0 5px;
    background-color:#1a7ba2;
}

/*0809*/
.articleBox > h3{
	font-size:1.45em;
	padding:10px 0;
	font-weight:bold
}

.articleBox > h3 mark{
	font-weight:bold}

.articleBox  mark{
	font-weight: normal;
	font-style:normal;
	background-color:#d9f0f4;}
	
.articleBox strong mark{
	font-weight:bold;}	
	
.articleBox  figure{
	padding:13px; box-sizing:border-box; float:left; margin:5px;
	background-color:#f2f2f2; border:1px solid #ccc; max-width:calc(50% - 10px);}	

.articleBox ul, .articleBox ol{
	display:block; box-sizing:border-box; padding-left:1.5em;
	margin:10px 0 20px 6px;}
.articleBox .dotsIcon{ padding-left:0;}	
	
.articleBox li{ margin-bottom:0.3em;}
	
.articleBox ul.decimal{
	list-style:decimal}
 	
.articleBox ul.decimal li::marker  {
	font-weight:bold;	
  content: counter(list-item) "〉"; 
  color: #39C;
}	

.articleBox ul.g_dot{ display:block; list-style:none; padding:0;}
.articleBox ul.g_dot li{ padding-left:1.6em; box-sizing:border-box; position:relative;}
/*LIST加上綠樹符號*/
.articleBox ul.g_dot li:after{
	content:'🌳'; display: inline-block; width:1em; height:1em; position:absolute; left:0; top:0}
	
.articleBox table p{text-indent: 0; display:block;}	
.articleBox table td, .articleBox table th{ padding:5px 8px;}					
@media screen and (max-width: 600px) {
.articleBox  figure{
 	max-width:100%; margin:10px 0; float:none;	
	
	}
.articleBox table td, .articleBox table th{ padding:5px 2px;}		
	}