## Central route-key normalization for Category Page V2 artwork CTAs. ## Future warehouse selection changes belong here, not in individual configs. ## Exact-slug, fail-closed registry. Configured and enabled are separate decisions. ## Shared renderer definitions must exist exactly once in the Enjoy parse tree. 
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no,maximum-scale=1.0,minimum-scale=1.0,shrink-to-fit=no">
<meta name="title" content="Premium Sneakers &amp; Footwear Collection | OKKREP">
<meta name="keywords" content="">
<meta name="description" content="Explore popular sneakers and footwear selected for craftsmanship, style, and value, with options for personal pairs, client orders, and bulk sourcing.">
<title>Premium Sneakers &amp; Footwear Collection | OKKREP</title>
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/css/base.css?timer=20251027">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/style/iconfont/iconfont.css">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/lib/swiper-7.4.1/swiper/swiper-bundle.css">
<link rel="stylesheet" type="text/less" href="https://www.okkrep.com/templates/Default/assets/css/global.css?timer=20251027">
<link rel="stylesheet" type="text/less" href="https://www.okkrep.com/templates/Default/assets/css/layout.css?timer=20251027"><!--  <link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/css/dist/output.css?timer=20260419">-->
<link rel="stylesheet" type="text/css" href="/templates/Default/assets/css/dist/output.css?timer=20260419">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/lib/sweetalert2/sweetalert2.min.css">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/style/iconfont/iconfont.css">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/lib/toastr/toastr.min.css">
<link rel="stylesheet" type="text/css" href="https://www.okkrep.com/templates/Default/assets/css/nprogress.css"><!--    <link rel="stylesheet" href="/static/components/duet/duet.min.css" />--> <!--  <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />--> <!--  <script type="module" src="/static/components/duet/@duetds/components/lib/duet/duet.js" ></script>-->
<script src="https://www.okkrep.com/templates/Default/assets/lib/less.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/jquery-3.6.4.min.js"></script>
<script src="/static/components/jquery/jquery.form.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/jquery-validation.1.14.0/jquery.validate.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/swiper-7.4.1/swiper/swiper-bundle.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/underscore.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/preline.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/sweetalert2/sweetalert2.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/toastr/toastr.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/nprogress.js"></script>
<script src="/static/components/icheck/icheck.js"></script>
<script src="/static/admin/js/jpressutils.js"></script>
<script src="/static/admin/js/jpressutils.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/clipboard.min.js"></script>
<script src="/static/admin/js/jpressadmin.js"></script>
<script src="https://checkout.airwallex.com/assets/elements.bundle.min.js"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/pay.js?timer=202512141839"></script>
<script src="https://www.okkrep.com/templates/Default/assets/lib/spin.js"></script><!--  <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>-->
<script src="/static/components/fasty/fasty.min.js"></script>
<link rel="stylesheet" href="/static/components/fontawesome-free/css/all.min.css">
<style>
      .error {
          color: #ec3333;
          font-size: 14px;
      }
  </style>
<link rel="canonical" href="https://www.okkrep.com/shoes">
<meta property="og:title" content="Master Craftsmanship, One-Stop Sourcing.">
<meta property="og:description" content="Iconic footwear crafted with exact details. Your trusted destination for personal pairs or bulk supply.">
<meta property="og:image" content="https://www.okkrep.com/templates/Default/assets/imgs/category-pages/v2/shoes/og-v1.webp">
<link rel="stylesheet" href="/templates/Default/assets/lib/swiper-7.4.1/swiper/swiper-bundle.css">
<link rel="stylesheet" href="/templates/Default/assets/css/pages/category-page-v1.css?v=category-page-v2-core-20260804-03"> <!-- <button type="button" class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm" data-hs-overlay="#hs-vertically-centered-modal">
    Vertically centered modal
  </button>
  <button type="button" class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm" data-hs-overlay="#hs-vertically-centered-modal-register">
    zhangsan
  </button>--> <!--  <div>true</div>-->
