<ul class="example">
	<li>
		<figure><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/08/flex-direction_dummy.png" alt=""></figure>
		<div class="txt">
			<h1>タイトルタイトル</h1>
			<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
		</div>
	</li>
	<li>
		<figure><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/08/flex-direction_dummy.png" alt=""></figure>
		<div class="txt">
			<h1>タイトルタイトル</h1>
			<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
		</div>
	</li>
	<li>
		<figure><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/08/flex-direction_dummy.png" alt=""></figure>
		<div class="txt">
			<h1>タイトルタイトル</h1>
			<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
		</div>
	</li>
</ul>

ul {
	padding: 0;
}
ul li {
	list-style-type: none;
}
figure {
	margin: 0;
}
img {
	vertical-align: bottom;
}
h1 {
	font-size: 24px;
}
.example {
	width: 800px;
}
.example li {
	display: flex;
}
.example li:nth-child(even) {
	flex-direction: row-reverse;
}
.example li .txt {
	padding: 0 15px;
}