@charset "UTF-8";

/*
 * さくエロブログ 総合デザイン v1.4.8
 * Cocoon子テーマ用
 *
 * 対象:
 * 全体レイアウト / ヘッダー / PC・モバイルナビ / フッター
 * 固定ページ / サイドバー / ウィジェット / H1〜H6
 * Gutenberg標準ブロック / Cocoonブロック / 目次
 * 記事カード / ブログカード / 関連記事 / 投稿ナビ
 * フォーム / コメント / ページネーション / hover・focus
 */

:root {
  --sakuero-main: #e55474;
  --sakuero-deep: #bd3f5b;
  --sakuero-hover: #9e3049;
  --sakuero-dark: #352a2f;
  --sakuero-footer: #33282d;
  --sakuero-footer-light: #49383f;
  --sakuero-pale: #fff4f7;
  --sakuero-accent-bg: #fde8ee;
  --sakuero-page-bg: #fff9fb;
  --sakuero-surface: #ffffff;
  --sakuero-text: #302d30;
  --sakuero-muted: #686169;
  --sakuero-border: #ebc4ce;
  --sakuero-border-soft: #f3dce2;
  --sakuero-warning: #9a641c;
  --sakuero-warning-bg: #fff8e8;
  --sakuero-success: #2e7254;
  --sakuero-success-bg: #edf8f2;
  --sakuero-radius-sm: 6px;
  --sakuero-radius: 10px;
  --sakuero-radius-lg: 16px;
  --sakuero-shadow-sm: 0 3px 12px rgba(75, 37, 48, .07);
  --sakuero-shadow: 0 8px 26px rgba(75, 37, 48, .10);
  --sakuero-shadow-hover: 0 12px 30px rgba(75, 37, 48, .16);
  --sakuero-transition: .22s ease;
}

/* =========================================================
 * 1. 全体・レイアウト
 * ========================================================= */

html {
  scroll-behavior: smooth;
}

body,
.body {
  color: var(--sakuero-text);
  background: var(--sakuero-page-bg);
}

#container {
  overflow: clip;
}

.content {
  margin-top: 24px;
}

/*
 * Cocoon側でメインカラムとサイドバーの幅・余白を計算しているため、
 * .content-in には gap を追加しません。
 * gapを設定すると画面幅によってサイドバーが本文下へ回り込むことがあります。
 */

.main {
  border: 1px solid var(--sakuero-border-soft);
  border-radius: var(--sakuero-radius-lg);
  background: var(--sakuero-surface);
  box-shadow: var(--sakuero-shadow-sm);
}

#main .entry-content {
  max-width: none;
  color: var(--sakuero-text);
}

#main .entry-content,
#main .article {
  line-height: 1.85;
}

::selection {
  color: var(--sakuero-dark);
  background: var(--sakuero-accent-bg);
}

img {
  transition: opacity var(--sakuero-transition);
}

a {
  text-underline-offset: .2em;
  text-decoration-thickness: 1px;
}

#main .entry-content a:not(.wp-block-button__link):not(.btn):not(.blogcard-wrap),
#main .article a:not(.wp-block-button__link):not(.btn):not(.blogcard-wrap) {
  color: var(--sakuero-deep);
  text-decoration-color: rgba(189, 63, 91, .45);
  transition: color var(--sakuero-transition), text-decoration-color var(--sakuero-transition);
}

#main .entry-content a:not(.wp-block-button__link):not(.btn):not(.blogcard-wrap):hover,
#main .article a:not(.wp-block-button__link):not(.btn):not(.blogcard-wrap):hover {
  color: var(--sakuero-hover);
  text-decoration-color: currentColor;
}

/* =========================================================
 * 2. ヘッダー・ロゴ
 * ========================================================= */

#header-container,
.header-container {
  border-bottom: 1px solid var(--sakuero-border);
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 3px 16px rgba(75, 37, 48, .07);
}

.header,
.header-container-in {
  background-color: transparent;
}

.site-name-text,
.logo-text,
.site-name-text-link {
  color: var(--sakuero-deep);
}

.site-name-text {
  font-weight: 800;
  letter-spacing: .035em;
}

.site-name-text-link {
  text-decoration: none;
  transition: opacity var(--sakuero-transition);
}

.site-name-text-link:hover {
  color: var(--sakuero-deep);
  opacity: .76;
}

.tagline {
  color: var(--sakuero-muted);
  font-size: .82em;
}

/* =========================================================
 * 3. PCグローバルナビ・サブメニュー
 * ========================================================= */

.navi {
  border-top: 1px solid rgba(235, 196, 206, .45);
  background: #fff;
}

.navi-in > ul {
  gap: 2px;
}

.navi-in > ul > li > a {
  color: var(--sakuero-text);
  font-weight: 700;
  letter-spacing: .015em;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition);
}

.navi-in > ul > li > a::after {
  content: "";
  position: absolute;
  right: 18%;
  bottom: 7px;
  left: 18%;
  height: 3px;
  border-radius: 999px;
  background: var(--sakuero-main);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--sakuero-transition);
}

.navi-in > ul > li:hover > a,
.navi-in > ul > li:focus-within > a,
.navi-in > ul > li.current-menu-item > a,
.navi-in > ul > li.current-menu-ancestor > a,
.navi-in > ul > li.current-category-ancestor > a {
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

.navi-in > ul > li:hover > a::after,
.navi-in > ul > li:focus-within > a::after,
.navi-in > ul > li.current-menu-item > a::after,
.navi-in > ul > li.current-menu-ancestor > a::after,
.navi-in > ul > li.current-category-ancestor > a::after {
  transform: scaleX(1);
}

.navi-in > ul .sub-menu {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: 0 0 var(--sakuero-radius) var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow);
}

.navi-in > ul .sub-menu li {
  height: auto;
  border-bottom: 1px solid var(--sakuero-border-soft);
}

.navi-in > ul .sub-menu li:last-child {
  border-bottom: 0;
}

.navi-in > ul .sub-menu a {
  min-height: 46px;
  padding: 11px 16px;
  color: var(--sakuero-text);
  font-size: .94em;
  font-weight: 600;
}

.navi-in > ul .sub-menu a:hover,
.navi-in > ul .sub-menu a:focus-visible {
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

/* =========================================================
 * 4. パンくず
 * ========================================================= */

.breadcrumb {
  margin: 14px auto;
  padding: 0 8px;
  color: var(--sakuero-muted);
  font-size: .84em;
}

.breadcrumb a {
  color: var(--sakuero-muted);
  text-decoration: none;
  transition: color var(--sakuero-transition);
}

.breadcrumb a:hover {
  color: var(--sakuero-deep);
}

/* =========================================================
 * 5. H1〜H6
 * ========================================================= */

#main .entry-title,
#main .article h1,
#main .entry-content h1,
#main .article h2,
#main .entry-content h2,
#main .article h3,
#main .entry-content h3,
#main .article h4,
#main .entry-content h4,
#main .article h5,
#main .entry-content h5,
#main .article h6,
#main .entry-content h6 {
  color: var(--sakuero-text);
  font-weight: 750;
  word-break: auto-phrase;
}

#main .entry-title,
#main .article h1,
#main .entry-content h1 {
  padding: 0 0 .55em;
  border: 0;
  border-bottom: 3px solid var(--sakuero-deep);
  background: transparent;
  font-size: clamp(1.72rem, 3.1vw, 2.25rem);
  line-height: 1.42;
  letter-spacing: .015em;
}

#main .article h1,
#main .entry-content h1 {
  margin-top: 1.8em;
}

#main .article h2,
#main .entry-content h2 {
  padding: .72em .9em;
  border: 0;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--sakuero-deep), #d34e6c);
  box-shadow: 0 5px 14px rgba(189, 63, 91, .14);
  font-size: clamp(1.35rem, 2.25vw, 1.62rem);
  line-height: 1.45;
  letter-spacing: .015em;
}

