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

/************************************
** 作ってわかるAI「ポップ改」
** 朱色 #ff5a36 / 黒 #111 / 白 / 薄い朱色 #fde3dc
** 角ずれ影 4px 4px 0 #111 / Zen Maru Gothic
** 原本: システム/作ってわかるAI/theme/cocoon-child/style.css
************************************/
:root{
  --tw-accent:#ff5a36;
  --tw-ink:#111111;
  --tw-pale:#fde3dc;
  --tw-deep:#b4300f;
  --tw-line:#d9d4d0;
  --tw-muted:#555555;
  --tw-shadow:4px 4px 0 #111111;
  --tw-wrap:1256px; /* Cocoon の .wrap と同じ幅にそろえる */
  --tw-gutter:16px;
}
@media screen and (min-width: 1024px){ :root{ --tw-gutter:24px; } }

/* ---- 書体・基本色 ---- */
/* 書体：本文＝Noto Sans JP（読ませる文章）／見出し・ボタン・ラベル・タブ・ロゴ＝Zen Maru Gothic */
:root{
  --tw-font-body:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  --tw-font-head:'Zen Maru Gothic','Hiragino Maru Gothic ProN','BIZ UDPGothic','Yu Gothic',sans-serif;
}
body, .body, input, select, textarea{ font-family:var(--tw-font-body); }
body{ color:var(--tw-ink); background:#fff; font-weight:400; }
/* 読ませる文章の文字組み */
.entry-content, .entry-content p, .entry-content li, .entry-content td, .entry-content th, .entry-content dd,
.category-page-content, .tw-stepdesc, .tw-startp-lead, .tw-startp-note, .tw-series-text, .tw-series-card-text, .tw-tile > span, .tw-footer-note,
.entry-card-snippet, .posts-not-found p, .tw-new .new-entry-cards > p, .widget-entry-card-title, .entry-card-title{ font-family:var(--tw-font-body); }
.entry-content, .entry-content p, .entry-content li{ font-size:16px; line-height:1.8; letter-spacing:.03em; }
/* Zen Maru Gothic のまま：見出し・ボタン・ラベル・タブ・ロゴ・固定メニュー */
h1, h2, h3, h4, h5, h6, .entry-title, .archive-title, .widget-title, .wp-block-heading,
#navi, .logo, .site-name-text, .mobile-menu-buttons, .logo-menu-button, button, .wp-element-button, .wp-block-search__button, .search-submit,
.tagline, .cat-label, .menu-footer, .pagination, #breadcrumb, .toc-title,
.tw-hero-title, .tw-hero-lead, .tw-hero-link, .tw-hero-cta, .tw-pill, .tw-step, .tw-side-step, .tw-side-cat, .tw-side-h2, .tw-chip, .tw-tile > b, .tw-tag, .tw-btn,
.tw-series-label, .tw-series-title, .tw-series-card-label, .tw-series-card-title, .tw-series-card-img, .tw-work, .tw-work-tag, .tw-h2, .tw-new .tw-head, .tw-new .tw-head a,
.tw-stepnum, .tw-stepstat, .tw-steptitle, .tw-num, .widget-entry-card-date, .entry-card-meta{ font-family:var(--tw-font-head); }
.body a{ color:var(--tw-ink); }
.body a:hover{ color:#000; }
h1,h2,h3,h4,.entry-title,.archive-title,.widget-title{ font-weight:900; }

/* ---- ヘッダー（PC） ---- */
#header-container{ border-top:4px solid var(--tw-ink); background:#fff; }
#header-container-in.hlt-center-logo .header-in,
.header-in{ display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:10px var(--tw-gutter) 6px; min-height:0; width:auto; max-width:var(--tw-wrap); box-sizing:border-box; }
.header-in .logo-header{ margin:0; order:0; text-align:left; }
.header-in .logo-header .site-name-text{ font-size:20px; font-weight:900; color:var(--tw-ink); display:inline-flex; align-items:center; gap:8px; }
.header-in .logo-header .site-name-text::before{ content:""; width:12px; height:12px; border-radius:6px; background:var(--tw-accent); border:2px solid var(--tw-ink); box-sizing:border-box; flex:none; }
.header-in .tagline{ order:1; margin:0; font-size:13px; font-weight:700; color:#444; }

/* カテゴリのタブ */
#navi, #navi.navi, .navi{ border-bottom:2px solid var(--tw-ink); background:#fff !important; background-color:#fff !important; }
#navi .navi-in{ width:auto; max-width:var(--tw-wrap); box-sizing:border-box; }
#navi .navi-in > .menu-header{ display:flex; justify-content:flex-start; gap:2px; padding:0 var(--tw-gutter); overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
#navi .navi-in > .menu-header::-webkit-scrollbar{ display:none; }
#navi .navi-in > .menu-header > li{ flex:none; width:auto; height:40px; line-height:40px; border:0; }
#navi .navi-in > .menu-header > li > a{ display:flex; align-items:center; height:40px; padding:0 12px; color:#444; font-size:14px; font-weight:900; text-decoration:none; background:transparent; }
#navi .navi-in > .menu-header > li > a .item-label{ font-weight:900; }
#navi .navi-in > .menu-header > li > a:hover{ background:transparent; color:var(--tw-ink); }
#navi .navi-in > .menu-header > li.current-menu-item > a,
#navi .navi-in > .menu-header > li.current-menu-parent > a,
#navi .navi-in > .menu-header > li.current-category-ancestor > a,
#navi .navi-in > .menu-header > li.current_page_parent > a{ color:var(--tw-ink); box-shadow:inset 0 -4px 0 var(--tw-accent); }
#navi .navi-in > .menu-header > li:first-child > a{ padding-left:0; }
#navi .navi-in > .menu-header > li > a::after,
#navi .navi-in > .menu-header > li > a::before{ display:none; }

/* ---- 本文エリア共通 ---- */
#main, #sidebar{ border:0; background:#fff; }
.article-header .entry-title{ font-size:24px; line-height:1.4; font-weight:900; }
.archive-title{ font-size:22px; font-weight:900; padding:10px 0 12px; border-bottom:2px solid var(--tw-ink); margin-bottom:12px; }
.archive-title .fa{ color:var(--tw-accent); margin-right:6px; }
.category-page-content{ color:#444; font-size:14px; margin-bottom:12px; }
.entry-content a{ color:var(--tw-deep); text-decoration:underline; }
.entry-content a:hover{ color:var(--tw-ink); }
.entry-content h2{ background:var(--tw-pale); border:0; border-left:6px solid var(--tw-accent); border-radius:0 10px 10px 0; padding:10px 14px; font-size:20px; font-weight:900; }
.entry-content h3{ border:0; border-bottom:2px solid var(--tw-ink); padding:6px 0; font-size:18px; font-weight:900; }
.entry-content h4{ border:0; border-left:4px solid var(--tw-ink); padding:2px 10px; font-size:16px; font-weight:900; }
.entry-content ul li::marker{ color:var(--tw-accent); }
.post-date, .post-update, .post-author, .date-tags{ color:var(--tw-muted); }
.cat-label{ background:var(--tw-ink); border:0; border-radius:99px; color:#fff; font-weight:900; padding:2px 8px; }

/* 記事一覧（カテゴリ・新着ページ） */
.entry-card-wrap{ border:2px solid var(--tw-ink); border-radius:12px; box-shadow:var(--tw-shadow); padding:10px; margin:0 6px 20px 0; background:#fff; transition:transform .12s; }
.entry-card-wrap:hover{ transform:translate(-1px,-1px); background:#fff; }
.entry-card-thumb{ border:2px solid var(--tw-ink); border-radius:8px; overflow:hidden; background:var(--tw-pale); }
.entry-card-thumb img{ display:block; width:100%; height:auto; }
.card-thumb img.no-image{ opacity:0; }
.entry-card-title{ font-size:17px; font-weight:900; line-height:1.45; }
.entry-card-snippet{ font-size:13px; color:#444; }
.posts-not-found{ border:2px dashed var(--tw-ink); border-radius:12px; padding:22px 16px; text-align:center; background:#fff; }
.posts-not-found h2{ font-size:14px; letter-spacing:.1em; margin:0 0 6px; color:var(--tw-deep); }
.posts-not-found p{ margin:0; font-size:14px; }
.pagination .page-numbers{ border:2px solid var(--tw-ink); border-radius:8px; color:var(--tw-ink); }
.pagination .current{ background:var(--tw-accent); color:var(--tw-ink); }
#breadcrumb{ font-size:12px; color:var(--tw-muted); }
#breadcrumb a{ color:var(--tw-muted); }

/* 固定ページ・記事：共有ボタンの色づかいを抑える */
.sns-share-buttons, .sns-follow-buttons{ margin-top:12px; }

/* サイドバー */
.sidebar .widget{ border:2px solid var(--tw-ink); border-radius:12px; padding:14px; margin-bottom:20px; }
.sidebar .widget-title, .sidebar .wp-block-heading{ font-size:15px; font-weight:900; border-bottom:2px solid var(--tw-ink); padding-bottom:6px; margin:0 0 10px; }
.sidebar a{ text-decoration:none; }

/* 検索フォーム */
.wp-block-search__input, .search-edit, .search-box .search-edit{ border:2px solid var(--tw-ink) !important; border-radius:99px !important; padding:10px 14px !important; font-size:15px; background:#fff; }
.wp-block-search__button, .search-submit{ background:var(--tw-ink) !important; color:#fff !important; border:0 !important; border-radius:99px !important; font-weight:900; }
.search-menu-content .search-box{ padding:8px; }

/* ---- フッター ---- */
#footer{ background:var(--tw-ink); color:#ddd; border-top:0; margin-top:0; }
#footer a{ color:#fff; }
#footer .footer-in{ width:auto; max-width:var(--tw-wrap); box-sizing:border-box; }
#footer .footer-top, #footer .footer-widgets{ padding:20px var(--tw-gutter) 0; }
#footer .footer-left, #footer .footer-center, #footer .footer-right{ padding:0; margin:0; }
#footer .footer-widgets .widget{ padding:0; margin:0; }
#footer .footer-widgets p{ font-size:12px; line-height:1.7; margin:0; color:#ddd; }
#footer .footer-bottom{ padding:16px var(--tw-gutter) 24px; }
.footer-bottom-logo .site-name-text{ color:#fff; font-size:16px; font-weight:900; }
.menu-footer{ display:flex; flex-wrap:wrap; gap:6px 16px; justify-content:center; }
.menu-footer li{ margin:0; }
.menu-footer a{ color:#fff; font-size:13px; font-weight:700; text-decoration:none; padding:0; }
.copyright, .source-org{ color:#aaa; font-size:12px; }
.footer-left:empty, .footer-center:empty, .footer-right:empty{ display:none; }

/************************************
** トップページ（固定ページ「ホーム」）
************************************/
body.home.page #content{ margin:0; }
body.home.page #content-in{ padding:0; max-width:none; width:100%; }
body.home.page #main{ width:100%; max-width:none; padding:0; margin:0; border:0; }
body.home.page .article{ margin:0; padding:0; }
body.home.page .article-header,
body.home.page .article-footer,
body.home.page .entry-footer,
body.home.page .sns-share,
body.home.page .sns-follow,
body.home.page .date-tags,
body.home.page .author-info,
body.home.page #breadcrumb,
body.home.page .comment-area,
body.home.page .page-navi,
body.home.page .footer-meta,
body.home.page .related-entries{ display:none; }
body.home.page .entry-content{ margin:0; }
body.home.page .entry-content > *{ margin-top:0; margin-bottom:0; }
body.home.page .entry-content p, body.home.page .entry-content h2{ margin:0; }
body.home.page #toc, body.home.page .toc{ display:none; }
body.home.page .entry-content > .wp-block-group > * + *{ margin-block-start:0; }
body.home.page .entry-content a{ text-decoration:none; color:var(--tw-ink); }

.tw-in{ max-width:var(--tw-wrap); margin:0 auto; padding:0 var(--tw-gutter); box-sizing:border-box; }
.tw-h2{ margin:0; font-size:22px; font-weight:900; }

/* 朱色の帯 */
.tw-hero{ background:var(--tw-accent); border-bottom:2px solid var(--tw-ink); padding:16px 0; color:var(--tw-ink); }
.tw-hero .tw-in{ display:flex; flex-direction:column; gap:10px; padding-right:0; }
.tw-hero-text{ display:flex; flex-direction:column; gap:8px; padding-right:16px; }
body.home.page .entry-content .tw-hero-title, .tw-hero-title{ margin:0 !important; padding:0; border:0; background:none; font-weight:900; font-size:27px; line-height:1.3; color:var(--tw-ink); }
.tw-nw{ display:inline-block; }
.tw-hero-lead{ margin:0 !important; font-size:14px; font-weight:700; line-height:1.55; color:var(--tw-ink); }
.tw-hero-link{ align-self:flex-start; font-size:13px; font-weight:900; color:var(--tw-ink) !important; text-decoration:underline !important; text-underline-offset:3px; }
.tw-pc{ display:none !important; }
#navi .navi-in > .menu-header > li.tw-search-btn{ display:none; }
.tw-works{ display:flex; gap:10px; overflow-x:auto; padding:0 16px 6px 0; scrollbar-width:none; }
.tw-works::-webkit-scrollbar{ display:none; }
.tw-work{ flex:none; width:132px; height:80px; background:#fff; border:2px solid var(--tw-ink); border-radius:10px; box-shadow:var(--tw-shadow); display:flex; flex-direction:column; justify-content:flex-end; padding:8px; box-sizing:border-box; font-size:11px; font-weight:700; text-decoration:none; color:var(--tw-ink); position:relative; overflow:hidden; }
.tw-work img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.tw-work-tag{ position:relative; display:inline-block; align-self:flex-start; background:var(--tw-pale); border:1px solid var(--tw-ink); border-radius:99px; padding:1px 7px; font-size:10px; margin-bottom:4px; }
.tw-work span{ position:relative; }

/* AIをはじめる（スマホの入口行） */
.tw-start{ border-bottom:2px solid var(--tw-ink); padding:12px 0; }
.tw-start .tw-in{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.tw-steps3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; width:100%; }
.tw-pill, .entry-content a.tw-pill{ flex:none; display:inline-block; background:var(--tw-ink); color:#fff !important; font-size:11px; font-weight:900; padding:6px 12px; border-radius:99px; text-decoration:none; }
.tw-step{ min-height:44px; display:flex; align-items:center; justify-content:center; gap:4px; padding:0 4px; border:2px solid var(--tw-ink); border-radius:99px; text-decoration:none; font-size:12px; font-weight:900; color:var(--tw-ink); background:#fff; white-space:nowrap; }
.tw-step:hover{ background:var(--tw-pale); }
.tw-num{ width:18px; height:18px; border-radius:9px; background:var(--tw-ink); color:#fff; font-size:10px; display:flex; align-items:center; justify-content:center; flex:none; }

/* 新着の制作記録 */
.tw-new{ padding:12px var(--tw-gutter) 28px; max-width:var(--tw-wrap); margin:0 auto !important; box-sizing:border-box; }
.tw-new .tw-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.tw-new .tw-head h2{ margin:0; font-size:19px; font-weight:900; background:none; border:0; padding:0; border-radius:0; }
.tw-new .tw-head a{ font-size:13px; font-weight:900; color:var(--tw-ink); text-decoration:none; }
.tw-new .new-entry-cards{ margin:0; }
.tw-new .new-entry-cards > p{ margin:12px 0 0; padding:16px; border:2px dashed var(--tw-ink); border-radius:10px; font-size:13px; text-align:center; }
.tw-new .widget-entry-cards .a-wrap{ display:block; padding:10px 0; margin:0; border-bottom:1px solid var(--tw-line); background:#fff; }
.tw-new .widget-entry-cards .a-wrap:hover{ background:#fff; }
.tw-new .widget-entry-card{ display:flex; gap:12px; position:relative; font-size:14px; }
.tw-new .widget-entry-cards figure{ flex:none; width:92px; height:68px; margin:0; border:2px solid var(--tw-ink); border-radius:8px; overflow:hidden; background:var(--tw-pale); position:static; }
.tw-new .widget-entry-cards figure img{ width:100%; height:100%; object-fit:cover; display:block; }
.tw-new .widget-entry-card .cat-label{ position:absolute; left:104px; top:0; background:none; border:0; color:var(--tw-deep); font-size:10px; font-weight:900; padding:0; max-width:none; }
.tw-new .widget-entry-card-content{ margin:0; display:flex; flex-direction:column; gap:3px; padding-top:16px; min-width:0; }
.tw-new .widget-entry-card:not(:has(.cat-label)) .widget-entry-card-content{ padding-top:0; }
.tw-new .widget-entry-card-title{ font-size:14px; line-height:1.45; font-weight:700; overflow-wrap:anywhere; }
.tw-new .widget-entry-card-date{ font-size:11px; color:var(--tw-muted); }
.tw-new .widget-entry-card-date .fa{ display:none; }

/* 連載の黒いカード */
.tw-series-wrap{ padding:0 var(--tw-gutter) 32px; max-width:var(--tw-wrap); margin:0 auto !important; box-sizing:border-box; }
.tw-series{ padding:20px 18px; background:var(--tw-ink); color:#fff; border-radius:14px; display:flex; flex-direction:column; gap:10px; }
.tw-series-label{ font-size:11px; font-weight:900; color:var(--tw-accent); }
.tw-series-title{ font-size:21px; line-height:1.4; font-weight:900; }
.tw-series-text{ font-size:12px; line-height:1.7; color:#ddd; }
.tw-series-text .tw-nw{ display:inline; }
.tw-btn{ align-self:flex-start; height:44px; padding:0 18px; display:inline-flex; align-items:center; gap:8px; background:var(--tw-accent); color:var(--tw-ink) !important; border-radius:22px; text-decoration:none; font-weight:900; font-size:14px; }
.tw-btn:hover{ background:#fff; }

/* 作りたいものから探す / 目的から探す */
.tw-sec{ padding:0 var(--tw-gutter) 32px; max-width:var(--tw-wrap); margin:0 auto !important; box-sizing:border-box; display:flex; flex-direction:column; gap:12px; }
.tw-grid3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.tw-grid2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.tw-chip{ height:64px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid var(--tw-ink); border-radius:12px; text-decoration:none; font-weight:900; font-size:14px; color:var(--tw-ink); background:#fff; text-align:center; }
.tw-chip:hover, .tw-tile:hover{ background:var(--tw-pale); }
.tw-tile{ display:flex; flex-direction:column; gap:6px; padding:14px; border:2px solid var(--tw-ink); border-radius:12px; text-decoration:none; color:var(--tw-ink); background:#fff; }
.tw-tile b{ font-size:17px; font-weight:900; }
.tw-tile span{ font-size:12px; line-height:1.6; color:#444; }

/* 使っている道具 */
.tw-tools{ background:var(--tw-pale); border-top:2px solid var(--tw-ink); padding:28px 0 32px; }
.tw-tools .tw-in{ display:flex; flex-direction:column; gap:12px; }
.tw-tags{ display:flex; flex-wrap:wrap; gap:8px; font-size:12px; }
.tw-tag{ background:#fff; border:2px solid var(--tw-ink); padding:7px 12px; border-radius:99px; color:var(--tw-ink); text-decoration:none; }
.tw-tag b{ font-weight:900; }

/************************************
** モバイル固定メニュー（上：ロゴ＋検索＋メニュー / 下：4ボタン）
************************************/
.mobile-menu-buttons{ background:#fff; box-shadow:none; }
.mobile-header-menu-buttons{ border-top:4px solid var(--tw-ink); border-bottom:2px solid var(--tw-ink); min-height:50px; justify-content:space-between; padding:0 8px 0 16px; box-shadow:none; }
.mobile-header-menu-buttons > li{ padding-top:0; }
.mobile-header-menu-buttons .logo-menu-button{ order:0; flex-grow:1; text-align:left; min-width:0; line-height:50px; }
.mobile-header-menu-buttons .logo-menu-button .site-name-text{ font-size:17px; font-weight:900; color:var(--tw-ink); display:inline-flex; align-items:center; gap:8px; }
.mobile-header-menu-buttons .logo-menu-button .site-name-text::before{ content:""; width:12px; height:12px; border-radius:6px; background:var(--tw-accent); border:2px solid var(--tw-ink); box-sizing:border-box; flex:none; }
.mobile-header-menu-buttons .search-menu-button{ order:1; }
.mobile-header-menu-buttons .navi-menu-button{ order:2; }
.mobile-header-menu-buttons .has-logo-button .menu-button,
.has-logo-button .menu-button:not(.logo-menu-button){ width:44px; }
.mobile-header-menu-buttons .menu-button-in{ height:50px; display:flex; align-items:center; justify-content:center; }
.mobile-header-menu-buttons .menu-icon{ color:var(--tw-ink); font-size:21px; width:auto; }
.mobile-header-menu-buttons .menu-caption{ display:none; }
.mobile-header-menu-buttons .menu-content{ cursor:default; }
.navi-menu-content .menu-drawer a{ font-weight:900; color:var(--tw-ink); }

.mobile-footer-menu-buttons{ border-top:2px solid var(--tw-ink); min-height:60px; align-items:stretch; }
.mobile-footer-menu-buttons > li{ padding-top:0; }
.mobile-footer-menu-buttons .menu-button-in{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; height:60px; color:var(--tw-ink); }
.mobile-footer-menu-buttons .menu-icon{ width:auto; line-height:1; }
.mobile-footer-menu-buttons .custom-menu-icon > span{ font-family:FontAwesome; font-size:20px; display:inline-block; font-style:normal; }
.mobile-footer-menu-buttons .menu-caption{ font-size:11px; font-weight:900; opacity:1; }
.mobile-footer-menu-buttons .current-menu-item .menu-button-in{ color:var(--tw-deep); }

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /* 上の固定バーがロゴを担うので、通常ヘッダーのロゴは隠し、タブだけ残す */
  .mblt-header-and-footer-mobile-buttons #header{ display:none; }
  .mblt-header-and-footer-mobile-buttons #header-container{ border-top:0; }
  .mblt-header-and-footer-mobile-buttons{ margin-top:56px; margin-bottom:60px; }
  .mblt-header-and-footer-mobile-buttons #footer{ padding-bottom:24px; }
  body.home.page .tw-series-wrap{ padding-bottom:40px; }
  #navi .navi-in > .menu-header{ display:flex !important; }
  body.home.page .tw-new{ padding-bottom:28px; }
}

/*834px以下*/
@media screen and (max-width: 834px){
  #navi .navi-in > .menu-header{ display:flex !important; }
  .article-header .entry-title{ font-size:21px; }
  .entry-card-wrap{ margin-right:4px; }
}


/*480px以下*/
@media screen and (max-width: 480px){
  .tw-hero-title{ font-size:27px; }
}

/* ---- 微調整（2回目の見直し） ---- */
body.home.page .entry-content h2.tw-h2,
body.home.page .entry-content .tw-head h2{ background:none; border:0; padding:0; border-radius:0; margin:0; }
.entry-content .tw-tile, .entry-content .tw-tile b, .entry-content .tw-tile span,
.entry-content .tw-chip, .entry-content .tw-tag, .entry-content .tw-step, .entry-content .tw-work{ color:var(--tw-ink); text-decoration:none; }
.entry-content .tw-tile span{ color:#444; }
.wp-block-search__button{ white-space:nowrap; padding:0 18px !important; }
#sidebar .widget .wp-block-heading, #sidebar .widget .widget-title{ background:none; color:var(--tw-ink); padding:0 0 6px; border-bottom:2px solid var(--tw-ink); border-radius:0; }


/* ---- 3回目の見直し：モバイルのロゴ印・フッター（モバイル用ウィジェット領域）の位置 ---- */
.mobile-header-menu-buttons .logo-menu-button .menu-button-in{ display:inline-flex; align-items:center; gap:8px; font-size:17px; font-weight:900; color:var(--tw-ink); line-height:50px; }
.mobile-header-menu-buttons .logo-menu-button .menu-button-in::before{ content:""; width:12px; height:12px; border-radius:6px; background:var(--tw-accent); border:2px solid var(--tw-ink); box-sizing:border-box; flex:none; }
#footer .footer-in{ width:auto; margin-left:auto; margin-right:auto; padding:0; }
#footer .footer-widgets-mobile{ padding:20px 0 0 !important; margin:0 !important; }
#footer .footer-widgets-mobile .footer-mobile{ padding:0 8px !important; margin:0 !important; }
#footer .footer-widgets-mobile .widget, #footer .footer-widgets-mobile .widget-footer-mobile{ padding:0 !important; margin:0 !important; }
#footer .footer-widgets-mobile p{ font-size:12px; line-height:1.7; margin:0; color:#ddd; }

/************************************
** PC（1024px以上）の組み直し：1段ヘッダー／帯は左文字・右連載カード／本文2段組み
************************************/
@media screen and (min-width: 1024px){
  .tw-pc{ display:block !important; }
  .tw-pc.tw-flex{ display:flex !important; }
  .tw-sp{ display:none !important; }

  /* ヘッダー1段：ロゴ・タブ・検索 */
  #header-container{ border-top:4px solid var(--tw-ink); border-bottom:1px solid #e3ddd8; }
  #header-container-in, #header-container-in.hlt-center-logo{ display:flex; align-items:center; gap:40px; max-width:var(--tw-wrap); margin:0 auto; padding:0 var(--tw-gutter); min-height:64px; box-sizing:border-box; }
  #header{ flex:none; padding:0; margin:0; height:64px; display:flex; align-items:center; }
  #header .header-in{ display:flex; align-items:center; height:64px; }
  #header .header-in, #header .logo-header, #header .logo-header .site-name{ padding:0; margin:0; min-height:0; line-height:1.2; }
  #header-container-in, #header-container-in.hlt-center-logo{ height:64px; }
  #header-container-in.hlt-center-logo .header-in, .header-in{ padding:0; max-width:none; width:auto; }
  .header-in .tagline{ display:none; }
  #navi, #navi.navi{ flex:1 1 auto; border-bottom:0; min-width:0; }
  #navi .navi-in{ padding:0; max-width:none; width:auto; }
  #navi .navi-in > .menu-header{ padding:0; gap:16px; align-items:center; }
  #navi .navi-in > .menu-header > li{ height:64px; line-height:64px; }
  #navi .navi-in > .menu-header > li > a{ height:64px; padding:0 6px; font-size:15px; }
  #navi .navi-in > .menu-header > li.current-menu-item > a,
  #navi .navi-in > .menu-header > li.current-menu-parent > a,
  #navi .navi-in > .menu-header > li.current-category-ancestor > a,
  #navi .navi-in > .menu-header > li.current_page_parent > a{ box-shadow:inset 0 -3px 0 var(--tw-accent); }
  /* 検索ボタン（メニュー項目 .tw-search-btn を丸いボタンに） */
  #navi .navi-in > .menu-header > li.tw-search-btn{ display:block; margin-left:auto; }
  #navi .navi-in > .menu-header > li.tw-search-btn > a{ width:44px; height:44px; padding:0; margin:10px 0; border:2px solid var(--tw-ink); border-radius:22px; justify-content:center; box-shadow:none; background:#fff; }
  #navi .navi-in > .menu-header > li.tw-search-btn > a:hover{ background:var(--tw-pale); }
  #navi .navi-in > .menu-header > li.tw-search-btn .caption-wrap{ display:none; }
  #navi .navi-in > .menu-header > li.tw-search-btn > a::before{ content:"\f002"; font-family:FontAwesome; font-size:17px; color:var(--tw-ink); display:block; }

  /* 朱色の帯：左に文字＋ボタン、右に連載カード */
  .tw-hero{ padding:0; }
  .tw-hero .tw-in{ flex-direction:row; align-items:center; gap:56px; padding:56px var(--tw-gutter); }
  .tw-hero-text{ flex:1 1 auto; min-width:0; gap:18px; padding-right:0; }
  .tw-hero-title, body.home.page .entry-content .tw-hero-title{ font-size:52px; line-height:1.2; }
  .tw-hero-lead{ font-size:17px; line-height:1.8; }
  .tw-hero-link{ font-size:14px; }
  .tw-hero-cta{ align-self:flex-start; height:56px; padding:0 28px; display:flex; align-items:center; gap:10px; background:var(--tw-ink); color:#fff !important; border-radius:28px; text-decoration:none; font-weight:900; font-size:17px; box-shadow:4px 4px 0 #fff; margin-top:6px; }
  .tw-hero-cta:hover{ background:#000; }
  .tw-series-card{ width:400px; flex:none; background:#fff; border:2px solid var(--tw-ink); border-radius:16px; box-shadow:6px 6px 0 var(--tw-ink); padding:24px; box-sizing:border-box; flex-direction:column; gap:12px; text-decoration:none; color:var(--tw-ink) !important; }
  .tw-series-card:hover{ transform:translate(-1px,-1px); }
  .tw-series-card-label{ font-size:12px; font-weight:900; color:var(--tw-deep); }
  .tw-series-card-title{ font-size:24px; line-height:1.4; font-weight:900; }
  .tw-series-card-text{ font-size:14px; line-height:1.7; color:#444; }
  .tw-series-card-img{ height:140px; background:var(--tw-pale); border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:12px; color:#6b3a2c; }

  /* 本文2段組み：entry-content をグリッドにする（帯・道具は全幅、新着は左、はじめて/目的は右） */
  body.home.page .entry-content{ display:grid; grid-template-columns:[full-start] minmax(var(--tw-gutter),1fr) [in-start] minmax(0,860px) [main-end] 48px [side-start] 300px [in-end] minmax(var(--tw-gutter),1fr) [full-end]; column-gap:0; }
  body.home.page .entry-content > *{ grid-column:full; min-width:0; }
  body.home.page .entry-content > .tw-hero{ grid-row:1; }
  body.home.page .entry-content > .tw-new{ grid-column:in-start / main-end; grid-row:2; padding:48px 0 64px; max-width:none; margin:0 !important; }
  body.home.page .entry-content > .tw-side{ grid-column:side-start / in-end; grid-row:2; padding:48px 0 64px; display:flex !important; flex-direction:column; gap:28px; }
  body.home.page .entry-content > .tw-sec{ grid-column:in-start / in-end; padding:0 0 48px; max-width:none; margin:0 !important; }
  .tw-new .tw-head h2{ font-size:26px; }
  .tw-new .tw-head a{ font-size:14px; }
  .tw-new .tw-head{ margin-bottom:20px; }
  .tw-new .new-entry-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  .tw-new .new-entry-cards > p{ grid-column:1 / -1; margin:0; }
  .tw-new .widget-entry-cards .a-wrap{ border:0; padding:0; }
  .tw-new .widget-entry-card{ flex-direction:column; gap:10px; }
  .tw-new .widget-entry-cards figure{ width:100%; height:180px; border-radius:12px; position:relative; }
  .tw-new .widget-entry-card .cat-label{ position:absolute; left:8px; top:8px; background:var(--tw-ink); color:#fff; border-radius:99px; padding:2px 8px; font-size:11px; }
  .tw-new .widget-entry-card-content{ padding-top:0 !important; gap:4px; }
  .tw-new .widget-entry-card-title{ font-size:17px; line-height:1.5; font-weight:900; }
  .tw-new .widget-entry-card-date{ font-size:12px; }
  .tw-side-sec{ display:flex; flex-direction:column; gap:10px; }
  body.home.page .entry-content .tw-side-h2{ margin:0; padding:0; border:0; background:none; border-radius:0; font-size:18px; font-weight:900; }
  .tw-side-step{ display:flex; align-items:center; gap:12px; min-height:52px; padding:0 14px; border:2px solid var(--tw-ink); border-radius:12px; text-decoration:none; font-weight:900; font-size:15px; color:var(--tw-ink) !important; background:#fff; }
  .tw-side-step:hover{ background:var(--tw-pale); }
  .tw-side-step .tw-num{ width:26px; height:26px; border-radius:13px; font-size:13px; }
  .tw-side-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .tw-side-cat{ height:48px; display:flex; align-items:center; justify-content:center; background:#f6f3f0; border-radius:10px; text-decoration:none; font-weight:900; color:var(--tw-ink) !important; }
  .tw-side-cat:hover{ background:var(--tw-pale); }

  /* 作りたいもの・道具は今の内容のまま、同じ左端で */
  .tw-grid3{ grid-template-columns:repeat(6,minmax(0,1fr)); }
  .tw-chip{ height:76px; font-size:16px; }
  .tw-h2{ font-size:26px; }
  .tw-tools{ padding:48px 0; }
  .tw-tools .tw-tags{ font-size:14px; }
}

/************************************
** ユーザーテスト反映（2026-10-06）：入口ページ /start/・空表示・細かい直し
************************************/
.tw-tile strong{ font-weight:900; }
/* 記事0本の間の空表示 */
.posts-not-found h2{ display:none; }
.posts-not-found p{ font-size:14px; line-height:1.7; }
/* サイドバーの「カテゴリーなし」は記事が入るまで出さない */
#sidebar .widget:has(.cat-item-none){ display:none; }
/* /search/ と /start/ では投稿日・投稿者を出さない */
body.page-id-27 .date-tags, body.page-id-27 .author-info, body.page-id-27 .footer-meta,
body.tw-start-page .date-tags, body.tw-start-page .author-info, body.tw-start-page .footer-meta{ display:none; }
/* 入口ページ */
.tw-startp-lead{ font-size:15px; line-height:1.8; font-weight:700; margin:0 0 20px !important; }
.tw-steps{ list-style:none; margin:0 0 20px !important; padding:0; display:flex; flex-direction:column; gap:14px; counter-reset:none; }
.tw-steps li.tw-stepcard{ margin:0; padding:14px 14px 14px 12px; display:flex; gap:12px; align-items:flex-start; border:2px solid var(--tw-ink); border-radius:14px; background:#fff; box-shadow:var(--tw-shadow); margin-right:4px; }
.tw-steps li.tw-stepcard::before{ display:none; }
.tw-stepnum{ flex:none; width:32px; height:32px; border-radius:16px; background:var(--tw-ink); color:#fff; font-size:15px; font-weight:900; display:flex; align-items:center; justify-content:center; margin-top:2px; }
.tw-stepbody{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.tw-stepstat{ align-self:flex-start; background:var(--tw-pale); border:1px solid var(--tw-ink); border-radius:99px; padding:1px 8px; font-size:11px; font-weight:900; color:var(--tw-deep); }
.tw-steptitle{ font-size:17px; line-height:1.45; font-weight:900; }
.tw-stepdesc{ font-size:13px; line-height:1.6; color:#444; }
.tw-startp-note{ font-size:12px; color:var(--tw-muted); margin:0 !important; }
@media screen and (min-width: 1024px){
  .tw-startp-lead{ font-size:17px; }
  .tw-steps li.tw-stepcard{ padding:20px 24px; gap:18px; margin-right:6px; }
  .tw-stepnum{ width:40px; height:40px; border-radius:20px; font-size:18px; }
  .tw-steptitle{ font-size:21px; }
  .tw-stepdesc{ font-size:15px; }
}
/* さがす ページの4カテゴリはスマホでは1列（説明文が句の途中で折れないように） */
@media screen and (max-width: 1023px){ body.page-id-27 .tw-grid2{ grid-template-columns:1fr; } }

/* ---- 2回目ユーザーテスト反映 ---- */
/* 作品カード：画像が入るまで非表示。home-content.html の .tw-works から tw-hidden を外せば再表示 */
.tw-works.tw-hidden{ display:none !important; }
/* /start/ のステップ：リンクが無い間（li）は平らな枠・通常カーソル・反応なし。<a> に変えたら影つきで押せる見た目になる */
.tw-steps li.tw-stepcard{ box-shadow:none; margin-right:0; cursor:default; }
.tw-steps a.tw-stepcard, .entry-content a.tw-stepcard{ margin:0; padding:14px 14px 14px 12px; display:flex; gap:12px; align-items:flex-start; border:2px solid var(--tw-ink); border-radius:14px; background:#fff; box-shadow:var(--tw-shadow); margin-right:4px; cursor:pointer; text-decoration:none; color:var(--tw-ink); transition:transform .12s; }
.tw-steps a.tw-stepcard:hover{ transform:translate(-1px,-1px); background:var(--tw-pale); }
.tw-steps a.tw-stepcard .tw-stepstat{ display:none; }
@media screen and (min-width: 1024px){ .tw-steps a.tw-stepcard{ padding:20px 24px; gap:18px; margin-right:6px; } }
/* リンク化の形: <li><a class="tw-stepcard" href="…">…</a></li>（li 側は無印） */
.tw-steps > li{ margin:0; padding:0; list-style:none; }
.tw-steps > li::before{ display:none; }

/* 本文フォント調整：帯のリード文は本文書体（BIZ 700）のまま大きさだけ元に戻す／段落の行末に1〜2文字が落ちにくくする */
body.home.page .entry-content p.tw-hero-lead{ font-size:15px; line-height:1.7; letter-spacing:.03em; font-weight:700; }
@media screen and (min-width: 1024px){ body.home.page .entry-content p.tw-hero-lead{ font-size:17px; line-height:1.8; } }
.entry-content p, .entry-content li, .tw-stepdesc, .tw-startp-lead, .category-page-content p{ text-wrap:pretty; }

/************************************
** 朱色の帯の読む順番（2026-10-06）：見出し＝白、リード＝Zen Maru 700・黒、考え方リンクは帯の外へ
************************************/
body.home.page .entry-content .tw-hero-title, .tw-hero-title{ color:#ffffff; }
body.home.page .entry-content p.tw-hero-lead, .tw-hero-lead{ font-family:var(--tw-font-head); font-weight:700; font-size:17px; line-height:1.7; letter-spacing:.06em; color:var(--tw-ink); }
.tw-hero-text{ gap:12px; }
.tw-start-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; }
.tw-about-link, .entry-content a.tw-about-link{ font-family:var(--tw-font-head); font-size:12px; font-weight:700; color:var(--tw-muted) !important; text-decoration:underline !important; text-underline-offset:3px; white-space:nowrap; }
.tw-about-link:hover, .entry-content a.tw-about-link:hover{ color:var(--tw-ink) !important; }
@media screen and (min-width: 1024px){
  body.home.page .entry-content p.tw-hero-lead, .tw-hero-lead{ font-size:20px; line-height:1.7; }
  .tw-hero-text{ gap:18px; }
  .tw-hero-title br{ display:none; }
  body.home.page .entry-content > .tw-side .tw-about-link{ font-size:13px; align-self:flex-start; margin-bottom:-12px; }
}

/************************************
** 文字の見た目の統一（2026-10-06 点検）
** 書体2つ：見出し・ラベル・ボタン＝Zen Maru Gothic／読む文章＝Noto Sans JP
** 大きさ5段：h1 / h2 / 小見出し / 本文 / 注記・ラベル（＋トップの大見出しと帯のリードは別枠）
** 太さ：本文400・強調700・ラベル/ボタン700・h1/h2/ロゴ900
** 色：黒 #111・グレー #555（白地 7.5:1）・強調赤 #b4300f（白地 6.2:1、薄い朱色 5.1:1）
************************************/
:root{
  --fs-h1:24px; --fs-h2:20px; --fs-h3:17px; --fs-body:16px; --fs-note:13px; --fs-label:12px; --fs-btn:14px;
  --lh-head:1.35; --lh-body:1.8; --lh-note:1.7;
  --ls-head:.02em; --ls-body:.03em; --ls-label:.02em;
}
@media screen and (min-width: 1024px){ :root{ --fs-h1:28px; --fs-h2:24px; --fs-h3:18px; --fs-note:14px; } }

/* 1) 見出し */
.article-header .entry-title, h1.entry-title, .archive-title, h1#archive-title{ font-family:var(--tw-font-head); font-size:var(--fs-h1); font-weight:900; line-height:var(--lh-head); letter-spacing:var(--ls-head); }
.entry-content h2, body.home.page .entry-content .tw-h2, .tw-new .tw-head h2, body.home.page .entry-content .tw-head h2, .tw-series-title, .tw-series-card-title{ font-size:var(--fs-h2); font-weight:900; line-height:var(--lh-head); letter-spacing:var(--ls-head); }
.entry-content h3, .entry-content h4, body.home.page .entry-content .tw-side-h2, .tw-steptitle, .tw-tile > b, .widget-entry-card-title, .entry-card-title, #sidebar .widget .wp-block-heading, #sidebar .widget .widget-title{ font-family:var(--tw-font-head); font-size:var(--fs-h3); font-weight:700; line-height:var(--lh-head); letter-spacing:var(--ls-head); }
.entry-content h4{ font-size:var(--fs-body); }
.tw-steptitle{ font-weight:700; }

/* 2) 本文（Noto Sans JP 400／強調 700） */
.entry-content, .entry-content p, .entry-content li, .entry-content td, .entry-content th, .wp-block-search__label, .category-page-content p{ font-family:var(--tw-font-body); font-size:var(--fs-body); font-weight:400; line-height:var(--lh-body); letter-spacing:var(--ls-body); color:var(--tw-ink); }
.entry-content strong, .entry-content b:not(.tw-tile > b):not(.tw-steptitle):not(.tw-series-title):not(.tw-series-card-title), .tw-tile strong{ font-weight:700; }
.category-page-content p{ color:var(--tw-muted); }
.tw-startp-lead{ font-size:var(--fs-body); font-weight:700; line-height:var(--lh-body); letter-spacing:var(--ls-body); }

/* 3) 注記（Noto Sans JP 400・13/14px・グレー #555） */
.tw-stepdesc, .tw-startp-note, .tw-tile > span, .tw-series-text, .tw-series-card-text, .tw-footer-note, #footer .footer-widgets p, #footer .footer-widgets-mobile p, .entry-card-snippet, .tw-new .new-entry-cards > p, .posts-not-found p, .breadcrumb, #breadcrumb, #breadcrumb a, .breadcrumb-caption, .author-info, .source-org.copyright{ font-family:var(--tw-font-body); font-size:var(--fs-note); font-weight:400; line-height:var(--lh-note); letter-spacing:var(--ls-body); color:var(--tw-muted); }
.tw-tile > span, .tw-stepdesc, .tw-series-card-text{ color:var(--tw-muted); }
.tw-series-text, .tw-footer-note, #footer .footer-widgets p, #footer .footer-widgets-mobile p, .source-org.copyright{ color:#dddddd; }
.tw-new .new-entry-cards > p, .posts-not-found p{ color:var(--tw-ink); }
.date-tags, .date-tags .entry-date, .post-date, .post-update, .widget-entry-card-date, .entry-card-meta .post-date{ font-family:var(--tw-font-body); font-size:var(--fs-label); font-weight:400; line-height:1.5; letter-spacing:var(--ls-body); color:var(--tw-muted); }

/* 4) ラベル（Zen Maru Gothic 700・12px・字間 .02em） */
.tw-pill, .entry-content a.tw-pill, .tw-stepstat, .tw-series-label, .tw-series-card-label, .tw-series-card-img, .tw-work-tag, .cat-label, .mobile-footer-menu-buttons .menu-caption, .widget-entry-card .cat-label{ font-family:var(--tw-font-head); font-size:var(--fs-label); font-weight:700; line-height:1.4; letter-spacing:var(--ls-label); }
.tw-series-card-img{ color:var(--tw-deep); }
.mobile-footer-menu-buttons .menu-caption, .mobile-menu-buttons .menu-button > a{ color:var(--tw-ink); }
.tw-tag{ font-family:var(--tw-font-head); font-size:var(--fs-note); font-weight:400; letter-spacing:var(--ls-label); line-height:1.4; }
.tw-tag b{ font-weight:700; }
.tw-num, .tw-stepnum{ font-weight:700; letter-spacing:0; }

/* 5) ボタン（Zen Maru Gothic 700・14px／大きい主ボタン 16px／狭い3ボタン 13px） */
.tw-btn, .tw-chip, .entry-content .tw-chip, .tw-side-step, .tw-side-cat, .tw-step, .entry-content .tw-step, .wp-block-search__button, .search-submit, .pagination .page-numbers{ font-family:var(--tw-font-head); font-size:var(--fs-btn); font-weight:700; letter-spacing:var(--ls-label); line-height:1.3; }
.tw-step, .entry-content .tw-step{ font-size:13px; }
.tw-hero-cta{ font-size:16px; font-weight:700; letter-spacing:var(--ls-label); }

/* 6) 小さいテキストリンク（Zen Maru 700・13px・下線）と本文中のリンク（赤・下線） */
.tw-new .tw-head a, body.home.page .entry-content .tw-head a, .tw-about-link, .entry-content a.tw-about-link{ font-family:var(--tw-font-head); font-size:var(--fs-note); font-weight:700; letter-spacing:var(--ls-label); color:var(--tw-ink) !important; text-decoration:underline !important; text-underline-offset:3px; }
.tw-about-link:hover, .entry-content a.tw-about-link:hover, .tw-new .tw-head a:hover{ color:var(--tw-deep) !important; }
.entry-content p a:not([class]), .entry-content li a:not([class]){ color:var(--tw-deep); text-decoration:underline; text-underline-offset:3px; font-weight:400; }

/* 7) ナビ・ロゴ：タブは700（現在地だけ900）、下メニューの文字は黒 */
#navi .navi-in > .menu-header > li > a, #navi .navi-in > .menu-header > li > a .item-label{ font-weight:700; letter-spacing:var(--ls-label); }
#navi .navi-in > .menu-header > li.current-menu-item > a .item-label, #navi .navi-in > .menu-header > li.current-menu-parent > a .item-label, #navi .navi-in > .menu-header > li.current-category-ancestor > a .item-label{ font-weight:900; }
#navi .navi-in > .menu-header > li > a{ color:var(--tw-muted); }
#navi .navi-in > .menu-header > li.current-menu-item > a, #navi .navi-in > .menu-header > li.current-menu-parent > a, #navi .navi-in > .menu-header > li.current-category-ancestor > a{ color:var(--tw-ink); }
.site-name-text, .logo-menu-button .menu-button-in, .footer-bottom-logo .site-name-text{ letter-spacing:var(--ls-head); }
.menu-footer a{ font-family:var(--tw-font-head); font-size:var(--fs-note); font-weight:700; letter-spacing:var(--ls-label); }

/* 8) 帯：大見出しとリード（承認済みの値を字間だけ統一） */
body.home.page .entry-content .tw-hero-title, .tw-hero-title{ letter-spacing:var(--ls-head); line-height:1.25; }
body.home.page .entry-content p.tw-hero-lead, .tw-hero-lead{ letter-spacing:.06em; line-height:1.7; }

/* 9) グレーの段階を #555 に統一（#444・#333 を廃止） */
.tw-tile span, .tw-stepdesc, .tw-series-card-text, .category-page-content, .header-in .tagline{ color:var(--tw-muted); }
.navi-menu-content .menu-drawer a{ font-weight:700; }

/* 点検の取りこぼし：タイル説明の入れ子 span／説明内の b／検索ボタン */
.tw-tile span{ font-size:var(--fs-note); line-height:var(--lh-note); color:var(--tw-muted); }
.tw-tile > span span, .tw-tile > span b, .tw-tile > span strong{ font-family:inherit; font-size:inherit; line-height:inherit; color:inherit; }
.tw-tile > span b, .tw-tile > span strong{ font-weight:700; }
button.wp-block-search__button, .wp-block-search .wp-block-search__button, .search-submit{ font-family:var(--tw-font-head) !important; font-size:var(--fs-btn) !important; font-weight:700 !important; letter-spacing:var(--ls-label); }
/* 幅374px以下のスマホでは「目的から探す」を1列にして、説明の句を途中で折らない */
@media screen and (max-width: 374px){ body.home.page .tw-sec .tw-grid2{ grid-template-columns:1fr; } }
.entry-content .tw-tile span, .entry-content .tw-tile > span span, .entry-content .tw-tile > span strong{ color:var(--tw-muted); }