@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

.cocoon-custom-text-1{
color: white;
}

.cocoon-custom-text-2{
color: whitesmoke;
}

/* 表で文字を折り返さず1行で表示 */
.scroll-table {
	white-space: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

/* 表「layout-table」のデザイン変更 */
/* 表「layout-table」のデザイン変更 */
table.layout-table{
  table-layout: fixed;
  text-align: center;                 /* 各セル内の文字の横位置 */
  min-width: 960px;                   /* 列数に応じて調整（横スクロール発火用） */
  border-collapse: separate;          /* stickyと相性よくする */
  border-spacing: 0;
}

/* --- ヘッダー固定にする場合（thead推奨。theadが無ければ tr:first-child の th/td に適用） --- */
table.layout-table thead th{
  position: sticky;
  top: 0;
  z-index: 30;
  background: #f4f4f4;
}

/* 1列目（ヘッダー/ボディ両方）を左固定 */
table.layout-table th:first-child,
table.layout-table td:first-child{
  position: sticky;
  left: 0;                            /* ← これが必須 */
  z-index: 20;                        /* ヘッダーより低め */
  width: 95px;                        /* 列幅 */
  min-width: 95px;
  max-width: 95px;
  background: #698966;                /* 背景色 */
  color: whitesmoke;
  box-shadow: 2px 0 0 rgba(0,0,0,.06);/* 固定境界の見切れ対策（任意） */
  background-clip: padding-box;       /* ボーダーにじみ防止（任意） */
}

/* 左上の交差セル（ヘッダーかつ1列目）はさらに前面に */
table.layout-table thead th:first-child{
  z-index: 40;
}

/* 2列目以降のセル */
table.layout-table td:nth-child(n+2){
  width: 100px;                       /* 列幅 */
  background: #f4f4f4;                /* 背景色 */
}

/* thead を使わず「1行目がヘッダー」の場合の見た目だけ保持したいなら */
table.layout-table tr:first-child{
  background: #f4f4f4;
}

/* （任意）縞々行のとき固定列の背景も合わせる */
table.layout-table tbody tr:nth-child(odd) td:first-child{ background:#698966; }
table.layout-table tbody tr:nth-child(even) td:first-child{ background:#698966; }