[class^=icon-] {
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: 0 0;
	font-style: normal;
	font-size: 0;
	line-height: 1
}

.icon-app {
	width: 50px;
	height: 50px;
	background-image: url("/resources/admin/images/app-icon-f5e93e74b6ea0160a5b6d56b82b0c31c.svg");
	border-radius: 8px
}
.font-size-10px {
	font-size: 10px !important
}

.font-size-12px {
	font-size: 12px !important
}

.font-size-14px {
	font-size: 14px !important
}

.font-size-16px {
	font-size: 16px !important
}

.font-size-18px {
	font-size: 18px !important
}

.font-size-24px {
	font-size: 18px !important;
	font-weight: 700;
}

.font-size-30px {
	font-size: 30px !important
}

.min-width-100px {
	min-width: 100px
}

.cursor-pointer {
	cursor: pointer
}

hr {
	margin: 0;
	border-width: 5px;
	border-color: #eee
}

.hr {
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
	height: 8px;
	background: #f1f2f3
}

.hr.vertical {
	border-top: 0;
	border-bottom: 0;
	border-left: 1px solid #e5e5e5;
	border-right: 1px solid #e5e5e5;
	width: 8px;
	height: auto
}

button {
	border-radius: 0;
	border: 0;
	padding: 0;
	margin: 0;
	background: transparent
}

.material-icons {
	color: #343a40
}

.btn-dark .material-icons {
	color: #fff;
	font-size: 17px;
	transform: translateY(-1px)
}

.btn.btn-foursquare {
	padding: 0;
	line-height: 30.5px;
	width: 32.5px;
	font-size: 18px
}

.btn.btn-foursquare.btn-sm {
	width: 27px;
	line-height: 25px
}

textarea {
	resize: none !important
}

.bg-highlight {
	background: #e2eaff
}

.required {
	background-color: #fae6df !important;
	border-color: #ddcac4
}

.table>thead>tr>th {
	white-space: nowrap
}

.table th [type=checkbox],
.table td [type=checkbox] {
	margin-top: -2px
}

.table>tfoot>tr>td {
	background: #f3f3f3;
	border-top: 2px solid #e6e6e6
}

.table-fixed {
	table-layout: fixed
}

.table-center th,
.table-center td {
	text-align: center
}

.table-title {
	font-weight: 700;
	margin-bottom: .5rem
}

.table-bg-1 {
	background: #e6e7e8 !important
}

input[type=file].form-control {
	padding-top: 3px
}

input[type=text][disabled] {
	background-color: #f2f2f2
}

input[type=checkbox] {
	vertical-align: middle
}

input[type=checkbox]+label {
	margin-left: 3px;
	vertical-align: middle;
	transform: translateY(-1px)
}

label+input[type=checkbox] {
	margin-left: 12px
}

input[type=radio] {
	vertical-align: middle
}

input[type=radio]+label {
	margin-left: 3px;
	vertical-align: middle
}

label+input[type=radio] {
	margin-left: 12px
}

.form-datepicker {
	background: #fff url("/resources/admin/images/icon-calendar-162b0489de4937c9232b96b9aa405a93.svg") no-repeat right .5rem top 50%;
	padding-right: 28px
}

.form-datepicker.form-control-sm {
	background-size: auto 13px
}

.mdtimepicker .mdtp__wrapper {
	bottom: auto;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: none
}

.datepicker-box {
	position: absolute;
	left: 430px;
	top: 0;
	border-radius: 8px;
	box-shadow: 0px 3px 10px 0 rgba(0, 0, 0, .06);
	background-color: #fff;
	overflow: hidden
}

.datepicker-box .ui-widget.ui-datepicker {
	border: 0
}

.ui-widget.ui-datepicker {
	width: 300px;
	padding: 1rem;
	border-radius: 0;
	border-color: #ddd !important
}

.ui-widget.ui-datepicker .ui-widget-header {
	background: #fff;
	border: 0
}

.ui-widget.ui-datepicker .ui-state-default {
	border: 0
}

.ui-widget.ui-datepicker td span,
.ui-widget.ui-datepicker td a {
	text-align: center;
	border-radius: 10px;
	padding: 6px 2px 0;
	margin: 0 2px;
	width: 31px;
	height: 31px;
	background: none
}

.ui-widget.ui-datepicker .ui-state-highlight {
	background: #e9ecef;
	color: #000
}

.ui-widget.ui-datepicker .ui-state-active {
	background: #534f8c;
	color: #fff !important
}

.ui-widget.ui-datepicker .ui-datepicker-calendar {
	font-size: inherit
}

.ui-widget.ui-datepicker .ui-datepicker-calendar>thead th {
	border-top: 1px solid #ececea;
	border-bottom: 1px solid #ececea
}

.ui-widget.ui-datepicker .ui-datepicker-calendar>thead th.ui-datepicker-week-end:first-child,
.ui-widget.ui-datepicker .ui-datepicker-calendar>tbody td.ui-datepicker-week-end:first-child a {
	color: #fc5162
}

.ui-widget.ui-datepicker .ui-datepicker-calendar>tbody tr:first-child a,
.ui-widget.ui-datepicker .ui-datepicker-calendar>tbody tr:first-child span {
	margin-top: 8px
}

.ui-widget.ui-datepicker .ui-datepicker-prev {
	cursor: pointer
}

.ui-widget.ui-datepicker .ui-datepicker-prev .ui-icon {
	display: none
}