#main .article h3,
#main .entry-content h3 {
  padding: .32em 0 .34em .8em;
  border: 0;
  border-bottom: 1px solid var(--sakuero-border);
  border-left: 5px solid var(--sakuero-main);
  background: transparent;
  font-size: clamp(1.18rem, 1.85vw, 1.34rem);
  line-height: 1.5;
}

#main .article h4,
#main .entry-content h4 {
  padding: .52em .72em;
  border: 0;
  border-left: 4px solid var(--sakuero-deep);
  border-radius: 0 7px 7px 0;
  background: var(--sakuero-pale);
  font-size: clamp(1.08rem, 1.55vw, 1.18rem);
  line-height: 1.55;
}

#main .article h5,
#main .entry-content h5 {
  padding: 0 0 .35em;
  border: 0;
  border-bottom: 2px dotted var(--sakuero-border);
  color: var(--sakuero-deep);
  background: transparent;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  line-height: 1.6;
}

#main .article h6,
#main .entry-content h6 {
  position: relative;
  padding: 0 0 0 1.05em;
  border: 0;
  color: var(--sakuero-muted);
  background: transparent;
  font-size: clamp(.94rem, 1.2vw, 1rem);
  line-height: 1.65;
  letter-spacing: .025em;
}

#main .article h6::before,
#main .entry-content h6::before {
  content: "";
  position: absolute;
  top: .66em;
  left: 0;
  width: .48em;
  height: .48em;
  border-radius: 50%;
  background: var(--sakuero-main);
}

#main .article :is(h1, h2, h3, h4, h5, h6) a,
#main .entry-content :is(h1, h2, h3, h4, h5, h6) a {
  color: inherit;
  text-decoration: none;
}

#main .article h2 a,
#main .entry-content h2 a {
  color: #fff;
}

/* =========================================================
 * 6. 固定ページ
 * ========================================================= */

.page .entry-title {
  margin-bottom: 1em;
}

.sakuero-fixed-page {
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
}

.sakuero-fixed-page > *:first-child {
  margin-top: 0;
}

.sakuero-page-lead,
.sakuero-info-box,
.sakuero-note-box,
.sakuero-warning-box,
.sakuero-ad-box {
  margin: 1.55em 0;
  padding: 1.2em 1.3em;
  border-radius: var(--sakuero-radius);
}

.sakuero-page-lead {
  border: 1px solid var(--sakuero-border);
  background: linear-gradient(135deg, #fff 0%, var(--sakuero-pale) 100%);
  box-shadow: var(--sakuero-shadow-sm);
  font-size: 1.04em;
}

.sakuero-info-box {
  border: 1px solid var(--sakuero-border-soft);
  border-left: 5px solid var(--sakuero-main);
  background: var(--sakuero-pale);
}

.sakuero-note-box {
  border: 1px solid var(--sakuero-border);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
}

.sakuero-warning-box {
  border: 1px solid #e5b765;
  border-left: 5px solid #d0912c;
  background: var(--sakuero-warning-bg);
  color: #624617;
}

.sakuero-ad-box {
  border: 1px dashed var(--sakuero-main);
  background: var(--sakuero-accent-bg);
  font-size: .95em;
}

.sakuero-page-lead > *:last-child,
.sakuero-info-box > *:last-child,
.sakuero-note-box > *:last-child,
.sakuero-warning-box > *:last-child,
.sakuero-ad-box > *:last-child {
  margin-bottom: 0;
}

.sakuero-card-grid,
.sakuero-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 1.45em 0 2em;
}

.sakuero-card,
.sakuero-link-card {
  height: 100%;
  padding: 1.2em 1.25em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
  transition:
    transform var(--sakuero-transition),
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition);
}

.sakuero-card:hover,
.sakuero-link-card:hover {
  border-color: var(--sakuero-main);
  transform: translateY(-3px);
  box-shadow: var(--sakuero-shadow-hover);
}

.sakuero-card h3,
.sakuero-link-card h3 {
  margin-top: 0 !important;
}

.sakuero-card h3 a,
.sakuero-link-card h3 a {
  text-decoration: none !important;
}

.sakuero-card p,
.sakuero-link-card p {
  color: var(--sakuero-muted);
}

.sakuero-card ul,
.sakuero-link-card ul {
  margin-bottom: 0;
}

.sakuero-category-count {
  display: inline-block;
  margin-left: .4em;
  padding: .08em .48em;
  border-radius: 999px;
  color: var(--sakuero-muted);
  background: var(--sakuero-pale);
  font-size: .78em;
  font-weight: 500;
}

.sakuero-child-categories {
  margin: .8em 0 0;
  padding-left: 1.2em;
}

.sakuero-updated {
  margin-top: 2.5em;
  padding-top: 1em;
  border-top: 1px solid var(--sakuero-border);
  color: var(--sakuero-muted);
  font-size: .88em;
  text-align: right;
}

.sakuero-policy-index {
  padding: 1.05em 1.25em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
}

.sakuero-policy-index ul {
  margin-bottom: 0;
  columns: 2;
  column-gap: 2em;
}

.sakuero-profile-table th {
  width: 28%;
  white-space: nowrap;
  background: var(--sakuero-pale);
}

/* =========================================================
 * 7. Gutenberg標準ブロック
 * ========================================================= */

/* 段落・リード */
#main .entry-content p {
  color: var(--sakuero-text);
}

#main .entry-content .has-drop-cap:not(:focus)::first-letter {
  color: var(--sakuero-deep);
  font-weight: 800;
}

/* リスト */
#main .entry-content ul,
#main .entry-content ol {
  border-radius: var(--sakuero-radius-sm);
}

#main .entry-content li::marker {
  color: var(--sakuero-main);
  font-weight: 700;
}

#main .entry-content li + li {
  margin-top: .34em;
}

/* 表 */
#main .wp-block-table {
  overflow-x: auto;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
}

#main .wp-block-table table,
#main .entry-content table,
#main .article table {
  width: 100%;
  border-color: var(--sakuero-border);
}

#main .entry-content th,
#main .article th {
  color: var(--sakuero-text);
  background: var(--sakuero-pale);
  font-weight: 700;
}

#main .entry-content th,
#main .entry-content td,
#main .article th,
#main .article td {
  border-color: var(--sakuero-border);
}

#main .entry-content tr:nth-child(even) td {
  background: #fffafb;
}

/* =========================================================
 * 投稿・固定ページ共通：テーブル表示
 * ========================================================= */

#main .wp-block-table,
.main .wp-block-table,
.sakuero-fixed-page .wp-block-table {
  width: 100%;
  max-width: 100%;
}

#main .wp-block-table table,
#main .entry-content table,
#main .article table,
.main .wp-block-table table,
.sakuero-fixed-page table {
  width: 100% !important;
  max-width: 100%;
  table-layout: auto;
  border-collapse: collapse;
}

#main .wp-block-table th,
#main .wp-block-table td,
#main .entry-content th,
#main .entry-content td,
#main .article th,
#main .article td,
.sakuero-fixed-page th,
.sakuero-fixed-page td {
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: normal;
}

/* 画面幅を超える表のみ横スクロール */
#main .wp-block-table,
.main .wp-block-table,
.sakuero-fixed-page .wp-block-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media screen and (max-width: 600px) {
  #main .wp-block-table table,
  #main .entry-content table,
  #main .article table,
  .sakuero-fixed-page table {
    min-width: 560px;
  }

  /* プロフィール表とお問い合わせ表は既存のモバイル表示を優先 */
  #main .sakuero-profile-table table,
  #main .sakuero-contact-table {
    min-width: 0;
  }
}


