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

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

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

/* 見出しのデザインリセット */
.entry-content h3:before {
content:none; //前に「\」をつけるのを忘れずに
}
/*H2 */
.entry-content h2{
border:none;
background:none;
padding: 0;
}

/* H3 */
.entry-content h3{
border:none;
background:none;
padding: 0;
}

/* H4 */
.entry-content h4{
border:none;
background:none ;
padding: 0;
}

.entry-content h4:before {
border-bottom: none;
}
.entry-content h4:after {
border-bottom: none;
}

/* H5 */
.entry-content h5{
border:none;
background:none;
padding: 0;
}

/* H6 */
.entry-content h6{
border:none;
background:none;
padding: 0;
}

/* 見出しのデザイン設定 */
/* H2 */
.entry-content h2{
color: #ffffff; /* 文字色 */
background-color: #c59c6c; /* 背景色 */
padding-top:25px; /* 文字と上部の間隔 */
padding-left:10px;/* 文字と左線の間隔 */
padding-bottom:25px;/* 文字と下部の間隔 */
border-left: solid 10px #c59c6c; /* 左側に実線・色*/
box-shadow:0px 1px 1px 0px rgba(0,0,0,0.4);
}

/* H3 */
.entry-content h3{
color: ; /* 文字色 */
background-color: #ffffff;/* 背景色 */
border-radius: 0px;
padding: 10px;
border-top: solid 2px #c59c6c;/* 上側に実線・色 */
border-bottom: solid 2px #c59c6c;/* 下側に実線・色*/
border-left: solid 15px #c59c6c; /* 左側に実線・色*/
box-shadow:0px 1px 1px 0px rgba(0,0,0,0.4);
}

/* H4 */
.entry-content h4{
padding: 10px;
border-top: solid 1px #c59c6c;/* 上側に実線・色 */
border-bottom: solid 1px #c59c6c !important;/* 下側に実線・色*/
}

/* H5 */
.entry-content h5{
padding: 10px;
border-bottom: dotted 3px #c59c6c;/* 下側に点線・色*/
}

/* H6 */
.entry-content h6{
padding: 5px;
border-left: solid 7px #c59c6c; /* 左側に実線・色*/
}


/************************************
** 背景画像
************************************/
body{
background-image:none;
}
/*カラム背景色*/
.home .main, .archive .main {
    background: #5a728b;
}


/************************************
** インデックス
************************************/
.entry-card-wrap.a-wrap:hover{ /*エントリーカード ホバー時設定*/
  background-color: #ffffbb; /*背景色*/
  opacity: 1 !important;
}

.entry-category{
  display: none
}



/************************************
** トップページのもっと見るボタン
************************************/

.list-more-button {
	background: #ffdd85; /* ボタンの背景色 */
	color: #5a728b; /* 文字色 */
	font-weight:bolder;/*文字の太さ*/
	width: 300px;
	border: none; /* ボタンの外枠を消しています */
}
.list-more-button:hover {
    background-color: #ffdd85;
	color: #e2694c; /* 文字色を変更 */
    opacity: 1;
}

/************************************
** パンくずリスト
************************************/

.breadcrumb {
    color: #e2694c;
}

.breadcrumb a {
    color: #e2694c;
}

/************************************
** 更新日
************************************/
.entry-date {
    color: #5a728b !important;
}
.date-tags .post-date>span[class^="fa"], .date-tags .post-update>span[class^="fa"] {
    background-color: #5a728b;
}


/**************************************
トップページの「カテゴリごと」のタイトル変更
************************************/
.list-title-in{
color: #ffdd85;/*文字の色*/
font-size: 24px;/*文字の大きさ*/
}
.list-title-in:before, .list-title-in:after {
background-color: #ffdd85;/*線の色*/
top: 40%;/*線の高さ*/
}
.list-new-entries {
  display: none;
}

/************************************
** グローバルメニュー
************************************/
/*グローバルメニューのフォントサイズ等変更*/
.navi-in .menu-header .item-label{
	font-size: 12px;
	font-weight: bold;
}
/*グローバルメニューの文字色*/
#navi .caption-wrap .item-label {
    color: #5a728b;
}

/*マウスオーバー時 背景色と文字色が変わる*/
#navi .navi-in a:hover{
	background: none;
	color: #e2694c !important;
	 opacity: 0.7;
	transition: all 0.5s ease;
}

.menu-header .menu-item:hover{
	 border-bottom:3px solid #ffffff !important;/*線の太さ色*/
	    transition: all .1s;/*線が出てくる時間*/
}

/*サブメニューの色*/
#navi .navi-in > .menu-header .sub-menu{
	background: #ffffff;
	opacity: 1.0;
}
ul.sub-menu li a:hover {
  background-color :#ffffbb !important; /*サブメニューにポインタを置いたときの背景色*/
}
/* サブメニューに影を付ける */
.navi-in>ul .sub-menu {
  margin-top: 1px;
  box-shadow: 0 2px 2px 0 rgba(0 0 0 / 14%), 0 3px 1px -2px rgba(0 0 0 / 20%), 0 1px 5px 0 rgba(0 0 0 / 12%);
  background: #fff;
}


