html{font-size: 100px;}
body{
  font-size: 12px;
  font-family: PingFang SC, PingHei, STHeitiSC-Light, Myriad Set Pro, Lucida Grande, Helvetica Neue, Helvetica, microsoft yahei, SimHei, tahoma, Arial, Verdana, sans-serif;
  /* min-width: 1320px!important; */
}
@font-face {  
  font-family: "BellaGothic";  
  src: url("../../../Public/Hero/cookieM/css/fonts/BellaGothic.ttf");  
}
/* banner */
.banner{
  height: calc(100vh - 100px);
  position: relative;
}
.bannerVideo {
  width: 100%;
  height: calc(100vh - 98px);
  object-fit: cover;
}
.banner-sec{
  width: 40.42vw;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right: 9vw;
}
.banner-lit{
  font-weight: 350;
  font-size: 21px;
  color: #FFFFFF;
  line-height: 32px;
  text-align: center;
}
.banner-title{
  font-weight: 500;
  font-size: 26px;
  color: #FFFFFF;
  line-height: 32px;
  text-align: center;
}
.banner-btn{
  width: 215px;
  height: 40px;
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  font-weight: 600;
  font-size: 12px;
  color: #000000;
  line-height: 14px;
  text-align: center;
  margin:20px auto;
  line-height: 40px;
  cursor: pointer;
}
.banner-sum{
  font-weight: 350;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 23px;
  text-align: center;
}
/* IDEO设计大作 */
.section1{
  background-color: #181612;
  padding: 150px 0;
}
.section1-top{
  width: 1140px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin:0 auto;
}
.section1-top .left{
  width: 683px;
}
.section1-gran{
  font-weight: 400;
  font-size: 14px;
  color: #CB8C78;
  line-height: 21px;
}
.section1-h2{
  font-weight: 400;
  font-size: 42px;
  color: #D3CBC4;
  line-height: 55px;
  margin:20px 0 45px;
}
.section1-lit{
  font-weight: 400;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
  margin-bottom: 50px;
}
.section1-sumy{
  font-weight: 400;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
}
.section1-img{
  display: block;
  width: 139px;
  margin:20px 0 50px;
}
.section1-gray{
  font-size: 12px;
  color: #46484A;
  line-height: 18px;
}
.myVideo2{
  height: 348px;
}
.swiper-div {
  width: 100%;
  overflow: hidden;
  margin-top: 99px;
}
/* 第一个轮播图 */
.swiper-container1 {
  width: 185.2%;
  margin-left: -42.6% !important;
}
.swiper-container1 .swiper-slide{
  width: calc(100vw - 7%) !important;
}
.swiper-container1 .swiper-button-left {
  position: absolute;
  /* left: 30%; */
  left: 27%;
  top: 50%;
  background: #fff;
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.6);
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  border-radius: 28px;
  transform: translateY(-24px);
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.swiper-container1 .swiper-button-right {
  position: absolute;
  /* right: 30%; */
  right: 27%;
  top: 50%;
  background: #fff;
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.6);
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  border-radius: 28px;
  transform: translateY(-24px);
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.swiper-container1 .swiper-img{
  /* height: 720px; */
  max-width: 100%;
  height: auto;
  /* object-fit: cover; */
}

