@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@500;700&family=Noto+Sans+JP:wght@400;500&display=swap');

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

/************************************
** 子テーマ用のスタイルを書く
************************************/

:root{
  --nf-pink-deep: #d81b60;
  --nf-pink-main: #f48fb1;
  --nf-pink-light: #fbcfe8;
  --nf-pink-bg: #fff5f8;
  --nf-text: #4a4a4a;
}

/* ベース */
body{
  background-color: var(--nf-pink-bg);
  color: var(--nf-text);
  font-family: 'Noto Sans JP', "Hiragino Kaku Gothic ProN", sans-serif;
}
::selection{
  background: var(--nf-pink-light);
  color: var(--nf-pink-deep);
}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4,
.site-name-text, .related-entry-heading, .article h2.article-title{
  font-family: 'Shippori Mincho', serif;
}

/* ヘッダー・サイトタイトル */
#header, #header-container{
  background-color: #ffffff;
  border-bottom: 2px solid var(--nf-pink-light);
}
.site-name-text{
  color: var(--nf-pink-deep) !important;
  letter-spacing: .03em;
}
.tagline{
  color: var(--nf-pink-main);
}

/* グローバルナビ */
#navi, #navi-in{
  background-color: var(--nf-pink-deep);
}
#navi .menu-top > .menu-item > a{
  color: #ffffff;
}
#navi .menu-top > .menu-item > a:hover{
  background-color: var(--nf-pink-main);
}

/* パンくず */
.breadcrumb{
  background-color: transparent;
}
.breadcrumb a{
  color: var(--nf-pink-deep);
}

/* リンク */
.entry-content a{
  color: var(--nf-pink-deep);
}
.entry-content a:hover{
  color: var(--nf-pink-main);
}

/* 見出し（本文内） */
.entry-content h2{
  background: linear-gradient(to right, var(--nf-pink-light), #ffffff);
  border-left: 6px solid var(--nf-pink-deep);
  border-bottom: none;
  color: var(--nf-pink-deep);
  padding: .6em .8em;
  border-radius: 4px;
}
.entry-content h3{
  border-bottom: 2px solid var(--nf-pink-light);
  color: var(--nf-pink-deep);
  padding: .3em .2em;
}
.entry-content h4{
  color: var(--nf-pink-deep);
}

/* 目次 */
.toc{
  background-color: var(--nf-pink-bg);
  border: 1px solid var(--nf-pink-light);
  border-radius: 8px;
}
.toc-title{
  color: var(--nf-pink-deep);
}

/* 引用 */
.entry-content blockquote{
  background-color: var(--nf-pink-bg);
  border-left: 4px solid var(--nf-pink-main);
}

/* カード（関連記事・人気記事など） */
.entry-card, .a-card, .rect-a-wrap{
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--nf-pink-light);
  box-shadow: 0 2px 8px rgba(216, 27, 96, 0.08);
  transition: transform .2s ease, box-shadow .2s ease;
}
.entry-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(216, 27, 96, 0.15);
}
.entry-card-title{
  color: var(--nf-pink-deep);
}

/* 自作ボックス（内部リンク・広告・カエレバ）のアクセントを統一 */
.nlink-box{
  background-color: var(--nf-pink-bg) !important;
  border: 1px solid var(--nf-pink-light) !important;
  border-radius: 10px !important;
}
.nlink-box p{
  color: var(--nf-pink-deep) !important;
}
.nlink-box a{
  color: var(--nf-pink-deep);
}
.kaerebalink-box, .cstmreba{
  border-radius: 8px;
}

/* ボタン類 */
.sim-btn a, .btn-normal, .colored-box.rich a, a.arrow-icon{
  border-radius: 999px;
}

/* トップに戻るボタン */
.go-to-top-button{
  background-color: var(--nf-pink-deep) !important;
}

/* フッター */
#footer, #footer-container{
  background-color: #ffffff;
  border-top: 2px solid var(--nf-pink-light);
}
#footer a{
  color: var(--nf-pink-deep);
}
.footer-bottom{
  color: var(--nf-text);
}

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  .entry-content h2{
    padding: .5em .6em;
  }
}