/* 1. 웹폰트 가져오기 (본문용 깔끔한 고딕) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&family=Roboto:wght@400;700&display=swap');

/* 2. 전체 기본 설정 (본문) */
body {
    font-family: 'Roboto', 'Noto Sans KR', sans-serif;
    
    background-color: #ffffff;
    color: #000000;
    line-height: 1.6;
    margin: 0;
    padding: 20px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    
    /* 내용을 중앙으로 모아줌 */
    max-width: 800px;
    margin: 0 auto;
}

main {
    flex: 1;
    margin-bottom: 4rem;
}

header {
    margin-bottom: 0.7rem;
}

/* footer */
footer {
    font-size: 0.75rem;
    padding: 2rem;
}

h1{
    font-size: 1.5rem;
}

h2{
    font-size: 1.3rem;
}

/* 3. 제목 전용 스타일 (버크셔 해서웨이 느낌) */
b {
    font-family: 'Times New Roman', 'Noto Sans KR', Times, serif;
    color: #2d2dca;
}


/* 링크 스타일 */
a { color: rgb(0, 0, 190); text-decoration:none;}
a:hover { color: rgb(120, 120, 190);}

hr {
    height: 2px; /* Sets the thickness to 5 pixels */
    background-color: lightgray; /* Optional: sets the color */
    border: none; /* Removes default browser borders for a cleaner look */
}


/* div box container-box model*/
.container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
}

.box {
    width: 250px;
    padding:15px;
    box-sizing: border-box;
    background-color: #f5f5f5;
    border-radius: 15px;
    font-size: small;
}

/* 언어 전환 버튼 영역 */
.lang-switch {
    text-align: right;
    margin-bottom: 20px;
    font-size: 14px;
    height: 20px; /* 버튼이 바뀌어도 높이가 흔들리지 않게 고정 */
}

/* 버튼 스타일 */
.lang-btn {
    cursor: pointer;
    font-weight: bold; /* 버튼 하나만 보이니까 잘 보이게 굵게 */
}

.lang-btn:hover {
    color: blue; /* 마우스 올린 색 */
}

/* 초기 상태: 한국어 숨김 */
.ko { display: none; }


nav ul{
    display: flex;              /* 메뉴들을 가로로 나열 */
    gap: 0.7rem 5rem;                  /* 메뉴 사이 간격 */
    list-style: none;           /* 점(bullet) 제거 */
    margin: 0;
    padding: 0;
    background-color: #f5f5f5;
    justify-content: center;
    flex-wrap: wrap;
}

nav a {
    text-decoration: none;      /* 밑줄 제거 */
    color: black;             /* 기본은 살짝 회색 (덜 강조) */
    font-size: 1rem;
    font-weight: 900;
}

nav a:hover {
    text-decoration: none;      /* 밑줄 제거 */
    color: gray;             /* 기본은 살짝 회색 (덜 강조) */
    font-size: 1rem;
}