:root {
  --bobo-goods-list-text-size: 17px;
  --bobo-goods-list-nav-size: 16px;
  --bobo-goods-list-menu-w: 335px;
  --bobo-goods-list-p: 50px 15px 50px;
  --bobo-goods-list-breadcb-p: 30px 0;
  --bobo-goods-list-title-ld: 54px;
}

.bobo-breadcrumb {
  padding: var(--bobo-goods-list-breadcb-p);
}

.bobo-breadcrumb span {
  color: var(--title-text-color);
  font-size: var(--bobo-goods-list-nav-size);
}

.bobo-breadcrumb span.active-nav {
  color: var(--text-color);
  margin-left: 0.3em;
}

.bobo-goods-list.main {
  padding: var(--bobo-goods-list-p);
  overflow: hidden;
}

.bobo-goods-list .main-left {
  width: var(--bobo-goods-list-menu-w);
}

/*.bobo-goods-list .main-left h3 {*/
/*  border-bottom: 1px solid #efefef;*/
/*  height: var(--bobo-goods-list-title-ld);*/
/*  line-height: var(--bobo-goods-list-title-ld);*/
/*  position: relative;*/
/*  font-size: var(--bobo-goods-list-text-size);*/
/*  font-weight: 400;*/
/*  text-transform: uppercase;*/
/*  font-family: var(--font-family);*/
/*}*/

/*.bobo-goods-list .main-left h3::after {*/
/*  display: none;*/
/*  font-family: "qico";*/
/*  content: "\e727";*/
/*  position: absolute;*/
/*  right: 12px;*/
/*  top: 5px;*/
/*  width: 40px;*/
/*  height: 40px;*/
/*  line-height: 40px;*/
/*  font-size: 20px;*/
/*  text-align: center;*/
/*  -webkit-transition: -webkit-transform 0.3s ease;*/
/*  transition: -webkit-transform 0.3s ease;*/
/*  transition: transform 0.3s ease;*/
/*  transition: transform 0.3s ease, -webkit-transform 0.3s ease*/
/*}*/

/*.bobo-goods-list .main-left h3.active::after {*/
/*  -webkit-transform: rotate(45deg) scale(1.08);*/
/*  -ms-transform: rotate(45deg) scale(1.08);*/
/*  transform: rotate(45deg) scale(1.08)*/
/*}*/

/*.bobo-goods-list .sidemenu {*/
/*  margin: 0 0 18px*/
/*}*/

/*.bobo-goods-list .sidemenu ul {*/
/*  display: block;*/
/*}*/

/*.bobo-goods-list .sidemenu h3.active {*/
/*  font-weight: 700;*/
/*  color: var(--color-primary);*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li {*/
/*  border-bottom: 1px solid #efefef*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li h5 {*/
/*  line-height: 20px;*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: space-between;*/
/*  height: var(--bobo-goods-list-title-ld);*/
/*  color: var(--title-text-color);*/
/*  font-size: var(--bobo-goods-list-text-size);*/
/*  cursor: pointer;*/
/*  font-weight: 400;*/
/*  font-family: var(--font-family);*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li h5 a {*/
/*  text-transform: capitalize*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li h5 a:hover {*/
/*  color: var(--color-primary);*/
/*  font-weight: 700;*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li h5 span {*/
/*  width: 46px;*/
/*  height: 46px;*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center;*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li ul {*/
/*  display: none;*/
/*  padding: 17px 0 17px 15px;*/
/*  border-top: 1px solid #efefef;*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li ul li a {*/
/*  display: block;*/
/*  font-size: 16px;*/
/*  line-height: 20px;*/
/*  text-transform: capitalize*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li ul li:not(:first-child) {*/
/*  margin-top: 17px;*/
/*}*/


/*.bobo-goods-list .sidemenu > ul > li ul li.active a,*/
/*.bobo-goods-list .sidemenu > ul > li ul li a:hover {*/
/*  font-weight: 700;*/
/*  color: var(--color-primary);*/
/*}*/

