
/* ========================================================
 * 서브페이지 공통
======================================================== */

.sub-content .container {
	position: relative;
	margin: 0 auto;
	margin-bottom: 8rem;
}

.sub-title-wrap {
	border-bottom: 1px solid #cecece;
	padding-bottom: .8rem;
	margin-bottom: 2.4rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.breadcrumb-wrap {
	display: flex;
	align-items: flex-start;
	flex-direction: row;
}

.breadcrumb-wrap .breadcrumb {
	display: flex;
	gap: .4rem;
	width: 100%;
}

.breadcrumb-wrap .breadcrumb .home {
	gap: 0;
}

.breadcrumb-wrap .breadcrumb li {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	font-size: 1.5rem;
}

.breadcrumb-wrap .breadcrumb .home::before {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	content: "";
	width: 2.4rem;
	height: 2.4rem;
	background: url(../../images/new/edu/i_bread_home.png) no-repeat center;
}

.breadcrumb-wrap .breadcrumb li .txt {
	font-size: 1.4rem;
	color: #717171;
}

.breadcrumb-wrap .breadcrumb li:not(:last-child)::after {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	content: "";
	width: 1.6rem;
	height: 1.6rem;
	margin-left: .4rem;
	background: url(../../images/new/edu/i_bread_ar.png) no-repeat;
	background-size: contain;
}

.sub-title-wrap h4 {
	font-size: 2.4rem !important;
	font-weight: 700;
	color: #222 !important;
}

.sub-title-wrap .sub-title-utill {}

.sub-title-wrap .sub-title-utill ul {
	display: flex;
	align-items: center;
	gap: .8rem;
}

.sub-title-wrap .sub-title-utill ul li {
	position: relative;
}

.sub-title-wrap .sub-title-utill ul li a {
	width: 4rem;
	height: 4rem;
	border: 1px solid #cecece;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.sub-title-wrap .sub-title-utill ul li a:hover {
	background: #f4f5f6;
	transition: all .25s;
}

.sub-con-wrap {
	width: 100%;
	height: 100%;
	position: relatitve;
}

/* ========================================================
* contents
======================================================== */


.online-search-box {
	background: #f4f5f6;
	position: relative;
	margin-bottom: 2.4rem;
	border-radius: .8rem;
}

.online-search-box>.inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 2;
	padding: 3.2rem 0;
}

.edu-sch-wrap>.inner form{
	width: 100%;
}

.online-search-box>.inner>div {}

.online-sch-form {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	gap: 1.6rem;
}

.online-sch-form .sch-input {
	width: 50rem;
	position: relative;
}

.online-sch-form .sch-input .form-control {
	border-radius: .8rem;
	box-sizing: border-box;
	border: 2px solid var(--primary);
}

.online-sch-form .top-sch .ico-sch-or {
	position: absolute;
	top: 50%;
	right: 1.6rem;
	transform: translateY(-50%);
	background: url(../../images/new/edu/i_search_o24.png) no-repeat;
	width: 2.4rem;
	height: 2.4rem;
}

.btn-detail {
	background: var(--primary);
	border-radius: .8rem;
	color: #fff;
}

.btn-detail:hover {
	background: #C6360E;
}

.btn-detail::before {
	background-image: url('../../images/new/edu/i_search_detail_w24.png');
	width: 1.6rem;
	height: 1.6rem;
}

.sch-list-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: .8rem;
}

.sch-list-top.nowrap{
	flex-wrap: nowrap;
  flex-direction: row;
}

.sch-list-top .nt-info {}

.sch-list-top .sch-info{
	margin-right: auto;
}

.sch-list-top .sch-info .keyword {
	color: var(--primary);
	font-weight: 600;
	margin: 0 .4rem;
	background: transparent;
}

.sch-list-top .sch-sort li {
	display: flex;
	align-items: center;
}

.sch-list-top .sch-sort .sort-label {
	font-weight: 600;
	white-space: nowrap;
	margin-right: 1.2rem;
}

.sch-list-top .sch-sort .w-sort-btn {
	display: flex;
	align-items: center;
	gap: 1.6rem;
}

.sch-list-top .sch-sort .w-sort-btn button.active {
	text-decoration: underline;
	color: var(--primary);
	font-weight: 500;
}

.sch-list-top .sch-sort .w-sort-btn button:hover {
	border-radius: .6rem;
	background-color: #FCECE7;
	transition: 0.4s ease-in-out;
}

.sch-list-top .sch-list-left {
	display: inline-flex;
	align-items: center;
	gap: .8rem
}

.sch-list-top .sch-list-right {
	display: inline-flex;
	align-items: center;
	gap: .8rem
}

/* 검색에 체크박스 추가(나의 수강현황쪽)*/
.filter-chk-wrap{
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem;
}

/* 검색 리스트 ----- */
.search-list {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-gap: 2.4rem;
	row-gap: 6rem;
	margin-top: 2rem;
}

.search-list .li {
	position: relative;
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
	box-sizing: border-box;
}

.search-list .li>div>a {
	display: block;
}

.pro-thumbnail img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.process-item:hover .pro-thumbnail img {
	transform: scale(1.05);
	transition: all .25s;
}

/* 오픈클래스 */
.search-list.openClass .pro-thumbnail{
	border: 1px solid #cecece;
	border-radius: 1.2rem;
}
.search-list.openClass .pro-la-date{
	display: none;
}

/* 학습 상세리스트 */
.learn-detail-wrap {
	background: #F5F8FA;
	padding: 4rem;
	border-radius: 1.2rem;
	display: flex;
	align-items: flex-start;
	gap: 3.2rem;
}

.ld-thumb {
	border-radius: 1.2rem;
	overflow: hidden;
	max-width: 28rem;
	width: 100%;
	height: auto;
}

.ld-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ld-info {
	/*flex: 1;*/
	width: 100%;
}

.ld-info .label-wrap {
	margin-bottom: 1rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.label-wrap .label-zone>li {
	background: #fff;
}

.label-wrap .ld-icon-wrap,
.lf-process-wrap .ld-icon-wrap {
	display: inline-flex;
}

.label-wrap .ld-icon-wrap a,
.lf-process-wrap .ld-icon-wrap a {
	width: 2rem;
	height: 2rem;
	border-radius: 100%;
	display: block;
	padding: .5rem;
}

.label-wrap .ld-icon-wrap a:hover {
	background: #E3EBF1;
	transition: all .25s ease;
}

.ld-info .pro-name {
	font-weight: 700;
	word-break: keep-all;
	display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.star-wrap {
	display: flex;
	align-items: center;
	gap: .8rem
}

.star-ratings {
	color: #cecece;
	/*별점 안채워진 곳 color*/
	position: relative;
	unicode-bidi: bidi-override;
	width: max-content;
}

.star-ratings-fill {
	color: #747474;
	padding: 0;
	z-index: 1;
	display: flex;
	overflow: hidden;
	-webkit-text-fill-color: #747474;
}

.star-ratings-fill span {}

.star-ratings-base {
	z-index: 0;
	padding: 0;
}

.star-grade-wrap span,
.star-grade-wrap span strong {
	font-size: 1.5rem;
}

.ld-info .info-con {
	margin-top: 1rem;
}

.ld-info .info-con ul {
	display: flex;
	flex-wrap: wrap;
	margin-top: 1.6rem;
}

.ld-info .info-con li {
	line-height: normal;
	flex: 1 1 40%;
	display: inline-flex;
}

.ld-info .info-con li+li {
	margin-top: .4rem;
}

.ld-info .info-con li strong {
	display: inline-block;
	min-width: 7rem;
}

.ld-info .info-con li strong,
.ld-info .info-con li span {
	font-size: 1.5rem;
}

.learn-con-wrap {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
	margin-top: 6rem;
	position: relative;
}

.learn-con-wrap.edu-lrn-con-wrap {
	display: block;
}

.learn-con {
	flex: 1;
}

.learn-con .lc-tab-wrap {
	position: sticky;
	top: 0;
	left: 0;
	background: #fff;
	z-index: 1;
}

.learn-con .lc-tab-wrap ul {
	display: flex;
	border-bottom: 1px solid #cecece;
	width: 100%;
}

.learn-con .lc-tab-wrap ul li {
	min-width: 0;
	width: calc(100% / 4);
	padding: 1.2rem 0;
	text-align: center;
	position: relative;
	margin: 0 .4rem;
}

.learn-con .lc-tab-wrap ul li a:hover {
	color: var(--primary);
	transition: all .25s ease;
}

.learn-con .lc-tab-wrap ul li.active a {
	color: var(--primary);
	font-weight: 700;
}

.learn-con .lc-tab-wrap ul li.active::after {
	position: absolute;
	content: '';
	width: 100%;
	height: 2px;
	background: var(--primary);
	bottom: 0;
	left: 0;
}

.learn-con .lc-cont {}

.learn-con .lc-cont .lc-item-box {
	padding-top: 6rem;
}

.learn-con .lc-cont .lc-item-box .lc-title {
	font-size: 2rem;
	font-weight: 700;
	position: relative;
	display: inline-block;
  margin-bottom: 1rem;
}

.learn-con .lc-cont #detail-con1 .lc-title{
	margin-bottom: 2rem;
}

.learn-con .lc-cont .lc-item-box .lc-title::after {
	position: absolute;
  content: '';
  width: .6rem;
  height: .6rem;
  background: var(--primary);
  top: 0px;
  right: -12px;
  border-radius: 50%;
}

.learn-con .lc-cont .lc-item-box .cd-item {
	border-bottom: 1px dashed #cecece;
	padding-bottom: 2rem;
}

.learn-con .lc-cont .lc-item-box .cd-item p,
.file-item p {
	font-size: 1.8rem;
	font-weight: 600;
	margin-bottom: .8rem;
	position: relative;
	padding-left: 1.6rem;
}

.learn-con .lc-cont .lc-item-box .cd-item p::before,
.file-item p::before{
	content: '';
	position: absolute;
	width: 10px;
	height: 4px;
	background: #EC9881;
	display: inline-block;
	top: 10px;
	left: 0;
}

.learn-con .lc-cont .lc-item-box .cd-item+.cd-item {
	margin-top: 3.2rem;
}

.learn-con .lc-cont .lc-item-box .cd-item ul li {
	position: relative;
	/*padding-left: 1.6rem;*/
	word-break: keep-all;
}

.learn-con .lc-cont .lc-item-box .cd-item ul li+li {
	margin-top: .8rem;
}



.learn-con .lc-cont .lc-item-box .cd-item ul li::before {
	/*content: '';
	position: absolute;
	width: 10px;
	height: 4px;
	background: #EC9881;
	display: inline-block;
	top: 10px;
	left: 0;*/
}

.learn-con .lc-cont .lc-item-box .file-item {
	margin-top: 3.2rem;
}

.file-item .file-list {
	background: #F7F8FA;
	padding: .8rem;
	border-radius: .6rem;
}

.file-item .file-list+.file-list {
	margin-top: .8rem;
}

.file-item .file-list a {
	font-size: 1.5rem;
	position: relative;
	padding-left: 2.4rem;
}

.file-item .file-list a:hover {
	text-decoration: underline;
}

.file-item .file-list a::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url('../../images/new/edu/i_download.png');
	width: 2rem;
	height: 2rem;
}

/* 게시판 파일첨부 커스텀 */
.con_file .file-item li {
	background: #F7F8FA;
	padding: .8rem;
	border-radius: .6rem;
	margin-top: .8rem
}

.con_file .file-item li a#fileName {
	font-size: 1.5rem;
	position: relative;
	padding-left: 2.4rem;
}

.con_file .file-item li a#fileName::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url('../../images/new/edu/i_download.png');
	width: 2rem;
	height: 2rem;
}

