.pc {
	display: block;
}

.sp {
	display: none;
}

#banner {
	position: fixed;
	bottom: 8%;
	right: 0;
	z-index: 2000;
}

#banner img {
	width: 30vw;
    max-width: 430px;
    min-width: 16em;
    object-fit: contain;
}

#banner .banner-box {
    position: absolute;
    right: 0;
	margin-top: -1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#banner .close-btn {
    width: 30px;
    height: 30px;
    background-color: white;
    color: gray;
    border: none;
    border-radius: 50%;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease, color 0.3s ease;
}

@media only screen and (max-width: 600px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
    #banner .close-btn {
        width: 35px;
        height: 35px;
    }
}


/* =========================
   ZEROFIELD TOP ONLY
   prefix: zf-mining-
========================= */
#zf-mining{
    scroll-behavior: smooth;
  }
  #zf-mining section[id]{
    scroll-margin-top: calc(var(--zf-header-h, 80px) + 16px);
  }
  #zf-mining.zf-mining{
      --zf-purple: #210072; /* デザイン優先、必要なら調整 */
      --zf-purple-dark: #1a0b37;
      --zf-gray-bg: #f0f0f1;
      --zf-white: #fff;
      --zf-orange: #ff6600;
	  --zf-white-bg: #f7f8fa;
      color: #1a0b37;
    }

    /* 共通 */
    #zf-mining .zf-mining-h2{
      font-size: clamp(24px, 3.2vw, 32px);
      font-weight: 700;
      text-align:center;
      letter-spacing:.04em;
	  line-height:1.5;
    }
    #zf-mining .zf-mining-h2--white{ color:#fff; }
    #zf-mining .zf-mining-h3{
      font-size: clamp(16px, 2.2vw, 22px);
      font-weight:700;
      margin-bottom:12px;
    }
    #zf-mining .zf-mining-p{
      font-size: clamp(14px, 1.6vw, 16px);
      line-height:1.9;
    }
    #zf-mining .zf-mining-p--center{
		text-align:center;
		margin:20px 0 60px;
    }
    #zf-mining .zf-mining-p--white{ color:#fff; }

    #zf-mining .zf-mining-center{ text-align:center; margin-top:24px; }

    /* ボタン */
    #zf-mining .zf-mining-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:48px;
      padding:0 22px;
      border-radius:999px;
      font-weight:700;
      letter-spacing:.04em;
      transition:transform .2s ease, opacity .2s ease, background-color .2s ease;
    }
    #zf-mining .zf-mining-btn:hover{ transform:translateY(-2px); opacity:.9; }

    #zf-mining .zf-mining-btn--white{
      background:#fff; color:var(--zf-purple-dark);
    }
    #zf-mining .zf-mining-btn--purple{
      background:var(--zf-purple); color:#fff;
    }
    #zf-mining .zf-mining-btn--outline{
      background:transparent; color:var(--zf-purple-dark);
      border:2px solid var(--zf-purple-dark);
    }

  #zf-mining .zf-br-tbsp{
    display:none;
  }
  #zf-mining .zf-br-sp{
    display:none;
  }
  @media (max-width:959px) and (min-width:601px){
    #zf-mining .zf-br-tbsp{
      display:block;
    }
  }
  @media (max-width:600px){
    #zf-mining .zf-br-sp{
      display:block;
    }
	      #zf-mining .zf-mining-p--center{
		text-align:center;
		margin:10px 0 35px;
    }
    #zf-mining .zf-mining-btn:hover{ transform:translateY(0px); opacity:.9; }
  }
/* =========================
   SEC1 / FV 画像と同倍率でCTAもスケール（完全版）
   - 位置：%（画像に対する相対）
   - サイズ：vw（画像=全幅に追従する前提）
   - 影なし / 枠で“影”表現
========================= */

#sec1.zf-mining-fv{
  background:#fff;
}

.zf-mining-fv__single{
  position:relative;
  width:100%;
  overflow:hidden;
}

/* FV背景画像 */
.zf-mining-fv__bg{
  display:block;
  width:100%;
  line-height:0;
}
.zf-mining-fv__bg img{
  display:block;
  width:100%;
  height:auto;
}

/* =========================
   SEC1 / ボタン（TOPのhover/カラーを移植）
   - wrap::beforeで「ずらしボーダー」
   - hover：translateY(-2px) + 白10%かぶせ
========================= */

.zf-mining-fv__cta-group{
  position:absolute;
  left:14.2%;
  bottom:12.2%;
  display:flex;
  gap:0.8vw;          /* 余白も同倍率で変化 */
  align-items:center;
  z-index:2;
}


/* 影（ずらしボーダー）担当のラッパー */
.zf-mining-fv__btn-wrap{
  position:relative;
  display:inline-block;
}

/* ✅影の代わり：wrapperの後ろに“別箱”を置く（TOPと同じ） */
.zf-mining-fv__btn-wrap::before{
  content:"";
  position:absolute;
  top:0.35vw;
  left:0.35vw;
  right:-0.35vw;
  bottom:-0.28vw;
  border:1px solid var(--btn-stroke, currentColor);
  border-radius:4px;
  background:transparent;
  opacity:.6;
  z-index:0;
  pointer-events:none;
}

