html,
body {
padding: 0;
margin: 0;
height: 100%;
overflow-x: hidden;
}
a,
li {
list-style: none;
text-decoration: none;
color: #000000;
}
div {
/* border: 1px solid black; */
}
input:focus {
border: none;
}
input {
background: none;
outline: none;
border: none;
}
footer {
/* height: 50px; */
}
/* 轮播·图 */
/*--------------SLIDER----------------*/
#slider {
width: 100%;
}
#slider>ul{
margin:0;
padding:0;
}
/*--------------CONTROLS--------------*/
/*position controls*/
.controls li {
top: 50%;
margin-top: -30px
}
.controls li:nth-child(1) {
left: 0;
}
.controls li:nth-child(2) {
right: 0;
}
/*------------PAGINATION------------*/
/*style pagination*/
.pagination li {
background-color: #ddd;
}
.pagination li.active {
background-color: #4789D4;
}
/*-------------HELPERS----------------*/
.responsive {
width: 100%;
height: auto;
}
.clearfix:after {
content: "";
display: table;
clear: both;
}
/* 电脑 */
@media screen and (min-width: 1200px) {
/* 产品分类 */
#productType{
width: 100%;
height: 60%;
margin-top: 2%;
}
/* 字*/
.productType .title{
width: 100%;
height: 66px;
text-align: center;
line-height: 2;
font-size: 24px;
margin-bottom: 1%;
position: relative;
top: -1px;
}
/* 花边图片 */
.productType .title img{
width: 80%;
height: 55px;
}
.productType .title h4{
position: relative;
top: -59%;
}
.productType .title p{
font-size: 15px;
color: #666;
position: relative;
top: -58%;
}
/* 分类列表 */
#productType #typeList{
margin-top: 5px;
margin-left: 5%;
}
#productType #typeList ul {
padding: 0;
width: 90%;
margin: 0 auto;
}
#productType #typeList li{
float: left;
border: 1px solid #CCCCCC;
width: 14%;
height:160px;
text-align: center;
padding: 1% 0.2%;
margin: 0.8%;
}
#productType #typeList li:hover{
box-shadow:5px 4px 4px #888888;
}
/* 分类图标 */
.typeImg{
max-width: 70%;
max-height:70%
}
#typeList li a{
width: 100%;
height: 100%;
display: block;
}
#productType #typeList li p{
padding:20px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 公司介绍 */
.gsjj{
clear: both;margin-top: 10px;
}
#gsimg{
width:600px;margin-top: 20px;margin-left: 10%;
float: left;
margin-bottom: 3%;
}
#gsimg img{
width:100%;
}
#text{
width: 35%;
float: left;
margin-left: 4%;
font-size: 17px;
line-height:38px;
margin-top: 1.5%;
}
/* 推荐产品 */
#tjcp{
margin: 0 auto;
width: 90%;
margin-bottom: 30%;
}
#tjcp ul {
margin: 0 auto;
}
#tjcp ul li{
width: 16%;
height: 157px;
border: 1px solid #CCCCCC;
text-align: center;
float: left;
margin: 17px;
}
#tjcp ul li div:first-child{
width: 100%;
height: 130px;
/* border: 1px solid #CCCCCC; */
}
#tjcp ul li img{
width: 100%;
height: 100%;
}
/*解决方案 */
/* 盒子 */
.solution-box{
/* border: 1px solid; */
width: 382px;height: 510px;margin-left: 5%;
background-color: #FFFFFF;
float: left;
margin-left: 4%;
}
/* 方案标题 */
.solution-box .tit{
font-size: 24px;font-weight: 400;color: #000000;text-align: center;margin-top: 3%;
}
/* 分割线 */
.solution-box .box-divide{
width: 77%;display: block;height: 1px;margin: 0 auto;background: black;
}
/* 方案列表 */
.solution-box .box-list{
list-style-type: none;
padding: 0 25px;
margin-top: 10px;
box-sizing: border-box;
}
.solution-box .box-list li{
font-size: 15px;
text-align: center;
margin: 5px 0;
}
.solution-box .box-list a{
font-size: 15px;
font-weight: 400;
color: #000;
line-height: 38px;
width: 315px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.solution-box .box-list a:hover{
color: #4789D4;
}
/* 新闻资讯 */
.newBox{
clear: both;margin-top: 10px;height: 686px;
}
/* 分类栏 */
#newsTab{
margin: 10px;
height: 40px;
}
#newsTab ul {
width: 80%;
position: relative;
left: 29%;
}
#newsTab ul li{
line-height: 2;
float: left;
border-radius: 20px;
margin: 0 10px;
text-align: center;
width: 140px;
height: 38px;
line-height:38px;
}
#newsTab ul li a{
display: block;
width: 100%;
height: 100%;
}
/* #newsTab ul li a:hover{
color: white;
border: none;
} */
.newTabLink{
color: white;
background-color: red;
}
.newTabLink a{
color: white;
border: none;
}
/* 底部title */
.index-news-title{
font-size: 22px;
padding: 19px;
position: relative;
height: 110px;
left: 3%;
bottom: 10px;
width: 370px;
box-sizing: border-box;
background-color: #fff;
top: -86px;
}
.index-news-con .newsImg{
width: 390px;
height: 441px;
overflow: hidden;
position: relative;
overflow: hidden;
float: left;
}
.index-news-con .newsImg .mainImg{
width: 100%;
height: 100%;
transition:all .3s ease 0s;
transform:scale(1);
}
.right{
width: 35px;
height: 35px;
transform: rotate(89deg);
position: relative;
top: -2%;
left: 41%;
transition:all 0.6s ease 0s;
}
.index-news-con .newsImg:hover .right{
left: 45%;
}
.index-news-con .newsImg:hover .mainImg{
transform: scale(1.2);
}
/* 右侧新闻 */
.newItem{
display: none;
}
.index-news-con .rigthNew{
float: left;
width: 100%;
}
.newInfo{
border-top: 1px solid #CCCCCC;
}
.index-news-con .rigthNew ul li{
width: 29%;
height: 213px;
text-align: center;
float: left;
margin: 17px;
}
.rigthNew .newTit{
height:30px;
line-height:30px;
overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;
}
.index-news-con .rigthNew li p{
font-size: 15px;
height:85px;
overflow:hidden;
text-align: left;
text-indent:2em;
}
.index-news-con .rigthNew li .newDate{
width: 20%;
}
.index-news-con .rigthNew li .right{
top: -43px;
}
.rigthNew li:hover.right{
left: 45%;
}
#model_new{
display: none;
}
#zlzs li{
width: 15%;
float: left;
margin:15px 5px;
}
#zlzs img{
width: 100%;
height: 100%;
}
#zlzs{
position: relative;
left: 9%;
}
#hzhb li{
width: 18.8%;
height:100px;
line-height:100px;
margin:1% 3%;
float:left;
text-align:center;
}
#hzhb img{
max-width: 180px;
max-height: 85px;
isplay: inline-block;
vertical-align: middle;
}
#hzhb{
width:80%;
height:260px;
position: relative;
left: 9%;
}
.newBox{
display: block;
}
#link{
border-top:1px dashed #b2b2b2;
padding-top:20px;
clear: both;
margin:15px auto;
width:80%;
height: auto;
}
#link span{
padding: 2px 8px;
}
}
/* 平板 */
@media screen and (min-width: 460px) and (max-width:1200px) {
/* 产品分类 */
#productType{
width: 100%;
margin-top: 2%;
}
/* 字*/
.productType .title{
width: 100%;
height: 66px;
text-align: center;
line-height: 2;
font-size: 24px;
}
/* 字*/
.productType .title{
width: 100%;
height: 66px;
text-align: center;
line-height: 2;
font-size: 24px;
margin-bottom: 1%;
}
/* 花边图片 */
.productType .title img{
display: none;
}
.productType .title p{
font-size: 15px;
color: #666;
}
#productType .title p{
font-size: 15px;
color: #666;
}
/* 分类列表 */
#productType #typeList{
margin-top: 40px;
margin-left: 10%;
}
#productType #typeList ul {
padding: 0;
width: 90%;
}
#productType #typeList li{
float: left;
border: 1px solid #CCCCCC;
width: 14%;
height: 150px;
text-align: center;
padding: 2%;
margin: 1%;
}
#productType #typeList li:hover{
box-shadow:5px 4px 4px #888888;
}
/* 分类图标 */
.typeImg{
width: 80%;
height: 90px;
}
#typeList li a{
width: 100%;
height: 100%;
display: block;
}
#productType #typeList li p{
padding:5px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 公司介绍 */
.gsjj{
clear: both;margin-top: 10px;
}
#gsimg{
width:100%;margin-top: 20px;
float: left;
}
#gsimg img{
width:100%;
}
#text{
display: none;
}
/*解决方案 */
/* 盒子 */
.solution-box{
/* border: 1px solid; */
width:100%;height: 510px;margin-left: 5%;
background-color: #FFFFFF;
float: left;
margin-left: 3%;
}
.solution-box img{
width: 100%;
height: 200px;
}
/* 方案标题 */
.solution-box .tit{
font-size: 24px;font-weight: 400;color: #000000;text-align: center;margin-top: 3%;
}
/* 分割线 */
.solution-box .box-divide{
width: 77%;display: block;height: 1px;margin: 0 auto;background: black;
}
/* 方案列表 */
.solution-box .box-list{
list-style-type: none;
padding: 0 25px;
margin-top: 10px;
box-sizing: border-box;
}
.solution-box .box-list li{
font-size: 15px;
text-align: center;
margin: 5px 0;
}
.solution-box .box-list a{
font-size: 28px;
font-weight: 400;
color: #000;
line-height: 38px;
width: 315px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.solution-box .box-list a:hover{
color: #4789D4;
}
/* 推荐产品 */
#tjcp{
margin: 0 auto;
width: 90%;
}
#tjcp ul {
margin: 0 auto;
}
#tjcp ul li{
width: 16%;
height: 157px;
border: 1px solid #CCCCCC;
text-align: center;
float: left;
margin: 17px;
}
#tjcp ul li div:first-child{
width: 100%;
height: 130px;
/* border: 1px solid #CCCCCC; */
}
#tjcp ul li img{
width: 100%;
height: 100%;
}
#model_new{
position: relative;
width: 90%;
float: left;
}
#model_new li{
text-align:center;
width: 100%;
height: 40px;
line-height:40px;
margin: 2px 0;
border-bottom: 1px solid #CCCCCC;
overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;
}
#zlzs li{
width: 15%;
height: 230px;
float: left;
margin-right: 10px;
}
#zlzs img{
width: 100%;
height: 100%;
}
#hzhb li{
width: 150px;
height:80px;
line-height:100px;
margin:15px 35px;
float:left;
text-align:center;
}
#hzhb img{
max-width: 150px;
max-height: 65px;
isplay: inline-block;
vertical-align: middle;
}
#hzhb{
width:80%;
height:260px;
position: relative;
left: 9%;
}
.newBox,.footer{
display: none;
}
}
/* 手机 */
@media screen and (max-width: 460px) {
.newBox,.pagination{
display: none;
}
/* 产品分类 */
#productType{
width: 100%;
margin-top: 2%;
}
/* 字*/
.productType .title{
width: 100%;
height: 66px;
text-align: center;
line-height: 2;
font-size: 24px;
}
/* 字*/
.productType .title{
width: 100%;
height: 66px;
text-align: center;
line-height: 2;
font-size: 24px;
margin-bottom: 1%;
}
/* 花边图片 */
.productType .title img{
display: none;
}
.productType .title p{
font-size: 15px;
color: #666;
}
/* 分类列表 */
#typeList{
margin-top: 10px;
}
#productType #typeList ul {
padding: 0;
overflow: auto;
width: 100%;
}
#productType #typeList li{
float: left;
border: 1px solid #CCCCCC;
width: 40%;
height: 136px;
text-align: center;
padding: 5%;
margin: 5%;
}
#productType #typeList li:hover{
box-shadow:5px 4px 4px #888888;
}
/* 分类图标 */
.typeImg{
width: 80%;
height: 65px;
}
#typeList li a{
width: 100%;
height: 100%;
display: block;
}
/* 公司介绍 */
.gsjj{
clear: both;margin-top: 10px;
}
#gsimg{
width:100%;
}
#gsimg img{
width:100%;
}
#text{
display: none;
}
/* 推荐产品 */
#tjcp{
margin: 0 auto;
width: 90%;
}
#tjcp ul {
margin: 0 auto;
}
#tjcp ul li{
width: 48%;
height: 154px;
border: 1px solid #CCCCCC;
text-align: center;
float: left;
margin: 2px;
}
#tjcp ul li div:first-child{
width: 100%;
height: 130px;
/* border: 1px solid #CCCCCC; */
}
#tjcp ul li img{
width: 100%;
height: 100%;
}
/*解决方案 */
/* 盒子 */
.solution-box{
/* border: 1px solid; */
width: 382px;height: 510px;margin-left: 5%;
background-color: #FFFFFF;
float: left;
margin-left: 3%;
}
/* 方案标题 */
.solution-box .tit{
font-size: 24px;font-weight: 400;color: #000000;text-align: center;margin-top: 3%;
}
/* 分割线 */
.solution-box .box-divide{
width: 77%;display: block;height: 1px;margin: 0 auto;background: black;
}
/* 方案列表 */
.solution-box .box-list{
list-style-type: none;
padding: 0 25px;
margin-top: 10px;
box-sizing: border-box;
margin-left: -5%;
}
.solution-box .box-list li{
font-size: 15px;
text-align: center;
margin: 5px 0;
}
.solution-box .box-list a{
font-size: 16px;
font-weight: 400;
color: #000;
line-height: 38px;
width: 315px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.solution-box .box-list a:hover{
color: #4789D4;
}
/* 移动端新闻 */
#newsTab{
display: none;
}
.index-news-con{
display: none;
}
#model_new{
position: relative;
width: 90%;
float: left;
}
#model_new li{
text-align:center;
width: 100%;
height: 40px;
line-height:40px;
margin: 2px 0;
border-bottom: 1px solid #CCCCCC;
overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;
}
.newBox{
clear: both;margin-top: 10px;height: 406px;
}
#zlzs li{
width: 41%;
height: 230px;
float: left;
margin-right: 10px;
}
#zlzs img{
width: 100%;
height: 100%;
}
#hzhb li{
width: 135px;
height:70px;
line-height:70px;
margin:5px;
float:left;
text-align:center;
}
#hzhb img{
max-width: 120px;
max-height: 57px;
isplay: inline-block;
vertical-align: middle;
}
#link{
display: none;
}
.newTitle{
display: none;
}
}