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

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

/*スマホでも2カラムを横表示にする*/
.wp-block-columns {
	flex-wrap: nowrap;important!
}

/スマホ横並び維持/
.wp-block-columns {
flex-wrap: nowrap;
}

/*ヘッダーの文字と背景の色を変える*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background-color: #474747;
	color: #FFFFFF;
    height: 60px;
}

.logo-menu-button.menu-button{
	background-color: #474747;
    height: 60px;
}

/* フッターモバイルボタン透明背景色（スマホ） */
.mobile-menu-buttons {
background: rgba(112,82,64,0.5); /* RGBA形式で半透明にする */
color: #FFFFFF;
}



/*768px以下でロゴの大きさ変更*/
@media screen and (max-width: 768px){
img.site-logo-image{
	width: 250px;
	margin: 1px auto 0;
}
}
/*スライドインメニューをカスタマイズ*/
.navi-menu-content{
	left: auto;
	right: 0;
	background-color: rgba(112,82,64,0.5);
	transform: translateX(101%);
}

.menu-drawer a{
	font-size: 1.1em;/*文字の大きさ*/
	color: #fff;/*文字の色*/
	height: 3em;/*行の高さ*/
}

.menu-drawer a:hover{
	color: rgba(255,255,255,0.7);
	background-color: rgba(30,124,209,0);
}

#navi .navi-in > ul li{
	height: 40px;
	line-height: 40px;
}

.content { 
margin-top: 0; 
}

.header {
  background-size: contain;
}
.header div.header-in {
  min-height: calc( ( 100vw - var( --scrollbar-width, 17px)) * 480 / 1920);
}

.footer{
	font-size :12px;
}

.appeal-content {
background-color: rgba(230, 188, 135, 0.5);
color:#560d04;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

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

.entry-title{
	display: none;
}

.home.page .entry-title,
.home.page .sns-share,
.home.page .sns-follow,
.home.page .date-tags,
.home.page .author-info{
display: none;
}

/*1023px以下でロゴを消す*/
@media screen and (max-width: 1023px){
	img.site-logo-image{
		visibility: hidden;
	}
}

/*1023px以下でモバイル用のロゴ表示*/
@media screen and (max-width: 1023px){
	.logo-menu-button.menu-button{
		background-image: url(https://petsym.com/wp-content/uploads/2025/09/Untitled-design.png);
		background-size: auto 50px;
		background-position: center;
		background-repeat: no-repeat;
}
}