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

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

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/


@media screen and (min-width: 900px) {
	svg .svg-elem-1 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.5s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.5s;
	}
	svg.active .svg-elem-1 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-2 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s;
	}
	svg.active .svg-elem-2 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-3 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.7s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.7s;
	}
	svg.active .svg-elem-3 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-4 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
	}
	svg.active .svg-elem-4 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-5 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
	}
	svg.active .svg-elem-5 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-6 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
	}
	svg.active .svg-elem-6 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-7 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
	}
	svg.active .svg-elem-7 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-8 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
	}
	svg.active .svg-elem-8 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-9 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
	}
	svg.active .svg-elem-9 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-10 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4s;
	}
	svg.active .svg-elem-10 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-11 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
	}
	svg.active .svg-elem-11 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-12 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
	}
	svg.active .svg-elem-12 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-13 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
	}
	svg.active .svg-elem-13 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-14 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s;
	}
	svg.active .svg-elem-14 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-15 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s;
	}
	svg.active .svg-elem-15 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-16 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2s;
	}
	svg.active .svg-elem-16 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-17 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s;
	}
	svg.active .svg-elem-17 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-18 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s;
	}
	svg.active .svg-elem-18 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-19 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s;
	}
	svg.active .svg-elem-19 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-20 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s;
	}
	svg.active .svg-elem-20 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-21 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s;
	}
	svg.active .svg-elem-21 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-22 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s;
	}
	svg.active .svg-elem-22 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-23 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s;
	}
	svg.active .svg-elem-23 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-24 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8000000000000003s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8000000000000003s;
	}
	svg.active .svg-elem-24 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-25 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s;
	}
	svg.active .svg-elem-25 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-26 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3s;
	}
	svg.active .svg-elem-26 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-27 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.1s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.1s;
	}
	svg.active .svg-elem-27 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-28 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2s;
	}
	svg.active .svg-elem-28 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-29 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.3000000000000003s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.3000000000000003s;
	}
	svg.active .svg-elem-29 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-30 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.4000000000000004s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.4000000000000004s;
	}
	svg.active .svg-elem-30 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-31 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5s;
	}
	svg.active .svg-elem-31 {
		fill: rgb(51, 51, 51);
	}
	svg .svg-elem-32 {
		fill: transparent;
		-webkit-transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.6s;
		transition: fill 0.3s cubic-bezier(0.47, 0, 0.745, 0.715) 3.6s;
	}
	svg.active .svg-elem-32 {
		fill: rgb(51, 51, 51);
	}
}

html {
    scroll-behavior: auto;  /* デフォはautoでカクつきを防止 */
}
/* reCAPTCHAのロゴを非表示 */
.grecaptcha-badge {
    visibility: hidden; 
}
img.decoration_chara.custom_chara_left{
	display: none;	
}
img.decoration_chara.custom_chara_center{
	display: none;	
}
img.decoration_chara.custom_chara_right{
	display: none;	
}

@media screen and (max-width: 901px) {
	.custom-header {display:none;}
	.decoration_chara{display:none;}
}

.logo svg{
	height:80px;
	width:auto;
	padding: 10px;
}

