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

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

/*ヘッダーモバイルボタン*/
/*/.search-menu-button.menu-button,.navi-menu-button.menu-button,
.sidebar-menu-button.menu-button {
padding-top: 8px;
height: 52px;	
}

/*1023px以下でロゴを消す*/
/*@media screen and (max-width: 1023px) {
img.site-logo-image {
visibility: hidden;
}
}

/*1023px以下でモバイル用のロゴ表示*/
/*@media screen and (max-width: 1023px) {
.logo-menu-button.menu-button {
background-image: url(https://kazuo-blog.org/wp-content/uploads/2021/04/mobile_logo.jpg);	
background-size: auto 29px;
background-position: center;
background-repeat: no-repeat;
}
}

@media screen and (max-width: 1023px) {
.widget_toc {
display: none;	
}
}

/*スライドインメニュー*/
/*.navi-menu-content {
left: auto;
right: 0;
background-color: rgba(0,0,0,0.3);
transform: translateX(101%);
}
.menu-drawer a {
color: #fff;
height: 3em;
}
.menu-drawer a:hover {
color: rgba(255,255,255,0.3);
background-color: rgba(30,124,209,0);
}

/*ヘッダーホバー時のアンダーライン*/
.menu-header .menu-item:hover {
border-bottom:3px solid #fdd835; !important;
transition: all .3s; /*線が出てくる時間*/
}
.sub-menu .menu-item:hover {
border-bottom:none !important;
}

/*エントリーカードのh1タグ*/
.entry-card-title {
margin-top: 10px;
color: #525d66;
font-size: 15px;
}

/*オンマウス時のエントリーカード*/
.ect-vertical-card .entry-card-wrap {
margin-bottom: 20px;
}
.entry-card-wrap {
border:1px #d2d6d6;
box-shadow: 0 2px 3px 0 #d2d6d6
}
.entry-card-wrap:hover {
background: #f7f7f7; /*カードの色*/
box-shadow: 0 3px 0 #d2d6d6, 0 3px 0 rgba(0,0,0,.2);
transform: translateY(3px);
}
.entry-card .cat-label{
display: none;
}

/*メタディスクリプション非表示*/
/* .entry-card-snippet {
display: none;
}

/*サイドバー*/
.sidebar {
color: #7b7b7b;
font-size: 15px;
}

/*サイドバーの見出し*/
.sidebar h3 {
margin-top: -1em;
color: #525d66;
background: none;
font-size: 16px;
text-align: center;
letter-spacing: 2px;
display: inline-block;
position: relative;
width: 100%;
}
.sidebar h3::before, .sidebar h3::after {
border-top: 1.5px solid #525d66;
content: '';
position: absolute;
top: 50%;
width: 28%;
}
.sidebar h3::before {
left: 0;
}
.sidebar h3::after {
right: 0;
}

/*サイドバーのプロフィール*/

.author-box {
border: none;
}
.author-name {
padding-bottom: 2em;
}
.author-name a {
color: #7b8c9a;
}
.author-name a:hover {
color: #337ab7;
}
.author-box p {
line-height: 1.5;
}
.nwa .author-box .sns-follow-buttons a {
display: none;
}

/*サイドバーとPopularとNew Post*/
.widget-entry-card {
color: #7b7b7b;
font-size: 14px;
font-weight: bold;
}

.widget_categories ul li a {
color: #7b7b7b;
}

/* ------------------------------------- /
/ SNSボタン（サイドバー）挿入されていた位置 /
/ ------------------------------------- */

/*サイドバーのtoc*/
.toc-widget-box {
margin-top: -30px;
}

/*日付＆更新日の下の空白*/
.date-tags {
padding-bottom: 1.5em;	
}

/*フッターの名前と色*/
.footer-meta {
padding: 20px 10px 20px 0;
}

.footer-meta a {
color: #7b8c9a;
}

/* ------------------------------------- /
/ ここから本文 /
/ ------------------------------------- */

/*親テーマ（見出し）の初期化コード*/
.article h2 {
padding: 0;
background: none;
}
.article h3 {
padding: 0;
border: none;
}
.article h4 {
padding: 0;
border: none;	
}
.article h5 {
padding: 0;
border: none;
}
.article h6 {
padding: 0;
border: none;
}

