﻿body,
html {
	width: 100%;
	overflow-x: hidden;
	font: calc(100vw / 120) arial;
	/* min-width: 1345px; */
}

/* 清除内外边距 */
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
/* structural elements 结构元素 */
dl,
dt,
dd,
ul,
ol,
li,
/* list elements 列表元素 */
pre,
/* text formatting elements 文本格式元素 */
fieldset,
lengend,
button,
input,
textarea,
/* form elements 表单元素 */
th,
td,
/* table elements 表格元素 */
div {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

a:focus {
	outline: none;
}

/* 设置默认字体 */
body,
button,
input,
select,
textarea {
	font: 12px/1 "Microsoft YaHei", Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;
	/* 用 ascii 字符表示，使得在任何编码下都无问题 */
}

body,
a {
	color: #666;
}

h1 {
	font-size: 18px;
	/* 18px / 12px = 1.5 */
}

h2 {
	font-size: 16px;
}

h3 {
	font-size: 14px;
}

h4,
h5,
h6 {
	font-size: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: normal;
}

i,
em,
b {
	font-style: normal;
}

address,
cite,
dfn,
em,
var {
	font-style: normal;
}

/* 将斜体扶正 */
code,
kbd,
pre,
samp,
tt {
	font-family: "Courier New", Courier, monospace;
}

/* 统一等宽字体 */
small {
	font-size: 12px;
}

/* 小于 12px 的中文很难阅读，让 small 正常化 */
/* 重置列表元素 */
ul,
ol {
	list-style: none;
}

/* 重置浏览器默认样式 select */
select,
option,
option select {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}

/* 重置文本格式元素 */
a {
	text-decoration: none;
	outline: none;
	blur: expression(this.onFocus=this.blur());
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-tap-highlight-color: transparent;
}

/*a:hover { text-decoration: underline;}*/
abbr[title],
acronym[title] {
	/* 注：1.ie6 不支持 abbr; 2.这里用了属性选择符，ie6 下无效果 */
	border-bottom: 1px dotted;
	cursor: help;
}

q:before,
q:after {
	content: '';
}

/* 重置表单元素 */
legend {
	color: #000;
}

/* for ie6 */
fieldset,
img {
	border: none;
	/* img 搭车：让链接里的 img 无边框  注：optgroup 无法扶正*/
}

button,
input,
select,
textarea {
	font-size: 100%;
	/* 使得表单元素在 ie 下能继承字体大小 */
}

/* 重置表格元素 */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

table th,
table td {
	border: 1px solid #ddd;
}

/* 重置 hr */
hr {
	border: none;
	height: 1px;
}

/* 表单 在浏览器上的默认样式*/
input,
input:focus,
button,
button:focus,
textarea,
textarea:focus {
	outline: none;
	border: none;
}

/* 让非ie浏览器默认也显示垂直滚动条，防止因滚动条引起的闪烁 */
html {
	overflow-y: scroll;
}

/* ie7以下两个以上的 li浮动产生的空白间隙bug */
li {
	+vertical-align: top;
	_vertical-align: top;
}

/* ie下li元素的内联元素底部产生空白 */
li * {
	*zoom: 1;
}

* {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

/* ie下图片标签上有空白 */
img {
	vertical-align: middle;
	*vertical-align: top;
}

/* ie下input标签文本居中 */
input {
	vertical-align: middle;
}

input[type=number] {
	-moz-appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* 以下为自用公共样式 */
/* 浮动 */
.fl,
.fl-li li,
.fl-a {
	float: left;
	_display: inline;
}

.fr,
.fr-li li,
.fr-a {
	float: right;
	_display: inline;
}

.w1200 {
	width: 1200px;
	margin: 0 auto;
}

.padd {
	padding: 0.1px;
}

.opacity {
	filter: alpha(opacity=80);
	/* IE */
	-moz-opacity: 0.8;
	/* 老版Mozilla */
	-khtml-opacity: 08;
}

/* 清除浮动 */
.cb:after {
	content: ".";
	display: block;
	height: 0px;
	overflow: hidden;
	visibility: hidden;
	clear: both;
}

/* 内联块级元素 */
.ib,
.flexslider .hd ul li {
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

.transition {
	transition: all .5s cubic-bezier(0, 0.93, 1, 1);
	-webkit-transition: all .5s cubic-bezier(0, 0.93, 1, 1);
	-moz-transition: all .5s cubic-bezier(0, 0.93, 1, 1);
	-ms-transition: all .5s cubic-bezier(0, 0.93, 1, 1);
	-o-transition: all .5s cubic-bezier(0, 0.93, 1, 1);
}

.db {
	display: block;
}

.th {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.es {
	overflow: hidden;
	display: -webkit-box;
	text-align: justify;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.wh {
	width: 100%;
	height: 100%;
}

.w {
	width: 100%;
}

.h {
	height: 100%;
}

.pr {
	position: relative;
}

.oh {
	overflow: hidden;
}

.br {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000, endColorstr=#BF000000);
}

.bg {
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.container {
	padding-left: 16.65%;
	padding-right: 16.65%;
	padding-top: .1px;
}

.df {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}

.fz {
	font-size: 0;
}

.align-center {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}

.df-between {
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-justify-content: space-between;
}

.df-justify-center {
	justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
}

.df-flex-auto {
	-webkit-box-flex: auto;
	/* OLD - iOS 6-, Safari 3.1-6 */
	-moz-box-flex: auto;
	/* OLD - Firefox 19- */
	-webkit-flex: auto;
	/* Chrome */
	-ms-flex: auto;
	/* IE 10 */
	flex: auto;
}

.df-flex-1 {
	-webkit-box-flex: 1;
	/* OLD - iOS 6-, Safari 3.1-6 */
	-moz-box-flex: 1;
	/* OLD - Firefox 19- */
	-webkit-flex: 1;
	/* Chrome */
	-ms-flex: 1;
	/* IE 10 */
	flex: 1;
}

.df-shrink {
	flex-shrink: 0;
	-webkit-flex-shrink: 0;
	-ms-flex-negative: 0;
}

.flex-wrap {
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.text-center {
	text-align: center;
}

.title {
	line-height: 1.5;
}

.text-center {
	text-align: center;
}

.hide {
	display: none;
}

.op {
	opacity: 0;
}

/*公共样式结束*/
/*header*/
#header {}

.mobile-logo {
	display: none;
}

.mobile-btn-all {
	width: 25px;
	height: 25px;
	position: fixed;
	top: 35px;
	right: 2.7%;
	z-index: 99999999999;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-50%);
}

.mobile-btn-all a {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	transition: all .3s;
}

.mobile-btn-all a svg {
	width: 100%;
	height: 100%;
	fill: #fff;
}

.mobile-btn-all #btn-close {
	opacity: 0;
	visibility: hidden;
	transform: scale(0);
}

.mobile-btn-all.on #btn-close {
	opacity: 1;
	visibility: visible;
	transform: scale(1);
}

.mobile-btn-all.on #btn-close svg {
	fill: #fff;
}

.mobile-btn-all.on #btn-open {
	transform: scale(0);
	opacity: 0;
	visibility: hidden;
}

.mobile-nav {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: -100%;
	z-index: 999999;
	opacity: 0;
	visibility: hidden;
	background-color: rgba(51, 51, 51, .3);
	transition: all .5s ease-out;
}

.mobile-nav ul {
	width: 85%;
	height: 100%;
	padding: 5%;
	background-color: #fff;
	overflow-y: auto;
	overflow-x: hidden;
}

.mobile-nav ul li {
	width: 100%;
	margin-bottom: 10%;
	padding-left: 10%;
	border-bottom: 1px solid #e6e6e6;
	padding-bottom: 10%;
}

.mobile-nav ul li>a {
	display: block;
	width: 100%;
	font-size: 16px;
	color: #333;
}

.mobile-nav.on {
	opacity: 1;
	left: 0;
	visibility: visible;
}

/*header*/
/*footer*/
#footer {}

/*footer*/
@media (max-width:1400px) {
	.zd-fz-12 {
		font-size: 12px !important;
	}

	.zd-fz-13 {
		font-size: 13px !important;
	}

	.zd-fz-14 {
		font-size: 14px !important;
	}

	.zd-fz-15 {
		font-size: 15px !important;
	}

	.zd-fz-16 {
		font-size: 16px !important;
	}

	.zd-fz-17 {
		font-size: 17px !important;
	}

	.zd-fz-18 {
		font-size: 18px !important;
	}

	.zd-fz-19 {
		font-size: 19px !important;
	}

	.zd-fz-20 {
		font-size: 20px !important;
	}

	html,
	body {
		font-size: calc(100vw / 100);
	}

	.container {
		padding-left: 4%;
		padding-right: 4%;
	}

	#superContainer .section-4 .index-case-2 li a {
		padding-top: 4rem;
	}


}

@media (max-width:1024px) {
	.ipad-fz-12 {
		font-size: 12px !important;
	}

	.ipad-fz-13 {
		font-size: 13px !important;
	}

	.ipad-fz-14 {
		font-size: 14px !important;
	}

	.ipad-fz-15 {
		font-size: 15px !important;
	}

	.ipad-fz-16 {
		font-size: 16px !important;
	}

	.ipad-fz-17 {
		font-size: 17px !important;
	}

	.ipad-fz-18 {
		font-size: 18px !important;
	}

	.ipad-fz-19 {
		font-size: 19px !important;
	}

	.ipad-fz-20 {
		font-size: 20px !important;
	}

	.none {
		display: none;
	}

	html,
	body {
		font-size: 78%;
	}



}

@media (max-width:996px) {
	#superContainer .section-2 .about-box .img{
		width: 50%;
	}
	#superContainer .section-2 .about-box .left{
		width: 50%;
	}
	.message-img {
		width: 100%;
		display: block;
	}

	.page-message .form-box {
		width: 100%;
	}

	.page-project-display-dateils .top-img .left {
		width: 100%;
	}

	.page-project-display-dateils .top-img .right {
		width: 100%;
	}

	.df {
		flex-wrap: wrap;
	}

	.page-dateils-box .det-page p {
		width: 100%;
	}

	.page-dateils-box .det-page p:nth-child(2) {
		margin-top: 10px;
	}

	.page-dateils-box .det-page a:last-child em {
		padding-left: 0;
	}

	#superContainer .section-4 .index-case-2 li .desc {
		font-size: 14px;
	}

	.section {
		background-size: cover !important;
	}

	#superContainer .section-3 .index-case-1 li .desc {
		padding: 0 1.375rem;
	}

	.mobile-btn-all {
		opacity: 1;
		visibility: visible;
	}
}

