/* 颜色变量 */ @bg-brand: #2e3192; @text-gold: #ecc129; @text-brand: #2e3192; @bg-white: #ffffff; @text-gray: #666666; @text-white: #ffffff; /* 字体大小变量 */ @text-xs: 0.75rem; @text-sm: 0.875rem; @text-base: 1rem; @text-lg: 1.125rem; @text-xl: 1.25rem; @text-2xl: 1.5rem; @text-fxl: 2rem; @text-xxs: 0.6rem; /* 间距变量 */ @spacing-1: 0.25rem; @spacing-2: 0.5rem; @spacing-3: 0.75rem; @spacing-4: 1rem; @spacing-5: 1.25rem; @spacing-6: 1.5rem; @spacing-8: 2rem; @spacing-10: 2.5rem; @spacing-12: 3rem; /* 高度和宽度变量 */ @h-4: 1rem; @h-5: 1.25rem; @h-6: 1.5rem; @h-8: 2rem; @h-10: 2.5rem; @h-12: 3rem; @h-20: 5rem; @h-63: 252px; @h-94: 376px; @h-screen: 100vh; @h-1: 0.25rem; @h-2-thirds: 66.666667%; @w-4: 1rem; @w-6: 1.5rem; @w-8: 2rem; @w-10: 2.5rem; @w-12: 3rem; @w-16: 4rem; @w-24: 6rem; @w-32: 8rem; @w-40: 10rem; @w-63: 252px; @w-94: 376px; /* Flexbox 和布局 */ .flex { display: flex; } .flex-col { flex-direction: column; } .flex-row { flex-direction: row; } .flex-wrap { flex-wrap: wrap; } .items-center { align-items: center; } .items-start { align-items: flex-start; } .items-end { align-items: flex-end; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .flex-grow { flex-grow: 1; } .flex-grow-0 { flex-grow: 0; } .flex-1 { flex: 1 1 0%; } .flex-nowrap { flex-wrap: nowrap; } /* 定位 */ .relative { position: relative; } .absolute { position: absolute; } .fixed { position: fixed; } .top-0 { top: 0; } .top-8 { top: 2rem; } .top-20 { top: 5rem; } .left-0 { left: 0; } .left-1\/2 { left: 50%; } .right-32 { right: 8rem; } .right-150px { right: 150px; } .bottom-0 { bottom: 0; } .bottom-5 { bottom: 1.25rem; } .bottom-7 { bottom: 1.75rem; } .bottom-12 { bottom: 3rem; } .-right-32 { right: -8rem; } .-ml-8 { margin-left: -2rem; } .-mt-6 { margin-top: -1.5rem; } .gongzhonghao-title { margin-bottom: 0.8rem; } /* 变换 - 基础工具类保留,但section使用状态类 */ .transform-none { transform: none; } .translate-y-0 { transform: translateY(0); } .translate-y-full { transform: translateY(100%); } .-translate-y-full { transform: translateY(-100%); } .-translate-y-5 { transform: translateY(-1.25rem); } .translate-y-5 { transform: translateY(1.25rem); } .translate-y-10 { transform: translateY(2.5rem); } .translate-y-20 { transform: translateY(5rem); } .translate-y-40 { transform: translateY(10rem); } .translate-y-96 { transform: translateY(24rem); } .-translate-y-20 { transform: translateY(-5rem); } /* 性能优化的动画类 */ .section-transition { transition: transform 1000ms cubic-bezier(0.25, 0.46, 0.45, 0.94); will-change: transform; } .element-fade-in { transition: opacity 800ms ease-out, transform 800ms ease-out; will-change: opacity, transform; } /* 优化GPU加速,避免不必要的层创建 */ .transform-gpu { &.animating { will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden; } &.animated { will-change: auto; } } /* 优化背景动画性能 */ .scale_rotate { animation: scale_rotate 30s linear infinite; transform-origin: 25% 25%; will-change: transform; /* 移动端禁用复杂动画以提升性能 */ @media (max-width: 768px) { animation: none; } } /* 尺寸 */ .w-full { width: 100%; } .h-full { height: 100%; } .min-h-screen { min-height: 100vh; } .min-w-screen { min-width: 100vw; } .w-auto { width: auto; } .h-auto { height: auto; } .max-w-4xl { max-width: 56rem; } .max-w-5xl { max-width: 64rem; } .max-w-team { max-width: 500px; } .h-screen { height: 100vh; } .w-63 { width: 252px; } /* 确保w-63类在响应式设计中正常工作 */ @media (max-width: 768px) { .w-63 { width: 252px; } } @media (min-width: 769px) { .w-63 { width: 252px; } } /* 新增的响应式宽度类 */ @media (min-width: 768px) { .md\:w-96 { width: 24rem; /* 384px */ } } @media (min-width: 1024px) { .lg\:w-120 { width: 30rem; /* 480px */ } } /* 合伙人页面对齐样式 */ .partner-image-container { min-height: 376px; /* 与文字内容高度匹配 */ } .partner-text-container { min-height: 376px; /* 确保文字容器高度一致 */ } @media (max-width: 768px) { .partner-image-container { min-height: 252px; max-height: 252px; } .partner-text-container { min-height: auto; max-height: 280px; overflow: hidden; } } .h-63 { height: 252px; } .w-94 { width: 376px; } .h-94 { height: 376px; } .w-8 { width: 2rem; } .h-8 { height: 2rem; } .h-20 { height: 5rem; } .w-40 { width: 10rem; } .w-12 { width: 3rem; } .h-12 { height: 3rem; } .w-16 { width: 4rem; } .h-4 { height: 1rem; } .w-24 { width: 6rem; } .h-5 { height: 1.25rem; } .w-32 { width: 8rem; } /* 颜色 */ .bg-brand { background-color: @bg-brand !important; } .bg-white { background-color: @bg-white; } .text-white { color: @text-white; } .text-black { color: #000000; } .text-gold { color: @text-gold; } .text-brand { color: @text-brand; } .text-brend { color: #2e3192; } .text-grayy { color: #666666; } .text-xxs { font-size: @text-xxs; } /* 字体 */ .text-xs { font-size: @text-xs; } .text-sm { font-size: @text-sm; } .text-base { font-size: @text-base; } .text-lg { font-size: @text-lg; } .text-xl { font-size: @text-xl; } .text-2xl { font-size: @text-2xl; } .text-fxl { font-size: @text-fxl; } .font-light { font-weight: 300; } .font-normal { font-weight: 400; } .font-black { color: black; } .font-bold { font-weight: 700; } .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } .leading-8 { line-height: 2rem; } .leading-9 { line-height: 2.25rem; } .leading-10 { line-height: 2.5rem; } .leading-loose { line-height: 2; } .leading-normal { line-height: 1.5; } /* 边距和内边距 */ .p-8 { padding: 2rem; } .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .px-8 { padding-left: 2rem; padding-right: 2rem; } .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; } .my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; text-align: left; } .my-8 { margin-top: 2rem; margin-bottom: 2rem; } .my-12 { margin-top: 3rem; margin-bottom: 3rem; } .m-auto { margin: auto; } .mt-3 { margin-top: 0.75rem; } .mt-4 { margin-top: 1rem; } .mt-5 { margin-top: 1.25rem; } .mt-6 { margin-top: 1.5rem; } .mt-8 { margin-top: 2rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-10 { margin-bottom: 2.5rem; } .mb-32 { margin-bottom: 8rem; } .mb-5 { margin-bottom: 1.25rem; } .mx-9 { margin-left: 2.25rem; margin-right: 2.25rem; } .ml-auto { margin-left: auto; } .mr-4 { margin-right: 1rem; } .my-auto { margin-top: auto; margin-bottom: auto; } /* 透明度 */ .opacity-0 { opacity: 0; } .opacity-100 { opacity: 1; } /* 显示和隐藏 */ .overflow-hidden { overflow: hidden; } .z-0 { z-index: 0; } .z-10 { z-index: 10; } .z-20 { z-index: 20; } .z-50 { z-index: 50; } /* 变换 */ .transform-gpu { will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden; } .transition-all { transition: all 0.3s ease-in-out; } .transition-colors { transition: color 0.3s ease-in-out; } .transition-transform { transition: transform 0.3s ease-in-out; } .duration-1000 { transition-duration: 1000ms; } /* 对齐 */ .align-text-bottom { vertical-align: text-bottom; } .inline-block { display: inline-block; } .block { display: block; } /* 悬停效果 */ .hover\:scale-125:hover { transform: scale(1.25); } .cursor-pointer { cursor: pointer; } /* 动画 */ @keyframes scale_rotate { 0% { transform: scale(1) rotate(0deg); opacity: 0.8; } 25% { transform: scale(1.1) rotate(90deg); opacity: 0.8; } 50% { transform: scale(1.2) rotate(180deg); opacity: 0.7; } 75% { transform: scale(1.1) rotate(270deg); opacity: 0.8; } 100% { transform: scale(1) rotate(360deg); opacity: 0.8; } } .scale_rotate { animation: scale_rotate 30s linear infinite; transform-origin: 25% 25%; will-change: transform; } @keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate-bounce { animation: bounce 2s infinite; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } /* 文字从下到上渐入动画 */ @keyframes fade-in-up { 0% { opacity: 0; transform: translateY(30px) !important; } 100% { opacity: 1; transform: translateY(0) !important; } } .fade-in-up { animation: fade-in-up 0.8s ease-out forwards !important; } /* 斜体效果 */ .incline { font-style: italic; } /* 对象适配 */ .object-cover { object-fit: cover; } /* 响应式设计 */ @media (max-width: 768px) { /* 确保非封面页内容水平垂直居中 */ section:not(:first-child) { padding: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } /* 封面页保持全屏覆盖 */ section:first-child { height: 100vh; padding: 0; } /* 封面页内容竖屏 */ .cover-content { padding: 1rem; } /* 移动端滚动状态样式保持一致 */ section.prev, section.active, section.next { display: flex !important; align-items: center !important; justify-content: center !important; } .cover-logo { width: 100px !important; height: auto; } .cover-title { margin-top: 0.5rem; margin-bottom: 1rem; } .cover-title p { font-size: 1.25rem !important; } .cover-info { font-size: 0.7rem; line-height: 1.4; } .cover-text { font-size: 0.7rem; padding: 0; } .mb-32 { margin-bottom: 2rem; } .md\:flex-row { flex-direction: column; } .md\:flex-row-reverse { flex-direction: column; } .md\:text-2xl { font-size: 1rem; } .md\:text-3xl { font-size: 1.125rem; } .md\:text-base { font-size: 0.8rem; } .md\:text-sm { font-size: 0.7rem; } .md\:text-xxs { font-size: 0.6rem; } .text-fxl { font-size: 1.125rem; } .text-lg { font-size: 0.8rem; } .md\:leading-8 { line-height: 1.4rem; } .md\:leading-15 { line-height: 1.8rem; } .md\:h-94 { height: 252px; } .md\:w-94 { width: 252px; } .md\:h-63 { height: 252px; } .md\:w-63 { width: 252px; } .md\:h-24 { height: 6rem; } .md\:w-24 { width: 6rem; } .md\:h-20 { height: 5rem; } .md\:min-h-20 { min-height: 5rem; } .md\:h-8 { height: 2rem; } .md\:w-8 { width: 2rem; } .md\:bottom-12 { bottom: 3rem; } .md\:h-2\/3 { height: 66.666667%; } .md\:right-auto { right: auto; } .md\:my-8 { margin-top: 2rem; margin-bottom: 2rem; } .md\:mb-5 { margin-bottom: 1.25rem; } .md\:mb-12 { margin-bottom: 3rem; } .md\:mt-5 { margin-top: 1.25rem; } .md\:mt-8 { margin-top: 2rem; } .md\:mr-12 { margin-right: 3rem; } .md\:ml-8 { margin-left: 2rem; } .md\:h-2\/3 { height: 66.666667%; } .md-right-auto { right: auto; } /* 使命声明页竖屏调整 */ section .z-10 { font-size: 1.125rem; line-height: 1.75rem; } /* 介绍页竖屏调整 */ .max-w-4xl { font-size: 0.875rem; line-height: 1.5rem; } .max-w-4xl .my-12 { margin-top: 1rem; margin-bottom: 1rem; } /* 封面页竖屏调整 */ .text-black { font-size: 0.875rem; } .text-white { font-size: 0.875rem; } .text-black .flex-nowrap { font-size: 1.5rem; } /* 联系我们页竖屏调整 */ .text-center .font-black { font-size: 0.7rem; line-height: 1.25rem; } .text-center .text-2xl { font-size: 1.25rem; padding: 0; } /* 合伙人页面竖屏调整 - 动态调整图片和文字尺寸 */ .partner-text p { font-size: clamp(0.875rem, 2.5vw, 1.125rem); line-height: 1.6; max-width: 90%; margin: 0.75rem auto; } .partner-text .my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; } .partner-text .md\:my-4 { margin-top: 0.75rem; margin-bottom: 0.75rem; } .partner-text .text-fxl { font-size: clamp(1.25rem, 4vw, 2rem); margin-bottom: 1.5rem; } .partner-section .partner-content { gap: 1.5rem; max-width: 95%; flex-direction: column; align-items: center; justify-content: center; margin: 0 auto; } /* 合伙人图片动态尺寸调整 */ .partner-section .partner-image { width: clamp(150px, 30vw, 220px); height: clamp(150px, 30vw, 220px); flex-shrink: 0; margin: 0 auto; } .partner-section .partner-text { min-height: auto; text-align: left; width: clamp(280px, 85vw, 500px); max-width: 90%; margin: 0 auto; } } @media (min-width: 769px) { .md\:flex-row { flex-direction: row; } .md\:flex-row-reverse { flex-direction: row-reverse; } .md\:text-2xl { font-size: 1.5rem; } } /* 横竖屏切换优化 - 强化水平居中 */ @media screen and (orientation: landscape) and (max-height: 600px) { /* 横屏时合伙人内容横向排列 */ .partner-content { flex-direction: row; gap: clamp(1rem, 4vw, 3rem); align-items: center; justify-content: center !important; /* 确保水平居中 */ max-width: 95%; margin: 0 auto !important; /* 强制水平居中 */ } .partner-text { text-align: left; max-width: 45%; margin: 0 auto; } .partner-image { flex-shrink: 0; width: clamp(120px, 25vw, 200px); height: clamp(120px, 25vw, 200px); margin: 0 auto !important; /* 确保图片也居中 */ } .partner-text p { font-size: clamp(0.75rem, 2vw, 1rem); line-height: 1.4; text-align: left; /* 文字内容左对齐 */ margin: 0 auto; } .partner-text .text-fxl { font-size: clamp(1rem, 3vw, 1.5rem); text-align: left; /* 标题左对齐 */ margin: 0 auto 1rem auto; } /* 投资案例区域优化 */ .cases-row { flex-wrap: nowrap; justify-content: center !important; /* 水平居中 */ align-items: center; } .case-item { flex: 0 1 calc(25% - 1rem); justify-content: center !important; /* 每个项目居中 */ align-items: center; margin: 0 auto; overflow: hidden; } } /* 通用容器居中优化 - 强化水平居中 */ .partner-section, .mission-section, .intro-section, .contact-section { display: flex; flex-direction: column; align-items: center !important; /* 水平居中 */ justify-content: center !important; /* 垂直居中 */ padding: 1rem; width: 100%; box-sizing: border-box; } .partner-content, .mission-content, .intro-content, .contact-content { display: flex; align-items: center !important; /* 水平居中 */ justify-content: center !important; /* 垂直居中 */ width: 100%; max-width: 95%; margin: 0 auto !important; /* 强制水平居中 */ box-sizing: border-box; } /* 确保所有文字区域水平垂直居中 - 强化版本 */ .text-center { text-align: center !important; /* 强制文字居中 */ margin: 0 auto !important; /* 强制容器居中 */ max-width: 100% !important; width: 100%; display: flex; flex-direction: column; align-items: center !important; /* 内容水平居中 */ } .text-center p { text-align: center !important; /* 强制文字内容居中 */ margin: 0 auto !important; /* 强制居中 */ max-width: 100%; } /* 投资案例响应式优化 */ .cases-row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; max-width: 100%; margin: 0 auto; padding: 1rem; } .case-item { display: flex; justify-content: center; align-items: center; margin: 0.5rem; flex: 0 1 calc(33.333% - 1rem); overflow: hidden; min-width: fit-content; } @media screen and (orientation: portrait) { .case-item { flex: 0 1 calc(50% - 1rem); overflow: hidden; } } @media screen and (orientation: landscape) and (max-height: 500px) { .case-item { flex: 0 1 calc(25% - 1rem); overflow: hidden; } /* 图片响应式优化 */ img { max-width: 100%; height: auto; object-fit: contain; } .partner-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; margin-bottom: 3rem; } .md\:mt-5 { margin-top: 1.25rem; } .md\:mt-8 { margin-top: 2rem; } .md\:mr-12 { margin-right: 3rem; } .md\:ml-8 { margin-left: 2rem; } .md\:h-2\/3 { height: 66.666667%; } .md-right-auto { right: auto; } /* 使命声明页竖屏调整 */ section .z-10 { font-size: 1.125rem; line-height: 1.75rem; } /* 介绍页竖屏调整 */ .max-w-4xl { font-size: 0.875rem; line-height: 1.5rem; } .max-w-4xl .my-12 { margin-top: 1rem; margin-bottom: 1rem; } /* 封面页竖屏调整 */ .text-black { font-size: 0.875rem; } .text-white { font-size: 0.875rem; } .text-black .flex-nowrap { font-size: 1.5rem; } /* 联系我们页竖屏调整 */ .text-center .font-black { font-size: 0.7rem; line-height: 1.25rem; } .text-center .text-2xl { font-size: 1.25rem; } /* 合伙人页面竖屏调整 */ .partner-text p { font-size: 0.875rem; /* 增大字体 */ line-height: 1.5rem; /* 增大行高 */ } .partner-text .my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; } .partner-text .md\:my-4 { margin-top: 1rem; margin-bottom: 1rem; } .partner-text .text-fxl { font-size: 1.5rem; /* 增大标题字体 */ } .partner-section .partner-content { gap: 2rem; /* 增大间距 */ max-width: 90%; /* 限制最大宽度,确保居中 */ } .partner-section .partner-image { width: 220px; /* 适当增大图片 */ height: 220px; } .partner-section .partner-text { min-height: 220px; } } /* 横屏模式下的合伙人页面优化 */ @media (min-width: 769px) { .partner-section { padding: 2rem; min-height: 100vh; } .partner-section .partner-content { max-width: clamp(700px, 85vw, 1000px); gap: clamp(2rem, 4vw, 5rem); align-items: center; justify-content: center; } .partner-section .partner-image { width: clamp(250px, 30vw, 350px); height: clamp(250px, 30vw, 350px); flex-shrink: 0; } .partner-text { text-align: left; max-width: 45%; margin: 0 auto; } .partner-text p { font-size: clamp(1rem, 2.5vw, 1.25rem); /* 横屏时动态字体大小 */ line-height: 1.6; text-align: left; } .partner-text .text-fxl { font-size: clamp(1.5rem, 4vw, 2.25rem); text-align: left; line-height: 10px; } .partner-text-1 { line-height: 35px; font-size: 1.5rem; } .partner-text .md\:my-4 { margin-top: clamp(1rem, 2vw, 1.5rem); margin-bottom: clamp(1rem, 2vw, 1.5rem); } } /* 主容器 */ .max-bg { width: 100%; height: 100vh; overflow: hidden; background-color: @bg-brand; } /* 背景动画容器 */ .movement { position: relative; } /* 文字阴影 */ .text-shadow { text-shadow: -0.15em -0.15em 0 #ecc129; } /* 宽度响应式 */ @media (max-width: 768px) { .max-w-4xl { max-width: 100%; padding: 0 1rem; } } /* 自定义滚动条隐藏 */ .max-bg { -ms-overflow-style: none; scrollbar-width: none; } .max-bg::-webkit-scrollbar { display: none; } /* 自定义类名 */ .CoverSlide_logo__2K2qV { display: inline-block; } .CoverSlide_opacityContent__3oJ1x { color: white; user-select: none; } /* 封面页动画元素 */ .cover-logo-container { transition: transform 0.8s ease-out, opacity 0.8s ease-out; } .cover-logo-container.animate-in { opacity: 1 !important; transform: translateY(0) !important; } .cover-title { transition: transform 0.8s ease-out, opacity 0.8s ease-out; } .cover-title.animate-in { opacity: 1 !important; transform: translateY(0) !important; } /* 修正类选择器 */ .absolute .right-0, .absolute.right-0 { right: 0; } .md\:h-2-thirds { height: 66.666667%; } .md-h-2-thirds { height: 66.666667%; } /* 页面滚动状态管理 */ section { transition: transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); } /* 滚动状态管理 - 使用更高特异性选择器 */ section.prev { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100vh !important; display: flex !important; align-items: center !important; justify-content: center !important; transform: translateY(-100%) !important; } section.active { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100vh !important; display: flex !important; align-items: center !important; justify-content: center !important; transform: translateY(0) !important; } section.next { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100vh !important; display: flex !important; align-items: center !important; justify-content: center !important; transform: translateY(100%) !important; } /* 合伙人页面样式 - 修复显示和居中 */ .partner-section { display: flex; align-items: center; justify-content: center; background-color: @bg-white; padding: 2rem 1rem; min-height: 100vh; width: 100%; box-sizing: border-box; .partner-content { max-width: clamp(600px, 90vw, 1000px); width: 100%; display: flex; align-items: center; justify-content: center; gap: clamp(2rem, 5vw, 4rem); margin: 0 auto; } .partner-image { width: clamp(200px, 25vw, 300px); height: clamp(200px, 25vw, 300px); flex-shrink: 0; img { width: 100%; height: 100%; object-fit: contain; } } .partner-text { flex: 1; min-height: clamp(200px, 25vw, 300px); display: flex; flex-direction: column; justify-content: center; text-align: left; max-width: 90%; margin: 0 auto; } } @media (min-width: 769px) { .partner-section .partner-image { width: 376px; height: 376px; } .partner-section .partner-text { min-height: 376px; } } /* 引用标记动画 - 增强动画效果 */ .quote-mark { display: inline-block; opacity: 0; transition: all 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); } /* 初始状态 */ .quote-left { transform: translateY(-60px); } .quote-right { transform: translateY(60px); } /* 动画状态 - 左引号从上往下,右引号从下往上 */ .quote-mark.animate-in { opacity: 1 !important; } .quote-left.animate-in { transform: translateY(0); animation: quoteLeftSlide 1.2s ease-out; } .quote-right.animate-in { transform: translateY(0); animation: quoteRightSlide 1.2s ease-out; } /* 动画关键帧 */ @keyframes quoteLeftSlide { 0% { transform: translateY(-60px); opacity: 0; } 60% { transform: translateY(-10px); opacity: 0.8; } 100% { transform: translateY(0); opacity: 1; } } @keyframes quoteRightSlide { 0% { transform: translateY(60px); opacity: 0; } 60% { transform: translateY(10px); opacity: 0.8; } 100% { transform: translateY(0); opacity: 1; } } @media screen and (orientation: portrait) and (max-width: 480px) { /* 小屏竖屏特殊优化 */ body { overflow: auto; margin: 0; display: flex; justify-content: center; /* 主体水平居中 */ } #app { padding: 0; margin: 0 auto !important; /* 强制居中 */ width: 100%; display: flex; flex-direction: column; justify-content: center; /* 内容垂直居中 */ } .cases-content { padding: 60px 5px !important; } .case-title { padding: 0; } /* 合伙人文字进一步放大并居中 */ .partner-text p { font-size: 1rem; line-height: 1.4rem; padding: 0 1rem; text-align: left !important; /* 强制文字居中 */ margin: 0.75rem auto !important; /* 居中边距 */ max-width: 100%; } /* 线条滚动触发动画样式 */ .line-static { width: 60px !important; } .line-animated.animate-in { width: 60px !important; } .line-container { margin-top: 3px; width: 60px !important; } .partner-text .text-fxl { // font-size: 1.6rem; height: 20px; line-height: 20px; text-align: left !important; /* 强制标题居中 */ margin: 5px auto 0 auto !important; padding-bottom: 10px; /* 居中边距 */ } /* 初始状态 */ .quote-left { transform: translateY(-30px); } .quote-right { transform: translateY(30px); } .partner-section .partner-content { max-width: clamp(700px, 85vw, 1000px); gap: 0 !important; align-items: center; justify-content: center; } .partner-section .partner-image { margin-top: 0; padding: 0; width: clamp(200px, 25vw, 300px); height: clamp(200px, 25vw, 300px); flex-shrink: 0; } /* 封面页优化并居中 */ .cover-title p { font-size: 1.4rem !important; text-align: center !important; /* 强制居中 */ margin: 0 auto !important; } .cover-info { font-size: 0.8rem; text-align: center !important; /* 强制居中 */ margin: 0 auto !important; } /* 使命声明页优化并居中 */ section .z-10 { font-size: 1.2rem; line-height: 1.8rem; text-align: center !important; /* 强制居中 */ margin: 0 auto !important; /* 强制居中 */ max-width: 100%; } /* 介绍页优化并居中 */ .max-w-4xl { font-size: 1rem; line-height: 1.6rem; text-align: center !important; /* 强制居中 */ margin: 0 auto !important; /* 强制居中 */ max-width: 95%; } } .line-static { position: absolute; top: 0; left: 0; height: 4px; } /* 线条滚动触发动画样式 */ .line-animated { width: 0; transition: width 0.8s ease-in-out; .line-static(); } .line-animated.animate-in { width: 73px; transition: width 0.8s ease-in-out; .line-static(); } .line-container { position: relative; height: 4px; width: 73px; } /* 文字动画效果 - 确保所有文字都有动画 */ .text-animate { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; } .text-animate.animate-in { opacity: 1; transform: translateY(0); transition: opacity 0.8s ease-out, transform 0.8s ease-out; } /* 投资案例页面样式 */ .cases-content { padding: 60px 20px; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; /* 移除min-height,让flex容器控制高度 */ } .cases-grid { display: flex; flex-direction: column; gap: 2rem; width: 100%; max-width: 900px; } .cases-row { display: flex; justify-content: space-between; align-items: center; gap: 2rem; transition: opacity 0.8s ease-out, transform 0.8s ease-out; } .cases-row-2 { justify-content: center; } .cases-row.animate-in { opacity: 1 !important; transform: translateY(0) !important; } .case-item { flex: 1; display: flex; align-items: center; justify-content: center; transition: transform 0.3s ease; min-width: fit-content; } .case-item:hover { transform: scale(1.25); } .case-item img { max-width: 120px; max-height: 60px; width: auto; height: auto; object-fit: contain; transition: transform 0.3s ease; } /* 确保投资案例页面有足够的高度显示内容 */ section:nth-child(6) { /* 投资案例页是第6个section */ min-height: fit-content; padding: 2rem 0; } /* 使命声明页样式 */ .mission-text { line-height: 50px; padding: 0; } .mission-line { line-height: 1.5; margin-left: 0.5rem; } /* 介绍页样式 */ .intro-text { text-align: center; } .intro-paragraph { line-height: 1.8; } @media (max-width: 768px) { /* 使命声明页竖屏 */ .mission-text { font-size: 1.125rem; line-height: 1.5; } .mission-line { margin-bottom: 0.5rem; } .mission-section .mt-4 { margin-top: 0.5rem; } /* 介绍页竖屏 */ .intro-text { font-size: 0.875rem; line-height: 1.5; } .intro-paragraph { margin-top: 0.75rem; margin-bottom: 0.75rem; } } @media (min-width: 769px) { .mission-text { line-height: 50px; } .intro-text { text-align: left; } } /* 图片动画 */ .partner-img-animation { transition: transform 0.8s ease-out, opacity 0.8s ease-out; } .partner-img-animation.animate-in { opacity: 1 !important; transform: translateY(0) !important; }