@charset "utf-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
	list-style: none;

	font-family: 'Source Sans Pro', sans-serif , arial, san-serf;
}

h1 {

	font-family: 'Oswald', sans-serif;
	letter-spacing: 1.1px;
}

body {
	/*background-color: #eee;*/
}


	
@media screen and (min-width: 1441px) {

.menu {
	margin: 50px auto 0;
}
.menu ul {
	text-align: center;
}
.menu li {
	display: inline;
}
.menu a {
	display: inline-block;
	height: 16px;
	position: relative;
	top: 0;
	box-shadow: 0 0 0 rgba(0,0,0,.3);
	padding: 10px 20px;
	margin: 0 8px;
	text-decoration: none;
	background-color: #ccc;
	border-radius: 6px;
	color: #FFF;
}
.menu a.now, .menu a.now:hover {
	background-color: #c7f2c0;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	color: #395335;
}
.menu a:hover {
	background-color: #aaa;
	color: #FF0000;
	box-shadow: 0 3px 0 rgba(0,0,0,.4) inset, 0 0 20px rgba(0,0,0,.4) inset;
	top: 3px;
}



nav {
	width:80%;
	margin:0 auto;
	text-align: center;
	background-color: #000;
	float:left;
}
.sub1 {
	font-size: 0;
}
.sub1 li {
	display: inline-block;
	position: relative;
}
.sub1 a {
    display: inline-block;
    font-size: 20px;
    font-weight: 900;
    padding: 0px 35px;
    line-height: 53px;
    /* background-color: #000; */
    letter-spacing: 1.1px;
    text-decoration: none;
    color: #fff;
    transition: .3s;
}

.sub1 a:hover{
	color: #f00;


}

.openMenu{
	/*display:block;*/
	display:none;	
	width:37px;
	height:53px;

	float:right;
	line-height:50px;
	text-align:center;
	border:1px solid #CCC;
	cursor:pointer;
	}


nav .sub2 {
	position: absolute;
	left: -4000px;
	width: 200px;
	margin-top: -30px;
	z-index: 90;
	text-align: left;
	opacity: .5;
	padding-top: 10px;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .2s, margin-top .2s, -webkit-transform .2s, left 0s .2s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	transition: opacity .2s, margin-top .2s, transform .2s, left 0s .2s;
}
nav .sub2:before {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 0;
	left: 50px;
	border-bottom: 10px solid #0385a3;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2:after {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 1px;
	left: 50px;
	border-bottom: 10px solid #00a5cc;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2 li {
	display: block;
}
.sub1 > li:hover .sub2 {
	left: 0;
	opacity: 1;
	margin-top: 0;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .5s .1s, -webkit-transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	transition: opacity .5s .1s, transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	
}
.sub2 a {
	display: block;
	border-top: 1px dotted #fff;
	background-color:#000;
}
.sub2 a:hover {
	background-color: #e5f4f9;
	color: #00a5cc;
}
.sub2 li {
	border-left: 1px solid #0385a3;
	border-right: 1px solid #0385a3;
}
.sub2 li:first-child {
	border-top: 1px solid #0385a3;
}
.sub2 li:last-child {
	border-bottom: 1px solid #0385a3;

}
.sub2 li:first-child a {
	border-top: none;
}

.headerTop{
	display:block;
	width:100%;
	height:53px;
	background-color:#000;
	}
.key3logo{
	display:block;
	padding-top:4px;
	height:40px;
	float:left;	
	}
	
.footer{
	display:block;
	width:100%;
	height:50px;
	text-align:center;
	line-height:72px;
	color:#999;
	}
.footer p{
	font-size:16px;
	
	}
	
.footer2{
    margin-top: 40px;
    display: block;
    width: 100%;
    height: 40px;
    background-color: #000;
    text-align: center;
    line-height: 40px;
    color: #999;

	}
	
.comingSoon{
	display:block;
	width:100%;
	height:2000px;
	}

}

.gaUploadIcon a{
	display:block;
	text-align:center;
	font-size:18px;
	line-height:20px;
	color:#fff;	
	padding:20px 20px;
	background-color: #00a5cc;
	border:2px #00a5cc solid;
	width:340px;
	margin:0 auto;
	}
