/* accessory table(acce) */

  /* html,body の規定は無用。種制御はLinage_main.cssに移管 */
  /* ページ全体色のみ解禁 */
body {
  background-color:#fdf9fb;
}
  /* page_body の規定は共通css(Linage_main.css)に移管 */

  /* header の規定は共通css(Linage_main.css)に移管 */


h2 {
    text-align: left;
    margin: 0 0 2px 18px;
    font-size: 1.2em;
  }

  .table_box_acce{
    flex: 1 1 auto; /* ← header の高さを自動で差し引いて残りを占有 */
    min-height: 0; /* ← これが重要 */
    overflow: auto; /* ← ここでスクロールを閉じ込める */
    position: relative;
  }

  /* 800px 以上では横スクロールを消す */
  @media (min-width: 800px) {
    .main-toggle {
        position: static;
    }
  }

  table {
    font-size: 12px;
  }

  thead.sticky_acce {
    position: sticky;
    top: 0;
    z-index: 1000; /* 背景レイヤの ::before より前面 */
    height: 50px; /* sticky基準の安定化 */
    /*background-color: #fec; /* stickyには明示的背景必須、透明だとスクロールしてくるBodyが重なって見える */
    background-color: transparent; /* stickyには明示的背景必須、透明だとスクロールしてくるBodyが重なって見える */
  }
  .sticky_acce {
    position: sticky;
    top: 0;
    left: 0;
  }
  .sticky_acce::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		/* border-topまたはbottomの一方にしないと現状は隙間ができるように見える。 */
    border-top: 3px solid #c9b7d0;
    /* border-bottom: 1px solid #888; */
    background-color: #c9b7d0;
    background-clip: padding-box;
    z-index: -1;
  }
/**/
  th {
    height:24px;
    text-align: center;
    font-weight: normal;
    border: 4px solid #c9b7d0;
    background-color: #f7f1fa;
  }
  td {
    height:24px;
    text-align: center;
    font-weight: normal;
    margin: 1px;
    padding: 3px 6px;
    font-size:small;
    border: 4px solid #c9b7d0;
  }
    /* page_body に対して sticky2 になる */
    /* (sticky1=thead) */
  thead.sticky th {
    background-image:
    linear-gradient(#c9b7d0, #c9b7d0), /* 上の線 */
    linear-gradient(#c9b7d0, #c9b7d0); /* 下の線 */

    background-repeat: no-repeat, no-repeat;

    background-position:
      left top,        /* 上の線 */
      left bottom;     /* 下の線 */

    background-size:
      100% 1px,
      100% 1px;
    background-color: #f7f1fa;
  }
  .sticky_acce td {
    height:24px;
    text-align: center;
    font-weight: normal;
    margin: 1px;
    padding: 3px 6px;
    font-size:small;
    outline: 3px solid #c9b7d0;
    background-color: #f7f1fa;
  }
  
  .Item_No {
    width: 60px;
    border-left: 1px solid #c9b7d0;
    border-right: 1px solid #c9b7d0;
  }
  .Search_Drop {
    width: 320px;
    border-left: 1px solid #c9b7d0;
    border-right: 1px solid #c9b7d0;
  }
  tbody.acce {
    font-weight: normal;
    padding: 6px 8px;
  }

  .description_acce {
    text-align: left;
  }
  .Item_No_odd_acce {
    background-color: #f7f1fa;
  }
  .Not_applicable {
    background-color: #ddd;
  }

  .subnav-toggle {
      width: 100%;
      padding: 0px;
      margin: 2px;
      line-height: 30px;
      background: #5c430d;
      background-image: linear-gradient(90deg,  #8f5940,#472d2d,#2c101c,#3f323e, #fdf9fb);
      color: #fdf9fb;
      text-align: center;
      font-weight: bold;
      font-size: 1em;
      display: flex;
      align-items: center;
      justify-content: center;
      user-select: none;
  }

      .nav-group_acce {
        margin: 0;
        padding: 0;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        /*vertical-align: auto;*/
        zoom: 1;
        font-size: 0.9em;
        /*display: inline;*/
    }

    .nav-group_acce>li {
        margin: 0;
        padding: 0 6px;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        /*vertical-align: auto;*/
        zoom: 1;
        /*display: inline;*/
    }

    .nav-group_acce>li a {
        display: block;
        padding: 6px 6px;
        color: #548;
        text-decoration: none;
    }

    .nav-group_acce li a:hover {
        color: #75e;
        font-weight:bold;
    }

    .nav-group_acce>li a:active {
        border-bottom: #86f solid 3px;
        color: #86f;
    }

    /* アクセサリー サブナビゲーション 8項目 */
    body.crest .nav-group_acce a.crest,
    body.insig .nav-group_acce a.insig,
    body.ear   .nav-group_acce a.ear,
    body.pend1 .nav-group_acce a.pend1,
    body.pend2 .nav-group_acce a.pend2,
    body.brace .nav-group_acce a.brace,
    body.ring1 .nav-group_acce a.ring1,
    body.ring2 .nav-group_acce a.ring2 {
        background-color:#fdf9fb;
        border-bottom: #86f solid 2px;
        color: #97f;
    }