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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*下記追加cssを設定したブロックの幅を全画面にする

.custom-block-fullwidth {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    padding: 0 calc(50vw - 50%);
}
*/

/*固定ページのカラム背景を透明にする*/
#main {
	background:transparent;
	margin-bottom:0px;
	padding-bottom:0px;
}

/*日付時間を非表示にする*/
.page .date-tags {
display: none;
}

/*各固定ページの背景を個別に設定*/
#body{
	background-color:#f8f5f0;
}

/*下記追加cssを設定したブロックの色を白半透明にする*/
.block-background-color{
	background-color:#ffffff80;
}

/*下記追加cssを設定したブロックの背景を透明にする*/
.block-background-transparent{
	background-color:transparent;
}

/*お知らせ一覧のデザイン*/
.news_date_title{
	background-color:transparent;
	padding:3px;
	color:#4b4043;
	font-size:16px;
	width:85vw;
	position:absolute;
	left:50%;
	transform:translatex(-50%);
}

/*追加cssを設定したブロックの文字サイズを変更する*/
.block-font-size{
	font-size:16px!important;
}

/*追加cssを設定したブロックの幅を変更*/
.block-width{
	position:relative;
	left:50%;
	transform:translatex(-50%);
	width:85vw;
}

/*フッターのデザイン変更
#footer{
	height:40px;
}
*/
/*フッターの上の空白を削除*/
#footer{
	margin-top:0px;
	padding-top:0px;
}

/*rechapchaのロゴを消す*/
.grecaptcha-badge { 
	visibility: hidden;
}

/*ヘッダーモバイルボタンの文字色と背景色を変更*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button,
.mobile-menu-buttons,
.logo-menu-button.menu-button{
	background: #f8f5f070;
	color: #4b4043;
	border-bottom-color:#00000000;
	height:60px;
	box-shadow:none;
}

/*モバイルでハンバーガーメニューを押したら出てくるスライドインメニュー*/
.navi-menu-content{
	background-color:#ffffff99;
	width:50%;
	color:#4b4043;
	font-weight:bold;
}
.navi-menu-close-button .fa.fa-close{
	visibility:hidden;
}

/* MetaSlider on FlexSlider */
.flexslider .slides img{
	padding:0 !important;
	margin:0 calc(50% - 50vw)!important;
	width:100vw !important;
}

/*お知らせ*/
.news_date_title{
	color:#4b4043;
	font-size:18px;
	font-family:'noto serif jp';
}

/*固定ページのタイトル非表示*/
.page-id-193 h1.entry-title{
	display:none;
}

/*全ページの詩*/
.wp-block-verse{
 border:none;
 background-color:transparent;
}

/*モバイルヘッダーメニューの検索を非表示にする*/
.search-menu-button.menu-button{
	visibility:hidden;
}
/*モバイルヘッダーメニューの画像を中央に寄せたい、けど下記だとうまくいかん笑
.logo-menu-button.menu-button.menu-button-in.site-logo-image{
	margin-right:30px;
}
*/

/*PCで下にスクロールした時に出るヘッダーメニュー
.header-container-in.header-container-in.cl-slim.hlt-top-menu.wrap{
	height:auto;文字には合うけどロゴ画像がちょっとはみ出る、あとまわし
}
*/
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
  /*モバイルヘッダー下メニューの幅をテキストに合わせる
	.navi ul{
		display: flex;
	}
	.navi li{
		flex:1 1;
	}
	*/
}