@charset "UTF-8";

/* ===== v19 patch : SP調整・色の継承・別窓アイコン ===== */

/* --- 別窓アイコン --- */
.ex{width:.68em;height:.68em;display:inline-block;vertical-align:.04em;margin-left:.42em;flex:none;
  fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--g2)}
.ov-svc .t .x,.ft-nv .x,.own .nm .x,.svcbnr .tx h4 .x,.smc li a .x,.mapl span{font-size:inherit;color:inherit;margin-left:0}

/* --- カテゴリアイコン --- */
.ico{width:24px;height:24px;display:block;fill:none;stroke:currentColor;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round}

/* --- 電話番号 --- */
a[href^="tel:"]{color:inherit;text-decoration:none;-webkit-text-fill-color:currentColor;
  -webkit-tap-highlight-color:rgba(0,0,0,.06)}
a[href^="tel:"]:hover{opacity:.7}

/* --- CTAの電話番号（PC：1行に組む） --- */
.cta-t .lb::after{content:"："}
.cta-t .tel{white-space:nowrap}
.cta-t .tel + .tel::before{content:"／";color:var(--g2);margin:0 6px}
.cta-t .c{margin-right:7px}
.cta-t .hr{margin-left:6px}
.cta-t .hr::before{content:"（"}
.cta-t .hr::after{content:"）"}

/* --- 色の継承事故 --- */
/* background / border は各コンポーネント側の指定を壊さないよう触らない */
button{font:inherit;color:inherit;-webkit-appearance:none;appearance:none;cursor:pointer}
a{color:inherit;-webkit-text-fill-color:currentColor}
.qc>div,.bks>div,.wr,.cyc>div,.cmp>div,.cs,.cs2,.val{color:var(--w)}
.qc h4,.bks h3,.wr h3,.wr h4,.cyc h4,.cmp h4,.cs .cat,.cs2 .cat,.val h4{color:var(--w)}
.nwt button,.tb{color:var(--g1);-webkit-text-fill-color:currentColor;background:none}
.nwt button.on,.nwt button:hover,.tb.on,.tb:hover{background:var(--k);border-color:var(--k);
  color:var(--w);-webkit-text-fill-color:var(--w)}

/* --- 実績カード：アイコン＋商材名／予算 --- */
.cs .cat,.cs2 .cat{display:flex;align-items:flex-start;gap:14px;min-height:0}
.cs .cs-ic,.cs2 .cs-ic{flex:none;width:46px;height:46px;border:1px solid var(--lnk);
  display:flex;align-items:center;justify-content:center;color:var(--w)}
.cs .cs-ic .ico,.cs2 .cs-ic .ico{width:22px;height:22px}
.cs .cs-tx,.cs2 .cs-tx{display:block;min-width:0}
.cs .cs-tx .t,.cs2 .cs-tx .t{display:block;line-height:1.55}
.cs .cs-tx .b{display:block;font-size:12px;color:var(--g2);font-weight:500;
  letter-spacing:.02em;margin-top:4px}
.cs2 .cs-tx .bg{display:inline-block;margin-top:8px}

/* --- 画像ビューア --- */
.lpv,.mgf{cursor:zoom-in}
.imv{position:fixed;inset:0;z-index:400;background:rgba(11,11,12,.96);display:none;overflow-y:auto;
  -webkit-overflow-scrolling:touch;padding:64px 0 48px}
.imv.on{display:block}
.imv img{width:100%;max-width:760px;margin:0 auto;display:block}
.imvx{position:fixed;top:14px;right:14px;z-index:410;background:none;border:1px solid var(--lnk);
  color:var(--w);font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.2em;padding:11px 16px;cursor:pointer}
.imvx:hover{background:var(--w);color:var(--k)}

