/* ===== [大串FB] サイト全体を白と黒（モノクロ）に：元パレット変数を白黒グレースケールへ再定義 ===== */
:root{
  --color-bg:#ffffff; --color-bg-rgb:255,255,255; --color-bg-50:rgba(255,255,255,.5); --color-bg-90:rgba(255,255,255,.9);
  --color-base:#111111; --color-base-rgb:17,17,17;
  --color-beige:#f1f1f1; --color-beige-rgb:241,241,241;
  --color-brown:#d8d8d8; --color-brown-rgb:216,216,216;
  --color-primary:#f1f1f1; --color-primary-rgb:241,241,241;
  --color-secondary:#d8d8d8; --color-secondary-rgb:216,216,216;
  --color-gray:#8a8a8a; --color-gray-rgb:138,138,138;
  --color-input-active:#d8d8d8; --color-input-focus:#d8d8d8; --color-submit-bg:#d8d8d8; --color-submit-bg-hover:#c8c8c8;
  --color-danger:#111111; --color-danger-rgb:17,17,17;
}
/* ===== 株式会社ななほし コンテンツ層 =====
   方針：元サイト(mcares)のレイアウト・デザイン・配色をそのまま尊重し、色は足さない。
   使う色は元パレットのみ： --color-base(#111111) / --color-bg(#ffffff) / --color-beige(#f1f1f1) / --color-brown(#d8d8d8) */

/* 旧・多色クラス（HTML据え置き）は無効化＝元の文字色に委ねる */
.nh-c1,.nh-c2,.nh-c3,.nh-c4,.nh-c5,.nh-c6,.nh-c7{color:inherit!important}

/* カテゴリラベル：小マーク → 元パレットの細い縦バー（ブラウン） */
.nh-star{position:relative;padding-left:.9em}
.nh-star::before{content:"";position:absolute;left:0;top:.16em;bottom:.16em;width:4px;border-radius:2px;background:var(--color-base)}
.nh-seven{display:none!important}

.nh-logo-img{display:block;height:auto}
/* スクロール後の白背景ヘッダーではロゴを濃色に（元:fill=color-base 相当）＋サイズをFVロゴ(幅92)に統一 */
.l-header__logo img{filter:brightness(0) saturate(0) opacity(.85);width:92px!important;height:auto!important}
.l-drawer__logo img{width:92px;height:auto}

/* ===== プレースホルダ枠（写真は後日差し替え・善意の仮画像なし／cream・beige） ===== */
.nh-ph{position:relative;width:100%;height:100%;min-height:230px;display:flex;align-items:center;justify-content:center;
  background:#ededed;
  border:1px dashed #cfcfcf;border-radius:inherit;overflow:hidden}

.nh-ph-label{font-size:.82rem;color:#7a7a7a;letter-spacing:.06em;background:rgba(255,255,255,.78);
  padding:.5em 1.05em;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.top-service__list__img .nh-ph{min-height:300px}
/* About：元は画像の縦横比で高さが出ていた → プレースホルダにアスペクト比を付与（大=横長/小=縦長） */
.top-about__img__lg .nh-ph{min-height:0;aspect-ratio:3/2;height:auto}
.top-about__img__sm .nh-ph{min-height:0;aspect-ratio:4/5;height:auto}
.top-about__img__lg figure,.top-about__img__sm figure{height:auto}

/* ===== ヒーロー：元の暗い映像枠デザインを踏襲（暗い写真プレースホルダ＋cream文字） ===== */
.top-hero__mov{background:#111111!important}
.nh-ph--hero{position:absolute;inset:0;min-height:100%;border:1px dashed rgba(255,255,255,.22);
  background:#111111}
.nh-ph--hero::after{content:none}
.nh-ph--hero .nh-ph-label{position:absolute;left:30px;bottom:44px;background:rgba(255,255,255,.14);color:var(--color-bg);box-shadow:none}
/* catch は元の cream 配色（オーバーライドしない・元CSSに委ねる）。追加要素のみ cream 指定 */
.nh-hero__sub{margin:1.3rem 0 0;color:var(--color-bg);font-size:1rem;line-height:1.9;font-weight:500}
.nh-hero__cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:1.9rem}
.nh-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.95em 2em;border-radius:999px;
  font-weight:700;font-size:.98rem;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.nh-btn::after{content:"→"}
.nh-btn--primary{background:var(--color-bg);color:var(--color-base)}
.nh-btn--ghost{background:transparent;color:var(--color-bg);border:2px solid var(--color-bg)}
.nh-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.25)}

/* 大見出しの英字下線：元パレットの濃色バー */
.top-service__heading .c-title__primary::after,.nh-access .c-title__primary::after,
.nh-news .c-title__primary::after,.top-recruit__heading .c-title__primary::after{
  content:"";display:block;width:56px;height:5px;border-radius:99px;background:var(--color-base);opacity:.85;margin-top:.7rem}

/* ===== アクセス（会社案内セクション転用） ===== */
.nh-access__list{list-style:none;margin:2.2rem 0 0;padding:0}
.nh-access__item{padding:1.1rem 0;border-top:1px solid var(--color-beige);display:flex;flex-direction:column;gap:.35rem}
.nh-access__item:last-child{border-bottom:1px solid var(--color-beige)}
.nh-access__label{font-weight:700;color:var(--color-base);font-size:.98rem}
.nh-access__addr{color:rgba(40,40,40,.72);font-size:1rem;line-height:1.7}
.nh-map-ph{width:100%;min-height:340px;border-radius:20px;display:flex;align-items:center;justify-content:center;
  background:#ededed;border:1px dashed #cfcfcf}

/* ===== お知らせ（ブログ転用） ===== */
.nh-news__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--color-beige)}
.nh-news__item{border-bottom:1px solid var(--color-beige)}
.nh-news__link{display:grid;grid-template-columns:130px 110px 1fr;align-items:center;gap:1.2rem;
  padding:1.35rem .4rem;text-decoration:none;color:var(--color-base);transition:background .2s}
