@charset "UTF-8";
/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  file import
 * ---------------------------- */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%;
  scrollbar-gutter: stable;
}
html:has(dialog:modal[open]) {
  overflow: clip;
}

body {
  font-family: system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  font-size: inherit;
  font-weight: inherit;
  overflow-wrap: break-word;
}

ol,
ul {
  list-style: none;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
}

img,
picture,
svg,
video {
  max-inline-size: 100%;
  block-size: auto;
}

button {
  all: unset;
  overflow: visible;
  cursor: pointer;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
  font-size: 1rem;
}

textarea {
  resize: vertical;
  resize: block;
}

button,
label,
select,
summary {
  cursor: pointer;
}

:disabled {
  cursor: not-allowed;
}

summary {
  display: list-item;
}

a {
  color: inherit;
}

hr {
  border: none;
  -webkit-border-before: 1px solid;
          border-block-start: 1px solid;
  color: inherit;
  block-size: 0;
  overflow: visible;
}

/* -------------------------------
 *  printing mode
 * ---------------------------- */
@media print {
  html body {
    zoom: 65%;
  }
}
/* -------------------------------
 *  palette color
 * ---------------------------- */
/* -------------------------------
 *  gray color
 * ---------------------------- */
/* -------------------------------
 *  status color
 * ---------------------------- */
/* -------------------------------
 *  theme color
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-palette-color__red--0: #fee2e2;
  --su-palette-color__red--1: #fecaca;
  --su-palette-color__red--2: #fca5a5;
  --su-palette-color__red--3: #f87171;
  --su-palette-color__red--4: #ef4444;
  --su-palette-color__red--5: #dc2626;
  --su-palette-color__red--6: #b91c1c;
  --su-palette-color__red--7: #991b1b;
  --su-palette-color__red--8: #7f1d1d;
  --su-palette-color__red--9: #450a0a;
  --su-palette-color__orange--0: #ffedd5;
  --su-palette-color__orange--1: #fed7aa;
  --su-palette-color__orange--2: #fdba74;
  --su-palette-color__orange--3: #fb923c;
  --su-palette-color__orange--4: #f97316;
  --su-palette-color__orange--5: #ea580c;
  --su-palette-color__orange--6: #c2410c;
  --su-palette-color__orange--7: #9a3412;
  --su-palette-color__orange--8: #7c2d12;
  --su-palette-color__orange--9: #431407;
  --su-palette-color__orange-yellow--0: #fef3c7;
  --su-palette-color__orange-yellow--1: #fde68a;
  --su-palette-color__orange-yellow--2: #fcd34d;
  --su-palette-color__orange-yellow--3: #fbbf24;
  --su-palette-color__orange-yellow--4: #f59e0b;
  --su-palette-color__orange-yellow--5: #d97706;
  --su-palette-color__orange-yellow--6: #b45309;
  --su-palette-color__orange-yellow--7: #92400e;
  --su-palette-color__orange-yellow--8: #78350f;
  --su-palette-color__orange-yellow--9: #451a03;
  --su-palette-color__yellow--0: #fef9c3;
  --su-palette-color__yellow--1: #fef08a;
  --su-palette-color__yellow--2: #fde047;
  --su-palette-color__yellow--3: #facc15;
  --su-palette-color__yellow--4: #eab308;
  --su-palette-color__yellow--5: #ca8a04;
  --su-palette-color__yellow--6: #a16207;
  --su-palette-color__yellow--7: #854d0e;
  --su-palette-color__yellow--8: #713f12;
  --su-palette-color__yellow--9: #422006;
  --su-palette-color__yellow-green--0: #ecfccb;
  --su-palette-color__yellow-green--1: #d9f99d;
  --su-palette-color__yellow-green--2: #bef264;
  --su-palette-color__yellow-green--3: #a3e635;
  --su-palette-color__yellow-green--4: #84cc16;
  --su-palette-color__yellow-green--5: #65a30d;
  --su-palette-color__yellow-green--6: #4d7c0f;
  --su-palette-color__yellow-green--7: #3f6212;
  --su-palette-color__yellow-green--8: #365314;
  --su-palette-color__yellow-green--9: #1a2e05;
  --su-palette-color__green--0: #dcfce7;
  --su-palette-color__green--1: #bbf7d0;
  --su-palette-color__green--2: #86efac;
  --su-palette-color__green--3: #4ade80;
  --su-palette-color__green--4: #22c55e;
  --su-palette-color__green--5: #16a34a;
  --su-palette-color__green--6: #15803d;
  --su-palette-color__green--7: #166534;
  --su-palette-color__green--8: #14532d;
  --su-palette-color__green--9: #052e16;
  --su-palette-color__teal--0: #ccfbf1;
  --su-palette-color__teal--1: #99f6e4;
  --su-palette-color__teal--2: #5eead4;
  --su-palette-color__teal--3: #2dd4bf;
  --su-palette-color__teal--4: #14b8a6;
  --su-palette-color__teal--5: #0d9488;
  --su-palette-color__teal--6: #0f766e;
  --su-palette-color__teal--7: #115e59;
  --su-palette-color__teal--8: #134e4a;
  --su-palette-color__teal--9: #042f2e;
  --su-palette-color__cyan--0: #cffafe;
  --su-palette-color__cyan--1: #a5f3fc;
  --su-palette-color__cyan--2: #67e8f9;
  --su-palette-color__cyan--3: #22d3ee;
  --su-palette-color__cyan--4: #06b6d4;
  --su-palette-color__cyan--5: #0891b2;
  --su-palette-color__cyan--6: #0e7490;
  --su-palette-color__cyan--7: #155e75;
  --su-palette-color__cyan--8: #164e63;
  --su-palette-color__cyan--9: #083344;
  --su-palette-color__light-blue--0: #e0f2fe;
  --su-palette-color__light-blue--1: #bae6fd;
  --su-palette-color__light-blue--2: #7dd3fc;
  --su-palette-color__light-blue--3: #38bdf8;
  --su-palette-color__light-blue--4: #0ea5e9;
  --su-palette-color__light-blue--5: #0284c7;
  --su-palette-color__light-blue--6: #0369a1;
  --su-palette-color__light-blue--7: #075985;
  --su-palette-color__light-blue--8: #0c4a6e;
  --su-palette-color__light-blue--9: #082f49;
  --su-palette-color__blue--0: #dbeafe;
  --su-palette-color__blue--1: #bfdbfe;
  --su-palette-color__blue--2: #93c5fd;
  --su-palette-color__blue--3: #60a5fa;
  --su-palette-color__blue--4: #3b82f6;
  --su-palette-color__blue--5: #2563eb;
  --su-palette-color__blue--6: #1d4ed8;
  --su-palette-color__blue--7: #1e40af;
  --su-palette-color__blue--8: #1e3a8a;
  --su-palette-color__blue--9: #172554;
  --su-palette-color__blue-violet--0: #e0e7ff;
  --su-palette-color__blue-violet--1: #c7d2fe;
  --su-palette-color__blue-violet--2: #a5b4fc;
  --su-palette-color__blue-violet--3: #818cf8;
  --su-palette-color__blue-violet--4: #6366f1;
  --su-palette-color__blue-violet--5: #4f46e5;
  --su-palette-color__blue-violet--6: #4338ca;
  --su-palette-color__blue-violet--7: #3730a3;
  --su-palette-color__blue-violet--8: #312e81;
  --su-palette-color__blue-violet--9: #1e1b4b;
  --su-palette-color__violet--0: #ede9fe;
  --su-palette-color__violet--1: #ddd6fe;
  --su-palette-color__violet--2: #c4b5fd;
  --su-palette-color__violet--3: #a78bfa;
  --su-palette-color__violet--4: #8b5cf6;
  --su-palette-color__violet--5: #7c3aed;
  --su-palette-color__violet--6: #6d28d9;
  --su-palette-color__violet--7: #5b21b6;
  --su-palette-color__violet--8: #4c1d95;
  --su-palette-color__violet--9: #2e1065;
  --su-palette-color__purple--0: #f3e8ff;
  --su-palette-color__purple--1: #e9d5ff;
  --su-palette-color__purple--2: #d8b4fe;
  --su-palette-color__purple--3: #c084fc;
  --su-palette-color__purple--4: #a855f7;
  --su-palette-color__purple--5: #9333ea;
  --su-palette-color__purple--6: #7e22ce;
  --su-palette-color__purple--7: #6b21a8;
  --su-palette-color__purple--8: #581c87;
  --su-palette-color__purple--9: #3b0764;
  --su-palette-color__magenta--0: #fae8ff;
  --su-palette-color__magenta--1: #f5d0fe;
  --su-palette-color__magenta--2: #f0abfc;
  --su-palette-color__magenta--3: #e879f9;
  --su-palette-color__magenta--4: #d946ef;
  --su-palette-color__magenta--5: #c026d3;
  --su-palette-color__magenta--6: #a21caf;
  --su-palette-color__magenta--7: #86198f;
  --su-palette-color__magenta--8: #701a75;
  --su-palette-color__magenta--9: #4a044e;
  --su-palette-color__pink--0: #fce7f3;
  --su-palette-color__pink--1: #fbcfe8;
  --su-palette-color__pink--2: #f9a8d4;
  --su-palette-color__pink--3: #f472b6;
  --su-palette-color__pink--4: #ec4899;
  --su-palette-color__pink--5: #db2777;
  --su-palette-color__pink--6: #be185d;
  --su-palette-color__pink--7: #9d174d;
  --su-palette-color__pink--8: #831843;
  --su-palette-color__pink--9: #500724;
  --su-palette-color__pink-red--0: #ffe4e6;
  --su-palette-color__pink-red--1: #fecdd3;
  --su-palette-color__pink-red--2: #fda4af;
  --su-palette-color__pink-red--3: #fb7185;
  --su-palette-color__pink-red--4: #f43f5e;
  --su-palette-color__pink-red--5: #e11d48;
  --su-palette-color__pink-red--6: #be123c;
  --su-palette-color__pink-red--7: #9f1239;
  --su-palette-color__pink-red--8: #881337;
  --su-palette-color__pink-red--9: #4c0519;
  --su-gray-color__cool--0: #f1f5f9;
  --su-gray-color__cool--1: #e2e8f0;
  --su-gray-color__cool--2: #cbd5e1;
  --su-gray-color__cool--3: #94a3b8;
  --su-gray-color__cool--4: #64748b;
  --su-gray-color__cool--5: #475569;
  --su-gray-color__cool--6: #334155;
  --su-gray-color__cool--7: #1e293b;
  --su-gray-color__cool--8: #0f172a;
  --su-gray-color__cool--9: #020617;
  --su-gray-color__warm--0: #f5f5f4;
  --su-gray-color__warm--1: #e7e5e4;
  --su-gray-color__warm--2: #d6d3d1;
  --su-gray-color__warm--3: #a8a29e;
  --su-gray-color__warm--4: #78716c;
  --su-gray-color__warm--5: #57534e;
  --su-gray-color__warm--6: #44403c;
  --su-gray-color__warm--7: #292524;
  --su-gray-color__warm--8: #1c1917;
  --su-gray-color__warm--9: #0c0a09;
  --su-gray-color__mono--0: #f4f4f4;
  --su-gray-color__mono--1: #e4e4e4;
  --su-gray-color__mono--2: #d4d4d4;
  --su-gray-color__mono--3: #a1a1a1;
  --su-gray-color__mono--4: #717171;
  --su-gray-color__mono--5: #525252;
  --su-gray-color__mono--6: #3f3f3f;
  --su-gray-color__mono--7: #272727;
  --su-gray-color__mono--8: #181818;
  --su-gray-color__mono--9: #090909;
  --su-color-white: #ffffff;
  --su-color-black: #000000;
  --su-status-color__error--0: color-mix(in srgb, #ff0011 15%, white);
  --su-status-color__error--1: color-mix(in srgb, #ff0011 30%, white);
  --su-status-color__error--2: color-mix(in srgb, #ff0011 45%, white);
  --su-status-color__error--3: color-mix(in srgb, #ff0011 60%, white);
  --su-status-color__error--4: #ff0011;
  --su-status-color__error--5: color-mix(in srgb, #ff0011 75%, black);
  --su-status-color__error--6: color-mix(in srgb, #ff0011 60%, black);
  --su-status-color__error--7: color-mix(in srgb, #ff0011 45%, black);
  --su-status-color__error--8: color-mix(in srgb, #ff0011 30%, black);
  --su-status-color__error--9: color-mix(in srgb, #ff0011 15%, black);
  --su-status-color__warning--0: color-mix(in srgb, #ffbb00 15%, white);
  --su-status-color__warning--1: color-mix(in srgb, #ffbb00 30%, white);
  --su-status-color__warning--2: color-mix(in srgb, #ffbb00 45%, white);
  --su-status-color__warning--3: color-mix(in srgb, #ffbb00 60%, white);
  --su-status-color__warning--4: #ffbb00;
  --su-status-color__warning--5: color-mix(in srgb, #ffbb00 75%, black);
  --su-status-color__warning--6: color-mix(in srgb, #ffbb00 60%, black);
  --su-status-color__warning--7: color-mix(in srgb, #ffbb00 45%, black);
  --su-status-color__warning--8: color-mix(in srgb, #ffbb00 30%, black);
  --su-status-color__warning--9: color-mix(in srgb, #ffbb00 15%, black);
  --su-status-color__success--0: color-mix(in srgb, #00cc44 15%, white);
  --su-status-color__success--1: color-mix(in srgb, #00cc44 30%, white);
  --su-status-color__success--2: color-mix(in srgb, #00cc44 45%, white);
  --su-status-color__success--3: color-mix(in srgb, #00cc44 60%, white);
  --su-status-color__success--4: #00cc44;
  --su-status-color__success--5: color-mix(in srgb, #00cc44 75%, black);
  --su-status-color__success--6: color-mix(in srgb, #00cc44 60%, black);
  --su-status-color__success--7: color-mix(in srgb, #00cc44 45%, black);
  --su-status-color__success--8: color-mix(in srgb, #00cc44 30%, black);
  --su-status-color__success--9: color-mix(in srgb, #00cc44 15%, black);
  --su-status-color__info--0: color-mix(in srgb, #00ccff 15%, white);
  --su-status-color__info--1: color-mix(in srgb, #00ccff 30%, white);
  --su-status-color__info--2: color-mix(in srgb, #00ccff 45%, white);
  --su-status-color__info--3: color-mix(in srgb, #00ccff 60%, white);
  --su-status-color__info--4: #00ccff;
  --su-status-color__info--5: color-mix(in srgb, #00ccff 75%, black);
  --su-status-color__info--6: color-mix(in srgb, #00ccff 60%, black);
  --su-status-color__info--7: color-mix(in srgb, #00ccff 45%, black);
  --su-status-color__info--8: color-mix(in srgb, #00ccff 30%, black);
  --su-status-color__info--9: color-mix(in srgb, #00ccff 15%, black);
  --su-status-color__negative--0: color-mix(in srgb, #aaaaaa 15%, white);
  --su-status-color__negative--1: color-mix(in srgb, #aaaaaa 30%, white);
  --su-status-color__negative--2: color-mix(in srgb, #aaaaaa 45%, white);
  --su-status-color__negative--3: color-mix(in srgb, #aaaaaa 60%, white);
  --su-status-color__negative--4: #aaaaaa;
  --su-status-color__negative--5: color-mix(in srgb, #aaaaaa 75%, black);
  --su-status-color__negative--6: color-mix(in srgb, #aaaaaa 60%, black);
  --su-status-color__negative--7: color-mix(in srgb, #aaaaaa 45%, black);
  --su-status-color__negative--8: color-mix(in srgb, #aaaaaa 30%, black);
  --su-status-color__negative--9: color-mix(in srgb, #aaaaaa 15%, black);
  --su-theme-color__base--0: #f1f5f9;
  --su-theme-color__base--1: #e2e8f0;
  --su-theme-color__base--2: #cbd5e1;
  --su-theme-color__base--3: #94a3b8;
  --su-theme-color__base--4: #64748b;
  --su-theme-color__base--5: #475569;
  --su-theme-color__base--6: #334155;
  --su-theme-color__base--7: #1e293b;
  --su-theme-color__base--8: #0f172a;
  --su-theme-color__base--9: #020617;
  --su-theme-color__primary--0: #e0e7ff;
  --su-theme-color__primary--1: #c7d2fe;
  --su-theme-color__primary--2: #a5b4fc;
  --su-theme-color__primary--3: #818cf8;
  --su-theme-color__primary--4: #6366f1;
  --su-theme-color__primary--5: #4f46e5;
  --su-theme-color__primary--6: #4338ca;
  --su-theme-color__primary--7: #3730a3;
  --su-theme-color__primary--8: #312e81;
  --su-theme-color__primary--9: #1e1b4b;
  --su-theme-color__secondary--0: #e0f2fe;
  --su-theme-color__secondary--1: #bae6fd;
  --su-theme-color__secondary--2: #7dd3fc;
  --su-theme-color__secondary--3: #38bdf8;
  --su-theme-color__secondary--4: #0ea5e9;
  --su-theme-color__secondary--5: #0284c7;
  --su-theme-color__secondary--6: #0369a1;
  --su-theme-color__secondary--7: #075985;
  --su-theme-color__secondary--8: #0c4a6e;
  --su-theme-color__secondary--9: #082f49;
  --su-theme-color__accent--0: #fef3c7;
  --su-theme-color__accent--1: #fde68a;
  --su-theme-color__accent--2: #fcd34d;
  --su-theme-color__accent--3: #fbbf24;
  --su-theme-color__accent--4: #f59e0b;
  --su-theme-color__accent--5: #d97706;
  --su-theme-color__accent--6: #b45309;
  --su-theme-color__accent--7: #92400e;
  --su-theme-color__accent--8: #78350f;
  --su-theme-color__accent--9: #451a03;
}

/* -------------------------------
 *  absolute sizing
 * ---------------------------- */
/* -------------------------------
 *  relative sizing
 * ---------------------------- */
/* -------------------------------
 *  layer order
 * ---------------------------- */
/* -------------------------------
 *  shadow elevation
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-size-6s: 0.125rem;
  --su-size-5s: 0.25rem;
  --su-size-4s: 0.5rem;
  --su-size-3s: 0.625rem;
  --su-size-2s: 0.75rem;
  --su-size-s: 0.875rem;
  --su-size-r: 1rem;
  --su-size-m: 1.125rem;
  --su-size-l: 1.25rem;
  --su-size-2l: 1.5rem;
  --su-size-3l: 1.75rem;
  --su-size-4l: 2rem;
  --su-size-5l: 3rem;
  --su-size-6l: 4rem;
  --su-size-7l: 6rem;
  --su-size-8l: 8rem;
  --su-size-9l: 10rem;
  --su-size-10l: 12rem;
  --su-size-0: 0;
  --su-size-1-12: 8.3333%;
  --su-size-1-10: 10%;
  --su-size-1-6: 16.6666%;
  --su-size-1-5: 20%;
  --su-size-1-4: 25%;
  --su-size-1-3: 33.3333%;
  --su-size-1-2: 50%;
  --su-size-2-3: 66.6666%;
  --su-size-3-4: 75%;
  --su-size-4-5: 80%;
  --su-size-5-6: 83.3333%;
  --su-size-9-10: 90%;
  --su-size-11-12: 91.6666%;
  --su-size-100: 100%;
  --su-size-auto: auto;
  --su-size-content: fit-content;
  --su-size-screen-w: 100vw;
  --su-size-screen-h: 100dvh;
  --su-shadow-elevation-offset-0: 0;
  --su-shadow-elevation-offset-1: 1px;
  --su-shadow-elevation-offset-2: 3px;
  --su-shadow-elevation-offset-3: 5px;
  --su-shadow-elevation-offset-4: 7px;
  --su-shadow-elevation-blur-0: 2px;
  --su-shadow-elevation-blur-1: 6px;
  --su-shadow-elevation-blur-2: 10px;
  --su-shadow-elevation-blur-3: 14px;
  --su-shadow-elevation-blur-4: 18px;
  --su-shadow-elevation-spread-0: 1px;
  --su-shadow-elevation-spread-1: 0;
  --su-shadow-elevation-spread-2: 0;
  --su-shadow-elevation-spread-3: 0;
  --su-shadow-elevation-spread-4: 0;
  --su-shadow-elevation-color-0: rgba(0, 0, 0, 0.4);
  --su-shadow-elevation-color-1: rgba(0, 0, 0, 0.35);
  --su-shadow-elevation-color-2: rgba(0, 0, 0, 0.3);
  --su-shadow-elevation-color-3: rgba(0, 0, 0, 0.25);
  --su-shadow-elevation-color-4: rgba(0, 0, 0, 0.2);
  --su-layer-order-fixed: 100;
  --su-layer-order-alert: 200;
  --su-layer-order-drawer: 300;
  --su-layer-order-dialog: 400;
  --su-layer-order-loading: 500;
  --su-layer-order-infinity: calc(infinity);
}

/* -------------------------------
 *  font
 * ---------------------------- */
/* -------------------------------
 *  format
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-font-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, Hiragino Sans, Hiragino Kaku Gothic ProN, Arial, Yu Gothic Medium, Yu Gothic, YuGothic, Meiryo, sans-serif;
  --su-font-serif: ui-serif, Times New Roman, YuMincho, Yu Mincho, Hiragino Mincho ProN, MS PMincho, serif;
  --su-font-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Roboto Mono, Courier New, Courier, Meiryo, monospace;
  --su-font-thin: 100;
  --su-font-extra-light: 200;
  --su-font-light: 300;
  --su-font-regular: 400;
  --su-font-medium: 500;
  --su-font-semi-bold: 600;
  --su-font-bold: 700;
  --su-font-extra-bold: 800;
  --su-font-black: 900;
  --su-font-italic: italic;
  --su-font-underline: underline;
  --su-font-strike: line-through;
  --su-default-font-size: 1rem;
  --su-default-font-color: #333;
  --su-default-font-weight: normal;
  --su-default-line-height: 1.8;
  --su-default-letter-spacing: 0.0625rem;
}

/* -------------------------------
 *  icon fonts
 * ---------------------------- */
@font-face {
  font-family: "startify-ui icons";
  src: url("data:application/font-woff; charset=utf-8; base64,d09GRgABAAAAABXwAAsAAAAAFaQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABCAAAAGAAAABgDxIGLWNtYXAAAAFoAAAAVAAAAFQXVtKeZ2FzcAAAAbwAAAAIAAAACAAAABBnbHlmAAABxAAAEVwAABFcD2i0n2hlYWQAABMgAAAANgAAADYo2tClaGhlYQAAE1gAAAAkAAAAJAdCA91obXR4AAATfAAAAHAAAABwZgAAAGxvY2EAABPsAAAAOgAAADo/yDu0bWF4cAAAFCgAAAAgAAAAIAAmAIVuYW1lAAAUSAAAAYYAAAGGmUoJ+3Bvc3QAABXQAAAAIAAAACAAAwAAAAMD7AGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA6RcDwP/AAEADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAwAAAAMAAAAcAAEAAwAAABwAAwABAAAAHAAEADgAAAAKAAgAAgACAAEAIOkX//3//wAAAAAAIOkA//3//wAB/+MXBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAA/8AAAAPAAAIAADc5AQAAAAABAAD/wAAAA8AAAgAANzkBAAAAAAEAAP/AAAADwAACAAA3OQEAAAAAAgAA/8ADgAPAAB0ASQAAJTI3PgE3NjU0Jy4BJyYjMSIHDgEHBhUUFx4BFxYzEzIWFTEVMzIWFTEVFAYjMSMVFAYjMSMiJjUxNSMiJjUxNTQ2MzEzNTQ2MzECAFBFRmkeHh4eaUZFUFBFRmkeHh4eaUZFUAkRGaISGRkSohkREhEZohIZGRKiGRFAHh5pRkVQUEVGaR4eHh5pRkVQUEVGaR4eAoAZEqIZERIRGaISGRkSohkREhEZohIZAAADAAD/wAOAA8AAKgA2AEAAAAEjBgcOAQcGFTgBMRUjIgYVFBYzITI2NTQmKwE1NCcuAScmJzU0JiMiBhUXMhYVMRUhNTQ2MzETMjY1MSEUFjMxAasCLScmORARKhIZGRICqhIZGRIqERA5JycuMiMjMoBGZP5WZEZWIzL/ADIjAucIFxZDKyov1hkREhkZEhEZ1i8rKkMXFwcEIzIyI1ZkRtbWRmT9qzIjIzIAAwAA/8ADgAPAADMAUQBwAAABPgEzMhYfATc+ATMyFhUUBgcxBxceARUUBiMiJicxJwcOASMiJjU0NjcxNycuATU0NjcxBTE0Jy4BJyYjIgcOAQcGFTEUFx4BFxYzMjc+ATc2JxQHDgEHBiMiJy4BJyY1MTQ3PgE3NjMyFx4BFxYVMQFpBg8JCRAGWloGEAkRGQYGW1sGBhkRCRAGWloGEAkRGQYGW1sGBgYGAhceHmlGRVBQRUZpHh4eHmlGRVBQRUZpHh5VGBdRNzY+PjY3URcYGBdRNzY+PjY3URcYAlcGBgYGW1sGBhkRCRAGWloGEAkRGQYGW1sGBhkRCRAGWloGEAkJDwaXUEVGaR4eHh5pRkVQUEVGaR4eHh5pRkVQPjY3URcYGBdRNzY+PjY3URcYGBdRNzY+AAAAAAkAAP/AA4ADwAAOABwAKgA5AEgAVgB6AH4AggAAATQ2MzIWFTEUBiMiJjUxNyIGFRQWMzEyNjU0JiMXNDYzMhYVMRQGIyImNQUiBhUUFjMxMjY1NCYjMRc0NjMyFhUxFAYjIiY1MTciBhUUFjMxMjY1NCYjATEyFh0BITU0NjMyFh0BMzIWFREUBiMhIiY1ETQ2OwE1NDYzATUhFRURIREBKxkREhkZEhEZ1RIZGRISGRkSgBkSERkZERIZ/tURGRkREhkZEoAZEhIZGRISGdYSGRkSERkZEf6qEhkBABkSERmAEhkZEv1WEhkZEoAZEQHW/aoCVgFrERkZERIZGRIqGRESGRkSERkqERkZERIZGRJWGRESGRkSERkqERkZERIZGRIqGRESGRkSERkCKxkSKioSGRkSKhkS/asSGRkSAlUSGSoSGf7VgIBV/tUBKwAAAAACAAD/wAOAA8AAHQAtAAAlMSInLgEnJjU0Nz4BNzYzMTIXHgEXFhUUBw4BBwYBIgYVFBYzMSEyNjU0JiMxAgBQRUZpHh4eHmlGRVBQRUZpHh4eHmlGRf7bEhkZEgGqEhkZEkAeHmlGRVBQRUZpHh4eHmlGRVBQRUZpHh4BqxkSEhkZEhIZAAAABQAA/8ADgAPAAA8AIQAxAEIARgAAASIGFRQWMzEhMjY1NCYjMQU0NjMxITIWFRQGIzEhIiY1MRciBhUUFjMxMzI2NTQmIzEFMRQWMyEyNjURNCYjISIGFRMRIREBVREZGREBVhEZGRH+gBkRAVYRGRkR/qoRGSoRGRkRqxIZGRL+gBkSAqoSGRkS/VYSGVUCVgKVGRESGRkSERnVEhkZEhIZGRKAGRIRGRkREhnVEhkZEgKqEhkZEv2AAlb9qgAAAgAA/8ADgAPAACYAQgAAJTc+ATU0JiMiBg8BETQmIyIGFTERJy4BIyIGFRQWHwEeATMyNjcxBRQWMzEhMjY1MTU0JiMiBhUxFSE1NCYjIgYVMQIeugYGGREJDwZxGRISGXEGDwkRGQYGugYPCQkPBv5iGRICqhIZGRIRGf2qGRESGfe6Bg8JEhkHBXIBmRIZGRL+Z3IFBxkSCQ8GugYGBgaMEhkZEqoSGRkSgIASGRkSAAAAAwAA/8ADgAPAABMAHwAiAAABMhYVMREUBiMxISImNTERNDYzMQUBDgEjIiYnMQERIQMhFwNVEhkZEv1WEhkZEgKA/vUGEQkJEQb+9QJWef6csgLrGRL+ABIZGRICABIZX/7XBggIBgEp/l8BqtwAAAMAAP/AA4ADwAAdACwAPAAAATE0Jy4BJyYjIgcOAQcGFTEUFx4BFxYzMjc+ATc2Ax4BFRQHDgEHBiMiJiczCQEuATU0Nz4BNzYzMhYXIwOAHh5pRkVQUEVGaR4eHh5pRkVQUEVGaR4ekRwgGBdRNzY+MlwmAQFm/l4cIBgXUTc2PjJcJgEBwFBFRmkeHh4eaUZFUFBFRmkeHh4eaUZFAQMlXDI+NjdRFxggHAHe/l4lXDI+NjdRFxggHAAAAwAA/8ADgAPAAB0AKwBKAAAlMjc+ATc2NTQnLgEnJiMxIgcOAQcGFRQXHgEXFjMTFAYjIiY1MTQ2MzIWFQc0NjMxMzIWFTEVMhYVFAYjMSMiJjU0NjMxNSImNTECAFBFRmkeHh4eaUZFUFBFRmkeHh4eaUZFUCsmGhslJRsaJoAZESsSGREZGRFWERkZEREZQB4eaUZFUFBFRmkeHh4eaUZFUFBFRmkeHgJAGyUlGxslJRvAEhkZEqsZERIZGRIRGYAZEgAAAAACAAD/wAN+A8AANwBuAAABNz4BNTQmIyIGBzEHDgEjIiY1NDY3MTc+ATMyFhUUBgcxBw4BIyImJzEmNj8BNhYXHgEzMjY3MScHDgEVFBYzMjY/AT4BMzIWFRQGBzEHDgEjIiY1NDY3MTc+ATMyFhcxFgYPAQYmJy4BIyIGBzECT74MDjUlEiEMHwcQChIbCAYgGEAkSmkbF74YQSUpRxkJAwoNCyMLDCATEiEMnr4MDjUlEiEMHwcQChIbCAYgGEMlSmkdGb4YQSUpRxkIAwkNCyMLDCATEiEMAZG9DCESJTUODCAHBxoTCREGIBcbaUokQBi+GBwjHQoaCQ4LBwsMDg4MXr0MIRIlNQ4NHwcHGhIKEQYgGR1pSiVDGL4YHCIeChoJDgsHCw0ODg0AAAAABAAA/8ADgAPAABAAMAA5AD0AAAEiBhUxFRQWMzI2NTE1NCYjJTEyFhURFAYjISImNRE0NjsBNDc+ATc2MzIXHgEXFhUlMSIGFSE0JiMBESERAgASGRkSEhkZEgFVEhkZEv1WEhkZElUUFEYuLzU1Ly5GFBT/AEdkAVZkR/7VAlYBlRkRVhEZGRFWERmrGRL+VhIZGRIBqhIZNS8uRhQUFBRGLi81q2RHR2T/AP6qAVYAAAAABwAA/8ADgAPAAA8AIAAkACgALAA8AE0AACUiBhUUFjMxMzI2NTQmIzEHMRQWMyEyNjURNCYjISIGFRc1IRUVESERETUhFRM0NjMyFhUxFRQGIyImNTETIgYVMREUFjMyNjUxETQmIwFACQwMCSsJDAwJ6xkSAVUSGRkS/qsSGVUBAP8AAQCrGRIRGRkREhnVERkZERIZGRLrDQkJDAwJCQ2AEhkZEgKqEhkZElUrK1X/AAEA/iqAgAGAEhkZEqoSGRkSASoZEf6qERkZEQFWERkAAAACAAD/wAOAA8AAGABeAAABMTIWFTgBOQERFAYjIiY1MRE4ATE0NjMxETgBMTI3PgE3NjU0JicjLgE3PgEXFhceARcWFRQHDgEHBiMiJy4BJyY1NDc+ATc2PwE2FhcWBgcOARUUFx4BFxYzOAE5AQIAEhkZEhIZGRI+NjdRFxg2LQENBgkKIw0gGRkkCQoeHmlGRVBQRUZpHh4KCSQZGR8BDSMKCQYNLjYYF1E3Nj4DQBkS/qsSGRkSAVUSGf1VGBdRNzY+QnMpDCMPDwYLGyAhSykqLFBFRmkeHh4eaUZFUCwqKUsgIRoBCwYPDyMMKXNCPjY3URcYAAIAAP/AA38DwAAnAEUAACUxHgEzMjY1NCYvASM+ATU0Jy4BJyYjIgcOAQcGFRQXHgEXFjMyNjc3FAcOAQcGIyInLgEnJjUxNDc+ATc2MzIXHgEXFhUDNwYPCREZBgXcARwgFxhRNjY9PjY2URgXFxhRNjY+MlslIhEQOicmLCwnJzoQEREQOicnLCwmJzoQEUwFBhkRCQ8G2yVbMj42NlEYFxcYUTY2Pj02NlEYFyAb7ywnJzoQEREQOicnLCwmJzoQEREQOicmLAAAAAIAAP/AA4ADwAAdADoAACUyNz4BNzY1NCcuAScmIzEiBw4BBwYVFBceARcWMxM2Mh8BFhQHAQ4BIyImJzEnLgE1NDY3MTc2Mh8BAgBQRUZpHh4eHmlGRVBQRUZpHh4eHmlGRVDgDCMMBA0N/sAGDwkJDwXCBgcHBgQMIwygQB4eaUZFUFBFRmkeHh4eaUZFUFBFRmkeHgIeDQ0FDCUM/rAGBwcGywYQCQkQBgQNDagAAwAA/8ADgAPAABUAXgB9AAABNDYzMhYVMRUzMhYVFAYjMSMiJjUxEzE4ATEiJy4BJyY1NDY3Jy4BNTQ2PwE+ATMyFh8BBz4BMzIwOQE4ATMyFhc3PgEzMhYfAR4BFRQGDwEnHgEVFAcOAQcGIzgBMTUyNz4BNzY1NCcuAScmIzEiBw4BBwYVFBceARcWMzEBqxkREhmrERkZEdYRGVVQRkVpHh4fHB0GBgYGPAYQCQkPBh0CLWg4AQE3ZSsaBg8JCQ8GPAYHBwYYAR4hHh5pRUZQPjY3URcYGBdRNzY+PjY3URcYGBdRNzY+ApUSGRkS1RkSERkZEf6rHh5pRkVQOWgrHQYQCAkQBjwGBgYGHQEdHx4aGgYGBgY8BhAJCQ8GGAEtazpQRUZpHh5VGBdRNzY+PjY3URcYGBdRNzY+PjY3URcYAAAAAAIAAP/AA4ADwAAnAEMAAAEHDgEVFBYzMjY3MTcRFBYzMjY1MREXHgEzMjY1NCYvAS4BIyIGBzEBFBYzMSEyNjUxNTQmIyIGFTEVITU0JiMiBhUxAeK6BgYZEggPBnEZEhIZcQYQCREZBwa6Bg8JCQ8G/p4ZEgKqEhkZEhEZ/aoZERIZAzO6BQ8JEhkHBXH+ZxEZGREBmXEGBxkSCQ8GuwUHBwX9NxIZGRKqEhkZEoCAEhkZEgAAAAACAAD/wAOAA8AAHQA3AAABMjc+ATc2NTQnLgEnJiMxIgcOAQcGFRQXHgEXFjMVIgcOAQcGMRUUFjMxITI2NTE1MCcuAScmIwIALCcnOhEQEBE6JycsLCcnOhEQEBE6JycscEpKWBISGRICqhIZEhJYSkpwAZURETonJi0sJyc5ERERETknJywtJic6ERFVGxpAGxsqEhkZEiobG0AaGwAAAwAA/8ADewPAAAsAGwApAAABJiIHAQYWMyEyNicBNDYzMhYVMRUUBiMiJjUxFxQGIyImNTE0NjMyFhUCKQ04Df6uDBsaAqQaGwz+WhkSEhkZEhIZVhkSEhkZEhIZAv0YGP2CFikpFgHBEhkZEtUSGRkSqxIZGRISGRkSAAEAAP/AAyEDwAAPAAABPgEzMhYXMRMWBiMhIiY3Ad4GEgoKEgb/ERcc/gIcFxEChAgJCQj+sBYzMxYAAAEAAP/AAyEDwAAPAAAlHgEzMjY3MRM2JiMhIgYXAd4GEgoKEgb/ERcc/gIcFxH8CAkJCAFQFjMzFgAAAAEAAP/AAtUDwAAPAAABDgEVFBYXMQUWNjURNCYHATwICQkIAVAWMzMWAeIGEgoKEgb/ERccAf4cFxEAAAEAAP/AAtUDwAAPAAABPgE1NCYnMSUmBhURFBY3AsQICQkI/rAWMzMWAZ4GEgoKEgb/ERcc/gIcFxEAAAEAAAAAAADz4kWdXw889QALBAAAAAAA4x5GFAAAAADjHkYUAAD/wAOAA8AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAA4AAAQAAAAAAAAAAAAAAAAAAABwEAAAAAAAAAAAAAAACAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAAAAAAAAAKABQAHgB8ANIBcAIaAl4CvgMYA1ADrgQSBKoFBAVuBeoGUAaoB0wHqAf4CDYIVAhyCJAIrgAAAAEAAAAcAIMACQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAHAAAAAQAAAAAAAgAHAGAAAQAAAAAAAwAHADYAAQAAAAAABAAHAHUAAQAAAAAABQALABUAAQAAAAAABgAHAEsAAQAAAAAACgAaAIoAAwABBAkAAQAOAAcAAwABBAkAAgAOAGcAAwABBAkAAwAOAD0AAwABBAkABAAOAHwAAwABBAkABQAWACAAAwABBAkABgAOAFIAAwABBAkACgA0AKRpY29tb29uAGkAYwBvAG0AbwBvAG5WZXJzaW9uIDEuMABWAGUAcgBzAGkAbwBuACAAMQAuADBpY29tb29uAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG5SZWd1bGFyAFIAZQBnAHUAbABhAHJpY29tb29uAGkAYwBvAG0AbwBvAG5Gb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA") format("woff");
}
/* -------------------------------
 *  easing
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-easing-linear: linear;
  --su-easing-ease: ease;
  --su-easing-ease-in: ease-in;
  --su-easing-ease-out: ease-out;
  --su-easing-ease-inout: ease-in-out;
  --su-easing-ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
  --su-easing-ease-out-sine: cubic-bezier(0.39, 0.58, 0.57, 1);
  --su-easing-ease-inout-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
  --su-easing-ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  --su-easing-ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --su-easing-ease-inout-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  --su-easing-ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  --su-easing-ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
  --su-easing-ease-inout-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
  --su-easing-ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
  --su-easing-ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
  --su-easing-ease-inout-quart: cubic-bezier(0.77, 0, 0.175, 1);
  --su-easing-ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
  --su-easing-ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
  --su-easing-ease-inout-quint: cubic-bezier(0.86, 0, 0.07, 1);
  --su-easing-ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
  --su-easing-ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
  --su-easing-ease-inout-expo: cubic-bezier(1, 0, 0, 1);
  --su-easing-ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
  --su-easing-ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
  --su-easing-ease-inout-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  --su-easing-ease-in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045);
  --su-easing-ease-out-back: cubic-bezier(0.18, 0.89, 0.32, 1.28);
  --su-easing-ease-inout-back: cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

/* -------------------------------
 *  screen size & breakpoint
 * ---------------------------- */