/* ボタン本体（※既存の .zf-mining-fv__btn::after は使わない） */
.zf-mining-fv__btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width:18.8vw;
  height:4.0vw;
  min-width:114px;
  min-height:42px;

  font-weight:700;
  font-size:clamp(10px,1.05vw,21px);
  line-height:1;
  letter-spacing:0.02em;
  text-decoration:none;

  border-radius:4px;
  background: var(--btn-bg, #fff);
  color: var(--btn-text, var(--zf-purple, #210072));
  border: 1px solid var(--btn-stroke, currentColor);

  box-shadow:none;
  z-index:1; /* wrap::beforeより前 */
  transition:transform .2s ease, filter .2s ease;
}

/* ✅旧仕様の影疑似要素は無効化 */
.zf-mining-fv__btn::after{ content:none; }

/* hover（PCのみ）：少し浮く + 白10%かぶせ（TOPと同じ） */
@media (hover:hover){
  .zf-mining-fv__btn:hover{
    transform:translateY(-2px);
    box-shadow: inset 0 0 0 9999px rgba(255,255,255,0.10);
  }
}

/* =========================
   ボタンカラー（TOPと同じ定義）
   - purple: #210072
   - orange: #ff6600
========================= */

/* 左（紫系）：白地 + 紫文字 + 紫枠 */
.zf-mining-fv__btn--purple{
  --btn-bg:#fff;
  --btn-text: var(--zf-purple, #210072);
  --btn-stroke: var(--zf-purple, #210072);
}

/* 右（オレンジ）：オレンジ塗り + 白文字 + オレンジ枠 */
.zf-mining-fv__btn--orange{
  --btn-bg: var(--zf-orange, #ff6600);
  --btn-text:#fff;
  --btn-stroke: var(--zf-orange, #ff6600);
}

/* wrap側の枠色もオレンジへ（TOP互換） */
.zf-mining-fv__btn-wrap:has(.zf-mining-fv__btn--orange){
  --btn-stroke: var(--zf-orange, #ff6600);
}

/* =========================
   SEC1（タブレット：601〜959）
   - 画像：トリミング（cover）
   - ボタン：位置/サイズ調整
========================= */
@media (max-width:959px) and (min-width:601px){

  /* 1) FV画像：高さを固定してトリミング */
  .zf-mining-fv__bg img{
    height: 50vw;          /* ←まずはこの値で。切れ具合で調整 */
    max-height: 560px;     /* 伸びすぎ防止（必要なら変更） */
    object-fit: cover;
    object-position: center; /* ←切り抜き位置。上寄せしたいなら center top 等 */
  }

  /* 2) CTA位置（タブレット用） */
  .zf-mining-fv__cta-group{
    left: 3.5%;           /* ←見た目に合わせて微調整OK */
    bottom: 9.5%;
    gap: 8px;             /* ←vwだと詰まりやすいのでタブだけpxで固定 */
  }

  /* 3) ボタンサイズ（タブレット用） */
  .zf-mining-fv__btn{
    width:25vw;
  height:4.0vw;
  min-width:150px;
  min-height:50px;
   font-size:clamp(13px,1.05vw,21px);
  }

  /* 4) “影枠”のズラし量（タブレット用） */
  .zf-mining-fv__btn-wrap::before{
    top: 4px;
    left: 4px;
    right: -4px;
    bottom: -3px;
  }
}


/* =========================
   SEC1 / SP（〜600px）CTA 位置・サイズ調整（添付3寄せ）
   - 画像の中で「下に寄せて」「横幅いっぱい気味」「2分割で大きく」
========================= */
@media (max-width: 600px){

  /* CTA全体：中央寄せ＋下に固定（画面幅に追従） */
  .zf-mining-fv__cta-group{
    left: 50%;
    transform: translateX(-50%);
    bottom: 32px;                 /* ← もっと下げたい/上げたい時はここ */
    width: calc(100% - 32px);     /* 左右16pxずつ余白 */
    gap: 10px;                    /* 2ボタン間の隙間 */
  }

  /* 2つのボタンを“同じ幅”で並べる */
  .zf-mining-fv__btn-wrap{
    flex: 1;
    width: 100%;
    position: relative;
    display: block;               /* inline-blockだと幅が取りにくいのでSPはblock */
  }

  /* 影枠（ずらしボーダー）※SP固定値のままでOKだが、幅が大きくなるので安定化 */
  .zf-mining-fv__btn-wrap::before{
    top: 4px;
    left: 4px;
    right: -4px;
    bottom: -3px;
    border-radius: 6px;
  }

  /* ボタン本体：SPはvwではなく“wrapにフィット”させて大きさ固定気味に */
  .zf-mining-fv__btn{
    width: 100%;
   height: clamp(42px, 13.5vw, 52px);
    min-width: 0;                /* ← minを殺す（ここ重要） */
    min-height: 0;

    font-size:clamp(12px,3.2vw,16px);
    border-radius: 6px;
    line-height: 1;
  }

  /* hover無効（SP） */
  .zf-mining-fv__btn:hover{
    transform: translateY(0);
    box-shadow: none;
  }
	  #sec1.zf-mining-fv{
    padding-top: var(--zf-header-h, 75px);
  }
}




/* =========================
   3) お悩み（sec3）
   - PC/タブ：3 + 2（2段目中央寄せ）
   - SP：2 + 2 + 1（左寄せ）
   - 画像サイズは変数で一括調整
   - 行ごとに高さを揃える
========================= */
#zf-mining .zf-mining-worries{
  background:var(--zf-gray-bg);
  padding:90px 16px;

  /* ✅ 画像一括サイズ（PC基準） */
  --worry-img-w: 250px;

  /* ✅ カード最大幅の基準 */
  --worry-card-maxw: 320px;

  /* ✅ 余白（PC版gap） */
  --worry-gap: 1px;
}

/* ✅ グリッド本体 → flexに変更 */
#zf-mining .zf-mining-worries__grid{
  max-width:1100px;
  margin:32px auto 0;

  display:flex;
  flex-wrap:wrap;
  gap:var(--worry-gap);

  justify-content:center; /* ✅ PC/タブは段ごと中央寄せ */
  align-items:stretch;
}

/* ✅ カードの幅（PC/タブ：3列想定） */
#zf-mining .zf-mining-worries__card{
  padding:6px 6px 20px;
  height: auto;

  display:flex;
  flex-direction:column;
  align-items:center;

  /* ✅ 3枚/行になる幅：100%を3等分しgap分引く */
  flex: 0 1 calc((100% - (var(--worry-gap) * 2)) / 3);
  max-width:var(--worry-card-maxw);
}

/* 画像 */
#zf-mining .zf-mining-worries__card img{
  width:var(--worry-img-w);
  max-width:100%;
  height:auto;
  display:block;
  margin:0 auto;
}

/* テキスト */
#zf-mining .zf-mining-worries__text{
  margin-top:10px;
  font-size:clamp(14px, 1.7vw, 17px);
	letter-spacing:0.01em;
  line-height:1.7;
  text-align:center;
  color:var(--zf-purple-dark);
  font-weight:400;
  min-height:calc(1.6em * 2);
  display:flex;
  align-items:center;
  justify-content:center;
}

/* ===== タブレット（959px以下） ===== */
@media (max-width:959px){
  #zf-mining .zf-mining-worries{
    padding:70px 16px;
    --worry-img-w: 210px;
    --worry-card-maxw: 280px; /* ✅ タブは少しだけ縮める */
  }
	  #zf-mining .zf-mining-worries__card{
    min-width: 0;
  }
  #zf-mining .zf-mining-worries__text{
    font-size: clamp(12px, calc(1.12vw + 5.28px), 16px);
    white-space: nowrap;
    min-width: 0;
  }

}

