/*-----------------------------------------------------------------------------

 [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, body a {

	margin:0;

	border:0;

	width:100%;

	color: #000;

	font-size: 14px;

	line-height:170%;

}

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;

}

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;

}

img{

	max-width:100%;

}

section{

	width:1160px;

	margin:0 auto;

	overflow:hidden;

}

header{

	position: absolute;

	width: 100%;

	background: rgb(75,170,193); /* Old browsers */

	background: -moz-linear-gradient(10deg,  rgba(75,170,193,1) 0%, rgba(91,176,180,1) 25%, rgba(125,191,150,1) 60%, rgba(176,212,107,1) 100%); /* FF3.6-15 */

	background: -webkit-linear-gradient(10deg,  rgba(75,170,193,1) 0%,rgba(91,176,180,1) 25%,rgba(125,191,150,1) 60%,rgba(176,212,107,1) 100%); /* Chrome10-25,Safari5.1-6 */

	background: linear-gradient(50deg,  #d94371 0%,#b55fa6 50%, #958be1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4baac1', endColorstr='#b0d46b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	color:#fff;

	top: 0;

	z-index: 999;

}

header a{

	color:#fff;

}

header section{

	position:relative;

	padding: 25px 0 0;

}

#top-nav{

    position: absolute;

    right: 0;

    top: 10px;

}

#top-nav ul{

}

#top-nav ul li{

	display: inline-block;

	margin-left: 15px;

}

#top-nav ul li a {

	font-size: 14px;

	margin-right: 5px;

	background: #fff;

	color: #9b91ea;

	padding: 5px 16px;

	display: inline-block;

}

#top-nav ul li a:hover{background: rgb(255 255 255 / 0.85);}

#cis{

	float: left;

	width: 25%;

}

.nav-func{

	display:none;

}

#main-menu{

	float: right;

	overflow:hidden;

	margin-top: 15px;

	width: 71%;

}

#main-menu li{

	float: left;

	padding: 20px 15px;

	position:relative;

}

#main-menu li a{

	font-size:16px;

	display:block;

	z-index: 2;

    position: relative;

	margin-left: 9px;

}

#main-menu li:hover a:before{

	display: block;

	content: '';

	width: 100%;

	height: 2px;

	background: #fff;

	position: absolute;

	bottom: -20px;

	left: 0;

	z-index: 1;

}

#main-menu li span{

	display:none;

}

#main-menu li.last{

	margin-right: 20px;

}

footer{

	margin-top: 20px;

	background: linear-gradient(50deg,  #d94371 0%,#b55fa6 50%, #958be1 100%);

	padding-top: 20px;

}

footer section >div{

	overflow:hidden;

	margin-bottom: 20px;

}

footer section .one{

}

footer section .one #footer-cis{

	text-align:center;

}

footer section .one #community{

	overflow:hidden;

	text-align:center;

	margin-top: 20px;

}

footer section .one #community a{

	display:inline-block;

	color:#fff;

	font-size:14px;

	background:#26a6d1;

	border-radius:50%;

	width:26px;

	height:26px;

	line-height:26px;

	text-align:center;

	margin:0 2px;

}

footer section .one #community a:nth-child(2){

	background:#3b5998;

}

footer section .one #community a:nth-child(3){

	background:#dd4b39;

}

footer section .one #community a:nth-child(4){

	background:#f4b459;

}



footer section .two .border{

	border-right:1px solid #e5e5e5;

	border-left:1px solid #e5e5e5;

	padding: 0 20px;

}

footer section .two .border p{

	font-size:12px;

	color:#212121;

}

footer section .two .border p a{

	color:#6d6adf;

}

footer section .three ul{

	text-align:center;

}

footer section .three li{

	display:inline-block;

	margin: 0 10px;

}

footer section .three li a{

	color: #fff;

	font-size: 14px;

}

footer section .four{padding-top: 20px;border-top: 1px solid rgb(255 255 255 / 19%);}

footer section .four .leftborder{

	overflow: hidden;

	text-align: center;

}

footer section .four .leftborder p{

    display: inline-block;

    margin: 0 10px;

    -webkit-filter: grayscale(1);

}

footer section .four .leftborder >div{

	float:right;

	margin-left: 7px;

}

#cellphone{

    display: none;

}

#cellphone li{

	margin-top: 15px;

}

footer .footer2{

	border-top: 1px solid rgb(255 255 255 / 19%);

	padding: 15px 0 5px;

}

