.content {
  width: 100%;
  height: 44.75rem;
  padding-top: 15rem;
  padding-left: 15rem;
  background: url("../image/app_to_sea/app_banner.jpg");
  background-size: 100% 100%;
}

/* 应用出海 */
.content .section-info {
  width: 36.365rem;
}

.content .section-info .title {
  font-size: 4.5rem;
  font-family: "myFont1";
  color: #ffffff;
}

.content .section-info .desc {
  margin-top: 0.875rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-family: "myFont3";
  color: #ffffff;
}

.content .section-info .btn {
  height: 2.5rem;
  margin-top: 3.5rem;
  font-size: 1rem;
  line-height: 2.5rem;
  text-align: center;
  color: #fff;
  border-radius: 0.25rem;
}

/* part2 */
.app-part2 {
  position: relative;
  width: 100%;
  height: 50rem;
  padding-top: 15.5625rem;
  padding-left: 15rem;
  background: url("../image/app_to_sea/app_part2_bg.jpg");
  background-size: 100% 100%;
}

.app-part2 .app-part2-info .title,
.app-part3 .app-part3-info .title,
.app-part4 .app-part4-info .title,
.app-part5 .app-part5-info .title,
.app-part6 .app-part6-info .title,
.app-part7 .app-part7-info .title {
  font-size: 3rem;
  font-family: "myFont1";
  line-height: 4rem;
  color: #303030;
}

.app-part3 .app-part3-info .title,
.app-part5 .app-part5-info .title,
.app-part7 .app-part7-info .title {
  color: #ffffff;
}

.app-part7 .app-part7-info .title {
  text-align: center;
}

.app-part2-info-box,
.app-part3-info-box,
.app-part4-info-box,
.app-part5-info-box,
.app-part6-info-box {
  margin-top: 4rem;
}

.app-part4-info-box {
  width: 31.25rem;
}

.app-part2-info-item,
.app-part3-info-item,
.app-part4-info-item,
.app-part5-info-item,
.app-part6-info-item {
  position: relative;
  padding-left: 2.4375rem;
  font-size: 1.125rem;
  line-height: 2rem;
  color: #303030;
}

.app-part4-info-item {
  height: 3.375rem;
  line-height: 1.6875rem;
}

.app-part3-info-item,
.app-part5-info-item {
  color: #ffffff;
}

.app-part2-info-item::before,
.app-part3-info-item::before,
.app-part4-info-item::before,
.app-part5-info-item::before,
.app-part6-info-item::before {
  content: "";
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  background-image: url("../image/app_to_sea/right.png");
  background-size: cover;
  position: absolute;
  left: 0rem;
  top: 0.375rem;
}

.app-part2-info-item i,
.app-part3-info-item i,
.app-part4-info-item i,
.app-part6-info-item i {
  font-style: normal;
  color: #000bff;
}

.app-part2-info-item+.app-part2-info-item,
.app-part3-info-item+.app-part3-info-item,
.app-part4-info-item+.app-part4-info-item,
.app-part5-info-item+.app-part5-info-item,
.app-part6-info-item+.app-part6-info-item {
  margin-top: 0.8125rem;
}

.app-part5-info-item {
  white-space: nowrap;
}

.app-part2 .app_part2_element1,
.app-part2 .app_part2_element3,
.app-part2 .app_part2_element4,
.app-part2 .app_part2_element12,
.app-part2 .app_part2_element13,
.app-part2 .app_part2_element17 {
  width: 14.625rem;
  height: 10rem;
  position: absolute;
}

.app-part2 .app_part2_element2 {
  width: 3.5rem;
  height: 3.5rem;
  position: absolute;
}

.app-part2 .app_part2_element9,
.app-part2 .app_part2_element10,
.app-part2 .app_part2_element11,
.app-part2 .app_part2_element16,
.app-part2 .app_part2_element18 {
  width: 11.75rem;
  height: 10rem;
  position: absolute;
}

.app-part2 .app_part2_element1 {
  top: 6.9375rem;
  left: 49.75rem;
  width: 54.625rem;
  height:auto;
}

.app-part2 .app_part2_element2 {
  top: 10.4375rem;
  left: 66.125rem;
}

.app-part2 .app_part2_element3 {
  top: 9.4375rem;
  left: 50.6875rem;
}

.app-part2 .app_part2_element4 {
  top: 12.0625rem;
  left: 86.375rem;
}