.ui-widget.ui-datepicker .ui-datepicker-prev::before {
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 7px 5px 0;
	border-color: transparent #534f8c transparent transparent;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

.ui-widget.ui-datepicker .ui-datepicker-next {
	cursor: pointer
}

.ui-widget.ui-datepicker .ui-datepicker-next .ui-icon {
	display: none
}

.ui-widget.ui-datepicker .ui-datepicker-next::before {
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 7px;
	border-color: transparent transparent transparent #534f8c;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

.ui-widget.ui-datepicker select.ui-datepicker-month,
.ui-widget.ui-datepicker select.ui-datepicker-year {
	width: auto;
	border: 0;
	font-size: 15px
}

.ui-widget.ui-datepicker select.ui-datepicker-month {
	margin-left: 12px
}

textarea.form-control {
	resize: none
}

.pagination {
	margin-top: 1rem;
	justify-content: center;
	width: 100%
}

.pagination .page-link {
	width: 32px;
	height: 32px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center
}

@media screen and (max-width: 768px) {
	.pagination .page-link {
		width: 28px;
		height: 28px
	}
}

.mCSB_scrollTools {
	width: 12px
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	width: 5px;
	border-radius: 6px
}

.mCSB_inside>.mCSB_container {
	margin-right: 20px
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
	background-image: url("/resources/admin/images/icon-arrow-left-77ce430380cb73a2d24ccdc227518ea5.svg");
	background-size: contain;
	width: 12.8px;
	height: 23px;
	margin-top: -11.5px
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
	background-image: url("/resources/admin/images/icon-arrow-right-eea35ca0d9aa4380241e8c131d1616ee.svg");
	background-size: contain;
	width: 12.8px;
	height: 23px;
	margin-top: -11.5px
}

.tab-custom {
	border-bottom: 1px solid #ddd;
	padding: .5rem 1.5rem;
	background-color: rgba(0, 0, 0, .04)
}

.tab-custom .nav-tabs {
	border-bottom: 0;
	margin-left: -1rem;
	margin-right: -1rem;
	margin-bottom: -0.5rem
}

.tab-custom .nav-tabs .nav-link {
	font-weight: 700;
	color: #999;
	position: relative;
	transition: .2s
}

.tab-custom .nav-tabs .nav-link.active {
	color: #343a40
}

.card-header .tab-custom {
	margin: -1rem -1.25rem;
	background: none
}

.nav-justified .nav-link:not (.active) {
	background: #f1f2f3
}

.more {
	display: inline-block;
	width: 30px;
	height: 30px;
	border: 1px solid #e6e6e6;
	position: relative
}

.more::after {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	background: url("../images/icon-plus-red.svg") 50% 50% no-repeat;
	transition: transform .7s ease;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -5px 0 0 -5px
}

.more:hover::after {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg)
}

.title {
	font-size: 24px;
	font-weight: 700;
	padding: 1rem;
}

@media screen and (max-width: 768px) {
	.title {
		font-size: 18px
	}
}

.sub-title {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 3rem
}

@media (max-width : 0.98px) {
	.sub-title {
		font-size: 24px;
		margin-bottom: 1.5rem
	}
}

.sub-title-point {
	position: relative;
	padding-left: 40px;
	line-height: 24px;
	margin-bottom: 40px;
	margin-top: 60px;
	font-size: 22px;
	font-weight: 700
}

.sub-title-point::before {
	content: "";
	background: url("../images/title-point.svg") no-repeat 0 0;
	background-size: contain;
	width: 24px;
	height: 24px;
	position: absolute;
	left: 0;
	top: 0
}

@media (max-width : 0.98px) {
	.sub-title-point {
		font-size: 17px;
		padding-left: 30px;
		margin-bottom: 25px;
		line-height: 18px;
		margin-top: 54px
	}

	.sub-title-point::before {
		background-size: 18px 18px;
		width: 18px;
		height: 18px
	}
}

.table-view {
	border-top: 1px solid #000
}

.table-view tbody th {
	background: none;
	font-weight: 700
}

.table-view tbody th.tit {
	font-size: 22px;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	height: auto
}

.table-view .viewwrap {
	line-height: 1.8
}

.table-view .viewwrap p {
	margin: 1em 0
}

.section {
	background: #fff;
	position: relative;
	overflow: hidden
}

.split-horizontal {
	display: flex;
	flex-direction: row;
	height: 100%;
/*	overflow-y: auto;*/
/*	overflow-x: hidden*/
}

.gutter {
	background-color: #f1f2f3;
	background-repeat: no-repeat;
	background-position: 50%;
	position: relative
}

.gutter.gutter-horizontal {
	background-image:
		url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==");
	cursor: col-resize;
	border-left: 1px solid #e5e5e5;
	border-right: 1px solid #d5d5d5
}

.gutter.gutter-vertical {
	background-image:
		url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=");
	cursor: row-resize;
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #d5d5d5
}

tr.selected th,
tr.selected td {
	background: #fff3dc
}

.bootstrap-timepicker .input-group-addon {
	position: absolute;
	right: .5rem;
	top: 50%;
	z-index: 3;
	transform: translateY(-50%);
	line-height: 1
}

.bootstrap-timepicker .input-group-addon i {
	font-size: 16px;
	color: #888a8d
}

.bootstrap-timepicker .form-control-sm+.input-group-addon i {
	font-size: 13px;
	width: 13px;
	height: 13px
}

.bootstrap-timepicker-widget {
	box-shadow: 0px 3px 10px 0 rgba(0, 0, 0, .06)
}

.bootstrap-timepicker-widget table td input {
	width: 30px;
	padding-top: 3px
}

.table-overflow-scroll {
	width: 100%;
	max-height: 25vh;
	overflow: auto
}

.table-overflow-scroll .table {
	position: relative;
	border-bottom: 0
}

.table-overflow-scroll .table th,
.table-overflow-scroll .table td {
	white-space: nowrap;
	padding-left: 1rem;
	padding-right: 1rem
}

.table-overflow-scroll .table thead th {
	position: sticky;
	top: 0
}

.table-overflow-scroll .table thead th::before {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	border-top: 1px solid #e6e6e6;
	display: block;
	top: -1px
}

.table-overflow-scroll .table thead th::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	border-bottom: 1px solid #e6e6e6;
	display: block;
	bottom: -1px
}

#skip_navi {
	position: fixed;
	left: 0;
	top: -999px;
	display: block;
	padding: .5rem 1.5rem;
	font-size: 15px;
	color: #fff;
	font-weight: 700;
	background: #fc5162
}

#skip_navi:focus {
	top: 0;
	z-index: 999
}

html,
body {
	height: 100%
}

body {
	overflow-x: hidden;
	width: 100%
}

#wrap {
	min-height: 100%;
	display: flex;
	flex-direction: column;
	overflow: hidden
}

[class^=my-status] {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
	transform: translateY(-1px)
}

.my-status-1 {
	background: #28a745
}

.my-status-2 {
	background: #ffa807
}

.my-status-3 {
	background: #fc5162
}

header {
	transition: .2s ease-out;
	background: #FFFFFF;
	border-bottom: 2px solid #EFEFEF;
	height: 40px;
}

/*@media screen and (max-width: 768px) {
	header {
		padding-left: 150px;
		position: relative
	}

	header>.row {
		display: block !important
	}

	header>.row>.col,
	header>.row>.col-auto {
		position: static
	}
}*/

header .left {
	display: flex;
	align-items: center;
	padding-left:2rem;
	position: relative;
}

header .left .btn-hamburger {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center
}

header .left .btn-hamburger i {
	vertical-align: top;
	font-size: 26px;
	color: #fff
}

header .right {
	display: flex;
	align-items: center;
	padding-right: 1rem
}

/*@media screen and (max-width: 768px) {
	header .right {
		position: absolute;
		right: 1rem;
		top: 1rem;
		height: auto;
		padding-right: 0
	}
}
*/
/*header .right button {*/
/*	width: 30px;*/
/*	height: 30px*/
/*}*/

header .right button i {
	vertical-align: top;
}

header .right .btn-my-setting {
	margin-right: 10px
}

header .right .btn-my-setting+.dropdown-menu {
	box-shadow: 3px 5px 5px rgba(0, 0, 0, .1)
}

header .right .btn-my-setting+.dropdown-menu p {
	padding: 0 1.5rem .25rem
}

.menu-pan.active {
	display: flex;
}

.menu-pan {
	position: absolute;
	top: 40px;
	left: 135px;
	z-index: 99999;
	display: none;
	background-color: rgba(55, 55, 55, 0.8);
	padding-bottom: 10px;

	>ul {
		>li {
			width: 120px;
			margin: 10px 5px;
			text-align: center;
			position: relative;

			>span {
				font-size: 14px;
				font-weight: 700;
				color: #fff;
				cursor: default;
			}

		}

		>li>ul>li {
			margin: 5px 0;
		}

		>li>ul>li>a {
			color: #d0d0d7;
			font-weight: 300;

			&:hover {
				color: #fff;
				text-decoration: none;
			}

			>span.active {
				color: #afc4fd;
				font-weight: 700;
			}
		}
	}
}

/*@media screen and (max-width: 768px) {
	.gnb {
		margin-top: 0;
		margin-bottom: .75rem
	}
}*/

.gnb>ul {
	display: inline-flex;
	align-items: center
}

.gnb>ul>li {
	margin: 0 2.1rem;
	position: relative;
	text-align: center
}

/*@media screen and (max-width: 768px) {
	.gnb>ul>li {
		margin: 0 .45rem
	}
}*/

.gnb>ul>li>a {
	font-size: 16px;
	font-weight: 500;
}
/*
@media screen and (max-width: 768px) {
	.gnb>ul>li>a {
		font-size: 14px;
		line-height: 1
	}
}
*/
.gnb>ul>li.active>a {
	font-weight: 600
}

.gnb>ul>li.active::before {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #afc4fd;
	position: absolute;
	left: 50%;
	top: -5px;
	transform: translateX(-50%)
}

aside {
	/*position: fixed;*/
	position: absolute;
	overflow: hidden;
	transition: .5s;
	width: 220px;
	opacity: 1;
	background: #47474e;
	height: 100%;
/*	height: calc(100vh - 36px);*/
	z-index: 1;
	top: 0;
	left: 0
}

