html,body{
	padding: 0;
	margin: 0;
	font-family:  Arimo, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 16px;
	color: #333;
	overflow-x:hidden;
	background: #FBFBF9;
}
.wrap{
	max-width: 1140px;
	margin: 0 auto;
}
ul{
	padding: 0;
	margin: 0;
}
ul li{
	list-style: none;
}
.fl{
	float: left;
}
.fr{
	float: right;
}
/* 清除浮动*/
.am-fl{float: left}
.am-fr{float: right}
.am-cf:after,.after:after{ content:""; display:block; height:0;clear:both; visibility:hidden;}
.am-cf,.after{zoom:1;}


/*多行溢出*/
	.overflow1{display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	
	.overflow2{display: -webkit-box;overflow: hidden;text-overflow:ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
	
	.overflow3{display: -webkit-box;overflow: hidden;text-overflow:ellipsis; -webkit-box-orient: vertical;-webkit-line-clamp: 3;}
	
	.overflow4{display: -webkit-box;overflow: hidden;text-overflow:ellipsis; -webkit-box-orient: vertical;-webkit-line-clamp: 4;}

	
a,a:hover,a:active,a:visited,a:link,a:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    outline:none;
    text-decoration: none;
}
a,
a:hover,
a:focus {
	text-decoration: none;
	-o-transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
	outline: none;
}
img{
	max-width: 100%;
}

/**导航菜单**/

header{
	background: #fff;
	height: 100px;
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 9999;
}
header .logos{
	width: 55px;
	padding-top: 33px;
	display: none;
}
.logoss{
	width: 128px;
	padding-top: 33px;
	display: block;
}
.bottom_logo img:first-child{
	width: 128px;
	height: 45px;
}
.bottom_logo img:last-child{
	margin: 0px!important;
}
.banquan{
	color: #333;
	font-weight: bold;
}
header .menu{
	text-align: center;
}
header .menu>ul{
	display: block;
	float: right;
}
header .menu>ul>li{
	float: left;
	position: relative
}
header .menu>ul>li>a{
	text-align: center;
	color: #333;
	font-size: 16px;
	display: block;
	position: relative;
	margin:0 0 0 65px;
	padding-top: 44px;
	padding-bottom: 36px;
	line-height: 1;
	position: relative;
	text-transform: uppercase;
}
header .rightDiv .menu>ul>li:hover>a,
header .rightDiv .menu>ul>li.on>a {
	color: #df4d24;
}
header .rightDiv .menu>ul>li>a::after{
    content: "";
    width: 20px;
    height: 3px;
    background: #df4d24;
    left: 50%;
    margin-left: -10px;
    bottom: 19px;
    position: absolute;
    opacity: 0;
    transform: scaleX(0);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    border-radius: 3px;
}
header .rightDiv .menu>ul>li:hover>a::after,
header .rightDiv .menu>ul>li.on>a::after{
	opacity: 1;
    transform: scaleX(1);
}

header .mbtn {
    display: inline-block;
    width: 50px;
    height: 50px;
    background: url(https://snzholding.s3.ap-northeast-2.amazonaws.com/website/img/menu.png) no-repeat center;
    background-size: 22px auto;
    position: absolute;
    top: 0;
    right: 0;
    display: none;
}
header .mbtn:active{
    opacity: .8;
}
body.on-menu header .mbtn{
    background-image: url(https://snzholding.s3.ap-northeast-2.amazonaws.com/website/img/menu-hide.png);
}

/********************************* 首页 **********************************/
.main{
	margin-top: 100px;
	background-color: #fff;
}
.index-banner{
	background: #000;
	height: calc(100vh - 100px);
	position: relative;
}
.index-banner canvas {
	display:block;
}
.index-banner .waves {
	position: relative;
	height: 100%;
	width: 100%;
}
.index-banner .textDiv{
	text-align: center;
	color: #fff;
	position: absolute;
	left: 0;
	width: 100%;
	top: 24.97%;
}
.index-banner .textDiv .line{
	width: 65px;
	height: 3px;
	background: #F8E398;
	margin: 40px auto 26px;
	border-radius: 3px;
}
.index-banner .textDiv img{
	width: 320px;
	height: 126px;
}
.index-banner .textDiv p{
	color: #FAE091;
	line-height: 40px;
	margin: 0 auto;
	max-width: 951px;
}
.index-banner .scroll_a{
	position: absolute;
	left: 50%;
	bottom: 48px;
	margin-left: -15px;
	width: 30px;
	text-align: center;
}

.index-div1{
	padding: 70px 0 179px;
	text-align: center;
	overflow: hidden;
}
.index-title{
	font-size: 36px;
	color: #222222;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 50px;
}
.index-title .line{
	width: 50px;
	height: 2px;
	background: #5B5D68;
	margin: 13px auto 0;
	border-radius: 3px;
}
.index-div1 .textDiv{
	margin-top: 40px;
}
.index-div1 .textDiv p{
	font-size: 18px;
	color: #666;
	line-height: 40px;
	margin: 25px 0;
}

.index-div1 .textDiv .line{
	width: 30px;
	height: 2px;
	background: rgba(112,112,112,0.5019607843137255);;
	margin: 0 auto;
	border-radius: 3px;
}
.index-div1 .textDiv a{
	font-size: 20px;
	color: #0C132E;
	width:190px;
	height:60px;
	border:2px solid #df4d24;
	box-shadow:0px 10px 30px rgba(207,185,130,0.05);
	border-radius:41px;
	display: block;
	margin: 50px auto 0;
	line-height: 56px;
	position: relative;
	overflow: hidden;
	z-index: 2;
}
.yinying .titles{
	font-size: 65px;
}
.index-div1 .textDiv a:before{
	content: '';
	position: absolute;
	width: 10px;
	height: 100%;
    line-height: 3.5;
    color: #fff;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
	left: 130%;
    top: 0;
	background: url(https://snzholding.s3.ap-northeast-2.amazonaws.com/website/img/jt_.png) no-repeat center center;

}
.index-div1 .textDiv a:after{
	content: '';
    position: absolute;
    z-index: -1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.youqing{
	margin: 50px 0px;
}
.lianjie a{
	margin-right: 60px;
	color: #333;
}
.lianjie a:hover{
	color: #df4d24;
}
.index-div1 .textDiv a:hover{
	color: #fff;
	background: #df4d24;
}
.index-div1 .textDiv a:hover:before{
	left: 80%;
}
.yinying .contents{
	font-size: 26px;
	line-height: 25px;
}
.lianjie{
	margin-top: 30px;
}
.lianjie p{
	color: #333333;
	font-size: 22px;
}
.footer{
	/* border-top: 1px solid #333; */
	background: #eee;
	padding: 55px 0 40px;
	color: #fff;
}
.footer .wrap{
	overflow: hidden;
}
.footer .leftDiv ul{
	overflow: hidden;
	margin-bottom: 13px;
}
.footer .leftDiv ul li{
	float: left;
}
.footer .leftDiv ul li a{
	color: #333;
	font-weight: bold;
}
.footer .leftDiv ul li a:hover{
	color: #eee6d0;
}
.footer .leftDiv ul li span{
	display: inline-block;
	margin: 0 20px;
	opacity: .4;
}
.footer .rightDiv a{
	margin-left: 30px;
	display: block;
	float: left;
	color: #fff;
	font-size: 20px;
}
.footer .rightDiv a:hover{
	color: #eee6d0;
}
.bottom_logo img{
	width: 60px;
	height: 60px;
	margin-right: 50px;
}

/*************portfolioDiv*************/
.portfolioDiv{
	text-align: center;
	padding: 69px 0 153px;
}
.portfolioDiv .index-title .line{
	margin-top: 20px;
}
.portfolioDiv .row{
	margin: 47px -31px 0;
}
.portfolioDiv .row>div{
	padding: 0 31px;
	margin-bottom: 38px;
}
.portfolioDiv .row>div a{
	display: block;
	position: relative;
	transition: all .5s;
}
.portfolioDiv .row>div a span{
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 54px;
	height: 34px;
	line-height: 30px;
	background: #D6C07C;
	display: none;
}
.portfolioDiv .row>div a>img{
	filter:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="grayscale"><feColorMatrix type="matrix" values="0.3333" 0.3333="" 0="" 10=""></feColorMatrix></filter></svg>#grayscale'); /* Firefox 3.5+, IE10 */
	filter:gray; /* IE6-9 */
	-webkit-filter:grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
	-webkit-backface-visibility: hidden; /* Fix for transition flickering */
}
.portfolioDiv .row>div a:hover{
	background: #fff;
	/*box-shadow:0px 5px 15px rgba(217,217,194,0.15);*/
    -webkit-box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
    -moz-box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
    box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
}
.portfolioDiv .row>div a:hover span{
	display: block;
}
.portfolioDiv .row>div a:hover>img{
	filter: none;
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
}

/*************pool*************/
.poolDiv{
	text-align: center;
	padding: 73px 0 123px;
}
.poolDiv .index-title .line{
	margin-top: 20px;
}
.poolDiv .row{
	margin: 85px -31px 0;
}
.poolDiv .row>div{
	padding: 0 31px;
	margin-bottom: 38px;
}
.poolDiv .row>div a{
	display: block;
}
.poolDiv .row>div .imgDiv{
	position: relative;
	border: 1px solid #DFDFDF;
	transition: all .5s;
}
.poolDiv .row>div .imgDiv .tag{
	position: absolute;
	right: 0;
	top: 0;
	z-index: 9;
}
.poolDiv .row>div .imgDiv span{
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 54px;
	height: 34px;
	line-height: 30px;
	background: #D6C07C;
	display: none;
}
.poolDiv .row>div .imgDiv>img{
	filter:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="grayscale"><feColorMatrix type="matrix" values="0.3333" 0.3333="" 0="" 10=""></feColorMatrix></filter></svg>#grayscale'); /* Firefox 3.5+, IE10 */
	filter:gray; /* IE6-9 */
	-webkit-filter: grayscale(100%); /* Chrome 19+ &amp; Safari 6+ */
	-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
	-webkit-backface-visibility: hidden; /* Fix for transition flickering */
}
.poolDiv .row>div a:hover .imgDiv{
	background: #fff;
	border:1px solid rgba(207,185,130,1);
    -webkit-box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
    -moz-box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
    box-shadow: rgba(0,0,0,.05) 0px 0px 30px;
}
.poolDiv .row>div a:hover .imgDiv span{
	display: block;
}
.poolDiv .row>div a:hover .imgDiv>img{
	filter: none;
	-webkit-filter: grayscale(0%);
}
.poolDiv .row>div .textDiv{
	font-size: 16px;
	color: #222222;
	margin-top: 10px;
}
.poolDiv .row>div a:hover .textDiv{
	color: #D6C07C;
}

/*************COMMUNITY*************/
.communityDiv{
	text-align: center;
	padding: 70px 0 180px;
	overflow-y: hidden;
}
.communityDiv .index-title .line{
	margin-top: 20px;
}
.communityDiv .textDiv{
	font-size:18px;
	color: #666;
	line-height: 40px;
	margin-top: 20px;
}
.communityDiv .mapDiv{
	text-align: center;
	position: relative;
	max-width: 1140px;
	width: 80%;
	margin: 44px auto 0;
}
.communityDiv .mapDiv .text{
	color: #FBFBF9;
	font-size: 16px;
	background: #CFB982;
	padding: 0 5px;
	border-radius: 3px;
	position: absolute;
    left: -55px;
    top: 13px;
    z-index: 1;
}

.communityDiv .mapDiv .addDiv1{
	position: absolute;
	left: 6.2%;
	top: 18.9%;
}
.communityDiv .mapDiv .addrDiv2{
	position: absolute;
	left: 34.3%;
	top: 28.2%;
}
.communityDiv .mapDiv .addrDiv2 .text{
	left: -85px;
}
.communityDiv .mapDiv .addrDiv3{
	position: absolute;
	left: 42.97%;
	top: 24%;
}
.communityDiv .mapDiv .addrDiv3 .text{
	right: -65px;
	left: auto;
}
.communityDiv .mapDiv .addrDiv4{
	position: absolute;
	left: 44%;
	top: 35%;
}
.communityDiv .mapDiv .addrDiv4 .text{
	left: -95px;
}
.communityDiv .mapDiv .addrDiv5{
	position: absolute;
	left: 46.1%;
	top: 32.8%;
}
.communityDiv .mapDiv .addrDiv5 .text{
	right: -85px;
	left: auto;
}
.communityDiv .mapDiv .addrDiv6{
	position: absolute;
	left: 63.3%;
	top: 32%;
}
.logo{
	/* width: 89px;
	height: 48px; */
}
.communityDiv .mapDiv .addrDiv6 .text{
	left: 42px;
	width: 114px;
}

 .has-animations .is-revealing{
	visibility: hidden
}

body:after {
    content: '';
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .8);
    display: none;
}
body.on-menu:after {
    display: block;
}

@media only screen and (max-width: 1660px) {
	.selector.open li input + label{width: 160px;height: 160px;line-height: 160px;margin-left: -80px;}
	.selector li input + label{bottom: 240%;}
	.selector.open li input + label img{padding: 8px;}
}

@media only screen and (max-width: 1440px) {
	.selector.open li input + label{width: 140px;height: 140px;line-height: 140px;margin-left: -70px;}
	.selector li input + label{bottom: 190%;}
	.selector.open li input + label img{padding: 7px;}
	.selector.open button:after{width: 67px;height: 73px;left: -11px;top: -12px;}
	.selector button img{transform: scale(.8);}
}

@media only screen and (max-width: 1400px) {
	.selector.open li input + label{width: 130px;height: 130px;line-height: 130px;margin-left: -65px;}
	.selector li input + label{bottom: 180%;}
	.selector.open li input + label img{padding: 6px;}
	.selector.open button:after{width: 67px;height: 73px;left: -11px;top: -12px;}
	.selector button img{transform: scale(.8);}
}

@media only screen and (max-width: 1366px) {
	.selector.open li input + label{width: 110px;height: 110px;line-height: 110px;margin-left: -55px;}
	.selector li input + label{bottom: 170%;}
	.selector.open li input + label img{padding: 6px;}
	.selector.open button:after{width: 67px;height: 73px;left: -11px;top: -12px;}
	.selector button img{transform: scale(.8);}
}
@media only screen and (max-width: 1280px) {
	.selector.open li input + label{width: 100px;height: 100px;line-height:100px;margin-left: -50px;}
	.selector li input + label{bottom: 150%;}
	.selector.open li input + label img{padding: 5px;}
	.selector.open button:after{width: 47px;height: 53px;left: -3px;top: -3px;}
	.selector button img{transform: scale(.6);}
}
@media only screen and (max-width: 1200px) {
	.selector.open li input + label{width: 100px;height: 100px;line-height:100px;margin-left: -50px;}
	.selector li input + label{bottom: 150%;}
	.selector.open li input + label img{padding: 5px;}
	.selector.open button:after{width: 47px;height: 53px;left: -3px;top: -3px;}
	.selector button img{transform: scale(.6);}
}

@media (min-width:992px) and (max-width:1070px) {
	.wrap{
		padding: 0 10px;
	}
}
@media (min-width:768px) and (max-width:991px) {
	.wrap{
		padding: 0 10px;
	}
}

/*手机*/
@media (max-width:767px) {
	.lianjie{
		width: 100%;
	}
	.lianjie a{
		display: block;
		width: 100%;
		margin: 15px 0px;
	}
	.titles{
		font-size: 35px!important;
	}
	.index-banner .textDiv p{
		font-size: 16px;
	}
	.index-banner .scroll_a{
		left: 53%;
		width: 20px;
		bottom: 2%;
	}
	.index-banner .textDiv .line{
		margin: 22px auto 20px;
	}
	.index-banner .textDiv p{
		line-height: 24px;
	}
	.bottom_logo{
		width: 100%;
		margin-bottom: 30px;
	}
	.bottom_logo img:last-child{
		/* margin: 0px!important; */
		/* margin-right: 30px; */
	}
	header .logos{
		width: 90px;
		padding: 0%;
		display: block;
	}
	.logoss{
		width: 36px;
		padding: 0%;
		display: none;
	}
	header {
		position: fixed !important;
		z-index: 9999;
		top: 0;
		left: auto;
		right: 0;
		width: 100%;
		height: 50px;
		padding: 0;
		transition: right 300ms !important;
	}
	header .logo {height: 50px;line-height: 45px;padding: 0 0 0 10px;width: initial;}
	header .logo img {max-height: 75%;margin-top: 7px;}
	body.on-menu header {right: 60%;}
	header .mbtn {display: block;}
	header .menu {
		float: right;
		position: fixed;
		top: 0;
		right: 0;
		width: 60%;
		height: 100%;
		padding-top: 0;
		background-color: rgba(255,255,255,.9);
		transition: right 300ms;
		right: -60%;
		padding: 0;
		overflow-y: auto;
		margin-top: 0;
	}
	header .menu ul li {
		padding: 0;
		border-bottom: 1px solid #333;
		float: none;
	}
	header .menu ul li a {
		display: block;
		line-height: 50px;
		height: 50px;
		text-align: center;
		padding: 0;
		font-weight: normal;
		margin: 0;
	}
	.header .menu ul:last-child li a{
		height: 0px;
		padding-top: 0px!important;
	}
	header .menu ul {float: initial;margin-right: 0;}
	header .menu ul li.on a {background: none;}
	body.on-menu header .menu {right: 0;}
	body.on-menu .main {right: 60%;}
	header .rightDiv .menu ul li:hover>a,header .rightDiv .menu ul li.on>a{color: #fff;}
	header .rightDiv .menu>ul>li>a::after{display: none;}

	.main {position: relative;right: 0;transition: right 300ms !important;margin-top: 50px;}
	.wrap{padding: 0 10px;}
	.navs{
		background-color: #000!important;
	}
	
	.languages{
		padding-top: 24px!important;
		text-align: center;
	}
	.language{
		width: 0px!important;
		height: 0px!important;
		line-height: 0px!important;
		border: 0px!important;
		display: block;
		margin: 0 auto;
	}
	.logo{ width: 89px; height: 48px; }
	.index-banner{height: auto;padding: 34% 0px;}
	.index-banner .textDiv img{width: 30%;height: auto;}
	/* .index-banner .textDiv p{font-size: 16px;} */
	.index-div1{padding: 35px 0 90px;}
	.index-div1 .index-title{font-size: 30px;}
	.portfolioDiv{padding: 35px 0 75px;}
	.portfolioDiv .row{margin: 27px 0 0;}
	.portfolioDiv .row>div{padding: 0 10px;}
	.portfolioDiv .row>div a span,.poolDiv .row>div .imgDiv span{width: 38px;height: 25px;line-height: 20px;}
	.index-title{font-size: 30px;}
	.footer .wrap{text-align: center;}
	.footer .leftDiv{float: initial;}
	.footer .leftDiv ul{display: inline-block;}
	.footer .leftDiv ul li span{margin: 0 10px;}
	.footer .rightDiv{float: initial;margin-top: 10px;}
	.footer .rightDiv a{display: inline-block;float: initial;margin: 0 10px;}
	.poolDiv{padding: 35px 0 60px;}
	.poolDiv .row{margin: 40px -10px 0;}
	.poolDiv .row>div{padding: 0 10px;margin-bottom: 20px;}
	.poolDiv .index-title .line{margin-top: 10px;}
	.communityDiv{padding: 35px 0 80px;}
	.communityDiv .mapDiv .text{font-size: 14px;left: -45px;}
	.scrollDiv{width: 100%;overflow-x: auto;}
	.scrollDiv .mapDiv{min-width: 900px;margin-left: 20%;}
	.communityDiv .mapDiv .addrDiv2 .text{left: -65px;}
	.communityDiv .mapDiv .addrDiv4 .text{left: -75px;}
	.communityDiv .mapDiv .addrDiv3 .text{right: -50px;}
	.communityDiv .mapDiv .addrDiv5 .text{right: -65px;}
	.communityDiv .mapDiv .addrDiv6 .text{left: -25px;}
}