/************************************
** トップ画面のページ番号
************************************/
/*次へボタン*/
.pagination-next-link {
  display: none;
}

.page-numbers { /*通常時*/
  background-color: #ffffff;
  color: #ffffff !important;
  border: 1px solid #ffdd85;
　box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); /*数字部分の影*/
  border-radius: 50%;
  width: 50px;
  height: 50px;
  line-height: 50px;
}
.pagination .current { /*現在のページ*/
  background-color: #c59c6c;
  color: #ffffff;
}
.page-numbers.dots { /*ドット「…」の部分*/
  background-color: #ffffff;
　border: #ffffff; /*枠線*/
  opacity: 1;
}
.pagination a:hover { /*マウスホバー時*/
  background-color: #c59c6c;
  color: #ffffff;
}
a.prev, a.next {
  display: none;
}
@media screen and (max-width: 480px) {
.page-numbers {
  width: 30px;
  height: 30px;
  line-height: 30px;
}
}
/************************************
** カテゴリー・タグページの見出し
************************************/
.archive-title {
  color: #ffdd85;
}
.archive-title :before {
  color: #ffdd85;
}

/************************************
** 検索ボックスのカスタマイズ（一体型・オーソドックス）
************************************/

.search-box .search-edit {
	padding: 8px;
	padding-right: 68px;
	border-color: #999;
}

/*検索ボタン*/
.search-box .search-submit {
	top: 0;
	right: 0px;
	height: 100%;
	width: 60px;
	color: #fff;
	background-color: #c59c6c;
	border-radius: 0 4px 4px 0;
}

.search-box .fa-search {
	display: block;
	margin-top: 3px;
}

/*入力欄と検索ボタンの強調の無効化*/
.search-box .search-edit:focus, .search-box .search-submit:focus {
	outline: 0;
	outline-offset: unset;
}

/************************************
** ヘッダーの高さ
************************************/
.header-container-in.hlt-top-menu .logo-header {
   max-height: 120px !important;
}

div.header-container-in.hlt-top-menu .logo-header img {
   max-height: none;
   width: 300px;
   height: 120px;
   vertical-align: relative;
}

.header-in {
    flex-direction: initial;
}

.header-container-in.hlt-top-menu .logo-header {
  max-height: 120px;
}

/************************************
** ロゴ
************************************/
.site-logo-image:hover {
  opacity: 0.7;
}

.logo-header img {
  width: auto!important;
  height: auto!important;
}

/************************************
** 人気記事ランキング表示のカスタマイズ
************************************/
.widget-entry-cards.ranking-visible .widget-entry-card-thumb::before{ /*順位数表示のカスタマイズ*/
	 border-radius: 50%; /*丸にする*/
	 top: -4px;  /*丸の位置上に*/
	 left: -4px;  /*丸の位置左に*/
	 width: 14px;  /*丸のサイズを小さく*/
	 height: 14px;  /*丸のサイズを小さく*/
	 font-family: 'Lato', sans-serif;  /*数字をグーグルフォントに変更*/
	 font-size: 12px;  /*数字のフォントサイズを小さく*/
}
.widget-entry-cards.ranking-visible .no-1 .card-thumb::before {/*1位の数字を上に*/
	line-height: 14px;
}
.widget-entry-cards.ranking-visible .no-2 .card-thumb::before {/*2位の数字を上に*/
	line-height: 14px;
}
.widget-entry-cards.ranking-visible .no-3 .card-thumb::before {/*3位の数字を上に*/
	line-height: 14px;
}
.widget-entry-cards.ranking-visible .no-4 .card-thumb::before {/*4位の数字を上にし背景色変更*/
	background: #000000 !important;
	line-height: 14px;
}
.widget-entry-cards.ranking-visible .no-5 .card-thumb::before {/*5位の数字を上にし背景色変更*/
    background: #000000 !important;
	line-height: 14px;
}
.sidebar div.popular-entry-card-content.widget-entry-card-content.card-content{/*タイトル*/
    padding: 0.2em 0 0 0.8em !important;  /*タイトル周りの余白を調整*/
	letter-spacing: 0.8px;  /*字間を広げる*/
}
.sidebar a.popular-entry-card-link.a-wrap{/*miniブログカード*/
    margin-bottom: 8px;  /*カード間の余白を広げる*/
}

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

.popular-entry-card-link.a-wrap{
	background-color: #ffffff;
	box-shadow: 0 5px 10px -5px rgba(0,0,0,0.2);
}

.popular-entry-card-link.a-wrap:hover{
    background-color: #ffffbb !important;
	box-shadow: 0 0 3px 0 rgb(0 0 0 / 12%), 0 2px 3px 4px rgb(0 0 0 / 10%);
    transform: translateY(-2px);
}
/************************************
** タグ一覧
************************************/
.tagcloud a:hover { /*マウスホバー時*/
    background: #ffffbb;
	box-shadow: 0 0 3px 0 rgb(0 0 0 / 12%), 0 2px 3px 4px rgb(0 0 0 / 10%);
    transform: translateY(-2px);
}

.wp-block-tag-cloud{ /*タグの並び替え*/
display: flex;
flex-wrap: wrap;
}