@media screen and (max-width: 768px) {
	aside {
		width: 150px;
		height: 100%
	}
}

.sidebar-top {
	background: #32373c;
	height: 65px;
	display: flex;
	align-items: center;
	justify-content: center
}

.sidebar {
	white-space: nowrap;
	height: 100%;
	transition: opacity .2s
}

.sidebar a {
	text-decoration: none
}

.sidebar .overflow-y-scroll {
	height: calc(100vh - 65px)
}

.sidebar .mCSB_inside>.mCSB_container {
	margin-right: 0
}

.sidebar .dep1 {
	padding-bottom: 40px;
	opacity: 0;
	display: none
}

.sidebar .dep1 a {
	color: #ebebeb
}

.sidebar .dep1 a:hover {
	color: #fff
}

.sidebar .dep1>li {
	border-bottom: 1px solid #6b6b75
}

.sidebar .dep1>li>a {
	display: block;
	padding: .75rem 1rem;
	position: relative;
	font-weight: 500
}

.sidebar .dep1>li.active {
	background: #707077
}

.sidebar .dep1>li.active>a {
	font-weight: 900;
	color: #fff
}

.sidebar .dep1>li.has-treeview>a::before {
	content: "";
	background: url("/resources/admin/images/icon-arrow-right-white-73587cb5cff3399ffd4ca84a92b4ca97.svg") no-repeat 0 0;
	background-size: contain;
	width: 6px;
	height: 12px;
	display: block;
	position: absolute;
	right: 1rem;
	top: 50%;
	margin-top: -6px;
	transition: .15s
}

.sidebar .dep1>li.has-treeview.open>a {
	font-weight: 700
}

.sidebar .dep1>li.has-treeview.open>a::before {
	transform: rotate(90deg)
}

.sidebar .dep1>li.has-treeview.open .dep2 {
	display: block
}

.sidebar .dep1>li.has-treeview .dep2 {
	display: none
}

.sidebar .dep2 {
	padding-bottom: .5rem
}

.sidebar .dep2>li>a {
	display: block;
	padding: .4rem 1rem .4rem 1rem;
	font-weight: 500
}

.sidebar .dep2>li>a::before {
	content: "";
	display: inline-block;
	width: 3px;
	height: 3px;
	background: #fff;
	vertical-align: middle;
	margin-right: 6px;
	border-radius: 50%;
	transform: translateY(-2px)
}

.sidebar .dep2>li.active a {
	color: #afc4fd;
	font-weight: 700
}

.sidebar .dep2>li.active a span {
	position: relative;
	display: inline-block
}

.sidebar .dep2>li.active a span::after {
	content: "";
	width: 100%;
	height: 1px;
	background: #afc4fd;
	position: absolute;
	left: 0;
	bottom: -1px
}

.quick-menu {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding-top: 40px;
	background: #4c4c52;
	box-shadow: 0 -8px 20px rgba(38, 38, 41, .7)
}

.quick-menu .btns {
	position: absolute;
	right: .75rem;
	top: 6px
}

.quick-menu .btns i {
	vertical-align: middle;
	color: #fff
}

.quick-menu .btn-quick-setting i {
	font-size: 20px
}

.quick-menu .btn-quick-expand {
	margin-left: 3px
}

.quick-menu .btn-quick-expand i {
	font-size: 28px
}

.quick-menu strong {
	position: absolute;
	left: 1rem;
	top: 6px;
	padding-top: 3px;
	color: #fff
}

.quick-menu ul {
	background: #d3d6da;
	padding: 1rem;
	overflow: hidden;
	display: none
}

.quick-menu ul li+li {
	margin-top: 8px
}

.quick-menu ul li a {
	display: block;
	background: #343a40;
	color: #fff;
	padding: .25rem;
	text-align: center;
	text-decoration: none
}

.quick-menu.active .btn-quick-expand i {
	transform: rotate(180deg)
}

.quick-menu.active ul {
	display: block
}

#container-block {
	flex-grow: 1
}

#content {
	transition: .5s;
	min-height: calc(100vh - 65px - 36px);
	background: #F5F5F5;
}

@media screen and (max-width: 768px) {
	#content {
		margin-left: 150px
	}
}

html.is-collapsed aside {
	width: 0;
	opacity: 0
}

html.is-collapsed #content {
	margin-left: 0
}

.btn-top {
	position: fixed;
	bottom: -100px;
	right: 60px;
	z-index: 1;
	transition: .4s ease-in .1s
}

.btn-top>a {
	width: 60px;
	height: 60px;
	border: 1px solid #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff
}

.btn-top .icon-top {
	background-image: url("../images/icon-top.svg");
	width: 24px;
	height: 28px
}

html.is-scrolled .btn-top {
	bottom: 260px
}

footer .inner {
	margin-left: 220px;
	padding: 0 1rem;
	border-top: 1px solid #ddd;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center
}

footer p {
	text-align: center;
	color: #999
}

.menu-list {
	border: 1px solid #ddd;
	padding: 1rem;
	height: 320px;
	line-height: 1.6
}

.menu-list .overflow-y-scroll {
	height: 100%
}

.menu-list .all-list span,
.menu-list .all-list a {
	display: block;
	padding: .1rem .25rem
}

.menu-list .all-list a.selected {
	background: #fff2dc;
	color: #000
}

.menu-list .all-list>li>span {
	font-weight: 700
}

.menu-list .dep2>li {
	padding-left: .75rem;
}

.menu-list .child>span {
	font-weight: 700
}

.menu-list .dep3>li {
	padding-left: 1.5rem
}

.menu-list .selected-list {
	line-height: 1.6
}

.menu-list .selected-list li>a {
	display: block;
	padding: .1rem .25rem
}

.profile {
	width: 190px;
	height: 0;
	padding-bottom: 133.3333%;
	background: #f8f8f8 url("/resources/admin/images/icon-profile-eb2743ff21e040a0e7f796b36fed9e3e.svg") no-repeat 50% 50%;
	background-size: 90% auto;
	position: relative
}

.profile img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	object-fit: cover
}

.list-group-item h5 {
	font-size: 14px
}

.list-group-item p {
	font-size: 13px
}

.bg-1 {
	background: #eaffdb
}

.bg-2 {
	background: #ffe3e3
}

.bg-3 {
	background: #fff3cd
}

.bg-4 {
	background: #e6eefa
}

.bg-5 {
	background: #f6e0ff
}

.bg-6 {
	background: #f1f1f1 !important
}

.weekly-schedule {
	line-height: 1.2;
	font-size: 12px
}

.weekly-schedule .table {
	height: 500px
}

.weekly-schedule .table th,
.weekly-schedule .table td {
	padding: 5px
}

.weekly-schedule .table tbody th,
.weekly-schedule .table tbody td {
	height: 58px
}

.weekly-schedule .table tbody tr:first-child th,
.weekly-schedule .table tbody tr:first-child td {
	height: auto
}

.weekly-schedule .where+.subject {
	margin-top: .25rem
}

.weekly-schedule .first-cell td {
	height: 30px !important;
	padding: 3px !important
}

.weekly-schedule.mini .table {
	height: 340px
}

.weekly-schedule.mini tbody th,
.weekly-schedule.mini tbody td {
	height: 45px
}

.class-schedule {
	line-height: 1.5
}

.class-schedule .table th,
.class-schedule .table td {
	padding: 5px;
	position: relative
}

.class-schedule .table tbody th,
.class-schedule .table tbody td {
	height: 80px
}

.class-schedule .fc-header-toolbar>div {
	flex-basis: 0;
	flex-grow: 1
}

.class-schedule .fc-header-toolbar .fc-center>div {
	justify-content: center
}

.class-schedule .fc-header-toolbar .fc-right {
	text-align: right
}

.class-schedule [data-subject] {
	color: #343a40
}

.class-schedule.highlight-korean [data-subject=korean] {
	background: #eaffdb
}

