/*-----------------------------------------------------------------------------
 [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: #274385;
	font-size: 14px;
	line-height:170%;
	background:#f9f8f4;
	position:relative;
}
div, h1, h2, h3, h4, hr, p, form, label, input, textarea, img, span {
	text-align: left;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	word-wrap: normal;
	word-break: normal;
	border-width:0;
	font-family: "微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";
	transition:all linear 0.5s;
	-moz-transition:all linear 0.5s;
	-ms-transition:all linear 0.5s;
	-o-transition:all linear 0.5s;
	-webkit-transition:all linear 0.5s;
}
h1{
	opacity:0;
	position:fixed;
	z-index:-1111;
}
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;
}
img{
	max-width:100%;
}
/**
*
* =jumpDiv
*
**/
/* + 跳一  跳三
*----------------------------------------------------------------------------*/
#jumpDiv ,
#jumpIframe {
	position: relative;
	background: #fff;
	top: 0;
	left: 0;
	z-index: 9999999999999999999999;
}

@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');
}
.wrapper{
	width: 100%;
	background: #f9f8f4;
	top: 0;
}
section{
	margin:0 auto;
	overflow:hidden;
}
.secs{
	width:1047px;
}
.secm{
	width:1180px;
}
.secl{
	width:1446px;
}
header{
    min-height: 81px;
	padding: 40px 0;
}
header #top-nav{
	width: 10%;
    position: fixed;
    right: 0;
    top: 50px;
	z-index: 9999;
}
header .headbar{
	float:left;
	width:87%;
}
header #cis,
.headbarbg #cis2{
	float: left;
    margin-left: 70px;
	text-align: right;
}
header #cis img,
.headbarbg #cis2 img{
	height:81px;
    width: 331px;
}
header .menu,
.headbarbg .menu2{
	float: right;
	margin-top: 25px;
	width: calc(100% - 401px);
}
header .menu ul,
.headbarbg .menu2 ul{
	text-align:right;
	overflow:visible;
}
header .menu >ul >li,
.headbarbg .menu2 >ul >li{
	display:inline-block;
	position:relative;
	padding-left: 60px;
	font-family: "cwTeXHei","微軟正黑體";
}
header .menu >ul >li:after,
header .menu >ul >li:before,
.headbarbg .menu2 >ul >li:after,
.headbarbg .menu2 >ul >li:before{
	content:'';
	position:absolute;
	width:0;
	height:2px;
	background:#f9f8f4;
	transition:all ease-in-out 0.2s;
}
header .menu >ul >li:after,
.headbarbg .menu2 >ul >li:after{
	left:20px;
	top:5px;
	height:3px;
}
header .menu >ul >li:before,
.headbarbg .menu2 >ul >li:before{
	left:20px;
	top:8px;
	transition:all ease-in-out 0.8s;
}
header .menu >ul >li a,
.headbarbg .menu2 >ul >li a{
	color:#080404;
	font-size:16px;
}
header .menu >ul >li a span,
.headbarbg .menu2 >ul >li a span{
	display:block;
	transition:none;
	font-size: 12px;
}
header .menu >ul >li:hover:after,
header .menu >ul >li:hover:before,
.headbarbg .menu2 >ul >li:hover:after,
.headbarbg .menu2 >ul >li:hover:before{
	background:#e60012;
	width:35px;
}
header .menu >ul >li:hover a,
.headbarbg .menu2 >ul >li:hover a{
	color:#e60012;
}
#top-nav a{
	display: block;
    font-size: 14px;
    color: #313131;
    width: 50px;
	margin-bottom: 35px;
	margin-left:70px;
}
#top-nav a.nav-func,
#top-nav #nav-function{
	display:none;
}
#top-nav a i{
	display: block;
    background: #000;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height: 50px;
    font-size: 30px;
	border:1px solid #313131;
	transition:all ease-in-out 0.3s;
}

