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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* 見出しの装飾リセット */
/*H1*/
.article h1{
	margin-top:30px;
}
/* H2 */
.article h2{
  border-top:none;
  border-bottom:none;
  border-left:none;
  border-right:none;
  background:none;
  padding-bottom:0;
  margin-bottom: 20px;
  padding-top:0;
  margin-top: 0;
  }

  
  /* H3 */
  .article h3{
  border-top:none;
  border-bottom:none;
  border-right:none;
  border-left: none;
  }
  
  /* H4 */
  .article h4{
  border-top:none;
  border-bottom:none;
  padding: 0;
  }
  
  /* H5 */
  .article h5{
  border-bottom:none;
  padding: 0;
  margin-bottom:0;
  padding-top:10px;
  padding-left:20px;
  }
  
  /* H6 */
  .article h6{
  border-bottom:none;
  padding: 0;
  }

  .main{
	background-color: transparent;
	padding-top:0;
	padding-bottom:0;
  }
  .logo-header {
	display: none;
  }
  #content{
	margin-top:0;
  }
  a{
	color:#924f26;
  }
	a:hover{
	color:#ffeb9b;
  }


  .wp-block-post-title a{
		color:#924f26;
	}
	.wp-block-post-excerpt__more-text a{
		color:#924f26;
	}
/*アニメーション*/
.fade-in{
	animation: fadeIn 1.5s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.slide-in{
  animation: slideIn 1.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes slideIn {
  0% {
    transform: translateX(180px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}
.wp-block-cover-image{
	background-position:0 0;
}

@media screen and (min-width: 835px){
	  /*TOPPAGE*/
	  .full-width{
		margin-left:-29px;
		margin-right:-29px;
	  }
	  .content-width{
		width:1000px;
		margin:auto;
	  }
	.middle-width{
		width:1100px;
	}
	  .side-index{
		background-color: #ffeb9b;
	  }
	  p{
		padding:20px;
	  }

	.article p{
		margin-bottom:0;
	}
	img{
		padding:5px;
	}
	.sidebar{
		background-color:transparent;
	}
	.sidebar h2{
		background-color:none;
		border-left:6px solid #ffeb9b;
		border-bottom:2px solid #ffeb9b;
		border-radius:20px;
	}


	.lesson{
	  box-sizing:border-box;
	  background-color:white;
	  height:210px;
	  width:410px;
	  padding-left:8px;
	  padding-right:8px;
	  border-radius: 30px;
	}
	.lesson p{
		padding:2px;
		padding-top:16px;
	}
	.lesson:hover{
	  border:2px solid #ffeb9b;
	  border-radius:30px;
	  box-sizing:border-box;
	}
	.lesson:hover::before{
	  content:'';
	  position:absolute;
	  display: inline-block;
	  background-image:url(/wp-content/uploads/2024/08/て-5.png);
	  width:100px;
	  height:100px;
	  background-size: contain;
	  vertical-align: middle;
	  margin-top:-90px;
	  margin-left:100px;
	}
	.lesson-link{
		text-decoration:none;
		color:#924f26;
	}
	.lesson-link:hover{
		color:#924f26;
	}



	/*教室案内*/
	h1{
		text-align:center;
	}
	.article h4{
		background-color:#ffeb9b;
		padding:20px;
		margin-top:20px
	}
	.pan{
		background-image:url(/wp-content/uploads/2024/08/2-3.png);
		background-size:cover;
	}
	.back-color{
		background-color:rgba(255,255,255,0.7);
	}

	.top-img{
		margin-top:-24px
	}
	hr{
		color:#ffeb9b;
	}

	.hukidashi{
		margin-top:-20px;
	}
	.hukidashi_txt{
		width:600px;
		margin:auto;
	}

	.entry-content{
		margin-bottom:0;
	}
	.top-footer{
		bottom:-40px;
		padding-top:30px;
		padding-bottom:50px;
	}
	.course{
	border:4px dotted #ffeb9b;
	border-radius:20px;
	padding:4px;
	}

	/*投稿一覧ページ*/
	.post-date{
		display:none;
	}
	.widget-entry-cards:not(.large-thumb-on) .card-title{
		padding:20px;
		font-size:22px;
	}
	.related-entry-card-title, .entry-card-title{
		padding:20px;
		font-size:22px
	}
	.related-entry-card-snippet, .entry-card-snippet{
		padding:20px;
	}
	.blogcard-thumbnail img, .card-thumb img{
		height:250px
	}

	/*よくある質問*/
	.toggle-button{
		padding:20px;
		margin:10px;
	}

	.smp-only{
		display:none;
	}
}

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

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

	h2 span{
		display:block;
	}
	
	  /*TOPPAGE*/
	  .main{
		padding-top:0;
		padding-bottom:0;
	  }
	.no-sidebar .content .main{
		padding-bottom:0;
	}
	.top-img{
		margin-top:-10px;
	}
	  .content-width{
		width:90%;
		margin:auto;
	  }
	 .full-width{
		margin-left:-16px;
		margin-right:-16px;
	  }
	  .side-index{
		background-color: #ffeb9b;
	  }
	  p{
		padding:20px;
	  }
	
	.article p{
		margin-bottom:0;
	}
	img{
		padding:5px;
	}
	.sidebar{
		background-color:transparent;
	}
	.sidebar h2{
		background-color:none;
		border-left:6px solid #ffeb9b;
		border-bottom:2px solid #ffeb9b;
		border-radius:20px;
	}

	.lesson{
	  box-sizing:border-box;
	  background-color:white;
	  padding:8px;
	  border-radius: 30px;
	}
	.lesson p{
		padding:2px;
		padding-top:14px;
	}
	.lesson-link{
		text-decoration:none;
		color:#924f26;
	}

	/*フッターを消す*/
	.internal-blogcard-footer{
		display: none
	}
	.blogcard-thumb-image{
		height:140px;
		width:140px;
		object-fit:cover;
	}

	/*教室案内*/
	h1{
		text-align:center;
	}
	.article h4{
		background-color:#ffeb9b;
		padding:20px;
		margin-top:20px
	}
	.pan{
		background-image:url(/wp-content/uploads/2024/08/2-3.png);
		background-size:cover;
	}
	.back-color{
		background-color:rgba(255,255,255,0.7);
	}

	.top-img{
		margin-top:-24px
	}
	hr{
		color:#ffeb9b;
	}

	.hukidashi{
		margin-top:-20px;
	}
	.hukidashi_txt{
		width:80%;
		margin:auto;
	}

	.entry-content{
		margin-bottom:0;
	}
	.top-footer{
		bottom:-32px;
		padding-top:30px;
		padding-bottom:50px;
	}
	.course{
	border:4px dotted #ffeb9b;
	border-radius:20px;
	padding:4px;
	}

	/*投稿一覧ページ*/
	.post-date{
		display:none;
	}
	.blogcard-thumbnail img, .card-thumb img{
		height:120px;
	}
	.related-entry-card-title, .entry-card-title{
		padding:10px;
		font-size:18px;
	}
	.article ul{
		padding-left:0;
	}

	
	/*よくある質問*/
	.toggle-button{
		padding:10px;
		margin:10px;
	}

	.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
		color:#924f26;
	}

	.pc-only{
		display:none;
	}
}

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