/* ================= SP ================= */
@media (max-width:760px){

  /* ボタン幅の統一 */
  .btn{display:flex;width:100%;max-width:340px;justify-content:center;
    padding:17px 18px;font-size:13px;text-align:center}
  .cta .btn,.cta-a .btn,.morebar .btn{margin-left:auto;margin-right:auto}
  .cta-a{display:grid;grid-template-columns:1fr;gap:12px;justify-items:center;
    max-width:340px;margin-left:auto;margin-right:auto}
  .morebar{flex-direction:column;align-items:center;gap:16px}

  /* CTAの電話番号 */
  .cta-t{margin-top:32px;line-height:1.9}
  .cta-t .lb,.cta-t .tel,.cta-t .hr{display:block}
  .cta-t .lb::after{content:none}
  .cta-t .tel{margin-top:12px}
  .cta-t .tel + .tel::before{content:none}
  .cta-t .c{margin-right:7px}
  .cta-t .hr{margin-top:14px;margin-left:0;font-size:11.5px}
  .cta-t .hr::before,.cta-t .hr::after{content:none}
  .cta-t b{font-size:22px}

  /* 入口カード・数値ブロックを2列に */
  .entry .grid4{grid-template-columns:1fr 1fr}
  .ent{padding:22px 15px 26px}
  .ent .n{font-size:9.5px;letter-spacing:.14em}
  .ent h3{font-size:14px;margin-top:9px;line-height:1.6}
  .ent h3 br{display:none}
  .ent p{font-size:11.5px;margin-top:7px;line-height:1.75}
  .ent .go{font-size:10.5px;margin-top:13px;gap:6px}
  .entry .grid4 .ent:last-child:nth-child(odd){grid-column:1 / -1}
  .fct{padding:20px 15px 24px}
  .fct .v{font-size:24px}
  .fct .v i{font-size:11px}
  .fct .l{font-size:11px;margin-top:8px;line-height:1.65}

  /* 実績カード */
  .cs{padding:24px 18px 28px}
  .cs .cat,.cs2 .cat{gap:13px}
  .cs .cs-ic,.cs2 .cs-ic{width:42px;height:42px}
  .cs .cs-ic .ico,.cs2 .cs-ic .ico{width:21px;height:21px}
  .cs .cs-tx .t,.cs2 .cs-tx .t{font-size:14px}
  .cs2 .cs-tx .bg{margin-top:7px}
  .cs .bar,.cs2 .bar{gap:22px;margin-top:20px;padding-top:18px}
  .cs .v,.cs2 .v{font-size:26px}

  /* 新着情報リスト（トップ・一覧とも） */
  .nw,.hnw a{grid-template-columns:auto 1fr;grid-template-areas:"cat date" "ttl ttl";
    gap:0 12px;align-items:center}
  .nw .c,.hnw .c{grid-area:cat;justify-self:start;align-self:center;
    background:var(--k);color:var(--w);-webkit-text-fill-color:var(--w);border:0;
    padding:5px 11px;text-align:left;white-space:nowrap;font-size:10.5px;letter-spacing:.1em;line-height:1.4}
  .nw .d,.hnw .d{grid-area:date;justify-self:start;align-self:center;margin:0}
  .nw h3,.hnw h3{grid-area:ttl;margin-top:10px;font-size:14.5px;line-height:1.75}
  .nw:hover .c,.hnw a:hover .c{background:var(--k)}

  /* カテゴリタブ */
  .nwt,.tabs{gap:8px}
  .nwt button,.tb{font-size:12px;padding:9px 14px}

  /* 画像枠：入れ子スクロールをやめてタップで全画面 */
  .lpv{height:auto;aspect-ratio:4/5;position:relative}
  .lpv img{transition:none}
  .lpv::after{content:"TAP"}
  .lpv::before{content:"";position:absolute;left:0;right:0;bottom:0;height:88px;z-index:1;
    background:linear-gradient(rgba(244,244,245,0),rgba(244,244,245,.92));pointer-events:none}
  .mgf{height:auto;aspect-ratio:4/5}
  .mgf img{transition:none}
  .mgl{font-size:0}
  .mgl::after{content:attr(data-sp);font-size:9px;letter-spacing:.2em}
  .imv{padding:56px 0 40px}
}


/* --- business.html バナーのサムネ（.hband と同じ扱いに揃える） --- */
.bnr3 .th img{filter:grayscale(1) contrast(1.03);transition:filter .8s var(--ease)}
.bnr3:hover .th img{filter:grayscale(0)}

/* --- サービスサイトのバナー：スクエア素材が切れないように --- */
.svcbnr .im{aspect-ratio:1/1;background:var(--w)}
.svcbnr .im img{object-fit:contain}

/* --- 会社概要：主要取引先リスト --- */
.dl .cll{list-style:none;display:flex;flex-wrap:wrap;gap:4px 0;margin:0;padding:0}
.dl .cll li{font-size:13.5px;line-height:1.9;color:var(--k)}
.dl .cll li::after{content:"／";color:var(--g3);margin:0 7px}
.dl .cll li:last-child::after{content:none}
.dl .cll-note{display:block;margin-top:10px;font-size:12.5px;color:var(--g2)}
@media (max-width:760px){ .dl .cll li{font-size:12.5px} }
