/* ===== フォント ===== */
:root{
  --font-base: "REPLACE_ME", system-ui, -apple-system, "Segoe UI",
               Roboto, Arial, "Helvetica Neue", sans-serif;
}
.sd :where(h1,h2,h3,h4,h5,h6,p,li,a,span,.text):not(.fa):not([class*="fa-"]) {
  font-family: var(--font-base) !important;
}
:root{ --font-base: "Zen Kaku Gothic New", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Helvetica Neue", sans-serif; }




/* ===== ローディング ===== */
:root{
/* 好みで色を調整 */
--bg:#e5e5e5;     /* プリロード背景 */
--fg:#fff;     /* テキスト/ロゴ */
--accent:#6dd5ff; /* アニメの差し色 */
--panel:#e5e5e5;  /* 開閉パネル色 */
--ease: cubic-bezier(.22,.61,.36,1);
--ink: #1e1e1e;   /* 黒っぽい線/塗り */
--ink-hi: #2a2a2a;/* 少しだけ明るい黒 */
}
/* ページ本体では .page を“普通の箱”に戻す（中央寄せはしない） */
.page{
  min-height: 100svh;
  padding: 0;
  display: block;               /* ← grid をやめる */
  /* place-items 等は不要（指定が残っていれば初期化してOK） */
}


  /* ===== Preloader ===== */
  .no-scroll{ overflow:hidden; }

  #preloader{
    position:fixed;
    inset:0;
    z-index:9999;
    background:var(--bg);
    display:grid;
    place-items:center;
    isolation:isolate;
    transition:opacity .6s var(--ease), visibility .6s var(--ease);
  }
  #preloader[hidden]{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }

  /* 左右に開く“ムービー風”パネル */
  .pl-split{
    position:absolute;
    inset:0 50% 0 0;
    background:var(--panel);
    z-index:-1;
    transform:translateX(0);
    transition:transform .8s var(--ease);
  }
  .pl-split.right{
    inset:0 0 0 50%;
  }
  /* 退場時に左右へ開く */
  #preloader.done .pl-split.left { transform:translateX(-100%); }
  #preloader.done .pl-split.right{ transform:translateX(100%);  }

  .pl-wrap{
    text-align:center;
    color:var(--fg);
    display:grid;
    gap:24px;
    padding:24px;
  }
  .pl-logo{
    font-weight:700;
    letter-spacing:.18em;
    font-size:14px;
    opacity:.85;
  }

  /* SVG ローディング“ムービー” */
  .pl-svg{
    width:min(200px, 46vw);
    height:auto;
    display:block;
    margin:auto;
  }

  /* 1) 円形トラックのストローク描画 */
  .ring{
  stroke: var(--ink);
  stroke-dasharray:440;
  stroke-dashoffset:440;
  animation:ringDraw 1.2s var(--ease) forwards, ringPulse 1.8s ease-in-out 1s infinite;
  /* 黒でもわずかに立体感が出るように影は薄めに */
  filter: drop-shadow(0 0 6px rgba(0,0,0,.25));
  }
  @keyframes ringDraw{ to{ stroke-dashoffset:0; } }
  @keyframes ringPulse{
    0%,100%{ opacity:.95 }
    50%    { opacity:.65 }
  }

  /* 2) 中央の四角が回転しながら拡縮 */
  .cube{
    transform-origin:50% 50%;
    animation:cubeSpin 1.6s var(--ease) .15s infinite;
  }
  @keyframes cubeSpin{
    0%  { transform:rotate(0deg) scale(.92); }
    50% { transform:rotate(90deg) scale(1.05); }
    100%{ transform:rotate(180deg) scale(.92); }
  }

  /* 3) 3点ドットがウェーブ */
  .dot{ transform-origin:50% 50%; }
  .dot:nth-child(1){ animation:dot 1s ease-in-out .0s infinite;  }
  .dot:nth-child(2){ animation:dot 1s ease-in-out .15s infinite; }
  .dot:nth-child(3){ animation:dot 1s ease-in-out .30s infinite; }
  @keyframes dot{
    0%,100%{ transform:translateY(0); opacity:.9 }
    50%    { transform:translateY(-7px); opacity:.6 }
  }


  /* 退場時：中身をふわっと消す */
  #preloader.done .pl-wrap{
    transition: transform .6s var(--ease), opacity .6s var(--ease);
    transform:translateY(12px);
    opacity:0;
  }

  /* モーション軽減: 最小限のフェードのみ */
  @media (prefers-reduced-motion: reduce){
    .ring, .cube, .dot{ animation:none !important; }
    .pl-split{ transition:none; }
    #preloader, #preloader.done .pl-wrap{ transition:opacity .3s ease; }
  }

  /* 小さめ画面の微調整 */
  @media (max-width:480px){
    .pl-note{ display:none; }
  }
  


/* ===== Header (nx-*) ? trimmed ===== */
:root{
  --nx-header-h: 80px;
  --nx-bg: #EEE;
  --nx-txt: #000;
  --nx-accent: #000;
  --nx-ghost-bg: #575757;
  --nx-solid-bg: #000;
  --nx-tr: cubic-bezier(0.445,0.05,0.55,0.95);
}

/* Layout */
.nx-header{ position:fixed; inset:0 0 auto 0; height:var(--nx-header-h); background:var(--nx-bg); z-index:9999; }
.nx-header__inner{
  width:100%; height:100%;
  display:grid; grid-template-columns:auto 1fr auto auto; align-items:center;
  gap:0; padding:0 0 0 40px;
}

/* Logo */
.nx-logo{ display:inline-flex; align-items:center; width:220px; }
.nx-logo img{ width:130%; height:auto; display:block; }

/* Desktop Nav */
.nx-nav{ display:block; margin:0 20px 0 0; }
.nx-nav__list{ display:flex; align-items:center; justify-content:flex-end; gap:18px; }
.nx-nav__item{ position:relative; height:var(--nx-header-h); display:flex; align-items:center; }
.nx-nav__link{
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:20px 6px; height:100%; text-decoration:none; color:var(--nx-txt);
}
.nx-nav__en{
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size:20px; font-weight:900; line-height:1; transition:opacity .26s var(--nx-tr);
}
.nx-nav__ja{
  position:absolute; top:45%; transform:translateY(10px);
  font-size:14px; font-weight:700; opacity:0; transition:all .26s var(--nx-tr);
}
.nx-underline{
  position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--nx-accent);
  transform:scaleX(0); transform-origin:left center; transition:transform .28s var(--nx-tr);
}
.nx-nav__link:hover .nx-nav__en{ opacity:0; }
.nx-nav__link:hover .nx-nav__ja{ opacity:1; transform:translateY(-2px); }
.nx-nav__link:hover .nx-underline{ transform:scaleX(1); }

/* Career arrow */
.nx-nav__link--career{ display:flex; flex-direction:row; gap:6px; }
.nx-nav__link--career .nx-nav__ja{ left:0; right:0; text-align:center; }
.nx-arrow{ display:inline-flex; align-items:center; }

