/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +common
        =anchor
        =clear,clearfix
        =banner
    +header
        =cis
        =site-func
        =share-func
        =nav
    +content
        +content-main
        +content-sidebar
    +footer
        =footer-link
/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +common
        =anchor
        =clear,clearfix
        =banner
    +header
        =cis
        =site-func
        =share-func
        =nav
    +content
        +content-main
        +content-sidebar
    +footer
        =footer-link
        =company-info
-----------------------------------------------------------------------------*/

/* +common
*----------------------------------------------------------------------------*/
body {
	margin:0;
	border:0;
	width:100%;
	color: #454545;
	font-size: 14px;
	line-height:170%;
}
div, h1, h2, h3, h4, hr, p, form, label, input, textarea, img, span, b, strong {
	text-align: left;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	word-wrap: normal;
	word-break: normal;
	border-width:0;
	font-family: 'cwTeXHei',"微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";
	font-weight:normal;
}
hr {
	noshade:noshade;
}
th {
	font-weight: normal;
}
ul {
	list-style: none;
	margin: 0;
	padding: 0;
    overflow:hidden;
}
li{
	list-style: none;
}
a ,
a:hover{
	text-decoration: none;
	cursor: pointer;
	outline:none;
    color: #0d5db2;
}
img{
	max-width:100%;
}
@font-face {
  font-family: 'cwTeXHei';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot);
  src: url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff) format('woff'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.ttf) format('truetype');
}
br {
	font-family: Arial !important;
}
/**
*
* =jumpDiv
*
**/
/* + 跳一  跳三
*----------------------------------------------------------------------------*/
#jumpDiv ,
#jumpIframe {
	position: relative;
	background: #fff;
	top: 0;
	left: 0;
	z-index: 9999999999999999999999;
}
section{
	width:1200px;
	margin:0 auto;
	overflow:hidden;
}
header{
    font-family: 'cwTeXHei';
}
header .headtop{
	padding: 10px 0;
	background:#35a581;
	color:#fff;
}
header .headtop p a{
	color: #fff;
    font-size: 30px;
    line-height: 110%;
    vertical-align: inherit;
	font-weight: bold;
	margin-left: 10px;
}
#top-nav{
	float:left;
	vertical-align: -webkit-baseline-middle;
}
#top-nav a{
	font-size: 20px;
    margin-right: 10px;
	color:#fff;
	vertical-align: -webkit-baseline-middle;
}
#top-phone{
	float:right;
	font-size:22px;
}
#top-phone p{
	
}
#top-phone p i{
	margin-right:5px;
	font-size: 26px;
    vertical-align: inherit;
}
#top-phone p b{
	color: #ffe034;
    font-size: 20px;
    margin: 0 5px;
}
#headmain{
	background-image:url(/images/26/header-bg.png);
	background-repeat:no-repeat;
	background-position:0 50%;
	position:relative;
	overflow:hidden;
	z-index: 1;
    box-shadow: 0 2px 20px #858585;
}
#headmain:after{
	position:absolute;
	content:'';
	background:#fff;
	width:65%;
	height:200%;
	transform:skewX(-50deg);
	right:0;
	top:0;
	z-index:-1;
}
#headmain #cis{
	float:left;
	width:30%;
	padding: 15px 0;
}
#headmain .topbutton{
	float:right;
	width:70%;
	text-align:right;
	padding: 10px 0 5px;
}
#headmain .topbutton a{
	color:#6e6e6e;
	font-size:14px;
	line-height:14px;
    padding: 0 10px;
}
#headmain .topbutton a#translateLink{
	border-right:1px solid #6e6e6e;
}
nav{
	float:right;
	width:70%;
}
nav ul{
	text-align:right;
}
nav li{
	display:inline-block;
	position:relative;
	padding: 0 25px;
}
nav li a{
	display:block;
	color:#525252;
	font-size:18px;
	text-align:center;
}
nav li a span{
	display:block;
	text-align:center;
	color:#737474;
	font-size:14px;
}
nav li a:hover{
	color:#096cd4;
}
nav li a:hover span{
	color:#fabe03;
}
nav li:after{
	content:'/';
	color:#b7b7b7;
	position:absolute;
	right:0;
    top: 2px;
}
nav li:last-child:after{
	display:none;
}
.nav-func,
.phoneWrap{
	display:none;
}
#gotop{
	background: rgb(53,164,130); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(53,164,130,1) 0%, rgba(41,150,154,1) 43%, rgba(32,139,172,1) 60%, rgba(12,114,213,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(53,164,130,1) 0%,rgba(41,150,154,1) 43%,rgba(32,139,172,1) 60%,rgba(12,114,213,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(53,164,130,1) 0%,rgba(41,150,154,1) 43%,rgba(32,139,172,1) 60%,rgba(12,114,213,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#35a482', endColorstr='#0c72d5',GradientType=0 ); /* IE6-9 */
	display: block;
    width: 102px;
    height: 102px;
    line-height: 102px;
    text-align: center;
    border-radius: 50%;
    margin: -51px auto;
    position: relative;
	box-shadow: 0 0 10px #575757;
	z-index:1;
}
#gotop:after{
	content:url(/images/26/gotop-s.png);
	position:absolute;
	top: 15%;
    left: 46%;
	animation-name:top;
	animation-duration:0.5s;
	animation-iteration-count:infinite;
	animation-direction:alternate;
	opacity:1;
}
@keyframes top{
	0%{
		top: 14%;
		opacity:1;
	}
	100%{
		top: 16%;
		opacity:0.5;
	}
}
.footer-info{
	background: rgb(0,124,196); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,124,196,1) 0%, rgba(0,101,179,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,124,196,1) 0%,rgba(0,101,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,124,196,1) 0%,rgba(0,101,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007cc4', endColorstr='#0065b3',GradientType=0 ); /* IE6-9 */
	padding:40px 0 5px;
}
.footer-info #footer-cis{
	float:left;
	width: 30%;
}
.footer-info .facebookicon{
	float:left;
	margin: 5px 20px 0;
}
.footer-info .company{
	float:right;
	text-align: right;
	width: 50%;
}
.footer-info .company p{
	color:#fff;
	display:inline-block;
	text-align:right;
	border-left:1px solid #fff;
	padding-left:10px;
	line-height: 100%;
	margin-left: 10px;
}
.footer-info .company p a{
	color:#fff;
}
.footer-info .company p:nth-child(2){
	border:none;
}
.footer-info .company p.only{
	display:block;
	border:none;
}
.footer-info .company .freetxt p{
	font-size:12px;
	line-height:100%;
	border:none;
}
#webSeo{
   margin-top : 20px;
   font-size: 12px;
   color: #fff;
}
.freetxt{
	text-align:right;
}
.footer-right{
	background:#2c2c2c;
	color:#fff;
	text-align: center;
    padding: 10px 0;
}
.footer-right .copy,
.footer-right .info{
	display:inline-block;
	text-align:center;
}
.footer-right a{
	color:#fff;
}
.footer-btn {
    display: inline-block;
    padding: 12px 24px;
    background-color: #FFA500;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
	margin-bottom: 15px;
}

