:root {
  --color-bg: #fff;
  --color-text: #222;
  --color-white: #fff;
  --color-red: #e71f17;
  --color-line: #d4d4d4;
  --font-ja: "Noto Sans JP", sans-serif;
  --font-en: "Plus Jakarta Sans", sans-serif;
  --content-width: 1312px;
  --side-padding: 100px;
  --sub-red: #e71f17;
  --sub-black: #000;
  --sub-ink: #000;
  --sub-line: #dcdcdc;
  --sub-gutter: clamp(24px, 6.6138vw, 100px);
  --sub-section-space: clamp(82px, 8.5979vw, 130px);
  --sub-body-size: clamp(13px, 1.0582vw, 16px);
}

html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-ja);
  font-size: 16px;
  line-height: 1.8;
}

body.is-locked {
  overflow: hidden;
}

section[id] {
  scroll-margin-top: 20px;
}

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

a {
  color: inherit;
  text-decoration: none;
}

button {
  color: inherit;
  font: inherit;
}

h1,
h2,
h3,
h4,
p,
ul {
  margin: 0;
}

ul {
  padding: 0;
  list-style: none;
}

.l-container {
  width: min(calc(100% - (var(--side-padding) * 2)), var(--content-width));
  margin-inline: auto;
}

.u-sp-only {
  display: none;
}

.site-header {
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  pointer-events: none;
  transition: .4s ease-out;
}

.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.88);
}

.site-header__logo {
  position: absolute;
  top: 24px;
  left: 30px;
  width: 67px;
  pointer-events: auto;
}

.site-header__toggle {
  display: none;
}

.site-header__panel {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  min-height: 100px;
  color: #000;
  pointer-events: none;
}

.site-header__nav {
  position: absolute;
  top: 39px;
  left: 31.3vw;
  pointer-events: auto;
}

.site-header__nav ul {
  display: flex;
  align-items: center;
  gap: clamp(18px, 1.6vw, 28px);
}

.site-header__nav a,
.site-header__contact {
  position: relative;
  font-family: var(--font-en);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.site-header__nav a::after {
  position: absolute;
  right: 0;
  bottom: -7px;
  left: 0;
  height: 1px;
  background: currentColor;
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s ease;
}

.site-header__contact {
  position: absolute;
  top: 28px;
  right: 52px;
  display: flex;
  align-items: center;
  height: 53px;
  padding-left: 20px;
  gap: 13px;
  overflow: hidden;
  font-family: var(--font-ja);
  font-size: 14px;
  pointer-events: auto;
}

.site-header__contact img {
  width: 36px;
  height: 36px;
  max-width: none;
  padding: 12px;
  border-radius: 2px;
  background: #000;
}

.section-heading__ja,
.subpage-heading > p {
  position: relative;
  margin-left: 33px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
}

.section-heading__ja::before,
.subpage-heading > p::before {
  position: absolute;
  top: 50%;
  left: -33px;
  width: 16px;
  height: 6px;
  border-radius: 999px;
  background: #000;
  content: "";
  transform: translateY(-50%);
}

.section-heading__en {
  margin-top: 3px;
  font-family: var(--font-en);
  font-size: 60px;
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.15;
}

/* Home: first view */
.home-mv {
  position: relative;
  height: 100svh;
  min-height: 820px;
  overflow: hidden;
  isolation: isolate;
}

.home-mv__physics {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
}

.physics-item {
  position: absolute;
  top: 0;
  left: 0;
  max-width: none;
  pointer-events: none;
  user-select: none;
  will-change: transform, opacity;
}

.home-mv__copy {
  position: absolute;
  z-index: 5;
  right: 60px;
  bottom: 67px;
  display: grid;
  gap: 17px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1.7;
  text-align: left;
}

.home-mv__copy span {
  display: block;
}

.home-mv__statement {
  position: absolute;
  z-index: 5;
  bottom: 92px;
  left: 94px;
}

.home-mv__statement img {
  width: 164px;
}

.home-mv__statement p {
  margin-top: 27px;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
}

.home-mv__scroll {
  position: absolute;
  z-index: 5;
  right: 54px;
  bottom: 40px;
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: var(--font-en);
  font-size: 15px;
}

.home-mv__scroll span {
  display: grid;
  width: 34px;
  height: 48px;
  border-radius: 18px;
  border: 1px solid #222;
  background: #fff;
  color: #000;
  place-items: center;
}

/* Home: projects */
.project-section {
  position: relative;
  min-height: 1050px;
  overflow: hidden;
  padding-top: 190px;
}

.project-slider {
  position: relative;
  margin-top: 32px;
  margin-left: max(var(--side-padding), calc((100vw - var(--content-width)) / 2));
  overflow: visible;
}

.project-card {
  width: 691px;
}

.project-card a {
  display: block;
}

.project-card img {
  width: 691px;
  height: 460px;
  border-radius: 0;
  object-fit: cover;
}

.project-card__type {
  margin-top: 17px;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.project-card h3 {
  margin-top: 8px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}

.project-slider__controls {
  position: absolute;
  z-index: 5;
  top: -77px;
  right: 100px;
  display: flex;
  gap: 8px;
}

.project-slider__controls button {
  display: grid;
  width: 52px;
  height: 34px;
  padding: 0;
  border: 1px solid #222;
  border-radius: 18px;
  background: #fff;
  cursor: pointer;
  place-items: center;
}

.project-slider__prev img {
  transform: rotate(180deg);
}

/* Home: service */
.service-section > .section-heading {
  padding-top: 20px;
  padding-bottom: 25px;
}

.service-section > .service-card:first-of-type {
  border-radius: 30px 30px 0 0;
}

.service-section > .service-card:last-of-type {
  border-radius: 0 0 30px 30px;
}

.service-card {
  position: relative;
  display: block;
  height: min(64.95vw, 982px);
  min-height: 620px;
  overflow: hidden;
  color: #fff;
  isolation: isolate;
}

.service-card__media,
.service-card__media img,
.service-card__shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.service-card__media {
  z-index: -2;
  overflow: hidden;
  transform-origin: center;
}

.service-card__media img {
  max-width: none;
  object-fit: cover;
}

.service-card__shade {
  z-index: -1;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.06) 30%, rgba(0, 0, 0, 0.72) 100%);
}

.service-card__content {
  position: absolute;
  right: 80px;
  bottom: 45px;
  left: 79px;
  padding-right: 150px;
}

.service-card__category {
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 20px;
  line-height: 1;
}

.service-card__category span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 2px 13px;
  border-radius: 22px;
  background: #fff;
  color: #000;
  font-weight: 500;
}

.service-card__category b {
  font-family: var(--font-en);
  font-weight: 700;
}

.service-card h3 {
  margin-top: 25px;
  font-size: 47px;
  font-weight: 700;
  letter-spacing: 0.015em;
  line-height: 1.35;
}

.service-card__description {
  margin-top: 20px;
  font-size: 18px;
  line-height: 1.62;
}

.service-card__tags {
  margin-top: 18px;
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.44);
  font-size: 12px;
  line-height: 1.4;
}

.service-cursor {
  position: absolute;
  z-index: 2;
  right: 80px;
  bottom: 45px;
  display: grid;
  width: 110px;
  height: 110px;
  pointer-events: none;
  border-radius: 50%;
  background: var(--color-red);
  place-items: center;
}

.service-cursor img {
  width: 12px;
  height: 12px;
}

/* Home: information */
.information-section {
  min-height: 1240px;
  padding-top: 230px;
}

.information-section__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding-bottom: 29px;
}

.information-filter {
  display: flex;
  align-items: center;
  padding-bottom: 10px;
  gap: 10px;
}

