.container{
  width: min(1440px, calc(100% - 48px));
  height: auto;
  margin:0px auto;
  overflow: hidden;
  padding-top: 30px
}
#aa,#bb,#cc,#dd{
  display: none;
}
.ad{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  padding-top: 70px
}
.ad img{
  width: 100%;
  height: auto;
  min-width: 1200px;
}
.container .my_title{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  font-size: 24px;
  font-weight: normal;
  text-align: center;
  padding-top: 12px;
  padding-bottom: 15px;
}
.container .set{
  width: 100%;
  height: 38px;
  margin:0px auto;
  overflow: hidden;
  border:1px solid #f2f2f2;
  border-radius: 8px;
  background: #fff;
  margin-top: 25px;
  padding-top:25px;
  padding-bottom: 25px;
  text-align: center;
}
.container .set select{
  padding-right: 40px;
  padding-left: 40px
}
.container .set .title{
  width: 100%;
  height: 30px;
  margin:0px auto;
  overflow: hidden;
  font-size: 16px;
  text-align: left;
}
.container .set .my{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  font-size: 14px;
}
.container .set .my li{
  list-style: none;
  float: left;
  overflow: hidden;
  width: calc(33.333% - 22px);
  height: auto;
  margin:11px;
  min-height: 80px;
}
.container .set .my li img{
  width: 330px;
  height: auto;
  margin-bottom: 10px;
  border-radius: 8px
}
.container .set .my-title{
  width: 100%;
  height: 30px;
  margin:0px auto;
  overflow: hidden;
  font-size: 20px;
  text-align: center;
  font-weight: normal;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
  margin-bottom: 15px
}
.container .set .my-form{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  font-size: 14px;
}
.container .set .my-form .title{
  width: 100%;
  height: 32px;
  border-bottom: 1px solid #eee;
  padding-bottom: 5px;
  text-align: left;
  padding-top: 20px;
  margin-bottom:5px;
}
.container .set .my-form .list{
  width: 100%;
  height: auto;
  text-align: left;  
  padding-top: 15px;

  padding-bottom: 35px
}
.container .set .my-form .list li.nosel{
  list-style: none;
  width: auto;
  height: 24px;
  float: left;
  overflow: hidden;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 6px;
  border:1px solid #eee;
  text-align: center;
  font-size: 12px;
  padding-top: 8px;
  margin-right:20px;
  cursor: hand;
  cursor: pointer;
}
.container .set .my-form .list li.sel{
  list-style: none;
  width: auto;
  height: 24px;
  float: left;
  overflow: hidden;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 6px;
  border:1px solid #f60;
  text-align: center;
  font-size: 12px;
  padding-top: 8px;
  margin-right:20px;
  background: #f60;
  color: #fff
}
.container .set .my-form .my-font{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  font-size: 14px;
  text-align: left;
  padding-top: 12px;
  padding-bottom: 12px
}
.container .set .my-form .my-font input{
  padding: 8px;
  margin-left: 6px;
  border:1px solid #eee;
  min-width: 95px;
  border-radius: 3px
}
::placeholder{
  color: #999
}
.container .set .my-form .my-body input{
  padding: 8px;
  border:1px solid #eee;
  min-width: 95px;
  border-radius: 3px
}
.container .set .my-form .my-body{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  font-size: 14px;
  text-align: left;
  padding-bottom: 12px
}
.container .result{
  width: 100%;
  height: auto;
  margin:0px auto;
  overflow: hidden;
  border:1px solid #f2f2f2;
  border-radius: 8px;
  background: #fff;
  margin-top: 25px;
  padding-top:25px;
  padding-bottom: 25px;
  text-align: center;
}
.container .result .one{
  width: calc(50% - 40px);
  height: auto;
  min-height: 140px;
  float: left;
  overflow: hidden;
  background: #f8f8f8;
  margin:20px;
  border-radius: 8px
}
.container .result .one .shop{
  width: calc(100% - 40px);
  height: 35px;
  margin:0px auto;
  overflow: hidden;
  border-bottom: 1px solid #f2f2f2;
  padding-top: 15px
}
.container .result .one .shop .shopname{
  width: 460px;
  height: auto;
  float: left;
  overflow: hidden;
  text-align: left;
  font-size: 16px;
}
.container .result .one .shop .map{
  width: 50px;
  height: auto;
  float: right;
  overflow: hidden;
  text-align: right;
}
.container .result .one .addr{
  width: calc(100% - 40px);
  height: auto;
  margin:0px auto;
  overflow: hidden;
  padding-top: 15px;
  text-align: left;
  border-bottom: 1px solid #f2f2f2;
  padding-bottom: 15px
}
.container .result .one .contact{
  width: calc(100% - 40px);
  height: auto;
  margin:0px auto;
  overflow: hidden;
  padding-top: 10px
}
.container .result .one .contact .ontime{
  width: 260px;
  height: auto;
  float: left;
  overflow: hidden;
  text-align: left;
}
.container .result .one .contact .tel{
  width: 260px;
  height: auto;
  float: right;
  overflow: hidden;
  text-align: right;
}
.product{
  width: min(1440px, calc(100% - 48px));
  height: auto;
  overflow: hidden;
  clear: both;
  margin:0px auto;
  background: #fff;
  margin-top: 25px;
  margin-bottom: 15px;
  border-radius: 8px;
  padding-top: 25px;
  padding-bottom: 5px
}
.product li{
  list-style: none;
  width: 25%;
  height: auto;
  float: left;
  overflow: hidden;
  font-size: 14px;
  text-align: center;
  margin-bottom: 25px
}
.product li img{
  width: 100%;
  max-width: 300px;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  margin: 0 auto 12px;
  border-radius: 10px
}
.product a{
  color:#666;
}