/* ===== SP（600px以下） ===== */
@media (max-width:600px){
    #zf-mining .zf-mining-worries{
    --worry-img-w: 190px;
    --worry-gap: 4px;
    padding: 65px 12px;
  }

	#zf-mining .zf-mining-worries__grid{
	  justify-content: center;          /* ← 左寄せ → 中央寄せ */
	  gap: var(--worry-gap);
	  margin: 12px auto 0;
	}

	/* ふつうのカードは 2列 */
	#zf-mining .zf-mining-worries__card{
	  flex: 0 0 calc(50% - (var(--worry-gap) / 2));
	  max-width: none;
	  padding: 00px 5px 18px;
	  box-sizing: border-box;
	}

	/* 3枚目だけ「1段占有」させて 2x1x2 を作る */
	#zf-mining .zf-mining-worries__card:nth-child(3){
	  flex-basis: 100%;                /* ← この段は1枚だけにする */
	  display: flex;
	  justify-content: center;         /* ← その1枚を中央へ */
	}

	/* 3枚目の実幅は他と同じ50%相当に */
	#zf-mining .zf-mining-worries__card:nth-child(3) img,
	#zf-mining .zf-mining-worries__card:nth-child(3) .zf-mining-worries__text{
	  max-width: var(--worry-img-w);
	}
	#zf-mining .zf-mining-worries__card:nth-child(3){
	  max-width: none;                 /* 段占有は許可 */
	}
	#zf-mining .zf-mining-worries__card:nth-child(3) > *{
	  max-width: calc(50% - (var(--worry-gap) / 2)); /* 見た目幅は他と同じ */
	}

  #zf-mining .zf-mining-worries__text{
    font-size:clamp(11px, calc(2.5vw + 3px), 13px);
    min-height:calc(1.6em * 2);
	  line-height:1.6;
	  margin-top:2px;
  }
}


/* =========================
   4) 暗号資産マイニングとは
   - PC/TAB：テキスト左・画像右（横並び）
   - SP：縦積み（タイトル→画像→テキスト→注釈→ボタン）
   - 画像幅/文字サイズは変数で調整
========================= */
#zf-mining .zf-mining-mining{
  background:var(--zf-purple-dark);
  padding:90px 30px 90px;

  /* ===== 可変パラメータ（PC基準） ===== */
  --mining-img-w: 200%;     /* 画像ブロック幅（%かpxどっちでも） */
  --mining-lead-size: 21px; /* タイトル上段 */
  --mining-title-size: 32px;/* タイトル下段 */
  --mining-h3-size: 22px;   /* 「どのような仕組み？」 */
  --mining-p-size: 16px;    /* 本文 */
  --mining-btn-size: 18px;  /* ボタン文字 */
}

#zf-mining .zf-mining-mining__inner{
  max-width:1100px;
  margin:0 auto;
}

/* ✅ タイトル上下のサイズ差 */
#zf-mining .zf-mining-mining__lead{
  display:block;
  font-size:var(--mining-lead-size);
  font-weight:600;
  line-height:1.6;
  opacity:.95;
	margin-bottom:8px;
}
#zf-mining .zf-mining-mining__title{
  display:block;
  font-size:var(--mining-title-size);
  font-weight:700;
  line-height:1.4;
}

