.head ul { position: relative; } .head ul .to_li { position: absolute; display: block; width: 40px; height: 5px; background: #C70009; border-radius: 49px 21px 0px 0px; bottom: -34px; left: 22.5%; } .fen { width: 81.25rem; margin: 0 auto; } .fen .title { font-size: 30px; font-family: Source Han Sans, Source Han Sans; font-weight: 900; color: #3D3D3D; line-height: 56px; display: flex; align-items: center; margin-top: 46px; } .fen .title::before { content: ""; display: inline-block; width: 6px; height: 56px; margin-right: 20px; background-color: #C70009; } .fen .type { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; align-content: space-between; } .fen .type div { width: 22%; margin-top: 42px; border-radius: 10px 10px 10px 10px; border: 1px solid rgba(30, 43, 95, 0.2); transition: all linear 500ms; } .fen .type div p { text-align: center; } .fen .type div p:first-child { padding-top: 25px; font-size: 24px; font-family: Source Han Sans, Source Han Sans; font-weight: 900; color: #000000; line-height: 35px; } .fen .type div p:last-child { padding-bottom: 34px; font-size: 16px; font-family: Source Han Sans, Source Han Sans; font-weight: 500; color: #000000; line-height: 23px; margin-top: 8px; } .fen .type div:hover { background: url(../../imgs/product/bg1.jpg) center center no-repeat, rgba(21, 31, 62, 0.74); background-size: 100% 100%; box-shadow: 14px 11px 80px 5px #d7d7d7; } .fen .type div:hover p { color: #FFFFFF; }