@charset "utf-8";
/* ==========================================================
   商品ガイド用（抜ける転写紙・プレス機・関連商品ページ）
   2026-10-23 追加。class名はすべて ig- で始まります
   ========================================================== */

/* 生地・用途から選ぶ表 */
#main table.ig-pick th{width:auto;}
#main table.ig-pick td:last-child{width:34%;font-weight:700;white-space:nowrap;}
#main .ig-note{font-size:13px;color:#555;}

/* プレス機ページ上部：バッジ画像を横並びに */
#main .ig-badges{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px;}
#main .ig-badges > img{flex:0 0 210px;}
#main .ig-badges > a{flex:1 1 200px;}
#main .ig-badges img{display:block;width:100%;height:auto;margin:0;}
#main .ig-lead{font-size:15px;font-weight:700;color:#222;}

/* 強み3つ */
#main .ig-points{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 7px 10px;padding:0;list-style:none;}
#main .ig-points li{background:#f5fbff;border:1px solid #cde8f7;border-radius:8px;padding:8px 10px;font-size:13px;line-height:1.6;color:#444;}
#main .ig-points li b{display:block;font-size:14px;color:#06c;margin-bottom:2px;}

/* ページ内リンクのボタン */
#main .ig-jump{display:flex;flex-wrap:wrap;gap:6px;}
#main .ig-jump a{display:inline-block;padding:6px 14px;border-radius:999px;background:#06f;color:#fff;font-weight:700;font-size:13px;text-decoration:none;}
#main .ig-jump a:hover{opacity:.85;}

/* 縦長のショート動画を横に並べる */
#main .ig-shorts{display:flex;flex-wrap:wrap;gap:10px;margin:5px 7px;}
#main .ig-shorts .ig-short{--video-width:220px;aspect-ratio:9 / 16;padding-top:0;margin:0;}
#main .ig-bnrs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}

/* 関連商品は本体より小さめのカードで一覧に */
#main .ig-acc{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-bottom:10px;}
#main .ig-acc > section.box{margin-bottom:0;padding:8px;}
#main .ig-acc img{display:block;width:100%;max-width:150px;height:auto;margin:4px auto;}
#main .ig-acc p{font-size:13px;line-height:1.6;}
#main .ig-acc .para{font-size:14px;}

@media screen and (max-width:768px){
  #main .ig-points{grid-template-columns:1fr;}
  #main table.ig-pick td:last-child{white-space:normal;}
  #main .ig-acc{grid-template-columns:1fr 1fr;}
  #main .ig-acc img{max-width:120px;}
}

/* ---------- 2026-10-23 第3弾 追加 ---------- */

/* 商品カード（タイプ別の違い・全面プリント転写紙の注文） */
#main .ig-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:8px 0;}
#main .ig-card{display:flex;flex-direction:column;border:1px solid #cde8f7;border-radius:8px;background:#fff;overflow:hidden;}
#main .ig-card > a:first-child img{display:block;width:100%;height:auto;aspect-ratio:370 / 278;object-fit:cover;margin:0;}
#main .ig-card p{padding:0 10px;}
#main .ig-card .ig-card-name{margin-top:8px;font-size:16px;font-weight:700;line-height:1.4;}
#main .ig-card .ig-card-name a{color:#06c;text-decoration:none;}
#main .ig-card .ig-card-tag{display:inline-block;align-self:flex-start;margin:4px 10px 6px;padding:2px 10px;border-radius:999px;background:#ffef8a;font-size:12px;font-weight:700;color:#333;}
#main .ig-card-spec{list-style:none;margin:0;padding:0 10px;font-size:13px;line-height:1.6;color:#444;}
#main .ig-card-spec li{padding:4px 0;border-top:1px dotted #cde8f7;}
#main .ig-card-spec b{display:inline-block;min-width:3.5em;margin-right:4px;color:#06c;}
#main .ig-card .ig-card-price{margin-top:6px;font-size:15px;font-weight:700;color:#e33;}
#main .ig-card-btn{display:block;margin:auto 10px 10px;padding:8px 10px;border-radius:999px;background:#06f;color:#fff;font-weight:700;font-size:14px;text-align:center;text-decoration:none;}
#main .ig-card .ig-card-spec + .ig-card-btn{margin-top:10px;}
#main .ig-card-btn:hover{opacity:.85;}