/* 引用・プルクオート */
#main .wp-block-quote,
#main blockquote {
  padding: 1.15em 1.25em;
  border: 1px solid var(--sakuero-border-soft);
  border-left: 5px solid var(--sakuero-main);
  border-radius: 0 var(--sakuero-radius) var(--sakuero-radius) 0;
  color: #50474c;
  background: var(--sakuero-pale);
}

#main .wp-block-quote cite,
#main blockquote cite {
  color: var(--sakuero-muted);
  font-size: .88em;
}

#main .wp-block-pullquote {
  padding: 1.5em;
  border-top: 3px solid var(--sakuero-main);
  border-bottom: 3px solid var(--sakuero-main);
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

/* ボタン */
#main .wp-block-button__link,
#main .sakuero-button,
#main a.btn,
#main .btn a,
#main button,
#main input[type="submit"] {
  border: 1px solid var(--sakuero-deep);
  border-radius: 9px;
  color: #fff;
  background: var(--sakuero-deep);
  box-shadow: 0 4px 12px rgba(189, 63, 91, .18);
  font-weight: 700;
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    transform .15s ease,
    box-shadow var(--sakuero-transition);
}

#main .wp-block-button__link:hover,
#main .sakuero-button:hover,
#main a.btn:hover,
#main .btn a:hover,
#main button:hover,
#main input[type="submit"]:hover {
  color: #fff;
  border-color: var(--sakuero-hover);
  background: var(--sakuero-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(158, 48, 73, .23);
}

#main .is-style-outline > .wp-block-button__link {
  color: var(--sakuero-deep);
  background: #fff;
}

#main .is-style-outline > .wp-block-button__link:hover {
  color: #fff;
  background: var(--sakuero-deep);
}

/* 画像・ギャラリー */
#main .wp-block-image img,
#main .wp-block-gallery img {
  border-radius: var(--sakuero-radius-sm);
}

#main .wp-block-image a img,
#main .wp-block-gallery a img {
  transition: opacity var(--sakuero-transition), transform var(--sakuero-transition);
}

#main .wp-block-image a:hover img,
#main .wp-block-gallery a:hover img {
  opacity: .9;
  transform: scale(1.006);
}

#main figcaption {
  color: var(--sakuero-muted);
  font-size: .86em;
}

/* 区切り */
#main .wp-block-separator {
  border-color: var(--sakuero-border);
  opacity: 1;
}

#main .wp-block-separator.is-style-wide {
  border-top-width: 2px;
}

/* コード */
#main pre,
#main .wp-block-code {
  border: 1px solid #2c3442;
  border-radius: var(--sakuero-radius);
  background: #17202d;
  color: #eef2f7;
  box-shadow: var(--sakuero-shadow-sm);
}

#main code:not(pre code) {
  color: #8b2940;
  background: #f9edf1;
}

/* 詳細 */
#main .wp-block-details {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
}

#main .wp-block-details summary {
  padding: .9em 1.05em;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
  font-weight: 700;
  cursor: pointer;
  transition: background-color var(--sakuero-transition);
}

#main .wp-block-details summary:hover {
  background: var(--sakuero-accent-bg);
}

#main .wp-block-details > :not(summary) {
  margin-right: 1.05em;
  margin-left: 1.05em;
}

/* カバー・メディアとテキスト・グループ */
#main .wp-block-cover,
#main .wp-block-media-text {
  overflow: hidden;
  border-radius: var(--sakuero-radius);
}

#main .wp-block-media-text {
  border: 1px solid var(--sakuero-border-soft);
  background: #fff;
}

#main .wp-block-media-text__content {
  padding: clamp(1em, 3vw, 2em);
}

#main .wp-block-group.has-background,
#main .wp-block-columns.has-background {
  border-radius: var(--sakuero-radius);
}

/* ファイル・検索 */
#main .wp-block-file {
  padding: 1em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: var(--sakuero-pale);
}

#main .wp-block-file__button {
  border-radius: 7px;
  color: #fff;
  background: var(--sakuero-deep);
}

#main .wp-block-search__inside-wrapper {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: 9px;
  background: #fff;
}

#main .wp-block-search__input {
  border: 0;
}

#main .wp-block-search__button {
  margin: 0;
  border-radius: 0;
}

/* 最新記事・カテゴリー等 */
#main :is(.wp-block-latest-posts, .wp-block-page-list, .wp-block-categories-list, .wp-block-archives-list) {
  padding: 0;
  list-style: none;
}

#main :is(.wp-block-latest-posts, .wp-block-page-list, .wp-block-categories-list, .wp-block-archives-list) li {
  border-bottom: 1px solid var(--sakuero-border-soft);
}

#main :is(.wp-block-latest-posts, .wp-block-page-list, .wp-block-categories-list, .wp-block-archives-list) a {
  display: block;
  padding: .65em .45em;
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    padding-left var(--sakuero-transition);
}

#main :is(.wp-block-latest-posts, .wp-block-page-list, .wp-block-categories-list, .wp-block-archives-list) a:hover {
  padding-left: .75em;
  background: var(--sakuero-pale);
}

/* =========================================================
 * 8. Cocoon独自ブロック・装飾
 * ========================================================= */

#main :is(
  .information-box,
  .question-box,
  .alert-box,
  .memo-box,
  .comment-box,
  .common-icon-box,
  .blank-box,
  .tab-caption-box,
  .label-box,
  .toggle-wrap,
  .timeline-box,
  .profile-box,
  .ranking-item
) {
  border-radius: var(--sakuero-radius);
  box-shadow: var(--sakuero-shadow-sm);
}

#main :is(.information-box, .memo-box) {
  border-color: var(--sakuero-border);
  background-color: var(--sakuero-pale);
}

#main .question-box {
  border-color: #d7c9e9;
  background-color: #f8f4fc;
}

#main .alert-box {
  border-color: #e4bd77;
  background-color: var(--sakuero-warning-bg);
}

#main .blank-box {
  border-color: var(--sakuero-border);
}

#main .toggle-button {
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
  font-weight: 700;
  transition: background-color var(--sakuero-transition);
}

#main .toggle-button:hover {
  background: var(--sakuero-accent-bg);
}

#main .tab-caption-box-label,
#main .label-box-label {
  border-radius: var(--sakuero-radius-sm) var(--sakuero-radius-sm) 0 0;
  background: var(--sakuero-deep);
  color: #fff;
}

#main .micro-balloon {
  border-color: var(--sakuero-border);
  background: var(--sakuero-pale);
}

#main .speech-balloon {
  border-color: var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
}

/* =========================================================
 * 9. 目次
 * ========================================================= */

.toc {
  width: min(100%, 720px);
  margin: 1.7em auto;
  padding: 1.2em 1.4em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: linear-gradient(135deg, #fff, var(--sakuero-pale));
  box-shadow: var(--sakuero-shadow-sm);
  font-size: .94em;
}

.toc-title {
  padding: 0 0 .75em;
  border-bottom: 2px solid var(--sakuero-main);
  color: var(--sakuero-deep);
  font-size: 1.12em;
  font-weight: 800;
  text-align: left;
}

.toc .toc-list {
  margin-top: .75em;
}

.toc li {
  margin: .28em 0;
}

.toc a {
  display: inline-block;
  padding: .15em .25em;
  border-radius: 4px;
  color: var(--sakuero-text);
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.toc a:hover {
  color: var(--sakuero-deep);
  background: var(--sakuero-accent-bg);
  text-decoration: none;
  transform: translateX(2px);
}

.nwa .toc {
  width: 100%;
  padding: 1em;
  border: 1px solid var(--sakuero-border);
}

/* =========================================================
 * 10. ブログカード・記事カード・関連記事
 * ========================================================= */

/* ブログカード */
.blogcard-wrap {
  width: 100%;
  margin: 1.5em auto;
  text-decoration: none;
}

.blogcard {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
  transition:
    transform var(--sakuero-transition),
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition);
}

.blogcard-wrap:hover .blogcard {
  border-color: var(--sakuero-main);
  transform: translateY(-2px);
  box-shadow: var(--sakuero-shadow-hover);
}

.blogcard-title {
  color: var(--sakuero-text);
  font-weight: 750;
}

.blogcard-snippet,
.blogcard-footer {
  color: var(--sakuero-muted);
}

/* 記事一覧・関連記事 */
.entry-card-wrap,
.related-entry-card-wrap {
  border: 1px solid transparent;
  border-radius: var(--sakuero-radius);
  transition:
    transform var(--sakuero-transition),
    border-color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition);
}

