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

/************************************
** Editorial Design System
** Vogue.com inspired (Bodoni display + Franklin UI)
************************************/
:root {
  --editorial-black: #000000;
  --editorial-charcoal: #333333;
  --editorial-gray: #767676;
  --editorial-light-gray: #e5e5e5;
  --editorial-off-white: #faf9f7;
  --editorial-cream: #f5f3ef;
  --editorial-accent: #000000;
  /* 見出し: Vogue 系 Didone（Bodoni Moda）＋ 日本語は Noto Serif JP */
  --editorial-serif: 'Bodoni Moda', 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', Georgia, serif;
  /* 本文・ナビ・ラベル: Condé Nast 系サンセリフに近い Libre Franklin ＋ 日本語は Noto Sans JP */
  --editorial-sans: 'Libre Franklin', 'Noto Sans JP', 'Helvetica Neue', Arial, sans-serif;
  --editorial-display: 'Bodoni Moda', 'Noto Serif JP', Georgia, serif;
  --editorial-tracking: 0.1em;
}

body {
  font-family: var(--editorial-sans);
  font-weight: 400;
  color: var(--editorial-black);
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.archive-title,
.entry-card-title,
.related-entry-card-title,
.e-card-title,
.article-header .entry-title {
  font-optical-sizing: auto;
}

.article,
.entry-content {
  font-size: 16px;
  line-height: 1.85;
  letter-spacing: 0.02em;
}

.article p {
  margin-bottom: 1.6em;
}

.article a {
  color: var(--editorial-black);
  text-decoration: underline;
  text-decoration-color: var(--editorial-light-gray);
  text-underline-offset: 3px;
  transition: text-decoration-color 0.2s ease;
}

.article a:hover {
  text-decoration-color: var(--editorial-black);
}

.article img,
.entry-content img {
  border-radius: 0;
}

.article figcaption,
.wp-block-image figcaption {
  font-size: 12px;
  color: var(--editorial-gray);
  letter-spacing: 0.04em;
  text-align: center;
  margin-top: 0.6em;
}

.cat-label,
.entry-card-category,
.related-entry-card .cat-label {
  font-family: var(--editorial-sans) !important;
  font-size: 10px !important;
  font-weight: 500;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  background: transparent !important;
  color: var(--editorial-gray) !important;
  padding: 0 !important;
}

.date-tags,
.post-date,
.post-update,
.entry-date {
  font-family: var(--editorial-sans);
  font-size: 12px;
  color: var(--editorial-gray);
  letter-spacing: 0.04em;
}

#navi .navi-in > ul > li > a {
  font-family: var(--editorial-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
}

.entry-card,
.related-entry-card,
.widget-entry-card {
  border-radius: 0;
  box-shadow: none;
  border-bottom: 1px solid var(--editorial-light-gray);
}

.entry-card-title,
.related-entry-card-title,
.e-card-title {
  font-family: var(--editorial-serif);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.footer,
.footer-bottom {
  font-family: var(--editorial-sans);
  font-size: 12px;
  color: var(--editorial-gray);
  letter-spacing: 0.03em;
}

a:hover .product-summary {
  border-color: #1a1a1a;
}

table th,
table td {
  border: 0px solid var(--cocoon-x-thin-color);
  padding: 6px;
  font-size: 80%;
}

.entry-title, .archive-title {
  font-family: var(--editorial-serif);
  font-size: clamp(1.75rem, 3.2vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.01em;
  margin: 16px 0;
  padding: 0;
  color: var(--editorial-black);
}

.article h2 {
  font-family: var(--editorial-serif);
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.04em;
  margin: 2.8em 0 1em;
  padding: 1em 0 0.5em;
  border: none;
  border-top: 1px solid var(--editorial-black);
  border-radius: 0;
  background: transparent;
  color: var(--editorial-black);
}

.related-entry-card .cat-label {
  font-family: var(--editorial-sans);
  font-size: 10px;
}


.article h3,
.entry-content h3 {
  font-family: var(--editorial-serif);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.03em;
  margin: 2em 0 0.8em;
  padding: 0 0 0.4em;
  border: none;
  border-bottom: 1px solid var(--editorial-light-gray);
}

.article h4 {
  font-family: var(--editorial-serif);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.02em;
  margin: 1.6em 0 0.6em;
  padding: 0;
  border: none;
  color: var(--editorial-charcoal);
}

.navi-in > ul li {
  display: block;
  width: 176px;
  height: 40px;
  line-height: 40px;
  position: relative;
}
.kaerebalink-box {
  padding: 22px 25px 0;
  border-radius: 0;
  width: 96%;
  border: 1px solid var(--editorial-light-gray);
  box-sizing: border-box;
  position: relative;
  background: var(--editorial-off-white);
}
.kaerebalink-name {
font-size: 1em;}


.sns-buttons a {
  align-content: center;
  align-items: center;
  background-color: var(--cocoon-sns-color);
  border-radius: var(--cocoon-basic-border-radius);
  display: inline-flex;
  font-size: 16px;
  justify-content: center;
  height: 30px;
  margin-bottom: 8px;
  position: relative;
  text-align: center;
  width: 32%;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  color: var(--cocoon-white-color);
  text-decoration: none;
}
.sns-share-buttons a .share-count {
position: absolute;
right: 3px;
font-size: 10px;
line-height: 1;
}


.sns-follow-message, .sns-share-message {
  font-family: var(--editorial-sans);
  font-size: 11px;
  font-weight: 500;
  font-style: normal;
  color: var(--editorial-gray);
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  text-align: left;
  margin: 0 0 12px;
  line-height: 1.4;
  position: static;
  overflow: visible;
}

.sns-follow-message::after, .sns-share-message::after {
  display: none;
}



.store-introduction {
  border: 1px solid var(--editorial-light-gray);
  padding: 24px;
  background-color: var(--editorial-off-white);
  border-radius: 0;
}

.store-header {
  display: flex;
  align-items: center;
}
.store-name {
  margin: 0;
  font-size: 1em;
  flex: 1;
}
.store-image {
  width: 400px;
  height: 250px;
  object-fit: cover;
  border-radius: 0;
}
.store-details {
  margin-top: 16px;
  margin-bottom: 0px;
}
.store-details p {
  margin: 3px 0;
}
.store-description {
  line-height: 1.4em;
}
.block-columns {
  margin: 0 0;
}



.logo-image {
  padding: 5px 0;
  font-size: inherit;
}

/* PC: 上下余白を確保しつつヘッダーロゴを少し小さくする */
#header .logo-image img,
#header img.logo-image {
  width: 90%;
  height: auto;
}

/* フッターロゴは親テーマのサイズを維持 */
.footer-bottom-logo img,
.footer-bottom-logo .logo-image img {
  width: auto;
  height: 50px;
}
.article hr,
.entry-content hr {
  border: none;
  border-top: 1px solid var(--editorial-light-gray);
  margin: 2.5em 0;
}

.article blockquote,
.entry-content blockquote {
  margin: 2em 0;
  padding: 0 0 0 1.5em;
  border-left: 2px solid var(--editorial-black);
  font-family: var(--editorial-serif);
  font-size: 1.05em;
  line-height: 1.75;
  color: var(--editorial-charcoal);
}

.article ul,
.article ol,
.entry-content ul,
.entry-content ol {
  margin-bottom: 1.6em;
  padding-left: 1.4em;
}

.article ul,
.entry-content ul {
  list-style: none;
  padding-left: 0;
}

.article li,
.entry-content li {
  margin-bottom: 0.5em;
  line-height: 1.75;
  font-size: 0.94em;
}

.article ul li,
.entry-content ul li {
  position: relative;
  padding-left: 1.1em;
}

.article ul li::before,
.entry-content ul li::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--editorial-charcoal);
}

