@charset "utf-8";



/* 簡單流變媒體



   注意: 流變媒體要求您必須移除 HTML 中媒體的高度和寬度屬性



   http://www.alistapart.com/articles/fluid-images/ 



*/







#top-bar{



	width: 100%;



	height: 27px;



	position: fixed;



	top: -35px;



	z-index: 99;



	/* CSS3 陰影*/



	display: none;



}



#topbg {

	background-image: url(../images/top_main_mobile.jpg);

	background-repeat: no-repeat;

	background-position: center top;









}



#LayoutDiv1 {



	height: 285px;







}



#LayoutDiv12 {



	height: 50px;



}



#LayoutDiv2 {







	display: none;







}



#LayoutDiv3 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	margin-top: 10px;



	margin-bottom: 10px;



}



#LayoutDiv31 {



	clear: both;



	float: left;



	margin-left: auto;



	width: 94%;



	display: block;



	background-color: #FFF;



	border-radius: 5px;



	-moz-box-shadow: 0px 0px 3px #999;



	-webkit-box-shadow: 0px 0px 3px #999;



	box-shadow: 0px 0px 3px #999;



	margin-right: auto;



	margin-bottom: 10px;



	padding-top: 2%;



	padding-right: 2%;



	padding-bottom: 3%;



	padding-left: 2%;



}



























#LayoutDiv31 h2 {



	margin-top: 10px;



	margin-bottom: 10px;



	float: left;



	width: 98%;



	padding-left: 2%;



	color:#01458E;



}



#LayoutDiv31 h4 {



	color: #0a5088;



	margin: 0px;



	font-size: 1em;



}



#LayoutDiv31 h5 {



	font-size: 0.9em;



	background-color: #0a5088;



	padding: 10px;



	margin-top: 0px;



	margin-right: 0px;



	margin-bottom: 0px;



	margin-left: 0px;



	color: #FFF;



	line-height: 1.2em;



	border-radius: 7px 7px 0px 0px;



	border-bottom-width: 1px;



	border-bottom-style: solid;



	border-bottom-color: #FFF;



}



#LayoutDiv31 h6 {



	font-size: 0.9em;



	line-height: 1.2em;



	text-align: center;



	margin: 0px;



	padding-top: 5px;



	padding-right: 10px;



	padding-bottom: 10px;



	padding-left: 10px;



}







#LayoutDiv31 hr {



	clear: both;



}



#LayoutDiv31 p {



	text-align: justify;



}

#LayoutDiv31 .exhibition_date {

	font-size: .8em;

}

.from_list table {

	margin-top: 15px;

}

.from_list th {

	background-color: #00c0ff;

	padding: 3px;



}





















#LayoutDiv32 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



#LayoutDiv33 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



	background-color: #9F9;



}



#LayoutDiv321 {



	clear: both;



	float: left;



	margin-left: 1%;



	width: 90%;



	display: block;



	margin-bottom: 10px;



	margin-right: 1%;



	border-radius: 5px;



	background-color: #FFF;



	-moz-box-shadow: 0px 0px 3px #999;



	-webkit-box-shadow: 0px 0px 3px #999;



	box-shadow: 0px 0px 3px #999;



	background-image: url(../images/boxtitle_bg.png);



	background-size: 90% 8px;



	background-repeat: no-repeat;



	background-position: center top;



	padding-top: 4%;



	padding-right: 4%;



	padding-bottom: 10%;



	padding-left: 4%;



	text-align: center;



}



#LayoutDiv321 h3 {



	text-align: center;



	font-size: 20px;



	margin-top: 5px;



	margin-bottom: 0px;



	border-bottom-width: 2px;



	border-bottom-style: dotted;



	border-bottom-color: #036;



	padding-bottom: 5px;



	width: 90%;



	margin-left: 5%;



}



#LayoutDiv31 .subtitle {



	clear: both;



	font-weight: bold;



	color: #036;



}



#LayoutDiv31 .pic_left {



	float: left;



	margin-right: 10px;

	



}











#LayoutDiv321 ul {



	font-size: 15px;



	list-style-position: inside;



	list-style-image: url(../images/Arrow_01.png);



	list-style-type: none;



	width: 90%;



	padding-left: 3%;



	margin: 0px;



	padding-top: 0px;



	padding-right: 0px;



	padding-bottom: 0px;



}



#LayoutDiv321 ul li {



	line-height: 30px;



	border-bottom-width: 1px;



	border-bottom-style: dotted;



	border-bottom-color: #999;



	float: left;



	width: 45%;



	margin-right: 5%;



	text-align: left;



}