.app-part2 .app_part2_element5 {
  width: 2.793125rem;
  height: 2.793125rem;
  position: absolute;
  top: 14.975rem;
  left: 85.581875rem;
}

.app-part2 .app_part2_element6 {
  width: 3.25875rem;
  height: 3.25875rem;
  position: absolute;
  top: 15.789375rem;
  left: 64.05rem;
}

.app-part2 .app_part2_element7 {
  width: 2.793125rem;
  height: 2.793125rem;
  position: absolute;
  top: 17.883125rem;
  left: 74.525rem;
}

.app-part2 .app_part2_element8 {
  width: 2.793125rem;
  height: 2.793125rem;
  position: absolute;
  top: 19.046875rem;
  left: 58.8125rem;
}

.app-part2 .app_part2_element9 {
  top: 17.1875rem;
  left: 83.5rem;
}

.app-part2 .app_part2_element10 {
  top: 17.1875rem;
  left: 60.4375rem;
}

.app-part2 .app_part2_element11 {
  top: 19.1875rem;
  left: 53.5625rem;
}

.app-part2 .app_part2_element12 {
  top: 22.3125rem;
  left: 87.6875rem;
}

.app-part2 .app_part2_element13 {
  top: 22.3125rem;
  left: 63.125rem;
}

.app-part2 .app_part2_element14 {
  width: 3.25875rem;
  height: 3.25875rem;
  position: absolute;
  top: 26.125rem;
  left: 83.75rem;
}

.app-part2 .app_part2_element15 {
  width: 3.25875rem;
  height: 3.25875rem;
  position: absolute;
  top: 26.4925rem;
  left: 60.209375rem;
}

.app-part2 .app_part2_element16 {
  top: 24.375rem;
  left: 49.9375rem;
}

.app-part2 .app_part2_element17 {
  top: 28.1875rem;
  left: 82.375rem;
}

.app-part2 .app_part2_element18 {
  top: 32.4375rem;
  left: 58.1875rem;
}

/* part3 */
.app-part3 {
  position: relative;
  width: 100%;
  height: 50rem;
  padding-top: 13.875rem;
  padding-left: 68.125rem;
  background: url("../image/app_to_sea/app_part3_bg.jpg");
  background-size: 100% 100%;
}

/* part4 */
.app-part4 {
  position: relative;
  width: 100%;
  height: 50rem;
  padding-top: 13.0625rem;
  padding-left: 15rem;
  background: url("../image/app_to_sea/app_part4_bg.jpg");
  background-size: 100% 100%;
}

.app_part4_element1 {
  width: 49.5365rem;
  height: 33.75rem;
  top: 11.0625rem;
  left: 62.25rem;
}

.app_part4_element2 {
  width: 21.5625rem;
  height: 21.5625rem;
  top: 20.625rem;
  left: 50.25rem;
}

.app_part4_element1,
.app_part4_element2 {
  position: absolute;
}

/* part5 */
.app-part5 {
  position: relative;
  width: 100%;
  height: 50rem;
  padding-top: 14.6875rem;
  padding-left: 72.0625rem;
  background: url("../image/app_to_sea/app_part5_bg.jpg");
  background-size: 100% 100%;
}

.app-part5-info {
  width: 35rem;
}

.app_part5_element1 {
  position: absolute;
  width: 49.5625rem;
  height: 33.75rem;
  top: 10.4375rem;
  left: 16.6875rem;
}

.app_part5_element2 {
  position: absolute;
  width: 12.5625rem;
  height: 5.1875rem;
  top: 19.125rem;
  left: 16.125rem;
}

.app_part5_element3 {
  position: absolute;
  width: 8.9375rem;
  height: 5.1875rem;
  top: 23.375rem;
  left: 13.9375rem;
}

.app_part5_element4 {
  position: absolute;
  width: 10.3125rem;
  height: 5.1875rem;
  top: 23.375rem;
  left: 21.9375rem;
}

.app_part5_element5 {
  position: absolute;
  width: 11.25rem;
  height: 5.1875rem;
  top: 27.625rem;
  left: 16.75rem;
}

.app_part5_element6 {
  position: absolute;
  width: 12.9325rem;
  height: 5.1875rem;
  top: 27.625rem;
  left: 27.625rem;
}

.app_part5_element7 {
  position: absolute;
  width: 10.9375rem;
  height: 5.1875rem;
  top: 31.875rem;
  left: 13.9375rem;
}