/* ✅ PC/TAB：左右レイアウト固定（テキスト左・画像右） */
#zf-mining .zf-mining-mining__body{
  margin-top:48px;
  display:grid;
  grid-template-columns:.68fr 1.32fr;   /* 左テキスト / 右画像 */
  grid-template-areas:"text img";
  gap:45px;
  align-items:start;                 /* ✅ 頭揃え */
}

#zf-mining .zf-mining-mining__img{ grid-area:img; }
#zf-mining .zf-mining-mining__text{
  grid-area:text;
  color:#fff;
}

/* ✅ 画像幅を変数で調整 */
#zf-mining .zf-mining-mining__img img{
  width:var(--mining-img-w);
  max-width:100%;
  height:auto;
  display:block;
  margin-left:auto;  /* 右カラム内で右寄せしたい場合 */
}

/* ✅ テキストサイズを変数で */
#zf-mining .zf-mining-mining__text .zf-mining-h3{
  font-size:var(--mining-h3-size);
	margin-bottom:8px;
}
#zf-mining .zf-mining-mining__text .zf-mining-p{
  font-size:var(--mining-p-size);
  line-height:1.8;
}

/* ✅ ボタン上の注釈 */
#zf-mining .zf-mining-mining__note{
  margin-top:18px;
  font-size:14px;
  font-weight:700;
  text-align:center;
  color:#fff;
  opacity:.9;
}

/* ✅ ボタン：テキストブロック幅に一致させる */
#zf-mining .zf-mining-mining__btn{
  margin-top:8px;
  display:block;        /* ← 横幅を素直に100%に */
  width:100%;           /* ← テキストブロック幅＝ボタン幅 */
  padding:10px 16px 15px;
  border-radius:4px;
  font-size:var(--mining-btn-size);
  font-weight:700;
  line-height:1.45;
  text-align:center;
}

/* ===== タブレット（959px以下） ===== */
/* ✅ レイアウトは変えない。サイズだけ調整 */
@media (max-width:959px){
  #zf-mining .zf-mining-mining{
    --mining-img-w: 100%;     /* 例：タブで少し小さくしたいなら 90% とか */
    --mining-lead-size: 18px;
    --mining-title-size: 28px;
    --mining-h3-size: 20px;
    --mining-p-size: 15px;
    --mining-btn-size: 16px;
   --mining-btn-minw: 400px;
	 padding: 70px clamp(20px, calc(22.35vw - 114.3px), 100px);
  }
    #zf-mining .zf-mining-mining__btn{
    width:auto;                 /* ← 100%解除 */
    min-width:var(--mining-btn-minw);
    display:inline-flex;        /* ← 中身センターで安定 */
    justify-content:center;
    align-items:center;
    margin:8px auto 0;          /* ← ブロック中央寄せ */
  }
   #zf-mining .zf-mining-mining__body{
    grid-template-columns:1fr;
    grid-template-areas:
      "img"
      "text";
    gap:22px;
  }

  #zf-mining .zf-mining-mining__img img{
    margin:0 auto; /* SPは中央に */
	padding: 0 4.5vw;
  }
  #zf-mining .zf-mining-mining__text{
    text-align:center;
  }
	#zf-mining .zf-mining-mining__text .zf-mining-h3{
  text-align:left;
}
	#zf-mining .zf-mining-mining__text .zf-mining-p {
	text-align:left;
	}
	#zf-mining .zf-mining-mining__note {
		margin-top:24px;
	}
}

/* ===== SP（600px以下） ===== */
/* ✅ ここでだけ縦積みに変更 */
@media (max-width:600px){
  #zf-mining .zf-mining-mining{
    --mining-img-w: 100%;     /* SP画像幅 */
    --mining-lead-size: 16px;
    --mining-title-size: 24px;
    --mining-h3-size: 18px;
    --mining-p-size: 14px;
    --mining-btn-size: 15px;
	  --mining-btn-minw: 320px;
	  padding:65px 20px 65px;
  }

  #zf-mining .zf-mining-mining__body{
    gap:18px;
	  margin-top:30px;
  }
  #zf-mining .zf-mining-mining__img img{
	padding: 15px 0;
  }
	#zf-mining .zf-mining-mining__note{
	margin-top:34px;
	}
	#zf-mining .zf-mining-mining__text .zf-mining-h3 {
	margin-bottom:2px;
	}
}


  /* =========================
   5) メリット（sec5）
   - PC/タブ：4列（1行4枚固定）
   - SP：2列（2×2）
========================= */
#zf-mining .zf-mining-merit{
  background:var(--zf-gray-bg);
  padding:70px 16px;
}

#zf-mining .zf-mining-merit__grid{
  max-width:1100px;
  margin:30px auto 0;
  display:grid;
  grid-template-columns:repeat(4, 1fr); /* ✅ PC/タブは4枚並び固定 */
  gap:18px;
  justify-items:center;
}

#zf-mining .zf-mining-merit__item{
  text-align:center;
}

#zf-mining .zf-mining-merit__item img{
  width:100%;
  max-width:260px;
  height:auto;
  display:block;
}

#zf-mining .zf-mining-merit__text{
  margin-top:20px;
  font-size:clamp(15px,2vw,19px);
  line-height:1.7;
  text-align:center;
	font-weight:700;
}

