/* vipkei.com PC 产品列表专用样式
 * source: templets/default/list_image.htm
 * version: 20260612-p1s5-product-list
 */

.pc-product-list-template *,
    .pc-product-list-template *::before,
    .pc-product-list-template *::after {
      box-sizing: border-box;
    }

    /* ======================================================
       PC 产品列表页主体框架

       左侧产品分类、右侧面包屑和产品内容必须处于同一个
       1200px 居中容器内，避免宽屏下分别贴向浏览器两端。
       ====================================================== */

    .pc-product-list-template #content {
      display: grid;
      grid-template-columns: 300px minmax(0, 830px);
      gap: 70px;
      align-items: start;
      width: 1200px;
      max-width: calc(100% - 32px);
      margin: 0 auto 40px;
      overflow: visible;
    }

    .pc-product-list-template
    #content > .vk-pc-product-sidebar {
      float: none !important;
      width: 300px !important;
      min-width: 0;
      margin: 0;
    }

    /*
      面包屑和产品内容必须放在同一个右侧列中。
      旧的两行 Grid 会让左侧栏高度参与行高计算，
      导致产品区域被向下推，形成大块空白。
    */
    .pc-product-list-template
    .pc-product-content-column {
      display: flex;
      flex-direction: column;
      min-width: 0;
      width: 100%;
      margin: 0;
    }

    .pc-product-list-template
    .pc-product-content-column > .sidebar,
    .pc-product-list-template
    .pc-product-content-column > .column {
      float: none !important;
      width: 100% !important;
      min-width: 0;
      margin: 0;
    }

    .pc-product-list-template
    .pc-product-content-column > .sidebar {
      min-height: 0;
      height: auto;
    }

    .pc-product-list-template
    .pc-product-content-column > .sidebar .title_r {
      min-height: 0 !important;
      height: auto !important;
      margin: 0 0 14px;
      padding: 7px 0 10px;
      border-bottom: 1px solid #dfe6ea;
      line-height: 1.65 !important;
    }

    .pc-product-list-template
    .pc-product-content-column .pc-product-main,
    .pc-product-list-template
    .pc-product-content-column .sidebar_con {
      float: none !important;
      width: 100% !important;
      min-width: 0;
      margin: 0;
      padding-top: 0 !important;
    }

    .pc-product-list-template
    #content > .pc-product-clear {
      display: none;
    }

    /* ======================================================
       面包屑
       ====================================================== */

    .pc-product-list-template .pc-product-breadcrumb {
      margin: 0;
      padding: 0;
      color: #666;
      font-size: 14px;
      line-height: 1.6;
    }

    .pc-product-list-template
    .pc-product-breadcrumb a {
      color: #555;
      text-decoration: none;
    }

    .pc-product-list-template
    .pc-product-breadcrumb a:hover {
      color: #23b4e1;
    }

    .pc-product-list-template
    .pc-product-breadcrumb__separator {
      margin: 0 6px;
      color: #999;
    }

    .pc-product-list-template
    .pc-product-breadcrumb__product-current {
      display: none;
    }

    /*
      产品中心主页只显示：
      首页 > 不干胶产品
    */
    html.pc-is-product-home
    .pc-product-list-template
    .pc-product-breadcrumb__product-link {
      display: none;
    }

    html.pc-is-product-home
    .pc-product-list-template
    .pc-product-breadcrumb__product-current {
      display: inline;
    }

    html.pc-is-product-home
    .pc-product-list-template
    .pc-product-breadcrumb__category-separator,
    html.pc-is-product-home
    .pc-product-list-template
    .pc-product-breadcrumb__category-current {
      display: none;
    }

    /* ======================================================
       栏目标题和简介
       ====================================================== */

    .pc-product-list-template
    .pc-product-category-head {
      width: 100%;
      margin: 0 0 16px;
      padding: 20px 22px 18px;
      border: 1px solid #e1e8ec;
      border-radius: 3px;
      background: #fff;
      box-shadow: 0 4px 14px rgba(20, 48, 74, .05);
    }

    .pc-product-list-template
    .pc-product-category-head h1 {
      position: relative;
      margin: 0;
      padding: 0 0 0 13px;
      color: #2b2b2b;
      font-size: 25px;
      line-height: 1.4;
      font-weight: 700;
      text-align: left;
    }

    .pc-product-list-template
    .pc-product-category-head h1::before {
      position: absolute;
      top: .16em;
      bottom: .16em;
      left: 0;
      width: 4px;
      border-radius: 1px;
      background: #30b7ef;
      content: "";
    }

    .pc-product-list-template
    .pc-product-category-head__desc {
      margin: 10px 0 0;
      padding: 0;
      color: #555;
      font-size: 15px;
      line-height: 1.78;
      text-align: left;
    }

    /* ======================================================
       产品卡片列表
       ====================================================== */

    .pc-product-list-template
    .product_list.pc-product-grid {
      float: none !important;
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      width: 100% !important;
      margin: 0 !important;
      padding: 0 !important;
      overflow: visible;
    }

    .pc-product-list-template
    .pc-product-card {
      float: none !important;
      display: block;
      width: auto !important;
      min-width: 0;
      margin: 0 !important;
      padding: 0;
      overflow: hidden;
      border: 1px solid #e1e7eb;
      border-radius: 5px;
      background: #fff;
      transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
    }

    .pc-product-list-template
    .pc-product-card:hover {
      border-color: #cfd9df;
      box-shadow: 0 8px 22px rgba(15, 23, 42, .09);
      transform: translateY(-2px);
    }

    .pc-product-list-template
    .pc-product-card__image {
      display: block;
      width: 100%;
      aspect-ratio: 1 / 1;
      overflow: hidden;
      background: #f5f7f8;
    }

    .pc-product-list-template
    .pc-product-card__image img {
      display: block;
      width: 100%;
      height: 100%;
      max-width: 100%;
      border: 0;
      object-fit: cover;
      object-position: center;
      transition: transform .25s ease;
    }

    .pc-product-list-template
    .pc-product-card:hover
    .pc-product-card__image img {
      transform: scale(1.025);
    }

    .pc-product-list-template
    .pc-product-card__title {
      min-height: 52px;
      margin: 0;
      padding: 10px 10px 12px;
      font-size: 15px;
      line-height: 1.55;
      font-weight: 600;
      text-align: center;
    }

    .pc-product-list-template
    .pc-product-card__title a {
      display: -webkit-box;
      overflow: hidden;
      color: #333;
      text-decoration: none;
      overflow-wrap: anywhere;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .pc-product-list-template
    .pc-product-card__title a:hover {
      color: #149bc5;
    }

    .pc-product-list-template
    .pc-product-card__image img.is-fallback {
      object-fit: contain;
      padding: 18px;
      transform: none;
    }

    .pc-product-list-template
    .pc-product-empty {
      display: none;
      margin: 0;
      padding: 34px 24px;
      border: 1px solid #e1e7eb;
      border-radius: 5px;
      background: #fff;
      color: #666;
      font-size: 15px;
      line-height: 1.8;
      text-align: center;
    }

    .pc-product-list-template
    .pc-product-empty.is-visible {
      display: block;
    }

    /* ======================================================
       分页
       ====================================================== */

    .pc-product-list-template
    #pager.pc-product-pager {
      float: none !important;
      width: 100% !important;
      margin: 20px 0 8px;
      padding: 0;
      overflow: hidden;
    }

    .pc-product-list-template
    #pager.pc-product-pager > ul {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 7px;
      width: 100%;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .pc-product-list-template
    #pager.pc-product-pager li {
      float: none !important;
      margin: 0 !important;
      padding: 0 !important;
      list-style: none;
    }

    .pc-product-list-template
    #pager.pc-product-pager li a,
    .pc-product-list-template
    #pager.pc-product-pager li.thisclass {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 34px;
      min-height: 34px;
      padding: 5px 10px;
      border: 1px solid #d9e0e5;
      border-radius: 3px;
      background: #fff;
      color: #555;
      font-size: 14px;
      line-height: 1;
      text-decoration: none;
    }

    .pc-product-list-template
    #pager.pc-product-pager li a:hover {
      border-color: #23b4e1;
      color: #149bc5;
    }

    .pc-product-list-template
    #pager.pc-product-pager li.thisclass {
      border-color: #23b4e1;
      background: #23b4e1;
      color: #fff;
      font-weight: 700;
    }

    .pc-product-list-template
    #pager.pc-product-pager .pageinfo {
      display: inline-block;
      padding: 7px 10px;
      color: #777;
      font-size: 13px;
      line-height: 1.4;
    }

    /* 标签知识与常见问题 */
    .pc-product-list-template
    .contact_pro.pc-product-guides {
      clear: both;
      width: 100%;
      margin-top: 22px;
      padding-top: 0;
    }

    .pc-product-list-template
    .pc-product-guides__head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 42px;
      margin: 0 0 8px;
      padding: 0;
      border-bottom: 1px solid #dce3e8;
    }

    .pc-product-list-template
    .pc-product-guides__head h2 {
      margin: 0;
      padding: 0;
      color: #173e52;
      font-size: 18px;
      line-height: 1.5;
      font-weight: 700;
    }

    .pc-product-list-template
    .pc-product-guides__more {
      color: #60717b;
      font-size: 13px;
      line-height: 1.5;
      text-decoration: none;
    }

    .pc-product-list-template
    .pc-product-guides__more:hover {
      color: #149bc5;
    }

    .pc-product-list-template
    .pc-product-guides .redianzx {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      column-gap: 44px;
      width: 100%;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .pc-product-list-template
    .pc-product-guides .nyHot_news {
      float: none;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      width: auto;
      min-width: 0;
      margin: 0;
      border-bottom: 1px dotted #d9e0e5;
      line-height: 42px;
    }

    .pc-product-list-template
    .pc-product-guides .nyHot_news a {
      float: none;
      display: block;
      min-width: 0;
      width: auto;
      overflow: hidden;
      color: #555;
      font-size: 14px;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-decoration: none;
    }

    .pc-product-list-template
    .pc-product-guides .nyHot_news time {
      flex: 0 0 auto;
      color: #8a969d;
      font-size: 13px;
      line-height: 1.5;
    }

    .pc-product-list-template
    .pc-product-clear {
      clear: both;
      width: 100%;
      height: 0;
      overflow: hidden;
    }

    @media (max-width: 980px) {
      .pc-product-list-template #content {
        display: block;
        width: calc(100% - 24px);
        max-width: 1200px;
      }

      .pc-product-list-template
      #content > .vk-pc-product-sidebar,
      .pc-product-list-template
      #content > .pc-product-content-column {
        float: none !important;
        width: 100% !important;
      }

      .pc-product-list-template
      #content > .vk-pc-product-sidebar {
        margin-bottom: 20px;
      }
    }

    @media (max-width: 1050px) {
      .pc-product-list-template
      .product_list.pc-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .pc-product-list-template
      .pc-product-guides .redianzx {
        grid-template-columns: 1fr;
      }
    }
