/*
::  1.0 General Reset & Setup
-------------------------------------------

::  2.0 Page Options
-------------------------------------------
	2.1  Fixed Header
	2.2  Fixed Sidebar
	2.3  Minified Sidebar
	2.4  Admin
	2.5  Fixed Content


::  3.0 Page Structure
-------------------------------------------
3.1  Page Loader
	3.2  Page Header
	3.3  Page Sidebar
	3.4  Page Content
	3.5  Page Footer
	3.6  Page Top Menu

::  4.0 Components
-------------------------------------------
	4.1  Component - Form Elements
	4.2  Component - Dropdown Menu
	4.3  Component - Tooltip
	4.4  Component - Alert
	4.5  Component - Note Setting
	4.6  Component - Badge & Label Setting
	4.7  Component - Pagination & pager
	4.8  Component - Progress bar
	4.9  Component - Nav Setting
	4.10 Component - Nav Tabs
	4.11 Component - Nav Pills
	4.12 Component - Tab Content
	4.13 Component - Accordion Panel
	4.14 Component - Button
	4.15 Component - Panel
	4.16.Component - Panel - Panel Expand
	4.17 Component - Panel - Panel loading
	4.18 Component - Modal Setting
	4.19 Component - Media Object
	4.20 Component - Table
	4.21 Component - Well
	4.22 Component - Jumbotron
	4.23 Component - List Group
	4.24 Component - Carousel
	4.25 Component - Code
	4.26 Component - Popover
	4.27 Component - Caret
	4.28 Component - Lead
	4.29 Component - List Inline
	4.30 Component - Blockquote
	4.31 Component - Close Button
	4.32 Component - Inverse List Group Item
	4.33 Component - Material Icon
	4.34 Component - CSS Checkbox
	4.35 Component - CSS Radio Button
	4.36 Component - Cards
	4.37 Component - Breadcrumb

::  5.0 Plugins
-------------------------------------------
	5.1  Plugin - jQuery Draggable
	5.2  Plugin - Slimscrollbar
	5.3  Plugin - Gritter Notification
	5.4  Plugin - Data Table
	5.5  Plugin - Datepicker
	5.6  Plugin - Colorpicker

::  6.0 Widgets
-------------------------------
	6.1  Widget - General Setting
	6.2  Widget - Media Message
	6.3  Widget - Stats
	6.4  Widget - Todolist
	6.5  Widget - Theme Panel
	6.6  Widget - Chart
	6.7  Widget - Registered Users List
	6.8  Widget - Chat List
	6.9  Widget - Unlimited Nav Tabs
	6.10 Widget - Widget List
	6.11 Widget - Widget Chat
	6.12 Widget - Widget Input
	6.13 Widget - Widget Todolist
	6.14 Widget - Widget Map
	6.15 Widget - Widget Icon
	6.16 Widget - Widget Image
	6.17 Widget - Widget Card
	6.18 Widget - Widget Chart
	6.19 Widget - Widget Table

::  7.0 Pages
-------------------------------
	7.1  Page - Search Result
	7.2  Page - Vector / Google Map
	7.3  Page - Invoice
	7.4  Page - Login
	7.5  Page - Gallery
	7.6  Page - 404 Error
	7.7  Page - Timeline
	7.8  Page - Coming Soon
	7.10 Page - Email Inbox
	7.11 Page - Email Detail
	7.12 Page - Email Compose
	7.14 Page - Profile

::  8.0 Predefined CSS Setting
-------------------------------------------
	8.1 Predefined Classes */

/* -------------------------------
	1.0 General reset & setup
------------------------------- */

body {
	background-color: #f8f9fa;
	font-size: 16px;
	color: #302c2e;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.15;
	height: 100%;
	width: 100%;
	/* overflow-x: auto; */
	min-width: 300px;
	max-width: 100%;
    overflow-x: hidden;
}

a {
	color: #DB092F;
}

label {
	margin-bottom: 8px;
}

h1 {
	font-size: 48px;
	font-weight: 700;
}

h4 {
	font-size: 22px;
}

input:read-only {
	background-color: white;
}

/* -------------------------------
	2.0 Page Option
-------------------------------  */

/* 2.1 Option - Fixed Header */
.page-header-fixed .header {
	position: fixed;
	/* box-shadow: 0 0 24px rgba(0, 0, 0, 0.15); */
}


/* 2.2 Option - Fixed Sidebar */

.page-sidebar-fixed .sidebar {
	min-height: 100%;
    padding: 0;
    z-index: 1000;
    position: fixed;
}

/* 2.3 Option - Minified Sidebar */
.page-sidebar-minified .sidebar {
	width: 62px;
	display: inline-table;
}

.page-sidebar-minified .sidebar span,
.page-sidebar-minified .nav-profile {
	display: none;
}

.page-sidebar-minified .content {
	margin-left: 60px;
}

.page-sidebar-minified .header .navbar-header {
	width: calc(100vw - 60px);
}


.page-sidebar-minified .sidebar .nav li .has-sub {
	left: 100%;
    position: absolute;
    top: 0;
    width: 210px;
    z-index: 999;
	background: #FFFFFF;
	border: 1px solid #cbc7c9;
	box-shadow: 3px 0 4px 0 rgba(220, 151, 151, 0.1);
    transition: 0s;
}

.page-sidebar-minified .sidebar .nav a.justify-content-between {
	padding-right: 0px;
}

.page-sidebar-minified .sidebar .nav li .has-sub span {
	display: block;
}

.page-sidebar-minified .sidebar a[aria-expanded="true"] .icon-caret {
	transform: rotate(90deg);
}

.page-sidebar-minified .sidebar a[aria-expanded="false"] .icon-caret {
	transform: rotate(90deg);
}

.page-sidebar-minified .sidebar .has-sub a {
	padding-left: 16px;
}

.page-sidebar-minified .has-sub>a:hover,
.page-sidebar-minified .sidebar .list-group a.active {
	background-color: #fce8eb;
	padding: 19px 16px;
}

.page-sidebar-minified .sidebar-minify-btn {
	color: #ffffff;
	background-color: #db092f;
}

.page-sidebar-minified .sidebar-minify-btn i:before {
	content: '\f101';
}

.icon-caret {
	width: 8px;
	height: 8px;
}

/* 2.4 Page Admin */
/*.page-admin .header .navbar-user {
	margin-right: 80px;
}*/

/* 2.5 Fixed Content */
.page-content-fixed .content {
	margin-left: 0;
	padding: 0;
}

/* -------------------------------
   3.0 Page Structure
------------------------------- */

/* 3.2 Page Header */
.header {
	position: relative;
	top: 0;
	z-index: 1003;
	margin-bottom: 0;
	padding: 0;
	transition: box-shadow .2s linear;
	height: 72px;
	background-color: #fff;
	align-items: center;
	display: flex;
	width: 100%;
	border-bottom: 1px solid #cbc7c9;
}

.header-mobile {
	position: relative;
	top: 0;
	z-index: 99;
	margin: 0;
	padding: 0;
	height: 64px;
	background-color: #333333;
	width: 100%;
}

.brand-logo {
	margin-left: 16px;
}

.brand-text {
	font-size: 20px;
	color: #cbc7c9;
	margin-left: 0px;
}

.logo {
	width: 112px;
	height: 23px;
}

.logo-register {
	background: url(./img/logo-web.png);
	background-repeat: no-repeat;
	background-position: center;
}

.header .navbar-user {
	margin-right: 16px;
}

.header a {
	color: #ffffff;
}

.header a:hover {
	text-decoration: none !important;
	color: #ffffff;
}

.header .navbar-user a {
	padding: 8px 0;
}

.header .caret {
	width: 10px;
	height: 10px;
}

.header .dropdown-menu {
	border-radius: 0;
	padding: 0;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
	border: none;
}

.header .dropdown-menu a {
	color: #302c2e;
	padding: 16px;
}

.header .dropdown-menu a:hover {
	background-color: #1bb89a;
	color: #ffffff;
	/* border-left: 4px solid blue; */
}

.pms-dropdown-content {
	position: absolute;
	width: 238px;
	background: white;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
	right: 0;
	top: 110%;
	cursor: pointer;
	display: none;
}

.pms-dropdown-content.pms-active {
	display: block;
}

.admin-collapse-btn:hover {
	text-decoration: none !important;
}

