@charset "gb2312";
/* CSS Document */

*{margin:0px;
  padding:0px;}

  
@font-face { font-family : fzzqhjt ; src:url(fzzqhjt.ttf) }  

html{width:100%;
	 height:100%;
	-ms-text-size-adjust:none;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-o-text-size-adjust:none;
	font-family:Arial, "microsoft yahei";
	font-size:16px;
	box-sizing:content-box;
	-moz-box-sizing:content-box;
	-ms-box-sizing:content-box;
	-o-box-sizing:content-box;
	-webkit-box-sizing:content-box;
}

body{width:100%;
     height:100%;
	 min-width:1200px;
}

ul{ 
    list-style-type:none;
}
p{
	margin:0px;
	padding:0px;
}
a{
	text-decoration: none;
    outline: none;
	padding:0px;
	margin:0px;
	}



header{
	background:#e7e7e7;
	
	width:100%;
	height:auto;
}

.head{
	background:#fbfbfb;
	width:100%;
	height:auto;
	overflow:hidden;
	position: relative;
}

.head img{
	border-bottom:5px solid #ec061b;
	margin:0 15%;
	padding:18px 35px 10px;
}

.head a{
	position: absolute;
	top:60%;
	right: 20%;
	font-size: 1.2rem;
	font-family: fzzqhjt,"microsoft yahei";
	color:rgba(0,0,0,0.6);
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}

.head a:hover{
	color: rgba(0,0,0,0.9);
}

.banner{
	width:100%;
	height:auto;
	text-align:center;
	margin-top:90px;
	padding-bottom:80px;
}

.rz{
	display: none;
}

.er{
	position:fixed;
	top: 30%;
	right: 0;
	background: #ffffff;
	padding: 7px;
	text-align: center;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	z-index: 1000;
}

.er p{
	line-height: 200%;
	font-size:0.8rem;
}

.banner p{
	font-size:1.7rem;
	letter-spacing:0.15rem;
	}
.banner p img{
	margin:10px auto;
}

.banner p b{
	font-family:fzzqhjt, "microsoft yahei";
	display:inline-block;
	font-weight:normal;
	font-size:2rem;
	letter-spacing:0px;
	border-radius:100%;
	background:#ec061b;	
	position:absolute;
	padding:2.5rem 0.5rem 2rem;	
	margin-left:10px;
	margin-top:-100px;
	color:#fff;
}
.banner p b:after{
	content:"";
	width:0px;
	height:0px;
	border-bottom:3rem solid #ec061b;
	border-right:3rem solid transparent;
	position:absolute;
	left:0;
	bottom:0;
}
.banner p span{
	display:block;
	margin:20px auto 80px;
}
.banner p a{
	margin:0 0.5rem;
	background:#5c5c5c;
	border-radius:5px;
	padding:1.5rem;
	color:rgba(255,255,255,0.6);
	transition:.3s ease-out;
	-moz-transition:.3s ease-out;
	-ms-ransition:.3s ease-out;
	-o-transition:.3s ease-out;
	-webkit-transition:.3s ease-out;
	position: relative;
}

.banner p a:hover{
	background:#2c2c2c;
	color:rgba(255,255,255,1);
}


.banner p a img{
	display:inline;
	vertical-align:middle;
	margin-right:1rem;
}



.conter{
	width:100%;
	
	height:auto;
	overflow:hidden;
	border-bottom:1px solid #dbdbdb;
	position:relative;
}


.conter_left, .conter_left1, .conter_right, .conter_right1{
	float:left;
	vertical-align:middle;
	width:50%;
	box-sizing:border-box;
}
.conter_left{
	padding:0 10%;
}

.conter_left1{
	padding:5% 5% 5% 10%;
}

.btom, .btom2{
	margin-top: 4rem;
}

.btom1{
	margin-top: 5rem;
}

.title1{
	font-size:2.3rem;
	color: rgba(0,0,0,0.8);
	position: relative;
}

.title1 span{
	font-size:15rem;
	color: rgba(0,0,0,0.1);
	letter-spacing:-20px;
	position: absolute;
	top: -100px;
	left: -120px;
}

.title1 strong{
	font-size:3.0rem;
}

.title2{
	margin:50px auto 80px;
	text-align: center;
	font-size: 3rem;
	color: rgba(0,0,0,0.8);
}

.title3{
	text-align: center;
	font-size: 3rem;
	color: rgba(0,0,0,0.8);
	margin: 50px auto;
}

.contact{
	text-align: center;
	position: relative;
}

.contact span{
	font-family:fzzqhjt, "microsoft yahei";
	width:80px;
	height: 80px;
	border-radius: 100%;
	background: #ec061b;
	display: block;
	position: absolute;
	left: 50%;
	top:30%;
	box-sizing:border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-size:1.5rem;
	color: #ffffff;
	padding-top: 1.5rem;
	cursor: pointer;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: perserve-3d;
	animation: spin 1s infinite ease-in;
	-webkit-animation: spin 1s infinite ease-in;
	-moz-animation: spin 1s infinite ease-in;
	-ms-animation: spin 1s infinite ease-in;
	-o-animation: spin 1s infinite ease-in;
}

