.fx-free-gradient{
  background: linear-gradient(45deg, #FF704F 0%, #FF9326 100%);
  color: #fff !important;
  display: inline-flex;
}
.plain-btn:hover{
  color: #FF8000;
}
.yellow{
  color: #FF8000 !important;
}
.fx-free-gradient:hover{
  color: #fff;
}
.fx-consult-plain{
  border: 1px solid #CCC;
  color: #272B34;
  display: inline-flex;
}
.fx-consult-plain:hover{
  color: #272B34;
}
.page-container{
  margin-top: 63px !important;
}
.product-bg{
  background-color: #FAFCFF;
}

/* 面包屑 */
.container-top-nav{
  padding: 0;
}
.bread-nav {
  display: flex;
  align-items: center;
  padding: 16px 0;
  color: #545861;
  font-weight: bold !important;
}

.bread-nav a:hover {
  color: #ff8000;
}

.bread-nav img {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}

.bread-nav .bread-news-title {
  position: relative;
}

.bread-icon-wrapper:hover .icon-vector {
  color: #ff8000;
}

.bread-icon-wrapper .sub-nav {
  position: absolute;
  z-index: 1;
  padding: 16px;
  background: #FFFFFF;
  border-radius: 4px;
  color: #545861;
  display: none;
  box-shadow: 0px 10px 40px 0px rgba(84, 88, 97, 0.07);
  width: max-content;
  text-align: left;
  left: 50%;
  transform: translateX(-50%);
}

.bread-icon-wrapper .sub-nav li {
  height: 32px;
  line-height: 32px;
  top: 6px;
  position: relative;
}

.bread-icon-wrapper .sub-nav li .sub-link {
  display: inline-block;
  width: 100%;
  height: 100%;
}

.bread-icon-wrapper:hover .sub-nav {
  display: flex;
  flex-direction: column;
}


.banner-container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1200px;
  width: 100%;
  padding: 54px 0 67px 0;
  margin: 0 auto;
}
.banner-left{
  margin-right: 68px;
  max-width: 512px;
}
.banner-right{
  flex: 1;
}
.banner-right img{
  width: 100%;
  height: auto;
}
.banner-right .indicator-list{
  display: flex;
  gap: 8px;
}
.banner-right .indicator-item{
  background: #FFF;
  box-shadow: 0px 0px 4px 0px rgba(74, 74, 74, 0.10);
  flex: 1;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  position: relative;
  cursor: pointer;
  cursor: pointer;
}

.banner-right .indicator-item img{
  height: 28px;
  width: auto;
  object-fit: contain;
}

