@charset "UTF-8";
@import url(https://fonts.googleapis.com/icon?family=Material+Icons%7CMaterial+Icons+Outlined);

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body {
	font-family: "Klee One", cursive;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
 article > .entry-content, aritcle > footer.article-footer {/*本文左右の空白*/
padding: 0 20px;
}
}

/*834px以下*/
@media screen and (max-width: 834px){
 .page-body {
font-size: 16px;
}
}

/*480px以下*/
@media screen and (max-width: 480px){
 .page-body {
font-size: 15px;
}
 /*スマホ用記事タイトルの文字サイズ*/
.post .entry-title {font-size: 1.8rem;} /*スマホ用記事タイトル*/
/*記事内タグクラウドのフォントサイズ*/
.kizitagcloud a {
font-size:0.8em !important;
width:49%;
}
}

/************************************
** 人気記事ランキング表示のカスタマイズ
************************************/
.widget-entry-cards.ranking-visible .widget-entry-card-thumb::before{ /*順位数表示のカスタマイズ*/
	 border-radius: 50%; /*丸にする*/
	 top: -4px;  /*丸の位置上に*/
	 left: -4px;  /*丸の位置左に*/
	 width: 16px;  /*丸のサイズを小さく*/
	 height: 16px;  /*丸のサイズを小さく*/
	 font-family: 'Lato', sans-serif;  /*数字をグーグルフォントに変更*/
	 font-size: 12px;  /*数字のフォントサイズを小さく*/
	 display: flex;
  justify-content: center;
  align-items: center;
}
.widget-entry-cards.ranking-visible .no-1 .card-thumb::before {/*1位の数字を上に*/
	line-height: 16px;
}
.widget-entry-cards.ranking-visible .no-2 .card-thumb::before {/*2位の数字を上に*/
	line-height: 16px;
}
.widget-entry-cards.ranking-visible .no-3 .card-thumb::before {/*3位の数字を上に*/
	line-height: 16px;
}
.widget-entry-cards.ranking-visible .no-4 .card-thumb::before {/*4位の数字を上にし背景色変更*/
	background: #5E5E5E;
	line-height: 16px;
}
.widget-entry-cards.ranking-visible .no-5 .card-thumb::before {/*5位の数字を上にし背景色変更*/
    background: #5E5E5E;
	line-height: 16px;
}
.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;  /*カード間の余白を広げる*/
}



