/* ===== PCだけ適用（幅1200px以上）================================== */
@media (min-width: 1200px) {

  /* 1) 電話はアイコンのみ（番号テキストを非表示） */
  /* 既存の .contact-area 構造に合わせて content を消す */
  header.style-1 .contact-area .content {
    display: none !important;
  }

  /* 2) お問い合わせボタンの横幅を圧縮（アイコン＋テキストをコンパクトに） */
  header.style-1 .nav-right .right-sidebar-button {
    padding: 10px 12px !important;   /* 既定 13px 20px を圧縮 */
    gap: 6px !important;
    border-radius: 14px !important;  /* pill感は残しつつ少し角丸を抑える */
  }
  header.style-1 .nav-right .right-sidebar-button span {
    font-size: 12px !important;      /* ラベルをやや小さく */
    letter-spacing: 0.02em !important;
  }

  /* 3) グローバルメニューを16–18pxに（状況で切替）＋間隔圧縮＋1行固定 */
  header.style-1 .main-menu > ul {
    /* 並び替えは既存に任せ、横幅節約だけ行う */
    padding: 0 4px !important;       /* pillの左右余白を少しだけ詰める（既定 0 6px 相当） */
    white-space: nowrap;
  }
  header.style-1 .main-menu > ul > li {
    padding: 2px 0 !important;       /* 既定 4px 2px 相当 → 上下を少しだけ */
  }
  header.style-1 .main-menu > ul > li > a {
    /* ★固定サイズ派：ここを 16px か 18px に */
    font-size: clamp(16px, 1.05vw, 18px) !important;
    /* 横詰め：既定 10px 22px あたり → 10px 14px で詰める */
    padding: 10px 14px !important;
    letter-spacing: 0.2px !important; /* 既定 0.4px → 0.2pxで横幅節約 */
    white-space: nowrap;
    line-height: 1.1;
  }

  /* 4) もしそれでも2行になる場合の最終手段（必要時だけコメントアウトを外す） */
  /* .company-logo img { max-width: 180px !important; } */
  /* header.style-1 .nav-right .right-sidebar-button span { display: none !important; } */
}

/* ----- お好みで：PC向けフォントを固定にしたい場合（上の clamp をコメントアウトして使用） -----
@media (min-width: 1200px) {
  header.style-1 .main-menu > ul > li > a { font-size: 17px !important; }  /* 16 or 18 でもOK */
}
*/

/* ===== Magic Cursor/カスタムカーソル 全系統を強制OFF ===== */
#magic-cursor,
#ball,
#cursor,
#cursor2,
#cursor-outer,
#cursor-inner,
.mouse-cursor,
.cursor,
.cursor-dot,
.cursor-follower,
.cursor-outer,
.cursor-inner,
.circle-cursor,
.circle-cursor--outer,
.circle-cursor--inner,
.magic-cursor,
.tt-magic-cursor #cursor,
.tt-magic-cursor #ball,
.canvas-cursor,
#fancy-cursor {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* bodyに機能ONのクラスが付与されても無効化 */
body.tt-magic-cursor,
html.tt-magic-cursor {
  cursor: auto !important;
}

/* 通常のカーソルを復帰（必要な要素だけpointerに） */
html, body { cursor: default !important; }
a[href], button, .btn, [role="button"], input[type="submit"] { cursor: pointer !important; }


/* ====== Client Slider（6p29eapn用 調整）====== */

/* 丸の親ボックスを確保（中央の丸が消える対策） */
.client-slider-boxes{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  flex-wrap:nowrap; /* 一列で */
}

/* 左右のスライダー：flex配分を固定（c0ructw9と同じ40%/20%/40%） */
.client-slider-box{ width:40%; min-width:0; }
.scroll-down-circle-box{ width:20%; position:relative; }

/* 背景画像のパスを“サイトルート”で参照（相対ズレ対策） */
.scroll-down-circle-box{
  background:url('/themes/nisshin_base/images/scroll-down-img-shape.svg') no-repeat top center / contain;
  margin-top:-58px;
}

