@charset "utf-8"; .header{ width: 1200px; margin: 0 auto; } .nav{ background-color:#141414; } .nav ul{ width: 1200px; margin: 0 auto; display: flex; justify-content: space-around; text-align: center; } .nav ul li{ flex-grow: 1; text-align: center; position: relative; } .nav ul li ul{ background-color: #141414; width: 100%; position: absolute; z-index: 1000; top: 100%; left: 0; display: none; } .nav ul li ul li{ width: 100%; height: 45px; line-height: 45px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* .nav ul li:hover{ background-color: #09558a; } */ .nav ul a{ line-height: 50px; color: #fff; font-size: 16px; } /*轮播图*/ .swi{ height: calc(100vh - 300px); } .swiper-slide { overflow: hidden; } .slide-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center; } /*title部分*/ .title{ text-align: center; padding: 50px 0 20px 0; color: #fff; } .title p:first-child{ font-size: 30px; } .title p:last-child{ font-size: 24px; line-height: 30px; padding-bottom: 50px; background: url(/uploads/image/tdsimages/titlebg.png) no-repeat center; } /*产品分类*/ .product{ width: 100%; height: 1080px; background: url(/uploads/image/tdsimages/productbg.png) no-repeat center;\ } .product a{ display: block; width: 100%; color: #000; } .product-list ul{ display: flex; flex-wrap: wrap; justify-content: flex-start; margin-bottom: 50px; } .product-list ul li{ margin-bottom: 20px; margin-right: 75px; width: 180px; line-height: 45px; text-align: center; font-size: 16px; background-color: #ffcc00; } .product-list ul li:nth-child(5){ margin-right: 0; } .product-list ul li:nth-child(10){ margin-right: 0; } .product-info ul{ display: flex; flex-wrap: wrap; justify-content: space-between; } .product-info ul li{ width: 280px; margin-bottom: 60px; } .product-info ul li a:first-child{ font-size: 0; } .product-info ul p{ text-align: center; background-color: #ffcc00; line-height: 60px; font-size: 18px; } /*公司简介*/ .about{ height: 660px; background: url(/uploads/image/tdsimages/aboutbg.png) no-repeat center; /* background-attachment:fixed; */ } .about .title{ padding: 45px 0 20px 0; } .about a{ color:#fff; } .about-wrap{ display: flex; justify-content: space-between; } .about-wrap .about-txt{ padding: 20px; font-size: 14px; color: #fff; line-height: 30px; text-indent: 24px; background-color: #000; } .about-wrap a{ float: right; margin-top: 10px; margin-right: 20px; } /*新闻中心*/ .news{ background-color: #141414; } .news a{ color: #000; } .news-wrap ul{ display: flex; justify-content: space-between; flex-wrap: wrap; } .news-wrap ul li{ background-color: #ffcc00; width: 360px; box-sizing: border-box; padding: 5px; margin-bottom: 25px; text-align: center; } .news-wrap ul p{ width: 100%; box-sizing: border-box; padding: 0 30px; line-height: 24px; font-size: 14px; } .news-wrap ul p:first-child{ font-size: 16px; } .news .link{ text-align: center; } .news .link a{ text-align: center; padding:0px 20px; line-height: 50px; background-color: #ffcc00; display: inline-block; margin: 0 auto; margin-top: 20px; margin-bottom: 40px; } /*荣誉资质*/ .honor{ height: 600px; background: url(/uploads/image/tdsimages/honorbg.png) no-repeat center; } #certify { position: relative; width: 1200px; margin: 0 auto } #certify div{ outline: none; } #certify .swiper-container { padding-bottom: 60px; } #certify .swiper-slide { width: 386px; height: 360px; background: #fff; box-shadow: 0 8px 30px #ddd; text-align: center; } #certify .swiper-slide img{ display:block; margin: 0 auto; } #certify .swiper-slide p { line-height: 98px; padding-top: 0; text-align: center; color: #636363; font-size: 1.1em; margin: 0; } #certify .swiper-pagination { width: 100%; bottom: 20px; } #certify .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px; border: 3px solid #fff; background-color: #d5d5d5; width: 10px; height: 10px; opacity: 1; } #certify .swiper-pagination-bullets .swiper-pagination-bullet-active { border: 3px solid #00aadc; background-color: #fff; } #certify .swiper-button-prev { left: -30px; width: 45px; height: 45px; background: no-repeat; background-position: 0 0; background-size: 100%; } #certify .swiper-button-prev:hover { background-position: 0 -46px; background-size: 100% } #certify .swiper-button-next { right: -30px; width: 45px; height: 45px; background: no-repeat; background-position: 0 -93px; background-size: 100%; } #certify .swiper-button-next:hover { background-position: 0 -139px; background-size: 100% } /*地图*/ .map{ background-color: #181818; padding: 50px 0; } /*页脚*/ .footer{ background-color: #141414; } .foot{ display: flex; justify-content: space-between; box-sizing: border-box; padding: 20px; } .foot .left{ flex-grow: 1; display: flex; justify-content:space-between; font-size: 16px; color: #fff; } .foot .left>div{ line-height: 30px; } .foot .left p{ line-height: 45px; } .foot .left .first{ font-size: 16px; margin-bottom: 15px; } .foot .three{ width: 300px; } .foot .three span{ width: 120px; display: block; float: left; } .foot a{ color: #fff; } .foot .right{ flex-grow: 1; display: flex; justify-content: space-between; } .foot .contact{ font-size: 14px; color: #fff; } .foot .contact p:first-child{ font-size: 22px; margin-bottom:30px; } .foot .contact p{ margin-bottom: 15px; } .pic-ewm{ text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; } .pic-ewm p{ line-height: 30px; } .copyright{ line-height: 55px; color: #fff; background-color: #181818; text-align: center; font-size: 16px; }