.m-t-10 {
	margin-top: 10px;
}		 
.admin-collapse-btn.active::before {
	font-family: 'Font Awesome\ 5 Free';
	content: "\f00d";
	font-weight: 700;
	font-size: 24px;
}

.admin-collapse-btn.active {
	background-color: #db092f;
}

.admin-collapse-btn {
	position: fixed;
	width: 64px;
	height: 64px;
	background-color: #6e0518;
	top: 0;
	right: 0;
	z-index: 100;
	align-items: center;
	justify-content: center;
	display: flex;
}

.admin-collapse-btn::before {
	font-family: 'Font Awesome\ 5 Free';
	content: "\f0c9";
	font-weight: 700;
	color: #ffffff;
	font-size: 24px;
}

.pms-page-title {
	font-weight: 700;
	font-size: 32px;
}

.pms-title-label {
	height: 24px;
	background: #e5e3e4;
	;
}

.pms-title {
	font-size: 16px;
	color: #656565;
}

.myaccount-header {
	border-bottom: #cbc7c9 solid 1px;
	text-align: center !important;
	padding: 0 0 32px 0;
}

/* 3.3. Page Sidebar */
.sidebar {
	width: 300px;
	top: 64px;
	background-color: #ffffff;
	height: 100%;
	z-index: 1000;
	overflow-y: auto;
	padding-bottom: 80px;
	border-right: 1px solid #cbc7c9;
}

.sidebar a {
	color: #868e96;
	text-decoration: none;
	padding-left: 16px;
	padding-right: 16px;
}

.sidebar svg {
	fill: #949499;
	stroke: #949499;
}

.sidebar a:hover {
	text-decoration: none;
}

.sidebar li {
	position: relative;
    display: block;
}

.sidebar .nav a {
	position: relative;
	padding-top: 16px;
	padding-bottom: 16px;
}

.sidebar .has-sub a {
	padding-left: 32px;
}

.sidebar .has-sub>a:hover,
.sidebar .has-sub>a.active,
.sidebar .has-sub>a:hover i,
.sidebar .has-sub>a.active i,
.sidebar ul li a:hover .icon-sidebar,
.sidebar ul li a:hover,
.sidebar ul li a:hover .icon-caret,
.sidebar ul li a:hover .icon-sidebar,
.sidebar ul li a:hover .icon-customer .cls-2,
.sidebar ul li a:hover svg,
.sidebar ul li a.active svg,
.sidebar ul li a.active svg .cls-2 {
	color: #2d3e4f;
	fill: #2d3e4f;
	stroke: #2d3e4f;
	font-weight: 600;
}

.sidebar ul li a.active {
	color: #2d3e4f;
	fill: #2d3e4f;
	stroke: #2d3e4f;
	font-weight: 600;
	border-left: 6px solid #1bb89a;
}

.sidebar .has-sub>a i {
	font-size: 10px;
	margin-right: 14px;
	padding-top: 3px;
}

.sidebar .icon-customer .cls-1 {
	fill: none !important;
}

.sidebar .icon-customer .cls-2 {
	fill: #302c2e;
}

.sidebar .nav a[aria-expanded="true"] .icon-sidebar,
.sidebar .nav a[aria-expanded="true"],
.sidebar .nav a[aria-expanded="true"] .icon-customer .cls-2 {
	color: #2d3e4f;
	fill: #2d3e4f;
	font-weight: 600;
}

.sidebar .dropdown-toggle:hover::after {
	color: #db092f;
}

.sidebar a[aria-expanded="true"] .icon-caret {
	transition: 0.1s;
	fill: #2d3e4f;
	transform: rotate(180deg);
}

.sidebar a[aria-expanded="false"] .icon-caret {
	transition: 0.1s;
	fill: #302c2e;
}

.sidebar-border-bottom {
	border-bottom: solid 1px #dee5ed;
}

.sidebar .list-group {
	width: 100%;
}

.icon-sm {
	width: 56px;
	height: 56px;
}

.pms-right-0 {
	right: 0 !important;
}

.icon-ssm {
	width: 40px;
	height: 40px;
}

.icon-lg {
	width: 108px;
	height: 108px;
}

.relative {
	position: relative;
}

.item-border {
	position: absolute;
	left: 0;
	display: block;
	height: 100%;
	width: 4px;
}

.border-green {
	background: #00a273;
}

.box-sizing {
	box-sizing: border-box;
}

.border-red {
	background: #db092f;
}

.border-yellow {
	background: #ffb205;
}

.border-grey-bottom {
	border-bottom: 2px solid #e6e6e6;
}

.border-grey-top {
	border-top: 2px solid #e6e6e6;
}

.icon-back {
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 12px;
	transform: translate(-50%, -50%) rotate(45deg);
	border-left: 2px solid white;
	border-bottom: 2px solid white;
}

.icon-next {
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 12px;
	transform: translate(-50%, -50%) rotate(-135deg);
	border-left: 2px solid white;
	border-bottom: 2px solid white;
}

.icon-sidebar {
	width: 24px;
	height: 24px;
	margin-right: 10px;
}

.icon-dashboard {
	width: 20px;
	height: 20px;
}

.icon-caret {
	width: 20px;
	height: 20px;
}

.sidebar-minify-btn {
	background-color: #6e0518;
	border-top-left-radius: 30px;
	border-bottom-left-radius: 30px;
	padding: 20px 0;
	border: none;
	float: right;
	padding: 9px 11px !important;
	color: #ffffff !important;
}

/* .btn-sidebar {
	position: absolute;
	bottom: 106px;
	right: 0;
	position: fixed;
    bottom: 50px;
    left: 26px;
}

.extend {
	position: fixed;
    bottom: 50px;
	left: 264px !important;
} */

/* 3.3.1 Page Right Sidebar*/
.admin-panel {
	width: 300px;
	position: fixed;
	z-index: 99;
	right: -300px;
	top: 64px;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
	background-color: #7d7277;
	/* height: calc(100% - 64px); */
	transition: right 0s linear;
	display: none;
}

.admin-panel.active {
	right: 0;
	display: block;
}

.admin-panel li {
	list-style-type: none;
	padding: 0 16px;
	border-bottom: 1px solid #868083;
}

.admin-panel li:hover {
	background-color: #db092f;
}

.admin-panel li:hover a {
	height: calc(100% - 1px);
}

.admin-panel a {
	color: #fff;
	text-decoration: none;
	padding: 16px 0;
	position: relative;
}

.admin-panel .list-group {
	padding-bottom: 16px;
}

.admin-panel li::before {
	height: 1px;
	position: absolute;
	color: #868083;
	width: 100px;
	bottom: 0;
	z-index: inherit;
}

.admin-panel li a::after {
	content: '';
	height: 1px;
	position: absolute;
	width: 100%;
	bottom: -1px;
	background-color: #868083;
	right: 0;
}

/* .admin-tab i[aria-expanded="true"]{
	transform: rotate(180deg);
	transition: 0.1s;
}
.admin-tab i[aria-expanded="false"]{
	transition: 0.1s;
} */
/* 3.4 Page Content */
.content {
	margin-left: 300px;
}

.pms-content {
	padding: 24px 40px;
}

.top-content {
	background: #db092f;
}

.container-mobile {
	padding: 16px;
}

.container-minus-3 {
	margin-right: -16px;
	margin-left: -16px;
}

.container-even {
	padding: 16px;
	background-color: #f0f2f2;
}

.container-odd {
	padding: 16px;
	background-color: #ffffff;
}

/* 4.0 Components */

/* 4.1 Form Element */
strong {
	font-weight: 600;
}

.panel label {
	color: #302c2e;
	font-weight: normal;
}

.form-control {
	height: 48px;
	border-radius: 4px;
	border: solid 1px #797a80;
}

.form-control-plaintext {
	font-size: 20px;
	font-weight: 600;
	color: #302c2e;
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}

input,
select,
.custom-select,
.form-control,
textarea {
	color: #302c2e;
}

