*{ padding: 0px; margin: 0px; font-family: "微软雅黑";}
:after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
 
.content{width: 1200px;margin: 0px auto; position: relative;}
.hreader{width: 1480px; height: 84px; margin: 0px auto;}
.logo{float: left; line-height: 84px; position: relative;}
.logo a{display: block;}
.logo div{float: left;}
.logo span{font-size: 30px;font-weight: bold; display: inline-block;float: left; margin-left: 10px;}
.nav{float: right;}
.navbar-header {display: none;}
.layui-nav{background: #FFF;}
.layui-nav .layui-nav-item{line-height: 84px;}
.layui-nav .layui-nav-item a{color: #333;font-size: 18px;}
.layui-nav .layui-nav-item:hover{border: 0;}
.layui-nav .layui-this:after, .layui-nav-bar, .layui-nav-tree .layui-nav-itemed:after{background-color: #FFFFFF;}
.layui-nav .layui-nav-item:hover a{color: #333333;}
.layui-nav-child{z-index: 999999;}
.layui-nav-child a{font-size:14px !important;}
.search{float: right; border: 1px solid #999; border-radius: 10px; padding: 2px 10px; margin-top: 25px;}
.search button{background: inherit; border: 0px;}
.search input{border: 0;}
  .swiper-container {
      width: 100%;
      height: 100%;
      margin-left: auto;
      margin-right: auto;
	  --swiper-theme-color: #FFF;
	  --swiper-pagination-color: #333;/* 两种都可以 */
    }

   .swiper1 .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	  height: 663px;
    }
.swiper1 .swiper-button{background:rgba(0,0,0,0.5); padding: 5px 10px;}
.swiper1 .swiper-pagination-bullet{ width: 12px; height: 12px;}
.swiper1 .swiper-wrapper .swiper-slide:nth-of-type(1){background: url(../images/banner1.jpg) center center no-repeat; background-size:cover;}
.swiper1 .swiper-wrapper .swiper-slide:nth-of-type(2){background: url(../images/banner2.jpg) center center no-repeat; background-size: cover;}
.swiper1 .swiper-wrapper .swiper-slide:nth-of-type(3){background: url(../images/banner3.jpg) center center no-repeat; background-size: cover;}

.ani{ display: block; color: #FFF; font-size: 30px; font-weight: bold; padding: 5px 10px; text-align: left; margin-left: -500px;}

.index-about{background: url(../images/v1_06.jpg) center center no-repeat; background-size: cover; height: 680px;}
.index-title{text-align: center; margin: 50px auto; margin-bottom: 20px; color: #e00000;font-size: 36px; position: relative; font-weight: bold;}
.index-title span{ display: block; width: 50px; height: 2px; background: #E00000; margin: 10px auto;}
.index-title-desc{ margin: 0px auto; text-align: center;color: #646464; font-size: 14px;}
.index-cont{position: relative;margin-top: 150px;}
.index-about-left,.index-about-midd,.index-about-right{top: 60px; width: 220px;text-align: center;}
.index-about-left{position: absolute; left: 7%; }
.index-about-midd{position: absolute;left: 40%; }
.index-about-right{position: absolute;left: 75%; }

.index-h2{ font-size: 24px; margin: 5px auto;}
.index-p{font-size: 14px; color: #9a9a9a; margin-top: 20px; line-height: 24px;}

.content2{ margin-top: 30px;}
.content2-left{float: left; width: 45%; margin-right:5% ;}
.content2-left img{width: 100%;}
.content2-right{float: left; width: 48%;}
.content2-right h2{color: #666666;font-size: 24px; font-weight: bold; margin-bottom: 15px;}
.content2-right p{font-size: 14px;color: #666666;line-height: 26px;}
.more{display: inline-table; padding: 5px 16px; background: #6b6b6b; border-radius: 15px; color: #FFFFFF; margin-top: 20px;}
.more i{color: #FFFFFF; font-weight: 100;margin-right: 5px;}
.more:hover{color: #FFFFFF; background: #e00000;}
.index-content3{margin-top: 90px;}
.swiper3{margin-top: 45px; }
 .swiper3 .swiper-slide{ text-align:center;}
.swiper3 .swiper-slide img{width: 100%;}
.content3-title{font-size: 16px;border-bottom: 3px solid #D3D4D3; display: inline-block;width: 100px; padding-bottom: 10px; margin-top: 10px; transition: width 0.5s;}
.content3-title a{color: #666666;}
.swiper3 .swiper-slide:hover .content3-title {border-bottom: 3px solid #FF0000;width: 100%;}
.content3-more{text-align: center; margin: 20px auto;}

.index-content4{margin-top: 30px;}
.content4-left{float: left; width: 47%; margin-right: 3%;}
.content4-right{float: right; width: 50%;}
.content4-left h2{text-align: left; margin: 0px auto; margin-bottom: 20px; color: #e00000;font-size: 36px; position: relative; font-weight: bold;}
.content4-left h2 span{ display: block; width: 50px; height: 2px; background: #E00000; margin: 10px;}
.content4-left p{font-size: 14px; line-height: 28px; color: #666666;}
.content4-right-img {float: right; width: 93%; /*margin-right: 3%;*/}
.content4-right-img img{width: 100%;}
.content4-nav{width: 31%; float: right;}
.content4-nav ul li{text-align: right; line-height: 36px;padding-right: 15px;}
.content4-nav ul li a{font-size: 14px; color: #666666; }
.content4-nav ul li i{color: #FFFFFF; margin-right: 40px;}
.content4-nav ul li:hover{background: #E00000;}
.content4-nav ul li:hover a{color: #FFFFFF;}

.swiper2 .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
.swiper2 .swiper-slide img{width: 100%;}
.content4-ul{margin: 50px auto;}
.index-content5{background: url(../images/lou.jpg) center bottom no-repeat; background-size: cover; padding-bottom: 80px;}
.content5 {margin-top: 50px;position: relative;}
.content5 ul{  }
.content5 ul li{ display: inline-table; width: 24.5%; text-align: center;}
.content5-img img{ width: 100px; height: 90px;}
.content5-span{font-weight: bold; font-size: 16px; margin: 5px auto;}
.content5-p{ width: 200px; margin: 10px auto;}

.footer{background: #4e4e50; overflow: hidden;}
.foott{padding-bottom: 50px;}
.foot{float: left; margin-top: 40px;}
.foot h3 ,.foot h4 {color: #9f9fa6; font-size: 16px; margin-bottom: 20px;}
.foot a{color: #9f9fa6; font-size: 16px; }
.foot li a{color: #9f9fa6; font-size: 14px; }
.foot li{line-height: 24px;}
.footer1,.footer2,.footer3,.footer4{width: 13%;}
.footer5{ width: 23%;}
.footer5 div{display: inline-table; margin-right: 5px;}
.footer5 span{color: #FFFFFF; display: block; margin-top:5px ;}
.footer6{width: 20%;}

.footer-bottom{background: #000; color: #FFFFFF; text-align: center; padding: 5px 0px;}

.main-banner{position: relative; height: 280px;ontent: '';background: url(../images/case_02.jpg) center center no-repeat;}
 
.main-banner-img{position: absolute;top: 0px;}
.main-banner-content{position: absolute; margin: 0px auto; top: 90px;}
.main-banner-title{font-size: 38px; font-weight: bold;color: #FFFFFF;}
.main-banner-nav{margin-top: 15px;}
.main-banner-nav .layui-breadcrumb a{color: #FFFFFF !important;font-size: 18px;}
.fa-home{color: #FFFFFF; font-size: 18px; margin-right: 10px;}
.layui-breadcrumb a cite{color: #FFFFFF;}
.anli{margin: 50px auto; background: url(../images/case_06.jpg) center center no-repeat; background-size: cover;}
.main-title{text-align: center;font-weight: bold; font-size: 36px; width: 220px; border-bottom: 3px solid #a8a8a8; padding-bottom: 30px; margin: 0px auto;position: relative;}
.main-title span{display: block; width: 30%;  height: 3px;background: #e20000; position: absolute;bottom: -3px; left: 35%; }
.anli-cont{margin-top: 50px;}
.anli-left{float: left;width: 263px; background: url(../images/Design_05.jpg) center top no-repeat;border:1px solid #D3D4D3; padding: 80px 0px;}
.anli-left ul{width: 80%; margin: 0px auto;}
.anli-left ul li{line-height: 42px; text-align: center; margin: 10px auto;}
.anli-left ul li a{font-size: 18px; font-weight: bold; color: #333333;}
.anli-left .active{background: #e20007;}
.anli-left .active a{ color: #FFFFFF;}
.anli-right{float: left; margin-left: 50px; width: 70%; box-shadow: 0px 3px 3px 3px #f1f1f1;border:1px solid #D3D4D3; }
.main{width: 90%; margin: 0px auto;}
.main img{width: 100%;}
.anli-right h2{ margin: 10px auto; margin-top: 50px;font-size: 24px;font-weight: bold;}
.line{  height: 2px;background: #D0D0D0; margin: 0px auto; position: relative; margin-bottom: 50px;}
.line span{display: block;position: absolute;top: 0; height: 2px; width: 35%; background:#E20000 ;}
  .anli-list{  margin: 50px auto;}
 .anli-list li{list-style-type: disc; list-style-position: inside; line-height: 30px;font-size: 16px;}
 .anli-list h3{font-weight: bold;font-size: 18px;}

.design{position: relative; height: 280px;ontent: '';background: url(../images/Design_02.jpg) center center no-repeat;}
.main-content{margin: 30px auto;}
.main-content p{line-height: 24px;font-size: 16px; margin: 20px auto;}
.anli-cont .layui-table td{border: 0; background: inherit;}
.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table[lay-even] tr:nth-child(even) {
    background-color: transparent;
}
.job{position: relative; height: 280px;ontent: '';background: url(../images/job_02.jpg) center center no-repeat;}
.table{ margin: 0;}
.layui-colla-title{background: #FFFFFF;}
.layui-table td, .layui-table th{padding: 0px; font-size: 16px;}
.layui-colla-icon{color: #E20000;}
.layui-collapse{border: 0;}
.zw{width: 75%; }
.zw span{display: inline-table; width: 35px;}
.job-time{width: 15%; font-weight: bold;}
.job-cz{width: 10%; font-weight: bold;}

.company{position: relative; height: 280px;background: url(../images/company_02.jpg) center center no-repeat;}
.about-left{float: left;width: 50%;}

.about-right{float: right; width: 40%;}
.about-right img{width: 100%;}
.about-left-m{margin-bottom: 20px;}
.about-left-m h4{color: #e61418; font-size: 16px;font-weight: bold;margin-bottom: 10px;}
.about-left-m p{font-size: 16px;line-height: 30px; color: #666666;}
.contact{margin-top: 50px;background: #464646;}
.contact-left{float: left;width: 65%; }
.contact-left img{width: 100%;}
.contact-right{float: left; width: 30%; margin-left: 2%;}
.contact-right h2,.contact-right p{color: #FFFFFF;}
.contact-right h2{font-size: 24px; border-bottom: 1px dashed #FFFFFF ; margin-top: 50px; padding-bottom: 20px; margin-bottom: 20px;}
.contact-right p{line-height: 30px;}
.time24{margin-top: 15px;}
.time24-left{float: left;}
.time24-right{float: left;color: #FFFFFF;font-size: 24px;font-weight: bold;margin-left: 10px; font-style:italic;}
.time24-right span{color: #FFFFFF;display: block;font-size: 14px; font-style: normal;}
.msg{background: #ededed; padding: 50px 0;}
.msg .layui-form{margin-top: 50px;}
.msg .layui-form-label{width: inherit;}
.msg .layui-inline{background: #FFFFFF;}
.msg .layui-inline input{border: 0;}
.msg .layui-inline span{color: #E20000;}
/*分页*/
.fenye{margin-top: 40px;}
.pagination { text-align:center; margin: 0px auto;}
.pagination li {display: inline-block;margin-right: -1px;padding: 5px;min-width: 20px;text-align: center; border:1px solid #C5C5C5; margin: 0px 5px;}
.pagination li.active {color: #8d6d58;}
.pagination li.active{background:#4e4e50 ; color: #FFFFFF;}
.pagination li:nth-child(1){background:#4e4e50 ; color: #FFFFFF;}
.pagination li:nth-child(1) a{ color: #FFFFFF;} 
.pagination li:last-child{background:#4e4e50 ; color: #FFFFFF;}
.pagination li:last-child a{color: #FFFFFF;}
.pagination li a {display: block;text-align: center;}
.barcketlistin {width: 100%; height: auto;}
.barcketlistin li:nth-child(3n+1) {margin-left: 0px;}
.barcketlistin li { width: calc(31% - 33px); height: 400px; margin: 20px 0px 20px 3.5%; float: left;padding: 15px;box-shadow: 5px 5px 5px #dedede;}
.barcketlistin li a {display: block;}
.barcketlistin li img {width: 100%;}
.barcketlistin li p {font-size: 20px;color: #333;text-align: center;line-height: 30px;margin: 20px 0px;}
.barcketlistin li p:hover{color: #e00000;}
.barcketlistin li span {display: block;line-height: 28px;color: #666;font-size: 16px;}
@media (max-width:1440px){
	.hreader{width: 100%;}
	.logo{margin-left: 10px;}
	.search{margin-right: 10px;}
}
@media (max-width:1080px){
	 .index-content3,.index-content2,.index-content4,.index-content5{padding: 0px 10px;}
	.hreader{width: 100%;}
	.logo{margin-left: 10px;}
	.logo span{display: none;}
	.search{margin-right: 10px;}
	.content{width: 100%;}
	.swiper1 .swiper-slide{height: 400px;}
	.ani{margin-left: 0px;}
	.index-about{background-size: contain; height: 430px;}
	.index-cont{margin-top:0 ;}
	.index-about-left{left: 20.5%;}
	.index-about-left, .index-about-midd, .index-about-right{top: 60px; width: 180px;}
	.index-about-img{width: 80px; margin: 0px auto;}
	.index-about-img img{width: 100%;}
	.index-p{margin-top: 5px; line-height: 20px;}
	.index-about-midd{left: 42%;}
	.index-about-right{left: 62%;}
}
@media (max-width:750px){
	.content{width: 100%;}
		.search,.nav {display: none !important;}
	.navbar-header{width: 40px;position: absolute; right: 20px; top: 40px;display: block;}
	 .navbar-toggle,.navbar-toggle::before, .navbar-toggle::after {
		 content: ""; 
	       width: 40px;
	       height: 3px;
	       border-radius: 3px;
	       position: absolute;
	       transition: transform 0.15s ease;
		   background-color: #5c5c5c;
		   width: 100%;
		   color: #5c5c5c;
		   border: 0;
	}
	.navbar-toggle{
		    transition-duration: 0.3s;
		    transition-timing-function: cubic-bezier(0.55,0.055,0.675,0.19);
	}
	 .navbar-toggle::before {
	       transform: translate3d(-50%,-.4125rem,0);
		transition: top 0.1s 0.34s ease-in,opacity 0.1s ease-in,transform 0.3s cubic-bezier(0.55,0.055,0.675,0.19) ,background-color 0.15s ease;
	    top: -10px;
	
	}
	.navbar-toggle::after {
	    transform: translate3d(-50%,.4125rem,0);
		transition: bottom 0.1s 0.34s ease-in,transform 0.3s cubic-bezier(0.55,0.055,0.675,0.19) ,background-color 0.15s ease;
		bottom: -10px;
		
	}
	.is-active .navbar-toggle{height: 0;right: 10px;z-index: 99999;color: #FFF;}
	.is-active .navbar-toggle::before{
		top: 0;
		     transform: rotate(225deg);
		    transition: all 0.15s ease;
			background-color: #FFF;
	}
	.is-active .navbar-toggle::after{
		top: 0;
		     transform: rotate(-225deg);
		    transition: all 0.15s ease;
			background-color: #FFF;
	}

	.navbar-active{display: block !important; background: rgba(0,0,0,.8); width: 100%;top: 0px !important;z-index: 999;
	transition: all 0.15s ease;position: absolute;}
	.layui-nav{margin-top: 110px;background: none;}
	.layui-nav .layui-nav-item{display: block;z-index: 999;text-align: center;}
	.layui-nav .layui-nav-item >a{color: #FFF;}
	.layui-nav-child{position: inherit;top: 0; display: block;}
	.index-about{height: 340px;background-position: center bottom; }
	.index-about-left{left: 15.5%;}
	.index-about-left, .index-about-midd, .index-about-right{top: 90px; width: 180px;}
	.index-about-img{width: 50px; margin: 0px auto;}
	.index-about-img img{width: 100%;}
	.index-p{margin-top: 5px; line-height: 20px;}
	.index-about-midd{left: 37%;}
	.index-about-right{left: 57%;}
	.index-h2{font-size: 2.5vw; margin-top: 2vw;}
	.index-p{display: none;}
	.content2-left{width: 100%;margin: 0;}
	.content2-right{width: 100%;}
	.content4-left{ width: 100%;}
	.content4-right{width: 100%; margin-top: 20px;}
	.content4-right-img{width: 100%;}
	.content5 ul li{width: 45%; margin-bottom: 10px;}
	.foott{padding: 0px 10px; padding-bottom: 20px;}
	.footer6{display: none;}
	.footer5{width: 25%;}
	.footer5 div{width: 45%;}
	.footer5 div img{width: 100%;}
	
	.company{height: 300px;}
	.main-banner-content{top: 100px; left: 10%;}
	.anli-cont{padding: 2vw;}
	.about-left,.about-right,.contact-left,.contact-right{float: inherit;width: 100%;}
	.anli-cont .main-title{margin-top: 30px;}
	.msg .layui-form-item .layui-inline{text-align: center;}
	.anli-left{display: none;}
	.anli-right{float: inherit; width: 100%; margin: 0;}
	.anli-cont .layui-table td{ width: 30%;}
	.layui-table td, .layui-table th{font-size: 2vw;}
	.zw{width: 40% !important;}
	.zw span{display: none;}
	.barcketlistin li {width: calc(48.25% - 33px);}
	.barcketlistin li:nth-child(3n+1) {margin-left: 3.5%;}
	.barcketlistin li:nth-child(2n+1) {margin-left: 0px !important;}
	.main-content p{line-height: 25px;}
	.main-content p img{width: 100%;}
}

@media (max-width:480px){
		.swiper1 .swiper-slide{height: 320px;}
.ani{font-size: 5vw;}
	.index-title{font-size: 5vw; margin-top: 5vw;}
	.index-title-desc{font-size: 12px; width: 80%;}
	.index-content3{ margin-top: 10vw;}
	.index-about{ background: inherit; height: 260px;}
	.index-about-left, .index-about-midd, .index-about-right{width: 32%; float: left; margin-top: 10vw;  position: inherit; top: inherit; left: inherit;}
	.index-about-img{width: 80px;}
	.index-h2{font-size: 4vw; font-weight: bold;}
	.content4-nav ul li i{display: none;}
.content5-p{width: 100%;}
	.footer1, .footer2, .footer3, .footer4{width: 23%;}
	.footer5{float: inherit; width: 80%;  text-align: center; }
	.barcketlistin li {width: calc(100% - 33px);float: none;margin: 20px 0px;}
	.barcketlistin li:nth-child(3n+1) {margin-left: 0px;}
	.barcketlistin li:nth-child(2n+1) {margin-left: 0px;}
}

@media (max-width:430px){
		.content3 li{width: 45%; margin-bottom: 3vw;}
		.content5 ul li{width: 48%;}
		.content5-img img{width: 60px; height: 60px;}
		.content4-right-img{width: 100%;}
		.content4-nav{width: 46%;}
}