.nh-news__link:hover{background:rgba(40,40,40,.04)}
.nh-news__date{color:rgba(40,40,40,.6);font-weight:600;letter-spacing:.03em}
.nh-news__cat{font-size:.8rem;color:var(--color-base);border:1px solid var(--color-base);border-radius:999px;
  padding:.2em .9em;text-align:center;justify-self:start;background:var(--color-bg)}
.nh-news__cat.nh-star{padding-left:.9em}
.nh-news__cat.nh-star::before{background:var(--color-base)}
.nh-news__tit{font-weight:600;line-height:1.6}

/* ===== 採用：募集職種＋はたらきやすさ（元パレット・色は足さない） ===== */
.nh-recruit-extra{margin-top:3.5rem}
.nh-block-tit{font-size:1.15rem;font-weight:700;color:var(--color-base);margin:0 0 1.3rem}
.nh-block-tit--mt{margin-top:3rem}
.nh-jobs{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0;padding:0}
.nh-job__link{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;padding:1.5rem 1.3rem;border-radius:18px;
  background:var(--color-bg);text-decoration:none;color:var(--color-base);font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.05);
  border-top:5px solid var(--color-base);transition:transform .2s,box-shadow .2s}
.nh-job__link:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.12)}
.nh-job__tit{font-size:1.02rem}.nh-job__arw{margin-top:.2rem;color:var(--color-base)}
.nh-benefits{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:14px 26px;margin:0;padding:0}
.nh-benefit{display:flex;align-items:center;gap:.9rem;padding:1rem 1.2rem;background:var(--color-bg);border-radius:14px;
  box-shadow:0 4px 12px rgba(0,0,0,.04);font-weight:600;color:var(--color-base)}
.nh-benefit__ico{width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--color-bg);font-size:1.05rem;background:var(--color-base)}
.nh-benefit__txt{line-height:1.5}

/* カスタムカーソル（文字に被る）は非表示のまま */
.js-mouse-stalker{display:none!important}

@media(max-width:900px){
  .nh-jobs{grid-template-columns:repeat(2,1fr)}
  .nh-benefits{grid-template-columns:1fr}
  .nh-news__link{grid-template-columns:110px 1fr;grid-template-areas:"date cat" "title title";row-gap:.5rem}
  .nh-news__date{grid-area:date}.nh-news__cat{grid-area:cat}.nh-news__tit{grid-area:title}
}

