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

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

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* === うめこカスタムデザイン開始 === */

/* === Google Fonts: Zen Maru Gothic (やわらかフォント) === */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@300;400;500&display=swap');

/* === 全体フォント・背景 === */
body, input, textarea, select, button {
  font-family: 'Zen Maru Gothic', 'Noto Sans JP', sans-serif !important;
  font-weight: 400 !important;
  background-color: #faf4ef !important;
  color: #4a3728 !important;
}

/* === コンテンツラッパー背景を統一 === */
#container, .wrap, #main, #content,
.main-wrap, .content-wrap, .site-main,
#primary, .l-main, #contents {
  background-color: #faf4ef !important;
}

/* === リンク === */
a { color: #c4787a !important; }
a:hover { color: #a05a5c !important; text-decoration: none !important; }

/* === ヘッダー === */
#header { background-color: #fdf8f4 !important; border-bottom: 2px dashed #e8c5c5 !important; }
#site-name-text a, .site-name a { color: #4a3728 !important; font-family: 'Zen Maru Gothic', sans-serif !important; }
.tagline, #site-catch { color: #a07870 !important; font-size: 0.85em !important; }
#header-image { max-height: 300px !important; overflow: hidden !important; }
#header-image img { width: 100% !important; object-fit: cover !important; object-position: center top !important; }

/* === ナビ === */
#navi { background-color: #f5e6e6 !important; border-bottom: 1px solid #e0c4c4 !important; }
#navi .navi-in > ul > li > a { color: #6b4040 !important; font-family: 'Zen Maru Gothic', sans-serif !important; letter-spacing: 0.05em !important; }
#navi .navi-in > ul > li > a:hover, #navi .navi-in > ul > li.current-menu-item > a { background-color: #e8c5c5 !important; color: #4a3728 !important; }

/* === 記事本文 === */
.entry-title {
  color: #4a3728 !important;
  font-family: 'Zen Maru Gothic', sans-serif !important;
  font-weight: 500 !important;
  border-left: 4px solid #e8a0a0 !important;
  padding-left: 0.6em !important;
  line-height: 1.6 !important;
}

.entry-content {
  color: #5a4040 !important;
  font-family: 'Zen Maru Gothic', sans-serif !important;
  font-weight: 300 !important;
  line-height: 2.2 !important;
  font-size: 1.05em !important;
  letter-spacing: 0.03em !important;
}

/* === 見出し h2 === */
.entry-content h2 {
  background: linear-gradient(135deg, #f9eaea, #fdf4f4) !important;
  border-left: 5px solid #d4787c !important;
  border-radius: 0 12px 12px 0 !important;
  padding: 0.7em 1.2em !important;
  color: #4a3728 !important;
  font-family: 'Zen Maru Gothic', sans-serif !important;
  font-weight: 500 !important;
  font-size: 1.15em !important;
  margin: 2em 0 1em !important;
}

/* === 見出し h3 === */
.entry-content h3 {
  border-bottom: 2px dashed #e8c5c5 !important;
  color: #6b4848 !important;
  font-family: 'Zen Maru Gothic', sans-serif !important;
  font-weight: 500 !important;
  padding-bottom: 0.3em !important;
  margin: 1.8em 0 0.8em !important;
}

/* === 段落 === */
.entry-content p {
  margin-bottom: 1.6em !important;
  line-height: 2.2 !important;
}

/* === 引用・強調ボックス === */
.entry-content blockquote,
.wp-block-quote {
  background: #f5ede8 !important;
  border-left: 3px solid #d4a090 !important;
  border-radius: 8px !important;
  padding: 1.2em 1.5em !important;
  color: #6b4848 !important;
  font-style: normal !important;
  margin: 1.5em 0 !important;
  box-shadow: none !important;
}

.entry-content blockquote p,
.wp-block-quote p {
  margin: 0 !important;
  line-height: 2 !important;
}

.wp-block-quote::before,
.wp-block-quote::after {
  color: #d4a090 !important;
  opacity: 0.5 !important;
}

/* === カード（背景色を統一） === */
.card-wrap { border-radius: 12px !important; border: 1px solid #f0dede !important; box-shadow: 0 2px 8px rgba(200,160,160,0.12) !important; background-color: #fdf8f5 !important; overflow: hidden !important; }
.card-wrap:hover { box-shadow: 0 4px 16px rgba(200,160,160,0.25) !important; transform: translateY(-2px) !important; transition: all 0.3s ease !important; }
.card-title { color: #4a3728 !important; font-family: 'Zen Maru Gothic', sans-serif !important; }

/* === サイドバー（背景色を統一） === */
#sidebar { background-color: transparent !important; }
.widget { background-color: #fdf8f5 !important; border: 1px solid #f0dede !important; border-radius: 12px !important; padding: 1.2em !important; margin-bottom: 1.5em !important; }
.widget-title, .widgettitle { color: #6b4848 !important; font-family: 'Zen Maru Gothic', sans-serif !important; border-bottom: 2px solid #e8c5c5 !important; padding-bottom: 0.4em !important; margin-bottom: 0.8em !important; }

/* === ボタン === */
.btn, .cocoon-block-button__link { background-color: #e8a0a0 !important; border: none !important; border-radius: 25px !important; color: #fff !important; padding: 0.6em 1.8em !important; font-family: 'Zen Maru Gothic', sans-serif !important; }
.btn:hover, .cocoon-block-button__link:hover { background-color: #d47878 !important; color: #fff !important; }

/* === フッター === */
#footer { background-color: #f5e6e6 !important; color: #8a6060 !important; border-top: 2px dashed #e8c5c5 !important; font-size: 0.85em !important; }
#footer a { color: #a07070 !important; }

/* === タグ・カテゴリ === */
.cat-label, .post-category a { background-color: #e8a0a0 !important; border-radius: 4px !important; color: #fff !important; font-size: 0.75em !important; padding: 2px 8px !important; }
.tag-label a, .tag a { border: 1px solid #e8a0a0 !important; border-radius: 20px !important; color: #c4787a !important; font-size: 0.8em !important; padding: 2px 10px !important; }

/* === ページネーション === */
.page-numbers { border: 1px solid #e8c5c5 !important; border-radius: 50% !important; color: #c4787a !important; }
.page-numbers.current { background-color: #e8a0a0 !important; color: #fff !important; border-color: #e8a0a0 !important; }

/* === 検索 === */
.search-form .search-submit { background-color: #e8a0a0 !important; border-color: #e8a0a0 !important; color: #fff !important; }

/* === モバイル === */
@media (max-width: 768px) {
  #header-image img { object-position: center center !important; }
  .entry-content { font-size: 1em !important; line-height: 2 !important; }
}
/* === うめこカスタムデザイン終了 === */