<div class="main">
 <div class="main-wrapper m-auto">
  <script src="https://www.okkrep.com/templates/Default/assets/lib/flexible.js"></script><!-- 导航页 --> <!-- 导航 -->
  <section style="background-image: linear-gradient( 135deg, #97ABFF 10%, #123597 100%);" class="md:py-2 py-1">
   <div class="jp-wrap flex gap-1 items-center justify-between text-white text-xs md:jp-20 line-clamp-1">
    <span>Share the website with your friends, you can earn more money</span>
    <div class="flex items-center flex-shrink-0">
     <button onclick="location.href='/6'" class="bg-white rounded-full md:py-2 py-1 px-6 text-[#2188E2] text-xs md:jp-18 mr-2">view more </button>
     <div class="md:w-8 md:h-8 h-6 w-6 rounded-full p-[8px] bg-[#B0B0AF]">
      <svg onclick="this.parentElement.parentElement.parentElement.parentElement.remove()" t="1720543425880" fill="#ffffff" class="icon w-full h-full cursor-pointer" viewbox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3259" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
       <path d="M286.165333 798.165333L512 572.330667l225.834667 225.834666 60.330666-60.330666L572.330667 512l225.834666-225.834667-60.330666-60.330666L512 451.669333 286.165333 225.834667 225.834667 286.165333 451.669333 512l-225.834666 225.834667z" fill="" p-id="3260" />
      </svg>
     </div>
    </div>
   </div>
  </section>
  <header aria-label="jp static" class="relative" style="box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 15px 0px;">
   <div class="jp-wrap py-1">
    <div class="w-full flex flex-wrap md:items-center flex-col md:flex-row justify-between">
     <section class="flex items-center flex-nowrap">
      <!--pc端-->
      <nav aria-label="Site Nav" class="hidden md:block [&amp;_a]:whitespace-nowrap [&amp;_label]:inline-block text-[#333333] font-bold">
       <ul class="flex flex-wrap items-center gap-4 jp-16">
        <li><a href="/home" class="inline-block flex-shrink-0"> <img class="w-28 h-28" src="/templates/Default/assets/imgs/logo3.png" alt=""> </a></li>
        <li><a class="jp-16 hover:border-jpprimary border-transparent border-b-2 px-[2px] block transition-all" href="/"> Home </a></li>
        <li>
         <div class="dropdown dropdown-hover">
          <div class="m-1">
           <a class="block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]" href="/product/productList"> <span>Product</span> <i class="iconfont icon-xiangxia"></i> </a>
          </div>
          <ul tabindex="0" class="dropdown-content bg-white p-8 w-screen jp-wrap 2xl:-left-20 -left-[210%] gap-3 text-center grid grid-cols-[repeat(auto-fill,minmax(160px,1fr))] shadow z-10">
           <li><a href="/electronic" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20241202/23f3450bc3e4447fbcb41f85526eef62.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Electronic Products
              </div>
             </div></a></li>
           <li><a href="/perfume" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20241121/4fc5febdd8684cb2ab18de85539807af.webp" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Perfume
              </div>
             </div></a></li>
           <li><a href="/apparel" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20241122/67abe5a7bd1a4e68842443b5bc04a7ea.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Apparel
              </div>
             </div></a></li>
           <li><a href="/shoes" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250418/a817971da37748289e8e274e546520d0.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Shoes
              </div>
             </div></a></li>
           <li><a href="/accessory" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250421/3c92d7e5aebf44fab9098cbca350a660.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Apparel accessory
              </div>
             </div></a></li>
           <li><a href="/bags" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250618/def7594b306a4be7a7409b02b2e04006.png" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Bags
              </div>
             </div></a></li>
           <li><a href="/toys" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250903/8220aa150f6544c990d4f19f6fac4a59.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Toys
              </div>
             </div></a></li>
           <li><a href="/watch" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250520/a22cb4820a5b406da1dd8ad42b77a94b.png" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Watch
              </div>
             </div></a></li>
           <li><a href="/jersey" class="block">
             <div class="info">
              <div class="album">
               <img class="aspect-[1.2203] h-auto w-full" src="/attachment/20250418/8baaf8ba175c4a3383a6b0bddb66a9aa.jpg" alt="">
              </div>
              <div class="desc jp-16 leading-[32px] py-[5px]">
               Jersey
              </div>
             </div></a></li>
          </ul>
         </div></li><!--   <li>
                             <div class="dropdown dropdown-hover">
                               <label tabindex="0" class="m-1">
                                 <a class="block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]" href="/warehouse">
                                   <span >US/EUR Warehouse</span>
                                 </a>
                               </label>
                             </div>
                           </li>--> <!--有模板的情况下使用下拉--> <!--有模板的情况下使用下拉--> <!--有模板的情况下使用下拉-->
        <li>
         <div class="dropdown dropdown-hover">
          <button type="button" class="m-1 block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]" aria-haspopup="true"> <span>Local Warehouse</span> <i class="iconfont icon-xiangxia"></i> </button>
          <div tabindex="0" class="dropdown-content menu transition-[opacity,margin] ease-in-out duration-[150ms] opacity-0 sm:w-48 z-40 bg-white shadow-md border rounded-lg p-1 space-y-1 before:absolute top-full border-gray-200 before:-top-5 before:start-0 before:w-full before:h-5">
           <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/warehouse/us">U.S. Warehouse</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/warehouse/italy">Italy Warehouse</a>
          </div>
         </div></li>
        <li>
         <div class="dropdown dropdown-hover">
          <label tabindex="0" class="m-1"> <a class="block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]" href="#"> <span>About</span> <i class="iconfont icon-xiangxia"></i> </a> </label>
          <div class="dropdown-content menu transition-[opacity,margin] ease-in-out duration-[150ms] opacity-0 sm:w-48 z-10 bg-white shadow-md border rounded-lg p-1 space-y-1 before:absolute top-full border-gray-200 before:-top-5 before:start-0 before:w-full before:h-5">
           <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/why-okkrep">Why OKKREP</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/customer-reviews">Customer Reviews</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/official-contact">Official Contact</a>
          </div>
         </div></li>
        <li>
         <div class="dropdown dropdown-hover">
          <div class="m-1">
           <a class="block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]" href="/6"> <span>Recommend</span> </a>
          </div>
         </div></li><!--       <li>
                                   <div class="dropdown dropdown-hover">
                                       <div class="m-1">
                                           <a class="block transition-all hover:border-jpprimary border-transparent border-b-2 px-[2px]"
                                              href="/recommend">
                                               <span>Recommend</span>
                                           </a>
                                       </div>
                                   </div>
                               </li>--> <!--     <li>
                               <div class="dropdown dropdown-hover">
                                 <label tabindex="0" class="m-1">
                                   <a class="block hover:border-jpprimary border-transparent border-b-2 px-[2px] transition-all"  href="/tracking" >
                                     <span>Tracking</span>
                 &lt;!&ndash;                  <i class="iconfont icon-xiangxia"></i>&ndash;&gt;
                                   </a>
                                 </label>

                               </div>
                             </li>--> <!--            <li>
                                      <div class="dropdown dropdown-hover">
                                        <label tabindex="0" class="m-1">
                                          <a class="block hover:border-jpprimary border-transparent border-b-2 px-[2px] transition-all"  href="/review" >
                                            <span>Review</span>
                        &lt;!&ndash;                  <i class="iconfont icon-xiangxia"></i>&ndash;&gt;
                                          </a>
                                        </label>
                                      </div>
                                    </li>-->
       </ul>
      </nav><!--移动端样式2-->
      <div class="flex items-center">
       <div class="block md:hidden">
        <ul class="menu !flex-row items-center p-0 bg-[#ffffff] jp-14">
         <li><a href="/home" class="inline-block flex-shrink-0"> <img class="w-12 h-12" src="/templates/Default/assets/imgs/logo3.png" alt=""> </a></li>
         <li class="group"><a class="box-content h-5 py-1 px-2 jp-14 block" href="/">Home</a></li>
         <li class="commonNavBar-item relative">
          <div class="box-content py-1 px-2 h-5 jp-14 flex justify-between">
           <a href="/product/productList">Product</a> <i class="iconfont icon-xiangxia w-6 h-5"></i>
          </div>
          <div class="commonNavBar-item-content absolute z-40 top-12 hidden ml-[10px] text-[18px]" style="background-color: #ffffff !important;width: 200px">
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/electronic">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20241202/23f3450bc3e4447fbcb41f85526eef62.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Electronic Products
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/perfume">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20241121/4fc5febdd8684cb2ab18de85539807af.webp" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Perfume
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/apparel">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20241122/67abe5a7bd1a4e68842443b5bc04a7ea.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Apparel
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/shoes">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250418/a817971da37748289e8e274e546520d0.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Shoes
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/accessory">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250421/3c92d7e5aebf44fab9098cbca350a660.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Apparel accessory
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/bags">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250618/def7594b306a4be7a7409b02b2e04006.png" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Bags
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/toys">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250903/8220aa150f6544c990d4f19f6fac4a59.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Toys
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/watch">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250520/a22cb4820a5b406da1dd8ad42b77a94b.png" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Watch
              </div>
             </div></a>
           </div>
           <div class="hover:bg-[#f3f4f6] p-[6px]">
            <a class="block w-full" href="/jersey">
             <div class="flex items-center">
              <div class="album mr-3 flex-shrink-0">
               <img class="aspect-[1.2203] h-auto w-8" src="/attachment/20250418/8baaf8ba175c4a3383a6b0bddb66a9aa.jpg" alt="">
              </div>
              <div class="desc jp-14 py-1">
               Jersey
              </div>
             </div></a>
           </div>
          </div></li><!--有模板的情况下使用下拉--> <!--有模板的情况下使用下拉--> <!--有模板的情况下使用下拉-->
         <li class="commonNavBar-item relative">
          <div class="box-content h-5 py-1 px-2 jp-14 flex justify-between">
           <button type="button" class="font-bold">Local Warehouse</button> <i class="iconfont icon-xiangxia w-6 h-5"></i>
          </div>
          <div class="commonNavBar-item-content hidden absolute menu transition-[opacity,margin] ease-in-out duration-[150ms] sm:w-48 z-40 shadow-md border bg-white rounded-lg p-1 space-y-1 before:absolute top-full border-gray-200 before:-top-5 before:start-0 before:w-full before:h-5">
           <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/warehouse/us">U.S. Warehouse</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/warehouse/italy">Italy Warehouse</a>
          </div></li>
         <li class="commonNavBar-item relative">
          <div class="box-content h-5 py-1 px-2 jp-14 flex justify-between">
           <a href="#">About</a> <i class="iconfont icon-xiangxia w-6 h-5"></i>
          </div>
          <div class="commonNavBar-item-content hidden absolute menu transition-[opacity,margin] ease-in-out duration-[150ms] sm:w-48 z-10 shadow-md border bg-white rounded-lg p-1 space-y-1 before:absolute top-full border-gray-200 before:-top-5 before:start-0 before:w-full before:h-5">
           <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/why-okkrep">Why OKKREP</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/customer-reviews">Customer Reviews</a> <a class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-hidden focus:bg-gray-100" href="/official-contact">Official Contact</a>
          </div></li>
         <li><a class="block box-content py-1 px-2 h-5" href="/6"> <span>Recommend</span> </a></li>
        </ul>
       </div>
      </div>
     </section>
     <div class="flex items-center">
      <div class="mr-2 flex-1 md:flex-none">
       <div class="relative">
        <input id="header-searchProduct" type="text" class="truncate h-8 md:h-10 peer py-1 pr-2 md:py-3 md:pr-4 pl-11 block w-full md:w-48 border-transparent bg-[#EDEDED] rounded-full jp-14 md:jp-16 focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none" placeholder="Search" value="">
        <div id="header-searchProduct-btn" style="left: 15px" class="absolute inset-y-0 start-0 flex items-center cursor-pointer">
         <svg class="flex-shrink-0 w-4 h-4 text-gray-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
          <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" />
         </svg>
        </div>
       </div>
      </div>
      <div class="flex items-center mr-3 md:mr-0">
       <div class="dropdown dropdown-hover z-10  md:w-[100px]">
        <div class="flex hover:text-jpprimary transition-all duration-200 items-center flex-col justify-center" tabindex="0">
         <a href="javascript:void(0)" class="block hover:brightness-50 transition-all duration-300"></a> <i class="iconfont icon-Account before:jp-28"></i> <span class="jp-14 hidden md:block">Your account</span>
        </div>
        <ul tabindex="0" class="dropdown-content text-white right-[-24px] px-[15px] bg-[#181818] whitespace-nowrap">
         <li class="hover:text-[#818181]"><a class="text-[16px] py-2 my-2" href="/user/login">Login</a></li>
        </ul>
       </div>
      </div><!--     <div class="mr-3 md:mr-0">
                       <a href="/contact" class="md:w-[100px] h-[70px] hover:text-jpprimary transition-all duration-200 flex flex-col items-center justify-center">
                         <i class="iconfont icon-chat before:jp-28"></i>
                         <span class="jp-14 hidden md:block">Contact us</span>
                       </a>
                     </div>-->
      <div class="mr-3 md:mr-0">
       <a href="/ucart" target="_blank" class="md:w-[100px] hover:text-jpprimary transition-all duration-200 flex flex-col items-center justify-center "> <i class="iconfont icon-shop-car before:jp-28"></i> <span class="jp-14 hidden md:block">Your cart</span> </a>
      </div>
     </div>
    </div>
   </div>
  </header><!--内容-->
  <style>
  /* Shared Core V2 responsive patch 20260804-04. */
  @media (min-width: 1200px) {
    .category-v1__hero h1 {
      max-width: 760px;
      font-size: clamp(42px, 5.4vw, 82px);
    }
    .category-v1__hero-copy > div {
      max-width: 680px;
      font-size: 20px;
      line-height: 1.55;
    }
    .category-v1__hero-copy > p {
      font-size: 16px;
    }
  }

  @media (max-width: 767px) {
    .category-v1__tabs {
      display: grid;
      grid-template-columns: repeat(var(--category-v1-tab-count, 2), minmax(0, 1fr));
      overflow-x: visible;
    }
    .category-v1__tabs button {
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 0;
      min-height: 56px;
      padding: 10px 4px;
      line-height: 1.2;
      white-space: normal;
      text-align: center;
    }
  }
