CSS: margem superior quando os pais não têm fronteira

Como você pode ver emesta imagemEu tenho uma laranjadiv dentro de um verdediv sem borda superior. A laranjadiv tem um30px margem superior, mas também está empurrando o verdediv baixa. Claro, adicionar uma borda superior corrigirá o problema, mas eu preciso do verdediv para ser top sem fronteiras. O que eu poderia fazer?

.body {
	border: 1px solid black;
	border-top: none;
	border-bottom: none;
	width: 120px;
	height: 112px;
	background-color: lightgreen;
}

.body .container {
	background-color: orange;
	height: 50px;
	width: 50%;
	margin-top: 30px;
}
<div class="header">Top</div>
<div class="body">
	<div class="container">Box</div>
</div>
<div class="foot">Bottom</div>

obrigado

questionAnswers(7)

yourAnswerToTheQuestion