html, body { position: relative; height: 100%; } body { font-family: helvetica neue, helvetica, arial, sans-serif; font-size: 14px; color: #000; margin: 0; padding: 0; } .swiper-container { width: 100%; height: 100%; margin-left: auto; margin-right: auto; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .w650 { width: 620px; } .w479 { width: 560px } .slide_x, .box, .slide_x .list li { width: 560px } .list img { width: 100%; } .tpxw-news-item-pic img { width: 100% !important } .a { margin-bottom: 10px; } .b .tpxw-news-item { width: 400px } .b .tpxw-news-item .estate_pic { margin-right: 10px; width: 390px } .content-bottom { padding-top: 40px !important; } .cddwbd { background: #006bc6; border-radius: 7px; padding: 2px 10px; color: #ffffff; margin: 0 30px; } .cddwb { width: 395px; height: 2px; background: blue; display: inline-block; } .esta_cont { display: none; } .block2 { margin-top: 50px !important; height: 100px } .block2 p { line-height: 105px } .block2_nei p a { background-position: 27px 29px !important } .a2 { line-height: 100px !important } .swiper-button-next { transform: translatex(200px); opacity: 0; transition: .4s; } .swiper-button-prev { transform: translatex(-200px); opacity: 0; transition: .4s; } .banner-box:hover .swiper-button-next { transform: translatex(0); opacity: 1; transition: .4s; } .banner-box:hover .swiper-button-prev { transform: translatex(0); opacity: 1; transition: .4s; } .estate_pic { height: 100%; position: relative; z-index: 50; } .estate_list a:after { -webkit-transition: all .3s ease-in; transition: all .3s ease-in; display: block; content: ""; position: absolute; width: 100%; height: 58px; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.65); z-index: 80; } .esta_cont { -webkit-transition: all .3s ease-in; transition: all .3s ease-in; font-size: 14px; color: #ffffff; line-height: 24px; width: 100%; height: 0; overflow: hidden; display: block; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; } .esta_tit { height: 58px; line-height: 58px; text-align: center; font-size: 20px; color: #ffffff; } .esta_info { position: absolute; bottom: 0; left: 50%; width: 84%; z-index: 100; -webkit-transition: all .3s ease-in; transition: all .3s ease-in; -webkit-transform: translatex(-50%); -ms-transform: translatex(-50%); transform: translatex(-50%); } .estate_focus .focus_on:after { height: 100%; } .estate_focus .focus_on .esta_info { bottom: 50%; -webkit-transform: translate(-50%, 50%); transform: translate(-50%, 50%); } .estate_focus .focus_on .esta_cont { height: 190px; } .a { width: auto !important; overflow: hidden; } .b { width: auto !important; position: relative; } /*.b div{ width:600px; height:200px; float:left; margin-right:5px;}*/ .left, .right { width: 4000px; border: #f00 1px solid; float: left; width: 100px; height: 100px; } @media screen and (max-width: 1280px) { .w479{width: 50%;} .w620{width: 48%;} /* .slide_x, .box, .slide_x .list li{width: 100% !important;} .list img{width: 100% !important;} */ .content-bottom{height: auto;background-size: cover;padding-bottom: 50px;} .content-b-p2{width: 920px;} .b{margin: 0 -5px;} .b .tpxw-news-item{width: 33.33%;height: 220px !important;padding: 0 5px;box-sizing: border-box;} .b .tpxw-news-item .estate_pic{width: 100%;margin-right: 0;} .esta_cont{font-size: 12px;line-height: 20px;} .estate_focus .focus_on .esta_cont {height: 60%;} } @media screen and (max-width: 992px) { .w479{width: 100%;margin-bottom: 30px;} .w620{width: 100%;} .content-b-p2{width: 720px;} } @media screen and (max-width: 767px) { .block2{height: 50px;margin-top: 30px !important;} .content-bottom{padding: 20px 0 !important;} .content-b-p2{width: 92%;margin-top: 10px;} .a{margin-bottom: 0;} .b .tpxw-news-item{width: 100%;margin-bottom: 10px;} .esta_tit{height: 40px;line-height: 40px;font-size: 16px;} .estate_list a:after{height: 40px;} }