@charset "utf-8";







#header {
	width: 100%;
	height: auto;
	position: fixed;
	padding-top: 20px;
	font-size: 14px;
	transition: all ease .3s;
	z-index: 99;
}
#header ul li.navitem:hover ul.subnav {
	opacity: 1;
	visibility: visible;
	transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-webkit-transform: translate3d(0px, 0px, 0px);
}
#header ul li.navitem {
	width: auto;
	float: left;
	position: relative;
	padding-bottom:20px;
}
#header ul li.navitem:first-child{
	display: none;
}
#header ul li.navitem ul.subnav {
	transition: all 0.3s ease-out 0s;
	position: absolute;
	width: 140px;
	border-top: #838383 3px solid;
	opacity: 0;
	visibility: hidden;
	transform: translate3d(0px, 10px, 0px);
	-moz-transform: translate3d(0px, 10px, 0px);
	-webkit-transform: translate3d(0px, 10px, 0px);
	margin-left: 28px;
}
#header ul li.navitem a {
	
	padding: 30px 30px 30px 30px;
}
#header ul li.navitem>a {
	cursor: default;
}
#header ul li .navitem a.active, #header ul li .navitem:hover a {
	padding: 30px 30px;
	color: #fe7600;
	background: transparent none repeat scroll 0% 0%;
}

#header.mini ul li.navitem ul.subnav {
	transform: translate3d(0px, 10px, 0px);
	-webkit-transform: translate3d(0px, 10px, 0px);
	margin-left: 26px;
}

#header ul li.navitem:nth-child(3) ul.subnav {
	margin-left: 17px;
}


#header.mini ul li.navitem:hover ul.subnav {
	transform: translate3d(0px, 0px, 0px);
	-webkit-transform: translate3d(0px, 0px, 0px);
}
#header.mini ul li.navitem ul.subnav li a {

	
}
#header ul li.navitem ul.subnav li a {
	height: 40px;
	line-height: 40px;
	display: block;
	font-size: 14px;
	transition: all 0.2s ease-out 0s;
	color: #999;
	display: block;
	padding: 0;
	margin: 0;
	border-bottom: 1px solid #2c2c2c;
	position: relative;
	width: 100%;
	text-align: left;
	text-indent: 53px;
}
#header ul li.navitem ul.subnav li a:hover {
	text-indent: 40px;
	color: #fdfdfd;
}




#header ul li.navitem ul.subnav li a:after {
	position: absolute;
	z-index: -1;
	width: 0;
	height: 40px;

	content: "";
	text-align: left;
	right: 0;
	display: block;
	top: 0;
	-webkit-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;-ms-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;
}
#header ul li.navitem ul.subnav li a:hover:after{
	width: 100%;
	right: auto;
	background: #2f2f2f;
}















#header ul li.navitem ul.subnav {
	border-top: 0px solid #7B7B7B;
	border-radius: 0px;
	box-shadow: 0px 12px 36px rgba(0, 0, 0, 0.16);
	margin-top: 3px;
	background: #232425;
	width: 190px;
	overflow-x: hidden;
}
#header ul li.navitem ul.subnav>li:last-child a{
	border: none;
}
#header ul li.navitem:before{
	content: "";
	position: absolute;
	top: -14px;
	left: 31px;
	width: 0px;
	right: 0;
	height: 2px;
	background: red;
	-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;
}
#header ul li.navitem:hover:before{
	width: 28px;
}


#header ul li.navitem:nth-child(3):before{
	left: 29px;
}
#header ul li.navitem:nth-child(3):hover:before{
	width: 48px;
}












.content .header p.subtitle {
	color: #828282;
	font-size: 14px;
	width: 60%;
	margin: 0 auto;
	margin-top: 20px;
}

#header ul li.navitem a.active, 
#header ul li.navitem:hover a {
	color: #fff;
	font-size: 15px;
	font-family: "微軟正黑體";
}


#header ul li.navitem a.active{
	color: #606060;
}
#index #header ul li.navitem a.active{
	color: #fff;
}





#header .content {
	padding-left: 0px;
	padding-right: 0px;
}
#header ul#nav {
	float: right;
	padding: 42px 10% 0px 0px;
	-webkit-transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	-ms-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;

}
#index #header ul#nav{
	padding: 42px 5% 0px 0px;
}


#index #header.mini ul#nav {
	padding: 42px 10.29% 0px 0px;
	
}

#index #header.mini {
	padding-top: 0px;
	background-color: rgba(33, 33, 33, 0.8);
	border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

#header.mini {
	padding-top: 0px;
	background-color: #fff;
	border-bottom: 1px solid #f1f1f1;
	
}

#header {
	padding-top: 0px;
	background-color: transparent;
	background:#fff;
	
}
#index #header {
	padding-top: 0px;
	border-bottom: 1px solid rgba(255, 255, 255, 0);
	background:none;
}




#header #logo {
	padding:16px 0 0px 10%;
	transition: all 0.3s ease-out 0s;
	width: auto;
	display: block;
	float: left;
}
#index #header #logo {
	padding:16px 0 0px 5%;
}
#header #logo img {
	-webkit-transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	-ms-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;

}
#index #header #logo img{
	content: url(../images/x90.png);
}









