@charset "UTF-8";

:root {
  --container: 1200px;
  --gutter: 50px;
  /* 0/5のルールに合わせて */
  /* --radius: 50px; */

  --bp-sm: 767px;
  --bp-md: 991px;
  --bp-lg: 1199px;

  --color-text: #323333;
  --color-text-shadow: #231815;
  --color-white: #fff;
  --color-pink: #ff0060;
  --color-blue: #0292f7;
  --color-yellow: #fac714;

  --space-xs: 15px;
  --space-sm: 30px;
  --space-md: 50px;
  --space-lg: 80px;
  --space-xl: 100px;
  --space-xxl: 150px;

  --font-base: YakuHanJP, "Noto Sans JP", sans-serif;
  --font-maru: YakuHanJP, "Zen Maru Gothic", sans-serif;

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 22px;
  --font-size-xl: 32px;
  --font-size-xxl: 50px;
  --font-size-xxxl: 80px;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --font-weight-black: 900;
}

/* CSS Document */

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

html,
body {
  height: 100%;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-base);
  font-optical-sizing: auto;
  font-weight: var(--font-weight-regular);
  font-style: normal;
  font-size: 16px;
  line-height: 1.8;
}

/* 画像を箱に収める基本 */
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
  transition: 0.3s;
}

p {
  margin: 0;
}

/* スマホ時にアニメーションを無効化 */
@media (max-width: 767px) {
  a {
    transition: none !important;
    animation: none !important;
  }

  a:hover {
    transform: none !important;
  }
}

button {
  font: inherit;
}

table {
  width: 100%;
  border-collapse: collapse;
}

section {
  overflow: hidden;
}

@media screen and (min-width: 992px) {
  .display-none.min-992 {
    display: none !important;
  }
}

@media screen and (max-width: 991px) {
  .display-none.max-991 {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .display-none.min-768 {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .display-none.max-767 {
    display: none !important;
  }
}

.display-none.heading {
  display: none;
}

/* 管理バー表示時（ログイン中）だけ、fixedヘッダーを下げる */
body.admin-bar .header {
  top: 32px;
  /* PCの管理バー高さ */
}

/* スマホ（管理バーが太い時がある） */
@media (max-width: 767px) {
  body.admin-bar .header {
    top: 46px;
    /* SP/タブレットの管理バー高さ */
  }
}

/* ---------------------------------- */
.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  position: relative;
}

@media screen and (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media screen and (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media screen and (min-width: 992px) {
  .container {
    max-width: 820px;
  }
}

@media screen and (min-width: 1200px) {
  .container {
    max-width: 1000px;
  }
}

@media screen and (min-width: 1400px) {
  .container {
    max-width: 1120px;
  }
}

@media screen and (max-width: 767px) {
  .container {
    padding-right: 20px;
    padding-left: 20px;
  }
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* margin-right: -15px;
    margin-left: -15px; */
}

/* ---------------------------------- */
.header {
  position: fixed;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  width: 100%;
  height: 80px;
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 50px;
}

.header__nav-wrap {
  display: flex;
  align-items: center;
  gap: 60px;
}

@media (max-width: 1199px) {
  .header__nav-wrap {
    display: none;
  }
}

.header__nav {
  display: flex;
  gap: 20px;
}

.header__nav {
  font-weight: var(--font-weight-bold);
  font-family: var(--font-maru);
}

.header__nav a {
  padding: 5px 15px;
  display: block;
  border-radius: 30px;
  height: 35px;
  display: flex;
  align-items: center;
}

.header__nav a:hover {
  background-color: #fac715;
  color: var(--color-text);
}

/* =========================
   PCヘッダーナビ
========================= */
.header__nav {
  display: flex;
  align-items: center;
  gap: 32px;
}

.header__nav-link {
  text-decoration: none;
  color: inherit;
}

/* 親 */
.header__nav-item {
  position: relative;
}

.header__nav-item>.header__nav-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: inherit;
}

/* 矢印 */
.header__nav-item--has-child>.header__nav-link::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.3s ease;
}

/* 子メニュー */
.header__dropdown {
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: 160px;

  position: absolute;
  top: calc(100% + 5px);
  left: 50%;
  transform: translateX(-50%) translateY(10px);

  background: #fff;
  /* border: 1px solid #e5e5e5; */
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
  z-index: 100;

  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    visibility 0.3s ease;
}

/* hoverで表示 */
.header__nav-item--has-child:hover .header__dropdown,
.header__nav-item--has-child:focus-within .header__dropdown {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.header__nav-item--has-child:hover>.header__nav-link::after,
.header__nav-item--has-child:focus-within>.header__nav-link::after {
  transform: rotate(225deg) translateY(-1px);
}

.header__dropdown-item {
  margin: 0;
}

.header__dropdown-item a {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  text-decoration: none;
  color: inherit;
  line-height: 1.5;
  transition:
    background-color 0.25s ease,
    color 0.25s ease;
}

.header__dropdown-item a:hover {
  background: #f8f8f8;
}

.header__dropdown-item:first-child a {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border: 1px solid transparent;
}

.header__dropdown-item:first-child a:hover {
  background: #f8f8f8;
  background-color: #fac715;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border: 1px solid #fac715;
}

.header__dropdown-item:last-child a {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border: 1px solid transparent;
}

.header__dropdown-item:last-child a:hover {
  background: #f8f8f8;
  background-color: #fac715;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border: 1px solid #fac715;
}

/* 隙間でhover切れしにくくする */
.header__nav-item--has-child::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 20px;
}

.header__cta {
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
  transition: color 0.3s ease;
  border: 2px solid currentColor;
  border-radius: 50px;
  padding: 5px 12px;
  line-height: 1;
}

.header__cta:hover {
  background-color: var(--color-pink);
  color: var(--color-white);
  border: 2px solid var(--color-pink);
}

.header__cta::before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 20px;
  margin-top: 1px;
  margin-right: 5px;
  background: currentColor;
  -webkit-mask: url("../images/common/mail.svg") no-repeat center / contain;
  mask: url("../images/common/mail.svg") no-repeat center / contain;
}

.modal-nav .tel-cta::before {
  -webkit-mask: url("../images/common/primary.svg") no-repeat center / contain;
  mask: url("../images/common/primary.svg") no-repeat center / contain;
  width: 30px;
  height: 30px;
  margin-right: 10px;
}

/* SP */
@media (max-width: 767px) {
  .header {
    height: 70px;
  }

  .header__inner {
    padding: 15px;
  }

  .header .logo-box {
    display: flex;
    justify-content: flex-start;
    gap: 30px;
  }

  .header__logo {
    height: 40px;
    width: auto;
  }

  .header__logo img {
    max-width: none;
    width: auto;
    height: 100%;
  }

  .header__logo-sub {
    height: 40px;
    width: auto;
  }

  .header__logo-sub img {
    max-width: none;
    width: auto;
    height: 100%;
  }
}

/*---------------- トップページ_ヒーロー ----------------*/
/* HERO */
.hero {
  position: relative;
  /* top: 80px; */
  margin-top: 80px;
  height: calc(100svh - 80px);
  /* モバイルのアドレスバー対策 */
  min-height: calc(100svh - 80px);
  overflow: hidden;
}

/* 背景メディア */
.hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Splide（背景として全面表示） */
.hero__splide {
  width: 100%;
  height: 100%;
}

.hero__splide .splide__track,
.hero__splide .splide__list,
.hero__splide .splide__slide {
  height: 100%;
}

.hero__splide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* PCでは動画、SPではスライド */
@media (min-width: 768px) {
  .hero__splide {
    display: none;
  }
}

@media (max-width: 767px) {
  .hero__video {
    display: none;
  }

  .hero {
    position: relative;
    top: 0;
    margin-top: 70px;
    height: calc(100svh - 70px);
    min-height: calc(100svh - 70px);
    overflow: hidden;
  }
}

.hero__container {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  /* justify-content: center; */
}

/* 上に載せるレイヤー */
.hero__overlay {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  /* display: grid; */
  /* grid-template-columns: 1fr 1fr; */
  /* 左半分に載せる */
  pointer-events: none;
  /* 背景扱いなら */

  display: flex;
  align-items: center;
}

.hero__overlayInner {
  pointer-events: auto;
  align-self: center;
  /* padding: clamp(16px, 4vw, 48px); */
  /* max-width: 620px;
    position: relative;
    left: -180px;
    width: 100%; */

  max-width: 500px;
  position: relative;
  left: 0;
  width: 100%;
  padding-top: 30px;
}

.hero__logo {
  display: block;
  height: auto;
  /* margin-bottom: 16px; */
}

/* キャッチ */
.hero__catch {
  font-weight: 800;
  font-size: clamp(18px, 2vw, 26px);
  line-height: 1.25;
  margin: 0 0 14px;
}

.hero__catch span {
  color: #ff0060;
  /* ブランドに合わせて */
}

/* チップ */
.hero__chips {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0;
  margin: 0 0 18px;
}

.hero__chips li {
  background: rgba(255, 255, 255, 0.9);
  border: 2px solid #111;
  border-radius: 999px;
  padding: 6px 14px;
  font-weight: 800;
  line-height: 1;
}

/* イラスト */
.hero__illustWrap {
  margin-top: 10px;
}

.hero__illust {
  width: min(420px, 90%);
  height: auto;
  display: block;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .hero__overlayInner {
    max-width: 490px;
    position: relative;
    left: 0;
    width: 100%;
    padding-top: 30px;
  }
}

/* SPはレイアウト寄せ */
@media (max-width: 767px) {
  .hero__overlay {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .hero__overlayInner {
    padding-top: 84px;
    /* ヘッダー高さに応じて調整 */
  }
}

.first-cta {
  /* margin-top: -160px; */
  margin-bottom: 0;
}

/*---------------- トップページ_相談（イントロ） ----------------*/
.top-intro {
  padding-top: var(--space-lg);
  padding-bottom: 0;
  /* background: #FFF; */
}

.top-intro .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
}

.top-intro .left-box {
  flex: 1;
}

.top-intro .right-box {
  flex: 1;
  text-align: right;
}

.top-intro .right-box img {
  max-width: 100%;
  height: auto;
}

.top-intro .section-title {
  font-family: var(--font-maru);
  font-size: 76px;
  font-weight: var(--font-weight-black);
  color: var(--color-text);
  margin-bottom: var(--space-xs);
  line-height: 1.4;
}

.top-intro .section-title span {
  color: var(--color-pink);
}

.top-intro__text {
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  max-width: 650px;
  margin-bottom: var(--space-xs);
  line-height: 2.2;
}

.top-intro-icon {
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  vertical-align: middle;
  margin-top: -10px;
  margin-left: 5px;
  margin-right: 5px;
}

.top-intro-icon-01 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/01.png");
}

.top-intro-icon-02 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/02.png");
}

.top-intro-icon-03 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/03.png");
}

.top-intro-icon-04 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/04.png");
}

.top-intro-icon-05 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/05.png");
}

.top-intro-icon-06 {
  width: 50px;
  height: 50px;
  background-image: url("../images/top/intro/06.png");
}

.top-intro__lead {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
  line-height: 1.5;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .top-intro .section-title {
    font-size: 56px;
  }

  .top-intro .left-box {
    padding-bottom: 50px;
  }

  .top-service .row {
    gap: var(--space-md);
  }
}

@media (max-width: 767px) {
  .top-intro .row {
    flex-direction: column;
  }

  .top-intro .section-title {
    font-size: 26px;
    letter-spacing: -0.1rem;
    text-align: center;
  }

  .top-intro__text-box {
    padding: 0 15px;
  }

  .top-intro__text {
    font-size: 17px;
  }

  .top-intro__lead {
    font-size: 26px;
    letter-spacing: -0.1rem;
    text-align: center;
  }
}

/*---------------- トップページ_サービス ----------------*/
.top-service {
  padding: var(--space-lg) 0;
  background: var(--color-blue);
}

.top-service .row {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.top-service__head {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 0 50px;
}

.top-service__head .title-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.section-title--en {
  font-family: var(--font-maru);
  font-size: var(--font-size-xxxl);
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  line-height: 1;
}

.section-title--en>span {
  position: relative;
  z-index: 1;
  /* 塗りを前面へ */
  color: var(--color-yellow);
}

.section-title--en::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  /* ストロークを背面（-1にしない） */
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  /* blackでもOK */
  pointer-events: none;
}

.section-title--en::after {
  content: attr(data-text);
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 7px var(--color-text);
  pointer-events: none;
}

.section-title--jp {
  font-family: var(--font-base);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  line-height: 1;
  margin-left: 5px;
}

.section-title--jp>span {
  position: relative;
  z-index: 1;
  color: var(--color-white);
}

.section-title--jp::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  pointer-events: none;
}

@media (max-width: 767px) {
  .section-title--en {
    font-size: var(--font-size-xxl);
  }

  .section-title--jp {
    font-size: var(--font-size-md);
    margin: 0;
  }
}

.top-service .icon-box-wrap {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-xs);
}

.top-service .icon-box {
  background-color: #000;
  aspect-ratio: 1 / 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
}

.top-service .icon-box p {
  color: var(--color-white);
  line-height: 1;
  font-weight: var(--font-weight-bold);
}

.top-service__body {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.top-service__body .service-card {
  position: relative;
  background-color: var(--color-white);
  padding: 50px;
  border: 5px solid var(--color-pink);
  border-radius: 30px;
  z-index: 0;
  box-shadow: 10px 10px 0 var(--color-pink);
  overflow: visible;
  display: flex;
}

.top-service__body .service-card.kaitai {
  flex-direction: row-reverse;
}

.top-service__body .service-card__inner {
  position: relative;
  z-index: 1;
}

.top-service-title {
  font-family: var(--font-maru);
  font-size: var(--font-size-xxl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  line-height: 1;
  margin-bottom: var(--space-xs);
}

.top-service-title {
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
  /* ラインとの距離 */
}

/* .nandemoya .top-service-title::after {
    content: "";
    position: absolute;
    left: -50px;
    bottom: 0;
    width: 100%;
    width: calc(100% + 50px);
    height: 4px;
    background: #ff2b7a;
    border-radius: 2px;
} */

.nandemoya .service-card__inner {
  position: relative;
}

.nandemoya .service-card__inner::after {
  content: "";
  position: absolute;
  left: -50px;
  top: 70px;
  width: calc(100% - 25px);
  height: 4px;
  background: #ff2b7a;
}

.kaitai .service-card__inner {
  position: relative;
}

.kaitai .service-card__inner::after {
  content: "";
  position: absolute;
  left: 0;
  top: 70px;
  /* タイトル下の位置に調整 */
  width: calc(100% + 50px);
  height: 4px;
  background: #ff2b7a;
}

.top-service-lead {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  line-height: 1.6;
  margin-bottom: var(--space-xs);
}

.top-service-text {
  margin-bottom: var(--space-xs);
}

.top-service__actions {
  display: flex;
  gap: 20px;
  align-items: center;
}

.top-service-btn {
  display: flex;
  align-items: center;
  height: 48px;
}

.top-service-btn--primary {
  white-space: nowrap;
  display: inline-flex;
  padding: 10px 12px;
  background-color: var(--color-pink);
  color: var(--color-white);
  font-family: var(--font-maru);
  font-weight: var(--font-weight-medium);
  border-radius: 50px;
  transition: background-color 0.3s ease;
  border: 2px solid var(--color-pink);
}

.top-service-btn--primary:hover {
  background-color: var(--color-blue);
  color: var(--color-white);
  border: 2px solid var(--color-blue);
}

.top-service-btn--primary::before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-top: 1px;
  margin-right: 10px;
  background: currentColor;
  -webkit-mask: url("../images/top/service/primary.svg") no-repeat center / contain;
  mask: url("../images/top/service/primary.svg") no-repeat center / contain;
}

.top-service-btn--outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 15px;
  border-radius: 50px;
  /* 丸ボタン */
  border: 2px solid var(--color-pink);

  color: var(--color-pink);
  background: #fff;

  font-family: var(--font-maru);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
  line-height: 1;

  transition: all 0.3s ease;
}

.top-service-btn--outline:hover {
  background-color: var(--color-blue);
  color: var(--color-white);
  border: 2px solid var(--color-blue);
}

.top-service-btn--outline::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url("../images/top/service/arrow.svg") no-repeat center / contain;
  mask: url("../images/top/service/arrow.svg") no-repeat center / contain;
}

.nandemoya .service-card__media {
  position: absolute;
  right: 0px;
  bottom: 15px;
  width: 60%;
}

.kaitai .service-card__media {
  position: absolute;
  left: 0px;
  bottom: 15px;
  width: 55%;
}

