@charset "utf-8";
/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
body {
  margin: 0;
}
main {
  display: block;
}
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
dt {
  font-weight: bold;
}
dd {
  margin-left: 0;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}
pre {
  font-family: monospace, monospace;
  font-size: inherit;
}
address {
  font-style: inherit;
}
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}
abbr[title] {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}
b,
strong {
  font-weight: bolder;
}
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: inherit;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}
button:disabled,
[type="button"]:disabled,
[type="reset"]:disabled,
[type="submit"]:disabled {
  cursor: default;
}
:-moz-focusring {
  outline: auto;
}
select:disabled {
  opacity: inherit;
}
option {
  padding: 0;
}
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}
legend {
  padding: 0;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
[type="search"] {
  outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
[type="number"] {
  -moz-appearance: textfield;
}
label[for] {
  cursor: pointer;
}
details {
  display: block;
}
summary {
  display: list-item;
}
[contenteditable]:focus {
  outline: auto;
}
table {
  border-color: inherit;
  border-collapse: collapse;
}
caption {
  text-align: left;
}
td,
th {
  vertical-align: top;
  padding: 0;
}
th {
  text-align: left;
  font-weight: bold;
}
/*  CSS Custom Properties Around Colors  */
:root {
  /*  Elemental color  */
  --navy: #0e3870;
  --sky: #43A1D9;
  --dark-sky: #DCE7F5;
  --light-sky: #CFEDFF;
  --pale-sky: #E9F4FF;
  --bright-sky: #0094D5;
  --bright-green: #4DD56A;
  --bright-purple: #8438FF;
  --lemon: #FFF000;
  --cream: #FFFDD9;
  --red: red;
  --white: white;
  --sky-gray: #C0D2E8;
  --cloudy-gray: #b3c7de;
  --dark-sky-gray: #8da2bf;
  --gray: #c4c4c4;
  --light-gray: #E8E8E8;
  --dark-gray: #666;
  --black: #082040;
  --rich-black: #000;
  /*  Role color  */
  --main: var(--navy, navy);
  --accent: var(--lemon, orangered);
  --title: var(--navy);
  --text: var(--navy);
  --border: var(--gray);
  --link: var(--sky, blue);
  --visited: var(--link, blueviolet);
  --hover: var(--navy, dodgerblue);
  --focus: var(--navy, royalblue);
  --alert: var(--red, tomato);
  --error: var(--alert, red);
  --warning: var(--lemon, gold);
  --notice: var(--cream, LemonChiffon);
  --marker: var(--lemon);
  --shadow: rgba(14, 56, 112, 0.2);
  --confirm: var(--sky, deepskyblue);
  --submit: var(--green, lawngreen);
  --news: var(--bright-sky);
  --press-release: var(--bright-green);
  --update: var(--bright-purple);
}
:root::-moz-selection {
  color: var(--black);
  background-color: var(--marker);
}
:root::selection {
  color: var(--black);
  background-color: var(--marker);
}
@font-face {
}
:root {
  font-size: 62.5%;
  --root-fs: 1.5rem;
  --root-bg: var(--pale-sky);
  --root-color: var(--text);
  --root-fw: var(--weight-bold);
  --root-fst: normal;
  --root-lh: 1.75;
  --root-ls: 0.05ic;
  --root-align: left;
  --root-transition: 0.15s 0s ease;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-bold: 700;
  --radius1st: 10px;
  --radius2nd: 8px;
  --radius3rd: 6px;
  --radius4th: 4px;
  --radius-min: 2px;
  --m: 15px;
  --q: 30px;
  --h: 60px;
  --g: 120px;
  --mh: 1.19vh;
  --mw: 2.5vw;
  --qh: 5vh;
  --qw: 5vw;
  --hh: 10vh;
  --hw: 10vw;
  --gh: 20vh;
  --gw: 20vw;
  --mb: min(var(--mh), var(--m));
  --mi: min(var(--mw), var(--m));
}
@media screen and (min-width: 768px) {
  :root {
    --main-width: 1260px;
    --header-height: min(6.34vw, 80px);
  }
}
@media screen and (max-width: 480px) {
  :root {
    --main-width: 100%;
    --header-height: 72px;
  }
}
html {
  -webkit-text-size-adjust: none;
     -moz-text-size-adjust: none;
          text-size-adjust: none;
  scroll-behavior: smooth;
}
body {
  --fs: var(--root-fs);
  --fw: var(--root-fw);
  --fst: var(--root-fst);
  --lh: var(--root-lh);
  --ls: var(--root-ls);
  --align: var(--root-align);
  --color: var(--root-color);
  --bg: var(--root-bg);
  --transition: var(--root-transition);
  width: 100%;
  height: 100svh;
  background-color: var(--bg);
  font-family: YuGothicM, /* Windows8.1以上は游ゴシック */ YuGothic, /* Macの游ゴシック */ -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */ Meiryo, /* 游ゴシックが入っていないWindows */ sans-serif;
  /* Windows */
  font-size: var(--fs);
  font-weight: var(--fw);
  font-style: var(--fst);
  line-height: var(--lh);
  letter-spacing: var(--ls);
  text-align: var(--align);
  color: var(--color);
  overflow-x: clip;
  position: relative;
  z-index: 0;
  padding-top: var(--header-height);
}
@font-face {
  font-family: YuGothicM;
  font-weight: normal;
  src: local('YuGothic-Medium'), /* Windowsでは游ゴシックが細くかすれてしまうので、Mediumを明示的に指定 */ local('Yu Gothic Medium'), /* Chrome用 */ local('YuGothic-Regular');
  /* Windows8.1ではMediumがないのでRegularを指定 */
}
@font-face {
  font-family: YuGothicM;
  font-weight: bold;
  src: local('YoGothic-Bold'), /* Boldはそのまま */ local('Yu Gothic');
  /* Chrome用 */
}
body:has(.modal.is_active) {
  overflow-y: clip;
}
:root {
  --base-fs: min(0.07vw, 0.1rem);
}
:target {
  scroll-margin-block: 5lh;
}
*::before,
*::after {
  content: "";
  display: none;
  box-sizing: border-box;
}
@media screen and (min-width: 768px) {
  br:is([sp],.sp, .sp-only) {
    display: none;
  }
  br:is([pc],.pc, .pc-only) {
    display: inline;
  }
}
@media screen and (max-width: 480px) {
  br:is([pc],.pc, .pc-only) {
    display: none;
  }
  br:is([sp],.sp, .sp-only) {
    display: inline;
  }
}
hr {
  margin-block: var(--hr-margin-block, calc(var(--mb) * 2));
  margin-inline: var(--hr-margin-inline, 0);
  border-top: 1px solid var(--hr-color, black);
}
hr.full,
hr[full] {
  width: var(--main-width);
  margin-inline: calc(-1 * var(--root-padding-inline));
}
@media screen and (max-width: 480px) {
  hr.full,
  hr[full] {
    width: 100svw;
  }
}
:is(h1, h2, h3, h4, h5, h6) {
  word-break: auto-phrase;
}
h1 {
  font-size: var(--heading1-fs, var(--headings-fs, calc(var(--base-fs) * 30)));
  font-weight: var(--heading1-fw, var(--headings-fw, var(--weight-bold)));
}
h2 {
  font-size: var(--heading2-fs, var(--headings-fs, calc(var(--base-fs) * 27)));
  font-weight: var(--heading2-fw, var(--headings-fw, var(--weight-bold)));
}
h3 {
  font-size: var(--heading3-fs, var(--headings-fs, calc(var(--base-fs) * 24)));
  font-weight: var(--heading3-fw, var(--headings-fw, var(--weight-bold)));
}
h4 {
  font-size: var(--heading4-fs, var(--headings-fs, calc(var(--base-fs) * 21)));
  font-weight: var(--heading4-fw, var(--headings-fw, var(--weight-bold)));
}
h5 {
  font-size: var(--heading5-fs, var(--headings-fs, calc(var(--base-fs) * 18)));
  font-weight: var(--heading5-fw, var(--headings-fw, var(--weight-bold)));
}
h6 {
  font-size: var(--heading6-fs, var(--headings-fs, calc(var(--base-fs) * 18)));
  font-weight: var(--heading6-fw, var(--headings-fw, var(--weight-bold)));
}
:is(h1, h2, h3, h4, h5, h6) {
  word-break: normal;
}
p:empty {
  display: none;
}
p:has( + * ) {
  margin-bottom: var(--paragraph-gap, var(--m));
}
b,
strong {
  font-weight: var(--strong-fw, var(--weight-bold));
}
a {
  color: var(--anchor-color);
  background: var(--anchor-bg, transparent);
}
a:not([class]) {
  --anchor-color: currentColor;
  text-decoration: underline;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}
a:link {
  --anchor-color: var(--link);
}
a:visited {
  --anchor-color: var(--visited);
}
a:focus {
  --anchor-color: var(--focus);
}
@media (hover: hover) {
  a:hover {
    --anchor-color: var(--hover);
    --anchor-bg: var(--hover-bg, transparent);
  }
}
a:not([class]) {
  text-decoration: none;
}
:where(a, button) {
  --BUTTON-color: var(--color, var(--anchor-color, var(--link)));
  --BUTTON-bg: var(--bg, var(--anchor-bg, transparent));
  color: var(--BUTTON-color);
  text-decoration: none;
  background: var(--BUTTON-bg);
}
:where(a, button):not([class]) {
  text-decoration: underline;
}
:where(a, button):focus {
  --BUTTON-color: var(--focus);
  --BUTTON-bg: var(--focus-bg, transparent);
}
@media (hover: hover) {
  :where(a, button):hover {
    --BUTTON-color: var(--hover);
    --BUTTON-bg: var(--hover-bg, transparent);
    cursor: pointer;
  }
}
:where(img, figure, picture, iframe, video) {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  font-style: italic;
  background-repeat: no-repeat;
  background-size: cover;
  vertical-align: middle;
}
img {
  outline: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
picture {
  line-height: 0;
  overflow: hidden;
}
iframe {
  aspect-ratio: 560 / 315;
}
video {
  aspect-ratio: 16 / 9;
  background: var(--black);
}
input[type="checkbox"] {
  -webkit-appearance: auto;
  -moz-appearance: auto;
       appearance: auto;
  inline-size: var(--m);
  block-size: var(--m);
  vertical-align: text-top;
}
[src*="logo-hitotsu"] {
  aspect-ratio: 92 / 25;
}
[src*="logo-link"] {
  aspect-ratio: 14 / 3;
}
[src*="logo-asset"] {
  aspect-ratio: 151 / 24;
}
:is(h2, h3, h4, h5, h6, p, li, div) > img:is([src*="logo-link"] , [src*="logo-asset"] ) {
  display: inline;
  max-width: unset;
  max-height: 0.9lh;
  margin-inline: 0.25ic;
  -o-object-fit: contain;
     object-fit: contain;
  vertical-align: middle;
}
iframe[src*="youtube"] {
  width: 100%;
  aspect-ratio: 560 / 315;
}
.inner:has(iframe[src*="youtube"]) {
  width: min(90%, var(--main-width));
  padding: calc(var(--m) * 4);
}
.marker {
  background: linear-gradient(transparent 65%, var(--marker, gold) 0%);
}
.small {
  font-size: 90%;
}
.note,
.note1,
.note2,
.note3 {
  font-weight: var(--weight-regular);
}
.note,
.note1 {
  display: inline-block;
  text-indent: -1ic;
  padding-left: 1ic;
}
.note2 {
  display: inline-block;
  text-indent: -2ic;
  padding-left: 2ic;
}
.note3 {
  display: inline-block;
  text-indent: -3ic;
  padding-left: 3ic;
}
.btn {
  --BUTTON-width: var(--btn-width, var(--width, fit-content));
  --BUTTON-min-width: var(--btn-min-width, var(--min-width, unset));
  --BUTTON-height: var(--btn-height, var(--height, fit-content));
  --BUTTON-min-height: var(--btn-min-height, var(--min-height, unset));
  --BUTTON-fs: var(--btn-fs, var(--fs, calc(var(--base-fs) * 18)));
  --BUTTON-fw: var(--btn-fw, var(--fw, var(--weight-regular)));
  --BUTTON-lh: var(--btn-lh, var(--lh, var(--root-lh)));
  --BUTTON-color: var(--btn-color, var(--color, var(--black)));
  --BUTTON-padding-block: var(--btn-padding-block, var(--padding-block, 0));
  --BUTTON-padding-inline: var(--btn-padding-inline, var(--padding-inline, var(--m)));
  --BUTTON-radius: var(--btn-radius, var(--radius, 0));
  --BUTTON-bg: var(--btn-bg, var(--bg, transparent));
  --BUTTON-border-color: var(--btn-border-color, var(--border-color, transparent));
  --BUTTON-border-weight: var(--btn-border-weight, var(--border-weight, 0px));
  --BUTTON-box-shadow: var(--btn-box-shadow, var(--box-shadow, unset));
  width: var(--BUTTON-width);
  min-width: var(--BUTTON-min-width);
  height: var(--BUTTON-height);
  min-height: var(--BUTTON-min-height);
  padding-block: var(--BUTTON-padding-block);
  padding-inline: var(--BUTTON-padding-inline);
  border-radius: var(--BUTTON-radius);
  border: var(--BUTTON-border-weight) solid var(--BUTTON-border-color);
  box-shadow: var(--BUTTON-shadow);
  background: var(--BUTTON-bg);
  color: var(--BUTTON-color);
  font-size: var(--BUTTON-fs);
  font-weight: var(--BUTTON-fw);
  line-height: var(--BUTTON-lh);
  --BUTTON-text-arrow-gap: var(--btn-gap, var(--gap, 0.5ic));
  --BUTTON-arrow-size: var(--btn-arrow-size, var(--arrow-size, 0.3lh));
  --BUTTON-arrow-weight: var(--btn-arrow-weight, var(--arrow-weight, 2px));
  --width: max-content;
  --min-width: fit-content;
  --hover: var(--white);
  --hover-bg: var(--sky);
  --padding-block: 0.3lh;
  --padding-inline-start: 1.5ic;
  --padding-inline-end: 1.5ic;
  --padding-inline: var(--padding-inline-start) var(--padding-inline-end);
  --radius: 10lh;
  --color: var(--white);
  --bg: var(--navy);
  --border-color: transparent;
  --border-weight: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: var(--BUTTON-text-arrow-gap);
       column-gap: var(--BUTTON-text-arrow-gap);
  text-underline-offset: 5px;
  transition: var(--transition);
}
@media (hover: hover) {
  .btn:hover {
    --BUTTON-color: var(--hover);
    --BUTTON-bg: var(--hover-bg, transparent);
    cursor: pointer;
  }
}
.btn:not(.noarrow)::after {
  flex-shrink: 0;
  display: block;
  width: var(--BUTTON-arrow-size);
  height: var(--BUTTON-arrow-size);
  border-top: var(--BUTTON-arrow-weight) solid currentColor;
  border-right: var(--BUTTON-arrow-weight) solid currentColor;
  transform: rotate(45deg);
}
.btn.strong {
  --color: var(--white);
  --bg: var(--sky);
  --hover: var(--navy);
  --hover-bg: var(--sky);
}
.btn.lowkey {
  --color: var(--navy);
  --hover: var(--white);
  --bg: transparent;
  --hover-bg: var(--sky);
  --border-color: currentColor;
  --border-weight: 1px;
}
@media (hover: hover) {
  .btn.lowkey:hover {
    border-color: transparent;
  }
}
.btn.noborder {
  --color: var(--navy);
  --bg: transparent;
}
.nav-list,
.nav-modal {
  --fs: calc(var(--base-fs) * 21);
  --padding-block: 12px;
  margin-inline: auto;
}
.nav-list {
  --min-width: min(28.57vw, 360px);
}
.nav-home {
  margin-inline: auto;
}
.banner-movie {
  --image-size: min(19.04vw, 240px);
  --icon-size: min(3.96vw, 50px);
  --padding-block: var(--m);
  --padding-inline: var(--mi);
  --radius: var(--radius1st);
  --color: var(--white);
  --bg: var(--navy);
  --hover: var(--white);
  --hover-bg: var(--sky);
  --transition: 0.3s 0s ease;
  margin-top: calc(var(--mb) * 10);
  margin-inline: auto;
  width: 80%;
  padding-block: var(--padding-block);
  padding-inline: var(--padding-inline);
  border-radius: var(--radius);
  background: var(--bg);
  display: grid;
  grid-template-columns: var(--image-size) 1fr;
  gap: var(--mb) calc(var(--mi) * 2);
  color: var(--color);
}
@media (hover: hover) {
  .banner-movie {
    transition: var(--transition);
  }
  .banner-movie:hover {
    --bg: var(--hover-bg);
    --color: var(--hover);
    transform-origin: bottom center;
    transform: scale(1.02);
  }
}
.banner-movie.shadow::before {
  transition: var(--transition);
}
.banner-movie.shadow > * {
  position: relative;
  z-index: 1;
}
.banner-movie.shadow::before {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: var(--radius);
  background: var(--bg);
  position: absolute;
  inset: 0;
  z-index: 0;
}
.banner-movie .image {
  width: var(--image-size);
  border-radius: var(--radius2nd);
  overflow: clip;
  grid-row: 1 / 3;
  grid-column: 1 / 2;
}
.banner-movie .image::before {
  display: block;
  width: var(--icon-size);
  height: var(--icon-size);
  border-radius: 100%;
  background-color: rgba(255, 255, 255, 0.6);
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cdefs%3E%3Cstyle%3E.d%7Bfill:%230e3870;%7D%3C/style%3E%3C/defs%3E%3Cg id='c'%3E%3Cpath class='d' d='M25,3c12.131,0,22,9.869,22,22s-9.869,22-22,22S3,37.131,3,25,12.869,3,25,3M25,0C11.193,0,0,11.193,0,25s11.193,25,25,25,25-11.193,25-25S38.807,0,25,0h0Z'/%3E%3Cpolygon class='d' points='17.676 13.259 17.676 36.741 38.183 25 17.676 13.259'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  inset: 0;
  margin: auto;
}
.banner-movie .title {
  padding-block: calc(var(--mb) * 1.5);
  border-bottom: 1px solid var(--color);
  margin-right: var(--mi);
  font-size: calc(var(--base-fs) * 27);
}
.banner-movie .title img[src*="logo"] {
  transition: var(--transition);
}
.banner-movie:hover .title img[src*="logo"] {
  filter: brightness(3);
}
.banner-movie p {
  margin-bottom: var(--mb);
}
.wrap {
  --wrap-width: var(--main-width);
  width: 100%;
  max-width: var(--wrap-width);
  box-sizing: border-box;
  margin-inline: auto;
  --wrap-padding-block: calc(var(--mb) * 6);
  --wrap-padding-inline: calc(var(--m) * 2);
  padding-inline: var(--wrap-padding-inline);
}
main.content > section {
  max-width: 100%;
  background: var(--bg);
  overflow-x: clip;
}
main.content > section .wrap {
  padding-block: var(--wrap-padding-block) calc(var(--wrap-padding-block) * 1.5);
}
.headline {
  margin-block: calc(var(--mb) * 3) calc(var(--mb) * 5);
  font-size: calc(var(--base-fs) * 36);
  text-align: center;
  line-height: 1.5;
}
.headline:is(h2) {
  font-size: calc(var(--base-fs) * 45);
}
.headline:is(h3) {
  font-size: calc(var(--base-fs) * 36);
}
.subline {
  text-align: center;
}
.title {
  line-height: 1.5;
}
.caption {
  line-height: 1.5;
}
section > .lead,
section .wrap > .lead {
  text-align: center;
}
ul {
  list-style: disc;
}
ul,
ol {
  -webkit-padding-start: 1.5ic;
          padding-inline-start: 1.5ic;
}
.thumbnail {
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
  position: relative;
}
.thumbnail:not(:has(img)) {
  background: var(--navy);
}
.thumbnail img {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: 100%;
  -o-object-position: top left;
     object-position: top left;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  inset: 0;
}
.container {
  display: flex;
}
.notice {
  width: -moz-fit-content;
  width: fit-content;
  padding: var(--mb) calc(var(--mi) * 3);
  background: var(--dark-sky);
  margin-inline: auto;
}
*:has(> .shadow) {
  position: relative;
  z-index: 0;
}
.shadow {
  --shadow: 0 0 calc(var(--mb) * 4) 0 rgba(14, 56, 112, 0.3);
  position: relative;
  z-index: auto;
}
.shadow.swiper-slide {
  transform: none !important;
}
.shadow::after {
  display: block;
  width: 93%;
  height: 97%;
  border-radius: 20%;
  box-shadow: var(--shadow);
  position: absolute;
  top: 51.5%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
.points:where(.container) {
  --row-gap: calc(var(--mb) * 7);
  --column-gap: calc(var(--mi) * 5);
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--row-gap) var(--column-gap);
  position: relative;
  z-index: 1;
}
.points:where(.container) .block {
  --radius: var(--radius1st);
  width: calc((100% - var(--column-gap)) / 2);
  border-radius: var(--radius);
  background: var(--white);
}
.points:where(.container) .title {
  padding-block: calc(var(--mb) * 2);
  padding-inline: calc(var(--mi) * 2);
  background: var(--navy);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: calc(var(--base-fs) * 27);
  line-height: 1.25;
  color: var(--white);
}
.points:where(.container) .label {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1ic;
  border-radius: 10lh;
  background: var(--pale-sky);
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 15);
  color: var(--navy);
}
.points:where(.container) .nav-modal {
  --bg: var(--dark-sky);
  --color: var(--navy);
  --fs: calc(var(--base-fs) * 18);
  --radius: 0 0 var(--radius1st) var(--radius1st);
  margin-top: auto;
}
.modal {
  width: 100svw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  overflow-y: scroll;
}
.modal:not(.is_active, .active, .open) {
  display: none;
  z-index: -1;
  opacity: 0;
  pointer-events: none;
}
.modal:is(.is_active, .active, .open) {
  z-index: 1000;
  opacity: 1;
  pointer-events: auto;
}
.modal::after {
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}
.modal .inner {
  margin-block: calc(var(--mb) * 6);
  width: var(--modal-inner-width, min(80%, var(--main-width)));
  margin-inline: auto;
  padding: calc(var(--mb) * 3) calc(var(--mi) * 3);
  border-radius: var(--radius1st);
  background: var(--white);
  position: relative;
}
.modal .caption {
  flex-shrink: 0;
  width: 100%;
  padding-left: 1.25ic;
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 18);
}
.modal .caption:before {
  display: inline-block;
  content: "\25CF";
  color: var(--sky);
  margin-right: 0.25ic;
  margin-left: -1.25ic;
}
.modal * + .caption {
  margin-top: calc(var(--mb) * 2);
}
.modal .close,
.popup .close {
  width: calc(var(--m) * 3);
  height: calc(var(--m) * 3);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: calc(var(--base-fs) * 42);
  line-height: 1;
  font-weight: var(--weight-light);
  color: var(--close-color, var(--gray));
  position: absolute;
  top: var(--mb);
  right: var(--mi);
  z-index: 10;
  transition: var(--transition);
}
@media (hover: hover) {
  .modal .close:hover,
  .popup .close:hover {
    color: var(--close-hover, var(--navy));
  }
}
.modal .note,
.popup .note {
  text-align: left;
}
.swiper-container {
  --swiper-container-margin-bottom: calc(var(--mb) * 8);
  --swiper-scrollbar-bottom: calc(var(--swiper-container-margin-bottom) / 2);
  --swiper-btn-size: calc(var(--mb) * 4);
  --swiper-btn-offset: calc(100% + var(--mi));
  --swiper-arrow-color: var(--white);
  --swiper-btn-bg: rgba(14, 56, 112, 0.9);
  --swiper-arrow-hover: var(--white);
  --swiper-btn-hover-bg: var(--sky);
  --swiper-disabled-arrow-color: var(--navy);
  --swiper-disabled-btn-bg: rgba(192, 210, 232, 0.3);
  --swiper-pagination-bottom: calc(var(--swiper-container-margin-bottom) / 3);
  --swiper-pagination-bullet-size: 11px;
  --swiper-pagination-bullet-horizontal-gap: 9px;
  --swiper-pagination-color: var(--sky);
  padding-bottom: var(--swiper-container-margin-bottom);
  position: relative;
}
@media screen and (max-width: 1260px) {
  .swiper-container {
    --swiper-btn-offset: calc(100% - var(--swiper-btn-size) - var(--mi));
  }
}
.swiper {
  height: 100%;
}
.swiper .swiper-slide:is(a) {
  display: block;
}
.swiper.type-card .swiper-slide {
  --radius: var(--radius1st);
  height: auto;
  align-self: stretch;
}
.swiper.type-card .thumbnail {
  border-radius: var(--radius) var(--radius) 0 0;
}
.swiper-button-next,
.swiper-button-prev {
  width: var(--swiper-btn-size);
  height: var(--swiper-btn-size);
  border-radius: var(--swiper-btn-size);
  background: var(--swiper-btn-bg);
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateY(-100%);
  transition: var(--transition);
}
.swiper-button-next::before,
.swiper-button-prev::before {
  display: block;
  width: var(--mb);
  height: var(--mb);
  border-top: 2px solid var(--swiper-arrow-color);
  border-right: 2px solid var(--swiper-arrow-color);
  transform: translateX(var(--arrow-offset)) rotate(var(--arrow-rotate));
}
@media (hover: hover) {
  .swiper-button-next:hover,
  .swiper-button-prev:hover {
    --swiper-btn-bg: var(--swiper-btn-hover-bg);
    --swiper-arrow-color: var(--swiper-arrow-hover);
  }
}
.swiper-button-next {
  --arrow-rotate: 45deg;
  --arrow-offset: -25%;
  right: auto;
  left: var(--swiper-btn-offset);
}
.swiper-button-prev {
  --arrow-rotate: -135deg;
  --arrow-offset: 25%;
  left: auto;
  right: var(--swiper-btn-offset);
}
.swiper-button-disabled {
  --swiper-btn-bg: var(--swiper-disabled-btn-bg);
  --swiper-arrow-color: var(--swiper-disabled-arrow-color);
}
.swiper-scrollbar-drag {
  --swiper-scrollbar-drag-bg-color: var(--navy);
}
.type-news {
  --category-color: var(--sky);
}
.type-press-release {
  --category-color: var(--sky);
}
.type-update {
  --category-color: var(--sky);
}
.pagination {
  --parent-bg: var(--main-color);
  --parent-color: var(--white);
  --bg: var(--parent-bg);
  --color: var(--parent-color);
  --gap: 24px;
  width: -moz-fit-content;
  width: fit-content;
  padding: var(--gap);
  margin: 60px auto 0;
  position: relative;
  z-index: 1;
}
.pagination .page-num {
  --color: var(--parent-color);
  display: block;
  font-size: 1.2rem;
  color: var(--color);
  text-align: center;
}
.pagination .page-num::after {
  --bg: var(--parent-color);
  display: block;
  width: 45px;
  height: 2px;
  background-color: var(--bg);
  margin: var(--gap) auto;
}
.pagination .pagers {
  display: flex;
  justify-content: center;
  align-items: center;
  --column-gap: var(--gap);
  flex-wrap: wrap;
}
.pagination a.pager {
  --link: var(--color);
  --visited: var(--color);
  --hover: var(--parent-color);
  --hover-bg: var(--parent-bg);
}
.pagination a.pager:hover {
  box-shadow: inset 0 0 0 1px var(--hover);
}
.pagination span.pager {
  color: inherit;
}
.pagination .pager {
  --size: 36px;
  --bg: var(--parent-color);
  --color: var(--parent-bg);
  display: block;
  width: var(--size);
  height: var(--size);
  line-height: var(--size);
  text-align: center;
  letter-spacing: 0;
}
.pagination .pager.current {
  --bg: transparent;
  --color: var(--parent-color);
  --hover: var(--parent-bg);
  --hover-bg: var(--parent-color);
  box-shadow: inset 0 0 0 1px var(--color);
}
.pagination .pager.prev,
.pagination .pager.next {
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 12px;
  font-size: 1.35rem;
}
.pagination .page-num {
  display: none;
}
.pagination .pagers {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: clamp(12px, 1.5vw, 24px) clamp(18px, 2.25vw, 36px);
}
.pagination .pager {
  --size: clamp(36px, 4.5vw, 72px);
  width: var(--size);
  height: var(--size);
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}
.pagination span.pager {
  background: var(--navy);
  color: var(--white);
}
.pagination a.pager {
  background: var(--white);
  color: var(--navy);
}
@media (hover: hover) {
  .pagination a.pager:hover {
    background: var(--sky);
    color: var(--white);
  }
}
.pagination .pager:is(.prev, .next) {
  width: var(--size);
  font-size: 80%;
}
/* ==================================================================
	* ヘッダー *
================================================================== */
.header {
  width: 100%;
  height: var(--header-height);
  position: fixed;
  top: 0;
  z-index: 100;
}
.header:not(.is_top) {
  background: rgba(255, 255, 255, 0.9);
  transition: background 2s 0s ease;
}
.header.is_top {
  background: rgba(233, 244, 255, 0.9);
  transition: background 1s 0s ease;
}
.header .wrap {
  padding-block: 23px;
  display: flex;
  align-items: center;
}
.header .logo {
  flex-shrink: 0;
  display: block;
  width: min(11.9vw, 158px);
}
.header .navigation {
  width: 100%;
  flex-grow: 1;
  display: flex;
  align-items: center;
}
.header nav {
  display: flex;
  align-items: center;
}
.header nav :is(a, button) {
  font-size: calc(var(--base-fs) * 12);
}
.header nav.gnav {
  padding-inline: calc(var(--mi) * 3);
  -moz-column-gap: calc(var(--mi) * 1.5);
       column-gap: calc(var(--mi) * 1.5);
  --link: var(--navy);
  --hover: var(--link);
}
.header nav.gnav :is(a, button) {
  display: block;
}
@media (hover: hover) {
  .header nav.gnav :is(a, button):hover {
    text-decoration: underline;
  }
}
.header nav.cta {
  margin-left: auto;
  -moz-column-gap: var(--m);
       column-gap: var(--m);
}
.header nav.cta .btn::after {
  display: none;
}
.header .burger {
  display: none;
}
@media screen and (max-width: 767px) {
  .header .burger {
    display: block;
  }
}
/* ==================================================================
	* フッター *
================================================================== */
.footer {
  padding-block: calc(var(--m) * 5);
  background: var(--navy);
  color: var(--white);
  font-size: calc(var(--base-fs) * 13.5);
  font-weight: var(--weight-regular);
}
.footer .container {
  justify-content: space-between;
}
.footer .profile {
  line-height: 1.9;
}
.footer .logo {
  width: 137px;
  margin-bottom: calc(var(--m) * 5);
}
.footer .copyrights {
  margin-top: auto;
  display: flex;
  -moz-column-gap: var(--mi);
       column-gap: var(--mi);
}
.footer a {
  --link: var(--white);
  --hover: var(--gray);
}
@media (hover: hover) {
  .footer a:hover {
    text-decoration: underline;
  }
}
/* ==================================================================
	* CTA Section *
================================================================== */
section.cta {
  --bg: var(--white);
  --btn-fs: calc(var(--base-fs) * 24);
  --btn-min-width: calc(var(--mi) * 21);
  padding-block: calc(var(--m) * 6);
  padding-inline: calc(var(--mi) * 2);
  background: var(--white);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(var(--mb) * 3) calc(var(--mi) * 2);
}
section.cta .lead {
  width: 100%;
  line-height: 1;
  text-align: center;
  letter-spacing: 0.1ic;
}
section.cta .lead strong {
  padding-inline: 0.25ic;
  font-size: calc(var(--base-fs) * 36);
  color: var(--sky);
}
/* ==================================================================
	* フロント *
================================================================== */
section#billboard .wrap {
  height: min(47.61vw, 600px);
  padding-block: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}