/* ✅ SPだけ2列（2×2）に変更 */
@media (max-width:600px){
	#zf-mining .zf-mining-merit {
		padding: 65px 20px 45px;
	}
  #zf-mining .zf-mining-merit__grid{
    grid-template-columns:repeat(2, 1fr);
    gap:14px;
  }

  #zf-mining .zf-mining-merit__text{
    font-size:16px;
	 margin-top:10px;
	  margin-bottom:20px;
  }
}

/* =========================
   6) ビットコイントレジャリー（sec6）
   - 1カラム縦積み固定
   - 全部センター揃え
========================= */
#zf-mining .zf-mining-treasury{
  background:var(--zf-white);
  padding:70px 16px;

  /* 必要ならサイズ一括管理 */
  --treasury-lead-size: 21px;
  --treasury-desc-size: clamp(14px, 1.6vw, 16px);
  --treasury-note-size: 14px;
  --treasury-btn-minw: 520px; /* PC基準 */
}

#zf-mining .zf-mining-treasury__inner{
  max-width:1100px;
  margin:0 auto;

  display:flex;
  flex-direction:column;
  align-items:center;  /* ✅ 全部センター */
  text-align:center;   /* ✅ テキストもセンター */
}

/* リード（オレンジ） */
#zf-mining .zf-mining-treasury__lead{
  font-size:var(--treasury-lead-size);
  font-weight:700;
  color:var(--zf-orange);  /* オレンジ */
  letter-spacing:.04em;
  margin-bottom:6px;
}

/* タイトル下説明 */
#zf-mining .zf-mining-treasury__desc{
  margin-top:30px;
  font-size:var(--treasury-desc-size);
  line-height:2.0;
  color:var(--zf-purple-dark);
}

/* 画像 */
#zf-mining .zf-mining-treasury__img{
  margin-top:28px;
  width:100%;
  display:flex;
  justify-content:center;
}
#zf-mining .zf-mining-treasury__img img{
  width:100%;
  max-width:900px; /* 画像の見た目最大幅（必要なら調整） */
  height:auto;
  display:block;
}

/* note */
#zf-mining .zf-mining-treasury__note{
  margin-top:27px;
  font-size:var(--treasury-note-size);
  font-weight:700;
  color:var(--zf-purple-dark);
  letter-spacing:.04em;
}

/* ボタン */
#zf-mining .zf-mining-treasury__btn{
  margin-top:10px;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  min-width:var(--treasury-btn-minw);
  padding:10px 16px 15px;
  border-radius:4px;

  font-size:18px;
  font-weight:700;
  line-height:1.6;
  text-align:center;
}

/* ===== タブレット以下（959px） ===== */
@media (max-width:959px){
  #zf-mining .zf-mining-treasury{
    --treasury-lead-size: 18px;
    --treasury-desc-size: 15px;
    --treasury-btn-minw: 420px; /* タブは少し細く */
  }

  #zf-mining .zf-mining-treasury__img img{
    max-width:760px;
  }
}

/* ===== SP（600px以下） ===== */
@media (max-width:600px){
  #zf-mining .zf-mining-treasury{
    --treasury-lead-size: 16px;
    --treasury-desc-size: 14px;
    --treasury-note-size: 13px;
    --treasury-btn-minw: 260px;
	  padding:65px 20px;
  }
	#zf-mining .zf-mining-treasury .zf-mining-h2 {
		letter-spacing:0;
	}

  #zf-mining .zf-mining-treasury__desc{
    line-height:1.7;
  }

  #zf-mining .zf-mining-treasury__img img{
    max-width:100%;
  }

  #zf-mining .zf-mining-treasury__btn{
    width:100%;
    min-width:0;
    font-size:14px;
	letter-spacing:0;
  }
	#zf-mining .zf-mining-treasury__desc br{
    display:none;
  }
	  #zf-mining .zf-mining-treasury__desc{
    text-align:left;
  }
}

/* =========================
   7) お客様インタビュー（sec7）
   - PC/タブ：2列×2行
   - SP：1列×4行
   - カード：左画像＋右テキスト
   - 右側：タイトル → meta（tag / who[company+person]）
   - 幅があれば company+person 同一行 / 狭ければ person が次行
========================= */
#zf-mining .zf-mining-interview{
  background:var(--zf-white-bg);
  padding:70px 16px;

  --interview-lead-size: 21px;
  --interview-title-size: clamp(24px, 3.2vw, 32px);
  --interview-tag-size: 11px;
  --interview-card-gap: 20px;
  --interview-card-radius: 8px;

  --interview-meta-size: 12px;
  --interview-meta-color: #1a0b37;
}

#zf-mining .zf-mining-interview__inner{
  max-width:1100px;
  margin:0 auto;
  text-align:center;
}

#zf-mining .zf-mining-interview__lead{
  font-size:var(--interview-lead-size);
  font-weight:700;
  color:var(--zf-orange);
  letter-spacing:.04em;
  margin-bottom:6px;
}

#zf-mining .zf-mining-interview .zf-mining-h2{
  font-size:var(--interview-title-size);
  line-height:1.5;
  letter-spacing:.04em;
}

/* 外側の並び：PC/タブ 2列 */
#zf-mining .zf-mining-interview__grid{
  margin-top:50px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:var(--interview-card-gap);
  align-items:stretch;
}