.entry-card-wrap:hover,
.related-entry-card-wrap:hover {
  border-color: var(--sakuero-border);
  background: #fff;
  transform: translateY(-2px);
  box-shadow: var(--sakuero-shadow);
}

.entry-card-wrap a,
.related-entry-card-wrap a {
  color: var(--sakuero-text);
  text-decoration: none;
}

.entry-card-title,
.related-entry-card-title,
.widget-entry-card-title {
  color: var(--sakuero-text);
  transition: color var(--sakuero-transition);
}

.entry-card-wrap:hover .entry-card-title,
.related-entry-card-wrap:hover .related-entry-card-title,
.widget-entry-card:hover .widget-entry-card-title {
  color: var(--sakuero-deep);
}

.entry-card-thumb img,
.related-entry-card-thumb img,
.widget-entry-card-thumb img,
.popular-entry-card-thumb img,
.new-entry-card-thumb img {
  border-radius: var(--sakuero-radius-sm);
  transition: opacity var(--sakuero-transition), transform var(--sakuero-transition);
}

.entry-card-wrap:hover img,
.related-entry-card-wrap:hover img,
.widget-entry-card:hover img {
  opacity: .9;
  transform: scale(1.015);
}

.cat-label,
.entry-category,
.tag-link {
  border-radius: 999px;
}

.related-entry-heading,
.comment-title {
  padding-bottom: .45em;
  border-bottom: 2px solid var(--sakuero-main);
  color: var(--sakuero-text);
  font-weight: 750;
}

/* =========================================================
 * サムネイル左上のカテゴリラベル
 * サイドバー新着記事・人気記事・関連記事・記事一覧に対応
 * ========================================================= */

#main .cat-label,
.sidebar .cat-label,
.widget .cat-label,
.entry-card .cat-label,
.related-entry-card .cat-label,
.widget-entry-card .cat-label,
.new-entry-card .cat-label,
.popular-entry-card .cat-label {
  display: inline-flex;
  min-height: 25px;
  align-items: center;
  justify-content: center;
  padding: .24em .62em;
  border: 1px solid var(--sakuero-deep) !important;
  border-radius: 999px;
  color: #fff !important;
  background: var(--sakuero-deep) !important;
  box-shadow: 0 2px 7px rgba(75, 37, 48, .18);
  font-size: .76em;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: .015em;
  text-decoration: none !important;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition),
    transform var(--sakuero-transition);
}

#main a:hover .cat-label,
.sidebar a:hover .cat-label,
.widget a:hover .cat-label,
.entry-card-wrap:hover .cat-label,
.related-entry-card-wrap:hover .cat-label,
.widget-entry-card:hover .cat-label,
.new-entry-card:hover .cat-label,
.popular-entry-card:hover .cat-label {
  border-color: var(--sakuero-hover) !important;
  color: #fff !important;
  background: var(--sakuero-hover) !important;
  box-shadow: 0 4px 11px rgba(75, 37, 48, .24);
  transform: translateY(-1px);
}

#main .cat-label:focus-visible,
.sidebar .cat-label:focus-visible {
  outline: 3px solid rgba(229, 84, 116, .35);
  outline-offset: 2px;
}

@media screen and (max-width: 480px) {
  #main .cat-label,
  .sidebar .cat-label,
  .widget .cat-label {
    min-height: 23px;
    padding: .22em .55em;
    font-size: .72em;
  }
}


/* =========================================================
 * 11. サイドバー・ウィジェット
 * ========================================================= */

.sidebar {
  padding: 0;
  border: 0;
  background: transparent;
}

.sidebar .widget,
.sidebar .nwa {
  margin-bottom: 22px;
  padding: 17px;
  border: 1px solid var(--sakuero-border-soft);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
}

.sidebar h2,
.sidebar h3,
.sidebar .widget-title,
.sidebar .main-widget-label {
  margin: 0 0 14px;
  padding: .68em .78em;
  border: 0;
  border-left: 5px solid var(--sakuero-main);
  border-radius: 0 7px 7px 0;
  color: var(--sakuero-text);
  background: var(--sakuero-pale);
  font-size: 1.04em;
  font-weight: 750;
  line-height: 1.4;
}

.sidebar :is(
  .widget_recent_entries,
  .widget_categories,
  .widget_archive,
  .widget_pages,
  .widget_meta,
  .widget_rss,
  .widget_nav_menu,
  .widget_block
) ul {
  padding: 0;
  list-style: none;
}

.sidebar :is(
  .widget_recent_entries,
  .widget_categories,
  .widget_archive,
  .widget_pages,
  .widget_meta,
  .widget_rss,
  .widget_nav_menu,
  .widget_block
) li {
  border-bottom: 1px solid var(--sakuero-border-soft);
}

.sidebar :is(
  .widget_recent_entries,
  .widget_categories,
  .widget_archive,
  .widget_pages,
  .widget_meta,
  .widget_rss,
  .widget_nav_menu,
  .widget_block
) li:last-child {
  border-bottom: 0;
}

.sidebar :is(
  .widget_recent_entries,
  .widget_categories,
  .widget_archive,
  .widget_pages,
  .widget_meta,
  .widget_rss,
  .widget_nav_menu,
  .widget_block
) li > a {
  position: relative;
  padding: .7em .45em;
  border-radius: var(--sakuero-radius-sm);
  color: var(--sakuero-text);
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    padding-left var(--sakuero-transition);
}

.sidebar :is(
  .widget_recent_entries,
  .widget_categories,
  .widget_archive,
  .widget_pages,
  .widget_meta,
  .widget_rss,
  .widget_nav_menu,
  .widget_block
) li > a:hover {
  padding-left: .75em;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

.sidebar .post-count,
.sidebar .tag-link-count {
  display: inline-flex;
  min-width: 1.8em;
  min-height: 1.8em;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--sakuero-muted);
  background: var(--sakuero-pale);
  font-size: .78em;
}

.sidebar .tagcloud {
  gap: 6px;
}

.sidebar .tagcloud a {
  margin: 0;
  padding: .42em .65em;
  border: 1px solid var(--sakuero-border);
  border-radius: 999px;
  color: var(--sakuero-deep);
  background: #fff;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.sidebar .tagcloud a:hover {
  color: #fff;
  border-color: var(--sakuero-deep);
  background: var(--sakuero-deep);
  transform: translateY(-1px);
}

.sidebar .search-box,
.sidebar .wp-block-search__inside-wrapper {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: 9px;
  background: #fff;
}

.sidebar .search-edit,
.sidebar .wp-block-search__input {
  border: 0;
  box-shadow: none;
}

.sidebar .widget-entry-card {
  padding: 8px;
  border-radius: var(--sakuero-radius-sm);
  transition: background-color var(--sakuero-transition), transform var(--sakuero-transition);
}

.sidebar .widget-entry-card:hover {
  background: var(--sakuero-pale);
  transform: translateX(2px);
}

