@charset "utf-8";
@font-face {
  font-family: '';
  src: url('/wp-content/themes//css/icons/.eot?aw9n05');
  src: url('/wp-content/themes//css/icons/.eot?aw9n05#iefix') format('embedded-opentype'), url('/wp-content/themes//css/icons/.ttf?aw9n05') format('truetype'), url('/wp-content/themes//css/icons/.woff?aw9n05') format('woff'), url('/wp-content/themes//css/icons/.svg?aw9n05#') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
main {
  display: block;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}
a {
  background-color: transparent;
}
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}
b,
strong {
  font-weight: bolder;
}
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
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;
}
img {
  border-style: none;
}
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}
button,
input {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
details {
  display: block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none;
}
/* CSS Custom Properties Around Colors */
:root {
  --white: #fff;
  --fog: #f7f7f7;
  --smog: #ececec;
  --gray-light: #8c8c8c;
  --gray: #4c4c4c;
  --black: #1f1f1f;
  --rich-black: #000;
  --red: #e50012;
  --rouge: #b01e24;
  --orange: #f7b52c;
  --deep-orange: #ff9500;
  --yellow: #faed00;
  --lime: #8dc21f;
  --green: #00913a;
  --sky: #2ca6e0;
  --blue: #036eb7;
  --navy: #003666;
  --purple: #5f1985;
  --pink: #e3007f;
  --greasy: #976068;
  --blue-light: #f2f8fc;
  --accent-color: #b01e24;
  --accent-bright: #e50012;
  --alert-color: #b01e24;
  --alert-bright: #e50012;
  --notion-color: #f7b52c;
  --notion-bright: #faed00;
  --gradient-dawn: rgba(154, 198, 212, 0.65) -10%, rgba(255, 197, 156, 0.65) 120%;
  --gradient-dawn-full: rgba(154, 198, 212, 0.65) 0%, rgba(255, 197, 156, 0.65) 100%;
  --gradient-morning: rgba(154, 198, 212, 0.65) 0%, rgba(154, 198, 212, 0.65) 50%, rgba(255, 197, 156, 0.65) 120%;
  --gradient-morning-full: rgba(154, 198, 212, 0.65) 0%, rgba(154, 198, 212, 0.65) 50%, rgba(255, 197, 156, 0.65) 100%;
  --gradient-noon: rgba(154, 184, 212, 0.65) -30%, rgba(255, 219, 156, 0.65) 150%;
  --gradient-noon-full: rgba(154, 184, 212, 0.65) 0%, rgba(255, 219, 156, 0.65) 100%;
  --gradient-set: rgba(154, 205, 205, 0.5) -10%, rgba(232, 191, 176, 0.5) 130%;
  --gradient-set-full: rgba(154, 205, 205, 0.5) 0%, rgba(232, 191, 176, 0.5) 100%;
  --gradient-dusk: #003666 -10%, #976068 130%;
  --gradient-dusk-full: #003666 0%, #976068 100%;
  --gradient-rise: rgba(152, 182, 210, 0.65) -10%, rgba(255, 217, 154, 0.65) 130%;
  --gradient-rise-full: rgba(152, 182, 210, 0.65) 0%, rgba(255, 217, 154, 0.65) 100%;
  --gradient-night: #5c307d -40%, #024e7b 110%;
  --gradient-night-full: #5c307d 0%, #024e7b 100%;
  --gradient-red: #890f23 0%, #4c1222 100%;
  --gradient-lime: #5c871d 0%, #00981e 100%;
  --gradient-hill: #00833a 0%, #036ea9 100%;
  --gradient-violet: #8e007f 0%, #024e7b 100%;
  --gradient-pink: #c73a89 0%, #851075 100%;
  --title: var(--black);
  --text: var(--black);
  --link: var(--black);
  --visited: var(--link);
  --hover: var(--blue);
  --text-strong: var(--rich-black);
  --text-discreet: var(--gray);
  --text-border: var(--gray);
  --marker: var(--notion-color);
  --shadow: rgba(0, 0, 0, 0.05);
  --error: var(--alert-color);
  /* phone setting
	============================================== */
}
:root ::-moz-selection {
  color: var(--black);
  background-color: var(--notion-color);
}
:root ::selection {
  color: var(--black);
  background-color: var(--notion-color);
}
:root {
  font-size: 62.5% !important;
  /* CSS Custom Properties without Colors
	// --------------------------------------------*/
  --main-width: 1500px;
  --base-fs: min(0.066vw, 0.1rem);
  --root-bg: transparent;
  --root-color: var(--text);
  --root-fs: min(1vw, 1.5rem);
  --root-fw: 400;
  --root-fst: normal;
  --root-lh: 1.75;
  --root-ls: 0;
  --root-align: left;
  --root-transition: 0.3s 0s ease;
  --g: min(10vw, 200px);
  --m: min(1vw, 15px);
  --mb: min(1.75vw, 30px);
  --mi: min(1vw, 30px);
  --header-height: min(7.65vw, 153px);
  --logo-width: min(10.5vw, 210px);
  --logo-aspect-ratio: 240 / 61.774;
  --wrap-padding-min: 4.5vw;
  --out-wrap-margin: calc((100vmax - var(--main-width)) / 2);
  --out-wrap-margin-max: max(var(--out-wrap-margin, 0px), 0px);
}
@media screen and (max-width: 1500px) {
  :root {
    --out-wrap-margin: 0px;
  }
}
html {
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  text-size-adjust: none;
  scroll-behavior: smooth;
  scroll-margin-top: var(--header-height, 0px);
}
img.logo-standard {
  aspect-ratio: var(--logo-aspect-ratio);
}
img.logo-white {
  aspect-ratio: 194.2565 / 50;
}
img.logo-logitech {
  aspect-ratio: 98.2568 / 22;
}
img.logo-camcom {
  aspect-ratio: 580 / 68.3158;
}
body {
  --bg: var(--root-bg);
  --color: var(--root-color);
  --fs: var(--root-fs);
  --fw: var(--root-fw);
  --fst: var(--root-fst);
  --lh: var(--root-lh);
  --ls: var(--root-ls);
  --align: var(--root-align);
  --transition: var(--root-transition);
  font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */ 'Helvetica Neue', /* Macの欧文 (OS X 10.10以前) */ 'Segoe UI', /* Windowsの欧文 */ YuGothicM, /* Windows8.1以上は游ゴシック */ YuGothic, /* Macの游ゴシック */ 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);
  background-color: var(--bg);
  padding: 0;
  margin: 0;
  position: relative;
}
@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用 */
}
.wf-active body {
  font-family: "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
}
br[sp] {
  display: none;
}
br[pc],
br[pc][sp] {
  display: inline;
}
a,
a:link {
  --color: var(--link);
  --bg: transparent;
  background: var(--bg);
  color: var(--color);
  font-size: var(--fs);
  font-weight: var(--fw);
  letter-spacing: inherit;
  text-decoration: none;
  transition: var(--transition);
}
a:visited {
  --color: var(--visited);
  --bg: transparent;
}
a:hover {
  --color: var(--hover);
  color: var(--color) !important;
  background: var(--hover-bg) !important;
}
*::before,
*::after {
  content: "";
  display: none;
}
img,
video,
iframe {
  height: auto;
  vertical-align: top;
}
img,
video {
  width: auto;
  max-width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
iframe {
  width: 100%;
  aspect-ratio: 560 / 315;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
  /* normalize reset */
  font-weight: inherit;
  -webkit-margin-before: 0;
          margin-block-start: 0;
  -webkit-margin-after: 0;
          margin-block-end: 0;
  margin: 0;
}
p,
figure {
  margin-inline: 0;
  -webkit-margin-before: 0;
          margin-block-start: 0;
  -webkit-margin-after: 0;
          margin-block-end: 0;
  /* custom */
}
p:not(:last-child),
figure:not(:last-child) {
  margin-bottom: calc(var(--mb) * 1);
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
p:not(:last-child),
ul:not(:last-child),
li:not(:last-child) {
  margin-bottom: calc(var(--mb) * 0.25);
}
li :where(ul, ol) {
  margin-top: calc(var(--mb) * 0.25);
}
p:empty {
  display: none;
}
.wrap {
  --wrap-width: var(--main-width);
  width: 100%;
  max-width: var(--wrap-width);
  box-sizing: border-box;
  padding-right: var(--wrap-padding-min);
  padding-left: var(--wrap-padding-min);
  margin-right: auto;
  margin-left: auto;
}
.note {
  font: monospace;
  text-indent: -1ch;
  padding-left: 1ch;
}
ol.abc {
  list-style: lower-alpha;
}
ul.checklist {
  --marker-size: 1lh;
  --marker-color: var(--orange);
  --marker-bg: var(--white);
  --marker-gap: 0.5ic;
  --padding-inline-start: calc(var(--marker-size) + var(--marker-gap));
  -webkit-padding-start: var(--padding-inline-start);
          padding-inline-start: var(--padding-inline-start);
}
ul.checklist li {
  position: relative;
  z-index: 0;
}
ul.checklist li::before,
ul.checklist li::after {
  display: block;
  width: var(--marker-size);
  height: var(--marker-size);
  position: absolute;
  top: calc((1lh - var(--marker-size)) / 2);
  left: calc(-1 * var(--padding-inline-start));
}
ul.checklist li::before {
  -webkit-clip-path: polygon(14.794% 49.6748%, 24.423% 37.6385%, 45.2352% 61.3627%, 72.3732% 26.8218%, 85.206% 40.0458%, 45.7956% 76.8867%);
          clip-path: polygon(14.794% 49.6748%, 24.423% 37.6385%, 45.2352% 61.3627%, 72.3732% 26.8218%, 85.206% 40.0458%, 45.7956% 76.8867%);
  background: var(--marker-color, var(--orange));
  z-index: 1;
}
ul.checklist li::after {
  border-radius: 100%;
  background: var(--marker-bg, var(--white));
  z-index: 0;
}
main.content > section:not(.hero):last-child {
  padding-bottom: calc(var(--m) * 10);
}
section.hero {
  --billboard-width: 57.8vw;
  position: relative;
}
section.hero::before {
  display: block;
  width: 40vw;
  height: calc(100% + var(--header-height) + var(--m) * 18);
  background: linear-gradient(to right, var(--gradient-dawn));
  position: absolute;
  top: calc(-1 * (var(--header-height) + calc(var(--m) * 5)));
  right: 0;
  z-index: 0;
}
section.hero .tagline {
  --fs: calc(var(--base-fs) * 58);
  --lh: 1.5;
  font-size: var(--fs);
  font-weight: 600;
  line-height: var(--lh);
  width: calc(100vw - var(--billboard-width) - var(--out-wrap-margin-max));
  max-width: calc(100vw - var(--billboard-width) - var(--wrap-padding-min));
  position: absolute;
  top: 50%;
  right: calc(var(--billboard-width));
  transform: translateY(-50%);
  z-index: 2;
}
section.hero .billboard {
  display: block;
  width: var(--billboard-width);
  aspect-ratio: 16 / 9;
  margin: calc(var(--m) * 5) 0 calc(var(--m) * 13) auto;
  position: relative;
  z-index: 1;
}
section.general {
  --color: var(--black);
  --bg: var(--white);
  --headline-fs: calc(var(--base-fs) * 41);
  --headline-border-size: calc(var(--out-wrap-margin-max) + var(--wrap-padding-min) - calc(var(--m) * 2));
  --subline-fs: calc(var(--base-fs) * 30);
  padding-top: calc(var(--m) * 5);
  background: var(--bg);
  overflow: hidden;
  position: relative;
}
section.general:first-child {
  min-height: 300px;
}
section.general:first-child::before {
  display: block;
  width: 40vw;
  height: calc(100% + var(--header-height));
  background: linear-gradient(to right, var(--gradient-set));
  position: absolute;
  top: calc(-1 * (var(--header-height) + calc(var(--m) * 5)));
  right: 0;
  z-index: 0;
}
section.general .wrap {
  position: relative;
  z-index: 1;
}
section.general .subline {
  font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */ 'Helvetica Neue', /* Macの欧文 (OS X 10.10以前) */ 'Segoe UI', /* Windowsの欧文 */ YuGothicM, /* Windows8.1以上は游ゴシック */ YuGothic, /* Macの游ゴシック */ Meiryo, /* 游ゴシックが入っていないWindows */ sans-serif;
  /* Windows */
  color: var(--subline-color);
  font-size: var(--subline-fs);
  font-weight: 500;
  letter-spacing: 0.2ex;
  margin-bottom: calc(var(--m) * 5);
  position: relative;
}
@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用 */
}
section.general .subline span {
  position: relative;
  z-index: 1;
}
section.general .subline::first-letter {
  color: var(--subline-head);
  margin-right: 0.2ex;
}
section.general .subline::before {
  --size: min(2.5vw, 50px);
  display: block;
  width: var(--size);
  height: var(--size);
  background: var(--subline-bg);
  position: absolute;
  top: 45%;
  right: 100%;
  z-index: 0;
  transform: translate(0.8em, -50%);
}
section.general .headline {
  color: var(--color);
  font-size: var(--headline-fs);
  font-weight: 600;
  margin-bottom: calc(var(--m) * 5);
  position: relative;
}
section.general .headline::before {
  display: block;
  width: var(--headline-border-size);
  height: 1px;
  background: var(--color);
  position: absolute;
  top: calc(var(--headline-fs) * var(--lh) / 2);
  right: calc(100% + calc(var(--m) * 2));
}
section.general .lead {
  color: var(--color);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: calc(var(--m) * 10);
}
section.general .title {
  font-size: calc(var(--base-fs) * 21);
  font-weight: 600;
  margin-bottom: calc(var(--m) * 3);
}
section.general img.bg {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
section.case {
  --gap: calc(var(--m) * 4);
}
section.case:not(:last-of-type) {
  margin-bottom: calc(var(--m) * 10);
}
section.case .case-headline {
  color: var(--white);
  font-size: calc(var(--base-fs) * 30);
  font-weight: 600;
  text-align: center;
  padding: var(--m) 0;
  margin-bottom: var(--gap);
}
section.case .container {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  align-items: flex-start;
  gap: var(--gap);
}
section.case .block {
  width: calc((100% - var(--gap) * 2) / 3);
}
section.case .image {
  aspect-ratio: 100 / 48;
}
section.case .label {
  color: var(--white);
  font-size: calc(var(--base-fs) * 21);
  font-weight: 600;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: calc(var(--m) * 0.5) var(--m);
  background: var(--navy);
}
section.case .title {
  font-size: calc(var(--base-fs) * 24);
  font-weight: 500;
  margin: calc(var(--m) * 2) 0;
}
section.case a.nav-case {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  --hover-border: transparent;
  font-size: calc(var(--base-fs) * 18);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: calc(var(--m) * 1.5) calc(var(--m) * 3);
  margin-top: calc(var(--m) * 6);
  margin-right: auto;
  margin-left: auto;
}
section.case a.nav-case:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
section.case a.nav-case::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
section.case:nth-of-type( 2n - 1 ) .case-headline {
  background: linear-gradient(to right, var(--gradient-dusk));
}
section.case:nth-of-type( 2n - 1 ) a.nav-case {
  --hover-bg: var(--blue);
}
section.case:nth-of-type( 2n ) .case-headline {
  background: linear-gradient(to left, var(--gradient-dusk));
}
section.case:nth-of-type( 2n ) a.nav-case {
  --link: var(--white);
  --bg: var(--black);
  --hover-bg: var(--rouge);
}
section.form {
  padding: calc(var(--m) * 10) calc(var(--m) * 4);
  background: var(--bg);
}
section.form .wrap {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  --row-gap: var(--m);
  --column-gap: var(--m);
}
section.form .headline {
  font-size: calc(var(--base-fs) * 42);
  font-weight: 600;
  text-align: center;
  margin-bottom: calc(var(--m) * 5);
}
section.form :is(.mw_wp_form, .form-container) {
  width: 60%;
  min-width: 900px;
}
section.form .group {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
  align-items: flex-start;
  --column-gap: calc(var(--m) * 1.5);
  gap: var(--row-gap) var(--column-gap);
}
section.form .group .container {
  flex-grow: 1;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: var(--row-gap) var(--column-gap);
}
section.form .block {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  --column-gap: calc(var(--m) * 2);
  gap: var(--row-gap) var(--column-gap);
  position: relative;
}
section.form .block.message,
section.form .block.agreement {
  width: 100%;
}
section.form .block.agreement {
  flex-direction: row;
}
section.form .block.agreement .input {
  align-self: center;
}
section.form .block.agreement .mwform-checkbox-field-text,
section.form .block.agreement .checkbox-field-text {
  --font-size: calc(var(--base-fs) * 15);
}
.mw_wp_form_confirm section.form .block.agreement {
  flex-direction: column;
  align-self: center;
  gap: 0;
}
.mw_wp_form_confirm section.form .block.agreement .title::after {
  height: auto;
  align-self: stretch;
}
.mw_wp_form_confirm section.form .block.agreement .input {
  --font-size: calc(var(--base-fs) * 15);
  align-self: unset;
}
section.form .title {
  flex-shrink: 0;
  width: 28%;
  min-height: calc(18px * 1.15 + var(--mb) * 0.75 * 2 + 4px);
  box-sizing: border-box;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-end;
  font-size: calc(var(--base-fs) * 18);
  text-align: right;
}
section.form .group .block .title {
  width: 25%;
  box-sizing: border-box;
}
section.form .block.must .title {
  position: relative;
}
section.form .block.must .title::after {
  content: "＊";
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 100%;
  padding: 0 calc(var(--m) * 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--alert-color);
  font-size: calc(var(--base-fs) * 15);
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
section.form .input {
  width: calc(100% - var(--column-gap) - 28%);
  min-height: calc(calc(var(--base-fs) * 18) * 1.15);
  box-sizing: border-box;
}
section.form .notice {
  width: 100%;
  box-sizing: border-box;
  padding-left: calc(28% + var(--column-gap));
}
section.form a[href*="privacy"],
section.form a[href*="policy"] {
  display: inline-block;
  margin-left: calc(var(--m) * 0.5);
}
section.form a[href*="privacy"]:link,
section.form a[href*="policy"]:link,
section.form a[href*="privacy"]:visited,
section.form a[href*="policy"]:visited {
  text-decoration: underline;
}
section.form a[href*="privacy"]:hover,
section.form a[href*="policy"]:hover {
  --hover: var(--notion-bright);
}
section.form .mw_wp_form_confirm .input {
  --font-size: calc(var(--base-fs) * 18);
  min-height: calc(var(--font-size) * 1.15 + var(--m) * 0.75 * 2);
  padding: calc(var(--m) * 0.75) var(--m);
  font-size: var(--font-size);
  line-height: 1.15;
  border: 1px solid var(--gray);
}
section.form .block.btns {
  margin-top: calc(var(--m) * 6);
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
section.form .back {
  --fs: calc(var(--base-fs) * 18);
  --link: var(--white);
  --hover: var(--black);
  --bg: var(--black);
  --hover-bg: var(--white);
  --border: transparent;
  --border-weight: 1px;
  --arrow-width: 32px;
  --arrow-height: 10px;
  --color: var(--link);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  box-shadow: 0 0 0 var(--border-weight) var(--border);
  position: relative;
  transition: var(--transition);
  --link: var(--black);
  --bg: var(--white);
  --border: var(--black);
  --hover: var(--white);
  --hover-bg: var(--blue);
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  transform: translate(-50%, -50%);
}
section.form .back::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  position: absolute;
  top: 50%;
  right: calc(var(--m) * 2);
  transform: translateY(-50%);
  transform: translate(0, -50%) skewX(35deg);
}
section.form .back :is(input, button) {
  width: 18vw;
  min-width: 360px;
  padding: calc(var(--m) * 2) calc(var(--m) * 3);
  background: var(--bg);
  color: var(--color);
  font-size: var(--fs);
  font-weight: 500;
  white-space: nowrap;
  text-align: left;
  transition: var(--transition);
}
section.form .back:hover {
  --color: var(--hover);
  cursor: pointer;
}
section.form .back:hover :is(input, button) {
  background: var(--hover-bg);
}
section.form .back input {
  width: 12vw;
  min-width: 240px;
}
section.form .back:empty {
  display: none;
}
section.form .submit {
  --fs: calc(var(--base-fs) * 18);
  --link: var(--white);
  --hover: var(--black);
  --bg: var(--black);
  --hover-bg: var(--white);
  --border: transparent;
  --border-weight: 1px;
  --arrow-width: 32px;
  --arrow-height: 10px;
  --color: var(--link);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  box-shadow: 0 0 0 var(--border-weight) var(--border);
  position: relative;
  transition: var(--transition);
}
section.form .submit::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  position: absolute;
  top: 50%;
  right: calc(var(--m) * 2);
  transform: translateY(-50%);
  transform: translate(0, -50%) skewX(35deg);
}
section.form .submit :is(input, button) {
  width: 18vw;
  min-width: 360px;
  padding: calc(var(--m) * 2) calc(var(--m) * 3);
  background: var(--bg);
  color: var(--color);
  font-size: var(--fs);
  font-weight: 500;
  white-space: nowrap;
  text-align: left;
  transition: var(--transition);
}
section.form .submit:hover {
  --color: var(--hover);
  cursor: pointer;
}
section.form .submit:hover :is(input, button) {
  background: var(--hover-bg);
}
section.form :is(.mwform-checkbox-field, .checkbox-field).horizontal-item:not(:last-of-type) {
  margin-right: calc(var(--m) * 2);
}
section.form input[type="text"],
section.form input[type="email"],
section.form input[type="password"],
section.form select,
section.form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.75) var(--m);
  border: none;
}
section.form input[type="text"]:focus,
section.form input[type="email"]:focus,
section.form input[type="password"]:focus,
section.form select:focus,
section.form textarea:focus {
  outline: 2px solid var(--notion-bright);
}
section.form input[type="text"],
section.form input[type="email"],
section.form input[type="password"],
section.form textarea,
section.form .mwform-checkbox-field-text,
section.form .checkbox-field-text {
  font-size: calc(var(--base-fs) * 18);
}
section.form textarea {
  resize: vertical;
}
section.form input[type="checkbox"],
section.form input[type="radio"] {
  margin-right: 5px;
}
section.form input[name="submitBack"],
section.form input[name="submitConfirm"],
section.form input[type="submit"],
section.form button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0;
  border: 0;
  cursor: pointer;
}
section.form .error {
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  padding: 3px calc(var(--m) * 0.5);
  background-color: var(--alert-color);
  font-size: calc(var(--base-fs) * 15);
  color: var(--white);
  position: absolute;
  top: calc((var(--fs) + var(--m) * 0.5) / 2);
  left: calc(100% + 9px);
}
section.form .error::before {
  display: block;
  width: 0;
  height: 0;
  border: 0.35vw solid transparent;
  border-right: 0.44vw solid var(--alert-color);
  position: absolute;
  top: 50%;
  right: 100%;
  transform: translateY(-50%);
  transform: translate(0, -50%);
}
.btn {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
}
.btn:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
.btn::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
.btn-fixed {
  display: block;
  box-sizing: border-box;
  position: fixed;
  top: min(17.6vw, 264px);
  right: 0;
  z-index: 100;
}
.btn-fixed::before {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--white);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.btn-fixed.nav-whitepaper {
  width: min(5.33vw, 80px);
  height: min(18.93vw, 284px);
}
@media (hover: hover) {
  .btn-fixed img {
    transition: var(--transition);
  }
  .btn-fixed:hover img {
    opacity: 0.5;
  }
}
section.cta-short,
section.cta-large {
  position: relative;
}
section.cta-short a[class*="nav-"],
section.cta-large a[class*="nav-"] {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  --border: transparent;
  --hover-border: transparent;
  position: relative;
  z-index: 1;
}
section.cta-short a[class*="nav-"]:hover,
section.cta-large a[class*="nav-"]:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
section.cta-short a[class*="nav-"]::after,
section.cta-large a[class*="nav-"]::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
section.cta-short a[class*="nav-"] img,
section.cta-large a[class*="nav-"] img {
  height: 100%;
  aspect-ratio: 1 / 1;
  position: absolute;
  top: 0;
  left: 0;
}
section.cta-short a.nav-partnership,
section.cta-large a.nav-partnership {
  --border: var(--black);
  --hover-bg: var(--blue);
}
section.cta-short a.nav-contact,
section.cta-large a.nav-contact {
  --link: var(--white);
  --bg: var(--black);
  --hover-bg: var(--rouge);
}
section.cta-short {
  padding: calc(var(--m) * 4) calc(40vw - 21.9vw) calc(var(--m) * 4) calc(var(--m) * 4);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-end;
  --gap: calc(var(--m) * 3.5);
  gap: var(--gap);
  position: relative;
}
section.cta-short::before {
  display: block;
  width: 25vw;
  height: 100%;
  background: linear-gradient(to right, var(--gradient-noon));
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
section.cta-short .title {
  font-size: calc(var(--base-fs) * 18);
  font-weight: 500;
  position: relative;
  z-index: 1;
}
section.cta-short a[class*="nav-"] {
  min-width: unset;
  width: 21vw;
  padding: var(--m) calc(var(--m) * 3) var(--m) calc(var(--m) * 6);
  font-size: calc(var(--base-fs) * 21);
}
section.cta-large {
  padding-top: calc(var(--m) * 7.5);
  text-align: center;
}
section.cta-large .title {
  font-size: calc(var(--base-fs) * 42);
  font-weight: 600;
  margin-bottom: var(--m);
}
section.cta-large .container {
  margin-top: calc(var(--m) * 3);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: calc(var(--m) * 4);
}
section.cta-large a[class*="nav-"] {
  min-width: unset;
  width: 30%;
  padding: calc(var(--m) * 1.5) calc(var(--m) * 3) calc(var(--m) * 1.5) calc(var(--m) * 8);
  font-size: calc(var(--base-fs) * 24);
}
.pagination {
  --parent-bg: var(--white);
  --parent-color: var(--black);
  --bg: var(--parent-bg);
  --color: var(--parent-color);
  --gap: 24px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: var(--gap);
  margin: 60px auto 0;
  background-color: var(--bg);
  position: relative;
  z-index: 11;
}
.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;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  -moz-column-gap: var(--gap);
       column-gap: var(--gap);
}
.pagination a.pager {
  --link: var(--white);
  --visited: var(--white);
  --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);
  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: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 12px;
  font-size: 1.35rem;
}
.article #ez-toc-container {
  padding: calc(var(--m) * 3);
  border: none;
  border-radius: 0;
  background: var(--fog);
  margin-bottom: calc(var(--m) * 6);
}
.article #ez-toc-container .ez-toc-title {
  font-size: calc(var(--base-fs) * 21);
  color: var(--gray);
}
.article #ez-toc-container nav {
  margin-top: calc(var(--m) * 1.5);
}
.article #ez-toc-container ul.ez-toc-list {
  -webkit-padding-start: 0;
          padding-inline-start: 0;
}
.article #ez-toc-container ul.ez-toc-list li {
  --fs: calc(var(--base-fs) * 18);
}
.article #ez-toc-container ul.ez-toc-list li:not(:last-child) {
  margin-bottom: var(--m);
}
.article #ez-toc-container ul.ez-toc-list a {
  --link: var(--gray);
}
.article #ez-toc-container ul.ez-toc-list ul {
  margin-block: calc(var(--m) * 0.5);
  -webkit-padding-start: 0;
          padding-inline-start: 0;
}
.article #ez-toc-container ul.ez-toc-list ul li {
  --fs: calc(var(--base-fs) * 16.5);
  --mb: calc(var(--m) * 0.5);
}
.article #ez-toc-container ul.ez-toc-list ul a {
  --link: var(--gray-light);
}
@media (hover: hover) {
  .article #ez-toc-container ul.ez-toc-list ul:hover a {
    --link: var(--gray);
  }
}
/* ==================================================================
	Header
================================================================== */
.header {
  height: var(--header-height);
  background-color: transparent;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 100;
}
.header .logo {
  padding: 0 calc(var(--m) * 2) 0 calc(var(--m) * 4);
}
.header .logo a {
  display: block;
  width: var(--logo-width);
}
.header .logo img {
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
}
.header .switch {
  display: none;
}
.header .header-nav {
  --gap: calc(var(--m) * 2);
  height: 100%;
  padding-right: calc(var(--m) * 2);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-end;
  gap: var(--gap);
}
.header .header-nav a {
  --fs: calc(var(--base-fs) * 13.5);
  --fw: 500;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  flex-shrink: 1;
  white-space: nowrap;
}
.header .header-nav .subline {
  display: none;
}
.header .header-nav a.nav-partnership,
.header .header-nav a.nav-contact {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  --arrow-width: min(1.5vw, 30px);
  --arrow-height: min(0.5vw, 10px);
}
.header .header-nav a.nav-partnership:hover,
.header .header-nav a.nav-contact:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
.header .header-nav a.nav-partnership::after,
.header .header-nav a.nav-contact::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
.header .header-nav a.nav-partnership {
  --hover: var(--white);
  --hover-bg: var(--blue);
  --hover-border: transparent;
}
.header .header-nav a.nav-contact {
  --link: var(--white);
  --bg: var(--black);
  --border: transparent;
  --hover: var(--white);
  --hover-bg: var(--rouge);
  --hover-border: transparent;
}
/* ==================================================================
	Footer
================================================================== */
.footer {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  flex-direction: row-reverse;
  align-items: stretch;
  position: relative;
}
.footer-cta {
  width: 35%;
  box-sizing: border-box;
  padding: calc(var(--m) * 10) 0 0;
  background: var(--gray);
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
  gap: calc(var(--m) * 3);
  position: relative;
}
.footer-cta a.nav-page-top {
  --link: var(--white);
  --bg: var(--gray);
  --hover: var(--white);
  --hover-bg: var(--black);
  width: min(7.5vw, 150px);
  box-sizing: border-box;
  padding: calc(var(--m) * 2) 0;
  font-size: calc(var(--base-fs) * 21);
  line-height: 1;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: calc(var(--m) * 0.5);
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(0, -50%);
}
.footer-cta a.nav-page-top::before {
  display: block;
  --size: min(0.85vw, 17px);
  width: var(--size);
  height: var(--size);
  border-top: 1px solid var(--color);
  border-left: 1px solid var(--color);
  transform: rotate(45deg);
}
.footer-cta a.nav-partnership,
.footer-cta a.nav-contact {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  --arrow-width: min(2.7vw, 54px);
  min-width: unset;
  padding: var(--m) calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 21);
  position: relative;
  --border: transparent;
  --hover-border: transparent;
  min-width: min(21vw, 420px);
}
.footer-cta a.nav-partnership:hover,
.footer-cta a.nav-contact:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
.footer-cta a.nav-partnership::after,
.footer-cta a.nav-contact::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
.footer-cta a.nav-partnership::before,
.footer-cta a.nav-contact::before {
  display: block;
  width: 0;
  height: 0;
  border: min(0.22vw, 4.5px) solid transparent;
  border-left: min(0.4vw, 8px) solid var(--color);
  position: absolute;
  top: 50%;
  right: calc(calc(var(--m) * 3) - min(0.8vw, 16px));
  transform: translateY(-50%);
}
.footer-cta a.nav-partnership::after,
.footer-cta a.nav-contact::after {
  height: 0;
  border-right: 0;
  transform: none;
}
.footer-cta a.nav-partnership {
  --hover-bg: var(--blue);
}
.footer-cta a.nav-contact {
  --link: var(--white);
  --bg: var(--black);
  --hover-bg: var(--rouge);
}
.footer-body {
  width: 65%;
  box-sizing: border-box;
  padding-top: calc(var(--m) * 7);
  padding-right: clamp(calc(var(--m) * 4), var(--out-wrap-margin), calc(var(--m) * 10));
  padding-bottom: calc(var(--m) * 6);
  padding-left: max(calc( var(--out-wrap-margin) + calc(var(--m) * 2) ), calc(var(--m) * 6));
  background: var(--black);
}
.footer-nav {
  padding-bottom: calc(var(--m) * 5);
  border-bottom: 1px solid var(--fog);
  margin-bottom: calc(var(--m) * 5);
  display: flex;
  gap: calc(var(--m) * 4);
}
.footer-nav .group {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
  align-items: flex-start;
  gap: var(--m);
}
.footer-nav a {
  --link: var(--white);
  --visited: var(--link);
  display: block;
}
.footer-profile .logos,
.footer-profile .links {
  --max-height: 40px;
  --max-height-vw: 2vw;
  display: flex;
  align-items: flex-end;
  gap: 0 min(var(--m), 25px);
  margin-bottom: min(2.5vw, 50px);
}
.footer-profile .logos > *,
.footer-profile .links > * {
  height: min(var(--max-height-vw), var(--max-height));
}
.footer-profile .parent {
  color: var(--fog);
  font-size: calc(var(--base-fs) * 11);
}
.footer-profile .logo-logitech {
  margin-top: 3px;
  width: min(4.91vw, 98.2568px);
}
.footer-profile .nav-external {
  flex-shrink: 0;
  flex-grow: 0;
  align-self: stretch;
  display: block;
  transition: var(--transition);
}
.footer-profile .nav-external:hover {
  opacity: 0.7;
}
.footer-profile .nav-external > img {
  height: 100%;
}
.footer-profile .banner-logitech {
  max-width: 100%;
  height: 100%;
}
.footer-profile .copyright {
  color: var(--gray-light);
}
/* ==================================================================
	フロント
================================================================== */
#home-billboard {
  --billboard-margin: 12.1vw;
  --billboard-width: calc(100vw - var(--billboard-margin));
  --heading-top: 8.75vw;
}
#home-billboard .tagline {
  --margin: calc(var(--m) * 2);
  --fs: calc(var(--base-fs) * 66);
  --lh: 1.5;
  color: var(--white);
  letter-spacing: 0.2ex;
  text-shadow: 0 0 var(--m) rgba(31, 31, 31, 0.5);
  width: auto;
  max-width: unset;
  margin-bottom: calc(var(--m) * 2);
  right: auto;
  transform: none;
  position: absolute !important;
  top: var(--heading-top) !important;
  left: calc(var(--billboard-margin) + var(--margin)) !important;
  z-index: 3;
}
#home-billboard .tagline::after {
  display: block;
  width: calc(var(--billboard-margin) + var(--margin) + var(--fs) * 2.25);
  min-width: calc(var(--m) * 1.5);
  height: calc(var(--fs) * 1.2);
  background: var(--black) url('../imgs/home/tagline-marker.jpg') no-repeat center;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: calc(-1 * var(--billboard-margin) - var(--margin));
  z-index: -1;
  transform: translate(0, calc(var(--fs) * 0.15));
}
#home-billboard .subline {
  color: var(--white);
  font-size: calc(var(--base-fs) * 21);
  font-weight: 500;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: var(--m) calc(var(--m) * 2);
  background: var(--black);
  position: absolute;
  bottom: 0;
  left: calc(var(--billboard-margin) + calc(var(--m) * 2));
  z-index: 3;
  transform: translate(0, 50%);
}
#home-billboard video.billboard,
#home-billboard video.pre {
  aspect-ratio: 1670 / 700;
}
#home-billboard video.billboard {
  width: var(--billboard-width);
  margin-left: auto;
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
  z-index: 2;
}
#home-billboard img.pre {
  width: var(--billboard-width);
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
#home-about {
  --color: var(--white);
  --subline-color: var(--white);
  --subline-bg: var(--red);
  padding-top: calc(var(--m) * 15);
  position: relative;
}
#home-about > *:not(.bg) {
  position: relative;
  z-index: 1;
}
#home-about .headline {
  letter-spacing: 0.2ex;
}
#home-about .container {
  display: flex;
  align-items: stretch;
  --gap: calc(var(--m) * 12);
  gap: var(--gap);
}
#home-about .lead {
  display: flex;
  flex-direction: column;
}
#home-about a.nav-about {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  --color: var(--white);
  --bg: var(--black);
  --hover-bg: var(--rouge);
  --border: transparent;
  font-size: calc(var(--base-fs) * 18);
  margin-top: calc(var(--m) * 4);
  width: 16vw;
  padding: var(--m) calc(var(--m) * 2);
}
#home-about a.nav-about:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
#home-about a.nav-about::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
#home-about .movie {
  flex-shrink: 0;
  width: 60%;
  position: relative;
}
#home-about .movie::before,
#home-about .movie::after {
  display: block;
  width: 100%;
  height: 100%;
}
#home-about .movie::before {
  background: var(--rich-black);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
