#footer{
    width: 100%;
    background-color: #fff;
}

.f01,
.f02{
    width: 100%;
    border-top: 1px solid #d7d7d7;
}

.f01{
    padding: 50px 0 50px;
}

.f01 ul{
    padding: 0 30px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

.f01 ul li p{
    font-size: 16px;
    margin-bottom: 20px;
    font-family: 'Pretendard-Bold', sans-serif;
}

.f01 ul li span{
    font-size: 14px;
    font-family: 'Pretendard-Light', sans-serif;
    display: block;
    line-height: 25px;
}

.f02{
    padding: 20px 0;
    text-align: center;
    font-size: 14px;
    color: #777;
    font-family: 'Pretendard-Medium', sans-serif;
}
























/* mobile */
@media screen and (max-width: 767px){

  #footer{
      /* height: 40vh; */
      /* position: relative; */
  }

  .f02{
      border-top: 0;
  }

  .f01{
      padding: 10px 0 10px;
  }

  .f01 ul{
      display: block;
      padding: 0 20px;
  }

  .f01 ul li{
      margin-bottom: 15px;
  }

  .f01 ul li:last-child{
      margin-bottom: 0;
  }

  .f01 ul li p{
      font-size: 12px;
      margin-bottom: 10px;
  }

  .f01 ul li span{
      font-size: 10px;
      line-height: 14px;
  }

  .f02{
      padding: 0 0 10px;
      font-size: 10px;
      /* position: absolute; */
      bottom: 0;
      left: 0;
  }

}























/* tablet */
@media screen and (min-width: 768px) and (max-width: 1024px){

  #footer{
      /* height: 15vh; */
      /* position: relative; */
  }

  .f02{
      /* border-top: 0; */
  }

  .f01{
      padding: 40px 0;
  }

  .f01 ul{
      padding: 0 20px;
  }

  .f01 ul li:last-child{
      margin-bottom: 0;
  }

  .f01 ul li p{
      font-size: 14px;
      margin-bottom: 10px;
  }

  .f01 ul li span{
      font-size: 12px;
      line-height: 20px;
  }

  .f02{
      padding: 10px 0;
      font-size: 10px;
      /* position: absolute; */
      bottom: 0;
      left: 0;
  }

}