section#billboard .heading {
  margin-top: calc(-1 * calc(var(--mi) * 2));
  margin-bottom: calc(var(--mi) * 2);
  transform: translateY(-5%);
  position: relative;
  z-index: 10;
}
section#billboard .subline {
  margin-bottom: calc(var(--mi) * 0.5);
  font-size: calc(var(--base-fs) * 23);
  text-align: left;
}
section#billboard .tagline {
  width: -moz-fit-content;
  width: fit-content;
  padding-left: 0.5ic;
  text-indent: -0.5ic;
  font-size: calc(var(--base-fs) * 63);
  line-height: 1.25;
  font-weight: 900;
  letter-spacing: 0.08ic;
}
section#billboard .cta {
  width: -moz-fit-content;
  width: fit-content;
}
section#billboard .cta .lead {
  --bg: var(--accent);
  width: -moz-fit-content;
  width: fit-content;
  padding-block: 0.3lh;
  padding-inline: 3ic;
  border-radius: 10lh;
  background: var(--bg);
  margin-bottom: min(var(--mw), calc(var(--m) * 2));
  font-size: calc(var(--base-fs) * 23);
  letter-spacing: 0.1ic;
  position: relative;
}
section#billboard .cta .lead::after {
  display: block;
  width: min(1.82vw, 23px);
  height: min(1.58vw, 20px);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%);
          clip-path: polygon(0 0, 100% 0, 100% 100%);
  background: var(--bg);
  position: absolute;
  top: calc(100% - 1px);
  left: min(7.14vw, 90px);
}
section#billboard .cta .container {
  -moz-column-gap: var(--mi);
       column-gap: var(--mi);
}
section#billboard .cta .container :is(a, button) {
  --fs: calc(var(--base-fs) * 21);
  --padding-block: 0.3lh;
  flex-shrink: 1;
  width: 50%;
}
section#billboard .cta .container :is(a, button)::after {
  display: none;
}
section#billboard .cta .container .nav-tryout {
  box-shadow: 0 0 calc(var(--mi) * 3) 0 rgba(14, 56, 112, 0.4), 0 0 calc(var(--mi) * 3) var(--mb) rgba(255, 255, 255, 0.5);
}
section#billboard .note {
  font-size: calc(var(--base-fs) * 12);
  position: absolute;
  bottom: var(--mi);
  left: var(--padding-inline);
}
section#billboard .image {
  width: min(49.6vw, 625px);
  position: absolute;
  top: min(5.71vw, 72px);
  right: calc(-1 * min(10.15vw, 128px));
  z-index: 1;
}
section#billboard .slideshow,
section#billboard .slideshow-board {
  width: min(26.19vw, 330px);
  position: absolute;
  top: 0;
  left: min(56.58vw, 713px);
}
section#billboard .slideshow {
  z-index: 10;
}
section#billboard .slideshow .scene {
  width: -moz-max-content;
  width: max-content;
  padding-block: calc(var(--m) * 1.5);
  position: absolute;
  top: 0;
  left: 0;
}
section#billboard .slideshow .title {
  margin-left: calc(var(--mi) * 1.5);
  font-size: calc(var(--base-fs) * 15);
}
section#billboard .slideshow .title span {
  margin-right: 0.5ic;
  color: var(--dark-sky-gray);
}
section#billboard .slideshow .group {
  margin-top: calc(var(--m) * 2);
}
section#billboard .slideshow .talk {
  --avatar-size: min(4.36vw, 55px);
  --stamp-size: min(3.57vw, 45px);
  pointer-events: none;
  width: -moz-fit-content;
  width: fit-content;
  padding-block: calc(var(--m) * 0.5);
  padding-inline: calc(var(--mi) * 2);
  margin-left: calc(var(--mi) * 3);
  border-radius: calc(var(--mi) * 1.5);
  background: var(--white);
  box-shadow: 0 8px calc(var(--mb) * 4) 0 rgba(14, 56, 112, 0.3);
  line-height: 1.5;
  position: relative;
}
section#billboard .slideshow .talk:not(:last-child) {
  margin-bottom: calc(var(--m) * 2);
}
section#billboard .slideshow .talk:nth-child(2) {
  margin-left: calc(var(--mi) * 6);
}
section#billboard .slideshow .avatar {
  width: var(--avatar-size);
  height: var(--avatar-size);
  border-radius: 10lh;
  -o-object-fit: cover;
     object-fit: cover;
  border: 2px solid var(--white);
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-50%, -30%);
}
section#billboard .slideshow img.company {
  height: 0.8lh;
  -o-object-fit: contain;
     object-fit: contain;
  position: absolute;
  bottom: 100%;
  left: calc(var(--mi) * 2);
  transform: translateY(-0.2lh);
  font-size: calc(var(--base-fs) * 12);
}
section#billboard .slideshow .name {
  font-size: calc(var(--base-fs) * 12);
  color: var(--sky);
}
section#billboard .slideshow .name > img.company {
  display: inline;
  max-height: 0.8lh;
  margin-inline: 0.25ic;
  vertical-align: top;
}
section#billboard .slideshow .message {
  font-size: calc(var(--base-fs) * 15);
}
section#billboard .slideshow .stamp {
  width: var(--stamp-size);
  height: var(--stamp-size);
  padding: min(0.71vw, 9px);
  border-radius: var(--radius1st);
  background: var(--white);
  box-shadow: 0 0 var(--mb) 0 rgba(14, 56, 112, 0.3);
  position: absolute;
  top: 30%;
  left: 95%;
}
section#billboard .slideshow .stamp > img {
  -o-object-fit: cover;
     object-fit: cover;
}
section#billboard .slideshow-board {
  z-index: 0;
}
.slideshow .scene {
  transition: 0.5s 0s ease;
}
.slideshow .scene .title {
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}
.slideshow .scene .title::before {
  display: block;
  height: 100%;
  background: var(--navy);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}
