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

:root {
  --hb-ivory: #f7f1ec;
  --hb-paper: #fffdfb;
  --hb-rose: #c9899a;
  --hb-rose-deep: #9a5368;
  --hb-ink: #7a4456;
  --hb-muted: #8d6a74;
  --hb-line: #f0e0e6;
  --hb-shadow: 0 12px 32px rgba(140, 80, 100, 0.08);
}

body {
  background: var(--hb-ivory);
  color: #5d424b;
  font-family: "Zen Kaku Gothic New", "Hiragino Sans", sans-serif;
}

.header-container,
#header,
#navi,
#content,
#footer {
  background: transparent;
}

.wrap {
  max-width: 1100px;
}

#header-in {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px;
  min-height: 0;
  height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
}

#header-in::before,
#header-in::after {
  content: none !important;
  display: none !important;
}

.logo-header {
  margin: 0 !important;
  padding: 0 !important;
  float: none;
}

.logo-header a {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.hb-mark {
  display: block;
  width: auto;
  height: 88px;
  max-width: min(520px, 46vw);
  object-fit: contain;
}

.logo-header .site-name-text,
.hb-brand,
.hb-roman,
.hb-book {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.hb-brand {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.site-name-text {
  font-family: "Shippori Mincho", serif;
  font-size: 34px;
  font-weight: 600;
  color: var(--hb-ink);
}

.hb-roman {
  margin-top: 5px;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: #c4a0ab;
}

.hb-book {
  width: 36px;
  height: 28px;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath fill='none' stroke='%23c9899a' stroke-width='3' d='M8 10c8 0 14 3 24 3s16-3 24-3v28c-8 0-14 3-24 3S16 38 8 38z'/%3E%3Cpath fill='none' stroke='%23c9899a' stroke-width='3' d='M32 13v28'/%3E%3C/svg%3E");
}

#header .tagline {
  order: 2;
  width: auto;
  max-width: 340px;
  flex: 0 0 auto;
  margin: 0 !important;
  text-align: left;
  font-size: 13px;
  line-height: 1.7;
  color: var(--hb-muted);
}

.hb-search {
  order: 3;
  margin-left: auto;
}

.hb-search input {
  width: 230px;
  height: 42px;
  padding: 0 18px 0 40px;
  border: 1px solid #ead8df;
  border-radius: 999px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='10' r='6' fill='none' stroke='%23c9899a' stroke-width='2'/%3E%3Cpath d='M15 15l5 5' stroke='%23c9899a' stroke-width='2'/%3E%3C/svg%3E") 14px 50% / 16px no-repeat;
  color: var(--hb-ink);
  font-size: 13px;
}

#navi {
  background: var(--hb-rose-deep);
  border-radius: 0;
}

#navi-in {
  min-height: 54px;
}

#navi .navi-in > .menu-header,
#navi .menu-header {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start !important;
  gap: 6px;
  margin: 0;
  width: 100%;
}

#navi .menu-header > li {
  width: auto !important;
  flex: 0 0 auto !important;
  float: none !important;
}

#navi .menu-header > li > a {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 54px;
  padding: 0 16px;
  color: #fff;
  font-size: 14px;
}

#navi .navi-in a:hover,
#navi .navi-in a:focus,
#navi .menu-header > li > a:hover,
#navi .menu-header > li > a:focus {
  background-color: #c9899a !important;
  color: #fff !important;
}

#navi .menu-header > li > a::before {
  content: "";
  width: 16px;
  height: 16px;
  background: center / contain no-repeat;
}

