/**
 * プロダクト詳細（page-product-detail.php、Co-buy/ファミマTV子ページ）
 * 専用CSS。仮組み。上位の空ページ(page-product.php)はリダイレクトのみで
 * このCSSを読み込まない。
 * heroだけはpage-business.php（css/business.css の .p-business-hero系）と
 * 同じ構成・数値を踏襲している。それ以外のセクションは他ページのCSSに
 * 依存せず、このファイル内で独自に完結させている。
 *
 * 円形の関係図・ファネル図・間口/奥行図・ベン図の細かいアイコン/ロゴ画像は
 * 別途支給予定のため、images/product/ 配下を仮パスとして参照している。
 * 画像が届くまでは表示が崩れます。
 */

/* ヒーロー通過でヘッダーの見た目を切り替える(business.cssと同じ仕組み。
   js/product-hero-header.js とセット) */
.page-wrapper {
  padding-top: 0;
}

.l-site-header {
  background: transparent;
  border-bottom: 1px solid #fff;
}

.l-site-header.is-product-hero-passed {
  background: #fff;
}

.c-site-logo__image {
  display: none;
}

.c-site-logo__image--white {
  display: block;
}

.l-site-header.is-product-hero-passed .c-site-logo__image {
  display: block;
}

.l-site-header.is-product-hero-passed .c-site-logo__image--white {
  display: none;
}

.p-global-nav__link {
  color: #fff;
}

.l-site-header.is-product-hero-passed .p-global-nav__link {
  color: var(--color-black);
}

.p-product {
  overflow: hidden;
  color: var(--color-black);
  background: var(--color-white);
}

.p-product img {
  max-width: 100%;
  height: auto;
}

/* ====================================================================
   HERO（page-business.php の .p-business-hero と同じ構成・数値）
   ==================================================================== */
.p-product-hero {
  min-height: min(779px, 58.1343283582vw);
  color: var(--color-white);
  background: #202020 url("../images/product/product_hero_bg.webp") center/cover no-repeat;
}

.p-product-hero__inner {
  width: min(1300px, 97.0149253731vw);
  margin-inline: auto;
  padding-top: min(320px, 23.8805970149vw);
}

.p-product-hero__title {
  font-family: var(--font-en);
  font-size: min(130px, 9.7014925373vw);
  font-weight: 700;
  line-height: min(130px, 9.7014925373vw);
  font-feature-settings: "palt";
  letter-spacing: -0.02em;
}

.p-product-hero__label {
  color: var(--color-yellow);
  font-size: min(24px, 1.7910447761vw);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.025em;
}

.p-product-hero__text {
  margin-top: min(36px, 2.6865671642vw);
  font-size: min(20px, 1.4925373134vw);
  font-weight: 700;
  line-height: min(36px, 2.6865671642vw);
  letter-spacing: 0.05em;
}

@media (max-width: 767px) {
  .p-product-hero {
    min-height: 133.3333333333vw;
    background-image: url("../images/product/product_hero_bg_sp.webp");
    background-position: center top;
  }
}

@media (max-width: 767px) {
  .p-product-hero__inner {
    width: 100%;
    padding: 48vw 5.3333333333vw 0;
  }
}

@media (max-width: 767px) {
  .p-product-hero__title {
    font-size: 16vw;
    line-height: 21.3333333333vw;
    margin-top: 0;
    margin-left: -1.3333333333vw;
  }
}

@media (max-width: 767px) {
  .p-product-hero__label {
    font-size: 4.5333333333vw;
    margin-top: 1.3333333333vw;
  }
}

@media (max-width: 767px) {
  .p-product-hero__text {
    font-size: 3.2vw;
    line-height: 1.85;
    margin-top: 6.4vw;
  }
}

/* ====================================================================
   見出し共通パーツ（Co-buyとは／ファミマTVとは 等）
   ==================================================================== */
.p-product-heading {
  position: relative;
  padding-bottom: min(20px, 1.492537vw);
  font-size: min(30px, 2.23880597015vw);
  font-weight: 700;
  text-align: center;
}

.p-product-heading.head{
	line-height:1;
}

@media (max-width: 767px) {
	.p-product-heading {
  font-size:5.3333vw;
		padding-bottom: 5.3333vw;
}
}

.p-product-heading__line {
  position: absolute;
  bottom: 0;
  left: 50%;
  display: block;
  width: min(80px, 5.97vw);
  height: min(5px, 0.37313vw);
  background: var(--color-primary);
  transform: translateX(-50%);
}

@media (max-width: 767px) {
	.p-product-heading__line {
		width:10.666667vwvw;
		height:0.666667vw;
	}
}

.p-product-heading__highlight {
  background: linear-gradient(transparent 60%, var(--color-primary) 60%, var(--color-primary) 90%, transparent 90%);
}

/* ====================================================================
   タブ切り替え
   ==================================================================== */
.p-product-tabs {
  padding-top: min(100px, 7.4626vw);
}

@media (max-width: 767px) {
	.p-product-tabs {
  padding-top: 8vw;
}
}

.p-product-tabs__nav {
  display: flex;
  max-width: min(1300px, 97vw);
  margin-inline: auto;
	gap:min(20px,1.4925vw);
}

@media (max-width: 767px) {
	.p-product-tabs__nav {
		gap:1.33333333vw;
		width:89.3333%;
	}
}

