@charset "utf-8";
/* ------ 모달창 관련 modalArea------ */
/*영역관련*/
section.modalArea{
    position:fixed;width:100%;height:100vh;top:0;left:0;z-index:10;}
section.modalArea div.blackBg{
    content:"";display:block;position:absolute;top:0;left:0;
    width:100%;height:100%;background-color:rgba(0,0,0,0.6);
    cursor:pointer;}

section.modal{
    position:relative;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;
    border-radius:5px;background-color:#fff;
    left:50%;top:50%;transform:translate(-50%,-50%);
    box-shadow:0px 0px 15px rgba(0,0,0,0.5);
    width:1000px;/* max-height:80vh; */}
section.modal2{
    position:relative;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;
    border-radius:5px;background-color:#fff;
    left:50%;top:50%;transform:translate(-50%,-50%);
    box-shadow:0px 0px 15px rgba(0,0,0,0.5);
    width:800px;}
section.modal>article,section.modal2>article{position:relative;box-sizing:border-box;width:100%;}

/*모달창 제목*/
article.modalTitle{background-color:#2a3c58;color:#fff;font-weight:bold;padding:0.5rem 1rem;}
article.modalTitle span.icon{
    position:absolute;width:1.5rem;height:1.5rem;top:50%;right:0;display:block;cursor:pointer;
    transform:translate(-50%,-50%);}

/*모달창 내용*/
article.modalContent{background-color:#fff;padding:1rem;}
div.modalText{position:relative;font-size:0.875rem;margin-bottom:2rem;}
    /*공통*/
    /*테이블*/
    table.mdWrite{
        position:relative;width:100%;box-sizing:border-box;border:1px solid #d4d9e0;
        margin-top:1rem;}
    table.mdWrite td{
        position:relative;box-sizing:border-box;vertical-align:middle;
        padding:1rem 2rem;}
    table.mdWrite td:nth-child(1){background-color:#f0f1f5;width:10rem;padding:1rem 0;text-align:center;font-weight:bold;color:#7b7b7b;font-size:0.875rem;}

    table.mdWrite ul.mdChoice{position:relative;width:100%;overflow:hidden;min-height:24px;}
    table.mdWrite ul.mdChoice li{position:relative; display:inline-block;}

    table.mdWrite span.icon{
        position:relative;display:inline-block;width:1rem;height:1rem;margin:0 1rem 0 0.2rem;transform:translateY(13%);cursor:pointer;}
    
    /*등록(적용) 버튼*/
    section.modalSubmitArea{position:relative;width:100%;text-align:right;}
    button.modalSubmit{
        position:relative;display:inline-block;margin:2rem auto 0 auto;
        border-radius:2px;border:none;
        padding:0.5rem 5rem;
        background-color:#0073cc;
        text-align:center;font-size:1rem;font-weight:bold;color:#fff;
        cursor:pointer;}
    /*(채용정보검색) ---- 지역찾기 ---- */
    article.modalContent ul.mdLct{
        position:relative;width:100%;box-sizing:border-box;
        border:1px solid #d4d9e0;
        display:flex;display:-webkit-flex;}
    article.modalContent ul.mdLct li{
        position:relative;box-sizing:border-box;
        border-left:1px solid #d4d9e0;
        width:calc(100% / 17); padding:1rem 0;
        text-align:center; font-weight:bold; color:#7b7b7b;
        background-color:#f0f1f5;
        cursor:pointer;}
    article.modalContent ul.mdLct li:nth-child(1){border-left:none;}
    article.modalContent ul.mdLct li.on{background-color:#fff;color:#0073cc;}
    article.modalContent ul.mdLct li.on:before{
        content:"";display:block;position:absolute;bottom:-2px;left:0;
        width:100%;height:2px;background-color:#fff;}
    article.modalContent ul.mdLct li.on:after{
        content:""; display:block;position:absolute;top:0;left:0;
        width:100%;height:2px;background-color:#0073cc;}

    section.mdLctList{
        position:relative;box-sizing:border-box;padding:2.625rem 2rem;
        border:1px solid #d4d9e0;border-top:none;}
    section.mdLctList article{position:relative;width:100%;box-sizing:border-box;}
    section.mdLctList label{
        position:relative;display:inline-block;margin-bottom:0.5rem;
        width:calc(25% - 6px);}
    
    /*(채용정보검색) ---- 직종찾기 ---- */
    div.mdJobSch{position:relative;box-sizing:border-box;padding:0.5rem 1rem;background-color:#f0f1f5;margin-bottom:1rem;}

    section.mdJobList,section.mdMajorList,section.mdLicenseList{
        position:relative;width:100%;box-sizing:border-box;
        display:flex;display:-webkit-flex;justify-content:space-between;}
    section.mdJobList>article, section.mdMajorList>article{
        position:relative;box-sizing:border-box;overflow-x:hidden;
        overflow-y:auto;
        width:calc((100% / 3) - 1rem);
        height:300px;
        border:1px solid #d4d9e0;}
	section.mdLicenseList>article {
        position:relative;box-sizing:border-box;overflow-x:hidden;
        overflow-y:auto;
        width:calc((100% / 2) - 1rem);
        height:300px;
        border:1px solid #d4d9e0;}

    section.mdJobList>article>div:nth-child(1),
    section.mdMajorList>article>div:nth-child(1),
    section.mdLicenseList>article>div:nth-child(1){
        position:relative;width:100%;box-sizing:border-box;padding:0.5rem 0;
        font-size:0.875rem; font-weight:bold;color:#fff;
        background-color:#a8a8a8;
        text-align:center;}

    section.mdJobList>article:nth-child(2)>div:nth-child(1),
    section.mdMajorList>article:nth-child(2)>div:nth-child(1),
    section.mdLicenseList>article:nth-child(2)>div:nth-child(1){
        background-color:#7b7b7b;}
    section.mdJobList>article:nth-child(3)>div:nth-child(1),
    section.mdMajorList>article:nth-child(3)>div:nth-child(1){
        background-color:#2a3c58;}
    
    ul.mdJobCtg,ul.mdMajorCtg,ul.mdMajorCtg{position:relative;width:100%;box-sizing:border-box;}
    ul.mdJobCtg li, ul.mdMajorCtg li{position:relative;width:100%;box-sizing:border-box;padding:1rem;font-size:0.875rem;cursor:pointer;}

    ul.mdJobCtg li:hover,ul.mdJobCtg li:focus,ul.mdJobCtg li.on,
    ul.mdMajorCtg li:hover,ul.mdMajorCtg li:focus,ul.mdMajorCtg li.on{
        background-color:#f0f1f5;}


    /* 해제 */
    section.modalLocation{display:none;} /*안보이게*/
    section.modalJob{display:none;}
    section.modalMajor{display:none;}
	section.modalLicense{display:none;}
    
    
/* ------------------------------------ 미디어 쿼리(1) ------------------------------------ */
@media all and (max-width:1400px){
/*영역관련*/
section.modal{width:90%;}
}/*미디어쿼리1400이하*/

/* ------------------------------------ 미디어 쿼리(2) ------------------------------------ */
@media all and (max-width:900px){
/*모달창 내용*/
/*(채용정보검색) ---- 지역찾기 ---- */
article.modalContent ul.mdLct{flex-wrap:wrap;}
article.modalContent ul.mdLct li{width:calc(100% / 8);border-bottom:1px solid #d4d9e0;}
article.modalContent ul.mdLct li:last-child{border-bottom:none;border-right:1px solid #d4d9e0;}
section.mdLctList label{width:calc((100% / 3) - 6px);}
}/*미디어쿼리900이하*/

/* ------------------------------------ 미디어 쿼리(3) ------------------------------------ */
@media all and (max-width:600px){
/*모달창 내용*/
/*(채용정보검색) ---- 지역찾기 ---- */
article.modalContent ul.mdLct li{width:calc(100% / 4);}
section.mdLctList label{width:calc(50% - 6px);}
}/*미디어쿼리600이하*/