.banner{overflow:hidden;padding-top:17.5%;padding-bottom:20%;filter:alpha(opacity=0);opacity:0;-webkit-transition:all 1.5s  ease-out;transition:all 1.5s ease-out;-webkit-transform:scale(1.3); transform:scale(1.3);}
.banner.active{filter:alpha(opacity=100);opacity:1;-webkit-transform:scale(1); transform:scale(1);}
.banner img{opacity:0;max-width:90%;margin-left:-50px;}
.banner.active img{-webkit-animation: bounceInRight  1s 1.5s ease-in-out both;animation: bounceInRight  1s 1.5s ease-in-out both;opacity:1}
@-webkit-keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}
  0% {  opacity: 0;     -webkit-transform: translate3d(3000px, 0, 0);}
  60% { opacity: 1;   -webkit-transform: translate3d(-25px, 0, 0);}
  75% {    -webkit-transform: translate3d(10px, 0, 0);}
  90% {   -webkit-transform: translate3d(-5px, 0, 0);}
  100% {  -webkit-transform: none;}}
 @keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% { transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}
  0% {  opacity: 0;     transform: translate3d(3000px, 0, 0);}
  60% { opacity: 1;   transform: translate3d(-25px, 0, 0);}
  75% {    transform: translate3d(10px, 0, 0);}
  90% {   transform: translate3d(-5px, 0, 0);}
  100% {  transform: none;}}
