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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*決まりごとメモ*/
/**文字の大きさはこっちで決めているのでptじゃなくてemで決めること**/
/**文字のカラーは333333**/
/**白のカラーはfffdfa**/


/*ここからコードを書く*/

/************************************
** grayishスキンの内容を上書きするCSSたち
************************************/

/* grayishスキンのトップMVスクロール誘導（Scroll + 矢印）を完全に非表示 */
.skinadd-topmv-scroll {
  display: none !important;
}

/* Grayishスキンの関連記事を非表示 */
.related-entries,
.entry-related {
  display: none !important;
}

/* ヘッダーを60px下にずらして、グローバルナビと重なりを防ぐ */
.skin-grayish .header-container {
  margin-top: 60px !important;          /* これで60px下に下がる */
  position: relative;
  z-index: 1;                           /* 必要に応じて */
}

/* ヘッダー高さの基本設定（トップページ用：300pxのまま） */
.skin-grayish.front-top-page .header-container,
.skin-grayish.front-top-page .header {
  height: 300px !important;
  min-height: 300px !important;
}

/* 投稿ページ・固定ページなど（トップページ以外）：ヘッダー高さを自動/デフォルトに戻す */
.skin-grayish:not(.front-top-page) .header-container,
.skin-grayish:not(.front-top-page) .header {
  height: auto !important;          /* 高さ自動に戻す */
  min-height: unset !important;     /* min-height解除 */
}

/* グローバルナビ自体を固定高さ（例: 60px）に戻す（全ページ共通） */
.skin-grayish #navi-in,
.skin-grayish #navi {
  height: 60px !important;          /* ご希望の60pxに固定 */
  line-height: 60px !important;     /* 文字の縦中央揃え用 */
}

/* 投稿ページでナビが変に広がらないようpadding/margin調整 */
.skin-grayish:not(.front-top-page) #navi-in {
  padding: 0 !important;
  margin: 0 !important;
}

/* 必要に応じて：スクロール固定時のナビ高さも統一 */
.skin-grayish #navi.fixed #navi-in {
  height: 60px !important;
}

/* ヘッダー背景画像を上下左右中央寄せ + 高さにフィット（縮小して全体表示） */
.skin-grayish .header-container .header {
  background-position: center center !important;  /* 上下左右中央 */
  background-size: contain !important;            /* 高さに合わせて縮小（はみ出さない） */
  background-repeat: no-repeat !important;
}




/************************************
** カスタムテキスト
************************************/

/*カスタムテキスト1　大きい文字*/
.cocoon-custom-text-1{
	font-size: 1.6em;
	font-weight: bold;
}

/*カスタムテキスト2　ちょっと大きい文字*/
.cocoon-custom-text-2{
	font-size: 1.2em;
	font-weight: bold;
}

/*カスタムテキスト3　小さい文字*/
.cocoon-custom-text-3{
	font-size: 0.7em;
}



/************************************
** トグル
************************************/

/*トグルを左寄せ*/
.toggle-button {
	text-align: left;
	font-weight: bold;
}











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


@media screen and (min-width: 1024px){
}

/*1023px以下*/
@media screen and (max-width: 1023px){
}

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

/*799px以下*/
@media screen and (max-width: 799px){
	.body, .menu-content {
		font-size: 13px;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){

}