#LayoutDiv322 {



	clear: both;



	float: left;



	margin-left: 1%;



	width: 90%;



	display: block;



	margin-bottom: 10px;



	margin-right: 1%;



	border-radius: 5px;



	background-color: #0a5088;



	-moz-box-shadow: 0px 0px 3px #999;



	-webkit-box-shadow: 0px 0px 3px #999;



	box-shadow: 0px 0px 3px #999;



	font-size: 13px;



	line-height: 24px;



	padding-top: 2%;



	padding-right: 4%;



	padding-bottom: 2%;



	padding-left: 4%;



	color: #FFF;



}



.text18b {



	font-size: 18px;



	font-weight: bold;



	text-decoration: none;



}







#LayoutDiv331 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	height: 100px;



	margin-bottom: 10px;



}



#LayoutDiv332 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	height: 200px;



}



#LayoutDiv311 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



#LayoutDiv312 {

	clear: both;

	float: left;

	margin-left: 0;

	width: 100%;

	display: block;

	font-family: 'PT Sans Narrow', sans-serif;

	font-size: 12px;

	border-bottom-width: 1px;

	border-bottom-style: solid;

	border-bottom-color: #999;

	padding-bottom: 3px;

}



#LayoutDiv313 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



	font-family: 'PT Sans Narrow', sans-serif;



	font-size: 14px;



}







/* 表格版面: 481px 到 768px。樣式繼承自: 行動版面。 */







@media only screen and (min-width: 481px) {



#top-bar{



	width: 100%;



	height: 62px;



	position: fixed;



	top: -117px;



	z-index: 99;



	/* CSS3 陰影*/



	-webkit-box-shadow: 0px 8px 15px #666;



	-moz-box-shadow: 0px 8px 15px #666;



	box-shadow: 0px 8px 15px #666;



	background-color: #e9fbff;



	padding-top: 3px;



	display: block;



}



#topbg {

	background-image: url(../images/top_page_pad.jpg);

	background-repeat: no-repeat;

	background-position: center -10px;









}



#LayoutDiv1 {



	height: 320px;







}



#LayoutDiv12 {



	height: 70px;



}



#LayoutDiv2 {







	display: none;







}



#LayoutDiv3 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



}







#LayoutDiv31 {



	clear: none;



	float: none;



	display: block;



	margin-right: auto;



	margin-left: auto;



}



#LayoutDiv32 {



	clear: none;



	float: left;



	margin-left: 0;



	width: 33%;



	display: none;



}



#LayoutDiv33 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



#LayoutDiv321 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 90%;



	display: block;



}



#LayoutDiv321 h3 {







}



#LayoutDiv321 ul {







}



#LayoutDiv321 ul li {



	float: none;



	width: 100%;







}







#LayoutDiv322 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 90%;



	display: block;



}



#LayoutDiv331 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	height: 50px;



}



#LayoutDiv332 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	height: 100px;



}



#LayoutDiv311 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



#LayoutDiv312 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



}



#LayoutDiv313 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



}







/* 桌面版面: 769px 到最大 1232px。樣式繼承自: 行動版面和表格版面。 */







@media only screen and (min-width: 769px) {



#top-bar{



	width: 100%;



	height: 62px;



	position: fixed;



	top: -150px;



	z-index: 99;



	/* CSS3 陰影*/



	-webkit-box-shadow: 0px 8px 15px #666;



	-moz-box-shadow: 0px 8px 15px #666;



	box-shadow: 0px 8px 15px #666;



	background-color: #e9fbff;



	padding-top: 3px;



}



#topbg {

	background-image: url(../images/top_page_pc.jpg);

	background-repeat: no-repeat;

	background-position: center -10px;









}



#LayoutDiv1 {



	height: 300px;



}



#LayoutDiv12 {



	height: 70px;



}



#LayoutDiv2 {







	display: none;







}



#LayoutDiv31 {



	clear: none;



	float: none;



	width: 95%;



	display: block;



	margin-right: auto;



	padding-top: 1%;



	padding-right: 1%;



	padding-bottom: 3%;



	padding-left: 1%;



	margin-left: auto;



}



#LayoutDiv33 {



	clear: none;



	float: none;



	width: 24%;



	display: none;



	position: absolute;



	margin-left: 75%;



}



#LayoutDiv321 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 90%;



	display: block;



}



#LayoutDiv322 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 90%;



	display: block;



}



#LayoutDiv331 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	height: 100px;



}



#LayoutDiv332 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



	height: 200px;



}



#LayoutDiv311 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: none;



}



#LayoutDiv312 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



}



#LayoutDiv313 {



	clear: both;



	float: left;



	margin-left: 0;



	width: 100%;



	display: block;



	text-align: right;



}



}



