﻿/* ===== 全局重置与变量 =====*/ 
*{margin: 0;padding: 0;box-sizing: border-box;font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;}
:root{/* 基于老网站风格微调：暖灰底色 + 深蓝点缀 + 干净卡片*/--bg-light: #f9f8f6;--card-bg: #ffffff;--primary-dark: #1e2b3c;--txt-color: #666666;/* 深蓝灰，用于标题/导航*/--primary-medium: #2c3e50;--accent: #c06b3e;/* 陶土色，活泼不刺眼*/--main-color:#0d6b46;--accent-soft: #e2dcd5;--text-main: #2e2e2e;--text-muted: #6b6b6b;--border-light: #eae7e2;--shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.04);--shadow-hover: 0 12px 24px rgba(0, 0, 0, 0.08);--radius: 16px;--radius-sm: 10px;--transition: all 0.2s ease;}
body{background-color:#f0fdec;color: var(--text-main);line-height: 1.5;scroll-behavior: smooth;}
a:link{color: #333333;text-decoration: none;}
a:visited{color: #333333;text-decoration: none;}
a:hover {text-decoration: none;color: #666666;}
.w_container{max-width: 1400px;margin: 0 auto;}
.container{padding: 0 24px;}
/* 通用按钮 & 可编辑暗示 (contenteditable 样式)*/
[contenteditable="true"]{outline: 2px dashed var(--accent-soft);outline-offset: 4px;transition: outline 0.1s;border-radius: 4px;padding: 2px 6px;}
[contenteditable="true"]:hover{outline-color: var(--accent);background-color: rgba(192, 107, 62, 0.03);}
/* 所有可编辑区域鼠标样式*/
.editable{cursor: text;}
img{max-width:100%;}
/*scrollbar*/
::-webkit-scrollbar{width:8px;height: 6px;}
::-webkit-scrollbar-track-piece{margin-right:10px; background-color:rgba(0,0,0,0); -webkit-border-radius:0px;}
::-webkit-scrollbar-thumb:vertical{height:8px; background-color:var(--main-color); -webkit-border-radius:8px;}
::-webkit-scrollbar-thumb:horizontal{ width:6px; background-color:#222; -webkit-border-radius:8px;}

.overfloat-dot {overflow: hidden;text-overflow: ellipsis; white-space: nowrap; width: 100%;}
.overfloat-dot-2 { overflow: hidden;text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
/* ===== 顶端 Banner 区域 (可编辑) =====*/
.top-banner{/*background-image:url(../images/topbg.jpg);*/background-position: center;background-repeat: no-repeat;background-size: cover;background-color: var(--main-color); background-image: linear-gradient(126deg, var(--main-color) 20%, #dbfad28a 45%, #dbfad26e 65%, var(--main-color) 80%); color: white;padding: 28px 0 32px;border-radius: 0 0 var(--radius) var(--radius);box-shadow: var(--shadow-sm);margin-bottom: 8px;}
.banner-inner{display: flex;justify-content: space-between;align-items: center;gap: 24px;}
.banner-left{display:flex;align-items: center;flex: 1;}
.logobox .logo{width:120px;}
.logobox .logo a{display: block;}
.logobox .TppSlogan{margin-left:60px;flex: 1;}
.logo-placeholder{font-size: 2rem;font-weight: 700;letter-spacing: -0.5px;display: flex;align-items: center;gap: 10px;margin-bottom: 12px;}
.logo-placeholder i{color: var(--accent);font-size: 2.4rem;}
.slogan{font-size: 1.2rem;opacity: 0.9;margin-bottom: 16px;font-weight: 400;}
/* 联系方式 & 二维码区块*/
.banner-right{display:flex;}
.menu-btn{display:none;}
.search_btn{display:none;width:32px;}
.search_btn img{filter: brightness(0) invert(1);display:block; cursor: pointer;}
.search-dialog-box{position: fixed;display: flex;align-items: center; left: 0;top: 0; width: 100%;z-index: 1000; opacity: 0;height: 132px; visibility: hidden; transition: .6s;}
.search-dialog-box:before{ content: ""; position: absolute; top: 0; height: 0; background: #0d6b46db;border-radius:0 0 10px 10px; transition: .6s; left: 0; right: 0; z-index: 1;}
.search-dialog-box .bubbles-bg{opacity: 0;visibility: hidden;display: none;}
.search-dialog-box .search-bg{position: absolute;left: 0;top: 0;width: 100%;height: 0;margin: 0;background: rgba(0,0,0,.7);background-size: cover;background-repeat: no-repeat;/* z-index: 1;*/transform-origin: center center;transition: height .8s cubic-bezier(.77,0,.175,1);}
.search-dialog-box .wrap-inner{transform: translateY(100%);transition: .6s;}
.search-dialog{width: 80%;z-index: 2;margin:0 auto;}
.search-dialog .search-tit{font-size: 16px;line-height:48px;color: #fff;text-align: center;overflow: hidden;display: none;}
.search-dialog .search-inner{overflow: hidden;margin-top: 0;}
.search-dialog .search-input{width: 100%;margin: 0 auto;display:flex;justify-content: space-between; padding: 0 10px 0 15px;background-color: rgba(255,255,255,.3);box-sizing: border-box;transition: all .3s;border-radius:30px;}
.search-dialog .search-input input{outline: none; border: none; -webkit-appearance: none;}
.search-dialog .search-input input[type=text]{height: 48px;width: calc(100% - 50px);background-color: transparent;font-size:16px;line-height:1.6;color: #fff;transition: all .3s;border:none;}
.search-dialog .search-input input[type=text]::-webkit-input-placeholder{color: rgba(255,255,255,0.5);}
.search-dialog .search-input input[type=text]:-moz-placeholder{color: rgba(255,255,255,0.5);}
.search-dialog .search-input input[type=text]::-moz-placeholder{color: rgba(255,255,255,0.5);}
.search-dialog .search-input input[type=text]:-ms-input-placeholder{color: rgba(255,255,255,0.5);}
.search-dialog .search-input input[type=submit],.search-dialog .search-input .clear-btn{height:48px;width:48px;border:none;}
.search-dialog .search-input input[type=submit]{background-color: transparent;background-repeat: no-repeat;background-position: center;background-size:25px;background-image: url('../images/search-btn.svg'); cursor:pointer;filter: brightness(0) invert(1);}
.search-dialog .search-input .clear-btn{background-color: rgba(0,0,0,.2);background-repeat: no-repeat;background-position: center;background-image: url('../images/close-btn.svg');background-size: 25px;border-radius: 100%;margin-right: 1rem;display: none;}
.search-dialog .search-input.on{background-color: #fff;}
.search-dialog .search-input.on input[type=submit]{background-image: url('../images/search-btn2.svg')}
.search-dialog .hot-search{font-size: 0;width: 19.5rem;margin: .6rem auto 0;box-sizing: border-box;padding: 0 .6rem;overflow: hidden;}
.search-dialog .hot-search .hot-tit, .search-dialog .hot-search .hot-link{display: inline-block;zoom:1;vertical-align: top;}
.search-dialog .hot-search .hot-tit{font-size: .375rem;line-height: .5rem;color: #fff;font-weight: bold;padding-left: .6rem;background-repeat: no-repeat;background-position: left center;background-size: .5rem;background-image: url(../images/hot-icon.png);}
.search-dialog .hot-link{margin-left: 1rem;}
.search-dialog .hot-link a{display: inline-block;zoom:1;font-size: .375rem;line-height: .5rem;margin-right: .75rem;color: #fff;padding-bottom: 5px;position: relative;}
.search-dialog .hot-link a:before{content: "";position: absolute;left: 0%;bottom: 0;width: 100%;height: 2px;background-color: #fff;transform: scaleX(0);transform-origin: left center;transition: transform .3s;}

.search-dialog-box.on{opacity: 1;visibility: visible;}
.search-dialog-box.on .search-bg{height: 100vh;}
.search-dialog-box.on .bubbles-bg{opacity: 1;visibility: visible;}
.search-dialog-box.on .wrap-inner{transform: translateY(0)}
.search-dialog-box.on:before {height: 100%;}

.pub-close{position: absolute;width:30px;height:30px;z-index: 10;right:20px;top:20px;background-color: rgba(255,255,255,.3);border-radius: 100%;}
.pub-close .bg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;transform: scale(0);border-radius: 100%;transition: transform .3s;}
.pub-close i{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-position: center;background-size: 12px;background-repeat: no-repeat;background-image: url(../images/close-btn.svg);transition: .6s}
.pub-close i:hover{transform: rotate(180deg)}

.contact-info{display: flex;flex-wrap: wrap;gap:10px;align-items: flex-start;flex-direction: column;justify-content: center;}
.contact-item{display: flex;align-items: center;gap: 8px;font-size: 0.95rem;/*background: rgba(255, 255, 255, 0.08);padding: 8px 16px;*/border-radius: 40px;backdrop-filter: blur(4px);}
.contact-item i{color: #ffffff;width: 20px;text-align: center;}
.qr-group{display: flex;gap: 16px;margin-right:30px;}
.qr-item{text-align: center;/*background: rgba(255, 255, 255, 0.1);padding: 8px 10px;*/border-radius: 12px;font-size: 0.75rem;color:#ffffff;}
.qr-item i{font-size: 2.2rem;display: block;margin-bottom: 4px;color: #fff;}
.qr-item .imgbox{width:90px;}
/* ===== 导航菜单 (可编辑，可增删) =====*/
.nav-bar{background: var(--card-bg);border-radius: var(--radius);padding: 12px 24px;margin: 24px 0 32px;box-shadow: var(--shadow-sm);display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 16px;}
.nav-links{display: flex;flex-wrap: wrap;gap:15px;list-style: none;}
.nav-links li{font-weight: 500;border-radius: 40px;background: #dbfad2;transition: var(--transition);cursor: pointer;font-size: 0.95rem;}
.nav-links li a{color: var(--primary-dark);padding: 8px 18px;display: block;}
.nav-links li:hover,.nav-links li.on{background: var(--main-color);}
.nav-links li:hover a,.nav-links li.on a{color: white;}
.m_header{display:none;align-items: center;justify-content: space-between;}
.m_header .m_logo{width:120px;}
.banner_swiper{position: relative; overflow: hidden;margin-bottom:24px;}
.banner_swiper .imgbox{position: relative; overflow: hidden;border-radius:var(--radius) ;}
.banner_swiper .pcbanner{display: block;}
.banner_swiper .mbanner{display: none;}
.banner_swiper img{display: block;}
.banner_swiper .banner_btn .swiper-pagination{position: absolute;width:100%;bottom:30px;}
.banner_swiper .swiper-pagination span{border-radius:10px;width:28px;height:4px;}
.banner_swiper .swiper-pagination span.swiper-pagination-bullet-active{width:36px;background-color:var(--main-color) ;}
.banner_swiper .swiper-button-next,.banner_swiper .swiper-button-prev{color:var(--main-color);}
/* 编辑提示小标签*/
.edit-badge{background: var(--accent-soft);color: var(--primary-dark);font-size: 0.7rem;padding: 4px 10px;border-radius: 30px;letter-spacing: 0.3px;display: inline-flex;align-items: center;gap: 6px;margin-left: 8px;font-weight: 500;}
/* ===== 主内容网格 =====*/
.main-grid{display: grid;grid-template-columns: 280px 1fr;gap: 32px;margin-bottom: 48px;position: relative;}
#bnt_sub_nav{display:none;}
.search-inner{margin-bottom:0px;}
.search-inner .search-input{display: flex;border: 1px solid #d0c8c8;border-radius: 40px;}
.search-inner input{border:0;background-color:transparent;outline: none; border: none; -webkit-appearance: none;border-radius: 0;}
.search-inner input[type="text"]{flex:1;margin-right:10px;padding-left:10px;height:38px;font-size:15px;}
.search-inner input[type="submit"]{width:38px;height:38px;cursor: pointer;background-image:url(../images/search-btn.svg);background-size:60%;background-repeat: no-repeat;background-position: center;}
.search-inner:hover input[type="submit"]{width:38px;height:38px;cursor: pointer;background-image:url(../images/search-btn2.svg);}
/* 左侧产品分类*/
.sidebar{background: var(--card-bg);border-radius: var(--radius);padding: 24px 20px;box-shadow: var(--shadow-sm);height: fit-content;position: sticky; top: 10px;}
.sidebar h3{font-size: 1.2rem;color: var(--primary-dark);display: flex;justify-content: space-between;align-items: center;}
.category-list{list-style: none;margin-top: 20px;}
.category-list li{padding: 12px 16px;border-radius: var(--radius-sm);margin-bottom: 6px;background: #f6f4f1;transition: var(--transition);font-size: 0.95rem;display: flex;justify-content: space-between;align-items: center;cursor: default;border-left: 3px solid transparent;}
.category-list li a{display:flex;justify-content: space-between;align-items: center;width:100%;}
.category-list li:hover,.category-list li.on{background: #dbfad2;border-left-color: var(--main-color);}
.category-list li i{opacity: 0.5;font-size: 0.8rem;}
.category-list .third_nav{margin:15px 10px 12px;}
.category-list .third_nav a{display: block;font-size:15px;line-height:1.8;position: relative;padding-left:12px;}
.category-list .third_nav a:before{content:'';display: block; width:4px;height:4px;background-color:#666666 ;border-radius:50%; margin-top: 11px; position: absolute; left: 0;}
.category-list .third_nav a.on{color:var(--main-color);}
.category-list .third_nav a.on:before{background-color:var(--main-color);}
/* 右侧重点类目 + 新品*/
.content-area{display: flex;flex-direction: column;gap: 32px;}
.nycontent-area{display: flex;flex-direction: column;gap:20px;}
/* 重点类目图标卡片*/
.featured-cats{background: var(--card-bg);border-radius: var(--radius);padding: 24px;box-shadow: var(--shadow-sm);}
.featured-cats h3{font-size: 1.2rem;margin-bottom: 20px;color: var(--primary-dark);display: flex;justify-content: space-between;align-items: center;}
.cat-icon-grid{display: grid;grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));gap:30px 15px;}
.cat-icon-item{text-align: center;/*padding: 16px 8px;background: #f9f8f6;*/border-radius: var(--radius-sm);transition: var(--transition);cursor: default;}
.cat-icon-item a{display: flex;flex-direction: column;align-items: center;}
.cat-icon-item a .imgbox{position: relative;padding-bottom:70%; overflow: hidden;width:100%;}
.cat-icon-item a .imgbox img{position: absolute;width:100%;height:100%; object-fit:contain;left:0;top:0;}
.cat-icon-item:hover{background: white;/*box-shadow: var(--shadow-hover);*/transform: translateY(-3px);}
.cat-icon-item i{font-size: 2.2rem;color: var(--accent);margin-bottom: 12px;display: block;}
.cat-icon-item h4{font-size:1rem;margin-top:15px;line-height:1.4;color: var(--primary-dark);width:100%;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word;}
.cat-icon-item span{font-size: 0.8rem;font-weight: 500;color: var(--txt-color);line-height:1.4;margin-top:8px;display: block;padding:4px 12px;border-radius: 30px;border: 1px solid #d4d4d4;}
.cat-icon-item:hover span{background-color:var(--main-color) ;border-color:var(--main-color) ;color:var(--card-bg);}
.breadcrumb{background-color: #ffffff; padding: 15px 24px; border-radius:var(--radius);box-shadow: var(--shadow-sm);font-size:0.9rem;}
.breadcrumb em{margin-right:10px;}
.breadcrumb i{font-style: normal;padding:0 8px;}
.breadcrumb a:hover{color:var(--main-color);}
/* 新品展示 New Arrival*/
.new-arrival{background: var(--card-bg);border-radius: var(--radius);padding: 24px;box-shadow: var(--shadow-sm);min-height:240px;}
.search_not{text-align: center;font-size:16px;margin:30px 0;}
.search_not h4{font-size:18px;}
.search_not h4 span{color:var(--main-color);}
.new-arrival h3{font-size: 1.2rem;margin-bottom:20px;color: var(--primary-dark);display: flex;justify-content: space-between;align-items: center;}
.new-arrival h3 span{display:flex;align-items: center;}
.new-arrival h3 span i{margin-right:8px;}
.new-arrival .sub-head{color: var(--text-muted);font-size: 0.9rem;margin-bottom: 20px;}
.product-showcase{display: grid;grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));gap: 18px;}
.product-card{background: #f9f8f6;border-radius: var(--radius-sm);padding: 16px 12px;text-align: center;transition: var(--transition);cursor: default;}
.product-card:hover{box-shadow: var(--shadow-hover);background: white;}
.product-img-placeholder{width: 100%;/*aspect-ratio: 1 / 1;*/border-radius: 8px;margin-bottom: 12px;display: flex;align-items: center;justify-content: center;font-size: 2rem;padding-bottom:100%;position: relative; overflow: hidden;}
.product-img-placeholder img{position: absolute;width:100%;height:100%; object-fit:contain;left:0;top:0;}
.product-card p{font-size: 0.9rem;font-weight: 500;color: var(--primary-dark);word-wrap: break-word;width:100%;}
.product-card .enquiry{margin-top: 10px;text-align: center;margin-bottom: 10px;}
.product-card .enquiry a{padding:5px 15px;border-radius:20px;background-color:var(--main-color);color:#ffffff;font-size:14px;}
.product-show{}
.product-show .ny_title{text-align: center;}
.product-show .ny_title .tit{font-size: 1.5rem;}
.product-show .view_con{padding:20px 0 0;min-height:300px;}
.product-show .view_con p{margin-bottom:1em;}
.news-show .ny_title{text-align: center;}
.news-show .ny_title .tit{font-size: 1.5rem;}
.news-show .ny_subtitle{margin-top:10px;padding-bottom:15px;border-bottom:1px solid #efefef; font-size:0.9rem;color:#666666;text-align: center;}
.news-show .ny_subtitle span{padding:0 10px;}
.news-show .view_con{padding:20px 0 0;min-height:300px;}
.newsBottom{margin-top:20px;padding-top:15px;border-top:1px solid #efefef;}
.newsBottom .prev{margin-bottom:10px;}
.newsBottom a{color:#666666;line-height:1.4;font-size:0.9rem;}
.newsBottom a:hover{color:var(--main-color);}


.list_download{}
.list_download ul{}
.list_download li{ list-style: none; margin-bottom:0;padding:20px 0;border-bottom:1px solid #efefef;}
.list_download li:first-child{padding-top:0;}
.list_download li a{display:flex;}
.list_download li .imgbox{margin-right:20px;}
.list_download li .txtbox{display:flex;flex:1;align-items: center; justify-content: space-between;}
.list_download li .titbox{width:calc(100% - 120px);}
.list_download li .titbox .tit{line-height:1.4;margin-bottom:10px;font-weight:400;}
.list_download li .titbox .subtit{font-size:0.9rem;color:#999999;}
.list_download li .btn{align-items: center;display: flex;} 
.list_download li .btn i{font-style: normal;margin-right:10px;}
.list_download li .btn img{display: block;}
.list_download li .subtit i{padding:0 10px;font-style:normal;}
.list_download li:hover .titbox .tit{color:var(--main-color);}

.list_img{display: grid;grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 18px;}
.list_img .item-img{flex: 0 0 200px;display: flex;align-items: center;justify-content: center;font-size: 0.9rem;color: #6b5e52;font-weight: 500;}
.list_img .item-img a{display: block;width:100%;}
.list_img .item-img .imgbox{display: block;position: relative;padding-bottom:70%; overflow: hidden;background: #e2dcd5;border-radius: var(--radius-sm);box-shadow: var(--shadow-sm);background-image: linear-gradient(145deg, #d9d2c9 0%, #ece7e0 100%);}
.list_img .item-img .imgbox img{display: block;position: absolute; width:100%;height:100%;object-fit: cover; transition: all 0.5s; }
.list_img .item-img i{font-size: 2.5rem;margin-bottom: 8px;display: block;color: #8a7d6f;}
.list_img .item-img span{display: block;font-size: 0.85rem;margin-top:12px;text-align: center;width:100%;word-wrap: break-word;}
/*.list_img .item-img:hover{ transform: translateY(-3px);}*/
.list_img .item-img:hover .imgbox img{transform: scale(1.05);}


/* ===== 动态图片轮播（左右循环播放） =====*/
.carousel-section{margin: 48px 0;overflow: hidden;background: var(--card-bg);border-radius: var(--radius);padding: 20px 0 28px;box-shadow: var(--shadow-sm);}
.carousel-section h3{text-align: center;margin-bottom: 20px;color: var(--primary-dark);}
.link_swiper .swiper-wrapper {transition-timing-function: linear !important;}
.carousel-track{/*display: flex;gap: 20px;animation: scrollLoop 3s linear infinite;width: max-content;*/}
.carousel-item{flex: 0 0 200px;display: flex;align-items: center;justify-content: center;font-size: 0.9rem;color: #6b5e52;font-weight: 500;}
.carousel-item a{display: block;width:100%;}
.carousel-item .imgbox{display: block;position: relative;padding-bottom:70%; overflow: hidden;background: #e2dcd5;border-radius: var(--radius-sm);box-shadow: var(--shadow-sm);background-image: linear-gradient(145deg, #d9d2c9 0%, #ece7e0 100%);}
.carousel-item .imgbox img{display: block;position: absolute; width:100%;height:100%;object-fit: cover; transition: all 0.5s;}
.carousel-item i{font-size: 2.5rem;margin-bottom: 8px;display: block;color: #8a7d6f;}
.carousel-item span{display: block;font-size: 0.85rem;margin-top:12px;text-align: center;width:100%;word-wrap: break-word;}
.carousel-item .imgbox:hover img{transform: scale(1.05);}

/***/
.news_list{}
.news_list li{list-style: none;margin-bottom:20px;background-color: #FAFAFA;border-radius:10px;}
.news_list li a{display:flex;padding:10px;}
.news_list li .imgbox{width:280px;}
.news_list li .imgbox .img{position: relative;padding-bottom:70%;overflow: hidden;}
.news_list li .imgbox img{position: absolute;width:100%;height:100%;object-fit: cover;top:0;left:0;transition: all 0.5s;}
.news_list li .textbox{flex:1;padding:20px 20px 20px 30px;}
.news_list li .textbox .tit{margin-bottom:10px;}
.news_list li .textbox h3{font-size: 1.4rem;margin-bottom:0;line-height:1.4;}
.news_list li .textbox .info{font-size:0.9rem;color:#666666;}
.news_list li .textbox .phonetime{font-size:0.8rem;color:#666666;margin-bottom:10px;}
.news_list li .textbox .phonetime i{font-size:0.95rem;color:#555555;margin-right:10px;}
.news_list li a:hover .imgbox img{transform: scale(1.05);}
.news_list li a:hover .textbox h3{color:var(--main-color);}
.news_list li:hover{box-shadow: var(--shadow-hover);}

.message_box form{display: flex;flex-wrap: wrap;gap: 12px;justify-content: space-between;max-width: 600px; margin:auto ;}
.message_box .message_txt{font-size:15px;margin:20px 0;color:#666666;}
.message_box .item,.message_box .item-textarea,.message_box .item-code{background: rgba(255, 255, 255, 1);border:1px solid rgb(215 215 215);border-radius:5px;display: flex;position: relative;}
.message_box .item-textarea,.message_box .item-code{width:100%;}
.message_box .item{width:48%;}
.message_box .item span,.message_box .item-code span{position: absolute;color:#ff0000;left:8px;top:5px;}
.message_box input,.message_box textarea{padding: 10px 15px 10px 20px;color:#333333;font-size: 0.9rem;flex: 1; outline: none;transition: var(--transition);width: 100%;background-color: transparent;border:0;}
.message_box input::-webkit-input-placeholder,.message_box textarea::-webkit-input-placeholder{color:#999999;}
.message_box input:-moz-placeholder,.message_box textarea:-moz-placeholder{color:#999999;}
.message_box input::-moz-placeholder,.message_box textarea::-moz-placeholder{color:#999999;}
.message_box input::-ms-input-placeholder,.message_box textarea::-ms-input-placeholder{color:#999999;}
.message_box textarea{border-radius:5px;resize: vertical;min-height: 80px;}
.message_box input:focus,.message_box textarea:focus{border-color: rgb(215 215 215);background: rgba(255, 255, 255, 1);color:#999999;}
.message_box .fc-code,.message_box .fc-code img{height:40px;}
.message_box button{background: #378c6b;color: white;border: none;padding: 14px 28px;border-radius: 40px;width:100%;font-weight: 600;cursor: pointer;transition: var(--transition);font-size: 0.95rem;display: inline-flex;align-items: center;justify-content: center;gap: 8px;}
.message_box button:hover{background:var(--main-color);transform: scale(1.02);}
.message_box .message-tips-success{background: rgb(255 255 255);color: #8e8b8b;}
.message_box .item-file{position: relative;  width: 100%;}
.message_box .item-file .form-control{width: 100%; display: flex;}
.message_box .item-file .form-control input:focus{border-color: rgb(215 215 215) !important;background: rgba(255, 255, 255, 1)!important;color:#999999!important;}
.message_box .item-file .form-control input{border: 1px solid rgb(215 215 215); border-radius: 5px; flex: 1;  margin-right: 10px;}
.message_box .item-file .form-control input:hover{border: 1px solid rgb(215 215 215)!important;}
.message_box .item-file .file_btnbox button{background-color:transparent;color:#378c6b;border:#378c6b solid 1px;}
.message_box .item-file .file_btnbox button:hover{background: #378c6b;color: white;}
.message_box .form-text{font-size:0.8rem;color:#999999;}
.not-list{margin:30px 0;text-align: center;font-size:14px;color: #666666;}





@keyframes scrollLoop{0%{transform: translateX(0);}
100%{transform: translateX(-50%);}}
/* 合作品牌*/
.brands-section{margin: 48px 0;}
.brands-section h3{margin-bottom: 24px;color: var(--primary-dark);text-align: center;}
.brand-grid{display: grid;grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));gap: 24px;align-items: center;}
.brand-item{background: var(--card-bg);padding:0;border-radius: var(--radius-sm);text-align: center;box-shadow: var(--shadow-sm);font-weight: 600;color: var(--primary-medium);letter-spacing: 0.5px;font-size: 1.1rem;transition: var(--transition);border:0;}
.brand-item a{display: block;}
.brand-item .imgbox{border-radius:10px; overflow: hidden;position: relative;}
.brand-item a img{display: block;}
.brand-item:hover{transform: scale(1.02);box-shadow: var(--shadow-hover);}
/* ===== 留言板 & 联系方式 & 自媒体 =====*/
.footer-area{background: var(--main-color);color: #ffffff;padding: 48px 0 32px;border-radius: var(--radius) var(--radius) 0 0;margin-top: 64px;}
.footer-grid{display: grid;grid-template-columns: 1fr 1.2fr;gap: 40px;margin-top:30px;}
.footer-grid h4{font-size: 1.1rem;margin-bottom: 20px;color: white;font-weight: 600;}
.footer-grid h4 i{color: white;}
.contact-details p{display: flex;align-items: center;gap: 10px;margin-bottom: 12px;font-size: 0.95rem;opacity: 0.9;}
.contact-details i{width: 24px;color: #40a57d;}
.contact-details{margin-bottom:20px;}
.social-icons{display: flex;gap: 16px;margin-top: 16px;}
.social-icons a{color: white;background: rgba(255, 255, 255, 0.1);width: 44px;height: 44px;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 1.3rem;transition: var(--transition);text-decoration: none;}
.social-icons a img{max-width:60%;filter: brightness(0) invert(1);}
.social-icons a:hover{background:#ffffff;color: var(--main-color);transform: translateY(-3px);}
.social-icons a:hover img{filter: brightness(1) invert(0);}
.copyright{text-align: center; margin-top: 24px; font-size: 0.8rem; opacity: 0.5;}
.copyright a{color: #dfdfdf;}
.copyright a:hover{color: #f5f5f5;}
/* 留言板*/
.message-board h4{margin-bottom: 16px;}
.message-board form{display: flex;flex-wrap: wrap;gap: 12px;justify-content: space-between;}
.message-board .item,.message-board .item-textarea,.message-board .item-code{background: rgba(255, 255, 255, 0.08);border: 1px solid rgba(255, 255, 255, 0.2);border-radius:5px;display: flex;position: relative;}
.message-board .item-textarea,.message-board .item-code{width:100%;}
.message-board .item{width:48%;}
.message-board .item span,.message-board .item-code span{position: absolute;color:#ffffff;left:8px;top:5px;}
.message-board input, .message-board textarea{padding: 10px 15px 10px 20px;color: white;font-size: 0.9rem;outline: none;transition: var(--transition);width: 100%;background-color: transparent;border:0;}
.message-board .item-file .form-control input{background: rgba(255, 255, 255, 0.08);border: 1px solid rgba(255, 255, 255, 0.2);border-radius:5px; flex: 1;  margin-right: 10px;color: white;outline: none;}
.message-board input::-webkit-input-placeholder,.message-board textarea::-webkit-input-placeholder{color: rgba(255,255,255,0.5);}
.message-board input:-moz-placeholder,.message-board textarea:-moz-placeholder{color: rgba(255,255,255,0.5);}
.message-board input::-moz-placeholder,.message-board textarea::-moz-placeholder{color: rgba(255,255,255,0.5);}
.message-board input::-ms-input-placeholder,.message-board textarea::-ms-input-placeholder{color: rgba(255,255,255,0.5);}
.message-board textarea{border-radius:5px;resize: vertical;min-height: 80px;}
.message-board input:focus, .message-board textarea:focus{border-color:rgba(255 255 255 /0.7) !important;background: rgba(255, 255, 255, 0.15) !important;color:rgba(255 255 255 /0.4) !important;}
.message-board .item-file .form-control input:hover{border: 1px solid rgba(255, 255, 255, 0.2) !important;}
.message-board .item-file .form-control input:focus{border-color:rgba(255 255 255 /0.1) !important;background: rgba(255, 255, 255, 0.15) !important;color:rgba(255 255 255 /0.4) !important;}
.message-board .item-code .fc-code,.message-board .item-code .fc-code img{height:41px;}
.message-board button{background: #378c6b;color: white;border: none;padding: 14px 28px;border-radius: 40px;width:100%;font-weight: 600;cursor: pointer;transition: var(--transition);font-size: 0.95rem;display: inline-flex;align-items: center;justify-content: center;gap: 8px;}
.message-board button:hover{background:rgba(255 255 255 /0.5);transform: scale(1.02);}
.message-board .item-file{position: relative;  width: 100%;}
.message-board .item-file .form-control{width: 100%; display: flex;}
.message-board .item-file .file_btnbox button{background-color:transparent;color:#ffffffe6;border:#ffffff82 solid 1px;}
.message-board .item-file .file_btnbox button:hover{background: #378c6b;color: white;}
.message-board .form-text{font-size:0.8rem;color:#fffbfb6e;}


/* 留言提交结果提示（页脚表单 / 内页表单共用）*/
.message-tips{display:none;width:100%;margin-top:6px;padding:10px 14px;border-radius:5px;font-size:0.9rem;line-height:1.5;}
.message-tips-success{background:rgba(40,167,69,0.25);color:#ffffff;}
.message-tips-error{background:rgba(220,53,69,0.30);color:#ffffff;}
/* 页脚不显示留言板时改为单列布局 */
.footer-grid-single{grid-template-columns:1fr;}
/* 回到顶部按钮*/
.back-to-top{display: flex;justify-content: center;align-items: center;margin-top: -70px;}
.back-to-top a{background: var(--main-color);color: white;border: 5px solid #ffffff54;width: 56px;height: 56px;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 1.6rem;text-decoration: none;transition: var(--transition);box-shadow: var(--shadow-sm);}
.back-to-top a:hover{background: white;color: var(--primary-dark);transform: translateY(-4px);}
/* 小工具：修改提示*/
.edit-hint{font-size: 0.75rem;color: var(--text-muted);display: block;margin-top: 6px;font-style: italic;}
.whatsapp{position: fixed;bottom:48%;right:60px;display: block;z-index:8;}
.whatsapp svg{pointer-events:none; display:block; height:50px; width:50px;}

/*翻页*/
.page {margin:30px auto 10px; }
.page .box {display: inherit;width: 100%;text-align: center; }
.page a {height:34px;line-height:34px;display: inline-block;margin: 0 5px;padding: 0 8px;color: #646466;font-size: 18px;box-sizing: border-box;-moz-transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;     transition: all .3s ease-in-out; }
.page a font {font-size: 15px;font-family: SimSun;color: #000;  display: block;border-radius: 50%;width: 32px;height: 32px; }
.page .on {border-radius:5px;  background:var(--main-color);  color: #fff;padding: 0 12px; }

.ph_pages{display:none;margin:30px 0;}
.am-pagination{padding-left:0;margin:0 ;list-style:none;color:#999;text-align:left}
.am-pagination:after,.am-pagination:before{content:" ";display:table}
.am-pagination:after{clear:both}
.am-pagination>li{display:inline-block}
.am-pagination>li>a,.am-pagination>li>span{position:relative;display:block;padding:.5em 1em;text-decoration:none;line-height:1.2;background-color:#fff;border:1px solid #ddd;border-radius:0;margin-bottom:5px;margin-right:5px}
.am-pagination>li:last-child>a,.am-pagination>li:last-child>span{margin-right:0}
.am-pagination>li>a:focus,.am-pagination>li>a:hover,.am-pagination>li>span:focus,.am-pagination>li>span:hover{background-color:#eee}
.am-pagination>.am-active>a,.am-pagination>.am-active>a:focus,.am-pagination>.am-active>a:hover,.am-pagination>.am-active>span,.am-pagination>.am-active>span:focus,.am-pagination>.am-active>span:hover{z-index:2;color:#fff;background-color:#0e90d2;border-color:#0e90d2;cursor:default}
.am-pagination>.am-disabled>a,.am-pagination>.am-disabled>a:focus,.am-pagination>.am-disabled>a:hover,.am-pagination>.am-disabled>span,.am-pagination>.am-disabled>span:focus,.am-pagination>.am-disabled>span:hover{color:#999;background-color:#fff;border-color:#ddd;cursor:not-allowed;pointer-events:none}
.am-pagination .am-pagination-prev{float:left}
.am-pagination .am-pagination-prev a{border-radius:0}
.am-pagination .am-pagination-next{float:right}
.am-pagination .am-pagination-next a{border-radius:0}
.am-pagination-centered{text-align:center}
.am-pagination-right{text-align:right}
.am-pagination{position:relative}
.am-pagination-default{margin-left:10px;margin-right:10px;font-size:1.6rem}
.am-pagination-default .am-pagination-next,.am-pagination-default .am-pagination-prev{float:none}
.am-pagination-select{margin-left:10px;margin-right:10px;font-size:14px;}
.am-pagination-select>li>a{line-height:36px;background-color:#eee;padding:0 15px;border:0;color:#555}
.am-pagination-select .am-pagination-select{position:absolute;top:0;left:50%;margin-left:-35px;width:70px;height:36px;text-align:center;border-radius:0}
.am-pagination-select .am-pagination-select select{display:block;border:0;line-height:36px;width:70px;height:36px;border-radius:0;color:#555;background-color:#eee;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-left:18px}

/* 响应式*/
@media (max-width: 1400px){
    .w_container{margin-left:5px;margin-right:5px;}
    .qr-item .imgbox{width: 80px;}
    .news_list li .imgbox{max-width: 280px;width: 25%;}

}
@media (max-width: 1200px){
.logobox .logo{width:105px;}
.m_header .m_logo{width:105px;}
.logobox .TppSlogan { margin-left: 30px;}
.logobox .TppSlogan *{font-size:16px !important;}
.nav-bar{padding:12px 18px;}
.nav-links{gap:12px;}
.nav-links li{font-size:0.9rem;}
.nav-links li a{padding: 6px 14px;}


}
@media (max-width: 900px){
:root{--radius: 10px;--radius-sm: 6px;}
.top-banner{margin-bottom:20px;}
.container {padding: 0 16px;}
.logobox .logo{width:90px;}
.m_header .m_logo{width:90px;}
.search-inner{display:none;}
.banner-right{display:none;}
.search_btn{display:block;}
.menu-btn{display: block;width: 30px;height: 24px;border-top: 3px solid #ffffff;cursor: pointer;transition: all .3s ease;z-index: 12;position: relative;}
.menu-btn:before,.menu-btn:after{content: '';height: 3px;background: #ffffff;position: absolute;right: 0;transition: all .3s ease;}
.menu-btn:before{bottom: 10px;width: 20px;}
.menu-btn:after{bottom: 0;width: 30px;}
.menu-btn.cli{border-top: transparent;}
.menu-btn.cli:before{width:30px;transform: translate(2px, 2px) rotate(-45deg);}
.menu-btn.cli:after{width:30px;transform: translate(2px,-8px) rotate(-135deg);}
.m_header{display:flex;}
.m_header .menu-btn{border-top-color: var(--main-color);}
.m_header .menu-btn:before,.m_header .menu-btn:after{background: var(--main-color);}
.nav-bar{display:none;position: fixed; z-index:99; width: 100%; left: 0; top: 0; margin: 0; border-radius: 0; height: 100%;padding:20px 16px;}
.navbox{margin-top:20px;}
.nav-links{list-style: none;flex-direction: column; gap:0px;}
.nav-links li{background-color:transparent;position: relative;border-bottom: 1px solid #ebebeb;padding:0;border-radius:0;}
.nav-links li a{display: block;padding:14px 10px;}
.nav-links li:hover, .nav-links li.on{background: transparent;}
.nav-links li:hover a, .nav-links li.on a{color: var(--primary-dark);}
.banner_swiper .pcbanner{display: none;}
.banner_swiper .mbanner{display: block;}
.sidebar{position:relative;top:0px;padding:16px 14px;}
.main-grid{grid-template-columns: 1fr; gap: 20px;margin-bottom: 30px;}
.category-list{display:none;}
#bnt_sub_nav{display: block;width:20px;}
#bnt_sub_nav img{display: block;}
.content-area {gap: 20px;}
.carousel-section {margin: 30px 0;}
.brands-section { margin: 30px 0;}
.brand-grid {grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 16px;}
.new-arrival,.featured-cats{padding:16px 14px;}
.breadcrumb {padding: 16px 14px;}

.list_download li .txtbox{align-items: flex-start;justify-content: space-between;flex-direction: column;}
.list_download li .titbox{width:100%;margin-bottom:5px;}
.list_download li .titbox .tit{margin-bottom: 5px;}
.footer-grid{grid-template-columns: 1fr;gap: 32px;}
.back-to-top a{border: 3px solid #ffffff54;width:48px;height:48px;font-size: 1.4rem;}
.contact-info{flex-direction: column;align-items: flex-start;}
.contact-details i{width:20px;}
.whatsapp{position: fixed;bottom:46%;right: 10px;z-index:8;}
.whatsapp svg{ height:36px; width:36px;}
}


@media (max-width: 600px){
.m_header .m_logo{width:70px;}
.logobox .TppSlogan *{font-size:14px !important;display: none;}
.search_btn{width:28px;}
.menu-btn {width: 20px;height: 16px; border-top: 2px solid #ffffff;}
.menu-btn:before,.menu-btn:after{ height: 2px;}
.menu-btn:before{bottom: 7px;width: 14px;}
.menu-btn:after{bottom: 0;width: 20px;}
.menu-btn.cli{border-top: transparent;}
.menu-btn.cli:before{width: 24px;transform: translate(2px, 0) rotate(-45deg);}
.menu-btn.cli:after{width: 24px;transform: translate(2px,-7px) rotate(-135deg);}
.pub-close {width: 24px;height: 24px;right: 15px;top:15px;}
.search-dialog { margin: 0 0 0 5%;}
.search-dialog .search-input input[type=text] { height: 42px; font-size: 15px;}
.search-dialog .search-input input[type=submit], .search-dialog .search-input .clear-btn {height: 42px;}
.logobox .logo{width:70px;}
.nav-links li{font-size:1rem;}
.cat-icon-grid{grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));}
.message-board form,.message_box form{gap: 8px;}
.message-board .item,.message_box .item { width:100%;}
.message-board input,.message_box input{padding:6px 10px 6px 20px;flex: 1;}
.message-board textarea,.message_box textarea{padding: 6px 10px 6px 14px;min-height: 66px;}
.message-board .item-code .fc-code, .message-board .item-code .fc-code img,.message_box .fc-code,.message_box .fc-code img{height:33px;}
.message-board button,.message_box button{padding:8px 28px;}
.social-icons a{width:38px;height:38px;font-size: 1rem;}
.news_list li a {flex-direction: column;}
.news_list li .imgbox{max-width: 100%;width: 100%;}
.news_list li .textbox {padding: 20px 14px 20px 14px;}
.product-show .ny_title .tit{font-size: 1.3rem;}
.newsBottom .prev{margin-bottom:5px;}
.back-to-top a{width:42px;height:42px;font-size: 1.2rem;}
.page{display: none;}
.ph_pages{display: block;margin-bottom:10px;}
}
@media (max-width: 414px){
.cat-icon-grid{grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));}
}