@media (max-width: 767px) {
  .top-service__head {
    flex-direction: column;
    padding: 0;
    width: 100%;
    align-items: flex-start;
  }

  .top-service .icon-box img {
    width: 100%;
    height: 30px;
  }

  .top-service .icon-box p {
    font-size: 12px;
  }

  .top-service .icon-box-wrap {
    width: 100%;
  }

  .top-service .icon-box-wrap {
    display: flex;
    gap: 10px;
  }

  .top-service .icon-box {
    padding: 10px;
    justify-content: space-around;
  }

  .top-service {
    padding: var(--space-sm) 0;
  }

  .top-service .row {
    gap: var(--space-sm);
  }

  .top-service__body {
    width: 100%;
    gap: 30px;
  }

  .top-service__body .service-card {
    position: relative;
    background-color: var(--color-white);
    padding: 20px;
    border: 5px solid var(--color-pink);
    border-radius: 15px;
    z-index: 0;
    box-shadow: 10px 10px 0 var(--color-pink);
    overflow: visible;
    display: flex;
    flex-direction: column;
  }

  .top-service-title {
    font-size: 36px;
    padding-bottom: 15px;
  }

  .nandemoya .service-card__inner::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50px;
    width: calc(100% - 20px);
    height: 4px;
    background: #ff2b7a;
  }

  .top-service-lead {
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    color: var(--color-pink);
    line-height: 1.6;
    margin-bottom: 0;
  }

  .nandemoya .service-card__inner {
    position: relative;
    width: 100%;
  }

  .nandemoya .service-card__media {
    position: relative;
    right: 0px;
    bottom: 0;
    width: calc(100% + 20px);
    margin-top: 30px;
  }

  .top-service__actions {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    flex-direction: column;
  }

  .top-service__body .service-card.kaitai {
    flex-direction: column;
  }

  .kaitai .service-card__inner::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50px;
    width: calc(100% - 20px);
    height: 4px;
    background: #ff2b7a;
  }

  .kaitai .service-card__media {
    position: relative;
    left: 0px;
    bottom: 0;
    width: 100%;
  }

  .kaitai .service-card__media {
    position: relative;
    right: 0px;
    bottom: 0;
    width: calc(100% + 20px);
    margin-top: 10px;
  }
}

/*---------------- トップページ_お仕事実績 ----------------*/
.top-works {
  padding: var(--space-lg) 0;
  /* background: var(--color-white); */
}

.top-works .row {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.top-works__head {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 0 50px;
}

.top-works__head .title-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.top-works__head .lead {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}

.works-splide {
  margin-top: 50px;
}

/* Splideの左右余白（端のチラ見せしたい時に便利） */
.works-splide .splide__track {
  padding: 0 6px;
}

.works-splide .splide__slide {
  height: auto;
  /* カードの高さを中身に合わせる */
}

.works-card__link {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: 0.3s;
}

.works-card__thumb {
  aspect-ratio: 16 / 10;
  border-radius: 15px;
  overflow: hidden;
  background: #eee;
  margin: 0;
  border: 1px solid #1c1c1c;
  position: relative;
  overflow: hidden;
}

/* フィルター */
.works-card__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(3 146 247 / 50%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* hover */
.works-card__link:hover .works-card__thumb::after {
  opacity: 1;
}

.works-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 日付＋カテゴリ */
.works-card__meta {
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
}

.works-card__cat {
  display: inline-flex;
  align-items: center;
  padding: 5px 20px;
  border: 1px solid var(--color-text);
  border-radius: 50px;
  background: var(--color-white);
  font-weight: 700;
  line-height: 1;
}

/* タイトル */
.works-card__title {
  margin-top: 5px;
  margin-bottom: 0;
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
  transition: 0.3s;
}

.works-card__link:hover .works-card__title {
  color: var(--color-pink);
}

/* タグ */
.works-card__tags {
  /* margin-top: 5px; */
  font-size: 12px;
  color: #0a66c2;
  /* 仮。サイトの色に合わせて */
}

/* 矢印の見た目（必要なら） */
.works-splide .splide__arrow {
  background: #fff;
  border: 3px solid var(--color-text);
  width: 60px;
  height: 60px;
  border-radius: 999px;
  opacity: 1;
  margin-top: -55px;
}

.splide__arrow svg {
  fill: var(--color-text);
  height: 1.2em;
  width: 1.2em;
}

.works-more {
  margin-top: 40px;
  text-align: center;
}

.works-more__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-pink);

  color: var(--color-pink);
  font-weight: 700;
  text-decoration: none;
  background: #fff;

  transition: 0.3s ease;
}

.works-more__btn::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.works-more__btn:hover {
  color: var(--color-white);
  border-color: var(--color-pink);
  background-color: var(--color-pink);
}

.top-works {
  position: relative;
  padding-bottom: 160px;
  /* 人物・車を置く“余白”を確保（要調整） */
}

/* 飾りレイヤー */
.works-bridge {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -230px;
  /* ← WORKSから下にはみ出してFAQ側へ */
  height: 0;
  /* レイアウトを押し下げない */
  pointer-events: none;
  /* クリック邪魔しない */
  z-index: 3;
  /* FAQより上に出したいならここを上げる */
}

/* 左：人物 */
.works-bridge__people-01 {
  position: absolute;
  left: max(24px, calc((100vw - 1040px) / 2));
  bottom: 0;
  width: min(170px, 28vw);
  height: auto;
}

.works-bridge__people-02 {
  position: absolute;
  left: max(24px, calc((100vw - 700px) / 2));
  bottom: 0;
  width: min(146px, 28vw);
  height: auto;
}

/* 右：車 */
.works-bridge__car {
  position: absolute;
  right: max(24px, calc((100vw - 1080px) / 2));
  bottom: 68px;
  width: min(380px, 42vw);
  height: auto;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .works-bridge__people-01 {
    position: absolute;
    left: max(24px, calc((100vw - 880px) / 2));
    bottom: 0;
    width: min(140px, 28vw);
    height: auto;
  }

  .works-bridge__people-02 {
    position: absolute;
    left: max(24px, calc((100vw - 550px) / 2));
    bottom: 0;
    width: min(120px, 28vw);
    height: auto;
  }

  .works-bridge__car {
    position: absolute;
    right: max(24px, calc((100vw - 880px) / 2));
    bottom: 68px;
    width: min(300px, 42vw);
    height: auto;
  }
}

@media (max-width: 767px) {
  .works-bridge {
    bottom: -220px;
  }

  .works-bridge__people-01 {
    left: 5%;
    width: min(170px, 25vw);
  }

  .works-bridge__people-02 {
    left: 30%;
    width: min(120px, 22vw);
  }

  .works-bridge__car {
    bottom: 60px;
    width: min(380px, 42vw);
  }

  .works-more__btn {
    height: 50px;
    padding: 10px 20px;
    font-size: var(--font-size-sm);
  }

  .works-splide .splide__list {
    display: block;
  }

  .works-splide .splide__slide {
    width: 100% !important;
    margin-bottom: 30px;
  }

  /* 2件だけ表示 */
  .works-splide .splide__slide:nth-child(n + 3) {
    display: none;
  }

  .works-more {
    margin-top: 0;
    text-align: center;
  }

  .top-works__head {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 0;
    flex-direction: column;
  }

  .works-splide {
    margin-top: 30px;
  }

  .top-works__head .lead {
    font-size: var(--font-size-md);
  }

  .works-splide .splide__track {
    padding: 0;
  }

  .top-works {
    padding-top: 30px;
  }
}

/*---------------- トップページ_よくあるご質問 ----------------*/
.top-faq {
  padding: var(--space-lg) 0;
  padding-top: 0;
  /* background: var(--color-white); */
}

.top-faq__wrap {
  background-color: var(--color-blue);

  position: relative;
  padding: 50px;
  border: 5px solid var(--color-text);
  border-radius: 30px;
  z-index: 0;
  box-shadow: 10px 10px 0 var(--color-text);
  overflow: visible;
  display: flex;
  column-gap: 30px;
  justify-content: space-between;
}

.top-faq__head {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  flex: 1;
}

.top-faq__head .title-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.top-faq .section-title--en>span {
  position: relative;
  z-index: 1;
  color: var(--color-white);
}

.top-faq__contents-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 30px;
  flex: 4;
  justify-content: space-between;
}

.top-faq__contents {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.top-faq__contents-inner {
  background-color: #0266e4;
  padding: 15px 30px;
  border-radius: 10px;
}

.top-faq-question {
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-yellow);
  display: flex;
  align-items: baseline;
}

.top-faq-question::before {
  content: "Q.";
  display: inline-block;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-yellow);
  margin-right: 10px;
}

.top-faq-answer {
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  display: flex;
  align-items: baseline;
}

.top-faq-answer::before {
  content: "A.";
  display: inline-block;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  margin-right: 10px;
}

.top-faq__cta {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.top-faq__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-white);
  color: var(--color-white);
  font-weight: 700;
  text-decoration: none;
  background-color: #0266e4;
  transition: 0.3s ease;
  text-align: center;
  line-height: 1.2;
  width: 100%;
}

.top-faq__btn:hover {
  border: 2px solid #0266e4;
  background-color: var(--color-white);
  color: #0266e4;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .top-faq__contents-wrap {
    flex-direction: column;
  }

  .top-faq__contents {
    width: 100%;
  }

  .top-faq__cta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .top-faq__wrap {
    padding: 15px;
    gap: 15px;
    border-radius: 15px;
    box-shadow: 5px 5px 0 var(--color-text);
    flex-direction: column;
  }

  .top-faq__contents-wrap {
    flex-direction: column;
    gap: 15px;
  }

  .top-faq__contents-inner {
    background-color: #0266e4;
    padding: 5px 15px;
    border-radius: 10px;
  }

  .top-faq-question {
    font-size: 18px;
  }

  .top-faq-question::before {
    font-size: 18px;
  }

  .top-faq-answer {
    font-size: 18px;
  }

  .top-faq-answer::before {
    font-size: 18px;
  }

  .top-faq__cta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }

  .top-faq__btn {
    padding: 10px 20px;
    font-size: var(--font-size-sm);
  }

  .top-faq {
    padding-bottom: 50px;
  }
}

/*---------------- トップページ_新着情報 ----------------*/
.top-news {
  /* padding: 60px 0; */
}

.top-news__wrap {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 40px;
  align-items: start;
  padding: 50px;
}

/* 左 */
.top-news__head .title-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 20px;
}

.news-more__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-blue);

  color: var(--color-blue);
  font-weight: 700;
  text-decoration: none;
  background: #fff;

  transition: 0.3s ease;
}

.news-more__btn::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.news-more__btn:hover {
  color: var(--color-white);
  border-color: var(--color-blue);
  background-color: var(--color-blue);
}

/* 右：行 */
.top-news__list {
  display: flex;
  flex-direction: column;
}

.top-news__item {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  padding: 18px 0;
  text-decoration: none;
  color: inherit;
  border-bottom: 2px solid #222;
  /* 区切り線 */
}

/* 日付＋カテゴリ */
.top-news__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
}

.top-news__date {
  font-weight: 700;
  font-size: 12px;
  color: #222;
}

.top-news__cat {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border: 1px solid #999;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #222;
  background: #fff;
}

.top-news__content {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  justify-content: space-between;
}

/* タイトル */
.top-news__title {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;

  /* 1行に収めたいなら */
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 右の丸矢印 */
.top-news__arrow {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--color-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--color-blue);
  transition: 0.3s;
}

.top-news__arrow svg {
  width: 20px;
  height: 20px;
}

.top-news__item:hover .top-news__arrow {
  background-color: var(--color-blue);
}

.top-news__item:hover .top-news__arrow svg {
  color: var(--color-white);
}

.top-news__item {
  color: var(--color-text);
  transition: 0.3s;
}

.top-news__item:hover {
  color: var(--color-blue);
}

@media (max-width: 767px) {
  .top-news__wrap {
    padding: 0;
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .top-news__head {
    display: flex;
    gap: 30px;
    align-items: center;
  }

  .top-news__head .title-box {
    margin-bottom: 0;
  }

  .news-more__btn {
    height: 50px;
    padding: 10px 20px;
    font-size: var(--font-size-sm);
  }
}

/*---------------- トップページ_採用情報 ----------------*/
.top-recruit {
  padding: 60px 0;
  padding-top: 150px;
}

.top-recruit__wrap {
  background-color: var(--color-yellow);
  position: relative;
  padding: 50px;
  border: 5px solid var(--color-text);
  border-radius: 30px;
  z-index: 0;
  box-shadow: 10px 10px 0 var(--color-text);
  overflow: visible;
  display: flex;
  column-gap: 70px;
  justify-content: space-between;
}

.top-recruit__head {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  margin-bottom: var(--space-sm);
}

.top-recruit .section-title--en>span {
  position: relative;
  z-index: 1;
  color: var(--color-blue);
}

.top-recruit-text {
  font-size: 18px;
  margin-bottom: var(--space-xs);
}

.recruit-more__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-text);
  color: var(--color-text);
  font-weight: 700;
  text-decoration: none;
  background: #fff;
  transition: 0.3s ease;
}

.recruit-more__btn::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.recruit-more__btn:hover {
  color: var(--color-white);
  border-color: var(--color-text);
  background-color: var(--color-text);
}

.top-recruit__media-left {
  position: absolute;
  left: 45%;
  bottom: 15px;
  width: 15%;
}

.top-recruit__media-right {
  position: absolute;
  left: 62%;
  bottom: 25px;
  width: 48%;
}

.top-recruit__head .title-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .top-recruit__media-left {
    position: absolute;
    left: 50%;
    bottom: 15px;
    width: 14%;
    z-index: 2;
  }

  .top-recruit__media-right {
    position: absolute;
    left: 60%;
    bottom: 25px;
    width: 45%;
    z-index: 1;
  }
}

@media (max-width: 767px) {
  .top-recruit {
    padding: 15px 0;
    padding-top: 50px;
  }

  .top-recruit__wrap {
    padding: 15px;
    gap: 15px;
    border-radius: 15px;
    box-shadow: 5px 5px 0 var(--color-text);
  }

  .top-recruit-text-box {
    width: 70%;
  }

  .top-recruit__media-left {
    position: absolute;
    left: auto;
    right: 0;
    top: auto;
    bottom: auto;
    width: 27%;
  }

  .top-recruit__head {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    margin-bottom: var(--space-xs);
  }

  .top-recruit-text {
    font-size: 16px;
    margin-bottom: var(--space-xs);
    line-height: 1.4;
  }

  .top-cta.first-cta .container {
    padding-left: 15px;
    padding-right: 15px;
  }
}

/*---------------- トップページ_見積無料 ----------------*/
.top-cta {
  padding: 60px 0;
  /* margin-bottom: -100px; */
  position: relative;
}

.top-cta.first-cta {
  z-index: 1;
  padding-bottom: 0;
}

.top-cta__banner {
  position: relative;
  display: grid;
  grid-template-columns: 150px 1fr 1px 370px;
  gap: 20px;
  align-items: center;

  background: #ff0a6a;
  /* ピンク */
  border-radius: 18px;
  border: 4px solid #fff;
  /* box-shadow: 0 10px 0 rgba(0, 0, 0, .15); */
  padding: 22px 26px;
  overflow: visible;
  width: 100%;
}

/* 左：人物 */
.top-cta__left {
  position: relative;
  height: 100%;
}

.top-cta__person {
  position: absolute;
  left: -6px;
  bottom: -22px;
  /* 下にはみ出し */
  width: 150px;
  height: auto;
  display: block;
}

/* バッジ */
.top-cta__badge {
  position: absolute;
  left: -50px;
  top: -50px;
  width: 72px;
  height: 72px;
  border-radius: 999px;
  background: #fff;
  border: 3px solid #ff0a6a;
  color: #ff0a6a;
  font-weight: 900;
  display: grid;
  place-items: center;
  text-align: center;
  line-height: 1.05;
  transform: rotate(-12deg);
}

/* 中央コピー */
.top-cta__lead {
  margin: 0;
  color: #fff;
  font-weight: var(--font-weight-bold);
  font-size: 26px;
  line-height: 1.35;
  font-family: var(--font-maru);
}

.top-cta__sub {
  margin: 10px 0 0;
  color: #fff;
  font-size: var(--font-size-sm);
  line-height: 1.6;
  opacity: 0.95;
}

/* 点線区切り */
.top-cta__divider {
  height: 100%;
  border-left: 3px dotted rgba(255, 255, 255, 0.8);
}

/* 右：電話ブロック */
.top-cta__right {
  display: grid;
  gap: 10px;
}

.top-cta__tel {
  display: grid;
  grid-template-columns: 26px 1fr auto;
  align-items: center;
  gap: 10px;

  color: #fff;
  text-decoration: none;
  font-weight: 900;
  line-height: 1;

  font-size: 30px;
}

.top-cta__telNum {
  letter-spacing: 0.02em;
}

.top-cta__telTag {
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.35);
}

/* 電話アイコン（maskで色＝白固定） */
.top-cta__telIcon {
  width: 22px;
  height: 22px;
  background: #fff;
  -webkit-mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
  mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
}