.information-filter button {
  min-width: 103px;
  height: 35px;
  padding: 0 20px;
  border: 1px solid #bdbdbd;
  border-radius: 18px;
  background: #fff;
  color: #999;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}

.information-filter button.is-active {
  border-color: #000;
  background: #000;
  color: #fff;
}

.information-list {
  position: relative;
}

.information-section__column-link {
  position: absolute;
  z-index: 3;
  inset: 0;
}

.information-item {
  border-top: 1px solid var(--color-line);
}

.information-item:last-child {
  border-bottom: 1px solid var(--color-line);
}

.information-item.is-visible-last {
  border-bottom: 1px solid var(--color-line);
}

.information-item__inner {
  display: grid;
  min-height: 248px;
  grid-template-columns: 130px 300px minmax(0, 1fr);
  align-items: center;
  gap: 32px;
}

.information-item time {
  align-self: start;
  padding-top: 47px;
  font-family: var(--font-en);
  font-size: 16px;
  font-weight: 700;
}

.information-item__inner > img {
  width: 300px;
  height: 200px;
  object-fit: cover;
}

.information-item__category {
  font-size: 12px;
  font-weight: 700;
  text-decoration: underline;
}

.information-item h3 {
  margin-top: 16px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
}

.information-item__text {
  margin-top: 8px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}

.information-item__arrow {
  display: grid;
  width: 34px;
  height: 50px;
  border-radius: 18px;
  border: 1px solid #222;
  background: #fff;
  place-items: center;
}

.information-item.is-hidden {
  display: none;
}

/* Home: FAQ */
.faq-section {
  min-height: 1030px;
  padding-top: 145px;
}

.faq-list {
  display: grid;
  margin-top: 68px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 58px;
}

.faq-item {
  border-top: 1px solid #222;
}

.faq-item button {
  display: grid;
  width: 100%;
  min-height: 182px;
  padding: 0 18px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  grid-template-columns: 54px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 0;
}

.faq-item button span {
  font-family: var(--font-en);
  font-size: 30px;
  font-weight: 700;
}

.faq-item button b {
  padding-right: 25px;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.7;
}

.faq-item button i {
  position: relative;
  display: grid;
  width: 34px;
  height: 50px;
  border-radius: 18px;
  border: 1px solid #222;
  background: #fff;
  color: #000;
  font-size: 0;
  font-style: normal;
  place-items: center;
}

.faq-item button i::before {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  font-size: 16px;
  line-height: 1;
  content: "↓";
  transition: transform 0.3s ease;
  transform: translate(-50%, -50%) scaleY(1);
  transform-origin: center;
}

.faq-item button[aria-expanded="true"] i::before {
  transform: translate(-50%, -50%) scaleY(-1);
}

.faq-item__answer {
  display: none;
  padding: 0 72px 34px;
  color: #555;
  font-size: 16px;
  line-height: 1.8;
}

/* Footer */
.site-footer {
  position: relative;
  min-height: 700px;
  border-radius: 28px 28px 0 0;
  background: #000;
  color: #fff;
}

.site-footer__inner {
  position: relative;
  min-height: inherit;
  padding-top: 170px;
}

.site-footer address {
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.6;
  width: 35%;
}

.site-footer__nav {
  position: absolute;
  top: 155px;
  right: 0;
  display: grid;
  grid-template-columns: repeat(2, auto);
  gap: 155px;
}

.site-footer__nav ul {
  display: grid;
  gap: 24px;
  text-align: right;
}

.site-footer__nav a {
  font-family: var(--font-en);
  font-size: 43px;
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.45;
}

.site-footer__utility {
  position: absolute;
  right: 0;
  bottom: 100px;
  left: 0;
  display: grid;
  align-items: center;
  grid-template-columns: 1fr auto 1fr;
}

.site-footer__back,
.site-footer__legal,
.site-footer__copyright {
  font-family: var(--font-en);
  font-size: 16px;
  font-weight: 600;
}

.site-footer__back {
  justify-self: start;
}

.site-footer__legal {
  display: flex;
  align-items: center;
  gap: clamp(50px, 7vw, 110px);
  justify-self: center;
}

.site-footer__copyright {
  justify-self: end;
}

/* About: page header and lead */
.page-title {
  position: relative;
  height: 350px;
  padding-top: 180px;
}

.page-title::after {
  position: absolute;
  top: 269px;
  left: calc(50% - 50vw);
  width: 100vw;
  height: 1px;
  background: var(--color-line);
  content: "";
}

.page-title h1 {
  font-family: var(--font-en);
  font-size: 60px;
  font-weight: 700;
  line-height: 1;
}

.page-title h1 span {
  color: var(--color-red);
}

.page-title__breadcrumb {
  position: relative;
  z-index: 2;
  margin-top: 30px;
  font-family: var(--font-en);
  font-size: 12px;
}

.page-title__brand {
  position: absolute;
  z-index: 0;
  top: 0;
  right: -24px;
  width: 610px;
}

.page-title__brand img {
  width: 100%;
}

.page-title__brand strong {
  position: absolute;
  right: 12px;
  bottom: 112px;
  font-size: 18px;
  letter-spacing: 0.22em;
}

.about-lead {
  position: relative;
  height: 900px;
}

.about-lead__copy {
  position: relative;
  z-index: 2;
  padding-top: 165px;
}

.about-lead__copy h2 {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: 0.015em;
  line-height: 2;
}

.about-lead__copy p {
  width: 520px;
  margin-top: 270px;
  font-size: 16px;
  line-height: 2;
}

.about-lead__image {
  position: absolute;
  top: 380px;
  right: 0;
  width: calc(50% - 30px);
  height: 585px;
  overflow: hidden;
  border-radius: 30px 0 0 30px;
}

.about-lead__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.subpage-heading > p {
  font-family: var(--font-en);
  font-size: 18px;
  letter-spacing: -0.02em;
}

.subpage-heading h2 {
  margin-top: 10px;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.45;
}

/* About: philosophy */
.philosophy-section {
  position: relative;
  height: 760px;
  overflow: hidden;
}

.philosophy-section__word {
  position: absolute;
  top: 120px;
  left: 50%;
  width: 702px;
  max-width: none;
  transform: translateX(-50%);
  opacity: 0.09;
}

.philosophy-section__body {
  display: grid;
  margin-top: 80px;
  grid-template-columns: 1.25fr 1fr;
  min-height: 470px;
}

.philosophy-section__text {
  padding: 44px 70px 0 0;
}

.philosophy-section__text h3 {
  font-size: 32px;
  line-height: 1.75;
}

.philosophy-section__text p {
  margin-top: 28px;
  font-size: 16px;
  line-height: 2;
}

.text-link {
  position: relative;
  min-height: 190px;
  border-top: 1px solid var(--color-line);
  align-self: end;
}

.text-link--service {
  min-height: 470px;
  padding-top: 320px;
  padding-left: 80px;
  border-top: 0;
  border-left: 1px solid var(--color-line);
}

.text-link span {
  font-family: var(--font-en);
  font-size: 30px;
  font-weight: 500;
  line-height: 1.2;
}

.text-link small {
  margin-top: 7px;
  font-size: 12px;
  font-weight: 700;
}

.text-link i,
.contact-section__content > a {
  position: absolute;
  right: 0;
  bottom: 0;
  display: grid;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: var(--color-red);
  place-items: center;
}

/* About: value */
.value-section {
  position: relative;
  height: 1650px;
  overflow: hidden;
  padding-top: 70px;
}

.value-section::before {
  position: absolute;
  top: 500px;
  left: 50%;
  width: 697px;
  height: 418px;
  background: url("../img/common/onlyone.svg") center / contain no-repeat;
  content: "";
  transform: translateX(-50%);
}

.value-section__diagram {
  position: relative;
  width: 624px;
  height: auto;
  margin: 105px auto 0;
}

.value-list {
  display: grid;
  margin-top: 110px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.value-item {
  min-height: 480px;
  padding: 0 30px 0 13px;
}

.value-item + .value-item {
  padding-left: 57px;
  border-left: 1px solid var(--color-line);
}

.value-item__number {
  font-family: var(--font-en);
  font-size: 66px;
  font-weight: 400;
  line-height: 1;
}

.value-item > span {
  display: block;
  width: 52px;
  height: 4px;
  margin-top: 66px;
  background: var(--color-red);
}

.value-item h3 {
  margin-top: 42px;
  font-family: var(--font-en);
  font-size: 40px;
  font-weight: 500;
  line-height: 1;
}

.value-item h4 {
  margin-top: 30px;
  font-size: 23px;
  line-height: 1.65;
}

.value-item > p:last-child {
  margin-top: 24px;
  font-size: 16px;
  line-height: 1.9;
}

.value-section__link {
  position: absolute;
  right: 100px;
  bottom: 70px;
  width: 450px;
}

/* About: numbers */
.numbers-section {
  height: 1240px;
  padding-top: 28px;
}

.numbers-grid {
  display: grid;
  margin-top: 58px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}

.number-card {
  position: relative;
  display: flex;
  height: 420px;
  padding: 42px 25px 34px;
  border: 1px solid var(--color-line);
  align-items: center;
  flex-direction: column;
  text-align: center;
}

.number-card h3 {
  font-family: var(--font-en);
  font-size: 28px;
  line-height: 1.2;
}

.number-card > p {
  margin-top: 2px;
  font-size: 14px;
  font-weight: 700;
}

.number-card img {
  width: 146px;
  height: 120px;
  margin-top: 35px;
}

.number-card strong {
  margin-top: auto;
  font-family: var(--font-en);
  font-size: 51px;
  font-weight: 700;
  line-height: 1;
}

.number-card strong small {
  margin-left: 4px;
  font-family: var(--font-ja);
  font-size: 18px;
}

.number-card--feature strong {
  font-family: var(--font-ja);
  font-size: 34px;
}

/* About: message */
.message-section {
  height: 1220px;
}

.message-section__content {
  display: grid;
  margin-top: 65px;
  grid-template-columns: 540px minmax(0, 1fr);
  gap: 72px;
}

.message-section__content > img {
  width: 540px;
  height: 900px;
  border-radius: 28px;
  object-fit: cover;
}

.message-section__text {
  display: flex;
  padding-top: 80px;
  flex-direction: column;
}

.message-section__text h3 {
  font-size: 40px;
  line-height: 1.75;
}

.message-section__text > p {
  margin-top: 30px;
  font-size: 20px;
  line-height: 2;
}

.message-section__text .text-link {
  width: 100%;
  margin-top: auto;
}

/* About: contact */
.contact-section {
  position: relative;
  height: 560px;
  overflow: hidden;
  color: #fff;
}

.contact-section > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.contact-section__content {
  position: relative;
  height: 100%;
  padding-top: 80px;
}

.contact-section__content h2 {
  font-family: var(--font-en);
  font-size: 80px;
  font-weight: 500;
  line-height: 1;
}

.contact-section__content h3 {
  margin-top: 57px;
  font-size: 30px;
  letter-spacing: 0.16em;
  line-height: 2;
}

.contact-section__content p {
  margin-top: 30px;
  font-size: 16px;
  line-height: 1.5;
}

.contact-section__content > a {
  right: 0;
  bottom: 224px;
}

.wpcf7-turnstile {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

.page-about .site-footer {
  min-height: 793px;
  border-radius: 0;
}

@media (hover: hover) and (pointer: fine) {
  .site-header__nav a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }

  .project-card a:hover img {
    opacity: 0.78;
  }

  .project-card img {
    transition: opacity 0.3s ease;
  }

  .site-footer a:hover,
  .text-link:hover span {
    opacity: 0.6;
  }
}

@media (max-width: 1100px) {
  :root {
    --side-padding: 48px;
  }

  .service-card h3 {
    font-size: clamp(32px, 4vw, 47px);
  }

  .information-section__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 30px;
  }

  .information-filter {
    flex-wrap: wrap;
  }

  .site-footer__nav {
    gap: 70px;
  }

  .site-footer__nav a {
    font-size: 34px;
  }

  .message-section__content {
    grid-template-columns: minmax(360px, 45%) minmax(0, 1fr);
  }

  .message-section__content > img {
    width: 100%;
  }
}

@media (min-width: 901px) and (max-width: 1280px) {
  .site-header__nav {
    left: clamp(130px, 12.5vw, 160px);
  }

  .site-header__nav ul {
    gap: clamp(10px, 1.1vw, 14px);
  }

  .site-header__nav a {
    font-size: 13px;
  }

  .site-header__contact {
    right: 18px;
    padding-left: 16px;
    gap: 12px;
    font-size: 12px;
  }
}

@media (max-width: 900px) {
  body.is-menu-open {
    overflow: hidden;
  }

  .site-header {
    height: 82px;
  }

  .site-header__logo {
    z-index: 2;
    top: 16px;
    left: 18px;
    width: 48px;
  }

  .site-header__toggle {
    position: fixed;
    z-index: 3;
    top: 16px;
    right: 18px;
    display: flex;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: #000;
    align-items: center;
    cursor: pointer;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    pointer-events: auto;
  }

  .site-header__toggle span {
    display: block;
    width: 20px;
    height: 1px;
    background: #fff;
    transition: opacity 0.25s ease, transform 0.25s ease;
  }

  .site-header.is-menu-open .site-header__toggle span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
  }

  .site-header.is-menu-open .site-header__toggle span:nth-child(2) {
    opacity: 0;
  }

  .site-header.is-menu-open .site-header__toggle span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
  }

  .site-header__panel {
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    left: 0;
    display: block;
    min-height: 0;
    padding: 92px 20px 28px;
    border-radius: 0 0 22px 22px;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-14px);
    transition: opacity 0.25s ease, transform 0.3s ease, visibility 0.3s;
    pointer-events: none;
  }

  .site-header.is-menu-open .site-header__panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .site-header__nav {
    position: static;
    overflow: visible;
  }

  .site-header__nav ul {
    display: grid;
    width: 100%;
    gap: 0;
  }

  .site-header__nav li {
    border-top: 1px solid var(--color-line);
  }

  .site-header__nav li:last-child {
    border-bottom: 1px solid var(--color-line);
  }

  .site-header__nav a {
    display: block;
    padding: 11px 2px;
    font-size: 22px;
    line-height: 1.25;
  }

  .site-header__nav a::after {
    display: none;
  }

  .site-header__contact {
    position: static;
    width: 100%;
    height: 52px;
    min-height: 52px;
    margin-top: 20px;
    justify-content: space-between;
    font-size: 13px;
  }

  .site-header__contact img {
    width: 36px;
    height: 36px;
    padding: 12px;
  }
}