#home-about .movie::after {
  background: linear-gradient(to right, var(--gradient-rise));
  position: absolute;
  top: calc(var(--m) * 3);
  left: calc(var(--m) * 3);
  z-index: 0;
}
#home-about .movie iframe {
  position: relative;
  z-index: 2;
}
#home-about .diagram {
  margin-top: calc(var(--m) * 12);
  padding: calc(var(--m) * 10) 0;
  background: rgba(255, 255, 255, 0.7);
}
#home-about .diagram .image {
  display: block;
  width: 65vw;
  margin-right: auto;
  margin-left: auto;
}
#home-about a.nav-partnership,
#about-diagram a.nav-partnership {
  --bg: rgba(255, 255, 255, 0.7);
  --hover: var(--white);
  --hover-bg: var(--black);
  margin: calc(var(--m) * 4) auto;
  width: 63vw;
  display: flex;
  align-items: stretch;
  text-align: left;
}
#home-about a.nav-partnership .heading,
#about-diagram a.nav-partnership .heading {
  flex-shrink: 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: var(--m) calc(var(--m) * 2);
  background: linear-gradient(to left, var(--gradient-dusk));
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: var(--m);
}
#home-about a.nav-partnership .icon,
#about-diagram a.nav-partnership .icon {
  height: 3vw;
  aspect-ratio: 96.6683 / 60;
}
#home-about a.nav-partnership .title,
#about-diagram a.nav-partnership .title {
  color: var(--white);
  font-size: calc(var(--base-fs) * 24);
  font-weight: 600;
  line-height: 1.5;
}
#home-about a.nav-partnership > p,
#about-diagram a.nav-partnership > p {
  flex-grow: 1;
  font-size: calc(var(--base-fs) * 18);
  font-weight: 500;
  letter-spacing: 0.1ex;
  padding: 0 calc(var(--m) * 2);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
}
#home-case {
  --subline-bg: var(--lime);
  padding-top: calc(var(--m) * 12);
  padding-bottom: calc(var(--m) * 6);
}
#home-case::before {
  display: block;
  width: 30%;
  height: 68%;
  background: linear-gradient(to left, var(--gradient-set));
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
}
#home-case .headline {
  margin-bottom: calc(var(--m) * 7.5);
}
/* ==================================================================
	ロジパレとは
================================================================== */
#about-statement {
  --color: var(--white);
  --bg: var(--navy);
  --subline-color: var(--white);
  --subline-bg: var(--red);
  padding-top: calc(var(--m) * 12);
}
#about-statement .lead {
  line-height: 3;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: calc(var(--m) * 15);
}
#about-statement img.statement-copy {
  display: block;
  width: 10.25vw;
  aspect-ratio: 150 / 910.5034;
  position: absolute;
  top: 0;
  right: calc(var(--m) * 12.6);
}
#about-core {
  --headline-border-size: calc(15vw - calc(var(--m) * 2));
  padding-top: calc(var(--m) * 12);
  padding-bottom: calc(var(--m) * 6);
  position: relative;
}
#about-core::before {
  display: block;
  width: 100vw;
  height: calc(100% + 1px);
  background: linear-gradient(to right, var(--gradient-dawn));
  -webkit-clip-path: inset(0px 65% 0px 0px);
          clip-path: inset(0px 65% 0px 0px);
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 0;
}
#about-core .wrap {
  --wrap-width: 100%;
  padding: 0;
}
#about-core .headline {
  width: calc(var(--main-width) / 2);
  box-sizing: border-box;
  padding-right: var(--wrap-padding-min);
  margin-left: 50%;
  white-space: nowrap;
}
#about-core .container {
  display: flex;
  --gap: calc(var(--m) * 8);
  gap: var(--gap);
  position: relative;
  z-index: 1;
}
#about-core .lead {
  order: 2;
  width: calc(var(--main-width) / 2);
  box-sizing: border-box;
  padding-right: var(--wrap-padding-min);
}
#about-core .image {
  order: 1;
  width: calc(50% - var(--gap));
}
#about-diagram {
  --bg: linear-gradient(to right, var(--gradient-dawn));
  padding-top: calc(var(--m) * 10);
  padding-bottom: calc(var(--m) * 10);
  text-align: center;
}
#about-diagram .title {
  font-size: calc(var(--base-fs) * 42);
  font-weight: 600;
  margin-bottom: var(--m);
}
#about-diagram .image {
  margin-top: calc(var(--m) * 2);
}
#about-diagram a.nav-partnership {
  width: 80%;
}
#about-diagram a.nav-partnership .title {
  margin-bottom: 0;
}
/* ==================================================================
	ロジパレの強み
================================================================== */
#strength-intro {
  --subline-bg: var(--orange);
  padding-bottom: calc(var(--m) * 5);
}
#strength-intro .container {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  --gap: calc(var(--m) * 6);
  gap: var(--gap);
}
#strength-intro .block {
  width: calc((100% - var(--gap) * 1) / 2);
  position: relative;
  z-index: 1;
}
#strength-intro .block .title {
  margin: calc(var(--m) * 2) 0;
  font-size: calc(var(--base-fs) * 36);
  font-weight: 600;
  letter-spacing: 0.1ex;
  text-align: center;
}
#strength-intro .block .image {
  --square-gap: -2vw;
  position: relative;
}
#strength-intro .block .image::before {
  --size: min(11vw, 220px);
  width: var(--size);
  height: var(--size);
  background: linear-gradient(to right, var(--gradient-dawn));
  z-index: 0;
}
#strength-intro .block .image img {
  aspect-ratio: 5 / 3;
  position: relative;
  z-index: 1;
}
#strength-intro .block:first-of-type .image::before {
  display: block;
  position: absolute;
  top: var(--square-gap);
  left: var(--square-gap);
}
#strength-intro .block:last-of-type .image::before {
  display: block;
  position: absolute;
  bottom: var(--square-gap);
  right: var(--square-gap);
}
#strength-scale {
  --bg: var(--fog);
  padding-bottom: calc(var(--m) * 5);
  position: relative;
}
#strength-scale::before {
  --size: min(27.25vw, 545px);
  display: block;
  width: var(--size);
  height: var(--size);
  background: var(--bg);
  position: absolute;
  bottom: 100%;
  left: 0;
}
#strength-scale .heading {
  position: absolute;
  z-index: 1;
}
#strength-scale .headline {
  width: min(28.99vw, 580px);
  margin-bottom: calc(var(--m) * 2.5);
}
#strength-scale .headline::before {
  display: none;
}
#strength-scale .image {
  position: relative;
  z-index: 0;
}
/* ==================================================================
	ご利用の流れ
================================================================== */
#flow-intro {
  --subline-bg: var(--sky);
  padding-bottom: calc(var(--m) * 7.5);
}
#flow-intro .lead {
  width: 100%;
  margin-bottom: calc(var(--m) * 4.5);
}
#flow-intro .price {
  text-align: center;
}
#flow-intro .image {
  display: block;
  width: 55vw;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: var(--m);
}
#flow-chart {
  --color: var(--white);
  padding-top: calc(var(--m) * 7.5);
  padding-bottom: calc(var(--m) * 7.5);
}
/* ==================================================================
	ソリューション
================================================================== */
#solution-index {
  --subline-head: var(--white);
  --subline-bg: var(--pink);
}
#solution-index .lead {
  margin-bottom: calc(var(--m) * 6);
}
#solution-index .container {
  padding-block: calc(var(--m) * 3);
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 0;
}
#solution-index .container::before {
  display: block;
  width: 100svw;
  height: 100%;
  background: var(--fog);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
