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

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

/* ヘッダー */
#header-container-in {
  display: flex;
  width: 100px;
  height: 82px;
  padding-left: calc(100% / 2 - 595px);
  background-color: #148900;
}
#header {
  display: inline-block;
  width: 200px;
  height: 80px;
}
#header-in.wrap {
  width: auto;
}
#navi {
  display: inline-block;
}
#navi-in.wrap {
  width: 990px;
}
/* メインメニュー白枠の上下に数pxの余白 */
.header-container {
  background-color: #148900;
  padding: 2px;
}
/* ページ上部メインメニュー(ナビ)に白枠 */
.menu-top.menu-header.menu-pc{
  border: solid white 1px;
}

/* 本文ヘッダー（ページタイトル）非表示 */
.entry-title{
  display: none;
}
/* 本文の投稿日と投稿者非表示 */
.page .date-tags,
.page .author-info {
  display: none;
}
/* パンくずリスト非表示 */
#breadcrumb {
  display: none;
}
/* 本文H2上のマージン調整 文字色 */
.body .article :is(h2) {
  margin-top: 30px;
  color: var(--hvn-white-color);
}

/* コンテンツ背景色と文字色 */
.body.hvn-content-border > div {
  --content-bgcolor: var(--body-color);
  color: var(--text-color);
}
/* モバイル左メニュー文字色 */
.menu-drawer a {
  color: var(--text-color);
}
/* モバイル右サイドメバー文字色 */
.mobile-menu-buttons {
  color: var(--text-color);
}
/* テーブルヘッダー背景色と文字色 */
.body table th {
  background-color: var(--main-color);
  color: var(--hvn-white-color);
  border-color: var(--main-color);
}
/* スマホのみ改行 */
br.bank {
  display: none;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
  #header-container-in, #header {
    display: none;
  }
}

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

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

/*600px以下*/
@media screen and (max-width: 600px){
  /* はじめての方へ 小項目表示順入れ替え */
  .reverse-on-mobile-grid.wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__content {
    grid-row: 1; /* テキストを上に */
  }
  .reverse-on-mobile-grid.wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__media {
    grid-row: 2; /* 画像を下に */
  }
  /* ホーム 教会名ルビを少しだけ上に */
  .title-ruby rt {
    translate: 0 -2px;
  }
  /* スマホのみ改行 */
  br.bank {
    display: block;
  }
}
/* ホーム 教会名ルビを少しだけ上に(firefox) */
@-moz-document url-prefix() {
@media screen and (max-width: 600px){
    .title-ruby rt {
      position: relative;
      top: -3px;
    }
  }
}