/*見出し*/
.article h1 {
margin-top: 15px;
margin-bottom: 15px;
color: #525d66;
font-size: 18px;
line-height:40px;
text-align: center;
}
.article h2 {
margin: 4em 0 2em 0;
padding: 20px 15px 18px;
border-left: solid 8px #525d66;
background: #f7f7f7;
font-size: 20px;
font-weight: normal;
letter-spacing: 1.6px
}
.article h3 {
margin: 4em 0 2em 0;
padding: 0.7em;
border-left: solid 6px #7b8c9a;
font-weight: 600;
letter-spacing: 1.6px;
}
.article h4 {
margin: 4em 0 2em 0;
padding-bottom: 0.7em;
border-bottom: solid 5px #abb8c354;
position: relative;	
letter-spacing: 1.6px
}
h4:after {
border-bottom: solid 5px #9caab4;
bottom: -5px;
width: 20%;
content: " ";
display: block;
position: absolute;
}

/*Font Awesome＆color*/
.kazuo-color {
color: #8597df;
}

.manabu-red {
color: #c7254e;
}

/*パンくずリスト*/
.breadcrumb-caption {
font-weight: normal;
}
.breadcrumb {
margin: 1em 0.4em 2em;
}

/*カテゴリーラベル*/
.eye-catch .cat-label {
display: none;
}

/*リンクテキスト*/
a {
text-decoration: none;
}
a:hover {
color: #7a8b9a;
text-decoration: none;
}

/*toc*/
.article .toc {
margin-top: 60px;
background: #fff;
border: 1px solid #7b8c9a;
}
.toc-title {
padding:10px 0;
border-bottom: solid 1px #7b8c9a;
color: #7b8c9a;
font-size: 17px;
font-weight: bold;
position: relative;
}
.toc .toc-content {
padding: 10px 20px;
color: #525d66;
font-weight: bold;
}
.toc a {
margin-left: 3px;
color: #333;
font-weight:normal;
line-height: 2;
text-decoration: none;
}
.toc li a:hover {
color:#3296d2;
text-decoration: underline;
}

/*ブログカード*/
.blogcard-title {
color: #525d66;
}
.a-wrap {
color: #7b7b7b;
font-weight: normal;
}
.blogcard-footer {
font-size: 14px;
}

/*フッターのカテゴリー名*/
.cat-link {
background-color: rgba(51,51,51,.7);
}

/* ------------------------------------- /
/ SNSボタン（本文）挿入されていた位置 /
/ ------------------------------------- */

/*関連記事とコメント*/
.related-entry-heading, .comment-title {
color: #525d66;
font-size: 20px;
}

/*リンク*/
a {
font-weight: bold;
}

/*box*/
.box1 {
margin-bottom: 2.5em;
padding: 21px 21px;
outline: 2px solid #f0f0f0;
border-color: #f0f0f0;
background-color: #fafafa;
line-height: 2;
font-size: 14px;
text-align: left;
}

/*list*/
.list-1 {
padding: 25px 15px 25px 0;
border: dashed 1px #7a8c9a;
color: #525d66;
background-color: #fbfdff;
line-height: 2.1;
font-size: 14px;
}
.article ul, .article ol {
padding-left: 40px;
}

/*引用*/
blockquote {
padding: 33px 15px 33px 20px;
color: #525d66;
font-size: 14px;
}

/*スピーチバルーンの位置とカスタマイズ*/
.speech-wrap {
margin: 2.8em 0;
font-size: 14px;
}

.sb-id-11 .speech-icon img, .sb-id-11 .speech-icon amp-img {
border: 1.5px solid #ccc; /* ボーダーの太さ・形状・色 */
}
.sb-id-12 .speech-icon img, .sb-id-11 .speech-icon amp-img {
border: 1.5px solid #ccc;
}
.sb-id-13 .speech-icon img, .sb-id-11 .speech-icon amp-img {
border: 1.5px solid #ccc;
}

/* ------------------------------------- /
/ かんたんリンク カスタマイズ /
/ ------------------------------------- */

/*外枠*/
div.easyLink-box {
border:double #CCC !important; /*二重線*/
box-shadow: 2px 3px 9px -5px rgba(0,0,0,.25);
}

/*商品リンク タイトル*/
p.easyLink-info-name a {
color: #3296d2 !important; /*文字色*/
}

/*ボタン色*/
a.easyLink-info-btn-amazon {
background: #ffb442 !important; /*背景色*/
border: 2px solid #ffb442 !important; /*外枠*/
box-shadow: 0px 3px 7px 0px rgba(0,0,0,.25); /*影*/
}
a.easyLink-info-btn-rakuten {
background: #f76d65 !important; /*背景色*/
border: 2px solid #f76d65 !important; /*外枠*/
box-shadow: 0px 3px 7px 0px rgba(0,0,0,.25); /*影*/
}
a.easyLink-info-btn-yahoo {
background: #34a3c2 !important; /*背景色*/
border: 2px solid #34a3c2 !important; /*外枠*/
box-shadow: 0px 3px 7px 0px rgba(0,0,0,.25); /*影*/
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

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

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

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