.class-schedule.highlight-math [data-subject=math] {
	background: #ffe3e3
}

.class-schedule.highlight-english [data-subject=english] {
	background: #fff3cd
}

.class-schedule.highlight-science [data-subject=science] {
	background: #e6eefa
}

.class-schedule.highlight-social [data-subject=social] {
	background: #f6e0ff
}

.class-schedule.highlight-formal [data-type=formal]::before {
	content: "";
	position: absolute;
	left: -1px;
	top: -1px;
	right: -1px;
	bottom: -1px;
	border: 2px solid #99c7ff
}

.class-schedule.highlight-optional [data-type=optional]::before {
	content: "";
	position: absolute;
	left: -1px;
	top: -1px;
	right: -1px;
	bottom: -1px;
	border: 2px solid #99c7ff
}

.class-schedule.highlight-dividing [data-dividing=true]>div {
	color: #28a745;
	font-weight: 700
}

.class-schedule td.clicked {
	background: #687077 !important
}

.class-schedule td.clicked>div {
	color: #fff
}

.schedule-highlight .toggler {
	transform: rotate(180deg);
	line-height: 1
}

.schedule-highlight .toggler-sub {
	transform: rotate(180deg);
	vertical-align: middle;
	display: inline-block
}

.schedule-highlight .toggler-sub .material-icons {
	vertical-align: middle
}

.schedule-highlight label {
	font-weight: 500
}

.schedule-highlight .card {
	border-radius: 0
}

.schedule-highlight .card.collapsed .card-body {
	display: none
}

.schedule-highlight .card.collapsed .toggler {
	transform: rotate(0)
}

.schedule-highlight .card+.card {
	border-top: 0
}

.schedule-highlight .card-header {
	position: relative;
	font-size: 14px;
	border-bottom: 0;
	background: #fff;
	padding: .75rem 1rem
}

.schedule-highlight .card-header .toggler {
	position: absolute;
	right: .75rem;
	top: 50%;
	margin-top: -15px
}

.schedule-highlight .card-header .toggler .material-icons {
	font-size: 30px
}

.schedule-highlight .card-body {
	padding: 0 1rem 1rem 2.25rem
}

.schedule-highlight .card-body li+li {
	margin-top: .25rem
}

.schedule-highlight .card-body ul ul {
	padding-left: 1.5rem;
	margin-top: .25rem
}

.schedule-highlight .card-body li.collapsed ul {
	display: none
}

.schedule-highlight .card-body li.collapsed .toggler-sub {
	transform: rotate(0)
}

.action {
	display: inline-flex;
	align-items: center
}

.action>a,
.action>span {
	margin: 0 2px;
	border: 1px solid #eee;
	border-radius: 3px;
	display: inline-block;
	padding: 3px 5px;
	color: #d5d5d5;
	font-size: 12px;
	line-height: 1;
	font-weight: 500;
	text-decoration: none
}

.action>a.active,
.action>span.active {
	border-color: #fc5162;
	color: #fc5162;
	cursor: pointer
}

.fc-button .fr-icon {
	vertical-align: top
}

.fc-prev-button {
	padding: 3px;
	margin: 0 20px 0 0
}

.fc-next-button {
	padding: 3px;
	margin: 0 0 0 20px
}

.fc-header-toolbar {
	margin-bottom: 1rem !important
}

.fc-header-toolbar .fc-left {
	width: 25%
}

.fc-header-toolbar .fc-center {
	width: 50%
}

.fc-header-toolbar .fc-center>div {
	display: flex;
	align-items: center;
	justify-content: center
}

.fc-header-toolbar .fc-center h2 {
	font-size: 18px;
	text-align: center;
	line-height: 1
}

.fc-header-toolbar .fc-center h2 small {
	font-size: 13px;
	font-weight: 500
}

.fc-header-toolbar .fc-right {
	width: 25%;
	text-align: right
}

.fc-day-header {
	padding: 5px 0
}

.fc-time-grid-event .fc-time {
	font-size: 12px;
	font-weight: 500;
	padding-top: 2px
}

.fc-time-grid-event .fc-title {
	font-size: 12px;
	font-weight: 700;
	padding-top: 2px
}

.fc-time-grid-event.fc-short .fc-title {
	font-size: 12px;
	font-weight: 500;
	padding-top: 2px
}

.fc-event {
	cursor: pointer
}

.fc-time-grid .fc-slats td {
	height: 2.3vh
}

.fc-button {
	padding-top: .21em;
	padding-bottom: .25em;
	border-radius: 0
}

.level-1 {
	border-color: #f2f2f2;
	background-color: #f2f2f2;
	color: #444 !important
}

.level-2 {
	border-color: #d9d9d9;
	background-color: #d9d9d9;
	color: #444 !important
}

.level-3 {
	border-color: #b3b3b3;
	background-color: #b3b3b3;
	color: #444 !important
}

.level-4 {
	border-color: #999;
	background-color: #999;
	color: #444 !important
}

.scheduled {
	border-color: #4c90f9;
	background-color: #4c90f9;
	color: #fff !important
}

.make-up .fc-header-toolbar .fc-center h2 {
	font-size: 16px;
	white-space: nowrap
}

.make-up .fc-time-grid-event .fc-content {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center
}

.make-up .fc-time-grid-event .fc-time {
	display: none
}

.make-up .fc-time-grid .fc-slats td {
	height: 1.8vh
}

.list-group-toggle .list-group-top {
	position: relative
}

.list-group-toggle .student-name {
	position: absolute;
	right: 1rem;
	top: 1rem;
	z-index: 1;
	line-height: 1
}

.list-group-toggle a.list-group-item {
	text-decoration: none
}

.list-group-toggle .list-group-detail {
	border: 1px solid #ddd;
	border-top: 0;
	border-bottom: 0;
	display: none;
	position: relative
}

.list-group-toggle .list-group-detail>p {
	font-weight: 500
}

.list-group-toggle .list-group-detail label {
	color: #969ba0
}

.list-group-toggle .active {
	background: #f7f8f8
}

.list-group-toggle .active .list-group-item {
	background: #f7f8f9
}

.list-group-toggle .active .list-group-detail {
	display: block
}

.list-group-toggle .item-wrap+.item-wrap {
	margin-top: 10px
}

.seat {
	display: flex;
	justify-content: center;
	overflow: hidden
}

.seat .divider {
	display: flex;
	margin: 0 20px
}

.seat .divider span {
	display: block;
	width: 1px;
	height: 100%;
	background: #ddd
}

.seat ol {
	margin: 0 10px
}

.seat ol li {
	padding: 6px 0
}

.seat ol a {
	height: 32.5px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #ddd;
	width: 60px;
	line-height: 1;
	text-decoration: none;
	background: url("/resources/admin/images/bg-btn-line-1c746cf3edd45375113b9b99ef707234.png") 0 0 repeat;
	border: 1px solid #e5e5e5
}

.seat ol a[aria-pressed=true] {
	position: relative;
	border-width: 3px;
	border-color: #555 !important
}

.seat ol a[disabled],
.seat ol a.disabled {
	opacity: .4;
	cursor: default;
	pointer-events: none
}

[data-seat-status] {
	width: 12px;
	height: 12px;
	display: inline-block;
	vertical-align: middle;
	border: 1px solid #ddd;
	transform: translateY(-1px)
}

[data-seat-status][data-seat-status=completion] {
	background: #d7fcee !important;
	border-color: #d4e6df
}

[data-seat-status][data-seat-status=warning] {
	background: #ffddd3 !important;
	border-color: #dfcdcd
}

[data-seat-status][data-seat-status=learning] {
	background: #eee !important;
	border-color: #ddd
}

[data-seat-status][data-seat-status=approval] {
	background: #bbb !important;
	border-color: #aaa
}

.seat-desc dl {
	display: flex;
	align-items: center
}

