@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){
  /*必要ならばここにコードを書く*/
}

.tab-caption-box,
.label-box{
	border:none;
}

/*検索ボックスのデザイン*/
input.search-edit{
  border: 1px solid #C1EDD9;/*検索ボックスのボーダー*/
  position: relative;
}
input.search-edit::placeholder{
  color: #92AAC7;/*placeholderの文字色*/
}
button.search-submit{
  width: 60px;/*検索ボタンの幅*/
  height: 100%;
  background-color: #C1EDD9;/*検索ボタンの色*/
  position: absolute;
  right: 0;
  top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: var(--cocoon-basic-border-radius);
  border-bottom-right-radius: var(--cocoon-basic-border-radius);
  border-bottom-left-radius: 0;
  color: #fff;/*虫眼鏡の色*/
}

/*見出し1のフォントサイズ*/
.article h1 {
	font-size: 24px; /*フォントサイズ*/
}

/*見出し1のデザイン*/
.article h1 {
  color: #385E72;/*文字色*/
  padding: 0.5em 0;/*上下の余白*/
  border-top: solid 3px #C1EDD9;/*上線*/
  border-bottom: solid 3px #C1EDD9;/*下線*/
}

/* 見出しデザインのリセット */
.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
    background-color: transparent; /* 背景色を透明に */
    border: none; /* 枠線なし */
    border-radius: 0; /* 角の丸みなし */
}

/*見出し2のフォントサイズ*/
.article h2 {
	font-size: 22px; /*フォントサイズ*/
}

/*見出し2のデザイン*/
.article h2 {
  position: relative;
  padding: 0.6em;
  background: #C1EDD9;
}

.article h2:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #C1EDD9;
  width: 0;
  height: 0;
}

/*見出し3のフォントサイズ*/
.article h3 {
	font-size: 20px; /*フォントサイズ*/
}

/*見出し3のデザイン*/
.article h3 {
  position: relative;
}

.article h3:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: -webkit-repeating-linear-gradient(-45deg, #C1EDD9, #C1EDD9 2px, #fff 2px, #fff 4px);
  background: repeating-linear-gradient(-45deg, #C1EDD9, #C1EDD9 2px, #fff 2px, #fff 4px);
}

/*見出し4、5、6のフォントサイズ*/
.article h4,
.article h5,
.article h6 {
	font-size: 18px; /*フォントサイズ*/
}

/*見出し4のデザイン*/
.article h4 {
  position: relative;
  padding-left: 1.2em;/*アイコン分のスペース*/
  line-height: 1.4;
}

.article h4:before {
  font-family: FontAwesome;
  content: "\f00c";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0.5em;/*アイコンの位置*/
  color: #C1EDD9; /*アイコン色*/
  font-weight: 900;
}

/* サイドバー見出し */
.sidebar h3 {
  border-bottom:2px solid #C1EDD9;/*下線の太さ、種類、色*/
  background:transparent;/*背景を透明に*/
  padding:10px 0 5px 3px;
}

/*目次タイトルの文字を太字に*/
.toc-title {
    font-weight: bold;
}

/*サイドバー目次タイトル削除*/
.sidebar .toc-title {
  display: none;
}

/*SNSボタンのデザイン変更*/
/*SNSボタンの上の文字デザイン*/
.sns-share-message,
.sns-follow-message{
	font-weight: bold; /*太字*/
	color: #92AAC7; /*文字色*/
	font-size: 18px; /*フォントサイズ*/
}

/*シェア・フォローボタンの枠組み*/
.sns-share.ss-top .sns-share-buttons,
.sns-share.ss-bottom .sns-share-buttons,
.sns-follow.sf-bottom .sns-follow-buttons,
.sns-follow.sf-widget .sns-follow-buttons {
	justify-content: center; /*中央に寄せる*/
	flex-wrap: wrap; /*折り返す*/
}

/*シェア・フォローボタンのリンク*/
.sns-share.ss-top .sns-buttons a,
.sns-share.ss-bottom .sns-buttons a,
.sns-follow.sf-bottom .sns-buttons a,
.sns-follow.sf-widget .sns-buttons a {
	width: 40px; /*横幅*/
	height: 40px; /*高さ*/
	margin-right: 4px; /*右側の余白*/
	margin-left: 4px; /*左側の余白*/
	border-radius: 50%; /*丸み*/
}

/*プロフィールウィジェットのリンク*/
.sns-follow.sf-profile .sns-buttons a {
	border-radius: 50%; /*丸み*/
}

/*シェアボタンのアイコン*/
.sns-share.ss-top .sns-buttons a .social-icon,
.sns-share.ss-bottom .sns-buttons a .social-icon {
	font-size: 18px; /*アイコンの大きさ*/
}

/*フォローボタンのアイコン*/
.sns-follow.sf-bottom .sns-follow-buttons .follow-button,
.sns-follow.sf-widget .sns-follow-buttons .follow-button {
	font-size: 24px; /*アイコンの大きさ*/
}

/*シェアボタンのキャプション*/
.sns-share.ss-top .sns-buttons a .button-caption,
.sns-share.ss-bottom .sns-buttons a .button-caption {
	display: none; /*非表示*/
}

/*シェア・フォローボタンのシェア数*/
.sns-share.ss-top .sns-buttons a .share-count,
.sns-share.ss-bottom .sns-buttons a .share-count,
.sns-follow.sf-bottom .sns-buttons a .follow-count,
.sns-follow.sf-widget .sns-buttons a .follow-count {
	right: -2px; /*右側からの距離*/
	bottom: -2px; /*下側からの距離*/
	padding: 2px; /*内側の余白*/
	font-size: 10px; /*文字の大きさ*/
	border: solid 1px; /*線*/
	border-radius: 3px; /*丸み*/
	background-color: inherit; /*背景色*/
}

/*シェア数の表示が必要ないシェア・フォローボタン*/
.sns-share.ss-top .sns-buttons a .share-count:empty,
.sns-share.ss-bottom .sns-buttons a .share-count:empty,
.sns-follow.sf-bottom .sns-buttons a .follow-count:empty,
.sns-follow.sf-widget .sns-buttons a .follow-count:empty {
	padding: 0; /*内側の余白*/
	border: 0; /*線*/
}

/*プロフィールのSNSボタンを削除*/
.author-follows {
  display: none;
}

/*プロフィールの名前のリンクを無効化*/
.author-box .author-name a {
    text-decoration: none;
    color: #385E72;
    pointer-events:none;
    cursor:default;
}

/*アンダーライン青の色変更*/
.marker-under-blue {
background: linear-gradient(transparent 60%, #DBE2EB 60%);
}

/*アンダーライン赤の色変更*/
.marker-under-red {
background: linear-gradient(transparent 60%, #FBDCDC 60%);
}

/*アンダーライン黄の色変更*/
.marker-under {
background: linear-gradient(transparent 60%, #FCF9A3 60%);
}