.top-cta__telIcon--mobile {
  -webkit-mask: url(../images/common/phone.svg) no-repeat center / contain;
  mask: url(../images/common/phone.svg) no-repeat center / contain;
}

.top-cta__note {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: var(--font-size-sm);
  line-height: 1.5;
}

.top-cta-footer-sp {
  position: relative;
  /* display: grid;
    grid-template-columns: 150px 1fr 1px 370px;
    gap: 20px;
    align-items: center; */
  background: #ff0a6a;
  border-radius: 18px;
  border: 4px solid #fff;
  /* box-shadow: 0 10px 0 rgba(0, 0, 0, .15); */
  padding: 10px 20px;
  padding-top: 0;
  text-align: justify;
  overflow: visible;
  width: 100%;
  border-top: none;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

@media (min-width: 768px) {
  .top-cta-footer-sp {
    display: none;
  }
}

/* SP */
@media (max-width: 767px) {
  .top-cta__banner {
    grid-template-columns: 85px 1fr;
    gap: 0 5px;
    padding: 5px 20px;
    padding-bottom: 0;
    place-items: center;
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .top-cta__left {
    width: 100%;
  }

  .top-cta__badge {
    position: absolute;
    left: -35px;
    top: -50px;
  }

  .top-cta__person {
    left: 0;
    bottom: 0;
    position: relative;
    width: 100%;
  }

  .top-ta__divider {
    display: none;
  }

  .top-cta__tel {
    font-size: 22px;
  }

  .top-cta__right,
  .top-cta__divider {
    display: none;
  }

  .top-cta__lead {
    font-size: 22px;
    line-height: 1.5;
    font-family: var(--font-maru);
    letter-spacing: -0.2rem;
  }

  .top-cta__sub {
    font-size: 16px;
  }
}

/*---------------- フッター ----------------*/
.site-footer {
  background: #168bd6;
  color: #fff;
  padding: 100px 0 40px;
  /* font-size: 14px; */
}

.footer__inner {
  width: min(1100px, 92%);
  margin: 0 auto;
}

/* 上段 */
.footer__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
}

.footer__brand img {
  width: 260px;
  margin-bottom: var(--space-xs);
}

@media (max-width: 767px) {
  .footer__brand img {
    width: 100%;
    margin-bottom: var(--space-xs);
  }
}

.footer__address {
  line-height: 1.6;
  font-size: 14px;
  opacity: 1;
}

/* ナビ */
/* .footer__nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: var(--font-maru);
}

.footer__nav a {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    transition: .3s;
}

.footer__nav a:hover {
    opacity: .7;
} */

.footer__navList {
  font-family: var(--font-maru);
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer__navItem {
  display: flex;
  flex-direction: column;
  /* サブを下に落とす */
  /* gap: 8px; */
}

.footer__nav a {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  transition: 0.3s;
}

.footer__nav a:hover {
  color: var(--color-yellow);
}

/* サブメニュー */
.footer__subNav {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  /* gap: 6px; */
}

.footer__subNav a {
  /* font-size: 12px;
    font-weight: 700;
    opacity: .9; */
}

/* サブリンクの「・」っぽい点（任意） */
/* .footer__subNav a::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    margin-right: 8px;
    transform: translateY(-1px);
    opacity: .9;
} */

/* 区切り線 */
.footer__line {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.4);
  margin: 15px 0;
}

/* 下段 */
.footer__bottom {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24px;
}

.footer__bottom span {
  font-weight: 700;
}

.footer__related {
  display: flex;
  align-items: center;
  gap: 40px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer__related li {
  position: relative;
  line-height: 1;
}

.footer__related li:first-of-type {
  border: 1px solid #fff;
  font-size: 12px;
  padding: 5px 10px;
}

.footer__related li:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: rgba(255, 255, 255, 0.5);
}

.footer__related a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  transition: 0.3s;
}

.footer__related a:hover {
  color: var(--color-yellow);
}

/* SP */
@media (max-width: 767px) {
  .footer__top {
    flex-direction: column;
    gap: 30px;
  }

  .footer__brand {
    padding: 0 15px;
  }

  .footer__nav {
    width: 100%;
    padding: 0 15px;

    display: none;
  }

  .footer__navList {
    flex-direction: column;
    gap: 5px;
  }

  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 0 15px;
  }

  .footer__related {
    flex-wrap: wrap;
    gap: 12px 18px;
  }

  .footer__related li::after {
    /* display: none; */
  }

  .footer__navItem {
    gap: 5px;
  }

  .footer__subNav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    gap: 30px;
    justify-content: space-around;
  }

  .footer__related {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  /* 2つ目以降を横並び */
  .footer__related {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 30px;
  }

  .footer__related li:first-child {
    width: 100%;
    /* 1行使う */
    margin-bottom: 0;
  }

  .footer__related li:not(:first-child) {
    margin-right: 0;
  }

  .footer__related li:not(:last-child)::after {
    right: -15px;
    top: calc(50% + 2.5px);
    height: 15px;
  }

  .footer__related li:nth-child(1)::after,
  .footer__related li:nth-child(4)::after {
    display: none;
  }

  .footer__related a {
    font-size: 12px;
  }

  .site-footer {
    padding: 70px 0 40px;
    /* font-size: 14px; */
  }
}

.footer__insta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: #fff;
  transition: 0.3s;
}

.icon--insta {
  width: 20px;
  height: 20px;
  display: block;
}

.footer__insta:hover {
  color: #ffd200;
  /* 好きな色に */
}

/*----------------------------------------------*/
/*---------------- サービス_ページ ----------------*/
/*----------------------------------------------*/

.page-service {
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
}

/* ========== SERVICE HERO ========== */
.page-service .service-hero {
  position: relative;
  overflow: hidden;
  margin-top: 80px;
  padding-top: 50px;
  /* 青ドット背景：画像でもOK。とりあえずCSSで再現 */
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
}

.page-service .service-hero .title-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.section-title--jp-wrap {
  display: flex;
  gap: 30px;
}

.page-service .service-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  white-space: nowrap;
  border-bottom: 5px solid #fac715;
  padding-bottom: 10px;
}

.page-service .section-title--jp::before {
  -webkit-text-stroke: 5px var(--color-text);
}

.page-service .section-title--jp::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
  content: none;
}

.page-service .service-hero__inner {
  position: relative;
  min-height: 560px;
  /* ビジュアルが大きいので確保 */
}

.service-hero__text-wrap {
  display: flex;
  gap: 60px;
  justify-content: space-around;
  align-items: center;
  position: relative;
  z-index: 2;
}

/* 左：見出し */
.page-service .service-hero__left {
  position: relative;
  z-index: 2;
  max-width: 540px;
}

.page-service .service-hero__eyebrow {
  margin: 0 0 5px;
  font-weight: 700;
  color: #000000;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);
  font-size: 20px;
  font-family: var(--font-maru);
  position: relative;
  line-height: 1;
}

.page-service .service-hero__eyebrow>span {
  position: relative;
  z-index: 1;
  color: var(--color-text);
  text-shadow: none;
}

.page-service .service-hero__eyebrow::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-white);
  pointer-events: none;
}

.page-service .service-hero__title {
  margin: 0 0 16px;
  font-size: clamp(56px, 7vw, 110px);
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #ffd200;
  /* 黄色 */
  -webkit-text-stroke: 6px #1a1a1a;
  /* 黒フチ（太め） */
  text-shadow: 0 10px 0 rgba(0, 0, 0, 0.18);
}

/* タブ（なんでも屋業務 / 解体業務） */
.page-service .service-hero__tabs {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.page-service .service-hero__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
  color: #fff;
  text-decoration: none;
  border: 3px solid #fff;
  background: rgba(0, 0, 0, 0.08);
}

.page-service .service-hero__tab.is-active {
  background: #1a1a1a;
  border-color: #1a1a1a;
}

/* 右：コピー */
.page-service .service-hero__right {
  /* position: absolute;
    top: 40px;
    right: 0;
    z-index: 2;
    text-align: left;
    max-width: 420px; */
}

.page-service .service-hero__copy {
  margin: 0;
  font-size: clamp(20px, 2.4vw, 34px);
  font-weight: 900;
  color: #fff;
  line-height: 1.35;
  text-shadow: 0 4px 0 rgba(0, 0, 0, 0.2);
  font-family: var(--font-maru);
}

/* 前景ビジュアル（合成画像） */
.page-service .service-hero__visual {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(1200px, 120%);
  z-index: 1;
  margin: 0;
  pointer-events: none;
}

.page-service .service-hero__visual img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.06)) drop-shadow(0 28px 22px rgba(0, 0, 0, 0.1));
}

.page-service .top-service__body {
  width: 100%;
}

.page-service .top-intro {
  padding-bottom: 200px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
}

.page-service .top-intro .left-box {
  flex: 1;
  padding: 30px;
  background-color: rgb(40 131 223 / 60%);
  border-radius: 30px;
}

.page-service .top-intro .section-title {
  font-family: var(--font-maru);
  font-size: 50px;
  font-weight: var(--font-weight-black);
  color: var(--color-white);
  margin-bottom: var(--space-xs);
  line-height: 1.4;
}

.page-service .top-intro__text {
  font-family: var(--font-maru);
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  max-width: 650px;
  margin-bottom: var(--space-xs);
  line-height: 2.2;
}

.page-service .top-intro__lead {
  font-family: var(--font-maru);
  font-size: 22px;
  font-weight: var(--font-weight-bold);
  color: var(--color-yellow);
}

.page-service__intro-wrap {
  display: grid;
  padding: 0 30px;
  grid-template-columns: 520px 1fr;
  gap: 30px;
}

.page-service .top-intro .section-title span {
  color: #faa214;
}

.speech {
  --r: 18px;
  /* 角丸 */
  --bw: 3px;
  /* 枠線太さ */
  --tail-w: 18px;
  /* 三角の横幅 */
  --tail-h: 14px;
  /* 三角の高さ */

  position: relative;
  background: var(--bg);
  border: var(--bw) solid var(--bd);
  border-radius: var(--r);
  padding: 20px 22px;
  box-shadow: 0 10px 0 rgb(11 18 131 / 15%);
  color: #fff;
}

/* しっぽ（中の色） */
.speech::after {
  content: "";
  position: absolute;
  bottom: -40px;
  right: 50%;
  transform: translateX(100%);
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 50px solid rgb(26 137 232);
  margin-right: var(--bw);
  transform: rotate(90deg);
}

.page-service .top-cta.first-cta .top-cta__banner {
  z-index: 1;
}

.footer-before-cta {
  /* background: var(--color-white); */
  margin-bottom: -100px;
}

.top-intro .page-service__intro-wrap {
  align-items: flex-start;
}

.speech::after {
  content: "";
  position: absolute;
  top: 60px;
  right: 0;
  transform: translateX(100%);
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 50px solid rgb(26 137 232);
  margin-right: var(--bw);
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .page-service .top-intro__text {
    font-size: 18px;
  }

  .page-service .nandemoya .service-card__media {
    position: absolute;
    right: 0px;
    bottom: 40px;
    width: 50%;
  }

  .page-service .kaitai .service-card__media {
    position: absolute;
    left: 10px;
    bottom: 30px;
    width: 50%;
  }

  .page-service .top-intro {
    padding-top: 30px;
  }
}

/* SP調整 */
@media (max-width: 767px) {
  .page-service .service-hero {
    padding-top: 15px;
    padding-bottom: 50px;
  }

  .page-service .service-hero__inner {
    min-height: 350px;
  }

  .page-service .service-hero__right {
    position: relative;
    top: auto;
    right: auto;
    margin-top: 14px;
    max-width: none;
  }

  .page-service .service-hero__visual {
    width: 140%;
    bottom: -14px;
  }

  .page-service .top-cta.first-cta .row {
    position: relative;
    z-index: 1;
  }

  .page-service .top-works {
    padding-top: 80px;
  }

  .page-service .top-intro .row {
    flex-direction: column;
    padding: 0;
  }

  .page-service .top-intro .left-box {
    flex: 1;
    padding: 15px;
    background-color: rgb(40 131 223 / 60%);
    border-radius: 30px;
  }

  .page-service .top-intro .section-title {
    font-size: 26px;
    letter-spacing: -0.1rem;
    text-align: center;
  }

  .service-hero__text-wrap {
    display: block;
  }

  .page-service .top-intro {
    padding-top: 0;
    background-color: transparent;
  }

  .page-service .service-hero .section-title--jp {
    font-family: var(--font-maru);
    font-size: var(--font-size-lg);
    white-space: nowrap;
    border-bottom: 5px solid #fac715;
    padding-bottom: 10px;
  }

  .page-service .service-hero__copy {
    font-size: 32px;
    font-weight: var(--font-weight-bold);
  }

  .page-service .service-hero__eyebrow {
    margin-bottom: 10px;
  }

  .page-service .top-faq {
    padding-bottom: 15px;
  }

  .speech::after {
    content: "";
    position: absolute;
    top: auto;
    bottom: -40px;
    right: 50%;
    transform: translateX(100%);
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 50px solid rgb(26 137 232);
    margin-right: var(--bw);
    transform: rotate(90deg);
  }
}

/*----------------------------------------------*/
/*---------------- なんでも屋業務_ページ ----------------*/
/*----------------------------------------------*/
.page-nandemoya {
  background-color: var(--color-white);
  background-image: none;
}

.page-nandemoya .nandemoya-hero {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* margin-top: 80px; */
}

.nandemoya-hero-wrap {
  position: relative;
}

.nandemoya-hero {
  position: relative;
  overflow: hidden;
  /* はみ出し制御 */
}

/* テキスト側 */
.nandemoya-hero__inner {
  position: relative;
  z-index: 2;
  min-height: 500px;
}

/* 画像を右端へ */
.nandemoya-hero__visual {
  position: absolute;
  left: auto;
  right: 0;
  /* ← これが重要 */
  bottom: 0;
  width: 60vw;
  /* 右半分 */
  max-width: 100%;
  /* PC上限 */
  margin: 0;
  z-index: 1;
  transform: none;
}

.nandemoya-hero__visual img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.06)) drop-shadow(0 28px 22px rgba(0, 0, 0, 0.1));
}

.nandemoya-hero__text-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  z-index: 2;
  min-height: 500px;
}

.nandemoya-hero .section-title--jp-wrap {
  gap: 10px;
  flex-direction: column;
}

.nandemoya-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  border-bottom: 5px solid var(--color-pink);
  padding-bottom: 10px;
}

.nandemoya-hero .section-title--jp>span {
  font-size: 50px;
  color: var(--color-text);
}

.page-nandemoya .section-title--jp::before {
  content: none;
}

.page-nandemoya .section-title--jp::after {
  content: none;
}

.nandemoya-hero__left {
  position: relative;
  z-index: 2;
  max-width: 540px;
}

.page-nandemoya .section-title--lead {
  font-size: 20px;
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
}

.page-nandemoya .page-hero__catch {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: var(--space-md);
  margin-bottom: var(--space-sm);
}