.slideshow .scene .title p {
  position: relative;
  z-index: 0;
  transition: 0.3s 0.6s ease;
}
.slideshow .scene .talk:is(#scene1-talk1) {
  transition: transform 0.5s 1.1s ease, opacity 0.2s 1.4s ease;
}
.slideshow .scene .talk:is(#scene1-talk1) .stamp {
  transition: transform 0.2s 1.9s ease-in, opacity 0.1s 2s ease;
}
.slideshow .scene .talk:is(#scene1-talk2) {
  transition: transform 0.5s 2.3s ease, opacity 0.2s 2.6s ease;
}
.slideshow .scene .talk:is(#scene1-talk2) .stamp {
  transition: transform 0.2s 3.1s ease-in, opacity 0.1s 3.2s ease;
}
.slideshow .scene .talk:is(#scene1-talk3) {
  transition: transform 0.5s 3.3s ease, opacity 0.2s 3.6s ease;
}
.slideshow .scene .talk:is(#scene1-talk3) .stamp {
  transition: transform 0.2s 4.1s ease-in, opacity 0.1s 4.2s ease;
}
.slideshow .scene .talk:is(#scene2-talk1) {
  transition: transform 0.5s 1.5s ease, opacity 0.2s 1.8s ease;
}
.slideshow .scene .talk:is(#scene2-talk1) .stamp {
  transition: transform 0.2s 2.3s ease-in, opacity 0.1s 2.4s ease;
}
.slideshow .scene .talk:is(#scene2-talk2) {
  transition: transform 0.5s 2.4s ease, opacity 0.2s 2.7s ease;
}
.slideshow .scene .talk:is(#scene2-talk2) .stamp {
  transition: transform 0.2s 3.2s ease-in, opacity 0.1s 3.3s ease;
}
.slideshow .scene .talk:is(#scene2-talk3) {
  transition: transform 0.5s 2.8s ease, opacity 0.2s 3.1s ease;
}
.slideshow .scene .talk:is(#scene2-talk3) .stamp {
  transition: transform 0.2s 3.6s ease-in, opacity 0.1s 3.7s ease;
}
.slideshow .scene .talk:is(#scene3-talk1) {
  transition: transform 0.5s 1s ease, opacity 0.2s 1.3s ease;
}
.slideshow .scene .talk:is(#scene3-talk1) .stamp {
  transition: transform 0.2s 1.8s ease-in, opacity 0.1s 1.9s ease;
}
.slideshow .scene .talk:is(#scene3-talk2) {
  transition: transform 0.5s 2s ease, opacity 0.2s 2.3s ease;
}
.slideshow .scene .talk:is(#scene3-talk2) .stamp {
  transition: transform 0.2s 2.8s ease-in, opacity 0.1s 2.9s ease;
}
.slideshow .scene .talk:is(#scene3-talk3) {
  transition: transform 0.5s 2.2s ease, opacity 0.2s 2.5s ease;
}
.slideshow .scene .talk:is(#scene3-talk3) .stamp {
  transition: transform 0.2s 3s ease-in, opacity 0.1s 3.1s ease;
}
.slideshow .scene:not(.is_active) {
  z-index: -1;
  opacity: 0;
}
.slideshow .scene:not(.is_active) .title p {
  opacity: 0;
}
.slideshow .scene:not(.is_active) .talk {
  opacity: 0;
  transform: translateX(50%);
}
.slideshow .scene:not(.is_active) .stamp {
  opacity: 0;
  transform: scale(1.2) translate(20%, -10%);
}
.slideshow .scene:is(.is_active) {
  z-index: 10;
  opacity: 1;
}
.slideshow .scene:is(.is_active) .title p {
  opacity: 1;
}
.slideshow .scene:is(.is_active) .title::before {
  animation: scene_title 0.3s 0.5s ease-out forwards;
}
.slideshow .scene:is(.is_active) .talk {
  opacity: 1;
  transform: translateX(0);
}
.slideshow .scene:is(.is_active) .stamp {
  opacity: 1;
  transform: scale(1) translate(0%, 0%);
}
@keyframes scene_title {
  0% {
    width: 0%;
  }
  40%,
  65% {
    width: 100%;
  }
  100% {
    width: 0%;
  }
}
section#customers {
  --bg: var(--white);
  padding-block: min(1.66vw, 21px);
  display: flex;
  flex-direction: column;
  row-gap: min(1.19vw, 15px);
  pointer-events: none;
}
section#customers .swiper-container {
  --swiper-wrapper-transition-timing-function: linear;
  padding: 0;
  overflow-x: clip;
  align-items: center;
}
section#customers .swiper-wrapper {
  width: 100svw;
}
section#customers .swiper-slide {
  min-width: min(19.04vw, 240px);
  height: min(4.36vw, 55px);
  display: flex;
  align-items: center;
  justify-content: center;
}
section#customers .swiper-slide img {
  width: auto !important;
  height: auto;
  max-width: min(19.04vw, 240px);
  max-height: min(4.36vw, 55px);
  -o-object-fit: contain;
     object-fit: contain;
}
section#case .wrap {
  padding-block: calc(var(--mb) * 3) 0;
}
section#case .swiper-container {
  --swiper-container-margin-bottom: calc(var(--mb) * 6);
  --swiper-btn-offset: calc(100% - calc(var(--mi) * 6));
}
section#case .swiper {
  overflow: visible;
}
section#case .swiper-slide {
  align-self: stretch;
  height: auto;
  padding-block: calc(var(--mb) * 3);
  padding-inline: calc(var(--mi) * 3);
  border-radius: var(--radius1st);
  background: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: calc(var(--m) * 2);
}
section#case .logo {
  height: min(9.52vw, 60px);
}
section#case .title {
  padding-inline: 0.25ic;
  line-height: 1.5;
  text-align: center;
}
section#case .title span {
  padding-block: 0.125lh;
  background: var(--navy);
  color: var(--white);
  word-break: auto-phrase;
}
section#billboard + section#description,
section#case + section#description {
  --bg: var(--white);
}
section#description .swiper-container {
  --swiper-btn-offset: calc(100% - calc(var(--mi) * 2));
  padding-inline: calc(var(--mi) * 6);
}
section#description .swiper {
  border-radius: var(--radius1st);
}
section#description + section#assignment .wrap {
  padding-top: 0;
}
section#assignment {
  --bg: var(--white);
  counter-reset: problem 1;
}
section#assignment .wrap {
  padding-top: calc(var(--mb) * 12);
  padding-bottom: 0;
}
section#assignment .heading {
  margin-bottom: calc(-1 * calc(var(--mb) * 4));
}
section#assignment .heading .subline,
section#assignment .heading .headline {
  text-align: left;
}
section#assignment .heading .subline {
  font-size: calc(var(--base-fs) * 27);
  color: var(--sky);
}
section#assignment .heading .headline {
  margin-block: 0;
}
section#assignment .caption {
  width: 100%;
  margin-block: calc(var(--mb) * 10) calc(var(--mb) * 6);
  font-size: calc(var(--base-fs) * 21);
  position: relative;
  z-index: 10;
}
section#assignment .caption span {
  display: block;
  font-size: calc(var(--base-fs) * 18);
  color: var(--sky-gray);
}
section#assignment .container {
  --row-gap: var(--mb);
  counter-increment: problem 1;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: var(--row-gap);
  position: relative;
  z-index: 0;
}
section#assignment .container::after {
  display: block;
  width: calc(100vw - (100vw - 100%) / 3);
  height: calc(100% + calc(var(--mb) * 6));
  border-radius: 20px;
  background: var(--root-bg);
  position: absolute;
  top: calc(-1 * calc(var(--mb) * 3));
  z-index: -1;
}
section#assignment .container:not(#problem2)::after {
  left: 0;
  transform: translateX(-33%);
}
section#assignment .container:is(#problem2)::after {
  right: 0;
  transform: translateX(33%);
}
section#assignment .block {
  --avatar-size: min(11.11vw, 140px);
  width: min(43.65vw, 550px);
  height: -moz-fit-content;
  height: fit-content;
  border-radius: 10lh calc(var(--m) * 3) calc(var(--m) * 3) 10lh;
  background: var(--white);
  box-shadow: 0 8px calc(var(--m) * 3) calc(-1 * var(--m)) rgba(14, 56, 112, 0.4);
  position: relative;
}
section#assignment .block:nth-child(odd) {
  margin-top: calc(-1 * var(--mb));
}
section#assignment .block:nth-child(even) {
  margin-top: calc(var(--mb) * 7);
}
section#assignment .avatar {
  flex-shrink: 0;
  width: var(--avatar-size);
  height: 100%;
  border-radius: 10lh 0 0 10lh;
  overflow: hidden;
  position: absolute;
}
section#assignment .avatar img {
  width: 15.87vw;
  max-width: 200px;
  position: absolute;
  top: var(--mi);
  left: 50%;
  transform: translateX(-45%);
}
section#assignment .message {
  margin-left: var(--avatar-size);
  margin-block: calc(var(--m) * 1.5);
  border-left: 1px solid var(--sky-gray);
  padding-block: var(--m);
  padding-inline: calc(var(--mi) * 2) calc(var(--mi) * 1.5);
}
section#assignment .message .title {
  margin-bottom: calc(var(--mb) * 1.5);
  color: var(--sky);
  font-size: calc(var(--base-fs) * 21);
}
section#assignment .message p {
  font-size: calc(var(--base-fs) * 15);
  letter-spacing: 0;
}
section#assignment .name {
  padding-inline: 1ic;
  border-radius: 10lh;
  background: var(--dark-sky);
  font-size: calc(var(--base-fs) * 15);
  color: var(--navy);
  position: absolute;
  bottom: var(--mb);
  left: calc(var(--avatar-size) / 2);
  transform: translateX(-50%);
}
section#solution {
  --bg: var(--white);
  margin-top: calc(-1 * calc(var(--mb) * 2));
}
section#solution .wrap {
  padding-inline: calc(var(--mi) * 10);
  padding-bottom: calc(var(--mb) * 3);
  position: relative;
}
section#solution .headline {
  font-size: calc(var(--base-fs) * 36);
  line-height: 1.75;
  text-align: left;
}
section#solution .headline span {
  display: block;
}
section#solution .headline span:nth-child(2) {
  margin-left: 2ic;
}
section#solution .headline span:nth-child(3) {
  margin-top: 0.2lh;
  margin-left: 4ic;
}
section#solution .headline [src*="logo-link"] {
  max-height: 1lh;
}
section#solution .image {
  width: min(42.85vw, 540px);
  aspect-ratio: 1 / 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(calc(var(--mi) * 3), calc(-50% - calc(var(--mb) * 3)));
}
section#solution section.cta {
  padding-block: calc(var(--m) * 2) calc(var(--m) * 6);
}
section#feature .headline {
  margin-bottom: calc(var(--mb) * 7);
}
section#feature .note {
  font-size: calc(var(--base-fs) * 13.5);
  font-weight: var(--weight-regular);
}
section#feature .points:where(.container) .block {
  --image-size: min(12.3vw, 155px);
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
section#feature .points:where(.container) .block .image {
  flex-shrink: 0;
  width: var(--image-size);
  border-radius: var(--radius) 0 0 0;
}
section#feature .points:where(.container) .block .title {
  width: calc(100% - var(--image-size));
  border-radius: 0 var(--radius) 0 0;
}
section#feature .points:where(.container) .block .lead,
section#feature .points:where(.container) .block .nav-modal {
  width: 100%;
  flex-shrink: 0;
}
section#feature .points:where(.container) .block .lead {
  padding: calc(var(--mb) * 1.5) calc(var(--mi) * 2);
  background: var(--white);
}
section#feature .points:where(.container) .block .nav-asset {
  --padding-block: 9px;
  --padding-inline: 21px;
  --bg: var(--white);
  --color: var(--navy);
  --hover: var(--navy);
  --hover-bg: var(--dark-sky);
  box-shadow: 0 0 var(--m) 0 rgba(14, 56, 112, 0.3);
  position: absolute;
  top: 0;
  right: calc(-1 * calc(var(--mi) * 3));
  transform: translateY(-50%);
}
section#feature .points:where(.container) .block .nav-asset [src*="logo-asset.svg"] {
  width: min(10.31vw, 130px);
}
section#feature .modal .container {
  --column-gap: calc(var(--mi) * 5);
  flex-wrap: wrap;
  align-items: flex-start;
  gap: calc(var(--mb) * 4) var(--column-gap);
}
section#feature .modal .block {
  --block-column-gap: calc(var(--mi) * 2);
  width: calc((100% - var(--column-gap)) / 2);
  display: flex;
  flex-wrap: wrap;
  -moz-column-gap: var(--block-column-gap);
       column-gap: var(--block-column-gap);
}
section#feature .modal .block .caption + p {
  margin-left: 1.5ic;
  font-weight: var(--weight-regular);
}
section#feature .modal h5 {
  margin-left: 1.25ic;
  border-left: 4px solid var(--sky);
  padding-left: 0.5ic;
  line-height: 1.5;
}
section#feature .modal img {
  -o-object-fit: contain;
     object-fit: contain;
}
section#feature .modal img.qrcode {
  width: 120px;
}
section#feature .modal .notice {
  border-radius: var(--radius1st);
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: calc(var(--mi) * 2);
       column-gap: calc(var(--mi) * 2);
}
section#feature .modal:is(#modal-feature-aggregation) .block:first-child .note {
  margin-inline: auto;
}
section#feature .modal:is(#modal-feature-aggregation) .block:last-child {
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  -moz-column-gap: calc(var(--mi) * 6);
       column-gap: calc(var(--mi) * 6);
}
section#feature .modal:is(#modal-feature-aggregation) .box {
  margin-top: calc(var(--mb) * 2);
  display: grid;
  grid-template-columns: 1fr min(5.95vw, 75px);
  -moz-column-gap: calc(var(--mi) * 2);
       column-gap: calc(var(--mi) * 2);
}
section#feature .modal:is(#modal-feature-aggregation) .icon {
  grid-row: 1 / 3;
  grid-column: 2 / 3;
}
section#feature .modal:is(#modal-feature-aggregation) .notice {
  margin-top: calc(var(--mb) * 2);
  margin-inline: 0;
}
section#feature .modal:is(#modal-feature-system) .block:is(:first-child, :last-child) {
  width: 100%;
}
section#feature .modal:is(#modal-feature-system) .box {
  width: calc((100% - var(--block-column-gap)) / 2);
}
section#feature .modal:is(#modal-feature-system) .block:last-child .caption {
  width: -moz-fit-content;
  width: fit-content;
  flex-shrink: 1;
}
section#feature .modal:is(#modal-feature-updates) .container {
  --column-gap: calc(var(--mi) * 2);
}
section#feature .modal:is(#modal-feature-updates) .block {
  width: calc((60% - var(--column-gap)) / 2);
}
section#feature .modal:is(#modal-feature-updates) .block:last-child {
  width: calc(40% - var(--column-gap));
}
section#feature .modal:is(#modal-feature-updates) .box {
  width: 100%;
  display: flex;
}
section#feature .modal:is(#modal-feature-updates) .caption {
  flex-shrink: 0;
  width: 70%;
}
section#feature .modal:is(#modal-feature-updates) .icon {
  width: min(4.76vw, 60px);
}
section#feature .modal:is(#modal-feature-updates) .image {
  width: min(19.04vw, 240px);
}
section#disaster {
  --wrap-padding-inline: calc(var(--mi) * 4);
}
section#disaster .wrap {
  padding-top: 0;
}
section#disaster .inner {
  padding-block: calc(var(--mb) * 5) calc(var(--mb) * 2);
  padding-inline: calc(var(--mi) * 4);
  background: var(--lemon);
  border-radius: var(--radius1st);
}
section#disaster .headline {
  margin-top: 0;
  font-size: calc(var(--base-fs) * 36);
  text-align: left;
  display: flex;
  align-items: center;
}
section#disaster .headline::after {
  flex-grow: 1;
  display: block;
  height: 0.25lh;
  background: repeating-linear-gradient(-45deg, transparent, transparent 7px, var(--navy) 7px, var(--navy) 13px);
  margin-left: calc(var(--mi) * 2);
}
section#disaster .container {
  margin-top: calc(var(--m) * 5);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(var(--mb) * 6) calc(var(--mi) * 2);
}
section#disaster .block {
  --radius: var(--mi);
  --image-size: min(9.52vw, 120px);
  padding-bottom: var(--mb);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: inset 0 0 0 1px var(--navy);
  margin-left: calc(var(--mi) * 2);
  position: relative;
}
section#disaster .block:first-child {
  grid-row: 1 / 3;
  grid-column: 1 / 2;
}
section#disaster .block .image {
  width: var(--image-size);
  height: var(--image-size);
  position: absolute;
  top: calc(-1 * calc(var(--m) * 2));
  left: calc(-1 * calc(var(--m) * 2));
}
section#disaster .block .title {
  padding-block: calc(var(--m) * 1.5);
  padding-left: var(--image-size);
  padding-right: calc(var(--mi) * 2);
  border-radius: var(--radius) var(--radius) 0 0;
  background: var(--dark-gray);
  margin-bottom: calc(var(--mb) * 2);
  font-size: calc(var(--base-fs) * 24);
  color: var(--white);
}
section#disaster .block .summary {
  margin-block: var(--mb);
  margin-inline: calc(var(--mi) * 2);
  font-size: calc(var(--base-fs) * 21);
  line-height: 1.5;
  color: var(--navy);
  display: flex;
  align-items: center;
  -moz-column-gap: var(--mi);
       column-gap: var(--mi);
}
section#disaster .block .icon {
  width: min(3.96vw, 50px);
  -o-object-fit: contain;
     object-fit: contain;
}
section#disaster .nav-download {
  --fs: calc(var(--base-fs) * 21);
  --bg: var(--white);
  padding-block: 12px;
  margin-top: calc(var(--mb) * 4);
  margin-inline: auto;
}
section#disaster .note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
section#interview .swiper-container {
  --swiper-container-margin-bottom: calc(var(--mb) * 6);
}
section#interview .swiper {
  overflow: visible;
}
section#interview .swiper-wrapper {
  display: flex;
}
section#interview .swiper-slide {
  align-self: stretch;
  height: auto;
  min-height: min(39.68vw, 500px);
  padding-bottom: calc(var(--mb) * 2);
  border-radius: var(--radius1st);
  background: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
}
section#interview .thumbnail {
  border-radius: var(--radius1st) var(--radius1st) 0 0;
}
section#interview .name {
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1ic;
  background: var(--sky);
  color: var(--white);
  font-size: calc(var(--base-fs) * 18);
  transform: translateY(-50%);
}
section#interview .title,
section#interview p {
  max-width: 100%;
  padding-inline: calc(var(--mi) * 3);
}
section#interview .title {
  margin-block: var(--mb);
}
section#interview p {
  margin-bottom: calc(var(--mb) * 3);
}
section#interview .nav-more {
  margin-top: auto;
}
section#news {
  --bg: var(--white);
}
section#news .headline {
  margin-top: 0;
}
section#news .swiper-container {
  --swiper-container-margin-bottom: calc(var(--mb) * 6);
}
section#news .swiper {
  overflow: visible;
}
section#news .block {
  --margin-inline: var(--mi);
  --color: var(--navy);
  padding-bottom: calc(var(--mb) * 0.5);
  border-radius: var(--radius1st);
  background: var(--white);
  display: flex;
  flex-direction: column;
  transition: color 0.5s 0s ease;
}
@media (hover: hover) {
  section#news .block:hover {
    --color: var(--sky);
  }
}
section#news .thumbnail {
  flex-shrink: 0;
}
section#news .thumbnail img {
  aspect-ratio: 16 / 9;
}
section#news .properties {
  padding-top: calc(var(--mb) * 2);
  display: flex;
  justify-content: space-between;
}
section#news .category {
  padding-inline: var(--margin-inline);
  border-radius: 0 var(--radius2nd) var(--radius2nd) 0;
  background: var(--category-color);
  color: var(--white);
}
section#news .date {
  padding-inline: var(--margin-inline);
  color: var(--sky-gray);
}
section#news .title {
  flex-grow: 1;
  min-height: 2lh;
  margin-block: calc(var(--mb) * 2);
  padding-inline: var(--margin-inline);
  border-radius: 0 0 var(--radius) var(--radius);
  font-size: calc(var(--base-fs) * 18);
  color: var(--color);
}
section#service {
  --radius: var(--radius1st);
  text-align: center;
}
section#service .nav-modal {
  --fs: calc(var(--base-fs) * 18);
  margin-inline: auto;
  text-decoration: underline;
}
section#service .price,
section#service .bonus {
  width: min(66.66vw, 840px);
  padding: calc(var(--mb) * 3) calc(var(--mi) * 4);
  margin-inline: auto;
}
section#service .price {
  border-radius: var(--radius) var(--radius) 0 0;
  background: var(--white);
}
section#service .price .heading {
  font-size: calc(var(--base-fs) * 36);
}
section#service .price .heading span {
  font-size: calc(var(--base-fs) * 45);
}
section#service .price .heading strong {
  padding-inline: 0.25ic;
  margin-inline: 0.25ic;
  font-size: calc(var(--base-fs) * 78);
  color: var(--sky);
}
section#service .price .condition {
  margin-block: calc(var(--mb) * 3) calc(var(--mb) * 4);
  background: var(--pale-sky);
  font-size: calc(var(--base-fs) * 30);
}
section#service .price p:not([class]) {
  font-size: calc(var(--base-fs) * 15);
  color: var(--dark-sky-gray);
}
section#service .price p.lead {
  font-size: calc(var(--base-fs) * 21);
}
section#service .price .nav-modal {
  margin-top: calc(var(--mb) * 3);
}
section#service .bonus {
  border-radius: 0 0 var(--radius) var(--radius);
  background: #c8d9ef;
  font-size: calc(var(--base-fs) * 18);
}
section#service .bonus .nav-modal {
  margin-top: calc(var(--mb) * 2);
}
section#service .bonus + .nav-modal {
  margin-top: calc(var(--mb) * 2);
}
section#service .modal .inner {
  width: -moz-max-content;
  width: max-content;
  padding-block: calc(var(--mb) * 3);
}
section#service .modal .block {
  width: min(57.14vw, 800px);
}
section#service .modal .title {
  font-size: calc(var(--base-fs) * 30);
}
section#service .modal * + .caption {
  margin-top: calc(var(--mb) * 3);
}
section#service .modal .image {
  width: 62.5%;
  margin-inline: auto;
}
section#service .modal table {
  margin-top: calc(var(--mb) * 2);
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid var(--navy);
  border-radius: var(--radius1st);
  overflow: clip;
  margin-inline: auto;
  font-size: calc(var(--base-fs) * 18);
}
section#service .modal :is(th, td) {
  padding: var(--mb) var(--mi);
}
section#service .modal tr:not(:last-child) :is(th, td) {
  border-bottom: 1px solid var(--navy);
}
section#service .modal table#list-bonus {
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 21);
}
section#service .modal table#list-bonus tr.heading {
  font-size: calc(var(--base-fs) * 18);
}
section#service .modal table#list-bonus :is(th, td) {
  padding-inline: calc(var(--mi) * 3);
  vertical-align: middle;
}
section#service .modal table#list-bonus td {
  color: var(--white);
  background: var(--navy);
  border-color: var(--white);
}
section#service .modal table#list-bonus strong {
  font-size: calc(var(--base-fs) * 30);
}
section#device-account .combination {
  --gap: calc(var(--mi) * 8);
  margin-top: calc(var(--mb) * 4);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap);
  position: relative;
}
section#device-account .combination .block {
  align-self: stretch;
  width: min(29.52vw, 372px);
  padding: calc(var(--mb) * 4) calc(var(--mi) * 3);
  border-radius: var(--radius1st);
  background: var(--white);
  box-shadow: inset 0 0 0 6px var(--navy);
  text-align: center;
  font-size: calc(var(--base-fs) * 21);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
