.chipAgent-section{ width: 100%; height: 70vh; background: #fbfbfb; } .chipAgent-section-bg{ width: 98%; height: 100%; background-image: url(../imgs/cloud/topbg.png); background-size: 100% 100%; background-repeat: no-repeat; margin: 0 auto; background-position: top center; } .chipAgent-section-content{ width: 80%; height: 80%; padding-top: 5vw; padding-left: 10vw; } .chipAgent-section-content h3{ font-size: 4vw; font-weight: 300; color: #fff; letter-spacing: 0.15vw; } .chipAgent-section-content p{ width: 58%; font-size: 1.4vw; font-weight: 400; color: rgba(255, 255, 255, 0.9); line-height: 3vw; letter-spacing: 0.1vw; margin-top: 2vw; text-align: justify; } /* --------------------云计算服务器设计生产制造销售 */ .cloudComputingServer-section{ width: 100%; height:150vh; background: #fbfbfb; margin-top: 20vh; } .cloudComputingServer-section-bg{ width: 98%; height: 100%; background-image: url(../imgs/cloud/cloundbg.png); background-size: 100% 100%; background-repeat: no-repeat; margin: 0 auto; background-position: top center; position: relative; } .cloudComputingServer-section-bg h3{ font-size: 5vw; font-weight: 300; color: #1F589B; letter-spacing: 0.15vw; margin-top: 5vw; position: absolute; top:-10vw; left: 10vw; } .cloudComputingServer-section-list{ width: 98%; height: 100%; margin: 0 auto; padding-top: 10vw; display: flex; flex-wrap: wrap; padding-left: 5vw; } .cloudComputingServer-section-list li{ width: 25vw; height: 28vw; background: #F0F1F6; margin-left: 4vw; border-radius: 20px 20px 40px 20px; box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.1); padding: 1vw; } .cloudComputingServer-section-list li img{ width: 100%; height: auto; } .cloudComputingServer-section-list li div{ width: 100%; margin-top: 2vh; } .cloudComputingServer-section-list li div h4{ font-size: 1.3vw; font-weight: 400; color: #009FD0; text-align: center; } .cloudComputingServer-section-list li div p{ width: 80%; font-size: 1vw; font-weight: 400; color: #000; margin: 0 auto; text-align: left; /* padding: 0px 1.5vw; */ margin-top: 2vh; line-height: 2vw; } /* ---------服务器定制化服务------------------------- */ .chipAgent-section3{ width: 100%; height: 100vh; z-index: 5; position: relative; background: #fbfbfb; border-radius: 0px 0px 80px 80px; padding-top: 5vw; } .chipAgent-section3-bg { width: 100%; height: 100%; background-image: url(../imgs/chip/bg.png); background-size: cover; /* 改为 cover */ background-repeat: no-repeat; margin: 0 auto; background-position: -8vw center; overflow: hidden; position: relative; /* 添加定位 */ z-index: 10; } .chipAgent-section3-bg h2{ width: 90%; font-size: 4vw; color: #1F599B; margin-top: 1vh; letter-spacing: 0.6vw; font-weight: 300; padding-left: 5vw; z-index: 2; padding-left: 6vw; } .chip-agent-underline { position: absolute; top: 4.7vw; left: 1vw; width: 90%; height: 2vw; margin: 0.5vw 0 0 0; background: linear-gradient( 90deg, #f7fcfe 8%, #e3f6fd 20%, #e3f6fd 30%, #f7fcfe 50% ); z-index: -1; } .chipAgent-section3-content{ width: 100%; height: 100%; margin: 0 auto; padding-top: 5vw; display: flex; justify-content: left; } .chipAgent-section3-content-left{ width: 40%; text-align: right; padding-right: 5vw; } .chipAgent-section3-content-left img{ width: 68%; height: auto; } .chipAgent-section3-content-right{ width: 50%; padding-left: 5vw; /* background: palegoldenrod; */ } .chipAgent-section3-content-right p{ font-size: 1.5vw; font-weight: 400; letter-spacing: 0.1vw; margin-top: 2vw; line-height: 3vw; } .content-contactUs{ width: 100%; height: 18vh; margin-top: 5vw; display: flex; align-items: center; justify-content: right; } .content-emailBox{ width: 16vw; height: 5vw !important; height: auto; padding: 1vw 2vw; display: flex; align-items: center; justify-content: right; background: linear-gradient(90deg, #36c6f0 0%, #1a6dc5 100%); border-radius: 54px; transition: box-shadow 0.2s, background 0.3s,transform 0.2s; justify-content: right; } .content-emailBox span{ font-size: 1.5vw; font-weight: 400; letter-spacing: 0.1vw; margin-right: 1vw; color: #fff; } .content-email{ width: 3vw; height: 3vw; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .content-email img{ width: 50%; height: 50%; } .content-emailBox:focus .content-email, .content-emailBox:hover .content-email { background: #e6f7ff; box-shadow: 0 0 0 4px rgba(54,198,240,0.15); transform: scale(1.12) rotate(-6deg); } .content-emailBox:focus, .content-emailBox:hover { box-shadow: 0 8px 24px rgba(26, 109, 197, 0.22); background: linear-gradient(100deg, #4fd7fa 0%, #2a7be0 100%); transform: translateY(-2px) scale(1.03); }