.page-nandemoya .page-hero__catch-lead {
  font-family: var(--font-maru);
  font-size: 28px;
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

/*---------------- なんでも屋業務_対応範囲 ----------------*/
.page-section {
  padding: 60px 0;
}

.range__catch {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: var(--space-sm);
}

.range__catch-lead {
  font-family: var(--font-maru);
  font-size: 28px;
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

.section-contents-box {
  width: 100%;
}

.page-section .section-title {
  width: 100%;
  background-color: var(--color-pink);
  text-align: center;
  border-radius: 50px;
}

.page-section .section-title p {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  margin-bottom: var(--space-md);
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-section .section-title span {
  margin-left: 15px;
}

.range-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 40px;
  padding: 0 30px;
}

/* カード */
.range-card {
  display: flex;
  flex-direction: column;
}

.range-card__img {
  aspect-ratio: 3 / 2;
  border-radius: 16px;
  overflow: hidden;
  margin: 0;
  margin-bottom: var(--space-xs);
}

.range-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.range-card:hover .range-card__img img {
  transform: scale(1.05);
}

/* テキスト */
.range-card__title {
  margin: 0 0 10px;
  font-size: 22px;
  font-weight: 900;
  color: #ff2d6f;
  /* ピンク */
  font-size: var(--font-size-xl);
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.range-card__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}

.range__catch-footer {
  text-align: center;
  margin-top: var(--space-md);
}

.range__catch-footer .range__catch-lead {
  margin-bottom: var(--space-xs);
  text-decoration: underline;
  text-decoration-thickness: 4px;
  text-decoration-color: var(--color-yellow);
  text-underline-offset: 6px;
}

/*---------------- なんでも屋業務_料金について ----------------*/
.price .section-text {
  text-align: center;
}

/*---------------- なんでも屋業務_よくある質問 ----------------*/
.faq .section-text {
  text-align: center;
  margin-bottom: var(--space-sm);
}

.page-nandemoya .accordion-header {
  background-color: #ffebf3;
}

.page-nandemoya .accordion-header span {
  color: var(--color-pink);
}

.page-nandemoya .accordion-header span::before {
  color: var(--color-pink);
}

.page-nandemoya .accordion-header::before,
.page-nandemoya .accordion-header::after {
  background: var(--color-pink);
}

@media (max-width: 767px) {
  .nandemoya-hero__inner {
    min-height: 350px;
  }

  .nandemoya-hero__text-wrap {
    align-items: flex-start;
    min-height: 350px;
  }

  .nandemoya-hero .section-title--jp>span {
    font-size: 36px;
  }

  .page-nandemoya .section-title--lead {
    font-size: 18px;
    text-shadow: 0 2px 4px rgba(255, 255, 255, 0.8);
  }

  .nandemoya-hero__left {
    width: 100%;
  }

  .nandemoya-hero__visual {
    width: 100vw;
  }

  .range-grid {
    padding: 0 10px;
    grid-template-columns: 1fr;
  }

  .range-card__title {
    margin: 0 0 10px;
    font-size: 22px;
    line-height: 1;
    text-align: center;
  }

  .range__catch-text {
    text-align: left;
  }

  .page-nandemoya .page-hero__catch {
    margin: 0;
    margin-top: 15px;
  }

  .page-nandemoya .nandemoya-hero {
    padding-top: 70px;
  }

  .nandemoya-hero-wrap {
    position: relative;
    padding-top: 15px;
  }
}

/*----------------------------------------------*/
/*---------------- 解体業務_ページ ----------------*/
/*----------------------------------------------*/
.page-kaitai {
  background-color: var(--color-white);
  background-image: none;
}

.page-kaitai .kaitai-hero {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* margin-top: 80px; */
}

.kaitai-hero {
  position: relative;
  overflow: hidden;
  /* はみ出し制御 */
}

/* テキスト側 */
.kaitai-hero__inner {
  position: relative;
  z-index: 2;
  min-height: 500px;
}

/* 画像を右端へ */
.kaitai-hero__visual {
  position: absolute;
  left: auto;
  right: 0;
  /* ← これが重要 */
  bottom: 0;
  width: 60vw;
  /* 右半分 */
  max-width: 100%;
  /* PC上限 */
  margin: 0;
  z-index: 1;
  transform: none;
}

.kaitai-hero__visual img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.06)) drop-shadow(0 28px 22px rgba(0, 0, 0, 0.1));
}

.kaitai-hero__text-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  z-index: 2;
  min-height: 500px;
}

.kaitai-hero .section-title--jp-wrap {
  gap: 10px;
  flex-direction: column;
}

.kaitai-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  border-bottom: 5px solid var(--color-pink);
  padding-bottom: 10px;
}

.kaitai-hero .section-title--jp>span {
  font-size: 50px;
  color: var(--color-text);
}

.page-kaitai .section-title--jp::before {
  content: none;
}

.page-kaitai .section-title--jp::after {
  content: none;
}

.kaitai-hero__left {
  position: relative;
  z-index: 2;
  max-width: 540px;
}

.page-kaitai .section-title--lead {
  font-size: 20px;
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
}

.kaitai-hero-wrap {
  position: relative;
}

.page-kaitai .kaitai-hero .page-hero__catch-row {
  gap: 30px;
  align-items: flex-end;
  padding: 0 15px;
}

.page-kaitai .page-hero__catch {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: var(--space-md);
  /* margin-bottom: var(--space-sm); */
  flex: 1;
  border-left: 5px solid var(--color-pink);
  padding-left: 15px;
}

.page-kaitai .page-hero__catch:last-of-type {
  border-left: none;
}

.page-kaitai .page-hero__catch-lead {
  font-family: var(--font-maru);
  font-size: 28px;
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

.page-kaitai .range__catch-footer-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
  margin-bottom: 50px;
}

.page-kaitai .range__catch-footer-row .circle {
  border: 3px solid var(--color-pink);
  width: 150px;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.page-kaitai .range__catch-footer-row .circle p {
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
  font-size: var(--font-size-lg);
}

.range__catch-footer-list {
  color: var(--color-pink);
  text-align: left;
  font-size: var(--font-size-lg);
}

.page-kaitai .price .three-col {
  display: flex;
  justify-content: space-around;
  gap: 50px;
}

.page-kaitai .price .three-col .col {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
}

.page-kaitai .price .three-col .col img {
  height: 100px;
  margin-bottom: 10px;
}

.page-kaitai .price .three-col .title {
  font-size: var(--font-size-lg);
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

.faq .section-text {
  text-align: center;
  margin-bottom: var(--space-sm);
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .kaitai-hero__visual {
    position: absolute;
    left: auto;
    right: 10%;
    bottom: 0;
    width: 50vw;
    max-width: 100%;
    margin: 0;
    z-index: 1;
    transform: none;
  }

  .kaitai-hero__inner {
    min-height: 400px;
  }

  .kaitai-hero__left {
    max-width: 400px;
  }

  .kaitai-hero__text-wrap {
    min-height: 400px;
  }

  .kaitai-hero .page-hero__catch-text {
    font-size: 14px;
  }

  .range-card__title {
    font-size: var(--font-size-lg);
  }
}

@media (max-width: 767px) {
  .faq .section-text {
    text-align: left;
    padding: 0 10px;
  }
}

.page-kaitai .accordion-header {
  background-color: #ffebf3;
}

.page-kaitai .accordion-header span {
  color: var(--color-pink);
}

.page-kaitai .accordion-header span::before {
  color: var(--color-pink);
}

.page-kaitai .accordion-header::before,
.page-kaitai .accordion-header::after {
  background: var(--color-pink);
}

.page-kaitai .price .three-col .text {
  line-height: 1.5;
}

/* SP調整 */
@media (max-width: 767px) {
  .kaitai-hero__inner {
    min-height: auto;
    padding-top: 30px;
  }

  .kaitai-hero__visual {
    width: 30%;
    right: 15px;
    top: 0;
  }

  .kaitai-hero__text-wrap {
    align-items: flex-start;
    min-height: auto;
  }

  .kaitai-hero-wrap {
    position: relative;
  }

  .kaitai-hero__left {
    width: 100%;
  }

  .kaitai-hero .section-title--jp>span {
    font-size: 36px;
    width: 100%;
    position: relative;
    display: block;
    /* padding-bottom: 10px; */
  }

  .page-kaitai .section-title--lead {
    font-size: 18px;
    text-shadow: 0 2px 4px rgba(255, 255, 255, 0.8);
  }

  .page-kaitai .kaitai-hero .page-hero__catch-row {
    flex-direction: column;
    margin-top: 30px;
  }

  .page-kaitai .page-hero__catch {
    margin-top: 0;
    margin-bottom: 0;
  }

  .page-kaitai .page-hero__catch-text {
    font-size: 18px;
  }

  .page-section .section-title p {
    font-size: 20px;
    margin-bottom: var(--space-sm);
  }

  .page-kaitai .range-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px 40px;
    padding: 0 10px;
  }

  .page-kaitai .range-card__title {
    margin: 0 0 10px;
    font-size: 22px;
    line-height: 1;
    text-align: center;
  }

  .range-card__img {
    border-radius: 10px;
    margin-bottom: 10px;
  }

  .page-kaitai .range__catch-footer-row {
    gap: 15px;
    margin-bottom: 0;
    flex-direction: column;
  }

  .range__catch-footer-list {
    color: var(--color-pink);
    text-align: left;
    font-size: 20px;
    padding-left: 0;
    list-style: none;
  }

  .range__catch-lead {
    font-size: 24px;
    text-align: left;
  }

  .page-section {
    padding-bottom: 0;
  }

  .page-kaitai .price .three-col {
    flex-direction: column;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .page-kaitai .price .three-col .title {
    font-size: 26px;
  }

  .page-kaitai .price .three-col .text {
    font-size: 20px;
  }

  .page-kaitai .kaitai-hero {
    padding-top: 70px;
  }
}

/*----------------------------------------------*/
/*---------------- 会社案内_ページ ----------------*/
/*----------------------------------------------*/
.page-company .page-section {
  padding-top: 0;
}

.company-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  padding-bottom: 10px;
  margin-bottom: 15px;
}

.company-hero .section-title--jp span {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  border-bottom: 5px solid var(--color-blue);
  color: var(--color-text);
}

.company-hero {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* margin-top: 80px; */
}

.company-hero .section-title--jp-wrap {
  gap: 10px;
  flex-direction: column;
}

.company-hero-wrap {
  position: relative;
}

.company-hero__inner {
  position: relative;
  z-index: 2;
  min-height: 300px;
}

.company-hero__text-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  z-index: 2;
  min-height: 300px;
}

.company-hero__left {
  position: relative;
  /* z-index: 2; */
  max-width: 540px;
}

.company-hero .section-title--lead {
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
}

.page-company .section-title--jp::before {
  content: none;
}

.page-company .page-section .section-title {
  width: 100%;
  background-color: var(--color-blue);
  text-align: center;
  border-radius: 50px;
}

.page-section.message {
  padding-top: 0;
}

.page-section.message .page-section-grid {
  display: grid;
  grid-template-columns: 300px 500px;
  gap: 50px;
  justify-content: center;
  align-items: flex-end;
  margin-top: -80px;
}

.page-section.message .text-col p {
  margin-bottom: var(--space-sm);
}

.page-section.message .text-col p:last-child {
  margin-bottom: 0;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .page-section.message .page-section-grid {
    align-items: center;
  }

  .page-section.message .text-col p {
    margin-bottom: var(--space-xs);
  }
}

/*---------------- 会社概要 + 沿革 ----------------*/
.company-table-section {
  /* padding: 80px 0; */
}

.company-table-title {
  background: linear-gradient(90deg, #1e90d4, #167cc1);
  color: #fff;
  text-align: center;
  padding: 18px 0;
  border-radius: 40px;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 50px;
}

.company-table {
  width: 100%;
  border-collapse: collapse;
  max-width: 700px;
  margin: 0 auto;
}

.company-table th,
.company-table td {
  padding: 20px 10px;
  border-bottom: 1px solid #6aaedb;
  vertical-align: top;
  font-size: 15px;
}

.company-table tr:first-child th,
.company-table tr:first-child td {
  border-top: 1px solid #6aaedb;
}

.company-table th {
  width: 25%;
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  text-align: left;
}

.company-table td {
  width: 75%;
  color: #222;
}

/* =========================
   スマホ対応
========================= */
@media (max-width: 767px) {

  .company-table th,
  .company-table td {
    display: block;
    width: 100%;
  }

  .company-table tr {
    margin-bottom: 20px;
    display: block;
    padding: 0 10px;
  }

  .company-table th {
    font-weight: 700;
    padding-bottom: 5px;
    border-bottom: none;
    padding-top: 0;
  }

  .company-table td {
    padding-top: 0;
    border-bottom: 1px solid #6aaedb;
  }

  .company-table tr:last-child td {
    border-bottom: none;
  }

  .company-hero .section-title--jp {
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .company-hero .section-title--jp span {
    font-size: 36px;
    width: 100%;
    position: relative;
    display: block;
    padding-bottom: 10px;
  }

  .company-hero .section-title--lead {
    font-size: 18px;
  }

  .company-hero__text-wrap {
    align-items: flex-start;
    min-height: 350px;
  }

  .company-hero-wrap {
    position: relative;
  }

  .company-hero__inner {
    min-height: auto;
    padding-top: 30px;
  }

  .company-hero__text-wrap {
    min-height: auto;
  }

  .company-hero {
    margin-bottom: 50px;
    padding-top: 70px;
  }

  .page-section.message .page-section-grid {
    display: flex;
    gap: 50px;
    justify-content: center;
    align-items: flex-start;
    margin-top: 0;
    flex-direction: column-reverse;
    padding: 0 10px;
  }

  .page-section .section-title p {
    margin-bottom: var(--space-xs);
    padding: 10px;
  }

  .page-section.message .text-col p {
    margin-bottom: var(--space-xs);
  }

  .company-table tr:first-child th,
  .company-table tr:first-child td {
    border-top: none;
  }

  .business .flex-col {
    flex-direction: column;
    padding: 0 10px;
  }

  .business .flex-col .col {
    width: 100%;
  }
}

/*---------------- 事業内容 ----------------*/
.business .flex-col {
  display: flex;
  gap: 100px;
  justify-content: center;
  align-items: flex-start;
  max-width: 700px;
  margin: 0 auto;
}

.business .flex-col .col {
  width: 350px;
}

.business .flex-col .col .title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-blue);
  color: var(--color-blue);
  font-weight: 700;
  text-decoration: none;
  background: #fff;
  transition: 0.3s ease;
  margin-bottom: var(--space-xs);
}

.business .flex-col .col .text {
  padding: 0 15px;
}

/*---------------- アクセスマップ ----------------*/
.access .flex-col {
  display: flex;
  flex-direction: column;
  gap: 50px;
}

.access .flex-col .col {
  padding: 0 50px;
  text-align: center;
}

.access .flex-col iframe {
  width: 100%;
  height: 500px;
}

@media (max-width: 767px) {
  .business .flex-col .col {
    width: 100%;
  }

  .page-section.business .section-title p {
    margin-bottom: var(--space-sm);
  }

  .business .flex-col .col .text {
    padding: 0 10px;
  }

  .business .flex-col {
    gap: 30px;
  }

  .page-company .page-section.business {
    margin-bottom: 50px;
  }

  .access .flex-col .col {
    padding: 0 10px;
    text-align: left;
    display: flex;
    flex-direction: column-reverse;
    gap: 15px;
  }

  .access .flex-col .col .title {
    font-size: 18px;
    font-weight: bold;
  }
}

/*----------------------------------------------*/
/*---------------- 採用情報_ページ ----------------*/
/*----------------------------------------------*/
.page-recruit {
  background-color: #fff;
}

.page-recruit .recruit-hero {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  padding-bottom: 50px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
}

.page-recruit .recruit-hero__inner {
  position: relative;
  min-height: 560px;
}

.recruit-hero__text-wrap {
  display: flex;
  /* gap: 60px; */
  justify-content: space-between;
  position: relative;
  z-index: 2;
  flex-direction: column-reverse;
  /* height: 600px; */
  min-height: 560px;
}

.page-recruit .recruit-hero__left {
  position: relative;
  z-index: 2;
  max-width: 540px;
}

.page-recruit .recruit-hero .title-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.page-recruit .recruit-hero__eyebrow {
  margin: 0 0 5px;
  font-weight: 700;
  color: #000000;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);
  font-size: 20px;
  font-family: var(--font-maru);
  position: relative;
  line-height: 1;
}

.page-recruit .recruit-hero__copy {
  margin: 0;
  font-size: clamp(20px, 2.4vw, 34px);
  font-weight: 900;
  color: var(--color-blue);
  line-height: 1.35;
  /* text-shadow: 0 4px 0 rgba(0, 0, 0, .2); */
  font-family: var(--font-maru);
}

.page-recruit .recruit-hero__visual {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(1200px, 120%);
  z-index: 1;
  margin: 0;
  pointer-events: none;
}

.page-recruit .recruit-hero__visual img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.06)) drop-shadow(0 28px 22px rgba(0, 0, 0, 0.1));
}

.page-recruit .recruit-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  white-space: nowrap;
}

.page-recruit .section-title--jp::before {
  -webkit-text-stroke: 5px var(--color-text);
}

.page-recruit .section-title--jp::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

.page-recruit .section-title--en>span {
  position: relative;
  z-index: 1;
  color: var(--color-blue);
}

.recruit-hero__right {
  text-align: center;
  position: relative;
  top: 100px;
}

/* なんでも屋ってどんな会社？ */
.page-recruit .page-section .section-title {
  width: 100%;
  background-color: var(--color-blue);
  text-align: center;
  border-radius: 50px;
}

.page-recruit .page-section.hatena .flex-col {
  display: flex;
  max-width: 100%;
  padding: 0 30px;
  gap: 50px;
}

.page-recruit .page-section.hatena .flex-col .col {
  flex: 1;
}

.page-recruit .page-section.hatena .col .title {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  line-height: 1.4;
  margin-bottom: var(--space-xs);
}

.page-recruit .page-section.hatena .col .text {
  font-size: var(--font-size-md);
  color: var(--color-text);
}

.hatena-carousel {
  margin: 60px 0;
}

.hatena-splide .splide__slide {
  border-radius: 10px;
  overflow: hidden;
}

.hatena-splide img {
  width: 100%;
  /* height: 320px; */
  aspect-ratio: 3 / 2;
  object-fit: cover;
  display: block;
}

/* PC */
@media (min-width: 768px) {
  .hatena-splide img {
    /* height: 380px; */
  }
}