.con_file .file-item li a.del {
  font-size: 1.2rem;
  background: #fff;
  border: 1px solid #cecece;
  padding: .2rem .8rem;
  border-radius: .4rem;
  margin-left: .8rem;
  transition: all .25s ease;
}

.con_file .file-item li a.del:hover {
	background: #eee;
}

table .form-file {
	width: 100%;
}




.curriculum-text, .document-text {
	position: relative;
	padding-left: 2rem !important;

}

.curriculum-text::before {
	position: absolute;
	content: '';
	background: url(../../images/new/edu/i_cur_play.png);
	width: 15px;
	height: 15px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.document-text::before {
	position: absolute;
	content: '';
	background: url(../../images/new/edu/i_cur_document.png);
	width: 15px;
	height: 15px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.review-avg-box {
	background: #FDF5F3;
	border: 1px solid #F6D0C5;
	border-radius: 1.2rem;
	text-align: center;
	padding: 2rem 0;
	margin-top: 2rem;
}

.review-avg-box p {
	color: #717171;
	font-size: 1.5rem;
}

.review-avg-box .review-star {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2.4rem;
}

.review-avg-box .review-star span {
	font-size: 3.2rem;
	font-weight: 700;
}

.recommend-zone {
	margin-top: 8rem;
}

.recommend-zone .process-title h3 {
	font-size: 2.5rem;
}

.recommend-zone .recommend-item {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 2.4rem;
	margin-top: 2rem;
}


.review-view-wrap {
	margin-top: 4rem;
	border-bottom: 1px solid #cecece;
	padding-bottom: 3.2rem;
}

.rv-user-info {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.rv-user-info .rv-user {
	display: inline-flex;
	align-items: center;
	gap: .8rem;
}

.rv-user-info .rv-user img {
	width: 4rem;
	height: 4rem;
	border: 1px solid #cecece;
  border-radius: 50%;
  box-sizing: border-box;
}

.rv-user-info .rv-user .rv-user-name-zone {}

.rv-user-name-zone .rv-user-name {}

.rv-user-name .review-name {
	font-weight: 700;
	margin-right: .4rem;
}

.rv-user-name .review-grade {
	color: #386FA4;
	font-weight: 700;
	background: #ECF1F6;
	padding: .4rem;
	font-size: 1.5rem;
	border-radius: .4rem;
}

.rv-user-name-zone ul {}

.rv-user-name-zone ul li {
	display: inline-block;
	font-size: 1.5rem;
	color: #717171;
	position: relative;
}

.rv-user-name-zone ul li:not(:first-child)::before {
	content: '';
	width: 1px;
	height: 10px;
	background: #717171;
	display: inline-block;
	margin: 0 .4rem;
}

.btn-more-dot {
	width: 2rem;
	height: 2rem;
	transition: all .25s ease;
	position: relative;
}

.btn-more-dot:hover {
	background: #f4f5f6;
	border-radius: 50%;
}

.more-detail {
	box-shadow: 0 0 8px rgba(0, 0, 0, .1);
	width: max-content;
	position: absolute;
	top: 25px;
	right: 0;
	padding: 1rem 2rem;
	border-radius: .4rem;
	background: #fff;
}

.more-detail ul li a {
	font-size: 1.4rem;
	line-height: 3rem;
}

.more-detail ul li a:hover {
	text-decoration: underline;
}

.i-more-dot {
	content: url(../../images/new/edu/i_more_dot.png);
}

.review-view-star {
	display: flex;
	gap: .8rem;
	margin-top: 1.6rem;
}

.review-view-star .rv-avg-num {
	font-weight: 700;
	font-size: 1.5rem;
}

.review-view-star .star-standard {
	font-size: 1.5rem;

}

.review-content {
	margin: 2.4rem 0 2rem 0;
	word-break: keep-all;
}

.review-modify {}

.review-utill-zone {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.review-utill-zone .review-utill {
	display: inline-flex;
	gap: .8rem;
}

.review-utill-zone button {
	border-radius: 2.4rem !important;
}

.review-utill-zone button:hover {
	background: #f1f2f3;
	
}

.review-utill-zone button.good.active{
	background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.review-utill-zone button.good.active img{
 filter: brightness(0) invert(1); /* 흰색 효과 */
}
.review-utill-zone button.good.active span{
	color: #fff;
}

.review-utill-zone span {
	font-size: 1.5rem;
}

.review-write {
	background: #f7f8f9;
	padding: 1.6rem;
	margin: 2rem 0;
	border-radius: .8rem;
}

.review-write .btn-wrap,
.review-modify .btn-wrap {
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	flex-direction: row;
	gap: .8rem;
	margin-top: 2rem;
}

.textarea-wrap {
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
}

.textarea-wrap .text-control:placeholder-shown {
	-webkit-box-orient: inherit;
}

.text-control:placeholder-shown {
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

textarea.text-control {
	height: 9rem;
	padding: 1.6rem;
	line-height: 1.5;
	border: 1px solid #cecece;
	border-radius: .8rem;
}

.reviewer-box {
	background: #f7f8f9;
	padding: 2rem;
	margin: 2rem 0;
	border-radius: .8rem;
}

.reviewer-box+.reviewer-box {
	margin-top: 1.6rem;
}

.reviewer-box .reviewer-info {
	display: flex;
	justify-content: space-between;
}

.reviewer-box .reviewer-info .rv-date {
	color: #717171;
	font-size: 1.5rem;
}

.review-b-write {
	background: #FDF5F3;
	padding: 2.4rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 1.2rem;
	margin-top: 2rem;
	flex-wrap: wrap;
  gap: 2rem;
}

.review-b-write .review-b-text {}

.review-b-write .review-b-text p {
	font-size: 1.5rem;
	color: #444;
	margin-top: 1rem;
}

.review-b-write .review-b-text .rb-title {
	color: var(--primary);
	font-size: 1.9rem;
	font-weight: 700;
}

.rv-right-zone {
	display: flex;
	align-items: center;
	gap: 2.4rem;
}

/* 상세 하단 고정바 추가 */
.edu-bottomBar-wrap {
	transition-property: all;
	transition-duration: .4s;
	transition-timing-function: ease-in-out;
	position: fixed;
	bottom: 2rem;
	left: 50%;
	z-index: 1001;
	width: 95%;
	/*transform: translateZ(0);*/
	transform: translateX(-50%);

}

.edu-bottomBar-wrapHidden {
	bottom: 0;
	transform: translateY(100%);
}

.edu-bottomBar {
	margin-right: auto;
	margin-left: auto;
	max-width: 98rem;
	display: flex;
	justify-content: center;
	gap: 4rem;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
	padding: 1.2rem 0;
	border-radius: 1.2rem;
}

.edu-bottomBar::after {
	content: "";
	position: absolute;
	max-width: 98rem;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	top: 0;
	z-index: -1;
}

.edu-bottom-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ld-info-inputWrap .input-group {
	width: 100%;
	max-width: 90rem;
  min-width: 18rem;
}

/* 하이브리드과정 상세페이지 추가 */
.hy-list100 {
	flex: 1 1 100% !important;
}

/*플로팅 박스*/
.lf-box {
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	max-width: 30rem;
	position: sticky;
	top: 16px;
	right: 0;
}

.lf-box .lf-inner {
	margin: 0 1.6rem;
}

.lf-box .lf-process-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #cecece;
	padding: 16px 0 10px 0;
}

.lf-box .lf-process-wrap p {
	font-weight: 700;
	font-size: 1.9rem;
}

.lf-process-wrap .ld-icon-wrap a:hover {
	background: #f4f5f6;
	transition: all .25s ease;
}

.lf-process-info {
	border-bottom: 1px solid #cecece;
}

.lf-process-info ul {
	margin: 1rem .4rem;
}

.lf-process-info ul li span,
.lf-process-info ul li strong {
	font-size: 1.5rem;
	line-height: 1.6;
}

.lf-process-info ul li strong {
	width: 6rem;
	display: inline-block;
}

.lf-input-zone {
	margin: 1.6rem 0;
}

.state-zone {
	width: 100%;

}

.state-zone button {
	width: 100%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.modal-star {
	margin: 0 auto;
}

.modal-star .star-ratings-fill span {
	font-size: 4rem;
}

.radio-group {
	display: flex;
	gap: .8rem;
}

.radio-group legend {
	font-weight: 700;
	margin-bottom: .8rem;
	font-size: 1.5rem;
}

.form-group {
	display: flex;
	flex-direction: column;
	gap: .8rem;
	width: 100%;
}

.form-group .form-tit {
	font-weight: 700;
}

.form-group .form-group-tit .form-tit-pw {}

.form-group .form-tit-sm {
	font-weight: 500;
}

.form-group .form-tit-sm label {
	font-size: 1.5rem;
	color: #444;
}

.form-group .form-conts {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.form-group .form-conts.datepicker-conts {
	gap: 0;
}

.datepicker-input {
	position: relative;
	z-index: 1;
}

.checkbox-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
}

.checkbox-wrap .form-chip {}





/*스텝*/
.modal .modal-dialog .modal-conts .step-area {
	gap: 2rem !important;
}

.step-wrap {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-direction: row;
}

.step-wrap>li {
	flex: 1;
	position: relative;
	font-size: 1.5rem;
}

.step-wrap>li::after {
	position: absolute;
	top: 1rem;
	left: 0;
	content: "";
	width: 100%;
	height: 0.1rem;
	background-color: #c6c6c6;
}

.step-wrap>li:last-child:after {
	display: none;
}

.step-wrap>li.done::after {
	background-color: #C5360D;
}

.step-wrap>li>span {
	display: flex;
	flex-direction: column;
	position: relative;
	padding-top: 3.2rem;
	padding-right: 3.2rem;
}

.step-wrap>li>span:last-child {
	padding-right: 0;
}

.step-wrap>li:last-child {
	flex: 0;
}

.step-wrap>li>span::before,
.step-wrap>li>span::after {
	content: "";
	border-radius: 100%;
}

.step-wrap>li>span::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 1.8rem;
	height: 1.8rem;
	background-color: #e4e4e4;
	border: 1px solid #e4e4e4;
}

.step-wrap>li.done>span::before {
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 0.2rem;
	border: 0;
	background-color: var(--primary);
}

.step-wrap>li .step {
	color: #717171;
}

.step-wrap>li .step-tit {
	font-weight: 700;
	white-space: nowrap;
}

.step-wrap>li.done>span::after {
	position: absolute;
	top: 0.4rem;
	left: 0.2rem;
	z-index: 3;
	width: 1.2rem;
	height: 1.2rem;
	background: url(../../images/new/edu/i_check_12.png) no-repeat;
	background-position: center;
	background-size: contain;
}

.step-wrap>li.active>span::before {
	background-color: #fff;
	border-color: var(--primary);
}

.step-wrap>li.active>span::after {
	position: absolute;
	top: 0.4rem;
	left: 0.4rem;
	z-index: 3;
	width: 1.2rem;
	height: 1.2rem;
	background: var(--primary) url(../../images/new/edu/i_step_active.png) no-repeat center;
	background-size: contain;
}

.agree-area {}

.terms-agree-all {
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
	gap: .8rem;
}

.terms-agree-all .form-check input[type=checkbox]~label {
	font-weight: 700;
	line-height: 2.4rem;
	padding-left: 4rem;
}

.terms-agree-all .form-check input[type=checkbox]~label::before {
	width: 2.4rem;
	height: 2.4rem;
}

.terms-agree-all .form-check input[type=checkbox]~label::after {
	width: 2rem;
	height: 2rem;
	background-size: contain;
}

.terms-agree-all .conts-desc {
	color: #717171;
}

.terms-agree-ul {
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
	gap: 2.4rem;
}

.terms-agree-ul label {
	font-size: 1.5rem;
}

.agree-box {
	max-height: 18rem;
	padding: 1rem;
	border: 1px solid #cecece;
	border-radius: .8rem;
	overflow-y: visible	;
	margin-top: .8rem;
}

.chk-area {
	justify-content: flex-end;
	margin-top: 2rem;
}

.agree-box .txt {
	font-size: 1.4rem;
}

.agree-box .form-check {
	text-align: center;
}

.st-class-box {
	border: 1px solid var(--primary);
	background: #fff;
	box-shadow: 0 0 10px rgba(219, 60, 15, .2);
	border-radius: 1.2rem;
	padding: 2.4rem;
  width: -webkit-fill-available !important;
  margin: 0 auto;
}

.st-class-box .st-class-title {
	color: var(--primary);
	font-weight: 700;
	font-size: 1.9rem;
}

.st-class-box ul {
	margin-top: .8rem;
}

.st-class-box ul li+li {
	margin-top: .4rem;
}

.st-class-box ul li strong {
	margin-right: 1.2rem;
}

.st-class-box ul li strong,
.st-class-box ul li span {
	font-size: 1.5rem;
}

.table-top {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: .8rem;
	margin-bottom: 1.2rem;
}

.btn-tooltip {
	width: 2.4rem;
	height: 2.4rem;
	vertical-align: middle;
	position: relative;
}

.btn-tooltip.sm .i-tooltip {
	width: 2rem;
	height: 2rem;
}

.btn-tooltip.right-tooltip {}

.i-tooltip {
	content: url(../../images/new/edu/i_tooltip.png);
}

.table-input {
	display: flex;
	gap: .8rem;
}

/* 툴팁 */
.btn-tooltip::after,
.text-tooltip::after {
	content: attr(data-tooltip);
	position: absolute;
	bottom: 100%;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(0, 0, 0, 0.8);
	color: white;
	padding: 0.5rem 1rem;
	border-radius: 0.25rem;
	white-space: pre-line;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s;
	font-size: 1.3rem;
	width: 200px;
	word-break: keep-all;
	z-index: 99;
	font-weight: 400;
	max-width: 60vw;
	white-space: normal;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.right-tooltip::after {
	content: attr(data-tooltip);
	position: absolute;
	top: 50%;
	bottom: auto;
	left: 150%;
	transform: translateY(-50%);
	white-space: pre-line;
	background-color: #333;
	color: #fff;
	padding: 5px;
	border-radius: 3px;
	opacity: 0;
	transition: opacity 0.3s;
	pointer-events: none;
	width: max-content;
}

.bottom-tooltip::after {
	content: attr(data-tooltip);
	position: absolute;
	bottom: -280%;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(0, 0, 0, 0.8);
	color: white;
	padding: 0.5rem 1rem;
	border-radius: 0.25rem;
	white-space: pre-line;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s;
	font-size: 1.3rem;
	width: 200px;
	word-break: keep-all;
	z-index: 99;
	font-weight: 400;
}

.text-tooltip::after {
	bottom: -200%;
}

.btn-tooltip:hover::after,
.text-tooltip:hover::after {
	opacity: 1;
}

.sv-tooltip::after {
	width: 60rem;
	text-align: left;
	padding-left: 1.2rem;
}

.class-complete {
	text-align: center;
	margin: 2rem 0;
}

.class-complete img {
	display: inline-block;
	width: unset;
	height: unset;
}

.class-complete p {
	font-weight: 700;
	margin-top: 1.2rem;
}

/* 과정 콘텐츠 리스트 */
.all-play {
	display: inline-grid;
}

.all-play .btn {
	font-size: 1.9rem;
}

.play-con-list {}

.play-con-list li {
	border: 1px solid #cecece;
	border-radius: .8rem;
	transition: all .25s ease;
	padding: 1.2rem 2rem;
}

.play-con-list li+li {
	margin-top: .8rem;
}

.play-con-list .play-con-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
}

.play-con-list li:hover {
	border: 1px solid var(--primary);
	box-shadow: 0 0 10px rgba(219, 60, 15, .2);
}

.play-con-list li:hover span,
.play-con-list li:hover p {
	color: var(--primary);
}

.play-con-list .playtime span {
	position: relative;
	font-size: 1.5rem;
	padding-right: 2rem;
}

.play-con-list .playtime span::after {
	content: '';
	position: absolute;
	background: url(../../images/new/edu/i_cur_play.png) no-repeat center;
	width: 1.5rem;
	height: 1.5rem;
	top: 1px;
	right: 0;

}

.play-con-list li:hover .playtime span::after {
	background: url(../../images/new/edu/i_cur_play_or.png) no-repeat center;
}

.learn-img {
	border-radius: 1.2rem;
	overflow: hidden;
	width: 100%;
	height: unset;
	text-align: center;
}

.learn-img.l01 {
	background: #ecf0ff;
}

.learn-img.l02 {
	background: #ffe9e9;
}

.learn-img.l03 {
	background: #f8f3ff;
}

/*.process-container{
margin: 3.2rem 0;
background: #f4f5f6;
border-radius: 1.2rem;
}
.pcs-inner{
display: flex;
justify-content: space-between;
padding: 3.2rem 4.8rem;
}
.pcs-inner .pcs-step{
background: #fff;
border: 1px solid;
width: calc(100% / 6 - 48px);
border-radius: 3.2rem;
display: flex;
flex-direction: column;
align-items: center;
gap: .8rem;
padding: 2rem 0;
position: relative;
}
.pcs-inner .pcs-step:not(:last-child)::after{
content: '';
position: absolute;
background: url(../../images/new/edu/i_learn_pcs.png) no-repeat center;
width: 20px;
height: 20px;
top: 50%;
right: -30%;
transform: translateY(-50%);
}
.pcs-inner .pcs-step .step-num{
font-weight: 700;
}
.pcs-inner .pcs-step .step-name{
color: #fff;
padding: .2rem 1.6rem;
min-width: 8rem;
border-radius: 1.6rem;
text-align: center;
}
.pcs-step.s01{
border-color: #9FD9F2;
}
.pcs-step.s01 .step-num{
color: #3EB2E4;
}
.pcs-step.s01 .step-name{
background: #3EB2E4;
}
.pcs-step.s02{
border-color: #9BC6EC;
}
.pcs-step.s02 .step-num{
color: #368CD8;
}
.pcs-step.s02 .step-name{
background: #368CD8;
}
.pcs-step.s03{
border-color: #95B7D4;
}
.pcs-step.s03 .step-num{
color: #2A6EA9;
}
.pcs-step.s03 .step-name{
background: #2A6EA9;
}
.pcs-step.s04{
border-color: #8FA7BD;
}
.pcs-step.s04 .step-num{
color: #1E4F7A;
}
.pcs-step.s04 .step-name{
background: #1E4F7A;
}
.pcs-step.s05{
border-color: #879EA6;
}
.pcs-step.s05 .step-num{
color: #0F3C4D;
}
.pcs-step.s05 .step-name{
background: #0F3C4D;
}
.pcs-step.s06{
border-color: #879EA6;
}
.pcs-step.s06 .step-num{
color: #143450;
}
.pcs-step.s06 .step-name{
background: #143450;
}
*/

/* 러닝맵과정 - 강의실 */

/* 전체 스크롤바 트랙 (배경) */
.learning-content .lrn-gnb-zone::-webkit-scrollbar,
.ab-resultDetail-data::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

/* 스크롤바 Thumb (움직이는 부분) */
.learning-content .lrn-gnb-zone::-webkit-scrollbar-thumb,
.ab-resultDetail-data::-webkit-scrollbar-thumb {
	background-color: #c6c6c6;
	border-radius: 10px;
	border: 2px solid transparent;
	background-clip: content-box;
}

/* 스크롤바 트랙 (Thumb이 움직이는 영역) */
.learning-content .lrn-gnb-zone::-webkit-scrollbar-track,
.ab-resultDetail-data::-webkit-scrollbar-track {
	background-color: transparent;
	border-radius: 10px;
}


.modal .modal-dialog.lrn-modal {
	width: 100%;
	min-height: 100vh;
	height: 100vh;
	margin: 0 auto;
	background: #fff;
}

/* 러닝맵 모달 스타일 추가 */

.learning-content .btn-close {
	top: 0 !important;
	right: 0 !important;
}

.modal .modal-dialog.lrn-modal .learning-content {}

.learning-content .lrn-gnb-zone {
	position: fixed;
	top: 0;
	left: 0;
	background: #f7f8fa;
	border-radius: 0;
	padding: 1.6rem 2rem;
	height: 100vh;
	min-width: 28rem;
	transition: width 0.3s ease;
}

.lrn-gnb-zone {}

.learning-content .lrn-gnb-zone:hover {
	overflow-x: auto;
}

.learning-content .lrn-cont-zone {
	position: absolute;
	top: 0;
	right: 4.8rem;
	left: 32rem;
	padding-left: 4.8rem;
	height:100%;
}

.learning-content .modal-header {
	margin-top: 1.6rem;
	position: relative;
}

.lrn-user-zone {
	display: flex;
	align-items: center;
	gap: 1.6rem;
	justify-content: flex-end;
	margin-right: 4.4rem;
}

.user-profile {
	display: flex;
	align-items: center;
	gap: .8rem;
	background: #f4f5f6;
	padding: .4rem 2rem;
	border-radius: .8rem;
}

.user-profile img {
	width: 3.2rem;
	height: 3.2rem;
  border: 1px solid #cecece;
  border-radius: 50%;
  box-sizing: border-box;
}

.user-profile p {
	font-size: 1.4rem;
	font-weight: 700;
}

.user-message {
	background: url(../../images/new/edu/ico_message.png) no-repeat center;
	width: 3.2rem;
	height: 3.2rem;
}

.lrn-name {
	background: var(--primary);
  padding: 2.4rem 1.6rem;
  text-align: center;
	border-radius: .8rem;
}

.lrn-name span {
	color: #fff;
	font-weight: 700;
	font-size: 1.9rem;
	display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: keep-all;
}

.lrn-gnb {
	padding-bottom: 4rem;
	width: 28rem;
}

.lrn-gnb ul {
	display: flex;
	flex-direction: column;
	gap: .8rem;
	margin-top: 2rem;
}

.lrn-gnb ul li {
	border-radius: .8rem;
	transition: all .25s ease;
	display: flex;
	align-items: center;
}

.lrn-gnb ul li + li{
	margin-top: .8rem;	
}

.lrn-gnb ul li.active,
.lrn-gnb ul .lrn-class-box.ling {
	border: 1px solid var(--primary);
	background: #fff;

}

.lrn-gnb ul li.active,
.lrn-gnb ul .lrn-class-box.ling a {
	/*box-shadow: 0 0 10px rgba(219, 60, 15, .2);*/
}

.lrn-gnb ul li a{
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 40px;
  line-height: 40px;
  word-break: keep-all;
  padding: 0 .8rem;
  color: #717171;
  flex: 1;
  font-size: 1.6rem;
}

.lrn-cont-name {
	padding: 1.2rem 1rem;
	color: #717171;
	display: block;
	word-break: keep-all;
	position: relative;
}

.lrn-gnb ul li:hover a {
	color: var(--primary);
}

.lrn-gnb ul li.active a,
.lrn-gnb ul .lrn-class-box.ling a {
	color: var(--primary);
	font-weight: 700;
	background: #fff;
	box-sizing: border-box;
	border-radius: inherit;
}

.lrn-gnb .pcs-txt {
	margin: 1rem 0;
	font-weight: 600;
	color: var(--primary);
}

.lrn-class-box {
	position: relative;
}

.lrn-class-box a {
	/*padding-left: 3.2rem !important;*/
}

.lrn-cont-name{
	padding-left: 2.4rem !important;
}

.lrn-std-title{
	display: none;
}



/* 하이브리드 추가 */

.lrn-section{
	margin-top: 2.4rem;
	padding-bottom: 2.4rem;
	border-bottom: 1px dashed #cecece;
}
.lrn-gnb .pcs-wrap + .pcs-wrap{
	margin-top: 1rem;
}

.lrn-gnb .pcs-txt-name{
  display: flex;
	align-items: stretch;
  gap: .8rem;
  background: rgba(0,0,0,.03);
  padding: .8rem;
  border-radius: .8rem;
  word-break: keep-all;
  font-size: 1.6rem;
}
.pcs-name{
	content: url('../../images/new/edu/i_class_book.svg');
}

.lrn-cont-name::before{
	position: absolute;
	content: '';
	background: url(../../images/new/edu/i_cur_play_g.png) no-repeat center;
	width: 1.6rem;
	height: 1.6rem;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

/*

.lrn-class-box a::before, .lrn-cont-name::before {
	position: absolute;
	content: '';
	background: url(../../images/new/edu/i_cur_play_g.png) no-repeat center;
	width: 1.6rem;
	height: 1.6rem;
	left: 1rem;
	top: 50%;
	transform: translateY(-50%);
}

.lrn-cont-name::before{
	left: 0;

 }
 
.lrn-class-box.comp a::before {
	background: url('../../images/new/edu/i_cur_complete.png') no-repeat center;
}

.lrn-class-box:not(.comp):hover a::before,
.lrn-gnb ul .lrn-class-box.ling a::before,
.lrn-class-box.active a::before {
	background: url('../../images/new/edu/i_cur_play_or.png') no-repeat center;
}
*/

.file-zone {
	vertical-align: middle;
}

.file-zone a {
	display: flex !important;
	align-items: center;
	gap: .8rem;
 /* height: unset !important;
 	line-height: unset !important;
 	*/
}

/* 파일아이콘 종류 */
.file-zone i {
	width: 2rem;
	height: 2rem;
}

.file-zone .file-pdf {
	content: url('../../images/new/edu/ico_pdf.png');
}

.file-zone .file-xls {
	content: url('../../images/new/edu/ico_xls.png');
}

.file-zone .file-doc {
	content: url('../../images/new/edu/ico_doc.png');
}

.file-zone .file-han {
	content: url('../../images/new/edu/ico_han.png');
}

.lrn-con-wrap {
	max-width: 100rem;
	margin: 3.2rem auto;
}

.lrn-con-wrap.lxpdf {
	max-width: 200rem !important;
	margin: 3.2rem auto;
}

.lrn-con-wrap.lxpdf .lrn-con {}

.lrn-con-wrap.lrs {
	max-width: initial;
	margin: initial;
	color: initial !important;
}

.lrn-con-wrap.lrs .bbc-lxPlayer .video-js .vjs-play-control span.vjs-icon-placeholder {
	font-style: 100%;
}

.lrn-con-wrap.lrs .bbc-lxPlayer .video-js .vjs-big-play-button span.vjs-icon-placeholder:before {
	font-size: 8.7em !important;
	color: #fff;
}

.lrn-con-wrap.lrs .bbc-lxPlayer .btn-bookmark {
	font-size: initial !important;
}

.lrn-con-wrap.lrs .bbc-lxPlayer .btn-bookmark i {
	color: #fff !important;
	font-size: 2em !important;
}

.lrn-con-wrap.lrs .bbc-lxPlayer .btn-list {
	font-size: initial !important;
}


.lrn-con-wrap.lrs .bbc-lxPlayer .btn-list i {
	color: #fff !important;
	font-size: 2em !important;
}

.bbc-lxPlayer .video-js .vjs-control-bar {
	background-color: #fff !important;
}

.bbc-lxPlayer .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
	background-color: #fff !important;
}

@media (max-width: 767px) {
	.lrn-con-wrap.lrs .bbc-lxPlayer .video-js .vjs-big-play-button span.vjs-icon-placeholder:before {
		font-size: 90px !important;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.lrn-con-wrap.lrs .bbc-lxPlayer .video-js .vjs-big-play-button span.vjs-icon-placeholder:before {
		font-size: 95px !important;
	}
}


.ft-gray {
	color: #717171;
}

.lrn-con {
	margin-bottom: 2.4rem;
}

.lrn-con .bbc-lxPlayer{
	max-width: 100%;
	margin: 3.2rem auto;
}

.lrn-con-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.6rem;
}

.lrn-con-tooltip {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.lrn-title-tooltip {
	display: inline-flex;
	align-items: center;
	gap: .8rem;
}

.lrn-con-wrap h4 {
	font-size: 1.9rem;
}

.lrn-con-wrap .lrn-sch {
	position: relative;
}

.lrn-con-wrap .lrn-sch .form-control {
	position: relative;
	width: 100%;
	height: 4.8rem;
	padding: 0 4.8rem 0 1.6rem;
	background-color: #f4f5f6;
	border-radius: 4.8rem;
	font-family: inherit;
	transition: 0.4s ease-in-out;
	border: 0;
}

.lrn-con-wrap .lrn-sch .ico-sch {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	background: url(../../images/new/edu/i_search_w24.png) var(--primary) no-repeat center center;
}

.lrn-con-wrap .form-control~.ico-sch {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
}

.lrn-list-wrap {
	margin-top: 2.4rem;
}

.lrn-list-wrap ul {}

.lrn-list-wrap ul li {
	border: 1px solid #cecece;
	border-radius: .8rem;
	transition: all .25s ease;
}

.lrn-list-wrap ul li+li {
	margin-top: .8rem;
}

.lrn-list-wrap ul li:not(.disabled):hover {
	/*border: 1px solid var(--primary);*/
}

.lrn-list-wrap ul li:not(.disabled):hover .lrn-txt {
	text-decoration: underline;
}

.lrn-list-wrap ul li a {
	display: block;
	padding: 2.4rem;
}

.lrn-list-wrap ul li .lrn-txt {
	font-weight: 700;
	margin: .8rem 0;
	word-break: keep-all;
}

.lrn-list-wrap ul li.btn-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 4rem;
}

.lrn-list-wrap ul li.btn-list .btn-list-txt {
	flex: 1;
}

.lrn-list-wrap ul li.disabled {
	background: #e1e2e3;
}

.lrn-list-wrap ul li.disabled p,
.lrn-list-wrap ul li.disabled span {
	color: #717171;
}

.lrn-list-wrap ul li.disabled .lrn-label-zone>* {
	background: #d8d8d8;
	border: 0;
}

.lrn-list-wrap ul li.disabled a {
	cursor: default;
}

.lrn-list-wrap .right-btn {}

.lrn-label-zone {}
.con_view_head .lrn-label-zone{
	display: inline-block;
	vertical-align: middle;
}


.lrn-label-zone .lb01,
.lrn-label-zone .lb02 {
	font-size: 1.4rem;
	padding: .4rem .8rem;
	border-radius: 2.4rem;
	font-weight: 600;
	white-space: nowrap;
}

.lrn-label-zone .lb01 {
	background: #ECF1F6;
	color: #386FA4;
}

.lrn-label-zone .lb02 {
	background: #E3F3E6;
	color: #006e18;
}

.lrn-post span {
	position: relative;
	display: inline-block;
	color: #717171;
	font-size: 1.5rem;
}

.lrn-post span:not(:first-child)::before {
	content: '';
	width: 1px;
	height: 10px;
	background: #717171;
	display: inline-block;
	margin: 0 .8rem;
}

.lrn-btn-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .8rem;
	margin-top: 2.4rem;
}

.lrn-review textarea.text-control {
	height: unset !important;
}

/* 설문 */
.lrn-survey-wrap {}

.lrn-survey-wrap .lrn-sv-box {
	margin-bottom: 2.4rem;
	flex: 1;
}

.lrn-sv-box li {
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	padding: 2.4rem;
	margin-top: 1.6rem;
}

.lrn-sv-box li:focus {
	border: 1px solid var(--primary);
}

.lrn-sv-box li+li {
	margin-top: 1.6rem;
}

.lrn-sv-box .sv-title {
	font-weight: 600;
	margin-bottom: 1.6rem;
	word-break: keep-all;
}

.sv-chk-wrap {}

.sv-chk-wrap .form-check+.form-check {
	margin-top: .8rem;
}

.sv-chk-wrap .form-check label {
	font-size: 1.5rem;
}

/* 시험 */
.lrn-sv-test {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
	position: relative;
}

.tf-box {
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	min-width: 23rem;
	position: sticky;
	top: 16px;
	right: 0;
}

.tf-title {
	border-bottom: 1px solid #cecece;
	margin: 0 2.4rem;
	padding: 1rem 0;
}

.tf-title,
.tf-title>* {
	color: var(--primary);
	text-align: center;
	font-weight: 600;
}

.tf-title>* {
	margin: 0 .4rem;
	font-weight: 700;
	font-size: 1.9rem;
}

.tf-title img {
	vertical-align: sub;
	margin-right: .8rem;
}

.tf-con {
	margin: 2rem 2.4rem;
}

.tf-con ul {}

.tf-con ul li {
	padding-left: 1rem;
	position: relative;
}

.tf-con ul li+li {
	margin-top: .4rem;
}

.tf-con ul li::before {
	content: '·';
	display: inline-block;
	position: absolute;
	left: 0;
	top: 0;
}

.tf-con ul li strong,
.tf-con ul li span {
	font-size: 1.5rem;
}

.tf-con ul li span {
	color: #717171;
}

.tf-btn {
	width: 100%;
}

.tf-btn button {
	width: 100%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.tr-result-wrap {
	display: flex;
	flex-direction: column;
	gap: 2.4rem;
}

.tr-top {
	display: flex;
	align-items: stretch;
	gap: 2.4rem;
}

.tr-top .tr-score {
	background-color: #F7F8FA;
	flex: 1;
	border-radius: 1.2rem;
	display: flex;
	align-items: center;
	justify-content: space-around;
	padding: 3rem 0;
}

.tr-top .tr-score .tr-visual {
	text-align: center;
}

.tr-top .tr-score .score-nb {
	color: var(--primary);
	font-size: 4rem;
	font-weight: 700;
	position: relative;
}

.tr-top .tr-score .score-nb::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 20px;
	background: rgba(219, 60, 15, .2);
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	padding: 0 1rem;
	border-radius: 1.2rem;
}

.tr-top .tr-info {
	background: #fff;
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	padding: 0 3.2rem;
	width: 24%;
}

.tr-top .tr-info .tr-info-title {
	text-align: center;
	font-size: 1.9rem;
	border-bottom: 1px solid #cecece;
	padding: 1.2rem 0;
	font-weight: 600;
}

.tr-top .tr-info .tr-info-con {
	margin-top: 1.6rem;
}

.tr-top .tr-info .tr-info-con ul li {
	position: relative;
	padding-left: 1.2rem;
}

.tr-top .tr-info .tr-info-con ul li span {
	color: #717171;
}

.tr-top .tr-info .tr-info-con ul li+li {
	margin-top: 1.2rem;
}

.tr-top .tr-info .tr-info-con ul li::before {
	position: absolute;
	content: '·';
	top: 0;
	left: 0;
	display: inline-block;

}

.tr-btm {
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	padding: 3.2rem;
}

.tr-btm .tr-btm-title {
	font-size: 1.9rem;
	font-weight: 600;
}

.tr-btm .tr-compare {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 2.4rem;
}

.tr-btm .tr-compare .tr-grade-zone {
	background: #f4f5f6;
	max-width: 26rem;
  width: 100%;
	text-align: center;
	padding: 2.4rem 0;
	border-radius: 1.2rem;
}

.tr-grade-zone .tr-grade-value {
	font-size: 2.1rem;
	font-weight: 700;
}

.grade-up {
	color: #008A1E;
	font-weight: 700;
	font-size: 2.1rem;
	position: relative;
}

.grade-up::before {
	content: '▲';
	color: #008A1E;
	font-size: 1.5rem;
	margin-right: 6px;
}

.grade-up::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 12px;
	background: rgba(0, 138, 30, .1);
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	padding: 0 .5rem;
	border-radius: 1.2rem;
}

.grade-down {
	color: #0074E5;
	font-weight: 700;
	font-size: 2.1rem;
	position: relative;
}

.grade-down::before {
	content: '▼';
	color: #0074E5;
	font-size: 1.5rem;
	margin-right: 6px;
}

.grade-down::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 12px;
	background: rgba(0, 116, 229, .1);
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	padding: 0 .5rem;
	border-radius: 1.2rem;
}

.tr-grade-time span {
	color: #717171;
	display: block;
}

/* 강의실 홈 */
.lrn-eduCont {}

.lrn-eduCont li {
	position: relative;
	font-size: 1.5rem;
	padding-left: 1.6rem;
	overflow: hidden;
	word-wrap: break-word;
	word-break: keep-all;
}

.lrn-eduCont li::before {
	content: '-';
	position: absolute;
	top: 0;
	left: 0;
}

/* 강의실 시간표 */
.lrn-timetable-info {
	border-top: 1px solid #222;
	border-bottom: 1px solid #cecece;
	margin-bottom: 4rem;
}

.lrn-timetable-info ul {
	padding: 2rem 4rem;
}

.lrn-timetable-info ul li {
	display: flex;
	position: relative;
	padding-left: 1rem;
}

.lrn-timetable-info ul li::before {
	position: absolute;
	content: '·';
	top: 0;
	left: 0;
}

.lrn-timetable-info ul li+li {
	margin-top: .6rem;
}

.lrn-timetable-info ul li strong {
	width: 8rem;
}

.lrn-timetable-info ul li span {
	color: #717171;
}

.lrn-time-wrap {
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	margin-top: 2.4rem;
}

.lrn-time-top {
	background: #f4f5f6;
	display: flex;
	justify-content: center;
	gap: 2rem;
	flex-wrap: wrap;
	border-top-left-radius: 1.2rem;
	border-top-right-radius: 1.2rem;
	padding: 1.6rem 0;
}

.lrn-time-top .lrn-top-info {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.lrn-time-top .lrn-top-info strong {
	position: relative;
}

.lrn-time-top .lrn-top-info strong::after {
	content: "|";
	margin-left: 10px;
	font-size: 12px;
	color: #717171;
	font-weight: 400;
	vertical-align: middle;
}

.lrn-time-bottom ul {}

.lrn-time-bottom ul li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.6rem 2.4rem;
	flex-wrap: wrap;
	gap: 1rem;
}

.lrn-time-bottom ul li:not(:last-child) {
	border-bottom: 1px solid #cecece;
}

.lrn-icon {
	width: 1.6rem;
	height: 1.6rem;
	display: inline-block;
	vertical-align: middle;
	margin-right: .8rem;
}

.i-book {
	background: url('../../images/new/edu/ico_book.png');
}

.i-time {
	background: url('../../images/new/edu/ico_time.png');
}

.lrn-time-right {
	display: flex;
	align-items: center;
	gap: 2.4rem;
	flex-wrap: wrap;
}

.lrn-btn-bu {
	background: #EBF5FF;
	color: #00407f;
}

.lrn-btn-bu:hover {
	background: #c7e3ff;
}

.lrn-btn-gr {
	background: #eef7ee;
	color: #004d00;
}

.lrn-btn-gr:hover {
	background: #cce6cc;
}

.lrn-btn-bw {
	background: #FDF7E9;
	color: #804106;
}

.lrn-btn-bw:hover {
	background: #faefd3;
}

.btn-tm{
	
}

/* 통합검색 */
.edu-sch-wrap>.inner {
	max-width: 63rem;
	width: 100%;
	margin: 0 auto;
	padding: 2.4rem 0;
}

.edu-sch-wrap .edu-detail-wrap span {
	font-size: 1.7rem;
	flex-shrink: 0;
}

.sch-btn-zone {
	display: flex;
	justify-content: flex-end;
	gap: .8rem;
	margin-top: 2.4rem;
	border-top: 1px solid #cecece;
	padding-top: 2.4rem;
}

.sch-result-wrap {
	margin-top: 4rem;
}

.sch-result-wrap:not(:last-child) {
	border-bottom: 1px solid #cecece;
	padding-bottom: 4rem;
}

.sch-result-wrap:only-child {
    border-bottom: none;
    padding-bottom: 0;
}


/* 페이지네이션 */

/*.pagination-wrap{
  display: flex;
  align-items: center;
  margin-top: 4rem;
  justify-content: center;
  gap: 2rem;
  flex-wrap: wrap;
}
*/

.pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .8rem;
	flex-wrap: wrap;
	margin-top: 4rem;
}

.pagination a {
	margin: 0 .4rem;
	width: 4rem;
	height: 4rem;
	text-decoration: none;
	color: #555555;
	font-size: 1.7rem;
	border-radius: .6rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.pagination a:not(.on):hover {
	border-radius: 0.6rem;
	background-color: #F0F0F0;
	transition: 0.4s ease-in-out;
}

/* 현재 페이지 스타일 */
.pagination .on {
	background-color: var(--primary);
	color: #fff;
}

/* 강의실 추가 */
.lrn-user-zone .btn-gnb-fold {
	margin-right: auto;
	display: none;
}

.lrn-user-zone .btn-gnb-fold::before {
	display: block;
	content: '';
	width: 2.4rem;
	height: 2.4rem;
	background: url(../../images/new/edu/gnb-fold.png) no-repeat;

}

.lrn-gnb-zone .btn-gnb-close {
	width: 2.4rem;
	height: 2.4rem;
	margin-bottom: 2.4rem;
	display: none;
}

.lrn-gnb-zone .btn-gnb-close::before {
	background: url(../../images/new/edu/i_close_b40.png) center no-repeat;
	display: block;
	content: '';
	width: 2.4rem;
	height: 2.4rem;
	background-size: contain;
}

.bbc-lxPlayer .vjs-button > .vjs-icon-placeholder:before,
.bbc-lxPlayer .video-js *:before, .bbc-lxPlayer .video-js *:after,
.bbc-lxPlayer .vjs-playback-rate .vjs-playback-rate-value,
.bbc-lxPlayer .video-js *{
	color: #fff;
}

.bbc-lxPlayer .video-js .vjs-menu-item-text{
	color: #222;
}

.bbc-lxPlayer .video-js .vjs-control{
	width: unset;
}

.bbc-pdf .secondaryToolbarButton > span, .bbc-pdf .findbar label:hover, .bbc-pdf .findbar input:focus + label{
	color: #fff !important;
}




/* ========================================================
 * 게시판 - 게시판 상세뷰
======================================================== */
.con_view {}

.con_view_head h3 {}

.con_view_head {
	border-top: 3px solid #222;
	border-bottom: 1px solid #d9d9d9;
	padding: 4rem;
	display: flex;
	gap: .8rem;
	flex-direction: column;
}

.con_view_head h1 {
	font-size: 2.5rem;
	font-weight: 700;
}

.con_view_head ul {
	display: flex;
	gap: 1.2rem;
	margin-top: 1.2rem;
}

.con_view_head ul li {
	color: #717171;
}

.con_view_head ul li span {
	font-weight: 500;
	margin-right: .8rem;
	color: #222;
}

.con_view_file {
	padding: 3.2rem;
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	border-bottom: 1px solid #d9d9d9;
}

.con_view_file .con1 {
	font-size: 1.7rem;
	font-weight: 500;
}

.con_view_file .con1 span.fop1 {
	font-size: 1.7rem;
	font-weight: 500;
	color: var(--primary);
}

.con_view_file .con1 span.fop2 {
	font-size: 1.4rem;
	color: #555;
	font-weight: 400;
}

.con_view_file ul li a span.fop1 {
	font-size: 1.4rem;
	color: #555;
	font-weight: 400;
}

.con_view_file ul li {
  background: #F7F8FA;
  padding: .8rem;
  border-radius: .6rem;
}

.con_view_file ul li + li{
	margin-top: .8rem;
}

.con_view_file ul li a{
	position: relative;
	padding-left: 2.4rem;
}

.con_view_file ul li a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background: url(../../images/new/edu/i_download.png);
  width: 2rem;
  height: 2rem;
}

.con_view_content {
	padding: 4rem;
	border-bottom: 1px solid #d9d9d9;
	transition: all 0.3s ease;
	color: #222;
	font-size: 1.7rem;
}

.con_btn_center {

	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 4rem;
	gap: .8rem;

}

.con_btn_center .btn.primary {
	padding: 0 4rem;
}

/* 강의실 게시판 정보수정 */
.lrn-con-wrap .con_view_head {
	border-top: 2px solid #222;
	padding: 2.4rem;
}

.lrn-con-wrap .con_view_head h3 {
	font-weight: 500;
}

.lrn-con-wrap .con_view_head h1 {
	font-size: 2.1rem;
}

/* 게시판 상세 나의정보 수정 */
.edu-notice-ul{
	align-items: center;
}
.edu-notice-ul li{
	position: relative;
  display: flex;
  align-items: center;
}
.edu-notice-ul li img{
   width: 3.2rem;
   height: 3.2rem;	
   border-radius: 50%;
   border: 1px solid #cecece;
   box-sizing: border-box;
}
.edu-notice-ul li:not(:first-child)::after, 
.edu-notice-ul.reply li:first-child::after{
	content: '|';
  margin-left: 10px; 
  color: #cecece; 
  font-size: 1.4rem;
	
}

.edu-notice-ul.reply li:not(:first-child)::after {
    content: none; 
}

.edu-notice-ul.reply li:last-child::after{
	display: none;
}

.edu-notice-ul li:nth-child(n+4)::after{
	display: none;
}

.edu-notice-ul li.last-li{
	margin-left: auto;
}


.registBtn{
	display: none;
}



/* 지역특화과정 - 지역선택 */
.asp-select-area {
	display: flex;
	margin-top: 4rem;
	gap: 4rem;
	align-items: baseline;
	flex-wrap: wrap;
	justify-content: center;
}

.asp-select-area .asp-map-area {
	max-width: 40rem;
	width: 100%;
	border: 1px solid #cecece;
	background: #f7f8f9;
	border-radius: 1.2rem;
}

.asp-cilck-bar {
	background: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
	width: 90%;
	padding: .6rem 0;
	text-align: center;
	margin: 1rem auto;
	border-radius: .4rem;
	color: #444;
	font-size: 1.5rem;
	vertical-align: middle;
}

.asp-cilck-bar img {
	vertical-align: middle;
	padding-right: .4rem;
}

.asp-mapzone {
	text-align: center;
	padding: 1.6rem 0;
}

.asp-tit-table-wrap {
	flex: 1;
}

.asp-tit-table-wrap .table-wrap+.table-wrap {
	margin-top: 8rem;
}

.asp-tit-table-wrap .table-wrap p {
	font-size: 1.9rem;
	font-weight: 700;
	margin-bottom: 1.2rem;
}

.asp-tit-table-wrap .table-wrap table {
	max-height: 50rem;
	overflow-y: auto;
}

.y-table-scroll {
	max-height: 40rem;
	overflow-y: auto;
}

.asp-select-table tbody {
	display: block;
	max-height: 30rem;
	overflow-y: auto;
}

.asp-select-table tbody tr {
	display: inline-table;
	width: 100%;
}

.asp-select-table tbody td:nth-child(1),
.asp-select-table thead th:nth-child(1) {
	width: 20%;
}

.asp-select-table tbody td:nth-child(2),
.asp-select-table thead th:nth-child(2) {
	width: 60%;
}

.asp-select-table tbody td:nth-child(3),
.asp-select-table thead th:nth-child(3) {
	width: 20%;
}

.asp-select-table thead {
	display: table;
	width: 100%;
}

/* 전체 스크롤바 트랙 (배경) */
.asp-select-table tbody::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

/* 스크롤바 Thumb (움직이는 부분) */
.asp-select-table tbody::-webkit-scrollbar-thumb {
	background-color: #c6c6c6;
	border-radius: 10px;
	border: 2px solid transparent;
	background-clip: content-box;
}

/* 스크롤바 트랙 (Thumb이 움직이는 영역) */
.asp-select-table tbody::-webkit-scrollbar-track {
	background-color: transparent;
	border-radius: 10px;
}

/*수강신청 모달팝업 높이 추가 */
.modal .modal-dialog .modal-content.su-content {
	height: 58rem;

}


/* 강의실 재생 표시 */
.progress-circle { 
  position: relative;
  width: 16px;
  height: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: .8rem;
}
.icon {
  font-size: .8rem;
  color: #717171;
  position: absolute;
  z-index: 1;
}

.circle {
  position: absolute;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg); 
}

