body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,input{margin: 0; padding: 0;}
body{--col: #ad233b; font-family: Arial;}
li{list-style: none;}
a,a:hover,input:focus,select:focus,textarea:focus{text-decoration: none; color: inherit; outline: none;}
img{border: none; max-width: 100%; height: auto;}
.clear{clear: both;}
.w{margin: 0 100px;}
.swiper{overflow: hidden; position: relative;}
.swiper-slide img{max-width: 100%; display: block;}

/* 头部 */
.top1{background: rgba(0,0,0,0.2); color: #fff; position: fixed; top: 0; left: 0; right: 0; z-index: 100; border-bottom: 1px solid rgba(0,0,0,0.1);}
.top1 .logo_ac{display: none;}
.top1.ac{background: rgba(255,255,255,1); color: #666;}
.top1.ac .logo{display: none;}
.top1.ac .logo_ac{display: block;}
.top1 .w{height: 68px; display: flex; align-items: center; justify-content: space-between;}
.top1 .fr{display: flex; align-items: center;}
.top1 .fr .ul1{display: flex;}
.top1 .fr .ul1>li{margin-right: 50px; font-size: 16px; font-weight: bold; position: relative; line-height: 68px;}
.top1 .fr .ul1>li>a{text-transform: uppercase;}
.top1 .fr .ul1 li ul{position: absolute; top: 68px; left: 0; background: #fff; color: #000; line-height: 30px; font-weight: normal; font-size: 14px; padding: 0 20px; margin-left: -20px; white-space: nowrap; min-width: 100%; display: none; box-shadow: 0 0 10px 5px rgba(0,0,0,0.1); z-index: 11;}
.top1 .fr i img{display: none;}
.top1 .fr i img:nth-of-type(1){display: block;}
.top1.ac .fr i img{display: none;}
.top1.ac .fr i img:nth-of-type(2){display: block;}
.ss{display: flex; align-items: center; justify-content: center; height: 100%;}
.ss form{display: flex; height: 50px; border-bottom: 2px solid rgba(255,255,255,0.5); font-size: 18px; position: relative;}
.ss form .close{position: absolute; top: -30px; right: -30px; color: #fff; opacity: 1;}
.ss form input{width: 300px; background: none; border: none; color: #fff; text-indent: 10px;}
.ss form button{background: none; border: none;}


/* 首页 */
.swiper1 .pd{padding-bottom: 39%; position: relative;}
.swiper1 .pd img{width: 100%; height: 100%; position: absolute; top: 0; left: 0; object-fit: cover;}
.swiper1 .pd video{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.box1{margin: 30px 0;}
.box1 .w{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.box1 .w .fl,.box1 .w .fr{width: 48%}
.box1 .w .fl h3{font-size: 42px; text-transform: uppercase; font-weight: bold; margin-bottom: 20px;}
.box1 .w .fl p{line-height: 2; color: #555;}
.box1 .w .fl .more{background: var(--col); color: #fff; padding: 10px 20px; font-size: 16px; text-transform: uppercase; margin-top: 20px; display: inline-block;}
.box1 .w .fr img{width: 100%;}

.box2 .item{background: #f5f5f5; padding: 15px; display: flex; flex-wrap: wrap; margin: 15px 0;}
.box2 .item .text{width: 45%; display: flex; flex-direction: column; justify-content: space-between; padding: 15px 3%;}
.box2 .item .text h3{font-size: 42px; font-weight: bold; text-transform: uppercase;}
.box2 .item .text h3 a{transition: 0.5s;}
.box2 .item .text h3 a:hover{color: var(--col);}
.box2 .item .text .more{font-size: 16px; color: var(--col);}

.box2 .item .img{width: 55%; overflow: hidden;}
.box2 .item .img img{width: 100%; transition: 0.5s;}
.box2 .item .img img:hover{transform: scale(1.1);}

.box3{margin: 50px 0;}
.index_tit{text-align: center; position: relative; padding-bottom: 20px; margin-bottom: 30px;}
.index_tit:before{content: ""; position: absolute; bottom: 0; left: 0; right: 0; width: 36px; height: 5px; background: var(--col); margin: auto;}
.index_tit dt{font-size: 36px; color: var(--col); font-weight: normal; text-transform: uppercase;}
.index_tit dd{font-size: 16px; color: #393939;}
.box3 .bod{display: flex; justify-content: space-between; text-align: center; flex-wrap: wrap;}
.box3 .bod dl{padding: 0 10px; width: 20%;}
.box3 .bod dl dt{height: 96px; display: flex; align-items: center; justify-content: center;}
.box3 .bod dl dd{font-size: 18px; line-height: 2; font-weight: bold; margin-top: 15px;}

.box4 .w{display: flex; flex-wrap: wrap; align-items: center; background: #fafafa;}
.box4 .w .fl,.box4 .w .fr{width: 50%;}
.box4 .w .fl{padding: 0 2%; text-align: center;}
.box4 .w .fl h3{font-size: 42px; font-weight: bold; margin-bottom: 20px;}
.box4 .w .fl p{color: #555; line-height: 2;}
.box4 .w .fr dl{position: relative;}
.box4 .w .fr dl dt{padding-bottom: 30%; position: relative; overflow: hidden;}
.box4 .w .fr dl dt img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: 0.5s; object-fit: cover;}
.box4 .w .fr dl dt img:hover{transform: scale(1.2);}
.box4 .w .fr dl dd{position: absolute; bottom: 0; left: 0; right: 0; background: rgba(224,205,188,0.7); display: flex; align-items: center; justify-content: space-between; padding: 10px 20px;}
.box4 .w .fr dl dd p{font-size: 24px; font-weight: bold;}
.box4 .w .fr dl dd .more{background: #fff; padding: 5px 15px; border-radius: 5px; font-size: 12px;}
.box4 .w .fr ul{display: flex; justify-content: space-between;}
.box4 .w .fr ul li{margin-top: 2%; width: 49%; padding-bottom: 30%; position: relative; overflow: hidden;}
.box4 .w .fr ul li img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: 0.5s;}
.box4 .w .fr ul li img:hover{transform: scale(1.2);}

.box5{margin: 30px 0;}
.box5 .w{display: flex; justify-content: space-between; flex-wrap: wrap;}
.box5 .w dl{width: 32%; position: relative;}
.box5 .w dl dt{padding-bottom: 70%; position: relative; overflow: hidden;}
.box5 .w dl dt img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: 0.5s;}
.box5 .w dl:hover dt img{transform: scale(1.2);}
.box5 .w dl>a{display: flex; position: absolute; top: 0; left: 0; width: 100%; height: 100%; flex-direction: column; justify-content: center; align-items: center; color: #fff; transition: 0.5s;}
.box5 .w dl>a:hover{background: rgba(0,0,0,0.3);}
.box5 .w dl h3{font-size: 20px; font-weight: bold;}
.box5 .w dl p{margin: 10px 0;}
.box5 .w dl .more{padding: 5px 10px; background: var(--col); font-size: 12px;}

.box6 video{width: 100%;}

.box7{margin: 30px 0;}
.box7 .w{display: flex; justify-content: space-between; flex-wrap: wrap;}
.box7 .w .item{width: 24%; border: 1px solid #f0f0f0; border-radius: 10px; overflow: hidden;}
.box7 .w .item .img{padding-bottom: 100%; overflow: hidden; position: relative;}
.box7 .w .item .img img{width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: 0.5s;}
.box7 .w .item .img img:hover{transform: scale(1.2);}
.box7 .w .item dl{padding: 15px;}
.box7 .w .item dl dt{font-weight: normal; margin-bottom: 10px;}
.box7 .w .item dl dd{font-size: 12px; color: #666;}

.bottom1{background: #f1f1f1; padding: 15px 0 30px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.bottom1 .w{display: flex; justify-content: space-between;}
.bottom1 .w .fl ul{display: flex; margin-top: 20px;}
.bottom1 .w .fl ul li{margin-right: 10px;}
.bottom1 .w .fr{display: flex;}
.bottom1 .w .fr dl{margin-left: 30px;}
.bottom1 .w .fr dl dt{padding-bottom: 10px; margin-bottom: 20px; border-bottom: 1px solid rgba(255,255,255,0.1); color: rgba(0,0,0,0.8); font-size: 18px;}
.bottom1 .w .fr dl dd{font-size: 16px; margin-top: 10px; color: rgba(0,0,0,0.6);}

.bottom2{background: #f1f1f1; padding: 10px 0;}
.bottom2 .w{display: flex; justify-content: space-between; align-items: center; color: rgba(0,0,0,0.6); flex-wrap: wrap;}

/* 产品列表 */
.banner img{width: 100%;}
.position{background: #f7f7f7; padding: 20px 0; color: #888;}
.ny>.w{display: flex;}
.left{width: 300px; margin-right: 50px; margin-bottom: 30px; flex-shrink: 0;}
.ny .tit,.ny2 .tit{padding: 15px 0; font-size: 20px; border-bottom: 1px solid #efefef; text-transform: uppercase;}
.left1 ul li{margin: 10px 0; color: #777; font-size: 16px;}
.right{flex-grow: 1;}
.productlist1{margin-bottom: 30px;}
.productlist1 .bod{display: flex; flex-wrap: wrap; margin-top: 20px;}
.productlist1 .bod .item{width: 32%; margin: 0 2% 2% 0; border: 1px solid #efefef; border-radius: 10px; transition: 0.5s;}
.productlist1 .bod .item:nth-of-type(3n){margin-right: 0;}
.productlist1 .bod .item:hover{transform: translate(0,-10px); box-shadow: 0 0 10px 5px rgba(0,0,0,0.05);}
.productlist1 .bod .item .img{padding-bottom: 100%; position: relative; border-bottom: 1px solid #efefef;}
.productlist1 .bod .item .img img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.productlist1 .bod .item dl{padding: 15px; transition: 0.5s; text-transform: uppercase;}
.productlist1 .bod .item dl dt{font-weight: normal; font-size: 16px;}
.productlist1 .bod .item dl dd{font-size: 12px; color: #999;}
.productlist1 .bod .item:hover dl{background: #666;}
.productlist1 .bod .item:hover dl dt{color: #fff;}

/* 产品详情 */
.product1{margin: 30px 0;}
.product1 .bod{display: flex; flex-wrap: wrap; justify-content: space-between;}
.product1 .bod .fl,.product1 .bod .fr{width: 46%;}
.product1 .bod .fl .text{margin: 30px 0; line-height: 2; color: #999;}
.product1 .bod .fl .img img{margin-right: 10px;}
.product1 .bod .fr{position: relative;}
.swiper3{margin: 0 60px;}
.swiper-button-prev:after, .swiper-button-next:after{color: #666;}

.product2{margin: 30px 0;}
.product2 .tit{display: flex; flex-wrap: wrap; border: 1px solid #ddd; border-left: none; border-right: none; font-size: 16px; margin-bottom: 30px;}
.product2 .tit li{margin-right: 40px; padding: 20px 0; cursor: pointer;}
.product2 .tit li.ac{border-bottom: 3px solid var(--col);}
.product2 .bodbj .bod{display: none;}
.product2 .bodbj .bod.ac{display: block;}
.product2 .bodbj .bod .item h3{margin-bottom: 20px;}
.product2 .bodbj .bod .item .dls{display: flex; flex-wrap: wrap;}
.product2 .bodbj .bod .item .dls dl{width: 18%; margin-right: 2%; margin-bottom: 20px;}
.product2 .bodbj .bod .item .dls dl:nth-of-type(5n){margin-right: 0;}
.product2 .bodbj .bod .item .dls dl dt{padding-bottom: 100%; position: relative; border: 1px solid #ddd;}
.product2 .bodbj .bod .item .dls dl dt img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

/* 案例列表 */
.caselist1{margin-bottom: 30px;}
.caselist1 .bod{display: flex; flex-wrap: wrap; margin-top: 20px;}
.caselist1 .bod .item{width: 32%; margin: 0 2% 2% 0; position: relative;}
.caselist1 .bod .item:nth-of-type(3n){margin-right: 0;}
.caselist1 .bod .item .img{padding-bottom: 70%; position: relative; overflow: hidden;}
.caselist1 .bod .item .img img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: 0.5s;}
.caselist1 .bod .item dl{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); display: flex; flex-direction: column; justify-content: flex-end; padding: 10%; align-items: flex-start; transition: 0.5s;}
.caselist1 .bod .item dl dt{color: #fff; font-size: 20px;}
.caselist1 .bod .item dl dd{padding: 10px; background: var(--col); display: inline-block; color: #fff; margin-top: 15px;}
.caselist1 .bod .item:hover dl{background: rgba(0,0,0,0);}
.caselist1 .bod .item:hover .img img{transform: scale(1.2);}

/* 案例详情 */
.case1 img{width: 100%;}

.case2{margin-bottom: 30px;}
.case2 h1{padding: 5%; background: #efefef; text-align: center; transform: translate(0,-50%);}

.designer1{margin: 30px 0;}

.newslist1{margin: 30px 0;}
.newslist1 .bod{display: flex; flex-wrap: wrap; margin-top: 20px;}
.newslist1 .bod .item{width: 23.5%; margin: 0 2% 2% 0; border: 1px solid #efefef; border-radius: 10px; transition: 0.5s;}
.newslist1 .bod .item:nth-of-type(4n){margin-right: 0;}
.newslist1 .bod .item:hover{transform: translate(0,-10px); box-shadow: 0 0 10px 5px rgba(0,0,0,0.05);}
.newslist1 .bod .item .img{padding-bottom: 100%; position: relative; border-bottom: 1px solid #efefef;}
.newslist1 .bod .item .img img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.newslist1 .bod .item dl{padding: 15px; transition: 0.5s; text-transform: uppercase;}
.newslist1 .bod .item dl dt{font-weight: normal; font-size: 16px; margin-bottom: 10px;}
.newslist1 .bod .item dl dd{font-size: 12px; color: #999;}
.newslist1 .bod .item:hover dl{background: #666;}
.newslist1 .bod .item:hover dl dt{color: #fff;}

.news1{margin: 30px 0;}
.news1 .xx{margin: 15px 0; color: #999;}
.news1 .bod{border: 1px solid #efefef; border-left: none; border-right: none; padding: 15px 0; margin-bottom: 15px;}
.news1 .bod img{max-width: 100%; height: auto;}
.fanye li{margin: 10px 0;}
.fanye li a{color: #999;}

.contact1{background: #efefef; padding: 5%; display: flex;}
.contact1 .item{width: 33.33%; text-align: center; border-right: 1px solid #ddd; padding: 20px;}
.contact1 .item:nth-of-type(3){border-right: none;}
.contact1 .item .img{background: #ccc; display: inline-block; padding: 20px; border-radius: 50%;}
.contact1 .item p{font-size: 24px; font-weight: bold; margin: 15px 0 20px;}

.contact2{margin: 30px 0;}
.contact2 p{color: #666; margin-bottom: 15px;}
.contact2 .form-control{margin: 15px 0;}

.about2{margin: 30px 0;}
.about2 p{text-align: center; margin: 15px 0;}
.about2 .swiper-pagination{bottom: 0; margin-bottom: 0;}

.swiper4{width: 80%; margin: 0 auto 20px;}
.swiper4 img{width: 100%;}

@media(max-width: 1200px){
	.w{margin: 0 50px;}
	.top1 .fr i{display: none;}
	.top1 .fr .ul1>li{margin-right: 0; margin-left: 20px;}
}
@media(max-width: 992px){
	.w{margin: 0 10px;}
	.navbar-toggle{display: block; border: 1px solid rgba(255,255,255,0.6);}
	.navbar-toggle span{background: rgba(255,255,255,0.8);}
	.top1.ac .navbar-toggle{display: block; border: 1px solid rgba(0,0,0,0.6);}
	.top1.ac .navbar-toggle span{background: rgba(0,0,0,0.8);}
	.top1 .fr .ul1{display: none; position: absolute; top: 68px; left: 0; right: 0; background: #fff; color: #333;}
	.box1 .w .fl,.box1 .w .fr{width: 100%}
	.box1 .w .fr{margin-top: 20px;}
}
@media(max-width: 768px){
	.top1 .w{height: 50px;}
	.top1 .w .fl img{width: 150px;}
	.top1 .fr .ul1{top: 50px;}
	.top1 .fr i{display: block;}
	.ss form input{width: 200px;}
	.box1 .w .fl h3{font-size: 24px;}
	.box1 .w .fl .more{font-size: 14px;}
	.box2 .item .text,.box2 .item .img{width: 100%;}
	.box2 .item:nth-of-type(1) .text,.box2 .item:nth-of-type(3) .text{order: 2;}
	.box2 .item .text h3{font-size: 24px; margin-bottom: 15px;}
	.index_tit dt{font-size: 24px;}
	.box3 .bod{justify-content: space-around;}
	.box3 .bod dl{width: 33.33%;}
	.box3 .bod dl dt img{max-width: 50%;}
	.box3 .bod dl dd{font-size: 14px; font-weight: normal; line-height: 1.5;}
	.box4 .w .fl,.box4 .w .fr{width: 100%;}
	.box4 .w .fl{margin-bottom: 20px;}
	.box4 .w .fl h3{font-size: 24px;}
	.box7 .w .item{width: 48%;}
	.bottom1 .w{flex-wrap: wrap;}
	.bottom1 .w .fl{width: 100%; margin-bottom: 20px;}
	.bottom1 .w .fr dl{margin-left: 10px;}
	.ny>.w{flex-wrap: wrap;}
	.ny>.w .left{width: 100%; margin-right: 0;}
	.left1 ul{display: flex; flex-wrap: wrap;}
	.left1 ul li{margin-right: 15px;}
	.ny>.w .right{width: 100%;}
	.productlist1 .bod{justify-content: space-between;}
	.productlist1 .bod .item{width: 48%; margin: 0 0 20px 0;}
	.product1 .bod .fl,.product1 .bod .fr{width: 100%;}
	.caselist1 .bod{justify-content: space-between;}
	.caselist1 .bod .item{width: 100%; margin: 0 0 20px 0;}
	.case2 h1{font-size: 20px;}
	.newslist1 .bod{justify-content: space-between;}
	.newslist1 .bod .item{width: 48%; margin: 0 0 2% 0;}
	.contact1{display: block;}
	.contact1 .item{width: 100%; border-right: none;}
	.contact1 .item .img{display: none;}
	.swiper4{width: 100%;}
	.box5 .w dl{width: 100%; margin: 10px 0;}
	.bottom1 .w .fr{flex-wrap: wrap;}
	.bottom1 .w .fr dl{margin-bottom: 10px;}
}