/* CTAs */
.nx-cta{ display:flex; align-items:center; gap:0; }
.nx-cta__ghost, .nx-cta__solid{
font-size: 15px;
letter-spacing: 1px;
text-align: center;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:var(--nx-header-h); width:120px; padding:0 8px;
  text-decoration:none; overflow:hidden; font-weight:700; cursor:pointer;
  color:#fff;                               /* 通常は白文字 */
  background-repeat:no-repeat;
  background-position:left center;
  background-size:0% 100%;                  /* ← hoverで100%に */
  transition:background-size .28s var(--nx-tr), color .2s ease;
}
.nx-cta__ghost{ background-color:var(--nx-ghost-bg); background-image:linear-gradient(#fff,#fff); }
.nx-cta__solid{ background-color:var(--nx-solid-bg); background-image:linear-gradient(#fff,#fff); }

/* 子要素は親の色に追従 */
.nx-cta__ghost *,.nx-cta__solid *{ color:inherit; }
.nx-cta__ghost svg,.nx-cta__solid svg{ stroke:currentColor; fill:none; }

/* hover/focus で白く反転＋文字は黒 */
.nx-cta__ghost:hover,
.nx-cta__ghost:focus-visible,
.nx-cta__solid:hover,
.nx-cta__solid:focus-visible{
  background-size:100% 100%;
  color:#000;
}





/* Hamburger */
.nx-burger{ display:none; width:60px; height:60px; border:0; background:#fff; cursor:pointer; place-content:center; }
.nx-burger__bar{ display:block; width:28px; height:1px; background:#000; margin:4px auto; transition:transform .28s var(--nx-tr), opacity .2s; }

/* Drawer */
.nx-drawer{
position:fixed;
inset:0;
background:rgba(0,0,0,.45);
opacity:0;
pointer-events:none;
transition:opacity .25s ease;
}

.nx-drawer__inner{
position:absolute;
inset:0 0 0 auto;
width:100%;
height:100%;
background:#dce1e1;
transform:translateX(100%);
transition:transform .35s var(--nx-tr);
display:flex; flex-direction:column;
padding:12% 7%;
}
.nx-drawer__close{
position: absolute;
top:0;
right: 0;
border:0;
background:transparent;
align-self:flex-end;
width:60px; height:60px;
cursor:pointer;
background-color: #000;
}
.nx-drawer__logo{ display:block; width:200px; margin:8px 0 8px 0px; }
.nx-drawer__logo img{ width:100%; height:auto; display:block; }


.nx-drawer__list{
list-style:none;
padding:12px 0;
margin:0;
display:flex;
flex-direction:column; gap:2px;
}

.nx-drawer__nav{
display:flex;
align-items:baseline;
justify-content:space-between;
border-bottom:1px solid #ccd3d2;
padding:0 0 30px 0;
margin:40px 0 0 0;
}

.nx-drawer__list_left{
width: 50%;
border-right:1px solid #ccd3d2;
}

.nx-drawer__list_right{
width: 50%;
padding: 0 0 0 6%;
box-sizing: border-box;
}

.nx-drawer__list_left li,
.nx-drawer__list_right li{
padding: 0 0 0px 0;
margin: 0 0 20px 0;
}
.nx-drawer__list_left li:last-child { margin-bottom:0; }
.nx-drawer__list_right li:last-child { margin-bottom:0; }

.nx-drawer__list_left a p,
.nx-drawer__list_right a p{
text-decoration:none;
color:#111;
font-weight:900;
font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
font-size:28px;
display: inline;
}

.nx-drawer__list_left a svg,
.nx-drawer__list_right a svg{
display: inline;
}

.nx-drawer__list_left a span,
.nx-drawer__list_right a span{
display: block;
font-size:13px;
font-weight:700;
opacity:.8;
letter-spacing:0px;
line-height: 2;
}


.nx-drawer__ctas{
width: 100%;
margin:0px auto 0 auto;
padding: 30px 0;
border-bottom:1px solid #ccd3d2;
display:grid;
gap:10px;
}

/* Open state */
.nx-header.is-open .nx-drawer{ opacity:1; pointer-events:auto; }
.nx-header.is-open .nx-drawer__inner{ transform:translateX(0); }
.nx-header.is-open .nx-burger .nx-burger__bar:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.nx-header.is-open .nx-burger .nx-burger__bar:nth-child(2){ opacity:0; }
.nx-header.is-open .nx-burger .nx-burger__bar:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* Responsive */
@media (max-width:1140px){ .nx-logo{ width:200px;margin: 0 0 0 7%; } }
@media (max-width:980px){
  .nx-cta__ghost, .nx-cta__solid{width: 75%;max-width: 300px;margin: 0 auto;}
  .nx-nav,.nx-cta{ display:none; }
  .nx-burger{ display:grid; }
  .nx-header__inner{ grid-template-columns:auto 1fr auto; padding:0 14px; }
  :root{ --nx-header-h:60px; }
}
@media (max-width:360px){
  .nx-logo{ width:160px;margin: 0 0 0 7%;}
  .nx-burger{ width:50px; height:50px; }
  .nx-burger__bar{ width:30px; }
}

.nx-drawer__pp{text-align: left;margin: 15px 0 0 0;font-size: 13px;font-weight: 500;}

/* Page overlap & touch feedback */
body{ scroll-behavior:smooth; }
body.nx-scroll-lock{ overflow:hidden; }
@media (hover:none){
  .nx-cta__ghost:active,.nx-cta__solid:active{ background-size:100% 100%; color:#000; }
}

/* === right actions（スマホ時の右寄せ＋メールボタン） === */
.nx-actions{
  display:none;            /* PCでは非表示 */
  align-items:center;
  gap:8px;
}

/* メールボタン（黒地に白アイコン） */
.nx-mail{
  display:grid; place-items:center;
  width:60px; height:60px;
  background:#000; color:#fff;
  text-decoration:none; border:0; border-radius:0;
}
.nx-mail svg{ stroke:currentColor; fill:none; }

/* スマホで表示＆右端に寄せる */
@media (max-width:980px){
  .nx-actions{ display:flex; justify-self:end; }        /* グリッドの右端へ */
  .nx-nav, .nx-cta{ display:none; }                     /* 既に指定済みでもOK（念押し） */
  .nx-header__inner{ grid-template-columns:auto 1fr auto; } /* 右カラム＝.nx-actions */
  :root{ --nx-header-h:60px; }
  .nx-mail{ width:60px; height:60px;margin: 0;}
}

/* さらに小さい端末のサイズ合わせ（任意） */
@media (max-width:360px){
  .nx-mail{ width:50px; height:50px; }
  .nx-burger{ width:50px; height:50px; }
  .nx-burger__bar{ width:30px; }
}

/* === スマホ時、右端まで寄せる（右パディングを0） === */
@media (max-width:980px){
  .nx-header__inner{
    /* 以前の padding: 0 14px; を上書き */
    padding: 0 0 0 0px !important; /* ←右0・左14 */
    grid-template-columns: auto 1fr auto; /* 念のため */
  }
  .nx-actions{
    justify-self: end;    /* 右端へ */
    margin-right: 0 !important;
  }
}

/* === スマホ：メールとバーガーの“間の余白”をゼロに === */
@media (max-width:980px){
  .nx-actions{
    gap: 0 !important;          /* ← これで間隔ゼロ */
  }
  .nx-actions > .nx-mail,
  .nx-actions > .nx-burger{
    margin: 0 !important;       /* 念のための保険 */
  }
  /* 2つを“正方形でピタッ”と並べる（サブピクセル誤差防止） */
  .nx-mail, .nx-burger{
    flex: 0 0 var(--nx-header-h);
    width: var(--nx-header-h);
    height: var(--nx-header-h);
    padding: 0;
  }
}







/* リセット：前に入れたオフセットはゼロに戻す */
body { padding-top: 0 !important; }
header.nx-header + main#pagetop{
  padding-top: 0 !important;
  margin-top: 0 !important;
}
header.nx-header + main#pagetop > :first-child{
  margin-top: 0 !important;  /* 先頭要素の上マージン潰し */
}

/* 仕上げ：見た目を詰めるための“少しだけ”マイナス余白 */
:root{
  --nx-tighten-pc: 14px;  /* PCでどれだけ詰めるか（調整可） */
  --nx-tighten-sp: 15px;  /* SPでどれだけ詰めるか（調整可） */
}
@media (min-width: 981px){
  header.nx-header + main#pagetop{
    margin-top: calc(-1 * var(--nx-tighten-pc)) !important;
  }
}
@media (max-width: 980px){
  header.nx-header + main#pagetop{
    margin-top: calc(-1 * var(--nx-tighten-sp)) !important;
  }
}

/* 任意：ページ内リンクの到達位置はヘッダー分だけ確保 */
[id]{ scroll-margin-top: var(--nx-header-h); }







/* === ボタン群(.sec-54 / .sec-58)をヘッダーCTAと同じホバーに === */

/* 旧マスクレイヤーは使わない */
.sd.sec-57, .sd.sec-60 { display: none !important; }

/* ベース（通常時：背景はグレー/黒、文字は白） */
.sd.sec-54, .sd.sec-58{
  position: relative;
  overflow: hidden;
  cursor: pointer;

  /* 子要素の色を親に追従させる */
  color: #fff;
  text-decoration: none;
  background-repeat: no-repeat;
  background-position: left center;

  /* 左→右に広がる白のグラデーション（ヘッダーと同じ方式） */
  background-image: linear-gradient(#fff, #fff);
  background-size: 0% 100%;
  transition:
    background-size .28s cubic-bezier(0.445,0.05,0.55,0.95),
    color .2s ease;
}

/* 子要素は親の color を継承（Material Icons も含む） */
.sd.sec-54 .sd.sec-55,
.sd.sec-54 .sd.sec-56,
.sd.sec-58 .sd.sec-59 {
  color: inherit !important;
}

/* ホバー/フォーカス時：白マスクが全域に → 文字は黒に反転 */
.sd.sec-54:hover,
.sd.sec-54:focus-visible,
.sd.sec-58:hover,
.sd.sec-58:focus-visible{
  background-size: 100% 100%;
  color: #000;
}

/* タッチ端末の“押した感” */
@media (hover: none){
  .sd.sec-54:active,
  .sd.sec-58:active{
    background-size: 100% 100%;
    color: #000;
  }
}





/* about上横スクロール */
/* 器とはみ出し制御＆重ね基準 */
.sd.sec-66{ overflow: hidden; }
.sd.sec-67{ position: relative; }

/* Studio側のスライドは“見た目だけ”消す（レイアウトは維持） */
.sd.sec-67[data-type="carousel"] .sec-68,
.sd.sec-67[data-type="carousel"] .sec-69{
  opacity: 0 !important;
  visibility: hidden !important;
}

/* レスポンシブ係数（高さ・速度・比率） */
:root{
  /* 帯の高さ：18?96pxを画面幅で自動スケール。好みに調整可 */
  --ticker-h: clamp(18px, 8vw, 120px);
  /* 画像のアスペクト：300/18 = 16.6667（拡縮しても継ぎ目なし） */
  --tile-ratio: 16.6667;
  /* 流れる速さ（小さいほど速い） */
  --ticker-speed: 26s;
}

/* 帯本体：親の中央に疑似要素で重ねる */
.sd.sec-67[data-type="carousel"]::after{
  content:"";
  position:absolute; left:0; right:0;
  top:50%; transform:translateY(-50%);
  height:var(--ticker-h);
  z-index: 5;                    /* 子スライドより前に出す */
  pointer-events:none;           /* クリックを邪魔しない */
  background-color: transparent; /* 余計な色帯が出ないよう明示 */
  background-image:url("../img/s-300x18_8d89fea7-de19-4c42-8710-fdb81649a594.svg");
  background-repeat:repeat-x;
  background-size: calc(var(--ticker-h) * var(--tile-ratio)) var(--ticker-h);
  background-position: 0 50%;
  animation: nx-ticker var(--ticker-speed) linear infinite;
  will-change: background-position;
}

/* タイル1枚ぶんずらしてシームレスループ（右→左） */
@keyframes nx-ticker{
  from { background-position: 0 50%; }
  to   { background-position: calc(-1 * var(--ticker-h) * var(--tile-ratio)) 50%; }
}

/* 好みでSPだけ速くする等（任意） */
@media (max-width:540px){
  :root{ --ticker-speed: 12s; }
}

/* まず“スマホ優先（モバイルファースト）”で可変高さ */
:root{
  /* 例：18px?120pxの範囲で、画面幅に応じて自動スケール */
  --ticker-h: clamp(48px, 10vw, 140px);
}

/* PC（デスクトップ）は高さを固定 180px に */
@media (min-width: 981px){
  :root{
    --ticker-h: 170px;
    /* （任意）大きくした分、少しゆっくりにしたい場合
       --ticker-speed: 24s;  などに調整してもOK */
  }
}






/* ===== ファーストビュー：ロード後にアニメ（最小構成） ===== */

/* アニメ用カーブ */
:root { --nx-ease: cubic-bezier(0.22,0.61,0.36,1); }

/* 初期状態：テキストは右から、ボタンは下から */
.sec-45 .sec-49,  /* 小見出し */
.sec-45 .sec-51,  /* H1 */
.sec-45 .sec-52 { /* 説明文 */
  opacity: 0;
  transform: translateX(36px);
  will-change: transform, opacity;
}
.sec-45 .sec-54,  /* 資料DL */
.sec-45 .sec-58 { /* お問い合わせ */
  opacity: 0;
  transform: translateY(22px);
  will-change: transform, opacity;
}

/* 再生トリガー（プリロード完了で body に .nx-loaded を付与） */
body.nx-loaded .sec-45 .sec-49 { animation: nx-slide-in-right .70s var(--nx-ease) .00s forwards; }
body.nx-loaded .sec-45 .sec-51 { animation: nx-slide-in-right .80s var(--nx-ease) .12s forwards; }
body.nx-loaded .sec-45 .sec-52 { animation: nx-slide-in-right .80s var(--nx-ease) .24s forwards; }
body.nx-loaded .sec-45 .sec-54 { animation: nx-slide-up       .70s var(--nx-ease) .38s forwards; }
body.nx-loaded .sec-45 .sec-58 { animation: nx-slide-up       .70s var(--nx-ease) .54s forwards; }

/* キーフレーム（重複定義は削除） */
@keyframes nx-slide-in-right {
  from { opacity: 0; transform: translateX(36px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes nx-slide-up {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Studioの .appear を“ロード後だけ”無効化（このセクション限定） */
body.nx-loaded .sec-45 .appear {
  opacity: 1 !important;
  transition: none !important;
}

/* モーション軽減 */
@media (prefers-reduced-motion: reduce) {
  .sec-45 .sec-49,
  .sec-45 .sec-51,
  .sec-45 .sec-52,
  .sec-45 .sec-54,
  .sec-45 .sec-58 {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}




/* === 共通：タイトル・マスクスライド（全セクション使い回し） === */
:root{ --nx-ease: cubic-bezier(.22,.61,.36,1); }

.nx-title{
  position: relative; overflow: hidden; contain: paint;
}
/* Studioの .appear をこの範囲では無効化（チラつき防止） */
.nx-title .appear{ opacity:1 !important; transform:none !important; transition:none !important; }

/* タイトル文字は不透明のまま。入るときだけ軽く持ち上げる */
.nx-title__text{ position:relative; z-index:1; display:inline-block; }
.nx-title.nx-animate .nx-title__text{ transform: translateY(10px); }
.nx-title.nx-in      .nx-title__text{ animation: nx-title-up .6s var(--nx-ease) var(--nx-delay,0s) forwards; }

/* 擬似要素の“板”で全面マスク → 横へスライドして外す */
.nx-title::before{
  content:""; position:absolute; inset:-1px 0 -1px 0; z-index:2; pointer-events:none;
  background: var(--nx-mask, #000);
  will-change: transform; transform: translateX(0) translateZ(0);
}
.nx-title.nx-in::before{
  animation: nx-mask-ltr .8s var(--nx-ease) var(--nx-delay,0s) forwards;
}
/* 右→左に抜きたいとき */
.nx-title[data-dir="rtl"].nx-in::before{ animation-name: nx-mask-rtl; }

/* キーフレーム */
@keyframes nx-title-up{ from{transform:translateY(10px)} to{transform:translateY(0)} }
@keyframes nx-mask-ltr{ from{transform:translateX(0)} to{transform:translateX(101%)} }
@keyframes nx-mask-rtl{ from{transform:translateX(0)} to{transform:translateX(-101%)} }

/* モーション軽減 */
@media (prefers-reduced-motion: reduce){
  .nx-title::before, .nx-title__text{ animation:none !important; transform:none !important; }
}



/* ===== nx-reveal：最小＆安定（transition一本化） ===== */
:root { --nx-ease: cubic-bezier(.22,.61,.36,1); }

/* 初期は隠す＋フェード/スライドの遷移を定義 */
.nx-reveal{
  opacity: 0 !important;
  transform: translate3d(var(--nx-x,0), var(--nx-y,24px), 0) scale(var(--nx-scale,1)) !important;
  transition-property: opacity, transform !important;
  transition-duration: var(--nx-dur, 1s) !important;   /* 既定（下の最終上書きでPC/SP別に） */
  transition-timing-function: var(--nx-ease) !important;
  transition-delay: var(--nx-delay, 0s) !important;
  will-change: transform, opacity;
}

/* 方向ユーティリティ */
.nx-up    { --nx-x: 0;    --nx-y: 24px; }
.nx-down  { --nx-x: 0;    --nx-y:-24px; }
.nx-left  { --nx-x: 36px; --nx-y: 0; }
.nx-right { --nx-x:-36px; --nx-y: 0; }
.nx-zoom  { --nx-scale: 1.04; }

/* 画面に入ったら最終状態へ */
.nx-reveal.nx-inview{
  opacity: 1 !important;
  transform: translate3d(0,0,0) scale(1) !important;
}

/* Studioの .appear がトランジションを壊さないように */
.nx-reveal.appear,
.nx-reveal.appear-active{ transition: inherit !important; }

/* モーション軽減 */
@media (prefers-reduced-motion: reduce){
  .nx-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* === FINAL OVERRIDE: PC/SPの速度だけ最後に強制上書き === */
@media (min-width: 981px){
  .nx-reveal,
  .nx-reveal.appear,
  .nx-reveal.appear-active,
  .nx-reveal.nx-inview{
    animation: none !important;                                /* 過去のanimation方式を無効化 */
    transition-property: opacity, transform !important;
    transition-duration: 1.20s !important;                     /* ★PCの速度：ここを調整 */
    transition-timing-function: cubic-bezier(.22,.61,.36,1) !important;
    /* 任意：少し“間”を置くなら有効化 */
    /* transition-delay: .20s !important; */
  }
}
@media (max-width: 980px){
  .nx-reveal,
  .nx-reveal.appear,
  .nx-reveal.appear-active,
  .nx-reveal.nx-inview{
    animation: none !important;
    transition-property: opacity, transform !important;
    transition-duration: 0.95s !important;                     /* ★SPの速度：ここを調整 */
    transition-timing-function: cubic-bezier(.22,.61,.36,1) !important;
    /* transition-delay: .12s !important; */
  }
}

/* 画像ラッパの初期状態 */
.nx-imgWrap {
  opacity: 0;
  transform: translateY(8px) scale(1.02);
  filter: blur(8px);
  will-change: opacity, transform, filter;
  transition:
    opacity var(--nx-dur, .9s) cubic-bezier(.22,1,.36,1),
    transform var(--nx-dur, .9s) cubic-bezier(.22,1,.36,1),
    filter calc(var(--nx-dur, .9s) + .2s) ease;
}

/* 表示状態（IOで .is-in を付与） */
.nx-imgWrap.is-in {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

/* 画像の表示ぶれを抑える */
.nx-imgWrap img {
  display: block;
  width: 100%;
  height: auto;
}

/* 端末が「視覚効果を減らす」設定なら控えめに */
@media (prefers-reduced-motion: reduce) {
  .nx-imgWrap { transition: opacity .2s linear; transform: none; filter: none; }
}







/* ========================
   nx-wipeBtn（汎用横塗りボタン）
   ======================== */
.nx-wipeBtn{
  /* カスタム可能な変数（必要に応じてHTMLの style= で上書き） */
  --btn-bg:   #000;      /* 初期背景（黒） */
  --btn-fg:   #fff;      /* 初期文字色（白） */
  --btn-wipe: #575757;   /* 横塗りの色（グレー） */
  --btn-h:    60px;      /* 高さ */
  --btn-px:   18px;      /* 左右パディング */
  --btn-wipe-duration: .28s;
  --btn-ease: cubic-bezier(0.445,0.05,0.55,0.95);

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--btn-h);
  padding: 0 var(--btn-px);
  text-decoration: none;
  border-radius: 0;

  position: relative;
  overflow: visible;             /* 右の装飾線を切らない */
  background: var(--btn-bg);
  color: var(--btn-fg);

  /* 横塗り（背景サイズを伸ばす） */
  background-image: linear-gradient(var(--btn-wipe), var(--btn-wipe));
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0% 100%;
  transition: background-size var(--btn-wipe-duration) var(--btn-ease);
}

.nx-wipeBtn:hover,
.nx-wipeBtn:focus-visible{ background-size: 100% 100%; }

.nx-wipeBtn, .nx-wipeBtn *{ color: inherit; } /* 子も親の色に追従 */

.nx-wipeBtn__label{ font-weight: 600; letter-spacing: .03em; }

/* 右の装飾線（白/黒 1px） */
.nx-wipeBtn--hasMark{ padding-right: calc(var(--btn-px) + 40px); } /* マーク分の余白 */
.nx-wipeBtn__mark{
  position: absolute; right: -20px; top: 50%;
  width: 40px; height: 1px; transform: translateY(-50%);
  display: flex; z-index: 3; pointer-events: none;
}
.nx-wipeBtn__mark span{ flex:1; }
.nx-wipeBtn__mark span:first-child{ background: #fff; }
.nx-wipeBtn__mark span:last-child { background: #000; }

/* 幅いっぱいにしたいとき */
.nx-wipeBtn--block{ display:flex; width:100%; }

/* SPの高さ/余白微調整（任意） */
@media (max-width:540px){
  .nx-wipeBtn{ --btn-h: 56px; --btn-px: 14px; }
}

/* === nx-reveal 併用時：FINAL OVERRIDEが background-size を殺す問題への対策 === */
.nx-wipeBtn.nx-reveal,
.nx-wipeBtn.nx-reveal.appear,
.nx-wipeBtn.nx-reveal.appear-active,
.nx-wipeBtn.nx-reveal.nx-inview{
  transition-property: opacity, transform, background-size !important;
  transition-duration:
    var(--nx-dur,1s), var(--nx-dur,1s), var(--btn-wipe-duration,.28s) !important;
  transition-timing-function:
    var(--nx-ease), var(--nx-ease), var(--btn-ease) !important;
}

/* タッチ端末：押下で横塗りを即表示（任意） */
@media (hover:none){
  .nx-wipeBtn:active{ background-size:100% 100%; }
}

/* === nx-wipeBtn：色と幅の最終パッチ === */
/* 1) 文字色を常にボタン指定色に（上書きに強く） */
.nx-wipeBtn,
.nx-wipeBtn:link,
.nx-wipeBtn:visited,
.nx-wipeBtn:hover,
.nx-wipeBtn:focus-visible{
  color: var(--btn-fg, #fff) !important;
  text-decoration: none;
  -webkit-text-fill-color: currentColor; /* Safari対策 */
}
.nx-wipeBtn *{ color: inherit !important; }

/* 2) 幅を変えられるように（デフォはauto） */
.nx-wipeBtn{
  width: var(--btn-w, auto);       /* 固定幅にしたい時は --btn-w:260px など */
  min-width: var(--btn-minw, auto);/* 最低幅を持たせたい時は --btn-minw:240px など */
}

/* 幅計算を安定化 */
.nx-wipeBtn{
  box-sizing: border-box;
  width: var(--btn-w, auto);       /* 固定したい時だけ --btn-w を指定 */
  min-width: var(--btn-minw, auto);
}

/* 旧ボタン相当のサイズ（PC:260px / SP:200px） */
.nx-wipeBtn--md{ --btn-minw: 260px; }
@media (max-width:540px){
  .nx-wipeBtn--md{ --btn-minw: 200px; }
}

/* さらに大きい/小さいバリエーション（お好みで） */
.nx-wipeBtn--sm{ --btn-minw: 200px; }
.nx-wipeBtn--lg{ --btn-minw: 320px; }





/* === サービス行の矢印丸：黒→グレーの横スライド（全行に効く） === */

/* 丸のベース（黒） */
.sd.sec-129, .sd.sec-146, .sd.sec-163{
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #000;
}

/* グレーの“塗り”レイヤー（左→右にwipe） */
.sd.sec-130, .sd.sec-147, .sd.sec-164{
  position: absolute;
  inset: 0;
  background: #575757;                 /* ホバー後のグレー */
  transform: scaleX(0) !important;     /* 既存の scale(0,1) を確実に上書き */
  transform-origin: left center;
  transition: transform .28s cubic-bezier(0.445,0.05,0.55,0.95) !important;
  z-index: 0;
}

/* 各行（= 各 a.sec-115）をホバーしたら塗りを全開 */
a.sd.sec-115:hover .sd.sec-130,
a.sd.sec-115:hover .sd.sec-147,
a.sd.sec-115:hover .sd.sec-164{
  transform: scaleX(1) !important;
}

/* アイコンは常に白 */
.sd.sec-131, .sd.sec-148, .sd.sec-165{
  color: #fff !important;
  z-index: 1;
  transition: color .2s ease; /* お好みで */
}

/* タッチ端末：押下時にも反転を見せる */
@media (hover:none){
  a.sd.sec-115:active .sd.sec-130,
  a.sd.sec-115:active .sd.sec-147,
  a.sd.sec-115:active .sd.sec-164{
    transform: scaleX(1) !important;
  }
}





/* ========== RowLink（行リンク）最小・汎用セット ========== */

/* 本体 */
.nx-rowLink{
  display:flex; align-items:center; gap:20px;
  padding:30px 0; border-bottom:1px solid #000;
  color:inherit; text-decoration:none;
}

/* 左右ブロック */
.nx-rowLink__main{ display:flex; align-items:flex-start; gap:20px; flex:1; }
.nx-rowLink__left{ flex:1 1 50%; padding-right:20px; }
.nx-rowLink__right{ flex:1 1 50%; padding-left:20px; }

/* タイポ（元テンプレのフォント変数を尊重） */
.nx-rowLink__title{
  margin:0 0 10px;
  font-family: var(--s-font-daa8975e,
    ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif);
  font-size:28px; font-weight:600; line-height:1.4; color:#000;
}
.nx-rowLink__desc{
  margin:0;
  font-family: var(--s-font-cda1e569,
    ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif);
  font-size:16px; line-height:1.6; font-weight:400; color:#000;
}

/* 見出し「提供メニュー」 */
.nx-rowLink__menuHead{ display:flex; align-items:center; gap:10px; margin:0 0 6px; }
.nx-rowLink__menuLine{ width:20px; height:1px; background:#000; }
.nx-rowLink__menuLabel{
  margin:0;
  font-family: var(--s-font-daa8975e,
    ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif);
  font-size:16px; font-weight:600; color:#000;
}

/* タグ群 */
.nx-rowLink__menu{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
.nx-rowLink__menuItem{ margin:0; padding:0; }
.nx-tag{
  background:#EEE; color:#333; border-radius:24px;
  padding:4px 14px; margin:0;
  font-family: var(--s-font-daa8975e,
    ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif);
  font-size:15px; line-height:1.4;font-weight:600; 
}
.nx-rowLink:hover .nx-tag{ background:#dbe1e1; }

/* 右端CTA（テキスト＋丸アイコン） */
.nx-rowLink__cta{ display:flex; align-items:center; gap:20px; margin:0 20px; }
.nx-rowLink__ctaText{
  display:none; margin:0; font-size:16px; color:#000;
  font-family: var(--s-font-daa8975e,
    ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif);
  font-weight:400;
}

/* 丸チップ（黒→グレーの横ワイプ＋白矢印） */
.nx-rowLink__chip{
  position:relative; display:grid; place-items:center;
  width:70px; height:70px; border-radius:50%;
  background:#000; overflow:hidden; isolation:isolate; flex:0 0 auto;
}
.nx-rowLink__fill{
  position:absolute; inset:0; border-radius:inherit; background:#575757;
  transform:scaleX(0); transform-origin:left center;
  transition:transform .28s cubic-bezier(0.445,0.05,0.55,0.95);
  pointer-events:none; z-index:0;
}
.nx-rowLink__icon{ position:relative; z-index:1; color:#fff; font-size:20px; line-height:1; }
.nx-rowLink:hover .nx-rowLink__fill,
.nx-rowLink:focus-visible .nx-rowLink__fill{ transform:scaleX(1); }

/* 区切り線ありバリエーション（必要な行だけ修飾子を付ける） */
.nx-rowLink--divide .nx-rowLink__left{ border-right:1px dotted #000; }

/* ====== レスポンシブ ====== */
@media (max-width: 840px){
  .nx-rowLink{ flex-direction:column; align-items:stretch; padding:40px 0 10px; }
  .nx-rowLink__main{ flex-direction:column; gap:20px; }
  .nx-rowLink__left{ padding-right:0; }
  .nx-rowLink__right{ padding-left:0; }
  .nx-rowLink__cta{ margin:10px 0 0; gap:12px; }
  .nx-rowLink--divide .nx-rowLink__left{ border-right:0; }
  .nx-rowLink--divide .nx-rowLink__right{ border-bottom:1px dotted #000; padding-bottom:30px; }
}

@media (max-width: 540px){
  .nx-rowLink__title{ font-size:22px; }
  .nx-rowLink__desc { font-size:14px; }
  .nx-tag{ font-size:14px; }

  /* CTAを“セット”で中央寄せ＋SP用サイズ */
  .nx-rowLink__cta{
    width:100%; justify-content:center; align-items:center; gap:10px; margin:10px 0 0;
  }
  .nx-rowLink__ctaText{
    display:inline-block; text-align:center; margin:0; width:auto;
  }
  .nx-rowLink__chip{ width:50px; height:50px; }
}



/* 自動スクロール用の軽い指定（速度は px/秒） */
.nx-as{
  --nx-as-speed: 40;             /* ← 好みで。例: 20?80 */
  display: flex;                  /* 念のため（Studioのsdがflexでも上書きOK） */
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-behavior: auto !important; /* 自動スクロールと競合しないように */
}




/* 画像枠：はみ出しを隠す */
.sd.sec-183{
  position: relative;
  overflow: hidden;
}

/* 画像本体：初期状態＋トランジション */
.sd.sec-183 .sd.sec-186{
  width:100%; height:100%;
  transform: translateZ(0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .60s cubic-bezier(.22,.61,.36,1) !important;
  will-change: transform;
  /* 背景で使っている場合の保険 */
  background-size: cover;
  background-position: center;
}

/* カード全体にホバーでズーム */
.sd.sec-182:hover .sd.sec-186{
  transform: translateZ(0) scale(1.06) !important;
}

/* 画像エリアだけのホバーでも発火（保険） */
.sd.sec-183:hover .sd.sec-186{
  transform: translateZ(0) scale(1.06) !important;
}

/* モバイルは控えめ（任意） */
@media (max-width:540px){
  .sd.sec-182:hover .sd.sec-186,
  .sd.sec-183:hover .sd.sec-186{
    transform: translateZ(0) scale(1.03) !important;
  }
}

/* ===== カード内「詳しく見る」：ホバーでフェード＋スライド表示 ===== */

/* 画像ラッパ（はみ出し防止）? 既に指定済みならOK */
.sd.sec-183{ position: relative; overflow: hidden; }

/* 初期：隠す＋トランジション設定（appear競合に勝つため全状態で上書き） */
.sd.sec-184,
.sd.sec-184.appear,
.sd.sec-184.appear-active{
  opacity: 0 !important;
  transform: translateY(0) !important;                 /* 初期位置 */
  transition:
    opacity   .45s cubic-bezier(.22,.61,.36,1) !important,
    transform .45s cubic-bezier(.22,.61,.36,1) !important;
  pointer-events: none;                                 /* クリックの邪魔をしない */
  z-index: 3;                                           /* 画像の上に */
}

/* ホバー/フォーカスで表示＆少し上にスライド */
.sd.sec-182:hover .sd.sec-184,
.sd.sec-183:hover .sd.sec-184,
.sd.sec-182:focus-within .sd.sec-184{
  opacity: 1 !important;
  transform: translateY(-20px) !important;
}



/* ===== 丸いアロー：黒→グレーのワイプ（CONTACT/DOWNLOAD 両方に適用） ===== */

/* 丸チップ（黒の円） */
.sd.sec-252,
.sd.sec-264{
  position: relative;             /* fill の基準 */
  overflow: hidden;               /* 円外にはみ出さない */
  isolation: isolate;             /* レイヤー分離（にじみ防止） */
}

/* グレーの塗り（左→右に伸びる） */
.sd.sec-253,
.sd.sec-265{
  transform: scaleX(0);           /* 初期は非表示 */
  transform-origin: left center;  /* 左から伸びる */
  transition: transform .28s cubic-bezier(0.445,0.05,0.55,0.95);
  pointer-events: none;           /* クリックの邪魔をしない */
  z-index: 0;
  will-change: transform;
}

/* アローは常に白で前面 */
.sd.sec-254,
.sd.sec-266{
  color: #fff !important;         /* 以前の #dbe1e1 を白に統一 */
  position: relative;
  z-index: 1;
}

/* ホバー/フォーカス時に塗りを全幅へ（＝黒→グレーへ） */
/* CONTACT 側 */
.sd.sec-244:hover  .sd.sec-253,
.sd.sec-244:focus-within .sd.sec-253{ transform: scaleX(1); }
/* DOWNLOAD 側 */
.sd.sec-256:hover  .sd.sec-265,
.sd.sec-256:focus-within .sd.sec-265{ transform: scaleX(1); }


/* ========== CONTACT / DOWNLOAD の丸いアローを
   黒→グレーのワイプに統一（強制オーバーライド） ========== */

/* 円の器（黒い丸） */
.sd.sec-252,
.sd.sec-264{
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

/* グレーの塗り（左→右に伸びる） */
.sd.sec-253,
.sd.sec-265{
  background: #575757 !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 50% !important;
  transform: scaleX(0) !important;            /* 初期：見えない */
  transform-origin: left center !important;    /* 左から伸ばす */
  transition: transform .28s cubic-bezier(0.445,0.05,0.55,0.95) !important;
  pointer-events: none !important;
  z-index: 0 !important;
  will-change: transform !important;
}

/* アイコン（常に白） */
.sd.sec-254,
.sd.sec-266{
  color: #fff !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Hover/Focus で塗りを全幅へ ?? CONTACT 側 */
.sd.sec-244:hover .sd.sec-253,
.sd.sec-244:focus-within .sd.sec-253{
  transform: scaleX(1) !important;
}

/* Hover/Focus で塗りを全幅へ ?? DOWNLOAD 側 */
.sd.sec-256:hover .sd.sec-265,
.sd.sec-256:focus-within .sd.sec-265{
  transform: scaleX(1) !important;
}

/* （保険）もし下の方に旧指定があり競合しても勝てるように */
.sd.sec-244:hover .sd.sec-253,
.sd.sec-256:hover .sd.sec-265{ transition: transform .28s cubic-bezier(0.445,0.05,0.55,0.95) !important; }


.sec-275 a{
-webkit-transition: 0.2s ease-in-out!important;;
-moz-transition: 0.2s ease-in-out!important;;
-o-transition: 0.2s ease-in-out!important;;
transition: 0.2s ease-in-out!important;;
}
.sec-275 a:hover{
opacity: 0.5!important;;
}


/* 画像枠：オーバーレイや拡大がはみ出さない基準 */
.sd.sec-183{ position: relative; overflow: hidden; }

/* 画像：枠いっぱい＆アスペクト維持（letterbox/歪み防止） */
.sd.sec-186{ display: block; width: 100%; height: 100%; object-fit: cover; }




/* 流れる画像 */
/* デフォルト（入れ忘れ時の保険） */
:root{
  --nx-height: 64px;   /* 帯の高さ */
  --nx-speed: 26s;     /* 小さいほど速い */
}

/* 器：高さを決めて中身をはみ出させる */
.nx-ticker2{
  position: relative;
  width: 100%;
  height: var(--nx-height);
  overflow: hidden;
}

/* トラック：画像2枚を横並びにして “自分幅の50%” だけ左に流す → 無限ループ */
.nx-track{
  display: inline-flex;
  height: 100%;
  gap: 0;
  will-change: transform;
  animation: nx-marquee var(--nx-speed) linear infinite;
  transform: translateX(0);
}

/* 画像は帯の高さにフィット（横幅は自動） */
.nx-track img{
  height: 100% !important;
  width: auto !important;
  display: block;
  flex: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* 2枚ぶんのうち “1枚ぶん” だけスライド（= 自幅の 50%） */
@keyframes nx-marquee{
  from{ transform: translateX(0); }
  to  { transform: translateX(-50%); }
}

/* ユーザーが動きを減らす設定なら停止 */
@media (prefers-reduced-motion: reduce){
  .nx-track{ animation: none; }
}
/* 旧ティッカー完全停止（このページ内だけに限定） */
.sd.sec-66 .sec-67[data-type="carousel"]::after,
.sd.sec-66 .sec-67::after{
  content: none !important;
  animation: none !important;
  background: none !important;
  height: 0 !important;
}

/* 旧スライドの中身も念のため無効化（表示させない） */
.sd.sec-66 .sec-68,
.sd.sec-66 .sec-69{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
/* スマホは少し低めに */
@media (max-width: 540px){
  .nx-ticker2{ --nx-height: clamp(28px, 8vw, 64px); --nx-speed: 12s; }
}






/*パンクズ*/
.sd.pankuzu {
    text-align: left;
    align-content: flex-start;
    align-items: flex-start;
    background: #EEEEEE;
    border-bottom: 0px solid #dbe1e1;
    border-left: 0px solid #dbe1e1;
    border-right: 0px solid #dbe1e1;
    border-top: 1px solid #dbe1e1;
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    height: auto;
    justify-content: center;
    padding: 20px 40px;
    width:100%;
}

@media screen and (max-width: 540px) {
  .sd.pankuzu {
    padding: 14px 20px;
  }
}

.sd.pankuzu_in {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.pankuzu_in {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.sd.pankuzu_in_t01 {
  color: #000000;
  font-size: 14px;
  font-weight:600;
  height: auto;
  line-height: 1;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

.sd.pankuzu_in_t01:hover {
  opacity: 0.5;
}

@media screen and (max-width: 540px) {
  .sd.pankuzu_in_t01 {
    font-size: 12px;
  }
}

.sd.pankuzu_in_t02 {
  color: #333;
  font-size: 14px;
  font-weight:500;
  height: auto;
  line-height: 1.4;
  margin: 0px 14px;
  text-align: center;
  width: auto;
  max-width: calc(100% - 28px);
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.pankuzu_in_t02 {
    font-size: 12px;
    margin: 0px 10px;
    max-width: calc(100% - 20px);
  }
}

.sd.pankuzu_in_t03 {
  color: #000000;
  font-size: 14px;
  font-weight:500;
  height: auto;
  line-height: 1;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.pankuzu_in_t03 {
    font-size: 12px;
  }
}



/* ==== low bg ==== */
:root{
  --low-hero-img: url("../img/t_view_bg02.png"); /* 上部PNG */
  --low-hero-h: clamp(220px, 40vw, 520px);
  --low-band-w: 30%;                              /* 右帯の幅=30% 固定 */
  --low-band-bg: #dce1e1;
}

/* スマホは13%に */
@media (max-width: 720px){
  .low-sec{ --low-band-w: 12%; }
}

/* セクション（透明：白は low-content から敷く） */
.low-sec{
  position: relative;
  isolation: isolate;
  width: 100%;
  background: transparent;
  overflow: visible;
}

/* 新：.low-head の“高さに追従”して画像を敷く（中身が増えた分だけ伸びる） */
.low-head{
  position: relative;             /* 既存に追加：基準化 */
  min-height: var(--low-hero-h);  /* 既存でOK：最低高さの確保 */
  display: grid;
  align-content: end;
  padding: 8% 0;
  margin: 0;
  z-index: 4;
}
.low-head::before{
  content:"";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;                   /* コンテナ幅でなく画面幅に敷く */
  height: 100%;                   /* ← ここが肝：.low-head の実高に追従 */
  background-image: var(--low-hero-img);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 68% auto;      /* 左70%を画像、右30%は帯領域 */
  z-index: 0;                     /* 画像は最背面 */
  pointer-events: none;
}


/* 右側の縦帯：セクション全高で30% */
.low-sec::after{
  content:"";
  position:absolute;
  top:0; right:0; bottom:0;
  width: var(--low-band-w);
  background: var(--low-band-bg);
  z-index: 1;            /* ← 2 から 1 に下げる */
  pointer-events: none;
}

/* 内側ラッパー */
.low-inner{
  position: relative;
  z-index: 3;            /* ← 追加（これが肝）*/
  width: 86%;
  max-width: 1200px;
  margin-inline: auto;
}

/* ヒーロー領域の高さだけ確保（画像は ::before が描画） */
.low-head{
  min-height: var(--low-hero-h);
  display: grid;
  align-content: end;
  padding:8% 0;
  margin: 0;
  box-sizing: border-box;
}

/* ここから白背景（左70%だけ白、右30%は透過で帯を見せる） */
.low-content{
  position: relative;   /* 基準にする */
  margin-top:0;
  z-index: 0;           /* ← 親としての基準（疑似要素と子のz順を制御） */
  padding: 8% 0;
    box-sizing: border-box;
}
.low-content::before{
  content:"";
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  top:0; bottom:0;
  width: 100vw;
  background:
    linear-gradient(
      to right,
      #fff 0 calc(100% - var(--low-band-w)),             /* 左70% 白 */
      rgba(255,255,255,0) calc(100% - var(--low-band-w)) 100% /* 右30% 透過 */
    );
  z-index: 2;           /* ★ 白はテキストより下にするため “1” に固定 */
}
/* ★ テキストを必ず白より上に（position必須）*/
.low-content > *{
  position: relative;
  z-index: 3;           /* ★ これで白(1)より確実に前に出る */
}

/* 必要ならネスト内もカバー（深い入れ子で隠れる場合） */
.low-content_in{
    width: 100%;
    position: relative;
    z-index: 3;
    margin: 0 auto;
}


@media (max-width: 720px){
.low-head::before{
  content:"";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;                   /* コンテナ幅でなく画面幅に敷く */
  height: 100%;                   /* ← ここが肝：.low-head の実高に追従 */
  background-image: var(--low-hero-img);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 88% auto;      /* 左70%を画像、右30%は帯領域 */
  z-index: 0;                     /* 画像は最背面 */
  pointer-events: none;
}
    .low-content_in{
        width:100%;
        position: relative;
        z-index: 3;
        margin: 0 auto;
    }
}

/* ヒーロー内の最後の要素に余白を残さない */
.low-head > *:last-child{ margin-bottom: 0; }



/* スマホ幅のときにヒーロー高さと下パディングを小さく */
@media (max-width: 720px){
  .low-head{
    padding:8% 0;                /* ?? 下パディング減らす */
  }

}



.nx-rowView{
width: 100%;
height: 200px;
overflow: hidden;
margin: 40px 0 0 0;
}

/* 枠はそのまま（高さ200px・オーバーフロー隠し） */
.nx-rowView{
  width: 100%;
  height: 200px;
  overflow: hidden;
  position: relative; /* 念のため */
}

/* リンクを枠いっぱいに */
.nx-rowView a{
  display: block;
  width: 100%;
  height: 100%;
}

/* 画像を中央にトリミング＋ズーム基点を中央に */
.nx-rowView a img{
  display: block;            /* 余白対策 */
  width: 100%;
  height: 100%;
  object-fit: cover;         /* 枠を埋めて中央トリミング */
  object-position: center;   /* 中央寄せ */
  transform-origin: 50% 50%; /* 中央を拡大の基点に */
  transform: scale(1);
  transition: transform 320ms cubic-bezier(.2,.6,.2,1);
  will-change: transform;
}

/* ホバー/フォーカスでほんの少し拡大 */
.nx-rowView a:hover img,
.nx-rowView a:focus-visible img{
  transform: scale(1.06);
}

/* タッチ端末の押下時（任意） */
@media (hover: none){
  .nx-rowView a:active img{ transform: scale(1.03); }
}





/* ===== nxh: low-head 専用（.sd/.appear系とは完全独立） ===== */
:root{ --nxh-ease: cubic-bezier(.445, .05, .55, .95); }

.nxh{
  margin: 0 0px 0 0;
  width:100%;
}

@media (max-width: 720px){
  .nxh{  width:100%; margin: 0 auto 0px auto;}
}

.nxh-wrap{ display: grid; gap: 50px; }
.nxh-block{ display: grid; gap: 0; }

/* 上段：タイトル */
.nxh-title{ position: relative; overflow: visible; }
.nxh-text{ display: inline-block; }

/* SERVICE（sec-75） */
.nxh-xl{
  color:#fff;
  font-weight:900;
  letter-spacing:.05em;
  line-height:1;
  word-break: break-all;
  font-size:104px;
  margin:0;
}
@media (max-width:540px){ .nxh-xl{ font-size:54px; } }

/* マスク帯（薄グレー/黒） */
.nxh-fill{
  position:absolute; inset:0; background:transparent; z-index:2; pointer-events:none;
  transform: translateX(0);     /* ← 初期は全面を覆う */
  will-change: transform;
}
.nxh-fill--light{ background:#EEE; }
.nxh-fill--dark { background:#000; }

/* 下段：行（sec-77/78/79/80） */
.nxh-row{ position:relative; display:flex; align-items:center; gap:10px; }
.nxh-line{ flex:none; width:20px; height:1px; background:#000; display:inline-block; }
.nxh-sub{ color:#000; font-weight:600; line-height:1.4; margin:10px 0 10px 0; font-size:20px; }
@media (max-width:540px){ .nxh-sub{ font-size:18px; } }

/* リード文（sec-81/82/83） */
.nxh-lead{ display:grid; gap:20px; margin:0 0 40px 0; }
.nxh-h3{ color:#000; font-weight:600; letter-spacing:1px; line-height:1.4; margin:0 0 20px 0; font-size:36px; }
@media (max-width:540px){ .nxh-h3{ font-size:24px; } }
.nxh-p{ width: 70%; color:#000; font-weight:400; line-height:1.8; margin:0; font-size:18px; }
@media (max-width:840px){ .nxh-p{width:100%;font-size:15px; line-height:1.8; } }

/* ============ 初期（JSが .nxh-run を付ける前） ============ */
/* タイトル文字は“常に見える”（マスクが覆っているだけ） */
.nxh.is-prep .nxh-lead{ opacity:0; transform:translateX(20px); } /* リードだけ後から */

@keyframes nxh-slide-out{ to{ transform: translateX(101%); } } /* 右へ抜ける */

/* ============ 発火後（.nxh-run） ============ */
/* マスク帯を右へ抜く（薄グレー → サブ行の黒の順にずらす） */
.nxh.nxh-run .nxh-title .nxh-fill--light{
  animation: nxh-slide-out .8s var(--nxh-ease) .15s forwards;
}
.nxh.nxh-run .nxh-row .nxh-fill--dark{
  animation: nxh-slide-out .8s var(--nxh-ease) .30s forwards;
}

/* リード文はフェード＋左へ戻る */
.nxh.nxh-run .nxh-lead{
  transition: opacity .8s var(--nxh-ease) .40s, transform .8s var(--nxh-ease) .40s;
  opacity:1; transform:translateX(0);
}

/* 左寄せを強制（親の text-align:center を潰す） */
.low-head .nxh, 
.low-head .nxh * { text-align: left !important; }

/* マスクを“文字幅だけ”にクリップさせる（残像防止） */
.nxh-title{
  position: relative;
  display: inline-block;   /* ← 行幅をテキストに合わせる */
  overflow: hidden;        /* ← ここ重要：マスクがはみ出したら切る */
}
.nxh-row{
  position: relative;
  display: inline-flex;    /* ← 行幅を中身に合わせる */
  align-items: center;
  gap: 10px;
  overflow: hidden;        /* ← 同上 */
}

/* マスク帯は文字より前面、文字は背面（覆い→右抜け） */
.nxh-text{ position: relative; z-index: 1; }
.nxh-fill{ position: absolute; inset: 0; z-index: 2; transform: translateX(0); }

/* 行の横線/配置が中央寄せに引っ張られないよう保険 */
.nxh-row{ justify-content: flex-start !important; }

/* 必要なら見出し色を明示（テーマや .sd の干渉を遮断） */
.nxh-xl{ color:#fff !important; }
.nxh-sub,.nxh-h3,.nxh-p{ color:#000 !important; }



/* ==== マスクを i 要素ではなく疑似要素で出す版（HTML変更なし） ==== */

/* 左寄せの固定（センターに引っ張られるのを防止） */
.nxh { text-align: left; }
.nxh-wrap, .nxh-title, .nxh-row, .nxh-lead { text-align: inherit; }

/* SERVICE 側：テキスト幅の箱でクリップ */
.nxh-title{
  position: relative;
  display: inline-block;     /* ← テキスト幅 */
  overflow: hidden;          /* ← ここで帯をクリップ */
}
.nxh-title::before{
  content:"";
  position:absolute; inset:0;
  background: var(--nxh-mask, #EEE);  /* HTMLの style="--nxh-mask:#EEE;" が効く */
  transform: translateX(0);
  will-change: transform;
  z-index: 2;                 /* テキストの“上”にかぶせる */
  pointer-events: none;
}

/* 事業内容 側：テキスト幅の箱でクリップ */
.nxh-row{
  display: inline-flex;       /* 行はそのまま横並びでOK */
  align-items: center;
  gap: 10px;
}
.nxh-sub{
  position: relative;
  display: inline-block;      /* ← テキスト幅 */
  overflow: hidden;           /* ← ここで帯をクリップ */
}
.nxh-sub::before{
  content:"";
  position:absolute; inset:0;
  background:#000;            /* 黒帯 */
  transform: translateX(0);
  will-change: transform;
  z-index: 2;
  pointer-events: none;
}

/* 既存の i 帯は表示を切っておく（衝突回避） */
.nxh-fill{ display:none !important; }

/* 発火後：帯を右へ抜く（テキスト幅だけ綺麗に切れて右へ） */
@keyframes nxh-slide-out { to { transform: translateX(101%); } }

.nxh.nxh-run .nxh-title::before{
  animation: nxh-slide-out .20s var(--nxh-ease, cubic-bezier(.445,.05,.55,.95)) .15s forwards;
}
.nxh.nxh-run .nxh-sub::before{
  animation: nxh-slide-out .20s var(--nxh-ease, cubic-bezier(.445,.05,.55,.95)) .30s forwards;
}

/* リード文の出現（以前のままでOK。無ければ参考） */
.nxh.is-prep .nxh-lead{ opacity:0; transform:translateX(20px); }
.nxh.nxh-run .nxh-lead{
  transition: opacity .8s var(--nxh-ease, cubic-bezier(.445,.05,.55,.95)) .40s,
              transform .8s var(--nxh-ease, cubic-bezier(.445,.05,.55,.95)) .40s;
  opacity:1; transform:translateX(0);
}

/* === SERVICE の灰帯をテキスト幅だけにする（HTMLはそのまま） === */

/* 既存の .nxh-title::before マスクは無効化（幅が広がる原因） */
.nxh-title::before{ display:none !important; }

/* テキスト要素（SERVICE）にだけマスクを付ける */
.nxh-text.nxh-xl{
  position: relative;
  display: inline-block;            /* ← テキスト幅に縮む */
  overflow: hidden;                 /* ← ここでマスクをクリップ */
}
.nxh-text.nxh-xl::after{
  content:"";
  position: absolute; inset: 0;
  background: var(--nxh-mask, #EEE);/* ← HTMLの --nxh-mask が効く */
  transform: translateX(0);
  will-change: transform;
  z-index: 2; pointer-events: none;
}

/* 発火時に右へ抜く（テキスト幅だけ綺麗にスライド） */
@keyframes nxh-slide-out { to { transform: translateX(101%); } }
.nxh.nxh-run .nxh-text.nxh-xl::after{
  animation: nxh-slide-out .50s var(--nxh-ease, cubic-bezier(.445,.05,.55,.95)) .15s forwards;
}




/* ===== reveal: なめらか版（既存の .nx-reveal/.nx-up を上書き・拡張） ===== */
:root{
  --nx-ease: cubic-bezier(.22,.61,.36,1);
  --nx-reveal-d: .7s;         /* 文字用のデフォ時間 */
  --nx-reveal-ty: 12px;       /* 初期の持ち上げ量 */
}

/* 基本：少し下からふわっと */
.nx-reveal{
  opacity: 0;
  transform: translateY(var(--nx-reveal-ty));
  transition: opacity var(--nx-reveal-d) var(--nx-ease),
              transform var(--nx-reveal-d) var(--nx-ease);
  will-change: opacity, transform;
}
.nx-reveal.is-in{
  opacity: 1;
  transform: none;
}

/* “より柔らかく”したい要素に .nx-soft を追加（時間を少し長く） */
.nx-reveal.nx-soft{
  --nx-reveal-d: .9s;
  --nx-reveal-ty: 14px;
}

/* 画像用：にゅわっと出す（拡大1.02→1.0 & うすぼかし→クリア） */
.nx-imgWrap{
  overflow: hidden;            /* はみ出し隠し */
}
.nx-imgWrap img{
  display:block; width:100%; height:auto;
  transform: scale(1.02);
  filter: blur(6px);
  opacity: .01;                /* “急に出た”印象を防ぐ微透明 */
  transition:
    transform 1.0s var(--nx-ease) .06s,
    filter   1.0s var(--nx-ease) .06s,
    opacity   .9s var(--nx-ease) .06s;
  will-change: transform, filter, opacity;
  backface-visibility: hidden;
}
.nx-imgWrap.is-in img{
  transform: scale(1);
  filter: blur(0);
  opacity: 1;
}

/* 連番で段差を付けたいときは data-nx-delay で個別遅延（JSが読む） */
@media (prefers-reduced-motion: reduce){
  .nx-reveal,
  .nx-imgWrap img{
    transition: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
}




/****caseコンテンツ*****/ 

.sd.case_nav{
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  width: 100%;
}

.sd.case_nav.appear {
  opacity: 0;
  transition-delay: 300ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.case_nav.appear-active {
  transition-delay: 300ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 720px) {
  .sd.case_nav {
    position: absolute;
    flex: none;
    overflow-x:scroll;
  width: 100dvw;           /* 100vw より実機で安定（iOSのアドレスバー対策） */
  max-width: none;         /* 共通の max-width:100% を無効化 */
  margin-left:  calc(50% - 50dvw);
  margin-right: calc(50% - 50dvw);
  padding: 0 7% 0 7%;
  }
}

.sd.case_nav_list{
  background: #fff;
  border-radius: 40px;
  color: #000;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 15px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.1em;
  line-height: 1.2;
  margin: 0px 14px 0px 0px;
  padding: 6px 20px;
  text-align: center;
  width: auto;
  max-width: calc(100% - 14px);
  justify-content: center;
}

.sd.case_nav_list:hover {
  background: #000000;
  color: #FFFFFF;
}

@media screen and (max-width: 840px) {
  .sd.case_nav_list{
    margin: 0px 14px 0px 50px;
    max-width: calc(100% - 64px);
  }
}

@media screen and (max-width: 540px) {
  .sd.case_nav_list{
    font-size: 13px;
    margin: 0px 6px 0px 30px;
    padding: 6px 14px;
    max-width: calc(100% - 36px);
  }
}

/* レイアウトを安定させる（横並び＋隙間） */
.sd.case_nav{
  display: flex;             /* 既存で flex 指定されていない場合の保険 */
  gap:0px;                 /* 右側の余白が margin と二重になるなら調整を */
  flex-wrap: nowrap;
}

/* ベース：親（<p>）は“枠のみ”を持つ。色やホバーは中身（<a> or <span>）で表現 */
.sd.case_nav_list{
  padding: 0;                /* 既存の padding を子要素へ移譲 */
  background: transparent;   /* 背景は子へ移譲 */
  border-radius: 40px;       /* 角丸は親でもOK（子にも指定して二重保険） */
}

/* 非アクティブ＝リンクあり（<a> をボタン化） */
.sd.case_nav_list > a{
  display: inline-block;
  padding: 6px 20px;
  border-radius: 40px;
  background: #fff;
  color: #000;
  text-decoration: none;
  font: inherit;             /* 既存フォント継承（var(--s-font-xxx)を使ってる前提） */
  line-height: 1.2;
  letter-spacing: 0.1em;
  font-weight: 700;
}

/* ホバーで反転 */
.sd.case_nav_list > a:hover,
.sd.case_nav_list > a:focus-visible{
  background: #000;
  color: #fff;
  outline: none;
}

/* アクティブ＝リンク無し（<a>を置かずに <p> に .is-active） */
.sd.case_nav_list.is-active{
  background: #000;
  color: #fff;
  padding: 6px 20px;         /* ここで見た目の内側余白を持たせる */
  cursor: default;
}

/* モバイルの余白調整（既存メディアクエリ後に置くと優先されます） */
@media (max-width: 840px){
  .sd.case_nav{
    overflow-x: auto; overflow-y: hidden;
  }
  .sd.case_nav_list{ margin: 0 14px 0 0px; }
  .sd.case_nav_list.is-active{ /* 必要なら個別調整 */ }
}
@media (max-width: 540px){
  .sd.case_nav_list > a{ padding: 6px 14px; font-size: 13px; }
  .sd.case_nav_list{ margin: 0 6px 0 0px; }
  .sd.case_nav_list.is-active{ padding: 6px 14px; font-size: 13px; }
}






/* ====== Cards Grid (no conflict) ====== */
.nxg{
position: relative;
z-index: 5;
width:100%;
margin:0px 0 40px 0;
}
@media (max-width: 840px){
.nxg{margin:0px 0 0px 0;padding: 40px 0 40px 0;}
}
.nxg-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:30px;
}
@media (max-width: 840px){
  .nxg-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 540px){
  .nxg-grid{ grid-template-columns: 1fr; }
}

/* カード本体 */
.nxg-card{
  display:flex; flex-direction:column;
  text-decoration:none; color:inherit; background:transparent;
}

/* 画像エリア：中央トリミング & ホバー拡大 */
.nxg-media{
  position:relative; overflow:hidden; aspect-ratio: 5/3; /* 例: 5:3 */
}
.nxg-media img{
  width:100%; height:100%; object-fit:cover; object-position:center;
  display:block; transform: scale(1); transition: transform .5s ease;
}

/* ホバー時のラベル＆乗算マスク */
.nxg-hoverLabel{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:18px; font-weight:600;
  opacity:0; transform: translateY(20px);
  transition: opacity .35s ease, transform .35s ease; z-index:2; pointer-events:none;
}
.nxg-hoverMask{
  position:absolute; inset:0; background:#aeaeae;
  mix-blend-mode:multiply; opacity:0; transition: opacity .35s ease; z-index:1;
}
/* ホバー効果 */
.nxg-card:hover .nxg-hoverLabel{ opacity:1; transform: translateY(0); }
.nxg-card:hover .nxg-hoverMask{ opacity:1; }
.nxg-card:hover .nxg-media img{ transform: scale(1.06); }

/* 本文 */
.nxg-body{ display:block; margin-top:20px; }

/* 上部カテゴリの小ラベル（ダーク） */
.nxg-cats{ display:flex; flex-wrap:wrap; gap:4px; margin:0 0 8px 0; }
.nxg-cat{
  background:#575757; color:#fff; font-size:13px; font-weight:600; line-height:1.2;
  padding:4px 8px; border-radius:4px; display:inline-block;
}
.nxg-body-s-in{
 display:flex; flex-wrap:wrap;gap:8px; margin:0 0 0px 0;
}
.nxg-body-s-in span{font-size: 1xpx;line-height:1.4;color:#999;display:inline-block;font-weight:600;}

/* タイトル（左線あり） */
.nxg-title{
  margin:0 0 12px 0; padding-left:10px; border-left:1px solid #aaa;
  color:#333; font-size:14px; font-weight:600; line-height:1.4;
}

/* 説明文 */
.nxg-desc{
  margin:0; color:#242424; font-size:16px; font-weight:600; line-height:1.4;
}
@media (max-width:540px){
  .nxg-desc{ font-size:14px; }
}

/* 下部の白チップ */
.nxg-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.nxg-tag{
  background:#fff; color:#333; font-size:14px; font-weight:600; line-height:1;
  padding:4px 10px; border-radius:32px; display:inline-block;
}
.nxg-card:hover .nxg-tag{ background:#c1cccb; }

/* 余白・整列の微調整はお好みで */






/* ====== TOP-CASE: 2カラム + 右側にパネル & カウントアップ ====== */
.nxc{
  width: 1200px;
  max-width: calc(100% - 160px);
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr minmax(280px, 520px);
  gap: clamp(24px, 4vw, 56px);
  margin: 0 0 0px 0;     /* ← auto を外して完全に左寄せ */
}


/* sec-169 の外側余白を、このブロック内だけオフにして横幅100%に */
.nxc .sd.sec-169,
.nxc .sd.sec-169[style]{
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.nxc-left{ min-width: 0; } /* 文字側のはみ出し防止 */

.nxc-right{
align-self: start; }
.nxc-fig{
  position: relative;
  width:100%;
  overflow: hidden;
  margin: 0 0 0px 0;
}
.nxc-fig img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position:right;
  display: block;
}
.nxc-ovl{
  position: absolute; inset: 0;
  pointer-events: none;
}

/* カウンタカード */
.nxc-stat{
  position: absolute;
}
.nxc-number{
  font-size: clamp(34px, 4vw, 48px);
  line-height: 1;
  font-weight: 800;
  letter-spacing: .02em;
  color: #111;
text-align: center;
}
.nxc-number::after{
  content: attr(data-suffix);
  font-size: .55em;      /* 数字の 55% に */
  line-height: 1;
  margin-left: .1em;     /* 数字との間隔 */
  display: inline-block; 
  transform: translateY(-0.05em); /* ほんの少しだけ上げる（任意） */
  /* optional: font-weight: 600; letter-spacing: .02em; */
}
.nxc-label{
  margin-top: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #444;
  text-align: center;
}

/* 配置（好みで微調整） */
.pos-tl{ top: 6%; left: 6%; }
.pos-cc{ top: 50%; left: 10%; transform: translateY(-50%); }
.pos-bl{ bottom: 19%; right: 14%; }

/* レスポンシブ：縦積み */
@media screen and (max-width: 840px) {
  .nxc{
    grid-template-columns: 1fr;
    gap: 28px;
    margin: 0px 50px 0px 50px;
    width: calc(100% - 100px);
    max-width: calc(100% - 100px);
  }
  .nxc-right{ order: -1; }      /* 画像を上に */
  .nxc{ gap: 28px; }
}

@media screen and (max-width: 540px) {
  .nxc{
    grid-template-columns: 1fr;
    gap: 28px;
    margin: 0px 30px 30px 30px;
    width: calc(100% - 60px);
    max-width: calc(100% - 60px);
  }
  .nxc-right{ order: -1; }      /* 画像を上に */
  .nxc{ gap: 28px; }
}


/* PCだけ上につめる */
.nxc-right{ margin-top: -60px; }


/* スマホ：タイトルを先に、右カラムは後に */
@media screen and (max-width: 840px) {
  .nxc {
    grid-template-columns: 1fr;
    gap: 28px;
    margin: 0 0px;
    width:100%;
  }
  .nxc-left { order: 0; }   /* ← 左（タイトル）を先頭 */
  .nxc-right { order: 1; }  /* ← 右（画像＋カウント）を後ろに */
}

/* さらに、モバイルではネガティブマージンを無効化して“上がり”を防止 */
@media (max-width: 920px) {
  .nxc-right { margin-top: 0; }
}




/*ツーカラムレイアウト*/
.low_nav {
  align-content: flex-start;
  align-items: flex-start;
  bottom: auto;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  left: 40px;
  margin: 0 0 0 0;
  position: fixed;
  right: auto;
  top: 190px;
  width: auto;
  max-width: 100%;
  z-index: 1;
}

@media screen and (max-width: 840px) {
  .low_nav {
    display: none;
  }
}

@media screen and (max-width: 540px) {
  .low_nav {
    display: none;
  }
}

.low_nav_title{
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 5px 0px;
  width: auto;
  max-width: 100%;
}

.low_nav_title_line{
  background: #242424;
  flex: none;
  height: 1px;
  margin: 0px 10px 0px 0px;
  width: 20px;
  max-width: calc(100% - 10px);
}

.low_nav_title_text{
  color: #333;
  font-size: 20px;
  font-weight:600;
  height: auto;
  letter-spacing: 0.05em;
  line-height: 1.4;
  padding: 0px 0px 0px 0px;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .low_nav_title_text{
    font-size: 16px;
  }
}

.low_nav_title_list{
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #aaaaaa;
  border-left: 0px solid #aaaaaa;
  border-right: 0px solid #aaaaaa;
  border-top: 0px solid #aaaaaa;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 10px 0px 10px 0px;
  width: 150px;
  max-width: 100%;
}

.low_nav_title_list:hover {
  opacity: 0.5;
}

.low_nav_title_list p{
  border-bottom: 0px solid #e1e1e1;
  border-left: 0px solid #e1e1e1;
  border-right: 0px solid #e1e1e1;
  border-top: 0px solid #e1e1e1;
  color: #333;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 15px;
  font-weight:500;
  height: auto;
  line-height: 1.4;
  padding: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}


@media screen and (max-width: 1140px) {
  .low_nav_title_list{
    display: flex;
  }
}

@media screen and (max-width: 840px) {
  .low_nav_title_list{
    display: flex;
  }
}

@media screen and (max-width: 540px) {
  .low_nav_title_list{
    display: flex;
  }
}



.low_contents_two{
  box-sizing: border-box;
  width: calc(100% - 190px);
  margin-left:190px;          /* ← 合計で 100% になる組み合わせ */
  padding: 0;
}


@media screen and (max-width: 840px){
.low_contents_two{
    width: 100%;
    margin-left: 0;
  }
}

@media screen and (max-width: 540px) {
  .low_contents_two{
    width: 100%;
    margin-left: 0;
  }
}



/*アバウトページ*/


/**spナビ**/
.low_nav_sp{
display: none;
}

@media screen and (max-width: 840px) {
.low_nav_sp{
display: flex;
justify-content: space-between;
flex-wrap:wrap!important;
width: 100%;
max-width: 100%;
margin: 30px 0 30px 0;
}
}

@media screen and (max-width: 540px) {
.low_nav_sp{
display: flex;
justify-content: space-between;
flex-wrap:wrap!important;
width: 100%;
margin: 30px 0 30px 0;
}
}


@media screen and (max-width: 840px) {
.low_nav_sp a{
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap:nowrap;
  height: auto;
  justify-content: space-between;
  padding: 15px 0px 8px 0px;
  width: 30%;
}
}

@media screen and (max-width: 540px) {
.low_nav_sp a{
  width: 48%;
}
}

.low_nav_sp a:hover {
  opacity: 0.5!important;
}

.sd.sec-a61 {
  color: #333;
  font-size: 16px;
  font-weight:600;
  height: auto;
  line-height: 1;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-a61 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-a62 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-a62 {
    font-size: 16px;
  }
}



/****/


.sd.sec-a69 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 100px 0px 0px 0px;
  box-sizing: border-box;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-a69 {
    padding: 80px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a69 {
    padding: 50px 0px 0px 0px;
  }
}

.sd.sec-a70 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 0px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 80px 0px;
  width: 100%;
}

.sd.low_sub_title{
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000000;
  border-left: 1px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 40px 0px;
  padding: 0px 0px 0px 24px;
  width: auto;
  max-width: 100%;
}

.sd.low_sub_title.appear {
  opacity: 0;
  transform: translate(10px, 0px);
  transition-delay: 300ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.low_sub_title.appear-active {
  transition-delay: 300ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.low_sub_title{
    margin: 0px 0px 30px 0px;
    max-width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.low_sub_title{
    padding: 0px 0px 0px 20px;
  }
}

.sd.low_sub_title_top{
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width: auto;
  max-width: 100%;
}

.sd.low_sub_title_no{
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 900;
  height: auto;
  letter-spacing: normal;
  line-height: 0.8;
  margin: 0px 0px 0px 0px;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.low_sub_title_no{
    font-size: 16px;
  }
}

.sd.low_sub_title_bo{
  background: #c1cccb;
  flex: none;
  height: 1px;
  margin: 0px 5px 0px;
  width: 14px;
  max-width: calc(100% - 10px);
}

@media screen and (max-width: 540px) {
  .sd.low_sub_title_bo{
    flex: none;
    margin: 0px 3px 0px;
    width: 10px;
    max-width: calc(100% - 6px);
  }
}

.sd.low_sub_title_text{
  border-bottom: 0px solid #aaaaaa;
  border-left: 0px solid #aaaaaa;
  border-right: 0px solid #aaaaaa;
  border-top: 0px solid #aaaaaa;
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 15px;
  font-weight: 700;
  height: auto;
  letter-spacing: normal;
  line-height: 1.2;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.low_sub_title_text{
    font-size: 14px;
  }
}

.sd.low_sub_title_en{
  color: #242424;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 32px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.05em;
  line-height: 1;
  margin: 8px 0px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.low_sub_title_en{
    font-size: 28px;
  }
}

@media screen and (max-width: 540px) {
  .sd.low_sub_title_en{
    font-size: 24px;
  }
}


.sd.sec-a77 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 40px;
  font-weight: 700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

.sd.sec-a77.appear {
  opacity: 0;
  transform: translate(10px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a77.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.sec-a77 {
    font-size: 32px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a77 {
    font-size: 22px;
    line-height: 1.6;
  }
}

.sd.sec-a78 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 0px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width:100%;
  max-width: 100%;
  margin: 0;
}


.sd.sec-a85 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 40px;
  font-weight: 700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

.sd.sec-a85.appear {
  opacity: 0;
  transform: translate(10px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a85.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.sec-a85 {
    font-size: 32px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a85 {
    font-size: 22px;
    line-height: 1.6;
  }
}

.sd.sec-a86 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 0px 0px 0px;
  box-sizing: border-box;
}

@media screen and (max-width: 840px) {
  .sd.sec-a86 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a86 {
    padding: 80px 0px 0px 0px;
  }
}

.sd.sec-a87 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-a87 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a87 {
    padding: 80px 0px 0px 0px;
  }
}

.sd.sec-a94 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  height: auto;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-a94 {
    align-content: center;
    align-items: center;
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    justify-content: flex-end;
  }
}

.sd.sec-a95 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: 1;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 0px 60px 0px 0px;
  width: auto;
  max-width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-a95 {
    padding: 0px 40px 0px 0px;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-a95 {
    padding: 0px 0px 0px 0px;
  }
}

.sd.sec-a96 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 32px;
  font-weight: 700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 20px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

.sd.sec-a96.appear {
  opacity: 0;
  transform: translate(10px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a96.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.sec-a96 {
    font-size: 24px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a96 {
    font-size: 22px;
    line-height: 1.6;
  }
}

.sd.sec-a97 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 500;
  height: auto;
  line-height: 1.8;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

.sd.sec-a97.appear {
  opacity: 0;
  transform: translate(10px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a97.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 540px) {
  .sd.sec-a97 {
    font-size: 15px;
  }
}

.sd.sec-a98 {
  align-content: flex-end;
  align-items: flex-end;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 8px 0px 0px 0px;
  width: 40%;
  max-width: 40%;
}

.sd.sec-a98.appear {
  opacity: 0;
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a98.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 1140px) {
  .sd.sec-a98 {
    flex: none;
    width: 35%;
    max-width: 35%;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-a98 {
    margin: 0px 0px 40px 0px;
    width: 35%;
    max-width: 35%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a98 {
    align-content: flex-start;
    align-items: flex-start;
    flex: none;
    justify-content: flex-start;
    width: 70%;
    max-width: 70%;
  }
}

.sd.sec-a99 {
  flex: none;
  height: auto;
  margin: 0px 0px 14px 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-a100 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 14px;
  font-weight: 500;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

.sd.sec-a101 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 24px;
  font-weight: 600;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

.sd.sec-a102 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 14px;
  font-weight: 500;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

.sd.sec-a103 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 0px 140px 0px;
  width: 100%;
  box-sizing: border-box;
}

@media screen and (max-width: 840px) {
  .sd.sec-a103 {
    padding: 100px 0px 100px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a103 {
    padding: 80px 0px 80px 0px;
  }
}

.sd.sec-a104 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
  box-sizing: border-box;
}

@media screen and (max-width: 840px) {
  .sd.sec-a104 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a104 {
    padding: 80px 0px 0px 0px;
  }
}

.sd.sec-a111 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-radius: 0;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-a111 {
    flex: none;
    padding: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a111 {
    flex: none;
    padding: 0px 0px 0px 0px;
    width: 100%;
  }
}

.sd.sec-a112 {
  flex: none;
  padding: 0px;
  width: 100%;
}

.sd.sec-a112.appear {
  opacity: 0;
  transform: translate(0px, 20px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a112.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a113 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  padding: 0px 0px 14px 0px;
  width: 100%;
}

.sd.sec-a114 {
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  color: #333333;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 500;
  height: auto;
  letter-spacing: 0em;
  line-height: 1.4;
  margin: 0px 0px 0px 0px;
  padding: 14px 0px 0px 0px;
  text-align: left;
  width: 20%;
  max-width: 20%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-a114 {
    flex: none;
    width: 20%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a114 {
    flex: none;
    font-size: 14px;
    width: 22%;
    max-width: 22%;
  }
}

.sd.sec-a115 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #c1cccb;
  border-left: 0px solid #c1cccb;
  border-right: 0px solid #c1cccb;
  border-top: 1px solid #c1cccb;
  flex: 1;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 40px;
  padding: 14px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-a115 {
    margin: 0px 0px 0px 20px;
    max-width: calc(100% - 20px);
  }
}

.sd.sec-a116 {
  color: #333;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 500;
  height: auto;
  letter-spacing: 0em;
  line-height: 1.4;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-a116 {
    flex: none;
    width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-a116 {
    flex: none;
    font-size: 14px;
    width: 100%;

  }
}

.sd.sec-a117 {
  flex: none;
  height: 400px;
  margin: 40px 0px 20px 0px;
  width: 100%;
}

.sd.sec-a117.appear {
  opacity: 0;
  transform: translate(0px, 20px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a117.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-a118 {
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 500;
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}




/**service_in**/

.sd.sec-si56 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 80px 0px 0px 0px;
  box-sizing: border-box;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si56 {
    padding: 80px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si56 {
    padding: 50px 0px 0px 0px;
  }
}

.sd.sec-si57 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 60px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si57 {
    flex: none;
  }
}

.sd.sec-si58 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width: auto;
  max-width: 100%;
}

.sd.sec-si59 {
  color: #FFFFFF;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 100px;
  font-weight: 600;
  height: auto;
  letter-spacing: 0.05em;
  line-height: 1;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si59 {
    font-size: 54px;
  }
}

.sd.sec-si60 {
  color: #FFFFFF;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 100px;
  font-weight: 600;
  height: auto;
  letter-spacing: 0.05em;
  line-height: 1;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si60 {
    font-size: 54px;
    letter-spacing: -0.05em;
  }
}

.sd.sec-si61 {
  background: #EEEEEE;
  flex: none;
  height: 100%;
  left: 0;
  margin: 0 0 0 0;
  position: absolute;
  top: 0;
  transform: scale(0, 1);
  transform-origin: center right;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si61.appear {
  transform: scale(1, 1);
  transition-delay: 300ms;
  transition-duration: 600ms;
}

.sd.sec-si61.appear-active {
  transition-delay: 300ms;
  transition-duration: 600ms;
}

.sd.sec-si62 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  width: auto;
  max-width: 100%;
}

.sd.sec-si63 {
  background: #000000;
  flex: none;
  height: 1px;
  margin: 0px 10px 0px 0px;
  width: 20px;
  max-width: calc(100% - 10px);
}

.sd.sec-si64 {
  color: #000000;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 20px;
  font-weight: 600;
  height: auto;
  line-height: 1.4;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si64 {
    font-size: 18px;
  }
}

.sd.sec-si65 {
  background: #000000;
  bottom: 0px;
  flex: none;
  height: 100%;
  left: 0px;
  margin: 0 0 0 0;
  position: absolute;
  right: 0px;
  top: 0px;
  transform: scale(0, 1);
  transform-origin: center right;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si65.appear {
  transform: scale(1, 1);
  transition-delay: 300ms;
  transition-duration: 600ms;
}

.sd.sec-si65.appear-active {
  transition-delay: 300ms;
  transition-duration: 600ms;
}

.sd.sec-si66 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0px;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si66 {
    flex: none;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si66 {
    align-content: flex-start;
    align-items: flex-start;
    flex: none;
    justify-content: flex-start;
    margin: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si67 {
  color: #000000;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 36px;
  font-weight: 700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 20px 0px;
  text-align: left;
  width: calc(100% - (var(--gap-h-145be2df-f4a0-4214-b941-5cde87f23ca4) * 0));
  max-width: calc(100% - (var(--gap-h-145be2df-f4a0-4214-b941-5cde87f23ca4) * 0));
  justify-content: flex-start;
}

.sd.sec-si67.appear {
  opacity: 0;
  transform: translate(20px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si67.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.sec-si67 {
    flex: none;
    width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si67 {
    font-size: 24px;
  }
}

.sd.sec-si68 {
  color: #000000;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 400;
  height: auto;
  line-height: 1.8;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width:100%;
  justify-content: flex-start;
}

.sd.sec-si68.appear {
  opacity: 0;
  transform: translate(20px, 0px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si68.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 540px) {
  .sd.sec-si68 {
    font-size: 15px;
    line-height: 1.8;
  }
}

.sd.sec-si69 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  display: none;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px 30px;
  height: auto;
  justify-content: flex-start;
  margin: 20px 0px 0px 0px;
  width: 100%;
  --gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe: 30px;
  --gap-v-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
  --gap-uuid: 457b3e69-ca34-4706-8dd2-99ef46646cbe;
  max-width: 100%;
}

.sd.sec-si69.appear {
  --gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe: 30px;
  --gap-v-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
}

.sd.sec-si69.appear-active {}

@media screen and (max-width: 1140px) {
  .sd.sec-si69 {
    display: none;
    --gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe: 30px;
    --gap-v-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si69.appear {
    opacity: 0;
    transition-delay: 300ms;
    transition-duration: 800ms;
    transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
  }

  .sd.sec-si69.appear-active {
    transition-delay: 300ms;
    transition-duration: 800ms;
    transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
  }

  .sd.sec-si69 {
    display: flex;
    margin: 60px 0px 0px 0px;
    --gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe: 30px;
    --gap-v-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si69 {
    display: flex;
    gap: 20px 20px;
    margin: 40px 0px 0px 0px;
    --gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
    --gap-v-457b3e69-ca34-4706-8dd2-99ef46646cbe: 20px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si70 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si70:hover {
  opacity: 0.5;
}

@media screen and (max-width: 540px) {
  .sd.sec-si70 {
    flex: none;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si71 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si71 {
    flex: 1;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si71 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si72 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si72 {
    font-size: 16px;
  }
}

.sd.sec-si73 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si73:hover {
  opacity: 0.5;
}

@media screen and (max-width: 540px) {
  .sd.sec-si73 {
    flex: none;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si74 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si74 {
    flex: 1;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si74 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si75 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si75 {
    font-size: 16px;
  }
}

.sd.sec-si76 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si76:hover {
  opacity: 0.5;
}

@media screen and (max-width: 540px) {
  .sd.sec-si76 {
    flex: none;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si77 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si77 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si78 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si78 {
    font-size: 16px;
  }
}

.sd.sec-si79 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si79:hover {
  opacity: 0.5;
}

@media screen and (max-width: 840px) {
  .sd.sec-si79 {
    margin: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si79 {
    flex: none;
    margin: 0px 0px 0px 0px;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si80 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si80 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si81 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si81 {
    font-size: 16px;
  }
}

.sd.sec-si82 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si82:hover {
  opacity: 0.5;
}

@media screen and (max-width: 840px) {
  .sd.sec-si82 {
    margin: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si82 {
    flex: none;
    margin: 0px 0px 0px 0px;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si83 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si83 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si84 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si84 {
    font-size: 16px;
  }
}

.sd.sec-si85 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #000000;
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
  border-top: 0px solid #000000;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: space-between;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 8px 0px;
  width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.667));
}

.sd.sec-si85:hover {
  opacity: 0.5;
}

@media screen and (max-width: 840px) {
  .sd.sec-si85 {
    margin: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si85 {
    flex: none;
    margin: 0px 0px 0px 0px;
    width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
    max-width: calc(50% - (var(--gap-h-457b3e69-ca34-4706-8dd2-99ef46646cbe) * 0.5));
  }
}

.sd.sec-si86 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  padding: 0px 10px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si86 {
    font-size: 13px;
    text-align: left;
    justify-content: flex-start;
  }
}

.sd.sec-si87 {
  color: #333;
  font-size: 20px;
}

@media screen and (max-width: 540px) {
  .sd.sec-si87 {
    font-size: 16px;
  }
}

.sd.sec-si88 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 100px 0px 0px 0px;
  width:100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si88 {
    padding: 80px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si88 {
    padding: 80px 0px 0px 0px;
  }
}

.sd.sec-si89 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si89 {
    padding: 0px;
  }
}

.sd.sec-si96{
  margin: 0px 0 30px 0;
}
.sd.sec-si97 {
  flex: none;
  padding: 0px;
  width: 100%;
  max-width: 100%;

}

.sd.sec-si97.appear {
  opacity: 0;
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si97.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si98 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 10px 0px;
  padding: 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si99 {
  background: #c1cccb;
  border-radius: 50%;
  flex: none;
  height: 12px;
  margin: 7px 6px 0px 0px;
  width: 12px;
  max-width: calc(100% - 6px);
}

@media screen and (max-width: 540px) {
  .sd.sec-si99 {
    margin: 5px 6px 0px 0px;
    max-width: calc(100% - 6px);
  }
}

.sd.sec-si100 {
  color: #333;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight:700;
  height: auto;
  line-height: 1.4;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si100 {
    font-size: 15px;
  }
}



.sd.sec-si109 {
  align-content: flex-start;
  align-items: flex-start;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0px;
  justify-content: flex-start;
  opacity: 1;
  padding: 0px;
  width: 100%;
  margin: 0;
}



.sd.sec-si110 {
  align-content: center;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0px;
  margin: 0;
}

.sd.sec-si111 {
  background: #FFFFFF;
  border-radius: 24px;
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight:700;
  height: auto;
  line-height: 1.4;
  margin: 0px 10px 10px 0px;
  padding: 4px 14px;
  text-align: left;
  width: auto;
  max-width: calc(100% - 10px);
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si111 {
    font-size: 14px;
  }
}

.sd.sec-si112 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 0px 0px 0px;
}

@media screen and (max-width: 840px) {
  .sd.sec-si112 {
    padding: 80px 0px 0px 5px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si112 {
    padding: 50px 0px 0px 0px;
  }
}

.sd.sec-si113 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: wrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si113 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si113 {
    padding: 80px 0px 0px 0px;
  }
}



.sd.sec-si120 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 60px 40px;
  height: auto;
  justify-content: space-between;
  width: 100%;
  --gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 40px;
  --gap-v-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 60px;
  --gap-uuid: 3e68a02c-3c8e-4f53-b96f-65acb2c68d87;
  max-width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si120 {
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    --gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 40px;
    --gap-v-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 60px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si120 {
    gap: 40px 0px;
    --gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 0px;
    --gap-v-3e68a02c-3c8e-4f53-b96f-65acb2c68d87: 40px;
  }
}

.sd.sec-si121 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 0px 0px 0px 0px;
  width: calc(50% - (var(--gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87) * 0.5));
  max-width: calc(50% - (var(--gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87) * 0.5));
}

.sd.sec-si121.appear {
  opacity: 0;
  transform: translate(0px, 20px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si121.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 840px) {
  .sd.sec-si121 {
    padding: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si121 {
    flex: none;
    width: calc(100% - (var(--gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87) * 0));
    max-width: calc(100% - (var(--gap-h-3e68a02c-3c8e-4f53-b96f-65acb2c68d87) * 0));
  }
}

.sd.sec-si122 {
  align-content: center;
  align-items: center;
  background: #fff;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 280px;
  justify-content: center;
  margin: 0px 0px 20px 0px;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si122 {
    flex: none;
    height: 240px;
    width: 100%;
    max-width: 100%;
  }
}

.s_i_view01{background-image:url(../img/solar-01.jpg);}
.s_i_view02{background-image:url(../img/solar-02.jpg);}
.s_i_view03{background-image:url(../img/solar-03.jpg);}
.s_i_view04{background-image:url(../img/solar-04.jpg);}


.s_i_view05{background-image:url(../img/civil-01.jpg);}
.s_i_view06{background-image:url(../img/civil-02.jpg);}
.s_i_view07{background-image:url(../img/civil-03.jpg);}
.s_i_view08{background-image:url(../img/civil-04.jpg);}
.s_i_view09{background-image:url(../img/civil-05.jpg);}
.s_i_view10{background-image:url(../img/civil-06.jpg);}

.s_i_view11{background-image:url(../img/blacksmith-01.jpg);}
.s_i_view12{background-image:url(../img/blacksmith-02.jpg);}
.s_i_view13{background-image:url(../img/plumber-01.jpg);}
.s_i_view14{background-image:url(../img/plumber-02.jpg);}



.sd.sec-si123 {
  align-content: flex-start;
  align-items: flex-start;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 100%;
  justify-content: flex-start;
  width: 100%;
  max-width: 100%;
    background-repeat: no-repeat;
  background-size: cover;
}

.sd.sec-si124 {
  align-content: center;
  align-items: center;
  background: #EEEEEE;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 60px;
  justify-content: center;
  width: 60px;
  max-width: 100%;
}

.sd.sec-si125 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 24px;
  font-weight: 500;
  height: auto;
  line-height: 1.4;
  margin: 0px 4px 0px 0px;
  text-align: center;
  width: auto;
  max-width: calc(100% - 4px);
  justify-content: center;
}

.sd.sec-si126 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 24px;
  font-weight:700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 14px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si126 {
    font-size: 24px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si126 {
    font-size: 20px;
    line-height: 1.6;
  }
}

.sd.sec-si127 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1.8;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si127 {
    font-size: 15px;
  }
}



.sd.sec-si149 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 80px 0px 0px;
}

@media screen and (max-width: 840px) {
  .sd.sec-si149 {
    padding: 80px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si149 {
    padding: 50px 0px 0px 0px;
  }
}

.sd.sec-si150 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si150 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si150 {
    padding: 80px 0px 0px 0px;
  }
}


.sd.sec-si157 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si157.appear {
  opacity: 0;
  transform: translate(0px, 20px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si157.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

@media screen and (max-width: 540px) {
  .sd.sec-si157 {
    margin: 0px 0px 0px 0px;
    overflow-x: hidden;
    overflow-y: hidden;
  }
}

.sd.sec-si158 {
  align-content: flex-start;
  align-items: flex-start;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 30px;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  overflow-x: hidden;
  overflow-y: hidden;
  padding: 0px 0px 0px 0px;
  width: 100%;
  --gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 30px;
  --gap-v-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 0px;
  --gap-uuid: 121f22cf-d756-4594-aeae-4c9e6d9b8f32;
  max-width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si158 {
    flex-direction: column;
    flex-wrap: nowrap;
    margin: 0px 0px 40px 0px;
    --gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 0px;
    --gap-v-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 30px;
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si158 {
    flex-direction: column;
    flex-wrap: nowrap;
    margin: 0px 0px 40px 0px;
    --gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 0px;
    --gap-v-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 30px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si158 {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 40px;
    margin: 0px 0px 0px 0px;
    overflow-x: auto;
    overflow-y: hidden;
    transform: ;
    --gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 0px;
    --gap-v-121f22cf-d756-4594-aeae-4c9e6d9b8f32: 40px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si445 {
  background: rgba(0, 0, 0, 0.0);
  border-radius: 0;
  box-shadow: none;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 0px 0px 40px;
  padding: 0px 0px 0px 0px;
  width: calc(33.3% - (var(--gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32) * 0.667));
  max-width: calc(33.3% - (var(--gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32) * 0.667));
}

.sd.sec-si445:hover {
  opacity: 1;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si445 {
    margin: 0px 0px 0px;
    width: calc(100% - (var(--gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32) * 0));
    max-width: calc(100% - (var(--gap-h-121f22cf-d756-4594-aeae-4c9e6d9b8f32) * 0));
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si445 {
    flex: none;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0px 0px 0px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si445 {
    flex: none;
    margin: 0px 0px 0px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
  }
}

.sd.sec-si446 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-radius: 0;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 200px;
  justify-content: flex-start;
  overflow-x: hidden;
  overflow-y: hidden;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si446 {
    flex: none;
    height: 180px;
    width: 40%;
    max-width: 40%;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si446 {
    flex: none;
    width: 40%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si446 {
    flex: none;
    height: 200px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si447 {
  bottom: 0px;
  color: #FFFFFF;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 500;
  height: 100%;
  left: 0px;
  line-height: 1.4;
  margin: 0 0 0 0;
  opacity: 0;
  position: absolute;
  right: 0px;
  text-align: center;
  top: 20px;
  width: 100%;
  z-index: 3;
  max-width: 100%;
  justify-content: center;
}

.sd.sec-si445:hover .sd.sec-si447 {
  opacity: 1;
  transform: translate(0px, -20px);
}

.sd.sec-si448 {
  align-content: center;
  align-items: center;
  background: #aeaeae;
  border-radius: 0;
  bottom: 0px;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 100%;
  justify-content: center;
  left: 0px;
  margin: 0 0 0 0;
  mix-blend-mode: multiply;
  opacity: 0;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si445:hover .sd.sec-si448 {
  opacity: 1;
  z-index: 2;
}

.sd.sec-si449 {
  border-radius: 0;
  flex: none;
  height: 100%;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si445:hover .sd.sec-si449 {
  transform: scale(1.1, 1.1);
}

@media screen and (max-width: 840px) {
  .sd.sec-si449 {
    flex: none;
    width: 100%;
  }
}

.sd.sec-si450 {
  align-content: flex-start;
  align-items: flex-start;
  flex: 1;
  margin: 20px 0px 0px;
  max-width: 100%;
}

@media screen and (max-width: 1140px) {
  .sd.sec-si450 {
    margin: 0px 0px 0px;
    padding: 0px 0px 0px 20px;
    max-width: 100%;
  }
}

@media screen and (max-width: 840px) {
  .sd.sec-si450 {
    flex: 1;
    margin: 0px 0px 0px;
    padding: 0px 0px 0px 30px;
    width: auto;
    max-width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si450 {
    flex: none;
    margin: 14px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si451 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 8px 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si452 {
  color: #888888;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  margin: 0px 0px 0px 0px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si452 {
    font-size: 12px;
  }
}

.sd.sec-si453 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #aaaaaa;
  border-left: 1px solid #aaaaaa;
  border-right: 0px solid #aaaaaa;
  border-top: 0px solid #aaaaaa;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: center;
  margin: 0px 0px 0px 12px;
  padding: 0px 0px 0px 12px;
  width: auto;
  max-width: calc(100% - 12px);
}

.sd.sec-si454 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 14px;
  font-weight: 400;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si454 {
    font-size: 12px;
  }
}

.sd.sec-si455 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si455 {
    font-size: 15px;
  }
}

.sd.sec-si456 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #e1e1e1;
  border-left: 0px solid #e1e1e1;
  border-right: 0px solid #e1e1e1;
  border-top: 0px solid #e1e1e1;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 14px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si457 {
  align-content: flex-start;
  align-items: flex-start;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si458 {
  align-content: center;
  align-items: center;
  background: #FFFFFF;
  border-radius: 32px;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  margin: 0px 8px 8px 0px;
  padding: 4px 10px;
  max-width: calc(100% - 8px);
}

.sd.sec-si445:hover .sd.sec-si458 {
  background: #c1cccb;
}

.sd.sec-si459 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 14px;
  font-weight: 400;
  height: auto;
  line-height: 1;
  margin: 0px 0px 0px 0px;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si459 {
    font-size: 13px;
  }
}

.sd.sec-si159 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: center;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si159.appear {
  opacity: 0;
  transform: translate(0px, 10px);
  transition-delay: 400ms;
  transition-duration: 800ms;
}

.sd.sec-si159.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
}

@media screen and (max-width: 540px) {
  .sd.sec-si159 {
    margin: 40px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si160 {
  align-content: center;
  align-items: center;
  background: #000000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 60px;
  justify-content: center;
  width: 260px;
  max-width: 100%;
}

.sd.sec-si160.appear {
  opacity: 0;
  transform: translate(0px, 10px);
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si160.appear-active {
  transition-delay: 400ms;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si160:hover {
  opacity: 1;
}

@media screen and (max-width: 540px) {
  .sd.sec-si160 {
    flex: none;
    width: 200px;
    max-width: 100%;
  }
}

.sd.sec-si161 {
  color: #FFFFFF;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 400;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  z-index: 1;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si161 {
    font-size: 16px;
  }
}

.sd.sec-si162 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  bottom: 29px;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: 1px;
  justify-content: center;
  left: auto;
  margin: 0 0 0 0;
  position: absolute;
  right: -20px;
  top: auto;
  width: 40px;
  z-index: 2;
  max-width: 100%;
}

.sd.sec-si163 {
  background: #FFFFFF;
  flex: none;
  height: 100%;
  width: 50%;
  max-width: 50%;
}

.sd.sec-si164 {
  background: #000000;
  flex: none;
  height: 100%;
  width: 50%;
  max-width: 50%;
}

.sd.sec-si165 {
  background: #575757;
  flex: none;
  height: 100%;
  left: 0;
  margin: 0 0 0 0;
  position: absolute;
  top: 0;
  transform: scale(0, 1);
  transform-origin: center left;
  width: 100%;
  z-index: 0;
  max-width: 100%;
}

.sd.sec-si160:hover .sd.sec-si165 {
  transform: scale(1, 1);
}

.sd.sec-si166 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 0px 0px 0px;
}

@media screen and (max-width: 840px) {
  .sd.sec-si166 {
    padding: 80px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si166 {
    padding: 50px 0px 0px 0px;
  }
}

.sd.sec-si167 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si167 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si167 {
    padding: 80px 0px 0px 0px;
  }
}


.sd.sec-si174 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width: 100%;
}



.sd.sec-si175 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #c1cccb;
  border-left: 1px solid #c1cccb;
  border-right: 1px solid #c1cccb;
  border-top: 1px solid #c1cccb;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0px;
  height: auto;
  justify-content: flex-start;
  padding: 30px 40px;
  width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si175 {
  flex: none;
    padding: 20px 24px 30px 24px;
  }
}

.sd.sec-si176 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px dotted #575757;
  border-left: 0px dotted #575757;
  border-right: 0px dotted #575757;
  border-top: 0px dotted #575757;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: calc(100% - (var(--gap-v-a397830c-1133-4541-b523-b978f82de922) * 0));
  justify-content: center;
  padding: 0px 40px 0px 0px;
  width: 94px;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si176 {
    flex: none;
    padding: 0px 0px 0px 0px;
    width: 100%;
  }
}

.sd.sec-si177 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.1em;
  line-height: 1;
  margin: 0px 0px 6px 0px;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si177 {
    font-size: 14px;
    margin: 0px 0px 4px 0px;
    max-width: 100%;
  }
}

.sd.sec-si178 {
  color: #333;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 36px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
  width: auto;
  max-width: 100%;
  justify-content: center;
}

.sd.sec-si179 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px dotted #575757;
  border-left: 1px dotted #575757;
  border-right: 0px dotted #575757;
  border-top: 0px dotted #575757;
  flex: 1;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 0px 0px 0px 40px;
  width: auto;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si179 {
    align-content: center;
    align-items: center;
    border-bottom: 0px dotted #575757;
    border-left: 0px dotted #575757;
    border-right: 0px dotted #575757;
    border-top: 1px dotted #575757;
    justify-content: flex-start;
    margin: 14px 0px 0px 0px;
    padding: 20px 0px 0px 0px;
    max-width: 100%;
  }
}

.sd.sec-si180 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 24px;
  font-weight:700;
  height: auto;
  line-height: 1.4;
  margin: 0px 0px 10px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si180 {
    font-size: 24px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si180 {
    font-size: 20px;
    line-height: 1.6;
    text-align: center;
    justify-content: center;
  }
}

.sd.sec-si181 {
  color: #242424;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 16px;
  font-weight: 400;
  height: auto;
  line-height: 1.6;
  margin: 0px 0px 20px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 540px) {
  .sd.sec-si181 {
    font-size: 14px;
  }
}

.sd.sec-si182 {
  align-content: center;
  align-items: center;
  background: #000000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 50px;
  justify-content: center;
  width: 220px;
  max-width: 100%;
}

.sd.sec-si182:hover {
  opacity: 1;
}

@media screen and (max-width: 540px) {
  .sd.sec-si182 {
    flex: none;
    width: 200px;
    max-width: 100%;
  }
}

.sd.sec-si183 {
  color: #FFFFFF;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 18px;
  font-weight: 400;
  height: auto;
  line-height: 1.4;
  text-align: center;
  width: auto;
  z-index: 1;
  max-width: 100%;
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si183 {
    font-size: 16px;
  }
}

.sd.sec-si184 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  bottom: 24px;
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: 1px;
  justify-content: center;
  left: auto;
  margin: 0 0 0 0;
  position: absolute;
  right: -20px;
  top: auto;
  width: 40px;
  z-index: 2;
  max-width: 100%;
}

.sd.sec-si185 {
  background: #FFFFFF;
  flex: none;
  height: 100%;
  width: 50%;
  max-width: 50%;
}

.sd.sec-si186 {
  background: #000000;
  flex: none;
  height: 100%;
  width: 50%;
  max-width: 50%;
}

.sd.sec-si187 {
  background: #575757;
  flex: none;
  height: 100%;
  left: 0;
  margin: 0 0 0 0;
  position: absolute;
  top: 0;
  transform: scale(0, 1);
  transform-origin: center left;
  width: 100%;
  z-index: 0;
  max-width: 100%;
}

.sd.sec-si182:hover .sd.sec-si187 {
  transform: scale(1, 1);
}

.sd.sec-si188 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: center;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si189 {
  color: #333;
  font-size: 48px;
  transform: rotate(90deg);
}

@media screen and (max-width: 540px) {
  .sd.sec-si189 {
    font-size: 32px;
  }
}


.sd.sec-si224 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 120px 0px 140px 0px;
}

@media screen and (max-width: 840px) {
  .sd.sec-si224 {
    padding: 80px 0px 100px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si224 {
    padding: 50px 0px 100px 0px;
  }
}

.sd.sec-si225 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 0px solid #000;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  border-top: 1px solid #000;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 120px 0px 0px 0px;
  width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si225 {
    padding: 100px 0px 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si225 {
    padding: 80px 0px 0px 0px;
  }
}


.sd.sec-si232 {
  padding: 0px;
}

.sd.sec-si232.appear {
  opacity: 0;
  transform: translate(0px, 20px);
  transition-delay: 400ms;
  transition-duration: 600ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si232.appear-active {
  transition-delay: 400ms;
  transition-duration: 600ms;
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

.sd.sec-si233 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  border-radius: 0;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 30px 0px;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si233 {
    flex: none;
    margin: 0px 0px 0px 0px;
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si233 {
    flex: none;
    margin: 0px 0px 20px 0px;
    width: 100%;
    max-width: 100%;
  }
}

.sd.sec-si234 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  border-bottom: 1px solid #c1cccb;
  border-left: 1px solid #c1cccb;
  border-radius: 0;
  border-right: 1px solid #c1cccb;
  border-top: 1px solid #c1cccb;
  flex: none;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  padding: 20px 30px 20px;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si234 {
    padding: 14px 14px 14px;
  }
}

.sd.sec-si235 {
  align-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si236 {
  align-content: center;
  align-items: center;
  background: #FFFFFF;
  border-radius: 40px;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 50px;
  justify-content: center;
  width: 50px;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si236 {
    flex: none;
    height: 34px;
    width: 34px;
    max-width: 100%;
  }
}

.sd.sec-si237 {
  color: #000000;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 20px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.1em;
  line-height: 1;
  margin: 0px 0px 0px 2px;
  text-align: center;
  width: auto;
  max-width: calc(100% - 2px);
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si237 {
    font-size: 16px;
  }
}

.sd.sec-si238 {
  background: rgba(0, 0, 0, 0.0);
  color: #000000;
  flex: 1;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 20px;
  font-weight: 400;
  height: auto;
  line-height: 1.8;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 10px;
  text-align: left;
  width: auto;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si238 {
    flex: none;
    width: 91%;
    max-width: 91%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si238 {
    flex: none;
    font-size: 15px;
    line-height: 1.4;
    width: 88%;
    max-width: 88%;
  }
}

.sd.sec-si239 {
  background: #c8c8c8;
  flex: none;
  height: 1px;
  margin: 10px 0px 10px 0px;
  width: 100%;
  max-width: 100%;
}

.sd.sec-si240 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: none;
  flex-direction: row;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si240 {
    align-content: flex-start;
    align-items: flex-start;
  }
}

.sd.sec-si241 {
  align-content: center;
  align-items: center;
  background: #575757;
  border-radius: 40px;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 50px;
  justify-content: center;
  width: 50px;
  max-width: 100%;
}

@media screen and (max-width: 540px) {
  .sd.sec-si241 {
    flex: none;
    height: 34px;
    width: 34px;
    max-width: 100%;
  }
}

.sd.sec-si242 {
  color: #FFFFFF;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 20px;
  font-weight: 700;
  height: auto;
  letter-spacing: 0.1em;
  line-height: 1;
  margin: 0px 0px 0px 2px;
  padding: 0px 0px 0px 0px;
  text-align: center;
  width: auto;
  max-width: calc(100% - 2px);
  justify-content: center;
}

@media screen and (max-width: 540px) {
  .sd.sec-si242 {
    font-size: 16px;
  }
}

.sd.sec-si243 {
  align-content: flex-start;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.0);
  flex: 1;
  flex-direction: column;
  flex-wrap: nowrap;
  height: auto;
  justify-content: flex-start;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 10px;
  width: auto;
  max-width: 100%;
}

@media screen and (max-width: 840px) {
  .sd.sec-si243 {
    flex: none;
    width: 91%;
    max-width: 91%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si243 {
    flex: none;
    width: 88%;
    max-width: 88%;
  }
}

.sd.sec-si244 {
  background: rgba(0, 0, 0, 0.0);
  color: #000000;
  flex: none;
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size: 15px;
  font-weight: 400;
  height: auto;
  line-height: 1.6;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  text-align: left;
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}

@media screen and (max-width: 840px) {
  .sd.sec-si244 {
    flex: none;
    width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .sd.sec-si244 {
    font-size: 14px;
  }
}



/**case_in**/

.case_in_box{
z-index: 5;
max-width: 1200px;
width:86%;
margin: 0px auto 0px auto;
}
@media screen and (max-width: 840px) {
    .case_in_box{
    width:100%;
    margin: 0px 0 0 0;
    padding: 0;
    }
}
@media screen and (max-width: 540px) {
    .case_in_box{
    width:100%;
    margin: 0px 0 0 0;
    padding: 0;
    }
}

.case_in_head{
padding:0 0 40px 0;
}

.case_in_head_cat{
  display: flex;
  flex-direction: column;   /* 縦並び */
  align-items: flex-start;  /* 横方向に伸ばさない（=100%にならない） */
  gap: 5px;
  margin:0 0 20px 0;
  }
.case_in_head_cat p{
  background:#575757;
  color:#fff;
  font-size:14px;
  font-weight:600;
  line-height:1.2;
  padding:6px 8px;
  display: inline-block;
  margin:0 0 0px 0;
}
.nxg-body-s-in{
 display:flex; flex-wrap:wrap;gap:8px; margin:0 0 0px 0;
}
.nxg-body-s-in span{font-size: 1xpx;line-height:1.4;color:#999;display:inline-block;font-weight:600;}


.case_in_head_desc{
display: flex;
}

.case_in_head_desc p{
  margin:0 0 20px 0;
  padding:0 10px 0 10px;
  border-left:1px solid #aaa;
  color:#333;
  font-size:16px;
  font-weight:600;
  line-height:1.4;
}

.case_in_head_title{
  margin:0 0 20px 0;
}
.case_in_head_title h1{
  font-size:28px;
  font-weight:700;
  line-height:1.4;
}
@media screen and (max-width: 540px) {
    .case_in_head_title h1{
      font-size:20px;
      font-weight:700;
      line-height:1.4;
    }
}


/* 下部の白チップ */
.case_in_head_tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.cih-tag{
  background:#fff; color:#333; font-size:14px; font-weight:600; line-height:1;
  padding:4px 10px; border-radius:32px; display:inline-block;
}


.case_in_body{
padding:40px 0;
border-top: 1px solid #000;
}
.case_in_body_view{
width: 100%;
margin: 0 0 40px 0;
}
.case_in_body_view img{width: 100%;}

.case_in_body p{
font-weight: 500;
font-size: 16px;
line-height: 1.6;
margin: 0 0 20px 0;
}
@media screen and (max-width: 540px) {
.case_in_body p{
font-weight: 500;
font-size: 14px;
line-height: 1.6;
margin: 0 0 20px 0;
}
}
.font-bold{
font-weight: 700;
}

.case_in_body h2{
  margin:40px 0 20px 0;
  padding:0 0px 0 15px;
  border-left:1px solid #aaa;
  color:#333;
  font-size:24px;
  font-weight:600;
  line-height:1.4;
}

@media screen and (max-width: 540px) {
    .case_in_body h2{
      margin:40px 0 20px 0;
      padding:0 0px 0 15px;
      border-left:1px solid #aaa;
      color:#333;
      font-size:18px;
      font-weight:600;
      line-height:1.4;
    }
}

.case_in_body h3{
  margin:40px 0 20px 0;
  color:#333;
  font-size:20px;
  font-weight:600;
  line-height:1.4;
}

@media screen and (max-width: 540px) {
    .case_in_body h3{
      margin:40px 0 20px 0;
      color:#333;
      font-size:16px;
      font-weight:600;
      line-height:1.4;
    }
}

.case_in_body_box{
margin: 0 0 40px 0;
}

.case_in_body_box_bo{
margin: 0 0 40px 0;
border-top: 1px solid #aaa;
}

.case_in_body_blockquote{
padding:30px 1.5em;
border-left: 3px solid #ccc;
color: #333333;
line-height: 1.5;
margin: 0 0 20px 0;
}
@media screen and (max-width: 540px) {
    .case_in_body_blockquote{
    font-size: 14px;
    }
}

.case_in_body_blockquote:has(cite) {
padding-bottom: .5em;
}

.case_in_body_blockquote p {
line-height: 1.5;
margin-top: 0;
}


.case_in_body_ul01{
list-style: decimal!important;
margin: 0 0 20px 0;
padding-left: 1.5em;
}
ol.case_in_body_ul01, ol.case_in_body_ul01 > li {
font-size:16px;
font-weight:600;
line-height:2;
list-style: decimal!important;
}
@media screen and (max-width: 540px) {
    ol.case_in_body_ul01, ol.case_in_body_ul01 > li {
    font-size:14px;
    }
}

.case_in_body_ul02{
list-style: disc!important;
margin: 0 0 20px 0;
padding-left: 1.5em;
}
ul.case_in_body_ul02, ul.case_in_body_ul02 > li {
font-size:16px;
font-weight:600;
line-height:2;
list-style: disc!important;
}
@media screen and (max-width: 540px) {
    ul.case_in_body_ul02, ul.case_in_body_ul02 > li {
    font-size:14px;
    }
}

.case_in_body_btn01{
width: 100%;
text-align: center;
margin: 30px auto 0px auto;
}

.case_in_body_btn01 a{
min-width: 270px;
border-radius: 200px;
padding: 20px 25px;
font-size: 16px;
font-weight:600;
color:#fff;
display: block;
background-color: #666;
margin: 0 auto;
}
.case_in_body_btn01 a:hover{
color:#fff;
display: block;
background-color: #000;
}


.sec-93_x{
  max-width: 1200px;
  width:86%;
  margin: 0 auto;
}

@media screen and (max-width: 840px) {
  .sec-93_x{
    padding: 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  .sec-93_x{
    padding: 0px 0px;
  }
}