.p-product-tabs__button {
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(12px, 0.8955223881vw);
  padding: min(40px, 2.985vw) 0;
  border: 0;
  border-top: min(5px, 0.37313vw) solid #e0e0e0;
	border-top-color: var(--color-primary);
  background: #e5e5e5;
  color: #222222;
  font-size: min(35px, 2.61194vw);
  font-weight: 700;
  cursor: pointer;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

@media (max-width: 767px) {
	.p-product-tabs__button {
		gap:2.666667vw;
		padding: 5.3333333vw 0;
		border-top: 0.6666667vw solid #e0e0e0;
		border-top-color: var(--color-primary);
		font-size: 5.333333vw;
	}
}

.p-product-tabs__button.is-active {
  background: var(--color-white);
  color: var(--color-black);
}

.p-product-tabs__number {
  font-family: var(--font-en);
  color: var(--color-secondary);
	font-size:min(30px,2.2388vw);
	vertical-align:middle;
	line-height:1;
padding-top:min(6px,0.5vw);
}

@media (max-width: 767px) {
	.p-product-tabs__number {
		font-size: 5.333333vw;
	}
}

.p-product-panel--cobuy {
  padding: min(150px, 11.194vw) 0 min(100px, 7.4626vw);
}

.p-product-panel[hidden] {
  display: none;
}

@media (max-width: 767px) {
	.p-product-panel--cobuy {
  padding: 17.6vw 0 13.3333333vw;
}
}


/* ====================================================================
   イントロ（ロゴ + 見出し + リード + 本文）
   ==================================================================== */
.p-product-intro {
  margin-inline: auto;
  text-align: center;
}

.p-product-intro>.p-product-intro__logo.co-buy {
  display: block;
  max-width: min(450px, 33.582vw);
  margin: 0 auto min(60px, 4.477611vw);
}

.p-product-intro>.p-product-intro__logo.famimatv {
  display: block;
  max-width: min(400px, 29.85vw);
  margin: 0 auto min(32px, 2.388vw);
}


@media (max-width: 767px) {
	.p-product-intro>.p-product-intro__logo.co-buy{
	max-width:unset;
  width: 66.666667vw;
  margin-bottom: 8vw;
}
	
	.p-product-intro>.p-product-intro__logo.famimatv {
  max-width:unset;
  width: 54.133333vw;
  margin-bottom: 4vw;
}
}


.p-product-intro__lead {
  margin-top: min(40px, 2.985vw);
  font-size: min(24px, 1.791vw);
  font-weight: 700;
  line-height: 1;
}

.p-product-intro__text {
  margin-top: min(30px, 2.2388vw);
  font-size: min(18px, 1.3432vw);
  line-height: 1;
  color: #222222;
}

.p-product-intro__text.famimatv{
	line-height:1.9;
}

@media (max-width: 767px) {
	.p-product-intro__lead {
  margin-top: 6.66667vw;
  font-size: 4.533333vw;
		line-height:1.6;
}
	
	.p-product-intro__lead.famimatv{
line-height:1.6;
}
	
	.p-product-intro__text {
  margin-top: 6.66667vw;
  font-size: 3.733333vw;
		line-height:1.6;
}
}

/* ====================================================================
   円形の関係図（co-buyの仕組み）。丸ごと1枚の画像で配置する
   ==================================================================== */
.p-product-diagram {
  max-width: min(1300px, 97vw);
  margin: min(40px, 2.985vw) auto 0;
}

.p-product-diagram__image {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 767px) {
	.p-product-diagram {
  max-width: unset;
		width:89.33333vw;
  margin: 10.666667vw auto 0;
	}
}

/* ====================================================================
   フルファネル支援セクション
   ==================================================================== */
.p-product-funnel-section {
  max-width: min(1300px, 97vw);
  margin: min(100px, 7.4626vw) auto 0;
}

@media (max-width: 767px) {
	.p-product-funnel-section {
  max-width: unset;
	width:89.33333vw;
  margin: 13.33333vw auto 0;
}
}

.p-product-funnel {
  margin-top: min(65px, 4.85vw);
}

.p-product-heading.funnel{
	font-size:min(50px,3.73134vw);
}

@media (max-width: 767px) {
	.p-product-funnel {
  margin-top: 5.333333vw;
}

.p-product-heading.funnel{
	font-size:5.2vw;
}
}

.p-product-funnel__labels {
  display: flex;
  padding: 0;
  margin: 0 0 min(20px, 1.4925vw);
  list-style: none;
  font-size:min(18px,1.3432vw);
  font-weight: 700;
  color: #222222;
}

.p-product-funnel__labels li {
  position: relative;
  flex: 1 1 0;
  padding-bottom: min(35px, 2.6119vw);
  text-align: center;
}

.p-product-funnel__labels li::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 0;
  border-left: min(30px, 2.2388059701vw) solid transparent;
  border-right: min(30px, 2.2388059701vw) solid transparent;
  border-top: min(20px, 1.4925373134vw) solid var(--color-primary);
  transform: translateX(-50%);
}

.p-product-funnel__list_box{
display:flex;
	width:100%;
	column-gap:1px;
}

.p-product-funnel__list{
	display:flex;
/* 	column-gap:min(80px,5.97vw); */
	flex:1 1 50%;
	height:min(224px,16.7164vw);
	justify-content:space-around;
	align-items:center;
}

.p-product-funnel__list.left{
	background: url(../images/product/fullfunnel_left_bg.png) center / contain no-repeat;
}

