index.html

<!DOCTYPE html>
<html>
<head>
  <title>Paradise Park</title>
  <meta charset="utf-8">
  <link rel="stylesheet" href="css/styles.css">
  <link href="https://fonts.googleapis.com/earlyaccess/notosanskr.css" rel="stylesheet">
</head>
<body>
  <div id="side-navbar">
     <img class="logo" src="images/logo.png">
     <ul>
         <a href="#">
            <li>HOME</li>
         </a>
         <a href="#">
            <li>EVENT</li>
         </a>
         <a href="#">
            <li>TICKET</li>
         </a>
         <a href="#">
            <li>MEMBERSHIP</li>
         </a>
         <a href="#">
            <li>NOTICE</li>
         </a>   
     </ul>
     <div id="sns">
        <a href="#">
            <img class="facebook" src="images/fb.png">
        </a>
        <a href="#">
            <img class="twitter" src="images/twitter.png">
        </a>
     </div>
  </div>

  <div id="main">
    <div class="hero-header">
      <div class="info">
        <h1>Welcome to Paradise Park!</h1>
        <a href="#">Learn More</a>
      </div>
    </div>
  </div>
</body>
</html>

css/styles.css

body {
   margin: 0;
   min-width: 768px;
   font-family: 'Noto Sans KR', sans-serif;
 }
 
 a {
    text-decoration: none;
 }
 #side-navbar {
   background-color: black;
   height: 100%;
   width: 250px;
   position: fixed;
 }
 .logo {
    display: block;
    width: 150px;
    margin: 30px auto 50px auto;
 }

 ul {
    padding-left: 22px;
 }
 li {
   margin: 0 0 30px 0;
   color: white;
   list-style: none;
 }
 li:last-child {
    margin-bottom: 60px;
 }  
 #sns {
    text-align: center;
 }
 .facebook {
    margin-right: 13px;
    width: 25px;
 }
 .twitter {
    width: 25px;
 }
 
 #main {
   margin-left: 250px;
 }
 
 #main .hero-header {
   text-align: center;
   background-image: url("../images/hero_header.jpg");
   background-size: cover;
   background-position: center center;
   height: 750px;
   line-height: 750px;
 }
 
 #main .info {
   display: inline-block;
   line-height: normal;
   vertical-align: middle;
 }
 
 #main h1 {
   margin: 0;
   margin-bottom: 40px;
   color: white;
   font-size: 38px;
 }
 
 #main a {
   padding: 10px 40px;
   border: 2px solid white;
   font-size: 18px;
   color: white;
   text-decoration: none;
 }

안녕하세요.

ul 태그 자식 중 마지막 li태그만 margin-bottom을 60px로 설정하고

실행해보면 li태그 전체에 margin-bottom이 60px로 설정됩니다..

li:last-child 설정이 안 먹히는 건가요..?

특정 li 태그에 class를 부여해야만 적용이 되네요..