@charset "UTF-8";
/*!
* AsagaoUI v0.1.8
* Copyright 2025 Hiroshi ISOBE
* Licensed under MIT
*/
@layer reset, base, layout, components, forms, utilities;
@layer reset {
/***
The new CSS reset - version 1.11.3 (last updated 25.08.2024)
GitHub page: https://github.com/elad2412/the-new-css-reset
***/
/*
Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
- The "symbol *" part is to solve Firefox SVG sprite bug
- The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
*/
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
all: unset;
display: revert;
}
/* Preferred box-sizing value */
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Fix mobile Safari increase font-size on landscape mode */
html {
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
text-size-adjust: none;
}
/* Reapply the pointer cursor for anchor tags */
a, button {
cursor: revert;
}
/* Remove list styles (bullets/numbers) */
ol, ul, menu, summary {
list-style: none;
}
/* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */
ol {
counter-reset: revert;
}
/* For images to not be able to exceed their container */
img {
max-inline-size: 100%;
max-block-size: 100%;
}
/* removes spacing between cells in tables */
table {
border-collapse: collapse;
}
/* Safari - solving issue when using user-select:none on the text input doesn't working */
input, textarea {
-webkit-user-select: auto;
}
/* revert the 'white-space' property for textarea elements on Safari */
textarea {
white-space: revert;
}
/* minimum style to allow to style meter element */
meter {
-webkit-appearance: revert;
appearance: revert;
}
/* preformatted text - use only for this feature */
:where(pre) {
all: revert;
box-sizing: border-box;
}
/* reset default text opacity of input placeholder */
::placeholder {
color: unset;
}
/* fix the feature of 'hidden' attribute.
display:revert; revert to element instead of attribute */
:where([hidden]) {
display: none;
}
/* revert for bug in Chromium browsers
- fix for the content editable attribute will work properly.
- webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
:where([contenteditable]:not([contenteditable=false])) {
-moz-user-modify: read-write;
-webkit-user-modify: read-write;
overflow-wrap: break-word;
-webkit-line-break: after-white-space;
-webkit-user-select: auto;
}
/* apply back the draggable feature - exist only in Chromium and Safari */
:where([draggable=true]) {
-webkit-user-drag: element;
}
/* Revert Modal native behavior */
:where(dialog:modal) {
all: revert;
box-sizing: border-box;
}
/* Remove details summary webkit styles */
::-webkit-details-marker {
display: none;
}
}
@layer base {
.body,
.aui {
font-family: "Noto Sans JP", "Noto Sans", sans-serif;
color: #1a1a1a;
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
}
.body img,
.aui img {
display: block;
}
html {
scrollbar-gutter: stable;
}
html:has(:modal) {
overflow: clip;
scrollbar-gutter: auto;
}
body:has(:modal) {
overflow: auto;
scrollbar-gutter: stable;
}
}
@layer layout {
.container-x4k, .container-xxxl, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container-fluid, .container {
margin-right: auto;
margin-left: auto;
padding-left: 1rem;
padding-right: 1rem;
width: 100%;
}
.container-fluid {
max-width: none;
}
@media screen and (min-width: 768px) {
.container {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container {
max-width: 1280px;
}
}
@media screen and (min-width: 1440px) {
.container {
max-width: 1440px;
}
}
@media screen and (min-width: 1920px) {
.container {
max-width: 1920px;
}
}
@media screen and (min-width: 2560px) {
.container {
max-width: 2560px;
}
}
@media screen and (min-width: 3840px) {
.container {
max-width: 3840px;
}
}
@media screen and (min-width: 768px) {
.container-sm {
max-width: 768px;
}
}
@media screen and (min-width: 768px) {
.container-md {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-md {
max-width: 992px;
}
}
@media screen and (min-width: 768px) {
.container-lg {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-lg {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container-lg {
max-width: 1280px;
}
}
@media screen and (min-width: 768px) {
.container-xl {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-xl {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container-xl {
max-width: 1280px;
}
}
@media screen and (min-width: 1440px) {
.container-xl {
max-width: 1440px;
}
}
@media screen and (min-width: 768px) {
.container-xxl {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-xxl {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container-xxl {
max-width: 1280px;
}
}
@media screen and (min-width: 1440px) {
.container-xxl {
max-width: 1440px;
}
}
@media screen and (min-width: 1920px) {
.container-xxl {
max-width: 1920px;
}
}
@media screen and (min-width: 768px) {
.container-xxxl {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-xxxl {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container-xxxl {
max-width: 1280px;
}
}
@media screen and (min-width: 1440px) {
.container-xxxl {
max-width: 1440px;
}
}
@media screen and (min-width: 1920px) {
.container-xxxl {
max-width: 1920px;
}
}
@media screen and (min-width: 2560px) {
.container-xxxl {
max-width: 2560px;
}
}
@media screen and (min-width: 768px) {
.container-x4k {
max-width: 768px;
}
}
@media screen and (min-width: 992px) {
.container-x4k {
max-width: 992px;
}
}
@media screen and (min-width: 1280px) {
.container-x4k {
max-width: 1280px;
}
}
@media screen and (min-width: 1440px) {
.container-x4k {
max-width: 1440px;
}
}
@media screen and (min-width: 1920px) {
.container-x4k {
max-width: 1920px;
}
}
@media screen and (min-width: 2560px) {
.container-x4k {
max-width: 2560px;
}
}
@media screen and (min-width: 3840px) {
.container-x4k {
max-width: 3840px;
}
}
.link, .content a:not([class]) {
color: #00118F;
text-decoration: underline;
text-decoration-thickness: 0.0625rem;
text-underline-offset: 0.1875rem;
}
.link:hover, .content a:hover:not([class]) {
color: #0017C1;
text-decoration-thickness: 0.1875rem;
}
.link:active, .content a:active:not([class]) {
color: #C74700;
text-decoration-thickness: 0.0625rem;
}
.link:focus, .content a:focus:not([class]) {
outline: 0.25rem solid #000000;
outline-offset: 0.125rem;
border-radius: 0.25rem;
background-color: #FFD43D;
box-shadow: 0 0 0 0.125rem #FFD43D;
}
.link[target=_blank]::after, .content a[target=_blank]:not([class])::after, .link[rel=external]::after, .content a[rel=external]:not([class])::after {
display: inline-block;
background-color: #1a1a1a;
width: 1em;
height: 1em;
mask-image: url('data:image/svg+xml;utf8,');
content: "";
margin-left: 4px;
vertical-align: -0.15em;
}
.hs {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h1, .content h1:not([class]) {
font-size: 2rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h2, .content h2:not([class]) {
font-size: 1.75rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h3, .content h3:not([class]) {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h4, .content h4:not([class]) {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h5, .content h5:not([class]) {
font-size: 1rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.h1, .content h1:not([class]) {
font-size: 2.25rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.01rem;
}
.h2, .content h2:not([class]) {
font-size: 2rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h3, .content h3:not([class]) {
font-size: 1.75rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h4, .content h4:not([class]) {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h5, .content h5:not([class]) {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
}
.table {
border-collapse: collapse;
}
.table th,
.table td {
border: 1px solid #949497;
padding: 0.5rem;
}
.table th {
background-color: #f8f8fb;
}
.description-list, .content dl:not([class]) {
display: flex;
flex-direction: column;
}
.description-term, .content dt:not([class]) {
font-size: 1rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.description-term, .content dt:not([class]) {
font-size: 1.0625rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
}
.description-details, .content dd:not([class]) {
margin-left: 2rem;
}
.list, .list-ordered, .content ol:not([class]), .list-unordered, .content ul:not([class]) {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
list-style-position: inside;
display: flex;
flex-direction: column;
gap: 8px;
}
.list-unordered, .content ul:not([class]) {
list-style-type: disc;
}
.list-ordered, .content ol:not([class]) {
list-style-type: decimal;
}
.code, .content code:not([class]) {
padding: 0.1rem 0.25rem;
border-radius: 4px;
background-color: #e6e6e6;
color: #CE0000;
}
.content ul:not([class]),
.content ol:not([class]),
.content p:not([class]) {
margin-top: 1rem;
margin-bottom: 1rem;
}
.content table {
border-collapse: collapse;
}
.content table th,
.content table td {
border: 1px solid #949497;
padding: 0.5rem;
}
.content table th {
background-color: #f8f8fb;
}
.content h1:not([class]) {
margin-top: 4rem;
margin-bottom: 1.5rem;
}
.content h2:not([class]) {
margin-top: 4rem;
margin-bottom: 1.5rem;
}
.content h3:not([class]) {
margin-top: 2.5rem;
margin-bottom: 1.5rem;
}
.content h4:not([class]) {
margin-top: 2.5rem;
margin-bottom: 1rem;
}
.content h5:not([class]) {
margin-top: 2.5rem;
margin-bottom: 1rem;
}
.content h6:not([class]) {
margin-top: 1.5rem;
margin-bottom: 1rem;
}
.content pre {
margin: 0;
overflow: auto;
}
.grid {
display: grid;
grid-template-columns: repeat(12, minmax(0, 1fr));
width: 100%;
}
.col {
grid-column: span 12;
}
.col-1 {
grid-column: span 1;
}
.col-2 {
grid-column: span 2;
}
.col-3 {
grid-column: span 3;
}
.col-4 {
grid-column: span 4;
}
.col-5 {
grid-column: span 5;
}
.col-6 {
grid-column: span 6;
}
.col-7 {
grid-column: span 7;
}
.col-8 {
grid-column: span 8;
}
.col-9 {
grid-column: span 9;
}
.col-10 {
grid-column: span 10;
}
.col-11 {
grid-column: span 11;
}
.col-12 {
grid-column: span 12;
}
@media screen and (min-width: 768px) {
.col-sm-1 {
grid-column: span 1;
}
.col-sm-2 {
grid-column: span 2;
}
.col-sm-3 {
grid-column: span 3;
}
.col-sm-4 {
grid-column: span 4;
}
.col-sm-5 {
grid-column: span 5;
}
.col-sm-6 {
grid-column: span 6;
}
.col-sm-7 {
grid-column: span 7;
}
.col-sm-8 {
grid-column: span 8;
}
.col-sm-9 {
grid-column: span 9;
}
.col-sm-10 {
grid-column: span 10;
}
.col-sm-11 {
grid-column: span 11;
}
.col-sm-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 992px) {
.col-md-1 {
grid-column: span 1;
}
.col-md-2 {
grid-column: span 2;
}
.col-md-3 {
grid-column: span 3;
}
.col-md-4 {
grid-column: span 4;
}
.col-md-5 {
grid-column: span 5;
}
.col-md-6 {
grid-column: span 6;
}
.col-md-7 {
grid-column: span 7;
}
.col-md-8 {
grid-column: span 8;
}
.col-md-9 {
grid-column: span 9;
}
.col-md-10 {
grid-column: span 10;
}
.col-md-11 {
grid-column: span 11;
}
.col-md-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 1280px) {
.col-lg-1 {
grid-column: span 1;
}
.col-lg-2 {
grid-column: span 2;
}
.col-lg-3 {
grid-column: span 3;
}
.col-lg-4 {
grid-column: span 4;
}
.col-lg-5 {
grid-column: span 5;
}
.col-lg-6 {
grid-column: span 6;
}
.col-lg-7 {
grid-column: span 7;
}
.col-lg-8 {
grid-column: span 8;
}
.col-lg-9 {
grid-column: span 9;
}
.col-lg-10 {
grid-column: span 10;
}
.col-lg-11 {
grid-column: span 11;
}
.col-lg-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 1440px) {
.col-xl-1 {
grid-column: span 1;
}
.col-xl-2 {
grid-column: span 2;
}
.col-xl-3 {
grid-column: span 3;
}
.col-xl-4 {
grid-column: span 4;
}
.col-xl-5 {
grid-column: span 5;
}
.col-xl-6 {
grid-column: span 6;
}
.col-xl-7 {
grid-column: span 7;
}
.col-xl-8 {
grid-column: span 8;
}
.col-xl-9 {
grid-column: span 9;
}
.col-xl-10 {
grid-column: span 10;
}
.col-xl-11 {
grid-column: span 11;
}
.col-xl-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 1920px) {
.col-xxl-1 {
grid-column: span 1;
}
.col-xxl-2 {
grid-column: span 2;
}
.col-xxl-3 {
grid-column: span 3;
}
.col-xxl-4 {
grid-column: span 4;
}
.col-xxl-5 {
grid-column: span 5;
}
.col-xxl-6 {
grid-column: span 6;
}
.col-xxl-7 {
grid-column: span 7;
}
.col-xxl-8 {
grid-column: span 8;
}
.col-xxl-9 {
grid-column: span 9;
}
.col-xxl-10 {
grid-column: span 10;
}
.col-xxl-11 {
grid-column: span 11;
}
.col-xxl-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 2560px) {
.col-xxxl-1 {
grid-column: span 1;
}
.col-xxxl-2 {
grid-column: span 2;
}
.col-xxxl-3 {
grid-column: span 3;
}
.col-xxxl-4 {
grid-column: span 4;
}
.col-xxxl-5 {
grid-column: span 5;
}
.col-xxxl-6 {
grid-column: span 6;
}
.col-xxxl-7 {
grid-column: span 7;
}
.col-xxxl-8 {
grid-column: span 8;
}
.col-xxxl-9 {
grid-column: span 9;
}
.col-xxxl-10 {
grid-column: span 10;
}
.col-xxxl-11 {
grid-column: span 11;
}
.col-xxxl-12 {
grid-column: span 12;
}
}
@media screen and (min-width: 3840px) {
.col-x4k-1 {
grid-column: span 1;
}
.col-x4k-2 {
grid-column: span 2;
}
.col-x4k-3 {
grid-column: span 3;
}
.col-x4k-4 {
grid-column: span 4;
}
.col-x4k-5 {
grid-column: span 5;
}
.col-x4k-6 {
grid-column: span 6;
}
.col-x4k-7 {
grid-column: span 7;
}
.col-x4k-8 {
grid-column: span 8;
}
.col-x4k-9 {
grid-column: span 9;
}
.col-x4k-10 {
grid-column: span 10;
}
.col-x4k-11 {
grid-column: span 11;
}
.col-x4k-12 {
grid-column: span 12;
}
}
.hstack {
display: flex;
flex-direction: row;
}
.vstack {
display: flex;
flex-direction: column;
}
}
@layer components {
.accordion {
border-bottom: 1px solid #949494;
}
.accordion-header {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
display: flex;
gap: 0.8rem;
align-items: center;
padding: 0.25rem 0.5rem 0.5rem 0.25rem;
}
.accordion-header:hover {
background-color: #f2f2f2;
}
.accordion-header:focus {
outline: 2px solid #B78F00;
border-radius: 8px;
}
.accordion-header:before {
content: "";
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
color: #00118F;
border: 1px solid #00118F;
width: 2rem;
height: 2rem;
background-position: center;
background-repeat: no-repeat;
background-size: 24px 24px;
background-image: url('data:image/svg+xml;utf8,');
}
.accordion-header:hover::before {
border: 2px solid #00118F;
}
.accordion-body {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
padding: 1rem 0.5rem 1rem 1.5rem;
}
.accordion[open] .accordion-header::before {
background-image: url('data:image/svg+xml;utf8,');
}
@media screen and (min-width: 768px) {
.accordion-header {
font-size: 1.125rem;
font-weight: 400;
line-height: 1.6;
letter-spacing: 0.02rem;
padding: 1rem 1rem 1rem 0.25rem;
}
.accordion-body {
padding: 1.5rem 1rem 1.5rem 4rem;
}
}
.badge {
display: inline-grid;
grid-template-columns: auto auto;
align-items: baseline;
align-content: center;
box-sizing: border-box;
min-height: 2rem;
border-radius: 0.5rem;
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
overflow-wrap: anywhere;
padding: 0.25rem 0.5rem;
color: #000000;
}
.badge-outline {
border: 1px solid #000000;
color: #000000;
}
.badge-filled-outline {
border: 1px solid #000000;
background-color: #f2f2f2;
color: #000000;
}
.badge-fill {
color: #ffffff;
background-color: #4d4d4d;
}
.badge-gray.badge {
color: #4d4d4d;
}
.badge-gray.badge-outline {
border: 1px solid #4d4d4d;
color: #4d4d4d;
}
.badge-gray.badge-filled-outline {
border: 1px solid #4d4d4d;
background-color: #f2f2f2;
color: #333333;
}
.badge-gray.badge-fill {
color: #ffffff;
background-color: #4d4d4d;
}
.badge-blue.badge {
color: #264AF4;
}
.badge-blue.badge-outline {
border: 1px solid #264AF4;
color: #264AF4;
}
.badge-blue.badge-filled-outline {
border: 1px solid #264AF4;
background-color: #E8F1FE;
color: #0031D8;
}
.badge-blue.badge-fill {
color: #ffffff;
background-color: #264AF4;
}
.badge-lightblue.badge {
color: #0877D7;
}
.badge-lightblue.badge-outline {
border: 1px solid #0877D7;
color: #0877D7;
}
.badge-lightblue.badge-filled-outline {
border: 1px solid #0877D7;
background-color: #F0F9FF;
color: #0066BE;
}
.badge-lightblue.badge-fill {
color: #ffffff;
background-color: #0877D7;
}
.badge-cyan.badge {
color: #008DA6;
}
.badge-cyan.badge-outline {
border: 1px solid #008DA6;
color: #008DA6;
}
.badge-cyan.badge-filled-outline {
border: 1px solid #008DA6;
background-color: #E6FCFF;
color: #008299;
}
.badge-cyan.badge-fill {
color: #ffffff;
background-color: #008DA6;
}
.badge-green.badge {
color: #1D8B56;
}
.badge-green.badge-outline {
border: 1px solid #1D8B56;
color: #1D8B56;
}
.badge-green.badge-filled-outline {
border: 1px solid #1D8B56;
background-color: #E6F5EC;
color: #197A4B;
}
.badge-green.badge-fill {
color: #ffffff;
background-color: #1D8B56;
}
.badge-lime.badge {
color: #6FA104;
}
.badge-lime.badge-outline {
border: 1px solid #6FA104;
color: #6FA104;
}
.badge-lime.badge-filled-outline {
border: 1px solid #6FA104;
background-color: #EBFAD9;
color: #507500;
}
.badge-lime.badge-fill {
color: #ffffff;
background-color: #6FA104;
}
.badge-yellow.badge {
color: #B78F00;
}
.badge-yellow.badge-outline {
border: 1px solid #B78F00;
color: #B78F00;
}
.badge-yellow.badge-filled-outline {
border: 1px solid #B78F00;
background-color: #FBF5E0;
color: #A58000;
}
.badge-yellow.badge-fill {
color: #ffffff;
background-color: #B78F00;
}
.badge-orange.badge {
color: #E25100;
}
.badge-orange.badge-outline {
border: 1px solid #E25100;
color: #E25100;
}
.badge-orange.badge-filled-outline {
border: 1px solid #E25100;
background-color: #FFEEE2;
color: #C74700;
}
.badge-orange.badge-fill {
color: #ffffff;
background-color: #E25100;
}
.badge-red.badge {
color: #FA0000;
}
.badge-red.badge-outline {
border: 1px solid #FA0000;
color: #FA0000;
}
.badge-red.badge-filled-outline {
border: 1px solid #FA0000;
background-color: #FDEEEE;
color: #EC0000;
}
.badge-red.badge-fill {
color: #ffffff;
background-color: #FA0000;
}
.badge-magenta.badge {
color: #C000C0;
}
.badge-magenta.badge-outline {
border: 1px solid #C000C0;
color: #C000C0;
}
.badge-magenta.badge-filled-outline {
border: 1px solid #C000C0;
background-color: #F3E5F4;
color: #AA00AA;
}
.badge-magenta.badge-fill {
color: #ffffff;
background-color: #C000C0;
}
.badge-purple.badge {
color: #6F23D0;
}
.badge-purple.badge-outline {
border: 1px solid #6F23D0;
color: #6F23D0;
}
.badge-purple.badge-filled-outline {
border: 1px solid #6F23D0;
background-color: #F1EAFA;
color: #5C10BE;
}
.badge-purple.badge-fill {
color: #ffffff;
background-color: #6F23D0;
}
/*
.badge-blue {
&.badge {
color: map.get(color.$blue, 700);
}
&.badge-outline {
border: 1px solid map.get(color.$blue, 700);
color: map.get(color.$blue, 700);
}
&.badge-filled-outline {
border: 1px solid map.get(color.$blue, 700);
background-color: map.get(color.$blue, 50);
color: map.get(color.$blue, 800);
}
&.badge-fill {
color: color.$white;
background-color: map.get(color.$blue, 700);
}
}
*/
.banner {
border: 3px solid #767676;
border-radius: 12px;
padding: 1rem;
display: grid;
grid-auto-columns: 1fr;
grid-template-columns: min-content 1fr auto;
grid-template-rows: min-content min-content min-content;
grid-template-areas: "icon title close" "body body body" "action action action";
align-items: center;
}
@media screen and (min-width: 768px) {
.banner {
padding: 1.5rem;
grid-template-areas: "icon title close" ". body body" "action action action";
}
}
.banner-chip {
border-radius: 0;
border-left-width: 10px;
}
@media screen and (min-width: 768px) {
.banner-chip {
border-left-width: 18px;
}
}
.banner-success {
border-color: #197A4B;
}
.banner-success .banner-icon {
color: #197A4B;
}
.banner-error {
border-color: #EC0000;
}
.banner-error .banner-icon {
color: #EC0000;
}
.banner-warning {
border-color: #927200;
}
.banner-warning .banner-icon {
color: #927200;
}
.banner-info {
border-color: #0017C1;
}
.banner-info .banner-icon {
color: #0017C1;
}
.banner-emergency {
border: 6px solid #FB5B01;
border-radius: 0;
padding: 0.875rem 0.625rem;
}
@media screen and (min-width: 768px) {
.banner-emergency {
padding: 1rem;
}
}
.banner-emergency .banner-title {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.banner-emergency .banner-title {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
}
.banner-title {
display: block;
grid-area: title;
font-size: 1.0625rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.banner-title {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
}
.banner-body {
grid-area: body;
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 12px;
}
@media screen and (min-width: 768px) {
.banner-body {
margin-top: 16px;
}
}
.banner-description,
.banner-date {
display: block;
}
.banner-icon {
color: #767676;
grid-area: icon;
font-size: 24px;
margin-right: 12px;
}
@media screen and (min-width: 768px) {
.banner-icon {
font-size: 36px;
margin-right: 24px;
}
}
.blockquote {
border-left: 8px solid #767676;
padding: 0.5rem 1rem 0.5rem 1.5rem;
}
.blockquote > *:first-child {
margin-top: 0 !important;
}
.blockquote > *:last-child {
margin-bottom: 0 !important;
}
.breadcrumb {
color: #333333;
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
}
.breadcrumb-item {
display: inline;
overflow-wrap: break-word;
}
.breadcrumb-item + .breadcrumb-item::before {
display: inline-block;
background-color: #1a1a1a;
width: 12px;
height: 12px;
content: "";
clip-path: path("M4.5 11L4 10.5L8 6.5L4 2.5L4.5 2L9 6.5L4.5 11Z");
margin: 0 5px 0 4px;
}
.breadcrumb-link:any-link {
color: #00118F;
text-decoration: underline;
text-decoration-thickness: 0.0625rem;
text-underline-offset: 0.1875rem;
}
.breadcrumb-link:hover {
color: #0017C1;
text-decoration-thickness: 0.1875rem;
}
.breadcrumb-link:active {
color: #C74700;
text-decoration-thickness: 0.0625rem;
}
.btn {
position: relative;
cursor: pointer;
min-width: 6rem;
min-height: 3rem;
border-radius: 8px;
padding: 0.5rem 1rem;
display: flex;
justify-content: center;
align-items: center;
width: fit-content;
max-width: 100%;
text-underline-offset: 0.1875rem;
font-size: 1rem;
font-weight: 700;
line-height: 1;
letter-spacing: 0.02rem;
}
.btn:hover {
text-decoration: underline;
}
.btn:active {
border: 1px solid #1a1a1a;
}
.btn:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.btn-fill {
color: #ffffff;
background-color: #0017C1;
}
.btn-fill:hover {
background-color: #00118F;
}
.btn-fill:active {
background-color: #000060;
text-decoration: underline;
border: none;
}
.btn-outline {
color: #0017C1;
border: 1px solid #0017C1;
background-color: #ffffff;
}
.btn-outline:hover {
background-color: #C5D7FB;
color: #00118F;
}
.btn-outline:active {
background-color: #9DB7F9;
color: #000060;
text-decoration: underline;
border: none;
}
.btn-text {
background-color: transparent;
border: none;
color: #0017C1;
text-decoration: underline;
}
.btn-text:hover {
background-color: #E8F1FE;
color: #00118F;
text-decoration-thickness: 0.1875rem;
}
.btn-text:active {
background-color: #D9E6FF;
color: #000060;
}
.is-xs.btn {
font-size: 0.875rem;
min-width: 4.5rem;
min-height: 28px;
border-radius: 4px;
padding: 0.125rem 0.5rem;
}
.is-xs.btn:after {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 44px;
transform: translate(-50%, -50%);
content: "";
border-radius: 4px;
}
.is-sm.btn {
font-size: 1rem;
min-width: 5rem;
min-height: 2.25rem;
border-radius: 8px;
padding: 0.125rem 0.75rem;
}
.is-sm.btn:after {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 44px;
transform: translate(-50%, -50%);
content: "";
border-radius: 4px;
}
.is-md.btn {
font-size: 1rem;
min-width: 6rem;
min-height: 3rem;
border-radius: 8px;
padding: 0.5rem 1rem;
}
.is-lg.btn {
font-size: 1rem;
min-width: 8.5rem;
min-height: 3.5rem;
border-radius: 8px;
padding: 0.75rem 1rem;
}
.card {
border: 1px solid #949494;
border-radius: 8px;
position: relative;
display: flex;
}
.card-body {
width: 100%;
padding: 1rem;
}
.card-title {
margin: 0 0 0.5rem 0;
}
.card-title:last-child {
margin-bottom: 0;
}
.card-title {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.card-text {
margin: 0 0 0.5rem 0;
}
.card-text:last-child {
margin-bottom: 0;
}
.card-text {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
}
.card-img-right,
.card-img-left,
.card-img-top,
.card-img-bottom {
display: block;
width: 25%;
height: auto;
}
.card-img-top {
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
.card-img-bottom {
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.card-img-right {
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.card-img-left {
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}
.card-link {
position: static;
}
.card-link:before {
content: "";
cursor: inherit;
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 0;
width: 100%;
height: 100%;
}
.carousel {
position: relative;
display: grid;
grid-template-areas: "item item item" "left markers right";
grid-template-columns: 1fr 2fr 1fr;
row-gap: 1rem;
}
.carousel-inner {
grid-area: item;
display: flex;
flex-direction: row;
gap: 0;
overflow-x: hidden;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
scroll-marker-group: after;
}
.carousel-inner::scroll-button(*) {
width: 50px;
height: 50px;
border-radius: 50%;
}
.carousel-inner::scroll-button(left) {
content: "◀"/"前へ";
grid-area: left;
justify-self: end;
}
.carousel-inner::scroll-button(right) {
content: "▶"/"次へ";
grid-area: right;
}
.carousel-inner::scroll-marker-group {
grid-area: markers;
display: flex;
justify-content: center;
gap: 16px;
align-items: center;
}
.carousel-item {
flex-shrink: 0;
display: flex;
width: 100%;
height: auto;
scroll-snap-align: center;
}
.carousel-item:not(:last-child) {
margin-right: 2.5rem;
}
.carousel-item img {
aspect-ratio: 16/9;
object-fit: cover;
}
.carousel-item::scroll-marker {
content: "";
display: block;
width: 16px;
height: 16px;
background-color: #cccccc;
border-radius: 50%;
flex-shrink: 0;
}
.carousel-item::scroll-marker:target-current {
background-color: #3460FB;
}
.codesnippet-preview {
border-radius: 8px 8px 0 0;
padding: 1.5rem;
border-top: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
}
.codesnippet-header {
padding: 0.25rem 1rem;
border-top: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
display: flex;
gap: 1rem;
justify-content: space-between;
align-items: center;
}
.codesnippet-modal-close-btn,
.codesnippet-modal-btn,
.codesnippet-copy-btn {
font-size: 1.25rem;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
.codesnippet-lang {
margin-right: auto;
}
.codesnippet-code {
margin: 0;
font-family: "Noto Sans Mono", monospace;
overflow: auto;
padding: 1rem 1.5rem;
border: 1px solid #cccccc;
border-radius: 0 0 8px 8px;
}
.codesnippet-modal {
max-width: 992px;
width: calc(100% - 2rem);
border-radius: 8px;
padding: 0;
border: none;
top: 7dvh;
margin: 0 auto;
position: relative;
}
.codesnippet-modal::backdrop {
background-color: rgba(24, 49, 83, 0.5);
}
.codesnippet-preview-flex {
display: flex;
align-items: start;
flex-wrap: wrap;
gap: 1rem;
}
.codesnippet-preview-false {
display: none;
}
code[class*=language-],
pre[class*=language-] {
background: none;
font-size: 1em;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
tab-size: 4;
hyphens: none;
}
pre[class*=language-]::selection,
pre[class*=language-] ::selection,
code[class*=language-]::selection,
code[class*=language-] ::selection {
background: #C5D7FB;
}
:not(pre) > code[class*=language-] {
padding: 0.2em 0.4em;
border-radius: 4px;
white-space: normal;
background: #f2f2f2;
border: 1px solid #e6e6e6;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: #767676;
font-style: italic;
}
.token.punctuation {
color: #4d4d4d;
}
.token.namespace {
color: #666666;
opacity: 0.8;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #FE3939;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #259D63;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #FB5B01;
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #3460FB;
font-weight: 500;
}
.token.function,
.token.class-name {
color: #8843E1;
}
.token.regex,
.token.important,
.token.variable {
color: #D2A400;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
.line-numbers .line-numbers-rows {
border-right: 1px solid #cccccc;
}
.line-numbers-rows > span:before {
color: #b3b3b3;
}
.line-highlight {
background: linear-gradient(to right, #E8F1FE 70%, transparent);
}
.description-list {
display: flex;
flex-direction: column;
}
.description-term {
font-size: 1rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.description-term {
font-size: 1.0625rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
}
.description-details {
margin-left: 2rem;
}
.divider {
border: 0;
border-top: #949494 solid 1px;
}
.divider-dashed {
border-top-style: dashed;
}
.divider-solid {
border-top-style: solid;
}
.divider-w1 {
border-top-width: 1px;
}
.divider-w2 {
border-top-width: 2px;
}
.divider-w3 {
border-top-width: 3px;
}
.divider-w4 {
border-top-width: 4px;
}
.drawer[open] {
margin: 0;
padding: 0;
border: 0;
width: 18rem;
min-height: 100dvh;
left: auto;
}
.drawer-header {
padding: 1.25rem 1rem;
}
.dropdown {
height: 100%;
}
.dropdown-area {
position: relative;
}
.dropdown-menu {
display: flex;
flex-direction: column;
min-width: 200px;
position: absolute;
z-index: 100;
background-color: #ffffff;
border: 1px solid #949494;
padding: 16px 8px 24px 8px;
}
.dropdown-link {
padding: 8px 20px;
}
.globalmenu-sub {
display: flex;
}
.globalmenu {
display: flex;
height: 100%;
}
.globalmenu-item {
flex: 0 0 auto;
}
.globalmenu-link {
font-size: 1rem;
font-weight: 700;
line-height: 1.3;
letter-spacing: 0;
position: relative;
display: flex;
align-items: center;
height: 100%;
padding: 0 1rem;
cursor: pointer;
}
.globalmenu-link:hover {
background-color: #f2f2f2;
}
.globalmenu-link:hover::after {
visibility: visible;
}
.globalmenu-link::after {
position: absolute;
left: 0;
bottom: -1px;
content: "";
width: 100%;
height: 2px;
background-color: #1a1a1a;
visibility: hidden;
}
.globalmenu-link.active {
color: #0017C1;
}
.globalmenu-link.active::after {
visibility: visible;
background-color: #0017C1;
height: 4px;
}
.globalmenu-link:focus {
border-radius: 2px;
background-color: #FFD43D;
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.globalmenu-dropdown {
position: relative;
height: 100%;
}
.globalmenu-dropdown-menu {
position: absolute;
display: flex;
flex-direction: column;
min-width: 200px;
width: max-content;
z-index: 100;
background-color: #ffffff;
border: 1px solid #949494;
box-shadow: 0 4px 16px 0 rgba(26, 26, 28, 0.2);
padding: 16px 8px 24px 8px;
}
.globalmenu-dropdown-link {
display: block;
padding: 8px 20px;
}
.globalmenu-dropdown-link:hover {
background-color: #f2f2f2;
}
.hamburger-btn {
min-height: 36px;
padding: 0 12px;
display: flex;
gap: 7px;
align-items: center;
cursor: pointer;
border-radius: 4px;
font-size: 1rem;
font-weight: 400;
line-height: 1.2;
letter-spacing: 0;
}
.hamburger-btn:hover {
text-decoration: underline;
background-color: #f2f2f2;
}
.hamburger-btn:focus, .hamburger-btn:active {
background-color: #FFD43D;
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.hamburger-iconbtn {
min-width: 44px;
min-height: 44px;
gap: 5px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
cursor: pointer;
border-radius: 4px;
font-weight: 700;
font-size: 0.52rem;
line-height: 1;
letter-spacing: 0;
}
.hamburger-iconbtn:hover {
box-shadow: inset 0 0 0 1px #000000;
background-color: #f2f2f2;
}
.hamburger-iconbtn:focus, .hamburger-iconbtn:active {
background-color: #FFD43D;
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.hamburger-icon {
width: 24px;
height: 18px;
position: relative;
}
.hamburger-icon::before {
content: "";
position: absolute;
width: 100%;
height: 2px;
background-color: #000000;
box-shadow: 0 8px 0 #000000, 0 16px 0 #000000;
}
.hamburger-icon.close::before {
box-shadow: none;
top: 50%;
transform: translateY(-50%) rotate(45deg);
}
.hamburger-icon.close::after {
content: "";
position: absolute;
width: 100%;
height: 2px;
background-color: #000000;
top: 50%;
transform: translateY(-50%) rotate(-45deg);
}
.header {
background-color: #ffffff;
border-bottom: 1px solid #949494;
}
.header-full {
margin: 0 auto;
max-width: 1280px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
column-gap: 1rem;
}
@media screen and (min-width: 992px) {
.header-full .header-drawer {
display: none;
}
}
.header-full .header-logo {
order: 1;
height: 68px;
display: flex;
align-items: center;
margin-right: auto;
margin-left: 1rem;
}
@media screen and (min-width: 768px) {
.header-full .header-logo {
height: 80px;
}
}
.header-full .header-items {
display: none;
}
@media screen and (min-width: 768px) {
.header-full .header-items {
display: flex;
order: 3;
align-items: center;
height: 80px;
padding-right: 0;
}
}
@media screen and (min-width: 768px) {
.header-full .header-items {
padding-right: 1rem;
}
}
@media screen and (min-width: 768px) {
.header-full .header-items {
padding-right: 0;
}
}
.header-full .header-menu {
order: 5;
display: none;
width: 100%;
height: 55px;
align-items: center;
}
@media screen and (min-width: 768px) {
.header-full .header-menu {
display: flex;
}
}
.header-full .header-button {
order: 4;
display: flex;
align-items: center;
margin-right: 1rem;
column-gap: 1rem;
}
.header-slim {
margin: 0 auto;
max-width: 1280px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
column-gap: 1rem;
}
.header-slim .header-logo {
order: 1;
height: 68px;
display: flex;
align-items: center;
margin-left: 1rem;
}
.header-slim .header-button {
order: 4;
display: flex;
align-items: center;
margin-right: 1rem;
column-gap: 1rem;
}
.header-slim .header-items {
display: none;
}
@media screen and (min-width: 768px) {
.header-slim .header-items {
display: flex;
order: 3;
align-items: center;
padding-right: 0;
}
}
@media screen and (min-width: 768px) {
.header-slim .header-items {
padding-right: 1rem;
}
}
@media screen and (min-width: 768px) {
.header-slim .header-items {
padding-right: 0;
}
}
.header-slim .header-menu {
order: 2;
display: none;
align-items: center;
}
@media screen and (min-width: 768px) {
.header-slim .header-menu {
display: flex;
margin-right: auto;
}
}
.header-fixed {
margin: 0 auto;
max-width: 1920px;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
column-gap: 1rem;
}
.header-fixed .header-logo {
order: 1;
height: 55px;
display: flex;
align-items: center;
margin-right: auto;
margin-left: 1rem;
}
@media screen and (min-width: 768px) {
.header-fixed .header-logo {
display: flex;
margin-right: 0;
}
}
.header-fixed .header-menu {
order: 2;
display: none;
align-items: center;
}
@media screen and (min-width: 992px) {
.header-fixed .header-menu {
display: flex;
margin-right: auto;
}
}
.header-fixed .header-items {
display: none;
}
@media screen and (min-width: 768px) {
.header-fixed .header-items {
display: flex;
order: 3;
align-items: center;
margin-right: 0;
margin-left: auto;
}
}
.header-fixed .header-button {
order: 4;
display: flex;
align-items: center;
margin-right: 1rem;
column-gap: 1rem;
}
.lang-select {
width: fit-content;
position: relative;
}
.lang-select-btn {
display: flex;
align-items: center;
border-radius: 0.5rem;
min-height: 2.25rem;
padding: 0 0.25rem;
column-gap: 0.25rem;
cursor: default;
}
.lang-select-btn:hover {
background-color: #f2f2f2;
}
.lang-select-btn:hover .lang-select-label {
text-decoration: underline;
text-underline-offset: 0.1875rem;
}
.lang-select-popup {
position: absolute;
top: 100%;
left: 0;
z-index: 1;
width: max-content;
max-height: 18.875rem;
overflow-y: auto;
border-radius: 0.5rem 0 0 0.5rem;
border: 1px solid #949494;
background-color: #ffffff;
padding: 1rem 0;
box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.3);
}
.lang-select-link {
display: flex;
align-items: center;
column-gap: 0.5rem;
padding: 10px 1rem;
min-height: 2.75rem;
}
.lang-select-link:hover {
background-color: #f2f2f2;
}
.lang-select-link:hover .lang-select-link-label {
text-decoration: underline;
text-underline-offset: 0.1875rem;
}
.lang-select-link i {
visibility: hidden;
}
.lang-select-link.active {
background-color: #D9E6FF;
color: #00118F;
font-size: 1rem;
font-weight: 700;
line-height: 1.3;
letter-spacing: 0;
}
.lang-select-link.active:hover {
background-color: #E8F1FE;
color: #0017C1;
}
.lang-select-link.active i {
visibility: visible;
}
.mega-menu-area {
position: relative;
}
.mega-menu {
position: absolute;
z-index: 100;
max-width: 1280px;
width: 100%;
background-color: #ffffff;
border-bottom: 1px solid #949494;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
display: flex;
justify-content: space-between;
gap: 20px;
right: 0;
left: 0;
margin-top: 1px;
padding: 32px 40px 40px 40px;
}
.mega-menu-header {
display: flex;
gap: 8px;
flex-direction: column;
border-right: 1px solid #cccccc;
padding-right: 0.5rem;
}
.mega-menu-header {
flex: 0 0 auto;
width: 25%;
}
.mega-menu-content {
flex: 1 0 0;
}
.menulist-title {
display: block;
padding: 0.776rem 1rem;
font-size: 1rem;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0;
}
.menulist-item .menulist-item {
margin-left: 1rem;
}
.menulist-link {
display: flex;
align-items: center;
padding: 0.776rem 1rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.2;
letter-spacing: 0;
border-radius: 8px;
}
.menulist-link:hover {
background-color: #f2f2f2;
text-decoration: underline;
text-decoration-thickness: 0.0625rem;
}
.menulist-link:focus {
background-color: #FFD43D;
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.menulist-link.active {
font-size: 1rem;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0;
background-color: #D9E6FF;
color: #00118F;
}
.menulist-link.active:hover {
background-color: #E8F1FE;
color: #0017C1;
}
.is-sm .menulist-link {
min-height: 2.25rem;
padding: 0.375rem 1rem;
}
.is-md .menulist-link {
padding: 0.776rem 1rem;
}
.mobilemenu {
display: flex;
flex-direction: column;
}
.mobilemenu-link {
display: flex;
padding: 8px 20px;
}
.mobilemenu-accordion {
display: flex;
padding: 8px 20px;
}
.modaldialog {
outline: none;
}
.modaldialog::backdrop {
background-color: rgba(153, 153, 153, 0.75);
}
.modaldialog {
position: fixed;
inset: 0;
margin: auto;
width: 496px;
padding: 0;
border-radius: 12px;
border: 1px solid #cccccc;
background-color: #ffffff;
z-index: 1000;
}
.modaldialog-header {
padding: 1rem;
}
.modaldialog-header .hamburger-iconbtn {
position: absolute;
top: 8px;
right: 8px;
}
.modaldialog-body {
padding: 1rem;
}
.modaldialog-title {
margin: 0;
font-size: 1.375rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.spinner {
background-color: white;
width: 48px;
aspect-ratio: 1;
border: 4px solid #4979F5;
border-right-color: #00118F;
border-bottom-color: #00118F;
border-radius: 50%;
animation: spin 1s linear infinite;
}
.progress {
display: block;
position: relative;
width: 100%;
height: 4px;
background-color: #4979F5 !important;
border-radius: 4px;
overflow: hidden;
}
.progress::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 100%;
background-color: #00118F;
border-radius: 4px;
transform: translateX(-100%);
animation: move 1s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes move {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(200%);
}
}
.input, .search-box-input {
padding: 0.75rem 1rem;
display: block;
height: 2.5rem;
border: solid 1px #666666;
border-radius: 8px;
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
}
.input:hover, .search-box-input:hover {
border: solid 1px #000000;
}
.input:focus, .search-box-input:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.input:disabled, .search-box-input:disabled {
border: solid 1px #b3b3b3;
background-color: #f2f2f2;
color: #949494;
}
.input:read-only, .search-box-input:read-only {
border-style: dashed;
}
.is-sm.input, .is-sm.search-box-input {
height: 2.5rem;
}
.is-md.input, .is-md.search-box-input {
height: 3rem;
}
.is-lg.input, .search-box-input {
height: 3.5rem;
}
.is-error.input, .is-error.search-box-input {
border-color: #EC0000;
}
.search-box {
display: flex;
justify-content: space-between;
gap: 1rem;
}
.search-box-fields {
width: 100%;
display: flex;
}
.search-box-label {
width: 100%;
position: relative;
}
.search-box-input {
width: 100%;
padding: 0.75rem 1rem 0.75rem 3rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.search-box-select {
flex-shrink: 0;
position: relative;
display: flex;
}
.search-box-select span {
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
position: absolute;
top: calc(50% - 1.25rem);
left: 1.0625rem;
color: #4d4d4d;
pointer-events: none;
z-index: 2;
}
.search-box-select select,
.search-box-select ::picker(select) {
appearance: base-select;
}
.search-box-select select {
display: flex;
align-items: center;
width: 10rem;
border-radius: 0.5rem 0 0 0.5rem;
border-top: 1px solid #666666;
border-bottom: 1px solid #666666;
border-left: 1px solid #666666;
background-color: #f2f2f2;
padding: 1.25rem 2.5rem 0 1rem;
color: #1a1a1a;
font-size: 1.0625rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
white-space: nowrap;
text-overflow: ellipsis;
}
.search-box-select select:focus-visible {
position: relative;
z-index: 1;
outline: 0.25rem solid #000000;
outline-offset: 0.125rem;
box-shadow: 0 0 0 0.125rem #FFD43D;
}
.search-box-select select:hover {
border-color: #000000;
}
.search-box-select select::picker-icon {
display: none;
}
.search-box-select select::picker(select) {
appearance: base-select;
border: 1px solid #949494;
box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.3);
padding: 1rem 0;
}
.search-box-select option {
display: flex;
align-items: center;
min-height: 2.75rem;
padding: 0.625rem 1rem;
color: #1a1a1a;
}
.search-box-select option:focus-visible {
border-radius: 0;
outline: 0.25rem solid #000000;
outline-offset: -0.25rem;
}
.search-box-select option:hover {
background-color: #f2f2f2;
text-decoration: underline;
text-decoration-thickness: 0.0625rem;
text-underline-offset: 0.1875rem;
}
.search-box-select option:not(:checked):focus-visible {
background-color: #FFD43D;
}
.search-box-select option:checked {
font-weight: 700;
background-color: #D9E6FF;
color: #00118F;
}
.search-box-select option:checked:focus-visible {
box-shadow: inset 0 0 0 0.375rem #FFD43D;
}
.search-box-select option:checked:hover {
background-color: #E8F1FE;
color: #0017C1;
}
.search-box-select option::checkmark {
display: none;
}
input[type=search]::-webkit-search-cancel-button {
appearance: none;
}
.search-box-arrow-icon {
position: absolute;
top: 0;
right: 1rem;
bottom: 0;
z-index: 1;
margin-top: auto;
margin-bottom: auto;
width: 1rem;
height: 1rem;
pointer-events: none;
}
.search-box-search-icon {
position: absolute;
left: 1rem;
z-index: 1;
top: calc(50% - 0.75rem);
margin: auto 0;
font-size: 1.5rem;
color: #666666;
pointer-events: none;
}
.stat {
border-radius: 16px;
border: 1px solid #7f7f7f;
display: flex;
flex-direction: column;
gap: 1rem;
padding: 24px;
}
.stat-label {
text-decoration: underline;
font-size: 1rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0;
}
.stat-unit {
margin-left: 10px;
font-size: 2rem;
font-weight: 400;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.stat-value {
font-size: 2.8125rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0;
}
.table {
border-collapse: collapse;
}
.table th,
.table td {
border: 1px solid #949497;
padding: 0.5rem;
}
.table th {
background-color: #f8f8fb;
}
.utilitylink {
cursor: pointer;
display: block;
width: fit-content;
text-wrap: pretty;
font-size: 1rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0;
text-decoration: underline;
}
.utilitylink:focus {
border-radius: 0.25rem;
background-color: #FFD43D;
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.utilitylink:hover {
color: #333333;
text-decoration-thickness: 0.1875rem;
}
.utilitylink[target=_blank]::after, .utilitylink[rel=external]::after {
display: inline-block;
background-color: #1a1a1a;
width: 1em;
height: 1em;
mask-image: url('data:image/svg+xml;utf8,');
content: "";
vertical-align: middle;
margin-left: 4px;
}
.utilitylink-units {
display: flex;
gap: 1rem;
}
}
@layer forms {
.checkbox {
display: flex;
align-items: center;
cursor: default;
gap: 0.5rem;
width: fit-content;
color: #333333;
font-size: 1rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0;
padding: 8px 0;
}
.is-sm .checkbox-input {
width: 18px;
height: 18px;
}
.is-sm .checkbox-input:before {
transform: scale(1);
}
.is-md .checkbox-input {
width: 24px;
height: 24px;
}
.is-md .checkbox-input:before {
transform: scale(1.4285714286);
}
.is-lg .checkbox-input {
width: 33px;
height: 33px;
}
.is-lg .checkbox-input:before {
transform: scale(1.9285714286);
}
.checkbox-input {
display: flex;
justify-content: center;
align-items: center;
flex-shrink: 0;
width: 18px;
height: 18px;
border-radius: 12.5%;
position: relative;
background-color: #ffffff;
border: 0.125rem solid #666666;
}
.checkbox-input:hover {
border: 0.125rem solid #000000;
outline: 0.125rem solid #666666;
}
.checkbox-input:checked {
background-color: #0017C1;
border: 0.125rem solid #0017C1;
}
.checkbox-input:checked:focus {
border: 0.125rem solid #0017C1;
}
.checkbox-input:before {
display: none;
width: 0.875rem;
height: 0.875rem;
background-color: #ffffff;
transform: scale(1);
content: "";
}
.checkbox-input:checked::before {
display: block;
clip-path: path("M5.6,11.2L12.65,4.15L11.25,2.75L5.6,8.4L2.75,5.55L1.35,6.95L5.6,11.2Z");
}
.checkbox-input:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
outline: none;
border: 0.125rem solid #000000;
}
.date-picker {
display: inline-flex;
max-width: 100%;
height: 3rem;
padding: 0.125rem 0 0.125rem 0.125rem;
border: 1px solid #666666;
border-radius: 0.5rem;
background-color: #ffffff;
color: #333333;
}
.date-picker-year, .date-picker-month, .date-picker-day {
display: flex;
}
.date-picker-year:last-child, .date-picker-month:last-child, .date-picker-day:last-child {
padding-right: 1rem;
}
.date-picker-legend {
display: none;
}
.date-picker-input {
width: 4rem;
margin-right: -0.25rem;
padding-right: 0.75rem;
border-radius: 0.5rem;
text-align: right;
}
.date-picker-input:focus {
outline: 0.25rem solid #000000;
outline-offset: 0.125rem;
border: 1px solid #666666;
box-shadow: 0 0 0 0.125rem #FFD43D;
}
.date-picker-month .date-picker-input, .date-picker-day .date-picker-input {
width: 2.75rem;
}
.date-picker-label {
align-self: center;
padding: 0.25rem;
line-height: 1;
background-color: #ffffff;
}
.form-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.form-group:has(.input, .textarea, .select) .form-error {
display: none;
}
.form-group:has(.input.is-error, .textarea.is-error, .select.is-error) .form-error {
display: block;
}
.input {
padding: 0.75rem 1rem;
display: block;
height: 2.5rem;
border: solid 1px #666666;
border-radius: 8px;
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
}
.input:hover {
border: solid 1px #000000;
}
.input:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.input:disabled {
border: solid 1px #b3b3b3;
background-color: #f2f2f2;
color: #949494;
}
.input:read-only {
border-style: dashed;
}
.is-sm.input {
height: 2.5rem;
}
.is-md.input {
height: 3rem;
}
.is-lg.input {
height: 3.5rem;
}
.is-error.input {
border-color: #EC0000;
}
.form-label {
font-size: 1.0625rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
.form-necessity {
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
color: #EC0000;
margin-left: 8px;
}
.form-support {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
color: #666666;
}
.form-error {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
color: #EC0000;
}
.radio {
display: flex;
align-items: center;
gap: 0.5rem;
width: fit-content;
color: #333333;
font-size: 1rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0;
padding: 8px 0;
cursor: default;
}
.is-sm .radio-input {
width: 1.25rem;
height: 1.25rem;
}
.is-sm .radio-input:before {
width: 0.625rem;
height: 0.625rem;
}
.is-md .radio-input {
width: 1.625rem;
height: 1.625rem;
}
.is-md .radio-input:before {
width: 0.75rem;
height: 0.75rem;
}
.is-lg .radio-input {
width: 2.25rem;
height: 2.25rem;
}
.is-lg .radio-input:before {
width: 1rem;
height: 1rem;
}
.radio-input {
width: 1.25rem;
height: 1.25rem;
border-radius: 50%;
border: 0.125rem solid #666666;
position: relative;
}
.radio-input:before {
content: "";
position: absolute;
inset: 0;
margin: auto;
width: 0.625rem;
height: 0.625rem;
border-radius: 50%;
background-color: transparent;
}
.radio-input:hover {
border-color: #000000;
box-shadow: 0 0 0 2px #949494;
}
.radio-input:checked {
border-color: #0017C1;
}
.radio-input:checked:before {
background-color: #0017C1;
}
.radio-input:checked:hover {
border-color: #000071;
}
.radio-input:checked:hover:before {
background-color: #000071;
}
.radio-input:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.select {
position: relative;
width: fit-content;
padding: 0.938rem 2.5rem 0.938rem 1rem;
border: solid 1px #666666;
border-radius: 8px;
font-size: 1rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0.02rem;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-size: 1rem;
background-position: right 0.8rem center;
}
.select:hover {
border: solid 1px #000000;
}
.select:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
outline: none;
}
.select:disabled {
background-image: none;
border-color: #b3b3b3;
background-color: #f2f2f2;
color: #949494;
}
.is-sm.select {
padding: 0.688rem 2.5rem 0.688rem 1rem;
}
.is-md.select {
padding: 0.938rem 2.5rem 0.938rem 1rem;
}
.is-lg.select {
padding: 1.188rem 2.5rem 1.188rem 1rem;
}
.is-error.select {
border-color: #EC0000;
}
.textarea {
padding: 1rem;
border: solid 1px #666666;
border-radius: 8px;
resize: both;
width: fit-content;
max-width: 100%;
display: inline;
}
.textarea:hover {
border: solid 1px #000000;
}
.textarea:focus {
box-shadow: 0 0 0 2px #FFD43D, 0 0 0 6px #000000;
}
.textarea:disabled {
border: solid 1px #b3b3b3;
background-color: #f2f2f2;
color: #949494;
resize: none;
}
.textarea:read-only {
border-style: dashed;
resize: none;
}
.is-error.textarea {
border-color: #EC0000;
}
.textarea-counter {
display: inline-block;
color: #666666;
font-size: 1rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0;
}
}
@layer utilities {
.code {
padding: 0.1rem 0.25rem;
border-radius: 4px;
background-color: #e6e6e6;
color: #CE0000;
}
.bg-white {
background-color: #ffffff;
}
.text-white {
color: #ffffff;
}
.bg-black {
background-color: #000000;
}
.text-black {
color: #000000;
}
.bg-grey-900 {
background-color: #1a1a1a;
}
.text-grey-900 {
color: #1a1a1a;
}
.bg-grey-800 {
background-color: #333333;
}
.text-grey-800 {
color: #333333;
}
.bg-grey-700 {
background-color: #4d4d4d;
}
.text-grey-700 {
color: #4d4d4d;
}
.bg-grey-600 {
background-color: #666666;
}
.text-grey-600 {
color: #666666;
}
.bg-grey-536 {
background-color: #767676;
}
.text-grey-536 {
color: #767676;
}
.bg-grey-500 {
background-color: #7f7f7f;
}
.text-grey-500 {
color: #7f7f7f;
}
.bg-grey-420 {
background-color: #949494;
}
.text-grey-420 {
color: #949494;
}
.bg-grey-400 {
background-color: #999999;
}
.text-grey-400 {
color: #999999;
}
.bg-grey-300 {
background-color: #b3b3b3;
}
.text-grey-300 {
color: #b3b3b3;
}
.bg-grey-200 {
background-color: #cccccc;
}
.text-grey-200 {
color: #cccccc;
}
.bg-grey-100 {
background-color: #e6e6e6;
}
.text-grey-100 {
color: #e6e6e6;
}
.bg-grey-50 {
background-color: #f2f2f2;
}
.text-grey-50 {
color: #f2f2f2;
}
.bg-blue-1200 {
background-color: #000060;
}
.text-blue-1200 {
color: #000060;
}
.bg-blue-1100 {
background-color: #000071;
}
.text-blue-1100 {
color: #000071;
}
.bg-blue-1000 {
background-color: #00118F;
}
.text-blue-1000 {
color: #00118F;
}
.bg-blue-900 {
background-color: #0017C1;
}
.text-blue-900 {
color: #0017C1;
}
.bg-blue-800 {
background-color: #0031D8;
}
.text-blue-800 {
color: #0031D8;
}
.bg-blue-700 {
background-color: #264AF4;
}
.text-blue-700 {
color: #264AF4;
}
.bg-blue-600 {
background-color: #3460FB;
}
.text-blue-600 {
color: #3460FB;
}
.bg-blue-500 {
background-color: #4979F5;
}
.text-blue-500 {
color: #4979F5;
}
.bg-blue-400 {
background-color: #7096F8;
}
.text-blue-400 {
color: #7096F8;
}
.bg-blue-300 {
background-color: #9DB7F9;
}
.text-blue-300 {
color: #9DB7F9;
}
.bg-blue-200 {
background-color: #C5D7FB;
}
.text-blue-200 {
color: #C5D7FB;
}
.bg-blue-100 {
background-color: #D9E6FF;
}
.text-blue-100 {
color: #D9E6FF;
}
.bg-blue-50 {
background-color: #E8F1FE;
}
.text-blue-50 {
color: #E8F1FE;
}
.bg-lightblue-1200 {
background-color: #00234B;
}
.text-lightblue-1200 {
color: #00234B;
}
.bg-lightblue-1100 {
background-color: #00316A;
}
.text-lightblue-1100 {
color: #00316A;
}
.bg-lightblue-1000 {
background-color: #00428C;
}
.text-lightblue-1000 {
color: #00428C;
}
.bg-lightblue-900 {
background-color: #0055AD;
}
.text-lightblue-900 {
color: #0055AD;
}
.bg-lightblue-800 {
background-color: #0066BE;
}
.text-lightblue-800 {
color: #0066BE;
}
.bg-lightblue-700 {
background-color: #0877D7;
}
.text-lightblue-700 {
color: #0877D7;
}
.bg-lightblue-600 {
background-color: #008BF2;
}
.text-lightblue-600 {
color: #008BF2;
}
.bg-lightblue-500 {
background-color: #39ABFF;
}
.text-lightblue-500 {
color: #39ABFF;
}
.bg-lightblue-400 {
background-color: #57B8FF;
}
.text-lightblue-400 {
color: #57B8FF;
}
.bg-lightblue-300 {
background-color: #97D3FF;
}
.text-lightblue-300 {
color: #97D3FF;
}
.bg-lightblue-200 {
background-color: #C0E4FF;
}
.text-lightblue-200 {
color: #C0E4FF;
}
.bg-lightblue-100 {
background-color: #DCF0FF;
}
.text-lightblue-100 {
color: #DCF0FF;
}
.bg-lightblue-50 {
background-color: #F0F9FF;
}
.text-lightblue-50 {
color: #F0F9FF;
}
.bg-cyan-1200 {
background-color: #003741;
}
.text-cyan-1200 {
color: #003741;
}
.bg-cyan-1100 {
background-color: #004C59;
}
.text-cyan-1100 {
color: #004C59;
}
.bg-cyan-1000 {
background-color: #006173;
}
.text-cyan-1000 {
color: #006173;
}
.bg-cyan-900 {
background-color: #006F83;
}
.text-cyan-900 {
color: #006F83;
}
.bg-cyan-800 {
background-color: #008299;
}
.text-cyan-800 {
color: #008299;
}
.bg-cyan-700 {
background-color: #008DA6;
}
.text-cyan-700 {
color: #008DA6;
}
.bg-cyan-600 {
background-color: #00A3BF;
}
.text-cyan-600 {
color: #00A3BF;
}
.bg-cyan-500 {
background-color: #01B7D6;
}
.text-cyan-500 {
color: #01B7D6;
}
.bg-cyan-400 {
background-color: #2BC8E4;
}
.text-cyan-400 {
color: #2BC8E4;
}
.bg-cyan-300 {
background-color: #79E2F2;
}
.text-cyan-300 {
color: #79E2F2;
}
.bg-cyan-200 {
background-color: #99F2FF;
}
.text-cyan-200 {
color: #99F2FF;
}
.bg-cyan-100 {
background-color: #C8F8FF;
}
.text-cyan-100 {
color: #C8F8FF;
}
.bg-cyan-50 {
background-color: #E6FCFF;
}
.text-cyan-50 {
color: #E6FCFF;
}
.bg-green-1200 {
background-color: #032213;
}
.text-green-1200 {
color: #032213;
}
.bg-green-1100 {
background-color: #08351F;
}
.text-green-1100 {
color: #08351F;
}
.bg-green-1000 {
background-color: #0C472A;
}
.text-green-1000 {
color: #0C472A;
}
.bg-green-900 {
background-color: #115A36;
}
.text-green-900 {
color: #115A36;
}
.bg-green-800 {
background-color: #197A4B;
}
.text-green-800 {
color: #197A4B;
}
.bg-green-700 {
background-color: #1D8B56;
}
.text-green-700 {
color: #1D8B56;
}
.bg-green-600 {
background-color: #259D63;
}
.text-green-600 {
color: #259D63;
}
.bg-green-500 {
background-color: #2CAC6E;
}
.text-green-500 {
color: #2CAC6E;
}
.bg-green-400 {
background-color: #51B883;
}
.text-green-400 {
color: #51B883;
}
.bg-green-300 {
background-color: #71C598;
}
.text-green-300 {
color: #71C598;
}
.bg-green-200 {
background-color: #9BD4B5;
}
.text-green-200 {
color: #9BD4B5;
}
.bg-green-100 {
background-color: #C2E5D1;
}
.text-green-100 {
color: #C2E5D1;
}
.bg-green-50 {
background-color: #E6F5EC;
}
.text-green-50 {
color: #E6F5EC;
}
.bg-lime-1200 {
background-color: #1E2D00;
}
.text-lime-1200 {
color: #1E2D00;
}
.bg-lime-1100 {
background-color: #2C4100;
}
.text-lime-1100 {
color: #2C4100;
}
.bg-lime-1000 {
background-color: #3E5A00;
}
.text-lime-1000 {
color: #3E5A00;
}
.bg-lime-900 {
background-color: #507500;
}
.text-lime-900 {
color: #507500;
}
.bg-lime-800 {
background-color: #507500;
}
.text-lime-800 {
color: #507500;
}
.bg-lime-700 {
background-color: #6FA104;
}
.text-lime-700 {
color: #6FA104;
}
.bg-lime-600 {
background-color: #7EB40D;
}
.text-lime-600 {
color: #7EB40D;
}
.bg-lime-500 {
background-color: #8CC80C;
}
.text-lime-500 {
color: #8CC80C;
}
.bg-lime-400 {
background-color: #9DDD15;
}
.text-lime-400 {
color: #9DDD15;
}
.bg-lime-300 {
background-color: #ADE830;
}
.text-lime-300 {
color: #ADE830;
}
.bg-lime-200 {
background-color: #C0F354;
}
.text-lime-200 {
color: #C0F354;
}
.bg-lime-100 {
background-color: #D0F5A2;
}
.text-lime-100 {
color: #D0F5A2;
}
.bg-lime-50 {
background-color: #EBFAD9;
}
.text-lime-50 {
color: #EBFAD9;
}
.bg-yellow-1200 {
background-color: #604B00;
}
.text-yellow-1200 {
color: #604B00;
}
.bg-yellow-1100 {
background-color: #6E5600;
}
.text-yellow-1100 {
color: #6E5600;
}
.bg-yellow-1000 {
background-color: #806300;
}
.text-yellow-1000 {
color: #806300;
}
.bg-yellow-900 {
background-color: #927200;
}
.text-yellow-900 {
color: #927200;
}
.bg-yellow-800 {
background-color: #A58000;
}
.text-yellow-800 {
color: #A58000;
}
.bg-yellow-700 {
background-color: #B78F00;
}
.text-yellow-700 {
color: #B78F00;
}
.bg-yellow-600 {
background-color: #D2A400;
}
.text-yellow-600 {
color: #D2A400;
}
.bg-yellow-500 {
background-color: #EBB700;
}
.text-yellow-500 {
color: #EBB700;
}
.bg-yellow-400 {
background-color: #FFC700;
}
.text-yellow-400 {
color: #FFC700;
}
.bg-yellow-300 {
background-color: #FFD43D;
}
.text-yellow-300 {
color: #FFD43D;
}
.bg-yellow-200 {
background-color: #FFE380;
}
.text-yellow-200 {
color: #FFE380;
}
.bg-yellow-100 {
background-color: #FFF0B3;
}
.text-yellow-100 {
color: #FFF0B3;
}
.bg-yellow-50 {
background-color: #FBF5E0;
}
.text-yellow-50 {
color: #FBF5E0;
}
.bg-orange-1200 {
background-color: #541E00;
}
.text-orange-1200 {
color: #541E00;
}
.bg-orange-1100 {
background-color: #6D2700;
}
.text-orange-1100 {
color: #6D2700;
}
.bg-orange-1000 {
background-color: #8B3200;
}
.text-orange-1000 {
color: #8B3200;
}
.bg-orange-900 {
background-color: #AC3E00;
}
.text-orange-900 {
color: #AC3E00;
}
.bg-orange-800 {
background-color: #C74700;
}
.text-orange-800 {
color: #C74700;
}
.bg-orange-700 {
background-color: #E25100;
}
.text-orange-700 {
color: #E25100;
}
.bg-orange-600 {
background-color: #FB5B01;
}
.text-orange-600 {
color: #FB5B01;
}
.bg-orange-500 {
background-color: #FF7628;
}
.text-orange-500 {
color: #FF7628;
}
.bg-orange-400 {
background-color: #FF8D44;
}
.text-orange-400 {
color: #FF8D44;
}
.bg-orange-300 {
background-color: #FFA66D;
}
.text-orange-300 {
color: #FFA66D;
}
.bg-orange-200 {
background-color: #FFC199;
}
.text-orange-200 {
color: #FFC199;
}
.bg-orange-100 {
background-color: #FFDFCA;
}
.text-orange-100 {
color: #FFDFCA;
}
.bg-orange-50 {
background-color: #FFEEE2;
}
.text-orange-50 {
color: #FFEEE2;
}
.bg-red-1200 {
background-color: #620000;
}
.text-red-1200 {
color: #620000;
}
.bg-red-1100 {
background-color: #850000;
}
.text-red-1100 {
color: #850000;
}
.bg-red-1000 {
background-color: #A90000;
}
.text-red-1000 {
color: #A90000;
}
.bg-red-900 {
background-color: #CE0000;
}
.text-red-900 {
color: #CE0000;
}
.bg-red-800 {
background-color: #EC0000;
}
.text-red-800 {
color: #EC0000;
}
.bg-red-700 {
background-color: #FA0000;
}
.text-red-700 {
color: #FA0000;
}
.bg-red-600 {
background-color: #FE3939;
}
.text-red-600 {
color: #FE3939;
}
.bg-red-500 {
background-color: #FF5454;
}
.text-red-500 {
color: #FF5454;
}
.bg-red-400 {
background-color: #FF7171;
}
.text-red-400 {
color: #FF7171;
}
.bg-red-300 {
background-color: #FF9696;
}
.text-red-300 {
color: #FF9696;
}
.bg-red-200 {
background-color: #FFBBBB;
}
.text-red-200 {
color: #FFBBBB;
}
.bg-red-100 {
background-color: #FFDADA;
}
.text-red-100 {
color: #FFDADA;
}
.bg-red-50 {
background-color: #FDEEEE;
}
.text-red-50 {
color: #FDEEEE;
}
.bg-magenta-1200 {
background-color: #3B003B;
}
.text-magenta-1200 {
color: #3B003B;
}
.bg-magenta-1100 {
background-color: #500050;
}
.text-magenta-1100 {
color: #500050;
}
.bg-magenta-1000 {
background-color: #6C006C;
}
.text-magenta-1000 {
color: #6C006C;
}
.bg-magenta-900 {
background-color: #8B008B;
}
.text-magenta-900 {
color: #8B008B;
}
.bg-magenta-800 {
background-color: #AA00AA;
}
.text-magenta-800 {
color: #AA00AA;
}
.bg-magenta-700 {
background-color: #C000C0;
}
.text-magenta-700 {
color: #C000C0;
}
.bg-magenta-600 {
background-color: #DB00DB;
}
.text-magenta-600 {
color: #DB00DB;
}
.bg-magenta-500 {
background-color: #F137F1;
}
.text-magenta-500 {
color: #F137F1;
}
.bg-magenta-400 {
background-color: #F661F6;
}
.text-magenta-400 {
color: #F661F6;
}
.bg-magenta-300 {
background-color: #FF8EFF;
}
.text-magenta-300 {
color: #FF8EFF;
}
.bg-magenta-200 {
background-color: #FFAEFF;
}
.text-magenta-200 {
color: #FFAEFF;
}
.bg-magenta-100 {
background-color: #FFD0FF;
}
.text-magenta-100 {
color: #FFD0FF;
}
.bg-magenta-50 {
background-color: #F3E5F4;
}
.text-magenta-50 {
color: #F3E5F4;
}
.bg-purple-1200 {
background-color: #21004B;
}
.text-purple-1200 {
color: #21004B;
}
.bg-purple-1100 {
background-color: #30016C;
}
.text-purple-1100 {
color: #30016C;
}
.bg-purple-1000 {
background-color: #41048E;
}
.text-purple-1000 {
color: #41048E;
}
.bg-purple-900 {
background-color: #5109AD;
}
.text-purple-900 {
color: #5109AD;
}
.bg-purple-800 {
background-color: #5C10BE;
}
.text-purple-800 {
color: #5C10BE;
}
.bg-purple-700 {
background-color: #6F23D0;
}
.text-purple-700 {
color: #6F23D0;
}
.bg-purple-600 {
background-color: #8843E1;
}
.text-purple-600 {
color: #8843E1;
}
.bg-purple-500 {
background-color: #A565F8;
}
.text-purple-500 {
color: #A565F8;
}
.bg-purple-400 {
background-color: #BB87FF;
}
.text-purple-400 {
color: #BB87FF;
}
.bg-purple-300 {
background-color: #CDA6FF;
}
.text-purple-300 {
color: #CDA6FF;
}
.bg-purple-200 {
background-color: #DDC2FF;
}
.text-purple-200 {
color: #DDC2FF;
}
.bg-purple-100 {
background-color: #ECDDFF;
}
.text-purple-100 {
color: #ECDDFF;
}
.bg-purple-50 {
background-color: #F1EAFA;
}
.text-purple-50 {
color: #F1EAFA;
}
.d-none {
display: none;
}
.d-inline {
display: inline;
}
.d-inline-block {
display: inline-block;
}
.d-block {
display: block;
}
.d-grid {
display: grid;
}
.d-inline-grid {
display: inline-grid;
}
.d-flex {
display: flex;
}
.d-inline-flex {
display: inline-flex;
}
@media screen and (min-width: 768px) {
.d-sm-none {
display: none;
}
.d-sm-inline {
display: inline;
}
.d-sm-inline-block {
display: inline-block;
}
.d-sm-block {
display: block;
}
.d-sm-grid {
display: grid;
}
.d-sm-inline-grid {
display: inline-grid;
}
.d-sm-flex {
display: flex;
}
.d-sm-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 992px) {
.d-md-none {
display: none;
}
.d-md-inline {
display: inline;
}
.d-md-inline-block {
display: inline-block;
}
.d-md-block {
display: block;
}
.d-md-grid {
display: grid;
}
.d-md-inline-grid {
display: inline-grid;
}
.d-md-flex {
display: flex;
}
.d-md-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 1280px) {
.d-lg-none {
display: none;
}
.d-lg-inline {
display: inline;
}
.d-lg-inline-block {
display: inline-block;
}
.d-lg-block {
display: block;
}
.d-lg-grid {
display: grid;
}
.d-lg-inline-grid {
display: inline-grid;
}
.d-lg-flex {
display: flex;
}
.d-lg-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 1440px) {
.d-xl-none {
display: none;
}
.d-xl-inline {
display: inline;
}
.d-xl-inline-block {
display: inline-block;
}
.d-xl-block {
display: block;
}
.d-xl-grid {
display: grid;
}
.d-xl-inline-grid {
display: inline-grid;
}
.d-xl-flex {
display: flex;
}
.d-xl-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 1920px) {
.d-xxl-none {
display: none;
}
.d-xxl-inline {
display: inline;
}
.d-xxl-inline-block {
display: inline-block;
}
.d-xxl-block {
display: block;
}
.d-xxl-grid {
display: grid;
}
.d-xxl-inline-grid {
display: inline-grid;
}
.d-xxl-flex {
display: flex;
}
.d-xxl-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 2560px) {
.d-xxxl-none {
display: none;
}
.d-xxxl-inline {
display: inline;
}
.d-xxxl-inline-block {
display: inline-block;
}
.d-xxxl-block {
display: block;
}
.d-xxxl-grid {
display: grid;
}
.d-xxxl-inline-grid {
display: inline-grid;
}
.d-xxxl-flex {
display: flex;
}
.d-xxxl-inline-flex {
display: inline-flex;
}
}
@media screen and (min-width: 3840px) {
.d-x4k-none {
display: none;
}
.d-x4k-inline {
display: inline;
}
.d-x4k-inline-block {
display: inline-block;
}
.d-x4k-block {
display: block;
}
.d-x4k-grid {
display: grid;
}
.d-x4k-inline-grid {
display: inline-grid;
}
.d-x4k-flex {
display: flex;
}
.d-x4k-inline-flex {
display: inline-flex;
}
}
.flex-row {
flex-direction: row;
}
.flex-row-reverse {
flex-direction: row-reverse;
}
.flex-col {
flex-direction: column;
}
.flex-col-reverse {
flex-direction: column-reverse;
}
@media screen and (min-width: 768px) {
.flex-sm-row {
flex-direction: row;
}
.flex-sm-row-reverse {
flex-direction: row-reverse;
}
.flex-sm-col {
flex-direction: column;
}
.flex-sm-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 992px) {
.flex-md-row {
flex-direction: row;
}
.flex-md-row-reverse {
flex-direction: row-reverse;
}
.flex-md-col {
flex-direction: column;
}
.flex-md-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 1280px) {
.flex-lg-row {
flex-direction: row;
}
.flex-lg-row-reverse {
flex-direction: row-reverse;
}
.flex-lg-col {
flex-direction: column;
}
.flex-lg-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 1440px) {
.flex-xl-row {
flex-direction: row;
}
.flex-xl-row-reverse {
flex-direction: row-reverse;
}
.flex-xl-col {
flex-direction: column;
}
.flex-xl-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 1920px) {
.flex-xxl-row {
flex-direction: row;
}
.flex-xxl-row-reverse {
flex-direction: row-reverse;
}
.flex-xxl-col {
flex-direction: column;
}
.flex-xxl-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 2560px) {
.flex-xxxl-row {
flex-direction: row;
}
.flex-xxxl-row-reverse {
flex-direction: row-reverse;
}
.flex-xxxl-col {
flex-direction: column;
}
.flex-xxxl-col-reverse {
flex-direction: column-reverse;
}
}
@media screen and (min-width: 3840px) {
.flex-x4k-row {
flex-direction: row;
}
.flex-x4k-row-reverse {
flex-direction: row-reverse;
}
.flex-x4k-col {
flex-direction: column;
}
.flex-x4k-col-reverse {
flex-direction: column-reverse;
}
}
.justify-normal {
justify-content: normal;
}
.justify-start {
justify-content: flex-start;
}
.justify-end {
justify-content: flex-end;
}
.justify-center {
justify-content: center;
}
.justify-between {
justify-content: space-between;
}
.justify-around {
justify-content: space-around;
}
.justify-evenly {
justify-content: space-evenly;
}
.justify-stretch {
justify-content: stretch;
}
@media screen and (min-width: 768px) {
.justify-sm-normal {
justify-content: normal;
}
.justify-sm-start {
justify-content: flex-start;
}
.justify-sm-end {
justify-content: flex-end;
}
.justify-sm-center {
justify-content: center;
}
.justify-sm-between {
justify-content: space-between;
}
.justify-sm-around {
justify-content: space-around;
}
.justify-sm-evenly {
justify-content: space-evenly;
}
.justify-sm-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 992px) {
.justify-md-normal {
justify-content: normal;
}
.justify-md-start {
justify-content: flex-start;
}
.justify-md-end {
justify-content: flex-end;
}
.justify-md-center {
justify-content: center;
}
.justify-md-between {
justify-content: space-between;
}
.justify-md-around {
justify-content: space-around;
}
.justify-md-evenly {
justify-content: space-evenly;
}
.justify-md-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 1280px) {
.justify-lg-normal {
justify-content: normal;
}
.justify-lg-start {
justify-content: flex-start;
}
.justify-lg-end {
justify-content: flex-end;
}
.justify-lg-center {
justify-content: center;
}
.justify-lg-between {
justify-content: space-between;
}
.justify-lg-around {
justify-content: space-around;
}
.justify-lg-evenly {
justify-content: space-evenly;
}
.justify-lg-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 1440px) {
.justify-xl-normal {
justify-content: normal;
}
.justify-xl-start {
justify-content: flex-start;
}
.justify-xl-end {
justify-content: flex-end;
}
.justify-xl-center {
justify-content: center;
}
.justify-xl-between {
justify-content: space-between;
}
.justify-xl-around {
justify-content: space-around;
}
.justify-xl-evenly {
justify-content: space-evenly;
}
.justify-xl-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 1920px) {
.justify-xxl-normal {
justify-content: normal;
}
.justify-xxl-start {
justify-content: flex-start;
}
.justify-xxl-end {
justify-content: flex-end;
}
.justify-xxl-center {
justify-content: center;
}
.justify-xxl-between {
justify-content: space-between;
}
.justify-xxl-around {
justify-content: space-around;
}
.justify-xxl-evenly {
justify-content: space-evenly;
}
.justify-xxl-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 2560px) {
.justify-xxxl-normal {
justify-content: normal;
}
.justify-xxxl-start {
justify-content: flex-start;
}
.justify-xxxl-end {
justify-content: flex-end;
}
.justify-xxxl-center {
justify-content: center;
}
.justify-xxxl-between {
justify-content: space-between;
}
.justify-xxxl-around {
justify-content: space-around;
}
.justify-xxxl-evenly {
justify-content: space-evenly;
}
.justify-xxxl-stretch {
justify-content: stretch;
}
}
@media screen and (min-width: 3840px) {
.justify-x4k-normal {
justify-content: normal;
}
.justify-x4k-start {
justify-content: flex-start;
}
.justify-x4k-end {
justify-content: flex-end;
}
.justify-x4k-center {
justify-content: center;
}
.justify-x4k-between {
justify-content: space-between;
}
.justify-x4k-around {
justify-content: space-around;
}
.justify-x4k-evenly {
justify-content: space-evenly;
}
.justify-x4k-stretch {
justify-content: stretch;
}
}
.align-items-normal {
align-items: normal;
}
.align-items-start {
align-items: flex-start;
}
.align-items-end {
align-items: flex-end;
}
.align-items-center {
align-items: center;
}
.align-items-baseline {
align-items: baseline;
}
.align-items-stretch {
align-items: stretch;
}
@media screen and (min-width: 768px) {
.align-items-sm-normal {
align-items: normal;
}
.align-items-sm-start {
align-items: flex-start;
}
.align-items-sm-end {
align-items: flex-end;
}
.align-items-sm-center {
align-items: center;
}
.align-items-sm-baseline {
align-items: baseline;
}
.align-items-sm-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 992px) {
.align-items-md-normal {
align-items: normal;
}
.align-items-md-start {
align-items: flex-start;
}
.align-items-md-end {
align-items: flex-end;
}
.align-items-md-center {
align-items: center;
}
.align-items-md-baseline {
align-items: baseline;
}
.align-items-md-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 1280px) {
.align-items-lg-normal {
align-items: normal;
}
.align-items-lg-start {
align-items: flex-start;
}
.align-items-lg-end {
align-items: flex-end;
}
.align-items-lg-center {
align-items: center;
}
.align-items-lg-baseline {
align-items: baseline;
}
.align-items-lg-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 1440px) {
.align-items-xl-normal {
align-items: normal;
}
.align-items-xl-start {
align-items: flex-start;
}
.align-items-xl-end {
align-items: flex-end;
}
.align-items-xl-center {
align-items: center;
}
.align-items-xl-baseline {
align-items: baseline;
}
.align-items-xl-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 1920px) {
.align-items-xxl-normal {
align-items: normal;
}
.align-items-xxl-start {
align-items: flex-start;
}
.align-items-xxl-end {
align-items: flex-end;
}
.align-items-xxl-center {
align-items: center;
}
.align-items-xxl-baseline {
align-items: baseline;
}
.align-items-xxl-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 2560px) {
.align-items-xxxl-normal {
align-items: normal;
}
.align-items-xxxl-start {
align-items: flex-start;
}
.align-items-xxxl-end {
align-items: flex-end;
}
.align-items-xxxl-center {
align-items: center;
}
.align-items-xxxl-baseline {
align-items: baseline;
}
.align-items-xxxl-stretch {
align-items: stretch;
}
}
@media screen and (min-width: 3840px) {
.align-items-x4k-normal {
align-items: normal;
}
.align-items-x4k-start {
align-items: flex-start;
}
.align-items-x4k-end {
align-items: flex-end;
}
.align-items-x4k-center {
align-items: center;
}
.align-items-x4k-baseline {
align-items: baseline;
}
.align-items-x4k-stretch {
align-items: stretch;
}
}
.flex-nowrap {
flex-wrap: nowrap;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
@media screen and (min-width: 768px) {
.flex-sm-nowrap {
flex-wrap: nowrap;
}
.flex-sm-wrap {
flex-wrap: wrap;
}
.flex-sm-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 992px) {
.flex-md-nowrap {
flex-wrap: nowrap;
}
.flex-md-wrap {
flex-wrap: wrap;
}
.flex-md-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 1280px) {
.flex-lg-nowrap {
flex-wrap: nowrap;
}
.flex-lg-wrap {
flex-wrap: wrap;
}
.flex-lg-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 1440px) {
.flex-xl-nowrap {
flex-wrap: nowrap;
}
.flex-xl-wrap {
flex-wrap: wrap;
}
.flex-xl-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 1920px) {
.flex-xxl-nowrap {
flex-wrap: nowrap;
}
.flex-xxl-wrap {
flex-wrap: wrap;
}
.flex-xxl-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 2560px) {
.flex-xxxl-nowrap {
flex-wrap: nowrap;
}
.flex-xxxl-wrap {
flex-wrap: wrap;
}
.flex-xxxl-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
@media screen and (min-width: 3840px) {
.flex-x4k-nowrap {
flex-wrap: nowrap;
}
.flex-x4k-wrap {
flex-wrap: wrap;
}
.flex-x4k-wrap-reverse {
flex-wrap: wrap-reverse;
}
}
.order-first {
order: -9999;
}
.order-last {
order: 9999;
}
.order-none {
order: 0;
}
.order-1 {
order: 1;
}
.order-2 {
order: 2;
}
.order-3 {
order: 3;
}
.order-4 {
order: 4;
}
.order-5 {
order: 5;
}
.order-6 {
order: 6;
}
.order-7 {
order: 7;
}
.order-8 {
order: 8;
}
.order-9 {
order: 9;
}
.order-10 {
order: 10;
}
.order-11 {
order: 11;
}
.order-12 {
order: 12;
}
@media screen and (min-width: 768px) {
.order-sm-first {
order: -9999;
}
.order-sm-last {
order: 9999;
}
.order-sm-none {
order: 0;
}
.order-sm-1 {
order: 1;
}
.order-sm-2 {
order: 2;
}
.order-sm-3 {
order: 3;
}
.order-sm-4 {
order: 4;
}
.order-sm-5 {
order: 5;
}
.order-sm-6 {
order: 6;
}
.order-sm-7 {
order: 7;
}
.order-sm-8 {
order: 8;
}
.order-sm-9 {
order: 9;
}
.order-sm-10 {
order: 10;
}
.order-sm-11 {
order: 11;
}
.order-sm-12 {
order: 12;
}
}
@media screen and (min-width: 992px) {
.order-md-first {
order: -9999;
}
.order-md-last {
order: 9999;
}
.order-md-none {
order: 0;
}
.order-md-1 {
order: 1;
}
.order-md-2 {
order: 2;
}
.order-md-3 {
order: 3;
}
.order-md-4 {
order: 4;
}
.order-md-5 {
order: 5;
}
.order-md-6 {
order: 6;
}
.order-md-7 {
order: 7;
}
.order-md-8 {
order: 8;
}
.order-md-9 {
order: 9;
}
.order-md-10 {
order: 10;
}
.order-md-11 {
order: 11;
}
.order-md-12 {
order: 12;
}
}
@media screen and (min-width: 1280px) {
.order-lg-first {
order: -9999;
}
.order-lg-last {
order: 9999;
}
.order-lg-none {
order: 0;
}
.order-lg-1 {
order: 1;
}
.order-lg-2 {
order: 2;
}
.order-lg-3 {
order: 3;
}
.order-lg-4 {
order: 4;
}
.order-lg-5 {
order: 5;
}
.order-lg-6 {
order: 6;
}
.order-lg-7 {
order: 7;
}
.order-lg-8 {
order: 8;
}
.order-lg-9 {
order: 9;
}
.order-lg-10 {
order: 10;
}
.order-lg-11 {
order: 11;
}
.order-lg-12 {
order: 12;
}
}
@media screen and (min-width: 1440px) {
.order-xl-first {
order: -9999;
}
.order-xl-last {
order: 9999;
}
.order-xl-none {
order: 0;
}
.order-xl-1 {
order: 1;
}
.order-xl-2 {
order: 2;
}
.order-xl-3 {
order: 3;
}
.order-xl-4 {
order: 4;
}
.order-xl-5 {
order: 5;
}
.order-xl-6 {
order: 6;
}
.order-xl-7 {
order: 7;
}
.order-xl-8 {
order: 8;
}
.order-xl-9 {
order: 9;
}
.order-xl-10 {
order: 10;
}
.order-xl-11 {
order: 11;
}
.order-xl-12 {
order: 12;
}
}
@media screen and (min-width: 1920px) {
.order-xxl-first {
order: -9999;
}
.order-xxl-last {
order: 9999;
}
.order-xxl-none {
order: 0;
}
.order-xxl-1 {
order: 1;
}
.order-xxl-2 {
order: 2;
}
.order-xxl-3 {
order: 3;
}
.order-xxl-4 {
order: 4;
}
.order-xxl-5 {
order: 5;
}
.order-xxl-6 {
order: 6;
}
.order-xxl-7 {
order: 7;
}
.order-xxl-8 {
order: 8;
}
.order-xxl-9 {
order: 9;
}
.order-xxl-10 {
order: 10;
}
.order-xxl-11 {
order: 11;
}
.order-xxl-12 {
order: 12;
}
}
@media screen and (min-width: 2560px) {
.order-xxxl-first {
order: -9999;
}
.order-xxxl-last {
order: 9999;
}
.order-xxxl-none {
order: 0;
}
.order-xxxl-1 {
order: 1;
}
.order-xxxl-2 {
order: 2;
}
.order-xxxl-3 {
order: 3;
}
.order-xxxl-4 {
order: 4;
}
.order-xxxl-5 {
order: 5;
}
.order-xxxl-6 {
order: 6;
}
.order-xxxl-7 {
order: 7;
}
.order-xxxl-8 {
order: 8;
}
.order-xxxl-9 {
order: 9;
}
.order-xxxl-10 {
order: 10;
}
.order-xxxl-11 {
order: 11;
}
.order-xxxl-12 {
order: 12;
}
}
@media screen and (min-width: 3840px) {
.order-x4k-first {
order: -9999;
}
.order-x4k-last {
order: 9999;
}
.order-x4k-none {
order: 0;
}
.order-x4k-1 {
order: 1;
}
.order-x4k-2 {
order: 2;
}
.order-x4k-3 {
order: 3;
}
.order-x4k-4 {
order: 4;
}
.order-x4k-5 {
order: 5;
}
.order-x4k-6 {
order: 6;
}
.order-x4k-7 {
order: 7;
}
.order-x4k-8 {
order: 8;
}
.order-x4k-9 {
order: 9;
}
.order-x4k-10 {
order: 10;
}
.order-x4k-11 {
order: 11;
}
.order-x4k-12 {
order: 12;
}
}
.img-fluid {
max-width: 100%;
height: auto;
}
.link {
color: #00118F;
text-decoration: underline;
text-decoration-thickness: 0.0625rem;
text-underline-offset: 0.1875rem;
}
.link:hover {
color: #0017C1;
text-decoration-thickness: 0.1875rem;
}
.link:active {
color: #C74700;
text-decoration-thickness: 0.0625rem;
}
.link:focus {
outline: 0.25rem solid #000000;
outline-offset: 0.125rem;
border-radius: 0.25rem;
background-color: #FFD43D;
box-shadow: 0 0 0 0.125rem #FFD43D;
}
.link[target=_blank]::after, .link[rel=external]::after {
display: inline-block;
background-color: #1a1a1a;
width: 1em;
height: 1em;
mask-image: url('data:image/svg+xml;utf8,');
content: "";
margin-left: 4px;
vertical-align: -0.15em;
}
.list, .list-ordered, .list-unordered {
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0.02rem;
list-style-position: inside;
display: flex;
flex-direction: column;
gap: 8px;
}
.list-unordered {
list-style-type: disc;
}
.list-ordered {
list-style-type: decimal;
}
.ratio-16x9 {
aspect-ratio: 1.7777777778;
}
.ratio-9x16 {
aspect-ratio: 0.5625;
}
.ratio-3x2 {
aspect-ratio: 1.5;
}
.ratio-1x1 {
aspect-ratio: 1;
}
.w-25 {
width: 25%;
}
.w-50 {
width: 50%;
}
.w-75 {
width: 75%;
}
.w-100 {
width: 100%;
}
.w-auto {
width: auto;
}
@media screen and (min-width: 768px) {
.w-sm-25 {
width: 25%;
}
.w-sm-50 {
width: 50%;
}
.w-sm-75 {
width: 75%;
}
.w-sm-100 {
width: 100%;
}
.w-sm-auto {
width: auto;
}
}
@media screen and (min-width: 992px) {
.w-md-25 {
width: 25%;
}
.w-md-50 {
width: 50%;
}
.w-md-75 {
width: 75%;
}
.w-md-100 {
width: 100%;
}
.w-md-auto {
width: auto;
}
}
@media screen and (min-width: 1280px) {
.w-lg-25 {
width: 25%;
}
.w-lg-50 {
width: 50%;
}
.w-lg-75 {
width: 75%;
}
.w-lg-100 {
width: 100%;
}
.w-lg-auto {
width: auto;
}
}
@media screen and (min-width: 1440px) {
.w-xl-25 {
width: 25%;
}
.w-xl-50 {
width: 50%;
}
.w-xl-75 {
width: 75%;
}
.w-xl-100 {
width: 100%;
}
.w-xl-auto {
width: auto;
}
}
@media screen and (min-width: 1920px) {
.w-xxl-25 {
width: 25%;
}
.w-xxl-50 {
width: 50%;
}
.w-xxl-75 {
width: 75%;
}
.w-xxl-100 {
width: 100%;
}
.w-xxl-auto {
width: auto;
}
}
@media screen and (min-width: 2560px) {
.w-xxxl-25 {
width: 25%;
}
.w-xxxl-50 {
width: 50%;
}
.w-xxxl-75 {
width: 75%;
}
.w-xxxl-100 {
width: 100%;
}
.w-xxxl-auto {
width: auto;
}
}
@media screen and (min-width: 3840px) {
.w-x4k-25 {
width: 25%;
}
.w-x4k-50 {
width: 50%;
}
.w-x4k-75 {
width: 75%;
}
.w-x4k-100 {
width: 100%;
}
.w-x4k-auto {
width: auto;
}
}
.max-w-25 {
max-width: 25%;
}
.max-w-50 {
max-width: 50%;
}
.max-w-75 {
max-width: 75%;
}
.max-w-100 {
max-width: 100%;
}
@media screen and (min-width: 768px) {
.max-w-sm-25 {
max-width: 25%;
}
.max-w-sm-50 {
max-width: 50%;
}
.max-w-sm-75 {
max-width: 75%;
}
.max-w-sm-100 {
max-width: 100%;
}
}
@media screen and (min-width: 992px) {
.max-w-md-25 {
max-width: 25%;
}
.max-w-md-50 {
max-width: 50%;
}
.max-w-md-75 {
max-width: 75%;
}
.max-w-md-100 {
max-width: 100%;
}
}
@media screen and (min-width: 1280px) {
.max-w-lg-25 {
max-width: 25%;
}
.max-w-lg-50 {
max-width: 50%;
}
.max-w-lg-75 {
max-width: 75%;
}
.max-w-lg-100 {
max-width: 100%;
}
}
@media screen and (min-width: 1440px) {
.max-w-xl-25 {
max-width: 25%;
}
.max-w-xl-50 {
max-width: 50%;
}
.max-w-xl-75 {
max-width: 75%;
}
.max-w-xl-100 {
max-width: 100%;
}
}
@media screen and (min-width: 1920px) {
.max-w-xxl-25 {
max-width: 25%;
}
.max-w-xxl-50 {
max-width: 50%;
}
.max-w-xxl-75 {
max-width: 75%;
}
.max-w-xxl-100 {
max-width: 100%;
}
}
@media screen and (min-width: 2560px) {
.max-w-xxxl-25 {
max-width: 25%;
}
.max-w-xxxl-50 {
max-width: 50%;
}
.max-w-xxxl-75 {
max-width: 75%;
}
.max-w-xxxl-100 {
max-width: 100%;
}
}
@media screen and (min-width: 3840px) {
.max-w-x4k-25 {
max-width: 25%;
}
.max-w-x4k-50 {
max-width: 50%;
}
.max-w-x4k-75 {
max-width: 75%;
}
.max-w-x4k-100 {
max-width: 100%;
}
}
.min-w-25 {
min-width: 25%;
}
.min-w-50 {
min-width: 50%;
}
.min-w-75 {
min-width: 75%;
}
.min-w-100 {
min-width: 100%;
}
@media screen and (min-width: 768px) {
.min-w-sm-25 {
min-width: 25%;
}
.min-w-sm-50 {
min-width: 50%;
}
.min-w-sm-75 {
min-width: 75%;
}
.min-w-sm-100 {
min-width: 100%;
}
}
@media screen and (min-width: 992px) {
.min-w-md-25 {
min-width: 25%;
}
.min-w-md-50 {
min-width: 50%;
}
.min-w-md-75 {
min-width: 75%;
}
.min-w-md-100 {
min-width: 100%;
}
}
@media screen and (min-width: 1280px) {
.min-w-lg-25 {
min-width: 25%;
}
.min-w-lg-50 {
min-width: 50%;
}
.min-w-lg-75 {
min-width: 75%;
}
.min-w-lg-100 {
min-width: 100%;
}
}
@media screen and (min-width: 1440px) {
.min-w-xl-25 {
min-width: 25%;
}
.min-w-xl-50 {
min-width: 50%;
}
.min-w-xl-75 {
min-width: 75%;
}
.min-w-xl-100 {
min-width: 100%;
}
}
@media screen and (min-width: 1920px) {
.min-w-xxl-25 {
min-width: 25%;
}
.min-w-xxl-50 {
min-width: 50%;
}
.min-w-xxl-75 {
min-width: 75%;
}
.min-w-xxl-100 {
min-width: 100%;
}
}
@media screen and (min-width: 2560px) {
.min-w-xxxl-25 {
min-width: 25%;
}
.min-w-xxxl-50 {
min-width: 50%;
}
.min-w-xxxl-75 {
min-width: 75%;
}
.min-w-xxxl-100 {
min-width: 100%;
}
}
@media screen and (min-width: 3840px) {
.min-w-x4k-25 {
min-width: 25%;
}
.min-w-x4k-50 {
min-width: 50%;
}
.min-w-x4k-75 {
min-width: 75%;
}
.min-w-x4k-100 {
min-width: 100%;
}
}
.h-25 {
height: 25%;
}
.h-50 {
height: 50%;
}
.h-75 {
height: 75%;
}
.h-100 {
height: 100%;
}
.h-auto {
height: auto;
}
@media screen and (min-width: 768px) {
.h-sm-25 {
height: 25%;
}
.h-sm-50 {
height: 50%;
}
.h-sm-75 {
height: 75%;
}
.h-sm-100 {
height: 100%;
}
.h-sm-auto {
height: auto;
}
}
@media screen and (min-width: 992px) {
.h-md-25 {
height: 25%;
}
.h-md-50 {
height: 50%;
}
.h-md-75 {
height: 75%;
}
.h-md-100 {
height: 100%;
}
.h-md-auto {
height: auto;
}
}
@media screen and (min-width: 1280px) {
.h-lg-25 {
height: 25%;
}
.h-lg-50 {
height: 50%;
}
.h-lg-75 {
height: 75%;
}
.h-lg-100 {
height: 100%;
}
.h-lg-auto {
height: auto;
}
}
@media screen and (min-width: 1440px) {
.h-xl-25 {
height: 25%;
}
.h-xl-50 {
height: 50%;
}
.h-xl-75 {
height: 75%;
}
.h-xl-100 {
height: 100%;
}
.h-xl-auto {
height: auto;
}
}
@media screen and (min-width: 1920px) {
.h-xxl-25 {
height: 25%;
}
.h-xxl-50 {
height: 50%;
}
.h-xxl-75 {
height: 75%;
}
.h-xxl-100 {
height: 100%;
}
.h-xxl-auto {
height: auto;
}
}
@media screen and (min-width: 2560px) {
.h-xxxl-25 {
height: 25%;
}
.h-xxxl-50 {
height: 50%;
}
.h-xxxl-75 {
height: 75%;
}
.h-xxxl-100 {
height: 100%;
}
.h-xxxl-auto {
height: auto;
}
}
@media screen and (min-width: 3840px) {
.h-x4k-25 {
height: 25%;
}
.h-x4k-50 {
height: 50%;
}
.h-x4k-75 {
height: 75%;
}
.h-x4k-100 {
height: 100%;
}
.h-x4k-auto {
height: auto;
}
}
.max-h-25 {
max-height: 25%;
}
.max-h-50 {
max-height: 50%;
}
.max-h-75 {
max-height: 75%;
}
.max-h-100 {
max-height: 100%;
}
@media screen and (min-width: 768px) {
.max-h-sm-25 {
max-height: 25%;
}
.max-h-sm-50 {
max-height: 50%;
}
.max-h-sm-75 {
max-height: 75%;
}
.max-h-sm-100 {
max-height: 100%;
}
}
@media screen and (min-width: 992px) {
.max-h-md-25 {
max-height: 25%;
}
.max-h-md-50 {
max-height: 50%;
}
.max-h-md-75 {
max-height: 75%;
}
.max-h-md-100 {
max-height: 100%;
}
}
@media screen and (min-width: 1280px) {
.max-h-lg-25 {
max-height: 25%;
}
.max-h-lg-50 {
max-height: 50%;
}
.max-h-lg-75 {
max-height: 75%;
}
.max-h-lg-100 {
max-height: 100%;
}
}
@media screen and (min-width: 1440px) {
.max-h-xl-25 {
max-height: 25%;
}
.max-h-xl-50 {
max-height: 50%;
}
.max-h-xl-75 {
max-height: 75%;
}
.max-h-xl-100 {
max-height: 100%;
}
}
@media screen and (min-width: 1920px) {
.max-h-xxl-25 {
max-height: 25%;
}
.max-h-xxl-50 {
max-height: 50%;
}
.max-h-xxl-75 {
max-height: 75%;
}
.max-h-xxl-100 {
max-height: 100%;
}
}
@media screen and (min-width: 2560px) {
.max-h-xxxl-25 {
max-height: 25%;
}
.max-h-xxxl-50 {
max-height: 50%;
}
.max-h-xxxl-75 {
max-height: 75%;
}
.max-h-xxxl-100 {
max-height: 100%;
}
}
@media screen and (min-width: 3840px) {
.max-h-x4k-25 {
max-height: 25%;
}
.max-h-x4k-50 {
max-height: 50%;
}
.max-h-x4k-75 {
max-height: 75%;
}
.max-h-x4k-100 {
max-height: 100%;
}
}
.min-h-25 {
min-height: 25%;
}
.min-h-50 {
min-height: 50%;
}
.min-h-75 {
min-height: 75%;
}
.min-h-100 {
min-height: 100%;
}
@media screen and (min-width: 768px) {
.min-h-sm-25 {
min-height: 25%;
}
.min-h-sm-50 {
min-height: 50%;
}
.min-h-sm-75 {
min-height: 75%;
}
.min-h-sm-100 {
min-height: 100%;
}
}
@media screen and (min-width: 992px) {
.min-h-md-25 {
min-height: 25%;
}
.min-h-md-50 {
min-height: 50%;
}
.min-h-md-75 {
min-height: 75%;
}
.min-h-md-100 {
min-height: 100%;
}
}
@media screen and (min-width: 1280px) {
.min-h-lg-25 {
min-height: 25%;
}
.min-h-lg-50 {
min-height: 50%;
}
.min-h-lg-75 {
min-height: 75%;
}
.min-h-lg-100 {
min-height: 100%;
}
}
@media screen and (min-width: 1440px) {
.min-h-xl-25 {
min-height: 25%;
}
.min-h-xl-50 {
min-height: 50%;
}
.min-h-xl-75 {
min-height: 75%;
}
.min-h-xl-100 {
min-height: 100%;
}
}
@media screen and (min-width: 1920px) {
.min-h-xxl-25 {
min-height: 25%;
}
.min-h-xxl-50 {
min-height: 50%;
}
.min-h-xxl-75 {
min-height: 75%;
}
.min-h-xxl-100 {
min-height: 100%;
}
}
@media screen and (min-width: 2560px) {
.min-h-xxxl-25 {
min-height: 25%;
}
.min-h-xxxl-50 {
min-height: 50%;
}
.min-h-xxxl-75 {
min-height: 75%;
}
.min-h-xxxl-100 {
min-height: 100%;
}
}
@media screen and (min-width: 3840px) {
.min-h-x4k-25 {
min-height: 25%;
}
.min-h-x4k-50 {
min-height: 50%;
}
.min-h-x4k-75 {
min-height: 75%;
}
.min-h-x4k-100 {
min-height: 100%;
}
}
.m-0 {
margin: 0;
}
.m-1 {
margin: 0.25rem;
}
.m-2 {
margin: 0.5rem;
}
.m-3 {
margin: 1rem;
}
.m-4 {
margin: 1.5rem;
}
.m-5 {
margin: 2.5rem;
}
.m-6 {
margin: 4rem;
}
.m-7 {
margin: 6.5rem;
}
.m-8 {
margin: 10.5rem;
}
.m-9 {
margin: 17rem;
}
.m-auto {
margin: auto;
}
.mt-0 {
margin-top: 0;
}
.mt-1 {
margin-top: 0.25rem;
}
.mt-2 {
margin-top: 0.5rem;
}
.mt-3 {
margin-top: 1rem;
}
.mt-4 {
margin-top: 1.5rem;
}
.mt-5 {
margin-top: 2.5rem;
}
.mt-6 {
margin-top: 4rem;
}
.mt-7 {
margin-top: 6.5rem;
}
.mt-8 {
margin-top: 10.5rem;
}
.mt-9 {
margin-top: 17rem;
}
.mt-auto {
margin-top: auto;
}
.mr-0 {
margin-right: 0;
}
.mr-1 {
margin-right: 0.25rem;
}
.mr-2 {
margin-right: 0.5rem;
}
.mr-3 {
margin-right: 1rem;
}
.mr-4 {
margin-right: 1.5rem;
}
.mr-5 {
margin-right: 2.5rem;
}
.mr-6 {
margin-right: 4rem;
}
.mr-7 {
margin-right: 6.5rem;
}
.mr-8 {
margin-right: 10.5rem;
}
.mr-9 {
margin-right: 17rem;
}
.mr-auto {
margin-right: auto;
}
.mb-0 {
margin-bottom: 0;
}
.mb-1 {
margin-bottom: 0.25rem;
}
.mb-2 {
margin-bottom: 0.5rem;
}
.mb-3 {
margin-bottom: 1rem;
}
.mb-4 {
margin-bottom: 1.5rem;
}
.mb-5 {
margin-bottom: 2.5rem;
}
.mb-6 {
margin-bottom: 4rem;
}
.mb-7 {
margin-bottom: 6.5rem;
}
.mb-8 {
margin-bottom: 10.5rem;
}
.mb-9 {
margin-bottom: 17rem;
}
.mb-auto {
margin-bottom: auto;
}
.ml-0 {
margin-left: 0;
}
.ml-1 {
margin-left: 0.25rem;
}
.ml-2 {
margin-left: 0.5rem;
}
.ml-3 {
margin-left: 1rem;
}
.ml-4 {
margin-left: 1.5rem;
}
.ml-5 {
margin-left: 2.5rem;
}
.ml-6 {
margin-left: 4rem;
}
.ml-7 {
margin-left: 6.5rem;
}
.ml-8 {
margin-left: 10.5rem;
}
.ml-9 {
margin-left: 17rem;
}
.ml-auto {
margin-left: auto;
}
.mx-0 {
margin-right: 0;
margin-left: 0;
}
.mx-1 {
margin-right: 0.25rem;
margin-left: 0.25rem;
}
.mx-2 {
margin-right: 0.5rem;
margin-left: 0.5rem;
}
.mx-3 {
margin-right: 1rem;
margin-left: 1rem;
}
.mx-4 {
margin-right: 1.5rem;
margin-left: 1.5rem;
}
.mx-5 {
margin-right: 2.5rem;
margin-left: 2.5rem;
}
.mx-6 {
margin-right: 4rem;
margin-left: 4rem;
}
.mx-7 {
margin-right: 6.5rem;
margin-left: 6.5rem;
}
.mx-8 {
margin-right: 10.5rem;
margin-left: 10.5rem;
}
.mx-9 {
margin-right: 17rem;
margin-left: 17rem;
}
.mx-auto {
margin-right: auto;
margin-left: auto;
}
.my-0 {
margin-top: 0;
margin-bottom: 0;
}
.my-1 {
margin-top: 0.25rem;
margin-bottom: 0.25rem;
}
.my-2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.my-3 {
margin-top: 1rem;
margin-bottom: 1rem;
}
.my-4 {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
.my-5 {
margin-top: 2.5rem;
margin-bottom: 2.5rem;
}
.my-6 {
margin-top: 4rem;
margin-bottom: 4rem;
}
.my-7 {
margin-top: 6.5rem;
margin-bottom: 6.5rem;
}
.my-8 {
margin-top: 10.5rem;
margin-bottom: 10.5rem;
}
.my-9 {
margin-top: 17rem;
margin-bottom: 17rem;
}
.my-auto {
margin-top: auto;
margin-bottom: auto;
}
.p-0 {
padding: 0;
}
.p-1 {
padding: 0.25rem;
}
.p-2 {
padding: 0.5rem;
}
.p-3 {
padding: 1rem;
}
.p-4 {
padding: 1.5rem;
}
.p-5 {
padding: 2.5rem;
}
.p-6 {
padding: 4rem;
}
.p-7 {
padding: 6.5rem;
}
.p-8 {
padding: 10.5rem;
}
.p-9 {
padding: 17rem;
}
.pt-0 {
padding-top: 0;
}
.pt-1 {
padding-top: 0.25rem;
}
.pt-2 {
padding-top: 0.5rem;
}
.pt-3 {
padding-top: 1rem;
}
.pt-4 {
padding-top: 1.5rem;
}
.pt-5 {
padding-top: 2.5rem;
}
.pt-6 {
padding-top: 4rem;
}
.pt-7 {
padding-top: 6.5rem;
}
.pt-8 {
padding-top: 10.5rem;
}
.pt-9 {
padding-top: 17rem;
}
.pr-0 {
padding-right: 0;
}
.pr-1 {
padding-right: 0.25rem;
}
.pr-2 {
padding-right: 0.5rem;
}
.pr-3 {
padding-right: 1rem;
}
.pr-4 {
padding-right: 1.5rem;
}
.pr-5 {
padding-right: 2.5rem;
}
.pr-6 {
padding-right: 4rem;
}
.pr-7 {
padding-right: 6.5rem;
}
.pr-8 {
padding-right: 10.5rem;
}
.pr-9 {
padding-right: 17rem;
}
.pb-0 {
padding-bottom: 0;
}
.pb-1 {
padding-bottom: 0.25rem;
}
.pb-2 {
padding-bottom: 0.5rem;
}
.pb-3 {
padding-bottom: 1rem;
}
.pb-4 {
padding-bottom: 1.5rem;
}
.pb-5 {
padding-bottom: 2.5rem;
}
.pb-6 {
padding-bottom: 4rem;
}
.pb-7 {
padding-bottom: 6.5rem;
}
.pb-8 {
padding-bottom: 10.5rem;
}
.pb-9 {
padding-bottom: 17rem;
}
.pl-0 {
padding-left: 0;
}
.pl-1 {
padding-left: 0.25rem;
}
.pl-2 {
padding-left: 0.5rem;
}
.pl-3 {
padding-left: 1rem;
}
.pl-4 {
padding-left: 1.5rem;
}
.pl-5 {
padding-left: 2.5rem;
}
.pl-6 {
padding-left: 4rem;
}
.pl-7 {
padding-left: 6.5rem;
}
.pl-8 {
padding-left: 10.5rem;
}
.pl-9 {
padding-left: 17rem;
}
.px-0 {
padding-right: 0;
padding-left: 0;
}
.px-1 {
padding-right: 0.25rem;
padding-left: 0.25rem;
}
.px-2 {
padding-right: 0.5rem;
padding-left: 0.5rem;
}
.px-3 {
padding-right: 1rem;
padding-left: 1rem;
}
.px-4 {
padding-right: 1.5rem;
padding-left: 1.5rem;
}
.px-5 {
padding-right: 2.5rem;
padding-left: 2.5rem;
}
.px-6 {
padding-right: 4rem;
padding-left: 4rem;
}
.px-7 {
padding-right: 6.5rem;
padding-left: 6.5rem;
}
.px-8 {
padding-right: 10.5rem;
padding-left: 10.5rem;
}
.px-9 {
padding-right: 17rem;
padding-left: 17rem;
}
.py-0 {
padding-top: 0;
padding-bottom: 0;
}
.py-1 {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.py-3 {
padding-top: 1rem;
padding-bottom: 1rem;
}
.py-4 {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
.py-5 {
padding-top: 2.5rem;
padding-bottom: 2.5rem;
}
.py-6 {
padding-top: 4rem;
padding-bottom: 4rem;
}
.py-7 {
padding-top: 6.5rem;
padding-bottom: 6.5rem;
}
.py-8 {
padding-top: 10.5rem;
padding-bottom: 10.5rem;
}
.py-9 {
padding-top: 17rem;
padding-bottom: 17rem;
}
.g-0 {
gap: 0;
}
.gx-0 {
column-gap: 0;
}
.gy-0 {
row-gap: 0;
}
.g-1 {
gap: 0.25rem;
}
.gx-1 {
column-gap: 0.25rem;
}
.gy-1 {
row-gap: 0.25rem;
}
.g-2 {
gap: 0.5rem;
}
.gx-2 {
column-gap: 0.5rem;
}
.gy-2 {
row-gap: 0.5rem;
}
.g-3 {
gap: 1rem;
}
.gx-3 {
column-gap: 1rem;
}
.gy-3 {
row-gap: 1rem;
}
.g-4 {
gap: 1.5rem;
}
.gx-4 {
column-gap: 1.5rem;
}
.gy-4 {
row-gap: 1.5rem;
}
.g-5 {
gap: 2.5rem;
}
.gx-5 {
column-gap: 2.5rem;
}
.gy-5 {
row-gap: 2.5rem;
}
.g-6 {
gap: 4rem;
}
.gx-6 {
column-gap: 4rem;
}
.gy-6 {
row-gap: 4rem;
}
.g-7 {
gap: 6.5rem;
}
.gx-7 {
column-gap: 6.5rem;
}
.gy-7 {
row-gap: 6.5rem;
}
.g-8 {
gap: 10.5rem;
}
.gx-8 {
column-gap: 10.5rem;
}
.gy-8 {
row-gap: 10.5rem;
}
.g-9 {
gap: 17rem;
}
.gx-9 {
column-gap: 17rem;
}
.gy-9 {
row-gap: 17rem;
}
@media screen and (min-width: 768px) {
.g-sm-0 {
gap: 0;
}
.gx-sm-0 {
column-gap: 0;
}
.gy-sm-0 {
row-gap: 0;
}
.g-sm-1 {
gap: 0.25rem;
}
.gx-sm-1 {
column-gap: 0.25rem;
}
.gy-sm-1 {
row-gap: 0.25rem;
}
.g-sm-2 {
gap: 0.5rem;
}
.gx-sm-2 {
column-gap: 0.5rem;
}
.gy-sm-2 {
row-gap: 0.5rem;
}
.g-sm-3 {
gap: 1rem;
}
.gx-sm-3 {
column-gap: 1rem;
}
.gy-sm-3 {
row-gap: 1rem;
}
.g-sm-4 {
gap: 1.5rem;
}
.gx-sm-4 {
column-gap: 1.5rem;
}
.gy-sm-4 {
row-gap: 1.5rem;
}
.g-sm-5 {
gap: 2.5rem;
}
.gx-sm-5 {
column-gap: 2.5rem;
}
.gy-sm-5 {
row-gap: 2.5rem;
}
.g-sm-6 {
gap: 4rem;
}
.gx-sm-6 {
column-gap: 4rem;
}
.gy-sm-6 {
row-gap: 4rem;
}
.g-sm-7 {
gap: 6.5rem;
}
.gx-sm-7 {
column-gap: 6.5rem;
}
.gy-sm-7 {
row-gap: 6.5rem;
}
.g-sm-8 {
gap: 10.5rem;
}
.gx-sm-8 {
column-gap: 10.5rem;
}
.gy-sm-8 {
row-gap: 10.5rem;
}
.g-sm-9 {
gap: 17rem;
}
.gx-sm-9 {
column-gap: 17rem;
}
.gy-sm-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 992px) {
.g-md-0 {
gap: 0;
}
.gx-md-0 {
column-gap: 0;
}
.gy-md-0 {
row-gap: 0;
}
.g-md-1 {
gap: 0.25rem;
}
.gx-md-1 {
column-gap: 0.25rem;
}
.gy-md-1 {
row-gap: 0.25rem;
}
.g-md-2 {
gap: 0.5rem;
}
.gx-md-2 {
column-gap: 0.5rem;
}
.gy-md-2 {
row-gap: 0.5rem;
}
.g-md-3 {
gap: 1rem;
}
.gx-md-3 {
column-gap: 1rem;
}
.gy-md-3 {
row-gap: 1rem;
}
.g-md-4 {
gap: 1.5rem;
}
.gx-md-4 {
column-gap: 1.5rem;
}
.gy-md-4 {
row-gap: 1.5rem;
}
.g-md-5 {
gap: 2.5rem;
}
.gx-md-5 {
column-gap: 2.5rem;
}
.gy-md-5 {
row-gap: 2.5rem;
}
.g-md-6 {
gap: 4rem;
}
.gx-md-6 {
column-gap: 4rem;
}
.gy-md-6 {
row-gap: 4rem;
}
.g-md-7 {
gap: 6.5rem;
}
.gx-md-7 {
column-gap: 6.5rem;
}
.gy-md-7 {
row-gap: 6.5rem;
}
.g-md-8 {
gap: 10.5rem;
}
.gx-md-8 {
column-gap: 10.5rem;
}
.gy-md-8 {
row-gap: 10.5rem;
}
.g-md-9 {
gap: 17rem;
}
.gx-md-9 {
column-gap: 17rem;
}
.gy-md-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 1280px) {
.g-lg-0 {
gap: 0;
}
.gx-lg-0 {
column-gap: 0;
}
.gy-lg-0 {
row-gap: 0;
}
.g-lg-1 {
gap: 0.25rem;
}
.gx-lg-1 {
column-gap: 0.25rem;
}
.gy-lg-1 {
row-gap: 0.25rem;
}
.g-lg-2 {
gap: 0.5rem;
}
.gx-lg-2 {
column-gap: 0.5rem;
}
.gy-lg-2 {
row-gap: 0.5rem;
}
.g-lg-3 {
gap: 1rem;
}
.gx-lg-3 {
column-gap: 1rem;
}
.gy-lg-3 {
row-gap: 1rem;
}
.g-lg-4 {
gap: 1.5rem;
}
.gx-lg-4 {
column-gap: 1.5rem;
}
.gy-lg-4 {
row-gap: 1.5rem;
}
.g-lg-5 {
gap: 2.5rem;
}
.gx-lg-5 {
column-gap: 2.5rem;
}
.gy-lg-5 {
row-gap: 2.5rem;
}
.g-lg-6 {
gap: 4rem;
}
.gx-lg-6 {
column-gap: 4rem;
}
.gy-lg-6 {
row-gap: 4rem;
}
.g-lg-7 {
gap: 6.5rem;
}
.gx-lg-7 {
column-gap: 6.5rem;
}
.gy-lg-7 {
row-gap: 6.5rem;
}
.g-lg-8 {
gap: 10.5rem;
}
.gx-lg-8 {
column-gap: 10.5rem;
}
.gy-lg-8 {
row-gap: 10.5rem;
}
.g-lg-9 {
gap: 17rem;
}
.gx-lg-9 {
column-gap: 17rem;
}
.gy-lg-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 1440px) {
.g-xl-0 {
gap: 0;
}
.gx-xl-0 {
column-gap: 0;
}
.gy-xl-0 {
row-gap: 0;
}
.g-xl-1 {
gap: 0.25rem;
}
.gx-xl-1 {
column-gap: 0.25rem;
}
.gy-xl-1 {
row-gap: 0.25rem;
}
.g-xl-2 {
gap: 0.5rem;
}
.gx-xl-2 {
column-gap: 0.5rem;
}
.gy-xl-2 {
row-gap: 0.5rem;
}
.g-xl-3 {
gap: 1rem;
}
.gx-xl-3 {
column-gap: 1rem;
}
.gy-xl-3 {
row-gap: 1rem;
}
.g-xl-4 {
gap: 1.5rem;
}
.gx-xl-4 {
column-gap: 1.5rem;
}
.gy-xl-4 {
row-gap: 1.5rem;
}
.g-xl-5 {
gap: 2.5rem;
}
.gx-xl-5 {
column-gap: 2.5rem;
}
.gy-xl-5 {
row-gap: 2.5rem;
}
.g-xl-6 {
gap: 4rem;
}
.gx-xl-6 {
column-gap: 4rem;
}
.gy-xl-6 {
row-gap: 4rem;
}
.g-xl-7 {
gap: 6.5rem;
}
.gx-xl-7 {
column-gap: 6.5rem;
}
.gy-xl-7 {
row-gap: 6.5rem;
}
.g-xl-8 {
gap: 10.5rem;
}
.gx-xl-8 {
column-gap: 10.5rem;
}
.gy-xl-8 {
row-gap: 10.5rem;
}
.g-xl-9 {
gap: 17rem;
}
.gx-xl-9 {
column-gap: 17rem;
}
.gy-xl-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 1920px) {
.g-xxl-0 {
gap: 0;
}
.gx-xxl-0 {
column-gap: 0;
}
.gy-xxl-0 {
row-gap: 0;
}
.g-xxl-1 {
gap: 0.25rem;
}
.gx-xxl-1 {
column-gap: 0.25rem;
}
.gy-xxl-1 {
row-gap: 0.25rem;
}
.g-xxl-2 {
gap: 0.5rem;
}
.gx-xxl-2 {
column-gap: 0.5rem;
}
.gy-xxl-2 {
row-gap: 0.5rem;
}
.g-xxl-3 {
gap: 1rem;
}
.gx-xxl-3 {
column-gap: 1rem;
}
.gy-xxl-3 {
row-gap: 1rem;
}
.g-xxl-4 {
gap: 1.5rem;
}
.gx-xxl-4 {
column-gap: 1.5rem;
}
.gy-xxl-4 {
row-gap: 1.5rem;
}
.g-xxl-5 {
gap: 2.5rem;
}
.gx-xxl-5 {
column-gap: 2.5rem;
}
.gy-xxl-5 {
row-gap: 2.5rem;
}
.g-xxl-6 {
gap: 4rem;
}
.gx-xxl-6 {
column-gap: 4rem;
}
.gy-xxl-6 {
row-gap: 4rem;
}
.g-xxl-7 {
gap: 6.5rem;
}
.gx-xxl-7 {
column-gap: 6.5rem;
}
.gy-xxl-7 {
row-gap: 6.5rem;
}
.g-xxl-8 {
gap: 10.5rem;
}
.gx-xxl-8 {
column-gap: 10.5rem;
}
.gy-xxl-8 {
row-gap: 10.5rem;
}
.g-xxl-9 {
gap: 17rem;
}
.gx-xxl-9 {
column-gap: 17rem;
}
.gy-xxl-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 2560px) {
.g-xxxl-0 {
gap: 0;
}
.gx-xxxl-0 {
column-gap: 0;
}
.gy-xxxl-0 {
row-gap: 0;
}
.g-xxxl-1 {
gap: 0.25rem;
}
.gx-xxxl-1 {
column-gap: 0.25rem;
}
.gy-xxxl-1 {
row-gap: 0.25rem;
}
.g-xxxl-2 {
gap: 0.5rem;
}
.gx-xxxl-2 {
column-gap: 0.5rem;
}
.gy-xxxl-2 {
row-gap: 0.5rem;
}
.g-xxxl-3 {
gap: 1rem;
}
.gx-xxxl-3 {
column-gap: 1rem;
}
.gy-xxxl-3 {
row-gap: 1rem;
}
.g-xxxl-4 {
gap: 1.5rem;
}
.gx-xxxl-4 {
column-gap: 1.5rem;
}
.gy-xxxl-4 {
row-gap: 1.5rem;
}
.g-xxxl-5 {
gap: 2.5rem;
}
.gx-xxxl-5 {
column-gap: 2.5rem;
}
.gy-xxxl-5 {
row-gap: 2.5rem;
}
.g-xxxl-6 {
gap: 4rem;
}
.gx-xxxl-6 {
column-gap: 4rem;
}
.gy-xxxl-6 {
row-gap: 4rem;
}
.g-xxxl-7 {
gap: 6.5rem;
}
.gx-xxxl-7 {
column-gap: 6.5rem;
}
.gy-xxxl-7 {
row-gap: 6.5rem;
}
.g-xxxl-8 {
gap: 10.5rem;
}
.gx-xxxl-8 {
column-gap: 10.5rem;
}
.gy-xxxl-8 {
row-gap: 10.5rem;
}
.g-xxxl-9 {
gap: 17rem;
}
.gx-xxxl-9 {
column-gap: 17rem;
}
.gy-xxxl-9 {
row-gap: 17rem;
}
}
@media screen and (min-width: 3840px) {
.g-x4k-0 {
gap: 0;
}
.gx-x4k-0 {
column-gap: 0;
}
.gy-x4k-0 {
row-gap: 0;
}
.g-x4k-1 {
gap: 0.25rem;
}
.gx-x4k-1 {
column-gap: 0.25rem;
}
.gy-x4k-1 {
row-gap: 0.25rem;
}
.g-x4k-2 {
gap: 0.5rem;
}
.gx-x4k-2 {
column-gap: 0.5rem;
}
.gy-x4k-2 {
row-gap: 0.5rem;
}
.g-x4k-3 {
gap: 1rem;
}
.gx-x4k-3 {
column-gap: 1rem;
}
.gy-x4k-3 {
row-gap: 1rem;
}
.g-x4k-4 {
gap: 1.5rem;
}
.gx-x4k-4 {
column-gap: 1.5rem;
}
.gy-x4k-4 {
row-gap: 1.5rem;
}
.g-x4k-5 {
gap: 2.5rem;
}
.gx-x4k-5 {
column-gap: 2.5rem;
}
.gy-x4k-5 {
row-gap: 2.5rem;
}
.g-x4k-6 {
gap: 4rem;
}
.gx-x4k-6 {
column-gap: 4rem;
}
.gy-x4k-6 {
row-gap: 4rem;
}
.g-x4k-7 {
gap: 6.5rem;
}
.gx-x4k-7 {
column-gap: 6.5rem;
}
.gy-x4k-7 {
row-gap: 6.5rem;
}
.g-x4k-8 {
gap: 10.5rem;
}
.gx-x4k-8 {
column-gap: 10.5rem;
}
.gy-x4k-8 {
row-gap: 10.5rem;
}
.g-x4k-9 {
gap: 17rem;
}
.gx-x4k-9 {
column-gap: 17rem;
}
.gy-x4k-9 {
row-gap: 17rem;
}
}
.text-right {
text-align: right;
}
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.fw-n {
font-weight: 400;
}
.fw-b {
font-weight: 700;
}
.fs-64 {
font-size: 4rem;
}
.fs-57 {
font-size: 3.5625rem;
}
.fs-48 {
font-size: 3rem;
}
.fs-45 {
font-size: 2.8125rem;
}
.fs-36 {
font-size: 2.25rem;
}
.fs-32 {
font-size: 2rem;
}
.fs-28 {
font-size: 1.75rem;
}
.fs-26 {
font-size: 1.625rem;
}
.fs-24 {
font-size: 1.5rem;
}
.fs-22 {
font-size: 1.375rem;
}
.fs-20 {
font-size: 1.25rem;
}
.fs-18 {
font-size: 1.125rem;
}
.fs-17 {
font-size: 1.0625rem;
}
.fs-16 {
font-size: 1rem;
}
.fs-14 {
font-size: 0.875rem;
}
.hs {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h1 {
font-size: 2rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h2 {
font-size: 1.75rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h3 {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h4 {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h5 {
font-size: 1rem;
font-weight: 700;
line-height: 1.7;
letter-spacing: 0.02rem;
}
@media screen and (min-width: 768px) {
.h1 {
font-size: 2.25rem;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.01rem;
}
.h2 {
font-size: 2rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h3 {
font-size: 1.75rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.01rem;
}
.h4 {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
.h5 {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02rem;
}
}
.z-hide {
z-index: -1;
}
.z-auto {
z-index: auto;
}
.z-0 {
z-index: 0;
}
.z-1 {
z-index: 1;
}
.z-2 {
z-index: 2;
}
.z-3 {
z-index: 3;
}
}
/*# sourceMappingURL=asagaoui.css.map */