@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;
}
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
}

html {
	min-height: 100%;
	_height:100%;
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
	_height:100%;
	height: 100%;
}
a{text-decoration:none;}
/*--reset_END--*/

/*--共用版型--*/
body{ font-family:"微軟正黑體";}
   
/*背景漸層色*/  
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #BDEAEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #FFFFFF 0%, #BDEAEF 100%);

/*背景漸層色*/ 
 
  }
#gotop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;    
    padding: 10px 15px;    
    font-size: 20px;
    background: #777;
    color: white;
    cursor: pointer;
}
html,body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}
#DIV_PARENT {
    position: relative;
    background:rgba(0,0,0,0);
	// 這個DIV是提供定位點的父區塊，一般設為 relative
    // 提供定位點的父區塊，因為只提供定位點，一般不設定寬度與高度
} 

.clear_b{
	clear:both;
}	

/* sec */

.bg { width:100%; position: relative; margin-top:84px; padding:0;}
.abouttit { width: 60%; margin:0px auto; padding:5px 0;}
.abouttit p { display: inline-block; color:black; }
.sectit { text-align: center; color:white; margin-bottom: 5px; text-shadow:4px 4px 5px rgba(0,0,0,1); letter-spacing: 2px; padding:20px 0; font-size: 25px; font-family: 華康粗圓體,華康細圓體,Microsoft JhengHei,Comic Sans MS,arial,helvetica,sans-serif,DFKai-sb,MingLiU; background: url(../img/connection_01.jpg) no-repeat top center; background-size: cover; }
.secbox { width: 100%; padding-bottom:5px; }
.conmap { width: 100%; }
#map { width: 100%; height: 450px; }
.con_tit { text-align: center; letter-spacing: 2px; font-size: 25px; margin:50px 0 30px; font-family: 華康粗圓體,華康細圓體,Microsoft JhengHei,Comic Sans MS,arial,helvetica,sans-serif,DFKai-sb,MingLiU; }
.con_d { font-size: 14px; text-align: center; letter-spacing: 2px; margin:10px 0px 60px; font-family: 華康粗圓體,華康細圓體,Microsoft JhengHei,Comic Sans MS,arial,helvetica,sans-serif,DFKai-sb,MingLiU; }
.tae_box { width: 88%; margin:0px auto 40px; text-align: center; }
.tae { width: 32.3333333%; text-align: center; display: inline-block; vertical-align: top;}
.tae_d { font-size: 16px; margin-top:10px; font-family: 'Calibri', 華康細圓體,'Microsoft JhengHei', sans-serif;}
.form_box { width: 80%; margin:0px auto; }
.form_input { width: 100%; height:20px; font-size: 14px; padding:5px 12px; margin-bottom: 15px; border-radius: 4px; border:1px solid #dfdfdf; font-family: 華康粗圓體,華康細圓體,Microsoft JhengHei,Comic Sans MS,arial,helvetica,sans-serif,DFKai-sb,MingLiU; border-style: inset; border-color: rgba(223,223,223,1); }
.form_input:focus { transition:border linear .2s,box-shadow linear .1s; -moz-transition:border linear .2s,-moz-box-shadow linear .1s; -webkit-transition:border linear .2s,-webkit-box-shadow linear .1s; outline:none;border-color:rgba(93,149,242,.75); box-shadow:0 0 7px rgba(93,149,242,.105); -moz-box-shadow:0 0 7px rgba(93,149,242,.5); -webkit-box-shadow:0 0 7px rgba(93,149,242,3); }
.form_textarea { resize: none; height: auto; width: 100%; padding:5px 12px; margin-bottom: 15px; font-size: 14px; color:rgba(0,0,0,0.8); border-radius: 4px; line-height: 1.4; font-family: 華康粗圓體,華康細圓體,Microsoft JhengHei,Comic Sans MS,arial,helvetica,sans-serif,DFKai-sb,MingLiU;  border-style: inset; border-color: rgba(223,223,223,1);}
.form_textarea:focus { transition:border linear .2s,box-shadow linear .1s; -moz-transition:border linear .2s,-moz-box-shadow linear .1s; -webkit-transition:border linear .2s,-webkit-box-shadow linear .1s; outline:none;border-color:rgba(93,149,242,.75); box-shadow:0 0 7px rgba(93,149,242,.105); -moz-box-shadow:0 0 7px rgba(93,149,242,.5); -webkit-box-shadow:0 0 7px rgba(93,149,242,3); }
.form_p { width: 100px; padding:5px 12px; border-radius: 4px; border:1px solid #dfdfdf; border-style: inset; border-color: rgba(223,223,223,1); }
.form_p:focus { transition:border linear .2s,box-shadow linear .1s; -moz-transition:border linear .2s,-moz-box-shadow linear .1s; -webkit-transition:border linear .2s,-webkit-box-shadow linear .1s; outline:none;border-color:rgba(93,149,242,.75); box-shadow:0 0 7px rgba(93,149,242,.105); -moz-box-shadow:0 0 7px rgba(93,149,242,.5); -webkit-box-shadow:0 0 7px rgba(93,149,242,3); }
.sub_box { width: 80%; margin:35px auto 30px; }
.sub { width: 100%; letter-spacing: 3px; border-radius: 8px; }
.sub:hover { opacity: 0.8; }
.bobg { width: 100%; height: 120px; background: url(../img/connection_01.jpg) no-repeat bottom center; background-size: cover; }









.gotop_ { position: fixed; bottom:2%; right:2%; cursor: pointer; background: white; border-radius: 100%;}



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

}
@media screen and (max-width: 1150px){
	.env_pic { width: 200px; height: 160px; margin:0px 12px; }
	.extimg { width: 17%; }
}
@media screen and (max-width: 1000px){
	.abouttit { width: 70%; }
	.seccon { width: 100%; }
	.sec_share,.sec_concent { width: 85%; }
	.env_pic { width: 180px; height: 140px; margin:0px 8px; }
}
@media screen and (max-width: 880px){
	.env_pic { width: 280px; height: 210px; margin:10px; }
	.extimg { width: 25%; }
}
@media screen and (max-width: 720px){
	.secbox { background-size: auto }
	.sec_line { margin-bottom: 10px; }
	.env_pic { width: 220px;4 height: 180px; margin:10px; }
	.extimg { width: 28%; }
	.tae_box { width: 100%; }
}
@media screen and (max-width: 550px){
	.env_pic { width: 175px; height: 135px; margin:10px; }
	.extimg { width: 35%; }
	.tae_box { width: 60%; }
	.tae { width: 100%; margin:15px 0; }
}
@media screen and (max-width: 480px){
	.abouttit { width: 90%; } 
	.env_pic { width: 240px; height: 190px; }
	.extimg { width: 53%; }
}