/*.bobo-goods-list .sidemenu > ul > li.active h5 a {*/
/*  color: var(--color-primary);*/
/*  font-weight: 700;*/
/*}*/

.bobo-goods-list .main-right {
  flex: 1;
  padding-left: 35px;
}

.bobo-goods-list .prolist ul {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
}

.bobo-goods-list .prolist ul li {
  flex-basis: 33.33%;
  width: 33.33%;
  padding: 0 15px;
}

.bobo-goods-list .prolist ul li .pic {
  width: 100%
}

.bobo-goods-list .prolist ul li .pic img {
  width: 100%;
  transition: all 0.3s ease 0s;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.bobo-goods-list .prolist ul li h6 {
  margin-top: 15px;
  padding: 0 10px;
  text-align: center
}

.bobo-goods-list .prolist ul li h6 a {
  color: var(--title-text-color);
  font-size: var(--bobo-goods-list-text-size);
  line-height: 1.53;
  /*height: 3.06em;*/
  margin-bottom: 0.5em;
  overflow: hidden;
  display: block;
   text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;/*超出3行部分显示省略号，去掉该属性 显示全部*/
        -webkit-box-orient: vertical;
}

.bobo-goods-list .prolist ul li h6 a:hover {
  color: var(--color-primary);
}

.bobo-goods-list .prolist ul li:hover .pic img {
  transform: scale(1.05);
  -webkit-transform: scale(1.05)
}

@media screen and (max-width: 1500px) {
  :root {
    --bobo-goods-list-menu-w: 300px;
    --bobo-goods-list-text-size: 16px;
    --bobo-goods-list-nav-size: 15px;
  }
}

@media screen and (max-width: 1280px) {
  :root {
    --bobo-goods-list-menu-w: 260px;
    --bobo-goods-list-text-size: 15px;
    --bobo-goods-list-nav-size: 14px;
  }

  .bobo-goods-list .prolist ul li {
    padding: 0 12px;
  }
}

@media screen and (max-width: 1200px) {
  :root {
    --bobo-goods-list-menu-w: 220px;
  }

  .bobo-goods-list .prolist ul li {
    padding: 0 10px;
  }
}

@media screen and (max-width: 992px) {
  :root {
    --bobo-goods-list-menu-w: 200px;
    --bobo-goods-list-breadcb-p: 20px 0;
    --bobo-goods-list-title-ld: 50px;
  }

  .bobo-goods-list .prolist ul li {
    flex-basis: 50%;
    width: 50%;
    padding: 0 15px;
  }
}

@media screen and (max-width: 992px) {
  :root {
    --bobo-goods-list-menu-w: 100%;
    --bobo-goods-list-breadcb-p: 20px 0;
    --bobo-goods-list-title-ld: 45px;
  }

  .bobo-goods-list .main-right {
    padding-left: 0;
    padding-top: 20px;
  }

  .bobo-goods-list .main-left h3 {
    height: var(--bobo-goods-list-title-ld);
    line-height: var(--bobo-goods-list-title-ld);
    font-size: 15px;
  }

  .bobo-goods-list .main-left h3::after {
    display: block
  }

  /*.bobo-goods-list .sidemenu ul {*/
  /*  display: none*/
  /*}*/

  /*.bobo-goods-list .sidemenu > ul > li h5 a {*/
  /*  padding: 10px 50px 10px 0*/
  /*}*/

  /*.bobo-goods-list .sidemenu > ul > li h5 {*/
  /*  font-size: 15px*/
  /*}*/

  .bobo-goods-list .prolist ul li {
    width: 50%;
    flex-basis: 50%;
  }
}

@media screen and (max-width: 576px) {
  :root {
    --bobo-goods-list-breadcb-p: 15px;
  }

  /*.bobo-goods-list .sidemenu {*/
  /*  margin: 0;*/
  /*}*/

  .bobo-goods-list .prolist ul {
    margin: 0
  }

  .bobo-goods-list .prolist ul li {
    float: none;
    width: 100%;
    margin: 0 0 15px
  }

  .bobo-goods-list .prolist ul li h6 {
    padding: 0;
    height: auto
  }
}