#top-nav a span{
    display: block;
    -webkit-writing-mode: vertical-lr;
    writing-mode: vertical-lr;
    line-height: 50px;	
	padding-top: 23px;
	position:relative;
}
#top-nav a span:before{
	position:absolute;
	content:'';
	width:1px;
	height:17px;
	top:0;
	left:49%;
	background:#313131;
}
#top-nav a:hover i{
    background: #fff;
}
#top-nav a:hover i{
    color: #313131;
}
header.headerTop .headbar{
	position:fixed;
	top:0;
	left:0;
	z-index: 99;
	display: none;
}
header.headerTop #top-nav #nav-function{
	display:block;
}
#headbarbg{
	display:none;
	opacity:0;
	height: 0px;
	position:fixed;
	left:0;
	top:0;
	width: 87%;
	z-index: -1;
    background: rgba(36, 36, 36, 0.74);
    padding: 40px 13% 40px 0;
    transition: inherit;
}
header.headerTop #top-nav{
	top: 17px;	
}
header.headerTop #top-nav a {
    margin-bottom: 10px;
	width: 40px;
    height: 40px;
}
header.headerTop #top-nav a i{
	width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
}
header.headerTop #top-nav a span{
    height: 0;
    overflow: hidden;
    padding: 0;
}
header.headerTop #top-nav a span:before{
	display:none;
}
#headbarbg.headbarbg{
	min-height: 95px;
	opacity:1;
    z-index: 99;
	overflow: visible !important;
}
.headbarbg h2{
    -webkit-filter: drop-shadow(0px 0px 1px white);	
}
#headbarbg .menu2 {
	transition:none;
}
.headbarbg .menu2 >ul >li:after,
.headbarbg .menu2 >ul >li:before,
.headbarbg .menu2 >ul >li:hover:after,
.headbarbg .menu2 >ul >li:hover:before{
	background:#fff;
}
.headbarbg .menu2 >ul >li a,
.headbarbg .menu2 >ul >li:hover a{
	color:#fff;
}
header .menu ul .subnav,
.headbarbg .menu2 ul .subnav{
	display:none;
}
header .menu >ul >li:hover .subnav,
.headbarbg .menu2 >ul >li:hover .subnav{
	display: block;
    position: absolute;
    z-index: 1;
    width: 150px;
    left: 20px;
    top: 100%;
    background: rgba(45, 45, 45, 0.85);
}
header .menu >ul >li .subnav >a,
.headbarbg .menu2 >ul >li .subnav >a{
	color: #fff;
}

