@charset "utf-8";

/******************************
	검색영역	검색영역	검색영역
******************************/
.search-area {width: 100%; display: flex; align-items: center; justify-content: flex-end; margin: 0 0 32px; position: relative}

.total {font-size: 18px; color: var(--gray); position: absolute; left: 0}
.total-normal {font-size: 18px; color: var(--gray)}
.search-area .search-form {display: flex}
.search-area .search-form .input {width: 240px}
.search-area .search-form .input-date-box {display: flex}
.search-area .search-form .input-date {width: 180px}

/* 리스트 or 달력 */
.search-area ul.form-button-area {display: flex; margin: 0 0 0 30px; position: relative}
.search-area ul.form-button-area::before {width: 1px; height: 20px; background-color: var(--line-gray2); content: ''; position: absolute; top: 50%; left: -15px; transform: translateY(-50%)}
.search-area ul.form-button-area.calendar-form::before {content: none}
.search-area ul.form-button-area li {width: 100px; height: 40px; border: 1px solid var(--line-gray2); display: flex; align-items: center; padding: 0 0 0 46px; cursor: pointer; transition: .4s; -webkit-transition: .4s}
.search-area ul.form-button-area li.form1 {background: url('/img/lms/sub/icon-list.svg') 16px center no-repeat; background-size: 18px; border-width: 1px 0 1px 1px; }
.search-area ul.form-button-area li.form2 {background: url('/img/lms/sub/icon-calendar.svg') 16px center no-repeat; background-size: 20px; border-width: 1px 1px 1px 0;}
.search-area ul.form-button-area li.form1.on {font-weight: 500; color: #fff; background-color: var(--blue); background-image: url('/img/lms/sub/icon-list-on.svg'); border: none}
.search-area ul.form-button-area li.form2.on {font-weight: 500; color: #fff; background-color: var(--blue); background-image: url('/img/lms/sub/icon-calendar-on.svg'); border: none}
.search-area ul.form-button-area.sort{}
.search-area ul.form-button-area.sort li{position:relative;text-align:center;justify-content:center;padding-left:0}
.search-area ul.form-button-area.sort li:hover{background:#737373;color:#fff}
.search-area ul.form-button-area.sort li.on{background:#737373;;color:#fff}
.search-area ul.form-button-area.sort li.sort01{}
.search-area ul.form-button-area.sort li.sort02{}
.search-area ul.form-button-area.sort li.sort03{}
.search-area ul.form-button-area.sort li i{content:'';width:17px;height:16px;margin-right:3px}
.search-area ul.form-button-area.sort li.sort01 i{width:16px;height:16px;background:url("/img/lms/board/icon_sort01_n.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort02 i{width:13px;height:16px;background:url("/img/lms/board/icon_sort02_n.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort03 i{width:17px;height:16px;background:url("/img/lms/board/icon_sort03_n.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort01:hover i{width:16px;height:16px;background:url("/img/lms/board/icon_sort01_o.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort02:hover i{width:13px;height:16px;background:url("/img/lms/board/icon_sort02_o.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort03:hover i{width:17px;height:16px;background:url("/img/lms/board/icon_sort03_o.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort01.on i{width:16px;height:16px;background:url("/img/lms/board/icon_sort01_o.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort02.on i{width:13px;height:16px;background:url("/img/lms/board/icon_sort02_o.png") no-repeat;}
.search-area ul.form-button-area.sort li.sort03.on i{width:17px;height:16px;background:url("/img/lms/board/icon_sort03_o.png") no-repeat;}
/* 스마트제조 */
.search-area ul.form-button-area.smart li.form1.on {background-color: var(--blue)}
.search-area ul.form-button-area.smart li.form2.on {background-color: var(--blue)}
/* 사업주위탁 */
.search-area ul.form-button-area.employ li.form1.on {background-color: var(--orange)}
.search-area ul.form-button-area.employ li.form2.on {background-color: var(--orange)}
.search-area ul.form-button-area li:hover {background-color: rgba(0,0,0,.05)}



/******************************
	문의하기	문의하기	문의하기
******************************/
/* 문의 답변 상태 */
.qna-state {font-size: 12px; font-weight: 500; border-radius: 5px; display: inline-flex; padding: 6px 12px; margin: 0 8px 0}
.qna-state.complete {color: var(--blue); border: 1px solid var(--blue)}
.qna-state.wait {color: var(--gray); border: 1px solid var(--gray)}
/* 비밀글 */
.qna-secret {position: relative}/* 문의하기 비밀글 */
.qna-secret::after {width: 24px; height: 100%; background: url('/img/lms/com/icon-qna.svg') center no-repeat; background-size: 24px; content: ''; position: absolute; top: 50%; right: -28px; transform: translateY(-50%)}
.qna-secret.view {padding: 0 0 0 28px}
.qna-secret.view::after {top: 0; right: auto; left: 0; transform: translateY(0)}



/******************************
	모집과정 & 이미지게시판
******************************/
ul.lecture-list {width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: auto; grid-gap: 20px 32px; gap: 20px 32px}
ul.lecture-list li.item {display: grid; border-radius: 20px; position: relative; overflow: hidden; transition: .4s; -webkit-transition: .4s;border:1px solid #ebebeb}
ul.lecture-list li.item a {display: block; position: relative}
ul.lecture-list li.item .thumb {width: 100%; border-radius: 20px; padding-top: calc(100% * 0.54); position: relative; overflow: hidden}
ul.lecture-list li.item .thumb img {width: 100%; max-width: none; height: auto; font-size: 0; display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; padding-top: 0 !important; transition: .4s; -webkit-transition: .4s}
ul.lecture-list li.item .thumb .basic-img {width: 100%; background:#fff; position: absolute; padding-top: calc(100% * 0.54); transform: translateY(-100%);text-align:center}
ul.lecture-list li.item .thumb.logo-no .basic-img{background:#103876} 
ul.lecture-list li.item .thumb .basic-img::after {width: 100%; height: 100%; background: url('/img/lms/com/logo.svg') 50% 50% no-repeat; background-size: 65%; opacity: .4; position: absolute; top: 0; left: 0;  content: ''}
ul.lecture-list li.item .thumb .basic-img span{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:10;font-size:30px;line-height:130%;color:#fff;font-weight:500;font-family: 'Paperlogy-8ExtraBold';}
ul.lecture-list li.item .info {width: 100%; padding: 16px 12px 12px; position: relative; z-index: 30}
ul.lecture-list li.item .info .top {width: 100%; display: flex; align-items: center; justify-content: space-between; margin: 0 0 12px}
ul.lecture-list li.item .info .top .category {font-weight: 500; color: var(--blue)}
ul.lecture-list li.item .state {width: 90px;padding:15px 0; font-size: 14px; font-weight: 500; border-radius: 0 0 0 0; display: flex; align-items: center; justify-content: center; position: absolute; top: 0px; left: 0px; z-index: 20;border-radius:20px 0}
ul.lecture-list li.item .state.state1 {color: var(--blue); background-color: #fff}
ul.lecture-list li.item .state.state2 {color: #e9e9e9; background-color: var(--bg-gray)}
ul.lecture-list li.item .target {width: 80px; height: 30px; font-size: 14px; color: #fff700; background-color: rgba(0,0,0,.7); border-radius: 0 0 15px 0; display: flex; align-items: center; justify-content: center; position: absolute; top: 1px; left: 82px; z-index: 20}
ul.lecture-list li.item .info .top .type-box {display: flex}
ul.lecture-list li.item .info .top .type-box .type {width: 80px; height: 30px; font-size: 14px; font-weight: 500; background-color: #fff; border-radius: 15px; display: flex; align-items: center; justify-content: center}
ul.lecture-list li.item .info .top .type-box .type.type1 {color: #3d5d43;border: 1px solid #3d5d43;}
ul.lecture-list li.item .info .top .type-box .type.type2 {color: #954b4b;border: 1px solid #954b4b; margin: 0 0 0 4px}
ul.lecture-list li.item .info strong.title {width: 100%; height: 46px; font-size: 18px; color: var(--black); line-height: 1.25; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: .4s; -webkit-transition: .4s; margin: 0 0 12px}
ul.lecture-list li.item .info dl.sub-info {width: 100%; font-size: 14px; color: var(--gray); display: flex; justify-content: space-between; margin: 0 0 8px}
ul.lecture-list li.item .info dl.sub-info.board {margin: 0}
ul.lecture-list li.item .info dl.sub-info.board dd {width: 100%}
ul.lecture-list li.item .info dl.sub-info dt {width: 60px}
ul.lecture-list li.item .info dl.sub-info dd {width: calc(100% - 60px)}
ul.lecture-list li.item .info .bottom {border-top: 1px solid var(--line-gray); display: flex; justify-content: space-between; padding: 12px 0 0; margin: 12px 0 0}
ul.lecture-list li.item .info .bottom dl.sub-info2 {font-size: 14px; color: var(--gray); display: flex}
ul.lecture-list li.item:hover {box-shadow: 0 0 15px 5px #e3e4e9}
ul.lecture-list li.item a:hover .thumb img {width: 110%}
ul.lecture-list li.null {width: 100%; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 200; color: var(--black); background: var(--bg-light-gray); padding: 60px 0}
/* 스마트제조 */
ul.lecture-list.smart li.item .state.state1 {background-color: var(--blue);color:#fff}
ul.lecture-list.smart li.item .info .top .category {color: #014099}
/* 사업주위탁 */
ul.lecture-list.employ li.item .state.state1 {color: var(--orange)}
ul.lecture-list.employ li.item .info .top .category {color: #014099}

/* 시청 메인 컨텐츠 교육소개 3건의 개별 슬라이더 2024 */
.lecture-list {width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; grid-gap: 20px 32px; gap: 20px 32px;}
.lecture-list .lecture-box {overflow: hidden;background:#edf0f5;border-radius:30px}
.lecture-list .lecture-box.smart {}
.lecture-list .lecture-box.iron {}
.lecture-list .lecture-box.battery {}
.lecture-list .lecture-box .lecture-img {overflow:hidden;height: 300px;position:relative}
.lecture-list .lecture-box .lecture-img img{height: 300px;border-top-left-radius:30px;border-top-right-radius:30px}
.lecture-list .lecture-box .lecture-img .cate-name{position:absolute;color:#fff;display:block;left:20px;bottom:12px;z-index:100;font-size:27px;font-weight:400;font-family: 'GamtanRoad'}
.lecture-list .lecture-box .lecture-img .lecture-btn-list{position:absolute;bottom:12px;right:20px;display:block}
.lecture-list .lecture-box .lecture-img .lecture-btn-list a{font-size:0;width:20px;height:19px;display:inline-block}
.lecture-list .lecture-box .lecture-img .lecture-btn-list a.btn-edu-prev{background:url(/img/lms/com/btn_edu_prev.png) no-repeat}
.lecture-list .lecture-box .lecture-img .lecture-btn-list a.btn-edu-pause{background:url(/img/lms/com/btn_edu_pause.png) no-repeat}
.lecture-list .lecture-box .lecture-img .lecture-btn-list a.btn-edu-play{background:url(/img/lms/com/btn_edu_play.png) no-repeat}
.lecture-list .lecture-box .lecture-img .lecture-btn-list a.btn-edu-next{background:url(/img/lms/com/btn_edu_next.png) no-repeat}
.img-cont{position:relative}
.lecture-list .lecture-box .lecture-items {border-bottom-left-radius:30px;border-bottom-right-radius:30px;margin:0!important;padding-top:0!important;padding-bottom:0!important}
.lecture-list .lecture-box .lecture-items a {width:100%;}
.lecture-list .lecture-box .lecture-items .info { width: 100%; padding: 20px 0px; position: relative; z-index: 30; }

.lecture-list .lecture-box .lecture-items .info .info-top{display:flex;justify-content: space-between;}
.lecture-list .lecture-box .lecture-items .info .info-top .state-wrap{}
.lecture-list .lecture-box .lecture-items .info .info-top .state-wrap .state{color:#fff;border-radius:5px;font-size:14px;padding:0 10px;height:24px;line-height:21px;display:block;}
.lecture-list .lecture-box .lecture-items .info .info-top .state-wrap .state1{background:#302e87;}
.lecture-list .lecture-box .lecture-items .info .info-top .state-wrap .state2{background:#666;}
.lecture-list .lecture-box .lecture-items .info .info-top .state-wrap .state3{background:#540b7e;}
.lecture-list .lecture-box .lecture-items .info .top{/* width: 100%; display: flex; align-items: center; justify-content: space-between; */margin: 0 0 12px; }
.lecture-list .lecture-box .lecture-items .info strong{color:#014099;font-size:18px;font-weight:600;font-family: 'S-CoreDream';line-height:1.6}
.lecture-list .lecture-box .lecture-items .info .top .category{font-weight: 500;}
.lecture-list .lecture-box .lecture-items .info .top .type-box {display:flex;}
.lecture-list .lecture-box .lecture-items .info .top .type-box .type{border-radius:5px;font-size:14px;padding:4px 10px;background:#fff}
.lecture-list .lecture-box .lecture-items .info .top .type-box .type1{color:#3d5d43;border:1px solid #3d5d43;}
.lecture-list .lecture-box .lecture-items .info .top .type-box .type2{color:#954b4b;border:1px solid #954b4b;margin-left:5px}
.lecture-list .lecture-box .lecture-items .info .sub-info-wrap{border-radius:10px;background:#fff;padding:5px 20px;margin-top:10px;font-size:14px;color:#000}
.lecture-list .lecture-box .lecture-items .info dl.sub-info { width: 100%; font-size: 14px; color: var(--gray); display: flex; justify-content: space-between;line-height:200%}
.lecture-list .lecture-box .lecture-items .info dl.sub-info:first-child{border-bottom:1px solid #ebebeb}
.lecture-list .lecture-box .lecture-items .info dl.sub-info dt {width:80px;font-weight:600;letter-spacing:1px;color:#000;font-family: 'S-CoreDream';}
.lecture-list .lecture-box .lecture-items .info dl.sub-info dd {width: calc(100% - 80px);letter-spacing:1.3px;color:#000;font-family: 'S-CoreDream';font-weight:400;}
.lecture-list .lecture-box .lecture-items .info .bottom { border-top: 1px solid var(--line-gray); display: flex; justify-content: space-between; padding: 12px 0 0; margin: 12px 0 0; }
.lecture-list .lecture-box .lecture-items .info .bottom dl.sub-info2 { font-size: 14px; color: var(--gray); display: flex;margin-bottom:10px }
.lecture-list .lecture-box .lecture-items .info .bottom dl.sub-info2 dt {font-size: 14px;font-family: 'S-CoreDream';font-weight:600}
.lecture-list .lecture-box .lecture-items .info .bottom dl.sub-info2 dd {font-size: 14px;font-family: 'S-CoreDream';font-weight:400}
.lecture-list .lecture-box .lecture-items .info .bottom dl.sub-info2 dd span{font-family: 'S-CoreDream'}
.lecture-list .lecture-box .lecture-items .info .bottom .btn_edu_more{background:#014099;border-radius:20px 0 20px 20px;padding:10px 50px 10px 40px;text-align:center;color:#fff;position:relative;line-height:26px;}
.lecture-list .lecture-box .lecture-items .info .bottom .btn_edu_more:after{background:url('/img/lms/com/icon_arrow02.png') no-repeat;width:8px;height:11px;content:'';position:absolute;top:18px;right:32px;}

.lecture-list .lecture-box.smart .lecture-items .state.state1 {color: var(--purple)}
.lecture-list .lecture-box.smart .lecture-items .info .top .category {color: var(--purple)}
.lecture-list .lecture-box.iron .lecture-items .state.state1 {color: var(--orange)}
.lecture-list .lecture-box.iron .lecture-items .info .top .category {color: var(--orange)}
.lecture-list .lecture-box.iron .lecture-items .state.state1 {color: var(--gray)}
.lecture-list .lecture-box.iron .lecture-items .info .top .category {color: var(--gray)}




/******************************
	게시판 목록	게시판 목록
******************************/
.board-list {width: 100%; border-top: 1px solid var(--gray)}
.board-list.border-top-none {border-top: 0}
.board-list thead th,
.board-list tbody th,
.board-list tbody td {line-height: 1.4; border-right: 1px solid var(--line-gray); padding: 12px; text-align: center}
.board-list thead th,
.board-list tbody th {font-weight: 500; color: var(--black); background: var(--bg-gray4); border-bottom: 1px solid var(--line-gray)}
.board-list tbody td {border-right: 1px solid var(--line-gray); border-bottom: 1px solid var(--line-gray); text-align: center}
.board-list tbody td.lec-name {min-width: 280px}
.board-list tbody td.lec-date {min-width: 220px}
.board-list th:last-child,
.board-list td:last-child {border-right: none}
.board-list th.border-right {border-right: 1px solid var(--line-gray)}
.board-list td.border-right:last-child {border-right: 1px solid var(--line-gray)}
.board-list tbody tr {transition: .4s}
/*.board-list tbody tr:hover {background: var(--bg-gray5)}*/
.board-list tbody td.left {text-align: left}/* 텍스트 좌측 정렬 */
td.td-left{text-align:left!important}
/* 문의하기 */
.board-list tbody tr.my-post {font-weight: 500; background-color: #fff9f0}
/* 공지 상단 고정 */
/* .board-list tbody tr.fixed {background: var(--bg-gray4)} */
.board-list tbody tr.fixed td .fixed-icon {width: 100%; height: 100%; display: flex; justify-content: center}
.board-list tbody tr.fixed td .fixed-icon img {width: 24px}
/* 마우스 오버 효과 X */
.board-list.normal tr {cursor: default}
.board-list.normal tr:hover {background: none}
.board-list tr.normal {cursor: default}
.board-list tr.normal:hover {background: none}
/* 스크롤 */
.scroll-list-wrap {max-height: 400px; border-top: 1px solid var(--gray); border-bottom: 1px solid var(--line-gray); overflow-y: auto}
.scroll-list-wrap .board-list {border-top: 0}
.scroll-list-wrap .board-list tbody tr:last-child td {border-bottom: 0}
/* 모바일 */
.board-list tbody td.m-only {height: auto; display: none !important; border-right: none; text-align: left; padding: 12px; line-height: 1.2}
.board-list tbody td.m-only .title {width: 100%;font-size: 16px;color: #000;font-weight: 500;display: block}
.board-list tbody td.m-only .title.qna {width: auto; display: inline-block}
.board-list tbody td.m-only .top {font-size: 14px; margin-bottom: 10px}
.board-list tbody td.m-only .top span+span {margin-left: 10px}
.board-list tbody td.m-only ul.m-data-list {width: 100%;display: block; margin-top: 8px}
.board-list tbody td.m-only ul.m-data-list li {height: 22px; line-height: 22px; font-size: 14px;display: inline-block;position: relative;padding-right: 15px;margin-right: 10px}
.board-list tbody td.m-only ul.m-data-list li::after {width: 1px; height: 10px; background: #d6deea; content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%)}
.board-list tbody td.m-only ul.m-data-list li:last-child {padding: 0; margin: 0}
.board-list tbody td.m-only ul.m-data-list li:last-child::after {content: none}

/* 게시판 목록 팝업 */
.table_view .basic_table .BorderNone {border: none}



/******************************
	게시판 상세	게시판 상세
******************************/
.board-view {width: 100%; border-top: 1px solid var(--gray)}
.board-view th.top {border-bottom: 1px solid var(--line-gray); border-right: 0; height: 72px; padding: 16px 20px; text-align: left; font-size: 20px; color: var(--black); background: none}
.board-view th.top .state-area {display: flex; align-items: center; margin: 0 0 20px}
.board-view th.top .state-area .category {font-size: 14px; color: var(--gray)}
.board-view th.top ul.side-info {width: 100%; display: flex; clear: both; margin-top: 15px}
.board-view th.top ul.side-info > li {font-size: 14px; font-weight: 400; color: var(--gray); margin-right: 15px}
.board-view th.top ul.side-info > li:last-child {margin-right: 0}
.board-view th.top ul.side-info > li .score {display: flex; align-items: center}
.board-view th.top ul.side-info > li .score img {width: 100px; margin-right: 5px; vertical-align: top}
.board-view th.top ul.side-info > li .score span {display: inline-block; height: 100%}
.board-view tr {border-bottom: 1px solid var(--line-gray)}
.board-view tr th {border-right: 1px solid var(--line-gray); background: var(--bg-gray4); text-align: center; height: 48px; padding: 10px 12px}
.board-view tr td {padding: 12px;line-height:1.6}
.board-view tr td.download li {display: block; margin: 0 0 12px}
.board-view tr td.download li:last-child {margin: 0}
.board-view tr td.info {height: auto; padding: 0; vertical-align: top}
.board-view tr td.info .view-info {min-height: 200px}
.board-view tr td.info .view-info pre p,
.board-view tr td.info .view-info pre span {/* font-size: 16px !important;  */color: var(--gray) !important; padding: 0 !important; margin: 0 !important}
.board-view tr td.promotion {width: 100%; padding: 40px 0 0}
.board-view tr td.promotion .promotionVideoWrap {display: flex; justify-content: center}
dl.prev-next {width: 100%; clear: both; color: var(--gray)}
dl.prev-next dt {width: 15%;height: 48px;min-width: 80px;background: url('/img/arw-top.svg') 30px 50% no-repeat;text-align: center;display: flex;align-items: center;justify-content: center;float: left;background-size: 14px;border-bottom: 1px solid var(--line-gray)}
dl.prev-next dt.next {background-image: url('/img/arw-btm.svg')}
dl.prev-next dd {width: 85%;height: 48px;max-width: calc(100% - 80px);padding: 0 30px;text-overflow: ellipsis;white-space: nowrap; overflow:hidden;position: relative;display: flex;align-items: center;justify-content: flex-start;border-bottom: 1px solid var(--line-gray)}
dl.prev-next dd::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 10px; background: var(--line-gray)}
dl.prev-next dd a {transition: .4s}
dl.prev-next dd a:hover {color: var(--black)}



/******************************
	게시판 등록	게시판 등록
******************************/
.board-write {width: 100%; border-top: 1px solid var(--gray)}
.board-write tbody th,
.board-write tbody td {line-height: 1.4; border-right: 1px solid var(--line-gray); border-bottom: 1px solid var(--line-gray); padding: 10px; text-align: center}
.board-write tbody th {font-weight: 500; color: var(--black); background: var(--bg-gray4); }
.board-write tr th:last-child,
.board-write tr td:last-child {border-right: none}
.board-write th.border-right {border-right: 1px solid var(--line-gray)}
.board-write td.border-right:last-child {border-right: 1px solid var(--line-gray)}
.board-write .left {text-align: left}



/******************************
	블로그형 목록	블로그형 목록
******************************/
ul.blog-list {border-top: 1px solid #dcdee2; margin-bottom: 20px; display: block; width: 100%}
ul.blog-list li.blog-item {width: 100%; display: inline-block; padding: 20px; border-bottom: 1px solid #dcdee2; transition: .4s}
ul.blog-list li.blog-item a {display: block}
ul.blog-list li.blog-item .top {display: inline-block; margin-bottom: 10px}
ul.blog-list li.blog-item strong {width: 100%; font-size: 20px; font-weight: 500; line-height: 1.3; display: inline-block; margin-bottom: 10px; transition: .4s; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden}
ul.blog-list li.blog-item ul.info-list {width: 100%; display: inline-block; clear: both}
ul.blog-list li.blog-item ul.info-list li.info-item {display: inline-block; float: left; position: relative; margin-right: 35px}
ul.blog-list li.blog-item ul.info-list li.info-item::after {content: ''; position: absolute; top: 50%; right: -20px; transform: translateY(-50%); width: 2px; height: 10px; background: #c4c4c4}
ul.blog-list li.blog-item ul.info-list li.info-item:last-child {margin-right: 0}
ul.blog-list li.blog-item ul.info-list li.info-item:last-child::after {content: none}
ul.blog-list li.blog-item:hover {background: #f9f9f9}
ul.blog-list li.blog-item:hover a strong {color: #0058a8}
ul.blog-list li.null {display: flex; align-items: center; justify-content: center; padding: 20px 0}
ul.blog-list.main-blog {margin-bottom: 0}
ul.blog-list.main-blog :last-child {border-bottom: none}
ul.blog-list li.main-item {padding: 15px}



/******************************
		수강후기 & QNA
******************************/
.reply-total {font-size: 18px; color: var(--gray)}
/* 후기 & 답변 목록 */
ul.reply-list {width: 100%; display: flex; flex-direction: column}
ul.reply-list li {width: 100%; border: 1px solid var(--line-gray); border-radius: 10px; margin: 16px 0 0}
ul.reply-list li:first-child {margin: 0}
ul.reply-list li .top {height: 52px; border-bottom: 1px solid var(--line-gray); display: flex; align-items: center; justify-content: space-between; padding: 0 24px}
ul.reply-list li .top .name {position: relative; padding-right: 16px}
ul.reply-list li .top .name::after {width: 2px; height: 10px; background: var(--line-gray); content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%)}
ul.reply-list li .top .date {font-size: 14px; color: #999; font-weight: 400; margin-left: 16px}
ul.reply-list li .top button {min-width: auto; height: auto; font-size: 14px; padding: 8px 16px}
ul.reply-list li .text {width: 100%; min-height: 120px; line-height: 1.6; padding: 12px 24px}
/* 후기 & 답변 입력 */
.reply-write {width: 100%; background-color: var(--bg-gray4); border-radius: 10px; display: flex; flex-direction: column; align-items: center; padding: 20px; margin: 16px 0 0}


/******************************
		페이지 내비게이션
******************************/
.paging {text-align: center}
.paging * {vertical-align: top}
.page_wrap {display: flex; justify-content: center}
.paging a {width: 30px; height: 30px; line-height: 1; background-color: var(--bg-gray4); border: 1px solid var(--line-gray); display: flex; align-items: center; justify-content: center; margin-right: 4px; color: var(--gray); cursor: pointer; transition: .4s}
.paging a img {width: 16px}
.paging a.first, .paging a.prev, .paging a.next, .paging a.last {background-color: var(--bg-gray4)}
.paging a:hover {border: 1px solid var(--gray); color: var(--black)}
.paging a.on {border-color: var(--black); font-weight: 500; color: #000}
.page-num {display: flex}



.hiring-wrap {position: relative;display: block;max-width: 100%;}
.sub .hiring-wrap {padding: 16px 0}
.hiring-wrap .board-img-list {display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 24px;overflow: hidden;width: auto;margin: -16px -16px 0;padding: 16px;}
.hiring-wrap .board-img-list .item {display: block;margin: 0;width: auto;float: none;overflow: hidden;margin: -16px;padding: 16px;}
.hiring-wrap .board-img-list .item>div {}
.hiring-wrap .board-img-list .item .thumb {padding-top: 72px;}
.hiring-wrap .board-img-list .item .thumb img {}
.hiring-wrap .board-img-list .item .thumb .basic-img {padding-top: 72px;}
.hiring-wrap .board-img-list .item .thumb .basic-img::after {}
.main-cont .hiring-wrap .board-img-list {grid-template-columns: repeat(3, 1fr);}
.hiring-wrap .item__head {}
.hiring-wrap .item__body {margin-top: 18px;padding: 0 8px;}
.hiring-wrap .item__foot {margin-top: 12px;padding: 0 8px 8px;}
.hiring-wrap .item__category {font-size: 14px;color: #4b4a4a;}
.hiring-wrap .item__title {margin-top: 8px;white-space: nowrap;width: 100%;min-height: 24px;}
.hiring-wrap .item__numbers {display: flex;flex-flow: row nowrap;place-content: space-between;align-items: center;}
.hiring-wrap .item__numbers li {}
.hiring-wrap .item__numbers li+li {margin: 0;}
.hiring-wrap .item__numbers li img {}
.hiring-wrap .item__numbers li span {}




@media screen and (max-width: 1440px) {
	.search-area {margin: 0 0 24px}
	.total {font-size: 16px}
	.search-area .search-form .input {width: 160px}
	.search-area .search-form .input-date {width: 120px}
	
	ul.blog-list li.blog-item strong {font-size: 16px}
	ul.blog-list li.blog-item ul.info-list li.info-item {font-size: 14px; margin-right: 30px}
	ul.blog-list li.blog-item ul.info-list li.info-item::after {right: -18px}
}

@media screen and (max-width: 1280px) {
	/******************************
		모집과정 & 이미지게시판
	******************************/
	ul.lecture-list {grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; grid-gap: 20px 32px; gap: 20px 32px}
	.lecture-list {grid-template-rows: auto; grid-gap: 20px 32px; gap: 20px 32px}
	ul.lecture-list li.item .info strong.title {height: 38px; font-size: 16px}
	ul.lecture-list li.item .info dl.sub-info dt {width: 48px}
	ul.lecture-list li.item .info dl.sub-info dd {width: calc(100% - 48px)}
}

@media screen and (max-width: 1080px) {
	.search-area {flex-direction: column; margin: 0 0 48px}
	.total {bottom: -32px}
	.total-normal {font-size: 14px}
	.search-area .ml10,
	.search-area .ml20 {margin-left: 0 !important}
	.search-area .search-form {width: 100%; flex-direction: column}
	.search-area .search-form .search-title {width: 100%; height: auto; font-size: 14px; display: block; padding: 0; cursor: default; margin-bottom: 12px}
	.search-area .search-form .select {margin-bottom: 12px}
	.search-area .search-form .input {width: 100%; margin-bottom: 12px}
	.search-area .search-form .input-date-box .input-date {width: 50%}
	.lecture-list .lecture-box .lecture-img img{width:100%}
	/* 리스트 or 달력 */
	.search-area ul.form-button-area {margin: 24px 0 0}
	.search-area ul.form-button-area::before {content: none}
	.search-area ul.form-button-area li {width: 92px; height: 32px; font-size: 14px; border: 1px solid var(--line-gray2); display: flex; align-items: center; padding: 0 0 0 40px; cursor: pointer; transition: .4s; -webkit-transition: .4s}
	.search-area ul.form-button-area li.form1 {background: url('/img/lms/sub/icon-list.svg') 16px center no-repeat; background-size: 14px; border-width: 1px; border-radius: 10px}
	.search-area ul.form-button-area li.form2 {background: url('/img/lms/sub/icon-calendar.svg') 16px center no-repeat; background-size: 16px; border-width: 1px; border-radius: 10px; margin-left: 8px}
	
	/******************************
		문의하기	문의하기	문의하기
	******************************/
	/* 문의 답변 상태 */
	.qna-state {padding: 0 8px; margin: 0 4px 0}
	/* 비밀글 */
	.qna-secret::after {width: 20px; height: 100%; background: url('/img/lms/com/icon-qna.svg') center no-repeat; background-size: 20px; content: ''; position: absolute; top: 50%; right: -24px; transform: translateY(-50%)}
	.qna-secret.view {padding: 0 0 0 28px}
	.qna-secret.view::after {top: 0; right: auto; left: 0; transform: translateY(0)}
	
	/******************************
		게시판 목록	게시판 목록
	******************************/
	.board-list thead th,
	.board-list tbody th,
	.board-list tbody td {font-size: 14px}
	.board-list tbody td.lec-date {min-width: 180px}
	/* 공지 상단 고정 */
	.board-list tbody tr.fixed td .fixed-icon img {width: 24px}
	
	.board-list colgroup col {width: auto !important}
	.board-list .pc-only {display: none}
	.board-list tbody td.m-only {display: block !important}
	
	/******************************
		게시판 상세	게시판 상세
	******************************/
	.board-view th.top {height: auto}
	.board-view th.top .state-area {margin: 0 0 20px}
	.board-view th.top .state-area .category {font-size: 14px}
	.board-view th.top ul.side-info {margin-top: 12px}
	.board-view tr th {height: auto; font-size: 14px; padding: 12px}
	.board-view tr td {font-size: 14px; padding: 12px}
	.board-view tr td.download li {margin: 0 0 8px}
	.board-view tr td.promotion {padding: 24px 0 0}
	.board-view tr .pc-only {display: none}
	dl.prev-next dt {width: 10%; height: 40px; font-size: 14px; min-width: 80px}
	dl.prev-next dd {width: 90%; height: 40px; font-size: 14px; padding: 0 20px}
	dl.prev-next dd a {transition: .4s}
	dl.prev-next dd a:hover {color: var(--black)}
	
	/******************************
		게시판 등록	게시판 등록
	******************************/
	.board-write tbody th,
	.board-write tbody td {font-size: 14px; padding: 6px}
	
	/******************************
		모집과정 & 이미지게시판
	******************************/
	ul.lecture-list {grid-gap: 16px; gap: 16px}
	.lecture-list {grid-template-columns: repeat(1, 1fr)}
	ul.lecture-list li.item {border-radius: 0 16px 10px 10px}
	ul.lecture-list li.item .state {width: 56px; height: 24px; font-size: 12px}
	ul.lecture-list li.item .target {width: 56px; height: 24px; font-size: 12px; border-radius: 0 0 8px 0; left: 58px}
	ul.lecture-list li.item .thumb {border-radius: 0 16px 0 16px}
	ul.lecture-list li.item .info {padding: 12px}
	ul.lecture-list li.item .info .top {margin: 0 0 8px}
	ul.lecture-list li.item .info .top .category {font-size: 14px}
	ul.lecture-list li.item .info .top .type-box .type {width: 56px; height: 24px; font-size: 12px; border-radius: 12px}
	ul.lecture-list li.item .info strong.title {height: 34px; font-size: 14px; line-height: 1.25; margin: 0 0 12px}
	ul.lecture-list li.item .info dl.sub-info {font-size: 12px}
	ul.lecture-list li.item .info dl.sub-info dt {width: 44px}
	ul.lecture-list li.item .info dl.sub-info dd {width: calc(100% - 44px)}
	ul.lecture-list li.item .info .bottom {padding: 8px 0 0; margin: 8px 0 0}
	ul.lecture-list li.item .info .bottom dl.sub-info2 {font-size: 12px}
	ul.lecture-list li.null {font-size: 14px; padding: 40px 0}
	
	/******************************
			수강후기 & QNA
	******************************/
	.reply-total {font-size: 14px}
	/* 후기 & 답변 목록 */
	ul.reply-list li {border-radius: 5px; margin: 12px 0 0}
	ul.reply-list li .top {height: 44px; padding: 0 4px 0 16px}
	ul.reply-list li .top .name {font-size: 14px; padding-right: 12px}
	ul.reply-list li .top .date {margin-left: 8px}
	ul.reply-list li .top button {font-size: 14px; padding: 4px 12px}
	ul.reply-list li .text {min-height: 80px; font-size: 14px; line-height: 1.4; padding: 8px 12px}
	.reply-write {border-radius: 5px; padding: 12px; margin: 12px 0 0}
	.reply-write .mt20 {margin-top: 12px !important}
}

@media (max-width: 768px) {
	/******************************
		게시판 목록	게시판 목록
	******************************/
	.board-list thead th,
	.board-list tbody th,
	.board-list tbody td {font-size: 12px; padding: 8px}
	.board-list tbody td.lec-date {min-width: 150px}
	
	/******************************
		게시판 상세	게시판 상세
	******************************/
	.board-view th.top ul.side-info {display: block}
	.board-view th.top ul.side-info > li {font-size: 12px; margin: 0 0 8px}
	.board-view th.top ul.side-info > li:last-child {margin: 0}
	.board-view tr th {font-size: 12px; padding: 8px}
	.board-view tr td {font-size: 12px; padding: 8px}
	
	/******************************
		게시판 등록	게시판 등록
	******************************/
	.board-write tbody th,
	.board-write tbody td {font-size: 12px}
	
	/******************************
		모집과정 & 이미지게시판
	******************************/
	ul.lecture-list {grid-template-columns: repeat(2, 1fr)}
	.lecture-list {grid-template-columns: repeat(1, 1fr)}
	
	ul.blog-list li.main-item {padding: 10px}
	ul.blog-list li.blog-item strong {margin-bottom: 5px}
}

@media (max-width: 480px) {
	/******************************
		모집과정 & 이미지게시판
	******************************/
	ul.lecture-list {grid-template-columns: repeat(1, 1fr)}
	.lecture-list {grid-template-columns: repeat(1, 1fr)}
	
	.board-list tbody td.m-only .title {font-size: 14px}
	.board-list tbody td.m-only .top {font-size: 12px}
	.board-list tbody td.m-only ul.m-data-list li {font-size: 12px}
}

input::placeholder {font-size: 14px;}