@charset "utf-8";
/* position: stickyを使いcssのみで、セルを固定したテーブル(table要素)を実装してみる。
 https://web.archive.org/web/20190615233500/https://sasayoshi.com/sticky-table/ */

.ta4 {
  line-height: 1.8;
  text-align: center;
  white-space: nowrap;
  border: none;
  margin: 0;
  padding: 0;
}

.ta4 td,
.ta4 th {
  border: none;
  padding: 2px 5px;
}

.ta4 tbody th {
  text-align: right;
  font-size: 1.4rem;
}

.ta4 tr:nth-child(even) {
  background: #f9f9f9;
}

.ta4 tr:hover {
  background: #acf2ac;
}

/*画面幅650px以下の設定*/
@media screen and (max-width:650px) {
  .ta4 tbody th {
    font-size: 1.2rem;
  }
}

/*tableの見た目のスタイル*/
.table {
  display: table;
  width: 100%;
  border-collapse: separate !important;
}

.table tr {
  display: table-row;
}

.table th,
.table td {
  border-right: 1px solid #6a6a6a;
  border-bottom: 1px solid #6a6a6a;
  display: table-cell;
  white-space: nowrap;
}

.table th:last-child,
.table td:last-child {
  border-right: none;
}

.table thead {
  display: table-header-group;
}

.table tbody {
  display: table-row-group;
}

.table tbody tr:last-child th,
.table tbody tr:last-child td {
  border-bottom: none;
}

.table tbody tr:nth-child(2) {
  /* レア度★の大きさ調整 */
  font-size: 1.2rem;
}

/*レスポンシブなテーブルのためのスタイル*/
.table-responsive {
  display: block;
  width: 99%;
  max-width: 750px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  border: 1px solid #6a6a6a;
  margin: 21px 0;
}

/*テーブルの左側を固定するためのスタイル*/
.table-sticky.sticky-left thead .blank,
.table-sticky.sticky-left tbody th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
}

/*マイコンビニ 陳列台デコ レベル別設置上限数  level-release-displaystanddeco*/
/*table2の見た目のスタイル*/
.table2 {
  display: table;
  border-collapse: separate !important;
  border: none !important;
}

.table2 tr {
  display: table-row;
}

.table2 th,
.table2 td {
  border-right: 1px solid #6a6a6a;
  border-bottom: 1px solid #6a6a6a;
  border-left: 0px;
  border-top: 0px;
  display: table-cell;
  white-space: nowrap;
}

.table2 th:first-child,
.table2 td:first-child {
  border-left: 1px solid #6a6a6a;
}

.table2 thead tr:first-child th {
  border-top: 1px solid #6a6a6a;
}

.table2 thead {
  display: table-header-group;
}

.table2 tbody {
  display: table-row-group;
}

/*テーブルのヘッダーを固定するためのスタイル*/
.table2-sticky.sticky-top thead th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}