@charset "utf-8";

/* ====== Reset ====== */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}
html { background-image: url(../img/bg-rep-06.png); }
fieldset, img { border: 0; }
:focus { outline: 0; }
address, caption, cite, code, dfn, em, th, var, optgroup { font-style: normal; font-weight: normal; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
abbr, acronym { border: 0; font-variant: normal; }
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
code, kbd, samp, tt { font-size: 100%; }
body { line-height: 1.5; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th { text-align: left; }
sup, sub { font-size: 100%; vertical-align: baseline; }
:link, :visited, ins { text-decoration: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/* ====== Fonts ====== */
body { font: 13px/1.231 arial, helvetica, clean, sans-serif; }
table { font-size: inherit; font: 100%; }
pre, code, kbd, samp, tt { font-family: monospace; line-height: 100%; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; }
h1, .h1 { font-size: 32px; }
h2, .h2 { font-size: 26px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 22px; }
h5, .h5 { font-size: 18px; }
h6, .h6 { font-size: 14px; }

/* ====== Clearfix ====== */
.clear { clear: both; visibility: hidden; display: block; font-size: 0; line-height: 0; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { *zoom: 1; }

/* ====== Typo ====== */
.typo:before, .typo:after { content: "."; display: block; height: 0; visibility: hidden; }
.typo:after { clear: both; }
.typo { *zoom: 1; }
.typo .typo-text { overflow: hidden; *zoom: 1; }
.typo .typo-img { float: left; margin-right: 20px; }
.typo .typo-img-right { float: right; margin-left: 20px; margin-right: 0; }

/* ====== Columns ====== */
.column:after { clear: both; content: "."; display: block; font-size: 0; height: 0; line-height: 0; min-height: 0; visibility: hidden; *zoom: 1; }
.column { width: 100%; }
.column .col-2-1, .column .col-3-1, .column .col-4-1, .column .col-4-2, .column .col-5-1, .column .col-3-2, .column .col-4-3, .column .col-5-2, .column .col-5-3, .column .col-5-4 { float: left; min-height: 1px; height: auto !important; }
.column .col-1-1 { width: 100%; }
.column .col-2-1 { width: 48.5%; margin-right: 3%; }
.column .col-3-1 { width: 31.3333%; margin-right: 3%; }
.column .col-4-1 { width: 22.75%; margin-right: 3%; }
.column .col-5-1 { width: 17.6%; margin-right: 3%; }
.column .col-3-2 { width: 65.6666%; margin-right: 3%; }
.column .col-4-2 { width: 48.5%; margin-right: 3%; }
.column .col-4-3 { width: 74.25%; margin-right: 3%; }
.column .col-5-2 { width: 38.2%; margin-right: 3%; }
.column .col-5-3 { width: 58.8%; margin-right: 3%; }
.column .col-5-4 { width: 79.4%; margin-right: 3%; }
.column .last { margin-right: 0; }

/* ====== row-svar ====== */
.row2-svar { *zoom: 1; }
.row2-svar:before, .row2-svar:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.row2-svar .col-2-1, .row2-svar .col-3-1, .row2-svar .col-4-1, .row2-svar .col-5-1 { float: left; min-height: 1px; clear: right; }
.row2-svar .col-2-1 { width: 48.5%; margin-right: 3%; }
.row2-svar .col-3-1 { width: 31.3333%; margin-right: 3%; }
.row2-svar .col-4-1 { width: 22.75%; margin-right: 3%; }
.row2-svar .col-5-1 { width: 17.6%; margin-right: 3%; }
.row2-svar .col-2-1:nth-of-type(2n+2), .row2-svar .col-3-1:nth-of-type(3n+3), .row2-svar .col-4-1:nth-of-type(4n+4), .row2-svar .col-5-1:nth-of-type(5n+5) { margin-right: 0; }
.row2-svar .col-2-1:nth-of-type(2n+1), .row2-svar .col-3-1:nth-of-type(3n+1), .row2-svar .col-4-1:nth-of-type(4n+1), .row2-svar .col-5-1:nth-of-type(5n+1) { clear: both; }

/* ====== Utility ====== */
.float-left { float: left !important; }
.float-right { float: right !important; }
.text-center { text-align: center; }
.page-width { width: 1200px; margin: 0 auto; max-width: 100%; }
.page-width .page-width { width: auto; }

/* ====== Module ====== */
.module-default { margin-bottom: 25px; }
.module-inner { }
.module-content { }
.module-no-margin { margin-bottom: 0; }

/* ====== QHD Content ====== */
.qhd-content h1, .qhd-content h2, .qhd-content h3, .qhd-content h4, .qhd-content h5, .qhd-content h6 { font-weight: bold; }
.qhd-content h1 { font-size: 34px; line-height: 1.3em; margin-bottom: 5px; }
.qhd-content h2 { font-size: 30px; line-height: 1.2em; margin-bottom: 10px; }
.qhd-content h3 { font-size: 26px; line-height: 1.6em; margin-bottom: 10px; }
.qhd-content h4 { font-size: 22px; line-height: 1.25em; margin-bottom: 10px; }
.qhd-content h5 { font-size: 18px; line-height: 1.6em; margin-bottom: 10px; }
.qhd-content h6 { font-size: 14px; line-height: 1.5em; margin-bottom: 10px; }
.qhd-content p { line-height: 160%; margin-bottom: 15px; }
.qhd-content ul, .qhd-content ol { margin: 0 0 15px 0; padding-left: 1.5em; line-height: 180%; }
.qhd-content ul { list-style-type: disc; }
.qhd-content ol { list-style-type: decimal; }
.qhd-content .typo:before, .qhd-content .typo:after { content: "."; display: block; height: 0; visibility: hidden; }
.qhd-content .typo:after { clear: both; }
.qhd-content .typo { *zoom: 1; margin-bottom: 0; }
.qhd-content .typo .typo_text { overflow: hidden; }
.qhd-content .typo .typo_img { float: left; margin-right: 20px; margin-bottom: 12px; }
.qhd-content .typo .typo_img img { display: block; }

/* ====== Form ====== */
.qhdform fieldset { border: none; margin: 0; padding: 0; }
.qhdform .formrow { font-size: 12px; line-height: 100%; }
.qhdform .formrow:before, .formrow:after { content: "."; display: block; height: 0; visibility: hidden; }
.qhdform .formrow:after { clear: both; }
.qhdform .formrow { #zoom: 1; }
.qhdform .formrow .label { display: block; float: left; margin: 5px 15px 0 0; line-height: 16px; width: 100px; }
.qhdform .formrow .controls { overflow: hidden; }
.qhdform .input-text { width: 100%; padding: 8px 12px; border: 1px solid #ddd; font-size: 14px; line-height: 1.5; box-sizing: border-box; }
.qhdform textarea { width: 100%; padding: 8px 12px; border: 1px solid #ddd; font-size: 14px; line-height: 1.5; min-height: 120px; resize: vertical; box-sizing: border-box; }
.qhdform .form-btn { display: inline-block; padding: 10px 40px; background-color: #72b32a; color: #fff; border: none; font-size: 16px; cursor: pointer; transition: all 0.3s ease; }
.qhdform .form-btn:hover { background-color: #2ba165; }
.qhdform .formrow { margin-bottom: 15px; }

/* ====== Table ====== */
.qhd-content table { width: 100%; margin-bottom: 20px; }
.qhd-content table th, .qhd-content table td { padding: 10px 15px; border: 1px solid #e5e5e5; text-align: left; }
.qhd-content table th { background-color: #f7f7f7; font-weight: bold; color: #333; }

/* ====== Top Info Bar (topbox) ====== */
.topbox { width: 100%; position: relative; z-index: 1000; }
/* lotbox: 顶部信息栏 */
.lotbox { padding: 25px 0; background: #fff; }
.lotbox .page-width { display: flex; align-items: center; justify-content: space-between; }
.lotbox .logo-area { display: flex; align-items: center; }
.lotbox .logo-area .logo-svg { width: 50px; height: 50px; margin-right: 12px; flex-shrink: 0; }
.lotbox .logo-area .logo-text { line-height: 1.3; }
.lotbox .logo-area .logo-text .brand-name { font-size: 22px; font-weight: bold; color: #333; display: block; }
.lotbox .logo-area .logo-text .brand-tag { font-size: 12px; color: #72b32a; letter-spacing: 3px; display: block; }
.lotbox .contact-area { text-align: right; }
.lotbox .contact-area .contact-icon { display: inline-block; vertical-align: middle; margin-right: 10px; }
.lotbox .contact-area .contact-text { display: inline-block; vertical-align: middle; text-align: left; }
.lotbox .contact-area .contact-text .contact-label { font-size: 14px; color: #656565; display: block; }
.lotbox .contact-area .contact-text .contact-phone { font-size: 28px; color: #ff0000; font-weight: bold; line-height: 1; }

/* ====== Navigation (menubox inside topbox) ====== */
.menubox { background: url(../img/header-line.png) repeat-x rgba(255,255,255,0.8); }
.menubox .page-width { position: relative; }
.menubox .main-nav { }
.menubox .main-nav .nav-list { display: flex; }
.menubox .main-nav .nav-list li { position: relative; margin-right: 2px; }
.menubox .main-nav .nav-list li a { display: block; line-height: 55px; padding: 0 1.8em; font-size: 15px; color: #000; font-weight: normal; border: none; transition: color 0.3s ease; }
.menubox .main-nav .nav-list li a:hover,
.menubox .main-nav .nav-list li:hover > a,
.menubox .main-nav .nav-list li.active > a { color: #72b32a; }
.menubox .main-nav .nav-list li.active > a { color: #72b32a; }
/* Dropdown */
.menubox .main-nav .nav-list li ul { position: absolute; top: 55px; left: 0; width: 14em; background: rgba(255,255,255,0.95); box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.1); z-index: 99; display: none; }
.menubox .main-nav .nav-list li:hover > ul { display: block; }
.menubox .main-nav .nav-list li ul li { margin: 0; float: none; }
.menubox .main-nav .nav-list li ul li a { padding: 14px 20px; line-height: normal; font-size: 13px; color: #666; border-top: none; }
.menubox .main-nav .nav-list li ul li a:hover,
.menubox .main-nav .nav-list li ul li:hover > a { background-color: #72b32a; color: #fff; }

/* ====== Banner Carousel ====== */
.bannerbox { position: relative; }
.bannerbox .carousel { height: 500px; overflow: hidden; position: relative; }
.bannerbox .carousel .carousel-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.8s ease; }
.bannerbox .carousel .carousel-item.active { opacity: 1; }
.bannerbox .carousel .carousel-item .carousel-img { width: 100%; height: 100%; }
.bannerbox .carousel .carousel-item .carousel-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bannerbox .carousel .carousel-info { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 10; color: #fff; width: 80%; max-width: 800px; }
.bannerbox .carousel .carousel-info h3 { font-size: 36px; font-weight: bold; margin-bottom: 15px; text-shadow: 0 2px 8px rgba(0,0,0,0.4); }
.bannerbox .carousel .carousel-info p { font-size: 18px; line-height: 1.6; text-shadow: 0 1px 4px rgba(0,0,0,0.3); }
.bannerbox .carousel .carousel-btn { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; gap: 10px; }
.bannerbox .carousel .carousel-btn a { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #ccc; cursor: pointer; transition: background 0.3s ease; }
.bannerbox .carousel .carousel-btn a.selected { background: #72b32a; }
.bannerbox .carousel .carousel-prev,
.bannerbox .carousel .carousel-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 50px; height: 50px; background: rgba(0,0,0,0.3); color: #fff; font-size: 24px; line-height: 50px; text-align: center; cursor: pointer; border-radius: 50%; transition: background 0.3s ease; }
.bannerbox .carousel .carousel-prev:hover,
.bannerbox .carousel .carousel-next:hover { background: rgba(0,0,0,0.6); }
.bannerbox .carousel .carousel-prev { left: 30px; }
.bannerbox .carousel .carousel-next { right: 30px; }

/* ====== Module Full Screen Sections ====== */
.module-full-screen { overflow: hidden; }
.module-full-screen > .module-inner { padding: 30px 0; }
.module-full-screen > .module-inner .page-width { width: auto; max-width: 1120px; }
.module-full-screen-title { margin-bottom: 30px; padding-bottom: 30px; text-align: center; background: url(../img/module-title-bg.png) no-repeat center bottom; }
.module-full-screen-title > h2 { margin-bottom: 0; line-height: normal; font-weight: normal; color: #4d4d4d; font-size: 24px; }
.module-full-screen-more { float: none; clear: both; margin-top: 30px; text-align: center; }
.module-full-screen-more a { display: inline-block; line-height: 34px; padding: 0 35px; border: 1px solid #999; color: #666; transition: all 0.5s ease 0s; }
.module-full-screen-more a:hover, .module-full-screen-more a:active { background-color: #72b32a; border-color: #72b32a; color: #fff; text-decoration: none; }
.module-full-screen-gray { background-color: #ebebec; }

/* ====== Portfolio Grid (Product Grid) ====== */
.portfolio-grid { }
.portfolio-grid-item { float: left; }
.portfolio-grid-item a { display: block; position: relative; overflow: hidden; }
.portfolio-grid-img { overflow: hidden; }
.portfolio-grid-img img { display: block; width: 100%; transform: scale(1); transition: all 0.3s ease-out 0s; }
.portfolio-grid-text { position: absolute; top: 38%; left: 0; z-index: 11; width: 100%; opacity: 0; transition: all 0.3s ease-out 0s; }
.portfolio-grid-text h3 { font-size: 15px; text-align: center; padding: 0 15px; margin-top: -15px; color: #fff; transition: all 0.3s ease-out 0s; }
.portfolio-grid-item .overlay { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10; background-color: #000; opacity: 0; transition: all 0.3s ease-out 0s; }
.portfolio-grid-item a:hover img { transform: scale(1.2); transition: all 0.3s ease-out 0s; }
.portfolio-grid-item a:hover .portfolio-grid-text { opacity: 1; }
.portfolio-grid-item a:hover .portfolio-grid-text h3 { margin-top: 0; }
.portfolio-grid-item a:hover .overlay { opacity: 0.8; }
.portfolio-grid-3col .portfolio-grid-item { width: 33.333%; }
.portfolio-grid-4col .portfolio-grid-item { width: 25%; }

/* ====== Product List ====== */
.product-list li { margin-bottom: 25px; text-align: center; }
.product-item { position: relative; background-color: #62AF29; }
.product-item .portfolio-img { background-color: #f2f2f2; overflow: hidden; position: relative; margin-bottom: 0; }
.product-item .portfolio-img img { display: block; width: 100%; transition: all 0.3s ease-out; }
.product-item .portfolio-title { padding: 12px 10px; }
.product-item .portfolio-title h2 { font-size: 16px; line-height: normal; font-weight: normal; }
.product-item .portfolio-title a { color: #fff; }
.product-item .price { padding: 0 10px 15px; }
.product-item .price strong { color: #FCFF00; font-size: 18px; }
.product-item .portfolio-text { display: none; position: absolute; top: 0; left: 0; z-index: 20; text-align: center; width: 100%; height: 100%; color: #fff; }
.product-item .portfolio-text h2 { margin: 60px 20px 20px; line-height: normal; font-size: 18px; font-weight: normal; }
.product-item .portfolio-text .icon-detail { display: inline-block; width: 41px; height: 41px; background: url(../img/icon-detail.gif) no-repeat center; transition: transform 0.5s ease-out; }
.product-item .portfolio-text .price { color: #fff; margin-bottom: 20px; }
.product-item a:hover .portfolio-text { display: block; }
.product-item a:hover .portfolio-img img { transform: scale(1.1); }
.product-item .opacity-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,0.5); z-index: 19; display: none; }
.product-item a:hover .opacity-overlay { display: block; }
.product-list .col-4-1 .product-item .portfolio-text h2 { margin-top: 60px; }

/* ====== Headlines List 2 Col (News) ====== */
.headlines-list-2col .headlines-content { width: 48%; float: left; display: inline; margin-right: 5%; }
.headlines-list-2col .headlines-content p { margin-bottom: 15px; }
.headlines-list-2col .headlines-content p a { display: block; }
.headlines-list-2col .headlines-content p img { display: block; width: 100%; }
.headlines-list-2col .headlines-content h2 { font-size: 16px; line-height: normal; margin-bottom: 8px; }
.headlines-list-2col .headlines-content h2 a { color: #333; }
.headlines-list-2col .headlines-content h2 a:hover { color: #72b32a; }
.headlines-list-2col .headlines-content-summary { font-size: 13px; line-height: 1.5; color: #666; }
.headlines-list-2col .headlines-others { overflow: hidden; *zoom: 1; }
.headlines-list-2col .headlines-others .entry-set-time-hl .entry-item { border-bottom: none; margin-bottom: 10px; padding-bottom: 10px; }

/* ====== Entry List (News items) ====== */
.entry-item { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px dotted #e5e5e5; }
.entry-list-time-hl .entry-item { border-bottom: 1px dotted #e5e5e5; margin-bottom: 10px; padding-bottom: 10px; }
.entry-list-time-hl .time { float: left; width: 55px; text-align: center; }
.entry-list-time-hl .time-day { font-size: 28px; font-weight: bold; color: #72b32a; line-height: 1; }
.entry-list-time-hl .time-date { font-size: 12px; color: #999; }
.entry-list-time-hl .entry-title { overflow: hidden; }
.entry-list-time-hl .entry-title h2 { font-size: 14px; line-height: 1.4; }
.entry-list-time-hl .entry-title h2 a { color: #333; }
.entry-list-time-hl .entry-title h2 a:hover { color: #72b32a; }
.entry-list-time-hl .entry-summary { overflow: hidden; color: #808080; font-size: 13px; }
.entry-set-time-hl .entry-item { overflow: hidden; }
.entry-set-time-hl .time { float: left; width: 55px; text-align: center; }
.entry-set-time-hl .time-day { font-size: 28px; font-weight: bold; color: #72b32a; line-height: 1; }
.entry-set-time-hl .time-date { font-size: 12px; color: #999; }
.entry-set-time-hl .entry-title { overflow: hidden; }
.entry-set-time-hl .entry-title h2 { font-size: 14px; }
.entry-set-time-hl .entry-title h2 a { color: #333; }
.entry-set-time-hl .entry-title h2 a:hover { color: #72b32a; }
.entry-set-time-hl .entry-summary { overflow: hidden; color: #808080; font-size: 13px; margin-top: 5px; }
.entry-title { margin-bottom: 15px; }
.entry-title h2 { font-size: 16px; line-height: 1.4; }
.entry-title a { color: #333; }
.entry-title a:hover { color: #72b32a; text-decoration: none; }
.entry-meta { font-size: 12px; margin-bottom: 10px; color: #999; }
.entry-summary { color: #808080; font-size: 13px; margin-bottom: -5px; }

/* ====== Article Detail ====== */
.article-detail .article-title { text-align: center; margin-bottom: 15px; }
.article-detail .article-title h1 { font-size: 22px; line-height: 1.5; font-weight: normal; color: #333; }
.article-detail .entry-meta { text-align: center; margin-bottom: 20px; padding-bottom: 10px; font-size: 12px; color: #999; }
.article-detail .entry-meta span { margin: 0 10px; }
.article-detail .article-content { margin-top: 25px; }
.article-detail .article-content p { line-height: 1.8; margin-bottom: 15px; color: #555; text-indent: 2em; }

/* ====== N-Banner (Inner Page Banner) ====== */
.n-banner { position: relative; height: 350px; overflow: hidden; }
.n-banner img { width: 100%; height: 100%; object-fit: cover; display: block; }
.n-banner .n-banner-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.35); }
.n-banner .n-banner-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; z-index: 2; }
.n-banner .n-banner-text h1 { font-size: 32px; font-weight: bold; margin-bottom: 10px; }
.n-banner .n-banner-text p { font-size: 16px; opacity: 0.9; }

/* ====== Breadcrumb (ntit) ====== */
.ntit { background: #f7f7f7; border-bottom: 1px solid #e5e5e5; padding: 15px 0; }
.ntit .ntt { display: flex; justify-content: space-between; align-items: center; }
.ntit .ntt .page-tit { display: flex; align-items: baseline; gap: 12px; }
.ntit .ntt .page-tit h1 { font-size: 18px; color: #333; font-weight: bold; }
.ntit .ntt .page-tit i { font-size: 12px; color: #999; font-style: italic; text-transform: uppercase; }
.ntit .ntt .weiz { font-size: 13px; color: #808080; }
.ntit .ntt .weiz a { color: #808080; }
.ntit .ntt .weiz a:hover { color: #72b32a; }
.ntit .ntt .weiz span { color: #333; }

/* ====== Inner Page Main ====== */
.main-wrap { padding: 40px 0; min-height: 400px; }
.main-wrap .page-width { }

/* ====== Sidebar Menu ====== */
.side-menu { margin-bottom: 30px; }
.side-menu .side-menu-title { background: #72b32a; color: #fff; padding: 15px 20px; font-size: 18px; font-weight: bold; }
.side-menu ul { border: 1px solid #e5e5e5; border-top: none; }
.side-menu ul li { border-bottom: 1px solid #e5e5e5; }
.side-menu ul li:last-child { border-bottom: none; }
.side-menu ul li a { display: block; padding: 12px 20px; color: #555; transition: all 0.3s ease; }
.side-menu ul li a:hover,
.side-menu ul li.active a { background: #f7f7f7; color: #72b32a; border-left: 3px solid #72b32a; }

/* ====== About Page ====== */
.about-intro { }
.about-intro .about-img { margin-bottom: 25px; text-align: center; }
.about-intro .about-img img { max-width: 100%; border-radius: 8px; }
.timeline { position: relative; padding: 20px 0; }
.timeline:before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: #72b32a; transform: translateX(-50%); }
.timeline .timeline-item { position: relative; margin-bottom: 30px; width: 50%; }
.timeline .timeline-item:nth-child(odd) { left: 0; padding-right: 40px; text-align: right; }
.timeline .timeline-item:nth-child(even) { left: 50%; padding-left: 40px; text-align: left; }
.timeline .timeline-item .timeline-dot { position: absolute; top: 5px; width: 14px; height: 14px; border-radius: 50%; background: #72b32a; z-index: 1; }
.timeline .timeline-item:nth-child(odd) .timeline-dot { right: -7px; }
.timeline .timeline-item:nth-child(even) .timeline-dot { left: -7px; }
.timeline .timeline-item .timeline-date { font-size: 14px; color: #72b32a; font-weight: bold; margin-bottom: 5px; }
.timeline .timeline-item .timeline-content { background: #f7f7f7; padding: 15px 20px; border-radius: 8px; }
.timeline .timeline-item .timeline-content h4 { font-size: 16px; margin-bottom: 5px; color: #333; }
.timeline .timeline-item .timeline-content p { font-size: 13px; color: #666; margin-bottom: 0; }

/* ====== Culture Cards ====== */
.culture-cards { display: flex; gap: 25px; margin-top: 30px; }
.culture-card { flex: 1; background: #f7f7f7; padding: 30px 25px; text-align: center; border-radius: 8px; transition: all 0.3s ease; }
.culture-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.culture-card .culture-icon { width: 70px; height: 70px; margin: 0 auto 20px; background: #72b32a; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.culture-card .culture-icon svg { width: 35px; height: 35px; }
.culture-card h3 { font-size: 18px; color: #333; margin-bottom: 10px; }
.culture-card p { font-size: 14px; color: #666; line-height: 1.6; }

/* ====== Team ====== */
.team-grid { display: flex; flex-wrap: wrap; gap: 25px; }
.team-card { flex: 0 0 calc(25% - 19px); text-align: center; }
.team-card .team-img { width: 150px; height: 150px; margin: 0 auto 15px; border-radius: 50%; overflow: hidden; border: 3px solid #72b32a; }
.team-card .team-img img { width: 100%; height: 100%; object-fit: cover; }
.team-card h3 { font-size: 16px; color: #333; margin-bottom: 5px; }
.team-card p { font-size: 13px; color: #999; }

/* ====== Contact Page ====== */
.contact-info-list { margin-bottom: 30px; }
.contact-info-list .contact-info-item { display: flex; align-items: flex-start; margin-bottom: 20px; padding: 15px; background: #f7f7f7; border-radius: 8px; }
.contact-info-item .ci-icon { width: 45px; height: 45px; background: #72b32a; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 15px; flex-shrink: 0; }
.contact-info-item .ci-icon svg { width: 22px; height: 22px; }
.contact-info-item .ci-text h4 { font-size: 15px; color: #333; margin-bottom: 5px; }
.contact-info-item .ci-text p { font-size: 14px; color: #666; }
.contact-form-wrap { background: #f7f7f7; padding: 30px; border-radius: 8px; }

/* ====== Service Features ====== */
.service-features { background: #ebebec; padding: 40px 0; }
.service-features .sf-item { text-align: center; padding: 20px 10px; }
.service-features .sf-item .sf-icon { width: 66px; height: 66px; margin: 0 auto 15px; }
.service-features .sf-item .sf-icon img { width: 100%; height: 100%; }
.service-features .sf-item p { color: #999; font-size: 16px; }

/* ====== Partner Logo Wall ====== */
.partner-wall { padding: 30px 0; }
.partner-wall .partner-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 30px; }
.partner-wall .partner-list li { padding: 15px 20px; background: #f7f7f7; border-radius: 6px; text-align: center; color: #808080; font-size: 16px; min-width: 120px; transition: all 0.3s ease; }
.partner-wall .partner-list li:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.1); color: #72b32a; }

/* ====== Product Detail ====== */
.product-detail-top { display: flex; gap: 40px; margin-bottom: 40px; }
.product-detail-img { flex: 0 0 45%; }
.product-detail-img img { width: 100%; border-radius: 8px; }
.product-detail-info { flex: 1; }
.product-detail-info h1 { font-size: 24px; color: #333; margin-bottom: 15px; }
.product-detail-info .prod-desc { color: #666; line-height: 1.8; }
.feature-list { margin-top: 20px; }
.feature-list li { padding: 8px 0; padding-left: 25px; position: relative; color: #555; font-size: 14px; }
.feature-list li:before { content: '✓'; position: absolute; left: 0; top: 8px; color: #72b32a; font-weight: bold; }
.related-products { margin-top: 50px; padding-top: 30px; border-top: 1px solid #e5e5e5; }
.related-products h3 { font-size: 20px; color: #333; margin-bottom: 25px; }

/* ====== News List Page ====== */
.news-list .news-item { display: flex; gap: 25px; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px dotted #e5e5e5; }
.news-list .news-item .news-thumb { flex: 0 0 250px; height: 160px; overflow: hidden; border-radius: 8px; }
.news-list .news-item .news-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.news-list .news-item .news-thumb:hover img { transform: scale(1.1); }
.news-list .news-item .news-info { flex: 1; }
.news-list .news-item .news-info h3 { font-size: 18px; margin-bottom: 8px; }
.news-list .news-item .news-info h3 a { color: #333; }
.news-list .news-item .news-info h3 a:hover { color: #72b32a; }
.news-list .news-item .news-info .news-date { font-size: 12px; color: #999; margin-bottom: 10px; }
.news-list .news-item .news-info .news-summary { font-size: 14px; color: #666; line-height: 1.6; }

/* ====== Article Prev/Next Nav ====== */
.article-nav { margin-top: 40px; padding-top: 20px; border-top: 1px solid #e5e5e5; display: flex; justify-content: space-between; }
.article-nav a { color: #555; font-size: 14px; }
.article-nav a:hover { color: #72b32a; }

/* ====== Footer ====== */
.footer { overflow: hidden; background-color: #2ba165; color: #fff; font-size: 13px; }
.footer a { color: #e5e5e5 !important; }
.footer a:hover { color: #fff !important; }
.footer-main .page-width { padding-top: 35px; padding-bottom: 35px; }
.footer .footer-col { float: left; min-height: 1px; }
.footer .footer-col-1 { width: 30%; margin-right: 3%; }
.footer .footer-col-2 { width: 20%; margin-right: 3%; }
.footer .footer-col-3 { width: 20%; margin-right: 3%; }
.footer .footer-col-4 { width: 24%; }
.footer .footer-col h4 { font-size: 16px; color: #fff; margin-bottom: 15px; font-weight: bold; }
.footer .footer-col p { line-height: 1.8; color: #e5e5e5; }
.footer .footer-col ul li { line-height: 2; }
.footer .footer-col ul li a { color: #e5e5e5; }
.footer .footer-col .footer-qr { text-align: center; margin-top: 10px; }
.footer .footer-col .footer-qr img { width: 97px; height: 97px; background: #fff; padding: 4px; border-radius: 4px; }
.footer .footer-col .footer-qr p { margin-top: 5px; font-size: 12px; }
.footer .footer-logo { margin-bottom: 15px; }
.footer .footer-logo img { max-width: 200px; }

/* ====== Bottom Copyright ====== */
.bottom { overflow: hidden; background: #fff; font-size: 13px; border-bottom: 4px solid #2ba165; }
.bottom .page-width { padding-top: 20px; padding-bottom: 20px; }
.bottom .qhd-content p { text-align: center; color: #808080; }
.bottom .qhd-content p a { color: #808080; }
.bottom .qhd-content p a:hover { color: #72b32a; }

/* ====== Fixed Side Toolbar ====== */
.fixed-side { position: fixed; top: 150px; right: 0; z-index: 10001; }
.fixed-side .link-fixed-side ul { }
.fixed-side .link-fixed-side ul li { margin-bottom: 2px; position: relative; }
.fixed-side .link-fixed-side ul li a.link-name { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; background: #72b32a; color: #fff; position: relative; transition: background 0.3s ease; }
.fixed-side .link-fixed-side ul li a.link-name:hover { background: #2ba165; }
.fixed-side .link-fixed-side ul li a.link-name i { display: block; width: 24px; height: 24px; background-size: contain; background-repeat: no-repeat; background-position: center; }
.fixed-side .link-fixed-side ul li a.link-name span { display: none; }
.fixed-side .link-fixed-side ul li .link-summary { display: none; position: absolute; right: 55px; top: 0; background: #fff; padding: 15px; box-shadow: 0 2px 10px rgba(0,0,0,0.15); white-space: nowrap; z-index: 10; }
.fixed-side .link-fixed-side ul li:hover .link-summary { display: block; }

/* ====== Back to Top ====== */
.gotop-wrapper { position: fixed; bottom: 50px; right: 15px; z-index: 1001; background-color: rgba(0,0,0,0.3); transition: background 0.3s ease; }
.gotop-wrapper:hover { background-color: rgba(0,0,0,0.6); }
.gotop-wrapper a { display: block; width: 55px; height: 55px; overflow: hidden; background: url(../img/icon-gotop-fixed.gif) no-repeat center; }

/* ====== Popup (WeChat QR) ====== */
.popup { display: none; }
.popup.show { display: block; }
.popup-content { position: fixed; top: 40%; left: 50%; transform: translate(-50%, -50%); z-index: 10000003; min-width: 200px; background-color: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); text-align: center; }
.popup-close-btn { position: absolute; top: -15px; right: -15px; }
.popup-close-btn a { display: block; width: 30px; height: 30px; background: #72b32a; color: #fff; border-radius: 50%; text-align: center; line-height: 30px; font-size: 14px; }
.popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 10000002; }

/* ====== Mobile Navigation ====== */
.touch-top { display: none; }
.touch-top-wrapper { display: flex; justify-content: space-between; align-items: center; padding: 10px 15px; background: #fff; }
.touch-top-wrapper .touch-logo { flex-shrink: 0; }
.touch-top-wrapper .touch-logo img { height: 40px; }
.touch-navigation { }
.touch-toggle { }
.touch-toggle a.drawer-menu { display: flex; align-items: center; color: #333; font-size: 14px; }
.touch-toggle a.drawer-menu i.touch-icon-menu { display: inline-block; width: 24px; height: 24px; margin-right: 5px; position: relative; }
.touch-toggle a.drawer-menu i.touch-icon-menu:before { content: '☰'; font-style: normal; font-size: 22px; color: #72b32a; }
.touch-toggle-content { display: none; background: #fff; border-top: 1px solid #e5e5e5; }
.touch-toggle-content .touch-menu { }
.touch-toggle-content .touch-menu ul { }
.touch-toggle-content .touch-menu ul li { border-bottom: 1px solid #e5e5e5; }
.touch-toggle-content .touch-menu ul li a { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; color: #333; font-size: 14px; }
.touch-toggle-content .touch-menu ul li a i { font-size: 12px; }
.touch-toggle-content .touch-menu ul li ul { display: none; background: #f7f7f7; padding-left: 15px; }
.touch-toggle-content .touch-menu ul li ul li { border-bottom: none; }
.touch-toggle-content .touch-menu ul li ul li a { padding: 8px 20px; font-size: 13px; color: #666; }

/* ====== Img Fallback ====== */
.img-fallback { background: linear-gradient(135deg, #72b32a, #2ba165); display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 200px; color: #fff; font-size: 14px; border-radius: 8px; }

/* ====== Animations ====== */
.not-animated { opacity: 0; }
.fadeInUp { animation: fadeInUp 0.6s ease forwards; }
.fadeInDown { animation: fadeInDown 0.6s ease forwards; }
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInDown {
  from { opacity: 0; transform: translateY(-30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ====== Breadcrumb Page Style ====== */
.page-menu-content { }
.page-menu-content ul { }
.page-menu-content ul li { border-bottom: 1px solid #e5e5e5; }
.page-menu-content ul li a { display: block; padding: 12px 20px; color: #555; transition: all 0.3s ease; }
.page-menu-content ul li a:hover,
.page-menu-content ul li.current a { background: #f7f7f7; color: #72b32a; border-left: 3px solid #72b32a; }

/* ====== News Detail ====== */
.news-detail { }
.news-detail .article-content img { max-width: 100%; border-radius: 8px; margin: 20px 0; }

/* ====== Product Detail ====== */
.product-detail { }
.product-detail .param-table { width: 100%; margin: 20px 0; }
.product-detail .param-table th,
.product-detail .param-table td { padding: 10px 15px; border: 1px solid #e5e5e5; }
.product-detail .param-table th { background: #f7f7f7; width: 30%; color: #333; }

/* ====== Page Title ====== */
.page-title { }
.page-title .page-width { }
.page-title .page-title-inner { }

/* ====== Content Area ====== */
.content { }
.content.float-left { float: left; width: 74.25%; margin-right: 3%; }
.content.float-right { float: right; width: 74.25%; }
.sidebar { }
.sidebar.float-left { float: left; width: 22.75%; }
.sidebar.float-right { float: right; width: 22.75%; margin-left: 3%; }

/* ====== Full page content ====== */
.full-page-content { padding: 30px 0; }

/* ====== Index About Section ====== */
.index-about { }
.index-about .about-content { display: flex; gap: 40px; align-items: center; }
.index-about .about-content .about-img { flex: 0 0 45%; }
.index-about .about-content .about-img img { width: 100%; border-radius: 8px; }
.index-about .about-content .about-text { flex: 1; }
.index-about .about-content .about-text h3 { font-size: 22px; color: #333; margin-bottom: 15px; }
.index-about .about-content .about-text p { font-size: 14px; line-height: 1.8; color: #666; margin-bottom: 10px; }
.index-about .about-stats { display: flex; gap: 20px; margin-top: 25px; }
.index-about .about-stats .stat-item { flex: 1; text-align: center; padding: 15px; background: #f7f7f7; border-radius: 8px; }
.index-about .about-stats .stat-item .stat-num { font-size: 28px; color: #72b32a; font-weight: bold; }
.index-about .about-stats .stat-item .stat-label { font-size: 13px; color: #999; margin-top: 5px; }

/* ====== Responsive: Tablet (<1024px) ====== */
@media (max-width: 1024px) {
  .page-width { width: 100%; padding: 0 20px; box-sizing: border-box; }
  .lotbox .page-width { flex-wrap: wrap; }
  .lotbox .contact-area { margin-top: 10px; }
  .menubox .main-nav .nav-list li a { padding: 0 1em; font-size: 14px; }
  .bannerbox .carousel { height: 350px; }
  .bannerbox .carousel .carousel-info h3 { font-size: 24px; }
  .bannerbox .carousel .carousel-info p { font-size: 14px; }
  .content.float-left,
  .content.float-right { float: none; width: 100%; margin-right: 0; }
  .sidebar.float-left,
  .sidebar.float-right { float: none; width: 100%; margin-left: 0; }
  .portfolio-grid-3col .portfolio-grid-item { width: 50%; }
  .team-card { flex: 0 0 calc(50% - 13px); }
  .culture-cards { flex-wrap: wrap; }
  .culture-card { flex: 0 0 calc(50% - 13px); }
  .footer .footer-col-1 { width: 50%; margin-bottom: 20px; }
  .footer .footer-col-2 { width: 25%; }
  .footer .footer-col-3 { width: 25%; margin-right: 0; }
  .footer .footer-col-4 { width: 50%; margin-top: 20px; }
  .index-about .about-content { flex-direction: column; }
  .index-about .about-content .about-img { flex: none; }
  .product-detail-top { flex-direction: column; }
  .product-detail-img { flex: none; }
  .timeline:before { left: 20px; }
  .timeline .timeline-item { width: 100%; left: 0 !important; padding-left: 50px !important; padding-right: 0 !important; text-align: left !important; }
  .timeline .timeline-item .timeline-dot { left: 13px !important; right: auto !important; }
}

/* ====== Responsive: Mobile (<768px) ====== */
@media (max-width: 768px) {
  .desktop-header { display: none; }
  .touch-top { display: block; }
  .bannerbox .carousel { height: 250px; }
  .bannerbox .carousel .carousel-info h3 { font-size: 18px; }
  .bannerbox .carousel .carousel-info p { font-size: 12px; }
  .bannerbox .carousel .carousel-prev,
  .bannerbox .carousel .carousel-next { width: 35px; height: 35px; font-size: 16px; line-height: 35px; }
  .portfolio-grid-3col .portfolio-grid-item { width: 50%; }
  .row2-svar .col-4-1 { width: 48.5%; margin-right: 3%; }
  .row2-svar .col-4-1:nth-of-type(2n+2) { margin-right: 0; }
  .row2-svar .col-4-1:nth-of-type(4n+1) { clear: none; }
  .row2-svar .col-4-1:nth-of-type(2n+1) { clear: both; }
  .headlines-list-2col .headlines-content { width: 100%; float: none; margin-right: 0; margin-bottom: 25px; }
  .team-card { flex: 0 0 calc(50% - 10px); }
  .culture-card { flex: 0 0 100%; }
  .footer .footer-col-1,
  .footer .footer-col-2,
  .footer .footer-col-3,
  .footer .footer-col-4 { width: 100%; margin-right: 0; margin-bottom: 20px; }
  .news-list .news-item { flex-direction: column; }
  .news-list .news-item .news-thumb { flex: none; width: 100%; height: 180px; }
  .index-about .about-stats { flex-wrap: wrap; }
  .index-about .about-stats .stat-item { flex: 0 0 calc(50% - 10px); }
  .ntit .ntt { flex-direction: column; align-items: flex-start; gap: 8px; }
  .n-banner { height: 200px; }
  .n-banner .n-banner-text h1 { font-size: 20px; }
  .about-intro .about-img img { width: 100%; }
  .team-grid { gap: 15px; }
  .service-features .column .col-5-1 { width: 48.5%; margin-right: 3%; margin-bottom: 15px; }
  .partner-wall .partner-list { gap: 15px; }
  .partner-wall .partner-list li { min-width: 80px; font-size: 13px; padding: 10px; }
  .article-nav { flex-direction: column; gap: 10px; }
  .product-list .col-4-1 { width: 48.5%; margin-right: 3%; }
  .column .col-5-1 { width: 48.5%; margin-right: 3%; margin-bottom: 15px; }
}
