@charset "UTF-8";

@import "tmp.less";
/*****************css3*****init*********************/

.border-radius(@radius) {
  -webkit-border-radius: @radius;
     -moz-border-radius: @radius;
      -ms-border-radius: @radius;
       -o-border-radius: @radius;
          border-radius: @radius;
}

.box-shadow(@shadow) {
   -webkit-box-shadow:@shadow;
     -moz-box-shadow: @shadow;
      -ms-box-shadow: @shadow;
       -o-box-shadow: @shadow;
          box-shadow: @shadow;
}

.transition(@transition) {
    -webkit-transition: @transition;
       -moz-transition: @transition;
        -ms-transition: @transition;
         -o-transition: @transition;
            transition: @transition;
}

.transform(@transform) {
    -webkit-transform: @transform;
       -moz-transform: @transform;
        -ms-transform: @transform;
         -o-transform: @transform;
            transform: @transform;
}

.animation-iteration-count(@iteration) {
    -webkit-animation-iteration-count:@iteration;
       -moz-animation-iteration-count:@iteration;
        -ms-animation-iteration-count:@iteration;
         -o-animation-iteration-count:@iteration;
            animation-iteration-count:@iteration;
}

.animation(@animation) {
     -webkit-animation: @animation;
        -moz-animation: @animation;
         -ms-animation: @animation;
          -o-animation: @animation;
             animation: @animation;
}

.animation(@filter) {
	-webkit-filter: @filter;
	   -moz-filter: @filter;
		-ms-filter: @filter;
		 -o-filter: @filter;	
			filter: @filter;	
}
/***************end*css3*****init*******************/

/*****************css*****reset*********************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, input {
  margin: 0;
  padding: 0;
  outline: 0;
  font-family: "微軟正黑體",Arial;
  font-weight: normal; }

html {
  height: 100%; 
  x-overflow:hidden;
	}

body {
  height: 100%;
  background: #efefef;
}

h1, h2, h3, h4, h5, h6, p, a, td, li {
  color: #1A1A1A;
  word-break: break-all; }

img {
  border: 0; }

p {
  font-size: 14px; }

a {
  text-decoration: none;
  /* 去連結底線 */
  //behavior: expression(this.onFocus=this.blur());
  /* for IE */
}

a:hover {
  text-decoration: none !important;}

ol, ul {
  list-style: none; }

/* remember to define focus styles! */
:focus {
  outline: 0; }

/* remember to highlight inserts somehow! */
del {
  text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

input {
  border: none;
  outline: none; }

input[type="button"] {
  cursor: pointer; }

.clear {
  clear: both;
  height: 0; }

.gradient {
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 50%, rgba(206,206,206,1) 75%, rgba(124,124,124,1) 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,rgba(255,255,255,1)), color-stop(75%,rgba(206,206,206,1)), color-stop(99%,rgba(124,124,124,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 50%,rgba(206,206,206,1) 75%,rgba(124,124,124,1) 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(255,255,255,1) 50%,rgba(206,206,206,1) 75%,rgba(124,124,124,1) 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 50%,rgba(206,206,206,1) 75%,rgba(124,124,124,1) 99%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(255,255,255,1) 50%,rgba(206,206,206,1) 75%,rgba(124,124,124,1) 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#7c7c7c',GradientType=0 ); /* IE6-9 */
}

@blue_color : #005B97;
@green_color : #5D9606;
/****************end*css*****reset*********************/
#wrapper {
	
	min-width:960px;
	min-height:100%;
	margin:0 auto -140px auto;
	background:#fff;
	
	#header {
		position:relative;
		z-index:2;
		width:auto;
		margin:0 auto;
		text-align:center;
		/* background:url(../images/banner.jpg) center;
		height:217px; */
	
		> a.mailto {
			width:155px;
			height:37px;
			background:url(../images/mail.png);
			position:absolute;
			bottom:55px;
			right:200px;
		}
		
		> a.logo {
			width:150px;
			height:130px;
			display:block;
			position:absolute;
			top:45px;
			left:80px;
			//border:1px solid #fff;
		}
		
		
		/* @media only screen and (max-width: 1680px) {
			> a.logo {
				left:15%;
			}
		}
		
		
		@media only screen and (max-width: 1280px) {
			> a.logo {
				left:5%;
			}
		}
		
		@media only screen and (max-width: 960px) {
			> a.logo {
				left:0%;
			}
		} */
		
		.banner{
			height:217px;
			background-image:url(../images/banner.jpg);
			background-position:center;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-ms-background-size: cover;
			-o-background-size: cover;
		}
	
		.nav {
			height:62px;
			background-color:#EBFFF0;
			/* background-image:url(../images/bg_nav.png);
			background-repeat:no-repeat;
			background-position:70px; */
			box-shadow:5px 5px 5px #999;
			
			>ul {
				width:960px;
				margin:0px auto 0 auto;
				padding-top:10px;
				background-image:url(../images/bg_nav.png);
				background-repeat:no-repeat;
				background-position: 0px 5px;
				height:45px;

	
				>li {
					border-left:2px solid @green_color;
					display:inline-block;
					padding:0 15px 0 15px;
					position:relative;
	
					&.active > a {
						color:#C1272D;
					}
					
					&.active > img {
						display:block;
					}
					
					&:hover > ul , &:hover > img {
						display:block;
					}
					
					&.logo {
						padding:0;
					}
					
					&.logo a {
						position:absolute;
						width:40px;
						height:40px;
						top:-50px;
						left:-36px;
					}
					
					
					> img {
						position:absolute;
						left:0;
						top:-42px;
						display:none
					}
					
					>ul {
						position:absolute;
						background:rgba(4,0,0,.7);
						padding:3px 3px;
						text-align:left;
						z-index:9999;
						width:140px;
						display:none;
						
						
						li {
							line-height:25px;
							border-bottom:1px solid #fff;
						
							&.active > a {
								color:@blue_color;
							}
							
							>a {
								color:#fff;
								margin-left:3px;
								
								&:hover, {
									color:@blue_color;
								}
							}
						}
					}
						
					>a {
						font-size:18px;
						font-weight:bold;
						color:@blue_color;
						
						&:hover {
							color:#C1272D;;
						}
					}
				}
			}
		 }
		 
		 .site_des {
			height:30px;
		 	background:url(../images/bg_blue.png);
		 	padding-top:5px;
		 	color:#fff;
		 	font-weight:bold;
		 	letter-spacing:3px;
		 	
		 }
		 
		 .site_des_p {
		 	color:@blue_color;
		 	font-size:12px;	
		 	line-height:20px;
		 }
	}
	
	#container {
		position:relative;
		z-index:1;
		width:960px;
		margin:0 auto 50px auto;
		padding-top:20px;
		padding-left:10px;
		padding-right:10px;
	}
	
	#push {
		height:175px;
	}
	
}

