@charset "UTF-8";
/* CSS Document */ :root {
  --b1: #3072ba; /* メインカラー（青） */
  --b2: #83bbf8; /* サブカラー（水色） */
  --black: #333333; /* 本文・縦線 */
  --line: #d0d0d0; /* 区切り線・ホバー・コピーライト */
  --sub: #a7a7a7; /* ロゴ上の小さい文字 */
  --overlay: rgba(39, 39, 39, 0.42); /* Recruit画像の上に重ねる色 */
}
html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}
body {
  font-family: 'Noto Sans CJK JP', 'Noto Sans JP', sans-serif;
  color: var(--black);
  font-size: max(1.60rem, 0.21vw + 1.40rem);
  font-weight: 500;
  font-feature-settings: "palt";
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  overflow-x: clip;
  letter-spacing: 0.08em;
  background-color: #fff;
}
.sp-br {
  display: none;
}
p {
  line-height: 1.9;
  letter-spacing: 0.1em;
}
a {
  color: inherit;
  text-decoration: none;
  letter-spacing: 0.08em;
  line-height: 1.5;
  transition: 0.2s;
}
img {
  max-width: 100%;
  height: auto;
  border-style: none;
  vertical-align: top;
}
.img100 {
  width: 100%;
}
mark {
  background: linear-gradient(transparent 60%, var(--b2) 60%);
  color: inherit;
  font-weight: 700;
}
ul {
  list-style-type: none;
  letter-spacing: 0.05em;
  line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 {
  letter-spacing: 0.05em;
  line-height: 1.6;
  font-weight: 700;
}
address{
 font-style: normal;
}
/* ボタン（青） */
.btn01 {
  width: fit-content;
  min-width: 12.75em;
  height: 3.5em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 100px;
  display: flex;
  align-items: center;
  padding: 0 3.125em 0 1.875em;
  white-space: nowrap;
  position: relative;
  transition: 0.2s;
  font-weight: 700;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  &::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0.75em;
    transform: translateY(-50%);
    background: url("../images/awesome-arrow-right.svg?ver=1") no-repeat center / contain;
    width: 0.94em;
    height: 0.94em;
  }
  &:hover {
    background-color: var(--sub);
  }
}
/* ボタン（白枠） */
.btn02 {
  width: fit-content;
  min-width: 12.75em;
  height: 3.5em;
  border: 1px solid #fff;
  color: #fff;
  border-radius: 100px;
  display: flex;
  align-items: center;
  padding: 0 3.125em 0 1.8em;
  white-space: nowrap;
  position: relative;
  transition: 0.2s;
  font-weight: 700;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  &::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0.75em;
    transform: translateY(-50%);
    background: url("../images/awesome-arrow-right.svg?ver=1") no-repeat center / contain;
    width: 0.94em;
    height: 0.94em;
  }
  &:hover {
    background-color: var(--line);
    border-color: var(--line);
  }
}
/*////////////////ヘッダー/////////////*/
/* ロゴはスクロールで流れ、nav とお問い合わせボタンだけを fixed で上部固定する */
.head {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  pointer-events: none;
}
/* ハンバーガー（タブレット・SPだけ表示。tab.css） */
.header_menu_btn,
.header_nav {
  display: none;
}
.logo {
  position: absolute;
  top: 2.29vw;
  left: 2.5vw;
  display: flex;
  align-items: center;
  gap: 0.68vw;
  pointer-events: auto;
}
.logo_mark {
  width: 3.31vw;
}
.logo_text {
  display: block;
}
.logo_sub {
  display: block;
  /* 社名と同じ幅に揃える（社名のフォントサイズ × 0.455。余りは字間で調整） */
  font-size: calc(max(0.42vw + 1.7rem, 2.1rem) * 0.455);
  font-weight: 500;
  color: var(--sub);
  letter-spacing: 0.05em;
  line-height: 1.4;
  text-align-last: justify;
}
.logo_name {
  display: block;
  margin-right: -0.1em;
  font-size: max(0.42vw + 1.7rem, 2.1rem);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.4;
}
.head_fix {
  position: fixed;
  top: 2.24vw;
  right: 2.45vw;
  display: flex;
  align-items: center;
  gap: 1vw;
  pointer-events: auto;
}
.menu {
  display: flex;
  align-items: center;
  height: 3.56em;
  padding: 0 1.5em;
  background-color: #fff;
  border-radius: 100px;
}
.menu_list {
  display: flex;
  gap: 2vw;
}
.menu_list > li > a {
  display: block;
  width: fit-content;
  min-width: 4.06em;
  white-space: nowrap;
  padding: 0.4em 0;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  background-image: repeating-linear-gradient(to right, var(--black) 0 2px, transparent 2px 4px);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100% 1px;
  &:hover {
    opacity: 0.6;
  }
}
.menu_has_sub {
  position: relative;
}
.menu_sub {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 10;
  padding-top: 1.6em;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -0.5em);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}
