テキストを下揃えにしたいのですがズレてしまいます。

###テキストを下揃えにしたいのですが上側にズレて配置されてしまします。解決策をお願いいたします。

試したこと：.header-left pタグにvertical-align:text-bottom;
marigin-bottom:0;

html
1<div class="container">    
2            <header>
3                <div class="header-left">
4                    <img src="images/isaralogo.png" alt="ヘッダーロゴ">
5                    <p>バンコクのノマドエンジニア育成講座</p>
6                </div>
7                <div　class="header-right">
8                    <p>お問い合わせ/資料請求はこちら</p>
9                </div>
10            </header>  
11        </div>

css
1header{
2    display: flex;
3    justify-content: space-between;
4    height:45px;
5    background-color: aqua;
6    margin:15px 0;
7}
8
9.header-left{
10    display: flex;
11}
12
13.header-left img{
14    height:45px;
15}
16
17.header-left p{
18    font-size:15px;
19    font-family: arial;
20    font-weight:500;
21}

行動規範の内容に同意します

回答1件

ベストアンサー

css
1header{
2    display: flex;
3    justify-content: space-between;
4    height:45px;
5    background-color: aqua;
6    margin:15px 0;
7}
8
9.header-left,.header-right{
10    display: flex;
11}
12
13.header-left img{
14    height:45px;
15}
16
17.header-left p{
18    font-size:15px;
19    line-height: 1;
20    font-family: arial;
21    font-weight:500;
22    margin: auto 0 0 0;
23}
24
25.header-right p {
26    margin: auto 0 0 0;
27    line-height: 1;
28}