@media (max-width: 767px) {
  :root {
    --side-padding: 20px;
  }

  body {
    font-size: 15px;
  }

  .u-pc-only {
    display: none;
  }

  .u-sp-only {
    display: block;
  }

  .section-heading__ja,
  .subpage-heading > p {
    margin-left: 12px;
    font-size: 14px;
  }

  .section-heading__ja::before,
  .subpage-heading > p::before {
    left: -12px;
    width: 8px;
    height: 4px;
  }

  .section-heading__en {
    margin-top: 6px;
    font-size: clamp(40px, 13vw, 54px);
  }

  .home-mv {
    min-height: 680px;
  }

  .home-mv__copy {
    right: 20px;
    bottom: 34px;
    left: 20px;
    gap: 5px;
    font-size: 12px;
    letter-spacing: 0.08em;
  }

  .home-mv__statement {
    bottom: 175px;
    left: 20px;
  }

  .home-mv__statement img {
    width: 112px;
  }

  .home-mv__statement p {
    margin-top: 14px;
    font-size: 18px;
  }

  .home-mv__scroll {
    right: 20px;
    bottom: 20px;
    font-size: 12px;
  }

  .project-section {
    min-height: auto;
    padding: 100px 0 120px;
  }

  .project-slider {
    margin-top: 14px;
    margin-left: var(--side-padding);
    padding-top: 44px;
  }

  .project-card {
    width: min(84vw, 430px);
  }

  .project-card img {
    width: 100%;
    height: auto;
    aspect-ratio: 691 / 460;
  }

  .project-slider__controls {
    top: 0;
    right: 20px;
  }

  .project-slider__controls button {
    width: 44px;
    height: 30px;
  }

  .service-section > .section-heading {
    padding: 0 0 22px;
  }

  .service-card {
    height: 760px;
    min-height: 0;
  }

  .service-card__content {
    right: 20px;
    bottom: 30px;
    left: 20px;
    padding-right: 0;
  }

  .service-card__category {
    gap: 12px;
    font-size: 14px;
  }

  .service-card__category span {
    min-height: 30px;
    padding: 2px 11px;
  }

  .service-card h3 {
    margin-top: 18px;
    font-size: 27px;
    line-height: 1.5;
  }

  .service-card__description {
    margin-top: 15px;
    font-size: 14px;
    line-height: 1.8;
  }

  .service-card__tags {
    padding-right: 64px;
    font-size: 10px;
  }

  .service-cursor {
    right: 20px;
    bottom: 8px;
    width: 46px;
    height: 46px;
  }

  .information-section {
    min-height: auto;
    padding: 110px 0 100px;
  }

  .information-section__head {
    gap: 25px;
    padding-bottom: 25px;
  }

  .information-filter {
    gap: 8px;
  }

  .information-filter button {
    min-width: 0;
    height: 31px;
    padding: 0 13px;
    font-size: 13px;
  }

  .information-item__inner {
    min-height: 0;
    padding-block: 22px;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 14px;
  }

  .information-item time {
    padding: 0;
    font-size: 12px;
    grid-column: 1 / -1;
  }

  .information-item__inner > img {
    width: 105px;
    height: 70px;
  }

  .information-item__category {
    font-size: 10px;
  }

  .information-item h3 {
    margin-top: 5px;
    font-size: 14px;
  }

  .information-item__text {
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.7;
  }

  .information-item__arrow {
    width: 28px;
    height: 42px;
  }

  .faq-section {
    min-height: auto;
    padding: 90px 0 130px;
  }

  .faq-list {
    margin-top: 40px;
    grid-template-columns: 1fr;
  }

  .faq-item button {
    min-height: 120px;
    padding-inline: 5px;
    grid-template-columns: 38px minmax(0, 1fr) 30px;
  }

  .faq-item button span {
    font-size: 24px;
  }

  .faq-item button b {
    padding-right: 15px;
    font-size: 15px;
  }

  .faq-item button i {
    width: 28px;
    height: 42px;
  }

  .faq-item__answer {
    padding: 0 38px 25px;
    font-size: 14px;
  }

  .site-footer,
  .page-about .site-footer {
    min-height: 660px;
  }

  .site-footer__inner {
    padding-top: 80px;
  }

  .site-footer address {
    font-size: 13px;
    width: auto;
  }

  .site-footer__nav {
    position: static;
    margin-top: 75px;
    gap: 25px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer__nav ul {
    gap: 14px;
  }

  .site-footer__nav a {
    font-size: clamp(24px, 8vw, 34px);
  }

  .site-footer__utility {
    right: 0;
    bottom: 32px;
    left: 0;
    gap: 16px 20px;
    grid-template-columns: 1fr auto;
  }

  .site-footer__legal {
    grid-column: 1 / -1;
    grid-row: 1;
    gap: 18px;
    justify-content: space-between;
    justify-self: stretch;
  }

  .site-footer__back {
    grid-column: 1;
    grid-row: 2;
  }

  .site-footer__copyright {
    grid-column: 2;
    grid-row: 2;
  }

  .site-footer__back,
  .site-footer__legal,
  .site-footer__copyright {
    font-size: 12px;
  }

  /* About mobile */
  .page-title {
    width: 100%;
    height: 280px;
    margin-inline: 0;
    overflow: hidden;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 160px;
  }

  .page-title::after {
    top: 225px;
  }

  .page-title h1 {
    font-size: 48px;
  }

  .page-title__breadcrumb {
    margin-top: 22px;
  }

  .page-title__brand {
    top: 28px;
    right: -80px;
    width: 420px;
    opacity: 0.7;
  }

  .page-title__brand strong {
    display: none;
  }

  .about-lead,
  .philosophy-section,
  .value-section,
  .numbers-section,
  .message-section {
    height: auto;
  }

  .about-lead {
    display: flex;
    padding: 70px 0 120px;
    flex-direction: column;
  }

  .about-lead__copy {
    padding-top: 0;
  }

  .about-lead__copy h2 {
    font-size: 25px;
    line-height: 2;
  }

  .about-lead__copy p {
    width: auto;
    margin-top: 45px;
    font-size: 14px;
  }

  .about-lead__image {
    position: relative;
    top: auto;
    right: auto;
    width: calc(100% - 20px);
    height: 320px;
    margin: 55px 0 0 20px;
    border-radius: 20px 0 0 20px;
  }

  .subpage-heading h2 {
    margin-top: 6px;
    font-size: 27px;
  }

  .philosophy-section {
    padding-bottom: 110px;
  }

  .philosophy-section__word {
    top: 170px;
    width: 520px;
  }

  .philosophy-section__body {
    margin-top: 45px;
    grid-template-columns: 1fr;
  }

  .philosophy-section__text {
    padding: 20px 0 70px;
  }

  .philosophy-section__text h3 {
    font-size: 24px;
  }

  .philosophy-section__text p {
    font-size: 14px;
  }

  .text-link--service {
    min-height: 190px;
    padding: 70px 110px 20px 0;
    border-top: 1px solid var(--color-line);
    border-left: 0;
  }

  .text-link span {
    font-size: 25px;
  }

  .text-link i,
  .contact-section__content > a {
    width: 76px;
    height: 76px;
  }

  .value-section {
    padding: 80px 0 130px;
  }

  .value-section::before {
    top: 400px;
    width: 500px;
  }

  .value-section__diagram {
    width: min(100%, 520px);
    margin-top: 65px;
  }

  .value-list {
    margin-top: 70px;
    grid-template-columns: 1fr;
  }

  .value-item,
  .value-item + .value-item {
    min-height: 0;
    padding: 45px 12px 65px;
    border-top: 1px solid var(--color-line);
    border-left: 0;
  }

  .value-item__number {
    font-size: 52px;
  }

  .value-item > span {
    margin-top: 32px;
  }

  .value-item h3 {
    margin-top: 32px;
    font-size: 34px;
  }

  .value-item h4 {
    font-size: 20px;
  }

  .value-section__link {
    position: relative;
    right: auto;
    bottom: auto;
    width: calc(100% - 40px);
    margin-top: 20px;
  }

  .numbers-section {
    padding: 90px 0 120px;
  }

  .numbers-grid {
    margin-top: 45px;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .number-card {
    height: 390px;
  }

  .message-section {
    padding: 70px 0 120px;
  }

  .message-section__content {
    margin-top: 45px;
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .message-section__content > img {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 5;
    border-radius: 20px;
  }

  .message-section__text {
    padding-top: 0;
  }

  .message-section__text h3 {
    font-size: 26px;
  }

  .message-section__text > p {
    font-size: 15px;
  }

  .message-section__text .text-link {
    margin-top: 65px;
  }

  .contact-section {
    height: 620px;
  }

  .contact-section__content {
    padding-top: 70px;
  }

  .contact-section__content h2 {
    font-size: 54px;
  }

  .contact-section__content h3 {
    margin-top: 50px;
    font-size: 22px;
    letter-spacing: 0.1em;
  }

  .contact-section__content p {
    font-size: 13px;
  }

  .contact-section__content > a {
    right: 5px;
    bottom: 75px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto;
    transition-duration: 0.01ms;
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
  }
}

/* Inner pages */
.page-sub {
  color: var(--sub-ink);
}

.page-sub .site-header:not(.is-scrolled) {
  background: transparent;
}

@media (max-width: 900px) {
  .page-sub .site-header__toggle {
    background: var(--sub-red);
  }

  .page-sub .site-header:not(.is-scrolled) .site-header__toggle span {
    background: #fff;
  }

  .page-sub .site-header.is-menu-open .site-header__toggle span {
    background: #fff;
  }
}

.sub-container {
  width: min(calc(100% - var(--sub-gutter) - var(--sub-gutter)), 1312px);
  margin-inline: auto;
}

.sub-narrow {
  width: min(calc(100% - var(--sub-gutter) - var(--sub-gutter)), 1000px);
  margin-inline: auto;
}

.sub-hero {
  position: relative;
  height: 350px;
  padding-top: 190px;
}

.sub-hero::before {
  position: absolute;
  z-index: 0;
  top: -16px;
  right: -16px;
  width: min(46.1vw, 697px);
  height: 418px;
  background: url("../img/common/onlyone.svg") top center / contain no-repeat;
  content: "";
  pointer-events: none;
}

.sub-hero::after {
  position: absolute;
  top: 266px;
  right: 0;
  left: 0;
  height: 1px;
  background: var(--sub-line);
  content: "";
}

.sub-hero > .sub-container {
  position: relative;
  z-index: 1;
}

.sub-hero__title {
  font-family: var(--font-en);
  font-size: clamp(46px, 4vw, 64px);
  font-weight: 700;
  letter-spacing: -.045em;
  line-height: 1;
}

.sub-hero__title::first-letter {
  color: var(--sub-red);
}

.sub-hero__tagline {
  position: absolute;
  top: 28px;
  right: 0;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .3em;
}

.sub-hero__breadcrumb {
  position: absolute;
  top: 96px;
  left: 0;
  margin: 0;
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 300;
}

.sub-section {
  padding-block: var(--sub-section-space);
}

.sub-kicker {
  margin-bottom: 38px;
  color: var(--sub-red);
  font-family: var(--font-en);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em;
}

.sub-kicker span {
  margin-left: 30px;
  font-family: var(--font-ja);
  font-size: 13px;
}

.sub-display {
  font-size: clamp(32px, 4.4vw, 68px);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.4;
}

.sub-lead {
  font-size: var(--sub-body-size);
  font-weight: 500;
  line-height: 2.25;
}

.sub-rule {
  border-top: 1px solid var(--sub-line);
}

.sub-photo {
  width: 100%;
  object-fit: cover;
}

.text-link {
  display: inline-flex;
  align-items: center;
  margin-top: 48px;
  gap: 28px;
  font-family: var(--font-en);
  font-size: 14px;
  font-weight: 600;
}

.text-link::after {
  display: grid;
  width: 104px;
  height: 104px;
  flex: 0 0 104px;
  border-radius: 50%;
  background: var(--sub-red) url("../img/common/arrow_white.svg") center / 12px 12px no-repeat;
  content: "";
  place-items: center;
}

.common-contact {
  position: relative;
  display: flex;
  min-height: 590px;
  align-items: center;
  overflow: hidden;
  background: #161616 center / cover no-repeat;
  border-radius: 28px 28px 0 0;
  color: #fff;
}

.common-contact::before {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .28);
  content: "";
}

.common-contact__inner {
  position: relative;
  width: min(calc(100% - var(--sub-gutter) - var(--sub-gutter)), 1312px);
  margin-inline: auto;
}

.common-contact__label {
  margin-bottom: 32px;
  font-family: var(--font-en);
  font-size: clamp(48px, 4.55vw, 69px);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1;
}

.common-contact h2 {
  font-size: clamp(23px, 2vw, 30px);
  font-weight: 600;
  letter-spacing: .3em;
  line-height: 1.65;
}

.common-contact__copy {
  width: 430px;
  margin-top: 28px;
  font-size: 13px;
  line-height: 2;
}

.common-contact__arrow {
  position: absolute;
  top: 50%;
  right: 0;
  display: grid;
  width: 104px;
  height: 104px;
  border-radius: 50%;
  background: var(--sub-red);
  place-items: center;
  transform: translateY(-50%);
}

.common-contact__arrow img {
  width: 12px;
  height: 12px;
}

.page-sub .site-footer {
  border-radius: 0;
}

/* About */
.about-intro {
  position: relative;

  padding: 155px 0 120px;
}

.about-intro__copy {
  display: block;
  margin: 0;
}

.about-intro .sub-display {
  font-size: clamp(30px, 2.65vw, 40px);
  line-height: 1.65;
}

.about-intro__copy .sub-lead {

  padding: 0;
  font-size: 13px;
  line-height: 2.15;
}

.about-intro__photo {
  position: absolute;


  width: 55%;

  margin: 0;

}

.about-philosophy {
  display: grid;
  grid-template-columns: 60% 40%;


  gap: 0;
}

.about-section-heading .sub-kicker,
.about-philosophy__visual .sub-kicker {
  margin-bottom: 12px;
  color: var(--sub-ink);
}

.about-section-heading .sub-kicker::before,
.about-philosophy__visual .sub-kicker::before {
  display: inline-block;
  width: 12px;
  height: 4px;
  margin-right: 10px;
  background: var(--sub-ink);
  content: "";
  vertical-align: 3px;
}

.about-section-title {
  font-size: 30px;
  font-weight: 600;
  line-height: 1.5;
}

.about-philosophy__mark {
  display: block;
  width: min(85%, 702px);

}

.about-philosophy__body {

  padding: 18px 0 0 70px;
  border-left: 1px solid var(--sub-line);
}

.about-philosophy__body h3 {
  margin-bottom: 34px;
  font-size: 16px;
  line-height: 1.8;
}

.about-philosophy__body .sub-lead {
  font-size: 13px;
  line-height: 2.15;
}

.about-values {
  padding: 128px 0 135px;
}

.about-values > .sub-container {
  display: flex;
  flex-direction: column;
}

.about-values .about-section-heading { order: 1; }
.about-values__diagram { order: 2; }
.about-values__grid { order: 3; }
.about-values .text-link { order: 4; max-width: 450px; padding-top: 0; border-top: none;}

.about-values__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;

  gap: 0;
}

.about-value {

  border-left: 1px solid var(--sub-line);
}

.about-value + .about-value {
  border-left: 1px solid var(--sub-line);
}

.about-value__no {
  color: #ddd;
  font-family: var(--font-en);

  font-weight: 300;
}

.about-value h3 {
  margin: 35px 0 36px;
  font-family: var(--font-en);

  font-weight: 500;
}

.about-value__catch {
  position: relative;
  margin-bottom: 25px;

  font-weight: 700;
  line-height: 1.7;
}

.about-value__catch::before {
  position: absolute;
  top: -20px;
  left: 0;
  width: 42px;
  height: 2px;
  background: var(--sub-red);
  content: "";
}

.about-value__text {
  font-size: 13px;
  line-height: 2;
}

.about-values__diagram {
  width: min(100%, 650px);
  margin: 72px auto 0;
}

.about-message {
  padding: 128px 0 120px;
}

.about-message__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;


}

