How to place list markers (tag ) opposite the first line of li paragraph if it consists of few lines

I have a list with li tags. While I am decreasing screan width, these li lines are getting splitted by several ones, so that list markers are getting in the middle of them. How to place them in front of the first line, if there are several ones from the same li tag.

https://cdn1.savepice.ru/uploads/2019/11/12/5f2985128f9cc90c861e7623e23a387b-full.png - screenshot

I can use li:before and place it with margins, but with different widths these lines get splitted by defferent ammount of lies, so I have to place this list marker on a new place every time with mediaqueries. I think I can give list-style-type: none. And list-style-type: squere to the first lie of li tag using something like li:first-child (meaning first line). But that doesn't help, cuz CSS 3 thinks that first child is just the first li from all in ul tag, but not the first line in each of li tag.

html:

<ul class="teach"> blablabla:
                <li>blablabla</li>
                <li>blablabla</li>
                <li>blablabla</li>
                <li>blablabla</li>
                <li>blablabla</li>
            </ul>

css:

.teach {
  padding: 0;
  list-style-type: square;
}

.teach>li {
  position: relative;

}

.teach>li:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -20px;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  background: #fb765f;
}

// these lines down below don't work in appropriate way as it should

.teach>li {
  list-style-type: none;
}

.teach>li:first-child {
  list-style-type: square;
}

// so I've just got rid of them

I expect markers to be opposite the first line