﻿

.banner-layout{ width:1240px; margin:0px auto auto auto; background-color:#FFFFFF; }
	
.banner
{
    position:relative;
    width:1240px;
    height:400px;
    }
.banner #ImgDisplay li
{
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    height:400px;
    z-index:1;
    }
.banner #ImgDisplay li img
{
	width:100%;
	height:400px;
	}
.banner #ImgDisplay li a
{
    display:block;
    width:1240px;
    height:400px;
    }
 
.banner #btn
{
    position:absolute;
    bottom:5px;
    height:15px;
    z-index:999;
    }
.banner #btn dt
{
    float:left;
    width:16px;
    height:16px;
    margin:0px 5px;
    cursor:pointer;
    }
.m-banner{ display:none;}
@media screen and (max-width:1023px) 
{
.banner-layout{ display:none;}
.m-banner{ position:relative; display:block; width:100%; height: calc(100vw * 0.7); }
.m-banner .swiper-container{  position:absolute; left:0px; top:0px;  width:100%; height: calc(100vw * 0.7);}
.m-banner .swiper-wrapper{  width:100%; height: calc(100vw * 0.4);}
.m-banner .swiper-slide{ position:relative;  width:100%; height: calc(100vw * 0.7); overflow:hidden;}
.m-banner .bg{ transition: all 5s ease; position:absolute; left:0px; top:0px; width:100%; height: calc(100vw * 0.7);}
.m-banner .txt{ position:absolute; left:0px; bottom:0px; width:80%; padding:0 10% 10%;}
.m-banner .txt p{  position:relative; padding-left:12%; font-size:4.2rem; color:rgba(255,255,255,0.1);}
.m-banner .txt .p1{ left:-600px; font-weight:bold; color:rgba(194,18,48,0.1)}
.m-banner .txt .p2{ left:600px; }
.m-banner .txt .p3{ left:600px; }
.m-banner .swiper-slide-active .bg{   }
.m-banner .swiper-slide-active p{ }
.m-banner .swiper-slide-active .p1{ left:0px; color:rgba(194,18,48,1)}
.m-banner .swiper-slide-active .p2{ left:0px; color:rgba(255,255,255,0.9)}
.m-banner .swiper-slide-active .p3{ left:0px; color:rgba(255,255,255,0.9)}

.m-banner .swiper-container .swiper-pagination span{ width:6px; height:6px; margin:0px 5px;opacity:1; } 
.m-banner .swiper-container .swiper-pagination .swiper-pagination-bullet{ background-color:#ffffff;}
.m-banner .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ background-color:#00a0e9;}
}

.container{ width:1240px; margin:0px auto auto auto; padding:10px 0px 30px 0px;  }
    
@media screen and (max-width:1023px) 
{
    .container{ width:90%; margin:0px auto auto auto; padding:15px 0px 30px 0px;}
}

.left-wrap{ float:left; display:inline; width:280px; }
.left-wrap .head{  position:relative;  width:100%; height:36px; line-height:36px; margin:0px auto auto auto; border-bottom:solid 1px #dfdfdf; background-color:#FFFFFF; font-size:18px; }
.left-wrap .head .text{ position:relative; float:left; display:inline; padding:0px 20px; color:#3b84d6; }
.left-wrap .head .text span{ display:block; position:absolute; left:0px; bottom:-1px; width:100%; height:1px; background-color:#3b84d6; }
.left-wrap .head .more{ position:absolute; top:0px; right:0px; width:80px; height:36px; line-height:36px; text-align:right; font-size:12px; color:#8c8c8c; }

.left-wrap .left-product-menu{ width:280px; height:581px; background-color:#FFFFFF; }
.left-wrap .left-product-menu li{ position:relative; width:260px; height:64px; line-height:32px; padding-top:5px; padding-left:20px; border-bottom:solid 1px #dfdfdf; }
.left-wrap .left-product-menu li .title{ width:260px; line-height:32px; font-size:15px; }
.left-wrap .left-product-menu li .title a{ color:#000000; }
.left-wrap .left-product-menu li .title a:hover{ text-decoration:underline; }
.left-wrap .left-product-menu li .content{ line-height:32px; }
.left-wrap .left-product-menu li .content dt{ float:left; display:inline-block; line-height:32px; padding-right:20px; }
.left-wrap .left-product-menu li .content dt a{ color:#8c8c8c; }
.left-wrap .left-product-menu li .content dt a:hover{ text-decoration:underline; }
.left-wrap .list{ width:280px; height:257px; padding-top:10px; }
.left-wrap .list li{ float:left; display:inline; width:100%; line-height:32px; border-bottom:dashed 1px #dfdfdf; font-size:14px; }
.left-wrap .list li a{ display:block; width:260px; padding-left:20px; color:#000000; }
.left-wrap .list li a:hover{ color:#3b84d6; text-decoration:underline; }

@media screen and (max-width:1023px) 
{
    .left-wrap{ float:none; display:block; width:100%; }
    .left-wrap .head{ display:none;}
    .left-wrap .list{ display:none;}
    .left-wrap .left-product-menu{ width:100%; height:auto; border-left:solid 1px #dfdfdf; border-top:solid 1px #dfdfdf;  }
    .left-wrap .left-product-menu li{ position:relative; float:left; display:inline-block; width:50%; height:auto; line-height:32px; padding:15px 0px; text-align:center; border-bottom:solid 1px #dfdfdf;  }
    .left-wrap .left-product-menu li:after{ content:"";  position:absolute; top:0px; right:0px; width:1px; height:100%; background-color:#dfdfdf;  }
    .left-wrap .left-product-menu li .title{ width:100%; line-height:32px; font-size:15px; }
    .left-wrap .left-product-menu li .content{ display:none; }
    
    }
	
.center-wrap{ float:left; display:inline; width:620px; margin-left:30px; }	
	
.right-wrap{ float:right; display:inline; width:280px; }
.right-wrap .head{ position:relative; width:100%; height:36px; line-height:36px; margin:0px auto auto auto; border-bottom:solid 1px #dfdfdf; background-color:#FFFFFF; font-size:18px; }
.right-wrap .head .text{ position:relative; float:left; display:inline; padding:0px 20px; color:#3b84d6; }
.right-wrap .head .text span{ display:block; position:absolute; left:0px; bottom:-1px;  width:100%; height:1px; background-color:#3b84d6; }
.right-wrap .head .more{ position:absolute; top:0px; right:0px; width:80px; height:36px; line-height:36px; text-align:right; font-size:12px; color:#8c8c8c; }
.right-wrap .contact{ width:238px; height:232px; padding:20px; font-size:14px; }
.right-wrap .contact p{ line-height:32px; }
.right-wrap .contact .p1{ padding-bottom:10px; font-size:16px; font-weight:600; }
.right-wrap .contact .p2 { padding-left:40px; }
	
.right-wrap .list{ width:260px; height:257px; padding-top:15px; padding-left:20px; }
.right-wrap .list li{ float:left; display:inline; width:100%; line-height:28px; font-size:14px; }
.right-wrap .list li a{ color:#000000; }
.right-wrap .list li a:hover{ color:#3b84d6; text-decoration:underline; }
	
@media screen and (max-width:1023px) 
{
    .center-wrap{ float:none; display:block; width:100%; margin-left:0px; }
    .right-wrap{ float:none; display:block; width:100%; }
    .right-wrap .head .text{ padding:0px 10px; font-size:16px;  }
    .right-wrap .contact{ width:90%; height:auto; margin:0px auto auto auto; padding:10px 0px; font-size:13px; }
    .right-wrap .contact .p1{ padding-bottom:0px; }
    
    .right-wrap .list{ width:90%; height:auto; margin:0px auto auto auto; padding-top:15px; padding-left:0px; }
    .right-wrap .list li{ font-size:13px; }
}
    
/*产品*/
.product-head{ position:relative; width:100%; height:36px; line-height:36px;  margin:0px auto auto auto; border-bottom:solid 1px #dfdfdf; background-color:#FFFFFF; font-size:18px; }
.product-head .more
{
    position:absolute;
    top:0px;
    right:0px;
    width:80px;
    height:36px;
    line-height:36px;
    text-align:right;
    font-size:12px; color:#8c8c8c; }
.product-head li
{
    position:relative;
    float:left;
    display:inline;
    padding:0px 20px;
    }
.product-head li a
{
    color:#000000;
    }
.product-head li.liMover a
{
    color:#3b84d6;
    }
.product-head li.liMover span
{
    display:block;
    position:absolute;
    left:0px;
    bottom:-1px;
    width:100%;
    height:1px;
    background-color:#3b84d6;
    }
    
.product-list
{
    width:100%;
    height:272px;
    margin:0px auto auto auto;
    background-color:#FFFFFF;
	}
.product-list li
{
    position:relative;
	float:left;
	display:inline;
	width:300px;
	height:252px;
	margin:10px 5px;
	text-align:center;
	cursor:pointer;
	}
.product-list li .img
{
	width:268px;
	height:220px;
	margin:0px auto auto auto;
	overflow:hidden;
	}
.product-list li img
{
	width:268px;
	height:220px;
	transform: translateZ(0px);
    transition: transform 0.2s ease 0s;
	}
.product-list li img:hover
{
	transform: scale(1.1, 1.1);
    transition: transform 0.6s ease 0s;
	}
.product-list li .title
{
    width:298px;
	height:32px;
	line-height:32px;
	margin:0px auto auto auto;
	text-align:center;
	font-size:13px;
	color:#333333;
	}
.product-list li .title a
{
    color:#333333;
    }
.product-list li .title a:hover
{
    text-decoration:underline;
    color:#3b84d6;
    }
    
.product-list .ConMover
{
    display:block;
    }
.product-list .ConMout{ display:none; }

@media screen and (max-width:1023px) 
{
    .product-head{ font-size:16px; margin-top:10px; }
    .product-head li{ padding:0px 10px; }
    .product-list{ height:auto; padding:10px 0px;}
    .product-list li{float:none; width:100%; height:auto; margin:10px 0px; }
    .product-list li .img{ width:100%; height:auto; }
    .product-list li img{ width:100%; height:auto; }
    .product-list li img:hover{ transform: scale(1); }
    .product-list li .title{ width:100%; font-size:13px; }
    
}
