/*
#b1c2d9 / #3ecf8e
*/
/*--//////////////////////////////////////////////////////////////--*/
/*feature-box*/

.feature-box {
  position: relative;
  max-width: 10.5rem;
  padding: 1.5rem;
  color: #fff;
  text-align: center;
  display: inline-block;
  margin: 0 0.75rem 1.5rem;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  -webkit-box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
  -moz-box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
  box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
}

.feature-box i {
  font-size: 1.953rem;
  line-height: 3rem;
}

.feature-box p {
  margin-bottom: 0;
  color: #fff;
  font-weight: 700;
}

.feature-box span {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  background-color: #fff;
}

.feature-box span.badge-primary {
  color: #38ceea;
}

.feature-box span.badge-second {
  color: #fc3858;
}

.feature-box-primary {
  background-color: #38ceea;
}

.feature-box-second {
  background-color: #fc3858;
}
/*feature-box END*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*box_topic*/
.box_topic_wrap{
   width:100%;
   display: flex;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  justify-content: center !important;
  flex-wrap: wrap;
}
.box_topic{
   padding:5px;
   /*border:1px solid #81dcd6;*/
   border-radius:0;
   display:inline-block;
   width:210px;
}
.box_topic .box_topic_in{
   width:100%;
   height:80px;
   border:1px solid #f2f2f2;
   padding:5px 5px 5px 5px;
   position:relative;
   text-align:center;
   display: flex;
  justify-content: center;
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
}
.box_topicL {
    border:1px solid transparent;
    font-size: 20px;
    color: #000;
	width:20px;
	height:80px;
    background-color: transparent;
	  -webkit-transition: all 0.5s; /* Safari */
  transition: all 0.5s;
	display:flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  -ms-flex-flow:row;/*ie*/
  justify-content: center !important;
  align-items: center !important;

}

.box_topic_wrap .topic-iconbox{
    width:60px;height:60px;line-height:60px;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	  display:table-cell;
	  background-color:#d7f3fe;
	  text-align:center;
}


.box_topicR {
    border:1px solid transparent;
    color: #000;
	width:140px;
}

.box_topic .box_topic_in:hover{

}
/*
i.box_topic_icon {
    color: #7fdafc;
}
*/
.box_topic:hover i.box_topic_icon {
    color: #7fdafc;
}

.box_topic .title{
     height:40px;
     line-height:50px;
     font-size:15px;
	 font-weight:bold;
	 color: #000;
}


.box_topic .exp{
     font-size:13px;
	 color:#000;
}

.shadow3{
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
}
/*box_topic END*/
/*--//////////////////////////////////////////////////////////////--*/
/*--//////////////////////////////////////////////////////////////--*/
/*form-wizard */

.form-wizard {
	 width:100%;
	 position:relative;
	 min-height:200px;
	 padding-bottom:100px;
}
.form-wizard-step { 
	text-align:center;
	line-height:30px;
	position: relative;
	float: left;
	padding: 0 5px;
	opacity:0;
	-webkit-transition: opacity .15s ease-in-out;
	transition: opacity .15s ease-in-out;
}

.form-wizard-buttons{
   position:fixed;
   bottom:45px;
   width:300px;
   padding:10px 10px 10px 10px;
   left:50%;
   margin-left:-150px;
   background-color:#fff;
   border:5px solid #000;
}
.form-wizard-buttons .btn.hide{
	background-color:#999;
	border-color:#999;
	pointer-events: none;
}
.form-wizard-buttons .btn.stepbtn-prev{
   float:left;
}
.form-wizard-buttons .btn.stepbtn-next{
   float:right;
}

/*
.form-wizard-step-icon{
   cursor:pointer;
}
.form-wizard-step.active .form-wizard-step-icon{
  cursor: default;
}
*/
/** Form header Classic **/

.form-header-classic .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #fff; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-classic .form-wizard-step.activated .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #6753D8; 
	color: #6753D8; 
	line-height: 38px;
}
.form-header-classic .form-wizard-step.active .form-wizard-step-icon {
	width: 48px; 
	height: 48px; 
	margin-top: 0; 
	background: #6753D8; 
	font-size: 22px; 
	line-height: 48px;
}

.form-header-classic .form-wizard-step p { color: #ccc; }
.form-header-classic .form-wizard-step.activated p { color: #6753D8; }
.form-header-classic .form-wizard-step.active p { color: #6753D8; }

/** Form header Classic **/



/** Form header Modarn **/

.form-header-modarn .form-wizard-step{
	padding-top:10px !important;
	border:2px solid #fff;
	background:#ccc;
}
.form-header-modarn .form-wizard-step.active{
	background:#6753D8;
}
.form-header-modarn .form-wizard-step.activated{
	background:#6753D8;
}
.form-header-modarn .form-wizard-progress { 
	height: 0px; 
	display:none;
}
.form-header-modarn .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #777; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-modarn .form-wizard-step.activated .form-wizard-step-icon {
	background: #6753D8; 
	border: 1px solid #fff; 
	color: #fff; 
	line-height: 38px;
}
.form-header-modarn .form-wizard-step.active .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #fff; 
	color: #6753D8; 
	line-height: 38px;
}

.form-header-modarn .form-wizard-step p { color: #fff; }
.form-header-modarn .form-wizard-step.activated p { color: #fff; }
.form-header-modarn .form-wizard-step.active p { color: #fff; }

/** Form header Modarn **/



/** Form header Stylist **/

.form-header-stylist .form-wizard-step{
	position:relative;
	padding-top:10px !important;
	border:0px solid #fff;
	background:#ccc;
}
.form-header-stylist .form-wizard-step::before {
	content: '';
	position: absolute;
	left: 0%;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #ccc;
	clear: both;
	z-index: 999;
}
.form-header-stylist .form-wizard-step.active::after {
	content: '';
	position: absolute;
	right: -20px;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #6753D8;
	clear: both;
	z-index: 9999;
}
.form-header-stylist .form-wizard-step.activated::after {
	content: '';
	position: absolute;
	right: -20px;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #6753D8;
	clear: both;
	z-index: 9999;
}
.form-header-stylist .form-wizard-step.active{
	background:#6753D8;
}
.form-header-stylist .form-wizard-step.activated{
	background:#6753D8;
}
.form-header-stylist .form-wizard-progress { 
	height: 0px; 
	display:none;
}
.form-header-stylist .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #777; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-stylist .form-wizard-step.activated .form-wizard-step-icon {
	background: #6753D8; 
	border: 1px solid #fff; 
	color: #fff; 
	line-height: 38px;
}
.form-header-stylist .form-wizard-step.active .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #fff; 
	color: #6753D8; 
	line-height: 38px;
}

.form-header-stylist .form-wizard-step p { color: #fff; }
.form-header-stylist .form-wizard-step.activated p { color: #fff; }
.form-header-stylist .form-wizard-step.active p { color: #fff; }

/** Form header Stylist **/


.form-wizard .progress-bar {
	background-color: #6753D8;
}

.form-wizard-steps{ 
	margin:auto; 
	overflow: hidden; 
	position: relative; 
	margin-top: 20px;
}

.form-wizard-progress { 
	position: absolute; 
	top: 24px; 
	left: 0; 
	width: 100%; 
	height: 1px; 
	background: #ddd;
}
.form-wizard-progress-line { 
	position: absolute; 
	top: 0; 
	left: 0; 
	height: 1px; 
	background: #6753D8; 
}

.form-wizard fieldset { 
	width:100%;
	padding-top:20px;
	display: none; 
	text-align: left; 
	border:0px !important
}

.form-wizard .input-error { border-color: #6753D8;}
/*--form-wizard END--*
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/* Navbar */
.navbar.horizontal-layout {
width:100%;
background: #fff;
padding:0;margin:0;
/*
-webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
-moz-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08); 
*/
-webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28);
-moz-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28);
box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28); 
}
#page-container.page-header-fixed .navbar.horizontal-layout{
   position:fixed;
   top:0;left:0;
   z-index:99;
}
#page-container.page-header-scroll .navbar.horizontal-layout .nav-top{
    display:none;
}
#page-container.page-header-scroll .navbar.horizontal-layout .nav-top.keepshow{
    display:block;
}
.navbar.horizontal-layout .nav-top{
  width:100%;height:50px;
}
.navbar.horizontal-layout .nav-bottom{
  width:100%;height:60px;
  padding-bottom:5px 0 5px 0;
}

.navbar.horizontal-layout .topsearch{
      width:300px;
	  margin-top:10px;
}
.navbar.horizontal-layout .topsearch .form-control{
    border:0 !important;
	background-color:#f9f9f9;
}
.navbar.horizontal-layout .nav-bottom .submenu{
  min-width:100%;
  margin-top:-6px;
  display:flex;
  justify-content:space-between;
}
.navbar.horizontal-layout .nav-bottom .submenu-body{
  width:100%;
  display:flex;
  justify-content:space-around;
}


.nav-item .link-icon {
   margin-right:5px;
}
.navbar.horizontal-layout .nav-item:hover > .nav-link{
background: #f2f2f9; 
}

.navbar.horizontal-layout .nav-item > .nav-link {
  color: #223C61;
  width:100%;
text-align:center;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s; }

.navbar.horizontal-layout .navbar-menu-wrapper {
color: #000;
padding-left: 15px;
padding-right:0;
height:50px !important;
   display: flex;
  align-items: center !important;
  justify-content:flex-end !important;
}
.navbar.horizontal-layout .navbar-menu-wrapper .nav-item,.navbar.horizontal-layout .navbar-menu-wrapper .nav-item a{
height:30px;
line-height:30px;
margin:0;
}
.navbar.horizontal-layout .navbar-brand-wrapper {
width: 150px;
height: 50px; 
}


.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand {
font-size: 110%;
font-weight:bold;
line-height: 55px;
margin-right: 0;
padding:0 10px 0 10px; 
}
.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:active, .navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:focus, .navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:hover {
color: #424546; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo img {
max-width: 100%;
height: 50px;
margin: auto;
vertical-align: middle; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo-mini img {
width: auto;
max-width: 100%;
height: 35px;
margin-left: 0; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo{
   font-size:18px;
}
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo-mini{
   font-size:14px;
}
.navbar.horizontal-layout .nav-item{
padding:0;
}
.navbar.horizontal-layout .nav-item a{
padding:0 10px 0 10px
}
.navbar.horizontal-layout .nav-item,.navbar.horizontal-layout .nav-item a{
height:40px;
line-height:43px;
}


.navbar.horizontal-layout .navbar-menu-wrapper .nav-item a{
font-size:95%;
}

.navbar.horizontal-layout .navbar-menu-wrapper .navbar-nav .nav-item .nav-link {
vertical-align: middle; }
.navbar.horizontal-layout .navbar-menu-wrapper .navbar-nav .nav-item .nav-link i {
vertical-align: middle; }
.navbar.horizontal-layout .navbar-menu-wrapper .search-field .input-group-prepend .input-group-text, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-trigger .input-group-text {
border-radius: 50px 0 0 50px;
background: rgba(213, 220, 236, 0.15);
border: none; }
.navbar.horizontal-layout .navbar-menu-wrapper .search-field .form-control, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-input, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .dataTables_wrapper select, .dataTables_wrapper .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=text], .jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=text], .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.jsgrid .jsgrid-table .jsgrid-filter-row select,
.jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=number], .jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=number], .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single, .select2-container--default .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-selection--single, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single .select2-search__field, .select2-container--default .select2-selection--single .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-search__field, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .tt-hint, .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.tt-query, .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.typeahead {
width: 50%;
background: #f9f9fc;
border: none;
border-radius: 0 50px 50px 0; }


.rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .input-group-prepend .input-group-text, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-trigger .input-group-text {
border-radius: 0 50px 50px 0; }
.rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .form-control, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-input, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .dataTables_wrapper select, .dataTables_wrapper .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=text], .jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=text], .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.jsgrid .jsgrid-table .jsgrid-filter-row select,
.jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=number], .jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=number], .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single, .select2-container--default .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-selection--single, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single .select2-search__field, .select2-container--default .select2-selection--single .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-search__field, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .tt-hint, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.tt-query, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.typeahead {
border-radius: 50px 0 0 50px; }
.navbar.horizontal-layout .navbar-menu-wrapper .navbar-toggler {
display: none; }


.rtl .navbar.horizontal-layout .navbar-menu-wrapper {
padding-left: 0; }
.rtl .navbar.horizontal-layout .navbar-menu-wrapper .navbar-toggler {
padding-left: 0; }
.navbar.horizontal-layout .nav-bottom{
position: relative;
top: 0;
right: 0;
left: 0;
width: auto;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-transition-duration: 3s;
-moz-transition-duration: 3s;
-o-transition-duration: 3s;
transition-duration: 3s;
-webkit-transition-property: position, left, right, top, z-index;
-moz-transition-property: position, left, right, top, z-index;
-o-transition-property: position, left, right, top, z-index;
transition-property: position, left, right, top, z-index; }

.navbar.horizontal-layout .nav-bottom:not(.intop) {
   width:100%;
}
.navbar.horizontal-layout .nav-bottom .page-navigation {
display:flex;
justify-content:space-between;
position: relative;
width: 100%;
z-index: 99;
background: #f9f9fc;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
-webkit-transition-property: background, box-shadow;
-moz-transition-property: background, box-shadow;
-o-transition-property: background, box-shadow;
transition-property: background, box-shadow; }



