/* CSS Document*/ @font-face { font-family: 'webfontregular'; font-weight: 600; src: url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.eot'); src: url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.woff2') format('woff2'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.woff') format('woff'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.ttf') format('truetype'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.svg#webfontregular') format('svg'); font-weight: normal; font-style: normal; } /* CSS Document*/ * { padding: 0px; margin: 0px; outline: 0 none; } a { text-decoration: none; color: #666; transition: all 0.5s ease 0s; } a:focus { outline: none; } a:hover { color: #ce0018; text-decoration: none; } ul { list-style-type: none; margin-bottom: 0px; } li { vertical-align: bottom; zoom: 1; } img { border: 0px; } select { font-family: "pingfang SC", "Microsoft YaHei", "黑体"; color: #666; font-size: 12px; } textarea { font-family: "pingfang SC", "Microsoft YaHei", "黑体"; color: #666; font-size: 12px; outline: none; } table { border-collapse: collapse; border-spacing: 0px; } th, td { padding: 0; } input { vertical-align: middle; outline: none; font-size: 12px; font-family: "pingfang SC", "Microsoft YaHei", "黑体"; } .clearfix:before, .clearfix:after { content: " "; display: block; height: 0; visibility: hidden; clear: both; overflow: hidden; } .clearfix { zoom: 1; } .clearfix:after { clear: both; } .hidden { display: none; } h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: inherit; margin: 0px; } p { margin: 0px; } em, i { font-style: normal; } .fl { float: left; } .fr { float: right; } input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; } input::-webkit-input-placeholder { color: #999; } input::-moz-input-placeholder { color: #999; } input::-ms-input-placeholder { color: #999; } textarea::-webkit-input-placeholder { color: #999; } textarea::-moz-input-placeholder { color: #999; } textarea::-ms-input-placeholder { color: #999; } body { font-family: "pingfang SC", "Microsoft YaHei", "黑体"; background: #fff; color: #666; font-size: 12px; min-width: 1200px; } .container { margin: 0px auto; max-width: 1300px; padding: 0px 20px; margin: 0px auto; } .top { height: 110px; top: 0px; width: calc(100% - 40px); padding: 0px 20px; background: #fff; display: flex; justify-content: space-between; align-items: center; position: fixed; width: 100%; z-index: 100; box-sizing: border-box; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1); } .top_gao { height: 110px; } .top .logo img { width: 229px; height: auto; } .nav { z-index: 10; display: flex; align-items: center; height: 100%; position: relative; } .nav a { color: #333; } .nav .nLi { height: 100%; position: relative; } .nav .nLi h3 { position: relative; height: 100%; display: flex; align-items: center; } .nav .nLi h3 a { display: block; width: 140px; text-align: center; line-height: 110px; font-size: 20px; position: relative; margin-right: 20px; } .nav .on h3 a { color: #fff; background: #ce0018; } .nav .nLi:hover h3 a { position: relative; } .nav .nLi:hover h3 a::after { position: absolute; width: 100%; height: 3px; content: ''; background: #ce0018; bottom: 0px; left: 0px; } .nav .sub { display: none; left: 0px; top: 110px; line-height: 70px; position: absolute; padding-left: 30px; background: #fff; white-space: nowrap; } .nav .nLi:hover .sub { display: flex; } .nav .nLi:hover .sub::after { width: 100%; height: 1px; background: #e8e8e8; content: ''; position: fixed; top: 110px; left: 0px; z-index: 0; } .nav .sub::before { height: 70px; width: 100vw; left: 0px; position: fixed; top: 110px; background: #fff; content: ''; } .nav .sub a { color: #333; font-size: 18px; text-align: center; display: block; white-space: nowrap; position: relative; padding-right: 40px; margin-right: 40px; } .nav .sub a::after { width: 1px; height: 24px; background: #c6c6c6; content: ''; right: 0px; top: 25px; position: absolute; } .nav .sub a:nth-last-child(1)::after { width: 0px; } .nav .sub a:hover { color: #ce0018; } .nav .search img { cursor: pointer; } .nav .search_zk { right: 30px; top: 25px; height: 62px; width: 60%; position: absolute; background: #fff; display: none; } .nav .search_zk input { border: 0px; height: 62px; width: 100%; font-size: 16px; background: url(../images/search.png) no-repeat #fff; background-position: left 15px center; border: 1px solid #e8e8e8; padding-left: 50px; box-sizing: border-box; } .phone_btn { float: right; display: none; } .menu_box { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; background: rgba(0, 0, 0, 0.7); transform: translateX(-100%); transition: all 0.3s ease; } .menu_box.into { transform: translateX(0); -webkit-transform: translateX(0); } .menu_cot { width: 70%; height: 100%; background: #fff; transform: translateX(-100%); transition: all 0.3s ease; } .menu_box.into .menu_cot { transform: translateX(0); transition: all 0.3s 0.2s ease; } .menu_close { position: absolute; top: 0; right: 0; width: 30%; height: 100%; } .menu_close img { width: 40px; } .menu_close a { padding: 10px; height: 100%; width: 100%; display: flex; align-items: flex-start; justify-content: center; box-sizing: border-box; } .in_banner { margin: 0px 20px; overflow: hidden; position: relative; } .in_banner .swiper-slide a { width: 100%; height: auto; display: block; background-size: cover; background-position: center center; } .in_banner .swiper-slide a img { width: 100%; height: auto; } .in_banner .swiper-pagination span { background: none; opacity: 1; position: relative; width: 22px; height: 22px; } .in_banner .swiper-pagination span::after { width: 8px; height: 8px; left: 7px; top: 7px; background: #dbdbdb; position: absolute; content: ''; border-radius: 50%; } .in_banner .swiper-pagination span.swiper-pagination-bullet-active { background: url(../images/in_an_bj.png) no-repeat; background-size: cover; } .in_banner .swiper-pagination span.swiper-pagination-bullet-active::after { background: #ce0018; } .in_box { padding: 30px 20px; display: flex; justify-content: space-between; } .in_box_l { width: 25%; padding: 35px 0px; } .in_box_l_nr { overflow: hidden; position: relative; } .in_box_l_nr .swiper-slide h2 { display: flex; justify-content: space-between; align-items: center; } .in_box_l_nr .swiper-slide h2 span { display: block; width: 65px; color: #ce0018; font-size: 15px; } .in_box_l_nr .swiper-slide h2 span b { font-size: 30px; font-weight: normal; line-height: 24px; } .in_box_l_nr .swiper-slide h2 p { display: block; width: calc(100% - 85px); font-size: 20px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .in_box_l_nr .swiper-slide h2 p a{ color: #333; } .in_box_l_nr .swiper-slide h2 p a:hover{ color: #ce0018; } .in_box_l_nr .swiper-slide h3 { font-size: 14px; line-height: 24px; color: #666; margin: 15px 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .in_box_l_nr .swiper-slide span { display: inline-block; } .in_box_l_nr .swiper-slide span a { background: #ce0018; color: #fff; font-size: 16px; box-shadow: 0px 0px 5px #ce0018; padding: 10px 20px; display: inline-block; margin-left: 5px; } .in_box_l_nr .swiper-slide span a img { margin-left: 10px; transition: all 0.5s ease 0s; } .in_box_l_nr .swiper-slide span a:hover img { margin-left: 5px; transition: all 0.5s ease 0s; } .in_box_l_nr .swiper-pagination { text-align: right; bottom: 10px; width: 50%; right: 0px; left: auto; } .in_box_l_nr .swiper-pagination span { background: none; opacity: 1; position: relative; width: 22px; height: 22px; } .in_box_l_nr .swiper-pagination span::after { width: 8px; height: 8px; left: 7px; top: 7px; background: #dbdbdb; position: absolute; content: ''; border-radius: 50%; } .in_box_l_nr .swiper-pagination span.swiper-pagination-bullet-active { background: url(../images/in_an_bj.png) no-repeat; background-size: cover; } .in_box_l_nr .swiper-pagination span.swiper-pagination-bullet-active::after { background: #ce0018; } .in_box_z { width: 35%; background: #f6f6f6; padding: 35px 25px; box-sizing: border-box; } .in_box_z .nr a { display: flex; justify-content: space-between; } .in_box_z .nr h2 { width: calc(50% - 25px); height: 180px; background-size: cover; background-position: center center; } .in_box_z .nr h2 img { width: 100%; height: auto; display: none; } .in_box_z .nr h3 { width: 50%; } .in_box_z .nr h3 b { color: #ce0018; font-size: 22px; font-weight: normal; display: block; padding-bottom: 20px; } .in_box_z .nr h3 p { font-size: 14px; color: #666; line-height: 24px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } .in_box_r { width: 35%; padding: 35px 0px; } .in_box_r .nr a { display: flex; justify-content: space-between; align-items: center; } .in_box_r .nr .left { width: calc(100% - 265px); } .in_box_r .nr .left p { font-size: 14px; line-height: 28px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } .in_box_r .nr .left span { display: inline-block; padding-top: 20px; } .in_box_r .nr .left span a { background: #ce0018; color: #fff; font-size: 16px; box-shadow: 0px 0px 5px #ce0018; padding: 10px 20px; display: inline-block; margin-left: 5px; } .in_box_r .nr .left span a img { margin-left: 10px; transition: all 0.5s ease 0s; } .in_box_r .nr .left span a:hover img { margin-left: 5px; transition: all 0.5s ease 0s; } .in_box_r .nr .right { width: 250px; } .in_box_r .nr .right img { width: 100%; height: auto; } .in_bt { font-size: 24px; color: #000; padding-bottom: 40px; } .in_bt span { padding-left: 10px; color: #ce0018; font-size: 14px; } .di { background-color: #f3f3f3; padding: 40px 20px; display: flex; justify-content: space-between; } .di_left { width: 50%; } .di_left .logo { padding-bottom: 30px; } .di_left .di_nav { width: 100%; padding: 45px 0px; display: flex; } .di_left .di_nav a { flex: 1; font-size: 18px; position: relative; } .di_left .di_nav a::after { content: ''; position: absolute; width: 3px; height: 3px; background: #666; border-radius: 50%; right: 25%; top: 10px; } .di_left .di_nav a:nth-last-child(1)::after { display: none; } .di_left p { font-size: 14px; color: #999; } .di_right { width: 37%; } .di_right .link { width: 350px; } .di_right .link button { border: solid 1px #999999; box-sizing: border-box; padding: 10px; font-size: 16px; display: flex; align-items: center; width: 100%; position: relative; } .di_right .link button i { font-size: 20px; margin-left: 25px; position: absolute; right: 20px; top: 10px; } .di_right ul li { display: flex; justify-content: space-between; width: 100%; } .di_right ul li p { font-size: 18px; color: #666; padding: 20px 0px; } .link_more { width: 350px; border: solid 1px#999999; background: #f3f3f3; } .link_more ul { background: #f3f3f3; } .link_more ul li { margin: 0px; width: 100%; } .link_more ul li a { color: #333; font-size: 15px; } .link_more ul li a:hover { background: none; color: #333; } .ny_banner { width: 100%; height: 500px; background-size: cover; background-position: center center; } .about { padding: 100px 0px; } .about_bt { display: flex; justify-content: space-between; border-bottom: 1px solid #e4e4e4; padding-bottom: 35px; margin-bottom: 35px; } .about_bt h2 { font-size: 45px; color: #333; position: relative; } .about_bt h2 p { font-size: 20px; color: #999; padding-bottom: 10px; } .about_bt h2 b { width: 84px; height: 17px; background-color: #ce0018; opacity: 0.3; display: block; position: absolute; bottom: 3px; } .about_bt h3 { font-size: 20px; color: #666; padding-top: 40px; } .about_bt h3 span { color: #333; } .about_box { display: flex; justify-content: space-between; } .about_box .left { width: 50%; } .about_box .left img { width: 100%; height: auto; } .about_box .right { width: 45%; } .about_box .right h2 { padding-bottom: 15px; } .about_box .right p { font-size: 16px; line-height: 30px; color: #333; text-align: justify; text-indent: 30px; } .about1_box ul { position: relative; display: flex; flex-wrap: wrap; width: 100%; margin-top: 20px; } .about1_box ul::before { content: ''; position: absolute; width: 1px; border-left: 1px dashed #ddd; height: 100%; top: 0px; left: 50%; margin-left: -1px; display: block; } .about1_box ul li { box-sizing: border-box; padding-left: 50%; width: 100%; font-weight: bold; margin-top: -10px; margin-bottom: 45px; } .about1_box ul li:nth-child(even) { padding-left: 0px; padding-right: 50%; } .about1_box ul li .bt { text-align: left; font-size: 28px; color: #ce0018; padding-left: 30px; padding-bottom: 20px; position: relative; } .about1_box ul li .bt b { width: 32px; height: 32px; display: block; border: 2px solid #ce0018; border-radius: 50%; position: absolute; left: -18px; z-index: 3; top: 2px; } .about1_box ul li .bt b::after { position: absolute; width: 15px; height: 15px; top: 8px; left: 8px; content: ''; background: #ce0018; border-radius: 50%; } .about1_box ul li .nr { box-sizing: border-box; padding-left: 30px; } .about1_box ul li .nr p { width: 100%; font-size: 22px; line-height: 32px; color: #333; } .about1_box ul li:nth-child(even) .bt { text-align: right; padding-left: 0px; padding-right: 30px; } .about1_box ul li:nth-child(even) .bt b { left: auto; right: -18px; } .about1_box ul li:nth-child(even) .nr { padding-left: 0px; padding-right: 30px; } .about1_box ul li:nth-child(even) .nr p { text-align: right; } .about2_box { background: #ce1627; margin-top: 15px; padding: 40px 0px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; } .about2_box .left { width: 255px; padding: 0px 50px; } .about2_box .left img { width: 100%; } .about2_box .right { width: calc(100% - 355px); box-sizing: border-box; padding: 0px 50px; color: #fff; border-left: 1px solid #fff; } .about2_box .right h2 { font-size: 28px; padding-bottom: 10px; } .about2_box .right p { font-size: 18px; line-height: 36px; } .about2_box1 { margin-top: 50px; } .about2_box1 .hd ul { display: flex; justify-content: space-between; } .about2_box1 .hd ul li { width: 33.3%; text-align: center; } .about2_box1 .hd ul li h2 { width: 200px; height: 200px; margin: 0px auto; cursor: pointer; position: relative; } .about2_box1 .hd ul li h2 img:nth-child(1){ width: 100%; height: auto; } .about2_box1 .hd ul li h2 img:nth-child(2){ position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 2; display: none; } .about2_box1 .hd ul li.on h2 img:nth-child(1) { display: none; } .about2_box1 .hd ul li.on h2 img:nth-child(2) { display: block; } .about2_box1 .hd ul li h3 { font-size: 32px; padding: 25px 0px; color: #333; } .about2_box1 .hd ul li p { font-size: 24px; color: #666; } .about2_box1 .hd ul li.on h3, .about2_box1 .hd ul li.on p { color: #ce0018; } .about2_box1 .bd { padding-top: 100px; } .about2_box1 .bd ul h2 { font-size: 24px; color: #333; padding-bottom: 8px; } .about2_box1 .bd ul p { font-size: 18px; line-height: 32px; } .about3 { background: url(../images/about3_bj.png) no-repeat right bottom; } .about3_box { position: relative; } .gallery-top { overflow: hidden; } .gallery-top .swiper-slide { display: flex; align-items: center; background: #fff; } .gallery-top .swiper-slide .left { width: 260px; font-size: 50px; color: #ce0018; font-weight: bold; } .gallery-top .swiper-slide .right { width: calc(100% - 260px); } .gallery-top .swiper-slide .right p { font-size: 24px; color: #333; padding: 10px 0px; font-weight: bold; } .gallery-thumbs { position: relative; margin-top: 40px; padding-top: 30px; overflow: hidden; } .gallery-thumbs::after { width: 100%; height: 1px; background: #e4e4e4; content: ''; position: absolute; left: 0px; top: 41px; z-index: 0; } .gallery-thumbs .swiper-slide { text-align: center; cursor: pointer; } .gallery-thumbs .swiper-slide b { width: 21px; height: 21px; border: solid 1px #999999; display: block; position: relative; border-radius: 50%; margin: 0px auto; } .gallery-thumbs .swiper-slide b::after { width: 9px; height: 9px; background-color: #333333; content: ''; position: absolute; left: 6px; top: 6px; border-radius: 50%; } .gallery-thumbs .swiper-slide p { font-size: 28px; font-weight: bold; color: #333; padding-top: 20px; } .gallery-thumbs .swiper-slide-thumb-active b { border: 1px solid #ce0018; } .gallery-thumbs .swiper-slide-thumb-active b::after { background: #ce0018; } .gallery-thumbs .swiper-slide-thumb-active b::before { position: absolute; width: 33px; height: 33px; border: 1px solid #ce0018; content: ''; position: absolute; left: -7px; top: -7px; border-radius: 50%; } .gallery-thumbs .swiper-slide-thumb-active p { color: #ce0018; } .about3_box .swiper-button-next, .about3_box .swiper-button-prev { top: auto; bottom: 50px; width: 46px; height: 46px; background: #ce0018; border-radius: 50%; } .about3_box .swiper-button-next::after, .about3_box .swiper-button-prev::after { color: #fff; font-size: 22px } .about3_box .swiper-button-prev { left: -70px; } .about3_box .swiper-button-next { right: -70px; } .news_box { padding: 0px; position: relative; } .news_box ul { margin: 0px -10px; margin-top: 30px; padding-right: 20px; } .news_box ul li { background-color: #f5f5f5; } .news_box ul li a { display: flex; justify-content: space-between; box-sizing: border-box; } .news_box ul li:hover { box-shadow: 1px 2px 10px 0px rgba(26, 38, 75, 0.1); } .news_box ul li a .img img { width: 498px; } .news_box ul li a .nr { width: calc(100% - 498px); box-sizing: border-box; padding: 40px; } .news_box ul li a .nr .time { font-family: Bahnschrift; color: #ce0018; font-size: 32px; } .news_box ul li a .nr h2 { font-size: 28px; font-weight: bold; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 15px 0px; } .news_box ul li a .nr p { font-size: 16px; line-height: 30px; display: block; padding: 10px 0px; color: #666; height: 80px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .news_box ul li a .nr span { display: block; padding-top: 30px; text-align: right; font-size: 15px; color: #ce0018; } .news_box ul li a:hover .nr .time { color: #bb0611; } .news_box ul li a:hover .nr span { color: #bb0611; } .news_box1 { padding-top: 50px; } .news_box1 ul li { padding: 50px 0px; display: flex; justify-content: space-between; border-top: 2px solid #eee; } .news_box1 ul li .time { background-color: #f5f5f5; width: 135px; height: 135px; display: flex; justify-content: center; flex-direction: column; box-sizing: border-box; padding: 15px 12px; font-family: Bahnschrift; } .news_box1 ul li .time h2 { font-size: 49px; color: #ce0018; line-height: 40px; } .news_box1 ul li .time p { font-size: 22px; color: #ce0018; padding: 10px 0px; } .news_box1 ul li .time b { display: block; width: 44px; height: 2px; background-color: #ce0018; } .news_box1 ul li .nr { width: calc(100% - 135px); padding: 10px 30px; box-sizing: border-box; } .news_box1 ul li a { box-sizing: border-box; display: block; } .news_box1 ul li a h2 { font-size: 28px; color: #333; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news_box1 ul li a p { font-size: 16px; line-height: 24px; display: block; margin-top: 15px; color: #333; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 50px; } .news_box1 ul li a:hover h2 { color: #ce0018; } .fanye { padding: 30px 0px; text-align: center; } .news_detail { border-bottom: 1px solid #f1f1f1; padding-top: 50px; padding-bottom: 30px; margin-bottom: 30px; text-align: center; } .news_detail h2 { font-size: 28px; color: #333; } .news_detail p { font-size: 22px; padding-top: 20px; color: #666; } .news_detail1 { width: 100%; box-sizing: border-box; padding-bottom: 30px; } .news_detail1 p { font-size: 20px; line-height: 36px; display: block; color: #333; padding-bottom: 15px; } .news_detail1 img { max-width: 100%; width: auto; height: auto; } .news_detail2 { border-top: 1px solid #333; padding: 30px 0px; display: flex; justify-content: space-between; align-items: center; } .news_detail2 .left { width: calc(100% - 250px); } .news_detail2 .left p { font-size: 22px; color: #333; padding: 5px 0px; } .news_detail2 .left p a { color: #333; } .news_detail2 .left p a:hover { color: #ce0018; } .news_detail2 .right { width: 200px; text-align: right; } .news_detail2 .right a { width: 170px; height: 60px; border: solid 1px #ce0018; font-size: 20px; color: #ce0018; text-align: center; line-height: 60px; display: inline-block; } .news_detail2 .right a:hover { background: #ce0018; color: #fff; } .house_box { padding: 50px 0px; } .house_box ul { margin: 0px -15px; display: flex; flex-wrap: wrap; } .house_box ul li { margin: 0px 15px; width: calc(33.3% - 30px); margin-bottom: 50px; } .house_box ul li a { display: block; } .house_box ul li a .img { display: block; position: relative; overflow: hidden; } .house_box ul li a .img h2{ background-size: cover; background-repeat: no-repeat; background-position: center center; padding: 0px; } .house_box ul li a .img img { width: 100%; height: auto; display: block; } .house_box ul li a .img h3 { background: rgba(0, 0, 0, 0.4); width: 100%; height: 100%; position: absolute; left: 0px; bottom: -100%; color: #fff; font-size: 20px; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease 0s; } .house_box ul li a:hover .img h3 { bottom: 0px; transition: all 0.3s ease 0s; } .house_box ul li a .img h3 img { width: auto; height: auto; margin-right: 10px; } .house_box ul li a h2 { font-size: 25px; color: #333; padding: 15px 0px 5px 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .house_box ul li a p { font-size: 18px; color: #999; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .house_box ul li a:hover h2 { color: #ce0018; } .house_d { border-bottom: 1px solid #999; font-size: 32px; color: #333; padding-bottom: 35px; } .house_d1 { padding: 50px 0px; display: flex; justify-content: space-between; align-items: center; } .house_d1 .left img { max-width: 240px; width: auto; height: auto; } .house_d1 .right { width: calc(100% - 320px); } .house_d1 .right p { font-size: 18px; color: #666; line-height: 36px; } .house_d2 { position: relative; } .house_d2 .gallery-img .swiper-slide{ display: flex; justify-content: center; align-items: center; background: #fff; height: 680px; } .house_d2 .gallery-img .swiper-slide img { max-width: 100%; max-height: 100%; } .house_d2 .gallery-pic { overflow: hidden; margin-top: 50px; } .house_d2 .gallery-pic .swiper-slide{ position: relative; cursor: pointer; width: 100%; height: 200px; display: flex; justify-content: center; align-items: center; background-position: center center; background-repeat: no-repeat; background-size: cover; } .house_d2 .swiper-slide.swiper-slide-thumb-active{ border: 5px solid #ce0018; box-sizing: border-box; } .house_d2 .swiper-button-next, .house_d2 .swiper-button-prev { top: auto; bottom: 80px; width: 46px; height: 46px; background: #ce0018; border-radius: 50%; } .house_d2 .swiper-button-next::after, .house_d2 .swiper-button-prev::after { color: #fff; font-size: 22px } .house_d2 .swiper-button-prev { left: -70px; } .house_d2 .swiper-button-next { right: -70px; } .hr_box { font-size: 35px; color: #333; text-align: center; } .hr_box1 { padding-top: 60px; } .hr_box1 .hd { border-bottom: 1px solid #999; } .hr_box1 .hd ul { display: flex; flex-wrap: wrap; padding-bottom: 10px; } .hr_box1 .hd ul li { font-size: 22px; color: #333; border-right: 1px solid #999; padding-right: 30px; margin-right: 30px; cursor: pointer; margin-bottom: 15px; } .hr_box1 .hd ul li.on { color: #ce0018; } .hr_box1 .hd ul li:nth-last-child(1) { border-right: 0px; } .hr_box1 .bd { padding-top: 40px; } .hr_box1 .bd ul li { margin-bottom: 20px; } .hr_box1 .bd ul li h2 { font-size: 25px; color: #333; font-weight: bold; padding-bottom: 5px; } .hr_box1 .bd ul li p { font-size: 20px; color: #666; line-height: 36px; } .contact_box { width: 1200px; margin: 0px auto; padding: 100px 20px; } .contact_box ul { display: flex; justify-content: space-between; } .contact_box ul li { flex: 1; padding: 0px 15px; text-align: center; } .contact_box ul li h2 { font-size: 22px; color: #333; padding: 10px 0px; } .contact_box ul li p { font-size: 18px; color: #666; } .contact_box1 { width: 100%; height: 530px; }