#footer {
	height:140px;
	position:relative;
	background:url(../images/bg_footer.jpg) repeat center;
	z-index:1;
	text-align:center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	-o-background-size: cover;
	
	.footer_des {
		
		width:960px;
		margin:0 auto;
		padding-top:20px;
	
		text-align:center;
	
		p {
			color:#fff;
			font-size:15px;
		}
		
		> ul {
			width:450px;
			float:left;
			text-align:left;
			
			li {
				line-height:22px;
				> p , > div {
					float:left;
				}
				>div {
					width:380px;
				}
			}
		}
	}
	
	.footer_nav {
	 	border-bottom:2px solid #4c9cb5;
		width:960px;
		padding-bottom:10px;
		margin:15px auto 0 auto;
		
		ul {
					
			li {
				display:inline-block;
				border-left:2px solid #fff;
				padding:0 5px;
				
				a {
					color:#fff;
					font-size:12px;
					
					&:hover {
						color: #2a6496;
					}
				}
			}
		}
	}
	
	.footer_site {
		width:960px;
		margin:0 auto;
		padding-top:23px;
		
		p {
			color:#fff;
			font-size:12px;
			font-weight:bold;
		}
	 }
}

.page_block {
		float:left;
		position:relative;
		left:50%;
		min-width:960px;
		margin-bottom:90px;
		
		>a.prev, a.next {
			width:16px;
			height:24px;
			//border:1px solid #4C4C4C;
			text-indent:-9999px;
	
			&:hover {
				background-position:0 25px;
			}
	
			&.prev {
				background-image:url(../images/btn_prev.png);
			}
			
			&.next {
				background-image:url(../images/btn_next.png);
			}
		}
		
		a {
			float:left;
			position:relative;
			left:-50%;
			width:20px;
			display:block;
			text-align:center;
			color:#898989;
			margin:0 3px 0 3px;	
			font-weight:bold;
			
			&:hover,&.active {
				color:#000;
			}					
		}	
}
/******** layout *********/
.content{
	
	width:960px;
	margin:0 auto;
	padding:15px;
	
	>h1 {
		color:#4B160B;
		font-size:18px;
		background:url(../images/bg_point_star.png) no-repeat;
		padding-left:25px;
		line-height:25px;
		border-bottom:4px solid #005B97;
		margin-top:15px;
		
		&.news_title {
			border-bottom:4px solid #B9247A;
		}
		
		&.gallary_title {
			border-bottom:none;
		}
			
	}
	
	.crumbs{
		font-size:15px;
		color:@blue_color;
		padding-left:25px;
		background:url(../images/bg_point_green.png) no-repeat 0 3px;
	}
}