@charset "utf-8";

/* 기존 게시판 스타일 제거용 ======================== */
.se2_quote1 {padding:0 !important; margin:0 !important; border-left:none !important; color:#333;}
.se2_quote1 span {font-size:18px !important;}

/* 리뉴얼 ================================= */

.only-admin {display:none !important;}
.admin .only-admin {display:block !important;}
.admin thead.only-admin {display:table-header-group !important;}
.admin td.only-admin {display:table-cell !important;}
.admin span.only-admin {display:inline-block !important;}

@media screen and (max-width:1200px) {
    .only-pc {display:none !important;}
    .admin .only-pc {display:none !important;}
    .admin .only-pc {display:none !important;}
    .admin thead.only-pc {display:none !important;}
    .admin td.only-pc {display:none !important;}
    .admin span.only-pc {display:none !important;}
}

.subsides {height:100%;}
.subsides > .wrap_box_ratio {width:70%; margin:0 auto; margin-bottom:16px; padding-top:70%; border-radius:100%;}
.subsides .box-title {margin-bottom:30px; text-align:center;}
.subsides .box-title .title {margin-bottom:-2px; font-size:1.1em; font-weight:600;}
.subsides .box-title .body {font-size:14px; color:#777;}
.subsides .menu {display:flex; align-items:center; margin-bottom:8px; padding:8px 20px; font-size:14px; border-radius:10px;
    transition: all .2s;
}
.subsides .menu img {margin-right:8px;}
.subsides .menu .active {display:none;}
.subsides .menu.active .active {display:block;}
.subsides .menu.active .inactive {display:none;}
.subsides .menu.active {background-color:#ECEFF6; color:#1264D4;}
.subsides .menu:hover .active {display:block;}
.subsides .menu:hover .inactive {display:none;}
.subsides .menu:hover {background-color:#ECEFF6; color:#1264D4;}

@media screen and (max-width: 1000px){
    .subsides > .wrap_box_ratio {width:100px; padding-top:100px;}
}

.empty.type01 {padding:20px; font-size:16px; text-align:center; color:#999;}
.empty.type02 {padding:20px; text-align:center; color:#666666; background-color:#d9dfe7;}

/* sms */
.sms_section {gap: 40px 2%;}
.sms_section .sms_box {position:relative; border:1px solid #ddd; width: 32%;}
.sms_section .sms_box .sms_remove {position:absolute; right:35px; top:33px; width: 25px; height: 25px; background-color: #fff; border: 1px solid var(--primary, #49468c); border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.sms_section .sms_box .sms_use {position:absolute; right:80px; top:35px; margin-bottom: 0;}
.sms_section .sms_box .sms_txt {display:block; background:#F5F5FF; width:100%; height:150px; border-radius:5px; padding:15px 10px; resize:none; color: #888; font-size: 0.95em; }
.sms_section .sms_box .sms_receiver {position:relative; margin-top:15px;}
.sms_section .sms_box .sms_receiver h2 {position: relative; padding-left:10px; margin-bottom:5px;}
.sms_section .sms_box .sms_receiver h2::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 4px;height: 4px;background: var(--primary, #49468c);border-radius: 50%;}

@media screen and (max-width: 991px) {
    .sms_section .sms_box {width: 49%;}
}

.sms_guide {margin-bottom:20px;}
.sms_guide ul {margin-bottom: 7px;}
.sms_guide ul li {position:relative; padding:0 0 5px 100px; color: #888;}
.sms_guide ul li .title {position:absolute; left:0; width:85px; height: 21px; background:#858898; color:#fff; text-align:center; font-size: 0.9em; font-weight: 400;}
.sms_guide dl {display: flex; gap: 10px;}
.sms_guide dl dt {width: 35px; font-weight: 700; color: var(--primary, #49468c);}
.sms_guide dl dd {flex: 1; color: var(--primary, #49468c);}

/* 권한관리 */
ul.checktree {width: 100%; padding: 20px 0; background-color: #F5F5FF;}
ul.checktree li:before {height: 1em;width: 12px;border-bottom: 1px dashed #aaa;content: "";display: inline-block;top: -0.3em;}
ul.checktree li { border-left: 1px dashed #aaa; margin: 0px 0 5px 50px; }
ul.checktree li:last-child:before { border-left: 1px dashed #aaa; }
ul.checktree li:last-child { border-left: none; }
ul.checktree.input-checkbox.type03 label {display: inline-block;}

/* 페이지뷰 */
.search_dl {}
.search_dl dl {display: flex; align-items: center; justify-content: center;}
.search_dl dl dt {border-right:1px solid #ccc; padding-right: 20px;margin-right: 20px;}
.search_dl dl .input-select {margin: 3px;}
.search_dl dl .input-text {margin: 3px;}
.search_dl dl .input-date {width: 140px; margin: 3px 10px;}
.error_wrap {display: flex; align-items: center; justify-content: center; gap: 30px;}
.error_wrap .search_dl dl {justify-content: flex-start;}
.error_wrap .search_dl dl dt {color: var(--primary, #49468c); font-weight: 600;}
.view_table {}
.view_table td .fa-chevron-right {margin-right: 5px; color: var(--primary, #49468c);}
.view_table td strong {color: var(--primary, #49468c);}
.view_table td.depth02 {padding-left: 50px !important;}
.view_table td.depth03 {padding-left: 100px !important;}
.view_table td.depth02 .fa-chevron-right {color: #9291AB;}
.view_table td.depth03 .fa-chevron-right {color: #bbb;}
@media screen and (max-width: 991px) {
    .search_dl dl dd .input-date {margin: 3px 0;}
}
@media screen and (max-width:768px){
    .search_dl dl .input-select {width:auto}
}

.section-form .items.type02 .item {position:relative;}
.section-form .btn.type03 {min-width:90px; text-align:center;}
.section-form.type02 .input-text {display:inline-block; min-width:345px;}

@media screen and (max-width:1000px){
    .section-form.type02 .input-text {min-width:auto;}
}

/* 프로그램 타이틀 */
.program-title {position: relative; padding:30px 35px; background-color:#fff; border-radius:10px; box-shadow:0px 3px 6px rgba(0,0,0,0.05);}
.program-title dl dt {font-size: 1.6em; font-weight: 600; color: var(--primary, #49468c); margin-bottom: 5px;}
.program-title .btns {position: absolute; right:30px; bottom: 30px;}

/* 요일리스트 */
.week-list li {padding-bottom: 10px;}
.week-list li:last-child {padding-bottom: 0;}

/* 입력폼 비활성 */
.disable select {background-color: #f1f1f1; color: #999;}
.disable input[type="text"] {background-color: #f1f1f1; color: #999;}


.note-tip {background:#fff; padding:20px 20px;}
.em-type01 {color:#999}

/* 출석부 */
.rollBook {overflow-x: auto;}
.rollBook .input-text.type01 {width: 140px;}
.rollBook .input-date.type02 {width: 140px;}
.rollBook .input-select.type01 {min-width: 140px;}
.rollBook th,
.rollBook td {white-space: nowrap;}
.rollBook td:nth-child(2){position: sticky; left: -1px; z-index: 1; background: inherit;}
.rollBook .sticky th:nth-child(2){position: sticky; left: -1px; z-index: 1; color: #333;}


/* 강사목록 */
.profile-box {display: flex;align-items: center;justify-content: center;width: 65px;height: 65px;margin: auto;overflow: hidden;}
.profile-box img {max-width: 100%;height: auto;}
.m-0 {margin: 0;}

/* 게시판 상세 */
.view-area th {width: 150px;}

/* 동영상 게시판 */
.video-wrap {max-width: 800px; margin: 0 auto;}
.video-wrap .video {position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-wrap .video iframe,
.video-wrap .video object,
.video-wrap .video embed {position:absolute; top:0; left:0; width:100%; height:100%;}

/* 일정 게시판  */
.cal-tag {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: #767676;
}
.cal-tag::before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #254daa;
}
.cal-tag.tag01::before {background: #C40C0C;}
.cal-tag.tag02::before {background: #FF8A08;}
.cal-tag.tag03::before {background: #FFC100;}
.cal-tag.tag04::before {background: #79AC78;}
.cal-tag.tag05::before {background: #205295;}
.cal-tag.tag06::before {background: #AD88C6;}
.cal-tag.tag07::before {background: #FF8080;}
.cal-tag.tag08::before {background: #F8C794;}
.cal-tag.tag09::before {background: #AFD198;}
.cal-tag.tag10::before {background: #91C8E4;}

.calendar-header {
	position: relative;
	padding-bottom: 40px;
	text-align: center;
}
.calendar-title {
	position: relative;
	display: inline-block;
	width: 290px;
}
.calendar-title h2 {
	font-size: 30px;
	font-weight: 600;
}
.calendar-title button {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	background: var(--primary, #49468c);
	color: #fff;
}
.calendar-title .btn-prev {
	left: 0;
}
.calendar-title .btn-next {
	right: 0;
}
.calendar-title .btn-prev::after {
	content: "\f104";
	font-family: "Font Awesome 6 Free";
	font-weight: 600;
}
.calendar-title .btn-next::after {
	content: "\f105";
	font-family: "Font Awesome 6 Free";
	font-weight: 600;
}
.calendar-tag {
	position: absolute;
	left: 20px;
	bottom: 20px;
	padding-left: 65px;
	width: 385px;
	text-align: left;
}
.calendar-tag .cal-tag {
	margin-right: 10px;
}
.calendar-tag .cal-today {
	position: absolute;
	left: 0;
	bottom: 0;
}
.calendar-tag .cal-today::before {
	width: 13px;
	height: 13px;
	border-radius: 0;
	background: #e4e4e4;
}
.calendar-body {
	display: flex;
	align-items: flex-start;
}
.calendar-body>section {
	width: 50%;
	height: 480px;
}
.calendar-table {
	width: 100%;
	height: 100%;
}
.calendar-table thead th {
	height: 50px;
	background: var(--primary, #49468c);
	text-align: center;
	color: #fff;
}
.calendar-table tbody td {
	height: 70px;
	border: 1px solid #dfdfdf;
	padding-top: 6px;
	text-align: center;
	vertical-align: top;
}
.calendar-table tbody td .num {
	display: block;
	font-size: 15px;
	color: #767676;
}
.calendar-table tbody td.day-sun .num {
	color: #eb0505;
}
.calendar-table tbody td.day-sat .num {
	color: #1852d5;
}
.calendar-table tbody td.day-today {
	background: #e4e4e4;
}
.schedule-box .cal-tag {
	position: relative;
	display: inline-block;
	margin: 0 2px;
	width: 10px;
	height: 10px;
}
.schedule-box .cal-tag::before {
	position: absolute;
	top: 0;
	left: 0;
}
.schedule-title {
	line-height: 50px;
	font-size: 20px;
	font-weight: 500;
	background: #eaeaea;
	color: #333;
	text-align: center;
}
.schedule-list {
	height: 430px;
	border: 10px solid #eaeaea;
	border-top: 0;
	padding: 0 20px 20px;
	overflow-y: auto;
}
.schedule-item {
	padding: 15px 0;
	display: flex;
	align-items: flex-start;
	width: 100%;
	border-bottom: 1px solid #e4e4e4;
}
.schedule-item .title {
	flex: 0 0 100px;
	font-size: 18px;
	font-weight: 500;
	color: #666;
	text-align: center;
}
.schedule-item .desc-box {
	padding-left: 10px;
}
.schedule-item .desc {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 0;
	font-size: 15px;
}
.schedule-item .desc:not(:last-child) {
	margin-bottom: 10px;
}
.schedule-item .cal-tag {
	flex-shrink: 0;
}
.schedule-item .cal-time {
	flex-shrink: 0;
	margin: 0 25px 0 10px;
	color: #767676;
}
.schedule-btn:hover {
	text-decoration: underline;
	color: var(--primary, #49468c);
}
.calendar-modal-header {
	border-top: 1px solid #000;
	border-bottom: 1px solid #c8c8c8;
	padding: 10px 10px 0;
	margin-bottom: 20px;
}
.calendar-modal-header .title-xs {
	font-size: 18px;
	margin-bottom: 10px;
	margin-top: 5px;
}
.calendar-modal-body {
	padding: 0 10px;
	min-height: 200px;
}
.calendar-modal-body .cal-item {
	display: flex;
	padding: 5px 0;
}
.calendar-modal-body .cal-item .title {
	flex: 0 0 40px;
	font-weight: 500;
}
.calendar-modal-body .cal-item .desc {
	flex-grow: 1;
	color: #666;
	padding-left: 10px;
}
@media screen and (max-width: 1199px){
	.calendar-header {
		padding-bottom: 20px;
	}
	.calendar-tag {
		position: relative;
		left: 0;
		bottom: 0;
	}
}
@media screen and (max-width: 1023px) {
	.calendar-title h2 {
		font-size: 28px;
	}
	.schedule-list {
		padding: 0 15px 15px;
	}
	.schedule-item {
		flex-direction: column;
	}
	.schedule-item .title {
		flex: 0 0 auto;
		margin-bottom: 15px;
	}
	.schedule-item .desc-box {
		padding-left: 0
	}
}
@media screen and (max-width: 767px) {
	.cal-tag {
		font-size: 15px;
	}
	.calendar-header {
		padding-bottom: 10px;
	}
	.calendar-title {
		margin-bottom: 20px;
		width: 240px;
	}
	.calendar-title h2 {
		font-size: 24px;
	}
	.calendar-tag {
		font-size: 15px;
		padding-left: 0;
		width: 100%;
	}
	.calendar-tag .cal-today {
		position: unset;
	}
	.calendar-table thead th {
		height: 40px;
		font-size: 14px;
		font-weight: 400;
	}
	.calendar-table tbody td .num {
		font-size: 14px;
	}
	.calendar-body {
		flex-direction: column;
	}
	.calendar-body>section {
		width: 100%;
	}
	.schedule-title {
		font-size: 18px;
	}
	.schedule-item .title {
		font-size: 16px;
		margin-bottom: 10px;
	}
	.schedule-item .desc {
		font-size: 15px;
	}
	.schedule-item .cal-time {
		margin: 0 10px;
	}
	.calendar-modal-header {
		padding: 10px 5px 0;
	}
	.calendar-modal-body {
		padding: 0 5px 5px;
		min-height: auto;
	}
	.calendar-modal-body .cal-item .title {
		font-size: 15px;
	}
	.calendar-modal-body .cal-item .desc {
		font-size: 15px;
	}
}