/* ===== site.css ===== */
/* ===== style block 1 ===== */
.sh-nav-underline{background-image:linear-gradient(#C8102E,#C8102E);background-repeat:no-repeat;background-position:left 100%;background-size:0% 2px;transition:background-size .35s ease,color .3s;}
  .sh-nav-underline:hover{background-size:100% 2px;}
  .sh-desk{display:flex;}
  .sh-burger{display:none;}
  @media(max-width:940px){.sh-desk{display:none!important;}.sh-burger{display:flex!important;}}

/* ===== style block 2 ===== */
.sf-nav-underline{background-image:linear-gradient(#C8102E,#C8102E);background-repeat:no-repeat;background-position:left 100%;background-size:0% 2px;transition:background-size .35s ease,color .3s;}
  .sf-nav-underline:hover{background-size:100% 2px;}
  .sf-nav{display:flex;flex-direction:column;gap:13px;}
  @media(min-width:768px){.sf-nav{display:grid;grid-template-rows:repeat(4,auto);grid-auto-flow:column;column-gap:48px;row-gap:13px;}}
  @media(max-width:480px){.sf-company{text-align:center;}.sf-company>div{justify-content:center;}.sf-nav{align-items:center;}}

/* ===== style block 3 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  @keyframes sweepIn{0%{transform:translateX(-130%) skewX(-14deg);opacity:0;}100%{transform:translateX(0) skewX(-14deg);opacity:.9;}}
  @keyframes growFromRight{from{transform:skewX(-14deg) scaleX(0);}to{transform:skewX(-14deg) scaleX(1);}}  @keyframes scrollDot{0%{transform:translateY(-6px);opacity:0;}40%{opacity:1;}100%{transform:translateY(14px);opacity:0;}}
  @keyframes rollerWipe{from{-webkit-mask-position:100% 0;mask-position:100% 0;transform:translateX(-12px);}to{-webkit-mask-position:0% 0;mask-position:0% 0;transform:none;}}
  .hero-wipe{-webkit-mask-image:linear-gradient(90deg,#000 50%,rgba(0,0,0,0) 50%);mask-image:linear-gradient(90deg,#000 50%,rgba(0,0,0,0) 50%);-webkit-mask-size:202% 100%;mask-size:202% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:100% 0;mask-position:100% 0;transform:translateX(-12px);transition:-webkit-mask-position 1.05s cubic-bezier(.76,0,.24,1),mask-position 1.05s cubic-bezier(.76,0,.24,1),transform 1.1s cubic-bezier(.76,0,.24,1);}
  .hero-wipe.revealed{-webkit-mask-position:0% 0;mask-position:0% 0;transform:none;}
  @media(min-width:941px){.hero-h1 br{display:none;}}
  @media(max-width:680px){.svc-row2 > div:last-child{order:-1;}}
  @media(max-width:600px){.whyus-grid{grid-template-columns:1fr!important;}}
  @media(max-width:680px){.works-desktop{display:none!important;}.works-mobile{display:flex!important;}}
  @media(max-width:520px){
    .hero-sub{font-size:12px!important;letter-spacing:.04em!important;white-space:nowrap;margin-top:20px!important;}
    .hero-btn{font-size:16px!important;padding:13px 22px!important;min-width:0!important;flex:1 1 auto;}
    .hero-cta{gap:10px!important;margin-top:8px!important;}
    #hero-copy{padding-bottom:127px!important;}
    .hero-eyebrow-txt{font-size:14px!important;}
  }
  @media(min-width:768px){.recruit-h2 br{display:none;}}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .sec-accent.dark{background:#0E0E0E;}
  .flow-arrow{position:absolute;top:50%;right:-22px;transform:translateY(-50%);font-family:'Oswald',sans-serif;font-size:36px;color:#C8102E;z-index:3;pointer-events:none;}
  .flow-card:last-child .flow-arrow{display:none;}
  @media(max-width:760px){.flow-arrow{display:none;}}
  .flow-card{height:100%;display:flex;flex-direction:column;}
  .flow-card .flow-card-inner{flex:1;}
  .flow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(16px,2vw,24px);}
  @media(max-width:760px){.flow-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:480px){
    .concept-bg,.concept-overlay{width:100%!important;height:55%!important;-webkit-mask-image:linear-gradient(to bottom,#000 45%,transparent)!important;mask-image:linear-gradient(to bottom,#000 45%,transparent)!important;}
    .footer-company{text-align:center;}
    .footer-company>div{justify-content:center;}
    .footer-nav{align-items:center;}
    .works-link{margin-left:auto;}
    .hero-cta .hero-btn{flex:1 1 0;min-width:0!important;}
    .flow-grid{grid-template-columns:1fr;gap:34px;}
    .flow-card .flow-card-inner{padding-left:34px;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:14px;}
    .flow-card .flow-title{margin-top:0!important;}
    .flow-card .flow-sub{margin-top:0!important;}
    .flow-card .flow-bar{top:0!important;left:0!important;width:3px!important;height:100%!important;}
    .flow-arrow{display:block!important;top:auto!important;bottom:-34px!important;left:50%!important;right:auto!important;transform:translateX(-50%) rotate(90deg)!important;}
    .flow-card:last-child .flow-arrow{display:none!important;}
  }
  .desk-only{display:flex;}
  .burger{display:none;}
  @media(max-width:940px){
    .desk-only{display:none!important;}
    .burger{display:flex!important;}
  }
  .footer-nav{display:flex;flex-direction:column;gap:13px;}
  .nav-underline{background-image:linear-gradient(#C8102E,#C8102E);background-repeat:no-repeat;background-position:left 100%;background-size:0% 2px;transition:background-size .35s ease,color .3s;}
  .nav-underline:hover{background-size:100% 2px;}
  .arrow-link{transition:transform .32s cubic-bezier(.65,0,.25,1);padding-right:6px;}
  .arrow-link:hover{transform:translateX(4px)!important;}
  .arrow-link span:last-child{transition:transform .32s cubic-bezier(.65,0,.25,1);display:inline-block;overflow:visible;}
  .arrow-link:hover span:last-child{transform:translateX(2px);}
  @media(min-width:768px){
    .footer-nav{display:grid;grid-template-rows:repeat(4,auto);grid-auto-flow:column;column-gap:48px;row-gap:13px;}
  }

/* ===== style block 4 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .sec-accent.dark{background:#0E0E0E;}
  .arrow-link{transition:transform .32s cubic-bezier(.65,0,.25,1);padding-right:6px;}
  .arrow-link:hover{transform:translateX(4px)!important;}
  .flow-arrow{position:absolute;top:50%;right:-22px;transform:translateY(-50%);font-family:'Oswald',sans-serif;font-size:36px;color:#C8102E;z-index:3;pointer-events:none;}
  .flow-card:last-child .flow-arrow{display:none;}
  @media(max-width:760px){.flow-arrow{display:none;}}
  .flow-card{height:100%;display:flex;flex-direction:column;}
  .flow-card .flow-card-inner{flex:1;}
  .flow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(16px,2vw,24px);}
  @media(max-width:760px){.flow-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:480px){
    .flow-grid{grid-template-columns:1fr;gap:34px;}
    .flow-card .flow-card-inner{padding-left:34px;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:14px;}
    .flow-card .flow-title{margin-top:0!important;}
    .flow-card .flow-sub{margin-top:0!important;}
    .flow-card .flow-bar{top:0!important;left:0!important;width:3px!important;height:100%!important;}
    .flow-arrow{display:block!important;top:auto!important;bottom:-34px!important;left:50%!important;right:auto!important;transform:translateX(-50%) rotate(90deg)!important;}
    .flow-card:last-child .flow-arrow{display:none!important;}
  }
  @media(max-width:680px){.svc-row2 > div:last-child{order:-1;}}

/* ===== style block 5 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .sec-accent.dark{background:#0E0E0E;}
  .arrow-link{transition:transform .32s cubic-bezier(.65,0,.25,1);padding-right:6px;}
  .arrow-link:hover{transform:translateX(4px)!important;}

/* ===== style block 6 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(255,255,255,.08);}
  @media(max-width:880px){.works-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:520px){.works-grid{grid-template-columns:1fr;}}

/* ===== style block 7 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#fff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .rc-row{display:grid;grid-template-columns:200px 1fr;border-bottom:1px solid #E4E4E2;}
  @media(max-width:560px){.rc-row{grid-template-columns:1fr;}}
  .rc-faq summary{list-style:none;cursor:pointer;}
  .rc-faq summary::-webkit-details-marker{display:none;}
  .rc-faq[open] .rc-faq-plus{transform:rotate(45deg);}
  @media(max-width:520px){
    .rc-hero-cta{gap:10px!important;}
    .rc-hero-btn{font-size:16px!important;padding:13px 18px!important;min-width:0!important;flex:1 1 auto;}
  }
  @media(max-width:720px){.rc-welcome-grid > div:last-child{order:-1;}}
  @media(max-width:520px){.rc-entry-cta{gap:12px!important;}.rc-entry-cta .rc-entry-btn{flex:1 1 100%!important;min-width:0!important;width:100%;}}
  .merit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,2.4vw,32px);}
  @media(max-width:640px){.merit-grid{grid-template-columns:1fr;}}
  .work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,30px);}
  @media(max-width:760px){.work-grid{grid-template-columns:1fr;}}
  .work-thumb{position:relative;aspect-ratio:4/3;background-position:center;background-size:cover;background-repeat:no-repeat;background-color:#E9E9E9;overflow:hidden;}
  .path-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px);}
  @media(max-width:860px){.path-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:520px){.path-grid{grid-template-columns:1fr;}}

/* ===== style block 8 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .co-row{display:grid;grid-template-columns:200px 1fr;border-bottom:1px solid #E4E4E2;}
  @media(max-width:560px){.co-row{grid-template-columns:1fr;}}

/* ===== style block 9 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,2.6vw,40px);}
  @media(max-width:880px){.blog-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:560px){.blog-grid{grid-template-columns:1fr;}}
  .blog-card:hover .blog-thumb > span{transform:scale(1.06);}
  .blog-card:hover .blog-title{color:#C8102E;}

/* ===== style block 10 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .cf-input{width:100%;font-family:inherit;font-size:16px;color:#161616;background:#F7F7F5;border:1.5px solid #E2E2E0;border-radius:2px;padding:14px 16px;transition:border-color .25s,background .25s;}
  .cf-input:focus{outline:none;border-color:#C8102E;background:#fff;}
  .cf-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
  @media(max-width:600px){.cf-grid{grid-template-columns:1fr;}}
  .cf-radio{flex:1;min-width:120px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;font-weight:700;border:1.5px solid #DADAD8;border-radius:2px;padding:14px 10px;cursor:pointer;transition:all .25s;}

/* ===== style block 11 ===== */
*{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Noto Sans JP',sans-serif;color:#161616;background:#0E0E0E;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:#C8102E;color:#fff;}
  .sec-accent{position:absolute;top:clamp(20px,2.4vw,40px);left:-3%;width:clamp(280px,46%,620px);height:clamp(20px,2.4vw,32px);background:#C8102E;transform-origin:left center;transform:skewX(-14deg) scaleX(0);transition:transform 1.05s cubic-bezier(.76,0,.24,1);pointer-events:none;z-index:0;}
  .sec-accent.grow{transform:skewX(-14deg) scaleX(1);}
  .pp-row{display:grid;grid-template-columns:160px 1fr;border-bottom:1px solid #E4E4E2;}
  @media(max-width:560px){.pp-row{grid-template-columns:1fr;}}


/* ===== override-blog.css ===== */
/* ============================================================
   ブログ一覧（CueZilla 動的 blog parts / parts222）— 受領デザインへ寄せる「記事カードのみ」
   実マークアップ:
     main.parts222_main > .parts222_post_list > .parts222_post_wrap > a
       > .parts222_post_img>img
       > .parts222_post_status > .parts222_post_date + .parts222_post_category
       > .parts222_post_title-excerpt > .parts222_post_title
   ★レイアウト（2カラム）・サイドバー（最近の投稿/カテゴリ）の装飾は CueZilla テーマの
     デフォルトをそのまま使う（触らない）。カード装飾は必ず _post_status / _post_title-excerpt
     配下に限定し、サイドバー（_sidebar_*）へ漏らさないこと（漏れると記事数等がページ左上へ飛ぶ）。
   ============================================================ */

/* 一覧セクション見出し「ブログ」(h2.f_meiryo.f_bold) を非表示（site.js でも text 一致で確実化） */
[class*="_post"] h2.f_meiryo.f_bold,
[class*="_blog"] h2.f_meiryo.f_bold { display: none !important; }

/* カード：相対配置（カテゴリ赤ラベルの絶対配置基準） */
[class*="_post_wrap"] { position: relative !important; }

/* 日付：Oswald・13px・字間広め・グレー（カード内のみ） */
[class*="_post_status"] [class*="_post_date"] {
  font-family: 'Oswald', sans-serif !important; font-size: 13px !important;
  letter-spacing: .12em !important; color: #999 !important;
}

/* カテゴリ：画像左上の赤ラベル・白文字（カード内のみ＝サイドバーには適用しない） */
[class*="_post_status"] [class*="_post_category"] {
  position: absolute !important; left: 0 !important; top: 0 !important; margin: 0 !important;
  background: #C8102E !important; color: #fff !important; border: none !important; border-radius: 0 !important;
  font-size: 12px !important; font-weight: 700 !important; letter-spacing: .04em !important;
  padding: 6px 14px !important; z-index: 2 !important;
}

/* 記事タイトル：Noto Sans JP・太字19px・hover で赤（カード内のみ） */
[class*="_post_title-excerpt"] [class*="_post_title"] {
  font-family: 'Noto Sans JP', sans-serif !important; font-weight: 700 !important; font-size: 19px !important;
  line-height: 1.6 !important; letter-spacing: .01em !important; color: #161616 !important; transition: color .3s !important;
}
[class*="_post_wrap"] a:hover [class*="_post_title-excerpt"] [class*="_post_title"] { color: #C8102E !important; }

/* ============================================================
   サイドバー微調整（theme_default.css の既定への最小上書き・依頼分のみ）
   既定: .parts222_sidebar ul li{padding-bottom:12.5px;border-bottom:1px #666}
        .category_post_count ul li{border-left/right:1px #666}
   ============================================================ */
/* 最近の投稿：タイトルと下罫線の間隔を狭く（12.5px → 6px。カテゴリ側には適用しない） */
.parts222_sidebar_wrap:not(.category_post_count) ul li { padding-bottom: 6px !important; }
/* 最近の投稿：タイトル hover で赤 */
.parts222_sidebar_post_title { transition: color .2s !important; }
.parts222_sidebar li a:hover .parts222_sidebar_post_title { color: #C8102E !important; }
/* カテゴリ：項目の左右の縦罫線を除去（下罫線は残す） */
.category_post_count ul li { border-left: none !important; border-right: none !important; }
/* カテゴリリンク（お知らせ等）：hover色を既定の青→赤に */
.parts222_sidebar_post_category { transition: color .2s !important; }
.category_post_count ul li a:hover .parts222_sidebar_post_category { color: #C8102E !important; }

/* ============================================================
   ブログ詳細（/blog/<id>・parts166_single_article）
   記事部＝白背景、タイトル＝黒（既定 var(--text-color)/--main-color 等を上書き）。
   ※parts166_single_article はブログ詳細にのみ存在＝スコープ不要で安全。
   ============================================================ */
.parts166_single_article { background: #fff !important; }
.parts166_single_article article h1,
.parts166_single_article .card-title { color: #161616 !important; }
/* 記事本文のデフォルト文字色＝黒（エディタ貼付のインライン色 rgb(13,27,42) 等も上書き） */
.parts166_single_article article p,
.parts166_single_article article li,
.parts166_single_article article p span { color: #161616 !important; }
/* 下部リンク（カテゴリ／前の記事・次の記事／最近の投稿）：hover で赤 */
.article_category_wrap a, .article_prev a, .article_next a, .recent_posts_wrap li a,
.recent_posts_wrap li a h3, .article_prev .prev_post_title, .article_next .next_post_title { transition: color .2s !important; }
.article_category_wrap a:hover, .article_category_wrap a:hover span,
.article_prev a:hover, .article_prev a:hover .prev_post_title,
.article_next a:hover, .article_next a:hover .next_post_title,
.recent_posts_wrap li a:hover, .recent_posts_wrap li a:hover h3 { color: #C8102E !important; }

/* ============================================================
   ページネーション（ブログ parts222 / 施工実績 parts228 共通）スマホ崩れ修正
   既定は justify-content:flex-start かつ white-space 指定なし。ページ番号は d-xl-block で
   1200px未満は非表示＝「<<最初/<</次へ>>/最後>>」の4ボタンのみ残る。テキスト折返しで
   「<<最初」が2行になり高さがバラつく → nowrap・折返し許可・中央寄せ・パディング縮小で均等化。
   ============================================================ */
@media (max-width: 991px) {
  [class*="_pagenation"] {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
  }
  [class*="_pagenation"] span { margin: 0 !important; }
  [class*="_pagenation"] a, [class*="_pagenation"] span.current {
    white-space: nowrap !important;
    padding: 11px 14px !important;
    font-size: 14px !important;
  }
}


/* ===== override-breadcrumb.css ===== */
/* ============================================================
   パンくず（CueZilla parts###_breadcrumb / p-breadcrumb）装飾
   ・固定ページ＝明示設置した parts231 マークアップ
   ・動的/システムページ（blog / blog-ex / form / privacy）＝CueZilla自動 parts231
   両者を同一見た目に揃える（skin §1 相当・サン建創パレット）。
   CueZilla のパーツ自動CSSは高詳細度のため !important で確実に上書きする。
   ============================================================ */
[class*="_breadcrumb"], .p-breadcrumb {
  background: #FAFAF9 !important;
  border-bottom: 1px solid #ECECEC;
}
.p-breadcrumb__inner {
  list-style: none;
  margin: 0 auto;
  padding: 14px clamp(20px, 5vw, 48px);
  max-width: 1320px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.p-breadcrumb__item {
  display: inline-flex;
  align-items: center;
  color: #666 !important;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: .78rem;
  letter-spacing: .04em;
  line-height: 1.4;
}
.p-breadcrumb__item a { color: #666 !important; text-decoration: none; }
.p-breadcrumb__item a:hover { color: #C8102E !important; text-decoration: underline; }
.p-breadcrumb__item:last-child { color: #161616 !important; }   /* 現在地 */
/* 区切り（2件目以降の前に "›"）＝ブランドレッド */
.p-breadcrumb__item + .p-breadcrumb__item::before {
  content: "\203A";
  margin: 0 .6em;
  color: #C8102E !important;
  font-size: .95em;
}
.p-breadcrumb meta { display: none; }   /* schema.org の <meta itemprop="position"> は非表示 */


/* ===== override-buttons.css ===== */
/* ============================================================
   ボタン hover（受領デザインのJSハンドラ ctaOn/ghostOn/recruitOn/lineFloatOn 相当を CSS :hover で再現）
   ※受領はボタンがインラインstyleのみ（クラス無し）＝style属性セレクタで対象を特定。
   対象：ヘッダーお問い合わせ／ヒーローのボタン／各CTA（無料見積もり・業務案内・採用情報）／
        ブログ署名の採用ボタン／LINE（フロート＋QUICK CONTACT）。
   ============================================================ */
a[style*="background:#C8102E"], a[style*="rgba(255,255,255,.45)"],
a[style*="border:1.5px solid #C8102E"], a[style*="background:#06C755"] {
  transition: background .3s, color .3s, border-color .3s, box-shadow .3s, transform .3s !important;
}

/* 赤塗りCTA（ヘッダーお問い合わせ／ヒーローcontact／無料見積もり 等）→ 白地・赤文字・浮く（ctaOn/invRedOn） */
a[style*="background:#C8102E"]:hover { background: #fff !important; color: #C8102E !important; transform: translateY(-2px) !important; }

/* 白枠ゴースト（業務案内／ヒーロー採用情報 等）→ 白地・濃色・白枠・浮く（ghostOn/recruitOn） */
a[style*="rgba(255,255,255,.45)"]:hover { background: #fff !important; color: #161616 !important; border-color: #fff !important; transform: translateY(-2px) !important; }

/* 赤アウトライン（ブログ署名の「採用情報はこちら」等）→ 赤地・白文字 */
a[style*="border:1.5px solid #C8102E"]:hover { background: #C8102E !important; color: #fff !important; }

/* LINE（緑・フロート＆QUICK CONTACT）→ 白地・緑文字・緑インセット枠・浮く（lineFloatOn/lineOn） */
a[style*="background:#06C755"]:hover { background: #fff !important; color: #06C755 !important; box-shadow: inset 0 0 0 1.6px #06C755 !important; transform: translateY(-2px) !important; }
a[style*="background:#06C755"]:hover span { color: #06C755 !important; }

/* ============================================================
   ① ヘッダーナビ：現在ページ(.is-current)に赤アンダーライン（固定線）。
      hover演出（gradientが左から伸びる .sh-nav-underline:hover）はそのまま継続。
      固定線=border-bottom（borderボックス最下部）／hover線=gradient。レイヤーを分けるため
      現在ページのみ background-clip:padding-box にして gradient を border の少し上へ寄せる
      → 現在ページをhoverすると「固定線＋左から現れる線」で自然に2重になる。
   ============================================================ */
.sh-nav-underline.is-current {
  border-bottom-color: #C8102E !important;
  background-clip: padding-box !important;
}

/* ============================================================
   ② 私たちについて：「SDGs宣言を見る」ボタン
      受領hover(pdfOn)＝背景赤+浮く を復元。ただし赤地で矢印(↗)が赤だと消えるため、hover時の矢印を黒に。
   ============================================================ */
a[href*="sdgs_declaration"][style*="background:#161616"] { transition: background .3s, transform .3s !important; }
a[href*="sdgs_declaration"][style*="background:#161616"]:hover { background: #C8102E !important; transform: translateY(-2px) !important; }
a[href*="sdgs_declaration"][style*="background:#161616"]:hover span { color: #000 !important; }

/* ============================================================
   ③ TOP「採用情報を見る」黒CTA（a[href="/recruit"] background:#0E0E0E）→ 赤背景＋浮く。
      ※about側の同テキストは赤背景＝上記 #C8102E ルールで対応済み。これはTOPの黒ボタン専用。
   ============================================================ */
a[href="/recruit"][style*="background:#0E0E0E"]:hover { background: #C8102E !important; transform: translateY(-2px) !important; }

/* ============================================================
   ブログ署名ボタン（.bsig）
   ・「お問い合わせはこちら」(赤塗り)：共通ルールで hover→白地・赤文字・浮く。
     白地だと輪郭が曖昧なため、署名内のこのボタン限定で hover時に周囲の赤罫線を追加。
     レイアウトずれ回避のため border ではなく box-shadow(spread) で外周線を描く。
   ・「採用情報はこちら」(赤アウトライン)：共通ルールで hover→赤地・白文字。
   ・スマホ時は縦積み＋全幅で左右の幅をそろえる。
   ============================================================ */
.bsig a[href="/form/inquiry"]:hover { box-shadow: 0 0 0 1.5px #C8102E !important; }

@media (max-width: 520px) {
  .bsig { flex-direction: column !important; align-items: stretch !important; }
  .bsig a { width: 100% !important; box-sizing: border-box !important; }
}


/* ===== override-contact.css ===== */
/* ============================================================
   お問い合わせフォーム（CueZilla /form/inquiry）を受領デザインへ寄せる上書き
   CueZilla 2系統に両対応:
     §7  = parts_form/dl 系（[class*="_form_wrap"] > dt(label+.required) / dd(input) / .contact_submit）
     §7b = wpcf7/.formBox 系（.formWrap > .formBox > dt>label>span.req + dd>input / input.wpcf7-submit）
   受領仕様: label=14px太字・必須=赤テキスト・入力欄=#F7F7F5/1.5px#E2E2E0/角丸2px/16px・focus赤、
             ご用件ラジオ=ボタン型ピル(.cf-radio)、送信=19px太字/padding17px48px/赤。
   ※CueZillaパーツ自動CSSは高詳細度(0,3,0)+!important。負ける場合は site.combined.css 末尾に
     §14 アーマー（section.partsNNN_form_xxxx … !important）を実ページのパーツ番号で追記。
   ※実マークアップ確認済み: section.contact_section > section.parts213_section_form
     > .parts213_form_wrap > dl(dt+.required / dd) ＋ お問い合わせ項目=checkbox ＋ .contact_submit>input[submit]。
   ============================================================ */

/* 導入見出し(FORM)フリーエリアとフォームの間隔を詰める：
   フォーム直前の _complete_form パーツ（:has で限定＝施工実績タブ部/完了ページには非適用）の
   上下padding と 自動<p>マージンを0に。見出し上の余白は見出しスニペット側の padding が担う。 */
[class*="_complete_form"]:has(+ .contact_section) { padding-top: 0 !important; padding-bottom: 0 !important; }
[class*="_complete_form"]:has(+ .contact_section) .free-area p { margin: 0 !important; }

/* ---- コンテンツ幅を受領デザインに合わせる（フォーム本文 max-width:780px・中央寄せ） ---- */
.contact_section, [class*="_section_form"] { background: #fff !important; }
/* フォーム上paddingは0（見出し→フォーム間は intro 側の下paddingで制御）。下paddingのみ維持。 */
.contact_section { padding: 0 0 clamp(72px, 10vw, 130px) !important; }
[class*="_form_wrap"] {
  max-width: 780px !important; margin: 0 auto !important;
  padding: 0 clamp(20px, 5vw, 48px) !important; box-sizing: border-box !important;
}

/* ---- 行を縦積み（項目名→入力欄）。マークアップ種別を問わず縦並びに強制 ----
   CueZilla実フォームが dl(dt/dd) / table(th/td) / flex行 のいずれでも label を上・入力欄を下にする。
   詳細度は §14 相当（[class*="parts"][class*="_form"]）で自動CSSに勝てるよう底上げ。 */
/* dl/dt/dd 系 */
[class*="_form_wrap"] dl, [class*="parts"][class*="_form"] dl, .formWrap dl { display: block !important; }
[class*="_form_wrap"] dt, [class*="_form_wrap"] dd,
[class*="parts"][class*="_form"] dt, [class*="parts"][class*="_form"] dd,
.formBox dt, .formBox dd {
  display: block !important; width: 100% !important; max-width: none !important;
  float: none !important; margin-left: 0 !important; clear: both !important; vertical-align: top !important;
}
[class*="_form_wrap"] dd, [class*="parts"][class*="_form"] dd, .formBox dd { margin-bottom: 26px !important; }
/* table(th=項目名 / td=入力欄) 系を縦積みに（フォーム枠内に限定） */
[class*="_form_wrap"] table, [class*="_form_wrap"] tbody, [class*="_form_wrap"] tr,
[class*="_form_wrap"] th, [class*="_form_wrap"] td,
[class*="parts"][class*="_form"] table, [class*="parts"][class*="_form"] tbody,
[class*="parts"][class*="_form"] tr, [class*="parts"][class*="_form"] th, [class*="parts"][class*="_form"] td,
.formWrap table, .formWrap tbody, .formWrap tr, .formWrap th, .formWrap td {
  display: block !important; width: 100% !important; float: none !important; text-align: left !important;
}
[class*="_form_wrap"] th, [class*="parts"][class*="_form"] th, .formWrap th { margin-bottom: 12px !important; }
[class*="_form_wrap"] td, [class*="parts"][class*="_form"] td, .formWrap td { margin-bottom: 26px !important; }
/* flex/grid 行コンテナ（label と input が横並びのラッパー）を縦方向に */
[class*="_form_wrap"] [class*="_form_item"], [class*="_form_wrap"] [class*="_form_row"],
[class*="parts"][class*="_form"] [class*="_item"], [class*="parts"][class*="_form"] [class*="_row"] {
  display: block !important;
}

/* ① 項目名（label）：14px 太字・入力欄の上・下マージン12px ---- */
[class*="_form_wrap"] dt, [class*="_form_wrap"] dt label,
.formBox dt, .formBox dt label {
  font-size: 14px !important; font-weight: 700 !important; color: #161616 !important;
  margin-bottom: 12px !important; display: block !important; line-height: 1.4 !important;
}

/* 必須：受領は赤テキスト「必須」（バッジではない） ---- */
[class*="_form_wrap"] .required, .required, .formBox .req, .req {
  display: inline !important; background: transparent !important; color: #C8102E !important;
  border: none !important; padding: 0 !important; margin-left: 6px !important;
  font-size: 13px !important; font-weight: 700 !important; line-height: inherit !important; white-space: nowrap !important;
}
/* お問い合わせ内容（form_text_dt）の必須：既定の position:absolute;top:0;right:0（右上固定）を解除し、
   ラベル「お問い合わせ内容」のすぐ横にインライン表示（マークアップ側でラベル直後へ移動済み）。 */
.form_text_dt { position: static !important; }
.form_text_dt .required {
  position: static !important; top: auto !important; right: auto !important; left: auto !important;
  display: inline !important;
}
.form_text_dt .attention { display: block !important; } /* 注意文は必須の後ろ＝下段へ */

/* 入力欄：薄グレー背景・1.5px枠・角丸2px・16px。focusで赤枠/白背景 ---- */
[class*="_form_wrap"] dd input:not([type="checkbox"]):not([type="radio"]),
[class*="_form_wrap"] dd select,
[class*="_form_wrap"] dd textarea,
[class*="_form_wrap"] textarea,
.formBox dd input:not([type="checkbox"]):not([type="radio"]),
.formBox dd select,
.formWrap input[type="text"], .formWrap input[type="email"], .formWrap input[type="tel"],
.formWrap textarea {
  width: 100% !important; font-family: inherit !important; font-size: 16px !important; color: #161616 !important;
  background: #F7F7F5 !important; border: 1.5px solid #E2E2E0 !important; border-radius: 2px !important;
  padding: 14px 16px !important; box-sizing: border-box !important; transition: border-color .25s, background .25s !important;
}
[class*="_form_wrap"] dd textarea, [class*="_form_wrap"] textarea,
.formBox dd textarea, .formWrap textarea { min-height: 160px !important; resize: vertical !important; }
[class*="_form_wrap"] dd input:focus,
[class*="_form_wrap"] dd select:focus,
[class*="_form_wrap"] dd textarea:focus,
.formBox dd input:focus, .formWrap input:focus, .formWrap textarea:focus {
  outline: none !important; border-color: #C8102E !important; background: #fff !important;
}

/* ② お問い合わせ項目（種別）選択UI：ラジオ／チェックボックスをボタン型ピルに（受領 .cf-radio 相当）
   ※実フォームは checkbox（複数選択：ご相談/お問い合わせ/お見積もり依頼/求人/その他）。
     当フォームに同意チェックボックスは無いため checkbox label のピル化は安全。 ---- */
[class*="_form_wrap"] input[type="radio"], [class*="_form_wrap"] input[type="checkbox"],
.formWrap input[type="radio"], .formWrap input[type="checkbox"] {
  accent-color: #C8102E !important; width: 16px !important; height: 16px !important; min-height: 0 !important;
  margin: 0 !important; flex: none !important;
}
/* ラジオ/チェックを内包する label をピル化（:has で誤爆を抑制） */
[class*="_form_wrap"] dd label:has(input[type="radio"]),
[class*="_form_wrap"] dd label:has(input[type="checkbox"]),
.formBox dd label:has(input[type="radio"]),
.formBox dd label:has(input[type="checkbox"]),
.formWrap label:has(input[type="radio"]),
.formWrap label:has(input[type="checkbox"]) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  min-width: 120px !important; font-size: 15px !important; font-weight: 700 !important; color: #161616 !important;
  border: 1.5px solid #DADAD8 !important; border-radius: 2px !important; padding: 14px 16px !important;
  margin: 0 12px 12px 0 !important; cursor: pointer !important; transition: border-color .25s, background .25s, color .25s !important;
}
[class*="_form_wrap"] dd label:has(input[type="radio"]):hover,
[class*="_form_wrap"] dd label:has(input[type="checkbox"]):hover,
.formBox dd label:has(input[type="radio"]):hover,
.formBox dd label:has(input[type="checkbox"]):hover,
.formWrap label:has(input[type="radio"]):hover,
.formWrap label:has(input[type="checkbox"]):hover { border-color: #C8102E !important; }

/* ③ 確認ボタン：19px 太字・padding 17px 48px・赤背景白文字・【文字量に応じた幅で左寄せ】 ----
   受領は align-self:flex-start（文字幅・左寄せ）。CueZilla既定はコンテンツ全幅＋文字左寄りのため、
   コンテナを左寄せ・ボタンを inline-block / width:auto に矯正（高詳細度で自動CSSに勝つ）。 */
/* コンテナを左寄せに。既定 width:220px;margin:0 auto（確認画面へ＝中央寄せで左に空き）／
   確認ページ width:460px;justify-content:space-between（戻る・送信が両端）を打ち消し、左揃えのflex行に。 */
/* ※入力/確認フォーム(_section_form)とwpcf7系のみ対象。完了ページ(parts243-245_complete_form)には当てない */
[class*="_section_form"] .contact_submit {
  width: auto !important; max-width: none !important;
  margin-left: 0 !important; margin-right: 0 !important;
  display: flex !important; flex-wrap: wrap !important; gap: 14px !important;
  justify-content: flex-start !important; text-align: left !important;
}
[class*="_section_form"] .contact_submit input[type="submit"],
[class*="_section_form"] .contact_submit input[type="button"],
[class*="_section_form"] .contact_submit button,
[class*="_form_wrap"] button[type="submit"], [class*="_form_wrap"] input[type="submit"],
input.wpcf7-submit, .formWrap button[type="submit"], .formWrap input[type="submit"] {
  display: inline-block !important; width: auto !important; max-width: none !important; min-width: 0 !important;
  background: #C8102E !important; color: #fff !important; border: none !important; border-radius: 2px !important;
  font-size: 19px !important; font-weight: 700 !important; letter-spacing: .06em !important;
  padding: 17px 48px !important; min-height: 0 !important; text-align: center !important;
  cursor: pointer !important; transition: background .3s, transform .3s !important;
}
[class*="_section_form"] .contact_submit input:hover,
[class*="_section_form"] .contact_submit button:hover,
input.wpcf7-submit:hover, [class*="_form_wrap"] button[type="submit"]:hover { transform: translateY(-2px) !important; }

/* 確認ページ（/form/confirm/inquiry）：戻るボタン(input[name="back"])はグレー（送信＝赤と区別）。
   既定の margin（右20px/中央寄せ）も解除し、flex行で左揃え。 */
[class*="_section_form"] .contact_submit input[name="back"] {
  background: #888 !important; color: #fff !important; margin: 0 !important;
}
/* reCAPTCHA も左揃え（既定 .g-recaptcha > div{margin:0 auto} を打ち消し） */
.g-recaptcha { text-align: left !important; margin-left: 0 !important; }
.g-recaptcha > div { margin-left: 0 !important; margin-right: auto !important; }


/* ===== override-top-blog.css ===== */
/* ============================================================
   TOP ブログ teaser（CueZilla design-parts-11）をサイトトンマナへ統一
   構造: .design-parts-11 .container .header-wrap(h2.header「ブログ」+ p.subheader「BLOG」)
         + .content > ul.row > li.col-* > a > div >（.image_area ＋ .card-foot-area(.date / .categorytag / span=タイトル)）
   方針: 見出し=EN(赤Oswald)を上・JP(ダーク太字)を下／カード=画像左上の赤カテゴリ・Oswald日付・太字タイトルhover赤・枠線オフ
   ※パーツ既定CSSは !important 無し→本ファイルの !important で確実に上書き。基底クラス .design-parts-11 で番号サフィックス非依存。
   ============================================================ */

/* 見出し：EN を上の赤Oswaldアクセント（前に赤バー）、JP を大きめ太字ダークに。左揃え */
.design-parts-11 .header-wrap {
  display: flex !important; flex-direction: column-reverse !important; align-items: flex-start !important; gap: 12px !important;
  /* 左端カードの画像左端に揃える（.row 負マージン-12 + li.px-2 +8 + a.p-3 +16 = +12px の差分を見出しへ付与） */
  padding-left: 12px !important;
}
.design-parts-11 .header {
  font-family: 'Noto Sans JP', sans-serif !important; color: #161616 !important; text-align: left !important;
  font-size: clamp(32px, 4.4vw, 56px) !important; font-weight: 900 !important;
  letter-spacing: .01em !important; line-height: 1.25 !important; margin: 0 !important;
}
.design-parts-11 .subheader {
  font-family: 'Oswald', sans-serif !important; color: #C8102E !important; text-align: left !important;
  font-size: 15px !important; font-weight: 500 !important; letter-spacing: .28em !important;
  text-transform: uppercase !important; margin: 0 !important;
  /* EN の前に赤いバー「ー」（他セクションのアイブロウと統一）。
     ※AddCssInfo は content を除去するため ::before は使えない→背景グラデーションで描画 */
  padding-left: 44px !important;
  background: linear-gradient(#C8102E, #C8102E) no-repeat left center / 34px 2px !important;
}

/* カード：枠線を外しクリーンに */
.design-parts-11 .content ul li a {
  background: transparent !important; border: none !important; border-radius: 0 !important;
}
.design-parts-11 .content ul li a > div { position: relative !important; }
/* 画像：角丸控えめ */
.design-parts-11 .content .image_area { border-radius: 2px !important; }

/* カテゴリ：画像左上の赤ラベル・白文字（受領/一覧と統一） */
.design-parts-11 .content ul li .categorytag {
  position: absolute !important; top: 0 !important; left: 0 !important; z-index: 2 !important;
  background: #C8102E !important; color: #fff !important; border: none !important; border-radius: 0 !important;
  min-width: 0 !important; max-width: none !important; width: auto !important;
  font-size: 12px !important; font-weight: 700 !important; letter-spacing: .04em !important;
  padding: 6px 14px !important; margin: 0 !important; text-align: left !important;
}
/* 日付：Oswald・字間広め・グレー */
.design-parts-11 .card-foot-area .date {
  font-family: 'Oswald', sans-serif !important; font-size: 13px !important;
  letter-spacing: .12em !important; color: #999 !important;
}
/* タイトル（.card-foot-area 内の素のspan）：Noto Sans JP 太字・hover 赤 */
.design-parts-11 .card-foot-area .d-inline-block {
  font-family: 'Noto Sans JP', sans-serif !important; font-size: 18px !important; font-weight: 700 !important;
  color: #161616 !important; line-height: 1.6 !important; transition: color .3s !important;
}
.design-parts-11 .content ul li a:hover .d-inline-block { color: #C8102E !important; }
/* hover：画像は軽くディム（既定踏襲）、赤ラベルは鮮明に保つ */
.design-parts-11 .content ul li a:hover .categorytag { opacity: 1 !important; }


/* ===== override-works.css ===== */
/* ============================================================
   施工実績ページ（/blog-ex/instance 一覧）を黒基調に＋受領トンマナへ
   site.js が html に .is-works を付与した時のみ適用（＝一覧ページ限定。記事詳細 /blog-ex/instance/<id> は白のまま）。
   実マークアップ:
     section.parts228_section（一覧・既定bg=白）
       > .parts228_post_wrap > a >（.parts228_post_img>img / .parts228_post_status>.parts228_post_date
                                    / .parts228_post_title-excerpt>(.parts228_post_title + .parts-blog-ex-tag_wrap>a>.parts-blog-ex_tag)）
     カテゴリチップ（タグ選択）部: [class*="_complete_form"] > .container > .free-area > p > section(inline bg #0E0E0E) > span×6
     パンくず: parts231（bg #f5f5f5）
   ============================================================ */
html.is-works body { background: #0B0B0B !important; }

/* 一覧セクションを黒に＋上部余白を圧縮（タブ→一覧の間隔を適正化。既定 padding-top:100px が広すぎ） */
html.is-works .parts228_section { background: #0B0B0B !important; padding-top: 32px !important; }

/* ④ タグ選択（カテゴリチップ）部の背景を透過＝ページ背景に依存。チップ自体（border付きpill）は残す。
      タブ→一覧の余白も詰める（下余白0） */
html.is-works [class*="_complete_form"] { background: transparent !important; padding-top: 16px !important; padding-bottom: 0 !important; }
html.is-works [class*="_complete_form"] .free-area section { background: transparent !important; }

/* タグチップ間隔を受領（gap:clamp(10px,1.2vw,16px)）に揃える：free-area貼付で混入した <br> が
   flex内で余分なアイテムになり間隔が広がる→<br>を非表示にして等間隔に。レスポンシブはflex-wrap+clampで追従。一覧・詳細とも適用。 */
html.is-works [class*="_complete_form"] .free-area br,
html.is-works-detail [class*="_complete_form"] .free-area br { display: none !important; }

/* カード文字を黒地で可読に（テーマ既定＆旧blog上書きの暗色を打ち消し） */
html.is-works .parts228_post_title,
html.is-works [class*="_post_title-excerpt"] [class*="_post_title"] { color: #fff !important; }
html.is-works .parts228_post_date,
html.is-works [class*="_post_status"] [class*="_post_date"] { color: rgba(255,255,255,.6) !important; }
/* カードhoverでタイトル赤（CueZillaの<a>ネストが崩れているため card-wrap:hover 起点で確実化） */
html.is-works .parts228_post_title { transition: color .3s !important; }
html.is-works .parts228_post_wrap:hover .parts228_post_title,
html.is-works [class*="_post_wrap"]:hover [class*="_post_title-excerpt"] [class*="_post_title"] { color: #C8102E !important; }

/* ① タグ＝写真の左上に赤ラベル白文字（ブログ一覧のカテゴリと統一） */
html.is-works .parts228_post_wrap { position: relative !important; }
html.is-works .parts-blog-ex-tag_wrap {
  position: absolute !important; top: 0 !important; left: 0 !important; z-index: 2 !important;
  margin: 0 !important; padding: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 0 !important;
}
html.is-works .parts-blog-ex_tag {
  display: block !important; background: #C8102E !important; color: #fff !important; border: none !important; border-radius: 0 !important;
  font-size: 12px !important; font-weight: 700 !important; letter-spacing: .04em !important;
  padding: 6px 14px !important; margin: 0 !important;
}

/* パンくず（parts231）も黒地に合わせる */
html.is-works [class*="_breadcrumb"], html.is-works .p-breadcrumb { background: #0B0B0B !important; }
html.is-works .p-breadcrumb__item, html.is-works .p-breadcrumb__item a { color: rgba(255,255,255,.6) !important; }
html.is-works .p-breadcrumb__item:last-child { color: #fff !important; }

/* ページネーション（出る場合）も黒地向けに */
html.is-works .parts228_pagenation a { background: transparent !important; color: #fff !important; border-color: rgba(255,255,255,.4) !important; }
html.is-works .parts228_pagenation span.current { background: #C8102E !important; border-color: #C8102E !important; color: #fff !important; }

/* ============================================================
   施工実績 記事詳細（/blog-ex/instance/<id>・html.is-works-detail）
   ＝白背景（is-works を付けないので body・記事部は既定の白）。
   タグ遷移ボタン（カテゴリチップ）は暗テーマ用inline(#0E0E0E/白文字)のため、白ページ用に白地・濃色文字へ。
   ============================================================ */
html.is-works-detail body { background: #fff !important; } /* 記事部分は白背景（黒を当てない＋明示的に白を強制） */
/* 記事タイトル（.parts-blog-ex-single-wrap h2 / 既定=赤・中央）を 左揃え・黒 に。
   ※当クラスは施工実績詳細(blog-ex single)にのみ存在＝スコープ不要で安全。 */
.parts-blog-ex-single-wrap h2 { color: #161616 !important; text-align: left !important; }
html.is-works-detail [class*="_complete_form"] .free-area section { background: transparent !important; }
html.is-works-detail [class*="_complete_form"] .free-area span,
html.is-works-detail [class*="_complete_form"] .free-area a {
  background: #fff !important; color: #161616 !important; border-color: #ccc !important;
}