section#device-account .combination .block:first-child::before {
  display: block;
  content: "\2715";
  font-size: calc(var(--base-fs) * 54);
  font-weight: 900;
  position: absolute;
  top: 50%;
  left: calc(100% + var(--gap) / 2);
  transform: translate(-50%, -50%);
}
section#device-account .combination .image {
  width: min(11.9vw, 150px);
}
section#device-account .combination .title {
  margin-top: calc(var(--mb) * 3);
  height: 2lh;
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 42);
  line-height: 1.5;
  letter-spacing: 0;
  display: flex;
  align-items: center;
}
section#device-account .combination .block:last-child .title {
  letter-spacing: -0.1ic;
}
section#device-account .warning {
  margin-top: calc(var(--mb) * 8);
  padding: calc(var(--mb) * 6) calc(var(--mi) * 4) calc(var(--mb) * 3);
  border-radius: var(--radius2nd);
  background: var(--white);
  box-shadow: inset 0 0 0 2px var(--gray);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(var(--mb) * 3) calc(var(--mi) * 6);
  position: relative;
}
section#device-account .warning .icon {
  width: min(6.74vw, 85px);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}
section#device-account .warning .title {
  font-size: calc(var(--base-fs) * 36);
  text-align: center;
}
section#device-account .warning .text {
  flex-grow: 1;
  flex-shrink: 1;
  width: 50%;
  font-size: calc(var(--base-fs) * 21);
}
section#device-account .warning .image {
  flex-shrink: 0;
  width: min(26.19vw, 330px);
  margin-right: calc(var(--mi) * 4);
}
section#device-account .nav-modal {
  --fs: calc(var(--base-fs) * 18);
  margin-top: calc(var(--m) * 3);
  text-decoration: underline;
}
section#device-account .modal .container {
  --column-gap: calc(var(--mi) * 5);
  flex-wrap: wrap;
  align-items: flex-start;
  gap: calc(var(--mb) * 2) var(--column-gap);
}
section#device-account .modal .block {
  --block-column-gap: calc(var(--mi) * 2);
  width: calc((100% - var(--column-gap)) / 2);
  display: flex;
  flex-wrap: wrap;
  -moz-column-gap: var(--block-column-gap);
       column-gap: var(--block-column-gap);
}
section#device-account .modal .title {
  width: 100%;
  flex-shrink: 0;
}
section#device-account .modal .caption {
  flex-shrink: 1;
}
section#device-account .modal img {
  -o-object-fit: contain;
     object-fit: contain;
}
section#all-in-one .summaries:where(.container) {
  --gap: calc(var(--mi) * 6);
  gap: var(--gap);
}
section#all-in-one .summaries:where(.container) .block {
  text-align: center;
}
section#all-in-one .summaries:where(.container) .caption {
  margin-bottom: calc(var(--mb) * 3);
}
section#all-in-one .summaries:where(.container) .block:first-child {
  flex-shrink: 0;
  width: 60%;
}
section#all-in-one .summaries:where(.container) .block:last-child {
  width: calc(40% - var(--gap));
}
section#all-in-one .notice {
  margin-top: calc(var(--mb) * 5);
  background: var(--accent);
  font-size: calc(var(--base-fs) * 21);
}
section#all-in-one .points:where(.container) {
  margin-top: calc(var(--mb) * 8);
}
section#all-in-one .points:where(.container) .block {
  display: flex;
  flex-direction: column;
}
section#all-in-one .points:where(.container) .title {
  align-self: stretch;
  flex-grow: 1;
  border-radius: var(--radius) var(--radius) 0 0;
}
section#all-in-one .points:where(.container) .nav-modal {
  --bg: var(--white);
  width: 100%;
}
section#all-in-one .modal {
  --modal-inner-width: max-content;
}
section#all-in-one .modal .block {
  width: min(57.14vw, 800px);
}
section#all-in-one .modal .title {
  font-size: calc(var(--base-fs) * 30);
}
section#all-in-one .modal .caption {
  color: var(--sky);
}
section#difference .container {
  --gap: calc(var(--mi) * 2);
  gap: var(--gap);
}
section#difference .block {
  width: calc((100% - var(--gap) * 3) / 4);
  border-radius: var(--radius1st);
  background: var(--white);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