#solution-index .container a {
  display: block;
  width: 30%;
  flex-shrink: 0;
  transition: 0.2s 0s ease;
}
@media (hover: hover) {
  #solution-index .container:has(a:hover) a:not(:hover) {
    opacity: 0.35;
  }
}
#solution-list .block {
  padding-block: calc(var(--m) * 6);
  display: flex;
  align-items: center;
  gap: calc(var(--m) * 5);
}
#solution-list .block:nth-child(even) {
  flex-direction: row-reverse;
}
#solution-list .block:nth-child(even) .nav-link {
  margin-left: 0;
}
#solution-list .image {
  flex-shrink: 0;
  width: 40%;
  position: relative;
  z-index: 0;
}
#solution-list .label {
  width: 240px;
  -webkit-filter: drop-shadow(0 5px 20px rgba(0, 0, 0, 0.2));
          filter: drop-shadow(0 5px 20px rgba(0, 0, 0, 0.2));
  position: absolute;
  bottom: 0;
  left: 50%;
  translate: -50% 30%;
  z-index: 1;
}
#solution-list .thumbnail {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
#solution-list .title {
  padding-bottom: calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 30);
  font-weight: 600;
}
#solution-list .nav-link {
  --bg: var(--black);
  --link: var(--white);
  --hover: var(--black);
  --hover-bg: var(--white);
  --fs: calc(var(--base-fs) * 18);
  width: 50%;
  margin-left: auto;
}
/* ==================================================================
	パートナー企業募集
================================================================== */
#partnership-intro {
  --subline-head: var(--white);
  --subline-bg: var(--purple);
}
body.partnership#confirmation #partnership-intro,
body.partnership#error #partnership-intro,
body.partnership#complete #partnership-intro {
  display: none;
}
#partnership-intro .lead {
  width: 55%;
  margin-bottom: calc(var(--m) * 5);
}
#partnership-intro .image01 {
  width: 40vw;
  position: absolute;
  top: 0;
  right: calc(-1 * var(--out-wrap-margin-max));
}
#partnership-intro .about-partnership {
  padding: calc(var(--m) * 5);
  background: linear-gradient(to right, var(--gradient-dawn-full));
  margin-bottom: calc(var(--m) * 15);
  position: relative;
}
#partnership-intro .about-partnership .logo-standard {
  width: 12vw;
  float: right;
}
#partnership-intro .about-partnership .title {
  float: left;
  font-size: calc(var(--base-fs) * 33);
  font-weight: 600;
  letter-spacing: 0.2ex;
  margin-bottom: calc(var(--m) * 1.5);
}
#partnership-intro .about-partnership p {
  clear: both;
}
#partnership-intro .container {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  --gap: calc(var(--m) * 6);
  gap: var(--gap);
  margin-bottom: calc(var(--m) * 10);
  position: relative;
}
#partnership-intro .container::before {
  display: block;
  width: 100vw;
  height: calc(100% + 1px);
  background: linear-gradient(to right, var(--gradient-noon-full));
  -webkit-clip-path: inset(0px 70% 0px 0px);
          clip-path: inset(0px 70% 0px 0px);
  position: absolute;
  bottom: calc(-1 * calc(var(--m) * 10) - 1px);
  left: calc(-1 * var(--out-wrap-margin-max) - var(--wrap-padding-min));
  z-index: 0;
}
#partnership-intro .block {
  display: flex;
  align-items: flex-start;
  --gap: calc(var(--m) * 4);
  gap: var(--gap);
  position: relative;
  z-index: 1;
}
#partnership-intro .block .image {
  width: 37.5%;
  aspect-ratio: 3 / 2;
  -o-object-fit: contain;
     object-fit: contain;
}
#partnership-intro .block .dear {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: calc(var(--m) * 0.25) var(--m);
  background: linear-gradient(to left, var(--gradient-dusk-full));
  margin-bottom: calc(var(--m) * 1.5);
  color: var(--white);
  font-size: calc(var(--base-fs) * 27);
  font-weight: 600;
  letter-spacing: 0.2ex;
}
#partnership-intro .block .title {
  margin-bottom: calc(var(--m) * 2);
  font-size: calc(var(--base-fs) * 39);
  font-weight: 600;
  letter-spacing: 0.1ex;
}
#partnership-intro .notice {
  margin-top: calc(var(--m) * 4);
  padding: calc(var(--m) * 3);
  background: var(--fog);
}
#partnership-intro .notice .notice-label {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 calc(var(--m) * 0.5);
  background: var(--purple);
  color: var(--white);
  font-size: calc(var(--base-fs) * 16.5);
  font-weight: 500;
}
#partnership-intro .notice .notice-title {
  margin: var(--m) 0 calc(var(--m) * 1.5);
  font-size: calc(var(--base-fs) * 24);
  font-weight: 500;
}
body.partnership#complete #partnership-form .lead,
body.partnership#complete #contact-form .lead,
body.contact#complete #partnership-form .lead,
body.contact#complete #contact-form .lead {
  padding: calc(var(--m) * 3);
  background: var(--white);
}
#partnership-form {
  --bg: linear-gradient(to right, var(--gradient-noon-full));
}
#contact-form {
  --bg: transparent;
  position: relative;
}
#contact-form::before {
  display: block;
  width: 100vw;
  height: 100%;
  background: linear-gradient(to right, var(--gradient-morning));
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
#contact-form .wrap {
  position: relative;
  z-index: 1;
}
/* ==================================================================
	活用事例
================================================================== */
#case-list {
  --subline-bg: var(--lime);
  padding-top: calc(var(--m) * 5);
  padding-bottom: calc(var(--m) * 6);
}
#case-list::before {
  display: block;
  width: 30%;
  height: 65%;
  background: linear-gradient(to right, var(--gradient-dawn));
  top: auto;
  left: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}
