@charset "utf-8";

/*공통*/
.aidxC *{box-sizing:border-box;}

/*탭메뉴*/
.c-tab01 ~ .aidxC:has(.c-tit01){padding-top: 80px }




/*프로그램 신청*/
/* 검색 - searchCont_wrap */
.searchCont_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #F5F5F5;
    padding: 25px 35px;
    border-radius: 15px;
    box-sizing: border-box;
    margin-bottom: 20px;
    }
    
    .searchInfo {
    display: flex;
    align-items: center;
    font-size: 17px;
    font-weight: 700;
    color: #333;
    }
    
    .searchInfo .label::after {
    content: '';
    display: inline-block;
    width: 1px;
    height: 14px;
    background-color: #ddd;
    margin: 0 15px;
    }
    
    .searchInfo .count {
    color: #465DAC;
    font-style: normal;
    }
    
    .searchForm {
    display: flex;
    }
    
    .searchSelect,
    .searchInput {
    height: 35px;
    padding: 0 12px 0 8px;
    background-color: #fff;
    font-size: 14px;
    color: #333;
    box-sizing: border-box;
    vertical-align: middle;
    border: none;
    }
    
    .searchSelect {
    width: 95px;
    cursor: pointer;
    margin-right: 5px;
    min-width: auto;
    }
    
    .searchInput {
    width: 180px;
    margin-right: 8px;
    }
    
    .searchBtn {
    height: 35px;
    background-color: #fff;
    border: 1px solid #333;
    padding: 5px 14px;
    border-radius: 3px;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    color: #333;
    transition: all 0.2s;
    }
    
    .searchBtn:hover {
    background: #333;
    color: #fff;
    }
    
    
    /* 안내 박스 - topGuide */
    .topGuide_wrap {
    border: 1px solid #04816C;
    border-radius: 15px;
    padding: 50px 50px 35px;
    margin-bottom:40px;
    }
    
    .guideTitle {
    font-size: 24px;
    font-weight: 700;
    color: #04816C;
    margin-bottom: 20px;
    font-family: 'paperoz';
    }
    
    .guideTxt {
    font-size: 17px;
    line-height: 1.6;
    color: #555;
    word-break: keep-all;
    margin-bottom: 15px
    }
    
    .guideList .listItem {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
    font-size: 17px
    }
    
    .guideList .listItem .label {
    color: #04816C;
    font-weight: 700;
    margin-right: 10px;
    min-width: 40px;
    position: relative;
    }
    
    .guideList .listItem .label::before {
    content: '•';
    margin-right: 10px;
    }
    
    .guideList .listItem .value {
    color: #555;
    font-weight: 600;
    }
    
    
    /* 상태 및 관리 */
    .prgStatus {
    width: 60px;
    padding: 7px;
    border-radius: 20px;
    font-size: 14px;
    color: #666;
    display: inline-block;
    }
    
    .ing, .accept {
    color: #fff;
    background-color: #465DAC;
    }
    
    .closed, .canceled {
    background-color: #F0F0F0;
    }
    
    .completed { 
    color: #fff;
    background-color: #04816C; 
    }
    
    
    .btnTxt {
    background: #fff;
    border: 1px solid #333;
    padding: 5px 14px;
    border-radius: 3px;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    color: #333;
    font-weight: 500;
    transition: all 0.2s;
    }
    
    .btnTxt:hover {
    background: #333;
    color: #fff;
    }
    
    .btn-icon {
    background-color: #fff;
    border: 1px solid #333;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0;
    /*font-size: 14px;*/
    color: #333;
    min-width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    }
    
    .btn-icon.modify {
    background-image:url(/resources/homepage/nb/_Img/modify.png);
    background-position: center ;
    background-repeat: no-repeat;
    }
    
    .btn-icon.delete {
    background-image:url(/resources/homepage/nb/_Img/delete.png);
    background-position: center ;
    background-repeat: no-repeat;
    }
    
    .btn-icon:hover {
    background-color: #333;
    color: #fff;
    border-color: #333;
    }
    
    .btn-icon.modify:hover {
    background-image:url(/resources/homepage/nb/_Img/modify_over.png);
    }
    
    .btn-icon.delete:hover {
    background-image:url(/resources/homepage/nb/_Img/delete_over.png);
    }
    
    
    /* 페이징 */
    .prgPaging_wrap {
    display: flex;
    justify-content: center;
    margin-top: 30px;
    }
    
    .pageList {
    display: flex;
    align-items: center;
    gap: 5px;
    }
    
    .page-nav, .page-num {
    min-width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F0F0F0;
    text-decoration: none;
    color: #666;
    border-radius: 4px;
    font-size: 12px;
    transition: 0.2s;
    padding: 0 8px;
    }
    
    .page-num {
    position: relative;
    background-color: transparent;
    color: #666;
    font-weight: 500;
    }
    
    .page-num.active {
    background: #fff;
    border: 1px solid #333;
    color: #333;
    font-weight: bold;
    }
    
    .page-num:hover:not(.active) {
    background-color: #e0e0e0;
    }
    
    .page-nav:hover {
    background-color: #333;
    color: #fff;
    }
    
    .page-nav::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: 1px solid #333;
    border-right: 1px solid #333;
    }
    
    /* 페이징 모양 */
    .page-nav.first { position: relative; }
    .page-nav.first::before { transform: rotate(-135deg); margin-left: 8px; }
    .page-nav.first::after { content: ''; position: absolute; left: 12px; width: 1px; height: 14px; background-color: #333;}
    .page-nav.prev::before { transform: rotate(-135deg); margin-left: 4px; }
    .page-nav.next::before { transform: rotate(45deg); margin-right: 4px; }
    .page-nav.last { position: relative; }
    .page-nav.last::before { transform: rotate(45deg); margin-right: 8px; }
    .page-nav.last::after { content: ''; position: absolute; right: 12px; width: 1px; height: 14px; background-color: #333;}
    .page-nav:hover::before{ border-color: #fff; }
    .page-nav:hover::after{ background: #fff; }
    
    
    
    /* 프로그램리스트 - programList */
    .programList_wrap {margin-bottom:50px;}
    
    /* 스크린 리더 전용 텍스트 */
    .sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}
    
    .programList {width: 100%;overflow-x: auto;}
    .prgList-table {width: 100%;border-collapse: collapse;min-width: 900px;}
    .prgList-table thead th {background-color: #343996;color: #fff;padding: 25px 10px;font-weight: 700;font-size: 17px;}
    .prgList-table thead th:first-child {width:60px;border-radius: 15px 0 0 15px;padding-left:20px;}
    .prgList-table thead th:last-child {border-radius: 0 15px 15px 0;padding-right:20px;}
    .prgList-table td {padding: 10px 15px;border-bottom: 1px solid #ddd;text-align: center;font-size: 17px;color: #555;transition: 0.2s;}
    .prgList-table td:first-child {width:60px;padding-left:20px;}
    .prgList-table td:last-child {padding-right:20px;}
    .prgTitle {font-weight: 780;}
    .prgTitle a:hover {color: #04816C;}
    .prgList-table tr:hover {background-color: #f0f1f8;}
    
    
    /* 개별 맞춤 */
    .teacher .prgSummury {width:200px; }
    .teacher .prgCapacity {width:80px; }
    .teacher .prgLocation {width:140px; }
    
    
    /* 강사현황 - teacherList */
    .teacherList_warp  {  margin-bottom: 50px;}
    
    .teacherList {display: flex;flex-wrap: wrap;gap: 24px;margin-top: 20px;}
    .profileBox {background: #fff;border: 1px solid #ccc;border-radius: 15px;padding: 25px;transition: transform 0.2s; /* PC: 3열 */min-width: 300px;width: calc(33.333% - 16px);box-sizing: border-box;}
    .profileBox:hover { transform: translateY(-5px); background: #f0f1f8;}
    .boxTop { display: flex; justify-content: space-between; align-items: center; padding:10px 20px 5px 35px;background-color: #FBFBFB;border-radius: 15px 15px 0 0;}
    .teacherName { font-size: 22px; font-weight: 700; color: #333; }
    .teacherImg { width: 65px; height: 65px; border-radius: 50%;background-color: #fff;}
    .teacherImg img { width: 100%; border-radius: 50%;height: 100%; object-fit: cover; }
    .boxCont { padding: 30px 35px; }
    .contList { display: flex; font-size: 17px;flex-wrap: wrap;}
    
    .contList .listItem {display: flex;align-items: center;flex-basis: 50%;margin-bottom:15px}
    .contList .listItem .label { color: #343996; font-weight: 700; margin-right: 10px;min-width: 40px;}
    .contList .listItem .value {color: #555;font-weight: 600;}
    
    .countInfo {display: flex;align-items: center;justify-content: space-between;background: #F5F5F5;border-radius: 15px;margin-top: 15px;overflow: hidden;}
    .profileBox:hover .countInfo { background: #fff;}
    .countTxt {padding:19px 30px;font-size: 17px;font-weight: 700;color:#555;}
    .txtBlue {color: #465DAC;margin-right:10px;}
    .btnSearch {width: 60px;height: 55px;background: #343996;border: 1px solid #333;color: #fff;font-size: 0;cursor: pointer;transition: background 0.2s;border-radius: 15px;position: relative;}
    .btnSearch:hover { background: #04816C; }
    .btnSearch:focus {outline: 2px solid #009688;outline-offset: -2px;}
    .btnSearch .blind {width: 1px;height: 1px;overflow: hidden;position: absolute;top: -9999em;left: -9999em;display: block;text-indent: -9999em;font-size: 0px;line-height: 0;}
    .btnSearch:after {content:'';display: block;width:15px;height: 15px;background: url('/resources/homepage/nb/_Img/ico_search.png') no-repeat center center;background-size: contain;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
    
    
    /* 프로그램 상세 - prgDetail_wrap */
    .prgDetail_wrap {margin-bottom: 50px;}
    
    .detailCont {
      margin-bottom:30px;
    }
    .detailTop {
    display: flex;
    gap: 50px;
    background-color: #F0F0F0; /* 배경 회색 */
    padding: 50px;
    border-radius: 15px;
    margin-bottom: 50px;
    }
    
    .thumbImg {
    flex: 0 0 35%;
    border-radius: 10px;
    overflow: hidden; aspect-ratio: 3/2;
    }
    
    .thumbImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    }
    
    .infoCard {
    flex: 1;
    background-color: #fff;
    border-radius: 10px;
    padding: 45px 45px 30px;
    position: relative;
    }
    
    .statusLine {
    display: inline-block;
    border: 1px solid #465DAC;
    color: #4a6cc3;
    min-width: 60px;
    padding: 7px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    text-align: center;
    }
    
    .detailTitle {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    padding-bottom:20px;
    word-break: keep-all;
    border-bottom: 1px solid #ddd;
    margin:0 0 25px;
    }
    
    .infoList {
    display: flex;
    margin:0 0 15px;
    font-size:17px;
    }
    
    .infoList dt {
    width: 80px;
    color: #04816C;
    font-weight: 700;
    }
    
    .infoList dd {
    margin: 0;
    color: #555;
    }
    
    .tableType {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;    
    border-top: 2px solid #333;
    border-bottom:1px solid #333;
    }
    
    .tableType thead th, .tableType thead td {
    border-bottom:1px solid #ddd;
    }
    
    .tableType th, .tableType td {
    padding: 15px 20px;
    text-align: center;
    font-size: 17px;
    word-wrap: break-word;
    border-top:1px solid #ddd;
    }
    
    .tableType th {
    background-color: #FBFBFB;
    color: #333;
    font-weight: 700;
    white-space: nowrap;
    border-right: 1px solid #ddd;
    }
    
    .tableType td {
    color: #555;
    }
    
    .tableType tbody tr:first-child th, .tableType tbody tr:first-child td {
    border-top:0;
    }
    
    table.byRow {
    border-collapse: separate;
    border-spacing: 0;
    }
    
    .byRow th, .byRow td {
    text-align: left;
    }
    
    .btnGroup {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 40px;
    }
    
    .btn {
    padding: 10px 30px;
    font-size: 17px;
    font-weight: 500;
    border-radius: 3px;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s;
    }
    
    .btnGroup .btnBlue  {
    background-color: #465DAC;
    color: #fff;
    border: 1px solid #333;
    }
    
    .btnGroup .btnBlue:hover {
    background-color: #193aa5;
    color:#fff;
    }
    
    .btnBlue {
    background-color: #465DAC;
    color: #fff;
    border: 1px solid #333;
    }
    
    .btnBlue:hover {
    background-color: #193aa5;
    color:#fff;
    }
    
    .btnLine {
    background-color: #fff;
    color: #333;
    border: 1px solid #333;
    }
    .btnLine:hover {
    background-color: #333;
    color:#fff;
    }