.main{ padding: 0 180px; width:100%;}

header{ height: 1rem; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); position: fixed; z-index: 99; top: 0; left: 0; width: 100%; transition: all .36s;}
header .mune{ height: 100%; background: transparent;   width: 1rem;  border-right: 1px solid rgba(255, 255, 255, 0.2);}
 
header .mune .burger{ width: 40%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;    position: absolute; left: 30%;
top: .38rem; }
header .mune .burger:first-child{animation: long 2s linear infinite}
header .mune .burger:nth-of-type(2){ top: .48rem; width: 20%;}
header .mune .burger:nth-of-type(3){ top: .58rem;animation: long 3s linear infinite}
.logo{ margin-left: .5rem;}
header .right{ width: 13.25rem;}
header .right nav{ width: 9.15rem; font-size: 16px;}
header .right nav a{ color: #fff;  line-height: 1rem; position: relative;}
header .right nav a::after{  display: block; content: '';width: 100%; height: 2px; left: 0; bottom: -1px; position: absolute; background: #fff; transform: scale(0,1) ;transition: all .36s;  }
header .right nav a:hover:after,header .right nav a.cur:after{ transform: scale(1,1);}
header .youlink{ padding-right: .4rem;}
header .youlink img{ width: 16px; }
header .youlink span{ opacity: 0.5; margin:0 .25rem;}
header .youlink img.oa{ margin-right: .1rem;}
header .icon2{ display: none;}

header.bg{ background: #fff;}
header.bg .icon1{ display: none;}
header.bg .icon2{ display: inline-block;}
header.bg .mune{ background: #c5261d;}
header.bg .mune .burger{ background: #fff;}
header.bg nav a{ color: #333;}
header.bg .right nav a::after{ background: #c5261d;}
header.bg .color-white{color: #333;}

header.min{height: .7rem;}
header.min .right nav a{ line-height: .7rem;}
header.min .mune .burger{ top:.2rem}
header.min .mune .burger:nth-of-type(2){ top: .3rem;}
header.min .mune .burger:nth-of-type(3){ top: .4rem;}
header.min  .logo img{ height: 40px;}

.nieban{ margin-top: 1rem; height: 8rem; position: relative;     }
.searchban{ margin-top: 1rem; height: 5rem;    }
.searchban .main{ padding-top:1.25rem;}
.nieban .main{ position: absolute; left:0; bottom: 5vh;}
.nieban ul{ height: 1.2rem;}
.nieban ul a{ flex: 1 ; text-align:center; border-right: 1px solid #e6e6e6 ;}
.nieban ul a:last-child{ border-right: none;}
.nieban ul a:hover{ color: #c5261d;} 

.aboutsection1{ background: url(/static/home/images/aboutsection1.png) no-repeat right bottom; background-size: 82% auto; padding: .75rem 0; }
.aboutsection1 .left{ width: 55%;}
.aboutsection1 .right{ width: 45%;}
.aboutsection1 .right img.twoImg{ width: 60%; margin-right: 5%;} 
.aboutsection1 .left .info{ margin-top: .4rem;}
.aboutsection1  ul{ margin-top: 1rem;}
.aboutsection1  ul li{ flex: 1;}
.aboutsection1  ul .DIN{ font-size: 1rem; font-weight: bold; margin-right: .2rem; filter: drop-shadow(.1rem .1rem  .5rem  rgba(197,39,29,.5));}
.aboutsection1 .xhkglogo{ width: 4rem ;  }
.aboutsection1  .subtitle{  line-height: 1; align-items: flex-end; }

.aboutsection2{ background: url(/static/home/images/aboutsection2.jpg) no-repeat center center; background-size: cover; background-attachment: fixed; position: relative; padding: 2rem 0;}
.aboutsection2 .videoplay{ width: 80px; height: 80px; margin: .4rem auto 0; border-radius: 50%; }
.aboutsection2 .videoplayimg{ width: 100%; animation: circle 2s linear infinite; position: absolute; top:0; left: 0;} 
.aboutsection2 .videoplay:hover{ background: rgba(0, 0, 0, 0.2);}


div.video-play{position:fixed;top:0;bottom:0;right:0;left:0;width:100vw;height:100vh;z-index:10001;display:none}
div.video-bg{position:absolute;top:0;bottom:0;width:100%;z-index:1001;background:#0b0b0b;opacity:.8}
div.video-wrap{z-index:1002;position:fixed;top:52%;left:50%;-webkit-transform:translate3d(-50%, -52%, 0);transform:translate3d(-50%, -52%, 0);width:1000px;height:570px;  }

div.video-wrap video{width:100%;height:auto}
div.close-btn{cursor: pointer; transition: all .36s;
 
 text-align: center;
 line-height: 40px;
 z-index: 9999;
 position: absolute;
 background: #000;
 border: 2px solid #fff;
 width: 50px;
 height: 50px;
 border-radius: 50%; opacity: 0.5;
 right: -20px;
 top: -25px;}
 div.close-btn:hover{ transform: rotate(180deg); opacity: 1;}

 .aboutsection3{ padding: .7rem 0;}

 

 
footer{width: 100%; background: #fff; transition: all 1s; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);}
footer  .top{  padding-top:35px; padding-bottom: 35px;}
.footNav{ width: 2.4rem;}
.footNav a{ display: block;}
.footNav a:hover{ color: #c5261d; font-weight: bold;}
.footewm{ width: 3.5rem;}
.footewm li{ width: 42%;}
footer .bottom{ background: #f8f8f8; height: .8rem;}
footer .bottom  a:hover{ color: #c5261d; font-weight: bold;}

.aboutsection1 .two .left{ width: 39%;}
.aboutsection1 .two .right{ width: 52%; padding-bottom: 1.2rem;}
.aboutsection1 .two .right .info{ margin-top: .6rem;}

.aboutsection4{ background: url(/static/home/images/aboutsection4.jpg) no-repeat center bottom #333e5e; padding: 1rem 0;}
.aboutsection4 .main .left .info{ line-height: 3.6; margin-top: .5rem;}
.aboutsection4 .main .right{ width: 58%;}

.aboutsection5{ padding: .7rem 0;}
.aboutsection5 ul{ margin-top: .7rem;}
.aboutsection5 ul li{  position: relative;  
width: 3.8rem;
  height:  3.8rem; line-height: 2;
 
} 
 
  .aboutsection5 ul li::before{ display: block; content: '';   position: absolute; top: 0; left: 0; background: url(/static/home/images/aboutsection5BigIco.png) no-repeat center center; background-size: 100% 100%; 
transition: all .36s;width:100%;
height:0;
padding-bottom:100%; } 
 .aboutsection5 ul li:nth-child(2n)::before{transform: rotate(180deg);}  
.aboutsection5 ul li .icon1{   transition: all .36s;}
.aboutsection5 ul li .icon2{ display: none;  }
.aboutsection5 ul li span{ box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);}
.aboutsection5 ul li span.icon{ width: 1.2rem; height:  1.2rem; border-radius: 50%; background: #fff; position: relative; margin-bottom: .3rem;  transition: all .2s; }
.aboutsection5 ul li span.icon img{ z-index: 5; position: relative;}
.aboutsection5 ul li span.icon::after{ transition: all .56s; display: block; content: ''; width:23% ; height: 23%; position: absolute; bottom: 26%; right: 26%; background: #fcf2f2; border-radius: 50%; z-index: 1;}
 .aboutsection5 ul li::after{ display: block; content: ''; width: .3rem; height: .3rem; background: url(/static/home/images/aboutsection5Ico.png) no-repeat center center; background-size: cover;
     position: absolute; right: -.15rem; top: 50%;  margin-top: -.15rem; transition: all .36s;} 
  .aboutsection5 ul li:last-child::after{ display: none;}  
.aboutsection5 ul li:hover::before {transform: rotate(130deg);}
.aboutsection5 ul li:hover span.icon{ background: #c5261d; margin-bottom: .2rem;}
.aboutsection5 ul li:hover span .icon2{ display:  block;    }
.aboutsection5 ul li:hover span .icon1{ display: none;}
  .aboutsection5 ul li:hover span.icon::after{ right: 0; bottom:0 ;}  

.aboutsection6{ background: url(/static/home/images/aboutsection6.jpg) no-repeat center center; background-size: cover; background-attachment: fixed; position: relative; padding: 2.3rem 0; position: relative; }
.aboutsection6::after{ display: block; content: ''; position: absolute; top: 0; left: 0;width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2);  z-index: 5;}
.aboutsection6 ul { position: relative; z-index: 8;}
.aboutsection6 ul li{ width: 25%;transition: all .36s;}
.aboutsection6 ul li .icon{ width: 90px; height: 90px; position: relative;   border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.2); transition: all .36s;}
.aboutsection6 ul li .icon img{ width:42% ;}
.aboutsection6 ul li .line{ background: #fff; width: 20px; height: 3px;}
.aboutsection6 ul li p{ font-size: 20px; color: rgba(255, 255, 255, 0.9); line-height: 2;}
/*  box-shadow: 0  0 15px rgba(197, 38, 29, 0.8); */
.aboutsection6 ul li:hover span.icon{ background: #c5261d; border-color: #c5261d;  box-shadow: 0  0 15px rgba(255, 255, 255, 0.8);
 }  
 /*  -webkit-transform:rotateY(180deg) translateZ(0);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg) translateZ(0) */
.aboutsection6 ul li:hover  {   transform: translateY(-20px);   }

 

.aboutsection6 ul li:hover .icon i:before {
  animation: serv_one_border .9s 0s ease 1;
  -webkit-animation: serv_one_border .9s 0s ease 1;
  -moz-animation: serv_one_border .9s 0s ease 1;
  -o-animation: serv_one_border .9s 0s ease 1
}

.aboutsection6 ul li:hover .icon i:after {
  animation: serv_one_border 1.5s 0s ease 1;
  -webkit-animation: serv_one_border 1.5s 0s ease 1;
  -moz-animation: serv_one_border 1.5s 0s ease 1;
  -o-animation: serv_one_border 1.5s 0s ease 1
}

.aboutsection6 ul li:hover .icon i {
  background: transparent;
  border-color: #c5261d
}



.aboutsection6 ul li .icon i {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  width: 90px;
  height: 90px;
  border: 1px solid #dedede;
  border-radius: 50%;
  transition: .6s;
  -ms-transition: .6s;
  -o-transition: .6s;
  -webkit-transition: .6s;
  -moz-transition: .6s
}

.aboutsection6 ul li .icon i:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  border: 1px solid #c5261d;
  width: 100%;
  height: 100%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  opacity: 0
}

.aboutsection6 ul li .icon i:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  border: 1px solid #c5261d;
  width: 100%;
  height: 100%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  opacity: 0
}


.aboutsection7{ padding-top: 1rem ;  }
.aboutsection7 .bg{ width: 58%; position: absolute; top: 1rem; right: 0; z-index: 1;}
.aboutsection7 .left,.aboutsection7 .right{ position: relative; z-index: 2;}
/* .aboutsection7   .logo-red{  position: absolute; width: 15%; bottom:0; left: 13%; z-index: 5;} */
/*  */
.aboutsection7 .left{ width: 42%;}
 .logo-red{ width: 15%;  margin-left:13%;  }
 /* animation: leftRight  10s linear infinite; */
.aboutsection7 .right { width: 58%;  }
.aboutsection7 .right .text{background: #fafafa; margin-top: .9rem; padding-right:180px; padding-left: .6rem; height: calc(100% - .9rem); justify-content:center;  flex-direction: column;  }
.aboutsection7 .right .img img{ max-width: 70%;}
.aboutsection7 .right .txt{ margin-top: .5rem;}
.aboutsection8 ul { margin-top: .6rem;}
.aboutsection8 ul li{ width: 20%; transition: all .42s; position: relative;}
.aboutsection8 ul li div:first-child{ opacity: 0.3;transition: all .42s;}
.aboutsection8 ul li div:nth-child(2){ width: 100%;  height: 1px; background: rgba(0, 0, 0, 0.3); margin: .36rem 0 .6rem; position: relative;transition: all .42s;}
.aboutsection8 ul li div:nth-child(2)::after{ display: block; width:0; height: 100%; z-index: 2; content: ''; background: #c5261d; position: absolute;  left: 0; top: 0; transition: all .6s;}
.aboutsection8 ul li div:nth-child(4){ margin-top: .35rem;}



 .aboutsection8 ul li:hover{ z-index: 5;   }
.aboutsection8 ul li:hover div:first-child{ color: #c5261d;   opacity: 1; }
.aboutsection8 ul li:hover div:nth-child(2){ }
.aboutsection8 ul li:hover div:nth-child(2)::after{ width: 100%; height: 2px;}
.aboutsection8 ul li:hover div:nth-child(3) img{ box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); transform: scale(1.1) translateZ(0);  }

.card-grid:hover > .card:not(:hover) img{
  filter:   blur(5px);; 
  /* brightness(0.5) saturate(0) contrast(1.2) blur(20px); */
}

.aboutsection9{ margin-top: .96rem;}
.aboutsection9 .bg{ width: 50%; position: absolute; bottom: 0; left: 0; z-index: 1;}
.aboutsection9 .left{ background: #fff;}
.aboutsection9 .left,.aboutsection9 .right{ z-index: 5; position: relative;}
.aboutsection9 .left img{  width:90%;}
.aboutsection9 .right   .title{ margin-bottom: .4rem;}
.aboutsection9 .right{ background: url(/static/home/images/aboutsection9right.jpg) no-repeat center center; background-size: cover; padding-right: 180px; padding-left: .8rem; padding-top: 1rem; padding-bottom: .6rem;}
.aboutsection9 .right .item { padding: .4rem 0; position: relative;}

.aboutsection9 .right .item::after{ width: 0; height: 75%; display: block; content: ''; background: #fff; position: absolute; top:10%; right: 0; z-index: 1; border-radius: 15px; transition: all 1s;}
.aboutsection9 .right .item:hover::after{  width: 95%;}

.aboutsection9 .right .item  span::after{  display: block; content: '';width: 0; height: 2px; background: #c5261d; position: absolute; right:-10px; top:50% ; margin-top: -1px; transition: all 1s;}

.aboutsection9 .right .item span,.aboutsection9 .right .item div{ position: relative; z-index: 10; transition: all .36s;}
.aboutsection9 .right .item span{ color: rgba(0, 0, 0, 0.1); font-size: .8rem; width: 1.1rem;}
.aboutsection9 .right .item .f16{ margin-top: .1rem;}

.aboutsection9 .right .item:hover span{ color: #c5261d; transform: translateX(-32px);}
.aboutsection9 .right .item:hover span::after{width: 24px;}

.aboutsection10{ }
.aboutsection10right{ width: 86% ; position: relative;padding: .8rem 0;}
.aboutsection10right::after{ display: block; content: '';position: absolute; top: 0; left: 50%; width: 1px; height: 100%; background: #f9e9e8;}
.aboutsection10right .item{   padding-top: 1.2rem; align-items: flex-start;}
.aboutsection10right .item::after{ display: block; content: ''; width: .25rem; height: .25rem; position: absolute; left: 50%; top: 1.2rem; margin-left: -.125rem; background: url(/static/home/images/history-ico.png) no-repeat center center;
background-size: 100%  100%; z-index: 1;}
.aboutsection10right .item figure{ width: 40%;}
.aboutsection10right .item  .txt{ text-align: right;}
.aboutsection10right .item .img  { box-shadow: 0 0 .45rem rgba(0, 0, 0, 0.1); transition: all .36s;}
.aboutsection10right .item .img:hover{ transform: translateY(-.2rem); box-shadow: 0 0 .45rem  rgba(197, 38, 29, 0.3); }
.aboutsection10right .item:nth-child(2n){ flex-direction: row-reverse;}
.aboutsection10right .item:nth-child(2n) .txt{ text-align: left;}

.aboutsection10left { padding-top: .8rem; position: static;}
.aboutsection10left ul.fixed{ position: fixed; top: 1.2rem;  left: 0; width: 100px;}
.aboutsection10left ul  li a{ font-size: 18px; color: #aaaaaa; line-height: 3.3; transition: all .36s;  position: relative; }
.aboutsection10left ul  li a:hover,.aboutsection10left ul  li a.current{ color: #c5261d; font-size: 20px; padding-left: 35px;}
.aboutsection10left ul  li a::after{display: block; content: ''; width: 0; height: 2px; left: 0; top: 50%; margin-top: -1px; background: #c5261d; position: absolute; transition: all .36s; }
.aboutsection10left ul  li a:hover::after,.aboutsection10left ul  li a.current::after{ width: 32px}

#timeline { width: 100%; position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; padding: 50px 0; }
#timeline:before { content: ""; width: 1px; height: 100%; background: #f1f1f1; left: 50%; top: 0; position: absolute; }
#timeline:after { content: ""; clear: both; display: table; width: 100% }
#timeline .timeline-item { margin-top: 0; position: relative; transition: all .36s; }
#timeline .timeline-item .timeline-icon { border: 2px solid #e9adaa; width: 25px; height: 25px; line-height: 25px; font-size: 0; position: absolute; bottom: 38px; left: 50%; overflow: hidden;
   margin-left: -12px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50% ;}
   #timeline .timeline-item .timeline-icon::after{ width: 10px; height: 10px; border-radius: 50%; background: #c5261d;  content: ''; display: block; position: absolute; bottom:6px;left: 50%;
    margin-left: -5px;}
#timeline .timeline-item .timeline-content { width: 46%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
#timeline .timeline-item .timeline-content:before { content: ''; position: absolute; left: 46%; bottom: 38px; width: 0; height: 0; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 9px solid #ececec; }
#timeline .timeline-item .timeline-content.right { float: right; }
#timeline .timeline-item:nth-child(2n) .timeline-content:before { content: ''; right: 46%; left: inherit; border-left: 0; border-right: 9px solid #ececec; }
.timeline-txt, .timeline-year { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; }
.timeline-txt { background: #f7f7f7 }
.timeline-year { background: #ececec; color: #c5261d; font-weight: bold; }
/* .timeline-content:hover .timeline-txt { background: #f6d9d7 } */
 #timeline .timeline-item:nth-child(2n) .timeline-content{ float: right;}
.timeline-content:hover .timeline-year { background: #c5261d; color: #fff }
.timeline-content:hover:before { border-left: 9px solid #c5261d!important }
#timeline .timeline-item:nth-child(2n) .timeline-content:hover:before { border-left: 0!important; border-right: 9px solid #c5261d!important }

.cf{ zoom: 1;}
.padding30{ padding: 30px;}
.right{ float: right;}
.timelinelink{display: block; margin: 40px 0;}

@media screen and (max-width: 800px) {
.timeline-box { padding-top: 0; padding-bottom: 30px; }
#timeline:before { left: 0; }
#timeline .timeline-item { margin-top: 30px; }
#timeline .timeline-item .timeline-content { width: 94%; float: right; }
#timeline .timeline-item .timeline-content:before, #timeline .timeline-item .timeline-content.right:before { left: 6%; margin-left: -8px; border-left: 0; border-right: 9px solid #ececec; }
#timeline .timeline-item .timeline-icon { left: 0; width: 16px; height: 16px;  margin-left: -8px;}
#timeline .timeline-item .timeline-icon::after{ width: 6px; height: 6px;    bottom: 4px;    margin-left: -3px;}
.padding30{ padding: 12px;}
#timeline{ padding: 25px 0;}
.timelinelink{  margin:0 0 25px 0;}
}



.mt-hearder{ margin-top: 1rem;}
.newslist1{ padding: .55rem 0;}
.newslist1 .swiper-slide .txt{ padding: .85rem .55rem;}
.newslist1 .swiper-slide .txt .tit{ width: 70%;}
.newslist1 .swiper-slide .txt .more::after{display: block; content: ''; width: 0; height: 2px; background: #c5261d; top: 50%; left: 0; margin-top: -1px; position: absolute ; transition: all .36s;}
.newslist1 .swiper-slide:hover .txt .more::after {  width: .3rem; }
.newslist1 .swiper-slide:hover .txt .more{padding-left: .35rem;}
.newslist1 .swiper-slide:hover .txt .tit{ color: #c5261d;}
.newslist1page{ width: 1.4rem; margin-top: .3rem;}
.newslist1page a{ width: .6rem; height: .6rem; display: block; background: url(/static/home/images/right2.png) no-repeat center center #d8d9d8; background-size: 20% auto;}
.newslist1page a:first-child{ transform: rotate(180deg);}
.newslist1page a:hover{ background: url(/static/home/images/right2.png) no-repeat center center #c5261d; background-size: 20% auto;}





.newslist2{ background: #fafafa; padding: .5rem 0 0; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);}
.newslist1Class li{ float: left; margin-right: .8rem; }
.newslist1Class li a{ color: #aaa; }
.newslist1Class li a:hover,.newslist1Class li a.cur{ color: #c5261d;}
.newslist2 .list li{ width: 31%; float: left; margin-right:3.5% ; margin-top: .6rem;transition: all .36s;}
.newslist2 .list li:nth-child(3n){ margin-right: 0;}
.newslist2 .list li .img { position: relative; overflow: hidden;}
.newslist2 .list li .img .img_pic{ width: 100%; height: 3rem; object-fit: cover; transition: all .5s;}
.newslist2 .list li .img .img_tu{ opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(/static/home/images/img_tu.png) center center no-repeat rgba(0,0,0,0.3); z-index: 10;
display: flex; flex-direction: column; align-items: center; justify-content: center;}
.newslist2 .list li .img .img_tu img{ width: 140px; transition: all 0.5s ease; -webkit-transform: all 0.5s ease;}
.newslist2 .list li:hover .img .img_tu img{    -webkit-transform: rotate(360deg);
    animation: rotation 10s linear infinite;
    -moz-animation: rotation 10s linear infinite;
    -webkit-animation: rotation 10s linear infinite;
    -o-animation: rotation 10s linear infinite;}
.newslist2 .list li:hover .img .img_tu{ opacity: 1;}

.newslist2 .list li .txt{ padding: .3rem   ;}
.newslist2 .list li .txt  div{ position: relative; z-index: 5;}
.newslist2 .list li .txt .date{  color: #aaa;}
.newslist2 .list li .txt .tit{ margin: .2rem 0; height: 86px;}
/* .newslist2 .list li .txt::after{ display: block; content: ''; position:  absolute; left: 0; top: 0; width: 0; height: 100%; background: #c5261d;transition: all .36s;} */
.newslist2 .list li:hover{ box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);  transform: translateY(-8px);}
/* .newslist2 .list li:hover .txt::after{ width: 100%;} */
.newslist2 .list li:hover .txt .tit{ color: #c5261d !important; font-weight: bold;}
/* .newslist2 .list li:hover .img .img_pic{ transform: scale(1.1);} */
/* .newslist2 .list li:hover b{ display:block; width:100%; height:100%; position:absolute; left:0; top:0; border:1px #fff solid; z-index:20;
  -webkit-transition: -webkit-transform .32s cubic-bezier(.51,1.1,.9,.95);
      -moz-transition: -moz-transform .32s cubic-bezier(.51,1.1,.9,.95);
      -ms-transition: -ms-transform .32s cubic-bezier(.51,1.1,.9,.95);
      -o-transition: -o-transform .32s cubic-bezier(.51,1.1,.9,.95);
      transition: transform .32s cubic-bezier(.51,1.1,.9,.95);}
.newslist2 .list li:hover b{ -webkit-transform: scale(0.89); -moz-transform: scale(0.89); -ms-transform: scale(0.89); -o-transform: scale(0.89); transform: scale(0.89);} */

.newslist3{}
.newsDeatil{ width: 1200px; margin: 0 auto;}
.newsDeatil .location{ padding: .5rem 0;}
.newsDeatil .location img{  }
.newsDeatil .location  a{ margin:  0 .15rem;}
.newsDeatil .location  a:hover{ color: #c5261d;}
.newsDeatil .location span{ color: #c5261d; margin-left: .15rem;}
.newsDeatil .info{ padding: 1rem; margin-bottom: .5rem;}
.Deatilpage{ border-top: 1px solid #e5e5e5; margin-top: .3rem; padding: .3rem 0 0;}
.Deatilpage ul{ width: 60%; line-height: 3;}
.Deatilpage ul a:hover{ color: #c5261d;}
.Deatilpage .back{ background: #f9e9e8; width: 1.6rem; height: 40px; border-radius: 20px;}
.Deatilpage .back img{ margin-right: .2rem;}
.Deatilpage .back .icon2{ display: none;}
.Deatilpage .back:hover .icon2{ display: inline-block;}
.Deatilpage .back:hover .icon1{ display: none;}
.Deatilpage .back:hover{ background: #c5261d; color: #fff;  }

.business1{ height: .8rem; box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.1);}
.business1 a{ padding: .08rem .15rem; margin: 0 .1rem; transition: all .36s;}
.business1 a:hover,.business1 a.cur{ background: #c5261d; color: #fff; border-radius: .05rem;}

.business2 { padding: .55rem 0;}
.business2 .swiper-slide .txt figure{ width: 90%;}
.business2 .swiper-slide .txt h2{ margin-bottom: .3rem;}
 
.business2 .swiper-slide .txt  a{border: 1px solid rgba(0, 0, 0, 0.2); width: 2.2rem;  height: 50px;  padding: 0 .3rem; border-radius: 30px; }
.business2 .swiper-slide .txt  a span ,.business2 .swiper-slide .txt  a img{ position: relative;  z-index: 2;} 
.business2 .swiper-slide .txt a::before{ display: block; width: 10%; opacity: 0;  height: 100%; content: ''; background: #c5261d; position: absolute; top: 0; left: 0; border-radius: .3rem; transition: all .5s;}
.business2 .swiper-slide:hover .txt a{box-shadow: 0 0 .15rem rgba(197, 38, 29, 0.8); border-color: #c5261d; color: #fff; transform:  translateX(.2rem); } 
.business2 .swiper-slide .txt a .icon2{ display: none;}
.business2 .swiper-slide:hover .txt a::before{  width: 100%; opacity: 1;} 
.business2 .swiper-slide:hover .txt a .icon2{ display: inline-block !important;}
.business2 .swiper-slide:hover .txt a .icon1{ display: none;}
.business2 .swiper-slide .img { overflow: hidden;}
.business2 .swiper-slide .img img{ width: 90%;}
.business2 .swiper-slide:hover .img{ box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.1);}
.business2 .swiper-slide:hover .img img{ transform: scale(1.1);}
.business2page{ width: 180px; position: absolute;top: 0; right: 0; height: 100%; background: #f9e9e8;}
.business2page a{ opacity: 0.3; margin: .25rem 0;}
.business2page a:hover{ opacity: 1;}
.business2page .pre{ transform: rotate(180deg);}
.business2page .swiper-pagination{ position: relative; display: flex; flex-direction: column;}
.business2page .swiper-pagination-bullet{ background: rgba(255, 255, 255, 0.8); width: 10px; height: 10px; border-radius: 50%; opacity: 1; margin: .1rem 0;}
.business2page .swiper-pagination-bullet-active{ background: url(/static/home/images/business2pageicon.png) no-repeat center center; background-size: cover;}
.newslist2 .list li .txt .address{ border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; padding: .2rem 0; margin-bottom: .2rem;}
.newslist2 .list li .txt .icon2{ display: none;}
/* .newslist2 .list li:hover .txt .icon1{ display: none;} */
/* .newslist2 .list li:hover .txt .icon2{ display: inline-block;} */

.infoban{ height: 6rem;}
.homelocation{ height: 85px;}
.homelocation a,.homelocation span{   margin: 0  8px;}
.serviceback {width: 160px;line-height: 50px; display: block;perspective: 500;-webkit-perspective: 500; }
.serviceback .w {position: relative;-webkit-transition: all 0.25s;-o-transition: all 0.25s;transition: all 0.25s;-webkit-transform-style: preserve-3d;        transform-style: preserve-3d;pointer-events: none;}
.serviceback .f { background: #fff;padding: 0 30px; color: #333; } 
.serviceback .t {position: absolute;background-color: #c5261d;width: 100%;height: 100%;padding: 0 30px;left: 0;color: #fff;top: -50px;-webkit-transform-origin: center bottom;    -ms-transform-origin: center bottom;        transform-origin: center bottom;-webkit-transform: rotateX(90deg);        transform: rotateX(90deg);-webkit-backface-visibility: hidden;        backface-visibility: hidden;}
.serviceback:hover .w {-webkit-transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);        transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);}
.info-top{ margin-top: -2.4rem;}
.padding-45{ padding: .45rem;}

.ypjcinfo1 .img{ width: 50%;}

.ypjcinfo1 .txt{ padding:  0 .35rem; width: 50%;}
 

.ypjcinfo1 .txt a {width: 160px;line-height: 50px; display: block;perspective: 500;-webkit-perspective: 500;  margin-right: 20px;  }
.ypjcinfo1 .txt a .w {position: relative;-webkit-transition: all 0.25s;-o-transition: all 0.25s;transition: all 0.25s;-webkit-transform-style: preserve-3d;        transform-style: preserve-3d;pointer-events: none;}
.ypjcinfo1 .txt a .f { background: #294179;padding: 0 30px; color: #fff; } 
.ypjcinfo1 .txt a .t {position: absolute;background-color: #f5f7f9;width: 100%;height: 100%;padding: 0 30px;left: 0;color: #333;top: -50px;-webkit-transform-origin: center bottom;    -ms-transform-origin: center bottom;        transform-origin: center bottom;-webkit-transform: rotateX(90deg);        transform: rotateX(90deg);-webkit-backface-visibility: hidden;        backface-visibility: hidden;}
.ypjcinfo1 .txt a:hover .w {-webkit-transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);        transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);}
.ypjcinfo1 .txt div.f20{ border-bottom: 1px solid #e5e5e5; padding-bottom: 35px; margin-bottom: 35px;}

.ypjcinfo1 .txt .line{  width:10%; height: 3px;}
.ypjcinfo1 .txt ul{ font-size: 20px; line-height: 2;}
.ypjcinfo1 .txt  ul li:first-child{ }
.ypjcinfo1 .txt ul li:last-child{}
.ypjcinfo1 .txt ul img{ margin-right: .2rem;}


.ypjcinfo1 .txt div.info{ max-height: 2rem; height: 2rem; overflow-y: scroll;    padding-right: 15px;}
.ypjcinfo1 .txt div.info::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 5px;}
.ypjcinfo1 .txt div.info::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #c5261d; width: 5px; }
.ypjcinfo1 .txt div.info::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #f2f5f9; width: 5px; }
 
.ypjcinfo2{ padding-bottom: .5rem;}
.businesstit{ padding: .5rem 0;}
.xgxm .swiper-slide .txt{ height: .6rem; font-size: 16px;}
.xgxm .swiper-slide .img{ position: relative; overflow: hidden; display: block; margin: 0 auto;}
.xgxm .swiper-slide .img img{width: 100%; transition: all .5s;  overflow: hidden; display: block;}
.xgxm .swiper-slide:hover .img img{ transform: scale(1);}
.xgxm .swiper-slide:hover .txt { background: #c5261d;}
.xgxm .swiper-slide:hover .txt{ color: #fff;}
.xgxm .xgxmpage{ border: 1px dashed #ababab; width: .6rem; height: .6rem; background: url(/static/home/images/xgxmpre.png) no-repeat center center;  background-size: 50% auto;
position: absolute; top: 50%;  margin-top: -.3rem; border-radius: 50%;}
.xgxm .xgxmnext{left: -.7rem;}
.xgxm .xgxmpre{ transform: rotate(180deg); right: -.7rem;}
.xgxm .xgxmpage:hover{background: url(/static/home/images/xgxmpre-white.png) no-repeat center center #c5261d;  background-size: 50% auto; border-color: #c5261d;}






.swiperxgxm  .swiper-slide {
	-webkit-transition: transform 1.0s;
	-moz-transition: transform 1.0s;
	-ms-transition: transform 1.0s;
	-o-transition: transform 1.0s;
	-webkit-transform: scale(0.85);
	transform: scale(0.85);
	
}

.swiperxgxm  .swiper-slide.swiper-slide-active {-webkit-transform: scale(1);	transform: scale(1);}

.swiperxgxm::after{position: absolute; content:""; left: 0; top: 0; background-color: rgba(250,250,250,.5); width: 20%; height: 100%; z-index: 9;}
.swiperxgxm::before{position: absolute; content:""; right: 0; top: 0; background-color: rgba(250,250,250,.5); width: 20%; height: 100%; z-index: 9;}


.swipertherd .txt{  position: absolute; left: 10%; bottom: 5%; }
.swipertherd .txt .info{  height: 0;padding: 0 15px;}
.swipertherd .txt .more{ height: 0; transform: scale(0,1) ;}
.swipertherd .txt .tit{   font-size: 18px; text-align: left; width: 100%;}

.swipertherd .swiper-slide:hover .txt{ width: 80%; height: 80%; position: absolute; background: rgba(0, 0, 0, 0.7);left: 10%; top: 10%;}
.swipertherd .swiper-slide:hover .txt .tit{ font-size: 22px; text-align: center;}
.swipertherd .swiper-slide:hover .txt .info{ height: auto;margin: .25rem 0;}
.swipertherd .swiper-slide:hover .txt .more{ height: auto; transform: scale(1,1) ;}

.goodLife1{ padding: .9rem 0;}
.goodLife1 .txt .tit{ font-size: 20px;  height: 1rem; box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.1); border-radius: 5px; position: relative; transition: all .36s;}
.goodLife1 .txt .tit:hover{  background: #c5261d; color: #fff; transform: translateY(-.2rem);}


.goodLife1 .txt .title::after{ position: absolute; bottom: -.2rem; left: 0; width: 10%; height: 3px; display:block ; content: ''; background: #c5261d;}
.goodLife1 .img{  background: url(/static/home/images/goodLife1Img.jpg) no-repeat right top; background-size: 48% auto; padding-top: 1.5rem;}
.goodLife1 .img img{ width: 80%;}
.goodLife1 .txt .tit::after{display:block ; content: ''; width: .24rem; height: .23rem; background: url(/static/home/images/goodLife1-icon.png) no-repeat center center; background-size: cover;
position: absolute; left: .2rem; top: .2rem; }
.goodLife1 .txt .tit::before{display:block ; content: ''; width: .24rem; height: .23rem; background: url(/static/home/images/goodLife1-icon.png) no-repeat center center; background-size: cover;
  position: absolute; right: .2rem; bottom: .2rem; transform: rotate(180deg);}

.goodLifeApp{ background:url(/static/home/images/goodLifeAppBg.png) no-repeat center bottom #fbfbfe; background-size: 100% 50%; padding: .6rem 0;}
.goodLifeApp .swiper-slide .img{ width: 90%; margin: 0 auto; margin-top: .8rem; }
.goodLifeApp .swiper-slide .img img{-webkit-filter: drop-shadow(10px 10px 10px rgba(0,0,0,.2)); /*考虑浏览器兼容性：兼容 Chrome, Safari, Opera */
  filter: drop-shadow(0 0 10px rgba(0,0,0,.2)); width: 22%;}
 
.goodLifeApp .xgxmpage{ border: 1px dashed #ababab; width: .6rem; height: .6rem; background: url(/static/home/images/xgxmpre.png) no-repeat center center;  background-size: 50% auto;
    position: absolute; top: 60%;    border-radius: 50%;}
.goodLifeApp .xgxmpre{ transform: rotate(180deg); right: -.7rem;}
.goodLifeApp .xgxmnext{left: -.7rem;}
.goodLifeApp .xgxmpage:hover{background: url(/static/home/images/xgxmpre-white.png) no-repeat center center #c5261d;  background-size: 50% auto; border-color: #c5261d;}

.advantage{ background: url(/static/home/images/advantageBg.jpg) no-repeat center center; background-size: cover;  background-attachment: fixed; position: relative; padding: .6rem 0;}
 .goodLifeTit .line{ width: 20px; height: 4px; margin: .25rem auto; }
 .goodLifeTit .desc{ font-size: 20px;}
 .advantage .main{ margin-top: .5rem;}
.advantage ul{ width: 90%; margin: 0 auto;}
.advantage ul li{ width:3.6rem;  height: 3.6rem; margin-left: -.2rem; border: 1px #fff dashed; float: left; border-radius: 50%; text-align: center; line-height: 2;
padding: 0 .6rem; transition: all .5s;}
.advantage ul li .f26{ margin-top: 1.26rem;}
.advantage ul li:hover{ background: #c5261d; color: #fff; transform: scale(1.05);  z-index: 5; box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.2);}

.sixsystem{ padding: .6rem 0;}
.sixsystem ul::after{ display: block; content: ''; width: 100%; height: 1px; position: absolute; left: 0; top: 50%;margin-top: .14rem; background: #f9e9e8; z-index: 1;}
.sixsystem ul{ margin-top: .6rem;}
.sixsystem ul li{ width: 25%; margin-right: 5%;  transition: all .36s;  text-align: center; background: #fff; box-shadow: 0 5px .3rem rgba(0, 0, 0, 0.05);
 padding: .4rem ;  margin-bottom: .8rem;} 
.sixsystem ul li .color-666{ line-height: 1.8;font-size: 14px;}
.sixsystem ul li  .f24{ margin: .18rem 0; }
.sixsystem ul li .img{ border: 1px dashed #e5e5e5; border-radius: 50%; width: .8rem; height: .8rem;}
.sixsystem ul li .img img{ width: 40%;}
.sixsystem ul li:nth-child(n+4){ box-shadow: 0 -5px .3rem rgba(0, 0, 0, 0.05); margin-bottom: 0; margin-top: .5rem; }
.sixsystem ul li::after{content: "";position: absolute;border-width:   0 18px 18px;border-style: solid;border-color: transparent transparent #fff;bottom: -18px; transform: rotate(180deg);}
 .sixsystem ul li:nth-child(n+4):after{   bottom: auto; top:-18px;   transform: rotate(0); }  
.sixsystem ul li::before{content: "";display: block; position: absolute; width: .25rem; height: .25rem; background: url(/static/home/images/history-ico.png) no-repeat center center; background-size: 100% 100%;
 bottom: -.8rem;z-index: 5; transition: all .5s;  }
 .sixsystem ul li:nth-child(n+4)::before{ bottom: auto; top: -.8rem;}
.sixsystem ul li:nth-child(4){ margin-left: 15%;  }
.sixsystem ul li:last-child{ margin-right: 0;}
.sixsystem ul li:hover{ transform: translateY(-.2rem); background: #c5261d; color: #fff  ; }
.sixsystem ul li:hover .img{ background: #fff;}
.sixsystem ul li:hover .color-666{ color: #fff;}
.sixsystem ul li:hover::before{ transform: translateY(.2rem);}
.sixsystem ul li:hover:after{border-color: transparent transparent #c5261d; }

.ProjectDisplay{ padding: .6rem 0 .7rem;}
.ProjectDisplay .swiper-container{ margin: .6rem 0 .4rem;}
.ProjectDisplay .ProjectDisplay-pagination .swiper-pagination-bullet{ background: #dddddd; width: 10px; height: 10px; margin: 0 .08rem; opacity: 1; border-radius: 5px;}
.ProjectDisplay .ProjectDisplay-pagination .swiper-pagination-bullet-active{ background: #c5261d; width: 34px;}

.w1400{ margin: 0 auto; width: 1400px;}
.Real ul li{ margin-top: .6rem;}
.Real ul li a{ display: block; overflow: hidden;}
.Real ul li .left { position: absolute; top: 0; left:0; display: none; z-index: 5; height: 100%; padding: 5% 0; animation: rightFloat .3s;}
.Real ul li .left .tit{ font-size: .6rem;  letter-spacing: 2px;}
.Real ul li .left .more span{ width: .7rem; height: .7rem; border-radius: 50%; border: 1px solid #e5e5e5; margin-left: .25rem;}
.Real ul li .left .more span img{ width: 35%;}
.Real ul li .left .more span .icon2{ display: none;}
.Real ul li:hover .left .more span{ background: #c5261d; }
.Real ul li:hover .left .more span .icon2{display: block; }
.Real ul li:hover .left .more span .icon1{display: none; }
.Real ul li .img{ width: 80%; border-radius: .2rem;  }
.Real ul li h2{z-index: 2;font-family: messapia-bold;    color: transparent;-webkit-text-stroke: 1.2px #aaa; font-size: 2rem; position: absolute; right: 0; top: 0; height: 100%;}

.Real ul li:hover .left{ display: flex;}
.Real ul li:hover .img{ width: 80%; margin-left: 20%; box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.1); }
.Real ul li:hover h2{right:-50%;}

.TalentView{  padding: .8rem 0;}
.TalentView .img img{ width: 100%;  }
.TalentView .txt{ padding-left: 180px;}

.TalentView .txt .info{ margin: .6rem 0 .8rem;}
.TalentView .txt .tit{   width: 93%; transition: all .36s;  padding: .4rem ; text-align: center;  line-height: 2;  box-shadow: 0 0 .15rem rgba(0, 0, 0, 0.1); border-radius: 8px; position: relative; font-size: 16px;}
.TalentView .txt .tit:hover{  background: #c5261d; color: #fff; transform: translateY(-.2rem);}
.TalentView .txt .tit::after{display:block ; content: ''; width: .24rem; height: .23rem; background: url(/static/home/images/goodLife1-icon.png) no-repeat center center; background-size: cover;
  position: absolute; left: .1rem; top: .2rem; }
.TalentView .txt .tit::before{display:block ; content: ''; width: .24rem; height: .23rem; background: url(/static/home/images/goodLife1-icon.png) no-repeat center center; background-size: cover;
    position: absolute; right: .1rem; bottom: .2rem; transform: rotate(180deg);}

.staff{ padding: .6rem 0;}
.staff .swiper-container{ padding-left: 180px; margin-top: .6rem;}

.tansuo{ display: flex; flex-direction: column; background:  url(/static/home/images/tansuo.jpg) no-repeat center bottom #c7102c; padding: 1rem 0;}
.tansuo .tansuoTitle{ display: flex; flex-direction: column; text-align: center; color: #FFF; font-size: 40px; padding-bottom: 0.6rem;}
.tansuo .main{ display: flex; flex-direction: row;justify-content: space-between;}
.tansuo .main .tansuoDiv{ width: 48%; padding: 0.5rem;}
.tansuo .main .tansuoDiv.tansuo_Img1{ background: url(/static/home/images/img-5-1.png) no-repeat right center #FFF; background-size: cover;}
.tansuo .main .tansuoDiv.tansuo_Img2{ background: url(/static/home/images/img-5-2.png) no-repeat right center #FFF; background-size: cover;}
.tansuo .main .tansuoDiv h2{ font-size: 26px;}
.tansuo .main .tansuoDiv h3{ text-transform: uppercase; color: #aaa; margin-top: 10px;}
.tansuo .main .tansuoDiv span{ display: flex; flex-direction: column; margin-top: 0.5rem;}
.tansuo .main .tansuoDiv span a{ color: #c5261d; font-size: 16px;}




.job{  padding: .8rem 0; }
.job .main{ background: url(/static/home/images/jobBg.jpg) no-repeat right center;     background-attachment: fixed; position: relative;  }
.jobsearch{ margin: .5rem 0;}
.jobsearch .box .txt{ width: 83%;   height: 55px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); padding-left: .3rem; border-radius: 30px 0 0 30px;}
.jobsearch .box .btn{ width:17% ; border-radius: 0 30px 30px 0; font-size: 20px;}

.joblist .item{ padding: .35rem; background: #fafafa; width: 30%; margin-right: 5%; display: block; margin-top: .55rem; float: left; overflow: hidden;}
.joblist .item:nth-child(3n){ margin-right: 0;}
.joblist .item .info{ margin: .25rem 0;}
.joblist .item div{ position: relative; z-index: 5;}
.joblist .item::after{display: block; content: ''; width:0; height: 100%; position: absolute; bottom: 0; left: 0; z-index: 1;  background-image: linear-gradient(30deg,#c5261d,#f8644c);
 transition: all .38s;  }
.joblist .item:hover::after{ width: 100%;}
.joblist .item:hover{ color: #fff; box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.3); transform: translateY(-.12rem);}
.joblist .item:hover .info{ color: #fff;}


.joblist .item .icon2{ display: none;}
.joblist .item:hover .icon1{ display: none;}
.joblist .item:hover .icon2{ display: block; }

.Pop{ width:100vw; height: 100vh; position:  fixed;  z-index: 101; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); display: none;}
.jobInfo{ width: 45vw; background: #fff;}
.jobInfo .tit{ padding: .40rem; background: url(/static/home/images/jobInfotit.jpg) no-repeat center bottom; background-size: cover;}
.conadd{ margin-left: .5rem;}
.jobInfo .con{ padding: .4rem;}
.jobclose{ position: absolute; top: .45rem; right: .45rem; cursor: pointer; opacity: 0.5;}
.jobclose:hover{ opacity: 1;transform: rotate(180deg);}
.jobInfo .con .scorll .title{ font-size:20px; margin-bottom: .2rem;}
.jobInfo .con .scorll{ max-height: 40vh; overflow-y: scroll;   margin-bottom: .5rem; padding-right: .45rem;}
.jobInfo .con .scorll::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 5px;}
.jobInfo .con .scorll::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #c5261d; width: 5px; }
.jobInfo .con .scorll::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #f2f5f9; width: 5px; }

.contactOne{  background: url(/static/home/images/contact-ban.jpg) no-repeat center center; background-size: cover; padding: .8rem 0;}
.contactOne .English{  }
.contactOne  li{ border-bottom: 1px solid rgba(255, 255, 255, 0.2); padding: .35rem 0;}

.gbook{ width: 82%; box-shadow: 0 0 .4rem rgba(0, 0, 0, 0.2); margin: -.8rem auto 0 auto; border-radius: .2rem;  padding: .5rem 1rem; }
.gbook .desc{ font-size: 20px;}
.gbook .two ,.gbook .there { margin-top: .5rem;}
.gbook .two .items{ width:47%;}
.gbook .two .items .txt{}
.gbook .two .items input{ border-bottom: 1px solid #e5e5e5 ; width: 100%; font-size: 18px; padding:0 0 .16rem 0; margin-top: .22rem;}
.gbook  .items textarea{border-bottom: 1px solid #e5e5e5 ;  width: 100%; margin-top: .22rem;font-size: 18px; line-height: 2;}
.gbook .btnby { margin: .4rem auto 0;width: 2rem; height: .6rem; text-align: center; line-height: .6rem; border-radius: .3rem; display: block;}
 
.contactMap{ height: 5rem; width: 100%; margin: .5rem 0; }
 
.serchtop{ padding: .4rem; z-index: 5;  margin-top: -.9rem;}
.serchtop .two{ margin-top: .2rem;}
.serchtop .input{ height: 50px; width: calc(100% - 360px ); padding-left: .3rem;}
.serchtop .btn{ height: 50px; width: 160px;}

.searchbot .tit{ margin: .4rem 0;}
.searchbot ul{ box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.1); margin-bottom: .5rem;}
.searchbot ul a{ padding: .3rem; border-bottom: 1px solid #e5e5e5;}
.searchbot ul a span{ width: 80%;}
.searchbot ul a:hover span{ color: #c5261d;}