.lead{padding:2.8% 0;background:url(../images/btn.jpg) repeat-y;background-size:100%;}
.lead .cont{height:45px;}
.anime{background:url(../images/btn.jpg) repeat-y;background-size:100%;overflow:hidden;}
.pho{margin-left:30px;font-size:16px;line-height:29px;padding:0 13px;background:#fff;border-radius:4px;display:inline-block;vertical-align:middle;}
 .pho img{margin-left:22px;margin-top:-2px}
.road{position:absolute;right:0;top:50%;margin-top:-28px;width:60%;display:flex;justify-content:space-between;text-align:right;}
.road a{ display: inline-block;font-size:16px;color:#fff;margin-left:4%;line-height:56px;position:relative;white-space:nowrap;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;z-index:20}
.road a.active{color: #e1bc80;font-size: 20px;background-image: -webkit-gradient(linear, left 0, right 0, from(#eeebcc), to(#ecbc6d));-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
#move{position:absolute;top:0;left:0;z-index:1;height:55px;width:80px;padding:0 14px;margin-left:-14px}
#move::before{width:14px;height:55px;background:url(../images/le.png) no-repeat left center;position:absolute;top:0;left:0px;content:"";display:block;}
#move::after{width:14px;height:55px;background:url(../images/ri.png) no-repeat left center;position:absolute;top:0;right:0px;content:"";display:block;}
.home{text-align:center;padding-bottom:4%}
.home>img{max-width:90%}
.bg{clear:both;padding:5% 0;}
.way{text-align:center;margin-top:-1.5%;margin-bottom:5%}
.way dd{font-size:16px;color:#231f20;padding:8px 0;line-height:20px}
.code{margin-top:3%}
.code p{font-size:14px;color:#231815;padding-top:1.5%}
.answer{padding-bottom:2%}
.answer	input{font-size:16px;line-height:41px;height:41px;width:49%;float:left;padding-left:2%;border:1px solid #e5e5e5;margin-bottom:1.8%;box-shadow:none} 
.answer	input:first-child{margin-right:2%}
.answer	textarea{font-size:16px;line-height:24px;height:120px;width:100%;float:left;padding:10px 2%;border:1px solid #e5e5e5;margin-bottom:2.5%;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;box-shadow:none}
.answer	input:focus,.answer	textarea:focus{border-color:#e31545;box-shadow:0 0 10px #e31545}
.answer button{font-size:18px;line-height:52px;color:#fff;background:#e31545;border:none;width:100%;border:none;-webkit-transition:background 0.4s ease;transition:background 0.4s ease;}
.answer button:hover{background:#c01239}
.quote{font-size:22px;color:#e31544;text-align:center;margin-top:-1%;margin-bottom:2.5%}
.area{width:100%;background:url(../images/gray.jpg) repeat-y;background-size:66.5%;}	
.tels{padding:2.5%;width:42%}
.map{padding-top:2.5%;padding-bottom:2.5%;position:relative;padding-right:70px}
.map img{position:relative;z-index:20}
.map::before{width:58%;height:20%;content:"";background:#e31544;display:block;position:absolute;top:0;right:0;}
.map label{font-size:16px;line-height:1.5;color:#2e2a2b;position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
.map label::after{width:14px;height:14px;background:#2e2a2b;content:"";position:absolute;right:0;bottom:-24px}
.map::after{width:30%;height:24px;content:"";display:block;background:url(../images/red.png) no-repeat right bottom;background-size:100%;position:absolute;bottom:0;right:0;}
.thead{padding-bottom:4%;border-bottom:1px solid #b9b6b8;position:relative;margin-bottom:5%}
.thead::before{width:20%;background:#2e2a2b;height:4px;content:"";display:block;position:absolute;left:0;bottom:-2px}
.step li{padding-left:30px;font-size:16px;color:#2e2a2b;line-height:22px;padding-top:4px;padding-bottom:4px;position:relative;letter-spacing:1px;-webkit-transition:color 0.3s ease;transition:color 0.3s ease;}
.step li label{width:20px;height:24px;line-height:20px;text-align:center;font-size:12px;color:#fff;background:url(../images/si.png) no-repeat;position:absolute;left:0;top:6px;display:block;}
.step li:hover{color:#e31545}
.step li:hover label{background:url(../images/si2.png) no-repeat;}
.so{padding:2.7% 0 2%}
.with{font-size:0;letter-spacing:-5px;padding-bottom:1.7%}
.with li{width:13%;text-align:center;margin-left:1.5%;display:inline-block;letter-spacing:normal;margin-bottom:1%}
.with li:first-child{margin-left:0}
.with li dd{font-size:14px;color:#fff;padding-top:6%}
.go{text-align:center;letter-spacing:-4px;font-size:0;position:relative;}
.go li{width:120px;display:inline-block;font-size:16px;line-height:1.5;margin-left:96px;vertical-align:middle;position:relative;z-index:10;}
.be{padding-bottom:100%;border-radius:50%;background:#fff;color:#232021;position:relative;}
.go li:first-child{margin-left:0}
.go li:first-child::after{display:none;}
.go li dd{position:absolute;bottom:50%;left:5%;width:90%;-webkit-transform:translateY(50%);transform:translateY(50%);letter-spacing:normal;font-style:italic;}
.go li::after{width:120px;height:40%;top:30%;background:#fff;content:"";display:block;right:90%;position:absolute;}
.go li.active .be{background:#e31545;color:#fff;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;  }
.go li.active::after{background:#e31545;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;}
.go li.active{z-index:20}
.go li.hh{z-index:30}
.bea{background:#f7f7f7;overflow:hidden;}
.any{transform:scale(1);transition:all 0.8s ease-out;}
.any:hover{transform:scale(1.05);}
.keys{width:34%; padding-top:11.5%;padding-bottom:9%;padding-left:3%;padding-right:3%;text-align:center;position:relative;z-index:200;background:#f7f7f7;}
.key{border:2px solid #231f20;font-size:48px;position:relative;color:#231f20;padding:15% 8% 12%;line-height:1.2;position:relative; }
.key>label{font-size:36px;color:#231f20;position:absolute;top:0%;right:50%;background:#f7f7f7;padding:0 10%;display:inline-block;-webkit-transform:translate(50%,-50%);transform:translate(50%,-50%);}
.key::after{width:40%;height:24px;content:"";display:block;background:url(../images/no.jpg) no-repeat center center;background-size:100%;left:30%;bottom:0;margin-bottom:-12px;position:absolute;}
.say{font-size:16px;line-height:1.5;color:#231f20;margin-top:16% }
.list{padding-top:5%}
.list li{width:285px;float:left;margin-right:20px;cursor:pointer;margin-bottom:20px}
.list li a.label{padding-bottom:178px;margin-bottom:6.2%}
.list li:nth-child(4n){margin-right:0}
.list li dd{font-size:24px;color:#231f20;line-height:1.2;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.list li dd small{font-size:16px;filter:alpha(opacity=50);opacity:0.5;display:block;padding-top:2%}
.list li a.label::after{content:"";width:100%;height:100%;position:absolute;top:0%;left:0%;display:block;background:url(../images/big.png) no-repeat center center;background-size:cover;z-index:20;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;filter:alpha(opacity=0);opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
.list li:hover a.label::after{filter:alpha(opacity=100);opacity:1;-webkit-transform:scale(1);transform:scale(1);}
.list li:hover dd{color:#e31545}
.news li{width:32%;float:left;margin-right:2%;margin-bottom:3.8%}
.cover{display:block;padding-bottom:65%;filter:alpha(opacity=100);opacity:1;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.cover:hover{filter:alpha(opacity=80);opacity:.8;}
.news dt{font-size:20px;color:#231f20;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-top:5%;padding-bottom:3%}
.news dd{font-size:14px;color:#999999;}
.news p{font-size:14px;color:#231f20;padding-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.news p a{color:#e31544}
.news li:nth-child(3n){margin-right:0}
.ahead{text-align:center;padding-bottom:2%;position:relative;}
.ahead::after{width:1920px;height:1px;background:#ccc;content:"";position:absolute;left:0;margin-left:-360px;bottom:0}
.ahead dt{font-size:24px;color:#333333;margin-bottom:1%;font-weight:bold;}
.ahead dd{font-size:12px;color:#666666;}
.fall{font-size:16px;line-height:36px;color:#333;text-align:justify;margin-top:4%}
.fall p{text-indent:2em}
.fall  img{max-width:100%;display:block;margin:30px auto}
.offer{font-size:14px;color:#333;padding-top:15px;position:relative;clear:both; }
.offer::after{width:1920px;height:1px;background:#ccc;content:"";position:absolute;left:0;margin-left:-360px;top:0}
.offer a{float:left;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.offer a:first-child+a{float:right;}
.jewel{margin-top:-0.5%;text-align:center;background:url(../images/dian.jpg) repeat-x left center}
.nows{font-size:16px;color:#231f20;line-height:30px;text-align:center;padding-top:3%}
.history{font-size:16px;line-height:30px;color:#fff;text-indent:2em;text-align:justify;padding:5% 3%;background:#2e2a2b;background:rgba(46,42,43,.9)}
.better li{width:12.5%;float:left;margin-left:2%;text-align:center}
.better li:first-child{margin-left:0}
.per{padding-bottom:100%;position:relative;}
.per img{max-width:100%;left:0;top:0;position:absolute;filter:alpha(opacity=100);opacity:1;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.per img.sp{filter:alpha(opacity=0);opacity:0;}
.per:hover img{filter:alpha(opacity=0);opacity:0;}
.per:hover img.sp{filter:alpha(opacity=100);opacity:1;}
.better li dd{font-size:16px;color:#2e2a2b;padding-top:10%;-webkit-transition:all 0.5s ease;transition:all 0.5s ease}
.better li:hover dd{color:#e31545}
.better::after{content:"";clear:both;display:block;}
.brand{font-size:16px;margin-bottom:3.5%;color:#fff;text-align:center;margin-top:-1%}
.brand span,.brand a{margin:0 1%;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.brand span:hover,.brand a.active{color:#e31545}
.plam{margin-bottom:1%}
.vi img{display:block;max-width:100%;margin:0 auto}
.shop li{width:32.4%;float:left;margin-right:1.4%;margin-bottom:1.4%}
.shop li:nth-child(3n){margin-right:0}
.halo{padding-bottom:88%;position:relative;overflow:hidden;display:block;}
.halo img{position:absolute;top:0;left:0;width:100%; }
.shop::after{content:"";clear:both;display:block;padding-bottom:1%}
.wel{max-width:30%; }
.biao img{display:block;margin:0 auto;max-width:100%;}

 @media screen and (max-width: 1400px) {
 .banner img{margin-left:4%}
 }
 @media screen and (max-width: 1200px) {
  .key > label{font-size:24px;}
 .key{font-size:30px}
 .list li{width:23.5%;margin-right:2%}
 .list li a.label{padding-bottom:62%}
.list li dd{font-size:20px}
.list li dd small{font-size:14px}
.lead .cont{height:auto;}
.go li{margin-left:1%;margin-right:1%;margin-bottom:4%}
.go li::after{display:none;}
 }
 @media screen and (max-width: 1000px) {
.road2{height:auto!important}
.road{position:relative;float:none;top:0%;margin-top:0px!important;display:block;width:100%!important;text-align:right;padding-top:2%;min-height:56px}
.road2  .road{text-align:center;padding-top:0}
.better li dd{font-size:12px}
.news dt{font-size:16px}
.step li{font-size:12px;line-height:18px;padding-bottom:2px;padding-top:2px;padding-left:18px}
.step li label{height:20px;background-size:14px;width:14px;line-height:14px;top:4px}
 }

 @media screen and (max-width: 800px) { 
.road{margin-top:-22px;min-height:45px}
.road a{font-size:14px;line-height:45px;}
.road a.active{font-size:16px; }
#move::after,#move::before{width:8px;height:45px;background-size:8px;}
.key > label{font-size:16px;}
.key{font-size:20px}
.say{font-size:12px;line-height:1.2}
.home > img{max-height:50px; }
.list li dd{font-size:16px}
.list li dd small{font-size:12px}
.pho{font-size:14px;line-height:24px;padding:0 6px;margin-left:3%}
.pho img{margin-left:8px}
.nows,.history{font-size:14px;line-height:24px}
.better li{width:23.5%;margin-bottom:2%}
.better li:nth-child(5){margin-left:0;clear:both;}
.brand{font-size:14px;}
.news li{width:49%;}
.news li:nth-child(3n){margin-right:2%}
.news li:nth-child(2n){margin-right:0%}
.tels{display:block;width:90%;padding:5%}
.map{display:block;padding-right:50px}
.area{background-size:100%;}
.map label{font-size:12px}
.with li{width:24.2%;margin-left:1%}
.with li:nth-child(5){margin-left:0}
 }
 
 
 
 
 @media screen and (max-width: 640px) { 
 .banner{padding-top:22%}
 .fall img{margin:15px auto}
.offer a{max-width:100%; }
.offer a:first-child+a{float:left;margin-top:2%}
.ahead dt{font-size:18px}
.road{margin-top:-15px;min-height:30px}
.road a{font-size:12px;line-height:30px}
.road a.active{font-size:14px; }
#move{padding:0 7px;margin-left:-7px}
#move::after,#move::before{width:7px;height:30px;background-size:6px;}
.home > img{max-height:40px; }
.key > label{font-size:12px;}
.key{font-size:14px}
.list li{width:49%;}
.list li:nth-child(2n){margin-right:0}
.way dd{font-size:14px;padding:5px 0;line-height:18px;}
.answer	input{font-size:14px;line-height:31px;height:31px;} 
.answer	textarea{font-size:14px;line-height:20px;height:80px;}
.answer button{font-size:16px;line-height:40px}
.nows,.history{font-size:12px;line-height:18px}
.news dt{padding-top:3%;padding-bottom:1%}
.brand,.news p,.news dd,.with li dd{font-size:12px;}
.go li{width:100px;height:100px;font-size:14px}
 }