.colored-button {
  border: none;
  outline: none;
  border-radius: 25px;
  background: linear-gradient(0deg, #e96300 0, #f9b000 100%);
  padding-left: 0.54666667rem;
  padding-right: 0.54666667rem;
}
.colored-button a {
  font-size: 0.32rem;
  font-weight: 400;
  color: #ffffff;
}
/*// .tip-change的高度
@tipChangeHeight: 50px;
// .top-wrapper的高度
@topWrapperHeight: 60px;
// 顶部导航栏的高度,由上述变量相加而得
@topHeight: @tipChangeHeight + @topWrapperHeight;

// 配色
@siteColor: #eb651b;

[class$="page"]{
  padding-top: @topHeight;
}

.img-m{
  position: relative;
  img{
    width: 100%;
    display: block;
  }
}

.button{
  color: #fff;
  width: 160px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  outline: none;
  border: none;
  border-radius: 50px;
  background: #3c9dff;
  cursor: pointer;
}*/
div::-webkit-scrollbar {
  width: 2px;
  background: #ccc;
}
div::-webkit-scrollbar-thumb,
div::-webkit-scrollbar-thumb:horizontal,
div::-webkit-scrollbar-thumb:vertical {
  width: 2px;
  background-color: #999;
  border-radius: 2px;
}
/*社保首页样式表*/
#customer .img-m,
#customer .img-m img {
  width: 100%;
}
#customer .main-box {
  padding: 40px 0 90px;
}
#customer .main {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
#customer .menu-box {
  border-top: 7px solid #eb651b;
  width: 327px;
  padding: 37px 34px 32px 61px;
  box-shadow: 0px 0px 40px #ddd;
}
#customer .menu-list {
  border-bottom: 1px solid #ddd;
  font-size: 24px;
  color: #666;
  height: 75px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#customer .menu-list:last-child {
  border-bottom: none;
}
#customer .menu-list.active {
  color: #eb651b;
}
#customer .title-box {
  border-bottom: 1px solid #cfcfcf;
  font-size: 36px;
  height: 120px;
  display: flex;
  padding-left: 5px;
  justify-content: flex-start;
  align-items: center;
}
#customer .left {
  margin-right: 90px;
}
#customer .right {
  flex: 1;
}
#customer .icon-home {
  width: 55px;
  margin-right: 30px;
}
#customer .shop-list-box {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
#customer .s-list {
  width: 33%;
  margin: 35px 0;
  display: flex;
  justify-content: center;
}
#customer .s-img {
  display: inline-block;
}
#customer .more {
  display: flex;
  justify-content: center;
}
#customer .more-img {
  cursor: pointer;
}
.about .title-list ul {
  width: 75%;
  margin: 0 auto;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.about .title-list ul li {
  text-align: center;
  color: #fff;
}
.about .title-list ul li h4 {
  font-size: 40px;
}
.about .title-list ul li p {
  font-size: 12px;
}
.about .about-content h4 {
  text-align: left;
  font-size: 0.45333333rem;
  margin-bottom: 0.13333333rem;
  color: #000000;
}
.about .science {
  width: 100%;
  padding-top: 0.4rem;
  padding-bottom: 0.53333333rem;
}
.about .science .about-wrapper {
  width: 100%;
  display: flex;
}
.about .science .about-wrapper .left {
  width: 405px;
}
.about .science .about-wrapper .right {
  position: relative;
}
.about .science .about-wrapper .right .right-content {
  width: 100%;
}
.about .science .about-wrapper .right .right-content h4 {
  text-align: left;
  font-size: 0.45333333rem;
  margin-bottom: 0.13333333rem;
  color: #000000;
}
.about .science .about-wrapper .right .right-content p {
  font-size: 0.32rem;
  line-height: 0.53333333rem;
  font-weight: 100;
  color: #666666;
  opacity: 0.8;
  text-align: left;
}
.about .science .about-wrapper .right .right-content p:last-of-type {
  margin-top: 0.4rem;
  margin-bottom: 0.4rem;
}
.about .science .about-wrapper .right .right-content ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.about .science .about-wrapper .right .right-content ul li {
  width: 33.3%;
  text-align: center;
  position: relative;
}
.about .science .about-wrapper .right .right-content ul li div.img-content {
  width: 1.01333333rem;
  height: 0.93333333rem;
  margin: 0 auto;
  background: url('/static/m/img/about/science-list@2x.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
[data-dpr="3"] .about .science .about-wrapper .right .right-content ul li div.img-content {
  background: url("/static/m/img/about/service-list@3x.png") no-repeat;
  background-size: cover;
}
.about .science .about-wrapper .right .right-content ul li h5 {
  font-size: 0.34666667rem;
  line-height: 0.64rem;
  margin-top: 0.13333333rem;
  font-weight: 400;
  color: #000000;
}
.about .science .about-wrapper .right .right-content ul li:not(:first-of-type):after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 0.01333333rem;
  height: 0.93333333rem;
  background: #b5b5b5;
  opacity: 0.5;
}
.about .science .about-wrapper .right .right-content ul li:first-of-type .img-content {
  background-position: -2% center;
}
.about .science .about-wrapper .right .right-content ul li:nth-of-type(2) .img-content {
  background-position: 48% center;
}
.about .science .about-wrapper .right .right-content ul li:nth-of-type(3) .img-content {
  background-position: 100% center;
}
.about .procedure {
  position: relative;
  width: 100%;
  height: 8.66666667rem;
  background: url('/static/m/img/about/2-bg@2x.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  text-align: center;
  padding-top: 0.53333333rem;
  padding-bottom: 0.53333333rem;
  overflow: hidden;
}
[data-dpr="3"] .about .procedure {
  background: url("/static/m/img/about/2-bg@3x.png") no-repeat;
  background-size: cover;
}
.about .procedure > h4 {
  text-align: center;
  font-size: 0.45333333rem;
  line-height: 0.70666667rem;
  margin-bottom: 0.48rem;
  font-weight: 400;
  color: #fefefe;
}
.about .procedure .w1200 {
  height: 85%;
}
.about .procedure .procedure-list {
  height: 100%;
  position: relative;
}
.about .procedure .procedure-list .line {
  width: 100%;
  height: 0.14666667rem;
  background: url('/static/m/img/about/main-line@2x.png');
  -webkit-background-size: cover;
  background-size: cover;
  top: 70%;
  left: 50%;
}
[data-dpr="3"] .about .procedure .procedure-list .line {
  background: url("/static/m/img/about/main-line@3x.png") no-repeat;
  background-size: cover;
}
.about .procedure .procedure-list .list-content {
  position: relative;
  height: 100%;
  width: 100%;
}
.about .procedure .procedure-list .list-content .procedure-swiper {
  height: 64%;
}
.about .procedure .procedure-list .list-content .procedure-swiper .swiper-button-next,
.about .procedure .procedure-list .list-content .procedure-swiper .swiper-container-rtl .swiper-button-prev {
  right: 0.01rem;
  width: 0.21333333rem;
  height: 0.72rem;
  background: url('/static/m/img/about/right@2x.png');
  -webkit-background-size: cover;
  background-size: cover;
}
[data-dpr="3"] .about .procedure .procedure-list .list-content .procedure-swiper .swiper-button-next,
[data-dpr="3"] .about .procedure .procedure-list .list-content .procedure-swiper .swiper-container-rtl .swiper-button-prev {
  background: url("/static/m/img/about/right@3x.png") no-repeat;
  background-size: cover;
}
.about .procedure .procedure-list .list-content .procedure-swiper .swiper-button-prev,
.about .procedure .procedure-list .list-content .procedure-swiper .swiper-container-rtl .swiper-button-next {
  left: 0;
  width: 0.21333333rem;
  height: 0.72rem;
  background: url('/static/m/img/about/left@2x.png');
  -webkit-background-size: cover;
  background-size: cover;
}
[data-dpr="3"] .about .procedure .procedure-list .list-content .procedure-swiper .swiper-button-prev,
[data-dpr="3"] .about .procedure .procedure-list .list-content .procedure-swiper .swiper-container-rtl .swiper-button-next {
  background: url("/static/m/img/about/left@3x.png") no-repeat;
  background-size: cover;
}
.about .procedure .procedure-list .list-content .procedure-thumbs {
  height: 44%;
}
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-button-next,
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-container-rtl .swiper-button-prev {
  width: 0.53333333rem;
  height: 0.53333333rem;
  background: url('/static/cn/img/about/next-out.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  border-radius: 50%;
  animation: wave-animate 2s infinite ease-out;
  top: 24.6%;
  right: 0;
}
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-button-next:after,
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-container-rtl .swiper-button-prev:after {
  content: '';
  position: absolute;
  width: 0.42666667rem;
  height: 0.42666667rem;
  background: url('/static/cn/img/about/next-inner.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  animation: wave-animate 2s infinite ease-out;
  top: 0.05rem;
  left: 0.05rem;
}
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-button-prev,
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-container-rtl .swiper-button-next {
  width: 0.53333333rem;
  height: 0.53333333rem;
  background: url('/static/cn/img/about/next-out.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  border-radius: 50%;
  animation: wave-animate 2s infinite ease-out;
  top: 24.6%;
  left: 0;
}
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-button-prev:after,
.about .procedure .procedure-list .list-content .procedure-thumbs .swiper-container-rtl .swiper-button-next:after {
  content: '';
  position: absolute;
  width: 0.42666667rem;
  height: 0.42666667rem;
  background: url('/static/cn/img/about/next-inner.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  animation: wave-animate 2s infinite ease-out;
  top: 0.05rem;
  left: 0.05rem;
}
.about .procedure .procedure-list .list-content .swiper-slide .year,
.about .procedure .procedure-list .list-content .swiper-slide .dot,
.about .procedure .procedure-list .list-content .swiper-slide .detail {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.about .procedure .procedure-list .list-content .swiper-slide .year {
  top: 27%;
}
.about .procedure .procedure-list .list-content .swiper-slide .year img {
  width: 50%;
}
.about .procedure .procedure-list .list-content .swiper-slide .dot {
  top: 2.4%;
}
.about .procedure .procedure-list .list-content .swiper-slide .dot img {
  width: 50%;
}
.about .procedure .procedure-list .list-content .swiper-slide .detail {
  width: 8.08rem;
  height: 4.13333333rem;
  padding-top: 0.48rem;
  padding-bottom: 0.48rem;
  padding-left: 0.29333333rem;
  padding-right: 0.29333333rem;
  background: rgba(255, 255, 255, 0.1);
  top: 0;
  cursor: pointer;
  overflow-y: auto;
}
.about .procedure .procedure-list .list-content .swiper-slide .detail p {
  font-size: 0.32rem;
  line-height: 0.56rem;
  font-weight: 100;
  color: #ffffff;
  opacity: 0.8;
  text-align: left;
}
.about .procedure .procedure-list .list-content .swiper-slide .detail:hover {
  border-bottom: 2px solid;
  border-image: url(/static/cn/img/about/procedure-hover.png) 0 0 10 0;
}
@keyframes wave-animate {
  0% {
    transform: scale(0.7);
    opacity: .3;
    transform-origin: center;
  }
  100% {
    transform: scale(1);
    opacity: 1;
    transform-origin: center;
  }
}
.about .procedure .procedure-list .list-content .swiper-button-next.swiper-button-disabled,
.about .procedure .procedure-list .list-content .swiper-button-prev.swiper-button-disabled {
  animation: none;
}
.about .procedure .procedure-list .list-content .swiper-button-next.swiper-button-disabled:after,
.about .procedure .procedure-list .list-content .swiper-button-prev.swiper-button-disabled:after {
  content: '';
  animation: none;
}
.about .honor {
  position: relative;
  width: 100%;
  padding-top: 0.53333333rem;
  padding-bottom: 0.66666667rem;
  height: 10rem;
  background: url('/static/m/img/about/honor-back@2x.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  text-align: center;
}
[data-dpr="3"] .about .honor {
  background: url("/static/m/img/about/honor-back@3x.png") no-repeat;
  background-size: cover;
}
.about .honor h4 {
  text-align: center;
}
.about .honor .w1200 > p {
  font-size: 0.32rem;
  line-height: 0.53333333rem;
  font-weight: 100;
  color: #666666;
  opacity: 0.8;
  text-align: center;
}
.about .honor .honor-list {
  width: 100%;
  height: 5.76rem;
  margin-top: 0.54666667rem;
  background: rgba(255, 255, 255, 0.4);
}
.about .honor .honor-list .honor-swiper {
  height: 100%;
}
.about .honor .honor-list .honor-swiper .swiper-slide {
  width: 100% !important;
}
.about .honor .honor-list .honor-swiper .swiper-slide ul {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: left;
}
.about .honor .honor-list .honor-swiper .swiper-slide ul li {
  position: relative;
  width: 4.42666667rem;
  height: 1.37333333rem;
  margin-bottom: 0.3rem;
  text-align: center;
  background: url('/static/m/img/about/rank-back@2x.png') no-repeat;
  background-size: cover;
}
.about .honor .honor-list .honor-swiper .swiper-slide ul li:nth-of-type(6n) {
  margin: 0;
}
.about .honor .honor-list .honor-swiper .swiper-slide ul li p {
  width: 90%;
  margin: 0 auto;
  font-size: 0.32rem;
  line-height: 0.48rem;
  font-weight: 100;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.about .contact {
  width: 100%;
  height: 14.78rem;
  background: url('/static/m/img/about/map-back@2x.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  padding: 0.54666667rem 0;
}
[data-dpr="3"] .about .contact {
  background: url("/static/m/img/about/map-back@3x.png") no-repeat;
  background-size: cover;
}
.about .contact .contact-content .area-list {
  width: 100%;
  color: #fff;
}
.about .contact .contact-content .area-list h4 {
  text-align: center;
  color: #fff;
}
.about .contact .contact-content .area-list > p {
  font-size: 0.32rem;
  line-height: 0.53333333rem;
  font-weight: 100;
  color: #ffffff;
  opacity: 0.8;
  text-align: center;
  margin-bottom: 0.53333333rem;
}
.about .contact .contact-content .area-list ul.list {
  width: 100%;
  overflow-x: auto;
  white-space: nowrap;
}
.about .contact .contact-content .area-list ul.list li {
  display: inline-block;
}
.about .contact .contact-content .area-list ul.list li p.detail-title {
  font-size: 0.37333333rem;
  font-weight: 500;
  color: #ffffff;
  line-height: 0.70666667rem;
  position: relative;
  text-align: left;
}
.about .contact .contact-content .area-list ul.list li .active:before {
  content: '';
  position: absolute;
  width: 1.49333333rem;
  height: 0.05333333rem;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background: #ea6014;
}
.about .contact .contact-content .area-list ul.list li:not(:first-of-type) {
  margin-left: 0.53333333rem;
}
.about .contact .contact-content .area-list .list-detail {
  margin: 0.46666667rem 0 0.26666667rem 0;
}
.about .contact .contact-content .area-list .list-detail .company-list {
  width: 100%;
  height: 8.13333333rem;
}
.about .contact .contact-content .area-list .list-detail .company-list .map-swiper {
  height: 100%;
}
.about .contact .contact-content .area-list .list-detail .company-list .swiper-slide {
  width: 100%;
}
.about .contact .contact-content .area-list .list-detail .company-list .swiper-container-horizontal > .swiper-pagination-bullets,
.about .contact .contact-content .area-list .list-detail .company-list .swiper-pagination-custom,
.about .contact .contact-content .area-list .list-detail .company-list .swiper-pagination-fraction {
  bottom: 0;
}
.about .contact .contact-content .area-list .list-detail .company-list .company {
  font-weight: lighter;
  color: #fff;
}
.about .contact .contact-content .area-list .list-detail .company-list .company h5 {
  font-size: 0.32rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: left;
}
.about .contact .contact-content .area-list .list-detail .company-list .company p {
  text-align: left;
  font-size: 0.32rem;
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
}
.about .contact .contact-content .area-list .list-detail .company-list .company p span:first-of-type {
  white-space: nowrap;
}
.about .contact .contact-content .area-list .list-detail .company-list .company:not(:last-of-type) {
  margin-bottom: 20px;
}
.about .contact .contact-content .area-list .list-detail .company-list .company:last-of-type {
  margin-bottom: 15px;
}
.about .contact .contact-content .area-list .list-detail #huanan .company-list {
  height: 8rem;
}
.about .contact .contact-content .area-list .list-detail #huanan .company-list .swiper-container-horizontal > .swiper-pagination-bullets,
.about .contact .contact-content .area-list .list-detail #huanan .company-list .swiper-pagination-custom,
.about .contact .contact-content .area-list .list-detail #huanan .company-list .swiper-pagination-fraction {
  bottom: -5px;
}
.about .contact .contact-content .contact-bottom {
  clear: both;
  color: #d8e2ec;
  font-size: 16px;
  font-weight: lighter;
}
.about .contact .contact-content .contact-bottom p {
  font-size: 0.32rem;
  font-weight: 300;
  color: #d8e2ec;
  line-height: 0.53333333rem;
  opacity: 0.6;
  text-align: left;
}
.about .join {
  position: relative;
  width: 100%;
  height: 4.97333333rem;
  background: url('/static/m/img/about/5-pic@2x.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  padding: 0.4rem 0;
  text-align: center;
}
[data-dpr="3"] .about .join {
  background: url("/static/m/img/about/5-pic@3x.png") no-repeat;
  background-size: cover;
}
.about .join h4 {
  font-size: 0.45333333rem;
  font-weight: 400;
  color: #ffffff;
  text-align: center;
}
.about .join > a {
  border: 1px solid #e5e5e5;
  display: block;
  width: 3.08rem;
  height: 0.68rem;
  line-height: 0.68rem;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  color: #fff;
  font-size: 0.32rem;
  font-weight: 400;
  text-align: center;
  margin: 0 auto;
}
.about .join p {
  font-size: 0.32rem;
  font-weight: 300;
  color: #ffffff;
  line-height: 0.45333333rem;
  margin: 0.26666667rem 0 0.26666667rem 0;
}
.about .join p a {
  font-size: 0.32rem;
  font-weight: 300;
  color: #ffffff;
  line-height: 0.45333333rem;
}