.p-product-funnel__list.right{
	background: url(../images/product/fullfunnel_right_bg.png) center / contain no-repeat;
}

.p-product-funnel__list_item{
	display:flex;
	flex-direction:column;
	row-gap:min(15px,1.1194vw);
	justify-content:center;
	align-items:center;
}

.p-product-funnel__list_item img{
	display:inline-block;
	width:min(80px,5.97vw);
	aspect-ratio:1/1;
}

.p-product-funnel__list_item p{
	font-size:min(18px,1.34328vw);
	line-height:1;
}

.p-product-funnel__list.left>.p-product-funnel__list_item p{
color:#fff;
}

.p-product-funnel__list.right>.p-product-funnel__list_item p{
color:#222222;
}

/* ファミマTV(緑→青)とco-buy(黄→オレンジ)、2枚の枠を1つの.p-product-bridge
   内で左上/右下に重ねて配置する。枠線・サブタイトルの色は
   --bridge-gradient（各__box--modifierで定義）を共通で参照している */
.p-product-bridge {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-top: min(40px, 2.985vw);
}

.p-product-bridge__box {
  position: relative;
  display: flex;
  align-items: center;
  gap: min(30px, 2.2388vw);
  border: 2px solid transparent;
	border-radius:10px;
  background:
    linear-gradient(var(--color-white), var(--color-white)) padding-box,
    var(--bridge-gradient) border-box;
}

