Flexbox Responsive Images not shrinking

I have a parent with flex column inside is an image and a div set to flex row with two more images inside. All the images are shrinking down as expected accept the two inside this specific div. I feel like I'm missing something simple to fix this issue but everything I've tired doesn't seem to work. I tired flex grow/shrink but that didn't seem work either.

Screenshot

CodePen Link: https://codepen.io/devi8/pen/JjVqagx/57046326fd092775246b47d5da9c4235

CSS:

.comp__06 {  max-width: 1720px;  display: flex;  flex-direction: column;  padding: 25px;  margin: 1rem auto;  background: #fff;  border: 1px solid #e5e5e5;  box-sizing: border-box;}.comp__06 img {  max-width: 100%;  height: auto;  border-radius: 12px;}.comp__06 .header {  display: flex;  flex-direction: column;  align-items: center;  margin-bottom: 1rem;}.comp__06 .header * {  margin: 0 0 1rem;  padding: 0;}.comp__06 .header h2 {  font-size: 2rem;}.comp__06 .header p {  font-size: 1rem;}.comp__06 .content {  display: flex;  flex-direction: row;  flex-wrap: nowrap;  gap: 25px;}.comp__06 .column {  display: flex;  flex-direction: column;  gap: 25px;  flex: 1 1 auto;}.comp__06 .column .row {  display: flex;  flex-direction: row;  flex-wrap: nowrap;  flex: 1 1 auto;  gap: 25px;  border: 1px solid red;}.comp__06 .content div:nth-child(1) {  max-width: 630px;  order: 1;}.comp__06 .content div:nth-child(2) {  max-width: 630px;  order: 2;}.comp__06 .content div:nth-child(3) {  max-width: 360px;  order: 3;}

HTML

<section class="comp__06"><div class="header"><h2>This is a Featured Section Header</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.</p></div><div class="content"><div class="column"><img src="https://place-hold.it/630x630"></div><div class="column"><img src="https://place-hold.it/630x250"><div class="row"><img src="https://place-hold.it/302x355" width="302" height="355"><img src="https://place-hold.it/302x355" width="302" height="355"></div></div><div class="column"><img src="https://place-hold.it/360x630"></div></div></section>