/* 蛍光マーカー*/
.marker {background-color: #E1E1E1; }
.marker-under {background: linear-gradient(transparent 60%, #E1E1E1 60%);}
.marker-red {background-color: #f7d492; }
.marker-under-red {background: linear-gradient(transparent 60%, #f7d492 60%);}
.marker-blue {background-color: #b0e8e5; }
.marker-under-blue {background: linear-gradient(transparent 60%, #b0e8e5 60%);}

/************************************
** 画像系css
************************************/
/* 一括で画像を角丸にする */
[class*="wp-image-"],img[class*="attachment-"] {
border-radius: 5px;
	}

/* 動画中央揃え */
.video-container {
margin: 0px auto;
}
.wp-block-image figcaption {
  text-align: center;
}
.wp-block-embed figcaption {
  text-align: center;
}
/* グローバルメニューのマテリアルアイコンと動画サイトのアイコンとか中央揃えする */
.menuicon{
	color:#721F99;
	opacity: .3;
	vertical-align: middle;
    display: inline-flex;
}
.wp-image-4470, .wp-image-4471, .wp-image-4469, .material-icons-outlined, .material-icons {
vertical-align: middle;
display: inline-flex;
}
img{
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.2);
vertical-align: middle;
}

a {
 -webkit-tap-highlight-color:rgba(0,0,0,0);
}


/* margin上下狭く*/
.marginwide {
 margin: 0 auto !important;
}
/* margin左右狭く*/
.marginwidesayuu {
 margin: 0 2px 0 0!important;
}
/* margin広く*/
.marginwide-broad {
 margin: 30px auto !important;
}
/* padding狭く*/
.paddingwide {
 padding: 1px !important;
}
/* MAX ワイド*/
.picture-width {
 width: 65%;
 height: 65%;
}
/* 幅固定*/
.haba a{
  width:200px !important;
}



/* カラムの中のボタンの位置合わせ */
#column .wp-block-column {
	display: flex;
	flex-direction: column;
	padding: 1rem;
	margin-bottom: 1.5rem;
	border-radius: 8px;
}
#column .wp-block-buttons {
	margin-top: auto;
}



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

#container .blogcard-label {/* あわせて読みたいなど */
font-family: "Kaisei Decol", serif;
display: block;
font-size: 12px;
background-color: #727272;/* あわせて読みたいなどの背景色 */
}
.blogcard::before {
display: none;
}
.blogcard-snippet {/* 抜粋 */
display: none;
}

.blogcard-title {
font-size: 18px;/* タイトルの大きさ */
}
.blogcard-content {
margin-left: 180px;
}
.blogcard::after {
font-family: "Kaisei Decol", serif;
content: "こちらから見る \bb";
font-weight: 400;
position: absolute;
bottom: 1em;
right: 2em;
background-size: 200% auto;
animation: GradietionAnimation 7s ease infinite;
background-image: linear-gradient(to right, #000 0%,#8f8f8f 51%, #000 100%);/* 記事はこちら背景色 */
color: #efefef;
padding: 0.2em 1em;
border-radius: 5px;
font-size: 13px;
}



.body .article {/*本文SNSフォロー下の空白*/
margin-bottom: 0;
}


.blogcard-wrap,.blogcard-title,.blogcard-snippet,.blogcard::after {
transition: 0.3s ease-in-out;
}
.a-wrap:hover .blogcard::after {
background-color: #595959;/* マウスホバー時の「記事はこちら」背景色 */
}
.a-wrap.blogcard-wrap:hover {
background-color:#efefef;/* マウスホバー時の全体背景色 */
}
.a-wrap:hover .blogcard-title, .a-wrap:hover .blogcard-snippet {
opacity: 0.7;
}

/* 内部ブログカードのアイコンとURLを非表示 */
.blogcard-footer{
	display: none; 
}
/* 内部ブログカードのラベルつけたし */
.bct-opprevious .blogcard-label::after {
	content: "あわせて見たい";
}
.bct-opprevious .blogcard-label a:before{
	font-family: FontAwesome;
	content: "\f138";
	margin:0 5px 0 0;
	color:#721F99;
	opacity: .3;
}


@media screen and (max-width:834px) {
#container .blogcard-label,.blogcard-snippet {
font-size: 13px;
}
.blogcard-content {
margin-left: 150px;
}
.blogcard-title {
font-size: 13px;
}
.blogcard::after {
font-size: 14px;
}
}
@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@media screen and (max-width:480px) {
#container .blogcard-label,.blogcard-title,.blogcard::after {
font-size: 12px;/* スマホ時の文字の大きさ */
}
.blogcard-content {
margin-left: 130px;
}
}



/************************************
****　ヘッダーメニュー
************************************/

.navi-in a{
font-family: "Kaisei Decol", serif;
font-size:14px;
}
#navi .navi-in a:hover {
transform: none!important;
}
.navi-in > ul .sub-menu a {
padding: 0;
}
.navi-in > ul .sub-menu{
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.26);
}
.sub-menu .caption-wrap {
font-family: "Zen Kurenaido", sans-serif;
color:#595959;/*サブメニューの文字色*/
border-top: solid #dddddd;
background:#efefef;/*サブメニューの背景色*/
padding:0 0 0 1em;
margin:0;
}
.navi-in > ul .sub-menu a:hover {
transform: none!important;
}
div#header-container {
box-shadow: none;
}
div.item-label{
font-family: "Kaisei Decol", serif;
font-weight:bold;
}


/************************************
****　アピールエリア
************************************/
.appeal{
padding:0 0 .1em;
box-shadow: 0px 1px 4px 0 rgba(0,0,0,.1);
}
div#appeal-in.appeal-in.wrap{
padding:0;
min-height:0px;
max-height:30px;
}
.appeal-content{
background-color:#0a0a0a; /*エリア背景色・ボタン色と同じカラーコードを入力*/
margin:auto;
padding:0;
max-width:100%;
opacity:1;
line-height:1.6;
}
a.appeal-button {
font-family: "Kaisei Decol", serif;
color: #efefef!important;/*文字色はこちらで変更できます*/
font-size:.85em;
padding:0 23em 0;
margin:0;
max-width:100%;
white-space: nowrap;
box-shadow: none;
}
@media screen and (max-width: 1023px){
a.appeal-button {
padding:0 18em 0 ;
}}
@media screen and (max-width: 834px){
a.appeal-button {
padding:0 13em 0 ;
}
.appeal{
padding:.1em 0 .25em;
}}
@media screen and (max-width: 652px){
a.appeal-button {
padding:0 8em 0 ;
}}
@media screen and (max-width: 500px){
a.appeal-button {
padding:0 6em 0 ;
}}
@media screen and (max-width: 420px){
a.appeal-button {
padding:0 3em 0 ;
}}
.appeal-button:hover {
transform:none;
box-shadow: none;
}


