.flex_img_content{
  width:100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  gap:20px;
  .image{
    text-align:center;
    width:50%;
  }
}

.csr-charter{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 26px 0;
  padding:60px 60px 80px!important;
  li{
    position: relative;
    counter-increment: item;
    padding-top: 6px;
    padding-bottom: 10px;
    padding-left: 38px;
    font-size: 16px;
    font-weight: 500;
    line-height: 2;
    letter-spacing: .04em;
    border-bottom:1px solid #c70025;
    &::before {
      content: counter(item);
      position: absolute;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      font-family: Roboto, sans-serif;
      font-weight: 500;
      letter-spacing: .05em;
      line-height: 1;
      color:#c70025;
    }
  }
}

@media screen and (min-width: 768px) {
    .csr-charter{
      li{
        font-size:22px;
        font-weight:700;
        &::before{
          top:calc(50% + 2px);
          left:0;
          transform: translateY(-50%);
          font-size:26px;
        }
      }
    }

}

@media screen and (max-width: 767px) {
  .flex_img_content{
    flex-direction: column;
    .image{
      width:100%;
    }
  }
  .csr-charter{
    li{
      font-size:22px;
      font-weight:700;
      &::before{
        top:16px;
        left:0;
        transform: none;
        font-size:26px;
      }
    }
  }

}
