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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}


/* svg icon */
#svgicon {
  display: block;
  width: 0;
  height: 0;
  overflow: hidden;
}

:root{
  --text:#222;
  --bg:#ffffff;
  --muted:#666;
  --line:#e3e3e3;
  --soft:#f7f7f3;
  --accent:#6b8e23;
  --accent-dark:#557318;
  --accent-soft:#eef5df;
  --red:#b40000;
  --blue:#0b58b0;
  --content-max:1200px;
  --shadow:0 6px 20px rgba(0,0,0,.06);
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}

*, *::before, *::after{
  box-sizing:border-box;
}

html, body{
  margin:0;
  padding:0;
  width:100%;
}

body{
  font-family:system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", "Meiryo", sans-serif;
  font-size:16px;
  line-height:1.8;
  color:var(--text);
  background:var(--bg);
  overflow-x:hidden;
}

img, video, iframe{
  display:block;
  max-width:100%;
  height:auto;
  border:0;
}

a{
  color:inherit;
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}

button, input, select, textarea{
  font:inherit;
}

table{
  border-collapse:collapse;
  border-spacing:0;
  width:100%;
}

td, th{
  vertical-align:top;
  word-break:break-word;
  overflow-wrap:anywhere;
}

hr{
  border:0;
  border-top:1px solid var(--line);
  margin:24px 0;
}

.img_center,
.txt_center {
  text-align: center;
  font-size: 100%;
}
.img_right,
.txt_right {
  text-align: right;
  font-size: 100%;
}
.img_left,
.txt_left {
  text-align: left;
  font-size: 100%;
}

/* ページトップへ戻る */
#page-top {
  position: fixed;
  bottom: 20px;
  right: 3%;
  z-index: 9999;
  margin: 0;
}
#page-top a {
  display: block;
}
#page-top a:hover {
  opacity: 0.8;
}
.pageTop {
  display: none;
}

/* 余白バランス微調整 */
/* #main の幅・余白はCocoon本体に任せます（サイドバー維持のため上書きしません） */

.section{
  margin:0 0 48px;
}

.section-title{
  font-size:32px;
  line-height:1.4;
  margin-bottom:20px;
  font-weight:700;
  text-align:center;
}

.section-lead{
  font-size:16px;
  line-height:2;
  max-width:1000px;
  margin:0 auto 30px;
  text-align:center;
  color:var(--muted);
}

.section-mini{
  display:inline-block;
  font-size:1.2rem;
  font-weight:700;
  color:var(--accent-dark);
  background:var(--accent-soft);
  border-radius:999px;
  padding:4px 12px;
  margin:0 0 10px;
}

.center-block{
  text-align:center;
}

.hero{
  margin:18px 0 28px;
  background:linear-gradient(180deg, #fdfcf7 0%, #f7f7f3 100%);
  border:1px solid #ece9dd;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
}

.hero-inner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:center;
  padding:28px;
}

.hero-copy h1{
  font-size:1.2rem;
  line-height:1.0;
  margin:0 0 12px;
}

.hero-copy p{
  margin:0 0 16px;
  color:#444;
}

.hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 18px;
  padding:0;
  list-style:none;
}

.hero-points li a{
  display:block;
  background:#fff;
  border:1px solid #e6e1d5;
  border-radius:999px;
  padding:6px 12px;
  font-size:0.98rem;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.btn{
  display:inline-block;
  padding:12px 18px;
  border-radius:999px;
  font-weight:700;
  text-align:center;
  transition:.2s ease;
}

.btn-primary{
  background:var(--accent);
  color:#fff;
}

.btn-primary:hover{
  background:var(--accent-dark);
}

.btn-secondary{
  background:#fff;
  color:var(--text);
  border:1px solid #d9d4c6;
}

.btn-secondary:hover{
  background:#f5f5f0;
}

.btn-outline{
  background:#fff;
  color:var(--blue);
  border:1px solid #cddaf0;
}

.btn-outline:hover{
  background:#f5f9ff;
}

.hero-visual img{
  width:100%;
  aspect-ratio:800 / 160;
  object-fit:cover;
  border-radius:14px;
  background:#f7f7f7;
}

.hero-subnote{
  margin-top:14px;
  font-size:.9rem;
  color:var(--muted);
}

.cta-band{
  background:linear-gradient(180deg, #fffef7 0%, #f7f7f1 100%);
  border:1px solid #ebe5d7;
  border-radius:18px;
  padding:22px;
  box-shadow:var(--shadow);
}

.cta-band h2{
  margin:0 0 8px;
  text-align:center;
  font-size:1.35rem;
}

.cta-band p{
  margin:0 0 16px;
  text-align:center;
  color:var(--muted);
}

.cta-band .hero-actions{
  justify-content:center;
}

/* =========================
カテゴリカード
========================= */
.category-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.category-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  text-align:center;
}

.category-card > a{
  display:block;
  height:100%;
}

.category-media-banner{
  display:block;
  width:120px;
  aspect-ratio:1 / 1;
  margin:14px auto 0;
  object-fit:cover;
  object-position:center;
  border-radius:12px;
  background:#f5f5f5;
}

.category-body{
  padding:18px;
}

.category-body h3{
  margin:0 0 8px;
  font-size:1.15rem;
  line-height:1.5;
}

.category-body p{
  margin:0 0 12px;
  color:var(--muted);
  line-height:1.7;
}

.category-more{
  color:var(--blue);
  font-weight:700;
}

.block-cta{
  text-align:center;
  margin-top:22px;
}

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

.popular-card{
  background:#fff;
  padding:24px;
  border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,0.06);
}

.popular-card h3{
  font-size:22px;
  margin-bottom:14px;
}

.popular-card p{
  line-height:1.9;
  font-size:15px;
}

.popular-card ul{
  margin:0;
  padding-left:1.2em;
}

.popular-card li{
  margin:0 0 7px;
}

.popular-card a,
.popular-card li a{
  color:var(--blue);
  font-weight:700;
  text-decoration:none;
}

.notice-wrap{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;
}

.notice-card,
.contact-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  box-shadow:var(--shadow);
}

.notice-card h2,
.contact-card h2{
  margin:0 0 12px;
  font-size:1.2rem;
}

.notice-red{
  color:var(--red);
  font-weight:700;
}

.notice-blue{
  color:var(--blue);
}

.line-banner{
  border:1px solid #d8ead9;
  background:#f3fff5;
  border-radius:18px;
  padding:24px;
  text-align:center;
  box-shadow:var(--shadow);
}