::placeholder {
	color: #cbc7c9 !important;
}
.Checkbox {
	width: 20px;
	height: 20px;
	position: relative;
}
.Checkbox > * {
	position: absolute;
}
.Checkbox-visible {
	width: 16px;
	height: 16px;
	margin: 2px;
	background: #fff;
	border: 1px solid #797a80;
	border-radius: 4px;
}
.Checkbox > input {
	z-index: 1;
	opacity: 0;
	left: 50%;
	top: 50%;
	-webkit-transform: translatex(-50%) translatey(-50%);
	    -ms-transform: translatex(-50%) translatey(-50%);
	        transform: translatex(-50%) translatey(-50%);
	display: block;
	cursor: pointer;
	width: 20px;
	height: 20px;
}
.Checkbox > input:checked + .Checkbox-visible {
	background: #1bb89a;
	border-color: #1bb89a;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMTQnIGhlaWdodD0nMTQnIHZpZXdCb3g9JzAgMCAxNCAxNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48dGl0bGU+d2hpdGU8L3RpdGxlPjxwYXRoIGQ9J001LjM3OCAxMS4zN0wyIDcuNTlsMS40MzgtMS4yODZMNS4zNzQgOC40N2w1LjE4NS01Ljg0TDEyIDMuOTFsLTYuNjIyIDcuNDYnIGZpbGw9JyNmZmYnLz48L3N2Zz4=);
}
.Checkbox > input:hover + .Checkbox-visible {
	border-color: #ccc;
}
.Checkbox > input:hover:checked + .Checkbox-visible {
	border-color: #1bb89a;
}
.Checkbox > input:focus + .Checkbox-visible {
	border-color: #797a80;
}
.custom-checkbox,
.custom-radio {
	line-height: 1.4;
}

.custom-control-input:disabled~.custom-control-label::before,
.custom-control-input:active~.custom-control-label::before,
.custom-control-label::before {
	background-color: #ffffff;
	border: 1px solid #797a80;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:checked~.custom-control-label::before {
	background-color: #27a28a;
	border: none;
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
	background-color: rgba(219, 9, 47, .5);
	border: none;
}

.login .custom-checkbox .custom-control-input:checked~.custom-control-label::before {
	background-color: #27a28a !important;
}

.custom-select {
	width: auto;
	height: 48px;
	border-radius: 4px;
	border: solid 1px #797a80;
	background: #FFF url("../images/icon_dropdown.svg") no-repeat right .5rem center;
	background-size: 18px 18px;
	border-color: #b7b7b7 !important;
}

.custom-select-group {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.custom-select:disabled {
	color: #302c2e;
	background-color: #ffffff;
	opacity: 0.5;
}
.region-select{
	padding-left: 4px;
	background: #FFF url("../images/icon_dropdown.svg") no-repeat right .5rem center;
	background-size: 10px 10px;
	padding: 6px 6px 6px 4px;
}
.form-invalid {
	position: relative;
}

.form-invalid input {
	padding-bottom: 20px;
	height: 54px !important;
}

.form-invalid .input-info {
	position: absolute;
	bottom: 0;
	padding: 0 0 4px 12px;
	color: #6e0518;
	font-size: 12px;
}

.col-form-label {
	line-height: 1.38;
	padding-top: 0;
	padding-bottom: 8px;
}

.pms-change-btn {
	text-transform: none !important;
	min-width: 120px !important;
	height: 40px !important;
	padding: 0 !important;
}

.pms-arrow-btn {
	border: none;
	outline: none !important;
	background: url("../images/icon_dropdown.svg");
	background-repeat: no-repeat;
	background-position: center;
	width: 18px;
	height: 18px;
	transform: translateY(-20%) rotate(-90deg);
	margin-top: 8px;
	cursor: pointer;
	transition: 0s;
}

.pms-arrow-btn[aria-expanded="true"] {
	transform: translateY(-20%) rotate(0deg) !important;
    transition: 0.1s;
}

.pms-arrow-btn.pms-rotate {
	transform: translateY(-20%) rotate(0deg);
	transition: 0.1s;
}
/*4.2 Dropdown*/
#dropdown-menu {
	padding: 0;
	position: absolute;
	transform: translate(-195px, 50px) !important;
	border-radius: 0;
	border: 1px solid rgb(218, 217, 217);
	box-shadow: 2px 2px 5px grey;
}

.pms-outline {
	outline: none !important;
}

#pms-select-menu {
	padding: 0;
	position: absolute;
	transform: translate(-280px, 40px) !important;
	border-radius: 0;
	border: 1px solid rgb(218, 217, 217);
	box-shadow: 2px 2px 5px grey;
	box-sizing: border-box;
}

.pms-view-dropdown-1 {
	min-width: 100px !important;
	width: 100px;
	height: 78px !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	transform: translate(2px, 50%) !important;
	border-radius: 0 !important;
	padding: 0 !important;
}

.pms-view-dropdown-2 {
	min-width: 100px !important;
	width: 100px;
	height: 78px !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	transform: translate(-60px, 50%) !important;
	border-radius: 0 !important;
	padding: 0 !important;
}

.pms-select-item {
	cursor: pointer;
	height: 58px !important;
	width: 320px !important;
}

.pms-item-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.pms-select-item:hover {
	border-left: 4px solid #db092f;
	background: #f8ced5;
}

.pms-select-item:hover .pms-txt,
.pms-select-item:hover .pms-title-txt {
	color: #db092f;
}

.dropdown-with-icon {
	padding-left: 32px !important;
}

.icon-dropdown {
	position: absolute;
	width: 16px;
	height: 16px;
	left: 12px;
}

.icon-dropdown.icon-delete {
	background-image: url("/image/icon-delete.svg");
}

a:hover .icon-dropdown.icon-delete {
	background-image: url("/image/icon-delete_hover.svg");
}

.icon-dropdown.icon-add-category {
	background-image: url("/image/icon-add-category.svg");
}

a:hover .icon-dropdown.icon-add-category {
	background-image: url("/image/icon-add-category_hover.svg");
}

.icon-dropdown.icon-add-child {
	background-image: url("/image/icon-add-child-category.svg");
}

a:hover .icon-dropdown.icon-add-child {
	background-image: url("/image/icon-add-child-cartegory_hover.svg");
}

.icon-dropdown.icon-rename {
	background-image: url("/image/icon-rename.svg");
}

a:hover .icon-dropdown.icon-rename {
	background-image: url("/image/icon-rename_hover.svg");
}

/*4.6 Badge*/
.badge-success {
	height: 24px;
	font-size: 12px;
	padding: 3px 16px;
	background: #43c10b;
	line-height: 1.5;
	font-weight: normal;
}

.badge-inactive {
	height: 24px;
	font-size: 12px;
	padding: 3px 16px;
	background: #959ea6;
	line-height: 1.5;
	font-weight: normal;
	color: white;
}

.badge-active {
	height: 24px;
	font-size: 12px;
	padding: 3px 16px;
	background: #00a273;
	border-color: #6e0518;
	line-height: 1.5;
	font-weight: normal;
	color: white;
}


.badge-warning {
	height: 24px;
	font-size: 12px;
	background: #c1660b;
	padding: 3px 16px;
	line-height: 1.5;
	color: white;
	font-weight: normal;
}

/* 4.7 Pagination */
.page-link {
	min-width: 32px;
	height: 32px;
	margin-left: 8px;
	border-radius: 4px;
	padding: 5px 10px;
	color: #797a80;
	border-color: #e9ecef;
}

.page-link:hover {
	color: #797a80;
	border-color: #797a80;
	background-color: #fff;
}


.page-link.active,
.page-item.active .page-link {
	background-color: #1bb89a;
	border-color: #1bb89a;
	color: #fff !important;
}
/* 4.9 Nav */

.admin .nav-link {
	border: none;
	color: #868e96;
}

.admin .nav-link:hover {
	border: none;
	color: #302c2e;
}

.admin .nav-link.active {
	border-bottom: solid 3px #1bb89a;
	color: #495057;
}

.admin .nav-item {
	margin-bottom: 0;
}
/* 4.10 Tab */

/* 4.14 Component - Button */
.btn {
	transition: 0.2s ease-in-out;
	height: 40px;
	font-size: 16px;
	padding: 6px 12px;

	transition: 0s;
}

.btn-chart{
	font-size:14px;
	padding:5px 12px;
}

.btn-primary {
	background-color: #db092f;
	text-transform: uppercase;
	border-color: #db092f;
	height: 48px;
	padding: 12px;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
	color: #fff;
	background-color: #6e0518;
	border-color: #6e0518;
	box-shadow: #6e0518;
}

