縦書きのdisplay:flex; で中央揃えにしたい

Question

縦並びのサイドバーで、文字や画像を中央揃えにしたいのですが、
動いてくれません。原因を教えていただけないでしょうか？

HTML

				<div class="sidebar_txt">
					<p><a href=""><span>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</a></p>
				</div>
				<div class="sidebar_mail">
					<a href="#"><img src="img/sec09_icon_02.png" alt=""></a>
				</div>
				<div class="sidebar_tel">
					<a href="tel:[phone]">
						<img src="img/icon_side_tell.png" alt="">
						<span>000-0000-0000</span>
					</a>
				</div>
			</div>

CSS
.sidebar{
	writing-mode: vertical-rl;
	position: fixed;
	top: 60px;
	right: 0;
	display: flex;
	align-items: center;
	
}
.sidebar_txt{
	background-color: #000;
	border-radius: 10px 0 0 0;
	width: 74px;
}

.sidebar_txt p span{
	font-size: 18px;
}
.sidebar_txt p a{
	color: #fff;
}
.sidebar_mail{
	background-color: #9CBE46;
	width: 74px;
	height: 50px;
}
.sideber_mail a{
	width: 74px;
}
.sidebar_tel{
	background-color: #e05104;
	border-radius: 0 0 0 10px;
	width: 74px;
	height: 174px;
}

Answer 1

子要素にも、display: flex; align-items: center; が必要ですね。

.sidebar > div, .sidebar > div > a {
  display: flex;
  align-items: center;  
}