@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ（トゥクノリGO：HPと同じポップ・カラフル路線）
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** トゥクノリGO ブログ — HP（tuknori.com）に見た目を寄せる
** 原本: トゥクノリGO HP制作/blog_wp/cocoon-child-style.css（2026-10-03）
** 色・フォントは index.html の :root と同じ値
************************************/
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Zen+Kaku+Gothic+New:wght@400;500;700&family=Zen+Maru+Gothic:wght@700;900&display=swap');

:root{
  --tk-bg:#FFF9F0; --tk-panel:#FFFFFF; --tk-ink:#241207; --tk-muted:#8a7a6b; --tk-line:#F3E7D6;
  --tk-orange:#FF6B00; --tk-orange-l:#FF8A3D; --tk-pink:#FF2D78; --tk-yellow:#FFC400; --tk-teal:#12B5A5;
}

/* ---- 全体 ---- */
body{
  background:var(--tk-bg) !important;
  color:var(--tk-ink);
  font-family:'Zen Kaku Gothic New',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--tk-orange)}
a:hover{color:var(--tk-pink)}
.main,.sidebar{background:transparent;border:none}
#main .article,.entry-card-wrap,.widget{background:var(--tk-panel)}

/* ---- ヘッダー（HPと同じ：クリーム地＋黄色の下線・🛺丸ロゴ） ---- */
#header-container{
  position:sticky;top:0;z-index:100;
  background:rgba(255,249,240,.92) !important;
  backdrop-filter:blur(12px);
  border-bottom:2px solid var(--tk-yellow);
  box-shadow:none;
}
#header,.header{background:transparent !important}
.header-in{min-height:auto;padding:10px 0}
.logo-header{padding:4px 0}
.logo-header .site-name-text-link{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.logo-header .site-name-text{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;font-size:22px;color:var(--tk-ink);
  display:inline-flex;align-items:center;gap:11px;
}
.logo-header .site-name-text::before{
  content:"🛺";width:42px;height:42px;border-radius:50%;border:2.5px solid var(--tk-ink);
  background:var(--tk-yellow);display:inline-flex;align-items:center;justify-content:center;font-size:21px;flex-shrink:0;
}
.tagline{color:var(--tk-muted);font-size:12px}

/* ---- グローバルナビ（HPのピル型ボタン） ---- */
#navi,.navi{background:transparent !important}
#navi .navi-in > ul{justify-content:center;gap:4px}
#navi .navi-in > ul > li{height:auto}
#navi .navi-in > ul > li > a{
  color:var(--tk-ink) !important;font-size:13.5px;font-weight:500;
  padding:9px 15px;border-radius:999px;transition:background .2s,color .2s;
}
#navi .navi-in > ul > li > a:hover{background:var(--tk-orange);color:#fff !important}
#navi .navi-in > ul > li.nav-cta > a{
  background:var(--tk-pink);color:#fff !important;font-weight:700;padding:10px 22px;
  box-shadow:0 6px 16px rgba(255,45,120,.32);
}
#navi .navi-in > ul > li.nav-cta > a:hover{background:var(--tk-pink);transform:translateY(-2px)}

/* ---- 記事一覧のカード ---- */
.entry-card-wrap,.related-entry-card-wrap{
  border-radius:20px;border:2px solid var(--tk-line);overflow:hidden;
  transition:transform .18s,box-shadow .18s;
}
.entry-card-wrap:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(255,107,0,.16)}
.entry-card-title{font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-ink)}
.cat-label{
  background:var(--tk-orange) !important;color:#fff !important;border:none;
  border-radius:999px;padding:2px 10px;font-weight:700;
}