.about-message__grid > div {
  margin-top: 0;
}

.about-message__catch {
  font-weight: 500;
  line-height: 1.75;
}

.about-message__sign {
  display: block;
  width: min(100%, 416px);
  height: auto;
  margin-top: 55px;
  margin-left: auto;
}

.page-about-new .text-link {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

.page-about-new .text-link span,
.page-about-new .text-link strong,
.page-about-new .text-link small {
  display: block;
}

.page-about-new .text-link strong {
  font-size: 20px;
  font-weight: 600;
}

.page-about-new .text-link small {
  margin-top: 8px;
  font-family: var(--font-ja);
  font-size: 10px;
  font-weight: 600;
}

.about-message .text-link {
  margin-top: 55px;
  padding-top: 42px;
  border-top: 1px solid var(--sub-line);
}

/* Service */
.service-intro {
  padding: 190px 0 150px;
}

.service-intro__grid {
  display: grid;



}

.service-intro__photo {

  margin-left: auto;

}

.service-flow,
.service-strengths {
  padding: 145px 0 165px;
}

.flow-list {
  display: grid;


  border-top: 1px solid var(--sub-line);
  border-left: 1px solid var(--sub-line);
}

.flow-item {
  position: relative;



  border-bottom: 1px solid var(--sub-line);
}

.flow-item__no {
  font-family: var(--font-en);
  font-size: 13px;
}

.flow-item h3 {

}

.flow-item p:last-child {

}

.flow-item::after {
  position: absolute;
  top: 50%;



}

.strength-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);


}

.strength-item {

}

.strength-item + .strength-item {
  border-left: 1px solid var(--sub-line);
}

.strength-item h3 {

}

.strength-item p:last-child {
  line-height: 2;
}

.service-category {
  padding: 110px 0 0;
}

.service-category > .sub-container {
  width: 100%;
  max-width: none;
}

.service-category__lead {
  display: grid;


  margin: 0 auto 78px;

}

.service-category__lead h2 {
  font-family: var(--font-en);


  text-transform: uppercase;
}

.service-category__lead h2 span {
  display: block;
  margin-top: 12px;
  font-family: var(--font-ja);
  font-size: 15px;
}

.service-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.service-gallery article {
  position: relative;
  overflow: hidden;
}

.service-gallery img {
  width: 100%;
  aspect-ratio: 1.14;
  object-fit: cover;
}

.service-gallery h3 {
  position: absolute;
  z-index: 2;
  top: 46%;
  left: 50%;
  width: 90%;
  margin: 0;
  color: #fff;

  text-align: center;
  transform: translate(-50%, -50%);
}

.service-gallery p {
  position: absolute;
  z-index: 2;
  top: 57%;
  left: 50%;
  width: 90%;
  color: #fff;

  line-height: 1.8;
  text-align: center;
  transform: translateX(-50%);
}

.service-gallery article::after {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .15);
  content: "";
}

.service-category > .sub-container > .text-link {
  display: flex;




}

.service-category > .sub-container > .text-link::after {

  border: 0;

  color: #fff;
}

/* Works */
.works-main {
  padding: 105px 0 170px;
}

.works-main::after {
  width: 104px;
  height: 104px;
  margin: 135px auto 0;
  border-radius: 50%;
  background: var(--sub-red);
  color: #fff;
  content: "↓";
  place-items: center;
}

.works-filter {
  display: flex;
  flex-wrap: wrap;


}

.works-filter button {

  border: 1px solid #3c3c3c;
  border-radius: 999px;
  background: #fff;

  cursor: pointer;
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 600;
}

.works-filter button.is-active {


}

.works-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);

}

.works-card img {
  width: 100%;
  aspect-ratio: 1.25;
  object-fit: cover;
}

.works-card__category {
  margin: 25px 0 11px;
  color: var(--sub-red);
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 600;
}

.works-card h2 {

  line-height: 1.75;
}

.works-card__more {
  margin-top: 18px;
  border-bottom: 1px solid currentColor;
  font-family: var(--font-en);
  font-size: 11px;
}

.works-detail-main {
  padding: 100px 0 170px;
}

.works-detail-main__head {
  grid-template-columns: 1fr auto;
  align-items: end;
  margin-bottom: 55px;
  gap: 50px;
}

.works-detail-main__head h1 {

}

.works-detail-main__head p {
}

.works-tags {
  display: flex;
  flex-wrap: wrap;

}

.works-tags span {
  padding: 6px 15px;
  border: 1px solid var(--sub-line);
  border-radius: 30px;
  font-size: 11px;
}

.works-detail-main__visual {

  margin-bottom: 75px;

}

.works-detail-main__text {
  margin-bottom: 100px;
}

.works-detail-gallery {
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.works-detail-gallery img {
  width: 100%;
  aspect-ratio: 1.48;
  object-fit: cover;
}

.works-back {
  width: fit-content;


  border-bottom: 1px solid currentColor;
  font-size: 13px;
}

/* Recruit, Company, Contact, policy */
.recruit-main,
.company-main,
.contact-main,
.policy-main {
  padding: 110px 0 180px;
}

.recruit-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;


}

.recruit-tabs button {
  border: 0;
  background: transparent;

}

.recruit-tabs button.is-active {
}

.recruit-tab-panel[hidden] {
  display: none;
}

.recruit-block {
}

.recruit-block h2,
.policy-main h1,
.policy-main h2 {
  margin-bottom: 38px;
  font-size: 28px;
  font-weight: 600;
}

.recruit-block h3 {
  margin: 50px 0 22px;
  font-size: 18px;
}

.plain-list {
  display: grid;
  gap: 8px;
}

.data-table {
}

.data-table__row {
  display: grid;

  padding: 27px 0;
  border-bottom: 1px solid var(--sub-line);
}

.data-table dt {
  font-weight: 700;
}

.data-table dd {
  margin: 0;
}

.apply-button {


  margin-top: 45px;



  place-items: center;
}

.company-map {
  display: block;
  width: 100%;


  border: 0;
}

.company-group {
  margin-top: 55px;
  font-size: 24px;
}

.contact-choice {
  margin-bottom: 80px;
}

.contact-choice h1 {
  margin-bottom: 55px;
  font-size: 32px;
}

.contact-choice__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.contact-choice__grid a {
  position: relative;
  min-height: 170px;
  padding: 46px 55px 46px 0;
  border-bottom: 3px solid var(--sub-red);
}

.contact-choice__grid a::after {
  position: absolute;
  right: 0;
  bottom: 24px;
  display: grid;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid #999;
  background: #fff;
  color: #111;
  content: "↓";
  font-size: 13px;
  place-items: center;
}

.contact-choice__grid h2 {
  margin-bottom: 27px;
  font-size: 24px;
}

.contact-choice__grid p {
  font-size: 13px;
}

.contact-form-section {
  padding: 95px 0;
  border-top: 1px solid var(--sub-line);
}

.contact-form-section__en {
  color: var(--sub-red);
  font-family: var(--font-en);
  font-size: 14px;
}

.contact-form-section h2 {
  margin: 16px 0 30px;
  font-size: 34px;
}

.contact-form-section__intro {
  margin-bottom: 75px;
}

.form-row {
  display: grid;
  grid-template-columns: 260px 1fr;
  align-items: start;
  padding: 12px 0;
}

.form-row label,
.form-row__label {
  font-weight: 700;
}

.form-required {
  margin-left: 14px;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--sub-red);
  color: #fff;
  font-size: 11px;
}

.form-row input,
.form-row select,
.form-row textarea {
  width: 100%;
  min-height: 54px;
  padding: 12px 15px;
  border: 0;
  border-radius: 0;
  background: #f1f1f1;
  color: #222;
  font: inherit;
}

.form-row textarea {
  min-height: 190px;
  resize: vertical;
}

.contact-form__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 45px;
  gap: 48px;
}

.contact-consent {
  margin: 0;
}

.contact-consent label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.contact-consent input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.contact-checkbox {
  display: block;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  border: 0;
  background: #d9d9d9;
}

.contact-consent input:checked + .contact-checkbox {
  background: var(--sub-red) url("../img/common/check.svg") center / 14px 11px no-repeat;
}

.contact-consent input:focus-visible + .contact-checkbox {
  outline: 2px solid var(--sub-ink);
  outline-offset: 3px;
}

.contact-submit {
  display: inline-flex;
  min-width: 240px;
  height: 58px;
  padding-inline: 38px;
  align-items: center;
  justify-content: center;
  gap: 38px;
  border: 0;
  border-radius: 999px;
  background: var(--sub-red);
  color: #fff;
  cursor: pointer;
}

.contact-submit::after {
  width: 12px;
  height: 12px;
  background: url("../img/common/arrow_white.svg") center / contain no-repeat;
  content: "";
}

.form-row select,
.form-row input[type="file"],
.form-row input.input--short {
  width: 55%;
}

.policy-main h1 {
  font-size: 34px;
}

.policy-section {
}

.policy-section h2 {

}

.policy-main p {
  line-height: 2.15;
}

.policy-date {
  margin-top: 70px;
  text-align: right;
}

.policy-box {


}

/* Column */
.column-main {
  padding: 105px 0 170px;
}

.column-layout {
  display: grid;


}

.column-card {
  display: grid;

  padding: 0 0 55px;



}

.column-placeholder {
  aspect-ratio: 1.42;
  background: #eee;
}

.column-card time,
.column-detail__date {
  font-family: var(--font-en);
  font-size: 11px;
}

.column-card__category {

  font-size: 11px;
}

.column-card h2 {

  line-height: 1.7;
}

.column-card__text {
  line-height: 2;
}

.column-card__more {
  display: inline-block;

  border-bottom: 1px solid currentColor;
  font-family: var(--font-en);

}

.column-side h2 {
  margin-bottom: 35px;
  font-family: var(--font-en);
  font-size: 20px;
}

