/* ───────── Base ───────── */
.section-trial-support{background-size:cover;width:100%;margin-top:0!important;padding-top:0!important;font-size:.18rem;line-height:1.7}
.section-trial-support .separator-row hr.ts-sep{border:0;border-top:1px solid #000;height:0;margin:15px 0}
header,.content-area{margin-bottom:0!important}

.section-trial-support .section-heading-common{
  max-width:none;margin:0;padding:40px 0;text-align:center;width:100%;background:#f5f5f5
}
.section-trial-support .content-wrapper{max-width:1200px;margin:0 auto;padding:0 20px;background:transparent}
.section-trial-support p,.section-trial-support li{font-size:1em}

/* 表まわり（このページだけ） */
.form-table.no-border,.form-table.no-border td,.form-table.no-border th{border:none!important}
.form-table.no-border td{text-align:center;vertical-align:top}
.inline-table td{padding:0 6px}
.prod-title{list-style:none;margin:0 0 8px;padding:0}
.section-trial-support .form-table.no-border td{text-align:left} /* 表内リストは左寄せ */

.section-heading-common{display:flex;justify-content:center;align-items:center;text-align:center;padding:48px 0;width:100%;margin:0}
.heading-title{margin:0;color:#7A3CF4;font-weight:800;line-height:1.2;font-size:clamp(22px,3.2vw,40px);letter-spacing:.02em;position:relative}

/* ボタン/リンク */
.link-common-purple{display:inline-flex;align-items:center;gap:8px;background:#b266ff;color:#fff;font-size:16px;font-weight:700;padding:16px 40px;border-radius:8px;text-decoration:none;transition:background-color .3s,transform .2s}
.purple-btn:hover{background:#7a1fd1;transform:translateY(-2px)}
.purple-btn .arrow{font-size:18px;line-height:1}
.section-trial-support .wpcf7 .wpcf7-submit,
.section-trial-support a.link-common-purple{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#8a2be2!important;color:#fff!important;font-size:16px;font-weight:700;padding:16px 40px;border-radius:8px;text-decoration:none!important;border:none;cursor:pointer;line-height:1.2;transition:background-color .2s,transform .15s;box-shadow:none;appearance:none}
.section-trial-support .wpcf7 .wpcf7-submit:hover,
.section-trial-support a.link-common-purple:hover{background:#a64dff!important;transform:translateY(-1px)}
.section-trial-support .wpcf7 .wpcf7-submit:active,
.section-trial-support a.link-common-purple:active{transform:translateY(0)}
.section-trial-support .wpcf7 .wpcf7-submit::after,
.section-trial-support a.link-common-purple::after{content:"›";font-size:18px;line-height:1;margin-left:6px}
.section-trial-support a.link-common-purple .arrow{display:none!important}
.section-trial-support .title-primary{font-weight:700!important}

/* 汎用ボタン */
.btn-purple{display:inline-block;background:#7b2cf5;color:#fff;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:700;text-align:center;transition:background .2s}
.btn-purple.light{background:#b58cf8}
.btn-purple.light:hover{background:#7b2cf5}
.btn-outline-purple{display:inline-block;padding:12px 24px;font-size:16px;font-weight:700;text-align:center;color:#7b2cf5;background:#fff;border:2px solid #7b2cf5;border-radius:8px;text-decoration:none;transition:all .3s}
.btn-outline-purple:hover{background:#7b2cf5;color:#fff;transform:translateY(-2px)}

/* フォームの見た目 */
.wpcf7 form{background:#f8f6ff;padding:30px;border-radius:12px;max-width:1000px;margin:0 auto;box-shadow:0 4px 20px rgba(0,0,0,.08);border:1px solid #e8e8e8}
.wpcf7-form-control-wrap.confirm_product label,
.wpcf7-form-control-wrap.agree label{display:inline!important}
.wpcf7-form-control-wrap.confirm_product label::after,
.wpcf7-form-control-wrap.agree label::after{content:" *";color:red;margin-left:.25em;display:inline!important}
.wpcf7-not-valid-tip,.section-trial-support .wpcf7-not-valid-tip{color:#e60033!important;font-size:.9em;margin-top:6px;font-weight:700}
.wpcf7-form-control.wpcf7-not-valid{border:2px solid #e60033!important;background:#fff5f5}
.wpcf7 .wpcf7-form-control.wpcf7-not-valid:focus{border-color:#e60033!important;box-shadow:none!important}

/* 入力UI共通 */
.section-trial-support .wpcf7 select,
.section-trial-support .wpcf7 .wpcf7-select,
.section-trial-support .wpcf7 input[type="text"],
.section-trial-support .wpcf7 input[type="email"],
.section-trial-support .wpcf7 textarea{
  background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:12px 16px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:all .2s
}
.section-trial-support .wpcf7 input:focus,
.section-trial-support .wpcf7 textarea:focus,
.section-trial-support .wpcf7 select:focus{outline:none;border-color:#7A3CF4;box-shadow:0 0 0 3px rgba(122,60,244,.1);transform:translateY(-1px)}
.section-trial-support .wpcf7 .wpcf7-text,.section-trial-support .wpcf7 .wpcf7-textarea{padding-top:.12rem;padding-bottom:.12rem;line-height:1.4;background:#fff!important;padding-right:.20rem}

/* セレクト（紫アイコン背景・挙動） */
.section-trial-support .wpcf7 select,
.section-trial-support .wpcf7 .wpcf7-select{background:#fff url("/wp/wp-content/themes/fcvanilla/img/form/ico_select.png") right center/contain no-repeat!important}
.section-trial-support .wpcf7 select,.section-trial-support .wpcf7 .wpcf7-select{transition:border-color .3s,box-shadow .3s}

/* エラー時の強制 */
.section-trial-support .wpcf7 .wpcf7-form-control[aria-invalid="true"],
.section-trial-support .wpcf7 .wpcf7-form-control.wpcf7-not-valid,
.section-trial-support .wpcf7 select[aria-invalid="true"],
.section-trial-support .wpcf7 .wpcf7-select.wpcf7-not-valid{border:2px solid #e60033!important;background:#fff!important;box-shadow:none!important;outline:none!important}
.section-trial-support .wpcf7 select[required].wpcf7-not-valid,
.section-trial-support .wpcf7 select[required][aria-invalid="true"],
.section-trial-support .wpcf7 .wpcf7-select[required].wpcf7-not-valid,
.section-trial-support .wpcf7 .wpcf7-select[required][aria-invalid="true"]{border:2px solid #e60033!important;background:#fff!important;background-image:url("/wp/wp-content/themes/fcvanilla/img/form/ico_select.png")!important;background-position:right center!important;background-size:contain!important;background-repeat:no-repeat!important;box-shadow:0 0 0 3px rgba(230,0,51,.1)!important;position:relative!important;z-index:999!important}
@keyframes errorShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@keyframes errorPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}

/* 住所/サンクスなど */
.section-trial-support .content-wrapper>div:not(.section-contact-form),
.section-trial-support .content-wrapper>h2,
.section-trial-support .content-wrapper>p,
.section-trial-support .content-wrapper>table,
.section-trial-support .content-wrapper>ol,
.section-trial-support .content-wrapper>ul{max-width:1000px;margin-left:auto;margin-right:auto}
.section-trial-support .form-table.no-border,
.section-trial-support .form-table.no-border td,
.section-trial-support .form-table.no-border th{text-align:center}
.section-trial-support .form-table.no-border h4{text-align:center;margin:10px auto}
.section-trial-support .form-table.no-border tr td:last-child{line-height:1.4}
.section-trial-support .form-table.no-border tr td:last-child font[size="2"]{line-height:1.3;display:block;margin-top:5px}
.section-trial-support .form-table.no-border tr td:last-child p,
.section-trial-support .form-table.no-border tr td:last-child div{margin-bottom:8px;line-height:1.4}
.thank-you-page{background:#f8f6ff;border-radius:12px;padding:40px;margin:20px auto;max-width:1000px;box-shadow:0 4px 20px rgba(0,0,0,.08);border:1px solid #e8e8e8}
.thank-you-content{text-align:center}
.thank-you-icon{width:80px;height:80px;background:#7A3CF4;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:40px;margin:0 auto 30px;font-weight:700}
.thank-you-title{color:#333;font-size:28px;margin-bottom:30px}
.thank-you-message{text-align:left;line-height:1.8;margin-bottom:40px}
.thank-you-message p{margin-bottom:20px}
.thank-you-message .red-text{color:#e60033;font-weight:500}
.thank-you-actions{text-align:center}
.btn-home{display:inline-block;background:#7A3CF4;color:#fff;padding:15px 30px;border-radius:8px;text-decoration:none;font-weight:400;transition:all .3s;box-shadow:0 2px 10px rgba(122,60,244,.3)}
.btn-home:hover{background:#6a2ce4;transform:translateY(-2px);box-shadow:0 4px 15px rgba(122,60,244,.4)}

/* タイポ/レンダリング安定 */
.section-trial-support,.section-trial-support .wpcf7,.section-trial-support .wpcf7 *{
  font-family:"Noto Sans JP","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","游ゴシック",YuGothic,"Yu Gothic","メイリオ",Meiryo,sans-serif!important;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility
}
.section-trial-support .form-label{font-weight:500!important}
.section-trial-support .prod-title li,
.section-trial-support .inline-table td{font-weight:normal!important}

/* 注釈ボックス */
.note-box{border:2px solid #000;padding:16px;margin:20px 0;background:#fff;border-radius:4px}

/* ラッパー全幅化 */
.section-trial-support.wrapper{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}

/* 送信時のみエラー表示を強制 */
.section-trial-support .wpcf7-form.show-errors{display:block!important}
.section-trial-support .wpcf7-form.show-errors .wpcf7-form-control.wpcf7-not-valid,
.section-trial-support .wpcf7-form.show-errors .wpcf7-form-control[aria-invalid="true"]{border:2px solid #e60033!important;background:#fff!important;box-shadow:none!important}

/* 行間・間隔（共通ユーティリティ） */
.section-contact-form .form-block,.section-contact-form .form-group,.section-contact-form p{margin:0!important}
.section-trial-support .product-row td{vertical-align:middle;padding-top:0;padding-bottom:12px}
.section-trial-support .product-row select{margin-top:0!important}
/* .section-trial-support .wpcf7-form-control-wrap:has(.wpcf7-not-valid){outline:2px solid #e60033;outline-offset:2px} */
.section-trial-support .wpcf7-form-control-wrap:has(.wpcf7-not-valid){outline: none !important; }
.section-trial-support input.form-select,.section-trial-support textarea.form-select{background-image:none!important}
.wpcf7cf-hidden{display:none!important}

/* ───────── 製品サムネ（6点） ───────── */
.section-trial-support .inline-table img{width:140px!important;height:auto!important;aspect-ratio:4/3;object-fit:contain;display:block;margin:0 auto 2px !important;}
.section-trial-support .inline-table td{text-align:center;vertical-align:top;padding:4px !important;line-height: 1;box-sizing:border-box}
/* 画像を同じ“見た目サイズ”に統一 */
.section-trial-support .inline-table td img{
  width: 160px !important;   /* 好みで 140–180px に調整 */
  height: 120px !important;  /* 同じ“枠”を全画像で共有 */
/*  object-fit: contain;       * はみ出さず等比で収める */
  object-fit: cover;         /* 余白なし。枠いっぱいに収める */
  display: block;
  margin: 0 auto;
/*  padding: 4px !important;   * ← 余白を小さく */
  vertical-align: top;
}
.sp-br{display:none}

/* ───────── PCのみ ───────── 
@media (min-width:769px){
  .section-trial-support .section-contact-form .wpcf7-text,
  .section-trial-support .section-contact-form .wpcf7-select{height:43px;padding:0 20px}
  .section-trial-support.wrapper{width:100%!important;max-width:none!important}
}
*/

/* ───────── SP（<= 769px）に集約 ───────── */
@media (max-width:769px){
  /* CF7：テーブルを縦積み化 */
  .section-contact-form .form-table{width:100%;border-collapse:collapse}
  .section-contact-form .form-table td{display:block;width:100%!important;padding:4px 0!important}
  .section-contact-form .separator-row td{padding-top:2px!important;padding-bottom:3px!important}
  .section-contact-form .form-table tr>td:first-child{padding-bottom:.25rem}
  .section-contact-form .form-table tr>td:nth-child(2){padding-top:0;margin-bottom:.75rem}
  .section-contact-form input[type="text"],
  .section-contact-form input[type="email"],
  .section-contact-form input[type="tel"],
  .section-contact-form select,
  .section-contact-form textarea{width:100%;max-width:100%;font-size:16px}

  /* 行間最適化 */
  .section-trial-support .section-contact-form .form-label{margin-bottom:.06rem!important}
  .section-trial-support .form-select{padding-top:.06rem!important;padding-bottom:.06rem!important;margin:0!important}
  .section-trial-support .section-contact-form .form-table tr{margin-bottom:.16rem!important}
  .section-trial-support .wpcf7 .wpcf7-select{height:.48rem!important;line-height:1.3!important;padding:.10rem .50rem .10rem .20rem!important;background-position:right 0 center!important}
  .section-trial-support .wpcf7 .wpcf7-text,
  .section-trial-support .wpcf7 .wpcf7-textarea{padding-top:.10rem!important;padding-bottom:.10rem!important}

  /* さらに詰める版（重複統合） */
  .section-trial-support .form-table tr{margin:0!important}
  .section-trial-support .form-table td{padding-top:6px!important;padding-bottom:6px!important}
  .section-trial-support .form-table tr>td:first-child{padding-bottom:4px!important}
  .section-trial-support .wpcf7-form-control-wrap,
  .section-trial-support .section-contact-form .form-block>.wpcf7-form-control-wrap,
  .section-trial-support .section-contact-form .form-block>.wpcf7-form-control-wrap select.wpcf7-select,
  .section-trial-support .section-contact-form .form-block>.wpcf7-form-control-wrap input.wpcf7-text,
  .section-trial-support .section-contact-form .form-block>.wpcf7-form-control-wrap textarea.wpcf7-textarea{margin-top:0!important;margin-bottom:4px!important}
  .section-trial-support tr.product-row+tr.product-row{margin-top:0!important}
  .section-trial-support .separator-row td{padding-top:4px!important;padding-bottom:4px!important}
  .section-trial-support .separator-row td hr{margin:8px 0!important}
  .section-trial-support .section-contact-form table.form-table td>*{margin-top:0!important;margin-bottom:0!important}
  .section-trial-support .section-contact-form .form-block{margin-bottom:12px!important}
  .section-trial-support .form-label{margin-bottom:4px!important}

  /* セレクト系の見た目（スマホ） */
  .section-trial-support select,.section-trial-support .wpcf7-select{-webkit-appearance:none!important;appearance:none!important;width:100%!important;max-width:100%!important;background:#fff!important;padding:10px 2.2rem 10px .8rem!important;border:1px solid #d1d5db!important;border-radius:8px!important;font-size:14px!important;line-height:1.4!important;box-shadow:none!important;position:relative}
  .section-trial-support .wpcf7-select{font-size:11px!important;background-position:right .1em center!important;background-size:.9em auto!important}
  .section-trial-support select,.section-trial-support .wpcf7-select{background-position:right .1em center!important;background-size:.9em auto!important;padding-right:2.2em!important;white-space:normal!important}
  .section-trial-support .wpcf7-text,.section-trial-support .wpcf7-textarea{font-size:16px}

  /* ラベル/行の個別微調整 */
  .section-trial-support tr.channel-row[data-product] td{display:block;width:100%!important;padding-top:30px!important;padding-bottom:1px!important;margin:0!important;height:auto!important;background:none!important}
  .section-trial-support tr.channel-row{margin-bottom:0!important;padding-bottom:0!important}
  .section-trial-support tr.channel-row+tr{margin-top:0!important;padding-top:2px!important}
  .section-trial-support tr.is-after-device-model td{padding-top:16px!important}

  /* 製品6点：外側は縦積み・内側は2列固定 */
  .section-trial-support .form-table.no-border>tbody>tr>td{display:block;width:100%!important}



 /* 内側テーブルの基本をリセット */
  .section-trial-support .form-table.no-border .inline-table{
    width:100%;
    border-collapse:collapse;    /* border-spacing を消す */
    table-layout:fixed;
    margin:0 auto;
  }

  /* 行をフレックス化して 2列＋折返し */
  .section-trial-support .form-table.no-border .inline-table tr{
    display:flex;
    flex-wrap:wrap;
  }

  /* 2列に固定（外側の縦積み指定を打消し） */
  .section-trial-support .form-table.no-border .inline-table td{
    display:block !important;
    width:50% !important;
    padding:12px 6px !important;
    text-align:center;
    box-sizing:border-box;
    vertical-align:top;
  }

  /* 画像の見た目サイズを完全統一 */
  .section-trial-support .form-table.no-border .inline-table img{
    width:140px !important;   /* 必要に応じて調整 130–160px */
    height:auto !important;
    object-fit:contain;
    display:block;
    margin:0 auto 6px;
  }

  /* タイトルの上下余白のばらつき対策 */
  .section-trial-support .prod-title{
    margin:6px 0 8px !important;
    text-align:center;
  }



  /* SP専用改行 */
  .sp-br{display:block}
}

/* 表示制御 */
.section-trial-support tr.channel-row[data-product]{display:none}
.section-trial-support tr.channel-row.is-show{display:table-row}
.select-fulltext{margin-top:6px;font-size:.95em;line-height:1.6;color:#333;white-space:normal;word-break:break-word}

/* 住所系センター寄せ（このページのみ） */
.section-trial-support .form-table.no-border{text-align:center}
.section-trial-support .form-table.no-border td{vertical-align:middle}

/* SP専用brの初期状態 */
@media (min-width:769px){.sp-br{display:none}}

/* ====== グリッド本体 ====== */
.section-trial-support .prod-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr)  !important; /* PC: 4列 */
  gap: 14px 23px;                                   /* 行間, 列間 */
  align-items:start;
  max-width: 1000px;    /* ページに合わせて調整可 */
  margin: 0 auto;       /* 中央寄せ */
}
/* === 製品グリッド内だけ：見出しサイズを本文相当に固定 === */
.section-trial-support .prod-grid h1,
.section-trial-support .prod-grid h2,
.section-trial-support .prod-grid h3,
.section-trial-support .prod-grid h4,
.section-trial-support .prod-grid h5,
.section-trial-support .prod-grid h6,
.section-trial-support .prod-grid .prod-name {
  font-size: 1em !important;      /* 本文サイズ */
  font-weight: 400 !important;      /* ボールド解除 */
  line-height: 1.4 !important;
  margin: 4px 0 6px !important;     /* 巨大余白を抑える */
  text-align: center;
  white-space: normal;
  word-break: keep-all;
}
/* スマホは 2列×3行に */
@media (max-width: 768px){
  .section-trial-support .prod-grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px 14px;
    max-width: 560px;   /* 左右の開き過ぎ防止（調整可） */
  }
}

/* ====== カード共通 ====== */
.section-trial-support .prod-card{
  text-align:center;
}

/* タイトル（小見出し） */
.section-trial-support .prod-name{
  margin: 4px 0 6px;
  font-size: 1rem;
  font-weight: 400;
}

/* 画像：見た目サイズ統一（元画像の余白に影響されない） */
/*
.section-trial-support .prod-thumb{
  width: 130px;        * PCの見た目サイズ（130–180で調整可） *
  max-width: 100%;
  height: auto;
  aspect-ratio: 4/3;   * 奥行きの違う画像も高さを揃える *
  object-fit: contain; * 余白は自動で内側に収める *
  display:block;
  margin: 0 auto 8px;
}
*/

/* SKU（型番） */
.section-trial-support .prod-sku{
  margin: 6px 0 0;
  font-weight: 400;
  line-height: 1.4;
  word-break: keep-all;
}

/* もっと詰めたい/広げたい時の微調整 */
@media (min-width: 769px){
  .section-trial-support .prod-thumb{ width: 150px; }  /* 例: 150に */
}

/* さらに近い場合は、下マージンも追加（お好みで） */
@media (min-width: 769px){
  .section-trial-support .prod-grid{ margin-bottom: 2em; }
}

@media (max-width: 768px){
  .section-trial-support .prod-thumb{ width: 138px; }  /* SPは少し小さめ */
}

/* 202509131832 */

/*追加分  */
/* ==== PC（>=992px）：上段4枚を大きく＆余白を詰める ==== */
@media (min-width: 992px){
  /* 上段4枚のカード */
  .section-trial-support .prod-card:nth-child(-n+4){
    margin-bottom: 8px; /* 下の段との余白を詰める */
  }
  .section-trial-support .prod-card:nth-child(-n+4) .prod-thumb{
    --thumb-h: 190px;   /* デフォルト170pxから大きく */
  }
  /* タイトルとSKUの余白も調整 */
  .section-trial-support .prod-card:nth-child(-n+4) .prod-name{
    margin: 4px 0 6px;
  }
  .section-trial-support .prod-card:nth-child(-n+4) .prod-sku{
    margin: 4px 0 0;
  }
  /* グリッド行間を少し詰める */
  .section-trial-support .prod-grid{
    row-gap: 0px;  /* 28px→20px */
  }
}

/* ==== スマホ（<769px）：上2段（1〜4枚）だけ大きく ==== */
@media (max-width: 768px){
  /* 1〜4番目の画像を大きめに */
  .section-trial-support .prod-card:nth-child(-n+4) .prod-thumb{
    --thumb-h: 190px;  /* デフォルト130px → 少し大きく */
  }
  /* 上2段のカードの余白を詰める */
  .section-trial-support .prod-card:nth-child(-n+4){
    margin-bottom: 2px;
  }
  .section-trial-support .prod-card:nth-child(-n+4) .prod-name{
    margin: 1px 0 4px;
  }
  .section-trial-support .prod-card:nth-child(-n+4) .prod-sku{
    margin: 1px 0 0;
  }
  /* グリッド行間を少し詰める */
  .section-trial-support .prod-grid{
    row-gap: 0px; /* 18px → 14px */
    column-gap: 12px;
  }
}



.section-trial-support .prod-thumb{
  width:auto !important; height:auto !important;
  max-width:100% !important; object-fit:contain !important;
  max-height: 240px; /* 今より大きくする */

}

/* 202509131832 END */

/* 20250813-2220 start */
/* ====== 画像ギャラリー（2つで1組構成） ====== */
.section-trial-support .image-gallery {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px;
}

.section-trial-support .gallery-row {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.section-trial-support .image-item {
  text-align: center;
  width: 220px;
}

.section-trial-support .image-item img {
  width: 100%;
  height: auto;
}

.section-trial-support .image-label {
  margin-top: 10px;
  font-size: 12px;
  color: #666;
  font-weight: bold;
}

/* スマホ対応：2つで1組を維持 */
@media (max-width: 768px) {
  .section-trial-support .gallery-row {
    gap: 10px;
  }
  
  .section-trial-support .image-item {
    width: 48%;
    max-width: 180px;
  }
  
  .section-trial-support .image-gallery {
    gap: 8px;
    padding: 10px;
  }
}
/* 20250913-2220 END  */



/* ───── レイアウト基礎 ───── */
.prod-grid2{
  --gap: clamp(16px, 2.5vw, 32px);
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr)); /* PCは4カラム固定 */
  gap: var(--gap);
  margin-block: clamp(16px, 3vw, 40px);
}

/* 見出し：ぶち抜き配置（PC時） */
.pg2-title{
  grid-column: 1 / -1;              /* モバイル初期値は1列ぶち抜き */
  text-align: center;
  margin: 0;
  font-weight: 700;
  line-height: 1.3;
  padding-block: .2em .1em;
}
@media (min-width: 992px){
  .pg2-title.left-span2  { grid-column: 1 / span 2; }  /* 左2カラム */
  .pg2-title.right-span2 { grid-column: 3 / span 2; }  /* 右2カラム */
  .pg2-title.center-span2{ grid-column: 2 / span 2; }  /* 中央2カラム */
}

/* カード（画像＋SKU） */
.pg2-card{ text-align: center; }
.pg2-thumb{
  display: block;
  width: clamp(380px, 24vw, 540px);  /* PCでしっかり大きく */
  max-width: 100%;
  height: auto;
  object-fit: contain;               /* 切らない・歪めない */
  margin-inline: auto;
}
.pg2-sku{ margin-top: 9rem; line-height: 1.4; }

/* ───── レスポンシブ（タブレット/スマホ） ───── */
@media (max-width: 991.98px){
  .prod-grid2{ grid-template-columns: repeat(2, minmax(160px, 1fr)); }
  .pg2-title{ grid-column: 1 / -1; }   /* 見出しは段の先頭で全幅 */
  .pg2-thumb{ width: min(42vw, 420px); }
}
@media (max-width: 599.98px){
  .prod-grid2{ grid-template-columns: 1fr; }
  .pg2-thumb{ width: min(86vw, 520px); }
}

/* =========================
   3段目（セット）をPCで中央2カラムに固定
   ========================= */

/* 注: nth-of-type(5)(6) は、このグリッド内の .pg2-card の登場順
   （65W×2=1,2 / 100W×2=3,4 / セット×2=5,6）に対応しています。 */

/* =========================
   スマホは常に 2列×3段（2台1組）に
   ========================= */
@media (max-width: 991.98px){
  .prod-grid2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* どの見出しも2列ぶち抜き（ペアの上に来る） */
  .pg2-title{ grid-column: 1 / -1; }

  /* PC用の列固定はスマホでは解除（自然な並び：2列×3段） */
  .prod-grid2 .pg2-card:nth-of-type(5),
  .prod-grid2 .pg2-card:nth-of-type(6){ grid-column: auto; }
}




/* 0045 */
@media (max-width: 768px){
.ts-products .prod-row {
  display: flex;
  justify-content: center;   /* 全体を中央寄せ */
  gap: 40px;                 /* 左右のまとまりの間隔 → 必要に応じて 40px, 50px に縮小可能 */
  flex-wrap: wrap;           /* スマホでは自動で縦並び */
}
}

.ts-products .prod-group {
  flex: 1 1 400px;            /* 各まとまりの幅を制御 */
  max-width: 480px;
}

.ts-products .prod-items {
  display: flex;
  justify-content: center;
  gap: 24px;                  /* 白黒ペアの間隔を少し詰める */
  margin-top: 20px;

}
/* 置き換え：最小幅200px → 0 に */
.ts-products .prod-items{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));  /* ←常に2列を維持 */
  justify-content: center;
  column-gap: clamp(6px, 2vw, 20px) !important; /* ← 画面幅に応じて変化 */
  row-gap: clamp(20px, 4vw, 40px) !important;   /* ← 上下の余白も可変に */
  margin: 0 auto;
  max-width: 860px;
}
/* 202509152131  */
.ts-products .thumb-wrap {
  width: clamp(380px, 24vw, 540px);
  aspect-ratio: 4/3;
}


.ts-products .prod-thumb {
  width: 100%;
  height: 100%;
  object-fit: contain;  /*  contain →  prod-thumb   */
}
/* === 製品セクション内の見出しは全部「本文サイズ・非ボールド」に固定 === */
.section-trial-support .prod-grid h1,
.section-trial-support .prod-grid h2,
.section-trial-support .prod-grid h3,
.section-trial-support .prod-grid h4,
.section-trial-support .prod-grid h5,
.section-trial-support .prod-grid h6,
.section-trial-support .prod-grid2 h1,
.section-trial-support .prod-grid2 h2,
.section-trial-support .prod-grid2 h3,
.section-trial-support .prod-grid2 h4,
.section-trial-support .prod-grid2 h5,
.section-trial-support .prod-grid2 h6,
.section-trial-support .ts-products h1,
.section-trial-support .ts-products h2,
.section-trial-support .ts-products h3,
.section-trial-support .ts-products h4,
.section-trial-support .ts-products h5,
.section-trial-support .ts-products h6,
.section-trial-support .prod-name,
.section-trial-support .pg2-title {
  font-size: 1em !important;   /* 本文サイズ */
  font-weight: 600 !important;   /* ボールド解除 */
  line-height: 1.4 !important;
  margin: 4px 0 6px !important;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}
/* スマホは“2個×3段”固定＆画像を画面に収まるサイズへ */
@media (max-width: 768px){
  .ts-products .prod-items{
    grid-template-columns: repeat(2, minmax(0,1fr));  /* 念のため再指定 */
    column-gap: 12px;
    row-gap: 16px;
    max-width: none;                                  /* 横幅制限を外す */
  }
  .ts-products .thumb-wrap{
    width: min(44vw, 300px);  /* 画面幅の約半分まで。はみ出し防止 */
    aspect-ratio: 4 / 3;
    margin: 0 auto 8px;
  }
  .ts-products .prod-sku{
    font-size: 12px;
  }
}

/* このページだけで “rem=100px” を常に維持してジャンプを止める */
html { font-size: 625% !important; }           /* どの幅でも固定 */
















@media (min-width: 769px){
  .ts-products .prod-row{
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px 16px;
    align-items: start;
  }
  /* .prod-items の中身（.prod-card）を外側グリッドへ“直列”化 */
  .ts-products .prod-items{ display: contents; }
}


@media (min-width: 769px){
  /* 同じ行（.prod-row）に 6カードを2列で並べる */
  .ts-products .prod-row{
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px 16px;
    align-items: start;
  }
  /* 中間ラッパを“透過”させてカードを直に並べる */
  .ts-products .prod-group,
  .ts-products .prod-items{
    display: contents;
  }
  /* 念のため、カードの列固定が残っていても無効化 */
  .ts-products .prod-card{ grid-column: auto; }
}

@media (min-width: 769px){
  .ts-products .prod-row{
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px 16px;
    align-items: start;
  }
  .ts-products .prod-group,
  .ts-products .prod-items{ display: contents; }
}

/* === PCは 2列×3段。タイトルは各ペアの上で全幅に === */
@media (min-width: 769px){

  /* 6枚を同じグリッドに流し込む */
  .ts-products .prod-row{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: clamp(6px, 2vw, 20px) !important;
    row-gap: clamp(20px, 4vw, 40px) !important;   /* ← 上下の余白も可変に */
    justify-content: center !important;
    align-items: start !important;
  }

  /* 中間ラッパを透過（カードを直にグリッドへ） */
  .ts-products .prod-group,
  .ts-products .prod-items{
    display: contents !important;
  }

  /* 見出しは “行全幅” で必ずカードの上に来る */
  .ts-products .prod-title{
    grid-column: 1 / -1 !important;
    margin: 4px 0 6px !important;
    text-align: center !important;
    font-weight: 600 !important;
  }

  /* カードの位置指定はリセット（勝手な列固定を無効化） */
  .ts-products .prod-card{ grid-column: auto !important; margin: 0 !important; }

  /* 画像サイズを2列に適正化（大き過ぎによる間延びを防止） */
  .ts-products .thumb-wrap{
    width: 100% !important; 
    max-width: 300px !important; 
/*
    width: clamp(300px, 28vw, 320px) !important;  必要なら 240〜300 に調整
 */
    aspect-ratio: 4 / 3 !important;
    margin: 0 auto 8px !important; 
  }
  .ts-products .prod-thumb{
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  /* SKUの余白を控えめに */
  .ts-products .prod-sku{ margin: 4px 0 0 !important; }
}

@media (min-width: 769px){
  /* 見出しは必ず2列ぶち抜き＆カードの直上に来る */
  .ts-products .prod-title{
    grid-column: 1 / -1 !important;
    margin: 0 0 8px !important;   /* 下にだけ余白を入れる */
    text-align: center !important;
    font-weight: 600 !important;
  }

  /* 行間を少し調整：見出しとカードが詰まり過ぎないように */
  .ts-products .prod-row{
    row-gap: 32px !important;   /* 22px → 少し広げて整える */
  }

  /* 各カードの中のSKUテキスト余白も整える */
  .ts-products .prod-sku{
    margin:i 16px 0 0 !important;
    text-align: center !important;
  }
}

@media (min-width: 769px){
  /* 見出しは必ず2列ぶち抜き＆カードの直上に来る */
  .ts-products .prod-title{
    grid-column: 1 / -1 !important;
    margin: 0 0 8px !important;   /* 下にだけ余白を入れる */
    text-align: center !important;
    font-weight: 600 !important;
  }

  /* 行間を少し調整：見出しとカードが詰まり過ぎないように */
  .ts-products .prod-row{
    row-gap: 32px !important;   /* 22px → 少し広げて整える */
  }

  /* 各カードの中のSKUテキスト余白も整える */
  .ts-products .prod-sku{
    margin: 32px 0 0 !important;
    text-align: center !important;
  }
}


/* ===== PCの最終調整：余白と結びつき ===== */
@media (min-width: 769px){
  /* 横の空きが広すぎる → 列間を詰める */
  .ts-products .prod-row{
    column-gap: clamp(10px, 10%, 20px) !important;   /* 20〜24あたりが見やすい */
    row-gap: 45px !important;      /* 行間は控えめに（後述の見出し余白で区切る） */
  }

  /* 画像枠を少しだけ小さくして無駄な空きを減らす */
/*
  .ts-products .thumb-wrap{
    width: clamp(320px, 24vw, 330px) !important; 
  }
*/

  /* 見出しと“自分のペア”を強く結びつける（下は短く、上を広めに） */
  .ts-products .prod-title{
    grid-column: 1 / -1 !important;
    margin: 3px 0 6px !important; /* 上を広め、下は短め */
    text-align: center !important;
    font-weight: 600 !important;
  }
  .ts-products .prod-title:first-of-type{
    margin-top: 20 !important;      /* 先頭見出しだけ上余白をゼロに */
  }

  /* （任意）薄い仕切り線：2段目以降の見出しの“上”にだけ引く */
  .ts-products .prod-title:not(:first-of-type)::before{
    content:"";
    display:block;
    width: min(769px, 100%);
    height: 1px;
    background: #eaeaea;           /* ごく薄いグレー。濃いなら #ddd */
    margin: 20px auto 14px;        /* 線と見出しの上下余白 */
  }

  /* SKU の余白は控えめのまま */
  .ts-products .prod-sku{ margin: 16px 0 0 !important; }
}





/* ===== PC固定: 769px以上は常に 2列×3段 ===== */
@media (min-width: 769px){
  .ts-products .prod-row{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* ← 2列固定 */
    column-gap: 20px !important;  /* 横の間隔：お好みで 16–24px */
    row-gap: 28px !important;     /* 段間：24–32pxで微調整可 */
    justify-items: center !important;
    align-items: start !important;
  }

  /* 中間ラッパを透過して .prod-card を同一グリッドに載せる */
  .ts-products .prod-group,
  .ts-products .prod-items{
    display: contents !important;
  }

  /* 見出しは各ペアの上で全幅 */
  .ts-products .prod-title{
    grid-column: 1 / -1 !important;
    margin: 0 0 12px !important; /* タイトルと画像群の距離 */
    text-align: center !important;
    font-weight: 600 !important;
  }

  /* 画像は列幅に合わせて縮む（769px帯で落ちない上限） */
  .ts-products .thumb-wrap{
    width: 100% !important;
    max-width: 340px !important;  /* 769〜900px帯で確実に2列に収まる値      PC画面の大きめはここが担当*/
    aspect-ratio: 4/3 !important;
    margin: 0 !important;
  }
  .ts-products .prod-thumb{
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .ts-products .prod-card{ margin: 0 !important; grid-column: auto !important; }
  .ts-products .prod-sku{ margin: 6px 0 0 !important; text-align: center !important; }
}

/* 狭めPC帯だけさらに安全マージンを入れたい時はON（任意）
@media (min-width: 769px) and (max-width: 900px){
  .ts-products .thumb-wrap{ max-width: 240px !important; }
}
*/



/* PC: プルダウンの縦中央＆横中央 */
@media (min-width: 769px){
  .section-trial-support .wpcf7 select,
  .section-trial-support .wpcf7 .wpcf7-select{
    height: 44px;              /* 欲しい高さ */
    line-height: 44px;         /* ← 高さと一致させて縦中央 */
    padding: 0 48px 0 16px;    /* 上下0にするのが肝（右は▼ぶん余白） */
    text-align: center;        /* 横中央（各ブラウザ） */
    text-align-last: center;   /* 選択表示の中央寄せ */
    -webkit-appearance: none;
    appearance: none;
    background-position: right 12px center !important; /* 既存の矢印画像がある前提 */
  }
}