section#difference .title {
  align-self: stretch;
  height: 100%;
  padding-top: calc(var(--mb) * 3);
  padding-inline: calc(var(--mi) * 2);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
section#difference .image {
  width: min(9.52vw, 120px);
  margin-block: calc(var(--mb) * 2);
}
section#difference .nav-popup {
  --bg: var(--dark-sky);
  --color: var(--navy);
  --fs: calc(var(--base-fs) * 18);
  --radius: 0 0 var(--radius1st) var(--radius1st);
  margin-top: auto;
  width: 100%;
}
section#difference .popup {
  display: none;
  --close-color: var(--white);
  --close-hover: var(--sky);
  width: calc(var(--main-width) / 1.9);
  padding: calc(var(--mb) * 3) calc(var(--mi) * 3);
  border-radius: var(--radius1st);
  background: var(--navy);
  color: var(--white);
  position: absolute;
  top: 80%;
  z-index: 10;
}
section#difference .popup h4 {
  padding-bottom: var(--mb);
  border-bottom: 1px solid var(--gray);
  margin-bottom: var(--mb);
}
section#difference .popup * + h4 {
  margin-top: calc(var(--mb) * 2);
}
section#difference .popup ul ul {
  list-style-type: '- ';
}
section#difference .block.is_active .popup {
  display: block;
}
section#difference .block:nth-child(-n + 2) .popup {
  left: 10%;
}
section#difference .block:nth-last-child(-n + 2) .popup {
  right: 10%;
}
section#difference .block:nth-child(4) .popup .note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-bottom: 0;
}
section#step .subline {
  margin-bottom: calc(var(--mb) * 3);
  margin-inline: auto;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1ic;
  border-radius: 10lh;
  background: var(--white);
  font-size: calc(var(--base-fs) * 24);
  color: var(--sky);
}
section#step .steps {
  --gap: calc(var(--mi) * 6);
  margin-top: calc(var(--mb) * 6);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap);
}
section#step .steps .block {
  align-self: stretch;
  width: min(22.22vw, 280px);
  padding: calc(var(--mb) * 3) calc(var(--mi) * 2);
  border-radius: var(--radius1st);
  background: var(--navy);
  color: var(--white);
  text-align: center;
  position: relative;
}
section#step .steps .block:not(:last-child)::after {
  display: block;
  content: "\2026";
  font-size: calc(var(--base-fs) * 60);
  color: var(--navy);
  position: absolute;
  top: 50%;
  left: calc(100% + var(--gap) / 2);
  transform: translate(-50%, -50%);
}
section#step .steps .label {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-bottom: calc(var(--mb) * 2);
  font-size: calc(var(--base-fs) * 15);
  display: flex;
  flex-direction: column-reverse;
  row-gap: var(--mb);
}
section#step .steps .label span {
  --size: min(5.87vw, 74px);
  width: var(--size);
  height: var(--size);
  border-radius: 10lh;
  background: var(--white);
  font-size: calc(var(--base-fs) * 36);
  color: var(--navy);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