#case-list .headline {
  margin-bottom: calc(var(--m) * 7.5);
}
/* ==================================================================
	アーカイブ
================================================================== */
#archive-list {
  --subline-head: var(--white);
  --subline-bg: var(--blue);
  padding-bottom: calc(var(--m) * 15);
}
#archive-list::before {
  display: block;
  width: 30%;
  height: 65%;
  background: linear-gradient(to right, var(--gradient-dawn));
  top: auto;
  left: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}
#archive-list .container {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: calc(var(--m) * 15);
}
#archive-list .block {
  width: 100%;
  background: var(--white);
  position: relative;
}
#archive-list .block::before {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--white);
  position: absolute;
  bottom: -2vw;
  left: -2vw;
  z-index: -1;
}
#archive-list .block .title {
  font-size: calc(var(--base-fs) * 30);
  font-weight: 600;
}
#archive-list .block.movie .title {
  margin-bottom: calc(var(--m) * 3);
}
#archive-list .block.download {
  display: flex;
  --gap: calc(var(--m) * 4);
  gap: var(--gap);
  position: relative;
}
#archive-list .block.download .image {
  flex-shrink: 0;
  width: 37.5%;
  aspect-ratio: 4 / 3;
  position: relative;
  z-index: 1;
}
#archive-list .block.download .text {
  flex-grow: 1;
  padding-top: calc(var(--m) * 4);
}
#archive-list .block.download .title {
  margin-bottom: calc(var(--m) * 4);
}
#archive-list .block.download a[class*="nav-"] {
  --link: var(--black);
  --visited: var(--link);
  --bg: var(--white);
  --hover: var(--white);
  --hover-bg: var(--black);
  --arrow-width: 32px;
  --arrow-height: 10px;
  --border: var(--link);
  --border-weight: 1px;
  --hover-border: var(--hover);
  min-width: 11vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  box-sizing: border-box;
  padding: calc(var(--m) * 0.5) var(--m);
  box-shadow: inset 0 0 0 var(--border-weight) var(--border);
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  gap: 0 calc(var(--m) * 0.75);
  font-size: var(--fs);
  font-weight: bold;
  white-space: nowrap;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: calc(var(--m) * 0.5) calc(var(--m) * 1.5);
  font-size: calc(var(--base-fs) * 18);
}
#archive-list .block.download a[class*="nav-"]:hover {
  box-shadow: inset 0 0 0 var(--border-weight) var(--hover-border);
}
#archive-list .block.download a[class*="nav-"]::after {
  flex-shrink: 0;
  display: block;
  width: var(--arrow-width);
  height: var(--arrow-height);
  border-right: calc(var(--border-weight) * 1.3) solid var(--color);
  border-bottom: var(--border-weight) solid var(--color);
  transform: skewX(35deg);
}
/* ==================================================================
	お役立ち情報
================================================================== */
#whitepaper {
  --subline-head: var(--white);
  --subline-bg: var(--blue);
}
#whitepaper-intro .lead {
  margin-bottom: calc(var(--m) * 5);
}
#whitepaper-overview .wrap {
  padding-block: var(--wrap-padding-min);
  background: var(--blue-light);
}
#whitepaper-overview .headline {
  color: var(--subline-bg);
  font-weight: 600;
  margin-bottom: calc(var(--m) * 3);
}
#whitepaper-overview .checklist {
  --marker-color: var(--subline-bg);
}
#whitepaper-overview .container {
  margin-top: calc(var(--m) * 3);
  display: flex;
  flex-wrap: wrap;
  --gap: calc(var(--m) * 3);
  gap: var(--gap);
}
#whitepaper-overview .container > * {
  width: calc((100% - var(--gap)) / 2);
}
#whitepaper-overview .container .caption {
  flex: 0 0 100%;
  background: var(--subline-bg);
  font-size: calc(var(--base-fs) * 27);
  color: var(--white);
  text-align: center;
}
#whitepaper-download-request {
  --bg: linear-gradient(to right, var(--gradient-morning));
}
#whitepaper-download-request .subline {
  font-size: calc(var(--base-fs) * 24);
  font-weight: 600;
  letter-spacing: 0.1ic;
}
/* ==================================================================
	Page
================================================================== */
#page-billboard .tagline {
  --fs: calc(var(--base-fs) * 54);
}
:where(#page-articles) {
  --fs: calc(var(--base-fs) * 18);
  font-size: var(--fs);
}
:where(#page-articles) figure + h2,
:where(#page-articles) img + h2,
:where(#page-articles) a + h2,
:where(#page-articles) p + h2,
:where(#page-articles) ul + h2,
:where(#page-articles) ol + h2,
:where(#page-articles) div + h2 {
  margin-top: calc(var(--m) * 10);
}
:where(#page-articles) figure + h3,
:where(#page-articles) img + h3,
:where(#page-articles) a + h3,
:where(#page-articles) p + h3,
:where(#page-articles) ul + h3,
:where(#page-articles) ol + h3,
:where(#page-articles) div + h3,
:where(#page-articles) figure + h4,
:where(#page-articles) img + h4,
:where(#page-articles) a + h4,
:where(#page-articles) p + h4,
:where(#page-articles) ul + h4,
:where(#page-articles) ol + h4,
:where(#page-articles) div + h4,
:where(#page-articles) figure + h5,
:where(#page-articles) img + h5,
:where(#page-articles) a + h5,
:where(#page-articles) p + h5,
:where(#page-articles) ul + h5,
:where(#page-articles) ol + h5,
:where(#page-articles) div + h5,
:where(#page-articles) figure + h6,
:where(#page-articles) img + h6,
:where(#page-articles) a + h6,
:where(#page-articles) p + h6,
:where(#page-articles) ul + h6,
:where(#page-articles) ol + h6,
:where(#page-articles) div + h6 {
  margin-top: calc(var(--m) * 6);
}
:where(#page-articles) figure + ul,
:where(#page-articles) img + ul,
:where(#page-articles) a + ul,
:where(#page-articles) p + ul,
:where(#page-articles) ul + ul,
:where(#page-articles) ol + ul,
:where(#page-articles) div + ul,
:where(#page-articles) figure + ol,
:where(#page-articles) img + ol,
:where(#page-articles) a + ol,
:where(#page-articles) p + ol,
:where(#page-articles) ul + ol,
:where(#page-articles) ol + ol,
:where(#page-articles) div + ol {
  margin-block: calc(var(--m) * 6);
}
:where(#page-articles) h2:not(.headline, .subline, .title),
:where(#page-articles) h3:not(.headline, .subline, .title),
:where(#page-articles) h4:not(.headline, .subline, .title),
:where(#page-articles) h5:not(.headline, .subline, .title),
:where(#page-articles) h6:not(.headline, .subline, .title) {
  display: block;
  font-weight: 700;
}
:where(#page-articles) h2:not(.headline, .subline, .title) {
  margin-bottom: calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 36);
}
:where(#page-articles) h3:not(.headline, .subline, .title) {
  padding-bottom: calc(var(--m) * 2);
  border-bottom: 1px solid var(--color);
  margin-bottom: calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 27);
}
:where(#page-articles) h4:not(.headline, .subline, .title),
:where(#page-articles) h5:not(.headline, .subline, .title),
:where(#page-articles) h6:not(.headline, .subline, .title) {
  font-size: calc(var(--base-fs) * 21);
  margin-bottom: calc(var(--m) * 2);
}
:where(#page-articles) ul {
  list-style-type: disc;
  -webkit-padding-start: 2em;
          padding-inline-start: 2em;
}
:where(#page-articles) ul + p,
:where(#page-articles) ul + ul {
  margin-top: calc(var(--m) * 1.5);
}
:where(#page-articles) p:not(:last-child),
:where(#page-articles) li:not(:last-child) {
  margin-bottom: calc(var(--m) * 1);
}
:where(#page-articles) a {
  --link: var(--blue);
  --visited: var(--link);
  --hover: var(--white);
  --hover-bg: var(--black);
  padding: 0 3px;
}
:where(#page-articles) a:hover {
  padding: 0 12px 0 3px;
  text-decoration: none;
}
:where(#page-articles) table {
  width: 100%;
  border-collapse: collapse;
  font-size: calc(var(--base-fs) * 16.5);
}
:where(#page-articles) table tr {
  border-bottom: 1px solid var(--gray);
}
:where(#page-articles) table tr:first-of-type {
  border-top: 1px solid var(--gray);
}
:where(#page-articles) table tr:nth-of-type(even) {
  background: var(--fog);
}
:where(#page-articles) table th,
:where(#page-articles) table td {
  padding: calc(var(--m) * 1.5) calc(var(--m) * 2);
  border-right: 1px solid var(--smog);
  text-align: left;
}
:where(#page-articles) table th:first-of-type,
:where(#page-articles) table td:first-of-type {
  border-left: 1px solid var(--smog);
}
:where(#page-articles) table th {
  vertical-align: top;
  font-weight: 500;
}
:where(#page-articles) figure:not([class]) {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
:where(#page-articles) img {
  aspect-ratio: 3 / 2;
}
:where(#page-articles) p img {
  margin-top: calc(var(--m) * 3);
  margin-bottom: calc(var(--m) * 3);
}
:where(#page-articles) p + figure,
:where(#page-articles) p + img {
  margin-top: calc(var(--m) * 6);
  margin-bottom: calc(var(--m) * 6);
}
:where(#page-articles) .wp-element-caption {
  margin-top: var(--m);
  display: inline;
  color: var(--gray);
  font-style: italic;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  background: rgba(255, 255, 255, 0.95);
  position: relative;
  z-index: 1;
}
:where(#page-articles) .wrap {
  padding-right: 20%;
}
/* ==================================================================
	Single
================================================================== */
#interviews-article {
  --subline-bg: var(--green);
  --subline-head: var(--white);
  --bg: transparent;
}
#interviews-article::after {
  display: block;
  width: 100%;
  height: calc(100% - 40vw);
  background: linear-gradient(to right, var(--gradient-noon-full));
  -webkit-clip-path: inset(0px 70% 0px 0px);
          clip-path: inset(0px 70% 0px 0px);
  position: absolute;
  bottom: 1px;
  left: 0;
  z-index: -1;
}
#interviews-article .wrap {
  position: static;
  padding-bottom: calc(var(--m) * 10);
}
#interviews-article .subline:first-letter {
  margin-left: 0.5ex;
  margin-right: 0.5ex;
}
#interviews-article h1.headline {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 720px;
  font-size: calc(var(--base-fs) * 42);
  font-weight: 700;
}
#interviews-article .eyecatch {
  width: 40vw;
  aspect-ratio: 750 / 550;
  position: absolute;
  top: calc(var(--m) * 5);
  right: 0;
}
#interviews-article .container {
  --fs: calc(var(--base-fs) * 18);
  font-size: var(--fs);
}
#interviews-article .container figure + h2,
#interviews-article .container img + h2,
#interviews-article .container a + h2,
#interviews-article .container p + h2,
#interviews-article .container ul + h2,
#interviews-article .container ol + h2,
#interviews-article .container div + h2 {
  margin-top: calc(var(--m) * 10);
}
#interviews-article .container figure + h3,
#interviews-article .container img + h3,
#interviews-article .container a + h3,
#interviews-article .container p + h3,
#interviews-article .container ul + h3,
#interviews-article .container ol + h3,
#interviews-article .container div + h3,
#interviews-article .container figure + h4,
#interviews-article .container img + h4,
#interviews-article .container a + h4,
#interviews-article .container p + h4,
#interviews-article .container ul + h4,
#interviews-article .container ol + h4,
#interviews-article .container div + h4,
#interviews-article .container figure + h5,
#interviews-article .container img + h5,
#interviews-article .container a + h5,
#interviews-article .container p + h5,
#interviews-article .container ul + h5,
#interviews-article .container ol + h5,
#interviews-article .container div + h5,
#interviews-article .container figure + h6,
#interviews-article .container img + h6,
#interviews-article .container a + h6,
#interviews-article .container p + h6,
#interviews-article .container ul + h6,
#interviews-article .container ol + h6,
#interviews-article .container div + h6 {
  margin-top: calc(var(--m) * 6);
}
#interviews-article .container figure + ul,
#interviews-article .container img + ul,
#interviews-article .container a + ul,
#interviews-article .container p + ul,
#interviews-article .container ul + ul,
#interviews-article .container ol + ul,
#interviews-article .container div + ul,
#interviews-article .container figure + ol,
#interviews-article .container img + ol,
#interviews-article .container a + ol,
#interviews-article .container p + ol,
#interviews-article .container ul + ol,
#interviews-article .container ol + ol,
#interviews-article .container div + ol {
  margin-block: calc(var(--m) * 6);
}
#interviews-article .container h2:not(.headline, .subline, .title),
#interviews-article .container h3:not(.headline, .subline, .title),
#interviews-article .container h4:not(.headline, .subline, .title),
#interviews-article .container h5:not(.headline, .subline, .title),
#interviews-article .container h6:not(.headline, .subline, .title) {
  display: block;
  font-weight: 700;
}
#interviews-article .container h2:not(.headline, .subline, .title) {
  margin-bottom: calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 36);
}
#interviews-article .container h3:not(.headline, .subline, .title) {
  padding-bottom: calc(var(--m) * 2);
  border-bottom: 1px solid var(--color);
  margin-bottom: calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 27);
}
#interviews-article .container h4:not(.headline, .subline, .title),
#interviews-article .container h5:not(.headline, .subline, .title),
#interviews-article .container h6:not(.headline, .subline, .title) {
  font-size: calc(var(--base-fs) * 21);
  margin-bottom: calc(var(--m) * 2);
}
#interviews-article .container ul {
  list-style-type: disc;
  -webkit-padding-start: 2em;
          padding-inline-start: 2em;
}
#interviews-article .container ul + p,
#interviews-article .container ul + ul {
  margin-top: calc(var(--m) * 1.5);
}
#interviews-article .container p:not(:last-child),
#interviews-article .container li:not(:last-child) {
  margin-bottom: calc(var(--m) * 1);
}
#interviews-article .container a {
  --link: var(--blue);
  --visited: var(--link);
  --hover: var(--white);
  --hover-bg: var(--black);
  padding: 0 3px;
}
#interviews-article .container a:hover {
  padding: 0 12px 0 3px;
  text-decoration: none;
}
#interviews-article .container table {
  width: 100%;
  border-collapse: collapse;
  font-size: calc(var(--base-fs) * 16.5);
}
#interviews-article .container table tr {
  border-bottom: 1px solid var(--gray);
}
#interviews-article .container table tr:first-of-type {
  border-top: 1px solid var(--gray);
}
#interviews-article .container table tr:nth-of-type(even) {
  background: var(--fog);
}
#interviews-article .container table th,
#interviews-article .container table td {
  padding: calc(var(--m) * 1.5) calc(var(--m) * 2);
  border-right: 1px solid var(--smog);
  text-align: left;
}
#interviews-article .container table th:first-of-type,
#interviews-article .container table td:first-of-type {
  border-left: 1px solid var(--smog);
}
#interviews-article .container table th {
  vertical-align: top;
  font-weight: 500;
}
#interviews-article .container figure:not([class]) {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
#interviews-article .container img {
  aspect-ratio: 3 / 2;
}
#interviews-article .container p img {
  margin-top: calc(var(--m) * 3);
  margin-bottom: calc(var(--m) * 3);
}
#interviews-article .container p + figure,
#interviews-article .container p + img {
  margin-top: calc(var(--m) * 6);
  margin-bottom: calc(var(--m) * 6);
}
#interviews-article .container .wp-element-caption {
  margin-top: var(--m);
  display: inline;
  color: var(--gray);
  font-style: italic;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  background: rgba(255, 255, 255, 0.95);
  position: relative;
  z-index: 1;
}
#interviews-article .container p:first-child {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 720px;
  margin-bottom: calc(var(--m) * 10);
}
#interviews-article .container figure {
  position: relative;
}
#interviews-article .container figure img {
  width: 40vw;
  max-width: 50vw;
}
#interviews-article .container figure::before {
  --square-gap: -2vw;
  --size: min(11vw, 220px);
  display: block;
  width: var(--size);
  height: var(--size);
  background: linear-gradient(to right, var(--gradient-dawn));
  position: absolute;
  bottom: var(--square-gap);
  right: var(--square-gap);
  z-index: -1;
}
#partner-info {
  --color: var(--white);
  padding-top: calc(var(--m) * 7);
}
#partner-info .headline {
  text-align: center;
  margin-bottom: calc(var(--m) * 7);
  position: relative;
  z-index: 1;
}
#partner-info .headline::before {
  display: none;
}
#partner-info .container {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  justify-content: flex-start;
  gap: calc(var(--m) * 7);
  position: relative;
  z-index: 1;
}
#partner-info .image {
  width: 40vw;
  aspect-ratio: 750 / 550;
}
#partner-info .text {
  margin-right: var(--wrap-padding-min);
}
#partner-info .text .name {
  color: var(--color);
  font-size: calc(var(--base-fs) * 36);
  font-weight: 700;
  letter-spacing: 0.1ex;
  margin-bottom: calc(var(--m) * 4);
}
#download-request-form {
  --bg: linear-gradient(to right, var(--gradient-set-full));
  margin-top: calc(var(--m) * 6);
}
body.download-limited section.general {
  padding-bottom: calc(var(--m) * 10);
}
body.download-limited .notice {
  margin-block: calc(var(--m) * 5);
  padding: calc(var(--m) * 5) calc(var(--m) * 5);
  background: linear-gradient(to right, #003666 -10%, #976068 130%);
  color: var(--white);
  font-size: calc(var(--base-fs) * 18);
  line-height: 2;
}
body.download-limited .notice .title {
  font-size: calc(var(--base-fs) * 30);
  font-weight: 700;
  padding-bottom: calc(var(--m) * 1.75);
  border-bottom: 1px solid var(--white);
  margin-bottom: calc(var(--m) * 2);
}
body.download-limited a.download {
  --color: var(--white);
  --bg: var(--deep-orange);
  --border: transparent;
  margin-top: calc(var(--m) * 5);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: calc(var(--m) * 2) calc(var(--m) * 3);
  font-size: calc(var(--base-fs) * 21);
  font-weight: 700;
  white-space: normal;
  text-wrap: wrap;
}
body.download-limited .download-password {
  margin-top: calc(var(--m) * 3);
}
body.download-limited .download-password input[type="password"] {
  border: 1px solid var(--black);
  padding: var(--m) 12px;
  font-size: calc(var(--base-fs) * 21);
  line-height: 1;
  margin-right: var(--m);
}
body.download-limited .download-password [type="submit"]:is(input, button) {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  cursor: pointer;
  padding: var(--m) calc(var(--m) * 2);
  border: 1px solid var(--black);
  background: var(--black);
  color: var(--white);
  font-size: calc(var(--base-fs) * 21);
  line-height: 1;
  transition: var(--transition);
}
@media (hover: hover) {
  body.download-limited .download-password [type="submit"]:is(input, button):hover {
    background: var(--red);
    color: var(--white);
  }
}
/* ==================================================================
	404ページ
================================================================== */
#error404-intro {
  --subline-bg: var(--fog);
  --subline-head: var(--black);
  padding-bottom: calc(var(--m) * 12);
  overflow: visible;
  position: relative;
}
#error404-intro::before {
  display: block;
  width: 40vw;
  height: calc(100% + var(--header-height));
  background: linear-gradient(to right, var(--gradient-dawn));
  position: absolute;
  top: calc(-1 * (var(--header-height) + calc(var(--m) * 5)));
  right: 0;
  z-index: 0;
}