/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 02 2026 | 07:53:24 */
/* ==============================
   会社概要：company_about
============================== */

#company_about{
  --ca-bd:#d7dee8;
  --ca-label:#eef2f6;
  --ca-txt: var(--color_text);
  --ca-gap:18px;

  /* 沿革：列幅（PC） */
  --ca-yearW:220px; /* 年度を細く */
  --ca-monthW:86px;

  color:var(--ca-txt);
}

/* PC（2カラム） */
#company_about .caRow{
  display:grid;
  grid-template-columns: 220px 1fr;
  border:1px solid var(--ca-bd);
  border-bottom:none;
}

#company_about .caRow:last-child{
  border-bottom:1px solid var(--ca-bd);
}

#company_about .caLabel{
  margin:0;
  padding:22px 18px;
  background:var(--ca-label);
  border-right:1px solid var(--ca-bd);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;

  font-size:16px;
  font-weight:700;
  line-height:1.2;
}

/* SWELLスタイル上書き */
#company_about h3.caLabel:before {
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

#company_about .caBody{
  padding:22px 22px;
  background:#fff;
}

#company_about .caText{
  margin:0;
  font-size:15px;
  line-height:1.9;
}

#company_about .caText + .caText{
  margin-top:6px;
}

/* dl（役職・日付など） */
#company_about .caDL{
  margin:0;
  padding:0;
}

#company_about .caDL__row{
  display:grid;
  column-gap:var(--ca-gap);
  align-items:start;
}

#company_about .caDL__row + .caDL__row{
  margin-top:10px;
}

#company_about dt,
#company_about dd{
  margin:0;
  padding:0;
  font-size:15px;
  line-height:1.8;
  font-weight:400;
}

#company_about .caDL--officer .caDL__row{
  grid-template-columns: 11em 1fr;
}

#company_about .caDL--date .caDL__row{
  grid-template-columns: 10.5em 1fr;
}

/* ==============================
   沿革：caHis（tableなし）
============================== */

#company_about .caHis{
  margin-top:24px;
}

/* 1年ぶんの枠（PCは 年｜内容 の2列） */
#company_about .caHisGroup{
  display:grid;
  grid-template-columns: var(--ca-yearW) 1fr;
  border:1px solid var(--ca-bd);
  border-bottom:none;
}

#company_about .caHisGroup:last-child{
  border-bottom:1px solid var(--ca-bd);
}

/* 月なし年：年度セルを（年度＋月）幅にする */
#company_about .caHisGroup--noMonth{
  grid-template-columns: calc(var(--ca-yearW) + var(--ca-monthW)) 1fr;
}

/* 年（左セル）：h3 */
#company_about .caHisYear{
  margin:0;
  padding:22px 18px;
  background:var(--ca-label);
  border-right:1px solid var(--ca-bd);

  display:flex;
  align-items:center;
  justify-content:flex-start;

  font-size:16px;
  font-weight:700;
  line-height:1.2;
}

/* SWELLスタイル上書き */
#company_about h3.caHisYear:before {
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* 右側（年の中の明細リスト） */
#company_about .caHisItems{
  background:#fff;
}

/* 明細行：月｜内容（年の右側で2列） */
#company_about .caHisItem{
  display:grid;
  grid-template-columns: var(--ca-monthW) 1fr;
  min-height:64px;
}

#company_about .caHisItem + .caHisItem{
  border-top:1px solid var(--ca-bd);
}

#company_about .caHisMonth{
  background:var(--ca-label);
  border-right:1px solid var(--ca-bd);
  padding:18px 12px;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:15px;
  font-weight:700;
  line-height:1.2;
}

#company_about .caHisDesc{
  padding:18px 18px;
  font-size:15px;
  line-height:1.9;
}

/* 月が空のとき */
#company_about .caHisMonth:empty{
  font-weight:400;
}

/* 月なし年：右側の「月列」を出さない（線も出ない） */
#company_about .caHisGroup--noMonth .caHisItem{
  grid-template-columns: 1fr;
}
#company_about .caHisGroup--noMonth .caHisMonth{
  display:none;
}

/* 月なし（行単位）にも対応 */
#company_about .caHisItem--noMonth{
  grid-template-columns: 1fr;
}
#company_about .caHisItem--noMonth .caHisMonth{
  display:none;
}

/* SP（縦並び） */
@media (max-width: 900px){
  /* 会社概要（caRow） */
  #company_about .caRow{
    grid-template-columns: 1fr;
    border:none;
    padding:0 0 22px;
  }

  #company_about .caRow + .caRow{
    margin-top:18px;
  }

  #company_about .caLabel{
    background:transparent;
    border:none;
    padding:0 0 10px;
    justify-content:flex-start;
    text-align:left;

    font-size:18px;
    border-bottom:1px solid var(--ca-bd);
  }

  #company_about .caBody{
    padding:12px 0 0;
    background:transparent;
  }

  #company_about .caText,
  #company_about dt,
  #company_about dd{
    font-size:16px;
  }

  #company_about .caDL--officer .caDL__row,
  #company_about .caDL--date .caDL__row{
    grid-template-columns: 1fr;
    row-gap:4px;
  }

  /* 沿革（caHis） */
  #company_about .caHis{
    margin-top:10px;
  }

  #company_about .caHisGroup{
    grid-template-columns: 1fr;
    border:none;
    padding:0 0 18px;
  }

  #company_about .caHisGroup + .caHisGroup{
    margin-top:16px;
  }

  #company_about .caHisYear{
    background:transparent;
    border:none;
    padding:0 0 10px;

    font-size:18px;
    border-bottom:1px solid var(--ca-bd);
  }

  #company_about .caHisItems{
    background:transparent;
  }

  /* ★SP：月と本文を上端でそろえる（gridで安定） */
  #company_about .caHisItem{
    display:grid;
    grid-template-columns: 2.2em 1fr;
    column-gap:10px;
    align-items:start;
    min-height:auto;
    padding-top:10px;
  }

  #company_about .caHisItem + .caHisItem{
    border-top:none;
  }

  /* ★SP：月（上揃い＋400） */
  #company_about .caHisMonth{
    background:transparent;
    border-right:none;
    padding:0;

    display:block;        /* flex解除 */
    margin:0;
    font-size:16px;
    font-weight:400;      /* 指定どおり */
    line-height:1.9;      /* 本文と揃える */
    white-space:nowrap;
  }

  /* ★SP：本文（先頭を揃える） */
  #company_about .caHisDesc{
    padding:0;
    margin:0;
    font-size:16px;
    line-height:1.9;
  }

  /* SP：月なしは左の空きを消す */
  #company_about .caHisItem--noMonth{
    grid-template-columns: 1fr;
    column-gap:0;
  }
  #company_about .caHisItem--noMonth .caHisMonth{
    display:none;
  }

  /* SP：年グループ側の noMonth は影響なし */
  #company_about .caHisGroup--noMonth{
    grid-template-columns: 1fr;
  }
}

/* 個人情報保護方針 */
@media screen and (max-width: 599px) {
  /* ml10クラスを持つfigure要素に対する調整 */
  figure.privacypolicy_table.ml10 {
    width: auto !important;
    display: block !important;
    overflow-x: hidden !important;
  }

  /* セル(td/th)や行(tr)を縦積みにする指定 */
  figure.privacypolicy_table table td,
  figure.privacypolicy_table table th {
    display: block !important;       /* セルをブロック要素にして縦に積む */
    width: 100% !important;          /* 親要素(table)の幅いっぱいに広げる */
    max-width: none !important;      /* 固定幅の上限があれば解除 */
    box-sizing: border-box !important; /* 枠線や余白を含めて計算 */
    /* border-right: none !important; */ /* 右の線は表示させるためコメントアウト */
  }

  figure.privacypolicy_table table tbody,
  figure.privacypolicy_table table tr {
    display: block !important;
    width: 100% !important;
  }
}


/* ==================================================
  /company/ リンクカードBOX（About Us / mini 共通）
================================================== */

/* ==================================================
  1) 変数
================================================== */
.p-company-LinkCardsBox,
.p-company-LinkCardsBox_mini{
  --plc-wrapW: 1180px;

  --plc-ink: #212121;
  --plc-text: #212121;
  --plc-accent: #DF0515;

  --plc-bg: #f3f5f8;

  --plc-secPadTop: clamp(22px, 5vw, 54px);
  --plc-secPadBottom: clamp(26px, 6vw, 60px);

  --plc-padX: clamp(18px, 4vw, 56px);

  --plc-innerPadTop: 40px;
  --plc-innerPadBottom: 60px;

  --plc-h2-pc: clamp(22px, 2.4vw, 34px);
  --plc-h2-sp: clamp(28px, 7vw, 40px);
  --plc-h2-gap: clamp(10px, 2.2vw, 16px);

  --plc-lead: clamp(13px, 1.05vw, 15px);
  --plc-lead-gap: clamp(18px, 3.2vw, 28px);

  --plc-h3-pc: clamp(16px, 1.5vw, 20px);
  --plc-h3-sp: clamp(15px, 4.6vw, 18px);
  --plc-h3-gap: clamp(14px, 3vw, 22px);

  --plc-grid-gap-pc: clamp(18px, 2.2vw, 34px);
  --plc-grid-gap-sp: 14px;

  --plc-h3Bar-w: 2px;
  --plc-h3Bar-gap: 10px;
  --plc-h3Bar-h: 1.05em;

  --plc-hcard-mediaW-pc: clamp(130px, 10.5vw, 170px);
  --plc-hcard-mediaW-sp: clamp(120px, 34vw, 150px);
  --plc-hcard-bodyPadY: 14px;
  --plc-hcard-bodyPadX: clamp(14px, 1.6vw, 18px);
  --plc-hcard-arrowPadR: clamp(12px, 1.4vw, 18px);

  --plc-mini-padX-sp: clamp(14px, 4vw, 22px);
  --plc-mini-bodyPadY: 12px;

  --plc-coIconMax: 30px;
  --plc-coMediaWScale: .75;
  --plc-coMediaPadY: clamp(18px, 3.2vw, 30px);
  --plc-coBodyPadY: clamp(18px, 3.2vw, 30px);
  --plc-coTtlSize: clamp(16px, 3.2vw, 18px);
  --plc-coLogoMaxW: clamp(86px, 10vw, 140px);
  --plc-coLogoMaxH: clamp(18px, 2.4vw, 28px);

  /* =========================
     追加：SP ロゴ調整ツマミ
     - 幅：%で調整（例 100% / 95% / 90%）
     - 高さ：96pxカード内で安全に
  ========================= */
  --plc-sp-logoW: 70%;
  --plc-sp-logoMaxH: 78px;

  /* hbtn */
  --plc-hbtn-mediaWScale: .5;
  --plc-hbtn-bodyPadY: clamp(16px, 2.2vw, 26px);
  --plc-hbtn-bodyPadX: clamp(6px, 1vw, 10px);
  --plc-hbtn-mediaPadY: clamp(8px, 1.6vw, 16px);
  --plc-hbtn-ttlSize: clamp(14px, 1.5vw, 16px);
  --plc-hbtn-ttlWeight: 500;
  --plc-hbtn-iconMax: clamp(26px, 3vw, 34px);
  --plc-hbtn-logoMaxW: clamp(72px, 9vw, 110px);
  --plc-hbtn-logoMaxH: clamp(18px, 2.2vw, 26px);
  --plc-hbtn-arrowPadR: clamp(12px, 3.8vw, 18px);
}

/* ==================================================
  2) Box 外枠
================================================== */
.p-company-LinkCardsBox{
  padding: var(--plc-secPadTop) 0 var(--plc-secPadBottom);
}