circle {
  fill: none;
  stroke-width: 3;
}

.background {
  stroke: #717171;
}


.progress {
  stroke: #717171; 
  stroke-dasharray: 100; 
  stroke-dashoffset: 100; 
  transition: stroke-dashoffset 1s linear; 
}

/* 진행중 스타일 */
.progress-circle.learning .progress {
  stroke-dashoffset: 60;
}
.progress-circle.learning  .background{
	stroke: none;
}

.progress-circle.completed .progress {
	stroke-dashoffset: 0;
	stroke: var(--primary);
}

/* 완료*/
.progress-circle.completed .icon {
  color: #fff; 
  background-color: var(--primary);
  border-radius: 50%;
}

.progress-circle.completed .background{
	stroke: var(--primary);
}
.progress-circle.completed  circle{
	fill: var(--primary);
}


/* hover 및 active */
.lrn-class-box:hover .progress-circle:not(.completed):not(.learning) .progress, .lrn-class-box:hover .progress-circle:not(.completed):not(.learning) .background,
.lrn-class-box.active .progress-circle:not(.completed):not(.learning) .progress, .lrn-class-box.active .progress-circle:not(.completed):not(.learning) .background  {
  stroke: var(--primary); /* 진행 색상 */
}

.lrn-class-box:not(.completed):hover .progress-circle .icon, .lrn-class-box:hover .progress-circle .icon,
.lrn-class-box.active:not(.completed) .progress-circle .icon, .lrn-class-box.active .progress-circle .icon {
  color: var(--primary); 
}