.tag-link-32{/*タグの並び替え*/
	order:-10;
}
.tag-link-28{/*タグの並び替え*/
	order:-8;
}
.tag-link-29{/*タグの並び替え*/
	order:-6;	
}
.tag-link-30{/*タグの並び替え*/
	order:-5;	
}
.tag-link-19{/*タグの並び替え*/
	order:-4;
}.tag-link-18{/*タグの並び替え*/
	order:-1;
}

/************************************
** サイドバーのカスタマイズ
************************************/
/*フォント*/
.widget h3,
.related-entry-heading,
.comment-title{
	font-family: "Muli", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
}

/************************************
** モバイルメニューのカスタマイズ
************************************/
span.fas.fa-times::before{
font-family: FontAwesome;
content: "\f060";
color:#90C31F;/*矢印色変更はこちら*/
}
.menu-drawer .sub-menu li a::before {
	font-family: FontAwesome;
	content: "\f105";
color:#7b7b7b;
margin:0 .5em 0 1em;
}





/************************************
** 目次のカスタマイズ
************************************/
.toc-title{
  color: #c59c6c!important;/*お好みの色に*/
}
/* 目次のアイコン設定 */
.toc-title:before {
    background-color:#c59c6c !important; /* アイコンの背景色を変える場合はここを変更 */
}

.toc ul li:before{
  color:#c59c6c !important;/*お好みの色に*/
}

/************************************
** コメント
************************************/
/* コメントを書き込むボタン */
#comment-reply-btn {
background-color: #c59c6c !important; /* 背景の色 */
border-color: #c59c6c !important; /* 枠線の色 */
}
.comment-btn:hover {
color:#fff; /*マウスオーバー時の文字色 */
background:#c59c6c !important; /*マウスオーバー時のボタンの背景色 */
opacity: 0.8; /*透明度*/
}
.comment-title {
color:#c59c6c !important; 
}
.comment-title:before {
background:#c59c6c !important;
}

/* コメントを送信ボタン */
#submit {
  background-color: #c59c6c !important; /*背景色*/
}
#submit:hover{
color:#fff; /*マウスオーバー時の文字色 */
background:#c59c6c !important; /*マウスオーバー時のボタンの背景色 */
opacity: 0.8; /*透明度*/
}

/* コメント入力欄の枠 */
#commentform textarea, /*コメント欄*/
#commentform input{ /*名前・メール・サイト入力欄*/
padding: 10px;
border: 1px solid #c59c6c; /*枠線の幅・種類・色*/
border-radius: 8px; /*角丸め*/
}
/* コメントの調整 */
.st-comment-content p{
	font-size: 14px;
	line-height: 20px; /* コメント本文のサイズ・行間調整 */
}
.st-comment-meta .avatar{
	float: left !important;
	border-radius: 27.5px; /* アイコンを丸く切り抜く */
	margin-right: 0.5em;
}
.st-comment-meta::after{
	content: '';
	display: block;
	clear: left; /* アイコンの回り込み解除 */
}
.bypostauthor .avatar{
	float: right !important; /* 管理人のアイコンは右寄せ */
}
.comment-author{
	font-style: normal; /* 斜体の解除 */
}
.commets-list .children{
	margin-left: 10px;
	padding-left: 6px !important;
	background-color: #F7F7F7 !important; /*背景色*/
} 
.commets-list .comment-body, .commets-list .st-comment-body{
	margin-bottom: .5em; /* コメントの間隔を狭める */
}
.comment-reply-link { /*返信ボタンの装飾*/
  color: #fff;
  border: none;
  border-radius: 20px;
  background: #c59c6c;
  padding: 1px 12px;
  transition: 0.5s;
}
.comment-reply-link:hover { /*返信ボタンのマウスホバー時*/
  color: #fff;
  background: #c59c6c;
  opacity: 0.7;
  transition: 0.8s !important;
}

/************************************
** SNSシェアボタン
************************************/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #c59c6c; /*文字色*/
}
.sns-share-message:before, .sns-follow-message:before {
  display: none;
}
/************************************
** プロフィールBOX
************************************/
.author-box {
    background-color: #ffffff;
}

.author-box .author-name a {
    color: #e2694c;
}
.author-description p {
    color:#696969; /* 文字の色 */
}

/* リンクアイコンの背景色にSNSのブランドカラーを設定する */
.author-box .sns-follow-buttons a.twitter-button {
  background-color: #1DA1F2 !important;
}
.author-box .sns-follow-buttons a.mastodon-button {
  background-color: #000000  !important;
}
.author-box .sns-follow-buttons a.mastodon-button:hover  {
  background-color: #000000  !important;
}
.author-box .sns-follow-buttons a.facebook-button{
background-color:#315096;
}
.author-box .sns-follow-buttons a.facebook-button:hover {
background-color:#3b5998;
}
.author-box .sns-follow-buttons a.instagram-button{
background-color:#405de6;
}
.author-box .sns-follow-buttons a.instagram-button:hover {
background-color:#405de6;
}
.author-box .sns-follow-buttons a.slack-button{
background-color:#ffc400;
}
.author-box .sns-follow-buttons a.slack-button:hover {
background-color:#ffc400;
}
.author-box .sns-follow-buttons a.github-button{
background-color:#ec520a;
}