.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item {
text-align: center; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.pointbg {
background-color:#000;color:#f2f2f2; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:last-child {
border-right: none; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon {
margin-right: 5px;
color: #464de4; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon.small {
font-size:10px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon.mini {
font-size:5px; vertical-align:middle;}
.rtl .navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon {
margin-right: 0;
margin-left: 10px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .menu-arrow {
margin-left: 5px;
font-size: 15px;
display: inline-block;
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
moz-transform-origin: center;
-o-transform-origin: center;
-ms-transform-origin: center;
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transition-duration: 0.25s;
-moz-transition-duration: 0.25s;
-o-transition-duration: 0.25s;
transition-duration: 0.25s; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .menu-arrow:before {
font: normal normal normal 24px/1 "Material Design Icons";
content: "\F35D";
font-size: inherit; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover .submenu {
display: block;
background: #f2f2f9; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover > .nav-link {
background: #f2f2f9; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover > .nav-link .menu-arrow {
-moz-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link {
background: linear-gradient(30deg, #464de4, #814eff);
color: #fff; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link .link-icon,
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link .menu-arrow {
color: #fff; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu {
display: none; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul {
list-style-type: none;
padding-left: 0; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li {
display: block;
line-height: 20px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li a,
.navbar.horizontal-layout .nav-bottom .submenu-ind-title.nav-item a{
display: block;
font-weight: 600;
color: #223C61;
text-decoration: none;
text-align: left;
margin: 4px 0;
text-overflow: ellipsis;
overflow: hidden;
max-width: 100%;
white-space: nowrap;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
-webkit-transition-property: background;
-moz-transition-property: background;
-o-transition-property: background;
transition-property: background;
border-radius: 6px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li a:hover {
background: rgba(70, 77, 228, 0.1); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li.active a {
background: rgba(70, 77, 228, 0.1); }
.navbar.horizontal-layout .nav-bottom .submenu-ind-title.nav-item .nav-link:hover {
background: rgba(70, 77, 228, 0.1); }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu {
position: relative;
top: -100%; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu-item {
padding: 15px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu-item {
position: absolute;
width: calc(100% - 1px);
left: 0;
right: 0;
top: 46px;
z-index: 999;
background: #f2f2f9;
border-top: none;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); } 

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu {
left: 0;
padding: 25px; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu {
position: absolute;
width: calc(100% - 1px);
left: 0;
right: 0;
top: 46px;
z-index: 999;
background: #f2f2f9;
border-top: none;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); } 
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu .category-heading {
font-weight: 600;
text-align: left;
color: #464de4;
height:40px;line-height:40px;
border-bottom: 1px solid rgba(213, 220, 236, 0.6); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu .category-heading a{
  color: #464de4 !important;
}

.rtl .navbar.horizontal-layout .nav-bottom .page-navigation {
padding-right: 0; }
.navbar.horizontal-layout .nav-bottom.header-toggled {
display: block; }
.navbar.horizontal-layout .nav-bottom.fixed-top {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999; }

.navbar.horizontal-layout .nav-bottom.fixed-top .page-navigation {
margin-bottom: 0;
border-bottom: none;
background: #fff;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); }


.navbar.horizontal-layout .menu-mini {
  height:30px;/*height 주지않을경우내부에 float-right들이잇으면 마진이생긴다*/
  padding-right:10px;
 display: none; 
}
.nav_main_top_in{
  width:100%;
  opacity:1;
	-webkit-transition: opacity .15s ease-in-out;
	transition: opacity .15s ease-in-out;
}
.nav_main_top_in.off{
  opacity:0;
}


/* Navbar END*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/* Icon Box -*/
.ico-box{
width:100%;
display:inline-block;
}
.ico-title{
line-height:55px;padding-left:5px;
text-align:left;
}

.ico-holder {
	float: left;
	width: 55px;
	height: 55px;
	line-height: 65px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: rgba(252,60,0,1);
	margin-right: 5px;
	font-size: 42px;
	color: #fff;
	text-align: center;
}
.ico-holder-nobak{width: 45px !important;background:none !important;text-align: left !important;margin-right: 0px !important;}
.ico-box h5 {
	font-size: 1em;
	line-height: 18px;
	color: #444;
	font-weight: bold;
	/*font-family: Arial, Helvetica, sans-serif;*/
	margin-bottom: 1em;
}


.ico-box__primary .ico-holder,.bgcolor__primary {
	background: rgba(252,60,0,1);
}


.ico-box__secondary .ico-holder,.bgcolor__secondary {
	background: #c4d208;
}


.ico-box__tertiary .ico-holder,.bgcolor__tertiary {
	background: #7fdbfd;
}


.ico-box__quaternary .ico-holder,.bgcolor__quaternary {
	background: #70b3d0;
}
.ico-body{clear:both;padding:0;}


.ico-box.ico-box-mini .ico-title{
line-height:35px;
}
.ico-box.ico-box-mini .ico-holder{
		width: 35px;
		height: 35px;
		line-height: 38px;
font-size:20px;
}


/* Icon Box / End */
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*card--------------------------------*/
.card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	border-radius: 0 !important;
	background-color: #fff;
	background-clip: border-box
}
.cardgroup_shadow .card{
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);

}

.card>hr {
	margin-right: 0;
	margin-left: 0
}
/*
.card>.list-group:first-child .list-group-item:first-child {
	border-top-left-radius:0;
	border-top-right-radius:0
}

.card>.list-group:last-child .list-group-item:last-child {
	border-bottom-right-radius:0;
	border-bottom-left-radius:0
}*/

.card-body {

}

.card-title {
	margin-bottom: .75rem
}
.card-btnwrap {
	position:absolute;
	bottom:0;
	height:50px;
	line-height:50px;
	width:100%;
   display: flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  justify-content: center !important;
}

.card-subtitle {
	margin-top: -.375rem;
	margin-bottom: 0
}

.card-text:last-child {
	margin-bottom: 0
}

.card-link:hover {
	text-decoration: none
}

.card-link+.card-link {
	margin-left: 1.25rem
}

.card-header {
	margin-bottom: 0;
	padding: .75rem 1.25rem;
	border-bottom: 0 solid rgba(0, 0, 0, .125);
	background-color: transparent
}

.card-header:first-child {
	border-radius: calc(.25rem - 0) calc(.25rem - 0) 0 0
}

.card-header+.list-group .list-group-item:first-child {
	border-top: 0
}

.card-footer {
	padding: .75rem 1.25rem;
	border-top: 0 solid rgba(0, 0, 0, .125);
	background-color: transparent
}

.card-footer:last-child {
	border-radius: 0 0 calc(.25rem - 0) calc(.25rem - 0)
}

.card-header-tabs {
	margin-right: -.625rem;
	margin-bottom: -.75rem;
	margin-left: -.625rem;
	border-bottom: 0
}

.card-header-pills {
	margin-right: -.625rem;
	margin-left: -.625rem
}

.card-img-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 1.25rem
}

.card-img {
	width: 100%;
	border-radius: calc(.25rem - 0)
}

.card-img-top {
	width: 100%;
	border-top-left-radius: calc(.25rem - 0);
	border-top-right-radius: calc(.25rem - 0)
}

.card-img-bottom {
	width: 100%;
	border-bottom-right-radius: calc(.25rem - 0);
	border-bottom-left-radius: calc(.25rem - 0)
}

.card-deck {
	display: flex;
	flex-direction: column
}

.card-deck .card {
	margin-bottom: 15px
}

@media (min-width:576px) {
	.card-deck {
		margin-right: -15px;
		margin-left: -15px;
		flex-flow: row wrap
	}
	.card-deck .card {
		display: flex;
		flex-direction: column;
		margin-right: 15px;
		margin-bottom: 0;
		margin-left: 15px;
		flex: 1 0
	}
}

.card-group {
	display: flex;
	flex-direction: column
}

.card-group>.card {
	margin-bottom: 15px
}

@media (min-width:576px) {
	.card-group {
		flex-flow: row wrap
	}
	.card-group>.card {
		margin-bottom: 0;
		flex: 1 0
	}
	.card-group>.card+.card {
		margin-left: 0;
		border-left: 0
	}
	.card-group>.card:not(:last-child) {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0
	}
	.card-group>.card:not(:last-child) .card-header,
	.card-group>.card:not(:last-child) .card-img-top {
		border-top-right-radius: 0
	}
	.card-group>.card:not(:last-child) .card-footer,
	.card-group>.card:not(:last-child) .card-img-bottom {
		border-bottom-right-radius: 0
	}
	.card-group>.card:not(:first-child) {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0
	}
	.card-group>.card:not(:first-child) .card-header,
	.card-group>.card:not(:first-child) .card-img-top {
		border-top-left-radius: 0
	}
	.card-group>.card:not(:first-child) .card-footer,
	.card-group>.card:not(:first-child) .card-img-bottom {
		border-bottom-left-radius: 0
	}
}

.card-columns .card {
	margin-bottom: .75rem
}

@media (min-width:576px) {
	.card-columns {
		column-count: 3;
		column-gap: 1.25rem;
		orphans: 1;
		widows: 1
	}
	.card-columns .card {
		display: inline-block;
		width: 100%
	}
}

.accordion>.card {
	overflow: hidden
}

.accordion>.card:not(:first-of-type) .card-header:first-child {
	border-radius: 0
}

.accordion>.card:not(:first-of-type):not(:last-of-type) {
	border-bottom: 0;
	border-radius: 0
}

.accordion>.card:first-of-type {
	border-bottom: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0
}

.accordion>.card:last-of-type {
	border-top-left-radius: 0;
	border-top-right-radius: 0
}

.accordion>.card .card-header {
	margin-bottom: 0
}

.card {
	/*
	transition: box-shadow ease .2s;
	box-shadow: 0 7px 14px 0 rgba(60, 66, 87, .1), 0 3px 6px 0 rgba(0, 0, 0, .07)
	*/
	border:1px solid #ccc;
}
.card.noborder{
	border:0;
}

.card .card-header {
	border-bottom: 0
	height:45px;
	line-height:45px;
	padding:0 10px 0 10px;
}

.card .card-header .card-title {
	font-weight:bold;
	margin-bottom: 0
}

.card .card-body {
	padding: .10px 20px 10px 15px;
}

.card .card-body.card-scroll {
	height: 350px
}

.card .card-body.card-scroll .scroll-bar {
	background-color: #1f263d
}

.card .card-footer {
	border-top: 1px solid #d3e0e9
}

.card:hover {
}

.card .card-media {
	position: relative;
    width:100%;
    height:160px;
	margin-bottom:20px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	display:flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  -ms-flex-flow:row;/*ie*/
  justify-content: center !important;
  align-items: center !important;

}

.card .card-media .card-iconbox {
      margin-top:30px;
      width:90px;height:90px;line-height:90px;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	  display:table-cell;
	  background-color:#d7f3fe;
	  text-align:center;

}
.card .card-media .card-iconbox .card-icon{
       font-size:20px;
	   margin-right:0;
}
.card .card-media .orderno{
    font-size:18px;
	font-weight:bold;
	width:20px;
	height:20px;line-height:20px;
	color:#ef7142;
	position:absolute;
	top:10px;
	left:10px;
	text-align:left;
	vertical-align:top;
	font-family: Arial, Helvetica, sans-serif;
}

.card .card-controls {
min-width:25px;height:45px;line-height:45px;
position:absolute;
right:0;
top:0;
padding-right:7px;
z-index: 2;
display: flex;
/*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
justify-content:flex-end !important;
}
.card .card-controls>a,.card .card-controls>.dropdown{
min-width:25px;
height:40px;line-height:40px;
margin-left:10px;
text-align:center;
}
.card .card-controls>.icon {
	font-family: 'Material Design Icons';
	font-size: 18px;
	line-height: inherit;
	margin: 0 2px;
	transition: opacity ease .2s;
	opacity: .4;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased
}

.card .card-controls>.icon:hover {
	opacity: 1
}

.card .card-controls .js-card-fullscreen:before {
	content: ''
}

.card .card-controls .js-card-refresh:before {
	content: ''
}

.card .card-controls .js-card-close:before {
	content: ''
}

.card .card-controls.card-controls-bottom {
	position: absolute;
	z-index: 2;
	top: unset;
	right: 1.25rem;
	bottom: .75rem;
	border-bottom-right-radius: calc(.25rem - 0);
	border-bottom-left-radius: calc(.25rem - 0)
}

.card .card-controls>.dropdown {
	display: inline-block
}

.card .card-controls>.dropdown>a .icon {
	font-size: 18px;
	transition: opacity ease .2s;
	opacity: .4
}

.card .card-controls>.dropdown>a .icon:hover {
	opacity: 1
}

.card.is-fullscreen {
	position: fixed;
	z-index: 9999;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0!important;
	border-radius: 0!important
}

.card.is-fullscreen .js-card-fullscreen:before {
	content: ''
}

.card-hover {
	transition: all ease .2s
}

.card-hover:hover {
}
/*//card--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*list-group------------------------------*/
.list-group {
	display: flex;
	flex-direction: column;
	margin-bottom: 0;
	padding-left: 0;
	width:100%;
}

.list-group-item-action {
	width: 100%;
	text-align: inherit;
	color: #32325d
}

.list-group-item-action:focus,
.list-group-item-action:hover {
	z-index: 1;
	text-decoration: none;
	color: #32325d;
	background-color: #f9fbfd
}

.list-group-item-action:active {
	color: #424770;
	background-color: #edf2f9
}

.list-group-item {
width:100%;
	position: relative;
	padding:10px 5px 10px 0;/*좌우는 .list-group.list-group-topnav .list-group-item과 동일해야한다!!!!!!!!!!!!!*/
	border-top: 1px solid #d3e0e9;
	border-bottom: 0;
	margin-top:1px;/*hover시 선사라진다*/
	background-color: #fff;
	display:inline-block;
	text-align:center;
}

.list-group-item.data_even {
	background-color: #fafafa;
}

.list-group-item .item-text-mpre{
      display:none;
	  white-space:nowrap;
}
.list-group-item.mpshow .item-text-mpre{
      display:inline-block;
}
.list-group-item:first-child {
	border-top-left-radius:0;
	border-top-right-radius:0
}

.list-group-item:last-child {
	margin-bottom: 0;
	border-bottom-right-radius:0;
	border-bottom-left-radius:0
}

.list-group-item.disabled,
.list-group-item:disabled {
	pointer-events: none;
	color: #95aac9;
	background-color: #fff
}

.list-group-item.active {
	z-index: 2;
	color: #fff;
	border-color: #6772e5;
	background-color: #6772e5
}


.list-group-flush .list-group-item{
	border-right: 0;
	border-left: 0;
	border-radius: 0
}

.list-group-flush .list-group-item:last-child {
	margin-bottom: -1px
}

.list-group-flush .list-group-item:first-child {
	border-top: 0
}

.list-group-flush .list-group-item:last-child {
	margin-bottom: 0;
	border-bottom: 0
}
.list-group-flush.topline .list-group-item:first-child {
	border-top: 1px solid #d3e0e9;
}
.list-group-flush.bottomline .list-group-item:last-child {
	border-bottom: 1px solid #d3e0e9;
}


.list-group-item-avatar{
  width:50px;
  height:50px;
  margin-right:10px;
}
.list-group-item-main{
width:100%;margin:0 auto;;
vertical-align:middle;
position:relative;
display: flex;
justify-content: space-between !important;
/*-ms-flex-flow:column nowrap;*** between 은 들어가면 안된다/*ie*/
flex-wrap:wrap;
}

.list-group-item-main.main-right{
   display: flex;
   /*-ms-flex-flow:column nowrap;/*ie도 들어가면안된다*/
  justify-content:flex-end;
}
.list-group-item-main.main-center{
   display: flex;
   justify-content:center;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
}
.list-group-item-ind{
   float:left;
   display: flex;
   justify-content:flex-start;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
   height:52px;
	 padding-left:5px;
	 padding-right:5px;
}


.list-group-item.textlist{
   padding-top:10px;
}
.list-group-item.textlist .list-group-item-ind{
   height:35px;
}

.list-group-item-ind.right,.list-group-item-ind.last{
   margin-right:0;
}


/*------------*/

.list-group-item-text{
   width:100%;
   text-align:left;
   /*flex 주면 ellipsis 안든는다 내부에 span class=cutstr 로 사용*/
    display: flex;
    align-items: center !important;
    -ms-flex-flow: row;
}
.list-group-item-text.right{
   text-align:right;
  justify-content:flex-end !important;
}
.list-group-item-text.center{
   text-align:center;
  justify-content:center !important;
}

.list-group-item-wrstr{
   display: flex;
   /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-end !important;
}
/*------------*/


.list-group-item-icon{
  width:20px;
  color:#aaa;
  text-align:center;
}

.list-group-item-icon.pre{
width:14px;
  margin-left:3px;
  margin-right:0;
}

/*
list-group-item-main 에 리스트에들어갈 ind의 갯수애 따라 %를 정해주고 각 media 마다 가변성을 주어서
각 ind의 max가 일정하도록 해준다 ind갯수합이 80%이내로 들어오게 할것 ind1은 95%
각 ind에서 개별적 minwidth를 주어 조절한다
각리스트 만들기시 주의!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
768 의경우 실제 soqn width 는 670 정도 이다
여기에 ind4 로 4개를 넣는데 subject가 있는 list-group-item-ind.subject 가 css에서 기본230 이면
나머지list-group-item-ind 3개는 총합 (670-230)내에서 각 minwidth 를 줘야 768까지 wrap안되게 된다!!!!
*/
.list-group-item-ind{
   text-align: left;
}
 
.list-group-item:not(.table) .list-group-item-main.ind10 .list-group-item-ind{
    width:8%;
}
.list-group-item:not(.table) .list-group-item-main.ind7 .list-group-item-ind{
    width:11%;
}
.list-group-item:not(.table) .list-group-item-main.ind6 .list-group-item-ind{
    width:13%;
}
.list-group-item:not(.table) .list-group-item-main.ind5 .list-group-item-ind{
    width:16%;
}
.list-group-item:not(.table) .list-group-item-main.ind4 .list-group-item-ind{
    width:20%;
}
.list-group-item:not(.table) .list-group-item-main.ind3 .list-group-item-ind{
    width:26%;
}
.list-group-item:not(.table) .list-group-item-main.ind2 .list-group-item-ind{
    width:40%;
}
.list-group-item:not(.table) .list-group-item-main.ind1 .list-group-item-ind{
    width:95%;
}

.list-group-item-ind.wauto,.list-group-item-ind.wauto .list-group-item-text{
    width:auto !important;
 }

/*기본적으로 주고 필요시 각 ind에 width 준다*/
.list-group-item-ind.subject{
    min-width:230px;
	width:230px;
}



.list-group-item-text.dot,.list-group.dottext .list-group-item-text{
    padding-left:7px;/*아래 before의 margin-left와 같아야한다/ 음양만다름!!!!*/
}
.list-group-item-text.dot:before,.list-group.dottext .list-group-item-text:before 
 {
    content: '';
    height: 14px;
    border: 1px solid #7fdafc;
    border-width: 0 1px 0 1px;
	margin-right:5px;
}


.list-group-item-text-preview{
   width:100%;
   padding-top:10px;
   overflow:hidden;
   text-overflow: ellipsis;
   white-space:nowrap;
   color:#999;
}

.list-group-item-order{
   width:20px;height:20px;
   line-height:20px;
   margin-top:2px;
   background-color:#b0e8fd;
   text-align:center;
   font-weight:bold;
}

.list-group-item-ind.subject .list-group-item-text{
   display: flex;
  align-items: center !important;
    -ms-flex-flow:row;/*ie*/
}

.list-group-item-ind.right{
	float:right;
	justify-content:flex-end;
}


.list-group-item-ind .custom-control{
	margin-top:-5px;
}
/*---*/
.list-group-item.feature{
	width:100%;
	background-color:#f5f5f6;
}

.list-group-item.feature .list-group-item-main{
   width:100%;
   display: flex;
   justify-content:center !important;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  flex-wrap:wrap;
}


.list-group-item.feature .list-group-item-ind{
  height:auto;
}

.list-group-item.feature .list-group-item-ind.subject{
     width:150px;
	 min-width:150px;
	 text-align:center;
}
.list-group-item.feature .list-group-item-ind.body{
   width:350px;
   max-width:100%;
   text-align:left;
   padding-left:20px;
   padding-top:15px;
  display: flex;
  /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-start;
  flex-wrap:wrap;
}

.list-group-item.feature .list-group-item-ind.body .list-group-item-ind{
     width:100%;
	 margin-bottom:5px;	 
	 height:35px;
	  display: flex;
	  /*-ms-flex-flow:column nowrap;/*ie*/
	  justify-content:flex-start;
	  flex-wrap:wrap;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-text{
     width:auto !important;
	 display:inline-block !important;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-ind .list-group-item-icon{
     width:70px !important;
	 height:25px;line-height:25px;
	 margin-right:5px;
	 background-color:#7fdafc;
	 text-align:center;
	 color:#fff;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-ind .list-group-item-text{
     width:100%;
	 font-weight:bold;
	 padding-top:3px;
}

.list-group-item.feature .listimg{
   width:130px;
   height:130px;
   margin:0 auto;
}
/*-----*/
.list-group-item.table{
 padding-top:0;
 padding-bottom:0;
}
.list-group-item.table .list-group-item-main{
   /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-start !important;
}
.list-group-item.table:not(.dottext) .list-group-item-text.dot:before {
    border: 1px solid #ccc;
}

/*---*/
.list-group.list-group-topnav .list-group-item{
   height:35px;
   line-height:35px;
   padding:0; /*좌우는 .list-group-item과 동일해야한다!!!!!!!!!!!!!*/
}
.list-group.list-group-topnav .list-group-item-main{
   background-color:#f8f8f8;
}


.list-group.list-group-topnav .list-group-item-text{
   font-weight:bold;
   text-align:left;
   padding-left:10px;
}
/*---*/

.list-group-item-btn{
   margin-left:10px;
}

.list-group-item-btn.go:before{
    content: "\f105";
    font-family: FontAwesome;
    font-size: 30px;
	color:#000;
}

.list-group-item-primary {
	color: #363b77;
	background-color: #d4d8f8
}

.list-group-item-primary.list-group-item-action:focus,
.list-group-item-primary.list-group-item-action:hover {
	color: #363b77;
	background-color: #bec4f4
}

.list-group-item-primary.list-group-item-action.active {
	color: #fff;
	border-color: #363b77;
	background-color: #363b77
}

.list-group-item-secondary {
	color: #4d5869;
	background-color: #e1e7f0
}

.list-group-item-secondary.list-group-item-action:focus,
.list-group-item-secondary.list-group-item-action:hover {
	color: #4d5869;
	background-color: #d0d9e8
}

.list-group-item-secondary.list-group-item-action.active {
	color: #fff;
	border-color: #4d5869;
	background-color: #4d5869
}

.list-group-item-success {
	color: #206c4a;
	background-color: #c9f2df
}

.list-group-item-success.list-group-item-action:focus,
.list-group-item-success.list-group-item-action:hover {
	color: #206c4a;
	background-color: #b4edd3
}

.list-group-item-success.list-group-item-action.active {
	color: #fff;
	border-color: #206c4a;
	background-color: #206c4a
}

.list-group-item-info {
	color: #366e81;
	background-color: #d5f3fd
}

.list-group-item-info.list-group-item-action:focus,
.list-group-item-info.list-group-item-action:hover {
	color: #366e81;
	background-color: #bdecfc
}

.list-group-item-info.list-group-item-action.active {
	color: #fff;
	border-color: #366e81;
	background-color: #366e81
}

.list-group-item-warning {
	color: #7d5f27;
	background-color: #fbebcd
}

.list-group-item-warning.list-group-item-action:focus,
.list-group-item-warning.list-group-item-action:hover {
	color: #7d5f27;
	background-color: #f9e2b5
}

.list-group-item-warning.list-group-item-action.active {
	color: #fff;
	border-color: #7d5f27;
	background-color: #7d5f27
}

.list-group-item-danger {
	color: #7e2c2f;
	background-color: #fbcfd1
}

.list-group-item-danger.list-group-item-action:focus,
.list-group-item-danger.list-group-item-action:hover {
	color: #7e2c2f;
	background-color: #f9b7ba
}

.list-group-item-danger.list-group-item-action.active {
	color: #fff;
	border-color: #7e2c2f;
	background-color: #7e2c2f
}

.list-group-item-light {
	color: #818384;
	background-color: #fdfefe
}

.list-group-item-light.list-group-item-action:focus,
.list-group-item-light.list-group-item-action:hover {
	color: #818384;
	background-color: #ecf6f6
}

.list-group-item-light.list-group-item-action.active {
	color: #fff;
	border-color: #818384;
	background-color: #818384
}

.list-group-item-dark {
	color: #1a1a30;
	background-color: #c6c6d2
}

.list-group-item-dark.list-group-item-action:focus,
.list-group-item-dark.list-group-item-action:hover {
	color: #1a1a30;
	background-color: #b8b8c7
}

.list-group-item-dark.list-group-item-action.active {
	color: #fff;
	border-color: #1a1a30;
	background-color: #1a1a30
}
.lind-odd{
   background-color:#f9f9f9;
}
.line-even{
   background-color:#fefefe;
}

.list-group-more{
  float:right;
}
.list-noitem{
  width:100%;
  height:200px;
  padding-top:90px;
  text-align:center;
}

.list-group-tag{
   height:25px;
}
.list-parttag-wrap{
   white-space:nowrap;
   text-align:left;
   height:25px;
}
.list-parttag-ind{
   display:inline-block;
   width:25px;
   height:25px;
   line-height:25px;
   border:1px solid #ccc;
   margin-right:2px;
   text-align:center;
   color:#ccc;
}
.list-parttag-ind.on{
   border:1px solid #7fdafc;
   color:#000;
   font-weight:bold;
}


.list-parttag-wrap-exp{
   height:25px;
   width:100%;
   margin-top:15px;
   display: flex;
  justify-content: center !important;
}
.list-parttag-wrap-exp-ind{
   text-align:left;
   height:25px;
   border:1px solid #fe8f0d;
   border-width:0 0 1px 0;
   padding:0 5px 0 5px;
}
.list-parttag-wrap-exp-ind div{
   float:left;
}
.list-parttag-wrap-exp .list-parttag-ind{
  border:0;
  color:#000;
  width:14px;
  font-weight:bold;
}
.list-parttag-ind-exp{
   display:inline-block;
   height:25px;
   line-height:25px;
   margin-right:10px;
   text-align:center;
   color:#666;
}

.list-isicon{
   display:inline-block;
   width:25px !important;
   height:15px;
   line-height:10px;
   margin-left:2px;
   text-align:right;
   color:#7fdafc;
   position:relative;
 }
.list-isicon-img:before{
    content: "\f03e";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}
.list-isicon-video:before{
    content: "\f03d";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}
.list-isicon-doc:before{
    content: "\f15c";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}

.itemwrap-actbox{
   width:100%;
   display: flex;
   justify-content:flex-start;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
}

.itemwrap-actbox .btn-tr{
   background-color:transpaent !important;
}
.itemwrap-actbox .btn_minus:before,
.itemwrap-actbox .btn_plus:before{
   margin-right:0;
   color:#999;
}

.itemwrap-actbox .input_ws{
   width:50px;
}


@media (max-width: 900px){/*900  baseui.css / data_grids_main.css/nxgridbasic.css/siteind.css*/
	w900hide{
      display:none;
	}
	 .navbar.horizontal-layout .nav-bottom{
	   display:none;
	 }
	#page-container.page-header-scroll .navbar.horizontal-layout .nav-top{
		display:block;
	}

	.navbar.horizontal-layout .menu-normal {
	  display: none; 
	}
	.navbar.horizontal-layout .menu-mini {
	  display: block; 
	}

	.navbar.horizontal-layout .navbar-menu-wrapper {
       padding-top:7px;
	}
	.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand {
		line-height: 50px;
	}
}
@media (max-width:745px) {
  .list-group.list-group-topnav{
       display:none;
  }
}
@media (max-width:700px) {



}
@media (max-width:550px) {
    .smhide,#main_top_ban,#main_bot_ban{
        display:none !important;
	}
   .sm100{
      width:99% !important;
	  min-width:99% !important;
	  max-width:99% !important;
   }
   .sm80{
      width:80% !important;
	  min-width:80% !important;
	  max-width:80% !important;
   }
   .sm50{
      width:49% !important;
	  min-width:49% !important;
	  max-width:49% !important;
   }
   .sm30{
      width:33% !important;
	  min-width:33% !important;
	  max-width:33% !important;
   }
   

   .list-group-item{
     border-radius:6px;
	 margin-bottom:10px;
   }
	.list-group-item.data_odd{
       background-color:#fafafa;
	}

   .list-group-item-text.smleft{
     text-align:left;
    justify-content:flex-start !important;
   }

	.list-group-item.mshow .item-text-mpre{
		  display:inline-block;
	}


	.list-group-item.feature .list-group-item-ind.body{
	     margin-top:10px;
		 padding:10px 0 10px 0;
	     border:5px solid #f2f2f2;
		 border-width:5px 0 0 0;

	}

	.list-group-item.feature .list-group-item-ind.subject{
		 width:100% !important;
		 max-width:100%;
		 min-width:100%;
		 text-align:center;
		 padding-top:10px;
	}


     /*----------------*/
	.list-group.fix_sm2row .list-group-item-ind:first-child .list-group-item-text{
	    height:25px;line-height:25px;
		top:0;
		left:60px;
	}
	.list-group.fix_sm2row .list-group-item-ind:nth-child(2){
	    height:25px;line-height:25px;
		top:25px;
		left:60px;
		width:calc(50% - 25px ) !important;
		position:absolute;
		padding-left:0;padding-right:20px;
	}
	.list-group.fix_sm2row .list-group-item-ind:nth-child(3){
	    height:25px;line-height:25px;
		top:25px;
		right:0;
		width:calc(50% - 25px ) !important;
		position:absolute;
	}
     /*----------------*/


	.main_title_2.left{
          text-align:center;
	}
	.main_title_2.left span,.main_title_2.left span em{
        margin:0 auto;
	}

     /*----------------*/

	.ico-title{
	line-height:35px;padding-left:5px;
	text-align:left;
	}

	.ico-holder {
		float: left;
		width: 35px;
		height: 35px;
		line-height: 38px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		background: rgba(252,60,0,1);
		margin-right: 5px;
		font-size: 26px;
		color: #fff;
		text-align: center;
	}
	.ico-holder-nobak{width: 25px !important;background:none !important;text-align: left !important;margin-right: 0px !important;}

}

/*list-group----------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*avatar--------------------------------*/

.avatar {
	position: relative;
	display: inline-block
}

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

.avatar-title {
	display: flex;
	width: 100%;
	height: 100%;
	color: #fff;
	background-color: #b1c2d9;
	align-items: center;
	justify-content: center
}

.avatar-img:hover,
.avatar-title:hover {
	box-shadow: 0 0 0 2px #fff
}

.avatar-away::before,
.avatar-dnd::before,
.avatar-offline::before,
.avatar-online::before {
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	width: 30%;
	height: 30%;
	content: '';
	border: 3px solid #fff;
	border-radius: 50%;
	align-items: center;
	justify-content: center
}

.avatar-online::before {
	background-color: #3ecf8e
}

.avatar-away::before {
	background-color: #f0b64b
}

.avatar-dnd::before {
	background-color: #f2545b
}

.avatar-offline::before {
	background-color: #b1c2d9
}

.avatar {
	width: 3rem;
	height: 3rem
}

.avatar .border {
	border-width: 4px !important
}

.avatar .rounded {
	border-radius: 6px !important
}

.avatar .avatar-title {
	font-size: 18px
}

.avatar .avatar-away::before,
.avatar .avatar-dnd::before,
.avatar .avatar-offline::before,
.avatar .avatar-online::before {
	border-width: 2px
}

.avatar-xs {
	width: 1.625rem;
	height: 1.625rem
}

.avatar-xs .border {
	border-width: 2px !important
}

.avatar-xs .rounded {
	border-radius: 4px !important
}

.avatar-xs .avatar-title {
	font-size: 10px
}

.avatar-xs .avatar-away::before,
.avatar-xs .avatar-dnd::before,
.avatar-xs .avatar-offline::before,
.avatar-xs .avatar-online::before {
	border-width: 1px
}

.avatar-sm {
	width: 2.5rem;
	height: 2.5rem
}

.avatar-sm .border {
	border-width: 3px !important
}

.avatar-sm .rounded {
	border-radius: 4px !important
}

.avatar-sm .avatar-title {
	font-size: 13px
}

.avatar-sm .avatar-away::before,
.avatar-sm .avatar-dnd::before,
.avatar-sm .avatar-offline::before,
.avatar-sm .avatar-online::before {
	border-width: 2px
}

.avatar-lg {
	width: 4rem;
	height: 4rem
}

.avatar-lg .border {
	border-width: 3px !important
}

.avatar-lg .rounded {
	border-radius: 8px !important
}

.avatar-lg .avatar-title {
	font-size: 24px
}

.avatar-lg .avatar-away::before,
.avatar-lg .avatar-dnd::before,
.avatar-lg .avatar-offline::before,
.avatar-lg .avatar-online::before {
	border-width: 3px
}

.avatar-xl {
	width: 5.125rem;
	height: 5.125rem
}

.avatar-xl .border {
	border-width: 4px !important
}

.avatar-xl .rounded {
	border-radius: 8px !important
}

.avatar-xl .avatar-title {
	font-size: 30px
}

.avatar-xl .avatar-away::before,
.avatar-xl .avatar-dnd::before,
.avatar-xl .avatar-offline::before,
.avatar-xl .avatar-online::before {
	border-width: 4px
}

.avatar-xxl {
	width: 5.125rem;
	height: 5.125rem
}

.avatar-xxl .border {
	border-width: 6px !important
}

.avatar-xxl .rounded {
	border-radius: 8px !important
}

.avatar-xxl .avatar-title {
	font-size: 30px
}

.avatar-xxl .avatar-away::before,
.avatar-xxl .avatar-dnd::before,
.avatar-xxl .avatar-offline::before,
.avatar-xxl .avatar-online::before {
	border-width: 4px
}

@media (min-width:768px) {
	.avatar-xxl {
		width: 8rem;
		height: 8rem
	}
	.avatar-xxl .border {
		border-width: 4px !important
	}
	.avatar-xxl .rounded {
		border-radius: 12px !important
	}
	.avatar-xxl .avatar-title {
		font-size: 42px
	}
	.avatar-xxl .avatar-away::before,
	.avatar-xxl .avatar-dnd::before,
	.avatar-xxl .avatar-offline::before,
	.avatar-xxl .avatar-online::before {
		border-width: 4px
	}
}

.avatar-group {
	display: inline-flex
}

.avatar-group .avatar+.avatar {
	margin-left: -.75rem
}

.avatar-group .avatar-xs+.avatar-xs {
	margin-left: -.40625rem
}

.avatar-group .avatar-sm+.avatar-sm {
	margin-left: -.625rem
}

.avatar-group .avatar-lg+.avatar-lg {
	margin-left: -1rem
}

.avatar-group .avatar-xl+.avatar-xl {
	margin-left: -1.28125rem
}

.avatar-group .avatar:hover {
	z-index: 1
}

.avatar-input {
	position: relative;
	overflow: hidden
}

.avatar-input .avatar-file-picker {
	position: absolute;
	z-index: 2;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0
}

.avatar-input .avatar-input-icon {
	position: absolute;
	top: 0;
	display: flex;
	width: 100%;
	height: 100%;
	transition: all ease .2s;
	opacity: 0;
	color: #fff;
	background: rgba(0, 0, 0, .37);
	justify-content: center;
	align-items: center
}

.avatar-input:hover .avatar-input-icon {
	opacity: 1
}
/*//avatar--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/


/*--//////////////////////////////////////////////////////////////--*/
/*page search--------------------------------*/

.p_search_wrap{
  width:100%;
  margin:0;
  padding:0;
}
.p_search_wrapin{
   width:100%;
   max-width:100%;
   padding:0;
   position:relative;
}

.p_search_wrapin .form-control,.p_search_wrapin .select2-selection--single{
   font-weight:bold;
   text-align:center !important;
   background-color:#7fdafc;
}
.p_search_wrapin .select2-selection__rendered{
	   width:100%;

   font-weight:bold !important;
   text-align:center !important;
}
.p_search_wrapin .form-group{
    margin-top:5px;
}

.linexx2:before,
.linexx2:after{
  background-color:#7fdafc;
}
.linexx2in:before{
    color:#7fdafc;
}
.p_searchbtn{
   line-height:38px;
}
.p_searchelem_lg{
   width:245px;
}
.p_searchelem{
   width:140px;
}
.p_searchbgicon{
    font-size:120px;
	color:#f8f8f8;
	position:absolute;
	top:-70px;
	left:20px;
}
.p_searchline{
   padding:10px 0 0 0;
}
.p_color_isserach{
   background-color:#ffffae !important;
}
/*//page search--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*ind comment--------------------------------*/
.comment-wrap{
  width:100%;
  border:5px solid #f2f2f2;
  text-align:left;
  margin-bottom:20px;
  -webkit-border-radius: 10px;
  -moz-border-radius:  10px;
  border-radius: 10px;

}
.comment-top{
  width:100%;
  display:inline-block;
  background-color:#fafafa;
  height:40px;line-height:35px;
  padding:5px 10px 0 10px;
  margin:0;
    border-bottom:1px solid #f2f2f2;

}
.comment-kind{
 float:left;
 font-weight:bold;
 margin-left:3px;
}
.comment-name{
 float:left;
 margin-left:3px;
}
.comment-time{
 float:right;
 font-size:12px;
 padding-top:3px;
}
.comment-bot{
  width:100%;
  margin:0;
  padding:10px;
}

.namecircle{  
 display: inline-block;
  text-align: center;
  vertical-align: middle;
  -webkit-border-radius: 50% !important;
  -moz-border-radius: 50% !important;
  border-radius: 50% !important;
  overflow:hidden;
  height: 30px !important;
  width: 30px !important;line-height:33px !important;
  background-color:#fcd54e;
  foont-size:15px;
  font-weight:bold;
  text-transform: uppercase;
  float:left;
}
.namecircle.me{ 
   background-color:#b0e8fd;
}

/*//ind comment--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*categiry set--------------------------------*/

.catset_wrap{
  width:320px;
  height:410px;
  margin:0 auto;
  position:relative;
}
.catset_title{
  width:100%;
  height:35px;
  line-height:35px;
  font-weight:bold;
  text-align:center;
  background-color:#fafafa;
}
.catset_title .direct-left{
   margin:3px 0 0 3px;
}
.catset_catadd{
  width:100%;
  height:30px;
}
.catset_body{
  width:100%;
  height:325px;
  overflow-x:hidden;
  overflow-y:auto;
  border:1px solid #ccc;
  padding:0 5px 5px 5px;
  margin-top:5px;
}
.catset_ind_wrap{
  width:100%;
  height:38px;
  border:1px solid #ccc;
  margin-top:10px;
  display:flex;
}

.catset_ind_cat{
  width:130px;
  height:30px;
}
.catset_ind_tool{
  width:190px;
  height:30px;
  position:relative;
  padding:3px;
}
.catset_foot{
  width:100%;
  height:30px;
}
.catset_foot_icon:before{
  color:#000;
}

.cattoolicon{
  width:20px !important; 
  height:25px !important;
  margin-right:8px;
  position:relative;
  text-align:center;
  padding:0;
  float:left;
  margin-top:3px;
}

.cattoolicon_move:before{
    content: "\f0d1";
    font-family: FontAwesome;
    font-size: 14px;
	position:absolute;
	top:-5px;
	left:0;
}

.cattoolicon_movein:before{
    content: "\f2f6";
    font-family: FontAwesome;
    font-size: 14px;
	position:absolute;
	top:-5px;
	left:0;
	transform: rotate(180deg);
}

.cattoolicon_delete:before{
    content: "\f2ed";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:-5px;
	left:0;
}

.cattoolicon_edit:before{
    content: "\f044";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:-5px;
	left:0;
}
.cattoolicon_edit.on:before{
    color:#fc8a58;
}

.cattoolicon_up:before{
    content: "\f062";
    font-family: FontAwesome;
    font-size: 17px;
	position:absolute;
	top:-5px;
	left:0;
}
.cattoolicon_down:before{
    content: "\f063";
    font-family: FontAwesome;
    font-size: 17px;
	position:absolute;
	top:-5px;
	left:0;
}
/*//categiry set--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

.media-content{
  position: relative;
}
.media-content:before {
    content: '';
    position: absolute;
    height: 10%;
    width: 90%;
    left: 5%;
    bottom: 0;
    background: inherit;
    background-position-y: 100%;
    filter: blur(10px);
}

#main_top_ban{
   position:absolute;
   top:0;
   left:0;
   width:100%;
   height:170px;
   overflow:visible;
   z-index:10;
   text-align:center;
}
#top_banL{
   position:absolute;
   top:0;
   left:0;
   width:400px;;
   height:170px;
   overflow:hidden;
   background-position:left bottom;
   background-repeat:no-repeat;
   background-size:auto 110px;
}
#top_banR{
   position:absolute;
   top:0;
   right:0;
   width:350px;;
   height:150px;
   overflow:hidden;
   background-position:center bottom;
   background-repeat:no-repeat;
   background-size:auto 65px;
}

#main_bot_ban{
   position:absolute;
   bottom:0;
   left:0;
   width:100%;
   width:100%;
   height:0;
   overflow:visible;
   z-index:0;
   text-align:center;
}
#bot_banL{
   position:absolute;
   bottom:0;
   left:0;
   width:400px;;
   height:180px;
   overflow:hidden;
   background-position:left bottom;
   background-repeat:no-repeat;
   background-size:auto 180px;
}
#bot_banR{
   position:absolute;
   bottom:0;
   right:0;
   width:350px;;
   height:130px;
   overflow:hidden;
   background-position:center bottom;
   background-repeat:no-repeat;
   background-size:auto 130px;
}

/*-------------------------------------------*/
.box-customcheck .custom-control{
   padding-left:0;
}
.box-customcheck .custom-control-label{
   border:1px solid #ccc;
   padding:0;
   height:30px;
   line-height:30px;
   text-align:center;
   min-width:100px;
   margin:2px;
}
.box-customcheck .custom-control-label:before,
.box-customcheck .custom-control-label:after{
   display:none;
}

.box-customcheck .mkind_check .partind_c {
    padding-left: 0;
    min-width: 100px;
}

.box-customcheck .custom-control-input:checked ~ .custom-control-label{
  background-color:#f4faff;
  font-weight:bold;
}
.box-customview .partind_c{
  height:30px;line-height:30px;
  min-width:100px;
  margin:0 2px 5px;
  border:1px solid #ccc;
  text-align:center;
  padding:0;
}
.catwrap_checks{
   height:300px;
   overflow-x:hidden;
   overflow-y:auto;
   padding-left:5px;
   border:solid #ccc;
   border-width:0;
   background-color:#f4faff;
}
.catwrap_checks label.custom-control-label{
  background-color:#fff;
}
/*-------------------------------------------*//*
#b1c2d9 / #3ecf8e
*/
/*--//////////////////////////////////////////////////////////////--*/
/*feature-box*/

.feature-box {
  position: relative;
  max-width: 10.5rem;
  padding: 1.5rem;
  color: #fff;
  text-align: center;
  display: inline-block;
  margin: 0 0.75rem 1.5rem;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  -webkit-box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
  -moz-box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
  box-shadow: 0px 0px 25px rgba(151, 160, 191, 0.3);
}

.feature-box i {
  font-size: 1.953rem;
  line-height: 3rem;
}

.feature-box p {
  margin-bottom: 0;
  color: #fff;
  font-weight: 700;
}

.feature-box span {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  background-color: #fff;
}

.feature-box span.badge-primary {
  color: #38ceea;
}

.feature-box span.badge-second {
  color: #fc3858;
}

.feature-box-primary {
  background-color: #38ceea;
}

.feature-box-second {
  background-color: #fc3858;
}
/*feature-box END*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*box_topic*/
.box_topic_wrap{
   width:100%;
   display: flex;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  justify-content: center !important;
  flex-wrap: wrap;
}
.box_topic{
   padding:5px;
   /*border:1px solid #81dcd6;*/
   border-radius:0;
   display:inline-block;
   width:210px;
}
.box_topic .box_topic_in{
   width:100%;
   height:80px;
   border:1px solid #f2f2f2;
   padding:5px 5px 5px 5px;
   position:relative;
   text-align:center;
   display: flex;
  justify-content: center;
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
}
.box_topicL {
    border:1px solid transparent;
    font-size: 20px;
    color: #000;
	width:20px;
	height:80px;
    background-color: transparent;
	  -webkit-transition: all 0.5s; /* Safari */
  transition: all 0.5s;
	display:flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  -ms-flex-flow:row;/*ie*/
  justify-content: center !important;
  align-items: center !important;

}

.box_topic_wrap .topic-iconbox{
    width:60px;height:60px;line-height:60px;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	  display:table-cell;
	  background-color:#d7f3fe;
	  text-align:center;
}


.box_topicR {
    border:1px solid transparent;
    color: #000;
	width:140px;
}

.box_topic .box_topic_in:hover{

}
/*
i.box_topic_icon {
    color: #7fdafc;
}
*/
.box_topic:hover i.box_topic_icon {
    color: #7fdafc;
}

.box_topic .title{
     height:40px;
     line-height:50px;
     font-size:15px;
	 font-weight:bold;
	 color: #000;
}


.box_topic .exp{
     font-size:13px;
	 color:#000;
}

.shadow3{
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
}
/*box_topic END*/
/*--//////////////////////////////////////////////////////////////--*/
/*--//////////////////////////////////////////////////////////////--*/
/*form-wizard */

.form-wizard {
	 width:100%;
	 position:relative;
	 min-height:200px;
	 padding-bottom:100px;
}
.form-wizard-step { 
	text-align:center;
	line-height:30px;
	position: relative;
	float: left;
	padding: 0 5px;
	opacity:0;
	-webkit-transition: opacity .15s ease-in-out;
	transition: opacity .15s ease-in-out;
}

.form-wizard-buttons{
   position:fixed;
   bottom:45px;
   width:300px;
   padding:10px 10px 10px 10px;
   left:50%;
   margin-left:-150px;
   background-color:#fff;
   border:5px solid #000;
}
.form-wizard-buttons .btn.hide{
	background-color:#999;
	border-color:#999;
	pointer-events: none;
}
.form-wizard-buttons .btn.stepbtn-prev{
   float:left;
}
.form-wizard-buttons .btn.stepbtn-next{
   float:right;
}

/*
.form-wizard-step-icon{
   cursor:pointer;
}
.form-wizard-step.active .form-wizard-step-icon{
  cursor: default;
}
*/
/** Form header Classic **/

.form-header-classic .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #fff; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-classic .form-wizard-step.activated .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #6753D8; 
	color: #6753D8; 
	line-height: 38px;
}
.form-header-classic .form-wizard-step.active .form-wizard-step-icon {
	width: 48px; 
	height: 48px; 
	margin-top: 0; 
	background: #6753D8; 
	font-size: 22px; 
	line-height: 48px;
}

.form-header-classic .form-wizard-step p { color: #ccc; }
.form-header-classic .form-wizard-step.activated p { color: #6753D8; }
.form-header-classic .form-wizard-step.active p { color: #6753D8; }

/** Form header Classic **/



/** Form header Modarn **/

.form-header-modarn .form-wizard-step{
	padding-top:10px !important;
	border:2px solid #fff;
	background:#ccc;
}
.form-header-modarn .form-wizard-step.active{
	background:#6753D8;
}
.form-header-modarn .form-wizard-step.activated{
	background:#6753D8;
}
.form-header-modarn .form-wizard-progress { 
	height: 0px; 
	display:none;
}
.form-header-modarn .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #777; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-modarn .form-wizard-step.activated .form-wizard-step-icon {
	background: #6753D8; 
	border: 1px solid #fff; 
	color: #fff; 
	line-height: 38px;
}
.form-header-modarn .form-wizard-step.active .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #fff; 
	color: #6753D8; 
	line-height: 38px;
}

.form-header-modarn .form-wizard-step p { color: #fff; }
.form-header-modarn .form-wizard-step.activated p { color: #fff; }
.form-header-modarn .form-wizard-step.active p { color: #fff; }

/** Form header Modarn **/



/** Form header Stylist **/

.form-header-stylist .form-wizard-step{
	position:relative;
	padding-top:10px !important;
	border:0px solid #fff;
	background:#ccc;
}
.form-header-stylist .form-wizard-step::before {
	content: '';
	position: absolute;
	left: 0%;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #ccc;
	clear: both;
	z-index: 999;
}
.form-header-stylist .form-wizard-step.active::after {
	content: '';
	position: absolute;
	right: -20px;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #6753D8;
	clear: both;
	z-index: 9999;
}
.form-header-stylist .form-wizard-step.activated::after {
	content: '';
	position: absolute;
	right: -20px;
	top: -2%;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 20px solid #6753D8;
	clear: both;
	z-index: 9999;
}
.form-header-stylist .form-wizard-step.active{
	background:#6753D8;
}
.form-header-stylist .form-wizard-step.activated{
	background:#6753D8;
}
.form-header-stylist .form-wizard-progress { 
	height: 0px; 
	display:none;
}
.form-header-stylist .form-wizard-step-icon {
	display: inline-block;
	width: 40px; 
	height: 40px; 
	margin-top: 4px; 
	background: #ddd;
	font-size: 16px; 
	color: #777; 
	line-height: 40px;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius: 50%;
}
.form-header-stylist .form-wizard-step.activated .form-wizard-step-icon {
	background: #6753D8; 
	border: 1px solid #fff; 
	color: #fff; 
	line-height: 38px;
}
.form-header-stylist .form-wizard-step.active .form-wizard-step-icon {
	background: #fff; 
	border: 1px solid #fff; 
	color: #6753D8; 
	line-height: 38px;
}

.form-header-stylist .form-wizard-step p { color: #fff; }
.form-header-stylist .form-wizard-step.activated p { color: #fff; }
.form-header-stylist .form-wizard-step.active p { color: #fff; }

/** Form header Stylist **/


.form-wizard .progress-bar {
	background-color: #6753D8;
}

.form-wizard-steps{ 
	margin:auto; 
	overflow: hidden; 
	position: relative; 
	margin-top: 20px;
}

.form-wizard-progress { 
	position: absolute; 
	top: 24px; 
	left: 0; 
	width: 100%; 
	height: 1px; 
	background: #ddd;
}
.form-wizard-progress-line { 
	position: absolute; 
	top: 0; 
	left: 0; 
	height: 1px; 
	background: #6753D8; 
}

.form-wizard fieldset { 
	width:100%;
	padding-top:20px;
	display: none; 
	text-align: left; 
	border:0px !important
}

.form-wizard .input-error { border-color: #6753D8;}
/*--form-wizard END--*
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/* Navbar */
.navbar.horizontal-layout {
width:100%;
background: #fff;
padding:0;margin:0;
/*
-webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
-moz-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08); 
*/
-webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28);
-moz-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28);
box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.28); 
}
#page-container.page-header-fixed .navbar.horizontal-layout{
   position:fixed;
   top:0;left:0;
   z-index:99;
}
#page-container.page-header-scroll .navbar.horizontal-layout .nav-top{
    display:none;
}
#page-container.page-header-scroll .navbar.horizontal-layout .nav-top.keepshow{
    display:block;
}
.navbar.horizontal-layout .nav-top{
  width:100%;height:50px;
}
.navbar.horizontal-layout .nav-bottom{
  width:100%;height:60px;
  padding-bottom:5px 0 5px 0;
}

.navbar.horizontal-layout .topsearch{
      width:300px;
	  margin-top:10px;
}
.navbar.horizontal-layout .topsearch .form-control{
    border:0 !important;
	background-color:#f9f9f9;
}
.navbar.horizontal-layout .nav-bottom .submenu{
  min-width:100%;
  margin-top:-6px;
  display:flex;
  justify-content:space-between;
}
.navbar.horizontal-layout .nav-bottom .submenu-body{
  width:100%;
  display:flex;
  justify-content:space-around;
}


.nav-item .link-icon {
   margin-right:5px;
}
.navbar.horizontal-layout .nav-item:hover > .nav-link{
background: #f2f2f9; 
}

.navbar.horizontal-layout .nav-item > .nav-link {
  color: #223C61;
  width:100%;
text-align:center;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s; }

.navbar.horizontal-layout .navbar-menu-wrapper {
color: #000;
padding-left: 15px;
padding-right:0;
height:50px !important;
   display: flex;
  align-items: center !important;
  justify-content:flex-end !important;
}
.navbar.horizontal-layout .navbar-menu-wrapper .nav-item,.navbar.horizontal-layout .navbar-menu-wrapper .nav-item a{
height:30px;
line-height:30px;
margin:0;
}
.navbar.horizontal-layout .navbar-brand-wrapper {
width: 150px;
height: 50px; 
}


.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand {
font-size: 110%;
font-weight:bold;
line-height: 55px;
margin-right: 0;
padding:0 10px 0 10px; 
}
.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:active, .navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:focus, .navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand:hover {
color: #424546; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo img {
max-width: 100%;
height: 50px;
margin: auto;
vertical-align: middle; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo-mini img {
width: auto;
max-width: 100%;
height: 35px;
margin-left: 0; }
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo{
   font-size:18px;
}
.navbar.horizontal-layout .navbar-brand-wrapper .brand-logo-mini{
   font-size:14px;
}
.navbar.horizontal-layout .nav-item{
padding:0;
}
.navbar.horizontal-layout .nav-item a{
padding:0 10px 0 10px
}
.navbar.horizontal-layout .nav-item,.navbar.horizontal-layout .nav-item a{
height:40px;
line-height:43px;
}


.navbar.horizontal-layout .navbar-menu-wrapper .nav-item a{
font-size:95%;
}

.navbar.horizontal-layout .navbar-menu-wrapper .navbar-nav .nav-item .nav-link {
vertical-align: middle; }
.navbar.horizontal-layout .navbar-menu-wrapper .navbar-nav .nav-item .nav-link i {
vertical-align: middle; }
.navbar.horizontal-layout .navbar-menu-wrapper .search-field .input-group-prepend .input-group-text, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-trigger .input-group-text {
border-radius: 50px 0 0 50px;
background: rgba(213, 220, 236, 0.15);
border: none; }
.navbar.horizontal-layout .navbar-menu-wrapper .search-field .form-control, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-input, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .dataTables_wrapper select, .dataTables_wrapper .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=text], .jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=text], .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.jsgrid .jsgrid-table .jsgrid-filter-row select,
.jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=number], .jsgrid .jsgrid-table .jsgrid-filter-row .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=number], .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single, .select2-container--default .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-selection--single, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single .select2-search__field, .select2-container--default .select2-selection--single .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-search__field, .navbar.horizontal-layout .navbar-menu-wrapper .search-field .tt-hint, .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.tt-query, .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.typeahead {
width: 50%;
background: #f9f9fc;
border: none;
border-radius: 0 50px 50px 0; }


.rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .input-group-prepend .input-group-text, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-trigger .input-group-text {
border-radius: 0 50px 50px 0; }
.rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .form-control, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .asColorPicker-input, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .dataTables_wrapper select, .dataTables_wrapper .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=text], .jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=text], .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.jsgrid .jsgrid-table .jsgrid-filter-row select,
.jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field select, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .jsgrid .jsgrid-table .jsgrid-filter-row input[type=number], .jsgrid .jsgrid-table .jsgrid-filter-row .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field input[type=number], .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single, .select2-container--default .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-selection--single, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-container--default .select2-selection--single .select2-search__field, .select2-container--default .select2-selection--single .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .select2-search__field, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field .tt-hint, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.tt-query, .rtl .navbar.horizontal-layout .navbar-menu-wrapper .search-field
.typeahead {
border-radius: 50px 0 0 50px; }
.navbar.horizontal-layout .navbar-menu-wrapper .navbar-toggler {
display: none; }


.rtl .navbar.horizontal-layout .navbar-menu-wrapper {
padding-left: 0; }
.rtl .navbar.horizontal-layout .navbar-menu-wrapper .navbar-toggler {
padding-left: 0; }
.navbar.horizontal-layout .nav-bottom{
position: relative;
top: 0;
right: 0;
left: 0;
width: auto;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-transition-duration: 3s;
-moz-transition-duration: 3s;
-o-transition-duration: 3s;
transition-duration: 3s;
-webkit-transition-property: position, left, right, top, z-index;
-moz-transition-property: position, left, right, top, z-index;
-o-transition-property: position, left, right, top, z-index;
transition-property: position, left, right, top, z-index; }

.navbar.horizontal-layout .nav-bottom:not(.intop) {
   width:100%;
}
.navbar.horizontal-layout .nav-bottom .page-navigation {
display:flex;
justify-content:space-between;
position: relative;
width: 100%;
z-index: 99;
background: #f9f9fc;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
-webkit-transition-property: background, box-shadow;
-moz-transition-property: background, box-shadow;
-o-transition-property: background, box-shadow;
transition-property: background, box-shadow; }



.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item {
text-align: center; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.pointbg {
background-color:#000;color:#f2f2f2; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:last-child {
border-right: none; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon {
margin-right: 5px;
color: #464de4; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon.small {
font-size:10px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon.mini {
font-size:5px; vertical-align:middle;}
.rtl .navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .link-icon {
margin-right: 0;
margin-left: 10px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .menu-arrow {
margin-left: 5px;
font-size: 15px;
display: inline-block;
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
moz-transform-origin: center;
-o-transform-origin: center;
-ms-transform-origin: center;
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transition-duration: 0.25s;
-moz-transition-duration: 0.25s;
-o-transition-duration: 0.25s;
transition-duration: 0.25s; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item > .nav-link .menu-arrow:before {
font: normal normal normal 24px/1 "Material Design Icons";
content: "\F35D";
font-size: inherit; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover .submenu {
display: block;
background: #f2f2f9; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover > .nav-link {
background: #f2f2f9; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:hover > .nav-link .menu-arrow {
-moz-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link {
background: linear-gradient(30deg, #464de4, #814eff);
color: #fff; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link .link-icon,
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.active > .nav-link .menu-arrow {
color: #fff; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu {
display: none; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul {
list-style-type: none;
padding-left: 0; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li {
display: block;
line-height: 20px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li a,
.navbar.horizontal-layout .nav-bottom .submenu-ind-title.nav-item a{
display: block;
font-weight: 600;
color: #223C61;
text-decoration: none;
text-align: left;
margin: 4px 0;
text-overflow: ellipsis;
overflow: hidden;
max-width: 100%;
white-space: nowrap;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
-webkit-transition-property: background;
-moz-transition-property: background;
-o-transition-property: background;
transition-property: background;
border-radius: 6px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li a:hover {
background: rgba(70, 77, 228, 0.1); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item .submenu ul li.active a {
background: rgba(70, 77, 228, 0.1); }
.navbar.horizontal-layout .nav-bottom .submenu-ind-title.nav-item .nav-link:hover {
background: rgba(70, 77, 228, 0.1); }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu {
position: relative;
top: -100%; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu-item {
padding: 15px; }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item:not(.mega-menu) .submenu-item {
position: absolute;
width: calc(100% - 1px);
left: 0;
right: 0;
top: 46px;
z-index: 999;
background: #f2f2f9;
border-top: none;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); } 

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu {
left: 0;
padding: 25px; }

.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu {
position: absolute;
width: calc(100% - 1px);
left: 0;
right: 0;
top: 46px;
z-index: 999;
background: #f2f2f9;
border-top: none;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); } 
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu .category-heading {
font-weight: 600;
text-align: left;
color: #464de4;
height:40px;line-height:40px;
border-bottom: 1px solid rgba(213, 220, 236, 0.6); }
.navbar.horizontal-layout .nav-bottom .page-navigation > .nav-item.mega-menu .submenu .category-heading a{
  color: #464de4 !important;
}

.rtl .navbar.horizontal-layout .nav-bottom .page-navigation {
padding-right: 0; }
.navbar.horizontal-layout .nav-bottom.header-toggled {
display: block; }
.navbar.horizontal-layout .nav-bottom.fixed-top {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999; }

.navbar.horizontal-layout .nav-bottom.fixed-top .page-navigation {
margin-bottom: 0;
border-bottom: none;
background: #fff;
box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06);
-webkit-box-shadow: 0 8px 5px 0 rgba(0, 0, 0, 0.06); }


.navbar.horizontal-layout .menu-mini {
  height:30px;/*height 주지않을경우내부에 float-right들이잇으면 마진이생긴다*/
  padding-right:10px;
 display: none; 
}
.nav_main_top_in{
  width:100%;
  opacity:1;
	-webkit-transition: opacity .15s ease-in-out;
	transition: opacity .15s ease-in-out;
}
.nav_main_top_in.off{
  opacity:0;
}


/* Navbar END*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/* Icon Box -*/
.ico-box{
width:100%;
display:inline-block;
}
.ico-title{
line-height:55px;padding-left:5px;
text-align:left;
}

.ico-holder {
	float: left;
	width: 55px;
	height: 55px;
	line-height: 65px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: rgba(252,60,0,1);
	margin-right: 5px;
	font-size: 42px;
	color: #fff;
	text-align: center;
}
.ico-holder-nobak{width: 45px !important;background:none !important;text-align: left !important;margin-right: 0px !important;}
.ico-box h5 {
	font-size: 1em;
	line-height: 18px;
	color: #444;
	font-weight: bold;
	/*font-family: Arial, Helvetica, sans-serif;*/
	margin-bottom: 1em;
}


.ico-box__primary .ico-holder,.bgcolor__primary {
	background: rgba(252,60,0,1);
}


.ico-box__secondary .ico-holder,.bgcolor__secondary {
	background: #c4d208;
}


.ico-box__tertiary .ico-holder,.bgcolor__tertiary {
	background: #7fdbfd;
}


.ico-box__quaternary .ico-holder,.bgcolor__quaternary {
	background: #70b3d0;
}
.ico-body{clear:both;padding:0;}


.ico-box.ico-box-mini .ico-title{
line-height:35px;
}
.ico-box.ico-box-mini .ico-holder{
		width: 35px;
		height: 35px;
		line-height: 38px;
font-size:20px;
}


/* Icon Box / End */
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*card--------------------------------*/
.card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	border-radius: 0 !important;
	background-color: #fff;
	background-clip: border-box
}
.cardgroup_shadow .card{
    -webkit-box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);
    box-shadow: 0 1px 15px rgba(0,0,0,.04), 0 1px 6px rgba(0,0,0,.04);

}

.card>hr {
	margin-right: 0;
	margin-left: 0
}
/*
.card>.list-group:first-child .list-group-item:first-child {
	border-top-left-radius:0;
	border-top-right-radius:0
}

.card>.list-group:last-child .list-group-item:last-child {
	border-bottom-right-radius:0;
	border-bottom-left-radius:0
}*/

.card-body {

}

.card-title {
	margin-bottom: .75rem
}
.card-btnwrap {
	position:absolute;
	bottom:0;
	height:50px;
	line-height:50px;
	width:100%;
   display: flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  justify-content: center !important;
}

.card-subtitle {
	margin-top: -.375rem;
	margin-bottom: 0
}

.card-text:last-child {
	margin-bottom: 0
}

.card-link:hover {
	text-decoration: none
}

.card-link+.card-link {
	margin-left: 1.25rem
}

.card-header {
	margin-bottom: 0;
	padding: .75rem 1.25rem;
	border-bottom: 0 solid rgba(0, 0, 0, .125);
	background-color: transparent
}

.card-header:first-child {
	border-radius: calc(.25rem - 0) calc(.25rem - 0) 0 0
}

.card-header+.list-group .list-group-item:first-child {
	border-top: 0
}

.card-footer {
	padding: .75rem 1.25rem;
	border-top: 0 solid rgba(0, 0, 0, .125);
	background-color: transparent
}

.card-footer:last-child {
	border-radius: 0 0 calc(.25rem - 0) calc(.25rem - 0)
}

.card-header-tabs {
	margin-right: -.625rem;
	margin-bottom: -.75rem;
	margin-left: -.625rem;
	border-bottom: 0
}

.card-header-pills {
	margin-right: -.625rem;
	margin-left: -.625rem
}

.card-img-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 1.25rem
}

.card-img {
	width: 100%;
	border-radius: calc(.25rem - 0)
}

.card-img-top {
	width: 100%;
	border-top-left-radius: calc(.25rem - 0);
	border-top-right-radius: calc(.25rem - 0)
}

.card-img-bottom {
	width: 100%;
	border-bottom-right-radius: calc(.25rem - 0);
	border-bottom-left-radius: calc(.25rem - 0)
}

.card-deck {
	display: flex;
	flex-direction: column
}

.card-deck .card {
	margin-bottom: 15px
}

@media (min-width:576px) {
	.card-deck {
		margin-right: -15px;
		margin-left: -15px;
		flex-flow: row wrap
	}
	.card-deck .card {
		display: flex;
		flex-direction: column;
		margin-right: 15px;
		margin-bottom: 0;
		margin-left: 15px;
		flex: 1 0
	}
}

.card-group {
	display: flex;
	flex-direction: column
}

.card-group>.card {
	margin-bottom: 15px
}

@media (min-width:576px) {
	.card-group {
		flex-flow: row wrap
	}
	.card-group>.card {
		margin-bottom: 0;
		flex: 1 0
	}
	.card-group>.card+.card {
		margin-left: 0;
		border-left: 0
	}
	.card-group>.card:not(:last-child) {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0
	}
	.card-group>.card:not(:last-child) .card-header,
	.card-group>.card:not(:last-child) .card-img-top {
		border-top-right-radius: 0
	}
	.card-group>.card:not(:last-child) .card-footer,
	.card-group>.card:not(:last-child) .card-img-bottom {
		border-bottom-right-radius: 0
	}
	.card-group>.card:not(:first-child) {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0
	}
	.card-group>.card:not(:first-child) .card-header,
	.card-group>.card:not(:first-child) .card-img-top {
		border-top-left-radius: 0
	}
	.card-group>.card:not(:first-child) .card-footer,
	.card-group>.card:not(:first-child) .card-img-bottom {
		border-bottom-left-radius: 0
	}
}

.card-columns .card {
	margin-bottom: .75rem
}

@media (min-width:576px) {
	.card-columns {
		column-count: 3;
		column-gap: 1.25rem;
		orphans: 1;
		widows: 1
	}
	.card-columns .card {
		display: inline-block;
		width: 100%
	}
}

.accordion>.card {
	overflow: hidden
}

.accordion>.card:not(:first-of-type) .card-header:first-child {
	border-radius: 0
}

.accordion>.card:not(:first-of-type):not(:last-of-type) {
	border-bottom: 0;
	border-radius: 0
}

.accordion>.card:first-of-type {
	border-bottom: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0
}

.accordion>.card:last-of-type {
	border-top-left-radius: 0;
	border-top-right-radius: 0
}

.accordion>.card .card-header {
	margin-bottom: 0
}

.card {
	/*
	transition: box-shadow ease .2s;
	box-shadow: 0 7px 14px 0 rgba(60, 66, 87, .1), 0 3px 6px 0 rgba(0, 0, 0, .07)
	*/
	border:1px solid #ccc;
}
.card.noborder{
	border:0;
}

.card .card-header {
	border-bottom: 0
	height:45px;
	line-height:45px;
	padding:0 10px 0 10px;
}

.card .card-header .card-title {
	font-weight:bold;
	margin-bottom: 0
}

.card .card-body {
	padding: .10px 20px 10px 15px;
}

.card .card-body.card-scroll {
	height: 350px
}

.card .card-body.card-scroll .scroll-bar {
	background-color: #1f263d
}

.card .card-footer {
	border-top: 1px solid #d3e0e9
}

.card:hover {
}

.card .card-media {
	position: relative;
    width:100%;
    height:160px;
	margin-bottom:20px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	display:flex;
  /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  -ms-flex-flow:row;/*ie*/
  justify-content: center !important;
  align-items: center !important;

}

.card .card-media .card-iconbox {
      margin-top:30px;
      width:90px;height:90px;line-height:90px;
	  -webkit-border-radius: 50%;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	  display:table-cell;
	  background-color:#d7f3fe;
	  text-align:center;

}
.card .card-media .card-iconbox .card-icon{
       font-size:20px;
	   margin-right:0;
}
.card .card-media .orderno{
    font-size:18px;
	font-weight:bold;
	width:20px;
	height:20px;line-height:20px;
	color:#ef7142;
	position:absolute;
	top:10px;
	left:10px;
	text-align:left;
	vertical-align:top;
	font-family: Arial, Helvetica, sans-serif;
}

.card .card-controls {
min-width:25px;height:45px;line-height:45px;
position:absolute;
right:0;
top:0;
padding-right:7px;
z-index: 2;
display: flex;
/*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
justify-content:flex-end !important;
}
.card .card-controls>a,.card .card-controls>.dropdown{
min-width:25px;
height:40px;line-height:40px;
margin-left:10px;
text-align:center;
}
.card .card-controls>.icon {
	font-family: 'Material Design Icons';
	font-size: 18px;
	line-height: inherit;
	margin: 0 2px;
	transition: opacity ease .2s;
	opacity: .4;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased
}

.card .card-controls>.icon:hover {
	opacity: 1
}

.card .card-controls .js-card-fullscreen:before {
	content: ''
}

.card .card-controls .js-card-refresh:before {
	content: ''
}

.card .card-controls .js-card-close:before {
	content: ''
}

.card .card-controls.card-controls-bottom {
	position: absolute;
	z-index: 2;
	top: unset;
	right: 1.25rem;
	bottom: .75rem;
	border-bottom-right-radius: calc(.25rem - 0);
	border-bottom-left-radius: calc(.25rem - 0)
}

.card .card-controls>.dropdown {
	display: inline-block
}

.card .card-controls>.dropdown>a .icon {
	font-size: 18px;
	transition: opacity ease .2s;
	opacity: .4
}

.card .card-controls>.dropdown>a .icon:hover {
	opacity: 1
}

.card.is-fullscreen {
	position: fixed;
	z-index: 9999;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0!important;
	border-radius: 0!important
}

.card.is-fullscreen .js-card-fullscreen:before {
	content: ''
}

.card-hover {
	transition: all ease .2s
}

.card-hover:hover {
}
/*//card--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*list-group------------------------------*/
.list-group {
	display: flex;
	flex-direction: column;
	margin-bottom: 0;
	padding-left: 0;
	width:100%;
}

.list-group-item-action {
	width: 100%;
	text-align: inherit;
	color: #32325d
}

.list-group-item-action:focus,
.list-group-item-action:hover {
	z-index: 1;
	text-decoration: none;
	color: #32325d;
	background-color: #f9fbfd
}

.list-group-item-action:active {
	color: #424770;
	background-color: #edf2f9
}

.list-group-item {
width:100%;
	position: relative;
	padding:10px 5px 10px 0;/*좌우는 .list-group.list-group-topnav .list-group-item과 동일해야한다!!!!!!!!!!!!!*/
	border-top: 1px solid #d3e0e9;
	border-bottom: 0;
	margin-top:1px;/*hover시 선사라진다*/
	background-color: #fff;
	display:inline-block;
	text-align:center;
}

.list-group-item.data_even {
	background-color: #fafafa;
}

.list-group-item .item-text-mpre{
      display:none;
	  white-space:nowrap;
}
.list-group-item.mpshow .item-text-mpre{
      display:inline-block;
}
.list-group-item:first-child {
	border-top-left-radius:0;
	border-top-right-radius:0
}

.list-group-item:last-child {
	margin-bottom: 0;
	border-bottom-right-radius:0;
	border-bottom-left-radius:0
}

.list-group-item.disabled,
.list-group-item:disabled {
	pointer-events: none;
	color: #95aac9;
	background-color: #fff
}

.list-group-item.active {
	z-index: 2;
	color: #fff;
	border-color: #6772e5;
	background-color: #6772e5
}


.list-group-flush .list-group-item{
	border-right: 0;
	border-left: 0;
	border-radius: 0
}

.list-group-flush .list-group-item:last-child {
	margin-bottom: -1px
}

.list-group-flush .list-group-item:first-child {
	border-top: 0
}

.list-group-flush .list-group-item:last-child {
	margin-bottom: 0;
	border-bottom: 0
}
.list-group-flush.topline .list-group-item:first-child {
	border-top: 1px solid #d3e0e9;
}
.list-group-flush.bottomline .list-group-item:last-child {
	border-bottom: 1px solid #d3e0e9;
}


.list-group-item-avatar{
  width:50px;
  height:50px;
  margin-right:10px;
}
.list-group-item-main{
width:100%;margin:0 auto;;
vertical-align:middle;
position:relative;
display: flex;
justify-content: space-between !important;
/*-ms-flex-flow:column nowrap;*** between 은 들어가면 안된다/*ie*/
flex-wrap:wrap;
}

.list-group-item-main.main-right{
   display: flex;
   /*-ms-flex-flow:column nowrap;/*ie도 들어가면안된다*/
  justify-content:flex-end;
}
.list-group-item-main.main-center{
   display: flex;
   justify-content:center;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
}
.list-group-item-ind{
   float:left;
   display: flex;
   justify-content:flex-start;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
   height:52px;
	 padding-left:5px;
	 padding-right:5px;
}


.list-group-item.textlist{
   padding-top:10px;
}
.list-group-item.textlist .list-group-item-ind{
   height:35px;
}

.list-group-item-ind.right,.list-group-item-ind.last{
   margin-right:0;
}


/*------------*/

.list-group-item-text{
   width:100%;
   text-align:left;
   /*flex 주면 ellipsis 안든는다 내부에 span class=cutstr 로 사용*/
    display: flex;
    align-items: center !important;
    -ms-flex-flow: row;
}
.list-group-item-text.right{
   text-align:right;
  justify-content:flex-end !important;
}
.list-group-item-text.center{
   text-align:center;
  justify-content:center !important;
}

.list-group-item-wrstr{
   display: flex;
   /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-end !important;
}
/*------------*/


.list-group-item-icon{
  width:20px;
  color:#aaa;
  text-align:center;
}

.list-group-item-icon.pre{
width:14px;
  margin-left:3px;
  margin-right:0;
}

/*
list-group-item-main 에 리스트에들어갈 ind의 갯수애 따라 %를 정해주고 각 media 마다 가변성을 주어서
각 ind의 max가 일정하도록 해준다 ind갯수합이 80%이내로 들어오게 할것 ind1은 95%
각 ind에서 개별적 minwidth를 주어 조절한다
각리스트 만들기시 주의!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
768 의경우 실제 soqn width 는 670 정도 이다
여기에 ind4 로 4개를 넣는데 subject가 있는 list-group-item-ind.subject 가 css에서 기본230 이면
나머지list-group-item-ind 3개는 총합 (670-230)내에서 각 minwidth 를 줘야 768까지 wrap안되게 된다!!!!
*/
.list-group-item-ind{
   text-align: left;
}
 
.list-group-item:not(.table) .list-group-item-main.ind10 .list-group-item-ind{
    width:8%;
}
.list-group-item:not(.table) .list-group-item-main.ind7 .list-group-item-ind{
    width:11%;
}
.list-group-item:not(.table) .list-group-item-main.ind6 .list-group-item-ind{
    width:13%;
}
.list-group-item:not(.table) .list-group-item-main.ind5 .list-group-item-ind{
    width:16%;
}
.list-group-item:not(.table) .list-group-item-main.ind4 .list-group-item-ind{
    width:20%;
}
.list-group-item:not(.table) .list-group-item-main.ind3 .list-group-item-ind{
    width:26%;
}
.list-group-item:not(.table) .list-group-item-main.ind2 .list-group-item-ind{
    width:40%;
}
.list-group-item:not(.table) .list-group-item-main.ind1 .list-group-item-ind{
    width:95%;
}

.list-group-item-ind.wauto,.list-group-item-ind.wauto .list-group-item-text{
    width:auto !important;
 }

/*기본적으로 주고 필요시 각 ind에 width 준다*/
.list-group-item-ind.subject{
    min-width:230px;
	width:230px;
}



.list-group-item-text.dot,.list-group.dottext .list-group-item-text{
    padding-left:7px;/*아래 before의 margin-left와 같아야한다/ 음양만다름!!!!*/
}
.list-group-item-text.dot:before,.list-group.dottext .list-group-item-text:before 
 {
    content: '';
    height: 14px;
    border: 1px solid #7fdafc;
    border-width: 0 1px 0 1px;
	margin-right:5px;
}


.list-group-item-text-preview{
   width:100%;
   padding-top:10px;
   overflow:hidden;
   text-overflow: ellipsis;
   white-space:nowrap;
   color:#999;
}

.list-group-item-order{
   width:20px;height:20px;
   line-height:20px;
   margin-top:2px;
   background-color:#b0e8fd;
   text-align:center;
   font-weight:bold;
}

.list-group-item-ind.subject .list-group-item-text{
   display: flex;
  align-items: center !important;
    -ms-flex-flow:row;/*ie*/
}

.list-group-item-ind.right{
	float:right;
	justify-content:flex-end;
}


.list-group-item-ind .custom-control{
	margin-top:-5px;
}
/*---*/
.list-group-item.feature{
	width:100%;
	background-color:#f5f5f6;
}

.list-group-item.feature .list-group-item-main{
   width:100%;
   display: flex;
   justify-content:center !important;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
  flex-wrap:wrap;
}


.list-group-item.feature .list-group-item-ind{
  height:auto;
}

.list-group-item.feature .list-group-item-ind.subject{
     width:150px;
	 min-width:150px;
	 text-align:center;
}
.list-group-item.feature .list-group-item-ind.body{
   width:350px;
   max-width:100%;
   text-align:left;
   padding-left:20px;
   padding-top:15px;
  display: flex;
  /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-start;
  flex-wrap:wrap;
}

.list-group-item.feature .list-group-item-ind.body .list-group-item-ind{
     width:100%;
	 margin-bottom:5px;	 
	 height:35px;
	  display: flex;
	  /*-ms-flex-flow:column nowrap;/*ie*/
	  justify-content:flex-start;
	  flex-wrap:wrap;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-text{
     width:auto !important;
	 display:inline-block !important;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-ind .list-group-item-icon{
     width:70px !important;
	 height:25px;line-height:25px;
	 margin-right:5px;
	 background-color:#7fdafc;
	 text-align:center;
	 color:#fff;
}
.list-group-item.feature .list-group-item-ind.body .list-group-item-ind .list-group-item-text{
     width:100%;
	 font-weight:bold;
	 padding-top:3px;
}

.list-group-item.feature .listimg{
   width:130px;
   height:130px;
   margin:0 auto;
}
/*-----*/
.list-group-item.table{
 padding-top:0;
 padding-bottom:0;
}
.list-group-item.table .list-group-item-main{
   /*-ms-flex-flow:column nowrap;/*ie*/
  justify-content:flex-start !important;
}
.list-group-item.table:not(.dottext) .list-group-item-text.dot:before {
    border: 1px solid #ccc;
}

/*---*/
.list-group.list-group-topnav .list-group-item{
   height:35px;
   line-height:35px;
   padding:0; /*좌우는 .list-group-item과 동일해야한다!!!!!!!!!!!!!*/
}
.list-group.list-group-topnav .list-group-item-main{
   background-color:#f8f8f8;
}


.list-group.list-group-topnav .list-group-item-text{
   font-weight:bold;
   text-align:left;
   padding-left:10px;
}
/*---*/

.list-group-item-btn{
   margin-left:10px;
}

.list-group-item-btn.go:before{
    content: "\f105";
    font-family: FontAwesome;
    font-size: 30px;
	color:#000;
}

.list-group-item-primary {
	color: #363b77;
	background-color: #d4d8f8
}

.list-group-item-primary.list-group-item-action:focus,
.list-group-item-primary.list-group-item-action:hover {
	color: #363b77;
	background-color: #bec4f4
}

.list-group-item-primary.list-group-item-action.active {
	color: #fff;
	border-color: #363b77;
	background-color: #363b77
}

.list-group-item-secondary {
	color: #4d5869;
	background-color: #e1e7f0
}

.list-group-item-secondary.list-group-item-action:focus,
.list-group-item-secondary.list-group-item-action:hover {
	color: #4d5869;
	background-color: #d0d9e8
}

.list-group-item-secondary.list-group-item-action.active {
	color: #fff;
	border-color: #4d5869;
	background-color: #4d5869
}

.list-group-item-success {
	color: #206c4a;
	background-color: #c9f2df
}

.list-group-item-success.list-group-item-action:focus,
.list-group-item-success.list-group-item-action:hover {
	color: #206c4a;
	background-color: #b4edd3
}

.list-group-item-success.list-group-item-action.active {
	color: #fff;
	border-color: #206c4a;
	background-color: #206c4a
}

.list-group-item-info {
	color: #366e81;
	background-color: #d5f3fd
}

.list-group-item-info.list-group-item-action:focus,
.list-group-item-info.list-group-item-action:hover {
	color: #366e81;
	background-color: #bdecfc
}

.list-group-item-info.list-group-item-action.active {
	color: #fff;
	border-color: #366e81;
	background-color: #366e81
}

.list-group-item-warning {
	color: #7d5f27;
	background-color: #fbebcd
}

.list-group-item-warning.list-group-item-action:focus,
.list-group-item-warning.list-group-item-action:hover {
	color: #7d5f27;
	background-color: #f9e2b5
}

.list-group-item-warning.list-group-item-action.active {
	color: #fff;
	border-color: #7d5f27;
	background-color: #7d5f27
}

.list-group-item-danger {
	color: #7e2c2f;
	background-color: #fbcfd1
}

.list-group-item-danger.list-group-item-action:focus,
.list-group-item-danger.list-group-item-action:hover {
	color: #7e2c2f;
	background-color: #f9b7ba
}

.list-group-item-danger.list-group-item-action.active {
	color: #fff;
	border-color: #7e2c2f;
	background-color: #7e2c2f
}

.list-group-item-light {
	color: #818384;
	background-color: #fdfefe
}

.list-group-item-light.list-group-item-action:focus,
.list-group-item-light.list-group-item-action:hover {
	color: #818384;
	background-color: #ecf6f6
}

.list-group-item-light.list-group-item-action.active {
	color: #fff;
	border-color: #818384;
	background-color: #818384
}

.list-group-item-dark {
	color: #1a1a30;
	background-color: #c6c6d2
}

.list-group-item-dark.list-group-item-action:focus,
.list-group-item-dark.list-group-item-action:hover {
	color: #1a1a30;
	background-color: #b8b8c7
}

.list-group-item-dark.list-group-item-action.active {
	color: #fff;
	border-color: #1a1a30;
	background-color: #1a1a30
}
.lind-odd{
   background-color:#f9f9f9;
}
.line-even{
   background-color:#fefefe;
}

.list-group-more{
  float:right;
}
.list-noitem{
  width:100%;
  height:200px;
  padding-top:90px;
  text-align:center;
}

.list-group-tag{
   height:25px;
}
.list-parttag-wrap{
   white-space:nowrap;
   text-align:left;
   height:25px;
}
.list-parttag-ind{
   display:inline-block;
   width:25px;
   height:25px;
   line-height:25px;
   border:1px solid #ccc;
   margin-right:2px;
   text-align:center;
   color:#ccc;
}
.list-parttag-ind.on{
   border:1px solid #7fdafc;
   color:#000;
   font-weight:bold;
}


.list-parttag-wrap-exp{
   height:25px;
   width:100%;
   margin-top:15px;
   display: flex;
  justify-content: center !important;
}
.list-parttag-wrap-exp-ind{
   text-align:left;
   height:25px;
   border:1px solid #fe8f0d;
   border-width:0 0 1px 0;
   padding:0 5px 0 5px;
}
.list-parttag-wrap-exp-ind div{
   float:left;
}
.list-parttag-wrap-exp .list-parttag-ind{
  border:0;
  color:#000;
  width:14px;
  font-weight:bold;
}
.list-parttag-ind-exp{
   display:inline-block;
   height:25px;
   line-height:25px;
   margin-right:10px;
   text-align:center;
   color:#666;
}

.list-isicon{
   display:inline-block;
   width:25px !important;
   height:15px;
   line-height:10px;
   margin-left:2px;
   text-align:right;
   color:#7fdafc;
   position:relative;
 }
.list-isicon-img:before{
    content: "\f03e";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}
.list-isicon-video:before{
    content: "\f03d";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}
.list-isicon-doc:before{
    content: "\f15c";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:4px;right:0;
}

.itemwrap-actbox{
   width:100%;
   display: flex;
   justify-content:flex-start;
   /*-ms-flex-flow:column nowrap;ie도 드어가면 안된다*/
}

.itemwrap-actbox .btn-tr{
   background-color:transpaent !important;
}
.itemwrap-actbox .btn_minus:before,
.itemwrap-actbox .btn_plus:before{
   margin-right:0;
   color:#999;
}

.itemwrap-actbox .input_ws{
   width:50px;
}


@media (max-width: 900px){/*900  baseui.css / data_grids_main.css/nxgridbasic.css/siteind.css*/
	w900hide{
      display:none;
	}
	 .navbar.horizontal-layout .nav-bottom{
	   display:none;
	 }
	#page-container.page-header-scroll .navbar.horizontal-layout .nav-top{
		display:block;
	}

	.navbar.horizontal-layout .menu-normal {
	  display: none; 
	}
	.navbar.horizontal-layout .menu-mini {
	  display: block; 
	}

	.navbar.horizontal-layout .navbar-menu-wrapper {
       padding-top:7px;
	}
	.navbar.horizontal-layout .navbar-brand-wrapper .navbar-brand {
		line-height: 50px;
	}
}
@media (max-width:745px) {
  .list-group.list-group-topnav{
       display:none;
  }
}
@media (max-width:700px) {



}
@media (max-width:550px) {
    .smhide,#main_top_ban,#main_bot_ban{
        display:none !important;
	}
   .sm100{
      width:99% !important;
	  min-width:99% !important;
	  max-width:99% !important;
   }
   .sm80{
      width:80% !important;
	  min-width:80% !important;
	  max-width:80% !important;
   }
   .sm50{
      width:49% !important;
	  min-width:49% !important;
	  max-width:49% !important;
   }
   .sm30{
      width:33% !important;
	  min-width:33% !important;
	  max-width:33% !important;
   }
   

   .list-group-item{
     border-radius:6px;
	 margin-bottom:10px;
   }
	.list-group-item.data_odd{
       background-color:#fafafa;
	}

   .list-group-item-text.smleft{
     text-align:left;
    justify-content:flex-start !important;
   }

	.list-group-item.mshow .item-text-mpre{
		  display:inline-block;
	}


	.list-group-item.feature .list-group-item-ind.body{
	     margin-top:10px;
		 padding:10px 0 10px 0;
	     border:5px solid #f2f2f2;
		 border-width:5px 0 0 0;

	}

	.list-group-item.feature .list-group-item-ind.subject{
		 width:100% !important;
		 max-width:100%;
		 min-width:100%;
		 text-align:center;
		 padding-top:10px;
	}


     /*----------------*/
	.list-group.fix_sm2row .list-group-item-ind:first-child .list-group-item-text{
	    height:25px;line-height:25px;
		top:0;
		left:60px;
	}
	.list-group.fix_sm2row .list-group-item-ind:nth-child(2){
	    height:25px;line-height:25px;
		top:25px;
		left:60px;
		width:calc(50% - 25px ) !important;
		position:absolute;
		padding-left:0;padding-right:20px;
	}
	.list-group.fix_sm2row .list-group-item-ind:nth-child(3){
	    height:25px;line-height:25px;
		top:25px;
		right:0;
		width:calc(50% - 25px ) !important;
		position:absolute;
	}
     /*----------------*/


	.main_title_2.left{
          text-align:center;
	}
	.main_title_2.left span,.main_title_2.left span em{
        margin:0 auto;
	}

     /*----------------*/

	.ico-title{
	line-height:35px;padding-left:5px;
	text-align:left;
	}

	.ico-holder {
		float: left;
		width: 35px;
		height: 35px;
		line-height: 38px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		background: rgba(252,60,0,1);
		margin-right: 5px;
		font-size: 26px;
		color: #fff;
		text-align: center;
	}
	.ico-holder-nobak{width: 25px !important;background:none !important;text-align: left !important;margin-right: 0px !important;}

}

/*list-group----------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*avatar--------------------------------*/

.avatar {
	position: relative;
	display: inline-block
}

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

.avatar-title {
	display: flex;
	width: 100%;
	height: 100%;
	color: #fff;
	background-color: #b1c2d9;
	align-items: center;
	justify-content: center
}

.avatar-img:hover,
.avatar-title:hover {
	box-shadow: 0 0 0 2px #fff
}

.avatar-away::before,
.avatar-dnd::before,
.avatar-offline::before,
.avatar-online::before {
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	width: 30%;
	height: 30%;
	content: '';
	border: 3px solid #fff;
	border-radius: 50%;
	align-items: center;
	justify-content: center
}

.avatar-online::before {
	background-color: #3ecf8e
}

.avatar-away::before {
	background-color: #f0b64b
}

.avatar-dnd::before {
	background-color: #f2545b
}

.avatar-offline::before {
	background-color: #b1c2d9
}

.avatar {
	width: 3rem;
	height: 3rem
}

.avatar .border {
	border-width: 4px !important
}

.avatar .rounded {
	border-radius: 6px !important
}

.avatar .avatar-title {
	font-size: 18px
}

.avatar .avatar-away::before,
.avatar .avatar-dnd::before,
.avatar .avatar-offline::before,
.avatar .avatar-online::before {
	border-width: 2px
}

.avatar-xs {
	width: 1.625rem;
	height: 1.625rem
}

.avatar-xs .border {
	border-width: 2px !important
}

.avatar-xs .rounded {
	border-radius: 4px !important
}

.avatar-xs .avatar-title {
	font-size: 10px
}

.avatar-xs .avatar-away::before,
.avatar-xs .avatar-dnd::before,
.avatar-xs .avatar-offline::before,
.avatar-xs .avatar-online::before {
	border-width: 1px
}

.avatar-sm {
	width: 2.5rem;
	height: 2.5rem
}

.avatar-sm .border {
	border-width: 3px !important
}

.avatar-sm .rounded {
	border-radius: 4px !important
}

.avatar-sm .avatar-title {
	font-size: 13px
}

.avatar-sm .avatar-away::before,
.avatar-sm .avatar-dnd::before,
.avatar-sm .avatar-offline::before,
.avatar-sm .avatar-online::before {
	border-width: 2px
}

.avatar-lg {
	width: 4rem;
	height: 4rem
}

.avatar-lg .border {
	border-width: 3px !important
}

.avatar-lg .rounded {
	border-radius: 8px !important
}

.avatar-lg .avatar-title {
	font-size: 24px
}

.avatar-lg .avatar-away::before,
.avatar-lg .avatar-dnd::before,
.avatar-lg .avatar-offline::before,
.avatar-lg .avatar-online::before {
	border-width: 3px
}

.avatar-xl {
	width: 5.125rem;
	height: 5.125rem
}

.avatar-xl .border {
	border-width: 4px !important
}

.avatar-xl .rounded {
	border-radius: 8px !important
}

.avatar-xl .avatar-title {
	font-size: 30px
}

.avatar-xl .avatar-away::before,
.avatar-xl .avatar-dnd::before,
.avatar-xl .avatar-offline::before,
.avatar-xl .avatar-online::before {
	border-width: 4px
}

.avatar-xxl {
	width: 5.125rem;
	height: 5.125rem
}

.avatar-xxl .border {
	border-width: 6px !important
}

.avatar-xxl .rounded {
	border-radius: 8px !important
}

.avatar-xxl .avatar-title {
	font-size: 30px
}

.avatar-xxl .avatar-away::before,
.avatar-xxl .avatar-dnd::before,
.avatar-xxl .avatar-offline::before,
.avatar-xxl .avatar-online::before {
	border-width: 4px
}

@media (min-width:768px) {
	.avatar-xxl {
		width: 8rem;
		height: 8rem
	}
	.avatar-xxl .border {
		border-width: 4px !important
	}
	.avatar-xxl .rounded {
		border-radius: 12px !important
	}
	.avatar-xxl .avatar-title {
		font-size: 42px
	}
	.avatar-xxl .avatar-away::before,
	.avatar-xxl .avatar-dnd::before,
	.avatar-xxl .avatar-offline::before,
	.avatar-xxl .avatar-online::before {
		border-width: 4px
	}
}

.avatar-group {
	display: inline-flex
}

.avatar-group .avatar+.avatar {
	margin-left: -.75rem
}

.avatar-group .avatar-xs+.avatar-xs {
	margin-left: -.40625rem
}

.avatar-group .avatar-sm+.avatar-sm {
	margin-left: -.625rem
}

.avatar-group .avatar-lg+.avatar-lg {
	margin-left: -1rem
}

.avatar-group .avatar-xl+.avatar-xl {
	margin-left: -1.28125rem
}

.avatar-group .avatar:hover {
	z-index: 1
}

.avatar-input {
	position: relative;
	overflow: hidden
}

.avatar-input .avatar-file-picker {
	position: absolute;
	z-index: 2;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0
}

.avatar-input .avatar-input-icon {
	position: absolute;
	top: 0;
	display: flex;
	width: 100%;
	height: 100%;
	transition: all ease .2s;
	opacity: 0;
	color: #fff;
	background: rgba(0, 0, 0, .37);
	justify-content: center;
	align-items: center
}

.avatar-input:hover .avatar-input-icon {
	opacity: 1
}
/*//avatar--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/


/*--//////////////////////////////////////////////////////////////--*/
/*page search--------------------------------*/

.p_search_wrap{
  width:100%;
  margin:0;
  padding:0;
}
.p_search_wrapin{
   width:100%;
   max-width:100%;
   padding:0;
   position:relative;
}

.p_search_wrapin .form-control,.p_search_wrapin .select2-selection--single{
   font-weight:bold;
   text-align:center !important;
   background-color:#7fdafc;
}
.p_search_wrapin .select2-selection__rendered{
	   width:100%;

   font-weight:bold !important;
   text-align:center !important;
}
.p_search_wrapin .form-group{
    margin-top:5px;
}

.linexx2:before,
.linexx2:after{
  background-color:#7fdafc;
}
.linexx2in:before{
    color:#7fdafc;
}
.p_searchbtn{
   line-height:38px;
}
.p_searchelem_lg{
   width:245px;
}
.p_searchelem{
   width:140px;
}
.p_searchbgicon{
    font-size:120px;
	color:#f8f8f8;
	position:absolute;
	top:-70px;
	left:20px;
}
.p_searchline{
   padding:10px 0 0 0;
}
.p_color_isserach{
   background-color:#ffffae !important;
}
/*//page search--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*ind comment--------------------------------*/
.comment-wrap{
  width:100%;
  border:5px solid #f2f2f2;
  text-align:left;
  margin-bottom:20px;
  -webkit-border-radius: 10px;
  -moz-border-radius:  10px;
  border-radius: 10px;

}
.comment-top{
  width:100%;
  display:inline-block;
  background-color:#fafafa;
  height:40px;line-height:35px;
  padding:5px 10px 0 10px;
  margin:0;
    border-bottom:1px solid #f2f2f2;

}
.comment-kind{
 float:left;
 font-weight:bold;
 margin-left:3px;
}
.comment-name{
 float:left;
 margin-left:3px;
}
.comment-time{
 float:right;
 font-size:12px;
 padding-top:3px;
}
.comment-bot{
  width:100%;
  margin:0;
  padding:10px;
}

.namecircle{  
 display: inline-block;
  text-align: center;
  vertical-align: middle;
  -webkit-border-radius: 50% !important;
  -moz-border-radius: 50% !important;
  border-radius: 50% !important;
  overflow:hidden;
  height: 30px !important;
  width: 30px !important;line-height:33px !important;
  background-color:#fcd54e;
  foont-size:15px;
  font-weight:bold;
  text-transform: uppercase;
  float:left;
}
.namecircle.me{ 
   background-color:#b0e8fd;
}

/*//ind comment--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

/*--//////////////////////////////////////////////////////////////--*/
/*categiry set--------------------------------*/

.catset_wrap{
  width:320px;
  height:410px;
  margin:0 auto;
  position:relative;
}
.catset_title{
  width:100%;
  height:35px;
  line-height:35px;
  font-weight:bold;
  text-align:center;
  background-color:#fafafa;
}
.catset_title .direct-left{
   margin:3px 0 0 3px;
}
.catset_catadd{
  width:100%;
  height:30px;
}
.catset_body{
  width:100%;
  height:325px;
  overflow-x:hidden;
  overflow-y:auto;
  border:1px solid #ccc;
  padding:0 5px 5px 5px;
  margin-top:5px;
}
.catset_ind_wrap{
  width:100%;
  height:38px;
  border:1px solid #ccc;
  margin-top:10px;
  display:flex;
}

.catset_ind_cat{
  width:130px;
  height:30px;
}
.catset_ind_tool{
  width:190px;
  height:30px;
  position:relative;
  padding:3px;
}
.catset_foot{
  width:100%;
  height:30px;
}
.catset_foot_icon:before{
  color:#000;
}

.cattoolicon{
  width:20px !important; 
  height:25px !important;
  margin-right:8px;
  position:relative;
  text-align:center;
  padding:0;
  float:left;
  margin-top:3px;
}

.cattoolicon_move:before{
    content: "\f0d1";
    font-family: FontAwesome;
    font-size: 14px;
	position:absolute;
	top:-5px;
	left:0;
}

.cattoolicon_movein:before{
    content: "\f2f6";
    font-family: FontAwesome;
    font-size: 14px;
	position:absolute;
	top:-5px;
	left:0;
	transform: rotate(180deg);
}

.cattoolicon_delete:before{
    content: "\f2ed";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:-5px;
	left:0;
}

.cattoolicon_edit:before{
    content: "\f044";
    font-family: FontAwesome;
    font-size: 15px;
	position:absolute;
	top:-5px;
	left:0;
}
.cattoolicon_edit.on:before{
    color:#fc8a58;
}

.cattoolicon_up:before{
    content: "\f062";
    font-family: FontAwesome;
    font-size: 17px;
	position:absolute;
	top:-5px;
	left:0;
}
.cattoolicon_down:before{
    content: "\f063";
    font-family: FontAwesome;
    font-size: 17px;
	position:absolute;
	top:-5px;
	left:0;
}
/*//categiry set--------------------------------*/
/*--//////////////////////////////////////////////////////////////--*/

.media-content{
  position: relative;
}
.media-content:before {
    content: '';
    position: absolute;
    height: 10%;
    width: 90%;
    left: 5%;
    bottom: 0;
    background: inherit;
    background-position-y: 100%;
    filter: blur(10px);
}

#main_top_ban{
   position:absolute;
   top:0;
   left:0;
   width:100%;
   height:170px;
   overflow:visible;
   z-index:10;
   text-align:center;
}
#top_banL{
   position:absolute;
   top:0;
   left:0;
   width:400px;;
   height:170px;
   overflow:hidden;
   background-position:left bottom;
   background-repeat:no-repeat;
   background-size:auto 110px;
}
#top_banR{
   position:absolute;
   top:0;
   right:0;
   width:350px;;
   height:150px;
   overflow:hidden;
   background-position:center bottom;
   background-repeat:no-repeat;
   background-size:auto 65px;
}

#main_bot_ban{
   position:absolute;
   bottom:0;
   left:0;
   width:100%;
   width:100%;
   height:0;
   overflow:visible;
   z-index:0;
   text-align:center;
}
#bot_banL{
   position:absolute;
   bottom:0;
   left:0;
   width:400px;;
   height:180px;
   overflow:hidden;
   background-position:left bottom;
   background-repeat:no-repeat;
   background-size:auto 180px;
}
#bot_banR{
   position:absolute;
   bottom:0;
   right:0;
   width:350px;;
   height:130px;
   overflow:hidden;
   background-position:center bottom;
   background-repeat:no-repeat;
   background-size:auto 130px;
}

/*-------------------------------------------*/
.box-customcheck .custom-control{
   padding-left:0;
}
.box-customcheck .custom-control-label{
   border:1px solid #ccc;
   padding:0;
   height:30px;
   line-height:30px;
   text-align:center;
   min-width:100px;
   margin:2px;
}
.box-customcheck .custom-control-label:before,
.box-customcheck .custom-control-label:after{
   display:none;
}

.box-customcheck .mkind_check .partind_c {
    padding-left: 0;
    min-width: 100px;
}

.box-customcheck .custom-control-input:checked ~ .custom-control-label{
  background-color:#f4faff;
  font-weight:bold;
}
.box-customview .partind_c{
  height:30px;line-height:30px;
  min-width:100px;
  margin:0 2px 5px;
  border:1px solid #ccc;
  text-align:center;
  padding:0;
}
.catwrap_checks{
   height:300px;
   overflow-x:hidden;
   overflow-y:auto;
   padding-left:5px;
   border:solid #ccc;
   border-width:0;
   background-color:#f4faff;
}
.catwrap_checks label.custom-control-label{
  background-color:#fff;
}
/*-------------------------------------------*/
.checkunread{
  text-align: center;
  vertical-align: middle;
  -webkit-border-radius: 50% !important;
  -moz-border-radius: 50% !important;
  border-radius: 50% !important;
  overflow:hidden;
 height: 10px !important;
  width: 10px !important;
  line-height:10px !important;
  background-color:#ccc;
  margin-top:5px;
  display:none;
}
.checkunread.on{
   display:block;
   background-color:#fa701d;
}