.block2 .title { text-align: center; padding-top: 57px; padding-bottom: 68px; } .block2 .title p { font-size: 42px; line-height: 88px; color: #292b33; } .block2 .title div { font-size: 16px; color: #474b59; line-height: 1.3; margin-top: 3px; } .block2 { padding-bottom: 100px; } .block2 .w1400 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .block2 .w1400 .list { width: calc(430/1400*100%); margin-bottom: 60px; margin-left: calc(55/1400*100%); } .block2 .w1400 .list:nth-child(3n+1) { margin-left: 0; } .block2 .w1400 .list:hover .img img { -webkit-transform: scale(1.1); transform: scale(1.1); } .block2 .w1400 .list a { display: block; overflow: hidden; } .block2 .w1400 .list .img { font-size: 0; } .block2 .w1400 .list .img img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all .3s; transition: all .3s; } .block2 .w1400 .list .listTitle { font-size: 22px; color: #1a1a1a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.5; margin-top: 26px; } .block2 .w1400 .list span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 10px; font-size: 16px; color: #919396; line-height: 1.5; } .block2 .w1400 .list span a { display: block; color: #4c4d4e; } .block2 .w1400.contact { padding: 49px 100px; background-color: #ebf0f9; border-radius: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .block2 .w1400.contact .left { display: -webkit-box; display: -ms-flexbox; display: flex; } .block2 .w1400.contact .left .img { width: 82px; height: 82px; background-color: #0042ff; border-radius: 2px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; margin-right: 54px; } .block2 .w1400.contact .left .img img { margin: 0 auto; } .block2 .w1400.contact .left .cont { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .block2 .w1400.contact .left .cont p { font-size: 38px; letter-spacing: 2px; color: #1a1a1a; margin-top: -8px; } .block2 .w1400.contact .left .cont div { font-size: 16px; letter-spacing: 1px; color: #666666; } .block2 .w1400.contact .btn { font-size: 16px; color: #fff; letter-spacing: 1px; width: 220px; line-height: 50px; background-color: #0042ff; border-radius: 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .block2 .w1400.contact .btn img { margin-right: 12px; -webkit-filter: grayscale(100%) brightness(1000%); filter: grayscale(100%) brightness(1000%); } @media (max-width: 996px) { .block2 { padding-bottom: 50px; } .block2 .w1400 { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .block2 .w1400 .list { width: 49%; margin-left: 0; } .block2 .w1400.contact { display: none; } } @media (max-width: 750px) { .block2 .title { padding: 30px 0; } .block2 .title p { font-size: 7vw; line-height: 2; } .block2 .title div { font-size: 3.5vw; } .block2 .w1400 .list { width: 100%; margin-bottom: 30px; } .block2 .w1400 .list .img img { width: 100%; height: auto; } .block2 .w1400 .list .listTitle { font-size: 4.5vw; } .block2 .w1400 .list span { font-size: 3.5vw; } .block2 .w1400 .list span a { font-size: 3.5vw; } }