.author-box .sns-follow-buttons a.github-button:hover {
background-color:#ec520a;
}

:root {
  --cocoon-github-color: #ffffff;
}

/* XをTwitterに変更 */
.icon-x-corp-logo:before {
  background-color: #ffffff;
  content: '';
  display: block;
  height: 0.8em;
  mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktdHdpdHRlciIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBkPSJNNS4wMjYgMTVjNi4wMzggMCA5LjM0MS01LjAwMyA5LjM0MS05LjMzNHEuMDAyLS4yMTEtLjAwNi0uNDIyQTYuNyA2LjcgMCAwIDAgMTYgMy41NDJhNi43IDYuNyAwIDAgMS0xLjg4OS41MTggMy4zIDMuMyAwIDAgMCAxLjQ0Ny0xLjgxNyA2LjUgNi41IDAgMCAxLTIuMDg3Ljc5M0EzLjI4NiAzLjI4NiAwIDAgMCA3Ljg3NSA2LjAzYTkuMzIgOS4zMiAwIDAgMS02Ljc2Ny0zLjQyOSAzLjI5IDMuMjkgMCAwIDAgMS4wMTggNC4zODJBMy4zIDMuMyAwIDAgMSAuNjQgNi41NzV2LjA0NWEzLjI5IDMuMjkgMCAwIDAgMi42MzIgMy4yMTggMy4yIDMuMiAwIDAgMS0uODY1LjExNSAzIDMgMCAwIDEtLjYxNC0uMDU3IDMuMjggMy4yOCAwIDAgMCAzLjA2NyAyLjI3N0E2LjYgNi42IDAgMCAxIC43OCAxMy41OGE2IDYgMCAwIDEtLjc4LS4wNDVBOS4zNCA5LjM0IDAgMCAwIDUuMDI2IDE1Ii8+Cjwvc3ZnPg==') !important;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: cover;
  width: 0.8em;
  transform: translate(2%, 1%);
}

/* mastodonをTwitterに変更 */
.icon-mastodon-logo:before {
  background-color: #ffffff;
  content: '';
  display: block;
  height: 0.8em;
  mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktdHdpdHRlciIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBkPSJNNS4wMjYgMTVjNi4wMzggMCA5LjM0MS01LjAwMyA5LjM0MS05LjMzNHEuMDAyLS4yMTEtLjAwNi0uNDIyQTYuNyA2LjcgMCAwIDAgMTYgMy41NDJhNi43IDYuNyAwIDAgMS0xLjg4OS41MTggMy4zIDMuMyAwIDAgMCAxLjQ0Ny0xLjgxNyA2LjUgNi41IDAgMCAxLTIuMDg3Ljc5M0EzLjI4NiAzLjI4NiAwIDAgMCA3Ljg3NSA2LjAzYTkuMzIgOS4zMiAwIDAgMS02Ljc2Ny0zLjQyOSAzLjI5IDMuMjkgMCAwIDAgMS4wMTggNC4zODJBMy4zIDMuMyAwIDAgMSAuNjQgNi41NzV2LjA0NWEzLjI5IDMuMjkgMCAwIDAgMi42MzIgMy4yMTggMy4yIDMuMiAwIDAgMS0uODY1LjExNSAzIDMgMCAwIDEtLjYxNC0uMDU3IDMuMjggMy4yOCAwIDAgMCAzLjA2NyAyLjI3N0E2LjYgNi42IDAgMCAxIC43OCAxMy41OGE2IDYgMCAwIDEtLjc4LS4wNDVBOS4zNCA5LjM0IDAgMCAwIDUuMDI2IDE1Ii8+Cjwvc3ZnPg==') !important;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: cover;
  width: 0.8em;
  transform: translate(2%, 1%);
}