.line-banner h2{
  margin:0 0 10px;
  font-size:1.35rem;
}

.line-banner p{
  margin:0 0 14px;
  color:var(--muted);
}

.line-banner img{
  display:inline-block;
  width:min(220px, 70%);
  height:auto;
}

.footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
  margin:0 0 20px;
}

.footer-links a{
  display:inline-block;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
}

.page-back{
  background:var(--soft);
  text-align:center;
  padding:12px;
  margin:28px 0;
  border-radius:12px;
}

.copyright{
  text-align:center;
  font-size:.92rem;
  color:var(--muted);
}

.search-box{
  width:100%;
  margin:10px 0;
}

.search-inner{
  display:flex;
  border:1px solid #ddd;
  border-radius:30px;
  overflow:hidden;
  background:#fff;
}

.search-inner input{
  flex:1;
  border:none;
  padding:12px 14px;
  font-size:16px;
  outline:none;
}

.search-inner input::placeholder{
  color:#aaa;
}

.search-inner button{
  border:none;
  background:#4CAF50;
  color:#fff;
  padding:0 16px;
  font-size:18px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.search-inner button:hover{
  background:#43a047;
}

.archive_box {
  font-family:"メイリオ";
  font-size: 100%;
  line-height: 150%;
  text-align: left;
  border: 5px solid #ffcc99;
  border-radius: 15px;
  margin-top: 10px;
  padding: 10px;
  margin-bottom: 10px;
  background-color: #ffffff;
  box-shadow:var(--shadow);
}

.archive_box a{
  display:block;
  line-height:1.7;
}

.archive_box .news-title{
  display:block;
  color:#cc0000;
  font-size:1.1rem;
  font-weight:700;
  margin:0 0 4px;
}

.box {
  font-family:"メイリオ";
  font-size: 100%;
  line-height: 150%;
  text-align: left;
  border: 3px solid #ffcc99;
  border-radius: 5px;
  margin-top: 10px;
  padding: 10px;
  background-color: #ffffff;
}

.box2 {
  font-family:"メイリオ";
  font-size: 100%;
  line-height: 150%;
  text-align: left;
  border: 3px solid #ff9428;
  border-radius: 15px;
  margin-top: 10px;
  padding: 10px;
  background-color: #f8f8f8;
}

.wpearch {
  width:350px;
  text-align: left;
  border: 1px solid #ff9428;
  border-radius: 1px;
  margin-top: 3px;
  padding: 3px;
  background-color: #ffffff;
}

.seo-intro{
  background:#fbfffb;
  padding:40px 20px;
  margin:0 0 48px;
  border-radius:18px;
}

.seo-intro .popular-card p{
  margin:0 0 10px;
  line-height:1.9;
  font-size:15px;
}

.seo-intro .popular-card a{
  font-weight:700;
  color:#2a7a2a;
}

.seo-intro .popular-card a:hover{
  opacity:0.7;
}


/* =========================================
   トップページ 投稿カテゴリー画像サイズ統一
   ========================================= */

.eco-post-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #f7f7f7;
  border-radius: 6px;
}

.eco-post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/************************************
** メディアクエリ（画面幅ごとの個別調整）
************************************/

@media screen and (max-width:764px){
  .sm500{display:block !important;}
  .sm500xxx{display:none !important;}
}

@media screen and (min-width:765px){
  .sm500{display:none !important;}
  .sm500xxx{display:block !important;}
}

/* スマホは縦並び */
@media (max-width:767px){
  .sidebar{
    display:block;
  }
  .widget{
    margin-bottom:16px;
  }
}

@media (max-width:900px){
  .hero-inner,
  .notice-wrap{
    grid-template-columns:1fr;
  }
}

@media (max-width:600px){
  body{
    font-size:15px;
  }

  .hero-inner{
    padding:18px;
    gap:16px;
  }

  .hero-copy h1{
    font-size:1.0rem;
  }

  .section-title{
    font-size:1.28rem;
  }

  .category-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .popular-grid{
    grid-template-columns:1fr;
  }

  .category-media-banner{
    width:100px;
    aspect-ratio:1 / 1;
    margin:12px auto 0;
  }

  .category-body{
    padding:10px;
  }

  .category-body h3{
    margin:0 0 6px;
    font-size:0.95rem;
    line-height:1.4;
  }

  .category-body p{
    margin:0 0 8px;
    font-size:0.8rem;
    line-height:1.5;
  }

  .category-more{
    font-size:0.8rem;
  }

  .hero-actions .btn{
    width:100%;
  }

  .search-inner input{
    padding:14px;
    font-size:16px;
  }

  .archive_box .news-title{
    font-size:1rem;
  }
}

/* アイコンサイズ */
.mobile-footer-menu-buttons .fa,
.mobile-menu-buttons .fa {
    font-size: 28px;
}
/* フッターモバイルボタンの文字サイズ */
.mobile-footer-menu-buttons .menu-caption,
.mobile-menu-buttons .menu-caption {
    font-size: 18px; /* お好みのサイズに変更 */
}
/* フッターモバイルボタン全体の背景色 */
.mobile-footer-menu-buttons {
    background: #ffffff; /* 背景色 */
}

/* =========================================================
   functions.php から移行したCSS
   ========================================================= */

/* 商品カテゴリカード [eco_product_categories mode="cards"] */
:root{
  --card-bg:#fff;
  --card-bd:rgba(0,0,0,.08);
  --brand:#2563eb;
  --radius:14px;
  --gap:14px;
  --shadow-sm:0 6px 16px rgba(0,0,0,.10);
}

#product-page .category-content{margin:0 0 44px}
#product-page .category-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 12px;
  padding-left:12px;
  border-left:4px solid var(--brand);
  line-height:1.3;
  font-size:17px;
}
#product-page .category-title a{color:var(--text);text-decoration:none}
#product-page .category-title a:hover{text-decoration:underline}
#product-page .card-grid{
  display:grid;
  gap:var(--gap);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:600px){
  #product-page .card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1024px){
  #product-page .card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
#product-page .product-card{
  background:var(--card-bg);
  border:1px solid var(--card-bd);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 0 0 rgba(0,0,0,0);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
#product-page .product-card a{display:block;color:inherit;text-decoration:none}
#product-page .product-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow);
  border-color:rgba(37,99,235,.30);
}
#product-page .product-card:focus-within{
  box-shadow:0 0 0 3px rgba(37,99,235,.25),var(--shadow-sm);
  border-color:rgba(37,99,235,.45);
}
@media (prefers-reduced-motion:reduce){
  #product-page .product-card{transition:none}
  #product-page .product-thumb img{transition:none}
  #product-page .product-card:hover{transform:none}
}
#product-page .product-thumb{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.03);
  aspect-ratio:4/3;
  overflow:hidden;
}