.gaUploadIcon a:hover{
	background-color:#00a5cc;
	color:#fff;	

	}


.boxlBanner{
	display: block;
	width: 980px;
	margin: 0 auto;
	margin-top: 20px;
}

.lBanner{
	display: block;
	width: 320px;
	float: left;
	color: #000;
}

.lBanner a{
	text-decoration: none;
	transition: .3s;
}

.lBanner a:hover{
	opacity: 0.8;
	
}


.lBanner h1{
	font-size: 24px;
}
.lBanner p{
	font-size: 15px;
	font-weight: 800;
	color: #20bfdd;
}
.lineAfBe{
	position: relative;


}
.lineAfBe:after{
	/*content: '';*/
	width: 1px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: 310px;
    top: 28px;
}
.lineAfBe:before{
	/*content: '';*/
	width: 1px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: -11px;
    top: 30px;
}

.boxAbout{
	display: block;
	width: 980px;
	min-height: 500px;

	margin: 0 auto;

}
.boxAbout h1{
	margin-top:40px;
}
.boxAbout p{
	margin-top:40px;
	margin-bottom: 85px;
	line-height: 24px;
}

.cc{
	clear: both;

}

.boxPageTitle2{
  display: block;
  width: 100%;  
  background-image:url(../../shuffle2/img/334.jpg);
  background-repeat:no-repeat;
  height: 300px;

  }

.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 40px;
}

.pageTitle2 h1{
	text-align: center;
    font-size: 32px;
    line-height: 56px;
    color: #fff;
    font-weight: 800;
}

.pageTitle2 p{
    text-align: center;
    font-size: 18px;
    line-height: 30px;
    width: 70%;
    color: #fff;
    margin: 0 auto;
}

.boxOther{
  display: block;
  width: 980px;
  height: 320px;
  margin:0 auto;
}

.boxOther0 a, .boxOther1 a, .boxOther2 a, .boxOther3 a{
	display: block;
	width: 245px;
	height: 290px;
	float: left;

}
.boxOther0 a{

	  background-image:url(../../shuffle2/img/1225dd.png);
	  background-size: 245px 290px;
}


.boxOther1 a{
	  background-image:url(../../shuffle2/img/1225aa.png);
	  background-size: 245px 290px;
}

.boxOther2 a{
	  background-image:url(../../shuffle2/img/1225bb.png);
	  background-size: 245px 290px;
}

.boxOther3 a{
	  background-image:url(../../shuffle2/img/1225cc.png);
	  background-size: 245px 290px;
}

.boxOther0.active a{

	  background-image:url(../../shuffle2/img/1225d.png);
	  background-size: 245px 290px;
}


.boxOther1.active a{
	  background-image:url(../../shuffle2/img/1225a.png);
	  background-size: 245px 290px;
}

.boxOther2.active a{
	  background-image:url(../../shuffle2/img/1225b.png);
	  background-size: 245px 290px;
}

.boxOther3.active a{
	  background-image:url(../../shuffle2/img/1225c.png);
	  background-size: 245px 290px;
}



.boxOther0 a:hover{

	  background-image:url(../../shuffle2/img/1225d.png);
	  background-size: 245px 290px;
}

.boxOther1 a:hover{
	  background-image:url(../../shuffle2/img/1225a.png);
	  background-size: 245px 290px;
}

.boxOther2 a:hover{
	  background-image:url(../../shuffle2/img/1225b.png);
	  background-size: 245px 290px;
}

.boxOther3 a:hover{
	  background-image:url(../../shuffle2/img/1225c.png);
	  background-size: 245px 290px;
}

.boxOther0 a:hover,.boxOther1 a:hover, .boxOther2 a:hover, .boxOther3 a:hover{
	opacity: .7;
}




.w33{
	width: 306px;
	margin-bottom: 10px!important;
}
.mt33{
	margin-top: 0px!important;


}

	.gaUpload h1 {
	    text-align: center;
	    font-size: 36px;
	    line-height: 130px;
	    font-weight: bold;
	    color: #fff;
	}

