/* CSS Document 
CSS Hack
background:red \9;   IE8網頁背景變紅色
*background:green;   IE7網頁背景變綠色
_background:blue;    IE6網頁背景變藍色
*/
/* 網頁預設文字顏色，一定要是黑色，不要修改，其他要使用顏色另外自訂 */
html {
		overflow-x: hidden;/*禁止x捲軸*/
	}
/*body,td,th {
	color: #000;
	font-size: 15px; //為了fullcalendar_mini，字級不要超過13px
	line-height: 1.6;
	font-family: "微軟正黑體", "Open Sans", sans-serif,Verdana, Geneva, sans-serif,"新細明體";
}*/

body {
	color: #000;
	font-family: "微軟正黑體", "Open Sans", sans-serif,Verdana, Geneva, sans-serif,"新細明體";
	margin: 0;
    font-size: 1rem; 
    line-height: 2;
    font-weight: 300;
	/* 文字左右對齊 */ 
	text-align:justify;
	text-justify:inter-ideograph;
	background-color: #ffc800;
}

/*li {list-style-type:none;} /*去除li黑點*/

p, td, li, label {
    font-size: 1.07rem; 
    line-height: 2;
    font-weight: 300;
}

div {
    word-wrap: break-word;
	/*word-break: break-all;不要使用，輔大電機經驗，會讓英文單字無法強制換行*/
}

/*反白文字、背景顏色*/
::-webkit-selection {
    background: #9bcdd7; /*9bcdd7、16aafe、ffa2c6*/
	color: #fff;
}
::-moz-selection {
	background: #9bcdd7;
	color: #fff;
}
::selection {
	background: #9bcdd7;
	color: #fff;
}
/*反白文字、背景顏色*/

/* 預設網頁超連結顏色設定 */
a:link,a:active,.input,#submit { 
    text-decoration: none; 
	color : #333333;
	font-family: "微軟正黑體",Verdana, Geneva, sans-serif,"新細明體";
	/*移除超連結外框線*/
	/*outline: none; /* Firefox,Chrome 
	hlbr: expression(this.onFocus=this.blur()); /* IE */
}

a:hover { 
	text-decoration: underline; 
	font-family: "微軟正黑體",Verdana, Geneva, sans-serif,"新細明體";
	/*color : #FFED00; */
	/*移除超連結外框線*/
	/*outline: none; /* Firefox,Chrome 
	hlbr: expression(this.onFocus=this.blur()); /* IE */
}

a:visited {
    text-decoration: none; 
	color : #333333;
	font-family: "微軟正黑體",Verdana, Geneva, sans-serif,"新細明體";
}

/* ****************無障礙，超連結外框線**************** */
/*
a:focus {
	outline:2px dotted #f00;
	hlbr: expression(this.onFocus=this.blur()); 
}
textarea:focus { background-color: yellow; }
input:focus { background-color: yellow;border: 2px dotted rgb(255, 80, 44);}
*/
/* 也可以限制類型 input[type="text"]:focus { background-color: yellow; }*/
/* ****************無障礙，超連結外框線**************** */