.lrn-class-box:hover .progress-circle.learning .progress,
.lrn-class-box.active .progress-circle.learning .progress {
  stroke: var(--primary); 
}


.lrn-class-box:hover .progress-circle.completed .icon,
.lrn-class-box.active .progress-circle.completed .icon {
  color: #fff; 
}


/* ========================================================
* 메인페이지-설문팝업
======================================================== */
.main-sv-box li{
	border-radius: .8rem;
}

.main-sv-box .sv-chk-wrap{

}
.surveyMd-title{
	background: #f4f5f6;
	border-radius: .6rem;
	padding: 1.6rem;
}
.surveyMd-title h3{
	font-size: 1.9rem;
}
.surveyMd-title h3::before{
  content: '';
  background: url(../../images/new/edu/i_surveytitle.svg) no-repeat center;
  background-size: contain;
  width: 2.4rem;
  height: 2.4rem;
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
}


/* ========================================================
* as-is 사용하던 게시판 테이블 가져오기
======================================================== */
.con_listcus5 {
  margin: 10px 0 0 0;
  border-top: 1px solid #222;
  transition: all 0.3s ease;
}
.con_listcus5 table {
  width: 100%;
}

.con_listcus5 th {
	padding: 10px 0 10px 0;
	border: 1px solid #d8d8d8;
	background: #f4f5fa;
	font-size: 15px;
	font-weight: normal;
	text-align: center;
	line-height: 21px;
	letter-spacing: -0.03em;
	transition: all 0.3s ease;
}