@media (max-width:768px) {
	.page-project-display-dateils .bottom-info .content .img_block {
		width: 100%;
	}

	.page-project-display-dateils .bottom-info .tab {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
	}

	.page-project-display-dateils .bottom-info .tab a {
		width: 100%;
	}

	.page-project-display-dateils .bottom-info .content .img_flex {
		width: 100%;
	}

	.page-case-box li .img-box {
		width: 100%;
		height: 300px;
		margin-bottom: 20px;
	}

	#superContainer .section-2 .about-box .left .title {
		font-size: 2rem;
	}

	#superContainer .section-2 .about-box .left .title em {
		font-size: 20px;
	}

	.section.section-1 {
		height: 100vh;
	}

	.pc-header .container {
		padding-top: 0;
	}

	.pc-header {
		background-color: rgba(0, 0, 0, 0.6);
		height: 6.25rem;
	}

	#superContainer .section-5 .index-contact {
		padding: 20px;
	}

	.section-5 {
		padding: 30px 0;
	}

	#superContainer .section-5 .right {
		width: 100%;
	}

	#superContainer .section-4 {
		padding-bottom: 40px;
	}

	#superContainer .section-4 .index-case-2 li .desc {
		height: auto;
	}

	#superContainer .section-4 .index-case-2 li {
		width: 100%;
	}

	#superContainer .section-3 {
		background-size: cover !important;
	}

	#superContainer .section-3 .index-case-1 li .title {
		margin-bottom: 1rem;
		font-size: 22px;
	}

	#superContainer .section-3 .index-case-1 li .desc {
		padding: 0 15px;
		height: 150px;
	}

	#superContainer .section-3 {
		padding: 30px 0;
	}

	#superContainer .section-3 .index-case-1 li {
		width: 100%;
		padding: 20px 0;
	}

	.section {
		height: auto;
	}

	#superContainer .section-2 .about-box .left .desc {
		padding-bottom: 20px;
	}

	.section .box-wrap {
		position: relative;
	}

	#superContainer .section-2 {
		padding: 30px 0;
	}

	.index-footer {
		position: relative;
		background-color: #0089E1;
		padding: 10px 0;
	}

	#superContainer .section-1 .banner-txt .box p {
		font-size: 22px;
	}

	#superContainer .section-1 .banner-txt .box p {
		width: 90%;
	}

	#superContainer .section-1 .banner-txt .box img {
		width: 70vw;
	}

	.op {
		opacity: 1;
	}

	#superContainer .section-2 .about-box {
		padding-top: 0;
	}

	#superContainer .section-2 .about-box .left {
		padding-right: 0;
	}

	.df {
		flex-wrap: wrap;
	}

	#superContainer .section-2 .about-box .img {
		width: 100%;
	}

	.pc-header .menu-btn {
		display: none;
	}

	.df-between {
		flex-wrap: wrap;
	}

	.message-img {
		width: 100%;
		display: block;
	}

	.page-message .form-box {
		width: 100%;
	}

	.page-house-type-img-box .ul li {
		width: 50%;
	}

	.page-news-box .ul li {
		width: 100%;
	}

	.page-footer .info.right .banquan {
		line-height: 1.5;
	}

	.page-footer .info.right em {
		width: 100%;
	}

	.page-footer .info {
		flex-wrap: wrap;
	}

	.page-footer .info em {
		margin-top: 10px;
	}

	.logo {
		width: 150px;
	}

	.page-nav .crumbs {
		display: none;
	}

	.mb-fz-12 {
		font-size: 12px !important;
	}

	.mb-fz-13 {
		font-size: 13px !important;
	}

	.mb-fz-14 {
		font-size: 14px !important;
	}

	.mb-fz-15 {
		font-size: 15px !important;
	}

	.mb-fz-16 {
		font-size: 16px !important;
	}

	.mb-fz-17 {
		font-size: 17px !important;
	}

	.mb-fz-18 {
		font-size: 18px !important;

	}


	.mb-fz-19 {
		font-size: 19px !important;
	}

	.mb-fz-20 {
		font-size: 20px !important;
	}

	.container {
		padding-left: 2%;
		padding-right: 2%;
	}




}