footer .maq > div{

	float: none;

	width: 100%;

	font-size: 12px !important;

	color: #fff;

}

#webSeo .seo > div{

	-webkit-transition: none;

	-moz-transition: none;

	-ms-transition: none;

	-o-transition: none;

	transition: none;

}

footer .footer2 .info{

	text-align:center;

	font-size:12px;

	color:#c5c5c5;

	width: 100%;

	float: none;

	margin-bottom: 0;

}

footer .footer2 .info a{

	color:#c5c5c5;

}

footer .footer2 .info >p{

	color: #fff;

	display: inline-block;

	text-align: center;

	margin-right:10px;

}

#gotop{

	position: fixed;

	right: 20px;

	bottom: 30px;

	font-size: 30px;

	color: #000;

	z-index: 9;

	width: 35px;

	text-align: center;

	height: 35px;

	background: #fff;

	line-height: 31px;

}



/* join */

#join { position: fixed; right: 0px;bottom: 150px;font-size: 40px;color: #fff;text-shadow: 0 0 10px #000;z-index: 999;width: 180px;}

#mobile-join{display: none;}





@media screen and (max-width: 1280px) {

	section{

		width:90%;

	}

	#main-menu li{

		padding: 20px 5px;

	}

	#main-menu li a{

		font-size: 15px;

	}

	footer section .four .leftborder >div{

		margin-left: 1%;

		width: 32%;

	}

	footer section .one{

		width: 100%;

		margin-bottom: 30px;

	}

	footer section .two .border{

	    border-left: 0;

	}

}

@media screen and (max-width: 980px) {

#top-nav{right: 50px;top: 28px;}

	header section{

	    padding: 15px 0;

		overflow: visible;

		height: 58px;

	}

	#cis {

		width: 35%;

	}

	.nav-func{

		display: block;

		position: absolute;

		right: 0;

		top: 30px;

		font-size: 28px;

		z-index: 99;

	}

	#main-menu{

		position: absolute;

		top: 73px;

		z-index: 9999;

		left: 0;

		background: rgb(0 0 0 / 92%);

		width: 100%;

	}

	#main-menu li{

		float: none;

		padding: 10px;

	}

	#main-menu li:hover{

		background: rgb(134 134 134 / 17%);

	}

	#main-menu li:hover:after{

		display:none;

	}

	#main-menu li:hover a:before{

	display: none;

	}

	#main-menu li a{

		margin-left:0;

		padding: 5px 20px;

		text-align: center;

	}

	footer section .four .leftborder{

		border-left:0;

		padding-left: 0;

	}

}

@media screen and (max-width: 768px) {

	#cis {

		width: 40%;

	}

	footer section .four .leftborder p{

	margin: 10px;

	}

}

@media screen and (max-width: 640px) {

.wrapper >h1{

    display: none;

}

	#top-nav ul li{

    margin-left: 5px;

}

	#top-nav ul li a{

	font-size: 12px;

	margin: 0;

	}

	header section{

	    height: 30px;

	    width: 90%;

	}

	#cis{

		float: none;

	}

	#cis h1{

		text-align:center;

	}

	#cis h1 img{

		height: 40px;

	}

	.nav-func{

	    top: 16px;

	    right: 0;

	}

	#main-menu{

		top: 45px;

	}

	footer{

	padding-bottom: 30px;

	}

	footer section .four .leftborder >div{

		margin: 0 1%;

		width: 48%;

	}

	#cellphone{

		position: fixed;

		left: 0;

		bottom: 0;

		margin: 0;

		width: 100%;

		display: block;

	}

	#cellphone ul{

		text-align:center;



	}

	#cellphone li{

	    background: #1b1b1b;

	    float: left;

	    width: 50%;

	}

	#cellphone li a{

    color: #fff;

    padding: 5px 0;

    display: block;

}

#gotop{

    bottom: 45px;

    right: 10px;

}

}

@media screen and (max-width: 480px) {

	#cis{

		width: 20%;

	}

	footer section >div{

	    width: 100%;

	}

	footer section .two .border{

		border-right: 0;

	}

	footer section .two .border p{

		text-align:center;

	}

	footer section .three{

		margin-top:30px;

	}

	footer section .four .leftborder #footer-qrcode,

	footer section .four .leftborder #footer-qrcode2{

		display:none;

	}

	#top-nav{

    top: 13px;

}

}