body {
	margin: 0 auto;
	/*overflow-x: hidden;*/
	-moz-user-select : none;
	-webkit-user-select: none;
	font-family: 'Microsoft JhengHei';
	font-weight: lighter;
	background-color: #efe8e5;
	color: #4d4d4d;
}

img { border: 0px;}
a { 
	outline: none; /* for Firefox Google Chrome  */
	behavior:expression(this.onFocus=this.blur()); /* for IE */
	text-decoration: none;
}
a:hover {text-decoration: none;}
li {list-style-type:none;}

.logo {
	position: absolute;
	left: 50%;
	margin-left: -900px;
	top: 7%;
	z-index: 6;
}




/*---- form ----*/
.container_m {display: none}
.formz {
	text-align: center;
	background:rgba(255,255,255,0.7);
	height: auto;
	padding: 33px 0 ;
	position: absolute;
	margin: 0 auto;
	width: 100%;
	bottom: 0;
}


/*---- part2 ----*/
.part2 {
	background: #e3d7d2;
	width: 100%;
	height: 1420px;
	position: relative;
	overflow: hidden;
}
.linea:before {
	content:"";
	width:100%;
	height:230px;
	position:absolute;
	top:18%;
	background-color:rgba(255,255,255,0.6);
	transform:skewY(10deg);
	-webkit-transform:skewY(10deg);
	-moz-transform:skewY(10deg);
	z-index: 0
}

.lineb:before {
	content:"";
	width:100%;
	height:230px;
	position:absolute;
	top:63%;
	background-color:rgba(255,255,255,0.6);
	transform:skewY(-10deg);
	-webkit-transform:skewY(-10deg);
	-moz-transform:skewY(-10deg);
}

.part2_title1 {
	width: 340px;
	position: relative;
	left: 50%;
	margin-left: -570px;
	top: 130px;
}
.part2_title2 {
	width: 282px;
	position: relative;
	left: 50%;
	margin-left: -20px;
	top: 740px;
}

/*---- part2 peoplebox ----*/
.peoplebox {
	left: 50%;
	margin-left: -480px;
	text-align: center;
	position: absolute;
}

.peoplebox li {
	display: inline-block;
	vertical-align: top;
	padding: 0 60px;
	margin-top: 50px;
}

.peoplebox p {
	font-size: 27px;
	line-height: 36px;
	letter-spacing: 3px;
	padding: 20px 0 0 0;
	text-align: justify
}

.peoplebox b {
	font-weight: bold
}

.spc { padding-top: 130px;}


/*---- part2 checkbox ----*/


.checkbox {
	left: 50%;
	margin-left: 250px;
	text-align: center;
	position: absolute;
	top: 1030px;
}

.checkbox li {
	font-size: 27px;
	letter-spacing: 4px;
	padding: 0 0 20px 0
}

