@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

:root {
  --primary: #2C3DBE;
  --primary-hover: #6B77D2;
  --primary-outline-hover: #DFE2F5;
  --primary-bg: #F1F2FF;
  --primary-text: #374089;
  --primary-bg-disabled: #E4E6FF;
  --primary-disabled: #A8ADDC;
  --default: #888888;
  --default-hover: #ACACAC;
  --default-outline-hover: #EDEDED;
  --default-bg: #F6F6F6;
  --default-text: #626262;
  --default-bg-disabled: #E7E7E7;
  --default-disabled: #B8B8B8;
  --success: #2C9960;
  --success-hover: #6BB890;
  --success-outline-hover: #DFF0E7;
  --success-bg: #EEFCF9;
  --success-text: #186E42;
  --success-bg-disabled: #D7EDDD;
  --success-disabled: #97BFA2;
  --warning: #F1A900;
  --warning-hover: #F5C34D;
  --warning-outline-hover: #FDF2D9;
  --warning-bg: #FFF9DF;
  --warning-text: #936E18;
  --warning-bg-disabled: #FAEDB2;
  --warning-disabled: #DFC076;
  --danger: #C70000;
  --danger-hover: #D84D4D;
  --danger-outline-hover: #F7D9D9;
  --danger-bg: #FFEBEB;
  --danger-text: #BA2424;
  --danger-bg-disabled: #FEDFDF;
  --danger-disabled: #DA9C9C;
  --lightblue: #00ACE0;
  --purple: #7C1CDC;
  --yellowgreen: #87C100;
  --pink: #EF4A89;
  --orange: #FF6911;
  --black: #000;
  --error: #C70000;
  --anchor: var(--primary);
  --anchor-visited: var(--primary);
  --anchor-hover: var(--primary-hover);
  --active: var(--primary);
  --placeholder: #666666;
  --border: #cccccc;
  --form-border: #B3B3B3;
  --bg-focus: #E8ECF8;
  --bg-gradation: linear-gradient(to right, #E4DAF7, #DDECFB);
  --bg-gradation-dark: linear-gradient(to right, #6250C8, #4671E4);
  --font-code: monospace;
}

html {
  min-width: 375px;
  font-size: 16px;
  line-height: 1.4;
  font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

p {
  margin: 0.9375rem 0;
  line-height: 1.4;
}
p + p {
  margin-top: -0.8rem;
}
p:last-child {
  margin-bottom: 0;
}

img {
  vertical-align: top;
}

ul,
ol {
  padding: 0;
  margin: 0;
}

.bi::before,
[class*=" bi-"]::before,
[class^=bi-]::before {
  font-size: 0.875rem;
}

.title {
  font-size: 1.5625rem;
  font-weight: 600;
}
@media (max-width: 600px) {
  .title {
    font-size: 1.1875rem;
  }
}

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

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

hr {
  border: none;
  border-top: 1px solid #ddd;
  height: 0;
  margin: 0.9375rem 0;
}

body {
  min-height: 100vh;
  padding: 1.25rem;
  background: var(--bg-gradation);
  font-family: sans-serif;
}
@media (max-width: 600px) {
  body {
    padding: 5.625rem 0.625rem 0.625rem;
  }
}
body [v-cloak] {
  opacity: 0;
}
body a:link {
  color: var(--anchor);
}
body a:visited {
  color: var(--anchor-visited);
}
body a:hover,
body a:active {
  color: var(--anchor-hover);
}
body *::-webkit-scrollbar {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #fff;
}
body *::-webkit-scrollbar-thumb {
  background: #D9D9D9;
  border: 3px solid #fff;
  border-radius: 8px;
}
body > .header {
  display: flex;
  align-items: center;
  z-index: 10;
  padding: 0.625rem 1.25rem;
  margin: 0 0 0.625rem 0;
  border-radius: 0.4375rem;
  background: var(--bg-gradation-dark);
  color: white;
}
@media (max-width: 600px) {
  body > .header {
    position: fixed;
    top: 0.625rem;
    left: 0.625rem;
    right: 0.625rem;
    height: 4.375rem;
    padding: 0.3125rem 0.9375rem;
    border-radius: 0.3125rem;
  }
}
body > .header .container {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
body > .header .navbar-brand {
  display: flex;
  align-items: center;
  gap: 0 0.625rem;
  padding: 0.5rem 0;
  margin: 0;
}
@media (max-width: 600px) {
  body > .header .navbar-brand {
    padding-top: 0;
  }
}
body > .header .navbar-brand .title {
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1;
}
@media (max-width: 600px) {
  body > .header .navbar-brand .title {
    font-size: 1.0625rem;
  }
}
body > .header .navbar-brand .sub-title {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
}
@media (max-width: 600px) {
  body > .header .navbar-brand .sub-title {
    font-size: 0.75rem;
  }
}
body > .header .navbar-nav {
  flex: 1 1 auto;
  margin-left: 1.25rem;
}
@media (max-width: 600px) {
  body > .header .navbar-nav {
    margin-left: 0;
  }
}
body > .header .navbar-nav .nav {
  display: flex;
  gap: 0 1.875rem;
  justify-content: flex-end;
}
@media (max-width: 1000px) {
  body > .header .navbar-nav .nav {
    gap: 0 1.25rem;
  }
}
@media (max-width: 600px) {
  body > .header .navbar-nav .nav {
    flex-wrap: wrap;
    gap: 0 0.625rem;
    align-items: flex-end;
  }
}
body > .header .navbar-nav .nav li {
  display: block;
}
@media (max-width: 600px) {
  body > .header .navbar-nav .nav li.nav-link.name {
    max-width: 150px;
  }
  body > .header .navbar-nav .nav li.nav-link.name button {
    display: inline-block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
body > .header .navbar-nav .nav li .qui-button {
  padding: 0.5rem 0;
  font-size: 0.875rem;
  font-weight: 600;
  transition: opacity 0.2s;
}
@media (max-width: 600px) {
  body > .header .navbar-nav .nav li .qui-button {
    padding: 0;
    font-size: 0.75rem;
  }
}
body > .header .navbar-nav .nav li .qui-button .bi::before {
  font-size: 1.125rem;
  color: rgba(255, 255, 255, 0.5);
}
@media (max-width: 600px) {
  body > .header .navbar-nav .nav li .qui-button .bi::before {
    font-size: 0.875rem;
  }
}
body > .header .navbar-nav .nav li .qui-button:hover {
  opacity: 0.7;
}
body > .header .sp-menu-wrap {
  display: none;
}
@media (max-width: 600px) {
  body > .header .sp-menu-wrap {
    flex: 0 0 1.25rem;
    height: 1.125rem;
  }
}
body > .header .sp-menu-button {
  width: 100%;
  height: 100%;
  padding: 0;
  border: unset;
  background-color: unset;
  position: relative;
}
body > .header .sp-menu-button span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
  transition: transform 0.2s, opacity 0.2s;
}
body > .header .sp-menu-button span:nth-child(1) {
  top: 0;
}
body > .header .sp-menu-button span:nth-child(2) {
  top: 8px;
}
body > .header .sp-menu-button span:nth-child(3) {
  top: 16px;
}
body > .header .sp-menu-button.open span {
  width: 24px;
}
body > .header .sp-menu-button.open span:nth-child(1) {
  transform: translate(-2px, 8px) rotate(-43deg);
}
body > .header .sp-menu-button.open span:nth-child(2) {
  opacity: 0;
}
body > .header .sp-menu-button.open span:nth-child(3) {
  transform: translate(-2px, -8px) rotate(43deg);
}
body #global-menu * {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #333;
}
body #global-menu .primary {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  gap: 0.0625rem;
}
body #global-menu .primary > .item {
  position: relative;
  white-space: nowrap;
}
body #global-menu .primary > .item > .a {
  display: block;
  position: relative;
  cursor: pointer;
  text-decoration: none;
  color: #000;
  font-weight: 600;
  font-size: 0.8125rem;
  padding: 0.375rem 0.625rem;
  overflow: hidden;
  text-overflow: ellipsis;
  transition-duration: 0.3s;
  border-radius: 4px;
}
body #global-menu .primary > .item > .a .bi::before {
  color: var(--active);
  font-size: 0.875rem;
  opacity: 0.85;
}
@media (max-width: 600px) {
  body #global-menu .primary > .item > .a:lang(en) {
    font-size: 0.75rem;
  }
}
@media (min-width: 601px) {
  body #global-menu .primary > .item > .a:hover {
    background: var(--active);
    color: #fff;
  }
}
@media (min-width: 601px) {
  body #global-menu .primary > .item > .a:hover .bi::before {
    color: #fff;
    opacity: 1;
  }
}
body #global-menu .primary > .item:hover .submenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
body #global-menu .primary > .item.active > .a {
  border-bottom: none;
  background: var(--active);
  color: #fff;
}
body #global-menu .primary > .item.active > .a .bi::before {
  color: #fff;
  opacity: 1;
}
body #global-menu .primary > .item > .submenu {
  position: absolute;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  min-width: 180px;
  border-radius: 4px;
  padding: 0.6875rem 0.625rem;
  z-index: 10;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 8px 5px rgba(0, 0, 0, 0.05);
}
body #global-menu .primary > .item > .submenu > .item .a {
  display: block;
  padding: 0.375rem 0.4375rem;
  text-decoration: none;
  color: #000;
  font-weight: 500;
  font-size: 0.8125rem;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 3px;
}
body #global-menu .primary > .item > .submenu > .item .a:hover {
  background-color: var(--bg-focus);
}
@media (min-width: 601px) {
  body #global-menu .primary > .item > .submenu > .item.active .a {
    background-color: var(--bg-focus);
    font-weight: 600;
  }
}
body #global-menu .primary > .item > .submenu > .item.depth1 a {
  padding-left: 1.0625rem;
}
body #global-menu .primary > .item > .submenu > .item + .item {
  margin-top: 0.0625rem;
}
body #global-menu .primary > .item > .submenu.right {
  right: 0;
}
body #global-menu .secondary {
  position: relative;
  margin: 0.9375rem 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.3125rem;
}
body #global-menu .secondary > .item {
  transition-duration: 0.3s;
}
body #global-menu .secondary > .item > .a {
  position: relative;
  display: block;
  padding: 0.46875rem 0.8125rem;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition-duration: 0.3s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background-color: #fff;
  color: #000;
  font-size: 0.8125rem;
  font-weight: 500;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
body #global-menu .secondary > .item > .a:hover {
  background: var(--active);
  color: #fff;
}
body #global-menu .secondary > .item > .a:hover .bi {
  color: #fff;
}
body #global-menu .secondary > .item.active > .a {
  background: var(--active);
  color: #fff;
  font-weight: 600;
}
body #global-menu .secondary > .item.active > .a .bi {
  color: #fff;
}
body .sp-menu {
  position: fixed;
  top: 4.6875rem;
  left: 0.625rem;
  right: 0.625rem;
  z-index: 899;
  max-height: calc(100vh - 5.3125rem);
  max-height: calc(100dvh - 5.3125rem);
  padding: 0.9375rem;
  border-radius: 0.3125rem;
  background-color: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
  box-shadow: 0 8px 5px rgba(0, 0, 0, 0.05);
  overflow-y: auto;
}
body .sp-menu.open {
  opacity: 1;
  visibility: visible;
}
body .sp-menu .navbar-nav .nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3125rem;
  list-style: none;
}
body .sp-menu .navbar-nav .nav li {
  flex: 1 1 calc((100% - 0.3125rem) / 2);
}
body .sp-menu .navbar-nav .nav li .qui-button {
  width: 100%;
  padding: 0.625rem;
  background-color: var(--primary-bg);
  color: #000;
  font-size: 0.8125rem;
  font-weight: 600;
}
body .sp-menu .navbar-nav .nav li .qui-button .bi::before {
  color: var(--primary-disabled);
  font-size: 1rem;
}
body .sp-menu .navbar-nav .nav li.nav-link {
  display: flex;
  gap: 0 1rem;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 0.625rem;
  background-color: var(--primary-bg);
  color: #000;
}
@media (max-width: 600px) {
  body .sp-menu .navbar-nav .nav li.nav-link {
    gap: 0.2rem 0.5rem;
  }
}
body .sp-menu .navbar-nav .nav li.nav-link .qui-button.disabled {
  width: unset;
  padding: 0;
}
body .sp-menu .navbar-nav .nav li.nav-link .account-type {
  padding: 0;
  border: none;
}
body .sp-menu .navbar-nav .nav li.nav-link .account-type::before, body .sp-menu .navbar-nav .nav li.nav-link .account-type::after {
  font-feature-settings: "palt";
}
body .sp-menu .navbar-nav .nav li.nav-link .account-type::before {
  content: "（";
}
body .sp-menu .navbar-nav .nav li.nav-link .account-type::after {
  content: "）";
}
body .sp-menu .navbar-nav + #global-menu {
  margin-top: 0.9375rem;
}
body .sp-menu #global-menu .primary {
  display: block;
}
body .sp-menu #global-menu .primary > .item {
  border-bottom: 1px solid #D1D1D1;
}
body .sp-menu #global-menu .primary > .item:first-of-type {
  border-top: 1px solid #D1D1D1;
}
body .sp-menu #global-menu .primary > .item.has-children > .a {
  pointer-events: none;
  position: relative;
}
body .sp-menu #global-menu .primary > .item.has-children > .a::before, body .sp-menu #global-menu .primary > .item.has-children > .a::after {
  position: absolute;
  top: 50%;
  right: 0.9375rem;
  transform: translateY(-50%);
  display: block;
  content: "";
  width: 0.875rem;
  height: 0.0625rem;
  background-color: var(--active);
}
body .sp-menu #global-menu .primary > .item.has-children > .a::after {
  transform: translateY(-50%) rotate(90deg);
  transition: transform 0.2s;
}
body .sp-menu #global-menu .primary > .item.has-children.open > .a::after {
  transform: translateY(-50%) rotate(0);
}
body .sp-menu #global-menu .primary > .item.has-children.open > .submenu {
  opacity: 1;
  visibility: visible;
  position: relative;
  top: -4px;
  padding-bottom: 0.3125rem;
}
body .sp-menu #global-menu .primary > .item.has-children.open > .submenu > .item > .a {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-size: 0.875rem;
}
body .sp-menu #global-menu .primary > .item.has-children.open > .submenu > .item > .a .bi::before {
  font-size: 1rem;
}
body .sp-menu #global-menu .primary > .item.has-children.open > .submenu > .item + .item {
  margin-top: 0.0625rem;
}
body .sp-menu #global-menu .primary > .item > .a {
  padding: 0.9375rem;
  font-size: 0.875rem;
}
body .sp-menu #global-menu .primary > .item > .a .bi {
  margin-right: 0.25rem;
}
body .sp-menu #global-menu .primary > .item > .a .bi::before {
  color: var(--active);
}
body .sp-menu #global-menu .primary > .item > .submenu {
  position: unset;
  width: unset;
  padding: 0;
  margin-left: 2.125rem;
  background-color: unset;
  border-radius: unset;
  box-shadow: unset;
}
body .sp-menu #global-menu .primary > .item > .submenu > .item > .a {
  padding-top: 0;
  padding-bottom: 0;
  color: #666;
  font-size: 0;
  font-weight: 600;
  transition: padding 0.2s;
}
body .sp-menu #global-menu .primary > .item > .submenu > .item > .a .bi::before {
  font-size: 0;
}
body .sp-menu #global-menu .primary > .item > .submenu > .item + .item {
  margin-top: 0;
  transition: margin 0.2s;
}
body .sp-menu #global-menu .primary > .item.active > .a {
  background: unset;
  color: var(--active);
}
body .sp-menu #global-menu .primary > .item.active > .submenu > .active .a {
  color: var(--active);
}
body .sp-menu #global-menu .primary > .item.active > .submenu > .active .a .bi::before {
  color: var(--active);
}
body .sp-menu #global-menu .secondary {
  display: none;
}
body > .main {
  margin: 1.25rem 0 0;
  /*.header {
      display: flex;
      padding: .8rem 0;
      margin: 0 0 2rem;
      align-items: center;

      .h2 {
          color: #666;
          margin: 0;
          font-size: px-to-rem(14);
          line-height: 1.1;

          +.h3 {
              margin-left: 12px;
          }
      }

      .h3 {
          color: #555;
          margin: 0;
          font-size: 1.8rem;
          line-height: 1.1;
      }
  }*/
}
@media (max-width: 600px) {
  body > .main {
    padding-top: 0.625rem;
    margin: 0;
  }
}

