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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.main{
    background-color: #1d2327;
}
.a-wrap {
    color: #e5e7eb;
}
.article {
    width: 700px;
    margin: 0 auto;
}

/* サイドバーの背景色を変える */
#sidebar {
  background-color: #1d2327;
}
*/
/* .sidebar 内の h3 をバッジ風に
.sidebar h3 {
  display: inline-block;
  color: #9ca3af;                     
  background: #1d2327;     
  padding: 0.1em 0.6em;      
  line-height: 1.2;
  transition: 
    color 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease;
}
*/
/* メニュー項目：控えめな丸・小文字・余白あり 
.menu-item a {
  display: inline-block;             
  border: 1px solid #9ca3af;  
  color: #9ca3af !important;    
  background: #1d2327;      
  border-radius: 6px;     
  padding: 0.01em 0.6em;    
  font-size: 0.8rem;    
  line-height: 1.3;
  margin: 4px;          
  transition: 
    color 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease;
  cursor: pointer;         
}
*/
/* ホバー（およびフォーカス）時の色変化 */
/*
.menu-item:hover,
.menu-item:focus-visible {
  color: #e5e7eb;               
  background: #22282d;         
  border-color: #cbd5e1;         
  outline: none;
}
*/
.navi-menu-content {
  background-color: #1d2327;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
.article {
    width: 500px;
    margin: 0 auto;
}

}

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

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

}