@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

html { height:100% }
body { background:#f7f7f7; margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll; overflow-x:hidden; }
body, td, th {font-size:12px;font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;color: #e8e6e6;}
.iframe_ch { display:none }
.w100{ width:100%; }
.middle{ vertical-align:middle; }

/*網站大標題*/
.common_title{ position:relative; font-size:24px; letter-spacing:1px; color:#000; font-weight:bold; padding:0 0; }
.common_title span{ display:block; font-size:14px; letter-spacing:1px; color:#7a7979; padding:0 0px; }
.common_title table td{ font-size:24px; letter-spacing:1px; color:#000; font-weight:bold; padding:0 0; }
.common_title table td span{display:block;font-size:14px;letter-spacing:2px;color:#7a7979;padding: 3px 0 5px 0;}
.commonLineArea{ position:relative; width:100%; height:30px; line-height:30px; }
.commonLineArea img{ position:absolute; top:15px; left:0; }
.commonLine{position:absolute; top:17px; left:0; border-top:5px solid #74ae30; width:100%; height:1px;}

.commonLineArea2{ position:relative; width:100%; height:30px; line-height:30px; }
.commonLineArea2 img{ position:absolute; top:15px; left:0; right:0; margin-left:auto; margin-right:auto; }
.commonLine2{position:absolute; top:17px; left:0; border-top:1px solid #13a0d1; width:100%; height:1px;}

/*按鈕*/
.moreBtnArea{ width:100%; overflow:hidden; text-align:right; padding:20px 0; }

.button1{ outline:0; border:1px solid #74ae30; color:#74ae30; display:inline-block; letter-spacing:1px; padding:8px 13px; cursor:pointer; cursor:hand; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
.button1:hover{ background:#74ae30; color:#fff; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }

.btn_fix{ position:absolute !important; right:0; top:15px; padding:8px 15px !important; color:#74AE30 !important; background:#FFF; transition: all 0.5s; }
.btn_fix span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
  color:#74ae30;
}
.btn_fix:hover span {
  padding-right: 15px;
  color:#fff;
}

.btn_fix span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
.btn_fix:hover span:after {
  opacity: 1;
  right: 0;
  color:#fff;
}


/*上方固定選單*/
.fix_menu{ position:fixed !important; width:100%; top:0; z-index:999; margin:0 auto; left:0; right:0; border-bottom:1px solid #ebebeb; }


/*分頁*/
.pager{ width:100%; margin:50px auto; text-align:center; color:#74ae30; }

/*編輯器*/
.editor{padding:20px 0; letter-spacing:1px; line-height:30px; font-size:14px;}

/*隱藏選單*/
.overlay{ position:absolute; display:none; width:100%; height:100%; z-index:9; top:0; left:0; background-color: rgba(0,0,0, 0.5); transition: 0.5s;}

/*網站地圖*/
#sitemap{max-width:1200px; color:#7a7a7a; padding:20px 0 20px 0; font-size:14px; letter-spacing:1px; text-align:left; margin:0 auto;}
#sitemap a{ color:#7a7a7a;  text-decoration:none; }
#sitemap a:hover{ color:#13a0d1; }

.container_wrap{ position:relative; }

/*內頁共用*/
#public_wrap{max-width: 1200px;width: 100%;overflow:hidden;min-height:500px;margin:0 auto 0 auto;padding: 0 20px 0px 20px;box-sizing: border-box;background:#FFF;}
#public_wrap .public_wrap_all{ width:100%; min-height:500px; display:inline-block; text-align:left; margin-bottom:50px; color:#3d3d3d; }

#public_wrap .public_wrap_left{ max-width:300px; width:30%; float:left; }
#public_wrap .public_wrap_right{ max-width:900px; width:70%; min-height:500px; display:inline-block; text-align:left;}
#public_wrap .public_content{ color:#432b43; font-size:15px; padding:15px 0; clear:both; letter-spacing:1px; line-height:30px;}

#leftMenu{ background:url(../../images/news-flower.png) top left no-repeat; max-width:270px; min-height:300px; }
.leftMenuTitle{ word-break: break-all; display:; width:100%; padding:22px 0; margin:0 0;  margin-top:-1px; background:#1a2b33; border:1px solid #e2e2e2; color:#bbdd93; text-align:center; font-size:20px; letter-spacing:1px; cursor:hand; cursor:pointer; 
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.leftMenuItem{ word-break: break-all; display:; width:100%; padding:22px 0; margin:0 0;  margin-top:-1px; background:url(../../images/menubg.jpg) repeat-y left; border:1px solid #e2e2e2; color:#fff; font-size:16px; letter-spacing:1px; cursor:hand; cursor:pointer; }
.leftMenuItem:hover{ background:url(../../images/menubg_on.jpg) repeat-y left; color:#FFF; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
.leftMenuItem:hover::before{ color:#fff;}
.leftMenuItem:before{ content:"　●"; color:#74ae30; vertical-align: -0%; padding:0 0px; }
.leftMenuItem span{ display:inline-block;padding: 0 15px 0 15px;margin-top: -20px;line-height: 20px; color:#1a2b33; }
.leftMenuItem:hover span{ color:#FFF; }

@media screen and (max-width : 1200px) {
	
	#public_wrap .public_wrap_left{ display:none; }	
	#public_wrap .public_wrap_right{ width:100%; }	
	
}

@media screen and (max-width : 480px) {
	#public_wrap{ padding:0 5px 0 5px }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Overlay <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.overlay1 { /*margin-top:80px;*/ height: 100%; width: 0%; position: fixed; overflow-x:hidden; overflow-y:hidden; top: 0; right: 0; background-color: rgba(130, 165, 61, 0.9); overflow:auto; transition: 0.5s; z-index: 4; z-index:999; }
.overlay1-content { position: relative; top: 0%; width: 100%; text-align: center; }
.overlay1 a { padding: 8px; text-decoration: none; font-size: 36px; color: #818181; display: block; transition: 0.3s; }
.overlay1 a:hover, .overlay1 a:focus { color: #f1f1f1; }
.overlay1-title { width:100%; height:50px; margin-top:50px; }
.overlay1-title span { color:#FFF; border-bottom:2px solid #FFF; font-size:20px; letter-spacing:1px; }
.overlay1_options { width:80%; margin:0 auto; }
.overlay1_item { position:relative; text-align:left; padding:15px 5px; color:#EAEAE8; letter-spacing:1px; border-bottom:1px solid #d2d2d2; font-size:15px; letter-spacing:1px; cursor:hand; cursor:pointer; }
.overlay1_item a { font-size:15px; color:#fff; font-weight:bold; }
.overlay1_item a:hover { color:#fff; }
.overlay1_item span { position:absolute; right:0; top:25px; padding:0 5px; font-size:25px; }
/*.overlay1_item:hover{ background:#000; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }*/
.overlay1_event { width:100%; display:none; background-color: rgba(73, 136, 0, 0.9); text-align:left; padding:20px; box-sizing:border-box; letter-spacing:1px; }
.overlay1_event a { display:block; font-size:15px; color:#fff; }
.overlay1_event a:hover { color:#fff; text-decoration:none; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

nav{ background:#1a2b33; width:100%; }
nav .nav_wrap{ position:relative; max-width:1200px; height:35px; margin:0 auto; }
nav .nav_wrap span{ position:absolute; right:0; top:8px; color:#8ca4af; }
nav .nav_wrap a{ color:#8ca4af; text-decoration:none; letter-spacing:1px; }

#wrapper{ max-width:1200px; overflow:hidden; min-height:1000px; margin:0 auto; }
#header{ position:relative; max-width:1200px;height:90px;margin:0 auto;background:#FFF; /*-moz-box-shadow: 3px 3px 5px 6px #ccc; -webkit-box-shadow: 3px 3px 5px 6px #ccc; box-shadow: 0px 0px 3px 3px #ebebeb;*/ }
#header .header_logo{ position:absolute; top:20px; left:20px; }
#header .header_title{ position:absolute; top:20px; left:100px; max-width:560px; width:100%; color:#158802; font-size:24px; font-weight:bold; letter-spacing:1px; text-shadow:1px 1px 1px #CCC }
#header .header_title span{ display:block; color:#362A24; font-size:14px; padding:10px 0; }

.header_menu{ position:relative; max-width:1200px; height:68px; margin:0 auto; background:#74ae30; box-shadow: 0 0px 2px rgba(0, 0, 0, 0.5), 0 0 40px rgba(0, 0, 0, 0.1) inset }
.header_menu ul{position:absolute;list-style:none;margin:0;padding:0;left: 50px; font-size:18px;letter-spacing:1px;letter-spacing:1px;color:#FFF;}
.header_menu ul li{float:left;padding: 17px 50px 0 50px; transition: background 0.5s; }
.header_menu ul li:hover{ background:url(../../images/menu_bg.png)  0px 60px repeat;  transition: background 0.5s; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
.header_menu ul li:hover a{ color:#6f981f;}
.menu_line:hover{ background:none !important; }

.header_menu ul li.menu_line{ margin: 0 !important;}
.header_menu ul li a{color:#FFF;display: inline-block;height: 51px;text-decoration:none;text-shadow:0px 0px 10px #999; text-align:center; /*font-weight:bold;*/ letter-spacing:1px; }
.header_menu ul li .menu_arrow{ display:none; margin:8px auto 0 auto; }
.header_menu ul li .menu_arrow_on{ display:block; margin:8px auto 0 auto;}
.header_menu ul li a span{ display:block; font-size:12px; padding:3px 0; }

.header_menu ul li:hover .submenu{ min-width:175px; opacity:1; display:block; transition: 0.5s; margin-top:0px; }
.submenu{ opacity:0; display:none; position:absolute; overflow:hidden; background:#FFFFFF; z-index:999; color:#020202; margin-left:-50px; margin-top:20px;
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.5), 0 0 40px rgba(0, 0, 0, 0.1) inset
}
.submenu1{ letter-spacing:2px; padding:15px 15px; font-size:15px; border-bottom:1px solid #158802; cursor:pointer; cursor:hand;}
.submenu1:hover{ background:#E9FBC8; transition: 0.5s; }
.submenu1 img{ padding:0 5px;}

#footer{ position:relative; width:100%;max-width: 1200px; margin:0 auto;box-sizing: border-box;overflow:hidden;background:url(../../images/footer-bg.jpg);background-size: 100% 100%;margin: 0 15px 0 0px;padding: 30px 25px 30px 25px;}
.footer_left{ float:left; width:50%; }
.footer_left span{ text-shadow: 2px 2px 3px #434a54; font-size:20px; letter-spacing:1px; color:#74ae30; padding:0 0 20px 0; display:inherit; }
.footer_left table td{ font-size:15px; letter-spacing:1px; padding:5px 0;}
.footer_right{ float:left; text-align: right; padding-top:70px; width: 50%; font-size:13px; line-height:20px; letter-spacing:1px; color:#8ca4af; }
.footer_right a{ color:#8ca4af; text-decoration:none; }
.footer_right a:hover{ text-decoration:underline; }


#goTop{ position:absolute; right:30px; padding:5px 15px; cursor:hand; cursor:pointer; text-align:center; }
#goTop:hover{ background-color: rgba(255,255,255, 0.3); transition: 0.5s; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; }

@media screen and (max-width : 1200px) {

	#mobileMenuPosition {
		 opacity:1;
		 width: 30px;
		 margin-right: 3%;
		 margin-top: 35px;
		 vertical-align: middle;
		 float: right;
		 -webkit-transition: all .4s ease;
		 -moz-transition: all .4s ease;
		 -o-transition: all .4s ease;
		 transition: all .4s ease;
		 -ms-transition: all .4s ease
	}
	.mobileMenuPosition_top {
		 margin-top: 8px
	}
	.mobileMenu {
		 width: 30px;
		 height: 25px;
		 position: absolute;
		 z-index: 999;
		 cursor: pointer
	}
	.mobileMenu span {
		 width: 30px;
		 height: 5px;
		 margin-top:5px;
		 display: block;
		 background:#000;
		 -webkit-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -moz-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -ms-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -o-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1)
	}
	
	
	.mobileMenu_spac {
	 	background: #fff !important
	}
	.mobileMenu span:first-child {
		margin-top: 0
	}
	.mobileMenu .top {
		 position: absolute;
		 top: 10px;
		 -webkit-transform: rotate(225deg);
		 -moz-transform: rotate(225deg);
		 transform: rotate(225deg)
	}
	.mobileMenu .bottom {
		 position: absolute;
		 top: 10px;
		 margin-top: 0 !important;
		 -webkit-transform: rotate(-225deg);
		 -moz-transform: rotate(-225deg);
		 transform: rotate(-225deg)
	}
	.mobileMenu .middle {
	 	opacity: 0
	}
	.menu-active .navigation {
	 	right: 0
	}
	.menu-active .navigation ul li {
		 -moz-transform: translateX(0);
		 -webkit-transform: translateX(0);
		 opacity: 1;
		 transform: translateX(0)
	}
	
	#menu{ display:none; }
	
	#header .header_home{ display:none; }
	
}


@media screen and (max-width : 768px) {
	.header_title{ display:none; }
	.footer_left{ width:100%; }
	.footer_right{ width:100%; float:left; padding-top:20px; text-align:left; }
	#goTop{ background-color: rgba(255,255,255, 0.3); transition: 0.5s; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#index_news{max-width: 1200px;/* margin: 0 auto; */width:100%;overflow:hidden;margin:0px auto 0 auto; padding:50px 15px; background:#fff;}
.index_news_left{ max-width:780px; width:65%; float:left; animation: 1s ease-out 0s 1 transiLeft; }
.index_news {width:100%;margin:0 0 30px 0;box-shadow: 4px 4px 5px 1px rgba(20%,20%,50%,0.2); background:url(../../images/news-bg.png); background-size:cover;}
.index_news_contain { max-width:1000px; overflow:hidden; margin:0 auto; padding:0 10px 20px 10px; color:#345884; letter-spacing:1px; box-sizing:border-box; }
.index_news_list{ width:100%; overflow:hidden; max-width:1000px; box-sizing:border-box; padding:0 20px; border-bottom:1px dashed #A09AA4; }
.index_news_list:hover{ /*background:#e1f5ff; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s;*/ }
.index_news_list div{ float:left; padding:8px 0; color:#9b968f; margin:10px 20px 5px 0; font-size:13px; letter-spacing:1px; }
.index_news_type{ display:inline-block; font-size:14px; padding:5px 8px !important; color:#FFF !important; }
.index_news_type span{ color:#264601; background:#c6e0a8; padding:5px 10px 8px 10px; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; }
.index_news_date{ font-size:13px; color:#345884; }
.index_news_title{ width:60%; line-height:20px; }
.index_news_title a{ font-size:16px !important; line-height:16px; color:#1a2b33; text-decoration:none; }
.index_news_title a:hover{ color:#498800; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s;  }

.index_news_right{ width:32%; display:inline-block; float:right; text-align:left; padding: 0 30px 20px 15px; box-sizing:border-box;animation: 1s ease-out 0s 1 transiRight;}

.opentime_frame{ position:relative; border:1px solid #d4d4d4;}
.opentime_frame .img{ width:100%; }
.magnifier{ position:absolute; bottom:8px; right:8px;}
.opentime_title{ background:#42606c; color:#FFF; padding:8px 10px; display:block; margin:20px 0 0 0; letter-spacing:1px; font-size:14px; text-align:center; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; }

/*
#index_album{ max-width: 1145px;width:100%;overflow:hidden;margin: 0 15px 0 15px; padding: 0 15px 30px 12px; background:#FFF; }
.index_album_wrap{  padding-left:40px; }
.index_album_items{ float:left; width:30%; margin:2% 2% 2% 0; border:2px solid #13a0d1; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; }
.album_radius{ -webkit-border-top-left-radius: 15px;
-webkit-border-top-right-radius: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 15px;
border-top-left-radius: 15px;
border-top-right-radius: 15px; }

.index_album_box{ width:100%; min-height:50px; overflow:hidden; padding:10px 10px; box-sizing:border-box; }
.index_album_boxLeft{ float:left; width:30%; max-width:80px; background:#13a0d1; color:#fff; text-align:center; padding:15px 5px; font-size:14px; letter-spacing:1px; }
.index_album_boxLeft span{ font-size:24px; }
.index_album_boxRight{ float:left; width: 64%;font-size:16px;line-height:20px;border-bottom:1px dashed #999999;letter-spacing:1px;color:#393939;padding: 0 0px 0 10px;margin:0 10px;box-sizing:border-box; }
.index_album_amout{ float:right; letter-spacing:1px; padding:5px 10px 10px 10px; color:#626262; }
*/

@media screen and (max-width : 1200px) {
	.index_news_left{  width:58%; }	
	.index_news_right{ width:40% }
	.index_news_list div{ margin:10px 0px 5px 0; }
	
	.index_album_boxLeft{ display:none; }
	.index_album_boxRight{ width:95%; }
	.index_album_wrap{ padding:20px; }	
}
@media screen and (max-width : 768px) {
	.index_news_left{ float:none; width:95%; }	
	.index_news_right{ float:none; width:95%; max-width:none; }
	
	.index_album_wrap{ padding:0; }
	
	.index_album_items{ width:90%;}
	
	
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* -------------------------------->>> Dwonload <<<--------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.course_container{ text-align:center; width:100%; overflow:hidden; }
.course-detail{ box-sizing:border-box; }
.course-detail-title{ font-size:18px; color:#484848; letter-spacing:1px; font-weight:bold; margin-bottom:50px; line-height:22px; }
.course-detail-item{ background:#f2f2f2; color:#0078ff; font-weight:bold; letter-spacing:1px; font-size:15px; padding:5px 10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }
.course-detail-content{ color:#484848; font-size:15px; letter-spacing:1px; line-height:25px; padding:20px 5px;}

.forum-title{width:100%; overflow:hidden; padding:5px 0; color:#0078ff; background:#f2f2f2; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.forum-title-items{ float:left; text-align:center; font-size:15px; letter-spacing:1px; }
.forum-content{width:100%; overflow:hidden; padding:5px 0; color:#0078ff; border-bottom:1px solid #ebebeb; }
.forum-content:hover{ background:#e1f5ff; }
.forum-content-items{ float:left; text-align:leftf; padding:10px 0; color:#535454; font-size:15px; letter-spacing:1px; line-height:22px; width:100%; }
.forum-content-items a{ color:#535454; text-decoration:none; }
.forum-content-items a:hover{ color:#0078ff; text-decoration:underline; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> News <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.news_list{ width:100%; overflow:hidden; max-width:1000px; box-sizing:border-box; border-bottom:1px dashed #A09AA4; }
.news_list div{ float:left; padding:8px 0; color:#1a2b33; margin:0 20px 0 0; font-size:13px; letter-spacing:1px; }
.news_type{ display:inline-block; font-size:14px; padding:5px 8px !important; color:#FFF !important; }
.news_type span{ color:#264601; background:#c6e0a8; padding:5px 10px 8px 10px; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; }
.news_date{ font-size:13px; color:#1a2b33; }

#news_list{ width:100%; padding: 5px 0 5px 0; overflow:hidden; border-bottom:1px dashed #b2b2b2; }
.news_list_type span{ border:1px solid #50839a; padding:3px 5px; -webkit-border-radius:7px; -moz-border-radius:7px; border-radius:7px; }
.news_list_file{ float:left; width:100%; padding:0 10px 0 10px; line-height:32px; letter-spacing:1px; }
.news_list_file a{ color:#006c9e; text-decoration:none; font-size:15px; letter-spacing:1px; }
.news_bg{ background:#fff; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Login <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.login-frame{ position:relative; max-width:460px; overflow:hidden; min-height:390px; text-align:center; background:#f5f5f5; margin:80px auto 0 auto; -webkit-border-radius:10px; -moz-border-radius: 10px; border-radius:10px; }
.login-title{ color:#000000; font-size:24px; letter-spacing:1px; font-weight:bold; text-align:center; padding:20px 0 0 0; }
.login-title span{ display:block; font-size:14px; color:#7a7979; letter-spacing:1px; padding:10px 0 0 0; }
.input_area{ position:relative; width:70%; padding:0 0 25px 0; display:inline-block; }
.input_area img{ position:absolute; top:8px; left:8px;}
.input1{max-width:380px;width:100%;height:40px;background:#FFF;border:1px solid #d3d3d3; color:#666; font-size:15px; letter-spacing:1px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;padding: 0 10px 0 40px;box-sizing: border-box;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> About <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.member_list{ width:100%; overflow:hidden; margin:0 0 50px 0; }
.member_list_left{ width:30%; float:left; }
.member_list_left img{ max-width:170px; width:100%; margin-right:5%; border:2px solid #eaeaea; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }
.member_list_center{ width:40%; float:left; }
.member_list_right{ width:30%; float:left; padding:0 10px; box-sizing:border-box; }

.member{width:100%; overflow:hidden; margin:0 auto; line-height:40px; color:#2D2D2D; font-size:15px; letter-spacing:1px;}
.member_info_area{ width:100%; overflow:hidden; line-height:25px; padding: 5px 0 5px 0; border-bottom:1px dashed #a7a7a4;}
.member_info_title{ float:left; width:30%; color:#2d5c98; }
.member_info_content{ float:left; width:70%; }


@media screen and (max-width : 768px) {
	.member_list_center{ width:60%; float:right }
	.member_list_right{ float:none; width:100%; }
	
}

@media screen and (max-width : 480px) {
	.member_list_left{ float:none; text-align:center; margin:0 auto; width:60%; }
	.member_list_center{ width:100%; float:left }
	.member_list_right{ float:none; width:100%; }	
	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Album <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.album_container
{
    text-align:center;
    width:100%;
  	overflow:hidden;
}
.album_square
{
    margin:10px 5px;
	padding:2px;
    text-align:center;
    display:inline-block;    
}
.album_square img{ display:block; border:1px solid #EDD6E0; padding:2px; }
.album_square a{ line-height:30px; margin:5px 0; color:#666; letter-spacing:1px; text-decoration:none; }




/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Contact <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#contact_info{ position:relative; max-width:1200px; overflow:hidden; }
#contact_info .contact_info_left{ float:left; width:52%;  margin:20px 0 30px 0;  }
#contact_info .contact_info_right{ float:left; max-width:400px; width:48%; font-size:15px; margin:20px 0 0 30px; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#contact_info .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0; }
.contact_info_btitle{ width:100%; border-bottom:1px solid #6d6b64; }
.contact_info_area{ width:100%; overflow:hidden; line-height:25px; padding:10px 0; border-bottom:1px dashed #a7a7a4; }
.contact_info_title{ float:left; width:20%; color:#45760c; background:#c6e0a8; text-align:center; margin:0 5% 0 0; padding:0 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }
.contact_info_content{ float:left; width:70%; }

.contact{width:100%; overflow:hidden; margin:20px auto; line-height:40px; color:#2D2D2D; font-size:15px; letter-spacing:1px;}
.contact .item{color:#333; font-size:18px;  font-weight:bold; border-bottom:1px solid #DEDEDE;}
.contact .title{display:inline-block; padding:20px 0; font-size:40px; font-weight:bold;}
.contact .editor{padding:20px 0; letter-spacing:1px; line-height:30px; font-size:14px;}
.contact .form{float:right; width:100%; box-sizing: border-box; padding:2%; background:#f5f5f5; }
.contact .form_left{float:left; width:50%; color:#8B8B8B; letter-spacing:1px;}
.contact .form_right{float:left; width:50%; color:#8B8B8B;}
.contact .select{width:90%; height:30px; border:1px solid #D8D4D5; color:#A9AAAE; font-size:15px; letter-spacing:2px; outline:0;}
.contact .input{border:0; border-bottom:1px solid #D8D4D5; width:90%; height:40px; font-size:15px; letter-spacing:2px; outline:0; margin:20px 0; padding:0 10px; box-sizing:border-box; }
.contact .textarea{ width:98%; margin-top:10px; height:250px; border:0; border-top:1px solid #D8D4D5; font-size:15px; border-bottom:1px solid #D8D4D5; padding:5px; outline:0;}


@media screen and (max-width : 1024px) {
	#contact_info .slogan { position:inherit; float:left;}
	 #contact_info .contact_info_left{ width:90%; }
	 #contact_info .about_media_right{ width:100%;  margin:5px 0 0 0; }	
	
}

@media screen and (max-width: 900px) {
	.contact span{display:inline-block; width:auto;}
	.contact .notify{ float:none; width:100%; padding:20px 0; }	
	.contact .form{ width:100%; }	
}

@media screen and (max-width: 750px) {
	.contact .form_left{float:none; width:100%;}
	.contact .form_right{ width:100%;}
	
	#contact_info .contact_info_left{ width:95%; }
	#contact_info .contact_info_right{ width:90%; max-width:none; }		
}

@media screen and (max-width : 480px) {
	 #contact_info .slogan{ width:100%; background:none; padding:0; }
	 #contact_info .contact_info_left{ width:100%; }
	 #contact_info .about_media_right{ width:100%;  margin:5px 0 0 0; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Team <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.team_frame{ float:left; width:47%; min-height:400px; background:#f7f7f7; margin:20px 0 20px 3%; border:1px solid #ebebeb; box-sizing:border-box; padding:15px; -webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px; }
.team_frame_left{ float:left; width:50%; }
.team_frame_left img{ border:1px solid #ebebeb; width:95%; display:block; }
.team_frame_right{  float:left; width:50%; }
.text_frame{ background:url(../../images/team-bg.png) no-repeat; max-width:176px; min-height:112px; font-size:16px; margin-top:10%; text-align:center; padding-top:20px; color:#fdff3f; }
.text_frame span{ color:#ffffff; font-weight:bold; letter-spacing:1px; font-size:22px; margin:5px 0; display:block; }

.member_info_area{ width:100%; overflow:hidden; line-height:25px; min-height:30px; padding:10px 0; border-bottom:1px dashed #a7a7a4; }


.gallery{ position:relative; cursor:default; overflow:hidden; width:170px; height:170px; }
.gallery_mask{ opacity: 0; position:absolute; left:0; top:0; background:#CCC; cursor:default; width:95%; height:100%; background-color: rgba(70,84,91, 0.7); color:#fff; z-index:2; display:flex; align-items:center; justify-content: center; cursor:hand; cursor:pointer; }
.gallery:hover .gallery_mask{ opacity: 1; color:#fff; margin:0 auto; width:95%;  -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; cursor:pointer; cursor:hand; }
.gallery_mask_contain{ margin:0 10%; letter-spacing:1px; line-height:20px; text-align:center;  cursor:pointer; }
.gallery_mask_contain span{ font-size:0.75vw; color:#fff; display:inline-block; padding:5px 10px; /*border:1px solid #FFF;*/ margin-bottom:20px; line-height:1vw;  cursor:pointer; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }
.gallery_mask_contain2{ margin:0 10%; letter-spacing:1px; line-height:20px; text-align:center; cursor:pointer; }
.gallery_mask_contain2 span{font-size:0.75vw;color:#fff;display:inline-block;padding:5px 10px;border:1px solid #FFF;margin-bottom:20px;line-height:18px;cursor:default;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 40px; cursor:pointer;}

@media screen and (max-width : 768px) {

	.team_frame{ width:95%; }	
	
}

@media screen and (max-width : 480px) {
	.text_frame{ background:none; min-height:inherit; color:#45760C; }
	.team_frame{ min-height:400px; }
	.text_frame span{ color:#000; }
	.contact_info_title{ float:none; width:50%}
	.contact_info_content{ width:95%; }
	.team_frame_right{ float:none;}

}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Bxslider <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

ul.bxslider { margin:0; padding:0; }
#home_banner { 
  /*  display: inline-block;  會多一個空白*/
   max-width: 1200px; width:100%; height: auto; margin:0 auto; overflow: hidden; position: relative; }
#home_banner li { width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;   /*height: 1000px;*/
	-webkit-transition:transform .5s ease;
 -moz-transition:transform .5s ease;
 -o-transition:transform .5s ease;
 -ms-transition:transform .5s ease;
 transition:transform .5s ease;
}
#home_banner img { display: block; }
#home_banner .bxslider { opacity: 0; }
#home_banner .bx-wrapper .bx-pager.bx-default-pager a:hover, #home_banner .bx-wrapper .bx-pager.bx-default-pager a.active { background: #5c8c00; border:2px solid transparent; }
#home_banner .bx-wrapper .bx-pager.bx-default-pager a { background-color: #fff; border:2px solid white; width: 10px; height: 10px; margin: 0 8px; border-radius: 50%;  -webkit-transition: all .5s ease;
 -moz-transition: all .5s ease;
 -o-transition: all .5s ease;
 -ms-transition: all .5s ease;
 transition: all .5s ease;
 -moz-box-shadow:    3px 3px 5px 0px #333;
 -webkit-box-shadow: 3px 3px 5px 0px #333;
 box-shadow:         3px 3px 5px 0px #333; 
}
#home_banner .bx-wrapper .bx-pager { bottom: 22px; opacity: 0; }
#home_banner .word { cursor:hand; cursor:pointer; font-size: 20px; text-align:center; position: absolute; left: 15%; right: 15%; top: 23%; color: #fff; letter-spacing: 2px; line-height:25px; opacity: 0.2; }
#home_banner .word span{ font-size: 36px; line-height:45px; margin-bottom:20px; display:inline-block; }
#home_banner .word b { font-weight: bold; }
#home_banner .down { position: absolute; right: 30px; bottom: 32px; width: 34px; height: 28px; z-index: 99; cursor: pointer; opacity: 0; }
#home_banner .down img { display: block; }

#container{ max-width:1200px; margin:0 auto 0 auto; }

@media screen and (max-width : 1024px) {
 #home_banner .bx-wrapper .bx-pager.bx-default-pager a {
 width: 15px;
 height: 15px;
}
#home_banner .down {
 display: none;
}
 #home_banner, #home_banner li {
	/*max-height: 575px;*/
	/*height: 575px;*/ 
	 /*margin-top: 75px;*/
	 
}
}
 @media screen and (max-width : 720px)
 {
	 #home_banner, #home_banner li {
	 max-height: 350px;
	 height: 350px;
	}
	 #home_banner img {
	 display: none;
	}
	 #home_banner .word {

	}

	#home_banner .word { font-size: 18px; }
	#home_banner .word span{ font-size: 24px; line-height:28px; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { position:relative; height: 100%; width: 0%; position: fixed; overflow:auto; top: 0; left: 0; overflow:auto;  background-image:url(../../images/action_bg.png); z-index:100000000 }
.Loadaction { width: 220px; height: 55px; top: 42%;  position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; background-image:url(../../images/action_bg.png); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
.Actionupload_Text { font-size:13px; color:#FFFFFF; height:20px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.cssa { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:10px; padding-left:10px; color:#000; }
.cssb { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:5px; padding-left:5px }
.cssc { padding-bottom:3px; letter-spacing:1px; font-size:12px; padding-left:10px; padding-right:10px; height:40px }
.cssd { font-family:Verdana; font-size:12px; letter-spacing:2px; height:10px; border:1px solid #FFFFFF }
a.pagelink_no:link { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink_no:visited { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:active { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:hover { color: #003399; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:link { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink:visited { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:active { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:hover { color: #333333; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_ch:link { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:visited { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:active { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:hover { color: #cc3300; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Member <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#member_area{width:100%; overflow:hidden;}
#member_area .member_declare{ font-size:13px; color:#333333; border-bottom:1px dotted #CCCCCC; letter-spacing:1px; padding:0 0 10px 0; margin:0 0 10px 0; }
#member_area .member_declare span{ font-size:14px;}
#member_area .member_left{ width:25%; float:left; }
#member_area .member_left img{ max-width:170px; }
#member_area .member_right{ width:75%; float:left; }
#member_area .member_title{ width:100%; padding:5px; background:#78B800; color:#fff; letter-spacing:1px; text-align:center; font-size:12px; }
#member_area .member_content{ padding:15px 0; font-size:12px; letter-spacing:1px; color:#595959; line-height:25px; }
#member_area .member_content .title{ color:#78B800; }



@media screen and (max-width: 1200px) {
	
	#member_area .member_left{ width:30%; }
	#member_area .member_right{ width:70%; }	
		
}



@media screen and (max-width: 750px) {
	
	#member_area .member_left{ float:none; margin-bottom:20px; text-align:left; }
	#member_area .member_right{ width:100%; }
	

}



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

	#member_area .member_left{ width:70%; text-align:center; }	
	#member_area .member_left img{ max-width:200px; }
	
}