/*PC画面用*/
@media screen and (min-width: 900px) {
	.page-id-366 .main {
	    background-color: transparent;
	    padding: 0px;
	}

	/* #contentセレクタの修正 */
	.page-id-366 #content{
	    margin: 0;
	}

	/* .wrapセレクタの修正 */
	.page-id-366 .wrap{
	    width: 100%;
	    margin: 0 auto;
	}

	/* .containerセレクタの修正 */
	.page-id-366 .container{
	    max-width: 100%;
	    padding: 0;
	    font-size: 16px;
	}
	.custom-header {
		max-width: 1280px;
		height: 70px;
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		padding: 0px;
		z-index: 999;
		margin: 0 auto;
	}
	.custom-header .logo {
		justify-self: start;
	}
	.custom-header .logo img {
		height: 60px;
		max-width: 100%;
	}
	.custom-header .custom-nav {
		justify-self: end;
	}
	.custom-header .custom-nav ul {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		gap: 20px;
	}
	.custom-header .custom-nav ul li {
		margin-right: 20px;
	}
	.custom-header .custom-nav ul li a {
		color: #222;
		text-decoration: none;
		padding: 5px 10px;
	}
	.custom-nav {
		font-family: 'Lato', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
		letter-spacing: .12em;
		font-size: 0.9em;
	}
	.custom-nav ul li a span {
		color: #006363;
	}
	.custom_content {
		width: 100%;
		overflow: hidden;
		margin: 0;
		padding: 50px;
	}
	.custom_grid{
		display: grid;
	}
	.custom_grid.custom_top_content{
	  	grid-template-columns: 14fr 7fr 1fr;
  		grid-template-rows: auto auto;
  		gap:10px;
  		position:relative;
	}
	.custom_content .custom_content_area {
		max-width: 1280px;
		margin: 0 auto;
		display: grid;
	}
	#sineCanvas, #sineCanvas1 {
		margin: 0;
		display: flex;
	}
	.custom_wrapper {
		width: 100%;
		margin: 0;
		padding: 0;
		display: block;
	}
	.custom_wrapper.wb_white {
		background-color: #fcfcf7;
	}
	.custom_wrapper.wb_yellow {
		background-color: #faf8e6;
	}
	.custom_container {
		max-width: 1280px;
		margin: 0 auto;
		padding: 20px 0;
		position: relative;
	}

	.custom_item_cardblock {
		display: grid;
		background-color: #E2DAC6;
		margin: 0 auto;
		border-radius: 6px;s
		postion:relative;
	}
	.custom_item_cardblock .new-entry-cards{
		margin-bottom:0;
	}
	.custom_item_cardblock .widget-entry-cards .a-wrap{
		background-color: #FFFFFF;
		border-radius: 7px;
		margin-bottom:0;
	}
	.custom_item_cardblock.custom_new{
		display: grid;
		grid-template-columns:auto auto;
		grid-template-rows:285px auto;
		padding:20px;
		gap:10px;
	}
	.custom_new_top .a-wrap{
		height:285px;
	}
	.grid-item.custom_spacer{
		width:30px;
	}
	.custom_item_cardblock .custom_new_body .a-wrap{
		margin-bottom:5px;
	}
	.custom_new_top{
		grid-column: span 2;
	}
	.custom_item_cardblock .navi-entry-cards {
		display: grid;
		padding: 20px;
	    grid-template-columns: 1fr 1fr;
	    grid-template-rows:: 1fr 1fr;
		gap: 10px;
		justify-content: center;
		margin-bottom:0;
	}
	.decoration_chara{
		position: absolute;
	}
	.custom_recommend .decoration_chara{
	    height: 120px;
	    width: auto;
	    z-index: 800;
	    top: 1px;
	    left: 240px;
	}

	.custom_new .decoration_chara{
		display: none;
	}
	.custom_content.custom_cat_ranking{
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: auto auto;
		gap:0 20px;
		position: relative;
		margin:0 auto;
		width: 1000px;
	}
	.custom_cat_ranking .custome_title_img{
		text-align: center;
	}
	.custom_content.custom_cat_ranking img.cutome_rank_title{
		width:220px;
		height:auto;
		margin-bottom:10px;
	}
	.custom_cat_ranking .custom_item_cardblock{
		padding: 10px;
	}
	.custom_cat_ranking .custom_item_cardblock .a-wrap{
		margin-bottom: 10px;
	}
}



.footer-in.wrap{
	max-width:1280px;
}

/*固定ページタイトル中央寄せ*/
header.article-header.entry-header{
	max-width:100%	
}
header.article-header.entry-header h1{
	max-width:1280px;
	margin:0 auto;
}
.post-368 .custom_content{
	padding:0;
}