body
{
    font-family: 'Segoe UI', sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    text-align: center;
}

.upper_section
{
    /* Flexbox 활성화 */
    display: flex;

    /* 자식 요소들을 세로로 쌓음 */
    flex-direction: column;

    /* 세로 중앙 정렬 */
    justify-content: center;

    /* 가로 중앙 정렬 */
    align-items: center;

    /* section의 높이를 화면 전체 높이로 설정 */
    height: 80vh;
}

.lower_section
{
    /* Flexbox 활성화 */
    display: flex;

    /* 자식 요소들을 세로로 쌓음 */
    flex-direction: column;

    /* 세로 중앙 정렬 */
    justify-content: center;

    /* 가로 중앙 정렬 */
    align-items: center;

    /* section의 높이를 화면 전체 높이로 설정 */
    height: 20vh;
}

/* 검색창과 버튼을 감싸는 컨테이너에 Flexbox 적용 */
.search_section 
{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px; /* input과 button 사이의 간격 (오른쪽 버튼이므로 이 값은 필요 없을 수 있음) */
    width: 100%;
    position: relative; /* input과 button을 배치하기 위해 relative 설정 */
    max-width: 500px; /* .searching 컨테이너의 최대 너비 설정 (선택 사항) */
}

.link_section
{
    position: fixed; /* 화면에 고정 */
    bottom: 40px;    /* 화면 아래로부터 20px 위 */
    right: 40px;      /* 화면 왼쪽으로부터 20px 오른쪽 */
    z-index: 1000;   /* 다른 요소 위에 오도록 z-index 설정 */
    display: flex;   /* 아이콘들을 정렬하기 위해 flexbox 사용 */
    flex-direction: column; /* 세로로 정렬 */
    gap: 15px;       /* 아이콘 사이의 간격 */
    align-items: flex-start; /* 아이콘을 왼쪽 정렬 */
}