.seat-desc dd {
	margin-left: 5px;
	margin-right: 15px
}

.immersion-point>a {
	padding: 0;
	width: 32px;
	height: 32px;
	text-align: center;
	line-height: 32px;
	font-weight: 700
}

.report {
	max-width: 21cm;
	margin: 0 auto
}

.sms-area {
	width: 440px;
	background: #f2f3f4;
	padding: 1.5rem
}

.sms-area .sms-header {
	margin-top: .5rem
}

.sms-area .sms-body {
	margin-top: 5px
}

.sms-area .sms-test {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: .5rem;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin-top: 1rem
}

.sms-area .sms-footer {
	margin-top: 1.5rem
}

.message {
	position: relative;
	margin-left: 20px;
	padding: 10px;
	background-color: #e5e6e7;
	width: 260px;
	border: 1px solid #e5e6e7;
	border-radius: 10px
}

.message .message-title {
	font-weight: 700
}

.message .message-content {
	padding: 0;
	margin: 0
}

.message .message-content::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-top: 15px solid #e5e6e7;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	top: 0;
	left: -15px
}

.message .message-content::before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-top: 17px solid #e5e6e7;
	border-left: 16px solid transparent;
	border-right: 16px solid transparent;
	top: -1px;
	left: -17px
}

.push-area {
	width: 560px;
	background: #f2f3f4;
	padding: 1.5rem
}

.push-outer {
	position: relative;
	border-radius: 40px;
	padding: 1.5rem;
	background: #444;
	color: #fff
}

.push-outer .form-control {
	border-color: #444
}

.push-outer.locked {
	border-radius: 1rem;
	padding: 1rem
}

.push-outer strong {
	display: block;
	margin-bottom: .25rem
}

.table-dashboard-style .table {
	background: #fff;
	border-color: #ccc
}

.table-dashboard-style .table thead th {
	background: #f4f4f4
}

.table-dashboard-style .table th,
.table-dashboard-style .table td {
	border-color: #ccc
}

.table-dashboard-style .table tr:nth-child(even) th,
.table-dashboard-style .table tr:nth-child(even) td {
	background: #f8f8f8
}

.seat .table thead {
	display: none
}

.seat .table td {
	height: 25px;
	padding: 0
}

.seat .table td:hover,
.seat .table td.hover {
	background-color: #fff
}

.seat .table td.ui-selecting {
	background-color: #ba7800;
	border-color: #e2ca9d
}

.seat .table td.ui-selecting.ui-selected {
	background-color: #ba7800
}

.seat .table td.ui-selected {
	background-color: #ffa807;
	border-color: #f7e1b9
}

.ui-lasso {
	display: none
}

.selectedInstructor+.selectedInstructor::before {
	content: ", "
}

.student-assign .table td {
	padding-top: .3rem;
	padding-bottom: .3rem
}

.table-answer-sheet th,
.table-answer-sheet td {
	padding-left: .25rem;
	padding-right: .25rem
}

.half-yearly-schedule th,
.half-yearly-schedule td {
	padding-top: .3rem;
	padding-bottom: .3rem
}

.collapsed i.fa-caret-up {
	transform: rotate(180deg)
}

.step-wrapper {
	padding: 20px 0;
	display: none
}

.step-wrapper.active {
	display: block
}

.step-indicator {
	border-collapse: separate;
	display: table;
	margin-left: 0px;
	position: relative;
	table-layout: fixed;
	text-align: center;
	vertical-align: middle;
	padding-left: 0;
	padding-top: 20px
}

.step-indicator a {
	display: table-cell;
	position: relative;
	width: 1%;
	text-decoration: none
}

.step-indicator a:after {
	background-color: #c5c5c5;
	content: "";
	display: block;
	height: 1px;
	position: absolute;
	width: 100%;
	top: 25px;
	left: 50%
}

.step-indicator a:last-child:after {
	display: none
}

.step-indicator a.active .step {
	border-color: #343a40;
	color: #343a40
}

.step-indicator a.active .caption {
	color: #343a40
}

.step-indicator .step {
	background-color: #fff;
	border-radius: 50%;
	border: 1px solid #c5c5c5;
	color: #c5c5c5;
	font-size: 20px;
	height: 50px;
	line-height: 50px;
	margin: 0 auto;
	position: relative;
	width: 50px;
	z-index: 1
}

.step-indicator .step i {
	transform: translateY(-1px)
}

.step-indicator .caption {
	color: #c5c5c5;
	padding: 10px 16px;
	font-weight: 700
}

.login {
	background: #50575f;
	height: 100%;
	width: 100%
}

.login .inner {
	width: 450px;
	margin: 0 auto;
	background: #f5f5fa;
	padding: 3rem;
	border-radius: .75rem;
	box-shadow: 3px 5px 15px rgba(0, 0, 0, .05)
}

#back {
	position: fixed;
	z-index: 2000;
	background-color: rgba(0, 0, 0, .5);
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: none
}

#loadingBar {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2001;
	display: none
}

#loadingBar img {
	width: 60px
}

.body-dashboard header {
	padding-left: 0
}

.body-dashboard header .left .logo {
	display: flex
}

.dashboard {
	background: #f7f8f9;
	min-height: calc(100vh - 65px);
	padding: 3rem 5rem;
	margin-left: -220px
}

.dashboard .weekly-schedule {
	font-size: 13px
}

.dashboard .weekly-schedule .table {
	height: 380px
}

.dashboard .weekly-schedule .table tbody th,
.dashboard .weekly-schedule .table tbody td {
	height: auto
}

.welcome {
	font-weight: 700
}

.post-it {
	padding: .75rem;
	background: #f5f5ee;
	position: relative
}

.post-it+.post-it {
	margin-top: 1.75rem
}

.post-it::before {
	content: "";
	position: absolute;
	bottom: -1rem;
	right: 0;
	border-width: 1rem 1rem 0 0;
	border-style: solid;
	border-color: #d9d9be transparent
}

.post-it::after {
	content: "";
	position: absolute;
	bottom: -1rem;
	left: 0;
	right: 1rem;
	border-width: .5rem;
	border-style: solid;
	border-color: #f5f5ee
}

.post-it.highlight {
	background: #fcf7b0
}

.post-it.highlight::before {
	border-color: #f9f066 transparent
}

.post-it.highlight::after {
	border-color: #fcf7b0
}

.btn-memo-add {
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%)
}

.team-memo .range {
	display: block;
	margin-bottom: .25rem
}

.team-memo .memo {
	margin-bottom: .5rem
}

.team-memo .info {
	color: #888;
	font-size: 12px;
	position: absolute;
	left: .75rem;
	bottom: -0.25rem;
	z-index: 1
}

.team-memo .dropdown-menu {
	min-width: 5rem
}

.btn-memo-more {
	position: absolute;
	right: 0
}

.btn-memo-more i {
	font-size: 18px
}

.cke_custom_frame {
	border: 0px !important;
	padding: 0px !important;
}

.table-header {
	font-weight: bold;
}

.subjct-text-button {
	color: gray;
	background: none;
	border: none;
	padding: 0;
	margin: 0 5px;
}

.subjct-text-button.active {
	color: black;
}

.font-red {
	color: red;
}

.subjctTextButton.active {
	font-weight: bold !important;
}

header .row {
	margin-right: 0;
}

body {
	overflow-x: auto;
}

.wrap {
	/*overflow-x: auto;*/
	min-width: 1600px;
	position:relative;
}

@media screen and (max-width: 768px) {
	.pagination .page-link {
		width: 28px;
		height: 28px
	}
}

@media screen and (max-width: 767px) {
	.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_paginate{
		float: inline-start !important;
		text-align: center;
	}
}
/*# sourceMappingURL=style.css.map */


