@charset "utf-8";
.Dfloat {
	font-weight:bold;
	padding:10px;
	width:100px;
	height:150px;
	position:fixed; /*距離上方的位置*/
	right:5px;
	/*left:99%;距離左方的位置*/
  	margin-top:-100px;
	margin-left:-200px;
	_position: absolute; /* position fixed for IE6 */
    _top:expression(documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight)/2);
	_margin-top:0;
	bottom: 150px;

	
}
.Dfloat li{
	list-style:none;
	background-color: #FFFFFF;
	border: 1px solid #000000;
	margin: 3px;
	text-align: center;
}

header {
	border-bottom: 1px #cdcdcd solid;
}

/**
*
* =top-bar
*
**/
header #top-bar {
	background: #454545;
	line-height: 50px;
	z-index:9999;
	position:fixed; 
	top:0;
	left:0;
	width:100%;		
}


header #top-bar .bar-left {
	margin: 0 auto;

	text-align: left;
	font-size: 13px;
}

header #top-bar .bar-right {
	margin: 0 auto;
	float:right;
	
	text-align: right;
	font-size: 13px;
}

header #top-bar .bar-right a {
	color: #e1e1e1;
}

header #top-bar .bar-right a:hover {
	color: #fff;
}

header #top-bar .bar-right a:after {
	display: inline-block;
    content: "";
    font-size: 12px;
    color: #DBDBDB;
    padding: 0 4px;
}

header #top-bar .bar-right a.language:after ,
header #top-bar .bar-right a.community:after {
	content: "";
}

header #top-bar .bar-right a.community i {
	width: 20px;
	height: 20px;
	background: #dbdbdb;
	display: inline-block;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	text-align: center;
	line-height: 22px;
	font-size: 16px;
	color: #454545;
}

header #top-bar .bar-right a.community i:hover {
	background: #fff;
}

/**
*
* =cis
*
**/
header #cis {
	float: left;
}

/**
*
* =main-menu
*
**/


header .nav-func {
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 8px;
	right: 0;
	text-align: center;
	line-height: 50px;
	font-size: 30px;
	color: #444;
	

		margin: 0 auto;
		position: relative;
		float:left;
		color:#FFF;
		line-height: 40px;
}

#bars{
		display: block;
		margin: 0 auto;
		position: relative;
		float:left;
		color:#FFF;
		line-height: 40px;
		padding-left:10px;
}



header nav {
	margin: 13px 0 12px;
	display: block;
	float: right;
    overflow: hidden;
}

header nav ul.pc {
	float: right;
/*	padding-top: 10px;*/
}

header nav ul.pc li {
	margin-right: 20px;
	float: left;

}



header nav ul.pc li a {
	display: block;
	position: relative;
	width: 105px;
	height: 40px;
	font-size: 16px;
	color: #7a7a7a;
	
}

header nav ul li a span {
	position: absolute;
	left: 0;
    right: 0;
	height: 35px;
	text-align: center;/**/	
}

header nav ul li a span.out {
	top: 0;
}

header nav ul li a span.over {
	top: 0px;
    color: #B11114;
}

header nav ul li a i {
	display: block;
	font-size: 12px;
	font-style: normal;
	color: #000;
}

header nav ul.pc li:last-child {
	margin: 0;
}


/* +content
*----------------------------------------------------------------------------*/
#content {
	position: relative;
}





/* +footer
*----------------------------------------------------------------------------*/
footer {
	background-color: #666666;
}


footer .company-info ,
footer .quick-menu {
	margin: 40px 3% 0 0;
	width: 31.33%;
	float: left;
}

footer .company-info #footer-cis {
	margin-bottom: 30px;
}

footer .company-info #qr-code {
	margin-right: 10px;
	width: 33%;
	float: left;
}

footer .company-info .company-data {
	color: #fff;
}

footer .company-info .company-data p {
	margin-bottom: 5px;
	font-size: 12px;
}

footer .company-info .company-data p strong {
	font-size: 16px;
}

footer .company-info .company-data p a {
	color: #fff;
}

/**
*
* =quick-menu
*
**/
footer .quick-menu ul {
	overflow: hidden;
}

footer .quick-menu ul li {
	line-height: 35px;
	font-size: 16px;
	color: #fff;
}

footer .quick-menu ul li a {
	color: #fff;
}

/**
*
* =fb-wrap
*
**/
footer #fb-wrap {
	margin: 40px 0;
	width: 31.33%;
	float: right;
}

/**
*
* =seo-site
*
**/
footer .seo-site {
	padding: 15px 0;
	background: #fff;
	overflow: hidden;
}

footer .seo-site .info ,
footer .seo-site #webSeo {
	margin: 0 auto;
	width: 1160px;
}

footer .seo-site .info {
	text-align: right;

}

footer .seo-site #webSeo {
	margin-bottom: 10PX;
	overflow: hidden;
	font-size: 12px;
}