.menu_has_sub:hover .menu_sub,
.menu_has_sub:focus-within .menu_sub {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.menu_sub_list {
  display: grid;
  gap: 0.4em;
  min-width: 19em;
  padding: 1em;
  background-color: #fff;
  border-radius: 15px;
  box-shadow: 0 0.4em 1.6em rgba(0, 0, 0, 0.12);
}
.menu_sub_link {
  display: flex;
  align-items: center;
  gap: 1em;
  padding: 0.5em;
  border-radius: 10px;
  white-space: nowrap;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  transition: background-color 0.2s;
  &:hover {
    background-color: #f2f6fb;
  }
}
.menu_sub_pic {
  display: block;
  flex-shrink: 0;
  width: 5.6em;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.head_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11.44em;
  height: 3.56em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 100px;
  font-size: 1em;
  font-weight: 700;
  transition: 0.2s;
  &:hover {
    background-color: var(--line);
  }
}
/*////////////////スクロールでふわっと表示/////////////*/
.js-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.2s ease, transform 1.2s ease;
}
.js-reveal.is-inview {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .js-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/*/////////////////トップページ///////////////////////*/
/*////////////////ヒーロー（3枚スライド：写真と文字が一緒に切り替わる）/////////////*/
.top_hero {
  position: relative;
  width: 95.05%;
  margin: max(7.81vw, calc(2.24vw + 3.56em + 2rem)) auto 0;
}
.hero_slides {
  position: relative;
  width: 100%;
  aspect-ratio: 1825 / 932;
  min-height: calc(35.64vw + 24.5rem);
  border-radius: 0.78vw;
  overflow: clip;
  /* 写真が表示されるまでは、黒ではなく薄いグレーにしておく */
  background-color: #eceff2;
}
.hero_slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  animation: heroFade 24s infinite;
  &.is-slide1 {
    animation-delay: -5s;
    .hero_pic img {
      animation-delay: -5s;
    }
  }
  &.is-slide2 {
    animation-delay: 3s;
    .hero_pic img {
      animation-delay: 3s;
    }
  }
  &.is-slide3 {
    animation-delay: 11s;
    .hero_pic img {
      animation-delay: 11s;
    }
  }
}
/* 画像の中身だけがゆっくりズームし、枠と文字は固定 */
.hero_pic {
  position: absolute;
  inset: 0;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
    animation: heroZoom 24s linear infinite;
  }
  &::after {
    content: '';
    position: absolute;
    inset: 0;
    /* 【試験中】フィルターなし（文字の影だけで読ませる）。戻す場合は 0.2 → 0.14 → 0 のグラデーション */
    background: none;
    transition: opacity 0.6s;
  }
}
/* 写真の読み込みが終わるまで、フィルターと文字を出さない（js/script.js が .is-loaded を付ける） */
.hero_textbox,
.hero_license {
  transition: opacity 0.6s;
}
/* フィルターは、そのスライドの写真が読み込まれてから重ねる（写真より先に暗い面だけが出ないように） */
.hero_slide:not(.is-loaded) .hero_pic::after {
  opacity: 0;
}
.top_hero:not(.is-loaded) {
  .hero_textbox,
  .hero_license {
    opacity: 0;
    /* JSが動かない場合でも、2秒後には文字を表示する */
    animation: heroReveal 0.01s 2s forwards, heroLicenseShadow 24s -5s infinite;
  }
}
@keyframes heroLicenseShadow {
  0% {
    text-shadow: 0 0 0.6em rgba(0, 0, 0, 0.3), 0 0 0.15em rgba(0, 0, 0, 0.15);
  }
  20.83%,
  33.33% {
    text-shadow: 0 0 0.6em rgba(0, 0, 0, 0.6), 0 0 0.15em rgba(0, 0, 0, 0.35);
  }
  45.83%,
  100% {
    text-shadow: 0 0 0.6em rgba(0, 0, 0, 0.3), 0 0 0.15em rgba(0, 0, 0, 0.15);
  }
}
@keyframes heroReveal {
  to {
    opacity: 1;
  }
}
@keyframes heroFade {
  0% {
    opacity: 0;
    visibility: visible;
  }
  20.83% {
    opacity: 1;
  }
  33.33% {
    opacity: 1;
  }
  45.83% {
    opacity: 0;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes heroZoom {
  0% {
    transform: scale(1);
  }
  45.83%,
  100% {
    transform: scale(1.11);
  }
}
/* 文字：サブコピーの上端を全スライドで固定し、キャッチはその上へ下端揃えで伸ばす */
.hero_textbox {
  position: absolute;
  top: 31.19vw;
  left: 5.2%;
  color: #fff;
  font-feature-settings: normal;
  /* 2・3枚目：うっすらとした影 */
  text-shadow: 0 0 0.8em rgba(0, 0, 0, 0.22), 0 0 0.2em rgba(0, 0, 0, 0.1);
}
/* 1枚目は背景が明るく細かいので、影を濃くして読みやすくする */
.hero_slide.is-slide1 .hero_textbox {
  text-shadow: 0 0 0.8em rgba(0, 0, 0, 0.45), 0 0 0.2em rgba(0, 0, 0, 0.2);
}
.hero_head {
  position: absolute;
  bottom: calc(100% + 2.45vw);
  left: 0;
  width: max-content;
}
.hero_en {
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-weight: 400;
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  letter-spacing: 0.02em;
  line-height: 1.4;
  margin-bottom: 0.6em;
}
.hero_catch {
  font-size: 3vw;
  font-weight: 900;
  letter-spacing: 0.02em;
  line-height: 1.44;
}
.hero_sub {
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.hero_textbox .btn02 {
  min-width: 14.625em;
  margin-top: 1.9vw;
}
/* 昭和58年設立と許可番号：スライドに関係なく固定 */
.hero_license {
  /* 小さい文字の影は、1枚目が出ている間だけ濃く、2・3枚目はうっすら（1枚目と同じ周期・同じずらしで動かす） */
  text-shadow: 0 0 0.6em rgba(0, 0, 0, 0.3), 0 0 0.15em rgba(0, 0, 0, 0.15);
  animation: heroLicenseShadow 24s -5s infinite;
  position: absolute;
  left: 5.2%;
  bottom: 2.55vw;
  display: flex;
  align-items: center;
  color: #fff;
  font-size: max(1.20rem, 0.21vw + 1.00rem);
  font-weight: 400;
}
.hero_license_year {
  margin-right: 0.8vw;
  line-height: 1.5;
}
.hero_license_text {
  padding-left: 0.5vw;
  border-left: 1px solid #fff;
  line-height: 2;
}
/*////////////////共通：見出し（英字＋日本語ラベル）と左の縦線/////////////*/
.com_line {
  display: flex;
  margin: 0 7.5% max(12vw, 80px) 5%;
}
.com_head {
  width: 30%;
  display: grid;
  grid-template-rows: auto 1fr;
  &::after {
    content: '';
    margin-left: 0.5em;
    border-left: 1px solid var(--black);
  }
}
.com_title {
  width: fit-content;
  font-weight: 400;
  line-height: 1;
}
.en_title {
  display: block;
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-weight: 100;
  font-size: 5.73vw;
  letter-spacing: 0;
  line-height: 1.17;
}
.ja_title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 0.3em;
  &::before {
    content: '';
    width: max(1.60rem, 0.21vw + 1.40rem);
    height: max(1.60rem, 0.21vw + 1.40rem);
    border-radius: 50%;
    background-color: var(--b2);
  }
}
/*////////////////News/////////////*/
.top01 {
  margin-top: 4.74vw;
}
.top01_body {
  width: 70%;
}
.top_news_li {
  border-bottom: 1px solid var(--line);
  padding: 20px 0 12px;
}
.top_topic_list {
  display: flex;
  align-items: stretch;
  color: var(--black);
}
.top_eyecatch {
  display: block;
  width: max(7.65%, 7rem);
  aspect-ratio: 1 / 1;
  overflow: clip;
  border-radius: 3px;
  flex-shrink: 0;
  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 1s;
  }
}
.top_topic_list:hover .top_eyecatch img {
  transform: scale(1.1);
  filter: brightness(0.6);
}
.top_news_meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap:1em;
  width: 10.9%;
  min-width: 7em;
  margin-left: 1.87%;
}
.top_list_date {
  display: block;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  line-height: 1.5;
  font-weight: 400;
}
.top_news_cat {
  display: block;
  width: fit-content;
  height: 2.17em;
  padding: 0 0.58em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 3px;
  font-size: max(0.1vw + 1rem, 1.1rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 2.17;
  font-feature-settings: normal;
}
.top_news_title {
  align-self: center;
  font-weight: 500;
  line-height: 1.5;
  transition: 0.2s;
}
.top_topic_list:hover .top_news_title {
  color: var(--b1);
}
.top01 .btn01 {
  margin-top: max(2.5vw, 30px);
}
/*////////////////Service/////////////*/
.top02 {
  display: grid;
  grid-template-columns: 30% 1fr;
  margin: max(12vw, 80px) 7.5% max(12vw, 80px) 5%;
  .com_head {
    grid-column: 1;
    grid-row: 1 / 5;
    width: auto;
  }
}
.top02_lead {
  grid-column: 2;
  grid-row: 1;
  width: min(100%, max(670px, 37.2em));
  margin-top: 0.83vw;
  line-height: 2;
  font-weight: 500;
}
.service_track {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 3.9vw 0 0 5.71%;
}
/* 見出しを除いた本文部分がリンク */
.service_link {
  display: block;
  transition: 0.2s;
  &:hover {
    background-color: var(--b1);
    color: #fff;
  }
}
.service_head {
  display: flex;
  align-items: center;
  gap: 1.25em;
  padding: 1.29em 0 1.25em;
  border-bottom: 1px solid var(--line);
  font-size: max(0.42vw + 1.6rem, 2rem);
}
.service_num {
  display: grid;
  place-items: center;
  width: 3.61em;
  height: 2.06em;
  border-radius: 100px;
  background-color: var(--b2);
  color: #fff;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1;
}
.service_title {
  font-size: 1em;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.service_body {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2.7vw;
  padding: 30px 4em 49px 0;
}
.service_pic {
  display: block;
  width: 32.14%;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.service_text {
  flex: 1;
  max-width: max(595px, 33em);
  line-height: 2;
  font-weight: 500;
}
.service_arrow {
  position: absolute;
  right: 0;
  bottom: 49px;
  width: 2em;
  height: 2em;
  background: url("../images/awesome-arrow-right-blue.svg?ver=1") no-repeat center / contain;
  transition: 0.2s;
}
.service_link:hover .service_arrow {
  background-image: url("../images/awesome-arrow-right.svg?ver=1");
  transform: translateX(-1em);
}
.top02_btn {
  grid-column: 1 / -1;
  grid-row: 4;
  margin: 3.33vw 0 0 5.71%;
}
.feature_list {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 6vw 0 0 5.71%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.feature_box {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 2.6vw;
  padding: 2% calc(8% + 2em) 2% 2%;
  background-color: var(--b1);
  color: #fff;
  border-radius: 10px;
  &::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 5.1%;
    transform: translateY(-50%);
    width: 2em;
    height: 2em;
    background: url("../images/awesome-arrow-right.svg?ver=1") no-repeat center / contain;
  }
  &:hover{
    background-color: var(--sub);
  }
}
.feature_pic {
  display: block;
  width: max(170px,10vw);
  aspect-ratio: 187 / 250;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.feature_textbox {
  font-size: max(0.21vw + 1.2rem, 1.4rem);
}
.feature_label {
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.2;
  &::before {
    content: '';
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background-color: #fff;
  }
}
.feature_title {
  margin-top: 0.6em;
  font-size: 1.5em;
  font-weight: 700;
  line-height: 1.625;
}
.feature_spec {
  display: flex;
  gap: 3.1em;
  margin-top: 1.9em;
}
.feature_spec_li {
  padding: 2px 0 2px 0.5em;
  border-left: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  dt {
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0;
  }
  dd {
    font-size: 1.75em;
    font-weight: 500;
    line-height: 1.5;
  }
}
.feature_unit {
  font-size: 0.64em;
}
.feature_text {
  max-width: 33em;
  margin-top: 1.25em;
  font-size: 1.125em;
  font-weight: 500;
  line-height: 1.78;
}
/*////////////////Works/////////////*/
.top03 {
  display: grid;
  grid-template-columns: 30% 1fr;
  margin: max(12vw, 80px) 7.5% max(12vw, 80px) 5%;
  .com_head {
    grid-column: 1;
    grid-row: 1 / 4;
    width: auto;
  }
}
.top03_lead {
  grid-column: 2;
  grid-row: 1;
  width: min(100%, max(670px, 37.2em));
  margin-top: 0.83vw;
  line-height: 2;
  font-weight: 500;
}
.top_works_list {
  grid-column: 2;
  grid-row: 2;
  width: 100%;
  margin-top: 4.9vw;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.82vw;
}
.top_works_link {
  display: block;
}
.top_works_pic {
  position: relative;
  aspect-ratio: 344 / 229;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
    transition: 1s;
  }
}
.top_works_link:hover .top_works_pic img {
  transform: scale(1.1);
  filter: brightness(0.6);
}
.top_works_tag {
  position: absolute;
  top: 2%;
  left: 2%;
  padding: 0 0.5em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 5px;
  font-size: max(0.1vw + 1rem, 1.1rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 2.17;
  font-feature-settings: normal;
}
.top03_btn {
  grid-column: 2;
  grid-row: 3;
  margin-top: 3.6vw;
}
/*////////////////About/////////////*/
.top04 {
  display: grid;
  grid-template-columns: 30% 1fr;
  grid-template-rows: auto auto 1fr;
  margin: max(12vw, 80px) 7.5% max(9.64vw, 80px) 5%;
  .com_head {
    grid-column: 1;
    grid-row: 1 / -1;
    width: auto;
  }
}
.top04_catch {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0.7vw;
  font-size: 2.6vw;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.6;
}
.top04_text {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 33.1%;
  margin: 8.54vw 0 0 5.71%;
  line-height: 2;
  font-weight: 500;
}
.top04_btn {
  grid-column: 1 / -1;
  grid-row: 3;
  align-self: start;
  margin: 4.9vw 0 0 5.71%;
}
.top04_pic {
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  align-self: end;
  justify-self: stretch;
  aspect-ratio: 871 / 654;
  margin: 17.55vw 0 0 48.15%;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
/*////////////////Recruit/////////////*/
.top05 {
  position: relative;
  aspect-ratio: 1920 / 840;
  margin-bottom: max(9.17vw, 80px);
  color: #fff;
}
.top05_pic {
  position: absolute;
  inset: 0;
  display: block;
  img {
    height: 100%;
    object-fit: cover;
  }
  &::after {
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--overlay);
  }
}
.top05_inner {
  position: relative;
  padding: 5.96vw 10% 5vw;
}
.top05_label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 400;
  line-height: 1.2;
  &::before {
    content: '';
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background-color: #fff;
  }
}
.top05_title {
  margin-top: 0.9vw;
  font-size: max(1.77vw + 2.2rem, 3.9rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.66;
}
.top05_text {
  width: min(100%, max(521px, 28.9em));
  margin-top: 1.43vw;
  line-height: 2;
  font-weight: 500;
}
.top05_btn {
  margin-top: 3.8vw;
}
/*////////////////フッター（Contact含む）/////////////*/
.contact {
  display: grid;
  grid-template-columns: 30% 1fr;
  margin: 0 7.5% 0 5%;
  .com_head {
    grid-column: 1;
    grid-row: 1 / 3;
    width: auto;
  }
}
.contact_lead {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0.83vw;
  line-height: 2;
  font-weight: 500;
}
.contact_row {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  align-items: center;
  gap: 5.83vw;
  margin-top: 5.1vw;
  margin-bottom: 5.2vw;
}
.phone-number {
  display: block;
  font-size: max(0.42vw + 1.6rem, 2rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  white-space: nowrap;
}
.phone-hours {
  margin-top: 8px;
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  line-height: 1.5;
  font-weight: 400;
}
.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap:3vw;
  margin: 8.2vw 5% 0 5.5%;
}
.footer-logo {
  position: static;
}
.footer-address {
  margin-top: 36px;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  p {
    letter-spacing: 0.02em;
    line-height: 1.5;
  }
  p + p {
    margin-top: 24px;
  }
}
.footer-license {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1em 0.5em;
  margin-top: 61px;
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 400;
  line-height: 1.5;
}
/* 工事業名の幅を揃えて、「長野県知事許可」の頭を縦に揃える */
.footer-license_row {
  display: contents;
}
.foot_menu_wrap {
  display: flex;
  flex-direction: column;
  gap: 2.6vw;
  margin-bottom: 6px;
}
.foot_menu {
  display: flex;
  gap: 2.97vw;
}
.foot_menu_single a {
  display: block;
  width: fit-content;
  min-width: 4.06em;
  padding-bottom: 0.9em;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 500;
  font-size: max(1.40rem, 0.21vw + 1.20rem);
  letter-spacing: 0.02em;
  line-height: 1.5;
  white-space: nowrap;
  background-image: repeating-linear-gradient(to right, var(--black) 0 2px, transparent 2px 4px);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100% 1px;
  &:hover {
    opacity: 0.6;
  }
}
.copy {
  display: block;
  margin-top: 12.2vw;
  padding-bottom: 1.9vw;
  color: var(--line);
  font-size: 1rem;
  line-height: 1.5;
  text-align: center;
}
/*////////////////下層ページ共通（タイトル・ヒーロー・パンくず）/////////////*/
.sub_hero {
  padding-top: max(15vw,100px);
}
.sub_title {
  width: fit-content;
  margin-left: 5%;
  font-weight: 400;
  line-height: 1;
}
.sub_title_ja {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  &::before {
    content: '';
    width: 3em;
    height: 1px;
    background-color: var(--black);
  }
}
.sub_title_en {
  display: block;
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-weight: 100;
  font-size: 7.6vw;
  letter-spacing: 0;
  line-height: 1.17;
}
/* 日本語を大きなタイトルにし、英字を小さなラベルにする型（鋼管つば出し加工機ページ） */
.sub_title_flip {
  display: flex;
  flex-direction: column-reverse;
}
.sub_title_label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.5;
  &::before {
    content: '';
    width: 3em;
    height: 1px;
    background-color: var(--black);
  }
}
.sub_title_big {
  display: block;
  font-size: max(4.00rem, 2.81vw + 1.30rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.3;
  font-style: italic;
}
.sub_hero_pic {
  display: block;
  width: 95.05%;
  aspect-ratio: 1825 / 728;
  margin: 0.94vw auto 0;
  border-radius: 0.78vw;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.breadcrumb {
  display: flex;
  list-style: none;
  margin: 1.35vw 5% 0;
  color: var(--sub);
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 400;
  line-height: 1.5;
  li + li::before {
    content: '/';
    margin: 0 0.8em;
  }
  a:hover {
    opacity: 0.6;
  }
}
/*////////////////会社案内ページ/////////////*/
.about_lead {
  margin: max(6.25vw, 80px) 7.5% max(12vw, 80px);
}
.about_lead_inner {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  text-align: left;
}
.about_lead_catch {
  text-align: center;
  font-size: max(0.94vw + 1.8rem, 2.7rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.about_lead_text {
  max-width: 40em;
  margin: 1.5em auto 0;
  line-height: 2;
  font-weight: 500;
}
.page_nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8em 1em;
  margin-bottom: 3.3vw;
}
.page_nav a {
  display: block;
  width: fit-content;
  padding: 0.55em 1.3em;
  border: 1px solid var(--b1);
  border-radius: 100px;
  color: var(--b1);
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
  white-space: nowrap;
  &:hover {
    background-color: var(--b1);
    color: #fff;
  }
}
/* 会社案内：セクション共通（左に見出し、右に内容） */
.about_sec {
  display: grid;
  grid-template-columns: 30% calc(70% - 3vw);
  column-gap: 3vw;
  margin: 0 7.5% max(12vw, 80px) 5%;
  scroll-margin-top: 10rem;
  .com_head {
    grid-column: 1;
    grid-row: 1;
    width: auto;
  }
}
/* 見出しの下に内容を置く（事業内容と同じ。上余白＝英字の高さ＋ラベル＋約79px） */
.about_sec_body {
  grid-column: 1 / -1;
  grid-row: 1;
  margin: calc(max(4.02vw + 5.15rem, 9rem) + 1.5em + 4.1vw) 0 0 5.71%;
}
.about_title {
  font-size: max(0.94vw + 1.8rem, 2.7rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
/* ごあいさつ */
.about_message_inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 5vw;
  margin-top: 2.5vw;
}
.about_message_body {
  flex: 1;
/*  max-width: max(670px, 37.2em);*/
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 1.5em;
  }
  .about_message_sign {
    margin-top: 2.2em;
    text-align: right;
    line-height: 1.8;
  }
}
.about_message_pic {
  display: block;
  width: 34.9%;
  aspect-ratio: 972 / 1052;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
/* 経営理念：左に見出し、右に内容（横並び） */
.about_philosophy .about_sec_body,
.about_history .about_sec_body,
.leak_price .about_sec_body,
.leak_faq .about_sec_body {
  grid-column: 2;
  margin: 0.83vw 0 0;
}
.about_philosophy_pic {
  display: block;
  width: 100%;
  height: auto;
}
.about_philosophy_words {
  margin-top: 2.5vw;
  font-size: max(0.83vw + 1.6rem, 2.4rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.about_philosophy_text {
  width:  min(100%,50em);
  margin-top: 1.8vw;
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 1.5em;
  }
}
/* 会社概要：見出しの右に写真、表は下に全幅 */
.about_company {
  .com_head {
    grid-row: 1 / 3;
  }
  .about_sec_body {
    grid-row: 2;
    margin: 4.1vw 0 0 5.71%;
  }
}
.about_company_pic {
  grid-column: 2;
  grid-row: 1;
  display: block;
  margin-top: 0.83vw;
  aspect-ratio: 1176 / 420;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
/* 会社概要（表） */
.about_table {
  border-top: 1px solid var(--line);
}
.about_table_row {
  display: flex;
  padding: 1.5em 0;
  border-bottom: 1px solid var(--line);
  dt {
    width: 22%;
    flex-shrink: 0;
    font-weight: 700;
    line-height: 2;
  }
  dd {
    flex: 1;
    font-weight: 500;
    line-height: 2;
  }
  dd p {
    line-height: 2;
  }
}
/* 工事業名の幅を揃えて、「長野県知事許可」の頭を縦に揃える */
.about_regist_list {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.5em;
  p {
    display: contents;
  }
}
.about_roles li {
  display: flex;
  gap: 1.5em;
  line-height: 2;
}
.about_roles_post {
  width: 8em;
  flex-shrink: 0;
}
.about_office {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4em 1.5em;
  p {
    line-height: 2;
  }
}
.about_office + .about_office {
  margin-top: 0.8em;
}
/* 小さい枠線ボタン（Google Map／Webサイト） */
.btn_map {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.35em 1.4em;
  border: 1px solid var(--b1);
  border-radius: 100px;
  color: var(--b1);
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
  &::after {
    content: '';
    width: 0.9em;
    height: 0.9em;
    background: url("../images/awesome-arrow-right-blue.svg?ver=1") no-repeat center / contain;
  }
  &:hover {
    background-color: var(--b1);
    color: #fff;
    &::after {
      background-image: url("../images/awesome-arrow-right.svg?ver=1");
    }
  }
}
/* 沿革（年表） */
.about_history_row {
  position: relative;
  display: grid;
  grid-template-columns: 10em 1fr;
  padding: 0 0 1.4em 2.2em;
  &::before {
    content: '';
    position: absolute;
    top: 0.55em;
    left: 0;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background-color: var(--b2);
  }
  &::after {
    content: '';
    position: absolute;
    top: 1.75em;
    bottom: -0.35em;
    left: 0.5em;
    width: 1px;
    background-color: var(--line);
  }
  &:last-child::after {
    display: none;
  }
  dt {
    font-weight: 700;
    line-height: 2;
  }
  dd {
    font-weight: 500;
    line-height: 2;
  }
}
/* 有資格者一覧 */
.about_license_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3vw;
}
.about_license_lead {
  max-width: max(670px, 37.2em);
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 500;
  line-height: 2;
}
.about_license_pic {
  display: block;
  width: 35.9%;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.about_license_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 5.7vw;
  margin-top: 4vw;
  border-top: 1px solid var(--line);
}
.about_license_li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1em;
  padding: 1em 0;
  border-bottom: 1px solid var(--line);
  font-weight: 500;
  line-height: 1.8;
}
.about_license_num {
  flex-shrink: 0;
  font-weight: 700;
}
/* その他許可・認定登録（会社概要の表の中）。WYSIWYGの出力にクラスが付かないので、親の .about_cert から指定する */
.about_cert {
  > * + * {
    margin-top: 0.5em;
  }
  li {
    position: relative;
    padding-left: 1.2em;
    line-height: 2;
    &::before {
      content: '';
      position: absolute;
      top: 0.72em;
      left: 0;
      width: 0.56em;
      height: 0.56em;
      border-radius: 50%;
      background-color: var(--b2);
    }
  }
}
/*////////////////事業内容ページ/////////////*/
/* 一貫体制：見出し＋導入文は右の列、4ステップは下に全幅 */
.svc_strength {
  grid-template-rows: auto auto auto;
  .com_head {
    grid-row: 1 / 4;
  }
}
.svc_strength_intro {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0.83vw;
}
.svc_strength_text {
  max-width: max(670px, 37.2em);
  margin-top: 1.5vw;
  line-height: 2;
  font-weight: 500;
}
.svc_flow {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3vw;
  margin: 4.1vw 0 0 5.71%;
  list-style: none;
}
.svc_flow_item {
  position: relative;
  padding: max(1.2rem, 1.56vw) max(1rem, 1.3vw) max(1.4rem, 1.73vw);
  border: 1px solid var(--line);
  border-radius: 10px;
  &:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -2.2vw;
    transform: translateY(-50%);
    width: 1.4vw;
    min-width: 1em;
    aspect-ratio: 1 / 1;
    background: url("../images/awesome-arrow-right-blue.svg?ver=1") no-repeat center / contain;
  }
}
.svc_flow_pic {
  display: block;
  margin-bottom: 1em;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.svc_flow_num,
.flare_flow_num {
  display: grid;
  place-items: center;
  width: 3.6em;
  height: 2.06em;
  border-radius: 100px;
  background-color: var(--b2);
  color: #fff;
  font-size: 0.9em;
  font-weight: 700;
  line-height: 1;
}
.svc_flow_item .svc_flow_num,
.flare_flow_item .flare_flow_num {
  display: block;
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
  color: var(--b1);
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(1.04vw + 2rem, 3.2rem);
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1;
}
.svc_flow_title {
  margin-top: 0.8em;
  font-size: max(0.42vw + 1.6rem, 2rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.svc_flow_text {
  margin-top: 0.6em;
  line-height: 1.8;
  font-size: max(1.40rem, 0.21vw + 1.20rem);
}
.svc_strength_note {
  grid-column: 1 / -1;
  grid-row: 3;
  max-width: max(900px, 50em);
  margin: 3vw 0 0 5.71%;
  line-height: 2;
  font-weight: 500;
}
/* 5つの事業 */
.svc_sec {
  margin: 0 0 max(8vw, 60px);
  scroll-margin-top: 10rem;
}
.svc_body {
  display: flex;
  align-items: flex-start;
  gap: 2.7vw;
  padding-top: 30px;
}
.svc_pics {
  display: grid;
  gap: 1.04vw;
  width: 30.7%;
  flex-shrink: 0;
}
.svc_pic {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.svc_text {
  flex: 1;
  max-width: max(760px, 42em);
}
.svc_lead {
  line-height: 2;
  font-weight: 500;
}
.svc_list {
  margin-top: 1.6em;
  dt {
    font-weight: 700;
    line-height: 2;
  }
  ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6em;
    margin-top: 0.4em;
  }
  li {
    padding: 0.25em 1em;
    border: 1px solid var(--b1);
    border-radius: 5px;
    color: var(--b1);
    font-size: max(0.21vw + 1.2rem, 1.4rem);
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.7;
  }
}
.svc_area {
  margin-top: 1.6em;
  padding: 1.2em 1.5em;
  border: 1px solid var(--line);
  border-radius: 10px;
  dt {
    font-weight: 700;
    line-height: 2;
  }
  dd {
    font-weight: 500;
    line-height: 2;
  }
  div + div {
    margin-top: 0.8em;
  }
}
.svc_works {
  margin-top: 1.6em;
  line-height: 2;
  font-weight: 500;
}
.svc_btns {
  margin-top: 1.8em;
}
/* 青いバナー（加工機・漏水調査） */
.svc_banner {
  margin: 0 0 max(8vw, 60px);
}
.svc_related {
  margin: 0;
}
/*////////////////鋼管つば出し加工機ページ/////////////*/
/*
.flare_hero .breadcrumb {
  margin-top: 1.35vw;
}
*/
.flare_intro {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4vw;
  margin: 8vw 7.5% max(12vw, 80px) 5%;
}
.flare_intro_body {
  flex: 1;
  max-width: 46em;
}
.flare_label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Roboto', 'Noto Sans JP', sans-serif;
  font-style: italic;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  line-height: 1.5;
  &::before {
    content: '';
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background-color: var(--b1);
  }
}
.flare_intro_catch {
  margin-top: 0.9em;
}
.flare_intro_text {
  margin-top: 1.5em;
  line-height: 2;
  font-weight: 500;
}
.flare_intro_pic {
  display: block;
  width: 40%;
  aspect-ratio: 672 / 659;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    height: 100%;
    object-fit: cover;
  }
}
/* できること */
.flare_can_text {
  max-width: 46em;
  margin-top: 1.5vw;
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 1.5em;
  }
}
.flare_can_pics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.82vw;
  margin-top: 3vw;
  picture {
    display: block;
    aspect-ratio: 3 / 2;
    border-radius: 5px;
    overflow: clip;
  }
  img {
    height: 100%;
    object-fit: cover;
  }
}
/* スペック */
.flare_big {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.82vw;
  max-width: 62%;
  margin-bottom: 3vw;
  li {
    padding: 1.4em 1.8em 1.6em;
    border: 1px solid var(--line);
    border-radius: 10px;
  }
}
.flare_big_label {
  font-weight: 700;
  line-height: 1.5;
}
.flare_big_num {
  margin-top: 0.2em;
  color: var(--b1);
  font-size: max(2.08vw + 4rem, 5.6rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.2;
}
.flare_big_unit {
  margin-left: 0.15em;
  font-size: 0.4em;
}
.flare_big_note {
  margin-top: 0.4em;
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 500;
  line-height: 1.6;
}
/* 加工の流れ */
.flare_process_inner {
  display: flex;
  align-items: flex-start;
  gap: 3vw;
  margin-top: 2.5vw;
}
.flare_video {
  position: relative;
  width: 55%;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  background-color: var(--black);
  flex-shrink: 0;
}
.flare_video_el {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.flare_video_btn {
  position: absolute;
  right: 1em;
  bottom: 1em;
  display: grid;
  place-items: center;
  width: 2.6em;
  height: 2.6em;
  border: none;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  transition: 0.2s;
  &::before {
    content: '';
    width: 0.9em;
    height: 1em;
    background: linear-gradient(to right, var(--black) 0 36%, transparent 36% 64%, var(--black) 64% 100%);
  }
  &.is-paused::before {
    background: var(--black);
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  &:hover {
    opacity: 0.7;
  }
}
.flare_flow_list {
  flex: 1;
  list-style: none;
  border-top: 1px solid var(--line);
}
.flare_flow_item {
  display: flex;
  align-items: flex-start;
  gap: 1.2em;
  padding: 1.4em 0;
  border-bottom: 1px solid var(--line);
}
.flare_flow_item .flare_flow_num {
  flex-shrink: 0;
  min-width: 1.5em;
  font-variant-numeric: tabular-nums;
}
.flare_flow_title {
  font-size: max(0.42vw + 1.6rem, 2rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.flare_flow_text {
  margin-top: 0.4em;
  font-weight: 400;
  line-height: 1.5;
}
/* メリット・承れる範囲 */
.flare_cards {
  display: grid;
  gap: 2.6vw;
  list-style: none;
}
.flare_cards_3 {
  grid-template-columns: repeat(3, 1fr);
}
.flare_cards_2 {
  grid-template-columns: repeat(2, 1fr);
  margin-top: 2.5vw;
}
.flare_card {
  padding: max(1.2rem, 1.56vw) max(1rem, 1.3vw) max(1.4rem, 1.73vw);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.flare_card_pic {
  display: block;
  aspect-ratio: 3 / 2;
  margin-bottom: 1.2em;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.flare_range_note {
  max-width: max(900px, 50em);
  margin-top: 3vw;
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 0.8em;
  }
}
/*////////////////漏水調査ページ/////////////*/
/* イントロ（flareページと同じ配置） */
.leak_intro {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4vw;
  margin: 8vw 7.5% max(12vw, 80px) 5%;
}
.leak_intro_body {
  flex: 1;
  max-width: 46em;
}
.leak_intro_text {
  margin-top: 1.5em;
  line-height: 2;
  font-weight: 500;
}
.leak_intro_pic {
  display: block;
  width: 42%;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  flex-shrink: 0;
  img {
    height: 100%;
    object-fit: cover;
  }
}
/* 症状チェック：全幅の青い帯 */
.leak_band {
  padding: max(6vw, 60px) 0;
  margin-bottom: max(12vw, 80px);
  background-color: var(--b1);
  color: #fff;
  .about_sec {
    margin-bottom: 0;
  }
  .com_head::after {
    border-left-color: #fff;
  }
}
.leak_checks {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5vw;
  list-style: none;
}
.leak_check_li {
  position: relative;
  padding: 1.3em 1.5em 1.3em 3.8em;
  border-radius: 10px;
  background-color: #fff;
  color: var(--black);
  font-weight: 500;
  line-height: 1.7;
  min-height: 100px;
  display: flex;
  align-items: center;
  &::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 1.2em;
    translate: 0 -50%;
    width: 1.7em;
    height: 1.7em;
    border-radius: 50%;
    background-color: var(--b1);
  }
  &::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 2.05em;
    width: 0.45em;
    height: 0.85em;
    border: solid #fff;
    border-width: 0 0.16em 0.16em 0;
    transform: translate(-50%, -62%) rotate(45deg);
  }
}
.leak_check_note {
  max-width: 46em;
  margin-top: 2.5vw;
  line-height: 2;
  font-weight: 500;
}
/* 漏水調査とは */
.leak_split {
  margin-top: 2.5vw;
}
.leak_split_text {
  max-width: 46em;
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 1.5em;
  }
}
.leak_split_pics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2vw;
  margin-top: 3vw;
}
.leak_split_pic {
  display: block;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
/* 調査機器 */
.leak_cards {
  display: grid;
  gap: 2vw;
  margin-top: 2.5vw;
  list-style: none;
}
.leak_card {
  display: grid;
  grid-template-columns: 36% 1fr;
  align-items: center;
  border: 1px solid var(--b1);
  border-radius: 5px;
  overflow: clip;
}
.leak_card_title {
  grid-column: 1 / -1;
  padding: 0.9em 1.6em;
  background-color: var(--b1);
  color: #fff;
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.leak_card_pic {
  display: block;
  align-self: stretch;
  min-height: 100%;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.leak_card_text {
  padding: 1.6em 2em;
  line-height: 2;
  font-weight: 500;
  max-width: 50em;
}
.leak_device_note {
  margin-top: 2.5vw;
  padding: 1.2em 1.6em;
  border: 1px solid var(--b2);
  border-radius: 10px;
  line-height: 2;
  font-weight: 500;
}
/* 調査から修理までの流れ */
.leak_flow_lead {
  max-width: 46em;
  margin-top: 1.5vw;
  line-height: 2;
  font-weight: 500;
}
.leak_steps {
  margin-top: 2.5vw;
  border-top: 1px solid var(--line);
  list-style: none;
}
.leak_step {
  display: grid;
  grid-template-columns: 5em 17em 1fr max(14vw, 11em);
  gap: 0 1.5em;
  align-items: baseline;
  padding: 1.4em 0;
  border-bottom: 1px solid var(--line);
}
.leak_step_num {
  color: var(--b1);
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(1.04vw + 2rem, 3.2rem);
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1;
}
.leak_step_pic {
  display: block;
  grid-column: 4;
  align-self: center;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.leak_step_title {
  font-size: max(0.42vw + 1.6rem, 2rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.leak_step_text {
  line-height: 2;
  font-weight: 500;
}
/* 料金の目安 */
.leak_price_box {
  max-width: 60em;
  padding: max(1.2rem, 1.6vw) max(1.6rem, 2.4vw);
  border: 2px solid var(--b2);
  border-radius: 10px;
}
.leak_price_lead {
  font-weight: 500;
  line-height: 2;
}
.leak_price_table {
  max-width: 60em;
  margin-top: 2vw;
  border-top: 1px solid var(--black);
}
.leak_price_row {
  display: grid;
  grid-template-columns: max(22%, 11em) 1fr;
  border-bottom: 1px solid var(--black);
  dt {
    display: flex;
    align-items: center;
    padding: 1.3em 1.5em;
    font-weight: 700;
    line-height: 1.7;
    white-space: nowrap;
  }
  dd {
    padding: 1.3em 1.8em;
  }
}
.leak_price_list li {
  display: flex;
  justify-content: space-between;
  gap: 1.5em;
  padding: 0.3em 0;
  font-weight: 500;
  line-height: 1.8;
  span {
    white-space: nowrap;
  }
}
.leak_price_yen {
  font-weight: 700;
  text-align: right;
  /* 項目名がない行でも、金額は右に揃える */
  &:only-child {
    margin-left: auto;
  }
}
.leak_price_dots {
  margin-top: 0.8em;
  li {
    position: relative;
    padding: 0.15em 0 0.15em 1.3em;
    font-weight: 500;
    line-height: 1.8;
    &::before {
      content: '';
      position: absolute;
      top: 0.9em;
      left: 0;
      width: 0.6em;
      height: 0.6em;
      border-radius: 50%;
      background-color: var(--b2);
    }
  }
}
.leak_price_note {
  margin-top: 1.2em;
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 500;
  line-height: 1.8;
}
/* よくある質問（アコーディオン） */
.leak_faq_list {
  border-top: 1px solid var(--line);
}
.leak_faq_item {
  border-bottom: 1px solid var(--line);
}
.leak_faq_q {
  display: flex;
  align-items: center;
  gap: 1.2em;
  padding: 1.4em 0;
  cursor: pointer;
  list-style: none;
  &::-webkit-details-marker {
    display: none;
  }
  &::after {
    content: '';
    flex-shrink: 0;
    width: 1.2em;
    height: 1.2em;
    margin-left: auto;
    background: linear-gradient(var(--b1), var(--b1)) center / 100% 2px no-repeat, linear-gradient(var(--b1), var(--b1)) center / 2px 100% no-repeat;
    transition: 0.2s;
  }
  &:hover {
    opacity: 0.7;
  }
}
.leak_faq_item.is-open .leak_faq_q::after,
.leak_faq_item:not(.is-enhanced)[open] .leak_faq_q::after {
  background-size: 100% 2px, 0 0;
}
.leak_faq_mark {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 2.4em;
  height: 2.4em;
  border-radius: 50%;
  background-color: var(--b1);
  color: #fff;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  line-height: 1;
}
.leak_faq_mark_a {
  background-color: #fff;
  color: var(--b1);
}
.leak_faq_qtext {
  font-size: 1.1em;
  font-weight: 700;
  line-height: 1.7;
}
.leak_faq_panel {
  overflow: hidden;
}
.leak_faq_a {
  display: flex;
  align-items: flex-start;
  gap: 1.2em;
  margin-bottom: 1.4em;
  padding: 1.4em 1.6em;
  border-radius: 10px;
  background-color: var(--b2);
  p {
    line-height: 2;
    font-weight: 500;
  }
}
/* お電話・フォーム */
.leak_cta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4vw;
  margin: 0 5% max(12vw, 80px);
  padding: max(2.4rem, 5vw) max(2rem, 5.2vw);
  border-radius: 15px;
  background-color: var(--b1);
  color: #fff;
}
.leak_cta_head {
  display: flex;
  align-items: center;
  gap: 1.2em;
  font-size: max(0.94vw + 1.8rem, 2.7rem);
}
.leak_cta_pic {
  display: block;
  flex-shrink: 0;
  width: 3.2em;
  height: 3.2em;
  border-radius: 50%;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.leak_cta_title {
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.leak_cta_lead {
  max-width: 34em;
  margin-top: 1em;
  line-height: 2;
  font-weight: 500;
}
.leak_cta_tel {
  display: block;
  font-size: max(3.00rem, 2.08vw + 1.00rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  white-space: nowrap;
}
.leak_cta_hours {
  margin-top: 0.4em;
  font-weight: 500;
}
.leak_cta_contact .btn02 {
  margin-top: 1.4em;
}

/*////////////////施工実績ページ/////////////*/
.works_lead {
  max-width: 46em;
  margin: 4vw 7.5% max(8vw, 60px) 5%;
  line-height: 2;
  font-weight: 500;
}
/* 分野タブ */
.list_tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em;
  list-style: none;
}
.list_tab {
  padding: 0.5em 1.4em;
  border: 1px solid var(--line);
  border-radius: 100px;
  background-color: #fff;
  color: var(--black);
  font-family: inherit;
  font-size: max(0.21vw + 1.2rem, 1.4rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.6;
  cursor: pointer;
  transition: 0.2s;
  &:hover {
    background-color: var(--line);
  }
  &.is-current {
    border-color: var(--b1);
    background-color: var(--b1);
    color: #fff;
  }
}
/* 実績カード（トップの施工実績カードと同じ見た目） */
.works_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3.6vw 1.82vw;
  margin-top: 3vw;
  list-style: none;
}
.works_item[hidden] {
  display: none;
}
.works_item:not([hidden]) {
  animation: worksFade 0.5s ease;
}
@keyframes worksFade {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.works_link {
  display: block;
}
.works_pic {
  position: relative;
  aspect-ratio: 344 / 229;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
    transition: 1s;
  }
}
.works_link:hover .works_pic img {
  transform: scale(1.1);
  filter: brightness(0.6);
}
.works_tag {
  position: absolute;
  top: 2%;
  left: 2%;
  padding: 0 0.5em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 5px;
  font-size: max(0.1vw + 1rem, 1.1rem);
  font-weight: 500;
  line-height: 2.17;
}
.works_name {
  margin-top: 0.7em;
  font-weight: 700;
  line-height: 1.5;
}
.works_work {
  margin-top: 0.2em;
  font-weight: 500;
  line-height: 1.6;
}
.works_year {
  margin-top: 0.3em;
  color: var(--sub);
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 500;
  line-height: 1.5;
}
/* ページ送り */
.list_pager {
  display: flex;
  justify-content: center;
  gap: 0.6em;
  margin-top: 4vw;
  &[hidden] {
    display: none;
  }
}
.list_pager_btn {
  display: grid;
  place-items: center;
  min-width: 2.8em;
  height: 2.8em;
  padding: 0 0.6em;
  border: 1px solid var(--line);
  border-radius: 100px;
  background-color: #fff;
  color: var(--black);
  font-family: 'Roboto', 'Noto Sans JP', sans-serif;
  font-size: inherit;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  transition: 0.2s;
  &:hover {
    background-color: var(--line);
  }
  &.is-current {
    border-color: var(--b1);
    background-color: var(--b1);
    color: #fff;
    pointer-events: none;
  }
  &:disabled {
    opacity: 0.35;
    pointer-events: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .works_item:not([hidden]) {
    animation: none;
  }
}
/*////////////////施工実績 詳細ページ/////////////*/
.works_d_hero {
  padding-top: max(10vw, 110px);
}
.works_d {
  width: 90%;
  max-width: 1100px;
  margin: max(6vw, 50px) auto max(12vw, 80px);
}
.works_d_tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
  list-style: none;
}
.works_d_tag {
  padding: 0 0.7em;
  background-color: var(--b1);
  color: #fff;
  border-radius: 5px;
  font-size: max(0.1vw + 1.2rem, 1.3rem);
  font-weight: 500;
  line-height: 2.1;
}
.works_d_name {
  margin-top: 0.6em;
}
.works_d_work {
  margin-top: 0.4em;
  font-size: max(0.31vw + 1.4rem, 1.7rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.works_d_body {
  display: grid;
  gap: 3vw;
  margin-top: 3vw;
}
.works_d_main {
  display: block;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.works_d_thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1vw;
  margin-top: 1vw;
  list-style: none;
}
.works_d_thumb {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 5px;
  background: none;
  overflow: clip;
  opacity: 0.55;
  cursor: pointer;
  transition: 0.2s;
  &:hover {
    opacity: 1;
  }
  &.is-current {
    border-color: var(--b1);
    opacity: 1;
  }
  img {
    height: 100%;
    object-fit: cover;
  }
}
.works_d_text {
  line-height: 2;
  font-weight: 500;
}
.works_d_table {
  margin-top: 2vw;
  border-top: 1px solid var(--black);
}
.works_d_row {
  display: grid;
  grid-template-columns: 8em 1fr;
  gap: 1.5em;
  padding: 1em 0;
  border-bottom: 1px solid var(--line);
  dt {
    font-weight: 700;
    line-height: 1.7;
  }
  dd {
    font-weight: 500;
    line-height: 1.7;
  }
}
.works_d_nav,
.news_d_nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2vw;
  margin-top: 6vw;
  padding-top: 2.5vw;
  border-top: 1px solid var(--line);
}
.works_d_nav_link {
  font-weight: 500;
  letter-spacing: 0.02em;
  &:hover {
    opacity: 0.6;
  }
}
.works_d_nav_prev::before {
  content: '←';
  margin-right: 0.6em;
}
.works_d_nav_next::after {
  content: '→';
  margin-left: 0.6em;
}
/*////////////////お知らせページ/////////////*/
.news_sec,
.works_sec,
.contact_sec {
  .about_sec_body {
    margin-top: calc((max(4.02vw + 5.15rem, 9rem) + 1.5em + 4.1vw) * 0.7);
  }
}
.news_sec {
  margin-top: max(8vw, 60px);
}
.news_list {
  margin-top: 3vw;
  list-style: none;
  border-top: 1px solid var(--line);
}
.news_item[hidden] {
  display: none;
}
.news_item:not([hidden]) {
  animation: worksFade 0.5s ease;
}
.list_empty {
  margin-top: 3vw;
  font-weight: 500;
  line-height: 2;
  &[hidden] {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .news_item:not([hidden]) {
    animation: none;
  }
}
/* お知らせ詳細 */
.news_d {
  width: 90%;
  max-width: 1100px;
  margin: max(6vw, 50px) auto max(12vw, 80px);
}
.news_d_meta {
  display: flex;
  align-items: center;
  gap: 1.2em;
}
.news_d_title {
  margin-top: 0.8em;
  padding-bottom: 1em;
  border-bottom: 1px solid var(--line);
}
.news_d_body {
  max-width: 46em;
  margin: 3vw auto 0;
  p {
    line-height: 2;
    font-weight: 500;
  }
  /* 見出し：本文の中で区切りになる、大・中・小の3段階 */
  h2 {
    position: relative;
    margin: 3em 0 1em;
    padding: 0.2em 0 0.2em 0.8em;
    font-size: max(2rem, 1.5vw);
    line-height: 1.6;
    letter-spacing: 0.02em;
    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 0.25em;
      height: 100%;
      background-color: var(--b1);
    }
  }
  h3 {
    position: relative;
    margin: 2.4em 0 0.8em;
    padding-bottom: 0.4em;
    border-bottom: 1px solid var(--line);
    font-size: max(1.8rem, 1.25vw);
    line-height: 1.6;
    letter-spacing: 0.02em;
    &::after {
      content: '';
      position: absolute;
      bottom: -1px;
      left: 0;
      width: 5em;
      height: 3px;
      background-color: var(--b1);
    }
  }
  h4, h5, h6 {
    margin: 2em 0 1.5em;
    font-size: max(1.6rem, 1.05vw);
    line-height: 1.6;
    letter-spacing: 0.02em;
    color: var(--b1);
  }
  /* 箇条書き・番号付き */
  ul, ol {
    margin-top: 1.4em;
    padding: 0;
    list-style: none;
  }
  li {
    position: relative;
    padding-left: 1.3em;
    line-height: 2;
    font-weight: 500;
  }
  ul li::before {
    content: '';
    position: absolute;
    top: 1em;
    left: 0;
    width: 0.6em;
    height: 0.6em;
    border-radius: 50%;
    background-color: var(--b1);
    transform: translateY(-50%);
  }
  ol {
    counter-reset: news_d_num;
    li {
      counter-increment: news_d_num;
      padding-left: 1.8em;
      &::before {
        content: counter(news_d_num);
        position: absolute;
        top: 0;
        left: 0;
        color: var(--b1);
        font-family: 'Roboto', sans-serif;
        font-style: italic;
        font-weight: 400;
      }
    }
  }
  /* 本文の流れ：要素どうしの間隔 */
  p + p {
    margin-top: 1.5em;
  }
  .news_d_pic + p,
  p + .news_d_pic,
  ul + p,
  ol + p,
  ul + .news_d_pic,
  ol + .news_d_pic,
  .news_d_pic + ul,
  .news_d_pic + ol {
    margin-top: 1.8em;
  }
  h2:first-child,
  h3:first-child,
  h4:first-child,
  h5:first-child,
  h6:first-child {
    margin-top: 0;
  }
  strong {
    font-weight: 700;
  }
}
.news_d_pic {
    margin-top: 1.8em;
  }
}
.news_d_pic {
  display: block;
  aspect-ratio: 3 / 2;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.news_d_link {
  color: var(--b1);
  text-decoration: underline;
  &:hover {
    opacity: 0.6;
  }
}
/*////////////////採用情報ページ/////////////*/
/* ヒーロー：背景の写真がゆっくり上へ流れ続ける */
.recruit_hero {
  position: relative;
  height: 62vw;
  min-height: 52rem;
  overflow: clip;
  /* 上下の端は白にとかして、写真の切れ目を見せない */
  &::before,
  &::after {
    content: '';
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    pointer-events: none;
  }
  &::before {
    top: 0;
    height: 14%;
    background: linear-gradient(to top, rgba(255, 255, 255, 0), #fff);
  }
  &::after {
    bottom: 0;
    height: 30%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);
  }
}
.recruit_hero_bg {
  position: absolute;
  inset: 0;
}
.recruit_hero_track {
  animation: recruitFlow 70s linear infinite;
}
@keyframes recruitFlow {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-33.3333%);
  }
}
.recruit_hero_set {
  position: relative;
  height: max(70vw, 52rem);
}
.recruit_hero_pic {
  position: absolute;
  display: block;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
  }
}
.recruit_hero_pic01 {
  left: 4.43%;
  top: 25.67%;
  width: 15.63%;
  aspect-ratio: 300 / 400;
}
.recruit_hero_pic02 {
  left: 25.1%;
  top: 61.31%;
  width: 16.93%;
  aspect-ratio: 325 / 433;
}
.recruit_hero_pic03 {
  left: 50.52%;
  top: 47.99%;
  width: 11.72%;
  aspect-ratio: 225 / 300;
}
.recruit_hero_pic04 {
  left: 74.22%;
  top: 19.49%;
  width: 17.03%;
  aspect-ratio: 327 / 436;
}
.recruit_hero_pic05 {
  left: 91.25%;
  top: 64.21%;
  width: 9.58%;
  aspect-ratio: 184 / 246;
}
.recruit_hero_pic06 {
  left: 34.53%;
  top: 14.51%;
  width: 10.31%;
  aspect-ratio: 198 / 263;
}
.recruit_hero_text {
  position: absolute;
  z-index: 2;
  top: 17vw;
  left: 0;
  width: 100%;
  text-align: center;
}
.recruit_hero_label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8em;
  font-size: max(1.4rem, 1.04vw);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
  &::before {
    content: '';
    width: 2em;
    height: 1px;
    background-color: var(--black);
  }
}
.recruit_hero_catch {
  margin-top: 0.4em;
  color: var(--b1);
  font-size: max(2.6rem, 5.1vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_hero_sub {
  margin-top: 0.8em;
  font-size: max(1.8rem, 2.6vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_breadcrumb {
  margin-top: 1.5vw;
}
.recruit_lead {
  max-width: 46em;
  margin: 3vw auto 0;
  text-align: center;
  line-height: 2;
  font-weight: 500;
}
@media (prefers-reduced-motion: reduce) {
  .recruit_hero_track {
    animation: none;
  }
}
/* 共通：セクションと見出し（青い丸＋英字＋日本語） */
.recruit_sec {
  margin: max(12vw, 80px) 7.5% 0;
}
.recruit_head {
  display: block;
}
.recruit_head_en {
  display: flex;
  align-items: center;
  gap: 0.6em;
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(2rem, 1.875vw);
  font-weight: 400;
  line-height: 1.5;
  color: var(--b1);
  &::before {
    content: '';
    flex-shrink: 0;
    width: 1.03em;
    height: 1.03em;
    border-radius: 50%;
    background-color: var(--b1);
  }
}
.recruit_head_ja {
  display: block;
  margin-top: 0.5em;
  font-size: max(2.4rem, 2.6vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_head_white {
  .recruit_head_en {
    color: #fff;
    &::before {
      background-color: #fff;
    }
  }
  .recruit_head_ja {
    color: #fff;
  }
}
/* 会社からのメッセージ */
.recruit_message {
  margin-top: max(8vw, 60px);
  .recruit_head {
    text-align: center;
  }
  .recruit_head_en {
    justify-content: center;
  }
}
/* 本文は左揃えのまま、かたまりごと中央に置く */
.recruit_message_body {
  width: fit-content;
  max-width: 100%;
  margin: 4.1vw auto 0;
}
.recruit_message_text p {
  font-size: max(1.80rem, 0.52vw + 1.30rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 2.5;
  max-width: 42em;
}
/* 先輩社員インタビュー */
.recruit_interview {
  position: relative;
}
.recruit_bubble {
  position: absolute;
  bottom: calc(100% - 3vw);
  right: 8.2%;
  display: grid;
  place-items: center;
  width: 15.2vw;
  min-width: 22rem;
  aspect-ratio: 291.768 / 255.297;
  padding: 0 1.45vw 1vw;
  background: url("../images/awesome-comment.svg?ver=1") no-repeat center / 100% 100%;
  color: #fff;
  font-size: max(1.3rem, 0.83vw);
  font-weight: 500;
  line-height: 1.9;
}
.recruit_interview_body {
  position: relative;
  display: grid;
  grid-template-columns: 21.1% 1fr;
  gap: 3vw;
  align-items: start;
  margin-top: 5.7vw;
}
.recruit_interview_pic {
  position: sticky;
  top: max(10rem, 8vw);
  display: block;
  aspect-ratio: 345 / 460;
  border-radius: 5px;
  overflow: clip;
  img {
    height: 100%;
    object-fit: cover;
	border-radius: 5px;
  }
}
.recruit_interview_main {
  max-width: 62em;
  padding-top: 1em;
}
.recruit_name {
  font-size: max(2rem, 1.5vw);
  font-weight: 700;
  line-height: 1.5;
  span {
    font-size: 0.72em;
  }
}
.recruit_profile {
  margin-top: 0.5em;
  font-weight: 500;
  line-height: 1.7;
}
.recruit_quals {
  margin-top: 1.4em;
  padding: 1.5em 1.7em;
  border: 1px solid var(--black);
  border-radius: 5px;
  background-color: #fff;
}
.recruit_quals_title {
  font-size: max(1.60rem, 0.42vw + 1.20rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_quals_list {
  margin-top: 0.6em;
  font-size: max(1.40rem, 0.21vw + 1.20rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 2;
}
.recruit_qa {
  margin-top: 3vw;
}
.recruit_qa_item + .recruit_qa_item {
  margin-top: 3.3vw;
}
.recruit_qa_q {
  display: flex;
  align-items: center;
  gap: 0.64em;
  color: var(--b1);
  font-size: max(1.60rem, 0.42vw + 1.40rem);
  font-weight: 500;
  line-height: 1.6;
  &::before {
    content: '';
    flex-shrink: 0;
    width: 3.2em;
    height: 1px;
    background-color: var(--b1);
  }
}
.recruit_qa_a {
  margin: 0.9em 0 0 1.5em;
  font-weight: 500;
  line-height: 2;
}
/* 1日の流れ */
.recruit_day {
  margin-top:max(8vw,40px);
}
.recruit_day_head {
  padding-left: 0.7em;
  border-left: 4px solid var(--b1);
  font-size: max(1.8rem, 1.35vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_day_list {
  margin-top: 1.5em;
  border-top: 1px solid var(--line);
  list-style: none;
}
.recruit_day_item {
  display: grid;
  grid-template-columns: 6em 9em 1fr;
  gap: 0 1.5em;
  align-items: baseline;
  padding: 1.3em 0;
  border-bottom: 1px solid var(--line);
}
.recruit_day_time {
  color: var(--b1);
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: max(2rem, 1.35vw);
  font-weight: 400;
  line-height: 1.3;
}
.recruit_day_title {
  font-size: max(1.6rem, 1.1vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.recruit_day_text {
  line-height: 2;
  font-weight: 500;
}
/* 資格取得支援（全幅の青い帯） */
.recruit_band {
  margin-top: max(12vw, 80px);
  padding: max(6vw, 60px) 0;
  background-color: var(--b1);
  color: #fff;
  .recruit_sec {
    margin-top: 0;
  }
}
.recruit_band_body {
  max-width: 46em;
  margin: 3vw 0 0 6.37%;
  p {
    line-height: 2;
    font-weight: 500;
  }
  p + p {
    margin-top: 1em;
  }
}
.recruit_license {
  margin: 3.5vw 0 0 6.37%;
}
.recruit_license_title {
  font-size: max(1.6rem, 1.1vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.recruit_license_list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7em;
  margin-top: 1em;
  list-style: none;
  li {
    padding: 0.35em 1em;
    border: 1px solid #fff;
    border-radius: 100px;
    font-size: max(1.3rem, 0.83vw);
    font-weight: 500;
    line-height: 1.6;
  }
}
/* 募集要項 */
.recruit_job {
  margin-top: 3vw;
}
.recruit_job + .recruit_job {
  margin-top: 7vw;
}
.recruit_job_title {
  margin-bottom: 0.8em;
  padding: 0.6em 1.2em;
  border-radius: 5px;
  background-color: var(--b1);
  color: #fff;
  font-size: max(1.8rem, 1.35vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
.recruit_job .about_table_row dt {
  width: 22%;
}
/* 応募・お問い合わせ */
.recruit_entry {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4vw;
  margin: max(8vw, 60px) 7.5% max(12vw, 80px);
  padding: max(2.4rem, 5vw) max(2rem, 5.2vw);
  border-radius: 15px;
  background-color: var(--b1);
  color: #fff;
}
.recruit_entry_title {
  font-size: max(2rem, 2.2vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.recruit_entry_lead {
  max-width: 34em;
  margin-top: 1em;
  line-height: 2;
  font-weight: 500;
}
/*////////////////お問い合わせページ/////////////*/
.cpage_lead {
  max-width: 46em;
  margin: 3vw 7.5% 0 5%;
  line-height: 2;
  font-weight: 500;
}
.cpage_tel {
  margin-top: max(8vw, 60px);
}
.contact_tel_num {
  display: flex;
  align-items: baseline;
  gap: 0.5em;
  width: fit-content;
  font-size: max(3.2rem, 3.1vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.3;
  &:hover {
    opacity: 0.6;
  }
}
.contact_tel_label {
  margin-right: 0.8em;
  color: var(--b1);
  font-size: max(1.4rem, 0.42vw + 1.2rem);
  font-weight: 700;
  letter-spacing: 0.05em;
}
.contact_tel_num .contact_tel_label {
  margin-right: 0;
}
.contact_tel_hours {
  margin-top: 0.8em;
  line-height: 1.8;
  font-weight: 500;
}
.contact_tel_fax {
  margin-top: 1.2em;
  font-weight: 500;
  line-height: 1.8;
}
.contact_tel_note {
  margin-top: 1.2em;
  line-height: 1.8;
  font-weight: 500;
}
.contact_mail {
  margin-bottom: max(12vw, 80px);
}
.contact_form_lead {
  line-height: 2;
  font-weight: 500;
}
.contact_form {
  max-width: 60em;
  margin-top: 2vw;
  border-top: 1px solid var(--line);
}
.cform_row {
  display: grid;
  grid-template-columns: 22% 1fr;
  gap: 1.5em;
  align-items: start;
  padding: 1.5em 0;
  border-bottom: 1px solid var(--line);
}
.contact_label {
  display: flex;
  align-items: center;
  gap: 0.8em;
  padding-top: 0.6em;
  font-weight: 700;
  line-height: 1.6;
}
.contact_badge {
  padding: 0 0.6em;
  border: 1px solid var(--sub);
  border-radius: 3px;
  color: var(--sub);
  font-size: max(0.1vw + 1rem, 1.1rem);
  font-weight: 500;
  line-height: 2;
}
.contact_badge_req {
  border-color: var(--b1);
  background-color: var(--b1);
  color: #fff;
}
.contact_input_el {
  display: block;
  width: 100%;
  padding: 0.8em 1em;
  border: 1px solid var(--line);
  border-radius: 5px;
  background-color: #fff;
  color: var(--black);
  font-family: inherit;
  font-size: inherit;
  font-weight: 500;
  line-height: 1.6;
  transition: 0.2s;
  &:focus {
    border-color: var(--b1);
    outline: none;
    box-shadow: 0 0 0 3px rgba(48, 114, 186, 0.2);
  }
  &.is-error {
    border-color: #d94a4a;
    background-color: #fff6f6;
  }
}
.contact_select {
  appearance: none;
  padding-right: 3em;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%233072ba' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 1.2em center / 0.9em;
  cursor: pointer;
}
.contact_textarea {
  min-height: 12em;
  resize: vertical;
}
.contact_agree {
  padding: 1.8em 0;
  border-bottom: 1px solid var(--line);
}
.contact_agree_label {
  display: flex;
  align-items: center;
  gap: 0.8em;
  font-weight: 700;
  cursor: pointer;
  > span {
    display: flex;
    align-items: center;
    gap: 0.8em;
  }
}
.contact_check {
  width: 1.3em;
  height: 1.3em;
  accent-color: var(--b1);
  cursor: pointer;
}
.contact_agree_note {
  margin-top: 0.8em;
  line-height: 1.8;
  font-weight: 500;
}
.contact_link {
  color: var(--b1);
  text-decoration: underline;
  &:hover {
    opacity: 0.6;
  }
}
.contact_error {
  margin-top: 1.5em;
  color: #d94a4a;
  font-weight: 700;
  line-height: 1.8;
  &[hidden] {
    display: none;
  }
}
.contact_submit {
  margin-top: 2.5em;
  border: none;
  font-family: inherit;
  cursor: pointer;
}
.contact_state_title {
  font-size: max(2rem, 1.35vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.contact_state_text {
  max-width: 46em;
  margin-top: 1em;
  line-height: 2;
  font-weight: 500;
}
.contact_confirm,
.contact_done {
  max-width: 60em;
  &[hidden] {
    display: none;
  }
}
.contact_confirm_list {
  margin-top: 2vw;
  .about_table_row dd {
    white-space: pre-wrap;
    word-break: break-word;
  }
}
.contact_btns {
  display: flex;
  align-items: center;
  gap: 2em;
  margin-top: 2.5em;
}
.contact_back {
  padding: 0 1.5em;
  border: none;
  background: none;
  color: var(--black);
  font-family: inherit;
  font-size: inherit;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  &:hover {
    opacity: 0.6;
  }
}
.contact_send {
  border: none;
  font-family: inherit;
  cursor: pointer;
}
.contact_done .btn01 {
  margin-top: 2.5em;
}
/*////////////////プライバシーポリシー/////////////*/
.privacy {
  width: 90%;
  max-width: 1100px;
  margin: max(6vw, 50px) auto max(12vw, 80px);
}
.privacy_lead {
  max-width: 60em;
  line-height: 2;
  font-weight: 500;
}
.privacy_items {
  max-width: 60em;
  margin-top: 4vw;
  border-top: 1px solid var(--line);
}
.privacy_item {
  padding: 2.2em 0;
  border-bottom: 1px solid var(--line);
  p {
    margin-top: 1em;
    line-height: 2;
    font-weight: 500;
  }
}
.privacy_item_title {
  display: flex;
  align-items: baseline;
  gap: 0.8em;
  font-size: max(1.8rem, 1.35vw);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.privacy_item_num {
  color: var(--b1);
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-weight: 400;
}
.privacy_list {
  margin-top: 1em;
  list-style: none;
  li {
    position: relative;
    padding-left: 1.3em;
    line-height: 2;
    font-weight: 500;
    &::before {
      content: '';
      position: absolute;
      top: 1em;
      left: 0;
      width: 0.6em;
      height: 0.6em;
      border-radius: 50%;
      background-color: var(--b2);
    }
  }
}
.privacy_address {
  margin-top: 1em;
  font-style: normal;
  line-height: 2;
  font-weight: 500;
}
.privacy_tel,
.privacy_mail {
  &:hover {
    opacity: 0.6;
  }
}
.privacy_date {
  max-width: 60em;
  margin-top: 2em;
  text-align: right;
  font-weight: 500;
  line-height: 1.8;
}