.main-con .top-wrap{ background: url("../images/case/succed_bg.png") no-repeat; width: 100%; height: 202px; line-height: 202px; color: #ffffff; text-align: center; } .main-con .bottom-wrap{ background:#ebebed url("../images/case/bg3-1.png") no-repeat; width: 100%; height: inherit; } .main-con .bottom-wrap .container-content{ width: 1200px; margin: 0 auto; } .content3-title{ font-size: 50px; font-weight: bold; color: #FFFFFF; } .content3-title span{ font-size: 30px !important; font-weight: 400; color: #FFFFFF; position: relative; } .content3-title span::before{ content: ""; position: absolute; width: 83px; height: 4px; border-radius: 2px; top: -8px; } .main-con .bottom-wrap ul { width: 100%; overflow: hidden; } .main-con .bottom-wrap li{ float: left; text-align: center; cursor: pointer; width: calc(100% / 9); position: relative; font-size: 18px; font-weight: normal; color: #030418; padding: 15px 0; margin: 30px 0; } .main-con .bottom-wrap li::after{ content: ""; position: absolute; top: 0; left:calc(50% - 20px); width: 40px; border-top: 4px solid unset; } .main-con .bottom-wrap li.active::after{ border-top: 4px solid #168EF4; } .main-con .content3-content-item{ overflow: hidden; display: none; } .main-con .content3-content-item.active{ display: block; } .main-con .content3-content-item .img-logo-item{ position: relative; text-align: center; padding-top: 10px; float: left; margin-left: 20px; margin-bottom: 20px; width: 265px; height: 130px; box-sizing: border-box; background-color: #fff; border: 2px solid transparent; border-radius: 4px; } .main-con .content3-content-item .img-logo-item .title{ font-size: 14px; } .main-con .content3-content-item .img-logo-item:hover { box-shadow: 0px 0px 23px 3px rgba(130, 131, 132, 0.34); } .main-con .content3-content-item .img-logo-item img{ display: block; height: 28px; margin: 15px auto; }