.app_part5_element8 {
  position: absolute;
  width: 13.9375rem;
  height: 5.1875rem;
  top: 36.125rem;
  left: 20.9375rem;
}

.app_part5_element9 {
  position: absolute;
  width: 10.9375rem;
  height: 5.1875rem;
  top: 40.375rem;
  left: 17.4375rem;
}

/* part6 */
.app-part6 {
  position: relative;
  width: 100%;
  height: 50rem;
  padding-top: 15.5625rem;
  padding-left: 15rem;
  background: url("../image/app_to_sea/app_part6_bg.jpg");
  background-size: 100% 100%;
}

.app_part6_element1 {
  position: absolute;
  width: 51.25rem;
  height: 33.0625rem;
  top: 11.3125rem;
  left: 58.375rem;
}

/* part7 */
.app-part7 {
  position: relative;
  width: 100%;
  height: 58.5625rem;
  padding-top: 5.75rem;
  /* padding-left: 15rem; */
  background: url("../image/app_to_sea/app_part7_bg.jpg");
  background-size: 100% 100%;
  overflow: hidden;
}

.app-part7 .card {
  width: 26.75rem;
  height: 40.5rem;
  position: absolute;
  top: 12.3125rem;
  border-radius: 0.375rem;
  overflow: hidden;
}

.app-part7 .card-1 {
  left: 15.40625rem;
}

.app-part7 .card-2 {
  left: 46.59375rem;
}

.app-part7 .card-3 {
  right: 15.40625rem;
}

.app-part7 .card img {
  width: 26.75rem;
  height: 26.875rem;
}

.app-part7 .card .desc {
  width: 26.75rem;
  height: 13.625rem;
  background-color: #10213a;
  padding: 1.625rem;
}

.app-part7 .card .desc p {
  font-size: 1.125rem;
  line-height: 2.0625rem;
  color: #ffffff;
}

.app-part7 .app-part7-info-title {
  position: absolute;
  top: 2.625rem;
  left: 0;
  width: 20.75rem;
  height: 4.125rem;
  padding-left: 1.5rem;
  font-size: 2.25rem;
  font-family: "myFont1";
  line-height: 4.125rem;
  color: #fff;
  background: linear-gradient(83deg, #000bff 4%, #0750fe 98%);
  border-radius: 0px 0.375rem 0.375rem 0px;
}

/* 案例 */
.case {
  height: 56.25rem;
  padding-top: 3.5rem;
}

.case .title {
  font-size: 3rem;
  font-family: "myFont1";
  line-height: 4rem;
  text-align: center;
  color: #303030;
}

.tab-pane {
  position: relative;
  margin-top: 1.5rem;
}

.tab-pane .tab-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90rem;
  height: 8.375rem;
  margin: 0 auto;
  border-top: 1px solid #d8d8d8;
}

.tab-pane .tab-wrapper .indicate {
  position: absolute;
  top: 0;
  width: 11.25rem;
  height: 0.5rem;
  transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
  background-color: #0012ef;
}

.tab-pane .tab-wrapper .tab-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11.25rem;
  height: 100%;
  cursor: pointer;
}

.tab-pane .tab-wrapper .tab-item img {
  pointer-events: none;
  width: 10.75rem;
  height: 4.875rem;
}

.tab-pane .tab-body {
  overflow: hidden;
  width: 100%;
  height: 30rem;
}

.tab-pane .tab-body .tab-pane-list {
  display: flex;
  height: 100%;
  transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}

.tab-pane .tab-body .tab-pane-list li {
  overflow: hidden;
  position: relative;
  display: flex;
  flex-shrink: 0;
  width: 120rem;
  height: 100%;
  background: #f5f8ff;
}

.info-img {
  width: 57.125rem;
}

.info-box {
  position: absolute;
  top: 0;
  right: 0;
  width: 62.875rem;
  height: 100%;
  padding-top: 4.375rem;
  padding-left: 5.75rem;
  background-color: #f5f8ff;
}

/* .info-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: -3.45rem;
    border-bottom: 30.5rem solid #f5f8ff;
    border-left: 3.45rem solid transparent;
  } */

.info-box .title {
  font-size: 2rem;
  font-family: "myFont1";
  text-align: left;
  color: #303030;
}

.info-box .area {
  margin-top: 1.875rem;
  font-size: 0.875rem;
  font-family: "myFont3";
  text-align: left;
  color: #606060;
}