.con_listcus5 td {
  padding: 10px 15px 10px 15px;
  border: 1px solid #d8d8d8;
  font-size: 15px;
  font-weight: normal;
  text-align: center;
  line-height: 21px;
  letter-spacing: -0.03em;
  word-break: break-all;
  transition: all 0.3s ease;
}

.con_listcus5 td i {
   display: none;
}

.ls1 {
   letter-spacing: -0.01em !important;
}

.con_listcus5 td a {
  color: #111111;
  font-size: 15px;
}

.con_listcus5 td a span b{
	font-weight: 600;
	font-size: 15px;
	color: #386FA4;
}

.con_listcus5 td a:hover{
  background: #ECF1F6;
  padding: .4rem .8rem;
  border-radius: .4rem;
}

/* ========================================================
* 현장실습교육 추가
======================================================== */

.rs-mob.sch-list-top{
	justify-content: flex-end;
}

.download-area {
  padding: 3.2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3.2rem;
  margin-bottom: 4rem;
  background:#F4F5F6;
  flex-direction:column;
  border-radius:1.2rem;
}

.download-area p {
  font-size: 2.1rem;
  font-weight: 600;
}

.sub-name-wrap{
	margin-top: 2.4rem;
}

.sub-name-wrap h3{
	font-size: 2rem;
	font-weight: 700;
	position: relative;
	display: inline-block;
}

