.blog-max {
  width: 1560px;
  margin: 0px auto;
}
/* 导航栏 */
.blog-header{
  position: sticky;top: 102px;z-index: 8;padding: 12px 0;backdrop-filter: blur(16px);background: rgba(255, 255, 255, .5);
}
.blog-search{
  position: absolute;right: 5%;top: 12.5px;
}
.blog-search input{
  height: 40px;padding: 0 40px 0 15px;background: #FFFFFF;border-radius: 60px 60px 60px 60px;border: 1px solid #CDD5DB;  
  box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;width: 300px;
  
}
.blog-search_icon{
  position: absolute;right: 1px;top: 2px;font-size: 24px;color: #000000;cursor: pointer;padding:0 6px;
}
.blog-search_icon:hover{
  background-color: #000000;color: #FFFFFF;padding:0 6px;border-radius: 50%;
}
/* banner图 */
.blog-banner{
  position: relative;
}
.blog-banner_content{
  position: absolute;top: 0;width: 100%;height: 100%;
}
.blog-banner_Gift{
  position: absolute;left: 7%;top: 30%;font-weight: bold;font-size: 28px;color: #FFFFFF;
}
.blog-banner_title{
  position: absolute;left: 7%;top: 63%;font-weight: bold;font-size: 40px;color: #FFFFFF;width: 35%;
}
.blog-banner_btn{
  position: absolute;right: 7%;top: 60%;
}
.blog-banner_btn a{
  display: block;border: 1px solid #FFFFFF;background-color: transparent;font-weight: bold;font-size: 28px;color: #FFFFFF;padding: 4px 35px;border-radius: 3px 3px 3px 3px;
}
.blog-banner_btn a:hover{
  border: 1px solid #660099;background-color: #660099;
}
.blog_empty_pro{height: 0;
  margin-top: 0px;
  width: 24%;
  content: "";
  clear: both;
  margin-bottom: 0px}

