/* feature-module 模块 */ .feature-module { width: 100%; max-width: 1300px; margin: 40px auto; overflow: hidden; background-color: #fff; } .feature-inner { display: flex; align-items: stretch; gap: 15px; padding: 15px; /* 让外框与内容留出安全距离 */ } /* 左侧文字区域 */ .feature-text { flex: 0 0 50%; padding: 20px; } .feature-text h2 { color: #116598; font-size: 28px; font-weight: 400; margin: 0 0 16px; } .feature-text p { color: #808080; font-size: 16px; line-height: 1.5; margin: 0; } .feature-divider { width: 32px; height: 3px; background-color: #116598; border-radius: 2px; margin: 12px 0 16px 0; } /* 右侧图片区域(背景图) */ .feature-media { flex: 0 0 40%; border-radius: 15px; background: url('../images/tgrdfrfed.jpg'); background-size: cover; /* 保持比例,填充容器 */ background-position: center; background-repeat: no-repeat; min-height: 280px; /* 保证在文本较少时也有可视高度 */ } /* 响应式:小屏幕上下布局 */ @media (max-width: 768px) { .feature-inner { flex-direction: column; } .feature-text { flex: 1 1 auto; padding: 16px; } .feature-media { flex: 1 1 auto; min-height: 220px; } }