.logo-header,
.header-container {
  border-bottom: 1px solid var(--editorial-light-gray);
}

.tagline {
  text-align: center;
  font-size: 11px;
  font-family: var(--editorial-sans);
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  color: var(--editorial-gray);
  margin: -1.2em .6em .5em;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  .entry-title, .archive-title {
    font-size: 24px;
  }
}

/*834px以下*/
@media screen and (max-width: 834px){
  .article h2 {
    font-size: 1.1rem;
    margin-top: 2.2em;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .entry-title, .archive-title {
    font-size: 1.1rem;
  }

  .article,
  .entry-content {
    font-size: 15px;
    line-height: 1.8;
  }
}


/*関連エントリーカード*/
.related-entry-heading,
.comment-title {
  font-family: var(--editorial-sans);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  background-color: transparent;
  padding: 0 0 8px;
  margin: 20px 0 12px;
  border-bottom: 1px solid var(--editorial-black);
  border-radius: 0;
}

.related-entries {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

.related-list {
  margin-left: 0;
  margin-right: 0;
}

/* 関連記事：左揃え＋カード間の隙間（space-around 廃止分を gap で補う） */
#related-entries .related-list,
.related-entries .related-list,
.related-entries.rect-vertical-card .related-list,
.related-entries.rect-vertical-card-3 .related-list,
.related-entries.rect-vertical-card-4 .related-list,
.related-entries.rect-mini-card .related-list {
  justify-content: flex-start !important;
  align-content: flex-start;
  row-gap: 0.8em;
}

.related-entries.rect-vertical-card .related-list,
.related-entries.rect-mini-card .related-list {
  column-gap: 1%;
}

.related-entries.rect-vertical-card-3 .related-list {
  column-gap: 0.5%;
}

.related-entries.rect-vertical-card-4 .related-list {
  column-gap: 1%;
}

.related-entries.rect-vertical-card-3 .related-entry-card-wrap {
  width: calc((100% - 2 * 0.5%) / 3);
  box-sizing: border-box;
}

.related-entries.rect-vertical-card-4 .related-entry-card-wrap {
  width: calc((100% - 3 * 1%) / 4);
  box-sizing: border-box;
}

.related-entries.rect-mini-card .related-entry-card-wrap {
  width: calc((100% - 1%) / 2);
  box-sizing: border-box;
}

.related-entry-card-wrap {
  padding-left: 0;
  padding-right: 0;
}

.rect-mini-card .related-entry-card-wrap,
.rect-vertical-card .related-entry-card-wrap,
.rect-vertical-card-3 .related-entry-card-wrap,
.rect-vertical-card-4 .related-entry-card-wrap {
  padding: 5px 0;
  box-sizing: border-box;
}

.rect-mini-card .related-entry-card-wrap {
  padding: 7px 0;
}

.related-entry-card-title {
  font-size: 15px;
  line-height: 1.5;
  font-family: var(--editorial-serif);
}

/* SP：関連記事は横2列（縦型カードのまま） */
@media screen and (max-width: 834px) {
  .related-entries.rect-vertical-card .related-list,
  .related-entries.rect-vertical-card-3 .related-list,
  .related-entries.rect-vertical-card-4 .related-list {
    column-gap: 2%;
  }

  .related-entries.rect-vertical-card .related-entry-card-wrap,
  .related-entries.rect-vertical-card-3 .related-entry-card-wrap,
  .related-entries.rect-vertical-card-4 .related-entry-card-wrap {
    width: calc((100% - 2%) / 2) !important;
    max-width: none !important;
    flex: none !important;
  }

  .related-entries .related-entry-card {
    display: flex;
    flex-direction: column;
    height: auto;
  }

  .related-entries .related-entry-card-thumb {
    float: none;
    width: 100% !important;
    margin: 0 0 8px;
  }

  .related-entries .related-entry-card-thumb img,
  .related-entries .related-entry-card-thumb-image {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }

  .related-entries .related-entry-card-content {
    margin-left: 0 !important;
    height: auto;
    max-height: none;
  }

  .related-entries .related-entry-card-title {
    font-size: 13px;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
}

@media screen and (max-width: 480px) {
  .related-entries.rect-mini-card .related-entry-card-wrap {
    width: calc((100% - 2%) / 2) !important;
  }
}

/************************************
** 一覧（タグ・カテゴリー・アーカイブ）：端数行を左揃え
************************************/
.list.ect-vertical-card,
.list.ect-3-columns {
  justify-content: flex-start !important;
  align-content: flex-start;
}

/* 全体リンクのスタイル */
.link-container {
  text-decoration: none;
  color: inherit;
  display: block;
}

/* コンテナ全体 */
.container1 {
  width: 100%;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  box-shadow: none;
  border: 1px solid var(--editorial-light-gray);
  transition: border-color 0.3s ease;
  overflow: hidden;
}

.container1:hover {
  border-radius: 0;
  border-color: var(--editorial-charcoal);
  box-shadow: none;
}

/* 行設定 */
.row {
  display: flex; /* 横並び */
  align-items: stretch; /* 子要素の高さを揃える */
  flex-wrap: nowrap; /* 折り返し防止 */
  width: 100%; /* 行全体を100%幅に */
}

@media (max-width: 768px) {
  .row {
    flex-direction: column; /* 縦並び */
  }
}

/* 写真エリア */
.image-container {
  display: flex; /* 写真を横並びに */
  justify-content: space-between; /* 写真を均等に配置 */
  flex: 1; /* 親要素内で伸縮 */
  overflow: hidden; /* はみ出し防止 */
}

.img-fluid1 {
  width: 50%; /* 2枚が横並びになるよう調整 */
  height: auto; /* アスペクト比を維持 */
  object-fit: contain; /* 親要素内に収める */
  display: block;
  border-radius: 0; /* 角丸を削除 */
}

/* テキストエリア */
.text-container {
  flex: 1;
  padding: 20px;
  background-color: #fff;
  border-radius: 0; /* 角丸を削除 */
  display: flex;
  flex-direction: column;
  justify-content: center; /* テキストを中央揃え */
}
.mb-0 {
  margin-bottom: 0 !important;
}
/* カラム設定 */
.col-md-6 {
  flex: 0 0 50%; /* 左右で半分ずつ */
  max-width: 50%;
}

@media (max-width: 768px) {
  .col-md-6 {
    flex: 0 0 100%; /* スマホでは全幅 */
    max-width: 100%;
  }
}

/* 商品概要 */
.product-summary {
  margin: 20px;
}

.product-summary h2 {
  font-size: 1.5em;
  margin-bottom: 10px;
}

.product-summary p {
  font-size: 1em;
  color: #666;
  margin-bottom: 15px;
}

.summary-box {
  background-color: var(--editorial-off-white);
  border-radius: 0;
  padding: 20px;
  color: var(--editorial-charcoal);
  border: 1px solid var(--editorial-light-gray);
}

.summary-box ul {
  list-style: disc;
  margin: 0;
  padding-left: 20px;
}

.summary-box p {
  margin-top: 10px;
  line-height: 1.8;
}

/* レビューセクション */
.reviews-section {
  background-color: #fff;
  border-radius: 0;
  border: 1px solid var(--editorial-light-gray);
  border-width: 1px;
}

.reviews-header {
  border-radius: 0;
  text-align: right;
  padding: 8px 14px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  background-color: var(--editorial-black);
  position: relative;
  border: none;
  box-sizing: border-box;
}

.reviews-header span {
  align-items: center;
  position: absolute;
  top: 8px;
  left: 14px;
  color: #fff;
  font-family: var(--editorial-sans);
}

.reviews-box {
  font-size: 0.85em;
  margin-bottom: 0;
  background-color: transparent;
  border-radius: 0;
  border: none;
  border-top: 1px solid var(--editorial-light-gray);
  padding: 16px;
  color: var(--editorial-charcoal);
  box-sizing: border-box;
  line-height: 1.75;
}


.wp-block-heading {
  margin-bottom: 0px;
}

.article h3,
.entry-content h3 {
  margin-bottom: 0.5em;
}

/*本文下カテゴリ*/
.cat-link {
  color: var(--editorial-black);
  text-decoration: none;
  display: inline-block;
  margin-right: 8px;
  padding: 0;
  font-size: 11px;
  font-family: var(--editorial-sans);
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  background-color: transparent;
  word-break: break-all;
}
.cat-link:hover {
  opacity: 0.6;
  color: var(--editorial-black);
}

.entry-categories-tags {
  margin-bottom: 10px;
}

.entry-categories-tags > div {
  margin-bottom: 0em;
}

.date-tags {
  font-size: 1.1em;
  line-height: 0.8;
  text-align: right;
  margin-bottom: 0em;
}

.sns-buttons {
  display: flex;
  align-items: center;
}

.tag-link  {
  color: var(--editorial-gray);
  text-decoration: none;
  display: inline-block;
  margin-right: 8px;
  padding: 0;
  font-size: 11px;
  font-family: var(--editorial-sans);
  letter-spacing: 0.03em;
  border: 0;
  background-color: transparent;
  word-break: break-all;
}
.tag-link:hover  {
  opacity: 0.6;
  color: var(--editorial-black);
}

/* h1直下のカテゴリ・タグ（header 内の並び順も h1 直後に固定） */
.single .article-header.entry-header {
  display: flex;
  flex-direction: column;
}

.single .article-header .entry-title {
  order: 1;
}

.single .article-header .entry-categories-tags {
  order: 2;
  margin-top: 0.25em;
  margin-bottom: 1.25em;
}

.single .article-header > *:not(.entry-title):not(.entry-categories-tags) {
  order: 20;
}

/* タイトル上（header 外）・本文下の重複ブロックを非表示 */
.single .article > .entry-categories-tags,
.single .entry-content ~ .entry-categories-tags,
.single .entry-footer .entry-categories-tags {
  display: none !important;
}

.entry-title + .entry-categories-tags {
  margin-top: 0.25em;
  margin-bottom: 1.25em;
}

.entry-content {
  margin-top: 1em;
  margin-bottom: 0em;
}


.related-entry-card-content {
  padding-bottom: 0em;
}

.widget-entry-card {
  font-size: 15px;
  position: relative;
  font-family: var(--editorial-serif);
  font-weight: 400;
}


  .e-card-title {
      font-size: 16px;
      font-family: var(--editorial-serif);
      font-weight: 500;
      line-height: 1.5;
  }
@media screen and (max-width: 834px) {
  .entry-card-title, .related-entry-card-title {
      font-size: 15px;
      font-family: var(--editorial-serif);
      font-weight: 500;
      line-height: 1.5;

  }
}
@media screen and (max-width: 480px) {
  .e-card-title {
      font-size: 14px;
      font-family: var(--editorial-serif);
      font-weight: 500;
      line-height: 1.5;
  }
}

.entry-card-content {
  padding-bottom: 0.2em;
}

.entry-categories-tags {
  margin-bottom: 10px;
}


sidebar h2, .sidebar h3 {
  font-family: var(--editorial-sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  background-color: transparent;
  padding: 0 0 8px;
  margin: 20px 0 12px;
  border-bottom: 1px solid var(--editorial-black);
  border-radius: 0;
}




 .cmp-body {
            font-family: sans-serif;
            line-height: 1.5;
            max-width: 1200px;
            margin: 0 auto;
            padding: 0px;
        }
        .cmp-header {
            background: var(--editorial-off-white);
            color: var(--editorial-black);
            padding: 30px;
            border-radius: 0;
            text-align: center;
            margin-bottom: 30px;
            border: 1px solid var(--editorial-light-gray);
        }
        .cmp-title {
            color: var(--editorial-black);
            margin: 0;
            font-size: 2.5em;
            font-family: var(--editorial-serif);
        }
        .cmp-subtitle {
            margin-top: 10px;
            font-size: 1.2em;
        }
        .cmp-container {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-bottom: 10px;
        }
        .cmp-full-width {
            grid-column: 1 / -1;
        }
        .cmp-card {
            margin-bottom: 10px;
        }
        .cmp-heading {
            border-bottom: 1px solid var(--editorial-black);
            padding-bottom: 10px;
            margin-bottom: 20px;
            font-family: var(--editorial-serif);
        }
        
        .cmp-chart-container {
            position: relative;
            height: 300px;
            margin: 20px 0;
        }
        
        .cmp-metric-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 15px;
            margin: 20px 0;
        }
       .cmp-metric-grid1 {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            gap: 15px;
            margin: 20px 0;
        }
        .cmp-metric-card {
            background: var(--editorial-off-white);
            padding: 10px;
            border-radius: 0;
            text-align: center;
            border: 1px solid var(--editorial-light-gray);
        }
        .cmp-metric-value {
            font-size: 1.5em;
            font-weight: bold;
            color: var(--editorial-black);
        }
        
        .cmp-metric-value1 {
            font-size: 1.3em;
            font-weight: bold;
            color: var(--editorial-black);
        }
        .cmp-table {
            width: 100%;
            border-collapse: collapse;
            margin: 20px 0;
        }
        .cmp-table th, 
        .cmp-table td {
            padding: 10px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        .cmp-table th {
            background-color: #f0f0f0;
            color: #333;
            font-weight: bold;
        }
        
        .cmp-highlight-box {
            background: var(--editorial-off-white);
            border: 1px solid var(--editorial-light-gray);
            border-radius: 0;
            padding: 20px;
            margin: 20px 0;
        }
        
        .cmp-footer {
            padding: 10px;
            margin-top: 10px;
            font-size: 0.8em;
        }
        .cmp-text-s {
            font-size: 0.9em;
        }

        @media (max-width: 768px) {
            .cmp-container {
                grid-template-columns: 1fr;
            }
        }

        .cmp-metric-grid {
    display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2カラムに */
    gap: 10px;
}
        .cmp-metric-grid1 {
    display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2カラムに */
    gap: 10px;
}

@media (min-width: 600px) {
    .cmp-metric-grid {
        grid-template-columns: repeat(3, 1fr); /* 画面幅600px以上で3カラムに */
    }
}

.cmp-section-two-col {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 20px;
  margin-bottom: 30px;
}

@media (max-width: 768px) {
  .cmp-section-two-col {
    grid-template-columns: 1fr;
  }
}

        .cmp-warning {
            background: #fff3cd;
            border: 1px solid #ffeaa7;
            border-radius: 5px;
            padding: 15px;
            margin: 15px 0;
            font-size: 0.9em;
        }




.navi-in > ul li {
    display: block;
    width: 140px;
    height: 40px;
    line-height: 40px;
    position: relative;
}

footer {
    margin-top: 10px;
}


.wp-block-categories-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0em 5px 0 0; /* カラムと行間の余白 */
  list-style: none; /* デフォルトのリストスタイルを消したい場合 */
  padding: 0; /* パディングリセット（任意） */
}

.sidebar h2, .sidebar h3 {
    font-family: var(--editorial-sans);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: var(--editorial-tracking);
    text-transform: uppercase;
    background-color: transparent;
    padding: 0 0 8px;
    margin: 20px 0 12px;
    border-bottom: 1px solid var(--editorial-black);
    border-radius: 0;
}

.wp-block-list {
  list-style: none;
  padding-left: 0px;
  margin-left: 10px;
}

.wp-block-heading {
  margin-bottom: 13px;
  padding: 0;
}

.footer {
  padding: 0;
}


@media (max-width: 767px) {
  .entry-title, .archive-title {
    font-size: 22px;
  }
}

/* SPヘッダーのロゴ/サイト名を洗練したバランスに調整 */
@media screen and (max-width: 767px) {
  .logo-text {
    padding: 8px 0 10px;
  }

  .logo-image {
    padding: 6px 0 0;
  }

  #header .logo-image img,
  #header img.logo-image {
    width: 75%;
    height: auto;
  }

  #header .site-name-text,
  .site-name-text {
    font-size: 16px;
    line-height: 1.35;
    letter-spacing: 0.06em;
    font-family: var(--editorial-serif);
    font-weight: 500;
  }

  .site-name-text-link {
    padding: 0 0.5em;
  }

  .tagline {
    font-size: 10px;
    letter-spacing: 0.08em;
    margin: 0.2em 0 0.4em;
    text-align: center;
  }

  .logo-header,
  .header-container {
    border-bottom: 1px solid var(--editorial-light-gray);
  }
}


.auto-gallery-slider {
    padding-top: 10px;
}
.auto-gallery-slider h3 {
    font-family: var(--editorial-sans);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: var(--editorial-tracking);
    text-transform: uppercase;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--editorial-light-gray);
}
.auto-gallery-slider img {
    width: 100%;
    height: auto;
    border-radius: 0;
    transition: opacity 0.2s ease;
}
.auto-gallery-slider a:hover img {
    transform: none;
    opacity: 0.92;
}

.auto-gallery-slider .swiper {
    height: 180px; /* 好きな高さに調整（例: 300px） */
}

.auto-gallery-slider .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.auto-gallery-slider .swiper-slide img {
    max-height: 100%;
    max-width: 100%;
    object-fit: contain; /* 元の比率を保ちつつ収まるように表示 */
}


.swiper-button-next::after,
.swiper-button-prev::after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1;
    color: #999; /* ← グレー（お好みで #aaa や #ccc に調整可） */
}


