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

/************************************
** 子テーマ用のスタイルを書く
************************************/
.only-sp {
	display: none;
}

.content-in {
	justify-content: center;
    gap: 30px;
}

.main {
	width: clamp(650px, calc(650 / 1024 * 100vw), 830px);
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
	.search-menu-button {
		display:none !important;
	}
	
	.mobile-header-menu-buttons {
		flex-direction: row-reverse;
		padding: 5px 20px;
	}
	
	.navi-menu-caption {
		display: none !important;
	}
	
	.logo-menu-button {
		flex-grow: unset;
	}
	
	.logo-menu-button img {
		max-height: unset;
		width: 60px;
	}
	
	.menu-close-button {
		text-align: left;
		padding-left: 22px;
		margin-top: 20px;
	}
	
	.menu-drawer {
		padding-top:10px !important;
		display:flex;
		flex-direction: column;
		gap: 10px !important;
	}
	
	.column-wrap {
		justify-content: center;
	}
	
	.column-wrap.column-3 > div {
		width: 30%;
	}

	/*アーカイブページ*/
	.list {
		padding: 0 20px;
	}
	
	/*サイドバー*/
	.sidebar {
		width: clamp(450px, 50%, 520px) !important;
		margin: 0 auto !important;
	}
	
	/*投稿ページ*/
	.breadcrumb {
		width: 750px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.body.single-post article.article.type-post {
		width: 750px;
		margin: 0 auto;
	}
	
	.related-entry-heading {
		width: 750px;
		margin: 15px auto;
	}
	
	.related-list {
		width: 750px;
		margin: 0 auto;
	}
}

/*835px以下*/
@media screen and (max-width: 835px){
	.column-wrap > div {
		margin: 0 auto;
	}
	
	.feature__column {
		padding: 10px !important;
	}
	
	.feature__head {
		font-size: clamp(15px ,calc(16 / 835 * 100vw) , 16px) !important;
		text-align: center;
	}
	
	.column-wrap.column-3 > div {
		width: 40%;
		min-width: 280px;
	}
	
	.profile__image {
		width: 134px;
	}
	
	.profile__column-right {
		width: 600px !important;
	}
	
	/*アーカイブページ*/
	.entry-card-title {
		font-size: 24px !important;
	}
	
	/*サイドバー*/
	.sidebar {
		width: 400px !important;
	}
	
	/*投稿ページ*/
	.breadcrumb {
		width: 600px;
		margin: 2em auto;
	}
	
	.body.single-post article.article.type-post {
		width: 600px;
		margin: 0 auto;
	}
	
	.related-entry-heading {
		width: 600px;
		margin: 15px auto;
	}
	
	.related-list {
		width: 600px;
		margin: 0 auto;
	}

}

/*767px以下*/
@media screen and (max-width: 767px){
	.problem__heading {
		font-size: clamp( 18px ,calc(24 / 767 * 100vw) , 28px) !important;
	}
	
	.problem__list {
		font-size: clamp( 13.5px ,calc(16 / 767 * 100vw) , 16px) !important;
	}
	
	.sub-section__text {
		font-size: clamp( 14px ,calc(17 / 767 * 100vw) , 17px) !important;
	}
	
	.wp-block-media-text {
		margin-bottom: 10px !important;
		display: flex;
		gap: 10px;
		width: 278px;
		margin: 0 auto;
	}

	
	.wp-block-media-text__media img {
		width: 30px !important;
	}
	
	.sub-section__right-text {
		font-size: clamp( 14px ,calc(14 / 767 * 100vw) , 16px) !important;
	}
	
	.profile__column-right {
		width: 410px !important;
	}
	
	.line-button {
		min-width: 150px !important;
	}
	
	/*投稿ページ*/
	.breadcrumb {
		width: clamp(440px, calc(440 / 480 * 100vw), 600px);
		margin: 2em auto;
	}
	
	.body.single-post article.article.type-post {
		width: clamp(440px, calc(440 / 480 * 100vw), 600px);
		margin: 0 auto;
	}
	
	.related-entry-heading {
		width: clamp(440px, calc(440 / 480 * 100vw), 600px);
		margin: 15px auto;
	}
	
	.related-list {
		width: clamp(440px, calc(440 / 480 * 100vw), 600px);
		margin: 0 auto;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
	.only-sp {
		display: block;
	}
	
	.problem__heading {
		font-size: clamp( 20px ,calc(24 / 480 * 100vw) , 28px) !important;
	}
	
	.sub-section__left-column img {
		width: clamp(280px, calc(350 / 480 * 100vw), 350px) !important;
		margin: 0 auto;
	}
	
	.schedule__text {
		padding-left: 0 !important;
	}
	
	.profile__column-right {
		width: 300px !important;
	}
	
	/*アーカイブページ*/
	.entry-card-title {
		font-size: 18px !important;
	}
	
	.entry-card-wrap {
		width: 80% !important;
	}
	
	.list {
		justify-content: center;
	}
	
	/*LINE登録ボタン*/
	.line-button {
		width: 60% !important;
	}
	
	.line-button a {
		font-size: 18px !important;
	}
	
	/*サイドバー*/
	.sidebar {
		width: 85% !important;
	}
	
	/*投稿ページ*/
	.breadcrumb {
		width: clamp(300px, calc(340 / 375 * 100vw), 500px);
		margin: 2em auto;
	}
	
	.body.single-post article.article.type-post {
		width: clamp(300px, calc(340 / 375 * 100vw), 500px);
		margin: 0 auto;
		padding: 10px 20px !important;
	}
	
	.related-entry-heading {
		width: clamp(300px, calc(340 / 375 * 100vw), 500px);
		margin: 15px auto;
	}
	
	.related-list {
		width: clamp(300px, calc(340 / 375 * 100vw), 500px);
		margin: 0 auto;
	}
	
	.entry-title {
		padding: 0;
	}
}