/* 추가 css 시작 */
table.dataTable thead th {
	background-color: #FCFCFC !important;
}
table.dataTable tbody{
	background-color: #FFFFFF;
}
.dataTables_wrapper .dataTables_length select {
	background-color: #FFFFFF !important;
}

/* 문항관리 */
.qstList-container {
	display: flex;
	height: calc(100vh - 180px);
	overflow: hidden;
}

.qstList-container .left-panel {
	background-color: #f8f9fa;
	overflow-y: auto;
/*	padding: 20px;*/
}

.qstList-container .right-panel {
	background-color: #fff;
	display: flex;
	flex-direction: column;
/*	height: calc(100vh - 120px);*/
}
.left-panel-header{
	height: 60px;
	padding: 20px;
	align-items: center;
}
/*#cardContainer .dataTables_wrapper .dataTables_paginate .paginate_button {
	background-color: #f0f0f0 !important;
	border-radius: 50% !important;
	padding: 0 !important;
	margin: 0 8px !important;
	text-align: center !important;
	color: #555 !important;
	font-weight: normal !important;
	text-decoration: none !important;
	display: inline-block !important;
	width: 30px !important;
	height: 30px !important;
	line-height: 30px !important;
	vertical-align: middle !important;
	font-size: 14px !important;
	border: 1px solid #ddd !important;
}


#cardContainer .dataTables_wrapper .dataTables_paginate .paginate_button.current {
	background-color: #333 !important;
	color: white !important;
	border: 1px solid #333 !important;
	font-weight: bold !important;
}


#cardContainer .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background-color: #e0e0e0 !important;
	color: #333 !important;
}


#cardContainer .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background-color: #333 !important;
	color: white !important;
}*/
.qstList-container .right-panel .top-section {
	display: flex;
	justify-content: space-between;
	height: 60px;
	background-color: #FFFFFF;
	padding: 20px;
	align-items: center;
}

.qstList-container .right-panel .bottom-section {
	flex: 1;
	display: flex;
	background-color: #F5F5F5;
/*	padding: 20px;*/
	height: calc(100vh - 232px);
/*	overflow: auto;*/
}

.qstList-container #initBottomSection{
	flex: 1;
	display: flex;
	gap: 20px;
	background-color: #F5F5F5;
	padding: 20px;
	overflow: auto;
}

/*.qstList-container .right-panel .bottom-section .card-container {*/
/*	flex: 1;*/
/*	padding: 20px;*/
/*	overflow-y: auto;*/
/*}*/
.qstList-container .right-panel .bottom-section .card-container {
  flex: 1;
  padding: 20px;
  display: flex;
  flex-direction: column;
}
.qstList-container .right-panel .bottom-section .card-container #cardList {
  flex: 1;
  overflow-y: auto;
}

/* dataTables_wrapper를 항상 하단에 고정 */
.qstList-container .right-panel .bottom-section .card-container .dataTables_wrapper {
  margin-top: auto;
  padding-top: 10px;
}
.qstList-container .right-panel .bottom-section .qst-preview {
	flex: 0;
	padding: 20px;
	padding-left: 0;
/*	overflow-y: auto;*/
	display: none;
}

.qstList-container .right-panel .bottom-section.preview-active .card-container {
	flex: 6;
}

.qstList-container .right-panel .bottom-section.preview-active .qst-preview {
	flex: 4;
}
/* 드래그 중 텍스트 선택 방지 */
.user-select-none {
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

/* qst list */
.sub-text{
	font-size: 12px;
	color: #B7B7B7;
}
.gray-text {
	font-size: 12px;
	color: #777777;
}
.title-text {
	font-size: 12px;
	font-weight: 700;
}
.card-container {
  padding: 20px;
}

.page-select {
  margin-bottom: 15px;
}

.card-item {
  flex-direction : row;
}

.qstList-container .select-area .form-control{
	width : 104px;
}
.qstList-container .search-input .form-control{
	width : 160px;
}
.qstList-container .card-left {
  width : 40px;
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  border-right: 1px solid #e0e0e0;
}

.qstList-container .card-header:first-child{
	border-radius: 0;
}
.card-item.selected {
  border-color: #1067ff;
}

.card-item.qst-item.qst-check .card-left {
  background-color: #1067ff;
}

.card-item.qst-item.qst-check .card-left .text-center .card-index {
  color: #FFFFFF;
}

.card-item.selected > .card-right > .card-body {
	background-color: #EAF5FF;
}

.card-right {
  flex: 9;
  display: flex;
  flex-direction: column;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  width: 100%;
  align-items: center;
}

.qstCardList .card-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  width: 100%;
  align-items: center;
}

.card-grid .grid-item {
  display: flex;
  flex-direction: column;
}

.card-grid .label {
  font-size: 10px;
  color: #B7B7B7;
}

.card-grid .value {
  font-size: 12px;
}
.search-input {
	position: relative;
}

.search-input .search-icon {
	position: absolute;
	top: 43%;
	right: 10px;
	transform: translateY(-50%);
	font-size: 20px;
 }
 .qstList-container .card-header{
	 background-color: #FFFFFF;
	 font-size: 12px;
	 padding: 10px;
 }
 
 .qstList-container .card-body{
	 background-color: #FCFCFC;
	 padding: 10px;
 }
 .qst-prevew-header{
	 height: 28px;
 }
 .card-container-header{
	 height: 28px;
 }
/* .qst-preview .card{
	 height : 100%;
 }*/
.qst-preview .card-grid {
	grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
}
 
#cardDetail .card-right{
	padding: 10px;
}
#cardDetail .card-body {
	padding: 0;
}

#cardDetail .card-body .qst-title{
	color: #FFFFFF;
	font-size: 16px;
}
#cardDetail .bg-black{
	background-color: #202020 !important;
}
#cardDetail .bg-sub{
	background-color: #586381 !important;
}
#cardDetail .card-footer{
	border-top : 1px solid  #EFEFEF;
}
#cardList .card{
	border-radius: 0;
}
/*#cardInfo {*/
/*	background-color: #FCFCFC;*/
/*	padding: 10px;*/
/*}*/
#cardCat {
	padding: 10px;
}
.qst-area {
	padding: 10px;
}
.expl-area {
	padding : 10px;
}
.psg-area {
		padding: 10px;
}
.psgExpl-area {
		padding: 10px;
}
.qst-preview .card-body{
	background: #FFFFFF;
}


/* PDF 모달 */
.modal-custom {
  width: 100%;
  min-width: 1860px; 
  height:calc(100vh - 58px);
  max-width: none; 
  max-height: none;

}
.canvas-container-full {
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    overflow-x: auto !important;
  }
  
  .canvas-container-full > div {
    width: 100% !important;
    height: auto !important;
  }
#pdfStep02Modal .modal-custom {
  width: 100%;
  min-width : 1920px; 
  height:calc(100vh - 58px);
  max-width: none; 
  max-height: none;
}
.modal-content {
  height: 100%;
  border-radius: 15px;
  overflow-y: auto;
}

#pdfModal .left-section {
  background-color: #F5F5F5;
  height: 100%;
  padding: 10px;
}

#pdfModal .nav-tabs {
  margin-top: 10px;
}

#pdfModal .tab-content {
  margin-top: 10px;
  padding: 10px;
  background-color: #FFFFFF;
  border-radius: 5px;
  height: 100%;

}
/*#pdfModal .modal-header .close{*/
/*	top: -14px;*/
/*}*/
#pdfModal .modal-title{
	display: flex;
    align-items: center;
    height: 100%;
}

#pdfModal .left-scroll-area{
  height: calc(100% - 40px);
}
#pdfModal .nav-link {
  cursor: pointer;
}
#pdfModal #qst-content, #exp-content{
	height: 100%;
}
#pdfModal .thumbnail-container {
  display: flex;
  flex-direction: column;
  gap: 10px;
   height: 100%;
  align-items: center;
  overflow-y: auto;
}

