
.ai-prodlist-laypage-normal .layui-box a,.ai-prodlist-laypage-normal .layui-laypage-curr{
        margin-top: 0;
        margin-bottom: 0;
        margin-inline-start: -1px;
        animation: button-pop var(--animation-btn, .25s) ease-out;
        display: inline-flex;
        min-height: 3rem;
        flex-shrink: 0;
        cursor: pointer;
        -webkit-user-select: none;
        user-select: none;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        border-radius: var(--rounded-btn, .5rem);
        border-color: transparent;
        border-color: oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity));
        text-align: center!important;
        font-size: .875rem!important;
        line-height: 1em;
        gap: .5rem;
        font-weight: 600!important;
        text-decoration-line: none;
        transition-duration: .2s;
        transition-timing-function: cubic-bezier(0,0,.2,1);
        border-width: var(--border-btn, 1px);
        transition-property: color, background-color, border-color, opacity, box-shadow, transform;
        --tw-text-opacity: 1;
        color: var(--fallback-bc, oklch(var(--bc) / var(--tw-text-opacity)))!important;
        --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
        --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        outline-color: var(--fallback-bc, oklch(var(--bc) / 1));
        background-color: oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity));
        --tw-bg-opacity: 1;
        --tw-border-opacity: 1;
          height: 3rem;
        width: 3rem;
        padding: 0;
        border-start-end-radius: 0;
        border-end-end-radius: 0;
        border-end-start-radius: 0;
        border-start-start-radius: 0;
      }
      .ai-prodlist-laypage-normal .layui-box a:hover{
        background-color: color-mix(in oklab, oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%, black);
        border-color: color-mix(in oklab, oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%, black);
      }
       .ai-prodlist-laypage-normal .layui-laypage-curr{
        --tw-border-opacity: 1;
        border-color:var(--ld-main1)!important;
        --tw-bg-opacity: 1;
        background-color: var(--ld-main1)!important;
        --tw-text-opacity: 1;
        color: var(--fallback-pc, oklch(var(--pc) / var(--tw-text-opacity)))!important;
      }
    
    
    .ai-prodlist-laypage-normal .layui-laypage>a:first-child {
        border-radius: 8px 0 0 8px;
    }
    .ai-prodlist-laypage-normal .layui-laypage>a:last-child{
        border-radius: 0 8px 8px 0;
    }
    
    .ai-prodlist-laypage-normal .layui-laypage-em{
      display:none;
    }
    .ai-prodlist-laypage-normal .layui-laypage{
      margin:0!important;
    }
       .ai-prodlist-laypage-normal .layui-laypage .layui-laypage-curr em{
      color:var(--ld-Auxiliary1);
    }
    .line-clamp-2{
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2; /* 显示的行数 */
        line-clamp: 2; /* 用于现代浏览器 */
    }
    .line-clamp-4{
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4; /* 显示的行数 */
        line-clamp: 4; /* 用于现代浏览器 */
    }
    .ai-prodList .product-image{
    padding-top:100%;
  }
.timelineBoxRight {
      box-shadow: -3px 8px 15px 0px rgba(0, 0, 0, .1);
      margin-left: 30px;
    }

    .timelineBoxLeft {
      box-shadow: 1px 8px 15px 0px rgba(0, 0, 0, .1);
      margin-right: 30px;
    }

    .timelineBox {
      position: relative;
    }

    .timelineBoxRight:before {
      left: -12px;
      border-right: 12px solid #fff;
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
    }

    .timelineBox:before {
      position: absolute;
      content: '';
      top: 50%;
      margin-top: -12px;
    }

    .timelineBoxLeft:before {
      right: -12px;
      border-left: 12px solid #fff;
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
    }

    .timelineWrapper {
      position: relative;
    }

    .timelineWrapper:before {
      position: absolute;
      content: '';
      top: 0;
      left: 50%;
      margin-left: -3px;
      width: 6px;
      height: 100%;
      background: var(--ld-main1);
      opacity: 0.6;
    }

    .timelineBox:after {
      position: absolute;
      content: '';
      top: 50%;
      margin-top: -8px;
      width: 16px;
      height: 16px;
      border-radius: 100%;
      background: var(--ld-main1);
    }

    .timelineBoxLeft:after {
      right: -42px;
    }

    .timelineBoxRight:after {
      left: -42px;
    }

    .timelineWrapper h3 {
      color: var(--ld-main1);
    }

    @media screen and (max-width: 500px) {
      .timelineWrapper .contentPlace {
        width: 100%;
      }

      .timelineWrapper .whiteSpace {
        display: none;
      }

      .timelineBoxLeft {
        margin-left: 30px;
        margin-right: 0;

      }

      .timelineBoxLeft:before {
        left: -12px;
        border-right: 12px solid #fff;
        border-top: 12px solid transparent;
        border-bottom: 12px solid transparent;
        border-left: unset;
        right: unset;
      }

      .timelineWrapper .text-right {
        text-align: left;

      }

      .timelineWrapper:before {
        left: 0;
      }

      .timelineBoxLeft:after {
        left: -42px;
        right: unset;
      }
    }