@charset "utf-8";

/* template */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

body {
	background:#FFF;
	font-size:13px;
	font-family: Verdana ,  Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "新細明體", DFKai-SB, sans-serif;
	overflow-y: scroll;
	overflow-x: hidden;
}

label {cursor:pointer;}

.open_mobile_menu_cover ,
.tablet_show , 
.mobile_show , 
.hidden {display:none;}

.text-center {text-align:center;}

a , .btn
{
	outline: none; /* for Firefox Google Chrome  */
	behavior:expression(this.onFocus=this.blur()); /* for IE */	
}

.clearfix:after	{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix		{overflow:hidden;display:inline-block;clear:both;}

h2 , h3 {font-weight:normal;}

.wrap {width:980px;margin:0 auto;position:relative;}

/* header */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

.header
{
	visibility:hidden;
	width:100%;
	height:40px;
	border-bottom:1px solid #FFF;
}

.header .inner
{
	position:absolute;
	width:100%;
	height:40px;
	z-index:50;
}

.header .wbg
{
	position:absolute;
	width:50%;
	height:40px;
	z-index:49;
	background:#FFF;
}

.header .header0_bg ,
.header .header1_bg ,
.header .header2_bg ,
.header .header3_bg ,
.header .header4_bg ,
.header .header5_bg
{
	position:absolute;
	left:50%;
	width:50%;
	height:40px;
}

.header .header0_bg
{
	z-index:46;
	background:url(../img/header_0.png);
}

.header .header1_bg
{
	z-index:45;
	background:url(../img/header_1.png);
}

.header .header2_bg
{
	z-index:44;
	background:url(../img/header_2.png);
}

.header .header3_bg
{
	z-index:43;
	background:url(../img/header_3.png);
}

.header .header4_bg
{
	z-index:42;
	background:url(../img/header_4.png);
}

.header .header5_bg
{
	z-index:41;
	background:url(../img/header_0.png);
}

.header ul
{
	position:relative;
	overflow:hidden;
	width:100%;
	height:40px;
}

.header ul li
{
	position:absolute;
	width:100%;
	height:40px;
	left:0;
	top:0;
}

.header ul li:nth-child(1) {z-index:15;}
.header ul li:nth-child(2) {z-index:14;}
.header ul li:nth-child(3) {z-index:13;}
.header ul li:nth-child(4) {z-index:12;}
.header ul li:nth-child(5) {z-index:11;}
.header ul li:nth-child(6) {z-index:10;}

.header0 , .header1 , .header2 , .header3 , .header4 , .header5 {height:40px;}
.header0 {background:url(../img/header_0.png);}
.header1 {background:url(../img/header_1.png);}
.header2 {background:url(../img/header_2.png);}
.header3 {background:url(../img/header_3.png);}
.header4 {background:url(../img/header_4.png);}
.header5 {background:url(../img/header_0.png);}

.header0 , .header1 , .header2 , .header3 , .header4 , .header5 {height:40px;}

.header0 .menu , .header1 .menu , .header2 .menu , .header3 .menu , .header4 .menu , .header5 .menu
{
	float:right;
	line-height:40px;
	font-size:13px;
	color:#FFF;
	letter-spacing:1px;
	padding-right:5px;
}

.header0 .menu a , .header1 .menu a , .header2 .menu a , .header3 .menu a , .header4 .menu a , .header5 .menu a
{
	float:left;
	display:block;
	height:40px;
	color:#FFF;
	text-decoration:none;
	background:url(../img/menu_dot.png) no-repeat 7px 0;
	text-align:center;
}

.header0 .menu a.on , .header1 .menu a.on , .header2 .menu a.on , .header3 .menu a.on , .header4 .menu a.on , .header5 .menu a.on
{
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	background-color:#FFF;
	margin-top:2px;
	height:38px;
	line-height:38px;
	font-size:15px;
	font-weight:bold;
}

.menu a.m0 {width:120px;}
.menu a.m1 {width:120px;}
.menu a.m2 {width:170px;}
.menu a.m3 {width:120px;}
.menu a.m4 {width:135px;}

.header0 .menu a.on {color:#13294b;}
.header1 .menu a.on {color:#623412;}
.header2 .menu a.on {color:#64a70b;}
.header3 .menu a.on {color:#13294b;}
.header4 .menu a.on {color:#bf0d3e;}
.header5 .menu a.on {color:#13294b;}

/* mainpic */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

.picScale
{
	display:block;
	-webkit-animation: picScale 6s 1 linear;
	-moz-animation: picScale 6s 1 linear;
	-o-animation: picScale 6s 1 linear;
	-ms-animation: picScale 6s 1 linear;
}

.picScaleRecovery
{
	-webkit-transform: rotate(0deg) scale(1) skew(0) translate(0px);
	-moz-transform: rotate(0deg) scale(1) skew(0) translate(0px);
	-o-transform: rotate(0deg) scale(1) skew(0) translate(0px);
	-ms-transform: rotate(0deg) scale(1) skew(0) translate(0px);
}

@-webkit-keyframes picScale {
	from { -webkit-transform: rotate(0deg) scale(1) skew(0) translate(0px); }
	to { -webkit-transform: rotate(1deg) scale(1.3) skew(0) translate(0px); }
}

@-moz-keyframes picScale {
	from { -moz-transform: rotate(0deg) scale(1) skew(0) translate(0px); }
	to { -moz-transform: rotate(1deg) scale(1.3) skew(0) translate(0px); }
}

@-o-keyframes picScale {
	from { -o-transform: rotate(0deg) scale(1) skew(0) translate(0px); }
	to { -o-transform: rotate(1deg) scale(1.3) skew(0) translate(0px); }
}

@-ms-keyframes picScale {
	from { -ms-transform: rotate(0deg) scale(1) skew(0) translate(0px); }
	to { -ms-transform: rotate(1deg) scale(1.3) skew(0) translate(0px); }
}

/* footer */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

.footer
{
	visibility:hidden;
	width:100%;
	height:125px;
	margin-top:75px;
	border-top:1px solid #CCC;
	clear:both;
}

.footer .info
{
	height:85px;
	position:relative;
}

.footer .info .logo
{
	position:absolute;
	width:400px;
	height:35px;
	top:20px;
	background:url(../img/footer_logo.gif) no-repeat;
	border-right:1px solid #CCC;
}

.footer .info .logo p
{
	margin-left:120px;
	line-height:17px;
}
.footer .info .logo .n1 {font-size:16px;}
.footer .info .logo .n2 {font-size:15px;}

.footer .info .address
{
	position:absolute;
	right:0;
	top:15px;
	font-size:15px;
	color:#333;
	text-align:right;
}

.footer .info .address span {font-size:12px;}

.footer .copyright
{
	height:40px;
	line-height:40px;
	text-align:center;
	color:#FFF;
	font-size:12px;
	background:url(../img/header_0.png);
}




/* @media for RWD */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

@media (max-width: 980px)
{
	.wrap {width:100%;}
	.header .menu a
	{
		letter-spacing:0;
		text-align:right !important;
		padding-right:5px;
		background:url(../img/menu_dot.png) no-repeat 2px 0 !important;
	}
	.header .menu a.on
	{
		text-align:center !important;
		padding-right:0;
		background-color:#FFF !important;
		padding:0 5px;
	}
	.header .menu a.m0 {width:90px;}
	.header .menu a.m1 {width:90px;}
	.header .menu a.m2 {width:130px;}
	.header .menu a.m3 {width:100px;}
	.header .menu a.m4 {width:105px;}
}

@media (max-width: 779px)
{
	.header ul li .menu a {display:none;}
	.header ul li .menu a.on {display:block;}

	.tablet_show {display:block;}
	.mobile_show {display:none;}
	.tablet_menu
	{
		position:absolute;
		right:120px;
		top:10px;
	}

	.footer .info
	{
		padding:20px 0;
	}

	.footer .info , .footer .info .logo , .footer .info .address
	{
		width:100%;
		height:auto;
		position:static;
		text-align:center;
	}

	.footer .info .logo
	{
		height:100px;
		border:0;
		background:url(../img/footer_logo.gif) top center no-repeat;
	}

	.footer .info .logo p
	{
		display:block;
		margin:5px;
	}

	.footer .info .logo p:nth-child(1)
	{
		padding-top:50px;
	}

}

@media (max-width: 480px)
{
	.header {margin-top:40px;}
	.header ul {overflow:visible;}
	.header ul li .menu a {display:none;}
	.header ul li .menu a.on {display:block;}

	.header .menu a.on {padding:0 2px;}
	.header ul li .menu a.on {font-size:12px;}

	.co_name .name a
	{
		width:100% !important;
		background-size:90% auto !important;
	}

	.tablet_show {display:none;}
	.mobile_show {display:block;}

	.open_mobile_menu_cover
	{
		position:fixed;
		z-index:9997;
		width:100%;
		height:100%;
		background:url(../img/cover.png);
	}

	.mobile_menu
	{
		z-index:9999;
		width:97%;
		height:39px;
		position:fixed;
		top:0;
		border-bottom:1px solid #999;
		text-align:right;
		line-height:39px;
		padding-right:3%;
	}

	.mobile_menu .icon
	{
		position:absolute;
		width:40px;
		height:40px;
		cursor:pointer;
		background:url(../img/menu_icon.png);
	}

	.mobile_leftMenu
	{
		position:fixed;
		z-index:9998;
		top:40px;
		left:-150px;
		width:150px;
		background:#FFF;
	}

	.mobile_leftMenu ul li
	{
		border-bottom:1px solid #CCC;
	}

	.mobile_leftMenu ul li a
	{
		display:block;
		height:48px;
		width:110px;
		font-size:16px;
		color:#333;
		line-height:48px;
		text-decoration:none;
		padding-left:40px;
	}

	.mobile_leftMenu ul li a:hover {color:#000;font-weight:bold;}

	.mobile_leftMenu ul li.on a
	{
		color:#FFF;
	}

	/*.page .menu , .culture_photo_box , .culture_photo_circle {display:none;}*/

	.page .menu {display:none;}

	.footer {height:auto;}

	.page .content {padding:0 5px;}
	.page .content .culture_photo_box
	{
		width:100% !important;
		height:auto !important;
		border:0 !important;
	}
	.page .content .culture_photo_box ul.photo
	{
		position:static !important;
		width:100% !important;
		height:auto !important;
	}
	.page .content .culture_photo_box ul.photo li
	{
		display:none;
		float:none !important;
	}
	.page .content .culture_photo_box ul.photo li:nth-child(1)
	{
		display:block;
	}
	.page .content .culture_photo_box ul.photo li img
	{
		border:0 !important;
		width:100% !important;
	}

	.page .content .culture_photo_circle
	{
		width:100% !important;
		text-align:center;
	}
	.page .content .culture_photo_circle ul
	{
		width:190px;
		margin:0 auto;
	}
	.page .content .culture_photo_circle li
	{
		padding:10px 10px !important;
	}

}