.londrina-shadow-regular {
  font-family: var(--editorial-display);
  font-weight: 500;
  font-style: italic;
  letter-spacing: 0.02em;
}




/************************************
** プロフィールボックス
************************************/

.author-box {
            border: 1px solid var(--editorial-light-gray);
            border-radius: 0;
            padding: 24px;
            background: var(--editorial-off-white);
            box-shadow: none;
            transition: border-color 0.3s ease;
        }

.author-box p {
  margin-top: 0.3em;
  line-height: 1.3;
}
.author-box .sns-follow {
  margin: 0;
}
.author-box .sns-follow-message {
  display: none;
}
.author-box .sns-follow-buttons {
  flex-wrap: wrap;
  justify-content: flex-start;
}
.author-box .sns-follow-buttons a.follow-button {
  font-size: 0.9rem;
  width: 24px;
  height: 24px;
  margin-bottom: 4px;
  margin-right: 4px;
  background-color: transparent;
  color: var(--cocoon-x-pallid-text-color);
  border: 1px solid var(--cocoon-basic-border-color);
  border-radius: 2px;
}
.author-box .sns-follow-buttons a.follow-button:hover {
  background-color: var(--cocoon-xxx-thin-color);
}
.author-box .sns-follow-buttons a.follow-button .follow-count {
  display: none;
}
.author-box .author-name {
  font-size: 0.9em;
  font-weight: bold;
}

