/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */

@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:where([hidden]:not([hidden=until-found])) {
  display: none !important;
}

:where(html) {
  -webkit-text-size-adjust: none;
  color-scheme: dark light;
}

@supports not (min-block-size: 100dvb) {
  :where(html) {
    block-size: 100%;
  }
}
:where(body) {
  block-size: 100%;
  block-size: 100dvb;
  line-height: 1.5;
  font-family: system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

:where(input, button, textarea, select) {
  font: inherit;
  color: inherit;
}

:where(textarea) {
  resize: vertical;
  resize: block;
}

:where(button, label, select, summary, [role=button], [role=option]) {
  cursor: pointer;
}

:where(:disabled) {
  cursor: not-allowed;
}

:where(label:has(> input:disabled), label:has(+ input:disabled)) {
  cursor: not-allowed;
}

:where(button) {
  border-style: solid;
}

:where(a) {
  text-underline-offset: 0.2ex;
}

:where(ul, ol) {
  list-style: none;
}

:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block;
}

:where(img, picture, svg) {
  max-inline-size: 100%;
  block-size: auto;
}

:where(p, h1, h2, h3, h4, h5, h6) {
  overflow-wrap: break-word;
}

:where(hr) {
  border: none;
  border-block-start: 1px solid;
  color: inherit;
  block-size: 0;
  overflow: visible;
}

:where(:focus-visible) {
  outline: 2px solid var(--focus-color, Highlight);
  outline-offset: 2px;
}

:where(.visually-hidden:not(:focus, :active, :focus-within, .not-visually-hidden)) {
  clip-path: inset(50%) !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
  position: absolute !important;
  white-space: nowrap !important;
  border: 0 !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  /* 1 */
  -moz-appearance: none;
       appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit;
  /* 2 */
}

/**
 * カスタムプロパティは _variable.scss に移動しました
 * このファイルは後方互換性のため残しています
 */
/** ============================================
 * CSS Custom Properties (カラー変数)
 * ============================================ */
:root {
  --color-black: #2B2A2E;
  --color-white: #FFFFFF;
  --color-blue: #30306C;
  --color-red: #D18888;
  --color-gray: #CFCFCF;
  --color-bg: #FFFFFF;
  --color-blue-bg: #29295D;
  --font-size: 14px;
  --font-size-copy-16: 16px;
  --font-size-copy-18: 18px;
  --font-size-copy-20: 20px;
  --font-size-copy-24: 24px;
  --line-height: 1.75;
  --letter-spacing: 0.04em;
  --font-family: "ryo-gothic-plusn", sans-serif;
  --font-en: "Libre Baskerville", serif;
}

/** grid system - PC **/
/** grid system - SP **/
/** breakpoint **/
/** easing **/
/** リビール演出（blur+フェード等）の共通パラメータ。
 * イージングは「長く尾を引く減速（余韻）」。
 * JS側の対（reveal.js冒頭）: CustomEase 'cImgReveal' と REVEAL_DURATION。
 * ここを変えたら reveal.js 側も手動で揃えること（SCSS↔JSで自動同期はされない）。 **/
::-moz-selection {
  background-color: var(--color-blue);
  color: var(--color-white);
}
::selection {
  background-color: var(--color-blue);
  color: var(--color-white);
}

body {
  color: var(--color-black);
  font-size: var(--font-size);
  font-family: var(--font-family);
  line-height: var(--line-height);
  letter-spacing: 0.04em;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
  word-break: break-all;
  font-weight: 700;
  background: var(--color-white);
}

a {
  color: var(--color-black);
  text-decoration: none;
  cursor: pointer;
}

video {
  max-width: 100%;
}

#wrapper {
  position: relative;
  z-index: 20;
}

[lang=ja] {
  font-family: var(--font-family);
}

[lang=en] {
  font-family: var(--font-en);
  font-style: italic;
  font-weight: 700;
}

.ff-en {
  font-family: var(--font-en);
  font-style: italic;
  font-weight: 700;
  letter-spacing: 0.56px;
}

.is-pc {
  display: block !important;
}
@media screen and (max-width: 1024px) {
  .is-pc {
    display: none !important;
  }
}

.is-sp {
  display: none !important;
}
@media screen and (max-width: 1024px) {
  .is-sp {
    display: block !important;
  }
}

@keyframes l-footer-arrow-sweep {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  35% {
    transform: translate(16px, 0);
    opacity: 0;
  }
  36% {
    transform: translate(-16px, 0);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes l-footer-nav-arrow-sweep {
  0% {
    transform: translate(0, 0);
    opacity: 1;
    animation-timing-function: cubic-bezier(0.55, 0, 1, 0.45);
  }
  35% {
    transform: translate(16px, 0);
    opacity: 0;
  }
  36% {
    transform: translate(-16px, 0);
    opacity: 0;
    animation-timing-function: cubic-bezier(0.25, 1, 0.5, 1);
  }
  100% {
    transform: translate(5px, 0);
    opacity: 1;
  }
}
.l-footer {
  background: var(--color-black);
  color: var(--color-white);
  padding: 80px 5.125% 41px;
}
@media screen and (max-width: 1024px) {
  .l-footer {
    padding: 60px 14px 99px;
  }
}
.l-footer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .l-footer__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
  }
}
.l-footer__logo {
  display: block;
  flex: none;
  color: var(--color-white);
  max-width: 145px;
  width: 100%;
}
.l-footer__logo svg {
  width: 100%;
}
.l-footer__nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-left: 50px;
}
@media screen and (max-width: 1024px) {
  .l-footer__nav {
    flex-direction: column;
    width: 100%;
    gap: 10px;
    margin-left: 0;
  }
}
.l-footer__nav-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8.5px;
  margin-right: 29.5px;
}
.l-footer__nav-link::before, .l-footer__nav-link::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: scaleX(0.5);
  background: rgba(255, 255, 255, 0.2);
}
.l-footer__nav-link::before {
  left: 0;
}
.l-footer__nav-link::after {
  right: 0;
}
.l-footer__nav-link {
  background-image: linear-gradient(var(--color-white), var(--color-white));
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 2px 0;
  transition: background-size 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) {
  .l-footer__nav-link {
    transition: none;
  }
}
@media (hover: hover) {
  .l-footer__nav-link:hover .l-footer__nav-arrow svg {
    animation: l-footer-nav-arrow-sweep 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateX(5px);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .l-footer__nav-link:hover .l-footer__nav-arrow svg {
    animation: none;
  }
}
@media (hover: hover) {
  .l-footer__nav-link:not(.is-current):hover {
    background-size: 2px 100%;
  }
}
.l-footer__nav-link {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--color-white);
  line-height: 14px;
  white-space: nowrap;
  padding: 10px 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__nav-link {
    width: 100%;
    margin-right: 0;
    gap: 10px;
    height: 40px;
    background: #313034;
  }
}
.l-footer__nav-link:last-child {
  margin-right: 0;
}
.l-footer__nav-link.is-current {
  border-left: 2px solid var(--color-white);
  padding: 10px 10px 10px;
}
.l-footer__nav-link.is-current::before {
  content: none;
}
.l-footer__nav-link.is-current .l-footer__nav-arrow {
  display: none;
}
.l-footer__nav-bar {
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
  height: 34px;
  background: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .l-footer__nav-bar {
    display: none;
  }
}
.l-footer__nav-arrow {
  display: flex;
  align-items: center;
  flex: none;
  color: var(--color-white);
  margin-left: -1px;
}
.l-footer__nav-arrow svg {
  width: 4px;
  height: 8px;
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .l-footer__nav-arrow svg {
    width: 6px;
    height: 9px;
  }
}
.l-footer__mid {
  margin: 80px auto 0;
  width: calc(100% + 20px);
  margin-left: -10px;
}
@media screen and (max-width: 1024px) {
  .l-footer__mid {
    margin-top: 40px;
    width: calc(100% + 10px);
    margin-left: -5px;
    position: relative;
  }
  .l-footer__mid .line-left--sp {
    left: 5px;
  }
  .l-footer__mid .line-right--sp {
    right: 5px;
  }
}
.l-footer__mid-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  position: relative;
}
.l-footer__mid-inner::before, .l-footer__mid-inner::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 0.5px;
  background-color: rgba(255, 255, 255, 0.2);
}
.l-footer__mid-inner::before {
  top: 0;
}
.l-footer__mid-inner::after {
  bottom: 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__mid-inner {
    flex-direction: column;
    border: none;
    padding: 0;
    gap: 10px;
  }
  .l-footer__mid-inner::before, .l-footer__mid-inner::after {
    display: none;
  }
}
.l-footer__mid-inner.js-reveal .line-left,
.l-footer__mid-inner.js-reveal .line-right {
  clip-path: inset(0);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.5s;
}
.l-footer__mid-inner.js-reveal::before, .l-footer__mid-inner.js-reveal::after {
  clip-path: inset(0);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.8s;
}
.l-footer__mid-inner.js-reveal:not(.is-inview) .line-left,
.l-footer__mid-inner.js-reveal:not(.is-inview) .line-right {
  clip-path: inset(0 0 100% 0);
}
.l-footer__mid-inner.js-reveal:not(.is-inview)::before, .l-footer__mid-inner.js-reveal:not(.is-inview)::after {
  clip-path: inset(0 100% 0 0);
}
@media (prefers-reduced-motion: reduce) {
  .l-footer__mid-inner.js-reveal .line-left,
  .l-footer__mid-inner.js-reveal .line-right {
    clip-path: none;
    transition: none;
  }
  .l-footer__mid-inner.js-reveal::before, .l-footer__mid-inner.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.l-footer__info {
  position: relative;
  display: flex;
  align-items: stretch;
  padding: 0 10px;
  min-width: 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__info {
    padding: 0;
  }
  .l-footer__info::before, .l-footer__info::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0.5px;
    background-color: rgba(255, 255, 255, 0.2);
  }
  .l-footer__info::before {
    top: 0;
  }
  .l-footer__info::after {
    bottom: 0;
  }
}
.l-footer__info-img {
  position: relative;
  width: 130px;
  height: 90px;
  flex: none;
}
@media screen and (max-width: 1024px) {
  .l-footer__info-img {
    width: 100px;
    width: 120px;
    margin-left: 5px;
  }
  .l-footer__info-img .line-left {
    display: none;
  }
}
.l-footer__info-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.l-footer__info-body {
  display: flex;
  flex-direction: column;
  margin-left: 19px;
  position: relative;
  min-width: 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__info-body {
    margin-left: 23px;
  }
}
.l-footer__address {
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.04em;
  font-style: normal;
  color: var(--color-white);
  margin-top: -4px;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .l-footer__address {
    font-size: 11px;
  }
}
.l-footer__contact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: var(--font-en);
  margin-bottom: -4px;
  white-space: nowrap;
  margin-top: 16px;
  min-width: 0;
}
.l-footer__contact-row {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .l-footer__contact-row {
    font-size: 11px;
  }
}
.l-footer__contact-row span {
  line-height: 20px;
}
.l-footer__contact-label {
  font-weight: 700;
}
.l-footer__contact-dots {
  margin-top: -2px;
}
.l-footer__contact-dots span {
  display: block;
  width: 3px;
  height: 1px;
  background: var(--color-white);
}
.l-footer__contact-dots span + span {
  margin-top: 2px;
}
.l-footer__banner {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-left: 19px;
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .l-footer__banner {
    margin-left: 0;
    margin-right: 0;
    margin-top: 10px;
    flex-direction: column;
    gap: 10px;
    padding: 0;
  }
}
.l-footer__banner-btn {
  position: relative;
  display: flex;
  align-items: center;
  width: 240px;
  background: var(--color-white);
  padding: 15px 10px;
}
@media (hover: hover) {
  .l-footer__banner-btn:hover .c-btn-arrow__glyph {
    animation: l-footer-arrow-sweep 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .l-footer__banner-btn:hover .c-btn-arrow__glyph {
    animation: none;
  }
}
@media screen and (max-width: 1024px) {
  .l-footer__banner-btn {
    width: calc(100% - 10px);
    margin: 0 auto;
    height: 90px;
  }
  .l-footer__banner-btn .line-right, .l-footer__banner-btn .line-left {
    display: none;
  }
  .l-footer__banner-btn::before, .l-footer__banner-btn::after {
    content: "";
    position: absolute;
    width: calc(100% + 10px);
    height: 0.5px;
    background-color: rgba(255, 255, 255, 0.2);
    left: -5px;
  }
  .l-footer__banner-btn::before {
    top: -1px;
    left: -5px;
  }
  .l-footer__banner-btn::after {
    bottom: 1px;
  }
}
.l-footer__banner-img {
  width: 81px;
  height: 60px;
  flex: none;
}
.l-footer__banner-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
@media screen and (max-width: 1024px) {
  .l-footer__banner-img {
    width: 110px;
  }
}
.l-footer__banner-body {
  flex: 1;
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
.l-footer__banner-text {
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  color: #3a3a3a;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .l-footer__banner-text {
    font-size: 14px;
    line-height: 20px;
  }
}
.l-footer__banner-en {
  font-family: var(--font-en);
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
  letter-spacing: 0.04em;
  color: #3a3a3a;
}
.l-footer__middle {
  margin: 50px 0 0 -10px;
  width: calc(100% + 20px);
}
@media screen and (max-width: 1024px) {
  .l-footer__middle {
    width: calc(100% + 10px);
    margin: 40px 0 0 -5px;
  }
}
.l-footer__middle-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .l-footer__middle-inner {
    margin-top: 40px;
  }
}
.l-footer__middle-inner::before, .l-footer__middle-inner::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 0.5px;
  background-color: rgba(255, 255, 255, 0.2);
}
.l-footer__middle-inner::before {
  top: 0;
}
.l-footer__middle-inner::after {
  bottom: 0;
}
.l-footer__middle-inner.js-reveal .line-left,
.l-footer__middle-inner.js-reveal .line-right {
  clip-path: inset(0);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.5s;
}
.l-footer__middle-inner.js-reveal::before, .l-footer__middle-inner.js-reveal::after {
  clip-path: inset(0);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.8s;
}
.l-footer__middle-inner.js-reveal:not(.is-inview) .line-left,
.l-footer__middle-inner.js-reveal:not(.is-inview) .line-right {
  clip-path: inset(0 0 100% 0);
}
.l-footer__middle-inner.js-reveal:not(.is-inview)::before, .l-footer__middle-inner.js-reveal:not(.is-inview)::after {
  clip-path: inset(0 100% 0 0);
}
@media (prefers-reduced-motion: reduce) {
  .l-footer__middle-inner.js-reveal .line-left,
  .l-footer__middle-inner.js-reveal .line-right {
    clip-path: none;
    transition: none;
  }
  .l-footer__middle-inner.js-reveal::before, .l-footer__middle-inner.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.l-footer__license {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0.04em;
  color: var(--color-white);
  padding-left: 10px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .l-footer__license {
    padding-left: 5px;
  }
}
.l-footer__license-text {
  position: relative;
}
.l-footer__sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 91px;
  position: relative;
}
.l-footer__sns::before, .l-footer__sns::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 0.5px;
  background-color: rgba(255, 255, 255, 0.2);
}
.l-footer__sns::before {
  top: 0;
}
.l-footer__sns::after {
  bottom: 0;
}
.l-footer__sns-link {
  display: flex;
  align-items: center;
  color: var(--color-white);
  position: relative;
}
@media (hover: hover) {
  .l-footer__sns-link:hover {
    color: rgba(255, 255, 255, 0.7);
  }
}
.l-footer__bottom {
  margin: 27px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .l-footer__bottom {
    margin-top: 55px;
  }
}
.l-footer__copyright {
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 300;
  line-height: 14px;
  letter-spacing: 0.04em;
  color: var(--color-white);
}
.l-footer__corp-link {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: var(--color-white);
  line-height: 14px;
}
@media (hover: hover) {
  .l-footer__corp-link:hover .l-footer__corp-arrow-move {
    transform: translate(2px, -2px);
  }
}
.l-footer__corp-arrow {
  display: flex;
  align-items: center;
  color: var(--color-white);
}
.l-footer__corp-arrow-move {
  transition: transform 0.3s ease;
}

.line-left {
  content: "";
  position: absolute;
  left: 0;
  height: calc(100% + 20px);
  width: 0.5px;
  top: -10px;
  background-color: rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 1024px) {
  .line-left {
    height: calc(100% + 10px);
    top: -5px;
  }
}

.line-right {
  content: "";
  position: absolute;
  right: 0;
  height: calc(100% + 20px);
  width: 0.5px;
  top: -10px;
  background-color: rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 1024px) {
  .line-right {
    height: calc(100% + 10px);
    top: -5px;
  }
}