.btn-download-wrap .btn-download{
	position: relative;	
}

.btn-download-wrap .btn-download::before{
  content: "";
	width: 1.6rem;
  height: 1.6rem;
  background: url(../../images/new/Regional-specialization/ico-download.png) no-repeat center;
  margin-right: .8rem;
}

.table-wrap table .file-list.rc-tbl-file-btn-wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.rc-tbl-file-btn-wrap .btn.delete {
	content: "";
	width: 2rem;
	height: 2rem;
	background: url(../../images/new/Regional-specialization/i_closed_20.png) no-repeat;
	background-size: contain;
}

/* 현장실습교육 보고서 */
.rc-list-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rs-report-tit {
  font-size: 2.5rem;
  border-bottom: 3px solid var(--primary);
  width: max-content;
  margin: 2rem 0 4rem;
}

.rs-report-wrap .my-item + .rs-report-wrap .my-item{
	margin-top: 4rem;
}

.rs-report-wrap .my-item-title, .rs-report-wrap .rc-list-top{
	margin-bottom: .8rem;
}

.rs-report-wrap .my-item-title .my-title{
	margin-right: 1.6rem;
}

.rs-check-list-wrap ul {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	margin-top: 1.2rem;
}

.rs-check-list-wrap ul li {
	padding: 1.6rem;
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	display: flex;
	flex-direction: column;
	gap: .8rem;
}

.rs-check-list-wrap ul li div {
	display: flex;
	align-items: center;
	height: 2.4rem;
}

.rs-check-list-wrap ul li div p{
	font-size: 1.4rem;
}

.rs-check-list-wrap ul li div p.tit {
  font-weight: 600;
  width: 10rem;
}

.rs-mo-tab {
	display: none;
}

.rs-mob.input-group {
	justify-content: flex-end;
}

.rs-mob.input-group form {
	display: flex;
	flex-direction: row;
	gap: .8rem;
}

.rs-mob.input-group .form-select {
	/* max-width: 10rem;*/
	width: max-content;
}

.check-status-label {
	padding: 0 1.2rem;
	border-radius: 12rem;
	text-align: center;
	font-size: 1.3rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 3rem;
	font-weight: 500;
}

.check-status-label.rs-la-01 {
	background-color: #fff4f0;
	color: var(--primary);
	border: 1px solid var(--primary);

}

.check-status-label.rs-la-02 {
	background-color: #f4f5f6;
	border: 1px solid #cecece;
	color: #222;

}


/*클릭 페이지*/
.rs-check-c-wrap {
	border-top: 1px solid #222;
	padding: 2.4rem 0;
}

.rs-check-c-wrap .form-select{
	width: 100%;
}

.rs-check-c.tit {
	border-bottom: 1px solid #cecece;

	padding-bottom: 2rem;

}

.rs-check-c.tit p {
	font-size: 1.9rem;
	font-weight: 600;
	padding: 0 1.6rem;

}

.rs-check-c-li {
	padding: 1.6rem;
	border-bottom: 1px solid #cecece;
/*	margin-bottom: 4.8rem; */
}

.rs-check-c-li p {
	font-size: 1.5rem;
	color: #444;

}

.rs-check-c-li p.tit {
	font-weight: 600;
	color: #222;
	margin-bottom: .8rem;
}

.rs-check-c-li ul {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;

}

.rc-mob-btn-wrap {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
}

.rc-mob-btn-wrap button {
	width: 100%;
}

.rc-mob-btn-top {
	display: flex;
	gap: 2.4rem;
	width: 100%;
}



/*출석관리 등록 / 퇴근관리 등록*/
.rs-la-03 {
	background-color: #EBF5FF;
	color: #00407F;
	font-size: 1.5rem
}

.rs-la-04 {
	background-color: #EEF7EE;
	;
	color: #004D00;
	font-size: 1.5rem
}

.asp-stf-e-tbl-wrap {
	overflow: unset;
}

/* 출석관리 화면 리스트 */
.con_listcus3{
  margin-bottom: 4.8rem;
}

.con_listcus3 .header{
	display: none;
}

.con_listcus3 ul{
  display: flex;
  flex-direction: column;
  gap: 12px;
	border: 1px solid #cecece;
  padding: 16px;
  border-radius: 12px;
}

.con_listcus3 ul + ul{
	margin-top: 1.6rem;
}

.con_listcus3 ul li.col1{
	display: none;
}


.con_listcus3 ul li strong{
	margin-right: 2.4rem;
	font-weight: 600;
}

.con_listcus3 ul, .con_listcus3 ul li strong, .con_listcus3 ul li span{
	font-size: 1.5rem;
}

.con_listcus3 .state1{
	color: #00407F;
	font-weight: 500;
}

.con_listcus3 .state2{
	color: #EB003B;
	font-weight: 500;
}

.con_listcus3 .nodata{
	text-align: center;
	color: #717171;
}

.con_listcus3 ul:has(.nodata){
	border: 0;
}

/* 출석관리 리스트에서 클릭 */
.con_view2{
	border-bottom: 1px solid #cecece;
  padding-bottom: 2.4rem;
}

.con_view2 table{
	
}

.con_view2 table tr + tr{
	margin-top: 1.6rem;
	display: block;
}

.con_view2 table th{
 	font-weight: 600;
  margin-bottom: .8rem;
}

.con_view2 table td{
 	font-size: 1.5rem;
  color: #444;
}

.con_view2 table th, .con_view2 table td{
	font-size: 1.5rem;
  display: block;
  text-align: left;
  padding-left: 1.6rem;
}


/* ========================================================
* 교육리스트 추가
======================================================== */
.btn-sort-list{
	width: 2.4rem;
	height: 2.4rem;
}

/* 오프라인교육(리스트형) */
.off-list-wrap{
	margin-top: 2rem;
}

.off-list-wrap > li{
	position: relative;
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	background: #fff;
	border: 1px solid #cecece;
	border-radius: 1.2rem;
	padding: 2.4rem;
}

.off-list-wrap .off-list-item + .off-list-item{
	margin-top: 1.6rem;
}

.off-list-item .in{
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
	width: 100%;
}