/* カード本体：横並び */
#zf-mining .zf-mining-interview__card{
  background:#fff;
  border:1px solid #eee;
  border-radius:var(--interview-card-radius);
  overflow:hidden;
  display:flex;
  align-items:stretch;
  text-align:left;
  transition:transform .2s ease, box-shadow .2s ease;
}
#zf-mining .zf-mining-interview__card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(0,0,0,.08);
}

/* 左画像 */
#zf-mining .zf-mining-interview__img{
  flex:0 0 30%;
  max-width:30%;
}
#zf-mining .zf-mining-interview__img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 右テキスト */
#zf-mining .zf-mining-interview__body{
  flex:1;
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:16px;
}

/* タイトル */
#zf-mining .zf-mining-interview__title{
  margin:0;
  font-size:18px;
  font-weight:700;
  line-height:1.6;
  color:var(--zf-purple-dark);
}

/* meta（tag / who） */
#zf-mining .zf-mining-interview__meta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}

/* 職種タグ（四角囲み） */
#zf-mining .zf-mining-interview__tag{
  display:inline-block;
  align-self:flex-start;
  font-size:var(--interview-tag-size);
  font-weight:700;
  color:var(--zf-orange);
  border:1px solid var(--zf-orange);
  padding:0 6px 1px;
  border-radius:1px;
  letter-spacing:.02em;
  line-height:1.6;
}

/* 会社名＋氏名：幅があれば同一行 / 狭ければ氏名が次行 */
#zf-mining .zf-mining-interview__who{
  display:flex;
  flex-wrap:wrap;
  column-gap:6px;
  row-gap:6px;
}

/* 会社名・氏名（塊単位で折り返す） */
#zf-mining .zf-mining-interview__company,
#zf-mining .zf-mining-interview__person{
  font-size:var(--interview-meta-size);
  color:var(--interview-meta-color);
  line-height:1.4;
  white-space:nowrap;
}

/* ボタン置き場（sec7） */
#zf-mining .zf-mining-interview__cta{
  margin-top:50px;
  display:flex;
  justify-content:center;
}

/* ===== タブレット以下（959px） ===== */
@media (max-width:959px){
  #zf-mining .zf-mining-interview{
    --interview-lead-size: 18px;
    --interview-tag-size: 11px;
    --interview-card-gap: 16px;
    --interview-meta-size: 12px;
  }

  #zf-mining .zf-mining-interview__body{
    padding:18px 20px;
  }

  #zf-mining .zf-mining-interview__title{
    font-size:16px;
  }
}

/* ===== SP（600px以下） ===== */
@media (max-width:600px){
  #zf-mining .zf-mining-interview{
    --interview-lead-size: 16px;
    padding:65px 12px;
    --interview-meta-size: 12px;
  }

  #zf-mining .zf-mining-interview__grid{
    grid-template-columns:1fr;
    gap:10px;
    margin-top:40px;
  }

  #zf-mining .zf-mining-interview__img{
    flex:0 0 38%;
    max-width:38%;
  }

  #zf-mining .zf-mining-interview__body{
    padding:16px 18px;
    gap:8px;
  }

  #zf-mining .zf-mining-interview__title{
    font-size:15px;
    line-height:1.6;
  }

  #zf-mining .zf-mining-interview__who{
    column-gap:8px;
    row-gap:5px;
  }
}



/* =========================
   8) 最新情報 & ノウハウ（sec8）
   - PC: 4カード1行
   - TB/SP: 2x2
   - meta：カテゴリ + 日付 を1行でタイトル上へ
========================= */
#zf-mining .zf-mining-news{
  background:var(--zf-gray-bg);
  padding:70px 16px 80px;
}

#zf-mining .zf-mining-news__inner{
  max-width:1200px;
  margin:0 auto;
  text-align:center;
}

#zf-mining .zf-mining-news__lead{
  font-size:18px;
  font-weight:700;
  color:var(--zf-orange);
  letter-spacing:.04em;
  margin-bottom:6px;
}

#zf-mining .zf-mining-news__grid{
  margin-top:50px;
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}

#zf-mining .zf-mining-news__card{
  background:#fff;
  border-radius:4px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,0);
  transition:transform .2s ease, box-shadow .2s ease;
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  min-width:0;
}

#zf-mining .zf-mining-news__card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(0,0,0,.1);
}

#zf-mining .zf-mining-news__thumb img{
  width:100%;
  height:auto;
  display:block;
}

#zf-mining .zf-mining-news__body{
  padding:16px 14px;
  text-align:left;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:6px;
}

#zf-mining .zf-mining-news__meta{
  align-items:center;
  line-height:1;
}

#zf-mining .zf-mining-news__cat{
  position:static;
  background:var(--zf-orange);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:3px 6px 4px;
  border-radius:2px;
  line-height:1;
  display:inline-flex;
  align-items:center;
 white-space:nowrap;
}

#zf-mining .zf-mining-news__date{
  font-size:11px;
  color:#666;
  line-height:1;
  padding-left:4px;
}

#zf-mining .zf-mining-news__title{
  font-size:13px;
  font-weight:600;
  line-height:1.6;
  color:#333;
}

#zf-mining .zf-mining-news__cta{
  margin-top:50px;
  display:flex;
  justify-content:center;
}

@media (max-width:959px){
  #zf-mining .zf-mining-news{
    padding:70px clamp(20px, calc(22.35vw - 114.3px), 100px) 150px;
  }
  #zf-mining .zf-mining-news__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
  }
}