.column-side__topics li,
.column-side__archive li {
  padding: 15px 0;
  border-bottom: 1px solid var(--sub-line);
  font-size: 12px;
}

.column-side__archive {
  margin-top: 75px;
}

.column-side__archive .is-child {
  padding-left: 20px;
}

.pagination {
  justify-content: center;
  margin-top: 75px;

  font-family: var(--font-en);
  font-size: 12px;
}

.pagination a,
.pagination span {
  display: grid;
  width: 28px;
  height: 28px;
  background: #fff;
  color: #222;
  place-items: center;
}

.pagination .is-active {
  background: var(--sub-red);
  color: #fff;
}

.column-detail h1 {
  margin: 15px 0 20px;
  font-size: 38px;
  line-height: 1.5;
}

.column-detail__hero-image {
  margin-top: 58px;
  aspect-ratio: 1.63;
}

.column-detail__content {
  margin-top: 70px;
}

.column-detail__content h2,
.column-detail__content h3,
.column-detail__content h4,
.column-detail__content h5 {
  margin: 75px 0 30px;
  line-height: 1.6;
}

.column-detail__content h2 { font-size: 28px; }
.column-detail__content h3 { font-size: 24px; }
.column-detail__content h4 { font-size: 21px; }
.column-detail__content h5 { font-size: 18px; }

.column-detail__content p,
.column-detail__content li {
  font-size: 13px;
  line-height: 2.15;
}

.column-detail__content .column-placeholder {
  margin: 32px 0 55px;
}

.column-detail__content ul {
  list-style: disc;
  padding-left: 22px;
}

.column-table {
  width: 100%;
  margin-top: 70px;
  border-collapse: collapse;
}

.column-table th,
.column-table td {
  padding: 24px;
  border: 1px solid var(--sub-line);
  font-size: 12px;
  text-align: left;
}

.column-nav {
  display: flex;
  justify-content: center;
  margin-top: 90px;
  gap: 24px;
  font-size: 12px;
}

/* Customer harassment */
.harassment-main {
  padding: 110px 0 180px;
}

.harassment-section + .harassment-section {
  margin-top: 100px;
}

.harassment-section h1,
.harassment-section h2 {
  margin-bottom: 38px;
  font-size: 28px;
}

.harassment-section h3 {
  margin: 55px 0 18px;
  font-size: 17px;
}

.harassment-section p,
.harassment-section li {
  font-size: 14px;
  line-height: 2.15;
}

.harassment-list {
  display: grid;
  gap: 10px;
}

@media (max-width: 900px) {
  .sub-container,
  .sub-narrow {
    width: min(calc(100% - 48px), 100%);
  }

  .sub-hero__tagline {
    right: 0;
  }

  .about-intro {
    min-height: 0;
  }

  .about-intro__photo {
    position: static;
    width: 100%;
    height: 420px;
    margin-top: 55px;
    border-radius: 20px 0 0 20px;
  }

  .strength-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .strength-item + .strength-item {
    border-left: 0;
  }

  .strength-item:nth-child(even) {
    border-left: 1px solid var(--sub-line);
  }

  .strength-item:nth-child(n+3) {
    border-top: 1px solid var(--sub-line);
  }
}

@media (max-width: 767px) {
  .sub-container,
  .sub-narrow {
  }

  .sub-hero {
    height: 240px;
    padding-top: 120px;
  }

  .sub-hero::before {
    right: -16px;
    width: 80%;
  }

  .sub-hero::after {
    top: 180px;
  }

  .sub-hero__title {
    font-size: 42px;
  }

  .sub-hero__tagline {
    display: none;
  }

  .sub-hero__breadcrumb {
    top: 80px;
  }

  .sub-section,
  .about-intro,
  .about-values,
  .about-message,
  .service-intro,
  .service-flow,
  .service-strengths,
  .service-category,
  .works-main,
  .works-detail-main,
  .recruit-main,
  .company-main,
  .contact-main,
  .policy-main,
  .column-main,
  .harassment-main {
    padding-block: 80px;
  }

  .about-intro__copy,
  .about-philosophy,
  .about-message__grid,
  .service-intro__grid,
  .service-category__lead,
  .works-detail-main__head,
  .column-layout {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .about-intro__photo,
  .service-intro__photo {
    position: static;
    width: 100%;
    height: 420px;
    margin-top: 55px;
    margin-left: 0;
    border-radius: 20px 0 0 20px;
  }

  .about-intro {
    min-height: 0;
  }

  .about-intro .sub-display,
  .about-intro__copy .sub-lead {
    width: auto;
  }

  .about-intro__copy .sub-lead {
    margin-top: 45px;
  }

  .about-philosophy {
    min-height: 0;
    padding-block: 80px;
  }

  .about-philosophy__mark {
    margin-top: 55px;
  }

  .about-philosophy__body {
    min-height: 0;
    margin-top: 0;
    padding: 35px 0 0 !important;
    border-top: 1px solid var(--sub-line);
    border-left: 0;
  }

  .about-message {
    min-height: 0;
  }

  .about-message__grid > div {
    margin-top: 0;
  }

  .about-message__grid > * {
    min-width: 0;
  }

  .about-message__grid .sub-lead {
    overflow-wrap: anywhere;
  }

  .about-values__grid,
  .flow-list,
  .service-gallery,
  .works-grid,
  .contact-choice__grid {
    grid-template-columns: 1fr;
  }

  .about-value + .about-value {
    border-top: 0;
    border-left: 1px solid var(--sub-line);
  }

  .about-value,
  .flow-item {
    min-height: 350px;
  }

  .flow-item {
    min-height: 220px;
  }

  .about-value h3,
  .flow-item h3 {
    margin-top: 75px;
  }

  .flow-item h3 {
  }

  .service-category__lead,
  .service-category > .sub-container > .text-link {
  }

  .strength-list {
  }

  .strength-item:nth-child(even) {
    border-left: 0;
  }

  .strength-item + .strength-item {
    border-top: 1px solid var(--sub-line);
  }

  .common-contact {
    min-height: 520px;
    border-radius: 18px 18px 0 0;
  }

  .common-contact__inner {
    width: calc(100% - 40px);
  }

  .common-contact__label {
    font-size: 46px;
  }

  .common-contact__copy {
    position: static;
    width: auto;
    margin-top: 35px;
  }

  .common-contact__arrow {
    top: auto;
    right: 20px;
    bottom: 20px;
    width: 74px;
    height: 74px;
    transform: none;
  }

  .works-detail-gallery {
    grid-template-columns: 1fr;
  }

  .works-detail-main__head h1 {
    font-size: 34px;
  }

  .data-table__row,
  .form-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .form-row select,
  .form-row input[type="file"],
  .form-row input.input--short {
    width: 100%;
  }

  .contact-form__actions {
    flex-direction: column;
    gap: 28px;
  }

  .contact-submit {
    min-width: 220px;
  }

  .company-map {
  }

  .column-card {
  }

  .column-side {
    padding-top: 55px;
    border-top: 1px solid var(--sub-line);
  }
}

/* Design-comp alignment for inner pages */
.service-intro,
.service-flow,
.service-strengths,
.works-main,
.works-detail-main,
.recruit-main,
.company-main,
.policy-main,
.column-main {
  box-sizing: border-box;
}

.about-intro {
  min-height: clamp(650px, 54.2328vw, 820px);
  padding-block: clamp(105px, 10.2513vw, 155px) clamp(84px, 7.9365vw, 120px);
}

.about-intro .sub-display {
  width: min(51.8292vw, 680px);
  min-width: 510px;
}

.about-intro__copy .sub-lead {
  width: min(42.6829vw, 560px);
  min-width: 440px;
  margin-top: clamp(48px, 4.7619vw, 72px);
}

.about-intro__photo {
  top: clamp(250px, 21.164vw, 320px);
  right: calc(0px - var(--sub-gutter));
  height: clamp(310px, 27.1164vw, 410px);
  border-radius: clamp(24px, 2.381vw, 36px) 0 0 clamp(24px, 2.381vw, 36px);
}

.about-philosophy {
  min-height: clamp(700px, 57.8704vw, 875px);
  padding-block: clamp(88px, 8.4656vw, 128px) clamp(78px, 7.2751vw, 110px);
}

.about-philosophy__mark {
  margin-top: clamp(54px, 5.1587vw, 78px);
}

.about-philosophy__body {
  min-height: clamp(430px, 35.7143vw, 540px);
  margin-top: clamp(60px, 5.8201vw, 88px);
  padding-left: clamp(42px, 4.6296vw, 70px);
}

.about-values {
  padding-block: clamp(88px, 8.4656vw, 128px) clamp(92px, 8.9286vw, 135px);
}

.about-values__grid {
  margin-top: clamp(52px, 5.1587vw, 78px);
}

.about-value {
  min-height: clamp(350px, 27.7778vw, 420px);
  padding: clamp(24px, 1.8519vw, 28px) clamp(24px, 2.6455vw, 40px);
}

.about-value__no {
  font-size: clamp(38px, 3.1746vw, 48px);
}

.about-value h3 {
  margin-block: clamp(28px, 2.3148vw, 35px) clamp(26px, 2.381vw, 36px);
  font-size: clamp(29px, 2.5132vw, 38px);
}

.about-value__catch {
  font-size: clamp(15px, 1.1905vw, 18px);
}

.about-values__diagram {
  margin-top: clamp(50px, 4.7619vw, 72px);
}

.about-message {
  min-height: clamp(870px, 72.7513vw, 1100px);
  padding-block: clamp(88px, 8.4656vw, 128px) clamp(84px, 7.9365vw, 120px);
}

.about-message__grid {
  margin-top: clamp(72px, 6.9444vw, 105px);
  gap: clamp(54px, 6.6138vw, 100px);
}

.about-message__catch {
  font-size: clamp(26px, 2.2487vw, 34px);
}

.page-about-new .text-link::after,
.text-link::after {
  width: clamp(78px, 6.8783vw, 104px);
  height: clamp(78px, 6.8783vw, 104px);
  flex-basis: clamp(78px, 6.8783vw, 104px);
}

.service-intro {
  padding-block: clamp(110px, 12.5661vw, 190px) clamp(100px, 9.9206vw, 150px);
}

.service-intro .sub-display {
  font-size: clamp(32px, 2.6455vw, 40px);
}

.service-intro__grid {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .83fr);
  margin-bottom: clamp(52px, 4.9603vw, 75px);
  gap: clamp(54px, 6.6138vw, 100px);
}

.service-intro__photo {
  width: min(61.5%, 930px);
  height: clamp(300px, 27.1164vw, 410px);
  border-radius: clamp(24px, 2.381vw, 36px) 0 0 clamp(24px, 2.381vw, 36px);
}

.service-flow,
.service-strengths {
  padding-block: clamp(96px, 9.5899vw, 145px) clamp(108px, 10.9127vw, 165px);
}

.service-flow .sub-display {
  margin-bottom: clamp(24px, 2.381vw, 36px);
  font-size: clamp(30px, 2.7116vw, 41px);
  text-align: center;
}

.service-flow > .sub-container > .sub-lead {
  margin-inline: auto;
  text-align: center;
}

.flow-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(54px, 5.6217vw, 85px);


}

.flow-item {
  display: grid;
  grid-template-columns: 30px clamp(70px, 7.9365vw, 120px) minmax(0, 1fr);
  min-height: clamp(190px, 16.5344vw, 250px);
  align-items: center;
  padding: clamp(26px, 2.6455vw, 40px) clamp(36px, 3.3069vw, 50px) clamp(26px, 2.6455vw, 40px) 0;
  border: 0;
  border-top: 1px solid var(--sub-line);
  gap: clamp(16px, 1.9841vw, 30px);
}

.flow-item:nth-last-child(-n+2) {
  border-bottom: 1px solid var(--sub-line);
}

.flow-item__no {
  align-self: center;
  padding-top: 0;
  font-size: clamp(22px, 1.9841vw, 30px);
  line-height: 1;
}

.flow-item__icon {
  display: block;
  width: 100%;
  max-width: 120px;
  max-height: 105px;
  object-fit: contain;
}

