@charset "UTF-8";
/* 全体コンテナ：細いゴールドの丸角枠線を再現 */
.bbq-section-card {
    max-width: 1000px;
    margin: 230px auto 140px;
    background-color: #000000;
    color: #ffffff;
    border: 1px solid #d4b26f;
    border-radius: 30px;
    position: relative;
    box-sizing: border-box;
    padding-bottom: 30px;
}

.bbq-section-card img {
  max-width: 100%;
  height: auto;
  display: block;
  margin-inline: auto;
}

/* 1. 最上部：アーチ状の突起部分 */
.bbq-top-arch {
    z-index: 0;
    width: 380px;
    aspect-ratio: 1;
    background-color: #000000;
    border-radius: 100%;
    position: absolute;
    top: -140px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.bbq-top-icon {
  position: absolute;
  top: 70px;
}
.bbq-section-card#card2 .bbq-top-icon {
  top:20px;
}
.bbq-section-card#card2 .bbq-title-main {
  margin-top:60px;
}

/* インナーボディ（余白調整） */
.bbq-inner-body {
  padding: 30px 25px 10px;
}

/* 2. キャッチコピー：明朝ゴールド */
.bbq-title-main {
  text-align: center;
  
   /* 少し白みの入った上品なゴールド */
  margin: 30px 0;
  letter-spacing: 0.03em;
  position: relative;
}

.bbq-title-main span {
  font-size: 38px;
  margin: 0 2px;
}

/* 3. メイン画像まわり */
.bbq-main-preview {
  position: relative;
  margin-bottom: 0;
  margin-inline: auto;
  text-align: center;
}

.bbq-img-note {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 9px;
  font-family: sans-serif;
  color: #ffffff;
  opacity: 0.6;
}

/* 4. 商品紹介バナー（白背景・丸角） */
.bbq-intro-banner {
  background-color: #f3ebd4; /* 若干生成りがかった白 */
  color: #111111;
  border-radius: 70px;
  padding: 15px 15px 15px 95px;
  position: relative;
  min-height: 70px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  max-width: 880px;
  margin-inline: auto;
  margin-top: -20px;
}

/* 左側の三重丸バッジを再現 */
.bbq-badge-gold-circle {
  position: absolute;
  left: -40px;
  top: 50%;
  transform: translateY(-50%);
  /* width: 84px; */
  /* height: 84px; */
  /* background-color: #000000; */
  /* border: 1px solid #d4b26f; */
  /* border-radius: 50%; */
  /* box-shadow: 0 0 0 3px #000000, 0 0 0 4px #d4b26f; */ /* 重なる直線をシャドウで表現 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* color: #ebd197; */
  z-index: 2;
  /* margin: -30px; */
  max-width: 170px;
}

.bbq-badge-gold-circle .en {
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
}

.bbq-badge-gold-circle .ja {
  font-size: 11px;
  margin-top: 2px;
}

.bbq-intro-desc {
  font-size: 26px;
  line-height: 1.6;
  font-weight: bold;
  margin: 0;
  padding-left: 50px;
}

/* 5. 商品内容エリア */
.bbq-contents-grid {
  display: flex;
  gap: 15px;
  margin: 35px 0;
  align-items: stretch;
}

