css 질문좀드리겠습니다. 채택완료

답변주셔서 감사합니다.
아래와같이 적용시에는 또 안되는데 어떤문제가 있을까요 ㅠㅠ?

<style>
#check-box { display: none; }
#check-box:checked + .check-meun { display: block; }
.check-meun {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba( 1, 1, 1, 0.5 );
z-index: 999;
}
.check-co {
z-index: 999;
padding: 60px 0 100px;
left: 0;
top: 0;
width: 100%;
height: 430px;
background-color: #fff;
}

.block2 {border:2px solid #d81f25; padding:0 5px; height:20px; overflow:hidden; background:#fff; width:100px; font-family:Gulim; font-size:12px;}
.block2 ul, .block2 li {margin:0; padding:0; list-style:none;}
.block2 li a {display:block; height:20px; line-height:20px; color:#555; text-decoration:none;}
.block2 li span {padding:2px 5px; background:#d81f25; color:#fff; font-weight:bold; margin-right:3px;}

</style>


<div class="block2">
<ul id="ticker1">
<li><span>1</span>
<input id="check-box" type="checkbox" />
<label for="check-box"> 111 </label>
</li>
<li><a href="#"><span>2</span> 손연재</a></li>
<li><a href="#"><span>3</span> 유아니</a></li>
<li><a href="#"><span>4</span> 차승원</a></li>
<li><a href="#"><span>5</span> 전지현</a></li>
<li><a href="#"><span>6</span> 유이</a></li>
<li><a href="#"><span>7</span> 손연재</a></li>
<li><a href="#"><span>8</span> 손연재</a></li>
<li><a href="#"><span>9</span> 손연재</a></li>
</ul>
</div>

<div class="check-meun">
<div class="check-co">
sadsadsadasd
</div>
</div>

<script>
$(function() { var ticker = function() { setTimeout(function(){ $('#ticker1 li:first').animate( {marginTop: '-20px'}, 400, function() { $(this).detach().appendTo('ul#ticker1').removeAttr('style'); }); ticker(); }, 5000); }; ticker(); });
</script>

잘 실행 되는데요.