.flow-item h3 {
  margin: 0 0 clamp(12px, 1.1905vw, 18px);
  font-size: clamp(16px, 1.3228vw, 20px);
}

.flow-item p:last-child {
  min-width: 0;
  font-size: clamp(12px, .8598vw, 13px);
  line-height: 2;
}

.flow-item::after {
  right: 4px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #777;
  border-right: 1px solid #777;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}

.strength-list {
  margin-top: clamp(54px, 5.6217vw, 85px);
}

.strength-item {
  display: flex;
  min-width: 0;
  min-height: clamp(320px, 26.7857vw, 405px);
  flex-direction: column;
  padding: clamp(26px, 2.3148vw, 35px) clamp(17px, 1.6534vw, 25px);
}

.strength-item__icon {
  order: 2;
  height: clamp(82px, 7.9365vw, 120px);
  margin: 0 auto;
  object-fit: contain;
}

.strength-item h3 {
  order: 1;
  margin: 0 0 clamp(24px, 2.3148vw, 35px);
  font-size: clamp(15px, 1.2566vw, 19px);
}

.strength-item p:last-child {
  order: 3;
  margin-top: clamp(20px, 1.8519vw, 28px);
  font-size: clamp(11px, .7937vw, 12px);
}

.service-category {
  padding-top: clamp(82px, 7.2751vw, 110px);
}

.service-category__lead {
  grid-template-columns: minmax(300px, 42%) minmax(0, 1fr);
  width: min(calc(100% - var(--sub-gutter) - var(--sub-gutter)), 1312px);
  margin-bottom: clamp(52px, 5.1587vw, 78px);
  gap: clamp(46px, 8vw, 122px);
}

.service-category__lead h2 {
  font-size: clamp(39px, 3.836vw, 58px);
  line-height: 1;
}

.service-gallery h3 {
  font-size: clamp(20px, 1.8519vw, 28px);
}

.service-gallery p {
  font-size: clamp(11px, .7937vw, 12px);
}

.service-category > .sub-container > .text-link {
  width: min(calc(100% - var(--sub-gutter)), 552px);
  min-height: clamp(110px, 9.5899vw, 145px);
  justify-content: space-between;
  margin: 0 var(--sub-gutter) 0 auto;
  gap: clamp(24px, 3.3069vw, 50px);
}

.service-category .text-link strong,
.service-category .text-link small {
  display: block;
}

.service-category .text-link strong {
  font-size: clamp(16px, 1.3228vw, 20px);
}

.service-category .text-link small {
  margin-top: 8px;
  font-family: var(--font-ja);
  font-size: clamp(10px, .7937vw, 12px);
}

.service-category > .sub-container > .text-link::after {
  width: clamp(78px, 6.8783vw, 104px);
  height: clamp(78px, 6.8783vw, 104px);
  flex-basis: clamp(78px, 6.8783vw, 104px);
  border-radius: 50%;
  background: var(--sub-red) url("../img/common/arrow_white.svg") center / 12px 12px no-repeat;
}

.works-main {
  padding-block: clamp(78px, 6.9444vw, 105px) clamp(110px, 11.2434vw, 170px);
}

.works-main::after {
  display: none;
}

.works-filter {

}

.works-filter button {



}

.works-filter button.is-active {


}

.works-grid {
  gap: clamp(56px, 5.8201vw, 88px) clamp(20px, 2.3148vw, 35px);
}

.works-card__category {
  margin-block: clamp(16px, 1.6534vw, 25px) 10px;
}

.works-card h2 {
  min-height: 0;
  font-size: clamp(14px, 1.0582vw, 16px);
}

.works-card__more {
  display: none;
}

.works-more {
  display: flex;
  width: fit-content;
  align-items: center;
  margin: clamp(80px, 8.9286vw, 135px) auto 0;
  border: 0;
  background: transparent;
  gap: 24px;
  font-family: var(--font-en);
  font-size: 14px;
  font-weight: 600;
}

.works-more i {
  display: block;
  width: clamp(78px, 6.8783vw, 104px);
  height: clamp(78px, 6.8783vw, 104px);
  border-radius: 50%;
  background: var(--sub-red) url("../img/common/arrow_white.svg") center / 12px 12px no-repeat;
  transform: rotate(90deg);
}

.works-detail-main {
  padding-block: clamp(80px, 6.6138vw, 100px) clamp(112px, 11.2434vw, 170px);
}

.works-detail-gallery {
  display: block;
}

.works-detail-main__visual {
  display: block;
  width: 100%;
  aspect-ratio: 1.5;
  max-height: none;
  margin: 0;
  object-fit: cover;
  opacity: 1;
  transition: opacity .22s ease;
}

.works-detail-main__visual.is-fading {
  opacity: 0;
}

.works-detail-thumbnails {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: clamp(16px, 1.5873vw, 24px);
  gap: clamp(8px, .7937vw, 12px);
}

.works-detail-thumbnails button {
  position: relative;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: #fff;
  cursor: pointer;
}

.works-detail-thumbnails button::after {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, .55);
  content: "";
  opacity: 0;
  transition: opacity .2s ease;
}

.works-detail-thumbnails button.is-active::after {
  opacity: 1;
}

.works-detail-thumbnails img {
  display: block;
  width: 100%;
  aspect-ratio: 1.5;
  object-fit: cover;
}

.works-detail-main__head {
  display: block;
  margin: clamp(72px, 7.2751vw, 110px) 0 0;
  padding-bottom: clamp(26px, 2.6455vw, 40px);
  border-bottom: 1px solid var(--sub-line);
}

.works-detail-main__head p {
  margin-bottom: 10px;
  font-size: clamp(12px, .9259vw, 14px);
}

.works-detail-main__head h1 {
  font-size: clamp(28px, 2.1164vw, 32px);
  line-height: 1.5;
}

.works-tags {
  padding-block: clamp(24px, 2.1164vw, 32px);
  border-bottom: 1px solid var(--sub-line);
}

.works-detail-main__text {
  margin: clamp(58px, 5.9524vw, 90px) 0 0;
}

.works-detail-main__text p + p {
  margin-top: 2.2em;
}

.works-back {
  display: flex;
  align-items: center;
  margin: clamp(80px, 7.9365vw, 120px) auto 0;
  padding-bottom: 10px;
  gap: 20px;
}

.works-back i {
  display: block;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--sub-red) url("../img/common/arrow_white.svg") center / 10px 10px no-repeat;
  transform: rotate(180deg);
}

.recruit-main,
.company-main,
.policy-main {
  padding-block: clamp(80px, 7.2751vw, 110px) clamp(115px, 11.9048vw, 180px);
}

.recruit-tabs {
  margin-bottom: clamp(62px, 6.2831vw, 95px);
}

.recruit-tabs button {
  padding: clamp(17px, 1.5873vw, 24px);
  color: #aaa;
  font-size: clamp(15px, 1.1905vw, 18px);
}

.recruit-tabs button.is-active {
  background: #111;

  border-bottom: 3px solid var(--sub-red);
}

.recruit-block {
  margin-bottom: clamp(76px, 7.6058vw, 115px);
}

.recruit-block h2 {
  display: flex;
  align-items: center;
  margin: clamp(50px, 5.291vw, 80px) 0 clamp(26px, 2.5132vw, 38px);
  gap: 24px;
  font-size: clamp(21px, 1.8519vw, 28px);
}

.recruit-block h2::after {
  height: 1px;
  flex: 1;
  background: var(--sub-line);
  content: "";
}

.recruit-block .sub-lead,
.recruit-block li,
.data-table__row {
  font-size: clamp(13px, .9259vw, 14px);
}

.recruit-main .sub-kicker {
  display: flex;
  align-items: center;
  color: #111;
  gap: 18px;
  font-size: clamp(23px, 1.9841vw, 30px);
  letter-spacing: 0;
}

.recruit-main .sub-kicker::before,
.recruit-block > h2::before {
  width: 34px;
  height: 2px;
  flex: 0 0 34px;
  background: var(--sub-red);
  content: "";
}

.recruit-block > h2::after {
  display: none;
}

.data-table__row {
  grid-template-columns: clamp(145px, 13.8889vw, 210px) 1fr;
  padding-block: clamp(20px, 1.7857vw, 27px);
  line-height: 2;
}

.apply-button {
  display: flex;
  width: fit-content;
  height: auto;
  align-items: center;
  margin: clamp(40px, 3.6376vw, 55px) auto 0;
  padding-bottom: 10px;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: #111;
  gap: 22px;
  font-size: clamp(16px, 1.1905vw, 18px);
  font-weight: 700;
}

.apply-button::after {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--sub-red) url("../img/common/arrow_white.svg") center / 10px 10px no-repeat;
  content: "";
}

.recruit-harassment__box {
  margin-top: clamp(30px, 3.3069vw, 50px);
  padding: clamp(28px, 3.3069vw, 50px);
  background: #f3f3f3;
}

.recruit-harassment__box h3:first-child {
  margin-top: 0;
}

.company-map {
  height: clamp(400px, 37.037vw, 560px);
  margin-top: clamp(75px, 7.9365vw, 120px);
  overflow: hidden;
  border-radius: clamp(18px, 1.5873vw, 24px);
}

.policy-main > h1 {
  display: flex;
  align-items: center;
  margin-bottom: clamp(44px, 4.3651vw, 66px);
  gap: clamp(18px, 1.9841vw, 30px);
  font-size: clamp(25px, 2.2487vw, 34px);
}

.policy-main > h1::after {
  height: 1px;
  flex: 1;
  background: linear-gradient(to right, var(--sub-red) 0 34%, var(--sub-line) 34% 100%);
  content: "";
}

.policy-section {
  margin-top: clamp(52px, 4.6296vw, 70px);
}

.policy-section h2 {
  margin-bottom: clamp(14px, 1.0582vw, 16px);
  font-size: clamp(17px, 1.3228vw, 20px);
}

.policy-main p {
  font-size: clamp(13px, .9259vw, 14px);
}

.policy-box {
  margin-top: clamp(38px, 3.6376vw, 55px);
  padding: clamp(24px, 2.3148vw, 35px);
  border: 0;
  background: #f3f3f3;
}

.column-main {
  padding-block: clamp(80px, 6.9444vw, 105px) clamp(112px, 11.2434vw, 170px);
}

.column-layout {
  grid-template-columns: minmax(0, 1fr) clamp(220px, 18.1878vw, 275px);
  gap: clamp(50px, 5.6217vw, 85px);
}

.column-card {
  grid-template-columns: clamp(220px, 18.5185vw, 280px) minmax(0, 1fr);
  grid-template-rows: auto auto auto 1fr auto;


  gap: 0 clamp(24px, 2.5132vw, 38px);
}

.column-card > div {
  display: contents;
}

.column-card time {
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 10px;
  color: var(--sub-red);
}

.column-card > .column-placeholder {
  grid-column: 1;
  grid-row: 2 / span 4;
}

.column-card__category {
  grid-column: 2;
  grid-row: 2;

  margin: 0 0 14px;

  border-radius: 999px;

  color: #222;
}

.column-card h2 {
  grid-column: 2;
  grid-row: 3;
  margin-bottom: clamp(12px, 1.3228vw, 20px);
  font-size: clamp(16px, 1.2566vw, 19px);
}

.column-card__text {
  grid-column: 2;
  grid-row: 4;
  font-size: clamp(11px, .7937vw, 12px);
}

.column-card__more {
  grid-column: 2;
  grid-row: 5;
  width: fit-content;
  margin-top: clamp(16px, 1.6534vw, 25px);
  padding: 8px 20px;
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font-size: 10px;
}

.column-side h2 {
  position: relative;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--sub-line);
}

.column-side h2::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 72px;
  height: 2px;
  background: var(--sub-red);
  content: "";
}

.column-side__topics,
.column-side__archive-list,
.column-side__archive-months {
  margin: 0;
  padding: 0;
  list-style: none;
}

.column-side__topics li,
.column-side__archive-list > .column-side__archive-item,
.column-side__archive-months li {
  position: relative;
  padding: 0;
}