/************************************
****　プロフィール欄
************************************/
.nwa .author-box {
max-width:none;
padding: 0;
margin-bottom:0;
}
aside#author_box-2.widget.widget-sidebar.widget-sidebar-standard.widget_author_box{
padding: 0!important;
border-radius: 10px;
}
@media (max-width: 1023px){
aside {
padding: 0 .5em;
}
}
.nwa .author-box .author-thumb {
width: 100%;
height:9em;
margin:0 0 5em 0;
border-radius: 10px 10px 0 0;
}
.author-box figure.author-thumb{
float: none;
text-align: center;
background: url(https://create.mattarichaos.info/wp-content/uploads/2024/04/背景.png) center no-repeat;
background-size: cover;
position: relative;
z-index: 0;
}
.author-box img.avatar.photo{
background-image: none;
padding: 0!important;
box-shadow:none;
}
.author-box figure.author-thumb img{
width: 40%;
max-width:180px;
margin-top:5em;
}
@media (min-width:1023px){
.nwa .author-box .author-thumb {
height:8em;
}
.author-box figure.author-thumb img{
max-width:120px;
}}
@media (max-width:480px){
.nwa .author-box .author-thumb {
height:8em;
}
.author-box figure.author-thumb img{
max-width:130px;
}}
.author-box .author-name {
margin: 0 0 1.5em 0;
}
.author-box .author-content .author-name a{
text-decoration: none;
font-size:1.2em;
color:#545454;
}
.nwa .author-box .author-description {
margin-bottom:1.5em
}
.author-box .author-content .author-description p{
font-size:14px;
color:#7b7b7b;
line-height:1.6em!important;
margin:1em;
}
#author_box-2 p{
margin:1em 2.5em;
}
div.author-follows{
padding-bottom:2em;
}
.author-box .author-content .author-description p a{ text-decoration: none; }
.author-box .author-content .author-description p a:hover{ text-decoration: underline; }
.author-box .author-content .author-follows .sns-buttons{ justify-content: center; }
.author-box .author-content .author-follows .sns-buttons a.follow-button{
border-radius: 50%;
border: none;
width: 40px;
height: 40px;
color: #fff!important;
margin:3px;
transition: .5s;
}
div.author-follows a.follow-button.website-button.website-follow-button-sq{background-color: #6eb6fd!important;}
div.author-follows a.follow-button.twitter-button.twitter-follow-button-sq{background-color: #7dcdf7!important;}
div.author-follows a.follow-button.facebook-button.facebook-follow-button-sq{background-color: #7c9dec!important;}
div.author-follows a.follow-button.hatebu-button.hatebu-follow-button-sq{background-color: #2c6ebd!important;}
div.author-follows a.follow-button.instagram-button.instagram-follow-button-sq{background: linear-gradient(165deg, #427eff 5%, #f13f79 50%) no-repeat !important;}
div.author-follows a.follow-button.pinterest-button.pinterest-follow-button-sq{background-color: #bd081c!important;}
div.author-follows a.follow-button.youtube-button.youtube-follow-button-sq{background-color: #cd201f!important;}
div.author-follows a.follow-button.tiktok-button.tiktok-follow-button-sq{background-color: #000000!important;}
div.author-follows a.follow-button.linkedin-button.linkedin-follow-button-sq{background-color: #0A66C2!important;}
div.author-follows a.follow-button.note-button.note-follow-button-sq{background-color: #41C9B4!important;}
div.author-follows a.follow-button.soundcloud-button.soundcloud-follow-button-sq{background-color: #FF5500!important;}
div.author-follows a.follow-button.flickr-button.flickr-follow-button-sq{background-color: #111!important;}
div.author-follows a.follow-button.line-button.line-follow-button-sq{background-color: #00c300!important;}
div.author-follows a.follow-button.amazon-button.amazon-follow-button-sq{background-color: #ff9900!important;}
div.author-follows a.follow-button.twitch-button.twitch-follow-button-sq{background-color: #5C16C5!important;}
div.author-follows a.follow-button.rakuten-room-button.rakuten-room-follow-button-sq{background-color: #C61E79!important;}
div.author-follows a.follow-button.slack-button.slack-follow-button-sq{background-color: #4A154B!important;}
div.author-follows a.follow-button.github-button.github-follow-button-sq{background-color: #4078c0!important;}
div.author-follows a.follow-button.codepen-button.codepen-follow-button-sq{background-color: #47CF73!important;}
div.author-follows a.follow-button.feedly-button.feedly-follow-button-sq{background-color: #2bb24c!important;}
div.author-follows a.follow-button.rss-button.rss-follow-button-sq{background-color: #f26522!important;}
.author-box .author-content .author-follows .sns-buttons a.follow-button span{ line-height: 40px; }
.author-box .author-content .author-follows .sns-buttons a.follow-button span::before{ font-size: 20px !important; }
@media (max-width:1023px){
.nwa .author-box .author-thumb {
height:11em;
margin:0 0 7em 0;
}
.author-name{
font-size:16px!important;
}
.author-description{
line-height: 1.5 !important;
text-align:center;
margin:0 auto;
}
}
@media screen and (max-width: 1023px){/*スマホ画面でサイドバーを非表示*/
div.sidebar {
display: none;
}
	}


/************************************
****　サイドバー
************************************/
#sidebar>.widget{
border-radius:10px;
}

span.fas.fa-search::before{
color:#727272;/*検索マーク色変更はこちら*/
}
	
.sidebar h3{
border-radius:3px;
border: 0;
background-color:#727272;/*タイトル下のライン色変更はこちら*/
color:#efefef;
border-bottom:5px solid;
border-bottom-color:#595959;/*タイトル下のライン色変更はこちら*/
padding-bottom:0.3em;
margin-top:-0.5em;
margin-bottom:1em;
text-align: center;
font-family: "Kaisei Decol", serif;
font-weight: 600;
font-style: normal;
}
.widget_recent_entries ul li a, .widget_categories ul li a, .widget_archive ul li a, .widget_pages ul li a, .widget_meta ul li a, .widget_rss ul li a, .widget_nav_menu ul li a {
font-family: "Kaisei Decol", serif;
background-color:#f7f7f7;
margin: 6px 0;
padding: 4px 10px;
border-radius:2px;
border-bottom:1px solid;
border-color:#727272;/*タイトル下のライン色変更はこちら*/
transition: 0.4s
text-align: center;
}
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover, .widget_archive ul li a:hover, .widget_pages ul li a:hover, .widget_meta ul li a:hover, .widget_rss ul li a:hover, .widget_nav_menu ul li a:hover{
background-color:#efefef;/*マウスオーバー時の背景色変更はこちら*/
color:#595959!important;
}
.tagcloud a{
background-color:#f7f7f7;
}
.tagcloud a:hover{
background-color:#efefef;/*マウスオーバー時の背景色変更はこちら*/
color:#595959!important;
transition: 0.4s ;
}

/*サイドバーtagクラウド*/

.xiitagcloud a {
    border-radius: 20px;
    display: inline-block;
    padding: 3px 10px;
    text-decoration: none;
    font-size: 10px;
    margin: 2px;
    flex: 1 1 auto;
    justify-content: space-between;
}
.xiitagcloud a:before {
    text-shadow:none;
 font-family:"Material Icons";
 content:"\e54e";
 color:#00000F;
 padding-right:5px;
}


.nwa .recommended.rcs-card-margin a {
margin: 0 0 1em;
width: 90%;
}
.widget-entry-cards .widget-entry-card-content{
color: #565656;
}



/************************************
****　サイドバーブログカード
************************************/
.sidebar a.popular-entry-card-link.a-wrap{
margin:0;
padding:0;
}
.sidebar figure.popular-entry-card-thumb.widget-entry-card-thumb.card-thumb{
margin:.5em 0em .5em .2em;
}
.sidebar div.popular-entry-card-content.widget-entry-card-content.card-content{
padding:.5em .5em .5em .8em;
text-align: justify;
line-height:1.3;
}
.sidebar .popular-entry-cards.widget-entry-cards.no-icon.cf {
margin-bottom: 0;
}

/************************************
****　本文記事タイトル　H1
************************************/
header.article-header.entry-header {
text-align:center;
margin-bottom: 3em;
}
.article-header h1 {
font-family: "Kaisei Decol", serif;
position: static;
font-size: 1.4em;
color: #333333;
background-color:#fff;
line-height:1.8em;
text-shadow: none;
margin:0;
padding: 1.5em .95em 1.1em;
}
.eye-catch{
box-shadow: 0px 3px 7px 0 rgba(0,0,0,.2);
}
.eye-catch img{
height:auto!important;
-webkit-filter:none;
filter:none;
opacity:1;
transform: none;
}
a.cat-link, a.tag-link{
font-size:.7em;
border-radius:2px;
border:0;
margin:0.5em;
padding:0 0.5em 0;
background:#727272!important;/*タグ色の変更はこちら*/
color:#efefef!important;
 font-family: "Kaisei Decol", serif;
}
.cat-link:hover ,.tag-link:hover {
opacity: .5;
transition: all .3s ease-in-out;
}
.entry-categories-tags {
margin-bottom: 0.4em;
}
.date-tags{
font-size:1.2em;
color:#7b7b7b;
top:5px;
right:0;
left: 0;
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
}
div.date-tags span.post-update{
order: 1;
}
span.fas.fa-history::before{
content:"\f2f1"
}
div.date-tags span.post-update,div.date-tags span.post-date{
margin-right: 10px;
}
@media (max-width:1023px){
.entry-categories-tags.ctdt-one-row {
padding: 0;
}
}
@media (max-width:420px){
.article-header h1 {
font-size: 1.2em;
}
.date-tags{
top:3px;
}
}
@media (max-width:834px){
main.main, div.sidebar {
padding:0;
}}
@media screen and (min-width: 601px) and (max-width: 834px){
div#content.content.cf{
margin:1em;
}}
@media screen and (max-width: 600px){
.content {
margin-top: 0px;
}}


/************************************
****　本文記事見出し H2 H3 H4 H5
************************************/
.article h2:before {
background-image: none;
}
.article h2{
font-family: "Kaisei Decol", serif;
line-height:1;
background-color:#727272;
font-size: 24px;
color:#efefef;
border-radius:1px;
border-bottom:solid 14px #595959;/*H2の色の変更はこちら*/
padding:1em;
margin-top:70px;
margin-bottom:2em;
text-align: center;
}
.article h3{
font-family: "Kaisei Decol", serif;
line-height:2;
font-size:20px;
border:none;
color:#595959;
border-radius:2px;
border-left:10px solid #8b968d;/*H3の色の変更はこちら*/
border-right:10px solid #8b968d;/*H3の色の変更はこちら*/
padding: 0.4em 0.8em;
margin-top:90px;
text-align: center;
}
.article h3:before {
width: 0em;
}



/************************************
****　目次
************************************/
.toc-title{
font-weight:bold;
background: #f5f5f5;
font-family: "Kaisei Decol", serif;
}
.toc-title::after {
color:#337ab7;
}
.toc-title::before {
font-family: 'Material Icons';
content: '\e873';
margin-right: 7px;
}
.toc-list > li a {
font-weight: bold;
display:block;
margin-top:10px;
margin-left: 10px;
}
.toc-list > li a::before {
font-family: 'Material Icons';
content: '\e038';
margin-right: 7px;
}
.toc-list > li li a {
font-weight: normal;
font-size: 95%;
margin-top:0;
margin-left: 2em;
}
.toc-list > li li a::before {
content: "";
width: 7px;
height: 7px;
left: -2px;
display: inline-block;
border-radius: 50%;
background: #a0a0a0;/*こちらで緑点の色を変更できます*/
position: relative;
margin-bottom: 2px;
}
@media (max-width:880px){
.toc-list > li a {
margin-left: -10px;
}
.toc-list > li li a {
margin-left: -2em;
}
.toc-list > li li a::before {
left: 3px;
margin-bottom:1px;
}
}
.toc a:hover {
color: #333333;
text-decoration: underline;
}


/*---------------------------------
グローバルナビ（メインメニュー）の装飾
--------------------------------*/


#navi{
background: #727272!important; /*ナビ全体の背景色（メニュー項目以外のサイドの余白）*/
}
#navi ul li a{
color: #efefef; /*メインメニューにポインタを置く前の文字色*/
background:#727272; /*メインメニューにポインタを置く前の背景色*/
}
#navi ul li a:hover{
color: #efefef; /*メインメニューにポインを置いたときの文字色*/
background:#595959!important; /*メインメニューにポインタを置いたときの背景色*/
}

/*---------------------------------
グローバルナビの上下にラインを入れる
--------------------------------*/
#navi {
border-bottom:solid 5px #595959; /*下ラインの太さと色*/
}



/*ボタングラデーション＆ホバー透過*/

.btn-m{
  color: #efefef;
  display: inline-block;
position: relative;
background-size: 200% auto;
animation: GradietionAnimation 7s ease infinite;
}
.btn-m:hover{
 transition: .5s;
opacity: 0.7;
color: #efefef;
}
@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

.wp-block-button__link{
  color: #fff;
  display: inline-block;
position: relative;
background-size: 200% auto;
animation: GradietionAnimation 7s ease infinite;
}
.wp-block-button__link:hover{
 transition: .5s;
opacity: 0.7;
color: #fff;
}
@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
     


/* 背景グラデーション */
.btn-name .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#4e70b5 51%, #3d3d3d 100%);
}

.btn-theme .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#b5684e 51%, #3d3d3d 100%);
}


.btn-nickname .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#4eb59f 51%, #3d3d3d 100%);
}

.btn-character .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#93b54e 51%, #3d3d3d 100%);
}

.btn-namedictionary .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#6850b4 51%, #3d3d3d 100%);
}



.yahoo .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#4E92B5 51%, #3d3d3d 100%);
	font-family: "Kaisei Decol", serif;
}

.amazon .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#B5944E 51%, #3d3d3d 100%);
	font-family: "Kaisei Decol", serif;
}

.rakuten .has-background{
	background-image: linear-gradient(to right, #3d3d3d 0%,#B54E4E 51%, #3d3d3d 100%);
	font-family: "Kaisei Decol", serif;
}

/* ポチップボタン */
.pochipp-box[data-btn-style=dflt] .-amazon>.pochipp-box__btn{
background-image: linear-gradient(to right, #5E5E5E 0%,#B5944E 51%, #5E5E5E 100%)!important;
background-size: 200% auto!important;;
animation: GradietionAnimation 7s ease infinite!important;
border-radius:3px!important;/*枠の角を丸く*/
box-shadow: 2px 2px 4px!important;
}
.pochipp-box[data-btn-style=dflt] .-custom_2>.pochipp-box__btn{
background-image: linear-gradient(to right, #5E5E5E 0%,#B5944E 51%, #5E5E5E 100%)!important;
border-radius:3px!important;/*枠の角を丸く*/
background-size: 200% auto!important;;
animation: GradietionAnimation 7s ease infinite!important;
box-shadow: 2px 2px 4px!important;
}
.pochipp-box[data-btn-style=dflt] .-rakuten>.pochipp-box__btn{
background-image: linear-gradient(to right, #5E5E5E 0%,#B54E4E 51%, #5E5E5E 100%)!important;
background-size: 200% auto!important;;
animation: GradietionAnimation 7s ease infinite!important;
border-radius:3px!important;/*枠の角を丸く*/
box-shadow: 2px 2px 4px!important;
}
.pochipp-box[data-btn-style=dflt] .-yahoo>.pochipp-box__btn{
background-image: linear-gradient(to right, #5E5E5E 0%,#4E92B5 51%, #5E5E5E 100%)!important;
background-size: 200% auto!important;;
animation: GradietionAnimation 7s ease infinite!important;
border-radius:3px!important;/*枠の角を丸く*/
box-shadow: 2px 2px 4px!important;
}

/* マウスオーバー時に背景色をAmazonカラーに設定 */
.pochipp-box[data-btn-style=dflt] .-amazon>.pochipp-box__btn:hover {
	background-image: var(--pchpp-color-amazon) !important;
	border-color:var(--pchpp-color-amazon);
	transition: .5s;
opacity: 0.7;
}
.pochipp-box[data-btn-style=dflt] .-custom_2>.pochipp-box__btn:hover {
	background-image: var(--pchpp-color-amazon) !important;
	border-color:var(--pchpp-color-amazon);
	transition: .5s;
opacity: 0.7;
}

 /* マウスオーバー時に背景色を楽天カラーに設定 */
.pochipp-box[data-btn-style=dflt] .-rakuten>.pochipp-box__btn:hover {
	background-image: var(--pchpp-color-rakuten) !important;
	border-color:var(--pchpp-color-rakuten);
	transition: .5s;
opacity: 0.7;
}

/* マウスオーバー時に背景色をYahooカラーに設定 */
.pochipp-box[data-btn-style=dflt] .-yahoo>.pochipp-box__btn:hover {
	background-image: var(--pchpp-color-yahoo) !important; 
	border-color:var(--pchpp-color-yahoo);
	transition: .5s;
opacity: 0.7;
}

.pochipp-box__btnwrap{
	font-family: "Kaisei Decol", serif;
	font-size: 13px;
align-items:center;
	  font-weight: 900;
	}

.pochipp-box {
	box-shadow: none!important;/*影を消す*/
	background-color: initial!important;/*ポチップ背景色を無効にする*/
}

/*ポチップのカスタムボタンを先頭にする*/
.pochipp-box__btnwrap.-custom_2 {
	order: -1;
}


/*見出しボックス*/
.box-label-text{
	font-family: "Kaisei Decol", serif;
	  font-weight: 900;
	}

.caption-box-label {
justify-content: center;
}



/* カラムの中のボタンの位置合わせ */
#column .wp-block-column {
	display: flex;
	flex-direction: column;
	padding: 1rem;
	margin-bottom: 1.5rem;
	border-radius: 8px;
}
#column .wp-block-cocoon-blocks-button-1 {
	margin-top: auto;
}

/************************/
/*お勧めカード*/
/************************/
.recommended .navi-entry-card-thumb img{
border-radius:3px; /*角丸め*/
margin:2px;
}

.youtubesize{
	width:200px;
	}
/************************************
** カルーセル
************************************/
.carousel-in {
  background: transparent;
}

.carousel-entry-card {
  border-radius: 10px;
  box-shadow: 0 0 10px -5px rgba(0, 0, 0, 0.5);
  background: white;
  padding: 5%;
}

.carousel-entry-card:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  transform: translateY(-2px);
  transition: all .3s ease;
}

.carousel .slick-track {
  padding: 10px 0;
  border: dotted 2px #595959;
}

.carousel .slick-arrow:before {
  color: #595959;
  font-size: 28px;
}

.card-title {
  color: #3d3d3d;
 text-align: center;
 font-size: 12px;
}



.carousel .carousel-entry-card-thumb.card-thumb img {
  border-radius: 6px; /*角丸コーナー*/
 width: 200px;
}

.carousel .cat-label {
  display: none; /* カテゴリーを消す */
}


.new-entry-card-date {
text-align: center;
  font-size: 12px;
}

/* リンク下線を消す */
a {
text-decoration: none;
}

/* カラムブロックの中央揃え・両端揃え */
.wp-block-columns {
  &.is-style-justify {
    justify-content: space-between;
  }
  &.is-style-center {
    justify-content: center;
  }
}

 .description{
  /* 水平方向の中央揃え */
  text-align: center;
}


*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;
}


	
 /* ボックスメニュー */
.box-menu{
box-shadow: none; 
background: transparent;　
opacity: 0.8;
padding: 0;
min-height: 0;
}
.box-menu:hover{
	box-shadow:none;
	opacity: 0.8;
}
.box-menu-icon img{
transition:0.3s all;
}

.box-menu-icon img:hover{
transform:scale(1.1,1.1);
transition:0.8s all;
}

.box-menu-label,
.box-menu-description{
display: none;
}

.box-menu-icon *{
margin: 0;
max-width: 110%;
max-height: 300px;}


@media screen and (min-width: 600px){
.wwa .box-menu{
width: 25%;
}
}

@media screen and (min-width: 600px){
.wwa .box-menu{
margin-right: 0%;
}
}

@media screen and (min-width: 600px){
.box-menu:last-child{
margin-right: 0px;
}
}

/* ナビメニュー列変更 */
.navi-entry-cards.large-thumb {
display: flex;
flex-wrap: wrap;
margin: 0 auto;
}
.navi-entry-cards.large-thumb a {
width: 33%;
}
/*768px以下*/
@media screen and (max-width: 768px){
.navi-entry-cards.large-thumb a {
width: 50%;
}
}
/*480px以下*/
@media screen and (max-width: 480px){
.navi-entry-cards.large-thumb a {
width: 100%;
}
}


/* cocoon新着記事列変更 */
.new-entry-cards.large-thumb {
display: flex;
flex-wrap: wrap;
margin: 0 auto;
}
.new-entry-cards.large-thumb a {
width: 33%;
}
/*768px以下*/
@media screen and (max-width: 768px){
.new-entry-cards.large-thumb a {
width: 50%;
}
}
/*480px以下*/
@media screen and (max-width: 480px){
.new-entry-cards.large-thumb a {
width: 100%;
}
}


/************************************
****　SNSシェアボタン
************************************/

.sns-share.ss-col-6.ss-high-and-low-lc.bc-brand-color.sbc-hide.ss-top {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.share-button a{
    color:#545454;
}

.sns-buttons a{
    color:#545454;
}

.sns-buttons a.share-button {
    color: #545454;
    background: white;
    border-radius: 0;
    border:none;
    margin-top:10px;
}

.bc-brand-color-white .sns-buttons a.share-button{
    border-width: 1px;
    border-style: solid;
}

.sns-buttons a:hover {
    transform: translateY(-4px);
    transition:all 500ms;
    color:#545454;
}

.bc-brand-color.sns-share .sns-buttons a,
.bc-brand-color.sns-follow  .sns-buttons a,
.bc-monochrome .sns-buttons a{
    background:#fff;
    border:none;
}

.bc-brand-color a.x-corp-button {
    color: var(--cocoon-twitter-color);
}

.bc-brand-color a.mastodon-button {
    color:var(--cocoon-mastodon-color);
}

.bc-brand-color a.misskey-button {
    color:var(--cocoon-misskey-color);
}

.bc-brand-color a.facebook-button {
    color:var(--cocoon-facebook-color);
}

.bc-brand-color a.hatebu-button {
    color:var(--cocoon-hatebu-color);
}

.bc-brand-color a.instagram-button {
    color: var(--cocoon-instagram-color);
}

.bc-brand-color a.youtube-button {
    color: var(--cocoon-youtube-color);
}

.bc-brand-color a.linkedin-button {
    color: var(--cocoon-linkedin-color);
}

.bc-brand-color a.note-button {
    color: var(--cocoon-note-color);
}

.bc-brand-color a.flickr-button {
    color: var(--cocoon-flickr-color);
}

.bc-brand-color a.pinterest-button {
    color: var(--cocoon-pinterest-color);
}

.bc-brand-color a.pocket-button {
    color:var(--cocoon-pocket-color);
}

.bc-brand-color a.line-button {
    color:var(--cocoon-line-color);
}

.bc-brand-color a.amazon-button {
    color: var(--cocoon-amazon-color);
}

.bc-brand-color a.rakuten-room-button {
    color: var(--cocoon-rakuten-room-color);
}

.bc-brand-color a.slack-button {
    color: var(--cocoon-slack-color);
}

.bc-brand-color a.github-button {
    color: var(--cocoon-github-color);
}

.bc-brand-color a.feedly-button {
    color:var(--cocoon-feedly-color);
}

.bc-brand-color a.rss-button {
    color:var(--cocoon-rss-color);
}

.sns-share-message, .sns-follow-message,span.related-entry-main-heading.main-caption,.comment-title{
    font-size:0;
    text-align: center;
   display: block;
    margin: 50px;
　  border-bottom:5px solid;
}

.sns-share.ss-high-and-low-lc a .social-icon.button-caption, .sns-share.ss-high-and-low-cl a .social-icon.button-caption, .sns-share.ss-high-and-low-lc a .button-caption.button-caption, .sns-share.ss-high-and-low-cl a .button-caption.button-caption {
    font-size: 10px;
}

.sns-share-message:before,.sns-follow-message:before,
span.related-entry-main-heading.main-caption:before,.comment-title:before{
    font-size: 16px;
  font-family: "Kaisei Decol", serif;
   font-weight: 100;
    padding: .5em;
   border-bottom: 2px solid whitesmoke;
    letter-spacing: .4em;
}

.sns-share-message:before{
    content:"SHARE";
}

.sns-follow-message:before{
   content:"FOLLOW";
}

span.related-entry-main-heading.main-caption:before{
    content:"MORE";
}

.comment-title:before{
    content:"COMMENTS";
}

.sns-share-message:before, .sns-follow-message:before, span.related-entry-main-heading.main-caption:before, .comment-title:before {
letter-spacing:.3em;
border-radius:2px;
border: 0;
padding: 0;
background-color:#727272;/*SHARE 背景色の変更はこちら*/
color:#efefef;
display: inline-block;
width: 40%;
}
.sns-share-message, .sns-follow-message, span.related-entry-main-heading.main-caption, .comment-title {
margin:20px 0 10px 0;
}
.sns-share.ss-high-and-low-lc a .button-caption.button-caption{
display:none;
}
.sns-share-buttons {
padding-right:10%;
padding-left:10%;	
}
.sns-share-buttons a {		
transition:0.5s;
}
.sns-share.ss-top.ss-col-6 a, .sns-share.ss-bottom.ss-col-6 a {/*設定したカラム数に応じて数字を変更してください(例：カラム6列→6)*/
width: 13%;
}
.sns-share.ss-high-and-low-lc a .social-icon{
font-size: 25px;
}
@media (max-width:480px){
.sns-share-message:before, .sns-follow-message:before, span.related-entry-main-heading.main-caption:before, .comment-title:before {
width: 55%;
}
.sns-share-buttons {
padding-right:5%;
padding-left:5%;
}
.sns-share.ss-top.ss-col-6 a, .sns-share.ss-bottom.ss-col-6 a {/*設定したカラム数に応じて数字を変更してください(例：カラム6列→6)*/
width: 15%;
}
.sns-share.ss-high-and-low-lc a .social-icon{
font-size: 20px;
}
}