@media screen and (min-width: 980px) and (max-width: 1440px) {


.menu {
	margin: 50px auto 0;
}
.menu ul {
	text-align: center;
}
.menu li {
	display: inline;
}
.menu a {
	display: inline-block;
	height: 16px;
	position: relative;
	top: 0;
	box-shadow: 0 0 0 rgba(0,0,0,.3);
	padding: 10px 20px;
	margin: 0 8px;
	text-decoration: none;
	background-color: #ccc;
	border-radius: 6px;
	color: #FFF;
}
.menu a.now, .menu a.now:hover {
	background-color: #c7f2c0;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	color: #395335;
}
.menu a:hover {
	background-color: #aaa;
	color: #FF0000;
	box-shadow: 0 3px 0 rgba(0,0,0,.4) inset, 0 0 20px rgba(0,0,0,.4) inset;
	top: 3px;
}



nav {
	width:79%;
	margin:0 auto;
	text-align: center;
	float:left;
	/* background-color: #000; */
}


.gaUploadIcon a{
	display:block;
	text-align:center;
	font-size:18px;
	line-height:20px;
	color:#fff;	
	padding:20px 20px;
	background-color: #00a5cc;
	border:2px #00a5cc solid;
	width:340px;
	margin:0 auto;
	}
.gaUploadIcon a:hover{
	background-color:#00a5cc;
	color:#fff;	

	}

.openMenu{
	/*display:block;*/
	display:none;	
	width:37px;
	height:53px;
	float:right;
	line-height:50px;
	text-align:center;
	border:1px solid #CCC;
	cursor:pointer;
	}


.sub1 {
	font-size: 0;
}
.sub1 li {
	display: inline-block;
	position: relative;
}


.sub1 a {
    display: inline-block;
    font-size: 18px;
    font-weight: 900;
	letter-spacing: 0.3px;
    padding: 0px 9px;
    line-height: 53px;
    /* background-color: #000; */
    text-decoration: none;
    color: #fff;
}





nav .sub2 {
	position: absolute;
	left: -4000px;
	width: 200px;
	margin-top: -30px;
	z-index: 90;
	text-align: left;
	opacity: .5;
	padding-top: 10px;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .2s, margin-top .2s, -webkit-transform .2s, left 0s .2s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	transition: opacity .2s, margin-top .2s, transform .2s, left 0s .2s;
}
nav .sub2:before {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 0;
	left: 50px;
	border-bottom: 10px solid #0385a3;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2:after {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 1px;
	left: 50px;
	border-bottom: 10px solid #00a5cc;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2 li {
	display: block;
}
.sub1 > li:hover .sub2 {
	left: 0;
	opacity: 1;
	margin-top: 0;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .5s .1s, -webkit-transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	transition: opacity .5s .1s, transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	
}
.sub2 a {
	display: block;
	border-top: 1px dotted #fff;
	background-color:#000;
}
.sub2 a:hover {
	background-color: #e5f4f9;
	color: #00a5cc;
}
.sub2 li {
	border-left: 1px solid #0385a3;
	border-right: 1px solid #0385a3;
}
.sub2 li:first-child {
	border-top: 1px solid #0385a3;
}
.sub2 li:last-child {
	border-bottom: 1px solid #0385a3;
}
.sub2 li:first-child a {
	border-top: none;
}

.headerTop{
	display:block;
	width:100%;
	height:53px;
	background-color:#000;
	}
.key3logo{
	display:block;
	padding-top:4px;
	height:40px;
	float:left;	
	}
	
.footer{
	display:block;
	width:100%;
	height:50px;
	text-align:center;
	line-height:72px;
	color:#999;
	}
	
.footer2{
	margin-top:40px;
	display:block;
	width:100%;
	height:100px;
	background-color:#000;
	text-align:center;
	line-height:72px;
	color:#999;
	}
	
.comingSoon{
	display:block;
	width:100%;
	height:2000px;
	}

.boxPageTitle2{
  display: block;
  width: 100%;  
  background-image:url(../../shuffle2/img/334.jpg);
  background-repeat:no-repeat;
  height: 300px;

  }

.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 40px;
}

.pageTitle2 h1{
	text-align: center;
    font-size: 32px;
    line-height: 56px;
    color: #fff;
    font-weight: 800;
}

.pageTitle2 p {
    text-align: center;
    font-size: 18px;
    line-height: 24px;
    width: 70%;
    color: #fff;
    margin: 0 auto;
}




}


