追伸

スマホで見ている時は上下真ん中になるのですがPCで見ている時は上の方にずれてしまいます。

前略、@ダイバーさん

以下のCSSで試してみると、どうなるでしょうか？

ブラウザをいろいろ変えて、チェックしてみてください。

.header-container-in.hlt-top-menu .logo-header img {
    vertical-align: middle;
}

上手くいくかどうかは、やってみないと、わかりません。

リフィトリーさん、またまたありがとうございます！

迅速な返答、感謝します。

edgeとcromeはロゴが真ん中にきました。ieはこないですね。。。

しょうがないでしょうか・・・

@ダイバー さん

あら、ほんとですね。

ちょっと、ググってみますか・・

@ダイバー さん

ググってみたら、どうも、IE11の Flexbox のバグみたいです。

現状では、以下のような指定があるため、バグが起こるみたいです。

.header .header-in {
    min-height: 70px;
}

以下の記事によると、「IE11の場合は「min-height:」と組み合わせると、うまく真ん中にいってくれないバグ」があるらしいです。

IE11でflexboxのalign-items:centerが天地中央に表示できないバグ

なので、ヘッダーの高さを固定値にすれば、天地の中央に配置されそうです。

ヘッダーの高さを固定値にしても、何ら支障がない、という場合は、以下のCSSが使えるかもしれません。

_:-ms-lang(x)::-ms-backdrop, .header .header-in {
    height: 70px;
}

まあ、これも、やってみないと、何とも、わかりません。

また、よく見てみると、IEだけ、他のブラウザよりロゴの表示が、ちょっと大きいような気もします。

リフィトリーさん、本当にありがとうございます。

すごいサーチ能力・・・

お陰様で無事に解決しました。

感謝感謝です！

@ダイバー さん

もし、固定値にして、何らかの支障が出てしまった場合は、ロゴの上側にマージンを付ける手もなくはないですが、これもやってみないと、わかりません。

_:-ms-lang(x)::-ms-backdrop, .header-container-in.hlt-top-menu .logo-header {
    margin-top: 5px;
}