.sidebar .author-box {
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* =========================================================
 * サイドバー：親カテゴリーと子カテゴリーの階層表示
 * WordPressカテゴリーの「親カテゴリー」が設定されると反映
 * ========================================================= */

.sidebar .wp-block-categories-list,
.sidebar .widget_categories > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 親カテゴリー */
.sidebar .wp-block-categories-list > li,
.sidebar .widget_categories > ul > li {
  overflow: hidden;
  margin: 0 0 10px;
  padding: 0;
  border: 1px solid var(--sakuero-border-soft);
  border-radius: 9px;
  background: #fff;
}

.sidebar .wp-block-categories-list > li:last-child,
.sidebar .widget_categories > ul > li:last-child {
  margin-bottom: 0;
}

.sidebar .wp-block-categories-list > li > a,
.sidebar .widget_categories > ul > li > a {
  display: flex;
  min-height: 42px;
  align-items: center;
  padding: .68em .8em;
  border-left: 5px solid var(--sakuero-main);
  border-radius: 0;
  color: var(--sakuero-text);
  background: var(--sakuero-pale);
  font-weight: 750;
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    padding-left var(--sakuero-transition);
}

.sidebar .wp-block-categories-list > li > a:hover,
.sidebar .widget_categories > ul > li > a:hover {
  padding-left: 1em;
  color: var(--sakuero-deep);
  background: var(--sakuero-accent-bg);
}

/* 親カテゴリー直下の記事数 */
.sidebar .wp-block-categories-list > li > .post-count,
.sidebar .widget_categories > ul > li > .post-count {
  margin-left: .4em;
}

/* 子カテゴリーを囲む領域 */
.sidebar .wp-block-categories-list ul.children,
.sidebar .widget_categories ul.children {
  position: relative;
  margin: 0;
  padding: .38em .45em .45em 1.55em;
  border-top: 1px solid var(--sakuero-border-soft);
  background: #fff;
  list-style: none;
}

.sidebar .wp-block-categories-list ul.children::before,
.sidebar .widget_categories ul.children::before {
  content: "";
  position: absolute;
  top: .65em;
  bottom: .65em;
  left: .86em;
  width: 2px;
  border-radius: 999px;
  background: var(--sakuero-border);
}

/* 子カテゴリー */
.sidebar .wp-block-categories-list ul.children > li,
.sidebar .widget_categories ul.children > li {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--sakuero-border-soft);
  border-radius: 0;
  background: transparent;
}

.sidebar .wp-block-categories-list ul.children > li:last-child,
.sidebar .widget_categories ul.children > li:last-child {
  border-bottom: 0;
}

.sidebar .wp-block-categories-list ul.children > li::before,
.sidebar .widget_categories ul.children > li::before {
  content: "";
  position: absolute;
  top: 1.18em;
  left: -.69em;
  width: .55em;
  height: 2px;
  background: var(--sakuero-border);
}

.sidebar .wp-block-categories-list ul.children > li > a,
.sidebar .widget_categories ul.children > li > a {
  display: flex;
  min-height: 38px;
  align-items: center;
  padding: .58em .5em .58em .65em;
  border: 0;
  border-radius: 6px;
  color: var(--sakuero-text);
  background: transparent;
  font-size: .94em;
  font-weight: 500;
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    padding-left var(--sakuero-transition);
}

.sidebar .wp-block-categories-list ul.children > li > a::before,
.sidebar .widget_categories ul.children > li > a::before {
  content: "›";
  margin-right: .45em;
  color: var(--sakuero-main);
  font-weight: 800;
}

.sidebar .wp-block-categories-list ul.children > li > a:hover,
.sidebar .widget_categories ul.children > li > a:hover {
  padding-left: .85em;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

/* 孫カテゴリー以降はさらにインデント */
.sidebar .wp-block-categories-list ul.children ul.children,
.sidebar .widget_categories ul.children ul.children {
  margin-left: .4em;
  padding-left: 1.35em;
  border-top: 0;
  background: transparent;
}

.sidebar .wp-block-categories-list ul.children ul.children > li > a,
.sidebar .widget_categories ul.children ul.children > li > a {
  font-size: .9em;
}

/* 投稿数バッジ */
.sidebar .wp-block-categories-list .post-count,
.sidebar .widget_categories .post-count {
  display: inline-flex;
  min-width: 1.8em;
  min-height: 1.8em;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 0 .35em;
  border-radius: 999px;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
  font-size: .74em;
  font-weight: 700;
  line-height: 1;
}

@media screen and (max-width: 480px) {
  .sidebar .wp-block-categories-list > li > a,
  .sidebar .widget_categories > ul > li > a {
    min-height: 40px;
    padding: .62em .72em;
  }

  .sidebar .wp-block-categories-list ul.children,
  .sidebar .widget_categories ul.children {
    padding-left: 1.42em;
  }
}


/* =========================================================
 * サイドバー：プロフィールリンクボタン
 * ========================================================= */

.sidebar .sakuero-sidebar-section .wp-block-buttons {
  width: 100%;
  margin-top: 1em;
}

.sidebar .sakuero-sidebar-section .wp-block-button {
  width: 100%;
  margin: 0;
}

.sidebar .sakuero-sidebar-section .wp-block-button__link,
.sidebar .sakuero-sidebar-section .is-style-outline > .wp-block-button__link {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .55em;
  padding: .72em 1em;
  border: 1px solid var(--sakuero-deep) !important;
  border-radius: 9px;
  color: var(--sakuero-deep) !important;
  background: #fff !important;
  box-shadow: 0 4px 12px rgba(75, 37, 48, .08);
  font-size: .92em;
  font-weight: 750;
  line-height: 1.4;
  text-align: center;
  text-decoration: none !important;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.sidebar .sakuero-sidebar-section .wp-block-button__link::after {
  content: "→";
  display: inline-block;
  font-size: 1.05em;
  font-weight: 800;
  line-height: 1;
  transition: transform var(--sakuero-transition);
}

.sidebar .sakuero-sidebar-section .wp-block-button__link:hover,
.sidebar .sakuero-sidebar-section .wp-block-button__link:focus-visible {
  border-color: var(--sakuero-hover) !important;
  color: #fff !important;
  background: var(--sakuero-hover) !important;
  box-shadow: 0 7px 18px rgba(158, 48, 73, .22);
  transform: translateY(-2px);
}

.sidebar .sakuero-sidebar-section .wp-block-button__link:hover::after,
.sidebar .sakuero-sidebar-section .wp-block-button__link:focus-visible::after {
  transform: translateX(3px);
}

.sidebar .sakuero-sidebar-section .wp-block-button__link:active {
  box-shadow: 0 3px 8px rgba(75, 37, 48, .14);
  transform: translateY(0);
}

@media screen and (max-width: 480px) {
  .sidebar .sakuero-sidebar-section .wp-block-button__link,
  .sidebar .sakuero-sidebar-section .is-style-outline > .wp-block-button__link {
    min-height: 42px;
    padding: .68em .85em;
    font-size: .9em;
  }
}


/* =========================================================
 * 12. プロフィール・著者
 * ========================================================= */

.author-box {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: linear-gradient(135deg, #fff, var(--sakuero-pale));
  box-shadow: var(--sakuero-shadow-sm);
}

.author-thumb img {
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 3px 12px rgba(75, 37, 48, .14);
}

.author-box .author-name {
  color: var(--sakuero-deep);
  font-weight: 800;
}

.author-box .sns-follow-buttons a.follow-button {
  border-color: var(--sakuero-border);
  border-radius: 50%;
  color: var(--sakuero-deep);
  background: #fff;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.author-box .sns-follow-buttons a.follow-button:hover {
  color: #fff;
  border-color: var(--sakuero-deep);
  background: var(--sakuero-deep);
  opacity: 1;
  transform: translateY(-2px);
}

/* =========================================================
 * 13. SNS・フォーム・コメント
 * ========================================================= */

.sns-share-buttons a,
.sns-follow-buttons a {
  border-radius: 7px;
  transition: opacity var(--sakuero-transition), transform var(--sakuero-transition), filter var(--sakuero-transition);
}

.sns-share-buttons a:hover,
.sns-follow-buttons a:hover {
  opacity: .9;
  filter: saturate(1.05);
  transform: translateY(-2px);
}

/* フォーム共通 */
#main input[type="text"],
#main input[type="email"],
#main input[type="url"],
#main input[type="tel"],
#main input[type="number"],
#main input[type="search"],
#main input[type="password"],
#main select,
#main textarea,
.sidebar input[type="search"],
.sidebar input[type="text"],
.sidebar select {
  width: 100%;
  border: 1px solid #d7c3ca;
  border-radius: 8px;
  background: #fff;
  color: var(--sakuero-text);
  transition:
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition);
}

#main input:focus,
#main select:focus,
#main textarea:focus,
.sidebar input:focus,
.sidebar select:focus {
  border-color: var(--sakuero-main);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(229, 84, 116, .16);
}

.sakuero-contact-form,
.wpcf7 {
  margin-top: 1.5em;
  padding: 1.3em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow);
}

.wpcf7 label {
  color: var(--sakuero-text);
  font-weight: 700;
}

.wpcf7-not-valid-tip {
  color: #b4233f;
}

.wpcf7 form .wpcf7-response-output {
  border-radius: var(--sakuero-radius-sm);
}

.commets-list .comment-body,
.commets-list .st-comment-body {
  padding: 1em;
  border: 1px solid var(--sakuero-border-soft);
  border-radius: var(--sakuero-radius);
  background: #fff;
}

.comment-reply-link {
  border: 1px solid var(--sakuero-border);
  border-radius: 6px;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
  text-decoration: none;
}

/* =========================================================
 * Contact Form 7：お問い合わせ表
 * ========================================================= */

.sakuero-cf7-form {
  margin: 1.5em 0;
}

.sakuero-contact-table-wrap {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: #fff;
  box-shadow: var(--sakuero-shadow);
}

#main .sakuero-contact-table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: #fff;
}