.thumbnail {
  width: 144px;
  height: 249px;
  min-height: 249px;
  position: relative;
  border: 2px solid #E3E3E3; /* 선택 전에는 투명 */
  cursor: pointer;
}

.thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.thumbnail.selected {
  border: 2px solid #5768ff; /* 선택 시 파란색 테두리 */
}
.thumbnail.navigated {
  border: 2px solid #000000; /* 네비게이션으로 이동 시 검정색 테두리 */
}
.thumbnail-index {
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 2px 5px;
  border-radius: 3px;
  font-size: 12px;
  text-align: center;
}

#pdfModal .right-section {
  background-color: #E8E8E8; /* 필요에 따라 배경색 추가 */
  height: 100%;
  padding: 0px;
}

#pdfModal .modal-body {
  padding-top: 0;
  height: 100%;
  overflow-y: auto;
}

#pdfModal .card {
  border: 0;
  border-radius: 0;
  height: 100%;
}


.group-img-card.selected {
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
	border-width: 1px;
	transition: all 0.2s ease;
}

#pdfModal .card-header {
  background-color: #FFFFFF;
  padding: 12px;
  height: 64px;
}

#pdfModal .card-body {
  background-color: #E8E8E8;
  padding: 15px;
}

#pdfModal #img-area {
  height: 100%;
}

#pdfModal #field-area {
  background-color: #F5F5F5;
  height: 100%;
  padding: 10px;
  overflow-y: auto;
}

#qst-img {
  position: relative;
  background-color: #FFFFFF;
  padding: 10px;
  height: 100%;
  overflow-y: auto;
}

#qst-canvas {
  border: 1px solid #ccc;
  width: 100%;
  height: 100%;
}
#pdfModal #field-img {
	background-color: #C8C8C8;
	padding: 10px;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}
.group-card {
  width: 304px;
  min-height: 112px;
  background-color: #fff;
  border: 1px solid #ccc;
  display: flex;
  flex-direction: column;
  padding: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.group-card-header {
  font-size: 14px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.group-card-areas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.group-img-card {
  background-color: #EFEFEF;
  border: 1px solid #5768ff;
  border-radius: 4px;
  margin-bottom: 16px;
  overflow: hidden;
  padding: 10px;
  position: relative;
  min-height: 200px;
}
#pdfStep02Modal .group-img-card {
	max-height: 300px;
	overflow-y: auto;
	width: 373px;
	overflow-x: auto;
}
 .loading-placeholder {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #f5f5f5;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	color: #666;
  }
 .loading-placeholder::after {
	content: '';
	width: 20px;
	height: 20px;
	margin-left: 8px;
	border: 2px solid #ddd;
	border-top-color: #666;
	border-radius: 50%;
	animation: loading-spin 1s linear infinite;
  }
  @keyframes loading-spin {
	to { transform: rotate(360deg); }
  }
.group-name {
  font-weight: bold;
  font-size: 14px;
}
.current-page-text {
  font-size: 12px;
  font-weight: 500;
  color: #333;
  align-items: center;
  display: flex;
}
.calendar-header i.fa, i.fas {
	font-size: 14px !important;
}
.page-number {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #f0f0f0;
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 12px;
  transition: all 0.2s ease;
}

.page-number.active {
  background-color: #333;
  color: white;
}

.page-numbers {
  display: flex;
  gap: 4px;
}
.btn-history {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 20px;
  background-color: #f0f0f0;
  border: none;
  color: #333;
  font-size: 12px;
  transition: all 0.2s ease;
}

.btn-history:hover {
  background-color: #e0e0e0;
}


.btn-history[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.history-buttons {
  display: flex;
  align-items: center;
  margin-left: 16px;
}
.btn-tab {
  border-radius: 20px !important;
  background-color: #f0f0f0;
  border: none;
  color: #333;
  font-size: 12px;
}

.btn-tab.active {
  background-color: #333;
  color: white;
}

.btn-group .btn-tab:not(:last-child) {
  margin-right: 5px;
}

#imgCount {
  white-space: nowrap;
  font-size: 12px;
  min-width: 146px;
}


.vertical-divider {
  width: 1px;
  height: 24px;
  background-color: #dee2e6;
}
.description-text {
  color: #B7B7B7;
  font-size: 12px;
}

.count-text {
  color: #000;
  font-weight: bold;
  font-size: 12px;
}

.area-badge .remove-btn {
  cursor: pointer;
  font-weight: bold;
  margin-left: 4px;
}

.page-divider {
  margin: 10px auto;
  padding: 5px;
  width: 60px;
  height: 28px;
  border-radius: 20px !important;
  background-color: #FFFFFF;
  border: none;
  font-size: 12px;
}
.group-card {
	position: relative;
	overflow: visible; /* overflow를 visible로 변경 */
}
.group-card.selected {
  border: 2px solid #5768ff;
  box-shadow: 0 0 5px rgba(74, 144, 226, 0.5);
}
.group-add-container {
    width: 202px;
    height: 52px;
    background: black;
    border-radius: 26px;
    margin: 0 auto;
    padding: 0 20px;
}

.group-add-container select {
    background: black;
    color: white;
    border: none;
    appearance: none;
    padding-left: 20px;
    width: 70px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 4.5L6 8L9.5 4.5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left center;
    font-size: 12px;
}

.group-add-container select:focus {
    outline: none;
}

.group-add-container .divider {
    width: 1px;
    height: 20px;
    background: #555555;
    margin: 0 auto;
}

.group-add-text {
    color: white;
    margin-right: 8px;
    white-space: nowrap;
    font-size: 12px;
}

.add-icon {
    cursor: pointer;
}
.img-container{
	flex-direction: column;
	display: flex;
	align-items: center;
	padding: 10px;	
	height: 100%;
	overflow-y: auto;
	border : 1px solid #e8e8e8;
}

.step2-img-container{
	padding: 10px 6px;	
	height: 100%;
	overflow-y: auto;
	border : 1px solid #e8e8e8;
}

#pdfStep02Modal .field-img{
	overflow-y: auto;
}
#pdfStep02Modal .card{
	height: calc(100vh - 146px);
}
#pdfStep02Modal .card-body{
	height: 100%;
	padding: 10px;
}
.m_qstPage {
	width: 40px !important;
	text-align: center;  
}

.m_qstNo {
	width: 40px !important; 
	text-align: center;
}

.m_qstAnsw {
	width: 40px !important; 
	text-align: center;
}

.m_qstScr {
	width: 40px !important;
	text-align: center; 
}
.content-container{
	height: calc(100vh - 180px);
}

#split-horizontal-1, #split-horizontal-2{
	height: 100%;
} 
#split-horizontal-1 .main_search_result_list{
	height: calc(100vh - 280px);
	overflow-y: auto;
}
.stus-body{
	height: 100%;
	overflow-y: auto;
}

#selecInfoDiv{
	height: calc(100vh - 280px);
}
.btn-white {
	background-color: white;
	border-color: white;
}

.btn-white:hover {
	color : #777777;
	background-color: #F5F5F5;
	border-color: #F5F5F5;
}

.btn-white:focus, .btn-white.focus {
	background-color: #F5F5F5;
	border-color: #F5F5F5;
	box-shadow: 0 0 0 .2rem rgba(245, 245, 245, 0.5);
}

.btn-white.disabled, .btn-white:disabled {
	background-color: white;
	border-color: white;
}

.btn-white:not(:disabled):not(.disabled):active, .btn-white:not(:disabled):not(.disabled).active, .show>.btn-white.dropdown-toggle {
	background-color: #F5F5F5;
	border-color: #F5F5F5;
}

.btn-white:not(:disabled):not(.disabled):active:focus, .btn-white:not(:disabled):not(.disabled).active:focus, .show>.btn-white.dropdown-toggle:focus {
	box-shadow: 0 0 0 .2rem rgba(245, 245, 245, 0.5);
}


