section.banner-index {
	position: relative;
	display: block;
	overflow: hidden;
	width: 100%;
	height: 100%;
	min-height: 640px;
	color: #fff
}

section.banner-index>.bg {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	z-index: -1;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover
}
.part-bg1{
	background-image: url(./join/ico-gb1.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
.part-bg2{
	background-image: url(./join/ico-gb2.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
.part-bg3{
	background-image: url(./join/ico-gb3.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
.part-bg4{
	background-image: url(./join/ico-gb4.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
.part-bg5{
	background-image: url(./join/ico-gb5.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
.part-bg6{
	background-image: url(./join/ico-gb6.png);
	background-repeat:no-repeat;  
    background-size:100%; 
}
section.banner-index>.mask {
	
	/*background-color: rgba(0, 0, 0, 0.5);
	background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
	background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
	background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
	background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5)));
	background-image: linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));*/
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%
}

section.banner-index>.text {
	position: absolute;
	top: auto;
	right: auto;
	bottom: 50%;
	left: 50%;
	z-index: auto;
	width: 1200px;
	max-width: 100%;
	-webkit-transform: translate3d(-50%, 50%, 0);
	-moz-transform: translate3d(-50%, 50%, 0);
	-ms-transform: translate3d(-50%, 50%, 0);
	-o-transform: translate3d(-50%, 50%, 0);
	transform: translate3d(-50%, 50%, 0);
	text-align: center;
	-webkit-text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
	-moz-text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5)
}

section.banner-index>.text>h1,section.banner-index>.text>h1>* {
	font-size: 50px;
	margin-bottom: 20px
}

section.banner-index>.text>h3,section.banner-index>.text>h3>* {
	font-size: 32px;
	margin-bottom: 40px
}

section.banner-index>.text>h5,section.banner-index>.text>h5>* {
	font-size: 20px;
	line-height: 1.8em;
	font-weight: 400
}

section.banner-index>.logo {
	position: absolute;
	top: -40px;
	right: auto;
	bottom: auto;
	left: 50%;
	z-index: auto;
	width: 100%;
	height: -webkit-calc(100% + 80px);
	height: -moz-calc(100% + 80px);
	height: calc(100% + 80px);
	background-image: url(./logo/logo_bg_w@1x.png);
	background-repeat: no-repeat;
	background-position: left center;
	-webkit-background-size: contain contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain
}

@media (max-width: 992px) {
	section.banner-index {
		min-height: 100%
	}
	section.banner-index>.text>h1,section.banner-index>.text>h1>* {
		font-size: 42px
	}
	section.banner-index>.text>h3,section.banner-index>.text>h3>* {
		font-size: 28px
	}
	section.banner-index>.text>h5,section.banner-index>.text>h5>* {
		font-size: 16px;
		padding: 0 20px
	}
}

@media (max-width: 768px) {
	section.banner-index {
		min-height: 100%
	}
	section.banner-index>.text>h1,section.banner-index>.text>h1>* {
		font-size: 28px
	}
	section.banner-index>.text>h3,section.banner-index>.text>h3>* {
		font-size: 18px
	}
	section.banner-index>.text>h5,section.banner-index>.text>h5>* {
		font-size: 14px;
		padding: 0 20px
	}
	section.banner-index>.logo {
		position: absolute;
		top: 0;
		right: auto;
		bottom: auto;
		left: 13%;
		z-index: auto;
		width: 120%;
		height: -webkit-calc(120% + 80px);
		height: -moz-calc(120% + 80px);
		height: calc(120% + 80px)
	}
}

section.home div.title1 {
	position: relative;
	margin-bottom: 40px;
	text-align: center
}

section.home div.title>h3 {
	font-size: 32px;
	line-height: 40px;
	display: inline-block;
	width: 200px;
	margin: 0 20px
}

section.home h4 {
	font-size: 32px;
	line-height: 40px;
	display: inline-block;
	
	margin: 0 20px
}
.builder{
	text-align: center;
	padding: 80px;
	background: #fff;
}
.builder .h1{
	color: #222;
	margin-bottom: 20px;
}
@media (max-width: 768px){
	.builder{
		text-align: center;
		padding: 40px;
		background: #fff;
	}
	.builder .h1,.h2{
		font-size: 20px;
	}
}
section.home div.title>hr {
	position: absolute;
	top: 0;
	right: auto;
	bottom: auto;
	left: 50%;
	z-index: auto;
	width: 2px;
	height: 40px;
	display: inline-block;
	margin: 0;
	border: none;
	background-color: #00b7ee
}

@media (max-width: 768px) {
	section.home div.title>h3 {
		text-align: center !important;
		display: block;
		width: auto
	}
	section.home h4 {
		text-align: center !important;
		display: block;
		width: auto
	}
	section.home div.title>hr {
		display: none
	}
}

section.advantage-index {
	overflow: hidden;
	width: 100%;
	padding: 40px 0 100px;
	color: #fff;
	background-color: #222
}

section.advantage-index div.content .owl-stage-outer {
	overflow: visible !important
}

section.advantage-index div.content div.owl-dots {
	position: absolute;
	top: auto;
	right: auto;
	bottom: -60px;
	left: 50%;
	z-index: auto;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%)
}

section.advantage-index div.content div.owl-dots>.owl-dot {
	display: inline-block;
	margin: 0 5px
}

section.advantage-index div.content div.owl-dots>.owl-dot span {
	display: block;
	border: 2px solid #fff;
	background: #fff;
	width: 13px;
	height: 13px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px
}

section.advantage-index div.content div.owl-dots>.owl-dot.active>span {
	background: #00b7ee
}

section.advantage-index div.content div.items div.item {
	position: relative;
	padding: 160px 10px 10px;
	text-align: center
}



section.advantage-index div.content div.items div.item>h3 {
	font-size: 28px;
	margin-bottom: 10px
}

section.advantage-index div.content div.items div.item>h5 {
	color: #222;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 40px;
}

section.advantage-index div.content div.items div.item>h6 {
	font-size: 16px;
	font-weight: 300
}

section.advantage-index div.content div.items div.item>span {
	position: absolute;
	top: 0;
	left: 50%;
	display: block;
	width: 120px;
	height: 120px;
	margin-left: -60px;
	background-position:100% 0%; 
}
section.advantage-index div.content div.items div.item>span:hover{
	background-position:0% 0%; 
	
}
.icon-focus{
	background-image: url("./join/advantage-1.png");
	
}
.icon-specially{
	background-image: url("./join/advantage-2.png");
}
.icon-outstanding{
	background-image: url("./join/advantage-3.png");
}
.icon-trust{
	background-image: url("./join/advantage-4.png");
}

section.link-index {
	background: #fff;
	padding: 40px 20px
}

section.link-index div.link {
	position: relative;
	width: auto;
	height: auto
}

section.link-index div.link div.container-link {
	width: auto;
	height: 420px;
	position: relative;
	text-align: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	align-items: center;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex
}

section.link-index div.link div.container-link::-webkit-scrollbar {
	display: none
}

section.link-index div.link div.items {
	width: 200px;
	height: 100px;
	margin: 20px 40px
}

section.link-index div.link div.items>a {
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999em;
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: contain contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	-webkit-filter: gray;
	filter: gray
}

section.link-index div.link div.items>a:hover,
section.link-index div.link div.items>a.touch {
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	-ms-filter: grayscale(0);
	-o-filter: grayscale(0);
	filter: grayscale(0);
	-webkit-filter: gray;
	filter: gray
}

@media (max-width: 768px) {
	section.link-index div.link {
		width: 100%;
		height: 210px
	}
	section.link-index div.link div.container-link {
		height: 210px
	}
	section.link-index div.link div.items {
		width: 120px;
		height: 60px;
		margin: 5px 10px
	}
}