.body {
    min-width:320px;
    max-width:900px;
    padding:0 5px 50px 5px;
    margin:0;
}

.container {
    display: flex;
    justify-content: space-between; /* 자식 요소 간의 균등한 간격을 유지 */
    padding: 0 10px; /* 부모 요소 좌우 여백 */
}

.menu { 
    color: orange;
    display: inline-block;
    border: 1px solid #333;
    border-radius: 5px;
    padding:5px 10px 0 10px;
    text-align: center;
    cursor:pointer;
    white-space: nowrap;      /* 텍스트 줄바꿈 방지 */
    overflow: hidden;         /* 넘치는 부분 숨김 */
    flex: 1; /* 각 자식 요소가 동일한 비율로 넓이 차지 */
    margin: 5px; /* 자식 요소 간의 간격 조정 */
    padding: 0;
}
.menu:hover {
    border-color:transparent;
    font-size: 1.4em;
    font-family: serif;
    padding: 0 20px 0 20px;
}

.no-wrap {
    white-space: nowrap;      /* 텍스트 줄바꿈 방지 */
    overflow: hidden;         /* 넘치는 부분 숨김 */
    text-overflow: ellipsis;  /* 넘치는 부분 ... 표시 */
}

.two-line-ellipsis {
    display: -webkit-box;        /* Flexbox 레이아웃으로 설정 */
    -webkit-box-orient: vertical;/* Flex 방향을 세로로 설정 */
    overflow: hidden;            /* 넘치는 부분 숨김 */
    text-overflow: ellipsis;     /* 넘치는 부분 ... 표시 */
    white-space: normal;         /* 여러 줄 표시를 위해 줄 바꿈 허용 */
}

  
h2 {
    margin-left: 5px;
}

.blinking-text {
    animation: blink 1s infinite; /* 1초 간격으로 반복 */
}

@keyframes blink {
    0%, 50% {
      opacity: 1; /* 보이게 설정 */
    }
    50%, 100% {
      opacity: 0; /* 숨김 */
    }
}