.contact-list{display:flex;flex-wrap:wrap;justify-content: space-between;background:#F5F5F5;padding:3%;}
.contact-list .contact-item{width:24%;text-align: center;background:#fff;border-radius: 10px;padding:20px;}
.contact-list .contact-item .icon{width:80px;height:80px;background:#666;border-radius: 50%;display:flex;justify-content: center;align-items: center;margin:0 auto;}
.contact-list .contact-item .icon em{color:#fff;font-size:30px;transition: all .3s;}
.contact-list .contact-item:hover .icon em{transform: rotateY(360deg);}
.contact-list .contact-item .tit{font-weight:var(--fontbold7);margin:20px 0 10px;font-size:22px;}
.contact-list .contact-item a:hover{color:var(--color)}
@media (max-width:768px){.contact-list .contact-item{width:49%;margin:1% 0;}
.contact-list .contact-item .icon{width:60px;height:60px;}
.contact-list .contact-item .icon em{font-size:22px;}
.contact-list .contact-item .tit{font-size:20px;}}
@media (max-width:768px){.contact-list .contact-item{width:100%}}