#product-page .product-thumb img{
  display:block;
  width:100%;
  height:100%;
  margin:auto;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.001);
  transition:transform .25s ease;
}

#product-page .product-card:hover .product-thumb img{transform:none}
#product-page .product-info{
  padding:10px 12px 12px;
  font-size:14px;
  line-height:1.45;
  color:var(--text);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:calc(1.45em * 2);
}
#product-page .category-more{margin-top:12px;text-align:center}
#product-page .category-more a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 18px;
  border-radius:999px;
  border:2px solid #2563eb;
  color:#2563eb;
  font-weight:600;
  text-decoration:none;
  transition:all .2s ease;
}
#product-page .category-more a::after{content:"→";transition:transform .2s ease}
#product-page .category-more a:hover{background:#2563eb;color:#fff}
#product-page .category-more a:hover::after{transform:translateX(4px)}

.category-select-form{
  margin:12px 0;
  font-size:.9em;
}

.eco-cpdo-wrap{
  margin:10px 0 12px;
}
.eco-cpdo-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  max-width:720px;
}
.eco-cpdo-cat-select{
  width:100%;
  padding:10px;
  border:1px solid #4CAF50;
  border-radius:6px;
  background:#f0fff4;
  color:#222;
  font-weight:bold;
  box-shadow:0 1px 3px rgba(0,0,0,0.08);
}
.eco-cpdo-post-select{
  width:100%;
  padding:10px;
  border:1px solid #ddd;
  border-radius:6px;
}