.btn-primary:hover {
	background-color: #6e0518;
	border-collapse: #6e0518;
	border-color: #6e0518;
}

.btn-primary.disabled,
.btn-primary:disabled {
	background-color: #db092f;
	border-color: #db092f;
	opacity: 0.5;
}

.btn-secondary {
	background-color: #656565;
	border-color: #656565;
	text-transform: uppercase;
	height: 48px;
	padding: 12px;
}

.btn-icon {
	width: 48px;
	height: 48px;
	background-color: #ffffff;
	border-color: #b7b7b7;
	color: #b7b7b7;
	padding: 10px;
	border-radius: 8px;
}

.btn-icon:hover {
	color: #b7b7b7;
}

.btn-sm {
	text-transform: none !important;
	height: 40px;
	padding: 6px 12px;
}

.btn-back {
	position: absolute;
	left: 16px;
	width: 16px;
	top: 50%;
	height: 20px;
	width: 20px;
	background: url(./img/icon-back.svg);
	border: none;
	background-repeat: no-repeat;
	transform: translateY(-50%);

}

.pms-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.btn-search {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	display: block;
	width: 16px;
	height: 16px;
	background: url(./img/icon-search.svg);
	cursor: pointer;
	border: none;
}

.pms-btn-menu {
	position: absolute;
	right: 16px;
	top: 24px;
	width: 32px;
	height: 32px;
	background-color: white;
	border: none;
	outline: none;
}

.pms-btn-none {
	border: none;
	background: transparent;
	cursor: pointer;
}

.pms-btn-more {
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #656565;
}

.pms-btn-more::after {
	content: '';
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #656565;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.pms-btn-more::before {
	content: '';
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #656565;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}

.pms-arrow-down {
	position: absolute;
	top: 45%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
	display: block;
	width: 10px;
	height: 10px;
	background: black;
}

.pms-arrow-up {
	position: absolute;
	top: 55%;
	right: -15%;
	transform: translateY(-50%) rotateX(0deg);
	display: block;
	width: 12px;
	height: 12px;
	background-image: url("/image/icon-white-dropdown.svg");
	background-repeat: no-repeat;
	background-position: center;
	transition: 1s;
}

.pms-arrow-up.pms-change {
	transition: 1s;
	transform: translateY(-50%) rotateX(180deg);
}

.pms-arrow-down::after {
	content: '';
	width: 10px;
	height: 15px;
	position: absolute;
	top: 0;
	left: 0;
	transform: rotate(45deg) translate(-75%, -15%);
	background: white;
}

.pms-under {
	height: 8px;
	background: #f0f2f2;
}

.btn-menu {
	position: absolute;
	left: 16px;
	top: 50%;
	display: block;
	width: 24px;
	border-top: 2px solid white;
	cursor: pointer;
}

.btn-menu::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 7px;
	display: block;
	width: 24px;
	border-top: 2px solid white;
}

.btn-menu::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -7px;
	display: block;
	width: 24px;
	border-top: 2px solid white;
}

.pms-filter-btn.pms-active {
	transition: .5s;
	background-color: #db092f;
	border-color: #db092f;
}
.pms-filter-select.pms-active {
	transition: .5s;
	background-color: #ffffff;
}
.pms-top-menu {
	list-style: none;
	display: flex;
	padding: 0;
	margin: 0 16px;
}

.pms-top-menu-item {
	padding: 8px 0;
	margin-right: 16px;
}

.pms-text-item {
	color: #302c2e;
	line-height: 1.5;
}

.pms-text-item:hover {
	text-decoration: none;
}

.pms-active-item {
	font-weight: 600;
	border-bottom: #db092f 3px solid;
}

.pms-top-menu-item:last-child {
	padding: 8px 0;
	margin-right: 0;
}

/* 4.15 Component - Panel */
.panel {
	border-radius: 8px;
	background-color: #ffffff;
	padding: 48px;
	padding: 40px;
}
/* 4.18 Modal Setting */

.modal{
	min-width: 300px;
	border-color: #c6c9cc;
}
.modal-header .close{
	padding: 8px 16px 8px 8px;
}
.close{
	font-size: 2rem;
}
.modal-footer{
	padding: 16px 0;
	margin: 0 32px;
}
/* 4.19 Media */
.admin-media.active .thumbnail img {
	width: 158px;
	height: 158px;
	padding: 1px;
}

.admin-media .thumbnail img {
	width: 160px;
	height: 160px;
	padding: 1px;
}

.admin-media {
	width: 160px;
}

.admin-media.active .thumbnail {
	border: 1px solid #db092f;
}

.admin-media.active .thumbnail::before {
	content: '';
	background-image: url(./img/icon-check-active.svg);
	position: absolute;
	top: 0px;
	left: 0px;
	width: 22px;
	height: 22px;
	z-index: 10;
}

/*4.20 Table*/

.table {
	color: #302c2e;
}

.table thead {
	background: #f4f5f6;
	color: #302c2e;
}

/* .table tbody tr:nth-child(even) {
	background: #f0f2f2;
} */

tr {
	height: 54px;
	line-height: 1.5;
}

.custom-table tr {
	height: 40px;
	line-height: 1.5;
}				  
tbody>tr {
	background-color: #ffffff;
}
.pms-select-tr {
	background: #FBE5E9;
}

.table {
	margin-bottom: 0px;
}

.modal-title {
	font-weight: 600;
}

.tr-active.pms-select-tr {
	background: #EDD9DD;
}

.table-vertica-middle td{
    vertical-align: top !important;
}

.pms-btn-view {
	height: 40px;
	width: 100%;
	text-transform: none;
	line-height: 0.5;
}