/* 回転テキストのSVG（こちらもルートで置くのが安全） */
.scroll-circle-text figure img{
  width:100%;
  max-width:165px;
  animation:textrotate 25s linear infinite;
}

/* 矢印の配置（そのまま利用） */
.scroll-circle-text{ position:relative; text-align:center; margin-top:20px; }
.scroll-down-arrow{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }

/* ===== Swiper の“auto幅”が効くように上書き ===== */
.client-slider .swiper-slide{ width:auto !important; padding-right:30px; }
.client-slider .client-logo img{
  width:auto !important;     /* ここが肝。既存の width:100% を無効化 */
  max-height:42px; height:auto; object-fit:contain; display:block;
}






/* 中央丸ボタンの中でSVGをきっちり表示 */
.scroll-down-arrow a { position: relative; z-index: 2; }
.scroll-down-arrow .scroll-mouse { width: 40px; height: 46px; display: block; }

/* もし過去の対応で <i> を非表示にしていたら無効化 */
.scroll-down-arrow i { display: none !important; }

/* 念のため：丸ボタンのベース（お好みで） */
.scroll-down-arrow a{
  width: 90px; height: 90px;
  background-color: var(--accent-color, #c00);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: all .3s ease-in-out;
}
.scroll-down-arrow a:hover{ background-color: var(--primary-color, #900); }



.tab-content ul li, .tab-content .news-item, .tab-content .list-item {
    border: none !important;
    background: none !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    /* border-bottom: 1px solid #eee !important; */
}

//* 1) 新着情報一覧の“ホバー揺れ”を止めるキルスイッチ */
.section-news .news-list li,
.section-news .news-list a,
.section-news .news-items li,
.section-news .news-items a,
.news .news-list li,
.news .news-list a {
  /* レイアウトが動くトランジションを禁止 */
  transition: none !important;
  transform: none !important;
}

/* 2) :hover でもレイアウトが一切変わらないよう固定 */
.section-news .news-list li:hover,
.section-news .news-list a:hover,
.section-news .news-items li:hover,
.section-news .news-items a:hover,
.news .news-list li:hover,
.news .news-list a:hover {
  transform: none !important;
  margin: 0 !important;
  top: auto !important;
  padding: inherit !important;
  box-shadow: none !important;
  filter: none !important;
}

/* 3) border が原因の場合：太さは常に一定（色だけ変える） */
.section-news .news-list a,
.section-news .news-items a,
.news .news-list a {
  display: block;
  border-left: 4px solid transparent;   /* 平常時から“4px”を確保 */
  /* 文字の太さ変化が幅を動かすのを防止したい場合は固定 */
  font-weight: 500;                      /* 必要に応じて調整 */
}
.section-news .news-list a:hover,
.section-news .news-items a:hover,
.news .news-list a:hover {
  border-left-color: var(--primary-color, #0aa); /* 色のみ変える */
}

/* 4) Safari系の軽いチラつき対策（任意） */
.section-news .news-list a,
.section-news .news-items a,
.news .news-list a {
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}


/* 新着情報リストのホバーで揺れるのを完全停止 */
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) li,
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) a {
  display: block !important;           /* 当たり判定を安定 */
  transition: none !important;         /* レイアウトを動かす遷移禁止 */
  transform: none !important;          /* 位置・拡大縮小を禁止 */
  will-change: auto !important;
}

/* hoverでもサイズが変わらないよう固定（色だけ変える想定） */
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) li:hover,
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) a:hover {
  margin: 0 !important;
  padding: inherit !important;
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* borderの“太さ変化”が原因のガタつき対策：常に同じ太さを確保 */
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) a {
  border-left: 4px solid transparent !important; /* 平常時から幅を確保 */
  text-decoration: none;                          /* 下線で高さが動くのを回避（必要なら） */
  font-weight: 500 !important;                    /* 太字化で横幅が変わるのを防止 */
}
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) a:hover {
  border-left-color: var(--primary-color, #0aa) !important; /* 色だけ変える */
}

/* Safari等の微ブレ対策（任意） */
:where(.section-news, .news, .top-news, .latest)
  :where(.news-list, .news-items, .entry-list) a {
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

/* .headline-link のホバー揺れを停止 */
.headline-link,
.headline-link * {
  transition: none !important;         /* まず全遷移を止める */
}

.headline-link {
  display: block !important;           /* 当たり判定を安定 */
  transform: none !important;
  font-weight: 500 !important;         /* 太字化で横幅が変わるのを防ぐ（必要なら調整） */
}

.headline-link:hover {
  transform: none !important;
  margin: 0 !important;
  padding: inherit !important;
  box-shadow: none !important;
  filter: none !important;
  border-left-color: var(--primary-color, #0aa) !important; /* 色だけ変える */
}

/* 擬似要素やアイコンが動いているケースも停止 */
.headline-link::before,
.headline-link::after,
.headline-link i,
.headline-link svg {
  transition: none !important;
  transform: none !important;
}

/* ［任意］微ブレ低減 */
.headline-link {
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}





/* PCだけ適用（ブレークポイントは任意に調整） */
@media (min-width: 992px) {

  /* 1) 親：横並びレイアウト（Grid推奨） */
  .product-list { /* 例：カード群の親 (ul / div 等) */
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)); /* 列数は調整 */
    gap: 24px; /* すき間 */
  }

  /* 2) 子：カードをセルの高さいっぱいに伸ばす */
  .product-list > * { /* li など */
    height: 100%;
  }

  /* 3) カード本体：縦フレックスで“上：本文 / 下：ボタン” */
  .product-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff; /* 任意 */
    border: 1px solid #eee; /* 任意 */
    border-radius: 8px;      /* 任意 */
    overflow: hidden;        /* 任意（角丸に合わせる） */
  }

  /* 4) 画像枠は固定比率にして高さのバラつきを防ぐ */
  .product-card .card-media {
    position: relative;
    aspect-ratio: 4 / 3;     /* 画像比率は任意（1/1, 3/2等） */
    width: 100%;
    overflow: hidden;
  }
  .product-card .card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;       /* 画像の切り抜きで統一感 */
    display: block;
  }

  /* 5) 本文は可変、余った高さをここで吸収して揃える */
  .product-card .card-body {
    flex: 1;                 /* ←これがキモ：高さを均等化 */
    padding: 16px;
  }

  /* 6) ボタン行は常に最下部に配置される */
  .product-card .card-actions {
    margin-top: auto;        /* 下寄せ */
    padding: 16px;
    border-top: 1px solid #eee; /* 任意 */
  }

  /* 7) タイトルやテキストの行数制御（はみ出し防止・任意） */
  .product-card .card-title {
    font-weight: 600;
    margin: 0 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;   /* 2行で省略 */
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .product-card .card-text {
    display: -webkit-box;
    -webkit-line-clamp: 3;   /* 文章量が多い場合の揃え */
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

.entry-title a {
    color: #333 !important;
}



/* === 6p29eapn: Client Slider — smartphone tweaks === */
@media (max-width: 991.98px){
  /* 中央の丸（回転テキスト＋矢印）をスマホでも表示＆前面に */
  .scroll-down-circle-box{
    display: block !important;
    width: 28% !important;     /* 見た目バランス。必要なら 24–32% で調整 */
    min-width: 120px;
    position: relative;
    z-index: 5;
    margin-top: -20px;         /* 背景との重なり微調整。不要なら削除 */
  }
  .scroll-circle-text figure img{ max-width: 120px; }
  .scroll-down-arrow .scroll-mouse{ width: 32px; height: 38px; }

  /* メーカー・ロゴを少し小さく（移設元相当） */
  .client-slider .client-logo img{
    max-height: 26px !important;  /* 目安。24–30pxでお好み調整 */
    width: auto !important;
    height: auto;
    object-fit: contain;
    display: block;
  }

  /* スライドの間隔をスマホ向けに少し詰める（任意） */
  .client-slider .swiper-slide{ padding-right: 18px !important; }
}


/* === Client Slider: smartphone size tuning for scroll-down circle === */

/* タブレット以下で丸ごと小さく（比率維持） */
@media (max-width: 991.98px){
  /* 丸コンテナの幅を縮小（%＋最小幅でバランス） */
  .scroll-down-circle-box{
    width: clamp(90px, 22vw, 120px) !important; /* 端末に応じて可変 */
    min-width: 90px;            /* 文字が潰れない下限 */
    position: relative;
    z-index: 5;
    margin-top: -12px;          /* 必要なければ削除可 */
  }

  /* 回転テキスト画像をコンテナにフィット */
  .scroll-circle-text figure img{
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
  }

  /* 矢印SVG（マウス＋下矢印）も縮小 */
  .scroll-down-arrow{
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    z-index: 6;
  }
  .scroll-down-arrow .scroll-mouse{
    width: clamp(22px, 6vw, 30px);
    height: clamp(28px, 7.5vw, 36px);
    display: block;
  }
  /* SVGの線の太さも少し細く（属性よりCSS !important が優先） */
  .scroll-down-arrow .scroll-mouse,
  .scroll-down-arrow .scroll-mouse *{
    stroke-width: 1.6px !important;
  }
}

/* さらに小さい端末で、もう一段だけ縮める（任意） */
@media (max-width: 575.98px){
  .scroll-down-circle-box{
    width: clamp(80px, 24vw, 110px) !important;
    min-width: 80px;
  }
  .scroll-down-arrow .scroll-mouse{
    width: clamp(20px, 5.5vw, 28px);
    height: clamp(26px, 7vw, 34px);
  }
  .scroll-down-arrow .scroll-mouse,
  .scroll-down-arrow .scroll-mouse *{
    stroke-width: 1.4px !important;
  }
}

/* === Client Slider: smartphone size tuning for RED circle & SVG === */
@media (max-width: 991.98px){
  /* 赤い丸（背景が赤の円）を小さく */
  .scroll-down-arrow a{
    width: 70px !important;   /* 例：90px → 70px */
    height: 70px !important;
  }

  /* 中央のSVG（マウス＋矢印）も連動して縮小 */
  .scroll-down-arrow .scroll-mouse{
    width: 28px;              /* 例：40px → 28px */
    height: 34px;             /* 例：46px → 34px */
    display: block;
  }

  /* 回転テキストのリングも少しだけ小さく */
  .scroll-circle-text figure img{
    max-width: 130px;         /* 例：165px → 130px（必要に応じて調整） */
  }
}

/* さらに小さい端末向け（任意） */
@media (max-width: 575.98px){
  .scroll-down-arrow a{
    width: 62px !important;
    height: 62px !important;
  }
  .scroll-down-arrow .scroll-mouse{
    width: 24px;
    height: 30px;
  }
  .scroll-circle-text figure img{
    max-width: 120px;
  }
}

/* ====== Tabs v2（継ぎ目ゼロ & 多タブ対応）====== */
#cof-tabs-57 {
  --c: #333;              /* 線色 */
  --bg: #fff;             /* タブの背景（ご希望どおり白） */
  --b: 2px;               /* 線の太さ */
  --r: 8px;               /* 角丸 */
  width: 90%;
  margin: 10px auto 0;
  background: transparent;
  margin-bottom: 32px;
}

/* 見出し行（ここで“1本線”を引く） */
#cof-tabs-57 .cof-tablist{
  display: flex;
  flex-wrap: nowrap;           /* 折り返さず横スクロール */
  overflow-x: auto;
  scrollbar-gutter: stable;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0;                      /* 余白で段差が出ないように */
  border-bottom: var(--b) solid var(--c); /* ←これが途切れない土台 */
  background: var(--bg);       /* ご希望の白 */
}

