@charset "UTF-8";
/* ==========================================================================
   Hitamuki × IIJ Global 協業コンサルティングサービス LP
   (/service/special/hitamuki01.html)
   --------------------------------------------------------------------------
   命名規約: servicelp.css / special_ai_security01.css に準拠
     - ページ固有ブロックは  p-htmk-<block>
     - 要素は  p-htmk-<block>__<element>
     - 装飾差分は  --<modifier>
   接点トンマナ: Hitamukiブルー × IIJレッド を1本のグラデーション
   （--htmk-grad）でつなぐ。詳細は Figma「2026-08-26-Hitamuki協業LP_接点デザイン版」参照。
   ========================================================================== */

/* ===== Design tokens ===== */
:root{
  --htmk-blue:#2c50c8;      /* Hitamuki＝アクセル */
  --htmk-purple:#7a3fa8;    /* 協業＝接点 */
  --htmk-red:#d8063b;       /* IIJ＝ガードレール */
  --htmk-navy:#192f60;      /* 見出しネイビー（Hitamukiコーポレート） */
  --htmk-ink:#242424;
  --htmk-text:#333;
  --htmk-sub:#525461;
  --htmk-body:#4a4d55;
  --htmk-bg-gray:#f6f6f7;
  --htmk-cell:#f6f9fb;
  --htmk-chipbg:#edf2fe;
  --htmk-line:#d8e0ea;
  --htmk-cta-bg:#01121c;

  --htmk-grad:linear-gradient(90deg,#2c50c8 0%,#7a3fa8 50%,#d8063b 100%);
  --htmk-grad-btn:linear-gradient(90deg,#d8063b 0%,#99082d 100%);

  --htmk-maxw:1136px;
  --htmk-radius:14px;
  --htmk-shadow:0 8px 24px rgba(13,20,51,.12);
  --htmk-section-y:90px;
  --htmk-gutter:24px;
}

/* ===== Base ===== */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Noto Sans JP',-apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
  color:var(--htmk-text);line-height:1.8;background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.p-htmk-container{max-width:calc(var(--htmk-maxw) + var(--htmk-gutter)*2);margin:0 auto;padding:0 var(--htmk-gutter)}

/* 道ライン（セクション区切り） */
.p-htmk-road{height:8px;background:var(--htmk-grad)}

/* グラデ文字（FVタイトル・SOLUTIONステートメント共用） */
.p-htmk-gradtext{background:var(--htmk-grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--htmk-navy)}

/* SPで #c-container に top オフセットが入る環境向けの相殺
   （ライブの ai_security01 / solution-lab01 と同じく先頭からヒーローを表示） */
#c-container{top:0 !important}

/* ===== Hero（FV：夜のハイウェイ×白パネル） ===== */
.p-htmk-hero{position:relative;overflow:hidden;
  background:#0a0f1e url(/service/images_v2/special/hitamuki/fv-bg.jpg) center/cover no-repeat;
  padding:82px var(--htmk-gutter) 56px;display:flex;align-items:center;justify-content:center;min-height:520px}
.p-htmk-hero__panel{width:min(836px,100%);
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#d8063b 0%,#2f50c7 100%) border-box;
  border:6px solid transparent;text-align:center;padding:42px 32px 40px}
.p-htmk-hero__logos{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:26px}
.p-htmk-hero__logos img{height:40px;width:auto}
.p-htmk-hero__logos .is-cross{font-size:16px;font-weight:700;color:#8a8f9a}
.p-htmk-hero__title{font-size:clamp(24px,3.33vw,48px);font-weight:900;line-height:1.5;letter-spacing:.01em}
.p-htmk-hero__lead{margin-top:20px;font-size:clamp(12px,1.05vw,15px);font-weight:700;line-height:1.9;color:#000}

/* IIJ Global ロゴ（白バッジ・右上）— ai_security01 / solution-lab01 と同一仕様 */
.p-htmk-hero__logo{position:absolute;top:0;right:max(0px,calc((100% - 950px)/2));z-index:3;background:#fff}
.p-htmk-hero__logo a{width:106px;height:70px;display:flex;align-items:center;justify-content:center}
.p-htmk-hero__logo a img{width:66px;height:auto}
@media(max-width:560px){
  .p-htmk-hero__logo a{width:74.5px;height:49.5px}
  .p-htmk-hero__logo a img{width:46.5px}
}

/* ===== セクション見出し（巨大英字＝両社共通の文化） ===== */
.p-htmk-head__en{font-size:clamp(34px,3.75vw,54px);font-weight:900;line-height:1.15;
  letter-spacing:.02em;color:var(--htmk-navy)}
.p-htmk-head__sub{display:flex;align-items:center;gap:12px;margin-top:12px}
.p-htmk-head__bar{width:56px;height:6px;border-radius:3px;background:var(--htmk-grad);flex:none}
.p-htmk-head__subtext{font-size:15px;font-weight:700;color:var(--htmk-sub);line-height:1.4}

/* ブロック見出し（赤バー→グラデバー） */
.p-htmk-h3{display:flex;align-items:center;gap:14px}
.p-htmk-h3__bar{width:6px;height:30px;border-radius:3px;background:var(--htmk-grad);flex:none}
.p-htmk-h3__text{font-size:clamp(21px,1.95vw,28px);font-weight:700;color:#1a1f2e;line-height:1.4}
.p-htmk-blocklead{margin-top:20px;font-size:15px;line-height:1.85;color:var(--htmk-body)}

/* ===== CHALLENGE（課題） ===== */
.p-htmk-challenge{background:var(--htmk-bg-gray);padding:80px 0}
.p-htmk-challenge__lead{margin:44px 0 48px;text-align:center;color:var(--htmk-navy);
  font-size:clamp(19px,2.64vw,38px);font-weight:700;line-height:1.55}
.p-htmk-challenge__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.p-htmk-challenge__card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--htmk-shadow)}
.p-htmk-challenge__card::before{content:"";display:block;height:6px;background:var(--htmk-grad)}
.p-htmk-challenge__card img{width:100%;height:190px;object-fit:cover}
.p-htmk-challenge__card h3{margin:20px 22px 0;text-align:center;
  font-size:20px;font-weight:700;line-height:1.45;color:#1a1f2e}
.p-htmk-challenge__card p{margin:12px 24px 26px;font-size:13px;line-height:1.75;color:#404040}

/* ===== SOLUTION（協業ソリューション） ===== */
.p-htmk-solution{background:#fff;padding:var(--htmk-section-y) 0}
.p-htmk-solution__lead{margin:44px 0 48px;text-align:center;color:var(--htmk-navy);
  font-size:clamp(18px,2.3vw,33px);font-weight:700;line-height:1.65}
.p-htmk-solution__partners{display:flex;align-items:stretch;gap:20px}
.p-htmk-solution__partner{flex:1;background:#fff;border-radius:var(--htmk-radius);
  box-shadow:var(--htmk-shadow);padding:30px 32px}
.p-htmk-solution__logo{height:56px;display:flex;align-items:center;margin-bottom:18px}
.p-htmk-solution__logo img{max-height:100%;width:auto}
.p-htmk-solution__logo.is-iij img{height:44px}
.p-htmk-solution__body{display:flex;gap:16px}
.p-htmk-solution__accent{width:6px;border-radius:3px;flex:none}
.p-htmk-solution__accent.is-blue{background:var(--htmk-blue)}
.p-htmk-solution__accent.is-red{background:var(--htmk-red)}
.p-htmk-solution__eyebrow{font-size:14px;font-weight:700;line-height:1.4}
.p-htmk-solution__eyebrow.is-blue{color:var(--htmk-blue)}
.p-htmk-solution__eyebrow.is-red{color:var(--htmk-red)}
.p-htmk-solution__title{margin-top:6px;font-size:clamp(20px,1.8vw,26px);font-weight:700;color:var(--htmk-ink);line-height:1.45}
.p-htmk-solution__sub{margin-top:6px;font-size:14px;color:#444}
.p-htmk-solution__cross{align-self:center;font-size:42px;font-weight:900;color:var(--htmk-purple);flex:none}
.p-htmk-solution__statement{margin-top:60px;text-align:center;
  font-size:clamp(24px,3.6vw,52px);font-weight:900;line-height:1.45}
.p-htmk-solution__partnerline{margin-top:26px;text-align:center;
  font-size:clamp(16px,2.1vw,30px);font-weight:700;color:var(--htmk-ink);line-height:1.65}

/* ===== 英字バンド（HITAMUKI / IIJ GLOBAL / SYNERGY） ===== */
.p-htmk-band{background:#fff;padding:84px 0 0}

/* ===== 人材育成 ===== */
.p-htmk-jinzai{background:#fff;padding:var(--htmk-section-y) 0}
.p-htmk-jinzai__groups{display:flex;gap:24px;margin-top:30px;align-items:stretch}
.p-htmk-jinzai__group{border:1px solid var(--htmk-line);border-radius:12px;overflow:hidden;
  background:#fff;display:flex;flex-direction:column}
.p-htmk-jinzai__group.is-kenshu{flex:1}
.p-htmk-jinzai__group.is-bansou{width:336px;flex:none}
.p-htmk-jinzai__grouphead{background:var(--htmk-blue);color:#fff;text-align:center;
  font-size:16px;font-weight:700;padding:11px;line-height:1.4}
.p-htmk-jinzai__groupbody{display:flex;gap:18px;padding:22px;flex:1}
.p-htmk-jinzai__card{flex:1;min-width:0}
.p-htmk-jinzai__card img{width:100%;height:100px;object-fit:cover;border-radius:8px;margin-bottom:12px}
.p-htmk-jinzai__card.is-photo-lg img{height:128px}
.p-htmk-jinzai__card h4{text-align:center;font-size:16px;font-weight:700;color:#1a1f2e;line-height:1.45}
.p-htmk-jinzai__card p{margin-top:8px;font-size:12.5px;line-height:1.72;color:var(--htmk-body)}
.p-htmk-jinzai__staff{margin-top:30px;background:var(--htmk-chipbg);border-radius:12px;
  padding:28px;text-align:center}
.p-htmk-jinzai__staff h4{font-size:19px;font-weight:700;color:#1a1f2e;line-height:1.45}
.p-htmk-jinzai__chips{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:18px}
.p-htmk-jinzai__chip{background:#fff;border:1.5px solid var(--htmk-blue);border-radius:999px;
  padding:8px 20px;font-size:13px;font-weight:700;color:var(--htmk-blue);line-height:1.4}

/* ===== 伴走型の現場支援 ===== */
.p-htmk-genba{background:var(--htmk-bg-gray);padding:var(--htmk-section-y) 0}
.p-htmk-genba__panel{margin-top:30px;background:#fff;border-radius:var(--htmk-radius);
  box-shadow:var(--htmk-shadow);padding:40px;display:flex;justify-content:center}
.p-htmk-genba__flow{display:flex;align-items:center;gap:22px}
.p-htmk-genba__arrow{font-size:26px;font-weight:700;color:#8a94a6;flex:none}
.p-htmk-genba__box{border:1px solid var(--htmk-line);border-radius:10px;overflow:hidden;background:#fff}
.p-htmk-genba__box.is-client{width:190px}
.p-htmk-genba__box.is-hitamuki{width:252px}
.p-htmk-genba__boxhead{color:#fff;text-align:center;font-size:15px;font-weight:700;padding:8px;line-height:1.4}
.p-htmk-genba__box.is-client .p-htmk-genba__boxhead{background:var(--htmk-navy)}
.p-htmk-genba__box.is-hitamuki .p-htmk-genba__boxhead{background:var(--htmk-blue)}
.p-htmk-genba__box.is-outcome .p-htmk-genba__boxhead{background:var(--htmk-purple)}
.p-htmk-genba__boxbody{padding:12px 14px;text-align:center;font-size:12.5px;line-height:1.75;color:var(--htmk-body)}
.p-htmk-genba__outcome{display:flex;flex-direction:column;gap:12px;width:300px}

/* ===== DX・AIコンサルティング ===== */
.p-htmk-dx{background:#fff;padding:var(--htmk-section-y) 0}
.p-htmk-dx__shien{margin:30px 0;background:var(--htmk-blue);border-radius:8px;color:#fff;
  text-align:center;font-size:16px;font-weight:700;padding:10px;line-height:1.4}
.p-htmk-dx__grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.p-htmk-dx__cell{background:var(--htmk-cell);border-radius:12px;padding:24px;display:flex;gap:18px}
.p-htmk-dx__num{width:54px;height:54px;flex:none;background:#fff;border:1.5px solid var(--htmk-blue);
  border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:21px;font-weight:700;color:var(--htmk-blue)}
.p-htmk-dx__cell h4{font-size:17px;font-weight:700;color:#1a1f2e;line-height:1.45}
.p-htmk-dx__cell p{margin-top:8px;font-size:12.5px;line-height:1.72;color:var(--htmk-body)}

/* ===== AI Security 全体像（既存LPの図版・ぼかし背景を流用） ===== */
.p-htmk-overview{position:relative;padding:70px 0;
  background:#fff url(/service/images_v2/special/ai_security/bg-bokeh.jpg) center/cover no-repeat}
.p-htmk-overview::before{content:"";position:absolute;inset:0;background:rgba(255,205,205,.2)}
.p-htmk-overview__inner{position:relative;max-width:1128px;margin:0 auto;padding:0 var(--htmk-gutter)}

/* ===== ガードレール ===== */
.p-htmk-guard{background:#fff;padding:var(--htmk-section-y) 0}
.p-htmk-guard__lead{margin:28px 0 32px;text-align:center;
  font-size:clamp(17px,1.55vw,22px);font-weight:700;color:#1a1f2e;line-height:1.6}
.p-htmk-guard__cards{display:flex;gap:24px}
.p-htmk-guard__card{flex:1;background:var(--htmk-cell);border-radius:var(--htmk-radius);
  display:flex;align-items:center;gap:20px;padding:26px 28px}
.p-htmk-guard__mark{width:60px;height:60px;flex:none;border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700}
.p-htmk-guard__mark.is-ng{border:3px solid var(--htmk-red);color:var(--htmk-red)}
.p-htmk-guard__mark.is-ok{border:3px solid var(--htmk-blue);color:var(--htmk-blue)}
.p-htmk-guard__card h4{font-size:19px;font-weight:700;color:#1a1f2e;line-height:1.5}
.p-htmk-guard__card p{margin-top:2px;font-size:13px;color:#6b6e76}
.p-htmk-guard__band{margin-top:32px;background:var(--htmk-navy);border-radius:8px;color:#fff;
  text-align:center;font-size:clamp(15px,1.35vw,19px);font-weight:700;padding:18px;line-height:1.45}
.p-htmk-guard__closing{margin-top:34px;text-align:center;color:var(--htmk-red);
  font-size:clamp(20px,3.2vw,46px);font-weight:700;line-height:1.6}

/* ===== 4つの仕組み ===== */
.p-htmk-shikumi{background:var(--htmk-bg-gray);padding:var(--htmk-section-y) 0}
.p-htmk-shikumi__lead{margin:26px 0 30px;text-align:center;
  font-size:clamp(16px,1.4vw,20px);font-weight:700;color:#1a1f2e;line-height:1.6}
.p-htmk-shikumi__panel{background:#fff;border-radius:var(--htmk-radius);box-shadow:var(--htmk-shadow);
  padding:36px}
.p-htmk-shikumi__items{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.p-htmk-shikumi__item{border-left:5px solid;border-radius:2px;padding-left:14px}
.p-htmk-shikumi__item.is-01{border-color:var(--htmk-blue)}
.p-htmk-shikumi__item.is-02{border-color:var(--htmk-purple)}
.p-htmk-shikumi__item.is-03{border-color:var(--htmk-red)}
.p-htmk-shikumi__item.is-04{border-color:var(--htmk-navy)}
.p-htmk-shikumi__num{font-size:14px;font-weight:700;line-height:1.2}
.p-htmk-shikumi__item.is-01 .p-htmk-shikumi__num{color:var(--htmk-blue)}
.p-htmk-shikumi__item.is-02 .p-htmk-shikumi__num{color:var(--htmk-purple)}
.p-htmk-shikumi__item.is-03 .p-htmk-shikumi__num{color:var(--htmk-red)}
.p-htmk-shikumi__item.is-04 .p-htmk-shikumi__num{color:var(--htmk-navy)}
.p-htmk-shikumi__item h4{margin:4px 0 6px;font-size:20px;font-weight:700;color:#1a1f2e;line-height:1.4}
.p-htmk-shikumi__item p{font-size:13px;line-height:1.68;color:var(--htmk-body)}
.p-htmk-shikumi__bar{height:8px;border-radius:4px;background:var(--htmk-grad);margin:28px 0}
.p-htmk-shikumi__statement{text-align:center;font-size:clamp(17px,1.55vw,22px);font-weight:700;color:#1a1f2e}
.p-htmk-shikumi__flowline{margin-top:8px;text-align:center;font-size:14px;color:#777}

/* ===== SYNERGY：協業ポジショニングマップ ===== */
.p-htmk-synergy{background:#fff;padding:var(--htmk-section-y) 0}
.p-htmk-chart-scroll{margin-top:30px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.p-htmk-chart{position:relative;min-width:1000px;max-width:1136px;height:460px;
  border:1.5px solid #e5e9f0;border-radius:var(--htmk-radius);background:#fff}
.p-htmk-chart__axis-x{position:absolute;left:9.7%;right:4%;bottom:73px;height:2.5px;background:var(--htmk-navy)}
.p-htmk-chart__axis-y{position:absolute;left:9.7%;top:60px;bottom:73px;width:2.5px;background:var(--htmk-navy)}
.p-htmk-chart__axislabel{position:absolute;font-size:15px;font-weight:700;line-height:1.4}
.p-htmk-chart__axislabel.is-y{left:11%;top:56px;color:var(--htmk-navy)}
.p-htmk-chart__axislabel.is-x{right:4.5%;bottom:24px;color:var(--htmk-blue)}
.p-htmk-chart__zone{position:absolute;left:65%;top:58px;width:31%;height:165px;
  background:#fbe9ef;border-radius:12px}
.p-htmk-chart__zonelabel{position:absolute;left:79%;top:112px;font-size:12px;font-weight:700;color:var(--htmk-red)}
.p-htmk-chart__node{position:absolute;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:14px;font-weight:700;box-shadow:0 5px 14px rgba(13,20,51,.18);text-align:center;line-height:1.3}
.p-htmk-chart__node.is-iij{left:15.8%;top:109px;width:92px;height:92px;background:var(--htmk-navy)}
.p-htmk-chart__node.is-hitamuki{left:48.8%;top:259px;width:92px;height:92px;background:var(--htmk-blue)}
.p-htmk-chart__node.is-goukei{left:68%;top:85px;width:110px;height:110px;
  background:linear-gradient(180deg,#d8063b 0%,#99082d 100%);font-size:16px}
.p-htmk-chart__tag{position:absolute}
.p-htmk-chart__tag dt{font-size:16px;font-weight:700;line-height:1.4}
.p-htmk-chart__tag dd{font-size:12px;color:#777;line-height:1.45}
.p-htmk-chart__tag.is-iij{left:25.4%;top:128px}
.p-htmk-chart__tag.is-iij dt{color:var(--htmk-navy)}
.p-htmk-chart__tag.is-hitamuki{left:58.4%;top:278px}
.p-htmk-chart__tag.is-hitamuki dt{color:var(--htmk-blue)}
.p-htmk-chart__tag.is-goukei{left:79.2%;top:166px}
.p-htmk-chart__tag.is-goukei dt{color:var(--htmk-red)}
.p-htmk-chart__arrow{position:absolute;left:28%;top:288px;width:396px;height:7px;border-radius:4px;
  background:var(--htmk-red);transform:rotate(-21deg);transform-origin:left center}
.p-htmk-chart__arrow::after{content:"";position:absolute;right:-24px;top:50%;transform:translateY(-50%);
  border-style:solid;border-width:14px 0 14px 26px;border-color:transparent transparent transparent var(--htmk-red)}
.p-htmk-chart__arrowlabel{position:absolute;left:35%;top:212px;font-size:15px;font-weight:700;color:var(--htmk-red);
  transform:rotate(-21deg)}
.p-htmk-synergy__copy{margin-top:34px;text-align:center;
  font-size:clamp(17px,1.7vw,24px);font-weight:700;color:#1a1f2e;line-height:1.6}

/* ===== 一体設計 ===== */
.p-htmk-ittai{background:var(--htmk-bg-gray);padding:var(--htmk-section-y) 0}
.p-htmk-ittai__panel{margin-top:30px;background:#fff;border-radius:var(--htmk-radius);
  box-shadow:var(--htmk-shadow);padding:36px 40px 40px}
.p-htmk-ittai__duo{display:flex;align-items:center;gap:24px}
.p-htmk-ittai__half{flex:1;display:flex;gap:14px}
.p-htmk-ittai__accent{width:6px;border-radius:3px;flex:none}
.p-htmk-ittai__accent.is-blue{background:var(--htmk-blue)}
.p-htmk-ittai__accent.is-red{background:var(--htmk-red)}
.p-htmk-ittai__eyebrow{font-size:13px;font-weight:700;line-height:1.4}
.p-htmk-ittai__eyebrow.is-blue{color:var(--htmk-blue)}
.p-htmk-ittai__eyebrow.is-red{color:var(--htmk-red)}
.p-htmk-ittai__half h4{margin-top:4px;font-size:clamp(18px,1.55vw,22px);font-weight:700;color:#1a1f2e;line-height:1.45}
.p-htmk-ittai__cross{font-size:32px;font-weight:900;color:var(--htmk-purple);flex:none}
.p-htmk-ittai__divider{height:1px;background:#e8eaf0;margin:26px 0}
.p-htmk-ittai__cols{display:flex;gap:44px}
.p-htmk-ittai__list{flex:1;min-width:0}
.p-htmk-ittai__list h4{font-size:20px;font-weight:700;color:#1a1f2e;line-height:1.5}
.p-htmk-ittai__list > p{margin-top:8px;font-size:13.5px;line-height:1.75;color:var(--htmk-body)}
.p-htmk-ittai__item{display:flex;align-items:center;gap:14px;margin-top:16px}
.p-htmk-ittai__num{width:36px;height:36px;flex:none;background:var(--htmk-red);color:#fff;border-radius:6px;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
.p-htmk-ittai__item h5{font-size:16px;font-weight:700;color:#1a1f2e;line-height:1.45}
.p-htmk-ittai__item p{font-size:13px;color:var(--htmk-body);line-height:1.5}
.p-htmk-ittai__visual{width:430px;flex:none}
.p-htmk-ittai__visual img{width:100%;height:252px;object-fit:cover;border-radius:12px}
.p-htmk-ittai__caption{margin-top:10px;text-align:center;font-size:12.5px;color:#777}

/* ===== CTA ===== */
.p-htmk-cta{background:var(--htmk-cta-bg);padding:56px var(--htmk-gutter) 64px;text-align:center}
.p-htmk-cta__title{color:#fff;font-size:clamp(19px,1.7vw,24px);font-weight:700;margin-bottom:28px;line-height:1.5}
.p-htmk-cta__button{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:min(570px,100%);height:85px;border-radius:42.5px;background:var(--htmk-grad-btn);
  color:#f2f2f2;font-size:clamp(17px,1.55vw,22px);font-weight:600;
  transition:opacity .25s ease}
.p-htmk-cta__button:hover{opacity:.85}
.p-htmk-cta__button::after{content:"";position:absolute;right:36px;top:50%;
  width:10px;height:10px;border-top:2.5px solid #fff;border-right:2.5px solid #fff;
  transform:translateY(-50%) rotate(45deg)}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(max-width:960px){
  :root{--htmk-section-y:64px}
  .p-htmk-challenge__cards{grid-template-columns:1fr;max-width:480px;margin:0 auto}
  .p-htmk-solution__partners{flex-direction:column}
  .p-htmk-solution__cross{align-self:center}
  .p-htmk-jinzai__groups{flex-direction:column}
  .p-htmk-jinzai__group.is-bansou{width:100%}
  .p-htmk-genba__panel{padding:28px 20px}
  .p-htmk-genba__flow{flex-direction:column;gap:14px}
  .p-htmk-genba__arrow{transform:rotate(90deg)}
  .p-htmk-genba__box.is-client,.p-htmk-genba__box.is-hitamuki,.p-htmk-genba__outcome{width:min(300px,100%)}
  .p-htmk-dx__grid{grid-template-columns:1fr}
  .p-htmk-guard__cards{flex-direction:column}
  .p-htmk-shikumi__items{grid-template-columns:1fr 1fr}
  .p-htmk-ittai__duo{flex-direction:column;align-items:flex-start;gap:14px}
  .p-htmk-ittai__cross{align-self:center}
  .p-htmk-ittai__cols{flex-direction:column;gap:28px}
  .p-htmk-ittai__visual{width:100%}
}
@media(max-width:560px){
  .p-htmk-hero{padding:62px 16px 40px;min-height:420px}
  .p-htmk-hero__panel{border-width:4px;padding:28px 18px 26px}
  .p-htmk-hero__title{font-size:clamp(17px,5vw,22px)}
  .p-htmk-challenge__lead br,.p-htmk-solution__lead br{display:none}
  .p-htmk-hero__logos{gap:12px;margin-bottom:18px}
  .p-htmk-hero__logos img{height:28px}
  .p-htmk-jinzai__groupbody{flex-direction:column}
  .p-htmk-shikumi__items{grid-template-columns:1fr;gap:18px}
  .p-htmk-shikumi__panel{padding:24px 20px}
  .p-htmk-guard__card{flex-direction:column;text-align:center;gap:12px}
  .p-htmk-dx__cell{flex-direction:column}
  .p-htmk-cta__button{height:64px}
  .p-htmk-cta__button::after{right:24px}
}