.off-list-item .list-top{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.list-btn{
	display: inline-flex;
	align-items: center;
	gap: 1.6rem;
}

.list-btn button,
.list-btn .count-num{
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-size: 1.4rem;
}

.list-btn i {
	width: 2rem;
	height: 2rem;
}

.list-btn .ico-heart{
	content: url('../../images/new/edu/i_heart.png');
}

.list-btn .ico-heart-s{
	content: url('../../images/new/edu/i_heart_s.png');
}

.list-btn .ico-view{
	content: url('../../images/new/edu/eye-open.png');
}

.list-body{
	margin-top: 1.6rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.list-body .btn-darkgray-w:hover{
	background: #fff !important;
}

.list-body .list-text{
	display: flex;
	align-items: normal;
	justify-content: flex-start;
	flex-direction: column;
	gap: 1.6rem;
	word-break: break-all;
	flex: 1;
}

.list-body .list-text .l-title{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	gap: .2rem;
	position: relative;
	font-weight: 700;
}

.list-body .list-text .l-title span{
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	font-size: 2rem;

}

.list-body .list-text:hover .l-title span{
	text-decoration: underline;
}

.list-body .list-text .l-title img{
	width: 2.4rem;
	height: 2.4rem;
}

.list-body .list-text .l-info{
	display: flex;
	align-items: baseline;
	column-gap: 4rem;
	row-gap: .4rem;
	flex-wrap: wrap;
}

.list-body .list-text .l-info p{
	
}

.list-body .list-text .l-info p span{
	color: #717171;
}

.list-body .list-text .l-info strong{
	margin-right: .6rem;
}

.list-body .list-text .l-info p span, 
.list-body .list-text .l-info strong{
	font-size: 1.5rem;
}

.list-body .list-text .l-info .l-info-full{
	flex-basis: 100%;
}

.list-body .list-text .l-etc span,
.gal-body .l-etc span{
	color: #1E4F7A;
	font-size: 1.5rem;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.mob-list-btn{
	display: none !important;
}

.list-btm{
	border-top: 1px solid #cecece;
	width: 100%;
	padding-top: 1.6rem;
	margin-top: 1.6rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
  flex-wrap: nowrap;
  min-width: 0;
  gap: 1rem;
}

.progress-container {
	display: flex;
	align-items: center;
	gap: 8px;
  width: -webkit-fill-available;
  min-width: 0;
}

.progress-bar {
	position: relative;
	width: 18rem;
	height: .6rem;
	background-color: #cecece;
	border-radius: 5px; 
	overflow: hidden;
}

.progress-fill {
	height: 100%;
	width: 0%;
	background-color: var(--primary); 
	border-radius: 5px;
	transition: width 0.3s ease-in-out;
}

.progress-text {
	font-size: 1.5rem;
	color: #717171;
	display: inline-flex;
}

.progress-text span{
	font-size: inherit;
	margin: 0 .2rem;
	color: #717171;
}

.progress-text .current {
	color: var(--primary);
	font-weight: 600;
}

.list-state{
	flex-shrink: 0;
}

.list-state span{
	font-size: 1.5rem;
	font-weight: 500;
	padding: 0 1rem;
	height: 3.2rem;
	display: inline-flex;
	align-items: center;
	border-radius: .6rem;
}

.list-state .rec{
	background: #ebf5ff;
	color: #00407f;
}

.list-state .ing{
	background: #EEF7EE;
	color: #004D00;
}

/* 오프라인교육(갤러리형) */
.off-list-wrap.gallery-view{
	display: grid;
  grid-template-columns: repeat(auto-fill, minmax(20%, calc(100% / 4 - 12px)));
	gap: 1.6rem;
}

.off-list-wrap .off-gal-item{
	padding: 0 !important;
	display: block;
}

.gal-top{
	position: relative;
}
.gal-top  .gal-thumbnail{
	width: 100%;
	height: 14rem;
}

.gal-top  .gal-thumbnail img{
	width: 100%;
	height: 100%;
	background-size: cover;
	border-top-left-radius: 1.2rem;
	border-top-right-radius: 1.2rem;
}

.gal-top .gal-state{

}

.gal-top .gal-state:has(.req){
	position: absolute;
	top: 8px;
	left: 10px;
}

.gal-top .gal-state .req{
	background: var(--primary);
}

.gal-top .gal-state:has(.ing){
	position: absolute;
	bottom: 8px;
	right: 10px;
}

.gal-top .gal-state .ing{
	background: #053C5E;
}

.gal-top .gal-state span{
	font-size: 1.2rem;
	font-weight: 500;
	padding: 0 1rem;
	height: 2.4rem;
	display: inline-flex;
	align-items: center;
	border-radius: 2rem;
	color: #fff;
}

.gal-body, .gal-btm{
	margin: 1.6rem;
}

.gal-body{
	flex-direction: column;
	align-items: flex-start;
	gap: .8rem;
}

.gal-body .label-zone > li{
	font-size: 1.2rem;
	height: 2.4rem;
	line-height: 2.4rem;
	padding: 0 1rem;
  box-sizing: border-box;
}

.gal-body .l-title span{
	font-size: 1.7rem !important;
}

.gal-body .l-info{
	min-height: 86px;
}

.gal-body .l-info p, .list-body .l-info p{
	display: inline-flex;
}

.gal-body .l-info strong, .list-body .l-info strong{
	display: inline-block;
	min-width: 4.8rem;
}

.gal-body .l-info strong, .gal-body .l-info span{
	font-size: 1.3rem;
}

.gal-body .l-info span{
	color: #717171;
}

.gal-body .progress-text{
	font-size: 1.2rem;
}

.gal-btm{
	border-top: 1px solid #cecece;
	padding-top: 1rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.gal-btm .list-state span{
	font-size: 1.2rem;
	height: 2.4rem;
	border-radius: 25rem;
}
.gal-btm  .list-state .rec{
	background: #fff;
	border: 1px solid #717171;
	color: #222;
}

.gal-btm .list-btn .count-num{
	font-size: 1.2rem;
}
.gal-btm .count-num i{
	width: 1.6rem;
	height: 1.6rem;
}


/* 오픈클래스 리스트 */
/* 전체 스크롤바 트랙 (배경) */
.open-sort-list::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

/* 스크롤바 Thumb (움직이는 부분) */
.open-sort-list::-webkit-scrollbar-thumb {
	background-color: #c6c6c6;
	border-radius: 10px;
	border: 2px solid transparent;
	background-clip: content-box;
}

/* 스크롤바 트랙 (Thumb이 움직이는 영역) */
.open-sort-list::-webkit-scrollbar-track{
	background-color: transparent;
	border-radius: 10px;
}

.open-list-wrap{
	display: flex;
	align-items: flex-start;
	gap: 5rem;
}

.open-sort{
	width: 22rem;
  flex-shrink: 0;
}

.open-sort h5{
	margin-bottom: 1.2rem;
}

.open-sort-list{
	border-top: 1px solid #222;
	border-bottom: 1px solid #cecece;
}

.open-sort-list{
	padding: .8rem;
	max-height: 52rem;
	height: 100%;
	overflow-y: auto;
}

.open-sort-list .open-form-wrap + .open-form-wrap{
	margin-top: .8rem;
}

.open-sort-list .form-check input[type=checkbox]:checked ~ label{

}

.open-form-wrap{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.open-form-wrap.label-wrap .ld-icon-wrap a{
	width: 1.6rem;
	height: 1.6rem;
}

.open-cont-wrap{
	position: relative;
}

.open-cont{
	min-width: 68rem;
  width: 100%;
}

.open-cont .open-cont-txt{
	margin-bottom: 1.2rem;
}

.open-cont-list{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.open-cont-list ul{

}

.open-cont-list .open-cont-item{

}

.open-cont .open-cont-start:not(:last-child){
	margin-bottom: 4rem;
}

.open-cont-item .open-imgBox{
	border-radius: 1.2rem;
	position: relative;
	border: 1px solid #cecece;
	overflow: hidden;
	height: 13rem;
}

.open-cont-item .open-imgBox img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.open-cont-item .open-info{
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	margin-top: .8rem;
}

.open-cont-item .open-info span{
	font-size: 1.5rem;
	font-weight: 500;
}

.swiper-button-next.open::after{
    background-image: url(../../images/new/edu/ar_next_b24.png);
}

.swiper-button-prev.open::after{
    background-image: url(../../images/new/edu/ar_prev_b24.png);
}

.swiper-button-next.open, .swiper-button-prev.open{
	width: 4rem;
	height: 4rem;
	background: #fff;
	border-radius: 100%;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
	top: 42%;
}

.swiper-button-next.open {
	right: -24px;
}

.swiper-button-prev.open {
	left: -24px;
}

/* 오픈클래스 모바일 */

.mob-open{
	display: none;
}

.mob-open .sch-list-top{
	justify-content: flex-end;
}

.open-cont-list.mob ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(23%, auto));
	gap: 1.6rem;
}

.mob-open-start{
  border-bottom: 1px solid #cecece;
  padding-bottom: 2.4rem;
}

.mob-open-start + .mob-open-start{
	margin-top: 2.4rem;
}

.mob-open-start:last-child{
	border-bottom: 0;
}

.mob-open-list .open-cont-txt{
	margin-bottom: .8rem;
}

.mob-open-start .btn{
	margin-top: 3.2rem;
}

.mob-open-list .open-cont-txt h5{
	font-size: 1.5rem;
}

.mob-open-list .open-cont-item .open-info span{
	font-size: 1.3rem;
}

.mob-open-list {
	margin-top: 1.6rem;
}

.mob-open-list .open-cont-txt .ld-icon-wrap{
	display: block;
}

.mob-open-list .open-cont-txt{
   display: flex;
   justify-content: space-between;
   align-items: center;
}

/* 오픈클래스 - 농업지식더하기*/
.open-plus-wrap{
	display: block;
}

.open-plus{
	min-width: unset;
}

.open-plus ul{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(16%, calc(100% / 5 - 13px)));
	gap: 1.6rem;
	row-gap: 6rem;
}

.open-imgBox .gal-state{
	position: absolute;
	top: 8px;
	left: 10px;
}

.open-imgBox .gal-state .req {
	background: var(--primary);
}

.open-imgBox .gal-state .comp{
	background: #666;
}

.open-imgBox .gal-state span {
	font-size: 1.2rem;
	font-weight: 500;
	padding: 0 1rem;
	height: 2.4rem;
	display: inline-flex;
	align-items: center;
	border-radius: 2rem;
	color: #fff;
}

.open-plus .open-cont-item .open-info{
	-webkit-line-clamp: 2;
}



/* ========================================================
* 상세검색 추가
======================================================== */
.modal-select-flex{
	display: flex;
	gap: .8rem;
}

.date-chk{
	display: flex;
	align-items: center;
	gap: 2.4rem;
	margin-bottom: 1rem;
	flex-wrap: wrap;
}

.modal .modal-dialog .modal-conts .modal-sch{
	gap: 3.2rem !important;
}



/*************************************************
* 교육페이지 반응형 추가
* 24.11.27 mina
**************************************************/

/* 서브페이지 반응형 */
@media all and (max-width: 1440px) {
	.search-list {
		grid-template-columns: 1fr 1fr 1fr !important;
	}
}

@media all and (max-width: 1200px) {
	.rs-mo-tab {
    display: block !important;
	}
	
	/* 오픈클래스 - 농업지식더하기*/
	.open-plus ul{
 		grid-template-columns: repeat(auto-fill, minmax(20%, calc(100% / 4 - 13px)));
 		row-gap: 4rem;
	}
}

@media all and (max-width: 1024px) {

	.search-list {
		grid-template-columns: 1fr 1fr !important;
	}


}

@media all and (max-width: 1080px) {
	.lrn-user-zone .btn-gnb-fold {
		display: block !important;
	}

	.lrn-gnb-zone {
		display: none;
		z-index: 99;
		padding-top: 2.4rem !important;
		transition: transform 0.3s ease;
		transform: translateX(0);
	}

	.lrn-gnb-zone.active {
		display: block;
	}

	.learning-content .lrn-cont-zone {
		right: 0;
		left: 0;
		padding: 0 4.8rem;

	}

	.lrn-gnb-zone .btn-gnb-close {
		display: block;
	}
	
	/* 컨텐츠 타이틀 추가 */
	.lrn-con .bbc-lxPlayer{
		margin: 1rem auto;
	}
	
	.lrn-std-title{
		display: flex;
		align-items: center;
		gap: 3.2rem;
		flex-wrap: wrap;
		row-gap: .4rem;
	}
	
	.lrn-std-title h4{
		font-size: 1.8rem;
	}
	
	.lrn-std-title .lrn-cont-name{
		padding: 0;
	}
	
	/* 교육리스트 추가 */
	.off-list-wrap.gallery-view{
		grid-template-columns: repeat(auto-fill, minmax(25%, auto));
	}
	

}

@media all and (max-width: 992px) {
	/* 오픈클래스 */
	.mob-open{
		display: block;
	}
	
	.pc-open{
		display: none;
	}
	
	.pagination a{
		width: 3rem;
		height: 3rem;
		font-size: 1.4rem;
	}
	
	.learn-detail-wrap {
  	flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    padding: 2.4rem;
   }
   
   .learn-con-wrap {
		flex-direction: column;
	}
	
	.learn-con-wrap:has(.learn-floating){
		margin-top: 2rem;
	}

	.learn-con-wrap .learn-con {
		order: 2;
	}

	 .learn-con-wrap .learn-floating {
		order: 1;
	}

	.learn-con-wrap .learn-floating .lf-box {
		max-width: 100%;
	}
	
	table .lrn-title-tooltip{
		font-size: 1.4rem;
	}
	
	/* 현장실습보고서 - 등록화면 */
	
  #rs-report-edit .modal-dialog .table-wrap tbody {
	  display: flex;
	  flex-direction: column;
	  gap: 1.5rem;
 }
 
  #rs-report-edit .modal-dialog .table-wrap:not(.my-conts-area-tbl01) tbody tr {
	  display: grid;
	  grid-template-areas:
	  "check"
	  "plan"
	  "do"
	  "attach";
	  border: 1px solid #ddd !important;
	  border-radius: 0.5rem;
 }
 
  #rs-report-edit .modal-dialog .table-wrap td:first-child {
	  grid-area: num;
	  display: none;
 }
 
  #rs-report-edit .modal-dialog .table-wrap td:nth-child(3) {
		grid-area: do;
 }
 
 .rcs-modal-tbl-tit01, .rcs-modal-tbl-tit02 {
	 display: block !important;
	 border-bottom: none !important;
	 text-align: left !important;
	 font-size: 1.5rem;
	 font-weight: 600 !important;
	}

	.rc-md-tbl tbody td {
		display: block;
		height: auto;
		border-bottom: none;
		text-align: left;
	}
	
	#rs-report-edit .modal-dialog .table-wrap td>.btn {
		width: -webkit-fill-available;;
	}
		
	#rs-report-edit .modal-dialog .table-wrap td:last-child {
		grid-area: check;
		text-align: right;
		padding: .8rem .8rem 0 0;
	}
	
	.table-wrap:not(.touch-swipe) td:last-child {
		border-bottom: 0;
	}
	
  #rs-report-edit .table-type1 {
		border-top: none;
 }

	.table-dp tbody th {
		display: block !important;
        border-bottom: none !important;
        text-align: left !important;
        font-size: 1.4rem;
        font-weight: 600 !important;
		padding-bottom: 0;
		height: auto;
	}
	
   .rs-report-sub-tit {
        font-size: 1.7rem;
        display: block !important;
    }
}