/* 名前の見かた */
#main table.ig-names th{width:110px;}
#main table.ig-names td{padding:8px 14px;}

/* ペイスターの機材と手順 */
#main .ig-equip{display:flex;gap:12px;align-items:flex-start;margin:5px 7px 10px;}
#main .ig-equip > a{flex:0 0 220px;}
#main .ig-equip img{display:block;width:100%;height:auto;border-radius:6px;margin:0;}
#main .ig-equip p{padding:0 0 4px;}
#main .ig-list{margin:4px 0 0 1.2em;padding:0;font-size:14px;line-height:1.8;}
#main .ig-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;list-style:none;margin:5px 7px 10px;padding:0;}
#main .ig-steps li{background:#f5fbff;border:1px solid #cde8f7;border-radius:8px;padding:8px;font-size:13px;line-height:1.6;color:#444;}
#main .ig-steps img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;border-radius:4px;margin:0 0 6px;}
#main .ig-steps b{display:block;font-size:14px;color:#06c;margin-bottom:2px;}

/* 修理・1年保証（縦長の画像を文章と横並びに） */
#main .ig-repair{display:flex;gap:12px;align-items:flex-start;}
#main .ig-repair > a{flex:0 0 160px;}
#main .ig-repair img{display:block;width:100%;height:auto;margin:0;}
#main .ig-repair p{padding:0;}

@media screen and (max-width:768px){
  #main .ig-cards{grid-template-columns:1fr 1fr;gap:8px;}
  #main .ig-equip{flex-direction:column;}
  #main .ig-equip > a{flex:none;width:100%;}
  #main .ig-steps{grid-template-columns:1fr 1fr;}
  #main .ig-badges > img{flex:0 0 160px;}
}
@media screen and (max-width:480px){
  #main .ig-cards{grid-template-columns:1fr;}
  #main .ig-repair > a{flex-basis:110px;}
}

/* ---------- 2026-10-23 第4弾：作り方の対比表 ---------- */
#main table.ig-flow{width:calc(100% - 14px);margin:6px 7px 6px;border-collapse:separate;border-spacing:6px;table-layout:fixed;}
#main table.ig-flow th,#main table.ig-flow td{vertical-align:top;padding:8px;border-radius:8px;font-size:13px;line-height:1.6;color:#444;}
#main table.ig-flow th.ig-flow-step{width:64px;background:#06f;color:#fff;font-size:14px;text-align:center;vertical-align:middle;}
#main table.ig-flow tr:first-child th{background:#eef6ff;color:#06c;font-size:15px;text-align:center;}
#main table.ig-flow tr:first-child th.ig-flow-step{background:#06f;color:#fff;}
#main table.ig-flow tr:first-child th.ig-flow-paster{background:#fff1d6;color:#c60;}
#main table.ig-flow th small{display:block;font-size:12px;font-weight:400;color:#666;}
#main table.ig-flow td{background:#f5fbff;border:1px solid #cde8f7;}
#main table.ig-flow td.ig-flow-hl{background:#fff8e8;border-color:#f5c26b;}
#main table.ig-flow td.ig-flow-same{background:#f7f7f7;border-color:#e3e3e3;}
#main table.ig-flow img{display:block;width:100%;height:auto;aspect-ratio:3 / 2;object-fit:cover;border-radius:4px;margin:0 0 6px;}
#main table.ig-flow td.ig-flow-same img{float:left;width:160px;margin:0 10px 0 0;}
#main table.ig-flow b{display:block;font-size:14px;color:#222;margin-bottom:2px;}
#main .ig-flow-two{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
#main .ig-flow-two span{display:block;}
#main .ig-flow-time{margin:6px 0 0;padding:4px 8px !important;border-radius:999px;background:#fff;font-weight:700;color:#e33;text-align:center;}
#main .ig-flow-hl .ig-flow-time{background:#e33;color:#fff;}
@media screen and (max-width:768px){
  #main table.ig-flow{border-spacing:3px;}
  #main table.ig-flow th.ig-flow-step{width:40px;font-size:12px;padding:4px;}
  #main table.ig-flow th,#main table.ig-flow td{padding:5px;font-size:12px;}
  #main .ig-flow-two{grid-template-columns:1fr;}
  #main table.ig-flow td.ig-flow-same img{float:none;width:100%;margin:0 0 6px;}
}
