/* ===== 20_site.css ===== */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #ffffff; color: #101010; font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', Meiryo, sans-serif; overflow-x: clip; }
* { box-sizing: border-box; }
a { color: #101010; text-decoration: none; }
a:hover { color: #d8232a; }
h1, h2, h3, h4, h5, p, ul, dl, dd, dt { margin: 0; }
ul { list-style: none; padding: 0; }
img { max-width: 100%; display: block; }
:focus-visible { outline: 2px solid #d8232a; outline-offset: 3px; }
@keyframes arrowLoop { 0% { text-indent: 0; } 45% { text-indent: 160%; } 46% { text-indent: -160%; } 100% { text-indent: 0; } }
@media (min-width:900px){[data-cta-br]{display:none}}
@keyframes bgIn { from { background-size: 0% 100%; } to { background-size: 100% 100%; } }
[data-ink] span[style*="linear-gradient"] { background-size: 100% 100%; }
@keyframes charIn { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
@keyframes riseIn { from { opacity: 0; transform: translateX(-28px); } to { opacity: 1; transform: none; } }
@keyframes slideInLeft { from { opacity: 0; transform: translateX(-8%); } to { opacity: 1; transform: none; } }
@keyframes curtainWipe { 0% { transform: scaleX(0); transform-origin: left; } 46% { transform: scaleX(1); transform-origin: left; } 54% { transform: scaleX(1); transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } }
@keyframes countTick { from { opacity: 1; } to { opacity: 1; } }
@media (min-width:900px){[data-people-copy]{text-align:center}}
@keyframes wipeReveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@media (max-width: 700px) {
    [data-step-arrow] { transform: rotate(90deg); width: 100% !important; flex: 0 0 100% !important; }
    [data-step-row] > div:not([data-step-arrow]) { flex: 1 1 100% !important; min-width: 100% !important; }
  }
@keyframes revealClip { 0% { clip-path: inset(0 100% 0 0); transform: scale(1.1); } 100% { clip-path: inset(0 0 0 0); transform: scale(1); } }
@keyframes edgeRun { 0% { transform: translateX(-6%) scaleY(1); opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateX(100%) scaleY(1); opacity: 0; } }
/* 縦向き（ポートレート）：メイン画像は画面幅に合わせ、中央より少し上に配置（ヒーロー自体はフルスクリーン） */
  @media (orientation: portrait), (max-width: 980px) {
    section[aria-label="メインビジュアル"] { height: auto !important; min-height: 0 !important; background: #101010; display: flex; flex-direction: column; justify-content: flex-end; }
    section[aria-label="メインビジュアル"] img { background: #101010; }
    section[aria-label="メインビジュアル"] [data-stack="image"] { position: relative !important; inset: auto !important; width: 100%; aspect-ratio: 3 / 2; margin-top: 64px; }
    [data-hero-copy] h1 { font-size: clamp(26px, 8vw, 44px) !important; }
    [data-hero-copy] { position: relative !important; bottom: auto !important; padding-top: clamp(12px, 3vw, 20px) !important; padding-bottom: clamp(14px, 3.4vw, 24px) !important; background: #101010; }
    section[aria-label="メインビジュアル"] > span[aria-hidden="true"] { background: linear-gradient(to top, rgba(16,16,16,.9) 0%, rgba(16,16,16,.72) 34%, rgba(16,16,16,.2) 62%, rgba(16,16,16,0) 100%) !important; }
    section[aria-label="メインビジュアル"] img { left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover !important; transform: none !important; }
    section[aria-label="メインビジュアル"] > span[aria-hidden="true"] { display: none !important; }
  }
/* Numbers：モバイルは横2×縦3 */
  @media (max-width: 700px) { [data-numbers-grid] { grid-template-columns: repeat(2, minmax(0,1fr)) !important; grid-template-rows: repeat(3, auto) !important; } }
/* モバイルではボタンを中央配置＋左右位置を全セクションで揃える（列の余白を左右対称に） */
  @media (max-width: 700px) {
    section [style*="padding-left: clamp(16px, 2.2vw, 34px)"]:not(:has(img)):not(:has(img)) { padding-right: clamp(16px, 2.2vw, 34px) !important; }
    a[style*="width: min(100%, 320px)"] { width: min(100%, 320px) !important; margin-left: auto !important; margin-right: auto !important; }
  }
/* Message：縦並び時は画像を上に。モバイルは画像を横幅いっぱいに */
  @media (max-width: 700px) {
    [data-message-row] { padding-right: 0 !important; }
    [data-message-row] > div:last-child { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
  }
/* What We Do：縦並び時はテキストに左右の余白を確保（画像は全幅のまま） */
  @media (max-width: 1100px) {
    [data-work-row] { padding-right: 0 !important; }
    [data-work-copy] { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
  }
/* Works：モバイルは画像を画面幅いっぱい（左右余白なし） */
  @media (max-width: 700px) {
    [data-works-row] { padding-right: 0 !important; }
    [data-works-grid] { width: 100% !important; }
    [data-works-row] > div:last-child { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
  }
/* 電話番号のあとの改行はモバイルのみ */
  @media (min-width: 701px) { [data-tel-br] { display: none; } }
/* モバイルのフッターナビ：1列＝各項目を1行に（折り返しなし） */
  @media (max-width: 700px) {
    [data-footer-nav] { grid-template-columns: minmax(0, 1fr) !important; gap: 14px !important; }
    [data-footer-nav] a { white-space: nowrap !important; }
  }
/* 縦表示：画像は左右余白なしで画面幅いっぱい（テキストのみ左右余白） */
  @media (orientation: portrait), (max-width: 980px) {
    [data-message-row], [data-work-row], [data-works-row] { padding-left: 0 !important; padding-right: 0 !important; }
    [data-message-img], [data-works-grid] { width: 100% !important; }
    [data-message-row] > div:last-child, [data-works-row] > div:last-child, [data-work-copy] { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
  }
/* タブレット横：Our Values / Career / Recruitment のカードは横2×縦2 */
  @media (orientation: landscape) and (min-width: 701px) and (max-width: 1200px) {
    [data-cards-2x2] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  }
/* 中間幅ではヘッダーナビを詰めて、PCレイアウトを保つ */
  [data-desktop-nav] [data-menu]:last-of-type [data-panel] { left: auto !important; right: -8px !important; }
@media (max-width: 1400px) {
    [data-desktop-nav] { gap: 15px !important; padding-left: 8px !important; padding-right: 2px !important; }
    [data-desktop-nav] a { font-size: 14.5px !important; }
    [data-desktop-cta] a { min-width: 118px !important; font-size: 14.5px !important; padding: 0 14px !important; }
  }
@media (max-width: 1240px) {
    [data-desktop-nav] { gap: 12px !important; }
    [data-desktop-nav] a { font-size: 13.5px !important; letter-spacing: .01em !important; }
    [data-desktop-cta] a { min-width: 108px !important; font-size: 13.5px !important; padding: 0 12px !important; }
  }
@media (max-width: 1080px) {
    [data-desktop-nav] { gap: 10px !important; padding-left: 4px !important; }
    [data-desktop-nav] a { font-size: 13.5px !important; letter-spacing: 0 !important; }
    [data-desktop-cta] a { min-width: 92px !important; font-size: 13.5px !important; letter-spacing: .02em !important; padding: 0 10px !important; }
  }
@media (max-width: 940px) {
    [data-desktop-nav] { gap: 6px !important; padding-left: 2px !important; }
    [data-desktop-nav] a { font-size: 13px !important; }
    [data-desktop-cta] a { min-width: 84px !important; font-size: 13px !important; padding: 0 8px !important; }
    [data-logo] img { height: 30px !important; }
  }
@media (prefers-reduced-motion: reduce) { * { animation-duration: .001ms !important; transition-duration: .001ms !important; } }
h1, h2, h3, h4, h5, p, ul, ol, dl, dd, dt { margin: 0; }
ul, ol { list-style: none; padding: 0; }
span.line-chunk { display: inline-block; overflow-wrap: anywhere; word-break: normal; }
/* 縦表示：画像は左右余白なしで画面幅いっぱい（テキストは左右余白を確保） */
  @media (orientation: portrait), (max-width: 980px) {
    section > div[style*="padding-right: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-right:clamp(16px,2.2vw,34px)"] { padding-right: 0 !important; }
    section > div[style*="padding-left: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-left:clamp(16px,2.2vw,34px)"] { padding-left: 0 !important; }
    section > div > div:not(:has(img)):not(:has(img)) { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
    /* 縦表示：単独配置の画像は画面幅いっぱい（左右2カラムの分割レイアウトは対象外） */
    /* セクション側に左右余白がある場合：ネガティブマージンで全幅に */
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img) {
      margin-left: calc(-1 * clamp(16px,2.2vw,34px)) !important;
      margin-right: calc(-1 * clamp(16px,2.2vw,34px)) !important;
    }
    /* 画像ラッパー自身に左右余白がある場合：余白を消すだけ */
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> div > img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> div > img),
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> img) {
      padding-left: 0 !important; padding-right: 0 !important;
    }
  }
@media (max-width: 600px) { [data-num-cards] { grid-template-columns: minmax(0,1fr) !important; } }
/* Numbers：タブレットは横2×縦3／スマホは1列 */
  @media (max-width: 900px) { [data-numbers-grid] { grid-template-columns: repeat(2, minmax(0,1fr)) !important; grid-template-rows: repeat(3, auto) !important; } }
@media (max-width: 600px) { [data-numbers-grid] { grid-template-columns: minmax(0,1fr) !important; grid-template-rows: repeat(6, auto) !important; } }
/* 縦表示：画像は左右余白なしで画面幅いっぱい（テキストは左右余白を確保） */
  @media (orientation: portrait), (max-width: 980px) {
    section > div[style*="padding-right: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-right:clamp(16px,2.2vw,34px)"] { padding-right: 0 !important; }
    section > div[style*="padding-left: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-left:clamp(16px,2.2vw,34px)"] { padding-left: 0 !important; }
    section > div > div:not(:has(img)):not(:has(img)):not([data-numbers-grid]) { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
    /* 縦表示：単独配置の画像は画面幅いっぱい（左右2カラムの分割レイアウトは対象外） */
    /* セクション側に左右余白がある場合：ネガティブマージンで全幅に */
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img) {
      margin-left: calc(-1 * clamp(16px,2.2vw,34px)) !important;
      margin-right: calc(-1 * clamp(16px,2.2vw,34px)) !important;
    }
    /* 画像ラッパー自身に左右余白がある場合：余白を消すだけ */
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> div > img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> div > img),
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> img) {
      padding-left: 0 !important; padding-right: 0 !important;
    }
  }
@media (min-width: 900px) { [data-msg-grid] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important; } }
[data-msg-grid] > div { padding-left: 0 !important; padding-right: 0 !important; }
/* 縦表示：画像は左右余白なしで画面幅いっぱい（テキストは左右余白を確保） */
  @media (orientation: portrait), (max-width: 980px) {
    section > div[style*="padding-right: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-right:clamp(16px,2.2vw,34px)"] { padding-right: 0 !important; }
    section > div[style*="padding-left: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-left:clamp(16px,2.2vw,34px)"] { padding-left: 0 !important; }
    section > div > div:not(:has(img)):not(:has(img)) { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
    /* 縦表示：単独配置の画像は画面幅いっぱい（左右2カラムの分割レイアウトは対象外） */
    /* セクション側に左右余白がある場合：ネガティブマージンで全幅に */
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img) {
      margin-left: calc(-1 * clamp(16px,2.2vw,34px)) !important;
      margin-right: calc(-1 * clamp(16px,2.2vw,34px)) !important;
    }
    /* 画像ラッパー自身に左右余白がある場合：余白を消すだけ */
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> div > img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> div > img),
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> img) {
      padding-left: 0 !important; padding-right: 0 !important;
    }
    section[data-flow-section] { padding-left: 0 !important; padding-right: 0 !important; }
    [data-flow-text] { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
  }
/* 縦表示：画像は左右余白なしで画面幅いっぱい（テキストは左右余白を確保） */
  @media (orientation: portrait), (max-width: 980px) {
    section > div[style*="padding-right: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-right:clamp(16px,2.2vw,34px)"] { padding-right: 0 !important; }
    section > div[style*="padding-left: clamp(16px, 2.2vw, 34px)"],
    section > div[style*="padding-left:clamp(16px,2.2vw,34px)"] { padding-left: 0 !important; }
    section > div > div:not(:has(img)):not(:has(img)) { padding-left: clamp(16px,2.2vw,34px) !important; padding-right: clamp(16px,2.2vw,34px) !important; }
    /* 縦表示：単独配置の画像は画面幅いっぱい（左右2カラムの分割レイアウトは対象外） */
    /* セクション側に左右余白がある場合：ネガティブマージンで全幅に */
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> img),
    section[style*="clamp(16px, 2.2vw, 34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img),
    section[style*="clamp(16px,2.2vw,34px)"] > div:not([style*="clamp(16px, 2.2vw, 34px)"]):not([style*="clamp(16px,2.2vw,34px)"]):has(> div > img) {
      margin-left: calc(-1 * clamp(16px,2.2vw,34px)) !important;
      margin-right: calc(-1 * clamp(16px,2.2vw,34px)) !important;
    }
    /* 画像ラッパー自身に左右余白がある場合：余白を消すだけ */
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> div > img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> div > img),
    section > div[style*="clamp(16px, 2.2vw, 34px)"]:has(> img),
    section > div[style*="clamp(16px,2.2vw,34px)"]:has(> img) {
      padding-left: 0 !important; padding-right: 0 !important;
    }
    /* 縦表示：画像が先に来る行は画像を上に（テキストの上に画像） */
    section > div[style*="wrap-reverse"][style*="padding-right"] { flex-wrap: wrap !important; }
  }
@media (min-width: 900px) { [data-msg-grid] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important; align-items: center !important; } }

/* ===== style-hover 属性（dc-runtime）から起こしたホバー ===== */
.aish1:hover{color:#d8232a;background:#f7f6f4}
.aish2:hover{background:#b81c22;color:#ffffff}
.aish3:hover{color:#d8232a}
.aish4:hover{background:#101010;color:#ffffff;animation:arrowLoop .55s ease-in-out}
.aish5:hover{background:#ffffff;color:#d8232a;animation:arrowLoop .55s ease-in-out}
.aish6:hover{border-color:#d8232a;color:#101010}
.aish7:hover{background:#d8232a;color:#ffffff;animation:arrowLoop .55s ease-in-out}
.aish8:hover{background:#ffffff;color:rgb(28 197 82);animation:arrowLoop .55s ease-in-out}
.aish9:hover{color:#ffffff}
.aish10:hover{color:#101010}
.aish11:hover{background:#d8232a;border-color:#d8232a;color:#ffffff}


/* ===== 21_add.css ===== */
/* === add.css 貼り付け ここから === */
/* 株式会社AI-STYLE TOPページ 動的セクション用（白ベース／差し色 黒・赤） */

:root {
  --ais-black: #101010;
  --ais-red: #d8232a;
  --ais-gray: #7a7a7a;
  --ais-bg: #f5f4f2;
  --ais-line: #e2e2e2;
}

/* ------------------------------------------------------------------
   1. 新着情報（NEWS帯） design-parts-52 系
   ------------------------------------------------------------------ */
section[class*="design-parts-52"] {
  background: var(--ais-black) !important;
  padding: 0 !important;
  border: 0 !important;
}
section[class*="design-parts-52"].bg-color {
  background: var(--ais-black) !important;
}
section[class*="design-parts-52"] .container {
  max-width: none !important;
  width: 100% !important;
  padding: 0 clamp(16px, 2.2vw, 34px) !important;
}
section[class*="design-parts-52"] .content {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: clamp(12px, 2vw, 28px) !important;
  min-height: 60px !important;
  margin: 0 !important;
  max-width: none !important;
}
section[class*="design-parts-52"] h4.banner-area {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--ais-red) !important;
  color: #fff !important;
  font-family: 'Jost', 'Noto Sans JP', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: .28em !important;
  height: 32px !important;
  padding: 0 20px !important;
  margin: 0 !important;
  border-radius: 0 !important;
  white-space: nowrap !important;
}
section[class*="design-parts-52"] ul {
  flex: 1 1 260px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
section[class*="design-parts-52"] li { margin: 0 !important; }
section[class*="design-parts-52"] li a {
  display: flex !important;
  align-items: center !important;
  min-height: 60px !important;
  color: #fff !important;
  text-decoration: none !important;
}
section[class*="design-parts-52"] li a:hover { opacity: .7; }
section[class*="design-parts-52"] .parts-52-textarea {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 6px clamp(14px, 2vw, 28px) !important;
}
section[class*="design-parts-52"] .parts-52-textarea .date {
  font-family: 'Jost', 'Noto Sans JP', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: .1em !important;
  color: #a8a8a8 !important;
}
section[class*="design-parts-52"] .parts-52-textarea .d-inline-block {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #fff !important;
}
@media (min-width: 992px) {
  section[class*="design-parts-52"] .content { flex-wrap: nowrap !important; }
  section[class*="design-parts-52"] .parts-52-textarea { flex-wrap: nowrap !important; }
}

/* ------------------------------------------------------------------
   2. 記事カード（3列カードグリッド） parts131415_blog 系
   ------------------------------------------------------------------ */
section[class*="parts131415_blog"] {
  background: var(--ais-bg) !important;
  background-image: none !important; /* 元サイト固有の背景画像を打ち消す */
  padding: clamp(72px, 9vw, 140px) clamp(16px, 2.2vw, 34px) !important;
}
section[class*="parts131415_blog"] .container-lg {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
}
section[class*="parts131415_blog"] .parts131415_blog_title_wrap {
  text-align: left !important;
  margin: 0 0 clamp(32px, 4vw, 56px) !important;
}
section[class*="parts131415_blog"] .parts131415_blog_title_wrap h2 {
  font-family: 'Jost', 'Noto Sans JP', sans-serif !important;
  font-size: clamp(38px, 5.2vw, 72px) !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: var(--ais-black) !important; /* 元パーツの #ffffff を上書き */
  margin: 0 !important;
}
section[class*="parts131415_blog"] .parts131415_blog_title_wrap p {
  font-size: 12px !important;
  letter-spacing: .2em !important;
  color: var(--ais-gray) !important;
  margin: 12px 0 0 !important;
}
section[class*="parts131415_blog"] .row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(10px, 1.2vw, 18px) !important;
  margin: 0 !important;
}
section[class*="parts131415_blog"] .col {
  width: 100% !important;
  padding: 0 !important;
}
section[class*="parts131415_blog"] .card {
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 100% !important;
}
section[class*="parts131415_blog"] .card-body {
  padding: clamp(18px, 1.8vw, 26px) !important;
}
section[class*="parts131415_blog"] h5.card-title {
  font-family: 'Jost', 'Noto Sans JP', sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  color: var(--ais-red) !important;
  text-align: left !important;
  margin: 0 !important;
}
section[class*="parts131415_blog"] .card-body a {
  display: block !important;
  margin-top: 12px !important;
  text-decoration: none !important;
  color: var(--ais-black) !important;
}
section[class*="parts131415_blog"] p.card-text {
  font-size: clamp(17px, 1.5vw, 20px) !important;
  font-weight: 500 !important;
  line-height: 1.8 !important;
  color: var(--ais-black) !important;
  margin: 0 !important;
}
section[class*="parts131415_blog"] .parts131415_blog_thumbnail {
  margin-top: 14px !important;
  overflow: hidden !important;
}
section[class*="parts131415_blog"] .parts131415_blog_thumbnail img {
  width: 100% !important;
  height: 205px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform .5s ease;
}
section[class*="parts131415_blog"] .card-body a:hover .parts131415_blog_thumbnail img {
  transform: scale(1.04);
}
@media (min-width: 576px) {
  section[class*="parts131415_blog"] .row { grid-template-columns: repeat(2, 1fr) !important; }
  section[class*="parts131415_blog"] .parts131415_blog_thumbnail img { height: 215px !important; }
}
@media (min-width: 992px) {
  section[class*="parts131415_blog"] .row { grid-template-columns: repeat(3, 1fr) !important; }
  section[class*="parts131415_blog"] .parts131415_blog_thumbnail img { height: 240px !important; }
}
@media (prefers-reduced-motion: reduce) {
  section[class*="parts131415_blog"] .parts131415_blog_thumbnail img { transition: none !important; }
}

/* ------------------------------------------------------------------
   3. 施工実績一覧 parts228 系（PC3列／タブレット2列／スマホ1列）
   ------------------------------------------------------------------ */
.parts228_section { padding: 0 var(--ais-gutter, clamp(16px,2.2vw,34px)) clamp(72px,9vw,140px) !important; background: #fff !important; }
.parts228_post_list { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: clamp(20px,2.4vw,36px) !important; }
@media (min-width: 640px) { .parts228_post_list { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (min-width: 1024px) { .parts228_post_list { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
.parts228_post_wrap { background: #fff !important; }
.parts228_post_img { width: 100% !important; aspect-ratio: 4 / 3 !important; overflow: hidden !important; }
.parts228_post_img a, .parts228_post_img img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
.parts-blog-ex-tag_wrap { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 14px !important; }
.parts-blog-ex_tag { display: inline-block !important; font-size: 11.5px !important; letter-spacing: .1em !important; color: #fff !important; background: #d8232a !important; padding: 5px 12px !important; border-radius: 0 !important; }
.parts228_post_status { margin-top: 12px !important; }
.parts228_post_date { font-family: 'Jost', sans-serif !important; font-size: 12.5px !important; letter-spacing: .1em !important; color: #8a8a8a !important; }
.parts228_post_title { font-size: clamp(16px,1.5vw,19px) !important; font-weight: 500 !important; line-height: 1.75 !important; margin-top: 6px !important; }
.parts228_pagenation { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: center !important; gap: 8px !important; margin-top: clamp(36px,4vw,64px) !important; }
.parts228_pagenation a, .parts222_pagenation a { display: flex !important; align-items: center !important; justify-content: center !important; min-width: 44px !important; min-height: 44px !important; padding: 0 14px !important; border: 1px solid #d9d9d9 !important; border-radius: 0 !important; font-family: 'Jost', sans-serif !important; font-size: 13px !important; color: #101010 !important; background: #fff !important; }
.parts228_pagenation .pagination_num.current, .parts222_pagenation .pagination_num.current { background: #101010 !important; border-color: #101010 !important; color: #fff !important; }

/* ------------------------------------------------------------------
   4. お知らせ一覧 parts222 系（本文＋サイドバー）
   ------------------------------------------------------------------ */
.parts222_section { padding: 0 var(--ais-gutter, clamp(16px,2.2vw,34px)) clamp(72px,9vw,140px) !important; background: #fff !important; }
.parts222_wrap { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: clamp(28px,3.5vw,56px) !important; }
.parts222_main { flex: 1 1 560px !important; min-width: min(100%, 280px) !important; }
.parts222_sidebar { flex: 0 1 320px !important; min-width: min(100%, 260px) !important; }
.parts222_post_list { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: clamp(18px,2.2vw,32px) !important; }
@media (min-width: 640px) { .parts222_post_list { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
.parts222_post_wrap { background: #fff !important; border: 1px solid #e2e2e2 !important; border-radius: 0 !important; box-shadow: none !important; }
.parts222_post_img { width: 100% !important; aspect-ratio: 16 / 9 !important; overflow: hidden !important; }
.parts222_post_img img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.parts222_post_status { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px !important; }
.parts222_post_date { font-family: 'Jost', sans-serif !important; font-size: 12.5px !important; letter-spacing: .1em !important; color: #8a8a8a !important; }
.parts222_post_category { font-size: 11.5px !important; letter-spacing: .1em !important; color: #fff !important; background: #d8232a !important; padding: 5px 12px !important; }
.parts222_post_title { font-size: clamp(16px,1.5vw,19px) !important; font-weight: 500 !important; line-height: 1.75 !important; }
.parts222_post_excerpt { display: none !important; }
.parts222_sidebar_wrap h3 { font-size: 12px !important; letter-spacing: .18em !important; color: #fff !important; background: #101010 !important; padding: 14px 16px !important; }
.parts222_sidebar_wrap li { border-bottom: 1px solid #e2e2e2 !important; }
.parts222_sidebar_wrap li a { display: block !important; padding: 14px 4px !important; color: #101010 !important; }
.parts222_sidebar_date { display: block !important; font-family: 'Jost', sans-serif !important; font-size: 12px !important; letter-spacing: .1em !important; color: #8a8a8a !important; }
.parts222_sidebar_post_title { font-size: 15px !important; line-height: 1.75 !important; margin-top: 4px !important; }
.parts222_sidebar_wrap.category_post_count li a { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; }
.parts222_sidebar_post_category_count { font-family: 'Jost', sans-serif !important; font-size: 12px !important; border: 1px solid #d9d9d9 !important; padding: 2px 10px !important; }

/* ------------------------------------------------------------------
   5. お問い合わせフォーム parts213 系（装飾なしフラット）
   ------------------------------------------------------------------ */
.contact_section { background: #fff !important; padding: 0 var(--ais-gutter, clamp(16px,2.2vw,34px)) clamp(72px,9vw,140px) !important; border: 0 !important; box-shadow: none !important; }
.parts213_section_form, .parts213_form_wrap, .parts219_section_form, .parts219_form_wrap { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; max-width: 820px !important; }
.parts213_form_wrap dl, .parts219_form_wrap dl { display: flex !important; flex-wrap: wrap !important; gap: 6px 24px !important; padding: clamp(14px,1.6vw,20px) 0 !important; border: 0 !important; background: transparent !important; }
.parts213_form_wrap dt, .parts219_form_wrap dt { flex: 0 0 clamp(150px,20vw,260px) !important; min-width: min(100%,150px) !important; display: flex !important; flex-wrap: wrap !important; align-items: baseline !important; gap: 8px !important; font-size: clamp(15px,1.35vw,17px) !important; font-weight: 500 !important; line-height: 1.7 !important; padding-top: 8px !important; background: transparent !important; }
.parts213_form_wrap dd, .parts219_form_wrap dd { flex: 1 1 320px !important; min-width: min(100%,240px) !important; }
.parts213_form_wrap input[type="text"], .parts213_form_wrap input[type="email"], .parts213_form_wrap input[type="tel"], .parts213_form_wrap textarea,
.parts219_form_wrap input[type="text"], .parts219_form_wrap input[type="email"], .parts219_form_wrap input[type="tel"], .parts219_form_wrap textarea {
  width: 100% !important; min-height: 48px !important; font-family: inherit !important; font-size: 16px !important; color: #101010 !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid #c9c9c9 !important; border-radius: 0 !important; box-shadow: none !important; padding: 10px 2px !important;
}
.parts213_form_wrap textarea, .parts219_form_wrap textarea { min-height: 180px !important; line-height: 1.9 !important; resize: vertical !important; }
.parts213_form_wrap .required, .parts219_form_wrap .required { font-size: 11.5px !important; letter-spacing: .08em !important; color: #d8232a !important; background: transparent !important; padding: 0 !important; }
.parts213_form_wrap .attention, .parts219_form_wrap .attention { display: block !important; font-size: 12.5px !important; font-weight: 400 !important; line-height: 1.8 !important; color: #d8232a !important; margin-top: 6px !important; }
.parts213_form_wrap .error, .parts219_form_wrap .error { font-size: 13px !important; color: #d8232a !important; margin-top: 6px !important; }
.parts213_form_wrap label, .parts219_form_wrap label { display: flex !important; align-items: center !important; gap: 8px !important; min-height: 44px !important; font-size: clamp(15px,1.35vw,17px) !important; }
.contact_submit { margin-top: clamp(28px,3vw,44px) !important; }
.contact_submit input[type="submit"] { width: min(100%,320px) !important; min-height: 56px !important; font-family: inherit !important; font-size: 15px !important; letter-spacing: .08em !important; color: #fff !important; background: #101010 !important; border: 0 !important; border-radius: 0 !important; cursor: pointer !important; }
.contact_submit input[type="submit"]:hover { background: #d8232a !important; }

/* 導入文 parts210 系 */
.parts210_section_content { background: #fff !important; }

/* === add.css 貼り付け ここまで === */


/* ===== 50_override.css ===== */
/* 株式会社AI-STYLE — 追加打ち消し（案件固有）
   ※ cuezilla-skin.css は不採用（cz-judgment §3）。受領同梱の add.css が
      design-parts-52 / parts131415_blog / parts222 / parts228 / parts213・219 / parts210 を
      !important で自前フルstyle しているため、skin を重ねると add.css を上書きして崩れる。 */

/* 1. CueZilla 自動パンくずを非表示（受領デザインが下層ヘッダー内に自前パンくずを持つ・R-10a） */
.parts231_breadcrumb,
[class*="_breadcrumb"],
.p-breadcrumb { display: none !important; }

/* 2. sticky ヘッダー対策：テーマ既定の body{overflow-x:hidden} は position:sticky を殺す */
html, body { overflow-x: clip !important; }

/* 2b. sticky ヘッダーがスクロール途中で解除される対策（2026-08-19 実機DOM調査で原因確定）
   テーマCSS（別オリジン cdn.cuezilla-cms.com のため cssRules 走査では出てこない）が html,body に
   height:100%（=ビューポート1画面分・実測約911px）を与えており、sticky ヘッダーの包含ブロック（=body）が
   1画面分の高さしか無いため、それを超えてスクロールすると固定が外れてヘッダーが一緒に流れて消える
   （=「メニューが途中で消える」）。body を全コンテンツ高さまで伸ばすと最後まで固定される。
   高さのみの変更なので通常フローは不変＝TOPのFV margin-top:-64px 潜り込み設計（申し送り⑦）にも影響しない。
   min-height はテーマ height:100% が担保していた「短いページでも最低1画面」を維持するため
   （確認/完了/404 等のシステムページが縦に詰まって背景が途切れるのを防ぐ）。html を auto にすると
   body の min-height:% は解決できないので % ではなく dvh/vh で書く。
   教訓: 70_運用ルール/教訓メモリ/cuezilla-theme-html-body-height-100-kills-sticky.md ほか。 */
html, body { height: auto !important; }
body { min-height: 100vh; min-height: 100dvh; }

/* 3. CueZilla が描画する一覧・記事本文の画像が枠を割らないように（保険） */
[class*="parts"] img { max-width: 100%; height: auto; }

/* 4. フッターのTEL／FAX番号
   decompose が素の番号を tel: リンク化した分は色指定を持たないため、site.css の
   a{color:#101010} が効き、フッター背景（#101010）と同化して見えなくなる。
   周囲のテキスト（親 p の color:#a8a8a8）と同じ色に揃える。
   ※他ページの tel: リンクは明色地なので対象外（footer 限定スコープ）。 */
footer a[href^="tel:"] { color: #a8a8a8; }


/* ===== 60_追補-20260818.css ===== */
/* KEEP: 2026-08-18 に別セッション（他スタッフのClaude Code）が実機の崩れを見て
   18_site.combined.css へ直接追記したCSS。経緯を知らないセッションが「不要」と判断して
   消さないよう、ここに正本として保存しKEEPで囲む（CLAUDE.md 共有ファイル編集ルール4）。
   触るときは必ず追記者に確認する。convert が結合するので納品CSSには自動で入る。 */
/* 追記 */
/* 全体 */
.parts231_breadcrumb {
    display:none !important;
}
/* 施工実績*/
.parts228_post_wrap {
    max-width: 100% !important;
}
.parts228_post_wrap:nth-last-child(-n+3) {
    margin-bottom: 45px !important;
}
.parts-blog-ex-single-wrap .parts-blog-ex_gallery-slider .gallery-blog-ex {
    background: #FFFFFF !important;
}
.parts228_post_wrap .parts228_post_img {
    height: auto !important;
}
@media screen and (min-width: 992px) and (max-width: 1260px) {
.parts228_post_wrap .parts228_post_img img {
    max-height: unset !important;
    height: 200px !important;
}
}

/* ブログ */
.parts222_sidebar {
    max-width: none !important;
}
.parts222_post_wrap {
    max-width: 100% !important;
}
.parts222_post_status {
    padding: 0 20px !important;
    justify-content: left !important;
}
.parts222_post_title-excerpt {
    padding: 0 20px !important;
}
/* /KEEP */