/* li の余白を完全に殺して段差を作らない */
#cof-tabs-57 .cof-tablist > li{
  flex: 0 0 auto;              /* タブ数が増えても幅を確保 */
  margin: 0;
}

/* タブボタン（リンク/ラベルどちらでもOK） */
#cof-tabs-57 .cof-tablink,
#cof-tabs-57 .cof-label{
  display: block;
  padding: 14px 24px;
  text-decoration: none;
  color: #666;
  background: var(--bg);
  border: var(--b) solid transparent;  /* ←個々のタブに線は描かない */
  border-bottom: none;                 /* 下線はul側の1本だけ */
  position: relative;
  top: 0;
  user-select: none;
  transition: color .15s ease;
}
#cof-tabs-57 .cof-tablink:hover,
#cof-tabs-57 .cof-label:hover{ color:#333; }

/* パネル（上辺はなし＝タブと一体化） */
#cof-tabs-57 .cof-panel,
#cof-tabs-57 .cof-pane{
  display: none;
  padding: 20px;
  background: #f0f0f0;         /* お好みで */
  border: var(--b) solid var(--c);
  border-top: none;            /* ←ここ大事：上線はタブに任せる */
  border-radius: 0 0 var(--r) var(--r);
}

/* :target（ハッシュ方式）の表示切替 */
#cof-tabs-57 .cof-panel:target { display:block; }
/* 初期表示（ターゲット無しなら1枚目） */
#cof-tabs-57:not(:has(.cof-panel:target)) #cof-tab-1 { display:block; }

