@charset "UTF-8";

:root {
  interpolate-size: allow-keywords;
  --bl: #000;
  --gray-02: #ccc;
  --grad-01: linear-gradient(90deg, var(--MAIN) 0%, var(--LMAIN) 100%);
  --grad-01-rev: linear-gradient(0deg, var(--MAIN) 0%, var(--LMAIN) 100%);
  --grad-02: linear-gradient(90deg, var(--ACC) 0%, var(--LACC) 100%);
  --grad-02-rev: linear-gradient(0deg, var(--ACC) 0%, var(--LACC) 100%);
  --grad-03: linear-gradient(90deg, var(--OTH) 0%, var(--LOTH) 100%);
  --grad-03-rev: linear-gradient(0deg, var(--OTH) 0%, var(--LOTH) 100%);
  --transition: all 0.3s ease-in-out;
  --oversize: calc((100% - 100vw) / 2);
}

/* ==================================
リセット・調整・ファンデーション
===================================== */
/* 高さを画像自体の高さにする */
:where(img) {
  vertical-align: bottom;
}
:where(.thumb),
:where([class*="__thumb"]) {
  vertical-align: bottom;
  background-color: unset;
}

/*---------- アクセシビリティ ----------*/
/* アイコンをスクリーンリーダーに読み上げられないようにする */
i,
[class*="material-icons"],
[class*="material-symbols"] {
  speak: none;
}

/*---------- BMパーツの調整 ----------*/
/* 疑似要素の削除 */
.no-before::before,
.no-after::after {
  content: unset !important;
}

/* スクロールした後のヘッダーのボタンの高さが変わるときにイージング */
.lib-induce__outer li:has(.lib-induce__btn) {
  transition: all 0.2s;
}

/* ボタンのアイコンを「→」に変更 */
/* :where(.lib-link__btn):not([class*="ico-after-"]):not([class*="ico-before-"]) > .txt::after {
  content: "\ea03";
  font-size: 1em;
} */

/* ボタンのアイコンに●の背景色を入れる */
/* :where(.lib-link__btn):not([class*="ico-after-"]):not([class*="ico-before-"]) {
   > .txt::after {
    color: var(--MAIN);
    background-color: var(--WHT);
    padding: 0.5em;
    border-radius: 50%;
    margin-top: -0.875em;
    line-height: 1;
    font-size: 0.675em;
    transition: var(--transition);
  }
  &:hover > .txt::after {
    color: var(--WHT);
    background-color: var(--MAIN);
  }
  &.bg-wht > .txt::after {
    color: var(--WHT);
    background-color: var(--MAIN);
  }
  &.bg-wht:hover > .txt::after {
    color: var(--MAIN);
    background-color: var(--WHT);
  }
  &.border-accent > .txt::after {
    color: var(--ACC);
  }
  &.border-accent:hover > .txt::after {
    color: var(--WHT);
    background-color: var(--ACC);
  }
  &.border-accent.bg-wht > .txt::after {
    color: var(--WHT);
    background-color: var(--ACC);
  }
  &.border-accent.bg-wht:hover > .txt::after {
    color: var(--ACC);
    background-color: var(--WHT);
  }
  &.border-def > .txt::after {
    color: var(--DEF);
  }
  &.border-def:hover > .txt::after {
    color: var(--WHT);
    background-color: var(--DEF);
  }
} */

/*---------- BMパーツのパターン増設 ----------*/
/* ①②③...のリストマーカー */
:where(.lib-indent__list).--circle>li::before {
  content: counter(ol-bullet);
  text-align: center;
  border: 1px solid var(--DEF);
  border-radius: 50%;
  font-size: 0.75em;
  line-height: 1;
  width: 1.5em;
  height: 1.5em;
  aspect-ratio: 1/1;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.4%;
  /* margin-top: 2px; */
}

/* ※のリストマーカー */
:where(.lib-indent__list).--asterisk {
  >li {
    padding-left: 1.8em;
    position: relative;
  }
  >li::before {
    /* counter-increment: ol-bullet; */
    content: "※";
    display: block;
    width: 2em;
    text-align: center;
    text-align: right;
    position: absolute;
    left: 0;
    top: 0;
    padding-right: 0.5em;
  }
}

/* 「―」（横線）のリストマーカー */
:where(.lib-indent__list).--line {
  >li {
    position: relative;
    padding-left: 2em;
  }
  >li::before {
    content: "―";
    position: absolute;
    top: 0;
    left: 0;
  }
}

/* table 罫線パターン */
:where(table).--border {
  >thead,
  th {
    background-color: unset;
  }
  >thead th:first-child {
    border-left-color: var(--GRY);
  }
  >thead th:last-child {
    border-right-color: var(--GRY);
  }
  th,
  td {
    border: unset;
    border: 1px solid var(--GRY);
  }
  th {
    color: var(--DEF);
  }
  tbody>tr>th:first-child {
    border-left-color: var(--GRY);
  }
}

/* table 下線パターン */
:where(table).--border-bottom {
  border: unset;
  th,
  >thead {
    background-color: unset;
  }
  th,
  td {
    border: unset;
    border-bottom: 1px solid var(--GRY);
  }
  th {
    color: var(--DEF);
    @media print,
    screen and (max-width: 767px) {
      border-top: 1px solid var(--DGRY);
      margin-top: -1px;
    }
  }
  &.--even tbody>tr:nth-child(even)>th {
    background-color: var(--LGRY);
  }
}

/* table 下線パターン2 見出しセルの下線はメインカラー */
:where(table).--border-bottom-main {
  border: unset;
  th,
  >thead {
    background-color: unset;
  }
  th,
  td {
    border: unset;
    border-bottom: 1px solid var(--GRY);
  }
  th {
    color: var(--DEF);
    border-bottom: 1px solid var(--MAIN);
    @media print,
    screen and (max-width: 767px) {
      border-top: 1px solid var(--MAIN);
      border-bottom: 1px solid var(--GRY);
      margin-top: -1px;
    }
  }
  &.--even tbody>tr:nth-child(even)>th {
    background-color: var(--LGRY);
  }
}

/* 見出し"列"だけグレー */
:where(table.--gry) tbody>tr>th {
  background-color: var(--GRY);
  color: var(--DEF);
}
:where(table.--gry) tbody>tr>th:first-child {
  border-left-color: var(--GRY);
}

/* table .lib-table__03に少し余白を入れる */
:where(.lib-table__03).--padding {
  --cell-padding: 0.5em;
  td,
  th {
    padding: var(--cell-padding);
  }
}

/* メディアのスライダーをリストにする */
/* swiper用のclassを削除or無効にした上で利用 */
.lib-blog-001.--list {
  .swiper-wrapper {
    flex-direction: column;
    .swiper-slide {
      width: 100%;
    }
  }
  .lib-media__thumb,
  .lib-media__tag,
  .lib-swiper__control,
  .lib-media__txt {
    display: none;
  }
  .lib-media__txtarea {
    display: flex;
    flex-direction: column;
    gap: 0.25em 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid var(--GRY);
    @media print,
    screen and (min-width: 992px) {
      flex-direction: row;
      align-items: center;
    }
    .lib-media__category {
      order: 2;
    }
    .lib-media__title {
      order: 3;
    }
    .lib-media__txt {
      order: 4;
    }
    .lib-media__time {
      order: 1;
      align-items: flex-start;
      margin-top: 0;
      padding-top: 0;
      border-top: unset;
      min-height: unset;
      @media print,
      screen and (min-width: 992px) {
        text-wrap: nowrap;
      }
    }
  }
}
/* 「記事公開日」のみ表示させる
   （「記事更新日」を非表示） */
.lib-blog-001.--list {
  .lib-media__time:has(p + p) p:nth-of-type(2),
  .lib-media__time:has(p + p) p span {
    display: none;
  }
}

/*---------- Swiper ----------*/
/* 滑らかに */
.u-swiper-liner .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  -o-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}

/* メディアの一覧ページを3カラムにする
   （15em=240px以下にしないようにする） */
/* .media-post__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15em, 1fr));
  grid-template-columns: repeat(auto-fill, minmax(15em, 1fr));
  gap: 1em;
  .media-post__item {
    margin-top: 0;
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
  }
  .media-post__thumb {
    height: auto;
    grid-row: 1/2;
    @media print, screen and (min-width: 768px) {
      width: 100%;
    }
    img {
      object-fit: cover;
      aspect-ratio: 16/9;
    }
  }
  .media-post__inside {
    grid-row: 2/3;
    @media print, screen and (min-width: 768px) {
      padding-left: 0;
    }
    .media-post__chip {
      @media print, screen and (min-width: 768px) {
        margin-top: 0;
      }
    }
  }
} */

/* ==================================
タイポ
===================================== */
/*---------- font（日本語フォントが打ち消される場合に使用） ----------*/
/* @font-face{
	font-family: "Avenir"; ←任意の文字で書く
	src: url('../../dcms_media/fonts/webFonts/Avenir35Light/font.woff2') format('woff2');
	src: url('../../dcms_media/fonts/webFonts/Avenir35Light/font.woff') format('woff');
	font-weight: 300; ←読み込むフォントのデータに合わせてweight設定する（woffデータの中にweightがすべてそろっていれば記載不要）
	unicode-range: U+0030-0039, U+0041-005A, U+0061-007A, U+0021, U+003F, U+0026, U+0025, U+002C, U+002E; ←英数字 + ! ? & % , . を含める
} */
/*↑↑↑必要に応じて記載変更↑↑↑↑*/


/* ゴシックとか */
.ff-notosans {
  font-family: "Noto Sans JP", serif;
}
.ff-lato {
  font-family: "Lato", sans-serif;
  /* letter-spacing: 0.05rem; */
}
.ff-oswald {
  font-family: "Oswald", sans-serif;
}
.ff-poppins {
  font-family: "Poppins", sans-serif;
}
.ff-zenmarugo {
  font-family: "Zen Maru Gothic", sans-serif;
}
.ff-zenkakugo {
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.ff-montserrat {
  font-family: "Montserrat", sans-serif;
}
.ff-staatliches {
  font-family: "Staatliches", sans-serif;
}
.ff-m-plus-rounded-1c {
  font-family: "M PLUS Rounded 1c", sans-serif;
  transform: rotate(0.07deg);
}
.ff-inter {
  font-family: "Inter", sans-serif;
}
/* 明朝とか */
.ff-notoserif {
  font-family: "Noto Serif JP", serif;
}
.ff-yumincho {
  font-family: "Yu Mincho", "YuMincho", serif;
}
.ff-shippori {
  font-family: "Shippori Mincho", serif;
}
.ff-shippori-b1 {
  font-family: "Shippori Mincho B1", serif;
}

/* font-weight */
.fw-600 {
  font-weight: 600 !important;
}
.fw-800 {
  font-weight: 800 !important;
}
.fw-900 {
  font-weight: 900 !important;
}

/* font-size */
@media print,
screen and (min-width: 992px) {
  .fs-lg-50 {
    font-size: 3.125rem;
  }
}
@media print,
screen and (min-width: 992px) {
  .fs-lg-60 {
    font-size: 3.75rem;
  }
}

/* 縦書き */
.vertical-rl {
  writing-mode: vertical-rl;
}

/* 袋文字 */
.text-hukuro {
  /* -webkit-text-stroke: 2px var(--bl);
     text-stroke: 2px var(--bl); */
  text-shadow: 2px 2px 1px var(--bl), -2px 2px 1px var(--bl), 2px -2px 1px var(--bl), -2px -2px 1px var(--bl), 2px 0px 1px var(--bl), 0px 2px 1px var(--bl), -2px 0px 1px var(--bl),
    0px -2px 1px var(--bl);
}
.text-hukuro-wht {
  /* -webkit-text-stroke: 2px var(--WHT);
     text-stroke: 2px var(--WHT); */
  text-shadow: 2px 2px 1px var(--WHT), -2px 2px 1px var(--WHT), 2px -2px 1px var(--WHT), -2px -2px 1px var(--WHT), 2px 0px 1px var(--WHT), 0px 2px 1px var(--WHT), -2px 0px 1px var(--WHT),
    0px -2px 1px var(--WHT);
}

/* ==================================
テキストシャドウ
===================================== */
.text-shadow {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}


/* box-decoration-break */
.decoration-break {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* マーカーのあしらい */
mark {
  background: linear-gradient(transparent 60%, yellow 60%);
}

/* テキストをグラデーションにするベース */
.text-grad {
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}

/* ==================================
ユーティリティー
===================================== */
/*---------- 画像の比率 ----------*/
.u-aspect {
  /* 縦横比はstyleでCSS変数を書き換える
     ex) style="--aspect: 2.51 / 1;" */
  --aspect: auto;
  @media print,
  screen and (min-width: 576px) {
    --aspect-sm: var(--aspect);
  }
  @media print,
  screen and (min-width: 768px) {
    --aspect-md: var(--aspect-sm);
  }
  @media print,
  screen and (min-width: 992px) {
    --aspect-lg: var(--aspect-md);
  }
  @media print,
  screen and (min-width: 1200px) {
    --aspect-xl: var(--aspect-lg);
  }
  @media print,
  screen and (min-width: 1400px) {
    --aspect-xxl: var(--aspect-xl);
  }

  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: var(--aspect);
    @media print,
    screen and (min-width: 576px) {
      aspect-ratio: var(--aspect-sm);
    }
    @media print,
    screen and (min-width: 768px) {
      aspect-ratio: var(--aspect-md);
    }
    @media print,
    screen and (min-width: 992px) {
      aspect-ratio: var(--aspect-lg);
    }
    @media print,
    screen and (min-width: 1200px) {
      aspect-ratio: var(--aspect-xl);
    }
    @media print,
    screen and (min-width: 1400px) {
      aspect-ratio: var(--aspect-xxl);
    }
  }

  &.--4x3 img {
    aspect-ratio: 4 / 3;
  }
  &.--3x2 img {
    aspect-ratio: 3 / 2;
  }
  &.--16x9 img {
    aspect-ratio: 16 / 9;
  }
  &.--21x9 img {
    aspect-ratio: 21 / 9;
  }
  &.--1x1 img {
    aspect-ratio: 1 / 1;
  }
  &.--2x1 img {
    aspect-ratio: 2 / 1;
  }
  &.--3x1 img {
    aspect-ratio: 3 / 1;
  }
  &.--4x1 img {
    aspect-ratio: 4 / 1;
  }
  &.--7x8 img {
    aspect-ratio: 7 / 8;
  }
  &.--9x16 img {
    aspect-ratio: 9 / 16;
  }
  &.--2x3 img {
    aspect-ratio: 2 / 3;
  }
  &.--3x4 img {
    aspect-ratio: 3 / 4;
  }

  /* 画像全体を枠内に入れたいとき */
  &.--contain img,
  .--contain img {
    object-fit: contain;
  }
}

/*---------- 角丸 ----------*/
[class*="u-rounded"] {
  overflow: clip;
}
.u-rounded {
  --round: 0.625em;
  border-radius: var(--round);
  @media print,
  screen and (min-width: 576px) {
    --round-sm: var(--round);
    border-radius: var(--round-sm);
  }
  @media print,
  screen and (min-width: 768px) {
    --round-md: var(--round-sm);
    border-radius: var(--round-md);
  }
  @media print,
  screen and (min-width: 992px) {
    --round-lg: var(--round-md);
    border-radius: var(--round-lg);
  }
  @media print,
  screen and (min-width: 1200px) {
    --round-xl: var(--round-lg);
    border-radius: var(--round-xl);
  }
  @media print,
  screen and (min-width: 1400px) {
    --round-xxl: var(--round-xl);
    border-radius: var(--round-xxl);
  }
}

.u-rounded-_25 {
  border-radius: 0.25rem !important;
}
.u-rounded-_5 {
  border-radius: 0.5rem !important;
}
.u-rounded-_75 {
  border-radius: 0.75rem !important;
}
.u-rounded-1 {
  border-radius: 1rem !important;
}
.u-rounded-1_5 {
  border-radius: 1.5rem !important;
}
.u-rounded-1_25 {
  border-radius: 1.25rem !important;
}
.u-rounded-2 {
  border-radius: 2rem !important;
}
.u-rounded-3 {
  border-radius: 3rem !important;
}

.--round-top {
  border-bottom-right-radius: unset !important;
  border-bottom-left-radius: unset !important;
}
.--round-bottom {
  border-top-right-radius: unset !important;
  border-top-left-radius: unset !important;
}
.--round-right {
  border-top-left-radius: unset !important;
  border-bottom-left-radius: unset !important;
}
.--round-left {
  border-top-right-radius: unset !important;
  border-bottom-right-radius: unset !important;
}
.--round-trans-up {
  border-top-left-radius: unset !important;
  border-bottom-right-radius: unset !important;
}
.--round-trans-down {
  border-top-right-radius: unset !important;
  border-bottom-left-radius: unset !important;
}

/*---------- はみ出させる ----------*/
.u-over {
  margin-inline: var(--oversize);
}
/* 右に */
.u-r-over {
  margin-right: var(--oversize);
}
@media print,
screen and (min-width: 768px) {
  .u-r-md-over {
    margin-right: var(--oversize);
  }
}
@media print,
screen and (min-width: 992px) {
  .u-r-lg-over {
    margin-right: var(--oversize);
  }
}
/* 左に */
.u-l-over {
  margin-left: var(--oversize);
}
@media print,
screen and (min-width: 768px) {
  .u-l-md-over {
    margin-left: var(--oversize);
  }
}
@media print,
screen and (min-width: 992px) {
  .u-l-lg-over {
    margin-left: var(--oversize);
  }
}

.u-l-over-50vw {
  width: 50vw;
  margin-left: calc((50vw - 50%) * -1);
}
.u-r-over-50vw {
  width: 50vw;
  margin-right: -50vw;
}
@media print,
screen and (min-width: 768px) {
  .u-l-over-50vw-md {
    width: 50vw;
    margin-left: calc((50vw - 50%) * -1);
  }
  .u-r-over-50vw-md {
    width: 50vw;
    margin-right: -50vw;
  }
}
@media print,
screen and (min-width: 992px) {
  .u-l-over-50vw-lg {
    width: 50vw;
    margin-left: calc((50vw - 50%) * -1);
  }
  .u-r-over-50vw-lg {
    width: 50vw;
    margin-right: -50vw;
  }
}
@media print,
screen and (min-width: 1200px) {
  .u-l-over-50vw-xl {
    width: 50vw;
    margin-left: calc((50vw - 50%) * -1);
  }
  .u-r-over-50vw-xl {
    width: 50vw;
    margin-right: -50vw;
  }
}
@media print,
screen and (min-width: 1400px) {
  .u-l-over-50vw-xxl {
    width: 50vw;
    margin-left: calc((50vw - 50%) * -1);
  }
  .u-r-over-50vw-xxl {
    width: 50vw;
    margin-right: -50vw;
  }
}

/* ========================================
パーツ
======================================== */
/*---------- アイコン（アイコンフォント想定。大きさはp-*やfs-*、個別にwidth・height指定して調整。） ----------*/
.c-icon {
  aspect-ratio: 1 / 1;
  speak: none;
  display: inline-block;
  vertical-align: bottom;
  line-height: 1;

  --icon-size: 1.5em;
  width: var(--icon-size);
  height: var(--icon-size);
  @media print,
  screen and (min-width: 576px) {
    --icon-size-sm: var(--icon-size);
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }
  @media print,
  screen and (min-width: 768px) {
    --icon-size-md: var(--icon-size-sm);
    width: var(--icon-size-md);
    height: var(--icon-size-md);
  }
  @media print,
  screen and (min-width: 992px) {
    --icon-size-lg: var(--icon-size-md);
    width: var(--icon-size-lg);
    height: var(--icon-size-lg);
  }
  @media print,
  screen and (min-width: 1200px) {
    --icon-size-xl: var(--icon-size-lg);
    width: var(--icon-size-xl);
    height: var(--icon-size-xl);
  }
  @media print,
  screen and (min-width: 1400px) {
    --icon-size-xxl: var(--icon-size-xl);
    width: var(--icon-size-xxl);
    height: var(--icon-size-xxl);
  }

  img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    speak: none;
  }

  &.--cover img {
    object-fit: cover;
  }
}

/*---------- アイコンとテキスト（ボタンによく使う） ----------*/
/* 余白の微調整は「gap-*」 */
.c-icon-text {
  display: grid;
  grid-template-columns: repeat(2, auto);
  column-gap: 0.75em;
  justify-content: center;
  align-items: center;

  /* アイコンだけ右寄せ */
  &.--r {
    grid-template-columns: 1fr auto;
  }
  /* アイコンだけ左寄せ */
  &.--l {
    grid-template-columns: auto 1fr;
  }
}

/*---------- レイアウト ----------*/
/* display: grid;で重ねる */
.l-overlap {
  display: grid;
  >* {
    grid-area: 1 / -1;
  }
}
#tinymce,
.editor_block {
  .l-overlap {
    >* {
      grid-area: unset !important;
      z-index: 1 !important;
      opacity: 1 !important;
    }
  }
}

/* 子要素を中央配置 */
/* 縦 */
.l-v-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* 縦横中央 */
.l-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/*---------- 背景のベース ----------*/
/* 背景画像を敷く場合、
   背景画像に各色のフィルターをかける場合
   疑似要素を配置したいときのベース */
.p-bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  z-index: 1;
  /* opacity（濃さ）はstyleでCSS変数を書き換える
     ex) style="--bg-opacity: 0.5;" */
  --bg-opacity: 0.3;

  /* 疑似要素のファンデーション */
  &::before,
  &::after {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: inherit;
    pointer-events: none;
    speak: none;
    opacity: var(--bg-opacity);
  }
  /* 画像の時 */
  &.--img::before,
  &.--img::after {
    z-index: 1;
  }
  /* グレースケール透明フィルター */
  &.--bl::before {
    background-color: var(--bl);
  }
  &.--def::before {
    background-color: var(--DEF);
  }
  &.--dgry::before {
    background-color: var(--DGRY);
  }
  &.--gry::before {
    background-color: var(--GRY);
  }
  &.--lgry::before {
    background-color: var(--LGRY);
  }
  &.--wh::before {
    background-color: var(--WHT);
  }
  /* メインカラーフィルター */
  &.--main::before {
    background-color: var(--MAIN);
  }
  &.--lmain::before {
    background-color: var(--LMAIN);
  }
  /* アクセントカラーフィルター */
  &.--accent::before {
    background-color: var(--ACC);
  }
  &.--laccent::before {
    background-color: var(--LACC);
  }
  /* 補助色カラーフィルター */
  &.--other::before {
    background-color: var(--OTH);
  }
  &.--lother::before {
    background-color: var(--LOTH);
  }
  /* グラデーションカラーフィルター */
  &.--grad-01::before {
    background: var(--grad-01);
  }
  &.--grad-01-rev::before {
    background: var(--grad-01-rev);
  }
  &.--grad-02::before {
    background: var(--grad-02);
  }
  &.--grad-02-rev::before {
    background: var(--grad-02-rev);
  }
  &.--grad-03::before {
    background: var(--grad-03);
  }
  &.--grad-03-rev::before {
    background: var(--grad-03-rev);
  }

  /* ぼかしフィルター
     強さはstyleでCSS変数を書き換える
     ex) style="--blur: 1em;" */
  &.--blur {
    --blur: 0.5rem;
  }
  &.--blur::after {
    backdrop-filter: blur(var(--blur));
    opacity: 1;
  }

  /* 乗算 */
  &.--multiply::after {
    mix-blend-mode: multiply;
  }
}

