@charset "UTF-8";
/* stylelint-disable */
/* Document
 * ========================================================================== */
/**
 * 1. Add border box sizing in all browsers (opinionated).
 * 2. Backgrounds do not repeat by default (opinionated).
 */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap");
*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  background-repeat: no-repeat; /* 2 */
}

/**
 * 1. Add text decoration inheritance in all browsers (opinionated).
 * 2. Add vertical alignment inheritance in all browsers (opinionated).
 */
::before,
::after {
  vertical-align: inherit; /* 2 */
  text-decoration: inherit; /* 1 */
}

/**
 * 1. Use the default cursor in all browsers (opinionated).
 * 2. Change the line height in all browsers (opinionated).
 * 3. Breaks words to prevent overflow in all browsers (opinionated).
 * 4. Use a 4-space tab width in all browsers (opinionated).
 * 5. Remove the grey highlight on links in iOS (opinionated).
 * 6. Prevent adjustments of font size after orientation changes in iOS.
 */
:where(:root) {
  cursor: default; /* 1 */
  line-height: 1.5; /* 2 */
  overflow-wrap: break-word; /* 3 */
  -moz-tab-size: 4; /* 4 */
  -o-tab-size: 4;
     tab-size: 4; /* 4 */
  -webkit-tap-highlight-color: transparent; /* 5 */
  -webkit-text-size-adjust: 100%; /* 6 */
}

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

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

/* Grouping content
 * ========================================================================== */
/**
 * Remove the margin on nested lists in Chrome, Edge, and Safari.
 */
:where(dl, ol, ul) :where(dl, ol, ul) {
  margin: 0;
}

/**
 * 1. Correct the inheritance of border color in Firefox.
 * 2. Add the correct box sizing in Firefox.
 */
:where(hr) {
  height: 0; /* 2 */
  color: inherit; /* 1 */
}

/**
 * Remove the list style on navigation lists in all browsers (opinionated).
 */
:where(nav) :where(ol, ul) {
  padding: 0;
  list-style-type: none;
}

/**
 * Prevent VoiceOver from ignoring list semantics in Safari (opinionated).
 */
:where(nav li)::before {
  float: left;
  content: "​";
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 * 3. Prevent overflow of the container in all browsers (opinionated).
 */
:where(pre) {
  overflow: auto; /* 3 */
  font-size: 1em; /* 2 */
  font-family: monospace, monospace; /* 1 */
}

/* Text-level semantics
 * ========================================================================== */
/**
 * Add the correct text decoration in Safari.
 */
:where(abbr[title]) {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

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

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

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

/* Embedded content
 * ========================================================================== */
/*
 * Change the alignment on media elements in all browsers (opinionated).
 */
:where(audio, canvas, iframe, img, svg, video) {
  vertical-align: middle;
}

/**
 * Remove the border on iframes in all browsers (opinionated).
 */
:where(iframe) {
  border-style: none;
}

/**
 * Change the fill color to match the text color in all browsers (opinionated).
 */
:where(svg:not([fill])) {
  fill: currentColor;
}

/* Tabular data
 * ========================================================================== */
/**
 * 1. Collapse border spacing in all browsers (opinionated).
 * 2. Correct table border color inheritance in all Chrome, Edge, and Safari.
 * 3. Remove text indentation from table contents in Chrome, Edge, and Safari.
 */
:where(table) {
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 1 */
  text-indent: 0; /* 3 */
}

/* Forms
 * ========================================================================== */
/**
 * Remove the margin on controls in Safari.
 */
:where(button, input, select) {
  margin: 0;
}

/**
 * Correct the inability to style buttons in iOS and Safari.
 */
:where(button, [type=button i], [type=reset i], [type=submit i]) {
  -webkit-appearance: button;
}

/**
 * Change the inconsistent appearance in all browsers (opinionated).
 */
:where(fieldset) {
  border: 1px solid #a0a0a0;
}

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

/**
 * 1. Remove the margin in Firefox and Safari.
 * 3. Change the resize direction in all browsers (opinionated).
 */
:where(textarea) {
  margin: 0; /* 1 */
  resize: vertical; /* 3 */
}

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

/**
 * Correct the cursor style of increment and decrement buttons in Safari.
 */
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  opacity: 0.54;
  color: inherit;
}

/**
 * Remove the inner padding in Chrome, Edge, and Safari on macOS.
 */
::-webkit-search-decoration {
  -webkit-appearance: none;
}

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

/* Interactive
 * ========================================================================== */
/*
 * Add the correct styles in Safari.
 */
:where(dialog) {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  border: solid;
  background-color: white;
  padding: 1em;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  color: black;
}

:where(dialog:not([open])) {
  display: none;
}

/*
 * Add the correct display in Safari.
 */
:where(details > summary:first-of-type) {
  display: list-item;
}

/* Accessibility
 * ========================================================================== */
/**
 * Change the cursor on busy elements in all browsers (opinionated).
 */
:where([aria-busy=true i]) {
  cursor: progress;
}

/*
 * Change the cursor on control elements in all browsers (opinionated).
 */
:where([aria-controls]) {
  cursor: pointer;
}

/*
 * Change the cursor on disabled, not-editable, or otherwise
 * inoperable elements in all browsers (opinionated).
 */
:where([aria-disabled=true i], [disabled]) {
  cursor: not-allowed;
}

/*
 * Change the display on visually hidden accessible elements
 * in all browsers (opinionated).
 */
:where([aria-hidden=false i][hidden]) {
  display: initial;
}

:where([aria-hidden=false i][hidden]:not(:focus)) {
  clip: rect(0, 0, 0, 0);
  position: absolute;
}

/* stylelint-enable */
html {
  scroll-behavior: smooth;
}
body {
  font-style: normal;
  font-weight: 400;
  font-family: "Noto Sans JP", sans-serif;
}

h1, h2, h3, h4, h5, h6, p, dl, dt, dd {
  margin: 0;
  padding: 0;
  font-size: 1rem;
}

figure {
  margin: 0;
  text-align: center;
}

img {
  max-width: 100%;
  height: auto;
}

@keyframes splide-loading {
  0% {
    transform: rotate(0);
  }
  to {
    transform: rotate(1turn);
  }
}
.splide__track--draggable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
}

