.chipAgent-section{ width: 100%; height: 70vh; background: #fbfbfb; } .chipAgent-section-bg{ width: 98%; height: 100%; background-image: url(../imgs/case/casebg.png); background-size: 100% 100%; background-repeat: no-repeat; margin: 0 auto; background-position: top center; } .chipAgent-section-content{ width: 43%; height: 80%; padding-top: 6vw; padding-left: 10vw; } .chipAgent-section-content h3{ font-size: 4vw; font-weight: 300; color: #fff; letter-spacing: 0.15vw; } .chipAgent-section-content p{ font-size: 1.58vw; font-weight: 400; color: rgba(255, 255, 255, 0.9); line-height: 3vw; letter-spacing: 0.1vw; margin-top: 2vw; text-align: justify; } /* ----------------技术支持 */ .case-section { position: relative; width: 100%; min-height: 110vh; background: #fff; overflow: hidden; z-index: 5; border-radius: 0 0 80px 80px; } .case-section-bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url('../imgs/case/bg.png') no-repeat center center; background-size: cover; } .case-list{ margin: 0 auto; width: 85%; height: 100%; display: flex; justify-content: space-around; padding-top: 8vw; } .case-item{ width: 24vw; height: 30vw; background: #F0F1F6; border-radius: 20px 20px 40px 20px; display: flex; flex-direction: column; align-items: center; box-shadow: 5px 5px 10px 3px rgba(0, 0, 0, 0.3); padding: 1vw; } .case-item-img{ width: 100%; height: 50%; /* background: palegoldenrod; */ display: flex; align-items: center; justify-content: center; } .case-item-img img{ width: 8vw; height: auto; } .case-item-title{ width: 100%; height: 45%; } .case-item-title h4{ font-size: 1.5vw; font-weight: 400; color: #00A0D2; text-align: center; } .case-item-title p{ margin: 0 auto; width: 81%; font-size: 1vw; font-weight: 400; color: #333; text-align: left; margin-top: 2vh; text-align: justify; } .arrow-box{ width: 100%; /* height: 10vh; */ /* background: palegoldenrod; */ display: flex; align-items: center; justify-content: flex-end; padding-right: 1.5vw; margin-bottom: 2vh; } .arrow2{ width: 3vw; height: 3vw; background: #00A0D2; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s ease; } .arrow2 img{ width: 1vw; height: auto; } .arrow2:hover{ background: #fff; border: 1px solid #00A0D2; } .arrow2:hover img{ filter: brightness(0) saturate(100%) invert(41%) sepia(99%) saturate(749%) hue-rotate(162deg) brightness(97%) contrast(101%); transition: all 0.3s ease; }