.mr {color: #ce716a}

.part2pic4 {
	position: absolute;
	left: 50%;
	margin-left: -585px;
	top: 735px;
	transform: rotate(15deg);
	display: table-cell;
}

/*---- youneed ----*/
.youneed {
	background: #333333;
	text-align: center;
	font-size: 46px;
	color: #f6f6f6;
	letter-spacing: 8px;
	padding: 65px 0;
	transition:1s all;
	-webkit-transition:1s all;
	-moz-transition:1s all;
	-o-transition:1s all;
	-ms-transition:1s all;
}

.youneed:hover {
	background: #5ca5a5;
}





/*---- featuresbox ----*/
.featuresbox {
	padding: 100px 0;
	text-align: center;
}
.featuresbox li {
	display: inline-block;
	vertical-align: top;
}
.features_p1,.features_p2,.features_p3,.features_p4 {
	background-size: cover;
	position: relative;
	z-index: -1
}
.features_p1,.features_p3 {
	width: 950px;
	height: 400px;
}
.features_p2,.features_p4 {
	width: 750px;
	height: 500px;
}
.features_p1 {
	background: url("../images/features.p1.jpg")no-repeat top center;
	margin: 130px 0 0 -160px
}
.features_p2 {
	background: url("../images/features.p2.jpg")no-repeat top center;
	margin: 120px 0 0 -1230px
}
.features_p3 {
	background: url("../images/features.p3.jpg")no-repeat top center;
	margin: 250px 0 0 -160px
}
.features_p4 {
	background: url("../images/features.p4.jpg")no-repeat top center;
	margin: 80px 0 0 -1120px
}

.features_a1,.features_a2,.features_a3,.features_a4 {
	width: 450px;
	height: 450px;
	color: #fff;
	z-index: 0
}

.features_a1 { background: rgba(206,113,106,0.7);}
.features_a2 { background: rgba(92,165,165,0.7); margin: 140px 0 0 300px}
.features_a3 { background: rgba(102,84,88,0.7); margin: 120px 0 0 0}
.features_a4 { background: rgba(97,165,186,0.7); margin: 220px 0 0 280px}

.fap img {margin-top: 50px;}

.fap h1 {
	font-size: 44px;
	font-weight: lighter;
	letter-spacing: 6px;
	line-height: 50px;
	padding-top: 20px;
}

.fap p {
	font-size: 23px;
	letter-spacing: 4px;
	line-height: 35px;
	padding-top: 25px;
}





/*---- topbrandbox ----*/
.topbrandbox {
	height: 670px;
	background: #665458;
	text-align: center;
}

.tbtitle li {
	display: inline-block;
	vertical-align: middle;
	margin: 0 15px;
	margin-top: 110px;
}

.hiservice li {
	width: 208px;
	height: 208px;
	border-radius: 50%;
	display: inline-block;
	vertical-align: top;
	margin: 0 20px;
	margin-top: 110px;
	line-height: 32px;
	font-size: 24px;
	letter-spacing: 3px;
	color: #ffffff
}
.hiservice img {padding-top: 30px}
.sv1 {background: #5ca5a5}
.sv2 {background: #395763}
.sv3 {background: #ea8e8c}
.sv4 {background: #d8b213}




/*footer*/
.footer {
	width: 100%;
	margin-top: 0px;
	text-align: center
}
#V_footer {
	display: inline-block;
	margin: 1% 3%;
	vertical-align: middle
}
.logo_wt {width: 150px}
.qq {
	width: 140px;
	height: 45px;
	border-radius: 4px;
	background-color: #fff;
	float: right;
	line-height: 45px;
	margin-right: 8px
}
.qq:hover,.gotrial:hover {
	background-color: rgba(255,255,255,0.5);
}
.qqi {
	font-size: 28px;
	color: #2f70b7;
	float: left;
	margin-left: 14px;
}
.qqt {
	font-size: 20px;
	color: #2f70b7;
	padding-right: 8px
}
.gotrial {
	width: 140px;
	height: 45px;
	border-radius: 4px;
	background-color: #fff;
	float: right;
	line-height: 45px;
}
.ggi {
	font-size: 28px;
	color: #2f70b7;
	float: left;
	margin-left: 14px
}
.ggt {
	font-size: 20px;
	color: #2f70b7;
	padding-right: 8px
}




/*RWD*/
@media screen and (max-width:1600px) {
	.logo {
		margin-left: -47%;
	}
	.formz {
		background-color:rgba(255,255,255,0.2);
		height: auto;
		padding: 33px 0 ;
		position: relative;
		margin: 0 auto;
	}
	.cd-slider {
		position: relative;
		width: 100%;
		height: 90vh;
	}
}

@media screen and (max-width:1550px) {
	.peoplebox {
		margin-left: -500px;
	}
	.peoplebox li {
		padding: 0 40px;
	}
}

@media screen and (max-width:1280px) {
	.logo {
		top: 20%;
		margin-left: 1%;
	}
	.part2_title1 {
		margin-left: -45%;
	}
	.peoplebox {
		margin-left: -550px;
	}
	.part2pic4 {
		width: 58%;
		left: 50%;
		margin-left: -44%;
	}
	.features_p1,.features_p3 {
		width: 72%;
		height: 32vw;
	}
	.features_p2,.features_p4 {
		width: 56%;
		height: 44vw;
	}
	.features_a1,.features_a2,.features_a3,.features_a4 {
		width: 32%;
		height: 45vh;
	}
	.features_p2 { margin: 120px 0 0 -91%}
	.features_p4 { margin: 80px 0 0 -85%}
	
	.features_a2 { margin: 140px 0 0 25%}
	.features_a4 { margin: 220px 0 0 23%}
}


@media screen and (max-width:1180px) {
	.logo {
		top: 2%;
		margin-left: -7%;
	}
	.part2 {
		height: auto;
		padding-bottom: 12%
	}
	.part2_title1 {
		margin-left: -35%;
		top: inherit;
		margin-top: 9%;
	}
	.part2_title2 {
		top: inherit;
		margin-top: 6%;
	}
	.peoplebox {
		position: relative;
		left:inherit;
		margin-left: inherit;
		margin-top: 1%;
	}
	.peoplebox p {
		font-size: 2.5vw;
		line-height: 3.5vw;
		letter-spacing: 0.5vw;
	}
	.peoplebox li {
		padding: 0 2%;
		width: 30%
	}
	.peoplebox img {width: 100%}
	
	.checkbox {
		position: relative;
		top: inherit;
		left: inherit;
		margin-left: 68%;
		margin-top: -30%
	}
	.part2pic4 {
		position: relative;
		left: inherit;
		top: inherit;
		margin-left: 5%;
	}
	
	.youneed {
		font-size: 4.8vw;
		letter-spacing: 1vw;
		padding: 7% 0;
	}
	
	.features_a1,.features_a2,.features_a3,.features_a4 {
		width: auto;
		height: auto;
		padding: 5% 3%
	}
	
	.fap img {margin-top: 0;}
	.fap h1 {
		font-size: 4vw;
		letter-spacing: 0.5vw;
		line-height: 5vw;
		padding-top: 1.5vw;
	}

	.fap p {
		font-size: 1.9vw;
		letter-spacing: 0.3vw;
		line-height: 3.3vw;
		padding-top: 2vw;
	}
	
	.topbrandbox {
		height: auto;
		padding: 10% 0 11% 0
	}
	.tbtitle li {
		margin: 0 15px;
		margin-top: inherit;
		padding-bottom: 6%
	}
	
	.hiservice li {
		margin: 3% 6%
	}

}

@media screen and (max-width:980px) {
	
	.part2 {
		padding-bottom: 42%
	}
	.peoplebox {
		margin-top: 5%
	}
	.peoplebox li {
		padding: 0 3%;
		width: 38%;
		margin-top: 0;
	}
	.spc { 
		padding-top: 18%;
	}
	.peoplebox p {
		font-size: 3.1vw;
		line-height: 4vw;
		letter-spacing: 0.5vw;
	}
	.part2_title2 {
		top: inherit;
		margin-left: -35%;
		margin-top: 9%
	}
	.checkbox {
		margin-left: 40%;
		margin-top: -65%
	}
	.checkbox li {
		font-size: 3.1vw;
		letter-spacing: 0.5vw;
		padding: 0 0 3% 0
	}
	.part2pic4 {
		width: 70%;
		margin-left: 11%;
		margin-top: 15%
	}
	.features_a1,.features_a2,.features_a3,.features_a4 {
		width: auto;
		height: auto;
		padding: 6% 4%
	}
	.fap h1 {
		font-size: 4.4vw;
		letter-spacing: 0.5vw;
		line-height: 5.2vw;
		padding-top: 1.5vw;
	}
	.fap p {
		font-size: 2.4vw;
		letter-spacing: 0.3vw;
		line-height: 3.8vw;
		padding-top: 8%;
	}
	.features_p1,.features_p3 {
		width: 68%;
		height: 40vw;
	}
	.features_p2,.features_p4 {
		width: 50%;
		height: 51vw;
	}
	.features_p1 { margin: 12% 0 0 -15%}
	.features_p2 { margin: 13% 0 0 -91%}
	.features_p3 { margin: 23% 0 0 -21%}
	.features_p4 { margin: 10% 0 0 -85%; background-position:right}
	
	.features_a2 { margin: 15% 0 0 12%}
	.features_a3 { margin: 12% 0 0 0}
	.features_a4 { margin: 20% 0 0 6%}
	
	
}

@media screen and (max-width:880px) {
	.container {display: none}
	.container_m {display: block}
}



@media screen and (max-width:780px) {
	.logo {
		width: 25%;
		margin-left: -12%;
	}
	.logo img {width: 100%}
	
}

@media screen and (max-width:520px) {
	.logo {
		width: 27%;
		margin-left: -42%;
	}
	.part2_title1,.part2_title2 {
		width: 70%;
		margin: 0 auto;
		left: inherit;
		top: inherit;
		margin-top: 13%;
	}
	.peoplebox li {
		padding: 0 2%;
		width: 68%;
		margin-top: 6%
	}
	.spc { 
		padding-top: 0;
	}
	.peoplebox p {
		font-size: 6.8vw;
		line-height: 9vw;
		letter-spacing: 1vw;
		padding: 3% 0 5% 0;
	}
	.checkbox {
		margin: 0 auto;
		margin-top: -110%
	}
	.checkbox li {
		font-size: 6.8vw;
	}
	.part2pic4 {
		width: 85%;
		margin: 0 auto;
		margin-top: 70%
	}
	.part2 {
		padding-bottom: 62%
	}
	
	
	.youneed {
		font-size: 5vw;
		letter-spacing: 1vw;
		padding: 12% 0;
	}
	
	.featuresbox {
		padding: 4% 0 15% 0;
	}
	.features_a1,.features_a2,.features_a3,.features_a4 {
		width: 80%;
		height: auto;
		padding: 10% 4%;
		margin: 0 auto;
		margin-top: 11%
	}
	.fap h1 {
		font-size: 8.5vw;
		letter-spacing: 2vw;
		line-height: 11vw;
		padding-top: 1.8vw;
	}
	.fap p {
		font-size: 5vw;
		letter-spacing: 0.5vw;
		line-height: 8vw;
		padding-top: 6%;
	}
	.features_p1,.features_p2,.features_p3,.features_p4 {
		width: 80%;
		height: 50vw;
		background-size: cover;
		margin: -3% 0 0 0;
	}
	

	.tbtitle li {margin-top: 0}
	
	.onlinetopbrand {
		width: 90%;
	}
	.hitutor_icon {
		width: 50%;
		padding-top: 6%;
	}
}