.investGroup { width: 100%; height: 50rem; padding: 6.25rem 16.25rem; background: rgba(0, 39, 83, 0.7); .investGroupContent { color: #FFFFFF; height: 28.75rem; .investGroupContentItems { display: flex; height: 28.75rem; .investGroupContentItem:first-child { padding-right: 6.25rem; } .investGroupContentItem:last-child { padding-left: 6.25rem; } .investGroupContentItem { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2.5rem; &:last-child { border-right: none; } border-right: .0625rem solid rgba(255, 255, 255, .5); .investGroupContentItemTitle { font-size: 2.5rem; } .investGroupContentItemContent { font-weight: 400; font-size: 1rem; color: #FFFFFF; line-height: 1.875rem; text-align: justify; font-style: normal; text-transform: none; } } } } } .equityInvestment { width: 100%; padding: 6.25rem 16.25rem; background: rgba(255, 255, 255, 0.6); .equityInvestmentItems { /* 5列布局 */ display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.25rem 2.5rem; .equityInvestmentItem { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.25rem; .equityInvestmentItemLogo { width: 16.5rem; height: 9.8125rem; object-fit: cover; } } } } .industryFoster { width: 100%; height: calc(100vh / var(--zoom-compensation, 1)); display: flex; align-items: center; position: relative; .bgMask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(20,53,92,0.1); } .industryFosterMask { width: 34.125rem; min-height: 25rem; background: rgba(20, 53, 92, 0.5); color: #fff; padding: 3.75rem 3.125rem; .industryFosterMaskTitle { font-weight: 500; font-size: 2.5rem; color: #FFFFFF; line-height: 3.125rem; text-align: left; font-style: normal; text-transform: none; margin-bottom: 1.875rem; } .industryFosterMaskContent { font-weight: 400; font-size: 1.125rem; color: #FFFFFF; line-height: 2.125rem; text-align: justify; font-style: normal; text-transform: none; } } } @media (max-width: 48rem) { .investGroup { height: auto; padding: 4rem 2rem; } .investGroup .investGroupContent .investGroupContentItems { flex-direction: column; height: auto; gap: 2rem; .investGroupContentItem { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.3); padding: 2rem 0 !important; } .investGroupContentItem:last-child { border-bottom: none; } } .equityInvestment { padding: 4rem 2rem; } .equityInvestment .equityInvestmentItems { grid-template-columns: repeat(3, 1fr); gap: 1rem; } .equityInvestment .equityInvestmentItems .equityInvestmentItem .equityInvestmentItemLogo { width: 100%; height: auto; } .industryFoster { height: auto; padding: 4rem 2rem; } .industryFoster .industryFosterMask { width: 100%; min-height: auto; padding: 2rem; } .industryFoster .industryFosterMask .industryFosterMaskTitle { font-size: 1.75rem; } } @media (max-width: 30rem) { .investGroup { padding: 3rem 1.25rem; } .equityInvestment { padding: 3rem 1.25rem; } .equityInvestment .equityInvestmentItems { grid-template-columns: repeat(2, 1fr); } .industryFoster { padding: 3rem 1.25rem; } .industryFoster .industryFosterMask { padding: 1.5rem; } .industryFoster .industryFosterMask .industryFosterMaskTitle { font-size: 1.5rem; } .investGroup .investGroupContent .investGroupContentItems .investGroupContentItem .investGroupContentItemTitle { font-size: 1.75rem; } }