#main .sakuero-contact-table th,
#main .sakuero-contact-table td {
  padding: 1em 1.05em;
  border: 0;
  border-bottom: 1px solid var(--sakuero-border-soft);
  vertical-align: top;
}

#main .sakuero-contact-table tr:last-child th,
#main .sakuero-contact-table tr:last-child td {
  border-bottom: 0;
}

#main .sakuero-contact-table th {
  width: 31%;
  color: var(--sakuero-text);
  background: var(--sakuero-pale);
  font-weight: 750;
  text-align: left;
}

#main .sakuero-contact-table th label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45em;
  margin: .15em 0 0;
  color: inherit;
}

#main .sakuero-contact-table td {
  background: #fff;
}

.sakuero-form-required,
.sakuero-form-optional {
  display: inline-flex;
  min-height: 1.7em;
  align-items: center;
  justify-content: center;
  padding: .08em .5em;
  border-radius: 999px;
  font-size: .72em;
  font-weight: 750;
  line-height: 1.25;
  white-space: nowrap;
}

.sakuero-form-required {
  color: #fff;
  background: var(--sakuero-deep);
}

.sakuero-form-optional {
  color: var(--sakuero-muted);
  border: 1px solid var(--sakuero-border);
  background: #fff;
}

.sakuero-field-note {
  display: block;
  margin-top: .45em;
  color: var(--sakuero-muted);
  font-size: .82em;
  line-height: 1.55;
}

#main .sakuero-cf7-form input[type="text"],
#main .sakuero-cf7-form input[type="email"],
#main .sakuero-cf7-form input[type="url"],
#main .sakuero-cf7-form input[type="tel"],
#main .sakuero-cf7-form select,
#main .sakuero-cf7-form textarea {
  width: 100%;
  margin: 0;
  padding: .78em .85em;
  border: 1px solid #d7c3ca;
  border-radius: 8px;
  color: var(--sakuero-text);
  background: #fff;
  font-size: 16px;
  line-height: 1.55;
  transition:
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition),
    background-color var(--sakuero-transition);
}

#main .sakuero-cf7-form textarea {
  min-height: 210px;
  resize: vertical;
}

#main .sakuero-cf7-form input::placeholder,
#main .sakuero-cf7-form textarea::placeholder {
  color: #9a9095;
  opacity: 1;
}

#main .sakuero-cf7-form input:hover,
#main .sakuero-cf7-form select:hover,
#main .sakuero-cf7-form textarea:hover {
  border-color: var(--sakuero-main);
}

#main .sakuero-cf7-form input:focus,
#main .sakuero-cf7-form select:focus,
#main .sakuero-cf7-form textarea:focus {
  border-color: var(--sakuero-main);
  outline: 0;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(229, 84, 116, .16);
}

.sakuero-contact-consent {
  margin: 1.2em 0 0;
  padding: 1em 1.1em;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  background: var(--sakuero-pale);
}

.sakuero-contact-consent .wpcf7-list-item {
  margin: 0;
}

.sakuero-contact-consent label {
  display: flex;
  align-items: flex-start;
  gap: .55em;
  cursor: pointer;
}

.sakuero-contact-consent input[type="checkbox"] {
  width: 1.15em;
  height: 1.15em;
  margin-top: .25em;
  accent-color: var(--sakuero-deep);
  flex: 0 0 auto;
}

.sakuero-contact-submit {
  margin-top: 1.35em;
  text-align: center;
}

#main .sakuero-contact-submit input[type="submit"] {
  min-width: min(100%, 280px);
  padding: .9em 2em;
  cursor: pointer;
}

.sakuero-contact-submit .wpcf7-spinner {
  display: block;
  margin: .75em auto 0;
}

.sakuero-cf7-form .wpcf7-not-valid {
  border-color: #c8334f !important;
  background: #fff8fa !important;
}

.sakuero-cf7-form .wpcf7-not-valid-tip {
  margin-top: .35em;
  color: #b4233f;
  font-size: .82em;
}

.sakuero-cf7-form .wpcf7-response-output {
  margin: 1.3em 0 0 !important;
  padding: .9em 1em !important;
  border-radius: var(--sakuero-radius-sm);
  line-height: 1.65;
}

.sakuero-cf7-form form.sent .wpcf7-response-output {
  border-color: var(--sakuero-success);
  color: #245d45;
  background: var(--sakuero-success-bg);
}

.sakuero-cf7-form form.invalid .wpcf7-response-output,
.sakuero-cf7-form form.unaccepted .wpcf7-response-output,
.sakuero-cf7-form form.payment-required .wpcf7-response-output {
  border-color: #d0912c;
  color: #624617;
  background: var(--sakuero-warning-bg);
}

.sakuero-cf7-form form.failed .wpcf7-response-output,
.sakuero-cf7-form form.aborted .wpcf7-response-output,
.sakuero-cf7-form form.spam .wpcf7-response-output {
  border-color: #c8334f;
  color: #842137;
  background: #fff0f4;
}

@media screen and (max-width: 600px) {
  .sakuero-contact-table-wrap {
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #main .sakuero-contact-table,
  #main .sakuero-contact-table tbody,
  #main .sakuero-contact-table tr,
  #main .sakuero-contact-table th,
  #main .sakuero-contact-table td {
    display: block;
    width: 100%;
  }

  #main .sakuero-contact-table tr {
    overflow: hidden;
    margin-bottom: 14px;
    border: 1px solid var(--sakuero-border);
    border-radius: var(--sakuero-radius);
    background: #fff;
    box-shadow: var(--sakuero-shadow-sm);
  }

  #main .sakuero-contact-table th,
  #main .sakuero-contact-table td {
    padding: .82em .9em;
    border: 0;
  }

  #main .sakuero-contact-table th {
    background: var(--sakuero-pale);
  }

  #main .sakuero-contact-table th label {
    margin: 0;
  }

  .sakuero-contact-consent {
    padding: .9em;
  }

  #main .sakuero-contact-submit input[type="submit"] {
    width: 100%;
  }
}


