.banner_container { background-color: #fff; } body { background: #f7f8fc; } .index { position: relative; } .index .banner { position: relative; width: 100%; min-width: 1200px; height: 31.25vw; min-height: 375px; background-color: #fff; } .swiper-container { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 4.8vw; 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; } .index .banner .swiper-pagination-bullet-active { background: #fff; } /* 轮播图图片大小撑满 */ .index .banner .swiper-slide { width: 100%; height: 100%; } .index .banner .swiper-slide a { width: 100%; height: 100%; } .index .banner .swiper-slide img { width: 100%; height: 100%; } .index .banner:hover .swiper-button-prev, .index .banner:hover .swiper-button-next { visibility: visible; transition: all 0.3 ease; } .index .banner .swiper-button-prev, .index .banner .swiper-button-next { visibility: hidden; transition: all 0.3 ease; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 30px; color: #fff; border-radius: 2.6px; background: rgba(60, 53, 54, 0.8); border-radius: 50%; } .index .banner .swiper-button-prev { left: calc(50% - 600px); } .index .banner .swiper-button-next { right: calc(50% - 600px); } .index .banner .info { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 800; text-align: center; } .index .banner .info .t1 { white-space: nowrap; font-size: 56px; font-weight: bold; color: #fff; line-height: 1; letter-spacing: 5px; } .index .banner .info .t2 { margin-top: 29px; margin-bottom: 77px; font-size: 34px; color: #fff; line-height: 1; letter-spacing: 6px; } .index .banner .info .search .btn { background-color: #e53a11; } .index .banner .swiper-slide a::after { content: ''; background: rgba(0, 0, 0, .2); position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; z-index: 3; } .index .banner .info .search { min-width: 150px; height: 44px; border-radius: 5px; position: relative; background: rgba(255, 255, 255, 0.8); text-align: initial; } .index .banner .info .search .icon { position: absolute; left: 31px; top: 14px; font-size: 24px; color: #666666; cursor: pointer; } .index .banner .info .search .btn { position: absolute; right: 2px; top: 2px; width: 114px; height: 48px; border-radius: 24px; font-size: 20px; color: #fff; } .index .banner .info .search input { height: 100%; width: 70%; margin-left: 10%; font-size: 16px; background-color: transparent; margin-top: 12px; } /* 我要买车 我要卖车 */ .index .buy_sell { position: absolute; z-index: 99; width: 100%; left: 0; top: 27vw; } .index .buy_sell .wrap { background-color: #fff; padding: 38px 40px 38px; display: flex; box-sizing: border-box; box-shadow: 0px 3px 20px 0px rgba(80, 80, 80, 0.05); } .index .buy_sell .buy { width: 700px; margin-right: 50px; } .index .buy_sell .sell { flex: 1; } .index .buy_sell .card .title { display: flex; align-items: center; color: #333; } .btnsearch { white-space: nowrap; background: #e53a11; border-radius: 5px; color: white; padding: 0 20px; margin-left: 10px; } .index .buy_sell .card .title .tit { font-size: 20px; margin-right: 9px; font-weight: bold; } .index .buy_sell .card .title i { font-size: 20px; margin-right: 15px; font-weight: bold; } .index .buy_sell .card .title .con { font-size: 14px; } .index .buy_sell .card .title .con span { color: #e53a11; font-size: 18px; font-weight: bold; } .index .buy_sell .buy .price { display: flex; margin-top: 28px; font-size: 14px; color: #333; line-height: 1; } .index .buy_sell .buy .price a { margin-right: 36px; width: 54px; text-align: center; } .index .buy_sell .buy .areaid_list { display: flex; margin-top: 28px; font-size: 14px; color: #333; line-height: 1; } .index .buy_sell .buy .areaid_list a { margin-right: 20px; width: 54px; text-align: center; } .index .buy_sell .buy .brand { margin-top: 25px; display: flex; } .index .buy_sell .buy .brand .brand_item:first-child { margin-left: 0; } .index .buy_sell .buy .brand .brand_item { width: 54px; margin-left: 36px; display: flex; flex-direction: column; justify-content: center; align-items: center; } .index .buy_sell .buy .brand .brand_item img { height: 50px; } .index .buy_sell .buy .brand .brand_item .t { font-size: 14px; color: #333; line-height: 1; } .index .buy_sell .buy .brand .brand_item:hover .t { color: #e53a11; } .index .buy_sell .sell .input_box { margin-top: 35px; position: relative; } .index .buy_sell .sell .input_box input { width: 370px; height: 50px; background-color: #f7f8fc; line-height: 50px; text-indent: 10px; border-radius: 5px; font-size: 14px; } .index .bottom { display: flex; justify-content: space-between; } .index .bottom #yycar { height: 50px; background-color: #313237; font-size: 18px; color: #fff; border-radius: 6px; } .index .buy_sell .sell .agreement { display: flex; align-items: center; font-size: 14px; line-height: 1; color: #a5abb2; margin: 3px 0 16px; } .index .buy_sell .sell .agreement i { display: inline-block; width: 14px; height: 14px; margin-right: 6px; background: url(/uploads/image/spcimg/agree.png) no-repeat; background-size: 100% 100%; cursor: pointer; } .index .buy_sell .sell .agreement a { color: #e53a11; } .agreementnew { font-size: 12px; color: #afb0bb; margin-top: 15px; } .agreementnew input { vertical-align: middle; } .index .buy_sell .sell .bottom button { height: 50px; box-sizing: border-box; color: white; font-size: 18px; background-color: #e53a11; border-radius: 5px; padding: 0 53px; } /* 促销车源 */ .index01 { margin-top: 60px; } .indexlist.index02 { margin-bottom: 12px; } .indexlist.index02 .original, .indexlist.index03 .original { display: none; } /* 轮播图 */ .advertisement .ad { width: 100%; height: 261px; } .index .ad .swiper-slide { width: 100%; height: 100%; } .index .ad .swiper-slide a { width: 100%; height: 100%; } .index .ad .swiper-slide a img { width: 100%; height: 100%; } .index .ad .swiper-pagination-bullet { width: 26px; height: 3px; border-radius: unset; background: #fff; opacity: 0.5; } .index .ad .swiper-pagination-bullet-active { opacity: 1; } .index .ad .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 7px; } .index .advertisement { margin-top: 41px; } .indexlist.index07 { margin-bottom: 0; padding-bottom: 30px; } .index .index_break { margin-top: 41px; } @media only screen and (max-width: 1200px) { .index .buy_sell { top: 350px; } .index01 { margin-top: 282px; } } .index_top_search { display: flex; } .index_top_search1 { min-width: 111px; background: rgba(255, 255, 255, 0.95); border-radius: 5px; padding: 5px 15px; display: flex; align-items: center; margin-right: 10px; position: relative; } .index_top_search1 img { width: 16px; height: 7px; margin-left: 25px; } .index_top_search1_list { position: absolute; top: 42px; left: 0; z-index: 21; width: 100%; height: auto; padding: 5px 0; background: rgba(255, 255, 255, 0.95); border-radius: 5px; display: none; box-sizing: border-box; box-shadow: 0px 0px 5px #e0e0e0; max-height: 300px; overflow-y: auto; } .index_top_search1_list_item { padding: 0 0 0 10px; height: 30px; line-height: 30px; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; cursor: pointer; } .index_top_search1img2 { display: none; } .index_top_search1:hover .index_top_search1_list { display: block; } .index_top_search1_list_item:hover { background: #e53a11; color: #fff; } .index_top_search1:hover .index_top_search1img2 { display: block; } .index_top_search1:hover .index_top_search1img1 { display: none; } /*优势*/ .index_ys_con { margin-top: 260px; } .index_ys_title { text-align: center; font-size: 24px; margin-bottom: 25px; } .index_ys_title img { display: block; margin: 0 auto; margin-top: 10px; } .index_ys { /*background: no-repeat;*/ background: no-repeat; display: flex; justify-content: space-around; background-size: 100% 100%; padding: 30px 0; } .index_ys1 { text-align: center; } .index_ys1_p1 { color: #904309; font-size: 18px; margin-top: 15px; margin-bottom: 5px; } .index_ys1_p2 { color: #b8946b; font-size: 14px; } /*推荐车源*/ .indexlist_div { text-align: center; font-size: 16px; margin-bottom: 25px; } .indexlist_ul { display: inline-block; overflow: auto; } .indexlist_ul li { display: inline; float: left; margin-left: 15px; margin-right: 15px; cursor: pointer; } .indexlist_licur { color: #e53a11; border-bottom: 2px solid #e53a11; padding-bottom: 7px; } .tagtj { background: url(/uploads/image/spcimg/sj.png) no-repeat; position: absolute; top: -2px; background-size: 100% 100%; width: 55px; height: 40px; left: 10px; font-size: 12px; color: white; text-align: center; line-height: 30px; } .favv { position: absolute; top: 160px; right: 15px; } .favv img { width: 25px; } .lookmore { color: #e53a11; font-size: 16px; border: 1px solid #e53a11; border-radius: 5px; margin: 20px auto 0 auto; display: block; width: 120px; padding: 10px 20px; text-align: center; } .list_zx { background: #313237; color: white; border-radius: 5px; padding: 4px 12px; text-align: center; font-size: 14px; } .indexlist_licur_break a { color: #e53a11; } .break_f_div { width: 100%; display: inline-block; } .left_break { width: 356px; float: left; background: white; border-radius: 5px; padding: 15px; } .left_break1 { color: #313237; font-size: 18px; text-align: center; padding: 15px 0; border-bottom: 1px dashed #4e4d4d; font-weight: bold; margin-bottom: 20px; } .left_break form div { border-bottom: 1px solid #e6e8ec; padding: 15px 0; font-size: 16px; } .left_break form span { margin-right: 10px; } .left_break form .left_break2 select { border: none; } .left_break form .left_break21 select { color: #e53a11; border-radius: 5px; border: 1px solid; margin-right: 10px; } .left_break3 em { color: #e53a11; float: right; } .left_break form input::-webkit-input-placeholder { color: #afb0bb; } .left_break form input:-moz-placeholder { color: #afb0bb; } .left_break form input::-moz-placeholder { color: #afb0bb; } .left_break form input:-ms-input-placeholder { color: #afb0bb; } .left_break4 { background: #e53a11; color: white; border-radius: 5px; padding: 10px; text-align: center; width: 100%; margin-top: 25px; margin-bottom: 20px; } .right_break { width: 794px; float: right; font-size: 16px; } .right_break_top { width: 100%; height: 163px; background: white; margin-bottom: 15px; border-radius: 5px; overflow: hidden; padding: 15px 0; } .right_break_bottom { width: 100%; height: 163px; background: white; border-radius: 5px; overflow: hidden; padding: 15px 0; } .right_break b { color: #afb0bb; margin-right: 10px; } .right_break_top div, .right_break_bottom div { width: 14.0%; float: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 8px 0 5px 20px; } /*首页新闻资讯*/ .index_news_dd { display: inline-block; width: 100%; } .index_news { margin-top: 41px; } .index_news1 { width: 286px; height: 388px; float: left; margin-right: 10px; } .index_news2 { width: 285px; height: 388px; position: relative; } .index_news2 img { width: 100%; height: 100%; border-radius: 5px; } .index_news3 { position: absolute; /* top: 15px; */ background: rgba(0, 0, 0, 0.4); width: calc(100% - 30px); font-size: 16px; color: white; padding: 15px; } .index_news4 { height: 32px; line-height: 32px; position: absolute; bottom: 0; right: 0; background: #313237; border-bottom-right-radius: 5px; padding-left: 8px; } .index_news4 a { width: 230px; color: white; font-size: 14px; display: inline-block; /* padding:4px 8px; */ /* vertical-align: middle; */ /* margin-bottom: 4px; */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* text-align: center; */ /* line-height: 16px; */ } .index_news4 img { width: 12px; } .index_news5 { display: inline-block; padding: 0.5px 8px; float: right; /* margin-top: 1px; */ background: #e53a11; border-bottom-right-radius: 5px; } .index_news5>img { margin-top: 6px; } .index_news1_2 { float: left; width: 286px; margin-right: 20px; } .index_news2_1 { width: 286px; height: 184px; position: relative; } .index_news2_1 img { width: 100%; height: 100%; border-radius: 5px; } .index_news3_1 { position: absolute; top: 15px; background: rgba(0, 0, 0, 0.4); width: calc(100% - 30px); font-size: 16px; color: white; padding: 15px; } .index_news4_1 { position: absolute; bottom: 0; right: 0; background: #313237; border-bottom-right-radius: 5px; } .index_news4_1 span { color: white; font-size: 14px; display: inline-block; padding: 7px 8px; } .index_news4_1 img { width: 12px; } .index_news5_1 { background: #e53a11; border-bottom-right-radius: 5px; } .index_news2_1mb { margin-bottom: 20px; } .index_news_r { width: 302px; background: white; border-radius: 5px; height: 378px; overflow: hidden; font-size: 16px; padding-top: 10px; } .index_news_r div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 10px 16px; line-height: 21px; height: 41px; box-sizing: border-box; } .index_news_r div b { color: #afb0bb; margin-right: 10px; } .index_wenda { margin-top: 41px; } .intro{ margin-bottom: 30px; } .intro .rec{ background: #ffffff; padding: 20px; padding-left: 38px; margin-bottom: 20px; } .intro>div>a { display: inline-block; padding: 18px 8px; margin-top: 10px; margin-bottom: 10px; margin-right: 10px; /* color: #333; */ background: rgb(247,248,252); font-size: 14px; color: #333; border-radius: 5px; box-sizing: border-box; width: 214px; text-align: center; } /* .intro>div>a:nth-child(19n){ margin-right: 0px; } */ .intro>div>a:hover{ background: #e53a11; color: #fff; /* border-radius: 5px; */ }