/* ラジオ方式にも対応（隣接paneを表示） */
#cof-tabs-57 .cof-radio:checked ~ .cof-pane { display:block; }

/* ====== アクティブ見た目（継ぎ目ゼロ演出） ====== */
/* :target でどのタブが有効かを色付け */
#cof-tabs-57:has(#cof-tab-1:target)  .cof-tablink[href="#cof-tab-1"],
#cof-tabs-57:has(#cof-tab-2:target)  .cof-tablink[href="#cof-tab-2"],
#cof-tabs-57:has(#cof-tab-3:target)  .cof-tablink[href="#cof-tab-3"],
#cof-tabs-57:has(#cof-tab-4:target)  .cof-tablink[href="#cof-tab-4"],
#cof-tabs-57:has(#cof-tab-5:target)  .cof-tablink[href="#cof-tab-5"],
#cof-tabs-57:has(#cof-tab-6:target)  .cof-tablink[href="#cof-tab-6"],
#cof-tabs-57:has(#cof-tab-7:target)  .cof-tablink[href="#cof-tab-7"],
#cof-tabs-57:has(#cof-tab-8:target)  .cof-tablink[href="#cof-tab-8"],
/* 初期表示（ターゲット無し）は1つ目をアクティブ扱い */
#cof-tabs-57:not(:has(.cof-panel:target)) .cof-tablink[href="#cof-tab-1"],
/* ラジオ方式（チェックされたタブの直後ラベル） */
#cof-tabs-57 .cof-radio:checked + .cof-label {
  color:#333;
  font-weight: 600;
  border-color: var(--c);
  border-bottom-color: transparent; /* 下側だけ透明に */
  margin-bottom: calc(-1 * var(--b)); /* ←この 1本分の“食い込み”で段差が消える */
  z-index: 2;                        /* パネルの線より前面に */
}