</style>
  <main class="category-v1" data-category-v1 data-contract="category-page-config-v3" data-product-contract="category-page-products-v3" data-page-version="category-page-v2-core-20260804-03" data-ui-patch-version="category-page-v2-responsive-20260804-04" data-category-key="shoes" data-root-id="1706074969042" data-endpoint="/product/categoryPageV1" data-products-summary="Shoes Products" data-section-summary-singular="Brand" data-section-summary-plural="Brands" data-hero-desktop-alt="Premium footwear collection featuring multiple sneaker styles arranged on warm neutral display platforms." data-hero-mobile-alt="Mobile footwear collection featuring multiple sneaker styles arranged in a premium warm-toned display." data-whatsapp-message="Hi OKKREP, I'm looking for a shoe style I couldn't find on the website. I'll send the shoe name, model, or a reference photo below." data-public-asset-origin="https://www.okkrep.com" data-preview-public-asset-origin="https://www.okkrep.com">
   <section class="category-v1__hero" aria-labelledby="category-v1-title">
    <picture>
     <source media="(max-width: 767px)" type="image/webp" srcset="/templates/Default/assets/imgs/category-pages/v2/shoes/hero-mobile-v1.webp" width="1080" height="1350">
     <img src="/templates/Default/assets/imgs/category-pages/v2/shoes/hero-desktop-v1.webp" width="1920" height="720" fetchpriority="high" decoding="async" alt="Premium footwear collection featuring multiple sneaker styles arranged on warm neutral display platforms.">
    </picture>
    <div class="category-v1__hero-copy category-v1__wrap">
     <p>SHOES COLLECTION</p>
     <h1 id="category-v1-title">Premium Quality. Unbeatably Priced.</h1>
     <div>
      Your one-stop source for top-tier sneakers and footwear. Delivering authentic craftsmanship and exceptional value at every step.
     </div>
    </div>
   </section>
   <section class="category-v1__guides category-v1__wrap" aria-label="Shoes guides">
    <div data-tab-definitions hidden>
     <span data-tab-definition data-enabled="true" data-order="10" data-key="more-styles" data-name="More Styles" data-desktop-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/more-styles/desktop-v1.webp" data-mobile-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/more-styles/mobile-v1.webp" data-alt-text="Shoes guide explaining how customers can contact OKKREP for additional styles not listed online." data-accessibility-summary="More shoe styles may be available beyond the website listing; customers can send a shoe name, model, or reference photo." data-cta-enabled="true" data-cta-type="whatsapp-primary" data-cta-target="" data-cta-aria-label="Contact OKKREP on WhatsApp about more shoe styles" data-desktop-hotspot="52,89,47,8" data-mobile-hotspot="6,88,88,6"></span> <span data-tab-definition data-enabled="true" data-order="20" data-key="local-warehouse" data-name="Local Warehouse" data-desktop-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/local-warehouse/desktop-v1.webp" data-mobile-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/local-warehouse/mobile-v1.webp" data-alt-text="Shoes local warehouse guide showing selected footwear in U.S. and Italy warehouse stock." data-accessibility-summary="Selected footwear styles are available from U.S. and Italy warehouse inventory with faster local delivery." data-cta-enabled="true" data-cta-type="internal-route" data-cta-target="/warehouse/italy" data-cta-aria-label="View local warehouse shoe stock" data-desktop-hotspot="54,90,42,7" data-mobile-hotspot="18,91,65,5"></span> <span data-tab-definition data-enabled="true" data-order="30" data-key="shipping-process" data-name="Shipping Process" data-desktop-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/shipping-process/desktop-v1.webp" data-mobile-image="/templates/Default/assets/imgs/category-pages/v2/shoes/tabs/shipping-process/mobile-v1.webp" data-alt-text="Shoe shipping process showing order receipt, China warehouse dispatch, Shenzhen inspection, and estimated delivery." data-accessibility-summary="Four-step China warehouse shoe shipping process with two quality checks and estimated delivery timing." data-cta-enabled="false" data-cta-type="none" data-cta-target="" data-cta-aria-label="" data-desktop-hotspot=",,," data-mobile-hotspot=",,,"></span>
    </div>
    <div class="category-v1__tabs" role="tablist" aria-label="Shoes guides" data-tabs></div>
    <div data-tab-panels></div>
   </section>
   <section class="category-v1__products" id="products" aria-labelledby="category-products-title">
    <div class="category-v1__wrap">
     <div class="category-v1__products-layout">
      <div class="category-v1__products-sidebar">
       <div class="category-v1__products-heading">
        <div>
         <p>SHOES COLLECTION</p>
         <h2 id="category-products-title">Products</h2>
        </div>
       </div>
       <aside id="category-v1-filters" class="category-v1__filters" data-filters aria-labelledby="category-v1-filter-title">
        <div class="category-v1__filter-header">
         <h3 id="category-v1-filter-title">Filters</h3><button type="button" data-filter-close aria-label="Close filters">×</button>
        </div>
        <div class="category-v1__filter-group">
         <h4>Brands</h4><input type="search" data-brand-search placeholder="Search brands" autocomplete="off">
         <div class="category-v1__option-list" data-brand-list aria-label="Shoes brands">
          <label data-brand-name="adidas"><input type="checkbox" name="brands" value="1706074969050"><span>Adidas</span></label><label data-brand-name="asics"><input type="checkbox" name="brands" value="1733217907423"><span>ASICS</span></label><label data-brand-name="alexander mcqueen"><input type="checkbox" name="brands" value="1706074969048"><span>Alexander McQueen</span></label><label data-brand-name="amiri"><input type="checkbox" name="brands" value="1706074969051"><span>Amiri</span></label><label data-brand-name="armani"><input type="checkbox" name="brands" value="1752206652994"><span>Armani</span></label><label data-brand-name="autry"><input type="checkbox" name="brands" value="1733219804409"><span>Autry</span></label><label data-brand-name="balenciaga"><input type="checkbox" name="brands" value="1706074969055"><span>Balenciaga</span></label><label data-brand-name="birkenstock"><input type="checkbox" name="brands" value="1733218378984"><span>Birkenstock</span></label><label data-brand-name="bape"><input type="checkbox" name="brands" value="1733032871260"><span>Bape</span></label><label data-brand-name="burberry"><input type="checkbox" name="brands" value="1739963339040"><span>Burberry</span></label><label data-brand-name="balmain"><input type="checkbox" name="brands" value="1742873222768"><span>BALMAIN</span></label><label data-brand-name="bottega veneta"><input type="checkbox" name="brands" value="1744789182458"><span>BOTTEGA VENETA</span></label><label data-brand-name="christian louboutin"><input type="checkbox" name="brands" value="1755599359543"><span>Christian Louboutin</span></label><label data-brand-name="chanel"><input type="checkbox" name="brands" value="1734689295448"><span>Chanel</span></label><label data-brand-name="christian"><input type="checkbox" name="brands" value="1752205750360"><span>Christian</span></label><label data-brand-name="crocs"><input type="checkbox" name="brands" value="1733221871969"><span>Crocs</span></label><label data-brand-name="converse"><input type="checkbox" name="brands" value="1733215465880"><span>Converse</span></label><label data-brand-name="casablanca"><input type="checkbox" name="brands" value="1752201068441"><span>Casablanca</span></label><label data-brand-name="dior"><input type="checkbox" name="brands" value="1706074969053"><span>Dior</span></label><label data-brand-name="dsquared2"><input type="checkbox" name="brands" value="1752204816517"><span>Dsquared2</span></label><label data-brand-name="dolce&amp;gabbana"><input type="checkbox" name="brands" value="1734682054050"><span>DOLCE&amp;GABBANA</span></label><label data-brand-name="dr. martens"><input type="checkbox" name="brands" value="1739964292348"><span>Dr. Martens</span></label><label data-brand-name="fendi"><input type="checkbox" name="brands" value="1749382490084"><span>Fendi</span></label><label data-brand-name="golden goose"><input type="checkbox" name="brands" value="1733049869679"><span>Golden Goose</span></label><label data-brand-name="gucci"><input type="checkbox" name="brands" value="1733207735566"><span>Gucci</span></label><label data-brand-name="gel-quantum"><input type="checkbox" name="brands" value="1744789896814"><span>GEL-QUANTUM</span></label><label data-brand-name="hoka"><input type="checkbox" name="brands" value="1733215507166"><span>HOKA</span></label><label data-brand-name="hermes"><input type="checkbox" name="brands" value="1733216004179"><span>Hermes</span></label><label data-brand-name="jordan"><input type="checkbox" name="brands" value="1733032940113"><span>Jordan</span></label><label data-brand-name="kuromi"><input type="checkbox" name="brands" value="1734680502559"><span>Kuromi</span></label><label data-brand-name="louis vuitton"><input type="checkbox" name="brands" value="1706074969052"><span>Louis Vuitton</span></label><label data-brand-name="lanvin"><input type="checkbox" name="brands" value="1733215627193"><span>Lanvin</span></label><label data-brand-name="loewe"><input type="checkbox" name="brands" value="1752206425565"><span>LOEWE</span></label><label data-brand-name="maison mihara yasuhiro"><input type="checkbox" name="brands" value="1733048341326"><span>Maison Mihara Yasuhiro</span></label><label data-brand-name="maison margiela"><input type="checkbox" name="brands" value="1733798068164"><span>Maison Margiela</span></label><label data-brand-name="moncler"><input type="checkbox" name="brands" value="1752205022698"><span>Moncler</span></label><label data-brand-name="nike"><input type="checkbox" name="brands" value="1706074969047"><span>Nike</span></label><label data-brand-name="new balance"><input type="checkbox" name="brands" value="1706074969054"><span>New Balance</span></label><label data-brand-name="off-white"><input type="checkbox" name="brands" value="1733032904969"><span>Off-White</span></label><label data-brand-name="on"><input type="checkbox" name="brands" value="1734603174246"><span>On</span></label><label data-brand-name="puma"><input type="checkbox" name="brands" value="1733049695465"><span>Puma</span></label><label data-brand-name="prada"><input type="checkbox" name="brands" value="1733215654157"><span>Prada</span></label><label data-brand-name="rick owens"><input type="checkbox" name="brands" value="1733049525019"><span>Rick Owens</span></label><label data-brand-name="ralph lauren"><input type="checkbox" name="brands" value="1755599845110"><span>Ralph Lauren</span></label><label data-brand-name="timberland"><input type="checkbox" name="brands" value="1733215580868"><span>Timberland</span></label><label data-brand-name="ugg"><input type="checkbox" name="brands" value="1733215608212"><span>UGG</span></label><label data-brand-name="valentino"><input type="checkbox" name="brands" value="1733215540784"><span>Valentino</span></label><label data-brand-name="vans"><input type="checkbox" name="brands" value="1734602771873"><span>Vans</span></label><label data-brand-name="versace"><input type="checkbox" name="brands" value="1733207556088"><span>Versace</span></label><label data-brand-name="ysl"><input type="checkbox" name="brands" value="1734681669840"><span>YSL</span></label>
         </div>
         <p class="category-v1__brand-empty category-v1-is-hidden" data-brand-empty>No brands found</p>
        </div>
        <div class="category-v1__filter-actions">
         <button type="button" data-reset>RESET FILTERS</button><button type="button" data-filter-apply>APPLY</button>
        </div>
       </aside>
      </div>
      <div class="category-v1__mobile-filter-toolbar">
       <button type="button" class="category-v1__filter-open" data-filter-open aria-haspopup="dialog" aria-controls="category-v1-filters" aria-expanded="false">FILTER</button>
      </div>
      <div class="category-v1__drawer-overlay" data-drawer-overlay hidden></div>
      <div class="category-v1__results">
       <div class="category-v1__summary">
        <strong data-result-summary>Shoes Products · Loading</strong><button type="button" data-clear hidden>CLEAR ALL</button>
       </div>
       <div class="category-v1__chips" data-chips></div>
       <div class="category-v1__status" data-status aria-live="polite"></div>
       <div class="category-v1__sections" data-sections></div>
       <section class="category-v1__conversion" data-conversion hidden aria-label="Shoes customer support">
        <article>
         <h3>Can't Find the Shoes You Want?</h3>
         <p>Contact our customer service team and send us the shoe name, model, or a reference photo. We'll help check the latest available options for you.</p><a href="/official-contact" data-whatsapp-link>CONTACT US ON WHATSAPP</a>
        </article>
        <article>
         <h3>See Why Customers Keep Reordering</h3>
         <p>Browse real customer feedback, repeat-order experiences, and product reviews from buyers and resellers across our top categories.</p><a href="/customer-reviews">VIEW CUSTOMER REVIEWS</a>
        </article>
       </section>
       <div class="category-v1__no-results" data-no-results hidden>
        <h3>No matching shoe products found.</h3>
        <p>Try removing one or more filters, or contact us with a shoe name, model, or reference photo.</p><button type="button" data-reset>RESET FILTERS</button><a href="/official-contact" data-whatsapp-link>CONTACT US ON WHATSAPP</a>
       </div>
      </div>
     </div>
    </div>
   </section>
  </main><!-- 页脚 -->
  <footer class="bg-[#111214] px-3 lg:px-0">
   <div class="above jp-wrap flex flex-col md:flex-row justify-between [&amp;_a:hover]:brightness-150">
    <div class="company flex-1 py-[40px] flex justify-between flex-wrap">
     <!--<div class="mt-[15px] w-[50%] lg:w-[14%]">
                <img class="w-[240px] h-[240px]" src="/templates/Default/assets/imgs/footer_logo2.png" alt="">
            </div>-->
     <div class="mt-[15px] w-[50%] lg:w-[25%]">
      <div class="title jp-20 py-[12px] font-black text-white">
       <div>
        PRODUCTS
       </div>
      </div>
      <div class="list-info text-[#7C7C7C]">
       <div class="item jp-14">
        <div class="item py-[12px]">
         <a href="/electronic">Electronic Products</a>
        </div>
        <div class="item py-[12px]">
         <a href="/perfume">Perfume</a>
        </div>
        <div class="item py-[12px]">
         <a href="/apparel">Apparel</a>
        </div>
        <div class="item py-[12px]">
         <a href="/shoes">Shoes</a>
        </div>
        <div class="item py-[12px]">
         <a href="/accessory">Apparel accessory</a>
        </div>
        <div class="item py-[12px]">
         <a href="/bags">Bags</a>
        </div>
        <div class="item py-[12px]">
         <a href="/toys">Toys</a>
        </div>
        <div class="item py-[12px]">
         <a href="/watch">Watch</a>
        </div>
        <div class="item py-[12px]">
         <a href="/jersey">Jersey</a>
        </div>
       </div>
      </div>
     </div><!-- 暂时隐藏保持布局，更超过6个分类的时候在放开 -->
     <div class="mt-[15px] w-[50%] lg:w-[25%] hidden">
      <div class="title jp-20 py-[12px] font-black text-white">
       <a style="visibility: hidden" href="/index.html">PRODUCTS</a>
      </div>
      <div class="list-info text-[#7C7C7C]">
       <div class="item jp-14">
        <div style="display: none" class="item py-[12px]">
         <a href="/product/productList?category=1706074969037">Electronic Products</a>
        </div>
        <div style="display: none" class="item py-[12px]">
         <a href="/product/productList?category=1725436535392">Perfume</a>
        </div>
        <div style="display: none" class="item py-[12px]">
         <a href="/product/productList?category=1725436191210">Apparel</a>
        </div>
        <div style="display: none" class="item py-[12px]">
         <a href="/product/productList?category=1706074969042">Shoes</a>
        </div>
        <div class="item py-[12px]">
         <a href="/product/productList?category=1756884780140">Toys</a>
        </div>
        <div class="item py-[12px]">
         <a href="/product/productList?category=1747729925493">Watch</a>
        </div>
        <div class="item py-[12px]">
         <a href="/product/productList?category=1742966278833">Jersey</a>
        </div>
       </div>
      </div>
     </div>
     <div class="mt-[15px] w-[50%] lg:w-[25%] text-white">
      <div class="title jp-20 jp-14 py-[12px] font-black">
       <a href="/about">ABOUT US</a>
      </div>
      <div class="list-info text-[#7C7C7C]">
       <div class="item jp-14">
        <!--            <div class="item py-[12px]"><a href="/ucenter/ChangePassword">Change Password</a></div>--> <!--            <div class="item py-[12px]"><a href="/orders">My Orders</a></div>-->
        <div class="item py-[12px]">
         <a href="/warehouse">US/EUR Warehouse</a>
        </div><!--            <div class="item py-[12px]"><a href="/orders/ucenter">My Account</a></div>-->
        <div class="item py-[12px]">
         <a href="/recommend">Recommend</a>
        </div>
        <div class="item py-[12px]">
         <a href="/review">Review</a>
        </div>
       </div>
      </div>
     </div>
     <div class="mt-[15px] w-[50%] lg:w-[25%]">
      <div class="title jp-20 jp-14 py-[12px] font-black text-white">
       CONTACT US
      </div>
      <div class="list-info">
       <div class="item jp-14">
        <!--<div class="item py-[12px]">
                        <svg style="display:inline-block;height:24px;width:24px;margin-right: 3px;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3729" width="200" height="200"><path d="M793.088 485.248a298.688 298.688 0 1 0-562.432-0.64C257.92 560.64 352.448 698.496 512 891.328c159.232-192.64 253.76-330.176 281.088-406.08zM512 1024c-205.76-241.472-326.272-411.712-361.664-510.72a384 384 0 1 1 723.072 0.832C837.76 612.928 717.312 782.848 512 1024.064z m0-512a128 128 0 1 0 0-256 128 128 0 0 0 0 256z" fill="#ffffff" p-id="3730"></path></svg>
                        <a class="text-[#7C7C7C]" href="/returnPolicy">add:</a></div>--> <!--          <div class="item py-[12px]">
                                  <svg style="display:inline-block;height:24px;width:24px;margin-right: 3px;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2695" width="200" height="200"><path d="M781.66 1H242.45c-48.25 0-85.14 36.9-85.14 85.14v851.39c0 48.25 36.9 85.14 85.14 85.14h539.21c48.25 0 85.14-36.9 85.14-85.14V86.14C866.8 37.89 829.91 1 781.66 1zM242.45 57.76h539.21c17.03 0 28.38 11.35 28.38 28.38v638.54H214.07V86.14c0-17.03 11.35-28.38 28.38-28.38z m539.21 908.15H242.45c-17.03 0-28.38-11.35-28.38-28.38V781.44h595.97v156.09c0 17.03-11.35 28.38-28.38 28.38z m0 0" p-id="2696" fill="#ffffff"></path><path d="M455.29 866.58c0 31.35 25.41 56.76 56.76 56.76s56.76-25.41 56.76-56.76a56.77 56.77 0 0 0-28.38-49.16 56.756 56.756 0 0 0-56.76 0 56.79 56.79 0 0 0-28.38 49.16z m0 0" p-id="2697" fill="#ffffff"></path></svg>
                                  <a class="text-[#7C7C7C]" href="/privacyPolicy">TEL:+86 13427836459</a></div>-->
        <div class="flex py-[12px]">
         <svg style="display:inline-block;height:24px;width:24px;margin-right: 4px;" viewbox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1645" width="200" height="200">
          <path d="M874.666667 181.333333H149.333333c-40.533333 0-74.666667 34.133333-74.666666 74.666667v512c0 40.533333 34.133333 74.666667 74.666666 74.666667h725.333334c40.533333 0 74.666667-34.133333 74.666666-74.666667V256c0-40.533333-34.133333-74.666667-74.666666-74.666667z m-725.333334 64h725.333334c6.4 0 10.666667 4.266667 10.666666 10.666667v25.6L512 516.266667l-373.333333-234.666667V256c0-6.4 4.266667-10.666667 10.666666-10.666667z m725.333334 533.333334H149.333333c-6.4 0-10.666667-4.266667-10.666666-10.666667V356.266667l356.266666 224c4.266667 4.266667 10.666667 4.266667 17.066667 4.266666s12.8-2.133333 17.066667-4.266666l356.266666-224V768c0 6.4-4.266667 10.666667-10.666666 10.666667z" fill="#ffffff" p-id="1646" />
         </svg><a class="text-[#7C7C7C]" href="/termsOfService">E-Mail</a>
        </div>
        <div class="flex py-[12px]">
         <svg style="display:inline-block;height:24px;width:24px;margin-right: 4px;" height="10px" version="1.1" viewbox="0 0 509 512" width="10px">
          <g fill="none" fill-rule="evenodd" id="Page-1" stroke="none" stroke-width="1">
           <path style="fill: #ffffff;" d="M259.253137,0.00180389396 C121.502859,0.00180389396 9.83730687,111.662896 9.83730687,249.413175 C9.83730687,296.530232 22.9142299,340.597122 45.6254897,378.191325 L0.613226597,512.001804 L138.700183,467.787757 C174.430395,487.549184 215.522926,498.811168 259.253137,498.811168 C396.994498,498.811168 508.660049,387.154535 508.660049,249.415405 C508.662279,111.662896 396.996727,0.00180389396 259.253137,0.00180389396 L259.253137,0.00180389396 Z M259.253137,459.089875 C216.65782,459.089875 176.998957,446.313956 143.886359,424.41206 L63.3044195,450.21808 L89.4939401,372.345171 C64.3924908,337.776609 49.5608297,295.299463 49.5608297,249.406486 C49.5608297,133.783298 143.627719,39.7186378 259.253137,39.7186378 C374.871867,39.7186378 468.940986,133.783298 468.940986,249.406486 C468.940986,365.025215 374.874096,459.089875 259.253137,459.089875 Z M200.755924,146.247066 C196.715791,136.510165 193.62103,136.180176 187.380228,135.883632 C185.239759,135.781068 182.918689,135.682963 180.379113,135.682963 C172.338979,135.682963 164.002301,138.050856 158.97889,143.19021 C152.865178,149.44439 137.578667,164.09322 137.578667,194.171258 C137.578667,224.253755 159.487251,253.321759 162.539648,257.402027 C165.600963,261.477835 205.268745,324.111057 266.985579,349.682963 C315.157262,369.636141 329.460495,367.859106 340.450462,365.455539 C356.441543,361.9639 376.521811,350.186865 381.616571,335.917077 C386.711331,321.63837 386.711331,309.399797 385.184018,306.857991 C383.654475,304.305037 379.578667,302.782183 373.464955,299.716408 C367.351242,296.659552 337.288812,281.870254 331.68569,279.83458 C326.080339,277.796676 320.898622,278.418749 316.5887,284.378615 C310.639982,292.612729 304.918689,301.074268 300.180674,306.09099 C296.46161,310.02856 290.477218,310.577055 285.331175,308.389764 C278.564174,305.506821 259.516237,298.869139 236.160607,278.048627 C217.988923,261.847958 205.716906,241.83458 202.149458,235.711949 C198.582011,229.598236 201.835077,225.948292 204.584241,222.621648 C207.719135,218.824546 210.610997,216.097679 213.667853,212.532462 C216.724709,208.960555 218.432625,207.05866 220.470529,202.973933 C222.508433,198.898125 221.137195,194.690767 219.607652,191.629452 C218.07588,188.568136 205.835077,158.494558 200.755924,146.247066 Z" fill="#ffffff" id="htwaicon-chat" />
          </g>
         </svg><a class="text-[#7C7C7C]" href="https://wa.me/+86 13412312994">Whatsapp: +86 13412312994</a>
        </div>
       </div>
      </div>
     </div><!--      <div class="mt-[15px] w-[50%] lg:w-[19%]">
                <div class="title jp-20 jp-14 py-[12px] font-black">
                  <a href="/outdoor">Payment &Shipping</a>
                </div>
                <div class="list-info text-[#333333]">
                  <div class="item jp-14">
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                  </div>
                </div>
              </div>

              <div class="mt-[15px] w-[50%] lg:w-[19%]">
                <div class="title jp-20 jp-14 py-[12px] font-black">
                  <a href="/smart">Other Information</a>
                </div>
                <div class="list-info text-[#333333]">
                  <div class="item jp-14">
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                    <div class="item py-[12px]"><a href="javascript:void(0)">LED Wall Washer</a></div>
                  </div>
                </div>
              </div>--> <!--      <div class="mt-[15px] w-full lg:w-[30%] jp-20 font-black">--> <!-- <div class="title py-[12px]">
           <a href="javascript:void(0)">Newsletter</a>
         </div>

         <div class="py-[12px] flex">
           <input type="text" style="border-bottom-right-radius: 0;border-top-right-radius: 0" class="py-3 px-4 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" placeholder="E-mail">
           <button type="button" class="btn bg-jpprimary text-white" style="border-bottom-left-radius: 0;border-top-left-radius: 0">
             Subscribe
           </button>
         </div>--> <!--        <div class="title py-[12px]">--> <!--          <a href="javascript:void(0)">--> <!--            Join our community--> <!--          </a>--> <!--        </div>--> <!--        <div class="share-link flex py-[12px]">--> <!--          --> <!--          <a href="javascript:void(0)" class="block">--> <!--            <img class="mr-3 w-[36px] h-[36px]" src="/templates/Default/assets/imgs/home/share-link1.webp" alt="">--> <!--          </a>--> <!--          --> <!--          <a href="javascript:void(0)" class="block">--> <!--            <img class="mr-3 w-[36px] h-[36px]" src="/templates/Default/assets/imgs/home/share-link2.webp" alt="">--> <!--          </a>--> <!--          --> <!--          <a href="javascript:void(0)" class="block">--> <!--            <img class="mr-3 w-[36px] h-[36px]" src="/templates/Default/assets/imgs/home/share-link3.webp" alt="">--> <!--          </a>--> <!--          --> <!--          <a href="javascript:void(0)" class="block">--> <!--            <img class="mr-3 w-[36px] h-[36px]" src="/templates/Default/assets/imgs/home/share-link4.webp" alt="">--> <!--          </a>--> <!--          --> <!--        </div>--> <!--      </div>-->
    </div>
   </div>
   <div class="under border-t border-[#535353]">
    <div class="jp-wrap h-[56px] text-[#7C7C7C] leading-[56px] jp-14 text-left line-clamp-1">
     中国&nbsp;Affirmative Action employer
    </div>
   </div>
  </footer>
 </div>
