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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*非表示にするもの*/

/*ﾌｯﾀｰﾀｲﾄﾙ非表示*/
.entry-footer{
	display:none;
}
/*ﾒｲﾝｲﾒｰｼﾞ 下の投稿日非表示*/
.date-tags{
	display:none;
}
.footer-bottom-logo{
	display:none;
}


/*全体のｽﾀｲﾙ*/

/*ﾃｷｽﾄﾃﾞｺﾚｰｼｮﾝとﾘｽﾄｽﾀｲﾙ*/
.cat-item a{
text-decoration:none;
color:#333333;}
div.sitemap ul li{
list-style:none;
}
a{
	text-decoration:none;
	color:#333333;
}






/*  body 背景設定（ｱﾆﾒｰｼｮﾝ含む）*/
body{
  font-family: "Yomogi", serif;
  font-weight: 600;
  font-style: normal;
 background-image:url(https://komomo-design.com/wp-content/uploads/2025/06/24970107-scaled.jpg); 
background-repeat:repeat;
}


/*  main*/

/*  main背景の透過 */
.main{
	background-color:transparent;
}

/*header*/

/*  header 背景透過*/

.header-container{
background-color:transparent;
}
/*   header ｱｲｺﾝのｻｲｽﾞ指定*/

span.site-name-text img{
	width:100px;
}
/*navi*/
.navi{
	background-color:#fffacd;
}
/*footer背景*/
.footer{
	background-color:transparent;
}


/*新着記事に日付を表示する*/
.new-entry-card-date {
  display: block;
}

/*  投稿記事に出るカテゴリー非表示*/
span.cat-label{
	display:none;
}
/*投稿記事に出る前後送りﾎﾞﾀﾝ画像非表示*/
.prev-post-thumb,
.next-post-thumb{
  display:none;
}
/*投稿記事に出るｻﾑﾈｲﾙ画像非表示*/
/* .new-entry-card-thumb.widget-entry-card-thumb.card-thumb {
  display: none;
} */


/*metasliderの設定*/

/*sliderのサイズと位置*/
div#metaslider_1706{
	max-width:1480px;

    margin:0 auto;
}

div#metaslider_1706 img{

	box-shadow:  0 10px 25px 0 rgba(0, 0, 0, .5);
	
}

/*sliderとｶﾗﾑの幅を合わせる*/
.wp-block-media-text{
	max-width:980px;
	margin:0 auto;
	animation: fadeIn 5s ease 1s 1 normal backwards;
}
/*   h2   */
h2.wp-block-heading{
	background-color:#fff;
	
}
/* mediaとtext */

div.mediatext1 img,
div.mediatext2 img,
div.mediatext3 img,
div.mediatext4 img
{
	width:150px;
	height:150px;
	object-fit: cover;
	border-radius:50%;
	display:block;
	margin:0 auto;
}
.wp-block-heading{
	width:300px;
	margin:0 auto;
}
.fa-paw{
	animation: shake-up 3s infinite ease-in-out;
}
@keyframes shake-up {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(5px);
    }
}

.wp-block-media-text {
	background-color:#fff;
	padding:50px;
	box-shadow:  0 10px 25px 0 rgba(0, 0, 0, .5);
}
.wp-block-column img{
	width:300px;
	height:300px;
	object-fit:cover;
	border-radius:20px;
}

div.mediatext1 figure.wp-block-media-text__media{
	background-image:url(https://komomo-design.com/wp-content/uploads/2025/06/bg11.png);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:bottom;
}

div.mediatext3 figure.wp-block-media-text__media{
	background-image:url(https://komomo-design.com/wp-content/uploads/2025/06/bg12.png);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:bottom;
} 

/*  投稿記事の行間*/

.widget-entry-cards .a-wrap{
	line-height:2;

}

/*  投稿ページsingleの設定*/
.new-entry-cards {
	width:300px;
	margin:0 auto;
	
}


/*  投稿ページの背景画像色　しろ*/
.single .container{
	background-image:none;
	background-color:#fff;
}
/*  投稿ページsingle ﾍｯﾀﾞｰ画像*/

.single .header{
	background-image:url(https://komomo-design.com/wp-content/uploads/2022/07/leonardo-wong-7pGehyH7o64-unsplash-scaled-e1657683191587.jpg);
	height:300px;
}

/*  投稿ページ　画像　*/
.wp-block-image img{
	border-radius:20px;
	width:300px;
	height:300px;
	object-fit:cover;
	
}

/*  アーカイブページの背景画像*/
/* .archive .container{
	background-image:none;
	background-color:#fff;
} */

/*ｻｲﾄﾏｯﾌﾟの設定*/
.sitemap h2{
	display:none;
}
.sitemap {
	width:300px;
	margin:0 auto;
	
}
/*  ﾎﾞﾀﾝの設定*/
div.wp-block-button{
	background-color:pink;
}

/*  instagram ｱｲｺﾝ ｱﾆﾒｰｼｮﾝ */


/*  ページ送り*/
.prev-post-title,
.next-post-title{
	
} 

/*  固定ページ*/

/*  フェードイン　*/
.box1
{
	height:200px;
	width:200px;
	background-color:pink;
	animation-name: page ;
    animation-duration:6s;
}
	@keyframes page {
      0% {
          opacity: 0;;
      }
      100% {
          opacity: 1;;
      }
  }
.box2{
	height:200px;
	width:200px;
	background-color:pink;
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom {
   0% {
      opacity: 0;
      transform: translateY(100px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}


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

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.wp-block-column .wp-block-image img{
	margin:0 auto;
}
	.sitemap {
	margin:0 auto;
}
}
	
	
	
/*600px以下*/
@media screen and (max-width: 600px){
  /*必要ならばここにコードを書く*/
	div.mediatext1 img,
	div.mediatext2 img,
	div.mediatext3 img,
	div.mediatext4 img{
	margin-bottom:50px;
	}
	.wp-block-media-text__content{
		width:15em;
		margin:0 auto;
	}
	
}
/*480px以下*/
@media screen and (max-width: 480px){
  /*slider 画像のサイズと位置*/
div#metaslider_1706 img{
	height:50vh;
	object-fit:cover;
} 



}