#navi .menu-header > li:nth-child(1) > a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='1.8' d='M4 11l8-7 8 7v8a1 1 0 0 1-1 1h-5v-6H10v6H5a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
#navi .menu-header > li:nth-child(2) > a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='1.8' d='M4 16l4-8 4 5 3-6 5 9z'/%3E%3C/svg%3E"); }
#navi .menu-header > li:nth-child(3) > a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='1.8' d='M6 4h9a3 3 0 0 1 3 3v13l-5-3-5 3V7a3 3 0 0 0-3-3z'/%3E%3C/svg%3E"); }
#navi .menu-header > li:nth-child(4) > a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='1.8' d='M5 19l4-1 9-9-3-3-9 9z'/%3E%3C/svg%3E"); }
#navi .menu-header > li:nth-child(5) > a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='1.8' d='M12 19s-7-4.4-7-9a4 4 0 0 1 7-2 4 4 0 0 1 7 2c0 4.6-7 9-7 9z'/%3E%3C/svg%3E"); }

#navi .sub-menu {
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--hb-shadow);
  min-width: 220px;
}

#navi .sub-menu a {
  color: var(--hb-ink);
}

#navi .sub-menu a::before { display: none; }

#content {
  padding-bottom: 48px;
}

.home #main {
  width: 100% !important;
  float: none !important;
}

.home #content,
.home #sidebar,
.home #list,
.home .pagination,
.home .posts-not-found {
  display: none !important;
}

.hb-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 22px 26px;
  align-items: start;
  width: min(1100px, calc(100% - 32px));
  margin: 18px auto 36px;
}

.hb-hero,
.hb-rank,
.hb-news { grid-column: 1; }
.hb-side { grid-column: 2; grid-row: 1 / span 3; }

.hb-hero,
.hb-card,
.hb-panel,
.hb-news-card {
  background: var(--hb-paper);
  border-radius: 26px;
  box-shadow: var(--hb-shadow);
}

.hb-hero {
  display: block;
  overflow: hidden;
}

.hb-hero-copy {
  padding: 48px 36px 36px;
}

.hb-hero h2,
.hb-section-title,
.hb-panel h2 {
  margin: 0;
  color: var(--hb-ink);
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
}

.hb-hero h2 {
  font-size: 40px;
  line-height: 1.35;
}

.hb-hero p {
  margin: 18px 0 28px;
  color: var(--hb-muted);
  font-size: 15px;
  line-height: 1.9;
}

.hb-actions { display: flex; flex-wrap: wrap; gap: 12px; padding: 16px 22px 20px; }

.hb-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 20px;
  border-radius: 999px;
  font-size: 14px;
  text-decoration: none;
}

.hb-btn-fill { background: #d9a3b2; color: #fff; }
.hb-btn-line { background: #fff; color: #b57b8c; border: 1px solid #efd5dc; }
.hb-btn-soft { background: #f8eef1; color: var(--hb-ink); }

.hb-btn-soft::after {
  content: "";
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  background: center / 14px 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23c9899a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
}

.hb-thumb img,
.hb-news-card img,
.hb-review img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hb-hero-visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.hb-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-size: 26px;
}

.hb-rank-list,
.hb-news-list {
  display: grid;
  gap: 16px;
}

.hb-rank-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hb-card { overflow: hidden; }

.hb-thumb {
  position: relative;
  height: 168px;
}

.hb-num {
  position: absolute;
  top: 12px;
  left: 12px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: var(--hb-rose-deep);
  font-family: "Shippori Mincho", serif;
  font-weight: 700;
}

.hb-card-body,
.hb-news-body { padding: 14px 16px 18px; }

.hb-card h3,
.hb-news-card h3 {
  margin: 0 0 8px;
  color: var(--hb-ink);
  font-size: 16px;
  line-height: 1.55;
}

.hb-card h3 a,
.hb-news-card h3 a,
.hb-more { color: inherit; text-decoration: none; }

.hb-card p,
.hb-news-card p,
.hb-panel p { margin: 0; color: var(--hb-muted); font-size: 13px; line-height: 1.7; }

.hb-side { display: grid; gap: 16px; }

.hb-panel { padding: 20px 18px; }

.hb-panel h2 { font-size: 20px; }

.hb-genres { display: grid; gap: 8px; margin-top: 14px; }

.hb-genres a,
.hb-tags a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  border-radius: 12px;
  background: #fbf7f8;
  color: var(--hb-ink);
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
}

.hb-genres a {
  min-height: 46px;
  padding: 0 16px;
}

.hb-genres a::after {
  content: "";
  width: 14px;
  height: 14px;
  margin-left: 10px;
  flex: 0 0 auto;
  background: center / 14px 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23c9899a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
}

.hb-review { margin-top: 12px; overflow: hidden; border-radius: 16px; }
.hb-review img { height: 120px; }
.hb-review-copy { padding: 12px 4px 0; }
.hb-review .hb-btn { margin-top: 12px; }

.hb-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.hb-tags a { padding: 6px 12px; border-radius: 999px; font-size: 14px; }

.hb-news-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.hb-more { color: var(--hb-rose-deep); font-size: 13px; }

.hb-news-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hb-news-card { overflow: hidden; }

.hb-news-card img { height: 150px; }

.hb-new {
  display: inline-block;
  margin-bottom: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f8e7ec;
  color: var(--hb-rose-deep);
  font-size: 11px;
  letter-spacing: 0.08em;
}

.hb-date { display: block; margin-top: 10px; color: #b7a0a7; font-size: 12px; }

.hb-page {
  max-width: 760px;
  margin: 10px auto 40px;
  padding: 36px 32px;
  background: var(--hb-paper);
  border-radius: 24px;
  box-shadow: var(--hb-shadow);
}

.hb-page h1,
.archive-title,
.entry-title {
  font-family: "Shippori Mincho", serif;
  color: var(--hb-ink);
}

#footer {
  background: #f3e8e4;
  color: var(--hb-muted);
}

.page #main .entry-content,
.archive #main,
.single #main {
  background: var(--hb-paper);
  border-radius: 24px;
  padding: 28px 26px;
  box-shadow: var(--hb-shadow);
}