header .menu >ul >li .subnav >li,
.headbarbg .menu2 >ul >li .subnav >li{
    padding: 0;
	text-align:left;
}
header .menu >ul >li .subnav >li a,
header .menu >ul >li .subnav >li >p,
header .menu2 >ul >li .subnav >li a,
header .menu2 >ul >li .subnav >li >p{
	color: #fff;
	padding: 5px 20px;
    display: block;
	font-size: 16px;
}
header .menu >ul >li .subnav .subOption,
header .menu2 >ul >li .subnav .subOption{
	text-align: left;
}
header .menu >ul >li .subnav .subOption a,
header .menu2 >ul >li .subnav .subOption a{
	padding: 5px 30px;
	background: rgba(0, 0, 0, 0.19);
}
footer{
	background:#1d1d1d;
	color:#fff;
	padding: 50px 0 30px;
}
footer #footer-all{
	overflow:hidden;
	margin-bottom: 20px;
}
footer #footer-all a{
	color:#fff;
}
footer #footer-all #footer-map{
	float:left;
	width:50%;
}
footer #footer-all #footer-map iframe{
	width:80%;
	min-height: 400px;
}
footer #footer-all #footer-detail{
	float:right;
	width:50%;
	overflow:hidden;
}
footer #footer-all #footer-detail .right{
	float:right;
	width:45%;
}
footer #footer-all #footer-detail .left{
	float:left;
	width:54%;
}
footer #footer-all #footer-detail .left .title{
	font-size: 30px;
    line-height: 120%;
    font-weight: bold;
	position:relative;
	padding-top: 8px;
}
footer #footer-all #footer-detail .left .title:before{
	content:'';
	background:#fff;
	width:38px;
	height:4px;
	position:absolute;
	top:0;
	left:0;
}
footer #footer-all #footer-detail .left .title h2{
	font-size:18px;
	font-weight: normal;
}
footer #footer-all #footer-detail .left .footer-detail-info{
	margin-top: 20px;
}
footer #footer-all #footer-detail .left .footer-detail-info p{
	margin:5px 0;
}
#footer-qrcode {
	margin:20px 0;
}
#footer-qrcode img{
	width:165px;
}
footer #community{
	margin-bottom: 20px;
}
footer #community p{
	font-size:20px;
	font-weight:bold;
	margin-bottom: 10px;
}
footer #community a{
	display:inline-block;
	width:27px;
	height:27px;
	line-height:27px;
	text-align:center;
	background:#26a6d1;
	border-radius:50%;
	font-size:14px;
	margin-right:5px;
}
footer #community a:nth-child(2){
	background:#3b5998;
}
footer #community a:nth-child(3){
	background:#dd4c3a;
}
footer #community a:nth-child(4){
	background:#f4b459;
}
.phoneWrap{
	display:none;
}
#gotop{
	background: #1d1d1d;
    color: #fff;
    float: right;
    width: 80px;
    height: 40px;
    display: block;
    border-top-right-radius: 40px;
    border-top-left-radius: 40px;
    text-align: center;
    font-size: 38px;
    line-height: 40px;
}
#webSeo,
#webSeo div{
	transition:none;
}
@media screen and (max-width: 1680px) {
	header .menu >ul >li, .headbarbg .menu2 >ul >li{
		padding-left: 40px;
	}
	header .menu >ul >li:hover:after,
	header .menu >ul >li:hover:before,
	.headbarbg .menu2 >ul >li:hover:after,
	.headbarbg .menu2 >ul >li:hover:before{
		width: 20px;
	}
	header #cis img, .headbarbg #cis2 img{
		height: 70px;
		width: 286px;
	}
	header .menu, .headbarbg .menu2{
		margin-top: 10px;
		width: calc(100% - 356px);	
	}
	header .menu >ul >li:before, .headbarbg .menu2 >ul >li:before,
	header .menu >ul >li:after, .headbarbg .menu2 >ul >li:after{
		left: 10px;	
	}
}
@media screen and (max-width: 1440px) {
	header #cis,
	.headbarbg #cis2,
	header .menu,
	.headbarbg .menu2,
	header .menu ul,
	.headbarbg .menu2 ul{
		text-align: center;
	}
	.secl{
		width:1180px;
	}
	header #cis img, .headbarbg #cis2 img{
	    height: 60px;
		width: 245px;	
	}
	header .menu, .headbarbg .menu2{
		width: calc(100% - 315px);	
	}
}
@media screen and (max-width: 1366px) {
	header .headbar{
	    width: 90%;	
	}
	#headbarbg{
		width: 90%;
		padding: 20px 10% 10px 0;
	}
	header.headerTop #top-nav a{
		margin-bottom: 5px;		
	}
	header.headerTop #top-nav{
		top: 2px;
		right: 0;
	}
	header.headerTop #top-nav a i,
	header.headerTop #top-nav a{
	    width: 30px;
		height: 30px;
		line-height: 30px;
		font-size: 20px;	
	}
	#headbarbg.headbarbg{
		min-height: 75px;	
	}
}
@media screen and (max-width: 1280px) {
	.secs,
	.secm,
	.secl,
	header .headbar{
		width:90%;
	}
	footer #footer-all #footer-map{
		width:40%;
	}
	footer #footer-all #footer-detail{
		width:60%;
	}
	header .menu >ul >li, .headbarbg .menu2 >ul >li{
		margin-left: 0;
		padding-left: 40px;
	}
	header #top-nav{
		width:10%;
	}
	#headbarbg.headbarbg{
		padding-left: 0;
		width: 90%;
		height: auto;
	}
	#headbarbg.headbarbg #cis2 h2{
		text-align: center;
	}
	header .menu ul, .headbarbg .menu2 ul{
	    margin-right: 0;	
	}
	header .menu, .headbarbg .menu2{
		margin: 25px 0;
		width: calc(100% - 70px);
	}
	header{
	    padding: 30px 0;	
	}
	header #cis, .headbarbg #cis2{
	    width: calc(100% - 70px);	
	}
	#top-nav a{
		margin-left: 40px;
	    width: 45px;
	}
	#top-nav a i{
	    width: 45px;
		height: 45px;	
		line-height: 45px;	
	}
	header.headerTop #top-nav a{
		margin-bottom: 5px;	
	}
	header.headerTop #top-nav{
		top:12px;
	}
}
@media screen and (min-width: 980px) {
	header .menu, .headbarbg .menu2{
		display:block !important;
	}
}
@media screen and (max-width: 980px) {
	footer #footer-all #footer-map,
	footer #footer-all #footer-detail,
	header .headbar{
		width:100%;
	}
	footer #footer-all #footer-detail{
		margin-top:30px;
	}
	footer #footer-all #footer-map iframe{
		width:100%;
		min-height: 250px;
	}
	header, #headbarbg.headbarbg,
	#headbarbg{
		padding:20px 0;
		min-height: 0;
		overflow: hidden;
	}
	#top-nav a.nav-func{
		display:block;
	}
	header #top-nav,
	header.headerTop #top-nav{
		width: auto;	
		text-align: right;	
		top: 28px;
		right:5%;
	}
	header .menu, .headbarbg .menu2{
		display:none;
	}
	#top-nav a,
	#top-nav a.nav-func{
		display:inline-block;
		margin: 0 2px;
		width:40px;
		height:40px;
		line-height:40px;
	}
	#top-nav a i{
		width:40px;
		height:40px;
		line-height:40px;
		font-size: 24px;
	}
	#top-nav a i.fa-times{
		background: #000;
		border: 1px solid #fff;	
		color:#fff;
	}
	#top-nav a span,
	header.headerTop #top-nav #nav-function{
		display:none;
	}
	header .menu{
		position: fixed;
		left: 0;
		width: 100%;
		top: 0;
		padding: 110px 0 60px;
		margin-top: 0;
		background: rgba(0,0,0,0.85);
		z-index: 99;
		height: calc(100vh - 170px);
	}
	header .menu >ul{
		text-align: left;
		overflow: auto;
		max-height: 100%;	
	}
	header .menu >ul >li{
	    display: block;
		padding: 10px 0;	
	}
	header .menu >ul >li >a{
		color: #fff;
		margin: 5px 0 5px 40px;
	}
	header .menu >ul >li a span{
	    display: inline-block;	
		margin-left: 10px;
	}
	header.headerTop .headbar{
		display: block;
		overflow: visible;
		padding: 20px 0;
		background: rgba(0, 0, 0, 0.89);
	}
	header .headbar #cis{
		-webkit-filter: drop-shadow(0px 0px 1px white);
		text-align: left;
	}
	header .menu >ul >li .subnav, 
	.headbarbg .menu2 >ul >li .subnav,
	header .menu >ul >li:hover .subnav, 
	.headbarbg .menu2 >ul >li:hover .subnav{
		position: inherit;
		width: 100%;
		left: 0;
		top: 0;	
		margin: 10px 0 0;	
		display: none;
		background: rgba(45, 45, 45, 0.85);
	}
	header .menu >ul >li a, .headbarbg .menu2 >ul >li a,
	header .menu >ul >li:hover a, .headbarbg .menu2 >ul >li:hover a{
		color:#fff;
	}
	header .menu >ul >li:hover:after, header .menu >ul >li:hover:before, .headbarbg .menu2 >ul >li:hover:after, .headbarbg .menu2 >ul >li:hover:before{
		display:none;
	}
	header .menu >ul >li .subnav >li a, header .menu >ul >li .subnav >li >p, header .menu2 >ul >li .subnav >li a, header .menu2 >ul >li .subnav >li >p{
	    padding: 5px 60px	
	}
	header .menu >ul >li .subnav .subOption a, header .menu2 >ul >li .subnav .subOption a{
	    padding: 5px 80px;	
	}
}
@media screen and (max-width: 640px) {
	footer #footer-all #footer-detail .left,
	footer #footer-all #footer-detail .right{
		width:100%;
	}
	footer #footer-all #footer-detail .right{
		margin-top:30px;
	}
	footer #footer-all #footer-detail .left .title p,
	footer #footer-all #footer-detail .left .title h2,
	footer #footer-all #footer-detail .left .footer-detail-info p,
	#footer-cis,
	#footer-qrcode,
	footer #community p,
	footer #community,
	footer .copy,
	footer .info{
		text-align:center;
	}
	footer #footer-all #footer-detail .left .title:before{
		display:none;
	}
	.phoneWrap{
		display:block;
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
		z-index: 9;
	}
	.phoneWrap ul li{
		float: left;
		width: 50%;
		background: rgba(25,25,25,0.7);
		text-align: center;
		padding: 3px 0;
	}
	.phoneWrap ul li a{
		color:#fff;
	}
	header #cis img, .headbarbg #cis2 img{
	    height: 50px;
		width: 204px;	
	}
	header #cis, .headbarbg #cis2{
		margin-left: 20px;	
		width: 204px;
	}
	header #top-nav, header.headerTop #top-nav{
	    top: 23px;	
		right: 20px;
	}
	header .menu{
		padding: 90px 0 60px;
		height: calc(100vh - 150px);
	}
}
@media screen and (max-width: 480px) {
	header #cis img, .headbarbg #cis2 img{
	    height: 40px;
		width: 163px;	
	}
	header #cis, .headbarbg #cis2{
		margin-left: 20px;	
		width: 163px;	
	}
	header #top-nav, header.headerTop #top-nav{
	    top: 23px;	
		right: 10px;
	}
	#top-nav a i,
	#top-nav a, #top-nav a.nav-func,
	header.headerTop #top-nav a i,
	header.headerTop #top-nav a{
	    width: 30px;
		height: 30px;
		line-height: 30px;
		font-size: 20px;	
	}
	header .menu {
		padding: 85px 0 60px;
		height: calc(100vh - 145px);
	}
}