.contact span:hover{
	animation:0s;
}

.contact span:hover .div1{
	opacity: 1;
	-moz-opacity: 1;
		width:410px;
		height: auto;
		-webkit-transform: translate3d(0,0,0) scale3d(1,1,1);
	transform: translate3d(0,0,0) scale3d(1,1,1);
	-moz-transform: translate3d(0,0,0) scale3d(1,1,1) ;
	-ms-transform: translate3d(0,0,0) scale3d(1,1,1);
	  -webkit-transform-origin: 100% 100%;
	  transform-origin: 100% 100%;
	  -moz-transform-origin: 100% 100%;
	  -webkit-transition: all 0.3s;
	  transition: all 0.3s;
	  -moz-transition: all 0.3s;
	  -ms-transition: all 0.3s;
	  
}

.contact span:before{
	content:"";
	width:0px;
	height:0px;
	border-top:3rem solid #ec061b;
	border-right:2rem solid transparent;
	border-left:2rem solid transparent;
	position:absolute;
	left:9px;
	bottom:-2rem;
}

	/* keyframes for rotating animation */
	@-webkit-keyframes spin {
	  from { -webkit-transform: translate3d(0,0,0); }
	  to   { -webkit-transform: translate3d(0,5px,0); }
	}

@keyframes spin {
	  from { transform: translate3d(0,0,0); }
	  to   { transform: translate3d(0,5px,0); }
	}
	
	@-moz-keyframes spin {
	  from { transform: translate3d(0,0,0); }
	  to   { transform: translate3d(0,5px,0); }
	}
	
	@-ms-keyframes spin {
	  from { transform: translate3d(0,0,0); }
	  to   { transform: translate3d(0,5px,0); }
	}
	
	@-o-keyframes spin {
	  from { transform: translate3d(0,0,0); }
	  to   { transform: translate3d(0,5px,0); }
	}
	


.div1{
	  background: #ffffff;
    border-radius: 5px;
    border: 1px solid rgba(0,0,0,0.1);
    text-align: left;
    font-family: "΢ÈíÑźÚ";
    font-size: 1.2rem;
    color:rgba(0,0,0,0.8);
    padding: 10px;
    width: 0;
    position: absolute;
    top: 0;
    left: 100;
    opacity:0;
    cursor: default;
	  pointer-events: none;    
	  -webkit-transform: scale3d(0,1,0);
	transform: scale3d(0,1,0);
}

.div1:before{
	content:" " ;
	width: 0;
	height: 0;
	display: block;
	border-right:20px solid rgba(0,0,0,0.1);
	border-top:20px solid transparent;
	border-bottom:20px solid transparent;
	position:absolute;
	left: -20px;
}

.div1:after{
	content:" " ;
	width: 0;
	height: 0;
	display: block;
	border-right:20px solid rgba(255,255,255,1);
	border-top:20px solid transparent;
	border-bottom:20px solid transparent;
	position:absolute;
	top: 10px;
	left: -18px;
}
	
.div1 p{
	padding-left: 4.5rem;
	line-height: 150%;
}

.div1 p strong{
	display: inline-block;
	width:4.5rem;
	text-align: right;
	position:absolute;
	left: 0rem;
}

.contact2{
	width: 600px;
	margin: 10px auto;
	font-size:1.5rem;
	font-family:fzzqhjt, "microsoft yahei";
	color: rgba(0,0,0,0.9);
	line-height: 200%;
	text-align: center;
}

.fontsloaded .contact2{
	font-family: fzzqhjt, "microsoft yahei";
}


.contact2 span{
	float: right;
}

.text1{
	font-size:1.4rem;
	color: rgba(0,0,0,0.9);
}

.text2{
	font-size:1rem;
	color: rgba(0,0,0,0.6);
}

.conter_right{
	text-align:right;
	vertical-align:middle;
	font-size:1.2rem;
	color:#848484;
	padding:8% 10%;
	line-height:150%;
	
}
.conter_right1{
	font-family: fzzqhjt, "microsoft yahei";
	text-align:left;
	vertical-align:middle;
	font-size:1.2rem;
	color:rgba(0,0,0,0.7);
	padding:5%;
	line-height:180%;
	letter-spacing:1px;
}

.conter_right1 p{
	margin: 20px auto;
	text-indent: 3rem;
}


.conter_right1 p strong{
	font-size:1.4rem;
	color: rgba(0,0,0,0.9);
}

.conter1_left{
	margin:40px 0 60px;
	}

.conter1_right{
	margin:20px 0 0;
	
	}

.conter2_left{

  min-height: 500px;
  position: relative;
	
	}

.conter3_left{
	margin:150px 0 100px;
	}
	
.conter3_right{
	margin:130px 0 0;
	}
	

 .title{
	font-size:3.8rem;
	font-family: "Microsoft JhengHei";
	color:#000000;
	line-height:200%;
}
.title span{
	font-size:5.6rem;
}



footer{
	font-family:Arial, "Microsoft JhengHei";
	font-size:0.8rem;
	text-align:center;
	line-height:200%;
	color:#8c8c8c;
	background:#2a2a2a;
	padding:2rem 0rem;
}