.author-thumb {
  float: left;
  margin-top: 3px;
  width: 120px;
}
.author-content {
  margin-left: 130px;
}

.nwa .author-box {
  text-align: center;
  padding: 20px;
}
.nwa .author-box .author-thumb {
  float: none;
  width: 100px;
  margin: 9px auto 0;
}
.nwa .author-box .author-content {
  margin: 0;
  padding: 1em;
}
.nwa .author-box .author-description {
   font-size: 0.75em;
  text-align: left;
}
.nwa .author-box .sns-follow-buttons {
  margin-top: -12px;
  justify-content: center;
}
.nwa .author-box .sns-follow-buttons a {
  margin-top: -12px;
  display: inline-block;
  margin: -10px 0 -2px;

}


/* タグ一覧ページのスタイル */
.tags-page-container {
    max-width: 100%;
    padding: 20px 0;
}

/* 検索ボックス */
.tag-search-container {
    margin-bottom: 30px;
    text-align: center;
}

.tag-search-input {
    width: 100%;
    max-width: 400px;
    padding: 12px 20px;
    border: 1px solid var(--editorial-light-gray);
    border-radius: 0;
    font-size: 14px;
    font-family: var(--editorial-sans);
    outline: none;
    transition: border-color 0.3s ease;
    background: var(--editorial-off-white);
}