/* Slackをボケてに変更 */
.icon-slack-logo:before {
  background-color: #000000;
  content: '';
  display: block;
  height: 1.3em;
  mask-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB3aWR0aD0iMTAwJSIgdmlld0JveD0iMCAwIDUxMiA1MTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8cGF0aCBmaWxsPSIjMDAwMDAwIiBvcGFjaXR5PSIxLjAwMDAwMCIgc3Ryb2tlPSIjMDAwMDAwIiAKCWQ9IgpNMTk1LjkxODM1MCw0NjIuMjcwNTY5IAoJQzE2Mi4xNzk0NDMsNDQ4LjU0NTY1NCAxMzYuMDAzMzU3LDQyNi40Nzc5OTcgMTE3LjgxMzM3NywzOTUuMzEwMzY0IAoJQzEwNC43NjY5OTEsMzcyLjk1NjAyNCA5Ni42OTQ2NzksMzQ4LjcwNzk3NyA5MS42OTQzOTcsMzIzLjM3MzI5MSAKCUM4NS40OTAyNDIsMjkxLjkzOTA1NiA4NS40Nzg2MzgsMjYwLjE1MTk3OCA4Ni45NDU1MTgsMjI4LjM5MTc1NCAKCUM4OC41MDQyODAsMTk0LjY0MjI0MiA5Mi45Mzk0NjEsMTYxLjIwNTQ3NSAxMDEuNzE2MDExLDEyOC40Nzg5NTggCglDMTA3LjY5OTU2MiwxMDYuMTY3MTUyIDExNS43OTY2MDgsODQuNjg1OTA1IDEyOC44NTg1MDUsNjUuNDYyOTA2IAoJQzEzOS43MDE4NzQsNDkuNTA0ODcxIDE1Mi42NTg5MDUsMzUuOTMxMTQxIDE3MS44NTIzNDEsMjkuNzk2NDM4IAoJQzIwMi41NjUzODQsMTkuOTc5Nzk0IDIzOC44NDQ3MTEsMzQuMzI0Mzk4IDI1MC43OTA2MDQsNjEuMTQ4MjY2IAoJQzI1Ny4xMDYzNTQsNzUuMzI5OTY0IDI1Ni43ODcxNzAsOTAuMjUwMzA1IDI1NS44NDYxNDYsMTA1LjMwNDEyMyAKCUMyNTQuNTEzMDAwLDEyNi42MzAzNzkgMjQ2LjQ4Mzc5NSwxNDYuNDA2NTQwIDI0MS45Mzk4NTAsMTY2Ljk4NTE4NCAKCUMyNDEuNTQ0MTU5LDE2OC43NzcyMDYgMjQxLjAwMjc5MiwxNzAuNTAwNDU4IDI0MS42OTI4ODYsMTcyLjY4MjIwNSAKCUMyNDguNzg5NzE5LDE3MS4yNTcxODcgMjU1Ljg0NDIwOCwxNjkuNTkzMzA3IDI2Mi45ODE4MTIsMTY4LjQ0NjcwMSAKCUMzMTguOTcxNjE5LDE1OS40NTIzNjIgMzgwLjkwNzA3NCwxODMuMTcyNjA3IDQxMS4xOTMxMTUsMjM5LjQzNDY3NyAKCUM0MjAuMTI3MTA2LDI1Ni4wMzEyMTkgNDI0LjY0MDI1OSwyNzQuMDQ4OTUwIDQyNi40NzQxNTIsMjkyLjgwMjAzMiAKCUM0MjguODYxMzI4LDMxNy4yMTM2ODQgNDI3Ljg2MTIwNiwzNDEuMjkzODg0IDQyMC4yNzc3NDAsMzY0LjgxODYwNCAKCUM0MDYuNDMxMTUyLDQwNy43NzI0MDAgMzgwLjI1NTQ2Myw0NDAuNDE3Mjk3IDMzOS40NTE1MzgsNDYwLjUyNDU5NyAKCUMzMjAuOTgwNDY5LDQ2OS42MjY3NDAgMzAxLjE2NjkwMSw0NzMuNjM2ODQxIDI4MC42MzIyNjMsNDc0LjQzOTI3MCAKCUMyNTQuNjc1MDAzLDQ3NS40NTM2MTMgMjI5LjExNjA1OCw0NzMuMzU0MDM0IDIwNC4yNjcyODgsNDY1LjI2NzMzNCAKCUMyMDEuNTc4Nzk2LDQ2NC4zOTIzOTUgMTk4Ljk0MjU4MSw0NjMuMzU2ODQyIDE5NS45MTgzNTAsNDYyLjI3MDU2OSAKTTExNC4yMDgyMDYsMTkwLjQzMzc3NyAKCUMxMDkuOTQ5NzUzLDIyMi44ODM4MDQgMTA5LjEwNDMwOSwyNTUuNDMxODcwIDExMS4xMDUxMjUsMjg4LjA5MTAwMyAKCUMxMTIuNjQzNjkyLDMxMy4yMDQ3NzMgMTE3Ljg4Mzk0OSwzMzcuNDY2MDM0IDEyNy4zMTY2MjgsMzYwLjc3NzgzMiAKCUMxNDQuNjQyOTQ0LDQwMy41OTc3NzggMTc0LjczNzQ3Myw0MzIuNjA5NTU4IDIxOS43MjQ5NjAsNDQ0Ljk5NjYxMyAKCUMyNDIuNDQzOTU0LDQ1MS4yNTIxMzYgMjY1LjY3OTc3OSw0NTEuOTA2NTg2IDI4OS4wNTY2NzEsNDQ5Ljg1NzExNyAKCUMzMDUuODgyNzUxLDQ0OC4zODIwMTkgMzIxLjg4MzMzMSw0NDMuOTg4NDAzIDMzNi4zNTc2OTcsNDM1LjI3OTcyNCAKCUMzNzkuNjUzNDczLDQwOS4yMzAxOTQgNDAxLjIwOTk5MSwzNzAuMTc3NjQzIDQwMy43MDE3NTIsMzIwLjI1MTU1NiAKCUM0MDQuNzgyODY3LDI5OC41OTA1NzYgNDAyLjYyOTUxNywyNzcuMTAxMjg4IDM5My4zMDY1NDksMjU3LjI3MTExOCAKCUMzNzIuNzI0NjQwLDIxMy40OTI5MDUgMzM2LjQyMDIyNywxOTMuMDYwMDQzIDI4OS40MDY4OTEsMTkwLjU2Mzg4OSAKCUMyNjcuMjc1MjY5LDE4OS4zODg4NDAgMjQ2LjA2OTcxNywxOTQuMzM5MjY0IDIyNi43MzM3MzQsMjA1LjkxNDg0MSAKCUMyMjIuMzk0NTMxLDIwOC41MTI0OTcgMjE4LjA2MTY2MSwyMTEuMjc4MjE0IDIxMi44NjcxNzIsMjEzLjAxNTAxNSAKCUMyMTIuMTE3NzY3LDIwNy4zNjAxMDcgMjEzLjIxOTY1MCwyMDIuMzA5NzA4IDIxMy42MjY1NDEsMTk3LjIyMjY4NyAKCUMyMTQuOTQxMjY5LDE4MC43ODUzMDkgMjE3LjMzNjMwNCwxNjQuNTE5MDg5IDIyMi4wMTM0ODksMTQ4LjY4OTQzOCAKCUMyMjcuOTE3NDk2LDEyOC43MDc3MDMgMjMzLjYzNjU5NywxMDguNzIzNDgwIDIzMi42NjY4ODUsODcuNTY5NzMzIAoJQzIzMi4xODcxMzQsNzcuMTA0Mjc5IDIyOS42ODk1NDUsNjcuNDQzMzI5IDIyMC45MjM3NTIsNjAuNTYzMjkzIAoJQzIwOS40NDQ3MDIsNTEuNTUzNjkyIDE5Ni40NjU0MDgsNDguOTgwODc3IDE4Mi4zNTA0MzMsNTEuOTUwMDMxIAoJQzE2Ni40MDM4MDksNTUuMzA0NDc4IDE1Ni40MzgwMDQsNjYuNTc1Njc2IDE0OC4yMTc4MzQsNzkuMzM3NTYzIAoJQzEyNi42Mzk1ODAsMTEyLjgzODAzNiAxMTkuNTg0Njg2LDE1MC45NDgzOTUgMTE0LjIwODIwNiwxOTAuNDMzNzc3IAp6Ii8+CjxwYXRoIGZpbGw9IiMwMDAwMDAiIG9wYWNpdHk9IjEuMDAwMDAwIiBzdHJva2U9Im5vbmUiIAoJZD0iCk0yMjMuODU3MTkzLDI5Ni45ODIyMzkgCglDMjMyLjA2NDQ5OSwyODQuODQ4NDUwIDI0Mi4yOTUyMjcsMjc1Ljg3MzA3NyAyNTYuNTY3NzQ5LDI3Mi42NzI5MTMgCglDMjkxLjY1OTMwMiwyNjQuODA0Njg4IDMxNi4wNTIzMzgsMjkyLjczODA2OCAzMjAuMzc5MjcyLDMxNS43NTYyNTYgCglDMzI2LjM3MjEwMSwzNDcuNjM2NDQ0IDMwMS44NzIzNzUsMzc2LjI4MTA5NyAyNzEuNjg3NjgzLDM3OS4wODUzMjcgCglDMjQ3LjIzNzkxNSwzODEuMzU2NzIwIDIyMS4xMjk4MzcsMzYxLjAzNTI3OCAyMTYuNjkzOTA5LDMzNS42NTg5MDUgCglDMjE0LjI5NTUwMiwzMjEuOTM4NDE2IDIxNi42MjAwNTYsMzA5LjIyNjEwNSAyMjMuODU3MTkzLDI5Ni45ODIyMzkgCk0yNDIuMzUzOTI4LDMzOC4wNDI4NzcgCglDMjQzLjY3NjY4MiwzNDAuOTU1MjYxIDI0NS41NjI5NDMsMzQzLjUwNjU2MSAyNDcuNjg4OTE5LDM0NS44NDY3MTAgCglDMjUzLjQ2MTQ1NiwzNTIuMjAwODM2IDI2MC42Mzc5MzksMzU2LjE4MjcwOSAyNjkuMjc0OTk0LDM1NS4zNDI2NTEgCglDMjg0LjI5MDU1OCwzNTMuODgyMTcyIDI5NC4yODI1MDEsMzQ0LjA1MjUyMSAyOTcuMTA3MjM5LDMyOS4wNTU1NDIgCglDMjk5LjI3OTg3NywzMTcuNTIwODEzIDI5Mi4yMzM5MTcsMzA0LjAxNzk0NCAyODAuMTExMDg0LDI5Ny44NjgxMDMgCglDMjcxLjIwMTQxNiwyOTMuMzQ4MjY3IDI2MS44OTE5MDcsMjkzLjM1NzI2OSAyNTMuNjk1ODAxLDI5OS41NDAwMzkgCglDMjQyLjA1MjE4NSwzMDguMzIzNDU2IDIzNS42NzkyOTEsMzIxLjMyNTM3OCAyNDIuMzUzOTI4LDMzOC4wNDI4NzcgCnoiLz4KPC9zdmc+') !important;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: cover;
  width: 1.3em;
  transform: translate(2%, 1%);
}

