/* ===== KOKOROE 基本設計（色/フォント/影/丸み） ===== */
:root{
  /* 生成り×安心 */
  --c-bg: #FAFAF7;        /* ページ背景（生成り） */
  --c-surface: #FFFFFF;   /* カード/記事背景 */
  --c-text: #1E2429;      /* 本文色（黒すぎない） */
  --c-muted: #6B7280;     /* 補助文/日付 */
  --c-accent: #6FA8DC;    /* 淡いペールブルー */
  --c-accent-2: #C9C3BA;  /* グレージュ */
  --c-border: #E6E3DC;    /* 区切り線 */

  --radius-lg: 16px;
  --radius-md: 12px;
  --shadow-soft: 0 10px 28px rgba(0,0,0,.06);

  --f-sans: "Noto Sans JP", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --f-serif: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", serif;
}

html, body{
  background: var(--c-bg);
  color: var(--c-text);
  font-family: var(--f-sans);
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

<?php
/* === X(旧Twitter)フォロー＆シェア：ショートコード === */

// XのSVGアイコン（塗りを継承）
function noe_x_svg($class='') {
    return '<svg class="'.esc_attr($class).'" aria-hidden="true" viewBox="0 0 1200 1227" width="20" height="20" fill="currentColor">
<path d="M714 519L1160 0H1052L667 450L356 0H0L468 681L0 1227H108L516 748L844 1227H1200L714 519ZM566 686L522 624L147 80H304L608 493L652 555L1056 1147H900L566 686Z"/>
</svg>';
}

/* 見出しは明朝で“静けさ”を */
h1, h2, h3 { font-family: var(--f-serif); letter-spacing: .02em; }
a{ color: #4F7CA6; text-decoration: underline; text-underline-offset: .2em; }
a:hover{ opacity:.9; }

/* セクション見出し（下線グラデ） */
.kokoroe-section-title{
  font-family: var(--f-serif);
  position: relative;
  padding-bottom:.45rem; margin:0 0 .9rem;
}
.kokoroe-section-title::after{
  content:""; position:absolute; left:0; bottom:0;
  width:72px; height:2px;
  background: linear-gradient(90deg, var(--c-accent), var(--c-accent-2));
  border-radius:4px;
}

/* カード共通 */
.kokoroe-card{
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

/* “柔らかい陰影”の画像 */
.kokoroe-card img{ display:block; width:100%; height:auto; border-bottom:1px solid var(--c-border); }
.kokoroe-meta{ color: var(--c-muted); font-size: .9rem; }

/* ボタン（丸＋淡色） */
.button, .wp-block-button__link{
  background: var(--c-accent) !important;
  color:#fff !important;
  border:none; border-radius:999px;
  padding:.7em 1.2em; box-shadow: var(--shadow-soft);
}
.button:hover, .wp-block-button__link:hover{ filter: brightness(.96); }

/*

Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Template: generatepress
Author: Tom Usborne
Author URI: https://generatepress.com/about
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.6.0.1760735686
Updated: 2025-10-18 06:14:46

*/

@font-face {
  font-display: swap;
}