section#step .steps .label span::after {
  display: block;
  width: 10px;
  height: 9px;
  -webkit-clip-path: polygon(0 0, 100% 0, 50% 100%);
          clip-path: polygon(0 0, 100% 0, 50% 100%);
  background: var(--white);
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -2px);
}
section#step .steps .title {
  height: 2lh;
  font-size: calc(var(--base-fs) * 42);
  display: flex;
  justify-content: center;
  align-items: center;
}
section#expansion {
  padding-block: calc(var(--m) * 4) calc(var(--m) * 6);
  background: var(--white);
}
section#expansion .headline {
  display: flex;
  align-items: center;
  -moz-column-gap: calc(var(--mi) * 4);
       column-gap: calc(var(--mi) * 4);
}
section#expansion .headline::before,
section#expansion .headline::after {
  flex-grow: 1;
  display: block;
  height: 0.25lh;
  background: repeating-linear-gradient(-45deg, transparent, transparent 12px, var(--navy) 12px, var(--navy) 16px);
}
section#expansion .subline {
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 33);
}
section#expansion .phases {
  --padding-block: calc(var(--mb) * 3);
  --padding-inline: calc(var(--mi) * 4);
  padding: var(--padding-block) var(--padding-inline);
  border-radius: var(--radius1st);
  background: var(--white);
  position: relative;
  z-index: 0;
}
section#expansion .block {
  flex-grow: 1;
  flex-shrink: 0;
  width: 33.33%;
  padding-bottom: var(--mb);
}
section#expansion .block:not(:nth-of-type(3)) {
  border-right: 2px dashed var(--sky-gray);
}
section#expansion .block .icon {
  margin-top: var(--mb);
}
section#expansion .block ul {
  list-style: disc;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: calc(var(--mi) * 1.5) var(--mi);
  margin-inline: auto;
  letter-spacing: 0;
}
section#expansion .title {
  padding-block: var(--mb);
  background: var(--navy);
  -webkit-clip-path: polygon(0 0, calc(100% - 1lh) 0, 100% 50%, calc(100% - 1lh) 100%, 0 100%);
          clip-path: polygon(0 0, calc(100% - 1lh) 0, 100% 50%, calc(100% - 1lh) 100%, 0 100%);
  font-size: calc(var(--base-fs) * 30);
  color: var(--white);
  text-align: center;
  text-indent: -1lh;
}
section#expansion .icon {
  width: min(4.76vw, 60px);
  margin-inline: auto;
}
section#expansion .lead {
  margin-block: var(--mb);
  font-size: calc(var(--base-fs) * 21);
  line-height: 1.5;
  text-align: center;
}
section#expansion .background {
  width: calc(100% - var(--padding-inline) * 2);
  height: calc(100% - var(--padding-block) * 2);
  padding: var(--mb) calc(var(--mi) * 2);
  position: absolute;
  top: var(--padding-block);
  left: var(--padding-inline);
  z-index: -1;
  color: var(--sky);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