/* GitHubをSTUDYingに変更 */
.icon-github-logo:before {
  background-color: #ffffff;
  content: '';
  display: block;
  height: 1.3em;
  mask-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB3aWR0aD0iMTAwJSIgdmlld0JveD0iMCAwIDEyOCAxMjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8cGF0aCBmaWxsPSJub25lIiBvcGFjaXR5PSIxLjAwMDAwMCIgc3Ryb2tlPSJub25lIiAKCWQ9IgpNOTAuMDAwMDAwLDEyOS4wMDAwMDAgCglDNjAuMDAwMDAwLDEyOS4wMDAwMDAgMzAuNTAwMDAwLDEyOS4wMDAwMDAgMS4wMDAwMDAsMTI5LjAwMDAwMCAKCUMxLjAwMDAwMCw4Ni4zMzMzMzYgMS4wMDAwMDAsNDMuNjY2NjY4IDEuMDAwMDAwLDEuMDAwMDAwIAoJQzQzLjY2NjY2OCwxLjAwMDAwMCA4Ni4zMzMzMzYsMS4wMDAwMDAgMTI5LjAwMDAwMCwxLjAwMDAwMCAKCUMxMjkuMDAwMDAwLDQzLjY2NjY2OCAxMjkuMDAwMDAwLDg2LjMzMzMzNiAxMjkuMDAwMDAwLDEyOS4wMDAwMDAgCglDMTE2LjE2NjY2NCwxMjkuMDAwMDAwIDEwMy4zMzMzMzYsMTI5LjAwMDAwMCA5MC4wMDAwMDAsMTI5LjAwMDAwMCAKTTkyLjEyMDk0MSw1MC4zODM1NTMgCglDNzYuMjcwNDc3LDQwLjkwNjMyNiA2MC40NTI5MzAsMzEuMzczNDU3IDQ0LjU1Nzc4NSwyMS45NzE3NzcgCglDMzQuMjU5MzU3LDE1Ljg4MDQ1MiAyNC43OTg1MzgsMjEuMTYwNzY1IDI0LjczMDc4MywzMy4xMDc4MDAgCglDMjQuNjA5OTExLDU0LjQyMTEwOCAyNC42MDI2ODIsNzUuNzM2MTc2IDI0LjczMzkyOSw5Ny4wNDkzNjIgCglDMjQuODA3NjU1LDEwOS4wMjE1NDUgMzQuMjMxMzI3LDExNC4yMzI0NTIgNDQuNTg0ODEyLDEwOC4xNjY5NTQgCglDNTIuOTA5MjM3LDEwMy4yOTAxNjkgNjEuMTU1MTI1LDk4LjI3OTI0MyA2OS40MzE5NDYsOTMuMzIxMzA0IAoJQzc4LjU2NDkxOSw4Ny44NTA1MTAgODcuNzAzODg4LDgyLjM4OTU5NSA5Ni44MjEyODEsNzYuODkyOTIxIAoJQzEwOC4zNTkzNDQsNjkuOTM2ODUyIDEwOC4yNjU0ODAsNjAuMDQzMzY5IDk2LjYxMzkzNyw1My4wNDI5MDAgCglDOTUuMzMwNjgxLDUyLjI3MTg5MyA5NC4wMzA5MzcsNTEuNTI4MzEzIDkyLjEyMDk0MSw1MC4zODM1NTMgCnoiLz4KPHBhdGggZmlsbD0iIzA0MDQwNCIgb3BhY2l0eT0iMS4wMDAwMDAiIHN0cm9rZT0ibm9uZSIgCglkPSIKTTkyLjQyOTg4Niw1MC41Nzc3ODIgCglDOTQuMDMwOTM3LDUxLjUyODMxMyA5NS4zMzA2ODEsNTIuMjcxODkzIDk2LjYxMzkzNyw1My4wNDI5MDAgCglDMTA4LjI2NTQ4MCw2MC4wNDMzNjkgMTA4LjM1OTM0NCw2OS45MzY4NTIgOTYuODIxMjgxLDc2Ljg5MjkyMSAKCUM4Ny43MDM4ODgsODIuMzg5NTk1IDc4LjU2NDkxOSw4Ny44NTA1MTAgNjkuNDMxOTQ2LDkzLjMyMTMwNCAKCUM2MS4xNTUxMjUsOTguMjc5MjQzIDUyLjkwOTIzNywxMDMuMjkwMTY5IDQ0LjU4NDgxMiwxMDguMTY2OTU0IAoJQzM0LjIzMTMyNywxMTQuMjMyNDUyIDI0LjgwNzY1NSwxMDkuMDIxNTQ1IDI0LjczMzkyOSw5Ny4wNDkzNjIgCglDMjQuNjAyNjgyLDc1LjczNjE3NiAyNC42MDk5MTEsNTQuNDIxMTA4IDI0LjczMDc4MywzMy4xMDc4MDAgCglDMjQuNzk4NTM4LDIxLjE2MDc2NSAzNC4yNTkzNTcsMTUuODgwNDUyIDQ0LjU1Nzc4NSwyMS45NzE3NzcgCglDNjAuNDUyOTMwLDMxLjM3MzQ1NyA3Ni4yNzA0NzcsNDAuOTA2MzI2IDkyLjQyOTg4Niw1MC41Nzc3ODIgCk02MS44MjkwNjMsNzEuMjM4ODk5IAoJQzY1LjE3NzY1MCw2OS40ODY0MTIgNjguNTI2MjMwLDY3LjczMzkyNSA3Mi42MTc4NTksNjUuNTkyNTY3IAoJQzYzLjM1ODQ3NSw2MS4yNjA2NzAgNTQuOTAyMDEyLDU3LjMwNDQwMSA0Ni4xMTY2OTksNTMuMTk0MjkwIAoJQzQ2LjExNjY5OSw2Mi4xNzI2MTUgNDYuMTE2Njk5LDcwLjM2NDE4OSA0Ni4xMTY2OTksNzkuNDQ1NzQ3IAoJQzUxLjU4MTczNCw3Ni41ODgxODggNTYuMzc1NzM2LDc0LjA4MTQ5NyA2MS44MjkwNjMsNzEuMjM4ODk5IAp6Ii8+CjxwYXRoIGZpbGw9Im5vbmUiIG9wYWNpdHk9IjEuMDAwMDAwIiBzdHJva2U9Im5vbmUiIAoJZD0iCk02MS40OTk0MDEsNzEuNDA2ODUzIAoJQzU2LjM3NTczNiw3NC4wODE0OTcgNTEuNTgxNzM0LDc2LjU4ODE4OCA0Ni4xMTY2OTksNzkuNDQ1NzQ3IAoJQzQ2LjExNjY5OSw3MC4zNjQxODkgNDYuMTE2Njk5LDYyLjE3MjYxNSA0Ni4xMTY2OTksNTMuMTk0MjkwIAoJQzU0LjkwMjAxMiw1Ny4zMDQ0MDEgNjMuMzU4NDc1LDYxLjI2MDY3MCA3Mi42MTc4NTksNjUuNTkyNTY3IAoJQzY4LjUyNjIzMCw2Ny43MzM5MjUgNjUuMTc3NjUwLDY5LjQ4NjQxMiA2MS40OTk0MDEsNzEuNDA2ODUzIAp6Ii8+Cjwvc3ZnPg==') !important;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: cover;
  width: 1.3em;
  transform: translate(2%, 1%);
}