.w_white {color : #FFF;}
.w_white a:link {color:#fff;}
.w_white a:visited {color:#fff;}
.w_white a:hover {color: #FFDA00;}  

.w_yellow {color: #FFDA00; text-decoration: none;}
.w_yellow a:link {color: #FFDA00; text-decoration: none;}
.w_yellow a:visited {color: #FFDA00; text-decoration: none;}
.w_yellow a:hover {color: #FFDA00; text-decoration: underline;}  

.w_black {color : #000;}
.w_black a:link {color:#000;}
.w_black a:visited {color:#000;}
.w_black a:hover {color: #FFDA00;}  

.td_height_5 {height:5px; clear:both;}
.td_height_8 {height:8px; clear:both;}
.td_height_10 {height:10px; clear:both;}
.td_height_20 {height:20px; clear:both;}

.w_15 {
	font-size:0.938rem;
	}
.w_20 {
	font-size:1.250rem;
	}
.w_red {
	color:#f00;
	}
.w_black {
	color:#000;
	}
.w_pink {
	color:#ef5f96;
	}
.w_pink a:link {color:#ef5f96;}
.w_pink a:visited {color:#ef5f96;}
.w_pink a:hover {color: #ef5f96;}  
.w_bold {
	font-weight:bold;	
	}

.fb_tips {
	clear:both;
	background-color:#EFEFEF;
	padding:1px 8px;
	border-radius:10px;
	font-size:0.938rem;
	margin-bottom:5px;
	}
.fb_tips2 {
	clear:both;
	background-color:#f00;
	color:#fff;
	padding:1px 8px;
	border-radius:10px;
	font-size:0.938rem;
	}

.w_bt {
	width: 160px;
	background-color: #ef5f96;
	color: #fff;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-align: center;
	padding: 5px 8px 5px 20px ;
	letter-spacing: 5px;
	font-size:1.125rem;
	}
	
.w_bt a:link {color: #fff;}
.w_bt a:visited {color: #fff;}
.w_bt a:hover {color: #fff;} 

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video-container iframe,  .video-container object,  .video-container embed,  .video-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
	
.inputstyle {
	border: 0px;
	background-color: #f5f5f5;
	width: 235px;
	height: 32px;
	padding-left: 38px;
	padding-right: 5px;
	background-image: url(images/bt_search.gif);
	background-position: 15px 8px;
	background-repeat: no-repeat;
	color:#7c7c7c;
	font-size:0.75rem;
	/*
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	*/
}

.inputstyle_search {
	width:120px;
	height:25px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; 
	padding-left:5px; 
	border:1px solid #ccc;
	}
.inputstyle_search_bt {
	height:25px;
	line-height:15px;
	}

/*----data.php內容區的影片、地圖、圖片集---------------------*/
#main_main_title1 {
	border-bottom: 1px solid #ccc;
	}
#main_main_content {
	background-color: #fff;
	width: 95%;
	margin: 30px auto 0 auto;
	clear: both;
	line-height: 185%;
    letter-spacing: 0;
	padding-top:10px;
	padding-left:10px;
	padding-bottom:30px;
	text-align: justify;
	border-radius:20px;
}
#main_main_content_pic1 {
	background-color: #ffd801; /*ffd801、0598dd*/
	color:#000;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	width:150px;
	}
#main_main_content_pic2 {
	padding: 5px 0px 5px 5px;
	border: 2px solid #ffd801; /*ffd801、0598dd*/
	height:auto;
	overflow:hidden;
	}
.pic_border1 {
	padding: 3px;
	border: 1px solid #CCC;	
	}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.video-container iframe,  .video-container object,  .video-container embed,  .video-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/*----data.php內容區的影片、地圖、圖片集---------------------*/
	
	
/*----各版專用，不需要可刪除------------------------------------------------------------------------------------*/
#header {
	
}

#main {

}

#main_1 {

}

#main_2 {
	background-color: #ffc800;
}


#footer {
	
}

/*製作正方形div*/
.square {
  position: relative;
  width: 100%;
  background-color: #2c3e50;
  border-radius:5px;
  overflow: hidden;
}

.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.square .content {
  position: absolute;
  width: 100%;
  height: 100%;
  color:#fff;
  /* 加入水平垂直置中 */
  display: flex;
  justify-content: center; /* 水平置中 */   
  /*align-content: center;   /* 垂直置中(橫式手機會變成置上) */
  align-items: center;   /* 垂直置中(手機真正置中，但文字多會被擋住) */ 
  flex-wrap: wrap;
  /* 加入水平垂直置中 */
}
/*製作正方形div*/

.mbgpic {background-color: #fff; background-repeat: no-repeat; background-size: contain; background-position: center;}

.tab_line { border-left:#2c3e50 1px solid; padding: 3px;}
.tab_line2 { border:#ccc 1px solid; padding: 3px;}

.w_title1 {font-weight: 500;}
.w_title2 {font-weight: 500;}
.w_title3 {font-weight: 500;}

.bgcolor1 {background-color: #F8D86A;}
.bgcolor2 {background-color: #FFA200;}

.t_padding { padding: 10px 20px;}
/*----各版專用，不需要可刪除------------------------------------------------------------------------------------*/