.tag-search-input:focus {
    border-color: var(--editorial-black);
}

/* 人気タグセクション */
.popular-tags-section {
    margin-bottom: 40px;
}

.popular-tags-section h2 {
    color: var(--editorial-black);
    border-bottom: 1px solid var(--editorial-black);
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-family: var(--editorial-sans);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: var(--editorial-tracking);
    text-transform: uppercase;
}

.popular-tags-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}

.popular-tag-item {
    background: var(--editorial-black);
    border-radius: 0;
    overflow: hidden;
    transition: opacity 0.3s ease;
}

.popular-tag-item:hover {
    transform: none;
    opacity: 0.85;
}

.popular-tag-link {
    display: block;
    padding: 15px;
    color: #fff;
    text-decoration: none;
}

.popular-tag-link:hover {
    color: #fff;
    text-decoration: none;
}

.tag-info {
    text-align: center;
}

.tag-name {
    display: block;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 5px;
}

.tag-count {
    font-size: 14px;
    opacity: 0.9;
}

/* すべてのタグセクション */
.all-tags-section h2 {
    color: var(--editorial-black);
    border-bottom: 1px solid var(--editorial-black);
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-family: var(--editorial-sans);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: var(--editorial-tracking);
    text-transform: uppercase;
}

.all-tags-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
}