/* =========================================================
 * 14. ページネーション・前後記事
 * ========================================================= */

.page-numbers {
  border-color: var(--sakuero-border);
  border-radius: 8px;
  color: var(--sakuero-text);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.pagination .current {
  color: #fff;
  border-color: var(--sakuero-deep);
  background: var(--sakuero-deep);
}

.pagination a:hover,
.pager-links a:hover span {
  color: #fff;
  border-color: var(--sakuero-main);
  background: var(--sakuero-main);
  transform: translateY(-2px);
}

.pagination-next-link,
.comment-btn {
  border: 1px solid var(--sakuero-deep);
  border-radius: 9px;
  color: var(--sakuero-deep);
  background: #fff;
  font-weight: 700;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.pagination-next-link:hover,
.comment-btn:hover {
  color: #fff;
  background: var(--sakuero-deep);
  transform: translateY(-2px);
}

.pager-post-navi {
  gap: 10px;
}

.pager-post-navi a {
  overflow: hidden;
  border: 1px solid var(--sakuero-border);
  border-radius: var(--sakuero-radius);
  color: var(--sakuero-text);
  background: #fff;
  box-shadow: var(--sakuero-shadow-sm);
  text-decoration: none;
  transition:
    color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    transform var(--sakuero-transition),
    box-shadow var(--sakuero-transition);
}

.pager-post-navi a:hover {
  color: var(--sakuero-deep);
  border-color: var(--sakuero-main);
  background: var(--sakuero-pale);
  transform: translateY(-2px);
  box-shadow: var(--sakuero-shadow);
}

/* =========================================================
 * 15. モバイルメニュー・ドロワー
 * ========================================================= */

.mobile-menu-buttons {
  border-top: 1px solid var(--sakuero-border);
  color: var(--sakuero-text);
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 -4px 16px rgba(75, 37, 48, .10);
}

.mobile-menu-buttons .menu-button {
  transition: background-color var(--sakuero-transition);
}

.mobile-menu-buttons .menu-button:hover,
.mobile-menu-buttons .menu-button:focus-within {
  background: var(--sakuero-pale);
}

.mobile-menu-buttons .menu-button > a,
.mobile-menu-buttons .menu-button-in {
  color: var(--sakuero-text);
}

.mobile-menu-buttons .menu-icon {
  color: var(--sakuero-deep);
}

.menu-content {
  background: #fff;
  box-shadow: var(--sakuero-shadow-hover);
}

.menu-content .menu-drawer {
  padding: 12px 1em 36px;
}

.menu-drawer a {
  padding: .72em .75em;
  border-bottom: 1px solid var(--sakuero-border-soft);
  border-radius: 6px;
  color: var(--sakuero-text);
  font-weight: 600;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    padding-left var(--sakuero-transition);
}

.menu-drawer a:hover,
.menu-drawer a:focus-visible {
  padding-left: 1em;
  color: var(--sakuero-deep);
  background: var(--sakuero-pale);
}

.menu-close-button {
  color: var(--sakuero-deep);
}

/* =========================================================
 * 16. フッター
 * ========================================================= */

.footer,
#footer {
  margin-top: 36px;
  padding-top: 28px;
  color: #f9f4f6;
  background:
    linear-gradient(145deg, var(--sakuero-footer-light) 0%, var(--sakuero-footer) 60%, #291f23 100%);
  box-shadow: 0 -5px 22px rgba(53, 42, 47, .13);
}

.footer-widgets,
.footer-widgets-mobile {
  gap: 18px;
  margin-top: 0;
  margin-bottom: 22px;
}

.footer-left,
.footer-center,
.footer-right,
.footer-mobile {
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--sakuero-radius);
  background: rgba(255, 255, 255, .045);
}

.footer .widget,
#footer .widget {
  color: #f4edf0;
}

.footer h2,
.footer h3,
.footer .widget-title,
.footer .main-widget-label,
#footer h2,
#footer h3,
#footer .widget-title {
  margin: 0 0 14px;
  padding: 0 0 .55em;
  border: 0;
  border-bottom: 2px solid var(--sakuero-main);
  color: #fff;
  background: transparent;
  font-size: 1.04em;
  font-weight: 750;
  letter-spacing: .025em;
}

.footer p,
.footer li,
.footer .copyright,
#footer p,
#footer li,
#footer .copyright {
  color: #eee5e9;
}

.footer a,
#footer a {
  color: #fff;
  text-decoration-color: rgba(255, 255, 255, .38);
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    text-decoration-color var(--sakuero-transition);
}

.footer a:hover,
#footer a:hover {
  color: #ffe1e8;
  text-decoration-color: currentColor;
}

.footer :is(.widget_nav_menu, .widget_pages, .widget_categories) ul {
  padding: 0;
  list-style: none;
}

.footer :is(.widget_nav_menu, .widget_pages, .widget_categories) li {
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.footer :is(.widget_nav_menu, .widget_pages, .widget_categories) li:last-child {
  border-bottom: 0;
}

.footer :is(.widget_nav_menu, .widget_pages, .widget_categories) li a {
  display: block;
  padding: .62em .4em;
  border-radius: 5px;
  text-decoration: none;
}

.footer :is(.widget_nav_menu, .widget_pages, .widget_categories) li a:hover {
  padding-left: .7em;
  background: rgba(255, 255, 255, .08);
}

.footer-bottom {
  margin-top: 20px;
  padding: 18px 8px 12px;
  border-top: 1px solid rgba(255, 255, 255, .18);
}

.footer-bottom-content {
  color: #e8dde1;
}

.navi-footer-in > .menu-footer {
  gap: 6px;
  justify-content: center;
}

.navi-footer-in > .menu-footer li,
.navi-footer-in > .menu-footer li:last-child {
  width: auto;
  border: 0;
}

.navi-footer-in a {
  display: block;
  padding: .48em .7em;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #fff;
  text-decoration: none;
  font-size: .94em;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition);
}

.navi-footer-in a:hover,
.navi-footer-in .current-menu-item a {
  color: #fff;
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .10);
}

.footer-bottom-logo .site-name-text,
.footer-bottom-logo .logo-text {
  color: #fff;
}

.copyright {
  color: #ded0d6;
  font-size: .88em;
}

/* =========================================================
 * Cocoon設定：PR表記
 * 「メインカラム左上（小）」と「本文の上（大）」に対応
 * ========================================================= */

/* PR表記（小）：メインカラム左上 */
#main .pr-label-s,
.main .pr-label-s {
  z-index: 5;
  top: 10px;
  left: 18px;
  display: inline-flex;
  width: auto;
  min-width: 46px;
  min-height: 27px;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: .28em .72em;
  border: 1px solid var(--sakuero-deep);
  border-radius: 999px;
  color: #fff;
  background: var(--sakuero-deep);
  box-shadow: 0 4px 12px rgba(75, 37, 48, .18);
  font-size: .75rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .045em;
  text-align: center;
}

/* 既存スキン等のリボン装飾を無効化 */
#main .pr-label-s::before,
#main .pr-label-s::after,
.main .pr-label-s::before,
.main .pr-label-s::after {
  content: none;
  display: none;
}

