
/* ========================================= 
タブレット・スマホで見た際のメニュー部分の見た目を変更 
========================================= */

/* コンテナ */
.theme-responsive-menu-container {
  position: relative !important;
  width: 40px !important;
  height: 46px !important; /* 少し高さ増やす */
}

/* ハンバーガー（下に下げる） */
.theme-burger-icon {
  background: transparent !important;
  width: 28px !important;
  height: 20px !important;
  display: inline-block !important;
  position: absolute !important;
  top: 1px !important;  /* ←間隔広げるポイント */
  left: 6px !important;
  border: none !important;
}

/* 線 */
.theme-burger-icon span {
  display: none !important;
}

.theme-burger-icon::before,
.theme-burger-icon::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  width: 28px !important;
  height: 2px !important;
  background: #222 !important;
}

.theme-burger-icon::before {
  top: 4px !important;
}

.theme-burger-icon::after {
  top: 12px !important;
}

/* MENU（上＋太字） */
.theme-responsive-menu-container::after {
  content: "MENU";
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 10px;
  font-weight: 700;   /* ←太字 */
  letter-spacing: 0.12em;
  color: #333;
}

/* =========================================
  Home ページ
　Manual+Partslistの各製品画像をPC3列・タブレット2列・スマホ1列
========================================= */
/* PC：3列 */
@media (min-width: 1025px) {
  .partslist-grid {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .partslist-grid > .zpelem-col {
    width: 33.3333% !important;
    max-width: 33.3333% !important;
    flex: 0 0 33.3333% !important;
    box-sizing: border-box !important;
  }
}

/* タブレット：2列 */
@media (min-width: 768px) and (max-width: 1024px) {
  .partslist-grid {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .partslist-grid > .zpelem-col {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
    box-sizing: border-box !important;
  }
}


/* ========================================= 
Manual (Option) 掲載ページ
・PC/SP/Tabletで2列で表示させる
========================================= */
/* ===== Manual Option：SP/Tabletで2列 ===== */
@media (max-width: 1024px) {
  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"],
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"],
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"],
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] > .zpelem-col,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] > .zpelem-col,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] > .zpelem-col,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] > .zpelem-col {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
    float: none !important;
    box-sizing: border-box !important;
  }
}