.hatena .splide-container {
  padding: 0;
  margin-top: var(--space-md);
}

.hatena__catch-footer {
  text-align: center;
  margin-top: var(--space-lg);
}

.hatena__catch-footer-list {
  color: var(--color-pink);
  text-align: left;
  font-size: var(--font-size-lg);
}

.hatena__catch-footer-list {
  display: flex;
  gap: 50px;
}

.hatena__catch-footer-list .col {
  flex: 1;
}

.hatena__catch-lead {
  font-family: var(--font-maru);
  font-size: 28px;
  font-weight: var(--font-weight-bold);
  color: var(--color-blue);
  margin-top: var(--space-sm);
  text-decoration: underline;
  text-decoration-thickness: 4px;
  text-decoration-color: var(--color-yellow);
  text-underline-offset: 6px;
}

.hatena__catch-footer-list .col .circle {
  border: 3px solid var(--color-blue);
  width: 180px;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;

  aspect-ratio: 1 / 1;
  margin: 0 auto 12px;
  border-radius: 50%;

  /* 外枠（青っぽい線） */
  border: 3px solid #3aa6e6;

  /* 背景：黄色の水玉 */
  background-color: #fff;
  /* ベース白 */
  background-image: radial-gradient(circle,
      rgba(255, 210, 0, 0.55) 2.5px,
      transparent 2.6px);
  background-size: 10px 10px;
  /* 水玉の間隔 */
  background-position: 0 0;
}

.hatena__catch-footer-list .col .circle p {
  color: var(--color-blue);
}

.hatena__catch-lead.first {
  text-decoration: none;
  margin-top: 0;
  margin-bottom: var(--space-sm);
}

.hatena__cta {
  display: flex;
  justify-content: center;
  margin-top: var(--space-md);
}

.hatena__cta a {
  font-size: var(--font-size-lg);
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  display: flex;
  align-items: center;
  gap: 5px;
}

.hatena__cta-arrow {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--color-blue);
  background-color: var(--color-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--color-white);
  transition: 0.3s;
}

.hatena__cta-arrow svg {
  width: 20px;
  height: 20px;
}

.do-business .flex-col {
  display: flex;
  gap: 100px;
  justify-content: center;
  align-items: flex-start;
  /* max-width: 700px; */
  margin: 0 auto;
}

.do-business .flex-col .col {
  width: 400px;
}

.do-business .flex-col .col .title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-blue);
  color: var(--color-blue);
  font-weight: 700;
  text-decoration: none;
  background: #fff;
  transition: 0.3s ease;
  margin-bottom: var(--space-xs);
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
}

.do-business .flex-col .col .text {
  padding: 0 15px;
}

.do-business .description {
  font-family: var(--font-maru);
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-regular);
  margin-bottom: var(--space-md);
  text-align: center;
}

.do-business .description span {
  color: var(--color-blue);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
}

.page-recruit .faq .section-title p::before {
  content: "";
  display: inline-block;
  width: 27px;
  height: 38px;
  margin-top: 0;
  margin-right: 10px;
  background: currentColor;
  -webkit-mask: url(../images/recruit/faq/mark.svg) no-repeat center / contain;
  mask: url(../images/recruit/faq/mark.svg) no-repeat center / contain;
}

.page-recruit .faq .section-title p {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  margin-bottom: var(--space-md);
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-recruit .faq-question__wrap {
  position: relative;
  background: #e6f4fe;
  padding: 10px 5px 10px 75px;
  cursor: pointer;
  border-radius: 10px;
}

.page-recruit .faq-question__title {
  font-weight: bold;
  color: var(--color-blue);
  font-size: 20px;
  position: relative;
}

.page-recruit .faq-question__title::before {
  content: "Q"counter(faq-number) ".";
  position: absolute;
  color: var(--color-blue);
  top: 50%;
  left: -40px;
  transform: translateY(-50%);
  font-weight: bold;
}

.minus-icon {
  background: var(--color-blue);
}

.plus-icon {
  background: var(--color-blue);
}

/* ---------------------------------- */
/* 必須 */
.accordion {
  max-width: 700px;
  margin: 0 auto;
  counter-reset: faq;
}

.accordion-content {
  display: none;
}

.accordion-header {
  background-color: #e6f4fe;
  padding: 12px 45px 10px 20px;
  margin: 10px 0 0;
  transition: background 0.3s ease;
  cursor: pointer;
  position: relative;
  counter-increment: faq;
  border-radius: 10px;
}

.accordion-header::before,
.accordion-header::after {
  position: absolute;
  content: "";
  top: 1px;
  right: 20px;
  bottom: 0;
  width: 12px;
  height: 2px;
  margin: auto;
  background: var(--color-blue);
}

.accordion-header::after {
  transform: rotate(-90deg);
  transition: transform 0.3s;
}

.accordion-header.active::after {
  transform: rotate(0deg);
}

.accordion-content {
  background-color: #fff;
  padding: 12px 45px 10px 20px;
}

.accordion-header span,
.accordion-content span {
  padding-left: 25px;
  position: relative;
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  display: flex;
  align-items: flex-start;
}

.accordion-header span {
  color: var(--color-blue);
}

.accordion-content span {
  color: var(--color-text);
}

.accordion-header span::before {
  /* position: absolute; */
  content: "Q"counter(faq) ".";
  /* top: 2px;
    left: 0; */
  color: #151e2f;
  font-size: var(--font-size-lg);
  margin-right: 10px;
  color: var(--color-blue);
}

.accordion-content span::before {
  position: relative;
  content: "A.";
  /* top: 3px;
    left: 0; */
  color: var(--color-text);
  font-size: var(--font-size-lg);
  margin-right: 10px;
  padding-left: 10px;
}

/* hover */
.accordion-header:hover {
  background-color: #f2f2f2;
}

@media (max-width: 767px) {
  .accordion {
    max-width: 100%;
    padding: 0 10px;
  }

  .accordion-header span,
  .accordion-content span {
    padding-left: 0;
    font-size: 18px;
  }

  .accordion-header span::before {
    font-size: 18px;
  }

  .accordion-header::before,
  .accordion-header::after {
    right: 15px;
  }

  .accordion-header {
    padding-left: 15px;
  }

  .accordion-content {
    padding-right: 15px;
    padding-left: 15px;
  }

  .accordion-content span::before {
    padding-left: 5px;
  }

  .accordion-content span::before {
    font-size: 18px;
  }
}

/* メリット */
.merit .flex-box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.merit .circle-col {
  border: 3px solid var(--color-blue);
  width: calc((100% - 60px) / 3);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  aspect-ratio: 1 / 1;
  margin: 0 auto 12px;
  border-radius: 50%;
  border: 3px solid #3aa6e6;
  background-color: #fff;
  background-image: radial-gradient(circle,
      rgba(255, 210, 0, 0.55) 2.5px,
      transparent 2.6px);
  background-size: 10px 10px;
  background-position: 0 0;
  padding: 0 60px;
  gap: 15px;
}

.merit .circle-col .title {
  color: var(--color-blue);
  font-family: var(--font-maru);
  font-size: 26px;
  line-height: 1.4;
  text-align: center;
  font-weight: var(--font-weight-bold);
}

.merit .circle-col .text {
  color: var(--color-text);
  font-family: var(--font-maru);
  font-size: 18px;
  line-height: 1.6;
}

/* 応募の流れ */
/* ===== ざっくり変数（色・幅） ===== */
:root {
  --flow-blue: #0a8fe8;
  --flow-blue-soft: #d7f0ff;
  --flow-line: #0a8fe8;
  --flow-text: #222;
  --flow-max: 980px;

  /* 左の縦ライン位置（PC） */
  --line-x: 190px;
}

.flow {
  padding: 60px 16px 80px;
  /* background: #fff; */
  color: var(--flow-text);
}

.flow__inner {
  max-width: var(--flow-max);
  margin: 0 auto;
}

/* タイトル（上の丸い帯） */
.flow__headline {
  width: min(760px, 100%);
  margin: 0 auto 48px;
  padding: 18px 24px;
  text-align: center;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #fff;
  background: var(--flow-blue);
  border-radius: 999px;
  font-size: clamp(18px, 2.2vw, 26px);
}

/* リスト全体：縦ラインを疑似要素で描く */
.flow__list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

/* 縦ライン */
.flow__item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 190px;
  /* ライン位置 */
  top: 40px;
  bottom: -60px;
  /* 次のSTEPまで伸ばす */
  width: 3px;
  background: #0a8fe8;
}

/* 各ステップ */
.flow__item {
  position: relative;
  padding-left: calc(var(--line-x) - 40px);
  /* ラインより少し左から始める */
}

/* ステップ間の余白（画像の“間隔感”） */
.flow__item+.flow__item {
  margin-top: 60px;
}

/* STEPの帯（丸い枠） */
.flow__bar {
  width: min(720px, 100%);
  display: flex;
  align-items: center;
  border: 2px solid var(--flow-blue);
  border-radius: 999px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 14px;
  /* ラインの上に来るように */
  position: relative;
  z-index: 1;
  height: 60px;
  font-family: var(--font-maru);
}

/* 左のSTEP部分 */
.flow__step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  padding: 12px 16px;
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.08em;
  color: var(--flow-blue);
  background: var(--flow-blue-soft);
  border-right: 2px solid var(--flow-blue);
  height: 60px;
  font-size: 22px;
}

/* 右のタイトル部分 */
.flow__title {
  padding: 12px 18px;
  font-weight: var(--font-weight-bold);
  color: var(--flow-blue);
  font-size: 22px;
}

/* 説明文 */
.flow__text {
  margin: 0;
  padding-left: 140px;
  /* 画像のように説明文を右に寄せる */
  line-height: 1.9;
  font-size: 14.5px;
}

/* ===== レスポンシブ（SP） ===== */
@media (max-width: 767px) {
  :root {
    --line-x: 34px;
    /* スマホは左寄せに */
  }

  .flow__headline {
    margin-bottom: 28px;
  }

  .flow__item {
    padding-left: 0;
  }

  .flow__bar {
    width: 100%;
    margin-left: 0;
  }

  .flow__step {
    min-width: 92px;
    padding: 10px 12px;
    font-size: 13px;
  }

  .flow__title {
    font-size: 15px;
    padding: 10px 12px;
  }

  .flow__text {
    padding-left: 105px;
    padding-right: 15px;
    font-size: 14px;
  }

  .flow__list::before {
    top: 6px;
    bottom: 6px;
    width: 3px;
  }
}

/* 募集要項 */
.recruitment {
  /* background: #fff; */
  color: var(--text);
}

.recruitment__inner {
  max-width: 900px;
  margin: 0 auto;
}

/* Tabs（画像のピル形） */
.recruit-tabs {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
}

.recruit-tabs__btn {
  appearance: none;
  border: 2px solid var(--color-blue);
  border-bottom: none;
  background: #fff;
  color: var(--blue);
  font-weight: var(--font-weight-bold);
  padding: 12px 26px;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  cursor: pointer;
  line-height: 1;
  letter-spacing: 0.02em;
  transition:
    transform 0.12s ease,
    background 0.12s ease;
  color: var(--color-blue);
  font-family: var(--font-maru);
  flex: 1;
}

.recruit-tabs__btn:hover {
  background-color: #cce9fd;
}

.recruit-tabs__btn.is-active {
  background: #cce9fd;
}

/* Panel */
.recruit-panel {
  margin-top: 0;
}

/* Table（2カラム＋青い罫線） */
.recruit-table {
  /* width: min(820px, 100%); */
  margin: 0 auto;
  border-collapse: collapse;
  table-layout: fixed;
}

.recruit-table tr {
  border-bottom: 2px solid var(--color-blue);
}

.recruit-table tr:first-child {
  border-top: 2px solid var(--color-blue);
}

.recruit-table th,
.recruit-table td {
  padding: 22px 18px;
  vertical-align: middle;
  font-size: 14.5px;
  line-height: 1.9;
}

.recruit-table th {
  width: 190px;
  color: var(--color-blue);
  font-weight: var(--font-weight-regular);
  text-align: left;
}

.recruit-table td {
  color: var(--text);
}

/* CTA */
.recruit-cta {
  margin-top: var(--space-md);
  text-align: center;
}

.recruit-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-yellow);
  color: var(--color-text);
  font-weight: 700;
  text-decoration: none;
  background: var(--color-yellow);
  transition: 0.3s ease;
}

.recruit-cta__btn::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.recruit-cta__btn:hover {
  background-color: var(--color-text);
  border-color: var(--color-text);
  color: var(--color-yellow);
}

.recruit-cta__note {
  margin-top: var(--space-sm);
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  color: var(--color-blue);
  font-weight: var(--font-weight-bold);
  color: var(--color-blue);
  margin-top: var(--space-sm);
  text-decoration: underline;
  text-decoration-thickness: 4px;
  text-decoration-color: var(--color-yellow);
  text-underline-offset: 6px;
  text-align: center;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .merit .circle-col .title {
    font-size: 22px;
  }

  .merit .circle-col .text {
    font-size: 16px;
    line-height: 1.6;
  }
}

/* SP：tableを縦積み（忠実＋読みやすい） */
@media (max-width: 767px) {

  .recruit-table,
  .recruit-table tbody,
  .recruit-table tr,
  .recruit-table th,
  .recruit-table td {
    display: block;
    width: 100%;
  }

  .recruit-table tr {
    padding: 0;
  }

  .recruit-table th {
    padding: 12px 0 6px;
    font-size: 16px;
    font-weight: bold;
  }

  .recruit-table td {
    padding: 0 0 14px;
    font-size: 16px;
  }

  .page-recruit .recruit-hero__inner {
    position: relative;
    min-height: 300px;
    padding-top: 30px;
  }

  .recruit-hero__text-wrap {
    min-height: auto;
    flex-direction: column;
    justify-content: flex-start;
    gap: 15px;
  }

  .recruit-hero__right {
    text-align: left;
    position: relative;
    top: 0;
  }

  .page-recruit .recruit-hero .section-title--jp {
    font-size: var(--font-size-lg);
  }

  .page-recruit .recruit-hero {
    padding-top: 70px;
    padding-bottom: 0;
  }

  .page-recruit .page-section.hatena .flex-col {
    padding: 0 10px;
    gap: 15px;
    flex-direction: column-reverse;
  }

  .page-section.hatena {
    padding-top: 30px;
  }

  .page-recruit .page-section.hatena .col .title {
    font-size: 26px;
  }

  .hatena__catch-footer {
    width: 100%;
    margin-top: 30px;
  }

  .hatena__catch-lead.first p {
    line-height: 1.4;
  }

  .hatena__catch-footer-list {
    display: flex;
    gap: 30px;
    flex-direction: column;
    padding: 10px;
  }

  .do-business .description {
    text-align: left;
    padding: 0 10px;
  }

  .do-business .flex-col {
    flex-direction: column;
    width: 100%;
    gap: 50px;
  }

  .do-business .flex-col .col {
    width: 100%;
  }

  .do-business .flex-col .col .text {
    padding: 0 10px;
  }

  .page-recruit .faq .section-title p {
    font-size: 24px;
  }

  .page-recruit .faq .section-title p::before {
    width: 20px;
    height: 28px;
  }

  .merit .circle-col {
    width: 100%;
  }

  .page-recruit .page-section.merit .section-title {
    margin-bottom: 30px;
  }

  .merit .circle-col {
    width: 100%;
    margin-bottom: 0;
  }

  .flow__list {
    padding: 0 15px;
  }

  .flow__item:not(:last-child)::after {
    left: 50px;
  }

  .recruit-tabs__btn {
    font-size: 12px;
    padding: 10px 5px;
    line-height: 1.2;
  }

  .recruit-tabs {
    gap: 10px;
  }

  .recruitment {
    padding: 0;
    margin-top: 50px;
  }

  .recruitment__inner {
    max-width: 100%;
    padding: 0 10px;
  }

  .page-section.recruitment .section-title p {
    margin-bottom: var(--space-sm);
    padding: 10px;
  }

  .recruit-cta__note {
    font-family: var(--font-maru);
    font-size: 28px;
    font-weight: var(--font-weight-bold);
    color: var(--color-blue);
    margin-top: var(--space-sm);
    text-decoration: underline;
    text-decoration-thickness: 4px;
    text-decoration-color: var(--color-yellow);
    text-underline-offset: 6px;
    text-align: justify;
  }
}

/*----------------------------------------------*/
/*---------------- お問い合わせ_ページ ----------------*/
/*----------------------------------------------*/
.contact-hero {
  position: relative;
  overflow: hidden;
  padding-top: 50px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* margin-top: 80px; */
  margin-bottom: 30px;
  margin-top: 80px;
}

.contact-hero .section-title--lead {
  font-family: var(--font-maru);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

.contact-hero .section-title--jp-wrap {
  gap: 10px;
  flex-direction: column;
}

.contact-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  padding-bottom: 10px;
  margin-bottom: 15px;
}