/* ---- 記事本文 ---- */
#main .article{border-radius:24px;padding:28px}
.entry-title,.article h1{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-ink);line-height:1.45;
}
.article h2{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:#fff;
  background:linear-gradient(135deg,var(--tk-orange),var(--tk-pink));
  border:none;border-radius:16px;padding:14px 20px;margin:2.2em 0 1em;
}
.article h3{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-ink);
  border:none;border-left:6px solid var(--tk-yellow);background:#FFF4D6;
  border-radius:0 12px 12px 0;padding:10px 16px;
}
.article h4{border-bottom:2px dashed var(--tk-orange-l);padding-bottom:4px}
.article table th{background:var(--tk-orange);color:#fff}
.article table td,.article table th{border-color:var(--tk-line)}
.article figure img,.eye-catch img{border-radius:18px}
.article blockquote{background:#FFF4D6;border-left:6px solid var(--tk-yellow)}
.breadcrumb,.breadcrumb a{color:var(--tk-muted)}
.date-tags{color:var(--tk-muted)}

/* 目次 */
.toc{border:2px solid var(--tk-line);border-radius:18px;background:#fff}
.toc-title{font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-orange)}

/* ---- サイドバー ---- */
.widget{border-radius:18px;padding:16px;border:2px solid var(--tk-line)}
.sidebar h3,.widget-sidebar-title{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-ink);
  background:none;border:none;border-bottom:3px solid var(--tk-yellow);padding:0 0 6px;
}

/* ---- ボタン類 ---- */
.btn,.more-link,.search-submit,input[type="submit"]{border-radius:999px}
.go-to-top-button{background:var(--tk-orange);color:#fff;border-radius:50%}

/* ---- フッター（HPと同じ濃い茶色） ---- */
#footer,.footer{background:var(--tk-ink) !important;color:#fff}
#footer a,.footer a,.copyright{color:#fff !important}
#footer .logo-footer .site-name-text{font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:#fff}
#footer .logo-footer .site-name-text::before{content:"🛺 "}
.navi-footer-in > .menu-footer li a{color:#fff !important;border-radius:999px;padding:6px 12px}
.navi-footer-in > .menu-footer li a:hover{background:var(--tk-orange)}

/************************************
** レスポンシブ
************************************/
@media screen and (max-width: 1023px){
  #navi .navi-in > ul{flex-wrap:wrap}
}
@media screen and (max-width: 834px){
  #main .article{padding:18px;border-radius:18px}
  .logo-header .site-name-text{font-size:19px}
}
@media screen and (max-width: 480px){
  .article h2{font-size:1.15em;padding:12px 16px}
}

/************************************
** 追加（2026-10-03）サイドバー見出し・検索・カテゴリ・予約CTA
************************************/
.sidebar h2,.sidebar .wp-block-heading{
  font-family:'Zen Maru Gothic',sans-serif;font-weight:900;color:var(--tk-ink);font-size:17px;
  background:none !important;border:none;border-bottom:3px solid var(--tk-yellow);
  padding:0 0 6px;margin:0 0 10px;
}
.wp-block-search__button,.search-submit{background:var(--tk-orange) !important;color:#fff !important;border:none;border-radius:999px}
.search-edit,.wp-block-search__input{border-radius:999px;border:2px solid var(--tk-line)}
.cat-link,.tag-link{background:var(--tk-orange) !important;color:#fff !important;border:none;border-radius:999px;padding:3px 12px}
.tk-side-cta{background:linear-gradient(135deg,#FFF0D6,#FFE4F0);border-radius:16px;padding:16px;text-align:center}
.tk-side-cta-title{font-family:'Zen Maru Gothic',sans-serif;font-weight:900;font-size:16px;margin-bottom:6px}
.tk-side-cta p{font-size:13.5px;line-height:1.7;margin:0 0 8px}
.tk-side-cta-btn{display:inline-block;background:var(--tk-pink);color:#fff !important;font-weight:700;
  padding:10px 22px;border-radius:999px;text-decoration:none;box-shadow:0 6px 16px rgba(255,45,120,.32)}
.tk-side-cta-sub a{color:var(--tk-ink);font-size:12.5px}