/*---------- ホバーアクション ----------*/
.c-hover {
  transition: var(--transition);
  text-decoration: none;
  &:hover {
    text-decoration: none;
  }
  /* 背景色 */
  &.--bg-bl:hover {
    background-color: var(--bl);
  }
  &.--bg-def:hover {
    background-color: var(--DEF);
  }
  &.--bg-dgry:hover {
    background-color: var(--DGRY);
  }
  &.--bg-gry:hover {
    background-color: var(--GRY);
  }
  &.--bg-lgry:hover {
    background-color: var(--LGRY);
  }
  &.--bg-wh:hover {
    background-color: var(--WHT);
  }
  &.--bg-main:hover {
    background-color: var(--MAIN);
  }
  &.--bg-lmain:hover {
    background-color: var(--LMAIN);
  }
  &.--bg-accent:hover {
    background-color: var(--ACC);
  }
  &.--bg-laccent:hover {
    background-color: var(--LACC);
  }
  &.--bg-other:hover {
    background-color: var(--OTH);
  }
  &.--bg-lother:hover {
    background-color: var(--LOTH);
  }
  /* 動き */
  &.--up,
  .--up {
    --translate-up: -0.125rem;
    transition: var(--transition);
  }
  &.--up:hover,
  &:hover .--up {
    transform: translateY(var(--translate-up));
  }
  &.--down,
  .--down {
    --translate-down: 0.125rem;
    transition: var(--transition);
  }
  &.--down:hover,
  &:hover .--down {
    transform: translateY(var(--translate-down));
  }
  &.--right,
  .--right {
    --translate-right: 0.125rem;
    transition: var(--transition);
  }
  &.--right:hover,
  &:hover .--right {
    transform: translateX(var(--translate-right));
  }
  &.--left,
  .--left {
    --translate-left: -0.125rem;
    transition: var(--transition);
  }
  &.--left:hover,
  &:hover .--left {
    transform: translateX(var(--translate-left));
  }
  &.--scale-up,
  .--scale-up {
    --scale: scale(1.1);
    img {
      transition: var(--transition);
    }
    &:hover img {
      transform: var(--scale);
    }
  }
  /* あしらい */
  &.--underline:hover,
  &:hover .--underline {
    text-decoration: underline;
  }
  &.--opacity,
  .--opacity {
    --opacity: 0.8;
    &:hover {
      opacity: var(--opacity);
      img {
        opacity: var(--opacity);
      }
    }
  }
  /* l-overlapで重ねた要素のうち、ホバーしたら--afterが表示される */
  &.--overlap {
    .--after {
      opacity: 0;
      transition: var(--transition);
    }
    &:hover .--after {
      opacity: 1;
    }
  }
  /* 下線が伸びる */
  &.--bottom-line {
    position: relative;
    padding-bottom: min(0.5em, 5%);
    &::after {
      content: "";
      width: 0%;
      height: 2px;
      background-color: currentColor;
      position: absolute;
      bottom: -1px;
      left: 0;
      transition: 0.3s cubic-bezier(0.42, 0, 0.13, 0.99);
    }
    &:hover::after {
      @media (hover: hover) and (pointer: fine) {
        width: 100%;
      }
    }
  }
  /* 下線が伸びる（子要素の場合） */
  .--bottom-line {
    position: relative;
    padding-bottom: min(0.5em, 5%);
    &::after {
      content: "";
      width: 0%;
      height: 2px;
      background-color: currentColor;
      position: absolute;
      bottom: -1px;
      left: 0;
      transition: 0.3s cubic-bezier(0.42, 0, 0.13, 0.99);
    }
  }
  &:hover .--bottom-line::after {
    @media (hover: hover) and (pointer: fine) {
      width: 100%;
    }
  }
  /* shadowを入れる */
  &.--shadow:hover {
    @media (hover: hover) and (pointer: fine) {
      /* box-shadow: 0 .5em 1em currentColor; */
      box-shadow: 0 0.5em 1em rgb(0 0 0 / 30%);
    }
  }
}

/* ホバーしたら下線が左から順に伸びる
   （display: inline;にする必要があるので注意） */
.c-hover-underline-anime {
  display: inline;
  overflow: hidden;
  background-image: linear-gradient(90deg, currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: bottom 0 left 0;
  background-size: 0 1px;
  transition-duration: 0.3s;
  transition-property: background-size;
}
@media (any-hover: hover) {
  .c-hover-underline-anime:hover,
  a:has(.c-hover-underline-anime):hover .c-hover-underline-anime,
  button:has(.c-hover-underline-anime):hover .c-hover-underline-anime {
    background-size: 100% 1px;
  }
}

/* ==================================
ヘッダー
===================================== */
@media print,
screen and (max-width: 991px) {
  .lib-header__outer.typeS .lib-child__panel {
    margin-left: 0;
  }
}

/* ========================================
フッター
======================================== */
.lib-footer__guidance>li~li::before {
  background-color: currentColor;
}
.lib-footer__title>a {
  background-color: transparent;
  border: none;
}
.lib-footer__list {
  display: block;
}
@media print,
screen and (max-width: 767px) {
  .lib-footer__list {
    padding-left: 20px;
  }
}

/* ========================================
CTA
======================================== */

/* ========================================
TOP
======================================== */

/* ========================================
下層
======================================== */
/*---------- 下層MV ----------*/
/* .lib-hero__outer {
  background-color: unset;

  .lib-hero__title {
    font-size: clamp(1.25rem, calc(0.975609756097561rem + 1.170731707317073vw), 2rem);
  }
  .lib-hero__title-en {
    font-size: clamp(2rem, calc(1.2682926829268293rem + 3.1219512195121952vw), 4rem);
    color: var(--MAIN);
    font-weight: bold;
    opacity: 0.2;
    line-height: 1.2;
    margin-bottom: -0.4em;
  }
  .lib-hero__title-en::first-letter {
    text-transform: uppercase;
  }
} */
/* =====================================================================
 * ワイエイシイダステック 載せ替え用 追加スタイル
 * 2026-07-31 / 既存サイト https://yacdastech.co.jp/ 準拠
 * 独自クラスは yd- プレフィックス。nth-child は使用しない
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 0. BM初期テンプレート残骸の除去
 * ------------------------------------------------------------------- */
.lib-fixed__bnr,
.lib-fixed__bnr.js-fixed__bnr {
  display: none !important;
}

/* ---------------------------------------------------------------------
 * 1. ヘッダー
 * ------------------------------------------------------------------- */
.yd-header__logo {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.yd-header__tagline {
  margin: 0 0 2px;
  font-size: 11px;
  line-height: 1.3;
  color: var(--DGRY);
}
.yd-header__logo .thumb img {
  width: auto;
  max-width: 100%;
  height: auto;
}
@media (max-width: 575px) {
  .yd-header__tagline {
    font-size: 10px;
  }
  .yd-header__logo .thumb img {
    max-height: 40px;
  }
}

/* ナビ：和文＋英字の2段組（既存サイト準拠） */
.yd-nav__en {
  display: block;
  font-family: var(--fntEN);
  font-size: 11px;
  font-weight: bold;
  line-height: 1.2;
  color: var(--MAIN);
}
.yd-nav__list>.lib-nav__item>.lib-nav__btn {
  line-height: 1.4;
}
@media (max-width: 767px) {
  /* SPのアコーディオン時は英字を右に寄せず自然な改行のまま */
  .yd-nav__en {
    font-size: 10px;
  }
}

/* ヘッダーCTA（お問い合わせ／電話） */
.yd-induce__tel .lib-induce__btn {
  font-family: var(--fntEN);
  font-weight: bold;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .yd-induce__tel .lib-induce__btn {
    background: transparent;
    color: var(--MAIN);
    pointer-events: none;
  }
}

/* ---------------------------------------------------------------------
 * 2. メガメニュー
 * ------------------------------------------------------------------- */
.yd-mega__grid {
  margin-top: 12px;
}
.yd-mega__hd {
  margin: 0 0 6px;
  padding: 5px 8px;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
  color: var(--WHT);
  background: var(--MAIN);
  border-radius: 2px;
}
.yd-mega__note {
  margin-left: 6px;
  font-size: 11px;
  font-weight: normal;
}
.yd-mega__foot {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--GRY);
}

/* カテゴリ別の見出し色（既存サイトのメガメニュー配色に準拠） */
.yd-mega--cut .yd-mega__hd {
  background: #419fce;
}
.yd-mega--example .yd-mega__hd {
  background: #26b593;
}
.yd-mega--support .yd-mega__hd {
  background: #e28556;
}
.yd-mega--company .yd-mega__hd {
  background: #419fce;
}

/* 説明文＋サムネのカード型（お客様サポート／企業紹介） */
.yd-mega__cards {
  margin-top: 12px;
  padding-left: 0;
  list-style: none;
}
.yd-mega__card>a {
  display: block;
  height: 100%;
  padding: 10px;
  text-decoration: none;
  background: var(--LGRY);
  border-radius: 3px;
  transition: background-color .2s;
}
.yd-mega__card>a:hover {
  background: var(--LMAIN);
}
.yd-mega__card .thumb {
  display: block;
  margin-bottom: 8px;
}
.yd-mega__card .thumb img {
  width: 100%;
  height: auto;
  border-radius: 2px;
}
.yd-mega__card .hd {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
  color: var(--MAIN);
}
.yd-mega__card .tx {
  display: block;
  font-size: 12px;
  line-height: 1.6;
  color: var(--DEF);
}
@media (max-width: 767px) {
  .yd-mega__card .thumb {
    display: none;
  }
  .yd-mega__card .tx {
    display: none;
  }
  .yd-mega__card>a {
    padding: 8px 10px;
    background: transparent;
  }
  .yd-mega__card .hd {
    margin-bottom: 0;
    font-size: 14px;
  }
}

/* ---------------------------------------------------------------------
 * 3. フッター
 * ------------------------------------------------------------------- */
.yd-footer__bnr {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 0;
  padding-left: 0;
  list-style: none;
}
.yd-footer__bnr img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.yd-footer__sublist {
  margin-top: 4px;
  padding-left: 1em;
}
.yd-footer__sublist .lib-footer__item {
  font-size: 12px;
}
@media (max-width: 767px) {
  .yd-footer__bnr {
    justify-content: center;
  }
  .yd-footer__bnr li {
    max-width: 45%;
  }
}

/* ---------------------------------------------------------------------
 * 4. 共通CTA（まずはご相談ください）
 * ------------------------------------------------------------------- */
.yd-cta__bnr {
  padding-left: 0;
  list-style: none;
}
.yd-cta__bnr a {
  display: block;
}
.yd-cta__bnr img {
  width: 100%;
  max-width: 190px;
  height: auto;
  margin: 0 auto;
}
.yd-cta .lib-cta__phone .num {
  font-family: var(--fntEN);
  font-size: 28px;
}
@media (max-width: 575px) {
  .yd-cta .lib-cta__phone .num {
    font-size: 22px;
  }
}

/* ---------------------------------------------------------------------
 * 5. 下層ページ見出しブロック
 *    既存サイトはMVヒーロー画像を持たず「h1セクション名 + h2ページ名＋
 *    キャッチコピー」構成なのでそれを再現する（#contents h1 / #hd2 h2）
 * ------------------------------------------------------------------- */
.yd-pagehead {
  margin-bottom: 24px;
}
/* h1 = セクション名（切断機ラインナップ / 企業紹介 …） */
.yd-pagehead__section {
  margin: 0 0 12px;
  padding: 0 0 6px 12px;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.4;
  color: var(--DGRY);
  border-left: 5px solid var(--MAIN);
}
/* h2 = ページ名 + キャッチコピー（既存: color #0079c0 / border-bottom 2px #a7d2e8） */
.yd-pagehead__main {
  margin: 0;
  padding-bottom: 10px;
  font-size: clamp(22px, 3.4vw, 39px);
  font-weight: bold;
  line-height: 1.35;
  color: var(--MAIN);
  border-bottom: 2px solid #a7d2e8;
}
.yd-pagehead__main .sub {
  display: block;
  margin-bottom: 4px;
  font-size: clamp(16px, 2.2vw, 29px);
  line-height: 1.4;
}
.yd-pagehead__catch {
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 1.8;
}
@media (max-width: 575px) {
  .yd-pagehead {
    margin-bottom: 18px;
  }
  .yd-pagehead__section {
    font-size: 13px;
  }
  .yd-pagehead__catch {
    font-size: 15px;
  }
}

/* ページ内ジャンプナビ（既存 ul.inside_nav） */
.yd-innernav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}
.yd-innernav li a {
  display: block;
  padding: 6px 14px 6px 12px;
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
  color: var(--MAIN);
  background: var(--LMAIN);
  border-radius: 3px;
}
.yd-innernav li a:hover {
  color: var(--WHT);
  background: var(--MAIN);
}

/* ---------------------------------------------------------------------
 * 6. フォーム・サイトマップ等での共通CV非表示
 * ------------------------------------------------------------------- */
body:has(.lib-contact__outer) .lib-cta__outer,
body:has(.lib-sitemap__outer) .lib-cta__outer,
body:has(.lib-complete__outer) .lib-cta__outer,
body:has(.yd-nocta) .lib-cta__outer,
body:has(#contact-form) .lib-cta__outer {
  display: none;
}
/* CTA非表示マーカー（送信完了ページ等・ブロックとして1つ置く） */
.yd-nocta {
  display: none !important;
}

/* ---------------------------------------------------------------------
 * 7. 本文の基本サイズ（既存15px → BtoBガイドライン準拠で16px）
 * ------------------------------------------------------------------- */
#dcms_layoutPageBlock .lib-txt__outer p,
#dcms_layoutPageBlock .lib-txt p {
  font-size: 16px;
  line-height: 1.9;
}

/* ---------------------------------------------------------------------
 * 8. 仕様表（製品ページ・SPで固定幅を解除して縦積み）
 * ------------------------------------------------------------------- */
.yd-spec .lib-tbl-001,
.yd-spec .lib-tbl-001 table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: auto;
}
@media (max-width: 767px) {
  .yd-spec .lib-tbl-001 th,
  .yd-spec .lib-tbl-001 td {
    display: block;
    width: 100% !important;
  }
}

/* ---------------------------------------------------------------------
 * 9. SP共通の崩れ防止
 * ------------------------------------------------------------------- */
@media (max-width: 575px) {
  /* ハードコード幅の画像を全幅化 */
  #dcms_layoutPageBlock img[style*="width"] {
    width: 100% !important;
    height: auto !important;
  }
  /* Bootstrap5 の row-cols-3/4 を1カラムへ */
  .yd-1col-sp>*,
  .yd-1col-sp.row-cols-3>*,
  .yd-1col-sp.row-cols-4>* {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* =====================================================================
 * 10. TOPページ（既存 home.css の 980px固定レイアウトをレスポンシブ再現）
 * ===================================================================== */

/* --- area1: メインビジュアル + バナー（既存: 左490px / 右475px 計686px高） --- */
.yd-top__area1 {
  margin-bottom: 35px;
}
.yd-fv__swiper {
  position: relative;
  overflow: hidden;
}
.yd-fv__swiper img {
  width: 100%;
  height: auto;
}
.yd-fv__pager {
  position: absolute;
  bottom: 8px;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 2;
}
.yd-fv__pager .swiper-pagination-bullet {
  background: var(--WHT);
  opacity: .7;
}
.yd-fv__pager .swiper-pagination-bullet-active {
  background: var(--MAIN);
  opacity: 1;
}
.yd-top__bnrlist {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.yd-top__bnrlist img {
  width: 100%;
  height: auto;
}

/* --- area2: TOPICS（既存: border #999 / 見出し帯 #999 / 右に一覧リンク） --- */
.yd-topics {
  margin-bottom: 35px;
}
.yd-topics__inner {
  display: flex;
  align-items: stretch;
  border: 1px solid #999999;
  background: var(--WHT);
}
.yd-topics__hd {
  flex: 0 0 100px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 18px;
  color: var(--WHT);
  background: #999999;
}
.yd-topics__body {
  flex: 1 1 auto;
  padding: 5px 10px;
  min-width: 0;
}
.yd-topics__body ul,
.yd-topics__body dl {
  margin: 0;
  padding: 0;
  list-style: none;
}
.yd-topics__body li,
.yd-topics__body dt,
.yd-topics__body dd {
  font-size: 15px;
  line-height: 1.6;
}
.yd-topics__body li {
  padding: 5px 10px;
}
.yd-topics__body li+li {
  border-top: 1px solid #C1C1C1;
}
.yd-topics__more {
  flex: 0 0 90px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid #999999;
}
.yd-topics__more a {
  font-size: 16px;
}
@media (max-width: 575px) {
  .yd-topics__inner {
    flex-wrap: wrap;
  }
  .yd-topics__hd {
    flex: 0 0 100%;
    padding: 6px 0;
  }
  .yd-topics__body {
    flex: 1 1 100%;
  }
  .yd-topics__more {
    flex: 0 0 100%;
    border-left: 0;
    border-top: 1px solid #999999;
    padding: 6px 0;
  }
}

/* --- area3: 切断機ラインナップ（既存: bg #F7F7F7 / border #B7B7B7） --- */
.yd-lineup {
  margin-bottom: 35px;
}
.yd-lineup__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px;
  padding: 15px;
  background: #F7F7F7;
  border: 1px solid #B7B7B7;
}
.yd-lineup__hd {
  flex: 0 0 150px;
  margin: 0;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.3;
  background: url(/dcms_media/image/home_images_img_daspen_lineup.png) no-repeat left bottom;
  padding-bottom: 96px;
}
.yd-lineup__hd .en {
  display: block;
  margin-top: 4px;
  font-family: var(--fntEN);
  color: var(--OTH);
  font-size: 12px;
  font-weight: bold;
}
.yd-lineup__list {
  flex: 1 1 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.yd-lineup__list>li {
  flex: 0 0 16.6666%;
  max-width: 16.6666%;
}
.yd-lineup__list a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  height: 100%;
  padding: 4px;
  text-decoration: none;
  text-align: center;
}
.yd-lineup__list a:hover {
  opacity: .6;
}
.yd-lineup__list .ico {
  display: block;
}
.yd-lineup__list .ico img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.yd-lineup__list .txt {
  display: block;
  font-size: 13px;
  line-height: 1.4;
}
@media (max-width: 991px) {
  .yd-lineup__hd {
    flex: 0 0 100%;
    padding-bottom: 0;
    background-position: right bottom;
  }
  .yd-lineup__list>li {
    flex: 0 0 33.3333%;
    max-width: 33.3333%;
  }
}
@media (max-width: 575px) {
  .yd-lineup__list>li {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

/* --- area4: お客様サポート/お問い合わせ（既存: border #B7B7B7 / ボタン背景画像） --- */
.yd-support {
  margin-bottom: 35px;
}
.yd-support__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 15px;
  border: 1px solid #B7B7B7;
}
.yd-support__hd {
  flex: 0 0 155px;
  margin: 0;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 19px;
  font-weight: bold;
  line-height: 1.3;
  background: url(/dcms_media/image/home_images_img_support.png) no-repeat left bottom;
  padding-bottom: 52px;
}
.yd-support__entrusted,
.yd-support__contact {
  flex: 0 0 auto;
  margin: 0;
}
.yd-support__entrusted img,
.yd-support__contact img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.yd-support__list {
  flex: 1 1 380px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.yd-support__list>li {
  flex: 0 0 calc(33.3333% - 8px);
}
.yd-support__list a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 4px 6px;
  color: var(--WHT);
  font-size: 14px;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  background: url(/dcms_media/image/home_images_btn_support.png) no-repeat center / 100% 100%;
}
.yd-support__list a:hover {
  opacity: .6;
}
@media (max-width: 991px) {
  .yd-support__hd {
    flex: 0 0 100%;
    padding-bottom: 0;
    background-position: right bottom;
  }
  .yd-support__list {
    flex: 1 1 100%;
  }
}
@media (max-width: 575px) {
  .yd-support__inner {
    justify-content: center;
  }
  .yd-support__list>li {
    flex: 0 0 calc(50% - 8px);
  }
}

/* HOMEでは BM標準FV（lib-fv-004）を使わない（FV画像が490x686の縦長のため）
   BM側の指定に負けないよう複数セレクタで確実に消す */
body .lib-fv-004,
body .lib-fv-004__outer,
body div.lib-fv-004,
#dcms_mainvisual .lib-fv-004,
.lib-fv__outer .lib-fv-004 {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* --- TOPICS: RSSブロック出力を既存サイト準拠の「日付＋タイトル」1行表示に --- */
.yd-topics .lib-rss__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.yd-topics .lib-rss__list>li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 5px 10px;
  font-size: 15px;
  line-height: 1.6;
}
.yd-topics .lib-rss__list>li+li {
  border-top: 1px solid #C1C1C1;
}
.yd-topics .lib-rss__date {
  flex: 0 0 100px;
  color: var(--DEF);
}
.yd-topics .lib-rss__title {
  flex: 1 1 auto;
  margin: 0;
  min-width: 0;
}
/* 本文はTOPでは出さない（既存サイトは日付＋タイトルのみ） */
.yd-topics .lib-rss__contents {
  display: none;
}
@media (max-width: 575px) {
  .yd-topics .lib-rss__list>li {
    flex-wrap: wrap;
    gap: 2px;
  }
  .yd-topics .lib-rss__date {
    flex: 0 0 100%;
    font-size: 13px;
  }
}

/* ---------- サイトマップページ ---------- */
.yd-sitemap__list,
.yd-sitemap__list ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.yd-sitemap__list>li {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--GRY);
}
.yd-sitemap__list a {
  display: inline-block;
  padding: 4px 0 4px 16px;
  position: relative;
  text-decoration: none;
}
.yd-sitemap__list a::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-top: 2px solid var(--MAIN);
  border-right: 2px solid var(--MAIN);
  rotate: 45deg;
}
.yd-sitemap__list>li>a {
  font-size: 17px;
  font-weight: bold;
  color: var(--MAIN);
}
.yd-sitemap__list ul {
  padding-left: 1.4em;
}
.yd-sitemap__list ul a {
  font-size: 15px;
}
.yd-sitemap__list ul ul {
  padding-left: 1.4em;
}
.yd-sitemap__list ul ul a {
  font-size: 14px;
}
/* =====================================================================
 * yd-reset-bm.css — BMテンプレート既定値の中和レイヤー
 *
 * 既存サイト（common/css/reset.css + common/css/styles.css）の基準値を復元する。
 * BM側は :where(table) th { color:var(--WHT); background-color:var(--MAIN) } や
 * :where(a) { color:var(--DEF) } のように「詳細度0」で色を当ててくるため、
 * 移植CSSが色を指定していない箇所でBMの色が残ってしまう。ここで先に潰す。
 *
 * 読み込み位置は必ず yd-lower-id.css（移植CSS）の直前。
 * 同詳細度なら後発の移植CSSが勝つため、セクション個別指定を邪魔しない。
 * ===================================================================== */

/* --- 基本：既存サイトは line-height 未指定（= normal）／body 15px／#333 --- */
#dcms_layoutPageBlock .yd-body {
  line-height: normal;
  color: #333333;
  font-size: 15px;
  letter-spacing: normal;
  word-spacing: normal;
  /* 既存 styles.css の body と同じスタック。BMの --fntBase だと和文の
     フォールバック先が変わり、テキスト幅が数px〜19pxずれる */
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/* --- 既存 reset.css の全要素リセットを本文内に移植 ---
   既存サイトは h1〜h6 も p も font-size:100% / font-weight:normal なので、
   文字サイズは各セクションCSSの指定だけで決まる。
   これを入れないとBMの見出しサイズ（h4=24px 等）や
   .yd-body p{font-size:15px} が残り、既存の 13px 継承などが壊れる。
   ※ table / caption / tbody / thead / tr / th / td は既存reset同様に対象外 */
#dcms_layoutPageBlock .yd-body div,
#dcms_layoutPageBlock .yd-body h1,
#dcms_layoutPageBlock .yd-body h2,
#dcms_layoutPageBlock .yd-body h3,
#dcms_layoutPageBlock .yd-body h4,
#dcms_layoutPageBlock .yd-body h5,
#dcms_layoutPageBlock .yd-body h6,
#dcms_layoutPageBlock .yd-body p,
#dcms_layoutPageBlock .yd-body blockquote,
#dcms_layoutPageBlock .yd-body pre,
#dcms_layoutPageBlock .yd-body address,
#dcms_layoutPageBlock .yd-body center,
#dcms_layoutPageBlock .yd-body dl,
#dcms_layoutPageBlock .yd-body dt,
#dcms_layoutPageBlock .yd-body dd,
#dcms_layoutPageBlock .yd-body ol,
#dcms_layoutPageBlock .yd-body ul,
#dcms_layoutPageBlock .yd-body li,
#dcms_layoutPageBlock .yd-body fieldset,
#dcms_layoutPageBlock .yd-body form,
#dcms_layoutPageBlock .yd-body legend,
#dcms_layoutPageBlock .yd-body article,
#dcms_layoutPageBlock .yd-body aside,
#dcms_layoutPageBlock .yd-body figure,
#dcms_layoutPageBlock .yd-body figcaption,
#dcms_layoutPageBlock .yd-body section {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  font-family: inherit;
  line-height: normal;
  letter-spacing: inherit;
  word-spacing: inherit;
  vertical-align: baseline;
}

/* インライン要素は line-height を normal で固定すると親からの継承が切れる。
   既存サイトは親の行間をそのまま受け継ぐため inherit にする
   （/company/strongpoint/ や /support/trustee/ の span が 30px→normal になっていた）。 */
#dcms_layoutPageBlock .yd-body span,
#dcms_layoutPageBlock .yd-body a,
#dcms_layoutPageBlock .yd-body abbr,
#dcms_layoutPageBlock .yd-body big,
#dcms_layoutPageBlock .yd-body cite,
#dcms_layoutPageBlock .yd-body code,
#dcms_layoutPageBlock .yd-body del,
#dcms_layoutPageBlock .yd-body dfn,
#dcms_layoutPageBlock .yd-body em,
#dcms_layoutPageBlock .yd-body img,
#dcms_layoutPageBlock .yd-body ins,
#dcms_layoutPageBlock .yd-body q,
#dcms_layoutPageBlock .yd-body s,
#dcms_layoutPageBlock .yd-body small,
#dcms_layoutPageBlock .yd-body strong,
#dcms_layoutPageBlock .yd-body sub,
#dcms_layoutPageBlock .yd-body sup,
#dcms_layoutPageBlock .yd-body var,
#dcms_layoutPageBlock .yd-body b,
#dcms_layoutPageBlock .yd-body u,
#dcms_layoutPageBlock .yd-body i,
#dcms_layoutPageBlock .yd-body label,
#dcms_layoutPageBlock .yd-body mark {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  font-family: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  vertical-align: baseline;
}
/* reset.css: ol, ul { list-style: none } */
#dcms_layoutPageBlock .yd-body ol,
#dcms_layoutPageBlock .yd-body ul {
  list-style: none;
}