/* ==========================================================================
   结构样式补全（原 HTML 内联，2026-10-21）
   桌面视觉与改造前一致
   ========================================================================== */
.container.container-select{
  padding-top: 108px;
}
.container .my_title{
  font-size: 28px;
}
.container .set-lg{
  font-size: 22px;
  padding-top: 45px;
  height: auto;
}
.btn-search{
  width: 100px;
  height: 36px;
  margin: 35px 0 15px;
  padding: 0;
  background: #f60;
  color: #fff;
  border: 0;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
}
.search-tip{
  height: auto;
  margin-top: 35px;
  text-align: center;
  font-size: 14px;
  line-height: 32px;
  color: #666;
}
.btn-consult{
  display: block;
  width: 200px;
  height: 34px;
  margin: 15px auto;
  padding-top: 6px;
  background: #f60;
  color: #fff;
  border-radius: 8px;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
}

/* ==========================================================================
   手机端 / 平板适配（≤1024px）
   ========================================================================== */
@media (max-width: 1024px){
  .container{
    width: 100%;
    box-sizing: border-box;
    padding: 0 16px 24px;
  }
  .container.container-select{
    padding-top: 88px;
  }
  .container .my_title{
    font-size: 20px;
    padding-top: 0;
    padding-bottom: 16px;
  }
  .container .set,
  .container .result{
    width: 100%;
    height: auto;
    box-sizing: border-box;
    margin-top: 14px;
    padding: 14px;
  }
  .container .set-lg{
    font-size: 15px;
    padding-top: 14px;
  }
  .container .set .title,
  .container .set .my,
  .container .set .my-title,
  .container .set .my-form,
  .container .set .my-form .title,
  .container .set .my-form .list,
  .container .set .my-form .my-font,
  .container .set .my-form .my-body{
    width: 100%;
    box-sizing: border-box;
    float: none;
  }
  .container .set .my-form .title{
    font-size: 15px;
    padding-top: 12px;
  }
  /* 选项胶囊：自动换行 */
  .container .set .my-form .list{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 0 4px;
  }
  .container .set .my-form .list li.nosel,
  .container .set .my-form .list li.sel{
    width: auto;
    height: 32px;
    box-sizing: border-box;
    float: none;
    margin-right: 0;
    padding: 0 12px;
    line-height: 30px;
    font-size: 12.5px;
    white-space: nowrap;
  }
  .container .set .my-form .list li.nosel:not([id]){
    width: 100%;
    height: auto;
    line-height: 20px;
    padding: 6px 10px;
    white-space: normal;
    color: #999;
  }
  /* 表单输入 */
  .container .set .my-form .my-font{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 6px 0;
  }
  .container .set .my-form .my-font input{
    flex: 1 1 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 6px 0 0;
    padding: 10px;
    font-size: 14px;
  }
  .container .set .my-form .my-body input{
    width: 100%;
    box-sizing: border-box;
  }
  .btn-search{
    width: 100%;
    height: 44px;
    margin: 16px 0 4px;
    font-size: 15px;
  }
  .search-tip{
    margin-top: 12px;
    font-size: 12.5px;
    line-height: 22px;
    text-align: left;
  }
  .btn-consult{
    width: 100%;
    height: 42px;
    padding-top: 9px;
    font-size: 15px;
  }

  /* 筛选结果：两列方图
     注意结构是 <a><li>…</li></a>，flex 项是外层 a，宽度必须给 a */
  .product{
    width: 100%;
    box-sizing: border-box;
    padding: 12px 0 0;
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
  }
  .product > a{
    display: block;
    width: 50%;
    box-sizing: border-box;
    padding: 0 5px 14px;
  }
  .product li{
    width: 100%;
    float: none;
    box-sizing: border-box;
    padding: 0;
    margin-bottom: 0;
    font-size: 12.5px;
    line-height: 1.45;
  }
  .product li img{
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 8px;
  }

  /* 咨询弹窗 */
  #layer{
    position: fixed;
    inset: 0;
    z-index: 100000000002;
    background: rgba(0,0,0,.45);
    display: none;
  }
  #popup{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(300px, calc(100vw - 48px));
    box-sizing: border-box;
    padding: 22px 16px;
    background: #fff;
    border-radius: 12px;
    text-align: center;
    font-size: 14px;
    line-height: 26px;
    z-index: 100000000003;
  }
}

