.social-wrap{ margin-bottom: 0.5rem; overflow: hidden; } .social-box{ width: 100%; position: relative; display: flex; justify-content: flex-end; margin: 0.5rem 0; } .social-box-right { justify-content: flex-start; } .social-box-right .social-box-content { padding-right: 5.62rem; /*padding-left: 2.77rem;*/ padding-left: calc((100vw - 16rem) / 2); } .social-box-right .social-box-img{ right: 0; left: auto; } .social-box-img { width: 45%; height: 6.6rem; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .social-box-img img { width: 100%; height: 100%; object-fit: cover; } .social-box-content{ width: 80%; min-height: 8rem; background: rgba(255, 255, 255, 0.3900); box-shadow:0 0rem 0.2rem 0.05rem rgba(0, 0, 0, 0.1); padding: 0.7rem 0; padding-left: 5.62rem; padding-right: 2.77rem; display: flex; flex-direction: column; justify-content: center; } .social-box-text{ font-size: 0.28rem; font-family: Microsoft YaHei; font-weight: bold; line-height: 0.5rem; color: #333333; } .social-box-p{ font-size: 0.2rem; font-family: Microsoft YaHei; font-weight: 400; line-height: 0.36rem; color: #333333; margin-top: 0.8rem; text-align: justify; } .social-brief{ margin: 1rem 0; position: relative; } .social-brief-img{ width: 100%; } .social-brief-img img{ width: 100%; height: auto; } .social-brief-box{ width: 6.83rem; position: absolute; left: 45%; top: 1.33rem; } .social-brief-text{ font-size: 0.28rem; font-family: Microsoft YaHei; font-weight: bold; line-height: 0.5rem; color: #333333; } .social-brief-p{ font-size: 0.2rem; font-family: Microsoft YaHei; font-weight: 400; line-height: 0.36rem; color: #333333; margin-top: 0.6rem; } @media only screen and (max-width: 1024px) { .social-wrap{ padding: 0 0.25rem; } .social-box{ display: block; } .social-box-content{ min-height: auto; width: 100%; padding: 0.4rem 0.25rem; } .social-box-img{ width: 100%; height: auto; transform: none; position: initial; top: 0; left: 0; } .social-box-text{ /* margin-top: 0.5rem; */ padding: 0.4rem 0; } .social-box-text{ margin-top: 0; } .social-box-p{ margin-top: 0; } .social-brief-box{ padding: 0.4rem 0.2rem; width: 100%; position: inherit; left: 0; top: 0; } .social-brief{ margin: 0.5rem 0; } .social-brief-text{ padding: 0.4rem 0; } .social-brief-p{ margin-top: 0; } .social-box-right .social-box-content{ padding: 0.4rem 0.25rem; } /*鏂板*/ .social-box-text{ font-size: 0.3rem; padding: 0.2rem 0; } .social-box-p{ font-size: 0.26rem; line-height: 0.41rem; } .social-brief-text{ font-size: 0.3rem; padding: 0.2rem 0; } .social-brief-p{ font-size: 0.26rem; line-height: 0.41rem; } /*绉诲姩绔?/ }