.column-side__topics li,
.column-side__archive-list > .column-side__archive-item {
  border-bottom: 1px solid var(--sub-line);
}

.column-side__archive-months li {
  border-bottom: 0;
}

.column-side__topics li::after,
.column-side__archive li::after {
  display: none;
}

.column-side__topics a,
.column-side__archive-toggle {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  padding: 14px 36px 14px 0;
  color: #111;
  font-size: 12px;
  line-height: 1.65;
  text-align: left;
}

.column-side__archive-toggle {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}

.column-side__topics a::after,
.column-side__archive-toggle::after {
  position: absolute;
  top: 50%;
  right: 4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #111;
  content: "";
  transform: translateY(-50%);
}

.column-side__topics a::before,
.column-side__archive-toggle::before {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 12px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}

.column-side__archive-months {
  overflow: hidden;
}

.column-side__archive-months[hidden] {
  display: none;
}

.column-side__archive-months a {
  position: relative;
  display: block;
  padding: 10px 28px 10px 20px;
  color: #333;
  font-size: 12px;
}

.column-side__archive-months a::after {
  position: absolute;
  top: 50%;
  right: 7px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}

.pagination {
  gap: 10px;
}

.pagination a,
.pagination span {
  border: 1px solid var(--sub-line);
}

.pagination .is-active {
  border-color: var(--sub-red);
}

@media (min-width: 768px) and (max-width: 1100px) {
  .flow-item {
    grid-template-columns: 24px 70px minmax(0, 1fr);
    padding-right: 26px;
    gap: 12px;
  }

  .flow-item p br,
  .strength-item p br,
  .service-category__lead p br {
    display: none;
  }

  .column-layout {
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 40px;
  }

  .column-card {
    grid-template-columns: minmax(190px, 38%) minmax(0, 1fr);
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .about-intro,
  .about-philosophy,
  .about-message {
    min-height: 0;
  }

  .about-intro .sub-display,
  .about-intro__copy .sub-lead {
    width: auto;
    min-width: 0;
  }

  .about-intro__photo {
    height: auto;
    aspect-ratio: 1.45;
  }
}

@media (max-width: 767px) {
  .sub-container,
  .sub-narrow {
    width: calc(100% - 40px);
  }

  .service-intro__grid,
  .service-category__lead,
  .column-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .service-intro__photo {
    height: auto;
    aspect-ratio: 1.45;

  }

  .flow-list {
    grid-template-columns: 1fr;
  }

  .flow-item,
  .flow-item:nth-last-child(-n+2) {
    grid-template-columns: 26px 72px minmax(0, 1fr);
    min-height: 180px;
    padding: 24px 24px 24px 0;
    border-bottom: 0;
    gap: 12px;
  }

  .flow-item:last-child {
    border-bottom: 1px solid var(--sub-line);
  }

  .flow-item h3 {
    margin-top: 0;
  }

  .flow-item p br,
  .strength-item p br,
  .service-category__lead p br {
    display: none;
  }

  .strength-list {
    grid-template-columns: 1fr;
  }

  .strength-item {
    min-height: 310px;
    padding: 28px;
  }

  .strength-item__icon {
    height: 92px;
    margin-top: 28px;
  }

  .service-category__lead,
  .service-category > .sub-container > .text-link {
    width: calc(100% - 40px);
  }

  .service-gallery {
    grid-template-columns: 1fr;
  }

  .service-category > .sub-container > .text-link {
    min-height: 116px;
    margin-right: 20px;
  }

  .works-grid {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .works-detail-thumbnails {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .works-detail-main__head {
    margin-top: 60px;
  }

  .data-table__row {
    grid-template-columns: 1fr;
  }

  .recruit-block h2 {
    font-size: 21px;
  }

  .policy-main > h1 {

  }

  .policy-main > h1::after {
    width: 100%;
    flex: 0 0 1px;
  }

  .column-card {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .column-card > div {
    display: block;
  }

  .column-card time,
  .column-card > .column-placeholder,
  .column-card__category,
  .column-card h2,
  .column-card__text,
  .column-card__more {
    grid-column: auto;
    grid-row: auto;
  }

  .column-card > .column-placeholder {
    margin-bottom: 22px;
  }

  .column-card__category {
    margin-bottom: 14px;
  }

  .company-map {
    height: 420px;
  }
}

/* Inner-page refinements */
.sub-hero__breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0;
}

.sub-hero__breadcrumb li {
  display: inline-flex;
  align-items: center;
}

.sub-hero__breadcrumb li + li::before {
  margin-inline: 8px;
  content: "/";
}

.sub-hero__breadcrumb a {
  transition: opacity .2s ease;
}

@media (hover: hover) {
  .sub-hero__breadcrumb a:hover {
    opacity: .55;
  }
}

/* Service */
@media (min-width: 768px) {
  .service-intro {
    position: relative;
    min-height: clamp(650px, 50.2646vw, 760px);
    padding-block: clamp(108px, 9.9206vw, 150px);
  }

  .service-intro__grid {
    display: block;
    width: min(42%, 552px);
    margin: 0;
  }

  .service-intro__grid .sub-lead {
    margin-top: clamp(42px, 3.9683vw, 60px);
  }

  .service-intro__photo {
    position: absolute;
    top: clamp(225px, 18.5185vw, 280px);
    right: calc(0px - var(--sub-gutter));
    width: min(50vw, 760px);
    height: auto;
    aspect-ratio: 1.5;
    margin: 0;
    object-fit: cover;
  }
}

.service-flow .sub-kicker,
.service-strengths .sub-kicker {
  position: relative;
  display: block;
  padding-left: 25px;
  color: #000;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  text-transform: uppercase;
}

.service-flow .sub-kicker::before,
.service-strengths .sub-kicker::before {
  position: absolute;
  top: .55em;
  left: 0;
  width: 13px;
  height: 5px;
  border-radius: 999px;
  background: #000;
  content: "";
}

.service-flow .sub-kicker span,
.service-strengths .sub-kicker span {
  display: block;
  margin: 6px 0 0;
  color: #000;
  font-size: clamp(24px, 2.381vw, 36px);
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: none;
}

.flow-list {
  border: 0;
  column-gap: clamp(40px, 5.291vw, 80px);
}

.flow-item {
  border-right: 0;
  border-color: #cfcfcf;
}

.flow-item__no {
  color: #111;
  font-weight: 600;
}

.strength-list {
  align-items: stretch;
  border: 0;
  gap: clamp(18px, 2.2487vw, 34px);
}

.strength-item,
.strength-item + .strength-item {
  min-height: clamp(300px, 24.4709vw, 370px);
  padding-inline: 0;
  border: 0;
  text-align: center;
}

.strength-item__icon {
  width: min(100%, 132px);
}

.strength-item h3 {
  margin-top: 0;
}

.service-category__lead h2 {
  position: relative;
  padding-left: 24px;
  font-weight: 700;
}

.service-category__lead h2::before {
  position: absolute;
  top: .5em;
  left: 0;
  width: 13px;
  height: 5px;
  border-radius: 999px;
  background: #000;
  content: "";
  transform: translateY(-50%);
}

.service-category__lead h2 span {
  margin-top: 4px;
  font-size: clamp(24px, 2.381vw, 36px);
  font-weight: 700;
  line-height: 1.35;
}

.service-gallery article::after {
  z-index: 1;
  background: rgba(0, 0, 0, .38);
}

/* Works */
.works-filter {
  padding-bottom: clamp(32px, 3.1746vw, 48px);
  margin-bottom: clamp(62px, 6.6138vw, 100px);
  border-bottom: 1px solid var(--sub-line);
  gap: 10px 12px;
}

.works-filter button {
  min-width: 80px;
  min-height: 30px;
  padding: 5px 16px;
  border-color: #c8c8c8;
  color: #777;
  line-height: 1.3;
}

.works-filter button.is-active {
  border-color: #111;
  background: #111;
  color: #fff;
}

.works-tags {
  gap: 8px 22px;
}

.works-tags a {
  display: inline-block;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #999;
  font-size: 11px;
  line-height: 1.8;
}

/* Column */
.column-card {
  padding-bottom: 0;
  margin-bottom: clamp(70px, 6.6138vw, 100px);
  border-bottom: 0;
}

.column-card__category {
  display: flex;
  width: auto;
  flex-wrap: wrap;
  padding: 0;
  background: transparent;
  gap: 7px;
}

.column-card__category a {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  background: #f8e3e2;
  color: var(--sub-red);
  line-height: 1.4;
}

.column-card__more {
  justify-self: end;
  margin-left: auto;
}

.pagination {
  display: block;
}

.pagination .nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.pagination .page-numbers {
  position: relative;
  display: grid;
  width: 32px;
  height: 32px;
  border: 1px solid var(--sub-line);
  background: #fff;
  color: #222;
  place-items: center;
}

.pagination .page-numbers.current {
  border-color: var(--sub-red);
  background: var(--sub-red);
  color: #fff;
}

.pagination .prev::before,
.pagination .next::before {
  width: 7px;
  height: 7px;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  content: "";
}

.pagination .prev::before {
  transform: rotate(-135deg);
}

.pagination .next::before {
  transform: rotate(45deg);
}

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

.column-detail > h1,
.column-detail__content h2,
.column-detail__content h3 {
  position: relative;
  padding-bottom: clamp(16px, 1.5873vw, 24px);
  border-bottom: 1px solid var(--sub-line);
}

.column-detail > h1::after,
.column-detail__content h2::after,
.column-detail__content h3::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: clamp(90px, 11.2434vw, 170px);
  height: 2px;
  background: var(--sub-red);
  content: "";
}

/* Recruit */
.recruit-tabs {
  position: relative;
  border-bottom: 1px solid var(--sub-line);
}

.recruit-tabs button,
.recruit-tabs button.is-active {
  position: relative;
  border: 0;
  background: transparent;
  color: #999;
  font-weight: 500;
}

.recruit-tabs button.is-active {
  color: #111;
}

.recruit-tabs button.is-active::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  background: var(--sub-red);
  content: "";
}

.recruit-tab-panel > h2 {
  display: flex;
  align-items: center;
  margin-block: clamp(48px, 4.6296vw, 70px) clamp(24px, 2.1164vw, 32px);
  gap: 22px;
  font-size: clamp(18px, 1.3228vw, 20px);
}

.recruit-tab-panel > h2::before {
  display: none;
}

.recruit-tab-panel > h2::after {
  display: block;
  height: 1px;
  flex: 1;
  background: var(--sub-line);
  content: "";
}

.recruit-main > .recruit-block:not(.recruit-tab-panel) > h2,
.recruit-main .sub-kicker {
  display: flex;
  align-items: center;
  color: #111;
  gap: 18px;
  font-size: clamp(23px, 1.9841vw, 30px);
  letter-spacing: 0;
}

.recruit-main > .recruit-block:not(.recruit-tab-panel) > h2::before,
.recruit-main .sub-kicker::before {
  display: block;
  width: 14px;
  height: 6px;
  flex: 0 0 14px;
  border-radius: 999px;
  background: var(--sub-red);
  content: "";
}

.recruit-main > .recruit-block:not(.recruit-tab-panel) > h2::after {
  display: none;
}

.data-table {
  border-top: 0;
}

.recruit-main .sub-kicker + .data-table {
  margin-top: clamp(26px, 2.5132vw, 38px);
}

.recruit-harassment__contact {
  margin-top: clamp(24px, 2.1164vw, 32px);
  padding: clamp(18px, 1.8519vw, 28px) clamp(20px, 2.381vw, 36px);
  border-radius: 14px;
  background: #fff;
  font-size: clamp(12px, .9259vw, 14px);
  line-height: 2;
}

.recruit-harassment__contact a {
  color: var(--sub-red);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Policy */
.policy-main > h1,
.harassment-section > h1 {
  position: relative;
  display: block;
  padding-bottom: clamp(20px, 1.9841vw, 30px);
  border-bottom: 1px solid var(--sub-line);
}

.policy-main > h1::after,
.harassment-section > h1::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: clamp(180px, 19.8413vw, 300px);
  height: 2px;
  background: var(--sub-red);
  content: "";
}

@media (max-width: 767px) {
  .sub-container,
  .sub-narrow {
    width: calc(100% - 40px);
  }

  .sub-section,
  .about-intro,
  .about-values,
  .about-message,
  .service-intro,
  .service-flow,
  .service-strengths,
  .service-category,
  .works-main,
  .works-detail-main,
  .recruit-main,
  .company-main,
  .contact-main,
  .policy-main,
  .column-main,
  .harassment-main {
    padding-block: 80px;
  }

  .about-intro,
  .about-philosophy,
  .about-message {
    min-height: 0;
  }

  .about-intro__copy,
  .about-philosophy,
  .about-message__grid,
  .service-category__lead,
  .works-detail-main__head,
  .column-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 42px;
  }

  .about-intro .sub-display,
  .about-intro__copy .sub-lead {
    width: 100%;
    min-width: 0;
  }

  .about-intro__copy .sub-lead {
    margin-top: 45px;
  }

  .about-intro__photo {
    position: static;
    top: auto;
    right: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 1.45;
    margin: 55px 0 0;
    border-radius: 20px 0 0 20px;
  }

  .about-philosophy {
    padding-block: 80px;
  }

  .about-philosophy__mark,
  .about-values__grid,
  .about-message__grid {
    margin-top: 55px;
  }

  .about-philosophy__body {
    min-height: 0;
    margin-top: 0;
    padding: 35px 0 0;
    border-top: 1px solid var(--sub-line);
    border-left: 0;
  }

  .about-values__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-value {
    min-height: 350px;
    padding: 28px 24px;
  }

  .about-value + .about-value {
    border-top: 0;
    border-left: 1px solid var(--sub-line);
  }

  .about-message__grid > div {
    margin-top: 0;
  }

  .about-message__grid > * {
    min-width: 0;
  }

  .about-message__grid .sub-lead {
    overflow-wrap: anywhere;
  }

  .service-intro__grid {
    display: block;
    margin-bottom: 0;
    gap: 0;
  }

  .service-intro__grid .sub-lead {
    margin-top: 34px;
  }

  .service-intro__photo {
    position: static;
    top: auto;
    right: auto;
    width: calc(100% + 20px);
    height: auto;
    aspect-ratio: 1.45;
    margin: 46px -20px 0 0;
    border-radius: 20px 0 0 20px;
  }

  .service-flow .sub-display {
    margin-bottom: 24px;
    font-size: 30px;
  }

  .flow-list {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 54px;
  }

  .flow-item,
  .flow-item:nth-last-child(-n+2) {
    grid-template-columns: 26px 72px minmax(0, 1fr);
    min-height: 180px;
    padding: 24px 24px 24px 0;
    border-bottom: 0;
    gap: 12px;
  }

  .flow-item:last-child {
    border-bottom: 1px solid var(--sub-line);
  }

  .flow-item__icon {
    max-width: 72px;
    max-height: 82px;
  }

  .flow-item h3 {
    margin-top: 0;
  }

  .flow-item p br,
  .strength-item p br,
  .service-category__lead p br {
    display: none;
  }

  .strength-list {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 54px;
    gap: 0;
  }

  .strength-item,
  .strength-item + .strength-item,
  .strength-item:nth-child(n+3) {
    min-height: 310px;
    padding: 28px;
    border: 0;
    border-bottom: 1px solid var(--sub-line);
  }

  .strength-item__icon {
    width: min(100%, 132px);
    height: 92px;
    margin-top: 0;
  }

  .service-category {
    padding-top: 80px;
  }

  .service-category__lead {
    width: calc(100% - 40px);
    margin-bottom: 52px;
    gap: 32px;
  }

  .service-category__lead h2 {
    padding-left: 20px;
    font-size: 39px;
  }

  .service-gallery {
    grid-template-columns: minmax(0, 1fr);
  }

  .service-category > .sub-container > .text-link {
    width: calc(100% - 40px);
    min-height: 116px;
    margin: 0 20px 0 auto;
  }

  .works-filter {
    margin-bottom: 56px;
  }

  .works-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 52px;
  }

  .works-detail-thumbnails {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .works-detail-main__head {
    margin-top: 60px;
  }

  .data-table__row,
  .form-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .form-row select,
  .form-row input[type="file"],
  .form-row input.input--short {
    width: 100%;
  }

  .contact-choice__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .contact-form__actions {
    flex-direction: column;
    gap: 28px;
  }

  .company-map {
    height: 420px;
  }

  .column-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .column-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .column-card > div {
    display: block;
  }

  .column-card time,
  .column-card > .column-placeholder,
  .column-card__category,
  .column-card h2,
  .column-card__text,
  .column-card__more {
    grid-column: auto;
    grid-row: auto;
  }

  .column-card > .column-placeholder {
    margin-bottom: 22px;
  }

  .column-card__category {
    margin-bottom: 14px;
  }

  .column-card__more {
    margin-left: auto;
  }

  .column-side {
    padding-top: 55px;
    border-top: 1px solid var(--sub-line);
  }

  .pagination .nav-links {
    gap: 7px;
  }

  .recruit-tabs button {
    padding-inline: 8px;
  }

  .recruit-harassment__contact {
    overflow-wrap: anywhere;
  }

  .policy-main > h1 {
    display: block;
  }

  .policy-main > h1::after {
    width: 100%;
    flex: none;
  }
}