.p-product-bridge__box--reach {
  --bridge-gradient: linear-gradient(90deg, #00a33e, #008cd6);
	padding: min(30px, 2.2388vw) 0 min(15px, 1.1194vw);
	width:50%;
	justify-content:center;
  z-index: 2;
  align-self: flex-start;
}

.p-product-bridge__box--depth {
  --bridge-gradient: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
	padding: min(50px, 3.7313vw) min(75px, 5.597vw) min(30px, 2.2388vw) 0;
  z-index: 1;
  align-self: flex-end;
	width:93.84%;
  margin-top: min(-44px, -3.2835820896vw);
justify-content:flex-end;
}

.p-product-bridge__label {
  position: absolute;
  top: 0;
  line-height:1;
  border-radius: 999px;
  background: var(--bridge-gradient);
  color: var(--color-white);
  font-size: min(20px, 1.4925vw);
  font-weight: 700;
  white-space: nowrap;
}

.p-product-bridge__label.famimatv{
	left: 50%;
  margin:auto;
	transform:translateX(-50%) translateY(-50%);
	padding: min(10px, 0.74626vw) min(100px, 7.4626vw);
}

.p-product-bridge__label.co-buy{
	right:10%;
transform:translateY(-50%);
	padding: min(10px, 0.74626vw) min(100px, 4.4776vw);
	color:#222222;
}

.p-product-bridge__box>.p-product-bridge__logo {
  flex: 0 0 auto;
  max-width: min(120px, 8.9552238806vw);
}

.p-product-bridge__caption {
  font-size: min(20px, 1.4925vw);
  font-weight: 700;
  color: #222222;
	line-height:1;
}

.p-product-points {
  display: flex;
  gap: min(40px, 2.985vw);
  margin-top: min(40px, 2.9850746269vw);
position:relative;
}
.p-product-points>img{
	position:absolute;
	inset:0;
	margin:auto;
	width:min(100px,7.4626vw);
}

.p-product-points__item {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  gap: min(40px, 2.985vw);
  padding: min(40px, 2.985vw) min(60px,4.477vw);
  border:solid 1px #e8e8e8;
  border-radius:10px;
	justify-content:center;
}

.p-product-points__item img {
  flex: 0 0 auto;
  height: min(60px, 4.4776vw);
}

.p-product-points__item p {
  font-size: min(20px, 1.4925vw);
  line-height: 1.8;
	font-weight:700;
}

.p-product-funnel-scroll-hint__text, .p-product-funnel-scroll-hint {
	display:none;
}
@media (max-width: 767px) {
  .p-product-funnel-scroll-area {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4vw;
  margin-right: calc(50% - 50vw);
	  padding-right: 5.3333333333vw;
	  scrollbar-color: var(--color-primary) #dcdcdc;
}
	
	.p-product-funnel-scroll-area::-webkit-scrollbar {
  height: 0.8vw;
}
.p-product-funnel-scroll-area::-webkit-scrollbar-track {
  background: #dcdcdc;
  border-radius: 0.4vw;
}
.p-product-funnel-scroll-area::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 0.4vw;
}
	
	.p-product-funnel-scroll-wrap {
	  position: relative;
  }

 .p-product-funnel-scroll-hint {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40vw;
  height: 26.6666666667vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.6666666667vw;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 2.6666666667vw;
  color: #fff;
  z-index: 5;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

  .p-product-funnel-scroll-hint.is-hidden {
	  opacity: 0;
  }
  .p-product-funnel-scroll-hint__icon {
	  width: 21.4666666667vw;
	  height: auto;
  }
  .p-product-funnel-scroll-hint__text {
	  font-size: 3.2vw;
	  font-weight: 500;
	  line-height: 1;
	  display:inline-block;
  }

  .p-product-funnel-scroll-area {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4vw;
  margin-right: calc(50% - 50vw);
	  padding-right: 5.3333333333vw;
	  scrollbar-color: var(--color-primary) #dcdcdc;
}

  /* .p-product-funnel / .p-product-bridge / .p-product-points の3つを
     同じ横幅(1300px相当)にまとめて拡大する。中の.p-product-funnel__list
     (flex:1 1 50%)や.p-product-bridge__box--reach/--depth(width:50%/
     93.84%)はパーセント指定なので、親のこの横幅さえ揃えば、PCと同じ比率で
     自動的に650px相当・1219px相当…と正しいサイズになる。
     (以前は.p-product-funnel__listに直接widthを指定していたが、
     flex:1 1 50%のflex-basisと競合して無視され、崩れの原因になっていた) */
  .p-product-funnel,
  .p-product-bridge,
  .p-product-points {
    width: 173.3333333333vw;
  }

  /* ここから、ファネル表・間口奥行図・ポイントのSP用サイズ調整。
     PC側のpx数値はそのまま使い、vw = px ÷ 7.5 (750px基準)で換算している。
     750pxのときにPCのpx値と同じ大きさになり、750pxより狭い画面でも
     同じ比率を保ったまま縮小する(min()のような1340px基準の上限は付けない) */
  .p-product-funnel__labels {
    margin: 0 0 2.6666666667vw;
    font-size: 2.4vw;
  }

  .p-product-funnel__labels li {
    padding-bottom: 4.6666666667vw;
  }

  .p-product-funnel__labels li::after {
    border-left: 4vw solid transparent;
    border-right: 4vw solid transparent;
    border-top: 2.6666666667vw solid var(--color-primary);
  }

  .p-product-funnel__list {
    height: 29.8666666667vw;
  }

  .p-product-funnel__list_item {
    row-gap: 2vw;
  }

  .p-product-funnel__list_item img {
    width: 10.6666666667vw;
  }

  .p-product-funnel__list_item p {
    font-size: 2.4vw;
  }

  .p-product-bridge {
    margin-top: 5.3333333333vw;
  }

  .p-product-bridge__box {
    gap: 4vw;
    border-radius: 1.3333333333vw;
  }

  .p-product-bridge__box--reach {
    padding: 4vw 0 2vw;
  }

  .p-product-bridge__box--depth {
    padding: 6.6666666667vw 10vw 4vw 0;
    margin-top: -5.8666666667vw;
  }

  .p-product-bridge__label {
    font-size: 2.6666666667vw;
  }

  .p-product-bridge__label.famimatv {
    padding: 1.3333333333vw 13.3333333333vw;
  }

  .p-product-bridge__label.co-buy {
    padding: 1.3333333333vw 13.3333333333vw;
  }

  .p-product-bridge__box > .p-product-bridge__logo {
    max-width: 16vw;
  }

  .p-product-bridge__caption {
    font-size: 2.6666666667vw;
  }

  .p-product-points {
    gap: 5.3333333333vw;
    margin-top: 5.3333333333vw;
  }

  .p-product-points > img {
    width: 13.3333333333vw;
  }

  .p-product-points__item {
    gap: 5.3333333333vw;
    padding: 5.3333333333vw 8vw;
  }

  .p-product-points__item img {
    height: 8vw;
  }

  .p-product-points__item p {
    font-size: 2.6666666667vw;
  }
}

/* ====================================================================
   メディアの掛け合わせが生む効果（ベン図）
   ==================================================================== */
.p-product-effect {
  max-width: min(1300px, 97vw);
  margin: min(100px, 7.4626vw) auto 0;
  padding: min(80px, 5.97vw) min(100px, 7.4626vw);
  background: #f7f7f8;
}

@media (max-width: 767px) {
	.p-product-effect {
 max-width: unset;
	width:89.33333vw;
  margin: 13.33333vw auto 0;
  padding: 10.66667vw 0;
}
}

.p-product-heading.effect{
	display: flex;
  align-items: center;
  justify-content: center;
  gap: min(50px, 3.7313432836vw);
	padding-bottom:min(60px,4.4776vw);
}

.p-product-heading.effect:before,.p-product-heading.effect:after{
	content: "";
  flex: 1 1 auto;
  height: 2px;
  background: #dcdddd;
}

@media (max-width: 767px) {
	.p-product-heading.effect{
		flex-direction:column;
  gap: 5.3333vw;
	padding:0 5.3333vw 8vw;
}
	
	.p-product-heading.effect:before,.p-product-heading.effect:after{
	width:100%;
}
}

.p-product-effect-inner{
	display:flex;
	gap:min(60px,4.4776vw);
	justify-content:center;
}

@media (max-width: 767px) {
	.p-product-effect-inner{
	flex-direction:column;
	gap:6.666667vw;
	align-items:center;
	justify-content:flex-start;
}
}

.p-product-effect-venn{
	display:flex;
	flex-direction:column;
	width:min(620px,46.26vw);
}

@media (max-width: 767px) {
	.p-product-effect-venn{
	width:78.66667vw;
}
}

.p-product-effect-venn-main{
display:flex;
	justify-content:center;
	gap:min(85px,6.3432vw);
	background:url(../images/product/multi_media_effect_img.png) center center / contain no-repeat;
	width:min(620px,46.2686vw);
	height:min(400px,29.85vw);
	padding-top:min(130px,9.7vw);
}

@media (max-width: 767px) {
	.p-product-effect-venn-main{
	gap:10.66667vw;
	background:url(../images/product/multi_media_effect_img.png) center center / contain no-repeat;
	width:78.66667vw;;
	height:51vw;
	padding-top:16.66667vw;
}
}

.p-product-effect-venn-main>p{
	font-size:min(24px,1.791vw);
	color:var(--color-secondary);
	text-align:center;
	font-weight:700;
	line-height:1.4;
}

.p-product-effect-venn-main>p>.strong_number{
	font-size:min(60px,4.4776vw);
	font-family: var(--font-en);
}

.p-product-effect-venn-main>p>.strong_text{
	font-size:min(40px,2.985vw);
}

.p-product-effect-venn-main>.effect-venn-main_exception{
	color:#222222;
	font-size:min(30px,2.2388vw);
}

@media (max-width: 767px) {
	.p-product-effect-venn-main>p{
	font-size:3vw;
}
	
	.p-product-effect-venn-main>p>.strong_number{
	font-size:7.6vw;
}
	
	.p-product-effect-venn-main>p>.strong_text{
	font-size:5vw;
}
	
	.p-product-effect-venn-main>.effect-venn-main_exception{
	font-size:3.8vw;
}
}

.p-product-effect-venn-sub {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: min(140px, 10.4477611940vw);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: #dcdcdc;
  margin-left: min(-16px, -1.1940298507vw);
  text-align: center;
	margin:auto;
	font-size:min(18px,1.3432vw);
	font-weight:700;
	line-height:1.4;
	padding-top:min(12px,0.89552vw);
}

@media (max-width: 767px) {
	.p-product-effect-venn-sub {
		width: 17.7333vw;
		font-size:2.2666667vw;
	}
}
.p-product-effect-venn-sub>p>.strong_number{
font-size:2.77778em;
	line-height:1;
	vertical-align:bottom;
}

@media (max-width: 767px) {
	.p-product-effect-venn-sub>p>.strong_number{
font-size:6.4vw;
}
}

.p-product-effect-venn-sub>p>.strong_text{
font-size:1.66667em;
}

@media (max-width: 767px) {
	..p-product-effect-venn-sub>p>.strong_text{
font-size:3.8vw;
}
}

.p-product-effect__stat {
  margin-top: min(148px, 11vw);
}

@media (max-width: 767px) {
	.p-product-effect__stat {
  margin-top: 0;
}
}

.p-product-effect__stat-text.top{
  font-size: min(40px, 2.9850746269vw);
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 767px) {
	.p-product-effect__stat-text.top{
  font-size: 6.66667vw;
}
}

.p-product-effect__stat-text.flex{
	display:flex;
	align-items:flex-start;
}

.p-product-effect__stat-text.bottom{
  font-size: min(40px, 2.9850746269vw);
  font-weight: 700;
  line-height: 1;
margin-top:min(48px,3.582vw);
}

@media (max-width: 767px) {
	.p-product-effect__stat-text.bottom{
  font-size: 6.66667vw;
margin-top:6.666667vw;
}
}

.p-product-effect__stat-text.flex>strong{
display:flex;
align-items:center;
	padding-top:min(6px,0.4477611vw);
	padding-left:min(7px,0.522388vw);
	padding-right:min(7px,0.522388vw);
	background: linear-gradient(
    transparent 65%,
    var(--color-primary) 65%,
    var(--color-primary) 80%,
    transparent 80%
  );
}

@media (max-width: 767px) {
	.p-product-effect__stat-text.flex>strong{
	padding-top:0.4477611vw;
	padding-left:0.522388vw;
	padding-right:0.522388vw;
	background: linear-gradient(
    transparent 65%,
    var(--color-primary) 65%,
    var(--color-primary) 80%,
    transparent 80%
  );
}
}


.p-product-effect__stat-text.flex>strong>span{
font-family: var(--font-sans);
  font-size: min(60px, 4.4776119403vw);
  line-height: 1;
}

@media (max-width: 767px) {
	.p-product-effect__stat-text.flex>strong>span{
	font-size:9.33333vw;
	margin-bottom:3vw;
}
}

.p-product-effect__stat-text.flex>strong>.strong-num_seven{
font-family: var(--font-en);
  font-size: min(160px, 11.94vw);
	line-height:1;
	padding-top:0;
}

@media (max-width: 767px) {
	.p-product-effect__stat-text.flex>strong>.strong-num_seven{
	font-size: 17.33333vw;
		margin-bottom:0;
}
}

.p-product-effect__stat-note {
  margin-top: min(8px, 0.5970149254vw);
  font-size: min(14px, 1.004477vw);
  color: #222222;
	text-align:center;
}

@media (max-width: 767px) {
	.p-product-effect__stat-note {
  font-size: 3.2vw;
}
}
/* ====================================================================
   ファミマTV：写真2枚
   ==================================================================== */
.p-product-panel--famimatv{
	padding:min(100px,7.46268vw) 0;
	
}

@media (max-width: 767px) {
	.p-product-panel--famimatv{
	padding:13.3333vw 0;
}
}

.p-product-photos {
  display: flex;
  gap: min(30px, 2.2388vw);
  max-width: min(1300px, 97vw);
  margin: min(42px, 3.13432vw) auto 0;
}

@media (max-width: 767px) {
	.p-product-photos {
  gap: 7.3333vw;
  max-width: unset;
	width:90.66667vw;
  margin: 10.666667vw auto 0;
		flex-direction:column;
}
}


.p-product-photos__item {
  flex: 1 1 0;
  margin: 0;
}

.p-product-photos__item figcaption {
  margin-top: min(20px, 1.492537vw);
  font-size: min(19.6px, 1.48vw);
  color: #222222;
	padding-left:min(20px, 1.492537vw);
	border-left:solid 5px var(--color-primary);
	font-weight:700;
}

@media (max-width: 767px) {
	.p-product-photos__item figcaption {
  margin-top: 4vw;
  font-size: 4vw;
	padding-left:4vw;
}
}


/* ====================================================================
   ファミマTV：3つの強み
   ==================================================================== */
.p-product-strengths {
  max-width: min(1300px, 97vw);
  margin: min(86px, 6.41791vw) auto 0;
	background-color:#f7f7f8;
	padding:min(60px,4.477611vw) min(100px,7.46268vw) min(80px,5.97vw);
}

@media (max-width: 767px) {
	.p-product-strengths {
  max-width: unset;
	width:100%;
  margin: 15.3333vw auto 0;
	padding:10.666667vw 5.33333vw 13.3333vw;
}
}

.p-product-heading.three_strong{
	font-size:min(40px,2.985vw);
	padding-bottom:0;
}

@media (max-width: 767px) {
	.p-product-heading.three_strong{
	font-size:6.666667vw;
}
}

.p-product-strength {
  margin-top: min(40px, 2.985vw);
  padding: min(50px, 3.7313vw);
  background: #fff;
}

@media (max-width: 767px) {
	.p-product-strength {
  margin-top: 6.66667vw;
  padding: 6.66667vw 5.3333vw 5.333333vw;
  background: #fff;
}
}

.p-product-strength__title {
  display: flex;
  align-items: center;
  gap: min(45px, 3.3582vw);
  font-size: min(30px, 2.2388vw);
  font-weight: 700;
	line-height:1;
}

@media (max-width: 767px) {
	.p-product-strength__title {
  gap: 4vw;
  font-size: 5.3333vw;
}
}

.p-product-strength__number {
  font-family: var(--font-en);
  font-size: min(50px, 3.73134vw);
	padding-top:min(10px,0.746268vw);
	background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
	line-height:0.5;
}

@media (max-width: 767px) {
	.p-product-strength__number {
  font-size: 8vw;
	padding-top:1.33333vw;
}
}

.p-product-strength__stats {
  display: flex;
  gap: min(20px, 1.49253vw);
  margin-top: min(25px, 1.86567vw);
}

@media (max-width: 767px) {
	.p-product-strength__stats {
		flex-direction:column;
  gap: 5.33333vw;
  margin-top: 5.33333vw;
}
}

.p-product-stat {
  flex: 1 1 0;
	display:flex;
	flex-direction:column;
  text-align: center;
	background-color:#f7f7f8;
	width:min(320px,23.88vw);
	height:min(333px,24.85vw);
}

@media (max-width: 767px) {
	.p-product-stat {
		flex: none;
	width:78.6666667vw;
	height:62.2666667vw;
}
	
	.p-product-stat.exception{
		height:56.9333vw;
}
}

.p-product-stat__icon.first{
  width: min(97px, 7.2388vw);
  margin: min(50px,3.7313vw) auto 0;
}

@media (max-width: 767px) {
	.p-product-stat__icon.first{
  width:20.6667vw;
  margin: 6.6667vw auto 0;
}
}


.impression_img_box{
	display:flex;
	gap:2px;
	margin:min(70px,5.22388vw) auto 0;
	align-items:flex-end;
}

.p-product-stat__icon.secound-left{
  width: min(31px, 2.3134vw);
}

.p-product-stat__icon.secound-right{
  width: min(114px, 8.50746vw);
}

@media (max-width: 767px) {
	.impression_img_box{
	margin:8vw auto 0;
}
	
	.p-product-stat__icon.secound-left{
  width: 7vw;
}
	
	.p-product-stat__icon.secound-right{
  width:26.4vw;
}
}


.p-product-stat__icon.third{
  width: min(104px, 7.76119vw);
  margin: min(50px,3.7313vw) auto 0;
}

@media (max-width: 767px) {
	.p-product-stat__icon.third{
  width: 22.13vw;
  margin:7.333333vw auto 0;
}
}

.p-product-stat__label {
  margin-top: min(30px, 2.2388vw);
  font-size: min(20px, 1.4925vw);
  font-weight: 700;
	line-height:1;
}

@media (max-width: 767px) {
.p-product-stat__label {
  margin-top: 5.33333vw;
  font-size: 4vw;
}
}


.p-product-stat__value {
  margin-top: min(15px, 1.1194vw);
  font-family: var(--font-en);
  font-size: min(60px, 4.477611vw);
  font-weight: 700;
    color: var(--color-black);
  line-height: 1;
}
.p-product-stat__value span {
  margin-left: 0.12em;
  font-size: min(35px, 2.61194vw);
	font-family: var(--font-sans);
}

@media (max-width: 767px) {
.p-product-stat__value {
  margin-top: 4vw;
  font-size: 10.666667vw;
}
.p-product-stat__value span {
  margin-left: 0.12em;
  font-size: 6.666667vw;
}
}

.p-product-stat__note {
  margin-top: min(7px, 0.522388vw);
  font-size: min(14px,1.04477vw);
  color: #222222;
	font-weight:500;
	line-height:1;
}

@media (max-width: 767px) {
.p-product-stat__note {
  margin-top: min(5px, 0.666667vw);
  font-size: min(24px,3.2vw);
}
}

.p-product-strength__bars {
  display: flex;
  gap: min(24px, 1.7910447761vw);
  margin-top: min(32px, 2.3880597015vw);
}

@media (max-width: 767px) {
.p-product-strength__bars {
flex-direction:column;
  gap: 5.3333333vw;
  margin-top: 5.3333333vw;
}
}

.p-product-bar {
  flex: 1 1 0;
    display: flex;
    flex-direction: column;
    text-align: center;
    background-color: #f7f7f8;
    width: min(320px, 23.88vw);
    height: min(375px, 27.985vw);
	padding:min(50px,3.73134vw) 0 min(30px,2.2388vw);
}

@media (max-width: 767px) {
.p-product-bar {
    width: 78.666667vw;
    height: 70.53333333vw;
	padding:6.666667vw 0;
	flex:none;
}
}

.p-product-bar__label {
  font-size: min(20px, 1.49253vw);
  font-weight: 700;
	line-height:1;
}

@media (max-width: 767px) {
.p-product-bar__label {
  font-size: 4vw;
}
}

.p-product-bar__up {
	  font-family: var(--font-en);
	font-size:min(35px, 2.61194vw);
	line-height:1;
	font-weight:700;
	margin-top:min(20px,1.492537vw);
	display:inline-flex;
	gap:5px;
	align-items:flex-end;
	justify-content:center;
}

@media (max-width: 767px) {
.p-product-bar__up {
	font-size:8vw;
	margin-top:4vw;
}
}

.p-product-bar__up span{
	vertical-align:bottom;
	line-height:0.5;
}

.p-product-bar__up strong {
  font-size: 2em;
	line-height:0.5;
}

.p-product-bar__up .average {
	writing-mode: vertical-rl;
	font-size:min(24px,1.791vw);
	font-family: var(--font-sans);
	line-height:1;
	font-weight:400;
}

@media (max-width: 767px) {
.p-product-bar__up .average {
	font-size:4.5333vw;
}
	
	.p-product-bar__up strong {
  font-size: 1.66667em;
}
}

.p-product-bar__chart {
  flex: 1 1 0;
  display: flex;
  align-items: flex-end;
	justify-content:center;
  gap: min(20px, 1.492537vw);
  height: min(167px, 12.4626vw);
	position:relative;
}


@media (max-width: 767px) {
.p-product-bar__chart {
  gap:4vw;
  height: 41.33vw;
}
}


.p-product-bar__bar.arrow{
	position:absolute;
	left:min(100px,7.46268vw);
	background-color:transparent;
	display:inline-block;
	width:min(81px,6.04477vw);
}

.p-product-bar__bar.arrow.first{
top:min(35px,2.6199vw);
}

.p-product-bar__bar.arrow.secound{
top:min(54px ,4vw);
}

.p-product-bar__bar.arrow.third{
top:min(60px,4.4776vw);
}

@media (max-width: 767px) {
.p-product-bar__bar.arrow{
	left:28.93333vw;
	width:16vw;
}	
	
.p-product-bar__bar.arrow.first{
top:5.33333vw;
}

.p-product-bar__bar.arrow.secound{
top:8.8vw;
}

.p-product-bar__bar.arrow.third{
top:10.26667vw;
}
}


.p-product-bar__bar {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: calc(var(--product-bar-value, 0) * 1%);
  background: #b5b5b5;
  color: #fff;
  font-size: min(20px, 1.492537vw);
	width:min(80px,5.97vw);
  font-weight: 400;
line-height:1;
	padding-bottom:5px;
}

.p-product-bar__bar.gray.first {
  height: min(65px, 4.8507462687vw);
}
.p-product-bar__bar.yellow.first {
  height: min(123px, 9.1791044776vw);
}
.p-product-bar__bar.gray.secound {
  height: min(60px, 4.4776119403vw);
}
.p-product-bar__bar.yellow.secound {
  height: min(105px, 7.835vw);
}
.p-product-bar__bar.gray.third {
  height: min(59px, 4.4029vw);
}
.p-product-bar__bar.yellow.third {
  height: min(99px, 7.388vw);
}

.p-product-bar__bar span{
font-size: 1.75em;
}

@media (max-width: 767px) {
.p-product-bar__bar {
  font-size: 4vw;
	width:17.3vw;
}
	
	.p-product-bar__bar span{
font-size: 1.8333333em;
}
	
.p-product-bar__bar.gray.first {
  height:13.6vw;
}
.p-product-bar__bar.yellow.first {
  height: 26.1333333vw;
}
.p-product-bar__bar.gray.secound {
  height: 12.8vw;
}
.p-product-bar__bar.yellow.secound {
  height: 22.53333vw;
}
.p-product-bar__bar.gray.third {
  height:12.53333vw;
	}
.p-product-bar__bar.yellow.third {
  height: 21.2vw;
}

.p-product-bar__bar span{
font-size: 1.75em;
}

}

.p-product-bar__bar.yellow {
  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
}

.p-product-bar__bar__bottom{
display:flex;
	gap:min(100px,7.46268vw);
}

.p-product-strength__note {
  font-size: min(16px, 1.194vw);
  line-height: 1.7;
  color: #222222;
	font-weight:700;
	margin-top: min(20px, 1.49253vw);
}

.p-product-strength__note span{
	 font-size: min(14px, 1.044776vw);
	font-weight:400;
}

@media (max-width: 767px) {
.p-product-strength__note {
  font-size: 3.466667vw;
	margin-top: 5.3333vw;
	padding:0 4.6vw;
	line-height:1.5;
}

.p-product-strength__note span{
	display:inline-block;
	 font-size: 3.2vw;
	line-height:1.5;
	margin-top:3vw;
}
}

.p-product-bar__legend {
  display: flex;
  gap: min(20px, 1.49253vw);
  padding: 0;
  list-style: none;
  font-size: min(18px, 1.34328vw);
	line-height:1;
	margin-top: min(4px, 0.2985vw);
}

@media (max-width: 767px) {
	.p-product-bar__legend {
  display: none;
}
}

.p-product-bar__legend li {
  position: relative;
  padding-left: min(45px, 3.3582vw);
display:inline-flex;
	align-items:center;
	line-height:1;
	font-weight:700;
}

.p-product-bar__legend li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: min(30px, 2.2388vw);
  height: min(30px, 2.2388vw);
  transform: translateY(-50%);
}

