@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){
  /*必要ならばここにコードを書く*/
}

/* ==========================================================
   銀輪ノート … LP風デザイン（EDUPLEX風）  2026-10-08
   ここから下を、子テーマ cocoon-child-master の style.css の一番下に貼る。
   ・効くのは body に class="look-eduplex" が付いた時だけ（functions.php 側のゲートで付く）。
     ゲートが閉じている間は、この CSS は何もしない。
   ・Cocoon の既定（.article h2 など）より強く効かせるため、先頭を body.body.look-eduplex にしている。
   ・見た目の正：projects/100サイト_継続/モック/mock_LP_防災.html（EDUPLEX風）と
     静的サイトの tools/static-site/lp_themes.css（.look-eduplex）。
   ========================================================== */

/* ---------- 色（このブロックだけ変えれば色味が変わる） ---------- */
body.body.look-eduplex{
  /* 空色×黄（EDUPLEX風・既定） */
  --lk-bg:#e9f5fd;          /* ページの地 */
  --lk-brand:#0b5cad;       /* 見出し帯・枠の青 */
  --lk-brand-ink:#0b2e55;   /* 濃い文字の紺 */
  --lk-accent:#ffe600;      /* 黄 */
  --lk-h1:#ffe600;          /* ヒーロー大見出しの色 */
  --lk-ink:#16263a;
  --lk-muted:#4d6175;
  --lk-line:#cfe5f6;
  --lk-shadow:rgba(11,60,140,.12);
  --lk-cta1:#1d2a8a; --lk-cta2:#2c46c4; --lk-cta-dark:#111a63; --lk-cta-ink:#fff;
  --lk-hero:linear-gradient(180deg,#5db6ec 0%,#9fd5f5 60%,#d9effc 100%);
  --lk-band1:rgba(0,145,228,.85);  /* 斜め帯（太） */
  --lk-band2:rgba(0,145,228,.55);  /* 斜め帯（細） */
  --lk-badge:linear-gradient(135deg,#2f6fd0,#6aa8ec);
  --lk-ico-bg:#e2f1fc;
  --lk-sec-band:rgba(0,145,228,.08);
  --lk-foot:#0b2e55;
}

/* ---------- ページ全体 ---------- */
body.body.look-eduplex{
  background:var(--lk-bg);
  color:var(--lk-ink);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}
body.body.look-eduplex .content{margin-top:28px}

/* ---------- ヘッダー（.header-container / .header / .logo-header / .tagline） ---------- */
body.body.look-eduplex .header-container{background:#fff;box-shadow:0 2px 10px var(--lk-shadow);position:relative;z-index:5}
body.body.look-eduplex .header{background:#fff}
body.body.look-eduplex .logo-text{padding:16px 0 18px}
body.body.look-eduplex .logo-header .site-name-text{font-family:"Noto Sans JP",sans-serif;font-weight:900;font-style:italic;letter-spacing:.06em;color:var(--lk-brand);font-size:30px}
body.body.look-eduplex .tagline{color:var(--lk-muted);font-weight:700;font-size:13px}

/* ---------- ナビ（.navi / .navi-in。メニュー未設定の今は高さ0で見えない） ---------- */
body.body.look-eduplex .navi{background:var(--lk-brand)}
body.body.look-eduplex .navi-in a{color:#fff;font-weight:700}
body.body.look-eduplex .navi-in a:hover{background:rgba(255,255,255,.14);color:#fff}

/* ---------- 本文枠とサイドバー（.main / .sidebar） ---------- */
body.body.look-eduplex .main{background:#fff;border:0;border-top:5px solid var(--lk-brand);border-radius:4px;box-shadow:0 10px 30px var(--lk-shadow)}
body.body.look-eduplex .sidebar{background:#fff;border:0;border-radius:4px;box-shadow:0 8px 20px var(--lk-shadow)}
body.body.look-eduplex .sidebar h2,
body.body.look-eduplex .sidebar h3{padding:8px 26px 8px 14px;background:var(--lk-brand);color:#fff;border-radius:0;font-size:16px;font-weight:900;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%)}
body.body.look-eduplex .sidebar a{color:var(--lk-brand-ink)}
body.body.look-eduplex .sidebar .wp-block-search__input{border:2px solid var(--lk-line);border-radius:4px}
body.body.look-eduplex .sidebar .wp-block-search__button{background:var(--lk-cta1);color:var(--lk-cta-ink);border:0;border-radius:4px;font-weight:900}

/* ---------- 記事一覧（#list の .entry-card-wrap） ---------- */
body.body.look-eduplex .entry-card-wrap{margin-bottom:18px;padding:14px;background:#fff;border-top:5px solid var(--lk-brand);border-radius:4px;box-shadow:0 6px 16px var(--lk-shadow)}
body.body.look-eduplex .entry-card-wrap:hover{background:#fff;transform:translateY(-3px)}
body.body.look-eduplex .entry-card-thumb img{border-radius:4px}
body.body.look-eduplex .entry-card-title{color:var(--lk-brand-ink);font-weight:900;line-height:1.55}
body.body.look-eduplex .entry-card-snippet{color:var(--lk-muted)}
body.body.look-eduplex .cat-label{top:.4em;left:.4em;padding:2px 10px;background:var(--lk-brand);color:#fff;border:0;border-radius:0;font-weight:900;font-size:11px;transform:skewX(-12deg)}
body.body.look-eduplex .pagination .current{background:var(--lk-brand);color:#fff}
body.body.look-eduplex .page-numbers{border-radius:4px}
body.body.look-eduplex .pagination-next-link{background:linear-gradient(90deg,var(--lk-cta1),var(--lk-cta2));color:var(--lk-cta-ink);border:0;border-radius:4px;font-weight:900;box-shadow:0 4px 0 var(--lk-cta-dark)}

/* ---------- 記事ページ（.article .entry-title / .entry-content の h2・h3 / #toc） ---------- */
body.body.look-eduplex .breadcrumb a{color:var(--lk-brand);font-weight:700}
body.body.look-eduplex .article .entry-title{font-family:"Noto Sans JP",sans-serif;font-weight:900;color:var(--lk-brand-ink);font-size:clamp(24px,3.2vw,32px);line-height:1.45}
body.body.look-eduplex .article .eye-catch img{border-radius:4px}
body.body.look-eduplex .article .entry-content h2{margin-top:2.4em;padding:12px 34px 12px 22px;background:var(--lk-brand);color:#fff;border:0;border-radius:0;font-family:"Yusei Magic","Noto Sans JP",sans-serif;font-weight:400;font-size:clamp(20px,2.6vw,27px);line-height:1.45;clip-path:polygon(0 0,100% 0,calc(100% - 22px) 100%,0 100%)}
body.body.look-eduplex .article .entry-content h3{padding:2px 0 2px 12px;background:none;border:0;border-left:6px solid var(--lk-accent);border-radius:0;color:var(--lk-brand);font-weight:900;font-size:20px;line-height:1.5}
body.body.look-eduplex .article .entry-content a{color:var(--lk-brand);font-weight:700}
body.body.look-eduplex .article .toc{border:2px solid var(--lk-line);border-radius:4px;background:#fff}
body.body.look-eduplex .article .toc-title{font-family:"Yusei Magic","Noto Sans JP",sans-serif;color:var(--lk-brand);font-size:18px}
body.body.look-eduplex .article .toc a{color:var(--lk-brand-ink)}
body.body.look-eduplex .entry-categories .cat-link{background:var(--lk-brand);color:#fff;border-radius:0}

/* 「投稿本文下」ウィジェットの導線（.offers。もしもの中身・注記はそのまま。見た目だけ）
   ウィジェット側に style="" が直書きされているので、枠と余白だけ !important で上書きする */
body.body.look-eduplex .widget-single-content-bottom .offers{margin:2.5rem 0 !important;padding:22px 20px 16px !important;border:0 !important;border-top:5px solid var(--lk-brand) !important;border-radius:4px !important;background:#fff;box-shadow:0 8px 20px var(--lk-shadow)}
body.body.look-eduplex .widget-single-content-bottom .offers ul{margin:12px 0;padding:0;list-style:none;display:grid;gap:10px}
body.body.look-eduplex .widget-single-content-bottom .offers li{margin:0;padding:12px 14px;border:1.5px solid var(--lk-line);border-radius:4px;background:#fff}
body.body.look-eduplex .widget-single-content-bottom .offers li a{display:inline-block;padding:9px 18px;background:linear-gradient(90deg,var(--lk-cta1),var(--lk-cta2));color:var(--lk-cta-ink);font-weight:900;text-decoration:none;border-radius:4px;box-shadow:0 4px 0 var(--lk-cta-dark)}
body.body.look-eduplex .widget-single-content-bottom .offers li a::after{content:" »"}
body.body.look-eduplex .widget-single-content-bottom .offers .muted{color:var(--lk-muted);font-size:12px;line-height:1.7}

/* 関連記事・前後の記事 */
body.body.look-eduplex .related-entry-heading{display:inline-block;padding:8px 34px 8px 18px;background:var(--lk-brand);color:#fff;font-size:20px;clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%)}
body.body.look-eduplex .related-entry-card-wrap,
body.body.look-eduplex .pager-post-navi a{background:#fff;border-top:4px solid var(--lk-brand);border-radius:4px;box-shadow:0 6px 16px var(--lk-shadow);margin-bottom:12px}
body.body.look-eduplex .related-entry-card-title{color:var(--lk-brand-ink);font-weight:900}

/* ---------- フッター（.footer / .footer-bottom / .copyright） ---------- */
body.body.look-eduplex .footer{margin-top:40px;background:var(--lk-foot);color:#cfdcec}
body.body.look-eduplex .footer a,
body.body.look-eduplex .footer .site-name-text{color:#fff}
body.body.look-eduplex .footer .copyright{color:#cfdcec}
body.body.look-eduplex .mobile-footer-menu-buttons{background:var(--lk-foot)}
body.body.look-eduplex .mobile-footer-menu-buttons .menu-button-in{color:#fff}

/* ==========================================================
   トップのヒーローと「01 まずここから」（functions.php が出す .lk-* の部品）
   ========================================================== */
body.look-eduplex .lk-wrap{width:min(1100px,calc(100% - 32px));margin-inline:auto}
body.look-eduplex .lk-hero{position:relative;overflow:hidden;padding:70px 0 90px;background:var(--lk-hero)}
body.look-eduplex .lk-hero::before{content:"";position:absolute;left:-15%;right:-15%;top:24%;height:44%;background:var(--lk-band1);transform:rotate(-11deg)}
body.look-eduplex .lk-hero::after{content:"";position:absolute;left:-15%;right:-15%;top:12%;height:12%;background:var(--lk-band2);transform:rotate(-11deg)}
body.look-eduplex .lk-hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:28px}
body.look-eduplex .lk-hero-text{min-width:0}
body.look-eduplex .lk-bubble{display:inline-block;margin:0 0 18px;padding:6px 16px;background:#fff;color:var(--lk-brand-ink);border-radius:4px;font-weight:900;font-size:15px;line-height:1.6}
body.look-eduplex .lk-bubble mark{background:none;color:inherit;box-shadow:inset 0 -.45em 0 var(--lk-accent)}
body.look-eduplex .lk-h1{margin:10px 0 18px;padding:0;background:none;border:0;color:var(--lk-h1);font-family:"Yusei Magic","Noto Sans JP",sans-serif;font-weight:400;font-size:clamp(38px,6.4vw,74px);line-height:1.25;letter-spacing:.02em;text-shadow:0 2px 0 rgba(0,40,90,.25);transform:rotate(-7deg);transform-origin:left center}
body.look-eduplex .lk-h1.long{font-size:clamp(30px,4.4vw,54px)}
body.look-eduplex .lk-h1 span{display:block}
body.look-eduplex .lk-lead{margin:16px 0 0;color:#fff;font-weight:900;font-size:17px;line-height:1.8;text-shadow:0 1px 3px rgba(0,40,90,.45);text-wrap:pretty}
body.look-eduplex .lk-cta{margin-top:22px}
body.look-eduplex .lk-btn{display:inline-block;padding:14px 26px;background:linear-gradient(90deg,var(--lk-cta1),var(--lk-cta2));color:var(--lk-cta-ink);font-weight:900;font-size:15px;text-decoration:none;white-space:nowrap;border-radius:4px;box-shadow:0 4px 0 var(--lk-cta-dark)}
body.look-eduplex .lk-btn::after{content:" »"}
body.look-eduplex .lk-btn:hover{color:var(--lk-cta-ink);transform:translateY(2px);box-shadow:0 2px 0 var(--lk-cta-dark)}
body.look-eduplex .lk-badges{display:flex;flex-wrap:nowrap;justify-content:center;gap:12px}
body.look-eduplex .lk-badge{display:grid;place-items:center;align-content:center;flex:0 0 auto;width:136px;height:136px;border-radius:50%;background:var(--lk-badge);color:#fff;text-align:center;line-height:1.25;box-shadow:0 8px 20px rgba(11,60,140,.25)}
body.look-eduplex .lk-badge small{display:block;font-size:14px;font-weight:700}
body.look-eduplex .lk-badge b{display:block;font-family:"Noto Sans JP",sans-serif;font-weight:900;font-size:34px}

body.look-eduplex .lk-sec{padding:44px 0 52px;background:linear-gradient(170deg,transparent 0 30%,var(--lk-sec-band) 30% 70%,transparent 70%)}
body.look-eduplex .lk-sec-head{display:flex;justify-content:center;margin-bottom:26px}
body.look-eduplex .lk-sh{display:inline-flex;align-items:stretch;margin:0;padding:0;background:var(--lk-brand);color:#fff;border:0;font-family:"Yusei Magic","Noto Sans JP",sans-serif;font-weight:400;font-size:clamp(24px,3.4vw,34px);line-height:1.3;transform:skewX(-14deg)}
body.look-eduplex .lk-sh > span{transform:skewX(14deg)}
body.look-eduplex .lk-num{display:inline-grid;place-items:center;padding:0 12px;background:var(--lk-accent);color:var(--lk-brand);font-family:"Noto Sans JP",sans-serif;font-weight:900}
body.look-eduplex .lk-ttl{padding:6px 24px}
body.look-eduplex .lk-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
body.look-eduplex .lk-pillar{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 14px;background:#fff;text-align:center;text-decoration:none;color:var(--lk-ink);border-radius:4px;border-top:6px solid var(--lk-brand);box-shadow:0 8px 20px var(--lk-shadow);transition:transform .15s}
body.look-eduplex .lk-pillar:hover{transform:translateY(-3px);color:var(--lk-ink)}
body.look-eduplex .lk-ico{width:64px;height:64px;display:grid;place-items:center;border-radius:50%;font-size:30px;background:var(--lk-ico-bg)}
body.look-eduplex .lk-pillar b{font-family:"Yusei Magic","Noto Sans JP",sans-serif;font-weight:400;font-size:21px;line-height:1.35;color:var(--lk-brand)}
body.look-eduplex .lk-pillar small{font-size:13px;color:var(--lk-muted);line-height:1.5}

/* ---------- スマホ（Cocoon の切り替わり 834px に合わせる） ---------- */
@media screen and (max-width:834px){
  body.look-eduplex .lk-hero{padding:44px 0 56px}
  body.look-eduplex .lk-hero-in{grid-template-columns:1fr;gap:20px}
  body.look-eduplex .lk-h1{transform:rotate(-5deg)}
  body.look-eduplex .lk-h1.long{font-size:30px}
  body.look-eduplex .lk-bubble{font-size:14px}
  body.look-eduplex .lk-badges{gap:10px}
  body.look-eduplex .lk-badge{width:100px;height:100px}
  body.look-eduplex .lk-badge small{font-size:11px}
  body.look-eduplex .lk-badge b{font-size:22px}
  body.look-eduplex .lk-sec{padding:30px 0 36px}
  body.look-eduplex .lk-pillars{grid-template-columns:1fr 1fr;gap:12px}
  body.look-eduplex .lk-pillar{padding:14px 8px}
  body.look-eduplex .lk-ico{width:48px;height:48px;font-size:22px}
  body.look-eduplex .lk-pillar b{font-size:17px}
  body.look-eduplex .lk-pillar small{font-size:11px}
  body.body.look-eduplex .article .entry-content h2{font-size:20px;padding:10px 28px 10px 14px}
  body.body.look-eduplex .main{border-radius:0}
}
/* ===== LP風デザイン ここまで ===== */