.footer-btn:hover {
	color: #ffffff;
    background-color: #FF8C00;
    transform: translateY(-2px);
}

.footer-btn:active {
	color: #ffffff;
    background-color: #FF7F50;
    transform: translateY(0);
}

@media screen and (max-width: 1366px) {
	section{
		width:80%;
	}
	nav li a span{
		font-size: 12px;
	}
	#headmain section{
		width:90%;
	}
	header .headtop p a{
		font-size:22px;
	}
	#top-phone,
	#top-nav a{
		font-size:18px;
	}
	#top-phone p b{
		font-size:16px;
	}
	.footer-info{
		padding:60px 0;
	}
	.footer-info .company{
	    width: 45%;	
	}
}
@media screen and (max-width: 1280px) {
	nav li a{
		font-size: 16px;
	}
	#headmain #cis{
		width:20%;
		padding: 25px 0;
	}
	#headmain .topbutton,
	nav{
		width:80%;
	}
	#headmain:after{
		width:75%;
	}
	.footer-info .company{
	    width: 100%;
		text-align: center;
		margin-top: 20px;
	}
	.footer-info .company p.only,
	.footer-info .company .freetxt p{
		text-align:center;
		padding-left: 0;
		margin-left: 0;
	}
	.footer-info .company .freetxt p br{
		display:none;
	}
	.footer-info #footer-cis,
	.footer-info .facebookicon{
		float: none;
		margin: 10px auto;
		text-align: center;
	}
}
@media screen and (max-width: 980px) {
	section{
		width:90%;
	}
	#headmain #cis{
		padding: 10px 0;
		width: 145px;
	}
	#headmain .topbutton{
		width: auto;
		padding: 17px 0 0;
	}
	#headmain:after{
		width:65%;
	}
	.nav-func{
		display: block;
		right: 10px;
		top: 18px;
		z-index: 999999;
		color: #474748;
		position: absolute;
		font-size: 20px;	
	}
	nav{
		position: absolute;
		width: 100%;
		background: rgba(255, 255, 255, 0.95);
		top: 56px;
		left: 0;
		z-index: 999;
	}
	#headmain section,
	#headmain{
		overflow:visible;
		height: 56px;
	}
	#headmain:after{
		height: 100%;	
		right: -10%;
	}
	.wrapper{
		overflow-x: hidden;	
	}
	#top-phone, #top-nav a,
	#top-phone p b{
	    font-size: 14px;	
	}
	#top-phone p i{
		font-size:20px;
	}
	header .headtop{
		padding: 0;		
	}
	nav li{
	    display: block;
		padding: 20px 25px;	
	}
	nav li:after{
		display:none;
	}
	nav li a span{
		display:inline-block;
		margin-left: 15px;
	}
	nav li:hover{
		background: rgba(13, 105, 202, 0.12);	
	}
	nav li a{
		text-align:left;
		padding: 0 25px;
	}
}
@media screen and (max-width: 640px) {
	#headmain:after{
		width:50%;
	}
	.footer-info .company p{
		display: block;
		text-align: center;
		border-left: none;
		padding-left: 0;
		margin-left: 0;	
		margin:5px 0;
	}
	.phoneWrap{
		display:block;
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
		z-index: 999;
	}
	.phoneWrap ul li{
		float: left;
		width: 50%;
		background: rgba(25,25,25,0.9);
		text-align: center;
		padding: 3px 0;
	}
	.phoneWrap ul li a{
		color:#fff;
	}
	#top-phone{
		display:none;
	}
}
@media screen and (max-width: 480px) {
	#headmain:after{
		width:55%;
	}
	#headmain .topbutton{
		padding: 17px 8px 0 0;	
	}
	#top-nav a{
	    margin-right: 3px;	
	}
	header .headtop p a{
		font-size:16px;
	}
	#top-phone p i{
		display:none;
	}
	#top-nav a{
		vertical-align: text-top;	
	}
	#top-phone p{
		vertical-align: inherit;
		line-height: 100%;	
		margin-top: 5px;
	}
}
@media screen and (max-width: 340px) {
	#headmain #cis{
		width:110px;
		margin-top:3px;
	}
	#headmain:after{
		width: 58%;
	}
}