/* プロフィール */
.body .author-box .icon-github-logo:before {
  background-color: #ffffff;
}

/* 本文下 */
.bc-monochrome .icon-github-logo:before,
.bc-brand-color .icon-github-logo:before {
  background-color: #fff;
}

[class*=bc-brand-color] .github-button {
  --cocoon-sns-color: var(--cocoon-github-color);
}

/**********************
/* 新着記事にNEWマーク
* ********************/
.new_ribbon {
display: inline-block;
position: absolute;
top: -6px;
right: 10px;
margin: 0;
padding: 10px 0 7px;
z-index: 2;
width: 50px;
text-align: center;
color: white;
font-size: 15px;
background-color: #0000ff; /*リボンの背景色*/
border-radius: 2px 0 0 0;
}
.new_ribbon:before{
position: absolute;
content: '';
top: 0;
right: -5px;
border: none;
border-bottom: solid 6px #D3DEF1; /*リボンの裏側の色*/
border-right: solid 5px transparent;
}
.new_ribbon:after{
content: '';
position: absolute;
left: 0;
top: 100%;
height: 0;
width: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-top: 10px solid #0000ff; /*リボンの下部の色*/
}
/************************/
/*お勧めカード*/
/************************/
#recommended .navi-entry-card-link{
 border-radius:10px;
}

