:root{
    --txt-color : #353535;
    --txt-sub-color : #696969;
    --card-color : #F9FAFB;
    --btn-color : #2960F6;
}

@font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-Bold.woff2) format('woff2');
    font-weight:700;
  }
  @font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-Medium.woff2) format('woff2');
    font-weight:500;
  }
  @font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-Regular.woff2) format('woff2');
    font-weight: 400;
  }
  
  @font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-Light.woff2) format('woff2');
    font-weight: 300;
  }
  
  @font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-ExtraLight.woff2) format('woff2');
    font-weight: 200;
  }

  @font-face{
    font-family: 'Pretendard';
    src: url(../../fonts/anapne/Pretendard-Thin.woff2) format('woff2');
    font-weight: 100;
  }

  .container{
    width: 100%;
    max-width: 1080px;
    padding: 40px 40px 200px;
    box-sizing: border-box;
    margin: 0 auto;
}

.title{
    display: flex;
    align-items: center;
    column-gap: 10px;
    font-size: 2.2rem;
    font-weight: 500;
    margin-bottom: 20px;
}

.title i{display: inline-block; width: 30px; height: 30px; border-radius: 8px;}
.title i img{width: 100%; display: block;}

.card{width: 100%; background-color: #F9FAFB; border-radius: 15px;}

.btn{
    cursor: pointer;
    outline: none;
    display: inline-block;
    -ms-user-select: none;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    user-select: none;
    cursor: pointer;
}

@media(max-width:560px){
  .header-box .top-menu .header-logo img{
    width:140px!important;
  }

  .container{
    padding: 4% 2% 100px;
  }
  footer{
    padding:0!important;
  }
  .profile-name span, .profile-name{
    font-size:14px;
  }
  .header-box{
    padding-bottom:4vh!important;
  }
}