</div><a id="Default-main-layout-whatsapp-btn" style="z-index: 99" href="https://wa.me/8613412312994" target="_blank" class="flex group justify-end items-center fixed bottom-[120px] md:bottom-[60px] lg:bottom-[120px] right-[10px] md:right-[17px] lg:right-[30px] w-[60px] transition-all duration-300 leading-[60px] h-[60px] bg-[#6EBF58] rounded-[60px] hover:w-[185px]">
 <div class="mr-[20px] text-white transition-all duration-150 delay-150 w-0 whitespace-nowrap overflow-hidden group-hover:w-auto">
  Contact us
 </div>
 <div>
  <svg style="pointer-events:none;display:inline-block;height:34px;width:34px;margin-right: 12px;margin-bottom: 3px" height="20px" version="1.1" viewbox="0 0 509 512" width="20px">
   <g fill="none" fill-rule="evenodd" id="Page-1" stroke="none" stroke-width="1">
    <path style="fill: #ffffff;" d="M259.253137,0.00180389396 C121.502859,0.00180389396 9.83730687,111.662896 9.83730687,249.413175 C9.83730687,296.530232 22.9142299,340.597122 45.6254897,378.191325 L0.613226597,512.001804 L138.700183,467.787757 C174.430395,487.549184 215.522926,498.811168 259.253137,498.811168 C396.994498,498.811168 508.660049,387.154535 508.660049,249.415405 C508.662279,111.662896 396.996727,0.00180389396 259.253137,0.00180389396 L259.253137,0.00180389396 Z M259.253137,459.089875 C216.65782,459.089875 176.998957,446.313956 143.886359,424.41206 L63.3044195,450.21808 L89.4939401,372.345171 C64.3924908,337.776609 49.5608297,295.299463 49.5608297,249.406486 C49.5608297,133.783298 143.627719,39.7186378 259.253137,39.7186378 C374.871867,39.7186378 468.940986,133.783298 468.940986,249.406486 C468.940986,365.025215 374.874096,459.089875 259.253137,459.089875 Z M200.755924,146.247066 C196.715791,136.510165 193.62103,136.180176 187.380228,135.883632 C185.239759,135.781068 182.918689,135.682963 180.379113,135.682963 C172.338979,135.682963 164.002301,138.050856 158.97889,143.19021 C152.865178,149.44439 137.578667,164.09322 137.578667,194.171258 C137.578667,224.253755 159.487251,253.321759 162.539648,257.402027 C165.600963,261.477835 205.268745,324.111057 266.985579,349.682963 C315.157262,369.636141 329.460495,367.859106 340.450462,365.455539 C356.441543,361.9639 376.521811,350.186865 381.616571,335.917077 C386.711331,321.63837 386.711331,309.399797 385.184018,306.857991 C383.654475,304.305037 379.578667,302.782183 373.464955,299.716408 C367.351242,296.659552 337.288812,281.870254 331.68569,279.83458 C326.080339,277.796676 320.898622,278.418749 316.5887,284.378615 C310.639982,292.612729 304.918689,301.074268 300.180674,306.09099 C296.46161,310.02856 290.477218,310.577055 285.331175,308.389764 C278.564174,305.506821 259.516237,298.869139 236.160607,278.048627 C217.988923,261.847958 205.716906,241.83458 202.149458,235.711949 C198.582011,229.598236 201.835077,225.948292 204.584241,222.621648 C207.719135,218.824546 210.610997,216.097679 213.667853,212.532462 C216.724709,208.960555 218.432625,207.05866 220.470529,202.973933 C222.508433,198.898125 221.137195,194.690767 219.607652,191.629452 C218.07588,188.568136 205.835077,158.494558 200.755924,146.247066 Z" fill="#ffffff" id="htwaicon-chat" />
   </g>
  </svg>
 </div></a> <a href="#0" class="cd-top">Top</a>