/* ==========================================================================
   选购页美学统一（2026-10-21）
   ========================================================================== */
.container .my_title{
  font-size: 32px;
  font-weight: 600;
  color: #0E2A3D;
  letter-spacing: 1px;
  padding-top: 22px;
  padding-bottom: 36px;
  position: relative;
}
.container .my_title::after{
  content: '';
  position: absolute;
  left: 50%;
  bottom: 20px;
  width: 44px;
  height: 2px;
  margin-left: -22px;
  background: #C9A96A;
}
.container .set,
.container .result{
  height: auto;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #eef1f3;
  border-radius: 18px;
  padding: 34px 38px;
  margin-top: 26px;
  box-shadow: 0 10px 30px rgba(14,42,61,.04);
}
.container .set-lg{
  padding-top: 34px;
  padding-bottom: 34px;
}
.container .set .my-form .title{
  font-size: 15px;
  font-weight: 600;
  color: #0E2A3D;
  border-bottom: 1px solid #f0f3f5;
  padding-bottom: 12px;
  padding-top: 18px;
  margin-bottom: 4px;
}
/* 选项胶囊 */
.container .set .my-form .list li.nosel,
.container .set .my-form .list li.sel{
  border-radius: 999px;
  border: 1px solid #e3e9ed;
  background: #fff;
  color: #4a5b68;
  font-size: 13px;
  padding: 9px 18px;
  height: auto;
  line-height: 1;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.container .set .my-form .list li.nosel:hover{
  border-color: #C9A96A;
  color: #0E2A3D;
}
.container .set .my-form .list li.sel{
  background: #0E2A3D;
  border-color: #0E2A3D;
  color: #fff;
  font-weight: 500;
}
.container .set .my-form .list li.nosel:not([id]){
  border-style: dashed;
  border-color: #e3e9ed;
  color: #9aa7b2;
  font-size: 12px;
}
/* 输入框 */
.container .set .my-form .my-font input,
.container .set .my-form .my-body input{
  border: 1px solid #dde5ea;
  border-radius: 10px;
  padding: 11px 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.container .set .my-form .my-font input:focus,
.container .set .my-form .my-body input:focus{
  outline: none;
  border-color: #C9A96A;
  box-shadow: 0 0 0 3px rgba(201,169,106,.14);
}
/* 按钮 */
.btn-search,
.btn-consult{
  background: #0E2A3D;
  border-radius: 999px;
  font-weight: 500;
  letter-spacing: 1px;
  transition: background .22s ease, color .22s ease;
}
.btn-search:hover,
.btn-consult:hover{
  background: #C9A96A;
  color: #0E2A3D;
}
.search-tip{
  color: #9aa7b2;
}
/* 结果卡片 */
.container .product li{
  transition: transform .25s ease;
}
.container .product li img{
  border-radius: 12px;
  transition: transform .3s ease, box-shadow .3s ease;
}
.container .product li:hover img{
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(14,42,61,.12);
}

@media (max-width: 1024px){
  .container .my_title{
    font-size: 21px;
    padding-top: 14px;
    padding-bottom: 28px;
  }
  .container .my_title::after{
    bottom: 14px;
    width: 34px;
    margin-left: -17px;
  }
  .container .set,
  .container .result{
    padding: 16px 14px;
    border-radius: 14px;
    margin-top: 14px;
  }
  .container .set .my-form .title{
    font-size: 14px;
    padding-top: 10px;
  }
  .container .set .my-form .list li.nosel,
  .container .set .my-form .list li.sel{
    padding: 7px 13px;
    font-size: 12.5px;
  }
  .container .product li img{
    border-radius: 9px;
  }
}

/* 搜索按钮：稍大一点的胶囊，视觉重量与表单匹配 */
.btn-search{
  width: 132px;
  height: 42px;
  margin: 30px 0 8px;
  padding: 0;
  font-size: 15px;
  letter-spacing: 2px;
}
.btn-search:hover{
  background: #C9A96A;
  color: #0E2A3D;
}

@media (max-width: 1024px){
  .btn-search{
    width: 100%;
    height: 46px;
    margin: 16px 0 4px;
    font-size: 15px;
  }
}

/* ==========================================================================
   选购页筛选面板动态化（2026-10-23）
   选项由 select-filter.js 按产品数据生成，这里补齐新增的几个部件
   ========================================================================== */

/* 面板固定显示（2026-10-23 改）
   原先这里写着 display:none —— 等 JS 生成出选项才放出来，本意是「后台没录数据时
   不留下排空标题」，结果实际效果是筛选项整块凭空消失，反而看不出发生了什么。
   现在改成：面板始终在，选项由 JS 填；某一组没有任何产品数据时，用
   data-default 里的固定选项兜底，让分组和标题都照常出现。 */

/* 高度说明：原先它是 .list 里一个没有 id 的 li（靠 :not([id]) 变成虚线小字），
   但列表现在由 JS 重绘，会被冲掉，所以拆成独立一行 */
.container .set .my-form .list-note{
  width: 100%;
  margin: 0;
  padding: 2px 0 0;
  text-align: left;
  font-size: 12px;
  line-height: 1.7;
  color: #9aa7b2;
}

/* 搜索行：按钮 + 结果数 + 清除筛选 */
.container .set .my-form .sel-bar{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}
.container .set .my-form .sel-bar .btn-search{
  margin: 0;
}
.sel-count{
  font-size: 13px;
  color: #8a97a3;
}
/* 没选任何条件时不占位 */
.sel-count:empty{
  display: none;
}
.sel-reset{
  font-size: 13px;
  color: #C9A96A;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sel-reset:hover{
  color: #0E2A3D;
}

/* 在当前其它条件下，这个选项已经筛不出任何产品 → 视觉上弱化，仍可点击（点完会看到空态说明）。
   2026-10-26：透明度从 .38 提到 .55 —— .38 看起来像「禁用」，用户会以为点不动；
   现在后台数据还没录全时，大部分选项都会落进这个状态，太灰像是坏了。 */
.container .set .my-form .list li.no-hit{
  opacity: .55;
  cursor: pointer;
}
.container .set .my-form .list li.no-hit:hover{
  opacity: 1;
  border-color: #e3e9ed;
  color: #4a5b68;
}

@media (max-width: 1024px){
  .container .set .my-form .sel-bar{
    display: block;
    margin-top: 16px;
  }
  .container .set .my-form .sel-bar .btn-search{
    display: block;
    width: 100%;
  }
  .sel-count,
  .sel-reset{
    display: inline-block;
    margin-top: 10px;
    margin-right: 14px;
  }
  .sel-count:empty{
    display: none;
  }
}

/* [hidden] 在部分浏览器会被上方的 display 规则盖掉，补一条明确规则兜底 */
.sel-reset[hidden]{
  display: none;
}

/* 选项改成由数据生成后，数量可能比原来多、会换行：
   ① 父容器加 overflow:hidden 包住浮动子元素，否则第二行会叠到下一组标题上；
   ② 补纵向间距，换行时才不会上下粘在一起。 */
.container .set .my-form .list{
  overflow: hidden;
}
.container .set .my-form .list li.nosel,
.container .set .my-form .list li.sel{
  margin-bottom: 10px;
}

/* ==========================================================================
   搜索框（2026-10-23）
   和「搜索」按钮并排，同高 42px、同圆角 8px，视觉上是一组输入 + 按钮。
   逻辑：点按钮或按回车才筛，不做输入即筛（打一个字页面跳一下太容易误触）。
   ========================================================================== */
.sel-keyword{
  width: 300px;
  max-width: 100%;
  height: 42px;
  box-sizing: border-box;
  padding: 0 16px;
  border: 1px solid #e3e9ed;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  color: #333;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease;
  -webkit-appearance: none;
}
.sel-keyword::placeholder{
  color: #aab4bd;
}
.sel-keyword:hover{
  border-color: #d3dde4;
}
.sel-keyword:focus{
  border-color: #C9A96A;
  box-shadow: 0 0 0 3px rgba(201, 169, 106, .14);
}

@media (max-width: 1024px){
  /* 手机上整行占满，按钮在它下面单独一行 */
  .sel-keyword{
    display: block;
    width: 100%;
    margin-bottom: 12px;
  }
}