/* from data */
.left {
    font-family: "굴림";
    font-size: 10pt;
    font-weight: normal;
    color: #666666;
    text-decoration: none;
}
a:active {
    font-family: "굴림";
    font-size: 10pt;
    color: #666666;
    text-decoration: none;
}
a:hover {
    font-family: "굴림";
    font-size: 10pt;
    color: #FFFFFF;
    text-decoration: none;
}

/* from index */
.m_1ain {
    font-family: "굴림";
    font-size: 10pt;
    font-weight: normal;
    color: #666666;
    text-decoration: none;
}

/* from html */
.scroll {
    font-family: "굴림";
    font-size: 9pt;
    font-weight: normal;
    color: #666666;
    text-decoration: none;
    text-align: left;
}

.scroll_1 {
    font-family: "굴림";
    font-size: 10pt;
    font-weight: normal;
    color: #CC9999;
    text-decoration: none;
}

.main {
    font-family: "굴림";
    font-size: 10pt;
    font-weight: normal;
    color: #666666;
    text-decoration: none;
}

.top {
    font-family: "굴림";
    font-size: 10pt;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
}

.txt1 {
    font-size: 9pt;
    font-family: 돋움;
    text-align: center;
}

/* Container alignment fix */
.side-menu {
    width: 135px;
    border-top: 1px solid #000000; /* Restored top black line */
    border-right: 1px solid #cccccc; /* Matches vertical gray line */
    box-sizing: border-box;
    overflow: hidden; /* Keeps the hover effect contained */
}

    .side-menu ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .side-menu li a {
        display: flex;
        align-items: center;
        height: 38px; /* Slightly taller for a premium feel */
        padding: 0 12px;
        text-decoration: none;
        color: #666666;
        font-size: 13px; /* Slightly larger for 2026 standards */
        background-color: #ffffff;
        border-bottom: 1px solid #f2f2f2;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* Smoother animation */
        position: relative;
    }

        /* The Animated Dot/Bullet */
        .side-menu li a::before {
            content: "•";
            color: #cbd5e0;
            margin-right: 8px;
            font-size: 18px;
            transition: color 0.3s, transform 0.3s;
        }

        /* Modern Hover State */
        .side-menu li a:hover {
            background-color: #f8fbff; /* Very soft blue tint */
            color: #5ba3d3; /* Logo Light Blue */
            padding-left: 18px; /* Soft "slide-in" effect */
            /* MODERN GLOW: Subtle text shadow that makes it look like it's lit up */
            text-shadow: 0px 0px 8px rgba(91, 163, 211, 0.3);
        }

        /* The Animated Arrow (appears on hover) */
        .side-menu li a::after {
            content: "›"; /* Elegant thin arrow */
            position: absolute;
            right: -10px; /* Start hidden to the right */
            opacity: 0;
            font-size: 18px;
            color: #5ba3d3;
            transition: all 0.3s ease;
        }

        .side-menu li a:hover::after {
            right: 12px; /* Slides into view */
            opacity: 1;
        }

        /* The Dot glows and scales up slightly on hover */
        .side-menu li a:hover::before {
            color: #5ba3d3;
            transform: scale(1.2);
        }

.site-footer {
    border-top: 1px solid #d1d7dc;
    border-bottom: none !important;
    font-family: "Malgun Gothic", sans-serif;
    font-size: 11px;
    color: #888888;
    text-align: center;
    padding: 20px 0;
    background-color: #ffffff;
    margin: 0;
    display: block; /* Forces the element to respect padding exactly */
    width: 100%;
    /*
        The thickness is likely caused by the 780px table wrapping a 100% table that has its own borders, or a "ghost" pixel from the colspan. 
        In older HTML rendering, colspan values that don't perfectly match the grid can cause the browser to "double-draw" the border to fill the gap.
        To fix this once and for all, we will use a negative margin trick in your CSS and simplify the colspan.
        This prevents the "ghost" pixel at the bottom
    */
        margin-bottom: -1px;
}
    /* Optional: Subtle hover effect for the company name */
    .site-footer:hover {
        color: #555555;
        transition: color 0.3s ease;
    }