.contact-hero .section-title--jp::before {
  content: none;
}

.contact-hero .section-title--jp span {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  border-bottom: 5px solid var(--color-blue);
  color: var(--color-text);
}

.contact-hero__text-wrap {
  align-items: flex-end;
}

.contact-hero__left {
  flex: 1;
}

.contact-hero__right {
  flex: 1;
}

.page-section .section-title span {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-regular);
  color: var(--color-white);
}

.page-contact .description {
  margin-bottom: var(--space-sm);
  text-align: center;
}

.page-contact .description p {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
}

.page-contact .description span {
  font-size: var(--font-size-md);
  display: block;
}

.soudan-cta__box {
  display: grid;
  gap: 20px;
}

.page-contact .soudan-cta__tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--color-pink);
  text-decoration: none;
  font-size: var(--font-size-xxl);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.page-contact .soudan-cta__tel:nth-child(1) {
  font-size: var(--font-size-xxxl);
}

.page-contact .soudan-cta__telIcon {
  width: 50px;
  height: 50px;
  background: var(--color-pink);
  -webkit-mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
  mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
}

.page-contact .soudan-cta__tel:nth-child(1) .soudan-cta__telIcon {
  width: 80px;
  height: 80px;
  background: var(--color-pink);
  -webkit-mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
  mask: url(../images/top/mitsumori/primary.svg) no-repeat center / contain;
}

.page-contact .soudan-cta__telNum {
  letter-spacing: 0.02em;
  line-height: 1;
}

.page-contact .soudan-cta__telTag {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--color-pink);
}

.page-contact .soudan-cta__tel:nth-child(1) .soudan-cta__telTag {
  font-size: var(--font-size-xl);
}

.page-contact .soudan-cta__telIcon--mobile {
  mask: url(../images/common/phone.svg) center center / contain no-repeat;
}

/* お問い合わせフォーム */
/* ざっくり変数（サイトの青に寄せる） */
:root {
  --c-blue: #0a8fe8;
  --c-blue-soft: #d7f0ff;
  --c-text: #1a1a1a;
  --c-muted: #6b7280;
  --c-line: #d9e2ec;
  --c-bg: #ffffff;
  --c-field: #f7fafc;
  --c-danger: #e11d48;

  --radius: 14px;
}

/* 全体の枠 */
.form-box {
  width: min(860px, 100%);
  margin: 28px auto 0;
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  border-radius: 18px;
  padding: clamp(18px, 2.4vw, 28px);
  /* box-shadow: 0 14px 26px rgba(0, 0, 0, .06); */
}

/* 行 */
.contact-form {
  display: grid;
  /* gap: 18px; */
}

/* 2カラム（PC） */
.form-row {
  display: grid;
  grid-template-columns: 220px 1fr;
  align-items: baseline;
  gap: 10px;
  padding: 20px 10px;
  border-bottom: 1px solid var(--c-line);
}

.form-soudan-row {
  align-items: center;
}

.form-row:last-of-type {
  border-bottom: none;
}

/* ラベル */
.form-label {
  font-weight: 800;
  color: var(--c-text);
  line-height: 1.5;
}

/* 必須 */
.req {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  background: var(--c-blue);
  border-radius: 999px;
  letter-spacing: 0.04em;
}

/* 入力 */
.form-field input,
.form-field textarea,
.form-field select {
  width: 100%;
  border: 1px solid var(--c-line);
  background: var(--c-field);
  /* border-radius: var(--radius); */
  padding: 12px 14px;
  font-size: 16px;
  color: var(--c-text);
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

.form-field textarea {
  resize: vertical;
  min-height: 160px;
}

.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus {
  border-color: var(--c-blue);
  box-shadow: 0 0 0 4px rgba(10, 143, 232, 0.18);
  background: #fff;
}

.form-note {
  margin: 8px 0 0;
  font-size: 12.5px;
  color: var(--c-muted);
}

/* セレクト矢印（ブラウザ差を吸収） */
.select-wrap {
  position: relative;
}

.select-wrap::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--c-blue);
  border-bottom: 2px solid var(--c-blue);
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}

.form-field select {
  appearance: none;
  padding-right: 44px;
}

/* ラジオ */
.radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  padding-top: 6px;
}

.radio {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  padding: 8px 12px;
  border: 1px solid var(--c-line);
  background: #fff;
  border-radius: 999px;
  transition:
    border-color 0.15s ease,
    background 0.15s ease,
    transform 0.12s ease;
}

.radio:hover {
  transform: translateY(-1px);
}

.radio input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.radio-ui {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid var(--c-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.radio-ui::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--c-blue);
  transform: scale(0);
  transition: transform 0.12s ease;
}

.radio input:checked+.radio-ui::after {
  transform: scale(1);
}

.radio input:checked~.radio-text {
  font-weight: 800;
  color: var(--c-blue);
}

.radio input:checked {
  /* dummy */
}

.radio:has(input:checked) {
  border-color: rgba(10, 143, 232, 0.55);
  background: rgba(215, 240, 255, 0.55);
}

.radio-text {
  font-size: 14.5px;
  color: var(--c-text);
}

/* 送信 */
.form-actions {
  padding-top: 30px;
  text-align: center;
}

.btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-width: 260px;
  padding: 16px 22px;
  border: none;
  border-radius: 999px;
  background: var(--color-yellow);
  color: var(--color-text);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.04em;
  cursor: pointer;
  /* box-shadow: 0 14px 26px rgba(10, 143, 232, .25); */
  transition: 0.3s;
}

.btn-submit::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.btn-submit:hover {
  color: var(--color-yellow);
  border-color: var(--color-text);
  background-color: var(--color-text);
}

.form-privacy {
  margin: 14px 0 0;
  color: var(--c-muted);
  font-size: 13px;
  line-height: 1.7;
}

.contact-hero .section-title--lead-box {
  list-style: none;
  padding-left: 0;
  display: table;
}

.contact-hero .section-title--lead {
  display: table-row;
  line-height: 1.4;
}

.contact-hero .section-title--lead::before {
  content: "•";
  display: table-cell;
  padding-right: 0.4em;
}

.contact-hero .section-title--lead::after {
  content: "";
  display: block;
  margin-bottom: 0.5em;
}

/* CF7 ラジオをまず確実に表示させる */
.radio-group input[type="radio"] {
  position: static !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  appearance: radio !important;
  -webkit-appearance: radio !important;
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 8px 0 0 !important;
  vertical-align: middle;
}

.radio-group .wpcf7-list-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  padding: 8px 12px;
  border: 1px solid var(--c-line);
  background: #fff;
  border-radius: 999px;
  transition:
    border-color 0.15s ease,
    background 0.15s ease,
    transform 0.12s ease;
}

.radio-group .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.radio-group .wpcf7-list-item-label {
  display: inline-block;
}

/* 以前の自作ラジオ装飾を無効化 */
.radio-group .wpcf7-list-item-label::before,
.radio-group .wpcf7-list-item-label::after {
  content: none !important;
}

.form-actions {
  position: relative;
  text-align: center;
}

.form-actions .wpcf7-submit,
.form-actions .btn-submit {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.form-actions .wpcf7-spinner {
  position: absolute;
  top: 50%;
  left: calc(50% + 120px);
  transform: translateY(-50%);
  margin: 0;
}

.wpcf7 form.submitting .wpcf7-submit {
  opacity: 0.7;
  pointer-events: none;
}

/* SP：縦積み */
@media (max-width: 767px) {
  .form-row {
    grid-template-columns: 1fr;
    padding: 12px 0;
  }

  .form-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .req {
    margin-left: 12px;
  }

  .btn-submit {
    width: 100%;
    min-width: 0;
  }

  .contact-hero {
    padding-top: 70px;
    margin-top: 0;
    margin-bottom: 0;
  }

  .contact-hero__text-wrap {
    align-items: flex-start;
    flex-direction: column;
  }

  .contact-hero .section-title--jp span {
    width: 100%;
    display: block;
    font-size: 36px;
    border-bottom: none;
  }

  .contact-hero-wrap {
    position: relative;
    padding-top: 15px;
  }

  .contact-hero .section-title--jp {
    font-family: var(--font-maru);
    font-size: 50px;
    white-space: nowrap;
    padding-bottom: 10px;
    margin-bottom: 0;
    border-bottom: 5px solid var(--color-blue);
  }

  .contact-hero .section-title--jp-wrap .section-text {
    padding: 0 10px;
  }

  .contact-hero .section-title--jp-wrap .section-title--lead-box {
    padding: 0 10px;
  }

  .contact-hero__right {
    padding: 0 10px;
  }

  .page-section.soudan .section-title p {
    flex-direction: column;
    line-height: 1;
    gap: 5px;
    padding: 15px 0;
  }

  .page-contact .description p {
    font-size: var(--font-size-lg);
  }

  .page-contact .soudan-cta__tel {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 10px;
    padding: 0 10px;
    box-sizing: border-box;
  }

  .page-contact .soudan-cta__tel .soudan-cta__telIcon {
    order: 2;
  }

  .page-contact .soudan-cta__tel:nth-child(1) .soudan-cta__telIcon,
  .page-contact .soudan-cta__tel:nth-child(2) .soudan-cta__telIcon,
  .page-contact .soudan-cta__tel:nth-child(3) .soudan-cta__telIcon {
    width: 40px;
    height: 40px;
  }

  .page-contact .soudan-cta__telNum {
    order: 3;
    font-size: var(--font-size-xl);
  }

  .soudan-cta__telTag {
    grid-column: span 2;
    order: 1;
  }

  .page-contact .soudan-cta__tel .soudan-cta__telTag,
  .page-contact .soudan-cta__tel:nth-child(1) .soudan-cta__telTag {
    font-size: var(--font-size-lg);
    text-align: center;
    background-color: #fff6f9;
  }

  .page-section.contact .section-title p {
    flex-direction: column;
    line-height: 1;
    gap: 5px;
    padding: 15px 0;
  }

  .radio-group .wpcf7-list-item {
    width: 100%;
    margin: 0;
    margin-bottom: 15px;
  }
}

/* セレクト全体 */
.select-wrap {
  position: relative;
}

/* CF7が挟む span をブロック化 */
.select-wrap .wpcf7-form-control-wrap {
  display: block;
  position: relative;
}

/* select本体 */
.select-wrap select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  background-image: none;
  padding-right: 48px;
}

/* 矢印 */
.select-wrap::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 15px;
  /* 高さ固定で置く */
  width: 10px;
  height: 10px;
  border-right: 2px solid #222;
  border-bottom: 2px solid #222;
  transform: rotate(45deg);
  pointer-events: none;
  z-index: 2;
}

/* =========================
  Privacy Policy
========================= */
.privacy-hero {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
  /* margin-top: 80px; */
}

.privacy-hero-wrap {
  position: relative;
}

.privacy-hero__inner {
  position: relative;
  z-index: 2;
  min-height: 150px;
}

.privacy-hero__text-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: self-end;
  position: relative;
  z-index: 2;
  min-height: 150px;
}

.privacy-hero__left {
  position: relative;
  /* z-index: 2; */
  max-width: 540px;
}

.privacy-hero .section-title--jp-wrap {
  gap: 10px;
  flex-direction: column;
}

.privacy-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  padding-bottom: 10px;
  margin-bottom: 15px;
}

.privacy-hero .section-title--jp::before {
  content: none;
}

.privacy-hero .section-title--jp span {
  font-family: var(--font-maru);
  font-size: 50px;
  white-space: nowrap;
  border-bottom: 5px solid var(--color-blue);
  color: var(--color-text);
}

.privacy {
  position: relative;
  overflow: hidden;
  padding-top: 50px;
  padding-bottom: 50px;
  /* background: #fff; */
}

/* 背景装飾 */
.privacy-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.shape {
  position: absolute;
  display: block;
}

/* 色 */
.shape--yellow {
  background: #f6c21a;
}

.shape--blue {
  background: #0a8fe8;
}

.shape--pink {
  background: #ff2d8a;
}

/* 図形：ポリゴン（黄色） */
.shape--y1 {
  width: 260px;
  height: 260px;
  left: -70px;
  top: 90px;
  clip-path: polygon(0 0, 100% 18%, 72% 100%, 0 76%);
}

.shape--y2 {
  width: 220px;
  height: 220px;
  right: -80px;
  top: 120px;
  clip-path: polygon(14% 0, 100% 22%, 78% 100%, 0 86%);
}

.shape--y3 {
  width: 260px;
  height: 260px;
  left: -90px;
  bottom: 240px;
  clip-path: polygon(0 18%, 100% 0, 84% 100%, 12% 86%);
}

/* 図形：丸（青） */
.shape--b1 {
  width: 90px;
  height: 90px;
  left: 40px;
  top: 220px;
  border-radius: 50%;
}

.shape--b2 {
  width: 86px;
  height: 86px;
  right: 34px;
  top: 330px;
  border-radius: 50%;
}

/* 図形：ピンク（右下/左下のアクセント） */
.shape--p1 {
  width: 240px;
  height: 240px;
  right: -100px;
  bottom: 220px;
  clip-path: polygon(18% 0, 100% 18%, 82% 100%, 0 82%);
}

.shape--p2 {
  width: 200px;
  height: 200px;
  left: -110px;
  bottom: 30px;
  clip-path: polygon(0 22%, 100% 0, 78% 100%, 12% 86%);
}

.shape--p3 {
  width: 220px;
  height: 220px;
  right: -120px;
  bottom: 40px;
  clip-path: polygon(0 12%, 100% 0, 84% 100%, 18% 86%);
}

/* 中身 */
.privacy__inner {
  position: relative;
  z-index: 1;
}

.privacy__head {
  /* max-width: 820px; */
}

.privacy__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.06em;
  font-size: clamp(28px, 3.6vw, 44px);
  color: #2a2a2a;
  margin: 0 0 14px;
  display: inline-block;
  padding-bottom: 6px;
  border-bottom: 4px solid #0a8fe8;
  /* 画像の青い下線 */
}

.privacy__lead {
  margin: 0 0 26px;
  font-size: 14.5px;
  line-height: 2;
  color: #2a2a2a;
}

.privacy__body {
  max-width: 860px;
}

.privacy__block {
  margin-bottom: var(--space-sm);
}

.privacy__h2 {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-lg);
  margin: 0;
  margin-bottom: var(--space-xs);
  color: #1f1f1f;
}

.privacy__text {
  margin: 0;
  font-size: 14.5px;
  line-height: 2;
  color: #2a2a2a;
}

.privacy__list {
  margin: 10px 0 0 0;
  padding-left: 1.2em;
  font-size: 14.5px;
  line-height: 2;
}

.privacy__list li {
  margin: 0;
}

.privacy__contact {
  margin-top: 26px;
}

.privacy__h3 {
  margin: 0 0 10px;
  font-weight: 900;
  font-size: 18px;
  color: #1f1f1f;
}

.privacy__dl {
  margin: 12px 0 0;
  display: grid;
  gap: 8px;
}

.privacy__dlRow {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  font-size: 14.5px;
  line-height: 1.9;
}

.privacy__dlRow dt {
  font-weight: 800;
  color: #1f1f1f;
}

.privacy__dlRow dd {
  margin: 0;
  color: #2a2a2a;
}

/* SP */
@media (max-width: 767px) {
  .privacy {
    padding: 0;
    margin-bottom: 50px;
  }

  .shape--y1 {
    width: 180px;
    height: 180px;
    left: -70px;
    top: 80px;
  }

  .shape--y2 {
    width: 160px;
    height: 160px;
    right: -70px;
    top: 90px;
  }

  .shape--y3 {
    width: 170px;
    height: 170px;
    left: -90px;
    bottom: 220px;
  }

  .shape--p1 {
    width: 170px;
    height: 170px;
    right: -90px;
    bottom: 200px;
  }

  .shape--p2 {
    width: 150px;
    height: 150px;
    left: -90px;
    bottom: 30px;
  }

  .shape--p3 {
    width: 160px;
    height: 160px;
    right: -100px;
    bottom: 40px;
  }

  .shape--b1 {
    width: 60px;
    height: 60px;
    left: 22px;
    top: 210px;
  }

  .shape--b2 {
    width: 60px;
    height: 60px;
    right: 18px;
    top: 300px;
  }

  .privacy__dlRow {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .privacy-hero .section-title--jp span {
    font-size: 36px;
  }

  .privacy-hero__inner {
    position: relative;
    z-index: 2;
    min-height: auto;
  }

  .privacy-hero__text-wrap {
    display: block;
    position: relative;
    z-index: 2;
    min-height: auto;
  }

  .privacy-hero-wrap {
    position: relative;
    padding-top: 15px;
  }

  .privacy-hero .section-title--jp span {
    font-size: 36px;
    width: 100%;
    display: block;
    padding-bottom: 10px;
  }

  .privacy__h2 {
    font-size: var(--font-size-md);
  }

  .privacy__inner {
    padding: 0 30px;
  }
}

/* =========================
  お知らせ
========================= */
.news-hero {
  position: relative;
  overflow: hidden;
  margin-top: 80px;
  padding-top: 80px;
  /* background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .18) 1.2px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(#0392f7, #0392f7); */
  position: relative;
  /* top: 80px; */
}

.news-hero__inner {
  position: relative;
  min-height: 560px;
}

.news-hero__text-wrap {
  display: flex;
  gap: 60px;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  z-index: 2;
}

.news-hero__col {
  position: relative;
  z-index: 2;
  max-width: 540px;
}

.news-hero .title-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.news-hero .section-title--en>span {
  position: relative;
  z-index: 1;
  color: var(--color-pink);
}

.news-hero .section-title--jp {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  white-space: nowrap;
  border-bottom: none;
  padding-bottom: 10px;
}

.news-hero .section-title--jp::before {
  -webkit-text-stroke: 5px var(--color-text);
}

.news-hero .section-title--jp::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

.page-news .first-cta {
  margin-top: 0;
}

.single-news .first-cta {
  margin-top: 0;
}

.category .first-cta {
  margin-top: 0;
}

.archive .first-cta {
  margin-top: 0;
}

.news-article__back {
  margin-top: 100px;
}

.news-article__back a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px;
  border-radius: 50px;
  border: 2px solid var(--color-pink);
  color: var(--color-pink);
  font-weight: 700;
  text-decoration: none;
  background: #fff;
  transition: 0.3s ease;
}