/* -------------------------------
 *  media query mixin
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-screen-desktop-l: 1440;
  --su-screen-desktop-m: 1280;
  --su-screen-desktop-s: 992;
  --su-screen-mobile-l: 768;
  --su-screen-mobile-m: 576;
  --su-screen-mobile-s: 400;
}

/* -------------------------------
 *  hover mixin
 * ---------------------------- */
/* -------------------------------
 *  transition function
 * ---------------------------- */
/* -------------------------------
 *  keyframes
 * ---------------------------- */
@-webkit-keyframes loop-flashing {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes loop-flashing {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes loop-rotation {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes loop-rotation {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
/* -------------------------------
 *  startify-ui
 *  file import (Layout)
 * ---------------------------- */
/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  base layout
 * ---------------------------- */
.su-layout {
  height: auto;
  min-height: 100dvh;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto minmax(0, 1fr) auto;
  -ms-grid-columns: 100%;
      grid-template: "header" auto "main" minmax(0, 1fr) "footer" auto/100%;
}

.su-header {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: header;
}

.su-footer {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  grid-area: footer;
}

.su-main {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: main;
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-container-gutter-size: var(--su-size-2l);
}
@media (width <= 768px) {
  :root {
    --su-container-gutter-size: var(--su-size-r);
  }
}
@media (width <= 576px) {
  :root {
    --su-container-gutter-size: var(--su-size-s);
  }
}

/* -------------------------------
 *  gird system
 * ---------------------------- */
.su-container,
.su-container-l,
.su-container-s,
.su-container-full {
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--su-container-gutter-size);
}
@media (width <= 992px) {
  .su-container,
  .su-container-l,
  .su-container-s,
  .su-container-full {
    max-width: 100%;
  }
}
@media (width <= 768px) {
  .su-container,
  .su-container-l,
  .su-container-s,
  .su-container-full {
    max-width: 100%;
  }
}
@media (width <= 576px) {
  .su-container,
  .su-container-l,
  .su-container-s,
  .su-container-full {
    max-width: 100%;
  }
}
@media (width <= 400px) {
  .su-container,
  .su-container-l,
  .su-container-s,
  .su-container-full {
    max-width: 100%;
  }
}

.su-container {
  max-width: calc(var(--su-screen-desktop-m) * 1px);
}
@media (width <= 1440px) {
  .su-container {
    max-width: calc(var(--su-screen-desktop-m) * 1px);
  }
}
@media (width <= 1280px) {
  .su-container {
    max-width: calc(var(--su-screen-desktop-s) * 1px);
  }
}
.su-container-l {
  max-width: calc(var(--su-screen-desktop-l) * 1px);
}
@media (width <= 1440px) {
  .su-container-l {
    max-width: calc(var(--su-screen-desktop-m) * 1px);
  }
}
@media (width <= 1280px) {
  .su-container-l {
    max-width: calc(var(--su-screen-desktop-s) * 1px);
  }
}
.su-container-s {
  max-width: calc(var(--su-screen-desktop-s) * 1px);
}
@media (width <= 1440px) {
  .su-container-s {
    max-width: calc(var(--su-screen-desktop-s) * 1px);
  }
}
@media (width <= 1280px) {
  .su-container-s {
    max-width: calc(var(--su-screen-desktop-s) * 1px);
  }
}
.su-container-full {
  max-width: 100%;
}
@media (width <= 1440px) {
  .su-container-full {
    max-width: 100%;
  }
}
@media (width <= 1280px) {
  .su-container-full {
    max-width: 100%;
  }
}

.su-row {
  display: -ms-grid;
  display: grid;
}
.su-row.su-row-col-evenly-1 {
  -ms-grid-columns: (minmax(0, 1fr))[1];
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-1--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[1];
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-1--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[1];
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-2 {
  -ms-grid-columns: (minmax(0, 1fr))[2];
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-2--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[2];
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-2--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[2];
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-3 {
  -ms-grid-columns: (minmax(0, 1fr))[3];
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-3--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[3];
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-3--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[3];
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-4 {
  -ms-grid-columns: (minmax(0, 1fr))[4];
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-4--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[4];
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-4--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[4];
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-5 {
  -ms-grid-columns: (minmax(0, 1fr))[5];
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-5--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[5];
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-5--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[5];
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-6 {
  -ms-grid-columns: (minmax(0, 1fr))[6];
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-6--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[6];
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-6--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[6];
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-8 {
  -ms-grid-columns: (minmax(0, 1fr))[8];
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-8--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[8];
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-8--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[8];
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-10 {
  -ms-grid-columns: (minmax(0, 1fr))[10];
  grid-template-columns: repeat(10, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-10--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[10];
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-10--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[10];
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
}
.su-row.su-row-col-evenly-12 {
  -ms-grid-columns: (minmax(0, 1fr))[12];
  grid-template-columns: repeat(12, minmax(0, 1fr));
}
@media (width <= 768px) {
  .su-row.su-row-col-evenly-12--mobile {
    -ms-grid-columns: (minmax(0, 1fr))[12];
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-evenly-12--desktop {
    -ms-grid-columns: (minmax(0, 1fr))[12];
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (width <= 768px) {
  .su-row.su-row-col-sidebar-l {
    -ms-grid-columns: (minmax(0, 1fr))[1];
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-sidebar-l {
    -ms-grid-columns: minmax(0, 1fr) 3fr;
    grid-template-columns: minmax(0, 1fr) 3fr;
  }
}
@media (width <= 768px) {
  .su-row.su-row-col-sidebar-r {
    -ms-grid-columns: (minmax(0, 1fr))[1];
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media (calc(768px + 1px) <= width) {
  .su-row.su-row-col-sidebar-r {
    -ms-grid-columns: 3fr minmax(0, 1fr);
    grid-template-columns: 3fr minmax(0, 1fr);
  }
}
.su-row.su-row-col-units {
  -ms-grid-columns: (minmax(0, 1fr))[12];
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

/* -------------------------------
 *  column units
 * ---------------------------- */
.su-column {
  min-width: 0;
}
.su-column.su-column-unit-1 {
  grid-column: auto/span 1;
}
@media (width <= 768px) {
  .su-column.su-column-unit-1--mobile {
    grid-column: auto/span 1;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-1--desktop {
    grid-column: auto/span 1;
  }
}
.su-column.su-column-unit-2 {
  grid-column: auto/span 2;
}
@media (width <= 768px) {
  .su-column.su-column-unit-2--mobile {
    grid-column: auto/span 2;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-2--desktop {
    grid-column: auto/span 2;
  }
}
.su-column.su-column-unit-3 {
  grid-column: auto/span 3;
}
@media (width <= 768px) {
  .su-column.su-column-unit-3--mobile {
    grid-column: auto/span 3;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-3--desktop {
    grid-column: auto/span 3;
  }
}
.su-column.su-column-unit-4 {
  grid-column: auto/span 4;
}
@media (width <= 768px) {
  .su-column.su-column-unit-4--mobile {
    grid-column: auto/span 4;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-4--desktop {
    grid-column: auto/span 4;
  }
}
.su-column.su-column-unit-5 {
  grid-column: auto/span 5;
}
@media (width <= 768px) {
  .su-column.su-column-unit-5--mobile {
    grid-column: auto/span 5;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-5--desktop {
    grid-column: auto/span 5;
  }
}
.su-column.su-column-unit-6 {
  grid-column: auto/span 6;
}
@media (width <= 768px) {
  .su-column.su-column-unit-6--mobile {
    grid-column: auto/span 6;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-6--desktop {
    grid-column: auto/span 6;
  }
}
.su-column.su-column-unit-7 {
  grid-column: auto/span 7;
}
@media (width <= 768px) {
  .su-column.su-column-unit-7--mobile {
    grid-column: auto/span 7;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-7--desktop {
    grid-column: auto/span 7;
  }
}
.su-column.su-column-unit-8 {
  grid-column: auto/span 8;
}
@media (width <= 768px) {
  .su-column.su-column-unit-8--mobile {
    grid-column: auto/span 8;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-8--desktop {
    grid-column: auto/span 8;
  }
}
.su-column.su-column-unit-9 {
  grid-column: auto/span 9;
}
@media (width <= 768px) {
  .su-column.su-column-unit-9--mobile {
    grid-column: auto/span 9;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-9--desktop {
    grid-column: auto/span 9;
  }
}
.su-column.su-column-unit-10 {
  grid-column: auto/span 10;
}
@media (width <= 768px) {
  .su-column.su-column-unit-10--mobile {
    grid-column: auto/span 10;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-10--desktop {
    grid-column: auto/span 10;
  }
}
.su-column.su-column-unit-11 {
  grid-column: auto/span 11;
}
@media (width <= 768px) {
  .su-column.su-column-unit-11--mobile {
    grid-column: auto/span 11;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-11--desktop {
    grid-column: auto/span 11;
  }
}
.su-column.su-column-unit-12 {
  grid-column: auto/span 12;
}
@media (width <= 768px) {
  .su-column.su-column-unit-12--mobile {
    grid-column: auto/span 12;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column.su-column-unit-12--desktop {
    grid-column: auto/span 12;
  }
}

/* -------------------------------
 *  column order
 * ---------------------------- */
.su-column-order-1 {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
@media (width <= 768px) {
  .su-column-order-1--mobile {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-1--desktop {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
.su-column-order-2 {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
@media (width <= 768px) {
  .su-column-order-2--mobile {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-2--desktop {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
.su-column-order-3 {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
@media (width <= 768px) {
  .su-column-order-3--mobile {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-3--desktop {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
}
.su-column-order-4 {
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
}
@media (width <= 768px) {
  .su-column-order-4--mobile {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-4--desktop {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
}
.su-column-order-5 {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5;
}
@media (width <= 768px) {
  .su-column-order-5--mobile {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-5--desktop {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
}
.su-column-order-6 {
  -webkit-box-ordinal-group: 7;
      -ms-flex-order: 6;
          order: 6;
}
@media (width <= 768px) {
  .su-column-order-6--mobile {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-6--desktop {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
}
.su-column-order-7 {
  -webkit-box-ordinal-group: 8;
      -ms-flex-order: 7;
          order: 7;
}
@media (width <= 768px) {
  .su-column-order-7--mobile {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-7--desktop {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
}
.su-column-order-8 {
  -webkit-box-ordinal-group: 9;
      -ms-flex-order: 8;
          order: 8;
}
@media (width <= 768px) {
  .su-column-order-8--mobile {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-8--desktop {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
}
.su-column-order-9 {
  -webkit-box-ordinal-group: 10;
      -ms-flex-order: 9;
          order: 9;
}
@media (width <= 768px) {
  .su-column-order-9--mobile {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-9--desktop {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
}
.su-column-order-10 {
  -webkit-box-ordinal-group: 11;
      -ms-flex-order: 10;
          order: 10;
}
@media (width <= 768px) {
  .su-column-order-10--mobile {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-10--desktop {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
}
.su-column-order-11 {
  -webkit-box-ordinal-group: 12;
      -ms-flex-order: 11;
          order: 11;
}
@media (width <= 768px) {
  .su-column-order-11--mobile {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-11--desktop {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
}
.su-column-order-12 {
  -webkit-box-ordinal-group: 13;
      -ms-flex-order: 12;
          order: 12;
}
@media (width <= 768px) {
  .su-column-order-12--mobile {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-column-order-12--desktop {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
}

/* -------------------------------
 *  startify-ui
 *  file import (Object_Component)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-accordion: var(--su-gray-color__mono--4);
  --su-size-radius-accordion: var(--su-size-5s);
  --su-color-bg-detail-accordion: var(--su-gray-color__mono--0);
}

/* -------------------------------
 *  accordion
 * ---------------------------- */
.su-accordion {
  border: 1px solid var(--su-color-border-accordion);
  border-radius: var(--su-size-radius-accordion);
  overflow: hidden;
}
.su-accordion-summary {
  font-weight: bold;
  display: block;
  padding-block: 1em;
  padding-inline: 1em;
}
.su-accordion-summary::-webkit-details-marker {
  display: none;
}
.su-accordion-detail {
  padding: 1em;
  background: var(--su-color-bg-detail-accordion);
}
.su-accordion.su-accordion-add-icon-left summary, .su-accordion.su-accordion-add-icon-right summary {
  position: relative;
  padding-block: 1em;
}
.su-accordion.su-accordion-add-icon-left summary::before, .su-accordion.su-accordion-add-icon-right summary::before {
  content: "\e915";
  position: absolute;
  font-family: "startify-ui icons";
  top: 1em;
}
.su-accordion.su-accordion-add-icon-left summary {
  padding-inline: 2.5em 1em;
}
.su-accordion.su-accordion-add-icon-left summary::before {
  left: 1em;
}
.su-accordion.su-accordion-add-icon-right summary {
  padding-inline: 1em 2.5em;
}
.su-accordion.su-accordion-add-icon-right summary::before {
  right: 1em;
}
.su-accordion[open].su-accordion-add-icon-left summary::before, .su-accordion[open].su-accordion-add-icon-right summary::before {
  content: "\e914";
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-bg-alert: var(--su-palette-color__violet--0);
  --su-color-border-alert: var(--su-palette-color__violet--4);
  --su-color-text-alert: var(--su-palette-color__violet--8);
  --su-color-icon-alert: var(--su-palette-color__violet--4);
  --su-color-close-alert: var(--su-palette-color__violet--2);
}

/* -------------------------------
 *  alert
 * ---------------------------- */
.su-alert,
.su-alert-error,
.su-alert-warning,
.su-alert-success,
.su-alert-info,
.su-alert-negative {
  width: 100%;
  padding: 1em;
  border-radius: var(--su-size-5s);
  border: 1px solid;
}
.su-alert.su-alert-add-icon,
.su-alert-error.su-alert-add-icon,
.su-alert-warning.su-alert-add-icon,
.su-alert-success.su-alert-add-icon,
.su-alert-info.su-alert-add-icon,
.su-alert-negative.su-alert-add-icon {
  padding-left: calc(1.5em + 1lh);
  position: relative;
  vertical-align: middle;
}
.su-alert.su-alert-add-icon::before,
.su-alert-error.su-alert-add-icon::before,
.su-alert-warning.su-alert-add-icon::before,
.su-alert-success.su-alert-add-icon::before,
.su-alert-info.su-alert-add-icon::before,
.su-alert-negative.su-alert-add-icon::before {
  width: 1lh;
  height: 1lh;
  position: absolute;
  left: 1rem;
  top: 1rem;
  font-family: "startify-ui icons";
  line-height: 1;
  font-size: 1.8em;
}
.su-alert.su-alert-add-close,
.su-alert-error.su-alert-add-close,
.su-alert-warning.su-alert-add-close,
.su-alert-success.su-alert-add-close,
.su-alert-info.su-alert-add-close,
.su-alert-negative.su-alert-add-close {
  padding-right: calc(1.5em + 1lh);
  position: relative;
}
.su-alert.su-alert-add-close .su-alert-close,
.su-alert-error.su-alert-add-close .su-alert-close,
.su-alert-warning.su-alert-add-close .su-alert-close,
.su-alert-success.su-alert-add-close .su-alert-close,
.su-alert-info.su-alert-add-close .su-alert-close,
.su-alert-negative.su-alert-add-close .su-alert-close {
  width: 1lh;
  height: 1lh;
  position: absolute;
  right: 1em;
  top: 1em;
  color: transparent;
  display: inline-block;
  border-radius: 100%;
}
.su-alert.su-alert-add-close .su-alert-close::before, .su-alert.su-alert-add-close .su-alert-close::after,
.su-alert-error.su-alert-add-close .su-alert-close::before,
.su-alert-error.su-alert-add-close .su-alert-close::after,
.su-alert-warning.su-alert-add-close .su-alert-close::before,
.su-alert-warning.su-alert-add-close .su-alert-close::after,
.su-alert-success.su-alert-add-close .su-alert-close::before,
.su-alert-success.su-alert-add-close .su-alert-close::after,
.su-alert-info.su-alert-add-close .su-alert-close::before,
.su-alert-info.su-alert-add-close .su-alert-close::after,
.su-alert-negative.su-alert-add-close .su-alert-close::before,
.su-alert-negative.su-alert-add-close .su-alert-close::after {
  content: "";
  position: absolute;
  width: 1em;
  height: 2px;
  border-radius: 1px;
  left: calc(50% - 0.5em);
  top: calc(50% - 1px);
}
.su-alert.su-alert-add-close .su-alert-close::before,
.su-alert-error.su-alert-add-close .su-alert-close::before,
.su-alert-warning.su-alert-add-close .su-alert-close::before,
.su-alert-success.su-alert-add-close .su-alert-close::before,
.su-alert-info.su-alert-add-close .su-alert-close::before,
.su-alert-negative.su-alert-add-close .su-alert-close::before {
  rotate: 45deg;
}
.su-alert.su-alert-add-close .su-alert-close::after,
.su-alert-error.su-alert-add-close .su-alert-close::after,
.su-alert-warning.su-alert-add-close .su-alert-close::after,
.su-alert-success.su-alert-add-close .su-alert-close::after,
.su-alert-info.su-alert-add-close .su-alert-close::after,
.su-alert-negative.su-alert-add-close .su-alert-close::after {
  rotate: -45deg;
}

.su-alert {
  background: var(--su-color-bg-alert);
  border-color: var(--su-color-border-alert);
  color: var(--su-color-text-alert);
}
.su-alert.su-alert-add-icon::before {
  content: "\e912";
  color: var(--su-color-icon-alert);
}
.su-alert.su-alert-add-close .su-alert-close::before, .su-alert.su-alert-add-close .su-alert-close::after {
  background: var(--su-color-close-alert);
}
.su-alert-error {
  background: var(--su-status-color__error--0);
  border-color: var(--su-status-color__error--4);
  color: var(--su-status-color__error--8);
}
.su-alert-error.su-alert-add-icon::before {
  content: "\e908";
  color: var(--su-status-color__error--4);
}
.su-alert-error.su-alert-add-close .su-alert-close::before, .su-alert-error.su-alert-add-close .su-alert-close::after {
  background: var(--su-status-color__error--2);
}
.su-alert-warning {
  background: var(--su-status-color__warning--0);
  border-color: var(--su-status-color__warning--4);
  color: var(--su-status-color__warning--8);
}
.su-alert-warning.su-alert-add-icon::before {
  content: "\e913";
  color: var(--su-status-color__warning--4);
}
.su-alert-warning.su-alert-add-close .su-alert-close::before, .su-alert-warning.su-alert-add-close .su-alert-close::after {
  background: var(--su-status-color__warning--4);
}
.su-alert-success {
  background: var(--su-status-color__success--0);
  border-color: var(--su-status-color__success--4);
  color: var(--su-status-color__success--8);
}
.su-alert-success.su-alert-add-icon::before {
  content: "\e90f";
  color: var(--su-status-color__success--4);
}
.su-alert-success.su-alert-add-close .su-alert-close::before, .su-alert-success.su-alert-add-close .su-alert-close::after {
  background: var(--su-status-color__success--3);
}
.su-alert-info {
  background: var(--su-status-color__info--0);
  border-color: var(--su-status-color__info--4);
  color: var(--su-status-color__info--8);
}
.su-alert-info.su-alert-add-icon::before {
  content: "\e90f";
  color: var(--su-status-color__info--4);
}
.su-alert-info.su-alert-add-close .su-alert-close::before, .su-alert-info.su-alert-add-close .su-alert-close::after {
  background: var(--su-status-color__info--3);
}
.su-alert-negative {
  background: var(--su-status-color__negative--0);
  border-color: var(--su-status-color__negative--4);
  color: var(--su-status-color__negative--8);
}
.su-alert-negative.su-alert-add-icon::before {
  content: "\e902";
  color: var(--su-status-color__negative--4);
}
.su-alert-negative.su-alert-add-close .su-alert-close::before, .su-alert-negative.su-alert-add-close .su-alert-close::after {
  background: var(--su-status-color__negative--3);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  breadcrumb list
 * ---------------------------- */
.su-breadcrumb,
.su-breadcrumb-arrow,
.su-breadcrumb-slash {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  row-gap: 0.5em;
}
.su-breadcrumb > *:not(:first-child),
.su-breadcrumb-arrow > *:not(:first-child),
.su-breadcrumb-slash > *:not(:first-child) {
  padding-left: 1.5em;
  position: relative;
}
.su-breadcrumb > *:not(:first-child)::before,
.su-breadcrumb-arrow > *:not(:first-child)::before,
.su-breadcrumb-slash > *:not(:first-child)::before {
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 0.5em);
  line-height: 1;
}

.su-breadcrumb > *:not(:first-child)::before,
.su-breadcrumb-arrow > *:not(:first-child)::before {
  content: ">";
}

.su-breadcrumb-slash > *:not(:first-child)::before {
  content: "/";
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-fill-button-primary: var(--su-palette-color__pink-red--4);
  --su-color-label-button-primary: var(--su-color-white);
  --su-color-fill-button-primary-hover: var(--su-palette-color__pink-red--2);
  --su-color-label-button-primary-hover: var(--su-color-white);
  --su-color-fill-button-primary-active: var(--su-palette-color__pink-red--6);
  --su-color-label-button-primary-active: var(--su-color-white);
  --su-color-ring-button-primary-focus: var(--su-palette-color__pink-red--3);
  --su-color-outline-button-secondary: var(--su-palette-color__teal--4);
  --su-color-label-button-secondary: var(--su-palette-color__teal--5);
  --su-color-outline-button-secondary-hover: var(--su-palette-color__teal--2);
  --su-color-label-button-secondary-hover: var(--su-palette-color__teal--2);
  --su-color-outline-button-secondary-active: var(--su-palette-color__teal--6);
  --su-color-label-button-secondary-active: var(--su-palette-color__teal--7);
  --su-color-ring-button-secondary-focus: var(--su-palette-color__teal--3);
  --su-size-text-button: var(--su-size-r);
}

/* -------------------------------
 *  button default style
 * ---------------------------- */
.su-button-primary,
.su-button-fill,
.su-button-fill-red,
.su-button-fill-orange,
.su-button-fill-orange-yellow,
.su-button-fill-yellow,
.su-button-fill-yellow-green,
.su-button-fill-green,
.su-button-fill-teal,
.su-button-fill-cyan,
.su-button-fill-light-blue,
.su-button-fill-blue,
.su-button-fill-blue-violet,
.su-button-fill-violet,
.su-button-fill-purple,
.su-button-fill-magenta,
.su-button-fill-pink,
.su-button-fill-pink-red,
.su-button-secondary,
.su-button-outline,
.su-button-outline-red,
.su-button-outline-orange,
.su-button-outline-orange-yellow,
.su-button-outline-yellow,
.su-button-outline-yellow-green,
.su-button-outline-green,
.su-button-outline-teal,
.su-button-outline-cyan,
.su-button-outline-light-blue,
.su-button-outline-blue,
.su-button-outline-blue-violet,
.su-button-outline-violet,
.su-button-outline-purple,
.su-button-outline-magenta,
.su-button-outline-pink,
.su-button-outline-pink-red {
  display: inline-block;
  width: auto;
  border-radius: var(--su-size-r);
  font-weight: bold;
  font-size: var(--su-size-text-button);
  outline-offset: 4px;
  line-height: 1.2;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.su-button-primary.su-button-size-small,
.su-button-fill.su-button-size-small,
.su-button-fill-red.su-button-size-small,
.su-button-fill-orange.su-button-size-small,
.su-button-fill-orange-yellow.su-button-size-small,
.su-button-fill-yellow.su-button-size-small,
.su-button-fill-yellow-green.su-button-size-small,
.su-button-fill-green.su-button-size-small,
.su-button-fill-teal.su-button-size-small,
.su-button-fill-cyan.su-button-size-small,
.su-button-fill-light-blue.su-button-size-small,
.su-button-fill-blue.su-button-size-small,
.su-button-fill-blue-violet.su-button-size-small,
.su-button-fill-violet.su-button-size-small,
.su-button-fill-purple.su-button-size-small,
.su-button-fill-magenta.su-button-size-small,
.su-button-fill-pink.su-button-size-small,
.su-button-fill-pink-red.su-button-size-small,
.su-button-secondary.su-button-size-small,
.su-button-outline.su-button-size-small,
.su-button-outline-red.su-button-size-small,
.su-button-outline-orange.su-button-size-small,
.su-button-outline-orange-yellow.su-button-size-small,
.su-button-outline-yellow.su-button-size-small,
.su-button-outline-yellow-green.su-button-size-small,
.su-button-outline-green.su-button-size-small,
.su-button-outline-teal.su-button-size-small,
.su-button-outline-cyan.su-button-size-small,
.su-button-outline-light-blue.su-button-size-small,
.su-button-outline-blue.su-button-size-small,
.su-button-outline-blue-violet.su-button-size-small,
.su-button-outline-violet.su-button-size-small,
.su-button-outline-purple.su-button-size-small,
.su-button-outline-magenta.su-button-size-small,
.su-button-outline-pink.su-button-size-small,
.su-button-outline-pink-red.su-button-size-small {
  border-radius: var(--su-size-3s);
  font-size: 0.75em;
}
.su-button-primary.su-button-size-large,
.su-button-fill.su-button-size-large,
.su-button-fill-red.su-button-size-large,
.su-button-fill-orange.su-button-size-large,
.su-button-fill-orange-yellow.su-button-size-large,
.su-button-fill-yellow.su-button-size-large,
.su-button-fill-yellow-green.su-button-size-large,
.su-button-fill-green.su-button-size-large,
.su-button-fill-teal.su-button-size-large,
.su-button-fill-cyan.su-button-size-large,
.su-button-fill-light-blue.su-button-size-large,
.su-button-fill-blue.su-button-size-large,
.su-button-fill-blue-violet.su-button-size-large,
.su-button-fill-violet.su-button-size-large,
.su-button-fill-purple.su-button-size-large,
.su-button-fill-magenta.su-button-size-large,
.su-button-fill-pink.su-button-size-large,
.su-button-fill-pink-red.su-button-size-large,
.su-button-secondary.su-button-size-large,
.su-button-outline.su-button-size-large,
.su-button-outline-red.su-button-size-large,
.su-button-outline-orange.su-button-size-large,
.su-button-outline-orange-yellow.su-button-size-large,
.su-button-outline-yellow.su-button-size-large,
.su-button-outline-yellow-green.su-button-size-large,
.su-button-outline-green.su-button-size-large,
.su-button-outline-teal.su-button-size-large,
.su-button-outline-cyan.su-button-size-large,
.su-button-outline-light-blue.su-button-size-large,
.su-button-outline-blue.su-button-size-large,
.su-button-outline-blue-violet.su-button-size-large,
.su-button-outline-violet.su-button-size-large,
.su-button-outline-purple.su-button-size-large,
.su-button-outline-magenta.su-button-size-large,
.su-button-outline-pink.su-button-size-large,
.su-button-outline-pink-red.su-button-size-large {
  font-size: 1.25em;
  border-radius: var(--su-size-l);
}
.su-button-primary.su-button-display-block,
.su-button-fill.su-button-display-block,
.su-button-fill-red.su-button-display-block,
.su-button-fill-orange.su-button-display-block,
.su-button-fill-orange-yellow.su-button-display-block,
.su-button-fill-yellow.su-button-display-block,
.su-button-fill-yellow-green.su-button-display-block,
.su-button-fill-green.su-button-display-block,
.su-button-fill-teal.su-button-display-block,
.su-button-fill-cyan.su-button-display-block,
.su-button-fill-light-blue.su-button-display-block,
.su-button-fill-blue.su-button-display-block,
.su-button-fill-blue-violet.su-button-display-block,
.su-button-fill-violet.su-button-display-block,
.su-button-fill-purple.su-button-display-block,
.su-button-fill-magenta.su-button-display-block,
.su-button-fill-pink.su-button-display-block,
.su-button-fill-pink-red.su-button-display-block,
.su-button-secondary.su-button-display-block,
.su-button-outline.su-button-display-block,
.su-button-outline-red.su-button-display-block,
.su-button-outline-orange.su-button-display-block,
.su-button-outline-orange-yellow.su-button-display-block,
.su-button-outline-yellow.su-button-display-block,
.su-button-outline-yellow-green.su-button-display-block,
.su-button-outline-green.su-button-display-block,
.su-button-outline-teal.su-button-display-block,
.su-button-outline-cyan.su-button-display-block,
.su-button-outline-light-blue.su-button-display-block,
.su-button-outline-blue.su-button-display-block,
.su-button-outline-blue-violet.su-button-display-block,
.su-button-outline-violet.su-button-display-block,
.su-button-outline-purple.su-button-display-block,
.su-button-outline-magenta.su-button-display-block,
.su-button-outline-pink.su-button-display-block,
.su-button-outline-pink-red.su-button-display-block {
  display: block;
  width: 100%;
  text-align: center;
}
.su-button-primary.su-button-shape-square,
.su-button-fill.su-button-shape-square,
.su-button-fill-red.su-button-shape-square,
.su-button-fill-orange.su-button-shape-square,
.su-button-fill-orange-yellow.su-button-shape-square,
.su-button-fill-yellow.su-button-shape-square,
.su-button-fill-yellow-green.su-button-shape-square,
.su-button-fill-green.su-button-shape-square,
.su-button-fill-teal.su-button-shape-square,
.su-button-fill-cyan.su-button-shape-square,
.su-button-fill-light-blue.su-button-shape-square,
.su-button-fill-blue.su-button-shape-square,
.su-button-fill-blue-violet.su-button-shape-square,
.su-button-fill-violet.su-button-shape-square,
.su-button-fill-purple.su-button-shape-square,
.su-button-fill-magenta.su-button-shape-square,
.su-button-fill-pink.su-button-shape-square,
.su-button-fill-pink-red.su-button-shape-square,
.su-button-secondary.su-button-shape-square,
.su-button-outline.su-button-shape-square,
.su-button-outline-red.su-button-shape-square,
.su-button-outline-orange.su-button-shape-square,
.su-button-outline-orange-yellow.su-button-shape-square,
.su-button-outline-yellow.su-button-shape-square,
.su-button-outline-yellow-green.su-button-shape-square,
.su-button-outline-green.su-button-shape-square,
.su-button-outline-teal.su-button-shape-square,
.su-button-outline-cyan.su-button-shape-square,
.su-button-outline-light-blue.su-button-shape-square,
.su-button-outline-blue.su-button-shape-square,
.su-button-outline-blue-violet.su-button-shape-square,
.su-button-outline-violet.su-button-shape-square,
.su-button-outline-purple.su-button-shape-square,
.su-button-outline-magenta.su-button-shape-square,
.su-button-outline-pink.su-button-shape-square,
.su-button-outline-pink-red.su-button-shape-square {
  border-radius: 0;
}
.su-button-primary.su-button-shape-pill,
.su-button-fill.su-button-shape-pill,
.su-button-fill-red.su-button-shape-pill,
.su-button-fill-orange.su-button-shape-pill,
.su-button-fill-orange-yellow.su-button-shape-pill,
.su-button-fill-yellow.su-button-shape-pill,
.su-button-fill-yellow-green.su-button-shape-pill,
.su-button-fill-green.su-button-shape-pill,
.su-button-fill-teal.su-button-shape-pill,
.su-button-fill-cyan.su-button-shape-pill,
.su-button-fill-light-blue.su-button-shape-pill,
.su-button-fill-blue.su-button-shape-pill,
.su-button-fill-blue-violet.su-button-shape-pill,
.su-button-fill-violet.su-button-shape-pill,
.su-button-fill-purple.su-button-shape-pill,
.su-button-fill-magenta.su-button-shape-pill,
.su-button-fill-pink.su-button-shape-pill,
.su-button-fill-pink-red.su-button-shape-pill,
.su-button-secondary.su-button-shape-pill,
.su-button-outline.su-button-shape-pill,
.su-button-outline-red.su-button-shape-pill,
.su-button-outline-orange.su-button-shape-pill,
.su-button-outline-orange-yellow.su-button-shape-pill,
.su-button-outline-yellow.su-button-shape-pill,
.su-button-outline-yellow-green.su-button-shape-pill,
.su-button-outline-green.su-button-shape-pill,
.su-button-outline-teal.su-button-shape-pill,
.su-button-outline-cyan.su-button-shape-pill,
.su-button-outline-light-blue.su-button-shape-pill,
.su-button-outline-blue.su-button-shape-pill,
.su-button-outline-blue-violet.su-button-shape-pill,
.su-button-outline-violet.su-button-shape-pill,
.su-button-outline-purple.su-button-shape-pill,
.su-button-outline-magenta.su-button-shape-pill,
.su-button-outline-pink.su-button-shape-pill,
.su-button-outline-pink-red.su-button-shape-pill {
  border-radius: 99em;
}
.su-button-primary:disabled,
.su-button-fill:disabled,
.su-button-fill-red:disabled,
.su-button-fill-orange:disabled,
.su-button-fill-orange-yellow:disabled,
.su-button-fill-yellow:disabled,
.su-button-fill-yellow-green:disabled,
.su-button-fill-green:disabled,
.su-button-fill-teal:disabled,
.su-button-fill-cyan:disabled,
.su-button-fill-light-blue:disabled,
.su-button-fill-blue:disabled,
.su-button-fill-blue-violet:disabled,
.su-button-fill-violet:disabled,
.su-button-fill-purple:disabled,
.su-button-fill-magenta:disabled,
.su-button-fill-pink:disabled,
.su-button-fill-pink-red:disabled,
.su-button-secondary:disabled,
.su-button-outline:disabled,
.su-button-outline-red:disabled,
.su-button-outline-orange:disabled,
.su-button-outline-orange-yellow:disabled,
.su-button-outline-yellow:disabled,
.su-button-outline-yellow-green:disabled,
.su-button-outline-green:disabled,
.su-button-outline-teal:disabled,
.su-button-outline-cyan:disabled,
.su-button-outline-light-blue:disabled,
.su-button-outline-blue:disabled,
.su-button-outline-blue-violet:disabled,
.su-button-outline-violet:disabled,
.su-button-outline-purple:disabled,
.su-button-outline-magenta:disabled,
.su-button-outline-pink:disabled,
.su-button-outline-pink-red:disabled {
  opacity: 0.1;
}

.su-button-primary,
.su-button-fill,
.su-button-fill-red,
.su-button-fill-orange,
.su-button-fill-orange-yellow,
.su-button-fill-yellow,
.su-button-fill-yellow-green,
.su-button-fill-green,
.su-button-fill-teal,
.su-button-fill-cyan,
.su-button-fill-light-blue,
.su-button-fill-blue,
.su-button-fill-blue-violet,
.su-button-fill-violet,
.su-button-fill-purple,
.su-button-fill-magenta,
.su-button-fill-pink,
.su-button-fill-pink-red {
  padding: 1.5em 2em;
  -webkit-transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
}
.su-button-primary.su-button-size-small,
.su-button-fill.su-button-size-small,
.su-button-fill-red.su-button-size-small,
.su-button-fill-orange.su-button-size-small,
.su-button-fill-orange-yellow.su-button-size-small,
.su-button-fill-yellow.su-button-size-small,
.su-button-fill-yellow-green.su-button-size-small,
.su-button-fill-green.su-button-size-small,
.su-button-fill-teal.su-button-size-small,
.su-button-fill-cyan.su-button-size-small,
.su-button-fill-light-blue.su-button-size-small,
.su-button-fill-blue.su-button-size-small,
.su-button-fill-blue-violet.su-button-size-small,
.su-button-fill-violet.su-button-size-small,
.su-button-fill-purple.su-button-size-small,
.su-button-fill-magenta.su-button-size-small,
.su-button-fill-pink.su-button-size-small,
.su-button-fill-pink-red.su-button-size-small {
  padding: 1em 1.5em;
}
.su-button-primary.su-button-size-large,
.su-button-fill.su-button-size-large,
.su-button-fill-red.su-button-size-large,
.su-button-fill-orange.su-button-size-large,
.su-button-fill-orange-yellow.su-button-size-large,
.su-button-fill-yellow.su-button-size-large,
.su-button-fill-yellow-green.su-button-size-large,
.su-button-fill-green.su-button-size-large,
.su-button-fill-teal.su-button-size-large,
.su-button-fill-cyan.su-button-size-large,
.su-button-fill-light-blue.su-button-size-large,
.su-button-fill-blue.su-button-size-large,
.su-button-fill-blue-violet.su-button-size-large,
.su-button-fill-violet.su-button-size-large,
.su-button-fill-purple.su-button-size-large,
.su-button-fill-magenta.su-button-size-large,
.su-button-fill-pink.su-button-size-large,
.su-button-fill-pink-red.su-button-size-large {
  padding: 1.75em 2.25em;
}

.su-button-secondary,
.su-button-outline,
.su-button-outline-red,
.su-button-outline-orange,
.su-button-outline-orange-yellow,
.su-button-outline-yellow,
.su-button-outline-yellow-green,
.su-button-outline-green,
.su-button-outline-teal,
.su-button-outline-cyan,
.su-button-outline-light-blue,
.su-button-outline-blue,
.su-button-outline-blue-violet,
.su-button-outline-violet,
.su-button-outline-purple,
.su-button-outline-magenta,
.su-button-outline-pink,
.su-button-outline-pink-red {
  border: 2px solid;
  padding: calc(1.5em - 3px) calc(2em - 3px);
  -webkit-transition: border-color 0.4s ease 0.1s, color 0.4s ease 0.1s;
  transition: border-color 0.4s ease 0.1s, color 0.4s ease 0.1s;
}
.su-button-secondary.su-button-size-small,
.su-button-outline.su-button-size-small,
.su-button-outline-red.su-button-size-small,
.su-button-outline-orange.su-button-size-small,
.su-button-outline-orange-yellow.su-button-size-small,
.su-button-outline-yellow.su-button-size-small,
.su-button-outline-yellow-green.su-button-size-small,
.su-button-outline-green.su-button-size-small,
.su-button-outline-teal.su-button-size-small,
.su-button-outline-cyan.su-button-size-small,
.su-button-outline-light-blue.su-button-size-small,
.su-button-outline-blue.su-button-size-small,
.su-button-outline-blue-violet.su-button-size-small,
.su-button-outline-violet.su-button-size-small,
.su-button-outline-purple.su-button-size-small,
.su-button-outline-magenta.su-button-size-small,
.su-button-outline-pink.su-button-size-small,
.su-button-outline-pink-red.su-button-size-small {
  padding: calc(1em - 3px) calc(1.5em - 3px);
}
.su-button-secondary.su-button-size-large,
.su-button-outline.su-button-size-large,
.su-button-outline-red.su-button-size-large,
.su-button-outline-orange.su-button-size-large,
.su-button-outline-orange-yellow.su-button-size-large,
.su-button-outline-yellow.su-button-size-large,
.su-button-outline-yellow-green.su-button-size-large,
.su-button-outline-green.su-button-size-large,
.su-button-outline-teal.su-button-size-large,
.su-button-outline-cyan.su-button-size-large,
.su-button-outline-light-blue.su-button-size-large,
.su-button-outline-blue.su-button-size-large,
.su-button-outline-blue-violet.su-button-size-large,
.su-button-outline-violet.su-button-size-large,
.su-button-outline-purple.su-button-size-large,
.su-button-outline-magenta.su-button-size-large,
.su-button-outline-pink.su-button-size-large,
.su-button-outline-pink-red.su-button-size-large {
  padding: calc(1.75em - 3px) calc(2.25em - 3px);
}

/* -------------------------------
 *  button primary & fill
 * ---------------------------- */
.su-button-primary,
.su-button-fill {
  background: var(--su-color-fill-button-primary);
  color: var(--su-color-label-button-primary);
}
@media (any-hover: hover) {
  .su-button-primary:hover,
  .su-button-fill:hover {
    background: var(--su-color-fill-button-primary-hover);
    color: var(--su-color-label-button-primary-hover);
  }
}
.su-button-primary.su-button-state-hover,
.su-button-fill.su-button-state-hover {
  background: var(--su-color-fill-button-primary-hover);
  color: var(--su-color-label-button-primary-hover);
}
.su-button-primary:active, .su-button-primary.su-button-state-active,
.su-button-fill:active,
.su-button-fill.su-button-state-active {
  background: var(--su-color-fill-button-primary-active);
  color: var(--su-color-label-button-primary-active);
}
.su-button-primary:focus-visible, .su-button-primary.su-button-state-focus,
.su-button-fill:focus-visible,
.su-button-fill.su-button-state-focus {
  outline: 2px solid var(--su-color-ring-button-primary-focus);
}
.su-button-primary.su-button-state-disabled,
.su-button-fill.su-button-state-disabled {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

.su-button-fill-red {
  background: var(--su-palette-color__red--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-red:hover {
    background: var(--su-palette-color__red--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-red:active {
  background: var(--su-palette-color__red--6);
  color: var(--su-color-white);
}
.su-button-fill-red:focus-visible {
  outline: 2px solid var(--su-palette-color__red--3);
}
.su-button-fill-orange {
  background: var(--su-palette-color__orange--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-orange:hover {
    background: var(--su-palette-color__orange--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-orange:active {
  background: var(--su-palette-color__orange--6);
  color: var(--su-color-white);
}
.su-button-fill-orange:focus-visible {
  outline: 2px solid var(--su-palette-color__orange--3);
}
.su-button-fill-orange-yellow {
  background: var(--su-palette-color__orange-yellow--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-orange-yellow:hover {
    background: var(--su-palette-color__orange-yellow--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-orange-yellow:active {
  background: var(--su-palette-color__orange-yellow--6);
  color: var(--su-color-white);
}
.su-button-fill-orange-yellow:focus-visible {
  outline: 2px solid var(--su-palette-color__orange-yellow--3);
}
.su-button-fill-yellow {
  background: var(--su-palette-color__yellow--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-yellow:hover {
    background: var(--su-palette-color__yellow--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-yellow:active {
  background: var(--su-palette-color__yellow--6);
  color: var(--su-color-white);
}
.su-button-fill-yellow:focus-visible {
  outline: 2px solid var(--su-palette-color__yellow--3);
}
.su-button-fill-yellow-green {
  background: var(--su-palette-color__yellow-green--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-yellow-green:hover {
    background: var(--su-palette-color__yellow-green--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-yellow-green:active {
  background: var(--su-palette-color__yellow-green--6);
  color: var(--su-color-white);
}
.su-button-fill-yellow-green:focus-visible {
  outline: 2px solid var(--su-palette-color__yellow-green--3);
}
.su-button-fill-green {
  background: var(--su-palette-color__green--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-green:hover {
    background: var(--su-palette-color__green--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-green:active {
  background: var(--su-palette-color__green--6);
  color: var(--su-color-white);
}
.su-button-fill-green:focus-visible {
  outline: 2px solid var(--su-palette-color__green--3);
}
.su-button-fill-teal {
  background: var(--su-palette-color__teal--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-teal:hover {
    background: var(--su-palette-color__teal--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-teal:active {
  background: var(--su-palette-color__teal--6);
  color: var(--su-color-white);
}
.su-button-fill-teal:focus-visible {
  outline: 2px solid var(--su-palette-color__teal--3);
}
.su-button-fill-cyan {
  background: var(--su-palette-color__cyan--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-cyan:hover {
    background: var(--su-palette-color__cyan--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-cyan:active {
  background: var(--su-palette-color__cyan--6);
  color: var(--su-color-white);
}
.su-button-fill-cyan:focus-visible {
  outline: 2px solid var(--su-palette-color__cyan--3);
}
.su-button-fill-light-blue {
  background: var(--su-palette-color__light-blue--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-light-blue:hover {
    background: var(--su-palette-color__light-blue--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-light-blue:active {
  background: var(--su-palette-color__light-blue--6);
  color: var(--su-color-white);
}
.su-button-fill-light-blue:focus-visible {
  outline: 2px solid var(--su-palette-color__light-blue--3);
}
.su-button-fill-blue {
  background: var(--su-palette-color__blue--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-blue:hover {
    background: var(--su-palette-color__blue--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-blue:active {
  background: var(--su-palette-color__blue--6);
  color: var(--su-color-white);
}
.su-button-fill-blue:focus-visible {
  outline: 2px solid var(--su-palette-color__blue--3);
}
.su-button-fill-blue-violet {
  background: var(--su-palette-color__blue-violet--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-blue-violet:hover {
    background: var(--su-palette-color__blue-violet--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-blue-violet:active {
  background: var(--su-palette-color__blue-violet--6);
  color: var(--su-color-white);
}
.su-button-fill-blue-violet:focus-visible {
  outline: 2px solid var(--su-palette-color__blue-violet--3);
}
.su-button-fill-violet {
  background: var(--su-palette-color__violet--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-violet:hover {
    background: var(--su-palette-color__violet--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-violet:active {
  background: var(--su-palette-color__violet--6);
  color: var(--su-color-white);
}
.su-button-fill-violet:focus-visible {
  outline: 2px solid var(--su-palette-color__violet--3);
}
.su-button-fill-purple {
  background: var(--su-palette-color__purple--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-purple:hover {
    background: var(--su-palette-color__purple--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-purple:active {
  background: var(--su-palette-color__purple--6);
  color: var(--su-color-white);
}
.su-button-fill-purple:focus-visible {
  outline: 2px solid var(--su-palette-color__purple--3);
}
.su-button-fill-magenta {
  background: var(--su-palette-color__magenta--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-magenta:hover {
    background: var(--su-palette-color__magenta--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-magenta:active {
  background: var(--su-palette-color__magenta--6);
  color: var(--su-color-white);
}
.su-button-fill-magenta:focus-visible {
  outline: 2px solid var(--su-palette-color__magenta--3);
}
.su-button-fill-pink {
  background: var(--su-palette-color__pink--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-pink:hover {
    background: var(--su-palette-color__pink--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-pink:active {
  background: var(--su-palette-color__pink--6);
  color: var(--su-color-white);
}
.su-button-fill-pink:focus-visible {
  outline: 2px solid var(--su-palette-color__pink--3);
}
.su-button-fill-pink-red {
  background: var(--su-palette-color__pink-red--4);
  color: var(--su-color-white);
}
@media (any-hover: hover) {
  .su-button-fill-pink-red:hover {
    background: var(--su-palette-color__pink-red--2);
    color: var(--su-color-white);
  }
}
.su-button-fill-pink-red:active {
  background: var(--su-palette-color__pink-red--6);
  color: var(--su-color-white);
}
.su-button-fill-pink-red:focus-visible {
  outline: 2px solid var(--su-palette-color__pink-red--3);
}

/* -------------------------------
 *  button secondary & outline
 * ---------------------------- */
.su-button-secondary,
.su-button-outline {
  border-color: var(--su-color-outline-button-secondary);
  color: var(--su-color-label-button-secondary);
}
@media (any-hover: hover) {
  .su-button-secondary:hover,
  .su-button-outline:hover {
    border-color: var(--su-color-outline-button-secondary-hover);
    color: var(--su-color-label-button-secondary-hover);
  }
}
.su-button-secondary.su-button-state-hover,
.su-button-outline.su-button-state-hover {
  border-color: var(--su-color-outline-button-secondary-hover);
  color: var(--su-color-label-button-secondary-hover);
}
.su-button-secondary:active, .su-button-secondary.su-button-state-active,
.su-button-outline:active,
.su-button-outline.su-button-state-active {
  border-color: var(--su-color-outline-button-secondary-active);
  color: var(--su-color-label-button-secondary-active);
}
.su-button-secondary:focus-visible, .su-button-secondary.su-button-state-focus,
.su-button-outline:focus-visible,
.su-button-outline.su-button-state-focus {
  outline: 2px solid var(--su-color-ring-button-secondary-focus);
}
.su-button-secondary.su-button-state-disabled,
.su-button-outline.su-button-state-disabled {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

.su-button-outline-red {
  border-color: var(--su-palette-color__red--4);
  color: var(--su-palette-color__red--5);
}
@media (any-hover: hover) {
  .su-button-outline-red:hover {
    border-color: var(--su-palette-color__red--2);
    color: var(--su-palette-color__red--2);
  }
}
.su-button-outline-red:active {
  border-color: var(--su-palette-color__red--6);
  color: var(--su-palette-color__red--7);
}
.su-button-outline-red:focus-visible {
  outline: 2px solid var(--su-palette-color__red--3);
}
.su-button-outline-orange {
  border-color: var(--su-palette-color__orange--4);
  color: var(--su-palette-color__orange--5);
}
@media (any-hover: hover) {
  .su-button-outline-orange:hover {
    border-color: var(--su-palette-color__orange--2);
    color: var(--su-palette-color__orange--2);
  }
}
.su-button-outline-orange:active {
  border-color: var(--su-palette-color__orange--6);
  color: var(--su-palette-color__orange--7);
}
.su-button-outline-orange:focus-visible {
  outline: 2px solid var(--su-palette-color__orange--3);
}
.su-button-outline-orange-yellow {
  border-color: var(--su-palette-color__orange-yellow--4);
  color: var(--su-palette-color__orange-yellow--5);
}
@media (any-hover: hover) {
  .su-button-outline-orange-yellow:hover {
    border-color: var(--su-palette-color__orange-yellow--2);
    color: var(--su-palette-color__orange-yellow--2);
  }
}
.su-button-outline-orange-yellow:active {
  border-color: var(--su-palette-color__orange-yellow--6);
  color: var(--su-palette-color__orange-yellow--7);
}
.su-button-outline-orange-yellow:focus-visible {
  outline: 2px solid var(--su-palette-color__orange-yellow--3);
}
.su-button-outline-yellow {
  border-color: var(--su-palette-color__yellow--4);
  color: var(--su-palette-color__yellow--5);
}
@media (any-hover: hover) {
  .su-button-outline-yellow:hover {
    border-color: var(--su-palette-color__yellow--2);
    color: var(--su-palette-color__yellow--2);
  }
}
.su-button-outline-yellow:active {
  border-color: var(--su-palette-color__yellow--6);
  color: var(--su-palette-color__yellow--7);
}
.su-button-outline-yellow:focus-visible {
  outline: 2px solid var(--su-palette-color__yellow--3);
}
.su-button-outline-yellow-green {
  border-color: var(--su-palette-color__yellow-green--4);
  color: var(--su-palette-color__yellow-green--5);
}
@media (any-hover: hover) {
  .su-button-outline-yellow-green:hover {
    border-color: var(--su-palette-color__yellow-green--2);
    color: var(--su-palette-color__yellow-green--2);
  }
}
.su-button-outline-yellow-green:active {
  border-color: var(--su-palette-color__yellow-green--6);
  color: var(--su-palette-color__yellow-green--7);
}
.su-button-outline-yellow-green:focus-visible {
  outline: 2px solid var(--su-palette-color__yellow-green--3);
}
.su-button-outline-green {
  border-color: var(--su-palette-color__green--4);
  color: var(--su-palette-color__green--5);
}
@media (any-hover: hover) {
  .su-button-outline-green:hover {
    border-color: var(--su-palette-color__green--2);
    color: var(--su-palette-color__green--2);
  }
}
.su-button-outline-green:active {
  border-color: var(--su-palette-color__green--6);
  color: var(--su-palette-color__green--7);
}
.su-button-outline-green:focus-visible {
  outline: 2px solid var(--su-palette-color__green--3);
}
.su-button-outline-teal {
  border-color: var(--su-palette-color__teal--4);
  color: var(--su-palette-color__teal--5);
}
@media (any-hover: hover) {
  .su-button-outline-teal:hover {
    border-color: var(--su-palette-color__teal--2);
    color: var(--su-palette-color__teal--2);
  }
}
.su-button-outline-teal:active {
  border-color: var(--su-palette-color__teal--6);
  color: var(--su-palette-color__teal--7);
}
.su-button-outline-teal:focus-visible {
  outline: 2px solid var(--su-palette-color__teal--3);
}
.su-button-outline-cyan {
  border-color: var(--su-palette-color__cyan--4);
  color: var(--su-palette-color__cyan--5);
}
@media (any-hover: hover) {
  .su-button-outline-cyan:hover {
    border-color: var(--su-palette-color__cyan--2);
    color: var(--su-palette-color__cyan--2);
  }
}
.su-button-outline-cyan:active {
  border-color: var(--su-palette-color__cyan--6);
  color: var(--su-palette-color__cyan--7);
}
.su-button-outline-cyan:focus-visible {
  outline: 2px solid var(--su-palette-color__cyan--3);
}
.su-button-outline-light-blue {
  border-color: var(--su-palette-color__light-blue--4);
  color: var(--su-palette-color__light-blue--5);
}
@media (any-hover: hover) {
  .su-button-outline-light-blue:hover {
    border-color: var(--su-palette-color__light-blue--2);
    color: var(--su-palette-color__light-blue--2);
  }
}
.su-button-outline-light-blue:active {
  border-color: var(--su-palette-color__light-blue--6);
  color: var(--su-palette-color__light-blue--7);
}
.su-button-outline-light-blue:focus-visible {
  outline: 2px solid var(--su-palette-color__light-blue--3);
}
.su-button-outline-blue {
  border-color: var(--su-palette-color__blue--4);
  color: var(--su-palette-color__blue--5);
}
@media (any-hover: hover) {
  .su-button-outline-blue:hover {
    border-color: var(--su-palette-color__blue--2);
    color: var(--su-palette-color__blue--2);
  }
}
.su-button-outline-blue:active {
  border-color: var(--su-palette-color__blue--6);
  color: var(--su-palette-color__blue--7);
}
.su-button-outline-blue:focus-visible {
  outline: 2px solid var(--su-palette-color__blue--3);
}
.su-button-outline-blue-violet {
  border-color: var(--su-palette-color__blue-violet--4);
  color: var(--su-palette-color__blue-violet--5);
}
@media (any-hover: hover) {
  .su-button-outline-blue-violet:hover {
    border-color: var(--su-palette-color__blue-violet--2);
    color: var(--su-palette-color__blue-violet--2);
  }
}
.su-button-outline-blue-violet:active {
  border-color: var(--su-palette-color__blue-violet--6);
  color: var(--su-palette-color__blue-violet--7);
}
.su-button-outline-blue-violet:focus-visible {
  outline: 2px solid var(--su-palette-color__blue-violet--3);
}
.su-button-outline-violet {
  border-color: var(--su-palette-color__violet--4);
  color: var(--su-palette-color__violet--5);
}
@media (any-hover: hover) {
  .su-button-outline-violet:hover {
    border-color: var(--su-palette-color__violet--2);
    color: var(--su-palette-color__violet--2);
  }
}
.su-button-outline-violet:active {
  border-color: var(--su-palette-color__violet--6);
  color: var(--su-palette-color__violet--7);
}
.su-button-outline-violet:focus-visible {
  outline: 2px solid var(--su-palette-color__violet--3);
}
.su-button-outline-purple {
  border-color: var(--su-palette-color__purple--4);
  color: var(--su-palette-color__purple--5);
}
@media (any-hover: hover) {
  .su-button-outline-purple:hover {
    border-color: var(--su-palette-color__purple--2);
    color: var(--su-palette-color__purple--2);
  }
}
.su-button-outline-purple:active {
  border-color: var(--su-palette-color__purple--6);
  color: var(--su-palette-color__purple--7);
}
.su-button-outline-purple:focus-visible {
  outline: 2px solid var(--su-palette-color__purple--3);
}
.su-button-outline-magenta {
  border-color: var(--su-palette-color__magenta--4);
  color: var(--su-palette-color__magenta--5);
}
@media (any-hover: hover) {
  .su-button-outline-magenta:hover {
    border-color: var(--su-palette-color__magenta--2);
    color: var(--su-palette-color__magenta--2);
  }
}
.su-button-outline-magenta:active {
  border-color: var(--su-palette-color__magenta--6);
  color: var(--su-palette-color__magenta--7);
}
.su-button-outline-magenta:focus-visible {
  outline: 2px solid var(--su-palette-color__magenta--3);
}
.su-button-outline-pink {
  border-color: var(--su-palette-color__pink--4);
  color: var(--su-palette-color__pink--5);
}
@media (any-hover: hover) {
  .su-button-outline-pink:hover {
    border-color: var(--su-palette-color__pink--2);
    color: var(--su-palette-color__pink--2);
  }
}
.su-button-outline-pink:active {
  border-color: var(--su-palette-color__pink--6);
  color: var(--su-palette-color__pink--7);
}
.su-button-outline-pink:focus-visible {
  outline: 2px solid var(--su-palette-color__pink--3);
}
.su-button-outline-pink-red {
  border-color: var(--su-palette-color__pink-red--4);
  color: var(--su-palette-color__pink-red--5);
}
@media (any-hover: hover) {
  .su-button-outline-pink-red:hover {
    border-color: var(--su-palette-color__pink-red--2);
    color: var(--su-palette-color__pink-red--2);
  }
}
.su-button-outline-pink-red:active {
  border-color: var(--su-palette-color__pink-red--6);
  color: var(--su-palette-color__pink-red--7);
}
.su-button-outline-pink-red:focus-visible {
  outline: 2px solid var(--su-palette-color__pink-red--3);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-card: var(--su-gray-color__mono--4);
  --su-size-radius-card: var(--su-size-4s);
  --su-size-base-width-card: 320px;
  --su-size-text-card: var(--su-size-r);
  --su-size-gutter-card-container: var(--su-size-2l);
  --su-size-gutter-card-item: var(--su-size-s);
  --su-ratio-aspect-thumbnail-card: 16 / 9;
  --su-prefix-tag-card: "#";
}
@media (width <= 768px) {
  :root {
    --su-size-gutter-card-container: var(--su-size-r);
  }
}
@media (width <= 576px) {
  :root {
    --su-size-gutter-card-container: var(--su-size-s);
  }
}

/* -------------------------------
 *  card-item & cardcontainer
 * ---------------------------- */
.su-card-container {
  display: -ms-grid;
  display: grid;
  -webkit-column-gap: var(--su-size-gutter-card-container);
     -moz-column-gap: var(--su-size-gutter-card-container);
          column-gap: var(--su-size-gutter-card-container);
  row-gap: var(--su-size-gutter-card-container);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--su-size-base-width-card)), 1fr));
}
.su-card-container > .su-card {
  max-width: 100%;
  width: 100%;
  -ms-grid-rows: subgrid;
  grid-template-rows: subgrid;
  -ms-grid-row-span: 4;
  grid-row: span 4;
}

.su-card {
  max-width: 100%;
  width: var(--su-size-base-width-card);
  border: 1px solid var(--su-color-border-card);
  border-radius: var(--su-size-radius-card);
  overflow: hidden;
  display: -ms-grid;
  display: grid;
  font-size: var(--su-size-text-card);
  row-gap: var(--su-size-gutter-card-item);
}
.su-card a {
  text-decoration: none;
}
.su-card .su-card-outerlink,
.su-card .su-card-innerlink,
.su-card .su-card-content-top,
.su-card .su-card-content-bottom {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
}
.su-card .su-card-outerlink {
  -ms-grid-row: 1;
  -ms-grid-row-span: 4;
  grid-row: 1/5;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: subgrid;
  grid-template-rows: subgrid;
}
.su-card .su-card-thumbnail {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
  aspect-ratio: var(--su-ratio-aspect-thumbnail-card);
  overflow: hidden;
}
.su-card .su-card-thumbnail img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.su-card .su-card-content-top {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
}
.su-card .su-card-content-bottom {
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3/4;
}
.su-card .su-card-innerlink {
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/5;
  padding-inline: var(--su-size-gutter-card-item);
  padding-bottom: var(--su-size-gutter-card-item);
}
.su-card .su-card-datetime {
  padding-inline: var(--su-size-gutter-card-item);
  font-size: 0.75em;
  line-height: 1;
}
.su-card .su-card-title {
  padding-inline: var(--su-size-gutter-card-item);
  font-size: 1.125em;
}
.su-card .su-card-tags {
  font-size: 0.875em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  row-gap: 0.25em;
}
.su-card .su-card-tags a {
  font-size: inherit;
}
.su-card .su-card-tags a::before {
  content: var(--su-prefix-tag-card);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-bg-code-block: var(--su-palette-color__blue-violet--8);
  --su-color-border-code-block: var(--su-palette-color__blue-violet--9);
  --su-color-text-code-block: var(--su-color-white);
  --su-color-bg-code-inline: var(--su-palette-color__orange--0);
  --su-color-text-code-inline: var(--su-palette-color__orange--6);
  --su-color-border-code-inline: var(--su-palette-color__orange--4);
}

/* -------------------------------
 *  code
 * ---------------------------- */
.su-code-block {
  padding: 1em;
  font-family: var(--su-font-monospace);
  font-weight: bold;
  font-size: var(--su-size-s);
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--su-color-bg-code-block);
  color: var(--su-color-text-code-block);
  border: 1px solid var(--su-color-border-code-block);
  border-radius: var(--su-size-5s);
}
@media (width <= 768px) {
  .su-code-block {
    font-size: var(--su-size-2s);
  }
}
.su-code-block *, .su-code-block code, .su-code-block pre {
  font-family: var(--su-font-monospace);
}

.su-code-inline {
  display: inline-block;
  padding: 0.25em;
  margin-inline: 0.25em;
  border-radius: var(--su-size-5s);
  font-family: var(--su-font-monospace);
  font-weight: bold;
  font-size: var(--su-size-s);
  line-height: 1;
  background: var(--su-color-bg-code-inline);
  color: var(--su-color-text-code-inline);
  border: 1px solid var(--su-color-border-code-inline);
}
@media (width <= 768px) {
  .su-code-inline {
    font-size: var(--su-size-2s);
  }
}
.su-code-inline * {
  font-family: var(--su-font-monospace);
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-text-datetime: var(--su-gray-color__mono--4);
  --su-color-icon-datetime: var(--su-gray-color__mono--3);
}

/* -------------------------------
 *  datetime
 * ---------------------------- */
.su-datetime-inline {
  display: inline-block;
  font-style: var(--su-font-italic);
  color: var(--su-color-text-datetime);
}
.su-datetime-inline.su-datetime-add-icon-date, .su-datetime-inline.su-datetime-add-icon-time {
  font-style: normal;
  padding: 0 0 0 1.25lh;
  position: relative;
}
.su-datetime-inline.su-datetime-add-icon-date::before, .su-datetime-inline.su-datetime-add-icon-time::before {
  position: absolute;
  left: 0;
  top: 0;
  width: 1lh;
  height: 1lh;
  font-family: "startify-ui icons";
  color: var(--su-color-icon-datetime);
  line-height: 1;
  font-size: 1.8em;
}
.su-datetime-inline.su-datetime-add-icon-date::before {
  content: "\e903";
}
.su-datetime-inline.su-datetime-add-icon-time::before {
  content: "\e910";
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-checkbox: var(--su-gray-color__mono--4);
  --su-color-border-checkbox-hover: var(--su-palette-color__pink-red--0);
  --su-color-border-checkbox-focus: var(--su-palette-color__pink-red--2);
  --su-color-bg-checkbox: var(--su-color-white);
  --su-color-fill-checkbox: var(--su-palette-color__pink-red--4);
  --su-color-icon-checkbox: var(--su-color-white);
  --su-size-radius-checkbox: var(--su-size-5s);
}

/* -------------------------------
 *  checkbox
 * ---------------------------- */
.su-form-checkbox {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 1.25em;
  height: 1.25em;
  border: 1px solid var(--su-color-border-checkbox);
  border-radius: var(--su-size-radius-checkbox);
  position: relative;
  background: var(--su-color-bg-checkbox);
  font-size: inherit;
}
.su-form-checkbox::before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyMiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuMjIxOTggNC4yOTI5M0wwLjM5MzU1NSA3LjEyMTM2TDguODc4ODQgMTUuNjA2NkwyMS42MDY4IDIuODc4NzJMMTguNzc4MyAwLjA1MDI5M0w4Ljg3ODg0IDkuOTQ5NzlMMy4yMjE5OCA0LjI5MjkzWiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==");
          mask-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyMiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuMjIxOTggNC4yOTI5M0wwLjM5MzU1NSA3LjEyMTM2TDguODc4ODQgMTUuNjA2NkwyMS42MDY4IDIuODc4NzJMMTguNzc4MyAwLjA1MDI5M0w4Ljg3ODg0IDkuOTQ5NzlMMy4yMjE5OCA0LjI5MjkzWiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  background: var(--su-color-white);
}
.su-form-checkbox:focus-visible, .su-form-checkbox.su-form-checkbox-state-focus {
  outline: 2px solid var(--su-color-border-checkbox-focus);
  outline-offset: 0px;
}
.su-form-checkbox:checked, .su-form-checkbox.su-form-checkbox-state-checked {
  background: var(--su-color-fill-checkbox);
  border: 1px solid var(--su-color-fill-checkbox);
}
.su-form-checkbox:checked::before, .su-form-checkbox.su-form-checkbox-state-checked::before {
  opacity: 1;
}
.su-form-checkbox.su-form-checkbox-state-hover {
  outline: 4px solid var(--su-color-border-checkbox-hover);
  outline-offset: 0px;
}
@media (any-hover: hover) {
  .su-form-checkbox:hover {
    outline: 4px solid var(--su-color-border-checkbox-hover);
    outline-offset: 0px;
  }
}
@media (any-hover: hover) {
  .su-form-checkbox:disabled:hover, .su-form-checkbox.su-form-checkbox-state-disabled:hover {
    outline: none;
  }
}

label:has(> .su-form-checkbox) {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 0.5em minmax(0, 1fr);
  grid-template-columns: auto minmax(0, 1fr);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
label:has(> .su-form-checkbox:disabled), label:has(> .su-form-checkbox.su-form-checkbox-state-disabled) {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-fill-button-file-input: var(--su-palette-color__pink-red--4);
  --su-color-fill-button-file-input-hover: var(--su-palette-color__pink-red--2);
  --su-color-fill-button-file-input-active: var(--su-palette-color__pink-red--6);
  --su-color-ring-button-file-input-focus: var(--su-palette-color__pink-red--3);
  --su-color-text-button-file-input: var(--su-color-white);
  --su-size-text-button-file-input: var(--su-size-r);
  --su-size-radius-button-file-input: var(--su-size-3s);
  --su-color-bg-drop-area-file-input: var(--su-gray-color__mono--1);
  --su-color-border-drop-area-file-input: var(--su-gray-color__mono--4);
  --su-color-bg-drop-area-file-input-hover: var(--su-gray-color__mono--3);
  --su-color-ring-drop-area-file-input-focus: var(--su-gray-color__mono--3);
  --su-color-text-drop-area-file-input: var(--su-gray-color__mono--5);
  --su-size-height-drop-area-file-input: 160px;
  --su-size-width-drop-area-file-input: 480px;
  --su-size-radius-drop-area-file-input: var(--su-size-3s);
  --su-size-thumbnail-preview-file-input: 120px;
}

/* -------------------------------
 *  file input
 * ---------------------------- */
.su-form-file-input {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(0, 1fr))[1];
  grid-template-columns: repeat(1, minmax(0, 1fr));
  justify-items: start;
  row-gap: 1em;
}
.su-form-file-input input[type=file] {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
@media (any-hover: hover) {
  .su-form-file-input input[type=file]:hover {
    cursor: pointer;
  }
}

/* -------------------------------
 *  file input button
 * ---------------------------- */
.su-form-file-input-button {
  display: inline-block;
  width: auto;
  background: var(--su-color-fill-button-file-input);
  color: var(--su-color-text-button-file-input);
  font-weight: bold;
  padding: 1em;
  border: none;
  border-radius: var(--su-size-radius-button-file-input);
  font-size: var(--su-size-text-button-file-input);
  margin-right: 0.5em;
  line-height: 1.2;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
  position: relative;
  outline-offset: 4px;
}
@media (any-hover: hover) {
  .su-form-file-input-button:hover {
    background: var(--su-color-fill-button-file-input-hover);
  }
}
.su-form-file-input-button:active {
  background: var(--su-color-fill-button-file-input-active);
}
.su-form-file-input-button:has(input[type=file]:focus-visible) {
  outline: 2px solid var(--su-color-ring-button-file-input-focus);
}

/* -------------------------------
 *  file input drop area
 * ---------------------------- */
.su-form-file-input-file-drop-area {
  width: var(--su-size-width-drop-area-file-input);
  height: var(--su-size-height-drop-area-file-input);
  max-width: 100%;
  position: relative;
  display: -ms-grid;
  display: grid;
  place-items: center;
  border-radius: var(--su-size-radius-drop-area-file-input);
  border: 1px dashed var(--su-color-border-drop-area-file-input);
  color: var(--su-color-text-drop-area-file-input);
  position: relative;
  outline-offset: 4px;
}
.su-form-file-input-file-drop-area::before {
  content: "";
  position: absolute;
  top: var(--su-size-5s);
  left: var(--su-size-5s);
  width: calc(100% - var(--su-size-4s));
  height: calc(100% - var(--su-size-4s));
  background: var(--su-color-bg-drop-area-file-input);
  opacity: 0.5;
  border-radius: calc(var(--su-size-radius-drop-area-file-input) - var(--su-size-5s));
  z-index: 1;
  -webkit-transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s, color 0.4s ease 0.1s;
}
.su-form-file-input-file-drop-area > *:not(input[type=file]) {
  position: relative;
  z-index: 2;
}
@media (any-hover: hover) {
  .su-form-file-input-file-drop-area:hover::before {
    background: var(--su-color-bg-drop-area-file-input-hover);
  }
}
.su-form-file-input-file-drop-area:has(input[type=file]:focus-visible) {
  outline: 2px solid var(--su-color-ring-drop-area-file-input-focus);
}

/* -------------------------------
 *  file input list
 * ---------------------------- */
.su-form-file-input-list {
  display: none;
  -ms-grid-columns: (minmax(0, 1fr))[1];
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 0.25em;
}

.su-form-file-input-list-item {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1.5em 1em minmax(0, 1fr);
  grid-template-columns: 1.5em minmax(0, 1fr);
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.su-form-file-input-file-name {
  font-size: 0.75em;
}

.su-form-file-input-file-remove {
  font-size: 1.75em;
  line-height: 1;
  display: -ms-grid;
  display: grid;
  place-items: center;
}
.su-form-file-input-file-remove .su-form-file-input-file-remove-icon::before {
  color: var(--su-status-color__negative--4);
}

/* -------------------------------
 *  file input thumbnail preview
 * ---------------------------- */
.su-form-file-input-thumbnail-preview {
  display: none;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: var(--su-size-5s);
     -moz-column-gap: var(--su-size-5s);
          column-gap: var(--su-size-5s);
  row-gap: var(--su-size-5s);
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.su-form-file-input-thumbnail-preview-thumbnail {
  position: relative;
  width: max(80px, var(--su-size-thumbnail-preview-file-input));
  height: max(80px, var(--su-size-thumbnail-preview-file-input));
}

.su-form-file-input-thumbnail-preview-duration,
.su-form-file-input-thumbnail-preview-remove {
  position: absolute;
}

.su-form-file-input-thumbnail-preview-image,
.su-form-file-input-thumbnail-preview-canvas {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.su-form-file-input-thumbnail-preview-duration {
  padding: var(--su-size-5s);
  right: 0;
  bottom: 0;
  text-align: right;
  font-size: var(--su-size-2s);
  height: 100%;
  width: 100%;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(10%, rgba(0, 0, 0, 0.6)), color-stop(45%, rgba(0, 0, 0, 0)));
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0) 45%);
  color: var(--su-color-white);
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  font-weight: bold;
}

.su-form-file-input-thumbnail-preview-remove {
  left: var(--su-size-5s);
  top: var(--su-size-5s);
  width: 1.5rem;
  height: 1.5rem;
  color: var(--su-color-white);
  line-height: 1;
  display: -ms-grid;
  display: grid;
  place-items: center;
  background: var(--su-color-white);
  border-radius: 100%;
}
.su-form-file-input-thumbnail-preview-remove .su-form-file-input-file-remove-icon {
  font-size: 1.5rem;
}
.su-form-file-input-thumbnail-preview-remove .su-form-file-input-file-remove-icon::before {
  color: var(--su-status-color__negative--4);
}

.su-form-file-input-thumbnail-preview-file {
  display: -ms-grid;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: var(--su-color-white);
  border: 1px solid var(--su-gray-color__mono--2);
}
.su-form-file-input-thumbnail-preview-file .su-form-file-input-thumbnail-preview-file-icon {
  font-size: 40px;
}
.su-form-file-input-thumbnail-preview-file .su-form-file-input-thumbnail-preview-file-icon::before {
  color: var(--su-gray-color__mono--4);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-option-buttons: var(--su-gray-color__mono--3);
  --su-color-border-option-buttons-checked: var(--su-palette-color__pink-red--6);
  --su-color-border-option-buttons-hover: var(--su-palette-color__pink-red--0);
  --su-color-border-option-buttons-focus: var(--su-palette-color__pink-red--2);
  --su-color-text-option-buttons: var(--su-gray-color__mono--3);
  --su-color-fill-option-buttons: var(--su-palette-color__pink-red--4);
  --su-color-text-option-buttons-checked: var(--su-color-white);
  --su-size-radius-option-buttons: var(--su-size-3s);
}

/* -------------------------------
 *  option buttons
 * ---------------------------- */
.su-form-option-buttons {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.su-form-option-buttons label:has(> input[type=radio]),
.su-form-option-buttons label:has(> input[type=checkbox]) {
  padding: 1em;
  border: 1px solid;
  line-height: 1;
  border-color: var(--su-color-border-option-buttons);
  color: var(--su-color-text-option-buttons);
}
.su-form-option-buttons label:has(> input[type=radio]):first-of-type,
.su-form-option-buttons label:has(> input[type=checkbox]):first-of-type {
  border-top-left-radius: var(--su-size-radius-option-buttons);
  border-bottom-left-radius: var(--su-size-radius-option-buttons);
}
.su-form-option-buttons label:has(> input[type=radio]):last-of-type,
.su-form-option-buttons label:has(> input[type=checkbox]):last-of-type {
  border-top-right-radius: var(--su-size-radius-option-buttons);
  border-bottom-right-radius: var(--su-size-radius-option-buttons);
}
.su-form-option-buttons label:has(> input[type=radio]):not(:first-of-type),
.su-form-option-buttons label:has(> input[type=checkbox]):not(:first-of-type) {
  border-left-width: 0;
}
.su-form-option-buttons label:has(> input[type=radio]) input[type=radio],
.su-form-option-buttons label:has(> input[type=radio]) input[type=checkbox],
.su-form-option-buttons label:has(> input[type=checkbox]) input[type=radio],
.su-form-option-buttons label:has(> input[type=checkbox]) input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
@media (any-hover: hover) {
  .su-form-option-buttons label:has(> input[type=radio]):hover,
  .su-form-option-buttons label:has(> input[type=checkbox]):hover {
    outline: 4px solid var(--su-color-border-option-buttons-hover);
    position: relative;
    z-index: 1;
  }
}
.su-form-option-buttons *:has(> input[type=radio]:checked),
.su-form-option-buttons *:has(> input[type=checkbox]:checked) {
  background: var(--su-color-fill-option-buttons);
  color: var(--su-color-text-option-buttons-checked);
  border-color: var(--su-color-border-option-buttons-checked);
}
.su-form-option-buttons *:has(> input[type=radio]:focus-visible),
.su-form-option-buttons *:has(> input[type=checkbox]:focus-visible) {
  outline: 2px solid var(--su-color-border-option-buttons-focus);
  position: relative;
  z-index: 1;
}
@media (any-hover: hover) {
  .su-form-option-buttons *:has(> input[type=radio]:focus-visible):hover,
  .su-form-option-buttons *:has(> input[type=checkbox]:focus-visible):hover {
    outline: 4px solid var(--su-color-border-option-buttons-hover);
  }
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-radio: var(--su-gray-color__mono--4);
  --su-color-border-radio-hover: var(--su-palette-color__pink-red--0);
  --su-color-border-radio-focus: var(--su-palette-color__pink-red--2);
  --su-color-bg-radio: var(--su-color-white);
  --su-color-fill-radio: var(--su-palette-color__pink-red--4);
  --su-size-radius-radio: var(--su-size-1-2);
}

/* -------------------------------
 *  radio button
 * ---------------------------- */
.su-form-radio {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 1.25em;
  height: 1.25em;
  border: 1px solid var(--su-color-border-radio);
  border-radius: var(--su-size-radius-radio);
  background: var(--su-color-bg-radio);
  font-size: inherit;
}
.su-form-radio:focus-visible, .su-form-radio.su-form-radio-state-focus {
  outline: 2px solid var(--su-color-border-radio-focus);
  outline-offset: 0px;
}
.su-form-radio:checked, .su-form-radio.su-form-radio-state-checked {
  background: var(--su-color-fill-radio);
  border: 1px solid var(--su-color-fill-radio);
}
.su-form-radio:checked::before, .su-form-radio.su-form-radio-state-checked::before {
  opacity: 1;
}
.su-form-radio.su-form-radio-state-hover {
  outline: 4px solid var(--su-color-border-radio-hover);
  outline-offset: 0px;
}
@media (any-hover: hover) {
  .su-form-radio:hover {
    outline: 4px solid var(--su-color-border-radio-hover);
    outline-offset: 0px;
  }
}
@media (any-hover: hover) {
  .su-form-radio:disabled:hover, .su-form-radio.su-form-radio-state-disabled:hover {
    outline: none;
  }
}

label:has(> .su-form-radio) {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 0.5em minmax(0, 1fr);
  grid-template-columns: auto minmax(0, 1fr);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
label:has(> .su-form-radio:disabled), label:has(> .su-form-radio.su-form-radio-state-disabled) {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-range-input: var(--su-gray-color__mono--2);
  --su-color-border-range-input-hover: var(--su-palette-color__pink-red--0);
  --su-color-border-range-input-focus: var(--su-palette-color__pink-red--2);
  --su-color-bg-button-range-input: var(--su-color-white);
  --su-color-bg-bar-range-input: var(--su-gray-color__mono--1);
  --su-color-fill-bar-range-input: var(--su-palette-color__pink-red--4);
  --su-size-button-range-input: var(--su-size-2l);
  --su-width-default-range-input: 300px;
  --su-prefix-range-output: "入力値（";
  --su-suffix-range-output: "）";
  --su-prefix-range-output-multiple-min: "最小（";
  --su-suffix-range-output-multiple-min: "）";
  --su-prefix-range-output-multiple-max: "最大（";
  --su-suffix-range-output-multiple-max: "）";
}

/* -------------------------------
 *  range input
 * ---------------------------- */
.su-form-range-input {
  width: var(--su-width-default-range-input);
  max-width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: var(--su-color-bg-bar-range-input);
  border-radius: 99em;
  -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15) inset;
          box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15) inset;
}
.su-form-range-input::-webkit-slider-thumb {
  -webkit-appearance: none;
          appearance: none;
  width: var(--su-size-button-range-input);
  height: var(--su-size-button-range-input);
  background-color: var(--su-color-bg-button-range-input);
  border-radius: 50%;
  border: 1px solid var(--su-color-border-range-input);
  position: relative;
}
.su-form-range-input:focus-visible, .su-form-range-input.su-form-range-input-state-focus {
  outline: 2px solid var(--su-color-border-range-input-focus);
  outline-offset: 0px;
}
.su-form-range-input.su-form-range-input-state-hover {
  outline: 4px solid var(--su-color-border-range-input-hover);
  outline-offset: 0px;
}
@media (any-hover: hover) {
  .su-form-range-input:hover {
    outline: 4px solid var(--su-color-border-range-input-hover);
    outline-offset: 0px;
    cursor: pointer;
  }
}
@media (any-hover: hover) {
  .su-form-range-input:disabled:hover, .su-form-range-input.su-form-range-input-state-disabled:hover {
    outline: none;
  }
}

label:has(> .su-form-range-input) {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(0, 1fr) 0.5em minmax(0, 1fr);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  row-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
label:has(> .su-form-range-input):has(> .su-form-range-input:disabled), label:has(> .su-form-range-input):has(> .su-form-range-input.su-form-range-input-state-disabled) {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

.su-form-range-output {
  display: inline-block;
}
.su-form-range-output::before {
  content: var(--su-prefix-range-output);
}
.su-form-range-output::after {
  content: var(--su-suffix-range-output);
}

/* -------------------------------
 *  range input multiple
 * ---------------------------- */
.su-form-range-input-multiple {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (auto)[2];
  grid-template-columns: repeat(2, auto);
  -ms-grid-rows: (auto)[1];
  grid-template-rows: repeat(1, auto);
}
.su-form-range-input-multiple > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.su-form-range-input-multiple > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}
.su-form-range-input-multiple > .su-form-range-input {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
  pointer-events: none;
}
.su-form-range-input-multiple > .su-form-range-input::-webkit-slider-thumb {
  pointer-events: auto;
}

.su-form-range-input-multiple-min {
  background: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.su-form-range-input-multiple-min:focus-visible, .su-form-range-input-multiple-min.su-form-range-input-state-focus {
  outline: none;
  outline-offset: 0px;
}
@media (any-hover: hover) {
  .su-form-range-input-multiple-min:disabled:hover, .su-form-range-input-multiple-min.su-form-range-input-state-disabled:hover {
    outline: none;
  }
}

*:has(> .su-form-range-input-multiple) {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(0, 1fr))[1];
  grid-template-columns: repeat(1, minmax(0, 1fr));
  -ms-grid-rows: auto;
  grid-template-rows: repeat(1, auto);
  row-gap: 0.25em;
}

*:has(> .su-form-range-input-multiple) > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.su-form-range-output-multiple-min,
.su-form-range-output-multiple-max {
  display: inline-block;
}

.su-form-range-output-multiple-min::before {
  content: var(--su-prefix-range-output-multiple-min);
}
.su-form-range-output-multiple-min::after {
  content: var(--su-suffix-range-output-multiple-min);
}

.su-form-range-output-multiple-max::before {
  content: var(--su-prefix-range-output-multiple-max);
}
.su-form-range-output-multiple-max::after {
  content: var(--su-suffix-range-output-multiple-max);
}

label:has(> .su-form-range-input-multiple):has(.su-form-range-input:disabled), label:has(> .su-form-range-input-multiple):has(.su-form-range-input.su-form-range-input-state-disabled) {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-text-input: var(--su-gray-color__mono--4);
  --su-color-text-text-input: var(--su-default-font-color);
  --su-color-placeholder-text-input: var(--su-gray-color__mono--2);
  --su-color-icon-text-input: var(--su-gray-color__mono--3);
  --su-size-radius-text-input: var(--su-size-5s);
  --su-min-row-text-area: 4;
  --su-max-row-text-area: 8;
}

/* -------------------------------
 *  text input (single)
 * ---------------------------- */
.su-form-text-input {
  border: 1px solid var(--su-color-border-text-input);
  border-radius: var(--su-size-radius-text-input);
  padding: 0.5em 1em;
  color: var(--su-color-text-text-input);
  max-width: 100%;
  display: inline-block;
}
.su-form-text-input:has(input:focus-visible) {
  outline: 1px solid var(--su-color-border-text-input);
}
.su-form-text-input input {
  font-size: inherit;
  max-width: 100%;
}
.su-form-text-input input:focus-visible {
  outline: none;
}
.su-form-text-input input::-webkit-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-input input::-moz-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-input input:-ms-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-input input::-ms-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-input input::placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-input input::-webkit-inner-spin-button {
  display: none;
}
.su-form-text-input input::-webkit-calendar-picker-indicator {
  display: none;
}
.su-form-text-input.su-form-text-input-show-ui input::-webkit-inner-spin-button {
  display: inline-block;
}
.su-form-text-input.su-form-text-input-show-ui input::-webkit-calendar-picker-indicator {
  display: inline-block;
}
.su-form-text-input.su-form-text-input-add-icon-email, .su-form-text-input.su-form-text-input-add-icon-tel, .su-form-text-input.su-form-text-input-add-icon-url, .su-form-text-input.su-form-text-input-add-icon-date, .su-form-text-input.su-form-text-input-add-icon-time, .su-form-text-input.su-form-text-input-add-icon-password {
  padding: 0.5em 1em 0.5em 2.75em;
  position: relative;
}
.su-form-text-input.su-form-text-input-add-icon-email::before, .su-form-text-input.su-form-text-input-add-icon-tel::before, .su-form-text-input.su-form-text-input-add-icon-url::before, .su-form-text-input.su-form-text-input-add-icon-date::before, .su-form-text-input.su-form-text-input-add-icon-time::before, .su-form-text-input.su-form-text-input-add-icon-password::before {
  position: absolute;
  left: 0.5em;
  top: calc(50% - 0.5lh);
  width: 1lh;
  height: 1lh;
  font-family: "startify-ui icons";
  color: var(--su-color-icon-text-input);
  line-height: 1;
  font-size: 1.44em;
}
.su-form-text-input.su-form-text-input-add-icon-email::before {
  content: "\e907";
}
.su-form-text-input.su-form-text-input-add-icon-tel::before {
  content: "\e90c";
}
.su-form-text-input.su-form-text-input-add-icon-url::before {
  content: "\e90a";
}
.su-form-text-input.su-form-text-input-add-icon-date::before {
  content: "\e903";
}
.su-form-text-input.su-form-text-input-add-icon-time::before {
  content: "\e910";
}
.su-form-text-input.su-form-text-input-add-icon-password::before {
  content: "\e90b";
}

/* -------------------------------
 *  text input (mulch)
 * ---------------------------- */
.su-form-text-area {
  border: 1px solid var(--su-color-border-text-input);
  border-radius: var(--su-size-radius-text-input);
  padding: 0.5em 1em;
  color: var(--su-color-text-text-input);
  max-width: 100%;
  display: inline-block;
  field-sizing: content;
  min-height: calc(var(--su-min-row-text-area) * 1lh);
  max-height: calc(var(--su-max-row-text-area) * 1lh);
  resize: vertical;
}
.su-form-text-area:focus-visible {
  outline: 1px solid var(--su-color-border-text-input);
}
.su-form-text-area::-webkit-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-area::-moz-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-area:-ms-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-area::-ms-input-placeholder {
  color: var(--su-color-placeholder-text-input);
}
.su-form-text-area::placeholder {
  color: var(--su-color-placeholder-text-input);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-bg-toggle-switch: var(--su-status-color__negative--2);
  --su-color-bg-toggle-switch-checked: var(--su-palette-color__pink-red--4);
  --su-color-border-toggle-switch-hover: var(--su-palette-color__pink-red--0);
  --su-color-border-toggle-switch-focus: var(--su-palette-color__pink-red--2);
  --su-color-button-toggle-switch: var(--su-color-white);
  --su-size-toggle-switch: 1.5em;
  --su-size-radius-toggle-switch: calc(var(--su-size-toggle-switch) / 2);
}

/* -------------------------------
 *  toggle-switch
 * ---------------------------- */
.su-form-toggle-switch {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: calc(var(--su-size-toggle-switch) * 2);
  height: var(--su-size-toggle-switch);
  border-radius: var(--su-size-radius-toggle-switch);
  position: relative;
  background: var(--su-color-bg-toggle-switch);
  -webkit-transition: background 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s;
  font-size: inherit;
}
.su-form-toggle-switch::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  display: block;
  width: calc(50% - 8px);
  height: calc(100% - 8px);
  background: var(--su-color-white);
  border-radius: var(--su-size-radius-toggle-switch);
  -webkit-transition: -webkit-transform 0.4s ease 0.1s;
  transition: -webkit-transform 0.4s ease 0.1s;
  transition: transform 0.4s ease 0.1s;
  transition: transform 0.4s ease 0.1s, -webkit-transform 0.4s ease 0.1s;
  -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
}
.su-form-toggle-switch:focus-visible, .su-form-toggle-switch.su-form-toggle-switch-state-focus {
  outline: 2px solid var(--su-color-border-toggle-switch-focus);
  outline-offset: 0px;
}
.su-form-toggle-switch:checked, .su-form-toggle-switch.su-form-toggle-switch-state-checked {
  background: var(--su-color-bg-toggle-switch-checked);
}
.su-form-toggle-switch:checked::before, .su-form-toggle-switch.su-form-toggle-switch-state-checked::before {
  -webkit-transform: translate(calc(100% + 8px), 0);
          transform: translate(calc(100% + 8px), 0);
}
.su-form-toggle-switch.su-form-toggle-switch-state-hover {
  outline: 4px solid var(--su-color-border-toggle-switch-hover);
  outline-offset: 0px;
}
@media (any-hover: hover) {
  .su-form-toggle-switch:hover {
    outline: 4px solid var(--su-color-border-toggle-switch-hover);
    outline-offset: 0px;
    cursor: pointer;
  }
}
@media (any-hover: hover) {
  .su-form-toggle-switch:disabled:hover, .su-form-toggle-switch.su-form-toggle-switch-state-disabled:hover {
    outline: none;
  }
}

label:has(> .su-form-toggle-switch) {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 0.5em minmax(0, 1fr);
  grid-template-columns: auto minmax(0, 1fr);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
label:has(> .su-form-toggle-switch:disabled), label:has(> .su-form-toggle-switch.su-form-toggle-switch-state-disabled) {
  opacity: 0.2;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-selectbox: var(--su-gray-color__mono--4);
  --su-color-text-selectbox: var(--su-default-font-color);
  --su-color-icon-selectbox: var(--su-default-font-color);
  --su-size-radius-selectbox: var(--su-size-5s);
}

/* -------------------------------
 *  selectbox
 * ---------------------------- */
.su-form-selectbox {
  border: 1px solid var(--su-color-border-selectbox);
  border-radius: var(--su-size-radius-selectbox);
  color: var(--su-color-text-selectbox);
  max-width: 100%;
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}
.su-form-selectbox select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.su-form-selectbox select:focus-visible {
  outline: none;
}
.su-form-selectbox:not(:has(select[multiple])) {
  position: relative;
}
.su-form-selectbox:not(:has(select[multiple]))::before, .su-form-selectbox:not(:has(select[multiple]))::after {
  content: "";
  width: 12px;
  height: 2px;
  border-radius: 1px;
  background: var(--su-color-icon-selectbox);
  position: absolute;
  top: calc(50% - 1px);
  right: 1em;
}
.su-form-selectbox:not(:has(select[multiple]))::before {
  rotate: 45deg;
  translate: -31% 0;
}
.su-form-selectbox:not(:has(select[multiple]))::after {
  rotate: -45deg;
  translate: 31% 0;
}
.su-form-selectbox:not(:has(select[multiple])) select {
  padding: 0.5em 3em 0.5em 1em;
}
.su-form-selectbox:has(select:focus-visible) {
  outline: 1px solid var(--su-color-border-selectbox);
}
.su-form-selectbox:has(select[multiple]) select {
  padding: 0.5em 1em 0.5em 1em;
}
.su-form-selectbox:has(select[multiple]) option {
  padding: 0 0 0 1.75em;
  margin: 0.5em 0.5em 0.5em 0;
}
.su-form-selectbox:has(select[multiple]) option:first-child {
  margin-top: 0;
}
.su-form-selectbox:has(select[multiple]) option:last-child {
  margin-bottom: 0;
}
.su-form-selectbox:has(select[multiple]) option:checked {
  position: relative;
  background: var(--su-status-color__success--0);
}
.su-form-selectbox:has(select[multiple]) option:checked::before {
  content: "\e90f";
  font-family: "startify-ui icons";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1lh;
  color: var(--su-status-color__success--4);
}
.su-form-selectbox:has(select[multiple]) optgroup {
  margin: 0.5em 0.5em 0.5em 0;
  padding: 0.5em 0 0 0;
  border-top: 1px dotted var(--su-color-border-selectbox);
}
.su-form-selectbox:has(select[multiple]) optgroup option {
  margin: 0.5em 0;
}
.su-form-selectbox:has(select[multiple]) optgroup option:first-child {
  margin-top: 0.5em;
}
.su-form-selectbox:has(select[multiple]) optgroup option:last-child {
  margin-bottom: 0;
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-search-form: var(--su-gray-color__mono--4);
  --su-color-text-search-form: var(--su-default-font-color);
  --su-color-placeholder-search-form: var(--su-gray-color__mono--2);
  --su-color-icon-search-form: var(--su-gray-color__mono--3);
  --su-size-radius-search-form: var(--su-size-5s);
  --su-color-border-search-submit: var(--su-palette-color__pink-red--4);
  --su-color-bg-search-submit: var(--su-palette-color__pink-red--4);
  --su-color-bg-search-submit-hover: var(--su-palette-color__pink-red--2);
  --su-color-bg-search-submit-active: var(--su-palette-color__pink-red--6);
  --su-color-text-search-submit: var(--su-color-white);
}

/* -------------------------------
 *  search form
 * ---------------------------- */
.su-form-search {
  color: var(--su-color-text-search-form);
  max-width: 100%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.su-form-search input[type=search],
.su-form-search input[type=text],
.su-form-search input[type=email],
.su-form-search input[type=tel],
.su-form-search input[type=url],
.su-form-search input[type=number] {
  font-size: inherit;
  max-width: 100%;
  width: 100%;
  border: 1px solid var(--su-color-border-search-form);
  border-radius: var(--su-size-radius-search-form) 0 0 var(--su-size-radius-search-form);
  padding: 0.5em 1em;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.su-form-search input[type=search]:focus-visible,
.su-form-search input[type=text]:focus-visible,
.su-form-search input[type=email]:focus-visible,
.su-form-search input[type=tel]:focus-visible,
.su-form-search input[type=url]:focus-visible,
.su-form-search input[type=number]:focus-visible {
  outline: 1px solid var(--su-color-border-search-form);
}
.su-form-search input[type=search]::-webkit-input-placeholder, .su-form-search input[type=text]::-webkit-input-placeholder, .su-form-search input[type=email]::-webkit-input-placeholder, .su-form-search input[type=tel]::-webkit-input-placeholder, .su-form-search input[type=url]::-webkit-input-placeholder, .su-form-search input[type=number]::-webkit-input-placeholder {
  color: var(--su-color-placeholder-search-form);
}
.su-form-search input[type=search]::-moz-placeholder, .su-form-search input[type=text]::-moz-placeholder, .su-form-search input[type=email]::-moz-placeholder, .su-form-search input[type=tel]::-moz-placeholder, .su-form-search input[type=url]::-moz-placeholder, .su-form-search input[type=number]::-moz-placeholder {
  color: var(--su-color-placeholder-search-form);
}
.su-form-search input[type=search]:-ms-input-placeholder, .su-form-search input[type=text]:-ms-input-placeholder, .su-form-search input[type=email]:-ms-input-placeholder, .su-form-search input[type=tel]:-ms-input-placeholder, .su-form-search input[type=url]:-ms-input-placeholder, .su-form-search input[type=number]:-ms-input-placeholder {
  color: var(--su-color-placeholder-search-form);
}
.su-form-search input[type=search]::-ms-input-placeholder, .su-form-search input[type=text]::-ms-input-placeholder, .su-form-search input[type=email]::-ms-input-placeholder, .su-form-search input[type=tel]::-ms-input-placeholder, .su-form-search input[type=url]::-ms-input-placeholder, .su-form-search input[type=number]::-ms-input-placeholder {
  color: var(--su-color-placeholder-search-form);
}
.su-form-search input[type=search]::placeholder,
.su-form-search input[type=text]::placeholder,
.su-form-search input[type=email]::placeholder,
.su-form-search input[type=tel]::placeholder,
.su-form-search input[type=url]::placeholder,
.su-form-search input[type=number]::placeholder {
  color: var(--su-color-placeholder-search-form);
}
.su-form-search input[type=search]::-webkit-search-cancel-button {
  display: none;
}
.su-form-search input[type=submit],
.su-form-search button[type=submit] {
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: 0.5em 1em;
  color: var(--su-color-text-search-submit);
  background: var(--su-color-bg-search-submit);
  font-weight: bold;
  border-radius: 0 var(--su-size-radius-search-form) var(--su-size-radius-search-form) 0;
  -webkit-transition: background 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s;
  font-size: inherit;
}
.su-form-search input[type=submit]:focus-visible,
.su-form-search button[type=submit]:focus-visible {
  outline: 1px solid var(--su-color-bg-search-submit);
}
@media (any-hover: hover) {
  .su-form-search input[type=submit]:hover,
  .su-form-search button[type=submit]:hover {
    cursor: pointer;
    background: var(--su-color-bg-search-submit-hover);
  }
}
.su-form-search input[type=submit]:active,
.su-form-search button[type=submit]:active {
  background: var(--su-color-bg-search-submit-active);
}
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group {
  font-size: inherit;
  max-width: 100%;
  border: 1px solid var(--su-color-border-search-form);
  border-radius: var(--su-size-radius-search-form) 0 0 var(--su-size-radius-search-form);
  padding: 0.5em 1em;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group:has(input:focus-visible) {
  outline: 1px solid var(--su-color-border-search-form);
}
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=search],
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=text],
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=email],
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=tel],
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=url],
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=number] {
  border: none;
  border-radius: 0;
  padding: 0;
}
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=search]:focus-visible,
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=text]:focus-visible,
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=email]:focus-visible,
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=tel]:focus-visible,
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=url]:focus-visible,
.su-form-search:has(.su-form-search-input-group) .su-form-search-input-group input[type=number]:focus-visible {
  outline: none;
}
.su-form-search input[type=reset],
.su-form-search button[type=reset] {
  color: transparent;
  width: 1lh;
  height: 1lh;
  background: var(--su-status-color__negative--4);
  -webkit-transition: background 0.4s ease 0.1s;
  transition: background 0.4s ease 0.1s;
  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSIgdmlld0JveD0iMCAwIDI0IDI0Ij48bWFzayBpZD0iYSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiB4PSIwIiB5PSIwIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBzdHlsZT0ibWFzay10eXBlOmFscGhhIj48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNMCAwaDI0djI0SDB6Ii8+PC9tYXNrPjxnIGZpbGw9IiMwMDAiIG1hc2s9InVybCgjYSkiPjxwYXRoIGQ9Ik04LjQ2NCA4LjQ2NGExIDEgMCAwIDEgMS40MTUgMEwxMiAxMC41ODZsMi4xMjEtMi4xMjJhMSAxIDAgMCAxIDEuNDE1IDEuNDE1TDEzLjQxNCAxMmwyLjEyMiAyLjEyMWExIDEgMCAwIDEtMS40MTUgMS40MTVMMTIgMTMuNDE0bC0yLjEyMSAyLjEyMmExIDEgMCAxIDEtMS40MTUtMS40MTVMMTAuNTg2IDEyIDguNDY0IDkuODc5YTEgMSAwIDAgMSAwLTEuNDE1Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMjEgMTJhOSA5IDAgMSAxLTE4IDAgOSA5IDAgMCAxIDE4IDBtLTIgMGE3IDcgMCAxIDEtMTQgMCA3IDcgMCAwIDEgMTQgMCIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9nPjwvc3ZnPg==");
          mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSIgdmlld0JveD0iMCAwIDI0IDI0Ij48bWFzayBpZD0iYSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiB4PSIwIiB5PSIwIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBzdHlsZT0ibWFzay10eXBlOmFscGhhIj48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNMCAwaDI0djI0SDB6Ii8+PC9tYXNrPjxnIGZpbGw9IiMwMDAiIG1hc2s9InVybCgjYSkiPjxwYXRoIGQ9Ik04LjQ2NCA4LjQ2NGExIDEgMCAwIDEgMS40MTUgMEwxMiAxMC41ODZsMi4xMjEtMi4xMjJhMSAxIDAgMCAxIDEuNDE1IDEuNDE1TDEzLjQxNCAxMmwyLjEyMiAyLjEyMWExIDEgMCAwIDEtMS40MTUgMS40MTVMMTIgMTMuNDE0bC0yLjEyMSAyLjEyMmExIDEgMCAxIDEtMS40MTUtMS40MTVMMTAuNTg2IDEyIDguNDY0IDkuODc5YTEgMSAwIDAgMSAwLTEuNDE1Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMjEgMTJhOSA5IDAgMSAxLTE4IDAgOSA5IDAgMCAxIDE4IDBtLTIgMGE3IDcgMCAxIDEtMTQgMCA3IDcgMCAwIDEgMTQgMCIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9nPjwvc3ZnPg==");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: 100%;
          mask-size: 100%;
  margin: 0 0 0 0.5em;
  font-size: inherit;
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.su-form-search input[type=reset]:focus-visible,
.su-form-search button[type=reset]:focus-visible {
  background: var(--su-status-color__negative--6);
}
@media (any-hover: hover) {
  .su-form-search input[type=reset]:hover,
  .su-form-search button[type=reset]:hover {
    background: var(--su-status-color__negative--2);
    cursor: pointer;
  }
}
.su-form-search input[type=reset]:active,
.su-form-search button[type=reset]:active {
  background: var(--su-status-color__negative--8);
}
.su-form-search.su-form-search-add-icon {
  position: relative;
}
.su-form-search.su-form-search-add-icon::before {
  content: "\e90e";
  position: absolute;
  left: 0.5em;
  top: calc(50% - 0.5lh);
  width: 1lh;
  height: 1lh;
  font-family: "startify-ui icons";
  color: var(--su-color-icon-search-form);
  line-height: 1;
  font-size: 1.44em;
}
.su-form-search.su-form-search-add-icon input[type=search],
.su-form-search.su-form-search-add-icon input[type=text],
.su-form-search.su-form-search-add-icon input[type=email],
.su-form-search.su-form-search-add-icon input[type=tel],
.su-form-search.su-form-search-add-icon input[type=url],
.su-form-search.su-form-search-add-icon input[type=number] {
  padding: 0.5em 1em 0.5em 2.75em;
}
.su-form-search.su-form-search-add-icon:has(.su-form-search-input-group) .su-form-search-input-group {
  padding: 0.5em 1em 0.5em 2.75em;
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  heading
 * ---------------------------- */
.su-title {
  font-size: var(--su-size-6l);
  font-weight: var(--su-font-bold);
  line-height: 1.2;
}
@media (width <= 768px) {
  .su-title {
    font-size: var(--su-size-5l);
    line-height: 1.4;
  }
}

.su-heading-1 {
  font-size: var(--su-size-5l);
  font-weight: var(--su-font-bold);
  line-height: 1.4;
}
@media (width <= 768px) {
  .su-heading-1 {
    font-size: var(--su-size-4l);
    line-height: 1.5;
  }
}

.su-heading-2 {
  font-size: var(--su-size-4l);
  font-weight: var(--su-font-bold);
  line-height: 1.5;
}
@media (width <= 768px) {
  .su-heading-2 {
    font-size: var(--su-size-3l);
    line-height: 1.6;
  }
}

.su-heading-3 {
  font-size: var(--su-size-3l);
  font-weight: var(--su-font-bold);
  line-height: 1.6;
}
@media (width <= 768px) {
  .su-heading-3 {
    font-size: var(--su-size-2l);
    line-height: 1.75;
  }
}

.su-heading-4 {
  font-size: var(--su-size-2l);
  font-weight: var(--su-font-bold);
  line-height: 1.75;
}
@media (width <= 768px) {
  .su-heading-4 {
    font-size: var(--su-size-l);
    line-height: 1.8;
  }
}

.su-heading-5 {
  font-size: var(--su-size-l);
  font-weight: var(--su-font-bold);
  line-height: 1.8;
}
@media (width <= 768px) {
  .su-heading-5 {
    font-size: var(--su-size-m);
  }
}

.su-heading-6 {
  font-size: var(--su-size-m);
  font-weight: var(--su-font-bold);
  line-height: 1.8;
}
@media (width <= 768px) {
  .su-heading-6 {
    font-size: var(--su-size-r);
    line-height: 2;
  }
}

.su-title,
.su-heading-1,
.su-heading-2,
.su-heading-3,
.su-heading-4,
.su-heading-5,
.su-heading-6 {
  margin-block: 1em;
}
.su-title:first-child,
.su-heading-1:first-child,
.su-heading-2:first-child,
.su-heading-3:first-child,
.su-heading-4:first-child,
.su-heading-5:first-child,
.su-heading-6:first-child {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}

hgroup > .su-title {
  -webkit-margin-after: 0;
          margin-block-end: 0;
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-icon-text-link: var(--su-default-font-color);
}

/* -------------------------------
 *  link components
 * ---------------------------- */
.su-text-link {
  text-decoration: underline;
  display: inline;
}
.su-text-link[target=_blank] {
  padding: 0 1.4em 0 0;
  margin-right: 0.25em;
  position: relative;
  display: inline-block;
}
.su-text-link[target=_blank]::before, .su-text-link[target=_blank]::after {
  content: "";
  position: absolute;
  width: 0.9em;
  height: 0.7em;
}
.su-text-link[target=_blank]::before {
  border: 2px solid var(--su-color-icon-text-link);
  right: 0;
  bottom: 10px;
}
.su-text-link[target=_blank]::after {
  border-left: 2px solid var(--su-color-icon-text-link);
  border-bottom: 2px solid var(--su-color-icon-text-link);
  right: 4px;
  bottom: 6px;
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-marker-list: var(--su-default-font-color);
  --su-color-number-list: inherit;
  --su-color-border-list: var(--su-gray-color__mono--3);
}

/* -------------------------------
 *  list
 * ---------------------------- */
.su-list-bullet {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.su-list-bullet > li {
  padding: 0 0 0 1em;
  position: relative;
}
.su-list-bullet > li::before {
  content: "";
  position: absolute;
  width: 0.5em;
  height: 0.5em;
  background: var(--su-color-marker-list);
  left: 0;
  top: calc(0.5lh - 0.25em);
  border-radius: 100%;
  display: block;
}
.su-list-bullet .su-list-bullet, .su-list-bullet .su-list-ordered {
  padding: 0 0 0 1em;
}

.su-list-ordered {
  margin: 0;
  padding: 0;
  list-style-type: none;
  counter-reset: number;
}
.su-list-ordered > li {
  padding: 0 0 0 1.25em;
  position: relative;
  counter-increment: number;
}
.su-list-ordered > li::before {
  content: counter(number) ".";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--su-color-number-list);
}
.su-list-ordered .su-list-ordered, .su-list-ordered .su-list-bullet {
  padding: 0 0 0 1em;
}

.su-list-items > * {
  padding: 0.5em 0.75em;
}
.su-list-items > * + * {
  position: relative;
  padding: calc(0.5em + 1px) 0.75em 0.5em 0.75em;
}
.su-list-items > * + *::before {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--su-color-border-list);
  position: absolute;
  left: 0;
  top: 0;
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-bg-modal-overlay: rgb(0 0 0 / 50%);
  --su-size-blur-modal-overlay: 4px;
  --su-size-radius-modal: var(--su-size-5s);
  --su-size-space-outside-modal: var(--su-size-r);
  --su-color-separator-modal: var(--su-gray-color__mono--2);
}

/* -------------------------------
 *  icon
 * ---------------------------- */
.su-modal {
  margin: auto;
  -webkit-box-shadow: 0 var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
          box-shadow: 0 var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
  border-radius: var(--su-size-radius-modal);
  max-width: calc(100% - var(--su-size-space-outside-modal) * 2);
  max-height: calc(100% - var(--su-size-space-outside-modal) * 2);
  overflow: visible;
}
.su-modal::-ms-backdrop {
  background: var(--su-color-bg-modal-overlay);
  -webkit-backdrop-filter: blur(var(--su-size-blur-modal-overlay));
  backdrop-filter: blur(var(--su-size-blur-modal-overlay));
}
.su-modal::backdrop {
  background: var(--su-color-bg-modal-overlay);
  -webkit-backdrop-filter: blur(var(--su-size-blur-modal-overlay));
  backdrop-filter: blur(var(--su-size-blur-modal-overlay));
}
.su-modal.su-modal-full {
  max-width: none;
  max-height: none;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.su-modal.su-modal-full[open] {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 100%;
  grid-template-columns: 100%;
  -ms-grid-rows: auto minmax(0, 1fr) auto;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.su-modal.su-modal-full[open] > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.su-modal.su-modal-full[open] > *:nth-child(2) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.su-modal.su-modal-full[open] > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.su-modal .su-modal-header,
.su-modal .su-modal-content,
.su-modal .su-modal-footer {
  padding: 1em;
}
.su-modal .su-modal-header {
  font-weight: bold;
}
.su-modal .su-modal-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1em;
}
.su-modal .su-modal-content {
  overflow: auto;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: var(--su-color-separator-modal);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  pagination links
 * ---------------------------- */
.su-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  row-gap: 0.5em;
  line-height: 1;
}

/* -------------------------------
 *  next previous links
 * ---------------------------- */
.su-next-previous-links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-column-gap: 2em;
     -moz-column-gap: 2em;
          column-gap: 2em;
}
.su-next-previous-links > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.su-next-previous-links > * > * {
  position: relative;
}
.su-next-previous-links > * > *::before {
  position: absolute;
  top: 0;
}
.su-next-previous-links > *:nth-child(1) {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.su-next-previous-links > *:nth-child(1) > * {
  padding-left: 1.5em;
}
.su-next-previous-links > *:nth-child(1) > *::before {
  content: "‹";
  left: 0;
}
.su-next-previous-links > *:nth-child(2) {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.su-next-previous-links > *:nth-child(2) > * {
  padding-right: 1.5em;
}
.su-next-previous-links > *:nth-child(2) > *::before {
  content: "›";
  right: 0;
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  quote
 * ---------------------------- */
.su-quote-block {
  padding: 1em 1em 1em 1.5em;
  font-style: var(--su-font-italic);
  line-height: 1.4;
  word-break: break-word;
  background: var(--su-gray-color__mono--1);
  border-left: 2px solid var(--su-gray-color__mono--3);
  font-size: var(--su-size-r);
}
@media (width <= 768px) {
  .su-quote-block {
    font-size: var(--su-size-s);
  }
}
.su-quote-block > *:not(cite)::before {
  content: "“";
  padding: 0 0.5em 0 0;
}
.su-quote-block > *:not(cite)::after {
  content: "”";
  padding: 0 0 0 0.5em;
}
.su-quote-block cite {
  display: block;
  margin-top: 1em;
  padding-top: 1em;
  border-top: 1px solid var(--su-gray-color__mono--2);
  text-align: right;
  font-size: 0.8em;
}

.su-quote-inline {
  display: inline;
  padding: 0.25em 0.5em;
  margin-inline: 0.25em;
  font-size: 1em;
  font-style: var(--su-font-italic);
  line-height: 1;
  background: var(--su-gray-color__mono--1);
}
@media (width <= 768px) {
  .su-quote-inline {
    font-size: var(--su-size-2s);
  }
}
.su-quote-inline::before {
  content: "“";
  padding: 0 0.25em 0 0;
}
.su-quote-inline::after {
  content: "”";
  padding: 0 0 0 0.25em;
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-border-table: var(--su-gray-color__mono--3);
  --su-color-fill-table: var(--su-gray-color__mono--2);
  --su-color-stripe-odd-table: var(--su-gray-color__mono--0);
  --su-color-stripe-even-table: var(--su-color-white);
  --su-min-width-responsive-table: auto;
}

/* -------------------------------
 *  table
 * ---------------------------- */
.su-table-border,
.su-table-fill,
.su-table-stripe {
  border-collapse: collapse;
  width: 100%;
}
.su-table-border caption,
.su-table-fill caption,
.su-table-stripe caption {
  margin-bottom: 0.5em;
}
.su-table-border th,
.su-table-border td,
.su-table-fill th,
.su-table-fill td,
.su-table-stripe th,
.su-table-stripe td {
  padding: 0.5em;
  text-align: left;
  vertical-align: top;
}
.su-table-border th.su-table-cell-top,
.su-table-border td.su-table-cell-top,
.su-table-fill th.su-table-cell-top,
.su-table-fill td.su-table-cell-top,
.su-table-stripe th.su-table-cell-top,
.su-table-stripe td.su-table-cell-top {
  vertical-align: top;
}
.su-table-border th.su-table-cell-middle,
.su-table-border td.su-table-cell-middle,
.su-table-fill th.su-table-cell-middle,
.su-table-fill td.su-table-cell-middle,
.su-table-stripe th.su-table-cell-middle,
.su-table-stripe td.su-table-cell-middle {
  vertical-align: middle;
}
.su-table-border th.su-table-cell-bottom,
.su-table-border td.su-table-cell-bottom,
.su-table-fill th.su-table-cell-bottom,
.su-table-fill td.su-table-cell-bottom,
.su-table-stripe th.su-table-cell-bottom,
.su-table-stripe td.su-table-cell-bottom {
  vertical-align: bottom;
}
.su-table-border.su-table-size-small,
.su-table-fill.su-table-size-small,
.su-table-stripe.su-table-size-small {
  font-size: 0.8em;
}
.su-table-border.su-table-size-small th,
.su-table-border.su-table-size-small td,
.su-table-fill.su-table-size-small th,
.su-table-fill.su-table-size-small td,
.su-table-stripe.su-table-size-small th,
.su-table-stripe.su-table-size-small td {
  padding: 0.25em;
}
.su-table-border.su-table-size-large,
.su-table-fill.su-table-size-large,
.su-table-stripe.su-table-size-large {
  font-size: 1.2em;
}
.su-table-border.su-table-size-large th,
.su-table-border.su-table-size-large td,
.su-table-fill.su-table-size-large th,
.su-table-fill.su-table-size-large td,
.su-table-stripe.su-table-size-large th,
.su-table-stripe.su-table-size-large td {
  padding: 0.75em;
}
.su-table-border.su-table-column-fixed,
.su-table-fill.su-table-column-fixed,
.su-table-stripe.su-table-column-fixed {
  table-layout: fixed;
}

.su-table-border th,
.su-table-border td {
  border-bottom: 1px solid var(--su-color-border-table);
}
.su-table-border thead tr:last-child th,
.su-table-border thead tr:last-child td {
  border-bottom-width: 2px;
}
.su-table-border:has(tfoot) tbody tr:last-child th,
.su-table-border:has(tfoot) tbody tr:last-child td {
  border-bottom-width: 2px;
}

.su-table-fill th {
  background: var(--su-color-fill-table);
}
.su-table-fill th,
.su-table-fill td {
  border: 1px solid var(--su-color-border-table);
}

.su-table-stripe tbody tr:first-child th,
.su-table-stripe tbody tr:first-child td {
  border-top: 1px solid var(--su-color-border-table);
}
.su-table-stripe tbody tr:last-child th,
.su-table-stripe tbody tr:last-child td {
  border-bottom: 1px solid var(--su-color-border-table);
}
.su-table-stripe tbody tr:nth-child(odd) th,
.su-table-stripe tbody tr:nth-child(odd) td {
  background: var(--su-color-stripe-odd-table);
}
.su-table-stripe tbody tr:nth-child(even) th,
.su-table-stripe tbody tr:nth-child(even) td {
  background: var(--su-color-stripe-even-table);
}

/* -------------------------------
 *  table wrapper
 * ---------------------------- */
.su-table-wrap-responsive {
  overflow-x: auto;
}
.su-table-wrap-responsive > table {
  min-width: var(--su-min-width-responsive-table);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-text-highlight: #ffff00;
}

/* -------------------------------
 *  text components
 * ---------------------------- */
.su-text-body {
  font-size: var(--su-size-r);
  font-weight: var(--su-font-medium);
  line-height: 2;
}
@media (width <= 768px) {
  .su-text-body {
    font-size: var(--su-size-s);
  }
}

.su-text-caption {
  font-size: var(--su-size-s);
  font-weight: var(--su-font-regular);
  line-height: 1.8;
  display: block;
}
@media (width <= 768px) {
  .su-text-caption {
    font-size: var(--su-size-2s);
  }
}

.su-text-body,
.su-text-caption {
  margin-block: 1em;
}
.su-text-body:first-child,
.su-text-caption:first-child {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}

.su-text-highlight {
  background: var(--su-color-text-highlight);
}

/* -------------------------------
 *  startify-ui
 *  file import (Object_Utility)
 * ---------------------------- */
/* -------------------------------
 *  alignment for inline
 * ---------------------------- */
.su-align-left {
  text-align: left;
}
.su-align-center {
  text-align: center;
}
.su-align-right {
  text-align: right;
}
.su-align-justify {
  text-align: justify;
}

/* -------------------------------
 *  vertical alignment for inline
 * ---------------------------- */
.su-align-top {
  vertical-align: top;
}
.su-align-middle {
  vertical-align: middle;
}
.su-align-bottom {
  vertical-align: bottom;
}
.su-align-baseline {
  vertical-align: baseline;
}

/* -------------------------------
 *  alignment for block
 * ---------------------------- */
.su-block-left {
  margin-right: auto;
  margin-left: 0;
}
.su-block-start {
  -webkit-margin-start: 0;
          margin-inline-start: 0;
  -webkit-margin-end: auto;
          margin-inline-end: auto;
}
.su-block-center {
  margin-inline: auto;
}
.su-block-right {
  margin-right: 0;
  margin-left: auto;
}
.su-block-end {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  -webkit-margin-end: 0;
          margin-inline-end: 0;
}

/* -------------------------------
 *  justify content
 * ---------------------------- */
.su-justify-content-flex-start {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.su-justify-content-start {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
}
.su-justify-content-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.su-justify-content-flex-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.su-justify-content-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}
.su-justify-content-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.su-justify-content-around {
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.su-justify-content-evenly {
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

/* -------------------------------
 *  justify items
 * ---------------------------- */
.su-justify-items-start {
  justify-items: start;
}
.su-justify-items-center {
  justify-items: center;
}
.su-justify-items-end {
  justify-items: end;
}
.su-justify-items-stretch {
  justify-items: stretch;
}

/* -------------------------------
 *  justify self
 * ---------------------------- */
.su-justify-self-start {
  -ms-grid-column-align: start;
      justify-self: start;
}
.su-justify-self-center {
  -ms-grid-column-align: center;
      justify-self: center;
}
.su-justify-self-end {
  -ms-grid-column-align: end;
      justify-self: end;
}
.su-justify-self-stretch {
  -ms-grid-column-align: stretch;
      justify-self: stretch;
}

/* -------------------------------
 *  align items
 * ---------------------------- */
.su-align-items-flex-start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.su-align-items-start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}
.su-align-items-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.su-align-items-flex-end {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.su-align-items-end {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
}
.su-align-items-stretch {
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.su-align-items-baseline {
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

/* -------------------------------
 *  align self
 * ---------------------------- */
.su-align-self-flex-start {
  -ms-flex-item-align: start;
      align-self: flex-start;
}
.su-align-self-start {
  -ms-flex-item-align: start;
      -ms-grid-row-align: start;
      align-self: start;
}
.su-align-self-center {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}
.su-align-self-flex-end {
  -ms-flex-item-align: end;
      align-self: flex-end;
}
.su-align-self-end {
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
}
.su-align-self-stretch {
  -ms-flex-item-align: stretch;
      -ms-grid-row-align: stretch;
      align-self: stretch;
}
.su-align-self-baseline {
  -ms-flex-item-align: baseline;
      align-self: baseline;
}

/* -------------------------------
 *  align content
 * ---------------------------- */
.su-align-content-flex-start {
  -ms-flex-line-pack: start;
      align-content: flex-start;
}
.su-align-content-start {
  -ms-flex-line-pack: start;
      align-content: start;
}
.su-align-content-center {
  -ms-flex-line-pack: center;
      align-content: center;
}
.su-align-content-flex-end {
  -ms-flex-line-pack: end;
      align-content: flex-end;
}
.su-align-content-end {
  -ms-flex-line-pack: end;
      align-content: end;
}
.su-align-content-between {
  -ms-flex-line-pack: justify;
      align-content: space-between;
}
.su-align-content-around {
  -ms-flex-line-pack: distribute;
      align-content: space-around;
}
.su-align-content-evenly {
  -ms-flex-line-pack: space-evenly;
      align-content: space-evenly;
}

/* -------------------------------
 *  background color
 * ---------------------------- */
.su-bg-red {
  background-color: var(--su-palette-color__red--4);
}
.su-bg-red-0 {
  background-color: var(--su-palette-color__red--0);
}
.su-bg-red-1 {
  background-color: var(--su-palette-color__red--1);
}
.su-bg-red-2 {
  background-color: var(--su-palette-color__red--2);
}
.su-bg-red-3 {
  background-color: var(--su-palette-color__red--3);
}
.su-bg-red-4 {
  background-color: var(--su-palette-color__red--4);
}
.su-bg-red-5 {
  background-color: var(--su-palette-color__red--5);
}
.su-bg-red-6 {
  background-color: var(--su-palette-color__red--6);
}
.su-bg-red-7 {
  background-color: var(--su-palette-color__red--7);
}
.su-bg-red-8 {
  background-color: var(--su-palette-color__red--8);
}
.su-bg-red-9 {
  background-color: var(--su-palette-color__red--9);
}

.su-bg-orange {
  background-color: var(--su-palette-color__orange--4);
}
.su-bg-orange-0 {
  background-color: var(--su-palette-color__orange--0);
}
.su-bg-orange-1 {
  background-color: var(--su-palette-color__orange--1);
}
.su-bg-orange-2 {
  background-color: var(--su-palette-color__orange--2);
}
.su-bg-orange-3 {
  background-color: var(--su-palette-color__orange--3);
}
.su-bg-orange-4 {
  background-color: var(--su-palette-color__orange--4);
}
.su-bg-orange-5 {
  background-color: var(--su-palette-color__orange--5);
}
.su-bg-orange-6 {
  background-color: var(--su-palette-color__orange--6);
}
.su-bg-orange-7 {
  background-color: var(--su-palette-color__orange--7);
}
.su-bg-orange-8 {
  background-color: var(--su-palette-color__orange--8);
}
.su-bg-orange-9 {
  background-color: var(--su-palette-color__orange--9);
}

.su-bg-orange-yellow {
  background-color: var(--su-palette-color__orange-yellow--4);
}
.su-bg-orange-yellow-0 {
  background-color: var(--su-palette-color__orange-yellow--0);
}
.su-bg-orange-yellow-1 {
  background-color: var(--su-palette-color__orange-yellow--1);
}
.su-bg-orange-yellow-2 {
  background-color: var(--su-palette-color__orange-yellow--2);
}
.su-bg-orange-yellow-3 {
  background-color: var(--su-palette-color__orange-yellow--3);
}
.su-bg-orange-yellow-4 {
  background-color: var(--su-palette-color__orange-yellow--4);
}
.su-bg-orange-yellow-5 {
  background-color: var(--su-palette-color__orange-yellow--5);
}
.su-bg-orange-yellow-6 {
  background-color: var(--su-palette-color__orange-yellow--6);
}
.su-bg-orange-yellow-7 {
  background-color: var(--su-palette-color__orange-yellow--7);
}
.su-bg-orange-yellow-8 {
  background-color: var(--su-palette-color__orange-yellow--8);
}
.su-bg-orange-yellow-9 {
  background-color: var(--su-palette-color__orange-yellow--9);
}

.su-bg-yellow {
  background-color: var(--su-palette-color__yellow--4);
}
.su-bg-yellow-0 {
  background-color: var(--su-palette-color__yellow--0);
}
.su-bg-yellow-1 {
  background-color: var(--su-palette-color__yellow--1);
}
.su-bg-yellow-2 {
  background-color: var(--su-palette-color__yellow--2);
}
.su-bg-yellow-3 {
  background-color: var(--su-palette-color__yellow--3);
}
.su-bg-yellow-4 {
  background-color: var(--su-palette-color__yellow--4);
}
.su-bg-yellow-5 {
  background-color: var(--su-palette-color__yellow--5);
}
.su-bg-yellow-6 {
  background-color: var(--su-palette-color__yellow--6);
}
.su-bg-yellow-7 {
  background-color: var(--su-palette-color__yellow--7);
}
.su-bg-yellow-8 {
  background-color: var(--su-palette-color__yellow--8);
}
.su-bg-yellow-9 {
  background-color: var(--su-palette-color__yellow--9);
}

.su-bg-yellow-green {
  background-color: var(--su-palette-color__yellow-green--4);
}
.su-bg-yellow-green-0 {
  background-color: var(--su-palette-color__yellow-green--0);
}
.su-bg-yellow-green-1 {
  background-color: var(--su-palette-color__yellow-green--1);
}
.su-bg-yellow-green-2 {
  background-color: var(--su-palette-color__yellow-green--2);
}
.su-bg-yellow-green-3 {
  background-color: var(--su-palette-color__yellow-green--3);
}
.su-bg-yellow-green-4 {
  background-color: var(--su-palette-color__yellow-green--4);
}
.su-bg-yellow-green-5 {
  background-color: var(--su-palette-color__yellow-green--5);
}
.su-bg-yellow-green-6 {
  background-color: var(--su-palette-color__yellow-green--6);
}
.su-bg-yellow-green-7 {
  background-color: var(--su-palette-color__yellow-green--7);
}
.su-bg-yellow-green-8 {
  background-color: var(--su-palette-color__yellow-green--8);
}
.su-bg-yellow-green-9 {
  background-color: var(--su-palette-color__yellow-green--9);
}

.su-bg-green {
  background-color: var(--su-palette-color__green--4);
}
.su-bg-green-0 {
  background-color: var(--su-palette-color__green--0);
}
.su-bg-green-1 {
  background-color: var(--su-palette-color__green--1);
}
.su-bg-green-2 {
  background-color: var(--su-palette-color__green--2);
}
.su-bg-green-3 {
  background-color: var(--su-palette-color__green--3);
}
.su-bg-green-4 {
  background-color: var(--su-palette-color__green--4);
}
.su-bg-green-5 {
  background-color: var(--su-palette-color__green--5);
}
.su-bg-green-6 {
  background-color: var(--su-palette-color__green--6);
}
.su-bg-green-7 {
  background-color: var(--su-palette-color__green--7);
}
.su-bg-green-8 {
  background-color: var(--su-palette-color__green--8);
}
.su-bg-green-9 {
  background-color: var(--su-palette-color__green--9);
}

.su-bg-teal {
  background-color: var(--su-palette-color__teal--4);
}
.su-bg-teal-0 {
  background-color: var(--su-palette-color__teal--0);
}
.su-bg-teal-1 {
  background-color: var(--su-palette-color__teal--1);
}
.su-bg-teal-2 {
  background-color: var(--su-palette-color__teal--2);
}
.su-bg-teal-3 {
  background-color: var(--su-palette-color__teal--3);
}
.su-bg-teal-4 {
  background-color: var(--su-palette-color__teal--4);
}
.su-bg-teal-5 {
  background-color: var(--su-palette-color__teal--5);
}
.su-bg-teal-6 {
  background-color: var(--su-palette-color__teal--6);
}
.su-bg-teal-7 {
  background-color: var(--su-palette-color__teal--7);
}
.su-bg-teal-8 {
  background-color: var(--su-palette-color__teal--8);
}
.su-bg-teal-9 {
  background-color: var(--su-palette-color__teal--9);
}

.su-bg-cyan {
  background-color: var(--su-palette-color__cyan--4);
}
.su-bg-cyan-0 {
  background-color: var(--su-palette-color__cyan--0);
}
.su-bg-cyan-1 {
  background-color: var(--su-palette-color__cyan--1);
}
.su-bg-cyan-2 {
  background-color: var(--su-palette-color__cyan--2);
}
.su-bg-cyan-3 {
  background-color: var(--su-palette-color__cyan--3);
}
.su-bg-cyan-4 {
  background-color: var(--su-palette-color__cyan--4);
}
.su-bg-cyan-5 {
  background-color: var(--su-palette-color__cyan--5);
}
.su-bg-cyan-6 {
  background-color: var(--su-palette-color__cyan--6);
}
.su-bg-cyan-7 {
  background-color: var(--su-palette-color__cyan--7);
}
.su-bg-cyan-8 {
  background-color: var(--su-palette-color__cyan--8);
}
.su-bg-cyan-9 {
  background-color: var(--su-palette-color__cyan--9);
}

.su-bg-light-blue {
  background-color: var(--su-palette-color__light-blue--4);
}
.su-bg-light-blue-0 {
  background-color: var(--su-palette-color__light-blue--0);
}
.su-bg-light-blue-1 {
  background-color: var(--su-palette-color__light-blue--1);
}
.su-bg-light-blue-2 {
  background-color: var(--su-palette-color__light-blue--2);
}
.su-bg-light-blue-3 {
  background-color: var(--su-palette-color__light-blue--3);
}
.su-bg-light-blue-4 {
  background-color: var(--su-palette-color__light-blue--4);
}
.su-bg-light-blue-5 {
  background-color: var(--su-palette-color__light-blue--5);
}
.su-bg-light-blue-6 {
  background-color: var(--su-palette-color__light-blue--6);
}
.su-bg-light-blue-7 {
  background-color: var(--su-palette-color__light-blue--7);
}
.su-bg-light-blue-8 {
  background-color: var(--su-palette-color__light-blue--8);
}
.su-bg-light-blue-9 {
  background-color: var(--su-palette-color__light-blue--9);
}

.su-bg-blue {
  background-color: var(--su-palette-color__blue--4);
}
.su-bg-blue-0 {
  background-color: var(--su-palette-color__blue--0);
}
.su-bg-blue-1 {
  background-color: var(--su-palette-color__blue--1);
}
.su-bg-blue-2 {
  background-color: var(--su-palette-color__blue--2);
}
.su-bg-blue-3 {
  background-color: var(--su-palette-color__blue--3);
}
.su-bg-blue-4 {
  background-color: var(--su-palette-color__blue--4);
}
.su-bg-blue-5 {
  background-color: var(--su-palette-color__blue--5);
}
.su-bg-blue-6 {
  background-color: var(--su-palette-color__blue--6);
}
.su-bg-blue-7 {
  background-color: var(--su-palette-color__blue--7);
}
.su-bg-blue-8 {
  background-color: var(--su-palette-color__blue--8);
}
.su-bg-blue-9 {
  background-color: var(--su-palette-color__blue--9);
}

.su-bg-blue-violet {
  background-color: var(--su-palette-color__blue-violet--4);
}
.su-bg-blue-violet-0 {
  background-color: var(--su-palette-color__blue-violet--0);
}
.su-bg-blue-violet-1 {
  background-color: var(--su-palette-color__blue-violet--1);
}
.su-bg-blue-violet-2 {
  background-color: var(--su-palette-color__blue-violet--2);
}
.su-bg-blue-violet-3 {
  background-color: var(--su-palette-color__blue-violet--3);
}
.su-bg-blue-violet-4 {
  background-color: var(--su-palette-color__blue-violet--4);
}
.su-bg-blue-violet-5 {
  background-color: var(--su-palette-color__blue-violet--5);
}
.su-bg-blue-violet-6 {
  background-color: var(--su-palette-color__blue-violet--6);
}
.su-bg-blue-violet-7 {
  background-color: var(--su-palette-color__blue-violet--7);
}
.su-bg-blue-violet-8 {
  background-color: var(--su-palette-color__blue-violet--8);
}
.su-bg-blue-violet-9 {
  background-color: var(--su-palette-color__blue-violet--9);
}

.su-bg-violet {
  background-color: var(--su-palette-color__violet--4);
}
.su-bg-violet-0 {
  background-color: var(--su-palette-color__violet--0);
}
.su-bg-violet-1 {
  background-color: var(--su-palette-color__violet--1);
}
.su-bg-violet-2 {
  background-color: var(--su-palette-color__violet--2);
}
.su-bg-violet-3 {
  background-color: var(--su-palette-color__violet--3);
}
.su-bg-violet-4 {
  background-color: var(--su-palette-color__violet--4);
}
.su-bg-violet-5 {
  background-color: var(--su-palette-color__violet--5);
}
.su-bg-violet-6 {
  background-color: var(--su-palette-color__violet--6);
}
.su-bg-violet-7 {
  background-color: var(--su-palette-color__violet--7);
}
.su-bg-violet-8 {
  background-color: var(--su-palette-color__violet--8);
}
.su-bg-violet-9 {
  background-color: var(--su-palette-color__violet--9);
}

.su-bg-purple {
  background-color: var(--su-palette-color__purple--4);
}
.su-bg-purple-0 {
  background-color: var(--su-palette-color__purple--0);
}
.su-bg-purple-1 {
  background-color: var(--su-palette-color__purple--1);
}
.su-bg-purple-2 {
  background-color: var(--su-palette-color__purple--2);
}
.su-bg-purple-3 {
  background-color: var(--su-palette-color__purple--3);
}
.su-bg-purple-4 {
  background-color: var(--su-palette-color__purple--4);
}
.su-bg-purple-5 {
  background-color: var(--su-palette-color__purple--5);
}
.su-bg-purple-6 {
  background-color: var(--su-palette-color__purple--6);
}
.su-bg-purple-7 {
  background-color: var(--su-palette-color__purple--7);
}
.su-bg-purple-8 {
  background-color: var(--su-palette-color__purple--8);
}
.su-bg-purple-9 {
  background-color: var(--su-palette-color__purple--9);
}

.su-bg-magenta {
  background-color: var(--su-palette-color__magenta--4);
}
.su-bg-magenta-0 {
  background-color: var(--su-palette-color__magenta--0);
}
.su-bg-magenta-1 {
  background-color: var(--su-palette-color__magenta--1);
}
.su-bg-magenta-2 {
  background-color: var(--su-palette-color__magenta--2);
}
.su-bg-magenta-3 {
  background-color: var(--su-palette-color__magenta--3);
}
.su-bg-magenta-4 {
  background-color: var(--su-palette-color__magenta--4);
}
.su-bg-magenta-5 {
  background-color: var(--su-palette-color__magenta--5);
}
.su-bg-magenta-6 {
  background-color: var(--su-palette-color__magenta--6);
}
.su-bg-magenta-7 {
  background-color: var(--su-palette-color__magenta--7);
}
.su-bg-magenta-8 {
  background-color: var(--su-palette-color__magenta--8);
}
.su-bg-magenta-9 {
  background-color: var(--su-palette-color__magenta--9);
}

.su-bg-pink {
  background-color: var(--su-palette-color__pink--4);
}
.su-bg-pink-0 {
  background-color: var(--su-palette-color__pink--0);
}
.su-bg-pink-1 {
  background-color: var(--su-palette-color__pink--1);
}
.su-bg-pink-2 {
  background-color: var(--su-palette-color__pink--2);
}
.su-bg-pink-3 {
  background-color: var(--su-palette-color__pink--3);
}
.su-bg-pink-4 {
  background-color: var(--su-palette-color__pink--4);
}
.su-bg-pink-5 {
  background-color: var(--su-palette-color__pink--5);
}
.su-bg-pink-6 {
  background-color: var(--su-palette-color__pink--6);
}
.su-bg-pink-7 {
  background-color: var(--su-palette-color__pink--7);
}
.su-bg-pink-8 {
  background-color: var(--su-palette-color__pink--8);
}
.su-bg-pink-9 {
  background-color: var(--su-palette-color__pink--9);
}

.su-bg-pink-red {
  background-color: var(--su-palette-color__pink-red--4);
}
.su-bg-pink-red-0 {
  background-color: var(--su-palette-color__pink-red--0);
}
.su-bg-pink-red-1 {
  background-color: var(--su-palette-color__pink-red--1);
}
.su-bg-pink-red-2 {
  background-color: var(--su-palette-color__pink-red--2);
}
.su-bg-pink-red-3 {
  background-color: var(--su-palette-color__pink-red--3);
}
.su-bg-pink-red-4 {
  background-color: var(--su-palette-color__pink-red--4);
}
.su-bg-pink-red-5 {
  background-color: var(--su-palette-color__pink-red--5);
}
.su-bg-pink-red-6 {
  background-color: var(--su-palette-color__pink-red--6);
}
.su-bg-pink-red-7 {
  background-color: var(--su-palette-color__pink-red--7);
}
.su-bg-pink-red-8 {
  background-color: var(--su-palette-color__pink-red--8);
}
.su-bg-pink-red-9 {
  background-color: var(--su-palette-color__pink-red--9);
}

.su-bg-gray-cool {
  background-color: var(--su-gray-color__cool--4);
}
.su-bg-gray-cool-0 {
  background-color: var(--su-gray-color__cool--0);
}
.su-bg-gray-cool-1 {
  background-color: var(--su-gray-color__cool--1);
}
.su-bg-gray-cool-2 {
  background-color: var(--su-gray-color__cool--2);
}
.su-bg-gray-cool-3 {
  background-color: var(--su-gray-color__cool--3);
}
.su-bg-gray-cool-4 {
  background-color: var(--su-gray-color__cool--4);
}
.su-bg-gray-cool-5 {
  background-color: var(--su-gray-color__cool--5);
}
.su-bg-gray-cool-6 {
  background-color: var(--su-gray-color__cool--6);
}
.su-bg-gray-cool-7 {
  background-color: var(--su-gray-color__cool--7);
}
.su-bg-gray-cool-8 {
  background-color: var(--su-gray-color__cool--8);
}
.su-bg-gray-cool-9 {
  background-color: var(--su-gray-color__cool--9);
}

.su-bg-gray-warm {
  background-color: var(--su-gray-color__warm--4);
}
.su-bg-gray-warm-0 {
  background-color: var(--su-gray-color__warm--0);
}
.su-bg-gray-warm-1 {
  background-color: var(--su-gray-color__warm--1);
}
.su-bg-gray-warm-2 {
  background-color: var(--su-gray-color__warm--2);
}
.su-bg-gray-warm-3 {
  background-color: var(--su-gray-color__warm--3);
}
.su-bg-gray-warm-4 {
  background-color: var(--su-gray-color__warm--4);
}
.su-bg-gray-warm-5 {
  background-color: var(--su-gray-color__warm--5);
}
.su-bg-gray-warm-6 {
  background-color: var(--su-gray-color__warm--6);
}
.su-bg-gray-warm-7 {
  background-color: var(--su-gray-color__warm--7);
}
.su-bg-gray-warm-8 {
  background-color: var(--su-gray-color__warm--8);
}
.su-bg-gray-warm-9 {
  background-color: var(--su-gray-color__warm--9);
}

.su-bg-gray-mono {
  background-color: var(--su-gray-color__mono--4);
}
.su-bg-gray-mono-0 {
  background-color: var(--su-gray-color__mono--0);
}
.su-bg-gray-mono-1 {
  background-color: var(--su-gray-color__mono--1);
}
.su-bg-gray-mono-2 {
  background-color: var(--su-gray-color__mono--2);
}
.su-bg-gray-mono-3 {
  background-color: var(--su-gray-color__mono--3);
}
.su-bg-gray-mono-4 {
  background-color: var(--su-gray-color__mono--4);
}
.su-bg-gray-mono-5 {
  background-color: var(--su-gray-color__mono--5);
}
.su-bg-gray-mono-6 {
  background-color: var(--su-gray-color__mono--6);
}
.su-bg-gray-mono-7 {
  background-color: var(--su-gray-color__mono--7);
}
.su-bg-gray-mono-8 {
  background-color: var(--su-gray-color__mono--8);
}
.su-bg-gray-mono-9 {
  background-color: var(--su-gray-color__mono--9);
}

.su-bg-white {
  background-color: var(--su-color-white);
}

.su-bg-black {
  background-color: var(--su-color-black);
}

.su-bg-error {
  background-color: var(--su-status-color__error--4);
}
.su-bg-error-0 {
  background-color: var(--su-status-color__error--0);
}
.su-bg-error-1 {
  background-color: var(--su-status-color__error--1);
}
.su-bg-error-2 {
  background-color: var(--su-status-color__error--2);
}
.su-bg-error-3 {
  background-color: var(--su-status-color__error--3);
}
.su-bg-error-4 {
  background-color: var(--su-status-color__error--4);
}
.su-bg-error-5 {
  background-color: var(--su-status-color__error--5);
}
.su-bg-error-6 {
  background-color: var(--su-status-color__error--6);
}
.su-bg-error-7 {
  background-color: var(--su-status-color__error--7);
}
.su-bg-error-8 {
  background-color: var(--su-status-color__error--8);
}
.su-bg-error-9 {
  background-color: var(--su-status-color__error--9);
}

.su-bg-warning {
  background-color: var(--su-status-color__warning--4);
}
.su-bg-warning-0 {
  background-color: var(--su-status-color__warning--0);
}
.su-bg-warning-1 {
  background-color: var(--su-status-color__warning--1);
}
.su-bg-warning-2 {
  background-color: var(--su-status-color__warning--2);
}
.su-bg-warning-3 {
  background-color: var(--su-status-color__warning--3);
}
.su-bg-warning-4 {
  background-color: var(--su-status-color__warning--4);
}
.su-bg-warning-5 {
  background-color: var(--su-status-color__warning--5);
}
.su-bg-warning-6 {
  background-color: var(--su-status-color__warning--6);
}
.su-bg-warning-7 {
  background-color: var(--su-status-color__warning--7);
}
.su-bg-warning-8 {
  background-color: var(--su-status-color__warning--8);
}
.su-bg-warning-9 {
  background-color: var(--su-status-color__warning--9);
}

.su-bg-success {
  background-color: var(--su-status-color__success--4);
}
.su-bg-success-0 {
  background-color: var(--su-status-color__success--0);
}
.su-bg-success-1 {
  background-color: var(--su-status-color__success--1);
}
.su-bg-success-2 {
  background-color: var(--su-status-color__success--2);
}
.su-bg-success-3 {
  background-color: var(--su-status-color__success--3);
}
.su-bg-success-4 {
  background-color: var(--su-status-color__success--4);
}
.su-bg-success-5 {
  background-color: var(--su-status-color__success--5);
}
.su-bg-success-6 {
  background-color: var(--su-status-color__success--6);
}
.su-bg-success-7 {
  background-color: var(--su-status-color__success--7);
}
.su-bg-success-8 {
  background-color: var(--su-status-color__success--8);
}
.su-bg-success-9 {
  background-color: var(--su-status-color__success--9);
}

.su-bg-info {
  background-color: var(--su-status-color__info--4);
}
.su-bg-info-0 {
  background-color: var(--su-status-color__info--0);
}
.su-bg-info-1 {
  background-color: var(--su-status-color__info--1);
}
.su-bg-info-2 {
  background-color: var(--su-status-color__info--2);
}
.su-bg-info-3 {
  background-color: var(--su-status-color__info--3);
}
.su-bg-info-4 {
  background-color: var(--su-status-color__info--4);
}
.su-bg-info-5 {
  background-color: var(--su-status-color__info--5);
}
.su-bg-info-6 {
  background-color: var(--su-status-color__info--6);
}
.su-bg-info-7 {
  background-color: var(--su-status-color__info--7);
}
.su-bg-info-8 {
  background-color: var(--su-status-color__info--8);
}
.su-bg-info-9 {
  background-color: var(--su-status-color__info--9);
}

.su-bg-negative {
  background-color: var(--su-status-color__negative--4);
}
.su-bg-negative-0 {
  background-color: var(--su-status-color__negative--0);
}
.su-bg-negative-1 {
  background-color: var(--su-status-color__negative--1);
}
.su-bg-negative-2 {
  background-color: var(--su-status-color__negative--2);
}
.su-bg-negative-3 {
  background-color: var(--su-status-color__negative--3);
}
.su-bg-negative-4 {
  background-color: var(--su-status-color__negative--4);
}
.su-bg-negative-5 {
  background-color: var(--su-status-color__negative--5);
}
.su-bg-negative-6 {
  background-color: var(--su-status-color__negative--6);
}
.su-bg-negative-7 {
  background-color: var(--su-status-color__negative--7);
}
.su-bg-negative-8 {
  background-color: var(--su-status-color__negative--8);
}
.su-bg-negative-9 {
  background-color: var(--su-status-color__negative--9);
}

.su-bg-base {
  background-color: var(--su-theme-color__base--4);
}
.su-bg-base-0 {
  background-color: var(--su-theme-color__base--0);
}
.su-bg-base-1 {
  background-color: var(--su-theme-color__base--1);
}
.su-bg-base-2 {
  background-color: var(--su-theme-color__base--2);
}
.su-bg-base-3 {
  background-color: var(--su-theme-color__base--3);
}
.su-bg-base-4 {
  background-color: var(--su-theme-color__base--4);
}
.su-bg-base-5 {
  background-color: var(--su-theme-color__base--5);
}
.su-bg-base-6 {
  background-color: var(--su-theme-color__base--6);
}
.su-bg-base-7 {
  background-color: var(--su-theme-color__base--7);
}
.su-bg-base-8 {
  background-color: var(--su-theme-color__base--8);
}
.su-bg-base-9 {
  background-color: var(--su-theme-color__base--9);
}

.su-bg-primary {
  background-color: var(--su-theme-color__primary--4);
}
.su-bg-primary-0 {
  background-color: var(--su-theme-color__primary--0);
}
.su-bg-primary-1 {
  background-color: var(--su-theme-color__primary--1);
}
.su-bg-primary-2 {
  background-color: var(--su-theme-color__primary--2);
}
.su-bg-primary-3 {
  background-color: var(--su-theme-color__primary--3);
}
.su-bg-primary-4 {
  background-color: var(--su-theme-color__primary--4);
}
.su-bg-primary-5 {
  background-color: var(--su-theme-color__primary--5);
}
.su-bg-primary-6 {
  background-color: var(--su-theme-color__primary--6);
}
.su-bg-primary-7 {
  background-color: var(--su-theme-color__primary--7);
}
.su-bg-primary-8 {
  background-color: var(--su-theme-color__primary--8);
}
.su-bg-primary-9 {
  background-color: var(--su-theme-color__primary--9);
}

.su-bg-secondary {
  background-color: var(--su-theme-color__secondary--4);
}
.su-bg-secondary-0 {
  background-color: var(--su-theme-color__secondary--0);
}
.su-bg-secondary-1 {
  background-color: var(--su-theme-color__secondary--1);
}
.su-bg-secondary-2 {
  background-color: var(--su-theme-color__secondary--2);
}
.su-bg-secondary-3 {
  background-color: var(--su-theme-color__secondary--3);
}
.su-bg-secondary-4 {
  background-color: var(--su-theme-color__secondary--4);
}
.su-bg-secondary-5 {
  background-color: var(--su-theme-color__secondary--5);
}
.su-bg-secondary-6 {
  background-color: var(--su-theme-color__secondary--6);
}
.su-bg-secondary-7 {
  background-color: var(--su-theme-color__secondary--7);
}
.su-bg-secondary-8 {
  background-color: var(--su-theme-color__secondary--8);
}
.su-bg-secondary-9 {
  background-color: var(--su-theme-color__secondary--9);
}

.su-bg-accent {
  background-color: var(--su-theme-color__accent--4);
}
.su-bg-accent-0 {
  background-color: var(--su-theme-color__accent--0);
}
.su-bg-accent-1 {
  background-color: var(--su-theme-color__accent--1);
}
.su-bg-accent-2 {
  background-color: var(--su-theme-color__accent--2);
}
.su-bg-accent-3 {
  background-color: var(--su-theme-color__accent--3);
}
.su-bg-accent-4 {
  background-color: var(--su-theme-color__accent--4);
}
.su-bg-accent-5 {
  background-color: var(--su-theme-color__accent--5);
}
.su-bg-accent-6 {
  background-color: var(--su-theme-color__accent--6);
}
.su-bg-accent-7 {
  background-color: var(--su-theme-color__accent--7);
}
.su-bg-accent-8 {
  background-color: var(--su-theme-color__accent--8);
}
.su-bg-accent-9 {
  background-color: var(--su-theme-color__accent--9);
}

/* -------------------------------
 *  background settings
 * ---------------------------- */
.su-bg-cover {
  background-size: cover;
}

.su-bg-contain {
  background-size: contain;
}

.su-bg-repeat {
  background-repeat: repeat;
}

.su-bg-repeat-x {
  background-repeat: repeat-x;
}

.su-bg-repeat-y {
  background-repeat: repeat-y;
}

.su-bg-repeat-none {
  background-repeat: no-repeat;
}

.su-bg-position-left-top {
  background-position: left top;
}

.su-bg-position-left-center {
  background-position: left center;
}

.su-bg-position-left-bottom {
  background-position: left bottom;
}

.su-bg-position-center-top {
  background-position: center top;
}

.su-bg-position-center-center {
  background-position: center center;
}

.su-bg-position-center-bottom {
  background-position: center bottom;
}

.su-bg-position-right-top {
  background-position: right top;
}

.su-bg-position-right-center {
  background-position: right center;
}

.su-bg-position-right-bottom {
  background-position: right bottom;
}

.su-bg-fixed {
  background-attachment: fixed;
}

/* -------------------------------
 *  border
 * ---------------------------- */
* {
  border-width: 0;
}

.su-border,
.su-border-1,
.su-border-2,
.su-border-3,
.su-border-4,
.su-border-5 {
  border-style: solid;
}

.su-border {
  border-width: 1px;
}
.su-border-1 {
  border-width: 1px;
}
.su-border-2 {
  border-width: 2px;
}
.su-border-3 {
  border-width: 3px;
}
.su-border-4 {
  border-width: 4px;
}
.su-border-5 {
  border-width: 5px;
}

/* -------------------------------
 *  border top
 * ---------------------------- */
.su-border-t,
.su-border-t-1,
.su-border-t-2,
.su-border-t-3,
.su-border-t-4,
.su-border-t-5 {
  border-top-style: solid;
}

.su-border-t {
  border-top-width: 1px;
}
.su-border-t-1 {
  border-top-width: 1px;
}
.su-border-t-2 {
  border-top-width: 2px;
}
.su-border-t-3 {
  border-top-width: 3px;
}
.su-border-t-4 {
  border-top-width: 4px;
}
.su-border-t-5 {
  border-top-width: 5px;
}

/* -------------------------------
 *  border bottom
 * ---------------------------- */
.su-border-b,
.su-border-b-1,
.su-border-b-2,
.su-border-b-3,
.su-border-b-4,
.su-border-b-5 {
  border-bottom-style: solid;
}

.su-border-b {
  border-bottom-width: 1px;
}
.su-border-b-1 {
  border-bottom-width: 1px;
}
.su-border-b-2 {
  border-bottom-width: 2px;
}
.su-border-b-3 {
  border-bottom-width: 3px;
}
.su-border-b-4 {
  border-bottom-width: 4px;
}
.su-border-b-5 {
  border-bottom-width: 5px;
}

/* -------------------------------
 *  border left
 * ---------------------------- */
.su-border-l,
.su-border-l-1,
.su-border-l-2,
.su-border-l-3,
.su-border-l-4,
.su-border-l-5 {
  border-left-style: solid;
}

.su-border-l {
  border-left-width: 1px;
}
.su-border-l-1 {
  border-left-width: 1px;
}
.su-border-l-2 {
  border-left-width: 2px;
}
.su-border-l-3 {
  border-left-width: 3px;
}
.su-border-l-4 {
  border-left-width: 4px;
}
.su-border-l-5 {
  border-left-width: 5px;
}

/* -------------------------------
 *  border right
 * ---------------------------- */
.su-border-r,
.su-border-r-1,
.su-border-r-2,
.su-border-r-3,
.su-border-r-4,
.su-border-r-5 {
  border-right-style: solid;
}

.su-border-r {
  border-right-width: 1px;
}
.su-border-r-1 {
  border-right-width: 1px;
}
.su-border-r-2 {
  border-right-width: 2px;
}
.su-border-r-3 {
  border-right-width: 3px;
}
.su-border-r-4 {
  border-right-width: 4px;
}
.su-border-r-5 {
  border-right-width: 5px;
}

/* -------------------------------
 *  border style
 * ---------------------------- */
.su-border-solid {
  border-style: solid;
}

.su-border-dotted {
  border-style: dotted;
}

.su-border-dashed {
  border-style: dashed;
}

.su-border-double {
  border-style: dashed;
}

.su-border-none {
  border-style: none;
}

/* -------------------------------
 *  border color
 * ---------------------------- */
.su-border-red {
  border-color: var(--su-palette-color__red--4);
}
.su-border-red-pale {
  border-color: var(--su-palette-color__red--0);
}
.su-border-red-light {
  border-color: var(--su-palette-color__red--2);
}
.su-border-red-mid {
  border-color: var(--su-palette-color__red--6);
}
.su-border-red-dark {
  border-color: var(--su-palette-color__red--8);
}

.su-border-orange {
  border-color: var(--su-palette-color__orange--4);
}
.su-border-orange-pale {
  border-color: var(--su-palette-color__orange--0);
}
.su-border-orange-light {
  border-color: var(--su-palette-color__orange--2);
}
.su-border-orange-mid {
  border-color: var(--su-palette-color__orange--6);
}
.su-border-orange-dark {
  border-color: var(--su-palette-color__orange--8);
}

.su-border-orange-yellow {
  border-color: var(--su-palette-color__orange-yellow--4);
}
.su-border-orange-yellow-pale {
  border-color: var(--su-palette-color__orange-yellow--0);
}
.su-border-orange-yellow-light {
  border-color: var(--su-palette-color__orange-yellow--2);
}
.su-border-orange-yellow-mid {
  border-color: var(--su-palette-color__orange-yellow--6);
}
.su-border-orange-yellow-dark {
  border-color: var(--su-palette-color__orange-yellow--8);
}

.su-border-yellow {
  border-color: var(--su-palette-color__yellow--4);
}
.su-border-yellow-pale {
  border-color: var(--su-palette-color__yellow--0);
}
.su-border-yellow-light {
  border-color: var(--su-palette-color__yellow--2);
}
.su-border-yellow-mid {
  border-color: var(--su-palette-color__yellow--6);
}
.su-border-yellow-dark {
  border-color: var(--su-palette-color__yellow--8);
}

.su-border-yellow-green {
  border-color: var(--su-palette-color__yellow-green--4);
}
.su-border-yellow-green-pale {
  border-color: var(--su-palette-color__yellow-green--0);
}
.su-border-yellow-green-light {
  border-color: var(--su-palette-color__yellow-green--2);
}
.su-border-yellow-green-mid {
  border-color: var(--su-palette-color__yellow-green--6);
}
.su-border-yellow-green-dark {
  border-color: var(--su-palette-color__yellow-green--8);
}

.su-border-green {
  border-color: var(--su-palette-color__green--4);
}
.su-border-green-pale {
  border-color: var(--su-palette-color__green--0);
}
.su-border-green-light {
  border-color: var(--su-palette-color__green--2);
}
.su-border-green-mid {
  border-color: var(--su-palette-color__green--6);
}
.su-border-green-dark {
  border-color: var(--su-palette-color__green--8);
}

.su-border-teal {
  border-color: var(--su-palette-color__teal--4);
}
.su-border-teal-pale {
  border-color: var(--su-palette-color__teal--0);
}
.su-border-teal-light {
  border-color: var(--su-palette-color__teal--2);
}
.su-border-teal-mid {
  border-color: var(--su-palette-color__teal--6);
}
.su-border-teal-dark {
  border-color: var(--su-palette-color__teal--8);
}

.su-border-cyan {
  border-color: var(--su-palette-color__cyan--4);
}
.su-border-cyan-pale {
  border-color: var(--su-palette-color__cyan--0);
}
.su-border-cyan-light {
  border-color: var(--su-palette-color__cyan--2);
}
.su-border-cyan-mid {
  border-color: var(--su-palette-color__cyan--6);
}
.su-border-cyan-dark {
  border-color: var(--su-palette-color__cyan--8);
}

.su-border-light-blue {
  border-color: var(--su-palette-color__light-blue--4);
}
.su-border-light-blue-pale {
  border-color: var(--su-palette-color__light-blue--0);
}
.su-border-light-blue-light {
  border-color: var(--su-palette-color__light-blue--2);
}
.su-border-light-blue-mid {
  border-color: var(--su-palette-color__light-blue--6);
}
.su-border-light-blue-dark {
  border-color: var(--su-palette-color__light-blue--8);
}

.su-border-blue {
  border-color: var(--su-palette-color__blue--4);
}
.su-border-blue-pale {
  border-color: var(--su-palette-color__blue--0);
}
.su-border-blue-light {
  border-color: var(--su-palette-color__blue--2);
}
.su-border-blue-mid {
  border-color: var(--su-palette-color__blue--6);
}
.su-border-blue-dark {
  border-color: var(--su-palette-color__blue--8);
}

.su-border-blue-violet {
  border-color: var(--su-palette-color__blue-violet--4);
}
.su-border-blue-violet-pale {
  border-color: var(--su-palette-color__blue-violet--0);
}
.su-border-blue-violet-light {
  border-color: var(--su-palette-color__blue-violet--2);
}
.su-border-blue-violet-mid {
  border-color: var(--su-palette-color__blue-violet--6);
}
.su-border-blue-violet-dark {
  border-color: var(--su-palette-color__blue-violet--8);
}

.su-border-violet {
  border-color: var(--su-palette-color__violet--4);
}
.su-border-violet-pale {
  border-color: var(--su-palette-color__violet--0);
}
.su-border-violet-light {
  border-color: var(--su-palette-color__violet--2);
}
.su-border-violet-mid {
  border-color: var(--su-palette-color__violet--6);
}
.su-border-violet-dark {
  border-color: var(--su-palette-color__violet--8);
}

.su-border-purple {
  border-color: var(--su-palette-color__purple--4);
}
.su-border-purple-pale {
  border-color: var(--su-palette-color__purple--0);
}
.su-border-purple-light {
  border-color: var(--su-palette-color__purple--2);
}
.su-border-purple-mid {
  border-color: var(--su-palette-color__purple--6);
}
.su-border-purple-dark {
  border-color: var(--su-palette-color__purple--8);
}

.su-border-magenta {
  border-color: var(--su-palette-color__magenta--4);
}
.su-border-magenta-pale {
  border-color: var(--su-palette-color__magenta--0);
}
.su-border-magenta-light {
  border-color: var(--su-palette-color__magenta--2);
}
.su-border-magenta-mid {
  border-color: var(--su-palette-color__magenta--6);
}
.su-border-magenta-dark {
  border-color: var(--su-palette-color__magenta--8);
}

.su-border-pink {
  border-color: var(--su-palette-color__pink--4);
}
.su-border-pink-pale {
  border-color: var(--su-palette-color__pink--0);
}
.su-border-pink-light {
  border-color: var(--su-palette-color__pink--2);
}
.su-border-pink-mid {
  border-color: var(--su-palette-color__pink--6);
}
.su-border-pink-dark {
  border-color: var(--su-palette-color__pink--8);
}

.su-border-pink-red {
  border-color: var(--su-palette-color__pink-red--4);
}
.su-border-pink-red-pale {
  border-color: var(--su-palette-color__pink-red--0);
}
.su-border-pink-red-light {
  border-color: var(--su-palette-color__pink-red--2);
}
.su-border-pink-red-mid {
  border-color: var(--su-palette-color__pink-red--6);
}
.su-border-pink-red-dark {
  border-color: var(--su-palette-color__pink-red--8);
}

.su-border-gray-cool {
  border-color: var(--su-gray-color__cool--4);
}
.su-border-gray-cool-pale {
  border-color: var(--su-gray-color__cool--0);
}
.su-border-gray-cool-light {
  border-color: var(--su-gray-color__cool--2);
}
.su-border-gray-cool-mid {
  border-color: var(--su-gray-color__cool--6);
}
.su-border-gray-cool-dark {
  border-color: var(--su-gray-color__cool--8);
}

.su-border-gray-warm {
  border-color: var(--su-gray-color__warm--4);
}
.su-border-gray-warm-pale {
  border-color: var(--su-gray-color__warm--0);
}
.su-border-gray-warm-light {
  border-color: var(--su-gray-color__warm--2);
}
.su-border-gray-warm-mid {
  border-color: var(--su-gray-color__warm--6);
}
.su-border-gray-warm-dark {
  border-color: var(--su-gray-color__warm--8);
}

.su-border-gray-mono {
  border-color: var(--su-gray-color__mono--4);
}
.su-border-gray-mono-pale {
  border-color: var(--su-gray-color__mono--0);
}
.su-border-gray-mono-light {
  border-color: var(--su-gray-color__mono--2);
}
.su-border-gray-mono-mid {
  border-color: var(--su-gray-color__mono--6);
}
.su-border-gray-mono-dark {
  border-color: var(--su-gray-color__mono--8);
}

.su-border-black {
  border-color: var(--su-color-black);
}

.su-border-white {
  border-color: var(--su-color-white);
}

.su-border-error {
  border-color: var(--su-status-color__error--4);
}
.su-border-error-pale {
  border-color: var(--su-status-color__error--0);
}
.su-border-error-light {
  border-color: var(--su-status-color__error--2);
}
.su-border-error-mid {
  border-color: var(--su-status-color__error--6);
}
.su-border-error-dark {
  border-color: var(--su-status-color__error--8);
}

.su-border-warning {
  border-color: var(--su-status-color__warning--4);
}
.su-border-warning-pale {
  border-color: var(--su-status-color__warning--0);
}
.su-border-warning-light {
  border-color: var(--su-status-color__warning--2);
}
.su-border-warning-mid {
  border-color: var(--su-status-color__warning--6);
}
.su-border-warning-dark {
  border-color: var(--su-status-color__warning--8);
}

.su-border-success {
  border-color: var(--su-status-color__success--4);
}
.su-border-success-pale {
  border-color: var(--su-status-color__success--0);
}
.su-border-success-light {
  border-color: var(--su-status-color__success--2);
}
.su-border-success-mid {
  border-color: var(--su-status-color__success--6);
}
.su-border-success-dark {
  border-color: var(--su-status-color__success--8);
}

.su-border-info {
  border-color: var(--su-status-color__info--4);
}
.su-border-info-pale {
  border-color: var(--su-status-color__info--0);
}
.su-border-info-light {
  border-color: var(--su-status-color__info--2);
}
.su-border-info-mid {
  border-color: var(--su-status-color__info--6);
}
.su-border-info-dark {
  border-color: var(--su-status-color__info--8);
}

.su-border-negative {
  border-color: var(--su-status-color__negative--4);
}
.su-border-negative-pale {
  border-color: var(--su-status-color__negative--0);
}
.su-border-negative-light {
  border-color: var(--su-status-color__negative--2);
}
.su-border-negative-mid {
  border-color: var(--su-status-color__negative--6);
}
.su-border-negative-dark {
  border-color: var(--su-status-color__negative--8);
}

.su-border-base {
  border-color: var(--su-theme-color__base--4);
}
.su-border-base-pale {
  border-color: var(--su-theme-color__base--0);
}
.su-border-base-light {
  border-color: var(--su-theme-color__base--2);
}
.su-border-base-mid {
  border-color: var(--su-theme-color__base--6);
}
.su-border-base-dark {
  border-color: var(--su-theme-color__base--8);
}

.su-border-primary {
  border-color: var(--su-theme-color__primary--4);
}
.su-border-primary-pale {
  border-color: var(--su-theme-color__primary--0);
}
.su-border-primary-light {
  border-color: var(--su-theme-color__primary--2);
}
.su-border-primary-mid {
  border-color: var(--su-theme-color__primary--6);
}
.su-border-primary-dark {
  border-color: var(--su-theme-color__primary--8);
}

.su-border-secondary {
  border-color: var(--su-theme-color__secondary--4);
}
.su-border-secondary-pale {
  border-color: var(--su-theme-color__secondary--0);
}
.su-border-secondary-light {
  border-color: var(--su-theme-color__secondary--2);
}
.su-border-secondary-mid {
  border-color: var(--su-theme-color__secondary--6);
}
.su-border-secondary-dark {
  border-color: var(--su-theme-color__secondary--8);
}

.su-border-accent {
  border-color: var(--su-theme-color__accent--4);
}
.su-border-accent-pale {
  border-color: var(--su-theme-color__accent--0);
}
.su-border-accent-light {
  border-color: var(--su-theme-color__accent--2);
}
.su-border-accent-mid {
  border-color: var(--su-theme-color__accent--6);
}
.su-border-accent-dark {
  border-color: var(--su-theme-color__accent--8);
}

/* -------------------------------
 *  corner round
 * ---------------------------- */
.su-corner-square {
  border-radius: 0;
}

.su-corner-rounded,
.su-corner-rounded-r {
  border-radius: var(--su-size-r);
}
.su-corner-rounded-upper,
.su-corner-rounded-r-upper {
  border-radius: var(--su-size-r) var(--su-size-r) 0 0;
}
.su-corner-rounded-lower,
.su-corner-rounded-r-lower {
  border-radius: 0 0 var(--su-size-r) var(--su-size-r);
}
.su-corner-rounded-left,
.su-corner-rounded-r-left {
  border-radius: var(--su-size-r) 0 0 var(--su-size-r);
}
.su-corner-rounded-right,
.su-corner-rounded-r-right {
  border-radius: 0 var(--su-size-r) var(--su-size-r) 0;
}
.su-corner-rounded-upper-left,
.su-corner-rounded-r-upper-left {
  border-radius: var(--su-size-r) 0 0 0;
}
.su-corner-rounded-upper-right,
.su-corner-rounded-r-upper-right {
  border-radius: 0 var(--su-size-r) 0 0;
}
.su-corner-rounded-lower-left,
.su-corner-rounded-r-lower-left {
  border-radius: 0 0 0 var(--su-size-r);
}
.su-corner-rounded-lower-right,
.su-corner-rounded-r-lower-right {
  border-radius: 0 0 var(--su-size-r) 0;
}

.su-corner-rounded-5s {
  border-radius: var(--su-size-5s);
}
.su-corner-rounded-5s-upper {
  border-radius: var(--su-size-5s) var(--su-size-5s) 0 0;
}
.su-corner-rounded-5s-lower {
  border-radius: 0 0 var(--su-size-5s) var(--su-size-5s);
}
.su-corner-rounded-5s-left {
  border-radius: var(--su-size-5s) 0 0 var(--su-size-5s);
}
.su-corner-rounded-5s-right {
  border-radius: 0 var(--su-size-5s) var(--su-size-5s) 0;
}
.su-corner-rounded-5s-upper-left {
  border-radius: var(--su-size-5s) 0 0 0;
}
.su-corner-rounded-5s-upper-right {
  border-radius: 0 var(--su-size-5s) 0 0;
}
.su-corner-rounded-5s-lower-left {
  border-radius: 0 0 0 var(--su-size-5s);
}
.su-corner-rounded-5s-lower-right {
  border-radius: 0 0 var(--su-size-5s) 0;
}

.su-corner-rounded-4s {
  border-radius: var(--su-size-4s);
}
.su-corner-rounded-4s-upper {
  border-radius: var(--su-size-4s) var(--su-size-4s) 0 0;
}
.su-corner-rounded-4s-lower {
  border-radius: 0 0 var(--su-size-4s) var(--su-size-4s);
}
.su-corner-rounded-4s-left {
  border-radius: var(--su-size-4s) 0 0 var(--su-size-4s);
}
.su-corner-rounded-4s-right {
  border-radius: 0 var(--su-size-4s) var(--su-size-4s) 0;
}
.su-corner-rounded-4s-upper-left {
  border-radius: var(--su-size-4s) 0 0 0;
}
.su-corner-rounded-4s-upper-right {
  border-radius: 0 var(--su-size-4s) 0 0;
}
.su-corner-rounded-4s-lower-left {
  border-radius: 0 0 0 var(--su-size-4s);
}
.su-corner-rounded-4s-lower-right {
  border-radius: 0 0 var(--su-size-4s) 0;
}

.su-corner-rounded-3s {
  border-radius: var(--su-size-3s);
}
.su-corner-rounded-3s-upper {
  border-radius: var(--su-size-3s) var(--su-size-3s) 0 0;
}
.su-corner-rounded-3s-lower {
  border-radius: 0 0 var(--su-size-3s) var(--su-size-3s);
}
.su-corner-rounded-3s-left {
  border-radius: var(--su-size-3s) 0 0 var(--su-size-3s);
}
.su-corner-rounded-3s-right {
  border-radius: 0 var(--su-size-3s) var(--su-size-3s) 0;
}
.su-corner-rounded-3s-upper-left {
  border-radius: var(--su-size-3s) 0 0 0;
}
.su-corner-rounded-3s-upper-right {
  border-radius: 0 var(--su-size-3s) 0 0;
}
.su-corner-rounded-3s-lower-left {
  border-radius: 0 0 0 var(--su-size-3s);
}
.su-corner-rounded-3s-lower-right {
  border-radius: 0 0 var(--su-size-3s) 0;
}

.su-corner-rounded-2s {
  border-radius: var(--su-size-2s);
}
.su-corner-rounded-2s-upper {
  border-radius: var(--su-size-2s) var(--su-size-2s) 0 0;
}
.su-corner-rounded-2s-lower {
  border-radius: 0 0 var(--su-size-2s) var(--su-size-2s);
}
.su-corner-rounded-2s-left {
  border-radius: var(--su-size-2s) 0 0 var(--su-size-2s);
}
.su-corner-rounded-2s-right {
  border-radius: 0 var(--su-size-2s) var(--su-size-2s) 0;
}
.su-corner-rounded-2s-upper-left {
  border-radius: var(--su-size-2s) 0 0 0;
}
.su-corner-rounded-2s-upper-right {
  border-radius: 0 var(--su-size-2s) 0 0;
}
.su-corner-rounded-2s-lower-left {
  border-radius: 0 0 0 var(--su-size-2s);
}
.su-corner-rounded-2s-lower-right {
  border-radius: 0 0 var(--su-size-2s) 0;
}

.su-corner-rounded-s {
  border-radius: var(--su-size-s);
}
.su-corner-rounded-s-upper {
  border-radius: var(--su-size-s) var(--su-size-s) 0 0;
}
.su-corner-rounded-s-lower {
  border-radius: 0 0 var(--su-size-s) var(--su-size-s);
}
.su-corner-rounded-s-left {
  border-radius: var(--su-size-s) 0 0 var(--su-size-s);
}
.su-corner-rounded-s-right {
  border-radius: 0 var(--su-size-s) var(--su-size-s) 0;
}
.su-corner-rounded-s-upper-left {
  border-radius: var(--su-size-s) 0 0 0;
}
.su-corner-rounded-s-upper-right {
  border-radius: 0 var(--su-size-s) 0 0;
}
.su-corner-rounded-s-lower-left {
  border-radius: 0 0 0 var(--su-size-s);
}
.su-corner-rounded-s-lower-right {
  border-radius: 0 0 var(--su-size-s) 0;
}

.su-corner-rounded-m {
  border-radius: var(--su-size-m);
}
.su-corner-rounded-m-upper {
  border-radius: var(--su-size-m) var(--su-size-m) 0 0;
}
.su-corner-rounded-m-lower {
  border-radius: 0 0 var(--su-size-m) var(--su-size-m);
}
.su-corner-rounded-m-left {
  border-radius: var(--su-size-m) 0 0 var(--su-size-m);
}
.su-corner-rounded-m-right {
  border-radius: 0 var(--su-size-m) var(--su-size-m) 0;
}
.su-corner-rounded-m-upper-left {
  border-radius: var(--su-size-m) 0 0 0;
}
.su-corner-rounded-m-upper-right {
  border-radius: 0 var(--su-size-m) 0 0;
}
.su-corner-rounded-m-lower-left {
  border-radius: 0 0 0 var(--su-size-m);
}
.su-corner-rounded-m-lower-right {
  border-radius: 0 0 var(--su-size-m) 0;
}

.su-corner-rounded-l {
  border-radius: var(--su-size-l);
}
.su-corner-rounded-l-upper {
  border-radius: var(--su-size-l) var(--su-size-l) 0 0;
}
.su-corner-rounded-l-lower {
  border-radius: 0 0 var(--su-size-l) var(--su-size-l);
}
.su-corner-rounded-l-left {
  border-radius: var(--su-size-l) 0 0 var(--su-size-l);
}
.su-corner-rounded-l-right {
  border-radius: 0 var(--su-size-l) var(--su-size-l) 0;
}
.su-corner-rounded-l-upper-left {
  border-radius: var(--su-size-l) 0 0 0;
}
.su-corner-rounded-l-upper-right {
  border-radius: 0 var(--su-size-l) 0 0;
}
.su-corner-rounded-l-lower-left {
  border-radius: 0 0 0 var(--su-size-l);
}
.su-corner-rounded-l-lower-right {
  border-radius: 0 0 var(--su-size-l) 0;
}

.su-corner-rounded-2l {
  border-radius: var(--su-size-2l);
}
.su-corner-rounded-2l-upper {
  border-radius: var(--su-size-2l) var(--su-size-2l) 0 0;
}
.su-corner-rounded-2l-lower {
  border-radius: 0 0 var(--su-size-2l) var(--su-size-2l);
}
.su-corner-rounded-2l-left {
  border-radius: var(--su-size-2l) 0 0 var(--su-size-2l);
}
.su-corner-rounded-2l-right {
  border-radius: 0 var(--su-size-2l) var(--su-size-2l) 0;
}
.su-corner-rounded-2l-upper-left {
  border-radius: var(--su-size-2l) 0 0 0;
}
.su-corner-rounded-2l-upper-right {
  border-radius: 0 var(--su-size-2l) 0 0;
}
.su-corner-rounded-2l-lower-left {
  border-radius: 0 0 0 var(--su-size-2l);
}
.su-corner-rounded-2l-lower-right {
  border-radius: 0 0 var(--su-size-2l) 0;
}

.su-corner-rounded-3l {
  border-radius: var(--su-size-3l);
}
.su-corner-rounded-3l-upper {
  border-radius: var(--su-size-3l) var(--su-size-3l) 0 0;
}
.su-corner-rounded-3l-lower {
  border-radius: 0 0 var(--su-size-3l) var(--su-size-3l);
}
.su-corner-rounded-3l-left {
  border-radius: var(--su-size-3l) 0 0 var(--su-size-3l);
}
.su-corner-rounded-3l-right {
  border-radius: 0 var(--su-size-3l) var(--su-size-3l) 0;
}
.su-corner-rounded-3l-upper-left {
  border-radius: var(--su-size-3l) 0 0 0;
}
.su-corner-rounded-3l-upper-right {
  border-radius: 0 var(--su-size-3l) 0 0;
}
.su-corner-rounded-3l-lower-left {
  border-radius: 0 0 0 var(--su-size-3l);
}
.su-corner-rounded-3l-lower-right {
  border-radius: 0 0 var(--su-size-3l) 0;
}

.su-corner-rounded-4l {
  border-radius: var(--su-size-4l);
}
.su-corner-rounded-4l-upper {
  border-radius: var(--su-size-4l) var(--su-size-4l) 0 0;
}
.su-corner-rounded-4l-lower {
  border-radius: 0 0 var(--su-size-4l) var(--su-size-4l);
}
.su-corner-rounded-4l-left {
  border-radius: var(--su-size-4l) 0 0 var(--su-size-4l);
}
.su-corner-rounded-4l-right {
  border-radius: 0 var(--su-size-4l) var(--su-size-4l) 0;
}
.su-corner-rounded-4l-upper-left {
  border-radius: var(--su-size-4l) 0 0 0;
}
.su-corner-rounded-4l-upper-right {
  border-radius: 0 var(--su-size-4l) 0 0;
}
.su-corner-rounded-4l-lower-left {
  border-radius: 0 0 0 var(--su-size-4l);
}
.su-corner-rounded-4l-lower-right {
  border-radius: 0 0 var(--su-size-4l) 0;
}

.su-corner-rounded-5l {
  border-radius: var(--su-size-5l);
}
.su-corner-rounded-5l-upper {
  border-radius: var(--su-size-5l) var(--su-size-5l) 0 0;
}
.su-corner-rounded-5l-lower {
  border-radius: 0 0 var(--su-size-5l) var(--su-size-5l);
}
.su-corner-rounded-5l-left {
  border-radius: var(--su-size-5l) 0 0 var(--su-size-5l);
}
.su-corner-rounded-5l-right {
  border-radius: 0 var(--su-size-5l) var(--su-size-5l) 0;
}
.su-corner-rounded-5l-upper-left {
  border-radius: var(--su-size-5l) 0 0 0;
}
.su-corner-rounded-5l-upper-right {
  border-radius: 0 var(--su-size-5l) 0 0;
}
.su-corner-rounded-5l-lower-left {
  border-radius: 0 0 0 var(--su-size-5l);
}
.su-corner-rounded-5l-lower-right {
  border-radius: 0 0 var(--su-size-5l) 0;
}

.su-corner-circle {
  border-radius: 50%;
}

.su-corner-pill {
  border-radius: 99em;
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  display
 * ---------------------------- */
.su-inline {
  display: inline;
}
@media (width <= 768px) {
  .su-inline--mobile {
    display: inline;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-inline--desktop {
    display: inline;
  }
}

.su-inline-block {
  display: inline-block;
}
@media (width <= 768px) {
  .su-inline-block--mobile {
    display: inline-block;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-inline-block--desktop {
    display: inline-block;
  }
}

.su-block {
  display: block;
}
@media (width <= 768px) {
  .su-block--mobile {
    display: block;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-block--desktop {
    display: block;
  }
}

.su-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (width <= 768px) {
  .su-flex--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.su-inline-flex {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
@media (width <= 768px) {
  .su-inline-flex--mobile {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-inline-flex--desktop {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
}

.su-grid {
  display: -ms-grid;
  display: grid;
}
@media (width <= 768px) {
  .su-grid--mobile {
    display: -ms-grid;
    display: grid;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-grid--desktop {
    display: -ms-grid;
    display: grid;
  }
}

.su-none {
  display: none;
}
@media (width <= 768px) {
  .su-none--mobile {
    display: none;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-none--desktop {
    display: none;
  }
}

/* -------------------------------
 *  visibility
 * ---------------------------- */
.su-visible {
  visibility: visible;
}

.su-hidden {
  visibility: hidden;
}

/* -------------------------------
 *  opacity
 * ---------------------------- */
.su-opacity-0 {
  opacity: 0;
}

.su-opacity-10 {
  opacity: 0.1;
}

.su-opacity-20 {
  opacity: 0.2;
}

.su-opacity-30 {
  opacity: 0.3;
}

.su-opacity-40 {
  opacity: 0.4;
}

.su-opacity-50 {
  opacity: 0.5;
}

.su-opacity-60 {
  opacity: 0.6;
}

.su-opacity-70 {
  opacity: 0.7;
}

.su-opacity-80 {
  opacity: 0.8;
}

.su-opacity-90 {
  opacity: 0.9;
}

.su-opacity-100 {
  opacity: 1;
}

/* -------------------------------
 *  overflow
 * ---------------------------- */
.su-overflow-visible {
  overflow: visible;
}

.su-overflow-hidden {
  overflow: hidden;
}

.su-overflow-clip {
  overflow: clip;
}

.su-overflow-scroll {
  overflow: scroll;
}

.su-overflow-auto {
  overflow: scroll;
}

/* -------------------------------
 *  filter
 * ---------------------------- */
/* -------------------------------
 *  background filter
 * ---------------------------- */
.su-filter-bg-blur {
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  flexbox
 * ---------------------------- */
.su-flex-start-start,
.su-flex-start-center,
.su-flex-start-end,
.su-flex-start-stretch,
.su-flex-start-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
@media (width <= 768px) {
  .su-flex-start-start--mobile,
  .su-flex-start-center--mobile,
  .su-flex-start-end--mobile,
  .su-flex-start-stretch--mobile,
  .su-flex-start-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-start--desktop,
  .su-flex-start-center--desktop,
  .su-flex-start-end--desktop,
  .su-flex-start-stretch--desktop,
  .su-flex-start-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}

.su-flex-center-start,
.su-flex-center-center,
.su-flex-center-end,
.su-flex-center-stretch,
.su-flex-center-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (width <= 768px) {
  .su-flex-center-start--mobile,
  .su-flex-center-center--mobile,
  .su-flex-center-end--mobile,
  .su-flex-center-stretch--mobile,
  .su-flex-center-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-center-start--desktop,
  .su-flex-center-center--desktop,
  .su-flex-center-end--desktop,
  .su-flex-center-stretch--desktop,
  .su-flex-center-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.su-flex-end-start,
.su-flex-end-center,
.su-flex-end-end,
.su-flex-end-stretch,
.su-flex-end-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media (width <= 768px) {
  .su-flex-end-start--mobile,
  .su-flex-end-center--mobile,
  .su-flex-end-end--mobile,
  .su-flex-end-stretch--mobile,
  .su-flex-end-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-end-start--desktop,
  .su-flex-end-center--desktop,
  .su-flex-end-end--desktop,
  .su-flex-end-stretch--desktop,
  .su-flex-end-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}

.su-flex-between-start,
.su-flex-between-center,
.su-flex-between-end,
.su-flex-between-stretch,
.su-flex-between-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (width <= 768px) {
  .su-flex-between-start--mobile,
  .su-flex-between-center--mobile,
  .su-flex-between-end--mobile,
  .su-flex-between-stretch--mobile,
  .su-flex-between-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-between-start--desktop,
  .su-flex-between-center--desktop,
  .su-flex-between-end--desktop,
  .su-flex-between-stretch--desktop,
  .su-flex-between-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.su-flex-around-start,
.su-flex-around-center,
.su-flex-around-end,
.su-flex-around-stretch,
.su-flex-around-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
@media (width <= 768px) {
  .su-flex-around-start--mobile,
  .su-flex-around-center--mobile,
  .su-flex-around-end--mobile,
  .su-flex-around-stretch--mobile,
  .su-flex-around-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-around-start--desktop,
  .su-flex-around-center--desktop,
  .su-flex-around-end--desktop,
  .su-flex-around-stretch--desktop,
  .su-flex-around-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
  }
}

.su-flex-evenly-start,
.su-flex-evenly-center,
.su-flex-evenly-end,
.su-flex-evenly-stretch,
.su-flex-evenly-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}
@media (width <= 768px) {
  .su-flex-evenly-start--mobile,
  .su-flex-evenly-center--mobile,
  .su-flex-evenly-end--mobile,
  .su-flex-evenly-stretch--mobile,
  .su-flex-evenly-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-evenly-start--desktop,
  .su-flex-evenly-center--desktop,
  .su-flex-evenly-end--desktop,
  .su-flex-evenly-stretch--desktop,
  .su-flex-evenly-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
  }
}

.su-flex-start-start,
.su-flex-center-start,
.su-flex-end-start,
.su-flex-between-start,
.su-flex-around-start,
.su-flex-evenly-start {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media (width <= 768px) {
  .su-flex-start-start--mobile,
  .su-flex-center-start--mobile,
  .su-flex-end-start--mobile,
  .su-flex-between-start--mobile,
  .su-flex-around-start--mobile,
  .su-flex-evenly-start--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-start--desktop,
  .su-flex-center-start--desktop,
  .su-flex-end-start--desktop,
  .su-flex-between-start--desktop,
  .su-flex-around-start--desktop,
  .su-flex-evenly-start--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

.su-flex-start-center,
.su-flex-center-center,
.su-flex-end-center,
.su-flex-between-center,
.su-flex-around-center,
.su-flex-evenly-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (width <= 768px) {
  .su-flex-start-center--mobile,
  .su-flex-center-center--mobile,
  .su-flex-end-center--mobile,
  .su-flex-between-center--mobile,
  .su-flex-around-center--mobile,
  .su-flex-evenly-center--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-center--desktop,
  .su-flex-center-center--desktop,
  .su-flex-end-center--desktop,
  .su-flex-between-center--desktop,
  .su-flex-around-center--desktop,
  .su-flex-evenly-center--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.su-flex-start-end,
.su-flex-center-end,
.su-flex-end-end,
.su-flex-between-end,
.su-flex-around-end,
.su-flex-evenly-end {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media (width <= 768px) {
  .su-flex-start-end--mobile,
  .su-flex-center-end--mobile,
  .su-flex-end-end--mobile,
  .su-flex-between-end--mobile,
  .su-flex-around-end--mobile,
  .su-flex-evenly-end--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-end--desktop,
  .su-flex-center-end--desktop,
  .su-flex-end-end--desktop,
  .su-flex-between-end--desktop,
  .su-flex-around-end--desktop,
  .su-flex-evenly-end--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
}

.su-flex-start-stretch,
.su-flex-center-stretch,
.su-flex-end-stretch,
.su-flex-between-stretch,
.su-flex-around-stretch,
.su-flex-evenly-stretch {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
@media (width <= 768px) {
  .su-flex-start-stretch--mobile,
  .su-flex-center-stretch--mobile,
  .su-flex-end-stretch--mobile,
  .su-flex-between-stretch--mobile,
  .su-flex-around-stretch--mobile,
  .su-flex-evenly-stretch--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-stretch--desktop,
  .su-flex-center-stretch--desktop,
  .su-flex-end-stretch--desktop,
  .su-flex-between-stretch--desktop,
  .su-flex-around-stretch--desktop,
  .su-flex-evenly-stretch--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}

.su-flex-start-baseline,
.su-flex-center-baseline,
.su-flex-end-baseline,
.su-flex-between-baseline,
.su-flex-around-baseline,
.su-flex-evenly-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
@media (width <= 768px) {
  .su-flex-start-baseline--mobile,
  .su-flex-center-baseline--mobile,
  .su-flex-end-baseline--mobile,
  .su-flex-between-baseline--mobile,
  .su-flex-around-baseline--mobile,
  .su-flex-evenly-baseline--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-start-baseline--desktop,
  .su-flex-center-baseline--desktop,
  .su-flex-end-baseline--desktop,
  .su-flex-between-baseline--desktop,
  .su-flex-around-baseline--desktop,
  .su-flex-evenly-baseline--desktop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}

.su-flex-wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.su-flex-row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media (width <= 768px) {
  .su-flex-row--mobile {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-row--desktop {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}

.su-flex-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media (width <= 768px) {
  .su-flex-column--mobile {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-column--desktop {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.su-flex-row-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media (width <= 768px) {
  .su-flex-row-reverse--mobile {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-row-reverse--desktop {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
}

.su-flex-column-reverse {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}
@media (width <= 768px) {
  .su-flex-column-reverse--mobile {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
@media (calc(768px + 1px) <= width) {
  .su-flex-column-reverse--desktop {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}

.su-flex-grow-1 {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.su-flex-grow-0 {
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
}

.su-flex-shrink-1 {
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.su-flex-shrink-0 {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.su-flex-basis-0 {
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
}

/* -------------------------------
 *  float
 * ---------------------------- */
.su-float-left {
  float: left;
}

.su-float-right {
  float: right;
}

.su-float-none {
  float: none;
}

.su-float-clear {
  clear: both;
}

/* -------------------------------
 *  clearfix
 * ---------------------------- */
.su-clearfix::after {
  content: "";
  clear: both;
  display: block;
}

/* -------------------------------
 *  gap
 * ---------------------------- */
.su-gp-0 {
  gap: 0;
}

.su-gp-6s {
  gap: var(--su-size-6s);
}

.su-gp-5s {
  gap: var(--su-size-5s);
}

.su-gp-4s {
  gap: var(--su-size-4s);
}

.su-gp-3s {
  gap: var(--su-size-3s);
}

.su-gp-2s {
  gap: var(--su-size-2s);
}

.su-gp-s {
  gap: var(--su-size-s);
}

.su-gp-r {
  gap: var(--su-size-r);
}

.su-gp-m {
  gap: var(--su-size-m);
}

.su-gp-l {
  gap: var(--su-size-l);
}

.su-gp-2l {
  gap: var(--su-size-2l);
}

.su-gp-3l {
  gap: var(--su-size-3l);
}

.su-gp-4l {
  gap: var(--su-size-4l);
}

.su-gp-5l {
  gap: var(--su-size-5l);
}

.su-gp-6l {
  gap: var(--su-size-6l);
}

.su-gp-7l {
  gap: var(--su-size-7l);
}

.su-gp-8l {
  gap: var(--su-size-8l);
}

.su-gp-9l {
  gap: var(--su-size-9l);
}

.su-gp-10l {
  gap: var(--su-size-10l);
}

/* -------------------------------
 *  gap column
 * ---------------------------- */
.su-gpc-0 {
  -webkit-column-gap: 0;
     -moz-column-gap: 0;
          column-gap: 0;
}

.su-gpc-6s {
  -webkit-column-gap: var(--su-size-6s);
     -moz-column-gap: var(--su-size-6s);
          column-gap: var(--su-size-6s);
}

.su-gpc-5s {
  -webkit-column-gap: var(--su-size-5s);
     -moz-column-gap: var(--su-size-5s);
          column-gap: var(--su-size-5s);
}

.su-gpc-4s {
  -webkit-column-gap: var(--su-size-4s);
     -moz-column-gap: var(--su-size-4s);
          column-gap: var(--su-size-4s);
}

.su-gpc-3s {
  -webkit-column-gap: var(--su-size-3s);
     -moz-column-gap: var(--su-size-3s);
          column-gap: var(--su-size-3s);
}

.su-gpc-2s {
  -webkit-column-gap: var(--su-size-2s);
     -moz-column-gap: var(--su-size-2s);
          column-gap: var(--su-size-2s);
}

.su-gpc-s {
  -webkit-column-gap: var(--su-size-s);
     -moz-column-gap: var(--su-size-s);
          column-gap: var(--su-size-s);
}

.su-gpc-r {
  -webkit-column-gap: var(--su-size-r);
     -moz-column-gap: var(--su-size-r);
          column-gap: var(--su-size-r);
}

.su-gpc-m {
  -webkit-column-gap: var(--su-size-m);
     -moz-column-gap: var(--su-size-m);
          column-gap: var(--su-size-m);
}

.su-gpc-l {
  -webkit-column-gap: var(--su-size-l);
     -moz-column-gap: var(--su-size-l);
          column-gap: var(--su-size-l);
}

.su-gpc-2l {
  -webkit-column-gap: var(--su-size-2l);
     -moz-column-gap: var(--su-size-2l);
          column-gap: var(--su-size-2l);
}

.su-gpc-3l {
  -webkit-column-gap: var(--su-size-3l);
     -moz-column-gap: var(--su-size-3l);
          column-gap: var(--su-size-3l);
}

.su-gpc-4l {
  -webkit-column-gap: var(--su-size-4l);
     -moz-column-gap: var(--su-size-4l);
          column-gap: var(--su-size-4l);
}

.su-gpc-5l {
  -webkit-column-gap: var(--su-size-5l);
     -moz-column-gap: var(--su-size-5l);
          column-gap: var(--su-size-5l);
}

.su-gpc-6l {
  -webkit-column-gap: var(--su-size-6l);
     -moz-column-gap: var(--su-size-6l);
          column-gap: var(--su-size-6l);
}

.su-gpc-7l {
  -webkit-column-gap: var(--su-size-7l);
     -moz-column-gap: var(--su-size-7l);
          column-gap: var(--su-size-7l);
}

.su-gpc-8l {
  -webkit-column-gap: var(--su-size-8l);
     -moz-column-gap: var(--su-size-8l);
          column-gap: var(--su-size-8l);
}

.su-gpc-9l {
  -webkit-column-gap: var(--su-size-9l);
     -moz-column-gap: var(--su-size-9l);
          column-gap: var(--su-size-9l);
}

.su-gpc-10l {
  -webkit-column-gap: var(--su-size-10l);
     -moz-column-gap: var(--su-size-10l);
          column-gap: var(--su-size-10l);
}

/* -------------------------------
 *  gap row
 * ---------------------------- */
.su-gpr-0 {
  row-gap: 0;
}

.su-gpr-6s {
  row-gap: var(--su-size-6s);
}

.su-gpr-5s {
  row-gap: var(--su-size-5s);
}

.su-gpr-4s {
  row-gap: var(--su-size-4s);
}

.su-gpr-3s {
  row-gap: var(--su-size-3s);
}

.su-gpr-2s {
  row-gap: var(--su-size-2s);
}

.su-gpr-s {
  row-gap: var(--su-size-s);
}

.su-gpr-r {
  row-gap: var(--su-size-r);
}

.su-gpr-m {
  row-gap: var(--su-size-m);
}

.su-gpr-l {
  row-gap: var(--su-size-l);
}

.su-gpr-2l {
  row-gap: var(--su-size-2l);
}

.su-gpr-3l {
  row-gap: var(--su-size-3l);
}

.su-gpr-4l {
  row-gap: var(--su-size-4l);
}

.su-gpr-5l {
  row-gap: var(--su-size-5l);
}

.su-gpr-6l {
  row-gap: var(--su-size-6l);
}

.su-gpr-7l {
  row-gap: var(--su-size-7l);
}

.su-gpr-8l {
  row-gap: var(--su-size-8l);
}

.su-gpr-9l {
  row-gap: var(--su-size-9l);
}

.su-gpr-10l {
  row-gap: var(--su-size-10l);
}

/* -------------------------------
 *  CSS variables
 * ---------------------------- */
:root {
  --su-color-icon-text: var(--su-default-font-color);
}

/* -------------------------------
 *  icon
 * ---------------------------- */
[class^=su-icon-] {
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}
[class^=su-icon-]::before {
  content: "";
  width: 100%;
  height: 100%;
  font-family: "startify-ui icons";
  color: var(--su-color-icon-text);
  line-height: 1;
  display: inline-block;
  left: 0;
  top: 0;
  position: absolute;
}

.su-icon-user::before {
  content: "\e912";
}
.su-icon-error::before {
  content: "\e908";
}
.su-icon-warning::before {
  content: "\e913";
}
.su-icon-success::before {
  content: "\e90f";
}
.su-icon-info::before {
  content: "\e90f";
}
.su-icon-close::before {
  content: "\e902";
}
.su-icon-add::before {
  content: "\e900";
}
.su-icon-delete::before {
  content: "\e904";
}
.su-icon-email::before {
  content: "\e907";
}
.su-icon-time::before {
  content: "\e910";
}
.su-icon-date::before {
  content: "\e903";
}
.su-icon-power::before {
  content: "\e90d";
}
.su-icon-document::before {
  content: "\e905";
}
.su-icon-download::before {
  content: "\e906";
}
.su-icon-upload::before {
  content: "\e911";
}
.su-icon-bell::before {
  content: "\e901";
}
.su-icon-search::before {
  content: "\e90e";
}
.su-icon-phone::before {
  content: "\e90c";
}
.su-icon-link::before {
  content: "\e90a";
}
.su-icon-lock::before {
  content: "\e90b";
}
.su-icon-up::before {
  content: "\e914";
}
.su-icon-down::before {
  content: "\e915";
}
.su-icon-left::before {
  content: "\e916";
}
.su-icon-right::before {
  content: "\e917";
}

/* -------------------------------
 *  margin
 * ---------------------------- */
.su-mg-0 {
  margin: 0;
}

.su-mg-6s {
  margin: var(--su-size-6s);
}

.su-mg-5s {
  margin: var(--su-size-5s);
}

.su-mg-4s {
  margin: var(--su-size-4s);
}

.su-mg-3s {
  margin: var(--su-size-3s);
}

.su-mg-2s {
  margin: var(--su-size-2s);
}

.su-mg-s {
  margin: var(--su-size-s);
}

.su-mg-r {
  margin: var(--su-size-r);
}

.su-mg-m {
  margin: var(--su-size-m);
}

.su-mg-l {
  margin: var(--su-size-l);
}

.su-mg-2l {
  margin: var(--su-size-2l);
}

.su-mg-3l {
  margin: var(--su-size-3l);
}

.su-mg-4l {
  margin: var(--su-size-4l);
}

.su-mg-5l {
  margin: var(--su-size-5l);
}

.su-mg-6l {
  margin: var(--su-size-6l);
}

.su-mg-7l {
  margin: var(--su-size-7l);
}

.su-mg-8l {
  margin: var(--su-size-8l);
}

.su-mg-9l {
  margin: var(--su-size-9l);
}

.su-mg-10l {
  margin: var(--su-size-10l);
}

/* -------------------------------
 *  margin vertical
 * ---------------------------- */
.su-mgv-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.su-mgv-6s {
  margin-top: var(--su-size-6s);
  margin-bottom: var(--su-size-6s);
}

.su-mgv-5s {
  margin-top: var(--su-size-5s);
  margin-bottom: var(--su-size-5s);
}

.su-mgv-4s {
  margin-top: var(--su-size-4s);
  margin-bottom: var(--su-size-4s);
}

.su-mgv-3s {
  margin-top: var(--su-size-3s);
  margin-bottom: var(--su-size-3s);
}

.su-mgv-2s {
  margin-top: var(--su-size-2s);
  margin-bottom: var(--su-size-2s);
}

.su-mgv-s {
  margin-top: var(--su-size-s);
  margin-bottom: var(--su-size-s);
}

.su-mgv-r {
  margin-top: var(--su-size-r);
  margin-bottom: var(--su-size-r);
}

.su-mgv-m {
  margin-top: var(--su-size-m);
  margin-bottom: var(--su-size-m);
}

.su-mgv-l {
  margin-top: var(--su-size-l);
  margin-bottom: var(--su-size-l);
}

.su-mgv-2l {
  margin-top: var(--su-size-2l);
  margin-bottom: var(--su-size-2l);
}

.su-mgv-3l {
  margin-top: var(--su-size-3l);
  margin-bottom: var(--su-size-3l);
}

.su-mgv-4l {
  margin-top: var(--su-size-4l);
  margin-bottom: var(--su-size-4l);
}

.su-mgv-5l {
  margin-top: var(--su-size-5l);
  margin-bottom: var(--su-size-5l);
}

.su-mgv-6l {
  margin-top: var(--su-size-6l);
  margin-bottom: var(--su-size-6l);
}

.su-mgv-7l {
  margin-top: var(--su-size-7l);
  margin-bottom: var(--su-size-7l);
}

.su-mgv-8l {
  margin-top: var(--su-size-8l);
  margin-bottom: var(--su-size-8l);
}

.su-mgv-9l {
  margin-top: var(--su-size-9l);
  margin-bottom: var(--su-size-9l);
}

.su-mgv-10l {
  margin-top: var(--su-size-10l);
  margin-bottom: var(--su-size-10l);
}

/* -------------------------------
 *  margin horizontal
 * ---------------------------- */
.su-mgh-0 {
  margin-left: 0;
  margin-right: 0;
}

.su-mgh-6s {
  margin-left: var(--su-size-6s);
  margin-right: var(--su-size-6s);
}

.su-mgh-5s {
  margin-left: var(--su-size-5s);
  margin-right: var(--su-size-5s);
}

.su-mgh-4s {
  margin-left: var(--su-size-4s);
  margin-right: var(--su-size-4s);
}

.su-mgh-3s {
  margin-left: var(--su-size-3s);
  margin-right: var(--su-size-3s);
}

.su-mgh-2s {
  margin-left: var(--su-size-2s);
  margin-right: var(--su-size-2s);
}

.su-mgh-s {
  margin-left: var(--su-size-s);
  margin-right: var(--su-size-s);
}

.su-mgh-r {
  margin-left: var(--su-size-r);
  margin-right: var(--su-size-r);
}

.su-mgh-m {
  margin-left: var(--su-size-m);
  margin-right: var(--su-size-m);
}

.su-mgh-l {
  margin-left: var(--su-size-l);
  margin-right: var(--su-size-l);
}

.su-mgh-2l {
  margin-left: var(--su-size-2l);
  margin-right: var(--su-size-2l);
}

.su-mgh-3l {
  margin-left: var(--su-size-3l);
  margin-right: var(--su-size-3l);
}

.su-mgh-4l {
  margin-left: var(--su-size-4l);
  margin-right: var(--su-size-4l);
}

.su-mgh-5l {
  margin-left: var(--su-size-5l);
  margin-right: var(--su-size-5l);
}

.su-mgh-6l {
  margin-left: var(--su-size-6l);
  margin-right: var(--su-size-6l);
}

.su-mgh-7l {
  margin-left: var(--su-size-7l);
  margin-right: var(--su-size-7l);
}

.su-mgh-8l {
  margin-left: var(--su-size-8l);
  margin-right: var(--su-size-8l);
}

.su-mgh-9l {
  margin-left: var(--su-size-9l);
  margin-right: var(--su-size-9l);
}

.su-mgh-10l {
  margin-left: var(--su-size-10l);
  margin-right: var(--su-size-10l);
}

/* -------------------------------
 *  margin top
 * ---------------------------- */
.su-mgt-0 {
  margin-top: 0;
}

.su-mgt-6s {
  margin-top: var(--su-size-6s);
}

.su-mgt-5s {
  margin-top: var(--su-size-5s);
}

.su-mgt-4s {
  margin-top: var(--su-size-4s);
}

.su-mgt-3s {
  margin-top: var(--su-size-3s);
}

.su-mgt-2s {
  margin-top: var(--su-size-2s);
}

.su-mgt-s {
  margin-top: var(--su-size-s);
}

.su-mgt-r {
  margin-top: var(--su-size-r);
}

.su-mgt-m {
  margin-top: var(--su-size-m);
}

.su-mgt-l {
  margin-top: var(--su-size-l);
}

.su-mgt-2l {
  margin-top: var(--su-size-2l);
}

.su-mgt-3l {
  margin-top: var(--su-size-3l);
}

.su-mgt-4l {
  margin-top: var(--su-size-4l);
}

.su-mgt-5l {
  margin-top: var(--su-size-5l);
}

.su-mgt-6l {
  margin-top: var(--su-size-6l);
}

.su-mgt-7l {
  margin-top: var(--su-size-7l);
}

.su-mgt-8l {
  margin-top: var(--su-size-8l);
}

.su-mgt-9l {
  margin-top: var(--su-size-9l);
}

.su-mgt-10l {
  margin-top: var(--su-size-10l);
}

/* -------------------------------
 *  margin bottom
 * ---------------------------- */
.su-mgb-0 {
  margin-bottom: 0;
}

.su-mgb-6s {
  margin-bottom: var(--su-size-6s);
}

.su-mgb-5s {
  margin-bottom: var(--su-size-5s);
}

.su-mgb-4s {
  margin-bottom: var(--su-size-4s);
}

.su-mgb-3s {
  margin-bottom: var(--su-size-3s);
}

.su-mgb-2s {
  margin-bottom: var(--su-size-2s);
}

.su-mgb-s {
  margin-bottom: var(--su-size-s);
}

.su-mgb-r {
  margin-bottom: var(--su-size-r);
}

.su-mgb-m {
  margin-bottom: var(--su-size-m);
}

.su-mgb-l {
  margin-bottom: var(--su-size-l);
}

.su-mgb-2l {
  margin-bottom: var(--su-size-2l);
}

.su-mgb-3l {
  margin-bottom: var(--su-size-3l);
}

.su-mgb-4l {
  margin-bottom: var(--su-size-4l);
}

.su-mgb-5l {
  margin-bottom: var(--su-size-5l);
}

.su-mgb-6l {
  margin-bottom: var(--su-size-6l);
}

.su-mgb-7l {
  margin-bottom: var(--su-size-7l);
}

.su-mgb-8l {
  margin-bottom: var(--su-size-8l);
}

.su-mgb-9l {
  margin-bottom: var(--su-size-9l);
}

.su-mgb-10l {
  margin-bottom: var(--su-size-10l);
}

/* -------------------------------
 *  margin left
 * ---------------------------- */
.su-mgl-0 {
  margin-left: 0;
}

.su-mgl-6s {
  margin-left: var(--su-size-6s);
}

.su-mgl-5s {
  margin-left: var(--su-size-5s);
}

.su-mgl-4s {
  margin-left: var(--su-size-4s);
}

.su-mgl-3s {
  margin-left: var(--su-size-3s);
}

.su-mgl-2s {
  margin-left: var(--su-size-2s);
}

.su-mgl-s {
  margin-left: var(--su-size-s);
}

.su-mgl-r {
  margin-left: var(--su-size-r);
}

.su-mgl-m {
  margin-left: var(--su-size-m);
}

.su-mgl-l {
  margin-left: var(--su-size-l);
}

.su-mgl-2l {
  margin-left: var(--su-size-2l);
}

.su-mgl-3l {
  margin-left: var(--su-size-3l);
}

.su-mgl-4l {
  margin-left: var(--su-size-4l);
}

.su-mgl-5l {
  margin-left: var(--su-size-5l);
}

.su-mgl-6l {
  margin-left: var(--su-size-6l);
}

.su-mgl-7l {
  margin-left: var(--su-size-7l);
}

.su-mgl-8l {
  margin-left: var(--su-size-8l);
}

.su-mgl-9l {
  margin-left: var(--su-size-9l);
}

.su-mgl-10l {
  margin-left: var(--su-size-10l);
}

/* -------------------------------
 *  margin right
 * ---------------------------- */
.su-mgr-0 {
  margin-right: 0;
}

.su-mgr-6s {
  margin-right: var(--su-size-6s);
}

.su-mgr-5s {
  margin-right: var(--su-size-5s);
}

.su-mgr-4s {
  margin-right: var(--su-size-4s);
}

.su-mgr-3s {
  margin-right: var(--su-size-3s);
}

.su-mgr-2s {
  margin-right: var(--su-size-2s);
}

.su-mgr-s {
  margin-right: var(--su-size-s);
}

.su-mgr-r {
  margin-right: var(--su-size-r);
}

.su-mgr-m {
  margin-right: var(--su-size-m);
}

.su-mgr-l {
  margin-right: var(--su-size-l);
}

.su-mgr-2l {
  margin-right: var(--su-size-2l);
}

.su-mgr-3l {
  margin-right: var(--su-size-3l);
}

.su-mgr-4l {
  margin-right: var(--su-size-4l);
}

.su-mgr-5l {
  margin-right: var(--su-size-5l);
}

.su-mgr-6l {
  margin-right: var(--su-size-6l);
}

.su-mgr-7l {
  margin-right: var(--su-size-7l);
}

.su-mgr-8l {
  margin-right: var(--su-size-8l);
}

.su-mgr-9l {
  margin-right: var(--su-size-9l);
}

.su-mgr-10l {
  margin-right: var(--su-size-10l);
}

/* -------------------------------
 *  scroll margin top
 * ---------------------------- */
.su-scroll-mgt-r {
  scroll-margin-top: var(--su-size-r);
}

.su-scroll-mgt-m {
  scroll-margin-top: var(--su-size-m);
}

.su-scroll-mgt-l {
  scroll-margin-top: var(--su-size-l);
}

.su-scroll-mgt-2l {
  scroll-margin-top: var(--su-size-2l);
}

.su-scroll-mgt-3l {
  scroll-margin-top: var(--su-size-3l);
}

.su-scroll-mgt-4l {
  scroll-margin-top: var(--su-size-4l);
}

.su-scroll-mgt-5l {
  scroll-margin-top: var(--su-size-5l);
}

.su-scroll-mgt-6l {
  scroll-margin-top: var(--su-size-6l);
}

.su-scroll-mgt-7l {
  scroll-margin-top: var(--su-size-7l);
}

.su-scroll-mgt-8l {
  scroll-margin-top: var(--su-size-8l);
}

.su-scroll-mgt-9l {
  scroll-margin-top: var(--su-size-9l);
}

.su-scroll-mgt-10l {
  scroll-margin-top: var(--su-size-10l);
}

/* -------------------------------
 *  padding
 * ---------------------------- */
.su-pd-0 {
  padding: 0;
}

.su-pd-6s {
  padding: var(--su-size-6s);
}

.su-pd-5s {
  padding: var(--su-size-5s);
}

.su-pd-4s {
  padding: var(--su-size-4s);
}

.su-pd-3s {
  padding: var(--su-size-3s);
}

.su-pd-2s {
  padding: var(--su-size-2s);
}

.su-pd-s {
  padding: var(--su-size-s);
}

.su-pd-r {
  padding: var(--su-size-r);
}

.su-pd-m {
  padding: var(--su-size-m);
}

.su-pd-l {
  padding: var(--su-size-l);
}

.su-pd-2l {
  padding: var(--su-size-2l);
}

.su-pd-3l {
  padding: var(--su-size-3l);
}

.su-pd-4l {
  padding: var(--su-size-4l);
}

.su-pd-5l {
  padding: var(--su-size-5l);
}

.su-pd-6l {
  padding: var(--su-size-6l);
}

.su-pd-7l {
  padding: var(--su-size-7l);
}

.su-pd-8l {
  padding: var(--su-size-8l);
}

.su-pd-9l {
  padding: var(--su-size-9l);
}

.su-pd-10l {
  padding: var(--su-size-10l);
}

/* -------------------------------
 *  padding vertical
 * ---------------------------- */
.su-pdv-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.su-pdv-6s {
  padding-top: var(--su-size-6s);
  padding-bottom: var(--su-size-6s);
}

.su-pdv-5s {
  padding-top: var(--su-size-5s);
  padding-bottom: var(--su-size-5s);
}

.su-pdv-4s {
  padding-top: var(--su-size-4s);
  padding-bottom: var(--su-size-4s);
}

.su-pdv-3s {
  padding-top: var(--su-size-3s);
  padding-bottom: var(--su-size-3s);
}

.su-pdv-2s {
  padding-top: var(--su-size-2s);
  padding-bottom: var(--su-size-2s);
}

.su-pdv-s {
  padding-top: var(--su-size-s);
  padding-bottom: var(--su-size-s);
}

.su-pdv-r {
  padding-top: var(--su-size-r);
  padding-bottom: var(--su-size-r);
}

.su-pdv-m {
  padding-top: var(--su-size-m);
  padding-bottom: var(--su-size-m);
}

.su-pdv-l {
  padding-top: var(--su-size-l);
  padding-bottom: var(--su-size-l);
}

.su-pdv-2l {
  padding-top: var(--su-size-2l);
  padding-bottom: var(--su-size-2l);
}

.su-pdv-3l {
  padding-top: var(--su-size-3l);
  padding-bottom: var(--su-size-3l);
}

.su-pdv-4l {
  padding-top: var(--su-size-4l);
  padding-bottom: var(--su-size-4l);
}

.su-pdv-5l {
  padding-top: var(--su-size-5l);
  padding-bottom: var(--su-size-5l);
}

.su-pdv-6l {
  padding-top: var(--su-size-6l);
  padding-bottom: var(--su-size-6l);
}

.su-pdv-7l {
  padding-top: var(--su-size-7l);
  padding-bottom: var(--su-size-7l);
}

.su-pdv-8l {
  padding-top: var(--su-size-8l);
  padding-bottom: var(--su-size-8l);
}

.su-pdv-9l {
  padding-top: var(--su-size-9l);
  padding-bottom: var(--su-size-9l);
}

.su-pdv-10l {
  padding-top: var(--su-size-10l);
  padding-bottom: var(--su-size-10l);
}

/* -------------------------------
 *  padding horizontal
 * ---------------------------- */
.su-pdh-0 {
  padding-left: 0;
  padding-right: 0;
}

.su-pdh-6s {
  padding-left: var(--su-size-6s);
  padding-right: var(--su-size-6s);
}

.su-pdh-5s {
  padding-left: var(--su-size-5s);
  padding-right: var(--su-size-5s);
}

.su-pdh-4s {
  padding-left: var(--su-size-4s);
  padding-right: var(--su-size-4s);
}

.su-pdh-3s {
  padding-left: var(--su-size-3s);
  padding-right: var(--su-size-3s);
}

.su-pdh-2s {
  padding-left: var(--su-size-2s);
  padding-right: var(--su-size-2s);
}

.su-pdh-s {
  padding-left: var(--su-size-s);
  padding-right: var(--su-size-s);
}

.su-pdh-r {
  padding-left: var(--su-size-r);
  padding-right: var(--su-size-r);
}

.su-pdh-m {
  padding-left: var(--su-size-m);
  padding-right: var(--su-size-m);
}

.su-pdh-l {
  padding-left: var(--su-size-l);
  padding-right: var(--su-size-l);
}

.su-pdh-2l {
  padding-left: var(--su-size-2l);
  padding-right: var(--su-size-2l);
}

.su-pdh-3l {
  padding-left: var(--su-size-3l);
  padding-right: var(--su-size-3l);
}

.su-pdh-4l {
  padding-left: var(--su-size-4l);
  padding-right: var(--su-size-4l);
}

.su-pdh-5l {
  padding-left: var(--su-size-5l);
  padding-right: var(--su-size-5l);
}

.su-pdh-6l {
  padding-left: var(--su-size-6l);
  padding-right: var(--su-size-6l);
}

.su-pdh-7l {
  padding-left: var(--su-size-7l);
  padding-right: var(--su-size-7l);
}

.su-pdh-8l {
  padding-left: var(--su-size-8l);
  padding-right: var(--su-size-8l);
}

.su-pdh-9l {
  padding-left: var(--su-size-9l);
  padding-right: var(--su-size-9l);
}

.su-pdh-10l {
  padding-left: var(--su-size-10l);
  padding-right: var(--su-size-10l);
}

/* -------------------------------
 *  padding top
 * ---------------------------- */
.su-pdt-0 {
  padding-top: 0;
}

.su-pdt-6s {
  padding-top: var(--su-size-6s);
}

.su-pdt-5s {
  padding-top: var(--su-size-5s);
}

.su-pdt-4s {
  padding-top: var(--su-size-4s);
}

.su-pdt-3s {
  padding-top: var(--su-size-3s);
}

.su-pdt-2s {
  padding-top: var(--su-size-2s);
}

.su-pdt-s {
  padding-top: var(--su-size-s);
}

.su-pdt-r {
  padding-top: var(--su-size-r);
}

.su-pdt-m {
  padding-top: var(--su-size-m);
}

.su-pdt-l {
  padding-top: var(--su-size-l);
}

.su-pdt-2l {
  padding-top: var(--su-size-2l);
}

.su-pdt-3l {
  padding-top: var(--su-size-3l);
}

.su-pdt-4l {
  padding-top: var(--su-size-4l);
}

.su-pdt-5l {
  padding-top: var(--su-size-5l);
}

.su-pdt-6l {
  padding-top: var(--su-size-6l);
}

.su-pdt-7l {
  padding-top: var(--su-size-7l);
}

.su-pdt-8l {
  padding-top: var(--su-size-8l);
}

.su-pdt-9l {
  padding-top: var(--su-size-9l);
}

.su-pdt-10l {
  padding-top: var(--su-size-10l);
}

/* -------------------------------
 *  padding bottom
 * ---------------------------- */
.su-pdb-0 {
  padding-bottom: 0;
}

.su-pdb-6s {
  padding-bottom: var(--su-size-6s);
}

.su-pdb-5s {
  padding-bottom: var(--su-size-5s);
}

.su-pdb-4s {
  padding-bottom: var(--su-size-4s);
}

.su-pdb-3s {
  padding-bottom: var(--su-size-3s);
}

.su-pdb-2s {
  padding-bottom: var(--su-size-2s);
}

.su-pdb-s {
  padding-bottom: var(--su-size-s);
}

.su-pdb-r {
  padding-bottom: var(--su-size-r);
}

.su-pdb-m {
  padding-bottom: var(--su-size-m);
}

.su-pdb-l {
  padding-bottom: var(--su-size-l);
}

.su-pdb-2l {
  padding-bottom: var(--su-size-2l);
}

.su-pdb-3l {
  padding-bottom: var(--su-size-3l);
}

.su-pdb-4l {
  padding-bottom: var(--su-size-4l);
}

.su-pdb-5l {
  padding-bottom: var(--su-size-5l);
}

.su-pdb-6l {
  padding-bottom: var(--su-size-6l);
}

.su-pdb-7l {
  padding-bottom: var(--su-size-7l);
}

.su-pdb-8l {
  padding-bottom: var(--su-size-8l);
}

.su-pdb-9l {
  padding-bottom: var(--su-size-9l);
}

.su-pdb-10l {
  padding-bottom: var(--su-size-10l);
}

/* -------------------------------
 *  padding left
 * ---------------------------- */
.su-pdl-0 {
  padding-left: 0;
}

.su-pdl-6s {
  padding-left: var(--su-size-6s);
}

.su-pdl-5s {
  padding-left: var(--su-size-5s);
}

.su-pdl-4s {
  padding-left: var(--su-size-4s);
}

.su-pdl-3s {
  padding-left: var(--su-size-3s);
}

.su-pdl-2s {
  padding-left: var(--su-size-2s);
}

.su-pdl-s {
  padding-left: var(--su-size-s);
}

.su-pdl-r {
  padding-left: var(--su-size-r);
}

.su-pdl-m {
  padding-left: var(--su-size-m);
}

.su-pdl-l {
  padding-left: var(--su-size-l);
}

.su-pdl-2l {
  padding-left: var(--su-size-2l);
}

.su-pdl-3l {
  padding-left: var(--su-size-3l);
}

.su-pdl-4l {
  padding-left: var(--su-size-4l);
}

.su-pdl-5l {
  padding-left: var(--su-size-5l);
}

.su-pdl-6l {
  padding-left: var(--su-size-6l);
}

.su-pdl-7l {
  padding-left: var(--su-size-7l);
}

.su-pdl-8l {
  padding-left: var(--su-size-8l);
}

.su-pdl-9l {
  padding-left: var(--su-size-9l);
}

.su-pdl-10l {
  padding-left: var(--su-size-10l);
}

/* -------------------------------
 *  padding right
 * ---------------------------- */
.su-pdr-0 {
  padding-right: 0;
}

.su-pdr-6s {
  padding-right: var(--su-size-6s);
}

.su-pdr-5s {
  padding-right: var(--su-size-5s);
}

.su-pdr-4s {
  padding-right: var(--su-size-4s);
}

.su-pdr-3s {
  padding-right: var(--su-size-3s);
}

.su-pdr-2s {
  padding-right: var(--su-size-2s);
}

.su-pdr-s {
  padding-right: var(--su-size-s);
}

.su-pdr-r {
  padding-right: var(--su-size-r);
}

.su-pdr-m {
  padding-right: var(--su-size-m);
}

.su-pdr-l {
  padding-right: var(--su-size-l);
}

.su-pdr-2l {
  padding-right: var(--su-size-2l);
}

.su-pdr-3l {
  padding-right: var(--su-size-3l);
}

.su-pdr-4l {
  padding-right: var(--su-size-4l);
}

.su-pdr-5l {
  padding-right: var(--su-size-5l);
}

.su-pdr-6l {
  padding-right: var(--su-size-6l);
}

.su-pdr-7l {
  padding-right: var(--su-size-7l);
}

.su-pdr-8l {
  padding-right: var(--su-size-8l);
}

.su-pdr-9l {
  padding-right: var(--su-size-9l);
}

.su-pdr-10l {
  padding-right: var(--su-size-10l);
}

/* -------------------------------
 *  scroll padding top
 * ---------------------------- */
.su-scroll-pdt-r {
  scroll-padding-top: var(--su-size-r);
}

.su-scroll-pdt-m {
  scroll-padding-top: var(--su-size-m);
}

.su-scroll-pdt-l {
  scroll-padding-top: var(--su-size-l);
}

.su-scroll-pdt-2l {
  scroll-padding-top: var(--su-size-2l);
}

.su-scroll-pdt-3l {
  scroll-padding-top: var(--su-size-3l);
}

.su-scroll-pdt-4l {
  scroll-padding-top: var(--su-size-4l);
}

.su-scroll-pdt-5l {
  scroll-padding-top: var(--su-size-5l);
}

.su-scroll-pdt-6l {
  scroll-padding-top: var(--su-size-6l);
}

.su-scroll-pdt-7l {
  scroll-padding-top: var(--su-size-7l);
}

.su-scroll-pdt-8l {
  scroll-padding-top: var(--su-size-8l);
}

.su-scroll-pdt-9l {
  scroll-padding-top: var(--su-size-9l);
}

.su-scroll-pdt-10l {
  scroll-padding-top: var(--su-size-10l);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  background pattern
 * ---------------------------- */
.su-pattern-grid {
  background-image: -webkit-gradient(linear, left top, right top, color-stop(4.1666%, var(--su-gray-color__mono--1)), color-stop(4.1666%, transparent)), -webkit-gradient(linear, left bottom, left top, color-stop(4.1666%, var(--su-gray-color__mono--1)), color-stop(4.1666%, transparent));
  background-image: linear-gradient(90deg, var(--su-gray-color__mono--1) 4.1666%, transparent 4.1666%), linear-gradient(0deg, var(--su-gray-color__mono--1) 4.1666%, transparent 4.1666%);
  background-size: var(--su-size-2l) var(--su-size-2l);
  background-repeat: repeat;
}

/* -------------------------------
 *  position
 * ---------------------------- */
.su-static {
  position: static;
}

.su-relative {
  position: relative;
}

.su-absolute {
  position: absolute;
}

.su-fixed {
  position: fixed;
}

.su-sticky {
  position: sticky;
}

/* -------------------------------
 *  top
 * ---------------------------- */
.su-top-auto {
  top: auto;
}

.su-top-0 {
  top: 0;
}

.su-top-25 {
  top: 25%;
}

.su-top-50 {
  top: 50%;
}

.su-top-75 {
  top: 75%;
}

.su-top-100 {
  top: 100%;
}

/* -------------------------------
 *  bottom
 * ---------------------------- */
.su-bottom-auto {
  bottom: auto;
}

.su-bottom-0 {
  bottom: 0;
}

.su-bottom-25 {
  bottom: 25%;
}

.su-bottom-50 {
  bottom: 50%;
}

.su-bottom-75 {
  bottom: 75%;
}

.su-bottom-100 {
  bottom: 100%;
}

/* -------------------------------
 *  left
 * ---------------------------- */
.su-left-auto {
  left: auto;
}

.su-left-0 {
  left: 0;
}

.su-left-25 {
  left: 25%;
}

.su-left-50 {
  left: 50%;
}

.su-left-75 {
  left: 75%;
}

.su-left-100 {
  left: 100%;
}

/* -------------------------------
 *  right
 * ---------------------------- */
.su-right-auto {
  right: auto;
}

.su-right-0 {
  right: 0;
}

.su-right-25 {
  right: 25%;
}

.su-right-50 {
  right: 50%;
}

.su-right-75 {
  right: 75%;
}

.su-right-100 {
  right: 100%;
}

/* -------------------------------
 *  layer order
 * ---------------------------- */
.su-layer-order-fixed {
  z-index: var(--su-layer-order-fixed);
}

.su-layer-order-alert {
  z-index: var(--su-layer-order-alert);
}

.su-layer-order-drawer {
  z-index: var(--su-layer-order-drawer);
}

.su-layer-order-dialog {
  z-index: var(--su-layer-order-dialog);
}

.su-layer-order-loading {
  z-index: var(--su-layer-order-loading);
}

.su-layer-order-infinity {
  z-index: var(--su-layer-order-infinity);
}

.su-z-0 {
  z-index: 0;
}

.su-z-1 {
  z-index: 1;
}
.su-z-1-back {
  z-index: -1;
}

.su-z-2 {
  z-index: 2;
}
.su-z-2-back {
  z-index: -2;
}

.su-z-3 {
  z-index: 3;
}
.su-z-3-back {
  z-index: -3;
}

/* -------------------------------
 *  for screen reader
 * ---------------------------- */
.su-screen-reader-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* -------------------------------
 *  dropshadow box
 * ---------------------------- */
.su-shadow-box {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-0, .su-shadow-box-none {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-blur-0) var(--su-shadow-elevation-spread-0) var(--su-shadow-elevation-color-0);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-blur-0) var(--su-shadow-elevation-spread-0) var(--su-shadow-elevation-color-0);
}
.su-shadow-box-1, .su-shadow-box-low {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-box-2, .su-shadow-box-medium {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-3, .su-shadow-box-high {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-box-4, .su-shadow-box-highest {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
          box-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
}
.su-shadow-box-right-bottom {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-right-bottom-1, .su-shadow-box-right-bottom-low {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
          box-shadow: var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-box-right-bottom-2, .su-shadow-box-right-bottom-medium {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-right-bottom-3, .su-shadow-box-right-bottom-high {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
          box-shadow: var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-box-right-bottom-4, .su-shadow-box-right-bottom-highest {
  -webkit-box-shadow: var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
          box-shadow: var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
}
.su-shadow-box-left-bottom {
  -webkit-box-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-left-bottom-1, .su-shadow-box-left-bottom-low {
  -webkit-box-shadow: calc(var(--su-shadow-elevation-offset-1) * -1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
          box-shadow: calc(var(--su-shadow-elevation-offset-1) * -1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-spread-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-box-left-bottom-2, .su-shadow-box-left-bottom-medium {
  -webkit-box-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
          box-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-spread-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-box-left-bottom-3, .su-shadow-box-left-bottom-high {
  -webkit-box-shadow: calc(var(--su-shadow-elevation-offset-3) * -1) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
          box-shadow: calc(var(--su-shadow-elevation-offset-3) * -1) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-spread-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-box-left-bottom-4, .su-shadow-box-left-bottom-highest {
  -webkit-box-shadow: calc(var(--su-shadow-elevation-offset-4) * -1) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
          box-shadow: calc(var(--su-shadow-elevation-offset-4) * -1) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-spread-4) var(--su-shadow-elevation-color-4);
}

/* -------------------------------
 *  dropshadow text
 * ---------------------------- */
.su-shadow-text {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-0, .su-shadow-text-none {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-blur-0) var(--su-shadow-elevation-color-0);
}
.su-shadow-text-1, .su-shadow-text-low {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-text-2, .su-shadow-text-medium {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-3, .su-shadow-text-high {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-text-4, .su-shadow-text-highest {
  text-shadow: var(--su-shadow-elevation-offset-0) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-color-4);
}
.su-shadow-text-right-bottom {
  text-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-right-bottom-1, .su-shadow-text-right-bottom-low {
  text-shadow: var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-text-right-bottom-2, .su-shadow-text-right-bottom-medium {
  text-shadow: var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-right-bottom-3, .su-shadow-text-right-bottom-high {
  text-shadow: var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-text-right-bottom-4, .su-shadow-text-right-bottom-highest {
  text-shadow: var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-color-4);
}
.su-shadow-text-left-bottom {
  text-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-left-bottom-1, .su-shadow-text-left-bottom-low {
  text-shadow: calc(var(--su-shadow-elevation-offset-1) * -1) var(--su-shadow-elevation-offset-1) var(--su-shadow-elevation-blur-1) var(--su-shadow-elevation-color-1);
}
.su-shadow-text-left-bottom-2, .su-shadow-text-left-bottom-medium {
  text-shadow: calc(var(--su-shadow-elevation-offset-2) * -1) var(--su-shadow-elevation-offset-2) var(--su-shadow-elevation-blur-2) var(--su-shadow-elevation-color-2);
}
.su-shadow-text-left-bottom-3, .su-shadow-text-left-bottom-high {
  text-shadow: calc(var(--su-shadow-elevation-offset-3) * -1) var(--su-shadow-elevation-offset-3) var(--su-shadow-elevation-blur-3) var(--su-shadow-elevation-color-3);
}
.su-shadow-text-left-bottom-4, .su-shadow-text-left-bottom-highest {
  text-shadow: calc(var(--su-shadow-elevation-offset-4) * -1) var(--su-shadow-elevation-offset-4) var(--su-shadow-elevation-blur-4) var(--su-shadow-elevation-color-4);
}

/* -------------------------------
 *  width
 * ---------------------------- */
.su-w-0 {
  width: var(--su-size-0);
}

.su-w-1-12,
.su-w-8 {
  width: var(--su-size-1-12);
}

.su-w-1-10,
.su-w-10 {
  width: var(--su-size-1-10);
}

.su-w-1-6,
.su-w-16 {
  width: var(--su-size-1-6);
}

.su-w-1-5,
.su-w-20 {
  width: var(--su-size-1-5);
}

.su-w-1-4,
.su-w-25 {
  width: var(--su-size-1-4);
}

.su-w-1-3,
.su-w-33 {
  width: var(--su-size-1-3);
}

.su-w-1-2,
.su-w-50 {
  width: var(--su-size-1-2);
}

.su-w-2-3,
.su-w-66 {
  width: var(--su-size-2-3);
}

.su-w-3-4,
.su-w-75 {
  width: var(--su-size-3-4);
}

.su-w-4-5,
.su-w-80 {
  width: var(--su-size-4-5);
}

.su-w-5-6,
.su-w-83 {
  width: var(--su-size-5-6);
}

.su-w-9-10,
.su-w-90 {
  width: var(--su-size-9-10);
}

.su-w-11-12,
.su-w-92 {
  width: var(--su-size-11-12);
}

.su-w-100 {
  width: var(--su-size-100);
}

.su-w-auto {
  width: var(--su-size-auto);
}

.su-w-content {
  width: var(--su-size-content);
}

.su-w-screen {
  width: var(--su-size-screen-w);
}

.su-w-6s {
  width: var(--su-size-6s);
}

.su-w-5s {
  width: var(--su-size-5s);
}

.su-w-4s {
  width: var(--su-size-4s);
}

.su-w-3s {
  width: var(--su-size-3s);
}

.su-w-2s {
  width: var(--su-size-2s);
}

.su-w-s {
  width: var(--su-size-s);
}

.su-w-r {
  width: var(--su-size-r);
}

.su-w-m {
  width: var(--su-size-m);
}

.su-w-l {
  width: var(--su-size-l);
}

.su-w-2l {
  width: var(--su-size-2l);
}

.su-w-3l {
  width: var(--su-size-3l);
}

.su-w-4l {
  width: var(--su-size-4l);
}

.su-w-5l {
  width: var(--su-size-5l);
}

.su-w-6l {
  width: var(--su-size-6l);
}

.su-w-7l {
  width: var(--su-size-7l);
}

.su-w-8l {
  width: var(--su-size-8l);
}

.su-w-9l {
  width: var(--su-size-9l);
}

.su-w-10l {
  width: var(--su-size-10l);
}

/* -------------------------------
 *  height
 * ---------------------------- */
.su-h-0 {
  height: var(--su-size-0);
}

.su-h-1-12,
.su-h-8 {
  height: var(--su-size-1-12);
}

.su-h-1-10,
.su-h-10 {
  height: var(--su-size-1-10);
}

.su-h-1-6,
.su-h-16 {
  height: var(--su-size-1-6);
}

.su-h-1-5,
.su-h-20 {
  height: var(--su-size-1-5);
}

.su-h-1-4,
.su-h-25 {
  height: var(--su-size-1-4);
}

.su-h-1-3,
.su-h-33 {
  height: var(--su-size-1-3);
}

.su-h-1-2,
.su-h-50 {
  height: var(--su-size-1-2);
}

.su-h-2-3,
.su-h-66 {
  height: var(--su-size-2-3);
}

.su-h-3-4,
.su-h-75 {
  height: var(--su-size-3-4);
}

.su-h-4-5,
.su-h-80 {
  height: var(--su-size-4-5);
}

.su-h-5-6,
.su-h-83 {
  height: var(--su-size-5-6);
}

.su-h-9-10,
.su-h-90 {
  height: var(--su-size-9-10);
}

.su-h-11-12,
.su-h-92 {
  height: var(--su-size-11-12);
}

.su-h-100 {
  height: var(--su-size-100);
}

.su-h-auto {
  height: var(--su-size-auto);
}

.su-h-content {
  height: var(--su-size-content);
}

.su-h-screen {
  height: var(--su-size-screen-h);
}

.su-h-6s {
  height: var(--su-size-6s);
}

.su-h-5s {
  height: var(--su-size-5s);
}

.su-h-4s {
  height: var(--su-size-4s);
}

.su-h-3s {
  height: var(--su-size-3s);
}

.su-h-2s {
  height: var(--su-size-2s);
}

.su-h-s {
  height: var(--su-size-s);
}

.su-h-r {
  height: var(--su-size-r);
}

.su-h-m {
  height: var(--su-size-m);
}

.su-h-l {
  height: var(--su-size-l);
}

.su-h-2l {
  height: var(--su-size-2l);
}

.su-h-3l {
  height: var(--su-size-3l);
}

.su-h-4l {
  height: var(--su-size-4l);
}

.su-h-5l {
  height: var(--su-size-5l);
}

.su-h-6l {
  height: var(--su-size-6l);
}

.su-h-7l {
  height: var(--su-size-7l);
}

.su-h-8l {
  height: var(--su-size-8l);
}

.su-h-9l {
  height: var(--su-size-9l);
}

.su-h-10l {
  height: var(--su-size-10l);
}

/* -------------------------------
 *  text color
 * ---------------------------- */
.su-text-red {
  color: var(--su-palette-color__red--5);
}

.su-text-orange {
  color: var(--su-palette-color__orange--5);
}

.su-text-orange-yellow {
  color: var(--su-palette-color__orange-yellow--5);
}

.su-text-yellow {
  color: var(--su-palette-color__yellow--5);
}

.su-text-yellow-green {
  color: var(--su-palette-color__yellow-green--5);
}

.su-text-green {
  color: var(--su-palette-color__yellow-green--5);
}

.su-text-teal {
  color: var(--su-palette-color__teal--5);
}

.su-text-cyan {
  color: var(--su-palette-color__cyan--5);
}

.su-text-light-blue {
  color: var(--su-palette-color__light-blue--5);
}

.su-text-blue {
  color: var(--su-palette-color__blue--5);
}

.su-text-blue-violet {
  color: var(--su-palette-color__blue-violet--5);
}

.su-text-violet {
  color: var(--su-palette-color__violet--5);
}

.su-text-purple {
  color: var(--su-palette-color__purple--5);
}

.su-text-magenta {
  color: var(--su-palette-color__magenta--5);
}

.su-text-pink {
  color: var(--su-palette-color__pink--5);
}

.su-text-pink-red {
  color: var(--su-palette-color__pink-red--5);
}

.su-text-gray-cool {
  color: var(--su-gray-color__cool--5);
}

.su-text-gray-warm {
  color: var(--su-gray-color__warm--5);
}

.su-text-gray-mono {
  color: var(--su-gray-color__mono--5);
}

.su-text-white,
.su-text-pure-white {
  color: var(--su-color-white);
}

.su-text-pure-black {
  color: var(--su-color-black);
}

.su-text-error {
  color: var(--su-status-color__error--5);
}

.su-text-warning {
  color: var(--su-status-color__warning--5);
}

.su-text-success {
  color: var(--su-status-color__success--5);
}

.su-text-info {
  color: var(--su-status-color__info--5);
}

.su-text-negative {
  color: var(--su-status-color__negative--5);
}

.su-text-base {
  color: var(--su-theme-color__base--5);
}

.su-text-primary {
  color: var(--su-theme-color__primary--5);
}

.su-text-secondary {
  color: var(--su-theme-color__secondary--5);
}

.su-text-accent {
  color: var(--su-theme-color__accent--5);
}

/*
 * Startify-UI
 * This project is licensed under the MIT License.
 * (c) 2024-present Shinya Ogawa
*/
/* -------------------------------
 *  startify-ui
 *  file import (Foundation)
 * ---------------------------- */
/* -------------------------------
 *  font family
 * ---------------------------- */
.su-text-sans {
  font-family: var(--su-font-sans);
}

.su-text-serif {
  font-family: var(--su-font-serif);
}

.su-text-monospace {
  font-family: var(--su-font-monospace);
}

/* -------------------------------
 *  font weight
 * ---------------------------- */
.su-text-thin,
.su-text-100 {
  font-weight: var(--su-font-thin);
}

.su-text-extra-light,
.su-text-200 {
  font-weight: var(--su-font-extra-light);
}

.su-text-light,
.su-text-300 {
  font-weight: var(--su-font-light);
}

.su-text-regular,
.su-text-400 {
  font-weight: var(--su-font-regular);
}

.su-text-medium,
.su-text-500 {
  font-weight: var(--su-font-medium);
}

.su-text-semi-bold,
.su-text-600 {
  font-weight: var(--su-font-semi-bold);
}

.su-text-bold,
.su-text-700 {
  font-weight: var(--su-font-bold);
}

.su-text-extra-bold,
.su-text-800 {
  font-weight: var(--su-font-extra-bold);
}

.su-text-black,
.su-text-900 {
  font-weight: var(--su-font-black);
}

/* -------------------------------
 *  font size
 * ---------------------------- */
.su-text-3s,
.su-text-10 {
  font-size: var(--su-size-3s);
}
@media (width <= 768px) {
  .su-text-3s--mobile,
  .su-text-10--mobile {
    font-size: var(--su-size-3s);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-3s--desktop,
  .su-text-10--desktop {
    font-size: var(--su-size-3s);
  }
}

.su-text-2s,
.su-text-12 {
  font-size: var(--su-size-2s);
}
@media (width <= 768px) {
  .su-text-2s--mobile,
  .su-text-12--mobile {
    font-size: var(--su-size-2s);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-2s--desktop,
  .su-text-12--desktop {
    font-size: var(--su-size-2s);
  }
}

.su-text-s,
.su-text-14 {
  font-size: var(--su-size-s);
}
@media (width <= 768px) {
  .su-text-s--mobile,
  .su-text-14--mobile {
    font-size: var(--su-size-s);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-s--desktop,
  .su-text-14--desktop {
    font-size: var(--su-size-s);
  }
}

.su-text-r,
.su-text-16 {
  font-size: var(--su-size-r);
}
@media (width <= 768px) {
  .su-text-r--mobile,
  .su-text-16--mobile {
    font-size: var(--su-size-r);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-r--desktop,
  .su-text-16--desktop {
    font-size: var(--su-size-r);
  }
}

.su-text-m,
.su-text-18 {
  font-size: var(--su-size-m);
}
@media (width <= 768px) {
  .su-text-m--mobile,
  .su-text-18--mobile {
    font-size: var(--su-size-r);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-m--desktop,
  .su-text-18--desktop {
    font-size: var(--su-size-m);
  }
}

.su-text-l,
.su-text-20 {
  font-size: var(--su-size-l);
}
@media (width <= 768px) {
  .su-text-l--mobile,
  .su-text-20--mobile {
    font-size: var(--su-size-l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-l--desktop,
  .su-text-20--desktop {
    font-size: var(--su-size-l);
  }
}

.su-text-2l,
.su-text-24 {
  font-size: var(--su-size-2l);
}
@media (width <= 768px) {
  .su-text-2l--mobile,
  .su-text-24--mobile {
    font-size: var(--su-size-2l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-2l--desktop,
  .su-text-24--desktop {
    font-size: var(--su-size-2l);
  }
}

.su-text-3l,
.su-text-28 {
  font-size: var(--su-size-3l);
}
@media (width <= 768px) {
  .su-text-3l--mobile,
  .su-text-28--mobile {
    font-size: var(--su-size-3l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-3l--desktop,
  .su-text-28--desktop {
    font-size: var(--su-size-3l);
  }
}

.su-text-4l,
.su-text-32 {
  font-size: var(--su-size-4l);
}
@media (width <= 768px) {
  .su-text-4l--mobile,
  .su-text-32--mobile {
    font-size: var(--su-size-4l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-4l--desktop,
  .su-text-32--desktop {
    font-size: var(--su-size-4l);
  }
}

.su-text-5l,
.su-text-48 {
  font-size: var(--su-size-5l);
}
@media (width <= 768px) {
  .su-text-5l--mobile,
  .su-text-48--mobile {
    font-size: var(--su-size-5l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-5l--desktop,
  .su-text-48--desktop {
    font-size: var(--su-size-5l);
  }
}

.su-text-6l,
.su-text-64 {
  font-size: var(--su-size-6l);
}
@media (width <= 768px) {
  .su-text-6l--mobile,
  .su-text-64--mobile {
    font-size: var(--su-size-6l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-6l--desktop,
  .su-text-64--desktop {
    font-size: var(--su-size-6l);
  }
}

.su-text-7l,
.su-text-96 {
  font-size: var(--su-size-7l);
}
@media (width <= 768px) {
  .su-text-7l--mobile,
  .su-text-96--mobile {
    font-size: var(--su-size-7l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-7l--desktop,
  .su-text-96--desktop {
    font-size: var(--su-size-7l);
  }
}

.su-text-8l,
.su-text-128 {
  font-size: var(--su-size-8l);
}
@media (width <= 768px) {
  .su-text-8l--mobile,
  .su-text-128--mobile {
    font-size: var(--su-size-8l);
  }
}
@media (calc(768px + 1px) <= width) {
  .su-text-8l--desktop,
  .su-text-128--desktop {
    font-size: var(--su-size-8l);
  }
}

/* -------------------------------
 *  leading
 * ---------------------------- */
.su-leading-100 {
  line-height: 1;
}

.su-leading-125 {
  line-height: 1.25;
}

.su-leading-150 {
  line-height: 1.5;
}

.su-leading-175 {
  line-height: 1.75;
}

.su-leading-200 {
  line-height: 2;
}

.su-leading-225 {
  line-height: 2.25;
}

.su-leading-250 {
  line-height: 2.5;
}

.su-leading-trim::before, .su-leading-trim::after {
  content: "";
  display: block;
  inline-size: 0;
  block-size: 1px;
}
.su-leading-trim::before {
  -webkit-margin-after: calc((1em - 1lh) / 2);
          margin-block-end: calc((1em - 1lh) / 2);
}
.su-leading-trim::after {
  -webkit-margin-before: calc((1em - 1lh) / 2);
          margin-block-start: calc((1em - 1lh) / 2);
}

/* -------------------------------
 *  tracking
 * ---------------------------- */
.su-traking-0 {
  letter-spacing: 0;
}

.su-traking-1-40 {
  letter-spacing: 0.025em;
}
.su-traking-1-40-exp {
  letter-spacing: 0.025em;
}
.su-traking-1-40-cond {
  letter-spacing: -0.025em;
}

.su-traking-1-36 {
  letter-spacing: 0.02777em;
}
.su-traking-1-36-exp {
  letter-spacing: 0.02777em;
}
.su-traking-1-36-cond {
  letter-spacing: -0.02777em;
}

.su-traking-1-32 {
  letter-spacing: 0.03125em;
}
.su-traking-1-32-exp {
  letter-spacing: 0.03125em;
}
.su-traking-1-32-cond {
  letter-spacing: -0.03125em;
}

.su-traking-1-28 {
  letter-spacing: 0.03571em;
}
.su-traking-1-28-exp {
  letter-spacing: 0.03571em;
}
.su-traking-1-28-cond {
  letter-spacing: -0.03571em;
}

.su-traking-1-24 {
  letter-spacing: 0.04166em;
}
.su-traking-1-24-exp {
  letter-spacing: 0.04166em;
}
.su-traking-1-24-cond {
  letter-spacing: -0.04166em;
}

.su-traking-1-20 {
  letter-spacing: 0.05em;
}
.su-traking-1-20-exp {
  letter-spacing: 0.05em;
}
.su-traking-1-20-cond {
  letter-spacing: -0.05em;
}

.su-traking-1-16 {
  letter-spacing: 0.0625em;
}
.su-traking-1-16-exp {
  letter-spacing: 0.0625em;
}
.su-traking-1-16-cond {
  letter-spacing: -0.0625em;
}

.su-traking-1-12 {
  letter-spacing: 0.08333em;
}
.su-traking-1-12-exp {
  letter-spacing: 0.08333em;
}
.su-traking-1-12-cond {
  letter-spacing: -0.08333em;
}

.su-traking-1-8 {
  letter-spacing: 0.125em;
}
.su-traking-1-8-exp {
  letter-spacing: 0.125em;
}
.su-traking-1-8-cond {
  letter-spacing: -0.125em;
}

.su-traking-1-4 {
  letter-spacing: 0.25em;
}
.su-traking-1-4-exp {
  letter-spacing: 0.25em;
}
.su-traking-1-4-cond {
  letter-spacing: -0.25em;
}

/* -------------------------------
 *  text decoration
 * ---------------------------- */
.su-text-italic {
  font-style: var(--su-font-italic);
}

.su-text-underline {
  -webkit-text-decoration: var(--su-font-underline);
          text-decoration: var(--su-font-underline);
}

.su-text-strike {
  -webkit-text-decoration: var(--su-font-strike);
          text-decoration: var(--su-font-strike);
}

.su-text-plane {
  text-decoration: none;
}

/* -------------------------------
 *  text transform
 * ---------------------------- */
.su-text-upper {
  text-transform: uppercase;
}

.su-text-lower {
  text-transform: lowercase;
}

.su-text-capital {
  text-transform: capitalize;
}

/* -------------------------------
 *  text format
 * ---------------------------- */
.su-text-break-all {
  word-break: break-all;
}

.su-text-keep-all {
  word-break: keep-all;
}

body {
  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

/*
  layout
*/
.l-base {
  overflow-x: hidden;
}

.l-header {
  padding: 1.5rem 3.5rem 0 3.5rem;
}
@media (width <= 768px) {
  .l-header {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding: 1.5rem 1.5rem 0 1.5rem;
    z-index: 1;
  }
}
.l-header .__logo {
  width: clamp(120px, 10vw, 180px);
}
@media (width <= 768px) {
  .l-header .__logo {
    display: none;
  }
}

.l-footer .__wrapper {
  -ms-grid-columns: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  -ms-grid-rows: auto;
  grid-template-rows: auto;
}

.l-footer .__wrapper > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.l-footer .__background,
.l-footer .__foreground {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
.l-footer .__background {
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
  z-index: 0;
}
.l-footer .__background .__image-element.__image-element--1st {
  bottom: 50%;
  left: 0;
  translate: -30% 100%;
}
@media (width <= 768px) {
  .l-footer .__background .__image-element.__image-element--1st {
    bottom: 0;
    max-width: 60vw;
    translate: -30% -70%;
  }
}
.l-footer .__background .__image-bg .__image {
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center bottom;
     object-position: center bottom;
}
.l-footer .__foreground {
  padding: 0 2rem 4rem 2rem;
  z-index: 1;
}
@media (width <= 768px) {
  .l-footer .__foreground {
    padding: 0 0 1.5rem 0;
  }
}
.l-footer .__foreground .__copyright {
  color: #fff;
  font-size: 1.25rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__copyright {
    font-size: 0.75rem;
  }
}
.l-footer .__foreground .__inner {
  row-gap: 15rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__inner {
    row-gap: 3rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st {
  row-gap: 3rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st {
    row-gap: 1.5rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st > * {
  z-index: 2;
}
.l-footer .__foreground .__block-1.__block-1--1st .__title {
  max-width: 174px;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__title .__image {
    max-width: 7rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__image-element {
  z-index: 1;
  right: 100%;
  bottom: 0;
  position: absolute;
  translate: -20% -10%;
  max-width: 146px;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__image-element {
    max-width: 14vw;
    translate: 85% 0;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__info {
  row-gap: 2rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__info {
    row-gap: 1rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__heading .__main {
  font-size: 2rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__heading .__main {
    font-size: 1rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__heading .__sub {
  font-size: 1.5rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__heading .__sub {
    font-size: 0.75rem;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__tel .__image {
  max-width: 534px;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__tel .__image {
    max-width: 280px;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__button-wrapper {
  margin-top: 1rem;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__button-wrapper {
    margin-top: 0;
  }
}
.l-footer .__foreground .__block-1.__block-1--1st .__button-wrapper .__button {
  max-width: 316px;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.l-footer .__foreground .__block-1.__block-1--1st .__button-wrapper .__button:hover {
  opacity: 0.8;
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__button-wrapper .__button {
    max-width: 200px;
  }
}
@media (width <= 768px) {
  .l-footer .__foreground .__block-1.__block-1--1st .__banners {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (hover: hover) {
  .l-footer .__foreground .__block-1.__block-1--1st .__banners .__banner-wrapper a {
    -webkit-transition: -webkit-filter 0.3s;
    transition: -webkit-filter 0.3s;
    transition: filter 0.3s;
    transition: filter 0.3s, -webkit-filter 0.3s;
  }
  .l-footer .__foreground .__block-1.__block-1--1st .__banners .__banner-wrapper a:hover {
    -webkit-filter: brightness(1.5);
            filter: brightness(1.5);
  }
}
/*
  components
*/
@media (width <= 768px) {
  .c-global-navi {
    display: none;
  }
}
.c-global-navi .__list {
  font-size: 1.25rem;
  -webkit-column-gap: 2rem;
     -moz-column-gap: 2rem;
          column-gap: 2rem;
  padding-top: 2rem;
}

.c-hamburger {
  display: none;
  font-size: 0;
  width: 2rem;
  height: 1.5rem;
  position: relative;
  margin-left: auto;
}
.c-hamburger::before, .c-hamburger::after, .c-hamburger > * {
  content: "";
  position: absolute;
  right: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  border-radius: 2px;
}
.c-hamburger::before {
  top: 0;
}
.c-hamburger::after {
  bottom: 0;
}
.c-hamburger > * {
  top: calc(50% - 1px);
}
@media (width <= 768px) {
  .c-hamburger {
    display: block;
  }
}

.c-dialog {
  width: 100%;
  height: 100%;
  margin: auto;
  border-radius: 2rem;
  background: #d8b44a;
  padding: 2rem;
}
.c-dialog::-ms-backdrop {
  background: rgba(0, 0, 0, 0.75);
}
.c-dialog::backdrop {
  background: rgba(0, 0, 0, 0.75);
}
.c-dialog .__item {
  font-size: 1.5rem;
}

/*
  front-page
*/
.p-front-page .__wrapper {
  -ms-grid-columns: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  -ms-grid-rows: auto;
  grid-template-rows: auto;
}
.p-front-page .__wrapper > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.p-front-page .__background,
.p-front-page .__foreground {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
.p-front-page .p-main-visual {
  pointer-events: none;
}
.p-front-page .p-main-visual .__wrapper {
  translate: 0 -4vw;
  margin-bottom: -4vw;
}
@media (width <= 768px) {
  .p-front-page .p-main-visual .__wrapper {
    translate: 0 0;
    margin-bottom: 0;
  }
}
.p-front-page .p-main-visual .__background {
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
  position: relative;
}
.p-front-page .p-main-visual__people01 {
  position: absolute;
  top: 21%;
  left: 17%;
  width: 11%;
}
@media (width <= 768px) {
  .p-front-page .p-main-visual__people01 {
    top: 27%;
    left: 6%;
    width: 14.4%;
  }
}
.p-front-page .p-main-visual__people02 {
  position: absolute;
  top: 56%;
  right: 14%;
  width: 16.6%;
}
@media (width <= 768px) {
  .p-front-page .p-main-visual__people02 {
    top: 50%;
    right: 7%;
    width: 17%;
  }
}
.p-front-page .p-main-visual__people03 {
  position: absolute;
  bottom: 1.5%;
  left: 8.5%;
  width: 11.9%;
}
@media (width <= 768px) {
  .p-front-page .p-main-visual__people03 {
    bottom: 0;
    left: 9.5%;
    width: 12.5%;
  }
}
.p-front-page .p-section-01 {
  padding: 5rem 0;
}
@media (width <= 768px) {
  .p-front-page .p-section-01 {
    padding: 2rem 0;
  }
}
.p-front-page .p-section-01 .__background .__image-element {
  position: absolute;
  top: 50%;
}
.p-front-page .p-section-01 .__background .__image-element.__image-element--1st {
  left: 0;
  translate: -50% -50%;
}
@media (width <= 768px) {
  .p-front-page .p-section-01 .__background .__image-element.__image-element--1st {
    translate: -60% -180%;
    scale: 0.5;
  }
}
.p-front-page .p-section-01 .__background .__image-element.__image-element--2nd {
  right: 0;
  translate: 60% -50%;
}
@media (width <= 768px) {
  .p-front-page .p-section-01 .__background .__image-element.__image-element--2nd {
    translate: 60% -180%;
    scale: 0.5;
  }
}
.p-front-page .p-section-01 .__foreground .__block-1 {
  padding: 0 2rem;
}
.p-front-page .p-section-01 .__foreground .__block-1.__block-1--1st {
  row-gap: 3rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-01 .__foreground .__block-1.__block-1--1st {
    row-gap: 1.5rem;
  }
}
.p-front-page .p-section-01 .__foreground .__block-1.__block-1--1st .__body {
  font-size: 1.5rem;
  line-height: 1.8;
}
@media (width <= 768px) {
  .p-front-page .p-section-01 .__foreground .__block-1.__block-1--1st .__body {
    font-size: 0.875rem;
  }
}
.p-front-page .p-section-01 .__foreground .__block-1.__block-1--1st .__body .__highlight {
  color: #ae344f;
  font-size: 1.25em;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__title .__image,
  .p-front-page .p-section-03 .__title .__image,
  .p-front-page .p-section-04 .__title .__image {
    max-width: 10rem;
  }
}
.p-front-page .p-section-02 {
  background: url(../../public/images/bg_about_top.png) no-repeat top center/contain, url(../../public/images/bg_about_bottom.png) no-repeat bottom center/contain #f7eee0;
  padding-bottom: 90px;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd {
  z-index: 1;
}
@media (width <= 992px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd {
    padding: 3rem 0;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table-wrapper {
  max-width: 820px;
  margin: 1.5rem auto 0 auto;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table-wrapper {
    margin: 0.5rem auto 0 auto;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table {
  border-collapse: separate;
  border-spacing: 1.75rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table {
    border-spacing: 0.75rem;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__label .__badge {
  font-size: 1.5rem;
  padding: 0.5rem 1.5rem 0.75rem 2rem;
  border-radius: 1rem;
  background: #d8b44a;
  display: inline-block;
  font-weight: normal;
  letter-spacing: 0.5em;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__label .__badge {
    border-radius: 0.5rem;
    font-size: 0.875rem;
    padding: 0.25rem 0.75rem 0.25rem 1rem;
    letter-spacing: 0.25em;
    min-width: 5.5em;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__body .__text {
  font-size: 1.5rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__body .__text {
    font-size: 0.75rem;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__body .__text.__text--large {
  font-size: 2em;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__table .__body .__text.__text--large {
    font-size: 1em;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__button-wrapper {
  text-align: center;
  margin-top: 1rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__button-wrapper {
    margin-top: 0;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__button-wrapper .__button {
  max-width: 400px;
  display: inline-block;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__button-wrapper .__button:hover {
  opacity: 0.8;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--2nd .__button-wrapper .__button {
    max-width: 200px;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .p-front-page-about-people {
  position: absolute;
  top: 0;
  right: 0;
  width: 195px;
  z-index: 1;
}
@media (width <= 992px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .p-front-page-about-people {
    top: -135px;
  }
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .p-front-page-about-people {
    scale: 0.5;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-top: 60px;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon {
    font-size: 18px;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon::before, .p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 1.8em;
  background-color: #000;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon::before {
  -webkit-transform: rotate(-28deg);
          transform: rotate(-28deg);
  margin-right: 1em;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__balloon::after {
  -webkit-transform: rotate(28deg);
          transform: rotate(28deg);
  margin-left: 1em;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 584px;
  margin: 0 auto;
  position: relative;
  margin-top: 40px;
  z-index: 2;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links.coming-soon::after {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 30px;
  font-weight: bold;
  width: 110%;
  height: 110%;
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: rgba(255, 255, 255, 0.8);
  top: 50%;
  left: 50%;
  content: "Coming Soon...";
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links.coming-soon::after {
    font-size: 18px;
  }
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links a {
  width: 41.6%;
  display: block;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links a:hover {
  opacity: 0.9;
}
.p-front-page .p-section-02 .__foreground .__block-1.__block-1--3rd .__links a img {
  -webkit-filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
          filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
}
.p-front-page .p-section-02 .__list-info {
  margin: 4rem auto 0 auto;
  max-width: 890px;
  font-size: 1.25rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info {
    margin: 2.5rem auto 0 auto;
    font-size: 0.875rem;
  }
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info .__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.p-front-page .p-section-02 .__list-info .__label {
  background: #d8b44a;
  padding: 0.5rem 1.25rem;
  border-radius: 0.75rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info .__label {
    font-size: 0.75rem;
    padding: 0.5rem 0.75rem;
  }
}
.p-front-page .p-section-02 .__list-info .__icon .__icon-text {
  background: #ae344f;
  color: #fff;
  font-size: 1rem;
  padding: 0.25rem 0.75rem;
  border-radius: 0.5rem;
  display: inline-block;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info .__icon .__icon-text {
    display: none;
  }
}
.p-front-page .p-section-02 .__list-info .__icon .__image {
  display: none;
  max-width: 2rem;
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info .__icon .__image {
    display: block;
  }
}
@media (width <= 768px) {
  .p-front-page .p-section-02 .__list-info .__body {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.p-front-page .p-section-03 {
  background: url(../../public/images/bg_news_top.png) no-repeat top center/contain, url(../../public/images/bg_news_bottom.png) no-repeat bottom center/contain #f7eee0;
  margin-top: 65px;
  padding-top: 90px;
  padding-bottom: 140px;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 {
    padding-bottom: 70px;
  }
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__background .__image-bg {
    scale: 1.6;
    -webkit-transform-origin: center top;
            transform-origin: center top;
  }
}
.p-front-page .p-section-03 .__background .__image-element.__image-element--2nd {
  top: 0;
  left: 0;
  translate: -60% -20%;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__background .__image-element.__image-element--2nd {
    translate: -60% -30%;
  }
}
.p-front-page .p-section-03 .__background .__image-element.__image-element--3rd {
  bottom: 0;
  right: 0;
  translate: 40% -20%;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__background .__image-element.__image-element--3rd {
    translate: 45% 20%;
    scale: 0.6;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--1st .__image-wrapper {
  translate: -23% 0;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--1st .__image-wrapper {
    position: absolute;
    right: 0;
    translate: -33% -50%;
    scale: 0.4;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  position: relative;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon {
    font-size: 18px;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon::before, .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 1.8em;
  background-color: #000;
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon::before {
  -webkit-transform: rotate(-28deg);
          transform: rotate(-28deg);
  margin-right: 0.3em;
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon::after {
  -webkit-transform: rotate(28deg);
          transform: rotate(28deg);
  margin-left: 0.3em;
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon .p-front-page-news__people1 {
  position: absolute;
  top: -80%;
  left: 0;
  width: 197px;
  z-index: 1;
}
@media (width <= 992px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon .p-front-page-news__people1 {
    top: -186%;
  }
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon .p-front-page-news__people1 {
    scale: 0.5;
    top: -250%;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon .p-front-page-news__people2 {
  position: absolute;
  top: 0;
  right: 0;
  width: 162px;
  z-index: 1;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__balloon .p-front-page-news__people2 {
    scale: 0.5;
    right: -3rem;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__title {
  margin-top: 33px;
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__title .__image {
  height: 85px;
  max-width: 100%;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--2nd .__title .__image {
    max-height: 41px;
  }
}
.p-front-page .p-section-03 .__foreground .__block-1.__block-1--3rd {
  margin-top: 123px;
}
@media (width <= 768px) {
  .p-front-page .p-section-03 .__foreground .__block-1.__block-1--3rd {
    margin-top: 50px;
  }
}
.p-front-page .p-section-04 .__background .__image-element.__image-element--1st {
  top: 0;
  left: 0;
  translate: -50% -60%;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__background .__image-element.__image-element--1st {
    scale: 0.5;
  }
}
.p-front-page .p-section-04 .__background .__image-element.__image-element--2nd {
  bottom: 0;
  right: 0;
  translate: 45% 70%;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__background .__image-element.__image-element--2nd {
    translate: 45% 55%;
    scale: 0.5;
  }
}
.p-front-page .p-section-04 .__foreground .__block-1.__block-1--1st .__image-wrapper {
  translate: 0 -20%;
  max-width: 224px;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__foreground .__block-1.__block-1--1st .__image-wrapper {
    translate: -30% -20%;
    scale: 0.5;
  }
}
.p-front-page .p-section-04 .__foreground .__block-1.__block-1--2nd {
  padding: 5rem 0;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__foreground .__block-1.__block-1--2nd {
    padding: 3rem 0 2rem 0;
  }
}
.p-front-page .p-section-04 .__foreground .__block-1.__block-1--2nd .__map-wrapper {
  margin: 4rem auto 0 auto;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__foreground .__block-1.__block-1--2nd .__map-wrapper {
    margin: 1.5rem auto 0 auto;
  }
}
.p-front-page .p-section-04 .__foreground .__block-1.__block-1--2nd .__map-wrapper iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 16/9;
}
.p-front-page .p-section-04 .__foreground .__block-1.__block-1--3rd .__image-wrapper {
  right: 0;
  top: 0;
  max-width: 138px;
}
@media (width <= 768px) {
  .p-front-page .p-section-04 .__foreground .__block-1.__block-1--3rd .__image-wrapper {
    translate: 10% -30%;
    scale: 0.5;
  }
}

/*
  contact-page
*/
.p-contact-page .__wrapper {
  -ms-grid-columns: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  -ms-grid-rows: auto;
  grid-template-rows: auto;
}
.p-contact-page .__wrapper > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.p-contact-page .__background,
.p-contact-page .__foreground {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
.p-contact-page .__background .__image-bg .__image {
  -o-object-fit: cover;
     object-fit: cover;
}
.p-contact-page .__foreground .__block-1 {
  max-width: 1060px;
  margin: 0 auto;
  padding: 6rem 0;
}
.p-contact-page .__foreground .__lead {
  font-size: 1.5rem;
  line-height: 1.8;
  margin: 3rem 0;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__lead {
    font-size: 1rem;
  }
}
.p-contact-page .__foreground .__form-wrapper {
  background: #fff;
  padding: 3rem;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__form-wrapper {
    padding: 2rem 1rem;
  }
}
.p-contact-page .__foreground .__list {
  -ms-grid-columns: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  row-gap: 2rem;
}
.p-contact-page .__foreground .__item {
  -ms-grid-columns: minmax(0, 1fr) 1rem minmax(0, 1.4fr);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__item {
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.5rem;
  }
}
.p-contact-page .__foreground .__label {
  font-size: 1.5rem;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__label {
    font-size: 1.25rem;
  }
}
.p-contact-page .__foreground .__label.__label--required::after {
  content: "※";
}
.p-contact-page .__foreground .__body {
  padding-right: 3rem;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__body {
    padding-right: 0;
  }
}
.p-contact-page .__foreground .__button-wrapper {
  margin-top: 3rem;
}
@media (width <= 768px) {
  .p-contact-page .__foreground .__button-wrapper {
    margin-top: 1.5rem;
  }
}
.p-contact-page .__foreground input[type=text],
.p-contact-page .__foreground input[type=email],
.p-contact-page .__foreground input[type=tel],
.p-contact-page .__foreground textarea {
  font-size: 1.5rem;
  padding: 0.5rem 1rem;
  background: #f4e3e8;
  width: 100%;
}
.p-contact-page .__foreground textarea {
  min-height: 10lh;
  resize: vertical;
}
.p-contact-page .__foreground input[type=submit] {
  font-size: 0;
  background: url(../public/images/button_submit.png) no-repeat center center/contain;
  width: 262px;
  height: 64px;
  border: none;
  cursor: pointer;
  -webkit-transition: -webkit-filter 0.3s;
  transition: -webkit-filter 0.3s;
  transition: filter 0.3s;
  transition: filter 0.3s, -webkit-filter 0.3s;
}
@media (hover: hover) {
  .p-contact-page .__foreground input[type=submit]:hover {
    -webkit-filter: brightness(1.2);
            filter: brightness(1.2);
  }
}

.p-section-03 .__button-wrapper .__button {
  max-width: 400px;
  margin: 0 auto;
  margin-top: 1rem;
}

@media (width <= 768px) {
  .p-section-03 .__button-wrapper .__button {
    max-width: 200px;
  }
}
.p-front-page-profile__cloud1 {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translate(40%, -55%);
          transform: translate(40%, -55%);
}
.p-front-page-profile__cloud2 {
  position: absolute;
  bottom: 0;
  left: 0;
  -webkit-transform: translate(-60%, 25%);
          transform: translate(-60%, 25%);
}
.p-front-page-profile .__block-1--2nd {
  margin: 4rem auto 0 auto;
  max-width: 820px;
  padding: 0;
}
@media (width <= 768px) {
  .p-front-page-profile .__block-1--2nd {
    margin: 2.5rem auto 0 auto;
    padding: 0 1.5rem;
  }
}
.p-front-page-profile .__chairman-profile .__frame-outer {
  left: -8px;
  top: -8px;
  width: calc(100% + 16px);
  height: calc(100% + 16px);
  border-radius: 1.8rem;
  overflow: hidden;
}
.p-front-page-profile .__chairman-profile .__frame-inner {
  left: -2px;
  top: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  border-radius: 1rem;
}
.p-front-page-profile .__chairman-profile .__frame-outer,
.p-front-page-profile .__chairman-profile .__frame-inner {
  z-index: 1;
  background: #fff;
  border: 3px solid #d8b44a;
  overflow: hidden;
}
.p-front-page-profile .__chairman-profile .__top-left,
.p-front-page-profile .__chairman-profile .__top-right,
.p-front-page-profile .__chairman-profile .__bottom-left,
.p-front-page-profile .__chairman-profile .__bottom-right {
  background: #fff;
  background: linear-gradient(315deg, #ffffff 69%, transparent 69%);
  border-radius: 24px 0 0 0;
  z-index: 2;
}
.p-front-page-profile .__chairman-profile .__top-left .__image,
.p-front-page-profile .__chairman-profile .__top-right .__image,
.p-front-page-profile .__chairman-profile .__bottom-left .__image,
.p-front-page-profile .__chairman-profile .__bottom-right .__image {
  width: 27px;
  height: 27px;
}
.p-front-page-profile .__chairman-profile .__top-left,
.p-front-page-profile .__chairman-profile .__top-right {
  top: -8px;
}
.p-front-page-profile .__chairman-profile .__bottom-left,
.p-front-page-profile .__chairman-profile .__bottom-right {
  bottom: -8px;
}
.p-front-page-profile .__chairman-profile .__top-left,
.p-front-page-profile .__chairman-profile .__bottom-left {
  left: -8px;
}
.p-front-page-profile .__chairman-profile .__top-right,
.p-front-page-profile .__chairman-profile .__bottom-right {
  right: -8px;
}
.p-front-page-profile .__chairman-profile .__top-right {
  rotate: 90deg;
}
.p-front-page-profile .__chairman-profile .__bottom-right {
  rotate: 180deg;
}
.p-front-page-profile .__chairman-profile .__bottom-left {
  rotate: 270deg;
}
.p-front-page-profile .__chairman-profile .__frame-inner {
  padding: 2rem;
}
.p-front-page-profile .__chairman-profile .__internal {
  z-index: 3;
  padding: 3rem;
  -ms-grid-columns: minmax(0, 2fr) 1.5rem minmax(0, 1fr);
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  -ms-grid-rows: (auto)[2];
  grid-template-rows: repeat(2, auto);
  -webkit-column-gap: 1.5rem;
     -moz-column-gap: 1.5rem;
          column-gap: 1.5rem;
}
.p-front-page-profile .__chairman-profile .__internal > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.p-front-page-profile .__chairman-profile .__internal > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.p-front-page-profile .__chairman-profile .__internal > *:nth-child(3) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.p-front-page-profile .__chairman-profile .__internal > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__internal {
    -ms-grid-columns: minmax(0, 1.2fr) 1rem minmax(0, 1fr);
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    -webkit-column-gap: 1rem;
       -moz-column-gap: 1rem;
            column-gap: 1rem;
    row-gap: 0.5rem;
    padding: 1.5rem 1rem;
  }
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__content {
    display: -ms-grid;
    display: grid;
    place-items: center;
  }
}
.p-front-page-profile .__chairman-profile .__heading {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
.p-front-page-profile .__chairman-profile .__heading .__position {
  font-size: 1.25rem;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__heading .__position {
    font-size: 0.75rem;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1/2;
  }
}
.p-front-page-profile .__chairman-profile .__heading .__name {
  -webkit-column-gap: 0.5rem;
     -moz-column-gap: 0.5rem;
          column-gap: 0.5rem;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__heading .__name {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.p-front-page-profile .__chairman-profile .__heading .__name .__large {
  font-size: 2.5rem;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__heading .__name .__large {
    font-size: 1.75rem;
  }
}
.p-front-page-profile .__chairman-profile .__heading .__name .__small {
  font-size: 1.5rem;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__heading .__name .__small {
    font-size: 1rem;
  }
}
.p-front-page-profile .__chairman-profile .__introduction {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
  font-size: 1rem;
  line-height: 1.8;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__introduction {
    font-size: 0.75rem;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    grid-row: 2/3;
  }
}
.p-front-page-profile .__chairman-profile .__thumbnail {
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  -ms-flex-line-pack: start;
      align-content: start;
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__thumbnail {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    grid-column: 2/3;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1/2;
  }
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__thumbnail .__caption {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media (width <= 768px) {
  .p-front-page-profile .__chairman-profile .__thumbnail .__caption .__text {
    font-size: 0.75rem;
  }
}

.js-fadein {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.js-fadein.-show {
  opacity: 1;
  visibility: visible;
}

.js-mv-fadein {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.js-mv-fadein.-show {
  opacity: 1;
  visibility: visible;
}

.subpage {
  background: url(../../public/images/bg_sub_top.png) no-repeat top center/contain;
}
.subpage .l-footer {
  margin-top: 5rem;
}

.p-news-button {
  text-align: center;
}
.p-news-button a {
  display: inline-block;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.p-news-button a:hover {
  opacity: 0.7;
}
.p-news-button a img {
  height: 45px;
  width: auto;
}
@media (width <= 768px) {
  .p-news-button a img {
    height: 36px;
  }
}
.p-news__top-title {
  text-align: center;
}
.p-news__top-title img {
  max-height: 64px;
  width: auto;
  display: inline;
}
@media (width <= 768px) {
  .p-news__top-title img {
    max-height: 41px;
    margin-top: 70px;
  }
}
.p-news-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  max-width: 910px;
  -webkit-column-gap: 5%;
     -moz-column-gap: 5%;
          column-gap: 5%;
  row-gap: 60px;
  margin: 0 auto;
  margin-top: 40px;
}
@media (width <= 768px) {
  .p-news-list {
    row-gap: 30px;
  }
}
.p-news-list li {
  width: 30%;
}
@media (width <= 768px) {
  .p-news-list li {
    width: 47.5%;
  }
}
.p-news-list li a {
  text-decoration: none;
  -webkit-transition: ease 0.3s;
  transition: ease 0.3s;
}
.p-news-list li a:hover {
  opacity: 0.7;
}
.p-news-list__date {
  font-size: 1em;
  font-weight: bold;
}
.p-news-list__title {
  font-size: 18px;
  font-weight: bold;
  margin-top: 0.5em;
}
@media (width <= 768px) {
  .p-news-list__title {
    font-size: 14px;
  }
}
.p-news-cat span {
  display: inline-block;
  color: #fff;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  font-size: 15px;
  padding: 0 0.5em;
  background-color: #394c74;
}
@media (width <= 768px) {
  .p-news-cat span {
    font-size: 13px;
  }
}
.p-news-cat.-news span {
  background-color: #ab2a49;
}
.p-news-cat.-pre-event1 span {
  background-color: #5667ab;
}
.p-news-cat.-pre-event2 span {
  background-color: #85a036;
}
.p-news-cat.-pre-event3 span {
  background-color: #d8b44a;
}
.p-news-pagination {
  margin-top: 80px;
}
.p-news-pagination__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 14px;
  font-weight: bold;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
}
.p-news-pagination__item span,
.p-news-pagination__item a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 31px;
  height: 31px;
  border: #cfd0d0 solid 1px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #cfd0d0;
  white-space: nowrap;
  text-decoration: none;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.p-news-pagination__item a {
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  text-decoration: none;
}
.p-news-pagination__item a:hover {
  opacity: 0.8;
}
.p-news-pagination__item span.current {
  border: #d8b44a solid 1px;
  background-color: #d8b44a;
  color: #fff;
}
.p-news-post {
  margin-top: 80px;
}
.p-news-post__inner {
  max-width: calc(735px + 1.75rem);
  padding: 0 0.875rem;
  margin: 0 auto;
}
.p-news-post__title {
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5em;
}
@media (width <= 768px) {
  .p-news-post__title {
    font-size: 22px;
  }
}
.p-news-post__thumb {
  margin-top: 8px;
}
.p-news-post__contents {
  font-size: 25px;
  margin-top: 20px;
  line-height: 2;
  margin-bottom: 70px;
}
@media (width <= 768px) {
  .p-news-post__contents {
    font-size: 16px;
  }
}
.p-news-archive {
  margin-top: 80px;
}
.p-news-archive__inner {
  max-width: calc(735px + 1.75rem);
  padding: 0 0.875rem;
  margin: 0 auto;
}