@media (max-width:600px){
  #zf-mining .zf-mining-news{
    padding:65px 8px 120px;
  }
  #zf-mining .zf-mining-news__grid{
    gap:8px;
  }
  #zf-mining .zf-mining-news__card{
    margin-bottom:8px;
  }
  #zf-mining .zf-mining-news__lead{
    font-size:16px;
  }
  #zf-mining .zf-mining-news__cat{
    font-size:10px;
    padding:5px 7px;
  }
  #zf-mining .zf-mining-news__cta{
    margin-top:42px;
  }
}


/* =========================
   sec7 / sec8 共通ボタン（outline）
   - 見た目と幅はここで一括管理
========================= */

/* PC基準 */
#zf-mining .zf-mining-interview__cta .zf-mining-btn--outline,
#zf-mining .zf-mining-news__cta .zf-mining-btn--outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-width:360px;
  padding:18px 22px;
  border-radius:4px;
  border:2px solid var(--zf-purple-dark);
  color:var(--zf-purple-dark);

  font-size:18px;
  font-weight:700;
  line-height:1.6;
  letter-spacing:.04em;
  text-align:center;
  text-decoration:none;

  transition:background .2s ease, color .2s ease, border-color .2s ease;
}

#zf-mining .zf-mining-interview__cta .zf-mining-btn--outline:hover,
#zf-mining .zf-mining-news__cta .zf-mining-btn--outline:hover{
  background:var(--zf-purple-dark);
  color:#fff;
  border-color:var(--zf-purple-dark);
}

/* =========================================
   sec7 / sec8 CTA hover 安全化（浮きhover維持）
   - hover判定は動かないwrapが持つので振動しない
   - PCとタブレットは同じ挙動
   - SP(600px以下)は既存のhover全OFFブロックで無効化
========================================= */
#zf-mining .zf-mining-interview__cta .zf-mining-btn-wrap,
#zf-mining .zf-mining-news__cta .zf-mining-btn-wrap{
  position:relative;
  display:inline-block;
}

/* ボタン本体は自前hoverで動かさない（共通hover浮きを打消し） */
#zf-mining .zf-mining-interview__cta .zf-mining-btn--outline,
#zf-mining .zf-mining-news__cta .zf-mining-btn--outline{
  transform:none;
}

/* hoverはwrapに乗った時だけ発火 → 中身が安全に浮く */
#zf-mining .zf-mining-interview__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline,
#zf-mining .zf-mining-news__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline{
  transform:translateY(-2px);
  opacity:.9;
  background:var(--zf-purple-dark);
  color:#fff;
  border-color:var(--zf-purple-dark);
}

/* タブレット */
@media (max-width:959px){
  #zf-mining .zf-mining-interview__cta .zf-mining-btn--outline,
  #zf-mining .zf-mining-news__cta .zf-mining-btn--outline{
    min-width:360px;
    font-size:16px;
    padding:16px 20px;
  }
}

/* SP */
@media (max-width:600px){
  #zf-mining .zf-mining-interview__cta .zf-mining-btn--outline,
  #zf-mining .zf-mining-news__cta .zf-mining-btn--outline{
    min-width:0;
    width:68%;
    font-size:15px;
    padding:14px 16px;
    letter-spacing:0;
  }
	#zf-mining .zf-mining-interview__cta .zf-mining-btn-wrap,
	#zf-mining .zf-mining-news__cta .zf-mining-btn-wrap{
	  display:block;
	  width:80%;
	  margin:0 auto;
	}
	#zf-mining .zf-mining-interview__cta .zf-mining-btn--outline,
	#zf-mining .zf-mining-news__cta .zf-mining-btn--outline{
	  width:100%;
	  justify-content:center;
	}
	#zf-mining .zf-mining-interview__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline,
	#zf-mining .zf-mining-news__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline{
	transform:translateY(0px);
	opacity:100%;
	}
	 #zf-mining .zf-mining-interview__cta .zf-mining-btn--outline:hover,
  #zf-mining .zf-mining-news__cta .zf-mining-btn--outline:hover,
  #zf-mining .zf-mining-interview__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline,
  #zf-mining .zf-mining-news__cta .zf-mining-btn-wrap:hover .zf-mining-btn--outline{
    background: transparent !important;
    color: var(--zf-purple-dark) !important;
    border-color: var(--zf-purple-dark) !important;
  }
}
/* =========================
   SEC9 / 資料請求フォーム（CF7）
========================= */
#zf-mining .zf-mining-docform{
  background: var(--zf-white);
  padding: 80px 16px 100px;
}

#zf-mining .zf-mining-docform__inner{
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}


#zf-mining .zf-mining-docform__lead{
  font-size: 18px;
  font-weight: 700;
  color: var(--zf-orange);
  letter-spacing: .04em;
  margin-bottom: 6px;
}

#zf-mining .zf-mining-docform__body{
  margin-top: 34px;
  text-align: left;
  background: #f7f8fa;
  border: none;
  border-radius: 4px;
  padding: 36px;
}

/* フック（#doc-form）自体は表示しない */
#zf-mining .zf-mining-docform__hook{
  height: 0;
}
#zf-mining #doc-form{
  scroll-margin-top: calc(var(--zf-header-h, 80px) + 16px);
}
/* ---- CF7：このページ内だけ整形 ---- */
#zf-mining .zf-mining-docform .wpcf7{
  margin: 0;
}

