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

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


/* ① Googleフォント（Noto Sans Mono）を読み込むコード */
@import url('https://googleapis.com');

/* ② サイトタイトルに適用 */
.site-name-text,
.logo-header .site-name-text a {
    font-family: 'Noto Sans Mono', monospace;
    font-weight: 700;
}

/* ③ 記事内の見出し（H2, H3, H4）に適用 */
.article h2, .article h3, .article h4 {
    font-family: 'Noto Sans Mono', monospace;
    font-size: 1.8rem; font-weight: 500; letter-spacing:1px;
    background: none !important; /* 背景をなしにする */
    background-color: transparent !important; /* 背景色を透明にする */
}


/* サイト背景色 */
body {background-color:#fff;}

#header-container {background-color: none;}


/* PC用：固定ヘッダー（ヘッダーコンテナ）を最前面にする */
.fixed-header {
    z-index: 9999 !important;
}


/* モバヘッダーメニューバー */
.mobile-menu-buttons {
background-color: rgba(255,255,255,0);
}

/* モバヘッダーサーチボタン */
.search-menu-button {display: none !important;}

/* ハンバーガーメニューキャプション */
.menu-caption {display: none !important;}

/* モバヘッダーメニューバーの余白割り当ての調整 */
.logo-menu-button {flex-grow: 0;}

/* モバヘッダーロゴ&メニューボタンデザイン調整 */
.mobile-menu-buttons .menu-button {width: 41px; height: 41px; margin: 0 0.4rem; border:3px solid #174308; border-radius: 50%;}
.mobile-menu-buttons .menu-icon {font-size:21px; padding-top: 2px;}

/* モバヘッダーロゴ&メニューボタン並び順調整 */
.mobile-header-menu-buttons {flex-direction: row-reverse;}

/* PCヘッダー高さ調整 */
.header-container {height: 80px;}

/* PCヘッダー境界ドロップシャドウ調整 */
.fixed-header {box-shadow: none;}

/* PC追尾ヘッダー調整 */
.header-container-in {align-items: center; padding-top: 10px;}

/* PC追従ヘッダーの背景を透明に */
.header-container {background-color: rgba(255, 255, 255, 0) ;}
.navi {background-color: rgba(255, 255, 255, 0) ;}

/* PC固定ヘッダーメーニューデザイン調整 */
.menu-header li {margin: 14px 10px;	border: 3px solid #174308; border-radius: 24px;	height:36px !important;}

/* PC追従ヘッダーボタンホバー調整 */
.menu-item a:hover {border-radius: 24px; background-color: rgba(255, 255, 255, 0.8) ;}


/* フッター上下余白調整 */
.footer-mobile, .footer-left, .footer-center, .footer-right {padding: 0 !important;}

/* PCフッターロゴ&下線デザイン調整 */
.footer-center {height:60px; background-image: linear-gradient(to bottom, transparent 36%, #174308 36%, #174308 64%, transparent 64%);}
.footer-left {display: none;}
.footer-right {display: none;}
.footer-center img {width:60px; height:auto;}

/* モバイルフッターロゴ&下線デザイン調整 */
.footer-mobile {background-image: linear-gradient(to bottom, transparent 36%, #174308 36%, #174308 64%, transparent 64%)}

/* PCフッターメニューデザイン調整 */
.navi-footer-in > .menu-footer li {margin: 14px 10px; padding: 0.2em 1.4em 0; border: 3px solid #174308; border-radius: 24px; height:36px !important;}
.navi-footer-in > .menu-footer li:last-child {border: 3px solid #174308; border-radius: 24px; height:36px !important;}

/* フッター上下余白調整 */
.footer-widgets, .footer-widgets-mobile {margin: 0 auto;}

/* メインコンテンツ部分幅調整 */
.content {width: 100%; max-width: 1000px; margin: 0 auto;}
/* メインコンテンツ上部余白調整 */
.main {padding-top: 0 !important;}

/* メインコンテンツ動画はめ込み上部余白調整 */
.video-container .video { margin-top: 0 !important;}

/* メインコンテンツ動画はめ込み幅調整 */
.video-container, .instagram-container, .facebook-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.entry-content {margin-bottom: 0 !important;}



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

	/* ページ上部のロゴをモバイルで非表示 */
	.header-in {display: none !important;}
	.header-container {display: none;}

	/* モバヘッドメニューバーのドロップシャドー */
	.mobile-header-menu-buttons {
		box-shadow: 0 0 0px darkgrey;
		margin-top: 6px;
	}

	
}


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

	/*モバイルフッターロゴサイズ*/
	.footer-mobile img {width:12%; max-width: 45px;}

	/* モバイルフッターメニューデザイン調整 */
	.navi-footer-in > .menu-footer li {max-width: 200px; margin: 6px !important; padding: 0.2em 0.4em 0 !important; border: 3px solid #174308 !important; border-radius: 24px; height:33px !important;}

	/* メインコンテンツ部分幅調整 */
	.content {width: 100%; max-width: 834px; margin: 0 auto;}
	.no-scrollable-main .main {padding: 0;}
}


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

}


   /* ロゴ項目の余白や位置を調整 */
   .menu-item-logo a {
       padding: 0 15px !important; /* 左右の余白 */
       background: none !important; /* 背景色がいらない場合 */
   }
   .menu-item-logo img {
       max-height: 100%; /* メニューの高さに合わせる */
   }




/* コピーライト調整 */
.copyright {
	margin-top: 24px;
	font-size: 9px;
	color: #656356;
}

@media screen and (min-width: 1023px) {
	.copyright { font-size: 12px;}
}