@charset "UTF-8";

/* サービスページの画面幅まわりの調整。
   chrome.css は生成物なので、手で足す分はこちらに書く。 */

/* 重なって止まるカードの中身が、固定ヘッダーの下に潜って読めなくなっていた */
.home-job-list__in {
  padding-top: calc(var(--_card-px) + var(--mh--header--height));
}


/* サービス詳細ページ */

/* 一覧側のカードに入れた余白は、詳細ページには要らない */
.is-service-detail .home-job-list__in {
  padding-top: 0;
}

/* 他のサービスへの導線。スライダーではなく並べるだけにした */
.c-service-next-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--mh--space--xs, 1.25rem);
}

.c-service-next-btn {
  margin-top: clamp(2rem, 1rem + 3vw, 3.5rem);
  display: flex;
  justify-content: center;
}

@media print, screen and (min-width: 48em) {
  .c-service-next-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* カテゴリにぶら下がる個別サービスの一覧。
   項目を足していくことが前提なので、枠は数に依存しない作りにしている。 */

.c-service-menu-sec {
  padding-block: clamp(3rem, 2rem + 5vw, 7rem);
}

.c-service-menu-sec__head {
  margin-bottom: 1.25em;
}

.c-service-menu-sec__lead {
  max-width: 44rem;
  line-height: 2;
}

.c-service-menu {
  list-style: none;
  margin: clamp(2rem, 1rem + 3vw, 3.5rem) 0 0;
  padding: 0;
  display: grid;
  gap: 1px;
  background-color: rgba(15, 15, 15, 0.12);
  border: 1px solid rgba(15, 15, 15, 0.12);
}

.c-service-menu__item {
  background-color: #fff;
  padding: clamp(1.25rem, 1rem + 1vw, 2rem);
  display: flex;
  flex-direction: column;
  gap: 0.6em;
}

.c-service-menu__no {
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  opacity: 0.55;
}

.c-service-menu__ttl {
  font-size: clamp(1rem, 0.94rem + 0.3vw, 1.1875rem);
  font-weight: 700;
  line-height: 1.5;
}

.c-service-menu__txt {
  font-size: 1.0625rem;
  line-height: 1.9;
  flex-grow: 1;
}

.c-service-menu__tags {
  margin-top: 0.2em;
}

.c-service-menu-sec__note {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  font-size: 1.0625rem;
  opacity: 0.75;
}

@media print, screen and (min-width: 48em) {
  .c-service-menu {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 80em) {
  .c-service-menu {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 左のレール。トップと同じものをサービス側にも出す。 */

:root {
  --rail-w: max(80px, min(6vw, 96px));
}

/* 狭い画面はレールを上のバーに戻すので、テーマ側のヘッダーと二重になる。
   その幅ではレール側を出し、テーマ側を引っ込める */
@media screen and (max-width: 47.9375em) {
  .l-header {
    display: none;
  }
}

@media print, screen and (min-width: 48em) {
  /* 装飾が画面の外まで伸びる作りなので、横だけ切る。
     clip なら中の position:sticky が死なない */
  html,
  body {
    overflow-x: clip;
  }
  .l-header {
    left: var(--rail-w);
    width: calc(100% - var(--rail-w));
  }
  .l-main-img,
  .l-interview-img,
  .l-container,
  .c-service-menu-sec,
  .cta_section,
  .footer {
    margin-left: var(--rail-w);
    width: calc(100% - var(--rail-w));
  }
  /* レールのぶん狭くなるので、画面幅を基準にした余白を取り直す */
  .footer .cont--inner {
    margin-left: 0 !important;
  }
  .promo-stack {
    margin-left: calc(var(--rail-w) / 2);
  }
}

/* 実績の一覧ページ */

.c-works-archive {
  padding-block: clamp(3rem, 2rem + 5vw, 7rem);
}

.c-works-archive__lead {
  line-height: 2;
  margin-bottom: clamp(2rem, 1rem + 3vw, 3.5rem);
}

/* ヘッダーだけのヒーロー。写真が無いぶん詰める */
.l-interview-img.is-archive {
  padding-bottom: 0;
}

.l-interview-img.is-archive .l-interview-img__hero,
.l-interview-img.is-archive .l-interview-img__profile {
  display: none;
}

/* セクション3の下のページ。テーマの部品をそのまま使うが、
   WordPress 側で付く余白が無いので最低限だけ足す。 */

.c-s3-sec {
  padding-block: clamp(3rem, 2rem + 5vw, 7rem);
}

.c-s3-sec__head {
  margin-bottom: 1.2em;
}

.c-s3-sec__head.has-mt {
  margin-top: clamp(3.5rem, 2rem + 5vw, 6rem);
}

.c-s3-sec__lead {
  line-height: 2;
  max-width: 48rem;
  margin-bottom: clamp(2rem, 1rem + 3vw, 3.5rem);
}

.c-recommend {
  padding-block: clamp(3rem, 2rem + 4vw, 6rem);
}

.c-recommend__inner > .c-en-hgroup {
  margin-bottom: 1.5em;
}

/* 年表のページは濃い背景の上に置くので、文字を明るくする */
.c-bg-decoration-cover.c-s3-sec {
  color: var(--mh--color--grayscale-300);
}

.c-bg-decoration-cover.c-s3-sec .u-inner {
  position: relative;
  z-index: 1;
}

.c-bg-decoration-cover.c-s3-sec :where(h2, h3, p) {
  color: inherit;
}

.c-bg-decoration-cover.c-s3-sec .c-history__label {
  color: var(--mh--color--grayscale-900);
  background-color: var(--mh--color--grayscale-300);
}

/* c-grid-card は濃い背景の上で使う部品。明るい面に置くので色を戻す */
.c-s3-sec .c-grid-card,
.c-s3-sec .c-grid-card-in {
  color: var(--mh--color--grayscale-900);
  background-color: #fff;
  border: 1px solid rgba(15, 15, 15, 0.12);
}

.c-s3-sec .c-grid-card :where(h3, p) {
  color: inherit;
}

/* /about/ 型のページ。WordPress 側で付く余白が無いので足す */
.c-s3-head {
  font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2.4rem);
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 1em;
}

.c-s3-subhead {
  font-size: clamp(1.15rem, 1rem + 0.8vw, 1.6rem);
  font-weight: 700;
  margin-top: clamp(3rem, 2rem + 4vw, 5rem);
  margin-bottom: 0.8em;
}

.c-s3-sec p {
  line-height: 2;
}

.c-s3-sec p + p {
  margin-top: 1em;
}

.c-s3-lead {
  margin-bottom: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.c-s3-policy {
  display: grid;
  gap: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.c-s3-policy__item h3 {
  font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.35rem);
  font-weight: 700;
  margin-bottom: 0.6em;
  padding-left: 0.7em;
  border-left: 3px solid currentcolor;
}

.c-s3-sec .c-card-list,
.c-s3-sec .c-simple-card-list {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.c-s3-sec .c-data {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

@media print, screen and (min-width: 48em) {
  .c-s3-policy {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* /about/ 型のページ。テーマが WordPress 側の指定を前提にしているので、
   左寄せと余白だけ補う。 */
.about-intro .c-hgroup,
.about-field .c-hgroup,
.about-philosophy .c-en-hgroup {
  align-items: flex-start;
  text-align: left;
}

.about-intro__inner > p,
.about-field__inner > p {
  line-height: 2;
}

.about-field__inner .c-card-list,
.about-field__inner .c-simple-card-list,
.about-field__inner .c-data {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

/* /welfare/ /history/ 型のページ。WordPress 側の指定が無いぶんだけ補う */
.welfare-group .c-hgroup,
.welfare-uniform .c-hgroup {
  align-items: center;
}

.welfare-culture .c-hgroup,
.welfare-safety .c-hgroup,
.welfare-other .c-hgroup,
.history-message .c-hgroup {
  align-items: flex-start;
  text-align: left;
}

.welfare-group__inner p,
.welfare-uniform p,
.history-message p,
.history-section__lead,
.history-future p {
  line-height: 2;
}

.welfare-safety .c-grid-card-list,
.welfare-other .c-simple-card-list {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.history-section__lead {
  margin-top: 0.6em;
}

.history-section__inner .c-history-list {
  margin-top: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.history-future h2 {
  font-size: clamp(1.3rem, 1.05rem + 1.2vw, 2.1rem);
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 0.8em;
}

/* 濃い面に白文字を重ねる部品。読める濃さまで下げる */
.welfare-other .c-grid-card,
.welfare-other .c-grid-card-in {
  background-color: rgba(9, 20, 33, 0.62);
  border-color: rgba(255, 255, 255, 0.24);
}

/* 注記の文字が薄く、淡い面の上で読みにくかった。濃い面の注記はそのまま */
.c-data__note,
.c-note01,
.welfare-safety p.has-grayscale-700-color,
.welfare-other p.has-grayscale-700-color,
.welfare-group p.has-grayscale-700-color {
  color: #3f5570 !important;
}

/* 締めの節。文章が横に並んで重なるので縦に積む */
.is-service-detail .history-future__inner .wp-block-group-is-layout-flex:not(.c-loopslider__slider) {
  flex-direction: column;
  align-items: center;
  row-gap: clamp(1rem, 0.6rem + 1.4vw, 2rem);
}

.is-service-detail .history-future p {
  text-align: center;
}

/* サービス配下のページを行き来するための一覧 */
.c-service-nav {
  padding-block: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
  color: #e8f1f8;
  background-color: #0f2238;
}

.c-service-nav__inner {
  width: min(100% - 2.5rem, 1100px);
  margin-inline: auto;
}

.c-service-nav__head {
  display: flex;
  align-items: baseline;
  gap: 1em;
  margin-bottom: clamp(1.4rem, 1rem + 1.6vw, 2.4rem);
  padding-bottom: 0.7em;
  border-bottom: 1px solid rgba(232, 241, 248, 0.28);
}

.c-service-nav__head-en {
  font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2.1rem);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.c-service-nav__head-link {
  font-size: 0.95rem;
  color: inherit;
  text-decoration: none;
}

.c-service-nav__groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: clamp(1.6rem, 1rem + 2vw, 2.8rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.c-service-nav__group-head {
  display: flex;
  flex-direction: column;
  gap: 0.3em;
  margin-bottom: 0.9em;
}

.c-service-nav__group-en {
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  color: #6fc3f2;
}

.c-service-nav__group-link {
  font-size: clamp(1rem, 0.92rem + 0.3vw, 1.15rem);
  font-weight: 700;
  color: inherit;
  text-decoration: none;
}

.c-service-nav__list {
  display: grid;
  gap: 0.6em;
  margin: 0;
  padding-top: 0.9em;
  padding-left: 0;
  list-style: none;
  border-top: 1px solid rgba(232, 241, 248, 0.18);
}

.c-service-nav__item {
  margin: 0;
}

.c-service-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
  font-size: 0.92rem;
  line-height: 1.7;
  color: #cfe2f2;
  text-decoration: none;
}

.c-service-nav__link::before {
  flex-shrink: 0;
  width: 0.7em;
  height: 1px;
  content: "";
  background-color: #6fc3f2;
}

.c-service-nav a:hover {
  text-decoration: underline;
}

.c-service-nav .is-current {
  font-weight: 700;
  color: #fff;
}

/* カードの小さな添え字が薄く、淡い面の上で読みにくかった */
.c-interview-archive01__item .c-interview-archive01__item-info-group,
.c-interview-archive01__item.has-line .c-interview-archive01__item-info-group {
  color: #3f5570;
}

/* 3つめのセクションの背景。元は blur(25px) で、何の写真か分からなくなっていた */
.home-about::before {
  filter: blur(8px);
  scale: 1.06;
}

/* Service.03 の3項目。横3列のままだと1列が細くて字を大きくできないので、
   縦に並べ替えて、読める大きさに戻す */
.home-about-info {
  grid-template-columns: 1fr;
  row-gap: 2rem;
}

.home-about-info__item:nth-child(2)::before,
.home-about-info__item:nth-child(2)::after {
  content: none;
}

.home-about-info__item + .home-about-info__item {
  padding-top: 2rem;
  border-top: 1px dashed var(--mh--color--grayscale-300);
}

.home-about-info__term {
  font-size: clamp(2.2rem, 1.6rem + 0.9vw, 2.8rem);
  line-height: 1.5;
}

.home-about-info__desc {
  font-size: clamp(1.5rem, 1.2rem + 0.5vw, 1.8rem);
  line-height: 1.6;
  opacity: 0.85;
}


/* 1つめのセクションのカードが z-index 9999 で、左のナビや
   スマートフォンのメニューより前に出てしまうので下げる */
.home-job-list__item {
  z-index: 1;
}