.banner { width: 100%; height: auto; background-image: url('../image/banner1bg.jpg'); background-repeat: repeat-x; }
.banner #banner_inner { width: 100%; height: auto; position: relative; left: 50vw; margin-left: -50vw; top: 0px; z-index: 0; }
.banner #banner_inner #dts { width: 100%; height: auto; }
.banner #banner_inner #dts a { filter: alpha(opacity=0); opacity: 0; display: none; }
.banner #banner_inner #dts a img { width: 100%; height: auto; }
.banner #banner_inner #xts { list-style: none; width: auto; height: 12px; padding-top: 7px; padding-bottom: 7px; position: absolute; left: 50%; margin-left: 0px; bottom: 6px; z-index: 0; display: none; }
.banner #banner_inner #xts li { float: left; width: 10px; height: 10px; background-color: #B1B1B1; border-style: solid; border-color: #FFFFFF; border-width: 1px 1px 1px 1px; border-radius: 10px; margin-left: 6px; cursor: pointer; }

.flex { flex-wrap: wrap; }

.container { padding: 40px 0; }
.container .container-title { width: 100%; height: auto; margin-bottom: 40px; }
.container .container-title .title { position: relative; margin-bottom: 20px; }
.container .container-title .en { color: #F3F3F3; font-size: 30px; font-weight: bold; white-space: nowrap; }
.container .container-title .cn { position: absolute; font-size: 26px; bottom: -10px; left: 50%; transform: translateX(-50%); white-space: nowrap; }
.container .container-title .ms { font-size: 18px; }
.container-bg { width: 100%; height: auto; background-image: url(../image/whole_house_bg.jpg); background-position: center center; background-repeat: repeat-y; background-size: 100% cover; }

.index1 { width: 100%; height: auto; padding: 8px; box-sizing: border-box; background-color: #808080; }
.index1 a { display: block; width: calc(50% - 4px); margin-bottom: 8px; position: relative; }
.index1 a:nth-child(n+5) { margin: 0; }
.index1 img { display: block; width: 100%; height: 100%; }
.index1 span { font-size: 18px; white-space: nowrap; font-weight: bold; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-shadow: 0 0 4px black; }

.index2 { height: auto; }
.index2 .title { line-height: 40px; /* border-bottom: 1px solid #8B8B8B; */ margin-bottom: 20px; }
.index2 .title .t { font-size: 22px; float: left; }
.index2 .title .t span { color: #8B8B8B; }
.index2 .title .t span .small { font-size: 16px; }
.index2 .title .more { font-size: 14px; float: right; color: #8B8B8B; }
.index2 .i-content，.index2 .i-content .i-con1，.index2 .i-content .i-con2 { width: 100%; }
.index2 .case { width: 95px; position: relative; }
.index2 .case p { width: 100%; position: absolute; bottom: 17px; font-size: 14px; white-space: nowrap; font-weight: bold; color: #F7F7F5; text-shadow: 0 0 4px black; }

.index3 { width: 100%; height: auto; padding: 8px; box-sizing: border-box; background-color: #808080; }
.index3 .img { width: calc(50% - 4px); margin-bottom: 8px; }
.index3 .img img { width: 100%; height: 100%; }
.index3 .iimg { width: 100%; margin-bottom: 8px; }

.index4 .items { display: flex; justify-content: space-between; width: 100%; }
.index4 .items .img { width: 50%; }
.index4 .items .txt { width: 50%; box-sizing: border-box; padding: 15px; position: relative; text-align: left; }
.index4 .items .txt .t { font-size: 12px; color: #059FCF; }
.index4 .items .txt .n { line-height: 1.2; font-size: 12px; margin-top: 10px; transform: scale(0.7); width: 125%; position: absolute; left: -10%; top: 19px; }

.index5 .usright .content { line-height: 1.5; font-size: 14px; text-align: left; margin-top: 10px; }
.index5 .usright .more { display: block; float: right; width: 100px; line-height: 30px; background-color: #e9eaea; border-radius: 25px; margin-top: 10px; }