@charset "utf-8";
/*  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;
}
.inner:has(iframe[src*="youtube"]) {
  padding: 0;
}
.btn {
  --padding-block: 0.5lh;
  --arrow-size: 0.4lh;
}
.nav-list,
.nav-modal {
  --fs: calc(var(--base-fs) * 15);
}
.nav-list {
  --min-width: 80%;
}
.banner-movie {
  --image-size: 100%;
  --icon-size: 80px;
  --padding-block: calc(var(--m) * 1.5);
  --padding-inline: calc(var(--m) * 1.5);
  --radius: var(--radius1st);
  width: 90%;
  display: block;
}
.banner-movie .title {
  padding-block: calc(var(--mb) * 2);
  margin-bottom: calc(var(--mb) * 2);
  font-size: calc(var(--base-fs) * 24);
  text-align: center;
}
.wrap {
  --wrap-padding-block: calc(var(--m) * 3);
  --wrap-padding-inline: var(--margin-inline);
}
main.content {
  overflow-x: clip;
}
.headline {
  margin-block: calc(var(--m) * 2);
}
.headline:is(h2) {
  font-size: calc(var(--base-fs) * 30);
}
.headline:is(h3) {
  font-size: calc(var(--base-fs) * 24);
}
section > .lead,
section .wrap > .lead {
  text-align: left;
}
ul,
ol {
  -webkit-padding-start: 0.5ic;
          padding-inline-start: 0.5ic;
}
.notice {
  padding: calc(var(--m) * 2);
}
.shadow {
  --shadow: 0 0 calc(var(--m) * 2) 0 rgba(14, 56, 112, 0.3);
}
.points:where(.container) {
  --row-gap: calc(var(--m) * 4);
  --column-gap: calc(var(--m) * 2);
}
.points:where(.container) .block .title {
  padding-inline: var(--m);
  font-size: calc(var(--base-fs) * 16.5);
}
.points:where(.container) .block .label {
  font-size: calc(var(--base-fs) * 12);
}
.points:where(.container) .block .nav-modal {
  --fs: calc(var(--base-fs) * 15);
}
.modal .inner {
  margin-block: calc(var(--m) * 4) calc(var(--m) * 8);
  width: 90%;
  padding: calc(var(--m) * 2);
}
.modal .caption {
  font-size: calc(var(--base-fs) * 16.5);
}
.modal .close {
  color: var(--white);
  top: auto;
  bottom: 100%;
}
.popup {
  box-shadow: 0 6px calc(var(--m) * 5) calc(-1 * var(--m)) rgba(14, 56, 112, 0.6);
}
.popup .close {
  width: calc(var(--m) * 1.5);
  height: calc(var(--m) * 1.5);
  top: calc(var(--m) * 0.5);
  right: calc(var(--m) * 0.5);
}
.swiper-container {
  --swiper-btn-size: calc(var(--m) * 3);
  --swiper-btn-offset: 95%;
  --swiper-scrollbar-size: var(--m);
}
.swiper-button-next,
.swiper-button-prev {
  display: none;
}
.pagination .pager:is(.prev, .next) {
  width: -moz-fit-content;
  width: fit-content;
  border-radius: var(--radius1st);
}
:root {
  --base-fs: min(0.26vw, 0.1rem);
  --margin-inline: calc(var(--m) * 2);
}
/* ==================================================================
	* ヘッダー *
================================================================== */
body:has(.navigation.is_active) {
  overflow-y: clip;
}
.header.is_top {
  background: rgba(233, 244, 255, 0.6);
}
.header:has(.is_active) {
  background: var(--white);
}
.header .wrap {
  height: 100%;
  padding-block: 0;
  padding-inline: var(--m);
  justify-content: space-between;
}
.header .logo {
  width: 37.33vw;
}
.header .navigation {
  display: block;
  width: 100%;
  position: absolute;
  top: var(--header-height);
  left: 0;
}
.header .navigation:not(.is_active) {
  pointer-events: none;
  opacity: 0;
  z-index: -1;
}
.header .navigation:is(.is_active) {
  pointer-events: auto;
  opacity: 1;
  z-index: 1;
  height: calc(100svh - var(--header-height));
  background: rgba(8, 32, 64, 0.5);
}
.header nav {
  flex-direction: column;
  background: var(--white);
}
.header nav :is(a, button) {
  padding-block: calc(var(--m) * 0.5);
  font-size: calc(var(--base-fs) * 18);
}
.header nav.gnav {
  padding-inline: 0;
}
.header nav.gnav :is(a, button) {
  width: 100%;
  text-align: center;
}
.header nav.cta {
  padding-bottom: var(--m);
}
.header nav.cta .btn {
  --width: 80%;
  margin-block: var(--m);
}
.header .burger {
  --color: var(--navy);
  --weight: 3px;
  --size: 27px;
  width: var(--size);
  height: calc(var(--size) * 0.75);
  background: linear-gradient(to bottom, transparent, transparent calc(50% - var(--weight) / 2), var(--color) calc(50% - var(--weight) / 2), var(--color) calc(50% + var(--weight) / 2), transparent calc(50% + var(--weight) / 2), transparent);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.header .burger::before,
.header .burger::after {
  display: block;
  width: 100%;
  height: var(--weight);
  background: var(--color);
}
.header .navigation.is_active + .burger {
  background: transparent;
  position: relative;
}
.header .navigation.is_active + .burger::before,
.header .navigation.is_active + .burger::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center;
}
.header .navigation.is_active + .burger::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.header .navigation.is_active + .burger::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
/* ==================================================================
	* フッター *
================================================================== */
.footer {
  padding-bottom: var(--mb);
}
.footer .container {
  display: block;
}
.footer .profile {
  line-height: 2.5;
}
.footer .copyrights {
  margin-top: calc(var(--mb) * 5);
  display: block;
}
.footer .copyrights a {
  display: inline-block;
  margin-bottom: calc(var(--mb) * 2);
}
/* ==================================================================
	* CTA Section *
================================================================== */
section.cta {
  --btn-fs: calc(var(--base-fs) * 18);
  --btn-min-width: 100%;
  padding-block: calc(var(--m) * 2);
  padding-inline: var(--margin-inline);
  align-items: center;
  gap: calc(var(--m) * 2);
}
section.cta span[data-sal]:has(.btn) {
  width: 100%;
}
section.cta .lead {
  margin-bottom: 0;
  font-size: calc(var(--base-fs) * 24);
  line-height: 1.5;
}
section.cta .lead strong {
  font-size: calc(var(--base-fs) * 33);
}
/* ==================================================================
	* フロント *
================================================================== */
section#billboard .wrap {
  height: auto;
  padding-inline: 0;
  padding-bottom: var(--m);
}
section#billboard .heading {
  order: 1;
  margin-block: var(--mb);
  margin-inline: var(--m);
}
section#billboard .subline {
  margin-bottom: var(--mb);
  font-size: calc(var(--base-fs) * 12);
}
section#billboard .tagline {
  font-size: calc(var(--base-fs) * 33);
  font-weight: 700;
}
section#billboard .cta {
  order: 3;
  margin-top: auto;
  margin-inline: var(--m);
  padding-top: calc(var(--mb) * 2);
  width: auto;
}
section#billboard .cta .lead {
  width: 100%;
  padding-inline: 1.5ic;
  font-size: calc(var(--base-fs) * 15);
  letter-spacing: 0;
  text-align: center;
  margin-bottom: calc(var(--mb) * 3);
}
section#billboard .cta .lead::after {
  width: min(6.13vw, 23px);
  height: min(5.33vw, 20px);
  left: min(18.66vw, 70px);
}
section#billboard .cta .container :is(a, button) {
  --fs: calc(var(--base-fs) * 15);
  flex-grow: 1;
}
section#billboard .cta .container .nav-tryout {
  box-shadow: 0 0 calc(var(--m) * 2) calc(-1 * calc(var(--m) * 0.5)) rgba(14, 56, 112, 0.4);
}
section#billboard .note {
  position: static;
  order: 4;
  margin-top: calc(var(--mb) * 4);
  margin-inline: var(--m);
}
section#billboard .image {
  order: 2;
  margin-top: calc(var(--mb) * 14);
  width: 100%;
  position: static;
}
section#billboard .slideshow,
section#billboard .slideshow-board {
  width: min(64vw, 240px);
  top: min(37.33vw, 140px);
  left: var(--m);
}
section#billboard .slideshow .scene {
  padding-block: var(--m);
}
section#billboard .slideshow .title {
  font-size: calc(var(--base-fs) * 12);
}
section#billboard .slideshow .group {
  margin-top: calc(var(--m) * 1.5);
}
section#billboard .slideshow .talk {
  --avatar-size: 40px;
  --stamp-size: 40px;
  padding-inline: calc(var(--avatar-size) / 2) calc(var(--m) * 1.5);
  border-radius: var(--m);
  line-height: 1.25;
}
section#billboard .slideshow .name {
  font-size: calc(var(--base-fs) * 10);
}
section#billboard .slideshow .message {
  font-size: calc(var(--base-fs) * 11);
}
section#billboard .slideshow .stamp {
  padding: 6px;
  border-radius: var(--radius2nd);
}
section#customers {
  padding-block: calc(var(--m) * 0.5);
  row-gap: var(--m);
}
section#customers .swiper {
  width: 200%;
  margin-left: -50%;
}
section#customers .swiper-slide {
  min-width: 150px;
  height: 37px;
}
section#customers .swiper-slide img {
  max-width: 150px;
  max-height: 37px;
}
section#case .headline {
  font-size: calc(var(--base-fs) * 21);
}
section#case .swiper-container {
  --swiper-container-margin-bottom: calc(var(--m) * 8);
}
section#case .swiper-slide {
  padding-block: calc(var(--m) * 2);
  padding-inline: calc(var(--m) * 2);
  row-gap: var(--m);
}
section#case .logo {
  margin-bottom: var(--m);
}
section#case .title {
  padding-inline: 0;
  font-size: calc(var(--base-fs) * 18);
}
section#case .title span {
  padding-block: 0;
  word-break: normal;
}
section#case .text {
  font-size: calc(var(--base-fs) * 13.5);
}
section#description .wrap {
  padding-inline: var(--m);
  padding-bottom: 0;
}
section#description .swiper-container {
  --swiper-container-margin-bottom: calc(var(--m) * 6);
  padding-inline: 0;
}
section#description + section#assignment .wrap {
  padding-top: calc(var(--m) * 3);
}
section#assignment .wrap {
  padding-top: calc(var(--m) * 3);
}
section#assignment .heading .subline {
  font-size: calc(var(--base-fs) * 15);
  text-align: center;
}
section#assignment .heading .headline {
  width: calc(100% + var(--wrap-padding-inline) * 2);
  margin-inline: calc(-1 * var(--wrap-padding-inline));
  font-size: calc(var(--base-fs) * 27);
  text-align: center;
}
section#assignment .caption {
  font-size: calc(var(--base-fs) * 18);
  text-align: center;
}
section#assignment .caption::before {
  font-size: calc(var(--base-fs) * 15);
}
section#assignment .container .block {
  --avatar-size: min(37.33vw, 140px);
  width: 100%;
  border-radius: calc(var(--m) * 2);
}
section#assignment .container .block:nth-child(odd),
section#assignment .container .block:nth-child(even) {
  margin-top: calc(var(--mb) * 10);
}
section#assignment .container .block:first-child {
  margin-top: calc(var(--mb) * 6);
}
section#assignment .container .block .avatar {
  height: var(--avatar-size);
  border-radius: 10lh;
  left: 50%;
  transform: translate(-50%, -50%);
}
section#assignment .container .block .avatar img {
  width: auto;
}
section#assignment .container .block .message {
  margin-top: calc(var(--avatar-size) / 2);
  margin-bottom: 0;
  margin-left: 0;
  border-left: 0;
  padding: calc(var(--m) * 2);
}
section#assignment .container .block .message .title {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-size: calc(var(--base-fs) * 18);
}
section#assignment .container .block .message p {
  margin-top: var(--m);
  border-top: 1px solid var(--sky-gray);
  padding-top: var(--m);
}
section#assignment .container .block .name {
  min-width: 40%;
  text-align: center;
  bottom: auto;
  top: calc(var(--avatar-size) / 4 + var(--mi));
  left: 50%;
}
section#solution {
  margin-top: 0;
}
section#solution .wrap {
  padding-top: calc(var(--m) * 4);
  padding-inline: calc(var(--m) * 2);
  padding-bottom: calc(var(--m) * 10);
}
section#solution .headline {
  margin-block: 0;
  font-size: calc(var(--base-fs) * 24);
  position: relative;
  z-index: 1;
}
section#solution .headline span {
  text-shadow: 0 0 5px var(--white), 0 0 5px var(--white), 0 0 10px var(--white);
}
section#solution .headline span:nth-child(2) {
  margin-left: 1ic;
}
section#solution .headline span:nth-child(3) {
  margin-left: 2ic;
}
section#solution .image {
  width: 80%;
  top: auto;
  bottom: -5%;
  left: 35%;
  transform: none;
}
section#solution section.cta {
  padding-block: calc(var(--m) * 2) calc(var(--m) * 3);
}
section#feature .headline {
  margin-bottom: calc(var(--m) * 2);
}
section#feature .points:where(.container) .block {
  --image-size: 30%;
  width: 100%;
}
section#feature .points:where(.container) .block:nth-child(3) .title {
  padding-right: calc(var(--m) * 0.25);
}
section#feature .points:where(.container) .block .nav-asset {
  top: 0;
  right: calc(-1 * calc(var(--m) * 2));
  transform: translateY(-50%);
}
section#feature .points:where(.container) .block .nav-asset [src*="logo-asset.svg"] {
  width: 100px;
}
section#feature .modal .container {
  --column-gap: calc(var(--m) * 2);
  gap: calc(var(--m) * 2) var(--column-gap);
}
section#feature .modal .block {
  width: 100%;
}
section#feature .modal .notice {
  flex-direction: column;
  row-gap: 0;
}
section#feature .modal:is(#modal-feature-aggregation) .box {
  margin-top: calc(var(--m) * 2);
  grid-template-columns: 1fr 20%;
  -moz-column-gap: var(--m);
       column-gap: var(--m);
  row-gap: calc(var(--m) * 0.5);
}
section#feature .modal:is(#modal-feature-aggregation) .box .caption {
  grid-row: 1 / 2;
  grid-column: 1 / 3;
}
section#feature .modal:is(#modal-feature-aggregation) .icon {
  grid-row: 2 / 3;
  grid-column: 2 / 3;
}
section#feature .modal:is(#modal-feature-aggregation) .notice {
  margin-block: var(--m);
  margin-inline: auto;
}
section#feature .modal:is(#modal-feature-system) .box {
  margin-top: var(--m);
  width: 100%;
}
section#feature .modal:is(#modal-feature-system) .notice {
  margin-top: var(--m);
}
section#feature .modal:is(#modal-feature-updates) .block {
  width: 100%;
}
section#feature .modal:is(#modal-feature-updates) .block:last-child {
  width: 100%;
}
section#feature .modal:is(#modal-feature-updates) .box {
  justify-content: space-between;
}
section#feature .modal:is(#modal-feature-updates) .icon {
  width: 15%;
}
section#feature .modal:is(#modal-feature-updates) .image {
  width: 70%;
  margin-inline: auto;
}
section#disaster .wrap {
  padding-inline: var(--m);
}
section#disaster .inner {
  padding: calc(var(--m) * 2);
}
section#disaster .headline {
  display: block;
  font-size: calc(var(--base-fs) * 24);
  text-align: center;
  letter-spacing: 0;
}
section#disaster .headline::after {
  margin-top: var(--m);
  margin-left: 0;
  height: 0.5lh;
}
section#disaster .container {
  margin-top: calc(var(--m) * 2);
  display: flex;
  flex-direction: column;
  gap: calc(var(--m) * 2);
}
section#disaster .block {
  --radius: var(--radius1st);
  --image-size: min(24vw, 90px);
  margin-top: calc(var(--image-size) / 2);
  margin-left: 0;
}
section#disaster .block .image {
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}
section#disaster .block .title {
  padding-block: calc(var(--image-size) / 2 + var(--m)) var(--m);
  padding-inline: var(--m);
  font-size: calc(var(--base-fs) * 18);
  text-align: center;
}
section#disaster .block .summary {
  font-size: calc(var(--base-fs) * 15);
}
section#disaster .block .icon {
  width: min(13.33vw, 50px);
}
section#disaster .nav-download {
  --fs: calc(var(--base-fs) * 15);
  margin-top: calc(var(--mb) * 4);
  margin-inline: auto;
}
section#disaster .note {
  margin-right: auto;
  transform: translateY(50%);
}
section#interview .swiper-container {
  --swiper-container-margin-bottom: calc(var(--m) * 8);
}
section#interview .name {
  font-size: calc(var(--base-fs) * 15);
}
section#interview .title,
section#interview p {
  padding-inline: calc(var(--m) * 2);
}
section#interview .title {
  font-size: calc(var(--base-fs) * 18);
}
section#interview p {
  font-size: calc(var(--base-fs) * 12);
}
section#interview .nav-more {
  --width: calc(100% - calc(var(--m) * 2) * 2);
  --padding-block: 0.25lh;
}
section#news .headline {
  margin-top: calc(var(--m) * 2);
}
section#news .swiper-container {
  --swiper-container-margin-bottom: calc(var(--m) * 8);
}
section#news .shadow {
  width: 95%;
  top: 60%;
}
section#service .wrap {
  padding-bottom: calc(var(--m) * 3);
}
section#service .price,
section#service .bonus {
  width: 100%;
}
section#service .price {
  font-size: calc(var(--base-fs) * 15);
}
section#service .price .heading {
  font-size: calc(var(--base-fs) * 18);
  line-height: 1.5;
}
section#service .price .heading span {
  font-size: calc(var(--base-fs) * 21);
}
section#service .price .heading strong {
  font-size: calc(var(--base-fs) * 54);
}
section#service .price .condition {
  margin-block: calc(var(--m) * 2);
  width: 100%;
  padding: var(--m);
  font-size: calc(var(--base-fs) * 18);
}
section#service .price .lead {
  font-size: calc(var(--base-fs) * 18);
}
section#service .price .nav-modal {
  --fs: calc(var(--base-fs) * 16.5);
  --padding-inline: var(--m);
  --width: 100%;
  text-align: left;
}
section#service .bonus {
  font-size: calc(var(--base-fs) * 15);
  text-align: left;
}
section#service .bonus .nav-modal {
  --fs: calc(var(--base-fs) * 16.5);
}
section#service .modal .inner {
  width: 90%;
}
section#service .modal .block {
  width: 100%;
}
section#service .modal .title {
  font-size: calc(var(--base-fs) * 21);
}
section#service .modal * + .caption {
  text-align: left;
}
section#service .modal .image {
  width: 100%;
}
section#service .modal table {
  margin-block: var(--m);
  width: 100%;
  margin-inline: 0;
  display: table;
  border: 0;
  border-radius: 0;
  font-size: calc(var(--base-fs) * 15);
}
section#service .modal :is(th, td) {
  text-align: center;
  padding: var(--m) 0;
}
section#service .modal table#list-bonus {
  font-size: calc(var(--base-fs) * 15);
}
section#service .modal table#list-bonus tr.heading {
  font-size: calc(var(--base-fs) * 15);
}
section#service .modal table#list-bonus :is(th, td) {
  padding-inline: var(--m);
}
section#service .modal .note {
  font-size: calc(var(--base-fs) * 11);
}
section#device-account .wrap {
  padding-top: 0;
  padding-inline: var(--m);
}
section#device-account .combination {
  padding-inline: var(--m);
  flex-direction: column;
  --gap: calc(var(--m) * 4);
}
section#device-account .combination .block {
  width: 80%;
  padding: var(--m);
  margin-inline: auto;
  box-shadow: inset 0 0 0 3px var(--navy);
  font-size: calc(var(--base-fs) * 15);
}
section#device-account .combination .block:first-child::before {
  font-size: calc(var(--base-fs) * 42);
  top: calc(100% + var(--gap) / 2);
  left: 50%;
}
section#device-account .combination .image {
  width: 40%;
}
section#device-account .combination .title {
  margin-block: 0;
  font-size: calc(var(--base-fs) * 27);
  line-height: 1.2;
}
section#device-account .combination .block:last-child .title {
  margin-block: var(--m);
  letter-spacing: 0;
}
section#device-account .warning {
  margin-top: calc(var(--m) * 4);
  padding: calc(var(--m) * 3) calc(var(--m) * 1.5) calc(var(--m) * 2);
}
section#device-account .warning .icon {
  width: 20%;
}
section#device-account .warning .title {
  order: 1;
  font-size: calc(var(--base-fs) * 21);
  word-wrap: noraml;
}
section#device-account .warning .text {
  order: 3;
  font-size: calc(var(--base-fs) * 15);
}
section#device-account .warning .image {
  order: 2;
  width: 100%;
}
section#device-account .nav-modal {
  margin-inline: auto;
}
section#device-account .modal .container {
  flex-direction: column;
  gap: calc(var(--m) * 2);
}
section#device-account .modal .block {
  width: 100%;
}
section#device-account .modal .title {
  font-size: calc(var(--base-fs) * 21);
  text-align: center;
}
section#all-in-one .wrap {
  padding-top: 0;
  padding-bottom: calc(var(--m) * 3);
}
section#all-in-one .summaries:where(.container) {
  --gap: calc(var(--m) * 2);
  flex-direction: column;
}
section#all-in-one .summaries:where(.container) .caption {
  font-size: calc(var(--base-fs) * 18);
  text-align: left;
}
section#all-in-one .summaries:where(.container) .block:first-child {
  width: 100%;
}
section#all-in-one .summaries:where(.container) .block:last-child {
  width: 100%;
}
section#all-in-one .notice {
  margin-top: calc(var(--m) * 3);
  padding: var(--m);
  font-size: calc(var(--base-fs) * 18);
}
section#all-in-one .points:where(.container) {
  --row-gap: calc(var(--m) * 2);
}
section#all-in-one .points:where(.container) .block {
  width: 100%;
}
section#all-in-one .points:where(.container) .title {
  padding-block: calc(var(--m) * 2);
  padding-inline: var(--m) calc(var(--m) * 0.5);
}
section#all-in-one .modal .inner {
  width: 90%;
}
section#all-in-one .modal .block {
  width: 100%;
}
section#all-in-one .modal .title {
  font-size: calc(var(--base-fs) * 21);
}
section#difference .container {
  --gap: calc(var(--m) * 2);
  flex-direction: column;
}
section#difference .block {
  width: 100%;
}
section#difference .title {
  font-size: calc(var(--base-fs) * 21);
}
section#difference .image {
  width: 30%;
}
section#difference .popup {
  width: 90%;
  padding: calc(var(--m) * 2);
  top: 30%;
}
section#difference .popup h4 {
  padding-bottom: calc(var(--m) * 1.5);
  margin-bottom: calc(var(--m) * 1.5);
  font-size: calc(var(--base-fs) * 18);
}
section#difference .block.is_active .popup {
  transform: translateX(-50%);
}
section#difference .block:nth-child(-n + 2) .popup {
  left: 50%;
}
section#difference .block:nth-last-child(-n + 2) .popup {
  left: 50%;
}
section#step .subline {
  font-size: calc(var(--base-fs) * 18);
  line-height: 2;
}
section#step .steps {
  --gap: calc(var(--m) * 4);
  padding-inline: calc(var(--m) * 2);
  flex-direction: column;
}
section#step .steps .block {
  width: 100%;
  padding: calc(var(--m) * 2);
}
section#step .steps .block:not(:last-child)::after {
  writing-mode: vertical-rl;
  font-size: calc(var(--base-fs) * 42);
  line-height: 0;
  top: calc(100% + var(--gap) / 2);
  left: 55%;
}
section#step .steps .block .label span {
  --size: min(12vw, 45px);
  font-size: calc(var(--base-fs) * 24);
}
section#step .steps .block .title {
  height: auto;
  font-size: calc(var(--base-fs) * 24);
}
section#expansion {
  padding-block: var(--m);
}
section#expansion .subline {
  margin-bottom: var(--m);
  font-size: calc(var(--base-fs) * 21);
}
section#expansion .subline + .lead {
  font-size: calc(var(--base-fs) * 12);
}
section#expansion .phases {
  --padding-block: var(--m);
  --padding-inline: calc(var(--m) * 2);
  padding-bottom: calc(var(--m) * 6);
  flex-direction: column;
}
section#expansion .block {
  width: 100%;
  padding-bottom: 0;
}
section#expansion .block:not(:nth-of-type(3)) {
  padding-bottom: calc(var(--m) * 4);
  border-right: 0;
}
section#expansion .block .icon {
  margin-top: calc(var(--m) * 2);
}
section#expansion .title {
  padding-block: calc(var(--m) * 0.5) var(--m);
  margin-bottom: calc(var(--m) * 2);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
          clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
  font-size: calc(var(--base-fs) * 21);
  text-indent: 0;
}
section#expansion .icon {
  width: 20%;
}
section#expansion .background {
  height: calc(100% - var(--padding-block) * 1);
}
section#expansion .background::after {
  display: none;
}
section#expansion .background h3 {
  display: none;
}
section#security .wrap {
  padding-inline: var(--m);
}
section#security .container {
  --row-gap: calc(var(--m) * 2);
  padding-inline: calc(var(--m) * 2);
}
section#security .block {
  width: 100%;
  padding: calc(var(--m) * 2) calc(var(--m) * 2);
}
section#security .block:is(#isms) {
  padding-inline: calc(var(--m) * 3);
  flex-direction: column;
  align-items: center;
  row-gap: 0;
}
section#security .block:is(#isms) .note {
  display: block;
}
section#security .block:is(#isms) .image {
  margin-top: var(--m);
  width: 40%;
}
section#security img[src*="icon-"] {
  margin-bottom: calc(var(--m) * 2);
}
section#security .title {
  padding-bottom: var(--m);
  border-bottom: 1px solid var(--sky-gray);
  margin-bottom: var(--m);
}
section#security .sub:is(.block) {
  width: 75%;
  padding: calc(var(--m) * 2);
}
section#security .sub:is(.block) .image {
  width: 50%;
}
section#security .sub:is(.block) .notice {
  padding: var(--m);
}
section#asset .wrap {
  position: relative;
  z-index: 0;
}
section#asset .nav-asset {
  --shadow: 0 0 calc(var(--m) * 5) calc(-1 * var(--m)) rgba(14, 56, 112, 0.4);
}
section#asset .nav-asset::after {
  width: 82%;
  height: 95%;
  top: 55%;
  z-index: -1;
}
section#asset .nav-asset .image {
  --bg: transparent;
  opacity: 1;
}
section#asset .nav-asset .btn {
  --fs: calc(var(--base-fs) * 18);
  --padding-block: var(--m);
  transform: translate(-50%, -50%);
}
#modal-download-form .inner {
  width: 90%;
  padding: calc(var(--m) * 2) var(--m);
}
#modal-download-form .modal-content {
  padding: 0;
}
#modal-download-form .modal-content h2 {
  padding: 0;
  font-size: calc(var(--base-fs) * 21);
}
#modal-download-form .modal-content p {
  font-size: calc(var(--base-fs) * 12);
  text-align: left;
}
#modal-download-form label {
  font-size: calc(var(--base-fs) * 15);
}
#modal-download-form label .modal__form-required-text {
  font-size: calc(var(--base-fs) * 12);
}
#modal-download-form label .modal__form-optional-text {
  font-size: calc(var(--base-fs) * 12);
}
#modal-download-form label.modal__checkbox-label {
  padding-left: calc(22px + 0.5ic);
  text-indent: calc((22px + 0.5ic) * -1);
}
#modal-download-form button.nav-submit {
  --width: 100%;
  --padding-block: 0.25lh;
}
/* ==================================================================
	* News List *
================================================================== */
body.archive .block {
  flex-direction: column;
}
body.archive .thumbnail {
  width: 100%;
  padding-top: 50%;
  border-radius: var(--radius1st) var(--radius1st) 0 0;
}
body.archive .thumbnail img {
  -o-object-position: top center;
     object-position: top center;
}
body.archive .text {
  width: 100%;
  border-radius: 0 0 var(--radius1st) var(--radius1st);
}
body.archive .nav-more {
  --width: 100%;
  margin-top: calc(var(--m) * 2);
  margin-inline: auto;
}
body#news-list .category-list {
  width: calc(100% + var(--wrap-padding-inline) * 2);
  padding-block: var(--m);
  padding-inline: var(--wrap-padding-inline);
  margin-inline: calc(-1 * var(--wrap-padding-inline));
  background: var(--bg);
  position: sticky;
  top: var(--header-height);
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--m) calc(var(--m) * 2);
}
body#news-list .category-list .btn {
  --width: fit-content;
  --padding-block: 0.125lh;
  margin-bottom: 0;
}
body#news-list .block {
  width: 100%;
  margin-left: 0;
}
body#interview-list .thumbnail {
  padding-top: 70%;
}
body#interview-list .title {
  font-size: calc(var(--base-fs) * 18);
}
body#interview-list .excerpt {
  font-size: calc(var(--base-fs) * 13.5);
}
/* ==================================================================
	* Page *
================================================================== */
/* ==================================================================
	* Single *
================================================================== */
/* ==================================================================
	* 404ページ *
================================================================== */