gulu-vue2/dist/index.css

用 Vue2 做的 UI 框架

.g-icon[data-v-63c635] {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
.g-icon.loading[data-v-63c635] {
    animation: spin-data-v-63c635 1s linear infinite;
}
@keyframes spin-data-v-63c635 {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}

.g-button[data-v-b6c73f] {
  height: 32px;
  background: #fff;
  font-size: 14px;
  border: 1px solid #999;
  border-radius: 4px;
  padding: 0 1em;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}
.g-button[data-v-b6c73f]:hover {
    border-color: #666;
}
.g-button[data-v-b6c73f]:active {
    background: #eee;
}
.g-button[data-v-b6c73f]:focus {
    outline: none;
}
.g-button > .icon[data-v-b6c73f], .g-button.icon-left > .icon[data-v-b6c73f] {
    order: 1;
    margin-right: .2em;
}
.g-button > .content[data-v-b6c73f], .g-button.icon-left > .content[data-v-b6c73f] {
    order: 2;
}
.g-button.icon-right > .icon[data-v-b6c73f] {
    order: 2;
    margin-left: .2em;
    margin-right: 0;
}
.g-button.icon-right > .content[data-v-b6c73f] {
    order: 1;
}

.g-button-group[data-v-d9f1cb] {
  display: inline-flex;
  vertical-align: middle;
}
.g-button-group > .g-button[data-v-d9f1cb] {
    border-radius: 0;
}
.g-button-group > .g-button[data-v-d9f1cb]:first-child {
      border-radius: 4px 0 0 4px;
}
.g-button-group > .g-button[data-v-d9f1cb]:last-child {
      border-radius: 0 4px 4px 0;
}
.g-button-group > .g-button[data-v-d9f1cb]:not(:first-child) {
      margin-left: -1px;
}
.g-button-group > .g-button[data-v-d9f1cb]:hover {
      position: relative;
      z-index: 1;
}

.input-wrapper[data-v-ab4797] {
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}
.input-wrapper > input[data-v-ab4797] {
    height: 32px;
    font-size: inherit;
    border: 1px solid #999;
    border-radius: 4px;
    padding: 0 8px;
}
.input-wrapper > input[data-v-ab4797]:hover {
      border-color: #666;
}
.input-wrapper > input[data-v-ab4797]:focus {
      outline: none;
      box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5);
}
.input-wrapper > input[disabled][data-v-ab4797] {
      color: #bbb;
      border-color: #bbb;
      cursor: not-allowed;
}
.input-wrapper > input[readonly][data-v-ab4797] {
      color: #bbb;
      border-color: #bbb;
}
.input-wrapper > input.error[data-v-ab4797] {
      border: 1px solid #f1453d;
}
.input-wrapper > .error-icon[data-v-ab4797] {
    fill: #f1453d;
    margin: 0 .5em;
}
.input-wrapper > .error-message[data-v-ab4797] {
    color: #f1453d;
}

.g-row[data-v-d4771e] {
  display: flex;
  flex-wrap: wrap;
}
.g-row.align-center[data-v-d4771e] {
    justify-content: center;
}
.g-row.align-right[data-v-d4771e] {
    justify-content: right;
}

