body {
  overflow-x: visible !important;
}
.headlobx2 {
  width: 81%;
  margin: 1em auto 3% auto;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
}
.lo16 {
  width: 13%;
  margin: 0 0.5%;
}
.aos-animate {
  transition-delay: 0.2s;
}
.slogan {
  width: 95%;
}
.sctx {
  position: absolute;
  width: 20%;
  left: 50%;
  margin-left: -10%;
  font-size: 1.5em;
  background-color: rgb(255 255 255);
}
.successbx {
  position: relative;
  width: 100%;
  min-height: 500px;
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: 50% 100%;
  /* background-image: url(../img/works/cooperate_t.png); */
  background-size: 100% auto;
}
.successbx::before,
.successbx::after {
  position: relative;
  content: "";
  width: 100%;
  display: block;
}
.successbx::before {
  padding-bottom: 1.525%; /*36*/
}
.successbx::after {
  padding-bottom: 10.3%; /*244*/
}
.case_bx {
  position: relative;
  width: 100%;
  padding-bottom: 37.16%;
  margin: 0px auto -8.63vw;
}
.case_bx .casecon {
  position: absolute;
  width: 55%; /*1190*/
  padding-bottom: 20.847%; /*492*/
  left: 33.1779%; /*783*/
  top: 50%;
  transform: translateY(-50%);
}
.case_bx .casecon .cphbx {
  position: absolute;
  width: 56%;
  padding-bottom: 32%;
  top: 0;
  border-radius: 10px;
  overflow: hidden;
}
iframe {
  position: relative;
  display: block;
  width: 100%;
  height: 17.4vw;
}

.case_bx .casecon .yb {
  border: 5px solid #1e9cbf;
  padding-bottom: 0%;
}
.case_bx.on .casecon .cphbx::before {
  right: -2.5%;
  bottom: 2%;
  transform: rotate(11deg);
  transform-origin: 100% 100%;
}

.case_bx .casecon .cphbx img {
  position: absolute;
  width: 100%;
  display: block;
  left: 0;
  top: 0;
}
.case_bx .casecon .ctxtbx {
  position: absolute;
  width: 34%;
  display: block;
  text-align: left;
  top: 2%;
}
.case_bx .casecon .ctxtbx2 {
  position: absolute;
  width: 34%;
  display: block;
  text-align: right;
  top: 2%;
}
.case_bx .casecon .ctxtbx .h1 {
  position: relative;
  display: inline-block;
  font-size: 2.6vw; /*64px*/
  line-height: 3.92vw; /*92.67px*/
  font-weight: 700;
  color: #323232;
  margin: 0 0 2vw; /*53 2.2*/
}
.case_bx .casecon .ctxtbx .h2 {
  font-size: 2.8vw;
}

.case_bx .casecon .ctxtbx .h1::before {
  position: absolute;
  content: "";
  width: 3vw; /*71*/
  padding-bottom: 1.1vw; /*26*/
  border-radius: 0.6vw; /**/
  background-color: #fdd474;
  right: -6%;
  bottom: 1.3%;
}
.case_bx .casecon .ctxtbx .h2::before {
  position: absolute;
  content: "";
  width: 3vw;
  padding-bottom: 1.1vw;
  border-radius: 0.6vw;
  background-color: #fdd474;
  right: -5%;
  bottom: 1.3%;
}
.case_bx .casecon .ctxtbx .con {
  position: relative;
  width: 94%;
  font-size: 1.01vw; /*24*/
  line-height: 1.472vw; /*34.75*/
  font-weight: 300;
  color: #323232;
}
.case_bx .casecon .ctxtbx .con2 {
  width: 100%;
}
.case_bx .casecon .ctxtbx .h1 span {
  position: relative;
  display: inline-block;
}
.case_bx .casecon .ctxtbx .cbtn {
  position: relative;
  width: 55.21%; /*254*/
  padding-bottom: 19.56%; /*90*/
  display: block;
  margin: 1.69vw 0 0; /*40*/
  /*border-radius: 15px 0px 0px 0px;
	border: 5px 0px 0px 0px;*/
}
.case_bx .casecon .ctxtbx .cbtn2 {
  margin: 1.69vw 0 0 8.5vw;
}
.case_bx .casecon .ctxtbx .cbtn span {
  position: absolute;
  width: 100%;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  font-size: 1.35vw; /*32*/
  font-weight: 400;
  color: #112d47;
}
.case_bx .casecon .ctxtbx .cbtn::before,
.case_bx .casecon .ctxtbx .cbtn::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 0.6vw; /*15*/
}
.case_bx .casecon .ctxtbx .cbtn::after {
  border: 0.21vw solid #056daa; /**/
  top: 0;
  left: 0;
}
.case_bx .casecon .ctxtbx .cbtn::before {
  background-color: #fdd474;
  top: 12%;
  left: 7%;
  /**/
  transition: all 0.5s;
}
.case_bx .casecon .ctxtbx .cbtn:hover::before {
  top: 0;
  left: 0;
}

.case_bx .casecon.odd .cphbx {
  left: 38%; /*588*/
}
.case_bx .casecon.even .cphbx {
  left: 0;
}

.case_bx .casecon.even .ctxtbx {
  left: 60%;
}
.case_bx .casecon.odd .ctxtbx {
  left: 0.5%;
}
/**/
.casem_bx {
  position: absolute;
  width: 11%; /*240*/
  height: 90%; /*calc(100vh - 75px)*/
  left: 17.6%; /*392*/
  top: 4%;
}
.casemu {
  position: sticky; /*absolute*/
  width: 100%;
  left: 0;
  top: 15%;
  transition: all 0.5s;
}
.casemu > div {
  position: relative;
  width: 100%;
  margin: 0 auto 0.12vw; /*3*/
  display: block;
  cursor: pointer;
}
.casemu > div > span {
  position: absolute;
  font-size: 1.35vw; /*32*/
  line-height: 1.5vw; /*46 1.94*/
  font-weight: 500;
  text-align: left;
  color: #909293;
  left: 10.416%; /*25*/
  top: 50%;
  transform: translateY(-50%);
}
.casemu > div > span::after {
  position: relative;
  content: attr(data-index);
  display: inline-block;
  font-size: 0.95vw; /*24 1.2vw 19*/
  line-height: 1.1vw;
}

.casemu > div::before {
  position: relative;
  content: "";
  width: 4.16%; /*10*/
  padding-bottom: 38.272%; /*92*/
  display: block;
  background-color: #909293;
}
.casemu > div.on > span {
  font-weight: 700;
  color: #ffbf29;
}
.casemu > div.on::before {
  background-color: #ffbf29;
}
.afic::after {
  position: absolute;
  display: block;
  content: "";
  width: 25px;
  height: 25px;
  left: 10%;
  top: 3px;
  background: url("../img/mks/ff.png");
  background-size: 100% 100%;
}
.afic2::after {
  position: absolute;
  display: block;
  content: "";
  width: 25px;
  height: 20px;
  left: 10%;
  top: 5px;
  background: url("../img/mks/yu.png");
  background-size: 100% 100%;
}
.pcimg {
  display: block;
}
.mbimg {
  display: none;
}
@media only screen and (max-width: 1440px) {
  .afic2::after {
    position: absolute;
    display: block;
    content: "";
    width: 25px;
    height: 20px;
    left: 5%;
    top: 1px;
    background: url("../img/mks/yu.png");
    background-size: 100% 100%;
  }
  .afic::after {
    position: absolute;
    display: block;
    content: "";
    width: 25px;
    height: 25px;
    left: 5%;
    top: 0px;
    background: url("../img/mks/ff.png");
    background-size: 100% 100%;
  }
}
@media only screen and (max-width: 960px) {
  .afic2::after {
    position: absolute;
    display: block;
    content: "";
    width: 25px;
    height: 20px;
    left: 5%;
    top: 1px;
    background: url("../img/mks/yu.png");
    background-size: 100% 100%;
  }
  .afic::after {
    position: absolute;
    display: block;
    content: "";
    width: 25px;
    height: 25px;
    left: 7%;
    top: -1px;
    background: url("../img/mks/ff.png");
    background-size: 100% 100%;
  }
  .case_bx .casecon.odd .cphbx {
    left: 0;
  }
  .case_bx .casecon .ctxtbx .cbtn span {
    font-size: 4.58vw;
  }
  .case_bx .casecon .ctxtbx .cbtn {
    width: 38%;
    padding-bottom: 13.46%;
    margin: 9.1vw auto 0;
  }
  .case_bx .casecon .ctxtbx .cbtn::after {
    border: 1.04vw solid #056daa;
  }
  .case_bx .casecon .ctxtbx .cbtn::before,
  .case_bx .casecon .ctxtbx .cbtn::after {
    border-radius: 1.5625vw;
  }
  .case_bx .casecon .ctxtbx .con {
    width: 73%;
    font-size: 4.6875vw;
    line-height: 7.25vw;
    margin: 0 auto;
    text-align: center;
  }
  .case_bx .casecon .ctxtbx .h1 {
    font-size: 7.66vw;
    line-height: 9.58vw;
    margin: 0 0 7.29vw;
  }

  .case_bx .casecon.even .ctxtbx {
    left: 0;
  }
  .case_bx .casecon .ctxtbx {
    position: relative;
    width: 100%;
    display: block;
    text-align: center;
    top: 0;
  }
  .case_bx .casecon .cphbx {
    position: relative;
    width: 80%;
    padding-bottom: 46%;
    margin: 20.27vw auto 6.7vw;
    top: 0;
  }
  .case_bx .casecon .yb {
    position: relative;
    width: 80%;
    padding-bottom: 0%;
    margin: 20.27vw auto 6.7vw;
    top: 0;
  }
  iframe {
    position: relative;
    display: block;
    width: 100%;
    height: 45.6vw;
  }
  .case_bx .casecon {
    position: relative;
    width: 100%;
    padding-bottom: 0;
    left: 0;
    top: 0;
    transform: translateY(0%);
  }
  .successbx {
    background-image: none;
    overflow: hidden;
  }
  .casem_bx {
    display: none;
  }
  .case_bx {
    width: 100%;
    padding-bottom: 0vw;
    margin: 0 auto 0;
  }
  .case_bx .casecon .ctxtbx .h2::before {
    position: absolute;
    content: "";
    width: 3vw;
    padding-bottom: 1.1vw;
    border-radius: 0.6vw;
    background-color: #fdd474;
    right: -6%;
    bottom: 1.3%;
  }
  .pcimg {
    display: none;
  }
  .mbimg {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  .case_bx .casecon .yb {
    border: 3px solid #1e9cbf;
    padding-bottom: 0%;
  }
  .sctx {
    width: 36%;
    margin-left: -18%;
  }
}
@media only screen and (max-width: 560px) {
  .lo16 {
    width: 30%;
    margin: 0.5%;
  }
  body {
    overflow-x: hidden !important;
  }
  .icmb {
    margin: 0 3%;
  }
}