.p-product-bar__legend li.is-gray::before {
  background: #b5b5b5;
}
.p-product-bar__legend li.is-yellow::before {
  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
}

.p-product-strength.secound{
	padding-bottom:min(30px,2.2388vw);
}

@media (max-width: 767px) {
.p-product-strength.secound{
	margin-top:5.3333vw;
	padding-bottom:5.3333vw;
}
}

.p-product-verify {
  display: flex;
flex-direction:column;
  gap: min(20px, 1.49253vw);
  margin-top: min(30px, 2.2388vw);
  padding: 0;
  list-style: none;
}

@media (max-width: 767px) {
.p-product-verify{
	margin-top:5.3333vw;
	gap:5.33333vw;
}
}

.p-product-verify__item {
	display:flex;
	justify-content:flex-start;
	align-items:center;
  flex: 1 1 0;
	gap:min(30px, 2.2388vw);
  padding: min(20px, 1.49253vw);
  background:#f7f7f8;
  text-align: center;
	position:relative;
}

@media (max-width: 767px) {
.p-product-verify__item {
  flex: none;
	gap:4vw;
  padding: 4vw;
padding-bottom:20.4vw;
}
}

.p-product-verify__item img {
  width: min(80px, 5.97vw);
}

@media (max-width: 767px) {
.p-product-verify__item img {
  width: 13.3333vw;
}
}


