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

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


.tagline {
/*  text-align: center;*/
  text-align: left;
  font-size: 16px;
  margin: .6em 1em;
}

.logo {
/*  text-align: center;*/
  text-align: left;
  margin: -1em 0em;
}

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

/************************************
**　ヘッダーメニュー
************************************/
/*.navi-in > ul{/*メニューを中央に配置したい場合はこちらを削除してください*/
justify-content:flex-start;
}
*/

.navi-in>ul li {
line-height: 40px;
height: 40px;
}
.navi-in a{
font-size:18px;
}
#navi .navi-in a:hover {
transform: none!important;
}
.navi-in > ul .sub-menu a {
padding: 0;
}
.sub-menu{
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.26);
}
.sub-menu .caption-wrap {
color:#333;
border-top: dotted #dddddd;
background:#fff;
padding:0 0 0 2em;
margin:0;
}
.navi-in > ul .sub-menu a:hover {
transform: none!important;
}
div#header-container {
box-shadow: none;
}
div.item-label{
font-weight:bold;
}


/*SNSシェアボタン*/

#main .button-caption {
	display: none; /*キャプション非表示*/
}

.sns-share-message{
	font-weight: bold; /*太字*/
	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; /*ボタンの高さ*/
}

/*——————-
おすすめカード
———————-*/
div#recommended-in.recommended-in.wrap.cf{
margin-top: 20px;
max-height:220px;
}
@media screen and (min-width: 1024px){
div#recommended-in.recommended-in.wrap.cf{
padding:0 2em;
}}
div#content.content.cf{
margin-top:0;
}
.widget-entry-cards .a-wrap:hover {
transform: translateY(-1px);
transition: all .3s;
}
figure.navi-entry-card-thumb.widget-entry-card-thumb.card-thumb{
opacity:.8;
}
.recommended.rcs-center-white-title .a-wrap:hover .card-content {
transition: all .1s;
opacity: 1;
}
.widget-entry-cards.large-thumb-on .card-content{
background: rgba(151, 151, 151, 0);
}
a.navi-entry-card-link.widget-entry-card-link.a-wrap{
border-radius:10px!important;
margin:1em .5em;
background-color:#ffa5b4;/*Cocoon設定の「サイト背景色」に合わせてください*/
}
div.navi-entry-card-title.widget-entry-card-title.card-title{
/*color:#333333;*/
color:#ffffff;
font-weight:bold;
/*font-size:.8em;*/
font-size:1em;
/*background-color: rgba(255, 255, 255, 0.8);*/
background-color: rgba(255, 0, 0, 0.3);
padding: .6em .5em;
/*border-radius:30px;*/
border-radius:10px;
}


@media (max-width:834px){
a.navi-entry-card-link.widget-entry-card-link.a-wrap{
margin:.3em 0em;
}
div.navi-entry-card.widget-entry-card.e-card.cf{
border-radius:10px!important;
overflow:hidden;
max-height:100px;
margin:0 .3em 0;
box-shadow: 0px 1px 4px 0 rgba(0,0,0,.1)!important;
}
.widget-entry-cards.large-thumb-on .a-wrap:hover {
box-shadow:none;
}
}


@media (max-width:834px){
div.navi-entry-card-title.widget-entry-card-title.card-title{
font-size:.6em;
padding: .5em;
}
div#recommended-in.recommended-in.wrap.cf{
margin: .7em .2em .3em;
}
.widget-entry-cards.large-thumb-on .card-content{
background: rgba(151, 151, 151, 0.2);
}
}

main#main.main{
margin:0;
}

/************************************
**　RSSリスト本体
************************************/
ul.wp-block-rss{
    list-style: none;
    padding: 5px 15px 10px 15px;
    background-color: #fff;
    border: solid 2px #eaeaea;
}
ul.wp-block-rss::before{
    content: "RSS";
    color: #eaeaea;
    font-size: 18px;
}
/*リストアイテム*/
li.wp-block-rss__item{
    margin: 0 0 10px 0;
    padding: 0 0 10px 0;
    border-bottom: solid 1px #eaeaea;
}
/*記事タイトル*/
div.wp-block-rss__item-title a{

}
/*日付*/
time.wp-block-rss__item-publish-date{
    font-size: 12px;
    color: #6c7781;
}
/*投稿者*/
span.wp-block-rss__item-author{
    font-size: 10px;
    color: #6c7781;
}
/*抜粋*/
div.wp-block-rss__item-excerpt{
    font-size: 14px;
    color: #333a40;
　　font-weight: lighter;
}

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

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

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