section#expansion .background::after {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--light-sky);
  -webkit-clip-path: polygon(0 100%, 33.33% 90%, 66.66% 70%, 100% 30%, 100% 100%);
          clip-path: polygon(0 100%, 33.33% 90%, 66.66% 70%, 100% 30%, 100% 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
section#expansion .background h3 {
  font-size: calc(var(--base-fs) * 21);
}
section#expansion .background .heading {
  font-size: calc(var(--base-fs) * 27);
  line-height: 1.5;
  display: flex;
  align-items: center;
}
section#security .wrap {
  padding-bottom: calc(var(--mb) * 8);
}
section#security .headline {
  font-size: calc(var(--base-fs) * 30);
  line-height: 2;
}
section#security .headline [src*="logo-link"] {
  max-height: 0.75lh;
}
section#security .container {
  --row-gap: calc(var(--m) * 4);
  --column-gap: calc(var(--mi) * 4);
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--row-gap) var(--column-gap);
}
section#security hr {
  --hr-color: var(--sky-gray);
  flex-shrink: 0;
  width: 100%;
}
section#security .block {
  width: calc((100% - var(--column-gap) * 2) / 3);
  padding: calc(var(--mb) * 2) calc(var(--mi) * 3);
  border-radius: var(--radius1st);
  background: var(--white);
  font-size: calc(var(--base-fs) * 18);
  text-align: center;
}
section#security .block:is(#isms) {
  flex-grow: 0;
  flex-shrink: 0;
  padding-inline: var(--mi);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  -moz-column-gap: var(--mi);
       column-gap: var(--mi);
}
section#security .block:is(#isms) p {
  font-size: calc(var(--base-fs) * 15);
}
section#security .block:is(#isms) .text {
  align-self: center;
}
section#security .block:is(#isms) .image {
  width: min(7.14vw, 90px);
}
section#security img[src*="icon-"] {
  display: block;
  max-height: 2lh;
  margin-inline: auto;
  margin-bottom: var(--mb);
  -o-object-fit: contain;
     object-fit: contain;
}
section#security .title {
  flex-shrink: 0;
  width: 100%;
  margin-bottom: calc(var(--mb) * 2);
  font-size: calc(var(--base-fs) * 21);
}
section#security .title + p {
  font-size: calc(var(--base-fs) * 15);
}
section#security .caption {
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 18);
  line-height: 1.5;
}
section#security img.image {
  -o-object-fit: contain;
     object-fit: contain;
}
section#security .notice {
  padding-inline: calc(var(--mi) * 2);
}
section#security .note {
  display: inline;
  font-size: calc(var(--base-fs) * 12);
  color: var(--dark-sky-gray);
}
section#security .sub:is(.block) {
  width: 20%;
  padding: calc(var(--mb) * 1.5) calc(var(--mi) * 2);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
