.button-nav-horizontal {
  margin-right: 20px;
  border-bottom: 2px solid transparent;
  line-height: 15px;
  padding-bottom: 5px;
  color: #9d9d9d !important;
  text-decoration: none !important;
  cursor: pointer;
}
.button-nav-horizontal:last-child {
  margin-right: 0;
}
.button-nav-horizontal:hover,
.button-nav-horizontal:active,
.button-nav-horizontal.active {
  border-bottom-color: #3b3b3b;
  color: #3b3b3b !important;
}
.button-nav-horizontal.small {
  font-size: 0.85rem;
  padding-bottom: 1px;
  border-bottom-width: 1px;
}
.button-nav-vertical {
  border-left: 2px solid transparent;
  line-height: 15px;
  color: #9d9d9d !important;
  text-decoration: none !important;
  cursor: pointer;
  line-height: 1.6rem;
  padding-left: 1rem;
  font-size: 0.75rem;
  margin-bottom: 10px;
}
.button-nav-vertical:last-child {
  margin-bottom: 0;
}
.button-nav-vertical:hover,
.button-nav-vertical:active,
.button-nav-vertical.active,
.button-nav-vertical.force-active {
  border-left-color: #3b3b3b;
  color: #3b3b3b !important;
}
.button-nav-vertical .short-ico {
  width: 36px;
  height: 36px;
  position: relative;
  top: -5px;
  left: -13px;
  opacity: 0.4;
}
.button-nav-vertical.active .short-ico,
.button-nav-vertical.force-active .short-ico {
  opacity: 1;
}
.button-nav-vertical-2 {
  line-height: 15px;
  text-decoration: none !important;
  cursor: pointer;
  line-height: 1.6rem;
  font-size: 0.75rem;
  margin-bottom: 15px;
}
.button-nav-vertical-2 .active-belt {
  min-width: 6px;
  max-width: 6px;
  height: 100%;
  background: transparent;
}
.button-nav-vertical-2 .ico {
  font-size: 1rem;
  opacity: 1;
  color: #333333;
  margin: 0 14px 0 11px;
}
.button-nav-vertical-2 .label {
  font-size: 0.875rem;
  line-height: 1rem;
  font-weight: 400;
  color: #333333;
  opacity: 1;
}
.button-nav-vertical-2 .nav-badge .nav-badge-magicico {
  font-size: 1.2rem;
  cursor: pointer;
  color: #8a8a8a;
}
.button-nav-vertical-2 .nav-badge .nav-badge-count {
  border: 1px solid #ddd;
  padding: 3px 6px;
  line-height: 1;
  border-radius: 50px;
  font-size: 11px;
  color: #575962;
}
.button-nav-vertical-2:hover .active-belt,
.button-nav-vertical-2:active .active-belt,
.button-nav-vertical-2.active .active-belt,
.button-nav-vertical-2.force-active .active-belt {
  background: var(--blue-light-bg);
}
.button-nav-vertical-2:hover {
  background-color: #e1f4fb;
}
.button-nav-vertical-2.force-active {
  background-color: #e1f4fb;
}
.button-nav-vertical-2.force-active .label,
.button-nav-vertical-2.force-active .ico {
  color: var(--blue-dark-bg);
  opacity: 1;
}
.button-nav-vertical-2.is-disabled {
  pointer-events: none;
}
.button-nav-vertical-2.is-disabled .label,
.button-nav-vertical-2.is-disabled .ico {
  opacity: 0.2;
}
.button-nav-vertical-2.is-not-disabled {
  pointer-events: auto;
}
.button-nav-vertical-2.is-not-disabled .label,
.button-nav-vertical-2.is-not-disabled .ico {
  opacity: 1;
}
.button-nav-vertical-2-set {
  height: 46px;
  color: #000;
  font-size: 0.875rem;
  cursor: pointer;
  opacity: 0.7;
  font-weight: 400;
}
.button-nav-vertical-2-set .ico {
  font-size: 1rem;
  margin: 0 14px 0 17px;
  min-width: 16px;
  opacity: 0.7;
}
.button-nav-vertical-2-set .ico-left {
  transform: rotate(-90deg);
}
.button-nav-vertical-2-set .label {
  padding-left: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.7;
  font-size: 13px;
}
.button-nav-vertical-2-set:hover .ico {
  opacity: 1;
}
.button-nav-vertical-2-set:hover .label {
  opacity: 1;
}
.button-big-rectangle {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  width: 220px;
  height: 55px;
  background: #f7f7f7;
  text-decoration: none !important;
  cursor: pointer;
  border: none;
}
.button-big-rectangle span {
  margin: auto;
  color: #3b3b3b !important;
}
.button-big-rectangle:hover,
.button-big-rectangle:active,
.button-big-rectangle.active {
  background: #e4e4e4;
}
.button-big-rectangle.disabled {
  pointer-events: none;
  opacity: 0.2;
}
.button-big-rectangle.green {
  background: var(--green-light-bg);
}
.button-big-rectangle.green span {
  color: #fff !important;
}
.button-big-rectangle.green:hover,
.button-big-rectangle.green:active,
.button-big-rectangle.green.active {
  background: var(--green-dark-bg);
}
.button-big-rectangle.red {
  background: var(--red-light-bg);
}
.button-big-rectangle.red span {
  color: #fff !important;
}
.button-big-rectangle.red:hover,
.button-big-rectangle.red:active,
.button-big-rectangle.red.active {
  background: var(--red-dark-bg);
}
.button-big-rectangle.smaller {
  width: 180px;
  height: 45px;
}
.button-rect-ico {
  min-height: 42px;
  color: #7f7f7f;
  font-size: 0.95rem;
  border: 1px solid #e9e9e9;
  cursor: pointer;
  padding: 0 10px;
  background: #fff;
}
.button-rect-ico span {
  opacity: 1;
}
.button-rect-ico span:first-child {
  margin-right: 10px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.button-rect-ico span:last-child {
  font-size: 1.5rem;
}
.button-rect-ico:hover {
  background: #7f7f7f;
}
.button-rect-ico:hover span {
  color: #fff;
}
.button-rect-ico.active {
  cursor: default;
  background: #7f7f7f;
}
.button-rect-ico.active span {
  color: #fff;
  pointer-events: none;
}
.button-rect-ico.disabled {
  cursor: default;
  background: #fff !important;
}
.button-rect-ico.disabled span {
  color: #7f7f7f !important;
  pointer-events: none;
  opacity: 0.25;
}
/*# sourceMappingURL=button.css.map */