.g-col.col-1[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-1[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-2[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-2[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-3[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-3[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-4[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-4[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-5[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-5[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-6[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-6[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-7[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-7[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-8[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-8[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-9[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-9[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-10[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-10[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-11[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-11[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-12[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-12[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-13[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-13[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-14[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-14[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-15[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-15[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-16[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-16[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-17[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-17[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-18[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-18[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-19[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-19[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-20[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-20[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-21[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-21[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-22[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-22[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-23[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-23[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
.g-col.col-24[data-v-0a5a3c] {
  width: calc($i / 24 * 100%);
}
.g-col.offset-24[data-v-0a5a3c] {
  margin-left: calc($i / 24 * 100%);
}
@media (min-width: 577px) {
.g-col.col-pad-1[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-1[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-2[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-2[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-3[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-3[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-4[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-4[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-5[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-5[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-6[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-6[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-7[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-7[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-8[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-8[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-9[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-9[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-10[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-10[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-11[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-11[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-12[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-12[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-13[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-13[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-14[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-14[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-15[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-15[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-16[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-16[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-17[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-17[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-18[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-18[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-19[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-19[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-20[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-20[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-21[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-21[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-22[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-22[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-23[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-23[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pad-24[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pad-24[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
}
@media (min-width: 769px) {
.g-col.col-narrowPc-1[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-1[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-2[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-2[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-3[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-3[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-4[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-4[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-5[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-5[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-6[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-6[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-7[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-7[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-8[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-8[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-9[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-9[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-10[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-10[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-11[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-11[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-12[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-12[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-13[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-13[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-14[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-14[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-15[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-15[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-16[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-16[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-17[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-17[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-18[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-18[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-19[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-19[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-20[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-20[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-21[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-21[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-22[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-22[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-23[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-23[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-narrowPc-24[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-narrowPc-24[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
}
@media (min-width: 993px) {
.g-col.col-pc-1[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-1[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-2[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-2[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-3[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-3[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-4[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-4[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-5[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-5[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-6[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-6[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-7[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-7[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-8[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-8[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-9[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-9[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-10[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-10[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-11[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-11[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-12[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-12[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-13[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-13[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-14[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-14[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-15[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-15[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-16[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-16[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-17[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-17[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-18[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-18[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-19[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-19[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-20[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-20[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-21[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-21[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-22[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-22[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-23[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-23[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-pc-24[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-pc-24[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
}
@media (min-width: 1201px) {
.g-col.col-widePc-1[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-1[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-2[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-2[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-3[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-3[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-4[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-4[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-5[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-5[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-6[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-6[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-7[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-7[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-8[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-8[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-9[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-9[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-10[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-10[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-11[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-11[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-12[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-12[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-13[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-13[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-14[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-14[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-15[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-15[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-16[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-16[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-17[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-17[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-18[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-18[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-19[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-19[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-20[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-20[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-21[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-21[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-22[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-22[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-23[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-23[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
.g-col.col-widePc-24[data-v-0a5a3c] {
    width: calc($i / 24 * 100%);
}
.g-col.offset-widePc-24[data-v-0a5a3c] {
    margin-left: calc($i / 24 * 100%);
}
}

.g-layout[data-v-10e1c5] {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.g-layout.has-sider[data-v-10e1c5] {
    flex-direction: row;
    flex-grow: 1;
}

.g-header[data-v-062e3a] {}.g-sider[data-v-32bb7d] {}
.g-content[data-v-5a5f89] {
  flex-grow: 1;
}.g-footer[data-v-d84a21] {}.g-tabs[data-v-809d15] {}
.g-tabsHead[data-v-308b6a] {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
.g-tabsHead > .tabsItem-wrapper[data-v-308b6a] {
    display: flex;
}
.g-tabsHead > .tabsItem-wrapper[data-v-308b6a]::after {
      content: "";
      width: 100%;
      height: 2px;
      background: #e4e7ed;
      position: absolute;
      left: 0;
      bottom: 0;
}
.g-tabsHead > .tabsItem-wrapper > .line[data-v-308b6a] {
      height: 2px;
      background: #409eff;
      position: absolute;
      left: 0;
      bottom: 0;
      z-index: 1;
      transition: all 0.2s linear;
}
.g-tabsHead > .actions-wrapper[data-v-308b6a] {
    margin-left: auto;
}
.g-tabsItem[data-v-dcd073] {
  height: 40px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.g-tabsItem[data-v-dcd073]:hover {
    color: #409eff;
}
.g-tabsItem.active[data-v-dcd073] {
    color: #409eff;
}
.g-tabsItem.disabled[data-v-dcd073] {
    color: grey;
    cursor: not-allowed;
}

.g-tabsBody[data-v-76564f] {
}
.g-tabsPane[data-v-d7aeab] {
  display: none;
  padding: 10px;
}
.g-tabsPane.active[data-v-d7aeab] {
    display: block;
}

.g-popover-content-wrapper[data-v-e56be5] {
  max-width: 20em;
  background: #fff;
  border: 1px solid #333;
  border-radius: 4px;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.5));
  word-break: break-all;
  padding: 10px;
  position: absolute;
}
.g-popover-content-wrapper[data-v-e56be5]::before, .g-popover-content-wrapper[data-v-e56be5]::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    position: absolute;
}
.g-popover-content-wrapper.position-top[data-v-e56be5] {
    transform: translateY(-10px);
}
.g-popover-content-wrapper.position-top[data-v-e56be5]::before {
      border-top-color: #000;
      border-bottom: none;
      left: 10px;
      top: 100%;
}
.g-popover-content-wrapper.position-top[data-v-e56be5]::after {
      border-top-color: #fff;
      border-bottom: none;
      left: 10px;
      top: calc(100% - 1px);
}
.g-popover-content-wrapper.position-bottom[data-v-e56be5] {
    transform: translateY(10px);
}
.g-popover-content-wrapper.position-bottom[data-v-e56be5]::before {
      border-bottom-color: #000;
      border-top: none;
      left: 10px;
      bottom: 100%;
}
.g-popover-content-wrapper.position-bottom[data-v-e56be5]::after {
      border-bottom-color: #fff;
      border-top: none;
      left: 10px;
      bottom: calc(100% - 1px);
}
.g-popover-content-wrapper.position-left[data-v-e56be5] {
    transform: translateX(-10px);
}
.g-popover-content-wrapper.position-left[data-v-e56be5]::before {
      border-left-color: #000;
      border-right: none;
      top: 50%;
      left: 100%;
      transform: translateY(-50%);
}
.g-popover-content-wrapper.position-left[data-v-e56be5]::after {
      border-left-color: #fff;
      border-right: none;
      top: 50%;
      left: calc(100% - 1px);
      transform: translateY(-50%);
}
.g-popover-content-wrapper.position-right[data-v-e56be5] {
    transform: translateX(10px);
}
.g-popover-content-wrapper.position-right[data-v-e56be5]::before {
      border-right-color: #000;
      border-left: none;
      top: 50%;
      right: 100%;
      transform: translateY(-50%);
}
.g-popover-content-wrapper.position-right[data-v-e56be5]::after {
      border-right-color: #fff;
      border-left: none;
      top: 50%;
      right: calc(100% - 1px);
      transform: translateY(-50%);
}
.g-popover[data-v-e56be5] {
  display: inline-block;
  vertical-align: middle;
  position: relative;
}
.g-popover > .trigger-wrapper[data-v-e56be5] {
    display: inline-block;
}

.g-collapse[data-v-4bb70d] {
  border: 1px solid #ddd;
  border-radius: 4px;
}

.g-collapseItem > .title[data-v-9c587f] {
  min-height: 32px;
  background: #f1f1f1;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  padding: 0 8px;
  margin-top: -1px;
  margin-left: -1px;
  margin-right: -1px;
}
.g-collapseItem:first-child > .title[data-v-9c587f] {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.g-collapseItem:last-child > .title[data-v-9c587f]:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.g-collapseItem > .content[data-v-9c587f] {
  padding: 8px;
}