@charset "UTF-8";

.rotate-0 { transform: rotate(0deg); }
.rotate-90 { transform: rotate(90deg); }
.rotate-180 { transform: rotate(180deg); }
.rotate-270 { transform: rotate(270deg); }

.icon-sm { font-size: 1.4rem; }

.code-red {
	line-height: normal;
	background: rgba(135, 131, 120, .15);
	color: #EB5757;
	border-radius: 4px;
	font-size: 85%;
	padding: 0.2rem 0.4rem;
	bottom: 0.065rem;
}

/* filter box */
.filter-box { background: #f8f9fb; border: 1px solid #ddd; border-radius: 6px; padding: 3rem; position: relative; }
.filter-box.shadow { border: 0; box-shadow: 0 0 4px 0.5px #dddddd; }
.filter-box .search-box { background: #f8f9fb; margin-bottom: 0; padding: 0; height: auto; }


/* detail-title */
.detail-title {  color: #333; font-size: 2.1rem; font-weight: bold; line-height: 1.5; letter-spacing: -0.23px; display: block; }
.detail-sub-title { position: relative; font-size: 1.9rem; font-weight: bold; line-height: 2.2rem; letter-spacing: -0.22px; margin: 0 0 1.5rem; padding-left: 1rem; }
.detail-sub-title:before { width: 4px; height: 4px; top: 50%; -webkit-transform: translateY(-50%);transform: translateY(-50%); background: #979797; content: ''; position: absolute; left: 0; border-radius: 50%; }


/* detail-title-box */
.detail-title-box { position: relative; display: block; font-size: 1.5rem; letter-spacing: -0.15px;}
.detail-title-box.single { padding: 1rem 3rem; }
.detail-title-box .title-item { position: relative; display: flex; flex-wrap: nowrap; align-items: start; }
.detail-title-box .title-item .title-label { position: relative; padding: .4rem 0.6rem .3rem; background: #fff; color: #155cd6; border: 1px solid #ddd; border-radius: 2px; font-size: 1.3rem; font-weight: 500; line-height: 1.6rem; white-space: nowrap; min-width: 53px; text-align: center; }
.detail-title-box .title-item hr { display: inline-block; position: relative; margin: 0 1rem; }
.detail-title-box .title-item .title-info { display: block; word-break: break-all; color: #727272; font-size: 1.6rem; }
.detail-title-box .title-item:not(:first-child) { margin-top: 1rem; }

@media (min-width: 768px) {
	.detail-title-box { padding-left: 1rem; }
}

/* detail border box */
.detail-border-box { position: relative; display: block; }
.detail-border-box .detail-border-box-header { font-size: 2.1rem; font-weight: bold; line-height: 2.2rem; letter-spacing: -0.22px; padding: 1.5rem 0 1rem 0; border-bottom: 3px solid #333; margin-bottom: 3rem; color: #333; }
.detail-border-box .detail-border-box-body { padding: 0; }
.detail-border-box.blue .detail-border-box-header { border-color: #155cd6; }

@media (min-width: 768px) {
	.detail-border-box .detail-border-box-body { padding-left: 1rem; }
}



/* button checkbox */
.form-btn-check { display: grid; grid-template-columns: repeat(auto-fill, 100px); gap: 1rem 0.5rem; }
.form-btn-check.auto-fit { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.form-btn-check.auto-fit.sm { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.btn-check { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; }
.btn-check-label { display: inline-block; vertical-align: middle; padding: 0.5rem 1rem; border: 1px solid #ddd; border-radius: 3px; background: #fff; color: #555; font-size: 1.5rem; line-height: 1.6; text-align: center; -webkit-transition: all .25s; transition: all .25s; white-space: nowrap; min-width: 100px; }
.btn-check-label.fixed, .btn-check-label.fixed-sm { width: 100%; }
.btn-check-badge { position: relative; padding: .3rem 0.4rem; background: #fff; border-radius: 4px; font-size: 1.1rem; font-weight: 500; color: #155cd6; min-width: 2rem; line-height: 1.3; }
.btn-check:checked+.btn-check-label { color: #f8f9fb; background-color:#155cd6; border-color: #155cd6; }
.btn-check.radio:checked+.btn-check-label { color: #f8f9fb; background-color:#04b591; border-color: #04b591; }

.form-btn-check.flex { display: flex; flex-wrap: wrap; flex-direction: column; gap: 1rem 0.5rem; }
@media (min-width: 768px) {
	.form-btn-check.flex  { flex-direction: row;  }
	.btn-check-label.fixed { width: 170px; }
	.btn-check-label.fixed-sm { width: 155px; }
}


.element-error-test { display: none; }
.s_search_wrap button:disabled, .s_search_wrap select:disabled, .s_search_wrap input:disabled {cursor: not-allowed !important;opacity: 0.7; }

@media (min-width: 768px) {
	.result_list .browse-large-p {padding-top: 4.5rem !important;padding-bottom: 4.5rem !important; }
}

.db-badge { display: inline-block; vertical-align: middle; margin-right: .8rem; padding: 0 1rem; border-radius: 5px; background: #155CD6; color: #fff; font-weight: 500; line-height: 2.9rem; word-break: break-all;}
.db-badge.UmbrellaProject { background: #9D3AAA; }
.db-badge.BioProject { background: #155CD6; }
.db-badge.BioSample { background: #01866C; }
.db-badge.GeNa { background: #646974; }
.db-badge.KRA { background: #E4F7F9; color: #333; }
.db-badge.KEA { background: #EEF1FE; color: #333; }
.db-badge.KNA { background: #FCEEF9; color: #333; }
.db-badge.KPOP { background: #FDEBE9; color: #333; }
.db-badge.KMAP { background: #EBFBEE; color: #333; }
.db-badge.KBI { background: #FFF4DC; color: #333; }
.db-badge.KCODE { background: #FEEFE3; color: #333; }
.db-badge.KPC { background: #FBE5E5; color: #333; }
.db-badge.KVar { background: #E1F6F8; color: #333; }
.db-badge.scDB { background: #8E24AA; color: #fff; }


.sub-badge {position: relative;padding: .4rem 0.6rem .3rem;background: #E7EFFB;border-radius: 4px;font-size: 1.3rem;font-weight: 500;line-height: 1.6rem; }

.sub-badge.UmbrellaProject {background: #FCE6FF;color: #9C3BAA}
.sub-badge.BioProject {background: #E7EFFB;color: #145CD6}
.sub-badge.BioSample {background: #E5F4F0;color: #007C64}
.sub-badge.BioData {background: #EFEFEF;color: #555}
.sub-badge.KRA {background: #E4F7F9; }
.sub-badge.KEA {background: #EEF1FE; }
.sub-badge.KNA {background: #FCEEF9; }
.sub-badge.KSO {background: #FEE8E3; }
.sub-badge.KPOP {background: #FDEBE9; }
.sub-badge.KMAP {background: #EBFBEE; }
.sub-badge.KCODE {background: #FEEFE3; }
.sub-badge.KBI {background: #FFF4DC; }
.sub-badge.KPC {background: #FBE5E5; color: #333; }
.sub-badge.ETC {background: #E9ECF2; }
.sub.badge.KVar {background: #E1F6F8; }
.sub-color.BioProject {color: #145CD6; }
.sub-color.BioSample {color: #E5F4F0; }
.sub-color.BioData {color: #007C64; }
.kra-gbox-area {padding: 1rem 0 0;color: #111;font-size: 1.7rem;font-weight: 400;word-break: keep-all; }

.base-font {font-size: 1.5rem !important; }
.agree .item.view.small p {font-size: 1.5rem;line-height: 1.4; }


.gray-bg {background: #f7f8fa !important;/* background: #EAECEF !important; */}
.text-bullet {position: relative;padding-left: 1.2rem;line-height: 1.6; }
.text-bullet.type3 {padding-left: 2rem;}
.text-bullet::before {width: 4px;height: 4px;top: 1.1rem;background: #979797;content: '';position: absolute;left: 0;border-radius: 50%; }
.text-bullet.type2::before {top: 0;background: #fff;content: '*';color:#155CD6; }
.text-bullet.type3::before {top: 0;background: #fff;content: '●';color:#6c757d; }

.form_table tr td .desc {white-space: pre-wrap;word-break: break-word; }
.form_table tr td .desc a {color: #155CD6;text-decoration: underline; }
.form_table tr th.large-label {min-width:22rem; }
.form_table tr th .label-desc {color: #767676;font-size: 1.5rem;line-height: 1.5;word-spacing: -0.01rem; }
.form_table .form_check label {white-space: inherit !important; }
.form_table .agree * {font-size: 1.5rem !important; }

.bbx_form strong.point {color: #155CD6 !important; }
.submit_form .data_box.custom .btn_align {position: relative;top: auto;right: auto; }
.info_btn:hover .hidden_desc, .info_btn:focus .hidden_desc {width: 100% !important;/* min-width: max-content !important; */ max-width: 45rem !important;padding: 0.8rem !important;word-break: keep-all !important;left: 30px !important;right: 0 !important; }
.modal .submit_form::after {display: none !important; }

/* span.tooltip { cursor: pointer; display: inline-block; vertical-align: middle; margin-top:-0.1rem; margin-left: 0.925rem; position: absolute; z-index: 2; opacity:1; padding-top: 0; } */
.required-msg {position: absolute;top: -35px;right: 0; }

.select2.select2-container {display:block; min-width: 14rem; }
@media (max-width: 992px){
	.select2.select2-container {min-width: auto; }
}
.select2.select2-container .select2-selection {height: 4rem !important;outline: none !important;transition: all .15s ease-in-out;padding: 0.6rem 0;min-height: 3rem;font-size: 1.55rem;color: #555;background-color: #fff;background-image: none;border: 1px solid #D8D9DF;vertical-align: top;border-radius: 6px; }
.select2.select2-container .select2-selection .select2-selection__rendered { color: #333;line-height: 28px;padding-right: 3rem; }
.select2.select2-container .select2-selection .select2-selection__arrow { -webkit-border-radius: 0 5px 5px 0;-moz-border-radius: 0 5px 5px 0;border-radius: 0 5px 5px 0;height: 4rem; width: 3rem; }
@media (max-width: 576px){
	.select2.select2-container .select2-selection {height: 4.5rem !important; }
	.select2.select2-container .select2-selection .select2-selection__arrow { height: 4.5rem; }
}

.doble_input .select2.select2-container .select2-selection, .doble_input .select2.select2-container .select2-selection .select2-selection__arrow {height: 3.8rem !important; }

.select2.select2-container.select2-container--open .select2-selection.select2-selection--single { background: #f8f8f8; }
.select2.select2-container.select2-container--open .select2-selection.select2-selection--single .select2-selection__arrow { -webkit-border-radius: 0 3px 0 0;-moz-border-radius: 0 3px 0 0;border-radius: 0 3px 0 0; }
.select2.select2-container.select2-container--open .select2-selection.select2-selection--multiple { border: 1px solid #ddd; }
.select2.select2-container .select2-selection--multiple {height: auto;min-height: 34px; }
.select2.select2-container .select2-selection--multiple .select2-search--inline .select2-search__field { height: 32px; }
.select2.select2-container .select2-selection--multiple .select2-selection__rendered { padding: 0 4px;line-height: 29px; }
.select2.select2-container .select2-selection--multiple .select2-selection__choice { background-color: #f8f8f8;border: 1px solid #ccc;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;margin: 4px 4px 0 0;padding: 0 6px 0 22px; position: relative; }
.sel_text_input .select2-container--default .select2-selection--single .select2-selection__clear {display: none; }
.select2.select2-container .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove { position: absolute; left: 4px; margin: 0; text-align: center; color: #e74c3c; font-weight: bold; font-size: 16px; top: 50%; transform: translateY(-50%); }
.select2-container .select2-dropdown {background: transparent;border: none;margin-top: -5px; }
.select2-container .select2-dropdown .select2-search {padding: 0; }
.select2-container .select2-dropdown .select2-search input {outline: none !important;border: 1px solid #ddd !important;border-bottom: none !important; padding: 1.25rem 0.5rem !important; background-color: #f1faff; }
.select2-container .select2-dropdown .select2-results {padding: 0; }
.select2-container .select2-dropdown .select2-results ul {background: #fff;border: 1px solid #ddd; }
.select2-container .select2-dropdown .select2-results ul > li {font-size: 1.55rem; }
.select2-container .select2-dropdown .select2-results ul .select2-results__option--highlighted[aria-selected] { background-color: #155CD6; }

.sel_text_input input {outline: 0; }
.sel_text_input .select2-container + .append_input input[type=text] {border-radius: 0 5px 5px 0 !important;outline: 0; }

/* 미리보기 */
.preview-container {position: relative;display: grid;grid-template-areas: "aside main";grid-template-columns: 300px 1fr;width: 100%;height: 100%; }
.preview-container .preview-aside {grid-area: aside;width: 100%;overflow: auto;background: #Fff;height: 95vh;position: sticky;top: 0; }
.preview-container .preview-aside table tr.active td {background: #F8F9FB; }
.preview-container .preview-aside table tr.active td a {display: block;position: relative;padding: 1.5rem 2.5rem 1.3rem 1.2rem;border-radius: 5px;color: #767676;font-size: 1.5rem;line-height: 1.7rem;padding-left: 3.4rem; }
.preview-container .preview-aside table tr td a::before {content: "";display: block;position: absolute;top: 50%;left: 1.5rem;width: 0.6rem;height: 0.6rem;border-radius: 50%;background: #ddd;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%); }
.preview-container .preview-aside table tr.active td a::before {background: #333; }
.preview-container .preview-aside table tr.active td a::after {content: "\ea6e";display: block;position: absolute;top: 50%;right: 1.2rem;font-family: 'remixicon' !important;-webkit-transform: translateY(-50%);transform: translateY(-50%); }
.preview-container .preview-main {grid-area: main;position: relative;width: 100%;height: 100%;overflow: hidden;padding: 3rem 6rem; }

/** 크롬 자동완성 시 배경 제거 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {-webkit-box-shadow: 0 0 0px 1000px #fff inset;transition: background-color 5000s ease-in-out 0s; }

.essential-point::after {content: ' *'; color: #155CD6; }

.ellipsis-table .ellipsis-field {white-space: normal;overflow: hidden;position: relative;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical; }
.ellipsis-table .ellipsis-field.line2 {-webkit-line-clamp: 2; }
.ellipsis-table .ellipsis-field.line5 {-webkit-line-clamp: 5; }
.ellipsis-table .ellipsis-field.line7 {-webkit-line-clamp: 7; }
.ellipsis-table .ellipsis-field.line10 {-webkit-line-clamp: 10; }

.fullscreen-default {z-index: 1000;width: 100vw !important;height: 100vh !important;position: fixed !important;top: 0 !important;bottom: 0 !important;left: 0 !important;right: 0 !important;padding: 4rem 3rem;background: #fff;overflow-x: hidden;overflow-y: auto; }
.fullscreen-spread {z-index: 1000;width: 100% !important;height: 100% !important;position: fixed !important;top: 0 !important;bottom: 0 !important;left: 0 !important;right: 0 !important;max-width: inherit !important;padding: 1.6rem 2.8rem;background: #fff; }
.fullscreen-spread .exel_area {height: calc(100% - 3.2rem - 2rem - 30px) !important; }

/* 팝업 */
.pi-popup {display: none;position: absolute;overflow: hidden;z-index: 9999;margin: 0;padding: 0;border: 2px solid #eee;box-shadow: 0px 4px 16px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 4px 16px rgba(0,0,0,0.2);-ms-user-select: none;min-width: 100px;min-height: 100px; }
.pi-popup .pi-popup-container {background: #fff;overflow: hidden;width: 100%;height: 100%; }
.pi-popup .pi-popup-btn {padding: 6px;font-size: 9pt;text-align: right;background-color: #eee; }
.pi-popup .pi-popup-btn input {width: 12px;height: 12px; }
.pi-popup .pi-popup-btn a {padding-left: 5px; }
.pi-popup .pi-popup-btn.custom { padding:0.75rem 1.5rem 0.75rem 1.25rem; font-size: 1.5rem; background: #f7f8fa; }
.pi-popup .pi-popup-btn.custom input[type='checkbox'] { position:relative; width:1.6rem; height:1.6rem; margin-right:0.6rem; border:1px solid #B6B6B6; background:#fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.pi-popup .pi-popup-btn.custom input[type='checkbox']:checked { border-color:#155CD6; }
.pi-popup .pi-popup-btn.custom input[type='checkbox']:checked:after { content:"\eb7b"; display: block; position:absolute; top:0; left:0; width:100%; height:100%; background:#155CD6; color:#fff; font-size:1.4rem; font-family: 'remixicon' !important; }

/* 단백체 */
input[type="text"].readonly.custom, .form_table tr td input[type="text"].readonly.custom {background: #f9f9f9; }

.paper-box .paper-title { display: block; color: #1c1b19; font-size: 2rem; font-weight: bold; position: relative; margin-bottom: 1.5rem; border-left: 6px solid #2196f3; padding-left: calc(1.2rem - 6px); line-height: 1.2; }
.paper-box .paper-link { color:#6c757d; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: inherit; }
.paper-box .paper-link:hover { color: #155CD6; border-bottom-style: solid; }
.paper-box .paper-sub-title { color: #1c1b19; font-weight: bold;}
.paper-box span { font-size: 1.5rem; display: block; }
.paper-box span + span { margin-top: 1rem; }

/*-------------------------------------------------
title: global
Author: (주)지플러스
Create date: 2024-07
-------------------------------------------------*/
.select2-container .select2-dropdown {margin-top: 0; }
/*.select2.select2-container .select2-selection .select2-selection__rendered {line-height: 23px; }*/
#modifications + .select2-container.select2-container--default {width: 100% !important; }
.select2.select2-container .select2-selection--multiple {position: relative;height: auto !important; min-height: 4rem; padding: 0;border-radius: 4px; border: 1px solid #D8D9DF; }
.select2-container--default.select2-container--focus .select2-selection--multiple {
	-webkit-box-shadow: inset 0 1px 2px transparent, inset 0 0 0 30px #fff, 0 0 0 0.25rem rgba(56, 116, 255, 0.25);
	box-shadow: inset 0 1px 2px transparent, inset 0 0 0 30px #fff, 0 0 0 0.25rem rgba(56, 116, 255, 0.25);
}
.select2-search.select2-search--inline {float: left; }
.select2.select2-container .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {border-right: 0; }
.select2-container--default .select2-selection--multiple .select2-selection__clear {position: relative;z-index: 1; }

.form_hint {margin-top: 1rem;padding-left: 2.4rem;font-size: 1.5rem;color: #555555; }
.form_hint::before {content: '\f449';display: inline-flex;width: 2rem;height: 2rem;flex-shrink: 0;flex-grow: 0;margin-left: -2.4rem;margin-right: .4rem;font-family: 'remixicon';font-size: 1.7rem; }


/* gbox logo */
.gbox-logo:before {
	display: inline-block;
	vertical-align: middle;
	content: '';
	width: 14px;
	height: 14px;
	background: url(../image/logo/logo_gbox.png) no-repeat center center;
	background-size: contain;
}

/* start admin common component */
.text-primary { color: #3874ff !important; }
.text-orange { color: #FC8A25 !important; }
.text-purple { color: #6151B7 !important; }
.text-dark-orange { color: #D68B07 !important; }
.text-danger-orange { color: #F14712 !important; }
.text-muted2 { color: #707070 !important; }
.text-point2 { color: #44648E !important; }
.point { color: #3874ff; }
.bg-point { background-color: #f6fbff !important; }
.bg-gray { background-color: #f5f7fa !important; }
.bg-white-gray { background-color: #F7F8FA !important; }
.bg-white { background-color: #fff !important; }
.bg-blue-gray { background-color: #EBF4F9 !important;}
.bg-selected-item { background-color: #F1F5FD !important }

.bg-primary {
	background-color: rgba(56, 116, 255, 1) !important;
}

.bg-secondary {
	background-color: rgba(49, 55, 74, 1) !important;
}

.bg-success {
	background-color: rgba(37, 176, 3, 1) !important;
}

.bg-info {
	background-color: rgba(0, 151, 235, 1) !important;
}

.bg-warning {
	background-color: rgba(229, 120, 11, 1) !important;
}

.bg-danger {
	background-color: rgba(250, 59, 29, 1) !important;
}

.bg-light {
	background-color: rgba(239, 242, 246, 1) !important;
}

.bg-dark {
	background-color: rgba(20, 24, 36, 1) !important;
}

.bg-primary-lighter {
	background-color: rgba(173, 197, 255, 1) !important;
}

.bg-primary-light {
	background-color: rgba(133, 169, 255, 1) !important;
}

.bg-primary-dark {
	background-color: rgba(0, 77, 255, 1) !important;
}

.bg-primary-darker {
	background-color: rgba(0, 60, 199, 1) !important;
}

.bg-secondary-lighter {
	background-color: rgba(227, 230, 237, 1) !important;
}

.bg-secondary-light {
	background-color: rgba(203, 208, 221, 1) !important;
}

.bg-secondary-dark {
	background-color: rgba(34, 40, 52, 1) !important;
}

.bg-secondary-darker {
	background-color: rgba(82, 91, 117, 1) !important;
}

.bg-warning-lighter {
	background-color: rgba(255, 230, 173, 1) !important;
}

.bg-warning-light {
	background-color: rgba(255, 204, 133, 1) !important;
}

.bg-warning-dark {
	background-color: rgba(214, 99, 10, 1) !important;
}

.bg-warning-darker {
	background-color: rgba(188, 56, 3, 1) !important;
}

.bg-danger-lighter {
	background-color: rgba(250, 188, 179, 1) !important;
}

.bg-danger-light {
	background-color: rgba(244, 130, 112, 1) !important;
}

.bg-danger-dark {
	background-color: rgba(204, 27, 0, 1) !important;
}

.bg-danger-darker {
	background-color: rgba(184, 24, 0, 1) !important;
}

.bg-success-lighter {
	background-color: rgba(190, 232, 180, 1) !important;
}

.bg-success-light {
	background-color: rgba(144, 214, 127, 1) !important;
}

.bg-success-dark {
	background-color: rgba(35, 137, 11, 1) !important;
}

.bg-success-darker {
	background-color: rgba(28, 108, 9, 1) !important;
}

.bg-info-lighter {
	background-color: rgba(150, 217, 255, 1) !important;
}

.bg-info-light {
	background-color: rgba(96, 198, 255, 1) !important;
}

.bg-info-dark {
	background-color: rgba(0, 128, 199, 1) !important;
}

.bg-info-darker {
	background-color: rgba(0, 85, 133, 1) !important;
}

.bg-black {
	background-color: rgba(0, 0, 0, 1) !important;
}

.bg-white {
	background-color: rgba(255, 255, 255, 1) !important;
}
.bg-transparent {
	background-color: transparent !important;
}

.bg-site-BioProject, .bg-site-bioproject { background-color: #1A57BF !important; }
.bg-site-UmbrellaProject, .bg-site-umbrellaproject { background-color: #9D3AAA !important; }
.bg-site-BioSample, .bg-site-biosample { background-color: #00A081 !important; }
.bg-site-KRA, .bg-site-kra { background-color: #2BBDD1 !important; }
.bg-site-KEA, .bg-site-kea { background-color: #737EE1 !important; }
.bg-site-KCODE, .bg-site-kcode { background-color: #F68C2E !important; }
.bg-site-KNA, .bg-site-kna { background-color: #E16AA5 !important; }
.bg-site-KPOP, .bg-site-kpop { background-color: #E17373 !important; }
.bg-site-KMAP, .bg-site-kmap { background-color: #69B578 !important; }
.bg-site-KBI, .bg-site-kbi { background-color: #F8AF0D !important; }
.bg-site-KPC, .bg-site-kpc { background-color: #E5325B !important; }
.bg-site-GeNA, .bg-site-gena { background-color: #7781AC !important; }
.bg-site-KVar, .bg-site-kvar { background-color: #2B9ED1 !important; }
.bg-site-KSO, .bg-site-kso { background-color: #F66446 !important; }
.bg-site-scDB, .bg-site-scdb { background-color: #8E24AA !important; }

.border-site-BioProject, .border-site-bioproject { border-color: #1A57BF !important; }
.border-site-BioSample, .border-site-biosample { border-color: #00A081 !important; }
.border-site-KRA, .border-site-kra { border-color: #2BBDD1 !important; }
.border-site-KEA, .border-site-kea { border-color: #737EE1 !important; }
.border-site-KCODE, .border-site-kcode { border-color: #F68C2E !important; }
.border-site-KNA, .border-site-kna { border-color: #E16AA5 !important; }
.border-site-KPOP, .border-site-kpop { border-color: #E17373 !important; }
.border-site-KMAP, .border-site-kmap { border-color: #69B578 !important; }
.border-site-KBI, .border-site-kbi { border-color: #F8AF0D !important; }
.border-site-KPC, .border-site-kpc { border-color: #E5325B !important; }
.border-site-GeNA, .border-site-gena { border-color: #7781AC !important; }
.border-site-KVar, .border-site-kvar { border-color: #2B9ED1 !important; }
.border-site-KSO, .border-site-kso { border-color: #F66446 !important; }
.border-site-scDB, .border-site-scdb { border-color: #8E24AA !important; }

.text-site-BioProject, .text-site-bioproject { color: #275ede !important; }
.text-site-BioSample, .text-site-biosample { color: #00A081 !important; }
.text-site-KRA, .text-site-kra { color: #2BBDD1 !important; }
.text-site-KEA, .text-site-kea { color: #737EE1 !important; }
.text-site-KCODE, .text-site-kcode { color: #F68C2E !important; }
.text-site-KNA, .text-site-kna { color: #E16AA5 !important; }
.text-site-KPOP, .text-site-kpop { color: #E17373 !important; }
.text-site-KMAP, .text-site-kmap { color: #69B578 !important; }
.text-site-KBI, .text-site-kbi { color: #F8AF0D !important; }
.text-site-KPC, .text-site-kpc { color: #E5325B !important; }
.text-site-GeNA, .text-site-gena { color: #7781AC !important; }
.text-site-KVar, .text-site-kvar { color: #2B9ED1 !important; }
.text-site-KSO, .text-site-kso { color: #F66446 !important; }
.text-site-scDB, .text-site-scdb { color: #8E24AA !important; }


.shadow-site-BioProject, .shadow-site-bioproject { box-shadow: 0 4px 16px rgb(26, 87, 191, .2) !important; }
.shadow-site-BioSample, .shadow-site-biosample { box-shadow: 0 4px 16px rgb(0, 160, 129, .2) !important; }
.shadow-site-KRA, .shadow-site-kra { box-shadow: 0 4px 16px rgb(43, 189, 209, .2) !important; }
.shadow-site-KEA, .shadow-site-kea { box-shadow: 0 4px 16px rgb(115, 126, 225, .2) !important; }
.shadow-site-KCODE, .shadow-site-kcode { box-shadow: 0 4px 16px rgb(246, 140, 46, .2) !important; }
.shadow-site-KNA, .shadow-site-kna { box-shadow: 0 4px 16px rgb(225, 106, 165, .2) !important; }
.shadow-site-KPOP, .shadow-site-kpop { box-shadow: 0 4px 16px rgb(225, 115, 115, .2) !important; }
.shadow-site-KMAP, .shadow-site-KBIMAP, .shadow-site-kmap { box-shadow: 0 4px 16px rgb(105, 181, 120, .2) !important; }
.shadow-site-KBI, .shadow-site-kbi { box-shadow: 0 4px 16px rgb(248, 175, 13, .2) !important; }
.shadow-site-KPC, .shadow-site-kpc { box-shadow: 0 4px 16px rgb(246, 66, 46, .2) !important; }
.shadow-site-GeNA, .shadow-site-gena { box-shadow: 0 4px 16px rgb(226, 229, 242, .2) !important; }


.mg-required-icon {
	font-size: 6px; /* 6px × 0.95 */
	margin-top: -10px;
	display: inline-block;
	vertical-align: middle;
	color: blue;
	margin-left: 0.5rem; /* 0.5rem × 0.95 */
}

a.mg-link {
	color: #3874ff;
}

a.mg-link:hover {
	color: rgb(0, 60, 199);
	text-decoration: underline;
}

.mg-badge {
	display: inline-block;
	font-size: 1.2rem; /* 1.2rem × 0.95 */
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 4px;
	padding: 2px 8px;
	background-color: #e3e6ed;
	color: #222834;
	border: 1px solid #e3e6ed;
}

.mg-badge.mg-badge-label {
	position: relative;
	display: inline-block;
	padding: 0.25rem 1.5rem; /* 0.25rem × 0.95, 1.5rem × 0.95 */
	background-color: #FFFFFF;
	border: 1px solid #DDDDDD;
	border-radius: 20px;
	font-size: 1.6rem; /* 1.6rem × 0.95 */
	color: #333;
	white-space: nowrap;
}

.mg-badge-primary {
	background-color: #e5edff;
	color: #145CD6;
	border-color: #85a9ff;
}

.mg-badge-secondary {
	background-color: #F7F8FA;
	color: #525b75;
	border-color: #cbd0dd;
}

.mg-badge-success {
	background-color: #d9fbd0;
	color: #1c6c09;
	border-color: #90d67f;
}

.mg-badge-info {
	background-color: #c7ebff;
	color: #005585;
	border-color: #60c6ff;
}

.mg-badge-warning {
	background-color: #ffefca;
	color: #bc3803;
	border-color: #bc3803;
}

.mg-badge-danger {
	background-color: #ffe0db;
	color: #b81800;
	border-color: #f48270;
}

.mg-badge-light {
	background-color: #f7f9fb;
	color: #141824;
	border-color: #F7F8FA;
}

.mg-badge-dark {
	background-color: #9fa6bc;
	color: #fff;
	border-color: #8a94ad;
}

.mg-badge-primary[href]:hover, .mg-badge-primary[href]:focus {
	color: #85a9ff;
}

.mg-badge-success[href]:hover, .mg-badge-success[href]:focus {
	color: #90d67f;
}

.mg-badge-info[href]:hover, .mg-badge-info[href]:focus {
	color: #60c6ff;
}

.mg-badge-warning[href]:hover, .mg-badge-warning[href]:focus {
	color: #ffcc85;
}

.mg-badge-danger[href]:hover, .mg-badge-danger[href]:focus {
	color: #f48270;
}

.mg-badge-tag {
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 4px;
	border: 1px solid #e3e6ed;
	background-color: #e3e6ed;
	color: #222834;
	font-weight: 700;
	font-size: 1.4rem; /* 1.4rem × 0.95 */
	padding: 2px 8px;
	text-transform: uppercase;
}

.mg-badge-tag:hover, .mg-badge-tag:focus {
	background-color: #cbd0dd;
}

.mg-btn {
	display: inline-block;
	padding: 1rem 2.4rem; /* 1rem × 0.95, 2.4rem × 0.95 */
	color: #333 !important;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	border-radius: 6px;
	background-color: #fff;
	white-space: nowrap;
	-webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	-o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.mg-btn:hover {
	color: #333 !important;
	text-decoration: none;
	background-color: #ddd !important;
	border-color: #ddd !important;
}

.mg-btn.mg-btn-sm {
	padding: 0.75rem 1.5rem; /* 0.75rem × 0.95, 1.5rem × 0.95 */
}

.mg-btn.mg-btn-xs {
	padding: 0.6rem 1.3rem;
}

.mg-btn-excel i { color: #0F9D58; }

.mg-btn-link {
	background-color: transparent !important;
	border-color: transparent !important;
	text-decoration: none;
}

.mg-btn-link:hover {
	text-decoration: underline;
	background-color: transparent !important;
	border-color: transparent !important;
}

.mg-btn-default {
	border-color: #ddd !important;
}

.mg-btn-primary {
	color: #fff !important;
	background-color: #3874ff !important;
	border-color: #3874ff !important;
}

.mg-btn-primary:hover {
	background-color: #004dff !important;
	border-color: #004dff !important;
	color: #fff !important;
}

.mg-btn-secondary {
	color: #fff !important;
	background-color: #31374a !important;
	border-color: transparent !important;
}

.mg-btn-secondary:hover {
	color: #fff !important;
	background-color: #222834 !important;
	border-color: rgba(0, 0, 0, 0.2) !important;
}

.mg-btn-success {
	color: #fff !important;
	background-color: #25b003 !important;
	border-color: transparent !important;
}

.mg-btn-success:hover {
	color: #fff !important;
	background-color: #23890b !important;
	border-color: rgba(0, 0, 0, 0.2) !important;
}

.mg-btn-info {
	color: #fff !important;
	background-color: #0097eb !important;
	border-color: transparent !important;
}

.mg-btn-info:hover {
	color: #fff !important;
	background-color: #0080c7 !important;
	border-color: rgba(0, 0, 0, 0.2) !important;
}

.mg-btn-warning {
	color: #fff !important;
	background-color: #e5780b !important;
	border-color: transparent !important;
}

.mg-btn-warning:hover {
	color: #fff !important;
	background-color: #d6630a !important;
	border-color: rgba(0, 0, 0, 0.2) !important;
}

.mg-btn-danger {
	color: #fff !important;
	background-color: #dc3545 !important;
	border-color: transparent !important;
}

.mg-btn-danger:hover {
	color: #fff !important;
	background-color: #cc1b00 !important;
	border-color: rgba(0, 0, 0, 0.2) !important;
}

.mg-btn-light {
	color: #000000 !important;
	background-color: #f8f9fb !important;
	border-color: #ddd !important;
}

.mg-btn-light:hover {
	color: #000000 !important;
	background-color: #cbced1 !important;
	border-color: #bfc2c5 !important;
}

.mg-btn-dark {
	color: #fff !important;
	background-color: #141824 !important;
	border-color: #141824 !important;
}

.mg-btn-dark:hover {
	color: #fff !important;
	background-color: #373b45 !important;
	border-color: #2c2f3a !important;
}

.mg-btn-outline-primary {
	color: #3874ff !important;
	background-color: #fff !important;
	border-color: #3874ff !important;
}

.mg-btn-outline-primary:hover {
	color: #fff !important;
	background-color: #3874ff !important;
	border-color: #3874ff !important;
}

.mg-btn-outline-secondary {
	color: #31374a !important;
	background-color: #fff !important;
	border-color: #31374a !important;
}

.mg-btn-outline-secondary:hover {
	color: #fff !important;
	background-color: #31374a !important;
	border-color: #31374a !important;
}

.mg-btn-outline-success {
	color: #25b003 !important;
	background-color: #fff !important;
	border-color: #25b003 !important;
}

.mg-btn-outline-success:hover {
	color: #fff !important;
	background-color: #25b003 !important;
	border-color: #25b003 !important;
}

.mg-btn-outline-info {
	color: #0097eb !important;
	background-color: #fff !important;
	border-color: #0097eb !important;
}

.mg-btn-outline-info:hover {
	color: #fff !important;
	background-color: #0097eb !important;
	border-color: #0097eb !important;
}

.mg-btn-outline-warning {
	color: #e5780b !important;
	background-color: #fff !important;
	border-color: #e5780b !important;
}

.mg-btn-outline-warning:hover {
	color: #fff !important;
	background-color: #e5780b !important;
	border-color: #e5780b !important;
}

.mg-btn-outline-danger {
	color: #dc3545 !important;
	background-color: #fff !important;
	border-color: #dc3545 !important;
}

.mg-btn-outline-danger:hover {
	color: #fff !important;
	background-color: #dc3545 !important;
	border-color: #dc3545 !important;
}

.mg-btn-outline-light {
	color: #F7F8FA !important;
	background-color: #fff !important;
	border-color: #F7F8FA !important;
}

.mg-btn-outline-light:hover {
	color: #000000 !important;
	background-color: #F7F8FA !important;
	border-color: #F7F8FA !important;
}

.mg-btn-outline-dark {
	color: #141824 !important;
	background-color: #fff !important;
	border-color: #141824 !important;
}

.mg-btn-outline-dark:hover {
	color: #fff !important;
	background-color: #141824 !important;
	border-color: #141824 !important;
}

.mg-btn.kbqc.init {
	background: #155CD6 !important;
	color: #fff !important;
}

.mg-btn.kbqc.init:hover, .mg-btn.kbqc.init:focus {
	color: #155CD6 !important;
	border: 1px solid #155CD6 !important;
	background: #fff !important;
}

.mg-btn.kbqc.running {
	background: #F8AF0E !important;
	color: #fff !important;
}

.mg-btn.kbqc.running:hover, .mg-btn.kbqc.running:focus {
	color: #F8AF0E !important;
	border: 1px solid #F8AF0E !important;
	background: #fff !important;
}

.mg-btn.kbqc.error {
	background: #F6422E !important;
	color: #fff !important;
}

.mg-btn.kbqc.error:hover, .mg-btn.kbqc.error:focus {
	color: #F6422E !important;
	border: 1px solid #F6422E !important;
	background: #fff !important;
}

.mg-btn.kbqc.completion {
	background: #00A081 !important;
	color: #fff !important;
}

.mg-btn.kbqc.completion:hover, .mg-btn.kbqc.completion:focus {
	color: #00A081 !important;
	border: 1px solid #00A081 !important;
	background: #fff !important;
}

.mg-mask-container {
	position: relative;
}

.mg-mask-container.gap-lg {
	padding-top: 4rem; /* 4rem × 0.95 */
	padding-bottom: 4rem; /* 4rem × 0.95 */
	margin-top: 4rem; /* 4rem × 0.95 */
	margin-bottom: 4rem; /* 4rem × 0.95 */
}

.mg-mask-container::after {
	content: ' ';
	background: #fff;
	position: absolute;
	top: 0;
	left: -100vw;
	right: -100vw;
	bottom: 0;
	width: 300vw;
	z-index: -1;
	height: 100%;
	overflow: hidden;
	border-top: 1px solid #D3DAE6;
}

.mg-mask-container.striped::after {
	background: #f5f7fa;
	border-top: 0;
	padding: 0.5rem; /* 0.5rem × 0.95 */
}

.mg-mask-container.striped.strip-border-top::after {
	border-top: 1px solid #D3DAE6;
}

.mg-mask-container.border-0::after {
	border-top: 0;
}

.mg-mask-container.view::after {
	background: #f6fbff;
	border: 1px solid #3874ff;
}

/* end admin common component */

/* start table */
.mg-table-container {
	position: relative;
	padding: 1rem 0; /* 1rem × 0.95 */
}

.mg-table {
	width: 100%;
	margin-bottom: 1rem; /* 1rem × 0.95 */
	vertical-align: top;
	border-color: rgba(203, 208, 221, 0.54);
	border-top: 1px solid #ddd;
	font-size: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table:not(.mg-table-btn) .mg-btn {
	padding: 0.25rem 1.5rem; /* 0.25rem × 0.95, 1.5rem × 0.95 */
}

.mg-table .mg-btn.mg-btn-service {
	padding: 0.65rem 1.5rem; /* 0.25rem × 0.95, 1.5rem × 0.95 */
}

.mg-table .mg-btn.mg-btn-fixed {
	padding: 1rem 2.4rem; /* 1rem × 0.95, 2.4rem × 0.95 */
}

.mg-table .mg-btn.mg-btn-font-lg {
	padding: 0.7rem 2.4rem; /* 0.7rem × 0.95, 2.4rem × 0.95 */
	font-size: 1.8rem; /* 1.8rem × 0.95 */
}

.mg-table > :not(caption) > * > * {
	padding: 1rem 2.5rem 1rem 0.5rem; /* 1rem × 0.95, 2.5rem × 0.95, 1rem × 0.95, 0.5rem × 0.95 */
	color: #31374a;
	background-color: #fff;
	border-bottom-width: 1px;
}

.mg-table > tbody {
	vertical-align: inherit;
}

.mg-table > thead {
	vertical-align: bottom;
}

.mg-table > thead > tr > th {
	padding-top: 1rem; /* 1rem × 0.95 */
	padding-bottom: 1rem; /* 1rem × 0.95 */
	line-height: 1.8;
	word-break: break-word;
}

.mg-table.mg-table-point tr > th {
	background-color: #F8F9FB;
	color: #222222;
}

.mg-table.mg-table-point > :not(caption) > * > * {
	padding: 1rem 0.5rem 1rem 0.5rem; /* 1rem × 0.95, 0.5rem × 0.95, 1rem × 0.95, 0.5rem × 0.95 */
}

.mg-table.mg-table-point.lg > :not(caption) > * > * {
	padding: 1rem 1.5rem 1rem 1.5rem; /* 1rem × 0.95, 1.5rem × 0.95, 1rem × 0.95, 1.5rem × 0.95 */
}

.mg-table.mg-table-form tr > th {
	font-size: 1.6rem; /* 1.6rem × 0.95 */
	padding: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table.mg-table-form tr > td {
	padding: 1rem 1.5rem; /* 1rem × 0.95, 1.5rem × 0.95 */
}

.mg-table.mg-table-view tr > th, .mg-table.mg-table-view tr > td {
	padding: 1rem 1.5rem; /* 1rem × 0.95, 1.5rem × 0.95 */
}

.mg-table.mg-table-align-center tr > td {
	vertical-align: middle;
}

.mg-table > thead > tr > th:first-child {
	padding-left: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table > thead > tr > th:last-child {
	padding-right: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table > tbody > tr > td:first-child {
	padding-left: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table > tbody > tr > td:last-child {
	padding-right: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-table-sm > :not(caption) > * > * {
	padding: 0.4rem 1rem 0.4rem 0.4rem !important; /* 0.4rem × 0.95, 1rem × 0.95, 0.4rem × 0.95, 0.4rem × 0.95 */
}

.mg-table-bordered > :not(caption) > * {
	border-width: 1px 0;
}

.mg-table-bordered > :not(caption) > * > * {
	border-width: 0 1px;
}

.mg-table-borderless > :not(caption) > * > * {
	border-bottom-width: 0;
}

.mg-table-borderless > :not(:first-child) {
	border-top-width: 0;
}

.mg-table-border-bottom > :not(caption) > * > * {
	border-top-width: 0;
}

.mg-table-border-bottom > :not(:first-child) {
	border-top-width: 0;
}

.mg-table.mg-table-service {
	border-top: 1px solid #707070;
}

.mg-table.mg-table-service > :not(caption) > * > * {
	padding: 1.2rem 2rem;
	font-size: 1.6rem;
}

.mg-table.mg-table-service > :not(:first-child) {
	border-top-width: 0;
}

.mg-table.mg-table-service .mg-table {
	padding: 0;
	border-top: 0;
	margin-bottom: 0;
}

.mg-table.mg-table-service .mg-table > :not(caption) > :last-child > * {
	border-bottom-width: 0;
}

.mg-table.mg-table-border-right tr > th:not(:last-child), .mg-table.mg-table-border-right tr > td:not(:last-child) {
	border-right: 1px solid #ddd;
}




.mg-table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 576px) {
	.mg-table-responsive-sm {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 768px) {
	.mg-table-responsive-md {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 992px) {
	.mg-table-responsive-lg {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 1200px) {
	.mg-table-responsive-xl {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 1400px) {
	.mg-table-responsive-xxl {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

.mg-table-info {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1rem 0 1rem 1rem; /* 1rem × 0.95, 0, 1rem × 0.95, 1.5rem × 0.95 */
}

.mg-table-info .page span {
	display: inline-block;
	vertical-align: top;
	color: #444;
	font-weight: 500;
}

.mg-table-info .page span + span::before {
	display: inline-block;
	width: 1px;
	margin: 0 1rem 0 0.5rem; /* 0, 1rem × 0.95, 0, 0.5rem × 0.95 */
	background-color: #ddd;
	content: '';
	vertical-align: middle;
}

.mg-table-info .page strong, .mg-table-info .page b {
	font-weight: 500;
	color: #000;
}

.mg-table-info .record { position: relative; }

.mg-table-info .record .form_select {
	width: auto;
	height: auto;
}

.mg-table-info .record .form_select select {
	padding: 0 1.7rem 0 1rem; /* 0, 1.7rem × 0.95, 0, 1rem × 0.95 */
	min-width: inherit;
	border: 0;
	background: none;
	font-weight: 400;
	color: #444;
	height: auto;
}

.mg-table-info .record .form_select::after {
	position: absolute;
	top: 50%;
	left: auto;
	right: 0.6rem; /* 0.6rem × 0.95 */
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "remixicon";
	content: '\ea4d';
	color: #777777;
	font-size: 1.4rem; /* 1.4rem × 0.95 */
}

.mg-table-page {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	padding: 1rem 0; /* 1rem × 0.95 */
	font-size: 1.4rem; /* 1.4rem × 0.95 */
}

.mg-table-page a {
	display: inline-block;
	overflow: hidden;
	border-radius: 6px;
	text-align: center;
	padding: 0.5rem 1.3rem; /* 0.5rem × 0.95, 1.3rem × 0.95 */
}

.mg-table-page a.arr {
	border: 1px solid #ddd;
}

.mg-table-page a.arr::before {
	display: block;
	width: 100%;
	height: 100%;
	font-family: "remixicon";
	text-align: center;
	line-height: inherit;
	color: #777;
	font-size: 1.6rem; /* 1.65rem × 0.95 */
}

.mg-table-page a.arr.first::before { content: "\f2e3"; }
.mg-table-page a.arr.prev::before { content: "\ea64"; }
.mg-table-page a.arr.next::before { content: "\ea6e"; }
.mg-table-page a.arr.last::before { content: "\f2e5"; }
.mg-table-page a.active { background-color: #3874ff; color: #fff; }
.mg-table-page .group { margin: 0 0.5rem; /* 0, 0.5rem × 0.95 */ }


.mg-table input[type='checkbox'] {
	position: relative;
	width: 1.6rem;
	height: 1.6rem;
	margin-right: 0.6rem;
	border: 1px solid #B6B6B6;
	background: #fff;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.mg-table input[type='checkbox']:checked {
	border-color: #155CD6;
}

.mg-table input[type='checkbox']:checked:after {
	content: "\eb7b";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #155CD6;
	color: #fff;
	font-size: 1.4rem;
	font-family: 'remixicon' !important;
}

.mg-table input[type='checkbox']:disabled {
	cursor: not-allowed !important;
}

.mg-table input[type='checkbox']:not(.view):disabled {
	border-color: #999;
	background: #999;
}

.mg-table input[type='checkbox']:not(.view):disabled:checked:after {
	background: #999;
}


/* end table */

/* start admin filter */
.mg-filter-nav {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding-left: 0;
	margin-left: -0.1rem; /* -1rem × 0.95 */
	margin-right: -0.1rem; /* -1rem × 0.95 */
	margin-bottom: 0;
	list-style: none;
}

.mg-filter-nav.mg-filter-nav-mask::after {
	content: ' ';
	background: #fff;
	position: absolute;
	top: 0;
	left: -100vw;
	right: -100vw;
	bottom: 0;
	width: 300vw;
	z-index: -1;
	height: 100%;
	overflow: hidden;
	border-bottom: 1px solid #D3DAE6;
}

.mg-filter-nav .nav-link {
	display: block;
	padding: 0.8rem 1.6rem; /* 0.8rem × 0.95, 1.6rem × 0.95 */
	color: #3874ff;
	background: none;
	border-bottom: 2px solid transparent;
	-webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
	-o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.mg-filter-nav .nav-link.active {
	color: #111;
	font-weight: 700;
	border-color: #3874ff;
	text-decoration: none !important;
}

.mg-filter-nav .nav-link:hover {
	color: rgb(0, 60, 199);
	text-decoration: underline;
}

.mg-filter {
	display: flex;
	flex-wrap: nowrap;
	min-height: 4rem; /* 4rem × 0.95 */
	row-gap: 1rem; /* 3rem × 0.95 */
	column-gap: 3rem;
}

.mg-filter.gap-lg {
	gap: 5rem; /* 5rem × 0.95 */
}

.mg-filter .mg-filter-search {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	gap: 0.5rem; /* 0.5rem × 0.95 */
	height: fit-content;
}

.mg-filter .mg-filter-search .mg-search-input {
	position: relative;
	width: 320px;
}

@media (min-width: 1199px) {
	.mg-filter .mg-filter-search .mg-search-input.lg {
		width: 500px;
	}
}

.mg-filter .mg-filter-search .mg-search-input input {
	width: 100%;
	padding-left: 4rem; /* 4rem × 0.95 */
	padding-right: 3.2rem; /* 3.2rem × 0.95 */
	-webkit-box-shadow: none;
	box-shadow: none;
}

.mg-filter .mg-filter-search .mg-search-input label {
	display: none;
}

.mg-filter .mg-filter-search .mg-search-input .search-icon {
	position: absolute;
	color: #8a94ad;
	top: 50%;
	left: 1.6rem; /* 1.6rem × 0.95 */
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.mg-filter .mg-sub-filter-group {
	display: inline-flex;
	vertical-align: middle;
	background-color: #f5f7fa;
	border: 1px solid #D8D9DF;
	border-radius: 6px;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	padding: 0 0 0 1.5rem; /* 0, 0, 0, 1.5rem × 0.95 */
	gap: 2rem; /* 2rem × 0.95 */
	white-space: nowrap;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item > .mg-filter-label {
	display: block;
	min-width: 80px;
	text-align: center;
	font-size: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item > .mg-filter-label + * {
	border-left: 1px solid #D8D9DF !important;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item .mg-sub-filter-item-wrap {
	display: flex;
	flex-wrap: nowrap;
	height: 100%;
	padding: 0 2.5rem; /* 0, 2.5rem × 0.95 */
	background-color: #fff;
	border-radius: 0 6px 6px 0;
	align-items: center;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item .mg-sub-filter-item-wrap.empty-label {
	border-radius: 6px;
}

.mg-filter .mg-sub-filter-group > .mg-sub-filter-item:not(:first-child) {
	margin-left: -1px;
	border-left: 1px solid #D8D9DF;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-item .form-select {
	padding: 0 4rem 0 1.5rem; /* 0, 4rem × 0.95, 0, 1.5rem × 0.95 */
	min-width: 150px;
	border: 0;
	border-radius: 0;
	background-color: #fff;
	font-size: 1.5rem; /* 1.5rem × 0.95 */
	font-weight: 400;
	letter-spacing: -0.45px;
	color: #555;
	height: 100%;
}

.mg-filter .mg-sub-filter-group > .mg-sub-filter-item:last-child .form-select {
	min-height: 4rem; /* 4rem × 0.95 */
	border-radius: 0 6px 6px 0;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-button {
	display: block;
	vertical-align: middle;
	border-left: 1px solid #D8D9DF;
}

.mg-filter .mg-sub-filter-group .mg-sub-filter-button button {
	border-radius: 0;
}

.mg-filter .mg-sub-filter-group.mg-btn-group .mg-sub-filter-button:first-child {
	border-left: 0;
}

.mg-filter .mg-sub-filter-group.mg-btn-group .mg-sub-filter-button:first-child button {
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}

.mg-filter .mg-sub-filter-group.mg-btn-group .mg-sub-filter-button:last-child button {
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}

.mg-clear-filter-group {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	background-color: #fff;
	background-clip: border-box;
}

.mg-clear-filter-group .row > * {
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: 1.6rem; /* 1.6rem × 0.95 */
	padding-left: 1.6rem; /* 1.6rem × 0.95 */
	margin-top: 0;
}

.mg-clear-filter-group .mg-clear-filter-header {
	display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	align-items: center;
	padding: 1rem 1.5rem; /* 1rem × 0.95, 1.5rem × 0.95 */
}

.mg-clear-filter-group .mg-clear-filter-header .mg-clear-filter-title {
	font-size: inherit;
	font-weight: 600;
	white-space: nowrap;
	color: #111;
	padding-right: 1rem; /* 1rem × 0.95 */
}

.mg-clear-filter-group .mg-clear-filter-header .mg-clear-filter-btn {
	font-size: 1.4rem; /* 1.4rem × 0.95 */
	font-weight: 500;
	white-space: nowrap;
}

.mg-clear-filter-group .mg-clear-filter-body {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	padding: 1rem 1.5rem; /* 1rem × 0.95, 1.5rem × 0.95 */
}

/* end admin filter */

/* start form */
.form-select {
	display: block;
	padding: 0.8rem 4rem 0.8rem 1.6rem; /* 0.8rem × 0.95, 4rem × 0.95, 0.8rem × 0.95, 1.6rem × 0.95 */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUwIiBoZWlnaHQ9IjE1MCIgdmlld0JveD0iMCAwIDE1MCAxNTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik03NS4zNDggMTI3LjE5MkM3Mi40MzgxIDEyNy4xOTIgNjkuODUxNCAxMjYuMjIyIDY3LjkxMTUgMTI0LjI4Mkw1LjgzMjE1IDYyLjIwMjNDMS42Mjg4NyA1OC4zMjIzIDEuNjI4ODcgNTEuNTMyNCA1LjgzMjE1IDQ3LjY1MjVDOS43MTIxMSA0My40NDkyIDE2LjUwMiA0My40NDkyIDIwLjM4MiA0Ny42NTI1TDc1LjM0OCAxMDIuMjk1TDEyOS45OTEgNDcuNjUyNUMxMzMuODcxIDQzLjQ0OTIgMTQwLjY2MSA0My40NDkyIDE0NC41NDEgNDcuNjUyNUMxNDguNzQ0IDUxLjUzMjQgMTQ4Ljc0NCA1OC4zMjIzIDE0NC41NDEgNjIuMjAyM0w4Mi40NjEzIDEyNC4yODJDODAuNTIxMyAxMjYuMjIyIDc3LjkzNDcgMTI3LjE5MiA3NS4zNDggMTI3LjE5MloiIGZpbGw9IiMzMTM3NEEiLz4KPC9zdmc+Cg==");
	background-repeat: no-repeat;
	background-position: right 1rem center; /* 1rem × 0.95 */
	background-size: 9px 12px;
	border: 1px solid #D8D9DF;
	border-radius: 6px;
	-webkit-box-shadow: inset 0 1px 2px transparent;
	box-shadow: inset 0 1px 2px transparent;
	-webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	-o-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.form-control {
	display: block;
	width: 100%;
	padding: 0.6rem 1.2rem;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	color: #555;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #D8D9DF;
	border-radius: 6px;
	-webkit-box-shadow: inset 0 1px 2px transparent;
	box-shadow: inset 0 1px 2px transparent;
	-webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	-o-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.form-control:not(:disabled, :read-only):focus, .form-select:not(:disabled, :read-only):focus {
	color: #31374a;
	background-color: #fff;
	border-color: #3874ff;
	outline: 0;
	-webkit-box-shadow: inset 0 1px 2px transparent, inset 0 0 0 30px #fff, 0 0 0 0.25rem rgba(56, 116, 255, 0.25);
	box-shadow: inset 0 1px 2px transparent, inset 0 0 0 30px #fff, 0 0 0 0.25rem rgba(56, 116, 255, 0.25);
}

.form-control:disabled, .form-control:read-only, .form-select:disabled, .form-select:read-only {
	outline: 0;
}

.was-validated .form-control:invalid, .form-control.is-invalid {
	border-color: #dc3545;
	padding-right: calc(1.49em + 1rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23fa3b1d'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fa3b1d' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(0.3725em + 0.25rem) center;
	background-size: calc(0.745em + 0.5rem) calc(0.745em + 0.5rem);
	-webkit-box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
	box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
	z-index: 3;
}
.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
	border-color: #dc3545;
	-webkit-box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
	box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
}

.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
	padding-right: calc(1.49em + 1rem);
	background-position: top calc(0.3725em + 0.25rem) right calc(0.3725em + 0.25rem);
}

.was-validated .form-select:invalid, .form-select.is-invalid,
.was-validated .valid-box:invalid, .valid-box.is-invalid
{
	border-color: #dc3545;
	-webkit-box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
	box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
}

.was-validated .valid-title.is-invalid, .checkbox-item-label.is-invalid, .radio-item-label.is-invalid {
	color: #dc3545 !important;
}

.was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {
	padding-right: 5rem;
	background-position: right 1rem center, center right 2.5rem;
	background-size: 9px 12px, calc(0.745em + 0.5rem) calc(0.745em + 0.5rem);
}
.was-validated .form-select:invalid:focus, .form-select.is-invalid:focus,
.was-validated .valid-box:invalid:focus, .valid-box.is-invalid:focus
{
	border-color: #dc3545;
	-webkit-box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
	box-shadow: inset 0 1px 2px transparent, 0 0 0 0.25rem rgba(244, 130, 112, 0.25);
}

.was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid,
.was-validated .input-group > .form-select:not(:focus):invalid,
.input-group > .form-select:not(:focus).is-invalid,
.was-validated .input-group > .form-floating:not(:focus-within):invalid,
.input-group > .form-floating:not(:focus-within).is-invalid {
	z-index: 4;
}

.mg-input-group {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	width: 100%;
}

.mg-input-group > .form-control,
.mg-input-group > .form-select {
	position: relative;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	width: 1%;
	min-width: 0;
	/*height: auto;*/
}

.mg-input-group .select2.select2-container .select2-selection {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.mg-input-group > .form-control:focus,
.mg-input-group > .form-select:focus {
	z-index: 5;
}

.mg-input-group .mg-btn {
	position: relative;
	z-index: 2;
}

.mg-input-group .mg-btn:focus {
	z-index: 5;
}

.mg-input-group-text {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 0.8rem 1.6rem; /* 0.8rem × 0.95, 1.6rem × 0.95 */
	font-weight: 600;
	line-height: 1.5;
	color: #111;
	text-align: center;
	white-space: nowrap;
	background-color: #F7F8FA;
	border: 1px solid #cbd0dd;
	border-radius: 8px;
}

.mg-input-group-lg > .form-control,
.mg-input-group-lg > .form-select,
.mg-input-group-lg > .input-group-text,
.mg-input-group-lg > .mg-btn,
.mg-input-group-lg > .mg-input-group .select2.select2-container .select2-selection {
	padding: 1.2rem 1.6rem; /* 1.2rem × 0.95, 1.6rem × 0.95 */
	border-radius: 8px;
}

.mg-input-group-sm > .form-control,
.mg-input-group-sm > .form-select,
.mg-input-group-sm > .input-group-text,
.mg-input-group-sm > .mg-btn,
.mg-input-group-lg > .mg-input-group .select2.select2-container .select2-selection {
	padding: 0.6rem 1.6rem; /* 0.6rem × 0.95, 1.6rem × 0.95 */
	font-size: 1.3rem; /* 1.3rem × 0.95 */
	border-radius: 6rem; /* 6rem × 0.95 */
}

.mg-input-group-lg > .form-select,
.mg-input-group-sm > .form-select {
	padding-right: 6rem; /* 6rem × 0.95 */
}

.mg-input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),
.mg-input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3),
.mg-input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-control,
.mg-input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-select {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.mg-input-group.has-validation > :nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),
.mg-input-group.has-validation > .dropdown-toggle:nth-last-child(n+4),
.mg-input-group.has-validation > .form-floating:nth-last-child(n+3) > .form-control,
.mg-input-group.has-validation > .form-floating:nth-last-child(n+3) > .form-select {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.mg-input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback):not(.ref-data) {
	/*margin-left: calc(-1 * 1px);*/
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.mg-input-group > .form-floating:not(:first-child) > .form-control,
.mg-input-group > .form-floating:not(:first-child) > .form-select {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.mg-datepicker input {
	display: inline-block;
	width: 130px;
}

.mg-datepicker .ui-datepicker-trigger {
	right: 1.5rem; /* 1.5rem × 0.95 */
}

.mg-form-container {
	position: relative;
	padding: 1rem; /* 1rem × 0.95 */
}

@media (min-width: 768px) {
	.mg-form-container {
		padding: 1.5rem; /* 1.5rem × 0.95 */
	}
}

.mg-form-container.striped input[type="text"], .mg-form-container.striped input[type="password"], .mg-form-container.striped input[type="number"], .mg-form-container.striped select, .mg-form-container.striped textarea {
	background-color: #F7F8FA;
}

.mg-form-container em.error {
	line-height: 1.2;
	font-size: 1.3rem; /* 1.3rem × 0.95 */
	color: #dc3545;
	display: block;
	font-weight: 500;
	padding: 0.5rem 0; /* 0.5rem × 0.95 */
	margin-top: 0.5rem; /* 0.5rem × 0.95 */
}

.mg-card {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	background-color: #fff;
	background-clip: border-box;
	border: 1px solid #cbd0dd;
	border-radius: 6px;
}

.mg-card .row > * {
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: 1.6rem; /* 1.6rem × 0.95 */
	padding-left: 1.6rem; /* 1.6rem × 0.95 */
	margin-top: 0;
}

.mg-card .mg-card-header {
	padding: 2rem 2.4rem; /* 2rem × 0.95, 2.4rem × 0.95 */
	margin-bottom: 0;
	background-color: #fff;
	border-bottom: 1px solid #cbd0dd;
}

.mg-card .mg-card-header:first-child {
	border-radius: 6px 6px 0 0;
}

.mg-card .mg-card-header.single {
	border-radius: 6px;
}

.mg-card .mg-card-body {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	padding: 2rem 2.4rem; /* 2rem × 0.95, 2.4rem × 0.95 */
}

.mg-card .mg-card-footer {
	padding: 2rem 2.4rem; /* 2rem × 0.95, 2.4rem × 0.95 */
	background-color: #fff;
	border-top: 1px solid #cbd0dd;
}

.mg-card .mg-card-footer:last-child {
	border-radius: 0 0 6px 6px;
}

.mg-card.mg-card-border-0, .mg-card.mg-card-border-0 .mg-card-header, .mg-card.mg-card-border-0 .mg-card-footer {
	border: 0;
}

.row-form-wrap {
	position: relative;
	margin-bottom: 2rem; /* 2rem × 0.95 */
}

.col-form-label {
	padding-top: 0.8rem; /* 0.8rem × 0.95 */
	padding-bottom: 0.8rem; /* 0.8rem × 0.95 */
	margin-bottom: 0;
	font-size: inherit;
	font-weight: 600;
	color: #111;
}
/* end form */

/* aside panel */
@media (max-width: 576px) {
	.aside-canvas-sm {
		position: fixed;
		bottom: 0;
		z-index: 1045;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		max-width: 100%;
		color: #31374a;
		visibility: hidden;
		background-color: #fff;
		background-clip: padding-box;
		outline: 0;
		-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
		box-shadow: 0 0.2rem 0.4rem #ddd;
		-webkit-transition: transform 0.3s ease-in-out;
		-o-transition: transform 0.3s ease-in-out;
		transition: transform 0.3s ease-in-out;
	}
}

@media (max-width: 576px) and (prefers-reduced-motion: reduce) {
	.aside-canvas-sm {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

@media (max-width: 576px) {
	.aside-canvas-sm.aside-canvas-start {
		top: 0;
		left: 0;
		width: 450px;
		border-right: 1px solid transparent;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	.aside-canvas-sm.aside-canvas-end {
		top: 0;
		right: 0;
		width: 450px;
		border-left: 1px solid transparent;
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}

	.aside-canvas-sm.aside-canvas-top {
		top: 0;
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-bottom: 1px solid transparent;
		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	.aside-canvas-sm.aside-canvas-bottom {
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-top: 1px solid transparent;
		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		transform: translateY(100%);
	}

	.aside-canvas-sm.showing, .aside-canvas-sm.show:not(.hiding) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.aside-canvas-sm.showing, .aside-canvas-sm.hiding, .aside-canvas-sm.show {
		visibility: visible;
	}
}

@media (min-width: 576px) {
	.aside-canvas-sm {
		--phoenix-aside-canvas-height: auto;
		--phoenix-aside-canvas-border-width: 0;
		background-color: transparent !important;
	}

	.aside-canvas-sm .aside-canvas-header {
		display: none;
	}

	.aside-canvas-sm .aside-canvas-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		padding: 0;
		overflow-y: visible;
		background-color: transparent !important;
	}
}

@media (max-width: 768px) {
	.aside-canvas-md {
		position: fixed;
		bottom: 0;
		z-index: 1045;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		max-width: 100%;
		color: #31374a;
		visibility: hidden;
		background-color: #fff;
		background-clip: padding-box;
		outline: 0;
		-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
		box-shadow: 0 0.2rem 0.4rem #ddd;
		-webkit-transition: transform 0.3s ease-in-out;
		-o-transition: transform 0.3s ease-in-out;
		transition: transform 0.3s ease-in-out;
	}
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
	.aside-canvas-md {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

@media (max-width: 768px) {
	.aside-canvas-md.aside-canvas-start {
		top: 0;
		left: 0;
		width: 450px;
		border-right: 1px solid transparent;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	.aside-canvas-md.aside-canvas-end {
		top: 0;
		right: 0;
		width: 450px;
		border-left: 1px solid transparent;
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}

	.aside-canvas-md.aside-canvas-top {
		top: 0;
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-bottom: 1px solid transparent;
		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	.aside-canvas-md.aside-canvas-bottom {
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-top: 1px solid transparent;
		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		transform: translateY(100%);
	}

	.aside-canvas-md.showing, .aside-canvas-md.show:not(.hiding) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.aside-canvas-md.showing, .aside-canvas-md.hiding, .aside-canvas-md.show {
		visibility: visible;
	}
}

@media (min-width: 768px) {
	.aside-canvas-md {
		--phoenix-aside-canvas-height: auto;
		--phoenix-aside-canvas-border-width: 0;
		background-color: transparent !important;
	}

	.aside-canvas-md .aside-canvas-header {
		display: none;
	}

	.aside-canvas-md .aside-canvas-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		padding: 0;
		overflow-y: visible;
		background-color: transparent !important;
	}
}

@media (max-width: 992px) {
	.aside-canvas-lg {
		position: fixed;
		bottom: 0;
		z-index: 1045;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		max-width: 100%;
		color: #31374a;
		visibility: hidden;
		background-color: #fff;
		background-clip: padding-box;
		outline: 0;
		-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
		box-shadow: 0 0.2rem 0.4rem #ddd;
		-webkit-transition: transform 0.3s ease-in-out;
		-o-transition: transform 0.3s ease-in-out;
		transition: transform 0.3s ease-in-out;
	}
}

@media (max-width: 992px) and (prefers-reduced-motion: reduce) {
	.aside-canvas-lg {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

@media (max-width: 992px) {
	.aside-canvas-lg.aside-canvas-start {
		top: 0;
		left: 0;
		width: 450px;
		border-right: 1px solid transparent;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	.aside-canvas-lg.aside-canvas-end {
		top: 0;
		right: 0;
		width: 450px;
		border-left: 1px solid transparent;
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}

	.aside-canvas-lg.aside-canvas-top {
		top: 0;
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-bottom: 1px solid transparent;
		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	.aside-canvas-lg.aside-canvas-bottom {
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-top: 1px solid transparent;
		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		transform: translateY(100%);
	}

	.aside-canvas-lg.showing, .aside-canvas-lg.show:not(.hiding) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.aside-canvas-lg.showing, .aside-canvas-lg.hiding, .aside-canvas-lg.show {
		visibility: visible;
	}
}

@media (min-width: 992px) {
	.aside-canvas-lg {
		--phoenix-aside-canvas-height: auto;
		--phoenix-aside-canvas-border-width: 0;
		background-color: transparent !important;
	}

	.aside-canvas-lg .aside-canvas-header {
		display: none;
	}

	.aside-canvas-lg .aside-canvas-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		padding: 0;
		overflow-y: visible;
		background-color: transparent !important;
	}
}

@media (max-width: 1199.98px) {
	.aside-canvas-xl {
		position: fixed;
		bottom: 0;
		z-index: 1045;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		max-width: 100%;
		color: #31374a;
		visibility: hidden;
		background-color: #fff;
		background-clip: padding-box;
		outline: 0;
		-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
		box-shadow: 0 0.2rem 0.4rem #ddd;
		-webkit-transition: transform 0.3s ease-in-out;
		-o-transition: transform 0.3s ease-in-out;
		transition: transform 0.3s ease-in-out;
	}
}

@media (max-width: 1199.98px) and (prefers-reduced-motion: reduce) {
	.aside-canvas-xl {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

@media (max-width: 1199.98px) {
	.aside-canvas-xl.aside-canvas-start {
		top: 0;
		left: 0;
		width: 450px;
		border-right: 1px solid transparent;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	.aside-canvas-xl.aside-canvas-end {
		top: 0;
		right: 0;
		width: 450px;
		border-left: 1px solid transparent;
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}

	.aside-canvas-xl.aside-canvas-top {
		top: 0;
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-bottom: 1px solid transparent;
		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	.aside-canvas-xl.aside-canvas-bottom {
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-top: 1px solid transparent;
		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		transform: translateY(100%);
	}

	.aside-canvas-xl.showing, .aside-canvas-xl.show:not(.hiding) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.aside-canvas-xl.showing, .aside-canvas-xl.hiding, .aside-canvas-xl.show {
		visibility: visible;
	}
}

@media (min-width: 1200px) {
	.aside-canvas-xl {
		--phoenix-aside-canvas-height: auto;
		--phoenix-aside-canvas-border-width: 0;
		background-color: transparent !important;
	}

	.aside-canvas-xl .aside-canvas-header {
		display: none;
	}

	.aside-canvas-xl .aside-canvas-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		padding: 0;
		overflow-y: visible;
		background-color: transparent !important;
	}
}

@media (max-width: 1539.98px) {
	.aside-canvas-xxl {
		position: fixed;
		bottom: 0;
		z-index: 1045;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		max-width: 100%;
		color: #31374a;
		visibility: hidden;
		background-color: #fff;
		background-clip: padding-box;
		outline: 0;
		-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
		box-shadow: 0 0.2rem 0.4rem #ddd;
		-webkit-transition: transform 0.3s ease-in-out;
		-o-transition: transform 0.3s ease-in-out;
		transition: transform 0.3s ease-in-out;
	}
}

@media (max-width: 1539.98px) and (prefers-reduced-motion: reduce) {
	.aside-canvas-xxl {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

@media (max-width: 1539.98px) {
	.aside-canvas-xxl.aside-canvas-start {
		top: 0;
		left: 0;
		width: 450px;
		border-right: 1px solid transparent;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	.aside-canvas-xxl.aside-canvas-end {
		top: 0;
		right: 0;
		width: 450px;
		border-left: 1px solid transparent;
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}

	.aside-canvas-xxl.aside-canvas-top {
		top: 0;
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-bottom: 1px solid transparent;
		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	.aside-canvas-xxl.aside-canvas-bottom {
		right: 0;
		left: 0;
		height: 30vh;
		max-height: 100%;
		border-top: 1px solid transparent;
		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		transform: translateY(100%);
	}

	.aside-canvas-xxl.showing, .aside-canvas-xxl.show:not(.hiding) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.aside-canvas-xxl.showing, .aside-canvas-xxl.hiding, .aside-canvas-xxl.show {
		visibility: visible;
	}
}

@media (min-width: 1540px) {
	.aside-canvas-xxl {
		--phoenix-aside-canvas-height: auto;
		--phoenix-aside-canvas-border-width: 0;
		background-color: transparent !important;
	}

	.aside-canvas-xxl .aside-canvas-header {
		display: none;
	}

	.aside-canvas-xxl .aside-canvas-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		padding: 0;
		overflow-y: visible;
		background-color: transparent !important;
	}
}

.aside-canvas {
	position: fixed;
	bottom: 0;
	z-index: 1045;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	max-width: 100%;
	color: #31374a;
	visibility: hidden;
	background-color: #fff;
	background-clip: padding-box;
	outline: 0;
	-webkit-box-shadow: 0 0.2rem 0.4rem #ddd;
	box-shadow: 0 0.2rem 0.4rem #ddd;
	-webkit-transition: transform 0.3s ease-in-out;
	-o-transition: transform 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out;
}

.aside-collapse-hide .aside-canvas {
	display: none !important;
}

.fixed-aside-toggle {
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	background-color: #fff;
	background-clip: border-box;
	border: 1px solid #bbb;
	border-radius: 0.5rem 0.5rem 0 0;
	padding: 1rem 1.5rem 1rem 1.5rem;
	position: fixed;
	top: 50%;
	right: -12px;
	text-decoration: none;
	z-index: 10;
	-webkit-transform: rotate(-90deg) translate3d(-25px, 39px, 0);
	transform: rotate(-90deg) translate3d(-25px, 39px, 0);
	margin-top: -5rem;
}

.aside-collapse-hide .fixed-aside-toggle {
	display: flex !important;
}

.aside-canvas .aside-canvas-splitter {
	display: block;
	position: absolute;
	flex: 0 0 auto;
	top: 0;
	left: -6px;
	width: 7px;
	height: 100%;
	z-index: 6;
	cursor: e-resize;
}

.aside-canvas .aside-expand-wrap {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 1rem;
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 2;
}

.aside-canvas .aside-canvas-dismiss {
	font-size: 2rem;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	padding: calc(1.6rem * 0.5) calc(1.6rem * 0.5);
	margin-top: calc(-0.5 * 1.6rem);
	margin-right: calc(-0.5 * 1.6rem);
	margin-bottom: calc(-0.5 * 1.6rem);
	margin-left: auto;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

@media (prefers-reduced-motion: reduce) {
	.aside-canvas {
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
}

.aside-canvas.aside-canvas-start {
	top: 0;
	left: 0;
	width: 450px;
	border-right: 1px solid transparent;
	-webkit-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	transform: translateX(-100%);
}

.aside-canvas.aside-canvas-end {
	top: 0;
	right: 0;
	width: 450px;
	border-left: 1px solid transparent;
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%);
}

.aside-canvas.aside-canvas-top {
	top: 0;
	right: 0;
	left: 0;
	height: 30vh;
	max-height: 100%;
	border-bottom: 1px solid transparent;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}

.aside-canvas.aside-canvas-bottom {
	right: 0;
	left: 0;
	height: 30vh;
	max-height: 100%;
	border-top: 1px solid transparent;
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
}

.aside-canvas.showing, .aside-canvas.show:not(.hiding) {
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}

.aside-canvas.showing, .aside-canvas.hiding, .aside-canvas.show {
	visibility: visible;
}

.aside-canvas-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1040;
	width: 100vw;
	height: 100vh;
	background-color: #000000;
}

.aside-canvas-backdrop.fade {
	opacity: 0;
}

.aside-canvas-backdrop.show {
	opacity: 0.5;
}

.aside-canvas-header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 2rem 2rem;
}

.aside-canvas-body {
	position: relative;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	padding: 2rem 2rem;
	overflow-y: auto;
}


.mg-progress {
	display: flex;
	height:1rem;
	overflow: hidden;
	font-size: .75rem;
	background-color: #e9ecef;
	border-radius: .25rem;
}

.mg-progress-bar {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	background-color: #007bff;
	transition: width .6s ease;
}

