/*container*/
body {
  margin: 0 15px;
}
.container {
  margin: 0 auto;
  max-width: 800px;
  text-align: left;
  padding: 50px 0 150px;
}
.menu {
  display: flex;
  flex-wrap: wrap; /* 2줄로 감싸기 위해 flex-wrap 사용 */
  gap: 5px; /* 항목 간 간격 */
  justify-content: space-between; /* 항목들을 좌우로 배치 */
}
.menu-item {
  text-align: left;
  transition: all 400ms ease-out;
  margin: 10px 0;
  display: flex;
  flex-direction: column; /* 항목 내부를 세로로 배치 */
  width: calc(50% - 5px); /* 화면의 50% 너비에 해당하는 크기, 간격 고려 */
  text-decoration: none; /* 링크의 기본 스타일 제거 */
  padding: 0px; /* 항목 내부 여백 */
  box-sizing: border-box; /* padding 포함해서 크기 계산 */
}
.name {
  font-size: 10px;
  padding: 12px 20px;
  margin: -1px 0 0;
  line-height: 1.4;
  overflow: hidden;
  color: var(--bg);
  border: 1px solid var(--bg);
}
.name span {
  font-family: 'Pretendard-Medium';
  font-weight: 400;
}
.menu div div:nth-child(2) {
  background: rgba(46, 44, 98, 0.5);
  border-bottom: 5px solid var(--bg);
  text-align: right;
}

/*pc*/
@media screen and (min-width:698px) {

}

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

.title {
  zoom: 0.8;
}
.menu-item {
    width: 100%; /* 1줄로 표시되도록 너비 100%로 설정 */
  }
  
}