body{
	margin: 0;
    padding:0;
	font-family:"微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	background-image:url(../image/bg.png);
}

html,div {
     margin: 0;
     padding:0;
 }
 
.wrapper {
	width:960px;
    max-width:76%;
    overflow:hidden;
	border:1px solid #dddddd;
	margin:40px auto 20px auto;
	color:#666;
	background:#FFF;
    position:relative;
}
.wrapper .header{
	border-top:5px solid #3FA2C3;	
}
.wrapper .header h1{
	height:1.75rem;
	font:28px/1em "微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	font-weight:bolder;
	text-align:center;
	padding-top:1em;
	margin: 10px 0;
}

.wrapper .header h2{
	height:1rem;
	font:16px/0em "微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	text-align:center;
	margin: 10px 0;
	padding-top:0.2em;
}

#social {
	position: relative;
	right: 0.65em;
	bottom: 1.7em;
	}
#social a {
	float: right;
	margin-left: 8px;
	opacity: 0.3;
	}
.wrapper .navigation{
	width:97.8%;
	margin-left:1.1%;
}
a.label:hover,a.label:focus,a.badge:hover,a.badge:focus {text-decoration:none;}

a {
color:#fff;
text-decoration:none;
}

.no-white-link {
color:blue;
text-decoration:none;
}

.portfolio-nav {
	float: left;
	margin: 20px 0 8px 0;
	}

ul.unstyled,ol.unstyled,ul.inline,ol.inline,.media-list {
list-style:none;
}

.dl-horizontal dt {
float:left;
width:160px;
overflow:hidden;
clear:left;
text-align:right;
text-overflow:ellipsis;
white-space:nowrap;
}

.form-horizontal .control-label {
float:left;
width:160px;
padding-top:5px;
text-align:right;
}

.dropdown-menu {
position:relative;
top:100%;
left:0;
z-index:1000;
display:none;
float:left;
min-width:160px;
list-style:none;
background-color:#fff;
border:1px solid rgba(0,0,0,0.2);
border-right-width:2px;
border-bottom-width:2px;
-webkit-border-radius:6px;
-moz-border-radius:6px;
border-radius:6px;
-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);
-moz-box-shadow:0 5px 10px rgba(0,0,0,0.2);
box-shadow:0 5px 10px rgba(0,0,0,0.2);
-webkit-background-clip:padding-box;
-moz-background-clip:padding;
background-clip:padding-box;
margin:2px 0 0;
padding:5px 0;
}

#featured {
	max-width:100%;
	padding:0.625em 0em 1.25em 0em;
	position:relative;
	border-bottom: 0.1em solid #ddd;
	margin-left:1.1%;
	margin-right:1.1%;
	}
.elastislide-list {list-style-type: none;}
.elastislide-carousel ul {list-style-type: none;}
.slides,.flex-control-nav,.flex-direction-nav {list-style: none;}
.slide>a>img{
	height:350px;
	width:100%;
	font-size:14px;
	line-height:20px;
	display:block;
}

.slide-no-title div{
	position:absolute;
	bottom:0rem;
	padding:0.55555em 0em;
	width:100%;
	background-color:rgba(0,0,0,.3);
}
.flexslider .title{
	text-indent:0.55555em;
	color:#FFF;
	font:18px/1.25em "微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	font-weight:bold;
	display:block;
	}
.flexslider .title a:hover{text-decoration:underline;}

.flexslider .desc{
	color:#FFF;
	font:14px/1.25em "微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	text-indent:0.7143em;
	}

.page-header1{
	font-size:1.2em;
	max-width:100%;
	background: #f9f9f9;
	padding-bottom: 9px;
	border-bottom: 1px solid #eee;
	margin-left: 1.1%;
	margin-right: 1.1%;
	position:relative;
	margin-top:10px;
	}

.page-header1 h3{
	font-size:1.2rem;
	margin: 0;
	line-height: 1.5em;
	}
