:root {
    --bg-color: #ffffff;
    --text-color: #000000;
    --border-color: #ccc;
    --content-border-color: #ccc;
    --result-bg: #f9f9f9;
    --input-bg: #ffffff;
    --title-color:#003580;  
}

.dark-mode {
    --bg-color: #181818;
    --text-color: #e4e5e7;
    --border-color: #2c2d31;
    --content-border-color: #181818;
    --result-bg: #25262b;
    --input-bg: #2c2d31;
    --title-color:#1E90FF;
}


body {
    background-color: #1d263a;
    font-family: 'Arial', sans-serif;
}

.contents {
    max-width: 1000px;
    margin: 30px auto;
    padding: 20px;
    background-color: var(--bg-color);
    border: 1px solid var(--content-border-color);
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow: hidden; /* 테이블 외 다른 콘텐츠도 오버플로 방지 */
}



.title {
    font-size: 1.8rem;
    margin-top: 10px;
    margin-bottom: 30px;
    text-align: center;
    color: var(--title-color);
    margin-bottom: 20px;
}