/* PR表記（大）：本文上 */
#main .pr-label-l,
.main .pr-label-l {
  position: relative;
  margin: 0 0 1.55em;
  padding: .95em 1.1em .95em 4.55em;
  border: 1px solid var(--sakuero-border);
  border-left: 5px solid var(--sakuero-main);
  border-radius: 9px;
  color: #4d4146;
  background: linear-gradient(135deg, #fff 0%, var(--sakuero-pale) 100%);
  box-shadow: var(--sakuero-shadow-sm);
  font-size: .9em;
  font-weight: 500;
  line-height: 1.7;
  text-align: left;
}

/* 大きいPR表記の視認用バッジ */
#main .pr-label-l::before,
.main .pr-label-l::before {
  content: "PR";
  position: absolute;
  top: 50%;
  left: 1.05em;
  display: inline-flex;
  min-width: 39px;
  min-height: 25px;
  align-items: center;
  justify-content: center;
  padding: .18em .55em;
  border-radius: 999px;
  color: #fff;
  background: var(--sakuero-deep);
  box-shadow: 0 3px 9px rgba(75, 37, 48, .14);
  font-size: .78em;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .045em;
  transform: translateY(-50%);
}

/* Cocoonやスキン由来の不要な疑似要素を抑制 */
#main .pr-label-l::after,
.main .pr-label-l::after {
  content: none;
  display: none;
}

/* PR表記内にリンクを入力した場合 */
#main .pr-label-l a,
.main .pr-label-l a {
  color: var(--sakuero-deep);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: rgba(189, 63, 91, .4);
  text-underline-offset: .2em;
  transition:
    color var(--sakuero-transition),
    text-decoration-color var(--sakuero-transition);
}

#main .pr-label-l a:hover,
.main .pr-label-l a:hover {
  color: var(--sakuero-hover);
  text-decoration-color: currentColor;
}

/* キーボード操作 */
#main .pr-label-l a:focus-visible,
.main .pr-label-l a:focus-visible {
  border-radius: 3px;
  outline: 3px solid rgba(229, 84, 116, .34);
  outline-offset: 3px;
}

/* スマートフォン */
@media screen and (max-width: 480px) {
  #main .pr-label-s,
  .main .pr-label-s {
    top: 8px;
    left: 12px;
    min-width: 42px;
    min-height: 25px;
    padding: .25em .62em;
    font-size: .7rem;
  }

  #main .pr-label-l,
  .main .pr-label-l {
    margin-bottom: 1.3em;
    padding: .88em .9em .88em 3.95em;
    border-left-width: 4px;
    font-size: .86em;
    line-height: 1.65;
  }

  #main .pr-label-l::before,
  .main .pr-label-l::before {
    left: .8em;
    min-width: 36px;
    min-height: 23px;
    padding: .16em .45em;
    font-size: .74em;
  }
}


/* =========================================================
 * 17. トップへ戻る
 * ========================================================= */

.go-to-top-button {
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 50%;
  color: #fff;
  background: var(--sakuero-deep);
  box-shadow: 0 5px 18px rgba(75, 37, 48, .22);
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    transform var(--sakuero-transition);
}

.go-to-top-button:hover {
  color: #fff;
  background: var(--sakuero-hover);
  transform: translateY(-3px);
}

/* =========================================================
 * 記事本文下部のカテゴリー・タグ表示
 * 記事一覧カード上のカテゴリラベルには影響させない
 * ========================================================= */

#main .entry-categories-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 1.6em;
}

#main .entry-categories-tags .entry-categories,
#main .entry-categories-tags .entry-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin: 0;
}

#main .entry-categories-tags .cat-link,
#main .entry-categories-tags .tag-link {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: .35em;
  margin: 0;
  padding: .42em .76em;
  border: 1px solid var(--sakuero-border) !important;
  border-radius: 999px;
  color: var(--sakuero-deep) !important;
  background: var(--sakuero-pale) !important;
  box-shadow: none;
  font-size: .88em;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none !important;
  transition:
    color var(--sakuero-transition),
    background-color var(--sakuero-transition),
    border-color var(--sakuero-transition),
    box-shadow var(--sakuero-transition),
    transform var(--sakuero-transition);
}

#main .entry-categories-tags .cat-link:hover,
#main .entry-categories-tags .tag-link:hover,
#main .entry-categories-tags .cat-link:focus-visible,
#main .entry-categories-tags .tag-link:focus-visible {
  border-color: var(--sakuero-deep) !important;
  color: #fff !important;
  background: var(--sakuero-deep) !important;
  box-shadow: 0 5px 14px rgba(189, 63, 91, .18);
  transform: translateY(-2px);
}

#main .entry-categories-tags .cat-link :is(i, svg),
#main .entry-categories-tags .tag-link :is(i, svg) {
  color: inherit !important;
  fill: currentColor;
}

@media screen and (max-width: 480px) {
  #main .entry-categories-tags {
    gap: 6px;
    margin-top: 1.35em;
  }

  #main .entry-categories-tags .entry-categories,
  #main .entry-categories-tags .entry-tags {
    gap: 6px;
  }

  #main .entry-categories-tags .cat-link,
  #main .entry-categories-tags .tag-link {
    min-height: 32px;
    padding: .4em .68em;
    font-size: .84em;
  }
}


/* =========================================================
 * 18. アクセシビリティ・動き
 * ========================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(229, 84, 116, .42);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* =========================================================
 * 19. タブレット・スマートフォン
 * ========================================================= */

@media screen and (max-width: 1023px) {
  .content {
    margin-top: 16px;
  }

  .main {
    border-radius: var(--sakuero-radius);
  }
}

@media screen and (max-width: 834px) {
  .sakuero-card-grid,
  .sakuero-link-grid {
    grid-template-columns: 1fr;
  }

  .sakuero-policy-index ul {
    columns: 1;
  }

  .footer-widgets {
    gap: 12px;
  }

  .footer-left,
  .footer-center,
  .footer-right {
    padding: 14px;
  }
}

@media screen and (max-width: 480px) {
  body,
  .body {
    background: #fff;
  }

  .content {
    margin-top: 8px;
  }

  .main {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #main .entry-title,
  #main .article h1,
  #main .entry-content h1 {
    padding-bottom: .42em;
    font-size: 1.55rem;
    line-height: 1.43;
  }

  #main .article h2,
  #main .entry-content h2 {
    padding: .66em .72em;
    border-radius: 6px;
    font-size: 1.26rem;
  }

  #main .article h3,
  #main .entry-content h3 {
    padding-left: .65em;
    border-left-width: 4px;
    font-size: 1.13rem;
  }

  #main .article h4,
  #main .entry-content h4 {
    padding: .48em .62em;
    font-size: 1.05rem;
  }

  #main .article h5,
  #main .entry-content h5 {
    font-size: 1rem;
  }

  #main .article h6,
  #main .entry-content h6 {
    font-size: .94rem;
  }

  .sakuero-page-lead,
  .sakuero-info-box,
  .sakuero-note-box,
  .sakuero-warning-box,
  .sakuero-ad-box,
  .sakuero-card,
  .sakuero-link-card,
  .sakuero-contact-form,
  .wpcf7 {
    padding: 1em;
  }

  .sakuero-profile-table th,
  .sakuero-profile-table td {
    display: block;
    width: 100%;
    white-space: normal;
  }

  .toc {
    padding: 1em;
  }

  .blogcard-thumbnail {
    width: 100px;
  }

  .blogcard-content {
    min-height: 70px;
    margin-left: 110px;
  }

  .blogcard-snippet {
    display: none;
  }

  .page-numbers {
    width: 39px;
    height: 39px;
    margin: 0 2px;
    line-height: 37px;
  }

  .footer,
  #footer {
    margin-top: 24px;
    padding-top: 20px;
  }

  .footer-bottom {
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
  }

  .navi-footer-in > .menu-footer {
    gap: 3px;
  }

  .navi-footer-in a {
    padding: .55em .62em;
    font-size: .88em;
  }
}