.page #main .entry-content h2,
.archive-title,
.entry-title {
  font-family: "Shippori Mincho", serif;
  color: var(--hb-ink);
}

@media screen and (max-width: 1023px) {
  .hb-home,
  .hb-rank-list,
  .hb-news-list,
  .hb-hero { grid-template-columns: 1fr; }
  .hb-side { grid-column: 1; grid-row: auto; }
  .hb-hero-visual img { aspect-ratio: 16 / 9; }
}

@media screen and (max-width: 834px) {
  #header-in { flex-wrap: wrap; gap: 8px 12px; }
  #header .tagline,
  .hb-search,
  .hb-roman,
  .hb-book { display: none; }
  .site-name-text { font-size: 26px; }
  .hb-mark { width: auto; height: 48px; max-width: 68vw; }
  .hb-hero-copy { padding: 28px 22px; }
  .hb-actions { display: grid; }
  .hb-genres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hb-genres a { min-height: 46px; }
  #navi .menu-header > li > a { min-height: 42px; padding: 0 12px; font-size: 13px; }
}

.hb-news-empty {
  margin: 0;
  padding: 22px 24px;
  background: var(--hb-paper);
  border-radius: 20px;
  box-shadow: var(--hb-shadow);
  color: var(--hb-muted);
  font-size: 14px;
}

/* ===== 記事：作品紹介カード（楽天リンクのa・imgには一切スタイルを当てない） ===== */
.entry-content .hb-pr {
  display: inline-block;
  margin: 0 0 20px;
  padding: 6px 14px;
  border-radius: 999px;
  background: #f8eef1;
  color: var(--hb-rose-deep);
  font-size: 13px;
  line-height: 1.6;
}

.entry-content .hb-work-head {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin: 0 0 18px;
}

.entry-content .hb-cover {
  flex: 0 0 auto;
}

.entry-content .hb-info {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 14px;
  flex: 1 1 auto;
  margin: 0;
  padding: 16px 18px;
  border-radius: 16px;
  background: #fbf7f8;
  font-size: 14px;
  line-height: 1.6;
}

.entry-content .hb-info dt {
  margin: 0;
  color: var(--hb-muted);
  font-weight: 500;
  white-space: nowrap;
}

.entry-content .hb-info dd {
  margin: 0;
  color: #5d424b;
}