<div class="fakeloader"></div>
<div id="hs-vertically-centered-modal" class="hs-overlay hidden w-full h-full fixed top-0 left-0 z-[60] overflow-x-hidden overflow-y-auto">
 <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 mt-0 opacity-0 ease-out transition-all sm:max-w-lg sm:w-full m-3 sm:mx-auto min-h-[calc(100%-3.5rem)] flex items-center">
  <div class="flex flex-col bg-white border shadow-sm">
   <div class="flex justify-between items-center py-3 px-4">
    <h3 class="font-bold text-gray-800"></h3><button type="button" class="hs-dropdown-toggle inline-flex flex-shrink-0 justify-center items-center h-8 w-8 rounded-md text-gray-500 hover:text-gray-400 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 focus:ring-offset-white transition-all text-sm" data-hs-overlay="#hs-vertically-centered-modal"> <span class="sr-only">Close</span>
     <svg class="w-3.5 h-3.5" width="8" height="8" viewbox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M0.258206 1.00652C0.351976 0.912791 0.479126 0.860131 0.611706 0.860131C0.744296 0.860131 0.871447 0.912791 0.965207 1.00652L3.61171 3.65302L6.25822 1.00652C6.30432 0.958771 6.35952 0.920671 6.42052 0.894471C6.48152 0.868271 6.54712 0.854471 6.61352 0.853901C6.67992 0.853321 6.74572 0.865971 6.80722 0.891111C6.86862 0.916251 6.92442 0.953381 6.97142 1.00032C7.01832 1.04727 7.05552 1.1031 7.08062 1.16454C7.10572 1.22599 7.11842 1.29183 7.11782 1.35822C7.11722 1.42461 7.10342 1.49022 7.07722 1.55122C7.05102 1.61222 7.01292 1.6674 6.96522 1.71352L4.31871 4.36002L6.96522 7.00648C7.05632 7.10078 7.10672 7.22708 7.10552 7.35818C7.10442 7.48928 7.05182 7.61468 6.95912 7.70738C6.86642 7.80018 6.74102 7.85268 6.60992 7.85388C6.47882 7.85498 6.35252 7.80458 6.25822 7.71348L3.61171 5.06702L0.965207 7.71348C0.870907 7.80458 0.744606 7.85498 0.613506 7.85388C0.482406 7.85268 0.357007 7.80018 0.264297 7.70738C0.171597 7.61468 0.119017 7.48928 0.117877 7.35818C0.116737 7.22708 0.167126 7.10078 0.258206 7.00648L2.90471 4.36002L0.258206 1.71352C0.164476 1.61976 0.111816 1.4926 0.111816 1.36002C0.111816 1.22744 0.164476 1.10028 0.258206 1.00652Z" fill="currentColor" />
     </svg></button>
   </div>
   <div class="login ml-0 w-screen  md:w-[630px] px-[60px] pb-[67px]  bg-white">
    <div class="jp-30 font-semibold text-center">
     <!--    <img src="/templates/Default/assets/imgs/logo.png" alt="">-->
    </div>
    <div class="jp-18 text-center text-[#666666] mt-[18px]">
     <a href="/user/login">Login</a><span class="mx-5">|</span><a href="/register">Register</a><span class="mx-5">|</span><a href="/forget">Forget password</a>
    </div>
    <form id="loginForm" action="">
     <div class="relative">
      <input type="text" name="user" class="h-[50px] py-2 px-[20px] outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" placeholder="Email">
      <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div>
     <div class="relative">
      <input type="password" name="pwd" class="h-[50px] py-2 px-[20px] outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="new-password" placeholder="Password">
      <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div>
    </form>
    <div class="ctl mt-[34px] flex jp-16 justify-between md:flex-row flex-col items-start md:items-center">
     <button class="btn loginTrigger form-control h-[48px] w-full bg-jpprimary text-white">sign in</button>
    </div>
   </div>
  </div>
 </div>