.p-product-verify__title {
  font-size: min(24px, 1.791vw);
  font-weight: 700;
	line-height:1;
	text-align:left;
}

@media (max-width: 767px) {
.p-product-verify__title {
  font-size: 4vw;
}
}

.p-product-verify__text {
  margin-top: min(15px, 1.1194vw);
  font-size: min(18px, 1.34328vw);
  line-height: 1;
  color: #222222;
}

@media (max-width: 767px) {
.p-product-verify__text {
  margin-top: 0;
  font-size: 3.73333vw;
	position:absolute;
	bottom:6vw;
		left:4vw;
	text-align:left;
	line-height:1.5;
}
}

/* ====================================================================
   資料ダウンロードボタン
   ==================================================================== */
.p-product-download-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(500px, 37.3134vw);
  height: min(60px, 4.776119403vw);
  margin: min(40px, 2.985vw) auto 0;
  background:white;
  color: #222222;
  font-size: min(16px, 1.2686vw);
  font-weight: 500;
  transition: opacity 0.2s ease;
	border:solid 1px #222222;
	position:relative;
	line-height:1;
}

.p-product-download-button.co-buy{
	margin-bottom:min(160px,11.94vw);
}

.p-product-download-button span .en{
font-size:min(19px,1.4179vw);
}

