/* ¸ð¹ÙÀÏ ¹ÝÀÀÇü ½ºÅ¸ÀÏ */
@media screen and (max-width: 768px) {
    /* 1. ±âº» ·¹ÀÌ¾Æ¿ô ÃÊ±âÈ­ */
    body {
        padding: 15px !important;
        background: #f5f7fa !important;
    }
    
    #wrapper {
        width: 100% !important;
    }

    /* 2. ¸ÞÀÎ ÄÁÅ×ÀÌ³Ê */
    #findIDPWPage {
        width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        background: none !important; /* ±âÁ¸ ¹è°æ ÀÌ¹ÌÁö Á¦°Å */
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    /* 3. Å¸ÀÌÆ² ¿µ¿ª */
    #findIDPWPage .contentArea {
        float: none !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    #findIDPWPage .objTop {
        width: 100% !important;
        margin-bottom: 15px !important;
        text-align: center;
    }

    #findIDPWPage .objTop h1 img {
        max-width: 80%; /* Å¸ÀÌÆ² ÀÌ¹ÌÁö Å©±â Á¶Àý */
        height: auto;
    }

    /* 4. ¼±ÅÃ ¹Ú½º (¾ÆÀÌµð/ºñ¹ø Ã£±â ¹öÆ°) */
    #findIDPWPage .objContent {
        width: 100% !important;
        height: auto !important;
        padding: 25px 20px !important;
        background: #ffffff !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
        box-sizing: border-box;
        text-align: center;
    }

    #findIDPWPage .objContent ul {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 0;
        margin-bottom: 20px;
    }

    #findIDPWPage .objContent li {
        list-style: none;
        padding: 0 !important;
        background: none !important; /* µµÆ® ÀÌ¹ÌÁö Á¦°Å */
    }

    /* ¸µÅ©¸¦ Å« ¹öÆ° ÇüÅÂ·Î º¯°æ */
    #findIDPWPage .objContent li a {
        display: block;
        padding: 15px;
        background: #79b350; /* Æ÷ÀÎÆ® ÄÃ·¯ */
        color: #fff !important;
        text-decoration: none;
        border-radius: 8px;
        font-size: 16px;
        font-weight: bold;
        transition: background 0.2s;
    }

    #findIDPWPage .objContent li a:active {
        background: #006bb0;
    }

    /* Ãë¼Ò ¹öÆ° */
    #findIDPWPage .objContent img {
        width: 80px;
        height: auto;
        margin-top: 10px;
    }

    /* 5. ÇÏ´Ü ±¤°í/Ä·ÆäÀÎ ÀÌ¹ÌÁö */
    #findIDPWPage > a img {
        width: 100% !important;
        height: auto !important;
        border-radius: 12px;
        box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    }
    
    /* ¼û±è Ã³¸®ÇÒ ¿ä¼Ò (ÇÊ¿ä ½Ã) */
    #wrapper > h1 {
        display: none; /* ÅØ½ºÆ® Á¦¸ñ ¼û±è */
    }
}




/* ¸ð¹ÙÀÏ ´ëÀÀ (È­¸é ³Êºñ 768px ÀÌÇÏ) */
@media screen and (max-width: 768px) {
    /* ÀüÃ¼ ÄÁÅ×ÀÌ³Ê ÃÊ±âÈ­ */
    body { padding: 15px; background: #f8f9fa; }
    
    #wrapper { width: 100% !important; min-width: 100% !important; }

    /* ¾ÆÀÌµð Ã£±â ¿µ¿ª ¹Ú½ºÈ­ */
    #findID {
        width: 100% !important;
        float: none !important;
        background: #fff !important; /* ±âÁ¸ ¹è°æ ÀÌ¹ÌÁö Á¦°Å */
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
        overflow: hidden;
        padding-bottom: 20px;
    }

    /* »ó´Ü Å¸ÀÌÆ² ¹Ù */
    #findID h1 {
        width: 100% !important;
        height: auto !important;
        padding: 20px 0 !important;
        background: linear-gradient(135deg, #72c02c, #3e98d3) !important;
        color: #fff !important;
        text-align: center;
        font-size: 18px !important;
    }

    /* ¾È³» ¹®±¸ */
    #findID .title {
        width: 100% !important;
        padding: 20px 0 !important;
        /* border-bottom: 1px solid #eee; */
        background: none !important;
    }
    #findID .title em {
        width: auto !important;
        background: none !important;
        padding-left: 0 !important;
        font-size: 15px;
        color: #444;
    }

    /* ÀÔ·Â Æû ·¹ÀÌ¾Æ¿ô */
    #findID form {
        width: 95% !important;
        height: auto !important;
        padding: 10px !important;
        background: none !important;
    }

    #findID fieldset {
        width: 100% !important;
        height: auto !important;
        background: none !important;
    }

    /* ÀÔ·Â Ç×¸ñ (ÀÌ¸§, »ý³â¿ùÀÏ) ¼¼·Î Á¤·Ä */
    #findID fieldset p {
        width: 100% !important;
        margin: 0 0 20px 0 !important;
        display: flex;
        /* flex-direction: column; */
        justify-content: center;
        align-items: center;
    }

    #findID fieldset label {
        width: 100% !important;
        float: none !important;
        margin-bottom: 8px !important;
        background: none !important;
        padding-left: 2px !important;
        font-weight: bold;
        color: #666;
        flex:1;
    }

    /* input ¹× select ½ºÅ¸ÀÏ ¾÷±×·¹ÀÌµå */
    #findID input[type="text"], 
    #findID select {
        width: 95% !important;
        height: 48px !important;
        border: 1px solid #ddd !important;
        border-radius: 6px !important;
        font-size: 16px !important; /* ¸ð¹ÙÀÏ ÁÜ ¹æÁö¿ë Å©±â */
        padding: 0 10px !important;
        box-sizing: border-box;
        flex: 4;
    }

    /* »ý³â¿ùÀÏ ¼¿·ºÆ®¹Ú½º °¡·Î ¹èÄ¡ */
    #findID p#birth {
        flex-direction: row !important;
        flex-wrap: wrap;
        gap: 5px;
        align-items: center;
    }
    #findID p#birth label { width: 100% !important; }
    #findID p#birth select { flex: 1; min-width: 0; }

    /* È®ÀÎ ¹öÆ° Áß¾Ó Á¤·Ä ¹× Å©±â ÃÖÀûÈ­ */
    #findID .commit {
        width: 20% !important;
        max-width: 200px;
        margin: 20px auto 0 !important;
        display: block !important;
    }
    
    /* ºÒÇÊ¿äÇÑ ¿ä¼Ò ¼û±â±â */
    hr { display: none; }
}



