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

/*------------以下 追加------------*/
/*header 背景 img*/
.signboard { width: 100%; padding: 30px; background-image: url(../img/head-fiore.png);
background-repeat: no-repeat; background-size: cover; background-position: center; height: 400px; position: relative; }

/*header 背景 画像 / カラー / オーバーレイ*/
.signboard::before { content: ""; width: 100%; height: 100%; background-color: rgba(21, 112, 110, 0.2); /*header 背景 img+over_color*/
position: absolute; top: 0; left: 0; z-index: 1; }
.signboard { align-items: center; } /*display: flex;*/
.signboard_textarea { color: #fff; position: relative; z-index: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.signboard_headline { font-size: 3rem; margin-bottom: 20px; }

/*背景 グラデーションカラー*/
/*background: linear-gradient(90deg, rgba(65, 67, 58, 0.76) 32%, rgba(253, 219, 146, 0) 99%, rgba(201, 211, 211, 0.25));*/
.bg-grad_color { background: linear-gradient(to bottom, #f3fbfc, #65bece); }/*background: linear-gradient*/

/*カバー div 横幅100%*/
.my-cover-full{
margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
width: 100vw;
}

/*タイトル削除*/
.page .entry-title{
  display: none;
}

/*画像色変換*/
.link_box img {
  filter: grayscale(100%);
  transition: all 0.3s ease-in;
}

img:hover {
  filter: grayscale(0%);
}

/*キャプション テキストサイズ*/
.wp-block-image figcaption {
	margin: 0;
	color: #383b40;
	font-size: 1em;
	text-align: center;
}


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


/*SNSシェアボタン*/
.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 5px; /*ボタン同士の間隔（カスタマイズを！）*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅（カスタマイズを！）*/
	height: 40px; /*ボタンの高さ（カスタマイズを！）*/
}

/*SNSフォローボタン*/
.sns-follow-message{
	font-weight: bold; /*太字にする*/
	color: #875d5b; /*文字色を指定*/
}
.sns-follow-buttons {
	justify-content: center; /*中央揃え*/
}
.sns-follow-buttons a {
	border-radius: 50%; /*アイコンを丸くする（カスタマイズを！）*/
	font-size: 20px; /*アイコンのサイズ（カスタマイズを！）*/
	margin: 0 5px; /*ボタンの間隔（カスタマイズを！）*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅（カスタマイズを！）*/
	height: 40px; /*ボタンの高さ（（カスタマイズを！）*/
}

/*SNSフォローボタン*/
.style7 {background-color:#b9e5e6;}