body{ overflow-x:hidden;} body,ul,li{ margin: 0px auto;padding: 0px; } .foot-dl ul li,.menu-item,.menu-item .sub-menu li,.project ul li,.ewmUl li{ list-style: none;} body,div,p,a{ font-family:Arial, Helvetica, sans-serif!important;} ::-webkit-scrollbar{ width: 5px;} img{max-width: 100%!important;} a{color: #000000; font-size:12px; display:inherit; text-decoration:none;outline: none!important;} a:hover{ color: red; text-decoration: none;} .clear,.clearfix{ clear: both;} .position{ position: relative;} @font-face{ font-family:timeFont; src:url(../img/DIGITAL-Regular.TTF); } .fl{ float: left;} .fr{ float: right;} .flex-control-nav{ overflow:hidden} #topdiv-pc{ display:none;padding: 0px;overflow:visible; position:relative; z-index:10;} #topdiv-mob{ display:block;padding: 0px; height: 120px;} .entry-content{ padding-top: 30px;} #order_review .cart_item{ border-bottom: solid 1px #ddd;} #order_review .cart_item .product-name{ font-size: 14px;} #order_review .cart_item .product-img{max-width: 50px; max-height: 40px; float: left; margin-right: 6px;} .order-total .woocommerce-Price-amount{ font-size: 20px; color: red;} .sizeDiv li{list-style: none; margin-bottom: 8px;font-size: 12px;} .sizeDiv li b{display: inline-block;width: 60px; text-align: center;} .size-cls{width: 70px;height: 30px; line-height: 30px; background-color: #fff!important;box-shadow:unset!important; border: none!important;border-bottom: solid 1px #ddd!important;} .video_cls{width: 100%; text-align: center;} .video_cls li{list-style: none; font-size: 12px; color: #666;line-height: 25px;display: inline-block; margin-left: 8px; margin-right: 8px; cursor: pointer;} #video_src{width: 100%; height: 100%;max-height: 502px;min-height: 320px; position: absolute; z-index: 0;left: 0px; top: 0px; background-color: #000; display: none;} #video_src video{width: 100%; height: 100%;} #video_src.active{display: block;} .video_cls li.active{color: darkblue;} .woocommerce-product-gallery__wrapper{ position: relative; z-index: 1;} #product-imags-div001.active #video_src{display: block;z-index: 1;} #product-imags-div001.active .woocommerce-product-gallery__wrapper{z-index: 0;} .index-cat{ text-align: center;} .index-cat .imgDiv-a{width: 100%; height: 120px; position:relative; overflow: hidden; border: solid 1px #eee; } .index-cat .imgDiv-a img{ max-width: 100%; height: auto; margin: 0px auto;border-radius: 4px;} .index-cat a{ font-weight: 600; color: #E6362A; line-height: 25px;} .attachment-woocommerce_thumbnail{max-width: 80px!important; padding: 4px!important; margin: 0px!important;} .pages{ text-align: center;} .pages a.page,.pages span{ padding: 4px; padding-left: 10px; padding-right: 10px; border: solid 1px #ddd;font-size: 14px!important;} .pages a.page:hover{background-color: #035e97;color: #fff;} .pages span.current{background-color:orangered !important;color: #fff;} header{ position:relative; overflow:visible} .header-top1{ position: fixed;width: 100%; z-index: 10000;top:0px;} .header-top1 #topdiv-pc{ height: 100px!important;} .header-top1 #topdiv-pc .logo-div{ height: 80px!important; transition: 0.3s;} .header-top1 #topdiv-pc .nav-div ul li:hover .submenu{top:40px;} .header-top1 #topdiv-mob .top{ height:30px; line-height:30px; transition:0.3s} .header-top1 #topdiv-mob .top,.header-top1 #topdiv-mob .top a{ font-size:12px; line-height:30px;} .header-top1 #topdiv-mob{ height:90px;} .header-top1 #topdiv-mob .logo-div{ height:60px;} .header-top1 #topdiv-mob .logo-div .logo-img{ padding-top:5px;} .header-top1 #topdiv-mob .logo-div .logo-img img{ max-height:50px;} .top{height:35px; background-color:#035e97;} .top,.top a{color: #fff; line-height: 35px;} .tel-div{ height: 100%;} #topdiv-mob .top{ text-align:center;} #topdiv-mob .top a{ margin-left:6px; margin-right:6px;} #topdiv-mob .tel-div{ text-align: center;} #topdiv-mob .tel-div i{ margin-right: 5px;} #topdiv-mob .tel-div a{ display: inline-block;} #topdiv-pc .top a{ margin-left:6px; margin-right:6px;} #topdiv-pc .tel-div{ text-align: center;} #topdiv-pc .filled-div{ text-align:left;} #topdiv-pc .tel-div i{ margin-right: 5px;} #topdiv-pc .tel-div a{ display: inline-block;} #topdiv-pc .menutel{ text-align:right} #topdiv-pc .menutel a i{ font-size:16px} #topdiv-pc .logo-div{ height:100px; position:relative;transition:height 0.3s;}} #topdiv-pc .logo-div .row{height:100%} #topdiv-pc .cat-icons-pc{ position:relative} #topdiv-pc .cat-icons-pc .bi-bag::before{font-size: 20px;transition:0.3s} #topdiv-pc .cat-icons-pc:hover .bi-bag::before{font-size: 24px; transition:0.3s} #topdiv-pc .cat-icons-pc span{ position:absolute; left:7px;} .topdivpc-search{display:inline-block; margin-left:10px;} .topdivpc-search #s{height: 25px;border:none; border-radius: 25px; text-indent:5px; } .fenxiangpc-div{float: right;} .fenxiangpc-div .sfsi_wDiv{width:auto!important;} .fenxiangpc-div .sfsi_wicons{ float:left; margin-right:5px;width:25px!important;} .fenxiangpc-div .sfsi_wicons a{width:25px!important;} .fenxiangpc-div .sfsi_wicons img{ max-width:25px!important;max-height:25px!important;} .logo-div{ height: 70px; background-color:#0483d4; position: relative;} .logo-div .menutel{ display: block;position: relative; } .logo-div .menutel a{width: 30px; height: 30px; line-height: 30px; position: absolute; left: 10px; top: 20px; color: #fff; font-size:20px ;} .logo-div .logo-img{ text-align: center;} .logo-div .logo-img a{ display: block;width: 100%; height: 100%; position: relative; padding-top:0px;} .logo-div .logo-img img{ max-height: 100%; margin: 0px auto; } #topdiv-mob .logo-div{ height:90px; } #topdiv-mob .logo-div .logo-img{ padding-top:10px;} #topdiv-mob .logo-div .logo-img img{ max-height:92%} #topdiv-mob .logo-div .cat-icons{ display: block;position: relative; } #topdiv-mob #nav-search-mob{ height:30px; position:relative; margin-top:10px; margin-bottom:10px;} #topdiv-mob #nav-search-mob #s{ width:160px; height:30px; line-height:30px; font-size:12px; color:#333; text-indent:5px; float:left;} #topdiv-mob #nav-search-mob .search_form{ height:30px; line-height:30px; font-size:12px; background-color:#F90;color:#fff;float:left;} .logo-div .cat-icons a{width: 30px; height: 30px; line-height: 30px; position: absolute; right: 10px; top: 20px; color: #fff; font-size:20px ;} .logo-div .cat-icons span{ display: block;width: 100%; height: 20px; line-height: 20px; color: #fff; font-size: 12px; position: absolute;top: 12px; left: 6px; text-align: left;} #topdiv-pc .nav-div{ text-align:right; position:relative;} #topdiv-pc .nav-div ul{ width:100%; height:80px;top:20px; position:absolute} #topdiv-pc .nav-div ul li{ display:block;height:100%; overflow:visible; text-align:left; float:left; position:relative;padding-right:6px; padding-left:4px; padding-top: 13px;} #topdiv-pc .nav-div ul li:first-child {padding-top: 0px;padding-left:0px;} #topdiv-pc .nav-div ul li:first-child a{ font-size:30px;font-weight:800; } #topdiv-pc .nav-div ul li:after{content:"";color:rgba(255,255,255,0.8); position:absolute;right:0px;top:3px; font-size:10px; font-weight:bold; opacity:0.5;} #topdiv-pc .nav-div ul li a{ font-size:14px;color:rgba(255,255,255,0.8); font-weight:bolder;transition:0.3s} #topdiv-pc .nav-div ul li a:hover{ color:#fff; transition:0.3s} #topdiv-pc .nav-div ul li a i{display:none;} #topdiv-pc .nav-div ul li:hover .submenu{ display:block;opacity:1;top:60px;left:0px; height:auto;transition:opacity 0.23s;box-shadow: 0px 0px 10px rgba(0,0,0,0.25);} #topdiv-pc .nav-div ul #nav-search:hover .submenu{ left:-200px;} #topdiv-pc .nav-div ul #nav-search dl::before{ right:50px!important; left:unset} #topdiv-pc .logo-div .logo-img{ text-align:left; height: 100px; padding-top:10px;} .header-top1 #topdiv-pc .logo-div .logo-img img{ max-height: 70%;} .header-top1 #topdiv-pc .nav-div ul{ height:40px;} .rootmenu{ width:100%; height:30px; position:relative;} .submenu{ left:-9999px; opacity:0; width:300px; border-radius:2px; margin:0px auto;top:60px; background-color:#fff; border:solid 2px #eee; padding:10px; position:absolute; transition:opacity .25s;} .submenu dd{ width:100%; height:20px; border-bottom:solid 1px #eee; text-align:left;} .submenu dd a{ line-height:20px; font-size:14px!important; font-weight:normal!important; color:#666!important; transition:color 0.3s} .submenu dd a:hover{ color:red!important; transition:0.3s} #topdiv-pc .nav-div ul li dl:before { left: 20px; top:-24px; border: solid transparent; content: ''; height: 0; width: 0; position: absolute; pointer-events: none; opacity: 1; border-bottom-color: #ddd; border-width: 11px; transition: opacity .25s; } #nav-search .submenu input{ padding:0px!important;} #nav-search .submenu #s{ float:left; font-size:12px; height:30px; line-height:30px; text-indent:5px; width:190px} #nav-search .submenu buttom{ float:left} .search_form{ background-color:#F90; border:none; height:30px;line-height:20px; color:#fff; max-width:80px; font-size:12px} .hideCls{right:-110%!Important; transition:right 0.3s} .hideCls .rootmenu{ right:0px!Important; } .showCls{right:0px!Important; transition:right 0.3s} .showCls .rootmenu{ right:0px!Important; } .session-select{ background-color: #f5f5f5; padding: 20px;} .session-chuxiao{ background-color: #fff; padding: 20px;} .title-h2{ line-height: 50px; margin-top: 20px; color: #000; font-size: 24px;font-weight: 600;} .close_btn{ position:absolute; left:10px;top:10px; font-size:26px;color:#fff;} .mob_top_menus{ position: fixed; width: 100%; height:100%; right:-110%; top: 0px; z-index: 100000; background-color: rgba(0,0,0,0.5); } .mob_top_menus .rootmenu{border-left: solid 1px #ddd; background-color:#f5f5f5; width: 250px; margin:0px auto; height:100%;right:-300px;top: 0px; position:absolute;} .mob_top_menus .rootmenu li{ width: 92%; min-height: 40px; border-bottom: solid 1px #ddd; margin: 0px auto; position: relative; list-style: none;} .mob_top_menus .rootmenu li:first-child { background-color: #F5F5F5;} .mob_top_menus .rootmenu li:first-child a{ font-weight: bold; color: orangered;font-size: 16px;} .mob_top_menus .rootmenu a{ line-height: 50px; font-size: 14px; color: #333333; font-weight: bold;} .mob_top_menus .rootmenu .submenu{ background-color: #eee; opacity:1; width:100%; height: auto; max-height:300px; overflow-y: scroll; border-radius:0px; border:none;position:relative;left: 0px;top: 0px; display: none; } .mob_top_menus .rootmenu .submenu dd{ width:100%; height:30px; border-bottom:solid 1px #ddd; text-align:left;} .mob_top_menus .rootmenu .submenu dd a{ line-height:30px; font-size:14px!important; font-weight:normal!important; color:#333!important; transition:color 0.3s} .mob_top_menus .rootmenu .submenu dd a:hover{ color:#666!important; transition:0.3s} .cat_mode{ position: fixed; width: 100%; height:100%; right:-110%; top: 0px; z-index: 100000; background-color: rgba(0,0,0,0.5); } .cat_mode dl{ border-left: solid 1px #ddd; background-color:#f5f5f5; width: 250px; margin:0px auto; height:100%;right:0px;top: 0px; position:absolute;} .cat_mode dl dt{ width:100%; height:40px; margin-top:20px; font-size:18px; text-align:center; position:relative} .cat_mode dl dt i{ display:block; width:40px; height:2px; background-color:orange; margin:0px auto; margin-top:10px;} .cat_mode .cat_mode_jiesuan{ display:block; width:120px; height:30px; line-height:30px; text-align:center; background-color:#F60; font-size:16px;color:#fff; border-radius:30px; margin:0px auto; margin-top:20px; margin-bottom:20px;} .cat_mode .close_btn_a{ display:block; width:120px; height:30px; line-height:30px; text-align:center; font-size:14px;color:red;margin:0px auto; margin-bottom:20px;} .cat_mode ul{ width:94%; margin:0px auto;} .cat_mode ul li .product-name-cat{ width:100%; height:20px; line-height:20px; border-bottom:solid 1px #eee; margin-bottom:8px; font-weight:bold;} .cat_mode ul li .product-remove-cat{ float:left; width:20px;} .cat_mode ul li .product-remove-cat a{ margin-top:20px;} .cat_mode ul li .product-thumbnail-cat{ float:left;max-width:60px; height:60px; padding:5px;} .cat_mode ul li .product-thumbnail-cat img{ max-width:60px; height:60px;} .cat_mode ul li .product-price-cat{ float:right; font-size:12px; width:100px; height:60px; text-align:right;} .cat_mode ul li .coupon{ display:none;} .cat_mode ul li button{ border:none; background-color:none; font-size:12px;color:red;} #banner{ width: 100%; height:400px; margin: 0px auto; padding: 0px; position: relative;border: none; } #banner #slideBox{ border: none;} #banner .lunbo{ z-index: 0; height: 100%; position: relative;} #banner .lunbo .bd ul,#banner .lunbo .bd li{ width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li a{ display: block;width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li img{ } #banner .bfimg{ max-height: 105px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;;} #banner .bfimg img{ max-height: 100%;} .banner-div{ margin-top: 20px; margin-bottom: 20px; max-height: 600px; overflow: hidden;} .banner-div .banner-item{position: relative; } .banner-div a:first-child{display: block; width: 100%; height:100%; z-index: 0; position: relative;} .banner-div a:first-child img{ max-width: 100%;height: 100%; border-radius: 4px;} .banner-item2,.banner-item3{padding-left: 0px; padding-right: 0px;} .banner-item3{ margin-top: 10px;} /* 本例子css */ .slideBox{ width:100%; height:100%; overflow:hidden; position:relative; border:1px solid #ddd; } .slideBox .hd{ height:f00; width: 100%; overflow:hidden; position:absolute;z-index:1; bottom:8px; } .slideBox .hd ul{ overflow:hidden; width: 100%; height: 100%; text-align: center; } .slideBox .hd ul li{ display: inline-block; width:25px; height:8px; border-radius: 5px;text-align:center; background:#999; cursor:pointer; } .slideBox .hd ul li.on{ background:#E6362A; color:#E6362A; } .slideBox .bd{ position:relative; height:100%; z-index:0; } .slideBox .bd li{ zoom:1; vertical-align:middle; } .slideBox .bd img{ width:100%;; height:100%;; display:block; } .slider_img_active_img{transform:scale(1)!important;transition:transform 5s!important;} .slider_img_active_img_no{transform:scale(0.8)!important;} /* 下面是前/后按钮代码，如果不需要删除即可 */ .slideBox .prev, .slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5; } .slideBox .next{ left:auto; right:3%; background-position:8px 5px; } .slideBox .prev:hover, .slideBox .next:hover{ filter:alpha(opacity=100);opacity:1; } .slideBox .prevStop{ display:none; } .slideBox .nextStop{ display:none; } .liquidation_sale{padding-top: 20px; padding-bottom: 20px;} .products{ margin-top: 20px;} .ctitle{ text-align: center; } .ctitle img{ max-height: 50px; margin-top: 10px;} .ctitle a{ font-size: 20px; font-family: "arial black"; line-height: 40px; background-color:#FFDE17; width: 200px; border-radius: 20px;color: #fff!important; font-weight:bold; display:inline-block; margin-top: 20px; margin-bottom: 20px; } .ctitle p{color: #E6362A;font-size: 16px;} .ctitle a:hover{ background-color: orange;transition: 0.3s;} .imgDiv{ width: 98%; margin: 0px auto; text-align: center;} .imgDiv .imgDiv-a{ width:280px; height: 280px; text-align: center; vertical-align: middle; border-radius: 5px; margin: 0px auto; border:solid 1px #ddd;padding: 8px;} .imgDiv .imgDiv-a img{ max-width: 100%; display: table-cell; text-align: center;} .product-title{ line-height: 30px; font-size: 14px; padding-top: 20px; padding-bottom: 20px;} .ctitle1{ text-align: center; margin-top: 20px; margin-bottom: 20px; } .ctitle1 a{ font-size: 20px; font-family: "arial black"; line-height: 60px; color:#E6362A!important; font-weight: bold; } #category_div{ margin-top: 20px; margin-bottom: 20px; padding-top: 30px; padding-bottom: 30px; background-image: url(../img/background-jump-girls.jpg); background-size: 100%; background-repeat: no-repeat;background-position: 46% 24%;transform: translate3d(0px, 15.86px, 0px); backface-visibility: hidden;} .catDiv{ width: 98%; margin: 0px auto; position: relative;} .catDiv .catDiv-img{ width: 100%; height:auto; border: solid 1px #f5f5f5; border-radius: 10px; overflow: hidden; z-index: 0; position: relative;} .catDiv .catDiv-img img{ width: 100%;} .catDiv-infor{ width: 90%; padding: 10px; margin: 0px auto; position: relative; margin-top: -40px; text-align: center;background-color:rgba(255, 255, 255, 0.9);border-radius: 3px;} .catDiv-infor i{ display: inline-block; width: 40px; height: 40px;} .catDiv-infor i img{ max-height: 100%;} .catDiv-infor h2{ width: 50%; margin: 0px auto; margin-top: 8px; margin-bottom: 8px; font-size: 18px; color:#E6362A ; line-height: 40px;} .catDiv-infor p{font-size: 14px; color:#333 ; line-height: 25px;} .catDiv-infor .cat-title{ display: inline-block;width: 60%;height: 30px; text-align: center; border-radius: 20px; line-height: 30px; background-color: #E6362A;color: #fff; font-size: 16px; margin-bottom: 30px;} .catDiv .catDiv-hr{ width: 80px; height: 3px; margin: 0px auto; background-color: yellow;} .ad-img-div{ height: 620px; background-size: 100%; background-repeat: no-repeat; background-position: center top; text-align: center;background-position: 50% 49%;} .ad-img-div .ad-img{ margin: 0px auto; max-width: 260px; margin-top:120px;transform: scale(1); transition: 0.3s;} .ad-img-div .ad-infor{ padding-top: 20px; padding-bottom: 20px;} .ad-img-div .ad-infor,.ad-img-div .ad-infor a{ color: #fff; font-size: 20px; left: 40px;} .ad-img-div .pmore{ display: inline-block;width: 150px; padding: 8px; padding-left: 20px; padding-right: 20px; background-color:#E6362A ;color: #fff; line-height: 30px; border-radius: 20px; font-size: 16px;} .ad-img-div:hover .ad-img{transform: scale(1.1); transition: 0.3s;} #newsproduct_div{ background-color:#0483d4; padding-top: 40px; padding-bottom: 40px;} .ctitle2{ text-align: center;} .ctitle2 img{ max-width: 60px; margin:0px auto;} .ctitle-a{color:yellow; font-size: 20px; line-height: 40px; font-weight: bold;} .ctitle-p1{ color: yellow; font-size: 16px; line-height: 30px;} .ctitle-p2{ color: #fff; font-size: 16px; line-height: 30px;} .tuijian-bk{ background-color: yellow!important;} .tuijian-bk .ctitle-a{color:#E6362A;} .tuijian-bk .ctitle-p1{ color: #E6362A;} .tuijian-bk .ctitle-p2{ color: #E6362A; } .youshi-div{ margin-top: 30px;} .youshi-div dl{width: 100%;} .youshi-div dl dt{width: 100%; height: 180px;display: flex;background-color: #fff; border-radius: 4px; align-items: center; margin-bottom: 10px;} .youshi-div dl dt img{ max-width: 90%; max-height: 80px; margin: 0px auto;} .youshi-div dl h3{ font-size: 18px; line-height: 25px; font-weight: 600;} .youshi-div dl dd a{ line-height: 25px; text-decoration: underline;} .products-news{width: 900; height: 300px; position: relative; margin-top: 20px; margin-bottom: 20px;} /* 本例子css */ .picScroll-left{ width:100%; height:100%; position:relative; } .picScroll-left .btn{ width: 100%; height:0px; padding:0 10px; position: absolute; z-index: 20; top: 100px; } .picScroll-left .btn .prev,.picScroll-left .btn .next{ display:block; width:30px; height:30px; cursor:pointer; font-size: 20px; position: absolute; font-weight: bold;} .picScroll-left .btn .prev{left: -20px;} .picScroll-left .btn .next{right: -60px;} .picScroll-left .hd{ overflow:hidden; width: 100%; height:30px; padding:0 10px; position: absolute; z-index: 10; bottom: 0px; } .picScroll-left .hd ul{ width: 100%; height: 9px; position: relative; text-align: center;} .picScroll-left .hd ul li{ width:9px; height:9px; background-color: #fff; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; display: inline-block; border-radius: 9px; } .picScroll-left .hd ul li.on{ background-color:black;} .picScroll-left .bd{ padding:10px; z-index: 1;overflow: hidden; } .picScroll-left .bd ul{ overflow:hidden; zoom:1; height: 270px; } .picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center; } .picScroll-left .bd ul li .pic{ text-align:center; } .picScroll-left .bd ul li .pic img{ width:120px; height:90px; display:block; padding:2px; border:1px solid #ccc; } .picScroll-left .bd ul li .pic a:hover img{ border-color:#999; } .picScroll-left .bd ul li .title{ line-height:24px; } .newsproduct-div{ width: 100%; height: 100%; margin: 0px auto; margin-bottom: 20px; text-align: left; position: relative;} .newsproduct-div .pic{ width: 100%!important; height: 190px; background-color: #fff; position: relative; overflow: hidden; border-radius: 5px;transform: scale(1); transition:transform 0.3s;} .newsproduct-div .pic img{ width: 100%; height: auto; display: table-cell; text-align: center; vertical-align: middle;} .newsproduct-div .pic:hover{ transform: scale(1.025); transition: 0.3s;} .newsproduct-div33 .pic{ height:198px!important} .title-product a{ line-height: 25px;font-size: 14px;color: #000; font-weight: 500;} .product-price{ line-height: 25px;font-size: 14px;color: #E6362A; } .tuijian-bk .title-product a{ color:#E6362A ;} .tuijian-bk .title-cat a{ color: #fc5e54;} .tuijian-bk .products-news-pmore{ background-color:#E6362A ;color: yellow;} .products-news-pmore{ width: 200px; height: 40px; line-height: 40px; background-color: yellow; margin: 0px auto; text-align: center; border-radius: 40px;color: #E6362A; display: block; font-size: 16px;} .dingzhi-bk{background-color: #dddede!important;} .dingzhi-bk .ctitle-a{color:#E6362A;} .dingzhi-bk .ctitle-p1{ color: #E6362A;} .dingzhi-bk .ctitle-p2{ color: #E6362A; } .dingzhi-bk .title-product a{ color:#E6362A ;} .dingzhi-bk .title-cat a{ color: #fc5e54;} .dingzhi-bk .products-news-pmore{ background-color:#E6362A ;color: yellow;} .product3_cat{ margin-top: 20px; margin-bottom: 20px;} .product3_cat-div{ width: 98%; height: 300px; margin: 0px auto; text-align: center; position: relative;} .product3_cat-div .pic{width:100%; height: 280px; position: relative; z-index: 0; background-color: #fff;transform: scale(1); transition:transform 0.3s;} .product3_cat-div .pic:hover{ transform: scale(1.1); transition: 0.3s;} .product3_cat-div .pic a{ display:block;width:100%; height: 100%; margin: 0px auto; text-align: center; vertical-align: middle;} .product3_cat-div .pic img{ max-width: 100%; max-height: 100%;margin: 0px auto; display: table-cell;text-align: center; vertical-align: middle;} .product3_cat-div .title-product{ border-radius: 3px;position: relative; background-color: #fff; width: 90%; height: 55px; line-height: 55px; margin: 0px auto; text-align: center; z-index: 10; margin-top: -40px;} .product3_cat-div .title-product a{color: #373B3E;} .why-bk{ background-color: #fff!important; height: 570px; position: relative; background-image: url(../img/bkg-yellow-cloud-1.jpg); background-position: bottom; background-repeat: no-repeat;background-position: 47% 48%;background-size: cover !important;background-repeat: no-repeat !important;padding-top: 60px!important;} .why-bk .ctitle2 img{ margin-bottom: 20px;} .why-bk .ctitle2 .ctitle-a{ margin-bottom: 20px;} .why-bk .ctitle2 .ctitle-p1{ font-weight: bold; font-size: 20px;} .why-bk .ctitle2 .ctitle-p2{ color: #333; margin-bottom: 30px;} .product-detail22{ border: solid 1px #ddd; border-radius: 10px; padding: 20px; background-color: #f5f5f5; height: auto;} .product-detail22 li,.product-detail22 .quantity{ list-style: none;margin-bottom: 20px;} .product-detail22 p{margin: 0px auto;} .attr-title{line-height: 25px; font-size: 14px;color: #333; } .color-red{color: #f91815;} .attr-price{ position: relative;clear: both; display: block;width: 100%; height: 30px; } .attr-price ins,.attr-price bdi{ font-size: 24px; color: #f91815; font-weight: 500; float:left; margin-left: 0px!important;} .attr-price del bdi{font-size: 14px!important;color: #333; float:right; margin-top: 10px; text-decoration: line-through;} .product-detail22 input[name='quantity']{border-radius: 10px;width: 50%;height: 40px; border: solid 1px #ddd;} .product-detail22 button[name='add-to-cart'],#add-to-cart-a{border-radius: 15px;width: 100%;height: 40px; background: linear-gradient(to bottom, #f91815 0, #bf1113 70%);transition: all 0.3s;display: block; text-align: center;font-size: 16px;} .product-detail22 #buy_now_button,#buy_now_button-a{ margin-top: 10px;border-radius: 15px;width: 100%;height: 40px; background: linear-gradient(to bottom, #58ae04 0, #577f30 70%);transition: all 0.3s;display: block; text-align: center;font-size: 16px;} #add-to-cart-a:hover,#buy_now_button-a:hover,.product-detail22 button[name='add-to-cart']:hover,.product-detail22 #buy_now_button:hover{background: linear-gradient(to bottom, #0483d4 0, #035e97 70%); transition: all 0.3s;} .product-detail22 .attr-tel{ text-align: center; font-size: 12px;} #add-links{ height: 500px;} #add-links .ctitle-a,#add-links .ctitle-a:hover{ font-size: 36px; line-height: 30px;} #add-links .ctitle-p1{ color: #F5F5F5; font-size:18px; line-height: 60px;} .product7_ID,.product8_ID{ text-align: center; padding-top: 120px;} .add-links-row,.add-links-row-col{ height: 100%; background-repeat: no-repeat; background-size: 100% 100%;} #add-links img{ margin-bottom:10px; max-height:70px;} #add-links .ctitle-a,#add-links .ctitle-a:hover{ line-height: 60px;} #add-links .ctitle-p2{text-align: center; margin-top: 10px; margin-bottom: 20px;} #add-links .ctitle-p2 i{ width:100px;height: 3px; background-color: #F5F5F5; display: inline-block;} #add-links .pmore-1{ display: inline-block; width: 120px; text-align: center; line-height: 40px; height: 40px; border: solid 2px #fff; border-radius: 1.875rem;color: #fff;} #contact-us{ background-color: #eee; text-align: center; height: 410px; padding-top: 60px; border-bottom: solid 1px #ddd;} #contact-us .ctitle2 img{ margin-bottom: 10px;} #contact-us .ctitle-a{color:#E6362A;} #contact-us .ctitle-p1{ color: #E6362A; font-weight: bold; line-height: 40px;} #contact-us .ctitle-p2{ color: #333; } #contact-us .products-news-pmore{ background-color:#E6362A ;color: #fff;} #testimonials_div{background-color: #f5f5f5; text-align: center; height:360px; padding-top: 40px; border-bottom: solid 1px #ddd; position:relative} #testimonials_div .ctitle-a{color:#E6362A; font-family: "arial black"; font-size:60px; line-height: 60px;} #testimonials_div .ctitle-p1{ color: #E6362A; font-weight: bold; line-height: 40px;} .testimonials-cont{color: #E6362A; font-size: 20px; } .testimonials-title{ color: #666;} .testimonials_bd{ height: 150px;} #testimonials_div .btn{ width: 100%; height:30px; padding:0 10px; position: absolute; z-index: 20; top: 50px;left: 0px; } #testimonials_div .btn .prev,.picScroll-left .btn .next{ display:block; width:30px; height:30px; cursor:pointer; font-size: 20px; position: absolute; font-weight: bold;} #testimonials_div .btn .prev{left: -20px;} #testimonials_div .btn .next{right: -60px;} #testimonials_div .bfimg{ max-height: 80px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;} #testimonials_div .bfimg img{ max-height:80px;} #news_div{background-color: #fff; text-align: center; height:460px; padding-top: 40px; } #news_div .ctitle2 { position: relative; text-align: center;} #news_div .ctitle-a{color:#E6362A; font-family: "arial black"; font-size:20px; line-height: 60px; width:220px;text-align: center; display:block; background-color: #fff; z-index: 10; margin: 0px auto; position: relative;} #news_div .ctitle2 hr{ width: 100%; height: 2px; background-color:#E6362A ; position: absolute; top: 15px; z-index: 0;} .news_div_bd{ height:300px; margin-top: 40px;} #news_div .btn{ width: 100%; height:30px; padding:0 10px; position: absolute; z-index: 20; top: 100px;left: 0px; } #news_div .btn .prev,.picScroll-left .btn .next{ display:block; width:30px; height:30px; cursor:pointer; font-size: 20px; position: absolute; font-weight: bold;} #news_div .btn .prev{left: -20px;} #news_div .btn .next{right: -60px;} #news_div .news-title{color:#E6362A; font-family: "arial, helvetica, sans-serif"; font-size:18px; line-height: 25px; font-weight: bold; width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;} #news_div .news-time{color:#666;font-size:12px; line-height: 25px; font-weight: normal; font-family: "arial, helvetica, sans-serif"; margin-top: 8px; } #news_div .news-fenge{ display: block; width: 50px; height: 2px; background-color: yellow; margin: 0px auto; margin-top: 8px; } #news_div .news-excerpt{color:#666;font-size:12px; line-height:20px;width:100%; height:160px; font-weight: normal;font-family: "arial, helvetica, sans-serif"!important;margin-top: 8px;overflow:hidden;} .picScroll-left10{ height:180px} .picScroll-left11{ height:300px} footer{ margin-top:30px; padding-top:30px; broder-top:solid 1px #ddd;} .footer-img{ text-align:center; } .footer-img .row{text-align:center;font-size:14px; line-height:40px;color:#666; display:block} .footer-img img{ max-height:60px; width:auto; margin:0px auto;margin-bottom:30px;} .footer{ margin-bottom:40px;} .footer-div dl{ width:90%; float:left;} .footer-div dl dt{ height:50px; line-height:50px} .footer-div dl dd.footer-fenge{ height:10px;} .footer-div dl dd.footer-fenge i{ width:40px; height:2px; background-color:#E6362A;display:block; float:left} .footer-div dl dd.footer-infor{ font-size:12px; line-height:25px;} .footer-menu{ width:100%;} .footer-menu a{ display:block; width:100%; height:30px; line-height:30px; border-bottom:solid 1px #EEE; font-size:12px;color:#333} .footer-a1 a{ display:block; border-radius:30px; border:solid 2px #999;color:#999; width:100px; text-align:center; height:30px; line-height:30px;} .footer-a2 a{ display:block; border-radius:30px; background-color:#E6362A;color:#fff; width:auto; max-width: 150px; padding-left: 10px; padding-right: 10px; text-align:center; height:30px; line-height:30px;} /* 产品介绍页面 */ .banner-page{ height:280px;transform: translate3d(0px, -15.06px, 0px);backface-visibility: hidden;background-size:cover !important;background-repeat: no-repeat !important; position:relative; padding:0px;background-position: 58% 50%;} .why-select-us{background-position: 50% 10%;} .banner-page .bfimg{ position:absolute; bottom:0px; padding:0px;} .banner-page .bfimg img{ max-height:100px;} .page-content{ padding:20px;} .page-productsbk{ transform: translate3d(0px, -15.06px, 0px);backface-visibility: hidden;background-size:cover !important;background-repeat: no-repeat !important; position:relative; padding:40px; background-image:url(../img/bkg-gray-i2k.jpg)} .page-productsbk h2{ line-height:30px; font-size:24px; text-align:center; color:#E6362A; margin-bottom:30px; padding-top: 30px;} .page-catDiv-div{ margin-bottom:10px;} .page-catDiv-div .catDiv-img{ width:98%; height:300px; text-align:center; margin:0px auto; position:relative} .page-catDiv-div .catDiv-img .imgDiv-a{ display:inline-block; width:200px;height:200px; overflow:hidden; margin-bottom:10px;} .page-catDiv-div .catDiv-img .imgDiv-a img{ width:100%; height:100%; border-radius:10px;} .page-catDiv-div .catDiv-img .titleDiv-a{ display:inline-block; width:100%; height:40px; line-height:40px; font-size:16px;color:#E6362A; font-weight:bold} .page-catDiv-div .catDiv-img .titleDiv-a p{ font-size:12px;line-height:20px; } .pmore-redbk{width: 200px; height: 40px;line-height: 40px;background-color: #E6362A; margin: 0px auto; text-align: center; border-radius: 40px; color: #fff; display: block; font-size: 16px; margin-top:20px;margin-bottom:20px;} .pmore-redbk:hover{ color:#fff;} .why-select-us{ height:750px;} .the_content-why-select-us{ padding:30px;} .the_content-why-select-us img{ max-width:90%; margin:0px auto} .why-select-us-title{ padding:30px; text-align:center;color:#e6362a; font-size:18px;} .why-select-us-title img{ max-width:100px; height:auto; margin:0px auto; margin-bottom:20px;} .the_content-list{ margin:0px auto; padding:0px} .the_content-list .container-fluid{margin:0px auto; padding:0px; padding-top:40px; padding-bottom:40px; background-size: cover !important;background-repeat: no-repeat !important; background-position: 50% 50%;} .the_content-list .the_content-list-txt{ text-align:left;color:#666; padding-top:30px;} .the_content-list .the_content-list-txt h2{ line-height:60px; font-size:20px; font-weight:bold; color:#e6362a;} .the_content-list .the_content-list-img{ text-align:center} .the_content-list .the_content-list-img img{ max-height:250px; width:auto; margin:0px auto;} #why-select-us-0,#why-select-us-2,#why-select-us-5{ background-color:#f5f5f5;} #why-select-us-0 .the_content-list-img img{ max-height:200px; width:auto; margin:0px auto;} #why-select-us-1{ background-color:yellow;} #why-select-us-3{ background-color:#e6362a; } #why-select-us-3 h2{ color:yellow!important;} #why-select-us-3 .the_content-list-img img{ max-height:300px; width:auto; margin:0px auto;} #why-select-us-3 .the_content-list-txt{color:#fff!important;} #why-select-us-4 .the_content-list-img img{ max-height:320px; width:auto; margin:0px auto;} #why-select-us-10{ background-color:yellow; color:#fff;} #why-select-us-10 h2{ color:#e6362a!important;} #why-select-us-7{padding-top:60px; padding-bottom:60px; } #why-select-us-7 .the_content-list-txt{ padding-top:0px!important;color:#fff;} #why-select-us-8{padding-top:60px; padding-bottom:60px; } #why-select-us-9{ background-color:yellow;} #why-select-us-9 .the_content-list-img img{ max-height:100px; width:auto; margin:0px auto; margin-top:30px;} #why-select-us-9 .the_content-list-txt{ padding-top:0px!important;} .why-infor-us{ text-align:center; padding:40px; line-height:30px; font-size:15px; font-weight:bold;} .banner-page1{ display: none;background-color:#fedd16; background-image:url(../img/bnr-catalogs-04.jpg); padding-top:30px;background-position: 100% bottom; background-size: cover !important;background-repeat:no-repeat;} .banner-page1 .bPosition a{ font-size:16px; line-height:30px; display:inline-block} .banner-page1 h1{ font-weight:bold; font-size:26px; line-height:35px;color:#E6362A; margin-top:20px; margin-bottom:0px; } .banner-page1 .categories-seo{ margin-bottom:20px;} .the_content-pages{ padding:30px;} .the_content-pages .col-md-4{ text-align:center} .the_content-pages .col-md-4 img{ max-width:80%; margin:0px auto;} .page-parsent-1229{ padding-top:40px; padding-bottom:40px; min-height:400px} .page-div-imgslist{ max-width:98%; width:330px; height:293px; position:relative; margin:0px auto; text-align:center; position:relative; } .page-div-imgslist .page-imgslist{ width:100%; height:215px; margin:0px auto;background-color:#f4f5f7; position:relative; z-index:0;} .page-div-imgslist .page-imgslist img{ max-width:100%;height:auto; width:auto; margin:0px auto;display: inline-block; vertical-align: middle;} .page-div-imgslist .page-txt{ width:80%; font-size:18px; line-height:50px; font-weight:bold; color:#E6362A; margin:0px auto; margin-top:-20px; z-index:1; position:relative; background-color:#fff; padding:8px;} .page-div-imgslist p{ font-size:14px; color:#666; line-height:20px; font-weight:normal;} .download-cat{ margin-top:30px;} .download-img{ width:96%; margin:0pxa auto; text-align:left} .download-img .download-title{ line-height:60px; font-size:16px; color:#E6362A; font-weight:bold} .download-img .imgdiv{ width:100%; height:auto;} .download-img .imgdiv img{ width:100%; height:auto;} .download-img p{margin-bottom:0px;} .download-img .download-p{ line-height:40px; font-size:14px; color:#333; } .download-img span{ font-size:12px; line-height:25px; color:#666} .contactus-page-img{ text-align:center} .contactus-page-img img{ max-width:70%; margin:0px auto;} .title-color{line-height:40px; font-size:16px; color:#E6362A; font-weight:bold} .feedbackdiv{ text-align:left} .feedbackdiv .form-group{ margin-top:8px;} .feedbackdiv .form-group label{ display:block; width:80px; line-height:30px; text-align:left; color:#666} .feedbackdiv .form-group input,.feedbackdiv .form-group textarea{ border:solid 1px #ddd; width:60%;} .feedbackdiv .form-group textarea{ height:60px; margin-bottom:20px;} .feedbackdiv .wpcf7-submit{ background-color:#E6362A; border-radius:20px; width:120px; text-align:center; line-height:20px; color:#fff; border:none; font-size:14px;} .contactus-page-the_content{ line-height:30px;} .single_cat{ text-align:center;} .single_cat a{ line-height:60px; font-size:20px; color:#E6362A; font-weight:bold; display:inline-block} .div-news .post-cat-href{ text-align:center; line-height:40px; color:#E6362A;} .div-news .post-title{ text-align:center; line-height:30px; font-size:18px; font-weight:bold; color:#E6362A; margin-bottom:10px;} .div-news .post-i{ display:block; width:60px; height:3px; background-color:yellow; margin:0px auto; margin-bottom:30px; margin-top:10px;} .div-news .post-p{text-align:center; font-size:12px; color:#999; line-height:20px;} .div-news .post-excerpt{ font-size:14px; color:#666; line-height:25px; text-align:left;} .div-news .post-cat-div{ margin-top:10px; margin-bottom:10px; width:100%; height:30px; line-height:30px; border-top:solid 1px #eee; border-bottom:solid 1px #eee;} .div-news .post-cat-div,.div-news .post-cat-div a{ font-size:12px; line-height:30px; } .div-news .post-cat-div a{ color:#E6362A;display:inline;} .div-news .post-jixu{ display:block; width:100px; height:30px; line-height:30px; text-align:center;color:#E6362A; border:solid 2px #E6362A; margin:0px auto; margin-top:20px; margin-bottom:30px;} .div-news .post-jixu:hover{ background-color:#E6362A;color:#fff;} .post-cat-sideborder{} .post-cat-sidebar{ width:100%; margin:0px auto;border-left:solid 1px #eee; padding-left:40px } .post-cat-sidebar .ctit{ width:100%; height:60px; position:relative} .post-cat-sidebar .ctit h3{ line-height:30px; font-size:18px;line-height:40px; text-align:left; color:#666; font-weight:bold;} .post-cat-sidebar .ctit i{ display:block; width:30px; height:2px; background-color:yellow; position:absolute; left:0px; bottom:0px; margin-bottom:10px;} .post-cat-sidebar .sidebar .sf-menu{ width:100%;} .post-cat-sidebar .sidebar .sf-menu li{ width:100%; height:40px; border-bottom:solid 1px #eee; } .post-cat-sidebar .sidebar .sf-menu li a{ text-align:left; text-indent:10px; color:#E6362A; line-height:40px; font-size:14px;} .post-cat-sidebar .sidebar .sf-menu li a:hover{ color:#666;} .sf-postlist{ width:100%; height:auto; margin-bottom:20px; margin-top:10px;} .sf-postlist li{ width:100%; height:60px; text-align:left; list-style:none; border-bottom:solid 1px #eee; padding-bottom:10px; margin-bottom:10px;} .sf-postlist li .d-time{ display:block; width:35px; height:35px; text-align:center; border:solid 2px #E6362A;} .sf-postlist li .d-time span{ display:block; width:100%;} .sf-postlist li .d-time .d-time-d{ line-height:20px; font-size:16px; color:#E6362A; font-weight:bold; text-align:center} .sf-postlist li .d-time .d-time-m{ line-height:10px; font-size:10px; color:#E6362A; text-align:center } .sf-postlist li a{ display:block; width:165px; font-size:14px; line-height:20px;color:#E6362A;} .sf-commontlist{ width:100%; height:auto; margin-bottom:20px; margin-top:10px;} .sf-commontlist li{ width:100%; height:60px; text-align:left; list-style:none; border-bottom:solid 1px #eee; padding-bottom:10px; margin-bottom:10px;} .recent-comments { list-style: none; font-size: 12px; color: #485358; } .recent-comments li { overflow: hidden; padding: 20px 0; border-top: 1px dotted #DADEE1; } .recent-comments li:first-child { border: 0 none; } .recent-comments img { float: left; margin-right: 8px; } .recent-comments a { display: block; margin-top: 10px; padding-top: 10px; } .sf-menu-tags a{ line-height:20px!important; font-size:10px!important; padding:3px; border-radius:3px; border:solid 1px #E6362A;} .post-cat-sidebar ul{ margin:0px auto;} .sing-index-post{ padding-top:30px;} .sing-index-post .entry-header .entry-title{ line-height:40px; font-size:20px; font-weight:bold; color:#E6362A;} .entry-header span,.entry-header span a{ font-size:10px!important; font-weight:normal!important; color:#666;} .product-lists h1{ font-size:20px; line-height:40px;} .wzPostion{padding-top:20px; padding-bottom:20px;} .weizhi_postion{ text-align:left; padding-top:10px; padding-bottom:10px;} .weizhi_postion a{ display:inline;} .weizhi_postion , .weizhi_postion a{ font-size:14px; line-height:30px;color:#999} .weizhi_postion1{ text-align:right} .weizhi_postion1 , .weizhi_postion1 a{ font-size:14px;color:#999} .weizhi_postion1 .orderby{ font-size:14px; padding:2px; border:solid 1px #eee; border-radius:2px;} .weizhi_postion1 #orderby{color:#999;width: 150px;} .pro-bigbox{ width:98%; margin:0px auto; text-align:left; position:relative; height:350px;} .pro-bigbox .bigboximg{ width:250px; height:250px; text-align:center; margin:0px auto; border:solid 1px #eee;} .pro-bigbox .bigboximg a{ display:block; width:100%; height:100%;} .pro-bigbox .bigboximg img{ vertical-align:middle; text-align:center; width:100%; height:100%; margin:0px auto;transform: scale(1); transition:transform 0.3s; padding:8px;object-fit:cover;} .pro-bigbox:hover .bigboximg img{ transform: scale(1.1); transition: 0.3s;} .pro-bigbox .bigboxword{ width:100%; margin-top:10px;} .pro-bigbox .bigboxword .post-cat{ line-height:30px; color:#666; font-size:12px;} .pro-bigbox .bigboxword .post-title{ line-height:30px; color:#E6362A; font-size:14px;} /*产品详情*/ .page_the-content{ margin-top:30px; margin-bottom:30px} .singglepic{ width:98%; height:auto; position:relative; text-align:center;} .singglepic img{object-fit:cover;width:500px; height:auto; margin:0px auto;} .pcon_r{ width:98%; height:auto; margin:0px auto;} .product_title{color:#000;font-size: 24px;font-weight: 500; } .product_title_i{ display:block; width:60px; height:2px; background-color:yellow;} .pcon_r .pcon-p{padding-top:8px; padding-bottom:8px; font-size:12px; color:#E6362A} .pcon_r .addthis_inline_share_toolbox{ position:relative;padding-top:8px; padding-bottom:8px; } .pcon_r .price{ margin-top:10px; margin-bottom:10px; font-weight:bold; line-height:40px;} .pcon_r .attrslist{ line-height:25px; font-size:14px; padding:6px;color: #666; border-top: solid 1px #eee; border-bottom: solid 1px #eee;} .pcon_r .attrslist li{list-style: disc;} .pcon_r .pcon_info{ line-height: 25px; font-size: 14px; padding: 6px; color: #666; max-height: 50px; overflow: hidden;} .pcon_r .woocommerce-product-details__short-description{display: none;} .row .tit{ font-size:16px; font-weight:bold; margin-top:20px; border-top:solid 1px #eee; } .row .tit span{ text-indent: 5px; min-width:120px;max-width: 150px;width: auto; height:40px; line-height:40px; text-align:left; border-top:solid 2px #E6362A;color:#E6362A; display:block;} .product-lists-lx .pbox-div{ width:260px; height:400px; margin:0px auto; text-align:center;} .product-lists-lx .pbox-div .pbox{ width:260px; height:260px; vertical-align:middle; text-align:center; margin-bottom:10px;} .product-lists-lx .pbox-div .pbox img{ max-width:100%; max-height:100%; height:auto; margin:0px auto;} .product-lists-lx .pbox-div p{text-align:left; font-size:14px; line-height:30px; color:#333;} /*购物车*/ .woocommerce-cart-form{ margin-top:30px; margin-bottom:30px;} .woocommerce-cart-form .shop_table{ width:100%;} .woocommerce-cart-form .shop_table .product-remove a{ font-size:20px;} .woocommerce-cart-form .shop_table .product-thumbnail img{ max-width:80px; height:auto; padding:8px; border:solid 1px #eee; margin:10px;} .woocommerce-cart-form .shop_table .product-price{ font-size:12px;} .woocommerce-cart-form .shop_table .product-quantity label{ font-size:10px;} .woocommerce-cart-form .shop_table .product-quantity input{ width:80px;} .woocommerce-cart-form .shop_table .product-subtotal{font-size:12px;} .woocommerce-cart-form .shop_table .actions{ text-align:right;} .cart-collaterals .cart_totals h2{ line-height:40px; font-size:18px; font-weight:bold; color:#E6362A} .shop_table_responsive .cart-subtotal{ font-size:14px; line-height:30px;} .shop_table_responsive th{ font-size:14px;width:40px; text-align:left} .wc-proceed-to-checkout{ margin-top:20px;} .wc-proceed-to-checkout .checkout-button{ display:inline-block; width:100px; height:30px; line-height:30px; border-radius:3px;color:#fff; text-align:center; background-color:#F60; font-size:14px;} /*账单详情 Checkout*/ .woocommerce-form-coupon-toggle{ display:none;} .woocommerce-checkout{margin-top:30px; margin-bottom:30px;} #customer_details .woocommerce-billing-fields{ width:98%;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{ display:block; width:48%; float:left; margin-right:1.5%;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p input{ width:100%;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper label,#order_comments_field label{ display:block; width:100%; font-size:12px; line-height:30px;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper .woocommerce-input-wrapper{ display:block; width:100%} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper #billing_country_field,#customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper #billing_city_field,#customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper #billing_state_field,#customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper #billing_email_field{ width:99%; margin:0px auto; margin-bottom:20px} #billing_country_field select,#billing_city_field select,#billing_state_field select,#billing_email_field select{ height:30px; width:98%} #order_comments_field .order_comments{ display:block;} #order_comments_field .woocommerce-input-wrapper{ display:block; width:98%;} #order_comments{ width:98%} #billing_email,#billing_city{ width:98%!important} #customer_details h3,#order_review_heading{ line-height:40px; font-size:18px; font-weight:bold;} #order_review table{ width:100%;} #order_review table th{ height:30px; line-height:30px; font-size:14px;} #order_review table tr{ height:30px; line-height:30px; font-size:12px;} .woocommerce-checkout-payment{ border-top:solid 1px #ddd; padding-top:10px;} .woocommerce-checkout-payment li{ list-style:none; font-size:12px; line-height:30px;} .woocommerce-checkout-payment li label{ font-weight:bold; color:red;} .woocommerce-privacy-policy-text p{ font-size:12px; line-height:20px;} .woocommerce-checkout-payment #place_order{ width:120px; height:30px; line-height:30px; background-color:#E6362A; font-size:14px; color:#fff; text-align:center; border:none; border-radius:3px;} abbr{ color:red;} .cart_item{ color:#666} .woocommerce-order{ margin-top:30px; margin-bottom:30px;} .woocommerce-notice--success{ font-size:16px; line-height:60px; color:red;} .order_details{ margin-bottom:10px; font-size:14px;} .order_details li{ margin-bottom:10px; list-style:none;} .woocommerce-order-details{ margin-top:10px; padding-top:10px; border-top:solid 1px #ddd;} .woocommerce-order-details h2{ line-height:40px; font-size:18px; font-weight:bold;} .woocommerce-order-details table{ width:100%;} .woocommerce-order-details table th{ height:30px; line-height:30px; font-size:14px;} .woocommerce-order-details table tr{ height:30px; line-height:30px; font-size:12px;} .woocommerce-info{line-height:40px; font-size:18px; margin-top:30px;} .woocommerce-cart-form .shop_table .actions button{ background:none; border:none; font-size:12px; margin-top:20px;color:red;} .woocommerce-checkout{ margin-top:0px;} .woocommerce-privacy-policy-link{ display:none;} .catDiv-infor .cat-title:hover{ background-color:#b31005; transition:0.5s} .ad-img-div .pmore:hover{ background-color: #b31005; transition:0.5s} #add-links .pmore-1:hover{ background-color: orange;color: #fff;border: solid 2px orange} .pages .wp-pagenavi span,.pages .wp-pagenavi a{ display:inline-block; margin-right:10px; font-size:12px;} /* 超小屏幕（手机，小于 768px） */ @media (max-width:429px) { #topdiv-mob .logo-div .logo-img img{ max-height:60px;} #banner{ height:220px;} #banner .bfimg{ height:50px;} #banner .bfimg img{ max-height:100%} .banner-div{ max-height: unset;} .ad-img-div{ background-position:50% 10%; height:430px; } .ad-img-div .ad-img{ max-width:200px;margin-top:70px;} .ctitle img,.ctitle2 img{ max-height: 40px;} .ctitle-a{ font-size:18px;} .ctitle-p1{ font-size:13px; line-height:20px;} .ctitle-p2{ font-size:10px; line-height:20px;} .products-news{ height:220px;} .newsproduct-div{ width:100%;} .newsproduct-div .pic {width:117px; height: 117px; } .picScroll-left .btn .next{ right:0px;} .banner-page{ height:180px;} .banner-page .bfimg{ height:50px;} .banner-page .bfimg img{ max-height:50px;} .page-productsbk{ padding:0px;} .page-productsbk h2{ line-height:40px; font-size:20px;} .page-catDiv-div .catDiv-img{ width:100%; height:260px;} .page-catDiv-div .catDiv-img .imgDiv-a{ width:100%; max-height:183px;margin-bottom:0px} .why-bk{ height:350px;} #newsproduct_div .ctitle2 img{ margin-bottom:10px;} #newsproduct_div{ padding:0px; padding-top:0!important} #newsproduct_div .ctitle2 .ctitle-a{ margin-bottom:0px;} #newsproduct_div .ctitle2 .ctitle-p1{ font-size:14px} #add-links{ height:auto;} .product7_ID, .product8_ID{ padding-top:30px; padding-bottom:30px;} #add-links .ctitle-a, #add-links .ctitle-a:hover{ font-size:25px; line-height:40px;} #testimonials_div .btn .next{ right:-20px;} .testimonials-cont{ font-size:14px} .the_content-list .the_content-list-txt{ padding-top:0px;} .the_content-list .the_content-list-img img{ max-height: 180px;} #why-select-us-0 .the_content-list-img img{ max-height: 150px;} #why-select-us-3 .the_content-list-img img{ max-height:200px;} #why-select-us-4 .the_content-list-img img{ max-height:200px;} .page-div-imgslist{ height:auto;} .post-cat-sidebar{ padding-left:10px;} .sf-postlist li a{max-width:265px; float:left!important; margin-left:10px;} .banner-page1 h1{ line-height:60px; font-size:22px;} .woocommerce-cart-form .product-remove{width:20px;} .woocommerce-cart-form .shop_table .product-thumbnail img{ max-width:50px;} .woocommerce-cart-form .shop_table .product-quantity input{ width:40px;} .woocommerce-cart-form .product-subtotal{ width:5px; display:none} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{ width:100%;} .product-infor-page{ display:none} .wzPostion{ padding:0px;} .pro-bigbox{ height:380px;} .pro-bigbox .bigboximg{ width:280px; height:280px; } .pro-bigbox .bigboxword{ text-align:center} .post-cat-sideborder{ display:none} .singglepic .flex-viewport {height:380px!important} .singglepic .flex-viewport figure img{width:380px!important; height:380px!important} .shop-pic-model #shop-pic-src img{ height: 320px; width: 320px; position: absolute; top: 20%;} .product_title{ font-size:16px; line-height:50px} } /* 没有任何媒体查询相关的代码，因为这在 Bootstrap 中是默认的（还记得 Bootstrap 是移动设备优先的吗？） */ @media (min-width: 530px) and (max-width:766px){ #topdiv-pc{ display:none;} #topdiv-mob{ display:block;} .container-fluid{ padding: 0px;} #topdiv-mob .logo-div .logo-img img{ max-height:60px;} #banner{ height:360px;} .slideBox .bd li img{left:-30%!important;} .logo-div div,.logo-div img{ max-height: 100%; margin: 0px auto;} .logo-div .row{ height: 100%;} .logo-div .menutel a{ font-size: 25px;} .logo-div .logo-img img{ max-height: 90%;} .logo-div .cat-icons a{ font-size: 25px;width: 25px;transition: 0.3s;} .logo-div .cat-icons a:hover{ font-size: 30px; width: 30px; transition: 0.3s;} .logo-div .cat-icons span{ text-align: center; left: 0px;top: 8px; height: 16px;} .ad-img-div{ height: 400px;} .ad-img-div .ad-img{ max-width: 200px; margin-top: 80px;} .ad-img-div .ad-infor, .ad-img-div .ad-infor a{ font-size: 16px;} .ad-img-div .pmore{ line-height: 20px;width: 120px; font-size: 14px;} .products-news{ height:360px;} .newsproduct-div .pic{ width: 207px; height: 207px;} .product3_cat-div{ width: 100%;} .product3_cat-div .pic{ width: 100%; height: 227px;} .product3_cat-div .pic img{ padding: 8px;} .product3_cat-div .title-product{ height: 45px; line-height: 45px;margin-top: -20px;} .why-bk{ height: 470px;} .banner-page{ height:300px;} .ctitle img{ max-height: 60px;} .catDiv-img .imgDiv-a{ width: 100%; height: 300px;} .catDiv-infor{ margin-top: -100px;} .catDiv-i .ctitle-a{ line-height: 40px; font-size: 20px;} .ctitle-p1{ font-size: 16px;} .banner-page{ height:300px;} .page-productsbk h2{ line-height:40px; font-size:26px; } nfor .cat-title{ line-height: 40px; height: 40px;} #testimonials_div .btn .next{ right:-20px;} .the_content-list .the_content-list-txt{ padding-top:0px;} .the_content-list .the_content-list-img img{ max-height: 180px;} #why-select-us-0 .the_content-list-img img{ max-height: 150px;} #why-select-us-3 .the_content-list-img img{ max-height:200px;} #why-select-us-4 .the_content-list-img img{ max-height:200px;} .page-div-imgslist .page-txt{ font-size:16px; line-height:40px;width: 90%;margin-top:-90px;} .page-div-imgslist p{ font-size:11px;} .banner-page1 .bPosition,.banner-page1 .bPosition a{ font-size:14px;} .banner-page1 h1{ line-height:60px; font-size:22px;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{ width:100%;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{ width:100%!important;} .woocommerce-checkout input,.woocommerce-checkout select,.woocommerce-checkout textarea{ width:100%!important;} #billing_email, #billing_city{ width:100%!important;} #payment_method_bacs{ width:20px!important} .product-infor-page{ display:none} } /* 小屏幕（平板，大于等于 768px）@screen-sm-min */ @media (min-width:768px ) and (max-width:991px) { body{ min-width: 768px; max-width: 100%;} .container{ max-width:768px;} #banner{ width: 100%; height:525px; margin: 0px auto; padding: 0px; position: relative;border: none; } #banner #slideBox{ border: none;} #banner .lunbo{ z-index: 0; height: 100%; position: relative;} #banner .lunbo .bd ul,#banner .lunbo .bd li{ width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li a{ display: block;width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li img{ } #banner .bfimg{ max-height: 100px; } #banner .bfimg img{ max-height:80px;} #testimonials_div .bfimg{ max-height:80px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;} #testimonials_div .bfimg img{ max-height:80px;} .page-div-imgslist{ max-width:98%; width:380px; } .ctitle img{max-height: 60px;} .ctitle a{ line-height: 42px;border-radius:42px;} .ctitle p{ font-size:18px;} .catDiv-img .imgDiv-a{ height: 200px; width: 100%;} .catDiv-img a img{ transform: scale(1); transition: 0.5s;} .catDiv-img a:hover img{ transform: scale(1.2); transition: 0.5s;} .catDiv-infor i{ height: 40px;} .catDiv-infor h2{ font-size: 20px;} .catDiv-infor p{ font-size: 14px;color: #666;} .catDiv-infor .cat-title{width:50%; height:30px; line-height: 30px; border-radius: 30px;font-size: 14px;} .ctitle-a{ line-height: 40px; font-size: 20px;} .ctitle-p1{ font-size: 16px;} .ad-img-div{ height: 400px;} .ad-img-div .ad-img{ max-width: 200px; margin-top: 80px;} .ad-img-div .ad-infor, .ad-img-div .ad-infor a{ font-size: 16px;} .ad-img-div .pmore{ line-height: 20px;width: 120px; font-size: 14px;} .products-news{ height: 300px;} .picScroll-left .bd{ width:700px; margin:0px auto} .newsproduct-div .pic{ width:189px; height: 189px;} .picScroll-left .btn .next{ right:-20px;} .product3_cat-div{ width: 100%;} .product3_cat-div .pic{ width: 100%; height: 227px;} .product3_cat-div .pic img{ padding: 8px;} .product3_cat-div .title-product{ height: 45px; line-height: 45px;margin-top: -20px;} .banner-page{ height:350px;} .page-productsbk h2{ line-height:50px; font-size:30px; } .banner-page1{ display:block;} .page-productsbk{ padding:10px;} .page-productsbk h2{ line-height:40px; font-size:20px;} #testimonials_div .btn .next{ right:-20px;} .the_content-list .the_content-list-txt{ padding-top:0px;} .the_content-list .the_content-list-img img{ max-height: 180px;} #why-select-us-0 .the_content-list-img img{ max-height: 150px;} #why-select-us-3 .the_content-list-img img{ max-height:200px;} #why-select-us-4 .the_content-list-img img{ max-height:200px;} .page-div-imgslist .page-txt{margin-top:-90px; font-size:16px; line-height:40px;width: 90%;} .page-div-imgslist p{ font-size:11px;} .post-cat-sidebar .ctit h3{ font-size:16px;} .sf-postlist li a{ width:150px; font-size:12px;} .banner-page1 .bPosition,.banner-page1 .bPosition a{ font-size:14px;} .banner-page1 h1{ line-height:60px; font-size:22px;} #customer_details .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper p{ width:100%!important;} .woocommerce-checkout input,.woocommerce-checkout select,.woocommerce-checkout textarea{ width:100%!important;} #billing_email, #billing_city{ width:100%!important;} #payment_method_bacs{ width:20px!important} .pro-bigbox{ height:320px;} .pro-bigbox .bigboximg{ width:213px; height:213px;} .pro-bigbox .bigboximg img{ padding:8px;} .product-infor-page .post-cat-sidebar .sidebar .sf-menu li,.product-infor-page .post-cat-sidebar .sidebar .sf-menu li a{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} } /* 中等屏幕（桌面显示器，大于等于 992px） @media (min-width: @screen-md-min) { } */ /* 大屏幕（大桌面显示器，大于等于 1200px） @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { } @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { } */ @media (min-width: 992px) { body{ min-width: 992px; max-width: 100%;} #topdiv-pc{ display:block;} #topdiv-mob{ display:none;} .container{ max-width:1080px;} #topdiv-pc{ display:block;} #topdiv-mob{ display:none;} #banner{ width: 100%; height:725px; margin: 0px auto; padding: 0px; position: relative;border: none; } #banner #slideBox{ border: none;} #banner .lunbo{ z-index: 0; height: 100%; position: relative;} #banner .lunbo .bd ul,#banner .lunbo .bd li{ width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li a{ display: block;width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li img{ } #banner .bfimg{ max-height: 250px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;;} #banner .bfimg img{ max-height:250px;} #testimonials_div .bfimg{ max-height:80px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;} #testimonials_div .bfimg img{ max-height:80px;} .page-div-imgslist{ max-width:98%; width:380px; } .ctitle img{max-height: 80px;} .ctitle a{ line-height: 52px;border-radius:52px;} .ctitle p{ font-size:26px;} .catDiv-img .imgDiv-a{ height: 300px; width: 100%;} .catDiv-img a img{ transform: scale(1); transition: 0.5s;} .catDiv-img a:hover img{ transform: scale(1.2); transition: 0.5s;} .catDiv-infor i{ height: 60px;} .catDiv-infor h2{ font-size: 24px;} .catDiv-infor p{ font-size: 16px;color: #666;} .catDiv-infor .cat-title{width:50%; height: 45px; line-height: 45px; border-radius: 30px;} .ctitle-a{ line-height: 60px; font-size: 24px;} .ctitle-p1{ font-size: 20px;} .ad-img-div{ height: 620px;} .ad-img-div .ad-img{ max-width: 300px; margin-top: 120px;} .ad-img-div .ad-infor, .ad-img-div .ad-infor a{ font-size: 2px;} .ad-img-div .pmore{ line-height: 40px;width: 200px; font-size: 20px;} .picScroll-left .bd{ width:700px; margin:0px auto} .products-news{ height: 300px;} .newsproduct-div .pic {width: 210px; height: 210px; } .picScroll-left .btn .next{ right:-10px;} .product3_cat-div{ width: 100%;} .product3_cat-div .pic{ width: 100%; height: 227px;} .product3_cat-div .pic img{ padding: 8px;} .product3_cat-div .title-product{ height: 45px; line-height: 45px;margin-top: -20px;} .banner-page{ height:450px;} .page-productsbk h2{ line-height:50px; font-size:30px; } .post-cat-sidebar{ width:250px } .banner-page1{ display:block;} } /* 大屏幕（大桌面显示器，大于等于 1200px）==screen-lg-min */ @media (min-width:1200px) { .container{ max-width:1200px;} #topdiv-pc{ display:block;} #topdiv-mob{ display:none;} #banner{ width: 100%; height:600px; margin: 0px auto; padding: 0px; position: relative;border: none; } #banner #slideBox{ border: none;} #banner .lunbo{ z-index: 0; height: 100%; position: relative;} #banner .lunbo .bd ul,#banner .lunbo .bd li{ width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li a{ display: block;width: 100%; height: 100%; position: relative;} #banner .lunbo .bd li img{ } #banner .bfimg{ max-height: 160px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;;} #banner .bfimg img{ max-height:160px;} #testimonials_div .bfimg{ max-height:80px; z-index: 10; position: absolute; bottom: 0px; padding: 0px;} #testimonials_div .bfimg img{ max-height:80px;} .picScroll-left .bd{ width:980px; margin:0px auto} .picScroll-left .btn .prev{ left:0px} .picScroll-left .btn .next{ right:0px} .page-div-imgslist{ max-width:98%; width:380px; } .ctitle img{max-height: 80px;} .ctitle a{ line-height: 52px;border-radius:52px;} .ctitle p{ font-size:26px;} .catDiv-img .imgDiv-a{ height: 300px; width: 100%;} .catDiv-img a img{ transform: scale(1); transition: 0.5s;} .catDiv-img a:hover img{ transform: scale(1.2); transition: 0.5s;} .catDiv-infor i{ height: 60px;} .catDiv-infor h2{ font-size: 24px;} .catDiv-infor p{ font-size: 16px;color: #666;} .catDiv-infor .cat-title{width:50%; height: 45px; line-height: 45px; border-radius: 30px;} .ctitle-a{ line-height: 60px; font-size: 24px;} .ctitle-p1{ font-size: 20px;} .banner-page{ height:450px;} .page-productsbk h2{ line-height:50px; font-size:30px; } .page-catDiv-div .catDiv-img{ height:280px;} .page-catDiv-div .catDiv-img .imgDiv-a{ width:200px;height:200px; } .post-cat-sidebar{ width:250px } .banner-page1{ display:block;} } /* Codex US-market redesign — 2026-07-30 */ :root { --xz-navy: #102a43; --xz-blue: #146eb4; --xz-blue-dark: #0c4f86; --xz-orange: #f97316; --xz-orange-dark: #dc5b08; --xz-ink: #172b3a; --xz-muted: #5d6b78; --xz-line: #dce5ec; --xz-bg: #f5f8fb; --xz-white: #fff; --xz-radius: 14px; --xz-shadow: 0 12px 32px rgba(16, 42, 67, .10); } html { scroll-behavior: smooth; } body { color: var(--xz-ink) !important; background: var(--xz-white) !important; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; font-size: 16px; line-height: 1.6; overflow-x: hidden; } body *, body *::before, body *::after { box-sizing: border-box; } img { max-width: 100%; } a { transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; } .container { max-width: 1200px !important; } /* Header and navigation */ #topdiv-top { background: var(--xz-navy) !important; border: 0 !important; } #topdiv-top .container { min-height: 46px; } #topdiv-top, #topdiv-top a, #topdiv-top input { color: #fff !important; } #topdiv-top .topdivpc-search input { width: 220px !important; height: 34px !important; border: 1px solid rgba(255,255,255,.28) !important; border-radius: 999px !important; background: rgba(255,255,255,.12) !important; padding: 0 16px !important; } #topdiv-pc .logo-div { position: sticky; top: 0; z-index: 900; min-height: 76px; background: #fff !important; border-bottom: 1px solid var(--xz-line); box-shadow: 0 5px 20px rgba(16,42,67,.08); } #topdiv-pc .nav-div { display: flex; align-items: center; min-height: 76px; } #topdiv-pc .rootmenu { display: flex !important; align-items: center; gap: 4px; width: 100%; margin: 0 !important; padding: 0 !important; } #topdiv-pc .rootmenu > li > a { color: var(--xz-navy) !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1.25 !important; padding: 12px 10px !important; border-radius: 8px; } #topdiv-pc .rootmenu > li > a:hover, #topdiv-pc .rootmenu > li > a.active { color: var(--xz-blue) !important; background: #eaf4fb !important; } #topdiv-pc .submenu { min-width: 230px !important; padding: 10px !important; border: 1px solid var(--xz-line) !important; border-radius: 12px !important; background: #fff !important; box-shadow: var(--xz-shadow) !important; } #topdiv-pc .submenu a { display: block; padding: 9px 11px !important; color: var(--xz-ink) !important; border-radius: 7px; font-size: 14px !important; } #topdiv-pc .submenu a:hover { color: var(--xz-blue) !important; background: #eef6fb; } /* Homepage sales-first intro */ .us-home-hero { background: radial-gradient(circle at 88% 12%, rgba(20,110,180,.20), transparent 28%), linear-gradient(135deg, #0b2034 0%, #123c60 62%, #146eb4 100%); color: #fff; padding: 72px 20px 68px; overflow: hidden; } .us-home-hero__inner { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .7fr); gap: 56px; align-items: center; max-width: 1200px; margin: 0 auto; } .us-home-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 7px 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; background: rgba(255,255,255,.09); color: #dceeff; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .us-home-hero h1 { max-width: 800px; margin: 0 0 18px !important; color: #fff !important; font-size: clamp(40px, 5.2vw, 68px) !important; font-weight: 850 !important; line-height: 1.04 !important; letter-spacing: -.045em; } .us-home-hero__lead { max-width: 720px; margin: 0 0 28px; color: #d7e7f3; font-size: clamp(17px, 2vw, 20px); line-height: 1.65; } .us-home-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 26px; } .us-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 22px; border: 2px solid transparent; border-radius: 10px; font-weight: 800; text-decoration: none !important; } .us-btn--primary { color: #fff !important; background: var(--xz-orange); box-shadow: 0 10px 24px rgba(249,115,22,.26); } .us-btn--primary:hover { color: #fff !important; background: var(--xz-orange-dark); transform: translateY(-2px); } .us-btn--secondary { color: #fff !important; border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.08); } .us-btn--secondary:hover { color: var(--xz-navy) !important; background: #fff; } .us-home-hero__proof { display: flex; flex-wrap: wrap; gap: 16px 26px; margin: 0; padding: 0; list-style: none; } .us-home-hero__proof li { color: #e8f2fa; font-size: 14px; font-weight: 650; } .us-home-hero__proof li::before { content: "✓"; margin-right: 8px; color: #6ee7b7; font-weight: 900; } .us-home-hero__card { padding: 28px; border: 1px solid rgba(255,255,255,.19); border-radius: 18px; background: rgba(255,255,255,.1); box-shadow: 0 20px 50px rgba(0,0,0,.18); backdrop-filter: blur(10px); } .us-home-hero__card strong { display: block; margin-bottom: 10px; color: #fff; font-size: 22px; line-height: 1.25; } .us-home-hero__card p { margin: 0 0 18px; color: #d7e7f3; } .us-home-hero__card a { color: #fff !important; font-weight: 800; text-decoration: underline; text-underline-offset: 4px; } /* Promotional image mosaic */ .banner-div { gap: 16px 0; padding-top: 42px; padding-bottom: 30px; } .banner-div > [class*="col-"] { padding-left: 8px !important; padding-right: 8px !important; } .banner-item { overflow: hidden; border: 0 !important; border-radius: var(--xz-radius); background: #e8f0f6; box-shadow: var(--xz-shadow); } .banner-item a { display: block; width: 100%; height: 100%; } .banner-item img { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform .35s ease; } .banner-item:hover img { transform: scale(1.025); } /* Category cards */ .index-catlist { padding-top: 12px; padding-bottom: 50px; } .index-catlist > .row { margin-left: -8px; margin-right: -8px; } .index-catlist > .row > [class*="col-"] { padding: 8px !important; } .index-cat { height: 100%; overflow: hidden; border: 1px solid var(--xz-line); border-radius: 12px; background: #fff; box-shadow: 0 6px 18px rgba(16,42,67,.07); } .index-cat:hover { border-color: #9bc5df; transform: translateY(-3px); box-shadow: var(--xz-shadow); } .index-cat .imgDiv-a { display: block; aspect-ratio: 1.22 / 1; overflow: hidden; background: #edf3f7; } .index-cat .imgDiv-a img { width: 100% !important; height: 100% !important; object-fit: cover !important; } .index-cat .titleDiv-a { display: flex !important; align-items: center; justify-content: center; min-height: 56px; padding: 9px !important; color: var(--xz-navy) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.3 !important; text-align: center; } /* Section rhythm and headings */ .session-select, .session-chuxiao, #newsproduct_div, .dingzhi-bk { padding-top: 58px !important; padding-bottom: 58px !important; } .session-select, #newsproduct_div { background: var(--xz-bg) !important; } .title-h2, .ctitle-a { margin: 0 0 28px !important; color: var(--xz-navy) !important; font-size: clamp(28px, 3.5vw, 42px) !important; font-weight: 850 !important; line-height: 1.15 !important; letter-spacing: -.025em; } /* Product cards, archives and recommendations */ .newsproduct-div, .pro-bigbox, .product3_cat-div { height: 100%; overflow: hidden; border: 1px solid var(--xz-line) !important; border-radius: var(--xz-radius) !important; background: #fff !important; box-shadow: 0 7px 22px rgba(16,42,67,.07); } .newsproduct-div:hover, .pro-bigbox:hover, .product3_cat-div:hover { transform: translateY(-4px); box-shadow: var(--xz-shadow); } .newsproduct-div .pic, .pro-bigbox .bigboximg, .product3_cat-div .pic { aspect-ratio: 1 / 1; height: auto !important; overflow: hidden; background: #edf3f7; } .newsproduct-div .pic img, .pro-bigbox .bigboximg img, .product3_cat-div .pic img { width: 100% !important; height: 100% !important; object-fit: cover !important; } .title-product, .bigboxword { padding: 14px 14px 16px !important; } .title-product a, .bigboxword .post-title { display: -webkit-box !important; overflow: hidden; color: var(--xz-navy) !important; font-size: 15px !important; font-weight: 750 !important; line-height: 1.45 !important; text-decoration: none !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .product-price { color: var(--xz-orange) !important; font-weight: 850; } .pro_lb0.row > [class*="col-"] { margin-bottom: 22px; } .banner-page1 { padding: 44px 0 38px !important; background: linear-gradient(135deg, var(--xz-navy), var(--xz-blue-dark)) !important; color: #fff; } .banner-page1 h1 { color: #fff !important; font-weight: 850 !important; } .banner-page1 .bPosition, .banner-page1 .bPosition a { color: #d7e7f3 !important; } .wzPostion { align-items: center; padding: 24px 0 10px; } .orderby { min-height: 44px; border: 1px solid var(--xz-line) !important; border-radius: 9px; background: #fff; padding: 0 36px 0 12px; } /* Forms and conversion */ input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea { max-width: 100%; border: 1px solid #c8d5df !important; border-radius: 9px !important; background: #fff !important; } input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, textarea:focus { border-color: var(--xz-blue) !important; box-shadow: 0 0 0 3px rgba(20,110,180,.14) !important; outline: 0; } button, input[type="submit"], .button, .products-news-pmore { border: 0 !important; border-radius: 9px !important; color: #fff !important; background: var(--xz-orange) !important; font-weight: 800 !important; } button:hover, input[type="submit"]:hover, .button:hover, .products-news-pmore:hover { background: var(--xz-orange-dark) !important; } /* Footer */ footer, #footer { background: #0b1f31 !important; color: #c9d7e2 !important; } footer a, #footer a { color: #dce9f2 !important; } footer a:hover, #footer a:hover { color: #fff !important; } /* Mobile: true two-column image/product display */ @media (max-width: 767.98px) { html, body { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; } body { font-size: 15px; } .container { width: 100% !important; padding-left: 12px !important; padding-right: 12px !important; } #topdiv-mob .top { background: var(--xz-navy) !important; } #topdiv-mob .logo-div { min-height: 78px; background: #fff !important; border-bottom: 1px solid var(--xz-line); } #topdiv-mob .logo-img img { max-height: 66px !important; width: auto !important; } #show_nav { color: var(--xz-navy) !important; font-size: 24px !important; } .mob_top_menus { width: min(88vw, 360px) !important; background: #fff !important; box-shadow: 18px 0 50px rgba(16,42,67,.25); } .mob_top_menus .rootmenu li a { color: var(--xz-navy) !important; border-bottom: 1px solid var(--xz-line); } .us-home-hero { width: 100% !important; max-width: 100vw !important; padding: 42px 16px 40px; } .us-home-hero__inner, .us-home-hero__inner > *, .us-home-hero__inner p { width: 100% !important; max-width: 100% !important; min-width: 0 !important; white-space: normal !important; overflow-wrap: anywhere; } .us-home-hero__inner { display: block; } .us-home-hero h1 { width: 100% !important; max-width: 100% !important; font-size: 35px !important; line-height: 1.08 !important; white-space: normal !important; overflow-wrap: normal; } .us-home-hero__lead { font-size: 16px; } .us-home-hero__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; width: 100% !important; } .us-btn { width: 100% !important; min-width: 0 !important; min-height: 48px; padding: 0 8px; font-size: 13px; white-space: normal !important; } .us-home-hero__proof { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; } .us-home-hero__card { margin-top: 26px; padding: 22px; } .banner-div { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding-top: 22px; } .banner-div > [class*="col-"] { width: auto !important; max-width: none !important; padding: 0 !important; } .banner-div > .col-md-6:first-child { grid-column: 1 / -1; aspect-ratio: 1.35 / 1; } .banner-div > .col-md-6:last-child, .banner-div > .col-md-6:last-child > .row { display: contents !important; } .banner-div .banner-item2, .banner-div .banner-item3 { aspect-ratio: 1 / 1; } .index-catlist > .row, .session-select .row, .session-chuxiao .row, .product3_cat > .row, .pro_lb0.row, .picList.row { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; margin: 0 !important; } .index-catlist > .row > [class*="col-"], .session-select .row > [class*="col-"], .session-chuxiao .row > [class*="col-"], .product3_cat > .row > [class*="col-"], .pro_lb0.row > [class*="col-"], .picList.row > [class*="col-"] { width: auto !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } .session-select .row > h2, .session-chuxiao .row > h2 { grid-column: 1 / -1; } .index-cat .titleDiv-a { min-height: 52px; padding: 8px 5px !important; font-size: 13px !important; } .newsproduct-div .pic, .pro-bigbox .bigboximg, .product3_cat-div .pic { aspect-ratio: 1 / 1; } .title-product, .bigboxword { padding: 10px !important; } .title-product a, .bigboxword .post-title { font-size: 13px !important; line-height: 1.4 !important; } .session-select, .session-chuxiao, #newsproduct_div, .dingzhi-bk { padding-top: 38px !important; padding-bottom: 38px !important; } .title-h2, .ctitle-a { margin-bottom: 20px !important; font-size: 28px !important; } .banner-page1 { padding: 30px 0 24px !important; } .banner-page1 h1 { font-size: 30px !important; } .wzPostion > [class*="col-"] { width: 100% !important; max-width: 100% !important; text-align: left !important; margin-bottom: 10px; } .float-contact, .call-now-button { transform: scale(.86); transform-origin: right bottom; } } @media (min-width: 768px) and (max-width: 1100px) { #topdiv-pc .rootmenu > li > a { padding: 10px 6px !important; font-size: 12px !important; } .us-home-hero__inner { grid-template-columns: 1fr .62fr; gap: 30px; } } /* Full-width, single-line catalog navigation on category and product pages */ @media (min-width: 768px) { #topdiv-pc .logo-div > .container, #topdiv-pc .logo-div .nav-div { width: min(1440px, calc(100% - 32px)) !important; max-width: 1440px !important; } #topdiv-pc .nav-div { overflow: visible; } #topdiv-pc .rootmenu { flex-wrap: nowrap !important; justify-content: space-between; gap: 0 !important; overflow: visible !important; scrollbar-width: none; white-space: nowrap; } #topdiv-pc .rootmenu::-webkit-scrollbar { display: none; } #topdiv-pc .rootmenu > li { display: flex !important; flex: 1 0 auto; align-items: center; height: 54px !important; float: none !important; margin: 0 !important; padding: 0 !important; white-space: nowrap !important; } #topdiv-pc .rootmenu > li > a { display: flex !important; align-items: center; justify-content: center; min-height: 54px; padding: 10px clamp(7px, .75vw, 15px) !important; white-space: nowrap !important; } #topdiv-pc .nav-div .rootmenu { position: static !important; top: auto !important; right: auto !important; height: auto !important; } #topdiv-pc .nav-div .rootmenu > li:first-child { padding: 0 !important; } #topdiv-pc .nav-div .rootmenu > li:first-child > a { font-size: 15px !important; font-weight: 700 !important; } #topdiv-pc .rootmenu > li { position: relative !important; overflow: visible !important; } #topdiv-pc .rootmenu > li > .submenu { top: 54px !important; z-index: 1300 !important; } #topdiv-pc .rootmenu > li:hover > .submenu, #topdiv-pc .rootmenu > li:focus-within > .submenu { display: block !important; visibility: visible !important; opacity: 1 !important; } } /* Contact-page email actions */ .xz-whatsapp-contact { margin: 0 0 18px; } .xz-whatsapp-contact h3 { margin: 0 0 6px !important; color: var(--xz-navy) !important; font-size: 22px !important; font-weight: 800 !important; } .xz-whatsapp-contact > p { margin: 0 0 14px; color: var(--xz-muted); font-size: 14px; } .xz-whatsapp-actions { display: flex; flex-wrap: wrap; gap: 10px; } .xz-whatsapp-button { display: inline-flex !important; align-items: center; justify-content: center; min-height: 48px; padding: 0 18px; border-radius: 999px; color: #fff !important; background: #20b85a; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 15px; font-weight: 750; line-height: 1.2; text-decoration: none !important; box-shadow: 0 7px 20px rgba(32,184,90,.20); } .xz-whatsapp-button::before { content: "\260E"; display: grid; place-items: center; width: 25px; height: 25px; margin-right: 9px; border: 2px solid currentColor; border-radius: 50%; font-size: 13px; line-height: 1; } .xz-whatsapp-button:hover { color: #fff !important; background: #169b49; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(32,184,90,.27); } .xz-email-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0 28px; } .xz-email-button { display: inline-flex !important; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; border: 1px solid #0071e3; border-radius: 999px; color: #fff !important; background: #0071e3; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none !important; box-shadow: 0 6px 18px rgba(0,113,227,.18); } .xz-email-button::before { content: "\2709"; margin-right: 9px; font-size: 18px; } .xz-email-button:hover { color: #fff !important; background: #0077ed; transform: translateY(-1px); box-shadow: 0 9px 22px rgba(0,113,227,.24); } /* Compact email actions inside every product purchase card. */ body.single-product .attr-tel .xz-product-email-actions { display: flex; justify-content: center; gap: 8px; margin: 10px auto 0; } body.single-product .attr-tel .xz-product-email-button { display: inline-flex !important; align-items: center; justify-content: center; min-height: 34px; padding: 0 12px; border: 1px solid #174f7a; border-radius: 999px; font-size: 12px; font-weight: 750; line-height: 1; text-decoration: none !important; white-space: nowrap; box-shadow: 0 4px 12px rgba(16,42,67,.10); } body.single-product .attr-tel .xz-product-email-button::before { content: "\2709"; margin-right: 6px; font-size: 13px; } body.single-product .attr-tel .xz-product-email-button.is-primary { color: #fff !important; background: #174f7a; } body.single-product .attr-tel .xz-product-email-button.is-secondary { color: #174f7a !important; background: #eef5fa; } body.single-product .attr-tel .xz-product-email-button:hover { color: #fff !important; border-color: #0f3d60; background: #0f3d60; transform: translateY(-1px); } /* Center the Product Details content canvas without centering long-form copy. */ body.single-product .pcon { display: block !important; width: min(1440px, calc(100% - 32px)) !important; max-width: 1440px !important; margin: 44px auto 0 !important; } body.single-product .pcon > .tit { width: 100%; margin: 0 auto 30px; text-align: center; } body.single-product .pcon > .tit span { display: inline-block; } body.single-product .pcon > .clear { display: none; } body.single-product .pcon > .pinfo { width: min(1200px, 100%); margin: 0 auto !important; text-align: center; } body.single-product .pcon > .pinfo > ul, body.single-product .pcon > .pinfo > ol { width: min(900px, calc(100% - 32px)); margin: 18px auto 30px !important; padding-left: 24px; text-align: left; } body.single-product .pcon > .pinfo img { display: block !important; width: auto !important; max-width: 100% !important; height: auto !important; margin: 20px auto !important; } body.single-product .pcon > .pinfo iframe, body.single-product .pcon > .pinfo video { display: block; max-width: 100%; margin-right: auto; margin-left: auto; } /* Dedicated YouTube video library */ .xz-video-library { width: min(1440px, calc(100% - 32px)); margin: 52px auto 72px; } .xz-video-library__header { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 30px; } .xz-video-library__header p { margin: 0 0 5px; color: #6e6e73; font-size: 14px; font-weight: 650; } .xz-video-library__header h1 { margin: 0 0 8px !important; color: #1d1d1f !important; font-size: clamp(30px, 2.8vw, 40px) !important; font-weight: 720 !important; line-height: 1.08 !important; letter-spacing: -.03em; } .xz-video-library__header > div > span { color: #6e6e73; font-size: 15px; } .xz-video-library__header > a { flex: 0 0 auto; color: #0066cc !important; font-size: 15px; font-weight: 650; text-decoration: none !important; } .xz-video-library__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; } .xz-video-library__item { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 18px; background: #111; box-shadow: 0 8px 28px rgba(0,0,0,.10); } .xz-video-library__item iframe { width: 100%; height: 100%; border: 0; } .xz-video-library__empty { grid-column: 1 / -1; padding: 50px 24px; border-radius: 18px; color: #6e6e73; background: #f5f5f7; text-align: center; } @media (max-width: 767.98px) { .xz-whatsapp-contact h3 { font-size: 20px !important; } .xz-whatsapp-actions { display: grid; grid-template-columns: 1fr; } .xz-whatsapp-button { width: 100%; } .xz-email-actions { display: grid; grid-template-columns: 1fr; } .xz-email-button { width: 100%; font-size: 14px; } body.single-product .attr-tel .xz-product-email-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } body.single-product .attr-tel .xz-product-email-button { width: 100%; padding: 0 7px; font-size: 11px; } body.single-product .pcon { width: calc(100% - 20px) !important; margin-top: 28px !important; } body.single-product .pcon > .tit { margin-bottom: 20px; } body.single-product .pcon > .pinfo > ul, body.single-product .pcon > .pinfo > ol { width: calc(100% - 12px); margin-bottom: 22px !important; } .xz-video-library { width: calc(100% - 20px); margin: 32px auto 50px; } .xz-video-library__header { display: block; margin-bottom: 22px; } .xz-video-library__header h1 { font-size: 30px !important; } .xz-video-library__header > a { display: inline-block; margin-top: 15px; } .xz-video-library__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .xz-video-library__item { border-radius: 12px; } } /* 1920px desktop content canvas; header navigation follows the homepage width */ @media (min-width: 768px) { body > .container, main > .container, #main > .container, .site-main > .container, .wzPostion.container, .productList-div.container, .productDetail-div.container { width: calc(100% - 40px) !important; max-width: 1920px !important; } #topdiv-top > .container, #topdiv-pc .logo-div > .container { width: min(1440px, calc(100% - 32px)) !important; max-width: 1440px !important; } } /* Compact, recognizable global social links */ .xz-social-links { display: inline-flex; align-items: center; gap: 7px; margin: 0 10px; vertical-align: middle; } .xz-social-links a { display: inline-flex !important; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0 !important; border-radius: 50%; color: #fff !important; font-size: 16px; line-height: 1; text-decoration: none !important; box-shadow: 0 2px 7px rgba(0,0,0,.18); transition: transform .18s ease, filter .18s ease; } .xz-social-links a:hover { color: #fff !important; filter: brightness(1.12); transform: translateY(-2px); } .xz-social-links .is-facebook { background: #1877f2; } .xz-social-links .is-youtube { background: #ff0000; } .xz-social-links .is-instagram { background: linear-gradient(135deg, #833ab4, #fd1d1d 55%, #fcb045); } .xz-social-links .is-tiktok { background: #111; text-shadow: -1px 0 #25f4ee, 1px 0 #fe2c55; } .xz-more-info { display: inline-flex !important; align-items: center; justify-content: center; min-height: 34px; margin: 0 8px; padding: 0 18px !important; color: #102033 !important; background: #dfbd76; font-size: 13px; font-weight: 700; text-decoration: none !important; white-space: nowrap; } .xz-more-info span { margin-left: 10px; font-size: 18px; line-height: 1; } .xz-more-info:hover { color: #102033 !important; background: #ebca84; } @media (max-width: 767.98px) { #topdiv-mob .xz-more-info { min-height: 30px; margin: 2px 5px; padding: 0 10px !important; font-size: 11px; } } /* Product category archives retain the original compact catalog proportions. */ @media (min-width: 768px) { body.archive.tax-product_cat > .container { width: calc(100% - 32px) !important; max-width: 1200px !important; } } /* Removed the obsolete decorative phone strip below the copyright footer. */ .footer-img > .row:first-child { display: none !important; } /* Remove the obsolete Call Now plugin strip on every viewport. */ #callnowbutton, .call-now-button, a.call-now-button { display: none !important; width: 0 !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; background: none !important; } /* Extend the navy footer through the physical bottom of the browser viewport. */ html { background-color: #102a43 !important; } body { margin-bottom: 0 !important; padding-bottom: 0 !important; } body::after { content: ""; display: block; width: 100%; height: 14px; margin: 0; background: #102a43; } footer { margin-bottom: 0 !important; border-bottom: 0 !important; background-color: #102a43 !important; } footer + p.clear, footer ~ p.clear { display: none !important; width: 0 !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; line-height: 0 !important; } /* AliExpress-inspired marketplace homepage — 2026-07-30 */ body.ali-homepage { background: #f5f5f5 !important; color: #222 !important; } body.ali-homepage #topdiv-pc .logo-div { display: block !important; } body.ali-homepage #topdiv-mob .logo-div { min-height: 74px; } body.ali-homepage .ali-home { background: #f5f5f5; } /* The theme navigation is now shared across every page so dropdowns remain available. */ .ali-category-shell { display: none !important; } .ali-category-shell { position: sticky; top: 0; z-index: 990; width: 100%; border-bottom: 1px solid #e5e5e5; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.06); } .ali-category-rail { display: flex; align-items: stretch; gap: 0; width: min(1440px, calc(100% - 32px)); margin: 0 auto; padding: 0; overflow-x: auto; scrollbar-width: none; white-space: nowrap; } .ali-category-rail::-webkit-scrollbar { display: none; } .ali-category-rail a { position: relative; display: flex; flex: 1 0 auto; align-items: center; justify-content: center; min-height: 58px; padding: 0 17px; color: #222 !important; font-size: 14px; font-weight: 750; text-decoration: none !important; } .ali-category-rail a:hover, .ali-category-rail a.is-active { color: #ff4f12 !important; background: #fff7f2; } .ali-category-rail a.is-active::after, .ali-category-rail a:hover::after { content: ""; position: absolute; right: 14px; bottom: 0; left: 14px; height: 3px; border-radius: 3px 3px 0 0; background: #ff4f12; } .ali-market-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(360px, .7fr); gap: 30px; align-items: center; width: 100%; min-height: 395px; margin: 0 auto 24px; padding: 54px clamp(48px, 6vw, 120px); overflow: hidden; border-radius: 0; background: linear-gradient(90deg, #72b7f5 0%, #72b7f5 54%, rgba(114,183,245,.82) 67%, rgba(114,183,245,.12) 100%), url("https://redesign.shanghai-toy.com/wp-content/uploads/2025/04/%E6%9C%AA%E6%A0%87%E9%A2%98-1-768x768.jpg") 88% center / min(38vw, 520px) auto no-repeat, #72b7f5; color: #fff; box-shadow: none; } .ali-market-hero__eyebrow { margin: 0 0 10px; color: #fff8f2; font-size: 13px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; } .ali-market-hero h1 { max-width: 830px; margin: 0 0 14px !important; color: #fff !important; font-size: clamp(38px, 4.4vw, 64px) !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: -.045em; } .ali-market-hero__copy > p:not(.ali-market-hero__eyebrow) { max-width: 760px; margin: 0 0 24px; color: #fff9f5; font-size: 18px; } .ali-market-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; } .ali-market-hero__actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; font-size: 14px; font-weight: 850; text-decoration: none !important; } .ali-primary-action { color: #ff4f12 !important; background: #fff; box-shadow: 0 8px 20px rgba(129,30,0,.15); } .ali-secondary-action { color: #fff !important; border: 1px solid rgba(255,255,255,.7); background: rgba(255,255,255,.1); } .ali-market-hero__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .ali-market-hero__facts div { min-width: 0; padding: 22px 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 14px; background: rgba(255,255,255,.13); text-align: center; backdrop-filter: blur(8px); } .ali-market-hero__facts strong { display: block; margin-bottom: 5px; color: #fff; font-size: 24px; font-weight: 900; } .ali-market-hero__facts span { display: block; color: #fff6f0; font-size: 12px; font-weight: 700; line-height: 1.35; } .ali-home-content { width: min(1440px, calc(100% - 32px)); margin: 0 auto; padding: 2px 0 60px; } .ali-category-browser { display: grid; grid-template-columns: minmax(230px, .36fr) minmax(0, 1.64fr); gap: 26px; align-items: center; margin: 22px 0 14px; padding: 24px 26px; border: 1px solid #e7e7e7; border-radius: 16px; background: #fff; box-shadow: 0 5px 18px rgba(0,0,0,.04); scroll-margin-top: 72px; } .ali-category-browser__intro p { margin: 0 0 3px; color: #ff4f12; font-size: 11px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; } .ali-category-browser__intro h2 { margin: 0 0 5px !important; color: #171717 !important; font-size: 27px !important; font-weight: 900 !important; line-height: 1.1 !important; } .ali-category-browser__intro span { color: #777; font-size: 13px; line-height: 1.45; } .ali-category-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; } .ali-category-tabs button { width: 100%; min-height: 42px; padding: 0 17px; border: 1px solid #dedede !important; border-radius: 999px; color: #333 !important; background: #fff !important; font: inherit; font-size: 13px; font-weight: 750; cursor: pointer; transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease; } .ali-category-tabs button:hover { border-color: #ffb89d; color: #ff4f12; transform: translateY(-1px); } .ali-category-tabs button.is-active { border-color: #ff4f12 !important; color: #fff !important; background: #ff4f12 !important; box-shadow: 0 6px 15px rgba(255,79,18,.2); } .ali-category-section, .ali-video-section { margin: 22px 0; padding: 26px; border: 1px solid #ebebeb; border-radius: 16px; background: #fff; box-shadow: 0 5px 18px rgba(0,0,0,.045); scroll-margin-top: 72px; } .ali-category-section { display: none; } .ali-category-section.is-active { display: block; animation: ali-panel-in .24s ease; } @keyframes ali-panel-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } .ali-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; } .ali-section-heading p { margin: 0 0 2px; color: #999; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .ali-section-heading h2 { margin: 0 !important; color: #222 !important; font-size: 29px !important; font-weight: 900 !important; line-height: 1.1 !important; } .ali-section-heading > a { flex: 0 0 auto; color: #ff4f12 !important; font-size: 14px; font-weight: 850; text-decoration: none !important; } .ali-product-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; } .ali-product-card { min-width: 0; overflow: hidden; border: 1px solid #e9e9e9; border-radius: 12px; background: #fff; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; } .ali-product-card:hover { z-index: 2; border-color: #ffd0bd; box-shadow: 0 12px 28px rgba(0,0,0,.10); transform: translateY(-3px); } .ali-product-card__image { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #f3f3f3; } .ali-product-card__image img { width: 100% !important; height: 100% !important; border-radius: 0 !important; object-fit: cover !important; transition: transform .28s ease; } .ali-product-card:hover .ali-product-card__image img { transform: scale(1.035); } .ali-image-placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #aaa; font-size: 12px; } .ali-product-card__body { padding: 12px 12px 14px; } .ali-product-card h3 { min-height: 42px; margin: 0 0 7px !important; } .ali-product-card h3 a { display: -webkit-box; overflow: hidden; color: #222 !important; font-size: 14px; font-weight: 700; line-height: 1.45; text-decoration: none !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .ali-product-card__price { min-height: 24px; color: #ff4f12 !important; font-size: 16px; font-weight: 900; line-height: 1.3; } .ali-product-card__price del { color: #aaa; font-size: 11px; font-weight: 500; } .ali-product-card__price ins { color: #ff4f12; text-decoration: none; } .ali-more-products { display: flex; align-items: center; justify-content: center; width: min(420px, 100%); min-height: 48px; margin: 24px auto 0; border: 1px solid #ff4f12; border-radius: 999px; color: #ff4f12 !important; background: #fff8f4; font-size: 14px; font-weight: 850; text-decoration: none !important; } .ali-more-products:hover { color: #fff !important; background: #ff4f12; } .ali-video-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; } .ali-video-slot { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 10px; background: #111; } .ali-video-slot iframe { width: 100%; height: 100%; border: 0; } .ali-video-slot.is-empty { border: 1px dashed #d4d4d4; background: linear-gradient(135deg, rgba(0,0,0,.012) 25%, transparent 25%) 0 0 / 16px 16px, #fafafa; } body:not(.logged-in) .ali-video-slot.is-empty { display: none; } .ali-video-slot.is-empty a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #888 !important; font-size: 12px; font-weight: 750; text-decoration: none !important; } @media (max-width: 1100px) { .ali-market-hero { grid-template-columns: 1fr; } } @media (max-width: 767.98px) { body.ali-homepage #topdiv-mob { display: block !important; } .ali-category-rail { width: 100%; padding: 0 10px; } .ali-category-rail a { min-height: 50px; padding: 0 13px; font-size: 12px; } .ali-market-hero { display: block; width: 100%; min-height: 0; margin: 0 auto 12px; padding: 28px 20px; border-radius: 0; } .ali-market-hero h1 { font-size: 34px !important; } .ali-market-hero__copy > p:not(.ali-market-hero__eyebrow) { font-size: 15px; } .ali-market-hero__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .ali-market-hero__actions a { min-width: 0; padding: 0 8px; font-size: 12px; text-align: center; } .ali-market-hero__facts { margin-top: 22px; } .ali-market-hero__facts div { padding: 15px 6px; } .ali-market-hero__facts strong { font-size: 18px; } .ali-market-hero__facts span { font-size: 10px; } .ali-home-content { width: calc(100% - 20px); } .ali-category-browser { display: block; margin: 12px 0; padding: 18px 12px; border-radius: 12px; } .ali-category-browser__intro h2 { font-size: 22px !important; } .ali-category-browser__intro span { display: block; margin-bottom: 14px; } .ali-category-tabs { display: flex; flex-wrap: nowrap; gap: 7px; overflow-x: auto; padding-bottom: 3px; scrollbar-width: none; } .ali-category-tabs::-webkit-scrollbar { display: none; } .ali-category-tabs button { flex: 0 0 auto; width: auto; min-height: 39px; padding: 0 14px; font-size: 12px; } .ali-category-section, .ali-video-section { margin: 12px 0; padding: 16px 10px 18px; border-radius: 12px; } .ali-section-heading { align-items: center; margin-bottom: 14px; } .ali-section-heading h2 { font-size: 22px !important; } .ali-section-heading > a { font-size: 12px; } .ali-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; } .ali-product-card h3 { min-height: 38px; } .ali-product-card h3 a { font-size: 12px; } .ali-product-card__body { padding: 9px; } .ali-product-card__price { font-size: 14px; } .ali-more-products { min-height: 44px; margin-top: 18px; font-size: 12px; } .ali-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; } } /* Apple Store-inspired premium homepage direction — 2026-07-30 */ body.ali-homepage, body.ali-homepage .ali-home { background: #f5f5f7 !important; color: #1d1d1f !important; } body.ali-homepage .ali-market-hero { grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr); min-height: 520px; padding: 70px clamp(48px, 7vw, 140px); background: linear-gradient(90deg, #f5f5f7 0%, #f5f5f7 53%, rgba(245,245,247,.9) 64%, rgba(245,245,247,.08) 100%), url("https://redesign.shanghai-toy.com/wp-content/uploads/2025/04/%E6%9C%AA%E6%A0%87%E9%A2%98-1-768x768.jpg") 86% center / min(42vw, 610px) auto no-repeat, #f5f5f7; } body.ali-homepage .ali-market-hero__eyebrow { margin-bottom: 14px; color: #6e6e73; font-size: 14px; font-weight: 700; letter-spacing: .02em; text-transform: none; } body.ali-homepage .ali-market-hero h1 { max-width: 850px; margin-bottom: 20px !important; color: #1d1d1f !important; font-size: clamp(50px, 5.2vw, 78px) !important; font-weight: 750 !important; line-height: .98 !important; letter-spacing: -.055em; } body.ali-homepage .ali-market-hero__copy > p:not(.ali-market-hero__eyebrow) { max-width: 700px; margin-bottom: 30px; color: #6e6e73; font-size: 19px; line-height: 1.48; } body.ali-homepage .ali-market-hero__actions { gap: 14px; } body.ali-homepage .ali-market-hero__actions a { min-height: 46px; padding: 0 22px; border-radius: 999px; font-size: 14px; font-weight: 650; } body.ali-homepage .ali-primary-action { color: #fff !important; background: #0071e3; box-shadow: none; } body.ali-homepage .ali-primary-action:hover { background: #0077ed; } body.ali-homepage .ali-secondary-action { color: #0066cc !important; border: 1px solid #0071e3; background: transparent; } body.ali-homepage .ali-secondary-action:hover { color: #fff !important; background: #0071e3; } body.ali-homepage .ali-market-hero__facts { align-self: end; gap: 12px; margin-bottom: 4px; } body.ali-homepage .ali-market-hero__facts div { padding: 20px 12px; border: 0; border-radius: 18px; background: rgba(255,255,255,.82); box-shadow: 0 8px 30px rgba(0,0,0,.08); backdrop-filter: blur(18px); } body.ali-homepage .ali-market-hero__facts strong { color: #1d1d1f; font-size: 23px; } body.ali-homepage .ali-market-hero__facts span { color: #6e6e73; font-size: 11px; } body.ali-homepage .ali-home-content { padding-top: 26px; } body.ali-homepage .ali-category-browser { grid-template-columns: minmax(250px, .4fr) minmax(0, 1.6fr); margin: 24px 0 52px; padding: 30px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } body.ali-homepage .ali-category-browser__intro p { color: #6e6e73; font-size: 13px; letter-spacing: 0; text-transform: none; } body.ali-homepage .ali-category-browser__intro h2 { margin-bottom: 8px !important; color: #1d1d1f !important; font-size: 42px !important; font-weight: 720 !important; letter-spacing: -.035em; } body.ali-homepage .ali-category-browser__intro span { color: #6e6e73; font-size: 15px; } body.ali-homepage .ali-category-tabs { gap: 10px; } body.ali-homepage .ali-category-tabs button { min-height: 52px; border: 0 !important; border-radius: 14px; color: #1d1d1f !important; background: #fff !important; box-shadow: 0 3px 14px rgba(0,0,0,.055); font-size: 14px; font-weight: 650; } body.ali-homepage .ali-category-tabs .ali-video-category-link { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 17px; border: 0; border-radius: 14px; color: #fff !important; background: #ff0000; box-shadow: 0 5px 18px rgba(255,0,0,.16); font-size: 14px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none !important; } body.ali-homepage .ali-category-tabs .ali-video-category-link::before { content: "\25B6"; margin-right: 8px; font-size: 12px; } body.ali-homepage .ali-category-tabs .ali-video-category-link:hover { color: #fff !important; background: #d90000; transform: translateY(-1px); } body.ali-homepage .ali-category-tabs button:hover { color: #0066cc !important; box-shadow: 0 7px 22px rgba(0,0,0,.09); } body.ali-homepage .ali-category-tabs button.is-active { color: #fff !important; background: #0071e3 !important; box-shadow: 0 7px 22px rgba(0,113,227,.18); } body.ali-homepage .ali-category-section { margin: 0 0 62px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } body.ali-homepage .ali-section-heading { align-items: flex-end; margin-bottom: 24px; padding: 0 2px; } body.ali-homepage .ali-section-heading p { margin-bottom: 5px; color: #6e6e73; font-size: 14px; letter-spacing: 0; text-transform: none; } body.ali-homepage .ali-section-heading h2 { color: #1d1d1f !important; font-size: 40px !important; font-weight: 720 !important; letter-spacing: -.035em; } body.ali-homepage .ali-section-heading > a { color: #0066cc !important; font-size: 15px; font-weight: 550; } body.ali-homepage .ali-product-grid { display: flex; gap: 18px; margin: 0 calc((100vw - min(1440px, calc(100vw - 32px))) / -2); padding: 4px max(16px, calc((100vw - 1440px) / 2)) 26px; overflow-x: auto; overflow-y: visible; scroll-snap-type: none !important; scrollbar-width: none; } body.ali-homepage .ali-product-grid::-webkit-scrollbar { display: none; } body.ali-homepage .ali-product-card { flex: 0 0 clamp(260px, 20vw, 310px); border: 0; border-radius: 22px; box-shadow: 0 8px 30px rgba(0,0,0,.07); scroll-snap-align: none; } body.ali-homepage .ali-product-card:hover { box-shadow: 0 14px 38px rgba(0,0,0,.12); transform: translateY(-4px); } body.ali-homepage .ali-product-card__image { aspect-ratio: 1 / 1; border-radius: 22px 22px 0 0; } body.ali-homepage .ali-product-card__body { padding: 16px 17px 20px; } body.ali-homepage .ali-product-card h3 { min-height: 44px; } body.ali-homepage .ali-product-card h3 a { color: #1d1d1f !important; font-size: 15px; font-weight: 600; } body.ali-homepage .ali-product-card__price { color: #1d1d1f !important; font-size: 17px; font-weight: 650; } body.ali-homepage .ali-product-card__price ins { color: #1d1d1f; } body.ali-homepage .ali-more-products { width: auto; min-height: 0; margin: 22px 0 0; border: 0; border-radius: 0; color: #0066cc !important; background: transparent; justify-content: flex-start; font-size: 15px; font-weight: 550; } body.ali-homepage .ali-more-products:hover { color: #0077ed !important; background: transparent; } body.ali-homepage .ali-video-section { margin: 0 0 64px; padding: 34px; border: 0; border-radius: 24px; background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,.06); } body.ali-homepage .ali-video-slot { border-radius: 16px; } @media (max-width: 767.98px) { body.ali-homepage .ali-market-hero { min-height: 0; padding: 44px 20px 38px; background: #f5f5f7; } body.ali-homepage .ali-market-hero h1 { font-size: 44px !important; line-height: 1 !important; } body.ali-homepage .ali-market-hero__copy > p:not(.ali-market-hero__eyebrow) { font-size: 16px; } body.ali-homepage .ali-market-hero__actions { display: flex; } body.ali-homepage .ali-market-hero__actions a { width: auto !important; padding: 0 17px; } body.ali-homepage .ali-market-hero__facts { margin-top: 32px; } body.ali-homepage .ali-category-browser { margin: 8px 0 34px; padding: 28px 0 8px; } body.ali-homepage .ali-category-browser__intro h2 { font-size: 32px !important; } body.ali-homepage .ali-category-tabs button { min-height: 44px; border-radius: 13px; } body.ali-homepage .ali-section-heading h2 { font-size: 31px !important; } body.ali-homepage .ali-product-grid { gap: 13px; margin: 0 -10px; padding: 3px 10px 20px; } body.ali-homepage .ali-product-card { flex-basis: 78vw; border-radius: 20px; } body.ali-homepage .ali-product-card__image { border-radius: 20px 20px 0 0; } body.ali-homepage .ali-video-section { padding: 22px 14px; border-radius: 20px; } } body.ali-homepage .ali-trust-strip { display: grid; grid-template-columns: minmax(230px, .42fr) minmax(0, 1.58fr); gap: 34px; align-items: center; margin: 0 0 58px; padding: 36px 0; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; } body.ali-homepage .ali-trust-strip__heading p { margin: 0 0 5px; color: #6e6e73; font-size: 14px; font-weight: 600; } body.ali-homepage .ali-trust-strip__heading h2 { margin: 0 !important; color: #1d1d1f !important; font-size: 34px !important; font-weight: 720 !important; line-height: 1.05 !important; letter-spacing: -.035em; } body.ali-homepage .ali-trust-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } body.ali-homepage .ali-trust-grid article { min-width: 0; min-height: 176px; padding: 25px 21px; border-radius: 20px; border: 1px solid rgba(0,113,227,.08); background: rgba(255,255,255,.72); box-shadow: 0 6px 24px rgba(0,0,0,.035); } body.ali-homepage .ali-trust-grid i { display: block; margin-bottom: 22px; color: #0071e3; font-size: 25px; } body.ali-homepage .ali-trust-grid strong { display: block; margin-bottom: 7px; color: #1d1d1f; font-size: 16px; font-weight: 680; } body.ali-homepage .ali-trust-grid span { display: block; color: #6e6e73; font-size: 13px; line-height: 1.45; } body.ali-homepage .ali-video-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; } body.ali-homepage:not(.logged-in) .ali-video-slot.is-empty { display: block !important; border: 0; background: #f5f5f7; } body.ali-homepage:not(.logged-in) .ali-video-slot.is-empty::before { content: "▶"; position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: #d2d2d7; font-size: 16px; transform: translate(-50%, -62%); } body.ali-homepage:not(.logged-in) .ali-video-slot.is-empty::after { content: "Video coming soon"; position: absolute; top: calc(50% + 32px); left: 0; width: 100%; color: #86868b; font-size: 12px; font-weight: 600; text-align: center; } @media (max-width: 767.98px) { body.ali-homepage .ali-trust-strip { display: block; margin-bottom: 34px; padding: 28px 0; } body.ali-homepage .ali-trust-strip__heading { margin-bottom: 20px; } body.ali-homepage .ali-trust-strip__heading h2 { font-size: 29px !important; } body.ali-homepage .ali-trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } body.ali-homepage .ali-trust-grid article { min-height: 155px; padding: 18px 14px; } body.ali-homepage .ali-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } } body.ali-homepage .ali-certificates { margin: 0 0 58px; } body.ali-homepage .ali-certificates__heading { margin-bottom: 24px; } body.ali-homepage .ali-certificates__heading p { margin: 0 0 5px; color: #6e6e73; font-size: 14px; font-weight: 600; } body.ali-homepage .ali-certificates__heading h2 { margin: 0 0 8px !important; color: #1d1d1f !important; font-size: 40px !important; font-weight: 720 !important; letter-spacing: -.035em; } body.ali-homepage .ali-certificates__heading > span { color: #6e6e73; font-size: 14px; } body.ali-homepage .ali-certificate-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } body.ali-homepage .ali-certificate-card { display: grid; grid-template-columns: minmax(210px, .8fr) minmax(0, 1.2fr); min-height: 350px; overflow: hidden; border-radius: 24px; background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,.06); } body.ali-homepage .ali-certificate-card__preview { display: flex; align-items: center; justify-content: center; min-width: 0; padding: 18px; overflow: hidden; background: #ececf0; } body.ali-homepage .ali-certificate-card__preview img { width: 100% !important; height: 100% !important; max-height: 314px; border-radius: 5px !important; object-fit: contain !important; box-shadow: 0 5px 18px rgba(0,0,0,.12); transition: transform .25s ease; } body.ali-homepage .ali-certificate-card:hover .ali-certificate-card__preview img { transform: scale(1.025); } body.ali-homepage .ali-certificate-card__copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; padding: 30px; } body.ali-homepage .ali-certificate-card__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; min-height: 30px; margin-bottom: 24px; padding: 0 10px; border-radius: 999px; color: #fff; background: #0071e3; font-size: 13px; font-weight: 750; } body.ali-homepage .ali-certificate-card__copy p { margin: 0 0 4px; color: #6e6e73; font-size: 13px; font-weight: 600; } body.ali-homepage .ali-certificate-card__copy h3 { margin: 0 0 12px !important; color: #1d1d1f !important; font-size: 24px !important; font-weight: 700 !important; line-height: 1.12 !important; letter-spacing: -.025em; } body.ali-homepage .ali-certificate-card__copy small { margin-bottom: 28px; color: #6e6e73; font-size: 12px; line-height: 1.45; } body.ali-homepage .ali-certificate-card__copy > a { color: #0066cc !important; font-size: 14px; font-weight: 600; text-decoration: none !important; } @media (max-width: 767.98px) { body.ali-homepage .ali-certificates { margin-bottom: 34px; } body.ali-homepage .ali-certificates__heading h2 { font-size: 31px !important; } body.ali-homepage .ali-certificate-grid { grid-template-columns: 1fr; gap: 12px; } body.ali-homepage .ali-certificate-card { grid-template-columns: 1fr; } body.ali-homepage .ali-certificate-card__preview { height: 300px; } body.ali-homepage .ali-certificate-card__copy { padding: 24px; } body.ali-homepage .ali-certificate-card__badge { margin-bottom: 16px; } }