html,body {width:100%;height:100%;word-break:break-all;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
@media (min-width: 320px){html{font-size: 42.6667px;} }
@media (min-width: 360px){html{font-size: 48px;} }
@media (min-width: 375px){html{font-size: 50px;} }
@media (min-width: 384px){html{font-size: 51.2px;} }
@media (min-width: 414px){html{font-size: 55.2px;} }
@media (min-width: 448px){html{font-size: 59.7333px;} }
@media (min-width: 480px){html{font-size: 48px;} }
@media (min-width: 512px){html{font-size: 68.2667px;} }
@media (min-width: 544px){html{font-size: 72.5333px;} }
@media (min-width: 576px){html{font-size: 76.8px;} }
@media (min-width: 608px){html{font-size: 81.0667px;} }
@media (min-width: 640px){html{font-size: 85.3333px;} }
@media (min-width: 750px){html{font-size: 100px;} }
.Width1440{max-width: 1440px;margin: 0 auto;}
body { margin: 0; padding: 0; font-size: 16px;  font-family: "Myriad Set Pro","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif; color: #333; line-height: 180%; border: none; }
*:focus{outline:0px}
i { font-style:normal; }
ul,li{list-style:none;padding: 0;margin: 0;}
a {color: #333;text-decoration: none;}
a,a:hover,a:active,a:visited,a:link,a:focus{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.fb{font-weight: bold;}
.multi-line-ellipsis {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.multi-line-ellipsis-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ellipsis {text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
/************************************index*******************************************************************/

.index_banner {
    position: relative;
    width: 100%;
    height: 4rem;
    overflow: hidden;
    max-height: 4rem;
  }
  
  .slides-container {
    position: relative;
    height: auto;
  }
  
  .slide {
    position: absolute;
    width: 100%;
    height: 4rem;
    opacity: 0;
  }
  
  .slide.active {
    opacity: 1;
    z-index: 1;
  }
  
  .slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  /* 导航按钮样式 */
  .button-next,
  .button-prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    font-size: 25px;
    color: #fff;
    /*! text-shadow: 0 2px 5px rgba(0,0,0,0.3); */
    /*! padding: 20px; */
    user-select: none;
    transition: opacity 0.3s;
    font-weight: bold;
    background-color: rgba(0,0,0,.35);
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 50%;
    display: none;
  }
  
  .button-next:hover,
  .button-prev:hover {
    opacity: 0.8;
    color: #f6f2f1;
  }
  
  .button-next {
    right: 20px;
  }
  
  .button-prev {
    left: 20px;
  }
  
  /* 分页指示器 */
  .pagination-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 10px;
  }
  
  .pagination-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,.2);
    cursor: pointer;
    transition: all 0.3s;
    /*! background: transparent !important; */
    /*! border: 2px solid #f6f2f1; */
  }
  
  .pagination-dot.active {
    background: white;
    background: #fff;
    /*! border-color: #f6f2f1 !important; */
  }
.searchList {width: 92%;margin: 20px auto;display: flex;align-items: stretch;-webkit-align-items: stretch;flex-wrap: wrap;border-radius: 5px;overflow: hidden;box-shadow: 0px 2px 17px 1px rgba(0,0,0,0.1);height: 45px;justify-content: space-between;}
.searchList input {border: none;line-height: 45px;padding: 0 10px;width: 77%;}
.searchList .btn {width: 15%;background: #000;display: flex;justify-content: center;align-items: center;}
.searchList .btn img {width: 24px;height: 24px;}
.cateList {display: flex;align-items: stretch;-webkit-align-items: stretch;flex-wrap: wrap;width: 100%;background: #fafafa;padding-top: 15px;justify-content: center;}
.cateList li {width: 16%;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;margin: 0 .1rem .2rem;}
.cateList li img {width: 100%;border-radius: 50%;}
.cateList li p {margin: 0;font-size: 11px;}
.cateList li a{display: flex;justify-content: center;align-items: center;flex-wrap: wrap}
.proList {display: flex;justify-content: center;/*! align-items: center; *//*! flex-wrap: wrap; *//*! margin: 0 auto; *//*! width: 100%; */margin-bottom: 1rem;}
.proList_M > h2 {width: 100%;border-bottom: 1px solid #fafafa;line-height: 50px;text-align: center;font-weight: bold;letter-spacing: 4px;font-size: 18px;margin: 0;margin-bottom: .4rem;}
.proList ul {display: flex;flex-wrap: wrap;margin: 0 rem;/*! justify-content: center; *//*! margin: 0 auto; *//*! width: 100%; *//*! display: inline-block; */}
.proList li {width: 44.5%;margin: 0 .2rem .3rem;box-shadow: 0px 2px 17px 1px rgba(0,0,0,0.05);border-radius: 5px;}
.proList li a{display: inline-block;}
.proList li img {width: 100%;}
.proList li p {font-size: 16px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;margin: 0;line-height: 20px;}
.proList li .p1 {color: #797979;font-size: 12px;padding-top: 5px;line-height: 17px;}
.proList li h2 {font-size: 20px;margin: 0;padding-top: 5px;}
.proList li h2 i {font-size: 14px;}
.proList li .con{padding: .1rem .2rem .2rem;}
footer {position: fixed;left: 0;bottom: 0;width: 100%;height: calc(55px + constant(safe-area-inset-bottom));height: calc(55px + env(safe-area-inset-bottom));z-index: 1;background: #fff;/*! padding-top: 5px; */border-top: 1px solid #f3f3f3;display: flex;flex-direction: row;justify-content: space-around;height: 1rem;}
footer ul {display: flex;flex-wrap: wrap;justify-content: space-between;width: 100%;/*! padding: .2rem 0 .1rem; */}
footer li {width: 50%;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
footer li img {width: 26px;height: 26px;}
footer li p {margin: 0;width: 100%;font-size: 12px;height: 20px;line-height: 20px;color: #656565;text-align: center;}
footer li a{display: inline-block;width: 100%;height: 100%;display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;}
    .proList_M{}
/************************************categorize*******************************************************************/
.top {height: 50px;width: 100%;background: #000;position: relative;}
.top a.left {position: absolute;top: 50%;left: .2rem;width: .4rem;height: .4rem;background: rgba(0,0,0,0.3);border-radius: 50%;transform: translateY(-50%);}
.top a.left img {width: 100%;}
.top p {text-align: center;width: 100%;line-height: 50px;color: #fff;margin: 0;}
.n_cateList {width: 100%;height: calc(100% - 165px);display: flex;}
.n_cateList .n_cateList_l {width: 100px;background: #f7f7f7;}
.n_cateList .n_cateList_l li {width: 100%;position: relative;text-align: center;font-size: 16px;color: #666;line-height: 50px;}
.n_cateList .n_cateList_l li.hover {font-weight: bold;color: #000;background: #fff;}
.n_cateList .n_cateList_l li.hover::after {
  position: absolute;
  left: 0;
  height: 100%;
  content: "";
  background: #000;
  width: 3px;
}
.n_cateList .n_cateList_r {width: calc(100% - 100px);overflow-y: auto;/*! display: flex; *//*! flex-wrap: wrap; *//*! align-items: center; */}
.n_cateList .n_cateList_r li {text-align: center;width: 29.333%;margin: .1rem;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;/*! display: inline-block; *//*! height: 2rem; */}
.n_cateList .n_cateList_r li img {width: 100%;}
.n_cateList .n_cateList_r li p {font-size: 12px;margin: 0;}
.n_cateList_r ul{display: flex;flex-wrap: wrap;}
.searchTop{/*! width: 100%; */border-top: 10px solid #fafafa;/*! width: 100%; */display: flex;justify-content: space-between;border-bottom: 1px solid #fafafa;padding-left: 4%;padding-right: 4%;line-height: 50px;position: relative;}
.searchCate{width: 100%;display: flex;align-items: stretch;-webkit-align-items: stretch;flex-wrap: wrap;border-bottom: 1px solid #fafafa;line-height: .8rem;}
.searchCate li{width: 33.333%;display: flex;justify-content: center;align-items: center;font-size: 14px;}
.searchCate li::after{
  content: "";
  background: url('../images/wap/d2.png');

  width: .3rem;
  height: .3rem;
  display: inline-block;
  background-size: .3rem;
  margin-left: .2rem;
}
.searchCate .asc::after{
  background: url('../images/wap/d4.png');
  background-size: .3rem;
}
.searchCate .desc::after{
  background: url('../images/wap/d2.png');
  background-size: .3rem;
}
.searchTop span::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: #000;
  width: 6px;
  height: 6px;
  background: #000;
  border-radius: 50%;
}
.searchTop{margin: 0 .4rem;/*! width: 100%; */}
/************************************searchlist*******************************************************************/
.searchMain {display: flex;flex-wrap: wrap;margin-bottom: 1rem;}
.searchMain p {}
.searchMain p span {}
.searchMain ul {}
.searchMain li {width: 44%;margin: .2rem;box-shadow: 0px 2px 17px 1px rgba(0,0,0,0.05);border-radius: 5px;background: #fff;}
.searchMain li .ImgCon{overflow: hidden;width: 100%;}
.searchMain li img {width: 100%;height: 100%;object-fit: cover;}
.searchMain li h2 {font-size: 16px;font-weight: normal;margin: 0;}
.searchMain li .con {color: #797979;font-size: 13px;padding-top: 5px;}
.searchMain li .con p {margin: 0;line-height: 20px;}
.searchMain li .price {font-size: 14px;}
.searchMain li .con_M{padding: 0 .2rem .2rem;}
.searchResult {width: 100%;border-top: 10px solid #fafafa;/*! padding: 0 .4rem; */font-size: 18px;position: relative;}
.searchResult p {/*! width: 100%; */display: flex;border-bottom: 1px solid #fafafa;line-height: 1rem;margin: 0;padding: 0 .7rem;}
.searchResult span {color: #f40;padding-left: 10px;padding-right: 10px;}
.searchResult p::before{content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: #000;width: 6px;height: 6px;background: #000;border-radius: 50%;margin-left: .4rem;display: inline-block;}
.searchListMain {width: 100%;display: flex;flex-wrap: wrap;padding-top: .3rem;margin-bottom: 1rem;/*! justify-content: center; */}
.searchListMain li {width: 44.6%;margin: 0 .2rem .2rem;box-shadow: 0px 2px 17px 1px rgba(0,0,0,0.05);border-radius: 5px;background: #fff;display: flex;justify-content: center;align-items: center;}
.searchListMain li a{display: flex;flex-wrap: wrap;width: 100%;}
.searchListMain .ImgCon {width: 100%;}
.searchListMain .ImgCon img {width: 100%;}
.searchListMain .Con_m {padding: 0 .2rem .2rem;}
.searchListMain .Con_m h2 {font-size: 16px;font-weight: normal;margin: 0;}
.searchListMain .Con_m .con {color: #797979;font-size: 13px;padding-top: 5px;}
.searchListMain .Con_m .con p {margin: 0;line-height: 20px;}
.searchListMain .Con_m .price {font-size: 14px;}
.bar{width: .8rem;height: .8rem;border-radius: 50%;display: flex;justify-content: center;align-items: center;position: fixed;bottom: 3rem;right: .25rem;background: #000;opacity: 0;}
.bar .top1{}
.bar .top1 img{width: .5rem;height: .5rem;display: block;}
.bar.visible {
  opacity: 1;
}

.bar:hover {
  /* background: #1a5a8a; */
  transform: translateY(-3px);
}
/************************************detauls*******************************************************************/
.detailTop {position: fixed;height: 50px;width: 100%;z-index: 3;}
.detailTop a.left {position: absolute;top: 10px;left: 10px;width: 30px;height: 30px;background: rgba(0,0,0,0.3);border-radius: 50%;display: flex;justify-content: center;align-items: center;}
.detailTop a.left img {width: .3rem;}
.detailTop a.right {position: absolute;top: 10px;right: 10px;width: 30px;height: 30px;background: rgba(0,0,0,0.3);border-radius: 50%;display: flex;justify-content: center;align-items: center;}
.detailTop a.right img {width: .3rem;}
.detailImg {position: relative;overflow: hidden;}
.detailImg li {width: 100%;}
.detailImg li img {width: 100%;display: block;}
.detailImg .swiper {
  width: 100%;
  height: 100%;
}

.detailImg .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.detailImg .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.swiper-pagination-bullet-active{background: #fff;}
.detailCon {/*! width: 100%; */padding: .2rem;border-bottom: 10px solid #fafafa;}
.detailCon .price {font-size: 24px;font-weight: bold;margin-bottom: 5px;}
/* .detailCon .price span {font-size: 14px;} */
.detailCon p {font-size: 16px;font-weight: bold;margin: 0;}
.detailCate {display: flex;align-items: stretch;-webkit-align-items: stretch;flex-wrap: wrap;width: 100%;border-bottom: 1px solid #f0f0f0;}
.detailCate li {cursor: pointer;width: 50%;text-align: center;line-height: .9rem;color: #000;}
.detailCate li.hover {font-weight: bold;position: relative;}
.detailCate li.hover::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 1rem;
  height: 1px;
  background: #000;
  left: 50%;
  margin-left: -.5rem;
}
.detailMain {display: flex;flex-wrap: wrap;margin-top: .2rem;margin-bottom: 1rem;}
.detailMain li img {width: 100%;}
.detailMain li{width: 100%;margin: 0 .2rem .2rem;}
.share {position: relative;width: 100%;display: none;}
.share .mask {width: 100%;height: 100%;position: fixed;top: 0;background: rgba(0,0,0,0.6);z-index: 12;}
.share .tc_share {/*! display: none; */bottom: 0;position: fixed;background: #fff;border-radius: 10px 10px 0 0;/*! padding: .2rem; */z-index: 13;width: 100%;}
.share .tc_share .share_title {text-align: center;font-size: 16px;color: #999;padding-top: .2rem;}
.share .tc_share ul {display: flex;align-items: stretch;/*! -webkit-align-items: stretch; */flex-wrap: wrap;/*! width: 100%; */padding-top: .2rem;padding-bottom: .2rem;}
.share .tc_share ul li {width: 25%;text-align: center;}
.share .tc_share ul li a {}
.share .tc_share ul li a dl {}
.share .tc_share ul li a dl img {width: 50px;height: 50px;}
.share .tc_share ul li a dd {font-size: 14px;padding-top: 5px;margin: 0;}
.detailTop.scrolled {
  background-color: rgba(0,0,0,0.8);
  z-index: 111;
}
.shareCon{background: rgba(0,0,0,.8);
  position: fixed;
  z-index: 111;
  top: 50%;
  left: 50%;
  transform: translate(-50%);
display: none;
}
.shareCon p{color: #fff;
  margin: .2rem .4rem;}