.info-box .label-list {
  display: flex;
  align-items: center;
}

.info-box .label {
  width: max-content;
  margin-top: 0.5rem;
  padding: 2px 12px;
  font-size: 1rem;
  font-family: "myFont3";
  line-height: 1.5rem;

  text-align: center;
  border-radius: 0.25rem;
  color: #5f7ac4;
  background-color: #cfdcff;
}

.info-box .label+.label {
  margin-left: 0.5rem;
}

.info-box .services {
  margin-top: 1.5rem;
  font-size: 0.875rem;
  font-family: "myFont3";
  text-align: left;
  color: #606060;
}

.info-box .data {
  display: flex;
  align-items: center;
  margin-top: 4.125rem;
}

.data-item+.data-item {
  margin-left: 7.75rem;
}

.info-box .data .data-val {
  font-size: 2.125rem;
  font-family: "myFont1";
  color: #0750fe;
}

.info-box .data .data-desc {
  font-size: 1rem;
  font-family: "myFont3";
  color: #303030;
}

.tab-pane .arrow {
  position: absolute;
  bottom: 2.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  background: rgba(222, 222, 222, 0.5);
}

.arrow:hover {
  background: rgba(216, 228, 255, 0.92);
}

.tab-pane .arrow img {
  -webkit-user-drag: none;
  width: 1.5rem;
  height: 1.5rem;
}

.arrow-left {
  right: 21.25rem;
}

.arrow-right {
  right: 15.125rem;
}

.tab-pane .more {
  display: block;
  text-decoration: none;
  width: 8.75rem;
  height: 2.5rem;
  margin: 2.125rem auto 0;
  font-size: 1rem;
  text-align: center;
  line-height: 2.5rem;
  border-radius: 0.25rem;
  color: #f7f8fa;
}

.app_part5_element2,
.app_part5_element2,
.app_part5_element3,
.app_part5_element4,
.app_part5_element5,
.app_part5_element6,
.app_part5_element7,
.app_part5_element8,
.app_part5_element9 {

  background: rgba(255, 255, 255, 0.72);
  width: auto;
  height: 3rem;
  backdrop-filter: blur(1.25rem);
  box-shadow: 0rem 0.5rem 1.25rem 0rem rgba(0, 0, 0, 0.302);
  color: #3D3D3D;
  font-size: 1.4rem;
  line-height: 3rem;
  border-radius: 30.5rem;
  padding: 0 1rem;
}