.news-article__back a::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 20px;
  margin-top: 1px;
  margin-left: 10px;
  background: currentColor;
  -webkit-mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
  mask: url(../images/top/service/arrow.svg) no-repeat center / contain;
}

.news-article__back a:hover {
  color: var(--color-white);
  border-color: var(--color-pink);
  background-color: var(--color-pink);
}

:root {
  --blue: #0a8fe8;
  --pink: #ff2d8a;
  --yellow: #f6c21a;
  --text: #1a1a1a;
  --line: #f6c21a;
  /* 区切り線が黄色 */
}

.news-archive {
  position: relative;
  overflow: hidden;
  padding-top: 80px;
  margin-top: 80px;
  background: #fff;
}

.news-archive__inner {
  position: relative;
  z-index: 1;
}

.news-archive__head {
  /* max-width: 980px; */
  margin-bottom: var(--space-md);
}

.news-archive__en {
  margin: 0 0 6px;
  font-weight: 900;
  letter-spacing: 0.03em;
  font-size: clamp(36px, 5vw, 64px);
  color: var(--pink);
  /* 黒フチっぽさ（簡易） */
  text-shadow:
    2px 0 0 #323333,
    -2px 0 0 #323333,
    0 2px 0 #323333,
    0 -2px 0 #323333;
}

.news-archive__jp {
  margin: 0 0 12px;
  font-weight: 900;
  font-size: 22px;
  color: #111;
}

.news-archive__lead {
  /* margin: 0;
    font-size: 14.5px;
    line-height: 1.9;
    color: #222; */
}

.news-archive__layout {
  /* max-width: 980px; */
  margin: 0 auto;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 50px;
  align-items: start;
}

/* side */
.news-side__block+.news-side__block {
  margin-top: 34px;
}

.news-side__title {
  margin: 0 0 14px;
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
  letter-spacing: 0.06em;
  /* text-shadow:
        1px 0 0 #111, -1px 0 0 #111,
        0 1px 0 #111, 0 -1px 0 #111; */
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
}

.news-side__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}

.news-side__list a {
  color: #111;
  text-decoration: none;
  font-weight: 700;
}

.news-side__list a.is-active {
  font-weight: 900;
}

/* list */
.news-list__items {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 2px solid var(--line);
}

.news-item {
  border-bottom: 2px solid var(--line);
}

.news-item__link {
  display: grid;
  grid-template-columns: 120px 110px 1fr 54px;
  align-items: center;
  gap: 14px;
  padding: 18px 0;
  text-decoration: none;
  color: #111;
}

.news-item__date {
  /* font-weight: 800; */
  font-size: 13.5px;
  letter-spacing: 0.04em;
}

.news-item__tag {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  border: 2px solid var(--pink);
  border-radius: 999px;
  /* font-weight: 800; */
  font-size: 12.5px;
  color: #111;
  background: #fff;
  line-height: 1;
  transition: 0.3s;
}

.news-item__title {
  font-weight: var(--font-weight-bold);
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
}

/* .news-item__arrow {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 2px solid var(--pink);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pink);
    font-weight: 900;
    justify-self: end;
    transition: transform .12s ease, background .12s ease;
}

.news-item__link:hover .news-item__arrow {
    transform: translateX(2px);
    background: rgba(255, 45, 138, .08);
} */

/* pager */
.news-pager {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-top: 28px;
}

.news-pager__num {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  font-weight: 800;
  border: 1px solid transparent;
}

.news-pager__num.is-current {
  background: #111;
  color: #fff;
}

/* 背景図形（ざっくり） */
.news-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.shape {
  position: absolute;
  display: block;
}

.shape--yellow {
  background: var(--yellow);
}

.shape--blue {
  background: var(--blue);
}

.shape--pink {
  background: var(--pink);
}

.y1 {
  width: 260px;
  height: 260px;
  left: -70px;
  top: 40px;
  clip-path: polygon(0 0, 100% 18%, 72% 100%, 0 76%);
}

.y2 {
  width: 220px;
  height: 220px;
  right: -80px;
  top: 40px;
  clip-path: polygon(14% 0, 100% 22%, 78% 100%, 0 86%);
}

.y3 {
  width: 260px;
  height: 260px;
  left: -90px;
  bottom: 120px;
  clip-path: polygon(0 18%, 100% 0, 84% 100%, 12% 86%);
}

.b1 {
  width: 90px;
  height: 90px;
  left: 40px;
  top: 170px;
  border-radius: 50%;
}

.b2 {
  width: 86px;
  height: 86px;
  right: 34px;
  top: 220px;
  border-radius: 50%;
}

.p1 {
  width: 240px;
  height: 240px;
  right: -110px;
  bottom: 140px;
  clip-path: polygon(18% 0, 100% 18%, 82% 100%, 0 82%);
}

.p2 {
  width: 200px;
  height: 200px;
  left: -110px;
  bottom: 10px;
  clip-path: polygon(0 22%, 100% 0, 78% 100%, 12% 86%);
}

/* SP */
@media (max-width: 767px) {
  .news-archive__layout {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .news-item__link {
    grid-template-columns: 96px 1fr 44px;
    grid-template-areas:
      "date tag arrow"
      "title title arrow";
    align-items: center;
    row-gap: 8px;
  }

  .news-item__date {
    grid-area: date;
  }

  .news-item__tag {
    grid-area: tag;
    justify-self: start;
  }

  .news-item__title {
    grid-area: title;
  }

  .news-item__arrow {
    grid-area: arrow;
  }

  .news-bg {
    display: none;
  }
}

.news-archive__en {
  font-family: var(--font-maru);
  font-size: var(--font-size-xxxl);
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  line-height: 1;
}

.news-archive__en::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  pointer-events: none;
}

.news-archive__en>span {
  position: relative;
  z-index: 1;
  color: var(--color-pink);
}

.news-archive__en::after {
  content: attr(data-text);
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 7px var(--color-text);
  pointer-events: none;
}

.news-archive__jp {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  white-space: nowrap;
  border-bottom: none;
  padding-bottom: 10px;
  position: relative;
}

.news-archive__jp>span {
  position: relative;
  z-index: 1;
  color: var(--color-white);
}

.news-archive__jp::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  pointer-events: none;
}

.news-archive__jp::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

.news-side__title {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  line-height: 1;
}

.news-side__title::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

.news-side__title>span {
  position: relative;
  z-index: 1;
  color: var(--color-pink);
}

.news-side__title::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

.news-item__arrow {
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
  transition: color 0.3s ease;
  border: 2px solid currentColor;
  border-radius: 50px;
  line-height: 1;
  width: 36px;
  height: 36px;
}

.news-item__arrow::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background: currentColor;
  -webkit-mask: url(../images/common/news-arrow.svg) no-repeat center / contain;
  mask: url(../images/common/news-arrow.svg) no-repeat center / contain;
}

.news-item__link:hover {
  color: var(--color-pink);
}

.news-item__link:hover .news-item__arrow {
  color: var(--color-white);
  background-color: var(--color-pink);
  border-color: var(--color-pink);
}

.news-item__link:hover .news-item__tag {
  background-color: var(--color-pink);
  color: var(--color-white);
}

/* =========================
  お知らせ_詳細
========================= */
.news-article__title {
  margin-top: 0;
  margin-bottom: var(--space-xs);
}

/* =========================
  NEWS Detail
========================= */

/* 既存の2カラム(grid)はそのまま活かし、右側だけ差し替え */
.news-detail {
  width: 100%;
}

/* 詳細本文 */
.news-article {
  max-width: 760px;
  /* 画像の余白感に寄せる */
}

/* タイトル：センター寄せ */
.news-article__title {
  margin-bottom: var(--space-xs);
  font-weight: var(--font-weight-bold);
  font-size: clamp(20px, 2.2vw, 28px);
  text-align: left;
  color: var(--color-text);
}

/* タグ＋日付：センター寄せ */
.news-article__meta {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 15px;
  margin-bottom: var(--space-sm);
}

.news-article__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  border: 2px solid var(--pink, #ff2d8a);
  border-radius: 999px;
  font-weight: 800;
  font-size: 12.5px;
  color: #111;
  background: #fff;
  line-height: 1;
}

.news-article__date {
  font-weight: 800;
  font-size: 13.5px;
  letter-spacing: 0.04em;
  color: #111;
}

/* 画像ブロック */
.news-article__figure {
  margin: 0 auto;
  margin-bottom: var(--space-md);
  background: #dcdcdc;
  border-radius: 5px;
  /* 角は控えめ */
  overflow: hidden;
}

.news-article__figure img {
  display: block;
  width: 100%;
  height: auto;
}

/* 本文 */
.news-article__content {
  margin-bottom: var(--space-sm);
}

/* 画像との間隔（2枚目の前にも同じ余白感） */
.news-article__content p {
  margin: 0;
}

/* SP：サイド→上、本文→下（既存と同じ流れ） */
@media (max-width: 767px) {
  .news-article {
    max-width: 100%;
  }

  .news-article__title {
    text-align: left;
    /* SPは読みやすさ優先 */
  }

  .news-article__meta {
    justify-content: flex-start;
  }

  .news-archive__en {
    font-size: var(--font-size-xxl);
  }

  .news-archive {
    padding-top: 0;
    margin-top: 70px;
  }

  .news-archive__jp {
    font-size: var(--font-size-lg);
  }

  .news-archive__inner {
    padding-top: 30px;
    margin-bottom: 30px;
  }

  .news-archive__lead {
    font-size: 16px;
    font-family: var(--font-maru);
    font-weight: var(--font-weight-bold);
    line-height: 1.4;
  }

  .news-archive__layout .news-side {
    order: 2;
  }

  .news-archive__layout .news-list {
    order: 1;
  }

  .news-article__back {
    margin-top: 50px;
    margin-bottom: 50px;
    text-align: center;
  }

  .news-archive__head {
    margin-bottom: 30px;
  }

  .news-item__title {
    font-weight: var(--font-weight-bold);
    font-size: 18px;
    line-height: 1.6;
  }
}

/* =========================
 お仕事実績
========================= */
:root {
  --c-text: #1b1b1b;
  --c-line: #e7e7e7;
  --c-bg: #ffffff;
  --c-blue: #1fa0ff;
  --c-yellow: #ffd100;
  --c-pink: #ff2f86;
  --c-ink: #111;
  --radius: 999px;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family:
    system-ui,
    -apple-system,
    "Noto Sans JP",
    sans-serif;
  color: var(--c-text);
  background: var(--c-bg);
}

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

.l-container {
  width: min(1120px, calc(100% - 32px));
  margin-inline: auto;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c-line);
}

.site-header__inner {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 14px 0;
}

.brand__logo {
  font-weight: 900;
  letter-spacing: 0.02em;
}

.site-nav {
  margin-left: auto;
  display: flex;
  gap: 18px;
}

.site-nav__link {
  font-weight: 700;
  font-size: 14px;
}

.cta-mail {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 2px solid var(--c-pink);
  border-radius: var(--radius);
  font-weight: 900;
}

.cta-mail__icon {
  line-height: 1;
}

/* Hero */
.works-hero {
  position: relative;
  overflow: hidden;
  margin-top: 80px;
  padding-top: 30px;
}

.works-hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
  margin-bottom: var(--space-sm);
}

.works-hero__title {
  margin: 0 0 14px;
  line-height: 1.05;
}

.works-hero__title-en {
  display: block;
  font-size: clamp(44px, 4.5vw, 70px);
  font-weight: 1000;
  letter-spacing: 0.02em;
  color: #111;
  -webkit-text-stroke: 8px #111;
  paint-order: stroke fill;
  color: #fff;
  text-shadow: 0 6px 0 rgba(0, 0, 0, 0.12);
}

.works-hero__title-ja {
  display: inline-block;
  margin-top: 6px;
  font-weight: 900;
  font-size: 18px;
}

.works-hero__lead {
  margin: 0 0 18px;
  font-weight: 700;
  color: #333;
  line-height: 1.8;
}

/* pseudo machine */
/* .works-hero__machine {
    height: 260px;
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(255, 209, 0, 0.25), rgba(31, 160, 255, 0.18));
    border: 2px dashed rgba(17, 17, 17, 0.25);
    display: grid;
    place-items: center;
}

.works-hero__machine-note {
    font-weight: 800;
    color: rgba(17, 17, 17, 0.55);
} */

/* Search */
.works-search {
  position: relative;
  width: min(420px, 100%);
  margin: 0 0 16px;
}

.works-search__input {
  width: 100%;
  height: 44px;
  border-radius: var(--radius);
  border: 2px solid #dcdcdc;
  padding: 0 52px 0 16px;
  font-weight: var(--font-weight-bold);
  outline: none;
  font-size: 16px;
}

.works-search__input:focus {
  border-color: rgba(31, 160, 255, 0.8);
  box-shadow: 0 0 0 4px rgba(31, 160, 255, 0.15);
}

.works-search__btn {
  position: absolute;
  right: 6px;
  top: 50%;
  translate: 0 -50%;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: var(--c-blue);
  color: #fff;
  cursor: pointer;
  box-shadow: var(--shadow);
}

.works-search__btn:active {
  transform: translateY(1px);
}

/* Filters */
.filters {
  padding-top: 10px;
  border-top: 1px solid var(--c-line);
}

.filter-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 15px;
  padding: 15px 0;
  border-bottom: 1px solid var(--c-line);
  align-items: start;
}

.filter-row__label {
  font-weight: 900;
  font-size: 14px;
  padding-top: 8px;
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.chip {
  border: 2px solid var(--color-text);
  background: #fff;
  color: var(--color-text);
  border-radius: var(--radius);
  padding: 8px 14px;
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition:
    transform 0.08s ease,
    background 0.15s ease,
    color 0.15s ease;
  line-height: 1;
}

.chip:hover {
  transform: translateY(-1px);
}

.chip.is-active {
  background: var(--c-blue);
  border-color: var(--c-blue);
  color: #fff;
}

.chip--tag {
  border-color: #cfcfcf;
  color: #222;
}

.chip--tag.is-active {
  background: var(--c-yellow);
  border-color: var(--c-yellow);
  color: #111;
}

.tag-groups {
  display: grid;
  gap: 12px;
}

.tag-group {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  align-items: start;
}

.tag-group__title {
  font-size: 12px;
  font-weight: 900;
  color: #666;
  padding-top: 8px;
}

.filter-actions {
  grid-column: 2 / -1;
  margin-top: 10px;
}

.btn-reset {
  border: none;
  background: transparent;
  color: #444;
  font-weight: 800;
  text-decoration: underline;
  cursor: pointer;
}

/* List */
.works-list {
  padding: 22px 0 40px;
}

.works-list__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.works-count {
  margin: 0;
  font-weight: 900;
}

.works-count__sub {
  font-weight: 800;
  color: #666;
  margin-left: 10px;
  font-size: 13px;
}

.cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.card {
  border-radius: 18px;
}

.card__link {
  display: block;
}

.card__thumb {
  aspect-ratio: 3 / 2;
  border-radius: 10px;
  background: #d8d8d8;
  border: 1px solid #1c1c1c;
}

.card__body {
  display: grid;
  /* gap: 8px;
    padding: 10px 2px 0; */
}

.badge {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 14px;
  border-radius: var(--radius);
  border: 2px solid #1b1b1b;
  font-weight: var(--font-weight-bold);
  font-size: 12px;
  width: fit-content;
  background: #fff;
}

.card__title {
  margin-top: 5px;
  margin-bottom: 0;
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
  transition: 0.3s;
}

.card.is-hidden {
  display: none;
}

.works-list .card__link:hover .card__title {
  color: var(--color-pink);
}

/* Pager */
.pager {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding-top: 22px;
}

.pager__btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid var(--color-text);
  background: #fff;
  font-weight: var(--font-weight-bold);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.pager__btn.is-active {
  background: #111;
  color: #fff;
}

/* CTA band */
.cta-band {
  background: var(--c-pink);
  color: #fff;
  padding: 18px 0;
}

.cta-band__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: center;
}