.navi-entry-card-link:hover{
 transform: translateY(-3px);
 opacity: none;
}

#recommended.recommended.cf.rcs-large-thumb-on.rcs-card-margin {
  margin-top: 30px; /*上マージン*/
  margin-bottom: -50px; /*下マージン*/
  transform: scale(0.92); /縮小表示*/
}
.navi-entry-card-link.widget-entry-card-link.a-wrap {
  border-radius: 6px; /*角丸コーナー*/
  -webkit-box-shadow: 0 9px 7px -6px #494949; /*シャドー（影）*/
  -moz-box-shadow: 0 9px 7px -6px #494949;
  box-shadow: 0 9px 7px -6px #494949;
}



/************************/
/*ブログカード*/
/************************


/************************/
/*コンタクトフォーム7*/
/************************

/* — コンタクトフォーム7　送信ボタンのカスタマイズ — */
input.wpcf7-submit {
padding:1em !important;/* ボタン内の余白 */
margin:1em 0em !important;/* ボタンの上下の余白 */
background-color: #c59c6c !important;/* 背景の色 */
border-radius: 5px !important;/* 角を丸く*/
color: #fff !important;/* 文字の色*/
font-size: 18px !important;/* 文字の大きさ */
font-weight: bold !important;/* 文字の太さ*/
width: 50%;/* ボタンの横幅*/
transition:0.5s;/* 背景色が変わるまでの時間*/
box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.10);/* 薄っすらとボタンにドロップシャドウをかける*/
}

input.wpcf7-submit:hover {
opacity: 0.7;
transition: 0.8s !important;
}

.btn-submit {
    width: 100%;
    text-align: center;
}