/* WordPress */
.common-contact { background-image: url("../img/common/contact.webp"); }
.information-item__inner { color: inherit; text-decoration: none; }
.information-list[hidden] { display: none; }
.works-filter a { display: inline-flex; min-width: 80px; min-height: 30px; align-items: center; justify-content: center; padding: 5px 16px; border: 1px solid #c8c8c8; border-radius: 999px; background: #fff; color: #777; font-family: var(--font-en); font-size: 12px; font-weight: 600; line-height: 1.3; text-decoration: none; }
.works-filter a.is-active { border-color: #111; background: #111; color: #fff; }
.works-card > a { display: block; color: inherit; text-decoration: none; }
.works-tags span { display: inline-block; padding: 0; border: 0; border-radius: 0; color: #999; font-size: 11px; line-height: 1.8; }
.works-detail-main__meta { display: grid; margin-top: clamp(58px, 5.9524vw, 90px); padding-top: clamp(24px, 2.6455vw, 40px); border-top: 1px solid var(--sub-line); gap: 22px; }
.works-detail-main__meta p { display: grid; grid-template-columns: minmax(130px, 190px) 1fr; margin: 0; gap: 20px; }
.works-detail-main__meta strong { font-family: var(--font-en); font-size: 12px; letter-spacing: .08em; }
.works-detail-main__meta video, .works-detail-main__youtube, .works-detail-main__youtube iframe { width: 100%; }
.works-detail-main__youtube iframe { aspect-ratio: 16 / 9; height: auto; border: 0; }
.form-row > p { display: contents; }
.form-row .wpcf7-form-control-wrap { display: block; min-width: 0; }
.contact-form__actions > p { margin: 0; }
.contact-consent .wpcf7-list-item { margin: 0; }
.contact-consent .wpcf7-list-item-label { display: inline-flex; align-items: center; gap: 8px; }
.contact-consent .wpcf7-list-item-label::before { display: block; width: 20px; height: 20px; flex: 0 0 auto; background: #d9d9d9; content: ""; }
.contact-consent input:checked + .wpcf7-list-item-label::before { background: var(--sub-red) url("../img/common/check.svg") center / 14px 11px no-repeat; }
.contact-consent input:focus-visible + .wpcf7-list-item-label::before { outline: 2px solid var(--sub-ink); outline-offset: 3px; }
.contact-form__actions > p:last-of-type { position: relative; }
.contact-submit.wpcf7-submit { padding: 0 68px 0 38px; background-color: var(--sub-red); background-image: url("../img/common/arrow_white.svg"); background-position: calc(100% - 38px) center; background-repeat: no-repeat; background-size: 12px 12px; font: inherit; }
.wpcf7-spinner { position: absolute; }
@media (max-width: 767px) { .works-detail-main__meta p { grid-template-columns: minmax(0, 1fr); gap: 8px; } }
@media (max-width: 900px) { .site-header__toggle { display: flex !important; } }
.works-more { cursor: pointer; }
.works-more > * { pointer-events: none; }
.works-more.is-loading { cursor: progress; }
.works-more.is-loading i { position: relative; background: var(--sub-red); transform: none; }
.works-more.is-loading i::after { position: absolute; inset: 50% auto auto 50%; width: 22px; height: 22px; border: 2px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%; content: ""; transform: translate(-50%, -50%); animation: works-loading .7s linear infinite; }
@keyframes works-loading { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* Contact privacy notice */
.contact-privacy-notice { max-height: 340px; margin-top: 44px; padding: clamp(22px, 2.1164vw, 32px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--sub-line); background: #fff; color: var(--sub-ink); font-size: clamp(12px, .8598vw, 13px); line-height: 1.9; scrollbar-gutter: stable; }
.contact-privacy-notice:focus-visible { outline: 2px solid var(--sub-ink); outline-offset: 3px; }
.contact-privacy-notice h3 { margin: 0 0 28px; font-size: clamp(16px, 1.1905vw, 18px); text-align: center; }
.contact-privacy-notice h4 { margin: 26px 0 8px; font-size: inherit; font-weight: 700; line-height: inherit; }
.contact-privacy-notice p { margin: 0; }
.contact-privacy-notice table { width: 100%; margin-top: 12px; border-collapse: collapse; font-size: inherit; line-height: inherit; }
.contact-privacy-notice th, .contact-privacy-notice td { padding: 10px 12px; border: 1px solid var(--sub-line); text-align: left; vertical-align: top; }
.contact-privacy-notice th { width: 25%; font-weight: 700; }
.contact-privacy-notice + .contact-form__actions { margin-top: 28px; }

/* Privacy handling details */
.policy-handling { margin-top: clamp(70px, 7.2751vw, 110px); padding-top: clamp(52px, 5.291vw, 80px); border-top: 1px solid var(--sub-line); }
.policy-handling > h2 { margin-bottom: clamp(28px, 2.6455vw, 40px); font-size: clamp(22px, 1.9841vw, 30px); }
.policy-handling__section { margin-top: clamp(34px, 3.3069vw, 50px); }
.policy-handling__section h3 { margin: 0 0 12px; font-size: clamp(15px, 1.1243vw, 17px); line-height: 1.7; }
.policy-handling ul { margin: 12px 0 0; padding-left: 1.5em; font-size: clamp(13px, .9259vw, 14px); line-height: 2.15; }
.policy-handling ul ul { margin-top: 2px; }
.policy-handling__date { margin-top: clamp(38px, 3.6376vw, 55px); text-align: right; }
.policy-handling__table { width: 100%; margin-top: 20px; border-collapse: collapse; font-size: clamp(13px, .9259vw, 14px); line-height: 1.8; }
.policy-handling__table th, .policy-handling__table td { padding: 12px 16px; border: 1px solid var(--sub-line); text-align: left; vertical-align: top; }
.policy-handling__table th { width: 24%; font-weight: 700; }

@media (max-width: 767px) { .about-message__sign { width: 66.6667%; max-width: 277px; margin-right: 0; margin-left: auto; } .contact-privacy-notice { max-height: 300px; padding: 20px 16px; } .contact-privacy-notice th, .contact-privacy-notice td, .policy-handling__table th, .policy-handling__table td { display: block; width: 100%; } .contact-privacy-notice td, .policy-handling__table td { border-top: 0; } .contact-form__actions { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 140px; gap: 14px; } .contact-form__actions > p { min-width: 0; } .contact-form__actions > p:last-child { width: 140px; } .contact-consent { min-width: 0; font-size: 11px; } .contact-submit { width: 140px; min-width: 0; height: 50px; padding-inline: 22px; } .contact-submit.wpcf7-submit { width: 140px; min-width: 0; padding: 0 48px 0 22px; background-position: calc(100% - 22px) center; } }