.card-body {
  font-size: 0.8125rem;
}

.qui-window {
  border-radius: 7px;
  padding: 1.25rem;
  background: white;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 600px) {
  .qui-window {
    padding: 0.9375rem;
  }
}

.page-header {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #ddd;
  padding-bottom: 0.6rem;
  margin-bottom: 1rem;
}
@media (max-width: 600px) {
  .page-header {
    flex-direction: column;
    gap: 0.625rem 0;
  }
}
.page-header .titles {
  flex: 1 1 auto;
}
.page-header .titles .subtitle {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--primary);
}
.page-header .titles .title {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-all;
}
.page-header .titles .comment {
  margin-top: 0.375rem;
}
.page-header .controls .add-button {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.page-header .controls .add-button .qui-button {
  min-width: 123px !important;
  padding: 0.625rem;
  font-size: 0.8125rem;
  line-height: 1;
}

@keyframes loading-rotate {
  to {
    transform: rotate(1turn);
  }
}
.qui-form {
  position: relative;
}
.qui-form.loading .qui-form-row {
  opacity: 0.8;
  pointer-events: none;
}
.qui-form.loading .button {
  opacity: 0.5;
  pointer-events: none;
}
.qui-form fieldset {
  padding: 0.625rem 0.625rem 1.25rem;
  margin: 0;
  border: unset;
  border-radius: 0.3125rem;
  outline: 1px solid #999;
}
.qui-form fieldset legend {
  width: 100%;
  position: relative;
  top: 10px;
}
.qui-form fieldset .qui-form-row-title {
  padding: 0.6875rem 0.9375rem;
  margin: 1.25rem 0 1.125rem;
  border-radius: 0.3125rem;
  background-color: #E8E8E8;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.18;
}
.qui-form fieldset .qui-form-row-title:first-child {
  margin-top: 0;
}
@media (min-width: 601px) {
  .qui-form fieldset > .qui-form-row,
  .qui-form fieldset > .qui-form-row-columns {
    margin-right: 0.625rem;
    margin-left: 0.625rem;
  }
}
.qui-form fieldset > .qui-form-row:first-child,
.qui-form fieldset > .qui-form-row-columns:first-child {
  margin-top: 0.3125rem;
}
.qui-form fieldset + fieldset,
.qui-form fieldset + .qui-form-row,
.qui-form fieldset + .qui-form-row-columns {
  margin-top: 1.75rem;
}
.qui-form fieldset > fieldset {
  padding: 0;
  border-radius: 0;
  outline: unset;
}
.qui-form fieldset > fieldset legend {
  position: unset;
  top: unset;
}
@media (min-width: 601px) {
  .qui-form .qui-form-row-group {
    padding: 1rem;
  }
}
@media (min-width: 601px) {
  .qui-form .qui-form-row-group.row .qui-form-row {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
  }
}
.qui-form .qui-form-row-group.row .label {
  font-size: 0.9375rem;
  font-weight: 500;
}
@media (min-width: 601px) {
  .qui-form .qui-form-row-group.row .label {
    flex: 0 0 110px;
    display: flex;
    flex-wrap: wrap;
    gap: 0.125rem 0.3125rem;
    align-items: center;
    min-height: 50px;
  }
}
@media (min-width: 601px) {
  .qui-form .qui-form-row-group.row .input {
    flex: 1 1 auto;
  }
}
.qui-form .qui-form-row-columns {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1.875rem;
  margin: 0;
}
.qui-form .qui-form-row-columns .qui-form-row + .qui-form-row {
  margin-top: 0;
}
.qui-form .qui-form-row-columns + .qui-form-row,
.qui-form .qui-form-row-columns + .qui-form-row-columns {
  margin-top: 1.75rem;
}
.qui-form .qui-form-row-columns.qui-cols-1-1 .qui-form-row {
  flex-basis: calc(50% - 15px);
}
.qui-form .qui-form-row-columns.qui-cols-1-2 .qui-form-row:first-child {
  flex-basis: calc(33% - 15px);
}
.qui-form .qui-form-row-columns.qui-cols-1-2 .qui-form-row:last-child {
  flex-basis: calc(66% - 15px);
}
.qui-form .qui-form-row-columns.qui-cols-2-1 .qui-form-row:first-child {
  flex-basis: calc(66% - 15px);
}
.qui-form .qui-form-row-columns.qui-cols-2-1 .qui-form-row:last-child {
  flex-basis: calc(33% - 15px);
}
.qui-form .qui-form-row {
  transition-duration: 0.2s;
}
.qui-form .qui-form-row.width-5 {
  width: 5rem;
}
.qui-form .qui-form-row.width-10 {
  width: 10rem;
}
.qui-form .qui-form-row.width-15 {
  width: 15rem;
}
.qui-form .qui-form-row.width-20 {
  width: 20rem;
}
.qui-form .qui-form-row.width-25 {
  width: 25rem;
}
.qui-form .qui-form-row.width-30 {
  width: 30rem;
}
.qui-form .qui-form-row.width-35 {
  width: 35rem;
}
.qui-form .qui-form-row.width-40 {
  width: 40rem;
}
.qui-form .qui-form-row.width-45 {
  width: 45rem;
}
.qui-form .qui-form-row.width-50 {
  width: 50rem;
}
.qui-form .qui-form-row .label {
  padding: 0.125rem 0;
  font-size: 0.9375rem;
  font-weight: 600;
}
.qui-form .qui-form-row .label .required {
  display: inline-block;
  background-color: var(--error);
  font-size: 0.5625rem;
  font-weight: 600;
  color: white;
  padding: 0.125rem 0.3125rem 0.09375rem;
  margin: 0 0.125rem;
  border-radius: 3px;
  white-space: nowrap;
  position: relative;
  top: -2px;
}
.qui-form .qui-form-row .label + .input {
  margin-top: 0.1875rem;
}
.qui-form .qui-form-row .input .help {
  margin: 0.3125rem 0;
  font-size: 0.75rem;
}
.qui-form .qui-form-row .input .help a {
  display: inline-block;
  line-height: 1.9;
}
.qui-form .qui-form-row .input .error {
  margin: 0.3125rem 0;
  font-size: 0.75rem;
  color: var(--error);
}
.qui-form .qui-form-row .input .error .bi::before {
  font-size: 1rem;
  position: relative;
  bottom: -1px;
}
.qui-form .qui-form-row + .qui-form-row,
.qui-form .qui-form-row + .qui-form-row-columns {
  margin-top: 1.25rem;
}
.qui-form .qui-form-row + hr {
  margin: 1.25rem 0;
}
.qui-form .qui-form-row .add-link-button {
  margin-top: 0.4rem;
}

.qui-form-control {
  display: flex;
  gap: 0 0.625rem;
  position: relative;
  align-items: center;
  box-sizing: border-box;
}
.qui-form-control .qui-form-label {
  white-space: nowrap;
  font-weight: 600;
}
.qui-form-control .qui-form-label.unit {
  margin-left: -0.3rem;
  font-weight: 500;
}
.qui-form-control .qui-form-control-label {
  display: block;
  margin-bottom: 2px;
  color: #777;
  font-size: 0.75rem;
  font-weight: 600;
}
.qui-form-control .qui-form-control-input {
  position: relative;
  flex: 1 1 auto;
}
.qui-form-control .qui-form-control-input > [type=text],
.qui-form-control .qui-form-control-input > [type=number],
.qui-form-control .qui-form-control-input > [type=email],
.qui-form-control .qui-form-control-input > [type=password],
.qui-form-control .qui-form-control-input > [type=date],
.qui-form-control .qui-form-control-input > [type=time],
.qui-form-control .qui-form-control-input > [type=tel],
.qui-form-control .qui-form-control-input > [type=search],
.qui-form-control .qui-form-control-input > textarea,
.qui-form-control .qui-form-control-input > select,
.qui-form-control .qui-form-control-input .dummy-input {
  display: block;
  border: 1px solid var(--form-border);
  padding: 0.375rem 0.625rem;
  border-radius: 5px;
  font-size: 0.875rem;
  width: 100%;
  min-height: 36px;
  line-height: 1.3;
  box-sizing: border-box;
  transition: border-color 0.2s;
}
@media (max-width: 600px) {
  .qui-form-control .qui-form-control-input > [type=text],
  .qui-form-control .qui-form-control-input > [type=number],
  .qui-form-control .qui-form-control-input > [type=email],
  .qui-form-control .qui-form-control-input > [type=password],
  .qui-form-control .qui-form-control-input > [type=date],
  .qui-form-control .qui-form-control-input > [type=time],
  .qui-form-control .qui-form-control-input > [type=tel],
  .qui-form-control .qui-form-control-input > [type=search],
  .qui-form-control .qui-form-control-input > textarea,
  .qui-form-control .qui-form-control-input > select,
  .qui-form-control .qui-form-control-input .dummy-input {
    font-size: 16px;
  }
}
.qui-form-control .qui-form-control-input > [type=text]:autofill,
.qui-form-control .qui-form-control-input > [type=number]:autofill,
.qui-form-control .qui-form-control-input > [type=email]:autofill,
.qui-form-control .qui-form-control-input > [type=password]:autofill,
.qui-form-control .qui-form-control-input > [type=date]:autofill,
.qui-form-control .qui-form-control-input > [type=time]:autofill,
.qui-form-control .qui-form-control-input > [type=tel]:autofill,
.qui-form-control .qui-form-control-input > [type=search]:autofill,
.qui-form-control .qui-form-control-input > textarea:autofill,
.qui-form-control .qui-form-control-input > select:autofill,
.qui-form-control .qui-form-control-input .dummy-input:autofill {
  box-shadow: 0 0 0 1000px var(--bg-focus) inset;
}
.qui-form-control .qui-form-control-input > [type=text]::placeholder,
.qui-form-control .qui-form-control-input > [type=number]::placeholder,
.qui-form-control .qui-form-control-input > [type=email]::placeholder,
.qui-form-control .qui-form-control-input > [type=password]::placeholder,
.qui-form-control .qui-form-control-input > [type=date]::placeholder,
.qui-form-control .qui-form-control-input > [type=time]::placeholder,
.qui-form-control .qui-form-control-input > [type=tel]::placeholder,
.qui-form-control .qui-form-control-input > [type=search]::placeholder,
.qui-form-control .qui-form-control-input > textarea::placeholder,
.qui-form-control .qui-form-control-input > select::placeholder,
.qui-form-control .qui-form-control-input .dummy-input::placeholder {
  color: #B3B3B3;
}
.qui-form-control .qui-form-control-input > [type=text]:focus,
.qui-form-control .qui-form-control-input > [type=number]:focus,
.qui-form-control .qui-form-control-input > [type=email]:focus,
.qui-form-control .qui-form-control-input > [type=password]:focus,
.qui-form-control .qui-form-control-input > [type=date]:focus,
.qui-form-control .qui-form-control-input > [type=time]:focus,
.qui-form-control .qui-form-control-input > [type=tel]:focus,
.qui-form-control .qui-form-control-input > [type=search]:focus,
.qui-form-control .qui-form-control-input > textarea:focus,
.qui-form-control .qui-form-control-input > select:focus,
.qui-form-control .qui-form-control-input .dummy-input:focus {
  outline: none;
  border-color: var(--active);
}
.qui-form-control .qui-form-control-input > [type=text].size-large,
.qui-form-control .qui-form-control-input > [type=number].size-large,
.qui-form-control .qui-form-control-input > [type=email].size-large,
.qui-form-control .qui-form-control-input > [type=password].size-large,
.qui-form-control .qui-form-control-input > [type=date].size-large,
.qui-form-control .qui-form-control-input > [type=time].size-large,
.qui-form-control .qui-form-control-input > [type=tel].size-large,
.qui-form-control .qui-form-control-input > [type=search].size-large,
.qui-form-control .qui-form-control-input > textarea.size-large,
.qui-form-control .qui-form-control-input > select.size-large,
.qui-form-control .qui-form-control-input .dummy-input.size-large {
  min-height: 50px;
  font-size: 1rem;
}
.qui-form-control .qui-form-control-input > [type=text].size-small,
.qui-form-control .qui-form-control-input > [type=number].size-small,
.qui-form-control .qui-form-control-input > [type=email].size-small,
.qui-form-control .qui-form-control-input > [type=password].size-small,
.qui-form-control .qui-form-control-input > [type=date].size-small,
.qui-form-control .qui-form-control-input > [type=time].size-small,
.qui-form-control .qui-form-control-input > [type=tel].size-small,
.qui-form-control .qui-form-control-input > [type=search].size-small,
.qui-form-control .qui-form-control-input > textarea.size-small,
.qui-form-control .qui-form-control-input > select.size-small,
.qui-form-control .qui-form-control-input .dummy-input.size-small {
  min-height: 30px;
  padding: 0.375rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 3px;
}
.has-error .qui-form-control .qui-form-control-input > [type=text],
.has-error .qui-form-control .qui-form-control-input > [type=number],
.has-error .qui-form-control .qui-form-control-input > [type=email],
.has-error .qui-form-control .qui-form-control-input > [type=password],
.has-error .qui-form-control .qui-form-control-input > [type=date],
.has-error .qui-form-control .qui-form-control-input > [type=time],
.has-error .qui-form-control .qui-form-control-input > [type=tel],
.has-error .qui-form-control .qui-form-control-input > [type=search],
.has-error .qui-form-control .qui-form-control-input > textarea,
.has-error .qui-form-control .qui-form-control-input > select,
.has-error .qui-form-control .qui-form-control-input .dummy-input {
  border-color: var(--danger);
  background-color: #ffeae3;
}
.qui-form-control .qui-form-control-input > [type=text].show-left,
.qui-form-control .qui-form-control-input > [type=number].show-left,
.qui-form-control .qui-form-control-input > [type=email].show-left,
.qui-form-control .qui-form-control-input > [type=password].show-left,
.qui-form-control .qui-form-control-input > [type=date].show-left,
.qui-form-control .qui-form-control-input > [type=time].show-left,
.qui-form-control .qui-form-control-input > [type=tel].show-left,
.qui-form-control .qui-form-control-input > [type=search].show-left,
.qui-form-control .qui-form-control-input > textarea.show-left,
.qui-form-control .qui-form-control-input > select.show-left,
.qui-form-control .qui-form-control-input .dummy-input.show-left {
  padding-left: 1.875rem;
}
.qui-form-control .qui-form-control-input > [type=text].show-left + .show,
.qui-form-control .qui-form-control-input > [type=number].show-left + .show,
.qui-form-control .qui-form-control-input > [type=email].show-left + .show,
.qui-form-control .qui-form-control-input > [type=password].show-left + .show,
.qui-form-control .qui-form-control-input > [type=date].show-left + .show,
.qui-form-control .qui-form-control-input > [type=time].show-left + .show,
.qui-form-control .qui-form-control-input > [type=tel].show-left + .show,
.qui-form-control .qui-form-control-input > [type=search].show-left + .show,
.qui-form-control .qui-form-control-input > textarea.show-left + .show,
.qui-form-control .qui-form-control-input > select.show-left + .show,
.qui-form-control .qui-form-control-input .dummy-input.show-left + .show {
  left: 0.625rem;
}
.qui-form-control .qui-form-control-input > [type=text].show-right,
.qui-form-control .qui-form-control-input > [type=number].show-right,
.qui-form-control .qui-form-control-input > [type=email].show-right,
.qui-form-control .qui-form-control-input > [type=password].show-right,
.qui-form-control .qui-form-control-input > [type=date].show-right,
.qui-form-control .qui-form-control-input > [type=time].show-right,
.qui-form-control .qui-form-control-input > [type=tel].show-right,
.qui-form-control .qui-form-control-input > [type=search].show-right,
.qui-form-control .qui-form-control-input > textarea.show-right,
.qui-form-control .qui-form-control-input > select.show-right,
.qui-form-control .qui-form-control-input .dummy-input.show-right {
  padding-right: 1.875rem;
}
.qui-form-control .qui-form-control-input > [type=text].show-right + .show,
.qui-form-control .qui-form-control-input > [type=number].show-right + .show,
.qui-form-control .qui-form-control-input > [type=email].show-right + .show,
.qui-form-control .qui-form-control-input > [type=password].show-right + .show,
.qui-form-control .qui-form-control-input > [type=date].show-right + .show,
.qui-form-control .qui-form-control-input > [type=time].show-right + .show,
.qui-form-control .qui-form-control-input > [type=tel].show-right + .show,
.qui-form-control .qui-form-control-input > [type=search].show-right + .show,
.qui-form-control .qui-form-control-input > textarea.show-right + .show,
.qui-form-control .qui-form-control-input > select.show-right + .show,
.qui-form-control .qui-form-control-input .dummy-input.show-right + .show {
  right: 0.625rem;
}
.qui-form-control .qui-form-control-input > [type=text].disabled, .qui-form-control .qui-form-control-input > [type=text][disabled],
.qui-form-control .qui-form-control-input > [type=number].disabled,
.qui-form-control .qui-form-control-input > [type=number][disabled],
.qui-form-control .qui-form-control-input > [type=email].disabled,
.qui-form-control .qui-form-control-input > [type=email][disabled],
.qui-form-control .qui-form-control-input > [type=password].disabled,
.qui-form-control .qui-form-control-input > [type=password][disabled],
.qui-form-control .qui-form-control-input > [type=date].disabled,
.qui-form-control .qui-form-control-input > [type=date][disabled],
.qui-form-control .qui-form-control-input > [type=time].disabled,
.qui-form-control .qui-form-control-input > [type=time][disabled],
.qui-form-control .qui-form-control-input > [type=tel].disabled,
.qui-form-control .qui-form-control-input > [type=tel][disabled],
.qui-form-control .qui-form-control-input > [type=search].disabled,
.qui-form-control .qui-form-control-input > [type=search][disabled],
.qui-form-control .qui-form-control-input > textarea.disabled,
.qui-form-control .qui-form-control-input > textarea[disabled],
.qui-form-control .qui-form-control-input > select.disabled,
.qui-form-control .qui-form-control-input > select[disabled],
.qui-form-control .qui-form-control-input .dummy-input.disabled,
.qui-form-control .qui-form-control-input .dummy-input[disabled] {
  background-color: var(--default-bg-disabled);
}
.qui-form-control .qui-form-control-input > select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}
.qui-form-control .qui-form-control-input.has-icon input,
.qui-form-control .qui-form-control-input.has-icon .dummy-input {
  padding-left: 1.875rem;
}
.qui-form-control .qui-form-control-input.has-icon input.size-large, .qui-form-control .qui-form-control-input.has-icon input.size-small,
.qui-form-control .qui-form-control-input.has-icon .dummy-input.size-large,
.qui-form-control .qui-form-control-input.has-icon .dummy-input.size-small {
  padding-left: 1.875rem;
}
.qui-form-control .qui-form-control-input.select {
  display: block;
  position: relative;
  background-color: #fff;
  border-radius: 3px;
}
.qui-form-control .qui-form-control-input.select::before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.875rem;
  z-index: 0;
  content: "\f282";
  display: inline-block;
  font-size: 0.75rem;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
}
.has-error .qui-form-control .qui-form-control-input.select {
  border-color: var(--danger);
  background-color: #ffeae3;
}
.qui-form-control .qui-form-control-input.select select {
  position: relative;
  z-index: 1;
  padding: 0.375rem 1.875rem 0.375rem 0.625rem;
  background-color: unset;
}
.qui-form-control .qui-form-control-input.select select.size-small {
  padding: 0.375rem 1.5625rem 0.375rem 0.625rem;
}
.qui-form-control .icon {
  position: absolute;
  top: 50%;
  left: 0.625rem;
  transform: translateY(-50%);
  color: #999;
}
.qui-form-control .show {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-code);
  line-height: 1;
  cursor: pointer;
}