@media (max-width: 767px) {
.p-product-download-button {
  width: 78.5vw;
  height:16vw;
  margin: 5.333vw auto 0;
  font-size: 3.46666667vw;
}
	
	.p-product-download-button span .en{
font-size:4vw;
}
}

.p-product-download-button__arrow{
	display: inline-grid;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: min(30px, 2.2388059701vw);
    height: min(30px, 2.2388059701vw);
    place-items: center;
    border-radius: 50%;
    background: var(--color-black);
    transition: filter 0.3s ease;
	position: absolute;
    top: 50%;
    right: min(22px, 1.6417910448vw);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.p-product-download-button__arrow:before{
display: block;
    width: min(12px, 0.8955223881vw);
    height: min(12px, 0.8955223881vw);
    content: "";
    background: url(../images/business/icon_arrow_white.webp) center / contain no-repeat;
}

.p-product-download-button:hover {
  background-color: #000;
  border-color: #000;
  color: #fff;
}
.p-product-download-button:hover .p-product-download-button__arrow {
  filter: invert(1);
}

@media (max-width: 767px) {
.p-product-download-button {
  width: 78.5vw;
  height:16vw;
  margin: 5.333vw auto 0;
  font-size: 3.46666667vw;
	text-align:center;
	line-height:1.4;
	border:solid 2px #222222;
}
	
	.p-product-download-button__arrow{
    width: 5.33333vw;
    height: 5.33333vw;
    right: 4vw;
}

.p-product-download-button__arrow:before{
    width: 2.266667vw;
    height:  2.266667vw;
}
	
	.p-product-funnel-scrollbar {
  display: none;
}

@media (max-width: 767px) {
  .p-product-funnel-scroll-area::-webkit-scrollbar {
  height: 0.2vw;
	  width:20vw;
}
.p-product-funnel-scroll-area::-webkit-scrollbar-track {
  background: #dcdcdc;
  border-radius: 0.4vw;
}
.p-product-funnel-scroll-area::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 0.4vw;
}
}

.p-product-download-button:hover {
  opacity: 0.75;
}
