/*头部*/
.hd-top {
overflow: hidden;
background-color: #3f3f3f;
height: 38px;
line-height: 14px;
color: #fff;
font-size: 14px;
}
.hd-top p {
float: left;
}
.hd-top .lang {
float: right;
}
.hd-top .lang li {
float: left;
position: relative;
padding: 0 10px;display: block;
}
.hd-top .lang li.xian {
padding: 0;
color: #ffffff;
}
.hd-top .lang li a {
color: #fff; text-decoration: none;
}
.hd-top .lang li a:hover {
color: #fff;
}
.wp {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.product{
width: 1200px;
margin: 38px auto 72px ;
display: flex;
justify-content: space-between;
}
.product-c{
width: 208px;
height: 309px;
background: #FFFFFF;
box-shadow: 0px 3px 8px 1px rgba(0,0,0,0.13);
border-radius: 16px 16px 16px 16px;
cursor:pointer;
}
.product-c:hover .product-c-top>img{
transform: scale(1);
}
.product-c2:hover .product-c2-top>img{
transform: scale(1);
}
.product-c-top{
width: 208px;
height: 210px;
background: #F5F5F5;
border-radius: 16px 16px 16px 16px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.product-c-top>img{
width: 162px;
height: 164px;
transition: all .6s;
}
.product-c-b{
font-size: 16px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #333333;
display: flex;
flex-direction: column;
align-items: center;
margin: 24px 0 0px 0;
}
.product-c2{
width: 272px;
height: 369px;
background: #FFFFFF;
box-shadow: 0px 3px 8px 1px rgba(0,0,0,0.13);
border-radius: 16px 16px 16px 16px;
cursor:pointer;
}
.product-c2-top{
width: 272px;
height: 272px;
background: #F5F5F5;
border-radius: 16px 16px 16px 16px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.product-c2-top>img{
width: 206px;
height: 206px;
transition: all .6s;
}
.product-c2-b{
font-size: 16px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #333333;
display: flex;
flex-direction: column;
align-items: center;
margin: 24px 0 0px 0;
}
.company{
width: 100%;
background: #F5F5F5;
}
.company-c{
width: 1200px;
margin: 24px auto 0;
display: flex;
justify-content: space-between;
}
.company-c-l{
width: 571px;
height: 352px;
position: relative;
}
.company-c-l>img{
width: 100%;
height: 100%;
}
.company-c-l-img{
width: 109px !important;
height: 109px !important;
position: absolute;
top: -80px;
left: 10px;
}
.company-c-r{
width: 600px;
/* height: 144px; */
}
.company-c-r-t{
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #666666;
}
.company-c-r-b{
width: 600px;
display: flex;
align-items: center;
margin: 32px 0 0 0 ;
}
.c-r-b-b{
width: 200px;
display: flex;
align-items: center;
flex-direction: column;
}
.c-r-b-b-big{
font-size: 24px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #F6B81D;
}
.c-r-b-b-big>span{
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #F6B81D;
}
.c-r-b-b-small{
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #666666;
}
.c-r-b-img{
width: 200px;
height: 144px;
position: relative;
cursor:pointer;
}
.c-r-b-img>img{
width: 100%;
height: 100%;
}
.c-r-b-imgs{
display: flex;
align-items: center;
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #C31F13;
position: absolute;
right: 0;
top: 85px;
}
.c-r-b-imgs>img{
width: 19px;
height: 19px;
margin: 0 0 0 6px;
}
.news{
width: 1200px;
margin: 54px auto 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.news ul{ width:1230px; float:right; margin:0px -30px 0px 0px; overflow:hidden; padding:0px;}
.news-c{
width: 580px;
height: 130px;
box-shadow: 0px 3px 10px 1px rgba(0,0,0,0.16);
border-radius: 16px 16px 16px 16px;
position: relative;
margin: 0 30px 54px 0;
cursor:pointer; float:right;
}
.news-c-b{
width: 580px;
height: 328.08px;
overflow: hidden;
}
.news-c-b>img{
width: 580px;
height: 328.08px;
transition: all .6s;
}
.news-c-b>img:hover {
transform: scale(1.1);
}
.news-c-t{
width: 428px;
height: 30px;
margin: 0px 0 0 120px;
padding: 20px 0 20px 0;
}
.news-c-t:hover span{
color: rgba(195, 31, 19, 1);
}
.news-c-t:hover p{
color: rgba(195, 31, 19, 1);
}
.news-c-t>p{
width: 250px;
font-size: 18px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
margin: 0px 0 16px 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.news-c-t>span{
width: 428px;
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #666666;
overflow: hidden;
/* white-space: nowrap; */
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.news-c-t-img{
width: 96.98px;
height: 88px;
background-image: url('../img/bg2.png');
background-repeat: no-repeat;
background-size:100% 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: absolute;
top: -19px;
left: -13px;
}
.news-c-t-img>div{
font-size: 20px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #FFFFFF;
}
.news-c-t-img>span{
display: block;
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
/* .news-c-t-img>img{
width: 96.98px;
height: 88px;
} */
.p-list{
width: 1200px;
margin: 32px auto 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.p-lists{
width: 373px;
height: 364px;
position: relative;
cursor:pointer;
margin: 0 0 32px 0;
}
.lists-t{
width: 373px;
height: 329px;
background: #FBFBFB;
box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
border-radius: 16px 16px 16px 16px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.lists-t>img{
width: 228px;
height: 228px;
transition: all .6s;
}
.lists-t:hover img{
transform: scale(1.2);s
}
.lists-b{
width: 209px;
height: 72px;
background: #FFFFFF;
box-shadow: 0px 0px 6px 1px rgba(135,9,0,0.15);
border-radius: 8px 8px 8px 8px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 16px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #333333;
position: absolute;
bottom:0px;
left: 82px;
}
.lists-b>img{
width: 19px;
height: 19px;
margin: 8px 0 0 0;
}
.superiority{
width: 1200px;
display: flex;
align-items: center;
margin: 40px auto 0;
justify-content: space-between;
}
.s-list{
width: 282px;
height: 307px;
display: flex;
align-items: flex-end;
position: relative;
}
.s-list-b{
width: 282px;
height: 261px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
/* background: #FFFFFF;
box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.16);
border-radius: 16px 16px 16px 16px; */
}
.s-list-b>div{
width: 218px;
font-size: 18px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
text-align: center;
}
.s-list-b>p{
width: 218px;
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #333333;
line-height: 24px;
margin: 24px 0 0 0;
}
.s-bg{
background-image: url('../img/bg3.png');
background-repeat: no-repeat;
background-size:100% 100%;
}
.s-bg2{
background-image: url('../img/bg4.png');
background-repeat: no-repeat;
background-size:100% 100%;
}
.s-bg3{
background-image: url('../img/bg5.png');
background-repeat: no-repeat;
background-size:100% 100%;
}
.s-bg4{
background-image: url('../img/bg6.png');
background-repeat: no-repeat;
background-size:100% 100%;
}
.s-list-t{
width: 80px;
height: 80px;
position: absolute;
top: 15px;
left: 101px;
}
.plant{
width: 1200px;
margin: 0 auto;
display: flex;
}
.plant-l{
width: 792px;
}
.plant-l-t{
display: flex;
align-items: flex-end;
}
.plant-l-t>img{
width: 384px;
height: 248px;
}
.plant-l-t-r{
width: 384px;
}
.plant-l-t-r>div{
font-size: 18px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
}
.plant-l-t-r>span{
font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #999999;
margin: 4px 0 16px 0;
}
.plant-l-t-r>p{
font-size: 14px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #666666;
line-height: 22px;
}
.plant-r{
}
.plant-r>img{
width: 384px;
height: 248px;
}
.buton{
width: 119px;
height: 33px;
background: #C31F13;
border-radius: 4px 4px 4px 4px;
font-size: 16px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
cursor:pointer;
margin: 0 auto;
}