/* ===== [大串FB] Access↔Recruit を元テンプレのマークアップで忠実に入れ替え ===== */
/* Access ＝ 元Recruitテンプレ（コンテンツ左＋地図が全幅メディア右） */
.nh-access-r .top-recruit__first__img.nh-mapimg{
  background:#ededed!important;background-image:none!important;
  padding-top:0!important;min-height:540px!important;display:flex;align-items:center;justify-content:center;
  border:1px dashed #cfcfcf}
.nh-access-r .top-recruit__first__content{padding-top:100px}
.nh-access-r .nh-access__list{margin-top:1.8rem}

/* Recruit ＝ 元Companyテンプレ（ベージュカード[見出し＋キャプ＋求人4ボタン]＋ダークのメディア箱） */
.nh-recruit-cap{margin:1.4rem 0 0;color:var(--color-base);font-weight:600;font-size:1.02rem;line-height:1.8}
/* Companyスライダー：main.jsが縦ttb自動スクロールのループ carousel化。各slideは明るい写真カード（ダーク箱の中を流れる） */
.nh-recruit-c .top-company__slider .splide__slide{padding:0!important}
.nh-slide-ph{width:100%;height:100%;min-height:0;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:#ededed;border:1px solid rgba(0,0,0,.05)}
/* スライド間の余白（splideのgap 20px）を詰める */
.nh-recruit-c .top-company__slider .splide__slide{margin-bottom:8px!important}
.nh-slide-ph .nh-ph-label{background:rgba(255,255,255,.85);color:#7a7a7a;box-shadow:0 2px 8px rgba(0,0,0,.06)}

/* ===== [大串FB] Accessを廃止→「働き方・雰囲気・考え方」セクションに（Recruitテンプレ流用） ===== */
.nh-style-r .top-recruit__first__img.nh-styleimg{
  background:#ededed!important;background-image:none!important;padding-top:0!important;min-height:560px!important;
  display:flex;align-items:center;justify-content:center;border:1px dashed #cfcfcf}
.nh-style-r .top-recruit__first__content{padding-top:80px}
.nh-style-r .top-recruit__lead{margin-bottom:.2rem}
.nh-style-points{list-style:none;display:flex;flex-wrap:wrap;gap:.8rem 1.6rem;margin:2.1rem 0 0;padding:0}
.nh-style-points li{position:relative;font-weight:700;color:var(--color-base);font-size:1rem}


/* ===== 代表挨拶（ご挨拶 / Message）：写真左 × 本文右（B案）・元パレット白黒で馴染ませ ===== */
.nh-message{padding:clamp(4.5rem,9vw,8.5rem) 0}
.nh-message__grid{display:grid;grid-template-columns:minmax(0,42%) 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.nh-message__figure{margin:0}
.nh-message__media .nh-ph{min-height:0;aspect-ratio:4/5;height:auto;border-radius:20px}
.nh-message .c-title__primary::after{content:"";display:block;width:56px;height:5px;border-radius:99px;background:var(--color-base);opacity:.85;margin-top:.7rem}
.nh-message__lead{margin:1.7rem 0 0;color:var(--color-base);font-size:clamp(1.5rem,2.6vw,2.15rem);font-weight:700;line-height:1.55;letter-spacing:.02em}
.nh-message__body{margin-top:1.7rem}
.nh-message__sign{margin-top:2.1rem;display:flex;flex-direction:column;align-items:flex-end;gap:.3rem;text-align:right}
.nh-message__sign__role{color:var(--color-gray);font-size:.9rem;letter-spacing:.05em}
.nh-message__sign__name{color:var(--color-base);font-size:1.32rem;font-weight:700;letter-spacing:.1em}
@media(max-width:900px){
  .nh-message__grid{grid-template-columns:1fr;gap:1.8rem}
  .nh-message__media .nh-ph{aspect-ratio:3/2}
  .nh-message__sign{align-items:flex-start;text-align:left}
}


/* ===== わたしたちの働き方 Our Way ＝ 採用情報(top-company)と同型（左ベージュカード＋右ダーク箱の縦オートスクロール） =====
   カルーセルは main.js(Splide) 非依存の自己完結CSSマーキー。既存の採用情報カルーセルに一切干渉しない（.splide を使わない）。
   2カラム比率は採用情報テンプレのflexが .top-company__slider 基準のため、独自スライダー用に .nh-ourway で明示上書き。
   ダーク箱はカード高さに合わせて伸ばす（viewportを絶対配置にして「高さ100%×track」の循環膨張を回避）。
   カルーセルは PC・スマホともに縦オートスクロールで統一。 */
.nh-ourway .top-company__grid{display:flex;align-items:stretch;gap:clamp(1rem,2vw,2rem)}
.nh-ourway .top-company__content{flex:1 1 0;min-width:0}.nh-ourway .top-company__content__inner{padding-left:60px;padding-right:60px}
.nh-ourway .nh-ow-slider{position:relative;flex:1 1 0;min-width:0;min-height:420px;
  background:var(--color-base);border-radius:24px;overflow:hidden}
.nh-ourway .nh-ow-viewport{position:absolute;inset:16px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 93%,transparent 100%)}
.nh-ow-track{display:block;will-change:transform;animation:nh-ow-scroll 34s linear infinite}
.nh-ow-slide{margin-bottom:20px}
.nh-ow-slide .nh-slide-ph{height:360px;min-height:0;border-radius:16px}
@keyframes nh-ow-scroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@media(max-width:1024px){
  /* スマホ=段積み。カルーセルは縦オートスクロールのまま（横にしない）。段積みで高さ非依存になるため固定高さ */
  .nh-ourway .top-company__grid{flex-direction:column;align-items:stretch;gap:2rem}
  .nh-ourway .top-company__content{flex:none}
  .nh-ourway .nh-ow-slider{flex:none;width:100%;min-height:0;height:400px}
  .nh-ow-slide .nh-slide-ph{height:190px}
}
@media(prefers-reduced-motion:reduce){.nh-ow-track{animation:none}}


/* Our Way: 4ボタン → 元の長い説明文に差し替え（カード内で自然に上→下へ流す） */
.nh-ourway .top-company__content__inner{display:block}
.nh-ourway__body{margin-top:1.7rem}
.nh-ourway__body p{font-size:15px;line-height:1.95;color:var(--color-base)}
.nh-ourway__body p.mt-30{margin-top:1.35rem}


/* ===== 採用情報 ＝ TERASU Lab スニペット（2×2ビビッドカラーグリッド / t-sg）フルカラー採用（大串 2026-07-05） =====
   デザインは不変。実サイト用の調整のみ：①無限ループ→スクロールで1回せり上がる本来挙動(IO) ②font-size は max(px,cqw)で最小可読担保 ③スマホ1カラム */
.t-sg{ --c1:#eafd39; --c2:#f53a70; --c3:#5385db; --c4:#53b0b9; font-family:inherit; box-sizing:border-box; container-type:inline-size; }
.t-sg *{ box-sizing:border-box; }
.t-sg__box{ background:#fff; padding:3.2cqw 6% 3.7cqw; }
.t-sg__h{ text-align:center; font-weight:700; font-size:max(19px,1.75cqw); margin:0 0 3.1cqw; color:#111; }
.t-sg__list{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch; }
.t-sg__item{ flex:0 0 48.86%; min-height:24cqw; padding:max(32px,3.8cqw) 0 max(32px,3.8cqw); margin-bottom:1.78cqw;
  text-align:center; position:relative; overflow:hidden; cursor:pointer; color:#111; opacity:0; transform:translateY(5em); }
.t-sg.is-in .t-sg__item{ animation:t-sgIn .95s cubic-bezier(.13,.38,.12,1) forwards; }
.t-sg.is-in .t-sg__item:nth-child(1){ animation-delay:0s }
.t-sg.is-in .t-sg__item:nth-child(2){ animation-delay:.1s }
.t-sg.is-in .t-sg__item:nth-child(3){ animation-delay:.2s }
.t-sg.is-in .t-sg__item:nth-child(4){ animation-delay:.3s }
.t-sg__item:nth-child(1){ background:var(--c1) }
.t-sg__item:nth-child(2){ background:var(--c2) }
.t-sg__item:nth-child(3){ background:var(--c3) }
.t-sg__item:nth-child(4){ background:var(--c4) }
.t-sg__item::after{ content:""; position:absolute; inset:0; background:#000; z-index:0;
  transform:translateY(102%); transition:transform .5s cubic-bezier(.63,0,.45,1); }
.t-sg__num,.t-sg__title,.t-sg__bar,.t-sg__text,.t-sg__arrow{ position:relative; z-index:1; }
.t-sg__item:hover::after{ transform:translateY(0) }
.t-sg__item:hover{ color:#fff }
.t-sg__num{ font-weight:700; font-size:max(15px,1.7cqw); margin-bottom:.5cqw }
.t-sg__title{ font-weight:700; font-size:max(18px,1.95cqw) }
.t-sg__bar{ width:max(14px,1cqw); height:max(2px,.25cqw); background:currentColor; margin:1.6cqw auto }
.t-sg__text{ font-size:max(12px,1cqw); line-height:1.87; text-align:left; width:62.79%; margin:0 auto }
.t-sg__arrow{ position:absolute; right:1.9cqw; bottom:1.9cqw; width:max(11px,.69cqw); height:max(11px,.69cqw);
  transition:transform .6s cubic-bezier(.29,.9,0,1.44) }
.t-sg__arrow svg{ width:100%; height:100%; display:block }
.t-sg__arrow svg line{ stroke:currentColor; stroke-width:1.3 }
.t-sg__item:hover .t-sg__arrow{ transform:translate(40%,40%) }
@keyframes t-sgIn{ from{transform:translateY(5em);opacity:0} to{transform:translateY(0);opacity:1} }
@media(max-width:640px){
  .t-sg__box{ padding:26px 20px 30px }
  .t-sg__h{ font-size:20px; margin-bottom:22px }
  .t-sg__item{ flex:0 0 100%; min-height:0; padding:32px 22px 32px; margin-bottom:14px }
  .t-sg__num{ font-size:17px; margin-bottom:5px }
  .t-sg__title{ font-size:19px }
  .t-sg__bar{ width:22px; height:2px; margin:14px auto }
  .t-sg__text{ font-size:13px; width:88% }
  .t-sg__arrow{ right:18px; bottom:18px; width:13px; height:13px }
}
@media(prefers-reduced-motion:reduce){ .t-sg__item{ opacity:1; transform:none } .t-sg.is-in .t-sg__item{ animation:none } }


/* 採用情報の見出しを他セクションと同じ c-title__primary（ja/en＋下線バー・左寄せ）に */
.nh-recruit-sg .t-sg .c-title__primary{text-align:left;margin:0 0 2.6rem}
.nh-recruit-sg .c-title__primary::after{content:"";display:block;width:56px;height:5px;border-radius:99px;background:var(--color-base);opacity:.85;margin-top:.7rem}


/* 採用情報カードの中身を濃く（求人条件リスト＋採用リード） */
.t-sg__lead{max-width:44em;margin:0 0 2.4rem;font-size:max(13px,1.02cqw);line-height:1.9;color:#111}
.t-sg__spec{list-style:none;margin:max(14px,1.5cqw) auto 0;padding:0;width:66%;text-align:left;position:relative;z-index:1}
.t-sg__spec li{font-size:max(11px,.86cqw);line-height:1.75;padding-left:1.15em;position:relative;font-weight:500}
.t-sg__spec li::before{content:"・";position:absolute;left:0;font-weight:700}
@media(max-width:640px){
  .t-sg__lead{font-size:14px;margin-bottom:1.6rem}
  .t-sg__spec{width:88%}
  .t-sg__spec li{font-size:12px}
}

/* ===== セクション別の単色水彩スプラッター背景（2026-07-05） ===== */
:root{
  --nh-splatter-mask:url("/assets/images/bg/splatter-mask.png");
  --nh-splatter-size:clamp(760px,92vw,1180px) auto;
  --nh-splatter-fade:clamp(150px,16vw,280px);
}

body,#page,#content,.lower{background:#fff!important}

:where(.top-hero,.top-about,.nh-message,.top-service,.nh-ourway,.nh-news,.nh-recruit-sg,.nh-recruit-extra,.l-aside-recruit,.l-aside-contact){
  --nh-splatter-rgb:238,95,146;
  --nh-splatter-next-rgb:65,151,229;
  --nh-splatter-opacity:.36;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(
      180deg,
      rgba(var(--nh-splatter-rgb),.055) 0%,
      rgba(255,255,255,.97) 24%,
      rgba(255,255,255,.97) calc(100% - var(--nh-splatter-fade)),
      rgba(var(--nh-splatter-next-rgb),.085) 100%
    )!important;
}

:where(.top-hero,.top-about,.nh-message,.top-service,.nh-ourway,.nh-news,.nh-recruit-sg,.nh-recruit-extra,.l-aside-recruit,.l-aside-contact)::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(
      180deg,
      rgb(var(--nh-splatter-rgb)) 0%,
      rgb(var(--nh-splatter-rgb)) calc(100% - var(--nh-splatter-fade)),
      rgb(var(--nh-splatter-next-rgb)) 100%
    );
  -webkit-mask-image:var(--nh-splatter-mask);
  mask-image:var(--nh-splatter-mask);
  -webkit-mask-repeat:repeat;
  mask-repeat:repeat;
  -webkit-mask-size:var(--nh-splatter-size);
  mask-size:var(--nh-splatter-size);
  -webkit-mask-position:var(--nh-splatter-position,center top);
  mask-position:var(--nh-splatter-position,center top);
  opacity:var(--nh-splatter-opacity);
  mix-blend-mode:multiply;
}

:where(.top-hero,.top-about,.nh-message,.top-service,.nh-ourway,.nh-news,.nh-recruit-sg,.nh-recruit-extra,.l-aside-recruit,.l-aside-contact)>*{
  position:relative;
  z-index:1;
}

.top-hero{--nh-splatter-rgb:238,95,146;--nh-splatter-next-rgb:65,151,229;--nh-splatter-opacity:.42}
.top-about{--nh-splatter-rgb:65,151,229;--nh-splatter-next-rgb:247,205,63;--nh-splatter-position:center 12%}
.nh-message{--nh-splatter-rgb:247,205,63;--nh-splatter-next-rgb:241,139,55;--nh-splatter-position:center 20%}
.top-service{--nh-splatter-rgb:241,139,55;--nh-splatter-next-rgb:70,178,151;--nh-splatter-position:center 36%}
.nh-ourway{--nh-splatter-rgb:70,178,151;--nh-splatter-next-rgb:87,181,232;--nh-splatter-position:center 48%}
.nh-news{--nh-splatter-rgb:87,181,232;--nh-splatter-next-rgb:239,95,112;--nh-splatter-position:center 62%}
.nh-recruit-sg{--nh-splatter-rgb:239,95,112;--nh-splatter-next-rgb:238,95,146;--nh-splatter-position:center 72%}
.nh-recruit-extra{--nh-splatter-rgb:238,95,146;--nh-splatter-next-rgb:247,190,60;--nh-splatter-position:center 82%;overflow:visible}
.l-aside-recruit{--nh-splatter-rgb:247,190,60;--nh-splatter-next-rgb:65,151,229;--nh-splatter-position:center 92%}
.l-aside-contact{--nh-splatter-rgb:65,151,229;--nh-splatter-next-rgb:65,151,229;--nh-splatter-position:center 100%}

.nh-recruit-extra::before{
  left:50%;
  right:auto;
  width:100vw;
  transform:translateX(-50%);
}

.top-hero__mov,.nh-ph--hero{
  background:transparent!important;
}
.nh-ph--hero{
  border:0;
}
.nh-ph--hero .nh-ph-label{
  background:rgba(255,255,255,.72);
  color:#666;
}
.top-hero__catch__en,
.top-hero__catch__en span,
.top-hero__catch__jp,
.nh-hero__sub{
  color:var(--color-base)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72);
}
.top-hero__header .hamburger__bar{
  background-color:var(--color-base)!important;
}
.top-hero__header__logo img{
  filter:brightness(0) saturate(0) opacity(.85);
}
.nh-btn--primary{
  background:var(--color-base);
  color:#fff;
}
.nh-btn--ghost{
  background:rgba(255,255,255,.56);
  color:var(--color-base);
  border-color:var(--color-base);
}
.top-hero__news{
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(12px);
}

@media(max-width:640px){
  :root{
    --nh-splatter-size:820px auto;
    --nh-splatter-fade:150px;
  }
  :where(.top-hero,.top-about,.nh-message,.top-service,.nh-ourway,.nh-news,.nh-recruit-sg,.nh-recruit-extra,.l-aside-recruit,.l-aside-contact){
    --nh-splatter-opacity:.32;
  }
  .nh-hero__sub{
    max-width:21em;
    margin-right:auto;
    margin-left:auto;
    overflow-wrap:anywhere;
    word-break:normal;
  }
}