@media screen and (min-width: 767px) and (max-width: 980px){


.menu {
	margin: 50px auto 0;
}

.menu ul {
	text-align: center;
}
.menu li {
	display: inline;
}
.menu a {
	display: inline-block;
	height: 16px;
	position: relative;
	top: 0;
	box-shadow: 0 0 0 rgba(0,0,0,.3);
	padding: 10px 20px;
	margin: 0 8px;
	text-decoration: none;
	background-color: #ccc;
	border-radius: 6px;
	color: #FFF;
}
.menu a.now, .menu a.now:hover {
	background-color: #c7f2c0;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	color: #395335;
}
.menu a:hover {
	background-color: #aaa;
	color: #FF0000;
	box-shadow: 0 3px 0 rgba(0,0,0,.4) inset, 0 0 20px rgba(0,0,0,.4) inset;
	top: 3px;
}



nav {
	width:100%;
	margin:0 auto;
	text-align: center;
	/* background-color: #000; */
	position:relative;
	
}


.openMenu{
	display: block;
    width: 43px;
    height: 44px;
    float: right;
    
    line-height: 40px;
    margin-top: 5px;
    margin-right: 3px;
    text-align: center;
    border: 3px solid #fff;
    cursor: pointer;
    font-size: 30px;
	}

.sub1 {
	display: none;
	font-size: 0;
	position:absolute;
	z-index:666;
	top:53px;
	right:0px;
	left:0px;
	
}
.sub1 li {
	display: block;
	width:100%;
	background-color:#6e6e6e;
	border-bottom:1px solid #FFF;
	transition:.3s;
}
.sub1 li:hover {
	display: block;
	width:100%;
	background-color:#565656;
	border-bottom:1px solid #FFF;
}

.sub1 li:last-child{
	border-bottom:none;
	}

.sub1 li a{
	width:100%;
	text-align:center;
}


.sub1 a {
	display: inline-block;
	font-size: 18px;
	padding: 0px 10px;
	line-height:53px;
	/*background-color: #000;*/
	text-decoration: none;
	color: #fff;
}

nav .sub2 {
	position: absolute;
	left: -4000px;
	width: 200px;
	margin-top: -30px;
	z-index: 90;
	text-align: left;
	opacity: .5;
	padding-top: 10px;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .2s, margin-top .2s, -webkit-transform .2s, left 0s .2s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	transition: opacity .2s, margin-top .2s, transform .2s, left 0s .2s;
}
nav .sub2:before {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 0;
	left: 50px;
	border-bottom: 10px solid #0385a3;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2:after {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 1px;
	left: 50px;
	border-bottom: 10px solid #00a5cc;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2 li {
	display: block;
}
.sub1 > li:hover .sub2 {
	left: 0;
	opacity: 1;
	margin-top: 0;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .5s .1s, -webkit-transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	transition: opacity .5s .1s, transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	
}
.sub2 a {
	display: block;
	border-top: 1px dotted #fff;
	background-color:#000;
}
.sub2 a:hover {
	background-color: #e5f4f9;
	color: #00a5cc;
}
.sub2 li {
	border-left: 1px solid #0385a3;
	border-right: 1px solid #0385a3;
}
.sub2 li:first-child {
	border-top: 1px solid #0385a3;
}
.sub2 li:last-child {
	border-bottom: 1px solid #0385a3;
}
.sub2 li:first-child a {
	border-top: none;
}

.headerTop{
	display:block;
	width:100%;
	height:53px;
	background-color:#000;
	}
.key3logo{
	display:block;
	padding-top:4px;
	height:40px;
	float:left;	
	}
	
.footer{
	display:block;
	width:100%;
	height:50px;
	text-align:center;
	line-height:72px;
	color:#999;
	}
	
.footer2{
	margin-top:40px;
	display:block;
	width:100%;
	height:100px;
	background-color:#000;
	text-align:center;
	line-height:72px;
	color:#999;
	}
	
.comingSoon{
	display:block;
	width:100%;
	height:2000px;
	}


.boxlBanner{
	display: block;
	width: 100%;
	margin: 0 auto;
	margin-top: 20px;
}

.lBanner{
	display: block;
	width: 33.333333%;
	float: left;
	color: #000;
}

.lBanner a{
	text-decoration: none;
	transition: .3s;
}

.lBanner a:hover{
	opacity: 0.8;
	
}


.lBanner h1{
	font-size: 24px;
}
.lBanner p{
	font-size: 15px;
	font-weight: 800;
	color: #20bfdd;
}
.lineAfBe{
	position: relative;


}
.lineAfBe:after{
	content: '';
	width: 1px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: 310px;
    top: 28px;
}
.lineAfBe:before{
	content: '';
	width: 1px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: -11px;
    top: 30px;
}



.boxAbout{
	display: block;
	width: 100%;
	min-height: 500px;

	margin: 0 auto;

}
.boxAbout h1{
	margin-top:40px;
}
.boxAbout p{
	margin-top:40px;
	margin-bottom: 85px;
	line-height: 24px;
}

.cc{
	clear: both;

}

.boxPageTitle2{
  display: block;
  width: 100%;  
  background-image:url(../../shuffle2/img/334.jpg);
  background-repeat:no-repeat;
  height: 300px;

  }

.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 40px;
}