.tag-card {
    background: #fff;
    border: 1px solid var(--editorial-light-gray);
    border-radius: 0;
    overflow: hidden;
    transition: border-color 0.3s ease;
    box-shadow: none;
}

.tag-card:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--editorial-black);
}

.tag-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.tag-card-link:hover {
    text-decoration: none;
    color: inherit;
}

.tag-card-content {
    padding: 20px;
}

.tag-title {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px 0;
}

.tag-count-text {
    font-size: 12px;
    color: var(--editorial-gray);
    font-weight: 400;
    margin: 0 0 10px 0;
    letter-spacing: 0.03em;
}

.tag-description {
    font-size: 14px;
    color: #666;
    line-height: 1.5;
    margin: 0;
}

/* ダークモード対応 */
.skin-dark .tag-card {
    background: #333;
    border-color: #444;
}

.skin-dark .tag-title {
    color: #fff;
}

.skin-dark .tag-description {
    color: #ccc;
}

.skin-dark .popular-tags-section h2,
.skin-dark .all-tags-section h2 {
    color: #fff;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .popular-tags-grid,
    .all-tags-grid {
        grid-template-columns: 1fr;
    }
    
    .tags-page-container {
        padding: 10px;
    }
}

/* 安全なシンプルスタイル */
.simple-tag-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 20px 0;
}

