.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: 93.4%; } .contact_cont { width: 100%; margin-top: 23px; } .contact_cont .content { width: 81.25rem; margin: 0 auto; overflow: hidden; } .contact_cont .content div { background-color: #F7F7F9; border-radius: 10px; overflow: hidden; margin-top: 22px; transition: all linear 800ms; } .contact_cont .content div:hover { background: url(../../imgs/contact/bg.jpg) center center no-repeat; background-size: 100% 100%; box-shadow: 27px 21px 44px 0px rgba(24, 35, 80, 0.18); } .contact_cont .content div:hover .one { color: #FCD106; } .contact_cont .content div:hover .one::after { background-color: #FCD106; } .contact_cont .content div:hover .two, .contact_cont .content div:hover .thr, .contact_cont .content div:hover .fou { color: #DFDFDF; } .contact_cont .content div:hover .two span, .contact_cont .content div:hover .thr span, .contact_cont .content div:hover .fou span { color: #FCD106; } .contact_cont .content div:hover .two { margin-top: 30px; } .contact_cont .content div:hover .two::before { content: ""; display: inline-block; width: 18px; height: 20px; background: url(../../imgs/contact/addr_yellow.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; } .contact_cont .content div:hover .thr::before { content: ""; display: inline-block; width: 16px; height: 20px; background: url(../../imgs/contact/tel_yellow.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; } .contact_cont .content div:hover .fou::before { content: ""; display: inline-block; width: 20px; height: 19px; background: url(../../imgs/contact/mail_yellow.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; } .contact_cont .content div p { width: 1162.98px; margin: 0 auto; } .contact_cont .content div .one { font-size: 24px; font-family: Source Han Sans, Source Han Sans; font-weight: 700; color: #C70009; line-height: 40px; margin-top: 20px; } .contact_cont .content div .one::after { content: ""; width: 73px; height: 2px; display: block; background-color: #C70009; margin-top: 10px; } .contact_cont .content div .two, .contact_cont .content div .thr, .contact_cont .content div .fou { font-size: 18px; font-family: Source Han Sans, Source Han Sans; font-weight: 500; color: #787878; line-height: 40px; } .contact_cont .content div .two span, .contact_cont .content div .thr span, .contact_cont .content div .fou span { font-size: 20px; font-weight: 600; color: #C70009; } .contact_cont .content div .two { margin-top: 30px; } .contact_cont .content div .two::before { content: ""; display: inline-block; width: 18px; height: 20px; background: url(../../imgs/contact/addr_red.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; } .contact_cont .content div .thr::before { content: ""; display: inline-block; width: 16px; height: 20px; background: url(../../imgs/contact/tel_red.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; } .contact_cont .content div .fou { padding-bottom: 24px; } .contact_cont .content div .fou::before { content: ""; display: inline-block; width: 20px; height: 19px; background: url(../../imgs/contact/mail_red.png) center center no-repeat; background-size: 100%; margin-top: 4px; margin-right: 16px; }