.card-item.qst-item.qst-check input[type="checkbox"]{
	appearance: none;
	-webkit-appearance: none; 
	-moz-appearance: none; 
	width: 14px;
	height:  14px;
	background-color: white;
	border: 1px solid #dee2e6;
	border-radius:3px; 
	vertical-align: middle;
	cursor: pointer; 
	display: inline-block; 
	transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; /
}


.card-item.qst-item.qst-check input[type="checkbox"]:checked {
	background-color: white; 
	background-size: 100%;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23007bff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
	background-position: center;
	background-repeat: no-repeat;
	border: 1px solid #007bff; 
}


.card-item.qst-item.qst-check input[type="checkbox"]:hover {
border-color: #86b7fe; /* 호버 시 부트스트랩 스타일의 밝은 파란색 테두리로 변경 */
	background-color: #f0f8ff; /* 호버 시 아주 연한 파란색 배경 */
	transition: border-color 0.15s ease-in-out, background-color 0.15s ease-in-out; /* 전환 효과 추가 */
}
/*스크롤바 관련*/
::-webkit-scrollbar {
	width: 9px; 
}

::-webkit-scrollbar-track {
	background: transparent; 
}

::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.1); 
	border-radius: 4px; 
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(0, 0, 0, 0.5); 
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  background-color: #f0f0f0 !important;  /* 회색 배경으로 설정 */
  border-radius: 50% !important;
  padding: 0 !important;
  margin: 0 8px !important;
  text-align: center !important;
  color: #555 !important; /* 회색 글자 색 */
  font-weight: normal !important; /* 굵기를 약간 얇게 */
  text-decoration: none !important;
  display: inline-block !important;
  width: 30px !important;  /* 동그라미 크기 */
  height: 30px !important; /* 동그라미 크기 */
  line-height: 27px !important; /* 숫자를 정확히 가운데로 위치 */
  vertical-align: middle !important; /* 수직 정렬 */
  font-size: 12px !important; /* 숫자 크기 조정 */
  border: 1px solid #ddd !important; /* 선택되지 않은 버튼 테두리 */
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background-color: #e0e0e0 !important;
  color: #fff !important;
}

#content .dataTables_wrapper .dataTables_paginate .paginate_button.current {
	background-color: #333 !important;
	color: #fff !important;
	font-weight: normal !important;
	border: 1px solid #333 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
		background-color: #333 !important;
			color: #fff !important;
}

/*.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
  display: none !important;
}*/

.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next,
.dataTables_wrapper .dataTables_paginate .paginate_button.first,
.dataTables_wrapper .dataTables_paginate .paginate_button.last {
  background-color: transparent !important;
  color: #777 !important;
  border: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous.disabled:hover {
background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/previous-disabled-icon.svg') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.next.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.next.disabled:hover {
background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/next-disabled-icon.svg') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.first.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.first.disabled:hover {
background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/first-disabled-icon.svg') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.last.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.last.disabled:hover {
background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/last-disabled-icon.svg') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}


.dataTables_wrapper .dataTables_paginate .paginate_button.first,
.dataTables_wrapper .dataTables_paginate .paginate_button.first:hover {
  background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/first.png') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.last,
.dataTables_wrapper .dataTables_paginate .paginate_button.last:hover {
  background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/last.png') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover {
  background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/previous.png') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.next,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover {
  background-color: transparent !important;
  background-image: url('/resources/admin/images/data-table-logo/next.png') !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: transparent !important;
  border: none !important;
  width: 25px !important;
  height: 25px !important;
}


.toast {
  -ms-flex-preferred-size: 350px;
  flex-basis: 350px;
  width: 350px;
  font-size: 0.875rem;
  background-color: rgba(255, 255, 255, 0.85);
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
  opacity: 0;
  border-radius: 0.25rem;
}
/*.toast {
  -ms-flex-preferred-size: 350px;
  flex-basis: 350px;
  width: 350px;
  font-size: 0.875rem;
  color: #fff;
  background-color: #000000;
  background-clip: padding-box;
  border: 12px solid rgba(66, 66, 66, 0.8);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
  opacity: 0;
  border-radius: 0.25rem;
}*/

.toast:not(:last-child) {
  margin-bottom: 3px;
}

.toast.showing {
  opacity: 1;
}

.toast.show {
  display: block;
  opacity: 1;
}

.toast.hide {
  display: none;
}

.toast-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.25rem 0.75rem;
  color: #6c757d;
  background-color: rgba(255, 255, 255, 0.85);
  background-clip: padding-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  border-top-left-radius: calc(0.25rem - 1px);
  border-top-right-radius: calc(0.25rem - 1px);
}

.toast-body {
  padding: 0.75rem;
}

.progressCheck  .dropdown-menu {
	min-width: 350px;
  
}

.customIcon1_ico_open {	
	background-image: url('/resources/admin/images/ztree-icon/folder-open.png') !important;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 16px 16px; /* 아이콘 크기 설정 */
}

.ztree li span.button.ico_open {
	background: url('/resources/admin/images/ztree-icon/folder-open.png') no-repeat center center !important;
}

.ztree li span.button.ico_close {
	background: url('/resources/admin/images/ztree-icon/folder.png') no-repeat center center !important;
}

.ztree li span.button.ico_docu {
	background: url('/resources/admin/images/ztree-icon/tree-doc-sm.svg') no-repeat center center !important;
}
.ztree li span.button.chk.checkbox_true_full, .ztree li span.button.chk.checkbox_true_part,
.ztree li span.button.chk.checkbox_true_full_focus, .ztree li span.button.chk.checkbox_true_part_focus  {
	background: url('/resources/admin/images/ztree-icon/tree-check.png') no-repeat center center !important;
}
.ztree li span.button.chk.checkbox_false_full {
		background: url('/resources/admin/images/ztree-icon/tree-uncheck.png') no-repeat center center !important;
}
.ztree li span.switch.bottom_close ~ a,
.ztree li span.switch.center_close ~ a {
	color: #B7B7B7 !important;
}
.ztree li a.curSelectedNode {
	padding-top: 0px !important;
	background-color: #C2E2FE !important;
	height: 18px !important;
	border: 1px #C2E2FF solid !important;
	/* opacity: 0.8; */
	color: black !important;
}
.ztree li span.switch.bottom_close ~ a.curSelectedNode,
.ztree li span.switch.center_close ~ a.curSelectedNode {
	color: black !important;
}

.custom-select-wrapper {
  position: relative;
}

.custom-select-button {
  padding: 6px 12px;
  background-color: #fff;
  border: 1px solid #ced4da;
  text-align: left;
  cursor: pointer;
}

.custom-select-button:after {
  content: '';
  position: absolute;
  right: 10px;
  top: 35%;
  border: solid #666;
  border-width: 0 2px 2px 0;
  padding: 2px;
  transform: rotate(45deg);
}

.custom-select-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #fff;
  border: 1px solid #ced4da;
  margin-top: 5px;
  z-index: 1000;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  max-height: 538px;
  overflow-y: auto;
}

.custom-select-option {
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.custom-select-option input[type="checkbox"] {
    margin-left: 10px; 
}

.custom-select-option:hover {
  background-color: #f8f9fa;
}

.custom-select-actions {
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-top: 1px solid #dee2e6;
  position: sticky;
  bottom: 0;
  background-color: #f9f9f9;
}
.table #readyList tr:hover {
        background-color: #f8f9fa; /* 배경색 변경 */
        cursor: pointer; /* 클릭 가능한 손 모양 커서 */
    }

/* 추가 css 종료 */

/* Select2 스타일  */
.select2-container {
      width: 200px !important;
  }
.select2-container .select2-selection--single {
  height: calc(1.5em + .6884rem + 2px)!important;
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
	height:30px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 30px !important;
	 text-align: left !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: #000;
	 text-align: left !important;
}
.select2-container--default .select2-results>.select2-results__options{
	max-height: 500px;
}