/* --- BMが見出し・段落をflex化するのを戻す ---
   BMは h4 等に display:flex を当てるため、子の <a> がフレックスアイテムになり
   幅が縮んで位置がずれる（/cut/ の .lineup h4 > a が 220px→164.5px になっていた）。
   既存サイトはいずれもブロック表示。 */
#dcms_layoutPageBlock .yd-body h1,
#dcms_layoutPageBlock .yd-body h2,
#dcms_layoutPageBlock .yd-body h3,
#dcms_layoutPageBlock .yd-body h4,
#dcms_layoutPageBlock .yd-body h5,
#dcms_layoutPageBlock .yd-body h6,
#dcms_layoutPageBlock .yd-body p,
#dcms_layoutPageBlock .yd-body dl,
#dcms_layoutPageBlock .yd-body dt,
#dcms_layoutPageBlock .yd-body dd,
#dcms_layoutPageBlock .yd-body ul,
#dcms_layoutPageBlock .yd-body ol,
#dcms_layoutPageBlock .yd-body li,
#dcms_layoutPageBlock .yd-body div,
#dcms_layoutPageBlock .yd-body section {
  display: block;
}

/* --- リンク：styles.css a { color:#111111; text-decoration:underline } --- */
#dcms_layoutPageBlock .yd-body a,
#dcms_layoutPageBlock .yd-body a:visited {
  color: #111111;
  text-decoration: underline;
}
#dcms_layoutPageBlock .yd-body a:hover {
  color: #111111;
  text-decoration: none;
}

/* --- テーブル：reset.css table { border-collapse:collapse; width:100% } --- */
#dcms_layoutPageBlock .yd-body table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: auto;
}

/* BMの :where(table) th の白文字＋メインカラー背景＋白ボーダーを打ち消す。
   既存サイトは reset.css で th/td を除外しているためブラウザ既定値のまま。 */
#dcms_layoutPageBlock .yd-body th,
#dcms_layoutPageBlock .yd-body td {
  color: inherit;
  background-color: transparent;
  border: 0;
  padding: 0;
  line-height: normal;
  font-size: inherit;
}
/* reset.css: caption, th { text-align: left } */
#dcms_layoutPageBlock .yd-body caption,
#dcms_layoutPageBlock .yd-body th {
  text-align: left;
}

/* --- 画像 ---
   既存 reset.css の `img { max-width:100% }` は
   `/* よく使うCSS start` コメントの内側にあり**適用されていない**。
   つまり既存サイトの本文画像は width/height 属性どおりに描画され、
   コンテナからはみ出すこともある（例 /cut/das65p/ の 438px アイコン）。
   PCでは clamp せず既存に合わせる。SPは yd-fidelity.css 側で 100% に抑える。 */
@media (min-width: 768px) {
  #dcms_layoutPageBlock .yd-body img:not([class*="lib-"]):not([class*="swiper"]) {
    max-width: none !important;
  }
}
/* ---------- styles.css の共通ユーティリティを移植（既存サイト準拠） ---------- */
#dcms_layoutPageBlock .yd-body .left {
  float: left;
}
#dcms_layoutPageBlock .yd-body .right {
  float: right;
}
#dcms_layoutPageBlock .yd-body .clearfix {
  display: inline-block;
}
#dcms_layoutPageBlock .yd-body .clearfix {
  display: block;
}
#dcms_layoutPageBlock .yd-body .marginB0 {
  margin-bottom: 0;
}
#dcms_layoutPageBlock .yd-body .marginB5 {
  margin-bottom: 5px;
}
#dcms_layoutPageBlock .yd-body .marginB8 {
  margin-bottom: 8px;
}
#dcms_layoutPageBlock .yd-body .marginB10 {
  margin-bottom: 10px;
}
#dcms_layoutPageBlock .yd-body .marginB12 {
  margin-bottom: 12px;
}
#dcms_layoutPageBlock .yd-body .marginB15 {
  margin-bottom: 15px;
}
#dcms_layoutPageBlock .yd-body .marginB20 {
  margin-bottom: 20px;
}
#dcms_layoutPageBlock .yd-body .marginB30 {
  margin-bottom: 30px;
}
#dcms_layoutPageBlock .yd-body .marginB40 {
  margin-bottom: 40px;
}
#dcms_layoutPageBlock .yd-body .marginB50 {
  margin-bottom: 50px;
}
#dcms_layoutPageBlock .yd-body .marginB60 {
  margin-bottom: 60px;
}
#dcms_layoutPageBlock .yd-body .marginL3 {
  margin-left: 3px;
}
#dcms_layoutPageBlock .yd-body .marginL5 {
  margin-left: 5px;
}
#dcms_layoutPageBlock .yd-body .marginL8 {
  margin-left: 8px;
}
#dcms_layoutPageBlock .yd-body .marginL10 {
  margin-left: 10px;
}
#dcms_layoutPageBlock .yd-body .marginL15 {
  margin-left: 15px;
}
#dcms_layoutPageBlock .yd-body .marginL20 {
  margin-left: 20px;
}
#dcms_layoutPageBlock .yd-body .marginL25 {
  margin-left: 25px;
}
#dcms_layoutPageBlock .yd-body .marginL30 {
  margin-left: 30px;
}
#dcms_layoutPageBlock .yd-body .marginL35 {
  margin-left: 35px;
}
#dcms_layoutPageBlock .yd-body .marginT5 {
  margin-top: 5px;
}
#dcms_layoutPageBlock .yd-body .marginT8 {
  margin-top: 8px;
}
#dcms_layoutPageBlock .yd-body .marginT10 {
  margin-top: 10px;
}
#dcms_layoutPageBlock .yd-body .marginT50 {
  margin-top: 50px;
}
#dcms_layoutPageBlock .yd-body .marginLR5 {
  margin: 0 5px;
}
#dcms_layoutPageBlock .yd-body .marginR15 {
  margin-right: 15px;
}
#dcms_layoutPageBlock .yd-body .marginR30 {
  margin-right: 30px;
}
#dcms_layoutPageBlock .yd-body .marginR50 {
  margin-right: 50px;
}
#dcms_layoutPageBlock .yd-body .center {
  text-align: center;
}
#dcms_layoutPageBlock .yd-body .strong {
  font-weight: bold;
}

/* 既存 styles.css の clearfix（:after 擬似要素は抽出漏れするため明示追加） */
#dcms_layoutPageBlock .yd-body .clearfix::after {
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
  content: ".";
}
#dcms_layoutPageBlock .yd-body .clearfix {
  display: block;
}
/* 既存の float 解除ユーティリティ */
#dcms_layoutPageBlock .yd-body br.clear-both,
#dcms_layoutPageBlock .yd-body div.clear-both {
  clear: both;
  font: 1px/1px monospace;
  display: block;
}

/* BMが dl > dt / dd に付ける float を解除（既存サイトは float なし）
   → float すると dl の高さが 0 になり回答ブロックが潰れる */
#dcms_layoutPageBlock .yd-body dt,
#dcms_layoutPageBlock .yd-body dd {
  float: none;
}
/* =====================================================================
 * 下層ページ：既存サイト sec_*.css の移植（build_lower.py 生成）
 *   #contents -> .yd-body / rem -> px / 画像は /dcms_media/image/
 *   #dcms_layoutPageBlock + html.yd-sec-<第1階層> でスコープ
 * ===================================================================== */