/* SNSフォローボタン [profile_follow_buttons] */
.eco-follow-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:18px 0;
  align-items:center;
}
.eco-follow-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 14px 8px 8px;
  border-radius:9999px;
  text-decoration:none !important;
  background:#ffffff;
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  border:1px solid currentColor;
  max-width:100%;
}
.eco-follow-link:hover,
.eco-follow-link:focus{
  text-decoration:none !important;
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(0,0,0,.12);
  opacity:.96;
}
.eco-follow-link:focus-visible{
  outline:2px solid #666;
  outline-offset:2px;
}
.eco-follow-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  font-size:13px;
  font-weight:800;
  letter-spacing:.02em;
  flex:0 0 36px;
  color:#fff;
}
.eco-follow-text{
  display:inline-block;
  white-space:nowrap;
}
.eco-follow-x{color:#111111 !important;background:#ffffff}
.eco-follow-x .eco-follow-icon{background:#111111}
.eco-follow-instagram{color:#c13584 !important;background:#ffffff;border-color:#c13584}
.eco-follow-instagram .eco-follow-icon{background:linear-gradient(135deg,#f58529 0%,#dd2a7b 45%,#8134af 75%,#515bd4 100%)}
.eco-follow-facebook{color:#1877f2 !important;background:#ffffff;border-color:#1877f2}
.eco-follow-facebook .eco-follow-icon{background:#1877f2}
.eco-follow-line{color:#06c755 !important;background:#ffffff;border-color:#06c755}
.eco-follow-line .eco-follow-icon{background:#06c755;font-size:10px}
.eco-follow-pinterest{color:#e60023 !important;background:#ffffff;border-color:#e60023}
.eco-follow-pinterest .eco-follow-icon{background:#e60023}
.eco-follow-hatena{color:#2e7d32 !important;background:#ffffff;border-color:#2e7d32}
.eco-follow-hatena .eco-follow-icon{background:#2e7d32}
.eco-follow-amazon{color:#ff9900 !important;background:#ffffff;border-color:#ff9900}
.eco-follow-amazon .eco-follow-icon{background:#ff9900;color:#fff}
.entry-content .eco-follow-links,
.article .eco-follow-links,
.widget .eco-follow-links,
.author-box .eco-follow-links,
.profile-box .eco-follow-links{
  margin-top:18px;
  margin-bottom:18px;
}
.entry-content .eco-follow-link::after,
.widget .eco-follow-link::after,
.author-box .eco-follow-link::after,
.profile-box .eco-follow-link::after{
  display:none !important;
  content:none !important;
}
@media (max-width:767px){
  .eco-follow-links{gap:10px}
  .eco-follow-link{
    flex:1 1 calc(50% - 10px);
    justify-content:flex-start;
    min-width:calc(50% - 10px);
    padding:8px 12px 8px 8px;
    font-size:13px;
  }
  .eco-follow-icon{
    width:34px;
    height:34px;
    flex-basis:34px;
    font-size:12px;
  }
  .eco-follow-line .eco-follow-icon{font-size:9px}
}
@media (max-width:420px){
  .eco-follow-link{
    flex:1 1 100%;
    min-width:100%;
  }
}

/* 在庫表示・問い合わせフォーム */
.imj-stock-box{
  margin:16px 0 20px;
  padding:14px 16px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
}
.imj-stock-title{
  font-size:18px;
  font-weight:700;
  margin-bottom:10px;
  text-align:right;
}
.imj-stock-list{
  list-style:none;
  margin:0;
  padding:0;
}
.imj-stock-item{
  padding:12px 0;
  border-top:1px solid #eee;
}
.imj-stock-item:first-child{
  border-top:none;
  padding-top:0;
}
.imj-stock-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:start;
}
.imj-stock-left{min-width:0}
.imj-stock-name{
  font-size:15px;
  line-height:1.6;
  font-weight:700;
  word-break:break-word;
}
.imj-stock-meta{
  margin-top:2px;
  font-size:14px;
  line-height:1.6;
  color:#555;
  word-break:break-word;
}
.imj-stock-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  min-width:220px;
}
.imj-stock-value-wrap{text-align:right}
.imj-stock-value{
  font-weight:700;
  font-size:15px;
  line-height:1.5;
}
.imj-stock-item.in .imj-stock-value{
  color:#18794e;
}
.imj-stock-item.low .imj-stock-value{
  color:#b35c00;
}
.imj-stock-item.out .imj-stock-value{
  color:#b42318;
}
.imj-stock-item.unknown .imj-stock-value{
  color:#666;
}
.imj-stock-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
  width:100%;
}
.imj-stock-cart-form{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  margin:0;
}
.imj-cart-qty{
  padding:10px 12px;
  border:1px solid #cfcfcf;
  border-radius:8px;
  font-size:15px;
  line-height:1.4;
  background:#fff;
  min-width:68px;
}
.imj-cart-btn{
  display:inline-block;
  padding:10px 14px;
  border:none;
  border-radius:8px;
  background:#2d6cdf;
  color:#fff;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  cursor:pointer;
  white-space:nowrap;
}
.imj-cart-btn:hover{opacity:.92}
.imj-stock-btn{
  display:inline-block;
  padding:10px 14px;
  border-radius:8px;
  text-decoration:none;
  font-weight:700;
  line-height:1.4;
  border:1px solid transparent;
  text-align:center;
}
.imj-stock-btn.out{
  background:#fff0f0;
  color:#b42318;
  border-color:#efb0b0;
}
.imj-contact-page{margin:8px 0 24px}
.imj-contact-info{
  margin:0 0 20px;
  padding:14px 16px;
  border:1px solid #d8d8d8;
  border-radius:10px;
  background:#fafafa;
}
.imj-contact-info-title{
  font-size:18px;
  font-weight:700;
  margin-bottom:10px;
}
.imj-contact-table{
  width:100%;
  border-collapse:collapse;
}
.imj-contact-table th,
.imj-contact-table td{
  padding:10px;
  border:1px solid #e5e5e5;
  text-align:left;
  vertical-align:top;
  font-size:14px;
  line-height:1.6;
}
.imj-contact-table th{
  width:130px;
  background:#f5f5f5;
}
.imj-contact-form{
  padding:16px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
}
.imj-form-row{margin-bottom:16px}
.imj-form-row label{
  display:block;
  margin-bottom:6px;
  font-weight:700;
  line-height:1.5;
}
.imj-form-row input[type="text"],
.imj-form-row input[type="email"],
.imj-form-row textarea{
  width:100%;
  max-width:100%;
  padding:12px 14px;
  border:1px solid #cfcfcf;
  border-radius:8px;
  font-size:16px;
  line-height:1.5;
  background:#fff;
  box-sizing:border-box;
}
.imj-form-row textarea{
  min-height:180px;
  resize:vertical;
}
.imj-form-submit button{
  display:inline-block;
  padding:12px 18px;
  border:none;
  border-radius:8px;
  font-size:16px;
  font-weight:700;
  line-height:1.4;
  cursor:pointer;
  background:#2d6cdf;
  color:#fff;
}
.req{
  display:inline-block;
  margin-left:6px;
  padding:2px 6px;
  border-radius:999px;
  font-size:12px;
  line-height:1.2;
  background:#fff0f0;
  color:#b42318;
  border:1px solid #efb0b0;
  vertical-align:middle;
}
.imj-form-message{
  margin:0 0 16px;
  padding:12px 14px;
  border-radius:8px;
  font-weight:700;
  line-height:1.6;
}
.imj-form-message.is-success{
  background:#edf9f1;
  color:#18794e;
  border:1px solid #b7e1c3;
}
.imj-form-message.is-error{
  background:#fff3f3;
  color:#b42318;
  border:1px solid #efb0b0;
}

/* /product/ SEO説明ブロック */
.eco-product-seo-intro{
  margin:0 0 28px;
  padding:18px 20px;
  border:1px solid #dfe7df;
  border-radius:12px;
  background:#fbfffb;
  line-height:1.8;
}
.eco-product-seo-intro h1{
  margin:0 0 12px;
  font-size:24px;
  line-height:1.4;
}
.eco-product-seo-intro p{margin:0 0 14px}
.eco-product-seo-intro ul{
  margin:0;
  padding-left:1.2em;
  display:grid;
  gap:6px;
}
.eco-product-seo-intro a{font-weight:700}

@media (max-width:640px){
  .imj-stock-item{padding:14px 0}
  .imj-stock-top{
    grid-template-columns:1fr;
    gap:10px;
  }
  .imj-stock-name{font-size:15px}
  .imj-stock-meta{font-size:13px}
  .imj-stock-side{
    min-width:0;
    width:100%;
    align-items:flex-start;
  }
  .imj-stock-value-wrap{
    width:100%;
    text-align:left;
  }
  .imj-stock-actions{
    justify-content:flex-start;
    width:100%;
  }
  .imj-stock-cart-form{
    width:100%;
    flex-wrap:wrap;
  }
  .imj-cart-qty{
    width:78px;
    min-width:78px;
  }
  .imj-cart-btn,
  .imj-stock-btn{
    flex:1 1 100%;
    width:100%;
    text-align:center;
    box-sizing:border-box;
  }
  .imj-contact-table,
  .imj-contact-table tbody,
  .imj-contact-table tr,
  .imj-contact-table th,
  .imj-contact-table td{
    display:block;
    width:100%;
  }
  .imj-contact-table th{border-bottom:none}
  .imj-contact-table td{border-top:none}
  .eco-product-seo-intro{padding:14px}
  .eco-product-seo-intro h1{font-size:20px}
}


/* =========================================================
   /product/ Cocoonカテゴリー投稿一覧 横型カード
   サムネイル120～140px / タイトル2行 / 抜粋2行
========================================================= */

body.home .entry-card-wrap,
body.archive.category .entry-card-wrap {
  display: block;
  margin-bottom: 14px;
}

body.home .entry-card,
body.archive.category .entry-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 14px;
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(0,0,0,.05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.home .entry-card:hover,
body.archive.category .entry-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,.09);
  border-color: #d6e4c2;
}

body.home .entry-card-thumb,
body.archive.category .entry-card-thumb {
  flex: 0 0 130px;
  width: 130px;
  height: 100px;
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
  background: #f5f5f5;
}

body.home .entry-card-thumb img,
body.archive.category .entry-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}

body.home .entry-card:hover .entry-card-thumb img,
body.archive.category .entry-card:hover .entry-card-thumb img {
  transform: scale(1.04);
}

body.home .entry-card-content,
body.archive.category .entry-card-content {
  flex: 1;
  min-width: 0;
  padding: 0;
}

body.home .entry-card-title,
body.archive.category .entry-card-title {
  margin: 0 0 6px;
  font-size: 16px;
  line-height: 1.45;
  font-weight: 700;
  color: #222;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.home .entry-card-snippet,
body.archive.category .entry-card-snippet {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.6;
  color: #666;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.home .entry-card-meta,
body.archive.category .entry-card-meta,
body.home .post-date,
body.archive.category .post-date {
  font-size: 12px;
  color: #888;
}

/* スマホ */
@media screen and (max-width: 600px) {
  body.home .entry-card,
  body.archive.category .entry-card {
    gap: 10px;
    padding: 10px;
  }

  body.home .entry-card-thumb,
  body.archive.category .entry-card-thumb {
    flex-basis: 110px;
    width: 110px;
    height: 86px;
  }

  body.home .entry-card-title,
  body.archive.category .entry-card-title {
    font-size: 14px;
  }

  body.home .entry-card-snippet,
  body.archive.category .entry-card-snippet {
    font-size: 12px;
  }
}
/* eco-imagine Cocoon 商品一覧カード */
.eco-entry-card-link{
  display:block;
  color:inherit;
  text-decoration:none;
  margin-bottom:14px;
}

.eco-entry-card{
  display:flex;
  align-items:center;
  gap:18px;
  padding:14px;
  background:#fff;
  border:1px solid #e7e7e7;
  border-radius:12px;
  box-shadow:0 4px 14px rgba(0,0,0,.05);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.eco-entry-card-link:hover .eco-entry-card{
  transform:translateY(-2px);
  box-shadow:0 9px 22px rgba(0,0,0,.08);
  border-color:#d8e7c8;
}

.eco-entry-thumb{
  flex:0 0 130px;
  width:130px;
  height:130px;
  overflow:hidden;
  border-radius:12px;
  background:#f7f7f7;
}

.eco-entry-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .25s ease;
}

.eco-entry-card-link:hover .eco-entry-thumb img{
  transform:scale(1.05);
}

.eco-entry-body{
  flex:1;
  min-width:0;
}

.eco-entry-cat{
  display:inline-block;
  margin:0 0 6px;
  padding:2px 9px;
  border-radius:999px;
  background:#eef5df;
  color:#557318;
  font-size:12px;
  font-weight:700;
}

.eco-entry-title{
  margin:0 0 6px;
  font-size:16px;
  line-height:1.45;
  font-weight:700;
  color:#222;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.eco-entry-snippet{
  margin:0;
  font-size:13px;
  line-height:1.65;
  color:#555;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

@media screen and (max-width:600px){
  .eco-entry-card{
    gap:12px;
    padding:10px;
  }

  .eco-entry-thumb{
    flex:0 0 92px;
    width:92px;
    height:92px;
  }

  .eco-entry-title{
    font-size:14px;
  }

  .eco-entry-snippet,
  .eco-entry-cat{
    font-size:12px;
  }
}

/* =========================================================
   商品一覧：画像左上カテゴリーラベルを見やすく
========================================================= */

body.archive.category .cat-label {
  background: var(--accent-dark) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  padding: 5px 10px !important;
  border-radius: 4px !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.archive.category .cat-label a {
  color: #ffffff !important;
  text-decoration: none !important;
}

.eco-clay-page {
  --clay-green: #426d57;
  --clay-green-dark: #2f5140;
  --clay-green-soft: #eef5f0;
  --clay-cream: #fbf8f0;
  --clay-gold: #b9873d;
  --clay-red: #a34b43;
  --clay-text: #333;
  --clay-muted: #666;
  --clay-border: #d8e2da;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  color: var(--clay-text);
  font-size: 16px;
  line-height: 1.85;
}
.eco-clay-page *,
.eco-clay-page *::before,
.eco-clay-page *::after {
  box-sizing: border-box;
}
.eco-clay-page img {
  max-width: 100%;
  height: auto;
}
.eco-clay-page h2,
.eco-clay-page h3,
.eco-clay-page h4 {
  line-height: 1.5;
}
.eco-clay-page p {
  margin: 0 0 1em;
}

.eco-clay-page .recipe-ingredients {
  padding: 14px 16px;
  border-radius: 7px;
  background: var(--clay-cream);
}
.eco-clay-page .recipe-ingredients ul {
  margin: 0;
  padding-left: 1.4em;
}
.eco-clay-page .recipe-note,
.eco-clay-page .recipe-warning {
  margin-top: 16px;
  padding: 13px 15px;
  border-left: 4px solid var(--clay-gold);
  background: #fffaf0;
}
.eco-clay-page .recipe-frequency,
.eco-clay-page .recipe-batch {
  font-weight: 700;
}


/* スマートフォン */
@media screen and (max-width: 700px) {
  .eco-clay-page {
    font-size: 15px;
  }
}

/* =========================================================
   商品カテゴリーカード画像
   切り抜かず、画像全体を上下左右中央に表示
   [eco_product_categories mode="cards"]
========================================================= */

body.page .card-grid .product-thumb {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #fff !important;
}

body.page .card-grid .product-thumb img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

body.page .card-grid .product-card:hover .product-thumb img {
  transform: none !important;
}
.calophyllum-product {
  color: #333;
  line-height: 1.8;
}

.calophyllum-product *,
.calophyllum-product *::before,
.calophyllum-product *::after {
  box-sizing: border-box;
}

.calophyllum-product .product-header {
  margin-bottom: 32px;
  padding: 24px;
  border: 1px solid #d8e2da;
  border-radius: 8px;
  background: #f6f9f6;
}

.calophyllum-product .product-header h1 {
  margin: 0 0 8px;
  color: #2f5140;
  font-size: 1.6em;
  line-height: 1.5;
}

.calophyllum-product .product-type {
  margin: 0 0 6px;
  font-weight: 600;
}

.calophyllum-product .product-price {
  margin: 0;
  color: #8b352c;
  font-size: 1.15em;
  font-weight: 700;
}

.calophyllum-product section {
  margin: 0 0 36px;
}

.calophyllum-product section h2 {
  margin: 0 0 18px;
  padding: 10px 14px;
  border-left: 5px solid #426d57;
  background: #eef5f0;
  color: #2f5140;
  font-size: 1.25em;
}

.calophyllum-product .product-features p {
  margin: 0 0 20px;
}

.calophyllum-product .product-features small {
  display: inline-block;
  margin-top: 5px;
  font-size: 0.9em;
}

.calophyllum-product .product-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.calophyllum-product .product-spec-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
}

.calophyllum-product .product-spec-table th,
.calophyllum-product .product-spec-table td {
  padding: 11px 14px;
  border: 1px solid #d8e2da;
  text-align: left;
  vertical-align: top;
}

.calophyllum-product .product-spec-table th {
  width: 30%;
  min-width: 130px;
  background: #f3f7f4;
  color: #2f5140;
  font-weight: 600;
}

.calophyllum-product .product-caution {
  padding: 20px;
  border: 1px solid #e2d6c6;
  border-radius: 8px;
  background: #fffaf3;
}

.calophyllum-product .product-caution h2 {
  margin-bottom: 14px;
  border-left-color: #b9873d;
  background: transparent;
  color: #59452c;
}

.calophyllum-product .product-caution p {
  margin: 0;
}

@media (max-width: 600px) {
  .calophyllum-product .product-header {
    padding: 18px 16px;
  }

  .calophyllum-product .product-header h1 {
    font-size: 1.35em;
  }

  .calophyllum-product .product-spec-table th,
  .calophyllum-product .product-spec-table td {
    padding: 9px 10px;
    font-size: 0.94em;
  }

  .calophyllum-product .product-spec-table th {
    width: 35%;
    min-width: 105px;
  }

  .calophyllum-product .product-caution {
    padding: 16px;
  }
}

/* =========================================================
   いまじん 商品詳細ページ 共通CSS
   2026年 最終整理版
   対象: .eco-product-page 内のみ
   ========================================================= */


/* =========================================================
   1. 基本設定
   ========================================================= */

.eco-product-page{
  --eco-green:#426d57;
  --eco-green-dark:#2f5140;
  --eco-green-soft:#eef5f0;
  --eco-cream:#fbf8f0;
  --eco-gold:#b9873d;
  --eco-red:#a34b43;
  --eco-text:#333333;
  --eco-muted:#666666;
  --eco-border:#d8e2da;

  width:100%;
  max-width:100%;
  margin:0;
  padding:0 4px 48px;

  color:var(--eco-text);
  font-size:16px;
  line-height:1.85;
}

.eco-product-page *,
.eco-product-page *::before,
.eco-product-page *::after{
  box-sizing:border-box;
}

.eco-product-page h1,
.eco-product-page h2,
.eco-product-page h3,
.eco-product-page h4{
  line-height:1.45;
}

.eco-product-page p{
  margin:0 0 1em;
}

.eco-product-page img{
  display:block;
  max-width:100%;
  height:auto;
}

.eco-product-page a{
  text-underline-offset:3px;
}


/* =========================================================
   2. 商品概要
   ========================================================= */

.eco-product-page .eco-product-header{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);
  column-gap:34px;

  margin:0 0 40px;
  padding:32px 28px;

  background:linear-gradient(
    135deg,
    var(--eco-green-soft),
    var(--eco-cream)
  );

  border:1px solid var(--eco-border);
  border-radius:18px;
}


/* 商品タイトル */

.eco-product-page .eco-product-title{
  grid-column:1 / -1;

  margin:0 0 20px;
  padding:0 0 15px;

  border-bottom:3px solid var(--eco-green);

  color:var(--eco-green-dark);
  font-size:clamp(1.55rem,3vw,2rem);
  font-weight:700;
}


/* 英名 */

.eco-product-page .eco-en-name{
  grid-column:1;

  display:block;

  margin:0 0 4px;

  color:var(--eco-green-dark);
  font-size:1.05rem;
  font-weight:700;
}


/* 成分・販売名など */

.eco-product-page .eco-product-meta{
  grid-column:1;

  margin:0 0 18px;

  color:var(--eco-muted);
  font-size:.93rem;
  line-height:1.7;
}


/* 商品説明本文 */

.eco-product-page .eco-product-header > p{
  grid-column:1;
}


/* メイン商品画像 */

.eco-product-page .eco-main-image{
  grid-column:2;
  grid-row:2 / span 7;

  display:flex;
  align-items:center;
  justify-content:center;

  margin:0;
  padding:18px;

  background:rgba(255,255,255,.85);
  border-radius:14px;
}

.eco-product-page .eco-main-image img{
  width:300px;
  max-width:100%;
  margin:auto;
  object-fit:contain;
}


/* =========================================================
   3. 共通セクション
   ========================================================= */

.eco-product-page .eco-section{
  margin:0 0 44px;
}

.eco-product-page .eco-section-title{
  margin:0 0 20px;
  padding:10px 14px;

  background:var(--eco-green-soft);
  border-left:5px solid var(--eco-green);

  color:var(--eco-green-dark);
  font-size:clamp(1.25rem,2.4vw,1.55rem);
  font-weight:700;
}

.eco-product-page .eco-subtitle{
  margin:25px 0 12px;
  padding:0 0 8px;

  border-bottom:2px solid var(--eco-border);

  color:var(--eco-green-dark);
  font-size:1.08rem;
  font-weight:700;
}


/* =========================================================
   4. 特長・用途カード
   ========================================================= */

.eco-product-page [data-imagine-qa-section="features"]{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.eco-product-page
[data-imagine-qa-section="features"]
.eco-section-title{
  grid-column:1 / -1;
}

.eco-product-page .eco-role-card{
  height:100%;
  margin:0;
  padding:22px;

  background:#ffffff;
  border:1px solid var(--eco-border);
  border-radius:14px;
}

.eco-product-page .eco-role-card h3{
  margin:0 0 10px;

  color:var(--eco-green-dark);
  font-size:1.1rem;
}

.eco-product-page .eco-role-card p:last-child{
  margin-bottom:0;
}


/* =========================================================
   5. 表
   ========================================================= */

.eco-product-page .eco-table-wrap{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.eco-product-page .eco-table{
  width:100%;
  margin:0;

  border-collapse:collapse;
  border-spacing:0;

  background:#ffffff;
}

.eco-product-page .eco-table th,
.eco-product-page .eco-table td{
  padding:12px 14px;

  border:1px solid var(--eco-border);

  text-align:left;
  vertical-align:top;
  line-height:1.7;
}

.eco-product-page .eco-table th{
  background:var(--eco-green-soft);

  color:var(--eco-green-dark);
  font-weight:700;
}

.eco-product-page .eco-spec-table th{
  width:28%;
}


/* =========================================================
   6. 注意・補足
   ========================================================= */

.eco-product-page .eco-important{
  margin:16px 0 0;
  padding:15px 17px;

  background:#fffaf0;

  border:1px solid #e6d6c1;
  border-left:4px solid var(--eco-gold);
  border-radius:8px;
}

.eco-product-page .eco-note{
  margin:16px 0 0;
  padding:14px 16px;

  background:#fffaf0;

  border-left:4px solid var(--eco-gold);

  color:#555555;
  font-size:.93rem;
  line-height:1.75;
}


/* =========================================================
   7. 使用方法・配合量
   ========================================================= */

.eco-product-page .eco-use-heading{
  display:inline-block;

  margin:20px 0 10px;
  padding:4px 12px;

  background:var(--eco-green-soft);
  border-radius:999px;

  color:var(--eco-green-dark);
  font-weight:700;
}

.eco-product-page
.eco-section-title + .eco-use-heading{
  margin-top:0;
}

.eco-product-page .eco-percent-list{
  margin:10px 0 18px;
  padding:14px 18px 14px 38px;

  background:var(--eco-cream);
  border-radius:10px;
}

.eco-product-page .eco-percent-list li{
  margin:4px 0;
}


/* =========================================================
   8. レシピ
   ========================================================= */

.eco-product-page .eco-recipe{
  margin:0 0 24px;
  padding:22px;

  background:#ffffff;

  border:1px solid var(--eco-border);
  border-radius:14px;
}

.eco-product-page .eco-recipe:last-child{
  margin-bottom:0;
}

.eco-product-page
.eco-recipe > h3:first-child{
  margin:0 0 15px;
  padding:0 0 10px;

  border-bottom:2px solid var(--eco-border);

  color:var(--eco-green-dark);
  font-size:1.18rem;
}

.eco-product-page .eco-recipe ol{
  margin:0;
  padding-left:1.6em;
}

.eco-product-page .eco-recipe ol li{
  margin:5px 0;
}


/* 植物名・材料タグ */

.eco-product-page .eco-herbs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;

  margin-top:10px;
}

.eco-product-page .eco-herbs span{
  display:inline-block;

  padding:5px 11px;

  background:var(--eco-green-soft);

  border:1px solid var(--eco-border);
  border-radius:999px;

  color:var(--eco-green-dark);
  font-size:.9rem;
}


/* =========================================================
   9. 商品購入カート 共通完成版
   /product/ 商品詳細ページ共通
   PC：最大3列  / スマートフォン：1列
   ========================================================= */

.eco-product-page .eco-products{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:stretch;
  justify-content:flex-start;

  width:100%;
  max-width:100%;

  gap:18px;

  margin:0;
  padding:0;
}

/* 各商品カード：PC最大3列 */
.eco-product-page .eco-products > .eco-product-card{
  display:flex;
  flex-direction:column;

  flex:0 0 calc((100% - 36px) / 3);
  width:calc((100% - 36px) / 3);
  max-width:calc((100% - 36px) / 3);
  min-width:0;
  height:auto;

  margin:0;
  padding:20px 16px;

  grid-column:auto;
  grid-row:auto;
  grid-area:auto;

  float:none;
  clear:none;

  background:#ffffff;

  border:1px solid var(--eco-border);
  border-radius:14px;

  text-align:center;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

/* 1商品の場合 */
.eco-product-page .eco-products > .eco-product-card:only-child{
  flex-basis:100%;
  width:100%;
  max-width:520px;
  margin-left:auto;
  margin-right:auto;
}

/* 2商品の場合 */
.eco-product-page .eco-products > .eco-product-card:first-child:nth-last-child(2),
.eco-product-page .eco-products > .eco-product-card:first-child:nth-last-child(2) ~ .eco-product-card{
  flex-basis:calc((100% - 18px) / 2);
  width:calc((100% - 18px) / 2);
  max-width:calc((100% - 18px) / 2);
}

.eco-product-page .eco-product-card:hover{
  border-color:var(--eco-green);
  box-shadow:0 7px 20px rgba(47,81,64,.10);
  transform:translateY(-2px);
}

.eco-product-page .eco-product-card h3{
  margin:0 0 12px;
  color:var(--eco-green-dark);
  font-size:1.16rem;
}

/* 商品画像 */
.eco-product-page .eco-card-image{
  display:flex;
  align-items:center;
  justify-content:center;

  width:100%;
  height:210px;

  margin:0 0 12px;
  overflow:hidden;
}

.eco-product-page .eco-card-image img{
  display:block;
  width:auto;
  height:auto;
  max-width:200px;
  max-height:200px;
  margin:auto;
  object-fit:contain;
  object-position:center center;
}

/* 商品コード */
.eco-product-page .eco-sku{
  margin:0 0 4px;
  color:var(--eco-muted);
  font-size:.88rem;
  line-height:1.5;
}

/* 商品名・容量 */
.eco-product-page .eco-capacity{
  min-height:52px;
  margin:0 0 5px;
  font-weight:700;
  line-height:1.6;
}

/* 価格 */
.eco-product-page .eco-price{
  margin:5px 0 11px;
  color:#a3312a;
  font-size:1.25rem;
  font-weight:700;
}

/* 配送情報 */
.eco-product-page .eco-delivery{
  display:flex;
  align-items:center;
  justify-content:center;

  min-height:58px;
  margin:0 0 14px;
  padding:8px 9px;

  background:var(--eco-green-soft);
  border-radius:8px;

  color:var(--eco-green-dark);
  font-size:.88rem;
  line-height:1.55;
}

.eco-product-page .eco-delivery:empty{
  visibility:hidden;
}

/* カート */
.eco-product-page .eco-cart{
  width:100%;
  margin-top:auto;
  margin-bottom:0;
}

/* 数量 */
.eco-product-page .eco-cart label{
  display:block;
  margin:0 0 6px;
  font-size:.9rem;
  font-weight:700;
  text-align:center;
}

.eco-product-page .eco-cart select{
  display:block;
  width:100%;
  max-width:100%;
  min-width:75px;
  margin:0 auto;
  padding:9px 10px;

  background:#ffffff;
  border:1px solid #aaaaaa;
  border-radius:6px;

  font-size:16px;
}

/* 画像型カートボタン */
.eco-product-page .eco-cart input[type="image"]{
  display:block;
  width:auto;
  max-width:190px;
  height:auto;
  margin:14px auto 0;
  padding:0;
  border:0;
}

/* 通常button・submit型にも対応 */
.eco-product-page .eco-cart button,
.eco-product-page .eco-cart input[type="submit"]{
  display:block;
  min-width:160px;
  margin:14px auto 0;
  padding:10px 18px;

  background:var(--eco-green-dark);
  border:0;
  border-radius:6px;

  color:#ffffff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}

.eco-product-page .eco-cart button:hover,
.eco-product-page .eco-cart input[type="submit"]:hover{
  opacity:.9;
}







/* スマートフォン：1列 */
@media screen and (max-width:600px){
  .eco-product-page .eco-products{
    flex-direction:column;
    flex-wrap:nowrap;
    gap:16px;
  }

  .eco-product-page .eco-products > .eco-product-card,
  .eco-product-page .eco-products > .eco-product-card:first-child:nth-last-child(2),
  .eco-product-page .eco-products > .eco-product-card:first-child:nth-last-child(2) ~ .eco-product-card,
  .eco-product-page .eco-products > .eco-product-card:only-child{
    flex:none;
    width:100%;
    max-width:470px;
    margin:0 auto;
    padding:20px 15px;
  }

  .eco-product-page .eco-card-image{
    height:auto;
    min-height:190px;
  }

  .eco-product-page .eco-capacity,
  .eco-product-page .eco-delivery{
    min-height:0;
  }
}

/* =========================================================
   10. FAQ
   HTML構造:
   section.eco-faq > details.faq-item
   ========================================================= */

.eco-product-page .eco-faq{
  margin:0 0 44px;
}

.eco-product-page .eco-faq .faq-item{
  margin:0 0 12px;
  overflow:hidden;
  background:#ffffff;
  border:1px solid var(--eco-border);
  border-radius:10px;
}

.eco-product-page .eco-faq .faq-item:last-child{
  margin-bottom:0;
}

.eco-product-page .eco-faq .faq-item summary{
  position:relative;
  display:block;
  padding:15px 46px 15px 17px;
  color:var(--eco-green-dark);
  font-weight:700;
  line-height:1.6;
  cursor:pointer;
  list-style:none;
}

.eco-product-page .eco-faq .faq-item summary::-webkit-details-marker{
  display:none;
}

.eco-product-page .eco-faq .faq-item summary::after{
  position:absolute;
  top:50%;
  right:17px;
  content:"＋";
  color:var(--eco-green);
  font-size:1.15rem;
  font-weight:700;
  transform:translateY(-50%);
}

.eco-product-page .eco-faq .faq-item[open] summary::after{
  content:"－";
}

.eco-product-page .eco-faq .faq-item[open] summary{
  background:var(--eco-green-soft);
}

.eco-product-page .eco-faq-answer{
  padding:14px 17px 17px;
  border-top:1px solid var(--eco-border);
  background:#ffffff;
}

.eco-product-page .eco-faq-answer p:last-child{
  margin-bottom:0;
}


/* =========================================================
   11. 商品・会社情報
   ========================================================= */

.eco-product-page .eco-company dl{
  display:grid;
  grid-template-columns:155px minmax(0,1fr);

  margin:0;

  border-top:1px solid var(--eco-border);
}

.eco-product-page .eco-company dt,
.eco-product-page .eco-company dd{
  margin:0;
  padding:11px 13px;

  border-bottom:1px solid var(--eco-border);
}

.eco-product-page .eco-company dt{
  background:var(--eco-green-soft);

  color:var(--eco-green-dark);
  font-weight:700;
}

.eco-product-page .eco-company a{
  color:var(--eco-green-dark);

  font-weight:700;

  text-decoration:underline;
  text-underline-offset:3px;
}


/* =========================================================
   12. タブレット
   ========================================================= */

@media screen and (max-width:900px){

  .eco-product-page .eco-product-header{
    grid-template-columns:
      minmax(0,1.15fr)
      minmax(220px,.85fr);

    column-gap:24px;

    padding:26px 22px;
  }


}


/* =========================================================
   13. スマートフォン
   ========================================================= */

@media screen and (max-width:600px){

  .eco-product-page{
    padding:0 2px 35px;

    font-size:15px;
  }


  /* 商品概要 */

  .eco-product-page .eco-product-header{
    display:block;

    margin-bottom:30px;
    padding:24px 17px;
  }

  .eco-product-page .eco-product-title{
    font-size:1.4rem;
  }

  .eco-product-page .eco-main-image{
    margin:20px auto 0;
    padding:10px;
  }

  .eco-product-page .eco-main-image img{
    width:250px;
  }


  /* セクション */

  .eco-product-page .eco-section{
    margin-bottom:34px;
  }

  .eco-product-page .eco-section-title{
    margin-bottom:16px;
    font-size:1.18rem;
  }


  /* 特長・用途カードは1列 */

  .eco-product-page
  [data-imagine-qa-section="features"]{
    display:block;
  }

  .eco-product-page .eco-role-card{
    margin-bottom:12px;
    padding:16px;
  }

  .eco-product-page .eco-role-card:last-child{
    margin-bottom:0;
  }


  /* 仕様表はスマホで縦型 */

  .eco-product-page .eco-spec-table,
  .eco-product-page .eco-spec-table tbody,
  .eco-product-page .eco-spec-table tr,
  .eco-product-page .eco-spec-table th,
  .eco-product-page .eco-spec-table td{
    display:block;
    width:100%;
  }

  .eco-product-page .eco-spec-table tr{
    margin-bottom:10px;
  }

  .eco-product-page .eco-spec-table th{
    padding:9px 11px;

    border-bottom:0;
  }

  .eco-product-page .eco-spec-table td{
    padding:10px 11px;
  }


  /* 比較表・レシピ表は横スクロール */

  .eco-product-page
  .eco-table:not(.eco-spec-table){
    min-width:520px;
  }


  /* レシピ */

  .eco-product-page .eco-recipe{
    padding:18px 14px;
  }



  /* FAQ */

  .eco-product-page .eco-faq .faq-item summary{
    padding:13px 42px 13px 14px;
  }

  .eco-product-page .eco-faq-answer{
    padding:13px 14px 15px;
  }


  /* 商品・会社情報 */

  .eco-product-page .eco-company dl{
    display:block;

    border-top:0;
  }

  .eco-product-page .eco-company dt{
    padding:9px 11px;

    border:1px solid var(--eco-border);
    border-bottom:0;
  }

  .eco-product-page .eco-company dd{
    margin-bottom:10px;
    padding:10px 11px;

    border:1px solid var(--eco-border);
  }

}


/* =========================================================
   14. 小さいスマートフォン
   ========================================================= */

@media screen and (max-width:420px){

  .eco-product-page .eco-product-title{
    font-size:1.27rem;
  }

  .eco-product-page .eco-main-image img{
    width:220px;
  }

  .eco-product-page
  .eco-table:not(.eco-spec-table){
    min-width:470px;
  }

}


/* =========================================================
   15. アニメーション軽減設定
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  .eco-product-page .eco-product-card{
    transition:none;
  }

  .eco-product-page .eco-product-card:hover{
    transform:none;
  }

}

/* =========================================================
   いまじん商品ページ × Cocoon レイアウト保護
   PCではCocoon本来の本文＋サイドバーを維持
   ========================================================= */

.eco-product-page{
  min-width:0;
  box-sizing:border-box;
}

.eco-product-page .eco-products,
.eco-product-page .eco-product-grid,
.eco-product-page .eco-table-wrap,
.eco-product-page .eco-product-header{
  max-width:100%;
  min-width:0;
}

/* Cocoonの #main / #sidebar / .content-in は商品CSSから変更しない */