@media (max-width: 961px) {
  .content {
    height: 128.125rem;
    background: url("../../../home/images/mobileNew/bip_banner _mobile.jpg") no-repeat;
    background-size: cover;
    padding-left: 0;
  }

  .content .section-info .title {
    font-size: 9rem;
    font-weight: 900;
  }

  .content .section-info {
    padding: 50rem 7rem 0 8rem;
    width: auto;
  }

  .content .section-info .desc {
    font-size: 3rem;
    line-height: 4.5rem;
    padding-top: 5rem;
  }

  .content .section-info .btn {
    font-size: 3rem;
    width: 30rem;
    height: 6.5rem;
    border-radius: 24.25rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 5.5rem;
  }

  .app-part2 {
    height: 140rem;
    background: url("../../../home/images/mobileNew/Part2_bg.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app-part3 {
    height: 140rem;
    background: url("../../../home/images/mobileNew/app_part3_bg.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app-part4 {
    height: 140rem;
    background: url("../../../home/images/mobileNew/app_part4_bg.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app-part5 {
    height: 125rem;
    background: url("../../../home/images/mobileNew/app_part4_bg5.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app-part6 {
    height: 140rem;
    background: url("../../../home/images/mobileNew/app_part5_bg.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app-part7 {
    height: 182.5rem;
    background: url("../../../home/images/mobileNew/03_Bg_app.jpg") no-repeat;
    background-size: cover;
    padding: 10rem 7rem;
  }

  .app_part6_element1 {
    position: absolute;
    width: 90rem;
    height: auto;
    top: 73.3125rem;
    left: 2rem;
  }

  .app-part2-info-box,
  .app-part3-info-box,
  .app-part4-info-box,
  .app-part5-info-box,
  .app-part6-info-box {
    margin-top: 6rem;
  }

  .app-part2 .app-part2-info .title,
  .app-part3 .app-part3-info .title,
  .app-part4 .app-part4-info .title,
  .app-part5 .app-part5-info .title,
  .app-part6 .app-part6-info .title,
  .app-part7 .app-part7-info .title {
    font-size: 6rem;
    font-weight: bold;
    line-height: 8rem;
  }

  .app-part2-info {
    position: unset;
    width: auto;
  }

  .app-part2-info-item,
  .app-part3-info-item,
  .app-part4-info-item,
  .app-part5-info-item,
  .app-part6-info-item {
    font-size: 3.5rem;
    font-weight: normal;
    line-height: 6.25rem;
    padding-left: 1.4375rem;
    height: auto;
  }

  .app-part2-info-item::before,
  .app-part3-info-item::before,
  .app-part4-info-item::before,
  .app-part5-info-item::before,
  .app-part6-info-item::before {

    left: -2rem;
    width: 1.5rem;
    height: 1.5rem;
    background: #000BFF;
    border-radius: 50%;
    top: 2.375rem;
  }

  .app-part3-info-item::before,
  .app-part5-info-item::before {
    background: #25F4EE;
  }

  .app-part2-info .num-box {
    margin-left: 2rem;
    justify-content: space-between;
  }

  .app-part2-func-wrapper {
    padding-left: 2rem;
  }

  .app-part2 .img-wall {
    position: absolute;
    top: 42.75rem;
    left: 7rem;
    width: 74rem;
    transform: scale(2);
  }

  .pc {
    display: none;
  }

  .app-part2-info-box,
  .app-part3-info-box,
  .app-part4-info-box,
  .app-part5-info-box,
  .app-part6-info-box {
    margin-left: 2rem;
  }

  .app-part4-info-box,
  .app-part5-info {
    width: auto;
  }

  .app_part5_element1 {
    width: 78.9125rem;
    height: 52.9562rem;
  }

  .app-part5-info-item {
    white-space: unset;
  }

  .app_part5_element1 {
    left: auto;
    top: 71.4375rem;
  }

  .app_part5_element2,
  .app_part5_element2,
  .app_part5_element3,
  .app_part5_element4,
  .app_part5_element5,
  .app_part5_element6,
  .app_part5_element7,
  .app_part5_element8,
  .app_part5_element9 {
    padding: 1rem 1rem;
    font-size: 2.5rem;
    height: auto;
    line-height: normal;
  }

  .app_part5_element4 {
    top: 73.375rem;
    left: 5.9375rem;
  }

  .app_part5_element3 {
    top: 80.375rem;
    left: 1.9375rem;
  }

  .app_part5_element2 {
    top: 79.125rem;
    left: 58.125rem;
  }

  .app_part5_element5 {
    top: 84.625rem;
  }

  .app_part5_element6 {
    top: 87.625rem;
    left: 62.625rem;
  }

  .app_part5_element7 {
    top: 91.875rem;
    left: 10.9375rem;
  }

  .app_part5_element8 {
    top: 99.125rem;
    left: 35rem;
  }

  .app_part5_element9 {
    top: 100.375rem;
    left: 12.4375rem;
  }

  .app-part7 .app-part7-info .title {
    text-align: unset;
    font-size: 6rem;
    font-weight: bold;
    line-height: 8rem;
  }

  .app-part7 .card {
    width: auto;
    height: auto;
    position: absolute;
    top: 25.3125rem;
    border-radius: 0.375rem;
    overflow: hidden;
    display: flex;
    flex-direction: row-reverse;
  }

  .app-part7 .card .desc {
    width: 51.5rem;
    height: 44.625rem;
    background: #334D75;
  }

  .app-part7 .card .desc p {
    font-size: 2.75rem;

    line-height: 4.125rem;
    padding-top: 16rem;
  }

  .app-part7 .card-1,
  .app-part7 .card-2,
  .app-part7 .card-3 {
    left: auto;
  }

  .app-part7 .app-part7-info-title {
    font-size: 4.5rem;
    font-weight: bold;
    width: auto;
    height: auto;
    left: 1.7rem;
    padding: 2.5rem 3rem;
    top: 3.625rem;
  }

  .app-part7 .card img {
    width: 28rem;
    height: 44.6rem;
  }

  .app-part7 .card img {
    width: 28rem;
    height: 44.625rem;
  }

  .app-part7 .card-2 {
    top: 48rem;
    top: 75rem;
  }

  .app-part7 .card-3 {
    right: auto;
    top: 125rem;
  }

  .entirety .case {
    height: 151.25rem;
  }
}