.entry-content .hb-buy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 6px 0 36px;
  padding: 14px 18px;
  border: 1px solid #efd5dc;
  border-radius: 16px;
  background: var(--hb-paper);
}

.entry-content .hb-buy-label {
  flex: 0 0 auto;
  padding: 3px 12px;
  border-radius: 999px;
  background: #d9a3b2;
  color: #fff;
  font-size: 12px;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 600px) {
  .entry-content .hb-work-head {
    flex-direction: column;
    align-items: center;
  }
  .entry-content .hb-info {
    width: 100%;
    box-sizing: border-box;
  }
}

/* ===== ランキングカードの画像（aタグをブロックにして高さを効かせる） ===== */
.hb-thumb {
  display: block;
  overflow: hidden;
}

/* ===== スマホ・タブレットのメニュー（1023px以下） ===== */
@media screen and (max-width: 1023px) {
  /* PC用メニューは隠す（Cocoonのスマホ用メニューだけを使う） */
  #navi .navi-in > .menu-header.menu-pc,
  #navi .menu-header.menu-pc {
    display: none !important;
  }

  #navi-in {
    min-height: 0;
  }

  /* スマホ用メニュー：1行で横にスクロール */
  #navi .navi-in > .menu-mobile,
  #navi .menu-mobile {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center;
    gap: 4px;
    width: 100%;
    margin: 0;
    padding: 8px 12px;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  #navi .menu-mobile::-webkit-scrollbar {
    display: none;
  }

  #navi .menu-mobile > li {
    flex: 0 0 auto !important;
    width: auto !important;
    float: none !important;
    height: auto;
  }

  #navi .menu-mobile > li > a {
    display: block;
    height: auto;
    padding: 7px 14px;
    border-radius: 999px;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    white-space: nowrap;
  }

  #navi .menu-mobile > li > a:hover,
  #navi .menu-mobile > li > a:focus {
    background-color: #c9899a !important;
  }

  #navi .menu-mobile .caption-wrap,
  #navi .menu-mobile .item-label {
    display: block;
    height: auto;
    line-height: 1.4;
  }

  /* サブメニュー（ジャンル）はスマホでは出さない。トップのジャンル一覧へ移動する */
  #navi .menu-mobile .sub-menu {
    display: none !important;
  }

  .hb-thumb {
    height: auto;
    aspect-ratio: 16 / 10;
  }
}

@media screen and (max-width: 1023px) {
  /* サブメニューを出さないので、下向き矢印も隠す */
  #navi .menu-mobile .top-has-sub {
    display: none !important;
  }
}

@media screen and (max-width: 1023px) {
  /* スマホメニュー（4項目）を等間隔に並べる。横スクロールなし */
  #navi .navi-in > .menu-mobile,
  #navi .menu-mobile {
    gap: 0;
    padding: 6px 6px;
    overflow-x: visible;
  }
  #navi .menu-mobile > li {
    flex: 1 1 0 !important;
    min-width: 0;
  }
  #navi .menu-mobile > li > a {
    padding: 8px 2px;
    text-align: center;
    font-size: 13px;
  }
}