.p-company-LinkCardsBox > .swell-block-fullWide__inner{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.p-company-LinkCardsBox__inner > .wp-block-group__inner-container{
  width: min(var(--plc-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;

  padding-left: var(--plc-padX) !important;
  padding-right: var(--plc-padX) !important;

  padding-top: var(--plc-innerPadTop) !important;
  padding-bottom: var(--plc-innerPadBottom) !important;
}

/* ==================================================
  3) SWELL / Gutenberg 打ち消し（Box / mini）
================================================== */
.p-company-LinkCardsBox,
.p-company-LinkCardsBox_mini{
  --wp--style--block-gap: 0px;
}

.p-company-LinkCardsBox :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-heading,
  p,
  figure,
  img
),
.p-company-LinkCardsBox_mini :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-heading,
  p,
  figure,
  img
){
  margin: 0 !important;
}

.p-company-LinkCardsBox :where(.wp-block-group, .wp-block-group__inner-container),
.p-company-LinkCardsBox_mini :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-company-LinkCardsBox :where(figure),
.p-company-LinkCardsBox_mini :where(figure){
  max-width: none !important;
}

.p-company-LinkCardsBox :where(h2, h3, .wp-block-heading),
.p-company-LinkCardsBox_mini :where(h2, h3, .wp-block-heading){
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: none !important;
}

.p-company-LinkCardsBox :where(h2, h3, .wp-block-heading)::before,
.p-company-LinkCardsBox :where(h2, h3, .wp-block-heading)::after,
.p-company-LinkCardsBox_mini :where(h2, h3, .wp-block-heading)::before,
.p-company-LinkCardsBox_mini :where(h2, h3, .wp-block-heading)::after{
  content: none !important;
  display: none !important;
}

/* ==================================================
  4) 見出し（Box）
================================================== */
.p-company-LinkCards-head{
  color: var(--plc-accent);
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.05;
  font-size: var(--plc-h2-pc) !important;

  margin-bottom: var(--plc-h2-gap) !important;
  padding-left: 0 !important;
}

.p-company-LinkCards-headtxt{
  color: var(--plc-text);
  font-size: var(--plc-lead);
  line-height: 1.9;
  margin-bottom: var(--plc-lead-gap) !important;
}

.p-company-LinkCardsBox .p-company-LinkCards-head2{
  display: flex !important;
  align-items: center !important;

  color: var(--plc-accent) !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  line-height: 1.2 !important;

  font-size: var(--plc-h3-pc) !important;

  margin: 0 0 var(--plc-h3-gap) 0 !important;

  padding: 0 0 0 20px !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  position: relative !important;
}

.p-company-LinkCardsBox .p-company-LinkCards-head2::after{
  content: none !important;
  display: none !important;
}

.p-company-LinkCardsBox .p-company-LinkCards-head2::before{
  content: "" !important;
  display: inline-block !important;

  width: var(--plc-h3Bar-w) !important;
  height: var(--plc-h3Bar-h) !important;

  background: currentColor !important;
  flex: 0 0 auto !important;

  margin: 0 var(--plc-h3Bar-gap) 0 0 !important;
}

@media not all and (min-width: 960px){
  .p-company-LinkCards-head{
    font-size: var(--plc-h2-sp) !important;
  }
  .p-company-LinkCardsBox .p-company-LinkCards-head2{
    font-size: var(--plc-h3-sp) !important;
  }
}

/* ==================================================
  5) p-companyLinkCards（共通）
================================================== */
.p-companyLinkCards{
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
}

.p-companyLinkCards > .wp-block-group__inner-container{
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
}

/* ==================================================
  6) grid（既定：PC3列 / SP2列）
================================================== */
.p-companyLinkCards__grid.is-row{
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: stretch !important;

  gap: var(--plc-grid-gap-pc) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.p-companyLinkCards__grid.is-row > .wp-block-columns{
  flex: 0 0 calc((100% - (var(--plc-grid-gap-pc) * 2)) / 3) !important;
  max-width: calc((100% - (var(--plc-grid-gap-pc) * 2)) / 3) !important;

  margin: 0 !important;
  padding: 0 !important;

  justify-content: initial !important;
  gap: 0 !important;
}

.p-companyLinkCards__grid.is-row > .wp-block-columns > .wp-block-column{
  flex: 1 1 auto !important;
  width: 100% !important;
  margin: 0 !important;
}

@media not all and (min-width: 960px){
  .p-companyLinkCards__grid.is-row{
    gap: var(--plc-grid-gap-sp) !important;
  }
  .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 calc((100% - var(--plc-grid-gap-sp)) / 2) !important;
    max-width: calc((100% - var(--plc-grid-gap-sp)) / 2) !important;
  }
}

/* ==================================================
  7) カード（共通）
================================================== */
.p-companyLinkCards .p-chCardBlk{
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
  background: transparent;
}

.p-companyLinkCards .p-chCardBlk::before{
  content: "";
  position: absolute;
  inset: 0;
  background: #fff;
  transition: background-color .18s ease;
  z-index: 0;
}

.p-companyLinkCards .p-chCardBlk__media{
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #f3f5f8;
  position: relative;
  z-index: 2;
}

.p-companyLinkCards .p-chCardBlk__media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

.p-companyLinkCards .p-chCardBlk__body{
  position: relative;
  padding: 16px 18px 16px !important;
  background: transparent;
  z-index: 2;

  display: flex;
  align-items: center;
  gap: 12px;
}

.p-companyLinkCards .p-chCardBlk__ttl{
  margin: 0 !important;
  font-size: clamp(12px, 1.2vw, 14px);
  font-weight: 700;
  letter-spacing: .06em;
  color: #212121;
  line-height: 1.2;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .18s ease;
}

.p-companyLinkCards .p-chCardBlk__body::after{
  content: "";
  width: 10px;
  height: 10px;
  border-top: 2px solid #DF0515;
  border-right: 2px solid #DF0515;
  transform: rotate(45deg);
  transition: border-color .18s ease;
  margin-left: auto;
}

.p-companyLinkCards .p-chCardBlk__body .wp-block-group__inner-container,
.p-companyLinkCards .p-chCardBlk__body .is-row__inner-container{
  padding-right: 0 !important;
}

@media not all and (min-width: 960px){
  .p-companyLinkCards .p-chCardBlk__body{
    padding: 14px 14px 14px !important;
    gap: 10px;
  }
}

/* ==================================================
  8) 全面リンク（SP余白対策：buttonsをフロー外へ）
  - 修正：pointer-events:none を外してリンク復活
================================================== */
.p-companyLinkCards .p-chCardBlk > .wp-block-buttons{
  position: absolute !important;
  inset: 0 !important;
  z-index: 10 !important;           /* いちばん手前に */

  display: block !important;
  margin: 0 !important;
  padding: 0 !important;

  height: auto !important;
  min-height: 0 !important;

  line-height: 0 !important;
  font-size: 0 !important;

  overflow: visible !important;

  /* ▼ここが重要：none にしない（リンクが死にます） */
  pointer-events: auto !important;
}

.p-companyLinkCards .p-chCardBlk > .wp-block-buttons .wp-block-button{
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;

  height: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;

  /* 子aがクリックを取るので、ここはどちらでもOKですが safe に auto */
  pointer-events: auto !important;
}

/* カード全体をおおう「透明リンク」 */
.p-companyLinkCards .p-chCardBlk > .wp-block-buttons
.p-chCardBlk__btn .wp-block-button__link.wp-element-button{
  position: absolute !important;
  inset: 0 !important;
  z-index: 11 !important;

  display: block !important;
  width: 100% !important;
  height: 100% !important;

  padding: 0 !important;
  margin: 0 !important;

  min-height: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  color: transparent !important;
  text-indent: -9999px;

  pointer-events: auto !important;

  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
  outline: none !important;
}

.p-companyLinkCards .p-chCardBlk > .wp-block-buttons
.p-chCardBlk__btn .wp-block-button__link:focus,
.p-companyLinkCards .p-chCardBlk > .wp-block-buttons
.p-chCardBlk__btn .wp-block-button__link:focus-visible,
.p-companyLinkCards .p-chCardBlk > .wp-block-buttons
.p-chCardBlk__btn .wp-block-button__link:active{
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* カードの中身はリンクの下にいても hover は親で効きます */
.p-companyLinkCards .p-chCardBlk{ position: relative; }


/* ==================================================
  9) ホバー（通常）
================================================== */
.p-companyLinkCards .p-chCardBlk:hover::before,
.p-companyLinkCards .p-chCardBlk:focus-within::before{
  background: #DF0515;
}

.p-companyLinkCards .p-chCardBlk:hover .p-chCardBlk__ttl,
.p-companyLinkCards .p-chCardBlk:focus-within .p-chCardBlk__ttl{
  color: #fff;
}

.p-companyLinkCards .p-chCardBlk:hover .p-chCardBlk__body::after,
.p-companyLinkCards .p-chCardBlk:focus-within .p-chCardBlk__body::after{
  border-color: #fff;
}

/* ==================================================
  10) mini
================================================== */
.p-company-LinkCardsBox_mini > .swell-block-fullWide__inner{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.p-company-LinkCardsBox_mini{
  background: transparent;
}

.p-company-LinkCardsBox_mini .p-companyLinkCards{
  padding-bottom: 15px !important;
}

/* SPは2列計算と同じgapにする */
.p-company-LinkCardsBox_mini .p-companyLinkCards__grid.is-row{
  gap: var(--plc-grid-gap-sp) !important;
}

.p-company-LinkCardsBox_mini .p-companyLinkCards .p-chCardBlk__body{
  padding-top: var(--plc-mini-bodyPadY) !important;
  padding-bottom: var(--plc-mini-bodyPadY) !important;
}

@media not all and (min-width: 960px){
  .p-company-LinkCardsBox_mini .p-companyLinkCards__grid.is-row{
    padding-left: var(--plc-mini-padX-sp) !important;
    padding-right: var(--plc-mini-padX-sp) !important;
  }
}

@media (min-width: 960px){
  .p-company-LinkCardsBox_mini .p-companyLinkCards__grid.is-row{
    gap: clamp(20px, 3vw, 50px) !important;
    justify-content: center !important;
  }
  .p-company-LinkCardsBox_mini .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 200px !important;
    max-width: 200px !important;
  }
}

/* ==================================================
  11) hcard（共通）
================================================== */
.p-companyLinkCards--hcard .p-chCardBlk::before{
  content: none !important;
}

.p-companyLinkCards--hcard .p-chCardBlk{
  display: grid !important;
  grid-template-columns: var(--plc-hcard-mediaW-pc) minmax(0, 1fr) !important;
  align-items: stretch !important;
}

.p-companyLinkCards--hcard .p-chCardBlk__media,
.p-companyLinkCards--hcard .p-chCardBlk__media_logo{
  aspect-ratio: auto !important;
  height: 100% !important;
  border-radius: 14px 0 0 14px !important;
}

.p-companyLinkCards--hcard .p-chCardBlk__body{
  padding: var(--plc-hcard-bodyPadY) var(--plc-hcard-bodyPadX) !important;
  height: 100% !important;
  border-radius: 0 14px 14px 0 !important;
  overflow: hidden !important;
}

.p-companyLinkCards--hcard .p-chCardBlk__body::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #fff !important;
  transition: background-color .18s ease !important;
  z-index: 0 !important;
}

.p-companyLinkCards--hcard .p-chCardBlk__ttl{
  position: relative !important;
  z-index: 1 !important;
  font-weight: 500 !important;
}

.p-companyLinkCards--hcard .p-chCardBlk__body::after{
  position: relative !important;
  z-index: 1 !important;
  margin-right: var(--plc-hcard-arrowPadR) !important;
}

.p-companyLinkCards--hcard .p-chCardBlk:hover .p-chCardBlk__body::before,
.p-companyLinkCards--hcard .p-chCardBlk:focus-within .p-chCardBlk__body::before{
  background: #DF0515 !important;
}

.p-companyLinkCards--hcard .p-chCardBlk:hover .p-chCardBlk__ttl,
.p-companyLinkCards--hcard .p-chCardBlk:focus-within .p-chCardBlk__ttl{
  color: #fff !important;
}

.p-companyLinkCards--hcard .p-chCardBlk:hover .p-chCardBlk__body::after,
.p-companyLinkCards--hcard .p-chCardBlk:focus-within .p-chCardBlk__body::after{
  border-color: #fff !important;
}

/* --- SP調整（hcard） --- */
@media not all and (min-width: 960px){

  /* カード間のアキ（上下のボタン間の余白＝ここ） */
  .p-companyLinkCards--hcard .p-companyLinkCards__grid.is-row{
    gap: 30px !important;
  }

  /* SP：横幅 */
  .p-companyLinkCards--hcard .p-chCardBlk{
    grid-template-columns: var(--plc-hcard-mediaW-sp) minmax(0, 1fr) !important;
  }

  /* SP：高さ固定（タテ中央は維持） */
  .p-companyLinkCards--hcard .p-chCardBlk{
    height: 96px !important;
  }

  /* SP：bodyは中央のまま、上下paddingだけ0（余白増え防止） */
  .p-companyLinkCards--hcard .p-chCardBlk__body{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* SP：body内コンテナの余白つぶし */
  .p-companyLinkCards--hcard .p-chCardBlk__body > .wp-block-group__inner-container,
  .p-companyLinkCards--hcard .p-chCardBlk__body > .is-row__inner-container{
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
  }

  /* グループ自体の外側余白（必要ならここ） */
  .p-companyLinkCards.p-companyLinkCards--hcard{
    margin-top: 25px !important;
    margin-bottom: 30px !important;
  }
}

/* ==================================================
  11.5) hbtn（横長ボタン）
================================================== */
.p-companyLinkCards--hbtn .p-chCardBlk{
  display: grid !important;
  grid-template-columns:
    calc(var(--plc-hcard-mediaW-pc) * var(--plc-hbtn-mediaWScale))
    minmax(0, 1fr) !important;
  align-items: stretch !important;

  box-shadow: none !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  background: #fff !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk::before{
  content: none !important;
}

@media not all and (min-width: 960px){
  .p-companyLinkCards--hbtn .p-chCardBlk{
    grid-template-columns:
      calc(var(--plc-hcard-mediaW-sp) * var(--plc-hbtn-mediaWScale))
      minmax(0, 1fr) !important;
  }
}

.p-companyLinkCards--hbtn .p-chCardBlk__media,
.p-companyLinkCards--hbtn .p-chCardBlk__media_logo{
  aspect-ratio: auto !important;
  height: 100% !important;
  border-radius: 14px 0 0 14px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: transparent !important;

  padding-top: var(--plc-hbtn-mediaPadY) !important;
  padding-bottom: var(--plc-hbtn-mediaPadY) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk__media img{
  width: auto !important;
  height: auto !important;
  max-width: var(--plc-hbtn-iconMax) !important;
  max-height: var(--plc-hbtn-iconMax) !important;
  object-fit: contain !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk__media_logo img{
  width: auto !important;
  height: auto !important;
  max-width: var(--plc-hbtn-logoMaxW) !important;
  max-height: var(--plc-hbtn-logoMaxH) !important;
  object-fit: contain !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk__body{
  padding-top: var(--plc-hbtn-bodyPadY) !important;
  padding-bottom: var(--plc-hbtn-bodyPadY) !important;
  padding-left: var(--plc-hbtn-bodyPadX) !important;
  padding-right: var(--plc-hbtn-bodyPadX) !important;

  height: 100% !important;
  border-radius: 0 14px 14px 0 !important;

  background: #fff !important;
  overflow: hidden !important;

  justify-content: flex-start !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk__body::after{
  margin-right: var(--plc-hbtn-arrowPadR) !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk__ttl{
  font-size: var(--plc-hbtn-ttlSize) !important;
  font-weight: var(--plc-hbtn-ttlWeight) !important;
  letter-spacing: .04em !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk:hover .p-chCardBlk__ttl,
.p-companyLinkCards--hbtn .p-chCardBlk:focus-within .p-chCardBlk__ttl{
  color: var(--plc-accent) !important;
}

.p-companyLinkCards--hbtn .p-chCardBlk:hover .p-chCardBlk__body::after,
.p-companyLinkCards--hbtn .p-chCardBlk:focus-within .p-chCardBlk__body::after{
  border-color: var(--plc-accent) !important;
}

@media (min-width: 960px){
  .p-companyLinkCards--hbtn .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 calc((100% - var(--plc-grid-gap-pc)) / 2) !important;
    max-width: calc((100% - var(--plc-grid-gap-pc)) / 2) !important;
  }
}

@media not all and (min-width: 960px){
  .p-companyLinkCards--hbtn .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* ==================================================
  12) 会社情報（Box内の hcard だけ）
================================================== */
.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-companyLinkCards__grid.is-row{
  justify-content: flex-start !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (min-width: 960px){
  .p-company-LinkCardsBox .p-companyLinkCards--hcard .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 calc((100% - var(--plc-grid-gap-pc)) / 2) !important;
    max-width: calc((100% - var(--plc-grid-gap-pc)) / 2) !important;
  }
}

@media not all and (min-width: 960px){
  .p-company-LinkCardsBox .p-companyLinkCards--hcard .p-companyLinkCards__grid.is-row > .wp-block-columns{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk{
  grid-template-columns:
    calc(var(--plc-hcard-mediaW-pc) * var(--plc-coMediaWScale))
    minmax(0, 1fr) !important;
}

@media not all and (min-width: 960px){
  .p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk{
    grid-template-columns:
      calc(var(--plc-hcard-mediaW-sp) * var(--plc-coMediaWScale))
      minmax(0, 1fr) !important;
  }
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__media,
.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__media_logo{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #f3f5f8 !important;

  padding-top: var(--plc-coMediaPadY) !important;
  padding-bottom: var(--plc-coMediaPadY) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;

  aspect-ratio: auto !important;
  height: 100% !important;
  border-radius: 14px 0 0 14px !important;
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__media img{
  width: auto !important;
  height: auto !important;

  max-width: var(--plc-coIconMax) !important;
  max-height: var(--plc-coIconMax) !important;

  object-fit: contain !important;
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__media_logo img{
  width: auto !important;
  height: auto !important;

  max-width: min(100%, var(--plc-coLogoMaxW)) !important;
  max-height: var(--plc-coLogoMaxH) !important;

  object-fit: contain !important;
  display: block !important;
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__body{
  justify-content: flex-start !important;

  padding-top: var(--plc-coBodyPadY) !important;
  padding-bottom: var(--plc-coBodyPadY) !important;
}

.p-company-LinkCardsBox .p-companyLinkCards--hcard .p-chCardBlk__body .p-chCardBlk__ttl{
  font-size: var(--plc-coTtlSize) !important;
  letter-spacing: .04em !important;
}

/* ==================================================
  13) 最終上書き：SPで Box内 hcard ロゴを大きく（ここが勝つ）
================================================== */
@media not all and (min-width: 960px){

  .p-company-LinkCardsBox .p-companyLinkCards.p-companyLinkCards--hcard
  .p-chCardBlk__media_logo{
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  .p-company-LinkCardsBox .p-companyLinkCards.p-companyLinkCards--hcard
  .p-chCardBlk__media_logo img{
    width: var(--plc-sp-logoW) !important;   /* ← SPロゴ幅はココで調整 */
    max-width: none !important;
    height: auto !important;
    max-height: var(--plc-sp-logoMaxH) !important;
    object-fit: contain !important;
    display: block !important;
  }

  .p-company-LinkCardsBox .p-companyLinkCards.p-companyLinkCards--hcard
  figure.p-chCardBlk__media_logo{
    margin: 0 !important;
  }
}




/* ==================================================
  p-company-quote（引用ブロック）
  - 親がせまくても、引用だけ 1080 幅の箱にする
================================================== */

/* 引用ブロック本体を「1080の箱」にして、中央へ置く */
.p-company-quote{
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: min(1080px, calc(100vw - 32px)) !important; /* 画面がせまい時は左右16px確保 */
  max-width: 1080px !important;
  margin: 0 !important;
  box-sizing: border-box;
}

/* inner-container 側の「中央寄せ・max幅」指定を解除 */
.p-company-quote > .wp-block-group__inner-container{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

/* テキスト */
.p-company-quoteTxt{
  font-size: 0.7rem;
  line-height: 1.7;
  margin: 0;
  text-align: left;
  overflow-wrap: anywhere;
  word-break: break-word;
}


/* ==================================================
  オーネット公式SNS（PC/SP）
================================================== */
.p-company-snsFollow{
  /* アイコン同士の間隔（5つ想定で少し詰める） */
  --sns-gap: clamp(14px, 1.6vw, 20px);

  /* PC：アイコン列 ↔ ボタンの間隔（安定させる） */
  --pc-between: clamp(26px, 3.6vw, 44px);

  /* アイコン高さ（画像の高さ） */
  --icon-h: 50px;

  /* キャプション */
  --cap-gap: 6px;
  --cap-size: 10px;
  --cap-lh: 1.15;
  --cap-color: #212121;

  /* ボタン（PC） */
  --btn-h-pc: 60px;
  --btn-w-pc: clamp(320px, 25vw, 360px);
  --btn-max-pc: 360px;

  /* ボタン（SP） */
  --btn-h-sp: 64px;
  --btn-w-sp: min(92%, 560px);

  /* SP：アイコン↔ボタン 縦余白 */
  --sp-stack-gap: clamp(18px, 4.2vw, 28px);

  --btn-green: #06c755;
  --txt: #212121;

  background: #fff;
  padding: clamp(18px, 2.4vw, 30px) clamp(14px, 2.2vw, 26px);
}

/* ==================================================
  見出し（h4）: クラス誤記(-company...)も救済
================================================== */
.p-company-snsFollow h4.wp-block-heading.p-company-snsFollow__ttl,
.p-company-snsFollow h4.wp-block-heading.-company-snsFollow__ttl{
  text-align: center !important;
  color: var(--txt) !important;
  font-weight: 700 !important;
  font-size: clamp(20px, 2vw, 24px) !important;
  line-height: 1.2 !important;

  margin: 0 0 clamp(24px, 3vw, 30px) !important;
  padding: 0 !important;

  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.p-company-snsFollow h4.wp-block-heading.p-company-snsFollow__ttl::before,
.p-company-snsFollow h4.wp-block-heading.p-company-snsFollow__ttl::after,
.p-company-snsFollow h4.wp-block-heading.-company-snsFollow__ttl::before,
.p-company-snsFollow h4.wp-block-heading.-company-snsFollow__ttl::after{
  content: none !important;
  display: none !important;
}

/* ==================================================
  Columns（PC）
  - 余白は margin-left ではなく gap で固定
  - タテ中央ソロエ（ボタンとアイコン画像を中央でそろえる）
================================================== */
@media (min-width: 960px){
  .p-company-snsFollow__cols.wp-block-columns{
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center !important;

    column-gap: var(--pc-between) !important;
    gap: var(--pc-between) !important;

    margin: 0 !important;
  }

  .p-company-snsFollow__cols.wp-block-columns > .wp-block-column{
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;

    display: flex;
    align-items: center;
  }

  .p-company-snsFollow__cols.wp-block-columns > .wp-block-column:last-child{
    justify-content: flex-end;
  }
}

/* ==================================================
  アイコン列（入れ子対応）
  - 基本：上ソロエ（キャプション有無でも画像上辺がそろう）
================================================== */
.p-company-snsFollow__icons{
  margin: 0;
  display: flex;
  align-items: flex-start;
}

.p-company-snsFollow__icons > .wp-block-group__inner-container{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  gap: var(--sns-gap);
  margin: 0;
}

/* figure：画像→キャプションのタテ積み */
.p-company-snsFollow__icons .p-company-snsFollow__icon{
  margin: 0 !important;
  flex: 0 0 auto;
  width: auto !important;
  max-width: none !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;

  min-height: var(--icon-h);
  line-height: 1 !important;
}

/* リンクはブロック化して、画像の上辺を安定させる */
.p-company-snsFollow__icon > a{
  display: block;
  line-height: 0;
}

/* 画像は高さ固定だけ */
.p-company-snsFollow__icon img{
  display: block;
  height: var(--icon-h);
  width: auto;
  margin: 0;
}

/* キャプション（任意） */
.p-company-snsFollow__icon .wp-element-caption{
  display: block !important;
  margin: var(--cap-gap) 0 0 !important;
  padding: 0 !important;

  font-size: var(--cap-size) !important;
  font-weight: 500;
  line-height: var(--cap-lh) !important;
  text-align: center !important;

  color: var(--cap-color) !important;

  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ==================================================
  PC：キャプション分で高さがズレないようにする
  - キャプションをabsoluteで「画像の下」に配置
  - figure自体の高さは「画像の高さ」だけに固定
  → ボタンとアイコン画像が横並びでキレイにそろう
================================================== */
@media (min-width: 960px){
  .p-company-snsFollow__icons,
  .p-company-snsFollow__icons > .wp-block-group__inner-container{
    overflow: visible;
  }

  .p-company-snsFollow__icons .p-company-snsFollow__icon{
    position: relative;
    height: var(--icon-h);
    min-height: 0;
    justify-content: center !important;
  }

  .p-company-snsFollow__icon .wp-element-caption{
    position: absolute;
    top: calc(var(--icon-h) + var(--cap-gap));
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    white-space: nowrap;
    margin: 0 !important;
  }
}

/* ==================================================
  LINEボタン（PC）
================================================== */
.p-company-snsFollow__btn{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;

  width: var(--btn-w-pc) !important;
  max-width: var(--btn-max-pc) !important;

  min-height: var(--btn-h-pc);
  padding: 8px 18px;

  background: var(--btn-green);
  border-radius: 999px;
  text-decoration: none;
  text-align: center;

  color: #fff;
  font-weight: 700;
}

.p-company-snsFollow__btnTop{
  font-size: 12px;
  line-height: 1.05;
  letter-spacing: 0.02em;
  opacity: 0.95;
  white-space: nowrap;
}

.p-company-snsFollow__btnMain{
  font-size: clamp(20px, 2.1vw, 28px);
  line-height: 1.05;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

/* ==================================================
  SP
  - 全体中央寄せ
  - ボタン幅は横長
================================================== */
@media not all and (min-width: 960px){
  .p-company-snsFollow__cols.wp-block-columns{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start;
    gap: var(--sp-stack-gap) !important;
    margin: 0 !important;
  }

  .p-company-snsFollow__cols.wp-block-columns > .wp-block-column{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 !important;
  }

  .p-company-snsFollow__btn{
    width: var(--btn-w-sp) !important;
    max-width: 560px !important;
    min-height: var(--btn-h-sp);
    margin: 0 auto;
    padding: 10px 18px;
  }

  .p-company-snsFollow__btnMain{
    font-size: clamp(22px, 6.2vw, 34px);
  }
}


/* オーネット誕生秘話 */
/* ==================================================
  p-our-story（Our Story）CSS：差し替え用（全文）
  - 既存：.p-our-story__sec--gray（維持）
  - 追加：.p-our-story__sec--pink（PC：右画像＋左テキスト＋重なり / SP：右ピタ）
================================================== */

.p-our-story{
  /* フルワイド内コンテンツ幅 */
  --wrapW: 1180px;

  --padSec: clamp(18px, 4vw, 34px);

  --c-ink: #212121;
  --bg-gray: #f3f5f8;
  --bg-grayBox: #e9edf4;
  --bg-card: #fff;

  /* 追加（ピンク） */
  --bg-pink: #fff7f8;       /* フルワイド背景 */
  --bg-pinkBox: #ffeef0;    /* 画像枠背景 */

  /* =========================
     PC：共通レイアウト
  ========================= */
  --pc-sidePad: clamp(12px, 2vw, 24px);

  --pc-mediaInset: clamp(14px, 2.2vw, 28px);
  --pc-mediaW: clamp(360px, 26vw, 440px);

  --pc-overlapX: clamp(30px, 4vw, 80px);

  /* 白テキスト枠：上下余白（別々に調整） */
  --pc-cardPadTop: clamp(60px, 15vw, 80px);
  --pc-cardPadBottom: clamp(24px, 2.8vw, 42px);

  --pc-cardPadL: clamp(16px, 1.8vw, 26px);
  --pc-cardPadR: clamp(18px, 2.2vw, 32px);

  /* 重なりぶん、文章ガード */
  --pc-textGuard: calc(var(--pc-overlapX) + 26px);

  /* 画像枠パディング */
  --pc-photoPad: clamp(12px, 1.6vw, 20px);
  --pc-photoMax: 310px;

  /* H2-H3間（グレー側見出し用） */
  --pc-h2h3-gap: clamp(18px, 2vw, 20px);

  /* p と リスト の間だけ空ける（グレー側） */
  --pc-pListGap: clamp(12px, 1.4vw, 18px);

  /* 画像枠の上辺を「p上辺」に合わせるための下げ量 */
  --pc-mediaTopOffset: var(--pc-cardPadTop);

  /* =========================
     PC：ピンク（テキスト枠）だけ個別に余白を持たせる
  ========================= */
  --pc-pinkCardPadTop: clamp(24px, 2.8vw, 42px);
  --pc-pinkCardPadBottom: clamp(24px, 2.8vw, 42px);
  --pc-pinkCardPadL: clamp(20px, 3vw, 30px); /* 20px, 4.2vw, 40px */
  --pc-pinkCardPadR: clamp(14px, 2vw, 20px);

  /* 右側に画像が重なるぶんのガード（必要ならピンク専用にもできる） */
  --pc-pinkTextGuard: var(--pc-textGuard);	

  /* 追加：ピンク画像わくの右余白 */
  --pc-pinkMediaRight: clamp(50px, 7vw, 80px);

  /* =========================
     SP（～959px。タブレットもココ）
  ========================= */
  --sp-grayPadV: clamp(20px, 5.4vw, 34px);

  /* 端に残す余白（グレー＝右 / ピンク＝左） */
  --sp-edgeGap: clamp(14px, 5vw, 26px);

  /* ★ピンク：左の白余白（＝外側） */
  --sp-pinkWhiteGap: var(--sp-edgeGap);

  /* ★ピンク：背景内のピンク余白（＝内側） */
  --sp-pinkInnerGap: var(--sp-edgeGap);

  /* グレー：見出しの左基準 */
  --sp-headLeft: clamp(22px, 9vw, 60px);

  /* グレー：白わく内パディング */
  --sp-cardPadX: clamp(24px, 7.2vw, 40px);
  --sp-cardPadT: clamp(18px, 5vw, 22px);
  --sp-cardPadB: clamp(20px, 5.4vw, 26px);

  /* 見出しサイズ（グレー側） */
  --headEnSize-pc: clamp(30px, 4vw, 42px);
  --headEnSize-sp: clamp(34px, 9vw, 52px);

  --headJpSize-pc: clamp(16px, 1.5vw, 20px);
  --headJpSize-sp: clamp(18px, 1.8vw, 24px);

  /* 見出しの出し量（グレー側） */
  --headOutExtra-pc: clamp(8px, 1.2vw, 16px);
  --headOut-sp: clamp(10px, 3.2vw, 16px);

  /* 見出しぶん確保（グレー側） */
  --sp-headSpace: clamp(64px, 14vw, 92px);

  /* SP：H2-H3間（グレー側） */
  --sp-h2h3-gap: clamp(14px, 3.2vw, 22px);

  /* SP：H3と画像枠の間（グレー側） */
  --sp-h3media-gap: clamp(16px, 4vw, 30px);

  /* ピンク：SPカード内余白 */
  --sp-pinkCardPadX: clamp(20px, 6.4vw, 34px);
  --sp-pinkCardPadT: clamp(18px, 5vw, 22px);
  --sp-pinkCardPadB: clamp(20px, 5.4vw, 26px);

  /* ピンク：SP画像枠余白（背景を見せる） */
  --sp-pinkPhotoPad: clamp(12px, 4vw, 18px);

  color: var(--c-ink);
  overflow-x: hidden;
  box-sizing: border-box;
}

.p-our-story *{ box-sizing: border-box; }

/* ==================================================
  セクション共通
================================================== */
.p-our-story__sec{
  padding: var(--padSec) 0;
  position: relative;
  overflow: visible;
}

/* グレー（既存） */
.p-our-story__sec--gray{
  background: var(--bg-gray);
}

/* ピンク（追加） */
.p-our-story__sec--pink{
  background: var(--bg-pink);
}

.p-our-story__layout{
  max-width: var(--wrapW);
  margin: 0 auto;
  padding: 0 var(--padSec);
  position: relative;
}

.p-our-story__layout > .wp-block-group__inner-container{
  width: 100%;
  overflow: visible;
}

/* ==================================================
  見出し（H2/H3）※グレー側だけ
================================================== */
.p-our-story__heads{
  position: relative;
  z-index: 6;
}

.p-our-story__heads .wp-block-heading,
.p-our-story__headEn,
.p-our-story__headJp{
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.p-our-story__heads .wp-block-heading:before,
.p-our-story__heads .wp-block-heading:after,
.p-our-story__headEn:before,
.p-our-story__headEn:after,
.p-our-story__headJp:before,
.p-our-story__headJp:after{
  content: none !important;
}

/* Our Story（英） */
.p-our-story__headEn{
  color: #DF0515;
  font-size: var(--headEnSize-pc);
  font-weight: 700;
  line-height: 1.12;
}

/* オーネット誕生秘話（日） */
.p-our-story__headJp{
  color: #212121;
  font-size: var(--headJpSize-pc);
  font-weight: 700;
  line-height: 1.3;

  margin-top: var(--pc-h2h3-gap) !important;

  position: relative;
  padding-bottom: clamp(10px, 1.2vw, 14px) !important;
}

/* 赤い下線 */
.p-our-story__headJp::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: clamp(62px, 6vw, 92px);
  height: 3px;
  background: #DF0515;
  border-radius: 99px;
}

/* ==================================================
  画像枠（グレー：既存）
================================================== */
.p-our-story__photo{
  background: var(--bg-grayBox);
  padding: var(--pc-photoPad);
  margin: 0 !important;
  position: relative;
  text-align: center;
}

.p-our-story__photo img{
  width: 100%;
  height: auto;
  display: block;
  max-width: var(--pc-photoMax);
  margin: 0 auto;
}

/* ==================================================
  画像枠（ピンク：追加）
================================================== */
.p-our-story__pinkPhoto{
  background: var(--bg-pinkBox);
  padding: var(--pc-photoPad);
  margin: 0 !important;
  position: relative;
  text-align: center;
}

.p-our-story__pinkPhoto img{
  width: 100%;
  height: auto;
  display: block;
  max-width: var(--pc-photoMax);
  margin: 0 auto;
}

/* キャプション（ピンク） */
.p-our-story__pinkPhoto figcaption,
.p-our-story__pinkPhoto .wp-element-caption{
  margin-top: clamp(8px, 1vw, 12px);
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.4;
  color: #212121;
  text-align: center;
}

/* ==================================================
  テキスト枠（グレー：既存）
================================================== */
.p-our-story__card{
  background: var(--bg-card);
  padding-top: var(--pc-cardPadTop);
  padding-bottom: var(--pc-cardPadBottom);

  /* 左側に画像が重なる想定 */
  padding-left: calc(var(--pc-cardPadL) + var(--pc-textGuard));
  padding-right: var(--pc-cardPadR);
}

.p-our-story__card > .wp-block-group__inner-container{
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
}

/* ==================================================
  テキスト枠（ピンク：追加）
  - 右側に画像が重なる想定（左右反転）
================================================== */
.p-our-story__pinkCard{
  background: var(--bg-card);

  /* ★ピンク専用：上下 */
  padding-top: var(--pc-pinkCardPadTop);
  padding-bottom: var(--pc-pinkCardPadBottom);

  /* ★ピンク専用：左右（右は重なりガード込み） */
  padding-left: var(--pc-pinkCardPadL);
  padding-right: calc(var(--pc-pinkCardPadR) + var(--pc-pinkTextGuard));
}

.p-our-story__pinkCard > .wp-block-group__inner-container{
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
}

/* ==================================================
  文章共通
================================================== */
.p-our-story__layout p{
  margin: 0 !important;
  line-height: 1.9;
  font-size: clamp(14px, 1vw, 16px);
  text-align: left;
}

.p-our-story__layout li{
  margin: 0 !important;
  font-size: clamp(10px, 0.5vw, 12px);
  text-align: left;
}

/* グレー：p と リスト の間だけ余白 */
.p-our-story__card p + :is(ul, ol, .wp-block-list),
.p-our-story__card :is(ul, ol, .wp-block-list) + p{
  margin-top: var(--pc-pListGap) !important;
}

/* ピンク：p間の余白（HTMLにu-mb-0があるので最小補助） */
.p-our-story__pinkCard p + p{
  margin-top: clamp(12px, 1.4vw, 18px) !important;
}

/* ==================================================
  PC（960px以上）
================================================== */
@media (min-width: 960px){

  .p-our-story .swell-block-fullWide__inner{
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    --swl-fw_inner_pad: 0 !important;
  }

  .p-our-story__layout{
    max-width: none;
    margin: 0;
    padding: 0;
  }

  /* ------------------------------
    グレー（既存）：画像＝左 / テキスト＝右
  ------------------------------ */
  .p-our-story__sec--gray{
    overflow: visible !important;
    position: relative;
  }

  .p-our-story__sec--gray .p-our-story__layout > .wp-block-group__inner-container{
    display: grid;
    grid-template-columns: minmax(0, var(--pc-mediaW)) 1fr;
    align-items: start;

    width: min(100%, var(--wrapW));
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--pc-sidePad);
    padding-right: var(--pc-sidePad);

    padding-top: 0 !important;
    position: relative;
  }

  .p-our-story__sec--gray .p-our-story__heads{
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;

    width: min(100%, var(--wrapW)) !important;
    padding-left: var(--pc-sidePad) !important;
    padding-right: var(--pc-sidePad) !important;

    transform: translateX(-50%) translateY(
      calc(-1 * (var(--padSec) + var(--headOutExtra-pc)))
    ) !important;

    z-index: 20 !important;
  }

  .p-our-story__sec--gray .p-our-story__heads :is(.p-our-story__headEn, h2.wp-block-heading){
    font-size: var(--headEnSize-pc) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0.06em !important;
    color: #DF0515 !important;
  }

  .p-our-story__sec--gray .p-our-story__heads :is(.p-our-story__headJp, h3.wp-block-heading){
    font-size: var(--headJpSize-pc) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #111 !important;
    margin-top: var(--pc-h2h3-gap) !important;
  }

  .p-our-story__sec--gray .p-our-story__media{
    width: 100%;
    position: relative;
    z-index: 3;

    margin-left: var(--pc-mediaInset);
    padding-top: var(--pc-mediaTopOffset);

    align-self: start;
  }

  .p-our-story__sec--gray .p-our-story__card{
    width: 100%;
    position: relative;
    z-index: 1;

    margin-left: calc(-1 * var(--pc-overlapX));
    align-self: start;
  }

  /* ------------------------------
    ピンク（追加）：画像＝右 / テキスト＝左（重なり）
  ------------------------------ */
  .p-our-story__sec--pink{
    overflow: visible !important;
    position: relative;
  }

  .p-our-story__sec--pink .p-our-story__layout > .wp-block-group__inner-container{
    display: grid;
    grid-template-columns: 1fr minmax(0, var(--pc-mediaW));
    align-items: start;

    width: min(100%, var(--wrapW));
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--pc-sidePad);
    padding-right: var(--pc-sidePad);

    padding-top: 0 !important;
    position: relative;
  }

  .p-our-story__sec--pink .p-our-story__pinkMedia{
    grid-column: 2;
    grid-row: 1;

    width: 100%;
    position: relative;
    z-index: 3;

    margin-right: var(--pc-pinkMediaRight);
    margin-left: 0;

    padding-top: var(--pc-pinkCardPadTop) !important;

    justify-self: end;
    align-self: start !important;
  }

  .p-our-story__sec--pink .p-our-story__pinkCard{
    grid-column: 1;
    grid-row: 1;

    width: 100%;
    position: relative;
    z-index: 1;

    margin-right: calc(-1 * var(--pc-overlapX));
    margin-left: 0;

    align-self: start;
  }
}

/* ==================================================
  SP（～959px）※タブレットもSPと同じ
================================================== */
@media (max-width: 959px){

  .p-our-story .swell-block-fullWide__inner{
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    --swl-fw_inner_pad: 0 !important;
  }

  /* ------------------------------
    グレー（既存）：左ピタ（右に余白）
  ------------------------------ */
  .p-our-story__sec--gray{
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;

    background: var(--bg-gray) !important;

    padding-top: var(--sp-grayPadV) !important;
    padding-bottom: var(--sp-grayPadV) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow: visible !important;
    position: relative !important;
  }

  .p-our-story__sec--gray .wp-block-group:not(.p-our-story__card),
  .p-our-story__sec--gray .wp-block-image,
  .p-our-story__sec--gray figure{
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .p-our-story__sec--gray .p-our-story__layout{
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }

  .p-our-story__sec--gray .p-our-story__layout > .wp-block-group__inner-container{
    display: block;
    position: relative;
    padding-top: var(--sp-headSpace) !important;
  }

  .p-our-story__sec--gray .p-our-story__heads{
    position: absolute !important;
    top: 0 !important;

    left: calc(var(--sp-headLeft) + env(safe-area-inset-left)) !important;

    width: calc(100% - var(--sp-edgeGap) - var(--sp-headLeft)) !important;

    padding-left: 0 !important;
    padding-right: env(safe-area-inset-right) !important;

    transform: translateY(calc(-1 * (var(--sp-grayPadV) + var(--headOut-sp)))) !important;

    z-index: 20 !important;
  }

  .p-our-story__sec--gray .p-our-story__heads :is(.p-our-story__headEn, h2.wp-block-heading){
    font-size: var(--headEnSize-sp) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0.06em !important;
    color: #DF0515 !important;
  }

  .p-our-story__sec--gray .p-our-story__heads :is(.p-our-story__headJp, h3.wp-block-heading){
    font-size: var(--headJpSize-sp) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #111 !important;
    margin-top: var(--sp-h2h3-gap) !important;
  }

  .p-our-story__sec--gray .p-our-story__media{
    width: calc(100% - var(--sp-edgeGap)) !important;
    margin: 0 !important;

    padding-top: var(--sp-h3media-gap) !important;
    margin-top: 0 !important;

    position: relative;
    z-index: 3;
  }

  .p-our-story__sec--gray .p-our-story__photo{
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  .p-our-story__sec--gray .p-our-story__photo img{
    max-width: none !important;
    margin: 0 !important;
    display: block !important;
  }

  .p-our-story__sec--gray .p-our-story__media,
  .p-our-story__sec--gray .p-our-story__media figure,
  .p-our-story__sec--gray .p-our-story__media .wp-block-image{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .p-our-story__sec--gray .p-our-story__card{
    width: calc(100% - var(--sp-edgeGap)) !important;

    margin: 0 !important;
    margin-top: 0 !important;

    padding-top: var(--sp-cardPadT) !important;
    padding-bottom: var(--sp-cardPadB) !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    position: relative;
    z-index: 1;
  }

  .p-our-story__sec--gray .p-our-story__card > .wp-block-group__inner-container{
    padding-left: calc(var(--sp-cardPadX) + var(--sp-edgeGap) + env(safe-area-inset-left)) !important;
    padding-right: calc(var(--sp-cardPadX) + env(safe-area-inset-right)) !important;
    max-width: none !important;
  }

  /* ------------------------------
    ピンク（追加）：右ピタ＋左に白余白（左右対称）
    - 背景は ::before で「右側だけ」に描画
    - コンテンツ幅は「白余白 + ピンク余白」を差し引く
  ------------------------------ */
  .p-our-story__sec--pink{
    width: 100vw !important;
    margin-right: calc(50% - 50vw) !important;

    /* ★背景は直接塗らない（左を白に残す） */
    background: transparent !important;

    padding-top: var(--sp-grayPadV) !important;
    padding-bottom: var(--sp-grayPadV) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow: visible !important;
    position: relative !important;
  }

  /* ★右側だけにピンク背景を作る */
  .p-our-story__sec--pink::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: calc(100% - var(--sp-pinkWhiteGap));
    height: 100%;
    background: var(--bg-pink);
    z-index: 0;
  }

  /* 中身は背景より上へ */
  .p-our-story__sec--pink > .swell-block-fullWide__inner{
    position: relative;
    z-index: 1;
  }

  .p-our-story__sec--pink .wp-block-group,
  .p-our-story__sec--pink .wp-block-image,
  .p-our-story__sec--pink figure{
    margin: 0 !important;
  }

  .p-our-story__sec--pink .p-our-story__layout{
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }

  .p-our-story__sec--pink .p-our-story__layout > .wp-block-group__inner-container{
    display: block;
    position: relative;
  }

  /* ★画像・テキストの「器」：右ピタ＋左に余白（白→ピンク→内容） */
  .p-our-story__sec--pink .p-our-story__pinkMedia,
  .p-our-story__sec--pink .p-our-story__pinkCard{
    width: calc(100% - var(--sp-pinkWhiteGap) - var(--sp-pinkInnerGap)) !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    position: relative;
  }

  .p-our-story__sec--pink .p-our-story__pinkMedia{
    z-index: 3;
  }

  .p-our-story__sec--pink .p-our-story__pinkCard{
    z-index: 1;
  }

  /* 画像枠（ピンク）：背景 #ffeef0 を見せる */
  .p-our-story__sec--pink .p-our-story__pinkPhoto{
    background: var(--bg-pinkBox) !important;
    padding: var(--sp-pinkPhotoPad) !important;
    text-align: center !important;
  }

  .p-our-story__sec--pink .p-our-story__pinkPhoto img{
    max-width: none !important;
    width: 100% !important;
    display: block !important;
  }

  .p-our-story__sec--pink .p-our-story__pinkPhoto .wp-element-caption{
    padding-left: clamp(10px, 3vw, 14px);
    padding-right: clamp(10px, 3vw, 14px);
  }

  /* 画像枠 ↔ 白枠（ピンク）：余白ゼロ */
  .p-our-story__sec--pink .p-our-story__pinkMedia,
  .p-our-story__sec--pink .p-our-story__pinkMedia figure,
  .p-our-story__sec--pink .p-our-story__pinkMedia .wp-block-image{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* テキスト（ピンク）：内側パディングは通常でOK（白余白は幅側で表現済み） */
  .p-our-story__sec--pink .p-our-story__pinkCard{
    padding-top: var(--sp-pinkCardPadT) !important;
    padding-bottom: var(--sp-pinkCardPadB) !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .p-our-story__sec--pink .p-our-story__pinkCard > .wp-block-group__inner-container{
    padding-left: calc(var(--sp-pinkCardPadX) + env(safe-area-inset-left)) !important;
    padding-right: calc(var(--sp-pinkCardPadX) + env(safe-area-inset-right)) !important;
    max-width: none !important;
  }
}


/* 社長メッセージ */
/* ==================================================
  p-message（Message）
================================================== */
/* ==================================================
  1) 変数・ベース
================================================== */
.p-message{
  /* 幅・余白 */
  --pmsg-wrapW: 1180px;
  --pmsg-padSec: clamp(18px, 4vw, 34px);

  /* 色 */
  --pmsg-c-ink: #212121;
  --pmsg-bg-gray: #f3f5f8;
  --pmsg-bg-grayBox: #e9edf4;
  --pmsg-bg-card: #fff;

  --pmsg-bg-pink: #fff7f8;
  --pmsg-bg-pinkBox: #ffeef0;

  /* ------------------------------
    PC：共通レイアウト
  ------------------------------ */
  --pmsg-pc-sidePad: clamp(12px, 2vw, 24px);

  --pmsg-pc-mediaInset: clamp(14px, 2.2vw, 28px);
  --pmsg-pc-mediaW: clamp(360px, 26vw, 440px);

  --pmsg-pc-overlapX: clamp(30px, 4vw, 80px);

  /* 白テキスト枠：上下余白（別々） */
  --pmsg-pc-cardPadTop: clamp(60px, 15vw, 80px);
  --pmsg-pc-cardPadBottom: clamp(24px, 2.8vw, 42px);

  --pmsg-pc-cardPadL: clamp(16px, 1.8vw, 26px);
  --pmsg-pc-cardPadR: clamp(18px, 2.2vw, 32px);

  /* 重なりぶんのガード */
  --pmsg-pc-textGuard: calc(var(--pmsg-pc-overlapX) + 26px);

  /* 画像枠 */
  --pmsg-pc-photoPad: clamp(12px, 1.6vw, 20px);
  --pmsg-pc-photoMax: 500px;

  /* 見出し（グレー側） */
  --pmsg-pc-h2h3-gap: clamp(18px, 2vw, 20px);

  /* p と リスト の間（グレー側） */
  --pmsg-pc-pListGap: clamp(12px, 1.4vw, 18px);

  /* 画像枠の上辺を p 上辺に合わせる下げ量 */
  --pmsg-pc-mediaTopOffset: var(--pmsg-pc-cardPadTop);

  /* ------------------------------
    PC：ピンク（テキスト枠）
  ------------------------------ */
  --pmsg-pc-pinkCardPadTop: clamp(24px, 2.8vw, 42px);
  --pmsg-pc-pinkCardPadBottom: clamp(24px, 2.8vw, 42px);
  --pmsg-pc-pinkCardPadL: clamp(20px, 3vw, 30px);
  --pmsg-pc-pinkCardPadR: clamp(14px, 2vw, 20px);

  --pmsg-pc-pinkTextGuard: var(--pmsg-pc-textGuard);
  --pmsg-pc-pinkMediaRight: clamp(50px, 7vw, 80px);

  /* ------------------------------
    SP（～959px）
  ------------------------------ */
  --pmsg-sp-grayPadV: clamp(20px, 5.4vw, 34px);

  /* 端に残す余白（グレー＝右／ピンク＝左） */
  --pmsg-sp-edgeGap: clamp(14px, 5vw, 26px);

  /* ピンク：左の白余白（外）／ピンク余白（内） */
  --pmsg-sp-pinkWhiteGap: var(--pmsg-sp-edgeGap);
  --pmsg-sp-pinkInnerGap: var(--pmsg-sp-edgeGap);

  /* グレー：見出しの左基準 */
  --pmsg-sp-headLeft: clamp(22px, 9vw, 60px);

  /* グレー：白わく内 */
  --pmsg-sp-cardPadX: clamp(24px, 7.2vw, 40px);
  --pmsg-sp-cardPadT: clamp(18px, 5vw, 22px);
  --pmsg-sp-cardPadB: clamp(20px, 5.4vw, 26px);

  /* 見出しサイズ（グレー側） */
  --pmsg-headEnSize-pc: clamp(30px, 4vw, 42px);
  --pmsg-headEnSize-sp: clamp(34px, 9vw, 52px);

  --pmsg-headJpSize-pc: clamp(16px, 1.5vw, 20px);
  --pmsg-headJpSize-sp: clamp(18px, 1.8vw, 24px);

  /* 見出しの出し量（グレー側） */
  --pmsg-headOutExtra-pc: clamp(8px, 1.2vw, 16px);
  --pmsg-headOut-sp: clamp(10px, 3.2vw, 16px);

  /* 見出しぶん確保（グレー側） */
  --pmsg-sp-headSpace: clamp(64px, 14vw, 92px);

  /* SP：H2-H3間（グレー側） */
  --pmsg-sp-h2h3-gap: clamp(14px, 3.2vw, 22px);

  /* SP：H3と画像の間（グレー側） */
  --pmsg-sp-h3media-gap: clamp(16px, 4vw, 30px);

  /* ピンク：SPカード内 */
  --pmsg-sp-pinkCardPadX: clamp(20px, 6.4vw, 34px);
  --pmsg-sp-pinkCardPadT: clamp(18px, 5vw, 22px);
  --pmsg-sp-pinkCardPadB: clamp(20px, 5.4vw, 26px);

  /* ピンク：SP画像枠 */
  --pmsg-sp-pinkPhotoPad: clamp(12px, 4vw, 18px);

  /* ------------------------------
    追加：文章・署名（グレー側カード）
  ------------------------------ */
  --pmsg-cardP-gap: clamp(14px, 1.4vw, 18px);

  --pmsg-rep-pt: clamp(26px, 3vw, 44px);
  --pmsg-rep-role-size: clamp(12px, 1.3vw, 16px);
  --pmsg-rep-role-color: #212121;

  --pmsg-rep-nameGap: clamp(4px, 0.8vw, 10px);
  --pmsg-rep-name-size: clamp(20px, 2vw, 24px);
  --pmsg-rep-name-color: #212121;

  color: var(--pmsg-c-ink);
  overflow-x: hidden;
  box-sizing: border-box;
}

.p-message *{ box-sizing: border-box; }

/* ==================================================
  2) セクション共通
================================================== */
.p-message__sec{
  padding: var(--pmsg-padSec) 0;
  position: relative;
  overflow: visible;
}

.p-message__sec--gray{ background: var(--pmsg-bg-gray); }
.p-message__sec--pink{ background: var(--pmsg-bg-pink); }

.p-message__layout{
  max-width: var(--pmsg-wrapW);
  margin: 0 auto;
  padding: 0 var(--pmsg-padSec);
  position: relative;
}

.p-message__layout > .wp-block-group__inner-container{
  width: 100%;
  overflow: visible;
}

/* ==================================================
  3) 見出し（H2/H3）※グレー側だけ
================================================== */
.p-message__heads{
  position: relative;
  z-index: 6;
}

.p-message__heads .wp-block-heading,
.p-message__headEn,
.p-message__headJp{
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.p-message__heads .wp-block-heading:before,
.p-message__heads .wp-block-heading:after,
.p-message__headEn:before,
.p-message__headEn:after,
.p-message__headJp:before,
.p-message__headJp:after{
  content: none !important;
}

.p-message__headEn{
  color: #DF0515;
  font-size: var(--pmsg-headEnSize-pc);
  font-weight: 700;
  line-height: 1.12;
}

.p-message__headJp{
  color: #212121;
  font-size: var(--pmsg-headJpSize-pc);
  font-weight: 700;
  line-height: 1.3;

  margin-top: var(--pmsg-pc-h2h3-gap) !important;

  position: relative;
  padding-bottom: clamp(10px, 1.2vw, 14px) !important;
}

.p-message__headJp::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: clamp(62px, 6vw, 92px);
  height: 3px;
  background: #DF0515;
  border-radius: 99px;
}

/* ==================================================
  4) 画像枠
================================================== */
.p-message__photo{
  background: var(--pmsg-bg-grayBox);
  padding: var(--pmsg-pc-photoPad);
  margin: 0 !important;
  position: relative;
  text-align: center;
}

.p-message__photo img{
  width: 100%;
  height: auto;
  display: block;
  max-width: var(--pmsg-pc-photoMax);
  margin: 0 auto;
}

.p-message__pinkPhoto{
  background: var(--pmsg-bg-pinkBox);
  padding: var(--pmsg-pc-photoPad);
  margin: 0 !important;
  position: relative;
  text-align: center;
}

.p-message__pinkPhoto img{
  width: 100%;
  height: auto;
  display: block;
  max-width: var(--pmsg-pc-photoMax);
  margin: 0 auto;
}

.p-message__pinkPhoto figcaption,
.p-message__pinkPhoto .wp-element-caption{
  margin-top: clamp(8px, 1vw, 12px);
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.4;
  color: #212121;
  text-align: center;
}

/* ==================================================
  5) テキスト枠（グレー／ピンク）
================================================== */
.p-message__card{
  background: var(--pmsg-bg-card);
  padding-top: var(--pmsg-pc-cardPadTop);
  padding-bottom: var(--pmsg-pc-cardPadBottom);

  padding-left: calc(var(--pmsg-pc-cardPadL) + var(--pmsg-pc-textGuard));
  padding-right: var(--pmsg-pc-cardPadR);
}

.p-message__card > .wp-block-group__inner-container{
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
}

.p-message__pinkCard{
  background: var(--pmsg-bg-card);

  padding-top: var(--pmsg-pc-pinkCardPadTop);
  padding-bottom: var(--pmsg-pc-pinkCardPadBottom);

  padding-left: var(--pmsg-pc-pinkCardPadL);
  padding-right: calc(var(--pmsg-pc-pinkCardPadR) + var(--pmsg-pc-pinkTextGuard));
}

.p-message__pinkCard > .wp-block-group__inner-container{
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
}

/* ==================================================
  6) 文章（共通）
================================================== */
.p-message__layout p{
  margin: 0 !important;
  line-height: 1.9;
  font-size: clamp(14px, 1vw, 16px);
  text-align: left;
}

.p-message__layout li{
  margin: 0 !important;
  font-size: clamp(10px, 0.5vw, 12px);
  text-align: left;
}

.p-message__card p + :is(ul, ol, .wp-block-list),
.p-message__card :is(ul, ol, .wp-block-list) + p{
  margin-top: var(--pmsg-pc-pListGap) !important;
}

.p-message__pinkCard p + p{
  margin-top: clamp(12px, 1.4vw, 18px) !important;
}

/* ==================================================
  7) 文章（グレー側カード）：段落余白
================================================== */
.p-message__card > .wp-block-group__inner-container > p{
  margin: 0 0 var(--pmsg-cardP-gap) !important;
}

.p-message__card > .wp-block-group__inner-container > p:last-of-type{
  margin-bottom: 0 !important;
}

/* ==================================================
  8) 署名（代表者）
================================================== */
.p-message__representative{
  padding-top: var(--pmsg-rep-pt) !important;
  text-align: right !important;
}

.p-message__representative p{
  margin: 0 !important;
  text-align: right !important;
}

.p-message__text__role{
  font-size: var(--pmsg-rep-role-size) !important;
  color: var(--pmsg-rep-role-color) !important;
  line-height: 1.4 !important;
}

.p-message__text__name{
  margin-top: var(--pmsg-rep-nameGap) !important;
  font-size: var(--pmsg-rep-name-size) !important;
  color: var(--pmsg-rep-name-color) !important;
  line-height: 1.4 !important;
}

/* ==================================================
  9) PC（960px以上）
================================================== */
@media (min-width: 960px){

  .p-message .swell-block-fullWide__inner{
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    --swl-fw_inner_pad: 0 !important;
  }

  .p-message__layout{
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .p-message__sec--gray{
    overflow: visible !important;
    position: relative;
  }

  .p-message__sec--gray .p-message__layout > .wp-block-group__inner-container{
    display: grid;
    grid-template-columns: minmax(0, var(--pmsg-pc-mediaW)) 1fr;
    align-items: start;

    width: min(100%, var(--pmsg-wrapW));
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--pmsg-pc-sidePad);
    padding-right: var(--pmsg-pc-sidePad);

    padding-top: 0 !important;
    position: relative;
  }

  .p-message__sec--gray .p-message__heads{
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;

    width: min(100%, var(--pmsg-wrapW)) !important;
    padding-left: var(--pmsg-pc-sidePad) !important;
    padding-right: var(--pmsg-pc-sidePad) !important;

    transform: translateX(-50%) translateY(
      calc(-1 * (var(--pmsg-padSec) + var(--pmsg-headOutExtra-pc)))
    ) !important;

    z-index: 20 !important;
  }

  .p-message__sec--gray .p-message__heads :is(.p-message__headEn, h2.wp-block-heading){
    font-size: var(--pmsg-headEnSize-pc) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0.06em !important;
    color: #DF0515 !important;
  }

  .p-message__sec--gray .p-message__heads :is(.p-message__headJp, h3.wp-block-heading){
    font-size: var(--pmsg-headJpSize-pc) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #111 !important;
    margin-top: var(--pmsg-pc-h2h3-gap) !important;
  }

  .p-message__sec--gray .p-message__media{
    width: 100%;
    position: relative;
    z-index: 3;

    margin-left: var(--pmsg-pc-mediaInset);
    padding-top: var(--pmsg-pc-mediaTopOffset);

    align-self: start;
  }

  .p-message__sec--gray .p-message__card{
    width: 100%;
    position: relative;
    z-index: 1;

    margin-left: calc(-1 * var(--pmsg-pc-overlapX));
    align-self: start;
  }

  .p-message__sec--pink{
    overflow: visible !important;
    position: relative;
  }

  .p-message__sec--pink .p-message__layout > .wp-block-group__inner-container{
    display: grid;
    grid-template-columns: 1fr minmax(0, var(--pmsg-pc-mediaW));
    align-items: start;

    width: min(100%, var(--pmsg-wrapW));
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--pmsg-pc-sidePad);
    padding-right: var(--pmsg-pc-sidePad);

    padding-top: 0 !important;
    position: relative;
  }

  .p-message__sec--pink .p-message__pinkMedia{
    grid-column: 2;
    grid-row: 1;

    width: 100%;
    position: relative;
    z-index: 3;

    margin-right: var(--pmsg-pc-pinkMediaRight);
    margin-left: 0;

    padding-top: var(--pmsg-pc-pinkCardPadTop) !important;

    justify-self: end;
    align-self: start !important;
  }

  .p-message__sec--pink .p-message__pinkCard{
    grid-column: 1;
    grid-row: 1;

    width: 100%;
    position: relative;
    z-index: 1;

    margin-right: calc(-1 * var(--pmsg-pc-overlapX));
    margin-left: 0;

    align-self: start;
  }
}

/* ==================================================
  10) SP（～959px）
================================================== */
@media (max-width: 959px){

  .p-message .swell-block-fullWide__inner{
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    --swl-fw_inner_pad: 0 !important;
  }

  .p-message__sec--gray{
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;

    background: var(--pmsg-bg-gray) !important;

    padding-top: var(--pmsg-sp-grayPadV) !important;
    padding-bottom: var(--pmsg-sp-grayPadV) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow: visible !important;
    position: relative !important;
  }

  .p-message__sec--gray .wp-block-group:not(.p-message__card),
  .p-message__sec--gray .wp-block-image,
  .p-message__sec--gray figure{
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .p-message__sec--gray .p-message__layout{
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }

  .p-message__sec--gray .p-message__layout > .wp-block-group__inner-container{
    display: block;
    position: relative;
    padding-top: var(--pmsg-sp-headSpace) !important;
  }

  .p-message__sec--gray .p-message__heads{
    position: absolute !important;
    top: 0 !important;

    left: calc(var(--pmsg-sp-headLeft) + env(safe-area-inset-left)) !important;

    width: calc(100% - var(--pmsg-sp-edgeGap) - var(--pmsg-sp-headLeft)) !important;

    padding-left: 0 !important;
    padding-right: env(safe-area-inset-right) !important;

    transform: translateY(calc(-1 * (var(--pmsg-sp-grayPadV) + var(--pmsg-headOut-sp)))) !important;

    z-index: 20 !important;
  }

  .p-message__sec--gray .p-message__heads :is(.p-message__headEn, h2.wp-block-heading){
    font-size: var(--pmsg-headEnSize-sp) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0.06em !important;
    color: #DF0515 !important;
  }

  .p-message__sec--gray .p-message__heads :is(.p-message__headJp, h3.wp-block-heading){
    font-size: var(--pmsg-headJpSize-sp) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #111 !important;
    margin-top: var(--pmsg-sp-h2h3-gap) !important;
  }

  .p-message__sec--gray .p-message__media{
    width: calc(100% - var(--pmsg-sp-edgeGap)) !important;
    margin: 0 !important;

    padding-top: var(--pmsg-sp-h3media-gap) !important;
    margin-top: 0 !important;

    position: relative;
    z-index: 3;
  }

  .p-message__sec--gray .p-message__photo{
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  .p-message__sec--gray .p-message__photo img{
    max-width: none !important;
    margin: 0 !important;
    display: block !important;
  }

  .p-message__sec--gray .p-message__media,
  .p-message__sec--gray .p-message__media figure,
  .p-message__sec--gray .p-message__media .wp-block-image{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .p-message__sec--gray .p-message__card{
    width: calc(100% - var(--pmsg-sp-edgeGap)) !important;

    margin: 0 !important;
    margin-top: 0 !important;

    padding-top: var(--pmsg-sp-cardPadT) !important;
    padding-bottom: var(--pmsg-sp-cardPadB) !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    position: relative;
    z-index: 1;
  }

  .p-message__sec--gray .p-message__card > .wp-block-group__inner-container{
    padding-left: calc(var(--pmsg-sp-cardPadX) + var(--pmsg-sp-edgeGap) + env(safe-area-inset-left)) !important;
    padding-right: calc(var(--pmsg-sp-cardPadX) + env(safe-area-inset-right)) !important;
    max-width: none !important;
  }

  .p-message__sec--pink{
    width: 100vw !important;
    margin-right: calc(50% - 50vw) !important;

    background: transparent !important;

    padding-top: var(--pmsg-sp-grayPadV) !important;
    padding-bottom: var(--pmsg-sp-grayPadV) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow: visible !important;
    position: relative !important;
  }

  .p-message__sec--pink::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: calc(100% - var(--pmsg-sp-pinkWhiteGap));
    height: 100%;
    background: var(--pmsg-bg-pink);
    z-index: 0;
  }

  .p-message__sec--pink > .swell-block-fullWide__inner{
    position: relative;
    z-index: 1;
  }

  .p-message__sec--pink .wp-block-group,
  .p-message__sec--pink .wp-block-image,
  .p-message__sec--pink figure{
    margin: 0 !important;
  }

  .p-message__sec--pink .p-message__layout{
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }

  .p-message__sec--pink .p-message__layout > .wp-block-group__inner-container{
    display: block;
    position: relative;
  }

  .p-message__sec--pink .p-message__pinkMedia,
  .p-message__sec--pink .p-message__pinkCard{
    width: calc(100% - var(--pmsg-sp-pinkWhiteGap) - var(--pmsg-sp-pinkInnerGap)) !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    position: relative;
  }

  .p-message__sec--pink .p-message__pinkMedia{ z-index: 3; }
  .p-message__sec--pink .p-message__pinkCard{ z-index: 1; }

  .p-message__sec--pink .p-message__pinkPhoto{
    background: var(--pmsg-bg-pinkBox) !important;
    padding: var(--pmsg-sp-pinkPhotoPad) !important;
    text-align: center !important;
  }

  .p-message__sec--pink .p-message__pinkPhoto img{
    max-width: none !important;
    width: 100% !important;
    display: block !important;
  }

  .p-message__sec--pink .p-message__pinkPhoto .wp-element-caption{
    padding-left: clamp(10px, 3vw, 14px);
    padding-right: clamp(10px, 3vw, 14px);
  }

  .p-message__sec--pink .p-message__pinkMedia,
  .p-message__sec--pink .p-message__pinkMedia figure,
  .p-message__sec--pink .p-message__pinkMedia .wp-block-image{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .p-message__sec--pink .p-message__pinkCard{
    padding-top: var(--pmsg-sp-pinkCardPadT) !important;
    padding-bottom: var(--pmsg-sp-pinkCardPadB) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .p-message__sec--pink .p-message__pinkCard > .wp-block-group__inner-container{
    padding-left: calc(var(--pmsg-sp-pinkCardPadX) + env(safe-area-inset-left)) !important;
    padding-right: calc(var(--pmsg-sp-pinkCardPadX) + env(safe-area-inset-right)) !important;
    max-width: none !important;
  }
}



/* ==================================================
  p-sustainability：ヒーロー
================================================== */

/* ==================================================
  1) 変数（p-sustainability専用）
================================================== */
.p-sustainability__sec--hero{
  --psus-wrapW: 1180px;

  /* H2（Sustainability） */
  --psus-h2-size-pc: clamp(30px, 4vw, 42px);
  --psus-h2-size-sp: clamp(34px, 9vw, 52px);

  /* H2↔H3の間（PC） */
  --psus-h2h3-gap-pc: clamp(4px, 0.7vw, 8px);

  /* はみ出し量 */
  --psus-head-pop: clamp(12px, 2.2vw, 22px);
  --psus-head-pop-sp: clamp(20px, 5vw, 50px);
  --psus-media-pop-pc: clamp(20px, 4vw, 40px);

  /* 画像サイズ（PC） */
  --psus-media-scale-pc: 0.9;

  /* セクション上下（上と下を分離） */
  --psus-sec-padTop-pc: clamp(26px, 6vw, 70px);
  --psus-sec-padBottom-pc: clamp(5px, 1vw, 10px);

  --psus-sec-padTop-sp: clamp(18px, 7vw, 34px);
  --psus-sec-padBottom-sp: clamp(10px, 4vw, 18px);

  /* SP：左の白余白（いちばん外側の白）※半分に調整 */
  --psus-sp-leftWhite: clamp(9px, 3.5vw, 23px);

  /* SP：グレー枠の「内側余白」（グレー余白 → コンテンツ の“余白”側） */
  --psus-sp-grayPad: clamp(16px, 5vw, 28px);

  /* SP：本文ブロックの上下余白（画像↔本文、本文↔下も同じ） */
  --psus-sp-textGap: clamp(16px, 6vw, 22px);

  /* PC：見出し分の「受け」高さ */
  --psus-headStackH-pc: clamp(110px, 11vw, 150px);

  /* PC：本文の行幅（右側の空き対策） */
  --psus-text-maxW-pc: none; /* none / 56ch など */

  background: #f7f8fc;
  padding: var(--psus-sec-padTop-pc) 0 var(--psus-sec-padBottom-pc);
}

/* ==================================================
  2) SWELL / Gutenberg デフォルト打ち消し（この範囲だけ）
================================================== */
.p-sustainability__sec--hero{
  --wp--style--block-gap: 0px;
  position: relative;
  overflow: visible;
}

.p-sustainability__sec--hero :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-heading,
  p,
  figure,
  img,
  h2,
  h3
){
  margin: 0 !important;
  padding: 0 !important;
}

.p-sustainability__sec--hero :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-sustainability__sec--hero :where(figure){
  max-width: none !important;
}

.p-sustainability__sec--hero :where(h2, h3, .wp-block-heading)::before,
.p-sustainability__sec--hero :where(h2, h3, .wp-block-heading)::after{
  content: none !important;
}

/* ==================================================
  3) 中身の幅（中央ヨセ）
================================================== */
.p-sustainability__inner{
  position: relative;
  z-index: 1;
}

.p-sustainability__inner > .wp-block-group__inner-container{
  width: min(var(--psus-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(16px, 4vw, 56px) !important;
  padding-right: clamp(16px, 4vw, 56px) !important;
}

/* ==================================================
  4) パーツ（見出し / 画像 / 本文）
================================================== */

/* 見出し */
.p-sustainability__headEn{
  color: #DF0515;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.05;
  font-size: var(--psus-h2-size-pc) !important;
  margin: 0 0 var(--psus-h2h3-gap-pc) !important;
}

.p-sustainability__headJp{
  color: #212121;
  font-weight: 700;
  line-height: 1.3;
  font-size: clamp(18px, 1.8vw, 24px) !important;
}

/* 画像 */
.p-sustainability__heroMedia img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* 本文 */
.p-sustainability__heroText p{
  color: #212121;
  line-height: 2;
  font-size: clamp(14px, 1.05vw, 16px);
  max-width: var(--psus-text-maxW-pc) !important;
}

.p-sustainability__accent{
  color: #DF0515;
  font-weight: 700;
}

/* ==================================================
  5) PC（960px～） ※現状維持
================================================== */
@media (min-width: 960px){

  .p-sustainability__heroRow > .wp-block-group__inner-container{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    column-gap: clamp(22px, 5vw, 72px);
    align-items: start;
    position: relative;
  }

  .p-sustainability__heroHead{
    grid-column: 1;
    grid-row: 1;
    position: absolute;
    left: 0;
    top: calc(var(--psus-head-pop) * -1);
    z-index: 2;
  }

  .p-sustainability__heroText{
    grid-column: 1;
    grid-row: 1;
    margin-top: 0 !important;
    padding-top: var(--psus-headStackH-pc) !important;
    padding-right: 0 !important;
    position: relative;
    z-index: 1;
  }

  .p-sustainability__heroText > .wp-block-group__inner-container{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .p-sustainability__heroMedia{
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;

    transform: scale(var(--psus-media-scale-pc));
    transform-origin: top right;

    width: min(678px, 100%);
    position: relative;
    top: calc(var(--psus-media-pop-pc) * -1);
    z-index: 1;
  }
}

/* ==================================================
  6) SP（～959px）
================================================== */
@media not all and (min-width: 960px){

  .p-sustainability__sec--hero{
    background: #fff;
    padding: var(--psus-sec-padTop-sp) 0 var(--psus-sec-padBottom-sp);
  }

  .p-sustainability__sec--hero::before{
    content: "";
    position: absolute;
    top: 0;
    left: var(--psus-sp-leftWhite);
    right: 0;
    bottom: 0;
    background: #f7f8fc;
    z-index: 0;
  }

  .p-sustainability__inner > .wp-block-group__inner-container{
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: calc(var(--psus-sp-leftWhite) + var(--psus-sp-grayPad)) !important;
    padding-right: var(--psus-sp-grayPad) !important;
  }

  .p-sustainability__heroRow > .wp-block-group__inner-container{
    display: block;
  }

  .p-sustainability__heroHead{
    position: relative;
    top: calc(var(--psus-head-pop-sp) * -1);
    z-index: 2;
  }

  .p-sustainability__headEn{
    font-size: var(--psus-h2-size-sp) !important;
    margin-bottom: clamp(6px, 1.2vw, 10px) !important;
  }

  /* 画像：右にピタ付け（本文の右余白は維持） */
  .p-sustainability__heroMedia{
    width: calc(100% + var(--psus-sp-grayPad)) !important;
    margin-top: clamp(10px, 4vw, 16px) !important;
    margin-right: calc(var(--psus-sp-grayPad) * -1) !important;
    transform: none !important;
  }

  .p-sustainability__heroText{
    margin-top: var(--psus-sp-textGap) !important;
    padding-top: 0 !important;

    padding-right: 0 !important;
    padding-bottom: var(--psus-sp-textGap) !important;
  }

  .p-sustainability__heroText p{
    max-width: none !important;
  }
}

/* ==================================================
  p-sustainability：2段目/3段目/4段目
  - 対象：.p-sustainability__sec--pink / .p-sustainability__sec--gray のみ
  - 非対象：1段目 .p-sustainability__sec--hero（崩さない）
  - 仕様：
    ・h3（.p-sustainability__ttl）はSWELL装飾（下線ふくむ）をそのまま使う（resetしない）
    ・ttlのTop/Right/Leftはpaddingで調整、下はmarginで調整（下線位置をズラさない）
    ・PC：rowを白背景（画像+テキストまとめて白）
    ・SP：panel（テキスト枠）を白背景＋padding（上下左右）
    ・SP：2段目は「左ピタ」＋右に「色余白→白余白」
    ・SP：3段目は「右ピタ」＋左に「白余白→色余白」
================================================== */

/* ==================================================
  1) 変数（2段目/3段目 共通）
================================================== */
.p-sustainability__sec--pink,
.p-sustainability__sec--gray{
  --psus23-wrapW: 1180px;

  /* フルワイド背景の上下余白（PC/SP） */
  --psus23-secPadY-pc: clamp(48px, 7.5vw, 96px);
  --psus23-secPadY-sp: clamp(9px, 3.5vw, 23px);

  /* row（白背景）の内側余白（PC） */
  --psus23-rowPad-pc: clamp(22px, 3.6vw, 34px);

  /* 画像↔テキストの間隔（PC） */
  --psus23-gap-pc: clamp(22px, 4vw, 56px);

  /* panel padding（PC） */
  --psus23-panelPadY: clamp(18px, 3.2vw, 28px);
  --psus23-panelPadX: clamp(18px, 3.6vw, 34px);

  /* h4/p の余白（PC/SP 共通） */
  --psus23-h4mt: clamp(16px, 2.6vw, 22px); /* p→h4 */
  --psus23-pmt:  clamp(8px,  1.4vw, 12px); /* h4→p */

  /* ------------------------------
    h3（.p-sustainability__ttl）の余白調整
    - Top/Right/Left：padding
    - Bottom：margin-bottom（下線位置をズラさない）
  ------------------------------ */
  --psus23-ttlPadTop:    0px;
  --psus23-ttlPadRight:  0px;
  --psus23-ttlPadLeft:   0px;
  --psus23-ttlPadBottom: 15px;

  /* ------------------------------
    SPレイアウト用
    - 白余白：画面端に残す白いゾーン
    - 色余白：カード外側に見せる色ゾーン
  ------------------------------ */
  --psus23-sp-whiteW:   clamp(9px, 3.5vw, 23px);
  --psus23-sp-colorPad: clamp(9px, 3.5vw, 23px);

  /* SP：テキスト枠（panel）のpadding */
  --psus23-sp-panelPadX: clamp(16px, 5.6vw, 26px);
  --psus23-sp-panelPadY: clamp(16px, 5.6vw, 26px);

  /* SP：画像→テキスト枠の間隔 */
  --psus23-sp-stackGap: 0px;

  position: relative;
  overflow: hidden;
}

/* ==================================================
  2) SWELL/Gutenberg打ち消し（この範囲だけ）
  ※h3（.p-sustainability__ttl）は下線を生かすので reset しない
================================================== */
.p-sustainability__sec--pink :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  p,
  figure,
  img,
  h4,
  .p-sustainability__smallttl
),
.p-sustainability__sec--gray :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  p,
  figure,
  img,
  h4,
  .p-sustainability__smallttl
){
  margin: 0 !important;
  padding: 0 !important;
}

.p-sustainability__sec--pink :where(.wp-block-group, .wp-block-group__inner-container),
.p-sustainability__sec--gray :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-sustainability__sec--pink :where(figure),
.p-sustainability__sec--gray :where(figure){
  max-width: none !important;
}

/* ==================================================
  3) 外側（フルワイド）背景（PC既定）
================================================== */
.p-sustainability__sec--pink{
  background: #fff7f8;
  padding: var(--psus23-secPadY-pc) 0;
}

.p-sustainability__sec--gray{
  background: #f7f8fc;
  padding: var(--psus23-secPadY-pc) 0;
}

/* ==================================================
  4) 中身幅（中央ヨセ：PC既定）
================================================== */
.p-sustainability__sec--pink .p-sustainability__inner > .wp-block-group__inner-container,
.p-sustainability__sec--gray .p-sustainability__inner > .wp-block-group__inner-container{
  width: min(var(--psus23-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(16px, 4vw, 56px) !important;
  padding-right: clamp(16px, 4vw, 56px) !important;
}

/* ==================================================
  5) PC（960px～）
================================================== */
@media (min-width: 960px){

  /* row：白背景（画像+テキストをまとめて白） */
  .p-sustainability__sec--pink .p-sustainability__row > .wp-block-group__inner-container,
  .p-sustainability__sec--gray .p-sustainability__row > .wp-block-group__inner-container{
    background: #fff;
    padding: var(--psus23-rowPad-pc);

    display: flex;
    align-items: flex-start;
    gap: var(--psus23-gap-pc);
  }

  /* 3段目：反転（画像右/テキスト左） */
  .p-sustainability__sec--gray .p-sustainability__row--rev > .wp-block-group__inner-container{
    flex-direction: row-reverse;
  }

  /* 画像エリア幅 */
  .p-sustainability__sec--pink .p-sustainability__mediabox,
  .p-sustainability__sec--gray .p-sustainability__mediabox{
    flex: 0 0 min(452px, 44%);
  }

  /* 画像：角丸/シャドウなし */
  .p-sustainability__sec--pink .p-sustainability__media,
  .p-sustainability__sec--gray .p-sustainability__media{
    border-radius: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
  }

  .p-sustainability__sec--pink .p-sustainability__media img,
  .p-sustainability__sec--gray .p-sustainability__media img{
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  /* テキスト枠：padding（白背景はrow側） */
  .p-sustainability__sec--pink .p-sustainability__panel,
  .p-sustainability__sec--gray .p-sustainability__panel{
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    padding: var(--psus23-panelPadY) var(--psus23-panelPadX) !important;

    flex: 1 1 auto;
    min-width: 0;
  }

  /* extendL/R：端伸ばし無し */
  .p-sustainability__sec--pink .p-sustainability__panel--extendR,
  .p-sustainability__sec--gray .p-sustainability__panel--extendL{
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 0 !important;
  }

  /* h3（SWELL装飾はそのまま / 余白だけ） */
  .p-sustainability__sec--pink .p-sustainability__ttl,
  .p-sustainability__sec--gray .p-sustainability__ttl{
    padding-top:   var(--psus23-ttlPadTop) !important;
    padding-right: var(--psus23-ttlPadRight) !important;
    padding-left:  var(--psus23-ttlPadLeft) !important;
    margin-bottom: var(--psus23-ttlPadBottom) !important;
  }

  /* h4/p（共通バランス） */
  .p-sustainability__sec--pink .p-sustainability__smallttl,
  .p-sustainability__sec--gray .p-sustainability__smallttl{
    color: #212121;
    font-weight: 700;
    line-height: 1.5;
    font-size: clamp(14px, 1.4vw, 16px);
  }

  .p-sustainability__sec--pink .p-sustainability__text,
  .p-sustainability__sec--gray .p-sustainability__text{
    color: #212121;
    line-height: 1.9;
    font-size: clamp(13px, 1.1vw, 15px);
  }

  /* h4→p */
  .p-sustainability__sec--pink .p-sustainability__smallttl + .p-sustainability__text,
  .p-sustainability__sec--gray .p-sustainability__smallttl + .p-sustainability__text{
    margin-top: var(--psus23-pmt) !important;
  }

  /* p→h4 */
  .p-sustainability__sec--pink .p-sustainability__text + .p-sustainability__smallttl,
  .p-sustainability__sec--gray .p-sustainability__text + .p-sustainability__smallttl{
    margin-top: var(--psus23-h4mt) !important;
  }
}

/* ==================================================
  6) SP（～959px）
================================================== */
@media not all and (min-width: 960px){

  /* フルワイド：ベースは白にして、色は ::before で作る */
  .p-sustainability__sec--pink,
  .p-sustainability__sec--gray{
    background: #fff !important;
    padding: var(--psus23-secPadY-sp) 0 !important;
  }

  /* ピンク：右端に白余白を残す（色は左から広げる） */
  .p-sustainability__sec--pink::before{
    content: "";
    position: absolute;
    inset: 0;
    background: #fff7f8;
    width: calc(100% - var(--psus23-sp-whiteW));
    pointer-events: none;
  }

  /* グレー：左端に白余白を残す（色は右側に寄せる） */
  .p-sustainability__sec--gray::before{
    content: "";
    position: absolute;
    inset: 0;
    background: #f7f8fc;
    left: var(--psus23-sp-whiteW);
    width: calc(100% - var(--psus23-sp-whiteW));
    pointer-events: none;
  }

  /* 中身幅：SPは「ピタ側=0 / 反対側=色余白+白余白」で制御 */
  .p-sustainability__sec--pink .p-sustainability__inner > .wp-block-group__inner-container,
  .p-sustainability__sec--gray .p-sustainability__inner > .wp-block-group__inner-container{
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    position: relative; /* ::before より前に出す */
    z-index: 1;
  }

  /* 2段目：左ピタ（左0 / 右=色余白+白余白） */
  .p-sustainability__sec--pink .p-sustainability__inner > .wp-block-group__inner-container{
    padding-left: 0 !important;
    padding-right: calc(var(--psus23-sp-colorPad) + var(--psus23-sp-whiteW)) !important;
  }

  /* 3段目：右ピタ（右0 / 左=白余白+色余白） */
  .p-sustainability__sec--gray .p-sustainability__inner > .wp-block-group__inner-container{
    padding-left: calc(var(--psus23-sp-whiteW) + var(--psus23-sp-colorPad)) !important;
    padding-right: 0 !important;
  }

  /* row：縦積み（背景は持たせない / ピタ寄せだけ作る） */
  .p-sustainability__sec--pink .p-sustainability__row > .wp-block-group__inner-container,
  .p-sustainability__sec--gray .p-sustainability__row > .wp-block-group__inner-container{
    display: block !important;
    background: transparent !important;
  }

  /* 3段目：row自体を右寄せ（右ピタ感） */
  .p-sustainability__sec--gray .p-sustainability__row{
    margin-left: auto !important;
  }

  /* 画像：角丸/シャドウなし + 幅100 */
  .p-sustainability__sec--pink .p-sustainability__media,
  .p-sustainability__sec--gray .p-sustainability__media{
    border-radius: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
  }

  .p-sustainability__sec--pink .p-sustainability__media img,
  .p-sustainability__sec--gray .p-sustainability__media img{
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  /* テキスト枠：白背景＋余白（上下左右） */
  .p-sustainability__sec--pink .p-sustainability__panel,
  .p-sustainability__sec--gray .p-sustainability__panel{
    background: #fff !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    padding: var(--psus23-sp-panelPadY) var(--psus23-sp-panelPadX) !important;
    margin-top: var(--psus23-sp-stackGap) !important;

    /* 縦中央になってしまう対策（念のため） */
    display: block !important;
  }

  /* extendL/R：SPも通常panel扱い */
  .p-sustainability__sec--pink .p-sustainability__panel--extendR,
  .p-sustainability__sec--gray .p-sustainability__panel--extendL{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* h3（SWELL装飾はそのまま / 余白だけ） */
  .p-sustainability__sec--pink .p-sustainability__ttl,
  .p-sustainability__sec--gray .p-sustainability__ttl{
    padding-top:   var(--psus23-ttlPadTop) !important;
    padding-right: var(--psus23-ttlPadRight) !important;
    padding-left:  var(--psus23-ttlPadLeft) !important;
    margin-bottom: var(--psus23-ttlPadBottom) !important;
  }

  /* h4/p（SP） */
  .p-sustainability__sec--pink .p-sustainability__smallttl,
  .p-sustainability__sec--gray .p-sustainability__smallttl{
    color: #212121;
    font-weight: 700;
    line-height: 1.55;
    font-size: clamp(14px, 4vw, 16px);
  }

  .p-sustainability__sec--pink .p-sustainability__text,
  .p-sustainability__sec--gray .p-sustainability__text{
    color: #212121;
    line-height: 1.9;
    font-size: clamp(13px, 3.6vw, 15px);
  }

  /* h4→p */
  .p-sustainability__sec--pink .p-sustainability__smallttl + .p-sustainability__text,
  .p-sustainability__sec--gray .p-sustainability__smallttl + .p-sustainability__text{
    margin-top: var(--psus23-pmt) !important;
  }

  /* p→h4 */
  .p-sustainability__sec--pink .p-sustainability__text + .p-sustainability__smallttl,
  .p-sustainability__sec--gray .p-sustainability__text + .p-sustainability__smallttl{
    margin-top: var(--psus23-h4mt) !important;
  }
}



/* ==================================================
  p-company-ma-history：結婚相談所の歴史
================================================== */
/* ==================================================
  1) 変数・ベース（p-company-ma-history）
================================================== */
.p-company-ma-history{
  /* 幅 */
  --pmah-wrapW: 1180px;

  /* 色 */
  --pmah-ink: #212121;
  --pmah-text: #212121;
  --pmah-accent: #DF0515;
  --pmah-bg: #f7f8fc;
  --pmah-panel: #fff;
  --pmah-tag: #1f1b1b;

  /* セクション余白 */
  --pmah-sec-padTop-pc: clamp(34px, 6vw, 74px);
  --pmah-sec-padBottom-pc: clamp(70px, 9vw, 140px);
  --pmah-sec-padTop-sp: clamp(22px, 7vw, 40px);
  --pmah-sec-padBottom-sp: clamp(30px, 8vw, 56px);

  /* 内側左右余白（PC） */
  --pmah-padX-pc: clamp(16px, 4vw, 56px);

  /* list（白パネル）padding */
  --pmah-panel-padX-pc: clamp(28px, 4.4vw, 60px);
  --pmah-panel-padY-pc: 0; /* PCは上下0（最小） */
  --pmah-panel-pad-sp: clamp(18px, 5.5vw, 26px);

  /* 見出し */
  --pmah-head-pop-pc: clamp(12px, 2.2vw, 22px);
  --pmah-h2-pc: clamp(30px, 4vw, 42px);
  --pmah-h2-sp: clamp(34px, 9vw, 52px);
  --pmah-h3: clamp(18px, 1.8vw, 24px);
  --pmah-h2h3-gap: clamp(8px, 1.2vw, 14px);
  --pmah-head2panel-gap: 0; /* clamp(18px, 3vw, 28px) */

  /* レイアウト（PC） */
  --pmah-col-gap: clamp(34px, 6vw, 86px);
  --pmah-mediaW-pc: 35%;

  /* パーツ */
  --pmah-img-radius: 14px;

  /* era */
  --pmah-era-padY-pc: clamp(24px, 4vw, 40px);
  --pmah-era-padY-sp: clamp(18px, 6vw, 30px);
  --pmah-era-ruleH: 5px;

  /* list 下余白 */
  --pmah-list-mb-pc: clamp(22px, 4vw, 44px);
  --pmah-list-mb-sp: clamp(18px, 6vw, 30px);

  /* tag/cap（PCのそろえ用） */
  --pmah-tagPadY: 12px;
  --pmah-tagPadX: 22px;
  --pmah-tagH: 34px;
  --pmah-capH: 22px;
  --pmah-tagCapGap: 12px;
  --pmah-metaToImgGap: 16px;

  /* SP：head用の余白（左白/グレー内側） */
  --pmah-sp-leftWhite: clamp(10px, 4vw, 24px);
  --pmah-sp-grayPad: clamp(16px, 5vw, 28px);

  background: var(--pmah-bg);
  padding: var(--pmah-sec-padTop-pc) 0 var(--pmah-sec-padBottom-pc);

  position: relative;
  overflow: visible;

  /* Gutenbergのblock-gap抑制（このブロックだけ） */
  --wp--style--block-gap: 0px;
}


/* ==================================================
  2) SWELL / Gutenberg デフォルト打ち消し（この範囲だけ）
================================================== */
.p-company-ma-history :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-heading,
  p,
  figure,
  img,
  ul,
  li
){
  margin: 0 !important;
  padding: 0 !important;
}

.p-company-ma-history :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-company-ma-history :where(figure){
  max-width: none !important;
}

.p-company-ma-history :where(h2, h3, .wp-block-heading)::before,
.p-company-ma-history :where(h2, h3, .wp-block-heading)::after{
  content: none !important;
}


/* ==================================================
  3) inner（中央ヨセ・PC）
================================================== */
.p-company-ma-history__inner > .wp-block-group__inner-container{
  width: min(var(--pmah-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--pmah-padX-pc) !important;
  padding-right: var(--pmah-padX-pc) !important;
  padding-bottom: var(--pmah-padX-pc) !important;

  position: relative;
  z-index: 1;
}


/* ==================================================
  4) 見出し（PC）
================================================== */
.p-company-ma-history__head{
  position: relative;
  top: calc(var(--pmah-head-pop-pc) * -1);
  margin-bottom: var(--pmah-head2panel-gap) !important;
}

.p-company-ma-history__headEn{
  color: var(--pmah-accent);
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.05;
  font-size: var(--pmah-h2-pc) !important;
  margin: 0 0 var(--pmah-h2h3-gap) !important;
}

.p-company-ma-history__headJp{
  color: var(--pmah-ink);
  font-weight: 700;
  line-height: 1.3;
  font-size: var(--pmah-h3) !important;
}


/* ==================================================
  5) list（白パネル・PC）
================================================== */
.p-company-ma-history__list{
  background: var(--pmah-panel);
  margin-bottom: var(--pmah-list-mb-pc) !important;
}

.p-company-ma-history__list > .wp-block-group__inner-container{
  padding: var(--pmah-panel-padY-pc) var(--pmah-panel-padX-pc) !important;
}


/* ==================================================
  6) era（区切りライン・PC）
================================================== */
.p-company-ma-history__era{
  position: relative;
  padding-top: var(--pmah-era-padY-pc) !important;
  padding-bottom: var(--pmah-era-padY-pc) !important;
}

/* 白パネルの左右端までラインを伸ばす */
.p-company-ma-history__era::after{
  content: "";
  position: absolute;
  left: calc(0px - var(--pmah-panel-padX-pc));
  right: calc(0px - var(--pmah-panel-padX-pc));
  bottom: 0;
  height: var(--pmah-era-ruleH);
  background: var(--pmah-bg);
}

.p-company-ma-history__era:last-child::after{
  content: none;
}


/* ==================================================
  7) 行（PC：2カラム）
================================================== */
.p-company-ma-history__row{
  display: grid !important;
  grid-template-columns: var(--pmah-mediaW-pc) minmax(0, 1fr);
  column-gap: var(--pmah-col-gap);
  align-items: start;

  /* cap無しでも本文位置がズレない“土台高さ” */
  --pmah-metaH: calc(var(--pmah-tagH) + var(--pmah-metaToImgGap));
}

.p-company-ma-history__row:has(.p-company-ma-history__cap){
  --pmah-metaH: calc(
    var(--pmah-tagH) + var(--pmah-tagCapGap) + var(--pmah-capH) + var(--pmah-metaToImgGap)
  );
}

.p-company-ma-history__col--media,
.p-company-ma-history__col--text{
  min-width: 0;
}

.p-company-ma-history__col--text{
  padding-top: var(--pmah-metaH) !important;
}


/* ==================================================
  8) パーツ（PC共通）
================================================== */
.p-company-ma-history__tag{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: var(--pmah-tagH);
  background: var(--pmah-tag);
  color: #fff;
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1;

  padding: 0 var(--pmah-tagPadX) !important;
  border-radius: 2px;

  margin-bottom: var(--pmah-metaToImgGap) !important;
}

.p-company-ma-history__cap{
  display: block;
  color: #555;
  font-size: clamp(12px, 0.95vw, 13px);

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  margin-top: calc(var(--pmah-metaToImgGap) * -1) !important;
  margin-bottom: var(--pmah-metaToImgGap) !important;

  padding-top: var(--pmah-tagCapGap) !important;
  height: calc(var(--pmah-capH) + var(--pmah-tagCapGap));
  line-height: var(--pmah-capH);
}

.p-company-ma-history__img img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: var(--pmah-img-radius);
}

.p-company-ma-history__text{
  color: var(--pmah-text);
  line-height: 2;
  font-size: clamp(14px, 1.05vw, 16px);
}

/* 注記（※リスト） */
.p-company-ma-history :where(ul.is-style-note_list){
  margin-top: 12px !important;
  list-style: none;
  color: #666;
  font-size: clamp(11px, 0.9vw, 12px);
  line-height: 1.7;
}

.p-company-ma-history :where(ul.is-style-note_list li){
  position: relative;
  padding-left: 1.2em !important;
}

.p-company-ma-history :where(ul.is-style-note_list li)::before{
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
  color: #666;
}


/* ==================================================
  9) SP（～959px）
  - head：左白余白＋右グレー枠（headだけで調整つまみ管理）
  - list：中央配置（上下padding 0、左右のみ）
  - 行：縦積み
================================================== */
@media not all and (min-width: 960px){

  /* ------------------------------
    SP：セクション
  ------------------------------ */
  .p-company-ma-history{
    background: #fff;
    padding: var(--pmah-sec-padTop-sp) 0 var(--pmah-sec-padBottom-sp);

    /* list：左右padding（上下は0固定） */
    --pmah-list-padX-sp: var(--pmah-panel-pad-sp);

    /* media → text 間隔 */
    --pmah-sp-mediaTextGap: clamp(18px, 7vw, 28px);
  }

  /* SPは「セクション全体のグレー背景」は使わない（headのみ） */
  .p-company-ma-history::before{
    content: none !important;
  }

  /* inner：SPは左右paddingを外して、head/listで管理 */
  .p-company-ma-history__inner > .wp-block-group__inner-container{
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
  }

  /* ------------------------------
    SP：head（ここだけ触ればOK）
  ------------------------------ */
  .p-company-ma-history__head{
    /* ★調整つまみ（ここだけ） */
    --pmah-h2-pop-sp: clamp(18px, 6vw, 36px); /* グレー開始（下げるほどH2上が白） */
    --pmah-headShift-sp: -1px;               /* 背景＋H2/H3をまとめて上下 */
    --pmah-head-padB-sp: clamp(16px, 6vw, 28px); /* H3下のグレー余白 */

    position: relative;
    z-index: 1;

    padding-left: calc(var(--pmah-sp-leftWhite) + var(--pmah-sp-grayPad)) !important;
    padding-right: var(--pmah-sp-grayPad) !important;
    padding-bottom: var(--pmah-head-padB-sp) !important;

    margin-bottom: var(--pmah-head2panel-gap) !important;

    /* head全体（背景＋文字）をまとめて上下 */
    transform: translateY(calc(var(--pmah-headShift-sp) - var(--pmah-h2-pop-sp)));
    overflow: visible !important;

    /* PC用topはSPでは使わない */
    top: 0 !important;
  }

  .p-company-ma-history__head::before{
    content: "";
    position: absolute;
    left: var(--pmah-sp-leftWhite);
    right: 0;
    top: var(--pmah-h2-pop-sp);
    bottom: 0;
    background: var(--pmah-bg);
    z-index: -1;
  }

  .p-company-ma-history__headEn{
    font-size: var(--pmah-h2-sp) !important;
    position: relative;
    top: 0 !important;
    transform: none !important;
  }

  .p-company-ma-history__headJp{
    font-size: var(--pmah-h3) !important;
  }

  /* ------------------------------
    SP：list（中央）
  ------------------------------ */
  .p-company-ma-history__list{
    background: var(--pmah-panel);
    width: min(720px, 100%);
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: var(--pmah-list-mb-sp) !important;
  }

  .p-company-ma-history__list > .wp-block-group__inner-container{
    padding: 0 var(--pmah-list-padX-sp) !important;
  }

  /* ------------------------------
    SP：era
  ------------------------------ */
  .p-company-ma-history__era{
    padding-top: var(--pmah-era-padY-sp) !important;
    padding-bottom: var(--pmah-era-padY-sp) !important;
  }

  .p-company-ma-history__era::after{
    left: calc(0px - var(--pmah-list-padX-sp));
    right: calc(0px - var(--pmah-list-padX-sp));
    background: var(--pmah-bg);
  }

  /* ------------------------------
    SP：行（縦積み）
  ------------------------------ */
  .p-company-ma-history__row{
    display: block !important;
    --pmah-metaH: 0px;
  }

  .p-company-ma-history__tag{
    height: auto;
    padding: var(--pmah-tagPadY) var(--pmah-tagPadX) !important;
    margin-bottom: clamp(12px, 4vw, 16px) !important;
  }

  .p-company-ma-history__cap{
    height: auto;
    line-height: 1.6;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;

    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 10px !important;
  }

  .p-company-ma-history__col--media :where(figure.p-company-ma-history__img){
    width: 100% !important;
    margin-right: 0 !important;
  }

  .p-company-ma-history__col--text{
    padding-top: var(--pmah-sp-mediaTextGap) !important;
    margin-top: var(--pmah-sp-mediaTextGap) !important;
  }
}





/* ==================================================
  p-company-company-history：オーネットの歴史
================================================== */
/* ==================================================
  1) 変数・ベース
================================================== */
.p-company-company-history{
  /* 幅 */
  --pch-wrapW: 1180px;

  /* 色 */
  --pch-ink: #212121;
  --pch-text: #212121;
  --pch-accent: #DF0515;
  --pch-bg: #f7f8fc;
  --pch-panel: #fff;
  --pch-rule: #e6e9f2;
  --pch-tabBg: #e9edf4;
  --pch-tabLine: #cfd5e2;

  /* セクション余白 */
  --pch-sec-padTop-pc: clamp(34px, 6vw, 74px);
  --pch-sec-padBottom-pc: clamp(70px, 9vw, 140px);
  --pch-sec-padTop-sp: clamp(22px, 7vw, 40px);
  --pch-sec-padBottom-sp: clamp(30px, 8vw, 56px);

  /* inner左右余白 */
  --pch-padX-pc: clamp(16px, 4vw, 56px);

  /* 見出し */
  --pch-h2-pc: clamp(30px, 4vw, 42px);
  --pch-h2-sp: clamp(34px, 9vw, 52px);
  --pch-h3: clamp(18px, 1.8vw, 24px);

  /* H2↔H3（★ここで調整） */
  --pch-h2h3-gap: clamp(8px, 1.2vw, 14px);

  /* 見出し→タブ */
  --pch-head2tabs-gap: clamp(18px, 3vw, 26px);

  /* PC：H2のはみ出し量（★ここで調整） */
  --pch-h2-pop-pc: clamp(12px, 2.2vw, 22px);

  /* タブ */
  --pch-tabs-pad: 10px;
  --pch-tabH-pc: 46px;
  --pch-tabH-sp: 44px;

  /* パネル */
  --pch-panel-mt: clamp(22px, 4vw, 34px);
  --pch-panel-mb: clamp(18px, 5vw, 34px);

  /* list左右pad（era側へ移す） */
  --pch-panel-padX-pc: clamp(28px, 4.4vw, 60px);
  --pch-panel-padY-pc: 0px;
  --pch-panel-padX-sp: clamp(18px, 5.5vw, 26px);

  /* 年表（◯＆縦線） */
  --pch-lineW: 3px;

  /* ◯サイズ */
  --pch-dot: 15px;

  /* ◯中心X（テキスト開始より左） */
  --pch-tl-x: clamp(-8px, -1.4vw, -15px);

  /* ★微調整（線だけ1〜2px追い込みたい時） */
  --pch-tl-fixX: 0px;

  /* テキスト開始（tag/textの左端） */
  --pch-tl-pad: clamp(27px, 3.5vw, 35px);

  /* 行 */
  --pch-row-gap: clamp(18px, 3.2vw, 34px);
  --pch-mediaW: 600px; /* min(600px, 60%) */
  --pch-era-padY-pc: clamp(22px, 3.8vw, 38px);
  --pch-era-padY-sp: clamp(18px, 6vw, 30px);

  /* テキスト */
  --pch-tag-pc: clamp(24px, 2.4vw, 32px);
  --pch-tag-sp: clamp(24px, 7.5vw, 34px);
  --pch-textSize: clamp(14px, 1.05vw, 16px);

  /* ◯中心Y（tag高さ想定） */
  --pch-dotCenterY-pc: calc(var(--pch-tag-pc) * 0.55);

  /* 画像 */
  --pch-img-gap-pc: 5px;

  background: var(--pch-bg);
  padding: var(--pch-sec-padTop-pc) 0 var(--pch-sec-padBottom-pc);
  position: relative;
  overflow: visible;

  /* Gutenbergのgap抑制（このブロックだけ） */
  --wp--style--block-gap: 0px;
}


/* ==================================================
  2) SWELL / Gutenberg デフォルト打ち消し（この範囲だけ）
================================================== */
.p-company-company-history :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-heading,
  p,
  figure,
  img,
  ul,
  li
){
  margin: 0 !important;
  padding: 0 !important;
}

.p-company-company-history :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-company-company-history :where(figure){
  max-width: none !important;
}

.p-company-company-history :where(h2, h3, .wp-block-heading)::before,
.p-company-company-history :where(h2, h3, .wp-block-heading)::after{
  content: none !important;
}


/* ==================================================
  3) inner（中央ヨセ）
================================================== */
.p-company-company-history__inner > .wp-block-group__inner-container{
  width: min(var(--pch-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--pch-padX-pc) !important;
  padding-right: var(--pch-padX-pc) !important;
  padding-bottom: var(--pch-padX-pc) !important;
  position: relative;
  z-index: 1;
}


/* ==================================================
  4) 見出し（H2はみ出し / H2↔H3 gap）
  - ★H2だけでなく、H3も一緒に上げる
================================================== */
.p-company-company-history__head{
  margin-bottom: var(--pch-head2tabs-gap) !important;
  position: relative;
  overflow: visible;
}

/* ★H2/H3をまとめて管理（gap + 上方向移動） */
.p-company-company-history__head > .wp-block-group__inner-container{
  display: flex !important;
  flex-direction: column !important;
  gap: var(--pch-h2h3-gap) !important;

  position: relative;
  top: calc(var(--pch-h2-pop-pc) * -1);
}

/* うすい赤ライン */
.p-company-company-history__head::after{
  content: "";
  display: block;
  height: 1px;
  background: var(--pch-accent);

  /* ★見出し全体を上げた分、ラインが近すぎる場合の相殺 */
  margin-top: max(0px, calc(clamp(14px, 2vw, 18px) - var(--pch-h2-pop-pc))) !important;
}

.p-company-company-history__headEn{
  color: var(--pch-accent);
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.05;
  font-size: var(--pch-h2-pc) !important;

  /* ★head側で上げるのでH2単体のtopは0 */
  position: relative;
  top: 0 !important;

  /* ★gap管理にするので念のため0固定（上書き対策） */
  margin-bottom: 0 !important;
}

.p-company-company-history__headJp{
  color: var(--pch-ink);
  font-weight: 700;
  line-height: 1.3;
  font-size: var(--pch-h3) !important;
  margin-top: 0 !important;
}


/* ==================================================
  5) 年代タブ（外枠うす線1本＋区切り線＋hover）
================================================== */
.p-company-company-history__tabs > .wp-block-group__inner-container{
  background: var(--pch-tabBg);
  padding: var(--pch-tabs-pad) !important;
}

.p-company-company-history__tabList{
  list-style: none;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  background: #fff;
  border: 1px solid var(--pch-tabLine);
}

.p-company-company-history__tabList > li{
  border-right: 1px solid var(--pch-tabLine);
}
.p-company-company-history__tabList > li:last-child{
  border-right: none;
}

.p-company-company-history__tabList > li > a{
  display: flex !important;
  align-items: center;
  justify-content: center;
  height: var(--pch-tabH-pc);
  color: var(--pch-ink);
  text-decoration: none;
  font-weight: 700;
  font-size: clamp(12px, 1.1vw, 14px);
  line-height: 1.1;
  background: transparent;
  transition: background-color .15s ease, color .15s ease;
}

.p-company-company-history__tabList > li > a:hover{
  background: var(--pch-accent) !important;
  color: #fff !important;
}


/* ==================================================
  6) list（白パネル）＋list内paddingを0（era側でpad）
================================================== */
.p-company-company-history__list{
  background: var(--pch-panel);
  margin-top: var(--pch-panel-mt) !important;
  margin-bottom: var(--pch-panel-mb) !important;
  position: relative;
}

/* list内paddingを0（下線を横幅いっぱいに） */
.p-company-company-history__list > .wp-block-group__inner-container{
  padding: var(--pch-panel-padY-pc) 0 !important;
  position: relative;
  box-sizing: border-box;
}


/* ==================================================
  7) era（下線を全幅）＋左右pad（listから移管）
================================================== */
.p-company-company-history__era{
  position: relative;

  /* 上下余白 */
  padding-top: var(--pch-era-padY-pc) !important;
  padding-bottom: var(--pch-era-padY-pc) !important;

  /* 右pad */
  padding-right: var(--pch-panel-padX-pc) !important;

  /* 左pad（panel pad + tl pad） */
  padding-left: calc(var(--pch-panel-padX-pc) + var(--pch-tl-pad)) !important;
}

/* era下線（全幅） */
.p-company-company-history__era::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--pch-rule);

  /* 縦線より奥（下） */
  z-index: 1;
}

.p-company-company-history__era:last-of-type::after{
  content: none;
}


/* ==================================================
  8) 縦線（◯→◯で止める → ★最後は下へ貫通）
  - era下線より手前（上）
  - ★線を「〇の中心」に合わせる（線幅/2 を引く）
================================================== */
.p-company-company-history__era::before{
  content: "";
  position: absolute;

  /* ★線の中心を〇の中心へ */
  left: calc(
    var(--pch-panel-padX-pc)
    + var(--pch-tl-x)
    - (var(--pch-lineW) / 2)
    + var(--pch-tl-fixX)
  );

  top: 0;
  bottom: 0;
  width: var(--pch-lineW);
  background: var(--pch-accent);

  z-index: 2;
}

/* 最初：最初の◯から開始（スタートは維持） */
.p-company-company-history__era:first-of-type::before{
  top: calc(var(--pch-era-padY-pc) + var(--pch-dotCenterY-pc));
}

/* ★最後：下で止めず、最終〇の下も貫通 */
.p-company-company-history__era:last-of-type::before{
  bottom: 16px;
}


/* ==================================================
  9) 年代（tag）・本文（text）
  - 左端そろえ（eraのpadding-leftで統一）
================================================== */
.p-company-company-history__tag{
  color: var(--pch-accent);
  font-weight: 800;
  letter-spacing: 0.01em;
  font-size: var(--pch-tag-pc);
  line-height: 1.05;
  margin-bottom: 10px !important;
  position: relative;
  z-index: 3;
}

/* 白抜き◯ */
.p-company-company-history__tag::before{
  content: "";
  position: absolute;

  /* text開始(0) → ◯中心Xへ戻す（tl-pad - tl-x） */
  --pch-tl-gap: calc(var(--pch-tl-pad) - var(--pch-tl-x));
  left: calc(-1 * var(--pch-tl-gap) - (var(--pch-dot) / 2));

  top: 50%;
  width: var(--pch-dot);
  height: var(--pch-dot);
  border-radius: 50%;

  background: #fff;
  border: 3px solid var(--pch-accent);

  transform: translateY(-50%);
  z-index: 4;
}

/* 「年/月/日」を小さく黒（※spanを入れた場合だけ効く） */
.p-company-company-history__tagUnit{
  font-size: 0.66em;
  color: var(--pch-ink);
  font-weight: 700;
  letter-spacing: 0;
}

.p-company-company-history__text{
  color: var(--pch-text);
  font-size: var(--pch-textSize);
  line-height: 2;
  margin-left: 0 !important;
}


/* ==================================================
  10) 行（PC：左テキスト／右画像）
  - 右カラムを fit-content で最適化（画像が少ない時のムダ余白対策）
================================================== */
.p-company-company-history__row{
  display: grid !important;

  /* ★右カラムを「中身幅」に合わせて縮ませる（上限は --pch-mediaW） */
  grid-template-columns: minmax(0, 1fr) fit-content(var(--pch-mediaW));

  column-gap: var(--pch-row-gap);
  align-items: center;
}

.p-company-company-history__col--text,
.p-company-company-history__col--media{
  min-width: 0;
}

/* ★右カラム自体を右へ（見た目の空きを安定させる） */
.p-company-company-history__col--media{
  justify-self: end;
}

/* 画像なし：1カラム化 */
.p-company-company-history__row:has(.p-company-company-history__col--media:empty){
  grid-template-columns: minmax(0, 1fr);
}
.p-company-company-history__col--media:empty{
  display: none;
}

/* ==================================================
  11) 画像（PC：横1列にそろえる）＋キャプション右配置
  - figure内を横並び（画像＋キャプション）
  - キャプションは右、左ヨセ、長文は折り返し
  - 画像は高さそろえ（幅はauto）
  - ★追加：imgbox直下の p.__imgcap を「画像の右」に並べる
================================================== */

/* ★高さはここで調整 */
.p-company-company-history{
  --pch-imgH-pc: clamp(78px, 5.6vw, 98px);

  /* ★キャプションの見た目はここで調整 */
  --pch-cap-gap-pc: 10px;
  --pch-cap-w-pc: clamp(180px, 18vw, 340px);
  --pch-cap-font-pc: clamp(12px, 1vw, 13px);
  --pch-cap-lh-pc: 1.55;
}

.p-company-company-history__col--media{
  min-width: 0;
  overflow: hidden;
}

.p-company-company-history__imgbox > .wp-block-group__inner-container,
.p-company-company-history__imgbox .wp-block-group__inner-container{
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  gap: var(--pch-img-gap-pc) !important;
  justify-content: flex-end;
  align-items: center;

  width: max-content;
  max-width: 100%;

  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

/* figureを「画像＋キャプション」の横並びにする */
.p-company-company-history__imgbox :where(figure.p-company-company-history__img):not(.pc_only){
  margin: 0 !important;
  flex: 0 1 auto;
  min-width: 0;
  display: flex !important;
  align-items: center;
  column-gap: var(--pch-cap-gap-pc);
  white-space: normal;
}

/* 画像本体 */
.p-company-company-history__imgbox :where(figure.p-company-company-history__img img){
  display: block !important;
  height: var(--pch-imgH-pc) !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain;
  vertical-align: middle;
  flex: 0 0 auto;
}

/* キャプション：右配置＋左ヨセ＋折り返し */
.p-company-company-history__imgbox :where(figure.p-company-company-history__img figcaption){
  margin: 0 !important;
  padding: 0 !important;

  flex: 0 1 var(--pch-cap-w-pc);
  min-width: 0;

  text-align: left !important;
  font-size: var(--pch-cap-font-pc) !important;
  line-height: var(--pch-cap-lh-pc);

  /* 長文でもはみ出さない */
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ★追加：imgbox内 p.__imgcap（PC：画像の右に並ぶ） */
.p-company-company-history__imgbox :where(p.p-company-company-history__imgcap){
  margin: 0 !important;
  padding: 0 !important;

  /* flexアイテムとして figure の右側へ */
  flex: 0 1 var(--pch-cap-w-pc);
  min-width: 0;

  /* 行内の折り返しは許可（containerはnowrapでもOK） */
  white-space: normal;

  text-align: left !important;
  font-size: var(--pch-cap-font-pc) !important;
  line-height: var(--pch-cap-lh-pc);

  overflow-wrap: anywhere;
  word-break: break-word;

  align-self: center;
}


/* ==================================================
  12) SP（～959px）
================================================== */
@media not all and (min-width: 960px){

  .p-company-company-history{
    padding: var(--pch-sec-padTop-sp) 0 var(--pch-sec-padBottom-sp);

    /* 見出し：全体を上げる量（H2/H3を同時に上げる） */
    --pch-head-pop: clamp(20px, 5vw, 50px);

    /* H2↔H3 の間（見た目の間隔） */
    --pch-headEn-gap: clamp(2px, 1vw, 6px);

    /* H3文字 ↔ 赤線 の間 */
    --pch-headJp-underlineGap: clamp(10px, 2vw, 16px);

    /* 赤線 ↔ 次ブロック の間 */
    --pch-head-afterLineGap: 14px;

    /* text ↔ media の間 */
    --pch-row-gap: 12px;

    /* タイムライン（SP）：左余白＋タテ線＋〇 */
    --pch-tl-padL: 22px;
    --pch-tl-dot: 18px;       /* 〇 */
    --pch-tl-line: 2px;
    --pch-tl-lineC: #DF0515;
    --pch-tl-dotC: #DF0515;
    --pch-tl-x: 2px;

    /* list内のテキスト左右余白（半分） */
    --pch-list-padX: calc(var(--pch-panel-padX-sp) / 2);

    /* 画像並び（SP） */
    --pch-img-gap: 10px;
    --pch-img-col: 3;                       /* 基本は3列 */
    --pch-imgH: clamp(76px, 22vw, 132px);   /* 高さをそろえる（切り取りなし） */
  }

  /* =========================
    SP：inner の padding-bottom を確実に0
    - PC側が !important なので、同じセレクタで上書き
  ========================= */
  .p-company-company-history__inner{
    padding-bottom: 0 !important;
  }
  .p-company-company-history__inner > .wp-block-group__inner-container{
    padding-bottom: 0 !important;
  }

  /* =========================
    見出し：H2/H3を同時に上げる＋H3↔赤線に余白
  ========================= */
  .p-company-company-history__head{
    position: relative;
    overflow: visible;
  }

  .p-company-company-history__head > .wp-block-group__inner-container{
    position: relative;
    top: calc(-1 * var(--pch-head-pop));
  }

  .p-company-company-history__headEn{
    font-size: var(--pch-h2-sp) !important;
    margin: 0 0 var(--pch-headEn-gap) 0 !important;
  }

  .p-company-company-history__headJp{
    position: relative;
    margin: 0 0 var(--pch-head-afterLineGap) 0 !important;
    padding: 0 0 var(--pch-headJp-underlineGap) 0 !important;
  }

  .p-company-company-history__headJp::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #DF0515;
  }

  /* =========================
    タブ：3列×2段
  ========================= */
  .p-company-company-history__tabList{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .p-company-company-history__tabList > li{
    border-right: 1px solid var(--pch-tabLine);
    border-bottom: 1px solid var(--pch-tabLine);
  }

  .p-company-company-history__tabList > li:nth-child(3n){
    border-right: none;
  }

  .p-company-company-history__tabList > li:nth-child(n+4){
    border-bottom: none;
  }

  .p-company-company-history__tabList > li > a{
    height: var(--pch-tabH-sp);
    font-size: 13px;
  }

  /* =========================
    list：左右のグレー余白を白に（100vwの白い板）
  ========================= */
  .p-company-company-history__list{
    position: relative;
    background: transparent;
    overflow: visible;
  }

  .p-company-company-history__list::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 100vw;
    transform: translateX(-50%);
    background: #fff;
    z-index: 0;
  }

  .p-company-company-history__list > .wp-block-group__inner-container{
    position: relative;
    z-index: 1;
    padding: 0 var(--pch-list-padX) !important;
  }

  /* =========================
    行：縦積み＋ text↔media に余白
  ========================= */
  .p-company-company-history__row{
    display: flex !important;
    flex-direction: column;
    gap: var(--pch-row-gap);
    position: relative;
    z-index: 1;
  }

  .p-company-company-history__row > .wp-block-column{
    margin: 0 !important;
  }

  /* =========================
    タイムライン（SP）
    - タテ線＋〇
    - 〇は tag の中央に合わせる
    - era下のグレー線は不要（OFF）
  ========================= */
  .p-company-company-history__era{
    position: relative;
    padding-left: var(--pch-tl-padL) !important;
    padding-right: 0 !important;
  }

  .p-company-company-history__era::before{
    content: "";
    position: absolute;
    left: var(--pch-tl-x);
    top: 0;
    bottom: 0;
    width: var(--pch-tl-line);
    background: var(--pch-tl-lineC);
    border-radius: 999px;
    z-index: 0;
  }

  .p-company-company-history__era::after{
    content: none !important;
  }

  .p-company-company-history__tag{
    position: relative;
    line-height: 1.2;
  }

  .p-company-company-history__tag::before{
    content: "";
    position: absolute;
    left: calc(
      -1 * var(--pch-tl-padL)
      + var(--pch-tl-x)
      - (var(--pch-tl-dot) / 2)
      + (var(--pch-tl-line) / 2)
    );
    top: 50%;
    transform: translateY(-50%);
    width: var(--pch-tl-dot);
    height: var(--pch-tl-dot);
    border: 2px solid var(--pch-tl-dotC);
    background: #fff;
    border-radius: 999px;
    box-sizing: border-box;
    z-index: 2;
  }

  .p-company-company-history__tag::after{
    content: none !important;
  }

  /* =========================
    画像：SPでは必ず「折り返し＋表示」
    - PC側の nowrap / max-content / overflow:hidden を打ち消す
    - 画像は切らずに同じ高さへ（contain）
    - imgcap は画像の下に表示
  ========================= */
  .p-company-company-history__imgbox > .wp-block-group__inner-container,
  .p-company-company-history__imgbox .wp-block-group__inner-container{
    display: flex !important;
    flex-wrap: wrap !important;             /* ★PCの nowrap !important を上書き */
    justify-content: flex-start !important;  /* ← 右寄り対策 */
    align-items: flex-start !important;
    gap: var(--pch-img-gap) !important;

    margin-top: clamp(14px, 5vw, 18px) !important;

    width: 100% !important;                 /* ★PCの max-content を上書き */
    max-width: 100% !important;

    overflow: visible !important;           /* ★PCの hidden を上書き */
    white-space: normal !important;         /* ★PCの nowrap を上書き */
  }

  .p-company-company-history__imgbox :where(figure.p-company-company-history__img){
    margin: 0 !important;

    /* 3列ベースで幅をそろえる（折り返しOK） */
    width: calc((100% - (var(--pch-img-gap) * (var(--pch-img-col) - 1))) / var(--pch-img-col));
    max-width: calc((100% - (var(--pch-img-gap) * (var(--pch-img-col) - 1))) / var(--pch-img-col));
  }

  /* 画面が狭いときは2列に */
  @media (max-width: 420px){
    .p-company-company-history{
      --pch-img-col: 2;
    }
  }

  .p-company-company-history__imgbox :where(figure.p-company-company-history__img img){
    display: block;
    width: 100% !important;
    height: var(--pch-imgH) !important;
    object-fit: contain;       /* ← 切らない */
    max-width: none;
    max-height: none;
  }

  /* ★imgcap：SPは画像の下に100%で表示 */
  .p-company-company-history__imgbox :where(p.p-company-company-history__imgcap){
    margin-top: 10px !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0;

    text-align: left !important;
    font-size: clamp(13px, 3.7vw, 14px) !important;
    line-height: 1.8;

    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal !important;
  }
}




/* ==================================================
  p-company-about-onet：オーネットについて（差し替え用・全文）
================================================== */

/* ==================================================
  1) 変数・外枠
================================================== */
.p-company-about-onet{
  --pao-wrapW: 1180px;

  --pao-ink: #212121;
  --pao-text: #212121;
  --pao-accent: #DF0515;

  --pao-bg: #fff7f8;
  --pao-card: #fff;
  --pao-mediaBg: #d9dde3;

  --pao-secPadTop-pc: clamp(26px, 6vw, 64px);
  --pao-secPadBottom-pc: clamp(30px, 7vw, 70px);

  --pao-secPadTop-sp: clamp(20px, 7vw, 34px);
  --pao-secPadBottom-sp: clamp(26px, 9vw, 44px);

  --pao-innerPadX: clamp(18px, 4vw, 56px);

  --pao-h2-pc: clamp(22px, 2.4vw, 34px);
  --pao-h2-sp: clamp(26px, 7vw, 40px);

  --pao-text-size-pc: clamp(13px, 1.05vw, 15px);
  --pao-text-size-sp: clamp(13px, 1vw, 14px);

  --pao-row-gap-pc: clamp(22px, 5vw, 64px);

  /* カード（PC） */
  --pao-card-radius: 14px;
  --pao-card-shadow: 0 4px 10px rgba(0,0,0,.08);

  --pao-cardW-pc: clamp(300px, 28vw, 400px);
  --pao-cardH-pc: clamp(82px, 6.8vw, 100px);
  --pao-cardMediaW-pc: clamp(140px, 13vw, 176px);

  --pao-cardBodyPadX-pc: clamp(14px, 1.6vw, 18px);
  --pao-cardBodyPadY-pc: clamp(12px, 1.2vw, 16px);

  /* ▼ ＞の右内側余白（PC/SP それぞれ） */
  --pao-cardArrowPadR-pc: clamp(14px, 1.6vw, 18px);
  --pao-cardArrowPadR-sp: 12px;

  background: var(--pao-bg);
  padding: var(--pao-secPadTop-pc) 0 var(--pao-secPadBottom-pc);
}

/* ==================================================
  2) SWELL / Gutenberg デフォルト打ち消し（この範囲だけ）
================================================== */
.p-company-about-onet{
  --wp--style--block-gap: 0px;
  position: relative;
  overflow: visible;
}

.p-company-about-onet :where(
  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-heading,
  p,
  figure,
  img
){
  margin: 0 !important;
  padding: 0 !important;
}

.p-company-about-onet :where(.wp-block-group, .wp-block-group__inner-container){
  gap: 0 !important;
}

.p-company-about-onet :where(figure){
  max-width: none !important;
}

.p-company-about-onet :where(h2, .wp-block-heading)::before,
.p-company-about-onet :where(h2, .wp-block-heading)::after{
  content: none !important;
}

/* ==================================================
  3) 中身の幅（中央ヨセ）
================================================== */
.p-company-about-onet__inner > .wp-block-group__inner-container{
  width: min(var(--pao-wrapW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--pao-innerPadX) !important;
  padding-right: var(--pao-innerPadX) !important;
  padding-bottom: var(--pao-innerPadX) !important;
}

/* ==================================================
  4) 見出し（h2）
================================================== */
.p-company-about-onet__head{
  color: var(--pao-accent);
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.1;
  font-size: var(--pao-h2-pc) !important;
  margin-bottom: clamp(14px, 2.2vw, 22px) !important;
}

/* ==================================================
  5) 左画像
================================================== */
.p-company-about-onet__media{
  width: 100%;
  max-width: none !important;
}

.p-company-about-onet__media img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
}

/* ==================================================
  6) 本文
================================================== */
.p-company-about-onet__text{
  color: var(--pao-text);
  line-height: 2;
  font-size: var(--pao-text-size-pc);
}

.p-company-about-onet__text + .p-company-about-onet__text{
  margin-top: 10px !important;
}

.p-company-about-onet__accent{
  color: var(--pao-accent);
  font-weight: 700;
}

/* ==================================================
  7) カード（p-chCardBlk をこのセクション内だけで使用）
================================================== */
.p-company-about-onet .p-chCardBlk{
  position: relative;
  border-radius: var(--pao-card-radius);
  overflow: hidden;
  box-shadow: var(--pao-card-shadow);
  background: transparent;
}

/* 白地（ホバーで赤へ） */
.p-company-about-onet .p-chCardBlk::before{
  content: "";
  position: absolute;
  inset: 0;
  background: var(--pao-card);
  transition: background-color .18s ease;
  z-index: 0;
}

/* 画像エリア */
.p-company-about-onet .p-chCardBlk__media{
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  overflow: hidden;
  background: var(--pao-mediaBg);
  position: relative;
  z-index: 2;
}

.p-company-about-onet .p-chCardBlk__media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block !important;
}

/* 文字エリア（＞は ::after） */
.p-company-about-onet .p-chCardBlk__body{
  position: relative;
  z-index: 2;
  background: transparent;

  display: flex;
  align-items: center;
  gap: 12px;
}

.p-company-about-onet .p-chCardBlk__ttl{
  margin: 0 !important;
  color: var(--pao-ink);
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.2;
  font-size: clamp(12px, 1.2vw, 14px);

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  transition: color .18s ease;
}

/* ＞アイコン（▼ここが今回の要点：右マージンで内側余白を作る） */
.p-company-about-onet .p-chCardBlk__body::after{
  content: "";
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--pao-accent);
  border-right: 2px solid var(--pao-accent);
  transform: rotate(45deg);
  transition: border-color .18s ease;

  margin-left: auto;
  margin-right: var(--pao-cardArrowPadR-pc); /* PC既定（SPで上書き） */
}

/* ホバー：画像以外を赤へ */
.p-company-about-onet .p-chCardBlk:hover::before,
.p-company-about-onet .p-chCardBlk:focus-within::before{
  background: var(--pao-accent);
}

.p-company-about-onet .p-chCardBlk:hover .p-chCardBlk__ttl,
.p-company-about-onet .p-chCardBlk:focus-within .p-chCardBlk__ttl{
  color: #fff;
}

.p-company-about-onet .p-chCardBlk:hover .p-chCardBlk__body::after,
.p-company-about-onet .p-chCardBlk:focus-within .p-chCardBlk__body::after{
  border-color: #fff;
}

.p-company-about-onet .p-chCardBlk,
.p-company-about-onet .p-chCardBlk *{
  cursor: pointer;
}

/* ==================================================
  8) 全面リンク（Buttonsで被せる）
================================================== */
.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns{
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
  overflow: hidden !important;
}

.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns
  .wp-block-button.p-company-about-onet__cardBtn{
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns
  .wp-block-button.p-company-about-onet__cardBtn .wp-block-button__link{
  position: absolute !important;
  inset: 0 !important;
  z-index: 6 !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  color: transparent !important;
  text-indent: -9999px !important;

  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
  outline: none !important;
}

.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns
  .wp-block-button.p-company-about-onet__cardBtn .wp-block-button__link:focus,
.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns
  .wp-block-button.p-company-about-onet__cardBtn .wp-block-button__link:focus-visible,
.p-company-about-onet .p-chCardBlk .wp-block-buttons.p-company-about-onet__cardBtns
  .wp-block-button.p-company-about-onet__cardBtn .wp-block-button__link:active{
  outline: none !important;
  box-shadow: none !important;
}

/* ==================================================
  9) PC（960px～）
================================================== */
@media (min-width: 960px){

  .p-company-about-onet{
    --pao-head-pop-pc: clamp(12px, 2.2vw, 22px);
    --pao-head-gap-after: clamp(10px, 2.2vw, 18px);
  }

  .p-company-about-onet__head{
    position: relative;
    top: calc(var(--pao-head-pop-pc) * -1);
    margin-bottom: var(--pao-head-gap-after) !important;
    z-index: 3;
  }

  .p-company-about-onet__cols{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    column-gap: var(--pao-row-gap-pc)!important;
    align-items: start;
  }

  .p-company-about-onet__media{
    margin-top: clamp(6px, 1vw, 10px) !important;
  }

  /* カード：右カラム内で中央ヨセ */
  .p-company-about-onet__card{
    width: min(var(--pao-cardW-pc), 100%);
    height: var(--pao-cardH-pc);
    margin-top: clamp(16px, 2.2vw, 26px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .p-company-about-onet__cardCols{
    display: grid !important;
    grid-template-columns: var(--pao-cardMediaW-pc) minmax(0, 1fr);
    height: 100%;
    align-items: stretch;
  }

  .p-company-about-onet__cardMedia{
    height: 100%;
  }

  .p-company-about-onet .p-chCardBlk__media{
    height: 100%;
    aspect-ratio: auto;
  }

  .p-company-about-onet__cardBody{
    height: 100%;
  }

  .p-company-about-onet .p-chCardBlk__body{
    height: 100%;
    padding:
      var(--pao-cardBodyPadY-pc)
      var(--pao-cardBodyPadX-pc)
      var(--pao-cardBodyPadY-pc)
      var(--pao-cardBodyPadX-pc);
    align-items: center;
  }

  /* 右端余白は「::after の margin-right」で確実に確保（上の共通指定が効く） */
  .p-company-about-onet .p-chCardBlk__body::after{
    margin-right: var(--pao-cardArrowPadR-pc);
  }
}

/* ==================================================
  10) SP（～959px）
================================================== */
@media not all and (min-width: 960px){

  .p-company-about-onet{
    /* 左の白帯幅 / 中身の左右padding（SP専用つまみ） */
    --pao-spWhite: clamp(14px, 5vw, 18px);
    --pao-spPadX: clamp(18px, 5vw, 26px);

    /* H2のはみ出し量（SP） */
    --pao-head-pop-sp: clamp(10px, 4.2vw, 18px);

    /* ① 背景：左白帯 → 以降は --pao-bg（ピンク） */
    background:
      linear-gradient(
        90deg,
        #fff 0,
        #fff var(--pao-spWhite),
        var(--pao-bg) var(--pao-spWhite),
        var(--pao-bg) 100%
      );

    padding: var(--pao-secPadTop-sp) 0 var(--pao-secPadBottom-sp);
  }

  /* 内側：右ピタを作りやすいように、右paddingは 0 に寄せる */
  .p-company-about-onet__inner > .wp-block-group__inner-container{
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;

    /* 左は「白帯ぶん」だけ空ける（中身のpaddingは各ブロック側へ） */
    padding-left: var(--pao-spWhite) !important;
    padding-right: 0 !important;

    padding-bottom: var(--pao-innerPadX) !important;
  }

  /* ① H2：ピンク枠から上にはみ出し（量は変数で調整） */
  .p-company-about-onet__head{
    font-size: var(--pao-h2-sp) !important;

    position: relative;
    top: calc(var(--pao-head-pop-sp) * -1);
    z-index: 3;

    margin-bottom: clamp(10px, 3.2vw, 16px) !important;

    /* 見出しもピンク領域側にそろえる */
    padding-left: var(--pao-spPadX) !important;
    padding-right: var(--pao-spPadX) !important;
  }

  .p-company-about-onet__cols{
    display: block !important;
  }

  /* ② 画像：右ピタ（右=0）＋下に余白 */
  .p-company-about-onet__media{
    width: calc(100% - var(--pao-spPadX)) !important;
    margin-left: var(--pao-spPadX) !important;
    margin-right: 0 !important;

    margin-bottom: clamp(18px, 6vw, 26px) !important; /* 画像↔本文の余白 */
  }

  /* ③ 本文：右ピタ＋左右padding、②の指定に加えて上下も同量 */
  .p-company-about-onet__body{
    width: calc(100% - var(--pao-spPadX)) !important;
    margin-left: var(--pao-spPadX) !important;
    margin-right: 0 !important;

    padding: var(--pao-spPadX) var(--pao-spPadX) !important; /* 上下左右 同じ */
  }

  .p-company-about-onet__text{
    font-size: var(--pao-text-size-sp);
  }

  .p-company-about-onet__text + .p-company-about-onet__text{
    margin-top: 12px !important;
  }

  /* ④ カード：画面の半分幅で中央 */
  .p-company-about-onet__card{
    width: min(50vw, 340px);
    margin: clamp(18px, 6vw, 26px) auto 0 !important;
  }

  .p-company-about-onet__cardCols{
    display: block !important;
  }

  .p-company-about-onet .p-chCardBlk__media{
    aspect-ratio: 16 / 9;
    height: auto;
  }

  /* ③ カード本文：余白を確実に付与（強め指定） */
  .p-company-about-onet .p-company-about-onet__cardBody.p-chCardBlk__body{
    padding: 14px 16px !important;
    gap: 10px;
  }

  .p-company-about-onet .p-chCardBlk__body::after{
    margin-right: var(--pao-cardArrowPadR-sp);
  }
}


/* 企業情報トップ */
/* ==================================================
  メインビジュアル（動画：PC/SP）
================================================== */

.p-company-top-visual{
  position: relative;
  padding-bottom: 80px;
}

.p-company-top-visual__media{
  position: relative;
  overflow: hidden;
  background-color: #000;

  /* 1pxスキマ対策 */
  line-height: 0;

  /* =========================
     SP 動画：調整ツマミ（可変）
     - 上の切れを抑える：posY を 0%寄りに
     - フチ対策の拡大：scale を弱める（必要なら 1.00）
  ========================= */
  --sp-video-posY: 0%;      /* 0% = いちばん上寄り / 10% などで微調整 */
  --sp-video-scale: 1.01;   /* 1.00〜1.03 目安（上が切れるなら下げる） */
}

/* フェード（そのまま） */
.p-company-top-visual__media::before{
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  animation: fadeInBody 3s ease forwards;
  pointer-events: none;
  z-index: 2;
}

@keyframes fadeInBody{
  to{ opacity: 1; }
}

/* 動画（黒線対策：オーバースキャンで安定化） */
.p-company-top-visual__media video{
  display: block;

  width: 100%;
  max-width: none;

  /* PC基準：見た目の高さ */
  height: 70vh;
  height: 70svh;

  /* 画面に合わせてトリミング */
  object-fit: cover;
  object-position: center;

  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: top;

  position: relative;
  z-index: 1;

  /* 高さ固定と相性が悪いので無効化 */
  aspect-ratio: auto;

  /* フチを内側に追い出す（PCは少し強めでもOK） */
  transform: translateZ(0) scale(1.03);
  transform-origin: center;

  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}

/* ==================================================
  SCROLL（現状：非表示）
================================================== */

.p-company-top-visual__scroll{
  display: none;
}

/* ==================================================
  SP（～959px）
  - 100svhでフル高さ
  - 上の切れ対策：上寄せ（object-position）＋拡大を弱める
================================================== */
@media not all and (min-width: 960px){

  .p-company-top-visual{
    padding-bottom: 0;
  }

  .p-company-top-visual__media video{
    height: 100vh;
    height: 100svh;
    aspect-ratio: auto;

    /* ★ここが修正点：上の表示を優先（上が切れにくい） */
    object-position: 50% var(--sp-video-posY);

    /* ★SPは拡大を弱める（上切れを抑える） */
    transform: translateZ(0) scale(var(--sp-video-scale));
    transform-origin: center top;
  }

  .p-company-top-visual__scroll{
    display: flex;
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 3;

    width: 44px;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;

    text-decoration: none;
    color: #fff;

    padding: 0;
    margin: 0;

    -webkit-tap-highlight-color: transparent;
  }

  .p-company-top-visual__scrollTxt{
    writing-mode: vertical-rl;
    letter-spacing: 0.12em;
    font-size: 16px;
    line-height: 1;
    font-weight: 600;
    text-shadow: 0 1px 8px rgba(0,0,0,.35);
    margin: 0 0 10px;
  }

  .p-company-top-visual__scroll::after{
    content: "";
    display: block;
    width: 1px;
    flex: 0 0 60px;
    height: auto;
    background: rgba(255,255,255,.9);
  }

  .p-company-top-visual__scroll.is-long::after{
    flex: 1 1 auto;
    min-height: 36px;
  }
}



/* ==================================================
  p-company-top：/company/ TOP（差し替え用・全文）
================================================== */

/* ==================================================
  1) 変数
================================================== */
.p-company-top{
  /* 幅（LinkCardsBox とそろえる） */
  --pct-wrapW: 1180px;

  /* 余白 */
  --pct-padX: clamp(18px, 4vw, 56px);
  --pct-padTop: clamp(18px, 4vw, 56px);
  --pct-padBottom: clamp(18px, 4vw, 56px);

  /* 色 */
  --pct-ink: #212121;
  --pct-text: #212121;
  --pct-accent: #DF0515;
  --pct-panel: #fff;
  --pct-mediaBg: #d9dde3;

  /* 本文 */
  --pct-textSize: clamp(14px, 1.05vw, 16px);
  --pct-textLH: 1.9;

  /* 本文↔カード */
  --pct-gapTextCard: clamp(18px, 3vw, 30px);

  /* カード上下マージン */
  --pct-cardMt: var(--pct-gapTextCard);
  --pct-cardMb: clamp(30px, 4vw, 35px);

  /* ロゴ */
  --pct-logoW: clamp(200px, 22vw, 300px);

  /* カード幅（PC/SP） */
  --pct-cardW-pc: clamp(350px, 40vw, 480px);
  --pct-cardW-sp: min(56vw, 260px);
  --pct-cardW: var(--pct-cardW-pc);

  /* カード見た目 */
  --pct-radius: 10px;
  --pct-shadow: 0 4px 10px rgba(0,0,0,.08);

  /* メディア幅（PC） */
  --pct-mediaW-pc: 190px;

  /* タイトル */
  --pct-ttlSize: clamp(16px, 1.2vw, 18px);
  --pct-ttlPadX: clamp(18px, 2.2vw, 26px);

  /* 矢印（p-chCardBlk と同型） */
  --pct-arrowBox: 10px;
  --pct-arrowStroke: 2px;
  --pct-bodyGap: 12px;
}

/* ==================================================
  2) SWELL / Gutenberg 打ち消し（当該範囲だけ）
================================================== */
.p-company-top,
.p-company-top *{
  box-sizing: border-box;
}

.p-company-top :where(
  .wp-block-group,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-image,
  p
){
  margin: 0;
}

.p-company-top .wp-block-columns{
  gap: 0 !important;
}
.p-company-top .wp-block-column{
  padding: 0 !important;
}

/* ==================================================
  3) 外枠・内側
================================================== */
.p-company-top.swell-block-fullWide{
  padding: 0 !important;
}
.p-company-top.swell-block-fullWide > .swell-block-fullWide__inner{
  padding: 0 !important;
}

.p-company-top__inner{
  width: min(var(--pct-wrapW), 100%);
  margin-left: auto!important;
  margin-right: auto!important;
  padding: var(--pct-padTop) var(--pct-padX) var(--pct-padBottom);
}

.p-company-top__inner > .wp-block-group__inner-container{
  width: 100%;
}

/* ==================================================
  4) ロゴ
================================================== */
.p-company-top__logo{
  width: min(var(--pct-logoW), 100%);
  margin-left: auto !important;
  margin-right: auto !important;
}

.p-company-top__logo img{
  display: block;
  width: 100%;
  height: auto;
}

/* ==================================================
  5) 本文
================================================== */
.p-company-top__text{
  margin-top: clamp(12px, 2vw, 18px);
  font-size: var(--pct-textSize);
  line-height: var(--pct-textLH);
  color: var(--pct-text);
  text-align: left;
}

.p-company-top__text + .p-company-top__text{
  margin-top: clamp(10px, 1.8vw, 16px);
}

/* ==================================================
  6) カード：上下マージン
================================================== */
.p-company-top .wp-block-group.p-company-top__card{
  margin-top: var(--pct-cardMt) !important;
  margin-bottom: var(--pct-cardMb) !important;
}

.p-company-top .wp-block-group.p-company-top__card
> .wp-block-group__inner-container{
  margin-top: var(--pct-cardMt) !important;
  margin-bottom: var(--pct-cardMb) !important;
}

/* ==================================================
  7) カード：リンク範囲（カード幅だけ）
================================================== */
.p-company-top__card > .wp-block-group__inner-container{
  position: relative !important;
  width: 100% !important;
  max-width: var(--pct-cardW) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ==================================================
  8) カード本体
================================================== */
.p-company-top__cardCols{
  position: relative;
  z-index: 1;

  width: 100%;
  max-width: none;

  margin-left: 0 !important;
  margin-right: 0 !important;

  overflow: hidden;
  border-radius: var(--pct-radius);
  background: var(--pct-panel);
  box-shadow: var(--pct-shadow);

  display: grid;
  grid-template-columns: var(--pct-mediaW-pc) 1fr;
  align-items: stretch;
}

/* ==================================================
  9) メディア
================================================== */
.p-company-top__cardMedia{
  background: var(--pct-mediaBg);
  height: 100%;
}

.p-company-top__cardMedia > .wp-block-group__inner-container{
  height: 100%;
  display: flex;
}

.p-company-top__cardPhoto{
  width: 100%;
  height: 100%;
  margin: 0 !important;
}
.p-company-top__cardPhoto img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ==================================================
  10) 本文（タイトル＋矢印）
================================================== */
.p-company-top__cardBody{
  position: relative;
  height: 100%;

  display: flex;
  align-items: center;
  gap: var(--pct-bodyGap);

  padding-left: var(--pct-ttlPadX);
  padding-right: calc(var(--pct-ttlPadX) + var(--pct-arrowBox) + var(--pct-bodyGap));
}

.p-company-top__cardBody > .wp-block-group__inner-container{
  width: 100%;
  padding: 0 !important;

  display: flex;
  align-items: center;
  gap: var(--pct-bodyGap);
}

.p-company-top__cardTtl{
  font-size: var(--pct-ttlSize);
  font-weight: 700;
  color: var(--pct-ink);
  text-align: left;
}

.p-company-top__cardBody::after{
  content: "";
  width: var(--pct-arrowBox);
  height: var(--pct-arrowBox);
  display: block;

  border-top: var(--pct-arrowStroke) solid var(--pct-accent);
  border-right: var(--pct-arrowStroke) solid var(--pct-accent);

  transform: rotate(45deg);
  transform-origin: 50% 50%;

  margin-left: auto;
  flex: 0 0 auto;
  box-sizing: border-box;

  transition: border-color .18s ease;
}

/* ==================================================
  11) 全面リンク（カード幅だけ）
================================================== */
.p-company-top__cardLink{
  margin: 0 !important;
}

.p-company-top__card .wp-block-buttons{
  position: absolute !important;
  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  z-index: 6 !important;
}

.p-company-top__card .wp-block-button__link{
  position: absolute !important;
  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: transparent !important;
  font-size: 0 !important;

  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
  outline: none !important;
}

.p-company-top__card .wp-block-button__link:focus,
.p-company-top__card .wp-block-button__link:focus-visible,
.p-company-top__card .wp-block-button__link:active{
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ==================================================
  12) hover / focus
================================================== */
.p-company-top__card > .wp-block-group__inner-container:hover .p-company-top__cardBody,
.p-company-top__card:focus-within .p-company-top__cardBody{
  background: var(--pct-accent);
}

.p-company-top__card > .wp-block-group__inner-container:hover .p-company-top__cardTtl,
.p-company-top__card:focus-within .p-company-top__cardTtl{
  color: #fff;
}

.p-company-top__card > .wp-block-group__inner-container:hover .p-company-top__cardBody::after,
.p-company-top__card:focus-within .p-company-top__cardBody::after{
  border-color: #fff;
}

/* ==================================================
  13) PC（960px～）
================================================== */
@media (min-width: 960px){
  .p-company-top{
    --pct-cardW: var(--pct-cardW-pc);
  }
}

/* ==================================================
  14) SP（～959px）
================================================== */
@media not all and (min-width: 960px){
  .p-company-top{
    --pct-cardW: var(--pct-cardW-sp);
  }

  .p-company-top__cardCols{
    display: block;
  }

  .p-company-top__cardMedia > .wp-block-group__inner-container{
    display: block;
    height: auto;
  }

  .p-company-top__cardPhoto,
  .p-company-top__cardPhoto img{
    width: 100%;
    height: auto;
    display: block;
  }

  .p-company-top__cardBody{
    padding: 14px calc(16px + var(--pct-arrowBox) + var(--pct-bodyGap)) 14px 16px;
  }
}