.swiper-container1 .swiper-button-left .swiper-button-prev1,
.swiper-container1 .swiper-button-right .swiper-button-next1 {
  width: 30px;
}
/* 轻盈的薄 */
.text-common{
  font-weight: 400;
  font-size: 14px;
  color: #CB8C78;
  line-height: 21px;
  text-align: center;
  margin-bottom: 20px;
}
.title-common{
  font-weight: 400;
  font-size: 42px;
  color: #D3CBC4;
  line-height: 55px;
  text-align: center;
  margin-bottom: 20px;
}
.num-common{
  font-weight: 400;
  font-size: 14px;
  color: #D3CBC4;
  line-height: 21px;
  text-align: center;
  margin-bottom: 60px;
}
.sumy-common{
  font-weight: 400;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
  text-align: center;
}
.text-star{
  font-size: 12px;
  color: #B3AEA8;
  line-height: 18px;
  text-align: center;
  margin-top: 10px;
}
.section2{
  padding: 90px 0 150px;
  background-color: #181612!important;
}
.myVideo3{
  width: 100%;
  /* height: 792px; */
  object-fit: cover;
  margin:60px 0;
}
.section2-bottom{
  width: 801px;
  margin:0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.section2-bottom img{
  display: block;
  margin:30px 0 30px;
}
.section2-left{
  width: 132px;
}
.section2-right{
  width: 579px;
}
.section2-tit{
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(70,72,74,0.6);
  font-weight: 400;
  font-size: 18px;
  color: #8E8E8E;
  line-height: 27px;
}
.section2-sum{
  font-weight: 300;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
}
.section2-list{
  display: flex;
  align-items: center;
}
/* 强大的薄 */
.section3{
  padding: 90px 0;
  background-color: #181612!important;
}
.myVideo4{
  /* width: 1320px; */
  /* width: 1200px; */
  /* height: 792px; */
  width: calc(100% - 120px);
  object-fit: cover;
  margin:60px auto 80px;
  display: block;
}
.section3-middle{
  display: flex;
  align-items: center;
  margin:0 auto;
  justify-content: center;
}
.section3-item{
  width: 268px;
  margin-right: 30px;
}
.section3-tit{
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(70,72,74,0.6);
  font-weight: 400;
  font-size: 18px;
  color: #D3D1C4;
  line-height: 27px;
  margin-bottom: 15px;
}
.section3-sumy{
  font-weight: 300;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 28px;
}
.section3-bottom{
  /* width: 1320px; */
  /* width: 100%; */
  margin:140px auto 0;
  display: flex;
  justify-content: center;
}
.section3-bottom img{
  width: 580px;
  height: 568px;
  display: block;
  margin-right: 20px;
}
.section3-black{
  width: 580px;
  height: 568px;
  background: #11100F;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.section3-black h3{
  width: 309px;
  height: 54px;
  font-weight: 400;
  font-size: 18px;
  color: #D3CBC4;
  line-height: 27px;
  margin-bottom: 60px;
}
.section3-black p{
  width: 314px;
  height: 117px;
  font-weight: 350;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
}
/* 安静而强劲 */
.section4{
  padding: 90px 0 60px;
  background-color: #181612!important;
  /* overflow: hidden; */
  position: relative;
}
.swiper-section4{
  position: relative;
  /* width: 1320px; */
  /* width: 1200px; */
  height: 835px;
  margin:60px auto 0;
}
.swiper-section4-container{
  position: absolute;
  top:0;
  left: 0;
}
.section4 h4{
  font-weight: 400;
  font-size: 21px;
  color: #C3C3C3;
  line-height: 32px;
  margin:45px 0 30px;
}
.section4 .text-rem{
  font-weight: 350;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
}
.section4 span{
  display: block;
  font-size: 12px;
  color: #8E8E8E;
  line-height: 18px;
}
.section4-arrow{
  position: absolute;
  right: 120px;
  bottom: -40px;
  display: flex;
  align-items: center;
}
.section4 .swiper-button-left {
  /* position: absolute;
  right:60px;
  bottom: -60px; */
  background: #fff;
  width: 48px;
  height: 48px;
  background: #2C2B26;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  border-radius: 28px;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin-right: 30px;
}
.section4 .swiper-button-right {
  /* position: absolute;
  right:138px;
  bottom: -60px; */
  background: #fff;
  width: 48px;
  height: 48px;
  background: #2C2B26;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  border-radius: 28px;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.myVideo5,.myVideo6{
  max-width: 100%;
  /* height: 560px; */
  display: block;
  object-fit: cover;
  margin-top:60px;
}
.section4 .swiper-button-left .swiper-button-prev1,
.section4 .swiper-button-right .swiper-button-next1 {
  width: 30px;
}
.section4 .swiper-button-disabled{
  background: #11100F;
  box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.1);
}
.section5{
  padding:234px 0 150px;
  background-color: #181612!important;
}
.section6{
  padding: 0 0 150px;
  background-color: #181612!important;
}
.myVideo7{
  width: 100%;
  /* height: 792px; */
  display: block;
  margin:60px 0 0;
  object-fit: cover;
}
.section6-list{
  display: flex;
  align-items: center;
  justify-content: center;
}
.section6-list .section6-item,.section6-list .myVideo8{
  display: block;
  width: 256px;
  /* width: 315px; */
  /* height: 510px; */
  margin-right: 20px;
  position: relative;
}
.section6-item img,.section6-item video{
  width: 100%;
}
.section6-p{
  position: absolute;
  top:34px;
  left: 30px;
}
.section6-p p:first-child{
  font-weight: 400;
  font-size: 16px;
  color: #D3CBC4;
  line-height: 24px;
  margin-bottom: 5px;
}
.section6-p p:last-child{
  font-weight: 350;
  font-size: 14px;
  color: #8A8A8A;
  line-height: 21px;
}
.section7{
  padding: 90px 0;
  background-color: #181612!important;
}
.section7-container{
  /* width: 1316px; */
  margin:0 auto;
}
.section7-sec1,.section7-sec2{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}
.section7-left1,.section7-left2{
  margin-right: 24px;
}
.section7-left1,.section7-right2{
  width: 652px;
  /* width: 774px; */
  height: 420px;
  background: #060606;
  padding: 45px 0 0 45px;
  box-sizing: border-box;
}
.img-top{
  display: block;
  width: 85px;
  margin-bottom: 60px;
}
.section7-container h4{
  font-weight: 400;
  font-size: 31px;
  color: #D3CBC4;
  line-height: 48px;
}
.section7-container p{
  font-weight: 300;
  font-size: 14px;
  color: #8E8E8E;
  line-height: 21px;
  text-align: justify;
}
.section7-right1,.section7-left2{
  width: 436px;
  /* width: 518px; */
  height: 420px;
  background: #060606;
  padding: 45px 0 0 45px;
  box-sizing: border-box;
}
.img-icon1{
  display: block;
  width: 43px;
}
.img-icon2{
  display: block;
  width: 208px;
}
.footer-text{
  width: 1112px;
  margin: 60px auto 0;
}
.footer-text p{
  font-size: 12px;
  color: #46484A;
  line-height: 21px;
  text-align: justify;
}
/* 技术参数与安装示意图 */
.section8-top{
  background-color: #fff;
  width: 960px;
  margin:0 auto;
  padding: 160px 0 90px;
}
.section8-top h4{
  font-weight: 600;
  font-size: 31px;
  color: #3B3D40;
  line-height: 44px;
  text-align: center;
  margin-bottom: 90px;
}
.section8-list-top{
  display: flex;
  justify-content: space-between;
  border-bottom: 2px solid #E4E4E4;
  padding: 0 0 60px;
  margin-bottom: 60px;
}
.section8-item-top{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 240px;
}
.section8-item-top img{
  display: block;
  width: 180px;
  margin-bottom: 10px;
}
.section8-item-top p{
  font-weight: 600;
  font-size: 18px;
  color: #000000;
  line-height: 27px;
  text-align: center;
}
.section8-list-bottom{
  display: flex;
  justify-content: space-between;
  padding-bottom: 30px;
  border-bottom: 2px solid #E4E4E4;
}
.section8-item-bottom{
  width: 240px;
}
.common-gray{
  font-weight: 300;
  font-size: 12px;
  color: #8E8E8E;
  line-height: 14px;
  text-align: center;
}
.common-black{
  font-weight: 600;
  font-size: 14px;
  color: #000000;
  line-height: 20px;
  text-align: center;
  margin-bottom: 30px;
}
.section8-remark{
  margin-top: 38px;
}
.text-remark{
  font-weight: 400;
  font-size: 12px;
  color: #A9A9A9;
  line-height: 20px;
}
.section8-bottom{
  background: #FAFAFA;
  padding: 85px 0 0;
}
.section8-img-bottom{
  width: 1018px;
  margin:0 auto;
}
.section8-img-bottom h4{
  font-weight: 600;
  font-size: 31px;
  color: #3B3D40;
  line-height: 44px;
  text-align: center;
  margin-bottom: 61px;
}
.section8-tabs{
  display: flex;
  align-items: center;
  justify-content: center;
}
.section8-tab{
  width: 33.333333%;
  height: 60px;
  background: #F0F0F0;
  font-weight: 600;
  font-size: 16px;
  color: #A8A8A8;
  line-height: 24px;
  text-align: center;
  line-height: 60px;
  cursor: pointer;
}
.section8-tabs .active{
  color: #000000;
  background: #fff;
}
.section8-img{
  display: none;
}
.section8-img img{
  display: block;
  width: 100%;
  cursor: pointer;
}
.section8-amp{
  margin-top: -40px;
  font-weight: 400;
  font-size: 14px;
  color: #000000;
  line-height: 20px;
  text-align: center;
}
.section8 .myul {
  display: flex;
  font-weight: 600;
  font-size: 0.14rem;
  width: 1018px;
  margin:60px auto 0;
}