/* ===== シェア・フォローボタン（ブランド色をやめてサイトの色にそろえる） ===== */
.sns-share-message,
.sns-follow-message {
  color: var(--hb-ink);
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.sns-share .sns-share-buttons,
.sns-follow .sns-follow-buttons {
  gap: 8px;
}

.sns-share.bc-brand-color .sns-buttons a.share-button,
.sns-follow.bc-brand-color .sns-buttons a.follow-button,
.sns-share .sns-buttons a.share-button,
.sns-follow .sns-buttons a.follow-button {
  background-color: #f8eef1 !important;
  border: 1px solid #efd5dc !important;
  border-radius: 14px !important;
  color: var(--hb-rose-deep) !important;
  box-shadow: none !important;
  transition: background-color .2s ease, color .2s ease;
}

.sns-share .sns-buttons a.share-button .social-icon,
.sns-share .sns-buttons a.share-button .button-caption,
.sns-follow .sns-buttons a.follow-button span {
  color: var(--hb-rose-deep) !important;
}

.sns-share .sns-buttons a.share-button:hover,
.sns-share .sns-buttons a.share-button:focus,
.sns-follow .sns-buttons a.follow-button:hover,
.sns-follow .sns-buttons a.follow-button:focus {
  background-color: #c9899a !important;
  border-color: #c9899a !important;
  opacity: 1 !important;
}

.sns-share .sns-buttons a.share-button:hover .social-icon,
.sns-share .sns-buttons a.share-button:hover .button-caption,
.sns-share .sns-buttons a.share-button:focus .social-icon,
.sns-share .sns-buttons a.share-button:focus .button-caption,
.sns-follow .sns-buttons a.follow-button:hover span,
.sns-follow .sns-buttons a.follow-button:focus span {
  color: #fff !important;
}

.sns-share .sns-buttons a.share-button .button-caption {
  font-size: 11px;
  letter-spacing: 0.04em;
}

/* 「Twitter」の表記を現在の名称「X」にする */
.sns-share .sns-buttons a.twitter-button .button-caption {
  font-size: 0 !important;
}
.sns-share .sns-buttons a.twitter-button .button-caption::after {
  content: "X";
  font-size: 11px;
}

/* 古い鳥のアイコンを、現在のXのロゴに差し替える（色は周りの文字色に合わせる） */
.sns-share .sns-buttons a.twitter-button .social-icon.icon-twitter::before {
  content: "" !important;
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.1em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 記事下のカテゴリー・タグのラベル */
.entry-categories-tags .cat-link,
.entry-categories-tags .tag-link {
  border-radius: 999px !important;
  padding: 3px 12px !important;
  font-size: 12px;
}
.entry-categories-tags .cat-link {
  background-color: #d9a3b2 !important;
  border: 1px solid #d9a3b2 !important;
  color: #fff !important;
}
.entry-categories-tags .tag-link {
  background-color: #fff !important;
  border: 1px solid #efd5dc !important;
  color: var(--hb-rose-deep) !important;
}
.entry-categories-tags .cat-link:hover,
.entry-categories-tags .tag-link:hover {
  background-color: #c9899a !important;
  border-color: #c9899a !important;
  color: #fff !important;
}

/* シェアボタンを1列6個で均等に並べる（折り返しなし） */
.sns-share .sns-share-buttons.sns-buttons {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
}
.sns-share .sns-share-buttons.sns-buttons a.share-button {
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
}
@media screen and (max-width: 600px) {
  .sns-share .sns-share-buttons.sns-buttons {
    gap: 6px;
  }
  .sns-share .sns-share-buttons.sns-buttons a.share-button {
    height: 44px !important;
    padding: 0 !important;
  }
  .sns-share .sns-share-buttons.sns-buttons a.share-button .button-caption,
  .sns-share .sns-share-buttons.sns-buttons a.twitter-button .button-caption::after {
    display: none !important;
  }
  .sns-share .sns-share-buttons.sns-buttons a.share-button .social-icon {
    font-size: 18px;
  }
}

/* ===== ロゴ（案B）の大きさ ===== */
.hb-mark {
  height: 100px;
  max-width: min(560px, 46vw);
}
@media screen and (max-width: 834px) {
  .hb-mark {
    height: 52px;
    max-width: 72vw;
  }
}

/* ===== 関連記事：ページの最後へ移動し、アイキャッチ画像は出さない ===== */
.single .under-entry-content {
  display: flex;
  flex-direction: column;
}
.single .under-entry-content > * {
  order: 0;
}
.single .under-entry-content > #related-entries {
  order: 90;
}
.single .under-entry-content > #breadcrumb,
.single .under-entry-content > .breadcrumb {
  order: 100;
}
.related-entry-card-thumb,
.related-entries .card-thumb {
  display: none !important;
}
.related-entry-card-content,
.related-entries .card-content {
  margin-left: 0 !important;
}
/* 関連記事が1件もないときは、見出しごと出さない */
.related-entries:not(:has(.related-entry-card-wrap, .related-entry-card, a.a-wrap)) {
  display: none;
}

/* ===== ヘッダーのキャッチフレーズは、ロゴのサブタイトルと重なるので表示しない ===== */
#header .tagline,
.header .tagline {
  display: none !important;
}

/* ===== ランキング記事：順位バッジ（表紙画像の上には重ねない） ===== */
.entry-content .hb-cover-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.entry-content .hb-rank-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  padding: 4px 14px;
  border-radius: 999px;
  background: var(--hb-rose-deep);
  color: #fff;
  font-family: "Shippori Mincho", serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* =========================================================
   トップページ（2026-11 作り直し）  .hbt-*
   楽天の表紙（.hbt-top3-cover の中の a・img）には何も指定しない
   ========================================================= */
.hbt {
  width: min(1100px, calc(100% - 32px));
  margin: 20px auto 48px;
  color: #5d424b;
}
.hbt a { text-decoration: none; }

/* ヒーロー */
.hbt-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  align-items: center;
  gap: 24px;
  padding: 44px 48px;
  border-radius: 28px;
  background: linear-gradient(135deg, #fffaf7 0%, #f8e8ed 55%, #ece3f3 100%);
  box-shadow: var(--hb-shadow);
  overflow: hidden;
}
.hbt-eyebrow {
  display: inline-block;
  margin: 0 0 14px;
  padding: 4px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.7);
  color: var(--hb-rose-deep);
  font-size: 13px;
  letter-spacing: 0.06em;
}
.hbt-hero-title {
  margin: 0 0 16px;
  color: var(--hb-ink);
  font-family: "Shippori Mincho", serif;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.04em;
}
.hbt-hero-lead {
  margin: 0 0 22px;
  color: var(--hb-muted);
  font-size: 15px;
  line-height: 1.9;
}
.hbt-search {
  display: flex;
  max-width: 460px;
  margin: 0 0 18px;
  border: 1px solid #ead8df;
  border-radius: 999px;
  background: #fff;
  overflow: hidden;
}
.hbt-search input {
  flex: 1 1 auto;
  min-width: 0;
  height: 48px;
  padding: 0 20px;
  border: 0;
  background: transparent;
  color: var(--hb-ink);
  font-size: 15px;
}
.hbt-search input:focus { outline: none; }
.hbt-search:focus-within { border-color: #c9899a; box-shadow: 0 0 0 3px rgba(201, 137, 154, 0.18); }
.hbt-search button {
  flex: 0 0 auto;
  padding: 0 22px;
  border: 0;
  background: var(--hb-rose-deep);
  color: #fff;
  font-size: 14px;
  cursor: pointer;
}
.hbt-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hbt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.hbt-btn:hover { transform: translateY(-1px); }
.hbt-btn-fill { background: var(--hb-rose-deep); color: #fff !important; }
.hbt-btn-fill:hover { background: #b46a80; }
.hbt-btn-line { border: 1px solid #e3c3cd; background: #fff; color: var(--hb-rose-deep) !important; }
.hbt-btn-line:hover { background: #fbf1f4; }
.hbt-hero-art { text-align: center; }
.hbt-hero-art img { display: inline-block; width: 100%; max-width: 300px; height: auto; }

.hbt-pr { margin: 14px 4px 0; color: var(--hb-muted); font-size: 12px; }

/* セクション共通 */
.hbt-section { margin-top: 48px; }
.hbt-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}
.hbt-title {
  margin: 0;
  color: var(--hb-ink);
  font-family: "Shippori Mincho", serif;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 600;
  line-height: 1.4;
}
.hbt-title-en {
  display: block;
  margin-bottom: 2px;
  color: #d29aab;
  font-family: "Shippori Mincho", serif;
  font-size: 13px;
  font-style: italic;
  letter-spacing: 0.14em;
}
.hbt-more { flex: 0 0 auto; color: var(--hb-rose-deep) !important; font-size: 14px; font-weight: 600; white-space: nowrap; }
.hbt-more::after { content: " \2192"; }
.hbt-more:hover { text-decoration: underline; }
.hbt-section-lead { margin: -8px 0 18px; color: var(--hb-muted); font-size: 14px; }
.hbt-meta { margin: 0; color: var(--hb-muted); font-size: 13px; }
.hbt-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.hbt-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  background: #f4ecf0;
  color: var(--hb-ink);
  font-size: 12px;
  line-height: 1.6;
}
.hbt-badge-done { background: #9a5368; color: #fff; }
.hbt-badge-on { background: #ece3f3; color: #6d5b85; }

/* ランキングTOP3 */
.hbt-top3-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hbt-top3-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 26px 20px 22px;
  border-radius: 24px;
  background: var(--hb-paper);
  box-shadow: var(--hb-shadow);
  text-align: center;
}
.hbt-rank {
  margin-bottom: 14px;
  padding: 4px 18px;
  border-radius: 999px;
  background: var(--hb-rose-deep);
  color: #fff;
  font-family: "Shippori Mincho", serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.hbt-rank-2 { background: #b58ca0; }
.hbt-rank-3 { background: #c7a7b3; }
.hbt-top3-cover { min-height: 120px; margin-bottom: 12px; }
.hbt-top3-name { margin: 0 0 4px; font-size: 18px; line-height: 1.5; }
.hbt-top3-name a { color: var(--hb-ink); }
.hbt-top3-name a:hover { color: var(--hb-rose-deep); }
.hbt-top3-item .hbt-badges { justify-content: center; }
.hbt-mini-link { margin-top: 14px; color: var(--hb-rose-deep) !important; font-size: 13px; font-weight: 600; }
.hbt-mini-link::after { content: " \2192"; }

/* 特集記事 */
.hbt-feature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.hbt-feature {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  overflow: hidden;
  border-radius: 22px;
  background: var(--hb-paper);
  box-shadow: var(--hb-shadow);
}
.hbt-feature-thumb { display: block; }
.hbt-feature-thumb img { display: block; width: 100%; height: 100%; min-height: 160px; object-fit: cover; }
.hbt-feature-body { padding: 18px 20px; }
.hbt-feature-cat { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; color: #c08799; font-size: 12px; letter-spacing: 0.06em; }
.hbt-new { padding: 1px 8px; border-radius: 999px; background: #f8e7ec; color: var(--hb-rose-deep); font-size: 11px; }
.hbt-feature-title { margin: 0 0 8px; font-size: 17px; line-height: 1.55; }
.hbt-feature-title a { color: var(--hb-ink); }
.hbt-feature-title a:hover { color: var(--hb-rose-deep); }
.hbt-feature-excerpt { margin: 0 0 8px; color: var(--hb-muted); font-size: 13px; line-height: 1.7; }
.hbt-date { margin: 0; color: #b7a0a7; font-size: 12px; }
.hbt-empty { color: var(--hb-muted); }

/* 作品から探す */
.hbt-work-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hbt-work-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
  padding: 16px 16px 14px;
  border: 1px solid #f0e0e6;
  border-top: 4px solid #e2b3c1;
  border-radius: 16px;
  background: var(--hb-paper);
  transition: box-shadow .2s ease, transform .2s ease;
}
.hbt-work:nth-child(3n+2) .hbt-work-link { border-top-color: #cdb9e2; }
.hbt-work:nth-child(3n) .hbt-work-link { border-top-color: #d9a3b2; }
.hbt-work-link:hover { box-shadow: var(--hb-shadow); transform: translateY(-2px); }
.hbt-work-name { margin-bottom: 4px; color: var(--hb-ink); font-size: 15px; font-weight: 700; line-height: 1.5; }
.hbt-work-rating { margin-top: auto; padding-top: 10px; font-size: 12px; }
.hbt-rating-num { color: var(--hb-ink); font-weight: 700; }
.hbt-rating-count { color: var(--hb-muted); }
.hbt-rating-none { color: #c4a6b0; }

/* 最新の読者の感想 */
.hbt-review-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 18px; padding: 0; list-style: none; }
.hbt-review { padding: 18px 20px; border-radius: 20px; background: var(--hb-paper); box-shadow: var(--hb-shadow); }
.hbt-review p { margin: 0; }
.hbt-review-work a { color: var(--hb-ink); font-weight: 700; }
.hbt-review-stars { margin: 6px 0 8px !important; }
.hbt-review-text { color: #5d424b; font-size: 14px; line-height: 1.8; }
.hbt-review-name { margin-top: 10px !important; color: var(--hb-muted); font-size: 12px; }
.hbt-invite {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 18px 22px;
  border: 1px dashed #e3c3cd;
  border-radius: 20px;
  background: #fffaf9;
}
.hbt-invite p { margin: 0; color: var(--hb-ink); font-size: 14px; }

/* サイトについて */
.hbt-about {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 48px;
  padding: 26px 28px;
  border-radius: 24px;
  background: #f3e8e4;
}
.hbt-about img { flex: 0 0 auto; width: 88px; height: 88px; border-radius: 50%; }
.hbt-about-title { margin: 0 0 6px; color: var(--hb-ink); font-family: "Shippori Mincho", serif; font-size: 20px; }
.hbt-about p { margin: 0 0 8px; color: var(--hb-muted); font-size: 14px; line-height: 1.8; }

/* タブレット */
@media screen and (max-width: 1023px) {
  .hbt-work-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hbt-feature-list { grid-template-columns: 1fr; }
}
/* スマホ */
@media screen and (max-width: 680px) {
  .hbt { width: calc(100% - 24px); margin-top: 12px; }
  .hbt-hero { grid-template-columns: 1fr; padding: 28px 22px 24px; gap: 8px; }
  .hbt-hero-art { order: -1; }
  .hbt-hero-art img { max-width: 150px; }
  .hbt-hero-title { text-align: center; }
  .hbt-eyebrow { display: table; margin-left: auto; margin-right: auto; }
  .hbt-hero-lead { font-size: 14px; }
  .hbt-hero-actions .hbt-btn { flex: 1 1 100%; }
  .hbt-section { margin-top: 36px; }
  .hbt-head { flex-direction: column; align-items: flex-start; gap: 4px; }
  .hbt-top3-list { grid-template-columns: 1fr; }
  .hbt-feature { grid-template-columns: 110px minmax(0, 1fr); }
  .hbt-feature-thumb img { min-height: 120px; }
  .hbt-feature-body { padding: 14px 16px; }
  .hbt-feature-excerpt { display: none; }
  .hbt-work-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .hbt-work-link { padding: 12px; }
  .hbt-review-list { grid-template-columns: 1fr; }
  .hbt-about { flex-direction: column; text-align: center; padding: 22px; }
}

/* 広告表記はヒーローの上（最初の画面に必ず入るように） */
.hbt .hbt-pr { margin: 0 4px 10px; text-align: right; }
@media screen and (max-width: 680px) {
  .hbt .hbt-pr { text-align: left; }
  .hbt-hero-title { font-size: 23px; letter-spacing: 0.02em; }
  .hbt-hero-art img { max-width: 110px; }
  .hbt-hero { padding: 22px 18px 22px; }
}

/* 記事一覧（カテゴリー・検索・ウィジェット・前後の記事）ではアイキャッチを出さない。記事ページの上部とSNS用には使う */
.entry-card-thumb,
.widget-entry-card-thumb,
.navi-entry-card-thumb,
.pager-post-navi .card-thumb {
  display: none !important;
}
.entry-card-content,
.widget-entry-card-content,
.navi-entry-card-content,
.pager-post-navi .card-content {
  margin-left: 0 !important;
}

/* 広い画面（1281px以上）：サイト幅1100pxに本文とサイドバーを収める（Cocoon標準の860px＋376pxだとサイドバーが下に落ちる） */
@media screen and (min-width: 1281px) {
  .main {
    width: calc(100% - 364px);
  }
  .sidebar {
    width: 340px;
  }
}