@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/

/*** リスト ***/
/* ハート */
.list-heart{
    list-style: none;
    padding: 0;
    margin: 0;
    padding-left: 2em; /* リスト全体を左側から2emの位置にインデント */
}
.list-heart li { 
    position: relative;
    margin: 0.5em 0 !important;
    padding-left: 1em; /* テキストを右に1emずらす（アイコンのスペースを確保） */
}
.list-heart li:before {
    font-family: FontAwesome;
    content: "\f004"; /* アイコン */
    color: #CE7A76; /* 色 */
    position: absolute;
    left: -1em; /* 元の位置から左に1emずらす */
}

/* 丸 */
.list-circle {
    list-style: none;
    padding: 0;
    margin: 0;
    padding-left: 2em; /* リスト全体を左側から2emの位置にインデント */
}
.list-circle li { 
    position: relative;
    margin: 0.5em 0 !important;
    padding-left: 1em; /* テキストを右に1emずらす（アイコンのスペースを確保） */
}
.list-circle li:before {
    font-family: FontAwesome;
    content: "\f111"; /* アイコン */
    color: #CE7A76; /* 色 */
    position: absolute;
    left: -1em; /* 元の位置から左に1emずらす */
}

/*********************************
 * ビートセイバーソートテーブル用
 *********************************/
        table {
            border-collapse: collapse;
            width: 100%;
        }
        th, td {
            border: 1px solid #dddddd;
            text-align: left;
            padding: 8px;
        }
        th {
            background-color: #f2f2f2;
            cursor: pointer;
        }
        th.sorted {
            background-color: #d3d3d3;
        }
        td.album-ost1 {
            background-color: #e6f7ff; /* Light blue */
        }
        td.album-ost2 {
            background-color: #e6ffe6; /* Light green */
        }
        td.album-ost3 {
            background-color: #fffbe6; /* Light yellow */
        }
        td.album-ost4 {
            background-color: #ffe6e6; /* Light pink */
        }
        td.album-ost5 {
            background-color: #f2e6ff; /* Light purple */
        }
        td.album-ost6 {
            background-color: #e6f2ff; /* Light cyan */
        }
        td.album-ost7 {
            background-color: #ffe6f7; /* Light magenta */
        }
        td.album-extras {
            background-color: #f0f0f0; /* Light grey */
        }
        td.album-camellia {
            background-color: #e6fffa; /* Light teal */
        }
        td.level-easy {
            background-color: #d9ffcc; /* Light green */
        }
        td.level-normal {
            background-color: #fff2cc; /* Light orange */
        }
        td.level-hard {
            background-color: #ffcccc; /* Light red */
        }
        td.level-expert {
            background-color: #e6ccff; /* Light purple */
        }
        td.level-expert-plus {
            background-color: #cccccc; /* Light grey */
        }
        .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
            overflow: auto;
            width: 100%;
        }

/*********************************
 * シンセライダーズテーブル用
 *********************************/
	  .synth-table {
		width: 100%;
		border-collapse: collapse;
	  }
	  .synth-table th {
		background-color: #FFAEAE;
		border: 1px solid #888888;
		padding: 8px;
		text-align: center;
	  }
	  .synth-table td {
		border: 1px solid #888888;
		padding: 8px;
	  }



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

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

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