#zf-mining .zf-mining-docform .wpcf7 form{
  margin: 0;
}

#zf-mining .zf-mining-docform .wpcf7 p{
  margin: 0 0 14px;
}

#zf-mining .zf-mining-docform input[type="text"],
#zf-mining .zf-mining-docform input[type="email"],
#zf-mining .zf-mining-docform input[type="tel"],
#zf-mining .zf-mining-docform input[type="url"],
#zf-mining .zf-mining-docform select,
#zf-mining .zf-mining-docform textarea{
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d6d6da;
  border-radius: 4px;
  padding: 12px 12px;
  font-size: 16px;
  line-height: 1.6;
  background: #fff;
}

#zf-mining .zf-mining-docform textarea{
  min-height: 140px;
  resize: vertical;
}

#zf-mining .zf-mining-docform input:focus,
#zf-mining .zf-mining-docform select:focus,
#zf-mining .zf-mining-docform textarea:focus{
  outline: none;
  border-color: var(--zf-purple);
  box-shadow: 0 0 0 3px rgba(33,0,114,.10);
}

/* 送信ボタン（このページ用） */
#zf-mining .zf-mining-docform input[type="submit"]{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(520px, 100%);
  height: 56px;
  border-radius: 4px;
  background: var(--zf-orange);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .04em;
  cursor: pointer;
  transition: transform .2s ease, filter .2s ease;
}
#zf-mining .zf-mining-docform .wpcf7 form{
  max-width: none;
  width: 100%;
  margin: 0;        /* auto を殺す */
}
#zf-mining .zf-mining-docform .wpcf7-form input[type="submit"]{
  max-width: none;
  padding: 0;
  width: 100%;
}
/* =========================
   SEC9：チェックボックス（mining-expect）天地を詰める
========================= */
#zf-mining .zf-mining-docform .wpcf7-form-control-wrap[data-name="mining-expect"]{
  margin-top: 6px;
}

/* 各項目の上下余白を詰める */
#zf-mining .zf-mining-docform .wpcf7-form-control-wrap[data-name="mining-expect"] .wpcf7-list-item{
  display: block;      /* 1行ずつなら */
  margin: 4px 0;       /* ←ここで天地調整（例：4〜8px） */
}

/* labelの行間と余白を詰める */
#zf-mining .zf-mining-docform .wpcf7-form-control-wrap[data-name="mining-expect"] label{
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.35;   /* ←ここも効く */
  margin: 0;
  padding: 0;
}

/* checkbox本体の余白を抑える */
#zf-mining .zf-mining-docform .wpcf7-form-control-wrap[data-name="mining-expect"] input[type="checkbox"]{
  margin: 0;     /* テキストとの縦位置合わせ */
}

@media (hover:hover){
  #zf-mining .zf-mining-docform input[type="submit"]:hover{
    transform: translateY(-2px);
    box-shadow: inset 0 0 0 9999px rgba(255,255,255,0.10);
  }
}
#zf-mining .zf-mining-docform{
  --treasury-desc-size: 16px; /* PC基準（好みで） */
}
@media (max-width:959px){
  #zf-mining .zf-mining-docform{
    --treasury-desc-size: 15px;
  }
}
@media (max-width:600px){
  #zf-mining .zf-mining-docform{
    padding: 70px 16px 90px;
  }
  #zf-mining .zf-mining-docform__lead{
    font-size: 16px;
  }
  #zf-mining .zf-mining-docform__body{
    padding: 5px 0;
    margin-top: 26px;
	background-color: #fff;
  }
  #zf-mining .zf-mining-docform input[type="submit"]{
    height: 54px;
  }
	  #zf-mining .zf-mining-docform .u-text-align-center-margin{
    margin-top: 0;
  }
	#zf-mining .zf-mining-docform{
    --treasury-desc-size: 14px;
  }
	/* 全体の基本文字サイズ（説明文などのベース） */
  #zf-mining .zf-mining-docform .wpcf7{
    font-size: 14px;
    line-height: 1.7;
  }

  /* ラベル（項目名） */
  #zf-mining .zf-mining-docform .wpcf7 label{
    font-size: 15px;
    line-height: 1.6;
  }

  /* 「※必須」など */
  #zf-mining .zf-mining-docform .wpcf7 .red{
    font-size: 12px;
  }

  /* 「暗号資産マイニングに期待すること」などの見出し */
  #zf-mining .zf-mining-docform .wpcf7 .big{
    font-size: 15px;
  }

  /* 入力欄の中の文字（placeholder含む） */
  #zf-mining .zf-mining-docform input[type="text"],
  #zf-mining .zf-mining-docform input[type="email"],
  #zf-mining .zf-mining-docform input[type="tel"],
  #zf-mining .zf-mining-docform textarea,
  #zf-mining .zf-mining-docform select{
    font-size: 16px; /* iOSの自動ズーム回避 */
  }

  /* チェックボックスの選択肢テキスト */
  #zf-mining .zf-mining-docform .wpcf7-list-item-label{
    font-size: 15px;
    line-height: 1.55;
  }

  /* 同意文（長文なので少し小さめ） */
  #zf-mining .zf-mining-docform .wpcf7-acceptance .wpcf7-list-item-label{
    font-size: 14px;
    line-height: 1.7;
  }

  /* 送信ボタン文字 */
  #zf-mining .zf-mining-docform .wpcf7-form input[type="submit"]{
    font-size: 16px;
  }
}
