@charset "UTF-8";
/* 全ページ共通の上書き（10/7）。トップの restyle.css にしか無かったナビの縦中央揃えを下層にも適用 */
.gnav__item a,.gnav__trigger{justify-content:center;gap:0;height:42px;position:relative}
.gnav__dot{position:absolute;bottom:2px;left:50%;margin-left:-3px}

/* =========================================================
   10/8 タブレット対応（769〜1280px）
   PC(1281以上)とスマホ(768以下)には当たらない範囲だけで調整する
   ========================================================= */
.btn-contact{white-space:nowrap}

/* 固定幅1440のフッターが画面端に張り付く／はみ出すのを防ぐ（restyle.css から移設。全ページ共通） */
@media (min-width:769px) and (max-width:1560px){
  .footer__inner{width:auto;max-width:1440px;margin-left:auto;margin-right:auto;padding-left:40px;padding-right:40px}
  .footer__nav{width:auto;flex:1 1 auto;min-width:0}
  .footer__cols{gap:60px}
}

/* ---- ヘッダー：PCナビが1行に収まらない幅（〜1100px）はハンバーガー ---- */
@media (min-width:769px) and (max-width:1100px){
  .header{top:16px;left:24px;right:24px;height:68px;padding:20px 28px;border-radius:14px}
  .gnav{display:none}
  .hamburger{display:flex}
  /* bcp.css が後から読まれるので body を付けて優先させる */
  body .header__cert{display:none}
  body .bcp-banner--drawer{display:flex;margin-top:16px;justify-content:flex-start}
  body .bcp-banner--drawer .bcp-banner__arw{margin-left:auto}

  :where(.drawer){background:linear-gradient(160deg,#5b86cf 0%,#3f6dc0 100%)}  /* トップは restyle.css の色が勝つ */
  .drawer{
    display:block;position:fixed;inset:0;z-index:90;
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .5s var(--ease-gentle),transform .5s var(--ease-gentle),visibility .5s;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    height:100vh;height:100dvh;
  }
  body.is-drawer-open{overflow:hidden}
  body.is-drawer-lock{position:fixed;left:0;right:0;width:100%}
  body.is-drawer-open .drawer{opacity:1;visibility:visible;transform:none}
  .drawer__inner{display:flex;flex-direction:column;min-height:100%;max-width:640px;margin:0 auto;padding:120px 40px 48px}
  .drawer__nav{display:flex;flex-direction:column;gap:0}
  .drawer__head{display:flex;align-items:center;gap:16px;padding:24px 0;font:700 16px/1 var(--f-jp);color:#fff;border-top:1px solid rgba(255,255,255,.25)}
  .drawer__nav>.drawer__group:first-child .drawer__head,
  .drawer__nav>.drawer__head:first-child{border-top:none}
  .drawer__dot{width:6px;height:6px;border-radius:50%;background:var(--c-teal);flex-shrink:0}
  .drawer__group{border-top:1px solid rgba(255,255,255,.25)}
  .drawer__group .drawer__head{border-top:none;padding-bottom:8px}
  .drawer__subs{display:flex;flex-direction:column;gap:14px;padding:0 0 24px 22px}
  .drawer__subs a{font:500 14px/1 var(--f-jp);color:rgba(255,255,255,.92)}
  .drawer__contact{
    margin-top:auto;display:flex;align-items:center;justify-content:center;gap:20px;
    height:72px;border-radius:50px;background:var(--c-teal);
    font:700 16px/1 var(--f-jp);color:#fff;
  }
  .drawer__contact-arw{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.22)}
}
/* 1101〜1280：PCナビのまま。ヘッダー左右を詰めて余裕を作る */
@media (min-width:1101px) and (max-width:1280px){
  .header{left:40px;right:40px;padding:20px 36px}
  .gnav,.gnav__list{gap:24px}
}

/* ---- フッター：2カラムが入らない幅は縦積み ---- */
@media (min-width:769px) and (max-width:1280px){
  .footer__inner{flex-direction:column;gap:56px}
  .footer__left{width:auto;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:40px}
  .footer__tel{width:auto;flex:0 1 509px}
  .footer__divider{display:none}
  .footer__nav{padding-top:0}
  .footer__cols{flex-wrap:wrap;gap:40px 60px}
  .fcol,.fcol--flat,.fcol:nth-child(3){width:auto}
}

/* ---- 下層ページの固定幅コンテナを画面幅に合わせる ---- */
@media (min-width:769px) and (max-width:1280px){
  .company__inner{width:auto;max-width:1200px;padding-left:40px;padding-right:40px}
  .info__map{width:100%}
  .footer__cols{gap:clamp(30px,calc((var(--mk) - 1070px) / 2),60px)}
  .case-arch__inner{width:auto;max-width:1440px;padding:0 40px}
  .case-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:30px}
  .case-grid .case-card{width:auto;min-width:0}
  .case-grid .case-card__img{width:100%;height:auto;aspect-ratio:460/307}
  .case-single__inner{width:auto;max-width:1200px;padding:0 40px}
  .case-detail{width:auto;padding:50px 60px 80px}
  .news-archive__inner,.news-single__inner{padding-left:40px;padding-right:40px}
  .news-arc-list,.na-card,.ns-article{width:100%;max-width:1200px}
  .ns-article{padding:0 60px}
  .c-field{width:100%;max-width:1000px}
  .c-form{padding-left:40px;padding-right:40px}
}
@media (min-width:769px) and (max-width:1024px){
  .info__label{flex-basis:180px;width:180px;padding:30px 20px}
  .info__val{padding-left:30px;padding-right:30px}
  .case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* =========================================================
   10/8 改行位置の調整（全ページ）
   ========================================================= */
.nw{white-space:nowrap}
@media (max-width:768px){br.pc-br{display:none}}
/* 本文：最終行が1〜2文字だけになるのを防ぐ */
p,dd,li,.c-agree__txt{text-wrap:pretty}
/* 見出し：行の長さをそろえ、語の途中で割らない */
h1,h2,h3,.svc-freon__title,.svc-single__title,.svc-grid4__title,.svc-col__label,
.ns-head__title,.case-detail__title,.c-complete__title,.na-card__title{
  text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere;
}
/* 英字の大見出し(About/Business/Project Cases 等)は対象外 */
.en-head,.contact__title,.page-mv__en{word-break:normal!important;overflow-wrap:normal!important}
/* 対応ブラウザ(Chrome/Edge 119+)では文節単位で折り返す（カタカナ語・数字の途中で割れない） */
@supports (word-break:auto-phrase){
  h1,h2,h3,.svc-freon__title,.svc-single__title,.svc-grid4__title,.svc-col__label,
  .ns-head__title,.case-detail__title,.c-complete__title,.na-card__title{word-break:auto-phrase}
  p,dd,li,.c-agree__txt{word-break:auto-phrase;overflow-wrap:break-word}
}
/* タブレット：コピーライトを1〜2行に */
@media (min-width:769px) and (max-width:1280px){.footer__bottom{flex-wrap:wrap}}

/* 10/8 事業内容の4枚グリッド：600〜768pxは2列（スマホ幅では従来どおり1列） */
@media (min-width:600px) and (max-width:768px){
  .svc-grid4{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;gap:40px 24px;margin:0 20px}
}

/* =========================================================
   11/1 MacBook幅（1281〜1919px）の左右余白
   90%表示で見たときと同じ幅に固定幅コンテナを縮める（文字サイズは変えない）。
   1440幅のコンテナ＝1440〜1728pxでは1296px（=1440×0.9）、それより狭いと90vw、
   1728px超は1920pxで元の1440pxに戻るまで連続的に広げる。
   1200幅・1000幅のコンテナも同じ比率。1920px以上と1280px以下には当たらない。
   ========================================================= */
@media (min-width:1281px) and (max-width:1919px){
  :root{--mk:min(90vw,max(1296px,calc(1440px - (1920px - 100vw) * .75)))}
  .about__inner,.business__inner,.case__inner,.news__inner,.footer__inner,.case-arch__inner{
    width:var(--mk);max-width:none;padding-left:0;padding-right:0;margin-left:auto;margin-right:auto;box-sizing:border-box;
  }
  .biz-row{width:var(--mk);max-width:none;margin-left:auto;margin-right:auto;padding-left:calc(var(--mk) * 100 / 1440);padding-right:calc(var(--mk) * 100 / 1440);box-sizing:border-box}
  .biz-row__inner{width:100%;max-width:none}
  .company__inner,.case-single__inner{width:calc(var(--mk) * 1200 / 1440);max-width:none;padding-left:0;padding-right:0;box-sizing:border-box}
  .case-detail{width:100%;box-sizing:border-box}
  .news-arc-list,.na-card,.ns-article{width:calc(var(--mk) * 1200 / 1440);max-width:100%;box-sizing:border-box}
  .svc-blocks{width:calc(var(--mk) * 1200 / 1440);max-width:none}
  .c-field{width:calc(var(--mk) * 1000 / 1440);max-width:100%}
  .info__map{width:100%}
  .footer__cols{gap:clamp(30px,calc((var(--mk) - 1070px) / 2),60px)}
  .case-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:30px}
  .case-grid .case-card{width:auto;min-width:0}
  .case-grid .case-card__img{width:100%;height:auto;aspect-ratio:460/307}
}