/* ===== 各アイコン行を「アイコン + 文字」の1列にする ===== */
@media (max-width: 1024px) {
  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpelem-iconheading,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpelem-iconheading,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpelem-iconheading,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpelem-iconheading {
    display: block !important;
    width: 100% !important;
    margin-bottom: 10px !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-container,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-container,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-container,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-container {
    display: grid !important;
    grid-template-columns: 14px 1fr !important;
    column-gap: 8px !important;
    align-items: start !important;
    justify-content: start !important;
    width: 100% !important;
    text-align: left !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon {
    width: 14px !important;
    min-width: 14px !important;
    margin: 2px 0 0 0 !important;
    display: block !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon svg,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon svg,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon svg,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon svg {
    width: 14px !important;
    height: 14px !important;
    display: block !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-heading,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-heading,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-heading,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-heading {
    margin: 0 !important;
    text-align: left !important;
    line-height: 1.5 !important;
    font-size: 14px !important;
    display: block !important;
    width: auto !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-heading span,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-heading span,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-heading span,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-heading span {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  /* Zohoの中央寄せ解除 */
  .zpicon-align-mobile-center,
  .zpicon-align-tablet-center {
    text-align: left !important;
  }
}

/* ===== スマホは少しだけ小さく ===== */
@media (max-width: 767px) {
  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-container,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-container,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-container,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-container {
    grid-template-columns: 12px 1fr !important;
    column-gap: 6px !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon,
  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon svg,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon svg,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon svg,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon svg {
    width: 12px !important;
    height: 12px !important;
    min-width: 12px !important;
  }

  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-heading,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-heading,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-heading,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-heading,
  [data-element-id="elm_ZKANGrfYIp06gGc65h_Vpg"] .zpicon-heading span,
  [data-element-id="elm_trEjTvCr7SK7pTm7A8D96Q"] .zpicon-heading span,
  [data-element-id="elm_HD8u_JkqjHO1ak0rYincWQ"] .zpicon-heading span,
  [data-element-id="elm_OsQhsM6IQfv2IN-KDJzWkw"] .zpicon-heading span {
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
}

/* ========================================= 
Manual+Partslist　機械一覧ページ
スマホ・タブレットで2画像づつ配置
========================================= */
@media (max-width: 1024px) {

  /* Single-head（1段目・2段目） */
  [data-element-id="elm_lS9sjL02zEXesrzb14qtMg"] > .zpelem-col,
  [data-element-id="elm_2STc2OaBxa1aOEdEca61gQ"] > .zpelem-col,

  /* Multi-head Cylinder のカード行 */
  [data-element-id="elm_J80bW9WWK_Ft_dwVQr4xNA"] > .zpelem-col,

  /* Multi-head Flat のカード行 */
  [data-element-id="elm_mG2vUUALD_epnf5IMr50WA"] > .zpelem-col,

  /* Special machine（1つ目のセット） */
  [data-element-id="elm_sQ-QcBJEQFIcofKSJDsiAA"] > .zpelem-col,

  /* Special machine（2つ目のセット） */
  [data-element-id="elm_kuNQykNPiNj0Ug9-0RdbHQ"] > .zpelem-col
  {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
    float: none !important;       /* Zohoのfloat指定を殺す */
    box-sizing: border-box !important;
  }

  /* 画像ははみ出さないように */
  #manual .zpelem-image img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }
}

/* =========================================
   Tajima Customer Sites - 機種別　Manual layout
   スマホ・タブレット共通
   ・Manual内の一覧を2列表示
   ・アイコン＋文字を横並び
   ・文字数に依存しにくい表示
========================================= */

@media (max-width: 1024px) {

  /* -----------------------------------------
     0) Manual見出し下の「単独1件」
     （安全に使用するために / For Safe Use）
     ※ この部分は一覧rowと別構造なので個別指定
  ----------------------------------------- */
  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"],
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    box-sizing: border-box !important;
    padding: 0 14px !important;
    margin: 0 !important;
  }

  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"] .zpicon-container,
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] .zpicon-container {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    align-items: center !important;
    justify-content: start !important;
    width: 100% !important;
    text-align: left !important;
  }

  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"] .zpicon-anchor,
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] .zpicon-anchor,
  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"] .zpicon,
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] .zpicon {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    display: block !important;
  }

  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"] .zpicon svg,
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] .zpicon svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
  }

  /* -----------------------------------------
     1) 一覧row共通
     3カラム構造をフラット化して2列に
     ※ Manual内の zprow-equalCol を対象
  ----------------------------------------- */
  .page-container .zprow.zprow-equalCol {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    row-gap: 10px !important;
  }

  /* 中間columnをフラット化 */
  .page-container .zprow.zprow-equalCol > .zpelem-col {
    display: contents !important;
  }

  /* 一覧内の各iconHeadingを2列化 */
  .page-container .zprow.zprow-equalCol .zpelem-iconheading {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
    display: block !important;
    box-sizing: border-box !important;
    padding: 0 14px !important;
    margin: 0 !important;
    align-self: flex-start !important;
  }

  /* -----------------------------------------
     2) 空カラムは非表示
     Zohoの3列目の空欄対策
  ----------------------------------------- */
  .page-container .zprow.zprow-equalCol > .zpelem-col:empty {
    display: none !important;
  }

  /* 念のため既知の空カラムも消す */
  [data-element-id="elm_0E-FLZrogPc4kmsguRYPlw"],
  [data-element-id="elm_4SeUpBHH6KDWJl_rbX5IpA"],
  [data-element-id="elm_Xjgd5O0n2CtnRRm5PpVqPg"] {
    display: none !important;
  }

  /* -----------------------------------------
     3) iconHeadingの見え方共通
  ----------------------------------------- */
  .page-container .zpelem-iconheading .zpicon-container {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    align-items: start !important;
    justify-content: start !important;
    width: 100% !important;
    text-align: left !important;
  }

  .page-container .zpelem-iconheading .zpicon-anchor,
  .page-container .zpelem-iconheading .zpicon {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    display: block !important;
  }

  .page-container .zpelem-iconheading .zpicon svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
  }

  .page-container .zpelem-iconheading .zpicon-heading,
  .page-container .zpelem-iconheading .zpicon-heading span,
  .page-container .zpelem-iconheading .zpicon-heading a {
    margin: 0 !important;
    min-width: 0 !important;
    text-align: left !important;
    line-height: 1.45 !important;
    font-size: 13px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* Zohoの中央寄せ解除 */
  .page-container .zpelem-iconheading .zpicon-align-mobile-center,
  .page-container .zpelem-iconheading .zpicon-align-tablet-center {
    text-align: left !important;
    justify-content: flex-start !important;
  }

  /* -----------------------------------------
     4) dividerText（日本語 / English）の安定化
  ----------------------------------------- */
  .page-container .zpelem-dividertext .zpdivider-common {
    font-size: 13px !important;
    line-height: 1.2 !important;
  }
    
    /* -----------------------------------------
     5)順番指定
  ----------------------------------------- */  
    @media (max-width: 1024px) {
  /* ===== TMEZ-SC 日本語 ===== */
  [data-element-id="elm_aibVliMVQ0R9KX-04OR9pQ"] { order: 1 !important; } /* 基礎知識 */
  [data-element-id="elm_cQjnkstvLkEchf6oqSWypQ"] { order: 2 !important; } /* 操作マニュアル */
  [data-element-id="elm_zR9g715n3tHZqS4_U2IqiA"] { order: 3 !important; } /* クイックガイド */
  [data-element-id="elm_M27lU9yYe4Kbjx8FP1Q5GA"] { order: 4 !important; } /* 枠の交換方法 */
  [data-element-id="elm_DwPS_kQIsJKxbWIt1IOfMA"] { order: 5 !important; } /* ゴルフバッグ */
  [data-element-id="elm_FtI2s1gQJTjfppzr9GQaBg"] { order: 6 !important; } /* X拡張 */

  /* ===== TMEZ-SC 英語 ===== */
  [data-element-id="elm_t8-Es8lK-oQty2ZSADI9kQ"] { order: 1 !important; }
  [data-element-id="elm_Pw9n8vJJjqwcu6RBQtBVVg"] { order: 2 !important; }
  [data-element-id="elm_q98nHnJrVLCV-kr706a11A"] { order: 3 !important; }
  [data-element-id="elm_Lo9QW86AC8Lzt4Y3ouZFfQ"] { order: 4 !important; }
  [data-element-id="elm_2-JFbR5MV5LUqIn53aKHCw"] { order: 5 !important; }
  [data-element-id="elm_LJwynyGt16ZhQuPgg9DgvA"] { order: 6 !important; }
}

  /* -----------------------------------------
     6) 1件だけの行を少しだけ一覧と馴染ませる
     （必要に応じて微調整）
  ----------------------------------------- */
  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"],
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] {
    margin-left: 0 !important;
  }
}

  /* =========================
     1件表示を左列幅の1カラムグリッドにする
  ========================= */
@media (max-width: 1024px) {

  /* 1件表示は手動で左位置を合わせる */
  [data-element-id="elm_cjL40nY7TrIl6n-LmNa6Bg"],
  [data-element-id="elm_eRw0YL0Rxr9WQexDSz-HBQ"] {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin-left: -px !important;   /* ←ここで左に寄せる */
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