@media all and (max-width: 820px) {

	.tr-btm .tr-compare {
		flex-direction: column;
		gap: 1.2rem;
	}
	
	/* 강의실 - 시험보기 */
	.lrn-sv-test{
		flex-direction: column-reverse;
	}
	.test-floating{
	}
	
	.sch-list-top .su-inputTop-wrap{
		flex-wrap: wrap;
		width: 100%;
	}
	
	.sch-list-top .su-inputTop-wrap .input-group, .sch-list-top .su-inputTop-wrap .btn{
    /*width: 100%;*/
  }
  
   .open-plus ul {
   	grid-template-columns: repeat(auto-fill, minmax(31%, auto));
   	row-gap: 2rem;
   }


}


@media all and (max-width: 680px) {
	
	.right-tooltip::after {
	  left: 0;
	  right: auto;
	  transform: translate(-25%, 0);
	  top: 24px;
	  bottom: auto;
   }

	.breadcrumb-wrap .breadcrumb li .txt{
		font-size: 1.2rem;
	}
	
	/* 리스트 상단 검색박스 */
	
	.online-search-box{
		margin-bottom: 2.4rem;
	}
	.online-search-box>.inner{
		padding: 2rem 0;
	}
	
	.online-sch-form{
		gap: .8rem;
	}
	
	.online-search-box .online-sch-form .sch-input .form-control, 
	.online-search-box .online-sch-form .btn-detail{
		height: 4rem;
		font-size: 1.5rem;
	}
	
	
	/* 온라인교육 리스트 */
	.search-list{
		grid-gap: 1rem;
    row-gap: 4rem;
	}
	
	.pro-la-date{
		padding: .8rem 1.2rem;
	}
	
	.label-zone > li, .pro-la-date .pro-learnDate span{
		font-size: 1.2rem;
	}
	
	.pro-la-date .pro-label{
		display: none;
	}
	
	.pro-la-date .pro-learnDate span:first-child{
		display: inline-block;
	}
	
	.pro-detail-info ul li{
		font-size: 1.4rem;
	}
	
	.pro-info .pro-name{
		font-size: 1.6rem;
	}
	
	.online-sch-form .sch-input {
		width: 100%;
	}

	.ld-info .info-con ul {
		flex-wrap: wrap;
		flex-direction: column;
	}

	.sch-list-top {
		flex-direction: column-reverse;
/* 		align-items: flex-start; */
		margin-top: 1.6rem !important;
	}
	.sch-list-top form{
		width: 100%;
	}

	.lecturer-top {
		flex-direction: row;
	}

	.sch-list-top .input-wrap,
	.my-su-top .input-wrap {
	  flex-wrap: wrap;
	  justify-content: center;
	}

	.sch-list-top .input-wrap .input-group,
	.my-su-top .input-wrap .input-group {
		/*width: 100%;*/
	}

	.sch-list-top .btn,
	.my-su-top .input-wrap .btn
	 {
		/*width: 100%;*/
	}
	
	.su-inputTop-wrap .input-group-wrap input[type=text]{
  	display: none;
  }

	.con_view_head h1 {
		font-size: 2.1rem;
	}

	.con_view_head,
	.con_view_content,
	.con_view_file {
		padding: 2rem;
	}

	.con_view_head ul {
		flex-wrap: wrap;
	}

	.learning-content .lrn-cont-zone {
		padding: 0 2.4rem;
	}

	.tr-top {
		flex-direction: column;
	}

	.tr-top .tr-info {
		width: auto;
		padding-bottom: 1.6rem;
	}

	/* 테마과정 - 팝업 */
	.play-con-list .play-con-item {
		flex-direction: column;
	}
	
	/* 수강신청 */
	.step-wrap>li>span{
		padding-top: 2.4rem;
	}
	.step-wrap>li>span::before, .step-wrap>li.done>span::before{
		width: 1.4rem;
		height: 1.4rem;
	}
	.step-wrap>li.active>span::after{
		top: 0.3rem;
    left: 0.3rem;
    width: 1rem;
    height: 1rem;
	}
	.step-wrap>li .step{
		font-size: 1.4rem;
	}
	.step-wrap>li .step-tit{
		font-size: 1.5rem;
	}
	.step-wrap>li.done>span::after{
	  width: 1rem;
	  height: 1rem;
	}
	
	/* 강의실 */
	.lrn-con .input-group{
		width: 100%;
	}
	.lrn-con .sch-list-top .sch-list-left,
	.lrn-con .sch-list-top .sch-list-right,
	.lrn-con .sch-list-top .sch-list-right button{
		width: 100%;
	}
	
	/* 메인페이지 설문 팝업 */
	.main-sv-box .sv-chk-wrap{
		align-items: flex-start;
    flex-direction: column;
	}
	.main-sv-box .sv-title{
		margin-bottom: .8rem;
	}
	
	
	/* 교육리스트 추가(오프라인) */
	.off-list-wrap.gallery-view{
		grid-template-columns: repeat(auto-fill, minmax(32%, auto));
	}
	
	.open-cont-list.mob ul {
		grid-template-columns: repeat(auto-fill, minmax(31%, auto));
	}
	
	.list-body{
		flex-direction: column;
		gap: 2rem;
	}

	
	
	/* 현장실습 */
	.field-table tr, .field-table td{
		display: block;
	}
	
	.field-table td{
	   text-align: left;
	   border-bottom: 0;
	   padding: .2rem;
	   height: unset !important;
	}
	
	.field-table td:nth-child(2){
		margin-top: 1rem;	
	}
	
	.field-table td button{
		width: 100%;
    margin: 1rem 0 2rem;
	}

}


@media all and (max-width: 480px) {
	.online-sch-form {
		flex-wrap: wrap;
		margin: 0 2rem;
	}

	.online-sch-form .btn {
		width: 100%;
	}

	.ld-info .label-wrap {
		flex-wrap: wrap;
		justify-content: center;
		gap: .8rem;
    margin-bottom: .4rem;
	}

	.lrn-con-title {
		flex-direction: column;
		gap: 1.2rem;
	}

	.lrn-con .sch-list-top {
		flex-direction: column;
		gap: 1.2rem;
	}

	.lrn-con .sch-list-top .sch-list-left,
	.lrn-con .sch-list-top .sch-list-right {
		width: 100%;
	}
	.lrn-con .sch-list-top .sch-list-left{
		flex-direction: column;
	}

	.lrn-con .input-group {
		flex: 1;
	}

	/* 상세검색 - 모달팝업 */
	.sch-area .radio-group {
		flex-direction: column;
	}

	.sch-area .datepicker-input .input-group {
		flex-direction: column;
	}

	.sch-area .datepicker-input .input-group.range>li:not(.mark) {
		width: 100%;
	}
	
	/* 수강신청 모달팝업 */
	.step-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  .step-wrap > li {
    flex: none;
    display: flex;
    align-items: center;
    position: relative;
    margin-bottom: 1rem;
  }

  .step-wrap > li::after {
    display: none; 
  }

  .step-wrap > li > span {
    flex-direction: row;
    align-items: center;
    padding: 0;
    gap: 1rem; 
   	padding-left: 2.4rem;
  }
  .step-wrap>li>span::before{
  	top: 4px;
  }
  .step-wrap>li.active>span::after{
  	top: 0.7rem;
  }
  .step-wrap>li.done>span::after{
  	top: 0.8rem;
  }

	/* 게시판 상세 정보수정 */
	.con_view_head ul{
		gap: .4rem;
	}
	.edu-notice-ul li.last-li{
		margin-left: unset;
	}
	.edu-notice-ul li:not(:first-child)::after{
		margin-left: 4px;
	}
	.edu-notice-ul li:nth-child(n+4)::after{
		display: block;
		margin-left: 4px;
	}
	.edu-notice-ul li:last-child::after{
		display: none;
	}
	
	/* 강의실 - 시험결과 */
	.tr-top .tr-score{
		flex-direction: column;
	}
	
	/* 교육리스트(오프라인)*/
	.off-list-wrap.gallery-view {
		grid-template-columns: repeat(auto-fill, minmax(48%, auto));
   }
   
  .list-btm .progress-bar{
   	display: none;
   }
   .open-cont-item .open-imgBox{
   	height: 10rem;
   }
   
}