CSS レスポンシブ カバー画像が崩れる

Question

前提・実現したいこと

1rレスポンシブに対応して、形が崩れないようにしたい

発生している問題・エラーメッセージ

![イメージ説明](99f4a2fe67be8f5a353bdf5974db8855.png)
### 該当のソースコード
```ここに言語を入力
コード
`` <div class="container zone"><img class="cover" src="./img/undraw.png"></div>`
コード
`.container {
    display:flex;
    align-items: center;
    justify-content: center;
    height: 50vh;
}
.cover{
    width:30rem;
 
}
``
コード

ソースコード

試したこと

vh、vw,mediaquery

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

初めて質問するのですがよろしくお願いいたします