.splide__track--fade > .splide__list > .splide__slide {
  opacity: 0;
  z-index: 0;
  margin: 0 !important;
}

.splide__track--fade > .splide__list > .splide__slide.is-active {
  opacity: 1;
  z-index: 1;
}

.splide--rtl {
  direction: rtl;
}

.splide__track--ttb > .splide__list {
  display: block;
}

.splide__container {
  position: relative;
  box-sizing: border-box;
}

.splide__list {
  display: flex;
  backface-visibility: hidden;
  margin: 0 !important;
  padding: 0 !important;
  height: 100%;
}

.splide.is-initialized:not(.is-active) .splide__list {
  display: block;
}

.splide__pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin: 0;
  pointer-events: none;
}

.splide__pagination li {
  display: inline-block;
  margin: 0;
  pointer-events: auto;
  line-height: 1;
  list-style-type: none;
}

.splide:not(.is-overflow) .splide__pagination {
  display: none;
}

.splide__progress__bar {
  width: 0;
}

.splide {
  position: relative;
  visibility: hidden;
}

.splide.is-initialized, .splide.is-rendered {
  visibility: visible;
}

.splide__slide {
  position: relative;
  flex-shrink: 0;
  backface-visibility: hidden;
  box-sizing: border-box;
  margin: 0;
  list-style-type: none !important;
}

.splide__slide img {
  vertical-align: bottom;
}

.splide__spinner {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  animation: splide-loading 1s linear infinite;
  contain: strict;
  margin: auto;
  border: 2px solid #999;
  border-left-color: transparent;
  border-radius: 50%;
  width: 20px;
  height: 20px;
}