/* 轮播图 */
.swiper-container{
  padding: 48px 0px 48px 35px;
}
.blog-list-content{
  padding: 10px 0 0;
}
.blos-title{
  font-size: 48px;color: #333333;font-weight: bold;text-align: center;margin: 60px 0 30px 0;
}
.blog-title-list {
  display: flex;
  align-items: center;
  justify-content: center;
  /* margin-bottom: 44px; */
  flex-wrap: wrap;
}
/* .blog-title-list li {
  display: none;
} */
/* .blog-title-list li:nth-child(1),
.blog-title-list li:nth-child(2),
.blog-title-list li:nth-child(3),
.blog-title-list li:nth-child(4) {
  display: block;
} */
.blog-title-list li a {
  display: block;
  font-size: 16px;
  color: #333333;
  margin-right: 25px;
  padding: 7px 0;
  border-bottom: 3px solid transparent;
}
.blog-title-list li a:hover {

  border-bottom: 3px solid #660099;
  color: #660099;
}
.blog-title-list li a.active {
  border-bottom: 3px solid #660099;
  color: #660099;
}
.blogs-banner {
  background: #F5F5F5;
  border-radius: 48px 48px 48px 48px;
  width: 100%;
  display: flex;
  overflow: hidden;
}
.one-blog-list-fig {
  width: 48.5%;
  height: 558px;
  /* overflow: hidden;
  position: relative; */
}
.one-blog-list-fig img {
  width: 100%;
  height: auto;
  border-radius: 48px 0px 0px 48px;
  /* height: auto;
  display: flex;
  align-items: center;
  position: absolute;
  top: -25%; */
}
.one-blog-list-left {
  width: 50%;
  padding: 60px 0px 55px 0px;
}
.one-blog-list-left .blog-pd {
  padding: 0px 50px 0px 80px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.one-blog-h1 a {
  font-size: 40px;
  color: #333333;
  line-height: 52px;
}
.one-blog-h1 a:hover {
  color: #660099;
}
.one-blog-h3 {
  margin-top: 45px;
  font-size: 18px;
  color: #707070;
  line-height: 30px;
}
.one-blog-more a {
  display: flex;
  align-items: center;
  font-size: 24px;
  color: #333333;
  line-height: 58px;
}
.one-blog-more a:hover {
  color: #660099;
}
.one-blog-more img {
  margin-left: 10px;
}
.one-blog-tite a {
  font-size: 24px;
  color: #333333;
  line-height: 36px;
}
.one-blog-tite a:hover {
  color: #660099;
}
.one-blog-tite span {
  font-size: 22px;
  color: #707070;
}
.blog-tite a,
.blog-tite span {
  font-size: 16px;
  color: #333333;
  border-bottom: 2px solid #660099;padding-bottom: 5px;
}
.blog-tite a:hover,
.blog-tite span:hover {
  color: #660099;
}
.house-max {
  justify-content: space-between;
}
.house-max .blog-list-li {
  width: 100%;
}
.house-list {
  margin-top: 60px;
}
.house-list,
.house-right {
  width: 48%;
}
.house-figure {
  position: relative;
}
.house-figure img {
  width: 100%;
  height: auto;
}
.house-figure .house-content {
  position: absolute;
  top: 100px;
  width: 90%;
  left: 5%;
  text-align: center;
}
.house-figure h2 {
  font-size: 36px;
  font-weight: bold;
  color: #333333;
  line-height: 36px;
}
.house-figure h3 {
  margin-top: 10px;
  font-size: 20px;
  color: #333333;
  line-height: 30px;
}
.house-figure button {
  width: 160px;
  height: 36px;
  border-radius: 0px 0px 0px 0px;
  border: 1px solid #333333;
  font-size: 16px;
  color: #333333;
  line-height: 36px;
  margin-top: 27px;
}
.house-figure button:hover {
  background: #660099;
  color: #ffffff;
}
.More-Articles {
  font-size: 18px;
  color: #333333;
  line-height: 22px;
  margin: 60px auto 100px auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.More-Articles:hover {
  cursor: pointer;
  color: #660099;
}
.More-Articles i {
  font-size: 26px;
}
.product-list-title {
  font-size: 28px;
  font-weight: bold;
  color: #333333;
  margin-bottom: 50px;
}
.product-list-max {
  width: 86%;
  padding: 100px 7% 0px 7%;
}
.product-list .product-list-li {
  width: 19%;
}
.product-list .product-list-figure img {
  height: auto;
  width: 100%;
  border-radius: 16px;
}
.product-list .productS-content {
  padding: 20px 10px 0px 10px;
}
.product-list .productS-name a {
  font-size: 14px;
}
.product-list .add-cart-btn {
  height: 40px;
  line-height: 40px;
  font-size: 16px;
}
@media screen and (max-width: 1600px) {
  .blog-max{width: 96%;padding: 0 2%;}
}

@media screen and (max-width: 1560px) {
  .one-blog-list-fig {
    height: auto;
  }
  .blog-banner_title{
    font-size: 32px;
  }
  .blog-banner_btn a{
    font-size: 24px;
  }
  .blog-banner_btn{
    top: 70%;
  }
  .blog-header{
    display: flex;justify-content: space-between;
  }
  .blog-title-list{
    padding-left: 3%;flex: 1;justify-content: left;
  }
  .blog-search{
    position: relative;top: 0;width: 30%;text-align: right;
  }
  .blog-search_icon{
    right: 1px;top: 2px;
  }
}
@media screen and (max-width: 1400px) {
  .one-blog-list-fig {
    height: auto;
  }
  .one-blog-list-left {
    padding: 40px 0px;
  }
  .blos-title{
    font-size: 36px;
  }
  .swiper-container{
    padding: 35px 0 35px 2%;
  }
}
@media screen and (max-width: 1200px) {
 
  .blogs-banner{flex-wrap: wrap;}
  .one-blog-list-fig{height: auto;}
  
  .blog-list .blog-list-intro{padding: 15px 0 10px 0;}
  .blog-list .blog-list-figure img,.one-blog-list-fig img{border-radius: 0px;}
  .blog-list .blog-list-li{margin-top: 25px;border-radius: 8px;overflow: hidden}
  .blogs-banner{border-radius: 18px;}
  .one-blog-list-left .blog-pd{padding: 0px 40px;}
}
.m-img,.nav-search-icon,.phone-search_input{
  display: none;
}
.phone-logo{display: block;}
#header .phone-nav-right{justify-content: center;}
.nav-icon .nav-icon-li:nth-child(1){opacity: 0;}
@media screen and (max-width: 1000px) {
  .blog-list .blog-list-li{
    width: 31.5%;
  }
  .blog-header{
    position: sticky;top: 77px;
  }
  .blog-title-list{
    position: absolute;width: 100%;display: none;background: rgba(255, 255, 255, .5);top: 64px;padding-left: 0;
  }
  .blog-title-list li{
    text-align: center;padding-left: 0;margin-bottom: 8px;
  }
  .blog-title-list li a{
    margin-right: 0px;display: inline-block;
  }
  .pc-img{
    display: none;
  }
  .m-img{
    display: block;
  }
  .blog-banner_Gift{
    top: 10%;
  }
  .blog-banner_content_text{
    position: absolute;bottom: 10%;width: 50%;left: 7%;
  }
  .blog-banner_title{
    width: 100%;font-size: 26px;
  }
  .blog-banner_title,.blog-banner_btn{
    position: static;
  }
  .blog-banner_btn{
    margin-top: 20px;
  }
  .blog-banner_btn a{
    display: inline-block;
  }
  .blog-search{
    padding: 0 10% 0 3%;
  }
  .blog-search_icon{
    right: 10%;
  }
  .blog-search,.blog-search input{
    width: 96%;
  }
  .blog-title-list{
    display: none;
  }
  .u-mobile-btn1,.u-mobile-btn2{
    display: block;width: 12px;height: 12px;border-right: 2px solid #000;border-bottom: 2px solid #000;
    margin-top: -3px;transition: all 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);cursor: pointer;position: absolute;left: 32%;
  }
  .u-mobile-btn1{
    transform: translateY(-50%) rotate(45deg);top: 45%;
  }
  .u-mobile-btn2{
    transform: translateY(-50%) rotate(225deg);display: none;top: 66%;
  }
  .blog-mobile{
    width: 40px;height: 40px; position: absolute;right: 2%;cursor: pointer;
  }
  .u-open-mark{
    opacity: 1;
    pointer-events: all;
  }
  .u-open-mark::before {
    opacity: 1;
    pointer-events: all;
}
  body::before {
    position: fixed;
    content: '';
    width: 100%;
    height: 100%;
    z-index: 2;
    backdrop-filter: blur(4px);
    background: rgba(0, 0, 0, .4);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
}
@media screen and (max-width: 900px) {
  .one-blog-h1 a{font-size: 28px;}
  .one-blog-tite a{font-size: 20px;}
}
@media screen and (max-width: 768px) {
  .blog-list .blog-list-figure,.blog-list .blog-list-content{width: 100%;}
  .one-blog-list-fig,.one-blog-list-left{width: 100%;}
  
  .tablist-max{
    display: none;
  }
  .blog-header{
    top: 55px;
  }
  .blog-banner_content_text{
    width: 86%;
  }
}