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

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

/*必要ならばここにコードを書く*/

/** サイトタイトルの文字の大きさ **/
.site-name-text{
font-size: 40px;
font-family: 'HG', serif;
}

/** ヘッダータイトルを非表示にする **/
.site-name-text {
display: none;
}


/*ウィジェットタイトル・背景*/
#sidebar .widget-sidebar-title{
background: #e9e9e9; /*背景色*/
color: #666; /*文字色*/
font-family: 'HG';
padding-left: 20px;	
padding-bottom: 7px;
}

/*** 目次 ***/
.toc {
  display: block;
  color: #000;
  padding: 20px 20px 20px 20px;
  max-width: 600px;
  border: 1.2px #a9a9a9 solid !important;
 }


/** 目次のジャンプ位置の位置調整 **/
span[id^="toc"] {
padding-top: 2.5em;  /* 数値変更で調整可能 */
}

/*** 見出し ***/

.article h1 {
color: #444;
font-size: 28px;
margin-top: 30px;
margin-bottom: 30px;
margin-left : 10px
margin-right : 10px
}


.article h2 {
font-size: 25px;
color: #333;
border: none;
background-color: #f1f1f1;	
padding-top: 20px;	
padding-bottom: 15px;
margin-top : 40px;
margin-bottom : 20px;	
}

.article h3 {
font-size : 24px;
color : #222;
background-color: #fff;	
border-color : #cc3300;
border-width : 1px;	
border-top: none;
border-right: none;
border-left: none;
padding-top: 20px;
padding-bottom : 10px;
padding-left: 20px;
margin-top :30px;
margin-bottom : 30px;	
}

.article h4 {
color : #222;
font-size : 22px;
border: none;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom : 20px;	
}


.article h5 {
border: none;
padding: 0;
}
.article h6 {
border: none;
padding: 0;
}

/******* リストの間隔 *********/

ul li, ol li {
padding-top:5px;
padding-bottom:5px;
line-height:1.8;}


/******* box *********/

.a-waku1{
 padding-top : 10px;
 padding-left : 10px;
 padding-right : 10px;
 padding-bottom : 10px;
 border : 1px solid silver;
 margin-top : 20px;
 margin-bottom : 10px;
 line-height : 1.7;
}

.a-waku1-r{
 padding-top : 10px;
 padding-left : 10px;
 padding-right : 10px;
 padding-bottom : 10px;
 border-width : 1px;
 border-style : solid;
 border-color : silver;
 border-top-left-radius : 5px 5px;
 border-top-right-radius : 5px 5px;
 border-bottom-right-radius : 5px 5px;
 border-bottom-left-radius : 5px 5px;
 margin-top : 20px;
 margin-bottom : 20px;
}


/********** アイキャッチ画像非表示 **********/

.cat-label {display:none}


/****** 引用の背景を白にする ******/
blockquote {
    background-color: #fff;
}


/***** メニューバー内のメニューにマウスオーバー時の変化 *****/
.navi-in a:hover {
  /* 文字の色を変更 */
  color: #999  ;

  /* 文字の太さを変更 */
  font-weight: bold;

  /* 文字のサイズを変更 */
  font-size: 18px;

  /* 背景色を変更 */
  background-color: #e9e9e9;

  /* 背景色の透過率を変更 */
  opacity: 0.8;
}


/***** X (Twitter) 埋め込みを中央寄せにする *****/

.twitter-tweet {
    margin-left: auto !important;
    margin-right: auto !important;
}

/***** YouTubeを中央寄せにする *****/

.youtube-wrap {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding-bottom: 56.25%;
    height: 0;
}

.youtube-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.youtube-wrap iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}


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

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

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