#index #header.mini #logo {
	padding: 16px 0px 0px 10%;
}


#header.mini #logo img {
	-webkit-transform: scale(0.9, 0.9);-moz-transform: scale(0.9, 0.9);-o-transform: scale(0.9, 0.9);-ms-transform: scale(0.9, 0.9);transform: scale(0.9, 0.9);  
	
}
.nobanner #header {
	background-color: #212121;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}


#top_right{
	float: right;
	padding: 3px 0 0px 0px;
}
#top_right ul li{
	float: right;
	position: relative;
}
#top_right ul li a{
	display: inline-block;
	width: 20px;
	height: 16px;
	float: right;
	cursor: none;
	margin-left: 23px;
	-webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-moz-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-o-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-ms-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}


#top_right ul li:first-child a{
	background: url(../images/x76.png)  no-repeat center 0px;
}
#top_right ul li:first-child a:hover{
	background: url(../images/x76.png)  no-repeat center -16px;
}

#top_right ul li+li a{
	background: url(../images/x77.png)  no-repeat center 0px;
	position: relative;
}
#top_right ul li+li a:hover{
	background: url(../images/x77.png)  no-repeat center -16px;
}





#top_right ul li a+i{
	position: absolute;
	z-index: 3;
	content: "";
	left: -49px;
	top: 46px;
	display: block;
	width: 164px;
	height: 150px;
	background:#fff url(../images/x93.png) no-repeat center 12px;
	cursor: default;
	border: 1px solid #f1f1f1;
	border-top:none;
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-moz-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-o-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-ms-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; 
}
#top_right ul li a:hover+ i{
	top: 36px;
	opacity: 1;
	filter: alpha(opacity=100);
}



#top_right ul li i+u{
	position: absolute;
	z-index: 4;
	content: "";
	left: -49px;
	top: 176px;
	display: block;
	width: 164px;
	height: 36px;
	line-height: 36px;
	background:#222222;
	color: #fff;
	text-align: center;
	font-size: 0.14rem;
	cursor: default;
	opacity: 0;
	text-decoration: none;
	-webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-moz-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-o-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-ms-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; 
	filter: alpha(opacity=0);
}
#top_right ul li a:hover+i+u{
	top: 186px;
	opacity: 1;
	filter: alpha(opacity=100);
}

















#top_right ul li+li a+i{
	position: absolute;
	z-index: 3;
	content: "";
	left: -49px;
	top: 46px;
	display: block;
	border: 1px solid #f1f1f1;
	border-top:none;
	width: 164px;
	height: 150px;
	background:#fff url(../images/x92.png) no-repeat center 12px;
	cursor: default;
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-moz-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-o-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-ms-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; 
}
#top_right ul li+li a:hover+ i{
	top: 36px;
	opacity: 1;
	filter: alpha(opacity=100);
}



#top_right ul li+li i+u{
	position: absolute;
	z-index: 4;
	content: "";
	left: -49px;
	top: 176px;
	display: block;
	width: 164px;
	height: 36px;
	line-height: 36px;
	background:#222222;
	color: #fff;
	text-align: center;
	font-size: 0.14rem;
	cursor: default;
	opacity: 0;
	text-decoration: none;
	-webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-moz-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-o-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;-ms-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; 
	filter: alpha(opacity=0);
}
#top_right ul li+li a:hover+i+u{
	top: 186px;
	opacity: 1;
	filter: alpha(opacity=100);
}



#top_right ul li+li+li a:before,
#top_right ul li+li+li+li a:before,
#top_right ul li+li+li a:after,
#top_right ul li+li+li+li a:after{
	display: none;
}






#top_right ul li+li+li a{
	background: url(../images/x78.png)  no-repeat center 0px;
}
#top_right ul li+li+li a:hover{
	background: url(../images/x78.png)  no-repeat center -16px;
}


#top_right ul li+li+li+ a,
#top_right ul li+li+li a:hover{
	cursor: pointer;
}


#top_right ul li+li+li+li a,
#top_right ul li+li+li+li a:hover{
	background: none;
	cursor: default;
	color: #ddd;
}

#index #top_right ul li+li+li+li a,
#index #top_right ul li+li+li+li a:hover{
	background: none;
	cursor: default;
	color: #4c4c4c;
}






#index #top_right ul li:first-child a{
	background: url(../images/x02.png)  no-repeat center 0px;
}
#index #top_right ul li:first-child a:hover{
	background: url(../images/x02.png)  no-repeat center -16px;
}
#index #top_right ul li+li a{
	background: url(../images/x03.png)  no-repeat center 0px;
}
#index #top_right ul li+li a:hover{
	background: url(../images/x03.png)  no-repeat center -16px;
}
#index #top_right ul li+li+li a{
	background: url(../images/x04.png)  no-repeat center 0px;
}
#index #top_right ul li+li+li a:hover{
	background: url(../images/x04.png)  no-repeat center -16px;
}