.cta-band__bubble {
  margin: 0 0 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 16px;
  border-radius: var(--radius);
  background: #fff;
  color: var(--c-pink);
  font-weight: 1000;
}

.cta-band__lead {
  margin: 0;
  font-weight: 900;
  font-size: 18px;
}

.cta-band__lead--strong {
  font-size: 22px;
}

.cta-band__note {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.7;
  opacity: 0.95;
}

.tel-box {
  border: 2px dotted rgba(255, 255, 255, 0.7);
  border-radius: 18px;
  padding: 14px 14px 10px;
}

.tel-box__num {
  margin: 0 0 6px;
  font-weight: 1000;
  font-size: 18px;
  letter-spacing: 0.02em;
}

.tel-box__label {
  font-size: 11px;
  font-weight: 900;
  background: rgba(255, 255, 255, 0.2);
  padding: 2px 8px;
  border-radius: var(--radius);
  margin-left: 8px;
}

.tel-box__time {
  margin: 8px 0 0;
  font-size: 12px;
  opacity: 0.95;
}

/* Background shapes (雰囲気) */
.bg-shape {
  position: absolute;
  width: 240px;
  height: 240px;
  rotate: -18deg;
  opacity: 0.95;
  z-index: -1;
}

.bg-shape--yellow {
  background: var(--c-yellow);
}

.bg-shape--pink {
  background: var(--c-pink);
}

.bg-shape--tl {
  left: -120px;
  top: -140px;
}

.bg-shape--tr {
  right: -110px;
  top: -60px;
  width: 180px;
  height: 180px;
}

.bg-shape--br {
  right: -140px;
  bottom: -140px;
}

.bg-dot {
  position: absolute;
  width: 86px;
  height: 86px;
  border-radius: 50%;
  background: var(--c-blue);
  z-index: -1;
}

.bg-dot--blue {
  opacity: 0.95;
}

.bg-dot--l {
  left: -30px;
  top: 140px;
}

.bg-dot--r {
  right: -30px;
  top: 220px;
}

/* Responsive */
@media (max-width: 991px) {
  .works-hero__inner {
    grid-template-columns: 1fr;
  }

  .works-hero__right {
    order: -1;
  }

  .tag-group {
    grid-template-columns: 1fr;
  }

  .filter-row {
    grid-template-columns: 90px 1fr;
  }
}

@media (max-width: 767px) {
  .site-nav {
    display: none;
  }

  .cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .cta-band__inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .cards {
    grid-template-columns: 1fr;
  }

  .filter-row {
    grid-template-columns: 1fr;
  }

  .filter-row__label {
    padding-top: 0;
  }
}

.card__thumb {
  position: relative;
  /* 追加：ここが基準 */
  overflow: hidden;
  /* 角丸からはみ出さない */
}

.badge--overlay {
  position: absolute;
  left: 12px;
  bottom: 12px;

  /* 画像に重ねた時に見やすいよう微調整 */
  background: #fff;
  z-index: 2;
}

.card__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(3 146 247 / 50%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.card__link:hover .card__thumb::after {
  opacity: 1;
}

.card__thumb {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 15px;
  background: #f5f5f5;
  position: relative;
}

.card__thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

@media (max-width: 767px) {
  .card__thumb {
    border-radius: 10px;
  }
}

/* works hero 右側の重機ビジュアル */
.works-hero__right {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}

.works-hero__machine {
  /* 右側で大きく見せる */
  width: min(560px, 46vw);
  margin-top: -10px;
  /* 少し上げて「浮いてる感」 */
}

.works-hero__machine img {
  width: 100%;
  height: auto;
  display: block;

  /* 切り抜き感・浮遊感（好みで調整） */
  filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.06)) drop-shadow(0 28px 22px rgba(0, 0, 0, 0.1));
}

/* SPは中央寄せでサイズ調整 */
@media (max-width: 767px) {
  .works-hero__right {
    justify-content: center;
    margin-top: 0;
    position: absolute;
    top: 0;
    right: 0;
    width: 40%;
  }

  .works-hero__machine {
    width: min(520px, 86vw);
    margin-top: 0;
  }
}

.works-archive__head {
  /* max-width: 980px; */
  margin-bottom: var(--space-sm);
}

.works-archive__en>span {
  position: relative;
  z-index: 1;
  color: var(--color-pink);
}

.works-archive__en {
  font-family: var(--font-maru);
  font-size: var(--font-size-xxxl);
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  line-height: 1;
  margin: 0 0 6px;
  font-weight: 900;
  letter-spacing: 0.03em;
  font-size: var(--font-size-xxxl);
  color: var(--pink);
  text-shadow:
    2px 0 0 #111,
    -2px 0 0 #111,
    0 2px 0 #111,
    0 -2px 0 #111;
}

.works-archive__en>span {
  position: relative;
  z-index: 1;
  color: var(--color-yellow);
}

.works-archive__en::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  pointer-events: none;
}

.works-archive__en::after {
  content: attr(data-text);
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 7px var(--color-text);
  pointer-events: none;
}

.works-archive__jp {
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  white-space: nowrap;
  border-bottom: none;
  position: relative;
  font-weight: var(--font-weight-bold);
  font-size: 22px;
  color: #111;
  margin: 0 0 12px;
  padding-bottom: 10px;
}

.works-archive__jp>span {
  position: relative;
  z-index: 1;
  color: var(--color-white);
}

.works-archive__jp::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 5px var(--color-text);
  pointer-events: none;
}

.works-archive__jp::after {
  content: attr(data-text);
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 0;
  color: transparent;
  -webkit-text-stroke: 3px var(--color-text);
  pointer-events: none;
}

/* =========================
   WORKS DETAIL
========================= */
.works-hero--detail {
  padding-bottom: 18px;
}

.works-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.works-detail-title {
  margin-top: 0;
  margin-bottom: var(--space-xs);
  font-size: clamp(18px, 2.2vw, 28px);
  font-weight: var(--font-weight-bold);
}

.works-detail-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.chip--mini {
  padding: 6px 12px;
  font-size: 12px;
}

/* Slider */
.works-detail-main {
  padding: 10px 0 34px;
}

.works-slider {
  margin: 12px 0 18px;
  position: relative;
}

.works-slider__ph {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 18px;
  background: #d8d8d8;
}

/* Splide矢印：丸ボタン */
.works-slider .splide__arrow {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  opacity: 1;
  background: #fff;
  border: 2px solid #111;
}

.works-slider .splide__arrow svg {
  fill: #111;
}

.works-slider .splide__arrow--prev {
  left: -18px;
}

.works-slider .splide__arrow--next {
  right: -18px;
}

.works-slider-wrap {
  margin-bottom: 20px;
}

.works-slider {
  margin-bottom: 20px;
}

.works-slider__image {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 20px;
  background: #f5f5f5;
}

.works-slider__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.works-thumbs .splide__slide {
  /* opacity: 0.5; */
  transition: opacity 0.3s ease;
  border: none !important;
  height: 100% !important;
}

.works-thumbs .splide__slide.is-active {
  opacity: 1;
}

.works-thumbs__button {
  /* display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer; */
  aspect-ratio: 16 / 10;
  overflow: hidden;
  display: block;
  padding: 0;
  margin: 0;
  border: none;
  background-color: #2f5ae7;
}

.works-thumbs__button img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* display: block;
    border-radius: 0; */
}

@media (max-width: 767px) {
  .works-slider-wrap {
    margin-bottom: 28px;
  }

  .works-slider {
    margin-bottom: 10px;
  }

  .works-slider__image {
    border-radius: 14px;
  }

  .works-thumbs__button img {
    border-radius: 10px;
  }
}

.works-thumbs {
  background-color: #e5ebf2;
  padding: 15px;
  border-radius: 15px;
}

.works-thumbs {
  overflow: hidden;
}

.works-thumbs .splide__track {
  overflow: hidden;
}

/* 情報ボックス */
.works-info {
  margin: 14px 0;
  border-radius: 14px;
  background: #fff;
  padding: 16px 16px;
}

.works-info--pink {
  border: 2px solid #ff2f86;
}

.works-info--blue {
  border: 2px solid #1fa0ff;
}

.works-info__dl {
  margin: 0;
  display: grid;
  gap: 10px;
}

.works-info__row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  align-items: start;
}

.works-info__row dt {
  font-weight: 700;
  color: #ff2f86;
}

.works-info--blue .works-info__row dt {
  color: #1fa0ff;
}

.works-info__row dd {
  margin: 0;
  font-weight: 600;
  line-height: 1.8;
}

/* ギャラリー（縦に並ぶ大きな画像） */
.works-gallery {
  display: grid;
  gap: 18px;
  margin-top: 18px;
}

.works-gallery__ph {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 18px;
  background: #d8d8d8;
}

/* 関連事例 */
.works-related {
  padding: 24px 0 34px;
}

.works-related__title {
  margin: 0 0 14px;
  background: #ffd100;
  border-radius: 999px;
  padding: 8px 16px;
  font-weight: 1000;
  width: fit-content;
}

.cards--related {
  margin-top: 30px;
  padding: 0 15px;
}

.works-back {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}

.works-back__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border-radius: 999px;
  border: 2px solid #ff2f86;
  color: #ff2f86;
  font-weight: 1000;
  background: #fff;
}

/* 安心ポイント */
.points {
  padding: 22px 0 22px;
}

.points__title {
  margin: 0 auto 16px;
  background: #ff2f86;
  color: #fff;
  border-radius: 999px;
  padding: 10px 18px;
  width: fit-content;
  font-weight: 1000;
}

.points__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.point-card {
  border-radius: 18px;
  background: #fff;
  padding: 16px;
  border: 1px solid #eee;
  text-align: center;
}

.point-card__icon {
  font-weight: 1000;
  font-size: 28px;
  margin-bottom: 8px;
}

.point-card__title {
  margin: 0 0 6px;
  font-weight: 1000;
}

.point-card__text {
  margin: 0;
  font-weight: 700;
  color: #555;
  line-height: 1.7;
  font-size: 13px;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .works-hero__machine {
    width: min(560px, 40vw);
    margin-top: -10px;
  }
}

@media (max-width: 767px) {
  .works-info__row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .points__grid {
    grid-template-columns: 1fr;
  }

  .works-slider .splide__arrow--prev {
    left: 8px;
  }

  .works-slider .splide__arrow--next {
    right: 8px;
  }
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
  border: none;
  background-color: #00134f;
}

.splide__track--nav>.splide__list>.splide__slide.is-active img {
  opacity: 0.4;
}

.works-thumbs .splide__track {
  overflow: visible;
}

.works-thumbs .splide__list {
  align-items: center;
  /* transform: none !important; */
}

.works-thumbs .splide__slide {
  width: 120px !important;
  height: 80px;
  /* flex: 0 0 auto; */
  opacity: 1;
  transition: opacity 0.3s ease;
}

.works-thumbs .splide__slide.is-active {
  opacity: 1;
}

.works-thumbs__button {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}

.works-thumbs__button img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0;
}

@media (max-width: 767px) {
  .works-thumbs .splide__slide {
    width: 84px !important;
    height: 56px;
  }
}

.works-thumbs .splide__arrow {
  background: #ffffff;
  opacity: 1;
  border: 2px solid #111;
}

.works-thumbs .splide__arrow svg {
  fill: var(--color-text);
  height: 0.9em;
  width: 0.9em;
}

.single-works .price .three-col {
  display: flex;
  justify-content: space-around;
  gap: 50px;
}

.single-works .price .three-col .col {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
}

.single-works .price .three-col .col img {
  height: 100px;
  margin-bottom: 10px;
}

.single-works .price .three-col .title {
  font-size: var(--font-size-lg);
  font-family: var(--font-maru);
  font-weight: var(--font-weight-bold);
  color: var(--color-pink);
}

.page-section.works-related .section-title {
  width: 100%;
  background-color: var(--color-yellow);
  text-align: center;
  border-radius: 50px;
}

.page-section.works-related .section-title p {
  /* font-family: var(--font-maru);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text);
    margin-bottom: var(--space-md);
    display: flex;
    align-items: center;
    justify-content: center; */

  display: flex;
  align-items: center;
  justify-content: center;
  /* padding: 10px 30px; */
  border-radius: 50px;
  border: 2px solid var(--color-yellow);
  color: var(--color-text);
  font-weight: var(--font-weight-bold);
  text-decoration: none;
  background: var(--color-yellow);
  transition: 0.3s ease;
  margin-bottom: var(--space-xs);
  font-family: var(--font-maru);
  font-size: var(--font-size-xl);
  /* line-height: 1; */
}

.single-works .price .three-col .text {
  line-height: 1.5;
}

@media (max-width: 767px) {
  .works-archive__head {
    margin-bottom: 0;
  }

  .works-hero__inner {
    display: block;
    position: relative;
  }

  .works-hero {
    position: relative;
    overflow: hidden;
    margin-top: 70px;
    padding-top: 0;
    padding-bottom: 0;
  }

  .works-archive__en {
    font-size: var(--font-size-xxl);
  }

  .works-archive-inner {
    padding-top: 30px;
    margin-bottom: 30px;
  }

  .works-archive__lead {
    font-size: 16px;
    font-family: var(--font-maru);
    font-weight: var(--font-weight-bold);
    line-height: 1.4;
  }

  .filters {
    padding-top: 0;
  }

  .filter-row {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }

  .chip {
    font-size: 10px;
  }

  .works-detail-title {
    margin-top: 0;
    margin-bottom: var(--space-xs);
    font-size: 20px;
    font-weight: var(--font-weight-bold);
  }

  .page-section.works-related .section-title p {
    font-size: 20px;
  }

  .single-works .price .three-col {
    flex-direction: column;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .single-works .price .three-col .title {
    font-size: 26px;
  }

  .single-works .price .three-col .text {
    font-size: 20px;
  }
}

/* フローティングボタン */
.floating-contact {
  position: fixed;
  right: 20px;
  bottom: 30px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--color-pink);
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: 0.3s;
  transform-origin: center;
  animation: floatingShake 4s infinite;
}

.page-contact .floating-contact {
  display: none !important;
}

@media (max-width: 767px) {
  .floating-contact {
    width: 90px;
    height: 90px;
  }
}

.floating-contact__icon {
  display: block;
  width: 50px;
  height: 50px;
  background: url("../images/common/icon-contact.png") no-repeat center / contain;
}

.floating-contact__text {
  display: block;
  font-size: 12px;
  margin-top: 4px;
  line-height: 1.2;
}

.floating-contact:hover {
  background: var(--color-blue);
}

@keyframes floatingShake {

  0%,
  85%,
  100% {
    transform: translateY(0) rotate(0deg) scale(1);
  }

  88% {
    transform: translateY(0) rotate(-6deg) scale(1.03);
  }

  90% {
    transform: translateY(0) rotate(6deg) scale(1.03);
  }

  92% {
    transform: translateY(0) rotate(-4deg) scale(1.03);
  }

  94% {
    transform: translateY(0) rotate(4deg) scale(1.03);
  }

  96% {
    transform: translateY(0) rotate(-2deg) scale(1.02);
  }

  98% {
    transform: translateY(0) rotate(2deg) scale(1.01);
  }
}

/* トップページ_ヒーロー */
.hero__overlayInner {
  pointer-events: auto;
  align-self: center;
  position: relative;
  left: 0;
  width: 100%;
  max-width: none;
  padding-top: 0;
  display: flex;
  justify-content: center;
}

.hero__logo {
  display: block;
  /* width: clamp(300px, 44vw, 760px); */
  max-width: 100%;
  max-height: 30svh;
  height: auto;
  object-fit: contain;
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .hero__logo {
    /* width: clamp(280px, 40vw, 640px); */
    max-height: 45svh;
  }
}

@media (max-width: 767px) {
  .hero__overlayInner {
    padding-top: 84px;
  }

  .hero__logo {
    width: min(82vw, 420px);
    max-height: 36svh;
    margin-inline: auto;
  }
}

.works-list .works-card__location,
.splide__slide .works-card__location,
.cards--related .works-card__location {
  font-size: 12px;
  color: #1fa0ff;
  font-weight: var(--font-weight-medium);
}

.modal-open .floating-contact {
  display: none;
}

.seo-h1 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}