/*.main{padding: 88px 0 380px;}*/
.device01 { background: #111; position: relative; overflow: hidden; }
.device02 { width: 404px; height: 62px; background: #df0615; position: relative; margin: 0 auto; overflow: hidden;    margin-top: -30px; margin-bottom: -30px; z-index: 9; }
.device01 .arrow-left { background: url(../images/arrows.png) no-repeat left top; position: absolute; left: 14.3%; top: 50%; width: 30px; height: 58px; z-index: 9; margin-top: -29px;    opacity: 0.6;}
.device01 .arrow-right { background: url(../images/arrowsnext.png) no-repeat left bottom; position: absolute; right:14.3%; top: 50%; width: 30px; height: 58px; z-index: 9; margin-top: -29px; }
.device02 .arrow-left { background: url(../images/arrowsup.png) no-repeat center; position: absolute; right: 10px; top: 4px; width: 15px; height: 15px; z-index: 9; }
.device02 .arrow-right { background: url(../images/arrowsdown.png) no-repeat center; position: absolute; right: 10px; bottom: 4px; width: 15px; height: 15px; z-index: 9; }
.deviceTitle{background: url(../images/titlebg02.png) no-repeat;position: absolute;width: 109px;height: 58px;text-align: center;    top: 2px; left: 2px;    z-index: 10; background-size: contain;}
.deviceTitle p{    line-height: 58px;color: #666; font-family: arial; width: 98px}
.device02 .swiper-slide p{color: #fff;    height: 62px;font-size: 22px;font-family: \5FAE\8F6F\96C5\9ED1;    letter-spacing: 1.1px;    padding-left: 135px; line-height: 62px;text-overflow: ellipsis; white-space: nowrap;overflow: hidden;    width: 245px;}
.swiper-slide img{ width: 100%;}
.bannerTitle{position: absolute;z-index: 9;color: #fff;top: 21.5%;left: 310px;background: url(../images/bannerbg1px.png) repeat;border-left: 4px solid #df0615;    width: 287px; padding: 15px 15px 15px 13px;}
.bannerTitle h2{font-size: 14px;text-overflow: ellipsis; white-space: nowrap;overflow: hidden;}
.bannerTitle p{font-size: 12px;line-height: 21px; margin-top: 13px;display: -webkit-box; -webkit-line-clamp: 3;overflow: hidden; -webkit-box-orient: vertical; word-break: break-all;}
/*浜у搧浠嬬粛*/
.main .title{margin:0 auto;margin-bottom: 28px;display:table;text-align: center;}
.main .title h2{font-size: 24px;color: #333;}
.main .title p{color: #df0615;font-size: 12px;    background: url(../images/titlebg.png) no-repeat center bottom; padding-bottom: 11px;margin-top: 7px;}
.productWrap .productImg{display:block;background: url(../images/productimgbg.png) no-repeat center;    background-size: contain;}
.productWrap .productImg img{max-width: 100%;}

.product{background: url(../images/introduce.png) repeat;position: relative;padding-bottom: 56px;padding-top: 75px;}
.productWrap ul{display:flex;flex-wrap:wrap;row-gap:32px;}
.productWrap ul::after{display:none;}
.productWrap li{float:none;width:25%;min-width:0;text-align:center;}
.productWrap li .more{border: 1px solid #e7e7e7;font-size: 12px;color: #666666;background: #fff;    display: inline-block; height: 32px; line-height: 32px; padding: 0 18px; letter-spacing: 0.8px; margin-top: 31px;}

.productWrap p a{ font-family: arial; font-size: 14px; line-height:22px; color: #333;display: block;letter-spacing: -0.1px; margin-top: 18px; overflow: hidden;
text-overflow:ellipsis; white-space: nowrap;}

.LookMore{    position: absolute; bottom: -23px; left: 50%;height: 45px; margin-left: -20px;    z-index: 14;}
.LookMore>div{display: inline-block;background: url(../images/lookmorebg.png) no-repeat;    width: 84px; height: 45px; float: right; line-height: 45px; text-align: center; font-size: 12px; color: #ccc;    margin-left: 8px; padding-left: 3px;display: none;}
.LookMore a{display: inline-block;}
/*鍏徃浠嬬粛*/
.introduce{    padding-top: 62px; padding-bottom: 50px;}
.introduceLeft{float: left;width: 50%;}
.introduceLeft td>div{background: #df0615;padding: 19px 27px 19px 29px;    height:100%; position: relative;
box-sizing:border-box;
    text-align: justify;
}
.introduceLeft table{ margin-right: -1px;margin-top: -1px;}
.introduceRight{float: right;width: 50%;}
.introduceRight img{max-width: 100%;}
.introduceLeft a{display: inline-block;border: 1px solid #fff;width: 100px;height: 22px;background: url(../images/introducemore.png) no-repeat center;    position: absolute; bottom: 25px; right: 23px;}
.introduceLeft a:hover{
background: url(../images/introducemorered.png) no-repeat center; 
  background-color:#FFF;
}
.introduceLeft p{font-size: 14px;color: #fff;
letter-spacing: 0.86px;line-height: 24px;display: -webkit-box; -webkit-line-clamp: 10;
overflow: hidden; -webkit-box-orient: vertical; word-break: break-all;}
.introduceRight .introduceImgSj{display: none;}
/*鏂伴椈璧勮*/
.news{background: url(../images/newsbg.png) repeat;padding-bottom: 51px;padding-top: 46px;position: relative;}
.newsWrap li img{max-width: 100%;    transition: all 1s ease 0s;}

.newsWrap li{float: left;width:31.33%;text-align: center;margin: 0 1%;}
.newsWrap li h2{display:block;}
.newsWrap li h2 a{font-size: 14px;color: #666;display: inline-block;letter-spacing: 0.8px;    margin-top: 19px;text-overflow: ellipsis; white-space: nowrap;overflow: hidden;width: 100%;}
.newsWrap li p{ padding: 0 16px;margin-top: 9px;height:63px;overflow:hidden;}
.newsWrap li p a{font-size: 12px;color: #666;width:100%;display: -webkit-box;-webkit-box-orient: vertical;
    -webkit-line-clamp:3;overflow: hidden;text-overflow: ellipsis;line-height: 21px;height:63px;}
.newsWrap ul{margin: 0 -1%;}
.newsWrap li>div{border: 1px solid #e7e7e7;    padding-bottom: 14px;background: #fff;}
.newsWrap li .newsImg{overflow: hidden;display:block;}

/*璧炲姪娲诲姩*/
.activity{position: relative;}
.activityWrap>div{float: left;width: 50%;overflow: hidden;position: relative;}
.activityWrap img{max-width: 100%;transition: all 1s ease 0s;}

.activityWrap .activityLeftBg{position: absolute;width: 100%;height: 100%;transition: all 1s ease 0s;top: 200px;}
.activityWrap .activityLeftBg img{width: 100%;}
.activityInformation{color: #fff;position: absolute; top: 200px;   transition: all 1s ease 0s; padding: 20px 45px 20px 28px;}
.activityInformation h2{font-size: 14px;letter-spacing: 0.8px;    margin-bottom: 12px;}
.activityInformation p{font-size: 12px;    line-height: 21px; margin-top: 3px;}
.activityWrap a{position: absolute;bottom: -228px;transition: all 1s ease 0s;font-size: 12px;color: #fff;background: url(../images/introducemore.png) no-repeat right;    padding-right: 19px; background-size: 12px;    right: 58px;}
.activity{border-bottom: 1px solid #f3f3f3;padding-bottom: 65px;padding-top: 61px  ;margin-bottom: 20px;}
.activityWrap .activityImg{position:relative;overflow: hidden;}
/*.activityRight .activityLeftBg,.activityRight .activityInformation,.activityRight a{display: none;}*/
/*鎮诞*/
.activityInformation h2:hover{color: #df0615;}
.activityWrap a:hover{color: #df0615;background: url(../images/introducemorehover.png) no-repeat right;    background-size: 12px;}
.activityWrap>div:hover .activityInformation{top: 0;}
.activityWrap>div:hover .activityLeftBg{top: 0;}
.activityWrap>div:hover a{bottom: 28px;}
.productWrap p a:hover{color: #df0615;}
.activityWrap>div:hover img{-webkit-transform: scale(1.1); transform: scale(1.1);}
.newsWrap li h2 a:hover{color: #df0615;}
.newsWrap li>div:hover{border: 1px solid #df0615;border-bottom: 4px solid #df0615;}
.productWrap .productImg:hover{background: url(../images/productimgbgon.png) no-repeat center;    background-size: contain;}
.productWrap li .more:hover{border: 1px solid #df0615;background: #df0615;color: #fff;}
@media (max-width: 1024px){
  .device01 .arrow-left{left: 20px;}
  .device01 .arrow-right{right: 20px;}
  .bannerTitle{left: 200px;}
}
@media (min-width: 1371px)and(max-width:1920px){
  .swiper-slide img{ width: 1500px;height:480px; left: 0; margin-left: 0;}
}
@media (min-width: 1000px)and(max-width:1370px){
  .device01 .swiper-wrapper{overflow: hidden;}
  .swiper-slide img{ width: 1500px;height:480px; left: 0; margin-left: -135px;}
  .device01 .swiper-slide{position:relative; overflow: hidden;}
}
@media (max-width: 999px){
/*鎵嬫満绔幓闄ゆ偓娴*/
.activityInformation h2:hover{color: #fff;}
.activityWrap a:hover{color: #fff;background: url(../images/introducemore.png) no-repeat right;    background-size: 12px;}
.productWrap p a:hover{color: #333;}
.productWrap .productImg:hover{background: url(../images/productimgbg.png) no-repeat center;    background-size: contain;}
.productWrap li .more:hover{border:1px solid #e7e7e7;background: #fff;color: #666;}
.newsWrap li h2 a:hover{color: #666;}
.newsWrap li>div:hover{border: 1px solid #e7e7e7;}
.activityWrap>div:hover img{-webkit-transform:inherit; transform:inherit;}
.activityWrap .activityLeftBg{position: absolute;width: 100%;height: 100%;top: 0;}
.activityInformation{color: #fff;position: absolute; top: 0;    padding: 20px 45px 20px 28px;}
  .main{padding: 70px 0 170px;}
  .activityInformation { padding: 10px 5% 20px 5%; width: 90%; }
  .activityWrap a{right: 22px;    bottom: 10px!important;}
  .activityInformation p{text-overflow: ellipsis; white-space: nowrap;overflow: hidden;}
  .bannerTitle { left: 139px; }
}
@media (max-width: 768px){
  .product{padding-top: 66px;padding-bottom: 30px;}
  .introduceLeft td>div{height: 160px;}
  .introduce { padding-top: 59px; padding-bottom: 40px; }
  .news{padding-bottom: 33px;padding-top: 49px;}
  .activity { padding-bottom: 58px; padding-top: 62px;
}
}
@media (max-width: 767px){
.introduceRight .introduceImgSj{display: block;}
.introduceRight .introduceImgPc{display: none;}
.newsWrap ul,.newsWrap li{ margin: 0; }
.activityInformation h2:hover{color: #333;}
.activityWrap a:hover{color: #666;background: url(../images/introducemoreon.png) no-repeat right;    background-size: 12px;}
.introduce{padding-bottom: 0;}
.productWrap ul{row-gap:0;}
.productWrap li { width: 42%; margin: 0 4%;    margin-bottom: 29px; }
.introduceLeft,.introduceRight{float: inherit;width: inherit;}
.introduceRight img{width: 100%;}
.introduceLeft p{display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; word-break: break-all;letter-spacing: 0.75px;   margin-bottom: 55px;}
.introduceLeft td>div{height: inherit;    padding: 19px 12px 24px 16px;}
.introduceLeft table{margin-right: 0;}
.introduceLeft a{     right: inherit;bottom: 30px; margin-left: -51px; left: 50%;}
.productWrap li .more{margin-top: 15px;}
.main .title p{padding-bottom: 10px; margin-top: 6px;}
.newsWrap li img{width: 100%;}
.newsWrap li{width: 100%;float: inherit;margin-bottom: 19px;}
.activityWrap>div{float:inherit;width: 100%;}
.activityImg img{width: 100%;}
.activityInformation{color: #666666;position:inherit;background: #f9f9f9;    padding: 17px 3% 48px 3%; width: 94%;}
.activityInformation p{white-space:inherit;display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;}
.activityInformation h2{color: #333;    margin-bottom: 11px;}
.activityWrap a{color: #666;background: url(../images/introducemoreon.png) no-repeat right;    right: 22px; bottom: 19px;}
.activityRight .activityLeftBg,.activityRight .activityInformation,.activityRight a{display: block;}
.activityLeft{margin-bottom: 23px;}
.device01 .arrow-left,.device01 .arrow-right{display: none;}
.device02 .arrow-left,.device02 .arrow-right{display: none;}
.bannerTitle { left: 50px;    top: 35px; }
.bannerTitle p{display: -webkit-box; -webkit-line-clamp: 2;overflow: hidden; -webkit-box-orient: vertical; word-break: break-all;}
.device02 .swiper-slide p{    font-size: 14px;height: 44px;line-height: 44px;letter-spacing: 0.6px;padding-left: 94px;width: 156px;opacity: 0.8;}
.device02{    height: 44px;width: 275px;margin-top: -22px;}
.deviceTitle{    width: 74px; height: 38px;    top: 3px; left: 4px;}
.deviceTitle p{    line-height: 38px;font-size: 12px; width: 64px;}
.device02 .arrow-right{right: 4px; bottom: -2px;}
.device02 .arrow-left{right: 4px; top: -2px;}
}
@media (max-width: 480px){
.introduce .container { width: auto; padding: 0; }
.productWrap p a{    font-size: 12px;padding: 0 10px;    margin-top: 10px; line-height: 18px;}
.bannerMobile{display: block;}
.bannerPc{display: none;}
.bannerTitle{    padding:12px 7px 15px 8px;width: 145px;}
.bannerTitle p{    margin-top: 9px;}
.bannerTitle { left: 15px; top: 31px; }
.main { padding: 70px 0 192px; }
.bannerTitle h2{    letter-spacing: 0.5px;}
.productWrap ul{margin: 0 -4%;}
}
@media (max-width: 320px){
  .productWrap ul{margin: 0 -4.7%;}
}