section#security .sub:is(.block) .image {
  width: min(4.76vw, 60px);
}
section#security .sub:is(.block) .notice {
  font-size: calc(var(--base-fs) * 15);
}
section#asset {
  --bg: var(--white);
}
section#asset .wrap {
  padding-block: calc(var(--mb) * 10);
}
section#asset .nav-asset {
  display: block;
  width: min(80.95vw, 1020px);
  margin-inline: auto;
  --shadow: 0 0 calc(var(--m) * 8) calc(var(--m) * 2) rgba(14, 56, 112, 0.3);
}
section#asset .nav-asset::after {
  height: 80%;
  top: 55%;
}
section#asset .nav-asset .image {
  --bg: var(--navy);
  background: var(--bg);
  border-radius: var(--radius1st);
  overflow: clip;
}
section#asset .nav-asset .btn {
  --fs: calc(var(--base-fs) * 21);
  --padding-block: calc(var(--m) * 0.25);
  --padding-inline: 2.5ic;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -150%);
  z-index: 10;
}
@media (hover: hover) {
  section#asset .nav-asset {
    transition: 0.5s 0s ease;
  }
  section#asset .nav-asset .image {
    transition: var(--transition);
  }
  section#asset .nav-asset:hover {
    transform: scale(1.02);
    transition: background 0.3s 0s ease, transform 0.15s ease-out;
  }
  section#asset .nav-asset:hover .image,
  section#asset .nav-asset:hover .btn {
    --bg: var(--sky);
  }
}
#modal-download-form .inner {
  width: -moz-max-content;
  width: max-content;
}
#modal-download-form .modal-content {
  margin: 3% auto;
  text-align: left;
  width: 100%;
  padding: 20px 50px;
}
#modal-download-form .modal-content h2 {
  font-size: 30px;
  padding: 30px 0 0 0;
  text-align: center;
}
#modal-download-form .modal-content p {
  padding: 0 0 0 0;
}
#modal-download-form .modal-content p.lead {
  padding: 0 0 30px 0;
  text-align: center;
}
#modal-download-form label {
  font-weight: bold;
  display: block;
  font-size: 16px;
  line-height: 20px;
  vertical-align: middle;
  margin: 1rem 0 7px 0;
}
#modal-download-form label .modal__form-required-text {
  background: var(--red);
  color: var(--white);
  font-size: 12px;
  line-height: 16px;
  display: inline-block;
  padding: 0 7px;
  border-radius: 5px;
  vertical-align: middle;
  margin-right: 7px;
}
#modal-download-form label .modal__form-optional-text {
  background: var(--gray);
  color: var(--white);
  font-size: 12px;
  line-height: 16px;
  display: inline-block;
  padding: 0 7px;
  border-radius: 5px;
  vertical-align: middle;
  margin-right: 7px;
}
#modal-download-form label.modal__form-label {
  padding-top: 1rem;
}
#modal-download-form input,
#modal-download-form select,
#modal-download-form textarea {
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #ccc;
}
#modal-download-form input#hospital_name,
#modal-download-form input#email,
#modal-download-form input#phone,
#modal-download-form textarea {
  width: 100%;
}
#modal-download-form input#first_name {
  width: 47.5%;
  margin-right: 5%;
}
#modal-download-form input#last_name {
  width: 47.5%;
}
#modal-download-form .modal__form-checkbox {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 12px 18px 10px 18px;
}
#modal-download-form .modal__btn-container {
  padding: 1rem 0;
}
#modal-download-form button.nav-submit {
  --width: calc(var(--m) * 20);
  --bg: var(--sky);
  --color: var(--white);
  --fs: calc(var(--base-fs) * 21);
  margin-inline: auto;
}
#modal-download-form .modal__message {
  font-size: 75%;
}
#modal-download-form .modal__submit_warning {
  visibility: hidden;
  margin-top: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: red;
}
#modal-download-form .modal__submit_warning.is_active {
  visibility: visible;
}
#modal-download-form .modal__submit_warning::before {
  display: flex;
  justify-content: center;
  align-items: center;
  content: "!";
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background: red;
  color: white;
}
#modal-download-form .vmp4v3h {
  visibility: visible;
}
#modal-download-form .modal__checkbox {
  margin-right: 0.5ic;
}
/* ==================================================================
	* News List *
================================================================== */
body.archive .list:is(.container) {
  flex-direction: column;
  row-gap: calc(var(--mb) * 6);
}
body.archive .block {
  --color: var(--navy);
  width: 100%;
  display: flex;
  transition: 0.5s 0s ease;
}
body.archive .block:where(.shadow)::after {
  transition: 0.3s 0s ease, border-radius 0.5s 0s ease, box-shadow 0.5s 0s ease;
}
@media (hover: hover) {
  body.archive .block:hover {
    --color: var(--sky);
    box-shadow: inset 0 0 2px 0 var(--white);
    transform: scale(1.02);
  }
  body.archive .block:hover:where(.shadow)::after {
    width: 80%;
    height: 70%;
    border-radius: 50%;
    box-shadow: -5px 0 calc(var(--mb) * 8) var(--mb) rgba(14, 56, 112, 0.3);
  }
}
body.archive .thumbnail {
  width: 40%;
  border-radius: var(--radius1st) 0 0 var(--radius1st);
  padding-top: 24%;
  position: relative;
}
body.archive .thumbnail img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
body.archive .text {
  flex-grow: 1;
  width: 50%;
  padding-block: calc(var(--mb) * 3);
  padding-inline: calc(var(--mi) * 2);
  border-radius: 0 var(--radius1st) var(--radius1st) 0;
  background: var(--white);
  overflow: hidden;
  position: relative;
}
body.archive .nav-more {
  margin-top: var(--m);
  margin-left: auto;
}
body#news-list {
  --categories-list-width: min(15.87vw, 200px);
  --gap: calc(var(--mi) * 4);
}
body#news-list .list:is(.container) {
  position: relative;
}
body#news-list .category-list {
  width: var(--categories-list-width);
  position: absolute;
  top: 0;
  left: 0;
}
body#news-list .category-list .btn {
  --width: 100%;
  margin-bottom: var(--mb);
}
body#news-list .category-list .btn:not(.is_active) {
  --bg: rgba(192, 210, 232, 0.5);
  --color: var(--dark-sky-gray);
}
body#news-list .category-list .btn.is_active {
  pointer-events: none;
}
body#news-list .block {
  width: calc(100% - var(--categories-list-width) - var(--gap));
  margin-left: auto;
}
body#news-list .block:not(.is_active) {
  display: none;
}
body#news-list .category {
  width: -moz-fit-content;
  width: fit-content;
  padding-block: calc(var(--mb) * 0.5);
  padding-inline: var(--mi) calc(var(--mi) * 3);
  border-radius: 0 var(--radius2nd) var(--radius2nd) 0;
  background: var(--category-color);
  margin-left: calc(-1 * calc(var(--mi) * 2));
  color: var(--white);
}
body#news-list .date {
  margin-top: var(--mb);
  color: var(--gray);
}
body#news-list .title {
  color: var(--color);
}
body#interview-list .name {
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1ic;
  background: var(--sky);
  color: var(--white);
  font-size: calc(var(--base-fs) * 18);
}
body#interview-list .title,
body#interview-list .excerpt {
  color: var(--color);
}
body#interview-list .title {
  margin-block: var(--m);
}
/* ==================================================================
	* Page *
================================================================== */
body:is(#thank-you, #form-error) main.content .icon {
  width: min(10vw, 126px);
  margin-inline: auto;
}
body:is(#thank-you, #form-error) main.content p {
  text-align: center;
}
body:is(#thank-you, #form-error) main.content p.lead {
  margin-block: calc(var(--mb) * 4);
  color: var(--sky);
  font-size: calc(var(--base-fs) * 21);
}
body:is(#thank-you, #form-error) main.content a {
  margin-block: calc(var(--mb) * 3);
  margin-inline: auto;
}
/* ==================================================================
	* Single *
================================================================== */
/* ==================================================================
	* 404ページ *
================================================================== */
body#error404 {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
body#error404 .headline + p {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
  margin-bottom: calc(var(--m) * 6);
}
body#error404 .footer {
  margin-top: auto;
}