.related_content{
	line-height:1.1em;
	font-family:微軟正黑體,STHeiti,Verdana,Geneva,sans-serif;
	}

.control-box {
	position: relative;
	text-align: right;
	top: -2.68em;
	left:-0.65em;
}

.carousel-control{
        background: #666;
        display: inline-block;
        font-size: 2.1em;
        opacity: 0.5;
        padding: 4px 10px 0px;
        height: 30px;
        width: 15px;
}

.carousel-control a{color:#fff;}

.carousel-control:hover,.carousel-control:focus {
color:#fff;
text-decoration:none;
opacity:.9;
filter:alpha(opacity=90);
}

.carousel-inner{
	font-size:0.875em;
	line-height:1.25em;
	font-family:微軟正黑體,STHeiti,Verdana,Geneva,sans-serif;
	position:relative;
	box-shadow:0 1px 0px rgba(0, 0, 0, 0.1);
	margin-left:1%;
	margin-right:0.91%;
	padding-bottom:7.3%;
	overflow:hidden;
}

.media_block{
	margin-bottom:10px;
}

.media_block h4{
	padding: 7px 0;
	margin: 15px 0;
	padding-left: 2px;
	border-bottom: 1px dotted #cccccc;
	font-size: 1.2em;
	min-height: 25px;
	text-align: center;
}
.media_block .caption h4 a{color:#444; text-decoration:none;}
.media_block .caption h4 a:hover{color:#3FA2C3;}

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,.open>.dropdown-menu,.dropdown-submenu:hover>.dropdown-menu,.tab-content>.active,.pill-content>.active,.media-object,.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev,.show {
display:block;
}

.thumbnail{
	margin-left:0;
	padding:4px;
	line-height:20px;
	border:1px solid #ddd;
	border-radius:4px;
	box-shadow:0 1px 3px rgba(0,0,0,0.055);
}
.thumbnails{
	list-style:none;
	text-align:center;
}

.thumbnails>li{
	margin-left:1.4286em;	
}

.thumbnails [class*="span"]:first-child{
	margin-left:0;	
}
.thumbnails .span{
	width:23%;
	display:inline-block;
	vertical-align:top;
}
.thumbnail img{
	width:100%;
	height:140px;
	vertical-align: middle;
}
li{
	line-height:1.5em;
}
.caption p {
    font-size: 1.2rem;
    color: #999;
	text-align: justify;
	margin-bottom:0.833334em;
	display:inline-block;
    }
address{
	font-size:0.75em;
	font-style:normal;
	text-align:left;
}
.carousel-inner>.item {
position:relative;
display:none;
-webkit-transition:.6s ease-in-out left;
-moz-transition:.6s ease-in-out left;
-o-transition:.6s ease-in-out left;
transition:.6s ease-in-out left;
}
.carousel-inner>.item>img,.carousel-inner>.item>a>img {
display:block;
line-height:1;
}
.carousel-inner>.next,.carousel-inner>.prev {
position:absolute;
top:0;
width:100%;
}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,.open>.dropdown-menu,.dropdown-submenu:hover>.dropdown-menu,.tab-content>.active,.pill-content>.active,.media-object,.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev,.show {
display:block;
}
.carousel-inner>.active,.carousel-inner>.next.left,.carousel-inner>.prev.right {
left:0;
}

.carousel-inner>.next,.carousel-inner>.active.right {
left:100%;
}

.carousel-inner>.prev,.carousel-inner>.active.left {
left:-100%;
}

.News{
	max-width: 100%;
	font-family: "微軟正黑體",STHeiti,Verdana,Geneva,sans-serif;
	border-top: 5px solid #e5e5e5;
	border-bottom: 5px solid #e5e5e5;
	margin-left:1.1%;
	margin-right:1.1%;
	}
.News>h4{
	color:#4d4d4d;
	font-size:18px;
	padding-top:0.25em;
	padding-bottom:0.5em;
	margin: 15px 0;
	padding-left: 2px;
	border-bottom: 1px dotted #cccccc;
	min-height: 25px;}
.News>h4 em{
	padding-left: 10px;
	margin-left: 10px;
	display: inline-block;
	border-left: 1px dotted #cccccc;
	font: italic normal 16px/1em Georgia;
	color: #666;
	font-family: 微軟正黑體;}
.News-cols{
	overflow: hidden;
	text-align:center;}
.News-cols-box:nth-child(1){
	margin-left:0%;
	}
.News-cols-box{
	color:#555555;
	display: inline-block;
	vertical-align: top;
	width: 22.613%;
	margin-left:2.15%;
	margin-bottom: 30px;
	}
.News-cols-box h5{
	font-size:30px;
	font-weight: bold;
	color: #639f5c;
	padding-top: 0;
	line-height: 1.5em;
	margin:10px 0;
	text-align:left;
	}
.News-cols-box b a{color: #639f5c;font-size:17px;} /* h5 */
.News-cols-box h5 a:hover{color: #456f40; text-decoration:none;}
.News-cols-box p{
	font-size: 14px;
	text-align: justify;
	margin-bottom:10px;
	line-height:20px;
	}

.footerTop{
	max-width:100%;
	top:1.3em;
	position:relative;
	font-family: 微軟正黑體;
	margin-left:1.1%;
	margin-right:1.1%;
}

.footer .comment{
	width:48.9%;
	float:left;
	display:inline-block;
	}
.footer .adlink{
	width:49%;
	float:right;
	display:inline-block;
	}
.footerTop h4{font-size:1.15em;}
.footer .comment h4{
	line-height:1.13em;
	border-bottom: 1px dotted #cccccc;
	margin-bottom: 0.55rem;
	padding: 0px 0px 20px 0px;}
.footer .adlink h4{
	line-height:1.13em;
	border-bottom: 1px dotted #cccccc;
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 20px 0px;}	
a.comment-button {
	background: #3FA2C3;
	padding: 11px 20px;
	font-size:14px;
	line-height:20px;
	position:relative;
	display:inline-block;
	}
.footer .comment .fb-comments{
	margin: 10.3px 0px 10px 0px;
	padding-top: 0.625rem;
	border-top: 1px dotted #cccccc;
}
.sidebar-latest-posts{
	margin-top: -1.45em;
	font-size:14px;
	line-height:20px;
	}
.lp-wrapper {
	padding-top:8px;
	padding-bottom:8px;
	border-bottom: 1px dotted #cccccc;
	}
.lp-wrapper:nth-child(3){padding-bottom:8px;}
.lp-title a {color: #555555;}
.lp-wrapper .img-frame {padding: 3px;float: left;}
img{height:auto;}
img.alignleft {margin: 0px 15px 15px 0;}
.lp-title {line-height: 1.5em;
	display: block;}
.clear{clear:both;}
.footerTop p{
	margin-bottom:0.25rem;
}
.footerBottom{
	font-size:12px;
	text-align: center;
	padding: 20px 0px 47px 0px;
	border-top: 1px solid #e5e5e5;
	top:2.2em;
	position:relative;
	line-height:20px;
	margin-left:1.1%;
	margin-right:1.03%;
}
.footerBottom a{color:#555555;}
.table-iframe{
	display: inline-block;
	width: 100%;
	height: auto;
}

	a {
	-webkit-transition: all 150ms ease;
	-moz-transition: all 150ms ease;
	-ms-transition: all 150ms ease;
	-o-transition: all 150ms ease;
	transition: all 150ms ease; 
	}
    a:hover {
		color:#005580;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 8 */
        filter: alpha(opacity=50); /* IE7 */
		opacity:0.6;
	/*	text-decoration:underline; */
    }
	a:focus {
	color:#005580;
	}


/* Reusable column setup */
.col {
    border:0px solid rgba(0,0,0,0);
    float:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -moz-background-clip:padding-box !important;
    -webkit-background-clip:padding-box !important;
    background-clip:padding-box !important;
}

    /* 1. 5 Column Grid 0px - 479px 
    ----------------------------------------------------------------------------- 
        
    Span 1: 50%
    Span 2: 100%
    
    ----------------------------------------------------------------------------- */

    @media screen and (min-width: 0px) and (max-width: 479px) {     
        /*
        Add your semantic classnames in alongside their corresponding spans here. e.g.
        
        .span_3,
        .my_semantic_class_name {
            ...
        }
        */
        
        .span_1 {
            width:50%;
        }
        /* Using .col to target ALL columns and make them 100% */
        .span_2,
        .col {
            width:100%;
            margin-left:0;
        }
		.wrapper {
			max-width:90%;
		}
		.header{
			width:100%;
			height:113px;
		}
		.navigation{
			width:100%;
		}
		.related_content {
            width:100%;
		/*	height:4.6em; */
        }
		.ad {
			width:100%;
		}
		.media_block {
            width:100%;			
		}
		.footer {
            width:100%;
        }
		.thumbnails .span{
			width:100%
		}
		.News-cols-box{
			width:100%;
			margin-left:0rem;
		}
		.thumbnails>li{
			margin-left:0rem;	
		}
		.wrapper .header h1{
			padding-top:0.5em;
			font-size:22px;
		}
		.wrapper .header h2{
			font-size:12px;
		}
		#social{
			bottom:0.7em;
		}		
		.control-box{
			top:-1em;
		}
		.carousel-control{
			font-size:1.05em;
			padding:0px 5px 0px;
			height:15px;
			width:7.5px;
		}
		.page-header1{
			font-size:1.2rem;
		}
		.page-header1 h3{
			font-size:1.2rem;
		}
    }

    /* 2. 5 Column Grid 480px - 759px 
    ----------------------------------------------------------------------------- 
    
    Span 1:    18.4%
    Span 2:    38.8%
    Span 3:    59.2%
    Span 4:    79.6%
    Span 5:    100%
    
    ----------------------------------------------------------------------------- */

    @media screen and (min-width: 480px) and (max-width: 759px) {
        .span_1 {
            width:18.4%;
        }
        .span_2 {
            width:38.8%;
        }
        .span_3 {
            width:59.2%;
        }
        .span_4 {
            width:79.6%;
        }
        .span_5 {
            margin-left:0;
            width:100%;
        }
		.wrapper {
			max-width:90%;
		}
		.header{
			width:100%;
		/*	height:113px; */
		}
		.navigation{
			width:100%;
		}
		.related_content {
            width:100%;
		/*	height:4.6em; */
        }
		.ad {
			width:100%;
		}
		.media_block {
            width:100%;			
		}
		.footer {
            width:100%;
        }
		.thumbnails .span{
			width:47%
		}
		.thumbnails [class*="span"]:nth-child(3){
			margin-left:0;	
		}
		.News-cols-box{
			width:44%;
		}
		.News-cols-box:nth-child(3){
			margin-left:0;
		}
		.wrapper .header h1{
			padding-top:0.5em;
		}
		#social{
			bottom:0.7em;
		}
    }
	@media screen and (min-width: 480px) and (max-width: 551px) {
		address{
			font-size:0.9em;
		}
		.thumbnails .span{
			width:46.5%;
		}
		.page-header1{
			font-size:1.2rem;
		}
		.control-box{
			top:-1em;
		}
		.carousel-control{
			font-size:1.05em;
			padding:0px 5px 0px;
			height:15px;
			width:7.5px;
		}
	}
	
	@media screen and (min-width: 480px) and (max-width: 763px) { 
		.News-cols-box h5 a{
			font-size:1rem;
		}
	}
	@media screen and (max-width: 750px) {
		.footer .comment{
			border-bottom: 0px;
		}
		.footer .adlink{
			border-top: 1px dotted #cccccc;
		}
		.footer .adlink h4{
			padding: 20px 0px 20px 0px;
		}
		.footer .comment{
			width:100%;
		}
		.footer .adlink{
			width:100%;
			float:left;
		}
	}
	@media screen and (min-width:751px) and (max-width: 839px) { 
		.sidebar-latest-posts{
			font-size:12px;
		}
	}
	
    /* 3. 8 Column Grid 760px - 1239px 
    ----------------------------------------------------------------------------- 
    
    Span 1:    10.75%
    Span 2:    23.5%
    Span 3:    36.25%
    Span 4:    49.0%
    Span 5:    61.75%
    Span 6:    74.5%
    Span 7:    87.25%
    Span 8:    100%
    
    ----------------------------------------------------------------------------- */

    @media screen and (min-width: 760px) and (max-width: 1239px) {     
        .span_1 {
            width:10.75%;
        }
        .span_2 {
            width:23.5%;
        }
        .span_3 {
            width:36.25%;
        }
        .span_4 {
            width:49.0%;
        }
        .span_5 {
            width:61.75%;
        }
        .span_6 {
            width:74.5%;
        }
        .span_7 {
            width:87.25%;
        }
        .span_8 {
            margin-left:0;
            width:100%;
        }
		.wrapper {
			max-width:90%;
		}
		.header{
			width:100%;
			height:113px;
		}
		.navigation{
			width:100%;
		}
		.related_content {
            width:100%;
		/*	height:4.6em; */
        }
		.ad {
			width:100%;
		}
		.media_block {
            width:100%;
		}
		.footer {
            width:100%;
        }
		.thumbnails .span{
			width:21.7%;
		}
		.News-cols-box{
			width:48.5%;
		}
		.News-cols-box:nth-child(3){
			margin-left:0;
		}
    }
	
	@media screen and (min-width: 0px) and (max-width: 611px) { 
		.flexslider .title{
			font-size:0.7rem;
		}
		.flexslider .desc{
			display:none
		}
		.slide>a>img{
			height:250px;
		}
	}
	@media screen and (min-width: 524px) and (max-width: 1000px) {
		.flexslider .desc{
			font-size:12px;
		}
		.flexslider .title{
			font-size:16px;
		}
	}
	
    /* 4. 12 Column Grid 1240px - Infinity 
    ----------------------------------------------------------------------------- 
    
    Span 1:    6.5%
    Span 2:    15.0%
    Span 3:    23.5%
    Span 4:    32.0%
    Span 5:    40.5%
    Span 6:    49.0%
    Span 7:    57.5%
    Span 8:    66.0%
    Span 9:    74.5%
    Span 10:    83.0%
    Span 11:    91.5%
    Span 12:    100%
    
    ----------------------------------------------------------------------------- */
		
    @media screen and (min-width: 1240px) {
               
        .span_1 {
            width:6.5%;
        }
        .span_2 {
            width:15.0%;
        }
        .span_3 {
            width:23.5%;
        }
        .span_4 {
            width:32.0%;
        }
        .span_5 {
            width:40.5%;
        }
        .span_6 {
            width:49.0%;
        }
        .span_7 {
            width:57.5%;
        }
        .span_8 {
            width:66.0%;
        }
        .span_9 {
            width:74.5%;
        }
        .span_10 {
            width:83.0%;
        }
        .span_11 {
            width:91.5%;
        }
        .span_12 {
            margin-left:0;
            width:100%;
        }		
		.header
		{
			width:100%;
			height:113px;
		}
		.navigation{
			width:100%;
		}
		.related_content {
            width:100%;
		/*	height:4.6em; */
        }
		.ad {
			width:100%;
		}
		.media_block {
            width:100%;
		}
		.footer {
            width:100%;
        }
    }