.boxOther{
  display: block;
  width: 100%;
  height: 320px;
  margin:0 auto;
}

.boxOther0 a, .boxOther1 a, .boxOther2 a, .boxOther3 a{
	display: block;
	width: 25%;
	height: 294px;
	float: left;

}
.boxOther0 a{

	  background-image:url(../../shuffle2/img/1225dd.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}


.boxOther1 a{
	  background-image:url(../../shuffle2/img/1225aa.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther2 a{
	  background-image:url(../../shuffle2/img/1225bb.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther3 a{
	  background-image:url(../../shuffle2/img/1225cc.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther0.active a{

	  background-image:url(../../shuffle2/img/1225d.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}


.boxOther1.active a{
	  background-image:url(../../shuffle2/img/1225a.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther2.active a{
	  background-image:url(../../shuffle2/img/1225b.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther3.active a{
	  background-image:url(../../shuffle2/img/1225c.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}



.boxOther0 a:hover{

	  background-image:url(../../shuffle2/img/1225d.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther1 a:hover{
	  background-image:url(../../shuffle2/img/1225a.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther2 a:hover{
	  background-image:url(../../shuffle2/img/1225b.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther3 a:hover{
	  background-image:url(../../shuffle2/img/1225c.png);
	  background-size: 98%;
	  background-repeat: no-repeat;
}

.boxOther0 a:hover,.boxOther1 a:hover, .boxOther2 a:hover, .boxOther3 a:hover{
	opacity: .7;
}




.w33{
	width: 306px;
	margin-bottom: 10px!important;
}
.mt33{
	margin-top: 0px!important;


}

	.gaUpload h1 {
	    text-align: center;
	    font-size: 36px;
	    line-height: 130px;
	    font-weight: bold;
	    color: #fff;
	}

.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 20px;
}

.pageTitle2 h1{
	text-align: center;
    font-size: 32px;
    line-height: 56px;
    color: #fff;
    font-weight: 800;
}

.pageTitle2 p {
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    width: 70%;
    color: #fff;
    margin: 0 auto;
}

.gaUploadIcon a{
	display:block;
	text-align:center;
	font-size:18px;
	line-height:20px;
	color:#fff;	
	padding:20px 20px;
	background-color: #00a5cc;
	border:2px #00a5cc solid;
	width:340px;
	margin:0 auto;
	}
.gaUploadIcon a:hover{
	background-color:#00a5cc;
	color:#fff;	

	}


}


@media screen and (min-width: 320px) and (max-width: 766px) {

.menu {
	margin: 50px auto 0;
}
.menu ul {
	text-align: center;
}
.menu li {
	display: inline;
}
.menu a {
	display: inline-block;
	height: 16px;
	position: relative;
	top: 0;
	box-shadow: 0 0 0 rgba(0,0,0,.3);
	padding: 10px 20px;
	margin: 0 8px;
	text-decoration: none;
	background-color: #ccc;
	border-radius: 6px;
	color: #FFF;
}
.menu a.now, .menu a.now:hover {
	background-color: #c7f2c0;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	color: #395335;
}
.menu a:hover {
	background-color: #aaa;
	color: #FF0000;
	box-shadow: 0 3px 0 rgba(0,0,0,.4) inset, 0 0 20px rgba(0,0,0,.4) inset;
	top: 3px;
}



nav {

	width:100%;
	margin:0 auto;
	text-align: center;
	background-color: #000;
	position:relative;
	
}
.openMenu{
	display: block;
    /* display: none; */
    width: 43px;
    height: 44px;
    float: right;
    line-height: 40px;
    margin-top: 5px;
    margin-right: 3px;
    text-align: center;
    border: 3px solid #fff;
    cursor: pointer;
    font-size: 30px;
	}

.sub1 {
	display: none;
	font-size: 0;
	position:absolute;
	top:53px;
	z-index:333;
	right:0;
	left:0;
	
}
.sub1 li {
	display: block;
	width:100%;
	background-color:#191717;
	border-bottom:1px solid #505050;
	transition:.3s;
}
.sub1 li:hover {
	display: block;
	width:100%;
	background-color:#565656;
	border-bottom:1px solid #FFF;
}

.sub1 li:last-child{
	border-bottom:none;
	}

.sub1 li a{
	width:100%;
	text-align:center;
}



.sub1 a {
	
	display:block;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 1.1px;
	padding: 0px -8px;
	line-height:53px;
	/*background-color: #000;*/
	text-decoration: none;
	color: #fff;
}



nav .sub2 {
	position: absolute;
	left: -4000px;
	width: 200px;
	margin-top: -30px;
	z-index: 90;
	text-align: left;
	opacity: .5;
	padding-top: 10px;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .2s, margin-top .2s, -webkit-transform .2s, left 0s .2s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 90deg) translate3D(0, 0, -100px);
	transition: opacity .2s, margin-top .2s, transform .2s, left 0s .2s;
}
nav .sub2:before {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 0;
	left: 50px;
	border-bottom: 10px solid #0385a3;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2:after {
	position: absolute;
	z-index: 99;
	content: '';
	display: block;
	width: 0;
	height: 0;
	top: 1px;
	left: 50px;
	border-bottom: 10px solid #00a5cc;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
nav .sub2 li {
	display: block;
	
}
.sub1 > li:hover .sub2 {
	left: 0;
	opacity: 1;
	margin-top: 0;
	-webkit-transform-origin: center center -100px;
	-webkit-transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	-webkit-transition: opacity .5s .1s, -webkit-transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	transform-origin: center center -100px;
	transform: perspective(200px) rotate3D(0, 1, 0, 0deg) translate3D(0, 0, -100px);
	transition: opacity .5s .1s, transform .3s cubic-bezier(.5, 1.5, .5, 1.5), margin-top .3s cubic-bezier(.5, 1.5, .5, 1.5), left 0s 0s;
	
}
.sub2 a {
	display: block;
	border-top: 1px dotted #fff;
	background-color:#000;
}
.sub2 a:hover {
	background-color: #e5f4f9;
	color: #00a5cc;
}
.sub2 li {
	border-left: 1px solid #0385a3;
	border-right: 1px solid #0385a3;
}
.sub2 li:first-child {
	border-top: 1px solid #0385a3;
}
.sub2 li:last-child {
	border-bottom: 1px solid #0385a3;
}
.sub2 li:first-child a {
	border-top: none;
}

.headerTop{
	display:block;
	width:100%;
	height:53px;
	background-color:#000;
	}
.key3logo{
	display:block;
	padding-top:4px;
	height:40px;
	float:left;	
	}
	
.footer{
	display:block;
	width:100%;
	height:50px;
	text-align:center;
	line-height:72px;
	color:#999;
	}
	
.footer2{
	/*margin-top:20px;*/
	padding-top: 5px;
	display:block;
	width:100%;
	min-height: 40px;

	background-color:#000;
	text-align:center;
	line-height:24px;
	color:#999;
	font-size: 16px;
	}
	
.comingSoon{
	display:block;
	width:100%;
	height:2000px;
	}



.boxlBanner{
	display: block;
	width: 100%;
	margin: 0 auto;
	margin-top: 20px;
}

.lBanner{
	display: block;
	width: 100%;
	float: left;
	color: #000;
}

.lBanner a{
	text-decoration: none;
	transition: .3s;
}

.lBanner a:hover{
	opacity: 0.8;
	
}


.lBanner h1{
	font-size: 24px;
}
.lBanner p{
	font-size: 15px;
	font-weight: 800;
	color: #20bfdd;
}
.lineAfBe{
	position: relative;


}
.lineAfBe:after{
	content: '';
	width: 0px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: 310px;
    top: 28px;
}
.lineAfBe:before{
	content: '';
	width: 0px;
	height: 200px;
	background-color: #959595;
	position: absolute;
	z-index: 33;
    left: -11px;
    top: 30px;
}

.boxAbout{
	display: block;
	width: 100%;
	min-height: 500px;

	margin: 0 auto;

}
.boxAbout h1{
	margin-top:40px;
	padding-left: 3%;
	padding-right: 3%;
}
.boxAbout p{
	margin-top:40px;
	margin-bottom: 85px;
	line-height: 24px;
	padding-left: 3%;
	padding-right: 3%;
}

.cc{
	clear: both;

}

.boxPageTitle2{
  display: block;
  width: 100%;  
  background-image:url(../../shuffle2/img/334.jpg);
  background-repeat:no-repeat;
	height: 320px;
    background-color: #000;

  }

.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 40px;
}

.boxOther{
  display: block;
  width: 100%;
  height: auto;
  margin:0 auto;
}

.boxOther0, .boxOther1, .boxOther2, .boxOther3{
 	margin:0 auto;


}
.boxOther0 a, .boxOther1 a, .boxOther2 a, .boxOther3 a{
	display: block;
	width: 50%;
	height: 147px;
	float: left;
  margin:0 auto;
  /*margin-left: 10%;*/


}
.boxOther0 a{

	  background-image:url(../../shuffle2/img/1225dd.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}


.boxOther1 a{
	  background-image:url(../../shuffle2/img/1225aa.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}

.boxOther2 a{
	  background-image:url(../../shuffle2/img/1225bb.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}

.boxOther3 a{
	  background-image:url(../../shuffle2/img/1225cc.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}

.boxOther0.active a{

	  background-image:url(../../shuffle2/img/1225d.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}


.boxOther1.active a{
	  background-image:url(../../shuffle2/img/1225a.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}

.boxOther2.active a{
	  background-image:url(../../shuffle2/img/1225b.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}

.boxOther3.active a{
	  background-image:url(../../shuffle2/img/1225c.png);
	  background-size: 125px 147px;
	  background-repeat: no-repeat;
	  background-position: top center;
}



.boxOther0 a:hover{
	  background-image:url(../../shuffle2/img/1225d.png);
}

.boxOther1 a:hover{
	  background-image:url(../../shuffle2/img/1225a.png);
}

.boxOther2 a:hover{
	  background-image:url(../../shuffle2/img/1225b.png);
}

.boxOther3 a:hover{
	  background-image:url(../../shuffle2/img/1225c.png);
}

.boxOther0 a:hover,.boxOther1 a:hover, .boxOther2 a:hover, .boxOther3 a:hover{
	opacity: .7;
	background-size: 125px 147px;
	background-repeat: no-repeat;
}




.w33{
	width: 306px;
	margin-bottom: 10px!important;
}
.mt33{
	margin-top: 0px!important;


}


.pageTitle2{
  display: block;
  width: 100%;
  margin:0 auto;
  padding-top: 20px;
}

.pageTitle2 h1{
	text-align: center;
    font-size: 24px;
    line-height: 36px;
    color: #fff;
    font-weight: 800;
}

.pageTitle2 p {
	
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    width: 90%;
    color: #fff;
    margin: 0 auto;
    display: block;
    max-height: 200px;
    overflow: hidden;
}


}



@media only screen and (max-width:980px) {
	.ttComments{
		display: block;
		width: 80%;
		margin: 0 auto;

	}
}

@media screen and (min-width: 768px) and (max-width: 980px) {
	.ttComments{
		display: block;
		width: 80%;
		margin: 0 auto;

	}

	.loginPlayer ul {
	    margin: 0 auto;
	    width: 100%;
	    height: 30px;
	    text-align: right;
	}

	.d3MidMenu {
	    margin: 0 auto;
	    display: block;
	    width: 767px;
	    height: 66px;
	    background-color: #475254;
	}

	.container-fluid {
	    /* width: 93%; */
	    max-width: 100%;
	    width: 100%;
	    margin: 0 auto ;
	/*    margin-left: auto;
	    margin-right: auto;*/
	}

	.gaUpload h1 {
	    text-align: center;
	    font-size: 36px;
	    line-height: 90px;
	    font-weight: bold;
	    color: #fff;
	}

	.commRe{
		margin: 0 auto;
	}

	.gaUploadIcon a {
    display: block;
	    text-align: center;
	    font-size: 18px;
	    line-height: 20px;
	    color: #fff;
	    padding: 20px 20px;
	    background-color: #00a5cc;
	    border: 2px #00a5cc solid;
	    width: 300px;
	    margin: 0 auto;
	   /* margin-top:20px;*/
	}

	.commReSele {
	    display: block;
	    width: 97%;
	    height: 100px;
	    margin-left: 10px;
	    margin-top: 5px;
	    margin-bottom: 5px;
	    border-radius: 4px;
	    float: left;
	}

	.commReIcon {
    display: block;
    width: 115px;
    height: 64px;
    margin-top: 8px;
    float: none;
    margin: 0 auto;
}

.commReIcon a {
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 20px;
    color: #00a5cc;
    padding: 20px 20px;
    border: 2px #00a5cc solid;
    width: 115px;
    margin-bottom: 1px;
    margin: 0 auto;

}


.commRe p {
    width: 100%;
    text-align: center;
    height: 20px;
    /* padding-left: 10px; */
    font-size: 13px;
    color: #ccc;
    /* float: left; */
    line-height: 20px;
}


}

@media screen and (min-width: 320px) and (max-width: 768px) {

	.loginPlayer ul {
	    margin: 0 auto;
	    width: 100%;
	    height: 30px;
	    text-align: right;
	}

	.d3MidMenu {
	    margin: 0 auto;
	    display: block;
	    width: 100%;
	    height: 66px;
	    background-color: #475254;
	}

	.container-fluid {
	    /* width: 93%; */
	    max-width: 100%;
	    width: 100%;
	    margin: 0 auto;
	/*    margin-left: auto;
	    margin-right: auto;*/
	}

	.pull-right {
	    display: none;
	    float: right;
	}

	.gaUpload h1 {
	    text-align: center;
	    font-size: 24px;
	    line-height: 40px;
	    font-weight: bold;
	    color: #fff;
	    padding-top: 70px;
	}


	.ttComments{
		display: block;
		width: 95%;
		margin: 0 auto;
		margin-bottom: 20px;

	}

	.gaUploadContent {
	    text-align: center;
	    font-size: 15px;
	    line-height: 20px;
	    padding-top: 30px;
	    color: #fff;
	}

	.gaUploadContent {
	    text-align: center;
	    font-size: 15px;
	    line-height: 20px;
	    padding-top: 10px;
	    color: #fff;
	}
/*
	.gaUpload {
	    display: block;
	    width: 100%;
	    height: 240px;
	    background-image: url(../img/bg01.jpg);
	    background-size: cover;
	}
*/

	.commRe{
		margin: 0 auto;
	}

	.gaUploadIcon a {
    display: block;
	    text-align: center;
	    font-size: 18px;
	    line-height: 20px;
	    color: #fff;
	    padding: 20px 20px;
	    background-color: #00a5cc;
	    border: 2px #00a5cc solid;
	    width: 300px;
	    margin: 0 auto;
	   /* margin-top:20px;*/
	}

	.commReSele {
	    display: block;
	    width: 97%;
	    height: 100px;
	    margin-left: 10px;
	    margin-top: 5px;
	    margin-bottom: 5px;
	    border-radius: 4px;
	    float: left;
	}

	.commReIcon {
    display: block;
    width: 115px;
    height: 64px;
    margin-top: 8px;
    float: none;
    margin: 0 auto;
}

.commReIcon a {
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 20px;
    color: #00a5cc;
    padding: 20px 20px;
    border: 2px #00a5cc solid;
    width: 115px;
    margin-bottom: 1px;
    margin: 0 auto;

}


.commRe p {
    width: 100%;
    text-align: center;
    height: 20px;
    /* padding-left: 10px; */
    font-size: 13px;
    color: #ccc;
    /* float: left; */
    line-height: 20px;
}

}
