/* 思源宋体由 font.alnk.cn 镜像加载，见各页 中的 link */ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Noto Serif SC', '思源宋体', serif; line-height: 1.6; color: #333; overflow-x: hidden; } .container { max-width: 100%; margin: 0 auto; padding: 0 20px; } /* Header */ .header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: rgba(255, 255, 255, 0.95); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); padding: 15px 0; } .header .container { display: flex; justify-content: space-between; align-items: center; } .logo { margin-left: 20%; /* 原 10% + 右偏 10% */ } .logo img { height: 50px; width: auto; } .nav { margin-right: 25%; /* 菜单向左偏 25%（原 15% + 再偏 10%） */ } .nav-menu { display: flex; list-style: none; gap: 30px; } .nav-link { text-decoration: none; color: #333; font-size: 16px; font-weight: 500; transition: color 0.3s; position: relative; } .nav-link:hover, .nav-link.active { color: #8B4513; } .nav-link.active::after { content: ''; position: absolute; bottom: -5px; left: 0; right: 0; height: 2px; background: #8B4513; } .menu-toggle { display: none; flex-direction: column; background: none; border: none; cursor: pointer; padding: 5px; gap: 5px; } .menu-toggle span { width: 25px; height: 2px; background: #333; transition: all 0.3s; } /* Hero Banner */ .hero-banner { position: relative; width: 100%; margin-top: 88px; overflow: hidden; display: flex; justify-content: center; align-items: center; background: #fff; margin-bottom: 30px; } .hero-image { width: 100%; max-width: 1920px; height: auto; display: block; object-fit: contain; margin: 0 auto; } .hero-content { position: absolute; top: 50%; right: 10%; transform: translateY(-50%); color: #D4A574; text-align: right; } .hero-title { font-size: 48px; font-weight: 700; margin-bottom: 10px; line-height: 1.2; } .hero-subtitle { font-size: 36px; font-weight: 600; margin-bottom: 15px; } .hero-description { font-size: 18px; margin-bottom: 10px; font-weight: 400; } .hero-english { font-size: 24px; font-weight: 500; letter-spacing: 2px; } /* Product Carousel */ .product-carousel { width: 100%; position: relative; background: #fff; } .carousel-container { position: relative; width: 100%; background: #fff; } .carousel-wrapper { position: relative; width: 100%; overflow: hidden; display: flex; justify-content: center; align-items: center; background: #fff; } .carousel-slide { display: none; width: 100%; max-width: 1920px; margin: 0 auto; justify-content: center; align-items: center; background: #fff; } .carousel-slide.active { display: flex; } .carousel-slide img { width: 100%; max-width: 1920px; height: auto; display: block; object-fit: contain; margin: 0 auto; } .carousel-controls { position: relative; width: 100%; display: flex; justify-content: center; align-items: center; margin-top: 20px; padding: 0; z-index: 10; } .carousel-indicators { display: flex; gap: 15px; align-items: center; justify-content: center; } .indicator-img { width: auto; height: 50px; cursor: default; display: none; transition: opacity 0.3s; } .indicator-img.active { display: block; opacity: 1; } /* About Section */ .about-section { padding: 60px 20px; background: #fff; text-align: center; } .about-title-image { margin-bottom: 40px; } .about-title-image img { max-width: 100%; height: auto; } .about-content { max-width: 900px; margin: 0 auto 40px; } .about-tagline { font-size: 28px; font-weight: 600; color: #8B4513; margin-bottom: 30px; } .about-text-bold { margin-bottom: 30px; } .about-text-bold p { font-size: 18px; font-weight: 700; color: #333; margin-bottom: 15px; text-align: center; line-height: 2; } .about-text-normal { max-width: 800px; margin: 0 auto; } .about-text-normal p { font-size: 18px; line-height: 2; color: #555; margin-bottom: 15px; text-align: center; } .about-logo { margin-top: 40px; } .about-logo img { max-width: 100%; height: auto; } /* Interior Section */ .interior-section { width: 100%; max-width: 1920px; margin: 0 auto; } .interior-section { display: flex; justify-content: center; align-items: center; background: #ffffff; overflow: hidden; } .interior-image { /* 首页 home_banner4.png：等比例缩放 85%，居中展示 */ width: 85%; max-width: 1632px; height: auto; display: block; object-fit: contain; margin: 0 auto; /* 使用宽度缩放更稳定，避免 transform 造成视觉偏移 */ transform: none; } /* 首页专用 Banner 缩放 */ .home-hero-image { width: 100%; max-width: 1920px; } .home-banner2-image { width: 90%; max-width: 1728px; /* 1920 的 90% */ } /* Footer */ .footer { background: #fff; padding: 60px 20px 40px; } .footer-content { display: flex; justify-content: space-around; max-width: 1200px; margin: 0 auto 40px; flex-wrap: wrap; gap: 30px; } .footer-column { text-align: center; flex: 1; min-width: 200px; } .footer-title { font-size: 20px; font-weight: 600; color: #333; margin-bottom: 10px; } .footer-subtitle { font-size: 16px; color: #666; } .footer-contact { font-size: 18px; color: #8B4513; font-weight: 500; } .footer-logo { text-align: center; margin-top: 40px; } .footer-logo img { max-width: 300px; height: auto; } .footer-icp { text-align: center; margin-top: 24px; padding-bottom: 20px; font-size: 14px; color: #000; } .footer-icp a { color: #000; text-decoration: none; } .footer-icp a:hover { color: #8B4513; } /* Products Page 样式已拆分至 css/products.css */ /* 移动端样式 */ @media (max-width: 800px) { .header { padding: 10px 0; } .logo { margin-left: 5%; } .logo img { height: 40px; } .nav-menu { position: fixed; top: 70px; right: -100%; flex-direction: column; background: rgba(255, 255, 255, 0.98); width: 80%; max-width: 300px; padding: 20px; box-shadow: -2px 2px 10px rgba(0, 0, 0, 0.1); transition: right 0.3s; gap: 20px; } .nav-menu.active { right: 0; } .menu-toggle { display: flex; } .menu-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(8px, 8px); } .menu-toggle.active span:nth-child(2) { opacity: 0; } .menu-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(7px, -7px); } /* .hero-banner { margin-top: 60px; } */ .hero-content { right: 5%; top: 40%; } .hero-title { font-size: 32px; } .hero-subtitle { font-size: 24px; } .hero-description { font-size: 14px; } .hero-english { font-size: 18px; } .about-section { padding: 40px 15px; } .about-tagline { font-size: 22px; } .about-text-bold p { font-size: 16px; } .about-text-normal p { font-size: 16px; } .footer { padding: 40px 15px 30px; } .footer-content { flex-direction: column; gap: 25px; } .footer-title { font-size: 18px; } .footer-subtitle, .footer-contact { font-size: 14px; } .carousel-controls { margin-top: 20px; gap: 15px; } .indicator-img { height: 40px; } .indicator-img.active { display: block; } } /* PC端全宽显示 */ @media (min-width: 801px) { .hero-banner { /* min-height: 800px; */ /* margin-top: 1%; */ display: flex; justify-content: center; align-items: center; } .hero-image { width: 100%; max-width: 1920px; height: auto; aspect-ratio: 1920 / 800; object-fit: contain; object-position: center; } .hero-content { right: 8%; } .hero-title { font-size: 56px; } .hero-subtitle { font-size: 42px; } .hero-description { font-size: 20px; } .hero-english { font-size: 28px; } .carousel-slide { min-height: 400px; } .carousel-slide img { max-width: 1920px; } .indicator-img { height: 60px; } }