/* ---------- sec_cut.css ---------- */
html.yd-sec-cut #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/cut_images_hd1.png) no-repeat;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body h3 {
  color: #0079c0;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/cut_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin-bottom: 20px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lead {
  display: block;
  margin-bottom: 25px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lead p {
  font-size: 15px;
  margin-bottom: 15px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .indexnav {
  font-size: 15px;
  font-weight: bold;
  display: block;
  margin-bottom: 40px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .indexnav a {
  font-weight: bold;
  background: url(/dcms_media/image/cut_images_arrow_l.png) no-repeat 0 0;
  padding-left: 17px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup li {
  display: block;
  float: left;
  width: 220px;
  margin-right: 35px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup li.last {
  margin-right: 0;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4 a {
  color: #fff;
  font-weight: bold;
  background: url(/dcms_media/image/cut_images_hd4.png) no-repeat;
  display: block;
  width: 180px;
  height: 37px;
  padding: 13px 0 0 40px;
  margin-bottom: 15px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4.line2 a {
  height: 47px;
  padding: 3px 0 0 40px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4 a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha( opacity=60 )";
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .overview {
  font-size: 14px;
  display: block;
  height: 90px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .supported {
  color: #0079C0;
  font-size: 13px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .right {
  display: block;
  width: 110px;
  height: 150px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .right img {
  display: block;
  margin: auto;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .list {
  font-size: 13px;
  display: block;
  width: 115px;
  height: 150px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup .list p {
  padding-left: 1em;
  text-indent: -1em;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .inside_nav {
  display: block;
  margin-bottom: 35px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .inside_nav li {
  display: block;
  float: left;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .inside_nav li a {
  background: url(/dcms_media/image/images_icn.png) no-repeat 0 5px;
  display: block;
  padding-left: 12px;
  margin: 0 35px 0 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catch {
  font-size: 23px;
  font-weight: bold;
  display: block;
  margin-bottom: 25px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .feature {
  display: block;
  width: 730px;
  margin-bottom: 30px;
  position: relative;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .feature img {
  float: right;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .feature ul {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .feature ul li {
  color: #0079c0;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  padding-left: 1.3em;
  text-indent: -1.3em;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .feature ul li span {
  font-size: 15px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .worksize {
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 20px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .worksize span {
  color: #0070F2;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dt,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dd {
  display: block;
  float: left;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dt {
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  width: 55px;
  height: 38px;
  padding-top: 17px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dt.shape {
  background: url(/dcms_media/image/cut_images_bg_work_shape.png) no-repeat 0 2px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dt.products {
  background: url(/dcms_media/image/cut_images_bg_work_products.png) no-repeat 0 2px;
  height: 48px;
  padding-top: 7px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dt.type {
  background: url(/dcms_media/image/cut_images_bg_work_type.png) no-repeat 0 2px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dd {
  padding: 0 0 0 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dd.w240 {
  width: 240px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dd.products {
  color: #00529D;
  font-size: 13px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .work dd.type {
  font-size: 13px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction .left,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction .right {
  display: block;
  width: 350px;
  margin-bottom: 50px;
  position: relative;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction h4 {
  color: #0079C0;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction dl,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction dd,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction dt {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction dd {
  float: left;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction dt {
  font-size: 15px;
  width: 190px;
  position: absolute;
  right: 0;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 {
  margin-bottom: 50px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 dl {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 dl dd {
  display: block;
  float: left;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 dl dd.tx {
  width: 410px;
  margin-left: 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 dl dd.tx .hd {
  color: #0079c0;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 5px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .construction2 dl dt {
  display: block;
  float: right;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .speccategory {
  font-size: 18px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .specproducts {
  font-size: 25px;
  font-weight: bold;
  margin-bottom: 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .specproducts span {
  font-size: 20px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec {
  font-size: 12px;
  width: 100%;
  margin-bottom: 10px;
  border-top: 4px solid #9E9E9F;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec tr {
  border-bottom: 1px solid #231815;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec .g {
  background: #F4F3F1;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec th,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td {
  vertical-align: top;
  padding: 5px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec th {
  color: #0079C0;
  width: 100px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec .unit {
  text-align: center;
  width: 65px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec .item {
  width: 150px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec .precision {
  width: 130px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .specnote {
  font-size: 12px;
  margin-bottom: 50px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td table {
  width: 100%;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td table tr {
  border-bottom: none;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td table th,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td table td {
  text-align: center;
  width: 50%;
  padding: 0;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .spec td table th {
  font-size: 22px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dd,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl {
  margin-bottom: 25px;
  position: relative;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dd,
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt {
  float: left;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt {
  padding-left: 10px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt .comname {
  color: #0079C0;
  font-size: 16px;
  font-weight: bold;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt .pname {
  font-size: 17px;
  border-bottom: 1px solid #333333;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catalog_dl dt .btn_dl {
  position: absolute;
  bottom: 0;
  left: 96px;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .btn_dllist {
  display: block;
}
html.yd-sec-cut #dcms_layoutPageBlock .yd-body .btn_dllist a {
  float: right;
}

/* ---------- sec_company.css ---------- */
html.yd-sec-company #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/company_images_hd1.png) no-repeat;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body h3 {
  color: #0079c0;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/company_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin-bottom: 20px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lead {
  display: block;
  margin-bottom: 40px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup {
  display: block;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup li {
  background: #e7f2f7;
  display: block;
  float: left;
  width: 220px;
  min-height: 290px;
  height: auto !important;
  height: 290px;
  margin: 0 35px 50px 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup li.last {
  margin: 0 0 50px 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup a {
  color: #fff;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup h3 {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background: #419fce;
  display: block;
  text-align: center;
  height: 39px;
  padding: 15px 0 0 0;
  margin-bottom: 0;
  border-bottom: 1px solid #0079c0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup h3.line2 {
  height: 49px;
  padding: 5px 0 0 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body .lineup li p {
  display: block;
  padding: 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .lead {
  margin-bottom: 50px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .lead .left {
  width: 480px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dd,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dt {
  display: block;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dd {
  float: left;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dt {
  float: right;
  width: 360px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dt ul li {
  margin-bottom: 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.message .motto dt ul li img {
  display: inline-block;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .lead {
  position: relative;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .lead .left {
  width: 485px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .lead .right img {
  position: absolute;
  top: -70px;
  right: 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best dd,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best dt {
  display: block;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best {
  margin-bottom: 50px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best dd {
  font-size: 16px;
  font-weight: bold;
  line-height: 30px;
  float: left;
  width: 180px;
  padding-left: 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best dd span {
  color: #a2131f;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .best dt {
  float: right;
  width: 540px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .pro,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .pro dt {
  display: block;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .pro {
  margin-bottom: 20px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .pro dt {
  font-size: 16px;
  font-weight: bold;
  line-height: 30px;
  float: left;
  width: 355px;
  padding-left: 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .pro dt span {
  color: #a2131f;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.strongpoint .accent {
  color: #a2131f;
  font-size: 17px;
  font-weight: bold;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .lead {
  position: relative;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .lead .left {
  width: 505px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .lead .right img {
  position: absolute;
  top: -125px;
  right: 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov {
  width: 100%;
  margin-bottom: 50px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov th,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov td {
  vertical-align: top;
  padding: 5px 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov th {
  width: 110px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov th span {
  color: #0079C0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov td .bz li {
  padding-left: 1.6em;
  text-indent: -1.6em;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .ov td span {
  font-weight: bold;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .client {
  margin: 0 0 50px 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .client li {
  margin-bottom: 5px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .products dt,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .products dt span {
  font-size: 16px;
  font-weight: bold;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .products dt span {
  color: #0079C0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.overview .products dd {
  padding: 0 0 15px 22px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .lead {
  position: relative;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .lead .left {
  width: 515px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .lead .right img {
  position: absolute;
  top: -100px;
  right: 0;
  margin: 0 15px 0 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his {
  width: 525px;
  margin-bottom: 50px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his th,
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his td {
  vertical-align: top;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his th {
  color: #0079C0;
  text-align: right;
  padding: 10px 0;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his th.y {
  width: 65px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his th.m {
  width: 40px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.history .his td {
  padding: 10px 0 10px 15px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access h3 {
  color: #0079c0;
  font-size: 15px;
  font-weight: bold;
  background: none;
  display: block;
  height: auto;
  padding: 5px 0 0 0;
  margin: 0 0 15px 10px;
  border-bottom: 2px solid #a7d2e8;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access h4 {
  color: #a2131f;
  font-size: 16px;
  font-weight: bold;
  display: block;
  margin: 0 0 5px 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access .address {
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 10px 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access .tel {
  font-size: 16px;
  margin: 0 0 40px 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access .trans {
  margin: 0 0 20px 10px;
}
html.yd-sec-company #dcms_layoutPageBlock .yd-body.access .map {
  margin: 0 0 50px 10px;
}

/* ---------- sec_support.css ---------- */
html.yd-sec-support #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/support_images_hd1.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body h3 {
  color: #DC641E;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/support_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin-bottom: 20px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.trustee h4 {
  font-size: 18px;
  font-weight: bold;
  display: block;
  height: 33px;
  padding: 7px 0 0 10px;
  margin-bottom: 15px;
  border-left: 5px solid #DC641E;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance h4 {
  color: #DC641E;
  font-size: 17px;
  font-weight: bold;
  display: block;
  margin-bottom: 5px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lead {
  display: block;
  margin-bottom: 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup {
  display: block;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li {
  background: #EAEAEA;
  display: block;
  float: left;
  width: 220px;
  min-height: 325px;
  height: auto !important;
  height: 325px;
  margin: 0 35px 50px 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li.last {
  margin: 0 0 50px 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup a {
  color: #fff;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup h3 {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background: #E28556;
  display: block;
  text-align: center;
  height: 39px;
  padding: 15px 0 0 0;
  margin: 0;
  border-bottom: 1px solid #DC641E;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup h3.line2 {
  height: 49px;
  padding: 5px 0 0 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li p {
  font-size: 14px;
  display: block;
  padding: 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li p a {
  color: #111111;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li.daspen {
  width: 216px;
  min-height: 321px;
  height: auto !important;
  height: 321px;
  border: 2px solid #0079c0;
  position: relative;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li.daspen .title {
  color: #fff;
  font-weight: bold;
  background: #0079c0;
  text-align: center;
  margin-top: 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li.daspen .img_daspen {
  position: absolute;
  top: 80px;
  left: 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .lineup li.daspen .txt_daspen {
  position: absolute;
  bottom: 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .ul_trustee li {
  font-weight: bold;
  display: block;
  text-align: center;
  float: left;
  width: 140px;
  margin: 0 7px 0 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .ul_trustee li.last {
  margin: 0 0 0 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .item {
  font-size: 16px;
  line-height: 28px;
  display: block;
  position: relative;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .item span {
  color: #DC641E;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .item span.note {
  color: #333333;
  font-size: 14px;
  font-weight: bold;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .item .img_daspen {
  position: absolute;
  bottom: 0;
  right: 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav {
  display: block;
  margin-bottom: 30px;
  position: relative;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav .active {
  position: absolute;
  bottom: -2px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav li a {
  font-size: 17px;
  font-weight: bold;
  display: block;
  text-align: center;
  float: left;
  width: 243px;
  padding: 5px 0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav li.f01 a {
  color: #67aad3;
  background: #b2d9ea;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav li.f02 a {
  color: #69ccb4;
  background: #b3e2d9;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .faq_nav li.f03 a {
  color: #e27f4d;
  background: #f4d7c9;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .faq_nav {
  border-bottom: 2px solid #0079c0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .faq_nav li.f01 a {
  color: #fff;
  background: #0079c0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .faq_nav .active {
  left: 5px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .faq_nav {
  border-bottom: 2px solid #00aa87;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .faq_nav li.f02 a {
  color: #fff;
  background: #00aa87;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .faq_nav .active {
  left: 248px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .faq_nav {
  border-bottom: 2px solid #dc641e;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .faq_nav li.f03 a {
  color: #fff;
  background: #dc641e;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .faq_nav .active {
  left: 491px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list {
  display: block;
  padding: 15px 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .q_list {
  background: url(/dcms_media/image/cut_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .q_list {
  background: url(/dcms_media/image/example_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .q_list {
  background: url(/dcms_media/image/support_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list .title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list .lead {
  margin-bottom: 25px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list ul {
  display: block;
  margin-bottom: 35px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list ul li,
html.yd-sec-support #dcms_layoutPageBlock .yd-body .q_list ul li a {
  font-weight: bold;
  margin-bottom: 5px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .q_list ul li {
  color: #0079c0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .q_list ul li {
  color: #00aa87;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .q_list ul li {
  color: #dc641e;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .answer {
  font-size: 20px;
  font-weight: bold;
  display: block;
  padding: 15px 0 50px 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .answer {
  background: url(/dcms_media/image/cut_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .answer {
  background: url(/dcms_media/image/example_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .answer {
  background: url(/dcms_media/image/support_images_hd2.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block {
  display: block;
  margin-bottom: 50px;
  border-top: 1px solid #999999;
  border-left: 1px solid #999999;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dt,
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dd {
  display: block;
  border-bottom: 1px solid #999999;
  border-right: 1px solid #999999;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dt {
  padding: 10px 15px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .a_block dt {
  background: #e5f2f9;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .a_block dt {
  background: #e6f4f1;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .a_block dt {
  background: #f9e7de;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dt p {
  font-size: 16px;
  font-weight: bold;
  display: block;
  min-height: 27px;
  height: auto !important;
  height: 27px;
  padding: 3px 0 0 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.material .a_block dt p {
  color: #0079c0;
  background: url(/dcms_media/image/support_images_faq_icn_q_m.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.products .a_block dt p {
  color: #00aa87;
  background: url(/dcms_media/image/support_images_faq_icn_q_p.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.other .a_block dt p {
  color: #dc641e;
  background: url(/dcms_media/image/support_images_faq_icn_q_o.png) no-repeat;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dd {
  background: url(/dcms_media/image/support_images_faq_icn_a.png) no-repeat 15px 10px;
  padding: 10px 10px 10px 60px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block dd p {
  margin-bottom: 5px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .note {
  font-size: 12px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .a_inner {
  display: block;
  width: 500px;
  padding: 10px 0;
  margin-bottom: 10px;
  border-top: 1px dotted #0079c0;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .l_font {
  font-size: 17px;
  font-weight: bold;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .a_inner .left,
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .a_inner .right {
  display: block;
  width: 240px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .a_inner .left img,
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .a_inner .right img {
  margin-bottom: 10px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost {
  width: 100%;
  margin-bottom: 15px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost th,
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost td {
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost th {
  font-size: 12px;
  background: #b3e2d9;
  text-align: center;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost td {
  font-size: 12px;
  background: #eaeaea;
  text-align: right;
  padding: 0 20px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost td.ta_l {
  text-align: left;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost .g td {
  background: #e6f4f1;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body .a_block .tb_cost .total td {
  background: #81d3bf;
  border-bottom: 5px solid #fff;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance .menu .left {
  display: block;
  width: 480px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance .products dt,
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance .products dt span,
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .products dt,
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .products dt span {
  font-size: 16px;
  font-weight: bold;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance .products dt span,
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .products dt span {
  color: #dc641e;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.maintenance .products dd,
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .products dd {
  padding: 0 0 15px 22px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .about {
  margin-bottom: 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.overhaul .about .left {
  display: block;
  width: 540px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about {
  margin-bottom: 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about .left {
  display: block;
  width: 365px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about .right {
  display: block;
  width: 325px;
  padding-right: 40px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about h4 {
  font-size: 16px;
  font-weight: bold;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about h4 span {
  color: #dc641e;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about .ov {
  margin: 0 0 20px 22px;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about .img img {
  display: inline-block;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.sale .about .img {
  text-align: center;
}
html.yd-sec-support #dcms_layoutPageBlock .yd-body.resale .permit {
  background: #f2cdbb;
  display: inline-block;
  margin: 10px 0 40px;
  padding: 10px 20px;
}

/* ---------- sec_example.css ---------- */
html.yd-sec-example #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/example_images_hd1.png) no-repeat;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body h3 {
  color: #00aa87;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/example_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin-bottom: 20px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body h4 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body h4 span {
  color: #00aa87;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body.index h4 a {
  font-weight: bold;
  background: url(/dcms_media/image/example_images_icn_rotate.png) no-repeat 0 5px;
  display: block;
  margin-bottom: 15px;
  padding-left: 20px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .lead {
  display: block;
  margin-bottom: 25px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .lead p {
  margin-bottom: 15px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .indexnav {
  font-weight: bold;
  display: block;
  margin-bottom: 40px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .indexnav a {
  font-weight: bold;
  background: url(/dcms_media/image/example_images_arrow_l.png) no-repeat 0 0;
  padding-left: 17px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 {
  display: block;
  position: relative;
  margin-bottom: 50px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 {
  margin-bottom: 100px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01 ul,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02 ul,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 ul {
  margin: 0 0 0 15px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01 ul li,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02 ul li,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 ul li {
  margin-bottom: 5px;
  padding-left: 1em;
  text-indent: -1em;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01 .thumb,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02 .thumb,
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 .thumb {
  position: absolute;
  top: 40px;
  right: 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 .thumb {
  top: 60px;
  right: 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task {
  display: block;
  position: relative;
  min-height: 210px;
  height: auto !important;
  height: 210px;
  margin-bottom: 40px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body.sol5 .task {
  min-height: 190px;
  height: auto !important;
  height: 190px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body.sol6 .task {
  min-height: 420px;
  height: auto !important;
  height: 420px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left {
  display: block;
  width: 435px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl {
  font-size: 16px;
  background: #eaeaea;
  display: block;
  padding: 10px 10px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl dt {
  font-weight: bold;
  display: block;
  float: left;
  width: 50px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl dt.t {
  color: #00aa87;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl dd {
  font-weight: bold;
  display: block;
  float: left;
  width: 365px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl dd.s {
  color: #0079c0;
  font-size: 17px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .left dl .line {
  border-bottom: 1px dotted #999999;
  padding-top: 10px;
  margin-bottom: 10px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .right {
  display: block;
  text-align: center;
  position: absolute;
  top: -90px;
  right: 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .task .right p {
  font-weight: bold;
  margin-bottom: 5px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .materialtask {
  border: 1px solid #00aa87;
  padding: 10px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .processchart {
  display: block;
  text-align: center;
  width: 580px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .processchart span {
  font-size: 12px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav {
  display: block;
  margin-bottom: 30px;
  border-bottom: 2px solid #00aa87;
  position: relative;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav .active {
  position: absolute;
  bottom: -2px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav li a {
  color: #848484;
  font-size: 17px;
  font-weight: bold;
  background: #eaeaea;
  display: block;
  text-align: center;
  float: left;
  width: 365px;
  padding: 5px 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav.products li.e01 a {
  color: #fff;
  background: #00aa87;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav.products .active {
  left: 5px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav.work li.e02 a {
  color: #fff;
  background: #00aa87;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .example_nav.work .active {
  left: 370px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item {
  display: block;
  margin-bottom: 30px;
  border-bottom: 3px dotted #848484;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .title {
  margin-bottom: 25px;
  padding: 0 10px;
  border-left: 5px solid #00aa87;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .title h3 {
  color: #333333;
  font-size: 24px;
  font-weight: bold;
  background: none;
  height: auto;
  padding: 0;
  margin-bottom: 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .title h4 {
  color: #00aa87;
  font-size: 17px;
  font-weight: bold;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .point {
  width: 100%;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .point tr {
  border-bottom: 20px solid #fff;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .point th {
  color: #fff;
  font-size: 13px;
  background: #00aa87;
  text-align: center;
  width: 85px;
  padding: 5px 0;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .point td {
  padding: 4px 0 4px 20px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .point td a {
  background: url(/dcms_media/image/example_images_arrow_s.png) no-repeat 0 2px;
  padding: 0 20px 0 15px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .text {
  font-weight: bold;
  background: #ccede6;
  display: block;
  padding: 15px;
  margin-bottom: 25px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .text p,
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .text a {
  font-weight: bold;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .image {
  display: block;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .image li {
  font-size: 12px;
  font-weight: bold;
  display: block;
  text-align: center;
  float: left;
  width: 225px;
  min-height: 210px;
  height: auto !important;
  height: 210px;
  margin: 0 9px 20px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .item .image li img {
  margin-bottom: 5px;
}
html.yd-sec-example #dcms_layoutPageBlock .yd-body .pagenav {
  text-align: center;
}

/* ---------- sec_download.css ---------- */
html.yd-sec-download #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/download_images_hd1.png) no-repeat;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body h3 {
  color: #333333;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/download_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin: 0 0 20px;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item {
  display: block;
  margin-bottom: 50px;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item li {
  display: block;
  width: 300px;
  float: left;
  margin-right: 50px;
  position: relative;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item li h4 {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  background: #0079c0;
  padding: 15px;
  margin-bottom: 15px;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item li h4.line2 {
  padding: 5px 15px;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item li p {
  font-size: 14px;
  margin-bottom: 20px;
}
html.yd-sec-download #dcms_layoutPageBlock .yd-body .item li .btn {
  position: absolute;
  bottom: 0;
  right: 20px;
}

/* ---------- sec_policy.css ---------- */
html.yd-sec-policy #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/policy_images_hd1.png) no-repeat;
}
html.yd-sec-policy #dcms_layoutPageBlock .yd-body h3 {
  color: #333333;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/policy_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin: 0 10px 20px;
}
html.yd-sec-policy #dcms_layoutPageBlock .yd-body .policy p {
  margin: 0 10px 40px;
}
html.yd-sec-policy #dcms_layoutPageBlock .yd-body .policy p.contact {
  margin: 0 10px 20px;
}
html.yd-sec-policy #dcms_layoutPageBlock .yd-body .policy p.address {
  font-size: 16px;
  font-weight: bold;
  margin: 0 10px 40px;
}

/* ---------- sec_sitemap.css ---------- */
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body h1 {
  background: url(/dcms_media/image/sitemap_images_hd1.png) no-repeat;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body h3 {
  color: #0079c0;
  font-size: 17px;
  font-weight: bold;
  background: url(/dcms_media/image/sitemap_images_hd3.png) repeat-x;
  display: block;
  height: 30px;
  padding: 5px 0 0 10px;
  margin: 0 0 20px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body .ex h3 {
  color: #00aa87;
  background: none repeat-x;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body .su h3 {
  color: #dc641e;
  background: none repeat-x;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body h3 span {
  font-size: 14px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body h4 {
  color: #fff;
  background: #0079c0;
  display: block;
  padding: 5px 0 5px 15px;
  margin-bottom: 15px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body .ex h4 {
  background: #00aa87;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl {
  display: block;
  margin-bottom: 40px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl dd,
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl dt {
  font-size: 14px;
  display: block;
  float: left;
  width: 300px;
  margin: 0 50px 0 0;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl ul {
  display: block;
  margin: 0 0 15px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl ul li {
  display: block;
  margin: 0 0 15px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl.cu ul li,
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl.ex ul li,
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl ul ul li {
  margin-bottom: 5px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl ul li ul {
  margin: 5px 0 0 15px;
}
html.yd-sec-sitemap #dcms_layoutPageBlock .yd-body dl ul li a {
  background: url(/dcms_media/image/sitemap_images_arrow_s.png) no-repeat 0 2px;
  padding-left: 15px;
}
/* =====================================================================
 * ページ個別CSS（既存ページの <style> ブロック）の移植
 *   build_pagestyle.py 生成 / html.yd-page-<第1階層>-<第2階層> でスコープ
 *   既存では <style> がリンクCSSより後に来るため、この層は
 *   yd-lower-id.css（セクションCSS）より後に読み込む
 * ===================================================================== */

/* ---------- /cut/dar806/ （/cut/core_drill/dar806.html） ---------- */
html.yd-page-cut-dar806 #dcms_layoutPageBlock .yd-body .construction .right dt {
  right: -30px;
}

/* ---------- /cut/das65p/ （/cut/slice/das65p.html） ---------- */
html.yd-page-cut-das65p #dcms_layoutPageBlock .yd-body .construction .left dt {
  right: -140px;
}

/* ---------- /cut/dasw65n/ （/cut/slice/dasw65n.html） ---------- */
html.yd-page-cut-dasw65n #dcms_layoutPageBlock .yd-body .construction .left dt {
  width: 370px;
  right: -360px;
}

/* ---------- /cut/dbs210/ （/cut/application/dbs210.html） ---------- */
html.yd-page-cut-dbs210 #dcms_layoutPageBlock .yd-body .construction .right dt {
  right: 0;
  width: 170px;
}

/* ---------- /cut/dfs1100/ （/cut/full_auto/dfs1100.html） ---------- */
html.yd-page-cut-dfs1100 #dcms_layoutPageBlock .yd-body .construction .left,
html.yd-page-cut-dfs1100 #dcms_layoutPageBlock .yd-body .construction .right {
  margin-bottom: 30px;
}
html.yd-page-cut-dfs1100 #dcms_layoutPageBlock .yd-body .construction .left dt,
html.yd-page-cut-dfs1100 #dcms_layoutPageBlock .yd-body .construction .right dt {
  width: 150px;
}
html.yd-page-cut-dfs1100 #dcms_layoutPageBlock .yd-body .line {
  margin-bottom: 20px;
  border-bottom: 1px solid #0079c0;
}

/* ---------- /cut/ln2/ （/cut/application/ln2.html） ---------- */
html.yd-page-cut-ln2 #dcms_layoutPageBlock .yd-body .construction .left dt {
  color: #0079c0;
  font-size: 18px;
  font-weight: bold;
  right: -380px;
  width: 475px;
}
/* =====================================================================
 * 既存サイト忠実再現レイヤー（最後に読み込む＝最優先）
 * 実測基準: https://yacdastech.co.jp/  html 62.5%(10px) / body 15px /
 *           .inner 980px固定 / Gナビ 196px×5 / 画像は全て原寸表示
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 0. 画像は拡大しない（既存サイトは全て width/height 属性どおりに表示）
 *    width:auto を !important で当てるとHTMLのwidth属性（プレゼンテーション
 *    ヒント）まで無効化され、画像が自然サイズで描画されてしまう。
 *    例: /cut/ の th01.jpg は width="84" 指定だが自然サイズ110pxで出ていた。
 *    そのため width / height は指定せず、はみ出し防止だけ行う。
 * ------------------------------------------------------------------- */
.yd-body img,
.yd-top__area1 img,
.yd-top__bnrlist img,
.yd-lineup img,
.yd-support img,
.yd-cta__bnr img,
.yd-footer__bnr img,
.yd-header__logo img {
  max-width: 100% !important;
}

/* ---------------------------------------------------------------------
 * 1. コンテナ幅を既存サイトと同じ 980px に固定
 * ------------------------------------------------------------------- */
@media (min-width: 1020px) {
  #dcms_layoutPageBlock>.container,
  .yd-top__area1,
  .yd-topics,
  .yd-lineup,
  .yd-support {
    max-width: 980px !important;
    width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  main#contents {
    padding-left: 0;
    padding-right: 0;
  }
  #dcms_layoutPageBlock {
    max-width: 980px;
    margin: 0 auto;
  }
}

/* ---------------------------------------------------------------------
 * 2. 本文の基本サイズを既存サイト準拠（body 15px）に戻す
 * ------------------------------------------------------------------- */
.yd-body {
  font-size: 15px;
  line-height: 1.7;
}
.yd-body p {
  font-size: 15px;
}
#dcms_layoutPageBlock .lib-txt__outer p,
#dcms_layoutPageBlock .lib-txt p {
  font-size: 15px;
  line-height: 1.7;
}

/* ---------------------------------------------------------------------
 * 3. ヘッダー：PCは既存サイトと同じ2段構成（static / 980px / 高さ215px）
 * ------------------------------------------------------------------- */
@media (min-width: 992px) {
  /* 固定解除 → 本文と重ならない */
  .yd-header.lib-header__outer,
  .yd-header {
    position: static !important;
    height: auto !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  .yd-header .lib-header__inner {
    position: relative !important;
    width: 980px !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  /* 上段 130px：ロゴ＋右側リンク */
  .yd-header .lib-header__bar {
    position: relative !important;
    display: block !important;
    width: 980px !important;
    height: 130px !important;
    min-height: 130px !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .yd-header .yd-header__logo {
    position: absolute !important;
    top: 20px;
    left: 0;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
  }
  .yd-header .yd-header__tagline {
    margin: 0 0 6px !important;
    font-size: 15px !important;
    line-height: 1.3;
    color: var(--DEF);
  }
  .yd-header .yd-header__logo img {
    width: 230px !important;
    height: 68px !important;
    max-width: none !important;
  }
  .yd-header .lib-header__nav {
    position: absolute !important;
    top: 0;
    right: 0;
    display: flex !important;
    align-items: center;
    gap: 16px;
    height: 120px !important;
    padding: 0 !important;
  }
  .yd-header .lib-utility__outer {
    position: static !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
  }
  .yd-header .lib-utility__list {
    display: flex !important;
    gap: 20px;
    margin: 0;
    padding: 0;
  }
  .yd-header .lib-utility__item a {
    font-size: 12px !important;
    font-weight: bold;
  }
  .yd-header .lib-header__clone {
    display: none !important;
  }
  .yd-header .lib-menu__btn {
    display: none !important;
  }

  /* 下段 70px：グローバルナビを静的な横並びバーにする */
  .yd-header .lib-nav__panel {
    display: block !important;
    position: static !important;
    width: 980px !important;
    max-width: 980px !important;
    height: 70px !important;
    min-height: 70px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    background: transparent !important;
    overflow: visible !important;
    inset: auto !important;
  }
  .yd-header .lib-nav__cover {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }
  .yd-header .lib-nav__outer {
    display: block !important;
    width: 980px !important;
    max-width: 980px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .yd-header .yd-nav__list {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 980px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    gap: 0 !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item {
    position: relative !important;
    flex: 0 0 196px !important;
    width: 196px !important;
    max-width: 196px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn {
    display: block !important;
    width: 196px !important;
    height: 70px !important;
    padding: 18px 0 0 !important;
    margin: 0 !important;
    font-size: 16px !important;
    font-weight: bold !important;
    line-height: 18px !important;
    text-align: center !important;
    text-decoration: none !important;
    color: var(--DEF) !important;
    background: #fff !important;
    border: 1px solid #c8c9ca !important;
    box-sizing: border-box;
    cursor: pointer;
  }
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn::after,
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn::before {
    display: none !important;
  }
  .yd-header .yd-nav__en {
    display: block !important;
    margin: 0 !important;
    font-family: var(--fntEN);
    font-size: 11px !important;
    font-weight: bold;
    line-height: 1.4;
    color: #0079c0 !important;
  }
  /* hover / open 時は下線 5px（既存サイト準拠） */
  .yd-header .yd-nav__list>.lib-nav__item:hover>.lib-nav__btn,
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn[aria-expanded="true"] {
    height: 70px !important;
    border-bottom: 5px solid #0079c0 !important;
  }

  /* メガメニュー：ナビ直下に絶対配置。hover でも開く */
  .yd-header .lib-child__panel {
    display: none !important;
    position: absolute !important;
    top: 70px !important;
    left: 0 !important;
    z-index: 300 !important;
    width: 980px !important;
    max-width: 980px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    background: transparent !important;
    overflow: visible !important;
    inset: auto auto auto 0 !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item:hover>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item>.lib-child__panel[aria-hidden="false"] {
    display: block !important;
  }
  /* 3番目以降は右にはみ出すので右寄せ */
  .yd-header .yd-nav__list>.lib-nav__item:nth-last-child(-n+3)>.lib-child__panel {
    left: auto !important;
    right: 0 !important;
    inset: auto 0 auto auto !important;
  }
  .yd-header .lib-child__outer {
    display: block !important;
    width: 980px !important;
    max-width: 980px !important;
    margin: 0 !important;
    padding: 15px 20px !important;
    box-shadow: 0 6px 14px rgba(0, 0, 0, .25);
  }
  .yd-mega--cut .lib-child__outer,
  .yd-mega--cut {
    background: #419fce;
  }
  .yd-mega--example .lib-child__outer,
  .yd-mega--example {
    background: #26b593;
  }
  .yd-mega--support .lib-child__outer,
  .yd-mega--support {
    background: #e28556;
  }
  .yd-mega--company .lib-child__outer,
  .yd-mega--company {
    background: #419fce;
  }
  .yd-header .lib-child__item.--headline {
    margin-bottom: 10px !important;
  }
  .yd-header .lib-child__item.--headline a {
    display: inline-block;
    padding: 5px 14px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: var(--DEF);
    background: #fff;
    border-radius: 2px;
  }
  .yd-header .lib-child__list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
  }
  /* 既存はリンク頭が「>」だけで「・」は付かず、常時下線が入る */
  .yd-header .lib-child__item a {
    display: block;
    padding: 3px 0 3px 12px;
    position: relative;
    font-size: 13px;
    line-height: 1.5;
    text-decoration: underline;
    color: #fff;
  }
  .yd-header .lib-child__item a::before {
    content: none !important;
  }
  .yd-header .lib-child__item a:hover {
    text-decoration: underline;
  }
  /* 既存の見出しボックス（p.hd）は中央寄せ */
  .yd-header .yd-mega__hd {
    margin: 0 0 6px !important;
    padding: 4px 8px !important;
    font-size: 12px !important;
    font-weight: bold;
    line-height: 1.4;
    text-align: center !important;
    color: var(--DEF) !important;
    background: #fff !important;
    border-radius: 2px;
  }
  .yd-header .yd-mega__note {
    font-size: 11px !important;
  }
  .yd-header .yd-mega__card>a {
    background: rgba(255, 255, 255, .9) !important;
  }
  .yd-header .yd-mega__card .hd {
    font-size: 13px !important;
  }
  .yd-header .yd-mega__card .tx {
    font-size: 11px !important;
    line-height: 1.5;
  }
  .yd-header .yd-mega__foot {
    margin-top: 10px !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(255, 255, 255, .5) !important;
  }
  /* ヘッダーCTA（お問い合わせ／電話） */
  .yd-header .lib-induce__outer {
    position: absolute !important;
    top: 40px;
    right: 0;
    display: flex !important;
    gap: 8px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
  }
  .yd-header .lib-induce__btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 46px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    white-space: nowrap;
  }
  .yd-induce__tel .lib-induce__btn {
    font-size: 18px !important;
    font-family: var(--fntEN);
    font-weight: bold;
    background: transparent !important;
    color: var(--MAIN) !important;
    border: 1px solid var(--MAIN);
  }
}

/* ---------------------------------------------------------------------
 * 4. TOP area1：FV 490px ＋ バナー 475px（既存サイトと同じ2カラム）
 * ------------------------------------------------------------------- */
@media (min-width: 1020px) {
  .yd-top__area1>.row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 15px !important;
    margin: 0 !important;
    --bs-gutter-x: 0;
  }
  .yd-top__fvcol {
    flex: 0 0 490px !important;
    width: 490px !important;
    max-width: 490px !important;
    padding: 0 !important;
  }
  .yd-top__bnrcol {
    flex: 0 0 475px !important;
    width: 475px !important;
    max-width: 475px !important;
    padding: 0 !important;
  }
  .yd-fv__swiper {
    width: 490px !important;
    height: 686px !important;
  }
  .yd-fv__swiper .swiper-slide img {
    width: 490px !important;
    height: auto !important;
  }
  .yd-top__bnrlist {
    gap: 15px !important;
  }
  .yd-top__bnrlist img {
    width: 475px !important;
  }
}

/* ---------------------------------------------------------------------
 * 5. TOP area2 TOPICS：既存 980×71（見出し帯100px / 一覧90px）
 * ------------------------------------------------------------------- */
.yd-topics__hd {
  font-size: 18px !important;
}
.yd-topics__body li,
.yd-topics .lib-rss__list>li {
  font-size: 15px !important;
}
.yd-topics .lib-rss__date {
  font-size: 15px !important;
}
.yd-topics__more a {
  font-size: 16px !important;
}

/* ---------------------------------------------------------------------
 * 6. TOP area3 ラインナップ：既存 980×192
 * ------------------------------------------------------------------- */
.yd-lineup__hd {
  font-size: 20px !important;
  line-height: 25px !important;
}
.yd-lineup__hd .en {
  font-size: 12px !important;
}
.yd-lineup__list .txt {
  font-size: 13px !important;
}
@media (min-width: 1020px) {
  .yd-lineup__inner {
    padding: 15px !important;
    gap: 0 !important;
  }
  .yd-lineup__hd {
    flex: 0 0 150px !important;
    padding-bottom: 90px !important;
  }
  .yd-lineup__list>li {
    flex: 0 0 135px !important;
    max-width: 135px !important;
  }
}

/* ---------------------------------------------------------------------
 * 7. TOP area4 サポート：既存 980×152
 * ------------------------------------------------------------------- */
.yd-support__hd {
  font-size: 19px !important;
}
.yd-support__list a {
  font-size: 14px !important;
}
@media (min-width: 1020px) {
  .yd-support__inner {
    padding: 15px !important;
    gap: 8px !important;
  }
  .yd-support__hd {
    flex: 0 0 155px !important;
    padding-bottom: 50px !important;
  }
  .yd-support__list>li {
    flex: 0 0 140px !important;
    max-width: 140px !important;
  }
  .yd-support__list a {
    width: 140px;
    height: 52px;
  }
}

/* ---------------------------------------------------------------------
 * 8. 下層ページ：見出しサイズを既存サイト準拠に
 * ------------------------------------------------------------------- */
.yd-pagehead__section {
  font-size: 15px !important;
}
.yd-pagehead__main {
  font-size: 39px !important;
  line-height: 1.3 !important;
}
.yd-pagehead__main .sub {
  font-size: 29px !important;
}
.yd-pagehead__catch {
  font-size: 16px !important;
}
.yd-innernav li a {
  font-size: 14px !important;
}
/* h3 / table のサイズはセクション別の移植CSS（html.yd-sec-*）に委ねる。
   ここで一律指定すると support(16px) や download(24px) の既存値を壊すため書かない。 */
@media (max-width: 767px) {
  .yd-pagehead__main {
    font-size: 24px !important;
  }
  .yd-pagehead__main .sub {
    font-size: 17px !important;
  }
}

/* ---------------------------------------------------------------------
 * 9. SPではBM標準の固定ヘッダー挙動を維持（本文と重ならないよう余白）
 * ------------------------------------------------------------------- */
@media (max-width: 991px) {
  main#contents {
    padding-top: 70px;
  }
}

/* =====================================================================
 * 反復修正 2回目：既存サイトとの実測差分をゼロにする
 * ===================================================================== */

/* --- ヘッダー：inner の flex を解除して bar(130px) → nav(70px) を縦積み --- */
@media (min-width: 992px) {
  .yd-header .lib-header__inner {
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
    padding-bottom: 15px !important;
    /* 既存ヘッダー総高 215px = 130+70+15 */
  }
  .yd-header .lib-header__bar {
    width: 980px !important;
    min-width: 980px !important;
  }
  /* タグライン20px + 余白19px = ロゴ画像が top:47px に来る（既存と同じ） */
  .yd-header .yd-header__logo {
    top: 8px !important;
  }
  .yd-header .yd-header__tagline {
    margin: 0 0 19px !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }
}

/* --- TOP area1：Bootstrap ガター（gy-4）を打ち消して 686px にする --- */
@media (min-width: 1020px) {
  .yd-top__area1>.row {
    --bs-gutter-y: 0 !important;
    --bs-gutter-x: 0 !important;
    margin-top: 0 !important;
    align-items: flex-start !important;
  }
  .yd-top__area1>.row>* {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
  .yd-top__fvcol,
  .yd-top__bnrcol {
    height: 686px !important;
  }
}

/* --- TOPICS：余分な margin / padding を除去して 71px に --- */
.yd-topics__body {
  margin: 0 !important;
  padding: 0 !important;
  align-self: center;
}
.yd-topics .lib-rss__list {
  margin: 0 !important;
  padding: 0 !important;
}
.yd-topics .lib-rss__list>li {
  padding: 5px 10px !important;
  margin: 0 !important;
}
.yd-topics .lib-rss__title {
  margin: 0 !important;
}
.yd-topics__inner {
  align-items: stretch !important;
}

/* --- ラインナップ：見出しの右に6アイコンを1行で並べる（既存 810px） --- */
@media (min-width: 1020px) {
  .yd-lineup__inner {
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
  }
  .yd-lineup__hd {
    flex: 0 0 138px !important;
    width: 138px !important;
    max-width: 138px !important;
  }
  .yd-lineup__list {
    flex: 0 0 810px !important;
    width: 810px !important;
    max-width: 810px !important;
    flex-wrap: nowrap !important;
    min-width: 0 !important;
  }
}
.yd-lineup__list>li {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.yd-lineup__list>li::marker {
  content: none !important;
}

/* --- サポート：ボタンを3列×2行（既存 ul 450px / li 148px / a 140x52） --- */
@media (min-width: 1020px) {
  .yd-support__inner {
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
  }
  .yd-support__hd {
    flex: 0 0 157px !important;
    width: 157px !important;
    max-width: 157px !important;
  }
  .yd-support__list {
    flex: 0 0 450px !important;
    width: 450px !important;
    max-width: 450px !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
  }
  .yd-support__list>li {
    flex: 0 0 148px !important;
    width: 148px !important;
    max-width: 148px !important;
  }
  .yd-support__list a {
    width: 140px !important;
    height: 52px !important;
    margin: 0 8px 12px 0 !important;
  }
}
.yd-support__list>li {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.yd-support__list>li::marker {
  content: none !important;
}

/* --- メガメニュー内サムネも拡大しない --- */
.yd-mega__card .thumb img {
  width: auto !important;
  max-width: 100% !important;
}

/* =====================================================================
 * 反復修正 3回目：残差分（ヘッダー縦位置 / main余白 / 各セクション高さ）
 * ===================================================================== */
@media (min-width: 992px) {
  /* BMの固定ヘッダー用オフセットを解除（ヘッダーはstaticにしてあるため不要） */
  main#contents {
    padding-top: 0 !important;
  }

  /* bar の上下中央寄せ（top:-65 / transform）を解除 */
  .yd-header .lib-header__bar {
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    align-items: initial !important;
    justify-content: initial !important;
  }
  /* ロゴリンクのBM余白（padding:10px 20px / flex）を解除 → 画像が top:47px に来る */
  .yd-header .yd-header__logo {
    display: block !important;
    flex-direction: initial !important;
    justify-content: initial !important;
    width: 230px !important;
  }
  .yd-header .yd-header__logo>a {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 230px !important;
    height: 68px !important;
  }
  .yd-header .yd-header__logo .thumb {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .yd-header .yd-header__tagline {
    width: 270px !important;
  }
}

/* --- バナー列：画像を原寸 475px で表示（li の内側幅に縮小されないように） --- */
@media (min-width: 1020px) {
  .yd-top__bnrlist,
  .yd-top__bnrlist>li {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    width: 475px !important;
    max-width: 475px !important;
  }
  .yd-top__bnrlist {
    height: 686px !important;
  }
  .yd-top__bnrlist>li {
    height: auto !important;
  }
  .yd-top__bnrlist img {
    width: 475px !important;
    max-width: none !important;
    height: auto !important;
  }
}
.yd-top__bnrlist>li::marker {
  content: none !important;
}

/* --- ラインナップ：既存は container に padding なし（高さ190＋境界2＝192） --- */
@media (min-width: 1020px) {
  .yd-lineup__inner {
    padding: 0 !important;
    height: 190px !important;
    min-height: 190px !important;
    gap: 0 !important;
    align-items: stretch !important;
  }
  .yd-lineup__hd {
    padding: 15px 0 0 15px !important;
    margin: 0 !important;
    height: 190px !important;
    background-position: 3px bottom !important;
  }
  .yd-lineup__list {
    height: 190px !important;
    align-items: flex-end !important;
  }
  .yd-lineup__list a {
    height: 190px !important;
    padding: 0 !important;
    justify-content: flex-end !important;
  }
  .yd-lineup__list .txt {
    padding-bottom: 4px;
  }
}

/* --- サポート：既存は高さ150＋境界2＝152 / ul は top:17px --- */
@media (min-width: 1020px) {
  .yd-support__inner {
    padding: 17px 0 0 !important;
    height: 150px !important;
    min-height: 150px !important;
    gap: 0 !important;
    align-items: flex-start !important;
  }
  .yd-support__hd {
    padding: 0 0 0 15px !important;
    margin: -2px 0 0 !important;
    height: auto !important;
    background-position: 35px bottom !important;
  }
  .yd-support__entrusted {
    margin: 0 5px 0 0 !important;
  }
  .yd-support__contact {
    margin: 0 0 0 auto !important;
    padding-right: 10px;
  }
}

/* =====================================================================
 * 反復修正 4回目：セクション間余白 35px と 境界線込みの高さ
 * 既存: #area1..#area4 は margin-bottom:35px / border 1px を含めた総高
 * ===================================================================== */
@media (min-width: 1020px) {
  .yd-top__area1,
  .yd-topics,
  .yd-lineup,
  .yd-support {
    margin: 0 auto 35px !important;
    padding: 0 !important;
  }
  /* BMのブロックラッパーが足す余白を打ち消す */
  #dcms_layoutPageBlock>div,
  #dcms_layoutPageBlock>.container {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  #dcms_layoutPageBlock>.container+.container {
    margin-top: 0 !important;
  }
  /* 境界線1px×2 を含めた総高を既存に合わせる（box-sizing: border-box 前提） */
  .yd-lineup__inner {
    height: 192px !important;
    min-height: 192px !important;
  }
  .yd-support__inner {
    height: 152px !important;
    min-height: 152px !important;
  }
}

/* =====================================================================
 * 反復修正 5回目：メガメニューはホバー時のみ表示 / ヘッダー右側の重なり解消
 * ===================================================================== */
@media (min-width: 992px) {
  /* BMのJSが全パネルを aria-hidden="false" にするため、属性では判定しない。
     PCではホバー（＋キーボードフォーカス）のみで開く＝既存サイトと同じ挙動 */
  .yd-header .yd-nav__list>.lib-nav__item>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item>.lib-child__panel[aria-hidden="false"],
  .yd-header .yd-nav__list>.lib-nav__item>.lib-child__panel[aria-hidden="true"] {
    display: none !important;
  }
  /* ホバー中の項目だけを開く。focus-within はクリック後もフォーカスが残り
     別項目に移っても開いたままになる（パネルが重なる）ため使わない */
  .yd-header .yd-nav__list>.lib-nav__item:hover>.lib-child__panel {
    display: block !important;
  }

  /* ヘッダー右側：ユーティリティ（上）とCTA（下）を重ならない位置に */
  .yd-header .lib-header__nav {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    gap: 0 !important;
  }
  .yd-header .lib-utility__outer {
    position: absolute !important;
    top: 8px !important;
    right: 0 !important;
    width: max-content !important;
  }
  .yd-header .lib-induce__outer {
    position: absolute !important;
    top: 45px !important;
    right: 0 !important;
    width: max-content !important;
    z-index: 5;
  }

  /* 「お問い合わせ」だけ <a> のため BM が矢印アイコンを付ける → 除去して中央揃えに */
  .yd-header .yd-nav__list>.lib-nav__item>a.lib-nav__btn {
    text-indent: 0 !important;
    background-image: none !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item>a.lib-nav__btn>.txt::before,
  .yd-header .yd-nav__list>.lib-nav__item>a.lib-nav__btn>.txt::after,
  .yd-header .yd-nav__list>.lib-nav__item>a.lib-nav__btn::before,
  .yd-header .yd-nav__list>.lib-nav__item>a.lib-nav__btn::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn>.txt {
    display: block !important;
    padding: 0 !important;
    text-align: center !important;
  }
}

/* =====================================================================
 * 反復修正 6回目：ヘッダーCTAを表示（BMのJSが lib-header__clone へ移動する）
 * ===================================================================== */
@media (min-width: 992px) {
  .yd-header .lib-header__clone {
    display: block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
  }
  /* clone 内に移動した CTA を既存サイトと同じ位置（top:50 / right:0）に */
  .yd-header .lib-header__clone>.lib-induce__outer,
  .yd-header .lib-induce__outer {
    position: absolute !important;
    top: 50px !important;
    right: 0 !important;
    left: auto !important;
    display: flex !important;
    width: max-content !important;
    height: auto !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    z-index: 10;
  }
  .yd-header .lib-induce__outer>li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: auto !important;
  }
  .yd-header .lib-induce__outer>li::marker {
    content: none !important;
  }
  .yd-header .lib-induce__btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    height: 46px !important;
    padding: 0 16px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    white-space: nowrap;
  }
  /* ユーティリティは上段（CTAと重ならない） */
  .yd-header .lib-utility__outer {
    top: 10px !important;
  }
  .yd-header .lib-utility__list {
    justify-content: flex-end !important;
  }
}

/* =====================================================================
 * 反復修正 7回目：ハンバーガー非表示（ID指定に勝つ詳細度）／CTAの二重表示解消
 * ===================================================================== */
@media (min-width: 992px) {
  /* button は id="lib-header-nav" を持つため ID セレクタで確実に消す */
  #lib-header-nav.lib-menu__btn,
  .yd-header #lib-header-nav,
  .yd-header button.lib-menu__btn.js-gnav__btn {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  /* CTAは BM が clone 側へ複製するため、ナビパネル内の元要素は隠す */
  .yd-header .lib-nav__outer>.lib-induce__outer,
  .yd-header .lib-nav__panel .lib-induce__outer {
    display: none !important;
  }
  .yd-header .lib-header__clone>.lib-induce__outer {
    display: flex !important;
  }
  /* ヘッダー右上の箱がハンバーガー分の幅を持たないように */
  .yd-header .lib-header__nav {
    width: 0 !important;
  }
}

/* =====================================================================
 * 反復修正 8回目：ヘッダー右側を既存サイトと同じ画像バナー3点で再現
 * 既存実測: リセール 229x50 (top63/left275) / ダスペン 103x75 (top38/right280)
 *           お問い合わせ 270x63 (top50/right0)
 * ===================================================================== */
.yd-header__extras {
  display: none;
}
.yd-header__extras p {
  margin: 0;
}
.yd-header__extras img {
  width: auto !important;
  max-width: none !important;
  height: auto !important;
}
@media (min-width: 992px) {
  .yd-header__extras {
    display: block !important;
  }
  .yd-header__resale {
    position: absolute !important;
    top: 63px !important;
    left: 275px !important;
  }
  .yd-header__daspen {
    position: absolute !important;
    top: 38px !important;
    right: 280px !important;
  }
  .yd-header__contact {
    position: absolute !important;
    top: 50px !important;
    right: 0 !important;
  }
  /* PCは画像バナーで再現するためテキスト版ユーティリティ/CTAは非表示 */
  .yd-header .lib-utility__outer,
  .yd-header .lib-header__clone>.lib-induce__outer,
  .yd-header .lib-header__clone {
    display: none !important;
  }
}

/* =====================================================================
 * 反復修正 9回目：下層ページ（仕様表の崩れ / 画像の拡大 / 文字サイズ）
 * ===================================================================== */
/* --- 画像は必ず原寸（移植CSSの width:100% に勝つ） --- */
/* width/height を強制するとHTMLのwidth/height属性が無効化され画像が自然サイズになる。
   既存サイトは属性どおりの表示なので、はみ出し防止だけにする。 */
#dcms_layoutPageBlock img:not([class*="lib-"]):not([class*="swiper"]) {
  max-width: 100% !important;
}

/* --- 仕様表：BMがテーブルをflex/block化するのを戻すだけに留める ---
   幅・縦位置は既存サイトの指定（例 .ov th{width:110px}）を残さないと配置が一致しないため、
   width / max-width / vertical-align はここで強制しない。 */
.yd-body table,
.yd-body table.spec,
.yd-spec table {
  table-layout: auto !important;
  border-collapse: collapse !important;
  display: table !important;
}
.yd-body table tr,
.yd-spec table tr {
  display: table-row !important;
  height: auto !important;
  min-height: 0 !important;
}
.yd-body table thead,
.yd-spec table thead {
  display: table-header-group !important;
}
.yd-body table tbody,
.yd-spec table tbody {
  display: table-row-group !important;
}
.yd-body table th,
.yd-body table td,
.yd-spec table th,
.yd-spec table td {
  display: table-cell !important;
  height: auto !important;
  min-height: 0 !important;
  white-space: normal !important;
}
/* spec表のthにnowrapを強制すると自動テーブルの列幅配分が既存とずれる（+32px）ので指定しない */

/* --- 見出し・ナビの文字サイズを既存サイト実測に合わせる --- */
.yd-pagehead__section {
  font-size: 22px !important;
  font-weight: bold !important;
}
.yd-innernav li a {
  font-size: 15px !important;
}
.yd-body p.catch {
  font-size: 23px !important;
}

/* =====================================================================
 * 反復修正 10回目：下層本文は既存どおり float レイアウト＋幅730px
 *   既存 #contents = 730px（980 - 右サイド 230 - 余白20）
 *   flex にすると画像が伸びて解像度が落ちるため PC は float に戻す
 * ===================================================================== */
@media (min-width: 768px) {
  .yd-body {
    max-width: 730px !important;
    width: 730px !important;
  }
  /* 既存はfloatレイアウト。移植CSSの値をそのまま使う（ここでは上書きしない） */
  .yd-body .feature img {
    float: right;
  }
  /* float の解除（既存は .clearfix で解除している） */
  .yd-body .clearfix::after,
  .yd-body .feature::after,
  .yd-body .construction::after,
  .yd-body .lead::after,
  .yd-body .about::after {
    content: "" !important;
    display: block !important;
    clear: both !important;
    height: 0;
    visibility: hidden;
  }
  /* dl/dd 内アイコンも原寸 */
  .yd-body dd img,
  .yd-body dt img {
    width: auto !important;
    max-width: none !important;
  }
  .yd-body dd,
  .yd-body dt {
    max-width: none !important;
  }
}
@media (max-width: 767px) {
  .yd-body {
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* =====================================================================
 * 反復修正 11回目：下層見出しを既存サイトの背景画像スタイルで再現
 *  既存: #contents h1 = hd1.png 730x80（セクション名バナー）
 *        #hd2         = hd2.png 730x108（薄グレー枠＋青上線）
 *        #contents h3 = hd3.png 50x35 repeat-x（薄グレー帯）
 *        .inside_nav  = icn.png 三角＋テキストリンク横並び
 *  html に yd-sec-<第1階層> クラスを CSSJS の JS で付与して切り替える
 * ===================================================================== */

/* --- h1相当（セクション名バナー） --- */
.yd-pagehead {
  margin-bottom: 0 !important;
}
.yd-pagehead__section {
  box-sizing: border-box;
  width: 730px !important;
  max-width: 100%;
  height: 80px !important;
  margin: 0 0 22px !important;
  padding: 26px 0 0 20px !important;
  font-size: 22px !important;
  font-weight: bold !important;
  line-height: 1.2 !important;
  color: #fff !important;
  border: 0 !important;
  background-repeat: no-repeat !important;
  background-position: left top !important;
  background-size: auto !important;
}
.yd-sec-cut .yd-pagehead__section {
  background-image: url(/dcms_media/image/cut_images_hd1.png) !important;
}
.yd-sec-example .yd-pagehead__section {
  background-image: url(/dcms_media/image/example_images_hd1.png) !important;
}
.yd-sec-support .yd-pagehead__section {
  background-image: url(/dcms_media/image/support_images_hd1.png) !important;
}
.yd-sec-company .yd-pagehead__section {
  background-image: url(/dcms_media/image/company_images_hd1.png) !important;
}
.yd-sec-download .yd-pagehead__section {
  background-image: url(/dcms_media/image/download_images_hd1.png) !important;
}
.yd-sec-policy .yd-pagehead__section {
  background-image: url(/dcms_media/image/policy_images_hd1.png) !important;
}
.yd-sec-sitemap .yd-pagehead__section {
  background-image: url(/dcms_media/image/sitemap_images_hd1.png) !important;
}

/* --- h2相当（薄グレー枠＋青上線のボックス） --- */
.yd-pagehead__main {
  box-sizing: border-box;
  width: 730px !important;
  max-width: 100%;
  min-height: 108px !important;
  margin: 0 0 18px !important;
  padding: 30px 20px 10px !important;
  font-size: 39px !important;
  font-weight: bold !important;
  line-height: 1.15 !important;
  color: #0079c0 !important;
  border-bottom: 0 !important;
  background-repeat: no-repeat !important;
  background-position: left top !important;
}
.yd-sec-cut .yd-pagehead__main {
  background-image: url(/dcms_media/image/cut_images_hd2.png) !important;
}
.yd-sec-example .yd-pagehead__main {
  background-image: url(/dcms_media/image/example_images_hd2.png) !important;
  color: #00aa87 !important;
  font-size: 27px !important;
}
.yd-sec-support .yd-pagehead__main {
  background-image: url(/dcms_media/image/support_images_hd2.png) !important;
  color: #dc641e !important;
}
.yd-sec-company .yd-pagehead__main {
  background-image: url(/dcms_media/image/company_images_hd2.png) !important;
}
.yd-sec-download .yd-pagehead__main {
  background-image: url(/dcms_media/image/download_images_hd2.png) !important;
}
.yd-sec-policy .yd-pagehead__main {
  background-image: url(/dcms_media/image/policy_images_hd2.png) !important;
}
.yd-pagehead__main .sub {
  display: block !important;
  margin: 0 0 4px !important;
  font-size: 29px !important;
  line-height: 1.2 !important;
}

/* --- ページ内ジャンプ（既存 inside_nav：三角アイコン＋テキスト横並び） --- */
.yd-innernav {
  display: block !important;
  width: 730px !important;
  max-width: 100%;
  margin: 0 0 35px !important;
  padding: 0 !important;
  overflow: hidden;
  gap: 0 !important;
}
.yd-innernav>li {
  display: block !important;
  float: left !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.yd-innernav>li a {
  display: block !important;
  padding: 0 0 0 12px !important;
  margin: 0 35px 0 10px !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #111 !important;
  text-decoration: underline !important;
  background: url(/dcms_media/image/images_icn.png) no-repeat 0 5px !important;
  border-radius: 0 !important;
}
.yd-innernav>li a:hover {
  color: #111 !important;
  background-color: transparent !important;
  text-decoration: none !important;
}

/* --- h3 ---
   色・サイズ・背景画像はセクション別の移植CSS（html.yd-sec-*）が正しい値を持つので
   ここでは指定しない。以前ここで !important 指定していたが、
   /support/ の .lineup h3（白文字＋#E28556）や /download/ の #333、
   /example/products/ の24px を潰していたため削除した。
   BMがh3をflex化する等の構造上の上書きだけ打ち消す。 */
.yd-body h3 {
  box-sizing: border-box;
  display: block !important;
  border: 0 !important;
}
.yd-body h3+* {
  margin-top: 0;
}

/* =====================================================================
 * 反復修正 12回目：右サイドナビ（230px）とリストマーカーの除去
 *  既存: 本文 730px（左） + サイドナビ 230px（右）= 980px
 * ===================================================================== */
/* リストマーカーが二重に出るのを除去 */
.yd-innernav,
.yd-innernav>li,
.yd-body ul.inside_nav,
.yd-body ul.inside_nav>li,
.yd-snav ul,
.yd-snav li,
.yd-top__bnrlist,
.yd-top__bnrlist>li,
.yd-lineup__list,
.yd-lineup__list>li,
.yd-support__list,
.yd-support__list>li,
.yd-cta__bnr,
.yd-cta__bnr>li,
.yd-footer__bnr,
.yd-footer__bnr>li {
  list-style: none !important;
  list-style-type: none !important;
  padding-left: 0;
}
.yd-innernav>li::marker,
.yd-snav li::marker,
.yd-top__bnrlist>li::marker,
.yd-lineup__list>li::marker,
.yd-support__list>li::marker,
.yd-cta__bnr>li::marker,
.yd-footer__bnr>li::marker {
  content: "" !important;
}
.yd-innernav>li::before,
.yd-snav li::before {
  content: none !important;
}

/* --- 右サイドナビ本体 --- */
.yd-snav {
  display: none;
}
@media (min-width: 768px) {
  .yd-snav {
    display: block;
    float: right;
    width: 210px;
    margin: 0 0 40px 20px;
    font-size: 14px;
    line-height: 1.5;
  }
  #dcms_layoutPageBlock {
    clear: none;
  }
  main#contents::after {
    content: "";
    display: block;
    clear: both;
  }
}
.yd-snav__cat {
  box-sizing: border-box;
  width: 210px;
  height: 51px;
  margin: 0 0 2px;
  padding: 16px 0 0 14px;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  background: no-repeat left top;
}
.yd-sec-cut .yd-snav__cat {
  background-image: url(/dcms_media/image/cut_images_bg_nav_hd1.png);
}
.yd-sec-support .yd-snav__cat {
  background-image: url(/dcms_media/image/support_images_bg_nav_hd1.png);
}
.yd-sec-company .yd-snav__cat {
  background-image: url(/dcms_media/image/company_images_bg_nav_hd1.png);
}
.yd-sec-example .yd-snav__cat {
  background-image: url(/dcms_media/image/cut_images_bg_nav_hd1.png);
}

.yd-snav__list {
  margin: 0;
  padding: 0;
  border-top: 1px solid #b4b4b5;
}
.yd-snav__list>li {
  border-bottom: 1px solid #b4b4b5;
  padding-left: 0;
}
.yd-snav__list>li>a {
  display: block;
  padding: 10px 8px 10px 24px;
  position: relative;
  font-size: 14px;
  font-weight: bold;
  color: var(--DEF);
  text-decoration: none;
}
.yd-snav__list>li>a::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 15px;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--MAIN);
  border-right: 2px solid var(--MAIN);
  transform: rotate(45deg);
}
.yd-snav__list>li>a:hover {
  background: #cbe3ef;
}
.yd-snav__list>li.is-current>a {
  background: #cbe3ef;
}
.yd-snav__index>a {
  font-weight: bold;
}
.yd-snav__sub {
  margin: 0;
  padding: 10px 0 5px 30px;
  background: #f7f7f7;
  border-top: 1px solid #e5e5e5;
}
.yd-snav__sub li a {
  display: block;
  padding: 0 0 5px 15px;
  position: relative;
  font-size: 13px;
  font-weight: normal;
  color: #111;
  text-decoration: underline;
}
.yd-snav__sub li a::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 6px;
  width: 5px;
  height: 5px;
  border-top: 1px solid var(--MAIN);
  border-right: 1px solid var(--MAIN);
  transform: rotate(45deg);
}
.yd-snav__sub li a.is-current {
  font-weight: bold;
  text-decoration: none;
}
.yd-snav__bnr {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 20px 0 0;
  padding: 0;
}
.yd-snav__bnr img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
}

/* --- サイドナビ：サブメニューは現在のグループのみ展開（既存 .sub_menu 挙動） --- */
.yd-snav__sub {
  display: none;
}
.yd-snav__group.is-open>.yd-snav__sub {
  display: block;
}
.yd-snav__group.is-open>a {
  background: #cbe3ef;
}

/* =====================================================================
 * 反復修正 13回目：BMが li::before に付ける青い丸を除去
 *  BM: #dcms_layoutPageBlock li::before { background:#0079c0; 8x8; radius:5px }
 *  既存サイトのリストマーカーは移植CSS側で再現しているため BM の丸は不要
 * ===================================================================== */
#dcms_layoutPageBlock li:not([class*="lib-"])::before,
#dcms_layoutPageBlock li:not([class*="lib-"])::after,
.yd-snav li::before,
.yd-snav li::after,
.yd-cta__bnr>li::before,
.yd-cta__bnr>li::after,
.yd-footer__bnr>li::before,
.yd-footer__bnr>li::after {
  content: none !important;
  display: none !important;
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
}
/* リンク側に付けている自作の矢印は維持する（li ではなく a に付けている） */
.yd-snav__list>li>a::before,
.yd-snav__sub li a::before,
.yd-sitemap__list a::before {
  content: "" !important;
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  background: none !important;
}
.yd-snav__sub li a::before {
  width: 5px !important;
  height: 5px !important;
}
.yd-snav__list>li>a::before {
  border-top: 2px solid var(--MAIN) !important;
  border-right: 2px solid var(--MAIN) !important;
}
.yd-snav__sub li a::before {
  border-top: 1px solid var(--MAIN) !important;
  border-right: 1px solid var(--MAIN) !important;
}
.yd-sitemap__list a::before {
  width: 6px !important;
  height: 6px !important;
  border-top: 2px solid var(--MAIN) !important;
  border-right: 2px solid var(--MAIN) !important;
}

/* =====================================================================
 * 反復修正 14回目：移植CSSは既存の固定幅そのまま（PC一致優先）
 *   → SPは本レイヤーで一括して縦積み・全幅に上書きする
 * ===================================================================== */
@media (max-width: 767px) {
  /* 固定幅・float・固定高さを解除して縦積みに */
  .yd-body *:not(img):not(table):not(thead):not(tbody):not(tr):not(th):not(td) {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    float: none !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
  }
  .yd-body *:not(img):not(table):not(th):not(td) {
    height: auto !important;
    min-height: 0 !important;
  }
  /* 見出し帯は高さを保つ */
  .yd-body h3 {
    height: auto !important;
    min-height: 30px !important;
    padding: 6px 0 6px 10px !important;
  }
  .yd-body img {
    max-width: 100% !important;
    height: auto !important;
  }
  .yd-body ul,
  .yd-body ol,
  .yd-body dl {
    margin-left: 0 !important;
  }
  .yd-body dd,
  .yd-body dt {
    margin-left: 0 !important;
  }
}

/* --- PCで固定幅要素が親からはみ出す場合の保険（dfs1100 の 10px 等） --- */
@media (min-width: 768px) {
  .yd-body {
    overflow-x: visible;
  }
  .yd-body>*,
  .yd-body section,
  .yd-body div {
    max-width: 730px;
  }
  .yd-body table {
    max-width: 730px !important;
  }
  /* 既存が 730px 前提の固定幅ブロックは維持しつつ、超過分だけ抑える */
  .yd-body .work dd,
  .yd-body .work dt,
  .yd-body dd.tx,
  .yd-body p.hd,
  .yd-body p.tx {
    max-width: 730px;
    box-sizing: border-box;
  }
}

/* =====================================================================
 * 反復修正 15回目：下層本文の box-sizing を既存サイトと同じ content-box に
 *   既存サイトは box-sizing 指定なし（content-box）。BMは全要素 border-box のため
 *   「width:110px + padding:10px」の内側が 90px に潰れ、画像が縮小していた。
 * ===================================================================== */
@media (min-width: 768px) {
  .yd-body,
  .yd-body *:not(.yd-snav):not(.yd-snav *) {
    box-sizing: content-box !important;
  }
  /* 幅の基準が変わるため本文コンテナは明示的に content-box + 730px */
  .yd-body {
    width: 730px !important;
    max-width: 730px !important;
    padding: 0 !important;
  }
  /* テーブルは既存も content-box */
  .yd-body table,
  .yd-body th,
  .yd-body td {
    box-sizing: content-box !important;
  }
}
/* SPは border-box のままで全幅化（縦積み） */
@media (max-width: 767px) {
  .yd-body,
  .yd-body * {
    box-sizing: border-box !important;
  }
}

/* =====================================================================
 * 反復修正 16回目：既存 reset.css 相当のリスト初期化
 *   既存サイトは reset.css で ul/ol/li の margin・padding を 0 にしている。
 *   BMは #dcms_layoutPageBlock li に padding-left:16px（青ポチ用）を付けるため
 *   li 幅が +16px になり、3列レイアウトが2列に折り返していた。
 *   ※ ID を含む詳細度でBMに勝ち、移植CSSの個別指定（.yd-body .lineup li p 等）は
 *     子要素側なので影響しない
 * ===================================================================== */
/* BMが付ける padding-left（青ポチ用）と list-style だけを打ち消す。
   margin は移植CSS（既存サイトの値）を壊さないよう触らない */
#dcms_layoutPageBlock .yd-body ul,
#dcms_layoutPageBlock .yd-body ol {
  padding-left: 0;
  list-style: none;
}
#dcms_layoutPageBlock .yd-body li {
  padding-left: 0;
  list-style: none;
}
/* BMが見出し・段落に付ける padding/margin を既存 reset.css 相当に戻す
   （この直後に読み込む yd-lower-id.css / yd-utils-id.css が個別値を復帰させる） */
#dcms_layoutPageBlock .yd-body h1,
#dcms_layoutPageBlock .yd-body h2,
#dcms_layoutPageBlock .yd-body h3,
#dcms_layoutPageBlock .yd-body h4,
#dcms_layoutPageBlock .yd-body h5,
#dcms_layoutPageBlock .yd-body h6,
#dcms_layoutPageBlock .yd-body p,
#dcms_layoutPageBlock .yd-body dl,
#dcms_layoutPageBlock .yd-body dt,
#dcms_layoutPageBlock .yd-body dd,
#dcms_layoutPageBlock .yd-body figure,
#dcms_layoutPageBlock .yd-body blockquote {
  padding: 0;
  margin: 0;
}
/* 既存CSSが明示指定している padding/text-indent は再宣言して復帰させる */
#dcms_layoutPageBlock .yd-body .lineup .list p {
  padding-left: 1em;
  text-indent: -1em;
}
#dcms_layoutPageBlock .yd-body .feature ul li {
  padding-left: 1.3em;
  text-indent: -1.3em;
}
#dcms_layoutPageBlock .yd-body .inside_nav li a {
  padding-left: 12px;
}
/* .q_list ul li への padding-left:1.3em は既存 support.css に無い（当方の誤追加）。
   既存は padding-left:0 のため /support/faq_p/ でリンクが20pxずれていた。 */

/* =====================================================================
 * 反復修正 17回目：FAQ回答ブロック（dl.a_block）の float 解除
 *   BMが dt/dd に float:left を付けるため dl の高さが 0 になり
 *   回答が全て潰れていた（既存は float なしの通常フロー）
 *   ※ .work / .construction / .catalog_dl 等で float が必要な dt/dd は
 *     対象外にするため .a_block 限定で指定する
 * ===================================================================== */
#dcms_layoutPageBlock .yd-body dl.a_block>dt,
#dcms_layoutPageBlock .yd-body dl.a_block>dd,
#dcms_layoutPageBlock .yd-body .a_block>dt,
#dcms_layoutPageBlock .yd-body .a_block>dd {
  float: none !important;
  width: auto !important;
  clear: both !important;
}
#dcms_layoutPageBlock .yd-body dl.a_block,
#dcms_layoutPageBlock .yd-body .a_block {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

/* =====================================================================
 * 反復修正 18回目：dd 内アイコン画像の幅制限を解除
 *   既存は <img height="101"> のみ指定でアスペクト比により幅が伸びる
 *   （366px の画像が 385px 表示）。BMの max-width:100% が親300pxで
 *   縮小していたため原寸より小さくなっていた。
 * ===================================================================== */
@media (min-width: 768px) {
  /* width/height を auto にすると HTML の width/height 属性まで無効化され、
     画像が自然サイズで描画されてしまう（icn_das110_2.png は height="101" 指定で
     385px になるべきところ、自然サイズの 366px で出ていた）。
     幅制限の解除だけ行い、サイズは属性に任せる。 */
  #dcms_layoutPageBlock .yd-body dd img,
  #dcms_layoutPageBlock .yd-body dt img,
  #dcms_layoutPageBlock .yd-body img[height]:not([width]) {
    max-width: none !important;
  }
}
/* =====================================================================
 * 反復修正 19回目：TOP area3 / area4 を既存の絶対配置レイアウトで再現
 *   既存 home.css:
 *     #area3 h2 { bg 18px 90px; height:175px; padding:15px 0 0 15px; abs top:0 left:0 }
 *     #area3 ul { abs top:0 left:165px }  li a { w135 h45 padding-top:145px }
 *     #area4 h2 { bg 50px 90px; height:175px; padding:15px 0 0 15px; abs top:0 left:0 }
 *     #area4 .entrusted { abs top:17px left:170px }
 *     #area4 ul { abs top:17px left:343px w450 }  li a { w140 h35 padding-top:17px }
 *     #area4 .contact { abs top:17px right:10px }
 *   ※ アイコンは img ではなく背景画像。img で入れるとテキストと重なる
 * ===================================================================== */
@media (min-width: 1020px) {
  /* ---- area3 ラインナップ ---- */
  .yd-lineup__inner {
    display: block !important;
    position: relative !important;
    height: 190px !important;
    min-height: 190px !important;
    padding: 0 !important;
    background: #F7F7F7 !important;
    border: 1px solid #B7B7B7 !important;
  }
  .yd-lineup__hd {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: 175px !important;
    margin: 0 !important;
    padding: 15px 0 0 15px !important;
    font-family: Georgia, Times, serif !important;
    font-size: 20px !important;
    line-height: 25px !important;
    font-weight: bold !important;
    background: url(/dcms_media/image/home_images_img_daspen_lineup.png) no-repeat 18px 90px !important;
  }
  .yd-lineup__hd .en {
    display: block !important;
    font-family: var(--fntEN) !important;
    color: var(--OTH) !important;
    font-size: 12px !important;
    font-weight: bold !important;
  }
  .yd-lineup__list {
    position: absolute !important;
    top: 0 !important;
    left: 165px !important;
    display: block !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .yd-lineup__list>li {
    float: left !important;
    width: auto !important;
    max-width: none !important;
    font-size: 13px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }
  .yd-lineup__list>li>a {
    display: block !important;
    width: 135px !important;
    height: 45px !important;
    padding: 145px 0 0 !important;
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    text-decoration: none !important;
    color: var(--DEF) !important;
    background-repeat: no-repeat !important;
  }
  .yd-lineup__list>li>a:hover {
    opacity: .6;
  }
  .yd-lineup__list>li.l01>a {
    background-image: url(/dcms_media/image/home_images_img_l_dysing.png) !important;
    background-position: center 5px !important;
    height: 55px !important;
    padding-top: 135px !important;
  }
  .yd-lineup__list>li.l02>a {
    background-image: url(/dcms_media/image/home_images_img_l_slice.png) !important;
    background-position: center 8px !important;
  }
  .yd-lineup__list>li.l03>a {
    background-image: url(/dcms_media/image/home_images_img_l_fullslice.png) !important;
    background-position: center 25px !important;
    height: 55px !important;
    padding-top: 135px !important;
  }
  .yd-lineup__list>li.l04>a {
    background-image: url(/dcms_media/image/home_images_img_l_forming.png) !important;
    background-position: center 15px !important;
  }
  .yd-lineup__list>li.l05>a {
    background-image: url(/dcms_media/image/home_images_img_l_dar.png) !important;
    background-position: center 20px !important;
  }
  .yd-lineup__list>li.l06>a {
    background-image: url(/dcms_media/image/home_images_img_l_appli.png) !important;
    background-position: center 15px !important;
  }

  /* ---- area4 お客様サポート/お問い合わせ ---- */
  .yd-support__inner {
    display: block !important;
    position: relative !important;
    height: 150px !important;
    min-height: 150px !important;
    padding: 0 !important;
    border: 1px solid #B7B7B7 !important;
  }
  .yd-support__hd {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: 175px !important;
    margin: 0 !important;
    padding: 15px 0 0 15px !important;
    font-family: Georgia, Times, serif !important;
    font-size: 19px !important;
    line-height: 1.3 !important;
    font-weight: bold !important;
    background: url(/dcms_media/image/home_images_img_support.png) no-repeat 50px 90px !important;
  }
  .yd-support__entrusted {
    position: absolute !important;
    top: 17px !important;
    left: 170px !important;
    margin: 0 !important;
  }
  .yd-support__list {
    position: absolute !important;
    top: 17px !important;
    left: 343px !important;
    display: block !important;
    width: 450px !important;
    max-width: 450px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .yd-support__list>li {
    float: left !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }
  .yd-support__list>li>a {
    display: block !important;
    width: 140px !important;
    height: 35px !important;
    padding: 17px 0 0 !important;
    margin: 0 8px 12px 0 !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    text-align: center !important;
    text-decoration: none !important;
    background: url(/dcms_media/image/home_images_btn_support.png) no-repeat left top !important;
  }
  .yd-support__list>li.line2>a {
    height: 47px !important;
    padding-top: 5px !important;
  }
  .yd-support__list>li>a:hover {
    opacity: .6;
  }
  .yd-support__contact {
    position: absolute !important;
    top: 17px !important;
    right: 10px !important;
    margin: 0 !important;
  }
}

/* =====================================================================
 * 反復修正 20回目：フッターバナーを既存の配置で再現
 *   既存 styles.css:
 *     #ft_banner { height:100px; position:relative }  #home は height:200px
 *     .used{top0,left0} .iti{top0,left290} .jgoodtech{top0,left565}
 *     .navi{top75,left565} .resale_top{top95,left0} .resale{top0,right0}
 *   TOPは5点、下層は resale 1点のみ
 * ===================================================================== */
@media (min-width: 1020px) {
  .yd-footer__bnr {
    position: relative !important;
    display: block !important;
    width: 980px !important;
    height: 100px !important;
    margin: 20px 0 0 !important;
    padding: 0 !important;
  }
  .yd-sec-home .yd-footer__bnr {
    height: 200px !important;
  }
  .yd-footer__bnr>li {
    position: absolute !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    list-style: none !important;
    display: none;
  }
  .yd-footer__bnr>li.fb-resale {
    display: block !important;
    top: 0 !important;
    right: 0 !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-resale {
    display: none !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-used {
    display: block !important;
    top: 0 !important;
    left: 0 !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-iti {
    display: block !important;
    top: 0 !important;
    left: 290px !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-jgoodtech {
    display: block !important;
    top: 0 !important;
    left: 565px !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-navi {
    display: block !important;
    top: 75px !important;
    left: 565px !important;
  }
  .yd-sec-home .yd-footer__bnr>li.fb-resale-top {
    display: block !important;
    top: 95px !important;
    left: 0 !important;
  }
}
/* タブレット・SPは折り返して中央に並べる（絶対配置は解除） */
@media (max-width: 1019px) {
  .yd-footer__bnr {
    position: static !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    height: auto !important;
    justify-content: center;
  }
  .yd-footer__bnr>li {
    position: static !important;
    display: block !important;
  }
  .yd-footer__bnr>li.fb-resale {
    display: none !important;
  }
  .yd-footer__bnr>li img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* =====================================================================
 * 反復修正 21回目：共通CV「まずはご相談ください」
 *   既存サイトのTOPには存在しない（下層 #contents_banner のみ）
 *   → TOPだけ非表示にしていたが、第10フェーズのディレクター指示により
 *     下層ページも含め全ページで非表示にする（2026-08-10）
 * ===================================================================== */
.lib-cta__outer,
.yd-cta {
  display: none !important;
}

/* =====================================================================
 * 反復修正 22回目：iPad / SP のグローバルナビとロゴ
 *   ・991px以下はドロワー1列（5列だと日本語が縦に折り返して読めない）
 *   ・ロゴがヘッダー領域からはみ出さないように上限を設ける
 * ===================================================================== */
@media (max-width: 991px) {
  /* ナビは1列。Bootstrap の row-cols-sm-5 を打ち消す */
  .yd-header .yd-nav__list,
  .yd-header .yd-nav__list.row-cols-sm-5 {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item {
    display: block !important;
    flex: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
  }
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 52px !important;
    height: auto !important;
    padding: 12px 16px !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    writing-mode: horizontal-tb !important;
  }
  /* 英字は和文の右に小さく添える（縦積みで間延びしないように） */
  .yd-header .yd-nav__en {
    display: inline-block !important;
    margin-left: .6em !important;
    font-size: 11px !important;
    line-height: 1 !important;
  }
  .yd-header .yd-nav__list>.lib-nav__item>.lib-nav__btn>.txt {
    display: block !important;
    text-align: left !important;
    white-space: normal !important;
  }
  /* メガメニュー内もSPは1列で読みやすく */
  .yd-header .yd-mega__grid>.col,
  .yd-header .yd-mega__cards>.col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
  .yd-header .lib-child__panel {
    width: 100% !important;
    max-width: 100% !important;
  }
  .yd-header .lib-child__outer {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px !important;
  }

  /* ロゴがヘッダーからはみ出さないように */
  .yd-header .yd-header__logo {
    max-width: 62% !important;
    overflow: hidden;
  }
  .yd-header .yd-header__logo>a {
    display: block !important;
    max-width: 100% !important;
  }
  .yd-header .yd-header__logo .thumb {
    display: block !important;
    max-width: 100% !important;
  }
  .yd-header .yd-header__logo img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 44px !important;
    height: auto !important;
  }
  .yd-header .yd-header__tagline {
    width: auto !important;
    max-width: 100% !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    margin: 0 0 2px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media (max-width: 575px) {
  .yd-header .yd-header__logo {
    max-width: 58% !important;
  }
  .yd-header .yd-header__logo img {
    max-height: 38px !important;
  }
}

/* iPad（768〜1019px）：本文は全幅で読みやすく、TOP各セクションは縦積み */
@media (min-width: 768px) and (max-width: 1019px) {
  .yd-body {
    width: 100% !important;
    max-width: 100% !important;
  }
  .yd-snav {
    display: none !important;
  }
  .yd-top__area1>.row {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  .yd-top__fvcol,
  .yd-top__bnrcol {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
  .yd-fv__swiper {
    width: 100% !important;
    height: auto !important;
  }
  .yd-fv__swiper .swiper-slide img {
    width: 100% !important;
    max-width: 490px !important;
    margin: 0 auto;
    display: block;
  }
  .yd-top__bnrlist,
  .yd-top__bnrlist>li {
    width: 100% !important;
    max-width: 100% !important;
  }
  .yd-top__bnrlist img {
    width: 100% !important;
    max-width: 475px !important;
    margin: 0 auto;
    display: block;
  }
  .yd-lineup__inner,
  .yd-support__inner {
    display: flex !important;
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 15px !important;
  }
  .yd-lineup__hd,
  .yd-support__hd {
    position: static !important;
    height: auto !important;
    flex: 0 0 100% !important;
    background-image: none !important;
    padding: 0 0 10px !important;
  }
  .yd-lineup__list,
  .yd-support__list {
    position: static !important;
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center;
  }
  .yd-lineup__list>li,
  .yd-support__list>li {
    float: none !important;
  }
  .yd-support__entrusted,
  .yd-support__contact {
    position: static !important;
    margin: 10px 8px 0 0 !important;
  }
}

/* =====================================================================
 * 反復修正 23回目：本文リンクの擬似要素アイコンを消す
 *   BMは外部リンク（target="_blank"）の a::after に11.2pxのアイコンを付ける。
 *   既存サイトにはこのアイコンが無いため、リンク幅が広がり
 *   （/sitemap/ の English が 64px→81px）、行の折り返し位置までずれていた
 *   （/example/03/ の注記が2行に割れる）。既存CSSは a の擬似要素を使っていない。
 * ===================================================================== */
#dcms_layoutPageBlock .yd-body a::before,
#dcms_layoutPageBlock .yd-body a::after {
  content: none !important;
  display: none !important;
}

/* =====================================================================
 * 第5フェーズ：本文コンテナに BFC を作る
 *   （下層ページの高さ残差 +17〜37% の主因はこれだった）
 *
 *   既存サイトの #contents は float:left で BFC を形成しているため、
 *   本文内の clearfix（.feature::after 等の clear:both）は
 *   右サイドナビ #sub の float をクリアしない。
 *   BM は .yd-body が float:none なので、本文内の clear:both が
 *   .yd-snav（float:right・下端1285px）までクリアしてしまい、
 *   clearfix を持つブロックがサイドナビ下端まで引き伸ばされていた。
 *     例）/cut/das110/ の .feature  既存 359px → BM 615px（+256px）
 *
 *   float:left ではなく display:flow-root を使う理由：
 *   同じ BFC 効果を得ながら通常フローを維持でき、
 *   後続の共通CTAが本文に回り込むのを避けられる。
 *   overflow:hidden も BFC を作るが、.construction dt の
 *   right:-360px 等のはみ出しをクリップしてしまうため不可。
 * ===================================================================== */
#dcms_layoutPageBlock .yd-body {
  display: flow-root !important;
}

/* =====================================================================
 * 第5フェーズ：タブレット帯（768〜1019px）を SP と同じ縦積みに統一
 *
 *   既存サイトは完全に非レスポンシブ（980px 固定・viewport なし）で
 *   768px では横スクロールが発生する。つまりタブレット幅に
 *   「既存の正解」は存在せず、この帯は当方設計。
 *
 *   この帯では .yd-body は既に可変（100%＝実効696px）になっていたが、
 *   既存由来の固定幅ブロックだけが 730px のまま取り残され、
 *   親を 6px 超えていた（.feature が right 759px / 実効幅 753px）。
 *   中途半端な「PCレイアウトの圧縮版」をやめ、
 *   SP（≤767px）と同じ縦積み・可変に寄せて崩れをなくす。
 *   指定内容は SP ブロック（反復修正14回目）と同一方針。
 * ===================================================================== */
@media (min-width: 768px) and (max-width: 1019px) {
  /* SP と同じ border-box に（PC帯の content-box を打ち消す） */
  #dcms_layoutPageBlock .yd-body,
  #dcms_layoutPageBlock .yd-body * {
    box-sizing: border-box !important;
  }

  /* 固定幅・float・position ずらしを解除して縦積みに */
  #dcms_layoutPageBlock .yd-body *:not(img):not(table):not(thead):not(tbody):not(tr):not(th):not(td) {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    float: none !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
  }
  #dcms_layoutPageBlock .yd-body *:not(img):not(table):not(th):not(td) {
    height: auto !important;
    min-height: 0 !important;
  }
  /* 見出し帯は高さを保つ */
  #dcms_layoutPageBlock .yd-body h3 {
    height: auto !important;
    min-height: 30px !important;
    padding: 6px 0 6px 10px !important;
  }
  #dcms_layoutPageBlock .yd-body img {
    max-width: 100% !important;
    height: auto !important;
  }
  #dcms_layoutPageBlock .yd-body ul,
  #dcms_layoutPageBlock .yd-body ol,
  #dcms_layoutPageBlock .yd-body dl {
    margin-left: 0 !important;
  }
  #dcms_layoutPageBlock .yd-body dd,
  #dcms_layoutPageBlock .yd-body dt {
    margin-left: 0 !important;
  }
}

/* =====================================================================
 * 第5フェーズ 追加修正：タブレット帯の画像幅と現在位置マーカー
 *
 * (1) タブレット帯で画像が親からはみ出す（/support/trustee/ 730px・
 *     /company/access/ 718px が実効幅 753px を超える）
 *     原因：反復修正19回目の
 *       @media(min-width:768px) #dcms_layoutPageBlock .yd-body
 *         img:not([class*="lib-"]):not([class*="swiper"]) { max-width:none }
 *     の詳細度が :not() 内の属性セレクタ2つ分だけ高く（1,3,1）、
 *     こちらの #dcms_layoutPageBlock .yd-body img（1,1,1）が負けていた。
 *     → 同じセレクタ形で書き、後勝ちで上書きする。
 *     PC（≥1020px）は原寸維持のため対象外（既存忠実再現を壊さない）。
 *
 * (2) セクションタブの現在位置マーカー（.active）が横スクロールを起こす
 *     既存CSSは PC 座標の絶対配置（.yd-body.other .faq_nav .active{left:491px}）。
 *     SPブロックの一括解除は :not(img) で img を除外しているため、
 *     img.active の position/left が残り 375px 幅で 143px はみ出していた。
 *     タブが縦積みになる幅ではマーカーの指し示す先が無いので隠す。
 * ===================================================================== */
@media (min-width: 768px) and (max-width: 1019px) {
  #dcms_layoutPageBlock .yd-body img:not([class*="lib-"]):not([class*="swiper"]) {
    max-width: 100% !important;
    height: auto !important;
  }
}
@media (max-width: 1019px) {
  #dcms_layoutPageBlock .yd-body .faq_nav .active,
  #dcms_layoutPageBlock .yd-body .example_nav .active {
    display: none !important;
  }
}

/* =====================================================================
 * 第6フェーズ（2026-08-04）ディレクター指摘の2件（PC幅）
 *
 * (1) グローバルナビのロゴに影が入る（既存サイトには影なし）
 *     BM標準 lib.common.css の
 *       @media print, screen and (min-width:992px)
 *       .lib-header__outer.lib-header-BS01 .lib-header__logo a {
 *         background-color:#fff; height:90px; box-shadow: rgba(0,0,0,.3) 0 0 10px; }
 *     が原因。影だけ消す（白背景・高さはBM側の意匠として残す）。
 *     ※ この a には transition:0.3s があるため、開発ツールで後から
 *       box-shadow:none を当てると 0.3s の遷移途中の値
 *       （rgba(0,0,0,0.29) 0 0 9.61889px）が見えて「消えていない」ように誤読する。
 *
 * (2) フッターのバナー画像がフッターのサイトマップナビに重なる
 *     原因は座標ではなく**置かれている場所**。
 *     ul.yd-footer__bnr（width:980px）が
 *     div.lib-footer__info（実幅381px・Bootstrapの col）の**中**にあるため、
 *     980px 分が右へ突き出して隣のナビ列（left 464px〜）の上に乗っていた。
 *     既存サイトはバナーを #ft_sitemap（4列ナビ）の**下**に置いている
 *     （1300px 実測：ナビ 153→1133 / y1456→1777、バナー群は y1777 以降）。
 *     → .lib-footer__inner を基準に、バナーをフッター下部へ絶対配置する。
 *       .lib-footer__inner 内に他の絶対配置要素は無いので relative 追加は安全（実測確認済み）。
 *       バナー個々の left/top（used:0,0 / iti:290,0 / jgoodtech:565,0 /
 *       navi:565,75 / resale:0,95）は既存と一致しているのでそのまま使う。
 *     タブレット・SP（≤1019px）は flex 折り返しで別途対応済みのため対象外。
 * ===================================================================== */
.lib-header__outer.lib-header-BS01 .lib-header__logo a,
.lib-header__outer .lib-header__logo a,
header .lib-header__logo a,
.yd-header__logo a {
  box-shadow: none !important;
}

@media (min-width: 1020px) {
  .lib-footer__inner {
    position: relative !important;
  }
  .yd-footer__bnr {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 0 !important;
    margin: 0 !important;
  }
  /* バナーの高さ分をナビ側に確保する（下層100px / TOP200px ＋ 余白20px） */
  .lib-footer__container {
    padding-bottom: 120px !important;
  }
  .yd-sec-home .lib-footer__container {
    padding-bottom: 220px !important;
  }
}

/* =====================================================================
 * 第7フェーズ：メディア記事（TOPICS）詳細ページの日付表記
 *
 * BMのメディア機能は公開日を登録日で上書きし過去日に変更できないため、
 * 既存サイトと同じ日付表記を本文先頭に <p class="date"> として入れている。
 * そのスタイルを既存サイトに合わせる。
 *   既存 #contents p.date : 12px / bold / #333 / line-height normal / margin 0 0 10px
 *   BM（未指定）          : 16px / normal / line-height 28px / margin 0
 *
 * 記事詳細のDOMは下層ページと別系統で `.yd-body` を持たない：
 *   p.date < div.media-post__details < article.media-post__article
 *          < div#dcms_layoutPageBlock < main.lib-column__main.media-column__main
 * ===================================================================== */
#dcms_layoutPageBlock .media-post__details p.date,
#dcms_layoutPageBlock .media-post__article p.date {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #333 !important;
  line-height: normal !important;
  margin: 0 0 10px !important;
}

/* =====================================================================
 * 第8フェーズ：TOPページの TOPICS 欄をメディア記事一覧に差し替えた分の調整
 *
 * お知らせRSS（###_DCMS_BLOCK_RSS_news_2_###）から
 * メディア記事一覧（###_DCMS_BLOCK_BLOG_TITLELIST_2_###）に変更したため、
 * 出力が `lib-recommend__*`（サムネイル付き2段組み）になった。
 * 既存サイトのTOPICS欄は「日付＋タイトルの1行・サムネイルなし」（項目高さ34px）。
 *
 * 出力構造：
 *   li.col > a.lib-recommend__item
 *     > div.lib-recommend__txtarea > time + p.txt
 *     > span.lib-recommend__thumb > img（アイキャッチ未設定時は media_cover.jpg のダミー）
 * ===================================================================== */
.yd-topics__body .lib-recommend__thumb {
  display: none !important;
}
.yd-topics__body .lib-recommend__item {
  display: block !important;
  padding: 4px 0 !important;
}
.yd-topics__body .lib-recommend__txtarea {
  display: flex !important;
  align-items: baseline !important;
  gap: 1em !important;
}
.yd-topics__body .lib-recommend__txtarea time {
  flex: 0 0 auto !important;
  font-size: 13px !important;
}
.yd-topics__body .lib-recommend__txtarea .txt {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* TOPページ TOPICS 欄のリストマーカーを消す
 *   li::before（BMの青ポチ）は反復修正で無効化済みだが、
 *   ブラウザ標準の list-style: disc が残って「・」が出ていた。
 *   下層本文向けの `.yd-body li { list-style: none }` は
 *   TOPページに `.yd-body` が無いため効かない。 */
.yd-topics__body ul,
.yd-topics__body ol,
.yd-topics__body li {
  list-style: none !important;
}
.yd-topics__body li::marker {
  content: none !important;
}

/* =====================================================================
 * TOPページのラインナップ／サポートのボタンを既存と同じ content-box に
 *
 * 既存サイトは box-sizing 指定なし（content-box）で、
 * 文字数に応じて height と padding-top を振り分けることで
 * 「padding + height = 一定」にして全ボタンの高さを揃えている。
 *   ラインナップ: 135+55 = 190 / 145+45 = 190
 *   サポート    : 17+35  = 52  / 5+47   = 52
 * BMは全要素 border-box なので padding が height の内側に入り、
 * 1行のボタン（padding-top 17px）だけ文字が下に押されて窮屈になり、
 * 2行のボタン（padding-top 5px）と高さも揃わなかった。
 *   → 下層本文は反復修正15回目で content-box に戻したが、
 *     TOPページは `.yd-body` を持たないため対象外だった。
 * ===================================================================== */
.yd-lineup__list li a,
.yd-support__list li a,
.yd-lineup__list li,
.yd-support__list li {
  box-sizing: content-box !important;
}

/* TOPページ サポート欄の「お問い合わせ」ブロックの幅
 *   既存: width 181px / padding 0 / content-box → left 941・right 1122
 *   BM  : 実幅 191px（padding-right:10px が外側に付いていた）→ left 931
 *   その結果 3列目のボタン（メンテナンス・修理／中古機引き取り・販売、右端941）と
 *   10px 重なって余白が無くなっていた。既存と同じ 181px に戻す。 */
.yd-support__contact {
  width: 181px !important;
  padding-right: 0 !important;
  box-sizing: content-box !important;
}

/* =====================================================================
 * メガメニュー（グローバルナビ）の仕上げ
 *
 * (1) 切断機ラインナップ／切断事例のパネルにイメージ画像が入っていなかった
 *     （既存15点のうち th_p.png / th_e01.jpg / th_e02.jpg の3点が header に未転記）
 *     既存CSS: .th_p { position:absolute; bottom:15px; right:40px }   383×82
 *              .th_e { position:absolute; top:40px;   right:15px }    90×90
 *
 * (2) お客様サポート／企業紹介のパネル内カード（li.yd-mega__card）の前に
 *     青い「・」が出ていた。BMが li に付けるマーカー。
 *     反復修正13回目の `li::before` 無効化は `.yd-body` 配下のみが対象で、
 *     ヘッダーは #dcms_layoutPageBlock の外なので効いていなかった。
 * ===================================================================== */
.yd-header .lib-child__panel .lib-child__outer,
.lib-child__panel .lib-child__outer {
  position: relative;
}
.yd-header .yd-mega__pimg,
.lib-child__panel .yd-mega__pimg {
  display: block !important;
  position: absolute !important;
  bottom: 15px !important;
  right: 40px !important;
  max-width: none !important;
}
.yd-header .yd-mega__grid>.col,
.lib-child__panel .yd-mega__grid>.col {
  position: relative;
}
.yd-header .yd-mega__eimg,
.lib-child__panel .yd-mega__eimg {
  position: absolute !important;
  top: 40px !important;
  right: 15px !important;
  max-width: none !important;
}

/* メガメニュー内のリストマーカー（青ポチ）を消す */
.yd-header .lib-child__panel li::before,
.yd-header .lib-child__panel li::after,
.lib-child__panel li::before,
.lib-child__panel li::after {
  content: none !important;
  display: none !important;
  background: none !important;
  width: 0 !important;
  height: 0 !important;
}
.yd-header .lib-child__panel ul,
.yd-header .lib-child__panel li,
.lib-child__panel ul,
.lib-child__panel li {
  list-style: none !important;
}
.lib-child__panel li::marker {
  content: none !important;
}

/* =====================================================================
 * メガメニューのパネル位置を全項目そろえる（既存サイトと同じ）
 *
 * 既存サイトは #g_menu 内でパネルを絶対配置し、全パネルが 980px コンテナの
 * 左端（1300px幅で left 153）に出る。
 * BMのパネルは li.lib-nav__item（幅196px・relative）が基準なので、
 *   ・基本  … left:0    → li の左端に張り付き、右へはみ出す
 *   ・後ろ3 … right:0（画面外対策の回避策）→ 左へ 784px はみ出す
 * となり、項目ごとに位置がバラバラだった。
 *   実測: products 153 / example 349 / support -239 / company -43
 *
 * li の position を static にする方法は既存ルールに勝てなかったため、
 * ナビ項目の幅が 196px 固定であることを利用して
 * パネルの left を項目ごとに -196px ずつオフセットして揃える。
 * ===================================================================== */
@media (min-width: 992px) {
  .yd-header .lib-nav__item:nth-child(1)>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item:nth-child(1)>.lib-child__panel {
    inset: 70px auto auto 0 !important;
  }
  .yd-header .lib-nav__item:nth-child(2)>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item:nth-child(2)>.lib-child__panel {
    inset: 70px auto auto -196px !important;
  }
  .yd-header .lib-nav__item:nth-child(3)>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item:nth-child(3)>.lib-child__panel {
    inset: 70px auto auto -392px !important;
  }
  .yd-header .lib-nav__item:nth-child(4)>.lib-child__panel,
  .yd-header .yd-nav__list>.lib-nav__item:nth-child(4)>.lib-child__panel {
    inset: 70px auto auto -588px !important;
  }
}

/* =====================================================================
 * ページ見出し（.yd-pagehead）を既存サイトに合わせる
 *
 * 既存の構造とスタイル（実測）:
 *   <h1>切断機ラインナップ</h1>            … #333333 / 22px / ヒラギノ
 *   <div id="hd2" class="index">
 *     <h2><span>切断機ラインナップ／INDEX</span>ワイエイシイダステックは…</h2>
 *   </div>
 *     span … #333333 / 20px / Arial / bold
 *     h2   … .index あり: 24px / Georgia / border-bottom なし
 *            .index なし: 39px / ヒラギノ / border-bottom 2px solid #a7d2e8
 *
 * BM は全ページ 39px・セクション名が白だったため合わせる。
 * `.index` は既存16ページ（各セクションのINDEX＋support/company の下層）に付いている。
 * ===================================================================== */
/* (1) セクション名（画像の上）: 白 → #333333 */
.yd-pagehead .yd-pagehead__section,
.yd-pagehead__section {
  color: #333 !important;
}

/* (2) ページ名（span.sub）: #333333 / 20px / Arial */
.yd-pagehead__main .sub,
.yd-pagehead .sub {
  display: block !important;
  color: #333 !important;
  font-size: 20px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: bold !important;
  letter-spacing: normal !important;
}

/* (3) キャッチ文（既存 h2 相当）: 既定は 39px＋下線（.index なしのページ） */
.yd-pagehead__main {
  font-size: 39px !important;
  letter-spacing: normal !important;
  border-bottom: 2px solid #a7d2e8 !important;
}

/* (3-2) 既存で #hd2.index が付く16ページ: 24px / Georgia / 下線なし */
html.yd-page-cut .yd-pagehead__main,
html.yd-page-example .yd-pagehead__main,
html.yd-page-support .yd-pagehead__main,
html.yd-page-company .yd-pagehead__main,
html.yd-page-download .yd-pagehead__main,
html.yd-page-contact .yd-pagehead__main,
html.yd-page-support-trustee .yd-pagehead__main,
html.yd-page-support-testcut .yd-pagehead__main,
html.yd-page-support-maintenance .yd-pagehead__main,
html.yd-page-support-overhaul .yd-pagehead__main,
html.yd-page-support-sale .yd-pagehead__main,
html.yd-page-support-resale .yd-pagehead__main,
html.yd-page-company-strongpoint .yd-pagehead__main,
html.yd-page-company-overview .yd-pagehead__main,
html.yd-page-company-history .yd-pagehead__main,
html.yd-page-company-access .yd-pagehead__main {
  font-size: 24px !important;
  font-family: Georgia, "Times New Roman", Times, serif !important;
  border-bottom: none !important;
}
/* /cut/ は既存が letter-spacing -1px（他のINDEXページは normal） */
html.yd-page-cut .yd-pagehead__main {
  letter-spacing: -1px !important;
}

/* =====================================================================
 * BM標準のサブナビ（nav.lib-subnav__box）を隠す
 *   ページ下部に「切断機ラインナップ」＋兄弟ページのリンク一覧が出るが、
 *   右サイドナビ（.yd-snav）と重複するため既存サイトには無い。
 * ===================================================================== */
.lib-subnav__box,
nav.lib-subnav__box {
  display: none !important;
}

/* =====================================================================
 * サイドナビ見出し（.yd-snav__cat）を既存サイトに合わせる
 *
 * 既存 p.category（実測）:
 *   背景  … <セクション>/images/bg_nav_hd1.png（切断事例は #99ddcf の薄緑）
 *   文字  … #333333 / 16px / bold
 *   余白  … padding 11px 0 0 20px、サイズ 210×50
 * BM は文字が白・15px・padding 16px/14px だったため合わせる。
 * また 切断事例用の画像が未アップロードで cut（青）を代用していたので差し替える。
 * ===================================================================== */
.yd-snav__cat {
  height: 50px !important;
  padding: 11px 0 0 20px !important;
  font-size: 16px !important;
  color: #333 !important;
}
.yd-sec-example .yd-snav__cat {
  background-image: url(/dcms_media/image/example_images_bg_nav_hd1.png) !important;
}

/* サイドナビのアコーディオン：親項目は開閉トリガーなのでカーソルを合わせる */
.yd-snav__group>a[role="button"] {
  cursor: pointer;
}

/* =====================================================================
 * セクションタブの現在位置マーカー（.active）
 *   第5フェーズで SP の横スクロール対策として ≤1019px を非表示にしたが、
 *   PC幅では既存どおり「選択中のタブ」を示す必要があるため明示的に表示する。
 * ===================================================================== */
@media (min-width: 1020px) {
  #dcms_layoutPageBlock .yd-body .faq_nav .active,
  #dcms_layoutPageBlock .yd-body .example_nav .active {
    display: block !important;
  }
}

/* =====================================================================
 * ① グローバルナビをスクロールで追従させる
 *   既存サイトは JS で #g_menu に .fixed を付けるが CSS 側が伴っておらず、
 *   実際には追従していない（既存の不具合）。今回はご要望に合わせて新規に実装する。
 *
 *   position:sticky は親（.lib-header__inner／高さ215px）の範囲でしか効かないため
 *   使えない。yd-sidenav.js でスクロール量を見て .yd-is-fixed を付ける。
 *   固定するのは既存の設計意図（#g_menu だけ固定）に合わせてナビ行だけにし、
 *   ロゴ行（130px）はそのまま流す。固定されるのは70pxのみ。
 * ===================================================================== */
@media (min-width: 992px) {
  .lib-nav__panel.yd-is-fixed {
    position: fixed !important;
    top: 0 !important;
    z-index: 10000 !important;
    background: #fff !important;
  }
  /* ナビ行は背景が透明なので、固定時は左右いっぱいまで白で塗って背後の本文を隠す */
  .lib-nav__panel.yd-is-fixed::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: -50vw !important;
    right: -50vw !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12) !important;
    z-index: -1 !important;
  }
}

/* =====================================================================
 * ② メガメニュー（切断機ラインナップ）のイメージ画像が本文に被る
 *   th_p.png（383×82・右下 bottom:15px）が 3列×2段の最下段
 *   「コアドリルマシン」「技術応用製品」と 33px 重なっていた。
 *   既存は縦積みで画像の下に余白があるため被らない。
 *   → 画像があるパネル（1番目＝切断機ラインナップ）だけ下に余白を確保する。
 * ===================================================================== */
@media (min-width: 992px) {
  .yd-header .lib-nav__item:nth-child(1) .lib-child__outer,
  .lib-nav__item:nth-child(1) .lib-child__panel .lib-child__outer {
    padding-bottom: 110px !important;
  }
}

/* =====================================================================
 * ③ ページ見出し（キャッチ文）の色をセクション別に既存へ合わせる
 *   実測: cut #0079c0 / example #00aa87 / support #dc641e / company #a2131f
 * ===================================================================== */
html.yd-sec-example .yd-pagehead__main {
  color: #00aa87 !important;
}
html.yd-sec-support .yd-pagehead__main {
  color: #dc641e !important;
}
html.yd-sec-company .yd-pagehead__main {
  color: #a2131f !important;
}

/* =====================================================================
 * ⑤ パンくずが本文（980px）より外に出ている
 *   .lib-breadcrumb__outer が全幅1285px、__inside が1144px で
 *   本文（153〜1133）より左右に張り出していた。980px コンテナに収める。
 * ===================================================================== */
@media (min-width: 1020px) {
  .lib-breadcrumb__outer {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
  }
  .lib-breadcrumb__inside {
    width: 980px !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
}

/* ④ カタログダウンロード／プライバシーポリシーのサイドナビ見出し背景 */
.yd-sec-download .yd-snav__cat {
  background-image: url(/dcms_media/image/download_images_bg_nav_hd1.png) !important;
}
.yd-sec-policy .yd-snav__cat {
  background-image: url(/dcms_media/image/policy_images_bg_nav_hd1.png) !important;
}

/* =====================================================================
 * 第10フェーズ（2026-08-10）①
 *   991px以下（SP／iPad＝ハンバーガー／ドロワー）では
 *   メガメニュー内の画像をすべて非表示にし、テキストのみにする。
 *
 *   背景：既存サイト（980px固定・横長メガメニュー）の再現として
 *         .yd-mega__pimg（383×82）を bottom:15px right:40px、
 *         .yd-mega__eimg（90×90）を top:40px right:15px の
 *         position:absolute で配置しており、パネル幅400pxの縦積みでは
 *         最下部リンク（「液体窒素滴下装置／LN2 DISPENSER」
 *         「カタログダウンロード一覧」等）の上に画像が乗っていた。
 *         第9フェーズの padding-bottom:110px は min-width:992px 限定で
 *         ドロワーには効いていない。
 *
 *   対処：ディレクター指示により、狭い画面では画像を出さずテキストのみ。
 *         サムネイル（th_s01〜08 / th_c02〜05）を包む span.thumb も
 *         空箱として残らないよう一緒に消す。
 *         PC（992px以上）の既存再現はそのまま維持する。
 * ===================================================================== */
@media (max-width: 991px) {
  .yd-header .lib-child__panel img,
  .lib-nav__panel .lib-child__panel img,
  .yd-header .lib-child__panel .thumb,
  .lib-nav__panel .lib-child__panel .thumb,
  .yd-header .yd-mega__pimg,
  .lib-child__panel .yd-mega__pimg,
  .yd-header .yd-mega__eimg,
  .lib-child__panel .yd-mega__eimg {
    display: none !important;
  }
  /* 画像を出さないので下部の余白確保は不要 */
  .yd-header .lib-nav__item .lib-child__outer,
  .lib-nav__item .lib-child__panel .lib-child__outer {
    padding-bottom: 12px !important;
  }
}

/* =====================================================================
 * 第10フェーズ（2026-08-10）②
 *   共通CTAを全ページ非表示にしたことで、下層ページのフッター直前に
 *   高さ96px（padding 48+48）の空グレー帯が残った。
 *   正体は BM標準の右サイドカラム器 .lib-column__side。
 *   中身（lib-subnav__box）は既にCSS非表示で、実際のサイドナビは
 *   yd-sidenav.js が注入する .yd-snav が担っているため器は不要。
 *   TOPページでは既に非表示（= TOPの仕上がりに下層を揃える）。
 * ===================================================================== */
.lib-column__side {
  display: none !important;
}

/* =====================================================================
 * 第10フェーズ 追加①（2026-08-10）本文h4の青丸「・」を消す
 *   BM標準 lib.common.css の
 *     :where(h4):not([class])::before { content:""; width:.5em; height:.5em;
 *                                       border-radius:50%; background:var(--MAIN) }
 *   がクラス無しh4に青丸を付けていた（/cut/das110/ の「マルチブレード」
 *   「自動アライメント＆オペレーションパネル」等）。
 *   既存サイトの `#contents .construction h4` は色・太さのみで丸は無い。
 *   `:where()` は詳細度0だが、BM側が後勝ちになる場合に備え !important で明示。
 *   同種の h2（5×40pxの青い縦棒）も本文では使わないため併せて無効化する。
 * ===================================================================== */
#dcms_layoutPageBlock .yd-body :where(h2, h4):not([class])::before,
#dcms_layoutPageBlock .yd-body h2:not([class])::before,
#dcms_layoutPageBlock .yd-body h4:not([class])::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* =====================================================================
 * 第10フェーズ 追加②（2026-08-10）「対応ワーク」のSPレイアウト崩れ
 *
 *   症状：SPで「形 状」「対応製品」「種 類」のラベル文字が消える。
 *   原因：dt は既存サイトで 55×38px の背景画像（bg_work_shape.png 等）に
 *         白文字を乗せる作り（`color:#fff` / `text-align:center`）。
 *         レスポンシブ化で dt が `float:none; width:100%` になったため、
 *         中央寄せの白文字が背景画像（左端55px）の外へ出て
 *         白地に白文字となり読めなくなっていた。
 *   対処：SPでは dt を背景画像の実寸に戻して左に置き、dd（内容）は
 *         その下に全幅で回り込ませる（縦積み）。
 * ===================================================================== */
@media (max-width: 991px) {
  #dcms_layoutPageBlock .yd-body .work dt {
    width: 55px !important;
    min-width: 55px !important;
    max-width: 55px !important;
    height: 38px !important;
    padding-top: 17px !important;
    float: none !important;
    display: block !important;
    margin: 0 0 10px !important;
    background-position: 0 0 !important;
  }
  #dcms_layoutPageBlock .yd-body .work dt.products {
    height: 48px !important;
    padding-top: 7px !important;
  }
  #dcms_layoutPageBlock .yd-body .work dd {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 0 14px !important;
  }
  #dcms_layoutPageBlock .yd-body .work dd img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* =====================================================================
 * 第10フェーズ 追加③（2026-08-10）カタログダウンロードページのSP崩れ
 *
 *   症状：SPでカタログのサムネイルが画面幅いっぱいに拡大され、
 *         「カタログダウンロード」ボタンがその画像の上に重なる。
 *
 *   原因1（画像の拡大）：BM標準 lib.common.css の
 *       :where(.thumb):where(img) { max-width:none; width:100%; height:auto }
 *     が、既存サイトの `<img class="thumb">`（86×117 等）に一致し、
 *     幅100%（286px＝3.3倍）へ引き伸ばしていた。
 *     既存サイトの `.thumb` は原寸表示なので width:auto に戻す。
 *     ※ PC（992px以上）は別ルールで既に原寸のため見た目は変わらない。
 *
 *   原因2（ボタンの重なり）：既存CSSの
 *       #contents .item li .btn { position:absolute; bottom:0; right:20px }
 *     はPCの `li{width:300px; position:relative}` を前提とした右下配置。
 *     SPでは li が position:static になるため基準がずれ、
 *     拡大した画像の上に乗っていた。SPでは通常フローに戻す。
 *
 *   対象：/download/（thumb 8件・btn 7件）、/example/（thumb 3件）
 * ===================================================================== */
#dcms_layoutPageBlock .yd-body img.thumb,
#dcms_layoutPageBlock .yd-body .thumb>img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
}

@media (max-width: 991px) {
  #dcms_layoutPageBlock .yd-body .item li .thumb {
    display: block !important;
    margin: 0 0 12px !important;
  }
  #dcms_layoutPageBlock .yd-body .item li a {
    display: inline-block !important;
  }
  #dcms_layoutPageBlock .yd-body .item li .btn {
    position: static !important;
    width: 176px !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }
}

/* =====================================================================
 * 第10フェーズ 追加④（2026-08-13）お問い合わせフォームの体裁
 *
 *   /contact/ だけ BM標準のフォームレイアウト（lib-form__outer）で、
 *   他ページの `yd-pagehead` + `yd-body`（980px）を使っていないため
 *   見出し・幅・余白が全ページで唯一浮いていた。
 *     ・見出し = lib-hero（水色ベタ #e8f4fb・高さ320px・40px黒文字）
 *     ・本文コンテナ = container --mdl（1144px。他ページは980px）
 *     ・入力欄の幅が項目ごとにバラバラ（466/380/359/846/714px）
 *
 *   対処：既存サイトの見出し画像 contact_images_hd1.png（731×81）を使い、
 *         他ページの yd-pagehead と同じ帯に置き換え。
 *         本文コンテナは980pxへ統一し、入力欄の幅も揃える。
 * ===================================================================== */

/* --- ページ見出し：水色ヒーロー → 他ページと同じ帯 --- */
.yd-sec-contact .lib-hero__outer {
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 auto 24px !important;
  background: none !important;
}
.yd-sec-contact .lib-hero__txtarea,
.yd-sec-contact .lib-hero__inner {
  width: 980px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.yd-sec-contact .lib-hero__title {
  box-sizing: border-box !important;
  display: block !important;
  width: 730px !important;
  max-width: 100% !important;
  height: 80px !important;
  margin: 0 !important;
  padding: 26px 0 0 20px !important;
  font-size: 22px !important;
  font-weight: bold !important;
  line-height: 1.2 !important;
  color: #333 !important;
  text-align: left !important;
  background: url(/dcms_media/image/contact_images_hd1.png) no-repeat left top !important;
}

/* --- 本文コンテナ：1144px → 他ページと同じ980px --- */
.yd-sec-contact .lib-form-flow__outer,
.yd-sec-contact .lib-form__intro,
.yd-sec-contact .lib-form__main,
.yd-sec-contact .lib-form__outer>.container {
  width: 980px !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* --- 入力欄の幅を統一（バラつきを解消） --- */
.yd-sec-contact .lib-form__input input[type="text"],
.yd-sec-contact .lib-form__input input[type="email"],
.yd-sec-contact .lib-form__input input[type="tel"],
.yd-sec-contact .lib-form__input textarea {
  width: 100% !important;
  max-width: 620px !important;
  box-sizing: border-box !important;
}
/* 姓名・せいめいは2列なので半分ずつ */
.yd-sec-contact .lib-form__names .lib-form__input input[type="text"] {
  max-width: 290px !important;
}
/* 郵便番号は短く */
.yd-sec-contact .lib-form__input input[name*="Zip"],
.yd-sec-contact .lib-form__input input[name*="zip"] {
  max-width: 110px !important;
}
.yd-sec-contact .lib-form__input textarea {
  max-width: 620px !important;
  min-height: 160px !important;
}

@media (max-width: 991px) {
  .yd-sec-contact .lib-hero__title {
    width: 100% !important;
    height: auto !important;
    min-height: 56px !important;
    padding: 16px 12px !important;
    font-size: 18px !important;
    background-size: cover !important;
  }
  .yd-sec-contact .lib-form__input input[type="text"],
  .yd-sec-contact .lib-form__input input[type="email"],
  .yd-sec-contact .lib-form__input input[type="tel"],
  .yd-sec-contact .lib-form__input textarea,
  .yd-sec-contact .lib-form__names .lib-form__input input[type="text"] {
    max-width: 100% !important;
  }
}

/* =====================================================================
 * 第12フェーズ：SP表示の崩れを「型」単位で一括修正（2026-08-19）
 *
 * 【従来の検証が「崩れ0」と出ていた理由】
 *   横スクロールを documentElement.scrollWidth で測っていたが、
 *   html { overflow-x: hidden } / #wrapper { overflow-x: clip } が
 *   掛かっているため、はみ出していても scrollWidth == clientWidth となり
 *   数値上ゼロに見えていた（実際は切れて読めない状態）。
 *   getBoundingClientRect() による要素単位の実測に切り替えて4型を特定した。
 *
 * 【対象帯】SP(≤767px) と タブレット(768〜1019px) の両方
 *   「反復修正14回目」の一括解除（float / 固定幅 / position）で
 *   直りきらなかった残りを、パターン単位で当てる。
 *   ページ個別ではなく型で当てるため、今後ページが増えても効く。
 * ===================================================================== */
@media (max-width: 1019px) {

  /* -------------------------------------------------------------------
   * 型A：画像＋キャプションのリストが階段状にずれる
   *
   *   li は全幅・float解除・text-align:center まで直っていたが、
   *   img が display:inline のままだったためキャプションが画像の右に並び、
   *   「中央寄せ＝(画像 + 文字)のセットを中央に置く」動作になっていた。
   *   キャプションの文字数が違う（光学ガラス／半導体パッケージ）ので
   *   画像の左端が 61〜99px とバラつき、階段状に見えていた。
   *
   *   対象は実測で確定した3パターンのみ（文中の小アイコンは壊さない）:
   *     ul.ul_trustee > li  … /support/trustee/ の2リスト
   *     ul.image     > li  … 2ページ
   *     .a_inner > p.left / p.right … /support/faq_m/ の加工比較
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body .ul_trustee>li>img,
  #dcms_layoutPageBlock .yd-body ul.image>li>img,
  #dcms_layoutPageBlock .yd-body .a_inner>p.left>img,
  #dcms_layoutPageBlock .yd-body .a_inner>p.right>img {
    display: block !important;
    margin: 0 auto 6px !important;
  }
  #dcms_layoutPageBlock .yd-body .ul_trustee>li,
  #dcms_layoutPageBlock .yd-body ul.image>li {
    margin: 0 0 20px !important;
    text-align: center !important;
    font-weight: bold !important;
  }
  #dcms_layoutPageBlock .yd-body .a_inner>p.left,
  #dcms_layoutPageBlock .yd-body .a_inner>p.right {
    text-align: center !important;
    margin: 0 0 16px !important;
  }

  /* -------------------------------------------------------------------
   * 型B：仕様表が潰れて読めない／はみ出しても横スクロールできない
   *
   *   table.spec は 416px（画面390pxを38px超過）・文字12px、
   *   table.his は 525px（147px超過）。
   *   祖先が overflow-x:hidden / clip なのでスクロールもできず、
   *   右端が切れたまま読めない状態だった。
   *
   *   → yd-sidenav.js で <div class="yd-tblscroll"> で包み、
   *     その中だけ横スクロールさせる（指で滑らせて読む）。
   *     表組み自体は既存サイトの罫線・背景色をそのまま維持する。
   *
   *   ★第13フェーズ（2026-08-19）でディレクター指示により方針変更：
   *     「PCとSPで同じ見た目にする（フリック対応）」
   *     当初は SPだけ文字を14pxに上げ、表を親幅に合わせて縮めていたが、
   *     それだと PC（table 730px / 12px / content-box・セル 110-160-75-385px）と
   *     SP（386px / 14px / border-box・セル 94-56-78-158px）で別物になっていた。
   *     → ラッパーの中に「PCの本文幅730pxを再現する内箱」を作り、
   *       表は既存の width 指定（.spec は width:100%、.his は 525px 等）に
   *       そのまま従わせる。これで PC と完全に同じ描画になり、
   *       指のフリックで横に見る形になる。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body .yd-tblscroll {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100% !important;
    margin: 0 0 20px !important;
    /* スクロールできることが分かるように余白を少し残す */
    padding-bottom: 4px !important;
  }
  /* PCの本文幅を再現する内箱。表の width:100% の基準をここにする */
  #dcms_layoutPageBlock .yd-body .yd-tblscroll>.yd-tblscroll__in {
    width: 730px !important;
    max-width: none !important;
    box-sizing: content-box !important;
  }
  /* 表は既存の width 指定のまま（.spec=100%→730px / .his=525px）。
     PCは content-box なので SP の border-box を打ち消してセル幅を一致させる */
  #dcms_layoutPageBlock .yd-body .yd-tblscroll table {
    max-width: none !important;
    margin: 0 !important;
  }
  #dcms_layoutPageBlock .yd-body .yd-tblscroll table,
  #dcms_layoutPageBlock .yd-body .yd-tblscroll table th,
  #dcms_layoutPageBlock .yd-body .yd-tblscroll table td {
    box-sizing: content-box !important;
  }
  /* 「横にスクロールできます」の案内（実際にはみ出す表だけJSが付与） */
  #dcms_layoutPageBlock .yd-body .yd-tblscroll.is-scrollable::before {
    content: "← 横にスクロールできます →";
    display: block;
    padding: 0 0 6px;
    color: #666;
    font-size: 12px;
    font-weight: bold;
    /* 内箱が730pxあるため右寄せだとスクロールしないと読めない。左端に出す */
    text-align: left;
  }

  /* -------------------------------------------------------------------
   * 型C：「対応ワーク」のラベルが55pxの箱に潰れて窮屈
   *
   *   既存サイトは 55×55px の背景画像に白文字を乗せる作り。
   *   第10フェーズ②で「文字が消える」問題は解消したが、
   *   「対応<br>製品」が55px幅に2行で押し込まれて窮屈なままだった。
   *   → SP/タブレットでは全幅の小見出し帯にして読ませる。
   *     色は既存の背景画像から抽出した地色をそのまま使い、印象を変えない。
   *       shape    #4374A1（濃い青）
   *       products #2484B3（青）
   *       type     #00857F（青緑）
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body .work dt {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 7px 12px !important;
    margin: 0 0 10px !important;
    background-image: none !important;
    background-color: #4374A1 !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
    text-align: left !important;
    letter-spacing: .08em;
  }
  #dcms_layoutPageBlock .yd-body .work dt.products {
    height: auto !important;
    padding: 7px 12px !important;
    background-color: #2484B3 !important;
  }
  #dcms_layoutPageBlock .yd-body .work dt.type {
    background-color: #00857F !important;
  }
  /* 「対応<br>製品」の改行はSPでは不要（全幅なので1行で収まる） */
  #dcms_layoutPageBlock .yd-body .work dt br {
    display: none !important;
  }

  /* -------------------------------------------------------------------
   * 型D：FAQの回答本文が右に61pxずれる（変な余白）
   *
   *   .a_block dd に「A」アイコン用の padding-left:60px が付いている。
   *   PC(730px)では自然だが、SP(366px)では実効幅が296pxまで削られ、
   *   本文が右に押し出されて余白だけが目立っていた。
   *   → アイコンを縮小し、padding を SP 相応に詰める。
   *     質問側（dt p の padding-left:40px）も同様に詰める。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body .a_block dd {
    padding: 10px 10px 10px 38px !important;
    background-position: 8px 12px !important;
    background-size: 22px auto !important;
  }
  #dcms_layoutPageBlock .yd-body .a_block dt {
    padding: 10px !important;
  }
  #dcms_layoutPageBlock .yd-body .a_block dt p {
    padding: 2px 0 0 30px !important;
    background-size: 22px auto !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  /* 比較画像の枠は全幅で */
  #dcms_layoutPageBlock .yd-body .a_block .a_inner {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* -------------------------------------------------------------------
   * 型E：絶対配置の画像が本文に重なる
   *
   *   既存サイトは PC(980px) 座標で
   *     .history .lead .right img { position:absolute; top:-100px; right:0 }
   *   のように画像を浮かせている。
   *   SPの一括解除（反復修正14回目）は *:not(img) で img を除外しているため
   *   この絶対配置だけが生き残り、沿革表や本文の上に画像が乗っていた。
   *     /company/history/ で重なり6件（最大 11,960px²）
   *   → 通常フローに戻して本文の下に置く。
   *
   *   ※ /example/ の img.thumb（top:40px）と /support/ の img_daspen（top:80px）も
   *     絶対配置のままだが、実測で重なりを起こしていないため触らない。
   *     既存デザインの意図の可能性があり、直すと逆に崩れるリスクがある。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body .lead .right>img,
  #dcms_layoutPageBlock .yd-body div.right>img {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    display: block !important;
    margin: 0 auto 12px !important;
  }

  /* -------------------------------------------------------------------
   * 保険：width属性の無い画像（「種 類」の横長アイコン11ページ）
   *   height 属性だけが付いているため、CSSの max-width が負けると
   *   原寸（最大519px）で表示されて右が切れる。
   *   実測では効いているが、詳細度勝負で崩れないよう明示的に固定する。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body img:not([class*="lib-"]):not([class*="swiper"]) {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* =====================================================================
 * 第13フェーズ（2026-08-19）ディレクター指摘：
 *   「スライシング／ダイシングマシン　SPの時は青色の帯が途中で止まっている」
 *
 * 【原因】型F：no-repeat の背景画像で作った帯が、要素だけ広がって途切れる
 *   /cut/ の製品名 `.lineup h4 > a` は背景画像 `cut_images_hd4.png`（220×50）を
 *   no-repeat で敷いて青帯にしている。
 *     .lineup li   { float:left; width:220px }   ← 既存は li が 220px 固定
 *     .lineup h4 a { background:url(cut_images_hd4.png) no-repeat;
 *                    width:180px; height:37px; padding:13px 0 0 40px }  = 220×50
 *   既存サイト（980px固定）では帯と要素幅が一致するが、
 *   SPでは「反復修正14回目」の一括解除で a が全幅（366px）になるため
 *   背景画像は220pxで終わり、そこから先が地なし＝帯が途中で止まっていた。
 *   14ページ（全製品ページ＋/cut/一覧）で発生。
 *
 * 【対処】画像は 98.4% が単色 #0079C0（白い▶は x=15〜27 の127pxのみ）。
 *   地色を background-color で敷いて帯を要素の全幅まで伸ばす。
 *   画像は左端に置いたままなので ▶アイコンは維持され、
 *   画像の色と地色が同一のため継ぎ目も出ない。
 *
 * 【対象外】矢印・Q/Aアイコン（sitemap_images_arrow_s.png / faq_icn_a.png 等）も
 *   no-repeat で要素より狭いが、画像高さ（11〜29px）が要素高さより小さく
 *   「左端に置くアイコン」であって帯ではないため触らない（全108件中94件がこれ）。
 * ===================================================================== */
@media (max-width: 1019px) {
  html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4 a {
    background-color: #0079C0 !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
  }
  /* 帯の中の文字が縦につぶれないよう、既存の行間・余白を保つ
     （一括解除で height:auto になっているため padding で高さを作る） */
  html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4 a,
  html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup h4.line2 a {
    min-height: 50px !important;
    padding: 13px 10px 13px 40px !important;
    box-sizing: border-box !important;
    line-height: 1.5 !important;
  }
  /* li の margin-right:35px はPCで3列に並べるためのもの。
     一括解除（反復修正14回目）は width/float はリセットするが margin は触らないため
     SPでも35px残り、帯の右端が 331px と 366px で不揃いになっていた
     （li.last だけ margin-right:0 なので366px）。縦積みでは不要なので消す */
  html.yd-sec-cut #dcms_layoutPageBlock .yd-body .lineup li {
    margin-right: 0 !important;
    margin-bottom: 24px !important;
  }
}

/* =====================================================================
 * 第13フェーズ：共通CV「まずはご相談ください」を既存サイトの体裁で復活
 *              （2026-08-19／反復修正21回目・第10フェーズの方針を変更）
 *
 * 【経緯】
 *   2026-08-10 のディレクター指示「下層の『まずはご相談ください』はすべて不要」で
 *   `.lib-cta__outer, .yd-cta { display:none }` として全ページ非表示にしていた。
 *   しかし既存サイトには **TOP以外の全44ページ**（お問い合わせページも含む）の
 *   フッター上に `#contents_banner` として存在する。
 *   非表示にした当時は第9フェーズの残作業「幅730pxに合わせる」が未着手で、
 *   BM標準装飾のまま（グレー背景 #ddd ＋白ボックス padding50px ＋
 *   中央寄せ h2 32px ／ 画像が 160×121 → **237×179 に拡大**）＝
 *   既存とは別物の見た目だった。それを「不要」と判断された可能性が高い。
 *   → 既存の体裁に寄せたうえで表示に戻す。
 *
 * 【既存サイトの定義（css_src/styles.css:205-209）】
 *   #contents_banner       { margin:50px 0; padding-top:10px; border-top:1px solid #848484 }
 *   #contents_banner .title{ font-weight:bold; margin-bottom:10px }   ← 左寄せ・本文と同サイズ
 *   #contents_banner ul li { float:left; margin-right:20px }
 *   画像 160×121 ×3 ＋ 190×121 ＋ margin 20px×3 = **730px**（本文幅と完全一致）
 *
 * 【BM側の中身】シェアパーツID:2 に4バナー・リンク先・alt・寸法まで正しく入っている。
 *              触るのは装飾だけで、HTMLは変更しない。
 * ===================================================================== */

/* --- TOPだけは既存サイトに無いので非表示のまま -------------------------
 *   送信完了ページは本文の `.yd-nocta` で自動的に消える（yd-fidelity.css:1475 の既存実装）
 * --------------------------------------------------------------------- */
.yd-sec-home .lib-cta__outer,
.yd-sec-home .yd-cta {
  display: none !important;
}

/* --- 表示に戻す（BM標準のグレー背景・白ボックスを解除） --------------- */
body .lib-cta__outer.yd-cta {
  display: block !important;
  background: none !important;
  /* bg-gry #ddd を解除 */
  border: 0 !important;
  padding: 0 !important;
  margin: 50px 0 !important;
  /* 既存の margin:50px 0 */
}
body .yd-cta .lib-cta-BS01__inside {
  background: none !important;
  /* bg-wht を解除 */
  border: 0 !important;
  box-shadow: none !important;
  /* 既存の #contents_banner 相当（上罫線＋padding-top） */
  border-top: 1px solid #848484 !important;
  padding: 10px 0 0 !important;
  margin: 0 !important;
}

/* --- 見出し：BM標準の h2 32px 中央寄せ → 既存の p.title 相当に -------- */
body .yd-cta .lib-title__outer {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
body .yd-cta .lib-title__outer .title {
  /* 既存はサイズ指定なし＝本文の15pxを継承（`.title { font-weight:bold }` のみ） */
  font-size: 15px !important;
  font-weight: bold !important;
  /* BM標準は h2.title を display:flex + justify-content:center にしているため
     text-align だけでは左寄せにならない（テキストが left=446px に描画されていた）。
     既存の p.title と同じ block に戻す */
  display: block !important;
  justify-content: flex-start !important;
  text-align: left !important;
  color: #333 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
body .yd-cta .lib-title__outer .title::before,
body .yd-cta .lib-title__outer .title::after {
  content: none !important;
  display: none !important;
}

/* --- バナー4点：Bootstrapのグリッド（row-cols-2 / row-cols-md-4 / gy-3）を解除 --- */
body .yd-cta .lib-cta-BS01__btn,
body .yd-cta .lib-cta-BS01__btn.container {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body .yd-cta .yd-cta__bnr {
  display: flex !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: 100% !important;
  max-width: 100% !important;
  /* Bootstrapの .row は li に padding-left/right: calc(--bs-gutter-x * .5) を入れる。
     変数を0にしないと gap:20px に約23pxが加算され、既存の間隔と合わない */
  --bs-gutter-x: 0 !important;
  --bs-gutter-y: 0 !important;
}
body .yd-cta .yd-cta__bnr>li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  flex: 0 0 auto !important;
}
body .yd-cta .yd-cta__bnr>li::before,
body .yd-cta .yd-cta__bnr>li::marker {
  content: none !important;
  display: none !important;
}
body .yd-cta .yd-cta__bnr>li>a {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
/* BMは外部リンク等で a に擬似要素アイコンを足すため消す（既存には無い） */
body .yd-cta .yd-cta__bnr>li>a::before,
body .yd-cta .yd-cta__bnr>li>a::after {
  content: none !important;
  display: none !important;
}

/* --- PC（≥1020px）：既存を忠実に再現 --------------------------------
 *   本文 .yd-body は「980px中央寄せコンテナの左端」に left=160px（@1300px）で置かれる。
 *   CTAも同じ 980px コンテナを作り、その中で 730px 左寄せにして左端を揃える。
 *   画像は原寸（160×121 / 190×121）に戻す。
 * ------------------------------------------------------------------- */
@media (min-width: 1020px) {
  body .yd-cta>.container {
    width: 980px !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  body .yd-cta .lib-cta-BS01__inside {
    width: 730px !important;
    max-width: 730px !important;
    margin: 0 !important;
  }
  /* 既存は float:left + margin-right:20px（合計ちょうど730px） */
  body .yd-cta .yd-cta__bnr {
    flex-wrap: nowrap !important;
    gap: 0 20px !important;
    justify-content: flex-start !important;
  }
  /* row-cols-md-4 が li に width:25%（730pxの1/4=182.5px）を入れるため、
     画像の実寸で並ばず間隔が20px→43pxに広がる。auto に戻す */
  body .yd-cta .yd-cta__bnr>li {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
  }
  body .yd-cta .yd-cta__bnr>li img {
    display: block !important;
    width: auto !important;
    /* BM標準の width:100%（237pxに拡大）を打ち消す */
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
  }
}

/* --- タブレット・SP（≤1019px）：既存に正解が無いため当方設計 ---------
 *   本文幅に合わせて可変。2列で折り返し、画像は原寸を超えない。
 *   タップ領域を確保するため縦の間隔を空ける。
 * ------------------------------------------------------------------- */
@media (max-width: 1019px) {
  body .lib-cta__outer.yd-cta {
    margin: 30px 0 !important;
  }
  body .yd-cta>.container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 12px !important;
  }
  body .yd-cta .lib-cta-BS01__inside {
    width: 100% !important;
    max-width: 100% !important;
  }
  body .yd-cta .yd-cta__bnr {
    flex-wrap: wrap !important;
    gap: 14px 12px !important;
    justify-content: center !important;
  }
  body .yd-cta .yd-cta__bnr>li {
    flex: 0 0 calc(50% - 6px) !important;
    max-width: calc(50% - 6px) !important;
  }
  /* 画像は原寸（160×121 / 190×121）を維持する。
     width:100% にすると li 幅（177px）まで引き伸ばされて粗くなるため auto にし、
     枠内で中央に置く。画面が狭いときだけ 100% まで縮む。 */
  body .yd-cta .yd-cta__bnr>li img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }
}

/* =====================================================================
 * 第14フェーズ（2026-08-19）ディレクター指摘：
 *   「/example/ のページの画像被りって直ってる？」
 *
 * 【型E-2】親の position:relative が解除され、絶対配置の img が基準を失う
 *
 *   既存サイトは「親 { position:relative } ＋ 子img { position:absolute }」で
 *   画像を右側に配置している箇所がある。
 *     #l01 .thumb { position:absolute; top:40px; right:0 }   （sec_example.css:25）
 *   SPの一括解除（反復修正14回目）は `*:not(img)` なので
 *   **親だけ static になり、img の absolute だけが残る**。
 *   その結果 img の配置基準が上位の祖先に移り、
 *   本来ばらばらの位置に置かれるべき画像が同じ座標に集まる。
 *
 *   実測（iPhone13 390px）:
 *     /example/  th01(99,40) th02(99,40) th03(100,60)
 *                → **th01とth02が完全に同座標**。3枚が重なって1枚しか見えない
 *                  （重なり面積 26,190px² ほか計3件）
 *     /support/  img_daspen が 実位置(40,80)。親は(12,2940)
 *                → **親から2,860px離れたページ最上部に飛んでいた**
 *                  （テキストと偶然重なっていなかったため第12フェーズで見逃した）
 *
 * 【第12フェーズでの判断ミス】
 *   「画像とテキストの重なり」だけを指標にしていたため、
 *   *画像同士の重なり* と *親の外に飛んだ画像* を検出できず
 *   「重なりを起こしていないので触らない」と誤判断していた。
 *   → `sp_imgoverlap.py` で「画像同士の重なり」と
 *     「親がstaticなのにabsoluteなimg」を検出する指標を追加した。
 *
 * 【対処】基準を失った絶対配置は通常フローに戻す（縦積み）。
 *   PC（≥1020px）は既存忠実のため触らない。
 * ===================================================================== */
@media (max-width: 1019px) {

  /* /example/ の事例サムネイル3枚 */
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01 .thumb,
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02 .thumb,
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 .thumb,
  /* /support/ のキャラクター画像（受託切断の説明図） */
  html.yd-sec-support #dcms_layoutPageBlock .yd-body img.img_daspen {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 12px auto 0 !important;
  }

  /* 画像を下に回した分、セクションの下余白を確保する
     （既存は画像が絶対配置で浮いていたため親に高さが不要だった） */
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l01,
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l02,
  html.yd-sec-example #dcms_layoutPageBlock .yd-body #l03 {
    margin-bottom: 28px !important;
  }
}

/* =====================================================================
 * 第15フェーズ（2026-08-19）ディレクター指摘2件
 *   1. /support/trustee/ 「例えば、こんな受託切断でお困りではありませんか？」が枠からはみ出る
 *   2. /support/ SP時、画像は中央揃えにしてほしい
 * ===================================================================== */
@media (max-width: 1019px) {

  /* -------------------------------------------------------------------
   * 型G：見出しの帯（背景画像）が要素の高さに足りず、文字が枠外に見える
   *
   *   既存サイトの h3 は 50×35px の画像を repeat-x で敷いて帯にしている。
   *     地色 #EBEBEB（94.3%）＋ 最下部にセクション色の下線1px
   *     support=#DC641E（橙）/ cut・company・download・sitemap=#0079C0（青）
   *     example=#00AA87（緑）/ policy=#C77F85（赤）
   *   repeat-x は横にしか繰り返さないので、SPで見出しが2行以上（62px）になると
   *   **35pxを超えた分の帯が消え、下線が帯の中間に来て文字が枠外に出る**。
   *
   *   実測（iPhone13 390px）: 5件
   *     /support/trustee/ 「例えば、こんな受託切断で…」 35px→62px（27px不足）
   *     /example/01/ ほか3件、/policy/ 1件
   *
   *   → 地色を background-color で敷き、下線画像を要素の最下部に配置する。
   *     **地色は全セクション共通 #EBEBEB**（下線色だけ画像で変わる）なので
   *     1指定で全セクションに効く。画像の地色と同じ色なので継ぎ目も出ない。
   *
   *   ※ FAQの Q アイコン（faq_icn_q_*.png 29px高）も要素より小さいが、
   *     こちらは「左上に置くアイコン」なので対象外（9件）。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body h3 {
    background-color: #EBEBEB !important;
    background-position: left bottom !important;
    background-repeat: repeat-x !important;
  }

  /* -------------------------------------------------------------------
   * 型H：画像が左寄せのまま右に大きな余白が空く
   *
   *   既存サイトは980px固定・本文730pxで左寄せが自然だったが、
   *   SP(366px)では画像の右に 71〜298px の余白が空いて不揃いに見える。
   *   実測で 19ページ・74件（/support/ の8枚、/cut/ 配下の仕様アイコン、
   *   /download/ のサムネイル、/support/faq_m/ の比較画像 など）。
   *
   *   → SPでは本文画像を中央に置く。
   *
   *   画像を包む a はインライン要素なので margin:auto が効かない。
   *   `a:has(> img)` でブロック化して中央寄せする
   *   （:has() は iOS Safari 15.4+ / 非対応環境では中央にならないだけで崩れない）。
   * ------------------------------------------------------------------- */
  #dcms_layoutPageBlock .yd-body dd>img,
  #dcms_layoutPageBlock .yd-body dt>img,
  #dcms_layoutPageBlock .yd-body p>img,
  #dcms_layoutPageBlock .yd-body li>img,
  #dcms_layoutPageBlock .yd-body div>img {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  #dcms_layoutPageBlock .yd-body a:has(> img) {
    display: block !important;
    text-align: center !important;
  }
  #dcms_layoutPageBlock .yd-body a:has(> img)>img {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* /download/ のカタログサムネイルとボタンは第10フェーズ③で
     `.item li .thumb { margin:0 0 12px }` / `.item li a { display:inline-block }`
     と固定していた（詳細度 1,3,2）ため上のルール（1,1,2）では上書きできない。
     同じ詳細度で後から中央寄せに変える。 */
  #dcms_layoutPageBlock .yd-body .item li .thumb {
    margin: 0 auto 12px !important;
  }
  #dcms_layoutPageBlock .yd-body .item li a {
    display: block !important;
    text-align: center !important;
  }
  #dcms_layoutPageBlock .yd-body .item li .btn {
    margin: 0 auto !important;
  }
}

#dcms_layoutPageBlockPasteArea {
  width: 100%;
}

@media (min-width: 992px) {
  #dcms_layoutPageBlockPasteArea {
    display: block;
    width: 980px;
    margin: 0 auto 0 auto;
    position: relative;
  }
}

@media (max-width: 767px) {
  .yd-pagehead__section,
  .yd-pagehead__main,
  .yd-innernav {
    width: 100% !important;
  }
  .yd-pagehead__section {
    height: auto !important;
    padding: 12px 10px !important;
    font-size: 15px !important;
    background-image: none !important;
    background-color: #0079c0 !important;
  }
  .yd-pagehead__main {
    min-height: 0 !important;
    padding: 14px 0 10px !important;
    font-size: 24px !important;
    background-image: none !important;
    border-bottom: 2px solid #a7d2e8 !important;
  }
  .yd-pagehead__main .sub {
    font-size: 17px !important;
  }
  .yd-innernav>li {
    float: none !important;
  }
  .yd-innernav>li a {
    margin: 0 0 6px 0 !important;
  }
  html.yd-sec-cut #dcms_layoutPageBlock .yd-body .catch {
    font-size: 20px !important;
  }
}