* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}
/*
list-style: none; 
text-decoration: none; 
*/

body {
    font-family: 'Noto Sans KR', sans-serif;
    color: #333;
    line-height: 1.5;
}

.container {
    width: 100%;          /* 좁은 화면에서는 화면 폭에 맞춤 */
    max-width: 1200px;    /* 화면이 넓을 때만 1200px 고정 */
    margin: 0 auto;       /* 중앙 정렬 */
    padding: 0 20px;      /* 모바일 양옆 최소 여백 */
}
/* 헤더 메뉴, 로고, 푸터 텍스트 등 찌그러지면 안 되는 요소들 */
.logo, .nav-menu li {
    white-space: nowrap; /* 글자가 세로로 자동 줄바꿈되는 현상 방지 */
    flex-shrink: 0;      /* Flexbox 안에서 요소 폭이 찌그러지는 것을 방지 */
}

.area1 {
    padding: 80px 0 80px 0;
}
.top-btn {
    position: fixed;
    right: 30px;
    bottom: 30px;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: none;
    border-radius: 50%;

    background-color: #0d6efd;
    color: #fff;

    cursor: pointer;

    z-index: 9999;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

    transition:
        background-color 0.3s ease,
        transform 0.3s ease;
}

.top-btn:hover {
    background-color: #0b5ed7;
    transform: translateY(-2px);
}

.top-btn i {
    font-size: 20px;
}