/*nstctrain 2024*/
	
	/*reset css*/
	body, div, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, button, textarea, p, blockquote, th, td {	
		padding: 0;
		margin: 0;
	}
	
	img {border: 0;}
	
	:focus {outline: 0;}
	
	h1, h2, h3, h4, h5, h6 {font-size: 100%;font-weight: normal;}
	
	input, button, textarea, select, optgroup, option {
		font-family: inherit;
		font-size: inherit;
		font-style: inherit;
		font-weight: inherit;
	} 
	
	code, kbd, samp, tt {font-size: 100%;}


	/*purpose To enable resizing for IE */
	/*branch For IE6-Win, IE7-Win */
	/*	input*/
	button, textarea , input[type="submit"], input[type="button"]  { 
		-webkit-appearance: none; 
		-moz-appearance: none; 
		appearance: none;
	}
	
	ol, ul, li {list-style: none;}
	
	:link, :visited , ins {text-decoration: none;}
	
	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}
	

	/*HTML5 tag*/
	section, article, aside, footer, header, nav, main {display:block;}
	

	/*HTML5 display-role reset for older browsers*/
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
	
	ol, ul {
		width: 100%;
		list-style: none;
		float:left;
	}
	
	blockquote, q {quotes: none;}
	
	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}
	
	table {
		border-collapse: collapse; 
		border-spacing: 0;
	}
	

	/*general*/
	html, body {
		width: 100%;
		height: 100%;
	}
	
	body {
		margin:0; 
		width:100%; 
		font-size:1em; 
		font-family:'Noto Sans TC', 'Microsoft JhengHei','Poppins','Arial', sans-serif; 
		line-height: 165%;
		color:#5f5f5f; 
		background:#fff;  
		cursor:default; 
		position:relative;
	}
	
	div , p , table { 
		padding:0; 
		margin:0px 0; 
		width: 100%; 
		float:left;
	}
	
	p {margin:5px 0;}
		
		
	/*title*/
	h1, .posting-title , .post-title , 	#catalog_display h1 span , 
	#main_info span , .emailtitle , #menu-name , .reg-search-title , 
	.search_criteria-title {
		margin:15px 0 15px;
		width:100%;
		font-size:2.5em;
		line-height:150%;
		color:#ff84bc;
		font-weight:bold;
		text-align:center;
		float:left;
	}

	h2 {
		margin:10px 0 10px;
		width:100%;
		font-size:1.75em;
		line-height:140%;
		color:#003e8b;
		font-weight:bold;
		text-align:center;
		float:left;
	}

	h3 {
		margin:5px 0;
		width:100%;
		font-size:1.5em;
		line-height:140%;
		color:#b07cda;
		font-weight:bold;
		text-align:center;
		float:left;
	}

	h4 {
		margin:10px 0;
		width:100%;
		font-size:1.25em;
		line-height:130%;
		color:#005400;
		font-weight:bold;
		text-align:center;
		float:left;
	}
	
	h5 {
		padding:0 0;
		margin:10px 0 ;
		width:100%;
		font-size:1.12em;
		line-height:130%;
		color:#5f5f5f;
		font-weight:bold;
		float:left;
	}
	
	h5 span {color: #01b6e3;}

	/*link*/
	a {
		color: #01b6e3;
		-webkit-transition: color .5s, 
		background .5s;
		transition: color .5s, 
		background .5s;
		cursor:pointer;
	}
	
	a:hover {color:#ff6000;}
	
	a img {opacity: 1;}
	
	a img:hover {
	  opacity: .8;
	  -webkit-transition: opacity .5s;
	  transition: opacity .5s;
	 }
	
	.logo a img:hover , #flash-box img:hover , .footer-info img:hover , 
	.eventimg img , .homegif img , .top-right a img:hover ,
	.ul-news-picture a img:hover , .pshall-nav ul li a img:hover ,
	#menu-14685 .maincontent img , 
	#home-sponsor a img   {opacity: 1;}

	.printer , hr {display:none;}		

	
	/*ul*/
	ul {
		width:100%;
		float:Left;
	}
	
	ul li {margin:0 5px;}
	
	#general-content-main ul li , #news-content ul li {
		padding:0 0 5px 25px; 
		margin:0 0 5px; 
		width:calc(100% - 25px); 
		background: url(graphics/li.png) no-repeat left top 5px; 
		background-size:15px;
		float:left;
	}

	#general-content-main ul li ul li , #news-content ul li ul li {
		background: url(graphics/li1.png) no-repeat left top 5px; 
		background-size:15px;
	}

	
	/*iframe img*/
	iframe {
		margin: 10px 0;
		width: 100%;
		max-width: 100% !important;
	}
	
	img {
		width: 100%;
		max-width: 100%;
		height: auto ;
		float:left;
	}
	

	/*input*/
	input, textarea {
		padding:8px 5px; 
		border:none; 
		border-radius:10px;
		float:left; 
	}
	
	input[type="submit"] , input[type="button"] {
		width:calc(100% - 0px); 
		color:#fff; 
		background: #b07cda;
		cursor: pointer;
		-webkit-transition: background .5s;
		transition: background .5s; 
		box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
	}
	
	input[type="submit"]:hover , input[type="button"]:hover {
		background:#ff84bc; 
		border:none;
	}
	
	input[type="text"] , input[type="textbox"] , input[type="password"] , 
	input[type="email"] , textarea  {
		width:calc(100% - 14px); 
		color:#5f5f5f;	
		border:2px solid #9fa0a0; 
		background: #fff;
	}
		
	textarea {height:100px;}
	
	input[type="radio"] ,	input[type="checkbox"] {
		margin:5px 5px 5px 0;
		width:15px;
		height:15px;
	}
	
	select { 
		padding:8px 5px;
		width:calc(100% - 0px); 
		color:#5f5f5f;   
		border:none; 
		border-radius:10px;
		background: #fff;		
		border:2px solid #9fa0a0; 
		float:left;
	}
	
	#catalog_detail select {
		margin:0 5px;
		width:calc(100% - 10px);
	}


	/*pageselection*/
	#page-top {
		margin-bottom:25px;
		display:none;
	}
	
	#page-bottom {margin-top:25px;}

	.pageselection ul {
		width:100%;
		text-align:center;
		float:left;
	}
	
	.pageselection ul li {
		margin:5px;
		display:inline-block;
		float:none;
	}
	
	.pageselection ul li a {
		padding:5px 15px;		
		border-radius:10px;
		display:block;
	}
	
	.pageselection li.activepage {
		padding:5px 15px;
		color:#fff;
		font-weight:900;
		background:#ff84bc;
		border-radius:10px;
	}
	
	.pageselection li a:hover {
		color:#fff;
		background:#b07cda;
	}
	
	.pageselection ul li.firstpage a , .pageselection ul li.lastpage a {padding:5px 10px;}
	
	.pageselection ul li.page-word  {display:none;}
	
	
	/*messagebox*/
	.messagebox {
		margin:0 25% 15px;
		width:50%;
		text-align:Center;
	}
	
	.messagebox_title , .messagebox_content {display:none;}
	
	
	/*pop up*/
	#grayBG1 {
		width:100%; 
		height:100%;
		background:rgba(0,0,0,.8);
		position:fixed; 
		z-index:999; 
		top:0; 
		left:0;
	}
	
  #LightBox1.box_content {
  	padding:20px 25px;
  	margin-left:0;
  	width:250px; 
  	z-index:1000;  
  	color:#5f5f5f; 
  	text-align:center;
  	background:#fff;  
  	position:fixed; 
  	left:calc(50% - 150px); 
  	top:25vh; 
  }
	
	#LightBox1.box_content ul {
		padding:0; 
		margin:15px 0 0;
	}
		
	#LightBox1.box_content ul li {
		padding:0; 
		margin:0;
		width:100%;
	}
	
	#LightBox1.box_content ul li a {
		padding:5px 10px;
		margin:0 calc(50% - 50px);
		width:80px;
		font-weight:500;
		color:#fff;	
		background: #b07cda;
		border:2px solid #b07cda;
		border-radius:10px;
		float:left;
	}
	
	#LightBox1.box_content ul li a:hover {
		background:#ff84bc;
		border:2px solid #ff84bc;
	}

	#LightBoxContent {
		padding-top:15px;
		min-height:50px; 
	}
	
	.box_content a {text-decoration:none;}
	
	#LightBoxContent .message {font-weight:900;}
	
	.warning {display:none;}
		
	
	/*frame layout*/
	#artboard {
		background:#fff;
		box-shadow: rgba(0, 0, 0, 0.3) 0px 5px 15px;
		position:relative;
	}
	
	/*header*/
	.header {
		padding:10px 5% 0;
		width:90%;
		border-bottom: 3px solid #ececec;
	}
	
			
	/*logo*/
	.logo {
		margin:15px 0;
		width:300px; 
	}
	
	.logo a {
		width:100%; 
		float:left;
	}
	
	#home .logo a {display:none;}
	
	
	/*top-social*/
	.top-social {
		margin:10px 15px 0 calc(100% - 640px);
		width:165px; 
	}
		
	.top-social ul li {
		margin:0 10px; 
		width:35px; 
		float:left
	}


	/*top-right*/
	.top-right {
		margin:-15px 10px 15px 0;
		width:150px;  
	}
	
	.top-right a {
		width:100%; 
		font-size:1.25em;
		font-weight:bold;
		color:#9fa0a0;
		float:left;  
	}
	
	.top-right a div {
		margin:0px 0;
		width:calc(100% - 40px);
	}
	
	.top-right div p {width:calc(100% - 40px); }
	
	.top-right a img {
		margin:0 0 0 5px;
		width:35px;  
	}

	
	/*mainmenu*/
  #mainmenu {
  	margin:15px 0 0 0;
  	width:calc(100% - 400px);  
  	position:relative;
  	z-index:999; 
  	float:right;
	}
	
	#mainmenu ul {text-align:right;}
	
	#mainmenu ul li {margin:0; display:inline-block; position:relative;}
	
	#mainmenu ul li a {
		padding:15px 20px;
		font-size:1.25em; 
		font-weight:bold;
		color:#ff84bc; 
		float:left; 
	}
	
	#mainmenu ul li a:hover {color:#b07cda;}
	
	#mainmenu ul li#menu14344 > a {
		padding:15px 30px 15px 20px; 
		background: url(graphics/menu-arrow.webp) no-repeat right 12px top 25px; 
		background-size:12px;
	}
	
	#mainmenu ul li#menu14335 {display:none;}	
	

	/*css for dropdown menu */
  #mainmenu ul li ul {
  	padding:0; 
  	margin:0px; 
  	position:absolute; 
  	display:none;
  	top:55px;
  	left:-15px;
  	z-index:99;
  	box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
  } 
  
  #mainmenu ul li:hover > ul {
  	padding:0;
  	margin:0 ;
  	width: 160px;
  	background: #fff;
  	display: block;  
  }
  
 	#mainmenu ul li ul li {
 		padding:0px; 
 		margin:0;
 		width:100%;  
 		text-align:center;  
 		border-bottom:1px solid #ff84bc;
 		float:left;
 	}
 	
 	#mainmenu ul li ul li:last-child {border-bottom:none;}
 	
  #mainmenu ul li ul li a {
  	padding:15px 10px; 
  	width:calc(100% - 20px); 
  	text-align:center;
  }
  
  #mainmenu ul li ul li a:hover , #mainmenu ul li ul li ul li a:hover {
  	background:#b07cda; 
  	color:#fff;
  }
  
  #mainmenu ul li ul li:hover a {background:#b07cda;}


	/*maincontent*/
	.maincontent {
		padding:15px calc(50% - 600px) 45px; 
		margin:0px 0 0px;
		width:1200px;  
		min-height:55vh; 
		background:#fff url(graphics/home-info.webp) center top no-repeat;
		background-size:1920px auto;
	}
	
	.maincontent-body {position:relative;}	
	
	#home	.maincontent {display:none;}
	

	/*totop*/
	.totop {
		width:50px;
		height:50px;
		position:fixed;
		bottom:30px;
		right:10px;
		z-index:500;
	}
	
	.totop a {
		width:100%;
		height:100%;
		background: url(graphics/totop.webp) left top no-repeat;
		background-size:100%;
		float:left;
	}
	

	/*footer*/
	.footer {
		padding:50px 0 25px;
		width:100%;  
		background:#fff url(graphics/copyright.webp) left bottom no-repeat;
		background-size:100%;
		border-top:3px solid #ececec;
	}
	
	.footer-body {
		background: url(graphics/footer.webp) right 5% top no-repeat;
		background-size:1000px auto;
	}
	
	
	/*footer-unit*/
	.footer-unit {
		margin:0px calc(50% - 600px) 30px;
		width:1200px; 
	}
	
	.footer-unit ul {}
	
	.footer-unit ul li {
		margin:0 0 15px;
		width:100%; 
	}
	
	.footer-unit p {
		margin:5px 6px 15px;
		width:calc(100% - 10px);  
		display:none;
	}
	
	
	.footer-unit img[alt="openarrow"] , .footer-unit img[alt="closearrow"]{
		margin:-5px 0 0; 
		width:10px; 
		float:none; 
		display:inline-block;
	}
	
	.footer-unit img[alt="openarrow"] {display:inline-block;}
	
	.footer-unit img[alt="closearrow"] {display:none;}

	.footer-unit .flipopen img[alt="closearrow"] {display:inline-block;}
	.footer-unit .flipopen img[alt="openarrow"] {display:none;}	
	
	
	/*home-sponsor*/
	.home-sponsor {
		padding:0px 0 !important;
		margin:0px calc(50% - 600px) 45px !important;
		width:1200px !important; 
	}
	
	.home-sponsor ul {}
	
	.home-sponsor ul li {
		margin:0px 10px;
		width:calc(25% - 20px);  
		color:#fff; 
		text-align:right; 
		letter-spacing:-8px;
	}	
	
	
	/*footer-info*/
	.footer-info {
		padding:45px 0 60px;
		margin:0 calc(50% - 400px) 15px;
		width:800px; 
		border-top:3px dashed #77cfff;
	}
	
	.footer-link {width:435px;}		

	.footer-info ul {
		margin:0px 0 0 50px;
		width:305px; 
	}	
	
	.footer-info li {
		margin:5px 0;
		width:100%; 
		color:#5f5f5f; 
		float:left;
	}
	
	.footer-info li:last-child {width:100%;}
	
	.footer-info li a {color:#5f5f5f;}
	
	.footer-info li a:hover {color: #ff84bc;}


	/*copyright*/
	.copyright {
		padding:5px 15px 0; 
		margin:10px 0 0; 
		width:calc(100% - 30px);
		font-size:0.75em;
		text-align:center; 
	}
	
	.copyright a {color: #ff84bc;}
	
	.copyright a:hover {color: #b07cda;}
	
	
	/*agree policy*/
	.policy {
		padding:20px 20px; width:calc(100% - 40px);
		font-weight:bold; 
		text-align:left;
		background:rgba(255, 255, 255, 0.85);  
		border-top:1px solid #b07cda;
		position:fixed; 
		bottom:0; 
		left:0; 
		z-index:9999; 
		display:none;
	}
	
	.policy .policy-exit {
		padding:5px 0 8px;
		margin-left:25px;
		width:100px; 
		color:#fff; 
		text-align:center; 
		background:#b07cda; 
		cursor:pointer;  
		display:block;  
		float:right; 
		border-radius:10px;
	}
	
	.policy .policy-exit:hover {background:#ff84bc;}
	
	.policy p {
		width:calc(100% - 125px); 
		color:#5f5f5f;
	}
	
	.policy p a {
		margin:0 0 0 5px;
		font-weight:bold; 
		color:#b07cda;
	}	
	
	.policy p a:hover {color:#ff84bc;}
	
	
	/*homegif*/
	.homegif {
		padding:0px 5% 0;
		width:90%;
	}	

	/*home-button*/
	.home-button {margin:45px 0;}
	
	.home-button li {
		margin:0 10px;
		width:calc(33.3% - 20px);
		float:Left;
	}
	
	
	/*home-info*/
	.home-info {
		padding:0px calc(50% - 600px) 0px;
		width:1200px;  
		background:#fff url(graphics/home-info.webp) left top no-repeat; 
		background-size:100%;
	}
	
	.home-info iframe {
		margin:0 30px 0 0;
		width:60%; 
		height:450px;  
		float:left;
	}
  
  
  /*home-news*/
 	.home-info .home-news {
 		width:calc(40% - 30px); 
 		float:right; 
 	}
 	
	.home-info img[alt="最新消息標題"] {
		margin:0 calc(50% - 100px) 10px;
		width:200px; 
		float:left; 
		text-align:center;
	}
	
	.home-info #news-list {width:100%; margin:0;}

	.home-news #news-list-top {display:none;}
	
	.home-news .morenews {
		width:auto;
		font-size:1.25em;
		font-weight:bold;
		color:#5f5f5f;
		text-align:right;
		float:right;
	}
	
	.home-news .morenews img {
		margin:0px 0 0 15px;
		width:30px;
		float:none;
		display:inline-block;
		position:relative;
		top:10px;
	}
		
			
	/*home-events*/
	#home-events {
		padding:100px calc(50% - 600px) 30px;
		width:1200px;  
		background:#f5f5f5 url(graphics/home-map.webp) left top -30px no-repeat; 
		background-size:100%; 
		position:relative;
	}
	
	#taiwanmap {width:50%;}
	
	#mapinfo {
		margin:0 0 0 5%;
		width:45%;
		height:750px; 
	}
	
	#mapinfo h1 {}
	
	#mapinfo iframe {
		width:100%; 
		height:330px; 
		float:left;
	}	
			
	#mapinfo table {
		margin:5px 0;
		font-size:1.25em; 
	}
	
	#mapinfo table tr {}
	
	#mapinfo table tr td {
		padding:5px 0; 
		margin:2.5px;
		width:calc(20% - 18px);  
		text-align:center; 
		background:#fff; 
		border-radius:10px; 
		height:auto;
		float:left; 
	}
	
	#mapinfo table tr td.none ,	#mapinfo table tr:first-child td.none {background:none;}
	
	#mapinfo table tr td:first-child , #mapinfo table tr td.station , #mapinfo table tr td.station1 {width:60px; }	
	
	#mapinfo table tr:first-child td:first-child , #mapinfo table tr td.station  {
		color:#fff;
		background:#e4a699 !important; 
	}
	
	#mapinfo table tr:first-child td {background:#f6d5c4;}
	
	#mapinfo table tr:first-child td.others {background:#f6d5c4;}
	
	#mapinfo table a {color:#5f5f5f; }	
	
	#mapinfo table td:hover a , #mapinfo table a:hover {color:#003e8b;}
	
	
	/*.day-info {
		margin:45px 0 0;
		height:350px;
	}*/

	.day-info {
		width:290px; 
		position:absolute; 
		left:36%; 
		bottom:15vh; 
		color:#003e8b;
	}
	
	@media screen and (min-width:1921px){
		.day-info {position:absolute; left:40.5%; bottom:15vh;}	
	}	
	
	
	.pop-exit , .pop-exit1 {
		width:40px; 
		position:absolute; 
		top:15px;
		right:15px; 
		cursor:pointer; 
		display:none;
	}
	
	
	/*home-detail*/
	.home-detail {
		padding:45px calc(50% - 600px) 75px;
		width:1200px;  
		background:#f4eff6 url(graphics/home-search.webp) center bottom no-repeat;  
		border-top:5px solid #fff;
	}
		
	.home-video {
		padding:0px 0 !important;
		margin:0 30px 0 0 !important;
		width:50% !important;
	}
	
	.home-video iframe {height:350px;}
	
	.home-video ul li {
		margin:0;
		width:100%;
		float:Left;
		letter-spacing:-8px;
	}	
	
	
 	.home-search {
 		width:calc(50% - 30px); 
 		float:right; 
 	}

 	.home-search img[alt="search-title"] {
		margin:0 calc(50% - 100px) 15px;
		width:200px; 
		float:left; 
		text-align:center;
	}
	
 	.home-search ul {}
 	
 	.home-search ul li {
 		margin:0 5px 30px;
 		width:calc(33.3% - 10px);
 		float:Left;
 	}
 		
 	 	
 	/*article list*/
	.listing-title , #news-list-bottom  {display:none;}
	
	#news-list {
		margin:15px calc(50% - 400px);
		width:800px;
	}
	
	#postingNotice {
		padding:30px 50px;
		margin:0 calc(50% - 400px);
		width:700px;
		border:3px solid #b07cda;
		display:none;
	}

	.listing-ul {		
		margin:0px 0 15px; 
		width:calc(100% - 6px); 
		border:3px solid #77cfff;
		border-radius:10px;
		box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
	}
	
	.listing-ul:hover {border:3px solid #ff84bc;}
	
	.listing-ul li {
		width:100%;
		float:Left;
	}
	
	.listing-ul li.upc-subject {
		margin:0 0;
		width:100%;
		font-size:1.25em;
	}
	
	.listing-ul li.upc-subject a {
		padding:10px 15px; 		
		width:calc(100% - 30px); 
		color:#5f5f5f;
		background: url(graphics/right.webp) right 15px center no-repeat; 
		background-size:35px; 
		float:left;
	}	
	
	.listing-ul li.upc-subject a span {
		margin:0 0 5px;
		width:100%;
		font-size:0.8em;
		font-weight:bold;
		float:left;
	}
	
	.listing-ul li.upc-picture , .listing-ul li.upc-date , .listing-ul li.new , .listing-ul li.upc-more {display:none;}
	
	
	.go-back {margin:15px 0 15px;}
	
	.go-back a { 
		margin:0 calc(50% - 75px);
		padding:10px 10px;
		width:130px;  
		color:#fff;
		text-align:center; 
		background:#ff84bc;
		border-radius:10px;
		float:left;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);
	}
	
	.go-back a:hover {background:#b07cda;} 
	
	
	/*article detail*/	
	#news-content {}
	
	#news-content .post-title {}	
	
	#news-content .post-date {
		margin:10px 0; 
		text-align:center;
		display:none;
	}
	
	#news-content .post-brief {
		margin:0px 0 15px;
		color:#003e8b;
		text-align:center; 
	}
	
	#news-content .post-brief span {
		margin:0 15px 0 0;
		width:auto; 
		font-size:1.25em; 
		font-weight:900;
		display:inline-block; 		
	}
	
	#events-main-picture {margin:15px 0 15px;}
	
	#gallery-imglist {margin:0px 0 15px;}

	#gallery-imglist .imgbody {
		margin:0 1% 15px;
		width:31.3%; 
	}
	
	
	.break-line {display:none;}
	
	#news-content .news-pic {}
	
	#news-content .news-pic ul {}
	
	#news-content .news-pic ul li {
		padding:0 0; 
		margin:0 1% 15px; 
		width:18%; 
		text-align:center;
		background:none; 
		float:left; 
	}
	
	.news-detail .news-pic ul li img {
		width:auto; 
		height:150px; 
		float:none;
	}
	
	
	#news-content .two-pic {margin:15px 0 5px;}
	
	#news-content .two-pic ul {}
	
	#news-content .two-pic ul li {
		padding:0 0; 
		margin:0 1% 15px;
		width:48%;  
		min-height:480px; 
		text-align:center;
		background:none;  
	}
	
	#news-content .two-pic ul li img {
		width:100%;
		float:left;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, .3); 
	}
	
	
	/*origin*/
	.main-image {margin:5px 0 15px;}
	
	.main-image img {
		margin:5px calc(50% - 400px);
		width:800px;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, .3); 
	}
	
	.main-image p {text-align:center;}
	
		
	/*station-pic*/
	.station-pic {
		margin:0 0 0px;
		background: url(graphics/album-top.png) top center no-repeat; 
		background-size:100%; 
	}
	
	.station-pic-body {
		margin:0 0 0px;
		background: url(graphics/album-btn.png) bottom center no-repeat; 
		background-size:100%; 
	}
	
	
	.station-title {
		padding:18px 0; 
		margin:0 0 80px;
		width:160px;
		font-size:1.25em; 
		font-weight:bold;  
		text-align:center;
	}
	
	.station-subtitle {
		padding:18px 20px; 
		margin:0 0 80px;
		width:calc(100% - 200px); 
		font-size:1.25em; 
		font-weight:900;  
	}
	

	.station-info {
		margin:0 0 50px;
		background: url(graphics/album-cen.png) top center repeat-y; 
		background-size:100%;
	}
	
	.station-info > span {
		margin:0px 0 0 35px;
		width:95px; 
		font-size:6em;
		color:#e3f1f2; 
		font-weight:500;
		line-height:120%;
		float:left;  
	}
	
	.pic-table {
		margin:5px 25px 0px 0px;
		width:calc(100% - 155px);  
		height:480px; 
		overflow-y:scroll;
	}
	
	.pic-table > div {margin:15px 0 0;}
	
	.pic-table > div > div {}
		
	.pic-table > div > div > div {
		margin:0 15px 15px;
		width:calc(33.3% - 30px); 
	}
	
	.pic-table h3 {
		margin:5px 15px;
		width:calc(100% - 30px); 
		color:#003e8b;
		text-align:left;
	}
	
	.pic-table p {
		margin:5px 15px;
		width:calc(100% - 30px);
	}
	
	.pic-table ul li {
		padding:0 0 5px 25px; 
		margin:0 15px;
		width:calc(100% - 55px);  
		background: url(graphics/li.png) no-repeat left 5px top 10px; 
		background-size:8px;
	}


	/*menu-14301 , menu-14303 , menu-14304 , menu-14336*/
	#menu-14301 .news-detail h3 , #menu-14303 .news-detail h3 , #menu-14304 .news-detail h3 , #menu-14336 .news-detail h3 {
		margin:5px 0 15px; 
		width:100%; 
		color:#003e8b;
	}
	
	#menu-14301 #news-content , #menu-14303 #news-content , #menu-14304 #news-content , #menu-14336 #news-content {
		margin:0 calc(50% - 300px);
		width:600px; 
	}

	#menu-14301 #news-content img , #menu-14303 #news-content img , #menu-14304 #news-content img , #menu-14336 #news-content img {box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);}
	
	#news-content .htag {text-align: Center;}
	
  #news-content .htag a {
  	padding:5px 5px; 
  	margin:0 10px 5px 0;
  	width:auto;
  	color:#01b6e3;  
  	font-weight: bold;  
  	float:none; display: 
  	inline-block;
  }	

	#news-content .htag a:hover {color:#003e8b;}


	#menu-14301 #news-content ul li , #menu-14303 #news-content ul li , 
	#menu-14304 #news-content ul li , #menu-14336 #news-content ul li {
		padding:0 0 5px 5px; 
		margin: 0 0 0 20px;
		width:calc(100% - 25px);  
		list-style-type: decimal; 
		background: none;
	}
	
	#menu-14301 .news-detail ul.material li , #menu-14303 .news-detail ul.material li , 
	#menu-14304 .news-detail ul.material li , #menu-14336 .news-detail ul.material li {width:calc(33.3% - 25px);}


	/*search-adv*/
	.search_criteria {
		margin:0px calc(50% - 400px);
		width:800px; 
	}
	
	.search_criteria-title {
		margin:15px 0 15px;
		width:100%;
		font-size:2.5em;
		line-height:150%;
		color:#5f5f5f;
		font-weight:bold;
		text-align:center;
		float:left;
	}
	
	.search_criteria-title img {
		margin:0 0 0 10px;
		width:35px; 
		float:none; 
		display:inline-block;  
		position:relative; 
		top:5px;
	} 
	
	.search_keyword , .search_organization , .search_location , .search_category , .search_subject , .search_oneday {margin:0 0 10px;}
	
	.search_keyword input {
		background:#fff url(graphics/search.webp) no-repeat center right 15px; 
		background-size:30px; 
		border-radius:10px;
	}
	
	.search_criteria select {border-radius:10px;}
	
	
	.search_subject {
		margin:0 5%;
		width:90%;
		letter-spacing:-8px; 
		text-align:center;
	}
	
  .search_subject p {
  	 margin:0 10px;
  	 width:auto; 
  	 letter-spacing:normal; 
  	 float:none; 
  	 display: inline-block;
  }
  
  .search_subject input[type="checkbox"] {display: none;}
	
	.search_subject input[type="checkbox"] + label {
		padding:5px 5px; 
		margin:0 0 10px;
		width:80px;  
		text-align:center; 
		color:#9fa0a0; 
		background:#fff; 
		border:2px solid #9fa0a0; 
		cursor: pointer; 
		border-radius:10px;
		float:left; 
	}
	
	.search_subject input[type="checkbox"] + label#subject_c {width:120px; }
	
	.search_subject input[type="checkbox"]:hover + label {
		color:#ff84bc;
		background-color:#fff; 
		border:2px solid #ff84bc;
	}	
	
	.search_subject input[type="checkbox"]:checked + label {
		color:#fff;
		background-color:#b07cda;  
		border:2px solid #9fa0a0;
	}		

			
	.sub-seach {
		margin:10px calc(50% - 153px); 0;
		width:300px; 
		text-align:center;		
	}
 
  .sub-seach a , .sub-seach input {
  	margin:0 5px; 
  	border-radius:10px; 
  }
 	
 	.sub-seach a#clear-button {
 		padding:7px 25px;
 		width:116px;  
 		color:#fff; 
 		background:#003e8b; 		
		border:2px solid #003e8b;
 		float:left;
 	}
  
  .sub-seach a#clear-button:hover {
  	color:#003e8b; 
 		background:#fff;
		border:2px solid #003e8b;
 	}
  
  .sub-seach input {
  	padding:10px 50px 10px 25px;
  	width:110px; 
  	border-radius:10px; 
  	background:#ff84bc url(graphics/serch-arrow.png) no-repeat center right 25px; 
  	background-size:10px; 
  }
 
  .sub-seach input:hover {
  	background:#b07cda url(graphics/serch-arrow.png) no-repeat center right 25px; 
  	background-size:10px;
  }


	/*searchinfo*/
	.searchinfo {
		padding:20px 50px; 
		margin:30px 0 0;
		width:calc(100% - 100px); 
	}
	
	.searchinfo h1 {color:#5f5f5f;}
	
	.search_content {
		margin:15px 0 0
		text-align:center;
	}
	
  .search_content .listing-ul {
  	padding:15px 15px 15px;
		width:calc(100% - 36px); 
  }
  
	.search_content .listing-ul li {text-align:left;}
	
 	.search_content .listing-ul li.upc-picture {
 		margin:0;
 		width:350px; 
 		background:#fff; 
 		border-radius:10px; 
 		overflow:hidden; 
 		box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
 		display:block;
 	}
  
  .search_content .listing-ul li.ul-news-status , .search_content .listing-ul li.new {display:none;}
  
  .search_content .listing-ul li.upc-info {
  	margin:0 0 0 15px;
  	width:calc(100% - 365px); 
  }
  
  .search_content .listing-ul li.upc-subject , .search_content li.upc-brief {
  	margin:0; 
  	padding:0;
  	width:100%; 
  }
  
	.search_content .listing-ul li.upc-subject a {
		padding:10px 0px; 		
		width:100%; 
		font-weight:bold;
		background: none;
	}	
	
	.search_content .listing-ul li.upc-subject:hover a {color:#003e8b;} 
	
	.search_content .listing-ul li.upc-brief .htag {margin:15px 0 0;}
	
  .search_content .listing-ul li.upc-brief a {
  	padding:5px 10px; 
  	margin:0 10px 10px 0; 
  	width:auto; 
  	color:#5f5f5f; 
  	border:1px solid #5f5f5f; 
  	border-radius:10px;
  	float:left; 
  }
	
	.search_content .listing-ul li.upc-brief a:hover {
		background:#5f5f5f; 
		color:#fff;
	}







	/*1279*****************************/
	@media screen and (max-width:1279px) {	

	/*header*/
	.header {
		padding:40px 15px 0;
		width:calc(100% - 30px);
		position:relative;
		border-bottom:3px solid #ececec;
	}

	#home .header {
		padding:15px 15px 0;
		border-bottom:none;
	}

	/*logo*/
	.logo {
		margin:15px calc(50% - 175px);
		width:350px; 
	}
	
	
	/*top-social*/
	.top-social {
		margin:0 10px;
		width:165px;  
		position:fixed; 
		top:2px; 
		right:150px; 
		z-index:99999;
	}
	

	/*top-right*/
	.top-right {
		margin:2px 10px 0px 0;
		position:fixed; 
		top:0; 
		right:0px; 
		z-index:99999;
	}
	

	/*mainmenu*/
  #mainmenu {
  	margin:0;
  	width:100%;  
  	display:none;
  }


	/*maincontent*/
	.maincontent {
		padding:15px 15px 30px; 
		width:calc(100% - 30px); 
	}


	/*totop*/
	.totop {
		bottom:15px;
		right:15px;
	}


	/*footer*/
	.footer {
		padding:15px 0 25px;
		background:#fff url(graphics/copyright.webp) left bottom no-repeat;
		background-size:100%;
	}
	
	.footer-body {
		background: url(graphics/footer.webp) right 15px top no-repeat;
		background-size:600px auto;
	}
	
		
	/*footer-unit*/
	.footer-unit {
		margin:0px 15px;
		width:calc(100% - 30px); 
	}
	

	/*home-sponsor*/
	.home-sponsor {
		padding:0px 0 !important;
		margin:0px 15px 15px !important;
		width:calc(100% - 30px)  !important; 
	}


	/*footer-info*/
	.footer-info {
		padding:15px 0;
		margin:5px calc(50% - 400px) 0px;
		width:800px; 
	}
		

	/*copyright*/
	.copyright {
		padding:0 15px; 
		margin:0 0; 
	}
	
		
	/*homegif*/
	.homegif {
		padding:0px 0 0;
		width:100%;
	}
	
	
	/*home-button*/
	.home-button {margin:0px 0 15px;}
	
	.home-button li {
		margin:0 5px;
		width:calc(33.3% - 10px);
	}
	
	
	/*home-info*/
	.home-info {
		padding:15px 15px 15px;
		width:calc(100% - 30px);
	}	
	
	
	/*home-events*/
	#home-events {
		padding:100px 15px 30px;
		width:calc(100% - 30px); 
	}

	#taiwanmap {width:50%; margin:0 25%;}
	
	#mapinfo {
		padding:30px 15px 30px;
		margin:0;
		width:calc(100% - 30px); 
		height:calc(100vh - 60px); 		
		background:rgba(255, 255, 255, .8);
		position:absolute;
		top:0; 
		left:0; 
		z-index: 9;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);
		display:none; 
	}
		
	#mapinfo table {width:50%;}

	#mapinfo table tr td {box-shadow: 0px 0px 5px rgba(0, 0, 0, .3); }
	
	#mapinfo table tr td.none {box-shadow:none;}
	
	.pop-exit , .pop-exit1 {display:block;}
	

	/*home-detail*/
	.home-detail {
		padding:30px 15px 15px;
		width:calc(100% - 30px); 
		background:#f4eff6 url(graphics/home-search.webp) center bottom no-repeat;  
		background-size:100%;
	}
	
	
	/*station-pic*/	
	.pic-table {
		margin:5px 25px 0px 0px; 
		height:450px;
	}


	/*search-adv*/
	.search_criteria {
		margin:0px 0;
		width:100%; 
	}
	
	.search_subject {
		margin:0 0%;
		width:100%;
	}
	
	
	/*searchinfo*/
	.searchinfo {
		padding:15px 0px; 
		margin:15px 0 0;
		width:100%; 
	}


	/*hamburger*/
	.mm-page {width:100%;}
	
	.nav-header {
		background:#fff !important; 
		box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
	}
	
	#hamburger:before, #hamburger:after, #hamburger span {background:#9fa0a0 !important;}
	
	#hamburger {
		margin:7px 0 7px 5px !important;
		top:-5px !important; 
	}	
 
  ul#menu a , .mm-list a {text-decoration:none !important;}	



}












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

	/*home-sponsor*/
	.home-sponsor ul li {width:calc(33.3% - 20px);}	
	
	
	/*home-info*/
	.home-info iframe {
		margin:0 0 30px;
		width:100%; 
		height:550px;  
	}
  
  .home-info .home-news {width:100%;}
  
	
	/*home-events*/
	#home-events {padding:50px 15px 50px;}
	
	#mapinfo h1 {margin:5px 0;}

	#mapinfo iframe {
		margin: 0%;
		width:100%;
		height:200px;
	}	
	
	#mapinfo table {
		margin:0 25%;
		width:50%;
		font-size:1em;
	}

	.day-info {
		margin:0px calc(50% - 75px) 0;
		width:150px;		
		height:auto; 
		position:relative; 
		left:0; 
		bottom:0; 
		top:0px;
	}


	/*home-detail*/	
	.home-video {
		margin:0 0 15px !important;
		width:100% !important; 
	}	
	
	.home-video iframe {height:550px;}
    
 	.home-search {width:100%;}
 	

 	/*article list*/	
	#news-list {
		margin:15px 0;
		width:100%;
	}
	
	#postingNotice {
		padding:15px 15px;
		margin:0;
		width:calc(100% - 36px);
	}	
	
	
	/*article detail*/	
	#news-content .news-pic ul li {
		margin:0 1% 15px;
		width:31.3%; 
	}

	#news-content .two-pic ul li {min-height:420px;}


	/*origin*/
	.main-image img {
		margin:5px 0;
		width:100%;
	}
		

	/*station-pic*/
	.station-title {
		padding:10px 20px;
		margin:0 0 60px
		width:100px;  
		text-align:left;
	}
	
	.station-subtitle {display:none;}

	.station-info {margin:0 0 30px;}

	.station-info > span {
		margin:0px 0 15px 35px;
		width:65px; 
		font-size:4em;
	}
	
	.pic-table {
		margin:5px 25px 15px 0px;
		width:calc(100% - 125px);  
		height:400px;
	}


	/*searchinfo*/
 	.search_content .listing-ul li.upc-picture {width:250px;}
    
  .search_content .listing-ul li.upc-info {width:calc(100% - 265px);}








}













	/*800*****************************/
	@media screen and (max-width:800px) {	

	/*home-sponsor*/	
	.home-sponsor ul li {width:calc(50% - 20px);}	
	
	
	/*footer*/	
	.footer-body {
		background: url(graphics/footer.webp) right top no-repeat;
		background-size:450px auto;
	}
	
	
	/*footer-info*/
	.footer-info {
		padding:15px 0;
		margin:5px 0 0px;
		width:100%; 
	}
		
	
	.footer-link {
		margin:0 calc(50% - 215px);
		width:430px;
	}		

	.footer-info ul {		
		margin:0px calc(50% - 145px); 
		width:290px;
	}	


	/*copyright*/
	.copyright {line-height:100%;}
	
	
	/*home-button*/
	.home-button li {
		margin:0 calc(50% - 225px) 15px;
		width:450px;
	}
	
		
	/*home-info*/
	.home-info iframe {
		margin:0 0 15px;
		height:450px;
	}
	
	
	/*home-events*/
	#taiwanmap {
		margin:0 ;
		width:100%; 
	}
	
	#mapinfo iframe {height:450px;}	
	
	#mapinfo table {
		margin:0 15%;
		width:70%;  
	}


	/*home-detail*/		
	.home-video iframe {height:450px;}
	
	
 	.home-search ul li {
 		margin:0 5px 20px;
 		width:calc(50% - 10px);
 	}
 	
 	
	/*article detail*/	
	#news-content .two-pic ul li {min-height:350px;}
	
	
	/*station-pic*/
	.station-pic {
		background: url(graphics/album-top1.png) top center no-repeat; 
		background-size:100%; 
	}
		
	.station-title {
		padding:0px 15px; 
		margin:0; 
		font-size:0;
	}
	
	.station-info > span {
		margin:0px 20px;
		width:calc(100% - 40px);  
		color:#4a4947; 
		font-size:2.5em;
	}
	
	.pic-table {
		margin:15px 10px 0px;
		width:calc(100% - 20px);  
		height:500px; 
	}		
	
	.pic-table h3 {
		margin:5px 10px;
		width:calc(100% - 20px); 
	}
	
	.pic-table > div > div > div {
		margin:0 10px 15px;
		width:calc(33.3% - 20px); 
	}

	/*menu-14301 , menu-14303 , menu-14304*/		
	#menu-14301 #news-content , #menu-14303 #news-content , #menu-14304 #news-content {
		margin:0 0;
		width:100%; 
	}
	
	#menu-14301 .news-detail ul.material li , #menu-14303 .news-detail ul.material li , 
	#menu-14304 .news-detail ul.material li {width:calc(50% - 25px);}


	/*searchinfo*/
 	.search_content .listing-ul li.upc-picture {width:100%;}
    
  .search_content .listing-ul li.upc-info {
  	margin:0;
  	width:100%;
  }	
	
}













	/*640*****************************/
	@media screen and (max-width:640px) {	
		
	
	/*title*/
	h1, .posting-title , .post-title , 	#catalog_display h1 span , 
	#main_info span , .emailtitle , #menu-name , .reg-search-title , 
	.search_criteria-title {
		margin:0px 0 15px;
		font-size:2em;
	}
	
	h2 {margin:5px 0 10px;}
	

	/*footer*/	
	.footer-body {
		background: url(graphics/footer.webp) right top no-repeat;
		background-size:290px auto;
	}
	
	
	/*home-button*/
	.home-button li {
		margin:0 0 5px;
		width:100%;
	}
	
	
	/*home-info*/
	.home-info iframe {height:350px;}


	/*home-events*/	
	#mapinfo iframe {height:350px;}	
	
	#mapinfo table {
		margin:0 0%;
		width:100%; 
	}


	/*home-detail*/	
	.home-video iframe {height:350px;}

 	.home-search ul li {
 		margin:0 0px 15px;
 		width:100%;
 	}
 	
 	
 	/*article list*/
	.listing-ul li.upc-subject a {background:none;}	
	
	.listing-ul li.upc-subject a span {
		padding:0 0 10px;
		margin:0 0 10px;
		width:100%;
		border-bottom:3px dashed #77cfff;
		float:left;
	}	
	
	
  /*article detail*/	
	.news-detail .news-pic ul li {width:100%; margin:0 0 15px;}
	.news-detail .news-pic ul li img { height:auto;}
	
		
	#news-content .two-pic ul li {
		margin:0 0 15px;
		width:100%;  
		min-height:auto;
	}
	
		
	/*station-pic*/
	.station-pic-body {
		background: url(graphics/album-btn1.png) bottom center no-repeat; 
		background-size:100%; 
	}
	
	.pic-table > div > div > div {
		margin:0 10px 15px;
		width:calc(100% - 20px); 
	}


	/*menu-14301 , menu-14303 , menu-14304*/			
	#menu-14301 .news-detail ul.material li , #menu-14303 .news-detail ul.material li , 
	#menu-14304 .news-detail ul.material li {width:calc(100% - 25px);}
	

	/*search-adv*/	
  .search_subject p {margin:0 10px 10px;}

	
			
}












	/*480*****************************/
	@media screen and (max-width:480px) {	

	/*logo*/
	.logo {
		margin:15px calc(50% - 125px);
		width:250px; 
	}


	/*top-social*/
	.top-social {
		margin:3px 0px 0;
		width:120px; 
	}
	
	.top-social ul li {
		margin:0 5px; 
		width:30px;
	}
	
	
	/*top-right*/
	.top-right {
		margin:2px 5px 0px 0;
		width:135px;
	}
	
	.top-right a {font-size:1.12em;}


	/*footer*/	
	.footer-body {
		background: url(graphics/footer.webp) right top 120px no-repeat;
		background-size:270px auto;
	}
	
		
	/*home-sponsor*/
	.home-sponsor ul li {
		margin:0px 0px;
		width:calc(100% - 0px); 
	}	
	
	
	/*footer-info*/
	.footer-link {
		margin:0 calc(50% - 145px);
		width:290px;
	}			
	
	
	/*agree policy*/
	.policy .policy-exit {
		margin:5px calc(50% - 50px) 0;
		width:100px;
	}
	
	.policy p {width:100%;}
		
		
	/*home-info*/
	.home-info iframe {height:250px;}

	
	/*home-events*/	
	#mapinfo iframe {height:200px;}	
	
	#mapinfo table {font-size:0.8em;}
	
	#mapinfo table tr td {width:calc(20% - 14px);}
	
	#mapinfo table tr td:first-child , #mapinfo table tr td.station , #mapinfo table tr td.station1 {width:40px; }	
	
	.pop-exit , .pop-exit1 {width:30px; }
		
		
	/*home-detail*/	
	.home-video iframe {height:250px;}
		
	
	
}












	/*330*****************************/
	@media screen and (max-width:330px) {	
	#mapinfo table tr td {font-size:0.75em;}	

}