/* /ewut_new/?act=school_id_pass.id_find_post */
/* ¸ð¹ÙÀÏ ´ëÀÀ (È­¸é ³Êºñ 768px ÀÌÇÏ) */
@media screen and (max-width: 768px) {
    /* ÀüÃ¼ ÄÁÅ×ÀÌ³Ê ÇØÁ¦ */
    body { padding: 10px !important; background: #f4f7f9 !important; }
    #wrapper { width: 100% !important; min-width: 100% !important; }

    /* °á°ú ¹Ú½º ¿µ¿ª */
    #findIDResult {
        width: 100% !important;
        float: none !important;
    }

    #findIDResult .boxWrap {
        width: 100% !important;
        float: none !important;
        background: #fff !important; /* °íÁ¤ ¹è°æÀÌ¹ÌÁö Á¦°Å */
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        overflow: hidden;
    }

    /* »ó´Ü Å¸ÀÌÆ² ¹Ù */
    #findIDResult .objTop { background: #0078b5 !important; }
    #findIDResult h1 {
        width: 100% !important;
        height: auto !important;
        padding: 15px 0 !important;
        color: #fff !important;
        background: none !important;
        text-align: center !important;
        font-size: 16px !important;
    }

    /* ÄÜÅÙÃ÷ ¿µ¿ª */
    #findIDResult .objContent {
        width: 100% !important;
        padding: 20px !important;
        float: none !important;
        background: none !important;
        box-sizing: border-box;
    }

    /* ÀÌ¸§ ¾È³» ¹®±¸ */
    #findIDResult .title {
        width: 100% !important;
        height: auto !important;
        padding-bottom: 15px !important;
        border-bottom: 1px solid #eee;
        background: none !important;
        text-align: center;
    }
    #findIDResult .title em {
        width: 100% !important;
        background: none !important;
        padding-left: 0 !important;
        font-size: 15px;
        color: #333;
    }
    #findIDResult .title em span { color: #76b729; font-weight: bold; }

    /* ¾ÆÀÌµð ¸®½ºÆ® (¶óµð¿À ¹öÆ° ¿µ¿ª) */
    #findIDResult ul {
        width: 100% !important;
        margin: 20px 0 !important;
        padding: 0 !important;
        float: none !important;
    }
    #findIDResult ul li {
        background: #f9f9f9 !important;
        border: 1px solid #e1e1e1 !important;
        border-radius: 8px;
        margin-bottom: 10px !important;
        padding: 12px !important;
        text-align: left !important;
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    #findIDResult ul li:has(input:checked) {
        border-color: #0078b5 !important;
        background: #eef7ff !important;
    }
    #findIDResult ul li input[type="radio"] {
        margin-right: 10px;
        width: 18px;
        height: 18px;
    }
    #findIDResult ul li label {
        font-size: 16px;
        color: #444;
        font-weight: bold;
        flex: 1;
    }

    /* ÇÏ´Ü ¹öÆ° ¿µ¿ª */
    #findIDResult .buttonArea {
        margin-top: 25px !important;
        display: flex !important;
        justify-content: center;
        gap: 50px;
    }
    #findIDResult .buttonArea img {
        width: auto !important;
        max-width: 140px; /* ¹öÆ° Å©±â ÀûÁ¤È­ */
        height: auto !important;
        margin-right: 0 !important;
    }
    
    hr { display: none; }
}