/* +width:1024 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
	header #top-bar .bar-right {
		width: 960px;
	}
	
	header nav ul.pc li:first-child a ,
	header nav ul.pc li:nth-child(4n) a {
		width: 80px;
	}
	
	header nav ul.pc li:last-child a {
		width: 75px;
	}
}

/*-----------------------------------------------------------------------------------------------*/


#content .contact-info {
	margin-bottom: 20px;
	line-height: 170%;
	font-size: 16px;
}
#content .contact-img {

}

#content .contact-img img{
	/*position: absolute;
	left: 50%;*/
	width: 49%;
}

#content .contact-form {
	overflow: hidden;
}

#content .contact-form fieldset {
	margin: 0;
	padding: 0;
	border: 0;
	overflow: hidden;
}

#content .contact-form fieldset p {
	margin-bottom: 25px;
	color: #2F2F2F;
}

#content .contact-form fieldset p label {
	margin-bottom: 5px;
	width: 100%;
	display: block;
	font-size: 15px;
}

#content .contact-form fieldset p label strong {
	margin-right: 5px;
	display: inline-block;
	color: #EB1C1F;
}

#content .contact-form fieldset p input ,
#content .contact-form fieldset p select ,
#content .contact-form fieldset p textarea {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 5px;
    width: 100%;
    height: 35px;
    line-height: 35px;
    border: 1px solid #D5D5D5;
}

#content .contact-form fieldset p textarea {
	height: 100px;
}

#content .contact-form fieldset p.col-2 {
	margin-right: 2%;
	width: 100%;
	float: left;
}

#content .contact-form fieldset p.col-3 {
	width: 100%;
	float: left;
}

#content .contact-form fieldset.btn {
	overflow: hidden;
}

#content .contact-form fieldset.btn p {
	margin-right: 15px;
	float: left;
}

#content .contact-form fieldset.btn p label {
	width: auto;
	display: inline-block;
}

#content .contact-form fieldset.btn p input {
	width: 70px;
}



#content .contact-form fieldset.btn p.send {
	width: 200px;
}

#content .contact-form fieldset.btn p.send input {
	background: #604b3e;
	display: inline-block;
    padding: 7px 15px;
    font-family: "微軟正黑體", "新細明體", sans-serif;
	line-height: 21px;
	text-align: center;
    font-size: 14px;
    color: #FFF;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
	border: 0;
}

#content .contact-form fieldset.btn p.send input:hover {
	background: #ee901f;
}

/* +width:768 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	header section {
		height: 65px;
		position: relative;
		overflow: visible;
	}
	
	header #top-bar .bar-right {
		/*margin: 0 15px;*/
		margin-left: 15px;
		width: auto;
	}
	

	header .nav-func {
		display: block;
		margin: 0 auto;
		position: relative;
		float:left;
		color:#FFF;
		line-height: 40px;
	}
	
	header nav.menu {
		margin: 0;
		min-width: 400px;
		max-width: 100%;
		height: auto;
		background: #fff;
		border: 1px #cdcdcd solid;
		position:fixed;

		right: 0;
		z-index: 900;
		min-width: 100%;
		top: 50px;
	}

	
	header nav.menu ul li {
		padding: 15px;
		border-bottom: 1px #cdcdcd solid;
		float: none;
	}
	
	header nav.menu ul li a {
		display: block;
		font-size: 16px;
	}
	
	header nav ul li a span {
		position: relative;
	}
	
	header nav ul li a i {
		margin-right: 10px;
		display: inline-block;
	}
	
	header nav.menu ul li a:hover i {
		color: #8c0000;
	}
	
	header nav ul li a span.over {
		display: none;
	}
	
	footer .company-info, 
	footer .quick-menu {
		margin: 40px 0 0;
		width: 100%; 
	}	
	
	footer #fb-wrap {
		margin: 40px 0;
		width: 100%;
	}
}


/* +width:440 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 440px) {
	header #top-bar .bar-right {
		display:block;
	}
	
	header section {
		height: auto;
	}
	
	header #cis {
		width: 100%;
		float: none;
		display: none;
	}
	
	header #cis h2 {
		text-align: center;
	}
	

	#TopBox .Tno {
		display:none;
	}


}


/* +width:320 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 320px) {
	header section {
		height: 130px;
	}
	
	header #cis {
		width: 100%;
		float: none;
	}
	
	header #cis h2 {
		text-align: center;
	}
	
	header .nav-func {
		margin: 0 auto;
		position: relative;
	}
	
	
	
	header nav.menu {
		width: 100%;
		min-width: 100%;
		top: 120px;
	}
	
	footer .company-info #footer-cis img {
		width: 100%;
	}
}
/***************top************************/
#gotop {
	display: none;
	position: fixed;
	right: 20px;
	bottom: 20px;
	padding: 27px 27px;
	border-radius: 50%;
	cursor: pointer;
	z-index:9999;
	background-image: url(images/gotop.png);
	background-repeat: no-repeat;
}
/***************************************/