.martop-60{margin-top: -.6rem;}

.ind-title span{ font-size: .24rem;font-weight: 400;color: #0a408a;line-height: .33rem;}

.ind-title h5{ font-size: .45rem;font-weight: 600;color: #222222;line-height: .6rem;}

.ind-title p{ font-size: .18rem;font-weight: 400;color: #666666;line-height: .30rem;}

.martop20{margin-top: .1rem;}

.martop31{margin-top: .31rem;}

.martop8{margin-top: .08rem;}

.weui-flex-warp{display: flex; }

.common-more{display: flex; align-items: center; justify-content: space-between; width: 2.4rem; height: 60px; line-height: 60px; background: #0a408a; box-sizing: border-box; padding: 0 .3rem;border-radius: 4px;color: #FFFFFF;font-size: .18rem; transition: all .3s; position: relative;}

.common-more:hover{color: #ffffff; transform: translateY(-5px);}

.more-box{ position: absolute;width: .23rem; height: .23rem; border: 1px solid #fff; border-radius: 50%; display: inline-block; opacity: 1; right: .1rem;}

.more-box::before{position: absolute; content: '';  left: 50%;top:50% ; width: .05rem; height: .05rem; background: #fff; border-radius: 50%; margin-top: -.025rem; margin-left: -.025rem; z-index: 99;}

.more-box::after{position: absolute; content: ''; top: 50%; width: .52rem; height: 1px; background:  #fff; left: -.405rem; margin-top: -0.05px;}
.common-more i {
  position: absolute;
  right: -5px;
  bottom: -20px;
  width: 40px;
  height: 40px;
  background: rgba(255, 255, 255, 1);
  z-index: 11;
  display: block;
  border-radius: 50%;
  transform: scale(1);
  opacity: 0;
}
.common-more i:nth-child(2) {
  transform: scale(2);
}
.common-more i:nth-child(3) {
  transform: scale(3);
}

.common-more:hover{
    text-align: center;
    color: #fff;
    clip-path: polygon(0% 0, 100% 0, 100% 100%, 0% 100%);
}

.common-more:hover i:nth-child(4){
  -webkit-animation: sxxs1 1s .3s linear infinite;
  -moz-animation: sxxs1 1s .3s linear infinite;
}
.common-more:hover i:nth-child(5){
  -webkit-animation: sxxs1 1s .6s linear infinite;
  -moz-animation: sxxs1 1s .6s linear infinite;
}
.common-more:hover i:nth-child(6){
  -webkit-animation: sxxs1 1s 1s linear infinite;
  -moz-animation: sxxs1 1s 1s linear infinite;
}
@keyframes sxxs1{
  0% {
    -webkit-transform: scale(0);
    opacity: .3;
  }
100% {
  -webkit-transform: scale(10);
  opacity: 0;
  }
}

html{font-size: 100px;}
@media (max-width: 1600px){html{font-size: 95px;}}
@media (max-width: 1440px){html{font-size: 90px;}}
@media (max-width: 1220px){html{font-size: 85px;}}
@media (max-width: 1024px){html{font-size: 80px;}}
@media (max-width: 991px){html{font-size: 70px;}}
@media (max-width: 639px){html{font-size: 60px;}}

.pjoin-title h4{font-size: .4rem;font-weight: 600;color: #222222;line-height: .56rem;}

.pjoin-title p{font-size: .26rem;font-weight: 300;color: #999999;line-height: .37rem; margin-top: 4px;text-transform:uppercase}


.section2-more .more-box,.section3-more .more-box,.news-more .more-box{right: .3rem;}
.news-list-more .more-box{right: 0;}
/*  */
.container{width: auto; margin: 0 15px; padding: 0;}
.container2{width: auto; margin: 0 15px; padding: 0;}
.container-fluid{padding: 0;}
@media (min-width: 640px){.container{margin: 0 7.5%;}}
@media (min-width: 1200px){.container{margin: 0 6%;}}
@media (min-width: 1600px){.container{margin: 0 9.896%;}}


@media (min-width: 1200px){.container2{margin: 0 6.75%;}}

/* 内页banner图 */

.banner-p0{ padding: 0 !important;}

.banner-box{position: relative; height:7rem; background-position: center  top; background-size: cover; background-repeat: no-repeat;margin-top: .8rem; -webkit-animation-name: bigtosmall;animation-name: bigtosmall;transform-origin: 50% 50%;-webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;}

.other-banner-txt{position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; color: #ffffff; }

.other-banner-txt div{/*max-width: 37%; */text-align: center; max-width: 85%;}

.other-banner-txt div h3{font-size: 0.48rem;font-weight: 600;line-height: 0.47rem;  margin-bottom: .26rem;}

.other-banner-txt div  p{font-size: .24rem;font-weight: 400;line-height: .4rem;}

/* 内页二级标题 */

.nav-title{text-align: center;white-space: nowrap;overflow-y: hidden;overflow-x: auto;height: 0.8rem;height: .8rem; line-height: .8rem;  font-size: 0px;transform: translateY(-30px);font-size: 0px;padding-bottom: 1.5rem;}

.item-a {

  color: #212121;

  display: inline-block; 

  box-shadow: 0px 14px 60px 0px rgba(126, 134, 148, 0.32);

  height: 0.8rem; 

  background-color: #FFFFFF;

  line-height:0.8rem;

  text-align: center;

  position: relative;

  overflow: hidden;

  /* padding: 0 .6rem; */

  margin-right: .2rem;



}

.wid300{width: 3rem;}

.wid240{width: 2.4rem;}



.item-a .icon {



display: inline-block;

vertical-align: middle;

width: .3rem;

height: .3rem;

position: relative;

margin-right: .1rem;

z-index: 2;



}



.item-a span {



font-size: 0.2rem;



color: #212121;



display: inline-block;



vertical-align: middle;



position: relative;



z-index: 2;



transition: all .3s ease;



}



.item-a.on,.item-a:hover{ background: linear-gradient(270deg, #2192EA 0%, #0a408a 100%);}





.item-a .icon img {

  position: absolute;

  left: 0;

  top: 0;

  transition: all .3s ease;

}

.nav-title a img {

  display: inline-block;

  width: 0.3rem;

}

.item-a .icon img:nth-child(2){opacity: 0;}

.item-a.on span ,.item-a:hover span{

	color: #fff;

}



.item-a::before{



	content: "";



	position: absolute;



	left: 0;



	top: 0;



	bottom: 0;



	width: 0;

  background-image: url(../images/sub-nav-bg.png);

	transition: all .3s ease;



}

.item-a:hover::before,.item-a.on::before{

  width:100%;

  

}

.item-a.on .icon img:nth-child(1), .item-a:hover .icon img:nth-child(1){opacity: 0;}

.item-a.on .icon img:nth-child(2), .item-a:hover .icon img:nth-child(2){opacity: 1;}

/* 新闻列表 */

.bg-f7f7f7{background: #F7F7F7;}

.news-sec4-lists{margin-top: -0.45rem;}

.new-section2-content{margin-top: 0.26rem;justify-content: space-between; }

.new-section2-content .new-section2-item{width: 32%;  padding: .4rem;background: #FFFFFF;box-shadow: 0px 8px 16px 0px rgba(141, 154, 174, 0.2); transition: all .5s ease; cursor: pointer; margin-bottom: 0.42rem;}

.new-section2-item-title span{font-size: 14px;color: #484848;line-height: 20px; }

.new-section2-item-title p{font-size: 20px;font-weight: 600;color: #222222;line-height: 30px; height: 60px; margin-top: 0.15rem; margin-bottom: 0.2rem; transition: all .5s ease;}

.new-section2-item-img{height: 2.44rem; margin-bottom: 0.2rem;}

.new-section2-item-img img{object-fit: cover; width: 100%; height: 100%;}

.new-section2-item-txt p{font-size: 14px;font-weight: 400;color: #888888;line-height: 24px;text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.05);transition: all .5s ease;}

.new-section2-item-txt-link{display: flex; align-items: center; margin: 0.32rem 0;}

.new-section2-item-txt-link a{display: inline-block; width: 1.4rem;height: 40px; line-height: 40px; text-align: center; margin-right: 0.24rem;background: #EDF1F8;color: #8D8D8E;font-size: 12px;transition: all .3s ease;}

.new-section2-item:last-child:nth-child(3n + 2){ margin-right: calc((100% - 32%) / 2);}

.new-section2-item .news-list-more{background: transparent;color: #484848; padding: 0; border-top: 2px solid #d8d8d8; width: 100%; border-radius: 0;font-size: 14px;line-height: 20px;}

.new-section2-item .news-list-more .more-box{  border: 1px solid #484848; }

.new-section2-item .news-list-more .more-box::before{ background: #484848; }

.new-section2-item .news-list-more .more-box::after{background:  #484848; }



.new-section2-item:hover{background: #0a408a;}

.new-section2-item:hover .new-section2-item-title span,.new-section2-item:hover .new-section2-item-title p,.new-section2-item:hover .new-section2-item-txt p,.new-section2-item:hover .new-section2-item-txt-link a,.new-section2-item:hover .news-list-more{color: #fff;}

.new-section2-item:hover .new-section2-item-txt-link a{background: #6097EF;}

.new-section2-item:hover .news-list-more .more-box{  border: 1px solid #fff; }

.new-section2-item:hover .news-list-more .more-box::before{ background: #fff; }

.new-section2-item:hover .news-list-more .more-box::after{background:  #fff; }



.news-sec5-item{ padding: 0.4rem .8rem .4rem .6rem; background: #fff;box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.05);box-sizing:border-box; transform: translateY(0); margin-bottom: 32px; transition: all .5s; cursor: pointer;}

.news-sec5-item .news-time{font-size: 14px;font-weight: 500;color: #0a408a;line-height: .28rem;  width: 130px; padding-top: .1rem;}

.news-sec5-right{box-sizing:border-box;align-items: center; justify-content: space-between; flex: 1;}

.news-contents { width: 83%; max-width: 55vw;}

.news-sec5-right h6{font-size: .2rem;font-weight: 600;color: #222;line-height: .3rem;}

.news-sec5-right p{font-size: 14px;font-weight: 400;color: #484848;line-height: 24px; margin-top: .2rem;}

.news-sec5-right-a{width: 160px; }

.news-sec5-right-a .common-more{width: 100%; padding: 0 .1rem; background: transparent;color: #484848;font-size: 14px;}





.news-sec5-right-a  .more-box{  border: 1px solid #484848; }

.news-sec5-right-a  .more-box::before{ background: #484848; }

.news-sec5-right-a  .more-box::after{background:  #484848; }



.marb-40{margin-bottom: 40px;}

.news-sec5-item:hover{transform: translateY(-10px);}

.news-pages{text-align: center;}

.pages-mtop{margin-top: .6rem; margin-bottom: 1rem;}

.news-pages .pagination>.active>a,.news-pages .pagination>.active>a:focus,.news-pages .pagination>.active>a:hover,.news-pages .pagination>.active>span,.news-pages .pagination>.active>span:focus,.news-pages .pagination>.active>span:hover,.news-pages  .pagination>li>a:hover{background: transparent; color: #0a408a;border: 1px solid #0a408a;}

.news-pages  .pagination>li>a,.news-pages  .pagination>li>span{color: #333333; background-color: transparent; border: 0; height: .5rem; width: .5rem; border-radius: 50%; line-height: .5rem; text-align: center; padding: 0; margin-right: .25rem;}

/* 新闻详情 */

.news-detail{background: #F7F7F7;}

.news-details{background: #FFFFFF;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); margin-top: .6rem; padding: .7rem 3.2rem .3rem; margin-bottom: 1rem;}



.news-details-content-top h3{font-size: .28rem;font-weight: 600;color: #212121;line-height: .4rem; margin-bottom: .4rem;}

.news-details-content-top p span{font-size: 14px;color: #888888; }

.news-border-bottom{padding-bottom: .3rem; border-bottom: 1px solid #e5e5e5;}

.news-detail-contents{margin-top: .4rem; font-size: 16px;font-weight: 400;color: #333333;line-height: 28px; padding-bottom: .6rem;  border-bottom: 1px solid #e5e5e5;}

.news-detail-contents *{font-size: inherit; color: inherit;}

.news-detail-contents img{margin: .3rem auto;  max-width: 100%;}

.news-detail-contents h5{font-weight: bold; margin-bottom: .2rem;}

.news-detail-contents p{ margin-bottom: .2rem;}

.news-details-content-bottom{ padding: .42rem 0 .12rem;}

.news-details-content-bottom a{display: flex;align-items: center; margin-bottom: .3rem;}

.news-details-content-bottom span{display: inline-block;background: #F6F6F6; width: 1.18rem; height: 40px; line-height: 40px; text-align: center; margin-right: .2rem;color: #333333;font-size: 14px;}
.news-details-content-bottom p{flex: 1;}
.news-details-content-bottom a:hover{color: #0a408a;}



/* 解决方案 */

.p-solution{margin-top: .7rem; justify-content: space-between; flex-wrap: wrap;  }

.p-solution .psolution-item{width: 46%; margin-bottom: 1.2rem; position: relative;overflow: hidden; cursor: pointer;}

.p-solution .psolution-item img{object-fit: cover; width: 100%; height: 100%; transform: scale(1); transition: all .5s;}

.p-solution .psolution-item .psolution-txt{position: absolute; left: .6rem; bottom: .6rem; right: .6rem;}

.p-solution .psolution-item .psolution-txt h3{font-size: .34rem;font-weight: 600;color: #FFFFFF;line-height: .48rem; margin-bottom: .3rem;}

.p-solution .psolution-item:hover img{transform: scale(1.1);}

/* 核心服务 */

/* .pservice{ margin-top: .5rem;} */

.pservice .pservice-h3{font-size: .48rem;font-weight: 600;color: #222222;line-height: .67rem;}

.pservice .pservice-p{font-size: 18px;color: #333333;line-height: 32px; margin-top: .2rem;margin-bottom: .8rem;}

.pservice .pservice-item{background: #FFFFFF;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); align-items: center; margin-bottom: .6rem; cursor: pointer; }

.pservice .pservice-item .pservice-item-left{flex: 1; padding: .6rem .8rem .6rem .6rem;}

.psitem-en{font-size: 16px;color: #888888;line-height: 22px;}

.psitem-h3{font-size: .36rem;color: #333333;line-height: .5rem;font-weight: 600; margin-top: .1rem; margin-bottom: .4rem;transition: all .5s; }

.psitem-p{font-size: 16px;color: #333333;line-height: 26px; margin-bottom: .6rem;}

.pservice .pservice-item .pservice-item-right{height: 4.8rem; width:39vw ; overflow: hidden; }

.pservice .pservice-item .pservice-item-right img{height: 100%; width: 100%; object-fit: cover;transform: scale(1); transition: all .5s;}

.pservice .pservice-item:hover .pservice-item-right img{transform: scale(1.1);}

.pservice .pservice-item:hover .psitem-h3{color: #0a408a;}

.pservice-more{ background: transparent;color: #484848;width: 2.1rem;}

.pservice-more .more-box{border: 1px solid #484848; }

.pservice-more .more-box::before,.pservice-more .more-box::after{background:#484848 ;}



.pservice .pservice-item:hover  .pservice-more{background: #0a408a; color: #fff; width: 2.4rem;}

.pservice .pservice-item:hover  .pservice-more .more-box{border: 1px solid #ffffff;}

.pservice .pservice-item:hover  .pservice-more .more-box::before,.pservice .pservice-item:hover  .pservice-more .more-box::after{background:#ffffff ;}



/* 加盟合作 */

.pjoinus{padding-bottom: 1.26rem; padding-top: .87rem;}

.j1-content {justify-content: space-between; margin-top: .8rem;}

.j1-content .j1-item{width: 29%;background: #F7FAFF;  padding: .6rem .4rem 0; transition: all .3s; transform: translateY(0);}

.j1-content .j1-item span{top: 0; right: 0; width: .6rem; height: .6rem; color: #ffffff;background: #0a408a; display: inline-block;font-size: 20px;font-weight: 600;line-height: .6rem; text-align: center;font-family: "DIN-Medium";}

.j1-content .j1-item h6{color: #0a408a;font-size: 20px;line-height: 28px;font-weight: 600; margin-bottom: .17rem;}

.j1-content .j1-item p{color: #484848;font-size: 14px;line-height: 23px;font-weight: 400; margin-bottom: .3rem;max-width: 76%; min-height: 96px;}

.j1-content .j1-item img{ height: 3rem; margin: auto;}

.j1-content .j1-item:hover{transform: translateY(-10px);}

.j2-content{padding-top: .8rem; padding-bottom: 1.2rem; background: url(../images/joinus/STRENGTH.png) no-repeat; background-position: center 35%; background-size: 100% auto; }

.j2c-p{font-size: 18px !important;font-weight: 400;color: #333333 !important;line-height: 32px ; margin-top: .3rem !important; max-width: 74%; margin: auto; }

.j2-inner-box{width: 100%; background: #ffffff; margin-top: .49rem;}

.j2-inner-box .j2-inner-item{width: 33.333%;  box-sizing: border-box;  padding: .6rem; text-align: center; position: relative;}

.j2-inner-box .j2-inner-item:not(:last-child)::after{position: absolute; content: ''; width: 1px; height: 60%; top: 20%; right: 0; background: #DDDDDD;}

.j2-inner-box .j2-inner-item img{width: .6rem; margin: auto; margin-bottom: .32rem; transform: translateY(0); transition: all .3s;}

.j2-inner-box .j2-inner-item  p{max-width: 80%;  margin: auto;}

.j2-inner-box .j2-inner-item .j2-p1{font-size: 18px;color: #333333;line-height: 25px; font-weight: 600;}

.j2-inner-box .j2-inner-item .j2-p2{font-size: 16px;color: #333333;line-height: 25px; font-weight: 400; margin-top: 8px;}

.j2-inner-box .j2-inner-item:hover img{ transform: translateY(-10px);}

.j3-content{background: url(../images//joinus/j3-bg.jpg) no-repeat; background-size: 100% 100%;  padding-top: 1.8rem; padding-bottom: .8rem;}

.j3-content .pjoin-title{margin-left: 1.9rem;}

.j3-content .j3-right{background: #ffffff; overflow: hidden;  margin:  1.93rem .8rem .8rem; }



/* .j3-content .j3-right{ padding: .9rem 1.9rem .3rem; box-sizing: border-box; } */

.j3-right-list ul{ padding: .4rem 1.1rem ; list-style: none;  display: flex;  flex-wrap: wrap;}

.j3-right-list ul li{ width: 25%;   margin-bottom: .2rem;}

.j3-right-list ul li >div{display: flex; align-items: baseline; transform: translateY(0); transition: all .5s;}

.j3-right-list ul li >div span{font-family: "jaapokkienchanceregular";font-size: .72rem;color: rgba(255, 255, 255, 0);line-height: 1.1rem;-webkit-text-stroke: 1px #AAAAAA;text-stroke: 1px #aaaaaa; margin-right: .2rem;}

.j3-right-list ul li  .j3-list-p{font-weight: 400;font-size: 14px;line-height: 24px; margin-top: .15rem;color: #666666; max-width: 70%;}

.j3-right-list ul li >div p{font-weight: 600;font-size: 20px;line-height: 28px;margin-top: .2rem;color: #0a408a; }

.j3-right-list ul li:hover >div{transform: translateY(-10px);}

.j4-content{padding-top: 1rem;}

.j4-title-p2{font-size: 20px !important;color: #333333 !important;line-height: 31px !important; margin-top: .26rem !important;}

.j4-list-box{justify-content: space-between; flex-wrap: wrap; margin-top: .5rem; margin-bottom: .4rem;}

.j4-list-box .j4-item{width: 23%; background: #F7F7F7; margin-bottom: .6rem; padding: .3rem .42rem; transform: translateY(0); transition: all .5s;}

.j4-item-num{top: 0.24rem; right: .2rem;font-size: .4rem;font-weight: 500;color: #D7D7D7;line-height: .48rem;font-family: "DIN-Medium";z-index: 2;}

.j4-list-box .j4-item img{width: .4rem; margin-bottom: .16rem;}

.j4-list-box .j4-item .j4-p1{font-size: 18px;font-weight: 600;color: #333333;line-height: 25px;}

.j4-list-box .j4-item .j4-p2{font-size: 14px;font-weight: 400;color: #888888;line-height: 20px; margin-top: 8px;}

.j4-list-box .j4-item:hover{transform: translateY(-10px);}

.j5-content{background: url(../images/joinus/j4-bg.jpg) no-repeat; background-size: 100% 102%; padding-top: 1rem; padding-bottom: .9rem;}

.j5-list{display: inline-block; margin-top: 1.5rem;margin-bottom: 1.2rem;}

.j5-list-item{ text-align: center; }

.j5-list-item .j5-p1{font-size: 20px;color: #FFFFFF;line-height: 28px;}

.j5-list-item .j5-p2{font-size: .32rem;color: #FFFFFF;line-height: .39rem;font-weight: 500;font-family: "DIN-Medium"; margin-top: .09rem; margin-bottom: .19rem;}

.j5-list-item div{ width: .8rem; height: .8rem; background: #fff; border-radius: 50%; overflow: hidden; margin: auto; transform: rotate(0); transition: all .6s; }

.j5-list-item div:hover{transform: rotate(180deg);}

.j5-list-item div img{ width: .36rem;  margin:.22rem auto;}

.pos1{left: 5%; top: 20%;}

.pos2{left: 19%; top: 80%;}

.pos3{left: 33%; top: 7%;}

.pos4{left: 48%; top: 59%;}

.pos5{left: 62%; top: -38%;}

.pos6{left: 76%; top: 26%;}

.pos7{left: 89%; top: -40%;}

.j6-content{padding-top: .8rem; padding-bottom: 1.2rem;}

.j6-list{margin-top: .5rem;}

.j6-list .j6-list-item{width: 33.333%; background: #F1F6FF; padding: .73rem .42rem .5rem;  text-align: center;}

.j6-list .j6-list-item:nth-child(2){background: #0a408a; }

.j6-list .j6-list-item img{width: .66rem; margin: auto; transform: translateY(0); transition: all .5s;}

.j6-list .j6-list-item .j5-p1{font-size: 20px;font-weight: 400;color: #484848;line-height: 28px; margin-top: .22rem;}

.j6-list .j6-list-item .j5-p2{font-size: .26rem;font-weight: 500;color: #222222;line-height: 37px; margin-top:.15rem;}

.j6-list .j6-list-item:nth-child(2) .j5-p1,.j6-list .j6-list-item:nth-child(2) .j5-p2{color: #ffffff;}

.j6-list .j6-list-item:nth-child(2) .j5-p2{font-family: "DIN-Medium";}

.j6-list .j6-list-item:hover img{transform: translateY(-10px);}



 /* 中卡招聘 */

 .precruitment{ padding-top: .5rem; padding-bottom: .51rem; margin-top: -.6rem;}

 .precruitment .precruitment-p1{font-size: 18px !important;color: #333333 !important;line-height: 32px !important; text-align: center; max-width: 60%; margin:.4rem auto; margin-top: .4rem !important; }



 .precruitment-list .precruitment-list-item{width: 20%;  text-align: center; position: relative;padding: .06rem .32rem .23rem .32rem;}

 .precruitment-list .precruitment-list-item:not(:last-child)::after{position: absolute; content: ''; width: 1px; height: 70%; top: 15%; right: 0; z-index: 2; background: #EDEDED;}

 .precruitment-list .precruitment-list-item span{font-size: .68rem;font-weight: 500;color: #EDEDED;line-height: .82rem;font-family: "DIN-Medium"; display: block; transform: translateY(0); transition: all .5s; }

 .precruitment-list .precruitment-list-item .precruitment-title{font-size: 20px;font-weight: 600;color: #222222;line-height: 28px; margin-bottom: .14rem;margin-top: .11rem;}

 .precruitment-list .precruitment-list-item .precruitment-txt{font-size: 14px;font-weight: 500;color: #686868;line-height: 22px; }

 .precruitment-list .precruitment-list-item:hover span{ transform: translateY(-10px); }

 @-moz-document url-prefix() {

  fieldset { display: table-cell; }

}

.talentsWanted{background: #FFFFFF;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); margin-top: .6rem; padding: .8rem;}



.talentsWanted-h2-mb{margin-bottom: 0.45rem;}



.jobs-list{ background-color: #ffffff;  margin-top: .8rem;}



.talentsWanted-box .table>thead>tr>th{  font-size: .18rem;color: #212121;}



.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{height: 0.64rem; line-height: 0.64rem;border-bottom: 1px solid #E5E5E5;

}



.table>tbody>tr>td:nth-child(1), .table>thead>tr>th:nth-child(1){padding-left: 0.75rem;}



.table>tbody>tr>td, .table>tbody>tr>th{font-size: 0.16rem; cursor: pointer;color: #212121;}



.add{position: relative;  width: 0.16rem; display: block; height: 100%;}



.add::before{ content: '';



  position: absolute;



  right: 10px;



  top: 0.36rem;



  width: 0.16rem;

  left: 0;



  border-top: 0.02rem solid #E5E5E5;}



  .add::after{

  content: '';



  position: absolute;



  right: 0.17rem;

  left: 0.07rem;

  top: 0.3rem;



  height: 0.16rem;



  border-right: 0.02rem solid #E5E5E5;



  transition: all .3s;



  }



.jobs-content{margin-top: 0.45rem; margin-left: 0.4rem; line-height: 0.45rem; margin-bottom: 0.86rem; margin-right: 1.1rem;}

.jobs-content h5{font-size: 16px;font-weight: 600;color: #212121;line-height: 22px; margin-bottom: 0.08rem;}

.jobs-content p{font-size: 0.18rem;font-weight: 400;color: #6B6F78;line-height: 32px; }



.jobs-content * {font-size: inherit; line-height: inherit;}



.tab-contents{display: none;transition: all .3s ease-in-out; }



tr.on+.tab-contents{display: table-row;}



tr.on .add::after{border-right: 0;}



.talentsWanted-table tbody tr.on td,.talentsWanted-table tbody tr:hover td{background: #F0F0F0; }

.talentsWanted-table tbody tr.tab-contents:hover td{ background: transparent;}

.talentsWanted-2{  background: url(../images/contact/img.jpg) no-repeat;  background-position: left top; background-size: cover; padding: 0.94rem 0.7rem;  margin-top: .8rem; margin-bottom: 1.3rem;}

.talentsWanted-2 .pjoin-title{margin-bottom: .39rem;}

.talentsWanted-2 p{font-size: 0.18rem;font-weight: 400;line-height: 0.32rem;color: #ffffff;  max-width: 60%;}

/* 中卡客服 */

.kefu-info{background: #FFFFFF;  margin-bottom: 1.2rem; min-height: 1rem;}

.kefu-info .kefu-left{padding: .6rem .7rem;width: 40%;}

.kefu-info .kefu-left .kefu-title h4{font-size: .28rem;font-weight: 600;color: #0a408a;line-height: .4rem;}

.kefu-info .kefu-left .kefu-title p{font-size: 14px;font-weight: 400;color: #888888;line-height: 20px; margin-top: 4px;}



.kf-line{display: inline-block; width: 12px; height: 1px ;background: #888888; margin-bottom: .4rem;margin-top: .4rem;}

.kefu-info .kefu-left .kefu-tp p,.kefu-info .kefu-left .kefu-tp a{font-size: 18px;line-height: 40px; display: block;}

.kefu-info .kefu-left .kefu-tp p span,.kefu-info .kefu-left .kefu-tp a span{color: #888888;}

.kefu-info .kefu-mid{padding: .6rem .2rem;width: 26%; }

.kefu-info .kefu-mid >p{font-size: 18px;color: #212121;line-height: 25px;}

.kefu-info .kefu-mid div{display: flex; align-items: center;}

.kefu-info .kefu-mid div img{width: 1.5rem; margin-right: .018rem;}

.kefu-info .kefu-mid div p{font-size: 16px;color: #484848;line-height: 22px;}

.kefu-info .kefu-right{padding: .6rem .7rem;width: 34%; background: #0a408a; color: #fff;}

.kefu-info .kefu-right .kf-p1{font-size: 18px;line-height: 25px; margin-bottom: .12rem;}

.kefu-info .kefu-right .kf-p2{font-size: .28rem;line-height: .34rem; font-family: "DIN-bold"; font-weight: bold; margin-top: .1rem; color: #fff; display: block;}

.kefu-info .kefu-right .kf-p2 span{font-weight: 400;font-size: 20px;}

.kefu-info .kefu-right .kf-line{ background: #fff;}

.kf-message{margin-top: 1.4rem; margin-bottom: 1.4rem; }

.kf-message-left{width: 50%;  padding-right: 1.1rem;}

.kfmart60{margin-top: .6rem;}

.kf-message-txt{margin-top: .42rem;}

.kf-message-txt >p{font-size: 18px;color: #888888;line-height: 25px; margin-bottom: .51rem;}

.kf-message-txt div{display: flex; flex-wrap: wrap;}

.kf-message-txt div p{width: 50%; border-top: 1px solid #E6E6E7; border-bottom: 1px solid #E6E6E7; padding-top: .3rem; padding-bottom: .3rem;}

.kf-message-txt div p samp,.kf-message-txt div p span{display: block;}

.kf-message-txt div p samp{font-size: 14px;color: #8C9199;line-height: 20px; margin-bottom: 3px;}

.kf-message-txt div p span{font-size: 18px;color: #212121;line-height: 25px;font-weight: 600;}

.kf-message-right{  width: 50%;}



.message-form{margin-top: 0.75rem;}



.message-form  .form-group{ width: 49%; margin-bottom: 0.15rem; position: relative; }





.message-form  .form-group:nth-child(odd){margin-right: 1%;}



.message-form  .form-control{background-color: #F5F6F7; width: 100%; height: 0.6rem;line-height: 0.5rem; border-radius: 0.04rem; border: 0; padding-left: 0.31rem;box-shadow:none}



.form-texttarea{width: 100%  !important; }



.form-texttarea  .form-control{height: 1.98rem ; border: 0;border-radius: 0.04rem;}



.message-form input::-webkit-input-placeholder,.message-form textarea::-webkit-input-placeholder{



	color: #888888 !important;



 }



 .message-form input::-moz-placeholder,.message-form textarea::-webkit-input-placeholder{   /* Mozilla Firefox 19+ */



  color: #888888 !important;



 }



 .message-form input:-moz-placeholder,.message-form textarea::-webkit-input-placeholder{    /* Mozilla Firefox 4 to 18 */



	color: #888888 !important;



 }



 .message-form input:-ms-input-placeholder,.message-form textarea::-webkit-input-placeholders{  /* Internet Explorer 10-11 */ 



  color: #888888 !important;



 }



 .submit-btn{width: 1.6rem;height: 0.6rem;background: #0a408a;color: #ffffff; font-size: 0.16rem;border-radius: 0.04rem;}

 .formw100{width: 100% !important;}

 /* 经典案例 */

 .pcase-region {text-align: center; margin-bottom: .78rem;}

 .pcase-region  span{display: inline-block; height: 44px; padding: 0 .28rem; margin-right: .15rem; background: #fff; transition: all .5s; line-height: 44px;font-size: 16px;color: #333333; cursor: pointer;}

 .pcase-region  span.on,.pcase-region  span:hover{background: linear-gradient(270deg, #2192EA 0%, #0a408a 100%);box-shadow: 0px 14px 60px 0px rgba(40, 77, 137, 0.24); color: #fff;}

 .pcase{ justify-content: space-between; flex-wrap: wrap;}

 .pcase .pcase-item{ width: 31.7%; margin-bottom: .44rem;background: #FFFFFF;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); cursor: pointer;}

 .pcase-item .pcase-img{width: 100%; height: 2.92rem; overflow: hidden ; }

.pcase-item .pcase-img img{object-fit: cover; width: 100%; height: 100%; transform: scale(1); transition: all .5s;}

.pcase-item .pcase-txt{padding: .28rem .3rem;}

.pcase-item .pcase-txt h3{text-align: center;font-size: .22rem;color: #222222;line-height: 30px;font-weight: 600; margin-bottom: .22rem; transition: all .5s;}

.pcase-item .pcase-txt p{font-size: 16px;color: #666666;line-height: 30px;font-weight: 400; }

.pcase .pcase-item:last-child:nth-child(3n + 2){ margin-right: calc((100% - 31.7%) / 2);}

.pcase-box .pages-mtop{margin-top: .2rem;}

.pcase .pcase-item:hover img{ transform: scale(1.1);}

.pcase .pcase-item:hover .pcase-txt h3{color:#0a408a ;}

.pcase-tabs .pcase-box {display: none;}

.pcase-tabs .pcase-box.on {display: block;}

/* 核心服务 详情页 */



.product-one{ z-index: 50;  margin-top: -30%;position: relative;}

.prodel-title{display: flex; justify-content: space-between;align-items: center; margin-bottom: .4rem;}

.prodel-title .prodel-title-left{flex: 1; color: #ffffff;}

.prodel-title .prodel-title-left a{color: #ffffff;font-size:16px;line-height: 22px;}

.back-btn{color: #0a408a;

  font-size:16px;

  padding:.13rem .31rem .13rem .58rem;

  background: #ffffff url(../images/icon-back.png);

  background-repeat: no-repeat;

  background-position: 0.34rem center;

  background-size: 14px;

  position: relative;

  transform: translateX(0);

  transition: all .5s;}

.back-btn:hover{transform: translateX(-10px);color: #0a408a;}

.case-del-section1{ background: #ffffff; padding: 1rem;  justify-content: center;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); }

.prodel-left{width: 47.2%; height: 4rem; overflow: hidden; }

.case-del-section1 .case-del-section1-left img { height: 100%; width: 100%; object-fit: cover;}

.case-del-section1 .case-del-section1-right{ flex: 1;  padding-left: 1rem;}

.case-del-section1-right h4{font-size: .48rem; font-weight: 600;color: #212121;line-height: .67rem; padding-bottom: .4rem; border-bottom: 1px solid #ccc; margin-bottom: .4rem;}

.case-del-section1-right p{font-size: 18px;font-weight: 400;color: #6F6F6F;line-height: 36px; }

.case-del-section1-right .common-more{margin-top: .4rem;}

.product-two{margin-top:0.6rem; background: #ffffff;box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); padding: 0.6rem 0.7rem; }

.case-sec-h4{font-size: .28rem;font-weight: 600;color: #0a408a;line-height: .4rem; padding-bottom: .15rem; border-bottom: 2px solid #D8D8D8; position: relative; margin-bottom: .4rem;}

.case-sec-h4::after{position: absolute; content: ''; width: 1.15rem; height: 2px; background: #0a408a; left: 0; bottom: -2px;}

.case-sec1,.case-sec2{ justify-content: space-between;}

.case-sec1 .case-sec1-item{width: 23%; transition: all .3s;border: 1px solid transparent;}

.case-sec1 .case-sec1-item:hover{ border: 1px solid #eeeeee; box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1);}

.case-sec1 .case-sec1-item:last-child:nth-child(4n + 2) {

  margin-right: calc((100% - 23%) / 3 * 2);

}

.case-sec1 .case-sec1-item:last-child:nth-child(4n + 3) {

  margin-right: calc((100% - 23%) / 3 * 1);

}

.case-sec1 .case-sec1-item p{text-align: center; margin: .27rem .15rem;font-size: 20px;font-weight: 600;color: #222222;line-height: 28px; transition: all .3s;}

.sd-marb80{margin-bottom: .8rem;}

.case-sec1 .case-sec1-item:hover p{color: #0a408a;}

.case-sec2 .case-sec2-item{width: 32%;background: #FFFFFF;border: 1px solid #E5E5E5; position: relative; padding: .46rem .4rem; }

.case-sec2 .case-sec2-item span{font-size: .8rem;font-weight: 600;color: #EEEFF2;line-height:.97rem; position: absolute; top: .18rem; right: .33rem;font-family: "DIN-Medium";transition: all .3s;}

.case-sec2 .case-sec2-item:hover span{color: #0a408a;}

.case-sec2 .case-sec2-item h3{font-size: .32rem;color: #212121;line-height: .45rem; margin-bottom: .46rem;}

.case-sec2 .case-sec2-item p{font-size: 18px;color: #32425C;line-height: 32px; }

.case-sec3 p{font-size: 18px;color: #333333;line-height: 30px;}

.case-sec3 img{max-width: 100%;}

.pservicede2{margin-top: 0.6rem;background: #FFFFFF; box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1); padding: .68rem .7rem; margin-bottom: .8rem;}

.pservicede-list{justify-content: space-between;}

.pservicede2 .pservicede-h4{font-size: .32rem;font-weight: 600;color: #222222;line-height: .45rem; margin-bottom: .28rem;}

.pservicede-list-item{ width: 31%; margin-bottom: .5rem; transform: translateY(0); transition: all .5s; }



.pservicede-list-item .pservicede-item-img{overflow: hidden ; width: 100%; height: 2.65rem; }

.pservicede-list-item .pservicede-item-img img{object-fit: cover; width: 100%; height: 100%; transform: scale(1); transition: all .5s;}

.pservicede-list-item:hover{transform: translateY(-10px);}

.pservicede-list-item:hover .pservicede-item-img img{transform: scale(1.1);}

.pservicede-item-txt {padding-top: .2rem;}

.pservicede-item-txt p{font-size: 14px;color: #333333;line-height: 20px;}

.pservicede-item-txt h3{font-size: .24rem;color: #222222;line-height: .42rem;font-weight: 600; margin-top: .1rem;}

@media screen and (max-width: 1500px) {  
  .header-nav ul li:nth-child(3) .sub-nav ,.header-nav ul li:nth-child(4) .sub-nav {width: 230%;}
}
@media screen and (max-width: 1400px) {

  .ind-title h5{font-size: .38rem;}
  #section3 .section3-list .section3-list-item{margin-top: .35rem;margin-bottom: .35rem;padding: .3rem .6rem;}
  #section4 .ind-news-right .news-content .news-content-item{padding: .35rem .6rem;}
  #section4 .ind-news-left .news-more{margin-top: .9rem;}
  #section4 .container-fluid{margin-top: 1.2rem;}
  #section3 .container-fluid{margin-top: .85rem;}
}
@media (max-width:1200px){
  .news-contents{max-width: 41vw;}
  .side_icon_2{padding-top: .22rem;}
  .side_icon_2_p2{
    margin-top: 0rem;}

}
@media (max-width: 780px){

  .item-a{box-shadow: 0 4px 5px rgb(0 0 0 / 10%);}

  .nav-title{padding-bottom: 1rem;}

  .martop-60{margin-top: -.9rem;}

  #section0{height: 100vh; overflow: hidden; }

  #section0 .swiper-container .swiper-slide img{height: 100%; width: 100%; object-fit: cover;}

  .other-banner-txt div p{font-size: 16px;}

  .weui-flex-warp{ flex-wrap: wrap;}

  .weui-flex-warp-item{ width: 100% !important;}

  .pad30-m{padding: 30px !important;}

  .pad30-15-m{padding: 30px  15px !important;}

  .more-box::after{width: .3rem; left: -.185rem; margin-top: 0;}

 

  .ind-title h5{font-size: .4rem;}

  .ind-title span,.pservicede-item-txt h3{font-size: 18px;}

  .ind-title p,.case-del-section1-right p,.case-sec2 .case-sec2-item p,.case-sec3 p{font-size: 16px; line-height: .45rem;}

  header{height: 60px;padding: 0 .3rem;box-shadow: 0 4px 5px rgb(0 0 0 / 10%);}

  .logo{width: 1.4rem; height: 40px;}



  .header-nav{position: fixed; top: 60px;left: 0;right: 0; bottom: 0; background: #fff;box-sizing: border-box; display: none;  height: auto;margin-left: 0;}

  .header-nav ul{flex-wrap: wrap;  width: 100%; height: unset;}

  .header-nav ul li{border-bottom: 1px solid rgba(226, 226, 226, 1);width: 100%;height: unset; flex-wrap: wrap;}

  .header-nav ul li >a{width: 100%;text-align: center; line-height: 60px;}

  .sub-nav{position: relative; top: 0; height: 0;}

  .sub-nav.on{height: 100%;}

  .sub-nav .nav-item a{justify-content: center;}

  .sub-nav .nav-item .more-box{display: none;}

  .banner-txt{left: 30px; right: 30px;}
  #section3 {background: url(../images/bg3.jpg) no-repeat; background-size:  100% 100%; background-position: left top;}

  #section3 .section3-list .section3-list-item{margin-top: .3rem; margin-bottom: 0;}

  #section3 .section3-list .section3-list-item:last-child{margin-bottom: .3rem;}

  .news-content .news-content-item .news-right-txt h5{font-size: 16px; line-height: .45rem;}



  footer .footer-list ul li >p,.pservice .pservice-p,.jounal-item p{font-size: 16px;}

  footer .footer-list ul li .footer-sub{ display: none;}

  footer .footer-list ul li .footer-sub{margin-right: 0;}

  footer .footer-list ul li >p{padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.3); position: relative;}

  footer .footer-list ul li >p::after{position: absolute; content: ''; top: 50%; right: 10px; width: 10px; height: 10px; border-top: 1px solid #fff; border-right: 1px solid #fff; transform: rotate(45deg); margin-top: -5px; transition: all .5s ;}

  footer .footer-list ul li >p.on::after{ transform: rotate(135deg);right: 10px;}

  footer .footer .footer-content-top .footer-left,.footer-right{padding-top: 30px;}

  footer .footer-logo{width: 1.6rem;}

  footer .copyright p,.prodel-title .prodel-title-left a{font-size: 12px;}

  #section2 .section2-item-right{min-height: 7.2rem;}

  #section4 .ind-news-left .news-tabs-title p span,.news-sec5-right h6{ font-size: 18px;}

  #section4 .ind-news-left .news-more,#section4 .ind-news-left .news-tabs-title{margin-top: 30px;}

  #section4 .ind-news-left .news-tabs-title p{display: inline-block;margin-right: 20px;}

  #section4 .ind-news-left .news-tabs-title{margin-bottom: 30px;}

  #fp-nav{display: none;}

 .common-more{margin-bottom: .5rem; height: 40px; line-height: 40px;}

 /* .common-more .more-box::after{margin-top: -1px;} */

 #section0 .swiper-button-next, #section0 .swiper-button-prev{top: 95vh;}

 .banner-info{top: 92vh;}

 .news-sec5-right-a{width: 160px; height: 40px; }

 .news-sec5-right-a .common-more{height: 40px; line-height: 40px; margin-bottom: 0; border: 1px solid #DDDDDD;}

 .news-sec5-right-a .common-more .more-box::after{margin-top: -1px;}

 .pservice .pservice-item .pservice-item-right{height: unset;}

 .j2c-p{font-size: 16px !important;max-width: 100%; line-height: .5rem !important;}

 .j1-content .j1-item{margin-bottom: 30px;}

 .j2-inner-box .j2-inner-item:not(:last-child){border-bottom: 1px solid #DDDDDD; }

 .j2-inner-box .j2-inner-item:not(:last-child)::after{background: none;}

 .j5-list-item div{ width: .5rem; height: .5rem; }

.j5-list-item div img{ width: .24rem;  margin:.13rem auto;}

.j5-list-item .j5-p1{font-size: 12px;}



.talentsWanted .table>tbody>tr>td:nth-child(1),.talentsWanted .table>thead>tr>th:nth-child(1){padding-left: 15px;}

.talentsWanted-2{  padding: 0.5rem 0.35rem; }

.talentsWanted-2 p{max-width: 100%; line-height: .4rem;}

.talentsWanted-2{margin-bottom: 0.5rem;}

.add::after{left: 0.08rem;}

.precruitment .precruitment-p1{max-width: 100% !important; font-size: 16px !important;}

.precruitment-list .precruitment-list-item{width: 50%;}

.precruitment-list .precruitment-list-item:nth-child(even)::after{background: none; }

.news-sec4-lists{margin-top: -0.35rem;}

.j3-content .j3-right{margin: 0;}

.j3-right-list ul li{width: 50%;}

.j3-right-list ul li .j3-list-p{max-width: 86%;}

.j3-content{padding-top: 30px;}

.j3-content .pjoin-title{margin-left: 0; text-align: center; margin-bottom: 30px;}

.kefu-info .kefu-mid div{display: block; float: left; width: 50%;}

.kefu-info .kefu-mid .kf-line{display: block;}

.kefu-info .kefu-mid{padding: .6rem .6rem;}

.kf-message-left{padding-right: 0;}

.kf-message-txt div p,.message-form .form-group{width: 100%;}

.message-form .form-group{margin-bottom: .3rem;}

.kf-message{margin-top: .5rem; margin-bottom: .3rem;}

.pcase-item .pcase-txt h3{font-size: 18px;}

.pcase .pcase-item:last-child:nth-child(3n + 2){margin-right: 0;}

.case-sec1 .case-sec1-item{width: 48%;}


.case-del-section1 .case-del-section1-right{padding-left: 0;}

.case-del-section1-right h4{font-size: .35rem; margin-top: .5rem;}

.product-one{margin-top: -80%;}

.product-two,.pservicede2{padding: .3rem .15rem;}

.case-sec1 .case-sec1-item p{font-size: 14px;}

.pabout-list1 .pabout-list1-item{width: 40%;}

.audio-box{height: 3.5rem;}

.history-title-tabs{margin-top: .8rem;}

.pabout-jounal .swiper-container{padding-bottom: .8rem;}

.back-btn{padding: 0.2rem 0.25rem;background-position: 0.15rem center;}

.partners-left .partners-txt{max-width: 100%; font-size: 16px; margin-bottom: .3rem;}

.pabout-honor2-swiper p{font-size: 16px;}

.pabout-honor2-item img{height: 4rem;}

.pabout-honor-txt{max-width: 100%;}

.pabout-honor{background-position: right  bottom , left top;background-size: 100% auto,100% 100%;padding-bottom: 5rem;}
.jobs-content{margin-left: 0; margin-right: 0}
.news-contents{max-width: 100vw;}

.side-box-out{top: 78%;}
.side_box{display: none;}
.side-top::after{ width: 0;}
.side-top img{width: 36px; height: 36px;}

}

@media (max-width:780px){
  .pos1{left: 5%; top: -7%;}

.pos3{left: 33%; top: -19%;}

.pos5{left: 62%; top: -67%;}

.pos7{left: 89%; top: -69%;}
}
@media (max-width:700px){
  .pos1{left: 3%; top: -50%;}

.pos2{left: 16%; top: 80%;}

.pos3{left: 30%; top: -63%;}

.pos4{left: 45%; top: 58%;}

.pos5{left: 60%; top: -105%;}

.pos6{left: 72%; top: 23%;}

.pos7{left: 87%; top: -110%;}
}
@media (max-width:380px){
  .pos1{left: 2%; top: -67%;}

  .pos2{left: 16%; top: 70%;}

  .pos3{left: 30%; top: -75%;}

  .pos4{left: 45%; top: 48%;}

  .pos5{left: 60%; top: -119%;}

  .pos6{left: 72%; top: 17%;}

  .pos7{left: 86%; top: -122%;}
}
@media (max-width:370px){

  .pos7{left: 84%; top: -134%;}
}
@media (max-width:350px){
  .pos1{left: 0%; top: -99%;}

  .pos2{left: 13%; top: 61%;}

  .pos3{left: 28%; top: -98%;}

  .pos4{left: 43%; top: 44%;}

  .pos5{left: 59%; top: -142%;}

  .pos6{left: 70%; top: 11%;}

  .pos7{left: 82%; top: -154%;}
}

#section1 .ind-title,#section1 .solution,#section2 .ind-title,#section2 .section2-item-right,#section3 .ind-title,#section3 .section3-list,#section4 .ind-news-right{transform: translateY(40%); transition: all 1s ease; transition-delay: 0.5s; opacity: 0;}

#section2 .section2-item-mid{transform: translateY(0) scale(0);transition: all 1s ease;transition-delay: 0.8s; opacity: 0;}

#section2.active .section2-item-mid{transform: translateY(0) scale(1); opacity: 1;}

#section1.active .ind-title ,#section1.active .solution,#section2.active .ind-title,#section2.active .section2-item-right,#section3.active .ind-title,#section3.active .section3-list,#section4.active .ind-news-right{ transform: translateY(0); opacity: 1;}

#section0 .swiper-slide .banner-txt{transform: translateY(40%); transition: all 1s ease; transition-delay: 0.3s; opacity: 0;}

#section0 .swiper-slide-active .banner-txt{transform: translateY(0); opacity: 1;}

@keyframes updown {

  0% {

    -webkit-transform: translateY(0);

    -moz-transform: translateY(0);

    -ms-transform: translateY(0);

    -o-transform: translateY(0);

    transform: translateY(0);

  }

  100% {

    -webkit-transform: translateY(-3px);

    -moz-transform: translateY(-3px);

    -ms-transform: translateY(-3px);

    -o-transform: translateY(-3px);

    transform: translateY(-3px);

  }

}

.delay600{

  -webkit-animation-delay: .6s;

    animation-delay: .6s;

    -ms-animation-delay: .6s;

    -moz-animation-delay: .6s;

    -o-animation-delay: .6s;

}

.delay900{

  -webkit-animation-delay: .9s;

    animation-delay: .9s;

    -ms-animation-delay: .9s;

    -moz-animation-delay: .9s;

    -o-animation-delay: .9s;

}

.solution{

   width: 100%;

   height: 5.6rem;

   margin-top: .34rem;

}

.solution > .posr {

  height: 100%;

  

  width: 100%;

  margin: 0 auto;

  position: relative;

}



.solution .contain {

  width: 50%;

  height: 100%;

  position: relative;

  transition: all .5s ease-out;

  -webkit-transition: all .5s ease-out;

  -o-transition: all .5s ease-out;

  -moz-transition: all .5s ease-out;

  z-index: 1;

  position: absolute;

  top: 0;

  overflow: hidden;

  overflow: hidden;

}



@media screen and (min-width: 800px) {

  .solution > .posr:hover .contain {

      width: 20%;

      z-index: 1;

  }



  .solution > .posr .contain:hover {

      width: 80%;

      z-index: 2;

  }

}



.solution .contain > * {

  z-index: 2;

  position: relative;

}



.solution .contain .bg {

  z-index: 0;

  width: 100%;

  height: 100%;

  position: absolute;

}



.solution .contain .bg > div {

  position: absolute;

  left: -10px;

  right: -10px;

  bottom: -10px;

  top: -10px;

  background-size: cover;

  background-position: center;

  /* filter: url(blur.svg#blur);

  -webkit-filter: blur(5px);

  -moz-filter: blur(5px);

  -o-filter: blur(5px);

  -ms-filter: blur(5px);

  filter: blur(5px);

  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=5, MakeShadow=false); */

}



.solution .contain .bg:before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  background: rgba(0, 0, 0, 0);

  z-index: 2;

}



.solution .contain .videobg {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 1;

  opacity: 0;

  transition: all .5s ease-out;

  -webkit-transition: all .5s ease-out;

  -o-transition: all .5s ease-out;

  -moz-transition: all .5s ease-out;

}



.solution .contain .videobg:before {

  content: '';

  position: absolute;

  left: 0;

  right: 0;

  bottom: 0;

  top: 0;

  background: rgba(0, 0, 0, 0.4);

  transition: all .5s ease-out;

  -webkit-transition: all .5s ease-out;

  -o-transition: all .5s ease-out;

  -moz-transition: all .5s ease-out;

}



/* .solution .contain .videobg video {

 object-fit: cover; width: 100%; height: 100%;

} */



.solution .audio {

  left: 0;

  background: #333;

}



.solution .video {

  right: 0; /*background: #666;*/

}



.solution .text {

  position: absolute;

  top: 50px;

  left: 8%;

  color: #fff;

}



.solution .text h1 {

  font-size: 30px;

  letter-spacing: 5px;

  font-weight: bold;

  margin-bottom: .24rem;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

}



.solution .text h2 {

  font-size: 30px;

  letter-spacing: 5px;

  font-weight: normal;

  margin-bottom: 10px;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

}



.solution .text small {

  font-size: .18rem;

  line-height: .3rem;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

}



.solution .btns {

  position: absolute;

  top: 65%;

  right: 50px;

  width: 90%;

  transition: all .5s ease-out;

  -webkit-transition: all .5s ease-out;

  -o-transition: all .5s ease-out;

  -moz-transition: all .5s ease-out;

  height: 130px;

 

}



.solution .contain:hover .btns {

  border-color: rgba(255, 255, 255, 0);

}



.solution .btns ul {

  position: relative;

  height: 100%;

  display: flex;

  justify-content: center;

  list-style: none;

  padding-left: 0;

  margin-bottom: 0;

}



.solution .btns ul:before {

  content: '';

  display: block;

  left: 0;

  right: 0;

  top: 0;

  background: #fff;

  position: absolute;

  z-index: 0;

  height: 0;

  border-radius: 5px;

  overflow: hidden;

}



.solution .btns ul li {

  float: left;

  width: 20%;

  flex-grow: 1;

  position: relative;

  z-index: 1;

  text-align: center;

  display: none;

  height: 100%;



}



.solution .video .btns ul li {

  width: 25%;

}



.solution .btns ul li:before {

  content: '';

  left: 0;

  top: 9px;

  bottom: 0;

  width: 1px;

  background: #e0e0e0;

  position: absolute;

}



.solution .btns ul li:first-of-type:before {

  display: none;

}



.solution .btns ul li a {

  padding: 25px 10px;

  display: block;

}







/* .solution .btns ul li a:before {

  content: 'MORE';

  font-size: 12px;

  line-height: 60px;

  padding-left: 40px;

  color: #fff;



  position: absolute;

  top: 100%;

  left: 0;

  right: 0;

  text-align: left;

  -webkit-animation: flipIn .5s ease-out;

  -o-animation: flipIn .5s ease-out;

  -moz-animation: flipIn .5s ease-out;

  animation: flipIn .5s ease-out;

  display: none;

  transform-origin: top center;

}



.solution .btns ul li a:after {

  content: '\e64e';

  font-family: 'iconfont';

  position: absolute;

  line-height: 60px;

  top: 100%;

  right: 0;

  padding-right: 40px;

  font-size: 30px;

  color: #fff;

  display: none;

  transform-origin: top center;

  -webkit-animation: flipIn .5s ease-out;

  -o-animation: flipIn .5s ease-out;

  -moz-animation: flipIn .5s ease-out;

  animation: flipIn .5s ease-out;

  display: none;

  transform-origin: top center;

} */



/* .solution .btns ul li .iconfont {

  font-size: 40px;

  color: #444;

  display: block;

  line-height: 50px;

  margin-bottom: 10px;

  transition: all 0.2s ease-out;

  -webkit-transition: all 0.2s ease-out;

  -o-transition: all 0.2s ease-out;

  -moz-transition: all 0.2s ease-out;

} */

.solution .btns ul li img {

  width: 40px;

  height: 40px;

  margin: auto;

  margin-bottom: .18rem;

  transition: all 0.2s ease-out;

  -webkit-transition: all 0.2s ease-out;

  -o-transition: all 0.2s ease-out;

  -moz-transition: all 0.2s ease-out;

  -webkit-filter: grayscale(100%);



-moz-filter: grayscale(100%);



-ms-filter: grayscale(100%);



-o-filter: grayscale(100%);



filter: grayscale(100%);



filter: gray;



}



.solution .btns ul li p {

  font-size: 16px;

  color: #454545;

  letter-spacing: 1px;

  text-overflow: ellipsis;

  overflow: hidden;

}

/* 

.solution .btns:before {

  content: '\e61a';

  display: none;

  font-family: 'iconfont';

  line-height: 55px;

  width: 55px;

  text-align: center;

  border-radius: 100%;

  color: #fff;

  font-size: 20px;

  position: absolute;

  left: -60px;

  top: -22px;

  transition: all 0.2s ease-out;

  -webkit-transition: all 0.2s ease-out;

  -o-transition: all 0.2s ease-out;

  -moz-transition: all 0.2s ease-out;

  opacity: 1;

} */



/* .solution .btns > p {

  position: absolute;

  left: -158px;

  top: 130px;

  font-size: 12px;

  line-height: 24px;

  color: #fff;

  text-transform: uppercase;

  width: 450px;

  border-top: 1px solid #fff;

}



.solution.on .btns > p {

  left: 10%;

  width: 100%;

} */



.solution.on .contain {

  position: relative;

}



.solution:hover .contain .btns {

  opacity: 0;

}



.solution:hover .contain:hover .btns {

  opacity: 1;

}



.solution .contain:hover .videobg {

  opacity: 1;

}



.solution .contain:hover .videobg:before {

  opacity: 0.5;

}



.solution .contain:hover .btns {

  width: 90%;

}



.solution .contain:hover .btns:before {

  opacity: 0;

}



/* .solution .contain:hover .btns > p {

  opacity: 0;

 

} */



.solution .contain:hover .btns ul li {

  display: block;

}



.solution .contain:hover .btns ul:before {

  height: 100%;

  transition: all .5s ease-out .5s;

  -webkit-transition: all .5s ease-out .5s;

  -o-transition: all .5s ease-out .5s;

  -moz-transition: all .5s ease-out .5s;

}



/*.solution .btns ul li:hover a:after ,

.solution .btns ul li:hover a:before { display: block; }*/

.solution .btns ul li:hover img {

  filter: none;

}

.solution .btns ul li:hover a p{

  color: #0a408a;

}



@media screen and (max-width: 1600px) {

  .solution {

      height: 550px;

      padding: 0 75px;

  }

}



@media screen and (max-width: 1400px) {

  .solution {

      height: 460px;

  }



  .solution {

      padding: 0;

  }



  .solution .contain .btns {

      height: 100px;

  }



  .solution .contain:hover .btns {

      width: 660px;

      height: 120px;

  }



  .solution .btns ul li a {

      padding: 15px 0;

  }



 



  .solution .btns ul li p {

      letter-spacing: 0;

      font-size: 13px;

  }



  .solution .btns ul li:hover a:after,

  .solution .btns ul li:hover a:before {

      line-height: 50px;

      padding: 0 20px;

  }



  .solution .text {

      top: 60px;

  }

}



@media screen and (max-width: 1200px) {

  .solution {

      padding: 0;

  }



  .solution {

      height: 500px;

  }

}



@media screen and (max-width: 1024px) {

  .solution {

      height: 480px;

      padding: 0;

  }



  .solution .btns {

      width: 250px;

  }



  .solution .contain:hover .btns,

  .solution .contain .btns {

      height: 90px;

  }



  .solution .contain:hover .btns {

      width: 500px;

  }



  .solution .btns ul li a {

      padding: 10px 0;

  }



 



  .solution .btns ul li p {

      letter-spacing: 0;

      font-size: 12px;

  }



  .solution .text h1 {

      font-size: 35px;

      margin-bottom: 5px;

      letter-spacing: 0;

  }



  .solution .text h2 {

      font-size: 35px;

      margin-bottom: 5px;

      letter-spacing: 0;

  }



  .solution .btns {

      top: 60%;

      overflow: hidden;

  }



  .solution .btns ul li:hover a:after,

  .solution .btns ul li:hover a:before {

      line-height: 40px;

      padding: 0 10px;

  }



  .solution .btns:before {

      font-size: 15px;

      line-height: 40px;

      width: 40px;

      left: -45px;

  }

}



@media screen and (max-width: 800px) {

  .solution .text h1 {

      font-size: 25px;

      margin-bottom: 10px;

  }



  .solution .text h2 {

      font-size: 25px;

      margin-bottom: 0;

  }



  .solution .text small {

      font-size: 12px;

      white-space: normal;

  }



  .solution .text {

      top: 30px;

      left: 30px;

      max-width: 80%;

  }



  .solution {

      height: auto;

  }



  .solution .contain {

      position: relative;

      top: auto;

      left: auto;

      bottom: auto;

      right: auto;

      float: none;

      width: auto;

      height: 480px;

  }



  .solution .contain:hover {

      width: auto;

  }



  .solution:hover .contain {

      width: auto;

  }



  .solution .contain .videobg {

      display: none !important;

  }



  .solution .btns:before {

      display: none !important;

  }



  .solution .btns ul:before {

      display: none;

  }



  .solution .btns ul {

      background: #fff;
      flex-wrap: wrap;

  }



  .solution .btns ul li {

      display: block !important;
      width: 33.333%;
      flex-grow: unset;

  }



  .solution .btns ul li p {

      white-space: normal;

      line-height: 1.5;
      max-width: 80%;
      margin: auto;

  }



  .solution .btns {

      left: 0;

      right: 0;

      bottom: 0;

      top: auto;

      width: auto;

  }



  .solution .contain:hover .btns:before {

      display: none;

  }



  .solution .contain .btns,

  .solution .contain:hover .btns,

  .solution:hover .contain .btns {

      width: auto;

      display: block !important;

      opacity: 1;

      height: auto;

  }



  .solution .contain .bg:before {

      background: rgba(0, 0, 0, 0.01);

  }
  .solution .btns ul li:before{
    top: 0;
  }
  .solution .mid.contain .btns ul{
    justify-content: left;
  }
  .solution .mid.contain .btns ul li:nth-child(1),.solution .mid.contain .btns ul li:nth-child(2),.solution .mid.contain .btns ul li:nth-child(3){
    border-bottom: 1px solid #e0e0e0;
  }
  .solution .mid.contain .btns ul li:nth-child(1),  .solution .mid.contain .btns ul li:nth-child(4){
    border-left: 1px solid #e0e0e0;
  }
  .solution .mid.contain .btns ul li:nth-child(3),  .solution .mid.contain .btns ul li:nth-child(5){
    border-right: 1px solid #e0e0e0;
  }
  .solution .mid.contain .btns ul li:nth-child(4),.solution .mid.contain .btns ul li:nth-child(5){ width: 50%;}
  .solution .btns ul li:nth-child(4):before{
    background: transparent;
  }
  /* .solution .btns ul li:nth-child(5)::after {
    content: '';
    right: -1px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #e0e0e0;
    position: absolute;
} */
.solution .video.contain{margin-bottom: .3rem;}
.solution .video.contain .btns ul{
  display: none !important;
}
.solution .video.contain .btns .common-more{margin-left: .5rem;}

}
@media (max-width: 767px){
  .hidden-xs {
    display: none!important;
  }
}

@media screen and (max-width: 480px) {

  .solution .btns ul li .iconfont {

      font-size: 25px;

      line-height: 30px;

  }



  .solution .contain {

      /* height: 300px; */
   

  }
  .solution .video.contain{
    height: 300px;
  }
}