.tag-simple-card {
    background: var(--editorial-off-white);
    border: 1px solid var(--editorial-light-gray);
    border-radius: 0;
    overflow: hidden;
}

.tag-simple-card a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.2s;
}

.tag-simple-card a:hover {
    background: #e9ecef;
    text-decoration: none;
    color: #333;
}

.tag-simple-card span {
    color: #6c757d;
    font-size: 0.9em;
}

#navi .navi-in>ul>li>a {
    padding: 0 1em;
}


.entry-card-thumb { width: 100%; height: auto; /* 高さを固定値に設定 */ object-fit: cover; /* 縦横比を保ちつつクロップ */ object-position: center; /* クロップ位置を中央に */ display: block; }

.rampart-one-regular {
  font-family: var(--editorial-display);
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.img-box-blur {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.img-box-blur::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("https://puniees.com/wp-content/uploads/2025/08/FD_TR_16.jpg") center/cover no-repeat;
  filter: blur(40px);
  transform: scale(1.0);
  z-index: 0;
}

.img-box-blur img {
  position: relative;
  z-index: 1;
  max-width: 100%;
  height: auto;
}



        /* アフィリエイトブロックのスタイル */
        .affiliate-block {
            border: 1px solid var(--editorial-light-gray);
            border-radius: 0;
            padding: 24px;
            background: var(--editorial-off-white);
            box-shadow: none;
            transition: border-color 0.3s ease;
        }
        
        .affiliate-block:hover {
            transform: none;
            border-color: var(--editorial-charcoal);
        }
        
        .product-info {
            display: flex;
            gap: 20px;
            margin-bottom: 20px;
        }
        
        .product-image {
            flex: 0 0 120px;
            display: flex;
            align-items: flex-start;
            justify-content: center;
            border-radius: 0;
            overflow: hidden;
        }
        
        .product-image a {
            display: block;
            transition: transform 0.3s ease;
        }
        
        .product-image a:hover {
            transform: scale(1.05);
        }
        
        .product-image img {
            max-width: 100%;
            max-height: 160px;
            width: auto;
            height: auto;
            object-fit: contain;
            border-radius: 0;
            cursor: pointer;
        }
        
        .product-details {
            flex: 1;
        }
        
        .product-title {
            font-size: 1.1rem;
            font-weight: 500;
            font-family: var(--editorial-serif);
            color: var(--editorial-black);
            margin-bottom: 10px;
            line-height: 1.5;
        }
        
        .product-description {
            color: #666;
              margin-bottom: 0 !important;
            font-size: 0.8em;
            line-height: 1.5;
        }
        
        .product-price {
            font-size: 1.1rem;
            font-weight: 600;
            color: #e53e3e;
            margin-bottom: 10px;
        }
        
        .affiliate-links {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        
        .affiliate-link {
            padding: 5px 16px;
            border-radius: 0;
            text-decoration: none;
            font-weight: 600;
            font-size: 12px;
            letter-spacing: 0.04em;
            transition: opacity 0.3s ease;
            display: inline-block;
        }
        
        .amazon { background: #FF9900; color: white; }
        .amazon:hover { background: #e68900; }
        
        .rakuten { background: #BF0000; color: white; }
        .rakuten:hover { background: #a60000; }
        
        .yahoo { background: #FF0033; color: white; }
        .yahoo:hover { background: #e6002e; }
        
        .mercari { background: #FF6058; color: white; }
        .mercari:hover { background: #ff4d44; }
        
        .netflix { background: #E50914; color: white; }
        .netflix:hover { background: #cc0812; }
        
        .prime-video { background: #00A8E1; color: white; }
        .prime-video:hover { background: #0097cb; }
        
        .unext { background: #1E90FF; color: white; }
        .unext:hover { background: #1c7ee6; }
        
        .official { background: #1a1a1a; color: white; }
        .official:hover { background: #333; }
        
        .affiliate-link:hover {
            opacity: 0.85;
            transform: none;
            box-shadow: none;
        }
        
        @media (max-width: 768px) {
            .main-content {
                grid-template-columns: 1fr;
            }
            
            .input-section {
                border-right: none;
                border-bottom: 1px solid #e0e0e0;
            }
            
            .header h1 {
                font-size: 2rem;
            }
            
            .product-info {
                flex-direction: column;
            }
            
            .product-image {
                flex: none;
                width: 100%;
                max-width: 200px;
                margin: 0 auto;
            }
            
            .affiliate-links {
                justify-content: center;
            }
        }
.list-item-caption {
  font-size: 0.8em;
  padding: -5px 4px;
}

/* 本文テーブル: 左端カラムを内容幅ベースにする */
.article table,
.entry-content table,
.article .wp-block-table table,
.entry-content .wp-block-table table {
  table-layout: auto !important;
  width: 100%;
}

.article table tr > th:first-child,
.article table tr > td:first-child,
.entry-content table tr > th:first-child,
.entry-content table tr > td:first-child {
  width: 1% !important;
  white-space: nowrap;
}

/* Editorial table style (VOGUE / ELLE inspired) */
.article table,
.entry-content table,
.article .wp-block-table table,
.entry-content .wp-block-table table {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 1.8em 0 2.1em;
  font-family: var(--editorial-sans);
  font-size: 14px;
  line-height: 1.65;
  color: var(--editorial-charcoal);
  border-top: 1px solid var(--editorial-black);
  border-bottom: 1px solid var(--editorial-black);
  background: transparent;
}

.article table th,
.entry-content table th {
  font-family: var(--editorial-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: var(--editorial-tracking);
  text-transform: uppercase;
  color: var(--editorial-black);
  background: var(--editorial-off-white);
  padding: 11px 12px 9px;
  border-bottom: 1px solid var(--editorial-light-gray);
  text-align: left;
  vertical-align: middle;
}

.article table td,
.entry-content table td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--editorial-light-gray);
  vertical-align: top;
  text-align: left;
}

.article table tr:last-child td,
.entry-content table tr:last-child td {
  border-bottom: none;
}

.article table tbody tr:nth-child(even),
.entry-content table tbody tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.015);
}

.article table tbody tr:hover,
.entry-content table tbody tr:hover {
  background: rgba(0, 0, 0, 0.03);
}

@media screen and (max-width: 767px) {
  .article table,
  .entry-content table,
  .article .wp-block-table table,
  .entry-content .wp-block-table table {
    font-size: 13px;
  }

  .article table th,
  .entry-content table th,
  .article table td,
  .entry-content table td {
    padding: 9px 10px;
  }
}




/* sidedish-affiliate-box（アフィリエイト紹介ボックス） */
.sidedish-affiliate-box {
  box-sizing: border-box;
  text-align: left;
  font-size: 14px;
  line-height: 1.55;
  color: #333;
  margin: 1.75em 0;
  padding: 16px 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
  overflow: hidden;
}
.sidedish-affiliate-box::after {
  content: "";
  display: table;
  clear: both;
}
.sidedish-affiliate-image {
  float: left;
  margin: 0 16px 12px 0;
}
.sidedish-affiliate-image a {
  display: block;
  line-height: 0;
}
.sidedish-affiliate-image img {
  display: block;
  width: 120px;
  max-width: 100%;
  height: auto;
  border: none;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.sidedish-affiliate-info {
  line-height: 1.55;
  overflow: hidden;
}
.sidedish-affiliate-name {
  margin: 0 0 10px;
  line-height: 1.4;
  font-size: 16px;
  font-weight: 700;
}
.sidedish-affiliate-name a {
  color: #111;
  text-decoration: none;
}
.sidedish-affiliate-name a:hover {
  text-decoration: underline;
  color: #000;
}
.sidedish-affiliate-detail {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.65;
  color: #64748b;
}
.sidedish-affiliate-links {
  margin-top: 10px;
  line-height: 1.8;
}
.sidedish-affiliate-links .shoplinkamazon,
.sidedish-affiliate-links .shoplinkrakuten,
.sidedish-affiliate-links .shoplinkyahoo {
  display: inline-block;
  margin: 0 8px 8px 0;
  vertical-align: middle;
}
.sidedish-affiliate-links .shoplinkamazon a,
.sidedish-affiliate-links .shoplinkrakuten a,
.sidedish-affiliate-links .shoplinkyahoo a {
  display: inline-block;
  padding: 7px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none !important;
  line-height: 1.3;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.sidedish-affiliate-links .shoplinkamazon a {
  background: #232f3e;
}
.sidedish-affiliate-links .shoplinkamazon a:hover {
  background: #131921;
}
.sidedish-affiliate-links .shoplinkrakuten a {
  background: #bf0000;
}
.sidedish-affiliate-links .shoplinkrakuten a:hover {
  background: #9a0000;
}
.sidedish-affiliate-links .shoplinkyahoo a {
  background: #ff0033;
}
.sidedish-affiliate-links .shoplinkyahoo a:hover {
  background: #d9002b;
}
@media (max-width: 520px) {
  .sidedish-affiliate-image {
    float: none;
    margin: 0 auto 14px;
    text-align: center;
  }
  .sidedish-affiliate-image img {
    width: 140px;
    margin: 0 auto;
  }
  .sidedish-affiliate-name {
    font-size: 15px;
  }
}