.qui-checkboxes,
.qui-radios {
  display: flex;
  align-items: center;
  gap: 0.4375rem 1rem;
  flex-wrap: wrap;
  min-height: 36px;
  padding: 0.3125rem 0;
}
.qui-checkboxes .qui-checkbox > label,
.qui-checkboxes .qui-radio > label,
.qui-radios .qui-checkbox > label,
.qui-radios .qui-radio > label {
  display: flex;
  gap: 0 0.3125rem;
  align-content: center;
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1;
}
@media (max-width: 600px) {
  .qui-checkboxes .qui-checkbox > label,
  .qui-checkboxes .qui-radio > label,
  .qui-radios .qui-checkbox > label,
  .qui-radios .qui-radio > label {
    font-size: 16px;
  }
}
.has-error .qui-checkboxes .qui-checkbox > label,
.has-error .qui-checkboxes .qui-radio > label,
.has-error .qui-radios .qui-checkbox > label,
.has-error .qui-radios .qui-radio > label {
  color: var(--danger);
}
.qui-checkboxes.align-vertical,
.qui-radios.align-vertical {
  flex-direction: column;
  align-items: flex-start;
}

.qui-checkbox.single {
  margin: 0.5rem 0;
}
.qui-checkbox.single label {
  display: inline-flex;
  gap: 0 0.5rem;
  align-items: center;
  cursor: pointer;
}
.qui-checkbox.single label .label {
  font-weight: 600;
}

label {
  /*position: relative;

  &::before,
  &::after {
      position: absolute;
      display: block;
      content: "";
  }

  &::before {
      top: 0;
      left: 0;
      border: 1px solid #666;
  }

  &::after {
      opacity: 0;
      visibility: hidden;
      transition: opacity .2s, visibility .2s;
  }

  &:has(input[type="checkbox"]) {
      &::before {
          width: 15px;
          height: 15px;
          border-radius: 2px;
          transition: border-color .2s, background-color .2s;
      }

      &::after {
          top: 4.5px;
          left: 4px;
          width: 7px;
          height: 4px;
          transform: rotate(-45deg);
          border-left: 1.5px solid #fff;
          border-bottom: 1.5px solid #fff;
      }
  }

  &:has(input[type="radio"]) {
      &::before {
          width: 14px;
          height: 14px;
          border-radius: 8px;
          transition: border-color .2s, background-color .2s;
      }

      &::after {
          top: 2px;
          left: 2px;
          width: 10px;
          height: 10px;
          border-radius: 5px;
          transform: rotate(-45deg);
          background: var(--primary);
      }
  }

  &:has(input[type="checkbox"]:checked) {
      &::before {
          border-color: var(--primary);
          background: var(--primary);
      }
      &::after {
          opacity: 1;
          visibility: visible;
      }
  }

  &:has(input[type="radio"]:checked) {
      &::before {
          border-color: var(--primary);
      }
      &::after {
          opacity: 1;
          visibility: visible;
      }
  }

  >[type="checkbox"],
  >[type="radio"] {
      opacity: 0;
  }*/
}

.qui-input-file .qui-select-file {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1.25rem;
  align-items: center;
  margin: 0 0 1.25rem;
}
.qui-input-file .qui-select-file .qui-button.size-small {
  padding: 0.5625rem 0.9375rem;
  font-size: 0.875rem;
}
.qui-input-file .qui-file-settings {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3125rem 0.875rem;
}
.qui-input-file .qui-file-settings dl {
  display: flex;
  align-items: center;
  margin: 0;
  gap: 0.375rem 0.3125rem;
  font-size: 0.95rem;
}
.qui-input-file .qui-file-settings dl dt {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
}
.qui-input-file .qui-file-settings dl dt::after {
  display: inline-block;
  content: "";
  width: 0.0625rem;
  height: 0.8125rem;
  margin: 0 0.125rem 0 0.4375rem;
  background-color: #000;
  font-weight: normal;
  position: relative;
  top: 0.0625rem;
}
.qui-input-file .qui-file-settings dl dd {
  margin: 0;
}
.qui-input-file .qui-file-settings dl dd.size, .qui-input-file .qui-file-settings dl dd.width {
  color: #666;
  font-size: 0.8125rem;
  font-weight: 600;
}
.qui-input-file .qui-file-settings dl .extensions .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3125rem;
}
.qui-input-file .qui-file-settings dl .extensions .tags .tag {
  background-color: #EDEAEA;
  color: #666;
  font-weight: 600;
  padding: 0.125rem 0.78125rem;
  border-radius: 3px;
  font-size: 0.8125rem;
}
.qui-input-file .qui-upload {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem 0.625rem;
  padding: 1.25rem 1.25rem 1.875rem;
  border-radius: 5px;
  background-color: #EDEAEA;
}
.qui-input-file .qui-upload span.file {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.5;
}
.qui-input-file .qui-upload .qui-complete-title {
  padding-top: 2.875rem;
  margin: 0.5rem 0 -2.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: center;
  position: relative;
}
.qui-input-file .qui-upload .qui-complete-title::before {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
  content: "\f633";
  display: inline-block;
  color: var(--primary);
  font-size: 2.7rem;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
}
.qui-input-file .qui-preview {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  justify-content: center;
  align-items: center;
  padding: 1.875rem;
  background-color: #EDEAEA;
  border-radius: 5px;
}
.qui-input-file .qui-preview * {
  line-height: 1;
}
.qui-input-file .qui-preview picture {
  --bg: #6f6f6f80;
  background-color: #b7b7b7;
  background-image: linear-gradient(45deg, var(--bg) 25%, transparent 25%, transparent 75%, var(--bg) 75%), linear-gradient(45deg, var(--bg) 25%, transparent 25%, transparent 75%, var(--bg) 75%);
  background-position: 0.625rem 0.625rem, 0.9375rem 0.9375rem;
  background-size: 0.625rem 0.625rem;
}
.qui-input-file .qui-preview picture img {
  display: block;
  max-width: 300px;
}
@media (max-width: 600px) {
  .qui-input-file .qui-preview picture img {
    max-width: 200px;
  }
}
.qui-input-file .qui-upload-file-name {
  display: flex;
  gap: 0.625rem;
  justify-content: center;
  align-items: center;
}
.qui-input-file .qui-upload-file-name .qui-button.size-small {
  padding: 0.5625rem 0.8125rem;
  font-size: 0.75rem;
}
.qui-input-file .qui-upload-file-name .qui-button.size-small .bi::before {
  font-size: 0.6875rem;
}
.qui-input-file .file {
  font-size: 0.8125rem;
  font-family: var(--font-code);
}