@keyframes l-header-arrow-sweep {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  35% {
    transform: translate(16px, 0);
    opacity: 0;
  }
  36% {
    transform: translate(-16px, 0);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 30;
}
@media screen and (max-width: 1024px) {
  .l-header {
    top: 18px;
    left: 14px;
    z-index: 2;
  }
}
.l-header__main {
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-white);
  transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
@media screen and (max-width: 1024px) {
  .l-header__main {
    height: auto;
    background: none;
  }
}
.l-header__logo {
  margin-left: 5.125%;
}
@media screen and (max-width: 1024px) {
  .l-header__logo {
    width: 114px;
    margin-left: 0;
  }
}
.l-header__logo a {
  display: block;
}
.l-header__logo a svg {
  display: block;
}
@media screen and (max-width: 1024px) {
  .l-header__logo a svg {
    width: 100%;
    height: auto;
  }
}
.l-header__right {
  display: flex;
  height: 100%;
}
.l-header__right nav {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}
.l-header__nav {
  display: flex;
  align-items: center;
  gap: 24px;
  height: 100%;
  margin-right: 40px;
  transition: gap 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin-right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
@media screen and (max-width: 1024px) {
  .l-header__nav {
    display: none;
  }
}
.l-header__nav-item {
  height: 100%;
  font-size: 12px;
  line-height: 30px;
  letter-spacing: 0.04em;
  transition: font-size 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-header__nav-item a {
  display: flex;
  align-items: center;
  height: 100%;
}
.l-header__nav-marker {
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 3px;
  background: #2B2A2E;
  border-radius: 0 0 2px 2px;
  visibility: hidden;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-header__nav-marker.is-ready {
  visibility: visible;
}
@media (prefers-reduced-motion: reduce) {
  .l-header__nav-marker {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .l-header__nav-marker {
    display: none;
  }
}
.l-header__cv {
  position: relative;
  border-radius: 0 0 0px 2px;
  width: 180px;
  background: var(--color-black);
  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
@media screen and (max-width: 1024px) {
  .l-header__cv {
    display: none;
  }
}
@media (hover: hover) {
  .l-header__cv:hover .l-header__cv-main svg {
    animation: l-header-arrow-sweep 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .l-header__cv:hover .l-header__cv-main svg {
    animation: none;
  }
}
.l-header__cv-inner {
  position: absolute;
  inset: 0;
  display: block;
}
.l-header__cv-thumbnail {
  position: absolute;
  left: 20px;
  top: 11px;
  width: 140px;
  height: 60px;
  border-radius: 2px;
  overflow: hidden;
  transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1), top 0.4s cubic-bezier(0.4, 0, 0.2, 1), width 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-header__cv-thumbnail img,
.l-header__cv-thumbnail video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
.l-header__cv-main {
  position: absolute;
  left: 20px;
  top: 79px;
  width: 140px;
  height: 30px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 14px;
  white-space: nowrap;
  background: #363538;
  color: var(--color-white);
  transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1), top 0.4s cubic-bezier(0.4, 0, 0.2, 1), width 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-header__cv-main svg {
  width: 4px;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 1025px) {
  .l-header.is-scrolled .l-header__main {
    height: 80px;
  }
  .l-header.is-scrolled .l-header__cv {
    width: 295px;
  }
  .l-header.is-scrolled .l-header__cv-thumbnail {
    left: 15px;
    top: 15px;
    width: 100px;
    height: 50px;
  }
  .l-header.is-scrolled .l-header__cv-main {
    left: 130px;
    top: 15px;
    width: 150px;
    height: 50px;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1115px) {
  .l-header.is-scrolled .l-header__nav {
    gap: 14px;
    margin-right: 25px;
  }
  .l-header.is-scrolled .l-header__nav-item {
    font-size: 11px;
  }
}

.l-page {
  padding-top: 124px;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .l-page {
    padding-top: 0;
  }
}
@media screen and (min-width: 1025px) {
  .l-page:has(.js-kv[data-kv-mode=scroll]) {
    padding-top: 0;
  }
}

.l-fixed-nav {
  display: none;
}
@media screen and (max-width: 1024px) {
  .l-fixed-nav {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    gap: 5px;
    z-index: 100;
  }
}
.l-fixed-nav__btn {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--color-black);
  height: 60px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  color: #fff;
}
.l-fixed-nav__btn--contact {
  flex: 1;
  padding-left: 10px;
  border-radius: 0 2px 2px 0;
}
.l-fixed-nav__btn--menu {
  width: 39.9491094148%;
  padding: 0 14px;
  justify-content: center;
  border-radius: 2px 0 0 2px;
}
.l-fixed-nav__img {
  width: 80px;
  height: 40px;
  -o-object-fit: cover;
     object-fit: cover;
  flex-shrink: 0;
}
.l-fixed-nav__burger {
  position: relative;
  flex-shrink: 0;
  width: 10px;
  height: 8px;
}
.l-fixed-nav__burger span {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: #fff;
  transform-origin: center;
  transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1), bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-fixed-nav__burger span:nth-child(1) {
  top: 0;
}
.l-fixed-nav__burger span:nth-child(2) {
  top: 50%;
  margin-top: -0.5px;
}
.l-fixed-nav__burger span:nth-child(3) {
  bottom: 0;
}
.l-fixed-nav__label-roll {
  position: relative;
  overflow: hidden;
  height: 14px;
  flex-shrink: 0;
  font-size: 12px;
  width: 4.16em;
  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-fixed-nav__label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  line-height: 14px;
  letter-spacing: 0.04em;
  color: #fff;
  white-space: nowrap;
}
.l-fixed-nav__label--menu {
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-fixed-nav__label--close {
  position: absolute;
  inset: 0;
  transform: translateY(100%);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__burger span:nth-child(1) {
  top: 50%;
  margin-top: -0.5px;
  transform: rotate(45deg);
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__burger span:nth-child(2) {
  transform: scaleX(0);
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__burger span:nth-child(3) {
  bottom: 50%;
  margin-bottom: -0.5px;
  transform: rotate(-45deg);
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__label-roll {
  width: 3.12em;
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__label--menu {
  transform: translateY(-100%);
}
.l-fixed-nav__btn--menu[aria-expanded=true] .l-fixed-nav__label--close {
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .l-fixed-nav__burger span, .l-fixed-nav__label-roll, .l-fixed-nav__label--menu, .l-fixed-nav__label--close {
    transition: none;
  }
}

.l-drawer {
  display: none;
}
@media screen and (max-width: 1024px) {
  .l-drawer {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 50;
    visibility: hidden;
    transform: translateY(-100%);
    pointer-events: none;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.4s;
  }
  .l-drawer.is-open {
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s;
  }
}
@media screen and (max-width: 1024px) and (prefers-reduced-motion: reduce) {
  .l-drawer, .l-drawer.is-open {
    transition: none;
  }
}
.l-drawer__panel {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-top: 18px;
}
.l-drawer__panel .l-footer__banner {
  order: -1;
}

html.is-drawer-open,
html.is-drawer-open body {
  overflow: hidden;
}

.l-wrapper {
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
  padding: 0 78px;
}
@media screen and (max-width: 1024px) {
  .l-wrapper {
    padding: 0 15px 0 15px;
  }
}

.c-btn-arrow {
  position: absolute;
  right: -11px;
  bottom: -10px;
  width: 50px;
  height: 50px;
  pointer-events: none;
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .c-btn-arrow {
    right: -5px;
    bottom: -5px;
    width: 40px;
    height: 40px;
  }
}
.c-btn-arrow--portfolio {
  right: -10px;
}
@media screen and (max-width: 1024px) {
  .c-btn-arrow--portfolio {
    bottom: -10px;
    width: 50px;
    height: 50px;
  }
}
.c-btn-arrow__glyph {
  transition: transform 0.3s ease;
}
.c-btn-arrow__sep {
  --sep-scale: 8.334;
  transform-box: fill-box;
  transform-origin: center;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-btn-arrow__sep {
    transition: none;
  }
}
svg.is-sp .c-btn-arrow__sep {
  --sep-scale: 6.667;
}

.c-under-kv {
  position: relative;
  z-index: 1;
}
.c-under-kv__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  padding: 0 82px;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    padding: 0 14px;
  }
}
.c-under-kv__inner--post {
  align-items: flex-end;
}
.c-under-kv__title {
  font-size: 22px;
  line-height: 28px;
  letter-spacing: 6px;
  writing-mode: vertical-rl;
  grid-column: 2/3;
  justify-self: flex-start;
  margin-top: 64px;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__title {
    grid-column: 1/2;
    justify-self: flex-end;
    margin-top: 131px;
    letter-spacing: 3px;
    margin-right: -5px;
  }
}
.c-under-kv__video, .c-under-kv__image {
  border-radius: 2px 0 0 2px;
  grid-column: 4/13;
  height: 400px;
  margin-right: -82px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__video, .c-under-kv__image {
    height: 100vh;
    grid-column: 4/6;
    margin-left: calc(-1 * (100% + 6 * 20px) / 6.5);
    margin-right: -14px;
    border-radius: 0;
  }
}
.c-under-kv__video picture, .c-under-kv__image picture {
  display: block;
  width: 100%;
  height: 100%;
}
.c-under-kv__video video,
.c-under-kv__video img, .c-under-kv__image video,
.c-under-kv__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.c-under-kv__video {
  border-radius: 2px 0 0 2px;
}
@media screen and (min-width: 1024px) {
  .c-under-kv__image {
    grid-column: 6/13;
  }
}
.c-under-kv__message {
  max-width: 678px;
  position: absolute;
  right: 0;
  bottom: -8px;
  background: var(--color-white);
  padding: 44px 20px 0 40px;
  border-radius: 2px 0 0 0;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__message {
    bottom: 0;
    left: 14px;
    width: calc(100% - 14px);
    padding: 29px 20px 12px;
    border-radius: 0;
  }
}
.c-under-kv__message dt {
  font-size: 22px;
  line-height: 42px;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__message dt {
    line-height: 40px;
  }
}
.c-under-kv__message dd {
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
  margin-top: 20px;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__message dd {
    line-height: 26px;
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .c-under-kv__message--pl-0 {
    padding: 29px 20px 12px 0;
  }
}
.c-under-kv__detail {
  grid-column: 2/5;
}
.c-under-kv__detail * {
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__detail {
    bottom: 0;
    left: 14px;
    width: calc(100% - 14px);
    padding: 40px 20px 120px;
    max-width: 678px;
    position: absolute;
    right: 0;
    bottom: -8px;
    background: var(--color-white);
    z-index: 1;
  }
}
.c-under-kv__detail-head dt {
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 15px;
}
@media screen and (max-width: 1024px) {
  .c-under-kv__detail-head dt {
    font-size: 12px;
    gap: 0 10px;
  }
}
.c-under-kv__detail-head dd {
  margin-top: 15px;
  font-size: 20px;
  letter-spacing: 0.04em;
}
.c-under-kv__detail-head dd span {
  font-size: 12px;
}
.c-under-kv__detail-text {
  margin-top: 43px;
  font-size: 21px;
  line-height: 36px;
  letter-spacing: 0.04em;
}

.c-build {
  width: 100%;
  padding: 133px 0 122px;
  background-color: #FAFAF8;
  background-image: url("../images/index/noise_light.svg");
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.c-build__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .c-build__inner {
    display: flex;
    flex-direction: column;
  }
}
.c-build__detail {
  grid-column: 2/5;
}
.c-build__detail-button {
  min-width: 385px;
}
.c-build__drawing {
  grid-column: 5/11;
  display: grid;
  place-items: center;
  max-width: 565px;
  width: 85%;
  margin: 0 auto;
  background: #fff;
  mix-blend-mode: multiply;
}
.c-build__drawing-img {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  aspect-ratio: 566/551;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  visibility: hidden;
  opacity: 0;
  transform: scale(1.04);
  transform-origin: center;
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
}
.c-build__drawing-img.is-active {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .c-build__drawing-img, .c-build__drawing-img.is-active {
    transition: none;
  }
}
.c-build__drawing.c-img-reveal.js-reveal .c-build__drawing-img {
  transform: scale(1.04);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
}
.c-build__drawing.c-img-reveal.js-reveal .c-build__drawing-img.is-active {
  transform: scale(1);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
}
.c-build__drawing-caption {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  justify-self: center;
  z-index: 10;
  margin-bottom: 10%;
  min-height: 62px;
  padding: 8px 28px;
  width: 80%;
  background: rgba(54, 53, 57, 0.8980392157);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.11em;
  line-height: 1.6;
  text-align: center;
  pointer-events: none;
  display: grid;
  align-items: center;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.c-build__drawing-caption:not(:has(.is-active)) {
  opacity: 0;
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .c-build__drawing-caption {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .c-build__drawing-caption {
    font-size: 12px;
    min-height: 51px;
    padding: 8px 15px;
    margin-bottom: 2%;
    width: calc(100vw - 30px);
    justify-self: center;
  }
}
@media screen and (max-width: 768px) {
  .c-build__drawing-caption {
    justify-self: start;
    margin-left: min(0px, 11.888889vw - 65.567px);
  }
}
.c-build__drawing-caption-text {
  grid-area: 1/1;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.c-build__drawing-caption-text.is-active {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.65s, visibility 0s 0.65s;
}
@media (prefers-reduced-motion: reduce) {
  .c-build__drawing-caption-text, .c-build__drawing-caption-text.is-active {
    transition: none;
  }
}
.c-build__drawing.is-draw-mode .c-build__drawing-img, .c-build__drawing.is-draw-mode.c-img-reveal.js-reveal .c-build__drawing-img {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.c-build__drawing.is-draw-mode .c-build__drawing-img.is-active, .c-build__drawing.is-draw-mode.c-img-reveal.js-reveal .c-build__drawing-img.is-active {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.c-build__tab {
  grid-column: 11/13;
  display: flex;
  align-items: center;
  width: calc(100% + 82px);
}
.c-build__tab-list {
  position: relative;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.c-build__tab-item::before {
  content: "";
  display: block;
  margin-left: 20px;
  height: 2.5px;
  background: linear-gradient(to bottom, #2B2B2D 0px, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px, #2B2B2D 2.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-build__tab-item::before {
    height: 3px;
    background: linear-gradient(to bottom, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.c-build__tab-item::before {
  transition: margin-left 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-build__tab-item.is-active::before, .c-build__tab-item.is-active + .c-build__tab-item::before, .c-build__tab-item.is-active:last-child::after {
  margin-left: 0;
}
.c-build__tab-item:last-child::after {
  content: "";
  display: block;
  margin-left: 20px;
  height: 2.5px;
  background: linear-gradient(to bottom, #2B2B2D 0px, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px, #2B2B2D 2.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-build__tab-item:last-child::after {
    height: 3px;
    background: linear-gradient(to bottom, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.c-build__tab-item:last-child::after {
  transition: margin-left 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-build__tab-btn {
  display: flex;
  align-items: center;
  gap: 15px;
  width: 100%;
  padding: 19px 20px;
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
}
@media (hover: hover) {
  .c-build__tab-btn:hover .c-build__tab-dot {
    background: var(--color-black);
  }
}
.c-build__tab-btn::before, .c-build__tab-btn::after {
  content: "";
  position: absolute;
  left: 0;
  width: 2.5px;
  height: 22.5px;
  transform: scaleY(0);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-build__tab-btn::before {
  top: -22.5px;
  transform-origin: bottom;
  background: linear-gradient(to bottom, transparent calc(100% - 2.5px), #2B2B2D calc(100% - 2.5px)), linear-gradient(to right, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px);
}
@media (max-resolution: 1.5dppx) {
  .c-build__tab-btn::before {
    width: 3px;
    background: linear-gradient(to bottom, transparent calc(100% - 3px), #999999 calc(100% - 3px)), linear-gradient(to right, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.c-build__tab-btn::after {
  bottom: -22.5px;
  transform-origin: top;
  background: linear-gradient(to bottom, #2B2B2D 2.5px, transparent 2.5px), linear-gradient(to right, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px);
}
@media (max-resolution: 1.5dppx) {
  .c-build__tab-btn::after {
    width: 3px;
    background: linear-gradient(to bottom, #999999 3px, transparent 3px), linear-gradient(to right, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.c-build__tab-item.is-active .c-build__tab-btn::before, .c-build__tab-item.is-active .c-build__tab-btn::after {
  transform: scaleY(1);
  transition-delay: 0.08s;
}
.c-build__tab-dot {
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #C8C8C8;
  transition: background 0.3s;
}
.c-build__tab-text {
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  color: #2B2A2E;
}
.c-build__tab-item.is-active .c-build__tab-dot {
  background: #2B2B2D;
}
.c-build__tab-foot {
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .c-build__tab-btn::before, .c-build__tab-btn::after, .c-build__tab-item::before, .c-build__tab-item:last-child::after, .c-build__tab-dot {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .c-build {
    padding: 109px 0 114px;
  }
  .c-build__detail {
    display: contents;
  }
  .c-build .c-title {
    order: 1;
  }
  .c-build__detail-lead {
    order: 2;
  }
  .c-build__tab {
    order: 4;
  }
  .c-build__drawing {
    order: 5;
  }
  .c-build__detail-button {
    order: 6;
    min-width: 0;
  }
  .c-build__tab {
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-top: 40px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    align-items: flex-start;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .c-build__tab::-webkit-scrollbar {
    display: none;
  }
  .c-build__tab-list {
    display: flex;
    flex-direction: row;
    padding: 0 20px;
  }
  .c-build__tab-item {
    flex-shrink: 0;
    position: relative;
    padding: 2px 2px 0;
  }
  .c-build__tab-item::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: 0;
    width: auto;
    height: auto;
    z-index: 1;
    pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%202%202.5'%3E%3Cline%20x1='0'%20y1='.25'%20x2='2'%20y2='.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='0'%20y1='2.25'%20x2='2'%20y2='2.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3C/svg%3E") left top/100% 2.5px no-repeat, url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%202.5%202'%3E%3Cline%20x1='.25'%20y1='0'%20x2='.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='2.25'%20y1='0'%20x2='2.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3C/svg%3E") right top/2.5px 100% no-repeat;
  }
  .c-build__tab-item:last-child::after {
    display: none;
  }
  .c-build__tab-item:first-child::before {
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%202%202.5'%3E%3Cline%20x1='0'%20y1='.25'%20x2='2'%20y2='.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='0'%20y1='2.25'%20x2='2'%20y2='2.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3C/svg%3E") left top/100% 2.5px no-repeat, url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%202.5%202'%3E%3Cline%20x1='.25'%20y1='0'%20x2='.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='2.25'%20y1='0'%20x2='2.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3C/svg%3E") right top/2.5px 100% no-repeat, url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%202.5%202'%3E%3Cline%20x1='.25'%20y1='0'%20x2='.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='2.25'%20y1='0'%20x2='2.25'%20y2='2'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3C/svg%3E") left top/2.5px 100% no-repeat;
  }
  .c-build__tab-btn {
    height: 40px;
    padding: 0 15px;
    gap: 10px;
    border: none;
  }
  .c-build__tab-btn::before, .c-build__tab-btn::after {
    display: none;
  }
  .c-build__tab-text {
    font-size: 10px;
    line-height: 1;
    white-space: nowrap;
    color: #c8c8c8;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .c-build__tab-item.is-active .c-build__tab-text {
    color: #2B2A2E;
  }
  .c-build__tab-item.is-active .c-build__tab-dot {
    background: #2B2A2E;
  }
  .c-build__tab-foot {
    display: block;
    position: absolute;
    left: -8px;
    right: -8px;
    bottom: 0;
    height: 2.5px;
    z-index: 1;
    pointer-events: none;
  }
  .c-build__tab-foot::before, .c-build__tab-foot::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 10px;
    height: 2.5px;
    transform: scaleX(0);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .c-build__tab-foot::before {
    left: 0;
    transform-origin: right;
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%2010%202.5'%3E%3Cline%20x1='0'%20y1='.25'%20x2='10'%20y2='.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='0'%20y1='2.25'%20x2='10'%20y2='2.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Crect%20x='8'%20y='.5'%20width='2'%20height='2'%20fill='%232B2B2D'/%3E%3C/svg%3E") left bottom/10px 2.5px no-repeat;
  }
  .c-build__tab-foot::after {
    right: 0;
    transform-origin: left;
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20preserveAspectRatio='none'%20viewBox='0%200%2010%202.5'%3E%3Cline%20x1='0'%20y1='.25'%20x2='10'%20y2='.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Cline%20x1='0'%20y1='2.25'%20x2='10'%20y2='2.25'%20stroke='%232B2B2D'%20stroke-width='.5'/%3E%3Crect%20x='0'%20y='.5'%20width='2'%20height='2'%20fill='%232B2B2D'/%3E%3C/svg%3E") right bottom/10px 2.5px no-repeat;
  }
  .c-build__tab-item:not(:first-child) .c-build__tab-foot {
    left: -10px;
  }
  .c-build__tab-item.is-active .c-build__tab-foot::before, .c-build__tab-item.is-active .c-build__tab-foot::after {
    transform: scaleX(1);
  }
}
@media screen and (max-width: 1024px) and (prefers-reduced-motion: reduce) {
  .c-build__tab-foot::before, .c-build__tab-foot::after, .c-build__tab-text {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .c-build__drawing {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  .c-build__drawing {
    max-width: none;
    width: 111.888889%;
    margin-right: -62px;
  }
}

@keyframes c-button-arrow-sweep {
  0% {
    transform: translateX(2px);
    opacity: 1;
  }
  35% {
    transform: translateX(16px);
    opacity: 0;
  }
  36% {
    transform: translateX(-16px);
    opacity: 0;
  }
  100% {
    transform: translateX(2px);
    opacity: 1;
  }
}
@keyframes c-button-arrow-sweep-diag {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  35% {
    transform: translate(14px, -14px);
    opacity: 0;
  }
  36% {
    transform: translate(-14px, 14px);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
.c-button {
  color: var(--color-black);
  max-width: 358px;
  width: 100%;
  position: relative;
  display: inline-flex;
  align-items: stretch;
  height: 80px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .c-button {
    max-width: none;
    height: 70px;
  }
}
@media (hover: hover) {
  .c-button:hover .c-button__arrow-area:not(.c-button__arrow-area--02) svg {
    animation: c-button-arrow-sweep 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-button:hover .c-button__arrow-area:not(.c-button__arrow-area--02) svg {
    animation: none;
  }
}
@media (hover: hover) {
  .c-button:hover .c-button__arrow-area--02 svg {
    animation: c-button-arrow-sweep-diag 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-button:hover .c-button__arrow-area--02 svg {
    animation: none;
  }
}
@media (hover: hover) {
  .c-button:hover .c-button__frame-line {
    stroke-dashoffset: var(--frame-len, 696);
  }
  .c-button:hover .c-button__arrow-area::before {
    background-size: 100% 100%, 100% 100%;
  }
}
.c-button::before {
  content: "";
  position: absolute;
  inset: 9px 0 11px 0;
  border: 1px solid var(--color-black);
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .c-button::before {
    inset: 5px 0 6px 0;
  }
}
.c-button--framed::before {
  border: none;
}
.c-button__frame {
  position: absolute;
  top: 9px;
  left: 0;
  width: 100%;
  height: calc(100% - 20px);
  display: block;
  overflow: visible;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .c-button__frame {
    top: 5px;
    height: calc(100% - 11px);
  }
}
.c-button__frame rect {
  fill: none;
  stroke: currentColor;
  stroke-width: 1px;
}
.c-button__frame-track {
  stroke-opacity: 0.1;
}
.c-button__frame-line {
  stroke-dasharray: var(--frame-len, 696);
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-button__frame-line {
    transition: none;
  }
}
.c-button::after {
  content: "";
  position: absolute;
  top: 7.5px;
  left: -1.5px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
  box-shadow: 0 59px 0 var(--color-black);
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .c-button::after {
    width: 2px;
    height: 2px;
    top: 4px;
    left: -0.5px;
    box-shadow: 0 59px 0 var(--color-black);
  }
}
.c-button__label {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 0 5px 0 32px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.11em;
  color: var(--color-black);
  text-box: normal !important;
}
@media screen and (max-width: 1024px) {
  .c-button__label {
    padding: 0 5px 0 21px;
  }
}
.c-button__arrow-area {
  position: relative;
  flex-shrink: 0;
  width: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-button__arrow-area svg {
  transform: translateX(2px);
  transition: transform 0.3s ease;
}
.c-button__arrow-area::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0;
  bottom: 0;
  width: 1px;
  background-image: linear-gradient(#2B2A2E, #2B2A2E), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 16px, 100% 100%;
  transition: background-size 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.c-button__arrow-area::after {
  content: "";
  position: absolute;
  top: 7.5px;
  right: -1.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-button__arrow-area::after {
    right: -1px;
  }
}
.c-button__arrow-area::after {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
  box-shadow: 0 59px 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-button__arrow-area::after {
    width: 2px;
    height: 2px;
    top: 4px;
    right: -0.5px;
    box-shadow: 0 59px 0 var(--color-black);
  }
}
.c-button__arrow-area--02 svg {
  margin-top: -5px;
  margin-left: 5px;
  transform: none;
}
@media screen and (max-width: 1024px) {
  .c-button__arrow-area--02 svg {
    width: 9px;
  }
}
.c-button__arrow-area--02 .c-button__arrow-move {
  transition: transform 0.3s ease;
}
.c-button--white {
  color: var(--color-white);
}
.c-button--white::before {
  border-color: var(--color-white);
}
.c-button--white::after {
  background: var(--color-white);
  box-shadow: 0 59px 0 var(--color-white);
}
@media screen and (max-width: 1024px) {
  .c-button--white::after {
    box-shadow: 0 59px 0 var(--color-white);
  }
}
.c-button--white .c-button__label {
  color: var(--color-white);
}
.c-button--white .c-button__arrow-area::before {
  background-image: linear-gradient(var(--color-white), var(--color-white)), linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
}
.c-button--white .c-button__arrow-area::after {
  background: var(--color-white);
  box-shadow: 0 59px 0 var(--color-white);
}
@media screen and (max-width: 1024px) {
  .c-button--white .c-button__arrow-area::after {
    box-shadow: 0 59px 0 var(--color-white);
  }
}
@media screen and (min-width: 1024px) {
  .c-button--large {
    height: 100px;
  }
  .c-button--large:after {
    box-shadow: 0 79px 0 var(--color-black);
  }
  .c-button--large .c-button__arrow-area:after {
    box-shadow: 0 79px 0 var(--color-black);
  }
  .c-button--large .c-button__label {
    justify-content: center;
  }
}

@keyframes c-card-arrow-sweep {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  35% {
    transform: translateX(8px);
    opacity: 0;
  }
  36% {
    transform: translateX(-8px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.c-card {
  width: 356px;
  background: #F5F4F1;
  border-top: 0.5px solid var(--color-gray);
  border-bottom: 0.5px solid var(--color-gray);
  padding: 40px 30px 50px;
  display: flex;
  flex-direction: column;
  position: relative;
  text-decoration: none;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-card {
    padding: 30px 20px 50px;
  }
}
@media (hover: hover) {
  .c-card:hover .c-btn-arrow__glyph {
    animation: c-card-arrow-sweep 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-card:hover .c-btn-arrow__glyph {
    animation: none;
  }
}
@media (hover: hover) {
  .c-card:hover .c-btn-arrow--portfolio .c-btn-arrow__glyph {
    animation: c-button-arrow-sweep-diag 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-card:hover .c-btn-arrow--portfolio .c-btn-arrow__glyph {
    animation: none;
  }
}
@media (hover: hover) {
  .c-card:hover .c-card__frame-line {
    stroke-dashoffset: 0;
  }
  .c-card:hover .c-btn-arrow__sep {
    transform: scaleY(var(--sep-scale, 8.334));
  }
}
.c-card * {
  text-box: trim-both cap alphabetic;
}
.c-card::before, .c-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-gray);
  left: -2px;
}
@media screen and (max-width: 1024px) {
  .c-card::before, .c-card::after {
    width: 2px;
    height: 2px;
    left: -1px;
  }
}
.c-card::before {
  top: -2.5px;
}
@media screen and (max-width: 1024px) {
  .c-card::before {
    top: -1.5px;
  }
}
.c-card::after {
  bottom: -2.5px;
}
@media screen and (max-width: 1024px) {
  .c-card::after {
    bottom: -1.5px;
  }
}
.c-card--framed {
  border-color: transparent;
}
.c-card--framed .c-card__side::before,
.c-card--framed .c-card__side::after {
  background: transparent;
}
.c-card--framed {
  --trace-tone: color-mix(in srgb, var(--color-black) 50%, var(--color-gray));
}
.c-card--framed::before {
  transition: background-color 0.15s linear var(--dot-r-tl, 0s);
}
.c-card--framed::after {
  transition: background-color 0.15s linear var(--dot-r-bl, 0s);
}
.c-card--framed .c-card__corners::before {
  transition: background-color 0.15s linear var(--dot-r-tr, 0s);
}
.c-card--framed .c-card__corners::after {
  transition: background-color 0.15s linear var(--dot-r-br, 0s);
}
@media (prefers-reduced-motion: reduce) {
  .c-card--framed::before, .c-card--framed::after,
  .c-card--framed .c-card__corners::before, .c-card--framed .c-card__corners::after {
    transition: none;
  }
}
@media (hover: hover) {
  .c-card:not(.c-card--portfolio):hover .c-card__img {
    clip-path: inset(10px 0 round 2px);
  }
}
@media (hover: hover) {
  .c-card--framed:not(.c-card--archive):hover::before {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tl, 0s);
  }
  .c-card--framed:not(.c-card--archive):hover::after {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-bl, 0s);
  }
  .c-card--framed:not(.c-card--archive):hover .c-card__corners::before {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tr, 0s);
  }
  .c-card--framed:not(.c-card--archive):hover .c-card__corners::after {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-br, 0s);
  }
}
.c-card__frame {
  position: absolute;
  top: -10px;
  left: 0;
  width: 100%;
  height: calc(100% + 20px);
  display: block;
  overflow: visible;
  pointer-events: none;
}
.c-card__frame path {
  stroke: var(--frame-stroke, var(--color-gray));
  stroke-width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-card__frame path {
    stroke-width: 1px;
  }
}
.c-card__frame-line {
  --frame-stroke: var(--color-black);
  stroke-opacity: 0.5;
  stroke-dasharray: var(--len, 500);
  stroke-dashoffset: var(--len, 500);
  transition: stroke-dashoffset 0.8s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-card__frame-line {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .c-card--archive .c-card__frame {
    top: 0;
    height: 100%;
  }
}
.c-card--portfolio {
  padding: 40px 30px 30px;
}
@media screen and (max-width: 1024px) {
  .c-card--portfolio {
    padding: 40px 25px 30px;
  }
}
.c-card--archive {
  background: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .c-card--archive {
    padding: 30px 20px 40px;
  }
}
.c-card--archive::before, .c-card--archive::after {
  background: var(--color-black);
}
.c-card__corners {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.c-card__corners::before, .c-card__corners::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-gray);
  right: -2px;
}
@media screen and (max-width: 1024px) {
  .c-card__corners::before, .c-card__corners::after {
    width: 2px;
    height: 2px;
    right: -0.5px;
  }
}
.c-card__corners::before {
  top: -2.5px;
}
@media screen and (max-width: 1024px) {
  .c-card__corners::before {
    top: -1.5px;
  }
}
.c-card__corners::after {
  bottom: -2.5px;
  opacity: 0;
}
.c-card__corners--archive::before, .c-card__corners--archive::after {
  background: var(--color-black);
}
.c-card__side {
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: 0;
  right: 0;
  pointer-events: none;
}
.c-card__side::before, .c-card__side::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0.5px;
  background: var(--color-gray);
}
.c-card__side::before {
  left: 0;
}
.c-card__side::after {
  right: 0;
}
@media screen and (max-width: 1024px) {
  .c-card__side--archive {
    top: 0;
    bottom: 0;
  }
}
.c-card__quote {
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-card__quote {
    font-size: 20px;
  }
}
.c-card__quote--archive {
  font-size: 26px;
  padding: 20px 0;
}
@media screen and (max-width: 1024px) {
  .c-card__quote--archive {
    font-size: 20px;
    padding: 18px 0;
  }
}
.c-card--portfolio .c-card__quote {
  min-height: 60px;
}
.c-card__img {
  position: relative;
  height: 222px;
  overflow: hidden;
  margin-top: 25px;
  border-radius: 2px;
  overflow: hidden;
  clip-path: inset(0 round 2px);
  transition: clip-path 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-card__img {
    transition: none;
  }
}
.c-card__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.c-card__img--archive {
  height: 400px;
}
@media screen and (max-width: 1024px) {
  .c-card__img--archive {
    height: auto;
    aspect-ratio: 316/237;
  }
}
.c-card__img--archive img {
  -o-object-position: top;
     object-position: top;
}
.c-card__body {
  display: flex;
  flex-direction: column;
}
.c-card__head {
  display: flex;
  flex-direction: column;
}
.c-card__category {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
  margin-top: 25px;
}
.c-card__tag {
  display: flex;
  align-items: center;
  gap: 5px;
}
.c-card__line {
  display: inline-block;
  flex-shrink: 0;
  width: 5px;
  height: 17px;
  background-image: url("data:image/svg+xml,%3Csvg width='5' height='17' viewBox='0 0 5 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 1H1V16H5' stroke='%232B2A2E' stroke-width='2'/%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (max-width: 1024px) {
  .c-card__line {
    width: 4px;
    height: 12px;
  }
}
.c-card__line--right {
  transform: scaleX(-1);
}
.c-card__type {
  font-size: 14px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-card__type {
    font-size: 12px;
  }
}
.c-card__role {
  font-size: 14px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-card__role {
    font-size: 12px;
  }
}
.c-card__name {
  font-size: 20px;
  line-height: 32px;
  letter-spacing: 0.04em;
  color: var(--color-black);
  font-weight: bold;
  margin-top: 15px;
}
@media screen and (max-width: 1024px) {
  .c-card__name {
    font-size: 18px;
  }
}
.c-card__name span {
  font-size: 12px;
}
.c-card__text {
  margin-top: 25px;
  font-size: 12px;
  font-weight: 700;
  line-height: 22px;
  color: var(--color-black);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  letter-spacing: 0;
  overflow: hidden;
  text-box: normal;
}
@media screen and (max-width: 1024px) {
  .c-card__text {
    font-size: 10px;
    margin-top: 20px;
  }
}
@media screen and (min-width: 1024px) {
  .c-card__text--archive {
    font-size: 14px;
  }
}
.c-card__label {
  position: absolute;
  top: 0;
  right: 0;
  background: #2B2A2E;
  color: #FFFFFF;
  padding: 12px 14px;
  border-radius: 0 2px 0 2px;
  font-size: 14px;
  line-height: 1.286em;
  letter-spacing: 0.04em;
  font-weight: 700;
  text-align: center;
  display: flex;
  flex-direction: column;
  transform: translateZ(0);
  backface-visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .c-card__label {
    font-size: 12px;
    padding: 10px 12px;
  }
}
.c-card__label span:last-child {
  font-size: 10px;
  margin-top: 10px;
}
.c-card__sub {
  font-size: 14px;
  line-height: 1.714em;
  letter-spacing: 0.04em;
  font-weight: 700;
  color: #2B2A2E;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-box: normal;
  margin-top: 20px;
}
@media screen and (max-width: 1024px) {
  .c-card__sub {
    font-size: 12px;
    line-height: 26px;
  }
}
.c-card__detail {
  background: #FFFFFF;
  padding: 15px 20px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-top: 15px;
}
@media screen and (max-width: 1024px) {
  .c-card__detail {
    padding: 15px 20px;
    gap: 12px;
  }
}
.c-card__detail-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12px;
  line-height: 1.833em;
  font-weight: 700;
  color: #2B2A2E;
}
@media screen and (max-width: 1024px) {
  .c-card__detail-item {
    font-size: 10px;
    line-height: 22px;
  }
}
.c-card__detail-item dt {
  flex-shrink: 0;
  position: relative;
  padding-right: 10px;
}
.c-card__detail-item dt::before, .c-card__detail-item dt::after {
  content: "";
  position: absolute;
  right: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: #2B2A2E;
}
.c-card__detail-item dt::before {
  top: calc(50% - 3px);
}
.c-card__detail-item dt::after {
  top: calc(50% + 1px);
}
.c-card__detail-item dd {
  flex: 1;
  margin: 0;
}

.c-photo-stack {
  position: relative;
}
.c-photo-stack img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 2px;
}
.c-photo-stack img:nth-child(1) {
  z-index: 1;
}
.c-photo-stack img:nth-child(2) {
  z-index: 2;
}
.c-photo-stack img:nth-child(3) {
  z-index: 3;
}
.c-photo-stack img:nth-child(4) {
  z-index: 4;
}
.c-photo-stack img:nth-child(5) {
  z-index: 5;
}
.c-photo-stack img:nth-child(6) {
  z-index: 6;
}
.c-photo-stack img:nth-child(7) {
  z-index: 7;
}

.c-careers {
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .c-careers {
    height: auto;
  }
}
.c-careers__bg {
  position: absolute;
  inset: 0;
  display: flex;
  gap: calc((100% - 136px) / 6);
}
@media screen and (min-width: 1600px) {
  .c-careers__bg {
    gap: 244px;
  }
}
@media screen and (max-width: 1024px) {
  .c-careers__bg {
    gap: 5px;
  }
}
.c-careers__bg-box {
  display: flex;
  gap: 4px;
  flex: none;
  width: calc(98px + 5 * (100% - 208px) / 12);
}
@media screen and (min-width: 1600px) {
  .c-careers__bg-box {
    flex: 1;
    width: auto;
  }
}
@media screen and (max-width: 1024px) {
  .c-careers__bg-box {
    width: 485px;
    gap: 5px;
  }
}
.c-careers__bg-box img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.c-careers__bg-img {
  position: relative;
  height: 100%;
  isolation: isolate;
}
.c-careers__bg-img:nth-child(odd) {
  flex: none;
  width: 52.5073746313%;
}
@media screen and (max-width: 1024px) {
  .c-careers__bg-img:nth-child(odd) {
    width: 50%;
  }
}
.c-careers__bg-img:nth-child(even) {
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .c-careers__bg-img:nth-child(even) {
    flex: none;
    width: 50%;
  }
}
.c-careers__bg-img picture {
  display: block;
  width: 100%;
  height: 100%;
}
.c-careers__bg-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 1;
}
.c-careers__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  padding: 130px 82px 85px;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .c-careers__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    grid-template-rows: auto auto auto;
    height: auto;
    padding: 129px 15px 77px;
  }
}
.c-careers__head {
  grid-column: 2/5;
  align-self: start;
  z-index: 3;
}
@media screen and (max-width: 1024px) {
  .c-careers__head {
    grid-column: 1/4;
    padding: 0;
  }
}
.c-careers__portrait {
  position: absolute;
  grid-column: 4/9;
  top: 51%;
  transform: translateY(-50%);
  z-index: 2;
  width: 104.7%;
  right: -68px;
}
.c-careers__portrait img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 100px;
}
@media screen and (max-width: 1024px) {
  .c-careers__portrait {
    width: 639px;
    grid-column: 1/9;
    left: 0;
    right: auto;
    top: 45.5%;
    margin: 0px;
    margin-left: 9px;
  }
}
.c-careers__vertical {
  grid-column: 6/7;
  grid-row: 1/5;
  align-self: flex-end;
  justify-self: flex-end;
  z-index: 3;
  writing-mode: vertical-rl;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.273em;
  letter-spacing: 0.21em;
  color: var(--color-black);
  margin: 0 -17px -17px 0;
}
@media screen and (max-width: 1024px) {
  .c-careers__vertical {
    position: absolute;
    grid-column: 4/6;
    grid-row: 1;
    align-self: start;
    justify-self: flex-end;
    margin: 0;
    color: var(--color-white);
    margin-right: 13px;
  }
}
.c-careers__textbox {
  grid-column: 2/7;
  grid-row: 2;
  margin-left: -38px;
  margin-top: 73px;
  background: var(--color-white);
  border-radius: 2px 0 0 2px;
}
@media screen and (max-width: 1024px) {
  .c-careers__textbox {
    grid-column: 1/5;
    margin-top: 92px;
    margin-left: -15px;
    border-radius: 0 2px 2px 0;
  }
}
.c-careers__textbox-content {
  position: relative;
  z-index: 3;
  grid-column: 2/6;
  grid-row: 2;
  margin-left: -38px;
  margin-top: 73px;
  padding: 29px 20px 32px 40px;
}
@media screen and (max-width: 1024px) {
  .c-careers__textbox-content {
    grid-column: 1/5;
    padding: 30px 5px 33px 15px;
    margin-top: 92px;
    margin-left: -15px;
  }
}
.c-careers__quote {
  font-size: 18px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: #2B2A2E;
  margin-bottom: 28px;
}
@media screen and (max-width: 1024px) {
  .c-careers__quote {
    font-size: 16px;
    line-height: 28px;
  }
}
.c-careers__sub {
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-careers__sub {
    font-size: 12px;
    line-height: 26px;
  }
}
.c-careers__btn {
  grid-column: 9/13;
  align-self: flex-end;
  z-index: 3;
  margin-bottom: -11px;
}
@media screen and (max-width: 1024px) {
  .c-careers__btn {
    grid-column: 1/-1;
    margin-bottom: 0;
    margin-top: 35px;
  }
}

@keyframes c-makers-arrow-sweep-next {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  35% {
    transform: translateX(16px);
    opacity: 0;
  }
  36% {
    transform: translateX(-16px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes c-makers-arrow-sweep-prev {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  35% {
    transform: translateX(-16px);
    opacity: 0;
  }
  36% {
    transform: translateX(16px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.c-makers {
  padding: 130px 0 120px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .c-makers {
    padding: 109px 0 113px;
  }
}
.c-makers__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .c-makers__inner {
    display: flex;
    flex-direction: column;
  }
}
.c-makers__upper {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  align-content: start;
}
@media screen and (max-width: 1024px) {
  .c-makers__upper {
    display: contents;
  }
}
.c-makers__head {
  grid-column: 2/8;
}
@media screen and (max-width: 1024px) {
  .c-makers__head {
    order: 1;
  }
}
.c-makers__right {
  grid-column: 9/12;
  align-self: start;
  margin-top: 132px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.c-makers__right .c-button {
  max-width: none;
}
@media screen and (max-width: 1024px) {
  .c-makers__right {
    order: 3;
    margin-top: 44px;
    gap: 50px;
    width: 100%;
  }
  .c-makers__right .c-button {
    order: 2;
  }
  .c-makers__right .c-makers__nav {
    order: 1;
  }
}
.c-makers__nav {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;
  max-width: 381px;
  width: auto;
  margin-inline: -10px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav {
    width: auto;
    max-width: none;
    margin-inline: -5px;
  }
}
.c-makers__nav::before, .c-makers__nav::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-makers__nav::before, .c-makers__nav::after {
    height: 1px;
  }
}
.c-makers__nav::before, .c-makers__nav::after {
  background: rgba(43, 42, 46, 0.2);
}
.c-makers__nav::before {
  top: 10px;
}
.c-makers__nav::after {
  bottom: 12px;
}
.c-makers__nav-btn {
  position: relative;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-black);
}
@media (hover: hover) {
  .c-makers__nav-btn:hover .c-makers__nav-btn-lines::after {
    background-size: 100% 100%, 100% 100%;
  }
}
.c-makers__nav-btn svg:not(.c-makers__nav-btn-diagonals) {
  width: 6px;
  height: 9px;
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
}
.c-makers__nav-btn::before, .c-makers__nav-btn::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn::before, .c-makers__nav-btn::after {
    width: 2px;
    height: 2px;
  }
}
.c-makers__nav-btn.swiper-button-disabled {
  pointer-events: none;
  color: rgba(43, 42, 46, 0.3);
}
.c-makers__nav-btn--prev {
  width: 60px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--prev {
    width: 50px;
  }
}
.c-makers__nav-btn--prev svg:not(.c-makers__nav-btn-diagonals) {
  width: 12px;
  height: 38px;
}
@media (hover: hover) {
  .c-makers__nav-btn--prev:hover svg:not(.c-makers__nav-btn-diagonals) {
    animation: c-makers-arrow-sweep-prev 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-makers__nav-btn--prev:hover svg:not(.c-makers__nav-btn-diagonals) {
    animation: none;
  }
}
.c-makers__nav-btn--prev::before {
  top: 8px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--prev::before {
    top: 9px;
    left: 4px;
    box-shadow: 40px 0 0 var(--color-black);
  }
}
.c-makers__nav-btn--prev::after {
  top: 66px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--prev::after {
    top: 67px;
    left: 4px;
    box-shadow: 40px 0 0 var(--color-black);
  }
}
.c-makers__nav-btn--prev .c-makers__nav-btn-lines::before {
  right: 10px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--prev .c-makers__nav-btn-lines::before {
    right: 5px;
  }
}
.c-makers__nav-btn--prev .c-makers__nav-btn-lines::after {
  left: 10px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--prev .c-makers__nav-btn-lines::after {
    left: 5px;
  }
}
.c-makers__nav-btn--next {
  width: 60px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--next {
    width: 50px;
  }
}
.c-makers__nav-btn--next svg:not(.c-makers__nav-btn-diagonals) {
  width: 12px;
  height: 38px;
}
@media (hover: hover) {
  .c-makers__nav-btn--next:hover svg:not(.c-makers__nav-btn-diagonals) {
    animation: c-makers-arrow-sweep-next 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-makers__nav-btn--next:hover svg:not(.c-makers__nav-btn-diagonals) {
    animation: none;
  }
}
.c-makers__nav-btn--next::before {
  top: 8px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--next::before {
    top: 9px;
    left: 4px;
    box-shadow: 40px 0 0 var(--color-black);
  }
}
.c-makers__nav-btn--next::after {
  top: 66px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--next::after {
    top: 67px;
    left: 4px;
    box-shadow: 40px 0 0 var(--color-black);
  }
}
.c-makers__nav-btn--next .c-makers__nav-btn-lines::before {
  left: 10px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--next .c-makers__nav-btn-lines::before {
    left: 5px;
  }
}
.c-makers__nav-btn--next .c-makers__nav-btn-lines::after {
  right: 10px;
}
@media screen and (max-width: 1024px) {
  .c-makers__nav-btn--next .c-makers__nav-btn-lines::after {
    right: 5px;
  }
}
.c-makers__nav-btn-diagonals {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.c-makers__nav-btn-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.c-makers__nav-btn-lines::before, .c-makers__nav-btn-lines::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: scaleX(0.5);
}
.c-makers__nav-btn-lines::before {
  background: rgba(43, 42, 46, 0.2);
}
.c-makers__nav-btn-lines::after {
  background-image: linear-gradient(var(--color-black), var(--color-black)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 16px, 100% 100%;
  transition: background-size 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-makers__nav-btn-lines::after {
    transition: none;
  }
}
.c-makers__nav-progress {
  --segments: 4;
  --index: 0;
  --seg-w: 5px;
  width: calc(var(--seg-w) * var(--segments));
  height: 80px;
  position: relative;
  background-image: repeating-linear-gradient(to right, rgba(43, 42, 46, 0.2) 0, rgba(43, 42, 46, 0.2) 0.5px, transparent 0.5px, transparent var(--seg-w)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
  background-repeat: no-repeat, no-repeat;
  background-size: 100% 100%, 0.5px 100%;
  background-position: 0 0, 100% 0;
}
@media (max-resolution: 1.5dppx) {
  .c-makers__nav-progress {
    background-image: repeating-linear-gradient(to right, rgba(43, 42, 46, 0.2) 0, rgba(43, 42, 46, 0.2) 1px, transparent 1px, transparent var(--seg-w)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
    background-size: 100% 100%, 1px 100%;
  }
}
.c-makers__nav-progress-bar {
  position: absolute;
  top: 10px;
  left: 0;
  width: var(--seg-w);
  height: 58px;
  background: var(--color-black);
  transform: translateX(calc(var(--index) * var(--seg-w)));
  transition: transform 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .c-makers__nav-progress-bar {
    transition: none;
  }
}
.c-makers__slider-wrap {
  grid-column: 2/-1;
  position: relative;
  isolation: isolate;
  margin-top: 36px;
}
@media screen and (max-width: 1024px) {
  .c-makers__slider-wrap {
    order: 2;
    margin-top: 40px;
  }
}
.c-makers__slider-lines {
  position: absolute;
  top: 0;
  left: -2000px;
  right: -2000px;
  bottom: 0;
  z-index: -1;
  pointer-events: none;
}
.c-makers__slider-line {
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.5px;
  background-color: rgba(43, 42, 46, 0.2);
}
.c-makers__slider-clip {
  width: 100%;
}
.c-makers__slider {
  display: flex;
  align-items: flex-start;
  padding-bottom: 50px;
}
.c-makers__slider .c-card {
  transition: transform 0.3s ease, opacity 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .c-makers__slider .c-card {
    transition: none;
  }
}

.c-portfolio {
  padding: 130px 0 140px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .c-portfolio {
    padding: 100px 0 80px;
  }
}
.c-portfolio__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__inner {
    display: flex;
    flex-direction: column;
  }
}
.c-portfolio__upper {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  align-content: start;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__upper {
    display: contents;
  }
}
.c-portfolio__head {
  grid-column: 2/6;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__head {
    order: 1;
  }
}
.c-portfolio__lead {
  grid-column: 7/13;
  align-self: center;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  font-weight: 700;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__lead {
    order: 2;
    margin-top: 30px;
    font-size: 12px;
    align-self: flex-start;
    line-height: 26px;
  }
}
.c-portfolio__slider-wrap {
  grid-column: 2/-1;
  position: relative;
  isolation: isolate;
  margin-top: 54px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__slider-wrap {
    order: 3;
    margin-top: 30px;
  }
}
.c-portfolio__slider-clip {
  width: 100%;
  position: relative;
}
.c-portfolio__slider-clip::before, .c-portfolio__slider-clip::after {
  content: "";
  position: absolute;
  left: -2000px;
  right: -2000px;
  height: 0.5px;
  background: rgba(43, 42, 46, 0.2);
  pointer-events: none;
}
.c-portfolio__slider-clip::before {
  top: 0;
}
.c-portfolio__slider-clip::after {
  bottom: 14px;
}
.c-portfolio__slider {
  display: flex;
  align-items: flex-start;
  padding-bottom: 14px;
}
.c-portfolio__bottom {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: center;
  margin-top: 46px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__bottom {
    order: 4;
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
  }
}
.c-portfolio__bottom .c-button {
  grid-column: 9/12;
  max-width: none;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__bottom .c-button {
    order: 2;
    width: 100%;
  }
}
.c-portfolio__nav {
  grid-column: 2/5;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;
  max-width: 381px;
  width: auto;
  margin-inline: -10px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav {
    order: 1;
    max-width: none;
    margin-inline: -5px;
    width: 100%;
  }
}
.c-portfolio__nav::before, .c-portfolio__nav::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-portfolio__nav::before, .c-portfolio__nav::after {
    height: 1px;
  }
}
.c-portfolio__nav::before, .c-portfolio__nav::after {
  background: rgba(43, 42, 46, 0.2);
}
.c-portfolio__nav::before {
  top: 10px;
}
.c-portfolio__nav::after {
  bottom: 12px;
}
.c-portfolio__nav-btn {
  position: relative;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-black);
}
@media (hover: hover) {
  .c-portfolio__nav-btn:hover .c-portfolio__nav-btn-lines::after {
    background-size: 100% 100%, 100% 100%;
  }
}
.c-portfolio__nav-btn svg:not(.c-portfolio__nav-btn-diagonals) {
  width: 6px;
  height: 9px;
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
}
.c-portfolio__nav-btn::before, .c-portfolio__nav-btn::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn::before, .c-portfolio__nav-btn::after {
    width: 2px;
    height: 2px;
  }
}
.c-portfolio__nav-btn.swiper-button-disabled {
  pointer-events: none;
  color: rgba(43, 42, 46, 0.3);
}
.c-portfolio__nav-btn--prev {
  width: 60px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--prev {
    width: 50px;
  }
}
.c-portfolio__nav-btn--prev svg:not(.c-portfolio__nav-btn-diagonals) {
  width: 12px;
  height: 38px;
}
@media (hover: hover) {
  .c-portfolio__nav-btn--prev:hover svg:not(.c-portfolio__nav-btn-diagonals) {
    transform: translateX(-2px);
  }
}
.c-portfolio__nav-btn--prev::before {
  top: 8px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--prev::before {
    top: 9px;
    left: 4px;
  }
}
.c-portfolio__nav-btn--prev::after {
  top: 66px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--prev::after {
    top: 67px;
    left: 4px;
  }
}
.c-portfolio__nav-btn--prev .c-portfolio__nav-btn-lines::before {
  right: 10px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--prev .c-portfolio__nav-btn-lines::before {
    right: 5px;
  }
}
.c-portfolio__nav-btn--prev .c-portfolio__nav-btn-lines::after {
  left: 10px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--prev .c-portfolio__nav-btn-lines::after {
    left: 5px;
  }
}
.c-portfolio__nav-btn--next {
  width: 60px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--next {
    width: 50px;
  }
}
.c-portfolio__nav-btn--next svg:not(.c-portfolio__nav-btn-diagonals) {
  width: 12px;
  height: 38px;
}
@media (hover: hover) {
  .c-portfolio__nav-btn--next:hover svg:not(.c-portfolio__nav-btn-diagonals) {
    transform: translateX(2px);
  }
}
.c-portfolio__nav-btn--next::before {
  top: 8px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--next::before {
    top: 9px;
    left: 4px;
  }
}
.c-portfolio__nav-btn--next::after {
  top: 66px;
  left: 8px;
  box-shadow: 40px 0 0 var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--next::after {
    top: 67px;
    left: 4px;
  }
}
.c-portfolio__nav-btn--next .c-portfolio__nav-btn-lines::before {
  left: 10px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--next .c-portfolio__nav-btn-lines::before {
    left: 5px;
  }
}
.c-portfolio__nav-btn--next .c-portfolio__nav-btn-lines::after {
  right: 10px;
}
@media screen and (max-width: 1024px) {
  .c-portfolio__nav-btn--next .c-portfolio__nav-btn-lines::after {
    right: 5px;
  }
}
.c-portfolio__nav-btn-diagonals {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.c-portfolio__nav-btn-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.c-portfolio__nav-btn-lines::before, .c-portfolio__nav-btn-lines::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: scaleX(0.5);
}
.c-portfolio__nav-btn-lines::before {
  background: rgba(43, 42, 46, 0.2);
}
.c-portfolio__nav-btn-lines::after {
  background-image: linear-gradient(var(--color-black), var(--color-black)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 16px, 100% 100%;
  transition: background-size 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) {
  .c-portfolio__nav-btn-lines::after {
    transition: none;
  }
}
.c-portfolio__nav-progress {
  --segments: 4;
  --index: 0;
  --seg-w: 5px;
  width: calc(var(--seg-w) * var(--segments));
  height: 80px;
  position: relative;
  background-image: repeating-linear-gradient(to right, rgba(43, 42, 46, 0.2) 0, rgba(43, 42, 46, 0.2) 0.5px, transparent 0.5px, transparent var(--seg-w)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
  background-repeat: no-repeat, no-repeat;
  background-size: 100% 100%, 0.5px 100%;
  background-position: 0 0, 100% 0;
}
@media (max-resolution: 1.5dppx) {
  .c-portfolio__nav-progress {
    background-image: repeating-linear-gradient(to right, rgba(43, 42, 46, 0.2) 0, rgba(43, 42, 46, 0.2) 1px, transparent 1px, transparent var(--seg-w)), linear-gradient(rgba(43, 42, 46, 0.2), rgba(43, 42, 46, 0.2));
    background-size: 100% 100%, 1px 100%;
  }
}
.c-portfolio__nav-progress-bar {
  position: absolute;
  top: 10px;
  left: 0;
  width: var(--seg-w);
  height: 58px;
  background: var(--color-black);
  transform: translateX(calc(var(--index) * var(--seg-w)));
  transition: transform 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .c-portfolio__nav-progress-bar {
    transition: none;
  }
}
.c-portfolio__slider .c-card {
  transition: opacity 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .c-portfolio__slider .c-card {
    transition: none;
  }
}

.c-portfolio__slider-clip.js-reveal::before, .c-portfolio__slider-clip.js-reveal::after {
  clip-path: inset(-2px);
  transition: clip-path 3.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-portfolio__slider-clip.js-reveal::after {
  transition-delay: 0.4s;
}

.c-portfolio__slider-clip.js-reveal:not(.is-inview)::before, .c-portfolio__slider-clip.js-reveal:not(.is-inview)::after {
  clip-path: inset(-2px 100% -2px -2px);
}

@media (prefers-reduced-motion: reduce) {
  .c-portfolio__slider-clip.js-reveal::before, .c-portfolio__slider-clip.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.c-lead {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 19px 0 41px 0;
  margin-top: 21px;
}
.c-lead__deco {
  position: absolute;
  top: 0;
  bottom: 0;
  pointer-events: none;
}
.c-lead__deco--left {
  right: 100%;
  width: 30px;
  background: radial-gradient(circle at 10.25px 8px, rgba(207, 207, 207, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 31px), rgba(207, 207, 207, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 10px), rgba(207, 207, 207, 0.2) 2px, transparent 2px), linear-gradient(to right, transparent 10px, rgba(43, 43, 45, 0.2) 10px, rgba(43, 43, 45, 0.2) 10.5px, transparent 10.5px);
}
.c-lead__deco--left::before {
  content: "";
  position: absolute;
  top: 19px;
  bottom: 41px;
  left: 28px;
  width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-lead__deco--left::before {
    width: 1px;
  }
}
.c-lead__deco--left::before {
  background: #CFCFCF;
}
.c-lead p {
  position: relative;
  display: block;
  margin: 0;
  font-size: 22px;
  line-height: 1.909em;
  letter-spacing: 0.04em;
  font-weight: bold;
  white-space: nowrap;
  color: var(--color-black);
}
.c-lead p::before {
  content: "";
  position: absolute;
  left: -30px;
  right: 0;
  height: 4px;
  background: radial-gradient(circle at 10px 2px, #cfcfcf 2px, transparent 2px), radial-gradient(circle at 28px 2px, #cfcfcf 2px, transparent 2px), linear-gradient(transparent 1.75px, rgba(43, 42, 46, 0.2) 1.75px, rgba(43, 42, 46, 0.2) 2.25px, transparent 2.25px);
}
@media (max-resolution: 1.5dppx) {
  .c-lead p::before {
    background: radial-gradient(circle at 10px 2px, #cfcfcf 2px, transparent 2px), radial-gradient(circle at 28px 2px, #cfcfcf 2px, transparent 2px), linear-gradient(transparent 1.5px, rgba(43, 42, 46, 0.2) 1.5px, rgba(43, 42, 46, 0.2) 2.5px, transparent 2.5px);
  }
}
.c-lead p::before {
  width: 190px;
  top: 10px;
  transform: translateY(-2px);
}
.c-lead p::after {
  width: 190px;
  content: "";
  position: absolute;
  left: -30px;
  right: 0;
  height: 4px;
  background: radial-gradient(circle at 10px 2px, #cfcfcf 2px, transparent 2px), radial-gradient(circle at 28px 2px, #cfcfcf 2px, transparent 2px), linear-gradient(transparent 1.75px, rgba(43, 42, 46, 0.2) 1.75px, rgba(43, 42, 46, 0.2) 2.25px, transparent 2.25px);
}
@media (max-resolution: 1.5dppx) {
  .c-lead p::after {
    background: radial-gradient(circle at 10px 2px, #cfcfcf 2px, transparent 2px), radial-gradient(circle at 28px 2px, #cfcfcf 2px, transparent 2px), linear-gradient(transparent 1.5px, rgba(43, 42, 46, 0.2) 1.5px, rgba(43, 42, 46, 0.2) 2.5px, transparent 2.5px);
  }
}
.c-lead p::after {
  bottom: 11px;
  transform: translateY(2px);
}
@media screen and (max-width: 1024px) {
  .c-lead {
    padding: 15px 0 35px 0;
    margin-top: 14px;
  }
  .c-lead__deco--left {
    width: 15px;
    background: radial-gradient(circle 2px at 5.25px 4px, rgba(207, 207, 207, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 26px), rgba(207, 207, 207, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 6px), rgba(207, 207, 207, 0.2), transparent), linear-gradient(to right, transparent 5px, rgba(43, 43, 45, 0.2) 5px, rgba(43, 43, 45, 0.2) 5.5px, transparent 5.5px);
  }
  .c-lead__deco--left::before {
    top: 15px;
    bottom: 35px;
    left: 14px;
  }
  .c-lead p {
    line-height: 40px;
  }
  .c-lead p::before {
    left: -15px;
    width: 185px;
    top: 10px;
    height: 2px;
    background: radial-gradient(circle at 5px 1px, #cfcfcf 1px, transparent 1px), radial-gradient(circle at 14px 1px, #cfcfcf 1px, transparent 1px), linear-gradient(transparent 0.75px, rgba(43, 42, 46, 0.2) 0.75px, rgba(43, 42, 46, 0.2) 1.25px, transparent 1.25px);
  }
  .c-lead p::after {
    left: -15px;
    width: 185px;
    bottom: 10px;
    height: 2px;
    background: radial-gradient(circle at 5px 1px, #cfcfcf 1px, transparent 1px), radial-gradient(circle at 14px 1px, #cfcfcf 1px, transparent 1px), linear-gradient(transparent 0.75px, rgba(43, 42, 46, 0.2) 0.75px, rgba(43, 42, 46, 0.2) 1.25px, transparent 1.25px);
  }
}

.c-lead--white .c-lead__deco--left {
  background: radial-gradient(circle at 10.25px 8px, rgba(177, 177, 177, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 31px), rgba(177, 177, 177, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 10px), rgba(177, 177, 177, 0.2) 2px, transparent 2px), linear-gradient(to right, transparent 10px, rgba(255, 255, 255, 0.2) 10px, rgba(255, 255, 255, 0.2) 10.5px, transparent 10.5px);
}
.c-lead--white .c-lead__deco--left::before {
  background: rgba(255, 255, 255, 0.2);
}
.c-lead--white p {
  color: #fff;
}
.c-lead--white p::before, .c-lead--white p::after {
  background: radial-gradient(circle at 10px 2px, #B1B1B1 2px, transparent 2px), radial-gradient(circle at 28px 2px, #B1B1B1 2px, transparent 2px), linear-gradient(transparent 1.75px, rgba(255, 255, 255, 0.2) 1.75px, rgba(255, 255, 255, 0.2) 2.25px, transparent 2.25px);
}
@media (max-resolution: 1.5dppx) {
  .c-lead--white p::before, .c-lead--white p::after {
    background: radial-gradient(circle at 10px 2px, #B1B1B1 2px, transparent 2px), radial-gradient(circle at 28px 2px, #B1B1B1 2px, transparent 2px), linear-gradient(transparent 1.5px, rgba(255, 255, 255, 0.2) 1.5px, rgba(255, 255, 255, 0.2) 2.5px, transparent 2.5px);
  }
}
@media screen and (max-width: 1024px) {
  .c-lead--white .c-lead__deco--left {
    background: radial-gradient(circle 2px at 5.25px 4px, rgba(177, 177, 177, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 26px), rgba(177, 177, 177, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 6px), rgba(177, 177, 177, 0.2), transparent), linear-gradient(to right, transparent 5px, rgba(255, 255, 255, 0.2) 5px, rgba(255, 255, 255, 0.2) 5.5px, transparent 5.5px);
  }
  .c-lead--white p::before, .c-lead--white p::after {
    background: radial-gradient(circle at 5px 1px, #B1B1B1 1px, transparent 1px), radial-gradient(circle at 14px 1px, #B1B1B1 1px, transparent 1px), linear-gradient(transparent 0.75px, rgba(255, 255, 255, 0.2) 0.75px, rgba(255, 255, 255, 0.2) 1.25px, transparent 1.25px);
  }
}

.c-sec-head .c-lead {
  margin-top: 21px;
}
@media screen and (max-width: 1024px) {
  .c-sec-head .c-lead {
    margin-top: 14px;
  }
}
.c-sec-head__text {
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
  margin-top: -23px;
}
@media screen and (max-width: 1024px) {
  .c-sec-head__text {
    font-size: 12px;
    line-height: 26px;
    margin-top: -12px;
  }
}
.c-sec-head__text--white {
  color: var(--color-white);
}
.c-sec-head__text p + p {
  margin-top: 19px;
}
@media screen and (max-width: 1024px) {
  .c-sec-head__text p + p {
    margin-top: 13px;
  }
}
.c-sec-head__button {
  margin-top: 42px;
}
@media screen and (max-width: 1024px) {
  .c-sec-head__button {
    margin-top: 90px;
  }
}

.c-title {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 46px 12px 26px 0;
}
.c-title__deco {
  position: absolute;
  top: 0;
  height: 100%;
  pointer-events: none;
}
.c-title__deco--left {
  right: 100%;
  width: 30px;
  background: linear-gradient(to right, transparent 10px, rgba(43, 43, 45, 0.2) 10px, rgba(43, 43, 45, 0.2) 10.5px, transparent 10.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-title__deco--left {
    background: linear-gradient(to right, transparent 10px, rgba(43, 43, 45, 0.2) 10px, rgba(43, 43, 45, 0.2) 11px, transparent 11px);
  }
}
.c-title__deco--left::before {
  content: "";
  position: absolute;
  top: 36px;
  height: 38px;
  left: 28px;
  width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-title__deco--left::before {
    width: 1px;
  }
}
.c-title__deco--left::before {
  background: #CFCFCF;
}
.c-title__deco--left::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
  left: 8.25px;
  top: 43.25px;
  box-shadow: 0 -40px 0 rgba(207, 207, 207, 0.2), 0 -20px 0 rgba(207, 207, 207, 0.5), 0 19.5px 0 #CFCFCF, 0 40px 0 rgba(207, 207, 207, 0.5), 18px 0 0 #CFCFCF, 18px 19.5px 0 #CFCFCF;
}
.c-title__deco--right {
  right: -3px;
  width: 20px;
}
.c-title__deco--right::before {
  content: "";
  position: absolute;
  top: 36px;
  height: 38px;
  left: 4px;
  width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-title__deco--right::before {
    width: 1px;
  }
}
.c-title__deco--right::before {
  background: #CFCFCF;
}
.c-title__deco--right::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
  left: 2.25px;
  top: 43.25px;
  box-shadow: 0 19.5px 0 #CFCFCF;
}
.c-title__deco--right.small {
  right: 0px;
}
.c-title__deco--right.small::before {
  left: 7px;
}
.c-title__deco--right.small::after {
  left: 5.25px;
}
.c-title__en {
  position: absolute;
  top: 17px;
  left: 0;
  white-space: nowrap;
  font-size: 10px;
  font-family: var(--font-en);
  line-height: 1;
  letter-spacing: 0;
  font-weight: bold;
  color: var(--color-black);
}
.c-title__jp {
  position: relative;
  display: block;
  font-size: 18px;
  letter-spacing: 0.04em;
  line-height: 1;
  color: var(--color-black);
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .c-title__jp {
    font-size: 16px;
  }
}
.c-title__jp::before {
  width: 190px;
  content: "";
  position: absolute;
  left: -30px;
  right: -20px;
  top: -1px;
  height: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-title__jp::before {
    height: 1px;
  }
}
.c-title__jp::before {
  background: #CFCFCF;
}
@media screen and (max-width: 1024px) {
  .c-title__jp::before {
    width: 185px;
  }
}
.c-title__jp::after {
  width: 190px;
  content: "";
  position: absolute;
  left: -30px;
  right: -20px;
  bottom: -1px;
  height: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .c-title__jp::after {
    height: 1px;
  }
}
.c-title__jp::after {
  background: #CFCFCF;
}
@media screen and (max-width: 1024px) {
  .c-title__jp::after {
    width: 185px;
  }
}
@media screen and (max-width: 1024px) {
  .c-title {
    padding: 38px 12px 20px 0;
  }
  .c-title__deco--left {
    width: 15px;
    background: linear-gradient(to right, transparent 5px, rgba(43, 43, 45, 0.2) 5px, rgba(43, 43, 45, 0.2) 5.5px, transparent 5.5px);
  }
}
@media screen and (max-width: 1024px) and (max-resolution: 1.5dppx) {
  .c-title__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(43, 43, 45, 0.2) 5px, rgba(43, 43, 45, 0.2) 6px, transparent 6px);
  }
}
@media screen and (max-width: 1024px) {
  .c-title__deco--left::before {
    top: 28px;
    height: 36px;
    left: 14px;
  }
  .c-title__deco--left::after {
    width: 2px;
    height: 2px;
    left: 4.25px;
    top: 36.25px;
    box-shadow: 0 -36px 0 rgba(207, 207, 207, 0.2), 0 -18px 0 rgba(207, 207, 207, 0.5), 0 17.5px 0 #CFCFCF, 0 36px 0 rgba(207, 207, 207, 0.5), 9px 0 0 #CFCFCF, 9px 17.5px 0 #CFCFCF;
  }
  .c-title__deco--right::before {
    top: 28px;
    height: 36px;
  }
  .c-title__deco--right::after {
    width: 2px;
    height: 2px;
    left: 3.25px;
    top: 36.25px;
    box-shadow: 0 17.5px 0 #CFCFCF;
  }
  .c-title__deco--right.small::after {
    left: 6.25px;
  }
  .c-title__en {
    top: 8px;
  }
  .c-title__jp::before {
    left: -15px;
  }
  .c-title__jp::after {
    left: -15px;
  }
}

.c-title--white .c-title__en,
.c-title--white .c-title__jp {
  color: #fff;
}
.c-title--white .c-title__deco--left {
  background: linear-gradient(to right, transparent 10px, rgba(255, 255, 255, 0.2) 10px, rgba(255, 255, 255, 0.2) 10.5px, transparent 10.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-title--white .c-title__deco--left {
    background: linear-gradient(to right, transparent 10px, rgba(255, 255, 255, 0.2) 10px, rgba(255, 255, 255, 0.2) 11px, transparent 11px);
  }
}
.c-title--white .c-title__deco--left::before {
  background: rgba(255, 255, 255, 0.2);
}
.c-title--white .c-title__deco--left::after {
  background: #B1B1B1;
  box-shadow: 0 -40px 0 rgba(177, 177, 177, 0.2), 0 -20px 0 rgba(177, 177, 177, 0.5), 0 19.5px 0 #B1B1B1, 0 40px 0 rgba(177, 177, 177, 0.5), 18px 0 0 #B1B1B1, 18px 19.5px 0 #B1B1B1;
}
.c-title--white .c-title__deco--right::before {
  background: rgba(255, 255, 255, 0.2);
}
.c-title--white .c-title__deco--right::after {
  background: #B1B1B1;
  box-shadow: 0 19.5px 0 #B1B1B1;
}
.c-title--white .c-title__jp::before, .c-title--white .c-title__jp::after {
  background: rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 1024px) {
  .c-title--white .c-title__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(255, 255, 255, 0.2) 5px, rgba(255, 255, 255, 0.2) 5.5px, transparent 5.5px);
  }
}
@media screen and (max-width: 1024px) and (max-resolution: 1.5dppx) {
  .c-title--white .c-title__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(255, 255, 255, 0.2) 5px, rgba(255, 255, 255, 0.2) 6px, transparent 6px);
  }
}
@media screen and (max-width: 1024px) {
  .c-title--white .c-title__deco--left::after {
    box-shadow: 0 -36px 0 rgba(177, 177, 177, 0.2), 0 -18px 0 rgba(177, 177, 177, 0.5), 0 17.5px 0 #B1B1B1, 0 36px 0 rgba(177, 177, 177, 0.5), 9px 0 0 #B1B1B1, 9px 17.5px 0 #B1B1B1;
  }
  .c-title--white .c-title__deco--right::after {
    box-shadow: 0 17.5px 0 #B1B1B1;
  }
}

.c-tag {
  position: relative;
  display: inline-block;
  text-indent: 0;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 700;
  line-height: 32px;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .c-tag {
    font-size: 12px;
    padding: 0 9px;
  }
}
.c-tag::before, .c-tag::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 5px;
  height: 17px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg width='5' height='17' viewBox='0 0 5 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 1H1V16H5' stroke='%232B2A2E' stroke-width='2'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (max-width: 1024px) {
  .c-tag::before, .c-tag::after {
    width: 4px;
    height: 12px;
  }
}
.c-tag::before {
  left: 0;
}
.c-tag::after {
  right: 0;
  transform: translateY(-50%) scaleX(-1);
}

@keyframes c-curtain-reveal {
  0% {
    -webkit-mask-position: 200% 200%;
    mask-position: 200% 200%;
  }
  100% {
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
}
.c-curtain-reveal.js-reveal:not(:has(img)):not(:has(video)) {
  -webkit-mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 200% 200%;
  mask-size: 200% 200%;
  -webkit-mask-position: 200% 200%;
  mask-position: 200% 200%;
}
.c-curtain-reveal.js-reveal img,
.c-curtain-reveal.js-reveal video {
  -webkit-mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 200% 200%;
  mask-size: 200% 200%;
  -webkit-mask-position: 200% 200%;
  mask-position: 200% 200%;
}

.c-curtain-reveal.js-reveal.is-inview:not(:has(img)):not(:has(video)),
.c-curtain-reveal.js-reveal.is-inview img,
.c-curtain-reveal.js-reveal.is-inview video {
  animation: c-curtain-reveal 3.5s cubic-bezier(0.23, 0.63, 0.32, 0.87) forwards;
}

@media (prefers-reduced-motion: reduce) {
  .c-curtain-reveal.js-reveal:not(:has(img)):not(:has(video)),
  .c-curtain-reveal.js-reveal img,
  .c-curtain-reveal.js-reveal video {
    -webkit-mask-image: none;
    mask-image: none;
    animation: none;
  }
}
.c-title.js-reveal .c-title__deco--left {
  clip-path: inset(-2px);
  transition: clip-path 1.9s cubic-bezier(0.16, 1, 0.3, 1) 0.25s;
}
.c-title.js-reveal .c-title__jp::before {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.8s;
}
.c-title.js-reveal .c-title__jp::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 1.1s;
}
.c-title.js-reveal .c-title__deco--right {
  clip-path: inset(-2px);
  transition: clip-path 1.45s cubic-bezier(0.16, 1, 0.3, 1) 1.5s;
}
.c-title.js-reveal .c-title__deco--left::after {
  filter: blur(0);
  transition: filter 1.8s cubic-bezier(0.16, 1, 0.3, 1) 0.5s;
}
.c-title.js-reveal .c-title__deco--right::after {
  filter: blur(0);
  transition: filter 1.4s cubic-bezier(0.16, 1, 0.3, 1) 1.7s;
}

.c-title.js-reveal:not(.is-inview) .c-title__deco--left,
.c-title.js-reveal:not(.is-inview) .c-title__deco--right {
  clip-path: inset(-2px -2px 100% -2px);
}
.c-title.js-reveal:not(.is-inview) .c-title__jp::before,
.c-title.js-reveal:not(.is-inview) .c-title__jp::after {
  clip-path: inset(-2px 100% -2px -2px);
}
.c-title.js-reveal:not(.is-inview) .c-title__deco--left::after,
.c-title.js-reveal:not(.is-inview) .c-title__deco--right::after {
  filter: blur(4px);
}

.c-careers__vertical.js-reveal {
  opacity: 1;
  filter: blur(0px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1), filter 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.c-careers__vertical.js-reveal:not(.is-inview) {
  opacity: 0;
  filter: blur(3px);
}

.c-under-kv__title {
  opacity: 0;
  filter: blur(3px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s, filter 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}
.c-under-kv__title.is-inview {
  opacity: 1;
  filter: blur(0px);
}

@media (scripting: none) {
  .c-under-kv__title {
    opacity: 1;
    filter: none;
    transition: none;
  }
}
.c-under-kv__message dt,
.c-under-kv__message dd {
  visibility: hidden;
  opacity: 0;
  filter: blur(3px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s, filter 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s, visibility 0s;
}
.c-under-kv__message dd {
  transition-delay: 0.5s;
}
.c-under-kv__message.is-inview dt,
.c-under-kv__message.is-inview dd {
  visibility: visible;
  opacity: 1;
  filter: blur(0px);
}

@media (scripting: none) {
  .c-under-kv__message dt,
  .c-under-kv__message dd {
    visibility: visible;
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
}
.c-lead.js-reveal .c-lead__deco--left {
  clip-path: inset(-2px);
  transition: clip-path 2.25s cubic-bezier(0.16, 1, 0.3, 1) 0.25s;
}
.c-lead.js-reveal p:nth-of-type(1)::before {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.55s;
}
.c-lead.js-reveal p:nth-of-type(1)::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.95s;
}
.c-lead.js-reveal p:nth-of-type(2)::before {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.95s;
}
.c-lead.js-reveal p:nth-of-type(2)::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 1.35s;
}
.c-lead.js-reveal p:nth-of-type(3)::before {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 1.35s;
}
.c-lead.js-reveal p:nth-of-type(3)::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 1.75s;
}
.c-lead.js-reveal p:nth-of-type(4)::before {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 1.75s;
}
.c-lead.js-reveal p:nth-of-type(4)::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 2.15s;
}

.c-lead.js-reveal:not(.is-inview) .c-lead__deco--left {
  clip-path: inset(-2px -2px 100% -2px);
}
.c-lead.js-reveal:not(.is-inview) p::before,
.c-lead.js-reveal:not(.is-inview) p::after {
  clip-path: inset(-2px 100% -2px -2px);
}
.c-lead.js-reveal:not(.is-inview) .c-lead__deco--left::after {
  filter: blur(4px);
}

.c-lead.js-reveal .c-lead__deco--left {
  background: linear-gradient(to right, transparent 10px, rgba(43, 43, 45, 0.2) 10px, rgba(43, 43, 45, 0.2) 10.5px, transparent 10.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-lead.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 10px, rgba(43, 43, 45, 0.2) 10px, rgba(43, 43, 45, 0.2) 11px, transparent 11px);
  }
}
.c-lead.js-reveal .c-lead__deco--left::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 10.25px 8px, rgba(207, 207, 207, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 31px), rgba(207, 207, 207, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 10px), rgba(207, 207, 207, 0.2) 2px, transparent 2px);
  filter: blur(0);
  transition: filter 2s cubic-bezier(0.16, 1, 0.3, 1) 0.6s;
}
@media screen and (max-width: 1024px) {
  .c-lead.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(43, 43, 45, 0.2) 5px, rgba(43, 43, 45, 0.2) 5.5px, transparent 5.5px);
  }
}
@media screen and (max-width: 1024px) and (max-resolution: 1.5dppx) {
  .c-lead.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(43, 43, 45, 0.2) 5px, rgba(43, 43, 45, 0.2) 6px, transparent 6px);
  }
}
@media screen and (max-width: 1024px) {
  .c-lead.js-reveal .c-lead__deco--left::after {
    background: radial-gradient(circle 2px at 5.25px 4px, rgba(207, 207, 207, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 26px), rgba(207, 207, 207, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 6px), rgba(207, 207, 207, 0.2), transparent);
  }
}

.c-lead--white.js-reveal .c-lead__deco--left {
  background: linear-gradient(to right, transparent 10px, rgba(255, 255, 255, 0.2) 10px, rgba(255, 255, 255, 0.2) 10.5px, transparent 10.5px);
}
@media (max-resolution: 1.5dppx) {
  .c-lead--white.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 10px, rgba(255, 255, 255, 0.2) 10px, rgba(255, 255, 255, 0.2) 11px, transparent 11px);
  }
}
.c-lead--white.js-reveal .c-lead__deco--left::after {
  background: radial-gradient(circle at 10.25px 8px, rgba(177, 177, 177, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 31px), rgba(177, 177, 177, 0.5) 2px, transparent 2px), radial-gradient(circle at 10.25px calc(100% - 10px), rgba(177, 177, 177, 0.2) 2px, transparent 2px);
}
@media screen and (max-width: 1024px) {
  .c-lead--white.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(255, 255, 255, 0.2) 5px, rgba(255, 255, 255, 0.2) 5.5px, transparent 5.5px);
  }
}
@media screen and (max-width: 1024px) and (max-resolution: 1.5dppx) {
  .c-lead--white.js-reveal .c-lead__deco--left {
    background: linear-gradient(to right, transparent 5px, rgba(255, 255, 255, 0.2) 5px, rgba(255, 255, 255, 0.2) 6px, transparent 6px);
  }
}
@media screen and (max-width: 1024px) {
  .c-lead--white.js-reveal .c-lead__deco--left::after {
    background: radial-gradient(circle 2px at 5.25px 4px, rgba(177, 177, 177, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 26px), rgba(177, 177, 177, 0.5), transparent), radial-gradient(circle 2px at 5.25px calc(100% - 6px), rgba(177, 177, 177, 0.2), transparent);
  }
}

.c-makers__slider-wrap.js-reveal .c-card:nth-child(1),
.p-our-home__makers-list.js-reveal .c-card:nth-child(1),
.c-portfolio__slider.js-reveal .c-card:nth-child(1) {
  transition: visibility 0s 0s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0s, opacity 0.12s linear 0s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(2),
.p-our-home__makers-list.js-reveal .c-card:nth-child(2),
.c-portfolio__slider.js-reveal .c-card:nth-child(2) {
  transition: visibility 0s 0.18s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.18s, opacity 0.12s linear 0.18s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(3),
.p-our-home__makers-list.js-reveal .c-card:nth-child(3),
.c-portfolio__slider.js-reveal .c-card:nth-child(3) {
  transition: visibility 0s 0.36s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.36s, opacity 0.12s linear 0.36s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(4),
.p-our-home__makers-list.js-reveal .c-card:nth-child(4),
.c-portfolio__slider.js-reveal .c-card:nth-child(4) {
  transition: visibility 0s 0.54s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.54s, opacity 0.12s linear 0.54s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(5),
.p-our-home__makers-list.js-reveal .c-card:nth-child(5),
.c-portfolio__slider.js-reveal .c-card:nth-child(5) {
  transition: visibility 0s 0.72s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.72s, opacity 0.12s linear 0.72s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(6),
.p-our-home__makers-list.js-reveal .c-card:nth-child(6),
.c-portfolio__slider.js-reveal .c-card:nth-child(6) {
  transition: visibility 0s 0.9s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.9s, opacity 0.12s linear 0.9s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(7),
.p-our-home__makers-list.js-reveal .c-card:nth-child(7),
.c-portfolio__slider.js-reveal .c-card:nth-child(7) {
  transition: visibility 0s 1.08s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.08s, opacity 0.12s linear 1.08s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(8),
.p-our-home__makers-list.js-reveal .c-card:nth-child(8),
.c-portfolio__slider.js-reveal .c-card:nth-child(8) {
  transition: visibility 0s 1.26s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.26s, opacity 0.12s linear 1.26s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(9),
.p-our-home__makers-list.js-reveal .c-card:nth-child(9),
.c-portfolio__slider.js-reveal .c-card:nth-child(9) {
  transition: visibility 0s 1.44s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.44s, opacity 0.12s linear 1.44s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(10),
.p-our-home__makers-list.js-reveal .c-card:nth-child(10),
.c-portfolio__slider.js-reveal .c-card:nth-child(10) {
  transition: visibility 0s 1.62s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.62s, opacity 0.12s linear 1.62s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(11),
.p-our-home__makers-list.js-reveal .c-card:nth-child(11),
.c-portfolio__slider.js-reveal .c-card:nth-child(11) {
  transition: visibility 0s 1.8s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.8s, opacity 0.12s linear 1.8s;
}
.c-makers__slider-wrap.js-reveal .c-card:nth-child(12),
.p-our-home__makers-list.js-reveal .c-card:nth-child(12),
.c-portfolio__slider.js-reveal .c-card:nth-child(12) {
  transition: visibility 0s 1.98s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.98s, opacity 0.12s linear 1.98s;
}

.p-archive__list.js-reveal .p-archive__item:nth-child(1) .c-card {
  transition: visibility 0s 0s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0s, opacity 0.12s linear 0s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(2) .c-card {
  transition: visibility 0s 0.18s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.18s, opacity 0.12s linear 0.18s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(3) .c-card {
  transition: visibility 0s 0.36s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.36s, opacity 0.12s linear 0.36s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(4) .c-card {
  transition: visibility 0s 0.54s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.54s, opacity 0.12s linear 0.54s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(5) .c-card {
  transition: visibility 0s 0.72s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.72s, opacity 0.12s linear 0.72s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(6) .c-card {
  transition: visibility 0s 0.9s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 0.9s, opacity 0.12s linear 0.9s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(7) .c-card {
  transition: visibility 0s 1.08s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.08s, opacity 0.12s linear 1.08s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(8) .c-card {
  transition: visibility 0s 1.26s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.26s, opacity 0.12s linear 1.26s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(9) .c-card {
  transition: visibility 0s 1.44s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.44s, opacity 0.12s linear 1.44s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(10) .c-card {
  transition: visibility 0s 1.62s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.62s, opacity 0.12s linear 1.62s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(11) .c-card {
  transition: visibility 0s 1.8s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.8s, opacity 0.12s linear 1.8s;
}
.p-archive__list.js-reveal .p-archive__item:nth-child(12) .c-card {
  transition: visibility 0s 1.98s, transform 0.3s cubic-bezier(0.9, 0, 0.95, 0) 1.98s, opacity 0.12s linear 1.98s;
}

.c-makers__slider-wrap.js-reveal:not(.is-inview) .c-card,
.p-our-home__makers-list.js-reveal:not(.is-inview) .c-card,
.c-portfolio__slider.js-reveal:not(.is-inview) .c-card,
.p-archive__list.js-reveal:not(.is-inview) .p-archive__item .c-card {
  visibility: hidden !important;
  transform: translateY(-20px) !important;
  opacity: 0 !important;
}

.c-img-reveal.js-reveal {
  opacity: 1;
  transition: opacity 1.2s ease;
}
.c-img-reveal.js-reveal img,
.c-img-reveal.js-reveal svg {
  transform: scale(1);
  transition: transform 3.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.c-img-reveal.js-reveal:not(.is-inview) {
  opacity: 0;
}
.c-img-reveal.js-reveal:not(.is-inview) img,
.c-img-reveal.js-reveal:not(.is-inview) svg {
  transform: scale(1.12);
}

.c-text-reveal.js-reveal:not(:has(dt)) {
  opacity: 1;
  filter: blur(0px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1), filter 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-text-reveal.js-reveal dt,
.c-text-reveal.js-reveal dd {
  opacity: 1;
  filter: blur(0px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1), filter 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.c-text-reveal.js-reveal dd {
  transition-delay: 0.1s;
}

.c-text-reveal.js-reveal:not(.is-inview):not(:has(dt)) {
  opacity: 0;
  filter: blur(3px);
}
.c-text-reveal.js-reveal:not(.is-inview) dt,
.c-text-reveal.js-reveal:not(.is-inview) dd {
  opacity: 0;
  filter: blur(3px);
}

@media (prefers-reduced-motion: reduce) {
  .c-title.js-reveal .c-title__deco--left,
  .c-title.js-reveal .c-title__deco--right,
  .c-title.js-reveal .c-title__jp::before,
  .c-title.js-reveal .c-title__jp::after {
    clip-path: none;
    transition: none;
  }
  .c-title.js-reveal .c-title__deco--left::after,
  .c-title.js-reveal .c-title__deco--right::after {
    filter: none;
    transition: none;
  }
  .c-title.js-reveal .c-title__en,
  .c-title.js-reveal .c-title__jp {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-lead.js-reveal .c-lead__deco--left,
  .c-lead.js-reveal p::before,
  .c-lead.js-reveal p::after {
    clip-path: none;
    transition: none;
  }
  .c-lead.js-reveal .c-lead__deco--left::after {
    filter: none;
    transition: none;
  }
  .c-lead.js-reveal p {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-makers__slider-wrap.js-reveal .c-card,
  .p-our-home__makers-list.js-reveal .c-card,
  .c-portfolio__slider.js-reveal .c-card,
  .p-archive__list.js-reveal .p-archive__item .c-card {
    transition: none;
  }
  .c-img-reveal.js-reveal {
    opacity: 1;
    transition: none;
  }
  .c-img-reveal.js-reveal img,
  .c-img-reveal.js-reveal svg {
    transform: none;
    transition: none;
  }
  .c-text-reveal.js-reveal:not(:has(dt)) {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-text-reveal.js-reveal dt,
  .c-text-reveal.js-reveal dd {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-careers__vertical.js-reveal {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-under-kv__title {
    opacity: 1;
    filter: none;
    transition: none;
  }
  .c-under-kv__message dt,
  .c-under-kv__message dd {
    visibility: visible;
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
}
.p-top__build {
  overflow: hidden;
  width: 100%;
  margin-top: 150px;
}
@media screen and (max-width: 1024px) {
  .p-top__build {
    margin-top: 120px;
  }
}

.p-continue {
  padding: 168px 0 123px;
}
@media screen and (max-width: 1024px) {
  .p-continue {
    padding: 100px 0 80px;
  }
}
.p-continue__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-continue__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-continue .c-sec-head {
  grid-column: 2/7;
}
@media screen and (max-width: 1024px) {
  .p-continue .c-sec-head {
    grid-column: 1/6;
    display: contents;
  }
}
@media screen and (max-width: 1024px) {
  .p-continue .c-sec-head .c-title, .p-continue .c-sec-head .c-lead, .p-continue .c-sec-head .c-sec-head__text {
    grid-column: 1/6;
  }
}
@media screen and (max-width: 1024px) {
  .p-continue .c-sec-head .c-sec-head__text {
    order: 4;
    margin-top: 30px;
  }
}
.p-continue__images {
  position: relative;
  grid-column: 8/13;
  margin-top: 30px;
  margin-right: -78px;
  display: flex;
  gap: 5.5px;
}
@media screen and (max-width: 1024px) {
  .p-continue__images {
    grid-column: 1/6;
    margin: 0 -15px;
    order: 3;
    margin-top: 8px;
    gap: 4px;
  }
}
.p-continue__image {
  position: relative;
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .p-continue__image:first-child .p-continue__image-label {
    left: 0;
  }
}
.p-continue__image:nth-child(even) {
  margin-top: 70px;
}
.p-continue__image:nth-child(even) .p-continue__image-label {
  top: 30px;
}
@media screen and (max-width: 1024px) {
  .p-continue__image:nth-child(even) .p-continue__image-label {
    top: 15px;
  }
}
.p-continue__image-label {
  position: absolute;
  left: 0;
  top: 100px;
  z-index: 1;
  background: var(--color-white);
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-box: trim-both cap alphabetic;
  padding: 15px 6px;
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 16px;
}
@media screen and (max-width: 1024px) {
  .p-continue__image-label {
    top: 60px;
    font-size: 12px;
    padding: 10px 4px;
    left: -4px;
  }
}
.p-continue__image-thumbnail {
  position: relative;
  height: 460px;
  border-radius: 2px;
  overflow: hidden;
  background: var(--color-white);
}
@media screen and (max-width: 768px) {
  .p-continue__image-thumbnail {
    height: 266px;
  }
}
.p-continue__image-thumbnail img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-continue__images.js-reveal .p-continue__image-thumbnail img {
  -webkit-mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 200% 200%;
  mask-size: 200% 200%;
  -webkit-mask-position: 200% 200%;
  mask-position: 200% 200%;
}

.p-continue__images.js-reveal.is-inview .p-continue__image-thumbnail img {
  animation: c-curtain-reveal 3.5s cubic-bezier(0.23, 0.63, 0.32, 0.87) forwards;
}

@media (prefers-reduced-motion: reduce) {
  .p-continue__images.js-reveal .p-continue__image-thumbnail img {
    -webkit-mask-image: none;
    mask-image: none;
    animation: none;
  }
}
.p-model-house__item {
  position: relative;
  padding-bottom: 196px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item {
    padding-bottom: 84px;
  }
}
.p-model-house__item * {
  text-box: trim-both cap alphabetic;
}
.p-model-house__item-head {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 1070px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-head {
    min-height: auto;
  }
}
.p-model-house__item-bk {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-bk {
    height: auto;
    aspect-ratio: 393/1112;
  }
}
.p-model-house__item-bk::before {
  content: "";
  position: absolute;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.3) 100%);
  inset: 0;
  z-index: 1;
}
.p-model-house__item-bk picture {
  display: block;
  width: 100%;
  height: 100%;
}
.p-model-house__item-bk img,
.p-model-house__item-bk video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-model-house__item-main {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  grid-template-rows: 1fr;
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-main {
    display: flex;
    flex-direction: column;
    flex: none;
    grid-template-rows: unset;
    padding: 0 15px;
    margin-top: 130px;
  }
}
.p-model-house__item-content {
  grid-column: 1/8;
  display: grid;
  grid-template-columns: subgrid;
  grid-template-rows: auto 1fr;
  margin-top: 202px;
  margin-left: -78px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-content {
    display: contents;
    margin: 0;
  }
}
.p-model-house__item-title {
  grid-column: 2/-1;
  grid-row: 1;
  color: var(--color-white);
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-title {
    grid-column: unset;
    grid-row: unset;
    order: 1;
  }
}
.p-model-house__item-title dt {
  font-size: 12px;
  line-height: 32px;
  letter-spacing: 0.04em;
  display: flex;
  gap: 9px;
}
.p-model-house__item-title dt span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.p-model-house__item-title dt span::before, .p-model-house__item-title dt span::after {
  content: "";
  display: inline-block;
  flex-shrink: 0;
  width: 5px;
  height: 17px;
  background-image: url("data:image/svg+xml,%3Csvg width='5' height='17' viewBox='0 0 5 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 1H1V16H5' stroke='%23ffffff' stroke-width='2'/%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.p-model-house__item-title dt span::after {
  transform: scaleX(-1);
}
.p-model-house__item-title dd {
  font-size: 32px;
  line-height: 30px;
  letter-spacing: 0.04em;
  margin-top: 27px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-title dd {
    font-size: 22px;
    line-height: 34px;
    margin-top: 26px;
  }
}
.p-model-house__item-feature {
  margin-top: 83px;
  background: var(--color-white);
  border-radius: 0 2px 0 0;
}
@media screen and (min-width: 1601px) {
  .p-model-house__item-feature {
    border-radius: 2px 2px 0 0;
  }
}
.p-model-house__item-feature {
  grid-column: 1/-1;
  grid-row: 2;
  display: grid;
  grid-template-columns: subgrid;
  align-content: start;
  padding: 80px 0 200px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-feature {
    grid-column: unset;
    grid-row: unset;
    order: 4;
    margin-top: 17px;
    margin-left: -15px;
    padding: 50px 15px 0 15px;
    display: block;
  }
}
.p-model-house__item-feature-text, .p-model-house__item-list {
  grid-column: 2/7;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-feature-text, .p-model-house__item-list {
    grid-column: unset;
  }
}
.p-model-house__item-list {
  margin-top: 52px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-list {
    margin-top: 40px;
  }
}
.p-model-house__item-list-item {
  font-size: 14px;
  text-box: normal;
  line-height: 22px;
  letter-spacing: 0;
  padding: 18px 20px 18px 0;
  border-bottom: 1px solid var(--color-black);
  display: flex;
  align-items: center;
  gap: 15px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-list-item {
    font-size: 12px;
    padding: 13px 0;
    gap: 10px;
  }
}
.p-model-house__item-list-item::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
}
.p-model-house__item-list-item:first-child {
  border-top: 1px solid var(--color-black);
}
.p-model-house__item-feature-text {
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  align-self: start;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-feature-text {
    font-size: 12px;
    line-height: 26px;
  }
}
.p-model-house__item-drawing {
  grid-column: 9/13;
  margin-top: 87px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-drawing {
    display: contents;
    grid-column: unset;
    margin-top: 0;
  }
}
.p-model-house__item-drawing-image {
  max-width: 392px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-drawing-image {
    order: 2;
    max-width: 100%;
    width: 100%;
    margin: 53px auto 0;
  }
}
.p-model-house__item-drawing-image img {
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-drawing-image img {
    width: 87%;
    margin: 0 auto;
  }
}
.p-model-house__item-detail {
  margin-top: 60px;
  border-radius: 2px;
  background: var(--color-white);
  padding: 20px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-detail {
    order: 3;
    margin-top: 39px;
  }
}
.p-model-house__item-detail-item {
  display: flex;
  gap: 6px;
}
.p-model-house__item-detail-item + .p-model-house__item-detail-item {
  margin-top: 20px;
}
.p-model-house__item-detail-item dt {
  width: 96px;
  position: relative;
  padding-right: 10px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-detail-item dt {
    width: 163px;
  }
}
.p-model-house__item-detail-item dt::before, .p-model-house__item-detail-item dt::after {
  content: "";
  position: absolute;
  right: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: #2B2A2E;
}
.p-model-house__item-detail-item dt::before {
  top: calc(50% - 3px);
}
.p-model-house__item-detail-item dt::after {
  top: calc(50% + 1px);
}
.p-model-house__item-detail-item dd {
  flex: 1;
}
.p-model-house__item-images {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  position: relative;
  margin-top: -140px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-images {
    display: flex;
    gap: 5px;
    margin-top: 40px;
    padding: 0 14px;
    align-items: flex-start;
  }
}
.p-model-house__item-images-main {
  grid-column: 1/7;
  aspect-ratio: 720/959;
  border-radius: 2px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-images-main {
    grid-column: unset;
    flex: 0 0 calc(59% - 2.5px);
    aspect-ratio: 217/302;
    position: sticky;
    top: 68px;
  }
}
.p-model-house__item-images-main img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-model-house__item-images-sub {
  grid-column: 7/13;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-images-sub {
    grid-column: unset;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    grid-template-columns: unset;
    grid-template-rows: unset;
  }
}
.p-model-house__item-images-sub-item {
  overflow: hidden;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-images-sub-item {
    aspect-ratio: 143/192;
    flex: none;
  }
}
.p-model-house__item-images-sub-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-model-house__item-button {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  margin-top: 71px;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-button {
    display: flex;
    padding: 0 14px;
    margin-top: 60px;
  }
}
.p-model-house__item-button .c-button {
  max-width: 100%;
  grid-column: 3/11;
}
@media screen and (max-width: 1024px) {
  .p-model-house__item-button .c-button {
    width: 100%;
  }
}

.p-concept-house__item {
  padding: 117px 0 0;
  background: #313034;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__item {
    padding: 100px 0 0;
  }
}
.p-concept-house__item * {
  text-box: trim-both cap alphabetic;
}
.p-concept-house__main {
  position: relative;
}
.p-concept-house__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-items: start;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__inner {
    display: flex;
    flex-direction: column;
  }
}
.p-concept-house__desc {
  background: var(--color-white);
  border-radius: 2px;
  padding: 33px 43px 64px;
  z-index: 1;
  position: absolute;
  top: 0;
  left: 10%;
  max-width: 440px;
  width: 27.5%;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__desc {
    max-width: 100%;
    width: 100%;
    position: static;
    margin: 0;
    padding: 39px 20px 32px;
    width: 100%;
    margin: 0 auto 64px;
  }
}
@media screen and (max-width: 1024px) {
  .p-concept-house__desc .c-title {
    margin-left: 16px;
  }
}
.p-concept-house__desc-text {
  display: flex;
  flex-direction: column;
  gap: 40px;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  font-weight: 700;
  color: #2B2B2D;
  margin-top: 31px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__desc-text {
    gap: 30px;
    font-size: 12px;
    line-height: 26px;
    margin-top: 43px;
  }
}
.p-concept-house__head {
  grid-column: 6/12;
  color: var(--color-white);
  margin-top: 54px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__head {
    margin-top: 0;
    width: 100%;
  }
}
.p-concept-house__head-main {
  display: flex;
  align-items: flex-end;
  gap: 20px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__head-main {
    align-items: flex-start;
  }
}
.p-concept-house__title {
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__title {
    margin-top: 25px;
  }
}
.p-concept-house__title dt {
  font-size: 14px;
  line-height: 32px;
  letter-spacing: 0.04em;
  font-weight: 700;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__title dt {
    font-size: 12px;
  }
}
.p-concept-house__title dd {
  font-size: 28px;
  line-height: 30px;
  letter-spacing: 0.04em;
  font-weight: 700;
  margin-top: 31px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__title dd {
    margin-top: 30px;
    font-size: 22px;
  }
}
.p-concept-house__title-sub {
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__title-sub {
    margin-right: 8px;
  }
}
.p-concept-house__title-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.p-concept-house__title-line {
  display: inline-block;
  flex-shrink: 0;
  width: 4px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg width='4' height='15' viewBox='0 0 4 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 1H1V14H4' stroke='%23ffffff' stroke-width='2'/%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.p-concept-house__title-line:last-child {
  transform: scaleX(-1);
}
.p-concept-house__logo {
  width: 207px;
  height: 200px;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__logo {
    width: 100px;
    height: auto;
  }
}
.p-concept-house__text {
  margin-top: 50px;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__text {
    margin-top: 49px;
  }
}
.p-concept-house__video {
  display: block;
  position: relative;
  width: 100%;
  margin: 64px auto 0;
  border-radius: 2px;
  overflow: hidden;
  aspect-ratio: 1592/600;
  max-height: 600px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__video {
    aspect-ratio: 385/210;
    margin: 40px auto 0;
  }
}
.p-concept-house__video video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-concept-house__video .p-concept-house__tag {
  right: max(0px, 50% - 800px);
}
.p-concept-house__tag {
  position: absolute;
  bottom: 0;
  right: 0;
  background: var(--color-white);
  color: #363538;
  font-size: 12px;
  line-height: 24px;
  letter-spacing: 0.11em;
  font-weight: 700;
  padding: 8px 15px;
  border-radius: 2px 0 2px 0;
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__tag {
    font-size: 10px;
    line-height: 24px;
    padding: 4px 10px;
  }
}
.p-concept-house__bottom {
  width: 100%;
  background: #414044;
  padding-bottom: 80px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__bottom {
    padding-bottom: 39px;
  }
}
.p-concept-house__bottom-inner {
  max-width: 1600px;
  width: calc(100% - 8px);
  padding: 4px 78px 0;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__bottom-inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 0 4px;
    margin-top: 4px;
  }
}
.p-concept-house__info {
  grid-column: 2/5;
  align-self: end;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-concept-house__info {
    order: 2;
    padding: 40px 10px 0;
    width: 100%;
  }
}
.p-concept-house__info-heading {
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__info-heading {
    font-size: 12px;
    line-height: 26px;
  }
}
.p-concept-house__info-body {
  margin-top: 51px;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__info-body {
    margin-top: 39px;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-concept-house__info-spec {
  margin-top: 40px;
  background: #373639;
  border-radius: 2px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  text-box: normal;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__info-spec {
    padding: 15px;
    gap: 15px;
    margin-top: 30px;
  }
}
.p-concept-house__info-spec-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 14px;
  line-height: 22px;
  font-weight: 700;
}
.p-concept-house__info-spec-item dt {
  min-width: 96px;
  position: relative;
  padding-right: 10px;
}
.p-concept-house__info-spec-item dt::before, .p-concept-house__info-spec-item dt::after {
  content: "";
  position: absolute;
  right: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: var(--color-white);
}
.p-concept-house__info-spec-item dt::before {
  top: calc(50% - 3px);
}
.p-concept-house__info-spec-item dt::after {
  top: calc(50% + 1px);
}
.p-concept-house__info-spec-item dd {
  flex: 1;
  margin: 0;
}
.p-concept-house__media {
  grid-column: 6/-1;
  margin-right: -78px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__media {
    order: 1;
    margin: 0;
  }
}
.p-concept-house__photos {
  display: flex;
  gap: 4px;
  text-box: normal;
}
.p-concept-house__photo {
  flex: 1;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__photo:has(.p-concept-house__tag) {
    padding-bottom: 15px;
  }
}
@media screen and (max-width: 1024px) {
  .p-concept-house__photo .p-concept-house__tag {
    width: 100%;
    text-align: center;
    border-radius: 0 0 2px 2px;
  }
}
.p-concept-house__photo-image {
  aspect-ratio: 302/227;
  border-radius: 2px;
  overflow: hidden;
}
.p-concept-house__photo-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-concept-house__drawing {
  position: relative;
  aspect-ratio: 914/300;
  background: var(--color-white);
  border-radius: 2px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.p-concept-house__drawing img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.p-concept-house__drawing--01 img {
  width: 72.2100656455%;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__drawing--01 img {
    width: 94.8051948052%;
  }
}
@media screen and (max-width: 1024px) {
  .p-concept-house__drawing--01 {
    aspect-ratio: 385/140;
  }
}
.p-concept-house__drawing--02 {
  aspect-ratio: 914/380;
}
.p-concept-house__drawing--02 img {
  width: 48.3588621444%;
}
@media screen and (max-width: 1024px) {
  .p-concept-house__drawing--02 img {
    width: 53.2467532468%;
  }
}
@media screen and (max-width: 1024px) {
  .p-concept-house__drawing--02 {
    aspect-ratio: 385/269;
  }
}
.p-concept-house__plan {
  position: relative;
}
.p-concept-house__plan-inner {
  aspect-ratio: 914/380;
  background: #D9D9D9;
  border-radius: 2px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.p-concept-house__plan-inner img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

@keyframes kv-wipe {
  from {
    clip-path: inset(0 0 100% 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes kv-intro-img {
  from {
    clip-path: inset(0 0 0 100%);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes kv-intro-img-zoom {
  from {
    transform: scale(1.1);
  }
  to {
    transform: none;
  }
}
.p-kv {
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-kv {
    padding-top: 5px;
    overflow-x: clip;
    overflow-y: visible;
    position: relative;
    z-index: 1;
  }
}
.p-kv__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-items: end;
  padding: 0 82px;
}
@media screen and (max-width: 1024px) {
  .p-kv__inner {
    height: 100vh;
    height: 100svh;
    padding: 0 14px 0;
    display: flex;
    justify-content: space-between;
    -moz-column-gap: 0;
         column-gap: 0;
  }
}
.p-kv[data-kv-mode=scroll] .p-kv__inner {
  min-height: 100svh;
  align-content: start;
}
@media screen and (min-width: 1025px) {
  .p-kv[data-kv-mode=scroll] .p-kv__inner {
    padding-top: 124px;
  }
}
@media screen and (min-width: 1025px) {
  .p-kv[data-kv-mode=scroll] .p-kv__images {
    height: calc(100svh - 124px);
  }
}
.p-kv__images {
  grid-column: 4/13;
  grid-row: 1;
  margin-right: -82px;
  margin-left: -3px;
  height: 776px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .p-kv__images {
    height: 100%;
    width: 54.2%;
    order: 2;
    margin-right: -14px;
  }
}
.p-kv__slides {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-kv__slides {
    border-radius: 2px 0 0 2px;
  }
}
.p-kv__slide {
  border-radius: 2px 0 0 2px;
  overflow: hidden;
  position: absolute;
  inset: 0;
  visibility: hidden;
  opacity: 0;
  transition: opacity 2.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 2.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-kv__slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-kv__note {
  border-radius: 0 2px 2px 0;
  position: absolute;
  bottom: 20px;
  left: -10px;
  z-index: 2;
  background: var(--color-white);
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
  padding: 31px 10px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 1.8s cubic-bezier(0.16, 1, 0.3, 1);
}
@media screen and (max-width: 1024px) {
  .p-kv__note {
    width: 150%;
    left: auto;
    right: 14px;
    bottom: auto;
    top: var(--kv-note-top, auto);
    display: none;
  }
  .p-kv__note.is-note-ready {
    display: block;
  }
  .p-kv__note {
    padding: 31px 10px 31px 15px;
    border-top-right-radius: 2px;
  }
}
@media screen and (max-width: 768px) {
  .p-kv__note {
    width: calc(100vw - 14px);
    font-size: 12px;
  }
}
.p-kv__message {
  grid-column: 1/3;
  grid-row: 1;
  align-self: end;
  margin-bottom: 40px;
  margin-right: -12px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 26px;
  transition: opacity 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-kv__message.is-fading {
  opacity: 0;
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
@media screen and (max-width: 1024px) {
  .p-kv__message {
    margin-right: 47px;
    margin-bottom: 40px;
    gap: 20px;
    transition: transform 1.6s cubic-bezier(0.16, 1, 0.3, 1);
  }
}
@media screen and (max-width: 768px) {
  .p-kv__message {
    margin-right: 34px;
    margin-left: 10px;
    margin-bottom: 110px;
    gap: 20px;
  }
}
.p-kv__group {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 26px;
  transition: transform 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}
@media screen and (max-width: 1024px) {
  .p-kv__group {
    gap: 15px;
  }
}
.p-kv__line {
  position: relative;
  margin: 0;
  writing-mode: vertical-rl;
  font-feature-settings: "vpal";
  font-size: 18px;
  line-height: 24px;
  letter-spacing: 1.98px;
  color: rgba(43, 42, 46, 0.5);
}
.p-kv__line::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  color: var(--color-black);
  writing-mode: inherit;
  font-feature-settings: inherit;
  letter-spacing: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity 1.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@media screen and (max-width: 768px) {
  .p-kv__line {
    font-size: 14px;
    line-height: 14px;
    letter-spacing: 1.54px;
  }
}
.p-kv__line--conclusion {
  font-size: 20px;
  line-height: 26px;
  letter-spacing: 2.2px;
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-kv__line--conclusion.is-fading {
  opacity: 0;
}
@media screen and (max-width: 1024px) {
  .p-kv__line--conclusion {
    transition: transform 1.6s cubic-bezier(0.16, 1, 0.3, 1);
  }
}
@media screen and (max-width: 768px) {
  .p-kv__line--conclusion {
    font-size: 18px;
    line-height: 18px;
    letter-spacing: 1.98px;
  }
}
.p-kv[data-kv-mode=time][data-active="1"] .p-kv__line[data-line="1"]::before {
  opacity: 1;
  transition: none;
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.p-kv[data-kv-mode=time][data-active="2"] .p-kv__line[data-line="2"]::before {
  opacity: 1;
  transition: none;
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.p-kv[data-kv-mode=time][data-active="3"] .p-kv__line[data-line="3"]::before {
  opacity: 1;
  transition: none;
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.p-kv[data-kv-mode=time][data-active="4"] .p-kv__line[data-line="4"]::before {
  opacity: 1;
  transition: none;
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.p-kv[data-kv-mode=time][data-active="5"] .p-kv__group .p-kv__line::before {
  opacity: 1;
}
.p-kv[data-kv-mode=scroll] .p-kv__line[data-line="1"]::before {
  transition: none;
  animation: none;
  --rev: clamp(0, calc(var(--kv-pos, 0) + 1), 1);
  clip-path: inset(0 0 calc((1 - var(--rev)) * 100%) 0);
  --t: clamp(0, calc(var(--kv-pos, 0) - 3), 1);
  opacity: calc((1 - clamp(0, var(--kv-pos, 0) - 0, 1)) * (1 - var(--t)) + var(--t));
}
.p-kv[data-kv-mode=scroll] .p-kv__line[data-line="2"]::before {
  transition: none;
  animation: none;
  --rev: clamp(0, calc(var(--kv-pos, 0) - 0), 1);
  clip-path: inset(0 0 calc((1 - var(--rev)) * 100%) 0);
  --t: clamp(0, calc(var(--kv-pos, 0) - 3), 1);
  opacity: calc((1 - clamp(0, var(--kv-pos, 0) - 1, 1)) * (1 - var(--t)) + var(--t));
}
.p-kv[data-kv-mode=scroll] .p-kv__line[data-line="3"]::before {
  transition: none;
  animation: none;
  --rev: clamp(0, calc(var(--kv-pos, 0) - 1), 1);
  clip-path: inset(0 0 calc((1 - var(--rev)) * 100%) 0);
  --t: clamp(0, calc(var(--kv-pos, 0) - 3), 1);
  opacity: calc((1 - clamp(0, var(--kv-pos, 0) - 2, 1)) * (1 - var(--t)) + var(--t));
}
.p-kv[data-kv-mode=scroll] .p-kv__line[data-line="4"]::before {
  transition: none;
  animation: none;
  --rev: clamp(0, calc(var(--kv-pos, 0) - 2), 1);
  clip-path: inset(0 0 calc((1 - var(--rev)) * 100%) 0);
  --t: clamp(0, calc(var(--kv-pos, 0) - 3), 1);
  opacity: calc((1 - clamp(0, var(--kv-pos, 0) - 3, 1)) * (1 - var(--t)) + var(--t));
}
.p-kv[data-active="5"] .p-kv__line--conclusion {
  transform: translateX(var(--kv-shift-conclusion, 0px));
  animation: kv-wipe 1.8s cubic-bezier(0.65, 0, 0.35, 1) 0.9s both;
}
.p-kv[data-active="5"] .p-kv__line--conclusion::before {
  opacity: 1;
  transition: none;
}
.p-kv[data-active="5"] .p-kv__group {
  transform: translateX(var(--kv-shift-group, 0px));
}
.p-kv[data-active="5"] .p-kv__note {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 1024px) {
  .p-kv[data-active="5"] .p-kv__message {
    transform: translateY(var(--kv-msg-shift-y, 0px));
  }
}
.p-kv[data-kv-mode=scroll] .p-kv__group {
  transition: none;
  transform: translateX(calc(var(--kv-shift-group, 0px) * clamp(0, var(--kv-pos, 0) - 3, 1)));
}
.p-kv[data-kv-mode=scroll] .p-kv__line--conclusion {
  transition: none;
  opacity: calc(1 - clamp(0, (var(--kv-pos, 0) - 3) * 2, 1));
}
.p-kv[data-kv-mode=scroll][data-active="5"] .p-kv__line--conclusion {
  opacity: 1;
  animation: none;
  --crev: clamp(0, calc((var(--kv-pos, 0) - 3.5) * 2), 1);
  clip-path: inset(0 0 calc((1 - var(--crev)) * 100%) 0);
}
@media screen and (max-width: 1024px) {
  .p-kv[data-kv-mode=scroll] .p-kv__message {
    transition: none;
    transform: translateY(calc(var(--kv-msg-shift-y, 0px) * clamp(0, var(--kv-pos, 0) - 3, 1)));
  }
}
.p-kv[data-kv-mode=scroll] .p-kv__note {
  opacity: 1;
  visibility: visible;
  transition: none;
  transform: translateY(calc((100% + 20px) * (1 - var(--kv-note-pos, 0))));
}
@media screen and (max-width: 1024px) {
  .p-kv[data-kv-mode=scroll] .p-kv__note {
    transform: translateY(calc(var(--kv-note-hide, 100%) * (1 - var(--kv-note-pos, 0))));
  }
}
.p-kv[data-active="1"] .p-kv__slide[data-slide="1"] {
  visibility: visible;
  opacity: 1;
}
.p-kv[data-active="2"] .p-kv__slide[data-slide="2"] {
  visibility: visible;
  opacity: 1;
}
.p-kv[data-active="3"] .p-kv__slide[data-slide="3"] {
  visibility: visible;
  opacity: 1;
}
.p-kv[data-active="4"] .p-kv__slide[data-slide="4"] {
  visibility: visible;
  opacity: 1;
}
.p-kv[data-active="5"] .p-kv__slide[data-slide="5"] {
  visibility: visible;
  opacity: 1;
}
.p-kv[data-kv-intro] .p-kv__line {
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1) both;
}
.p-kv[data-kv-intro] .p-kv__line[data-line="1"] {
  animation-delay: 0s;
}
.p-kv[data-kv-intro] .p-kv__line[data-line="2"] {
  animation-delay: 0.15s;
}
.p-kv[data-kv-intro] .p-kv__line[data-line="3"] {
  animation-delay: 0.3s;
}
.p-kv[data-kv-intro] .p-kv__line[data-line="4"] {
  animation-delay: 0.45s;
}
.p-kv[data-kv-intro] .p-kv__line[data-line="5"] {
  animation-delay: 0.6s;
}
.p-kv[data-kv-intro] .p-kv__line[data-line]::before {
  opacity: 0;
  animation: none;
  transition: none;
  clip-path: inset(0 0 100% 0);
}
.p-kv[data-kv-intro] .p-kv__line[data-line="1"]::before {
  opacity: 1;
  animation: kv-wipe 1.6s cubic-bezier(0.65, 0, 0.35, 1) 2.4s both;
}
.p-kv[data-kv-intro] .p-kv__slide[data-slide="1"] {
  animation: kv-intro-img 1.4s cubic-bezier(0.65, 0, 0.35, 1) 0s both;
}
.p-kv[data-kv-intro] .p-kv__slide[data-slide="1"] img {
  transform-origin: 50% 50%;
  animation: kv-intro-img-zoom 1.4s cubic-bezier(0.65, 0, 0.35, 1) 0s both;
}
@media (prefers-reduced-motion: reduce) {
  .p-kv[data-kv-intro] .p-kv__line,
  .p-kv[data-kv-intro] .p-kv__line[data-line]::before,
  .p-kv[data-kv-intro] .p-kv__slide[data-slide="1"],
  .p-kv[data-kv-intro] .p-kv__slide[data-slide="1"] img {
    animation: none;
    clip-path: none;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-kv .p-kv__slide,
  .p-kv .p-kv__group,
  .p-kv .p-kv__note,
  .p-kv .p-kv__line,
  .p-kv .p-kv__line::before {
    transition: none;
    animation: none;
  }
  .p-kv[data-active="5"] .p-kv__line--conclusion {
    animation: none;
  }
}

.p-persp {
  position: relative;
  width: 100%;
  height: 750px;
  padding: 130px 0 121px;
}
@media screen and (max-width: 1024px) {
  .p-persp {
    padding: 117px 0 98px;
  }
}
.p-persp__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background: var(--color-white);
}
.p-persp__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: #2b2a2e;
  background-image: url("../images/index/noise.svg");
  background-size: cover;
  opacity: 0.2;
}
@media screen and (max-width: 1024px) {
  .p-persp__bg::before {
    opacity: 0.5;
  }
}
.p-persp__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0) 0%, #fff 80%);
  opacity: 0;
}
.p-persp__bg.js-reveal::after {
  opacity: 1;
}
.p-persp__bg.js-reveal.is-inview::after {
  opacity: 0;
  transition: opacity 0.5s ease-out;
}
.p-persp__bg img,
.p-persp__bg video {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center top;
     object-position: center top;
  width: 100%;
  height: 100%;
}
.p-persp__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-persp__inner {
    display: block;
  }
}
.p-persp__detail {
  grid-column: 2/9;
}
.p-persp__point {
  grid-column: 9/13;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 15px;
}
@media screen and (max-width: 1024px) {
  .p-persp__point {
    gap: 8px;
    position: absolute;
    top: 0;
    right: 14px;
  }
}
.p-persp__point p {
  border-radius: 2px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  white-space: nowrap;
  line-height: 1;
  letter-spacing: 0.11em;
  font-size: 14px;
  background: var(--color-white);
  padding: 15px 6px;
}
@media screen and (max-width: 1024px) {
  .p-persp__point p {
    font-size: 10px;
    padding: 8px 4px;
  }
}

.p-about {
  position: relative;
  height: 720px;
  margin: 0 auto;
  overflow-x: clip;
  overflow-y: visible;
}
@media screen and (max-width: 1024px) {
  .p-about {
    height: auto;
  }
}
.p-about__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
}
.p-about__bg::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1;
}
.p-about__bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.p-about__bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .p-about__bg img {
    width: 1939px;
    height: 1293px;
    -o-object-position: -631px -30px;
       object-position: -631px -30px;
  }
}
.p-about__bg.c-img-reveal.js-reveal img {
  transform: none;
}
.p-about__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  grid-template-rows: 130px auto auto 1fr;
  height: 100%;
  padding: 0 82px;
}
@media screen and (max-width: 1024px) {
  .p-about__inner {
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 109px 15px 70px;
  }
}
.p-about__header {
  grid-column: 2/8;
  grid-row: 2;
}
.p-about__copy {
  grid-column: 2/8;
  grid-row: 3;
  margin-top: 23px;
}
@media screen and (max-width: 1024px) {
  .p-about__copy {
    margin-top: 14px;
  }
  .p-about__copy .c-lead p {
    white-space: normal;
  }
}
.p-about__img {
  grid-column: 8/13;
  grid-row: 1/5;
  align-self: stretch;
  position: relative;
  background: #fff;
  margin-right: -82px;
}
.p-about__img::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 100%;
  width: 50vw;
  background: #fff;
}
@media screen and (max-width: 1024px) {
  .p-about__img::after {
    opacity: 0;
  }
}
@media screen and (max-width: 1024px) {
  .p-about__img {
    grid-column: auto;
    grid-row: auto;
    margin-right: 0;
    align-self: auto;
    margin-left: -6px;
    max-width: 400px;
    width: 86%;
    margin: 20px auto 0;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 2px;
    background: none;
    position: relative;
  }
}
.p-about__img-inner {
  position: absolute;
  top: 50%;
  left: 51.5%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: 492px;
  width: 72.7810650888%;
  aspect-ratio: 1;
}
@media screen and (max-width: 1024px) {
  .p-about__img-inner {
    position: absolute;
    inset: 0;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
  }
}
.p-about__text {
  grid-column: 2/8;
  grid-row: 4;
  align-self: start;
  margin-top: -12px;
}
@media screen and (max-width: 1024px) {
  .p-about__text {
    align-self: auto;
    margin-top: 40px;
  }
}
.p-about__lead {
  font-size: 14px;
  line-height: 2.143em;
  letter-spacing: 0.11em;
  font-weight: 700;
  color: #fff;
  margin-bottom: 53px;
}
@media screen and (max-width: 1024px) {
  .p-about__lead {
    font-size: 12px;
    line-height: 2.167em;
    margin-bottom: 56px;
  }
}

.p-our-home__makers {
  background-image: url("../images/common/noise_bk.webp");
  background-size: cover;
  background-position: center;
  display: block;
}
@media screen and (max-width: 1024px) {
  .p-our-home__makers {
    display: none;
  }
}
.p-our-home__makers--sp {
  display: none;
}
@media screen and (max-width: 1024px) {
  .p-our-home__makers--sp {
    display: block;
  }
}
@media screen and (max-width: 1024px) {
  .p-our-home__makers .c-makers {
    padding: 0 0 113px;
    background: var(--color-white);
  }
}
.p-our-home__makers-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
.p-our-home__makers-head {
  grid-column: 2/6;
  margin-right: 15px;
}
.p-our-home__makers-head .c-button {
  margin-top: 45px;
}
.p-our-home__makers-list {
  grid-column: 6/12;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 5px;
  margin-top: 24px;
}
.p-our-home__makers-list .c-card {
  width: calc((100% - 5px) / 2);
  background: var(--color-white);
}
.p-our-home__makers-list .c-card__side {
  top: 0px;
  bottom: 0px;
}
.p-our-home__makers-list .c-card__frame {
  top: 0;
  height: 100%;
}
.p-our-home__makers-list .c-card__corners::after {
  opacity: 0;
}

.p-philosophy {
  background-color: #F5F4F1;
  background-image: url("../images/our-home/philosophy_bg.webp");
  background-size: cover;
  background-position: center;
  padding: 152px 0 98px;
  overflow: hidden;
  margin-top: 38px;
}
@media screen and (max-width: 1024px) {
  .p-philosophy {
    padding: 89px 0 72px;
    margin-top: 60px;
  }
}
.p-philosophy__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  padding: 0 82px;
  min-width: 1200px;
}
@media screen and (max-width: 1024px) {
  .p-philosophy__inner {
    display: flex;
    flex-direction: column;
    padding: 0 20px;
    min-width: auto;
  }
}
.p-philosophy .c-sec-head {
  grid-column: 2/7;
  padding-right: 15px;
}
@media screen and (max-width: 1024px) {
  .p-philosophy .c-sec-head {
    display: contents;
  }
}
.p-philosophy .c-sec-head__text {
  order: 4;
}
@media screen and (max-width: 1024px) {
  .p-philosophy .c-sec-head__text {
    margin-top: 20px;
  }
}
.p-philosophy__map {
  margin-top: 23px;
  grid-column: 7/13;
  grid-row: 1/-1;
}
@media (prefers-reduced-motion: no-preference) {
  .p-philosophy__map {
    opacity: 0;
  }
}
@media screen and (max-width: 1024px) {
  .p-philosophy__map {
    max-width: 620px;
    width: 100%;
    margin: 21px auto 0;
    order: 3;
    margin-top: -2px;
  }
}
.p-philosophy__map svg {
  width: 100%;
  overflow: visible;
}
.p-philosophy__map path {
  transform-box: fill-box;
  transform-origin: center;
  mix-blend-mode: normal !important;
}

@keyframes phil-float {
  from {
    transform: translateY(calc(var(--phil-amp, 3px) * -1));
  }
  to {
    transform: translateY(var(--phil-amp, 3px));
  }
}
@keyframes phil-fade {
  0% {
    opacity: var(--phil-olow, 0.1);
  }
  20% {
    opacity: 1;
  }
  32% {
    opacity: 1;
  }
  50% {
    opacity: var(--phil-olow, 0.1);
  }
  100% {
    opacity: var(--phil-olow, 0.1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-philosophy__map path {
    animation: none !important;
  }
}
@keyframes p-professional-scroll {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-50%);
  }
}
.p-professional {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  padding: 150px 82px;
  height: 776px;
}
@media screen and (max-width: 1024px) {
  .p-professional {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    padding: 80px 10px;
    height: auto;
  }
}
.p-professional__bg--pc {
  display: block;
}
@media screen and (max-width: 1024px) {
  .p-professional__bg--pc {
    display: none;
  }
}
.p-professional__bg--sp {
  display: none;
}
@media screen and (max-width: 1024px) {
  .p-professional__bg--sp {
    display: block;
  }
}
.p-professional__bg-inner {
  display: flex;
  gap: 4px;
  overflow: hidden;
  background: var(--color-black);
  position: absolute;
  inset: 0;
}
@media screen and (max-width: 1024px) {
  .p-professional__bg-inner {
    gap: 2px;
  }
}
.p-professional__bg-inner.js-reveal {
  -webkit-mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(145deg, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.05) 85%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 200% 200%;
  mask-size: 200% 200%;
  -webkit-mask-position: 200% 200%;
  mask-position: 200% 200%;
}
.p-professional__bg-inner.js-reveal.is-inview {
  animation: c-curtain-reveal 3.5s cubic-bezier(0.23, 0.63, 0.32, 0.87) forwards;
}
@media (prefers-reduced-motion: reduce) {
  .p-professional__bg-inner.js-reveal {
    -webkit-mask-image: none;
    mask-image: none;
    animation: none;
  }
}
.p-professional__col {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  --delay: 0s;
  --direction: normal;
}
.p-professional__col:nth-child(2) {
  --delay: -5s;
  --direction: reverse;
}
.p-professional__col:nth-child(3) {
  --delay: -2.5s;
}
.p-professional__track {
  display: flex;
  flex-direction: column;
  gap: 4px;
  animation: p-professional-scroll 28s linear infinite;
  animation-delay: var(--delay);
  animation-direction: var(--direction);
}
@media screen and (max-width: 1024px) {
  .p-professional__track {
    animation-duration: 40s;
  }
}
.p-professional__item {
  flex-shrink: 0;
  width: 100%;
  aspect-ratio: 4/3;
  overflow: hidden;
}
.p-professional__item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-professional__main {
  position: relative;
  grid-column: 2/12;
  max-width: 716px;
  width: 100%;
  margin: 0 auto;
  background: var(--color-white);
  padding: 65px 0 70px;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-professional__main {
    grid-column: 1/6;
    padding: 80px 10px 53px;
  }
}
.p-professional__deco {
  font-feature-settings: "palt";
  text-spacing-trim: trim-all;
  position: relative;
  display: inline-block;
  padding: 0 10px 0 10px;
}
@media screen and (max-width: 1024px) {
  .p-professional__deco {
    padding: 0 5px;
  }
}
.p-professional__deco::before, .p-professional__deco::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.5px;
  background: var(--color-gray);
}
.p-professional__deco::before {
  top: 0;
}
.p-professional__deco::after {
  bottom: 0;
}
.p-professional__deco span[aria-hidden] {
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: 10px;
  right: 10px;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .p-professional__deco span[aria-hidden] {
    left: 5px;
    right: 5px;
    top: -5px;
    bottom: -5px;
  }
}
.p-professional__deco span[aria-hidden]::before, .p-professional__deco span[aria-hidden]::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0.5px;
  background: radial-gradient(circle 2px at 0 10px, var(--color-gray) 1.8px, transparent 2px), radial-gradient(circle 2px at 0 calc(100% - 10px), var(--color-gray) 1.8px, transparent 2px), linear-gradient(var(--color-gray), var(--color-gray));
  background-repeat: no-repeat;
}
@media screen and (max-width: 1024px) {
  .p-professional__deco span[aria-hidden]::before, .p-professional__deco span[aria-hidden]::after {
    background: radial-gradient(circle 1.5px at 0 4.5px, var(--color-gray) 1.3px, transparent 1.5px), radial-gradient(circle 1.5px at 0 calc(100% - 4.5px), var(--color-gray) 1.3px, transparent 1.5px), linear-gradient(var(--color-gray), var(--color-gray));
    background-repeat: no-repeat;
  }
}
.p-professional__deco span[aria-hidden]::before {
  left: 0;
}
.p-professional__deco span[aria-hidden]::after {
  right: 0;
}
.p-professional__deco--02 {
  padding: 0 6px 0 10px;
}
@media screen and (max-width: 1024px) {
  .p-professional__deco--02 {
    padding: 0 1px 0 4px;
  }
}
.p-professional__main-head {
  text-align: center;
}
.p-professional__main-head dt {
  font-size: 10px;
  letter-spacing: 0;
  line-height: 38px;
  font-family: var(--font-en);
}
.p-professional__main-head dd {
  font-size: 18px;
  letter-spacing: 0;
  line-height: 100%;
}
@media screen and (max-width: 1024px) {
  .p-professional__main-head dd {
    font-size: 16px;
  }
}
.p-professional__main-lead {
  text-align: center;
  display: flex;
  flex-direction: column;
  margin-top: 38px;
}
.p-professional__main-lead p {
  margin: 0 auto;
  max-width: -moz-fit-content;
  max-width: fit-content;
  font-size: 22px;
  letter-spacing: 0.04rem;
  line-height: 100%;
}
.p-professional__main-lead p + p {
  margin-top: 20px;
}
.p-professional__main-text {
  text-align: center;
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  .p-professional__main-text {
    font-size: 12px;
  }
}

.p-professional__deco.js-reveal span[aria-hidden]::before, .p-professional__deco.js-reveal span[aria-hidden]::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-professional__deco.js-reveal::before, .p-professional__deco.js-reveal::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
}

.p-professional__deco.js-reveal:not(.is-inview) span[aria-hidden]::before, .p-professional__deco.js-reveal:not(.is-inview) span[aria-hidden]::after {
  clip-path: inset(-2px -2px 100% -2px);
}
.p-professional__deco.js-reveal:not(.is-inview)::before, .p-professional__deco.js-reveal:not(.is-inview)::after {
  clip-path: inset(-2px 100% -2px -2px);
}

@media (prefers-reduced-motion: reduce) {
  .p-professional__deco.js-reveal span[aria-hidden]::before, .p-professional__deco.js-reveal span[aria-hidden]::after {
    clip-path: none;
    transition: none;
  }
  .p-professional__deco.js-reveal::before, .p-professional__deco.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.p-locally {
  padding: 130px 82px;
}
@media screen and (max-width: 1024px) {
  .p-locally {
    padding: 120px 0 111px;
  }
}
.p-locally__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-locally__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
.p-locally__head {
  grid-column: 1/7;
  grid-row: 1;
  display: grid;
  grid-template-columns: subgrid;
}
@media screen and (max-width: 1024px) {
  .p-locally__head {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
}
.p-locally__head .c-sec-head {
  grid-column: 2/6;
}
.p-locally__image {
  grid-column: 1/6;
  grid-row: 2;
  width: 100%;
  aspect-ratio: 1;
  margin-top: 66px;
}
@media screen and (max-width: 1024px) {
  .p-locally__image {
    max-width: 520px;
    width: 86%;
    margin: 40px auto 10px;
  }
}
.p-locally__text {
  margin-top: 132px;
  grid-column: 7/13;
  grid-row: 1/3;
  font-size: 16px;
  letter-spacing: 0.11em;
  line-height: 36px;
}
@media screen and (max-width: 1024px) {
  .p-locally__text {
    font-size: 14px;
    line-height: 26px;
    margin-top: 74px;
  }
}
.p-locally__text p + p {
  margin-top: 37px;
}
.p-locally__text {
  position: relative;
}
.p-locally__text::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.7) 20%, #fff 80%);
  opacity: 0;
}
.p-locally__text.js-reveal::after {
  opacity: 1;
}
.p-locally__text.js-reveal.is-inview::after {
  opacity: 0;
  transition: opacity 1s ease-out;
}

.p-reassurance {
  background: var(--color-black);
  padding: 130px 0 120px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-reassurance {
    padding: 109px 0 80px;
  }
}
.p-reassurance__intro {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-items: flex-start;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__intro {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-reassurance__intro .c-sec-head {
  grid-column: 2/6;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__intro .c-sec-head {
    grid-column: 1/6;
    display: contents;
  }
  .p-reassurance__intro .c-sec-head .c-title,
  .p-reassurance__intro .c-sec-head .c-lead,
  .p-reassurance__intro .c-sec-head .c-sec-head__text {
    grid-column: 1/-1;
  }
  .p-reassurance__intro .c-sec-head .c-sec-head__text {
    order: 4;
    margin-top: 33px;
  }
}
.p-reassurance__intro-image {
  grid-column: 6/13;
  margin-right: -78px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__intro-image {
    grid-column: 1/6;
    margin-right: -14px;
    order: 3;
    margin-top: -8px;
  }
}
.p-reassurance__intro-image .p-reassurance__intro-frame {
  position: relative;
  width: calc(50% - 2px);
  aspect-ratio: 876/713;
  overflow: hidden;
  clip-path: inset(1px 0);
  background: var(--color-black);
  border-radius: 3px;
  overflow: hidden;
}
.p-reassurance__intro-image .p-reassurance__intro-frame::before {
  opacity: 0;
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--color-black);
  background-image: url("../images/index/noise.svg");
  background-size: cover;
  opacity: 0.2;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__intro-image .p-reassurance__intro-frame::before {
    opacity: 0;
  }
}
.p-reassurance__intro-image .p-reassurance__intro-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(43, 42, 46, 0.2) 0%, rgba(43, 42, 46, 0.7) 20%, #2B2A2E 80%);
  opacity: 0;
}
.p-reassurance__intro-image .p-reassurance__intro-frame.js-reveal::after {
  opacity: 1;
}
.p-reassurance__intro-image .p-reassurance__intro-frame.js-reveal.is-inview::after {
  opacity: 0;
  transition: opacity 1s ease-out;
}
.p-reassurance__intro-image .p-reassurance__intro-frame img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-reassurance__intro-line {
  grid-column: 1/13;
  background: rgba(255, 255, 255, 0.2);
  height: 0.5px;
  margin-top: 79px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__intro-line {
    grid-column: 1/6;
    order: 5;
    margin-top: 74px;
  }
}
.p-reassurance__detail {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-content: start;
  padding-top: 90px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__detail {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    padding-top: 57px;
  }
}
.p-reassurance__detail .c-lead {
  grid-column: 2/6;
  align-self: start;
  margin-top: 0;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__detail .c-lead {
    grid-column: 1/6;
  }
}
@media screen and (max-width: 1300px) {
  .p-reassurance__detail .c-lead.default {
    display: none;
  }
}
@media screen and (max-width: 1300px) and (max-width: 1024px) {
  .p-reassurance__detail .c-lead.default {
    display: block;
  }
}
.p-reassurance__detail .c-lead.middle {
  display: none;
}
@media screen and (max-width: 1300px) {
  .p-reassurance__detail .c-lead.middle {
    display: block;
  }
}
@media screen and (max-width: 1024px) {
  .p-reassurance__detail .c-lead.middle {
    display: none;
  }
}
@media screen and (max-width: 380px) {
  .p-reassurance__detail .c-lead p {
    font-size: 20px;
  }
}
.p-reassurance__list {
  color: var(--color-white);
  grid-column: 6/12;
  align-self: start;
  min-width: 0;
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__list {
    grid-column: 1/6;
  }
}
.p-reassurance__list-item {
  position: relative;
  padding-bottom: 20px;
}
.p-reassurance__list-item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--color-white);
}
.p-reassurance__list-item + .p-reassurance__list-item {
  margin-top: 46px;
}
.p-reassurance__list-item dt {
  font-size: 22px;
  line-height: 30px;
  letter-spacing: 0.11em;
}
.p-reassurance__list-item dd {
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  margin-top: 7px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__list-item dd {
    line-height: 26px;
    font-size: 12px;
    margin-top: 12px;
  }
}
.p-reassurance__warranty {
  grid-column: 2/12;
  display: flex;
  gap: 4px;
  margin-top: 63px;
  flex-wrap: wrap;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__warranty {
    grid-column: 1/6;
    margin-top: 60px;
  }
}
.p-reassurance__warranty-item {
  width: calc((100% - 12px) / 4);
  border-bottom: 1px solid var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-reassurance__warranty-item {
    width: calc((100% - 4px) / 2);
    border-bottom: none;
  }
}
@media screen and (max-width: 768px) {
  .p-reassurance__warranty-item {
    width: 100%;
  }
}
.p-reassurance__warranty-image {
  display: block;
  overflow: hidden;
}
.p-reassurance__warranty-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-reassurance__warranty-text {
  color: var(--color-white);
  padding: 22px 0 34px 12px;
}
@media screen and (max-width: 1024px) {
  .p-reassurance__warranty-text {
    padding: 22px 0 50px 0;
  }
}
.p-reassurance__warranty-text dt {
  font-size: 18px;
  letter-spacing: 0.11em;
  line-height: 30px;
}
.p-reassurance__warranty-text dd {
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 26px;
  margin-top: 14px;
}

.p-reassurance__list-item.js-reveal::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.p-reassurance__list-item.js-reveal:not(.is-inview)::after {
  clip-path: inset(-2px 100% -2px -2px);
}

@media (prefers-reduced-motion: reduce) {
  .p-reassurance__list-item.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.p-performance {
  padding: 134px 0 149px;
  background-image: url("../images/common/noise_bk.webp");
  background-size: cover;
  background-position: center;
  overflow: clip;
}
@media screen and (max-width: 1024px) {
  .p-performance {
    padding: 120px 0;
  }
}
.p-performance__head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-performance__head {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-performance__head .c-sec-head {
  grid-column: 2/6;
}
@media screen and (max-width: 1024px) {
  .p-performance__head .c-sec-head {
    grid-column: 1/-1;
  }
}
.p-performance__text {
  grid-column: 7/12;
  margin-top: 9px;
}
@media screen and (max-width: 1024px) {
  .p-performance__text {
    grid-column: 1/-1;
  }
}
.p-performance__text * {
  text-box: trim-both cap alphabetic;
}
.p-performance__text p {
  letter-spacing: 0.11em;
  line-height: 30px;
  font-size: 14px;
}
@media screen and (max-width: 1024px) {
  .p-performance__text p {
    font-size: 12px;
    line-height: 26px;
  }
}
.p-performance__text p + p {
  margin-top: 40px;
}
.p-performance__body {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-content: start;
  margin-top: 70px;
}
@media screen and (max-width: 1024px) {
  .p-performance__body {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 50px;
  }
}
.p-performance__list {
  grid-column: 2/7;
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.p-performance__list * {
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-performance__list {
    gap: 40px;
  }
}
.p-performance__visual {
  grid-column: 7/13;
  align-self: start;
  position: sticky;
  top: max(100px, (100dvh - 717px) / 2);
  display: grid;
  background: #fff;
  mix-blend-mode: multiply;
}
@media screen and (max-width: 1024px) {
  .p-performance__visual {
    display: none;
  }
}
.p-performance__visual-img {
  grid-column: 1;
  grid-row: 1;
  margin-left: min(3.125vw, 50px);
  width: min(51.095vw, 817.52px);
  max-width: none;
  aspect-ratio: 818/797;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 0;
  visibility: hidden;
  transform: scale(1.04);
  transform-origin: center;
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
}
.p-performance__visual-img.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .p-performance__visual-img, .p-performance__visual-img.is-active {
    transition: none;
  }
}
.p-performance__visual-caption {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  justify-self: center;
  z-index: 10;
  margin-left: min(3.125vw, 50px);
  margin-bottom: 10%;
  min-height: 92px;
  padding: 8px 28px;
  width: 80%;
  background: rgba(255, 255, 255, 0.8980392157);
  color: var(--color-black);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.11em;
  line-height: 1.6;
  text-align: center;
  pointer-events: none;
  display: grid;
  align-items: center;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.p-performance__visual-caption:not(:has(.is-active)) {
  opacity: 0;
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .p-performance__visual-caption {
    transition: none;
  }
}
.p-performance__item-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7%;
  z-index: 10;
  min-height: 51px;
  padding: 8px 15px;
  background: rgba(255, 255, 255, 0.8980392157);
  color: var(--color-black);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.11em;
  line-height: 1.6;
  text-align: center;
  pointer-events: none;
  display: grid;
  align-items: center;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.p-performance__item-caption:not(:has(.is-active)) {
  opacity: 0;
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .p-performance__item-caption {
    transition: none;
  }
}
.p-performance__item-caption-text {
  grid-area: 1/1;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.p-performance__item-caption-text.is-active {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.65s, visibility 0s 0.65s;
}
@media (prefers-reduced-motion: reduce) {
  .p-performance__item-caption-text, .p-performance__item-caption-text.is-active {
    transition: none;
  }
}
.p-performance__visual-caption-text {
  grid-area: 1/1;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.5s;
}
.p-performance__visual-caption-text.is-active {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.65s, visibility 0s 0.65s;
}
@media (prefers-reduced-motion: reduce) {
  .p-performance__visual-caption-text, .p-performance__visual-caption-text.is-active {
    transition: none;
  }
}
.p-performance__visual.c-img-reveal.js-reveal .p-performance__visual-img {
  transform: scale(1.04);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
}
.p-performance__visual.c-img-reveal.js-reveal .p-performance__visual-img.is-active {
  transform: scale(1);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
}
@media screen and (max-width: 1024px) {
  .p-performance__item {
    display: flex;
    flex-direction: column;
    cursor: default;
  }
}
.p-performance__item-img {
  display: none;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-img {
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 340/331;
    overflow: hidden;
    background: #fff;
    mix-blend-mode: multiply;
  }
  .p-performance__item-img :is(img, svg) {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.04);
    transform-origin: center;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
  }
  .p-performance__item-img :is(img, svg).is-active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
  }
}
@media screen and (max-width: 1024px) and (prefers-reduced-motion: reduce) {
  .p-performance__item-img :is(img, svg),
  .p-performance__item-img :is(img, svg).is-active {
    transition: none;
  }
}
.p-performance__item-img.c-img-reveal.js-reveal :is(img, svg) {
  transform: scale(1.04);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
}
.p-performance__item-img.c-img-reveal.js-reveal :is(img, svg).is-active {
  transform: scale(1);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.22s, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.22s, visibility 0s;
}
.p-performance__visual.is-draw-mode .p-performance__visual-img, .p-performance__visual.is-draw-mode.c-img-reveal.js-reveal .p-performance__visual-img {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.p-performance__visual.is-draw-mode .p-performance__visual-img.is-active, .p-performance__visual.is-draw-mode.c-img-reveal.js-reveal .p-performance__visual-img.is-active {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.p-performance__item-img.is-draw-mode :is(img, svg), .p-performance__item-img.is-draw-mode.c-img-reveal.js-reveal :is(img, svg) {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.p-performance__item-img.is-draw-mode :is(img, svg).is-active, .p-performance__item-img.is-draw-mode.c-img-reveal.js-reveal :is(img, svg).is-active {
  opacity: 1;
  transform: none;
  transition: visibility 0s;
}
.p-performance__item-card {
  background: #323135;
  border-radius: 2px;
  padding: 30px 30px 20px;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-card {
    padding: 30px 14px 20px;
    margin-top: -20px;
    position: relative;
    z-index: 1;
  }
}
.p-performance__item-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  padding-bottom: 25px;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-header {
    gap: 17px;
  }
}
.p-performance__item-title {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.p-performance__item-num {
  font-family: "Libre Baskerville", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: #fff;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-num {
    font-size: 14px;
  }
}
.p-performance__item-name {
  font-weight: 700;
  font-size: 22px;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-name {
    font-size: 20px;
  }
}
.p-performance__item-sub {
  display: flex;
  align-items: center;
  gap: 10px;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-sub {
    gap: 6px;
  }
}
.p-performance__item-sub-line {
  display: inline-block;
  flex-shrink: 0;
  width: 5px;
  height: 17px;
  background-image: url("data:image/svg+xml,%3Csvg width='5' height='17' viewBox='0 0 5 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 1H1V16H5' stroke='%23ffffff' stroke-width='2'/%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-sub-line {
    width: 4px;
    height: 12px;
  }
}
.p-performance__item-sub-line:last-child {
  transform: scaleX(-1);
}
.p-performance__item-sub-text {
  font-weight: 700;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-sub-text {
    font-size: 14px;
  }
}
.p-performance__item-specs {
  display: grid;
  gap: 2px 4px;
  grid-template-columns: 1fr 1fr;
  padding: 2px 0;
}
.p-performance__item-spec {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.3s;
  border-left: none;
  border-right: none;
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 9px 15px;
  min-height: 52px;
  border-top: 0.5px solid rgba(255, 255, 255, 0.5);
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);
}
@media screen and (max-width: 1024px) {
  .p-performance__item-spec {
    gap: 10px;
    padding: 9px 10px;
  }
}
.p-performance__item-spec.is-row-first::before, .p-performance__item-spec.is-row-last::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.5px;
  background: rgba(255, 255, 255, 0.5);
}
.p-performance__item-spec.is-row-first::before {
  top: -3px;
}
.p-performance__item-spec.is-row-last::after {
  bottom: -3px;
}
.p-performance__item-spec.is-active {
  background: rgba(200, 200, 200, 0.1);
  border-top-color: #fff;
  border-bottom-color: #fff;
}
.p-performance__item-spec.is-active.is-row-first::before, .p-performance__item-spec.is-active.is-row-last::after {
  background: #fff;
}
.p-performance__item-spec.is-active .p-performance__item-spec-dot {
  background: #fff;
}
@media (hover: hover) {
  .p-performance__item-spec:hover {
    background: rgba(200, 200, 200, 0.1);
    border-top-color: #fff;
    border-bottom-color: #fff;
  }
  .p-performance__item-spec:hover.is-row-first::before, .p-performance__item-spec:hover.is-row-last::after {
    background: #fff;
  }
  .p-performance__item-spec:hover .p-performance__item-spec-dot {
    background: #fff;
  }
}
.p-performance__item-spec.is-active-neighbor-top {
  border-top-color: #fff;
}
.p-performance__item-spec.is-active-neighbor-bottom {
  border-bottom-color: #fff;
}
@media (hover: hover) {
  .p-performance__item-spec:has(+ .p-performance__item-spec + .p-performance__item-spec:hover) {
    border-bottom-color: #fff;
  }
}
@media (hover: hover) {
  .p-performance__item-spec:hover + .p-performance__item-spec + .p-performance__item-spec {
    border-top-color: #fff;
  }
}
.p-performance__item-spec-dot {
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #C8C8C8;
  flex-shrink: 0;
  transition: background 0.3s;
}
.p-performance__item-spec-text {
  font-weight: 700;
  font-size: 14px;
  line-height: 22px;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-performance__item-spec-text {
    font-size: 12px;
    line-height: 18px;
  }
}

.p-portfolio {
  padding: 130px 0 103px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-portfolio {
    padding: 120px 0;
  }
}
.p-portfolio__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-portfolio .c-title {
  grid-column: 2/5;
}
@media screen and (max-width: 1024px) {
  .p-portfolio .c-title {
    grid-column: 1/-1;
  }
}
.p-portfolio__text {
  margin-top: 9px;
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
  grid-column: 7/12;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__text {
    grid-column: 1/-1;
    line-height: 26px;
    font-size: 12px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 1024px) {
  .p-portfolio__text p + p {
    margin-top: 12px;
  }
}
.p-portfolio__list {
  position: relative;
  grid-column: 2/12;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 40px;
  padding: 10px 0;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__list {
    grid-column: 1/-1;
    margin-top: 40px;
  }
}
.p-portfolio__list * {
  text-box: trim-both cap alphabetic;
}
.p-portfolio__list::before, .p-portfolio__list::after {
  content: "";
  height: 100%;
  width: 0.5px;
  background: #CFCFCF;
  position: absolute;
  top: 0;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__list::before, .p-portfolio__list::after {
    opacity: 0;
  }
}
.p-portfolio__list::before {
  left: 0;
}
.p-portfolio__list::after {
  right: 0;
}
.p-portfolio__list:has(.p-portfolio__item--framed)::before, .p-portfolio__list:has(.p-portfolio__item--framed)::after {
  background: transparent;
}
.p-portfolio__item {
  position: relative;
  display: block;
  text-decoration: none;
  color: var(--color-black);
  background: #F5F4F1;
  border: 0.5px solid #CFCFCF;
  padding: 30px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item {
    padding: 15px 20px 50px;
  }
}
@media (hover: hover) {
  .p-portfolio__item:hover .c-btn-arrow__glyph {
    animation: c-button-arrow-sweep-diag 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .p-portfolio__item:hover .c-btn-arrow__glyph {
    animation: none;
  }
}
@media (hover: hover) {
  .p-portfolio__item:hover .p-portfolio__item-frame-line {
    stroke-dashoffset: 0;
  }
  .p-portfolio__item:hover .c-btn-arrow__sep {
    transform: scaleY(var(--sep-scale, 8.334));
  }
}
.p-portfolio__item::before, .p-portfolio__item::after {
  content: "";
  position: absolute;
  width: 100vw;
  height: 0.5px;
  background-color: rgba(43, 42, 46, 0.2);
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item::before, .p-portfolio__item::after {
    opacity: 0;
  }
}
.p-portfolio__item::before {
  top: 0;
}
.p-portfolio__item::after {
  bottom: 0;
}
.p-portfolio__item--framed {
  border-color: transparent;
  --trace-tone: color-mix(in srgb, var(--color-black) 50%, var(--color-gray));
}
.p-portfolio__item--framed .p-portfolio__item-top::before {
  transition: background-color 0.15s linear var(--dot-r-tl, 0s);
}
.p-portfolio__item--framed .p-portfolio__item-top::after {
  transition: background-color 0.15s linear var(--dot-r-tr, 0s);
}
.p-portfolio__item--framed .p-portfolio__item-bottom::before {
  transition: background-color 0.15s linear var(--dot-r-bl, 0s);
}
.p-portfolio__item--framed .p-portfolio__item-bottom::after {
  transition: background-color 0.15s linear var(--dot-r-br, 0s);
}
@media (hover: hover) {
  .p-portfolio__item--framed:hover .p-portfolio__item-top::before {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tl, 0s);
  }
  .p-portfolio__item--framed:hover .p-portfolio__item-top::after {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tr, 0s);
  }
  .p-portfolio__item--framed:hover .p-portfolio__item-bottom::before {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-bl, 0s);
  }
  .p-portfolio__item--framed:hover .p-portfolio__item-bottom::after {
    background: var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-br, 0s);
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-portfolio__item--framed .p-portfolio__item-top::before, .p-portfolio__item--framed .p-portfolio__item-top::after,
  .p-portfolio__item--framed .p-portfolio__item-bottom::before, .p-portfolio__item--framed .p-portfolio__item-bottom::after {
    transition: none;
  }
}
.p-portfolio__item-frame {
  position: absolute;
  top: -10px;
  left: 0;
  width: 100%;
  height: calc(100% + 20px);
  display: block;
  overflow: visible;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-frame {
    top: 0;
    height: 100%;
  }
}
.p-portfolio__item-frame path {
  stroke: var(--frame-stroke, var(--color-gray));
  stroke-width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .p-portfolio__item-frame path {
    stroke-width: 1px;
  }
}
.p-portfolio__item-frame-line {
  --frame-stroke: var(--color-black);
  stroke-opacity: 0.5;
  stroke-dasharray: var(--len, 500);
  stroke-dashoffset: var(--len, 500);
  transition: stroke-dashoffset 0.8s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .p-portfolio__item-frame-line {
    transition: none;
  }
}
.p-portfolio__item-top {
  display: flex;
  align-items: normal;
  justify-content: space-between;
}
.p-portfolio__item-top::before, .p-portfolio__item-top::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
  top: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-top::before, .p-portfolio__item-top::after {
    width: 2px;
    height: 2px;
    top: -1px;
  }
}
.p-portfolio__item-top::before {
  left: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-top::before {
    left: -1px;
  }
}
.p-portfolio__item-top::after {
  right: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-top {
    flex-direction: column;
    gap: 30px;
  }
}
.p-portfolio__item-img {
  flex-shrink: 0;
  width: 28.6971830986%;
  aspect-ratio: 326/244.5;
  overflow: hidden;
  margin-right: 30px;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-img {
    width: 100%;
    aspect-ratio: 375/244;
  }
}
.p-portfolio__item-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-portfolio__item-right {
  flex: 1;
  max-width: 685px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 30px;
  min-width: 0;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-right {
    padding-top: 0;
  }
}
.p-portfolio__item-title-area {
  display: flex;
  align-items: stretch;
}
.p-portfolio__item-title {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  margin-right: 5px;
}
.p-portfolio__item-name {
  font-size: 24px;
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-name {
    font-size: 22px;
  }
}
.p-portfolio__item-sub {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  letter-spacing: 0.04em;
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-sub {
    font-size: 12px;
    line-height: 22px;
    margin-top: 20px;
  }
}
.p-portfolio__item-location {
  flex-shrink: 0;
  width: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  background: var(--color-black);
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-location {
    position: absolute;
    top: 0;
    right: -5px;
    border-radius: 0px 0px 0 2px;
    z-index: 1;
    padding: 16px 10px;
  }
}
.p-portfolio__item-location span {
  display: block;
  font-size: 14px;
  font-weight: bold;
  line-height: 18px;
  letter-spacing: 0.04em;
  color: var(--color-white);
  text-align: center;
}
.p-portfolio__item-location span:last-child {
  font-size: 10px;
  margin-top: 9px;
}
.p-portfolio__item-desc {
  font-size: 12px;
  font-weight: bold;
  line-height: 1.833em;
  letter-spacing: 0.04em;
  color: rgba(43, 42, 46, 0.5);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-top: 30px;
  text-box: normal;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-desc {
    margin-top: 20px;
  }
}
.p-portfolio__item-info {
  background: var(--color-white);
  border-radius: 2px;
  padding: 10px 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-info {
    font-size: 10px;
    padding: 15px 10px;
    flex-direction: column;
    margin-top: 0;
    gap: 15px;
    width: 100%;
  }
}
.p-portfolio__item-info-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  flex: 1;
  border-right: solid 0.5px #D5D4D5;
  padding-right: 5px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-info-item {
    gap: 5px;
    padding-right: 0;
    border-right: none;
    flex: none;
  }
}
.p-portfolio__item-info-item:last-child {
  border-right: none;
}
.p-portfolio__item-info-item dt {
  font-size: 12px;
  font-weight: bold;
  line-height: 1.833em;
  letter-spacing: 0.04em;
  flex-shrink: 0;
  position: relative;
  padding-right: 10px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-info-item dt {
    letter-spacing: 0;
    padding-right: 5px;
    font-size: 10px;
  }
}
.p-portfolio__item-info-item dt::before, .p-portfolio__item-info-item dt::after {
  content: "";
  position: absolute;
  right: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: #2B2A2E;
}
.p-portfolio__item-info-item dt::before {
  top: calc(50% - 3px);
}
.p-portfolio__item-info-item dt::after {
  top: calc(50% + 1px);
}
.p-portfolio__item-info-item dd {
  font-size: 12px;
  font-weight: bold;
  line-height: 1.833em;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-info-item dd {
    letter-spacing: 0;
    font-size: 10px;
  }
}
.p-portfolio__item-bottom {
  display: flex;
  gap: 4px;
  margin-top: 20px;
}
.p-portfolio__item-bottom::before, .p-portfolio__item-bottom::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
  bottom: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-bottom::before, .p-portfolio__item-bottom::after {
    width: 2px;
    height: 2px;
    bottom: -1px;
  }
}
.p-portfolio__item-bottom::before {
  left: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-bottom::before {
    left: -1px;
  }
}
.p-portfolio__item-bottom::after {
  right: -2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-bottom::after {
    right: -1px;
  }
}
.p-portfolio__item-bottom-info {
  display: none;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-bottom-info {
    display: flex;
    width: 51.6923076923%;
  }
}
.p-portfolio__item-thumb {
  flex: 1 1 0;
  min-width: 0;
  aspect-ratio: 153/84;
  overflow: hidden;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__item-thumb:first-child {
    flex: none;
    aspect-ratio: unset;
    width: 47.0769230769%;
  }
  .p-portfolio__item-thumb:not(:first-child) {
    display: none;
  }
}
.p-portfolio__item-thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-portfolio__button {
  grid-column: 2/12;
  margin: 50px auto 0;
  width: 100%;
  text-align: right;
}
@media screen and (max-width: 1024px) {
  .p-portfolio__button {
    grid-column: 1/-1;
    margin-top: 55px;
  }
}

.p-portfolio__item.js-reveal::before, .p-portfolio__item.js-reveal::after {
  clip-path: inset(-2px);
  transition: clip-path 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-portfolio__item.js-reveal::after {
  transition-delay: 0.2s;
}

.p-portfolio__item.js-reveal:not(.is-inview)::before, .p-portfolio__item.js-reveal:not(.is-inview)::after {
  clip-path: inset(-2px 100% -2px -2px);
}

@media (prefers-reduced-motion: reduce) {
  .p-portfolio__item.js-reveal::before, .p-portfolio__item.js-reveal::after {
    clip-path: none;
    transition: none;
  }
}
.p-archive__main {
  padding: 38px 0 150px;
}
@media screen and (max-width: 1024px) {
  .p-archive__main {
    padding: 8px 0;
  }
}
.p-archive__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-content: start;
}
@media screen and (max-width: 1024px) {
  .p-archive__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    background-image: url(../images/common/noise_bk.webp);
    background-size: cover;
    background-position: center;
    padding-top: 90px;
  }
}
.p-archive__head {
  grid-column: 2/5;
  margin-right: -4px;
  align-self: start;
  position: sticky;
  top: 50px;
}
@media screen and (max-width: 1024px) {
  .p-archive__head {
    position: static;
    grid-column: 1/-1;
  }
}
.p-archive__body {
  grid-column: 5/13;
  display: grid;
  grid-template-columns: subgrid;
  background-image: url(../images/common/noise_bk.webp);
  background-size: cover;
  background-position: center;
  margin-right: -78px;
  padding: 150px 0;
}
@media screen and (max-width: 1024px) {
  .p-archive__body {
    grid-column: 1/-1;
    margin-right: 0;
    background: none;
    padding: 0;
    margin-top: 13px;
  }
}
.p-archive__nav {
  margin-top: -9px;
}
@media screen and (max-width: 1024px) {
  .p-archive__nav {
    display: none;
  }
}
.p-archive__nav-list {
  position: relative;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.p-archive__nav-item::before {
  content: "";
  display: block;
  margin-right: 20px;
  height: 2.5px;
  background: linear-gradient(to bottom, #2B2B2D 0px, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px, #2B2B2D 2.5px);
}
@media (max-resolution: 1.5dppx) {
  .p-archive__nav-item::before {
    height: 3px;
    background: linear-gradient(to bottom, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.p-archive__nav-item.is-active::before, .p-archive__nav-item.is-active + .p-archive__nav-item::before, .p-archive__nav-item.is-active:last-child::after {
  margin-right: 0;
}
.p-archive__nav-item:last-child::after {
  content: "";
  display: block;
  margin-right: 20px;
  height: 2.5px;
  background: linear-gradient(to bottom, #2B2B2D 0px, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px, #2B2B2D 2.5px);
}
@media (max-resolution: 1.5dppx) {
  .p-archive__nav-item:last-child::after {
    height: 3px;
    background: linear-gradient(to bottom, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.p-archive__nav-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 5px 20px 5px 0;
  text-decoration: none;
  position: relative;
}
@media (hover: hover) {
  .p-archive__nav-btn:hover .p-archive__nav-dot {
    background: var(--color-black);
  }
}
.p-archive__nav-btn::before, .p-archive__nav-btn::after {
  content: "";
  position: absolute;
  right: 0;
  width: 2.5px;
  height: 22.5px;
  transform: scaleY(0);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-archive__nav-btn::before {
  top: -22.5px;
  transform-origin: bottom;
  background: linear-gradient(to bottom, transparent calc(100% - 2.5px), #2B2B2D calc(100% - 2.5px)), linear-gradient(to right, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px);
}
@media (max-resolution: 1.5dppx) {
  .p-archive__nav-btn::before {
    width: 3px;
    background: linear-gradient(to bottom, transparent calc(100% - 3px), #999999 calc(100% - 3px)), linear-gradient(to right, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.p-archive__nav-btn::after {
  bottom: -22.5px;
  transform-origin: top;
  background: linear-gradient(to bottom, #2B2B2D 2.5px, transparent 2.5px), linear-gradient(to right, #2B2B2D 0.5px, transparent 0.5px, transparent 2px, #2B2B2D 2px);
}
@media (max-resolution: 1.5dppx) {
  .p-archive__nav-btn::after {
    width: 3px;
    background: linear-gradient(to bottom, #999999 3px, transparent 3px), linear-gradient(to right, #999999 0px, #999999 1px, transparent 1px, transparent 2px, #999999 2px, #999999 3px);
  }
}
.p-archive__nav-item.is-active .p-archive__nav-btn::before, .p-archive__nav-item.is-active .p-archive__nav-btn::after {
  transform: scaleY(1);
  transition-delay: 0.08s;
}
.p-archive__nav-dot {
  display: inline-block;
  vertical-align: middle;
  width: 4px;
  height: 4px;
  margin-right: 11px;
  border-radius: 50%;
  background: #C8C8C8;
  transition: background 0.3s;
  position: relative;
  top: 0.3px;
}
@media (prefers-reduced-motion: reduce) {
  .p-archive__nav-btn::before, .p-archive__nav-btn::after, .p-archive__nav-dot {
    transition: none;
  }
}
.p-archive__nav-text {
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  color: #2B2A2E;
  text-box: trim-both cap alphabetic;
  position: relative;
  top: -0.5px;
  padding-left: 19px;
  padding-right: 5px;
  text-indent: -19px;
  letter-spacing: 0.04em;
}
.p-archive__nav-text .c-tag {
  vertical-align: middle;
  margin-right: 10px;
  margin-top: -7.1px;
  margin-bottom: -5.9px;
}
.p-archive__nav-item.is-active .p-archive__nav-dot {
  background: #2B2B2D;
}
.p-archive__nav-thumbnail {
  width: 66px;
  height: 50px;
  flex-shrink: 0;
  border-radius: 2px;
  overflow: hidden;
}
.p-archive__nav-thumbnail img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-archive__list {
  grid-column: 2/8;
  grid-template-columns: subgrid;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (max-width: 1024px) {
  .p-archive__list {
    grid-column: 1/-1;
    gap: 30px;
  }
}
.p-archive__item {
  width: 100%;
  padding: 0 10px;
  position: relative;
  scroll-margin-top: 104px;
}
@media screen and (max-width: 1024px) {
  .p-archive__item {
    padding: 0;
    scroll-margin-top: 60px;
  }
}
.p-archive__item::before, .p-archive__item::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.5px;
  background: rgba(43, 43, 45, 0.2);
}
.p-archive__item::before {
  top: 0;
}
.p-archive__item::after {
  bottom: 0;
}
.p-archive__item .c-card {
  width: auto;
  height: 100%;
}

.p-post__main * {
  text-box: trim-both cap alphabetic;
}
.p-post__main {
  padding: 80px 0 150px;
}
@media screen and (max-width: 1024px) {
  .p-post__main {
    padding: 60px 0 120px;
  }
}
.p-post__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-post__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-post__main {
  background-image: url(../images/common/noise_bk.webp);
  background-size: cover;
  background-position: center;
  overflow: hidden;
  margin-top: 38px;
}
.p-post__list {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  row-gap: 200px;
}
@media screen and (max-width: 1024px) {
  .p-post__list {
    row-gap: 100px;
  }
}
.p-post__item {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: start;
}
@media screen and (max-width: 1024px) {
  .p-post__item {
    -moz-column-gap: 35px;
         column-gap: 35px;
    row-gap: 40px;
  }
  .p-post__item:nth-child(even) .p-post__item-title {
    grid-column: 5/6;
    align-items: flex-end;
    margin-left: 0;
    margin-right: 8px;
  }
  .p-post__item:nth-child(even) .p-post__item-title dt {
    margin-right: -7px;
  }
  .p-post__item:nth-child(even) .p-post__item-text {
    grid-column: 1/5;
    margin-left: 0;
    margin-right: -22px;
  }
}
@media screen and (min-width: 1024px) {
  .p-post__item:nth-child(2) .p-post__item-title {
    grid-column: 2/3;
  }
  .p-post__item:nth-child(2) .p-post__item-text {
    grid-column: 4/7;
  }
  .p-post__item:nth-child(2) .p-post__item-image {
    grid-column: 8/12;
  }
  .p-post__item:nth-child(3) .p-post__item-image {
    grid-column: 2/6;
  }
  .p-post__item:nth-child(3) .p-post__item-text {
    grid-column: 7/10;
  }
  .p-post__item:nth-child(3) .p-post__item-title {
    grid-column: 11/12;
  }
  .p-post__item:nth-child(4) .p-post__item-text {
    grid-column: 2/5;
  }
  .p-post__item:nth-child(4) .p-post__item-title {
    grid-column: 6/7;
  }
  .p-post__item:nth-child(4) .p-post__item-image {
    grid-column: 8/12;
  }
  .p-post__item:nth-child(5) .p-post__item-title {
    grid-column: 2/3;
  }
  .p-post__item:nth-child(5) .p-post__item-image {
    grid-column: 4/8;
  }
  .p-post__item:nth-child(5) .p-post__item-text {
    grid-column: 9/12;
  }
}
.p-post__item-title {
  grid-column: 7/8;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .p-post__item-title {
    grid-column: 1/2;
    grid-row: 2;
    align-items: flex-start;
    margin-left: 8px;
  }
}
.p-post__item-title dt {
  font-family: var(--font-en);
  font-weight: bold;
  font-size: 14px;
  letter-spacing: 0.84px;
  margin-bottom: 15px;
  margin-left: 5px;
}
@media screen and (max-width: 1024px) {
  .p-post__item-title dt {
    margin-left: 0;
  }
}
.p-post__item-title dd {
  font-size: 22px;
  letter-spacing: 5.5px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
}
.p-post__item-image {
  grid-column: 2/6;
  grid-row: 1;
  border-radius: 2px;
  overflow: hidden;
  aspect-ratio: 1/1;
}
.p-post__item-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .p-post__item-image {
    grid-column: 1/-1;
    grid-row: 1;
  }
}
.p-post__item-image--multiple {
  display: flex;
  flex-direction: column;
  gap: 20px;
  aspect-ratio: auto;
}
@media screen and (max-width: 1024px) {
  .p-post__item-image--multiple {
    gap: 8px;
  }
}
.p-post__item-image--multiple .p-post__item-frame {
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
}
.p-post__item-image--multiple .p-post__item-frame img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-post__item-frame {
  display: contents;
}
.p-post__item-text {
  grid-column: 9/12;
  grid-row: 1;
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
}
@media screen and (max-width: 1024px) {
  .p-post__item-text {
    grid-column: 2/6;
    grid-row: 2;
    font-size: 12px;
    line-height: 26px;
    margin-left: -22px;
  }
}
.p-post__item-text p + p {
  margin-top: 40px;
}
@media screen and (max-width: 1024px) {
  .p-post__item-text p + p {
    margin-top: 30px;
  }
}

.p-company .c-under-kv {
  margin-bottom: 38px;
}
@media screen and (max-width: 1024px) {
  .p-company .c-under-kv {
    margin-bottom: 60px;
  }
}
.p-company__main {
  padding: 120px 0;
}
@media screen and (max-width: 1024px) {
  .p-company__main {
    padding: 80px 0;
  }
}
.p-company__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-company__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-company__table {
  grid-column: 3/11;
  margin-top: 60px;
  border-top: 0.5px solid var(--color-gray);
}
@media screen and (max-width: 1024px) {
  .p-company__table {
    grid-column: 1/-1;
    margin-top: 40px;
  }
}
.p-company__row {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 40px;
  padding: 30px 0;
  border-bottom: 0.5px solid var(--color-gray);
}
@media screen and (max-width: 1024px) {
  .p-company__row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 20px 0;
  }
}
.p-company__row-label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
.p-company__row-text {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.04em;
  color: var(--color-black);
}

.p-history {
  position: relative;
  overflow: hidden;
  background: #2b2a2e;
  color: #fff;
}
.p-history__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.p-history__bg::before, .p-history__bg::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
}
.p-history__bg::before {
  top: 0;
  height: 42%;
  background: linear-gradient(to bottom, #2b2a2e 18%, rgba(43, 42, 46, 0));
}
@media screen and (max-width: 1024px) {
  .p-history__bg::before {
    height: 52%;
    background: linear-gradient(to bottom, #2b2a2e 30%, rgba(43, 42, 46, 0));
  }
}
.p-history__bg::after {
  bottom: 0;
  height: 23%;
  background: linear-gradient(to top, #2b2a2e 12%, rgba(43, 42, 46, 0));
}
.p-history__bg-track {
  position: absolute;
  top: 0;
  left: 34.875%;
  width: min(45.25vw, 724px);
  opacity: 0.6;
  animation: p-history-bg-flow 90s linear infinite;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .p-history__bg-track {
    animation: none;
  }
}
@media screen and (max-width: 1024px) {
  .p-history__bg-track {
    left: 14px;
    right: 14px;
    width: auto;
  }
}
.p-history__bg-track img {
  border-radius: 2px;
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 100px;
}
@media screen and (max-width: 1024px) {
  .p-history__bg-track img {
    margin-bottom: 40px;
  }
}
.p-history__intro {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  align-content: start;
  padding-top: 150px;
}
@media screen and (max-width: 1024px) {
  .p-history__intro {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    padding-top: 90px;
  }
}
.p-history__head {
  grid-column: 2/6;
}
@media screen and (max-width: 1024px) {
  .p-history__head {
    grid-column: 1/-1;
  }
}
.p-history__copy {
  margin-top: 39px;
}
@media screen and (max-width: 1024px) {
  .p-history__copy {
    margin-top: 22px;
  }
}
.p-history__lead {
  grid-column: 7/12;
}
@media screen and (max-width: 1024px) {
  .p-history__lead {
    grid-column: 1/-1;
    margin-top: 18px;
  }
}
.p-history__lead p {
  font-weight: 700;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1024px) {
  .p-history__lead p {
    font-size: 12px;
    line-height: 26px;
  }
}
.p-history__lead p + p {
  margin-top: 40px;
}
@media screen and (max-width: 1024px) {
  .p-history__lead p + p {
    margin-top: 30px;
  }
}
.p-history__stage {
  position: relative;
  z-index: 1;
  height: 858px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-history__stage {
    height: 734px;
  }
}
.p-history__focus {
  position: absolute;
  top: 165px;
  left: 11.6875%;
  right: 0;
  height: 320px;
  background: rgba(0, 0, 0, 0.2);
  cursor: ns-resize;
  border-radius: 2px 0 0 2px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-history__focus {
    top: 150px;
    left: 0;
    height: 191px;
  }
}
.p-history__list {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 0 5.125%;
  will-change: transform;
}
@media screen and (max-width: 1024px) {
  .p-history__list {
    padding: 0 24px;
  }
}
.p-history__list * {
  text-box: trim-both cap alphabetic;
}
.p-history__item {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  opacity: 0.4;
  filter: blur(4px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), filter 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-history__item.is-active {
  opacity: 1;
  filter: blur(0);
}
.p-history__item.is-passed {
  opacity: 0;
}
.p-history__item + .p-history__item {
  margin-top: 201px;
}
@media screen and (max-width: 1024px) {
  .p-history__item {
    display: flex;
    flex-direction: column;
    padding-right: 72px;
  }
  .p-history__item + .p-history__item {
    margin-top: 110px;
  }
}
.p-history__item-date {
  grid-column: 2/4;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 115px;
}
@media screen and (max-width: 1024px) {
  .p-history__item-date {
    align-self: flex-start;
    width: auto;
    justify-content: flex-start;
    gap: 15px;
    margin-bottom: 28px;
  }
}
.p-history__item-num {
  display: flex;
  align-items: baseline;
  flex: none;
  gap: 5px;
  white-space: nowrap;
  font-family: "Abyssinica SIL", var(--font-en), serif;
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .p-history__item-num {
    font-size: 20px;
  }
}
.p-history__item-num small {
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1024px) {
  .p-history__item-num small {
    font-size: 10px;
  }
}
.p-history__item-body {
  grid-column: 4/8;
}
@media screen and (max-width: 1024px) {
  .p-history__item-body {
    grid-column: auto;
  }
}
.p-history__item-title {
  font-weight: 700;
  font-size: 18px;
  line-height: 30px;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1024px) {
  .p-history__item-title {
    font-size: 16px;
    line-height: 38px;
    letter-spacing: 0.04em;
  }
}
.p-history__item-text {
  margin-top: 30px;
  font-weight: 700;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1024px) {
  .p-history__item-text {
    margin-top: 25px;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-history__nav {
  position: absolute;
  top: 325px;
  right: min(5.125vw, 82px);
  transform: translateY(-50%);
}
@media screen and (max-width: 1024px) {
  .p-history__nav {
    top: 246px;
    right: 14px;
  }
}
.p-history__nav-line {
  position: absolute;
  left: 0;
  top: -20px;
  bottom: -20px;
  width: 1px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3) 18%, rgba(255, 255, 255, 0.3) 82%, rgba(255, 255, 255, 0));
}
.p-history__nav-dot {
  position: absolute;
  left: -1.5px;
  top: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
@media screen and (max-width: 1024px) {
  .p-history__nav-dot {
    left: -0.5px;
    width: 2px;
    height: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-history__nav-dot {
    transition: none;
  }
}
.p-history__nav-list {
  display: flex;
  flex-direction: column;
  gap: 30px;
  margin-left: 30px;
}
@media screen and (max-width: 1024px) {
  .p-history__nav-list {
    gap: 25px;
    margin-left: 27px;
  }
}
.p-history__nav-item {
  font-family: "Abyssinica SIL", var(--font-en), serif;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: color 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  text-box: trim-both cap alphabetic;
}
.p-history__nav-item.is-active {
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .p-history__nav-item {
    font-size: 12px;
    line-height: 24px;
    padding-right: 6px;
  }
}

@keyframes p-history-bg-flow {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-50%);
  }
}
.p-member {
  background-image: url(../images/common/noise_bk.webp);
  background-size: cover;
  background-position: center;
  padding: 130px 0 150px;
}
@media screen and (max-width: 1024px) {
  .p-member {
    padding: 120px 0;
  }
}
.p-member__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-member__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-member__head {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
}
.p-member .c-sec-head {
  grid-column: 2/6;
  margin-top: 11px;
}
@media screen and (max-width: 1024px) {
  .p-member .c-sec-head {
    grid-column: 1/6;
  }
}
@media screen and (max-width: 1300px) {
  .p-member .c-sec-head .pc {
    display: none !important;
  }
}
@media screen and (min-width: 1300px) {
  .p-member .c-sec-head .vpc {
    display: none !important;
  }
}
.p-member__text {
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  grid-column: 7/12;
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-member__text {
    grid-column: 1/6;
    margin-top: 14px;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-member__list {
  grid-column: 2/12;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  margin-top: 65px;
}
.p-member__list * {
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1300px) {
  .p-member__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 1024px) {
  .p-member__list {
    grid-column: 1/-1;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 80px;
  }
}
.p-member__item {
  display: flex;
  flex-direction: column;
  gap: 30px;
  padding-bottom: 30px;
  background: var(--color-white);
  border-radius: 2px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-member__item {
    gap: 20px;
    padding-bottom: 20px;
  }
}
.p-member__item-head {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  padding-right: 20px;
  background: #F5F4F1;
  border-radius: 2px 2px 0 0;
}
@media screen and (max-width: 1024px) {
  .p-member__item-head {
    gap: 15px;
    padding-right: 15px;
  }
}
.p-member__item-photo {
  flex-shrink: 0;
  width: 140px;
  aspect-ratio: 1/1;
  overflow: hidden;
}
.p-member__item-photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-member__item-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 20px;
  min-width: 0;
}
.p-member__item-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.p-member__item-name {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.78;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-member__item-name {
    font-size: 16px;
  }
}
.p-member__item-years {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 2.67;
  letter-spacing: 0.04em;
  color: var(--color-black);
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .p-member__item-years {
    font-size: 10px;
  }
}
.p-member__item-years span {
  font-size: 18px;
  line-height: 32px;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 1024px) {
  .p-member__item-years span {
    font-size: 16px;
  }
}
.p-member__item-role {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.83;
  letter-spacing: 0.11em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-member__item-role {
    font-size: 10px;
  }
}
.p-member__item-copy {
  padding: 0 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.78;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-member__item-copy {
    padding: 0 15px;
    font-size: 16px;
  }
}

.p-overview {
  background: #2B2A2E;
  padding: 120px 0 130px;
}
@media screen and (max-width: 1024px) {
  .p-overview {
    padding: 120px 0 93px;
  }
}
.p-overview__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-overview__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-overview__head {
  grid-column: 1/6;
  display: grid;
  grid-template-columns: subgrid;
  align-content: start;
}
@media screen and (max-width: 1024px) {
  .p-overview__head {
    grid-column: 1/-1;
  }
}
.p-overview__head .c-title {
  grid-column: 2/-1;
  grid-row: 1;
  align-self: flex-start;
}
@media screen and (max-width: 1024px) {
  .p-overview__head .c-title {
    grid-column: 1/-1;
  }
}
.p-overview__image {
  position: relative;
  grid-column: 1/-1;
  align-self: start;
  margin-left: -78px;
  width: calc(100% + 78px);
  margin-top: 111px;
  height: 976px;
  display: block;
  border-radius: 0 2px 2px 0;
  overflow: hidden;
  background: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-overview__image {
    margin-left: -15px;
    width: calc(100% + 15px);
    height: auto;
    aspect-ratio: 758/1046;
    margin-top: 40px;
    grid-column: 1/-1;
  }
}
.p-overview__image::before {
  opacity: 0;
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--color-black);
  background-image: url("../images/index/noise.svg");
  background-size: cover;
  opacity: 0.2;
}
@media screen and (max-width: 1024px) {
  .p-overview__image::before {
    opacity: 0;
  }
}
.p-overview__image::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(43, 42, 46, 0.2) 0%, rgba(43, 42, 46, 0.7) 20%, #2B2A2E 80%);
  opacity: 0;
}
.p-overview__image.js-reveal::after {
  opacity: 1;
}
.p-overview__image.js-reveal.is-inview::after {
  opacity: 0;
  transition: opacity 1s ease-out;
}
.p-overview__image picture {
  display: block;
  width: 100%;
  height: 100%;
}
.p-overview__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-overview__body {
  grid-column: 7/12;
  display: grid;
  grid-template-columns: subgrid;
}
@media screen and (max-width: 1024px) {
  .p-overview__body {
    grid-column: 1/6;
    margin-top: 102px;
  }
}
.p-overview__table {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  margin-top: 16px;
  border-radius: 2px;
  overflow: hidden;
}
.p-overview__table * {
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-overview__table {
    margin-top: 0;
  }
}
.p-overview__row {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  gap: 4px;
}
.p-overview__row + .p-overview__row {
  margin-top: 4px;
}
.p-overview__row-label {
  padding: 30px 20px 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  color: var(--color-white);
  border-left: 0.5px solid rgba(255, 255, 255, 0.2);
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.2);
  grid-column: 1/3;
}
@media screen and (max-width: 1024px) {
  .p-overview__row-label {
    padding: 30px 20px 0;
    font-size: 12px;
    grid-column: 1/3;
  }
}
.p-overview__row-text {
  padding: 30px 20px;
  background: var(--color-white);
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  color: var(--color-black);
  grid-column: 3/-1;
}
@media screen and (max-width: 1024px) {
  .p-overview__row-text {
    padding: 30px 15px;
    font-size: 12px;
    grid-column: 3/6;
  }
}

@keyframes p-access-gallery-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
.p-access {
  background: #2B2A2E;
}
.p-access__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-access__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-access__head {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1/-1;
}
.p-access__head .c-title {
  grid-column: 2/5;
}
@media screen and (max-width: 1024px) {
  .p-access__head .c-title {
    grid-column: 1/-1;
  }
}
.p-access__text {
  margin-top: 7px;
  grid-column: 7/-1;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-access__text {
    grid-column: 1/-1;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-access__gallery {
  grid-column: 1/-1;
  overflow: hidden;
  margin-top: 50px;
  position: relative;
}
.p-access__gallery::before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 55%;
  background: #FAFAF8;
}
@media screen and (max-width: 1024px) {
  .p-access__gallery::before {
    height: 75%;
  }
}
.p-access__gallery-track {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  width: -moz-max-content;
  width: max-content;
  animation: p-access-gallery-scroll 40s linear infinite;
  will-change: transform;
}
@media screen and (max-width: 1024px) {
  .p-access__gallery-track {
    gap: 4px;
    animation-duration: 35s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-access__gallery-track {
    animation: none;
  }
}
.p-access__gallery-item {
  flex-shrink: 0;
  width: 405px;
  aspect-ratio: 405/270;
  border-radius: 2px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-access__gallery-item {
    width: 365px;
    aspect-ratio: 365/243;
  }
}
.p-access__gallery-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-access__map {
  grid-column: 1/-1;
  margin-top: 61px;
  position: relative;
}
.p-access__map * {
  text-box: trim-both cap alphabetic;
}
.p-access__map iframe {
  display: block;
  width: 100%;
  height: 390px;
  filter: grayscale(100%);
  border-radius: 2px;
  overflow: hidden;
}
.p-access__detail {
  position: absolute;
  left: 120px;
  bottom: -30px;
  display: flex;
  width: 476px;
  background: #2B2A2E;
  border-radius: 2px 2px 0 0;
  padding: 30px 0 0;
}
@media screen and (max-width: 1024px) {
  .p-access__detail {
    padding: 25px 0 0;
    width: 96%;
    left: -15px;
    bottom: 0;
  }
}
.p-access__detail-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 30px 0;
}
@media screen and (max-width: 1024px) {
  .p-access__detail-item {
    padding: 0 5px 0 25px;
    gap: 15px;
  }
}
.p-access__detail-item + .p-access__detail-item {
  border-left: 0.5px solid rgba(255, 255, 255, 0.2);
}
.p-access__detail-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-access__detail-title {
    font-size: 12px;
  }
}
.p-access__detail-dot {
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
}
.p-access__detail-inner {
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-access__detail-inner {
    font-size: 12px;
    letter-spacing: 0;
  }
}
.p-access__buttons {
  grid-column: 2/12;
  display: flex;
  flex-wrap: wrap;
  margin-top: 70px;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .p-access__buttons {
    flex-direction: column;
    grid-column: 1/-1;
    margin-top: 28px;
  }
}
.p-access__buttons-item {
  width: 50%;
  max-width: 100%;
}
@media screen and (max-width: 1024px) {
  .p-access__buttons-item {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .p-access__buttons-item.c-button--framed .c-button__frame-line {
    transition: none !important;
    stroke-dashoffset: 0 !important;
  }
  .p-access__buttons-item.c-button--framed .c-button__arrow-area svg {
    animation: none !important;
  }
  .p-access__buttons-item.c-button--framed .c-button__arrow-area::before {
    transition: none !important;
    background-size: 100% 16px, 100% 100% !important;
  }
}
@media screen and (max-width: 1024px) {
  .p-access__buttons-item:last-child {
    margin-top: -12px;
  }
}
.p-access__buttons-item:last-child::before {
  border-left: none;
}
.p-access__buttons-item:last-child::after {
  background: transparent;
  box-shadow: none;
}
@media screen and (max-width: 1024px) {
  .p-access__buttons-item:last-child::before {
    border-left: 1px solid var(--color-white);
    border-top: none;
  }
  .p-access__buttons-item:last-child::after {
    background: var(--color-white);
    box-shadow: 0 59px 0 var(--color-white);
  }
}

.p-recruit__kv {
  position: relative;
  z-index: 0;
}
.p-recruit > .container {
  position: relative;
  z-index: 1;
}
.p-recruit__kv-row {
  display: flex;
}
@media screen and (max-width: 1024px) {
  .p-recruit__kv-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    align-items: start;
    padding: 0 15px;
    margin-top: 20px;
  }
}
.p-recruit__kv-heading {
  display: none;
}
@media screen and (max-width: 1024px) {
  .p-recruit__kv-heading {
    display: flex;
    flex-direction: column;
    grid-column: 1/2;
    margin-right: -9px;
    margin-top: 112px;
  }
}
.p-recruit__kv-label {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.11em;
  color: var(--color-black);
  opacity: 0;
  filter: blur(3px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s, filter 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}
.p-recruit__kv-label.is-inview {
  opacity: 1;
  filter: blur(0px);
}
@media (scripting: none) {
  .p-recruit__kv-label {
    opacity: 1;
    filter: none;
    transition: none;
  }
}
.p-recruit__kv-lead {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 109px;
}
.p-recruit__kv-lead dt,
.p-recruit__kv-lead dd {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
  letter-spacing: 0.23em;
  color: var(--color-black);
  opacity: 0;
  filter: blur(3px);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s, filter 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s;
}
.p-recruit__kv-lead dt {
  transition-delay: 0.5s;
}
.p-recruit__kv-lead.is-inview dt,
.p-recruit__kv-lead.is-inview dd {
  opacity: 1;
  filter: blur(0px);
}
@media (scripting: none) {
  .p-recruit__kv-lead dt,
  .p-recruit__kv-lead dd {
    opacity: 1;
    filter: none;
    transition: none;
  }
}
.p-recruit__kv-stack {
  display: flex;
  flex: 1;
  gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-recruit__kv-stack {
    grid-column: 3/6;
    flex-direction: column;
    margin-right: -15px;
  }
}
.p-recruit__kv-item {
  flex: 1;
  aspect-ratio: 397/438;
  max-height: 439px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-recruit__kv-item {
    aspect-ratio: 4/3;
    max-height: none;
  }
}
.p-recruit__kv-item video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-recruit__about {
  padding: 59px 0 0;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about {
    padding: 16px 0 120px;
  }
}
.p-recruit__about * {
  text-box: trim-both cap alphabetic;
}
.p-recruit__about-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-recruit__about-label {
  grid-column: 2/3;
  justify-self: start;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.11em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-label {
    display: none;
  }
}
.p-recruit__about-body {
  grid-column: 3/12;
  display: grid;
  grid-template-columns: subgrid;
  align-items: start;
  background: var(--color-white);
  margin-top: -120px;
  padding: 121px 0 0;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-body {
    grid-column: 1/-1;
    display: block;
    background: none;
    margin-top: 0;
    padding: 0;
  }
}
.p-recruit__about-lead {
  grid-column: 1/3;
  display: flex;
  justify-content: flex-end;
  gap: 26px;
  color: var(--color-black);
}
.p-recruit__about-lead dt,
.p-recruit__about-lead dd {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 22px;
  letter-spacing: 0.35em;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-lead {
    display: none;
  }
}
.p-recruit__about-title-main {
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
}
.p-recruit__about-text {
  padding-top: 2px;
  grid-column: 4/-1;
  position: relative;
  height: 790px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-text {
    grid-column: auto;
    height: auto;
    overflow: visible;
  }
}
.p-recruit__about-text-inner {
  height: 100%;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding-bottom: 220px;
  padding-top: 2px;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-text-inner {
    padding-top: 0;
    overflow: visible;
    gap: 30px;
    padding-bottom: 0;
  }
}
.p-recruit__about-text p {
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-text p {
    font-size: 12px;
    line-height: 26px;
  }
}
.p-recruit__about-text {
  background: var(--color-white);
}
.p-recruit__about-text::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.7) 20%, #fff 80%);
  opacity: 0;
}
.p-recruit__about-text.js-reveal::before {
  opacity: 1;
}
.p-recruit__about-text.js-reveal.is-inview::before {
  opacity: 0;
  transition: opacity 1s ease-out;
}
.p-recruit__about-text::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 30%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--color-white) 54%);
  pointer-events: none;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .p-recruit__about-text::after {
    display: none;
  }
}

@keyframes p-values-blob-wobble-1 {
  0% {
    transform: rotate(0deg) scale(1, 1);
  }
  25% {
    transform: rotate(90deg) scale(1.06, 0.94);
  }
  50% {
    transform: rotate(180deg) scale(1, 1);
  }
  75% {
    transform: rotate(270deg) scale(0.94, 1.06);
  }
  100% {
    transform: rotate(360deg) scale(1, 1);
  }
}
@keyframes p-values-blob-wobble-2 {
  0% {
    transform: rotate(0deg) scale(1, 1);
  }
  25% {
    transform: rotate(-90deg) scale(0.94, 1.06);
  }
  50% {
    transform: rotate(-180deg) scale(1, 1);
  }
  75% {
    transform: rotate(-270deg) scale(1.06, 0.94);
  }
  100% {
    transform: rotate(-360deg) scale(1, 1);
  }
}
.p-values {
  background: #2B2A2E;
  padding: 120px 0;
  overflow: clip;
}
@media screen and (max-width: 1024px) {
  .p-values {
    padding: 109px 0 115px;
  }
}
.p-values__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-values__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-values__head {
  grid-column: 2/6;
}
@media screen and (max-width: 1024px) {
  .p-values__head {
    grid-column: 1/-1;
  }
}
@media screen and (max-width: 1024px) {
  .p-values__head .c-lead {
    font-feature-settings: "palt";
  }
}
.p-values__lead-text {
  grid-column: 7/12;
  margin-top: 9px;
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: var(--color-white);
}
@media screen and (max-width: 1024px) {
  .p-values__lead-text {
    grid-column: 1/-1;
    margin-top: -15px;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-values__groups {
  grid-column: 2/12;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 80px;
  margin: 150px -20px 0;
}
@media screen and (max-width: 1024px) {
  .p-values__groups {
    grid-column: 1/-1;
    display: flex;
    flex-direction: column;
    gap: 85px;
    margin: 65px 0 0;
  }
}
.p-values__group {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: start;
  -moz-column-gap: 80px;
       column-gap: 80px;
  row-gap: 128px;
  max-width: 550px;
  width: 95%;
}
.p-values__group:last-child {
  justify-self: end;
}
@media screen and (max-width: 1024px) {
  .p-values__group:last-child .p-values__group-label {
    top: 47%;
  }
}
@media screen and (max-width: 1024px) {
  .p-values__group {
    -moz-column-gap: 25px;
         column-gap: 25px;
    row-gap: 145px;
    max-width: none;
    width: 100%;
  }
  .p-values__group:last-child {
    justify-self: stretch;
  }
}
.p-values__group-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 423px;
  pointer-events: none;
}
.p-values__group-bg svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.p-values__group-bg path {
  transform-box: fill-box;
  transform-origin: center;
}
.p-values__group-bg path:nth-of-type(1) {
  animation: p-values-blob-wobble-1 24s ease-in-out infinite;
}
.p-values__group-bg path:nth-of-type(2) {
  animation: p-values-blob-wobble-2 19s ease-in-out infinite;
}
@media screen and (max-width: 1024px) {
  .p-values__group-bg {
    width: 360px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-values__group-bg path {
    animation: none;
  }
}
.p-values__cards {
  display: contents;
  margin: 0;
  padding: 0;
  list-style: none;
}
.p-values__card {
  position: relative;
}
.p-values__card-title {
  display: inline-block;
  background: var(--color-white);
  color: var(--color-black);
  border-radius: 2px;
  padding: 10px;
  font-size: 16px;
  font-weight: 700;
  line-height: 26px;
  letter-spacing: 0.11em;
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-values__card-title {
    padding: 8px;
    font-size: 12px;
    line-height: 20px;
    width: 100%;
  }
}
.p-values__card-text {
  margin-top: 15px;
  font-size: 12px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.11em;
  color: var(--color-white);
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-values__card-text {
    font-size: 10px;
    line-height: 20px;
  }
}
.p-values__group-label {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .p-values__group-label {
    top: 48%;
  }
}
.p-values__group-label p {
  color: var(--color-white);
  font-weight: 700;
}
.p-values__group-label-en {
  font-size: 14px;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1024px) {
  .p-values__group-label-en {
    font-size: 12px;
    line-height: 22px;
  }
}
.p-values__group-label-jp {
  font-size: 32px;
  letter-spacing: 0.02em;
  margin-top: -2px;
}
@media screen and (max-width: 1024px) {
  .p-values__group-label-jp {
    font-size: 24px;
    line-height: 42px;
  }
}
.p-values__cta {
  grid-column: 1/12;
  display: flex;
  justify-content: flex-end;
  margin-top: 100px;
}
@media screen and (max-width: 1024px) {
  .p-values__cta {
    grid-column: 1/-1;
    display: block;
    margin-top: 65px;
  }
}

.p-interview {
  background-image: url(../images/common/noise_bk.webp);
  background-size: cover;
  background-position: center;
  padding: 150px 0;
}
@media screen and (max-width: 1024px) {
  .p-interview {
    padding: 109px 0 120px;
  }
}
.p-interview__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-interview__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-interview__head {
  grid-column: 2/12;
  display: grid;
  grid-template-columns: subgrid;
}
.p-interview__head .c-title {
  grid-column: 1/6;
  margin-left: 21px;
}
@media screen and (max-width: 1024px) {
  .p-interview__head .c-title {
    margin-left: 0;
  }
}
@media screen and (max-width: 1024px) {
  .p-interview__head {
    grid-column: 1/-1;
    display: block;
  }
}
.p-interview__lead-text {
  grid-column: 7/12;
  margin-top: 9px;
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0.11em;
  color: var(--color-black);
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-interview__lead-text {
    grid-column: 1/-1;
    margin-top: 30px;
    font-size: 12px;
    line-height: 26px;
  }
}
.p-interview__list {
  grid-column: 2/12;
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 37px;
}
.p-interview__list * {
  text-box: trim-both cap alphabetic;
}
@media screen and (max-width: 1024px) {
  .p-interview__list {
    grid-column: 1/-1;
    gap: 20px;
    margin-top: 60px;
  }
}
.p-interview__item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 50px;
  padding: 60px;
  background: var(--color-white);
  border-top: 0.5px solid #B1B1B1;
  border-bottom: 0.5px solid #B1B1B1;
  border-radius: 2px;
}
.p-interview__item:nth-child(even) .p-interview__item-image {
  order: 3;
}
.p-interview__item:nth-child(even) .p-interview__item-body {
  order: 1;
}
@media screen and (max-width: 1024px) {
  .p-interview__item {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas: "image image" "catch body";
    gap: 30px;
    padding: 30px 10px;
  }
  .p-interview__item:nth-child(even) {
    grid-template-areas: "image image" "body catch";
  }
  .p-interview__item:nth-child(even) .p-interview__item-image {
    order: initial;
  }
  .p-interview__item:nth-child(even) .p-interview__item-body {
    order: initial;
  }
}
.p-interview__item-image {
  order: 1;
  flex: 0 1 440px;
  min-width: 0;
  aspect-ratio: 440/334;
  overflow: hidden;
  border-radius: 2px;
}
@media screen and (max-width: 1024px) {
  .p-interview__item-image {
    grid-area: image;
    width: 100%;
    aspect-ratio: 344/232;
  }
}
.p-interview__item-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-interview__item-catch {
  order: 2;
  flex-shrink: 0;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: 17px;
}
@media screen and (max-width: 1024px) {
  .p-interview__item-catch {
    grid-area: catch;
    padding-bottom: 20px;
    gap: 13px;
    flex-direction: row;
  }
}
.p-interview__item-catch p, .p-interview__item-catch-line {
  white-space: nowrap;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 26px;
  font-weight: 700;
  line-height: 41px;
  letter-spacing: 0.11em;
  color: var(--color-black);
  font-feature-settings: "palt";
}
@media screen and (max-width: 1024px) {
  .p-interview__item-catch p, .p-interview__item-catch-line {
    font-size: 22px;
    line-height: 34px;
    letter-spacing: 0.35em;
  }
}
.p-interview__item-body {
  order: 3;
  align-self: flex-end;
  flex: 1 1 300px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 40px;
}
@media screen and (max-width: 1024px) {
  .p-interview__item-body {
    grid-area: body;
    align-self: stretch;
    gap: 30px;
    justify-content: flex-start;
    margin-top: 6px;
  }
}
.p-interview__item-name dt {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
}
.p-interview__item-name dt::before, .p-interview__item-name dt::after {
  content: "";
  flex-shrink: 0;
  width: 5px;
  height: 17px;
  background-image: url("data:image/svg+xml,%3Csvg width='5' height='17' viewBox='0 0 5 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 1H1V16H5' stroke='%232B2A2E' stroke-width='2'/%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.p-interview__item-name dt::after {
  transform: scaleX(-1);
}
.p-interview__item-name dd {
  font-size: 24px;
  letter-spacing: 0.04em;
  line-height: 32px;
  margin-top: 25px;
}
@media screen and (max-width: 1024px) {
  .p-interview__item-name dd {
    font-size: 22px;
    line-height: 32px;
    margin-top: 15px;
  }
}
.p-interview__item-name dd span {
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 32px;
}
@media screen and (max-width: 1024px) {
  .p-interview__item-name dd span {
    line-height: 28px;
    font-size: 10px;
  }
}
.p-interview__item-text {
  font-size: 14px;
  font-weight: 700;
  line-height: 26px;
  letter-spacing: 0;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-interview__item-text {
    font-size: 12px;
  }
}

@keyframes p-job-desc-track-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(0, -50%, 0);
  }
}
@keyframes p-job-desc-track-scroll-x {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
.p-job-desc {
  background: var(--color-white);
  padding: 120px 0 150px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc {
    padding: 109px 0 0;
  }
}
.p-job-desc__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
}
.p-job-desc__title {
  grid-column: 2/5;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__title {
    grid-column: 1/-1;
    order: 1;
  }
}
.p-job-desc__nav {
  grid-column: 6/12;
  margin-top: 19px;
  min-width: 0;
  margin-right: -78px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__nav {
    grid-column: 1/-1;
    order: 2;
    margin-top: 20px;
    margin-right: -15px;
  }
}
.p-job-desc__nav-list {
  display: flex;
  overflow-x: auto;
  padding: 3px;
  margin-left: -3px;
}
.p-job-desc__nav-item {
  position: relative;
  z-index: 0;
  flex-shrink: 0;
  height: 60px;
  border-style: solid;
  border-color: #CFCFCF;
  border-width: 0.5px 0.5px 0.5px 0;
  transition: border-color 0.5s ease, z-index 0s linear 0.6s;
}
.p-job-desc__nav-item:first-child {
  border-left-width: 0.5px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__nav-item {
    height: 50px;
  }
}
.p-job-desc__nav-item::before, .p-job-desc__nav-item::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -2px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CFCFCF;
  box-shadow: 0 60px 0 #CFCFCF;
  transition: background 0.5s ease, box-shadow 0.5s ease;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__nav-item::before, .p-job-desc__nav-item::after {
    box-shadow: 0 50px 0 #CFCFCF;
  }
}
.p-job-desc__nav-item::before {
  left: -2.25px;
}
.p-job-desc__nav-item::after {
  right: -2.25px;
}
@media (hover: hover) {
  .p-job-desc__nav-item:not(.is-active):hover {
    z-index: 1;
    transition: border-color 0.5s ease, z-index 0s;
  }
  .p-job-desc__nav-item:not(.is-active):hover .p-job-desc__nav-item-frame-line {
    stroke-dashoffset: 0;
  }
}
.p-job-desc__nav-item.is-active {
  z-index: 1;
  transition: border-color 0.5s ease, z-index 0s;
  border-color: #2B2A2E;
  border-width: 0.5px;
}
.p-job-desc__nav-item.is-active::before, .p-job-desc__nav-item.is-active::after {
  background: #2B2A2E;
  box-shadow: 0 60px 0 #2B2A2E;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__nav-item.is-active::before, .p-job-desc__nav-item.is-active::after {
    box-shadow: 0 50px 0 #2B2A2E;
  }
}
.p-job-desc__nav-item.is-active .p-job-desc__nav-item-btn {
  color: var(--color-black);
}
.p-job-desc__nav-item.is-active .p-job-desc__nav-item-frame-track {
  --frame-stroke: var(--color-black);
}
.p-job-desc__nav-item--framed {
  --trace-tone: var(--color-black);
}
.p-job-desc__nav-item--framed, .p-job-desc__nav-item--framed.is-active {
  border-color: transparent;
}
.p-job-desc__nav-item--framed.is-active {
  border-width: 0.5px 0.5px 0.5px 0;
}
.p-job-desc__nav-item--framed.is-active:first-child {
  border-left-width: 0.5px;
}
.p-job-desc__nav-item--framed::before {
  transition: background-color 0.15s linear var(--dot-r-tl, 0s), box-shadow 0.15s linear var(--dot-r-bl, 0s);
}
.p-job-desc__nav-item--framed::after {
  transition: background-color 0.15s linear var(--dot-r-tr, 0s), box-shadow 0.15s linear var(--dot-r-br, 0s);
}
.p-job-desc__nav-item--framed .p-job-desc__nav-item-mark {
  transition: background 0.15s linear calc((var(--dot-r-tr, 0s) + var(--dot-r-br, 0s)) / 2);
}
@media (hover: hover) {
  .p-job-desc__nav-item--framed:not(.is-active):hover::before {
    background: var(--trace-tone);
    box-shadow: 0 60px 0 var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tl, 0s), box-shadow 0.15s linear var(--dot-bl, 0s);
  }
  .p-job-desc__nav-item--framed:not(.is-active):hover::after {
    background: var(--trace-tone);
    box-shadow: 0 60px 0 var(--trace-tone);
    transition: background-color 0.15s linear var(--dot-tr, 0s), box-shadow 0.15s linear var(--dot-br, 0s);
  }
}
@media screen and (hover: hover) and (max-width: 1024px) {
  .p-job-desc__nav-item--framed:not(.is-active):hover::before, .p-job-desc__nav-item--framed:not(.is-active):hover::after {
    box-shadow: 0 50px 0 var(--trace-tone);
  }
}
@media (hover: hover) {
  .p-job-desc__nav-item--framed:not(.is-active):hover .p-job-desc__nav-item-mark {
    background: var(--trace-tone);
    transition: background 0.15s linear calc((var(--dot-tr, 0s) + var(--dot-br, 0s)) / 2);
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-job-desc__nav-item--framed::before, .p-job-desc__nav-item--framed::after,
  .p-job-desc__nav-item--framed .p-job-desc__nav-item-mark {
    transition: none;
  }
}
.p-job-desc__nav-item-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
  pointer-events: none;
}
.p-job-desc__nav-item-frame path {
  stroke: var(--frame-stroke, var(--color-gray));
  stroke-width: 0.5px;
}
@media (max-resolution: 1.5dppx) {
  .p-job-desc__nav-item-frame path {
    stroke-width: 1px;
  }
}
.p-job-desc__nav-item-frame-track {
  transition: stroke 0.5s ease;
}
.p-job-desc__nav-item-frame-line {
  --frame-stroke: var(--color-black);
  stroke-dasharray: var(--len, 500);
  stroke-dashoffset: var(--len, 500);
  transition: stroke-dashoffset 0.6s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .p-job-desc__nav-item-frame-line {
    transition: none;
  }
}
.p-job-desc__nav-item-btn {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 11px;
  border: none;
  background: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 0.04em;
  color: rgba(43, 42, 46, 0.7);
  white-space: nowrap;
  transition: color 0.5s ease;
}
@media (hover: hover) {
  .p-job-desc__nav-item-btn:hover {
    color: var(--color-black);
  }
}
@media screen and (max-width: 1024px) {
  .p-job-desc__nav-item-btn {
    padding: 0 10px;
    font-size: 12px;
  }
}
.p-job-desc__nav-item-mark {
  position: absolute;
  top: 50%;
  right: -1px;
  transform: translateY(-50%);
  width: 0.5px;
  height: 15px;
  background: #CFCFCF;
  transition: background 0.5s ease;
}
.p-job-desc__nav-item.is-active .p-job-desc__nav-item-mark {
  background: var(--color-black);
}
.p-job-desc__nav-item:last-child .p-job-desc__nav-item-mark {
  display: none;
}
.p-job-desc__left {
  grid-column: 2/5;
  margin-top: 77px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 39px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__left {
    display: flex;
    flex-direction: column;
    grid-column: 1/-1;
    order: 4;
    margin-top: 40px;
    gap: 40px;
  }
}
.p-job-desc__steps {
  display: flex;
  flex-direction: column;
}
.p-job-desc__steps * {
  text-box: trim-both cap alphabetic;
}
.p-job-desc__steps-item {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 25px 0;
  border-bottom: 1px solid #323135;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__steps-item {
    gap: 10px;
    padding: 20px 0;
  }
}
.p-job-desc__steps-item:first-child {
  border-top: 1px solid #323135;
}
.p-job-desc__steps-num {
  position: relative;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #2B2B2D;
}
.p-job-desc__steps-num span {
  position: absolute;
  top: 52%;
  left: 52%;
  transform: translate(-50%, -50%);
  color: var(--color-white);
  font-family: var(--font-en);
  font-size: 10px;
  line-height: 1;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__steps-num span {
    font-size: 8px;
  }
}
.p-job-desc__steps-label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-job-desc__steps-label {
    font-size: 12px;
    line-height: 26px;
    letter-spacing: 0.11em;
  }
}
.p-job-desc__cta {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 24px 20px;
  border-radius: 2px;
  background: #2B2A2E;
}
@media (hover: hover) {
  .p-job-desc__cta:hover .p-job-desc__cta-arrow svg {
    transform: translate(2px, 0);
  }
}
.p-job-desc__cta-dot {
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #C8C8C8;
}
.p-job-desc__cta-inner {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 15px;
  padding-left: 5px;
}
.p-job-desc__cta-arrow {
  flex-shrink: 0;
  display: flex;
  color: var(--color-white);
}
.p-job-desc__cta-arrow svg {
  transition: transform 0.3s ease;
}
.p-job-desc__cta-label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 32px;
  color: var(--color-white);
}
.p-job-desc__track {
  height: 874px;
  overflow: hidden;
  border-radius: 2px;
}
@media screen and (min-width: 1025px) {
  .p-job-desc__track {
    height: auto;
    min-height: 874px;
    contain: size;
  }
}
@media screen and (max-width: 1024px) {
  .p-job-desc__track {
    height: 160px;
    margin-top: 14px;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    border-radius: 0;
  }
}
.p-job-desc__track-inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
  animation: p-job-desc-track-scroll 47s linear infinite;
  will-change: transform;
  backface-visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__track-inner {
    flex-direction: row;
    align-items: flex-end;
    gap: 4px;
    animation-name: p-job-desc-track-scroll-x;
    animation-duration: 20s;
  }
}
.p-job-desc__track-item {
  flex-shrink: 0;
  border-radius: 2px;
  overflow: hidden;
}
.p-job-desc__track-item img {
  display: block;
  width: 100%;
  height: 237px;
  -o-object-fit: cover;
     object-fit: cover;
  background: #D9D9D9;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__track-item img {
    width: 240px;
    height: 160px;
  }
}
.p-job-desc__table {
  display: none;
  grid-column: 6/12;
  margin-top: 76px;
  background: var(--color-white);
  border-radius: 2px;
  overflow: hidden;
  opacity: 0;
  filter: blur(3px);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), filter 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.p-job-desc__table * {
  text-box: trim-both cap alphabetic;
}
.p-job-desc__table.is-active {
  display: grid;
  grid-template-columns: subgrid;
  opacity: 1;
  filter: blur(0);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1), filter 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-job-desc__table.is-active.is-leaving {
  opacity: 0;
  filter: blur(3px);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), filter 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.p-job-desc__table.is-active.is-entering {
  opacity: 0;
  filter: blur(3px);
}
@media (prefers-reduced-motion: reduce) {
  .p-job-desc__table {
    transition: none;
  }
}
@media screen and (max-width: 1024px) {
  .p-job-desc__table {
    grid-column: 1/-1;
    order: 3;
    margin-top: 38px;
  }
  .p-job-desc__table.is-active {
    display: flex;
    flex-direction: column;
  }
}
.p-job-desc__row {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: subgrid;
  -moz-column-gap: 4px;
       column-gap: 4px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__row {
    grid-template-columns: 143px 1fr;
  }
}
.p-job-desc__row-label {
  grid-column: 1/3;
  min-width: 0;
  padding: 30px 20px 0;
  background: #2B2A2E;
  color: var(--color-white);
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  border-bottom: 0.5px solid #B1B1B1;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__row-label {
    grid-column: auto;
    font-size: 12px;
  }
}
.p-job-desc__row-text {
  grid-column: 3/-1;
  min-width: 0;
  padding: 30px 20px;
  background: var(--color-white);
  color: var(--color-black);
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0;
  border-bottom: 0.5px solid #B1B1B1;
  border-right: 0.5px solid #B1B1B1;
  margin-top: 4px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__row-text {
    grid-column: auto;
    font-size: 12px;
    line-height: 22px;
  }
}
.p-job-desc__list {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.p-job-desc__list li {
  position: relative;
  padding-left: 20px;
}
@media screen and (max-width: 1024px) {
  .p-job-desc__list li {
    padding-left: 10px;
    margin-left: -10px;
  }
}
.p-job-desc__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-black);
}
@media screen and (max-width: 1024px) {
  .p-job-desc__list li::before {
    width: 2px;
    height: 2px;
  }
}

.p-working {
  position: relative;
  height: 1033px;
  overflow: hidden;
  background: #2B2A2E;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .p-working {
    height: auto;
  }
}
.p-working__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background: var(--color-black);
}
.p-working__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--color-black);
  background-image: url("../images/index/noise.svg");
  background-size: cover;
  opacity: 0.2;
}
@media screen and (max-width: 1024px) {
  .p-working__bg::before {
    opacity: 0.1;
  }
}
.p-working__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.3) 100%);
  z-index: 1;
}
.p-working__bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-working__bg-curtain {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(43, 42, 46, 0.2) 0%, rgba(43, 42, 46, 0.7) 20%, #2B2A2E 80%);
  opacity: 0;
}
.p-working__bg.js-reveal .p-working__bg-curtain {
  opacity: 1;
}
.p-working__bg.js-reveal.is-inview .p-working__bg-curtain {
  opacity: 0;
  transition: opacity 1s ease-out;
}
.p-working__map {
  position: absolute;
  right: -29px;
  top: -577px;
  width: 1212px;
}
@media screen and (max-width: 1024px) {
  .p-working__map {
    right: -1px;
    top: -276px;
    width: 591px;
  }
}
.p-working__inner {
  position: relative;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 4px;
       column-gap: 4px;
  padding-top: 120px;
}
@media screen and (max-width: 1024px) {
  .p-working__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 5px;
         column-gap: 5px;
    height: auto;
    padding-top: 109px;
    padding-bottom: 120px;
  }
}
.p-working__images {
  position: relative;
  grid-column: 1/6;
  display: grid;
  grid-template-columns: subgrid;
}
@media screen and (max-width: 1024px) {
  .p-working__images {
    order: 3;
    grid-column: 1/-1;
    display: block;
    width: 100%;
    margin-top: 13px;
    aspect-ratio: 365/306;
  }
}
.p-working__label {
  position: absolute;
  width: 100%;
}
.p-working__label p {
  white-space: nowrap;
  border-radius: 2px;
  font-size: 14px;
  position: absolute;
  writing-mode: vertical-rl;
  background-color: rgba(251, 251, 249, 0.5);
  padding: 15px 6px;
  line-height: 16px;
  text-box: trim-both cap alphabetic;
  letter-spacing: 0.12em;
  transition: background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.p-working__label p.is-active {
  background-color: var(--color-white);
  z-index: 2;
}
.p-working__label p:nth-child(1) {
  left: 0%;
  top: 30px;
}
.p-working__label p:nth-child(2) {
  left: 10.7%;
  top: -28px;
}
.p-working__label p:nth-child(3) {
  left: 9.7%;
  top: 356px;
}
.p-working__label p:nth-child(4) {
  left: 50%;
  top: 63px;
}
.p-working__label p:nth-child(5) {
  left: 56.5%;
  top: 246px;
}
.p-working__label p:nth-child(6) {
  left: 68%;
  top: 225px;
}
.p-working__label p:nth-child(7) {
  right: 2.5%;
  top: -33px;
}
@media screen and (max-width: 1024px) {
  .p-working__label p {
    font-size: 12px;
    padding: 10px 6px;
    line-height: 14px;
    z-index: 1;
    letter-spacing: 0.2em;
    white-space: nowrap;
  }
  .p-working__label p:nth-child(1) {
    left: 35.1%;
    top: 2px;
  }
  .p-working__label p:nth-child(2) {
    left: 0%;
    top: 49px;
  }
  .p-working__label p:nth-child(3) {
    left: 52.6%;
    top: 42px;
  }
  .p-working__label p:nth-child(4) {
    left: 17.5%;
    top: -7px;
  }
  .p-working__label p:nth-child(5) {
    display: none;
  }
  .p-working__label p:nth-child(6) {
    left: 70.1%;
    top: -13px;
  }
  .p-working__label p:nth-child(7) {
    display: block;
    right: 6%;
    top: -11px;
  }
}
.p-working__photo {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
.p-working__photo-item {
  border-radius: 2px;
  overflow: hidden;
  position: absolute;
  width: 80%;
  max-width: 480px;
  aspect-ratio: 480/350;
  visibility: hidden;
  opacity: 0;
  transition: opacity 2.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 2.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.p-working__photo-item.is-active {
  visibility: visible;
  opacity: 1;
}
.p-working__photo-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.p-working__photo-item:nth-child(1) {
  left: calc(0% - 30px);
  top: 60px;
}
.p-working__photo-item:nth-child(2) {
  left: calc(10.7% - 30px);
  top: 2px;
}
.p-working__photo-item:nth-child(3) {
  left: calc(9.7% - 30px);
  top: 386px;
}
.p-working__photo-item:nth-child(4) {
  right: calc(50% - 28px - 30px);
  top: 93px;
}
.p-working__photo-item:nth-child(5) {
  right: calc(43.5% - 28px - 30px);
  top: 276px;
}
.p-working__photo-item:nth-child(6) {
  right: calc(32% - 28px - 30px);
  top: 255px;
}
.p-working__photo-item:nth-child(7) {
  right: calc(2.5% - 30px);
  top: -3px;
}
@media screen and (max-width: 1024px) {
  .p-working__photo-item {
    width: auto;
    max-width: none;
    aspect-ratio: 365/244;
  }
  .p-working__photo-item:nth-child(1) {
    left: 0;
    right: 0;
    top: 15px;
  }
  .p-working__photo-item:nth-child(2) {
    left: 0;
    right: 0;
    top: 62px;
  }
  .p-working__photo-item:nth-child(3) {
    left: 0;
    right: 0;
    top: 55px;
  }
  .p-working__photo-item:nth-child(4) {
    left: 0;
    right: 0;
    top: 6px;
  }
  .p-working__photo-item:nth-child(5) {
    display: none;
  }
  .p-working__photo-item:nth-child(6) {
    left: 0;
    right: 0;
    top: 0;
  }
  .p-working__photo-item:nth-child(7) {
    display: block;
    left: 0;
    right: 0;
    top: 0;
  }
}
.p-working__main {
  grid-column: 7/-1;
}
@media screen and (max-width: 1024px) {
  .p-working__main {
    grid-column: 1/-1;
    display: contents;
  }
  .p-working__main .c-sec-head {
    display: contents;
  }
  .p-working__main .c-title,
  .p-working__main .c-lead {
    grid-column: 1/-1;
  }
  .p-working__main .c-sec-head__text {
    grid-column: 1/-1;
    order: 4;
    margin-top: 75px;
  }
}
.p-working .c-sec-head__text * {
  text-box: trim-both cap alphabetic;
}
.p-working .c-sec-head__text p {
  font-size: 14px;
  letter-spacing: 0.11em;
  line-height: 30px;
}
.p-working .c-sec-head__text p + p {
  margin-top: 40px;
}
@media screen and (max-width: 1024px) {
  .p-working .c-sec-head__text p {
    font-size: 12px;
    line-height: 26px;
  }
  .p-working .c-sec-head__text p + p {
    margin-top: 30px;
  }
}

.p-notfound__main {
  padding: 200px 0 160px;
}
@media screen and (max-width: 1024px) {
  .p-notfound__main {
    padding: 140px 0 100px;
  }
}
.p-notfound__inner {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  -moz-column-gap: 5px;
       column-gap: 5px;
}
@media screen and (min-width: 1024px) {
  .p-notfound__inner {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    -moz-column-gap: 4px;
         column-gap: 4px;
  }
}
.p-notfound__inner .c-sec-head {
  grid-column: 1/-1;
}
@media screen and (min-width: 1024px) {
  .p-notfound__inner .c-sec-head {
    grid-column: 2/12;
  }
}
.p-notfound__button {
  grid-column: 1/-1;
  margin-top: 48px;
}
@media screen and (min-width: 1024px) {
  .p-notfound__button {
    grid-column: 2/8;
    margin-top: 60px;
  }
}
/*# sourceMappingURL=style.css.map */