@charset "utf-8";
/***** CSS Document *****/
/***** reset *****/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin:0; padding:0;}
table { border-collapse:collapse; border-spacing:0;}
fieldset, img {border:0;}
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal;}
ol, ul { list-style:none;}
caption, th { text-align:left;}
q:before, q:after { content:'';}
abbr, acronym { border:0;}



/***** html *****/
body{font-family:"微軟正黑體",Arial, Helvetica, sans-serif; line-height:1.6; font-size:13px;/* min-width:320px;*/
	background:#f3f0eb url(../images/bgbg.jpg) repeat-x;}
a, a:hover{ text-decoration:none;}
a img { border:none;}/*
body.M01 .headerall .nav .navall ul.menu li.M01 a, 
body.M02 .headerall .nav .navall ul.menu li.M02 a, 
body.M03 .headerall .nav .navall ul.menu li.M03 a, 
body.M04 .headerall .nav .navall ul.menu li.M04 a, 
body.M05 .headerall .nav .navall ul.menu li.M05 a { color:#000; background: url(../images/nav_btn.png) top;
text-shadow:0px 0px 0px rgba(0,0,0,0); -moz-text-shadow:0px 0px 0px rgba(0,0,0,0); -webkit-text-shadow:0px 0px 0px rgba(0,0,0,0);}	*/

.header.index .btntop{ display:none;}




/***** layout *****/
#Wrapper{ position:relative; width:100%; /* width:1020px; margin:0 auto;*/  background:#efebe5 url(../images/bg.jpg) no-repeat; min-height:800px;/**/}

		body.index .logo{ top:10px;}
		body.index .btntop{ display:none;}
		.logo{ position:absolute; z-index:10000; top:30px; left:50%; margin:0 0 0 -98px;}
		.icon_menu{ position:fixed; z-index:100000; left:10px; top:1px; }
		/* nav */
		.nav{ left:0px;}
		.nav{  z-index:99999; position:fixed; width:100px; padding:30px;
				background:rgba(95,45,15,.85); border-right:2px solid rgba(95,45,15,1);
				box-shadow: 1px 0 3px rgba(0,0,0,0.25);
				-moz-box-shadow: 1px 0 3px rgba(0,0,0,0.25);
				-webkit-box-shadow: 1px 0 3px rgba(0,0,0,0.25);}
		  .nav .navall{ position:relative; clear:both;}
		  .nav .navall ul.menu{ position:relative;}
		  .nav .navall ul.menu li{}
		  .nav .navall ul.menu li a{ display:block; height:30px; font-size:18px; color:rgba(255,255,255,.85);
				text-shadow:2px 2px 2px rgba(0,0,0,.4); -moz-text-shadow:2px 2px 2px rgba(0,0,0,.4); -webkit-text-shadow:2px 2px 2px rgba(0,0,0,.4);}
		  .nav .navall ul.menu li a:hover{ color:rgba(255,255,255,1); 
				text-shadow:0px 0px 0px rgba(0,0,0,0); -moz-text-shadow:0px 0px 0px rgba(0,0,0,0); -webkit-text-shadow:0px 0px 0px rgba(0,0,0,0);}		  
		  .nav .navall ul.menu ul.sub{ padding:0 0 0 20px;}
		  .nav .navall ul.menu ul.sub li{}
		  .nav .navall ul.menu ul.sub li a.subbtn{ display:block; height:25px; font-size:13px; color:rgba(255,255,255,.65); margin:0;}
		  .nav .navall ul.menu ul.sub li a:hover.subbtn{ color:rgba(255,255,255,1);}
		/*ul.menu li>ul.sub { visibility: hidden;}
		ul.menu li:hover>ul.sub { visibility: visible;}	*/
		/* btntop */
		.btntop{ position:fixed; z-index:10000; width:100%; height:26px; background:url(../images/top_bg.jpg); text-align: right;}
		  .btntop a img{ opacity:.7; padding:1px 5px;}
		  .btntop a:hover img{  opacity:.7;}



	/*--- header ---*/
	.header{ position:absolute; z-index:10; width:100%; overflow:hidden; }
	.header.index{/* height:430px;*/}
	.header.main{/* height:365px;*/}
		.headerall{ position:relative;}

		/* pic */
		.headerall .pic{ display:none; position:absolute; z-index:1; }
		.headerall .pic.index{ /*top:55px; width:850px; height:375px;*/}
		.headerall .pic.main{ /*top:65px; width:740px; height:300px;*/}
		  .headerall .picall{ position:relative;}
		  .headerall .picall.index{/* width:850px; height:375px;*/}
		  .headerall .picall.main{/* width:740px; height:300px;*/}
		  .headerall .picall .mask{ position:absolute; z-index:5;}
		  .headerall .picall .show{ position:absolute; z-index:1;}
				.show_pic {position:relative; /*width:850px; height:375px;*/}
					.show_pic a.ad {position: absolute;}
					.show_pic .control { position: absolute; right:10px; bottom:10px;}
					.show_pic .control a { display:none; margin:3px; width:7px; height:7px; text-indent:-9999px;}
					.show_pic .control a.on {}
				.top_pic {position:relative; /*width:740px; height:300px;*/}
					.top_pic a.ad {position: absolute;}
					.top_pic .control { position: absolute; right:10px; bottom:10px;}
					.top_pic .control a { display:none; margin:3px; width:7px; height:7px; text-indent:-9999px;}
					.top_pic .control a.on {}
		/* thing */ /*
			.headerall span, .headerall a.btn{ position:absolute; display:block; background-image:url(../images/top_thing.png);}
			.headerall span.colud01{ display:none; z-index:3; width:75px; height:45px; background-position:0 0;}
			.headerall span.colud02{ display:none; z-index:3; width:52px; height:35px; background-position:0 -45px;}
			.headerall span.colud03{ display:none; z-index:3; width:315px; height:185px; background-position:0 -275px;}
			.headerall span.bird01{ display:none; z-index:3; width:60px; height:45px; background-position:0 -80px;}
			.headerall span.bird02{ display:none; z-index:3; width:30px; height:15px; background-position:0 -125px;}
			.headerall span.bird03{ display:none; z-index:3; width:30px; height:15px; background-position:0 -140px;}
			.headerall span.flower{ display:none; z-index:3; width:165px; height:120px; background-position:0 -155px;}
			.headerall span.stone{ display:none; z-index:6; width:240px; height:240px; background-position:0 -460px;}
			.headerall span.lineindex{ z-index:5; width:100%; height:105px; top:325px; background-image:url(../images/top_line.png); background-position:0 0;}
			.headerall span.linemain{ z-index:5; width:100%; height:105px; top:260px; background-image:url(../images/top_line.png); background-position:0 -105px;}
			.headerall a.btn.sitemap{ z-index:6; width:45px; height:55px; top:336px; left:675px; background-position:-212px 0; margin:0 18px 0 0;}
			.headerall a.btn.contact{ z-index:6; width:45px; height:55px; top:336px; left:738px; background-position:-275px 0;}
			.headerall a.btn:hover.sitemap{ background-position:-212px -55px;}
			.headerall a.btn:hover.contact{ background-position:-275px -55px;}
			.headerall .text{ display:none; z-index:3; width:340px; height:90px; background-image:none;
								font-size:17px; line-height:1.2; color:#4d463c; font-style:italic; font-family:"華康儷宋 Std W3";}
		*/


	/*--- indexarea ---*/
	.indexarea{ position:absolute; z-index:5; width:100%; /* top:435px; background:#666;*/ }
		.box{ /* width:370px;*/ float:left;}
		.titlebar{ padding:0 0 10px 0;}
		.titlebar h2{ width:225px; height:27px; background-image:url(../images/bar_index.png); text-indent:-9999px;}
			.titlebar h2.news{ background-position:0 0;}
			.titlebar h2.action{ background-position:0 -27px;}
			.titlebar h2.word{ background-position:0 -54px;}
			.titlebar h2.traffic{ background-position:0 -81px;}
		ul.list{ padding:0 0 10px 0;}
			ul.list li { border-bottom:1px dashed #c4c4c4; line-height:1.7; font-size:14px; color:#736a5e;
						background:url(../images/dot.gif) left top no-repeat; padding:0 0 0 25px;}
			ul.list li a{ float:left; width:70%; color:#736a5e;}
			ul.list li a:hover{ color:#444;}
			ul.list li.focus { border-bottom:1px dashed #c4c4c4; line-height:1.7; font-size:14px; background:none; padding:0; color:#736a5e;}
			ul.list li.focus a{ float:left; width:62%; color:#413423; font-weight:bold;}
			ul.list li.focus img{ float:left; margin:0 15px 6px 0; border:2px solid #fff;
				border-radius:5px 5px 5px 5px; -moz-border-radius:5px 5px 5px 5px; -webkit-border-radius:5px 5px 5px 5px;
				box-shadow:2px 2px 4px rgba(0,0,0,.4); -moz-box-shadow:2px 2px 4px rgba(0,0,0,.4); -webkit-box-shadow:2px 2px 4px rgba(0,0,0,.4);}
			ul.list li span.day{ float:right; text-align:center; width:30%; color:#a69683; font-size:13px;}
			ul.list li span.bold{color:#444; font-weight:bold; padding:0 10px 0 0;}
			ul.list li span.edit{ float:left; width:62%; line-height:1.5;}
		ul.link{ padding:0 0 35px 0;/* padding:0 20px 35px 34px;*/}
			ul.link li{ display:block; float:left; /*width:50%;*/ width:138px; height:55px; padding:0 4px 0 0;}
			ul.link li:first-child a {}
			ul.link li:last-child { padding:0;}
			ul.link li img{ width:138px; height:55px;}
		.boxgallery{ clear:both; width:100%; height:68px; padding:15px 0; margin:15px 0; border-radius:5px; background:#ebe6db; border:5px solid #e2d9c8;
		 /*background:url(../images/box_gallery.png) no-repeat;*/}





	/*--- centerarea ---*/
	.centerarea{ position:absolute; z-index:5; width:100%; padding:0;}
		.left{ display:none; /* width:230px; float:left; padding:10px 35px 0 0;*/}
			.left .leftnav{position:relative; height:390px; background:url(../images/left.png) no-repeat;}
			.left .leftnav h2{ position:absolute; width:160px; height:60px; top:40px; background-image:url(../images/left_title.png); text-indent:-9999px;}
				.left .leftnav h2.about{ background-position:0 0;}
				.left .leftnav h2.news{ background-position:0 -60px;}
				.left .leftnav h2.photo{ background-position:0 -120px;}
				.left .leftnav h2.member{ background-position:0 -180px;}
				.left .leftnav h2.contact{ background-position:0 -240px;}
				.left .leftnav h2.link{ background-position:0 -300px;}
				.left .leftnav h2.word{ background-position:0 -360px;}
				.left .leftnav h2.sitemap{ background-position:0 -420px;}
			.left .leftnav ul{ position:absolute; width:160px; top:110px;}
			.left .leftnav ul li a{ display:block; height:30px; line-height:30px; overflow:hidden; padding:0 0 0 40px; font-size:14px;
									color:rgba(255,255,255,.7); background:url(../images/left_btn.png) top;}
			.left .leftnav ul li a:hover,.left .leftnav ul li a.stay{color:rgba(255,255,255,1); background:url(../images/left_btn.png) bottom; font-weight:bold;}
			.left .leftnav .lotus{ position:absolute; z-index:5; display:block; width:160px; height:120px; bottom:0; right:0; background:url(../images/left_flower.png);}

		.center{ width:92%; margin:0 auto;/* width:730px; float:left;*/ padding:0 0 35px 0; font-size:14px; line-height:1.6; text-align:justify; color:#5f5f5f;}
			.center .pagetab{ display:none; /*text-align:right; color:#666;*/}
			.center h1{ font-size:23px; color:#3f3f3f; font-weight:normal; margin:0 0 15px 0;/* margin:35px 0 15px 0;*/ background:url(../images/line.gif) bottom no-repeat; }

			ul.lists{ padding:0 0 10px 0;}
				ul.lists li { border-bottom:1px dashed #c4c4c4; line-height:1.7; font-size:14px; color:#736a5e;
							background:url(../images/dot.gif) left top no-repeat; padding:0 0 0 25px;}
				ul.lists li a{ color:#736a5e;}
				ul.lists li a:hover{ color:#444;}

			ul.photo{}
				ul.photo li{}
				ul.photo li a{ float:left; width:135px; height:120px; overflow:hidden; text-align:center; margin:0 3px 10px 0; color:#555;}
				ul.photo li a span{ display:block; width:130px; }
				ul.photo li a img{ width:125px; /*height:90px;*/ padding:3px; background:#fff; border:1px solid #aaa;
									box-shadow:2px 2px 4px rgba(0,0,0,.2); -moz-box-shadow:2px 2px 4px rgba(0,0,0,.2); -webkit-box-shadow:2px 2px 4px rgba(0,0,0,.2);}
				ul.photo li a:hover{ color:#ba9246; font-weight:bold;}
				ul.photo li a:hover img{ border:1px solid #ba9246;}
				ul.photo li:last-child a { padding:0; margin:0 0px 15px 0;}

			#main_map{ border:1px solid #c4c4c4; margin:0 0 35px 0; height:200px; width:98%; margin:0 auto;}
			.map{ border:1px solid #c4c4c4; margin:0 0 35px 0; height:200px; width:98%; margin:0 auto;}


	/*--- footerarea ---*/	
	.footerarea{ clear:both; /* height:65px;*/ background:url(../images/footer.png) bottom no-repeat; padding:15px 0 10px 0; /* padding:25px 130px 0 0;*/
				text-align:right; font-size:12px; line-height:1.8; color:#4c4c4c; border-top:1px solid #ccc;}
	.footerarea .browse{ float:left; width:120px; font-size:12px; padding:0 0 0 20px; color:#888; text-align:left;}





/*============================================================================================================*/
br.clear{ clear:both; height:0; line-height:0; font-size:0;}
	.f_left{ float:left;}
	.f_right{ float:right;}
	.t_left{ text-align:left;}
	.t_right{ text-align:right;}
	.t_center{ text-align:center;}
	.w_100{ display:block; width:100%;}
	.w_20{ display:block; width:100%; padding:0 2% 0 0;}



/*===== 文字區 ===============================================================================================*/
.font_yellow{ font-weight:bold;}
.font_orange{ font-weight:bold;}
.font_red{ color:#ff0000; font-weight:bold;}
.font_pink{ color:#bc1a64;}
.font_11{ font-size:11px; color:#333;}
.font_11gray{ font-size:11px; color:#999;}
.font_bar{ font-size:16px; font-weight:bold; border-bottom:1px solid #ba9246; border-top:2px solid #ba9246; background:rgba(255,255,255,.6);}





/*===== 按鈕區 ===============================================================================================*/
.btn_num{ width:85%; margin:10px auto; text-align:center; font-size:12px; color:#777;}
.btn_num a{ padding:0 5px; margin:0 2px; color:#777; background:#fff; border:1px solid #888;}
.btn_num a.stay ,
.btn_num a:hover{ color:#fff; background:#cca66a; border:1px solid #895d1a; font-weight:bold;}

a.more{ display:block; width:37px; height:20px; background:url(../images/btn_more.gif) top;}
a:hover.more{ background:url(../images/btn_more.gif) bottom;}

.btn01{ height:22px; padding:0 10px; margin:2px 0px; font-size:13px; color:#574233; border:1px solid #cdb890; background:url(../images/btn_bg.jpg) top; cursor:pointer;
	text-shadow:1px 1px 1px rgba(255,255,255,.85); -moz-text-shadow:1px 1px 1px rgba(255,255,255,.85); -webkit-text-shadow:1px 1px 1px rgba(255,255,255,.85);
	}
.btn02{ height:22px; padding:0 10px; margin:2px 0px; font-size:13px; color:#111; border:1px solid #b99f6e; background:url(../images/btn_bg.jpg) bottom; cursor:pointer;}





/*===== 表格區 ===============================================================================================*/
.Web_Form { margin:10px 0;}
.Web_Form table{ width:100%;}
.Web_Form tr.bar{ font-size:16px; font-weight:bold; border-bottom:1px solid #ba9246; border-top:2px solid #ba9246; background:rgba(255,255,255,.6);}
.Web_Form td{ line-height:28px; padding:0 10px; color:#555; border-bottom:1px dotted #aaa;}
.Web_Form td.title{ padding-left:25px; background:url(../images/dot.gif) top left no-repeat;}
.Web_Form td.edit{ line-height:25px; padding:5px 0 10px 10px; }

.Web_Form td span.title{ display:block; padding-left:25px; background:url(../images/dot.gif) top left no-repeat;}
.Web_Form td span.line{ display:block; border-left:1px solid #aaa; border-right:1px solid #aaa;}
.Web_Form td img{margin:5px 0;}

.Web_Form td a{ color:#555;}
.Web_Form td a:hover{ color:#630; font-weight:bold;}





/*----- text_bar --------------------------------------------------------------------------------------*/
.Text_Bar0{ float:left; width:40%; height:25px; line-height:25px; border:1px solid rgba(75,75,75,.3); color:#787878; font-size:13px;
            margin:0 5px 5px 0;/*margin:2px 5px; padding:0 5px;*/ background:rgba(255,255,255,.45);}		
.Text_Bar1{ width:100%; height:25px; line-height:25px; border:1px solid rgba(75,75,75,.3); color:#787878; font-size:13px;
            margin:0 0 5px 0;/*margin:2px 5px; padding:0 5px;*/ background:rgba(255,255,255,.45);}		
.Text_Bar2{ width:100%; height:75px; line-height:25px; border:1px solid rgba(75,75,75,.3); color:#787878; font-size:13px;
            margin:0 0 5px 0;/*margin:2px 5px; padding:0 5px;*/ background:rgba(255,255,255,.45);}		
.Text_Bar3{ width:70%; height:25px; line-height:25px; border:1px solid rgba(75,75,75,.3); color:#787878; font-size:13px;
            margin:0 0 5px 0;/*margin:2px 5px; padding:0 5px;*/ background:rgba(255,255,255,.45);}		









@media only screen and (min-width: 768px){
	.header.index{ height:300px;}
	.header.main{ height:200px;}
		.headerall .pic.index{ top:60px; width:768px; height:300px;}
		.headerall .pic.main{ top:65px; width:740px; height:300px;}
		  .headerall .picall.index{ width:500px; height:280px;}
		  .headerall .picall.main{ width:740px; height:300px;}
				.show_pic {position:relative; width:550px; height:300px;}
				.show_pic a.ad img{ width:850px;}
				.top_pic {position:relative; width:740px; height:300px;}
				.top_pic a.ad img{ width:740px;}
	.indexarea{ top:300px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}	
	.centerarea{ top:200px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}

	.w_20{ display:block; width:31%; padding:0 2% 0 0;}
	.list li{}
		.list li.focus{ display:none;}
		.list li span.day{ display:block;}
	.Web_Form td.type{ }
		.Web_Form td.day{}
		.Web_Form td.type_pic{ display:block;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	.header.index{ height:300px;}
	.header.main{ height:200px;}
		.headerall .pic.index{ top:75px; width:767px; height:300px;}
		.headerall .pic.main{ top:65px; width:740px; height:300px;}
		  .headerall .picall.index{ width:767px; height:280px;}
		  .headerall .picall.main{ width:740px; height:300px;}
				.show_pic {position:relative; width:550px; height:300px;}
				.show_pic a.ad img{ width:767px;}
				.top_pic {position:relative; width:740px; height:300px;}
				.top_pic a.ad img{ width:740px;}
	.indexarea{ top:300px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}		
	.centerarea{ top:200px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}

	.w_20{ display:block; width:48%; padding:0 2% 0 0;}
	.list li{}
		.list li.focus{ display:none;}
		.list li span.day{ display:block;}
	.Web_Form td.type{ }
		.Web_Form td.day{ display:none;}
		.Web_Form td.type_pic{ display:block; }

}

@media only screen and (min-width: 401px) and (max-width: 479px) {
	.header.index{ height:250px;}
	.header.main{ height:170px;}
		.headerall .pic.index{ top:50px; width:479px; height:250px;}
		.headerall .pic.main{ top:65px; width:479px; height:170px;}
		  .headerall .picall.index{ width:479px; height:280px;}
		  .headerall .picall.main{ width:479px; height:300px;}
				.show_pic {position:relative; width:479px; height:250px;}
				.show_pic a.ad img{ width:480px;}
				.top_pic {position:relative; width:740px; height:170px;}
				.top_pic a.ad img{ width:480px;}
	.indexarea{ top:250px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}	
	.centerarea{ top:170px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}

	.w_20{ display:block; width:48%; padding:0 2% 0 0;}
	.list li{}
		.list li.focus{ display:none;}
		.list li span.day{ display:block;}
	.Web_Form td.type{ display:none; }
		.Web_Form td.day{ display:none;}
		.Web_Form td.type_pic{ display:block;}
}

@media only screen and (min-width: 321px) and (max-width: 400px) {
	.header.index{ height:250px;}
	.header.main{ height:130px;}
		.headerall .pic.index{ top:75px; width:400px; height:250px;}
		.headerall .pic.main{ display:none; /* top:65px; width:400px; height:170px;*/}
		  .headerall .picall.index{ width:400px; height:280px;}
		  .headerall .picall.main{ display:none; /* width:400px; height:170px;*/}
				.show_pic {position:relative; width:400px; height:250px;}
				.show_pic a.ad img{ width:480px;}
				.top_pic { display:none; /*position:relative; width:400px; height:170px;*/}
				.top_pic a.ad img{ width:320px;}
	.indexarea{ top:250px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}
	.centerarea{ top:130px;/* border-top:2px solid #9e7b39;*/ padding:20px 0 0 0;}

	.list li{}
		.list li.focus{ display:none;}
		.list li span.day{ display:none;}
	.Web_Form td.type{ display:none;}
		.Web_Form td.day{ display:none;}
		.Web_Form td.type_pic{ display:none;}
}

@media only screen and (max-width: 320px) {
	.header.index{ height:240px;}
	.header.main{ height:130px;}
		.headerall .pic.index{ top:75px; width:320px; height:240px;}
		.headerall .pic.main{ display:none; /*top:75px; width:320px; height:200px;*/}
		  .headerall .picall.index{ width:320px; height:240px;}
		  .headerall .picall.main{ display:none;/* width:320px; height:200px;*/}
				.show_pic { position:relative; width:320px; height:240px;}
				.show_pic a.ad img{ width:450px;}
				.top_pic { display:none;/* position:relative; width:320px; height:200px;*/}
				.top_pic a.ad img{ width:320px;}
	.indexarea{ top:240px; border-top:2px solid #9e7b39; padding:20px 0 0 0;}
	.centerarea{ top:130px; /*border-top:2px solid #9e7b39;*/ padding:0 0 0 0;}

	.list li{}
		.list li.focus{ display:none;}
		.list li span.day{ display:none;}
	.Web_Form td.type{ display:none;}
		.Web_Form td.day{ display:none;}
		.Web_Form td.type_pic{ display:none;}
}
