radio버튼클릭에 따라 하위태그 사라지게 하기

아래예시를 보자.
정보를 제공받으시겠습까 radio버튼 아니요를 클릭하면 아래 소식을 어떻게받으시겠습니까는 아예 사라지게 하고싶다.

아래는 html구조이다

<p><label for="acceptInfo">♣아이티윌부산이 제공하는 정보를 받으시겠습니까?</label></p>
<input type="radio" name="event" id="event-y" checked><label for="event-y">예, 받겠습니다</label><br>
<input type="radio" name="event" id="event-n"><label for="event-n">아니요, 받지않겠습니다.</label><br>
<p id="event-h">
<label for="howToGetInfo">♣정보나 이벤트 소식을 어떻게 받으시겠습니까?</label><br>
<input type="checkbox" name="howToGetInfo" value="email" checked>이메일
<input type="checkbox" name="howToGetInfo" value="text" > 문자
<input type="checkbox" name="howToGetInfo" value="katalk" checked> 카카오톡
<input type="checkbox" name="howToGetInfo" value="mail" > 우편
</p>

아래는 css코드이다

<style>
	#event-y:checked~#event-h {display: block;}
	#event-h {display: none;}
</style>