.container { // max-width: 1200px; /* max-width: 1200px; */ display: flex; // width: 100%; /* height: 100%; */ flex-wrap: wrap; min-height: auto; align-items: center; justify-content: space-between; // margin: 0 169px; // padding: 0 169px ; // margin: auto; } .container-row { // width: 100%; width: 32%; height: auto; // background-color: #5cf; } // @media (max-width: 600px) { // .container-row { // width: 50%; // } // } html, body { margin: 0; scroll-behavior:smooth; } .home { .home-back { width: 100%; position: relative; .home-head{ width: 100%; position: absolute; left: 0; top: 0; // background-color: #1a1; height: 80px; padding: 0 5%; display: flex; align-items: center; justify-content: space-between; color: #fff; .home-right{ &>span{ padding: 10px 20px; cursor: pointer; &>a{ color: #fff; } } } } } .home-title { font-size: 18px; font-weight: 400; text-align: center; &-sub { text-align: center; font-size: 12px; font-weight: 400; margin: 20px 0; color: #888888; } } .home-qa { padding: 50px 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; .home-qa-img-row { // margin-top: 20px; // padding: 0 200px; margin: 0 auto 10px; // margin: 103px 169px 0; // width: 100%; width: 60%; .home-qa-img-row-item { // max-width: 490px; position: relative; &>img { width: 100%; height: 100%; } .home-qa-img-row-item-absolute { position: absolute; top: 0; left: 0; width: 100%; height: 100%; // padding: 32px 24px; color: #fff; display: flex; flex-direction: column; justify-content: space-around; .home-qa-img-row-item-absolute-title { font-size: 18px; font-weight: bold; &>span { font-size: 20px; } } .home-qa-img-row-item-absolute-subtitle { // height: 100%; font-size: 16px; font-weight: 400; } } } } } .home-ad { background-color: #f3f5fe; padding: 50px; // padding-top: 50px; // padding-bottom: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center; .home-ad-row { width: 60%; margin: 0 auto; margin-top: 30px; display: flex; flex-wrap: wrap; justify-content: space-between; .home-row-single { width: 30%; margin: 20px 0; } img { width: 100%; } } } .home-static { // height: 723px; background: linear-gradient(315deg, #496cf2 0%, #7663ff 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; .home-content { display: flex; align-items: center; flex-direction: column; margin: 50px 0; } .home-title { color: #fff; &-sub { color: #fff; // margin-bottom: 45px; } } .home-static-num { display: flex; justify-content: center; align-items: center; margin: 20px 5px; &-wrap { padding: 0 24px; border-radius: 9px; background-color: #fff; color: #723bed; font-size: 30px; } } &-title { font-size: 16px; } .home-static-btn { // margin-top: 18px; height: 40px; border-radius: 40px; color: #723bed; width: 150px; cursor: pointer; } .home-ad-free { display: flex; align-items: center; margin: 20px 0; } } } // 底部 .home-bottom { width: 100%; background: #1F1D2A; padding: 20px 50px 10px; .home-bottom-c { width: 70%; margin: 0 auto; } .contact { margin-bottom: 30px; .contact-1 { color: #FFFFFF; font-size: 20px; } .contact-2 { font-size: 14px; color: #b4b4b8; } } .home-consult { display: flex; margin-bottom: 40px; .consult-tel { // width: 50%; display: flex; justify-content: space-between; // flex-direction: column; align-items: center; flex-wrap: wrap; } .consult-code { margin-left: 5%; width: 60%; display: flex; align-items: center; justify-content: end; .code-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } } } .reference { display: flex; align-items: center; justify-content: center; color: #585667; font-size: 10px; margin: 30px 0; } } .ant-modal-body { padding: 40px !important; } .color-fff-12 { color: #fff; font-size: 12px; } .color-fff { color: #fff; } .w-15 { width: 15px; } .h-15 { height: 15px; } .w-20 { width: 20px; } .h-20 { height: 20px; } .home-ad-xw { display: flex; // align-items: center; .ad-free-img { width: 50%; // height: 100%; margin-right: 50px; } .ad-free-content { flex: 1; height: 100%; border: 1px solid #ECECEC; } } .yc { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .yc-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .yc-4 { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }