.MP_HCT_10 .wrapper > div {
  display: flex;
  flex-direction: row-reverse;
  height: 460px;
  justify-content: space-between;
  position: relative;
}
.MP_HCT_10 .wrapper > div:before, .MP_HCT_10 .wrapper > div:after {
  position: absolute;
  content: " ";
  width: 300px;
  height: 300px;
  z-index: -1;
}
.MP_HCT_10 .wrapper > div:before {
  left: 40px;
  bottom: 0;
  background: var(--color-secondary);
  transform: translate(-10px, 10px);
  clip-path: polygon(0 0, 20px 0, 100% calc(100% - 20px), 100% 100%, 0 100%);
}
.MP_HCT_10 .wrapper > div:after {
  right: 40px;
  top: 0;
  background: var(--color-secondary);
  transform: translate(10px, -10px);
  clip-path: polygon(0 0, 100% 0, 100% 100%, calc(100% - 20px) 100%, 0 20px);
}
.MP_HCT_10 .wrapper > div .pic {
  width: calc(45% - 0px);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 120px 100%);
  transform: translateX(-40px);
}
.MP_HCT_10 .wrapper > div .pic img {
  object-position: center;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.MP_HCT_10 .wrapper > div .info {
  width: calc(55% - 0px);
  clip-path: polygon(0 0, calc(100% - 120px) 0, 100% 100%, 0 100%);
  background: #fff;
  transform: translateX(40px);
  position: relative;
  text-align: start;
}
.MP_HCT_10 .wrapper > div .info > h2 {
  color: var(--color-secondary);
  padding: 0 0 15px;
  font-size: var(--fs-xl4);
  background: var(--color-body-background);
  display: block;
  width: 100%;
}
.MP_HCT_10 .wrapper > div .info .content {
  padding: 40px 80px 40px 40px;
  font-size: var(--fs-sm);
}
.MP_HCT_10 .wrapper > div .info .content .desc {
  font-size: var(--fs-md);
  margin: 0 0 30px;
}
.MP_HCT_10 .wrapper > div .info .content .pIcon {
  padding: 0 0 0 40px;
  margin: 0 0 20px;
  position: relative;
}
.MP_HCT_10 .wrapper > div .info .content .pIcon i {
  color: var(--color-secondary);
  font-size: var(--fs-xl);
  position: absolute;
  left: 15px;
  top: 0px;
  transform: translateX(-50%);
}

html[dir=rtl] .MP_HCT_10 .wrapper > div:before {
  right: 40px;
  left: unset;
  transform: translate(10px, 10px);
  clip-path: polygon(0 calc(100% - 20px), 0 100%, 100% 100%, 100% 0, calc(100% - 20px) 0);
}
html[dir=rtl] .MP_HCT_10 .wrapper > div:after {
  right: unset;
  left: 40px;
  transform: translate(-10px, -10px);
  clip-path: polygon(0 0, 100% 0, 100% 20px, 20px 100%, 0 100%);
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .pic {
  width: calc(45% - 0px);
  clip-path: polygon(0 0, 100% 0, calc(100% - 120px) 100%, 0 100%);
  transform: translateX(40px);
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .pic img {
  transform: scaleX(-1);
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .info {
  width: calc(55% - 0px);
  clip-path: polygon(120px 0, 100% 0, 100% 100%, 0 100%);
  transform: translateX(-40px);
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .info .content {
  padding: 40px 40px 40px 80px;
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .info .content .pIcon {
  padding: 0 40px 0 0;
}
html[dir=rtl] .MP_HCT_10 .wrapper > div .info .content .pIcon i {
  left: unset;
  top: 2px;
  right: 15px;
  transform: translateX(50%);
}

@media all and (max-width: 800px) {
  .MP_HCT_10 .wrapper > div {
    height: auto;
  }
  .MP_HCT_10 .wrapper > div:before, .MP_HCT_10 .wrapper > div:after {
    display: none;
  }
  .MP_HCT_10 .wrapper > div .pic {
    display: none;
  }
  .MP_HCT_10 .wrapper > div .pic img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }
  .MP_HCT_10 .wrapper > div .info {
    width: 100%;
    clip-path: none;
    padding: 20px;
    transform: none;
  }
  .MP_HCT_10 .wrapper > div .info > h2 {
    background: transparent;
  }
  .MP_HCT_10 .wrapper > div .info .content {
    padding: 0;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div {
    height: auto;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div:before, html[dir=rtl] .MP_HCT_10 .wrapper > div:after {
    display: none;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div .pic {
    display: none;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div .info {
    width: 100%;
    clip-path: none;
    padding: 20px;
    transform: none;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div .info > h2 {
    background: transparent;
  }
  html[dir=rtl] .MP_HCT_10 .wrapper > div .info .content {
    padding: 0;
  }
}.MP_HCT_10 .wrapper > div .info .content .desc > p:first-child {
    margin: 0 0 5px;
}