.bbq-package-thumb {
  flex: 1.1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* テーブルを包む台紙 */
.bbq-spec-container {
  flex: 0.9;
  background-color: #faf8f2;
  color: #222222;
  padding: 20px;
  box-sizing: border-box;
  max-width: 422px;
  margin-block: auto;
}

/* セット内容のリボン（両端のカットをCSSで再現） */
.bbq-ribbon-title {
  background: url(https://gigaplus.makeshop.jp/nanchiku/image/category/bbq2026/set_ttl.png)no-repeat center;
  /* color: #ffffff; */
  text-align: center;
  font-size: 26px;
  padding: 8px 0;
  margin: 0 auto;
  position: relative;
  font-weight: bold;
  margin-top: -44px;
  margin-bottom: 20px;
}


/* 内訳テーブルの罫線と文字サイズ */
.bbq-table-details {
  width: 100%;
  border-collapse: collapse;
}

.bbq-table-details th,
.bbq-table-details td {
  font-size: 20px;
  padding: 20px 2px 14px;
  border-bottom: 1px solid #dcd3b8;
}

.bbq-table-details th {
  text-align: left;
  font-weight: normal;
  padding-left: 20px;
}

.bbq-table-details td {
  text-align: right;
  padding-right: 20px;
  font-weight: normal;
}

.bbq-table-details tr:last-child th,
.bbq-table-details tr:last-child td {
  border-bottom: none;
}

/* 6. 購入エリア（金額・ボタン） */
.bbq-action-container {
    border: 4px solid transparent;
    border-radius: 90px;
    background:
    linear-gradient(#4d0e09, #4d0e09) padding-box,
    linear-gradient(180deg, #e6cc61 0%, #c8a537 100%) border-box;
    padding: 17px 25px;
    display: flex;
    justify-content: center;
    gap: 30px;
    align-items: center;
    max-width: 800px;
    margin-inline: auto;
}

/* 金額：明朝体のシャープな数字 */
.bbq-price-zone {
  color: #ebd197;
  display: flex;
  align-items: baseline;
  font-size: 94px;
}

.bbq-price-zone .num {
    font-size: 100%;
    font-weight: 500;
    line-height: 1.2;
    background: linear-gradient(
    0deg,
    #caa12e 12%,
    #e7ce63 100%
  );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.bbq-price-zone .unit {
    font-size: 56%;
    font-weight: bold;
    margin-left: 2px;
    position: relative;
    background: linear-gradient(
    0deg,
    #caa12e 12%,
    #e7ce63 100%
  );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.bbq-price-zone .tax {
    font-size: 25%;
    font-weight: normal;
    position: absolute;
    top: -5%;
    left: -2.5%;
    background: linear-gradient(
    0deg,
    #caa12e 12%,
    #e7ce63 100%
  );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
/* ボタンまわり */
.bbq-btn-zone {
  text-align: center;
}

.bbq-btn-zone .label {
  font-size: 26px;
  color: #ebd197;
  display: block;
  margin-bottom: 14px;
  letter-spacing: 0.05em;
  background: linear-gradient(
    0deg,
    #caa12e 12%,
    #e7ce63 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/* 鮮やかな赤の立体的なオーバルボタン */
.bbq-red-btn {
  display: block;
  background: #ff0000;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 22px;
  padding: 6px 0;
  border-radius: 40px;
  width: 330px;
  font-weight: normal;
}


/* グリッドセクション全体 */
.bbq-products-grid-section {
  max-width: 1080px;
  margin: 40px auto;
  padding: 0 20px;
  box-sizing: border-box;
}
.bbq-pickup-ttl{
  text-align:center;
  margin-bottom:40px;
}

/* 商品を並べるコンテナ（3列、スマホ時は自動調整） */
.bbq-grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px 24px;
}

/* タブレット・横長スマホ対応 */
@media (max-width: 900px) {
  .bbq-grid-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* スマホ対応 */
@media (max-width: 480px) {
  .bbq-grid-container {
    grid-template-columns: 1fr;
    max-width: 320px;
    margin: 0 auto;
  }
}

/* 商品カード個別のスタイル */
.bbq-grid-card {
  background-color: #000000;
  /* border: 1px solid #d4b26f; */
  border-radius: 30px;
  overflow: hidden; /* 角丸からはみ出る背景をカット */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
}

/* カード上部（黒背景エリア） */
.bbq-card-top {
  padding: 30px 30px 15px;
  text-align: center;
  flex-grow: 1;
}

.bbq-item-img {
  width: 100%;
  margin-bottom: 16px;
}

.bbq-item-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* 明朝体の商品名 */
.bbq-item-name {
  color: #ffffff;
  font-size: 24px;
  line-height: 1.4;
  font-weight: normal;
  margin: 0 0 8px 0;
  /* height: 44px; */ /* 行数によるズレを防ぐため高さを固定 */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* グラム数（英語フォント風） */
.bbq-item-weight {
  color: #ffffff;
  font-size: 27px;
  margin: 0;
}

/* カード下部（茶色背景・金額エリア） */
.bbq-card-bottom {
  background-color: #4d0e09; /* 濃い赤茶色 */
  border-top: 4px solid #d4b26f;
  text-align: center;
}

/* 金額のフォント表示 */
.bbq-card-price { 
  color: #ebd197;
  font-size:62px;
  padding: 12px 0 8px;
  display: flex;
  align-items: baseline;
  justify-content: center;
}

.bbq-card-price .num {
  font-size: 62px;
  font-weight: 500;
  line-height: 1.2;
  background: linear-gradient(0deg, #caa12e 12%, #e7ce63 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.bbq-card-price .unit {
  font-size: 35px;
  margin-left: 2px;
  font-weight: bold;
  position: relative;
  background: linear-gradient(0deg, #caa12e 12%, #e7ce63 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.bbq-card-price .tax {
  font-size: 10px;
  font-weight: normal;
  position: absolute;
  top: -7px;
  left: 4px;
  white-space: nowrap;
  background: linear-gradient(0deg, #caa12e 12%, #e7ce63 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/* 下部ベタ塗りの赤い「商品を見る」ボタン */
.bbq-card-btn {
  display: block;
  background-color: #ff0000;
  color: #ffffff;
  text-decoration: none;
  font-size: 22px;
  padding: 10px 0;
  border-top: 1px solid #ff3333; /* ボタン上部にわずかなハイライト */
}

.bbq-card-btn:hover {
  background-color: #e60000;
}


/* セクション全体：背景画像を敷くコンテナ */
.bbq-intro-image-section {
  max-width: 1000px; /* 画像の本来の横幅に合わせてください */
  margin: 80px auto;
  box-sizing: border-box;
  padding: 0; /* 画面が縮んだときの最低限の左右余白 */
  margin-inline: -2vw !important;
}
.bbq-recommend-title{
  text-align:center;
}

/* 改行コントロール */
.pc-only {
  display: inline;
}
@media (max-width: 640px) {
  .pc-only { display: none; }
}

/* 背景画像を適用するエリア */
.bbq-intro-bg-container {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  color: #ffffff;
  
  /* 1枚の背景画像を美しくフィットさせる設定 */
  background-image: url(https://gigaplus.makeshop.jp/nanchiku/image/category/bbq2026/omoide_bg.png); /* スライスした背景画像のパス */
  background-repeat: no-repeat;
  background-position: center top;

  /* 画像内の黒いエリアの中に文字が綺麗に収まるよう、内側余白をパーセントで調整（レスポンシブ対応） */
  padding-top: 25%;    /* 上のイラストとツノの隙間に合わせる */
  padding-bottom: 25%; /* 下のイラストに被らないようにする */
  padding-inline: 15%; /* 左右のくびれ部分からはみ出さないガード */
}


/* ==========================================
   テキストスタイリング
   ========================================== */
.bbq-blob-title {
  margin: 0 0 6% 0;
}

.bbq-blob-text-wrap {
  font-size: 20px;
  line-height: 2.2;
  letter-spacing: 0.03em;
}
.bbq-blob-text-wrap p {
  margin: 0 0 3% 0;
}
.bbq-blob-text-wrap p:last-child {
  margin-bottom: 0;
}

/* レスポンシブで文字サイズを画像に比例させる（タブレット・スマホ対応） */
@media (max-width: 768px) {
  .bbq-blob-text-wrap {
    font-size: 16px;
    line-height: 2;
  }
  .bbq-intro-bg-container {
    aspect-ratio: 333/314;
    background-size: cover;
    padding-top: 30%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
  }
}

/* 金額の数字部分のCSS例 */
.bbq-section-card,
.bbq-products-grid-section,
.bbq-intro-image-section {
  font-family: "Zen Old Mincho", "Georgia", "YuMincho", "Hiragino Mincho ProN", serif;
  font-weight: 500; /* Zenオールド明朝の絶妙な太さ（ミディアム）に合わせる場合 */
  line-height: 1.2;
}
@media screen and (max-width: 940px) {
  .bbq-action-container {
    display: block;
    max-width: 300px;
    padding: 8px 20px 10px;
    border-width: 2px;
    border-radius: 999px;
    text-align: center;
  }
  .bbq-price-zone {
    justify-content: center;
    font-size: 43px;
  }

  .bbq-price-zone .unit {
    font-size: 45%;
  }

  .bbq-price-zone .tax {
    font-size: 34%;
    top: -11%;
    left: 0;
    white-space: nowrap;
  }

  .bbq-btn-zone .label {
    font-size: 13px;
    margin-bottom: 4px;
  }

  .bbq-red-btn {
    width: 155px;
    margin: 0 auto;
    padding: 4px 0;
    font-size: 11px;
  }
}

@media (max-width: 900px) {
  .bbq-section-card {
    width: calc(100% - 18px);
    max-width: 500px;
    margin: 58px auto 76px;
    border-radius: 14px;
    border-width: 0;
    padding-bottom: 20px;
  }

  .bbq-top-arch {
    width: 92px;
    top: -34px;
  }

  .bbq-top-icon {
    top: 17px;
    width: 56px;
  }

  .bbq-section-card:nth-child(2) .bbq-top-icon {
    top: 6px!important;
    width: 58px;
  }

  .bbq-section-card:nth-child(2) .bbq-title-main {
    margin-top: 19px!important;
  }

  .bbq-inner-body {
    padding: 16px 16px 8px;
  }

  .bbq-title-main {
    margin: 14px auto 20px;
  }

  .bbq-title-main img {
    max-width: 235px;
  }

  .bbq-main-preview img {
    width: 100%;
    border-radius: 1px;
  }

  .bbq-intro-banner {
    display: block;
    min-height: 0;
    margin: 50px auto 0;
    padding: 44px 18px 16px;
    border-radius: 10px;
    max-width: 300px;
  }

  .bbq-badge-gold-circle {
    left: 50%;
    top: 0;
    width: 74px;
    transform: translate(-50%, -50%);
  }

  .bbq-intro-desc {
    padding-left: 0;
    font-size: 12px;
    line-height: 1.75;
  }

  .bbq-contents-grid {
    display: block;
    margin: 32px auto 24px;
  }

  .bbq-package-thumb {
    margin: 0 auto 24px;
  }

  .bbq-package-thumb img {
    max-width: 92%;
  }

  .bbq-spec-container {
    max-width: 270px;
    margin: 0 auto;
    padding: 14px 12px 10px;
  }

  .bbq-ribbon-title {
    width: 165px;
    background-size: contain;
    font-size: 14px;
    line-height: 1;
    padding: 5px 0 7px;
    margin-top: -30px;
    margin-bottom: 9px;
  }

  .bbq-table-details th,
  .bbq-table-details td {
    font-size: 11px;
    padding: 6px 2px;
  }

  .bbq-table-details th {
    padding-left: 8px;
  }

  .bbq-table-details td {
    padding-right: 8px;
  }

  

  

  .bbq-products-grid-section {
    max-width: 600px;
    margin: 28px auto 58px;
    padding: 0 18px;
  }

  .bbq-pickup-ttl {
    margin-bottom: 18px;
  }

  .bbq-pickup-ttl img {
    max-width: 230px;
  }

  .bbq-grid-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 14px;
    max-width: none;
  }

  .bbq-grid-card {
    border-radius: 14px;
  }

  .bbq-card-top {
    padding: 12px 10px 8px;
  }

  .bbq-item-img {
    margin-bottom: 8px;
  }

  .bbq-item-name {
    min-height: 32px;
    font-size: 10px;
    line-height: 1.45;
    margin-bottom: 3px;
  }

  .bbq-item-weight {
    font-size: 10px;
  }

  .bbq-card-bottom {
    border-top-width: 1px;
  }

  .bbq-card-price {
    padding: 6px 0 4px;
  }

  .bbq-card-price .num {
    font-size: 24px;
  }

  .bbq-card-price .unit {
    font-size: 13px;
  }

  .bbq-card-price .tax {
    font-size: 7px;
    top: -6px;
    left: 1px;
  }

  .bbq-card-btn {
    font-size: 9px;
    padding: 5px 0;
  }

  .bbq-intro-image-section { 
    margin: 52px auto 30px;
    padding: 0;
    margin-left: -2vw !important;
    margin-right: -2vw !important;
  }

  .bbq-intro-bg-container {
    padding-inline: 50px;
    background-image: url(https://gigaplus.makeshop.jp/nanchiku/image/category/bbq2026/omoide_bg_sp.png);
    aspect-ratio: 750 / 1051;
    background-size: contain;
  }

  .bbq-blob-title {
    margin-bottom: 7%;
  }

  .bbq-recommend-title {
    max-width: 360px;
    margin: 0 auto;
    padding: 0 18px;
  }
}


@media screen and (max-width: 480px) {
  .bbq-intro-bg-container {
        background-size: cover;
    }
}

#card2 .bbq-table-details tr:nth-child(2) td{
  text-align:left;
  padding-left:20px;
}

.c-cont-desc.container-in span{
  background: #ffcc00;
}