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

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

/**目次**/
.toc {
  display: block;
  padding: 0px;
  max-width: 400px;
  border: 1.2px #6ec4db solid !important;
  font-family: 'Noto Sans JP', sans-serif;
}
#toc {
   margin-bottom: 10em;
}
.toc-title {
  position: relative;
  padding: 10px 0;
  background: #86cfcf;
  color: #fff;
  font-weight: bold;
}
.toc .toc-content {
  padding: 15px 20px;
  background-color: #ffffff;
}
.toc-list > li li a {
  font-weight: normal;
  font-size: 95%;
  color: #708090;
  margin-left: -10px;
}
.toc-list > li li ::before {
  content: '';
  width: 5px;
  height: 5px;
  display: inline-block;
  left: -15px;
  border-radius: 100%;
  background: #cdcdcd;
  position: relative;
  margin-bottom: 2px;
}
.article .toc-list > li li {
  list-style: none;
}
/**埋込みをセンター揃え**/
.video-container, 
.instagram-container, 
.facebook-container,
.twitter-tweet {
    margin: 30px auto;
}
/* アピールエリアの最小高さを解除 */
.appeal .appeal-in {
  min-height: unset;
}

/* アピールエリアの画像比率に合わせ画面いっぱいに表示 */
.appeal {
  aspect-ratio: 1920 / 800;
  background-size: contain;
}
/*マウスオーバー時のメニューの色を変更*/
#navi .navi-in a:hover{
	background: #86cfcf;
	transition: all 0.5s ease;
}

/******************
表のデザインを変更
*******************/
/*--- 表全体(table) ---*/
.entry-content table {
    border-bottom: 1px solid #e6e6e6; /* 表の一番下の線 */
    border-top: none;
    border-left: none;
    border-right: none;
}
/*--- ヘッダーセル(th) ---*/
.entry-content th {
    border-radius: 10px 10px 0 0; /* 丸み（※ヘッダーセルが縦の場合は削除）*/
    padding: 1.2em .7em; /* 余白（上下　左右） */
    background-color: #c2e7eb; /* 背景色 */
    color: #fff; /* 文字の色 */
    letter-spacing: 0.15em; /* 文字の間隔 */
    text-align: center; /* 中央揃え */
    border: none; /* 線削除 */
}
.wp-block-table thead {
    border-bottom: none;
}
/*--- 行（横方向）(tr) ---*/
.entry-content tr {
    text-align:left; /* 左揃え */
}
.entry-content tr:not(:last-child) { /* 最後の行以外に適用 */
    border-bottom: 1px solid #e6e6e6; /* 下線 */
}
/*--- ヘッダーセル以外のセル(td) ---*/
.entry-content td {
    padding: 1em 2em; /* 余白（上下　左右） */
    border:none; /* 線を削除 */
}
.entry-content td:last-child { /* 最後のセルのみ適用 */
    border-right: 1px solid #e6e6e6; /* 右線 */
}
.entry-content td:not(last-child) { /* 最後のセル以外に適用 */
    border-left: 1px solid #e6e6e6; /* 左線 */
}


.sidebar h3 {
    background: none; /*背景色を解除*/
    color:#4e5b57;/*文字の色を変える*/
    padding: 0; /*余白をなしに*/
    font-size: 16px; /*文字サイズを小さく*/
    letter-spacing: 2px; /*文字の間隔を少し広く*/
}
.sidebar h3:after { /*グラデーションのラインを引く*/
    content:"";
    display:block;
    height:1px;
    width:100%;
    background: -webkit-linear-gradient(left, #40bfa0 0%,#fef785 82%,#f37b7b 100%);
    background: linear-gradient(to right, #40bfa0 0%,#fef785 82%,#f37b7b 100%);
}

/* インデックスカード タイトル文字色 */
.entry-card-title,
.e-card-info > span{
color: #4e5b57;
}

/*---SNSボタンを丸くする---*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*SNSシェアボタン*/
.sns-share-message{
	font-weight: regular; /*レギュラー*/
	color: #875d5b; /*文字色*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/*SNSフォローボタン*/
.sns-follow-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-follow-buttons {
	justify-content: center; /*中央寄せ*/
}
.sns-follow-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/****************
タブ見出しボックス
****************/
.tab-caption-box-label{ 
	padding: 6px 16px; /*タブ内側余白*/
	font-size: 16px; /*タイトル文字の大きさ*/
	font-weight: bold; /*タイトル文字の太さ*/
	border-radius: 4px 4px 0px 0px;  /*タブ角丸*/
}

.tab-caption-box-content {
	position: relative;  /*配置に関するもの（ここを基準に）*/
	top: 1px; /*上から(1px）移動*/
	border: 2px solid; /*ボックス線*/
	padding: 48px 24px; /*ボックス内側余白*/
	border-radius: 4px; /*ボックス角丸*/
	border-top-left-radius: 0px; /*ボックス左上角丸*/
}

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

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

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

.author-box p { /*プロフィール文のスタイル指定*/
  margin-top: 2em;
  line-height: 1.5;
  font-size: 1em;
}

/* 全体の指定 */
.entry-card-title { font-size: 16px; }
/*480px以下*/
@media screen and (max-width: 480px){
/*スマホだけ16pxに指定を上書き*/
.entry-card-title { font-size: 14px; }
}

/*グローバルメニューのフォントサイズ等変更*/
.navi-in .menu-header .item-label{
font-size: 16px;
}

.widget-entry-card {
    font-size: 14px;
}

/*特定ページのシェア・フォローボタン非表示*/
.page-id-10 .sns-share,
.page-id-10 .sns-follow,
.page-id-89 .sns-share,
.page-id-89 .sns-follow {
    display: none;
}

 .wp-block-image img {
    max-width: 100%;
    height: auto!important;
}

ul li,ol li{
  padding-top:10px;
  padding-bottom:10px;
}

/*固定ページの日付非表示*/
.page .date-tags {
display: none;
}

/************************************
** 固定ページのタイトルを中央寄せ
************************************/
.page .entry-title {
text-align: center;
}

/************************************
** ヘッダー下余白を狭める
************************************/
.page .main {
  padding-top: 0;
}

.single .main {
  padding-top: 0;
}