.indicator-item .indicator-item-bottom{
  width: 100%;
  height: 4px;
  background: linear-gradient(45deg, #ff704f 0%, #ff9326 100%);
  border-radius: 0px 0px 8px 8px;
  position: absolute;
  bottom: 0;
  left: 0;
  display: none;
}

.banner-right .banner-indicator-active .indicator-item-bottom{
  display: block;
}




.banner-left .feature-list{
  margin-top: 12px;
}
.banner-left .feature-list .feature-item{
  display: flex;
}
.banner-left .feature-list .feature-item p{
  line-height: 36px;
}
.banner-left .feature-list .feature-item img{
  width: 18px;
  height: 18px;
  margin: 10px 8px 0 0;
}
.banner-left .btns-group{
  display: flex;
  margin-top: 40px;
}

.banner-left .common-btn:first-child{
  margin-right: 16px;
}

/* 挑战 */
.challenge-list{
  display: flex;
  flex-wrap: wrap;
}
/* challenge-list-num 一行放几个 默认两个 */
.challenge-list .challenge-item{
  border-radius: 4px;
  border: 1px solid #DEE1E6;
  background: var(---White, #FFF);
  width: 588px;
  padding: 24px;
  box-sizing: border-box;
  text-align: left;
}
.challenge-list-1 .challenge-item{
  width: 1200px;
}
.challenge-list-3 .challenge-item{
  width: 384px;
}
.challenge-list-4 .challenge-item{
  width: 282px;
}
.challenge-list .challenge-item .item-title{
  position: relative;
  padding-left: 16px;
}
.challenge-list .challenge-item .item-title::before{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 8px;
  height: calc(100% - 12px);
  background-color: #ff8000;
  border-radius: 4px;
}
.challenge-list .challenge-item .item-title-nobefore{
  padding-left: 0;
}
.challenge-list .challenge-item .item-title-nobefore::before{
  display: none;
}

.roi-page-container .challenge-list .challenge-item{
  align-items: center;
}

.challenge-list .challenge-item .num-title{
  margin-right: 8px;
}

.challenge-list .challenge-item li{
  padding-left: 12px;
  position: relative;
}
.challenge-list .challenge-item li::before{
  content: "";
  position: absolute;
  top: 12px;
  transform: translateY(-50%);
  left: 0;
  width: 6px;
  height: 6px;
  background-color: #181C25;
  border-radius: 1.5px;
}

/* 卡片结构 */
.container-challenge-card .challenge-card-list{
  display: flex;
  flex-wrap: wrap;
}
.challenge-card-list .card-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 214px;
}
.card-item .item-title{
  border-radius: 8px 8px 0px 0px;
  border: 2px solid #FFE3CA;
  background: #FFF9F5;
  box-shadow: 0px 6px 28px 0px rgba(191, 53, 20, 0.06);
  padding: 20px 8px;
  color: #E66000;
  text-align: center;
  font-family: "PingFang SC";
  font-size: 18px;
  font-style: normal;
  width: 100%;
  line-height: normal;
}
.card-item .item-content{
  display: flex;
  padding: 16px 24px 24px 24px;
  justify-content: center;
  align-items: flex-start;
  color: #181C25;
  font-family: "PingFang SC";
  font-weight: 400;
  line-height: 26px;
  border-radius: 0px 0px 8px 8px;
  border-right: 2px solid var(---Special-02, #EEF0F3);
  border-bottom: 2px solid var(---Special-02, #EEF0F3);
  border-left: 2px solid var(---Special-02, #EEF0F3);
  background: #FFF;
  flex: 1;
  text-align: left;
}


.container-data .text-16{
  margin-top: 4px;
}
.container-data .img-wrapper{
  border: none;
}
.container-data .whitepaper-btn{
  display: inline-block;
  padding: 7px 18px;
  border: 1px solid #CCCCCC;
  border-radius: 20px;
  color: #272B34;
}

.solutions-content-container .tab,
.switch-container .tab{
  display: flex;
  border-bottom: solid 1px #dee1e6;
  justify-content: center;
}
.solutions-content-container .tab .tab-item.active,
.switch-container .tab .tab-item.active{
  border-bottom: 4px solid #ff8735;
}
.solutions-content-container .tab .tab-item,
.switch-container .tab .tab-item {
  margin-right: 100px;
  padding-bottom: 10px;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
}
.solutions-content-container .tab .tab-item:last-child,
.switch-container .tab .tab-item:last-child{
  margin-right: 0;
}
.solutions-content-container .tab .tab-item a,
.switch-container .tab .tab-item a{
  color: #181c25;
}
.solutions-content-container .tab .tab-item.active a,
.switch-container .tab .tab-item.active a{
  color: #ff8000;
}

.container-solution .solution-item{
  display: none;
  text-align: left;
}
.switch-container .switch-item{
  display: none;
}
.container-solution .selected,
.switch-container .selected{
  display: block;
}
.solution-item .detail-title{
  color: #181C25;
  font-family: "PingFang SC";
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 38px;
}
.solution-item  .detail-img img{
  width: 100%;
  height: auto;
}
.solution-item .item-btn{
  display: flex;
  justify-content: center;
}
.solution-item .feature-item{
  display: flex;
  margin-top: 12px;
}
.solution-item .feature-item:first-child{
  margin-top: 0;
}
.solution-item .feature-item strong{
  font-weight: 600;
}
.solution-item .feature-item img{
  width: 20px;
  height: 20px;
  margin-right: 12px;
  margin-top: 3px;
}

/* 左右布局 */
.solution-item .flex-row .detail-content{
  margin-right: 40px;
  width: 540px;
}
.solution-item .flex-row .detail-img{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.solution-item .flex-row .btn-two{
  display: flex;
  margin-top: 32px;
}
.solution-item .flex-row .btn-two a:not(:first-child){
  margin-right: 16px;
}


/* 客户 */
.container-customer .swiper-container {
  width: 100%;
  margin: 24px auto 20px auto;
  border: 1px solid #DEE1E6;
  border-radius: 8px;
  box-shadow: 0px 2px 12px 0px rgb(74 74 74 / 10%);
  text-align: left;
}
.container-customer .swiper-slide {
  padding: 24px;
  display: flex;
  background-color: #fff;
}
.container-customer .swiper-slide .image {
  margin-right: 24px;
  width: 200px;
  height: 190px;
}
.container-customer .slide-p{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 16px 0;
  height: 100%;
}
.container-customer .slide-p .p4{
  color: #272B34;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  flex: 1;
}
.container-customer .slide-p .p5{
  display: flex;
  color: #181C25;
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}

.container-customer .indicator{
  width: 100%;
  display: flex;
  margin: auto;
}
.indicator>div{
  flex: 1;
  height: 64px;
  margin-right: 8px;
  border-radius: 8px;
  box-shadow: 0px 2px 12px 0px rgba(74, 74, 74, 0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background-color: #fff;
}
.indicator>div img{
  height: 32px;
}
.indicator-active::after{
  content: "";
  position: absolute;
  width: 100%;
  height: 4px;
  background: linear-gradient(45deg, #ff704f 0%, #ff9326 100%);
  bottom: 0px;
  left: 0px;
  border-radius: 0 0 8px 8px;
}

.container-customer .img-wrapper{
  margin-top: 40px;
}


/* 精彩内容 */
.more-container .content-list{
  display: flex;
  flex-wrap: wrap;
}
.more-container .list-item{
  display: block;
  width: 282px;
}
.more-container .post-card{
  border: 1px solid #DEE1E6;
  border-radius: 8px;
}
.more-container .post-card-img img{
  width: 100%;
  height: 160px;
  object-fit: cover;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  /* 防止底部留白 */
  display: flex;
}
.more-container .post-card-body{
  color: #181C25;
  padding: 16px;
  text-align: left;
  height: 88px;
}
.fx-consult-btn:hover + .online-wrapper{
  display: block;
}
.container-customer .btns-wrapper{
  display: inline-flex;
  position: relative;
}
.btns-wrapper .online-wrapper {
  text-align: center;
  position: absolute;
  bottom: 70px;
  right: -16px;
  width: auto;
  padding: 10px;
  background-color: #fff;
  box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 15%);
  display: none;
  z-index: 999;
}
.btns-wrapper .online-p1, .online-p2{
  color: #888 !important;
  font-size: 14px !important;
}
.btns-wrapper .online-wrapper::after {
  content: "";
  border: 10px solid transparent;
  border-top: 20px solid #fff;
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
}

/* 基础知识 */
.informations {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 40px 0 40px;
}

.informations-body {
  max-width: 1200px;
  width: 100%;
}

.informations-list .informations-item {
  border-bottom: 1px solid #DEE1E8;
  cursor: pointer;
}

.informations-item-bg {
  background-color: #F2F4FB;
}

.informations-item .informations-title {
  padding: 24px;
  height: 76px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.informations-item-bg .informations-title{
  padding: 24px 24px 8px 24px;
}

.informations-title .informations-title-left {
  display: flex;
  justify-content: center;
  align-items: center;
}

.informations-title-left .title-circle {
  width: 8px;
  height: 8px;
  background: #FF8000;
  border-radius: 4px;
  margin-right: 8px;
}

.informations-title-left .title-text {
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 28px;
  color: #181C25;
  text-align: left;
}

.informations-title-right img {
  height: 7px;
  width: 14px;
}

.informations-list .informations-content {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  text-align: justify;
  color: #181C25;
  padding: 0 40px 24px 40px;
}
.informations-content ul,
.informations-content li{
  list-style: disc;
}
.informations-content ul{
  padding-left: 24px;
}

@media screen and (max-width: 1200px){
  .banner-container{
    padding: 54px 24px 67px 24px;
  }
  .banner-left{
    max-width: none;
    flex: 1;
  }
  .banner-left .feature-list .feature-item p{
    line-height: 2.3vw;
  }
  .banner-left .btns-group{
    margin-top: 3.3vw;
  }
  .banner-left .feature-list .feature-item img{
    width: 1.5vw;
    height: 1.5vw;
    margin-top: 0.4vw;
  }
  /* 解决方案左右 */
  .solution-item .flex-row .detail-content{
    margin-right: 3.3vw;
    flex: 1;
  }
}
@media screen and (max-width: 1039px) {
    /* 顶部 */
    .page-container{
      margin-top: 56px !important;
    }
}

@media screen and (max-width: 800px) {
  .padding-24{
    padding: 0 4vw;
  }
  .flex-2{
    flex: 2 !important;
  }
  /* banner */
  .banner-container{
    flex-direction: column;
    padding: 4vw;
  }
  .banner-left{
    margin-right: 0 !important;
    max-width: 100% !important;
    text-align: center;
  }
  .banner-left .btns-group{
    justify-content: center;
  }
  .banner-left .feature-list .feature-item img{
    width: 3vw;
    height: 3vw;
    margin-top: 1.2vw;
  }
  .n-banner .common-btn{
    font-size: 3.7vw;
    width: fit-content;
    height: 9.6vw;
    line-height: 6.4vw;
    padding: 0 9vw;
  }
  .banner-right{
    width: 100%;
    margin-top: 4.3vw;
  }
  .challenge-list .challenge-item .item-title::before{
    height: calc(100% - 3.2vw);
    width: 1vw;
  }
  .challenge-list .challenge-item .item-title{
    padding-left: 3vw;
  }
  .challenge-list,
  .more-container .content-list,
  .container-advantages .advantages-wrapper,
  .container-challenge-card .challenge-card-list
  {
    flex-wrap: nowrap;
    padding-left: 4vw;
  }
  .challenge-list::after,
  .more-container .content-list::after,
  .container-customer .indicator::after,
  .container-advantages .advantages-wrapper::after,
  .container-challenge-card .challenge-card-list::after{
    content: '';
    width: 0.8vw;
    flex-shrink: 0;
  }
  .challenge-list .challenge-item,
  .certification-list .certification-item,
  .more-container .list-item,
  .advantages-wrapper .advantages-item,
  .challenge-card-list .card-item
  {
    width: calc(2/3 * (100vw - 4vw - 3.2vw));
    padding: 4.2vw;
    border-radius: 2.1vw;
    flex-shrink: 0;
    margin-right: 3.2vw !important;
  }
  .challenge-card-list .card-item{
    padding: 0;
    width: calc(2/4 * (100vw - 8vw - 3.2vw + 0.8vw));
  }
  .container-data .img-wrapper,
  .container-solution .solution-item .detail-img{
    margin-left: 4vw;
    margin-right: 4vw;
    width: auto;
  }
  .challenge-list .challenge-item li{
    padding-left: 3vw;
  }
  .challenge-list .challenge-item li::before{
    /* 单行对齐 文字行高是5.4vw */
    top: 2.7vw;
    transform: translateY(-50%);
    width: 1vw;
    height: 1vw;
    border-radius: 0.3vw;
  }
  .more-container .list-item{
    padding: 0;
  }
  .more-container .post-card-body{
    padding: 4.2vw;
    height: 19.2vw;
  }
  .container-data .whitepaper-btn{
    font-size: 3.2vw;
    border-radius: 4.2vw;
  }
  .solutions-content-container .tab{
    width: max-content;
    min-width: 100%;
  }
  
  .solutions-content-container .tab .tab-item,
  .switch-container .tab .tab-item{
    flex-shrink: 0;
    margin-right: 6vw;
    font-size: 3.6vw;
    padding-bottom: 1vw;
  }
  .solution-item .detail-title{
    font-size: 3.6vw;
    line-height: 6.2vw;
  }
  .solution-item .detail-desc{
    font-size: 3.2vw;
  }
  .solution-item .feature-item img{
    width: 4.4vw;
    height: 4.4vw;
    margin-right: 2.2vw;
    margin-top: 0.6vw;
  }
  .solutions-content-container .tab .tab-item.active,
  .switch-container .tab .tab-item.active{
    border-bottom: 0.7vw solid #ff8735;
  }
  .container-customer .swiper-container {
    width: auto;
    margin: 3.2vw 4vw;
  }
  .container-customer .swiper-slide{
    padding: 4.2vw;
    flex-direction: column;
    justify-content: space-between;
    height: auto;
  }
  .container-customer .swiper-slide p{
    color: #272B34;
  }
  .container-customer .person {
    display: flex;
    margin-top: 2.1vw;
  }
  .container-customer .swiper-slide .image {
    width: 17.1vw;
    height: 17.1vw;
    object-fit: cover;
  }
  .container-customer .info{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1.8vw 0;
  }
  .container-customer .indicator{
    display: flex;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    padding-left: 4vw;
    margin-top: 3.2vw !important;
    padding-bottom: 12px;
    margin-bottom: -12px;
  }
  .indicator>div{
    margin-right: 3.2vw;
    height: 12.7vw;
    width: 25vw;
    flex: none;
  }
  .indicator>div img {
    height: 50%;
    object-fit: contain;
  }
  .container-customer .img-wrapper{
    margin-top: 6.3vw;
    padding: 0 4vw;
    border: none;
  }
  .container-customer .img-wrapper img{
    border: 1px solid #dee1e8;
  }
  .solution-item .flex-row .detail-content{
    margin-right: 0;
    max-width: none;
    width: 100%;
  }
  .solutions-content-container .flex-row{
    flex-direction: column;
  }
  .solution-item .flex-row .btn-two{
    margin-top: 3vw;
    justify-content: center;
  }
  .solution-item .flex-row .btn-two a:not(:first-child){
    margin-right: 1.5vw;
  }
  .solution-item .flex-row .common-btn-m{
    font-size: 3.2vw !important;
    font-weight: 400 !important;
    line-height: 5.4vw !important;
    border-radius: calc(3.3vw + 1px);
    padding: 0.6vw 3.2vw;
    width: auto;
    height: auto;
  }
  .informations-item .informations-title{
    padding: 4vw;
    height: auto;
  }
  .informations-item-bg .informations-title{
    padding: 4vw 4vw 1.3vw 4vw;
  }

  .informations-list .informations-content{
    padding: 0 6.7vw 4vw 6.7vw;
  }
  .informations-title-right img{
    height: 1.1vw;
    width: 2.2vw;
  }
  .informations-content ul,
  .informations-content li{
    margin-left: 2.2vw;
    padding-left: 0;
  }

  .banner-right .indicator-item{
    height: auto;
    padding: 8px 0;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
  }
  .banner-right .indicator-item img{
    width: 70%;
    height: auto;
  }
}