.splide__sr {
  clip: rect(0 0 0 0);
  position: absolute;
  margin: -1px;
  border: 0;
  padding: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.splide__toggle.is-active .splide__toggle__play, .splide__toggle__pause {
  display: none;
}

.splide__toggle.is-active .splide__toggle__pause {
  display: inline;
}

.splide__track {
  position: relative;
  z-index: 0;
  overflow: hidden;
}

.splide__slide {
  border-width: 0 0 0.2667vw;
  border-style: solid;
  border-color: rgba(252, 245, 1, 0.85);
  background-image: linear-gradient(0deg, rgba(92, 88, 0, 0.85), rgba(92, 88, 0, 0.85));
  background-position: left top;
  background-size: 100% 9.3333vw;
  background-repeat: no-repeat;
  background-color: #000000;
  width: 100%;
  height: 128vw;
}

.splide__slide__container {
  height: 100%;
}

.splide__arrow {
  display: grid;
  position: absolute;
  top: 50%;
  place-items: center;
  transform: translateY(-50%);
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  z-index: 2;
  transition: opacity 360ms ease;
  border: 0;
  background-color: transparent;
  padding: 0;
  width: 5.0667vw;
  height: 35.4667vw;
}
.splide__arrow[disabled] {
  filter: grayscale(50%) brightness(0.34);
}

.splide__arrow--next {
  right: 0;
}

.splide__arrow--prev {
  left: 0;
}

[data-view=sm] {
  display: none;
}

[data-view=">sm"],
[data-view=">sm"] {
  display: none;
}

[data-view="<sm"],
[data-view="&lt;sm"] {
  display: none;
}

[data-view=md] {
  display: none;
}

[data-view=">md"],
[data-view="&gt;md"] {
  display: none;
}

[data-view="<md"],
[data-view="&lt;md"] {
  display: none;
}

[data-view=lg] {
  display: none;
}

[data-view=">lg"],
[data-view="&gt;lg"] {
  display: none;
}

[data-view="<lg"],
[data-view="&lt;lg"] {
  display: none;
}

[data-view=xl] {
  display: none;
}

[data-view=">xl"],
[data-view="&gt;xl"] {
  display: none;
}

[data-view="<xl"],
[data-view="&lt;xl"] {
  display: none;
}

[data-view="2xl"] {
  display: none;
}

[data-view=">2xl"],
[data-view="&gt;2xl"] {
  display: none;
}

[data-view="<2xl"],
[data-view="&lt;2xl"] {
  display: none;
}

:root {
  --theme-600: #5F5000;
  --theme-700: #FFF500;
  --theme-800: #FFFF0A;
  --theme-900: #FFFCA2;
  --orange-500: #FF9300;
  --red-600: #FF1C1C;
  --section-blue: rgb(0 235 255 / 85%);
  --section-yellow: rgb(255 245 0 / 85%);
  --text-link: #00EBFF;
}

:is([aria-disabled=true]) {
  cursor: auto;
  pointer-events: none;
}

body {
  background-color: #000000;
  color: #FFFFFF;
}

a:where(.mailto) {
  color: var(--yelllow-900);
  text-decoration: underline;
}

:where(.text-link) {
  transition: filter 360ms ease;
  color: var(--text-link);
  text-decoration: underline;
}

a:is(.mailto[disabled]) {
  padding: 0 0.25em;
  pointer-events: none;
  text-decoration-line: line-through;
}

:where(.main-content section + section) {
  margin-block-start: 8.5333vw;
}

.main-content {
  background-image: url("../images/content-bg_mo.webp");
  background-position: center bottom;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: #000000;
  padding-bottom: 9.8667vw;
  width: 100%;
  min-height: 100vh;
}

.jumbotron {
  display: grid;
  position: relative;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  justify-content: center;
  align-items: center;
  gap: 2.6667vw;
  padding: 10.6667vw 0 0;
}
.jumbotron .wangan-logo {
  margin: 0 auto;
}

.overview .desc {
  margin-block-start: 4.2667vw;
}

.section-container:has(> :first-child.heading.-decoration) {
  padding-top: 0;
}
.section-container:not(.-fill) {
  margin-right: auto;
  margin-left: auto;
  box-shadow: 0 0.2667vw 1.6vw var(--section-yellow);
  border: 1px solid var(--section-yellow);
  background-position: center top, center bottom;
  background-size: 28.2667vw 1.7333vw, 28.2667vw 1.7333vw;
  background-repeat: no-repeat, no-repeat;
  background-color: rgba(0, 0, 0, 0.7);
  padding: 4.6667vw 2.6667vw 9.8667vw;
  width: 92vw;
}
.section-container.-fill {
  background-color: rgba(0, 0, 0, 0.78);
  padding: 9.8667vw 0 12.8vw;
}
.section-container.-error {
  box-shadow: 0 0.2667vw 1.6vw rgba(255, 28, 28, 0.85);
  border-color: rgb(255, 28, 28);
  background-image: url("../images/section-container_error-bg-top.svg"), url("../images/section-container_error-bg-bottom.svg");
}
.section-container:is(.accesscode-info *) {
  background-image: url("../images/accesscode-info-bg_top_mo.webp"), url("../images/accesscode-info-bg_bottom_mo.webp");
  background-position: center top, center bottom;
  background-size: contain, contain;
  background-repeat: no-repeat;
}

.heading:is(.-decoration) {
  display: grid;
  place-items: center;
  background-image: url("../images/section-title-bg_mo.webp");
  background-position: center top;
  background-size: 100% auto;
  background-repeat: no-repeat;
  color: var(--theme-600);
}
.heading:is(.-decoration) .heading-label {
  vertical-align: baseline;
  font-weight: 700;
  font-size: 4.5333vw;
}
.heading:is(.period *) {
  color: var(--theme-600);
  font-size: 5.8667vw;
}
.heading:is(.loginform *) {
  font-size: 4.8vw;
  text-align: center;
  text-shadow: 0.1333vw 0.1333vw 2.9333vw var(--theme-700);
}
.heading:is(.loginform *) + .notes {
  margin-block-start: 6.4vw;
}
.date:is(.period *) {
  padding: 4.2667vw 0;
  letter-spacing: 0.02em;
}

.note:is(.period *) {
  font-size: 3.2vw;
}
.note small {
  font-size: 3.2vw;
}

.text-center {
  text-align: center;
}
.text-sm {
  font-size: 3.2vw;
  line-height: 1.33;
}
.text-md {
  font-size: 3.2vw;
}
.text-lg {
  font-size: 3.4667vw;
}
.text-xl {
  font-size: 4vw;
}
.text-2xl {
  font-size: 4.2667vw;
}
.text-3xl {
  font-size: 4.5333vw;
}
.text-theme-600 {
  color: var(--theme-600);
}
.text-theme-700 {
  color: var(--theme-700);
}
.text-theme-800 {
  color: var(--theme-800);
}
.text-red-600 {
  color: var(--red-600);
}

.text-custom :is(.overview .image *) {
  font-size: 4vw;
}
.text-custom:is(.overview .desc *) {
  font-weight: 700;
  font-size: 4.5333vw;
  line-height: 1.64;
}
.text-custom:is(.accesscode-info.-confirm .desc *) {
  font-size: 4.8vw;
}
.text-custom:is(.accesscode-info .button *) {
  font-size: 4vw;
}
.text-custom:is(.navigation .button) {
  font-size: 4.2667vw;
}
.text-custom:is(.loginform .button *) {
  font-size: 4.2667vw;
}
.text-custom:is(.button.banapass *) {
  font-size: 3.4667vw;
}
.text-custom:is(.-dummy) {
  font-size: 2.9333vw;
  line-height: 1.6;
}
.text-custom:is(.footer-content *) {
  font-size: 2.9333vw;
  line-height: 1.33;
}

.font-bold {
  font-weight: 700;
}
.font-regular {
  font-weight: 400;
}

.caption:is(.loginform *) {
  font-size: 3.2vw;
  line-height: 2;
}

.unstyled-list {
  margin: 0;
  padding: 0;
  text-indent: 0;
}
.unstyled-list > .item {
  padding-left: 1em;
  list-style: none;
  text-indent: -1em;
}
:is(.overview .unstyled-list) {
  margin-block-start: 9.8667vw;
}

.button {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 2.1333vw;
  transition: filter 340ms ease;
  background-image: url("../images/button-bg.webp");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: transparent;
  padding: 1.3333vw 2.1333vw;
  width: 80vw;
  color: #000000;
}
.button::before, .button::after {
  display: block;
  background-image: linear-gradient(0deg, #00619F, #00F5FF, #00619F);
  width: 1.3333vw;
  height: 100%;
  content: "";
}
.button.-dummy {
  display: inline-grid;
  cursor: auto;
  margin: 0;
  padding: 1.0667vw;
  max-width: 34.6667vw;
  pointer-events: none;
}
.button.-dummy > .button-label {
  padding: 0.5333vw 0;
}
.button[disabled], .button[aria-disabled=true], .button.-disabled, .button.-inactive {
  filter: grayscale(100%) brightness(78.5%);
  pointer-events: none;
}
.button[disabled]::before, .button[disabled]::after, .button[aria-disabled=true]::before, .button[aria-disabled=true]::after, .button.-disabled::before, .button.-disabled::after, .button.-inactive::before, .button.-inactive::after {
  background-image: linear-gradient(0deg, #868686, #a2a2a2, #868686);
}
.button:where(a) {
  text-decoration: none;
}
.button:where(button) {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.button:where(.mypage-app) {
  width: 80vw;
  color: #000000;
}
.button.register::before, .button.register::after {
  background-image: linear-gradient(0deg, #00A70D, #00FF1D, #00A70D);
}
.button.pageback::before, .button.pageback::after {
  background-image: linear-gradient(0deg, #00A70D, #00FF1D, #00A70D);
}
.button > .button-label {
  display: grid;
  place-items: center;
  border-width: 1.3333vw;
  border-style: outset;
  border-color: #FFFFFF #C3C3C3 #C3C3C3 #FFFFFF;
  padding: 1.7333vw;
}

.column {
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 1fr;
  gap: 1.75rem;
}
.column:where(.loginform *) {
  margin-right: auto;
  margin-left: auto;
  margin-block-start: 6.4vw;
  max-width: 80vw;
}
.column > .track {
  display: flex;
  flex-flow: column nowrap;
}

.terms-container {
  margin-right: auto;
  margin-left: auto;
  margin-block-start: 3.7333vw;
  background-color: #000000;
  padding: 4.2667vw;
  width: 100%;
  max-width: 82.6667vw;
}
.terms-container > .scroll-wrapper {
  height: 68vh;
  overflow: auto;
}
.terms-container p + p {
  margin-block-start: 1.1em;
}
.terms-container :is(.heading + *) {
  margin-block-start: 1.1em;
}
.terms-container :is(* + .heading) {
  margin-block-start: 1.67em;
}

.information {
  margin-block-start: 3.2vw;
}
.information .text-2xl {
  font-size: 4vw;
  line-height: 1.6;
}

.footer-content {
  border-top: 0.5333vw solid var(--theme-700);
  background-color: #000000;
  padding: 9.8667vw 4vw 12.8vw;
}
.footer-content > .copyright {
  margin-right: auto;
  margin-left: auto;
  max-width: 92vw;
  color: #FFFFFF;
}

.slider {
  position: relative;
  margin-right: auto;
  margin-left: auto;
  width: 100%;
  max-width: 92vw;
  min-height: 128vw;
}
.slider:is(.app-proc *) {
  margin-block-start: 6.4vw;
}
.slider .slide-wrapper {
  margin-right: auto;
  margin-left: auto;
  max-width: 81.6vw;
}
.slider .content-wrapper {
  display: grid;
  grid-template-rows: 9.3333vw 1fr;
  grid-template-columns: 1fr;
  height: 100%;
}

.slide-title {
  display: grid;
  place-items: center start;
  padding: 0 4.8vw;
}

.slide-body {
  padding: 4.8vw;
  height: 100%;
  color: #FFFFFF;
}
.slide-body .heading + * {
  margin-block-start: 6.4vw;
}
.slide-body .column {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  gap: 1rem;
  height: -moz-fit-content;
  height: fit-content;
}
.slide-body .column > .item.column-between {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: start;
}
.slide-body .column > .item [class*=text] {
  line-height: 1.6;
}
.slide-body .desc {
  font-weight: 700;
  font-size: 3.2vw;
  line-height: 2;
}
.slide-body .desc.-wide-gap {
  gap: 1rem;
  line-height: 2.4;
}
.slide-body .desc + .note {
  margin-block-start: 3.2vw;
}

.accesscode-info .desc {
  margin-right: auto;
  margin-left: auto;
  border-bottom: 1px solid #FFFFFF;
  padding: 3.2vw 0 6.4vw;
}
.accesscode-info .desc:is(.status + *) {
  margin-block-start: 6.4vw;
  border-top: 1px solid #FFFFFF;
  border-bottom: 0;
  padding: 3.2vw 0 6.4vw;
}
.accesscode-info .desc + * {
  margin-block-start: 6.4vw;
}
.accesscode-info .status:not(.-confirm *) {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: stretch;
  gap: 4.2667vw;
  margin-right: auto;
  margin-left: auto;
  width: 95%;
  text-align: center;
}
.accesscode-info .status:not(.-confirm *) > div:not(.access-code) {
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 42% 1fr;
}
.accesscode-info .status:not(.-confirm *) > div:not(.access-code) dt {
  display: grid;
  justify-content: center;
  align-items: center;
  background-color: #FFFFFF;
  padding: 3.4667vw 0;
  color: #000000;
}
.accesscode-info .status:not(.-confirm *) > div:not(.access-code) dd {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #000000;
  color: #FFFFFF;
  text-shadow: 0.1333vw 0.1333vw 2.9333vw rgba(0, 235, 255, 0.85);
}
.accesscode-info .status:is(.-confirm .confirm-data) {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  margin-right: auto;
  margin-left: auto;
}
.accesscode-info .status:is(.-confirm .confirm-data) .app {
  margin-right: auto;
  margin-left: auto;
  background-color: #002EC6;
  padding: 2.4vw 6.4vw;
  width: 76.5333vw;
  text-align: center;
  text-shadow: 0.1333vw 0.1333vw 2.9333vw rgba(0, 235, 255, 0.85);
}
.accesscode-info .status:is(.-confirm .confirm-data) .points {
  font-size: 4.8vw;
}
.accesscode-info .status .access-code {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
}
.accesscode-info .status .label:not(.access-code *) {
  font-size: 3.4667vw;
}
.accesscode-info .status .label:is(.access-code *) {
  display: inline-block;
  font-size: 3.4667vw;
}
.accesscode-info .status .label:is(.access-code *)::after {
  display: inline-block;
  margin: 0 0.25em;
  content: " : ";
  color: #FFFFFF;
  line-height: 1;
}
.accesscode-info .status .value:not(.access-code *) {
  margin: 0 0.18em;
  font-size: 6.1333vw;
}
.accesscode-info .status .value:is(.access-code *) {
  display: inline-block;
  font-size: 3.4667vw;
}
.accesscode-info .status .suf {
  font-size: 6.1333vw;
}
.accesscode-info .status .suf > small {
  font-size: 4.2667vw;
}
.accesscode-info .navigation {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: 6.4vw;
  margin-block-start: 9.8667vw;
}
.accesscode-info .navigation:is(.confirm-data + *) {
  margin-block-start: 6.4vw;
}

.nocode .desc:first-of-type {
  margin-block-start: 6.4vw;
}
.nocode .navigation {
  display: grid;
  place-items: center;
  margin-block-start: 9.8667vw;
}
.nocode .heading:is(.qa-pattern *)::before {
  display: inline-block;
  vertical-align: baseline;
  margin-right: 0.25em;
  content: "■";
  color: var(--theme-700);
}

.label:is(.accesscode-info .status *) {
  font-weight: 700;
  line-height: 1;
}

.annotation .desc {
  margin: 0 auto;
  width: 80vw;
}
.annotation .desc > * + .heading {
  margin-block-start: 1.67em;
}
.annotation .skip {
  margin-block-start: 1.67em;
}
.annotation .navigation {
  display: grid;
  place-items: center;
  margin-block-start: 9.8667vw;
}

.qa-pattern:is(.nocode *) {
  margin-right: auto;
  margin-left: auto;
  margin-block-start: 4.8vw;
  width: -moz-fit-content;
  width: fit-content;
}
.qa-pattern .track + .track {
  margin-block-start: 2.25rem;
}
.qa-pattern p + dl,
.qa-pattern p + p {
  margin-block-start: 1.25em;
}
.qa-pattern .horizontal > .item {
  display: flex;
  flex-flow: row nowrap;
}
.qa-pattern .horizontal .head {
  flex-shrink: 0;
  padding: 0 1.25em 0 0;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 9.6em;
}

:where(.accesscode-info *) {
  --radio-border-color: #FFFFFF;
  --radio-checked-color: #FFFFFF;
  --radio-disabled-bg-color: #919191;
  --radio-bg-color: rgba(#000000, 67%);
}
:where(.accesscode-info *) .meter-confirm {
  text-align: center;
}
:where(.accesscode-info *) .meter-confirm > .confirm-text {
  color: var(--theme-700);
}
:where(.accesscode-info *) .meter-confirm + .meter-select {
  margin-block-start: 1.25rem;
}
:where(.accesscode-info *) .meter-select {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: start;
  gap: 4.2667vw;
  margin-left: 0;
  padding-left: 0;
}
:where(.accesscode-info *) .meter-select_item {
  display: grid;
  position: relative;
  grid-template-rows: 1fr auto;
  grid-template-columns: 1fr;
  justify-content: center;
  align-items: center;
  transition: background-color 360ms ease;
  background-color: rgba(0, 0, 0, 0.67);
  padding: 3.2vw 1.0667vw 1.6vw;
  width: 42%;
}
:where(.accesscode-info *) .meter-select_item:has(input[type=radio]:checked) {
  background-color: rgba(0, 46, 198, 0.78);
}
:where(.accesscode-info *) .meter-select_item .notice {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(0, 0, 0, 0.23);
  width: 100%;
  text-align: center;
}
:where(.accesscode-info *) .meter-entry {
  display: block;
  margin-right: auto;
  margin-left: auto;
}
:where(.accesscode-info *) .meter-entry .entry-count {
  display: inline-block;
  margin-inline-end: 0.34em;
}
:where(.accesscode-info *) .meter-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3.2vw;
  margin: 0;
  padding: 0;
}
:where(.accesscode-info *) .meter-list_item {
  display: block;
  margin: 0;
  padding: 0;
}
:where(.accesscode-info *) .meter-list_item :where(figure) {
  display: grid;
  grid-template-columns: 1fr;
  justify-content: center;
  align-items: center;
}
:where(.accesscode-info *) .meter-list_item :where(figcaption) {
  letter-spacing: 0.02em;
}
:where(.accesscode-info *) :where(label) {
  cursor: pointer;
}
:where(.accesscode-info *) :where(label[aria-disabled=true]) {
  filter: grayscale(1) brightness(40%);
}
:where(.accesscode-info *) input[type=radio] {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
  cursor: pointer;
  box-sizing: border-box;
  margin: 0.67rem auto;
  border: 2px solid var(--radio-border-color);
  border-radius: 50%;
  background: var(--radio-bg-color);
  width: 1.16rem;
  height: 1.16rem;
}
:where(.accesscode-info *) input[type=radio]::after {
  position: absolute;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.15s ease;
  inset: 50%;
  border-radius: 50%;
  background: var(--radio-checked-color);
  width: 0.6rem;
  height: 0.6rem;
  content: "";
}
:where(.accesscode-info *) input[type=radio]:checked {
  border-color: var(--radio-checked-color);
}
:where(.accesscode-info *) input[type=radio]:checked::after {
  transform: translate(-50%, -50%) scale(1);
}
:where(.accesscode-info *) input[type=radio]:hover {
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--radio-checked-color), transparent 80%);
}
:where(.accesscode-info *) input[type=radio]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--radio-checked-color), white 60%);
}
:where(.accesscode-info *) input[type=radio]:disabled {
  cursor: not-allowed;
  border-color: color-mix(in oklab, var(--radio-border-color), white 40%);
  background-color: var(--radio-disabled-bg-color);
}
:where(.accesscode-info *) input[type=radio]:disabled::after {
  background: color-mix(in oklab, var(--radio-checked-color), white 40%);
}
@media (min-width: 40em){
  [data-view=sm] {
    display: revert;
  }
}
@media not all and (min-width: 40em){
  [data-view=">sm"],
  [data-view="&gt;sm"] {
    display: revert;
  }
  [data-view="<sm"],
  [data-view="&lt;sm"] {
    display: revert;
  }
}
@media (min-width: 48em){
  .splide__slide {
    border-width: 0 0 0.25rem;
    background-size: 100% 4.375rem;
    max-width: clamp(40rem, -25.8605rem + 137.2093vw, 54.75rem);
    height: 31.25rem;
  }
  .splide__arrow {
    width: 2.375rem;
    height: 16.625rem;
  }
  [data-view=md] {
    display: revert;
  }
  a:where(.mailto) {
    text-decoration: none;
  }
  section:where(.main-content *) {
    padding: 0 2rem;
  }
  :where(.main-content section + section) {
    margin-block-start: 5.25rem;
  }
  :is(.main-content .jumbotron + section) {
    margin-block-start: 3.5rem;
  }
  .main-content {
    background-image: url("../images/content-bg.webp");
    padding-bottom: 3rem;
  }
  .jumbotron {
    gap: 2.75rem;
    padding: 3.125rem 2rem 0;
  }
  .jumbotron.-narrow {
    gap: 0;
    padding: 2.375rem 2rem 0;
  }
  .jumbotron.-narrow .wangan-logo {
    width: 51.125rem;
  }
  .overview .desc {
    margin-block-start: 3rem;
  }
  .overview .image {
    padding: 4rem 0;
  }
  .overview .image .caption {
    margin-block-start: 3.75rem;
  }
  .app-proc {
    padding: 0;
  }
  .section-container:not(.-fill) {
    box-shadow: 0 0.125rem 0.75rem var(--section-yellow);
    background-size: 13.25rem 0.8125rem, 13.25rem 0.8125rem;
    padding: 3rem 2.5rem 4.625rem;
    width: 100%;
    max-width: 81.25rem;
  }
  .section-container.-fill {
    padding: 8rem 2.5rem;
  }
  .section-container.-error {
    box-shadow: 0 0.125rem 0.75rem rgba(255, 28, 28, 0.85);
  }
  .section-container:is(.accesscode-info *) {
    background-image: url("../images/accesscode-info-bg_top.webp"), url("../images/accesscode-info-bg_bottom.webp");
    background-size: contain, contain;
  }
  .heading:is(.-decoration) {
    background-image: url("../images/section-title-bg.webp");
    background-size: min(100%, 45.5625rem) 4.6875rem;
    min-height: 4.6875rem;
  }
  .heading:is(.-decoration) .heading-label {
    font-size: 1.875rem;
    text-shadow: 0.125rem 0.125rem 0 rgb(255, 255, 255);
  }
  .heading:is(.period *) {
    font-size: 1.875rem;
  }
  .heading:is(.loginform *) {
    font-size: 2.125rem;
    line-height: 1.8;
    text-shadow: 0.0625rem 0.0625rem 1.375rem rgba(255, 245, 0, 0.85);
  }
  .heading:is(.loginform *) + .notes {
    margin-block-start: 0.75em;
  }
  .date:is(.period *) {
    padding: 1.75rem 0;
    letter-spacing: 0;
  }
  .note:is(.period *) {
    font-size: 1.5rem;
  }
  .note small {
    font-size: 1.25rem;
  }
  .text-xs {
    font-size: 0.75rem;
    line-height: 1.33;
  }
  .text-sm {
    font-size: 0.875rem;
    line-height: 1.33;
  }
  .text-md {
    font-size: 1rem;
    line-height: 1.5;
  }
  .text-lg {
    font-size: 1.125rem;
    line-height: 1.5;
  }
  .text-xl {
    font-size: 1.25rem;
  }
  .text-2xl {
    font-size: 1.5rem;
  }
  .text-3xl {
    font-size: 1.875rem;
  }
  .text-4xl {
    font-size: 2.125rem;
  }
  .text-custom :is(.overview .image *) {
    font-size: 1.125rem;
  }
  .text-custom:is(.overview .desc *) {
    font-size: 1.625rem;
  }
  .text-custom:is(.accesscode-info.-confirm .desc *) {
    font-size: 1.5rem;
  }
  .text-custom:is(.accesscode-info .button *) {
    font-size: 1.5rem;
  }
  .text-custom:is(.navigation .button) {
    font-size: 1.5rem;
  }
  .text-custom:is(.loginform .button *) {
    font-size: 1.5rem;
  }
  .text-custom:is(.button.banapass *) {
    font-size: 1.25rem;
  }
  .text-custom:is(.button.pageback *) {
    font-size: 1.25rem;
  }
  .text-custom:is(.-dummy) {
    font-size: 0.75rem;
  }
  .text-custom:is(.footer-content *) {
    font-size: 0.875rem;
  }
  .caption:is(.loginform *) {
    padding: 0.34em 0;
    font-size: 1.125rem;
  }
  :is(.overview .unstyled-list) {
    margin-right: auto;
    margin-left: auto;
    margin-block-start: 3rem;
    width: auto;
    max-width: -moz-fit-content;
    max-width: fit-content;
  }
  .button {
    gap: 0.875rem;
    padding: 0.375rem;
    width: 100%;
    max-width: 28.75rem;
  }
  .button::before, .button::after {
    width: 10px;
  }
  .button.-dummy {
    gap: 0.5rem;
    margin: 0 0.67em;
    padding: 0.25rem;
    max-width: 12.0625rem;
  }
  .button.-dummy > .button-label {
    padding: 0.25rem 0;
    font-size: 0.75rem;
  }
  .button:where(.mypage-app) {
    width: 28.75rem;
  }
  .button.banapass {
    max-width: 34.625rem;
  }
  .button.pageback {
    width: 21.25rem;
  }
  .button.pageback > .button-label {
    padding: 0.75rem 0;
  }
  .button > .button-label {
    border-width: 0.5rem;
    padding: 1rem 0;
  }
  .column {
    grid-template-rows: 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
  }
  .column:where(.loginform *) {
    gap: clamp(1.5rem, -10.9138rem + 25.8621vw, 5.25rem);
    margin-block-start: 3rem;
    max-width: 62.5rem;
  }
  .terms-container {
    margin-block-start: 2.5rem;
    padding: 1.375rem;
    max-width: 55rem;
  }
  .terms-container > .scroll-wrapper {
    height: 25rem;
  }
  .information {
    margin-block-start: 2rem;
  }
  .information .text-2xl {
    font-size: 1.5rem;
  }
  .footer-content {
    border-top-width: 0.25rem;
    padding: 4.8125rem 2rem 5.5rem;
  }
  .footer-content > .copyright {
    max-width: 62.5rem;
  }
  .slider {
    max-width: 54.75rem;
    min-height: 31.25rem;
  }
  .slider:is(.app-proc *) {
    margin-block-start: 2rem;
  }
  .slider .slide-wrapper {
    padding: 0 2rem;
    width: 100%;
    max-width: 54rem;
    min-height: 31.25rem;
  }
  .slider .content-wrapper {
    grid-template-rows: 4.375rem 1fr;
  }
  .slide-title {
    padding: 0 2rem;
  }
  .slide-body {
    padding: 2.25rem;
  }
  .slide-body .heading {
    font-size: 1.75rem;
  }
  .slide-body .heading + * {
    margin-block-start: 1.5rem;
  }
  .slide-body .column {
    grid-template-rows: 1fr;
    grid-template-columns: 1fr minmax(11.25rem, 40%);
  }
  .slide-body .column > .item [class*=text] {
    line-height: 1.8;
  }
  .slide-body .desc {
    font-size: 1.25rem;
    line-height: 2;
  }
  .slide-body .desc + .note {
    margin-block-start: 2em;
  }
  .accesscode-info .desc {
    padding: 1.5rem 0 3rem;
    max-width: 62.5rem;
  }
  .accesscode-info .desc:is(.status + *) {
    margin-block-start: unset;
    padding: 1.5rem 0 3rem;
  }
  .accesscode-info .desc + * {
    margin-block-start: 3rem;
  }
  .accesscode-info .status:not(.-confirm *) {
    gap: 1.75rem;
    padding: 2.25rem 0;
    width: 100%;
    max-width: 52.5rem;
  }
  .accesscode-info .status:not(.-confirm *) > div:not(.access-code) dt {
    padding: 1.125rem;
  }
  .accesscode-info .status:not(.-confirm *) > div:not(.access-code) dd {
    gap: 0.34rem;
    padding: 0.5625rem;
    text-shadow: 0.0625rem 0.0625rem 1.375rem rgba(0, 235, 255, 0.85);
  }
  .accesscode-info .status:is(.-confirm .confirm-data) {
    gap: 2.25rem;
    max-width: 62.5rem;
  }
  .accesscode-info .status:is(.-confirm .confirm-data) .app {
    padding: 0.5rem clamp(3rem, -1.3308rem + 9.0226vw, 6rem) 0.75rem;
    width: -moz-fit-content;
    width: fit-content;
    text-shadow: 0.0625rem 0.0625rem 1.375rem rgba(0, 235, 255, 0.85);
  }
  .accesscode-info .status:is(.-confirm .confirm-data) .points {
    font-size: 1.625rem;
  }
  .accesscode-info .status .label:not(.access-code *) {
    font-size: 1.625rem;
  }
  .accesscode-info .status .label:is(.access-code *) {
    font-size: 1.625rem;
  }
  .accesscode-info .status .label:is(.access-code *)::after {
    margin: 0 0.75em;
    font-size: 1.625rem;
  }
  .accesscode-info .status .value:not(.access-code *) {
    font-size: clamp(2.25rem, 0.6944rem + 3.2407vw, 3.125rem);
  }
  .accesscode-info .status .value:is(.access-code *) {
    font-size: 1.625rem;
  }
  .accesscode-info .status .suf {
    font-size: clamp(2.25rem, 0.6944rem + 3.2407vw, 3.125rem);
  }
  .accesscode-info .status .suf > small {
    font-size: clamp(1.5rem, 0.3889rem + 2.3148vw, 2.125rem);
  }
  .accesscode-info .navigation {
    gap: 3rem;
    margin-block-start: 3rem;
  }
  .accesscode-info .navigation:is(.confirm-data + *) {
    margin-block-start: 4.625rem;
  }
  .nocode .desc:first-of-type {
    margin-block-start: 4rem;
  }
  .nocode .navigation {
    margin-block-start: 6rem;
  }
  .label:is(.accesscode-info .status *) {
    font-size: 1.625rem;
  }
  .annotation .desc {
    width: -moz-fit-content;
    width: fit-content;
  }
  .annotation .navigation {
    margin-block-start: 6rem;
  }
  .qa-pattern:is(.nocode *) {
    margin-block-start: 2.25rem;
    max-width: 46.25rem;
  }
  :where(.accesscode-info *) .meter-confirm {
    padding: 3.25rem 2rem 0;
  }
  :where(.accesscode-info *) .meter-confirm > .confirm-text {
    font-weight: 700;
    font-size: 1.5rem;
  }
  :where(.accesscode-info *) .meter-select {
    gap: 4.625rem;
    margin-block-start: 3rem;
  }
  :where(.accesscode-info *) .meter-select_item {
    padding: 0.75rem 0.5rem;
    width: auto;
  }
  :where(.accesscode-info *) .meter-select_item .notice {
    font-size: 1.25rem;
  }
  :where(.accesscode-info *) .meter-entry {
    max-width: 36.25rem;
  }
  :where(.accesscode-info *) .meter-entry .entry-count {
    font-weight: 700;
    font-size: 1.5rem;
  }
  :where(.accesscode-info *) .meter-list {
    gap: 1.5rem;
  }
  :where(.accesscode-info *) .meter-list_item :where(figcaption) {
    font-size: 1.125rem;
  }
  :where(.accesscode-info *) input[type=radio] {
    margin: 1.25rem auto;
    width: 1.5rem;
    height: 1.5rem;
  }
}
@media not all and (min-width: 48em){
  [data-view=">md"],
  [data-view="&gt;md"] {
    display: revert;
  }
  [data-view="<md"],
  [data-view="&lt;md"] {
    display: revert;
  }
  .jumbotron .wangan-logo {
    width: 80.5333vw;
  }
  .section-container:is(.nocode *), .section-container:is(.annotation *), .section-container:is(.loginform *) {
    padding: 9.8667vw 5.3333vw 12.8vw;
  }
  .text-custom:is(.overview .desc *) {
    hanging-punctuation: allow-end;
    font-kerning: normal;
    font-feature-settings: "palt" 1;
    line-break: auto;
  }
  .slide-body .desc {
    hanging-punctuation: allow-end;
    font-kerning: normal;
    font-feature-settings: "palt" 1;
    line-break: auto;
  }
  .slide-body .desc.-wide-gap {
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 3.2vw;
    line-height: 1.8;
  }
  .slide-body .image {
    margin: 0 auto;
    width: 50.6667vw;
  }
  :where(.accesscode-info *) .meter-select_item:first-child {
    margin-right: 20%;
    margin-left: 20%;
  }
  :where(.accesscode-info *) .meter-list_item :where(img) {
    margin: 0 auto;
    width: 24vw;
  }
}
@media (min-width: 64em){
  [data-view=lg] {
    display: revert;
  }
}
@media not all and (min-width: 64em){
  [data-view=">lg"],
  [data-view="&gt;lg"] {
    display: revert;
  }
  [data-view="<lg"],
  [data-view="&lt;lg"] {
    display: revert;
  }
}
@media (min-width: 80em){
  [data-view=xl] {
    display: revert;
  }
}
@media not all and (min-width: 80em){
  [data-view=">xl"],
  [data-view="&gt;xl"] {
    display: revert;
  }
  [data-view="<xl"],
  [data-view="&lt;xl"] {
    display: revert;
  }
}
@media (min-width: 96em){
  [data-view="2xl"] {
    display: revert;
  }
}
@media not all and (min-width: 96em){
  [data-view=">2xl"],
  [data-view="&gt;2xl"] {
    display: revert;
  }
  [data-view="<2xl"],
  [data-view="&lt;2xl"] {
    display: revert;
  }
}
@media (forced-colors: active){
  :where(.accesscode-info *) input[type=radio] {
    border: 2px solid CanvasText;
    background: Canvas;
  }
  :where(.accesscode-info *) input[type=radio]:checked::after {
    background: CanvasText;
  }
}
@media (hover: hover) and (pointer: fine){
  a:where(.mailto):hover {
    text-decoration: underline;
  }
  :where(.text-link):hover {
    filter: brightness(0.88);
  }
  .button:hover {
    filter: brightness(1.2);
  }
  :where(.accesscode-info *) .meter-select_item:hover {
    background-color: rgba(10, 13, 65, 0.67);
  }
}
@media (prefers-reduced-motion: reduce){
  :where(.accesscode-info *) input[type=radio],
  :where(.accesscode-info *) input[type=radio]::after {
    transition: none;
  }
}
@media screen and (prefers-reduced-motion: reduce){
  html {
    scroll-behavior: auto;
  }
}