.qui-date-picker {
  position: relative;
  width: 150px;
}
.qui-date-picker .qui-calendar-mat {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100;
}
.qui-date-picker .qui-calendar {
  position: absolute;
  bottom: 2.5rem;
  z-index: 1000;
  background: white;
  --date-width: 28px;
  padding: 0.625rem;
  border-radius: 5px;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.2);
}
.qui-date-picker .qui-calendar.position-under {
  bottom: auto;
  top: 2.5rem;
}
.qui-date-picker .qui-calendar > .inner {
  width: calc(var(--date-width) * 7);
}
.qui-date-picker .qui-calendar .qui-calendar-nav {
  margin: 0 0 0.3125rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.qui-date-picker .qui-calendar .qui-calendar-nav .prev,
.qui-date-picker .qui-calendar .qui-calendar-nav .next {
  padding: 0 0.1875rem;
  font-size: 0.9rem;
  cursor: pointer;
}
.qui-date-picker .qui-calendar .qui-calendar-nav .select {
  position: relative;
  display: inline-block;
  border-radius: 3px;
  border: 1px solid var(--border);
}
.qui-date-picker .qui-calendar .qui-calendar-nav .select select {
  appearance: none;
  border: none;
  padding: 0.15rem 1.2rem 0.15rem 0.3rem;
  cursor: pointer;
  background: transparent;
}
.qui-date-picker .qui-calendar .qui-calendar-nav .select .bi {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.1875rem;
  pointer-events: none;
  font-size: 0.7rem;
}
.qui-date-picker .qui-calendar .qui-calendar-dates {
  display: flex;
  flex-wrap: wrap;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .date {
  flex: 0 0 var(--date-width);
  aspect-ratio: 1;
  text-align: center;
  line-height: var(--date-width);
  border-radius: 2px;
  transition: opacity 0.2s;
  font-size: 0.9rem;
  font-weight: 500;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .date.selected {
  background-color: rgb(252, 218, 105);
  font-weight: 600;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .date.active {
  cursor: pointer;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .date.active:hover {
  background: var(--anchor-hover);
  color: white;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .day-0 {
  color: #e65c5c;
}
.qui-date-picker .qui-calendar .qui-calendar-dates .day-6 {
  color: #26819d;
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-1 {
  margin-left: var(--date-width);
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-2 {
  margin-left: calc(var(--date-width) * 2);
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-3 {
  margin-left: calc(var(--date-width) * 3);
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-4 {
  margin-left: calc(var(--date-width) * 4);
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-5 {
  margin-left: calc(var(--date-width) * 5);
}
.qui-date-picker .qui-calendar .qui-calendar-dates :first-child.day-6 {
  margin-left: calc(var(--date-width) * 6);
}

.qui-time-picker {
  display: flex;
  gap: 0 0.3125rem;
  align-items: center;
}
.qui-time-picker > span {
  position: relative;
  width: 45px;
}
.qui-time-picker > span input {
  font-size: 0.9375rem;
  text-align: center;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.qui-time-picker > span .items {
  position: absolute;
  bottom: 2.5rem;
  z-index: 100;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.2);
  max-height: 30vh;
  overflow-y: auto;
  overflow-x: hidden;
}
.qui-time-picker > span .items.position-under {
  bottom: auto;
  top: 2.5rem;
}
.qui-time-picker > span .items .item {
  margin-top: -0.0625rem;
  border: 1px solid var(--border);
  padding: 0.2rem 1rem;
  background-color: white;
  cursor: pointer;
}
.qui-time-picker > span .items .item:hover {
  background-color: var(--primary-hover);
  color: white;
}
.qui-time-picker > span .items .item:first-child {
  border-radius: 4px 4px 0 0;
}
.qui-time-picker > span .items .item:last-child {
  border-radius: 0 0 4px 4px;
}

.qui-date-time-picker {
  display: flex;
  gap: 0 0.5rem;
}

.qui-buttons {
  display: flex;
  align-items: center;
  gap: 0.4rem 0.2rem;
}
.qui-buttons.wrap {
  flex-wrap: wrap;
}
.qui-buttons.qui-buttons-center {
  justify-content: center;
}
.qui-buttons.qui-buttons-right {
  justify-content: flex-end;
}

.qui-button {
  display: inline-flex;
  gap: 0 0.375rem;
  justify-content: center;
  align-items: center;
  appearance: none;
  padding: 0.9375rem;
  font-size: 0.9375rem;
  border: 1px solid var(--default);
  border-radius: 3px;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
  background: var(--default);
  text-decoration: none;
  color: white;
  font-weight: 600;
  transition-duration: 0.2s;
  /*&.qui-add-button {
      justify-content: flex-start;
      gap: 0 px-to-rem(5);
      width: 126px;
      height: 45px;
      margin: px-to-rem(10);
      border-radius: 100vmax;
      background-color: var(--primary);
      font-size: px-to-rem(14);
      position: relative;

      @media (max-width: 600px) {
          margin: 0;
      }

      &::before {
          display: block;
          content: "+";
          width: 30px;
          height: 30px;
          border-radius: 100vmax;
          background-color: rgba(255,255,255,0.3);
          font-size: px-to-rem(18);
          line-height: 1.4;
      }

      &:hover {
          background-color: var(--primary-hover);
      }
  }*/
}
.qui-button:link, .qui-button:visited, .qui-button:active, .qui-button:hover {
  color: white;
  text-decoration: none;
}
.qui-button.priority-primary {
  border-color: var(--primary);
  background-color: var(--primary);
}
.qui-button.priority-primary:hover {
  border-color: var(--primary-hover);
  background-color: var(--primary-hover);
}
.qui-button.priority-primary.outline {
  background-color: #fff;
  color: var(--primary);
}
.qui-button.priority-primary.outline:hover {
  border-color: var(--primary);
  background-color: var(--primary-outline-hover);
}
.qui-button.priority-primary[disabled], .qui-button.priority-primary.disabled {
  border: none;
  background-color: var(--primary-bg-disabled);
  color: var(--primary-disabled);
  pointer-events: none;
}
.qui-button.priority-success {
  border-color: var(--success);
  background-color: var(--success);
}
.qui-button.priority-success:hover {
  border-color: var(--success-hover);
  background-color: var(--success-hover);
}
.qui-button.priority-success.outline {
  background-color: #fff;
  color: var(--success);
}
.qui-button.priority-success.outline:hover {
  border-color: var(--success);
  background-color: var(--success-outline-hover);
}
.qui-button.priority-success[disabled], .qui-button.priority-success.disabled {
  border: none;
  background-color: var(--success-bg-disabled);
  color: var(--success-disabled);
  pointer-events: none;
}
.qui-button.priority-danger {
  border-color: var(--danger);
  background-color: var(--danger);
}
.qui-button.priority-danger:hover {
  border-color: var(--danger-hover);
  background-color: var(--danger-hover);
}
.qui-button.priority-danger.outline {
  background-color: #fff;
  color: var(--danger);
}
.qui-button.priority-danger.outline:hover {
  border-color: var(--danger);
  background-color: var(--danger-outline-hover);
}
.qui-button.priority-danger[disabled], .qui-button.priority-danger.disabled {
  border: none;
  background-color: var(--danger-bg-disabled);
  color: var(--danger-disabled);
  pointer-events: none;
}
.qui-button.priority-default {
  border-color: var(--default);
  background-color: var(--default);
}
.qui-button.priority-default:hover {
  border-color: var(--default-hover);
  background-color: var(--default-hover);
}
.qui-button.priority-default.outline {
  background-color: #fff;
  color: var(--default);
}
.qui-button.priority-default.outline:hover {
  border-color: var(--default);
  background-color: var(--default-outline-hover);
}
.qui-button.priority-default[disabled], .qui-button.priority-default.disabled {
  border: none;
  background-color: var(--default-bg-disabled);
  color: var(--default-disabled);
  pointer-events: none;
}
.qui-button.priority-warning {
  border-color: var(--warning);
  background-color: var(--warning);
}
.qui-button.priority-warning:hover {
  border-color: var(--warning-hover);
  background-color: var(--warning-hover);
}
.qui-button.priority-warning.outline {
  background-color: #fff;
  color: var(--warning);
}
.qui-button.priority-warning.outline:hover {
  border-color: var(--warning);
  background-color: var(--warning-outline-hover);
}
.qui-button.priority-warning[disabled], .qui-button.priority-warning.disabled {
  border: none;
  background-color: var(--warning-bg-disabled);
  color: var(--warning-disabled);
  pointer-events: none;
}
.qui-button.priority-link {
  padding: 0;
  border: none;
  background: transparent;
  font-weight: 500;
}
.qui-button.priority-link.outline {
  border-bottom: 1px solid #000;
  border-radius: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  color: #000;
  transition: opacity 0.2s;
}
.qui-button.priority-link.outline .bi::before {
  font-size: 1.5em;
}
.qui-button.priority-link.outline:hover {
  opacity: 0.5;
}
.qui-button.priority-link.disabled {
  cursor: default;
  pointer-events: none;
}
.qui-button.round {
  border-radius: 100vmax;
}
.qui-button.width-fixed {
  min-width: 163px;
}
.qui-button.width-fixed.size-large {
  min-width: 183px;
}
.qui-button.width-fixed.size-small {
  min-width: 136px;
}
.qui-button.width-fixed.size-x-small {
  min-width: 100px;
}
.qui-button.width-fixed.has-icon-left, .qui-button.width-fixed.has-icon-right {
  min-width: 220px;
}
.qui-button.width-fixed.has-icon-left.size-large, .qui-button.width-fixed.has-icon-right.size-large {
  min-width: 247px;
}
.qui-button.width-fixed.has-icon-left.size-small, .qui-button.width-fixed.has-icon-right.size-small {
  min-width: 163px;
}
.qui-button.size-large {
  padding: 1.25rem;
  font-size: 1.0625rem;
}
.qui-button.size-small {
  padding: 0.625rem;
  font-size: 0.8125rem;
}
.qui-button.size-x-small {
  padding: 0.3125rem;
  font-size: 0.6875rem;
}
.qui-button.size-x-small .bi::before {
  font-size: 0.75rem;
}
.qui-button.has-icon-left, .qui-button.has-icon-right {
  padding: 1.09375rem 2.1875rem;
  font-size: 1rem;
  position: relative;
}
.qui-button.has-icon-left .bi::before, .qui-button.has-icon-right .bi::before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
}
.qui-button.has-icon-left.size-large, .qui-button.has-icon-right.size-large {
  padding: 1.25rem 2.5rem;
  font-size: 1.0625rem;
}
.qui-button.has-icon-left.size-large .bi::before, .qui-button.has-icon-right.size-large .bi::before {
  font-size: 1.0625rem;
}
.qui-button.has-icon-left.size-small, .qui-button.has-icon-right.size-small {
  padding: 0.625rem 1.25rem;
  font-size: 0.8125rem;
}
.qui-button.has-icon-left.size-small .bi::before, .qui-button.has-icon-right.size-small .bi::before {
  font-size: 0.8125rem;
}
.qui-button.has-icon-left .bi::before {
  left: 1.09375rem;
}
.qui-button.has-icon-left.size-large .bi::before {
  left: 1.25rem;
}
.qui-button.has-icon-left.size-small .bi::before {
  left: 0.625rem;
}
.qui-button.has-icon-right .bi::before {
  right: 1.09375rem;
}
.qui-button.has-icon-right.size-large .bi::before {
  right: 1.25rem;
}
.qui-button.has-icon-right.size-small .bi::before {
  right: 0.625rem;
}

.qui-alert {
  margin: 1rem 0;
  background: var(--default-bg);
  padding: 1.4375rem 1.25rem;
  border-radius: 5px;
  color: var(--default-text);
  font-size: 1em;
  font-weight: 600;
}
.qui-alert:first-child {
  margin-top: 0;
}
.qui-alert .bi::before {
  font-size: 1.25rem;
}
.qui-alert .message {
  margin: 0;
  white-space: pre-line;
}
.qui-alert.qui-alert-primary {
  border: 1px solid var(--primary-bg);
  background-color: var(--primary-bg);
  color: var(--primary-text);
}
.qui-alert.qui-alert-primary.fill {
  border-color: var(--primary);
  background-color: var(--primary);
  color: #fff;
}
.qui-alert.qui-alert-primary.border {
  border-color: var(--primary);
}
.qui-alert.qui-alert-primary.outline {
  border-color: var(--primary);
  background-color: #fff;
}
.qui-alert.qui-alert-primary.text-black {
  color: #000;
}
.qui-alert.qui-alert-primary.text-black .bi::before {
  color: var(--primary-text);
}
.qui-alert.qui-alert-primary.text-black.fill .bi::before {
  color: #000;
}
.qui-alert.qui-alert-success {
  border: 1px solid var(--success-bg);
  background-color: var(--success-bg);
  color: var(--success-text);
}
.qui-alert.qui-alert-success.fill {
  border-color: var(--success);
  background-color: var(--success);
  color: #fff;
}
.qui-alert.qui-alert-success.border {
  border-color: var(--success);
}
.qui-alert.qui-alert-success.outline {
  border-color: var(--success);
  background-color: #fff;
}
.qui-alert.qui-alert-success.text-black {
  color: #000;
}
.qui-alert.qui-alert-success.text-black .bi::before {
  color: var(--success-text);
}
.qui-alert.qui-alert-success.text-black.fill .bi::before {
  color: #000;
}
.qui-alert.qui-alert-danger {
  border: 1px solid var(--danger-bg);
  background-color: var(--danger-bg);
  color: var(--danger-text);
}
.qui-alert.qui-alert-danger.fill {
  border-color: var(--danger);
  background-color: var(--danger);
  color: #fff;
}
.qui-alert.qui-alert-danger.border {
  border-color: var(--danger);
}
.qui-alert.qui-alert-danger.outline {
  border-color: var(--danger);
  background-color: #fff;
}
.qui-alert.qui-alert-danger.text-black {
  color: #000;
}
.qui-alert.qui-alert-danger.text-black .bi::before {
  color: var(--danger-text);
}
.qui-alert.qui-alert-danger.text-black.fill .bi::before {
  color: #000;
}
.qui-alert.qui-alert-default {
  border: 1px solid var(--default-bg);
  background-color: var(--default-bg);
  color: var(--default-text);
}
.qui-alert.qui-alert-default.fill {
  border-color: var(--default);
  background-color: var(--default);
  color: #fff;
}
.qui-alert.qui-alert-default.border {
  border-color: var(--default);
}
.qui-alert.qui-alert-default.outline {
  border-color: var(--default);
  background-color: #fff;
}
.qui-alert.qui-alert-default.text-black {
  color: #000;
}
.qui-alert.qui-alert-default.text-black .bi::before {
  color: var(--default-text);
}
.qui-alert.qui-alert-default.text-black.fill .bi::before {
  color: #000;
}
.qui-alert.qui-alert-warning {
  border: 1px solid var(--warning-bg);
  background-color: var(--warning-bg);
  color: var(--warning-text);
}
.qui-alert.qui-alert-warning.fill {
  border-color: var(--warning);
  background-color: var(--warning);
  color: #fff;
}
.qui-alert.qui-alert-warning.border {
  border-color: var(--warning);
}
.qui-alert.qui-alert-warning.outline {
  border-color: var(--warning);
  background-color: #fff;
}
.qui-alert.qui-alert-warning.text-black {
  color: #000;
}
.qui-alert.qui-alert-warning.text-black .bi::before {
  color: var(--warning-text);
}
.qui-alert.qui-alert-warning.text-black.fill .bi::before {
  color: #000;
}
.qui-alert .button,
.qui-alert .qui-buttons .badge,
.qui-alert .qui-badges {
  margin-top: 0.9375rem;
}
.qui-alert .button {
  text-align: center;
}
.qui-alert .button .qui-button {
  margin-right: auto;
  margin-left: auto;
}
.qui-alert .qui-buttons {
  justify-content: center;
}

.qui-filter .qui-form-control-input.select::before,
.qui-pager-container .qui-form-control-input.select::before {
  right: 0.5625rem;
  content: "\f229";
  font-size: 0.625rem;
}

.qui-filter {
  margin: 0.75rem 0;
}
.qui-filter .qui-filter-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.3rem 0.5rem;
}
.qui-filter .qui-filter-form > .qui-form-control .qui-form-control-input > input.size-small,
.qui-filter .qui-filter-form > .qui-form-control .qui-form-control-input > textarea.size-small,
.qui-filter .qui-filter-form > .qui-form-control .qui-form-control-input > select.size-small {
  width: 120px;
}
.qui-filter .qui-form-control > [type=text],
.qui-filter .qui-form-control > select {
  padding: 0.2rem 0.5rem;
  line-height: 1.2;
  font-size: 0.95rem;
}
.qui-filter .qui-filter-submit .qui-button,
.qui-filter .qui-filter-clear .qui-button {
  width: 60px;
  height: 30px;
}

.qui-table-container {
  position: relative;
}
.qui-table-container .scroll-horizontal {
  overflow-x: auto;
}
.qui-table-container .qui-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  margin: 0 auto;
}
.qui-table-container .qui-table thead {
  border-bottom: 1px solid var(--border);
}
.qui-table-container .qui-table .qui-thead .qui-th-label {
  display: flex;
  align-items: center;
  gap: 0 0.1875rem;
  appearance: none;
  border: none;
  background-color: transparent;
  font-size: 0.75rem;
  font-weight: 600;
  color: #777;
  white-space: nowrap;
}
.qui-table-container .qui-table .qui-thead .qui-th-button {
  padding: 0.375rem 0.4375rem;
  margin-left: -0.4375rem;
  border-radius: 4px;
  color: var(--primary);
  cursor: pointer;
}
.qui-table-container .qui-table .qui-thead .qui-th-button.active {
  background: #E1E6FB;
  color: var(--primary);
}
.qui-table-container .qui-table .qui-thead .qui-th-button .qui-th-order::before {
  font-size: 0.75rem;
}
.qui-table-container .qui-table .qui-thead .qui-th-text {
  white-space: pre;
  text-align: left;
}
.qui-table-container .qui-table .qui-thead .align-left {
  display: flex;
  justify-content: flex-start;
}
.qui-table-container .qui-table .qui-thead .align-center {
  display: flex;
  justify-content: center;
}
.qui-table-container .qui-table .qui-thead .align-right {
  display: flex;
  justify-content: flex-end;
}
.qui-table-container .qui-table tbody tr.selected {
  background-color: var(--bg-focus);
}
.qui-table-container .qui-table tbody th,
.qui-table-container .qui-table tbody td {
  line-height: 1.2;
  border-bottom: 1px solid #e3e3ef;
  white-space: nowrap;
}
.qui-table-container .qui-table tbody th.center,
.qui-table-container .qui-table tbody td.center {
  text-align: center;
}
.qui-table-container .qui-table tbody th.show-order,
.qui-table-container .qui-table tbody td.show-order {
  cursor: move;
  text-align: center;
}
.qui-table-container .qui-table tbody th.wrap,
.qui-table-container .qui-table tbody td.wrap {
  white-space: normal;
}
.qui-table-container .qui-table tbody th {
  font-size: 0.75rem;
  text-align: left;
}
.qui-table-container .qui-table tbody td {
  padding: 0.5rem 0.4375rem;
  font-size: 0.875rem;
}
.qui-table-container .qui-table tbody .bi-list::before {
  color: var(--primary);
  font-size: 1.3rem;
}
.qui-table-container .qui-table tbody .checkbox label {
  display: flex;
  justify-content: center;
}
.qui-table-container .qui-table tbody td.no-data {
  text-align: center;
  padding: 0.8rem 0;
  font-size: 0.8rem;
  color: #666;
}
.qui-table-container .qui-table th {
  padding: 0.375rem 0.4375rem;
}
.qui-table-container .qui-table th.show-order,
.qui-table-container .qui-table td.show-order {
  width: 50px;
}
.qui-table-container .qui-table th.checkbox, .qui-table-container .qui-table th.radio,
.qui-table-container .qui-table td.checkbox,
.qui-table-container .qui-table td.radio {
  width: 33px;
  padding: 0;
}
.qui-table-container .qui-table th.checkbox > label, .qui-table-container .qui-table th.radio > label,
.qui-table-container .qui-table td.checkbox > label,
.qui-table-container .qui-table td.radio > label {
  display: flex;
  padding: 0.625rem;
  cursor: pointer;
  /*&:has(input[type="checkbox"]),
  &:has(input[type="radio"]) {
      &::before {
          top: 9px;
          left: 9px;
      }
  }*/
}
.qui-table-container .qui-table th.checkbox > label input, .qui-table-container .qui-table th.radio > label input,
.qui-table-container .qui-table td.checkbox > label input,
.qui-table-container .qui-table td.radio > label input {
  cursor: pointer;
}
.qui-table-container .qui-table th.checkbox > label,
.qui-table-container .qui-table td.checkbox > label {
  /*&:has(input[type="checkbox"]) {
      &::after {
          top: 13.5px;
          left: 13px;
      }
  }*/
}
.qui-table-container .qui-table th.radio > label,
.qui-table-container .qui-table td.radio > label {
  /*&:has(input[type="radio"]) {
      &::after {
          top: 11px;
          left: 11px;
      }
  }*/
}
.qui-table-container .qui-table th.void,
.qui-table-container .qui-table td.void {
  border-bottom: none;
}
.qui-table-container .qui-table th .qui-button.size-small,
.qui-table-container .qui-table td .qui-button.size-small {
  padding: 0.1875rem 0.5rem;
  font-size: 0.75rem;
}
.qui-table-container .qui-table th .qui-button.size-medium,
.qui-table-container .qui-table td .qui-button.size-medium {
  padding: 0.3125rem 0.875rem;
  font-size: 0.75rem;
  min-width: 80px;
}
.qui-table-container .qui-table th .qui-badge,
.qui-table-container .qui-table td .qui-badge {
  padding: 0.125rem 0.4375rem;
  font-size: 0.6875rem;
}
.qui-table-container .qui-table th .qui-badge.size-large,
.qui-table-container .qui-table td .qui-badge.size-large {
  padding: 0.1875rem 0.875rem;
  min-width: 80px;
  font-size: 0.75rem;
}
.qui-table-container .qui-table th .qui-buttons,
.qui-table-container .qui-table td .qui-buttons {
  margin: 0;
}
.qui-table-container .qui-table th .qui-button.width-fixed,
.qui-table-container .qui-table td .qui-button.width-fixed {
  min-width: 90px;
}
.qui-table-container .qui-table .sortable-ghost th,
.qui-table-container .qui-table .sortable-ghost td {
  background-color: var(--bg-focus) !important;
  color: var(--primary-hover);
}
.qui-table-container .qui-table .sortable-ghost th *,
.qui-table-container .qui-table .sortable-ghost td * {
  visibility: hidden;
}
.qui-table-container .qui-table-void {
  padding: 10vh 1.25rem;
  text-align: center;
}
@media (max-width: 600px) {
  .qui-table-container.break-sp table,
  .qui-table-container.break-sp thead,
  .qui-table-container.break-sp tbody,
  .qui-table-container.break-sp tfoot,
  .qui-table-container.break-sp tr,
  .qui-table-container.break-sp th,
  .qui-table-container.break-sp td {
    display: block;
  }
  .qui-table-container.break-sp thead {
    display: none;
  }
  .qui-table-container.break-sp tbody tr td {
    position: relative;
  }
  .qui-table-container.break-sp tbody tr td:first-child {
    border-top: 1px solid #666;
  }
  .qui-table-container.break-sp tbody tr td::before {
    display: block;
    content: attr(title);
    font-size: 0.7rem;
    font-weight: 700;
    margin-bottom: 5px;
  }
  html[lang=en] .qui-table-container.break-sp tbody tr td::before {
    font-size: 0.6rem;
  }
  .qui-table-container.break-sp tbody tr td.text-center {
    min-height: 2rem;
  }
  .qui-table-container.break-sp tbody tr td.text-center::before {
    position: absolute;
  }
}

.qui-update-show-order {
  display: flex;
  justify-content: center;
  margin: -2.875rem 0 1.25rem;
}
@media (max-width: 600px) {
  .qui-update-show-order {
    margin: 0 0 1.25rem;
  }
}
.qui-update-show-order .qui-button {
  padding-right: 2.5rem;
  padding-left: 2.5rem;
}
.qui-update-show-order .guide {
  display: flex;
  justify-content: center;
  padding: 0.625rem 3.125rem;
  margin: -0.1875rem 0 0;
  border-radius: 100vmax;
  background-color: var(--primary-bg);
  color: var(--primary);
  font-size: 0.875rem;
  font-weight: 600;
}
@media (max-width: 600px) {
  .qui-update-show-order .guide {
    padding: 0.625rem 1.25rem;
  }
}
.qui-update-show-order .guide .comment {
  margin: 0 0 0 0.9375rem;
}
@media (max-width: 600px) {
  .qui-update-show-order .guide .comment {
    margin: 0 0 0 0.625rem;
  }
}

.qui-datetime {
  font-family: var(--font-code);
  line-height: 1.3;
}
.qui-datetime .qui-date,
.qui-datetime .qui-time {
  font-size: 0.75rem;
}
.qui-datetime .qui-time {
  color: #666;
}

.qui-bulk-menu {
  position: absolute;
  z-index: 100;
  transform: translatey(5px);
  min-width: 150px;
  max-width: calc(100% - 3.75rem);
}
.qui-bulk-menu.inline {
  position: static;
}
.qui-bulk-menu .items {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3125rem;
  background: var(--bg-gradation-dark);
  padding: 0.6875rem 0.9375rem;
  border-radius: 5px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
}
.qui-bulk-menu .items .selected {
  color: #fff;
  font-size: 0.8125rem;
  font-weight: 600;
}
.qui-bulk-menu .items .selected span {
  margin: 0 0.3125rem;
}
.qui-bulk-menu .items .qui-button {
  border-radius: 3px;
  padding: 0.5rem 1.25rem;
  border: none;
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 0.75rem;
}
.qui-bulk-menu .items .qui-button:hover {
  background-color: rgba(255, 255, 255, 0.5);
}
.qui-bulk-menu .items .qui-button.disabled {
  background-color: rgba(255, 255, 255, 0.7);
  color: #aaa;
  cursor: not-allowed;
}

.qui-modal-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
  box-sizing: border-box;
}
.qui-modal-container.fit-height .qui-modal {
  height: calc(100vh - 150px);
}
@media (max-width: 600px) {
  .qui-modal-container {
    padding: 5vw;
  }
}
.qui-modal-container .qui-modal {
  width: 1000px;
  max-width: 90vw;
}
.qui-modal-container .qui-modal.modal-xl {
  width: 1500px;
}
.qui-modal-container .qui-modal.modal-lg {
  width: 1200px;
}
.qui-modal-container .qui-modal.modal-sm {
  width: 850px;
}
.qui-modal-container .qui-modal.modal-xs {
  width: 600px;
}
.qui-modal-container .qui-modal .qui-form {
  border-radius: 7px;
  background: white;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
@media (max-width: 600px) {
  .qui-modal-container .qui-modal .qui-form {
    max-width: 95vw;
    padding: 0.9375rem 0;
  }
}
.qui-modal-container .qui-modal-header {
  flex: 0 0 3.75rem;
  padding: 0.75rem 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0 1rem;
  border-bottom: 1px solid var(--border);
}
@media (max-width: 600px) {
  .qui-modal-container .qui-modal-header {
    flex: unset;
    padding: 0 0.9375rem 0.9375rem;
  }
}
.qui-modal-container .qui-modal-header .qui-modal-title {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
  word-break: break-all;
}
.qui-modal-container .qui-modal-header .qui-modal-close {
  width: 22px;
  height: 22px;
  cursor: pointer;
  position: relative;
}
.qui-modal-container .qui-modal-header .qui-modal-close .bi {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.qui-modal-container .qui-modal-header .qui-modal-close .bi::before {
  opacity: 0.5;
  transform: scale(2.8);
  transition: opacity 0.2s;
}
@media (max-width: 600px) {
  .qui-modal-container .qui-modal-header .qui-modal-close .bi::before {
    transform: scale(2);
  }
}
.qui-modal-container .qui-modal-header .qui-modal-close:hover .bi::before {
  opacity: 1;
}
.qui-modal-container .qui-modal-body {
  padding: 0.9375rem 1.25rem;
  max-height: calc(100vh - 150px);
  overflow-y: auto;
}
@media (max-width: 600px) {
  .qui-modal-container .qui-modal-body {
    padding: 0.625rem 0.9375rem;
  }
}
.qui-modal-container .qui-modal-body .qui-form-row-group {
  margin-bottom: 0.9375rem;
}
.qui-modal-container .qui-modal-footer {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 0 1rem;
  position: relative;
}
.qui-modal-container .qui-modal-footer .left {
  position: absolute;
  left: 1.25rem;
}
.qui-modal-container .qui-modal-footer .qui-buttons {
  gap: 0.625rem;
}
.qui-modal-container .qui-modal-footer .qui-buttons .qui-button.width-fixed {
  min-width: 130px;
}
.qui-modal-container .qui-modal-footer .qui-buttons .qui-button.width-fixed.size-large {
  min-width: 150px;
}
.qui-modal-container .qui-modal-footer .qui-buttons .qui-button.width-fixed.size-small {
  min-width: 100px;
}
@media (max-width: 600px) {
  .qui-modal-container .qui-modal-footer {
    padding: 0.9375rem 0.9375rem 0;
  }
  .qui-modal-container .qui-modal-footer .left {
    left: 0.9375rem;
  }
}

.qui-modal-container.link-url .qui-modal-body {
  padding: 1.5rem;
}
.qui-modal-container.link-url .qui-modal-body .qui-form-control-input {
  display: flex;
  gap: 0 0.5rem;
}

.qui-complete {
  margin: 2rem 0 6.25rem;
  min-height: 20vh;
}
@media (max-width: 600px) {
  .qui-complete {
    margin: 1rem 0 3.125rem;
  }
}
.qui-complete .qui-complete-title {
  padding-top: 5rem;
  margin: 2rem 0 4.7rem;
  font-size: 1.25rem;
  font-weight: 600;
  text-align: center;
  position: relative;
}
.qui-complete .qui-complete-title::before {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
  content: "\f633";
  display: inline-block;
  color: var(--primary);
  font-size: 3rem;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
}
.qui-complete .qui-buttons {
  flex-direction: column;
  gap: 0.9375rem;
}
.qui-complete .qui-buttons + .qui-buttons {
  margin-top: 2.1875rem;
}
.qui-complete .qui-complete-close {
  display: flex;
  justify-content: center;
  margin: 2rem 0 0;
}
.qui-complete .qui-complete-close .qui-button {
  opacity: 0.7;
  transition-duration: 0.3s;
}
.qui-complete .qui-complete-close .qui-button:hover {
  opacity: 1;
}

.qui-pager-container {
  margin: 0.75rem 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5rem;
}
@media (max-width: 600px) {
  .qui-pager-container {
    justify-content: flex-end;
  }
}
.qui-pager-container.loading {
  pointer-events: none;
  opacity: 0.7;
}
.qui-pager-container .qui-total {
  white-space: nowrap;
  display: flex;
  align-items: baseline;
  gap: 0 0.5rem;
  margin-left: 0;
  margin-right: auto;
}
.qui-pager-container .qui-total .total {
  display: flex;
  color: #666;
  font-size: 0.9375rem;
  align-items: baseline;
  line-height: 1.2;
  gap: 0 0.5rem;
  font-weight: 600;
}
.qui-pager-container .qui-total .total::before {
  content: "全";
  font-size: 0.8125rem;
}
.qui-pager-container .qui-total .total::after {
  content: "件";
  font-size: 0.8125rem;
}
.qui-pager-container .qui-total .selected {
  color: #666;
  font-size: 0.9rem;
  font-feature-settings: "palt";
}
.qui-pager-container .qui-total .selected span {
  font-size: 1rem;
  color: black;
  padding: 0 0.2rem;
  font-weight: 600;
}
.qui-pager-container .qui-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.6875rem;
  font-family: var(--font-code);
  margin-left: auto;
  margin-right: 0;
}
@media (max-width: 600px) {
  .qui-pager-container .qui-pager {
    margin-right: auto;
  }
}
.qui-pager-container .qui-pager * {
  line-height: 1;
}
.qui-pager-container .qui-pager .page {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 23px;
  height: 23px;
  padding: 0.1875rem 0.375rem;
  margin: 0 0.1875rem;
  border-radius: 3px;
  color: #666;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, opacity 0.2s;
}
.qui-pager-container .qui-pager .page:hover {
  background-color: #E1E6FB;
}
.qui-pager-container .qui-pager .page.active {
  background-color: var(--primary);
  color: white;
}
.qui-pager-container .qui-pager .page + .dots {
  margin-left: 0.1875rem;
}
.qui-pager-container .qui-pager .dots + .page {
  margin-left: 0.375rem;
}
.qui-pager-container .qui-pager .dots::after {
  content: ".";
  padding: 0 0.05rem;
  font-weight: 600;
}
.qui-pager-container .qui-pager .nav {
  width: 23px;
  height: 23px;
  border-radius: 3px;
  cursor: pointer;
  position: relative;
}
.qui-pager-container .qui-pager .nav .bi::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.75rem;
  font-weight: 600 !important;
}
.qui-pager-container .qui-pager .nav:not(.disabled) {
  transition: background-color 0.2s, color 0.2s, opacity 0.2s;
}
.qui-pager-container .qui-pager .nav:not(.disabled):hover {
  background-color: #E1E6FB;
}
.qui-pager-container .qui-pager .nav:first-child {
  margin: 0 0.3rem 0 0;
}
.qui-pager-container .qui-pager .nav:last-child {
  margin: 0 0 0 0.3rem;
}
.qui-pager-container .qui-pager .disabled {
  opacity: 0.5;
  cursor: default;
}
.qui-pager-container .qui-limits {
  display: flex;
  justify-content: flex-end;
}
.qui-pager-container .qui-limits .qui-form-control select {
  width: auto;
}

.qui-wysiwyg-editor {
  margin: 0.625rem 0;
}
.qui-wysiwyg-editor iframe {
  border: 1px solid var(--border);
}
.qui-wysiwyg-editor .qui-toolbar {
  display: flex;
  gap: 0.625rem;
}
.qui-wysiwyg-editor .qui-toolbar .qui-button,
.qui-wysiwyg-editor .qui-toolbar .qui-form-control-input select {
  height: 2rem;
  padding-top: 0;
  padding-bottom: 0;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-mode {
  display: flex;
  gap: 0 0.0625rem;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-mode :first-child {
  border-radius: 4px 0 0 4px;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-mode :last-child {
  border-radius: 0 4px 4px 0;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons {
  display: flex;
  align-items: flex-start;
  gap: 0 0.625rem;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons .group {
  display: flex;
  gap: 0 0.125rem;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons .qui-toolbar-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  background-color: #eee;
  font-size: 1rem;
  cursor: pointer;
  transition-duration: 0.2s;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons .qui-toolbar-button i {
  display: block;
  transform: translateY(1px);
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons .qui-toolbar-button:hover {
  background-color: #ddd;
}
.qui-wysiwyg-editor .qui-toolbar .qui-toolbar-buttons .qui-toolbar-button.disabled {
  background-color: #f3f3f3;
  color: #ccc;
  pointer-events: none;
}
.qui-wysiwyg-editor .qui-hierarchy {
  position: relative;
  padding: 0.4375rem 0;
  font-family: var(--font-code);
  min-height: 1rem;
  line-height: 1;
}
.qui-wysiwyg-editor .qui-hierarchy ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
}
.qui-wysiwyg-editor .qui-hierarchy ul li {
  position: relative;
}
.qui-wysiwyg-editor .qui-hierarchy ul li span {
  cursor: pointer;
}
.qui-wysiwyg-editor .qui-hierarchy ul li span + .qui-button {
  position: absolute;
}
.qui-wysiwyg-editor .qui-hierarchy ul li + li::before {
  content: ">";
  padding: 0 0.5rem;
}
.qui-wysiwyg-editor .qui-hierarchy .qui-attributes-editor-mat {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}
.qui-wysiwyg-editor .qui-hierarchy .qui-attributes-editor {
  padding: 1rem;
  position: absolute;
  z-index: 10;
  border-radius: 4px;
  border: 1px solid var(--border);
  background-color: white;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
  top: 1.875rem;
}
.qui-wysiwyg-editor .qui-hierarchy .qui-attributes-editor .qui-form-control + .qui-form-control {
  margin-top: 0.4375rem;
}
.qui-wysiwyg-editor .qui-hierarchy .qui-attributes-editor .qui-buttons {
  margin: 0.4375rem 0 0;
  justify-content: flex-end;
}
.qui-wysiwyg-editor .qui-html-editor {
  margin-top: calc(1rem + 14px);
}

.qui-file-browser {
  --primary-hover-bg: #e7f9ff;
  display: flex;
  gap: 0 2rem;
}
.qui-file-browser .qui-file-browser-directories {
  flex: 0 0 20vw;
  position: relative;
}
.qui-file-browser .qui-file-browser-ui {
  position: absolute;
  background-color: white;
  border: 1px solid #eee;
  padding: 0.6rem 0.8rem;
  border-radius: 3px;
  display: flex;
  gap: 0 0.8rem;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
.qui-file-browser .qui-file-browser-ui * {
  line-height: 1;
}
.qui-file-browser .qui-file-browser-ui .bi {
  cursor: pointer;
  transition-duration: 0.1s;
}
.qui-file-browser .qui-file-browser-ui .bi:hover {
  color: var(--primary-hover-bg);
}
.qui-file-browser .qui-node-label .label {
  font-family: var(--font-code);
}
.qui-file-browser .qui-file-browser-files {
  --files-bg: #f0f0f0;
  flex: 1 1 auto;
  border-radius: 4px;
  background: var(--files-bg);
  padding: 1rem;
}
.qui-file-browser .qui-file-browser-files.in-drag-over {
  background-color: var(--primary-hover-bg);
}
.qui-file-browser .qui-file-browser-files .path-wrap {
  display: flex;
  align-items: center;
  gap: 0 1rem;
}
.qui-file-browser .qui-file-browser-files .path-wrap .path {
  flex: 1 1 auto;
  padding: 0.5rem;
  background-color: white;
  border-radius: 3px;
  font-family: var(--font-code);
}
.qui-file-browser .qui-file-browser-files .path-wrap .search {
  flex: 0 0 12rem;
}
.qui-file-browser .qui-file-browser-files .path-wrap .search [type=search] {
  width: 100%;
  border: none;
  border-radius: 10rem;
  padding: 0.5rem 1rem;
}
.qui-file-browser .qui-file-browser-files .buttons {
  margin: 0.6rem 0 0.8rem;
}
.qui-file-browser .qui-file-browser-files .buttons .max-file-size {
  margin-right: 1.5rem;
  font-size: 0.85rem;
  line-height: 1;
}
.qui-file-browser .qui-file-browser-files .buttons .select-all {
  margin-left: 1.5rem;
}
.qui-file-browser .qui-file-browser-files .upload-files {
  margin: 1rem 0;
  padding: 1rem;
  background-color: white;
  border-radius: 4px;
  overflow: hidden;
}
.qui-file-browser .qui-file-browser-files .upload-files .close {
  float: right;
  cursor: pointer;
  transform: translate(2px, -4px);
}
.qui-file-browser .qui-file-browser-files .upload-files .file td {
  padding: 0.2rem 0.4rem 0.2rem 0;
  vertical-align: top;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon {
  display: flex;
  gap: 0 0.2rem;
  padding: 0.2rem 0.4rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.8rem;
  line-height: 1.1;
  white-space: nowrap;
  width: 4rem;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon .icon {
  flex: 0 0 auto;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon .label {
  flex: 1 1 auto;
  text-align: center;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon.status-1 {
  color: #0ca10c;
  border-color: #0ca10c;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon.status-2, .qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon.status-5 {
  color: var(--danger);
  border-color: var(--danger);
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon.status-3 {
  color: #ad7203;
  border-color: #ad7203;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .status .status-icon.status-4 {
  color: #1080ff;
  border-color: #1080ff;
}
.qui-file-browser .qui-file-browser-files .upload-files .file .name {
  display: flex;
  gap: 0 0.2rem;
  white-space: nowrap;
  font-family: var(--font-code);
}
.qui-file-browser .qui-file-browser-files .upload-files .file .error {
  color: var(--error);
  font-size: 0.9rem;
}
.qui-file-browser .qui-file-browser-files .upload-files .ok {
  margin: 0.3125rem 0 0;
  justify-content: left;
}
.qui-file-browser .qui-file-browser-files .files {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
}
.qui-file-browser .qui-file-browser-files .files .field {
  display: none;
}
.qui-file-browser .qui-file-browser-files .files .file {
  width: 140px;
  background-color: white;
  cursor: pointer;
  border: 2px solid var(--files-bg);
}
.qui-file-browser .qui-file-browser-files .files .file * {
  font-family: var(--font-code);
}
.qui-file-browser .qui-file-browser-files .files .file:hover {
  background-color: var(--primary-hover-bg);
}
.qui-file-browser .qui-file-browser-files .files .file.selected {
  background-color: var(--primary);
  border-color: var(--primary);
}
.qui-file-browser .qui-file-browser-files .files .file.selected .name,
.qui-file-browser .qui-file-browser-files .files .file.selected .datetime,
.qui-file-browser .qui-file-browser-files .files .file.selected .size {
  color: white !important;
}
.qui-file-browser .qui-file-browser-files .files .file .thumbnail {
  position: relative;
  width: 100%;
  aspect-ratio: 4/3;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.25rem;
  padding: 0.5rem;
  box-sizing: border-box;
  background-color: #ccc;
}
.qui-file-browser .qui-file-browser-files .files .file .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.qui-file-browser .qui-file-browser-files .files .file .thumbnail .link {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0.3125rem;
  right: 0.3125rem;
  color: white;
  font-size: 0.8rem;
  aspect-ratio: 1;
  width: 1.3rem;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  transition-duration: 0.2s;
}
.qui-file-browser .qui-file-browser-files .files .file .thumbnail .link:hover {
  background-color: rgba(0, 0, 0, 0.5);
}
.qui-file-browser .qui-file-browser-files .files .file .thumbnail .link .bi {
  position: absolute;
}
.qui-file-browser .qui-file-browser-files .files .file .texts {
  padding: 0.4rem 0.5rem;
}
.qui-file-browser .qui-file-browser-files .files .file .texts .name,
.qui-file-browser .qui-file-browser-files .files .file .texts .datetime,
.qui-file-browser .qui-file-browser-files .files .file .texts .size {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 0.85rem;
  line-height: 1.3;
}
.qui-file-browser .qui-file-browser-files .files .file .texts .datetime,
.qui-file-browser .qui-file-browser-files .files .file .texts .size {
  font-size: 0.72rem;
  color: #666;
  letter-spacing: 0.5px;
}
.qui-file-browser .qui-modal-container.add-directory .qui-modal-body {
  padding: 1rem 0 0;
}
.qui-file-browser .qui-modal-container.add-directory .qui-modal-body .qui-form-row .label {
  font-family: var(--font-code);
  letter-spacing: 0.5px;
}
.qui-file-browser .qui-modal-container.add-directory .qui-modal-body .qui-form-label.unit {
  font-family: var(--font-code);
}
.qui-file-browser .qui-modal-container.add-directory .qui-modal-body .qui-buttons {
  margin: 1.2rem 0 0.2rem;
}

.qui-tree .qui-tree-nodes {
  margin: 0 0 0 1rem;
}
.qui-tree .qui-tree-nodes * {
  line-height: 1.5;
}
.qui-tree .qui-tree-nodes .qui-node {
  margin-top: 0.3rem;
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label {
  display: flex;
  gap: 0 0.3rem;
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label .bi {
  cursor: pointer;
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label .bi.no-children {
  cursor: not-allowed;
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label .label {
  cursor: pointer;
  padding: 0 0.5rem;
  border-radius: 3px;
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label .label:hover {
  background-color: var(--primary-hover);
}
.qui-tree .qui-tree-nodes .qui-node .qui-node-label .label.selected {
  background-color: var(--primary);
  color: white;
  font-weight: 600;
}
.qui-tree > .qui-tree-nodes {
  margin-left: 0;
}

.qui-badges {
  display: flex;
  align-items: center;
  gap: 0.4rem 0.2rem;
}
.qui-badges.wrap {
  flex-wrap: wrap;
}
.qui-badges.qui-badges-center {
  justify-content: center;
}
.qui-badges.qui-badges-right {
  justify-content: flex-end;
}

.qui-badge {
  display: inline-flex;
  justify-content: center;
  border: 1px solid var(--default);
  border-radius: 100vmax;
  background-color: var(--default);
  padding: 0.375rem 0.8125rem;
  font-weight: 600;
  color: white;
  white-space: nowrap;
}
.qui-badge.qui-badge-primary {
  border-color: var(--primary);
  background-color: var(--primary);
}
.qui-badge.qui-badge-primary.outline {
  background-color: #fff;
  color: var(--primary);
}
.qui-badge.qui-badge-success {
  border-color: var(--success);
  background-color: var(--success);
}
.qui-badge.qui-badge-success.outline {
  background-color: #fff;
  color: var(--success);
}
.qui-badge.qui-badge-danger {
  border-color: var(--danger);
  background-color: var(--danger);
}
.qui-badge.qui-badge-danger.outline {
  background-color: #fff;
  color: var(--danger);
}
.qui-badge.qui-badge-warning {
  border-color: var(--warning);
  background-color: var(--warning);
}
.qui-badge.qui-badge-warning.outline {
  background-color: #fff;
  color: var(--warning);
}
.qui-badge.qui-badge-default {
  border-color: var(--default);
  background-color: var(--default);
}
.qui-badge.qui-badge-default.outline {
  background-color: #fff;
  color: var(--default);
}
.qui-badge.qui-badge-lightblue {
  border-color: var(--lightblue);
  background-color: var(--lightblue);
}
.qui-badge.qui-badge-lightblue.outline {
  background-color: #fff;
  color: var(--lightblue);
}
.qui-badge.qui-badge-purple {
  border-color: var(--purple);
  background-color: var(--purple);
}
.qui-badge.qui-badge-purple.outline {
  background-color: #fff;
  color: var(--purple);
}
.qui-badge.qui-badge-yellowgreen {
  border-color: var(--yellowgreen);
  background-color: var(--yellowgreen);
}
.qui-badge.qui-badge-yellowgreen.outline {
  background-color: #fff;
  color: var(--yellowgreen);
}
.qui-badge.qui-badge-pink {
  border-color: var(--pink);
  background-color: var(--pink);
}
.qui-badge.qui-badge-pink.outline {
  background-color: #fff;
  color: var(--pink);
}
.qui-badge.qui-badge-orange {
  border-color: var(--orange);
  background-color: var(--orange);
}
.qui-badge.qui-badge-orange.outline {
  background-color: #fff;
  color: var(--orange);
}
.qui-badge.qui-badge-black {
  border-color: var(--black);
  background-color: var(--black);
}
.qui-badge.qui-badge-black.outline {
  background-color: #fff;
  color: var(--black);
}
.qui-badge.round {
  border-radius: 100vmax;
}
.qui-badge.size-large {
  padding: 0.3125rem 0.8125rem;
  font-size: 0.875rem;
}
.qui-badge.size-small {
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
}
.qui-badge.w-3 {
  width: 3.5rem;
}
.qui-badge.w-4 {
  width: 4.5rem;
}
.qui-badge.w-5 {
  width: 5.5rem;
}
.qui-badge.w-6 {
  width: 6.5rem;
}

.qui-loading {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
}
.qui-loading .qui-loading-inner {
  padding: 1.25rem;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}
.qui-loading .qui-loading-inner .icon {
  display: block;
  font-size: 100px;
  color: white;
  opacity: 0.9;
  animation: loading-rotate 2s linear infinite;
  width: 50px;
  height: 50px;
  background-image: url('data:image/svg+xml,<svg viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M25 2.04082C12.32 2.04082 2.04082 12.32 2.04082 25C2.04082 37.68 12.32 47.9592 25 47.9592C25.5636 47.9592 26.0204 48.416 26.0204 48.9796C26.0204 49.5431 25.5636 50 25 50C11.1929 50 0 38.8071 0 25C0 11.1929 11.1929 0 25 0C38.8071 0 50 11.1929 50 25C50 35.7086 43.2676 44.8422 33.808 48.4039C33.2806 48.6025 32.692 48.336 32.4935 47.8085C32.2949 47.2811 32.5614 46.6926 33.0889 46.494C41.7794 43.2219 47.9592 34.8313 47.9592 25C47.9592 12.32 37.68 2.04082 25 2.04082Z" fill="white"/></svg>');
}

.qui-tabs .qui-tabs-menu {
  display: flex;
  gap: 0 0.3rem;
  border-bottom: 1px solid var(--primary);
  margin-bottom: 1rem;
}
@media (max-width: 600px) {
  .qui-tabs .qui-tabs-menu {
    overflow-x: auto;
    scrollbar-width: thin;
  }
}
.qui-tabs .qui-tabs-menu .qui-tabs-tab {
  border-radius: 4px 4px 0 0;
  border: 1px solid var(--primary);
  border-bottom: none;
  padding: 1.2rem 1.5rem 1rem;
  line-height: 0;
  color: var(--primary);
  font-weight: 700;
  font-size: 0.9rem;
  min-width: 7rem;
  text-align: center;
  cursor: pointer;
}
@media (max-width: 600px) {
  .qui-tabs .qui-tabs-menu .qui-tabs-tab {
    padding: 1.1rem 1.5rem 1rem;
    font-size: 0.8125rem;
    min-width: unset;
    white-space: nowrap;
  }
}
.qui-tabs .qui-tabs-menu .qui-tabs-tab.active {
  background-color: var(--primary);
  color: white;
}
/* Vue.js transition name=fade の実装 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s ease;
}

.fade-enter-to,
.fade-leave-from {
  opacity: 1;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

/* CKEditor Integration */
.cke_notification_message,
.cke_notification_close {
  display: none;
}

body.login > .header {
  margin-bottom: 1.875rem;
}
@media (max-width: 600px) {
  body.login > .header .sp-menu-wrap {
    display: none;
  }
}
body.login > .main {
  margin: auto 2.5rem;
}
@media (max-width: 600px) {
  body.login > .main {
    margin: auto 0;
  }
}

.login-container {
  max-width: 800px;
  margin: 0 auto;
  font-size: 0.96875rem;
}
@media (max-width: 600px) {
  .login-container .header .title {
    font-size: 1.1875rem;
  }
}
.login-container .qui-window {
  padding: 3.125rem 5.625rem 2.1875rem;
}
@media (max-width: 600px) {
  .login-container .qui-window {
    padding: 1.5rem 0.9375rem 1.875rem;
  }
}
.login-container .qui-window .page-header .titles {
  text-align: center;
}
.login-container .qui-window .page-header .titles .title {
  font-size: 1.875rem;
  line-height: 2;
}
@media (max-width: 600px) {
  .login-container .qui-window .page-header .titles .title {
    font-size: 1.625rem;
  }
}
.login-container .qui-window .page-header .titles .comment {
  margin: 1.25rem 0;
  font-weight: 700;
}
.login-container .qui-window .qui-form .qui-form-row-group {
  max-width: 620px;
  margin: 2.5rem auto 2rem;
}
@media (max-width: 600px) {
  .login-container .qui-window .qui-form .qui-form-row-group {
    margin: 0.625rem auto 1.875rem;
  }
}
.login-container .qui-window .qui-form .qui-form-row + .qui-form-row {
  margin-top: 1.25rem;
}
.login-container .qui-window .qui-form .qui-form-row + .help.text-right {
  margin-top: 0.5rem;
  font-size: 0.75rem;
}
.login-container .qui-window .qui-form .help.text-right + .help.text-right {
  margin-top: 0.625rem;
  font-size: 0.75rem;
}
.login-container .mfa-guidance {
  margin: 1rem 0;
  padding: 1rem;
  border: 2px solid #ccc;
  border-radius: 5px;
  line-height: 1.5;
  color: #333;
  font-size: 0.9rem;
}
.login-container .mfa-guidance .button {
  margin: 1rem 0 0.5rem;
  display: flex;
  justify-content: center;
}
.login-container .mfa-qr {
  display: flex;
  justify-content: center;
}
.login-container .flow-step-list {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 20px 40px;
  margin: 30px auto 20px;
  padding: 0;
  list-style: none;
  counter-reset: number 0;
}
.login-container .flow-step-list:lang(en) {
  gap: 15px 20px;
}
@media (max-width: 700px) {
  .login-container .flow-step-list {
    gap: 15px 20px;
  }
}
.login-container .flow-step-list li {
  position: relative;
  color: var(--default-text);
  font-size: 0.9em;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
  border-radius: 5px;
  padding: 5px;
  white-space: nowrap;
}
@media (max-width: 700px) {
  .login-container .flow-step-list li {
    font-size: 0.8rem;
  }
}
.login-container .flow-step-list li:lang(en) {
  white-space: nowrap;
}
.login-container .flow-step-list li .option {
  position: absolute;
  top: -13px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 0.7rem;
  color: var(--default-text);
}
@media (max-width: 700px) {
  .login-container .flow-step-list li .option {
    top: -10px;
  }
}
.login-container .flow-step-list li:not(:last-child):before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -32px;
  display: block;
  content: "";
  height: 1px;
  width: 20px;
  background-color: #B4B4B4;
}
@media (max-width: 700px) {
  .login-container .flow-step-list li:not(:last-child):before {
    right: -22px;
  }
}
.login-container .flow-step-list:lang(en) li:not(:last-child):before {
  right: -20px;
}
.login-container .flow-step-list li.active {
  background: white;
  color: var(--primary);
}
.login-container .contact-to-admin {
  display: flex;
  justify-content: center;
  padding: 50px 0 10px;
}

body {
  --anchor: rgb(0, 114, 188);
  --anchor-visited: rgb(0, 114, 188);
  --anchor-hover: rgb(19 134 223);
}

body.mypage {
  --primary: rgb(0, 114, 188);
  --primary-hover: #1386df;
  --primary-disabled: rgb(139, 153, 163);
  --primary-bg-disabled: rgb(225, 237, 245);
  --bg-gradation: linear-gradient(155deg, #deecf7 0%, #bbe2ff 100%);
  --bg-gradation-dark: var(--primary);
  --active: var(--primary);
}

body.admin {
  --primary: #0080bc;
  --primary-hover: #0bb9d8;
  --primary-outline-hover: #e1f1f5;
  --primary-disabled: #679cb5;
  --primary-bg-disabled: #e3ebee;
  --bg-gradation: linear-gradient(155deg, #e4ffe5 0%, #e9fae2 100%);
  --bg-gradation-dark: linear-gradient(50deg, #10a75b 0%, #1cc26f 100%);
  --active: rgba(17, 167, 92);
  --bg-focus: rgba(17, 167, 92, 0.096);
}
body.admin > .header .navbar-nav .nav li.nav-link {
  display: flex;
  gap: 0 1rem;
  align-items: center;
}
@media (max-width: 600px) {
  body.admin > .header .navbar-nav .nav li.nav-link {
    gap: 0.2rem 0.5rem;
  }
}
body.admin > .header .navbar-nav .nav li.nav-link .account-type {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  border: 1px solid white;
  border-radius: 3px;
  padding: 0.2rem 0.4rem;
}
@media (max-width: 600px) {
  body.admin > .header .navbar-nav .nav li.nav-link .account-type {
    padding: 0;
    border: none;
    font-size: 0.6rem;
  }
  body.admin > .header .navbar-nav .nav li.nav-link .account-type::before, body.admin > .header .navbar-nav .nav li.nav-link .account-type::after {
    font-feature-settings: "palt";
  }
  body.admin > .header .navbar-nav .nav li.nav-link .account-type::before {
    content: "（";
  }
  body.admin > .header .navbar-nav .nav li.nav-link .account-type::after {
    content: "）";
  }
}
body.admin #global-menu .primary > .item:hover > .a, body.admin #global-menu .primary > .item.active > .a {
  mix-blend-mode: normal;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.padding-h-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.padding-v-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.mt-5 {
  margin-top: 5px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.padding-h-5 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.padding-v-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.padding-h-10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.padding-v-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.padding-h-15 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.padding-v-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.padding-h-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.padding-v-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.mt-25 {
  margin-top: 25px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.padding-h-25 {
  padding-left: 25px !important;
  padding-right: 25px !important;
}

.padding-v-25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.padding-h-30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.padding-v-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.padding-h-35 {
  padding-left: 35px !important;
  padding-right: 35px !important;
}

.padding-v-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.padding-h-40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.padding-v-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.padding-h-45 {
  padding-left: 45px !important;
  padding-right: 45px !important;
}

.padding-v-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.padding-h-50 {
  padding-left: 50px !important;
  padding-right: 50px !important;
}

.padding-v-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.qui-form .title {
  margin: 1.5rem 0 1rem;
  font-size: 1.2rem;
}

.dl-table {
  margin: 1rem 0;
  padding: 1.5rem 1rem;
  background-color: white;
  border-radius: 4px;
}
@media (max-width: 600px) {
  .dl-table {
    padding: 0.5rem 0;
  }
}
.dl-table:first-child {
  margin-top: 0;
}
.qui-modal .modal-head-menu + .dl-table {
  margin-top: 0;
  padding-top: 1rem;
}
.dl-table dl {
  display: flex;
  gap: 0 20px;
  margin: 0;
  padding: 0;
}
@media (max-width: 600px) {
  .dl-table dl {
    gap: 5px;
    flex-wrap: wrap;
  }
}
.dl-table dl dt {
  flex: 0 0 150px;
  font-weight: bold;
  font-size: 0.85rem;
  padding: 0 5px;
}
@media (min-width: 601px) {
  .dl-table dl dt {
    white-space: nowrap;
  }
}
@media (max-width: 600px) {
  .dl-table dl dt {
    flex: unset;
    width: 100%;
  }
}
.dl-table dl dd {
  flex: 1 1 auto;
  font-size: 0.85rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
  margin: 0;
  padding: 0 5px;
}
@media (max-width: 600px) {
  .dl-table dl dd {
    flex: unset;
    width: 100%;
    min-height: 20px;
  }
}
@media (max-width: 600px) {
  .dl-table dl dd .columns {
    flex-wrap: wrap;
  }
}
.dl-table dl + dl {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #ccc;
}
.dl-table .title {
  margin: 1.7rem 0 1.2rem;
  padding: 0.3rem 0.5rem;
  font-size: 0.75rem;
  background: radial-gradient(circle at 18.7% 37.8%, #f3f5f5 0%, #f2f6f7 90%);
}
.dl-table .comments {
  border-collapse: collapse;
}
.dl-table .comments th {
  vertical-align: top;
}
.dl-table .comments th,
.dl-table .comments td {
  padding: 0.3rem 1rem;
}
.dl-table .comments th .user,
.dl-table .comments td .user {
  margin-top: 0.2rem;
  display: flex;
  gap: 0 1rem;
}
.dl-table .comments tr + tr th,
.dl-table .comments tr + tr td {
  border-top: 1px solid #ccc;
}

.qui-date {
  font-feature-settings: "palt";
}

.with-brackets::before {
  font-feature-settings: "palt";
  content: "（";
}
.with-brackets::after {
  font-feature-settings: "palt";
  content: "）";
}
.with-brackets:empty {
  display: none;
}

.columns {
  display: flex;
  align-items: center;
  gap: 10px;
}
.columns.align-top {
  align-items: flex-start;
}
.columns.split {
  justify-content: space-between;
}
.columns.with-comma {
  flex-wrap: wrap;
  gap: 3px 10px;
}
.columns.with-comma > *::after {
  content: ",";
}
.columns.with-comma > *:last-child::after {
  display: none;
}

.qui-modal .modal-head-menu {
  display: flex;
  gap: 0 10px;
  justify-content: flex-end;
}
@media (max-width: 600px) {
  .qui-modal .modal-head-menu {
    gap: 5px 10px;
    flex-wrap: wrap;
  }
}

.csv-import {
  max-width: 800px;
  margin: 1rem auto 3rem;
  padding: 1rem;
  background: var(--default-bg);
  border-radius: 5px;
}
.csv-import .title {
  margin: 0.5rem 0;
  font-size: 1.1rem;
}
.csv-import p {
  margin: 0.1rem 0;
}
.csv-import .qui-buttons {
  margin: 1rem 0 0.5rem;
}
.csv-import .report {
  display: flex;
  justify-content: center;
}
.csv-import .report > div {
  background: white;
  border-radius: 4px;
  padding: 0.5rem 2rem;
}
.csv-import .report > div .number {
  padding: 0 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
}
.csv-import .qui-buttons .qui-button {
  width: 200px;
}

.purge {
  max-width: 600px;
  margin: 1rem auto 3rem;
  padding: 1rem;
  background: var(--default-bg);
  border-radius: 5px;
}
.purge .title {
  margin: 0.5rem 0;
  font-size: 1.1rem;
}
.purge p {
  margin: 0.1rem 0;
}
.purge .qui-buttons {
  margin: 1rem 0 0.5rem;
}

.hidden-file-uploader {
  display: none;
}

.qui-badge.app-status-20 {
  background-color: #009be2;
  border-color: rgb(30, 166, 230);
}
.qui-badge.app-status-30, .qui-badge.app-status-50, .qui-badge.app-status-100 {
  background-color: #00b82e;
  border-color: #24db52;
}
.qui-badge.app-status-40, .qui-badge.app-status-60, .qui-badge.app-status-110 {
  background-color: #bd3905;
  border-color: #e00d0d;
}
.qui-badge.app-status-70 {
  background-color: #fdcaca;
  border-color: #fdcaca;
  color: #c53838;
}
.qui-badge.app-status-200 {
  background-color: #8652da;
  border-color: #9b79d3;
  color: #fff;
}
.qui-badge.black {
  background-color: black;
  border-color: black;
}

.qui-table .application-type {
  text-align: center;
}

.qui-table-container.usage thead div.button {
  padding: 8px 0 5px;
}
.qui-table-container.usage tbody th {
  text-align: center;
}
.qui-table-container.usage tbody td.icon {
  text-align: center;
  padding: 10px 0;
}
.qui-table-container.usage tbody th.my {
  background-color: #def7de;
}
.qui-table-container.usage tbody th.customer {
  background-color: #d5e9f5;
}
.qui-table-container.usage tbody td .current {
  margin-bottom: 5px;
}

.customers-usage-patterns {
  padding: 0 0 1rem;
}
.customers-usage-patterns ul {
  margin: 0 0 0 3rem;
}
.customers-usage-patterns ul li {
  font-size: 1rem;
}
.customers-usage-patterns ul li + li {
  margin-top: 0.2rem;
}

.qui-badge.party-status-1, .qui-badge.party-status-101 {
  background-color: var(--primary);
  border-color: var(--primary);
}
.qui-badge.party-status-2, .qui-badge.party-status-102 {
  background-color: var(--success);
  border-color: var(--success);
}
.qui-badge.party-status-3, .qui-badge.party-status-103 {
  background-color: #dc9411;
  border-color: #dc9411;
}
.qui-badge.party-status-4, .qui-badge.party-status-104 {
  background-color: var(--danger);
  border-color: var(--danger);
}
.qui-badge.party-status-1 {
  width: 100px;
}
.qui-table .qui-badge.party-status-1 {
  width: 70px;
}
.qui-badge.party-status-2 {
  width: 100px;
}
.qui-table .qui-badge.party-status-2 {
  width: 70px;
}
.qui-badge.party-status-3 {
  width: 100px;
}
.qui-table .qui-badge.party-status-3 {
  width: 70px;
}
.qui-badge.party-status-4 {
  width: 100px;
}
.qui-table .qui-badge.party-status-4 {
  width: 70px;
}
.qui-badge.party-status-101 {
  font-feature-settings: "palt";
  width: 120px;
}
.qui-table .qui-badge.party-status-101 {
  width: 105px;
}
.qui-badge.party-status-102 {
  font-feature-settings: "palt";
  width: 120px;
}
.qui-table .qui-badge.party-status-102 {
  width: 105px;
}
.qui-badge.party-status-103 {
  font-feature-settings: "palt";
  width: 120px;
}
.qui-table .qui-badge.party-status-103 {
  width: 105px;
}
.qui-badge.party-status-104 {
  font-feature-settings: "palt";
  width: 120px;
}
.qui-table .qui-badge.party-status-104 {
  width: 105px;
}

.qui-badge.main-customer {
  width: 70px;
  background-color: var(--primary);
  border: none;
}
.qui-badge.main-manager {
  width: 70px;
  background-color: var(--success);
  border: none;
}
.qui-badge.ate-sapo {
  width: 70px;
  background-color: #c01bc0;
  border: none;
}

body .pre-wrap {
  white-space: pre-wrap !important;
}

body .pre {
  white-space: pre !important;
}

.lang-en:lang(ja) {
  display: none !important;
}

.lang-ja:lang(en) {
  display: none !important;
}

#app-lang-switcher {
  display: flex;
  justify-content: center;
  align-items: center;
}

.lang-switcher {
  appearance: none;
  border: none;
  border-radius: 100px;
  background: white;
  color: var(--primary);
  font-weight: 500;
  font-size: 0.85rem;
  padding: 5px 12px;
  cursor: pointer;
  opacity: 0.85;
  transition-duration: 0.2s;
  white-space: nowrap;
}
@media (max-width: 600px) {
  .lang-switcher {
    position: absolute;
    z-index: 100;
    top: 10px;
    right: 10px;
    font-size: 0.7rem;
    padding: 3px 10px;
  }
}
.lang-switcher:hover {
  opacity: 1;
}

.top-container .row {
  display: flex;
  gap: 2rem;
  max-width: 1000px;
  margin: 2rem auto;
  align-items: stretch;
}
@media (max-width: 834px) {
  .top-container .row {
    flex-wrap: wrap;
  }
}
@media (max-width: 600px) {
  .top-container .row:first-child {
    margin-top: 0;
  }
}
.top-container .row > .left,
.top-container .row > .right {
  flex: 1;
  display: flex;
  flex-direction: column;
}
@media (max-width: 834px) {
  .top-container .row > .left,
  .top-container .row > .right {
    flex-basis: 100%;
    max-width: 100%;
  }
}
@media (min-width: 835px) {
  .top-container .row > .left {
    flex-basis: 60%;
  }
}
@media (min-width: 835px) {
  .top-container .row > .right {
    flex-basis: 40%;
  }
}
.top-container .row > .left.has-share-group .qui-window.news {
  max-height: calc(100vh - 300px);
}
.top-container .qui-window {
  width: 100%;
  flex: 1 1 50%;
}
.top-container .qui-window + .qui-window {
  margin-top: 2rem;
}
.top-container .qui-window .page-header .title {
  font-size: 1.2rem;
}
.top-container .qui-window .sub-title {
  font-weight: 700;
  font-size: 1rem;
}
.top-container .qui-window .dl-table {
  padding: 0;
}
@media (min-width: 601px) {
  .top-container .qui-window .dl-table dl dt {
    flex-basis: 100px;
  }
}
.top-container .qui-window .dl-table dl dd {
  margin-left: 10px;
}
.top-container .qui-window .dl-table .party-name {
  gap: 0 5px;
}
.top-container .qui-window .dl-table .party-name dt {
  font-size: 0.8rem;
}
.top-container .qui-window .dl-table .party-name dd {
  margin-left: 0;
}
.top-container .qui-window.news {
  max-height: calc(100vh - 100px);
}
.top-container .qui-window .news-container {
  height: calc(100% - 50px);
  overflow: auto;
}
.top-container .qui-window .news-container .news-row + .news-row {
  margin-top: 1.2rem;
  padding-top: 1rem;
  border-top: 1px solid #ccc;
}
.top-container .qui-window .news-container .title-header {
  display: flex;
  justify-content: space-between;
  gap: 0 2rem;
}
.top-container .qui-window .news-container .title-header .column-date {
  white-space: nowrap;
}
.top-container .qui-window .news-container .contents {
  margin: 1rem 0 0.5rem;
}
.top-container .qui-window .news-container .contents .jp {
  white-space: pre-wrap;
}
.top-container .qui-window .news-container .contents .en {
  white-space: pre-wrap;
  font-size: 0.75rem;
}
.top-container .qui-window .news-container .contents .jp + .en {
  margin-top: 0.5rem;
}
.top-container .qui-window .news-body {
  padding: 0 0.8rem 0.8rem;
}
.top-container .qui-window .news-detail {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.top-container .qui-window .news-detail p {
  margin: 0.5rem;
  white-space: pre-wrap;
  line-height: 1.6;
}
.top-container .qui-window .news-detail.en p {
  font-size: 0.75rem;
}
.top-container .qui-window .news-detail + .news-detail {
  margin-top: 1rem;
}
.top-container .qui-window .news-detail .file {
  display: flex;
  justify-content: center;
  margin: 1rem 0;
}
.top-container .qui-window .news-detail .file .qui-button {
  width: 150px;
}
.top-container .qui-window.emergency {
  padding: 1rem;
  border: 2px solid #ffad76;
  background-color: #fefff5;
  font-size: 0.88rem;
  font-weight: 500;
  white-space: pre-wrap;
}

.company-selector.qui-form-row > .input {
  display: flex;
  gap: 0 20px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.company-selector.qui-form-row > .input .qui-form-control {
  flex: 1 1 calc(100% - 120px);
}
.company-selector.qui-form-row > .input .qui-button {
  flex: 0 0 100px;
}
.company-selector.qui-form-row .company-options {
  position: relative;
  height: 40vh;
}
.company-selector.qui-form-row .company-options .input {
  position: relative;
  height: 100%;
}
.company-selector.qui-form-row .company-options .options {
  height: calc(100% - 90px);
  overflow: auto;
  margin-top: 10px;
  padding-top: 3px;
}
.company-selector.qui-form-row .company-options .options .item {
  border: 1px solid var(--form-border);
  padding: 0.5rem;
  margin-top: -1px;
  cursor: pointer;
}
.company-selector.qui-form-row .company-options .options .item:hover {
  background-color: var(--primary-bg);
}
.company-selector.qui-form-row .company-options .options .item.active {
  background-color: var(--primary);
  color: white;
}
.company-selector.qui-form-row .company-options .options .item:first-child {
  border-radius: 4px 4px 0 0;
}
.company-selector.qui-form-row .company-options .options .item:last-child {
  border-radius: 0px 0 4px 4px;
}
.company-selector.qui-form-row .qui-buttons {
  position: relative;
  z-index: 100;
}/*# sourceMappingURL=style.css.map */