body {
    margin: 0;
  }
  a {
    color: black;
    text-decoration: none;
    
  }
  h1 {
    font-size: 45px;
    text-align: center;
    border-bottom: 1px solid red;
    margin: 0;
    padding: 10px;
  }
  ol{
    border-right: 1px solid red;
    width:100px;
    margin:0;
    padding:20pxl
  }
  #grid {
    display: grid;
    grid-template-columns: 150px 2fr;
  }
  #grid ol{
    padding: 25px;
  }
  #grid #content{
    padding: 25px;
  }
  #extra-content {
   display: none;
   background-color: lightblue;
   padding: 20px;
   margin-top: 20px;
   text-align: center;
  }
  @media(min-width:1000px){
   #extra-content{
     display: block;
   }
  }

/* Pretendard 폰트 설정 */
@font-face {
  font-family: 'Pretendard-Regular';
  src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Pretendard-ExtraBold';
  src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Pretendard-SemiBold';
  src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Pretendard-Medium';
  src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}

body {
  font-family: 'Pretendard-Medium', sans-serif;
}