두 개의 열, 이미지 왼쪽 콘텐츠 오른쪽-콘텐츠가 아닌 이미지 크기 조정

두 개의 열 레이아웃 이미지가 왼쪽에 있고 텍스트 콘텐츠가 오른쪽에 있습니다. 화면 크기가 조정되면 텍스트 콘텐츠의 크기가 조정됩니다. 텍스트 대신 이미지 크기가 조정되도록 코드를 조정하려면 어떻게해야합니까?

<div class="content-block-container">
    <img src="image.jpg">
    <div class="content-block-content">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis justo nisl, vel suscipit lectus dignissim
            ut. Aenean sed auctor lorem. Suspendisse eget dapibus est, a egestas dolor. Phasellus lobortis non lacus in sodales.
            Mauris at est justo. Quisque at risus eu odio lobortis suscipit. Etiam nulla elit, tincidunt feugiat nunc a,
            vulputate volutpat lectus. Integer commodo at tellus a tristique. Suspendisse nec sollicitudin sem, non volutpat
            neque. Donec maximus nec purus vel fermentum. Mauris eu nulla efficitur, pharetra dolor fringilla, placerat justo.
        </p>
        <pLorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis justo nisl, vel suscipit lectus dignissim ut.
            Aenean sed auctor lorem. Suspendisse eget dapibus est, a egestas dolor. Phasellus lobortis non lacus in sodales.
            Mauris at est justo. Quisque at risus eu odio lobortis suscipit. Etiam nulla elit, tincidunt feugiat nunc a,
            vulputate volutpat lectus. Integer commodo at tellus a tristique. Suspendisse nec sollicitudin sem, non volutpat
            neque. Donec maximus nec purus vel fermentum. Mauris eu nulla efficitur, pharetra dolor fringilla, placerat
            justo.</p>
    </div>
</div>

<style>
    .content-block-container {
        align-items: end;
        display: flex;
    }

    .content-block-container img {
        border: 5px #fff solid;
        margin-right: 30px;
    }

    .content-block-content {
        display: flex;
        flex: 1;
        flex-direction: column;
    }

    img {
        height: auto;
        max-width: 100%;
    }    

</style>

jsfiddle