.pms-left {
	position: absolute;
	height: 30px;
	width: 1px;
	background: rgba(255, 255, 255, .2);
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.pms-down-arrow {
	position: absolute;
	width: 12px;
	height: 30px;
	background-image: url("/image/icon-white-dropdown.svg");
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.pms-border {
	border: 1px solid black;
}

.table td, .table th{
	padding-left: 8px;
	padding-right: 8px;
}
.table td {
	padding: 8px;
	vertical-align: middle;
}
.table td.tb-checkbox{
	padding: 8px 0px 8px 8px;
}
.table .tb-arrow {
	width: 32px;
	padding: 8px 4px 8px 8px;
	vertical-align: middle;
}
.table.table-striped tr.odd{
	background-color: #f0f2f2;
}
.table.table-striped tr.even{
	background-color: #ffffff;
}
.pms-table-title {
	border-left: 4px solid #1bb89a;
	padding: 0px 16px;
	box-sizing: border-box;
	position: relative;
	box-sizing: border-box;
	line-height: 0.9;
	color: #302c2e;
	font-size: 22px;
}
.table .sort{
	position: relative;
	display: inline;
	top: 2px;
}
.table .sort .down{
	font-family: 'Font Awesome\ 5 Free';
	content: "\f0dd";
	font-weight: 700;
	font-size: 14px;
	height: 22px;
	top: 0;
	position: absolute;
}
.table .sort .up{
	font-family: 'Font Awesome\ 5 Free';
	content: "\f0de";
	font-weight: 700;
	font-size: 14px;
	height: 22px;
	bottom: 0;
}
.table .collapsing{
	transition: 0s;
}
/* 4.23 Component - List Group */
.my-page .list-group {
	border-radius: 0;
	border: 1px solid #cbc7c9;
}

.my-page .list-group-item {
	padding: 14px 24px 14px 32px;
	border-radius: 0;
	font-size: 20px;
	border-right: none;
	min-height: 80px;
}

.my-page .list-group-item svg .cls-1 {
	fill: #7d7277;
}

.my-page .list-group-item svg .class-3 {
	stroke: #7d7277;
}

.my-page .list-group-item.active,
.my-page .list-group-item:not(:disabled):not(.disabled):hover {
	background-color: #fce8eb;
	border-left: 4px solid #db092f !important;
	color: #DB092F;
	border-color: #cbc7c9;
}

.my-page .list-group-item:disabled,
.my-page .list-group-item.disabled {
	opacity: 0.5;
}

.my-page .list-group-item:not(:disabled):not(.disabled).active svg .cls-1,
.my-page .list-group-item:not(:disabled):not(.disabled):hover svg .cls-1 {
	fill: #DB092F;
}

.my-page .list-group-item:not(:disabled):not(.disabled).active svg .class-3,
.my-page .list-group-item:not(:disabled):not(.disabled):hover svg .class-3 {
	stroke: #DB092F;
}

.my-page .list-group-item:last-child {
	border-bottom: none;
}

.my-page .list-group-item:first-child {
	border-top: none;
	border-bottom: 1px solid #cbc7c9 !important;
}

/*4.35 Radio*/
.pms-radio-position {
	position: absolute;
	top: 0;
	right: 0;
}

.admin .list-group-item {
	border: none;
	padding: 0;
	background-color: #ffffff;
}

.admin .list-group-item,
.admin .list-group a {
	color: #302c2e;
	text-decoration: none;
}
.admin .list-group .d-flex{
	padding: 16px;
}
.list-group-item.active{
	z-index: inherit;
}
.admin .list-group>.d-flex:hover, .admin .list-group>.d-flex:hover>a,
.list-group>.d-flex:hover>div>a,.admin .list-group-item.active>.d-flex,
.admin .list-group-item.active>.d-flex>div>a, .admin .list-group-item.active>.d-flex>a{
	color: #db092f;
	background-color: #fce8eb;
}

.admin .list-group a.dropdown-toggle {
	padding-left: 0 !important;
}
.admin .list-group ul{
	padding-inline-start: 0;
}
.admin .list-group a {
	padding-left: 24px;
}

.list-group > ul {
	padding-left: 0px;
}

.admin .list-group .sub-lv1 a {
	padding-left: 40px;
}

.admin .list-group .sub-lv2 a {
	padding-left: 80px;
}

.admin .list-group .sub-lv3 a {
	padding-left: 120px;
}

.admin .list-group-item {
	align-items: center;
	border-radius: 0;
	width: 100%;
}

.admin .list-group i.fa-caret-down {
	margin-right: 8px;
}

.admin .list-group i.fa-caret-down[aria-expanded="true"] {
	transition: 0.1s;
}

.admin .list-group i.fa-caret-down[aria-expanded="false"] {
	transform: rotate(-90deg);
	transition: 0.1s;
}

.admin .list-group .dropdown-toggle::after,
.admin .dropdown-toggle::after {
	display: none !important;
}

.admin .list-group .dropdown-menu,
.admin .dropdown-menu {
	border-radius: 10px;
	padding: 0;
	border-color: #797a80;
}

.admin .list-group .dropdown-menu .dropdown-item,
.admin .dropdown-menu .dropdown-item {
	background-color: #fff;
	color: #302c2e;
	padding: 10px 12px;
	margin-left: 0px;
	width: 100%;
}
.dropdown-menu-right{
	background-color: #fff !important;
}

.admin .list-group .dropdown-menu .dropdown-item .cl-1 .cls-1,
.admin .list-group .dropdown-menu .dropdown-item .cl-2 .cls-2 {
	fill: #302c2e;
}

.admin .list-group .dropdown-menu .dropdown-item .cl-1st .cls-1,
.admin .list-group .dropdown-menu .dropdown-item .cl-2st .cls-2 {
	stroke: #302c2e;
}

.admin .list-group .dropdown-menu .dropdown-item:hover .cl-1 .cls-1,
.admin .list-group .dropdown-menu .dropdown-item:hover .cl-2 .cls-2 {
	fill: #db092f;
}

.admin .list-group .dropdown-menu .dropdown-item:hover .cl-1st .cls-1,
.admin .list-group .dropdown-menu .dropdown-item:hover .cl-2st .cls-2 {
	stroke: #db092f;
}

.admin .list-group .dropdown-menu .dropdown-item:hover:not([disabled]),
.admin .dropdown-menu .dropdown-item:hover:not([disabled]) {
	background-color: #1bb89a;
	color: #ffffff;
}


.admin .list-group .dropdown-menu .dropdown-item[disabled],
.admin .dropdown-menu .dropdown-item[disabled]{
	opacity: 0.7;
}

.admin .dropdown-item:last-child {
	border-bottom: none;
}

.admin a.dropdown-toggle {
	color: #302c2e;
}

.pms-my-filter {
	position: absolute;
	display: block;
	background: url(./img/icon-filter.svg);
	width: 16px;
	height: 16px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


/* 4.36 Component - Cards */
.card {
	border-radius: 0;
	border-color: #cbc7c9;
}

.card-header {
	background-color: #fff;
	font-size: 20px;
	border-color: #e5e3e4;
}

/* 4.37 Component - Breadcrumb */
.breadcrumb {
	background-color: #fff;
	font-size: 40px;
	font-weight: 700;
	color: #797a80;
	padding: 24px 40px;
	margin-bottom: 0;
}

.breadcrumb .breadcrumb-item.active {
	color: #302c2e;
}
/* 4.38 Grid */
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{
	padding-right: 16px;
	padding-left: 16px;
}
.row{
	margin-right: -16px;
	margin-left: -16px;
}
.row-fixed{
	margin-right: -8px;
	margin-left: -8px;
}
.row-fixed .col,.row-fixed .col-1,.row-fixed .col-10,.row-fixed .col-11,.row-fixed .col-12,
.row-fixed .col-2,.row-fixed .col-3,.row-fixed .col-4,.row-fixed .col-5,.row-fixed .col-6,
.row-fixed .col-7,.row-fixed .col-8,.row-fixed .col-9,.row-fixed .col-auto,.row-fixed .col-lg,
.row-fixed .col-lg-1,.row-fixed .col-lg-10,.row-fixed .col-lg-11,.row-fixed .col-lg-12,.row-fixed .col-lg-2,.row-fixed .col-lg-3,
.row-fixed .col-lg-4,.row-fixed .col-lg-5,.row-fixed .col-lg-6,.row-fixed .col-lg-7,.row-fixed .col-lg-8,
.row-fixed .col-lg-9,.row-fixed .col-lg-auto,.row-fixed .col-md,.row-fixed .col-md-1,.row-fixed .col-md-10,
.row-fixed .col-md-11,.row-fixed .col-md-12,.row-fixed .col-md-2,.row-fixed .col-md-3,.row-fixed .col-md-4,
.row-fixed .col-md-5,.row-fixed .col-md-6,.row-fixed .col-md-7,.row-fixed .col-md-8,.row-fixed .col-md-9,
.row-fixed .col-md-auto,.row-fixed .col-sm,.row-fixed .col-sm-1,.row-fixed .col-sm-10,.row-fixed .col-sm-11,
.row-fixed .col-sm-12,.row-fixed .col-sm-2,.row-fixed .col-sm-3,.row-fixed .col-sm-4,.row-fixed .col-sm-5,
.row-fixed .col-sm-6,.row-fixed .col-sm-7,.row-fixed .col-sm-8,.row-fixed .col-sm-9,.row-fixed .col-sm-auto,
.row-fixed .col-xl,.row-fixed .col-xl-1,.row-fixed .col-xl-10,.row-fixed .col-xl-11,.row-fixed .col-xl-12,
.row-fixed .col-xl-2,.row-fixed .col-xl-3,.row-fixed .col-xl-4,.row-fixed .col-xl-5,.row-fixed .col-xl-6,
.row-fixed .col-xl-7,.row-fixed .col-xl-8,.row-fixed .col-xl-9,.row-fixed .col-xl-auto{
	padding-right: 8px;
	padding-left: 8px;
}
/* ::  7.0 Pages */
/* 7.4  Page - Login */
.container-login {
	background-color: #ffe082;
	min-height: 100vh;
	min-width: 100%;
	/* display: flex; */
	align-items: center;
	line-height: 1;
}

.container-user-account {
	background-color: #f0f2f2;
	min-height: 100vh;
	min-width: 100%;
	line-height: 1;
}

table img {
	cursor: pointer
}

.login {
	z-index: 100;
	color: #ffffff;
	width: 400px;
	margin: auto;
}

.login a {
	color: #ffffff;
}

.container-login .logo {
	width: 240px;
	height: 48px;
	margin-bottom: 40px;
}

.container-user-account .logo {
	width: 332px;
	height: 67px;
	margin-top: 40px;
	margin-bottom: 40px;
}

.container-user-account .bg-login {
	height: 413px;
	top: 147px;
}

.container-user-account .page-header {
	margin-top: 32px;
	margin-bottom: 16px;
	color: #fff;
	text-align: center !important;
}

.container-user-account .panel {
	width: 744px;
	margin-left: auto !important;
	margin-right: auto !important;
}

.multiselect-custom > ul > li:not(:last-child) {
	border-bottom: solid 1px #797a80;
}

.login .form-control {
	height: 48px;
	border: none;
	border-radius: 4px;
}

.pms-w-10{
	width: 12px;
	height: 12px;
}

.bg-login {
	position: absolute;
	height: 440px;
	width: 100%;
	background-color: #db092f;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.center-fixed {
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	position: absolute;
}

.btn-login {
	background-color: #302c2e;
	color: #ffffff;
	text-transform: uppercase;
}

.login .btn {
	padding: 12px;
	height: 48px;
	color: #ffffff;
}

.login-fixed {
	display: flex;
	position: relative;
	min-height: 640px;
}

.bg-container {
	height: 440px;
	padding: 0;
}

/* 7.5 Page-Admin */
.admin-tab {
	width: 300px;
}

.admin-tab-media {
	width: calc(100% - 300px);
}

.admin-category {
	margin-left: -28px;
	margin-right: -28px;
}

.admin-category-item {
	padding: 16px 28px;
}

.admin .tab-header {
	height: 56px;
	font-size: 24px;
	background-color: #e5e3e4;
	border-top: #cbc7c9 solid 1px;
	border-bottom: #cbc7c9 solid 1px;
	padding: 12px 40px 12px 40px;
	font-weight: 700;
}

.admin .admin-tab-content {
	padding-left: 40px;
	padding-right: 40px;
}
.admin-tab input:read-only {
	background-color: inherit !important;
	border: none;
	box-shadow: none;
	border-color: indianred;
	line-height: 1;
	padding: 0;
}

/* 7.6 Page-Mypage */
.mypage-header {
	border-bottom: #cbc7c9 solid 1px;
	padding: 80px 40px 32px 40px;
	text-align: center !important;
}

.mypage-header h1 {
	margin-bottom: 16px;
	font-size: 40px;
}

.mypage-container {
	padding: 80px 40px 16px 40px;
	text-align: center !important;
}

/* ::  8.0 Predefined CSS Setting
-------------------------------------------
	8.1 Predefined Classes */

.alert-danger {
	background-color: #6e0518;
	border-color: #6e0518;
	font-size: 14px;
	color: #ffffff;
	border-radius: 16px;
}

.flex-center-x {
	display: flex;
	justify-content: center;
}

.flex-center-y {
	display: flex;
	align-items: center;
}

.flex-middle {
	display: flex;
	align-items: center;
	justify-content: center;
}

.text-black {
	color: #302c2e;
}

.text-white {
	color: white;
}

.text-grey {
	color: #7d7277;
}

.text-danger {
	color: #db092f !important;
}

.text-danger-darker {
	color: #f95355;
	font-size: 14px;
}

.text-success {
	color: #00AD7C;
	color: #00A273;
	font-size: 14px;
}

.form-text {
	margin-top: 8px;
}

/* 8.1.1 Font size */
.f-s-8 {
	font-size: 8px;
}

.f-s-14 {
	font-size: 14px;
}

.f-s-16 {
	font-size: 16px;
}

.f-s-18 {
	font-size: 18px;
}

.f-s-20 {
	font-size: 20px;
}

.f-s-22 {
	font-size: 22px;
}

.f-s-24 {
	font-size: 24px;
}

.f-s-40 {
	font-size: 40px;
}

.f-s-48 {
	font-size: 48px;
}

.pms-font-s22 {
	font-size: 22px;
}

.pms-font-s16 {
	font-size: 16px;
}

.pms-font-s40 {
	font-size: 40px;
}

.font-weight-600 {
	font-weight: 600;
}

.z-10 {
	z-index: 10;
}

.t-147 {
	top: 147px;
}

.t-145 {
	top: 145px;
}

.t-136 {
	top: 136px;
}

.m-t-32 {
	margin-top: 32px;
}

.admin-panel > ul.list-group {
    padding-bottom: 0px;
}

.pms-drop-btn {
    border: none;
    outline: none !important;
    background: url("/image/icon-dropdown-red.svg");
    background-repeat: no-repeat;
    background-position: center;
    width: 10px;
    height: 10px;
    transform: translateY(-20%) rotate(-90deg);
    margin-top: 8px;
    cursor: pointer;
    transition: 0.1s;
}


.m-t-40 {
	margin-top: 40px;
}

.m-t-64 {
	margin-top: 64px;
}

.m-t-100 {
	margin-top: 100px;
}

.m-b-64 {
	margin-bottom: 64px;
}

.m-b-32 {
	margin-bottom: 32px;
}

.m-b-10 {
	margin-bottom: 10px;
}

.m-r-32 {
	margin-right: 32px;
}

.m-l-32 {
	margin-left: 32px;
}

.m-x--32 {
	margin-left: -32px;
	margin-right: -32px;
}
.m-x--16 {
	margin-right: -16px;
	margin-left: -16px;
}

.m-x-32 {
	margin-right: 32px;
	margin-left: 32px;
}

.m-y-32 {
	margin-top: 32px;
	margin-bottom: 32px;
}

.m-t-72 {
	margin-top: 72px;
}

.min-h-100v {
	min-height: 100vh;
}

.min-h-240 {
	min-height: 240px;
}

.pms-mx-12 {
	margin-left: 12px;
	margin-right: 12px;
}

/* .pms-content h5 {
	min-width: 200px;
} */

.pms-mt-32 {
	margin-top: 32px;
}

.pms-mb-32 {
	margin-bottom: 32px;
}

.pms-ml-32 {
	margin-left: 32px;
}

.pms-mr-32 {
	margin-right: 32px;
}

.pms-title-mb {
	margin-bottom: 32px;
}

.pms-top-title {
	flex: 1;
	border: 1px solid #b7b7b7
}

.pms-side-title {
	box-sizing: border-box;
	border: 1px solid #b7b7b7
}

.graph-area {
	min-height: 200px;
}

.flex-1 {
	flex: 1;
}

.cus-textarea {
	outline: none !important;
	border: none;
	box-shadow: #f8f9fa 0px 0px 5px;
	border-radius: 16px;
	resize: none;
	margin-top: 30px;
	background-color: #E2F0D9;
}

.pms-content-item {
	flex: 1;
	min-height: 200px;
	box-shadow: rgb(224 224 224) 0px 0px 5px;
}

.pms-show-mobile {
	display: flex;
}

.w-32 {
	width: 32px;
}

.h-176 {
	height: 176px;
}

.h-240 {
	height: 240px;
}

.h-216 {
	height: 216px;
}

.h-56 {
	height: 56px;
}

.h-64 {
	height: 64px;
}

.h-16 {
	height: 16px;
}

.h-22 {
	height: 22px;
}

.h-20 {
	height: 20px;
}

.h-32 {
	height: 32px;
}

.h-40 {
	height: 40px;
}

.h-48 {
	height: 48px;
}

.h-56 {
	height: 56px;
}

.h-68 {
	height: 68px;
}

.h-80 {
	height: 80px;
}

.h-88 {
	height: 88px;
}
.h-108{
	height: 108px;
}

.h-200{
	height: 200px !important;
}

.h-413 {
	height: 413px;
}

.w-40 {
	width: 40px;
}

.w-16 {
	width: 16px;
}

.w-22 {
	width: 22px;
}

.w-48 {
	width: 48px;
}

.w-56 {
	width: 56px;
}

.w-64 {
	width: 64px;
}

.w-btn {
	width: 100%;
}
.w-72{
	width: 72px;
}
.w-80 {
	width: 80%;
}

.w-102 {
	width: 102px;
}

.w-195 {
	width: 195px;
}

.w-240 {
	width: 240px;
}

.w-120 {
	width: 120px;
}

.w-160 {
	width: 160px;
}

.w-220 {

	width: 220px;
}

.w-238 {
	width: 238px;
}

.w-icon-180 {
	width: 180px;
}

.w-352 {
	width: 352px;
}

.w-440 {
	width: 440px;
}

.w-480 {
	width: 480px;
}

.w-744 {
	width: 744px;
}

.w-800 {
	width: 800px;
}
.w-900{
	width: 900px;
}
.minw-100{
	min-width: 100px;
}
.minw-156 {
	min-width: 156px;
}
.mw-232 {
	min-width: 232px;
}

.h-720 {
	height: 720px;
}

.pms-center-y {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
}

.border-grey {
	border-color: #7d7277;
}

.color-grey {
	color: #7d7277;
}

.pms-color-grey {
	color: #302c2e;
}

.color-red {
	color: #db092f;
}

.pms-font-bold-600 {
	font-weight: 600;
}

.pms-red-link {
	transition: .5s;
	color: #db092f;
}

.pms-red-link:hover {
	transition: .5s;
	color: #fd7890;
	text-decoration: none;
}

.pms-font-40 {
	font-size: 40px;
}

.pms-w-27 {
	width: 27%;
}

.pms-w180 {
	width: 25%;
}

.bg-popup-grey {
	background: #666666;
}

.bg-red {
	background: #db092f;
}

.bg-grey {
	background: #f0f2f2;
}

.bg-white {
	background: #ffffff !important;
}

.pms-item-grey-even:nth-child(even) {
	background: #f0f2f2;
}
.pms-dot-btn {
	width: 40px;
	height: 40px;
	border-radius: 4px !important;
	display: none;
}
.pms-dot {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: white;
}
.pms-dot::after {
	content: '';
	position: absolute;
	top: 50%;
	left: -200%;
	transform: translateY(-50%);
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: white;
}
.pms-dot::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 200%;
	transform: translateY(-50%);
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: white;
}

.pms-item-grey-odd:nth-child(odd) {
	background: #f0f2f2;
}

.border-color {
	border-color: #cbc7c9;
}

.border-top-red {
	border-top: 3px solid #db092f !important;
}

.border-bottom-grey {
	border-bottom: #cbc7c9 solid 1px;
}

.border-top-grey {
	border-top: #cbc7c9 solid 1px;
}

.border-right-grey {
	border-right: #cbc7c9 solid 1px;
	z-index: 10;
}

.border-bottom-white {
	border-bottom: #fff 1px solid;
}

.m-login {
	margin: -224px 0 0;
}

.hljs-wrapper {
	background: #f2f3f4;
	border-radius: 3px;
	position: relative;
}

.container-vh {
	min-height: 100vh;
}
.pms-select-btn {
	border-top-right-radius: 4px !important;
	border-bottom-right-radius: 4px !important;
	line-height: 1.15;
	height: 40px;
	width: 20px;
	text-align: center;
}

.the-span {
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -pre-wrap;
	white-space: -o-pre-wrap;
	word-wrap: break-word;
	word-break: break-all;
}

.title-modify-account:before {
	content: 'Modify My Account';
}

.p-l-8 {
	padding-left: 8px;
}

.p-r-4 {
	padding-right: 4px;
}

.p-r-40 {
	padding-right: 40px;
}

.p-r-0 {
	padding-right: 0px;
}

.px-32 {
	padding-right: 32px;
	padding-left: 32px;
}

.modal-body h1 {
	font-size: 32px;
}

.p-t-80 {
	padding-top: 80px;
}

.p-t-40 {
	padding-top: 40px;
}

.p-b-32 {
	padding-bottom: 32px;
}

.list-group.list-group-root {
	padding: 0;
	overflow: hidden;
}

.list-group.list-group-root a {
	color: #000000;
	font-size: 16px;
}

.list-group.list-group-root a:hover {
	background-color: #f8ced5;
	font-weight: 600;
	color: #db092f;
}

.list-group.list-group-root .list-group {
	margin-bottom: 0;
}

.list-group.list-group-root .list-group-item {
	border: #cbc7c9 solid 1px;
	height: 56px;
}

.list-group.list-group-root>.list-group-item:first-child {
	border: #cbc7c9 solid 1px;
}

.list-group.list-group-root>.list-group>.list-group-item {
	padding-left: 56px;
}


.word-break {
	word-break: break-word;
}

.border-popup-view {
	border: #797a80 solid 1px;
	border-radius: 4px;
	overflow: auto;
}
.view-fixed {
	height: 547px;
	overflow-y: hidden;
}
.hr-popup-view {
	border: #797a80 solid 2px;
	margin-top: 0;
	margin-bottom: 0;
}

.pms-display-tablet-collapse,
.pms-display-mobile-collapse {
	display: none;
}

.pms-auto-height {
	height: 0 !important;
	padding: 0 !important;
}
.pms-p-0 {
	padding: 0 !important;
	border: none !important;
}

.pms-margin-top {
	margin-top: 0;
}


.pms-display-btn {
	display: none;
}

.scroll-mh-320 {
	max-height: 320px;
}

.tooltip-inner {
    max-width: 350px;
    width: 350px;
}

.hr-color {
	border: #c6c9cc solid 1px;
}

.modal-scroll-h-560 {
	max-height: 560px;
	overflow: auto;
}

.modal-scroll-permission {
	max-height: 610px;
	overflow: auto;
}

.number-rounded-box {
	width: 18px;
    margin-right: 20px;
}

/* statistics utilaztion guide*/
.number-rounded-box .number-rounded {
    border: 1px solid;
    border-radius: 100%;
    width: 18px;
    height: 18px;
    text-align: center;
    font-size: 14px;
}

.table-of-content-group {
	display: flex;
	margin-bottom: 20px;
}


.we-insight ul {
	padding-inline-start: 0;
    margin-inline-start: 17px;
}

.we-insight ul>li {
	padding-left: 20px;
}
a.insight-link {
	color: blue;
	text-decoration: none;
}

.guideline-img {
	width: 100%;
    margin: 0 auto;
    padding: 0;
}

.guideline-img img{
	width: 100%;
}

.cl-blue {
	color: blue;
}

.table-of-content .clearfix {
	clear: both;
}

.insight-guideline p {
	margin-bottom: 5px;
}

.insight-guideline p:last-child {
	margin-bottom: 0px;
}

.text-blue {
	color: blue;
}

.insight-img {
	width: 100%;
	height: 400px;
}

.insight-img-mul {
	width: 100%;
	height: 400px;
}

.img-box:has(img.insight-img)
{
	text-align: center;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.modal-body::-webkit-scrollbar {
	display: none;
}
  
/* Hide scrollbar for IE, Edge and Firefox */
.modal-body {
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
}

.gr-guideline-item {
	margin-top: 40px;
}

.insight-modal-custom {
	max-width: 80%;
}
/* .insight-guidline-desc-under {
	margin-top: 10px;
} */

.black-text {
	color:#000;
}

.mb-10 {
	margin-bottom:  10px;
}					 
@media (max-width: 440px) {
	.login {
		width: 320px;
	}
}

@media (max-width: 1119px) {
	.mypage-container {
		padding: 80px 16px 16px 16px
	}
}
@media (min-width: 768px){
	.modal-lg {
		max-width: 660px;
	}
}

@media (min-width: 992px){
	.modal-lg {
		max-width: 882px;
	}
	.tb-arrow {
		display: none;
	}
}
@media (max-width: 991px) {

	.modal-permision {
		max-width: 100% !important;
	}

	.modal-permision1 {
		max-width: 100% !important;
	}

	.pms-title-mb {
		margin-bottom: 16px;
	}
	.pms-display-tilte {
		display: none;
	}

	.pms-content {
		padding: 16px;
	}

	.pms-hide-tablet-item {
		display: none;
	}

	.w-lg-340 {
		width: 340px;
	}

	.container-user-account .panel {
		width: 640px;
	}

	.t-lg-104 {
		top: 104px;
	}

	.admin-tab {
		width: 250px;
	}

	.admin-tab-media {
		width: calc(100% - 250px);
	}

	.page-sidebar-collapse .sidebar {
		left: 0px;
	}

	.content {
		margin-left: 0;
		transition: left .2s linear;
	}

	.sidebar {
		left: -300px;
		transition: left .2s linear;
	}

	.admin-media {
		width: 146px;
	}

	.admin-media .thumbnail img {
		width: 144px;
		height: 144px;
		padding: 1px;
	}

	.admin-media.active .thumbnail img {
		width: 142px;
		height: 142px;
		padding: 1px;
	}

	.admin .admin-tab-content {
		padding-left: 16px;
		padding-right: 16px;
	}

	.admin .tab-header {
		padding: 16px;
		font-weight: 600;
		font-size: 20px;
	}

	.admin-category {
		margin-left: -16px;
		margin-right: -16px;
	}

	.admin-category-item {
		padding: 16px;
	}

	.admin .list-group a {
		padding-left: 0px;
	}

	.admin .list-group .sub-lv1 a {
		padding-left: 24px;
	}

	.admin .list-group .sub-lv2 a {
		padding-left: 56px;
	}

	.admin .list-group .sub-lv3 a {
		padding-left: 96px;
	}

	.mypage-container {
		padding: 80px 16px 16px 16px
	}

	.breadcrumb {
		padding: 24px 16px;
	}

	.breadcrumb .breadcrumb-item {
		display: none;
	}

	.breadcrumb-item+.breadcrumb-item::before {
		display: none;
	}

	.breadcrumb .breadcrumb-item.active {
		display: inline;
		padding: 0;
	}

	.pms-auto-height {
		height: auto !important;
	}

	.pms-p-0 {
		padding: 16px 0px 16px 16px !important;
	}

	.pms-display-tablet-collapse {
		display: block;
	}

	.modal-md-view {
		max-width: 664px;
	}
	.m-b-md-16 {
		margin-bottom: 16px;
	}

}

@media (max-width: 820px) {
	.m-t-10 {
		margin-top: 40px;
	}
}						   
@media (max-width: 767px) {
	.pms-content {
		padding: 8px 16px;
	}
	.pms-display-btn {
		display: block;
	}

	.pms-display-text {
		display: none;
	}

	.pms-dot-btn {
		display: block;
	}

	.pms-action-btn {
		display: none;
	}

	.admin-panel {
		width: 100%;
	}

	.pms-hide-mobile-item {
		display: none;
	}

	.container-user-account .panel {
		width: 100vw;
		border-radius: 0;
	}

	.container-login .logo-md {
		margin-top: 8px !important;
		height: 42px;
		width: 139px;
		padding-top: 7px;
		padding-bottom: 7px;
	}

	.pms-title-mb {
		margin-bottom: 8px;
	}

	.mypage-header,
	.mypage-container {
		padding: 24px 16px 16px 16px;
	}

	.mypage-header h1 {
		font-size: 32px;
		font-weight: 700;
	}

	.bg-login.t-54 {
		top: 54px;
	}

	.container-login .logo {
		margin-bottom: 4px;
	}

	.page-header {
		font-size: 32px !important;
	}

	.f-s-md-20 {
		font-size: 20px;
	}

	.m-b-sm-16 {
		margin-bottom: 16px;
	}

	.m-t-md-4 {
		margin-top: 4px;
	}

	h1 {
		font-size: 32px;
	}

	h4 {
		font-size: 20px;
	}

	.btn-primary,
	.btn-secondary {
		height: 40px;
		padding: 6px 12px;
	}

	.title-modify-account:before {
		content: 'My Account';
	}

	.pl-md-16 {
		padding-left: 16px;
	}

	.pr-md-16 {
		padding-right: 16px;
	}

	.pr-md-16 {
		padding-right: 16px;
	}

	.rm-t-16 {
		margin-top: 16px;
	}

	.modal-body h1 {
		font-size: 32px;
	}

	.admin-tab {
		width: 100%;
	}

	.admin-tab-media {
		width: 100%;
	}

	.breadcrumb {
		padding: 16px 16px;
		font-size: 32px;
	}

	.container-user-account .logo {
		width: 139px;
		height: 28px;
		margin-top: 16px;
		margin-bottom: 16px;
	}

	.container-user-account .bg-login {
		top: 60px;
	}

	.container-user-account .page-header {
		margin-top: 8px;
		margin-bottom: 16px;
	}

	.panel {
		padding: 16px;
	}

	.w-md-108 {
		width: 108px;
	}

	.px-sm-16 {
		padding-left: 16px;
		padding-right: 16px;
	}

	.px-sm-0 {
		padding-left: 0;
		padding-right: 0;
	}

	.pms-margin-top {
		margin-top: 8px;
	}

	.pms-auto-height {
		height: auto !important;
	}

	.pms-p-0 {
		padding: 8px 16px !important;
	}

	.pms-display-tablet-collapse {
		display: none;
	}

	.pms-display-mobile-collapse {
		display: block;
	}

	.pms-page-title {
		font-weight: normal;
		font-size: 32px;
	}
	.modal-footer{
		padding: 16px 0;
		margin : 0 16px;
	}

}

@media (min-width: 767px) {
	.pms-show-mobile {
		display: none !important;
	}

	.collapse.dont-collapse-sm {
		display: block;
		height: auto !important;
		visibility: visible;
	}
}

@media (min-width: 576px) {
	.m-x-sm-32 {
		margin-left: 32px !important;
		margin-right: 32px !important;
	}

	.w-sm-180 {
		width: 180px;
	}
}

@media (max-width: 575px) {
	.resize-100 {
		width: 100% !important;
	}

	.w-480 {
		width: 90%;
	}

	.w-sm-320 {
		width: 320px;
	}

	.h-sm-180 {
		height: 180px;
	}

	.h-sm-146 {
		height: 146px;
	}

	.w-sm-42 {
		width: 42px;
	}

	.h-sm-42 {
		height: 42px;
	}

	.w-sm-150 {
		width: 150px;
	}

	.panel {
		padding: 16px;
	}

	.w-sm-50 {
		width: 50%;
	}

	.w-sm-100 {
		width: 100%;
	}

	.w-sm-30 {
		width: 30%;
	}

	.w-sm-32 {
		width: 32%;
	}
	.m-t-10 {
		margin-top: 10px;
	}	  
	.insight-modal-custom {
		max-width: 100%;
	}					
}

@media (max-width: 350px) {
	.header {
		width: 100% !important;
	}
}

@media only screen and (max-width:425px) {
	.pms-hide {
		display: none;
	}

	.pms-table-title {
		font-size: 18px;
		line-height: .9;
	}


	.mt-sm-16 {
		margin-top: 16px;
	}

	.h-sm-80 {
		height: 80px;
	}

	.content h1 {
		margin-top: 0 !important;
	}

	.rm-t-16 {
		margin-top: 16px;
	}

	.m-t-custom {
		margin-top: 100px !important;
	}		  
	.mb-sm-0 {
		margin-bottom: 0;
	}

	.modal-body h1 {
		font-size: 24px;
	}

	.modal-body .w-icon-180 {
		width: 80px;
	}

	.logo-register {
		background: url(./img/logo-mobile.png);
		background-repeat: no-repeat;
		background-position: center;
	}

	.f-s-sm-32 {
		font-size: 32px;
	}

	.mb-sm-16 {
		margin-bottom: 16px;
	}

	.p-t-sm-24 {
		padding-top: 24px;
	}

	.m-x-sm-0 {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.h-sm-48 {
		height: 48px;
	}

	.pb-sm-16 {
		padding-bottom: 16px;
	}

	.mr-sm-8 {
		margin-right: 8px !important;
	}
}

@media only screen and (max-width:375px) {
	.pms-table-title {
		font-size: 16px;
		line-height: 1.15;
	}

	.login {
		width: 280px;
	}

}

@media only screen and (max-width:320px) {
	.pms-table-title {
		font-size: 13px;
		line-height: 1.5;
	}
}

@media (max-width: 767px) and (min-width: 320px) {
	.insight-guidline-desc {
		margin-top: 30px;
	}

	.insight-guidline-desc-under {
		margin-top: 10px;
	}

	.insight-img {
		width: 100%;
		height: 350px;
	}

	.insight-img-mul {
		width: 100%;
		height:350px;
	}
	
	.revenue-img-short {
		height: 350px;
	}

	.guideline-img {
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}

	.gr-guideline-item {
		margin-top: 0px;
	}
}

@media (min-width: 768px) and (max-width: 1366px) {
	.insight-img {
		width: 100%;
		height: 300px;
	}

	.insight-img-mul {
		width: 100%;
		height:300px;
	}
	
	.revenue-img-short {
		height: 300px;
	}

	.guideline-img {
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}
}


.text-left {
	text-align: left !important;
}

b {
	line-height: 1.38;
}

/* .boxx {
	border: solid 1px #ffffff;
    position: relative;
    border-radius: 16px;
    background-color: #ffffff;
    padding: 16px;
    width: 100%;
    box-shadow: rgba(224, 224, 224, 1) 0px 0px 5px;
} */

.text-left {
	text-align: left !important;
}

b {
	line-height: 1.38;
}