/* 角丸（最初/最後のタブだけ角丸に） */
#cof-tabs-57 .cof-tablist > li:first-child .cof-tablink,
#cof-tabs-57 .cof-tablist > li:first-child .cof-label { border-top-left-radius: var(--r); }
#cof-tabs-57 .cof-tablist > li:last-child  .cof-tablink,
#cof-tabs-57 .cof-tablist > li:last-child  .cof-label { border-top-right-radius: var(--r); }

/* スクロール用の見た目（任意） */
#cof-tabs-57 .cof-tablist::-webkit-scrollbar{ height:8px; }
#cof-tabs-57 .cof-tablist::-webkit-scrollbar-thumb{ background:#ddd; border-radius:4px; }



@media (max-width: 1199px) {
    .product-page .product-card {
        padding: 8px;
    }
}

@media (max-width: 1399px) {
    .product-page .product-card {
        padding: 12px;
    }
}

.product-page .product-card {
    padding: 16px;
    border: 0.5px solid rgba(var(--black-color-opc), 0.05);
}

.product-card .product-img {
    position: relative;
    margin-bottom: 0px;
    overflow: hidden;
}

.mb-32 {
    margin-bottom: 32px;
}

.mojiShiro {
	color: #ffffff;
}

.policy a {
	color: #006DD9 !important;
}

.policy a:visited {
	color: #006DD9 !important;
}