html { font-size: 62.5%; color: #222; } ::selection { background-color: #f60; text-shadow: none; color: #f00; } ::-moz-selection { color:#ff0000; } ul,dl,li,dt,dd { margin: 0; padding: 0; } li { list-style: none; } /*工具样式*/ .center-block{ display: block; margin: 0 auto; } .pull-right{ float: right !important; } .pull-left{ float: left !important; } .text-right{ text-align: right !important; } .text-left{ text-align: left !important; } .text-center{ text-align: center !important; } .hide{ display: none !important; } .show{ display: block !important; } .invisible{ visibility: hidden; } .text-hide{ font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .clearfix:befor, .clearfix:after{ content: ""; display: table; } .clearfix:after{ clear: both; } /*浏览器更新提示*/ .browserupgrade{ padding: 5px; margin: 0; background-color: #fc0; text-align: center; font-size: 1.5rem; } .browserupgrade a{ color: #f30; padding: 0 5px; } /*自定义页面样式*/ body{ font-size: 1.4rem; line-height: 1.8; background-color: #fff; } a{ color: #666; text-decoration: none; } a:hover, a:active{ color: #f60; /*text-decoration: underline;*/ } /*header*/ .header{ background:#404040; padding:0 6%; height:100px; zoom:1; overflow:hidden;} .logo{ float:left; width: 450px; padding-top: 30px; zoom:1; overflow: hidden; } .nav{ float:left; margin:0 20px; /*width: 600px;*/ padding-top: 30px; } .nav ul{ width: 100%; zoom:1; overflow: hidden; } .nav ul li{ display: inline-block; width: 80px; text-align: center; } .nav ul li a{ display: inline-block; width: 100%; height: 40px; line-height: 40px; font-size: 1.5rem; color:#fff; } .nav ul li a:hover{ height: 40px; line-height: 40px; } .tel{ float:left; color:#fff; padding-top: 20px; margin-left:-2px;} .tel span{font-size: 2.5rem; color:#ffd200;} .qq_wx{ float:left; margin-left:30px; padding-top: 40px;} .qq_wx a{ margin-left:20px;} .wx img{width: 27px;height: 25px;border-radius:50%} /**/ .wap-header{ background:#404040; height: 60px; zoom:1; overflow: hidden; } .wap-header .wap-logo{ padding: 10px; width: 60%; float: left; } .wap-header .wap-logo img{ width: 100%; margin-top: 10px; } .wap-icon{ padding: 10px; float: right; } .wap-iconView{ display: block; background: url(../img/menu.png) no-repeat; background-size: 80%; width: 35px; height: 34px; margin-top: 5px; } .wap-nav{ display: none; position: absolute; width: 100%; background: #fff; top: 60px; z-index: 100; border-top: solid 1px #ddd; background: #fefefe; } .wap-nav ul li{ height: 50px; line-height: 50px; border-bottom: solid 1px #ddd; font-size: 2rem; text-align: center; } .wap-nav ul li a{ display: inline-block; width: 100%; height: 100%; } .wap-nav ul li a:hover,.wap-nav ul li a:active{ color: #fff; background: #08c8b8; } /*banner*/ .swiper-container { width: 100%; height: 100%; } .swiper-slide { background-position: center; background-size: cover; } .swiper1{ height: 600px; } /*about*/ .about{ width:100%; background: url(../img/bg_about.jpg) no-repeat center top; background-size:cover; margin-top:5rem; padding-bottom:5rem;} .about .about-info{ width: 1180px;margin: 0 auto;color:#fff;} .about .about-info p{ font-size:2rem; text-align:center; margin-bottom:5rem;} .about .about-info h3{ background:#ff8501; width:20%; height:5rem; line-height:5rem; margin:0 auto; border-radius:5rem; text-align:center;} .about .about-info h3 a{ color:#fff;} /*product*/ .title{ text-align:center; font-size:2rem; padding:30px 0;} .title h3{ font-size:2rem; padding:0; margin:0;} .title h3 span{ color:#ff8501;} .title h2{ font-size:3rem; padding:0; margin:0;} .about .title{ color:#fff;} .products-info{ width:1200px; margin:0 auto; } .products-info ul{ margin-bottom:20px; zoom:1; overflow:hidden; } .products-info ul li{ float: left; width: 33.33333333%; text-align: center; position: relative; } .products-info ul li img{ vertical-align:bottom; } .products-info ul li a{ display: block; text-align: center; } .products-info ul li span{ margin: 0 auto; color: #fff; font-size: 1.8rem; line-height:10rem; } .products-info ul li img{ width:100%; } .products-info ul li.p1{ background:#ff8501;} .products-info ul li.p2{ background:#26bad5;} .products-info ul li.p3{ background:#ffc001;} .products-info ul li.p4{ background:#1fb7e9;} .products-info ul li.p5{ background:#ff8501;} .products-info ul li.p6{ background:#1dcca1;} /*news*/ .news{ background: #f5f5f5; padding-bottom: 5rem; } .news h3{ font-size: 2.8rem; text-align: center; } .news-info{ width:1200px; margin:0 auto; zoom:1; overflow: hidden; } .news-left{ width: 46%; float: left; background: #fff; } .news-left img{ width:100%; height:235px; } .news-left h4{ font-style:normal; font-size: 1.8rem; line-height: 1rem; padding:0 16px; } .news-left p{ line-height:24px; font-style:normal; padding:0 16px; } .news-right{ width: 50%; float: right; } .news-right div.newsbg{ background:#fff; height:79px; padding:20px; margin-bottom:4px; zoom:1; overflow:hidden; } .news-right div.newsbg .date{ width:20%; height:60px; border-right:solid 1px #dedede; padding-top:10px; text-align:center; float:left; } .news-right div.newsbg .date span{ display:block; margin-bottom:10px; } .news-right div.newsbg .date a{ display:block; width:60px; height:20px; line-height:20px; margin:0 auto; background:#49aa81; text-align:center; color:#fff; } .news-right div.newsbg .newTitle{ float:left; margin-left:30px; width: 70%; } .news-right div.newsbg .newTitle h3{ line-height: 0.6rem; font-size:16px; font-weight:400; text-align: left; } .news-right div.newsbg .newTitle p{ font-size:14px; font-weight:400; line-height:24px; } /*shili*/ .shili-info{ width:1200px; margin:0 auto; padding-bottom:5rem;} /*footer*/ #footer { background:#393a3a;} .foot{ width:1200px; margin:0 auto; zoom:1; overflow:hidden; padding:50px 0;} .foot dl{ width:16.6%; float:left;} .foot dl dt{ font-weight:bold; font-size:18px; color:#fff; margin-bottom:30px;} .foot dl dd{ line-height:24px;} .foot dl dd a{ color:#ccc;} .foot dl dd a:hover{ color:#f90;} .copyright{ background:#2f2f2f; padding:2rem;} .copyright p { color:#adafbc; text-align:center;} .xcx{ width:16.6%; float:left;} .content-inner{ width: 80%; margin: 0 auto; } .content-inner h1{ text-align:center; border-bottom:dashed 1px #ddd; } .content-inner img{ max-width: 80%; } .honor-img{ padding: 30px 0; } .honor-img ul{ zoom:1; overflow:hidden; margin-right:-30px; border-bottom:solid 1px #ddd; } .honor-img ul li{ float:left; width:270px; margin-right:30px; margin-bottom:30px; } .honor-img ul li img{ width:100%; border:solid 1px #eee; } .honor-img ul li span{ display:block; text-align:center; } .list{ margin:30px auto;} .list dl{ border-bottom:solid 1px #ddd; padding:20px 0;} .list dl dt{ font-size:18px; line-height:40px;} .list dl dt img{ width:300px; height:180px;} .list dl dd.data{ font-size:14px; line-height:40px; color:#999;} .list dl dd.txt{ font-size:14px; line-height:24px;} .product-inner{ zoom:1; overflow:hidden; padding: 30px 0;} .left{ width:200px; float:left;} .right{ width:960px; float:right;} .product_list p{ background:#eee url(../img/btn01_h.png) no-repeat 10px center; height:50px; display:block; padding-left:35px; line-height:50px; margin-bottom:15px; margin-top:0;} .product-img{ zoom:1; overflow:hidden; margin-right:-30px; border-bottom:solid 1px #ddd;} .product-img li{ float:left; width:298px; margin-right:30px; margin-bottom:30px;} .product-img li img{ width:300px; height:180px; border:solid 1px #eee;} .product-img li span{ display:block; text-align:center;} .page{ text-align:center; padding:10px; font-size:14px;} /*Wap*/ @media only screen and (max-width: 750px){ .swiper1 { height: 200px; } .header,.foot{ display: none; } .products-info{ width:100%;} .products-info ul li span{ color: #fff; font-size: 1rem; line-height:5rem; } .about .about-info{ width:90%;margin: 0 auto;color:#fff;} .about .about-info h3{ width:90%;} .news-info{ width:100%;} .news-left{ width: 100%; } .news-right{ width: 100%; margin-top: 10px; } .news-right div.newsbg{ height:100px; } .news-right div.newsbg .date{ width:25%; } .news-right div.newsbg .newTitle{ width:60%; } .shili-info{ width:100%;} .shili-info img{ width:100%;} .honor-img ul li{ width:90%; margin: 0 auto; } .left{ float: none; width: 100%; } .right{ float: none; width: 100%; } .product_list p{ background:#eee url(../img/btn01_h.png) no-repeat 10px center; height:50px; display:block; padding-left:35px; line-height:50px; margin-bottom:15px; margin-top:0; } .product-img li{ width: 100%; margin-right: 0; float: none; } .product-img li img { width: 90%; border: solid 1px #eee; } } @media only screen and (min-width: 1337px){ .wap-header{ display: none; } .content-inner { width: 1200px; margin: 0 auto; } .products{ width: 1200px; margin: 0 auto; } .news-info{ width: 1180px; margin: 0 auto; } } .footInfo{ margin-bottom:20px;} .footInfo dl{ padding:20px; background:#e5e5e5; width:1165px; margin:0 auto; zoom:1; overflow:hidden;} .footInfo dl dt{ float:left;} .footInfo dl dd{ float:left; margin-left:15px;} .footInfo dl dd img{ height: 45px;max-width: 140px}