﻿
/* CSS Document电脑 */
:root{
	--main_color:#d8271c;        /* 主色 */
	--main_color_rgb:255,255,0;  /* rgba */
}
@font-face{ font-family:'alimama'; src: url('/images/alimama.ttf');}
@font-face{ font-family:'Beba'; src: url('/images/BebasNeue-Bold.ttf');}
.t_left_center{ display: flex; flex-direction: column; justify-content: center;}
.flex_start{ display: flex; justify-content: flex-start; flex-wrap: wrap;}
.flex_space{ display: flex; justify-content: space-between; flex-wrap: wrap;align-items: center;}
.t_center{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
.width_1600{ width:1600px; margin:0 auto;}
.container-fluid{overflow:hidden;}
.main_a{ width: 88%; margin: auto; max-width: 1280px; position:relative;}

@keyframes bounce-up-7e3caf58{10%{transform:rotate(20deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(5deg)}40%{transform:rotate(-5deg)}50%,to{transform:rotate(0deg)}}

.bt {display: flex;align-items: center;justify-content: center;margin: 3% auto;}
.bt h3 {font-size: 56px;font-weight: bold;font-family: 'DIN';margin-right: 2%;color: var(--main_color);}
.bt h4 {font-size: 56px;font-weight: bold;}
.banner1 .swiper-slide{position:relative;width:100%!important;overflow: hidden;}
.banner1 .swiper-slide .imgs{ width:100%; height:100vh; min-height:100%; transition:1s linear 2s; transform:scale(1.1,1.1);}
.banner1 .swiper-slide .txt{width: 50%;position:absolute;top: 52%;left: 34%;transform: translate(-50%, -50%);color:#fff;text-align: left;}
.banner1 .swiper-slide .txt .biaoti img{width:211px!important;height:76px!important;margin-bottom:1%;}
.banner1 .swiper-slide .txt h2{font-size: 46px;line-height:1.75;font-weight:bold;color:#fff;}
.banner1 .swiper-slide .txt h3{font-size:20px;line-height: 2;margin-top: 10px;color:#fff;}
.banner1 .swiper-slide .txt p{position: fixed;right: 2%;bottom: -150%;font-size: 14px;}
.banner1 .swiper-slide-active img,.swiper-slide-duplicate-active img{ transition:3s linear; transform:scale(1,1);}
.txt .cha {
    margin-top: 3%;
}
.messages5{
  width:300px;
  position:absolute;
  top:-100px;
  left:-320px;
  border-radius:6px;
  background:#fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  padding:20px 24px;
  box-sizing:border-box;
  color:#333;
  text-align:left;
  display:none;
  }
.messages5 h2{ font-size:20px;}
.messages5 p{ color:#666!important; margin:3px 0 10px 0;}
.messages5 label{ display:block; line-height: 30px;}
.messages5 input{ display: block; width: 100%; border: 1px solid #d7d8d9; height: 36px; line-height: 36px; padding: 0 12px; font-size: 14px; box-sizing: border-box; outline: none;}
.messages5 textarea{ display: block; width: 100%; border: 1px solid #d7d8d9; height: 36px; line-height: 36px; padding: 0 12px; font-size: 14px; box-sizing: border-box; outline: none;}
.messages5 input::placeholder{ color: rgba(0,0,0,0.5);}
.messages5 input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance: none; margin: 0;}
.messages5 input[type="number"]{ -moz-appearance: textfield;}
.messages5 .phone_a{ margin-top:12px;}
.messages5 div a{ width:100%; line-height:36px; background: var(--main_color); color:#fff; text-align:Center; margin-top:20px;display: flex;
    justify-content: center;}
.messages5>a{ position:absolute; top:6px; right:6px; color:#fff; width:18px!important; height:18px!important; background:#333; border-radius:50%;}
.messages5>a img{ width:100%; height:100%; padding:0;}
/*侧边*/
.right-float{width: 70px;position:fixed;right: 7px;bottom: 25%;z-index:300;/* padding: 10px; */background: #122133;/* border-radius: 70px; */box-shadow: 0px 0px 7px rgb(0 0 0 / 30%);display: flex;flex-direction: column;align-items: center;}
.topp {position: absolute;top: -30%;}
.right-1{width: 70px;height: 80px;display:flex;justify-content: center;flex-wrap:wrap;position:relative;cursor:pointer;/* margin: 20% 0; */align-items: center;}
.right-1 a{width:100%;height:100%;display:block;overflow:hidden;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;}
.right-1 samp{width:100%;overflow:hidden;display:block;text-align:center;}
.right-1 span{width:100%;display:block;overflow:hidden;text-align:center;font-size:12px;color: #fff;margin-top:6px;}
.right-1:hover {
    background: var(--main_color);
}
.right-phone{width:200px;height:70px;position:absolute;right:90px;top:50%;background:#fff;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;border-radius:6px;box-sizing:border-box;padding-left:16px;opacity:0;transform-origin:right center;transform:translateY(-50%) scale(0);}
.right-phone:before{width:auto;content:"";position:absolute;right:-10px;top:50%;transform:translateY(-50%);border-left:10px #fff solid;border-top:10px transparent solid;border-bottom:10px transparent solid;}
.right-phone p{width:100%;overflow:hidden;font-size:16px;color:#222;line-height:24px;}
.right-1:hover .right-phone{transform:translateY(-50%) scale(1);opacity:1;}
.right-wx{width: 800px;height: 400px;position:absolute;right: 100px;top: 88%;background:#fff;display:flex;justify-content:space-between;flex-wrap:wrap;align-content:center;border-radius:6px;box-sizing:border-box;transform-origin:right center;transform:translateY(-50%) scale(0);}
.right-wx:before{/* width:auto; *//* content:""; */position:absolute;right:-10px;top:50%;transform:translateY(-50%);border-left:10px #fff solid;border-top:10px transparent solid;border-bottom:10px transparent solid;}
.right-wx img{width:100%;/* height:auto; */border-radius:6px;}
.right-1:hover .right-wx{transform:translateY(-50%) scale(1);opacity:1;}
.right-2{width: 70px;height: 80px;display:flex;justify-content: center;flex-wrap:wrap;position:relative;cursor:pointer;box-shadow:0px 0px 12px 4px rgba(0,0,0,0.04);/* color: #e60012; */align-content: center;}
.right-2 span{width:100%;overflow:hidden;text-align:center;display:block;font-size:14px;font-weight:bold;color:var(--main_color);background:url("/images/icon-153.png") no-repeat top center;padding-top:12px;}
.right-2 p{width:100%;overflow:hidden;text-align:center;display:block;font-size:12px;color: #fff;line-height: 2;}
.right-2:hover{background:var(--main_color);}


#mould87106{ width:100%; position:fixed; top:0; left:0; background:none; z-index:99; transition: .6s ease-in-out;}
.navbars41{ height:100px;}
.navbars41 .logo{float:left;width: 24%;height: 100%;display: table;background:url(/images/logo.png) no-repeat;background-size:contain;background-position: center;}
.navbars41 .logo a{ display: table-cell; vertical-align: middle;}
.navbars41 ul{display: table; height:100%;margin:0 auto;}
.navbars41 li{ display: table-cell; vertical-align: middle; position:relative;}
.navbars41 li a{padding:0 30px;font-size:18px;/* font-weight:bold; */color:#fff;transition: .4s ease-in-out;}
.navbars41 ul li.active::after, .navbars41 ul li:hover::after {width: 20%;left: 40%;bottom:20px;transition: all .4s;
    animation: bounce-up-7e3caf58 1.5s linear infinite;}
.navbars41 ul li::after {width: 0%;height: 3px;position: absolute;left: 50%;bottom: 0px;border-radius: 50px;background: #fff;content: '';-webkit-transition: all .35s;}
.navbars41 .bot{float:right;line-height: 100px;display: flex;justify-content: space-between;flex-direction: row;align-items: center;background: url(/images/phone-a.png) center left no-repeat;padding-left: 22px;}
.navbars41 .bot span {width: 1px;height: 16px;background: #fff;margin: 0px 10px;}
.navbars41 .bot .qh {color: #fff;font-size: 18px;font-family: arial;}
.navbars41 .btngsearch{width: 16px;height: 16px;background:url(/images/sousuo-a.png) no-repeat center;}
.head-search{width:100%;background: rgba(0,0,0,0.2);position: fixed;left:0;top:-200px;transition:.5s;z-index:9;}
.head-search div{width:1200px;margin:30px auto;position:relative;}
.head-search input{width: 100%;height: 60px;line-height: 60px;background: #f5f5f5;font-size: 16px;transition:.5s;box-shadow:none;border: 2px solid var(--main_color);padding: 0 20px;box-sizing:border-box;margin-bottom:0;border-radius: 50px;}
.head-search a{background:var(--main_color) url(/images/sousuo-a.png) no-repeat center;width:60px;height:60px;display:block;position:absolute;right:0;top:0;border-radius: 0 50px 50px 0;}
.btn_active{ top:100px;}


.header_active .navbars41 li::after{background:var(--main_color);}
.header_active{ background:#fff!important;
    box-shadow: 0 0 10px #00000052;}
.header_active .navbars41{ height:100px;}
.header_active .navbars41 li a{ color:#333;}
.header_active .navbars41 li a:hover{ color:#333;}
.header_active .navbars41 li.active a{ color: #333;}
.header_active .navbars41 .phone p{ color: #222;}
.header_active .navbars41 .qh{ color: #333;}
.header_active .navbars41 .phone{ margin-top:18px;}
.header_active .navbars41 .bot{ background: url(/images/phone.png) center left no-repeat;}
.header_active .navbars41 .bot span { background: #333;}
.header_active .navbars41 .btngsearch{background:url(/images/sousuo.png) no-repeat center;}
.header_active .navbars41 .logo{ float:left; width: 24%x; height: 100%; display: table;background:url(/images/logo-a.png) no-repeat;background-size:contain; background-position: center;}
.header_active .navbars41 .logo img{display:none;}


#mould87107{ position: relative;}
#mould87107 .swiper-pagination{ bottom:20px;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet{ width:30px; height:30px; background:url(/images/icon_btn.png) no-repeat; background-size:cover; opacity:0.3; border-radius:inherit;}
#mould87107 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ opacity:1;}
#mould87107 .swiper-slide {width: 100%!important;}



.shipins .swiper-container {margin: 5% 0;}
.shipins video {width: 100%;height: 500px;background: #edcd9d73;}
.shipins .video {position: relative;}
.video .vi {top: 9%;position: absolute;background: #111821;color: #fff;left: -40%;width: 460px;height: 330px;padding: 5%;opacity:0; z-index:99;}
.shipins .swiper-slide-active .vi {opacity: 1;}
.video .vi h3 {font-size: 32px;line-height: 2;border-bottom: 2px solid #ffffff1f;margin-bottom: 7%;}
.video .vi p {font-size: 16px;line-height: 26px;margin-bottom: 5%;}
.video .vi .cha img {position: absolute;right: -160%;bottom: -60%;width: 60%;}
.video .vi a.cha {position: relative;}


/*案例*/
.anli{background: url(/images/anli-bj.jpg) center no-repeat;padding: 3% 0;}
.anniu {display: flex;justify-content: space-between;margin: 3% auto;width: 50%;}
.anniu .an {    align-items: center;padding: 10px 20px;border: 1px solid #ff000000;position: relative;display: flex;justify-content: space-between;flex-direction: row;transition: transform 0.5s ease-in-out;}
.anniu .an.on {padding: 10px 20px;border: 1px solid red;position: relative;display: flex;justify-content: space-between;flex-direction: row;}
.anniu .an.on .ll {background: url('/images/red-l.png') no-repeat;width: 5px;display: block;height: 5px;position: absolute;top: 5px;left: 5px;}
.anniu .an.on .rr {background:url('/images/red-r.png') no-repeat;position:absolute;bottom: 5px;right: 5px;width: 5px;display: block;height: 5px;}
.tus {position: relative;}
.tu2 {position: absolute;width: 66%;display: flex;bottom: 30px;left: 30px;justify-content: space-between;z-index: 9;}
.tu1 a {position: relative;color: #fff;display: flex;}
.chanp {position: absolute;top: 25%;left:4%;}
.chanp h3 {font-size: 36px;margin-bottom: 5%;}
.chanp p {font-size: 18px;text-align: justify;width: 27%;line-height: 2;margin-bottom: 5%;}
a.cha {color: #fff;}
.cha {position:relative;background:  var(--main_color);width: 170px!important;height: 52px;line-height: 0px!important;display: flex;align-items: center;justify-content: center;margin-bottom: 0!important;}
span.l {background: url('/images/l.png') no-repeat;width: 10px;height: 10px;position: absolute;top: 7px;left: 7px;}
span.r {background: url(/images/r.png) no-repeat;width: 10px;height: 10px;position: absolute;bottom: 7px;right: 7px;}
.tu2 a {margin-right: 1%;transition: transform 0.5s ease-in-out;}
.tu2 a.on {transform-origin: center;transform: translate(0, -20px);}


/* 设计 */
.sheji{background: url(/images/sj-bj.jpg) center no-repeat; background-size: cover; padding: 3% 0 5%;}
.sheji h4 {color: #fff;}
.sheji .er {display: flex;flex-direction: row;color: #fff;justify-content: space-evenly;width: 70%;margin: 0 auto;}
.sheji .er h3 {font-size: 52px;font-weight: bold;font-family: 'din';}
.sheji .er h3 span {font-size: 24px;margin-left: 6%;font-weight: normal;}




.containerss{width: 1560px; overflow: hidden; margin: 4% auto 0 auto;}
.mySwiper{ width: 30%;box-sizing: border-box;color: #fff; float:left;}
.mySwiper h2 {font-size: 46px;margin-bottom: 7%;}
.mySwiper h5 {font-size: 24px;color: var(--main_color);margin-bottom: 15%;}
.mySwiper h3 {font-size: 32px;font-weight: bold;line-height: 2;}
.mySwiper p {font-size: 18px;line-height: 2;margin: 5% 0;}

.mySwiper2{ width: 64%;position: relative;overflow: hidden; float:right;}
.mySwiper2 .swiper-slide{ position: relative;}
.mySwiper2 .swiper-slide img{ width: 100%; height: 100%; border-radius: 8px;}
.mySwiper2 .swiper-slide:after{ content:""; position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);border-radius: 8px;}
.mySwiper2 .swiper-slide-active:after{ display: none;}




/* 全案 */
.quanan {position: relative;height: 960px;}
img.quanan-a {position: absolute;top: 0;left: 0;z-index: 1;}
.quanan .bt {position: absolute;z-index: 80;width: 100%;top: 4%;}
.quanan .bt h4 {color: #fff;}
.quanana {display: flex;flex-direction: row;justify-content: space-between;}
.quanana img {position: absolute;top: 0;left: 0;height: 100%;}
.quanana .zuo {position: absolute;z-index: 50;display: flex;flex-direction: column;width: 40%;left: 8%;top: 34%;}
.quanana .you {position: absolute;right: 0px;top: 0;background: url(/images/fuwu-r.png) right no-repeat;width: 317px;height: 100%;z-index: 1;display: flex;flex-direction: column;align-items: flex-start;justify-content: center;}
.quanana .zuo h2 {font-size: 56px;font-weight: bold;line-height: 2;color: #fff;}
.quanana .zuo h3 {color: #fff;font-size: 32px;line-height: 2;}
.quanana .zuo p {color: #fff;font-size: 18px;line-height: 6;}
.quanana .zuo .cha {margin-top: 4%;}
.quanana .you h5 {position: absolute;z-index: 2;color: #fff;font-size: 36px;margin-bottom: 50%;font-family: 'DIN';font-weight: bold;left: 25%;}
.quanana .you h4 {position: absolute;z-index: 2;color: #fff;font-size: 30px;font-weight: bold;left: 25%;padding-top: 20%;}
.quanana .you h3 {position: absolute;z-index: 2;color: #fff;padding-top: 48%;font-size: 26px;font-weight: bold;font-family: 'DIN';left: 25%;}
.yuan {position: absolute;z-index: 50;bottom: 12%;display: flex;flex-direction: row;left: 8%;justify-content: space-between;width: 10%;color: #fff;}
p.yuans {width: 50px;height: 50px;display: flex;border: 1px solid #fff;justify-content: center;align-items: center;border-radius: 50px;opacity: 0.5;font-family: 'DIN';}
p.yuans.on {opacity: 1;}

/*关于*/
.aabout {margin: 5% auto;}
.aabout .width_1600 {display: flex;flex-direction: row;justify-content: space-between;align-items: flex-end;}
.ab-l {display: flex;flex-direction: column;align-items: flex-start;width: 56%;}
.ab-l .bt {margin: 3% 0 5% 0;width: 100%;display: flex;justify-content: flex-start;}
.ab-l h2 {font-size: 36px;line-height: 1.5;margin-bottom: 2%;}
.ab-l p {font-size: 18px;text-align: justify;text-indent: 2em;line-height: 30px;width: 88%;}
.ab-l .cha {margin-top: 2%;}
.ab-r {width: 46%;border-radius: 30px;overflow: hidden;}
.ab-l img {width: 100%;}
.ab-r img {width: 100%;}


/*底部*/
.footers {padding: 4% 2% 0;margin-top: 2%;background: url(/images/foot-bj.jpg) no-repeat;}
.footers .width_1600 {display: flex;flex-direction: column;justify-content: space-between;}
.foot-t {display: flex;flex-direction: row;justify-content: space-between;}
div#mould68531 {width: auto;margin: 0;overflow: hidden;background: none;}
.messages3 ul li input {margin: 0;width: 265px;border-radius: 0;border: none;}
.messages3 ul li input::input-placeholder { color:#fff; } 
.messages3  input[type="text"]{ color:#fff; } 
.messages3 ul li input:first-child {margin: 2% 0;background: #0b1725;color: #fff!important;}
.messages3 ul li textarea {margin: 2% 0 0;width: 265px;border-radius: 0;border: none;background: #0b1725;color: #fff!important;height: 40px;font-size: 14px;padding-top: 3.2%;}
.messages3 ul li a {width: 265px;margin: 15% 0 0;border-radius: 0;background: var(--main_color);color: #fff;font-size: 14px;}
div#mould68531 h4 {font-size: 22px;color: #fff;margin-bottom: 5%;display: flex;align-items: center;}
div#mould68531 h4 span {font-size: 26px;font-family: 'Arial';padding: 0 3%;color: var(--main_color);}
.foot-n {width: 70%;}
.foot-n ul {display: flex;flex-direction: row;justify-content: space-between;}
.foot-n a {color: #fff;}
.foot-n h4 {font-size: 20px;border-bottom: 1px solid #ffffff6b;padding-bottom: 15%;margin-bottom: 10%;line-height: 2;}
.foot-n h5 {font-size: 16px;line-height: 2;}
.messages3 ul {width: 295px;display: flex;flex-direction: column;align-items: flex-start;}
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus{box-shadow:none;}
.foot-b {display: flex;flex-direction: row;justify-content: space-between;color: #fff;align-items: center;}
.foot-b .ll {display: flex;flex-direction: row;justify-content: space-between;align-items: flex-start;width: 72%;}
.foot-b .lls {max-width: 450px;}
.foot-b .lls p {display: flex;flex-direction: row;align-items: center;color: #999;margin-bottom: 3%;}
.foot-b .lls p img {width: 30px;margin-right: 8px;}
.foot-b .lls h2 {font-family: 'Arial';font-size: 24px;font-weight: bold;}
.foot-b .lls h5 {font-size: 20px;font-weight: bold;}
.wx {display: flex;flex-direction: column;align-items: center;}
.wx p {line-height: 2;}
.copyright .width_1600 {display: flex;flex-direction: row;padding-top: 1%;border-top: 1px solid #ffffff4d;margin-top: 1%;}
.copyright{padding: 1% 0;color:#fff;text-transform:uppercase;font-size:16px;/* background: #000; *//* display: flex; *//* flex-direction: r;/* justify-content: space-between; */}
.copyright a{ color:#fff;}



@media (max-width: 1680px){
  
  .pro_lanmu {width: 94%;}
  .ying .width_1600 p {
    font-size: 16px;}
  .width_1600 {
    width: 90%;}
  .navbars41 li a {
    padding: 0 20px;}
 .about_list_e {
   width: 90%;}
}

@media (min-width: 1560px) and (max-width: 1679px){ .ab-l h2 {font-size: 28px;}
  .yuan{width:11%;}
  .quanana .zuo h2 {
    font-size: 42px;}
  .bt h4 {
    font-size: 46px;}
  .bt h4 {
    font-size: 46px;}
  .pro_lanmu {width: 94%;}
  .footer_b {width: 360px;}
  .about_list_e {
    width: 90%;}
.width_1600 {
    width: 90%;}
  .navbars41 li a {
    padding: 0 20px;}
.about .abl p {line-height: 1.4;margin-top: 1%;}
#tabs-container1 .box1 h1 {
  font-size: 3vw;}
}
@media (min-width: 1440px) and (max-width: 1559px){.gyz p {font-size: 16px;}.yuan{width:12%;}.ab-l h2 {font-size: 24px;}
  .pro_lanmu {width: 94%;}
.about { align-items: center;}
  .about .abl {
    width: 60%;}
  #box-a .condition-item {
    width: 27%;}
  .footer_b {width: 360px;}
  .footer_c {width: 56%;}
  .lls h5 {
    font-size: 18px;}#tabs-container1 .box1 h1 {
  font-size: 3vw;}
}
@media (min-width: 1360px) and (max-width: 1439px){
  .ab-l h2 {font-size: 24px;}
  .yuan{width:12%;}
#tabs-container1 .box1 h1 {
  font-size: 3vw;}
  .pro_lanmu {width: 94%;}
  .lls h5 {
    font-size: 16px;}
  .gyz p {font-size: 16px;}
  .navbars41 li a {padding: 0 17px;}
  .navbars41 li a {font-size: 16px;}
.about { align-items: center;}
  .about .abl {
    width: 60%;}
  #box-a .condition-item {
    width: 27%;}
  .c-title span {
    display: inline-block;
    font-size: 38px;}
  .c-title h2 {
    font-size: 20px;}
  .left-box .item .num {
    font-size: 36px;
    color: var(--main_color);
    font-family: 'EuclidCircularA-Regular';
}
  .footer_b {width: 370px;}
.footer_c {width: 56%;}
}