</div>
<div id="hs-vertically-centered-modal-register" class="hs-overlay hidden w-full h-full fixed top-0 left-0 z-[60] overflow-x-hidden overflow-y-auto">
 <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 mt-0 opacity-0 ease-out transition-all sm:max-w-lg sm:w-full m-3 sm:mx-auto min-h-[calc(100%-3.5rem)] flex items-center">
  <div class="flex flex-col bg-white border shadow-sm">
   <div class="flex justify-between items-center py-3 px-4">
    <h3 class="font-bold text-gray-800"></h3><button type="button" class="hs-dropdown-toggle inline-flex flex-shrink-0 justify-center items-center h-8 w-8 rounded-md text-gray-500 hover:text-gray-400 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 focus:ring-offset-white transition-all text-sm" data-hs-overlay="#hs-vertically-centered-modal-register"> <span class="sr-only">Close</span>
     <svg class="w-3.5 h-3.5" width="8" height="8" viewbox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M0.258206 1.00652C0.351976 0.912791 0.479126 0.860131 0.611706 0.860131C0.744296 0.860131 0.871447 0.912791 0.965207 1.00652L3.61171 3.65302L6.25822 1.00652C6.30432 0.958771 6.35952 0.920671 6.42052 0.894471C6.48152 0.868271 6.54712 0.854471 6.61352 0.853901C6.67992 0.853321 6.74572 0.865971 6.80722 0.891111C6.86862 0.916251 6.92442 0.953381 6.97142 1.00032C7.01832 1.04727 7.05552 1.1031 7.08062 1.16454C7.10572 1.22599 7.11842 1.29183 7.11782 1.35822C7.11722 1.42461 7.10342 1.49022 7.07722 1.55122C7.05102 1.61222 7.01292 1.6674 6.96522 1.71352L4.31871 4.36002L6.96522 7.00648C7.05632 7.10078 7.10672 7.22708 7.10552 7.35818C7.10442 7.48928 7.05182 7.61468 6.95912 7.70738C6.86642 7.80018 6.74102 7.85268 6.60992 7.85388C6.47882 7.85498 6.35252 7.80458 6.25822 7.71348L3.61171 5.06702L0.965207 7.71348C0.870907 7.80458 0.744606 7.85498 0.613506 7.85388C0.482406 7.85268 0.357007 7.80018 0.264297 7.70738C0.171597 7.61468 0.119017 7.48928 0.117877 7.35818C0.116737 7.22708 0.167126 7.10078 0.258206 7.00648L2.90471 4.36002L0.258206 1.71352C0.164476 1.61976 0.111816 1.4926 0.111816 1.36002C0.111816 1.22744 0.164476 1.10028 0.258206 1.00652Z" fill="currentColor" />
     </svg></button>
   </div>
   <div class="login ml-0 w-screen  md:w-[630px] px-[60px] pb-[67px]  bg-white">
    <div class="jp-30 font-semibold text-center">
     <!--    <img src="/templates/Default/assets/imgs/logo.png" alt="">-->
    </div>
    <div class="jp-18 text-center text-[#666666] mt-[18px]">
     <a href="/user/login">Login</a><span class="mx-5">|</span><a href="/register">Register</a><span class="mx-5">|</span><a href="/forget">Forget password</a>
    </div>
    <form id="registerForm" action="">
     <div class="relative">
      <input type="text" name="email" class="h-[50px] py-2 px-[20px] email outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" placeholder="Email">
      <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div>
     <div class="relative" style="display: flex;align-items: center;vertical-align: center">
      <input type="text" name="mobile" class="h-[50px] py-3 px-[20px] outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" placeholder="WhatsApp" required id="mobile">
      <div class="absolute inset-y-0 text-red-600 h-[50px] mt-[21px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div>
     <div class="relative px-[20px]" style="display: flex;align-items: center;vertical-align: center">
      <input type="checkbox" name="No WhatsApp" class="h-[30px] py-3  outline-none border-[#f6f6f6] border mt-[21px]   block rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" id="noWhatsApp"> <span class="font-bold pb-[15px]" style="font-size: 14px;margin-top: 20px;margin-left: 10px">I have no whatsapp</span>
     </div>
     <div class="relative">
      <p class="py-3 px-[20px] text-sm">If you have WhatsApp, please fill in the WhatsApp number. We can send you more product pictures and videos, and make your transaction more secure.</p>
     </div>
     <div class="relative">
      <input type="password" name="pwd" class="h-[50px] py-3 px-[20px] outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" minlength="6" maxlength="8" placeholder="Please enter the password">
      <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div>
     <div class="relative">
      <input type="password" name="confirmPwd" class="h-[50px] py-3 px-[20px] outline-none border-[#f6f6f6] border mt-[21px] block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off" placeholder="Please enter the password again">
      <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">
       *
      </div>
     </div><!--    <div class="relative">--> <!--        <div class="flex justify-between  mt-[21px]">--> <!--            <div class="login-input-content" style="width: 72%;">--> <!--                <input type="text" id="captcha" class="h-[50px] px-[15px] outline-none border-[#f6f6f6] border block w-full rounded-md jp-18 focus:border-blue-500 focus:ring-blue-500" autocomplete="off"--> <!--                       placeholder="please enter verification code" name="captcha" required>--> <!--                <span class="login-icon"><i class="fab fa-black-tie"></i></span>--> <!--            </div>--> <!--            <img src="/commons/captcha" id="captcha-img" style="height: 50px;margin-top: 2px;border-radius: 3px;margin-left: 3px" onclick="this.src='/commons/captcha?d='+Math.random();" cdn-exclude>--> <!--        </div>--> <!--        <div class="absolute inset-y-0 text-red-600 h-[50px] left-0 leading-[54px] pointer-events-none pl-[8px]">--> <!--            *--> <!--        </div>--> <!--    </div>-->
    </form>
    <div class="ctl mt-[34px] flex jp-16  md:flex-row flex-col items-start md:items-center">
     <button class="btn registerTrigger w-full form-control border-jpprimary h-[48px] bg-jpprimary text-white">Submit </button>
    </div>
   </div>
  </div>
 </div>
</div>
<script src="https://www.okkrep.com/templates/Default/assets/lib/init.js?timer=20260309"></script>
<script>
     let isFlag = ""
     let userId = ""
    function verifyUser() {
      console.log("调用", isFlag.length);
      if (isFlag.length) return true;

      HSOverlay.open(document.getElementById("hs-vertically-centered-modal"))

      return false;
    }
  </script>
<script src="/templates/Default/assets/lib/swiper-7.4.1/swiper/swiper-bundle.min.js"></script>
<script src="/templates/Default/assets/js/pages/category-page-v1.js?v=category-page-v2-core-20260804-03" defer></script>