.section8 .myul li:not(:last-child) {
  margin-right: 0.3rem;
}

.section8 .myul li {
  width: 100%;
  height: 47px;
  line-height: 47px;
  color: #000;
  border-bottom: 1px solid #000;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.section8 .myul img {
  width: 0.24rem;
  vertical-align: middle;
  height: 0.24rem;
}








/* 底部售后服务 */
.banner9 {
  padding: 209px 0 90px 0!important;
  background: #fafafa;
}
.banner9 .installUl li {
  background: #fff;
  width: 20%;
  height: 200px;
  text-align: center;
  margin-right: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.banner9 .installUl li p {
  font-weight: 400;
  font-size: 18px;
  color: #000000;
  line-height: 30px;
  text-align: center;
}
/* 
.banner9 .installUl li>div {
  padding-top: 0.4rem;
  color: #000;
  font-size: 0.18rem;
} */

.banner9 .installUl li img {
  width: 48px;
  margin: 0 auto 10px;
}
.w1140 {
  width: 1140px;
  margin: 0 auto;
}
.titles {
  font-weight: 600;
  font-size: 32px;
  color: #000000;
  line-height: 45px;
  text-align: center;
  margin-bottom:40px;
}
.box8 {
  margin-top: 40px;
}

.box8>div:first-child {
  margin-right: 30px;
  background: url('https://hsimage.fotile.com/202311231821321999568.jpg') center center;
}
.box8>div:last-child {
  background: url('https://hsimage.fotile.com/202311231821322241681.jpg') center center;
}
.box8>div {
  width: 554px;
  height: 215px;
  text-align: center;
  background-size: cover !important;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.box8 h3 {
  font-weight: 600;
  font-size: 21px;
  color: #FFFFFF;
  line-height: 22px;
  text-align: center;
  margin-bottom: 12px;
}
.box8 p {
  font-weight: 400;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 16px;
  text-align: center;
  margin-bottom: 14px;
}
.box8 .btnWhite{
  width: 144px;
  height: 40px;
  background: rgba(26,26,26,0);
  border: 1px solid rgba(255,255,255,0.5);
  box-sizing: border-box;
}

.bread-b {
  height: 60px;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
  padding-left: 137px;
  color: #000;
}

.bread-b .r {
  margin: 0 10px;
}

.bread-b .link {
  color: #000;
}